var Component=(()=>{var os=Object.create;var Xe=Object.defineProperty;var rs=Object.getOwnPropertyDescriptor;var ss=Object.getOwnPropertyNames;var is=Object.getPrototypeOf,as=Object.prototype.hasOwnProperty;var Ve=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports),cs=(e,t)=>{for(var n in t)Xe(e,n,{get:t[n],enumerable:!0})},yn=(e,t,n,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of ss(t))!as.call(e,r)&&r!==n&&Xe(e,r,{get:()=>t[r],enumerable:!(o=rs(t,r))||o.enumerable});return e};var vn=(e,t,n)=>(n=e!=null?os(is(e)):{},yn(t||!e||!e.__esModule?Xe(n,"default",{value:e,enumerable:!0}):n,e)),ls=e=>yn(Xe({},"__esModule",{value:!0}),e);var Fn=Ve((hc,kn)=>{kn.exports=_jsx_runtime});var En=Ve((mc,wn)=>{wn.exports=React});var xn=Ve((bc,Cn)=>{Cn.exports=ReactDOM});var Ho=Ve(W=>{"use strict";Object.defineProperty(W,"__esModule",{value:!0});var Ee=En(),us=xn();function ds(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var a=ds(Ee);function I(e,t){var n={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(n[o]=e[o]);if(e!=null&&typeof Object.getOwnPropertySymbols=="function")for(var r=0,o=Object.getOwnPropertySymbols(e);r/^#([A-Fa-f0-9]{3,4}){1,2}$/.test(e),ps=(e,t)=>e.match(new RegExp(`.{${t}}`,"g")),gs=e=>parseInt(e.repeat(2/e.length),16);function hs(e,t){return typeof e<"u"?e/255:typeof t!="number"||t<0||t>1?1:t}function ms(e){if(!e)return;if(!fs(e))throw new Error("Invalid color string, must be a valid hex color");let t=Math.floor((e.length-1)/3),n=ps(e.slice(1),t),[o,r,s,i]=n.map(gs);return{r:o,g:r,b:s,a:hs(i,1)}}function bs(e){if(!e)return;let{r:t,g:n,b:o,a:r}=e,s=Math.round(r*255);return`#${t.toString(16).padStart(2,"0")}${n.toString(16).padStart(2,"0")}${o.toString(16).padStart(2,"0")}${s.toString(16).padStart(2,"0")}`}function Ne(e,t){if(!e)return e;let{r:n,g:o,b:r,a:s}=ms(e);return bs({r:n,g:o,b:r,a:s*t})}function R(e,t){return{prev:t(e.prev,"prev"),next:t(e.next,"next")}}function Jn(e,t){return{prev:e?.prev===void 0?t:e.prev,next:e?.next===void 0?t:e.next}}function kt(e,t,n){return R(Jn(e,t),n)}function ys(e,t){return t(e.prev)||t(e.next)}function Qn(e){return e.lines.map(t=>t.tokens.map(n=>n.content).join("")).join(` `)}function vs(e,t){return Dt(e?Zn(e).map(eo):[...t.keys()].map(n=>({[n+1]:!0})))}function Zn(e){return e.split(/,(?![^\[]*\])/g)}function Dt(e){return e.reduce((t,n)=>Object.assign(t,n),{})}function ks(e){return!!e.match(/(\d+)\[(.+)\]/)}function eo(e){let t=e.match(/(\d+)\[(.+)\]/);if(t){let[,n,o]=t,r=o.split(",").map(to);return{[Number(n)]:r}}else return Dt(At(e).map(n=>({[n]:!0})))}function to(e){let[t,n]=e.split(":");if(!tt(t))throw new Ce(t);let o=Number(t);if(o<1)throw new nt;if(n){if(!tt(n))throw new Ce(n);return{start:o,end:+n}}else return{start:o,end:o}}function Fs(e,t){if(e){let n=no(e),o=Object.keys(n).map(r=>parseInt(r,10));return[Math.min(...o),Math.max(...o)]}else return[0,t.length-1]}function ws(e,t){if(e){let n=no(e);return Object.keys(n).map(r=>parseInt(r,10))}else return[...t.keys()]}function no(e){if(!e)throw new Error("Focus cannot be empty");try{let t=e.split(/,(?![^\[]*\])/g).map(Es);return Cs(t.flat())}catch(t){throw t}}function Es(e){let t=e.match(/(\d+)\[(.+)\]/);if(t){let[,n,o]=t,r=o.split(",").map(At),s=Number(n)-1,i=r.flat().map(c=>c-1);return[[s,i]]}else return At(e).map(n=>[n-1,!0])}function At(e){let[t,n]=e.split(":");if(!tt(t))throw new Ce(t);let o=Number(t);if(o<1)throw new nt;if(n){if(!tt(n))throw new Ce(n);let r=[];for(let s=o;s<=+n;s++)r.push(s);return r}else return[o]}function tt(e){e=e.toString();var t=Math.abs(e),n=parseInt(e,10);return!isNaN(t)&&n===t&&t.toString()===e}var nt=class extends Error{constructor(){super("Invalid line or column number in focus string"),Object.setPrototypeOf(this,new.target.prototype)}},Ce=class extends Error{constructor(t){super(`Invalid number "${t}" in focus string`),this.number=t,Object.setPrototypeOf(this,new.target.prototype)}};function Cs(e){let t={},n=-1,o=e==null?0:e.length;for(;++n!o.name&&!o.scope):void 0;return n?.settings}var so=typeof window<"u"?a.default.useLayoutEffect:a.default.useEffect;function Bs(e,t){let n=a.default.useRef(e);a.default.useEffect(()=>{n.current=e},[e]),a.default.useEffect(()=>{if(!t&&t!==0)return;let o=setInterval(()=>n.current(),t);return()=>clearInterval(o)},[t])}function Ft(e,t,n){return Math.min(Math.max(e,t),n)}var Ke=200;function Ds(e,t,n,o,r,s){let[i,c]=a.default.useState(null),u=Ss(),d=a.default.useRef(null),{prevLongestLine:f,nextLongestLine:g,element:y}=a.default.useMemo(()=>{let w=Dn(e.prev,t.prev),k=Dn(e.next,t.next),E=(e.prev||e.next).trimEnd().split(io),j=E.length;if(r){let x=r==="focus"?Os(t,E):r,O=E.length;for(;Ox;)E.pop(),O--;w&&!E.includes(w)&&(E[E.length-1]=w)}let D=!1,C=a.default.createElement("code",{className:"ch-code-scroll-parent"},a.default.createElement("br",null),E.map((x,O)=>{let S=!D&&x===w?d:void 0;return D=D||S!=null,a.default.createElement("div",{ref:S,key:O},o?a.default.createElement("span",{className:"ch-code-line-number"},"_",j):void 0,a.default.createElement("div",{style:{display:"inline-block",marginLeft:16}},a.default.createElement("span",null,x)))}),a.default.createElement("br",null));return{prevLongestLine:w,nextLongestLine:k,element:C}},[e]),m=[...s,u,f,g,n];return so(()=>{var w;if(d.current){let k=d.current,E=k?.parentElement,j=E.parentElement,D=k?.querySelector(":scope > div"),C=k?.querySelector(":scope > span"),x=C?As(C):0,O=wt(D),S=O/f.length||1,z=g.length*S,ue=(w=Et(D))!==null&&w!==void 0?w:20,de={containerWidth:wt(j.parentElement),containerHeight:Et(j.parentElement),contentWidth:wt(E.parentElement),contentHeight:Et(E.parentElement),lineWidths:[O||z||Ke,z||O||Ke],lineWidth:[Math.max(O||z||Ke,S*n),Math.max(z||O||Ke,S*n)],lineHeight:ue,colWidth:S,lineNumberWidth:x,deps:m};c(de)}},m),!i||js(i.deps,m)?{element:y,dimensions:null}:{element:y,dimensions:i}}var io=/\r\n|\r|\n/;function Dn(e,t){let n=e?e.split(io):[""],o=ws(t,n),r="";return n.forEach((s,i)=>{o.includes(i)&&s.length>r.length&&(r=s)}),r}function wt(e){let t=getComputedStyle(e);return parseFloat(t.width)-parseFloat(t.paddingLeft)-parseFloat(t.paddingRight)}function As(e){let t=getComputedStyle(e);return parseFloat(t.width)}function Et(e){if(!e)return null;let t=getComputedStyle(e);return parseFloat(t.height)-parseFloat(t.paddingTop)-parseFloat(t.paddingBottom)}function js(e,t){for(let n=0;n{function n(){t(window.innerWidth)}return window.addEventListener("resize",n),()=>window.removeEventListener("resize",n)},[]),e}function Os(e,t){let[n,o]=Fs(e.prev,t);return o-n+1}function le(){}le.prototype={diff:function(t,n){var o=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{},r=o.callback;typeof o=="function"&&(r=o,o={}),this.options=o;var s=this;function i(k){return r?(setTimeout(function(){r(void 0,k)},0),!0):k}t=this.castInput(t),n=this.castInput(n),t=this.removeEmpty(this.tokenize(t)),n=this.removeEmpty(this.tokenize(n));var c=n.length,u=t.length,d=1,f=c+u,g=[{newPos:-1,components:[]}],y=this.extractCommon(g[0],n,t,0);if(g[0].newPos+1>=c&&y+1>=u)return i([{value:this.join(n),count:n.length}]);function m(){for(var k=-1*d;k<=d;k+=2){var E=void 0,j=g[k-1],D=g[k+1],C=(D?D.newPos:0)-k;j&&(g[k-1]=void 0);var x=j&&j.newPos+1=c&&C+1>=u)return i(Is(s,E.components,n,t,s.useLongestToken));g[k]=E}d++}if(r)(function k(){setTimeout(function(){if(d>f)return r();m()||k()},0)})();else for(;d<=f;){var w=m();if(w)return w}},pushComponent:function(t,n,o){var r=t[t.length-1];r&&r.added===n&&r.removed===o?t[t.length-1]={count:r.count+1,added:n,removed:o}:t.push({count:1,added:n,removed:o})},extractCommon:function(t,n,o,r){for(var s=n.length,i=o.length,c=t.newPos,u=c-r,d=0;c+1m.length?k:m}),d.value=e.join(f)}else d.value=e.join(n.slice(c,c+d.count));c+=d.count,d.added||(u+=d.count)}}var y=t[i-1];return i>1&&typeof y.value=="string"&&(y.added||y.removed)&&e.equals("",y.value)&&(t[i-2].value+=y.value,t.pop()),t}function Ts(e){return{newPos:e.newPos,components:e.components.slice(0)}}var An=/^[A-Za-z\xC0-\u02C6\u02C8-\u02D7\u02DE-\u02FF\u1E00-\u1EFF]+$/,jn=/\S/,ao=new le;ao.equals=function(e,t){return this.options.ignoreCase&&(e=e.toLowerCase(),t=t.toLowerCase()),e===t||this.options.ignoreWhitespace&&!jn.test(e)&&!jn.test(t)};ao.tokenize=function(e){for(var t=e.split(/(\s+|[()[\]{}'"]|\b)/),n=0;n"u"?n:i}:o;return typeof e=="string"?e:JSON.stringify(jt(e,null,null,r),r," ")};Pe.equals=function(e,t){return le.prototype.equals.call(Pe,e.replace(/,([\r\n])/g,"$1"),t.replace(/,([\r\n])/g,"$1"))};function jt(e,t,n,o,r){t=t||[],n=n||[],o&&(e=o(r,e));var s;for(s=0;si.next===void 0?Object.assign(Object.assign({},t.prev[i.prev]),{lineNumber:{prev:i.prev+1},move:"exit",enterIndex:null,exitIndex:o++}):i.prev===void 0?Object.assign(Object.assign({},t.next[i.next]),{lineNumber:{next:i.next+1},move:"enter",enterIndex:n++,exitIndex:null}):Object.assign(Object.assign({},t.prev[i.prev]),{lineNumber:{prev:i.prev+1,next:i.next+1},move:"stay",enterIndex:null,exitIndex:null})),enterCount:n,exitCount:o}}function Ms(e){let t=Ls(e.prev,e.next),n=[],o=0,r=0;return t.forEach(s=>{if(s.added)for(let i=0;i{let y=g==="prev"?o.filter(m=>m.move!=="enter"):o.filter(m=>m.move!=="exit");return vs(f,y)}),i=o.map(f=>{let{tokens:g}=f,y=I(f,["tokens"]),m={prev:f.lineNumber.prev?s.prev[f.lineNumber.prev]:!1,next:f.lineNumber.next?s.next[f.lineNumber.next]:!1},w={prev:f.lineNumber.prev?n.prev[f.lineNumber.prev]||[]:[],next:f.lineNumber.next?n.next[f.lineNumber.next]||[]:[]};return Object.assign({focused:R(m,k=>!!k),groups:$s(g,m,w)},y)}),c=R(s,f=>Object.keys(f).map(g=>Number(g))),u=R(c,f=>Math.min(...f)),d=R(c,f=>Math.max(...f));return Object.assign({lines:i,firstFocusedLineNumber:u,lastFocusedLineNumber:d},r)}function $s(e,t,n){let o=R(t,f=>Array.isArray(f)?f:[]),r=R(n,f=>f.map(({columnNumbers:g})=>g)),s=[...o.prev,...o.next,...r.prev,...r.next],i=zs(e,s),c=0,u=null,d=[];return i.forEach(f=>{let g=Sn(c,t.prev),y=Sn(c,t.next),m=On(c,n.prev),w=On(c,n.next);(!u||u.focused.prev!==g||u.focused.next!==y||u.annotation.prev!==m||u.annotation.next!==w)&&(u={focused:{prev:g,next:y},tokens:[],annotation:{prev:m,next:w}},d.push(u)),u?.tokens.push(f),c+=f.content.length}),d.map(f=>({focused:f.focused,tokens:f.tokens,element:Ws(f)}))}function Ws(e){return a.default.createElement(a.default.Fragment,null,e.tokens.map(({content:t,props:n},o)=>a.default.createElement("span",Object.assign({},n,{key:o+1}),t)))}function zs(e,t){let n=[...t.map(r=>r.start-1),...t.map(r=>r.end)],o=e;return n.forEach(r=>{let s=[],i=0;o.forEach(c=>{let u=i,d=i+c.content.length;if(un-1<=e&&en.start-1<=e&&eo)return s;let i=(t-n)/(o-n),c=e.ease||Le.linear;return r+c(i)*(s-r)}}function In([e,t],n,o){if(o<=1)return[e,t];let r=t-e,s=r/Math.pow(o,1/8),i=(r-s)/(o-1),c=e+i*n,u=c+s;return[c,u]}var Le={linear:function(e){return e},easeInQuad:function(e){return e*e},easeOutQuad:function(e){return e*(2-e)},easeInOutCubic:function(e){return e<.5?4*e*e*e:(e-1)*(2*e-2)*(2*e-2)+1}};function Gs(e,t,n,o){let[r,s]=t;return e.map(i=>{let c=R(i.lineNumber,y=>y&&y-1),{enterIndex:u,exitIndex:d}=i,f=i.move==="exit"?{fixed:!0,value:c.prev}:i.move==="enter"?{fixed:!0,value:c.next}:{fixed:!1,extremes:[c.prev,c.next],interval:[r,s],ease:Le.easeInOutCubic},g=i.move==="exit"?{fixed:!1,extremes:[0,-1],ease:Le.easeInQuad,interval:In([0,r],d,o)}:i.move==="enter"?{fixed:!1,extremes:[1,0],ease:Le.easeOutQuad,interval:In([s,1],u,n)}:{fixed:!0,value:0};return Object.assign(Object.assign({},i),{tweenX:g,tweenY:f})})}function qs(e,t){let n=kt(e,[],s=>s.flatMap(i=>Zn(i.focus).map(c=>Object.assign(Object.assign({},i),{focus:c})))),o=kt(n,[],s=>s.filter(Tn)),r=kt(n,[],s=>s.filter(i=>!Tn(i)));return{inlineAnnotations:R(o,s=>Us(s,t)),multilineAnnotations:R(r,s=>Vs(s,t))}}function Tn(e){return ks(e.focus)}function Us(e,t){let n={};return e.forEach(o=>{let r=eo(o.focus),s=+Object.keys(r)[0],i=r[s],c=n[s]||[];c.push({columnNumbers:i[0],data:o.data,theme:t,Component:o.Component||Xs()}),n[s]=c}),n}function Xs(e,t){return({children:n})=>a.default.createElement("span",{style:{outline:"red 1px solid"}},n)}function Vs(e,t){return e.map(n=>({lineNumbers:to(n.focus),data:n.data,theme:t,Component:n.Component||Ys(n,t)}))}function Ys(e,t){let n=t.colors["editor.lineHighlightBackground"]||t.colors["editor.selectionHighlightBackground"];return({children:o,style:r})=>a.default.createElement("div",{style:Object.assign(Object.assign({},r),{background:n,cursor:"pointer"}),onClick:s=>alert("clicked"),className:"ch-code-bg-annotation"},a.default.createElement("span",{className:"ch-code-bg-annotation-border",style:{background:"#00a2d3",width:"3px",height:"100%",position:"absolute",left:0}}),o)}function Ks(e,t){return{prev:Ln(e,t.prev,n=>n.lineNumber.prev),next:Ln(e,t.next,n=>n.lineNumber.next)}}function Ln(e,t,n){let o=[...t];o.sort((i,c)=>i.lineNumbers.start-c.lineNumbers.start);let r=0,s=[];for(;ri.lineNumbers.start)throw"Code Hike can't handle two annotations for the same line";if(i&&n(c)===i.lineNumbers.start){let u={lines:[],annotation:i};for(;c&&(!n(c)||n(c)<=i.lineNumbers.end);)u.lines.push(c),c=e[++r];s.push(u),o.shift()}else if(!i)s.push({lines:e.slice(r)}),r=e.length;else{let u={lines:[]};for(;c&&(!n(c)||n(c){var{groups:o}=n,r=I(n,["groups"]);let{lineNumber:s}=r,i={prev:s.prev?t.prev[s.prev]||[]:[],next:s.next?t.next[s.next]||[]:[]};return Object.assign(Object.assign({},r),{annotatedGroups:Qs(o,i)})})}function Qs(e,t){let n=[...e],o=[...e],r=[...t.prev],s=[...t.next],i=[],c=1,u=1;for(;n.length>0||o.length>0;){let d=r[0],f=s[0],g=d&&d.columnNumbers.start===c,y=f&&f.columnNumbers.start===u;if(cu)if(y){let m=f.columnNumbers.end+1;i.push({next:{annotation:f,groups:J(o,u,m)}}),u=m,s.shift()}else{let m=Math.min(c,f?.columnNumbers.start||c);i.push({next:{groups:J(o,u,m)}}),u=m}else if(c==u)if(g&&y&&d.columnNumbers.end===f.columnNumbers.end){let m=f.columnNumbers.end+1;i.push({prev:{annotation:d,groups:J(n,c,m)},next:{annotation:f,groups:J(o,u,m)}}),c=m,u=m,r.shift(),s.shift()}else if(g){let m=d.columnNumbers.end+1;i.push({prev:{annotation:d,groups:J(n,c,m)}}),c=m,r.shift()}else if(y){let m=f.columnNumbers.end+1;i.push({next:{annotation:f,groups:J(o,u,m)}}),u=m,s.shift()}else if(!d&&!f)i.push({prev:{groups:n},next:{groups:o}}),n=[],o=[];else{let m=Math.min(d?.columnNumbers.start||Number.MAX_VALUE,f?.columnNumbers.start||Number.MAX_VALUE);i.push({prev:{groups:J(n,c,m)},next:{groups:J(o,u,m)}}),c=m,u=m}}return i}function J(e,t,n){let o=[],r=t;for(;r0;){let s=e.shift();o.push(s),r+=s.tokens.reduce((c,u)=>c+u.content.length,0)}return o}function Zs(e){let{highlightedLines:t,theme:n,focus:o}=e;return a.default.useMemo(()=>ei(e),[t.prev,t.next,o.prev,o.next,n])}function ei({theme:e,focus:t,annotations:n,highlightedLines:o,lang:r}){let s=ti(o),i=ni(s,o),{inlineAnnotations:c,multilineAnnotations:u}=oi(n,e),d=ri(i,Jn(t,null),c),f=si(d,c,u);return ii(f,s,r)}function ti(e){return R(e,t=>t.map(n=>n.tokens.map(o=>o.content).join("")).join(` `).trimEnd().concat(` `))}function ni(e,t){return _s(e,t)}function oi(e,t){return qs(e,t)}function ri(e,t,n){return Rs(e,t,n)}function si(e,t,n){var{lines:o}=e,r=I(e,["lines"]);let s=Js(o,t),i=Ks(s,n);return Object.assign(Object.assign({},r),{lineGroups:i,lineCount:{prev:o.filter(c=>c.lineNumber.prev!=null).length,next:o.filter(c=>c.lineNumber.next!=null).length}})}function ii(e,t,n){let o=ai(e.enterCount,e.exitCount),r=R(e.lineGroups,s=>s.map(i=>Object.assign(Object.assign({},i),{lines:Gs(i.lines,o,e.enterCount,e.exitCount)})));return Object.assign(Object.assign({},e),{groups:r,verticalInterval:o,code:t,lang:n})}function ai(e,t){return e<=0&&t<=0?[0,1]:e<=0&&t>=1?[.33,1]:e>=1&&t<=0?[0,.67]:[.25,.75]}function ci({dimensions:e,codeStep:t,children:n,minZoom:o=0,maxZoom:r=1.2,center:s=!1,progress:i}){let{prev:c,next:u}=di({codeStep:t,dimensions:e,minZoom:o,maxZoom:r,horizontalCenter:s}),d=Te(c.zoom,u.zoom,i),f=Te(c.dx,u.dx,i),g=Te(c.dy,u.dy,i,t.verticalInterval),y=Te(c.focusHeight,u.focusHeight,i),m=Te(c.focusWidth,u.focusWidth,i),k=(e?.lineNumberWidth||0)*d||16,E=Math.max(m+k,e.contentWidth),j=k/d;return a.default.createElement(li,{width:e.containerWidth,height:e.containerHeight,lang:t.lang},a.default.createElement(ui,{dx:f,dy:g,scale:d,height:Math.max(y,e.contentHeight),width:E},n(m,j)))}function li({width:e,height:t,children:n,lang:o}){return a.default.createElement("code",{style:{width:e,height:t,position:"relative",overflow:"auto"},className:"ch-code-scroll-parent",children:n,"data-ch-lang":o})}function ui({dx:e,dy:t,scale:n,height:o,width:r,children:s}){return a.default.createElement("div",{style:{position:"absolute",top:0,left:0,transformOrigin:"top left",width:r,height:o,overflow:"hidden"},className:"ch-code-scroll-content"},a.default.createElement("div",{style:{position:"absolute",top:0,left:0,transform:`translateX(${e}px) translateY(${t}px) scale(${n})`,transformOrigin:"left top",width:r/n,height:(o-2*t)/n},children:s}))}function di(e){var{codeStep:t}=e,n=I(e,["codeStep"]);let{lineHeight:o,lineWidth:r}=n.dimensions,s={prev:{extremes:[t.firstFocusedLineNumber.prev-1,t.lastFocusedLineNumber.prev-1],originalContentHeight:t.lineCount.prev*o,lineWidth:r[0]},next:{extremes:[t.firstFocusedLineNumber.next-1,t.lastFocusedLineNumber.next-1],originalContentHeight:t.lineCount.next*o,lineWidth:r[1]}};return R(s,({extremes:i,originalContentHeight:c,lineWidth:u})=>fi(Object.assign({extremes:i,originalContentHeight:c,lineWidth:u},n)))}function fi({dimensions:e,lineWidth:t,minZoom:n,maxZoom:o,extremes:r,originalContentHeight:s,horizontalCenter:i}){let{lineHeight:c}=e,u=e?.contentHeight,d=e?.contentWidth,f=(r[1]-r[0]+3)*c,g=e?.lineNumberWidth||16,y=16,m=Math.max(Math.min((d-g-y)/t,u/f,o),n),w=s*m,k=(r[0]-1)*c*m,E=(r[1]+2)*c*m,j=(E+k)/2,D=E-k,C=u>w?(u-w)/2:pi(u/2-j,Math.max(u-w,-k),0),x=i?Math.max(d/2-t*m/2,0):0;return{zoom:m,dx:x,dy:C,focusHeight:D,focusWidth:t*m}}function pi(e,t,n){return e<=t?t:e>=n?n:e}function Te(e,t,n,o=[0,1]){return He({fixed:!1,interval:o,extremes:[e,t],ease:Le.easeInOutCubic},n)}function gi(e){return a.default.createElement(ci,Object.assign({},e),(t,n)=>a.default.createElement(hi,{codeStep:e.codeStep,focusWidth:t,lineHeight:e.dimensions.lineHeight,progress:e.progress,theme:e.theme,startX:n,lineNumberWidth:e.dimensions.lineNumberWidth}))}function hi({codeStep:e,progress:t,focusWidth:n,lineHeight:o,startX:r,theme:s,lineNumberWidth:i}){let c=t<.5?e.groups.prev:e.groups.next;return a.default.createElement(a.default.Fragment,null,c.map((u,d)=>{if(!u.annotation)return a.default.createElement(Nn,{lines:u.lines,t,focusWidth:n,lineHeight:o,startX:r,key:d,theme:s,lineNumberWidth:i});let f=He(u.lines[0].tweenY,t),g=u.annotation.lineNumbers.end-u.annotation.lineNumbers.start+1,y=u.annotation.Component;return a.default.createElement(y,{style:{position:"absolute",height:g*o,width:"100%",transform:`translateY(${f*o}px)`},key:d,data:u.annotation.data,theme:u.annotation.theme,isInline:!1},a.default.createElement(Nn,{lines:u.lines,t,focusWidth:n,lineHeight:o,startY:f,startX:r,theme:s,lineNumberWidth:i}))}))}function Nn({lines:e,focusWidth:t,lineHeight:n,t:o,startX:r,startY:s=0,theme:i,lineNumberWidth:c}){return a.default.createElement(a.default.Fragment,null,e.map((u,d)=>{let{tweenX:f,tweenY:g,focused:y}=u,m=He(f,o),w=He(g,o),k=co(y,o,m);return a.default.createElement(a.default.Fragment,{key:d},c?a.default.createElement("span",{className:"ch-code-line-number",style:{position:"absolute",top:0,left:0,transform:`translate(${m*t}px, ${(w-s)*n}px)`,width:c,opacity:k,color:B(i,v.LineNumberForeground)}},o<.5?u.lineNumber.prev:u.lineNumber.next):void 0,a.default.createElement(yi,{dx:r+m*t,dy:(w-s)*n,width:t,opacity:k},a.default.createElement(mi,{line:u,progress:o,dx:m})))}))}function mi({line:e,progress:t,dx:n}){return a.default.createElement("div",{style:{display:"inline-block",width:"100%"}},e.annotatedGroups.map((o,r)=>a.default.createElement(bi,{annotatedGroup:o,progress:t,dx:n,key:r})),a.default.createElement("br",null))}function bi({annotatedGroup:e,progress:t,dx:n}){var o,r,s;let i=t<.5?e.prev:e.next,c=i?.groups||[],u=(o=i?.annotation)===null||o===void 0?void 0:o.Component,d=c.map((f,g)=>{let y=co(f.focused,t,n);return a.default.createElement("span",{style:{opacity:y},key:g+1},f.element)});return u?a.default.createElement(u,{children:d,data:(r=i?.annotation)===null||r===void 0?void 0:r.data,theme:(s=i?.annotation)===null||s===void 0?void 0:s.theme,isInline:!0}):a.default.createElement(a.default.Fragment,null,d)}function yi({children:e,dx:t,dy:n,opacity:o,width:r}){return a.default.createElement("div",{style:{position:"absolute",top:0,left:0,transform:`translate(${t}px, ${n}px)`,width:r,display:o<=0?"none":void 0}},e)}var Pn=.33;function co(e,t,n){return He({fixed:!1,extremes:[e.prev?.99:Pn,e.next?.99:Pn],interval:[0,1]},t)-Math.abs(n)*1}function ot({content:e,style:t,className:n}){let[o,r]=a.default.useState(!1);return a.default.createElement("svg",{style:t,onClick:()=>{vi(e),r(!0),setTimeout(()=>{r(!1)},1200)},fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",className:n},a.default.createElement("title",null,"Copy"),o?a.default.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M5 13l4 4L19 7"}):a.default.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"1.6px",d:"M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"}))}function vi(e){if(!navigator.clipboard){ki(e);return}navigator.clipboard.writeText(e)}function ki(e){var t=document.createElement("textarea");t.value=e,t.style.top="0",t.style.left="0",t.style.position="fixed",document.body.appendChild(t),t.focus(),t.select();try{var n=document.execCommand("copy")}catch{}document.body.removeChild(t)}function Fi({tween:e,theme:t}){return Zs({highlightedLines:R(e,n=>n.code.lines),theme:t,focus:R(e,n=>n.focus),annotations:R(e,n=>n.annotations),lang:ys(e,n=>{var o;return(o=n?.code)===null||o===void 0?void 0:o.lang})})}var wi=10;function lo(e){var{tween:t,progress:n,config:o}=e,r=I(e,["tween","progress","config"]);let s=Fi({tween:t,theme:o.theme}),{element:i,dimensions:c}=Ds(s.code,R(t,u=>u.focus),o.minColumns||wi,o.lineNumbers||!1,o.rows,[o.parentHeight]);return!c||o.debug?a.default.createElement(Ei,{element:i,htmlProps:r,debug:o.debug}):a.default.createElement(Ci,{dimensions:c,stepInfo:s,config:o,progress:n,htmlProps:r})}function Ei({element:e,htmlProps:t,debug:n}){return a.default.createElement(uo,{htmlProps:t,style:{opacity:n?.9:0,overflow:"auto"}},e)}function Ci({config:{minZoom:e=1,maxZoom:t=1,horizontalCenter:n=!1,theme:o},dimensions:r,stepInfo:s,progress:i,htmlProps:c,config:u}){var d;let{bg:f,fg:g}=xs(o);return a.default.createElement(uo,{htmlProps:c,style:{opacity:1,backgroundColor:f,color:g,colorScheme:oo(o),["--ch-selection-background"]:B(o,v.SelectionBackground)}},a.default.createElement(gi,{codeStep:s,progress:i,dimensions:r,minZoom:e,maxZoom:t,center:n,theme:o}),u.showCopyButton?a.default.createElement(ot,{className:"ch-code-button",content:(d=s?.code)===null||d===void 0?void 0:d.prev}):void 0)}function uo({htmlProps:e,style:t,children:n}){return a.default.createElement("div",Object.assign({className:"ch-code-wrapper"},e,{style:Object.assign(Object.assign({margin:0,padding:0,position:"relative",whiteSpace:"pre",boxSizing:"content-box"},t),e?.style),children:n}))}function _t(){return typeof window<"u"?performance.now():0}function xi(e,t){var n=a.default.useRef(null);return n.current==null&&(n.current={config:fo(e,t),state:Bi(e,t)}),n.current}function fo(e,t){var n=t.stiffness,o=t.damping,r=t.mass,s=t.decimals,i=t.teleport;return{X:e,k:n??170,c:o??26,m:r??1,teleport:i??!1,decimals:s??2}}function Bi(e,t){var n=t.from,o=t.initialSpeed;return{x0:n??e,v0:o??0,t0:_t(),raf:null}}var Ct=Math.sqrt,ae=Math.exp,Hn=Math.sin,_n=Math.cos;function Ot(e){var t=e.x0,n=e.v0,o=e.t0,r=e.t,s=e.k,i=e.c,c=e.m,u=e.X,d=t-u,f=(r-o)/1e3,g=i*i-4*s*c;if(g>0){var y=(-i+Ct(g))/(2*c),m=(-i-Ct(g))/(2*c),w=(d*y-n)/(y-m),k=(n-d*m)/(y-m);return{x:u+w*ae(m*f)+k*ae(y*f),v:w*m*ae(m*f)+k*y*ae(y*f)}}else if(g<0){var E=-i/(2*c),j=Ct(-g)/(2*c),D=d,C=(n-E*d)/j;return{x:u+ae(E*f)*(D*_n(j*f)+C*Hn(j*f)),v:ae(E*f)*((C*j+D*E)*_n(j*f)-(D*j-C*E)*Hn(j*f))}}else{var x=-i/(2*c),O=d,S=n-x*d;return{x:u+(O+S*f)*ae(x*f),v:(S+O*x+S*x*f)*ae(x*f)}}}var rt=[],It=null;function Mn(e){var t=rt.push(e);return t===1&&(It=requestAnimationFrame(Di)),[It,t-1]}function Rn(e){var t=e[0],n=e[1];t===It&&delete rt[n]}function Di(){var e=_t(),t=rt;rt=[],us.unstable_batchedUpdates(function(){return t.forEach(function(n){return n&&n(e)})})}var Je=typeof window<"u"?a.default.useLayoutEffect:a.default.useEffect;function Mt(e,t){t===void 0&&(t={});var n=a.default.useState(),o=n[1],r=fo(e,t),s=xi(e,t),i=s.state,c=s.config,u=_t(),d=i.x0,f=i.v0,g=i.t0,y=c.k,m=c.c,w=c.m,k=c.X,E=r.teleport?{x:k,v:0}:Ot({x0:d,v0:f,t0:g,t:u,k:y,c:m,m:w,X:k}),j=E.x,D=E.v,C=Ai(j,D,u,r);return Je(function(){Object.assign(c,r)},[r.X,r.k,r.c,r.m,r.teleport]),Je(function(){i.x0=j,i.v0=D,i.t0=u},[j,D,u]),Je(function(){var x=function O(S){var z=i.x0,ue=i.v0,de=i.t0,oe=c.k,fe=c.c,_=c.m,q=c.X,_e=c.decimals,ut=Ot({x0:z,v0:ue,t0:de,t:S,k:oe,c:fe,m:_,X:q}),dt=ut.x;ye(dt,_e)!==ye(z,_e)?(i.raf=null,o(S)):i.raf=Mn(O)};C&&i.raf==null?i.raf=Mn(x):!C&&i.raf!=null&&(Rn(i.raf),i.raf=null)}),Je(function(){return function(){i.raf!=null&&Rn(i.raf)}},[]),[ye(j,r.decimals),C]}function Ai(e,t,n,o){var r=o.decimals,s=o.X,i=o.k,c=o.c,u=o.m;if(ye(e,r)!==ye(s,r))return!0;var d=n+.016,f=Ot({x0:e,v0:t,t0:n,t:d,k:i,c,m:u,X:s}),g=f.x;return ye(g,r)!==ye(s,r)}function ye(e,t){var n=Math.pow(10,t);return Math.round(e*n)/n}var ji={stiffness:120,damping:24,mass:.2,decimals:3};function Si(e){var{step:t,config:n}=e,o=I(e,["step","config"]);let{tween:r,t:s}=Oi(t,n.spring);return a.default.createElement(lo,Object.assign({tween:r,progress:s,config:n},o))}function Oi(e,t=ji){let[{target:n,steps:o,index:r},s]=a.default.useState({target:2,steps:[e,e,e],index:0});a.default.useEffect(()=>{o[o.length-1]!=e&&s(f=>Ii(f,e,i))},[e]);let[i]=Mt(n,t),c=i-r;return c<=1?{tween:{prev:o[0],next:o[1]},t:c}:{tween:{prev:o[1],next:o[2]},t:c-1}}function Ii(e,t,n){let{steps:o,target:r,index:s}=e,i=o.slice();return n-s<1?(i[2]=t,Object.assign(Object.assign({},e),{steps:i})):(i[0]=o[1],i[1]=o[2],i[2]=t,Object.assign(Object.assign({},e),{steps:i,target:r+1,index:s+1}))}var Tt=Ee.createContext({});function po({classes:e,children:t}){let n=Ee.useContext(Tt),o=go(n,e);return a.default.createElement(Tt.Provider,{value:o,children:t})}function ne(e,t){let n=Ee.useContext(Tt),o=go(n,t);return Ee.useCallback(Ti(e,o),[e,o])}function Ti(e,t){return function(...o){let r=o.map(i=>e+(e&&i?"-":"")+i),s=r.slice();return r.forEach(i=>{i in t&&s.push(t[i])}),s.join(" ")}}function go(e,t){return Ee.useMemo(()=>Object.assign(Object.assign({},e),t),[e,t])}var Li=a.default.forwardRef(function(e,t){var{title:n,children:o,titleBar:r,classes:s,theme:i,zoom:c=1,overflow:u}=e,d=I(e,["title","children","titleBar","classes","theme","zoom","overflow"]);let f=ne("ch-frame",s),g=r||a.default.createElement(ho,{title:n}),y={"--ch-frame-zoom":c,overflow:u};return a.default.createElement(po,{classes:s},a.default.createElement("div",Object.assign({},d,{ref:t}),a.default.createElement("div",{className:f("")},a.default.createElement("div",{className:f("title-bar"),style:{background:B(i,v.EditorGroupHeaderBackground)}},g),a.default.createElement("div",{className:f("content")},a.default.createElement("div",{className:f("zoom"),style:y},o)))))});a.default.forwardRef(function(e,t){var{title:n,children:o,titleBar:r,classes:s,overflow:i}=e,c=I(e,["title","children","titleBar","classes","overflow"]);let u=ne("ch",s),d=r||a.default.createElement(ho,{title:n});return a.default.createElement(po,{classes:s},a.default.createElement("div",Object.assign({},c,{ref:t}),a.default.createElement("div",{className:u("simple-frame")},a.default.createElement("div",{className:u("frame-title-bar")},d),o)))});function ho({title:e}){let t=ne("ch-frame");return a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{className:t("left-bar")},a.default.createElement(Rt,null)),a.default.createElement("div",{className:t("middle-bar")},e),a.default.createElement("div",{className:t("right-bar")}))}function Rt(){let e=ne("ch-frame");return a.default.createElement("div",{className:e("buttons")},a.default.createElement("div",{className:e("button","button-left")}),a.default.createElement("div",{className:e("button-space")}),a.default.createElement("div",{className:e("button","button-middle")}),a.default.createElement("div",{className:e("button-space")}),a.default.createElement("div",{className:e("button","button-right")}))}var Ni=a.default.forwardRef(function(t,n){var o,{northPanel:r,southPanel:s,terminalPanel:i,style:c,height:u,northButton:d,southButton:f,theme:g,className:y,onTabClick:m}=t,w=I(t,["northPanel","southPanel","terminalPanel","style","height","northButton","southButton","theme","className","onTabClick"]);return a.default.createElement("div",Object.assign({ref:n},w,{className:"ch-editor-frame",style:Object.assign({background:B(g,v.EditorBackground)},c)}),a.default.createElement("div",{className:"ch-frame-title-bar",style:{color:B(g,v.IconForeground),background:B(g,v.EditorGroupHeaderBackground)}},a.default.createElement($n,{tabs:r.tabs,showFrameButtons:!0,button:d,panel:"north",theme:g,onTabClick:m})),a.default.createElement("div",{"data-ch-panel":"north",style:r.style,children:r.children}),s&&a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{className:"ch-frame-title-bar",style:{transform:(o=s.style)===null||o===void 0?void 0:o.transform,color:B(g,v.IconForeground),background:B(g,v.EditorGroupHeaderBackground)}},a.default.createElement($n,{tabs:s.tabs,showFrameButtons:!1,button:f,topBorder:!0,panel:"south",theme:g,onTabClick:m})),a.default.createElement("div",{"data-ch-panel":"south",children:s.children,style:s.style})))});function $n({tabs:e,button:t,showFrameButtons:n,topBorder:o,panel:r,theme:s,onTabClick:i}){let c=ne("ch-editor-tab");return a.default.createElement(a.default.Fragment,null,o&&a.default.createElement("div",{style:{position:"absolute",height:"1px",background:B(s,v.EditorGroupBorder),width:"100%",top:0,zIndex:1}}),n?a.default.createElement(Rt,null):a.default.createElement("div",null),e.map(({title:u,active:d,style:f})=>a.default.createElement("div",{key:u,title:u,"data-ch-tab":r,className:c("",d?"active":"inactive"),style:Object.assign(Object.assign({},f),{background:B(s,d?v.ActiveTabBackground:v.InactiveTabBackground),color:B(s,d?v.ActiveTabForeground:v.InactiveTabForeground),borderRightColor:B(s,v.TabBorder),borderBottomColor:B(s,d?v.ActiveTabBottomBorder:v.InactiveTabBackground)}),onClick:i&&(()=>i(u))},a.default.createElement(Pi,{title:u}))),a.default.createElement("div",{style:{flex:1,minWidth:"0.8em"}}),t)}function Pi({title:e}){if(!e)return a.default.createElement("div",null);let t=e.lastIndexOf("/")+1,n=e.substring(t),o=e.substring(0,t);return a.default.createElement("div",null,a.default.createElement("span",{style:{opacity:.5}},o),n)}function Hi(e){let[,...t]=e.split(/^\$\s*/gm),n=t.map(i=>{let[c,...u]=i.split(/\r?\n/);return{run:c,output:u.length>0?u.join(` `):null}}),o=n[n.length-1],r=n.length>0&&o.output!=null;return{title:r?o.run.split(/(\s+)/)[0]:"bash",isRunning:r,commands:n}}var _i=a.default.createElement("span",{className:"ch-terminal-prompt"},"$");function Wn({text:e,progress:t=1,style:n}){let o=Mi(e,t);return a.default.createElement("pre",{style:n,className:"ch-terminal-content"},o.map(({run:r,output:s},i)=>a.default.createElement(a.default.Fragment,{key:i},a.default.createElement("div",null,_i," ",a.default.createElement("span",null,r)),s&&a.default.createElement("div",{className:"ch-terminal-output"},s))))}function Mi(e,t){if(!e)return[];let n=Math.round(e.length*t),{commands:o}=Hi(e.slice(0,n));return o}function Ri({prev:e="",prevKey:t,next:n="",nextKey:o,progress:r}){return a.default.createElement("div",{className:"ch-terminal"},a.default.createElement("div",{style:{position:"relative",transform:`translateY(-${r*100}%)`}},a.default.createElement(Wn,{text:e,progress:1,key:t}),a.default.createElement(Wn,{style:{position:"absolute"},text:n,progress:r,key:o})))}function $i({steps:e,progress:t}){let n=e.map(i=>i.text),o=t%1,r=Wi(Math.floor(t),0,e.length-1),s=r+1;return a.default.createElement(Ri,{prev:n[r],prevKey:r,next:n[s]||"",nextKey:s,progress:o})}function Wi(e,t,n){return Math.min(Math.max(e,t),n)}function zi({prev:e,next:t,t:n,backward:o}){let r=Gi({prev:e,next:t,t:n,backward:o});return r?a.default.createElement("div",{className:"ch-editor-terminal",style:{height:r}},a.default.createElement("div",{className:"ch-editor-terminal-tab"},a.default.createElement("span",null,"Terminal")),a.default.createElement("div",{className:"ch-editor-terminal-content"},a.default.createElement($i,{steps:[{text:e||""},{text:t||""}],progress:n}),")")):null}function Gi({prev:e,next:t,t:n,backward:o}){return!e&&!t?0:!e&&t?xt*Math.min(n*4,1):e&&!t?xt*Math.max(1-n*4,0):xt}var xt=150;function $t(e){return Array.isArray(e.rows)?Object.assign(Object.assign({},e),{rows:e.rows[0]}):e}function Wt(e){return Array.isArray(e.rows)?Object.assign(Object.assign({},e),{rows:e.rows[1]}):e}function qi(e,t,n,o,r,s){let{prevSnapshot:i,nextSnapshot:c}=Yi(e,t,n);if(!i)return Ui(t,n,s);if(!c||o===1)return zn(t,n,s);let u=t.southPanel||n.southPanel,{prevNorthFile:d,prevSouthFile:f,nextNorthFile:g,nextSouthFile:y}=zt(t,n,o==0||r),{northStyle:m,southStyle:w}=Xi(i,c,o),{northTabs:k,southTabs:E}=Vi(i,c,d.name,f?.name,o);return{northContent:Be(g),northPanel:{tabs:k,style:m,children:a.default.createElement(xe,{codeConfig:$t(s),prevFile:d,nextFile:g,t:o,parentHeight:m.height||m.minHeight})},southContent:Be(y),southPanel:u&&{tabs:E,style:w,children:a.default.createElement(xe,{codeConfig:Wt(s),prevFile:f,nextFile:y,t:o,parentHeight:w?.height||w?.minHeight})}}}function Ui(e,t,n){let o=e.northPanel,r=e.southPanel,{prevNorthFile:s,prevSouthFile:i,nextNorthFile:c,nextSouthFile:u}=zt(e,t,!0);return{northContent:Be(s),northPanel:{tabs:o.tabs.map(d=>({title:d,active:d===o.active,style:{}})),style:{flexGrow:1,overflow:"hidden"},children:a.default.createElement(xe,{codeConfig:$t(n),prevFile:s,nextFile:s,t:0,parentHeight:"0"})},southContent:Be(i),southPanel:r&&{tabs:r.tabs.map(d=>({title:d,active:d===r.active,style:{}})),style:{flexGrow:1,overflow:"hidden"},children:a.default.createElement(xe,{codeConfig:Wt(n),prevFile:i,nextFile:i,t:0,parentHeight:"0"})}}}function zn(e,t,n){var o;let r=t.northPanel,s=t.southPanel,{prevNorthFile:i,prevSouthFile:c,nextNorthFile:u,nextSouthFile:d}=zt(e,t,!1);return!s&&r.active===((o=e?.southPanel)===null||o===void 0?void 0:o.active)&&(u=d),{northContent:Be(u),northPanel:{tabs:r.tabs.map(g=>({title:g,active:g===r.active,style:{}})),style:{flexGrow:1,overflow:"hidden"},children:a.default.createElement(xe,{codeConfig:$t(n),prevFile:u,nextFile:u,t:1,parentHeight:"1"})},southContent:Be(d),southPanel:s&&{tabs:s.tabs.map(g=>({title:g,active:g===s.active,style:{}})),style:{flexGrow:1,overflow:"hidden"},children:a.default.createElement(xe,{codeConfig:Wt(n),prevFile:d,nextFile:d,t:1,parentHeight:"1"})}}}function xe({prevFile:e,nextFile:t,t:n,codeConfig:o,parentHeight:r}){var s;let i=Object.assign(Object.assign({},o?.htmlProps),{style:Object.assign({height:"100%"},(s=o?.htmlProps)===null||s===void 0?void 0:s.style)});return a.default.createElement(lo,Object.assign({progress:n,tween:{prev:e,next:t},config:Object.assign(Object.assign({},o),{parentHeight:r})},i))}function Be(e){return e?Qn(e.code):""}function zt(e,t,n){var o,r;let s=e.northPanel.active,i=t.northPanel.active,c=(o=e.southPanel)===null||o===void 0?void 0:o.active,u=(r=t.southPanel)===null||r===void 0?void 0:r.active,d=e.files.find(C=>C.name===s),f=t.files.find(C=>C.name===i),g=c?e.files.find(C=>C.name===c):null,y=u?t.files.find(C=>C.name===u):null;return!c&&s===u?{prevNorthFile:f,nextNorthFile:f,prevSouthFile:d,nextSouthFile:y}:!u&&i===c?{prevNorthFile:d,nextNorthFile:d,prevSouthFile:g,nextSouthFile:f}:{prevNorthFile:s===i||n?d:f,nextNorthFile:s===i?f:n?d:f,prevSouthFile:c===u?g:n?g||y:y||g,nextSouthFile:c===u?y:n?g||y:y||g}}function Xi(e,t,n){return e.southHeight===null&&t.southHeight===null?{northStyle:{minHeight:e.northHeight}}:e.southHeight!==null&&t.southHeight===null&&t.northKey!==e.southKey?{northStyle:{minHeight:ce(e.northHeight,t.northHeight,n)},southStyle:{minHeight:e.southHeight}}:e.southHeight!==null&&t.southHeight===null&&e.southKey===t.northKey?{northStyle:{minHeight:e.northHeight},southStyle:{position:"relative",minHeight:ce(e.southHeight,t.northHeight,n),transform:`translateY(${ce(0,-(e.northHeight+e.titleBarHeight),n)}px)`}}:e.southHeight===null&&t.southHeight!==null&&e.northKey!==t.southKey?{northStyle:{minHeight:ce(e.northHeight,t.northHeight,n)},southStyle:{position:"relative",minHeight:t.southHeight}}:e.southHeight===null&&t.southHeight!==null&&e.northKey===t.southKey?{northStyle:{minHeight:t.northHeight},southStyle:{position:"relative",minHeight:ce(e.northHeight,t.southHeight,n),transform:`translateY(${ce(-(t.northHeight+t.titleBarHeight),0,n)}px)`}}:{northStyle:{minHeight:ce(e.northHeight,t.northHeight,n)},southStyle:{minHeight:ce(e.southHeight,t.southHeight,n)}}}function ce(e,t,n){return e+(t-e)*n}function Vi(e,t,n,o,r){return!e.southTabs&&we(o,e.northTabs)?{northTabs:Fe(t.northTabs,t.southTabs,e.southTabs,e.northTabs,n,r),southTabs:Fe(t.southTabs,t.northTabs,e.northTabs,e.southTabs,o,r)}:!t.southTabs&&we(o,t.northTabs)?{northTabs:Fe(t.southTabs,t.northTabs,e.northTabs,e.southTabs,n,r),southTabs:Fe(t.northTabs,t.southTabs,e.southTabs,e.northTabs,o,r)}:{northTabs:Fe(t.northTabs,t.southTabs,e.northTabs,e.southTabs,n,r),southTabs:Fe(t.southTabs,t.northTabs,e.southTabs,e.northTabs,o,r)}}function Fe(e,t,n,o,r,s){let i=e?Object.keys(e).filter(d=>we(d,n)||!n).map(d=>{let f=n&&n[d],g=e[d],y=f?f.left+(g.left-f.left)*s:g.left,m=f?f.width+(g.width-f.width)*s:g.width;return{active:d===r,title:d,style:{position:"absolute",transform:`translateX(${y}px)`,width:m}}}):[],c=e?Object.keys(e).filter(d=>n&&!we(d,n)).map(d=>{let f=e[d];return{active:d===r,title:d,style:{position:"absolute",transform:`translateX(${f.left}px)`,opacity:s,width:f.width}}}):[];e&&Object.keys(e).filter(d=>we(d,o)).map(d=>{let f=o[d],y=e[d].left-f.left;return{active:d===r,title:d,style:{position:"absolute",transform:`translateX(${y}px)`}}});let u=n?Object.keys(n).filter(d=>!we(d,e)).map(d=>{let f=n[d];return{active:d===r,title:d,style:{position:"absolute",opacity:1-s,transform:`translateX(${f.left}px)`,width:f.width}}}):[];return[...c,...i,...u]}function we(e,t){return t&&e&&e in t}var Gn=typeof window<"u"?a.default.useLayoutEffect:a.default.useEffect;function Yi(e,t,n){let[{prevSnapshot:o,nextSnapshot:r},s]=a.default.useState({prevSnapshot:null,nextSnapshot:null});return Gn(()=>{(o||r)&&s({prevSnapshot:null,nextSnapshot:null})},[t,n]),Gn(()=>{if(o){if(!r){let i=e.current;s(c=>Object.assign(Object.assign({},c),{nextSnapshot:Object.assign(Object.assign({},qn(i,n)),Un(i,n))}))}}else{let i=e.current;s(c=>Object.assign(Object.assign({},c),{prevSnapshot:Object.assign(Object.assign({},qn(i,t)),Un(i,t))}))}}),{prevSnapshot:o,nextSnapshot:r}}function qn(e,t){var n;let o=e.querySelector("[data-ch-panel='north']"),r=e.querySelector("[data-ch-panel='south']");return{titleBarHeight:e.querySelector(".ch-frame-title-bar").getBoundingClientRect().height,northHeight:o.getBoundingClientRect().height,northKey:t.northPanel.active,southHeight:r?.getBoundingClientRect().height||null,southKey:(n=t.southPanel)===null||n===void 0?void 0:n.active}}function Un(e,t){var n;let o=Array.from(e.querySelectorAll("[data-ch-tab='north']")),r=Array.from(e.querySelectorAll("[data-ch-tab='south']"));return{northTabs:Xn(o,t.northPanel.active),southTabs:Xn(r,(n=t.southPanel)===null||n===void 0?void 0:n.active)}}function Xn(e,t){if(!e[0])return null;let o=e[0].parentElement.getBoundingClientRect().left,r={};return e.forEach(s=>{let i=s.getAttribute("title"),c=s.getBoundingClientRect();r[i]={left:c.left-o,width:c.width,active:i===t}}),r}function Ki({files:e,theme:t,startingFileName:n}){let[o,r]=a.default.useState(()=>e.find(s=>s.name===n));return a.default.createElement("div",{className:"ch-code-browser",style:{color:B(t,v.EditorForeground)}},a.default.createElement(Ji,{files:e,theme:t,activeFile:o,setActiveFile:r}),a.default.createElement(Zi,{file:o,theme:t}))}function Ji({theme:e,files:t,activeFile:n,setActiveFile:o}){let r=a.default.useMemo(()=>ea(t),[t]);return a.default.createElement("div",{className:"ch-code-browser-sidebar",style:{borderColor:B(e,v.SideBarBorder),background:B(e,v.SideBarBackground),color:B(e,v.SideBarForeground),["--ch-list-selection-background"]:B(e,v.ListActiveSelectionBackground),["--ch-list-selection-foreground"]:B(e,v.ListActiveSelectionForeground),["--ch-hover-background"]:B(e,v.ListHoverBackground),["--ch-hover-foreground"]:B(e,v.ListHoverForeground)}},a.default.createElement(mo,{tree:r,activeFile:n,setActiveFile:o}))}function mo({tree:e,activeFile:t,setActiveFile:n,level:o=0}){return a.default.createElement(a.default.Fragment,null,e.map(r=>a.default.createElement(Qi,{key:r.name,node:r,activeFile:t,setActiveFile:n,level:o})))}function Qi({node:e,activeFile:t,setActiveFile:n,level:o}){let r=e.children&&e.children.length>0,s=e.codeFile===t;return r?a.default.createElement("div",null,a.default.createElement("div",{className:"ch-code-browser-sidebar-folder"},a.default.createElement("div",{style:{paddingLeft:o*1.5+"ch"}},e.name)),a.default.createElement(mo,{tree:e.children,activeFile:t,setActiveFile:n,level:o+1})):a.default.createElement("div",null,a.default.createElement("div",{className:"ch-code-browser-sidebar-file",onClick:()=>n(e.codeFile),style:s?{color:"var(--ch-list-selection-foreground)",background:"var(--ch-list-selection-background)"}:{}},a.default.createElement("div",{style:{paddingLeft:o*1.5+"ch"}},e.name)))}function Zi({file:e,theme:t}){return a.default.createElement("div",{className:"ch-code-browser-content",style:{background:B(t,v.CodeBackground),color:B(t,v.CodeForeground),["--ch-selection-background"]:B(t,v.SelectionBackground),colorScheme:oo(t)}},a.default.createElement(ot,{className:"ch-code-browser-button",content:Qn(e.code)}),e.code.lines.map((n,o)=>a.default.createElement("div",{key:o},n.tokens.length===0?a.default.createElement("br",null):n.tokens.map((r,s)=>a.default.createElement("span",Object.assign({key:s},r.props),r.content)))))}function ea(e){let t=[];for(let n of e){let o=n.name.split("/"),r=t;for(let s=0;sd.name===i);if(u===-1){let d={name:i,children:[],codeFile:void 0};c&&(d.codeFile=n),r.push(d),r=d.children}else r=r[u].children}}return t=bo(t),t}function bo(e){for(let t of e)t.children=bo(t.children);return e.sort((t,n)=>{let o=t.children&&t.children.length>0,r=n.children&&n.children.length>0;return o&&r||!o&&!r?t.name.localeCompare(n.name):o?-1:1})}function ta({style:e,step:t,theme:n,className:o}){let[r,s]=a.default.useState(!1),[i,c]=a.default.useState(!0),u=a.default.useRef(null),d=t.files;return a.default.useEffect(()=>{u.current&&!u.current.showModal&&c(!1)},[]),i?a.default.createElement(a.default.Fragment,null,a.default.createElement(na,{className:o,style:e,onClick:()=>{u.current.showModal(),document.body.classList.add("ch-no-scroll"),s(!0)}}),a.default.createElement("dialog",{ref:u,className:"ch-expand-dialog",onClose:()=>{s(!1)},onClick:f=>{f.currentTarget===f.target&&(u.current.close(),document.body.classList.remove("ch-no-scroll"))}},a.default.createElement(oa,{onClick:()=>{u.current.close(),document.body.classList.remove("ch-no-scroll")}}),r?a.default.createElement("div",{className:"ch-expand-dialog-content",style:{borderColor:B(n,v.SideBarBorder)}},a.default.createElement(Ki,{files:d,theme:n,startingFileName:t.northPanel.active})):void 0)):null}function na({onClick:e,style:t,className:n}){return a.default.createElement("svg",{style:t,onClick:e,className:n,fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",role:"button"},a.default.createElement("title",null,"Expand"),a.default.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4"}))}function oa({onClick:e}){return a.default.createElement("svg",{onClick:e,className:"ch-expand-close",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",role:"button"},a.default.createElement("title",null,"Close"),a.default.createElement("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"}))}var ra={files:[{code:{lines:[],lang:"js"},focus:"",name:""}],northPanel:{active:"",tabs:[""],heightRatio:1}};function sa(e){var{prev:t=ra,next:n,t:o,backward:r,codeConfig:s,frameProps:i={}}=e,c=I(e,["prev","next","t","backward","codeConfig","frameProps"]);let u=a.default.createRef(),{showCopyButton:d,showExpandButton:f}=s,g=I(s,["showCopyButton","showExpandButton"]),{northPanel:y,southPanel:m,northContent:w,southContent:k}=qi(u,t,n||t,o,r,g),[E,j]=a.default.useState(void 0);so(()=>{var S;let z=(S=u.current)===null||S===void 0?void 0:S.getBoundingClientRect().height;j(z)},[]);let D=Object.assign(Object.assign(Object.assign({},i),c),{style:Object.assign(Object.assign({},i?.style),c?.style)});E&&(D.style.height=E,D.style.maxHeight=E);let C=a.default.createElement(a.default.Fragment,null,d?a.default.createElement(ot,{className:"ch-editor-button",content:w}):void 0,f?a.default.createElement(ta,{className:"ch-editor-button",step:n||t,theme:s.theme}):void 0),x=d?a.default.createElement(ot,{className:"ch-editor-button",content:k}):void 0,O=a.default.createElement(zi,{prev:t.terminal,next:(n||t).terminal,t:o,backward:r});return a.default.createElement(Ni,Object.assign({ref:u},D,{northPanel:y,southPanel:m,terminalPanel:O,theme:s.theme,northButton:C,southButton:x}))}var ia={stiffness:120,damping:24,mass:.2,decimals:3};function yo(e){var{northPanel:t,southPanel:n,files:o,terminal:r,springConfig:s}=e,i=I(e,["northPanel","southPanel","files","terminal","springConfig"]);let c=a.default.useMemo(()=>({northPanel:t,southPanel:n,files:o,terminal:r}),[t,n,o,r]),{prev:u,next:d,t:f}=aa(c,s);return a.default.createElement(sa,Object.assign({t:f,backward:!1,prev:u,next:d},i))}function aa(e,t=ia){let[{target:n,steps:o,index:r},s]=a.default.useState({target:2,steps:[e,e,e],index:0});a.default.useEffect(()=>{o[o.length-1]!=e&&s(f=>ca(f,e,i))},[e]);let[i]=Mt(n,t),c=i-r;return c<=1?{prev:o[0],next:o[1],t:c}:{prev:o[1],next:o[2],t:c-1}}function ca(e,t,n){let{steps:o,target:r,index:s}=e,i=o.slice();return n-s<1?(i[2]=t,Object.assign(Object.assign({},e),{steps:i})):(i[0]=o[1],i[1]=o[2],i[2]=t,Object.assign(Object.assign({},e),{steps:i,target:r+1,index:s+1}))}function vo(e){let[t,n]=a.default.useState(e);function o(r){let s=ve(t,r,null);n(Object.assign(Object.assign({},t),s))}return a.default.createElement(De,Object.assign({},t,{onTabClick:o}))}function la(e){var t,n,o,r,s,i,c,u,d;let{lineNumbers:f,showCopyButton:g,showExpandButton:y,minZoom:m,maxZoom:w}=e,k=I(e,["lineNumbers","showCopyButton","showExpandButton","minZoom","maxZoom"]),E=Object.assign(Object.assign({},e.codeConfig),{maxZoom:w??((t=e.codeConfig)===null||t===void 0?void 0:t.maxZoom),minZoom:m??((n=e.codeConfig)===null||n===void 0?void 0:n.minZoom),horizontalCenter:(r=(o=e.codeConfig)===null||o===void 0?void 0:o.horizontalCenter)!==null&&r!==void 0?r:e.horizontalCenter,lineNumbers:f??((s=e.codeConfig)===null||s===void 0?void 0:s.lineNumbers),showCopyButton:g??((i=e.codeConfig)===null||i===void 0?void 0:i.showCopyButton),showExpandButton:y??((c=e.codeConfig)===null||c===void 0?void 0:c.showExpandButton),rows:e.rows,debug:(u=e.debug)!==null&&u!==void 0?u:(d=e.codeConfig)===null||d===void 0?void 0:d.debug});return Object.assign(Object.assign({},k),{codeConfig:E})}function De(e){var{onTabClick:t}=e,n=I(e,["onTabClick"]);let o=la(n),{className:r,style:s,codeConfig:i}=o,c=I(o,["className","style","codeConfig"]);if(!n.southPanel&&n.files.length===1&&!n.files[0].name)return a.default.createElement("div",{className:`ch-codeblock not-prose ${r||""}`,style:s},a.default.createElement(Si,{className:"ch-code",config:i,step:c.files[0]}));{let u=Object.assign(Object.assign({},c?.frameProps),{onTabClick:t});return a.default.createElement("div",{className:`ch-codegroup not-prose ${r||""}`,style:s},a.default.createElement(yo,Object.assign({},c,{frameProps:u,codeConfig:i})))}}function ve(e,t,n){let o=t||e.northPanel.active,r=e.files.map(c=>c.name===o?Object.assign(Object.assign({},c),{focus:n===null?c.focus:n}):c),s=Object.assign({},e.northPanel),i=e.southPanel&&Object.assign({},e.southPanel);return e.northPanel.tabs.includes(o)?s.active=o:i&&(i.active=o),{files:r,northPanel:s,southPanel:i}}var ko=a.default.createContext({props:null,setFocus:()=>{}});function Fo(e){var{children:t,className:n,style:o}=e,r=I(e,["children","className","style"]);let[s,i]=a.default.useState(r),c=()=>i(r),u=({fileName:f,focus:g,id:y})=>{let m=ve(s,f,g);i(Object.assign(Object.assign(Object.assign({},s),m),{selectedId:y}))},d=I(s,["selectedId"]);return a.default.createElement("section",{className:`ch-section ${n||""}`,style:o},a.default.createElement(ko.Provider,{value:{props:d,setFocus:u}},a.default.createElement(Gt,{onActivation:u,onReset:c},t)))}function wo(e){let{props:t,setFocus:n}=a.default.useContext(ko),o=r=>{n({fileName:r,focus:null,id:""})};return a.default.createElement(De,Object.assign({},e,t,{onTabClick:o}))}function Eo({focus:e,file:t,children:n,id:o}){let{activate:r,reset:s,activatedId:i}=a.default.useContext(Co),c=i===o;return a.default.createElement("span",{className:"ch-section-link","data-active":c,children:n,onMouseOver:()=>r({fileName:t,focus:e,id:o}),onMouseOut:s})}var Co=a.default.createContext({activatedId:void 0,activate:()=>{},reset:()=>{}});function Gt({onActivation:e,onReset:t,children:n}){let[o,r]=a.default.useState(void 0),s=a.default.useCallback(c=>{r(c.id),e(c)},[e]),i=a.default.useCallback(()=>{r(void 0),t()},[t]);return a.default.createElement(Co.Provider,{value:{activate:s,reset:i,activatedId:o}},n)}function ua(){let e=ne("ch-browser");return a.default.createElement("svg",{fill:"currentColor",preserveAspectRatio:"xMidYMid meet",height:"1em",viewBox:"13 10 14 23",className:e("button","back-button")},a.default.createElement("g",null,a.default.createElement("path",{d:"m26.5 12.1q0 0.3-0.2 0.6l-8.8 8.7 8.8 8.8q0.2 0.2 0.2 0.5t-0.2 0.5l-1.1 1.1q-0.3 0.3-0.6 0.3t-0.5-0.3l-10.4-10.4q-0.2-0.2-0.2-0.5t0.2-0.5l10.4-10.4q0.3-0.2 0.5-0.2t0.6 0.2l1.1 1.1q0.2 0.2 0.2 0.5z"})))}function da(){let e=ne("ch-browser");return a.default.createElement("svg",{fill:"currentColor",preserveAspectRatio:"xMidYMid meet",height:"1em",viewBox:"13 10 14 23",className:e("button","forward-button")},a.default.createElement("g",null,a.default.createElement("path",{d:"m26.3 21.4q0 0.3-0.2 0.5l-10.4 10.4q-0.3 0.3-0.6 0.3t-0.5-0.3l-1.1-1.1q-0.2-0.2-0.2-0.5t0.2-0.5l8.8-8.8-8.8-8.7q-0.2-0.3-0.2-0.6t0.2-0.5l1.1-1.1q0.3-0.2 0.5-0.2t0.6 0.2l10.4 10.4q0.2 0.2 0.2 0.5z"})))}function fa({href:e,style:t}){let n=ne("ch-browser");return a.default.createElement("a",{className:n("button","open-button"),title:"Open in new tab",href:e,style:t,target:"_blank",rel:"noopener noreferrer"},a.default.createElement("svg",{stroke:"currentColor",fill:"currentColor",strokeWidth:"0",viewBox:"3 3 18 18",height:"1em",width:"1em",className:n("open-icon"),xmlns:"http://www.w3.org/2000/svg"},a.default.createElement("path",{d:"M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"})))}function pa({url:e,linkUrl:t,theme:n}){let o=B(n,v.InputBorder);return a.default.createElement(a.default.Fragment,null,a.default.createElement(Rt,null),a.default.createElement(ua,null),a.default.createElement(da,null),a.default.createElement("input",{value:e||"",readOnly:!0,style:{background:B(n,v.InputBackground),color:B(n,v.InputForeground),border:o?`1px solid ${o}`:void 0}}),a.default.createElement(fa,{href:t,style:{color:B(n,v.EditorForeground)}}))}function ga(e){return a.default.useMemo(()=>e?e.map(t=>{let{displayUrl:n,loadUrl:o}=ha(t.url,t.loadUrl,t.prependOrigin);return{zoom:t.zoom||1,displayUrl:n,loadUrl:o,children:t.children}}):[{zoom:1}],[e])}function ha(e,t,n){let o=typeof window<"u"?window.origin:"",r=e&&n===!0?o+e:e;return{displayUrl:r,loadUrl:t||r}}var ma=a.default.forwardRef(ba);function ba(e,t){var{progress:n=0,backward:o=!1,steps:r,transition:s="none",classes:i,theme:c}=e,u=I(e,["progress","backward","steps","transition","classes","theme"]);let d=ne("ch-mini-browser",i),f=ga(r),g=Math.round(n),{zoom:y,displayUrl:m,loadUrl:w,children:k}=f[g];return a.default.createElement(Li,Object.assign({},u,{zoom:y,className:`${d("")} ${u.className||""}`,style:Object.assign(Object.assign({},ya({progress:n,transition:s})),u.style),classes:i,titleBar:a.default.createElement(pa,{url:m,linkUrl:w,theme:c}),theme:c}),k||a.default.createElement("iframe",{ref:t,src:w}))}function ya({progress:e,transition:t}){if(t==="slide"){let o=e-Math.floor(e),r=o<=.5?-50*o:50-50*o,s=Math.abs(o-.5)*2;return{transform:`translateX(${r}px)`,opacity:s*s}}return{}}function xo(e){var{url:t,loadUrl:n,prependOrigin:o,children:r,zoom:s}=e,i=I(e,["url","loadUrl","prependOrigin","children","zoom"]);let[c,u]=va({url:t,loadUrl:n,prependOrigin:o,children:r,zoom:s});return a.default.createElement(ma,Object.assign({},i,{steps:c,progress:u}))}function va({url:e,loadUrl:t,prependOrigin:n,children:o,zoom:r}){let[s,i]=a.default.useState({target:0,steps:[{url:e,loadUrl:t,prependOrigin:n,children:o,zoom:r}]});a.default.useEffect(()=>{let u=s.steps[s.steps.length-1];(u.url!==e||u.loadUrl!==t||u.prependOrigin!==n||u.children!==o)&&i(d=>({target:d.target+1,steps:[...d.steps,{url:e,loadUrl:t,prependOrigin:n,children:o,zoom:r}]}))},[e,t,n,o,r]);let[c]=Mt(s.target,{stiffness:100,decimals:3});return[s.steps,c]}var Qe=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},qt={};Object.defineProperty(qt,"__esModule",{value:!0});function ka(e){return e==="vue-cli"?"src/main.js":e==="angular-cli"?"src/main.ts":e==="create-react-app-typescript"?"src/index.tsx":e==="parcel"?"index.html":e==="gatsby"?"src/pages/index.js":e==="nuxt"||e==="next"||e==="apollo"||e==="reason"||e==="sapper"?"package.json":e==="nest"?"src/main.ts":e==="static"?"index.html":"src/index.js"}qt.getMainFile=ka;var Vn="sandbox.config.json";function Fa(e,t){var n=t[Vn]||t["/"+Vn];if(n)try{var o=JSON.parse(n.content);if(o.template)return o.template}catch{}var r=e.dependencies,s=r===void 0?{}:r,i=e.devDependencies,c=i===void 0?{}:i,u=Object.keys(s).concat(Object.keys(c)),d=["nuxt","nuxt-edge"];if(u.some(function(m){return d.indexOf(m)>-1}))return"nuxt";if(u.indexOf("next")>-1)return"next";var f=["apollo-server","apollo-server-express","apollo-server-hapi","apollo-server-koa","apollo-server-lambda","apollo-server-micro"];if(u.some(function(m){return f.indexOf(m)>-1}))return"apollo";if(u.indexOf("ember-cli")>-1)return"ember";if(u.indexOf("sapper")>-1)return"sapper";var g=Object.keys(t);if(g.some(function(m){return m.endsWith(".vue")}))return"vue-cli";if(g.some(function(m){return m.endsWith(".re")}))return"reason";if(u.indexOf("gatsby")>-1)return"gatsby";if(u.indexOf("parcel-bundler")>-1)return"parcel";if(u.indexOf("react-scripts")>-1)return"create-react-app";if(u.indexOf("react-scripts-ts")>-1)return"create-react-app-typescript";if(u.indexOf("@angular/core")>-1)return"angular-cli";if(u.indexOf("preact-cli")>-1)return"preact-cli";if(u.indexOf("svelte")>-1)return"svelte";if(u.indexOf("vue")>-1)return"vue-cli";var y=["@dojo/core","@dojo/framework"];if(u.some(function(m){return y.indexOf(m)>-1}))return"@dojo/cli-create-app";if(u.indexOf("cx")>-1)return"cxjs";if(u.indexOf("@nestjs/core")>-1||u.indexOf("@nestjs/common")>-1)return"nest"}var wa=qt.getTemplate=Fa,Lt={exports:{}};(function(e,t){var n=200,o="__lodash_hash_undefined__",r=1,s=2,i=9007199254740991,c="[object Arguments]",u="[object Array]",d="[object AsyncFunction]",f="[object Boolean]",g="[object Date]",y="[object Error]",m="[object Function]",w="[object GeneratorFunction]",k="[object Map]",E="[object Number]",j="[object Null]",D="[object Object]",C="[object Promise]",x="[object Proxy]",O="[object RegExp]",S="[object Set]",z="[object String]",ue="[object Symbol]",de="[object Undefined]",oe="[object WeakMap]",fe="[object ArrayBuffer]",_="[object DataView]",q="[object Float32Array]",_e="[object Float64Array]",ut="[object Int8Array]",dt="[object Int16Array]",_o="[object Int32Array]",Mo="[object Uint8Array]",Ro="[object Uint8ClampedArray]",$o="[object Uint16Array]",Wo="[object Uint32Array]",zo=/[\\^$.*+?()[\]{}|]/g,Go=/^\[object .+?Constructor\]$/,qo=/^(?:0|[1-9]\d*)$/,T={};T[q]=T[_e]=T[ut]=T[dt]=T[_o]=T[Mo]=T[Ro]=T[$o]=T[Wo]=!0,T[c]=T[u]=T[fe]=T[f]=T[_]=T[g]=T[y]=T[m]=T[k]=T[E]=T[D]=T[O]=T[S]=T[z]=T[oe]=!1;var Xt=typeof Qe=="object"&&Qe&&Qe.Object===Object&&Qe,Uo=typeof self=="object"&&self&&self.Object===Object&&self,Q=Xt||Uo||Function("return this")(),Vt=t&&!t.nodeType&&t,Yt=Vt&&!0&&e&&!e.nodeType&&e,Kt=Yt&&Yt.exports===Vt,ft=Kt&&Xt.process,Jt=function(){try{return ft&&ft.binding&&ft.binding("util")}catch{}}(),Qt=Jt&&Jt.isTypedArray;function Xo(l,p){for(var b=-1,F=l==null?0:l.length,L=0,A=[];++b-1}function Er(l,p){var b=this.__data__,F=We(b,l);return F<0?(++this.size,b.push([l,p])):b[F][1]=p,this}Z.prototype.clear=vr,Z.prototype.delete=kr,Z.prototype.get=Fr,Z.prototype.has=wr,Z.prototype.set=Er;function he(l){var p=-1,b=l==null?0:l.length;for(this.clear();++pM))return!1;var N=A.get(l);if(N&&A.get(p))return N==p;var U=-1,Y=!0,G=b&s?new $e:void 0;for(A.set(l,p),A.set(p,l);++U-1&&l%1==0&&l-1&&l%1==0&&l<=i}function hn(l){var p=typeof l;return l!=null&&(p=="object"||p=="function")}function Ie(l){return l!=null&&typeof l=="object"}var mn=Qt?Jo(Qt):Rr;function es(l){return Qr(l)?Pr(l):$r(l)}function ts(){return[]}function ns(){return!1}e.exports=Zr})(Lt,Lt.exports);var Ea=Lt.exports,Yn=()=>Math.floor(Math.random()*1e6+Math.random()*1e6),Ca=e=>{try{return e.constructor.name}catch{return""}},xa=class{constructor(e,t,n){this.type=e,this.handleMessage=t,this.target=n,this.outgoingMessages=new Set,this._messageListener=async o=>{var r;let{data:s}=o;if(s.$type!==this.getTypeId()||this.outgoingMessages.has(s.$id))return;let i={$originId:this.internalId,$type:this.getTypeId(),$id:s.$id};try{let c=await this.handleMessage(s.$data);i.$data=c}catch(c){c.message||console.error(c),i.$error={message:(r=c.message)!=null?r:"Unknown error"}}o.source?o.source.postMessage(i,"*"):this._postMessage(i)},this.createConnection(),this.internalId=Yn(),this.isWorker=Ca(n)==="Worker"}getTypeId(){return`p-${this.type}`}createConnection(){self.addEventListener("message",this._messageListener)}dispose(){self.removeEventListener("message",this._messageListener)}sendMessage(e){return new Promise(t=>{let n=Yn(),o={$originId:this.internalId,$type:this.getTypeId(),$data:e,$id:n};this.outgoingMessages.add(n);let r=s=>{let{data:i}=s;i.$type===this.getTypeId()&&i.$id===n&&i.$originId!==this.internalId&&(t(i.$data),self.removeEventListener("message",r))};self.addEventListener("message",r),this._postMessage(o)})}_postMessage(e){this.isWorker||typeof DedicatedWorkerGlobalScope<"u"&&this.target instanceof DedicatedWorkerGlobalScope?this.target.postMessage(e):this.target.postMessage(e,"*")}},Ba=class{constructor(e,t){this.globalListeners={},this.globalListenersCount=0,this.channelListeners={},this.channelListenersCount=0,this.channelId=Math.floor(Math.random()*1e6),this.frameWindow=e.contentWindow,this.origin=t,this.globalListeners=[],this.channelListeners=[],this.eventListener=this.eventListener.bind(this),typeof window<"u"&&window.addEventListener("message",this.eventListener)}cleanup(){window.removeEventListener("message",this.eventListener),this.globalListeners={},this.channelListeners={},this.globalListenersCount=0,this.channelListenersCount=0}register(){!this.frameWindow||this.frameWindow.postMessage({type:"register-frame",origin:document.location.origin,id:this.channelId},this.origin)}dispatch(e){!this.frameWindow||this.frameWindow.postMessage({$id:this.channelId,codesandbox:!0,...e},this.origin)}globalListen(e){if(typeof e!="function")return()=>{};let t=this.globalListenersCount;return this.globalListeners[t]=e,this.globalListenersCount++,()=>{delete this.globalListeners[t]}}channelListen(e){if(typeof e!="function")return()=>{};let t=this.channelListenersCount;return this.channelListeners[t]=e,this.channelListenersCount++,()=>{delete this.channelListeners[t]}}eventListener(e){if(e.source!==this.frameWindow)return;let t=e.data;!t.codesandbox||(Object.values(this.globalListeners).forEach(n=>n(t)),t.$id===this.channelId&&Object.values(this.channelListeners).forEach(n=>n(t)))}};function Bo(e={},t={},n="/index.js"){return JSON.stringify({name:"sandpack-project",main:n,dependencies:e,devDependencies:t},null,2)}function Da(e,t,n,o){let r={...e};if(!r["/package.json"]){if(!t)throw new Error("No dependencies specified, please specify either a package.json or dependencies.");if(!o)throw new Error("Missing 'entry' parameter. Either specify an entry point, or pass in a package.json with the 'main' field set.");r["/package.json"]={code:Bo(t,n,o)}}return r}function Aa(e){if(e.title==="SyntaxError"){let{title:s,path:i,message:c,line:u,column:d}=e;return{title:s,path:i,message:c,line:u,column:d}}let t=ja(e.payload.frames);if(!t)return{message:e.message};let n=Oa(t),o=Sa(t);return{message:Ia(t._originalFileName,e.message,o,n),title:e.title,path:t._originalFileName,line:t._originalLineNumber,column:t._originalColumnNumber}}function ja(e){if(!!e)return e.find(t=>!!t._originalFileName)}function Sa(e){return e?` (${e._originalLineNumber}:${e._originalColumnNumber})`:""}function Oa(e){let n=e._originalScriptCode[e._originalScriptCode.length-1].lineNumber.toString().length,o=2,r=3,s=o+n+r+e._originalColumnNumber;return e._originalScriptCode.reduce((i,c)=>{let u=c.highlight?">":" ",d=c.lineNumber.toString().length===n?`${c.lineNumber}`:` ${c.lineNumber}`,f=c.highlight?` `+" ".repeat(s)+"^":"";return i+` `+u+" "+d+" | "+c.content+f},"")}function Ia(e,t,n,o){return`${e}: ${t}${n} ${o}`}var Ta=`https://${"0.19.0".replace(/\./g,"-")}-sandpack.codesandbox.io/`,La=class{constructor(e,t,n={}){this.getTranspilerContext=()=>new Promise(s=>{let i=this.listen(c=>{c.type==="transpiler-context"&&(s(c.data),i())});this.dispatch({type:"get-transpiler-context"})});var o;if(this.options=n,this.sandboxInfo=t,this.bundlerURL=n.bundlerURL||Ta,this.bundlerState=void 0,this.errors=[],this.status="initializing",typeof e=="string"){this.selector=e;let s=document.querySelector(e);if(!s)throw new Error(`No element found for selector '${e}'`);this.element=s,this.iframe=document.createElement("iframe"),this.initializeElement()}else this.element=e,this.iframe=e;this.iframe.getAttribute("sandbox")||this.iframe.setAttribute("sandbox","allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts");let r=n.startRoute?new URL(n.startRoute,this.bundlerURL).toString():this.bundlerURL;(o=this.iframe.contentWindow)==null||o.location.replace(r),this.iframeProtocol=new Ba(this.iframe,this.bundlerURL),this.unsubscribeGlobalListener=this.iframeProtocol.globalListen(s=>{s.type!=="initialized"||!this.iframe.contentWindow||(this.iframeProtocol.register(),this.options.fileResolver&&(this.fileResolverProtocol=new xa("file-resolver",async i=>i.m==="isFile"?this.options.fileResolver.isFile(i.p):this.options.fileResolver.readFile(i.p),this.iframe.contentWindow)),this.updatePreview(this.sandboxInfo,!0))}),this.unsubscribeChannelListener=this.iframeProtocol.channelListen(s=>{switch(s.type){case"start":{this.errors=[];break}case"status":{this.status=s.status;break}case"action":{s.action==="show-error"&&(this.errors=[...this.errors,Aa(s)]);break}case"state":{this.bundlerState=s.state;break}}})}cleanup(){this.unsubscribeChannelListener(),this.unsubscribeGlobalListener(),this.iframeProtocol.cleanup()}updateOptions(e){Ea(this.options,e)||(this.options=e,this.updatePreview())}updatePreview(e=this.sandboxInfo,t){var n,o,r,s;this.sandboxInfo={...this.sandboxInfo,...e};let i=this.getFiles(),c=Object.keys(i).reduce((f,g)=>({...f,[g]:{code:i[g].code,path:g}}),{}),u=JSON.parse(Bo(this.sandboxInfo.dependencies,this.sandboxInfo.devDependencies,this.sandboxInfo.entry));try{u=JSON.parse(i["/package.json"].code)}catch(f){console.error("Could not parse package.json file: "+f.message)}let d=Object.keys(i).reduce((f,g)=>({...f,[g]:{content:i[g].code,path:g}}),{});this.dispatch({type:"compile",codesandbox:!0,version:3,isInitializationCompile:t,modules:c,reactDevTools:this.options.reactDevTools,externalResources:this.options.externalResources||[],hasFileResolver:Boolean(this.options.fileResolver),disableDependencyPreprocessing:this.sandboxInfo.disableDependencyPreprocessing,template:this.sandboxInfo.template||wa(u,d),showOpenInCodeSandbox:(n=this.options.showOpenInCodeSandbox)!=null?n:!0,showErrorScreen:(o=this.options.showErrorScreen)!=null?o:!0,showLoadingScreen:(r=this.options.showLoadingScreen)!=null?r:!0,skipEval:this.options.skipEval||!1,clearConsoleDisabled:!this.options.clearConsoleOnFirstCompile,logLevel:(s=this.options.logLevel)!=null?s:Nt.Info})}dispatch(e){this.iframeProtocol.dispatch(e)}listen(e){return this.iframeProtocol.channelListen(e)}getCodeSandboxURL(){let e=this.getFiles(),t=Object.keys(e).reduce((n,o)=>({...n,[o.replace("/","")]:{content:e[o].code,isBinary:!1}}),{});return fetch("https://codesandbox.io/api/v1/sandboxes/define?json=1",{method:"POST",body:JSON.stringify({files:t}),headers:{Accept:"application/json","Content-Type":"application/json"}}).then(n=>n.json()).then(n=>({sandboxId:n.sandbox_id,editorUrl:`https://codesandbox.io/s/${n.sandbox_id}`,embedUrl:`https://codesandbox.io/embed/${n.sandbox_id}`}))}getFiles(){let{sandboxInfo:e}=this;return e.files["/package.json"]===void 0?Da(e.files,e.dependencies,e.devDependencies,e.entry):this.sandboxInfo.files}initializeElement(){if(this.iframe.style.border="0",this.iframe.style.width=this.options.width||"100%",this.iframe.style.height=this.options.height||"100%",this.iframe.style.overflow="hidden",!this.element.parentNode)throw new Error("Given element does not have a parent.");this.element.parentNode.replaceChild(this.iframe,this.element)}},Nt;(function(e){e[e.None=0]="None",e[e.Error=10]="Error",e[e.Warning=20]="Warning",e[e.Info=30]="Info",e[e.Debug=40]="Debug"})(Nt||(Nt={}));function te(e){var{className:t,files:n,presetConfig:o,show:r,children:s,codeConfig:i,style:c,frameless:u}=e,d=I(e,["className","files","presetConfig","show","children","codeConfig","style","frameless"]);let f=o?a.default.createElement(Na,{files:n,presetConfig:o}):s;return a.default.createElement("div",{className:"ch-preview"+(t?" "+t:""),style:c},u?f:a.default.createElement(xo,Object.assign({loadUrl:r,theme:i.theme},d,{children:f})))}function Na({files:e,presetConfig:t}){let n=a.default.useRef(null),o=a.default.useRef(null);return a.default.useEffect(()=>{o.current=new La(n.current,Object.assign(Object.assign({},t),{files:Kn(t.files,e)}),{showOpenInCodeSandbox:!1})},[]),a.default.useEffect(()=>{o.current&&o.current.updatePreview(Object.assign(Object.assign({},t),{files:Kn(t.files,e)}))},[e]),a.default.createElement("iframe",{ref:n})}function Kn(e,t){let n=Object.assign({},e);return t.forEach(o=>{n["/"+o.name]={code:o.code.lines.map(r=>r.tokens.map(s=>s.content).join("")).join(` `)}}),n}function it(e,t){let n=a.default.Children.toArray(e),o=t?n.slice(0,n.length/2):n,r=t?n.slice(n.length/2):void 0;return{stepsChildren:o,previewChildren:r}}function Do(e){var t,{children:n,editorSteps:o,codeConfig:r,start:s=0,presetConfig:i,className:c,style:u,hasPreviewSteps:d}=e,f=I(e,["children","editorSteps","codeConfig","start","presetConfig","className","style","hasPreviewSteps"]);let{stepsChildren:g,previewChildren:y}=it(n,d),m=i||d,[w,k]=a.default.useState({stepIndex:s,step:o[s]}),E=w.step;function j(C){let x=ve(w.step,C,null);k(Object.assign(Object.assign({},w),{step:x}))}let D=g[0];return a.default.createElement("section",{className:`ch-spotlight ${m?"ch-spotlight-with-preview":""} ${c||""}`,style:u},a.default.createElement("div",{className:"ch-spotlight-tabs"},!((t=D?.props)===null||t===void 0)&&t.children?a.default.createElement("div",null,g[0]):null,g.map((C,x)=>x===0?null:a.default.createElement("div",{key:x,onClick:()=>k({stepIndex:x,step:o[x]}),className:"ch-spotlight-tab","data-selected":x===w.stepIndex?"true":void 0},C))),a.default.createElement("div",{className:"ch-spotlight-sticker"},a.default.createElement(De,Object.assign({},f,E,{codeConfig:r,onTabClick:j})),i?a.default.createElement(te,{className:"ch-spotlight-preview",files:E.files,presetConfig:i,codeConfig:r}):d?a.default.createElement(te,Object.assign({className:"ch-spotlight-preview"},y[w.stepIndex].props)):null))}function Pa(e){e.forEach(Ha)}function Ha(e){var t;let n=((t=e.rootBounds)===null||t===void 0?void 0:t.height)||0;Bt(e.rootBounds,{border:`${Math.min(10,n/2)}px solid ${Ze.rootColor}`,overflow:"hidden",boxSizing:"border-box"}),Bt(e.boundingClientRect,{border:`${Math.min(10,e.boundingClientRect.height/2)}px solid ${e.isIntersecting?Ze.enterColor:Ze.exitColor}`,overflow:"hidden",boxSizing:"border-box"}),Bt(e.intersectionRect,{backgroundColor:Ze.interColor,zIndex:2})}function Bt(e,t={}){let{width:n,left:o,height:r,top:s}=e,i=document.createElement("div");return i.style.position="fixed",i.style.width=n+"px",i.style.left=o+"px",i.style.top=s+"px",i.style.height=r+"px",i.style.pointerEvents="none",i.style.transition="opacity 2s ease-in",Object.assign(i.style,t),requestAnimationFrame(()=>requestAnimationFrame(()=>{i.style.opacity="0"})),i.addEventListener("transitionend",()=>{document.body.removeChild(i)}),document.body.appendChild(i),i}var Ze={rootColor:"#9428AB",enterColor:"#B35C00",exitColor:"#035570",interColor:"#9CAF00BB"},_a=typeof window<"u"?a.default.useLayoutEffect:a.default.useEffect;function Ma(){let e=typeof window=="object";function t(){return e?document.documentElement.clientHeight:void 0}let[n,o]=a.default.useState(t);return a.default.useEffect(()=>{function r(){o(t())}return window.addEventListener("resize",r),()=>window.removeEventListener("resize",r)},[]),_a(()=>{o(t())},[]),n}var Ao=a.default.createContext(void 0),Pt=typeof window<"u"?a.default.useLayoutEffect:a.default.useEffect;function Ra({onStepChange:e,children:t,getRootMargin:n=za,debug:o=!1}){let[r,s]=a.default.useState(),i=Ma();return Pt(()=>{let d=Wa(f=>{(o||window.chDebugScroller)&&Pa(f),f.forEach(g=>{if(g.intersectionRatio>0){let y=g.target;e(+y.stepIndex)}})},n(i||0));return s(d),()=>d.disconnect()},[i]),a.default.createElement(Ao.Provider,{value:r},t)}function $a(e){var{as:t="section",index:n}=e,o=I(e,["as","index"]);let r=a.default.useRef(null),s=a.default.useContext(Ao);return Pt(()=>(s&&s.observe(r.current),()=>s&&s.unobserve(r.current)),[s]),Pt(()=>{let i=r.current;i.stepIndex=n},[n]),a.default.createElement(t,Object.assign(Object.assign({},o),{ref:r}))}function Wa(e,t){return new IntersectionObserver(e,{rootMargin:t,threshold:1e-6,root:null})}function za(e){return`-${e/2-2}px 0px`}var Ga=0;function qa({match:e}){let t=e.map(([s])=>s),{isServer:n,matchedIndex:o}=Va(t),r=n?"ssmq-"+Ga++:"";return n?a.default.createElement(a.default.Fragment,null,a.default.createElement("style",{className:r,dangerouslySetInnerHTML:{__html:Ua(t,r)}}),e.map(([s,i])=>a.default.createElement("div",{key:s,className:`${r} ${st(s)}`},i)),a.default.createElement("script",{className:r,dangerouslySetInnerHTML:{__html:Xa(e,r)}})):a.default.createElement(a.default.Fragment,null,a.default.createElement("div",null,e[o][1]))}function Ua(e,t){return e.slice().reverse().map(r=>{let s=`.${t}.${st(r)}{display:block}`,i=`.${t}:not(.${st(r)}){display: none;}`;return r==="default"?`${s}${i}`:`@media ${r}{${s}${i}}`}).join(` `)}function Xa(e,t){let n=e.map(([r])=>r),o=n.map(st);return`(function() { var qs = ${JSON.stringify(n)}; var clss = ${JSON.stringify(o)}; var mainCls = "${t}"; var scrEls = document.getElementsByTagName("script"); var scrEl = scrEls[scrEls.length - 1]; var parent = scrEl.parentNode; var el = null; for (var i = 0; i < qs.length - 1; i++) { if (window.matchMedia(qs[i]).matches) { el = parent.querySelector(":scope > ." + mainCls + "." + clss[i]); break; } } if (!el) { var defaultClass = clss.pop(); el = parent.querySelector(":scope > ." + mainCls + "." + defaultClass); } el.removeAttribute("class"); parent.querySelectorAll(":scope > ." + mainCls).forEach(function (e) { parent.removeChild(e); }); })();`}function st(e){return"ssmq-"+e.replace(/[!\"#$%&'\(\)\*\+,\.\/:;<=>\?\@\[\\\]\^`\{\|\}~\s]/g,"").toLowerCase()}function Va(e){let t=typeof window>"u",n=e.slice(0,-1);e[e.length-1]!=="default"&&console.warn("last media query should be 'default'");let[,o]=a.default.useState(0),r=t?[]:n.map(i=>window.matchMedia(i));a.default.useEffect(()=>{let i=()=>o(c=>c+1);return r.forEach(c=>c.addListener(i)),()=>r.forEach(c=>c.removeListener(i))},[]);let s=r.findIndex(i=>i.matches);return{isServer:t,matchedIndex:s<0?e.length-1:s}}function jo(){let e=a.default.useContext(Ut);return e?a.default.createElement(Ya,Object.assign({},e)):null}function Ya({editorStep:e,setFocus:t}){let n=r=>{t({fileName:r,focus:null,id:""})},o=I(e,["preset","presetConfig"]);return a.default.createElement(De,Object.assign({},o,{onTabClick:n}))}function So(){let e=a.default.useContext(Ut);return e?a.default.createElement(Ka,Object.assign({},e)):null}function Ka({previewStep:e,allProps:t,editorStep:n}){let o=I(t,["preset"]);return a.default.createElement(te,Object.assign({className:"ch-scrollycoding-preview"},o,e?.props,{files:n.files}))}var Ut=a.default.createContext(null);function Oo(e){return a.default.createElement(qa,{match:[[e.codeConfig.staticMediaQuery,a.default.createElement(Ja,Object.assign({},e))],["default",a.default.createElement(Za,Object.assign({},e))]]})}function Ja(e){var{children:t,hasPreviewSteps:n,editorSteps:o}=e,r=I(e,["children","hasPreviewSteps","editorSteps"]);let{stepsChildren:s,previewChildren:i}=it(t,n);return a.default.createElement("section",{className:"ch-scrollycoding-static"},s.map((c,u)=>a.default.createElement(Qa,{key:u,editorStep:o[u],previewStep:i&&i[u],allProps:r},c)))}function Qa({editorStep:e,previewStep:t,allProps:n,children:o}){let[r,s]=a.default.useState(Object.assign(Object.assign({},e),n)),i=()=>s(Object.assign(Object.assign({},e),n)),c=({fileName:u,focus:d,id:f})=>{let g=ve(r,u,d);s(Object.assign(Object.assign(Object.assign({},r),g),{selectedId:f}))};return a.default.createElement(Ut.Provider,{value:{editorStep:r,previewStep:t,allProps:n,setFocus:c}},a.default.createElement(Gt,{onActivation:c,onReset:i},o))}function Za(e){var{children:t,editorSteps:n,codeConfig:o,presetConfig:r,start:s=0,className:i,style:c,hasPreviewSteps:u}=e,d=I(e,["children","editorSteps","codeConfig","presetConfig","start","className","style","hasPreviewSteps"]);let{stepsChildren:f,previewChildren:g}=it(t,u),y=r||u,[m,w]=a.default.useState({stepIndex:s,step:n[s]}),k=m.step;function E(C){w({stepIndex:C,step:n[C]})}function j(C){let x=ve(m.step,C,null);w(Object.assign(Object.assign({},m),{step:x}))}function D(C,x,O){let S=ve(n[C],x,O);w(Object.assign(Object.assign({},m),{stepIndex:C,step:S}))}return a.default.createElement("section",{className:`ch-scrollycoding ${y?"ch-scrollycoding-with-preview":""} ${i||""}`,style:c},a.default.createElement("div",{className:"ch-scrollycoding-content"},a.default.createElement(Ra,{onStepChange:E},f.map((C,x)=>a.default.createElement($a,{as:"div",key:x,index:x,onClick:()=>E(x),className:"ch-scrollycoding-step-content","data-selected":x===m.stepIndex?"true":void 0},a.default.createElement(Gt,{onActivation:({fileName:O,focus:S})=>{D(x,O,S)},onReset:()=>{E(x)}},C))))),a.default.createElement("div",{className:"ch-scrollycoding-sticker"},a.default.createElement(De,Object.assign({showExpandButton:!0},d,k,{codeConfig:o,onTabClick:j})),r?a.default.createElement(te,{className:"ch-scrollycoding-preview",files:k.files,presetConfig:r,codeConfig:o}):u?a.default.createElement(te,Object.assign({className:"ch-scrollycoding-preview"},g[m.stepIndex].props)):null))}function Io(e){var{children:t,className:n,code:o,codeConfig:r,editorSteps:s,autoFocus:i,hasPreviewSteps:c,start:u=0,onChange:d=()=>{},presetConfig:f,style:g,autoPlay:y,loop:m=!1}=e,w=I(e,["children","className","code","codeConfig","editorSteps","autoFocus","hasPreviewSteps","start","onChange","presetConfig","style","autoPlay","loop"]);let{stepsChildren:k,previewChildren:E}=it(t,c),j=f||c,D=k.some(_=>{var q;return(q=_.props)===null||q===void 0?void 0:q.children}),C=s.length-1,[x,O]=a.default.useState(()=>{let _=Ft(u,0,C);return{stepIndex:_,step:s[_]}}),{stepIndex:S,step:z}=x,ue=S===C;a.default.useEffect(()=>{d({index:S})},[S]);function de(_){let q=ve(z,_,null);O(Object.assign(Object.assign({},x),{step:q}))}function oe(_){let q=Ft(_,0,C);O({stepIndex:q,step:s[q]})}function fe(){O(_=>{let q=m?(_.stepIndex+1)%(C+1):Ft(_.stepIndex+1,0,C);return{stepIndex:q,step:s[q]}})}return Bs(fe,y),a.default.createElement("div",{className:`ch-slideshow ${j?"ch-slideshow-with-preview":""} ${n||""}`,style:g},a.default.createElement("div",{className:"ch-slideshow-slide"},a.default.createElement(De,Object.assign({},w,z,{codeConfig:Object.assign(Object.assign({},r),o),onTabClick:de})),f?a.default.createElement(te,{className:"ch-slideshow-preview",files:z.files,presetConfig:f,codeConfig:r}):c?a.default.createElement(te,Object.assign({className:"ch-slideshow-preview"},E[S].props)):null),a.default.createElement("div",{className:"ch-slideshow-notes"},a.default.createElement("div",{className:"ch-slideshow-range"},a.default.createElement("button",{onClick:()=>oe(S-1),disabled:S===0},"Prev"),a.default.createElement("input",{max:C,min:0,step:1,type:"range",value:S,onChange:_=>oe(+_.target.value),ref:ec(i),autoFocus:i}),a.default.createElement("button",{onClick:fe,disabled:ue},"Next")),D&&a.default.createElement("div",{className:"ch-slideshow-note"},k[S])))}function ec(e){let t=a.default.useRef(null);return a.default.useEffect(()=>{e&&t.current.focus()},[]),t}function To(){return a.default.createElement("div",null,`"error: code hike remark plugin not running or annotation isn't at the right place"`)}var Lo={box:rc,bg:No,label:ic,link:ac,mark:tc,withClass:sc};function tc(e){return e.isInline?a.default.createElement(nc,Object.assign({},e)):a.default.createElement(No,Object.assign({},e))}function No({children:e,data:t,style:n,theme:o}){let r="ch-code-multiline-mark "+(t??""),s=B(o,v.RangeHighlightBackground),i=B(o,v.EditorInfoForeground);return a.default.createElement("div",{style:Object.assign(Object.assign({},n),{background:s}),className:r},a.default.createElement("span",{className:"ch-code-multiline-mark-border",style:{background:i}}),e)}function nc({children:e,data:t,theme:n}){let o=oc(e)||Ne(B(n,v.CodeForeground),.2),r="ch-code-inline-mark "+(t??"");return a.default.createElement("span",{className:r,style:{background:o}},e)}function oc(e){var t,n,o;let r=a.default.Children.toArray(e)[0],s=a.default.Children.toArray(((t=r?.props)===null||t===void 0?void 0:t.children)||[])[0],i=a.default.Children.toArray(((n=s?.props)===null||n===void 0?void 0:n.children)||[])[0],{color:c}=((o=i?.props)===null||o===void 0?void 0:o.style)||{};if(c)return Ne(c,.2)}function rc({children:e,data:t,theme:n}){var o,r;let s=typeof t=="string"?t:((r=(o=n.tokenColors.find(i=>{var c;return(c=i.scope)===null||c===void 0?void 0:c.includes("string")}))===null||o===void 0?void 0:o.settings)===null||r===void 0?void 0:r.foreground)||"yellow";return a.default.createElement("span",{className:"ch-code-box-annotation",style:{outline:`2px solid ${s}`}},e)}function sc({children:e,data:t,style:n,theme:o}){let r=t;return a.default.createElement("span",{style:n,className:r},e)}function ic({children:e,data:t,style:n,theme:o}){let r=o.colors["editor.lineHighlightBackground"]||o.colors["editor.selectionHighlightBackground"],[s,i]=a.default.useState(!1);return a.default.createElement("div",{style:Object.assign(Object.assign({},n),{background:s?r:void 0}),onMouseEnter:()=>i(!0),onMouseLeave:()=>i(!1)},e,a.default.createElement("div",{style:{position:"absolute",right:0,paddingRight:16,display:s?"block":"none",opacity:.7}},t?.children||t))}function ac({children:e,isInline:t,style:n,data:o}){let r=o?.url||o,s=o?.title;return a.default.createElement("a",{href:r,title:s,className:t?"ch-code-inline-link":"ch-code-link",style:n},e)}function Po(e){var{className:t,codeConfig:n,children:o,code:r}=e,s=I(e,["className","codeConfig","children","code"]);let{theme:i}=n,{lines:c}=r,u=c.flatMap(f=>f.tokens),d=B(i,v.CodeForeground);return a.default.createElement("span",Object.assign({className:"ch-inline-code not-prose"+(t?" "+t:"")},s),a.default.createElement("code",{style:{["--ch-code-foreground"]:d,background:Ne(B(i,v.CodeBackground),.9),color:d}},u.map((f,g)=>a.default.createElement("span",Object.assign({key:g},f.props),f.content))))}var cc={Code:vo,Section:Fo,SectionLink:Eo,SectionCode:wo,Spotlight:Do,Scrollycoding:Oo,Preview:te,annotations:Lo,Annotation:To,Slideshow:Io,InlineCode:Po,CodeSlot:jo,PreviewSlot:So},lc={MiniBrowser:xo,EditorSpring:yo};W.Annotation=To;W.CH=cc;W.Code=vo;W.CodeSlot=jo;W.InlineCode=Po;W.Preview=te;W.PreviewSlot=So;W.Scrollycoding=Oo;W.Section=Fo;W.SectionCode=wo;W.SectionLink=Eo;W.Slideshow=Io;W.Spotlight=Do;W.annotations=Lo;W.internal=lc});var pc={};cs(pc,{CH:()=>Ae,chCodeConfig:()=>ct,default:()=>fc,frontmatter:()=>uc});var h=vn(Fn()),lt=vn(Ho()),Ae={annotations:lt.annotations,Code:lt.Code},ct={staticMediaQuery:"not screen, (max-width: 768px)",theme:{name:"poimandres",type:"dark",colors:{"activityBar.background":"#1b1e28","activityBar.foreground":"#a6accd","activityBarBadge.background":"#303340","activityBarBadge.foreground":"#e4f0fb","badge.background":"#303340","badge.foreground":"#e4f0fb","button.background":"#303340","diffEditor.insertedTextBackground":"#50647715","diffEditor.removedTextBackground":"#d0679d20","dropdown.background":"#1b1e28","dropdown.border":"#ffffff10","editor.background":"#1b1e28","editor.findMatchBackground":"#ADD7FF40","editor.findMatchBorder":"#ADD7FF","editor.findMatchHighlightBackground":"#ADD7FF40","editor.foreground":"#a6accd","editor.lineHighlightBackground":"#717cb425","editor.lineHighlightBorder":"#00000000","editor.selectionBackground":"#717cb425","editor.selectionHighlightBackground":"#00000000","editor.selectionHighlightBorder":"#ADD7FF80","editor.wordHighlightBackground":"#ADD7FF20","editor.wordHighlightStrongBackground":"#ADD7FF40","editorBracketMatch.border":"#e4f0fb40","editorCursor.foreground":"#a6accd","editorGroup.border":"#00000030","editorGroupHeader.tabsBackground":"#1b1e28","editorHoverWidget.background":"#1b1e28","editorHoverWidget.border":"#ffffff10","editorIndentGuide.background":"#303340","editorLineNumber.foreground":"#767c9d50","editorLink.activeForeground":"#ADD7FF","editorSuggestWidget.background":"#1b1e28","editorSuggestWidget.border":"#ffffff10","editorSuggestWidget.foreground":"#a6accd","editorSuggestWidget.highlightForeground":"#5DE4c7","editorSuggestWidget.selectedBackground":"#00000050","editorWidget.background":"#1b1e28","editor.findRangeHighlightBackground":"#ADD7FF40","editor.focusedStackFrameHighlightBackground":"#7abd7a4d","editor.foldBackground":"#717cb40b","editor.hoverHighlightBackground":"#264f7840","editor.inactiveSelectionBackground":"#717cb425","editor.linkedEditingBackground":"#d0679d4d","editor.rangeHighlightBackground":"#ffffff0b","editor.snippetFinalTabstopHighlightBorder":"#525252","editor.snippetTabstopHighlightBackground":"#7c7c7c4d","editor.stackFrameHighlightBackground":"#ffff0033","editor.symbolHighlightBackground":"#89ddff60","editorBracketMatch.background":"#00000000","editorCodeLens.foreground":"#a6accd","editorError.foreground":"#d0679d","editorGroup.dropBackground":"#7390AA80","editorGroupHeader.noTabsBackground":"#1b1e28","editorGutter.background":"#1b1e28","editorGutter.commentRangeForeground":"#a6accd","editorGutter.foldingControlForeground":"#a6accd","editorGutter.addedBackground":"#5fb3a140","editorGutter.deletedBackground":"#d0679d40","editorGutter.modifiedBackground":"#ADD7FF20","editorHint.foreground":"#7390AAb3","editorHoverWidget.foreground":"#a6accd","editorHoverWidget.statusBarBackground":"#202430","editorIndentGuide.activeBackground":"#e3e4e229","editorInfo.foreground":"#ADD7FF","editorInlineHint.background":"#a6accd","editorInlineHint.foreground":"#1b1e28","editorLightBulb.foreground":"#fffac2","editorLightBulbAutoFix.foreground":"#ADD7FF","editorLineNumber.activeForeground":"#a6accd","editorMarkerNavigation.background":"#2d2d30","editorMarkerNavigationError.background":"#d0679d","editorMarkerNavigationInfo.background":"#ADD7FF","editorMarkerNavigationWarning.background":"#fffac2","editorOverviewRuler.addedForeground":"#5fb3a199","editorOverviewRuler.border":"#00000000","editorOverviewRuler.bracketMatchForeground":"#a0a0a0","editorOverviewRuler.commonContentForeground":"#a6accd66","editorOverviewRuler.currentContentForeground":"#5fb3a180","editorOverviewRuler.deletedForeground":"#d0679d99","editorOverviewRuler.errorForeground":"#d0679db3","editorOverviewRuler.findMatchForeground":"#e4f0fb20","editorOverviewRuler.incomingContentForeground":"#89ddff80","editorOverviewRuler.infoForeground":"#ADD7FF","editorOverviewRuler.modifiedForeground":"#89ddff99","editorOverviewRuler.rangeHighlightForeground":"#89ddff99","editorOverviewRuler.selectionHighlightForeground":"#a0a0a0cc","editorOverviewRuler.warningForeground":"#fffac2","editorOverviewRuler.wordHighlightForeground":"#a0a0a0cc","editorOverviewRuler.wordHighlightStrongForeground":"#89ddffcc","editorPane.background":"#1b1e28","editorRuler.foreground":"#e4f0fb10","editorUnnecessaryCode.opacity":"#000000aa","editorWarning.foreground":"#fffac2","editorWhitespace.foreground":"#303340","editorWidget.border":"#a6accd","editorWidget.foreground":"#a6accd","extensionButton.prominentBackground":"#30334090","extensionButton.prominentHoverBackground":"#303340",focusBorder:"#00000000","input.background":"#ffffff05","input.border":"#ffffff10","input.foreground":"#e4f0fb","input.placeholderForeground":"#a6accd60","inputValidation.errorBorder":"#d0679d","inputValidation.errorForeground":"#d0679d","inputValidation.infoBorder":"#89ddff","inputValidation.warningBorder":"#fffac2","notifications.background":"#1b1e28","notifications.foreground":"#e4f0fb","panel.border":"#00000030","panelTitle.activeForeground":"#a6accd","peekView.border":"#00000030","peekViewEditor.background":"#a6accd05","peekViewEditorGutter.background":"#a6accd05","peekViewResult.background":"#a6accd05","peekViewTitle.background":"#a6accd05","peekViewTitleDescription.foreground":"#a6accd60","scrollbar.shadow":"#00000000","scrollbarSlider.activeBackground":"#a6accd25","scrollbarSlider.background":"#00000080","scrollbarSlider.hoverBackground":"#a6accd25","selection.background":"#a6accd","sideBar.background":"#1b1e28","sideBar.foreground":"#767c9d","sideBarSectionHeader.background":"#1b1e28","sideBarTitle.foreground":"#a6accd","statusBar.background":"#1b1e28","statusBar.foreground":"#a6accd","statusBar.noFolderBackground":"#1b1e28","tab.activeBackground":"#30334080","tab.activeForeground":"#e4f0fb","tab.border":"#00000000","tab.inactiveBackground":"#1b1e28","tab.inactiveForeground":"#767c9d","tab.unfocusedActiveForeground":"#a6accd","tab.activeModifiedBorder":"#ADD7FF","tab.inactiveModifiedBorder":"#ADD7FF80","tab.lastPinnedBorder":"#00000000","tab.unfocusedActiveBackground":"#1b1e28","tab.unfocusedActiveModifiedBorder":"#ADD7FF40","tab.unfocusedInactiveBackground":"#1b1e28","tab.unfocusedInactiveForeground":"#a6accd80","tab.unfocusedInactiveModifiedBorder":"#ADD7FF40","terminal.ansiBlack":"#1b1e28","terminal.ansiBlue":"#89ddff","terminal.ansiBrightBlack":"#a6accd","terminal.ansiBrightBlue":"#ADD7FF","terminal.ansiBrightCyan":"#ADD7FF","terminal.ansiBrightGreen":"#5DE4c7","terminal.ansiBrightMagenta":"#f087bd","terminal.ansiBrightRed":"#d0679d","terminal.ansiBrightWhite":"#ffffff","terminal.ansiBrightYellow":"#fffac2","terminal.ansiCyan":"#89ddff","terminal.ansiGreen":"#5DE4c7","terminal.ansiMagenta":"#f087bd","terminal.ansiRed":"#d0679d","terminal.ansiWhite":"#ffffff","terminal.ansiYellow":"#fffac2","textLink.activeForeground":"#ADD7FF","textLink.foreground":"#ADD7FF","titleBar.activeBackground":"#1b1e28","titleBar.activeForeground":"#a6accd","titleBar.inactiveBackground":"#1b1e28","titleBar.inactiveForeground":"#767c9d","tree.indentGuidesStroke":"#00000000","widget.shadow":"#00000030","activityBar.activeBorder":"#a6accd","activityBar.dropBorder":"#a6accd","activityBar.inactiveForeground":"#a6accd66","breadcrumb.activeSelectionForeground":"#e4f0fb","breadcrumb.background":"#00000000","breadcrumb.focusForeground":"#e4f0fb","breadcrumb.foreground":"#767c9dcc","breadcrumbPicker.background":"#1b1e28","button.foreground":"#ffffff","button.hoverBackground":"#50647750","button.secondaryBackground":"#a6accd","button.secondaryForeground":"#ffffff","button.secondaryHoverBackground":"#a6accd","charts.blue":"#ADD7FF","charts.foreground":"#a6accd","charts.green":"#5DE4c7","charts.lines":"#a6accd80","charts.orange":"#89ddff","charts.purple":"#f087bd","charts.red":"#d0679d","charts.yellow":"#fffac2","checkbox.background":"#1b1e28","checkbox.border":"#ffffff10","checkbox.foreground":"#e4f0fb","debugConsole.errorForeground":"#d0679d","debugConsole.infoForeground":"#ADD7FF","debugConsole.sourceForeground":"#a6accd","debugConsole.warningForeground":"#fffac2","debugConsoleInputIcon.foreground":"#a6accd","debugExceptionWidget.background":"#d0679d","debugExceptionWidget.border":"#d0679d","debugIcon.breakpointCurrentStackframeForeground":"#fffac2","debugIcon.breakpointDisabledForeground":"#7390AA","debugIcon.breakpointForeground":"#d0679d","debugIcon.breakpointStackframeForeground":"#5fb3a1","debugIcon.breakpointUnverifiedForeground":"#7390AA","debugIcon.continueForeground":"#ADD7FF","debugIcon.disconnectForeground":"#d0679d","debugIcon.pauseForeground":"#ADD7FF","debugIcon.restartForeground":"#5fb3a1","debugIcon.startForeground":"#5fb3a1","debugIcon.stepBackForeground":"#ADD7FF","debugIcon.stepIntoForeground":"#ADD7FF","debugIcon.stepOutForeground":"#ADD7FF","debugIcon.stepOverForeground":"#ADD7FF","debugIcon.stopForeground":"#d0679d","debugTokenExpression.boolean":"#89ddff","debugTokenExpression.error":"#d0679d","debugTokenExpression.name":"#e4f0fb","debugTokenExpression.number":"#5fb3a1","debugTokenExpression.string":"#89ddff","debugTokenExpression.value":"#a6accd99","debugToolBar.background":"#303340","debugView.exceptionLabelBackground":"#d0679d","debugView.exceptionLabelForeground":"#e4f0fb","debugView.stateLabelBackground":"#303340","debugView.stateLabelForeground":"#a6accd","debugView.valueChangedHighlight":"#89ddff",descriptionForeground:"#a6accdb3","diffEditor.diagonalFill":"#a6accd33","dropdown.foreground":"#e4f0fb",errorForeground:"#d0679d","extensionBadge.remoteBackground":"#303340","extensionBadge.remoteForeground":"#e4f0fb","extensionButton.prominentForeground":"#ffffff","extensionIcon.starForeground":"#fffac2",foreground:"#a6accd","gitDecoration.addedResourceForeground":"#5fb3a1","gitDecoration.conflictingResourceForeground":"#d0679d","gitDecoration.deletedResourceForeground":"#d0679d","gitDecoration.ignoredResourceForeground":"#767c9d70","gitDecoration.modifiedResourceForeground":"#ADD7FF","gitDecoration.renamedResourceForeground":"#5DE4c7","gitDecoration.stageDeletedResourceForeground":"#d0679d","gitDecoration.stageModifiedResourceForeground":"#ADD7FF","gitDecoration.submoduleResourceForeground":"#89ddff","gitDecoration.untrackedResourceForeground":"#5DE4c7","icon.foreground":"#a6accd","imagePreview.border":"#303340","inputOption.activeBackground":"#00000000","inputOption.activeBorder":"#00000000","inputOption.activeForeground":"#ffffff","inputValidation.errorBackground":"#1b1e28","inputValidation.infoBackground":"#506477","inputValidation.warningBackground":"#506477","list.deemphasizedForeground":"#767c9d","list.dropBackground":"#506477","list.filterMatchBackground":"#89ddff60","list.focusOutline":"#00000000","list.invalidItemForeground":"#fffac2","list.warningForeground":"#fffac2","listFilterWidget.background":"#303340","listFilterWidget.noMatchesOutline":"#d0679d","listFilterWidget.outline":"#00000000","list.activeSelectionBackground":"#30334080","list.activeSelectionForeground":"#e4f0fb","list.errorForeground":"#d0679d","list.focusBackground":"#30334080","list.focusForeground":"#a6accd","list.highlightForeground":"#5fb3a1","list.hoverBackground":"#30334080","list.hoverForeground":"#e4f0fb","list.inactiveSelectionBackground":"#00000000","list.inactiveSelectionForeground":"#e4f0fb","menu.background":"#1b1e28","menu.foreground":"#e4f0fb","menu.selectionBackground":"#00000000","menu.selectionForeground":"#7390AA","menu.separatorBackground":"#767c9d","menubar.selectionBackground":"#717cb425","menubar.selectionForeground":"#a6accd","merge.commonContentBackground":"#a6accd29","merge.commonHeaderBackground":"#a6accd66","merge.currentContentBackground":"#5fb3a133","merge.currentHeaderBackground":"#5fb3a180","merge.incomingContentBackground":"#89ddff33","merge.incomingHeaderBackground":"#89ddff80","minimap.errorHighlight":"#d0679d","minimap.findMatchHighlight":"#ADD7FF","minimap.selectionHighlight":"#e4f0fb40","minimap.warningHighlight":"#fffac2","minimapGutter.addedBackground":"#5fb3a180","minimapGutter.deletedBackground":"#d0679d80","minimapGutter.modifiedBackground":"#ADD7FF80","minimapSlider.activeBackground":"#a6accd30","minimapSlider.background":"#a6accd20","minimapSlider.hoverBackground":"#a6accd30","notebook.cellBorderColor":"#1b1e28","notebook.cellInsertionIndicator":"#00000000","notebook.cellStatusBarItemHoverBackground":"#ffffff26","notebook.cellToolbarSeparator":"#303340","notebook.focusedCellBorder":"#00000000","notebook.focusedEditorBorder":"#00000000","notebook.focusedRowBorder":"#00000000","notebook.inactiveFocusedCellBorder":"#00000000","notebook.outputContainerBackgroundColor":"#1b1e28","notebook.rowHoverBackground":"#30334000","notebook.selectedCellBackground":"#303340","notebook.selectedCellBorder":"#1b1e28","notebook.symbolHighlightBackground":"#ffffff0b","notebookScrollbarSlider.activeBackground":"#a6accd25","notebookScrollbarSlider.background":"#00000050","notebookScrollbarSlider.hoverBackground":"#a6accd25","notebookStatusErrorIcon.foreground":"#d0679d","notebookStatusRunningIcon.foreground":"#a6accd","notebookStatusSuccessIcon.foreground":"#5fb3a1","notificationCenterHeader.background":"#303340","notificationLink.foreground":"#ADD7FF","notifications.border":"#303340","notificationsErrorIcon.foreground":"#d0679d","notificationsInfoIcon.foreground":"#ADD7FF","notificationsWarningIcon.foreground":"#fffac2","panel.background":"#1b1e28","panel.dropBorder":"#a6accd","panelSection.border":"#1b1e28","panelSection.dropBackground":"#7390AA80","panelSectionHeader.background":"#303340","panelTitle.activeBorder":"#a6accd","panelTitle.inactiveForeground":"#a6accd99","peekViewEditor.matchHighlightBackground":"#303340","peekViewResult.fileForeground":"#ffffff","peekViewResult.lineForeground":"#a6accd","peekViewResult.matchHighlightBackground":"#303340","peekViewResult.selectionBackground":"#717cb425","peekViewResult.selectionForeground":"#ffffff","peekViewTitleLabel.foreground":"#ffffff","pickerGroup.border":"#a6accd","pickerGroup.foreground":"#89ddff","problemsErrorIcon.foreground":"#d0679d","problemsInfoIcon.foreground":"#ADD7FF","problemsWarningIcon.foreground":"#fffac2","progressBar.background":"#89ddff","quickInput.background":"#1b1e28","quickInput.foreground":"#a6accd","quickInputList.focusBackground":"#a6accd10","quickInputTitle.background":"#ffffff1b","sash.hoverBorder":"#00000000","scm.providerBorder":"#e4f0fb10","searchEditor.findMatchBackground":"#ADD7FF50","searchEditor.textInputBorder":"#ffffff10","settings.checkboxBackground":"#1b1e28","settings.checkboxBorder":"#ffffff10","settings.checkboxForeground":"#e4f0fb","settings.dropdownBackground":"#1b1e28","settings.dropdownBorder":"#ffffff10","settings.dropdownForeground":"#e4f0fb","settings.dropdownListBorder":"#e4f0fb10","settings.focusedRowBackground":"#00000000","settings.headerForeground":"#e4f0fb","settings.modifiedItemIndicator":"#ADD7FF","settings.numberInputBackground":"#ffffff05","settings.numberInputBorder":"#ffffff10","settings.numberInputForeground":"#e4f0fb","settings.textInputBackground":"#ffffff05","settings.textInputBorder":"#ffffff10","settings.textInputForeground":"#e4f0fb","sideBar.dropBackground":"#7390AA80","sideBarSectionHeader.foreground":"#a6accd","statusBar.debuggingBackground":"#303340","statusBar.debuggingForeground":"#ffffff","statusBar.noFolderForeground":"#a6accd","statusBarItem.activeBackground":"#ffffff2e","statusBarItem.errorBackground":"#d0679d","statusBarItem.errorForeground":"#ffffff","statusBarItem.hoverBackground":"#ffffff1f","statusBarItem.prominentBackground":"#00000080","statusBarItem.prominentForeground":"#a6accd","statusBarItem.prominentHoverBackground":"#0000004d","statusBarItem.remoteBackground":"#303340","statusBarItem.remoteForeground":"#e4f0fb","symbolIcon.arrayForeground":"#a6accd","symbolIcon.booleanForeground":"#a6accd","symbolIcon.classForeground":"#fffac2","symbolIcon.colorForeground":"#a6accd","symbolIcon.constantForeground":"#a6accd","symbolIcon.constructorForeground":"#f087bd","symbolIcon.enumeratorForeground":"#fffac2","symbolIcon.enumeratorMemberForeground":"#ADD7FF","symbolIcon.eventForeground":"#fffac2","symbolIcon.fieldForeground":"#ADD7FF","symbolIcon.fileForeground":"#a6accd","symbolIcon.folderForeground":"#a6accd","symbolIcon.functionForeground":"#f087bd","symbolIcon.interfaceForeground":"#ADD7FF","symbolIcon.keyForeground":"#a6accd","symbolIcon.keywordForeground":"#a6accd","symbolIcon.methodForeground":"#f087bd","symbolIcon.moduleForeground":"#a6accd","symbolIcon.namespaceForeground":"#a6accd","symbolIcon.nullForeground":"#a6accd","symbolIcon.numberForeground":"#a6accd","symbolIcon.objectForeground":"#a6accd","symbolIcon.operatorForeground":"#a6accd","symbolIcon.packageForeground":"#a6accd","symbolIcon.propertyForeground":"#a6accd","symbolIcon.referenceForeground":"#a6accd","symbolIcon.snippetForeground":"#a6accd","symbolIcon.stringForeground":"#a6accd","symbolIcon.structForeground":"#a6accd","symbolIcon.textForeground":"#a6accd","symbolIcon.typeParameterForeground":"#a6accd","symbolIcon.unitForeground":"#a6accd","symbolIcon.variableForeground":"#ADD7FF","terminal.border":"#00000000","terminal.foreground":"#a6accd","terminal.selectionBackground":"#717cb425","testing.iconErrored":"#d0679d","testing.iconFailed":"#d0679d","testing.iconPassed":"#5DE4c7","testing.iconQueued":"#fffac2","testing.iconSkipped":"#7390AA","testing.iconUnset":"#7390AA","testing.message.error.decorationForeground":"#d0679d","testing.message.error.lineBackground":"#d0679d33","testing.message.hint.decorationForeground":"#7390AAb3","testing.message.info.decorationForeground":"#ADD7FF","testing.message.info.lineBackground":"#89ddff33","testing.message.warning.decorationForeground":"#fffac2","testing.message.warning.lineBackground":"#fffac233","testing.peekBorder":"#d0679d","testing.runAction":"#5DE4c7","textBlockQuote.background":"#7390AA1a","textBlockQuote.border":"#89ddff80","textCodeBlock.background":"#00000050","textPreformat.foreground":"#e4f0fb","textSeparator.foreground":"#ffffff2e","tree.tableColumnsBorder":"#a6accd20","welcomePage.progress.background":"#ffffff05","welcomePage.progress.foreground":"#5fb3a1","welcomePage.tileBackground":"#1b1e28","welcomePage.tileHoverBackground":"#303340"},tokenColors:[{settings:{foreground:"#a6accd",background:"#1b1e28"}},{scope:["comment","punctuation.definition.comment"],settings:{foreground:"#767c9dB0",fontStyle:"italic"}},{scope:"meta.parameters comment.block",settings:{foreground:"#a6accd",fontStyle:"italic"}},{scope:["variable.other.constant.object","variable.other.readwrite.alias","meta.import variable.other.readwrite"],settings:{foreground:"#ADD7FF"}},{scope:["variable.other","support.type.object"],settings:{foreground:"#e4f0fb"}},{scope:["variable.other.object.property","variable.other.property","support.variable.property"],settings:{foreground:"#e4f0fb"}},{scope:["entity.name.function.method","string.unquoted","meta.object.member"],settings:{foreground:"#ADD7FF"}},{scope:["variable - meta.import","constant.other.placeholder","meta.object-literal.key-meta.object.member"],settings:{foreground:"#e4f0fb"}},{scope:["keyword.control.flow"],settings:{foreground:"#5DE4c7c0"}},{scope:["keyword.operator.new","keyword.control.new"],settings:{foreground:"#5DE4c7"}},{scope:["variable.language.this","storage.modifier.async","storage.modifier","variable.language.super"],settings:{foreground:"#5DE4c7"}},{scope:["support.class.error","keyword.control.trycatch","keyword.operator.expression.delete","keyword.operator.expression.void","keyword.operator.void","keyword.operator.delete","constant.language.null","constant.language.boolean.false","constant.language.undefined"],settings:{foreground:"#d0679d"}},{scope:["variable.parameter","variable.other.readwrite.js","meta.definition.variable variable.other.constant","meta.definition.variable variable.other.readwrite"],settings:{foreground:"#e4f0fb"}},{scope:["constant.other.color"],settings:{foreground:"#ffffff"}},{scope:["invalid","invalid.illegal"],settings:{foreground:"#d0679d"}},{scope:["invalid.deprecated"],settings:{foreground:"#d0679d"}},{scope:["keyword.control","keyword"],settings:{foreground:"#a6accd"}},{scope:["keyword.operator","storage.type"],settings:{foreground:"#91B4D5"}},{scope:["keyword.control.module","keyword.control.import","keyword.control.export","keyword.control.default","meta.import","meta.export"],settings:{foreground:"#5DE4c7"}},{scope:["Keyword","Storage"],settings:{fontStyle:"italic"}},{scope:["keyword-meta.export"],settings:{foreground:"#ADD7FF"}},{scope:["meta.brace","punctuation","keyword.operator.existential"],settings:{foreground:"#a6accd"}},{scope:["constant.other.color","meta.tag","punctuation.definition.tag","punctuation.separator.inheritance.php","punctuation.definition.tag.html","punctuation.definition.tag.begin.html","punctuation.definition.tag.end.html","punctuation.section.embedded","keyword.other.template","keyword.other.substitution","meta.objectliteral"],settings:{foreground:"#e4f0fb"}},{scope:["support.class.component"],settings:{foreground:"#5DE4c7"}},{scope:["entity.name.tag","entity.name.tag","meta.tag.sgml","markup.deleted.git_gutter"],settings:{foreground:"#5DE4c7"}},{name:"Function Call",scope:"variable.function, source meta.function-call entity.name.function, source meta.function-call entity.name.function, source meta.method-call entity.name.function, meta.class meta.group.braces.curly meta.function-call variable.function, meta.class meta.field.declaration meta.function-call entity.name.function, variable.function.constructor, meta.block meta.var.expr meta.function-call entity.name.function, support.function.console, meta.function-call support.function, meta.property.class variable.other.class, punctuation.definition.entity.css",settings:{foreground:"#e4f0fbd0"}},{name:"Function/Class Name",scope:"entity.name.function, meta.class entity.name.class, meta.class entity.name.type.class, meta.class meta.function-call variable.function, keyword.other.important",settings:{foreground:"#ADD7FF"}},{scope:["source.cpp meta.block variable.other"],settings:{foreground:"#ADD7FF"}},{scope:["support.other.variable","string.other.link"],settings:{foreground:"#5DE4c7"}},{scope:["constant.numeric","support.constant","constant.character","constant.escape","keyword.other.unit","keyword.other","string","constant.language","constant.other.symbol","constant.other.key","markup.heading","markup.inserted.git_gutter","meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js","text.html.derivative"],settings:{foreground:"#5DE4c7"}},{scope:["entity.other.inherited-class"],settings:{foreground:"#ADD7FF"}},{scope:["meta.type.declaration"],settings:{foreground:"#ADD7FF"}},{scope:["entity.name.type.alias"],settings:{foreground:"#a6accd"}},{scope:["keyword.control.as","entity.name.type","support.type"],settings:{foreground:"#a6accdC0"}},{scope:["entity.name","support.orther.namespace.use.php","meta.use.php","support.other.namespace.php","markup.changed.git_gutter","support.type.sys-types"],settings:{foreground:"#91B4D5"}},{scope:["support.class","support.constant","variable.other.constant.object"],settings:{foreground:"#ADD7FF"}},{scope:["source.css support.type.property-name","source.sass support.type.property-name","source.scss support.type.property-name","source.less support.type.property-name","source.stylus support.type.property-name","source.postcss support.type.property-name"],settings:{foreground:"#ADD7FF"}},{scope:["entity.name.module.js","variable.import.parameter.js","variable.other.class.js"],settings:{foreground:"#e4f0fb"}},{scope:["variable.language"],settings:{foreground:"#ADD7FF",fontStyle:"italic"}},{scope:["entity.name.method.js"],settings:{foreground:"#91B4D5",fontStyle:"italic"}},{scope:["meta.class-method.js entity.name.function.js","variable.function.constructor"],settings:{foreground:"#91B4D5"}},{scope:["entity.other.attribute-name"],settings:{foreground:"#91B4D5",fontStyle:"italic"}},{scope:["text.html.basic entity.other.attribute-name.html","text.html.basic entity.other.attribute-name"],settings:{foreground:"#5fb3a1",fontStyle:"italic"}},{scope:["entity.other.attribute-name.class"],settings:{foreground:"#5fb3a1"}},{scope:["source.sass keyword.control"],settings:{foreground:"#42675A"}},{scope:["markup.inserted"],settings:{foreground:"#ADD7FF"}},{scope:["markup.deleted"],settings:{foreground:"#506477"}},{scope:["markup.changed"],settings:{foreground:"#91B4D5"}},{scope:["string.regexp"],settings:{foreground:"#5fb3a1"}},{scope:["constant.character.escape"],settings:{foreground:"#5fb3a1"}},{scope:["*url*","*link*","*uri*"],settings:{foreground:"#ADD7FF",fontStyle:"underline"}},{scope:["tag.decorator.js entity.name.tag.js","tag.decorator.js punctuation.definition.tag.js"],settings:{foreground:"#42675A",fontStyle:"italic"}},{scope:["source.js constant.other.object.key.js string.unquoted.label.js"],settings:{foreground:"#5fb3a1",fontStyle:"italic"}},{scope:["source.json meta.structure.dictionary.json support.type.property-name.json"],settings:{foreground:"#e4f0fb"}},{scope:["source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json"],settings:{foreground:"#ADD7FF"}},{scope:["source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json"],settings:{foreground:"#91B4D5"}},{scope:["source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json"],settings:{foreground:"#7390AA"}},{scope:["source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json"],settings:{foreground:"#e4f0fb"}},{scope:["source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json"],settings:{foreground:"#ADD7FF"}},{scope:["source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json"],settings:{foreground:"#91B4D5"}},{scope:["source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json"],settings:{foreground:"#7390AA"}},{scope:["source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json"],settings:{foreground:"#e4f0fb"}},{scope:["text.html.markdown","punctuation.definition.list_item.markdown"],settings:{foreground:"#e4f0fb"}},{scope:["text.html.markdown markup.inline.raw.markdown"],settings:{foreground:"#ADD7FF"}},{scope:["text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown"],settings:{foreground:"#91B4D5"}},{scope:["markdown.heading","markup.heading | markup.heading entity.name","markup.heading.markdown punctuation.definition.heading.markdown"],settings:{foreground:"#e4f0fb"}},{scope:["markup.italic"],settings:{foreground:"#7390AA",fontStyle:"italic"}},{scope:["markup.bold","markup.bold string"],settings:{foreground:"#7390AA",fontStyle:"bold"}},{scope:["markup.bold markup.italic","markup.italic markup.bold","markup.quote markup.bold","markup.bold markup.italic string","markup.italic markup.bold string","markup.quote markup.bold string"],settings:{foreground:"#7390AA",fontStyle:"bold"}},{scope:["markup.underline"],settings:{foreground:"#7390AA",fontStyle:"underline"}},{scope:["markup.strike"],settings:{fontStyle:"italic"}},{scope:["markup.quote punctuation.definition.blockquote.markdown"],settings:{foreground:"#5DE4c7"}},{scope:["markup.quote"],settings:{fontStyle:"italic"}},{scope:["string.other.link.title.markdown"],settings:{foreground:"#ADD7FF"}},{scope:["string.other.link.description.title.markdown"],settings:{foreground:"#ADD7FF"}},{scope:["constant.other.reference.link.markdown"],settings:{foreground:"#ADD7FF"}},{scope:["markup.raw.block"],settings:{foreground:"#ADD7FF"}},{scope:["markup.raw.block.fenced.markdown"],settings:{foreground:"#50647750"}},{scope:["punctuation.definition.fenced.markdown"],settings:{foreground:"#50647750"}},{scope:["markup.raw.block.fenced.markdown","variable.language.fenced.markdown","punctuation.section.class.end"],settings:{foreground:"#91B4D5"}},{scope:["variable.language.fenced.markdown"],settings:{foreground:"#91B4D5"}},{scope:["meta.separator"],settings:{foreground:"#7390AA",fontStyle:"bold"}},{scope:["markup.table"],settings:{foreground:"#ADD7FF"}},{scope:"token.info-token",settings:{foreground:"#89ddff"}},{scope:"token.warn-token",settings:{foreground:"#fffac2"}},{scope:"token.error-token",settings:{foreground:"#d0679d"}},{scope:"token.debug-token",settings:{foreground:"#e4f0fb"}},{scope:["entity.name.section.markdown","markup.heading.setext.1.markdown","markup.heading.setext.2.markdown"],settings:{foreground:"#e4f0fb",fontStyle:"bold"}},{scope:"meta.paragraph.markdown",settings:{foreground:"#e4f0fbd0"}},{scope:["punctuation.definition.from-file.diff","meta.diff.header.from-file"],settings:{foreground:"#506477"}},{scope:"markup.inline.raw.string.markdown",settings:{foreground:"#7390AA"}},{scope:"meta.separator.markdown",settings:{foreground:"#767c9d"}},{scope:"markup.bold.markdown",settings:{fontStyle:"bold"}},{scope:"markup.italic.markdown",settings:{fontStyle:"italic"}},{scope:["beginning.punctuation.definition.list.markdown","punctuation.definition.list.begin.markdown","markup.list.unnumbered.markdown"],settings:{foreground:"#ADD7FF"}},{scope:["string.other.link.description.title.markdown punctuation.definition.string.markdown","meta.link.inline.markdown string.other.link.description.title.markdown","string.other.link.description.title.markdown punctuation.definition.string.begin.markdown","string.other.link.description.title.markdown punctuation.definition.string.end.markdown","meta.image.inline.markdown string.other.link.description.title.markdown"],settings:{foreground:"#ADD7FF",fontStyle:""}},{scope:["meta.link.inline.markdown string.other.link.title.markdown","meta.link.reference.markdown string.other.link.title.markdown","meta.link.reference.def.markdown markup.underline.link.markdown"],settings:{foreground:"#ADD7FF",fontStyle:"underline"}},{scope:["markup.underline.link.markdown","string.other.link.description.title.markdown"],settings:{foreground:"#5DE4c7"}},{scope:["fenced_code.block.language","markup.inline.raw.markdown"],settings:{foreground:"#ADD7FF"}},{scope:["punctuation.definition.markdown","punctuation.definition.raw.markdown","punctuation.definition.heading.markdown","punctuation.definition.bold.markdown","punctuation.definition.italic.markdown"],settings:{foreground:"#ADD7FF"}},{scope:["source.ignore","log.error","log.exception"],settings:{foreground:"#d0679d"}},{scope:["log.verbose"],settings:{foreground:"#a6accd"}}]},skipLanguages:[],autoImport:!0,filepath:"/opt/build/repo/content/_mdx_bundler_entry_point-beb3aa03-2a91-4da5-84a6-6d426fa290cd.mdx"},uc={title:"Theatre.js v0.5 is out!",title_formatted:"Theatre.js v0.5 is out!",category:"Product Updates",cover_image:{url:"/images/blog/theatre-v05-is-out/v05-cover.png",alt:"Announcing Theatre.js v0.5",width:2820,height:1200},excerpt:"Theatre.js 0.5 introduces 3D scene editing, complex keyframing, and a new extension API",date:new Date(16632e8),authors:[{name:"Aria Minaei",handle:"ariaminaei",avatar:"https://pbs.twimg.com/profile_images/1367137683/aria_400x400.jpg"}],seo:{imagePath:"/images/blog/theatre-v05-is-out/v05-social.png"}};function dc(e={}){let{wrapper:t}=e.components||{};return t?(0,h.jsx)(t,Object.assign({},e,{children:(0,h.jsx)(n,{})})):n();function n(){let o=Object.assign({p:"p",strong:"strong",blockquote:"blockquote",a:"a",h2:"h2",code:"code",em:"em",ul:"ul",li:"li"},e.components),{Video:r,Callout:s}=o;return Ae||at("CH",!1),Ae.Code||at("CH.Code",!0),s||at("Callout",!0),r||at("Video",!0),(0,h.jsxs)(h.Fragment,{children:[(0,h.jsxs)(o.p,{children:["Friends, ",(0,h.jsx)(o.strong,{children:"Theatre.js v0.5"})," is finally out! It comes with a brand new 3D editor and a new set of tools for animating complex scenes."]}),` `,(0,h.jsxs)(o.blockquote,{children:[` `,(0,h.jsxs)(o.p,{children:["If you're new here: Theatre.js is a hackable animation library with visual tools. Learn more ",(0,h.jsx)(o.a,{href:"https://twitter.com/ariaminaei/status/1439918117807853575",children:"here"}),"."]}),` `]}),` `,(0,h.jsx)(o.p,{children:"Now let's talk about what's new!"}),` `,(0,h.jsx)(o.h2,{children:"A hackable 3D editor"}),` `,(0,h.jsxs)(o.p,{children:[`We've been building a 3D editor for existing React Three Fiber projects. It's an extension of Theatre.js. We call it `,(0,h.jsx)(o.code,{children:"@theatre/r3f"}),"."]}),` `,(0,h.jsxs)(o.p,{children:["You can use it by wrapping your React Three Fiber JSX tree with a ",(0,h.jsx)(o.code,{children:""}),":"]}),` `,(0,h.jsx)(Ae.Code,{codeConfig:ct,northPanel:{tabs:["Scene.jsx"],active:"Scene.jsx",heightRatio:1},files:[{name:"Scene.jsx",focus:"1,6,12",code:{lines:[{tokens:[{content:"import ",props:{style:{color:"#5DE4C7"}}},{content:"{",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"SheetProvider",props:{style:{color:"#ADD7FF"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"}",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"from",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"'",props:{style:{color:"#A6ACCD"}}},{content:"@theatre/r3f",props:{style:{color:"#5DE4C7"}}},{content:"'",props:{style:{color:"#A6ACCD"}}}]},{tokens:[]},{tokens:[{content:"export default ",props:{style:{color:"#5DE4C7"}}},{content:"function",props:{style:{color:"#91B4D5"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"Scene",props:{style:{color:"#ADD7FF"}}},{content:"()",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"{",props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"return",props:{style:{color:"#5DE4C7C0"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"(",props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"<",props:{style:{color:"#E4F0FB"}}},{content:"Canvas",props:{style:{color:"#5DE4C7"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"camera",props:{style:{color:"#91B4D5",fontStyle:"italic"}}},{content:"=",props:{style:{color:"#91B4D5"}}},{content:"{",props:{style:{color:"#E4F0FB"}}},{content:"{",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"position",props:{style:{color:"#ADD7FF"}}},{content:":",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#ADD7FF"}}},{content:"[",props:{style:{color:"#A6ACCD"}}},{content:"5",props:{style:{color:"#5DE4C7"}}},{content:",",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#ADD7FF"}}},{content:"5",props:{style:{color:"#5DE4C7"}}},{content:",",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#ADD7FF"}}},{content:"-",props:{style:{color:"#91B4D5"}}},{content:"5",props:{style:{color:"#5DE4C7"}}},{content:"]",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#ADD7FF"}}},{content:"}",props:{style:{color:"#A6ACCD"}}},{content:"}>",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" <",props:{style:{color:"#E4F0FB"}}},{content:"SheetProvider",props:{style:{color:"#5DE4C7"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"sheet",props:{style:{color:"#91B4D5",fontStyle:"italic"}}},{content:"=",props:{style:{color:"#91B4D5"}}},{content:"{demoSheet}>",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" <",props:{style:{color:"#E4F0FB"}}},{content:"pointLight",props:{style:{color:"#5DE4C7"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"position",props:{style:{color:"#91B4D5",fontStyle:"italic"}}},{content:"=",props:{style:{color:"#91B4D5"}}},{content:"{",props:{style:{color:"#E4F0FB"}}},{content:"[",props:{style:{color:"#A6ACCD"}}},{content:"10",props:{style:{color:"#5DE4C7"}}},{content:",",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"10",props:{style:{color:"#5DE4C7"}}},{content:",",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"10",props:{style:{color:"#5DE4C7"}}},{content:"]",props:{style:{color:"#A6ACCD"}}},{content:"} />",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" <",props:{style:{color:"#E4F0FB"}}},{content:"mesh",props:{style:{color:"#5DE4C7"}}},{content:">",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" <",props:{style:{color:"#E4F0FB"}}},{content:"boxGeometry",props:{style:{color:"#5DE4C7"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"args",props:{style:{color:"#91B4D5",fontStyle:"italic"}}},{content:"=",props:{style:{color:"#91B4D5"}}},{content:"{",props:{style:{color:"#E4F0FB"}}},{content:"[",props:{style:{color:"#A6ACCD"}}},{content:"1",props:{style:{color:"#5DE4C7"}}},{content:",",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"1",props:{style:{color:"#5DE4C7"}}},{content:",",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"1",props:{style:{color:"#5DE4C7"}}},{content:"]",props:{style:{color:"#A6ACCD"}}},{content:"} />",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" <",props:{style:{color:"#E4F0FB"}}},{content:"meshStandardMaterial",props:{style:{color:"#5DE4C7"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"color",props:{style:{color:"#91B4D5",fontStyle:"italic"}}},{content:"=",props:{style:{color:"#91B4D5"}}},{content:'"',props:{style:{color:"#A6ACCD"}}},{content:"orange",props:{style:{color:"#5DE4C7"}}},{content:'"',props:{style:{color:"#A6ACCD"}}},{content:" />",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" ",props:{style:{color:"#5DE4C7"}}},{content:")",props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:"}",props:{style:{color:"#A6ACCD"}}}]}],lang:"jsx"},annotations:[]}]}),` `,(0,h.jsxs)(o.p,{children:["And prepend your editable objects with ",(0,h.jsx)(o.code,{children:"editable."}),":"]}),` `,(0,h.jsx)(Ae.Code,{codeConfig:ct,northPanel:{tabs:["Scene.jsx"],active:"Scene.jsx",heightRatio:1},files:[{name:"Scene.jsx",focus:"1[24:32],7[10:18],10[10:18],13[11:19]",code:{lines:[{tokens:[{content:"import ",props:{style:{color:"#5DE4C7"}}},{content:"{",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"SheetProvider",props:{style:{color:"#ADD7FF"}}},{content:",",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"editable",props:{style:{color:"#ADD7FF"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"}",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"from",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"'",props:{style:{color:"#A6ACCD"}}},{content:"@theatre/r3f",props:{style:{color:"#5DE4C7"}}},{content:"'",props:{style:{color:"#A6ACCD"}}}]},{tokens:[]},{tokens:[{content:"export default ",props:{style:{color:"#5DE4C7"}}},{content:"function",props:{style:{color:"#91B4D5"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"Scene",props:{style:{color:"#ADD7FF"}}},{content:"()",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"{",props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"return",props:{style:{color:"#5DE4C7C0"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"(",props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"<",props:{style:{color:"#E4F0FB"}}},{content:"Canvas",props:{style:{color:"#5DE4C7"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"camera",props:{style:{color:"#91B4D5",fontStyle:"italic"}}},{content:"=",props:{style:{color:"#91B4D5"}}},{content:"{",props:{style:{color:"#E4F0FB"}}},{content:"{",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"position",props:{style:{color:"#ADD7FF"}}},{content:":",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#ADD7FF"}}},{content:"[",props:{style:{color:"#A6ACCD"}}},{content:"5",props:{style:{color:"#5DE4C7"}}},{content:",",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#ADD7FF"}}},{content:"5",props:{style:{color:"#5DE4C7"}}},{content:",",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#ADD7FF"}}},{content:"-",props:{style:{color:"#91B4D5"}}},{content:"5",props:{style:{color:"#5DE4C7"}}},{content:"]",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#ADD7FF"}}},{content:"}",props:{style:{color:"#A6ACCD"}}},{content:"}>",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" <",props:{style:{color:"#E4F0FB"}}},{content:"SheetProvider",props:{style:{color:"#5DE4C7"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"sheet",props:{style:{color:"#91B4D5",fontStyle:"italic"}}},{content:"=",props:{style:{color:"#91B4D5"}}},{content:"{demoSheet}>",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" <",props:{style:{color:"#E4F0FB"}}},{content:"editable.pointLight",props:{style:{color:"#5DE4C7"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"theatreKey",props:{style:{color:"#91B4D5",fontStyle:"italic"}}},{content:"=",props:{style:{color:"#91B4D5"}}},{content:'"',props:{style:{color:"#A6ACCD"}}},{content:"Lighting / Primary Source",props:{style:{color:"#5DE4C7"}}},{content:'"',props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"position",props:{style:{color:"#91B4D5",fontStyle:"italic"}}},{content:"=",props:{style:{color:"#91B4D5"}}},{content:"{",props:{style:{color:"#E4F0FB"}}},{content:"[",props:{style:{color:"#A6ACCD"}}},{content:"10",props:{style:{color:"#5DE4C7"}}},{content:",",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"10",props:{style:{color:"#5DE4C7"}}},{content:",",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"10",props:{style:{color:"#5DE4C7"}}},{content:"]",props:{style:{color:"#A6ACCD"}}},{content:"} />",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" <",props:{style:{color:"#E4F0FB"}}},{content:"editable.mesh",props:{style:{color:"#5DE4C7"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:'theatreKey"The',props:{style:{color:"#D0679D"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:'Box"">',props:{style:{color:"#D0679D"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" <",props:{style:{color:"#E4F0FB"}}},{content:"meshStandardMaterial",props:{style:{color:"#5DE4C7"}}},{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"color",props:{style:{color:"#91B4D5",fontStyle:"italic"}}},{content:"=",props:{style:{color:"#91B4D5"}}},{content:'"',props:{style:{color:"#A6ACCD"}}},{content:"orange",props:{style:{color:"#5DE4C7"}}},{content:'"',props:{style:{color:"#A6ACCD"}}},{content:" />",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"",props:{style:{color:"#91B4D5"}}}]},{tokens:[{content:" ",props:{style:{color:"#5DE4C7"}}},{content:")",props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:"}",props:{style:{color:"#A6ACCD"}}}]},{tokens:[]}],lang:"jsx"},annotations:[]}]}),` `,(0,h.jsx)(o.p,{children:`Now switch to the browser, and voila! We have a 3D editor driven by your React Three Fiber code!`}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/voila.mp4",children:(0,h.jsx)(o.p,{children:"Video showing a three dimensional scene with objects being moved around."})}),` `,(0,h.jsxs)(o.p,{children:[`All your editable objects are selectable, so you can move them around and change their props. Standard THREE.js objects have default bindings, so for example, lights get an `,(0,h.jsx)(o.code,{children:"intensity"})," prop and fogs have ",(0,h.jsx)(o.code,{children:"near"})," and ",(0,h.jsx)(o.code,{children:"far"})," planes:"]}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/fog.mp4",children:(0,h.jsx)(o.p,{children:`Video showing a steampunk-inspired setting with objects in the background fading in and out as the fog's far plane moves closer and farther away.`})}),` `,(0,h.jsx)(o.p,{children:"And you can extend the defaults with custom props:"}),` `,(0,h.jsx)(Ae.Code,{codeConfig:ct,northPanel:{tabs:["Lighting.jsx"],active:"Lighting.jsx",heightRatio:1},files:[{name:"Lighting.jsx",focus:"5:8",code:{lines:[{tokens:[{content:"export default ",props:{style:{color:"#5DE4C7"}}},{content:"function",props:{style:{color:"#91B4D5"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"Lighting",props:{style:{color:"#ADD7FF"}}},{content:"()",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"{",props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"return",props:{style:{color:"#5DE4C7C0"}}},{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"(",props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:" ",props:{style:{color:"#5DE4C7"}}},{content:"<",props:{style:{color:"#E4F0FB"}}},{content:"e.ambientLight",props:{style:{color:"#5DE4C7"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"theatreKey",props:{style:{color:"#91B4D5",fontStyle:"italic"}}},{content:"=",props:{style:{color:"#91B4D5"}}},{content:'"',props:{style:{color:"#A6ACCD"}}},{content:"Lighting / Base",props:{style:{color:"#5DE4C7"}}},{content:'"',props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"additionalProps",props:{style:{color:"#91B4D5",fontStyle:"italic"}}},{content:"=",props:{style:{color:"#91B4D5"}}},{content:"{",props:{style:{color:"#E4F0FB"}}},{content:"{",props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"secondaryColor",props:{style:{color:"#ADD7FF"}}},{content:":",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#ADD7FF"}}},{content:"types",props:{style:{color:"#E4F0FB"}}},{content:".",props:{style:{color:"#A6ACCD"}}},{content:"rgba",props:{style:{color:"#E4F0FBD0"}}},{content:"(),",props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"bloomContribution",props:{style:{color:"#ADD7FF"}}},{content:":",props:{style:{color:"#A6ACCD"}}},{content:" ",props:{style:{color:"#ADD7FF"}}},{content:"3.4",props:{style:{color:"#5DE4C7"}}},{content:",",props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:" ",props:{style:{color:"#E4F0FB"}}},{content:"}",props:{style:{color:"#A6ACCD"}}},{content:"}",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" />",props:{style:{color:"#E4F0FB"}}}]},{tokens:[{content:" ",props:{style:{color:"#5DE4C7"}}},{content:")",props:{style:{color:"#A6ACCD"}}}]},{tokens:[{content:"}",props:{style:{color:"#A6ACCD"}}}]}],lang:"jsx"},annotations:[]}]}),` `,(0,h.jsx)(o.p,{children:`There are two ways to edit your 3D object's props: directly manipulate them in the 3D editor or tweak and fine-tune them in the prop editor.`}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/butterfly-preview.mp4",children:(0,h.jsx)(o.p,{children:`Video showing a 3D scene with a flying butterfly whose position/rotation is being controlled by a set of keyframes in a sequence editor.`})}),` `,(0,h.jsxs)(o.p,{children:["You can follow this ",(0,h.jsx)(o.a,{href:"/docs/latest/getting-started/with-react-three-fiber",children:"quick Theatre.js R3F tutorial"})," to get started."]}),` `,(0,h.jsx)(s,{type:"info",children:(0,h.jsxs)(o.p,{children:[(0,h.jsx)(o.code,{children:"@theatre/r3f"})," is just an extension. We have more extensions in the works, and you can also roll your own!"]})}),` `,(0,h.jsx)(o.h2,{children:"New ways to animate"}),` `,(0,h.jsx)(o.p,{children:`When the original Theatre.js came out, it could only animate one track at a time and that track could only have numeric props. We were actually pretty embarrassed by how bare bones it was \u{1F605}`}),` `,(0,h.jsx)(o.p,{children:`Almost immediately, teams started using Theatre.js to drive game cinematics, audiovisual experiences, and interactive articles. Some of these projects have hundreds of keyframed tracks choreographed together. Animating such large scenes is doable but painful. So, for v0.5 we wanted to address some of the most painful of these pain points...`}),` `,(0,h.jsx)(o.p,{children:"For starters, we made all props types sequenceable. Booleans, switches, and even strings are animatable now; and you can customize their interpolation functions too."}),` `,(0,h.jsx)(r,{className:"md:w-1/2",src:"/images/blog/theatre-v05-is-out/sequence-different-prop-types.mp4",children:(0,h.jsx)(o.p,{children:"TODO"})}),` `,(0,h.jsx)(o.p,{children:"Keyframe values can now be edited inline, saving you seconds on each edit."}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/inline.mp4",children:"TODO"}),` `,(0,h.jsx)(o.p,{children:"Theatre.js's multi-track editor is great for animating related values with fine-grained detail. The new tween editor adds to that by letting you control several tweens at once."}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/tween-editor-1.mp4",children:"TODO"}),` `,(0,h.jsx)(o.p,{children:"Plus it comes with presets for the most common easing curves (thank you, Michael Anthony!)"}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/tween-editor-presets.mp4",children:"TODO"}),` `,(0,h.jsx)(o.p,{children:"And the fuzzy-matched search saves you a few seconds if you know the name of the preset you're looking for."}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/tween-editor-fuzzy.mp4",children:"TODO"}),` `,(0,h.jsx)(o.p,{children:"You can now drag keyframes in tracks that have child tracks to drag all the child track keyframes at once."}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/aggregate-keyframes.mp4",children:"TODO"}),` `,(0,h.jsx)(o.p,{children:"Sync things even more with sequence-wide markers."}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/markers.mp4",children:"TODO"}),` `,(0,h.jsx)(o.p,{children:`If you have a long animation, you may want to focus playback on a short range of the sequence while you get it right. The new focus range makes that easy.`}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/focus-range.mp4",children:"TODO"}),` `,(0,h.jsxs)(o.p,{children:["As is always the case with the sequence editor, ",(0,h.jsx)(o.em,{children:"everything"})," snaps!"]}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/everything-snaps.mp4",children:"TODO"}),` `,(0,h.jsx)(o.p,{children:"Multi-track selections and copy/paste are here."}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/selections-copy.mp4",children:"TODO"}),` `,(0,h.jsxs)(o.p,{children:[`Oh, and we added a color prop, with a twist! It interpolates colors in the `,(0,h.jsx)(o.a,{href:"https://raphlinus.github.io/color/2021/01/18/oklab-critique.html",children:"Oklab color space"}),`. So, you don't have to make multi-point gradients to make your color transitions look natural:`]}),` `,(0,h.jsx)(r,{src:"/images/blog/theatre-v05-is-out/color-lab.mp4",children:"TODO"}),` `,(0,h.jsx)(o.h2,{children:"The extension API"}),` `,(0,h.jsxs)(o.p,{children:["You can now call the same extension API used by ",(0,h.jsx)(o.code,{children:"@theatre/r3f"})," to build editing tools for ",(0,h.jsx)(o.em,{children:"your"})," stack; no matter if you use SVG, ",(0,h.jsx)(o.a,{href:"https://d3js.org/",children:"D3.js"}),`, or even a custom WebGL engine. Follow our `,(0,h.jsx)(o.a,{href:"/docs/latest/manual/authoring-extensions",children:"Authoring Extensions Guide"})," to get started making your own extensions to the Theatre.js Studio."]}),` `,(0,h.jsx)(o.h2,{children:"And more"}),` `,(0,h.jsxs)(o.p,{children:[`This release comes with a bunch of DX/UX quality-of-life improvements, more tools for navigating larger projects, bug fixes for Windows, better compatibility with the rest of the JS ecosystem, new docs, and perf optimizations. Read more about all the changes on the `,(0,h.jsx)(o.a,{href:"/docs/latest/releases",children:"releases page"}),"."]}),` `,(0,h.jsx)(o.h2,{children:"Thank you"}),` `,(0,h.jsx)(o.p,{children:`v0.5 was a big release with a lot of help from our contributors. We want to help everyone who helped implement features and fixes and gave us feedback.`}),` `,(0,h.jsxs)(o.ul,{children:[` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://twitter.com/mariuszwnek",children:"Mariusz Wn\u0119k"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://twitter.com/notacheetah",children:"F\xFCl\xF6p Kov\xE1cks"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://twitter.com/refactorordie",children:"Cole Lawrence"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://github.com/michaeltheory",children:"Michael Anthony"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://github.com/donmccurdy",children:"Don McCurdy"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://github.com/juniorxsound",children:"Or Fleisher"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://twitter.com/RealSammyT",children:"Tyler Sammy"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://twitter.com/thieb_co",children:"Thieb Delaporte-Richard"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://github.com/cory-glooh",children:"@coryg-looh"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://github.com/jmyrland",children:"J\xF8rn Myrland"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://github.com/RuiOrey",children:"@RuiOrey"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://github.com/akella",children:"Yuri Artiukh"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://github.com/PaleHazy",children:"@PaleHazy"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://github.com/danvoyce",children:"Dan Voyce"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://github.com/nksaraf",children:"Nikhil Saraf"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://twitter.com/tomorrowevening",children:"Colin Duffy"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://twitter.com/marcel_wiessler",children:"Marcel Weissler"})}),` `,(0,h.jsx)(o.li,{children:(0,h.jsx)(o.a,{href:"https://github.com/steam0r",children:"@SteamOr"})}),` `]}),` `,(0,h.jsxs)(o.p,{children:["If you are interested in helping improve Theatre.js, we invite you to ",(0,h.jsx)(o.a,{href:"https://discord.gg/bm9f8F9Y9N",children:"join the Theatre.js Discord"})," and look for the ",(0,h.jsx)(o.code,{children:"#contributing"}),` channel to get started helping with design, implementation, docs, or bug fixes. You can also `,(0,h.jsx)(o.code,{children:"#help"})," others, write or record tutorials, create extensions, or just hang out with us on ",(0,h.jsx)(o.code,{children:"#chat"})," \u{1F609}"]}),` `,(0,h.jsx)(o.p,{children:"Til the next release!"})]})}}var fc=dc;function at(e,t){throw new Error("Expected "+(t?"component":"object")+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}return ls(pc);})(); ;return Component;

Theatre.js Blog

Theatre.js v0.5 is out!

Announcing $4.5M Seed for Theatre.js

Get started with

Docs

Community

Company