code-playpad 0.12.0 → 0.14.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/README.md +110 -7
  2. package/dist/THIRD-PARTY-NOTICES.txt +50 -0
  3. package/dist/boot-DW1YzgCY.js +6 -0
  4. package/dist/boot-nmFndPHW.js +11 -0
  5. package/dist/cdn.js +2 -2
  6. package/dist/{compiler-B408qd3N.js → compiler-A2mqXrqO.js} +1 -1
  7. package/dist/compiler-D7kIFltD.js +13 -0
  8. package/dist/compiler-license-manifest.json +12 -0
  9. package/dist/{cpp-xLJOrOXX.js → cpp-C8YnpTSR.js} +1 -1
  10. package/dist/{element-Dzhksh6_.js → element-BuS9dUwa.js} +41 -17
  11. package/dist/element.js +1 -1
  12. package/dist/index.js +1 -1
  13. package/dist/{java-DFiOVxDN.js → java-DkfYRvpA.js} +1 -1
  14. package/dist/{javascript-CLaHCZ8o.js → javascript-BSjoEAXh.js} +1 -1
  15. package/dist/next-9Fyfv6iD.js +1 -0
  16. package/dist/next-CO6N0Gb9.js +6 -0
  17. package/dist/next-tailwind.generated-BWL5i33i.js +6 -0
  18. package/dist/next-vendor.generated-DcyCefTD.js +6 -0
  19. package/dist/{pyodide-Cs-Kwccb.js → pyodide-ZBchw4qA.js} +1 -1
  20. package/dist/react-DI6SODv8.js +1 -0
  21. package/dist/react-DgCTfCMl.js +6 -0
  22. package/dist/react.d.ts +3 -1
  23. package/dist/react.js +1 -1
  24. package/dist/runtime/next/compiler.d.ts +29 -0
  25. package/dist/runtime/next-tailwind.generated.d.ts +1 -0
  26. package/dist/runtime/next-vendor.generated.d.ts +10 -0
  27. package/dist/runtime/next.d.ts +2 -0
  28. package/dist/runtime/preview-session.d.ts +34 -0
  29. package/dist/runtime/react/compiler.d.ts +26 -0
  30. package/dist/standalone.js +41 -17
  31. package/dist/{worker-runtime-tSXm-pPB.js → worker-runtime-Dd2eBtq3.js} +1 -1
  32. package/package.json +8 -4
  33. package/dist/react-ALhWeEZ5.js +0 -9
  34. package/dist/react-DmuIc3qw.js +0 -4
