import{B as e,P as t,_ as n,f as r,g as i,h as a,l as o}from"./runtime-core.esm-bundler-CZvn3YaB.js";import{t as s}from"./plugin-vue_export-helper-CxTVcLa7.js";var c=JSON.parse(`{"path":"/en/guide/code/jsfiddle/","title":"Js Fiddle | Guide","lang":"en-US","frontmatter":{"title":"Js Fiddle","icon":"bxl:jsfiddle","createTime":"2025/10/08 10:42:21","permalink":"/en/guide/code/jsfiddle/","description":"The theme supports embedding JS Fiddle in Markdown files. Configuration This feature is disabled by default. You can enable it in the configuration file. .vuepress/config.ts Syn...","head":[["script",{"type":"application/ld+json"},"{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"Article\\",\\"headline\\":\\"Js Fiddle\\",\\"image\\":[\\"\\"],\\"dateModified\\":\\"2025-10-09T07:46:05.000Z\\",\\"author\\":[]}"],["meta",{"property":"og:url","content":"https://theme-plume.vuejs.press/en/guide/code/jsfiddle/"}],["meta",{"property":"og:site_name","content":"Plume Theme"}],["meta",{"property":"og:title","content":"Js Fiddle"}],["meta",{"property":"og:description","content":"The theme supports embedding JS Fiddle in Markdown files. Configuration This feature is disabled by default. You can enable it in the configuration file. .vuepress/config.ts Syn..."}],["meta",{"property":"og:type","content":"article"}],["meta",{"property":"og:locale","content":"en-US"}],["meta",{"property":"og:locale:alternate","content":"zh-CN"}],["meta",{"property":"og:updated_time","content":"2025-10-09T07:46:05.000Z"}],["meta",{"property":"article:modified_time","content":"2025-10-09T07:46:05.000Z"}],["link",{"rel":"alternate","hreflang":"zh-cn","href":"https://theme-plume.vuejs.press/guide/code/jsfiddle/"}]]},"readingTime":{"minutes":0.48,"words":143},"git":{"createdTime":1759995965000,"updatedTime":1759995965000,"contributors":[{"name":"pengzhanbo","username":"pengzhanbo","email":"volodymyr@foxmail.com","commits":1,"avatar":"https://avatars.githubusercontent.com/pengzhanbo?v=4","url":"https://github.com/pengzhanbo"}],"changelog":[{"hash":"385059f214cb07fc9a098859e889432fb81f998b","time":1759995965000,"email":"volodymyr@foxmail.com","author":"pengzhanbo","message":"docs: update en docs (#708)"}]},"autoDesc":true,"filePathRelative":"en/guide/repl/jsFiddle.md","headers":[],"bulletin":false}`),l={name:`jsFiddle.md`},u={class:`code-block-title`,"data-title":`.vuepress/config.ts`},d={class:`code-block-title-bar`},f={class:`title`};function p(s,c,l,p,m,h){let g=e(`VPIcon`),_=e(`JSFiddleViewer`);return t(),r(`div`,null,[c[2]||=o(`p`,null,[i(`The theme supports embedding `),o(`a`,{href:`https://jsfiddle.net/`,target:`_blank`,rel:`noopener noreferrer`},`JS Fiddle`),i(` in Markdown files.`)],-1),c[3]||=o(`h2`,{id:`configuration`,tabindex:`-1`},[o(`a`,{class:`header-anchor`,href:`#configuration`},[o(`span`,null,`Configuration`)])],-1),c[4]||=o(`p`,null,`This feature is disabled by default. You can enable it in the configuration file.`,-1),o(`div`,u,[o(`div`,d,[o(`span`,f,[n(g,{provider:`iconify`,name:`vscode-icons:file-type-typescript`}),c[0]||=i(`.vuepress/config.ts`,-1)])]),c[1]||=a(`

export default defineUserConfig({
  theme: plumeTheme({
    markdown: {
      jsfiddle: true, 
    },
  })
})

`,1)]),c[5]||=a(`

Syntax

Basic Syntax

@[jsfiddle](user/id)

Extended Options

@[jsfiddle theme="dark" tab="js,css,html,result" height="500px"](user/id)

user: Username
id: JS Fiddle identifier
theme: Theme mode, options: "light" | "dark"
tab: Active tabs, options: "js" | "css" | "html" | "result", multiple values separated by ",". The order determines tab arrangement, defaults to js,css,html,result
height: Container height

Examples

Input:

@[jsfiddle](pengzhanbo/1xbwz2p9)

Output:

`,10),n(_,{width:`100%`,height:`400px`,source:`pengzhanbo/1xbwz2p9`,title:`JS Fiddle`,tab:`js,css,html,result`}),c[6]||=a(`

Input:

@[jsfiddle tab="result,js,css,html"](pengzhanbo/1xbwz2p9)

Output:

`,3),n(_,{width:`100%`,height:`400px`,source:`pengzhanbo/1xbwz2p9`,title:`JS Fiddle`,tab:`result,js,css,html`})])}var m=s(l,[[`render`,p]]);export{c as _pageData,m as default};