livecodes/react.js

A Code Playground That Just Works!

var oe=Object.create;var Q=Object.defineProperty;var re=Object.getOwnPropertyDescriptor;var se=Object.getOwnPropertyNames;var ie=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var le=(d,u)=>()=>(u||d((u={exports:{}}).exports,u),u.exports);var ce=(d,u,m,f)=>{if(u&&typeof u=="object"||typeof u=="function")for(let v of se(u))!ae.call(d,v)&&v!==m&&Q(d,v,{get:()=>u[v],enumerable:!(f=re(u,v))||f.enumerable});return d};var de=(d,u,m)=>(m=d!=null?oe(ie(d)):{},ce(u||!d||!d.__esModule?Q(m,"default",{value:d,enumerable:!0}):m,d));var Z=le((be,K)=>{var fe=function(){var d=String.fromCharCode,u="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",m="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+-$",f={};function v(o,r){if(!f[o]){f[o]={};for(var e=0;e<o.length;e++)f[o][o.charAt(e)]=e}return f[o][r]}var x={compressToBase64:function(o){if(o==null)return"";var r=x._compress(o,6,function(e){return u.charAt(e)});switch(r.length%4){default:case 0:return r;case 1:return r+"===";case 2:return r+"==";case 3:return r+"="}},decompressFromBase64:function(o){return o==null?"":o==""?null:x._decompress(o.length,32,function(r){return v(u,o.charAt(r))})},compressToUTF16:function(o){return o==null?"":x._compress(o,15,function(r){return d(r+32)})+" "},decompressFromUTF16:function(o){return o==null?"":o==""?null:x._decompress(o.length,16384,function(r){return o.charCodeAt(r)-32})},compressToUint8Array:function(o){for(var r=x.compress(o),e=new Uint8Array(r.length*2),n=0,l=r.length;n<l;n++){var g=r.charCodeAt(n);e[n*2]=g>>>8,e[n*2+1]=g%256}return e},decompressFromUint8Array:function(o){if(o==null)return x.decompress(o);for(var r=new Array(o.length/2),e=0,n=r.length;e<n;e++)r[e]=o[e*2]*256+o[e*2+1];var l=[];return r.forEach(function(g){l.push(d(g))}),x.decompress(l.join(""))},compressToEncodedURIComponent:function(o){return o==null?"":x._compress(o,6,function(r){return m.charAt(r)})},decompressFromEncodedURIComponent:function(o){return o==null?"":o==""?null:(o=o.replace(/ /g,"+"),x._decompress(o.length,32,function(r){return v(m,o.charAt(r))}))},compress:function(o){return x._compress(o,16,function(r){return d(r)})},_compress:function(o,r,e){if(o==null)return"";var n,l,g={},w={},E="",R="",b="",P=2,S=3,c=2,h=[],t=0,s=0,A;for(A=0;A<o.length;A+=1)if(E=o.charAt(A),Object.prototype.hasOwnProperty.call(g,E)||(g[E]=S++,w[E]=!0),R=b+E,Object.prototype.hasOwnProperty.call(g,R))b=R;else{if(Object.prototype.hasOwnProperty.call(w,b)){if(b.charCodeAt(0)<256){for(n=0;n<c;n++)t=t<<1,s==r-1?(s=0,h.push(e(t)),t=0):s++;for(l=b.charCodeAt(0),n=0;n<8;n++)t=t<<1|l&1,s==r-1?(s=0,h.push(e(t)),t=0):s++,l=l>>1}else{for(l=1,n=0;n<c;n++)t=t<<1|l,s==r-1?(s=0,h.push(e(t)),t=0):s++,l=0;for(l=b.charCodeAt(0),n=0;n<16;n++)t=t<<1|l&1,s==r-1?(s=0,h.push(e(t)),t=0):s++,l=l>>1}P--,P==0&&(P=Math.pow(2,c),c++),delete w[b]}else for(l=g[b],n=0;n<c;n++)t=t<<1|l&1,s==r-1?(s=0,h.push(e(t)),t=0):s++,l=l>>1;P--,P==0&&(P=Math.pow(2,c),c++),g[R]=S++,b=String(E)}if(b!==""){if(Object.prototype.hasOwnProperty.call(w,b)){if(b.charCodeAt(0)<256){for(n=0;n<c;n++)t=t<<1,s==r-1?(s=0,h.push(e(t)),t=0):s++;for(l=b.charCodeAt(0),n=0;n<8;n++)t=t<<1|l&1,s==r-1?(s=0,h.push(e(t)),t=0):s++,l=l>>1}else{for(l=1,n=0;n<c;n++)t=t<<1|l,s==r-1?(s=0,h.push(e(t)),t=0):s++,l=0;for(l=b.charCodeAt(0),n=0;n<16;n++)t=t<<1|l&1,s==r-1?(s=0,h.push(e(t)),t=0):s++,l=l>>1}P--,P==0&&(P=Math.pow(2,c),c++),delete w[b]}else for(l=g[b],n=0;n<c;n++)t=t<<1|l&1,s==r-1?(s=0,h.push(e(t)),t=0):s++,l=l>>1;P--,P==0&&(P=Math.pow(2,c),c++)}for(l=2,n=0;n<c;n++)t=t<<1|l&1,s==r-1?(s=0,h.push(e(t)),t=0):s++,l=l>>1;for(;;)if(t=t<<1,s==r-1){h.push(e(t));break}else s++;return h.join("")},decompress:function(o){return o==null?"":o==""?null:x._decompress(o.length,32768,function(r){return o.charCodeAt(r)})},_decompress:function(o,r,e){var n=[],l,g=4,w=4,E=3,R="",b=[],P,S,c,h,t,s,A,i={val:e(0),position:r,index:1};for(P=0;P<3;P+=1)n[P]=P;for(c=0,t=Math.pow(2,2),s=1;s!=t;)h=i.val&i.position,i.position>>=1,i.position==0&&(i.position=r,i.val=e(i.index++)),c|=(h>0?1:0)*s,s<<=1;switch(l=c){case 0:for(c=0,t=Math.pow(2,8),s=1;s!=t;)h=i.val&i.position,i.position>>=1,i.position==0&&(i.position=r,i.val=e(i.index++)),c|=(h>0?1:0)*s,s<<=1;A=d(c);break;case 1:for(c=0,t=Math.pow(2,16),s=1;s!=t;)h=i.val&i.position,i.position>>=1,i.position==0&&(i.position=r,i.val=e(i.index++)),c|=(h>0?1:0)*s,s<<=1;A=d(c);break;case 2:return""}for(n[3]=A,S=A,b.push(A);;){if(i.index>o)return"";for(c=0,t=Math.pow(2,E),s=1;s!=t;)h=i.val&i.position,i.position>>=1,i.position==0&&(i.position=r,i.val=e(i.index++)),c|=(h>0?1:0)*s,s<<=1;switch(A=c){case 0:for(c=0,t=Math.pow(2,8),s=1;s!=t;)h=i.val&i.position,i.position>>=1,i.position==0&&(i.position=r,i.val=e(i.index++)),c|=(h>0?1:0)*s,s<<=1;n[w++]=d(c),A=w-1,g--;break;case 1:for(c=0,t=Math.pow(2,16),s=1;s!=t;)h=i.val&i.position,i.position>>=1,i.position==0&&(i.position=r,i.val=e(i.index++)),c|=(h>0?1:0)*s,s<<=1;n[w++]=d(c),A=w-1,g--;break;case 2:return b.join("")}if(g==0&&(g=Math.pow(2,E),E++),n[A])R=n[A];else if(A===w)R=S+S.charAt(0);else return null;b.push(R),n[w++]=S+R.charAt(0),g--,S=R,g==0&&(g=Math.pow(2,E),E++)}}};return x}();typeof K!="undefined"&&K!=null&&(K.exports=fe)});import{useEffect as me,useRef as he}from"react";var z=de(Z());var ue={chrome:["accelerometer","bluetooth","camera","clipboard-read","clipboard-write","display-capture","encrypted-media","geolocation","gyroscope","language-detector","language-model","local-network-access","microphone","midi","proofreader","rewriter","serial","summarizer","translator","web-share","writer","window-placement","xr-spatial-tracking"],firefox:["camera","display-capture","geolocation","microphone","web-share"],default:["accelerometer","ambient-light-sensor","camera","display-capture","encrypted-media","geolocation","gyroscope","microphone","midi","payment","serial","vr","web-share","xr-spatial-tracking"]},pe=()=>{if(typeof navigator=="undefined")return"default";let d=navigator.userAgent;return/Firefox\//i.test(d)?"firefox":/Chrome\//i.test(d)?"chrome":"default"},G=()=>ue[pe()].filter(d=>{var m,f,v;let u=(v=(f=(m=globalThis.document)==null?void 0:m.featurePolicy)==null?void 0:f.features)==null?void 0:v.call(f);return u?u.includes(d):!0}).join("; ");async function Y(d,u={}){typeof d=="object"&&!(d instanceof HTMLElement)&&(d.headless||d.view==="headless")&&(u=d,d=null);let m=6e4,{config:f={},headless:v,loading:x="lazy",view:o}=u,r=v||o==="headless",e=null,n=null,l=a=>{a.style.position="absolute",a.style.top="0",a.style.visibility="hidden",a.style.opacity="0"};if(typeof d=="string")e=document.querySelector(d);else if(d instanceof HTMLElement)e=d;else if(!(r&&typeof d=="object"))throw new Error("A valid container element is required.");if(!e)if(r)e=document.createElement("div"),l(e),document.body.appendChild(e);else throw new Error(`Cannot find element: "${d}"`);let g=new URL(ge(u)),w=g.origin;g.searchParams.set("embed","true"),g.searchParams.set("loading",r?"eager":x),g.searchParams.set("sdkVersion","0.14.1"),typeof f=="object"&&Object.keys(f).length>0&&g.searchParams.set("config","sdk");let E=u.params;typeof E=="object"&&Object.keys(E).length>0&&JSON.stringify(E).length<1800&&Object.keys(E).forEach(a=>{g.searchParams.set(a,encodeURIComponent(String(E[a])))});let R=!1,b="Cannot call API methods after calling `destroy()`.",P=[],S=(a,p="message")=>{addEventListener(p,a),P.push(a)},c=(a,p="message")=>{removeEventListener(p,a);let C=P.indexOf(a);C>-1&&P.splice(C,1)},t=await new Promise(a=>{var M,H,T,I,_,U,B,J,$;if(!e)return;let p=e.dataset.height||e.style.height;if(p&&!r){let N=isNaN(Number(p))?p:p+"px";e.style.height=N}e.dataset.defaultStyles!=="false"&&!r&&((M=e.style).backgroundColor||(M.backgroundColor="#fff"),(H=e.style).border||(H.border="1px solid black"),(T=e.style).borderRadius||(T.borderRadius="8px"),(I=e.style).boxSizing||(I.boxSizing="border-box"),(_=e.style).padding||(_.padding="0"),(U=e.style).width||(U.width="100%"),(B=e.style).height||(B.height=e.style.height||"300px"),e.style.minHeight="200px",e.style.flexGrow="1",(J=e.style).overflow||(J.overflow="hidden"),($=e.style).resize||($.resize="vertical"),getComputedStyle(e).getPropertyValue("display")==="inline"&&(e.style.display="block"));let C="livecodes",O=e.querySelector(`iframe.${C}`),y=O||document.createElement("iframe");y.classList.add(C),y.setAttribute("allow",G()),y.setAttribute("allowtransparency","true"),y.setAttribute("allowpaymentrequest","true"),y.setAttribute("allowfullscreen","true"),y.setAttribute("sandbox","allow-same-origin allow-downloads allow-forms allow-modals allow-orientation-lock allow-pointer-lock allow-popups allow-presentation allow-scripts");let k=x==="eager"?"eager":"lazy";y.setAttribute("loading",k),r?l(y):(y.style.height="100%",y.style.minHeight="200px",y.style.width="100%",y.style.margin="0",y.style.border="0",y.style.borderRadius=e.style.borderRadius),S(function N(j){var D;j.source!==y.contentWindow||j.origin!==w||((D=j.data)==null?void 0:D.type)!=="livecodes-init"||(c(N),n=Number(j.data.payload.appVersion.replace(/^v/,"")))}),(!n||n<46)&&S(function N(j){var D,q;j.source!==y.contentWindow||j.origin!==w||((D=j.data)==null?void 0:D.type)!=="livecodes-get-config"||(c(N),(q=y.contentWindow)==null||q.postMessage({type:"livecodes-config",payload:f},w))}),y.onload=()=>{a(y)},y.src=g.href,O||e.appendChild(y)}),s=new Promise(a=>{S(function p(C){var O;C.source!==t.contentWindow||C.origin!==w||((O=C.data)==null?void 0:O.type)!=="livecodes-ready"||(c(p),a(),s.settled=!0)})}),A=()=>R?Promise.reject(b):new Promise(async a=>{var C;s.settled&&a();let p={type:"livecodes-load"};(C=t.contentWindow)==null||C.postMessage(p,w),await s,a()}),i=(a,p)=>new Promise(async(C,O)=>{var H;if(R)return O(b);await A();let y=ne(),k=setTimeout(()=>{c(M),O(new Error(`SDK call "${a}" timed out after ${m}ms.`))},m);function M(T){var I,_;if(!(T.source!==t.contentWindow||T.origin!==w||((I=T.data)==null?void 0:I.type)!=="livecodes-api-response"||((_=T.data)==null?void 0:_.id)!==y)&&T.data.method===a){clearTimeout(k),c(M);let U=T.data.payload;U!=null&&U.error?O(U.error):C(U)}}S(M),(H=t.contentWindow)==null||H.postMessage({method:a,id:y,args:p},w)}),L={},V=["load","ready","code","console","tests","destroy"],W=(a,p)=>{var C;if(R)throw new Error(b);return V.includes(a)?(i("watch",[a]),L[a]||(L[a]=[]),(C=L[a])==null||C.push(p),{remove:()=>{var O,y;L[a]=(O=L[a])==null?void 0:O.filter(k=>k!==p),((y=L[a])==null?void 0:y.length)===0&&i("watch",[a,"unsubscribe"])}}):{remove:()=>{}}},ee=a=>({"livecodes-app-loaded":"load","livecodes-ready":"ready","livecodes-change":"code","livecodes-console":"console","livecodes-test-results":"tests","livecodes-destroy":"destroy"})[a];S(async function(p){var y,k,M,H;let C=ee((k=(y=p.data)==null?void 0:y.type)!=null?k:"");if(p.source!==t.contentWindow||p.origin!==w||!C||!L[C])return;let O=(M=p.data)==null?void 0:M.payload;(H=L[C])==null||H.forEach(T=>{T(O)})});let te=()=>{var a;(a=t==null?void 0:t.remove)==null||a.call(t),Object.values(L).forEach(p=>{p.length=0}),P.forEach(p=>removeEventListener("message",p)),P.length=0,F&&e&&F.unobserve(e),R=!0},F;x==="lazy"&&"IntersectionObserver"in window&&(F=new IntersectionObserver((a,p)=>{a.forEach(async C=>{C.isIntersecting&&(await A(),p.unobserve(e))})},{rootMargin:"150px"}),F.observe(e));let ne=()=>(String(Math.random())+Date.now().toFixed()).replace("0.","");return{load:()=>A(),run:()=>i("run"),format:a=>i("format",[a]),getShareUrl:a=>i("getShareUrl",[a]),getConfig:a=>i("getConfig",[a]),setConfig:a=>i("setConfig",[a]),getCode:()=>i("getCode"),show:(a,p)=>i("show",[a,p]),runTests:()=>i("runTests"),onChange:a=>W("code",a),watch:W,exec:(a,...p)=>i("exec",[a,...p]),destroy:()=>R?Promise.reject(b):(te(),Promise.resolve())}}function ge(d={}){let{appUrl:u="https://livecodes.io",params:m={},config:f={},headless:v,import:x,lite:o,view:r,...e}=d,n;try{n=new URL(u)}catch(w){throw new Error(`${u} is not a valid URL.`)}let l=new URLSearchParams;Object.entries(e).forEach(([w,E])=>{E!==void 0&&n.searchParams.set(w,String(E))});let g=d.view==="headless"||v;if(o&&(console.warn(`Deprecation notice: "lite" option is deprecated. Use "config: { mode: 'lite' }" instead.`),typeof f=="object"&&f.mode==null?f.mode="lite":n.searchParams.set("lite","true")),r&&(console.warn('Deprecation notice: The "view" option has been moved to "config.view". For headless mode use "headless: true".'),typeof f=="object"&&f.view==null&&r!=="headless"?f.view=r:n.searchParams.set("view",r)),typeof f=="string")try{new URL(f),n.searchParams.set("config",encodeURIComponent(f))}catch(w){throw new Error('"config" is not a valid URL or configuration object.')}else f&&typeof f=="object"&&Object.keys(f).length>0&&(f.title&&f.title!=="Untitled Project"&&n.searchParams.set("title",f.title),f.description&&f.description.length>0&&n.searchParams.set("description",f.description),l.set("config","code/"+(0,z.compressToEncodedURIComponent)(JSON.stringify(f))));if(m&&typeof m=="object"&&Object.keys(m).length>0)try{l.set("params",(0,z.compressToEncodedURIComponent)(JSON.stringify(m)))}catch(w){Object.keys(m).forEach(E=>{n.searchParams.set(E,encodeURIComponent(String(m[E])))})}return x&&n.searchParams.set("x",encodeURIComponent(x)),g&&n.searchParams.set("headless","true"),l.toString().length>0&&(n.hash=l.toString()),n.href}function X(d){let{useEffect:u,useRef:m}=d;return function(v){let x=m(null),o=m(void 0),r=m(""),e=m(""),n=m(0),l=m(!1),g=v.className||"",w=v.style||{},E=v.height&&Number(v.height)?`${v.height}px`:v.height;return u(()=>{var i;if(!x.current)return;let{className:R,style:b,height:P,sdkReady:S,config:c,...h}=v,t=++n.current,s=()=>n.current!==t||l.current,A=JSON.stringify(h);if(!o.current||e.current!==A)e.current=A,r.current=JSON.stringify(c),(i=o.current)==null||i.destroy(),o.current=void 0,Y(x.current,{config:c,...h}).then(L=>{if(s()){L.destroy();return}o.current=L,typeof S=="function"&&S(L)});else{let L=JSON.stringify(c);if(r.current===L)return;r.current=L,c&&o.current.setConfig(c)}},[v]),u(()=>()=>{var R;l.current=!0,(R=o.current)==null||R.destroy(),o.current=void 0},[]),{containerRef:x,className:g,style:w,height:E}}}import{jsx as we}from"react/jsx-runtime";var ye=X({useEffect:me,useRef:he});function ve(d){let{containerRef:u,className:m,style:f,height:v}=ye(d);return we("div",{ref:u,className:m,style:{...f,...v?{height:v}:{}},"data-height":v})}export{ve as default};