@@ -10,7 +10,7 @@ var e=[{id:`default-dark`,label:`One Dark`,mode:`dark`},{id:`monokai`,label:`Mon
10
10
  --cp-ok: ${n.ok};
11
11
  color-scheme: ${t};
12
12
  }`]:[]).join(`
13
- `)}async function d(e){try{return await g(e)}catch(t){return console.warn(`[code-playpad] CodeMirror unavailable, using plain textarea:`,t),_(e)}}var f=/* @__PURE__ */ new Map,p=/* @__PURE__ */ new Set,m=!1;function h(){m||(m=!0,queueMicrotask(()=>{m=!1;for(let e of p){let t=[...e.adoptedStyleSheets];e.adoptedStyleSheets=[],e.adoptedStyleSheets=t}}))}async function g(t){let[n,r,i,a,o,s,c]=await Promise.all([import(`@codemirror/view`),import(`@codemirror/state`),import(`@codemirror/commands`),import(`@codemirror/language`),import(`@codemirror/autocomplete`),import(`@codemirror/theme-one-dark`),import(`@lezer/highlight`)]),{EditorView:l,keymap:u,lineNumbers:d,highlightActiveLine:m,highlightActiveLineGutter:g,highlightSpecialChars:_,drawSelection:v,rectangularSelection:y,crosshairCursor:b}=n,{EditorState:x,Compartment:S}=r,{defaultKeymap:C,history:w,historyKeymap:T,indentWithTab:E}=i,{syntaxHighlighting:D,defaultHighlightStyle:O,HighlightStyle:k,indentOnInput:A,bracketMatching:j,foldGutter:M,foldKeymap:N}=a,{autocompletion:P,closeBrackets:F,closeBracketsKeymap:I,completionKeymap:L}=o,R=new S,z=new S,B=new S,V=f.get(`default-light`)??[l.theme({"&":{color:`#1f2328`,backgroundColor:`#ffffff`},".cm-gutters":{backgroundColor:`#f6f8fa`,color:`#8b949e`,border:`none`},".cm-activeLine":{backgroundColor:`#f6f8fa88`},".cm-activeLineGutter":{backgroundColor:`#eaeef2`},".cm-cursor":{borderLeftColor:`#1f2328`},"&.cm-focused .cm-selectionBackground, .cm-selectionBackground, ::selection":{backgroundColor:`#cfe3ff`}}),D(O,{fallback:!0})];f.set(`default-light`,V);let{tags:H}=c,U=(e,t)=>[l.theme({"&":{color:e.fg,backgroundColor:e.bg},".cm-content":{caretColor:e.fg},".cm-gutters":{backgroundColor:e.surface,color:e.muted,border:`none`},".cm-activeLine":{backgroundColor:e.activeLine},".cm-activeLineGutter":{backgroundColor:e.selection},".cm-cursor, .cm-dropCursor":{borderLeftColor:e.fg},"&.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection":{backgroundColor:e.selection},".cm-tooltip":{backgroundColor:e.surface,color:e.fg,border:`1px solid ${e.border}`},".cm-tooltip-autocomplete > ul > li[aria-selected]":{backgroundColor:e.selection,color:e.fg}},{dark:t}),D(k.define([{tag:[H.comment,H.meta],color:e.comment,fontStyle:`italic`},{tag:[H.keyword,H.operatorKeyword,H.modifier],color:e.keyword},{tag:[H.string,H.special(H.string),H.regexp],color:e.string},{tag:[H.number,H.bool,H.null,H.atom],color:e.number},{tag:[H.function(H.variableName),H.function(H.propertyName),H.definition(H.function(H.variableName))],color:e.fn},{tag:[H.typeName,H.className,H.namespace,H.tagName],color:e.type},{tag:[H.variableName,H.propertyName,H.attributeName],color:e.variable},{tag:H.invalid,color:e.keyword,textDecoration:`underline`}]))],W=(t,n)=>{let r=e.find(e=>e.id===n);if(!r?.colors)return t?s.oneDark:V;let i=f.get(r.id);return i||(i=U(r.colors,r.mode===`dark`),f.set(r.id,i)),i},G=u.of([{key:`Mod-Enter`,preventDefault:!0,run:()=>(t.onRun?.(),!0)},{key:`Shift-Enter`,preventDefault:!0,run:()=>(t.onRun?.(),!0)}]),K=t.dark,q=t.themeId,J=t.readOnly,Y=t.language??[],X=e=>x.create({doc:e,extensions:[d(),g(),_(),w(),M(),v(),x.allowMultipleSelections.of(!0),A(),j(),F(),P(),y(),b(),m(),G,u.of([...I,...C,...T,...N,...L,E]),l.lineWrapping,B.of(Y),R.of(W(K,q)),z.of(x.readOnly.of(J)),l.updateListener.of(e=>{e.startState.facet(l.styleModule)!==e.state.facet(l.styleModule)&&h(),e.docChanged&&t.onChange?.(e.state.doc.toString())})]}),Z=new l({parent:t.parent,state:X(t.doc)});p.add(Z.root),h();let Q=/* @__PURE__ */ new Map,$=t.name??``;return{fallback:!1,getCode:()=>Z.state.doc.toString(),setCode(e){Z.dispatch({changes:{from:0,to:Z.state.doc.length,insert:e}})},openFile(e,t){if(e===$)return;Q.set($,Z.state);let n=Q.get(e);Z.setState(n??X(t)),$=e,n&&Z.dispatch({effects:[R.reconfigure(W(K,q)),z.reconfigure(x.readOnly.of(J)),B.reconfigure(Y)]}),h()},fileCode(e,t){if(e===$)return Z.state.doc.toString();let n=Q.get(e);return n?n.doc.toString():t},forgetFiles(e){for(let t of[...Q.keys()])e.includes(t)||Q.delete(t)},setTheme(e,t){K=e,q=t,Z.dispatch({effects:R.reconfigure(W(K,q))})},setReadOnly(e){J=e,Z.dispatch({effects:z.reconfigure(x.readOnly.of(J))})},setLanguage(e){Y=e,Z.dispatch({effects:B.reconfigure(Y)})},focus:()=>Z.focus(),destroy(){p.delete(Z.root),Z.destroy()}}}function _(e){let t=document.createElement(`textarea`);t.className=`cp-fallback-editor`,t.spellcheck=!1,t.value=e.doc,t.readOnly=e.readOnly,t.addEventListener(`input`,()=>e.onChange?.(t.value)),t.addEventListener(`keydown`,t=>{(t.metaKey||t.ctrlKey)&&t.key===`Enter`&&(t.preventDefault(),e.onRun?.())}),e.parent.appendChild(t);let n=/* @__PURE__ */ new Map,r=e.name??``;return{fallback:!0,getCode:()=>t.value,setCode:e=>{t.value=e},openFile(e,i){e!==r&&(n.set(r,t.value),t.value=n.get(e)??i,r=e)},fileCode(e,i){return e===r?t.value:n.get(e)??i},forgetFiles(e){for(let t of[...n.keys()])e.includes(t)||n.delete(t)},setTheme:()=>{},setReadOnly:e=>{t.readOnly=e},setLanguage:()=>{},focus:()=>t.focus(),destroy:()=>t.remove()}}var v=/* @__PURE__ */ new Map,y=/* @__PURE__ */ new Map;function b(e,t){v.set(e,t)}function x(){return[...v.keys()]}function S(e){let t=y.get(e);if(t)return t;let n=v.get(e);if(!n)return Promise.reject(/* @__PURE__ */ Error(`Unknown runtime "${e}". Registered: ${x().join(`, `)||`none`}`));let r=n().catch(t=>{throw y.delete(e),t});return y.set(e,r),r}b(`python`,()=>import(`./pyodide-Cs-Kwccb.js`).then(e=>e.pythonRuntime)),b(`javascript`,()=>import(`./javascript-CLaHCZ8o.js`).then(e=>e.javascriptRuntime)),b(`typescript`,()=>import(`./javascript-CLaHCZ8o.js`).then(e=>e.typescriptRuntime)),b(`java`,()=>import(`./java-DFiOVxDN.js`).then(e=>e.javaRuntime)),b(`c`,()=>import(`./cpp-xLJOrOXX.js`).then(e=>e.cRuntime)),b(`cpp`,()=>import(`./cpp-xLJOrOXX.js`).then(e=>e.cppRuntime)),b(`react`,()=>import(`./react-DmuIc3qw.js`).then(e=>e.reactRuntime));var C=class extends Error{constructor(e=`Execution stopped`){super(e),this.name=`RunStopped`}},w=class extends Error{constructor(e=`Web Workers are unavailable in this page`){super(e),this.name=`WorkerUnavailable`}},T=/* @__PURE__ */ new WeakSet,E=String.raw`
13
+ `)}async function d(e){try{return await g(e)}catch(t){return console.warn(`[code-playpad] CodeMirror unavailable, using plain textarea:`,t),_(e)}}var f=/* @__PURE__ */ new Map,p=/* @__PURE__ */ new Set,m=!1;function h(){m||(m=!0,queueMicrotask(()=>{m=!1;for(let e of p){let t=[...e.adoptedStyleSheets];e.adoptedStyleSheets=[],e.adoptedStyleSheets=t}}))}async function g(t){let[n,r,i,a,o,s,c]=await Promise.all([import(`@codemirror/view`),import(`@codemirror/state`),import(`@codemirror/commands`),import(`@codemirror/language`),import(`@codemirror/autocomplete`),import(`@codemirror/theme-one-dark`),import(`@lezer/highlight`)]),{EditorView:l,keymap:u,lineNumbers:d,highlightActiveLine:m,highlightActiveLineGutter:g,highlightSpecialChars:_,drawSelection:v,rectangularSelection:y,crosshairCursor:b}=n,{EditorState:x,Compartment:S}=r,{defaultKeymap:C,history:w,historyKeymap:T,indentWithTab:E}=i,{syntaxHighlighting:D,defaultHighlightStyle:O,HighlightStyle:k,indentOnInput:A,bracketMatching:j,foldGutter:M,foldKeymap:N}=a,{autocompletion:P,closeBrackets:F,closeBracketsKeymap:I,completionKeymap:L}=o,R=new S,z=new S,B=new S,V=f.get(`default-light`)??[l.theme({"&":{color:`#1f2328`,backgroundColor:`#ffffff`},".cm-gutters":{backgroundColor:`#f6f8fa`,color:`#8b949e`,border:`none`},".cm-activeLine":{backgroundColor:`#f6f8fa88`},".cm-activeLineGutter":{backgroundColor:`#eaeef2`},".cm-cursor":{borderLeftColor:`#1f2328`},"&.cm-focused .cm-selectionBackground, .cm-selectionBackground, ::selection":{backgroundColor:`#cfe3ff`}}),D(O,{fallback:!0})];f.set(`default-light`,V);let{tags:H}=c,U=(e,t)=>[l.theme({"&":{color:e.fg,backgroundColor:e.bg},".cm-content":{caretColor:e.fg},".cm-gutters":{backgroundColor:e.surface,color:e.muted,border:`none`},".cm-activeLine":{backgroundColor:e.activeLine},".cm-activeLineGutter":{backgroundColor:e.selection},".cm-cursor, .cm-dropCursor":{borderLeftColor:e.fg},"&.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection":{backgroundColor:e.selection},".cm-tooltip":{backgroundColor:e.surface,color:e.fg,border:`1px solid ${e.border}`},".cm-tooltip-autocomplete > ul > li[aria-selected]":{backgroundColor:e.selection,color:e.fg}},{dark:t}),D(k.define([{tag:[H.comment,H.meta],color:e.comment,fontStyle:`italic`},{tag:[H.keyword,H.operatorKeyword,H.modifier],color:e.keyword},{tag:[H.string,H.special(H.string),H.regexp],color:e.string},{tag:[H.number,H.bool,H.null,H.atom],color:e.number},{tag:[H.function(H.variableName),H.function(H.propertyName),H.definition(H.function(H.variableName))],color:e.fn},{tag:[H.typeName,H.className,H.namespace,H.tagName],color:e.type},{tag:[H.variableName,H.propertyName,H.attributeName],color:e.variable},{tag:H.invalid,color:e.keyword,textDecoration:`underline`}]))],W=(t,n)=>{let r=e.find(e=>e.id===n);if(!r?.colors)return t?s.oneDark:V;let i=f.get(r.id);return i||(i=U(r.colors,r.mode===`dark`),f.set(r.id,i)),i},G=u.of([{key:`Mod-Enter`,preventDefault:!0,run:()=>(t.onRun?.(),!0)},{key:`Shift-Enter`,preventDefault:!0,run:()=>(t.onRun?.(),!0)}]),K=t.dark,q=t.themeId,J=t.readOnly,Y=t.language??[],X=e=>x.create({doc:e,extensions:[d(),g(),_(),w(),M(),v(),x.allowMultipleSelections.of(!0),A(),j(),F(),P(),y(),b(),m(),G,u.of([...I,...C,...T,...N,...L,E]),l.lineWrapping,B.of(Y),R.of(W(K,q)),z.of(x.readOnly.of(J)),l.updateListener.of(e=>{e.startState.facet(l.styleModule)!==e.state.facet(l.styleModule)&&h(),e.docChanged&&t.onChange?.(e.state.doc.toString())})]}),Z=new l({parent:t.parent,state:X(t.doc)});p.add(Z.root),h();let Q=/* @__PURE__ */ new Map,$=t.name??``;return{fallback:!1,getCode:()=>Z.state.doc.toString(),setCode(e){Z.dispatch({changes:{from:0,to:Z.state.doc.length,insert:e}})},openFile(e,t){if(e===$)return;Q.set($,Z.state);let n=Q.get(e);Z.setState(n??X(t)),$=e,n&&Z.dispatch({effects:[R.reconfigure(W(K,q)),z.reconfigure(x.readOnly.of(J)),B.reconfigure(Y)]}),h()},fileCode(e,t){if(e===$)return Z.state.doc.toString();let n=Q.get(e);return n?n.doc.toString():t},forgetFiles(e){for(let t of[...Q.keys()])e.includes(t)||Q.delete(t)},setTheme(e,t){K=e,q=t,Z.dispatch({effects:R.reconfigure(W(K,q))})},setReadOnly(e){J=e,Z.dispatch({effects:z.reconfigure(x.readOnly.of(J))})},setLanguage(e){Y=e,Z.dispatch({effects:B.reconfigure(Y)})},focus:()=>Z.focus(),destroy(){p.delete(Z.root),Z.destroy()}}}function _(e){let t=document.createElement(`textarea`);t.className=`cp-fallback-editor`,t.spellcheck=!1,t.value=e.doc,t.readOnly=e.readOnly,t.addEventListener(`input`,()=>e.onChange?.(t.value)),t.addEventListener(`keydown`,t=>{(t.metaKey||t.ctrlKey)&&t.key===`Enter`&&(t.preventDefault(),e.onRun?.())}),e.parent.appendChild(t);let n=/* @__PURE__ */ new Map,r=e.name??``;return{fallback:!0,getCode:()=>t.value,setCode:e=>{t.value=e},openFile(e,i){e!==r&&(n.set(r,t.value),t.value=n.get(e)??i,r=e)},fileCode(e,i){return e===r?t.value:n.get(e)??i},forgetFiles(e){for(let t of[...n.keys()])e.includes(t)||n.delete(t)},setTheme:()=>{},setReadOnly:e=>{t.readOnly=e},setLanguage:()=>{},focus:()=>t.focus(),destroy:()=>t.remove()}}var v=/* @__PURE__ */ new Map,y=/* @__PURE__ */ new Map;function b(e,t){v.set(e,t)}function x(){return[...v.keys()]}function S(e){let t=y.get(e);if(t)return t;let n=v.get(e);if(!n)return Promise.reject(/* @__PURE__ */ Error(`Unknown runtime "${e}". Registered: ${x().join(`, `)||`none`}`));let r=n().catch(t=>{throw y.delete(e),t});return y.set(e,r),r}b(`python`,()=>import(`./pyodide-ZBchw4qA.js`).then(e=>e.pythonRuntime)),b(`javascript`,()=>import(`./javascript-BSjoEAXh.js`).then(e=>e.javascriptRuntime)),b(`typescript`,()=>import(`./javascript-BSjoEAXh.js`).then(e=>e.typescriptRuntime)),b(`java`,()=>import(`./java-DkfYRvpA.js`).then(e=>e.javaRuntime)),b(`c`,()=>import(`./cpp-C8YnpTSR.js`).then(e=>e.cRuntime)),b(`cpp`,()=>import(`./cpp-C8YnpTSR.js`).then(e=>e.cppRuntime)),b(`react`,()=>import(`./react-DI6SODv8.js`).then(e=>e.reactRuntime)),b(`next`,()=>import(`./next-9Fyfv6iD.js`).then(e=>e.nextRuntime));var C=class extends Error{constructor(e=`Execution stopped`){super(e),this.name=`RunStopped`}},w=class extends Error{constructor(e=`Web Workers are unavailable in this page`){super(e),this.name=`WorkerUnavailable`}},T=/* @__PURE__ */ new WeakSet,E=String.raw`
14
14
  :host {
15
15
  --cp-bg: #ffffff;
16
16
  --cp-fg: #1f2328;
@@ -340,6 +340,11 @@ table.cp-table th, table.cp-table td {
340
340
  table.cp-table th { background: var(--cp-bg); }
341
341
 
342
342
  .cp-progress {
343
+ /* Over the content, not above it: a bar that took space would move the preview when it
344
+ goes, and a moved frame misses clicks for a moment in Chrome. */
345
+ position: relative;
346
+ z-index: 1;
347
+ margin-bottom: -2px;
343
348
  height: 2px;
344
349
  background: linear-gradient(90deg, transparent, var(--cp-accent), transparent);
345
350
  background-size: 40% 100%;
@@ -369,6 +374,19 @@ table.cp-table th { background: var(--cp-bg); }
369
374
  border: 0;
370
375
  background: #ffffff;
371
376
  }
377
+ .cp-next-bar {
378
+ display: flex;
379
+ gap: 4px;
380
+ align-items: center;
381
+ height: 32px;
382
+ box-sizing: border-box;
383
+ padding: 3px 6px;
384
+ background: var(--cp-surface);
385
+ border-bottom: 1px solid var(--cp-border);
386
+ }
387
+ .cp-next-bar button { flex: none; width: 24px; height: 24px; padding: 0; cursor: pointer; }
388
+ .cp-next-bar input { flex: 1 1 auto; min-width: 0; height: 24px; box-sizing: border-box; padding: 0 8px; font: 12px ui-monospace, monospace; }
389
+ .cp-next-bar + .cp-preview-frame { height: calc(100% - 32px); }
372
390
  .cp-preview-banner {
373
391
  position: absolute;
374
392
  left: 0;
@@ -463,14 +481,19 @@ table.cp-table th { background: var(--cp-bg); }
463
481
  :host([data-window]) .cp-source { flex: 1 1 0; display: flex; flex-direction: column; }
464
482
  :host([data-window]) .cp-has-tree .cp-source { display: grid; }
465
483
  :host([data-window]) .cp-preview-pane { flex: 1 1 0; }
484
+ :host([data-window]) .cp-editor-sized .cp-source { flex: none; }
466
485
 
467
486
  /* file-view="tree": the files in a column beside the editor. */
468
487
  .cp-root.cp-has-tree { container-type: inline-size; }
469
488
  .cp-has-tree .cp-source {
470
489
  display: grid;
471
- grid-template-columns: var(--cp-tree-width, 200px) 7px minmax(0, 1fr);
490
+ grid-template-columns: min(var(--cp-tree-width, 200px), calc(100% - 167px)) 7px minmax(0, 1fr);
472
491
  grid-template-rows: 1fr auto;
473
492
  }
493
+ /* With a preview, the code gets its own row, so the tree shares only that. */
494
+ .cp-has-tree.cp-has-preview .cp-source { grid-template-columns: min(var(--cp-tree-width, 20%), calc(100% - 167px)) 7px minmax(0, 1fr); }
495
+ /* A sized row follows the divider, so a long tree scrolls instead of holding it open. */
496
+ .cp-editor-sized.cp-has-tree .cp-tabs.cp-tree { height: 0; min-height: 100%; }
474
497
  .cp-has-tree .cp-source > :not(.cp-tabs, .cp-split-tree) { grid-column: 3; }
475
498
  .cp-has-tree .cp-split-tree { display: block; grid-column: 2; grid-row: 1 / span 2; }
476
499
  .cp-tabs.cp-tree {
@@ -514,19 +537,20 @@ table.cp-table th { background: var(--cp-bg); }
514
537
  .cp-has-tree .cp-source { display: block; }
515
538
  .cp-has-tree .cp-split-tree { display: none; }
516
539
  .cp-tabs.cp-tree { max-height: 150px; border-bottom: 1px solid var(--cp-border); }
540
+ .cp-editor-sized.cp-has-tree .cp-tabs.cp-tree { height: auto; min-height: 0; }
517
541
  }
518
542
 
519
- /* Only a preview sits beside the code: a tree makes any widget a container. */
543
+ /* Only a preview sits beside the code, and only with no tree: three columns leave
544
+ the preview too little room. A tree makes any widget a container. */
520
545
  @container (min-width: 760px) {
521
- .cp-has-preview .cp-body { display: flex; align-items: stretch; }
522
- .cp-has-preview .cp-source { flex: 0 0 var(--cp-source-width, calc(50% - 4px)); min-width: 0; }
523
- .cp-has-preview .cp-preview-pane { flex: 1 1 0; min-width: 0; }
524
- .cp-has-preview .cp-preview { border-top: 0; }
525
- .cp-has-preview .cp-source:not(:has(.cp-tree)) { display: flex; flex-direction: column; }
526
- .cp-has-preview .cp-source:not(:has(.cp-tree)) .cp-editor { flex: 1 1 auto; }
527
- .cp-split.cp-split-main { width: 7px; height: auto; cursor: col-resize; border-width: 0 1px; }
528
- :host([data-window]) .cp-body { flex-direction: row; }
529
- :host([data-window]) .cp-source { flex: 0 0 var(--cp-source-width, calc(50% - 4px)); }
546
+ .cp-has-preview:not(.cp-has-tree) .cp-body { display: flex; align-items: stretch; }
547
+ .cp-has-preview:not(.cp-has-tree) .cp-source { display: flex; flex-direction: column; flex: 0 0 var(--cp-source-width, calc(50% - 4px)); min-width: 0; }
548
+ .cp-has-preview:not(.cp-has-tree) .cp-source .cp-editor { flex: 1 1 auto; }
549
+ .cp-has-preview:not(.cp-has-tree) .cp-preview-pane { flex: 1 1 0; min-width: 0; }
550
+ .cp-has-preview:not(.cp-has-tree) .cp-preview { border-top: 0; }
551
+ .cp-has-preview:not(.cp-has-tree) .cp-split.cp-split-main { width: 7px; height: auto; cursor: col-resize; border-width: 0 1px; }
552
+ :host([data-window]) .cp-root:not(.cp-has-tree) .cp-body { flex-direction: row; }
553
+ :host([data-window]) .cp-root:not(.cp-has-tree) .cp-source { flex: 0 0 var(--cp-source-width, calc(50% - 4px)); }
530
554
  }
531
555
 
532
556
  @keyframes cp-slide {
@@ -537,13 +561,13 @@ table.cp-table th { background: var(--cp-bg); }
537
561
  @media (prefers-reduced-motion: reduce) {
538
562
  .cp-progress { animation: none; background-position: 0 0; background-size: 100% 100%; opacity: 0.4; }
539
563
  }
540
- `,D=e=>()=>import(`@codemirror/lang-javascript`).then(t=>t.javascript(e)),O={py:()=>import(`@codemirror/lang-python`).then(e=>e.python()),pyi:()=>import(`@codemirror/lang-python`).then(e=>e.python()),js:D({}),mjs:D({}),cjs:D({}),jsx:D({jsx:!0}),ts:D({typescript:!0}),mts:D({typescript:!0}),cts:D({typescript:!0}),tsx:D({typescript:!0,jsx:!0}),json:()=>import(`@codemirror/lang-json`).then(e=>e.json()),css:()=>import(`@codemirror/lang-css`).then(e=>e.css()),html:()=>import(`@codemirror/lang-html`).then(e=>e.html()),c:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),h:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),cpp:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),cc:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),cxx:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),hpp:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),hxx:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),java:()=>import(`@codemirror/lang-java`).then(e=>e.java())};async function k(e,t){let n=e.includes(`.`)?e.slice(e.lastIndexOf(`.`)+1).toLowerCase():``,r=t===`react`&&n===`js`?O.jsx:O[n];return r?r().catch(()=>null):null}var A=`code-playpad`,j=1,M=`snippets`,N=`progress`,P=null;function F(){return typeof indexedDB>`u`?Promise.reject(/* @__PURE__ */ Error(`IndexedDB unavailable`)):(P||=new Promise((e,t)=>{let n=indexedDB.open(A,j);n.onupgradeneeded=()=>{let e=n.result;e.objectStoreNames.contains(M)||e.createObjectStore(M),e.objectStoreNames.contains(N)||e.createObjectStore(N,{keyPath:`id`})},n.onsuccess=()=>e(n.result),n.onerror=()=>t(n.error)}).catch(e=>{throw P=null,e}),P)}function I(e,t,n){return F().then(r=>new Promise((i,a)=>{let o=n(r.transaction(e,t).objectStore(e));o.onsuccess=()=>i(o.result),o.onerror=()=>a(o.error)}))}function L(e,t){return I(M,`readwrite`,n=>n.put(t,e)).then(()=>void 0)}function R(e){return I(M,`readonly`,t=>t.get(e)).then(e=>e??null)}function z(e){return I(M,`readwrite`,t=>t.delete(e)).then(()=>void 0)}function B(e,t={}){let n={completed:!0,...t,id:e,updatedAt:Date.now()};return I(N,`readwrite`,e=>e.put(n)).then(()=>n)}function V(e){return I(N,`readonly`,t=>t.get(e)).then(e=>e??null)}function H(){return I(N,`readonly`,e=>e.getAll())}var U=`code-playpad`;function W(e){let t=e.replace(/\t/g,` `).split(`
564
+ `,D=e=>()=>import(`@codemirror/lang-javascript`).then(t=>t.javascript(e)),O={py:()=>import(`@codemirror/lang-python`).then(e=>e.python()),pyi:()=>import(`@codemirror/lang-python`).then(e=>e.python()),js:D({}),mjs:D({}),cjs:D({}),jsx:D({jsx:!0}),ts:D({typescript:!0}),mts:D({typescript:!0}),cts:D({typescript:!0}),tsx:D({typescript:!0,jsx:!0}),json:()=>import(`@codemirror/lang-json`).then(e=>e.json()),css:()=>import(`@codemirror/lang-css`).then(e=>e.css()),html:()=>import(`@codemirror/lang-html`).then(e=>e.html()),c:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),h:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),cpp:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),cc:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),cxx:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),hpp:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),hxx:()=>import(`@codemirror/lang-cpp`).then(e=>e.cpp()),java:()=>import(`@codemirror/lang-java`).then(e=>e.java())};async function k(e,t){let n=e.includes(`.`)?e.slice(e.lastIndexOf(`.`)+1).toLowerCase():``,r=(t===`react`||t===`next`)&&n===`js`?O.jsx:O[n];return r?r().catch(()=>null):null}var A=`code-playpad`,j=1,M=`snippets`,N=`progress`,P=null;function F(){return typeof indexedDB>`u`?Promise.reject(/* @__PURE__ */ Error(`IndexedDB unavailable`)):(P||=new Promise((e,t)=>{let n=indexedDB.open(A,j);n.onupgradeneeded=()=>{let e=n.result;e.objectStoreNames.contains(M)||e.createObjectStore(M),e.objectStoreNames.contains(N)||e.createObjectStore(N,{keyPath:`id`})},n.onsuccess=()=>e(n.result),n.onerror=()=>t(n.error)}).catch(e=>{throw P=null,e}),P)}function I(e,t,n){return F().then(r=>new Promise((i,a)=>{let o=n(r.transaction(e,t).objectStore(e));o.onsuccess=()=>i(o.result),o.onerror=()=>a(o.error)}))}function L(e,t){return I(M,`readwrite`,n=>n.put(t,e)).then(()=>void 0)}function R(e){return I(M,`readonly`,t=>t.get(e)).then(e=>e??null)}function z(e){return I(M,`readwrite`,t=>t.delete(e)).then(()=>void 0)}function B(e,t={}){let n={completed:!0,...t,id:e,updatedAt:Date.now()};return I(N,`readwrite`,e=>e.put(n)).then(()=>n)}function V(e){return I(N,`readonly`,t=>t.get(e)).then(e=>e??null)}function H(){return I(N,`readonly`,e=>e.getAll())}var U=`code-playpad`;function W(e){let t=e.replace(/\t/g,` `).split(`
541
565
  `);for(;t.length&&t[0].trim()===``;)t.shift();for(;t.length&&t[t.length-1].trim()===``;)t.pop();let n=t.filter(e=>e.trim()!==``).reduce((e,t)=>Math.min(e,t.match(/^ */)[0].length),1/0);return(n===1/0?t:t.map(e=>e.slice(n))).join(`
542
- `)}var G=2e5,K=`playpad-file`,q={python:`main.py`,javascript:`main.js`,typescript:`main.ts`,java:`Main.java`,c:`main.c`,cpp:`main.cpp`,react:`src/main.jsx`};function J(e){return q[e]??`main.txt`}var Y=e=>e.tagName===`SCRIPT`&&e.getAttribute(`type`)===`text/plain`;function X(e){return[...e.children].filter(e=>e.tagName.toLowerCase()===K&&[...e.children].some(e=>!Y(e))).map(e=>e.getAttribute(`name`)??``)}function Z(e,t){let n={};for(let t of e.children){if(t.tagName.toLowerCase()!==K)continue;let e=t.getAttribute(`name`),r=[...t.children].find(Y);e&&(n[e]=W((r??t).textContent??``))}if(Object.keys(n).length)return n;let r=[...e.childNodes].filter(e=>e.nodeType!==Node.ELEMENT_NODE||e.tagName.toLowerCase()!==K),i=r.some(e=>e.nodeType===Node.ELEMENT_NODE),a=W(r.filter(e=>!(i&&e.nodeType===Node.TEXT_NODE&&!(e.textContent??``).trim())).map(e=>e.textContent??``).join(``));return{[t]:a}}function Q(e,t){try{let t=JSON.parse(e);if(t&&typeof t==`object`&&!Array.isArray(t)){let e=t;return Object.keys(e).length?e:null}}catch{}return e?{[t]:e}:null}var $=typeof HTMLElement>`u`?class{}:HTMLElement,ee=class extends ${static get observedAttributes(){return[`language`,`height`,`min-height`,`max-height`,`preview-height`,`file-view`,`open-file`,`theme`,`theme-controls`,`readonly`,`autorun`,`stdin`,`persist`,`entry`,`practice`]}#e;#t;#n;#r;#i;#a;#o;#s;#c;#l;#u=null;#d=null;#f=null;#p=null;#m={};#h={};#g=`main.py`;#_=null;#v;#y=!1;#b=null;#x=!1;#S=!1;#C=null;#w=null;#T=null;#E=()=>this.#fe();#D=null;#O=null;#k=!0;#A=[];#j=null;#M=null;#N=null;#P=0;#F=!1;#I=null;#L;#R;#z=null;#B=[];#V=/* @__PURE__ */ new Set;#H=null;#U=null;#W=null;constructor(){super(),this.#e=this.attachShadow({mode:`open`})}get code(){return this.#u?this.#u.getCode():this.#m[this.#g]??``}set code(e){this.#m[this.#g]=e,this.#Z()}get practice(){if(this.#I)return this.#I;let e=this.getAttribute(`practice`);if(!e)return null;try{return JSON.parse(e)}catch{return null}}set practice(e){this.#I=e}get files(){return this.#re()}set files(e){let t=Object.keys(e);if(!t.length)return;let n=Object.keys(this.#h);n.length===1&&!this.#h[n[0]]&&(this.#h={...e}),this.#m={...e},this.#B=[],t.includes(this.#g)||(this.#g=this.#te()),this.#u?.forgetFiles([]),this.#Z(),this.#ie(),this.#X()}get entry(){return this.#te()}set entry(e){this.setAttribute(`entry`,e)}openFile(e){if(e in this.#m){this.#u&&(this.#m[this.#g]=this.#u.getCode(),this.#u.openFile(e,this.#m[e]??``)),this.#g=e;for(let t=e.indexOf(`/`);t!==-1;t=e.indexOf(`/`,t+1))this.#V.delete(e.slice(0,t));this.#ie(),this.#X()}}get stdin(){return this.#l?this.#l.value:``}set stdin(e){this.#l&&(this.#l.value=e,this.#c.hidden=!1)}get language(){return this.getAttribute(`language`)||`python`}set language(e){this.setAttribute(`language`,e)}getCode(){return this.code}getFiles(){return this.#re()}reset(){this.#m={...this.#h},this.#g=this.#te(),this.#u?.forgetFiles([]),this.#Z(),this.#ie(),this.#he(),this.#s.hidden=!0,this.#se(),this.#z=null,this.#ce(),this.#me(this.#f?.ready?`${this.#f.label} ready`:``,`idle`)}async run(){if(this.#H)return this.#H.widget.run();if(this.#y)return;await this.#d;let e=this.#re(),t=this.getAttribute(`entry`);if(t&&!(t in e))return this.#$(t,e);this.#Q=!1;let n=this.#te(),r=e[n]??``;this.#y=!0,this.#x=!1,this.#n.disabled=!0,this.#r.hidden=!1,this.#he(),this.#s.hidden=!1;let i=this.practice;this.hasAttribute(`practice`)&&!i&&this.#ge(`The practice attribute is not valid JSON.
566
+ `)}var G=2e5,K=`playpad-file`,q={python:`main.py`,javascript:`main.js`,typescript:`main.ts`,java:`Main.java`,c:`main.c`,cpp:`main.cpp`,react:`src/main.jsx`,next:`app/page.jsx`};function J(e){return q[e]??`main.txt`}var Y=e=>e.tagName===`SCRIPT`&&e.getAttribute(`type`)===`text/plain`;function X(e){return[...e.children].filter(e=>e.tagName.toLowerCase()===K&&[...e.children].some(e=>!Y(e))).map(e=>e.getAttribute(`name`)??``)}function Z(e,t){let n={};for(let t of e.children){if(t.tagName.toLowerCase()!==K)continue;let e=t.getAttribute(`name`),r=[...t.children].find(Y);e&&(n[e]=W((r??t).textContent??``))}if(Object.keys(n).length)return n;let r=[...e.childNodes].filter(e=>e.nodeType!==Node.ELEMENT_NODE||e.tagName.toLowerCase()!==K),i=r.some(e=>e.nodeType===Node.ELEMENT_NODE),a=W(r.filter(e=>!(i&&e.nodeType===Node.TEXT_NODE&&!(e.textContent??``).trim())).map(e=>e.textContent??``).join(``));return{[t]:a}}function Q(e,t){try{let t=JSON.parse(e);if(t&&typeof t==`object`&&!Array.isArray(t)){let e=t;return Object.keys(e).length?e:null}}catch{}return e?{[t]:e}:null}var $=typeof HTMLElement>`u`?class{}:HTMLElement,ee=class extends ${static get observedAttributes(){return[`language`,`height`,`min-height`,`max-height`,`preview-height`,`tree-width`,`file-view`,`open-file`,`theme`,`theme-controls`,`readonly`,`autorun`,`stdin`,`persist`,`entry`,`practice`]}#e;#t;#n;#r;#i;#a;#o;#s;#c;#l;#u=null;#d=null;#f=null;#p=null;#m={};#h={};#g=`main.py`;#_=null;#v;#y=!1;#b=null;#x=!1;#S=!1;#C=null;#w=null;#T=null;#E=()=>this.#fe();#D=null;#O=null;#k=!0;#A=[];#j=null;#M=null;#N=null;#P=0;#F=!1;#I=null;#L;#R;#z=null;#B=[];#V=/* @__PURE__ */ new Set;#H=null;#U=null;#W=null;constructor(){super(),this.#e=this.attachShadow({mode:`open`})}get code(){return this.#u?this.#u.getCode():this.#m[this.#g]??``}set code(e){this.#m[this.#g]=e,this.#Z()}get practice(){if(this.#I)return this.#I;let e=this.getAttribute(`practice`);if(!e)return null;try{return JSON.parse(e)}catch{return null}}set practice(e){this.#I=e}get files(){return this.#re()}set files(e){let t=Object.keys(e);if(!t.length)return;let n=Object.keys(this.#h);n.length===1&&!this.#h[n[0]]&&(this.#h={...e}),this.#m={...e},this.#B=[],t.includes(this.#g)||(this.#g=this.#te()),this.#u?.forgetFiles([]),this.#Z(),this.#ie(),this.#X()}get entry(){return this.#te()}set entry(e){this.setAttribute(`entry`,e)}openFile(e){if(e in this.#m){this.#u&&(this.#m[this.#g]=this.#u.getCode(),this.#u.openFile(e,this.#m[e]??``)),this.#g=e;for(let t=e.indexOf(`/`);t!==-1;t=e.indexOf(`/`,t+1))this.#V.delete(e.slice(0,t));this.#ie(),this.#X()}}get stdin(){return this.#l?this.#l.value:``}set stdin(e){this.#l&&(this.#l.value=e,this.#c.hidden=!1)}get language(){return this.getAttribute(`language`)||`python`}set language(e){this.setAttribute(`language`,e)}getCode(){return this.code}getFiles(){return this.#re()}reset(){this.#m={...this.#h},this.#g=this.#te(),this.#u?.forgetFiles([]),this.#Z(),this.#ie(),this.#he(),this.#s.hidden=!0,this.#se(),this.#z=null,this.#ce(),this.#me(this.#f?.ready?`${this.#f.label} ready`:``,`idle`)}async run(){if(this.#H)return this.#H.widget.run();if(this.#y)return;await this.#d;let e=this.#re(),t=this.getAttribute(`entry`);if(t&&!(t in e))return this.#$(t,e);this.#Q=!1;let n=this.#te(),r=e[n]??``;this.#y=!0,this.#x=!1,this.#n.disabled=!0,this.#r.hidden=!1,this.#he(),this.#s.hidden=!1;let i=this.practice;this.hasAttribute(`practice`)&&!i&&this.#ge(`The practice attribute is not valid JSON.
543
567
  `,`cp-err`),this.#oe()&&(this.#z=e,this.#ce(),this.#B.length&&this.#ge(`${this.#B.join(`, `)}: HTML tags in this file's markup were read as elements, so its code is incomplete. Write < as &lt;, or put the code in <script type="text/plain">. A <script> left unescaped runs on the host page.\n`,`cp-err`)),this.#Se(`py-run`,{code:r,entry:n,files:e,language:this.language,...i?{practice:i}:{}});try{let t=await this.#Y();if(this.#x)throw new C;if(i&&!t.supportsPractice)throw Error(`Practice mode is not available for ${t.label}.`);this.#me(`Queued…`,`busy`),this.#o.hidden=!1;let a=t.run(r,{stdin:this.#l.value,files:e,entry:n,onStart:()=>this.#me(`Running…`,`busy`),onProgress:e=>this.#me(e.message,`busy`),onStdout:e=>this.#ge(e),onStderr:e=>this.#ge(e,`cp-err`),onEcho:e=>this.#ge(e,`cp-in`),onStdinRequest:()=>this.#ve(),...i?{practice:i}:{},...this.#oe()?{preview:{host:this.#L,onStart:()=>this.#me(`Running…`,`busy`),onConsole:(e,t)=>{this.#ge(`${t}\n`,e===`error`?`cp-err`:e===`warn`?`cp-warn`:void 0),this.#Ce(`playpad-console`,{level:e,text:t,language:this.language})},onRender:e=>this.#Ce(`playpad-render`,{rootText:e,language:this.language}),onError:e=>{this.#me(`Error`,`error`),this.#Se(`py-error`,{...e,language:this.language})}}}:{}});this.#b={runtime:t,run:a};let o=await a;if(o.table&&this.#xe(o.table),o.value!==void 0&&this.#ge(`${o.value}\n`,`cp-value`),o.hint&&this.#be(o.hint,T.has(o)),o.failed=t.statusDecidesFailure?o.failed===!0:!!o.stderr,o.failed)this.#me(`Error · ${o.durationMs} ms`,`error`),this.#Se(`py-error`,{message:o.problem?.message??o.stderr??``,hint:o.hint,language:this.language,...o.problem??{}});else if(o.cases){let e=o.cases.filter(e=>e.expected!==void 0).length,t=o.passed===e;this.#me(e?`${o.passed} of ${e} passed · ${o.durationMs} ms`:`Done in ${o.durationMs} ms`,t?`ok`:`error`)}else this.#me(`Done in ${o.durationMs} ms`,`ok`);return this.#Se(`py-output`,{...o,language:this.language}),o}catch(e){if(e instanceof C)this.#ge(`
544
568
  [stopped]
545
569
  `,`cp-err`),this.#me(`Stopped`,`error`);else{let t=e instanceof Error?e.message:String(e);this.#ge(t+`
546
- `,`cp-err`),this.#me(`Failed to start`,`error`),this.#Se(`py-error`,{message:t,language:this.language})}return}finally{this.#b=null,this.#ye(null),this.#_e(),this.#y=!1,this.#n.disabled=!1,this.#r.hidden=!(this.#oe()&&this.#f?.hasLivePreview?.(this.#L)),this.#o.hidden=!0}}stop(){this.#H?this.#H.widget.stop():this.#b?this.#b.runtime.stop?.(this.#b.run):this.#y?this.#x=!0:this.#oe()&&this.#f?.hasLivePreview?.(this.#L)&&(this.#se(),this.#r.hidden=!0,this.#me(`Stopped`,`idle`))}openWindow(){if(this.#H)return this.#H.window.focus(),!0;if(this.#U)return!1;let e=window.open(``,`_blank`,`popup,width=1280,height=800`);if(!e)return this.#me(`The browser blocked the new window`,`error`),!1;let t=this.#re(),n=this.#g,r=document.createElement(this.localName);for(let e of[`language`,`entry`,`file-view`,`preview-height`,`theme`,`theme-controls`,`readonly`,`stdin`]){let t=this.getAttribute(e);t!==null&&r.setAttribute(e,t)}r.setAttribute(`data-window`,``),r.#U=this,r.#W={...this.#h},r.#_=t,this.#se(),this.#r.hidden=!0,e.document.title=`Code playground`,e.document.documentElement.style.height=`100%`,e.document.body.style.cssText=`margin:0;height:100%`,e.document.body.append(r);let i=()=>this.closeWindow();return window.addEventListener(`pagehide`,i),this.#H={window:e,widget:r,onLeave:i,timer:setInterval(()=>{e.closed&&this.closeWindow()},300)},this.#e.querySelector(`.cp-root`)?.classList.add(`cp-popped`),r.#d?.then(()=>(r.openFile(n),r.run())),!0}closeWindow(){let e=this.#H;if(!e)return;this.#H=null,clearInterval(e.timer),window.removeEventListener(`pagehide`,e.onLeave);let{widget:t}=e,n=t.#re(),r=t.#g;t.#se(),t.remove(),e.window.closed||e.window.close(),this.#e.querySelector(`.cp-root`)?.classList.remove(`cp-popped`),this.files=n,this.openFile(r),this.#me(``,`idle`)}prewarm(){return this.#Y()}connectedCallback(){this.#F?(this.#fe(),this.#J()):!this.textContent?.trim()&&document.readyState===`loading`?document.addEventListener(`DOMContentLoaded`,()=>this.isConnected&&this.#G(),{once:!0}):this.#G()}disconnectedCallback(){this.#C?.disconnect(),this.#C=null,this.#w?.removeEventListener(`change`,this.#E),this.#w=null,this.#T?.disconnect(),this.#T=null,this.#D?.(),this.#D=null,this.#O&&clearTimeout(this.#O),this.#ye(null),setTimeout(()=>{this.isConnected||(this.closeWindow(),this.#se(),this.#u&&(this.#_=this.#re(),this.#u.destroy(),this.#u=null,this.#d=null,this.#F=!1))},0)}attributeChangedCallback(e,t,n){if(this.#F)switch(e){case`theme`:case`theme-controls`:this.#fe();break;case`height`:case`min-height`:case`max-height`:case`preview-height`:this.#pe();break;case`readonly`:this.#u?.setReadOnly(n!==null);break;case`stdin`:this.#c.hidden=n===null&&!this.#l.value;break;case`entry`:case`file-view`:this.#ie();break;case`language`:this.#se(),this.#e.querySelector(`.cp-root`)?.classList.toggle(`cp-has-preview`,this.#oe()),this.#f=null,this.#p=null,this.#S=!1,this.#Y().catch(()=>{})}}#G(){this.#F=!0,this.#h=this.#W??Z(this,this.#ee()),this.#B=this.#oe()?X(this):[],this.#m=this.#_??{...this.#h},this.#g=this.#ne(),this.#K(),this.#fe(),this.#pe();let e=this.getAttribute(`persist`);this.#d=(async()=>{if(e&&this.#_==null){let t=await R(e).catch(()=>null),n=t==null?null:Q(t,this.#ee());if(n){let e={},t=Object.keys(this.#h),r=Object.keys(n);for(let r of t)e[r]=n[r]??this.#h[r];t.length===1&&r.length===1&&!(t[0]in n)&&(e[t[0]]=n[r[0]]),this.#m=e,this.#g=this.#ne()}}this.#ie();let t=await S(this.language).catch(()=>null),n=t?await t.editorLanguage().catch(()=>null):null;this.#u=await d({parent:this.#t,doc:this.#m[this.#g]??``,name:this.#g,dark:this.#ue(),themeId:this.#de(),readOnly:this.hasAttribute(`readonly`),language:n,onRun:()=>void this.run(),onChange:e=>this.#le(e)}),this.#_=null,this.#fe(),this.#X()})(),this.#J()}#K(){let t=document.createElement(`style`);t.textContent=E;let n=document.createElement(`div`);n.className=this.#oe()?`cp-root cp-has-preview`:`cp-root`,n.innerHTML=`
570
+ `,`cp-err`),this.#me(`Failed to start`,`error`),this.#Se(`py-error`,{message:t,language:this.language})}return}finally{this.#b=null,this.#ye(null),this.#_e(),this.#y=!1,this.#n.disabled=!1,this.#r.hidden=!(this.#oe()&&this.#f?.hasLivePreview?.(this.#L)),this.#o.hidden=!0}}stop(){this.#H?this.#H.widget.stop():this.#b?this.#b.runtime.stop?.(this.#b.run):this.#y?this.#x=!0:this.#oe()&&this.#f?.hasLivePreview?.(this.#L)&&(this.#se(),this.#r.hidden=!0,this.#me(`Stopped`,`idle`))}openWindow(){if(this.#H)return this.#H.window.focus(),!0;if(this.#U)return!1;let e=window.open(``,`_blank`,`popup,width=1280,height=800`);if(!e)return this.#me(`The browser blocked the new window`,`error`),!1;let t=this.#re(),n=this.#g,r=document.createElement(this.localName);for(let e of[`language`,`entry`,`file-view`,`preview-height`,`tree-width`,`theme`,`theme-controls`,`readonly`,`stdin`]){let t=this.getAttribute(e);t!==null&&r.setAttribute(e,t)}r.setAttribute(`data-window`,``),r.#U=this,r.#W={...this.#h},r.#_=t,this.#se(),this.#r.hidden=!0,e.document.title=`Code playground`,e.document.documentElement.style.height=`100%`,e.document.body.style.cssText=`margin:0;height:100%`,e.document.body.append(r);let i=()=>this.closeWindow();return window.addEventListener(`pagehide`,i),this.#H={window:e,widget:r,onLeave:i,timer:setInterval(()=>{e.closed&&this.closeWindow()},300)},this.#e.querySelector(`.cp-root`)?.classList.add(`cp-popped`),r.#d?.then(()=>(r.openFile(n),r.run())),!0}closeWindow(){let e=this.#H;if(!e)return;this.#H=null,clearInterval(e.timer),window.removeEventListener(`pagehide`,e.onLeave);let{widget:t}=e,n=t.#re(),r=t.#g;t.#se(),t.remove(),e.window.closed||e.window.close(),this.#e.querySelector(`.cp-root`)?.classList.remove(`cp-popped`),this.files=n,this.openFile(r),this.#me(``,`idle`)}prewarm(){return this.#Y()}connectedCallback(){this.#F?(this.#fe(),this.#J()):!this.textContent?.trim()&&document.readyState===`loading`?document.addEventListener(`DOMContentLoaded`,()=>this.isConnected&&this.#G(),{once:!0}):this.#G()}disconnectedCallback(){this.#C?.disconnect(),this.#C=null,this.#w?.removeEventListener(`change`,this.#E),this.#w=null,this.#T?.disconnect(),this.#T=null,this.#D?.(),this.#D=null,this.#O&&clearTimeout(this.#O),this.#ye(null),setTimeout(()=>{this.isConnected||(this.closeWindow(),this.#se(),this.#u&&(this.#_=this.#re(),this.#u.destroy(),this.#u=null,this.#d=null,this.#F=!1))},0)}attributeChangedCallback(e,t,n){if(this.#F)switch(e){case`theme`:case`theme-controls`:this.#fe();break;case`height`:case`min-height`:case`max-height`:case`preview-height`:case`tree-width`:this.#pe();break;case`readonly`:this.#u?.setReadOnly(n!==null);break;case`stdin`:this.#c.hidden=n===null&&!this.#l.value;break;case`entry`:case`file-view`:this.#ie();break;case`language`:this.#se(),this.#e.querySelector(`.cp-root`)?.classList.toggle(`cp-has-preview`,this.#oe()),this.#f=null,this.#p=null,this.#S=!1,this.#Y().catch(()=>{})}}#G(){this.#F=!0,this.#h=this.#W??Z(this,this.#ee()),this.#B=this.#oe()?X(this):[],this.#m=this.#_??{...this.#h},this.#g=this.#ne(),this.#K(),this.#fe(),this.#pe();let e=this.getAttribute(`persist`);this.#d=(async()=>{if(e&&this.#_==null){let t=await R(e).catch(()=>null),n=t==null?null:Q(t,this.#ee());if(n){let e={},t=Object.keys(this.#h),r=Object.keys(n);for(let r of t)e[r]=n[r]??this.#h[r];t.length===1&&r.length===1&&!(t[0]in n)&&(e[t[0]]=n[r[0]]),this.#m=e,this.#g=this.#ne()}}this.#ie();let t=await S(this.language).catch(()=>null),n=t?await t.editorLanguage().catch(()=>null):null;this.#u=await d({parent:this.#t,doc:this.#m[this.#g]??``,name:this.#g,dark:this.#ue(),themeId:this.#de(),readOnly:this.hasAttribute(`readonly`),language:n,onRun:()=>void this.run(),onChange:e=>this.#le(e)}),this.#_=null,this.#fe(),this.#X()})(),this.#J()}#K(){let t=document.createElement(`style`);t.textContent=E;let n=document.createElement(`div`);n.className=this.#oe()?`cp-root cp-has-preview`:`cp-root`,n.innerHTML=`
547
571
  <div class="cp-toolbar">
548
572
  <button class="cp-primary" part="run-button" data-action="run">Run</button>
549
573
  <button class="cp-danger" part="stop-button" data-action="stop" hidden>Stop</button>
@@ -587,8 +611,8 @@ table.cp-table th { background: var(--cp-bg); }
587
611
  <div class="cp-split cp-split-console" role="separator" tabindex="0" aria-orientation="horizontal" aria-label="Resize the preview and the console"></div>
588
612
  <pre class="cp-output" part="output" hidden></pre>
589
613
  </div>
590
- </div>`,this.#e.replaceChildren(t,n),this.#n=n.querySelector(`[data-action="run"]`),this.#r=n.querySelector(`[data-action="stop"]`),this.#i=n.querySelector(`[data-action="reset"]`),this.#a=n.querySelector(`.cp-status`),this.#o=n.querySelector(`.cp-progress`),this.#v=n.querySelector(`.cp-tabs`),this.#t=n.querySelector(`.cp-editor`),this.#c=n.querySelector(`.cp-stdin`),this.#l=n.querySelector(`.cp-stdin textarea`),this.#s=n.querySelector(`.cp-output`),this.#L=n.querySelector(`.cp-preview`),this.#R=n.querySelector(`.cp-edited-note`),this.#oe()||n.querySelector(`.cp-source`).after(this.#s),this.#c.hidden=!this.hasAttribute(`stdin`),this.#l.addEventListener(`input`,()=>this.#c.classList.remove(`cp-attention`)),this.#v.addEventListener(`click`,e=>{let t=e.target,n=t.closest(`button[data-file]`);n&&this.openFile(n.getAttribute(`data-file`));let r=t.closest(`button[data-folder]`)?.dataset.folder;r!==void 0&&(this.#V.delete(r)||this.#V.add(r),this.#ie())}),this.#n.addEventListener(`click`,()=>void this.run()),this.#r.addEventListener(`click`,()=>this.stop()),this.#i.addEventListener(`click`,()=>this.reset()),n.querySelector(`[data-action="theme"]`).addEventListener(`click`,()=>{c({mode:this.#ue()?`light`:`dark`})}),n.querySelector(`.cp-theme-picker select`).addEventListener(`change`,t=>{let n=t.target.value,r=e.find(e=>e.id===n)?.mode;r&&c({mode:r,[r]:n})}),n.querySelector(`[data-action="window"]`).addEventListener(`click`,()=>this.openWindow()),n.querySelector(`[data-action="show-window"]`).addEventListener(`click`,()=>this.openWindow()),n.querySelector(`[data-action="close-window"]`).addEventListener(`click`,()=>this.closeWindow()),this.#q(n);let r=()=>void this.#Y().catch(()=>{});this.#t.addEventListener(`pointerdown`,r,{once:!0}),this.#t.addEventListener(`focusin`,r,{once:!0})}#q(e){let t=e.querySelector(`.cp-body`),n=e.querySelector(`.cp-source`),r=e.querySelector(`.cp-preview`),i=e.querySelector(`.cp-preview-pane`),a=this.#v,o=(e,t,n)=>Math.round(Math.max(t,Math.min(e,Math.max(t,n)))),s=(t,n)=>e.style.setProperty(t,`${n}px`),c=(t,n,r,i,a)=>{let o=()=>t.setAttribute(`aria-orientation`,n()===`x`?`vertical`:`horizontal`);t.addEventListener(`pointerdown`,a=>{a.preventDefault();let o=n()===`x`,s=o?a.clientX:a.clientY,c=r();t.setPointerCapture(a.pointerId),e.classList.add(`cp-dragging`,o?`cp-dragging-x`:`cp-dragging-y`);let l=e=>i(c+(o?e.clientX:e.clientY)-s),u=()=>{e.classList.remove(`cp-dragging`,`cp-dragging-x`,`cp-dragging-y`),t.removeEventListener(`pointermove`,l),t.removeEventListener(`pointerup`,u),t.removeEventListener(`pointercancel`,u)};t.addEventListener(`pointermove`,l),t.addEventListener(`pointerup`,u),t.addEventListener(`pointercancel`,u)}),t.addEventListener(`keydown`,e=>{let t={ArrowLeft:-24,ArrowUp:-24,ArrowRight:24,ArrowDown:24}[e.key];t&&(e.preventDefault(),i(r()+t))}),t.addEventListener(`dblclick`,a),t.addEventListener(`focus`,o),t.addEventListener(`pointerenter`,o)},l=()=>getComputedStyle(t).flexDirection===`row`&&getComputedStyle(t).display===`flex`;c(e.querySelector(`.cp-split-tree`),()=>`x`,()=>a.getBoundingClientRect().width,e=>s(`--cp-tree-width`,o(e,90,n.getBoundingClientRect().width-160)),()=>e.style.removeProperty(`--cp-tree-width`)),c(e.querySelector(`.cp-split-main`),()=>l()?`x`:`y`,()=>l()?n.getBoundingClientRect().width:this.#t.getBoundingClientRect().height,n=>{l()?s(`--cp-source-width`,o(n,200,t.getBoundingClientRect().width-200)):(s(`--cp-editor-height`,o(n,80,2e3)),e.classList.add(`cp-editor-sized`))},()=>{e.style.removeProperty(`--cp-source-width`),e.style.removeProperty(`--cp-editor-height`),e.classList.remove(`cp-editor-sized`)}),c(e.querySelector(`.cp-split-console`),()=>`y`,()=>r.getBoundingClientRect().height,e=>s(`--cp-preview-height`,o(e,60,l()||this.#U?i.getBoundingClientRect().height-40:2e3)),()=>e.style.removeProperty(`--cp-preview-height`))}#J(){this.#U||this.#C||typeof IntersectionObserver>`u`||(this.#C=new IntersectionObserver(e=>{e.some(e=>e.isIntersecting)&&(this.#C?.disconnect(),this.#C=null,this.#Y().then(()=>{this.hasAttribute(`autorun`)&&this.run()}).catch(()=>{}))},{rootMargin:`300px`}),this.#C.observe(this))}#Y(){return this.#p||=(async()=>{let e=await S(this.language);this.#f=e,!e.ready&&!this.#Q&&(this.#o.hidden=!1,this.#me(`Loading ${e.label}…`,`busy`));try{await e.load(e=>{!this.#y&&!this.#Q&&this.#me(e.message,e.phase===`ready`?`ok`:`busy`)})}catch(e){this.#p=null,this.#me(`Runtime unavailable`,`error`);let t=e instanceof Error?e.message:String(e);throw this.#ge(t+`
591
- `,`cp-err`),this.#s.hidden=!1,e}finally{this.#o.hidden=!0}return this.#X(),this.#S||(this.#S=!0,this.#Q||this.#me(`${e.label} ready`,`ok`),this.#Se(`py-ready`,{language:e.id,label:e.label})),e})(),this.#p}async#X(){if(!this.#u)return;let e=this.#g,t=await k(e,this.language);if(t){this.#g===e&&this.#u?.setLanguage(t);return}let n=e.includes(`.`)?null:await(this.#f??await S(this.language).catch(()=>null))?.editorLanguage().catch(()=>null);this.#g===e&&this.#u?.setLanguage(n??[])}#Z(){this.#u?this.#u.setCode(this.#m[this.#g]??``):this.#d?.then(()=>{this.#u?.setCode(this.#m[this.#g]??``),this.#ie()})}#Q=!1;#$(e,t){let n=Object.keys(t),r=`This widget's entry is "${e}", but it has no file of that name${n.length?` (its files: ${n.join(`, `)})`:``}. Set entry to one of its files.\n`;this.#he(),this.#s.hidden=!1,this.#ge(r,`cp-err`),this.#Q=!0,this.#me(`Error · entry not found`,`error`);let i={stdout:``,stderr:r,durationMs:0,failed:!0};return this.#Se(`py-error`,{message:r,language:this.language}),this.#Se(`py-output`,{...i,language:this.language}),i}#ee(){return this.getAttribute(`entry`)||J(this.language)}#te(){let e=Object.keys(this.#m),t=this.getAttribute(`entry`);if(t&&e.includes(t))return t;let n=this.#oe()&&e.includes(`index.html`)?`index.html`:J(this.language);return e.includes(n)?n:e[0]??n}#ne(){let e=this.getAttribute(`open-file`);return e&&e in this.#m?e:this.#te()}#re(){if(this.#H)return this.#H.widget.#re();let e={...this.#m};if(this.#u)for(let t of Object.keys(e))e[t]=this.#u.fileCode(t,e[t]);return e}#ie(){let e=Object.keys(this.#m);this.#v.hidden=e.length<2;let t=!this.#v.hidden&&this.getAttribute(`file-view`)===`tree`;if(this.#v.classList.toggle(`cp-tree`,t),this.#e.querySelector(`.cp-root`)?.classList.toggle(`cp-has-tree`,t),this.#v.hidden){this.#v.replaceChildren();return}if(t){this.#ae(e),this.#ce();return}let n=this.#te();this.#v.replaceChildren(...e.map(e=>{let t=document.createElement(`button`);t.dataset.file=e;let r=e.lastIndexOf(`/`)+1;if(r){let n=document.createElement(`span`);n.className=`cp-tab-folder`,n.textContent=e.slice(0,r),t.setAttribute(`aria-label`,e),t.append(n)}return t.append(e.slice(r)),t.setAttribute(`aria-pressed`,String(e===this.#g)),e===n&&(t.classList.add(`cp-entry`),t.title=`entry point — this is the file Run executes`),t})),this.#ce()}#ae(e){let t=this.#te(),n=[],r=(i,a)=>{let o=e.filter(e=>e.startsWith(i)).map(e=>e.slice(i.length)),s=[...new Set(o.filter(e=>e.includes(`/`)).map(e=>e.slice(0,e.indexOf(`/`))))].sort();for(let e of s){let t=i+e,o=!this.#V.has(t),s=document.createElement(`button`);s.className=`cp-tree-folder`,s.dataset.folder=t,s.textContent=e,s.setAttribute(`aria-expanded`,String(o)),s.style.setProperty(`--cp-depth`,String(a)),n.push(s),o&&r(`${t}/`,a+1)}for(let e of o.filter(e=>!e.includes(`/`)).sort()){let r=i+e,o=document.createElement(`button`);o.dataset.file=r,o.textContent=e,o.setAttribute(`aria-label`,r),o.setAttribute(`aria-pressed`,String(r===this.#g)),o.style.setProperty(`--cp-depth`,String(a)),r===t&&(o.classList.add(`cp-entry`),o.title=`entry point — this is the file Run executes`),n.push(o)}};r(``,0),this.#v.replaceChildren(...n)}#oe(){return this.language===`react`}#se(){this.#L&&(this.#f?.dispose?.(this.#L),this.#L.replaceChildren())}#ce(){if(!this.#oe())return;let e=this.#re();for(let t of this.#v.querySelectorAll(`button[data-file]`)){let n=t.dataset.file;t.classList.toggle(`cp-edited`,e[n]!==this.#h[n])}let t=this.#z;this.#R.hidden=!t||Object.keys(e).every(n=>e[n]===t[n])}#le(e){this.#m[this.#g]=e,this.#ce();let t=this.getAttribute(`persist`);if(!t)return;this.#O&&clearTimeout(this.#O);let n=JSON.stringify(this.#re());this.#O=setTimeout(()=>void L(t,n).catch(()=>{}),400)}#ue(){let e=this.getAttribute(`theme`)??`auto`;if(e===`dark`)return!0;if(e===`light`)return!1;let t=s().mode;if(t)return t===`dark`;let n=typeof document>`u`?``:getComputedStyle(document.documentElement).colorScheme,r=n.includes(`dark`);return r===n.includes(`light`)?!!this.#w?.matches:r}#de(){return s()[this.#ue()?`dark`:`light`]}#fe(){this.#D??=l(this.#E),!this.#w&&typeof matchMedia==`function`&&(this.#w=matchMedia(`(prefers-color-scheme: dark)`),this.#w.addEventListener(`change`,this.#E)),!this.#T&&typeof MutationObserver==`function`&&typeof document<`u`&&(this.#T=new MutationObserver(this.#E),this.#T.observe(document.documentElement,{attributes:!0,attributeFilter:[`class`,`style`,`data-theme`,`data-color-scheme`,`color-scheme`]}));let e=this.#ue(),t=this.#de();this.setAttribute(`data-resolved-theme`,e?`dark`:`light`),this.setAttribute(`data-editor-theme`,t),this.#u?.setTheme(e,t);let n=this.getAttribute(`theme`),r=n===`light`||n===`dark`||this.getAttribute(`theme-controls`)===`off`,i=this.#e.querySelector(`[data-action="theme"]`),a=this.#e.querySelector(`.cp-theme-picker`);if(i&&a){let n=e?`Switch to the light theme`:`Switch to the dark theme`;i.hidden=a.hidden=r,i.title=n,i.setAttribute(`aria-label`,n),a.querySelector(`select`).value=t}}#pe(){for(let[e,t]of[[`height`,`--cp-height`],[`min-height`,`--cp-min-height`],[`max-height`,`--cp-max-height`],[`preview-height`,`--cp-preview-height`]]){let n=this.getAttribute(e);n===null||n===``?this.style.removeProperty(t):this.style.setProperty(t,/^\d+$/.test(n)?`${n}px`:n)}}#me(e,t){this.#a.textContent=e,this.#a.dataset.state=t}#he(){this.#N&&clearTimeout(this.#N),this.#N=null,this.#A=[],this.#P=0,this.#s.replaceChildren(),this.#k=!0}#ge(e,t){if(!e)return;let n=t===`cp-err`&&!this.#k?`\n${e}`:e;this.#k=n.endsWith(`
614
+ </div>`,this.#e.replaceChildren(t,n),this.#n=n.querySelector(`[data-action="run"]`),this.#r=n.querySelector(`[data-action="stop"]`),this.#i=n.querySelector(`[data-action="reset"]`),this.#a=n.querySelector(`.cp-status`),this.#o=n.querySelector(`.cp-progress`),this.#v=n.querySelector(`.cp-tabs`),this.#t=n.querySelector(`.cp-editor`),this.#c=n.querySelector(`.cp-stdin`),this.#l=n.querySelector(`.cp-stdin textarea`),this.#s=n.querySelector(`.cp-output`),this.#L=n.querySelector(`.cp-preview`),this.#R=n.querySelector(`.cp-edited-note`),this.#oe()||n.querySelector(`.cp-source`).after(this.#s),this.#c.hidden=!this.hasAttribute(`stdin`),this.#l.addEventListener(`input`,()=>this.#c.classList.remove(`cp-attention`)),this.#v.addEventListener(`click`,e=>{let t=e.target,n=t.closest(`button[data-file]`);n&&this.openFile(n.getAttribute(`data-file`));let r=t.closest(`button[data-folder]`)?.dataset.folder;r!==void 0&&(this.#V.delete(r)||this.#V.add(r),this.#ie())}),this.#n.addEventListener(`click`,()=>void this.run()),this.#r.addEventListener(`click`,()=>this.stop()),this.#i.addEventListener(`click`,()=>this.reset()),n.querySelector(`[data-action="theme"]`).addEventListener(`click`,()=>{c({mode:this.#ue()?`light`:`dark`})}),n.querySelector(`.cp-theme-picker select`).addEventListener(`change`,t=>{let n=t.target.value,r=e.find(e=>e.id===n)?.mode;r&&c({mode:r,[r]:n})}),n.querySelector(`[data-action="window"]`).addEventListener(`click`,()=>this.openWindow()),n.querySelector(`[data-action="show-window"]`).addEventListener(`click`,()=>this.openWindow()),n.querySelector(`[data-action="close-window"]`).addEventListener(`click`,()=>this.closeWindow()),this.#q(n);let r=()=>void this.#Y().catch(()=>{});this.#t.addEventListener(`pointerdown`,r,{once:!0}),this.#t.addEventListener(`focusin`,r,{once:!0})}#q(e){let t=e.querySelector(`.cp-body`),n=e.querySelector(`.cp-source`),r=e.querySelector(`.cp-preview`),i=e.querySelector(`.cp-preview-pane`),a=this.#v,o=(e,t,n)=>Math.round(Math.max(t,Math.min(e,Math.max(t,n)))),s=(t,n)=>e.style.setProperty(t,`${n}px`),c=(t,n,r,i,a)=>{let o=()=>t.setAttribute(`aria-orientation`,n()===`x`?`vertical`:`horizontal`);t.addEventListener(`pointerdown`,a=>{a.preventDefault();let o=n()===`x`,s=o?a.clientX:a.clientY,c=r();t.setPointerCapture(a.pointerId),e.classList.add(`cp-dragging`,o?`cp-dragging-x`:`cp-dragging-y`);let l=e=>i(c+(o?e.clientX:e.clientY)-s),u=()=>{e.classList.remove(`cp-dragging`,`cp-dragging-x`,`cp-dragging-y`),t.removeEventListener(`pointermove`,l),t.removeEventListener(`pointerup`,u),t.removeEventListener(`pointercancel`,u)};t.addEventListener(`pointermove`,l),t.addEventListener(`pointerup`,u),t.addEventListener(`pointercancel`,u)}),t.addEventListener(`keydown`,e=>{let t={ArrowLeft:-24,ArrowUp:-24,ArrowRight:24,ArrowDown:24}[e.key];t&&(e.preventDefault(),i(r()+t))}),t.addEventListener(`dblclick`,a),t.addEventListener(`focus`,o),t.addEventListener(`pointerenter`,o)},l=()=>getComputedStyle(t).flexDirection===`row`&&getComputedStyle(t).display===`flex`;c(e.querySelector(`.cp-split-tree`),()=>`x`,()=>a.getBoundingClientRect().width,e=>s(`--cp-tree-width`,o(e,90,n.getBoundingClientRect().width-160)),()=>e.style.removeProperty(`--cp-tree-width`)),c(e.querySelector(`.cp-split-main`),()=>l()?`x`:`y`,()=>l()?n.getBoundingClientRect().width:this.#t.getBoundingClientRect().height,n=>{l()?s(`--cp-source-width`,o(n,200,t.getBoundingClientRect().width-200)):(s(`--cp-editor-height`,o(n,80,this.#U?t.getBoundingClientRect().height-100:2e3)),e.classList.add(`cp-editor-sized`))},()=>{e.style.removeProperty(`--cp-source-width`),e.style.removeProperty(`--cp-editor-height`),e.classList.remove(`cp-editor-sized`)}),c(e.querySelector(`.cp-split-console`),()=>`y`,()=>r.getBoundingClientRect().height,e=>s(`--cp-preview-height`,o(e,60,l()||this.#U?i.getBoundingClientRect().height-40:2e3)),()=>e.style.removeProperty(`--cp-preview-height`))}#J(){this.#U||this.#C||typeof IntersectionObserver>`u`||(this.#C=new IntersectionObserver(e=>{e.some(e=>e.isIntersecting)&&(this.#C?.disconnect(),this.#C=null,this.#Y().then(()=>{this.hasAttribute(`autorun`)&&this.run()}).catch(()=>{}))},{rootMargin:`300px`}),this.#C.observe(this))}#Y(){return this.#p||=(async()=>{let e=await S(this.language);this.#f=e,!e.ready&&!this.#Q&&(this.#o.hidden=!1,this.#me(`Loading ${e.label}…`,`busy`));try{await e.load(e=>{!this.#y&&!this.#Q&&this.#me(e.message,e.phase===`ready`?`ok`:`busy`)})}catch(e){this.#p=null,this.#me(`Runtime unavailable`,`error`);let t=e instanceof Error?e.message:String(e);throw this.#ge(t+`
615
+ `,`cp-err`),this.#s.hidden=!1,e}finally{this.#o.hidden=!0}return this.#X(),this.#S||(this.#S=!0,this.#Q||this.#me(`${e.label} ready`,`ok`),this.#Se(`py-ready`,{language:e.id,label:e.label})),e})(),this.#p}async#X(){if(!this.#u)return;let e=this.#g,t=await k(e,this.language);if(t){this.#g===e&&this.#u?.setLanguage(t);return}let n=e.includes(`.`)?null:await(this.#f??await S(this.language).catch(()=>null))?.editorLanguage().catch(()=>null);this.#g===e&&this.#u?.setLanguage(n??[])}#Z(){this.#u?this.#u.setCode(this.#m[this.#g]??``):this.#d?.then(()=>{this.#u?.setCode(this.#m[this.#g]??``),this.#ie()})}#Q=!1;#$(e,t){let n=Object.keys(t),r=`This widget's entry is "${e}", but it has no file of that name${n.length?` (its files: ${n.join(`, `)})`:``}. Set entry to one of its files.\n`;this.#he(),this.#s.hidden=!1,this.#ge(r,`cp-err`),this.#Q=!0,this.#me(`Error · entry not found`,`error`);let i={stdout:``,stderr:r,durationMs:0,failed:!0};return this.#Se(`py-error`,{message:r,language:this.language}),this.#Se(`py-output`,{...i,language:this.language}),i}#ee(){return this.getAttribute(`entry`)||J(this.language)}#te(){let e=Object.keys(this.#m),t=this.getAttribute(`entry`);if(t&&e.includes(t))return t;let n=this.#oe()&&e.includes(`index.html`)?`index.html`:J(this.language);return e.includes(n)?n:e[0]??n}#ne(){let e=this.getAttribute(`open-file`);return e&&e in this.#m?e:this.#te()}#re(){if(this.#H)return this.#H.widget.#re();let e={...this.#m};if(this.#u)for(let t of Object.keys(e))e[t]=this.#u.fileCode(t,e[t]);return e}#ie(){let e=Object.keys(this.#m);this.#v.hidden=e.length<2;let t=!this.#v.hidden&&this.getAttribute(`file-view`)===`tree`;if(this.#v.classList.toggle(`cp-tree`,t),this.#e.querySelector(`.cp-root`)?.classList.toggle(`cp-has-tree`,t),this.#v.hidden){this.#v.replaceChildren();return}if(t){this.#ae(e),this.#ce();return}let n=this.#te();this.#v.replaceChildren(...e.map(e=>{let t=document.createElement(`button`);t.dataset.file=e;let r=e.lastIndexOf(`/`)+1;if(r){let n=document.createElement(`span`);n.className=`cp-tab-folder`,n.textContent=e.slice(0,r),t.setAttribute(`aria-label`,e),t.append(n)}return t.append(e.slice(r)),t.setAttribute(`aria-pressed`,String(e===this.#g)),e===n&&(t.classList.add(`cp-entry`),t.title=`entry point — this is the file Run executes`),t})),this.#ce()}#ae(e){let t=this.#te(),n=[],r=(i,a)=>{let o=e.filter(e=>e.startsWith(i)).map(e=>e.slice(i.length)),s=[...new Set(o.filter(e=>e.includes(`/`)).map(e=>e.slice(0,e.indexOf(`/`))))].sort();for(let e of s){let t=i+e,o=!this.#V.has(t),s=document.createElement(`button`);s.className=`cp-tree-folder`,s.dataset.folder=t,s.textContent=e,s.setAttribute(`aria-expanded`,String(o)),s.style.setProperty(`--cp-depth`,String(a)),n.push(s),o&&r(`${t}/`,a+1)}for(let e of o.filter(e=>!e.includes(`/`)).sort()){let r=i+e,o=document.createElement(`button`);o.dataset.file=r,o.textContent=e,o.setAttribute(`aria-label`,r),o.setAttribute(`aria-pressed`,String(r===this.#g)),o.style.setProperty(`--cp-depth`,String(a)),r===t&&(o.classList.add(`cp-entry`),o.title=`entry point — this is the file Run executes`),n.push(o)}};r(``,0),this.#v.replaceChildren(...n)}#oe(){return this.language===`react`||this.language===`next`}#se(){this.#L&&(this.#f?.dispose?.(this.#L),this.#L.replaceChildren())}#ce(){if(!this.#oe())return;let e=this.#re();for(let t of this.#v.querySelectorAll(`button[data-file]`)){let n=t.dataset.file;t.classList.toggle(`cp-edited`,e[n]!==this.#h[n])}let t=this.#z;this.#R.hidden=!t||Object.keys(e).every(n=>e[n]===t[n])}#le(e){this.#m[this.#g]=e,this.#ce();let t=this.getAttribute(`persist`);if(!t)return;this.#O&&clearTimeout(this.#O);let n=JSON.stringify(this.#re());this.#O=setTimeout(()=>void L(t,n).catch(()=>{}),400)}#ue(){let e=this.getAttribute(`theme`)??`auto`;if(e===`dark`)return!0;if(e===`light`)return!1;let t=s().mode;if(t)return t===`dark`;let n=typeof document>`u`?``:getComputedStyle(document.documentElement).colorScheme,r=n.includes(`dark`);return r===n.includes(`light`)?!!this.#w?.matches:r}#de(){return s()[this.#ue()?`dark`:`light`]}#fe(){this.#D??=l(this.#E),!this.#w&&typeof matchMedia==`function`&&(this.#w=matchMedia(`(prefers-color-scheme: dark)`),this.#w.addEventListener(`change`,this.#E)),!this.#T&&typeof MutationObserver==`function`&&typeof document<`u`&&(this.#T=new MutationObserver(this.#E),this.#T.observe(document.documentElement,{attributes:!0,attributeFilter:[`class`,`style`,`data-theme`,`data-color-scheme`,`color-scheme`]}));let e=this.#ue(),t=this.#de();this.setAttribute(`data-resolved-theme`,e?`dark`:`light`),this.setAttribute(`data-editor-theme`,t),this.#u?.setTheme(e,t);let n=this.getAttribute(`theme`),r=n===`light`||n===`dark`||this.getAttribute(`theme-controls`)===`off`,i=this.#e.querySelector(`[data-action="theme"]`),a=this.#e.querySelector(`.cp-theme-picker`);if(i&&a){let n=e?`Switch to the light theme`:`Switch to the dark theme`;i.hidden=a.hidden=r,i.title=n,i.setAttribute(`aria-label`,n),a.querySelector(`select`).value=t}}#pe(){for(let[e,t]of[[`height`,`--cp-height`],[`min-height`,`--cp-min-height`],[`max-height`,`--cp-max-height`],[`preview-height`,`--cp-preview-height`]]){let n=this.getAttribute(e);n===null||n===``?this.style.removeProperty(t):this.style.setProperty(t,/^\d+$/.test(n)?`${n}px`:n)}let e=this.getAttribute(`tree-width`)?.trim();e?/^(\d+(px)?|\d+(\.\d+)?%)$/.test(e)?this.style.setProperty(`--cp-tree-width`,/\d$/.test(e)?`${e}px`:e):(this.style.removeProperty(`--cp-tree-width`),console.warn(`code-playpad: tree-width="${e}" is not a size. Use a percentage like "20%" or pixels like "240".`)):this.style.removeProperty(`--cp-tree-width`)}#me(e,t){this.#a.textContent=e,this.#a.dataset.state=t}#he(){this.#N&&clearTimeout(this.#N),this.#N=null,this.#A=[],this.#P=0,this.#s.replaceChildren(),this.#k=!0}#ge(e,t){if(!e)return;let n=t===`cp-err`&&!this.#k?`\n${e}`:e;this.#k=n.endsWith(`
592
616
  `),this.#A.push({text:n,className:t}),this.#N??=setTimeout(()=>this.#_e(),16)}#_e(){if(this.#N&&clearTimeout(this.#N),this.#N=null,!this.#A.length)return;let e=this.#A;this.#A=[];let t=document.createDocumentFragment(),n=``,r,i=()=>{if(!n)return;let e=document.createElement(`span`);r&&(e.className=r),e.textContent=n,t.appendChild(e),n=``};for(let t of e){if(this.#P>=G)break;let e=t.text;this.#P+e.length>G&&(e=e.slice(0,G-this.#P)+`
593
617
  … output truncated for display — the full text is in the playpad-output event
594
618
  `),this.#P+=t.text.length,r!==t.className&&(i(),r=t.className),n+=e}i(),this.#s.hidden=!1;let a=this.#s.querySelector(`.cp-prompt`);a?this.#s.insertBefore(t,a):this.#s.appendChild(t),this.#s.scrollTop=this.#s.scrollHeight}#ve(){return this.#_e(),this.#ye(null),new Promise(e=>{let t=document.createElement(`form`);t.className=`cp-prompt`;let n=document.createElement(`input`);n.type=`text`,n.setAttribute(`aria-label`,`Program input — press Enter to send`),n.autocapitalize=`off`,n.autocomplete=`off`,n.spellcheck=!1;let r=document.createElement(`button`);r.type=`submit`,r.className=`cp-send`,r.textContent=`⏎`,r.title=`Send this line (Enter)`;let i=document.createElement(`button`);i.type=`button`,i.className=`cp-eof`,i.textContent=`EOF`,i.title=`End of input (Ctrl-D) — makes input() raise EOFError`;let a=n=>{this.#j===e&&(this.#j=null,this.#M=null,t.remove(),n===null?this.#ge(`
package/dist/element.js CHANGED
@@ -1 +1 @@
1
- export{t as CodePlayPadElement,n as defineCodePlayPad}from"./element-Dzhksh6_.js";
1
+ export{t as CodePlayPadElement,n as defineCodePlayPad}from"./element-BuS9dUwa.js";
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- import{_ as e,a as t,c as n,d as r,f as i,g as a,h as o,i as s,m as c,n as l,o as u,p as d,r as f,s as p,t as m,u as h,v as g,y as _}from"./element-Dzhksh6_.js";import{t as v}from"./react-version.generated-BNNJmf7J.js";import{a as y,i as b,n as x,r as S,t as C,u as w}from"./config-DB58UVsk.js";export{m as CodePlayPadElement,a as EDITOR_THEMES,C as PYODIDE_VERSION,v as REACT_VERSION,h as RunStopped,r as WorkerUnavailable,f as allProgress,s as clearSnippet,x as configureCpp,S as configurePython,b as configureReact,y as configureTypeScript,o as createEditor,l as defineCodePlayPad,t as getProgress,i as getRuntime,e as getThemePreference,d as listRuntimes,u as loadSnippet,g as onThemePreferenceChange,w as pyodideAssetUrls,c as registerRuntime,p as saveSnippet,n as setProgress,_ as setThemePreference};
1
+ import{_ as e,a as t,c as n,d as r,f as i,g as a,h as o,i as s,m as c,n as l,o as u,p as d,r as f,s as p,t as m,u as h,v as g,y as _}from"./element-BuS9dUwa.js";import{t as v}from"./react-version.generated-BNNJmf7J.js";import{a as y,i as b,n as x,r as S,t as C,u as w}from"./config-DB58UVsk.js";export{m as CodePlayPadElement,a as EDITOR_THEMES,C as PYODIDE_VERSION,v as REACT_VERSION,h as RunStopped,r as WorkerUnavailable,f as allProgress,s as clearSnippet,x as configureCpp,S as configurePython,b as configureReact,y as configureTypeScript,o as createEditor,l as defineCodePlayPad,t as getProgress,i as getRuntime,e as getThemePreference,d as listRuntimes,u as loadSnippet,g as onThemePreferenceChange,w as pyodideAssetUrls,c as registerRuntime,p as saveSnippet,n as setProgress,_ as setThemePreference};