From 1e1a5c92336ce62d751579f8c7edbf9f5475b520 Mon Sep 17 00:00:00 2001 From: Loic Coyle Date: Mon, 30 Dec 2024 18:36:46 +0100 Subject: [PATCH] fix: don't upscale image --- dist/assets/{index-CiXBxY0t.js => index-D3c7nb9f.js} | 2 +- dist/index.html | 2 +- src/components/Canvas.tsx | 8 ++++---- src/contexts/ThemeContext.tsx | 2 -- 4 files changed, 6 insertions(+), 8 deletions(-) rename dist/assets/{index-CiXBxY0t.js => index-D3c7nb9f.js} (88%) diff --git a/dist/assets/index-CiXBxY0t.js b/dist/assets/index-D3c7nb9f.js similarity index 88% rename from dist/assets/index-CiXBxY0t.js rename to dist/assets/index-D3c7nb9f.js index 515b523..aed4395 100644 --- a/dist/assets/index-CiXBxY0t.js +++ b/dist/assets/index-D3c7nb9f.js @@ -6,4 +6,4 @@ `).replace(vd,"")}function Vr(e,n,t){if(n=Uu(n),Uu(e)!==n&&t)throw Error(w(425))}function Wr(){}var $l=null,Bl=null;function Vl(e,n){return e==="textarea"||e==="noscript"||typeof n.children=="string"||typeof n.children=="number"||typeof n.dangerouslySetInnerHTML=="object"&&n.dangerouslySetInnerHTML!==null&&n.dangerouslySetInnerHTML.__html!=null}var Wl=typeof setTimeout=="function"?setTimeout:void 0,wd=typeof clearTimeout=="function"?clearTimeout:void 0,Au=typeof Promise=="function"?Promise:void 0,kd=typeof queueMicrotask=="function"?queueMicrotask:typeof Au<"u"?function(e){return Au.resolve(null).then(e).catch(xd)}:Wl;function xd(e){setTimeout(function(){throw e})}function Hl(e,n){var t=n,r=0;do{var a=t.nextSibling;if(e.removeChild(t),a&&a.nodeType===8)if(t=a.data,t==="/$"){if(r===0){e.removeChild(a),Dt(n);return}r--}else t!=="$"&&t!=="$?"&&t!=="$!"||r++;t=a}while(t);Dt(n)}function mn(e){for(;e!=null;e=e.nextSibling){var n=e.nodeType;if(n===1||n===3)break;if(n===8){if(n=e.data,n==="$"||n==="$!"||n==="$?")break;if(n==="/$")return null}}return e}function $u(e){e=e.previousSibling;for(var n=0;e;){if(e.nodeType===8){var t=e.data;if(t==="$"||t==="$!"||t==="$?"){if(n===0)return e;n--}else t==="/$"&&n++}e=e.previousSibling}return null}var at=Math.random().toString(36).slice(2),We="__reactFiber$"+at,Yt="__reactProps$"+at,Ze="__reactContainer$"+at,Ql="__reactEvents$"+at,_d="__reactListeners$"+at,Sd="__reactHandles$"+at;function jn(e){var n=e[We];if(n)return n;for(var t=e.parentNode;t;){if(n=t[Ze]||t[We]){if(t=n.alternate,n.child!==null||t!==null&&t.child!==null)for(e=$u(e);e!==null;){if(t=e[We])return t;e=$u(e)}return n}e=t,t=e.parentNode}return null}function Gt(e){return e=e[We]||e[Ze],!e||e.tag!==5&&e.tag!==6&&e.tag!==13&&e.tag!==3?null:e}function lt(e){if(e.tag===5||e.tag===6)return e.stateNode;throw Error(w(33))}function Hr(e){return e[Yt]||null}var ql=[],ot=-1;function yn(e){return{current:e}}function V(e){0>ot||(e.current=ql[ot],ql[ot]=null,ot--)}function A(e,n){ot++,ql[ot]=e.current,e.current=n}var bn={},se=yn(bn),be=yn(!1),zn=bn;function it(e,n){var t=e.type.contextTypes;if(!t)return bn;var r=e.stateNode;if(r&&r.__reactInternalMemoizedUnmaskedChildContext===n)return r.__reactInternalMemoizedMaskedChildContext;var a={},l;for(l in t)a[l]=n[l];return r&&(e=e.stateNode,e.__reactInternalMemoizedUnmaskedChildContext=n,e.__reactInternalMemoizedMaskedChildContext=a),a}function ve(e){return e=e.childContextTypes,e!=null}function Qr(){V(be),V(se)}function Bu(e,n,t){if(se.current!==bn)throw Error(w(168));A(se,n),A(be,t)}function Vu(e,n,t){var r=e.stateNode;if(n=n.childContextTypes,typeof r.getChildContext!="function")return t;r=r.getChildContext();for(var a in r)if(!(a in n))throw Error(w(108,uf(e)||"Unknown",a));return Q({},t,r)}function qr(e){return e=(e=e.stateNode)&&e.__reactInternalMemoizedMergedChildContext||bn,zn=se.current,A(se,e),A(be,be.current),!0}function Wu(e,n,t){var r=e.stateNode;if(!r)throw Error(w(169));t?(e=Vu(e,n,zn),r.__reactInternalMemoizedMergedChildContext=e,V(be),V(se),A(se,e)):V(be),A(be,t)}var Je=null,Kr=!1,Kl=!1;function Hu(e){Je===null?Je=[e]:Je.push(e)}function Cd(e){Kr=!0,Hu(e)}function vn(){if(!Kl&&Je!==null){Kl=!0;var e=0,n=U;try{var t=Je;for(U=1;e>=o,a-=o,en=1<<32-Fe(n)+a|t<y?(N=v,v=null):N=v.sibling;var E=p(d,v,f[y],m);if(E===null){v===null&&(v=N);break}e&&v&&E.alternate===null&&n(d,v),s=l(E,s,y),C===null?_=E:C.sibling=E,C=E,v=N}if(y===f.length)return t(d,v),W&&Rn(d,y),_;if(v===null){for(;yy?(N=v,v=null):N=v.sibling;var j=p(d,v,E.value,m);if(j===null){v===null&&(v=N);break}e&&v&&j.alternate===null&&n(d,v),s=l(j,s,y),C===null?_=j:C.sibling=j,C=j,v=N}if(E.done)return t(d,v),W&&Rn(d,y),_;if(v===null){for(;!E.done;y++,E=f.next())E=g(d,E.value,m),E!==null&&(s=l(E,s,y),C===null?_=E:C.sibling=E,C=E);return W&&Rn(d,y),_}for(v=r(d,v);!E.done;y++,E=f.next())E=x(v,d,y,E.value,m),E!==null&&(e&&E.alternate!==null&&v.delete(E.key===null?y:E.key),s=l(E,s,y),C===null?_=E:C.sibling=E,C=E);return e&&v.forEach(function(Y){return n(d,Y)}),W&&Rn(d,y),_}function F(d,s,f,m){if(typeof f=="object"&&f!==null&&f.type===Kn&&f.key===null&&(f=f.props.children),typeof f=="object"&&f!==null){switch(f.$$typeof){case vr:e:{for(var _=f.key,C=s;C!==null;){if(C.key===_){if(_=f.type,_===Kn){if(C.tag===7){t(d,C.sibling),s=a(C,f.props.children),s.return=d,d=s;break e}}else if(C.elementType===_||typeof _=="object"&&_!==null&&_.$$typeof===un&&Xu(_)===C.type){t(d,C.sibling),s=a(C,f.props),s.ref=Xt(d,C,f),s.return=d,d=s;break e}t(d,C);break}else n(d,C);C=C.sibling}f.type===Kn?(s=Bn(f.props.children,d.mode,m,f.key),s.return=d,d=s):(m=xa(f.type,f.key,f.props,null,d.mode,m),m.ref=Xt(d,s,f),m.return=d,d=m)}return o(d);case qn:e:{for(C=f.key;s!==null;){if(s.key===C)if(s.tag===4&&s.stateNode.containerInfo===f.containerInfo&&s.stateNode.implementation===f.implementation){t(d,s.sibling),s=a(s,f.children||[]),s.return=d,d=s;break e}else{t(d,s);break}else n(d,s);s=s.sibling}s=Ho(f,d.mode,m),s.return=d,d=s}return o(d);case un:return C=f._init,F(d,s,C(f._payload),m)}if(Et(f))return S(d,s,f,m);if(St(f))return k(d,s,f,m);Zr(d,f)}return typeof f=="string"&&f!==""||typeof f=="number"?(f=""+f,s!==null&&s.tag===6?(t(d,s.sibling),s=a(s,f),s.return=d,d=s):(t(d,s),s=Wo(f,d.mode,m),s.return=d,d=s),o(d)):t(d,s)}return F}var ft=Zu(!0),Ju=Zu(!1),Jr=yn(null),ea=null,dt=null,eo=null;function no(){eo=dt=ea=null}function to(e){var n=Jr.current;V(Jr),e._currentValue=n}function ro(e,n,t){for(;e!==null;){var r=e.alternate;if((e.childLanes&n)!==n?(e.childLanes|=n,r!==null&&(r.childLanes|=n)):r!==null&&(r.childLanes&n)!==n&&(r.childLanes|=n),e===t)break;e=e.return}}function pt(e,n){ea=e,eo=dt=null,e=e.dependencies,e!==null&&e.firstContext!==null&&(e.lanes&n&&(we=!0),e.firstContext=null)}function ze(e){var n=e._currentValue;if(eo!==e)if(e={context:e,memoizedValue:n,next:null},dt===null){if(ea===null)throw Error(w(308));dt=e,ea.dependencies={lanes:0,firstContext:e}}else dt=dt.next=e;return n}var In=null;function ao(e){In===null?In=[e]:In.push(e)}function es(e,n,t,r){var a=n.interleaved;return a===null?(t.next=t,ao(n)):(t.next=a.next,a.next=t),n.interleaved=t,tn(e,r)}function tn(e,n){e.lanes|=n;var t=e.alternate;for(t!==null&&(t.lanes|=n),t=e,e=e.return;e!==null;)e.childLanes|=n,t=e.alternate,t!==null&&(t.childLanes|=n),t=e,e=e.return;return t.tag===3?t.stateNode:null}var wn=!1;function lo(e){e.updateQueue={baseState:e.memoizedState,firstBaseUpdate:null,lastBaseUpdate:null,shared:{pending:null,interleaved:null,lanes:0},effects:null}}function ns(e,n){e=e.updateQueue,n.updateQueue===e&&(n.updateQueue={baseState:e.baseState,firstBaseUpdate:e.firstBaseUpdate,lastBaseUpdate:e.lastBaseUpdate,shared:e.shared,effects:e.effects})}function rn(e,n){return{eventTime:e,lane:n,tag:0,payload:null,callback:null,next:null}}function kn(e,n,t){var r=e.updateQueue;if(r===null)return null;if(r=r.shared,I&2){var a=r.pending;return a===null?n.next=n:(n.next=a.next,a.next=n),r.pending=n,tn(e,t)}return a=r.interleaved,a===null?(n.next=n,ao(r)):(n.next=a.next,a.next=n),r.interleaved=n,tn(e,t)}function na(e,n,t){if(n=n.updateQueue,n!==null&&(n=n.shared,(t&4194240)!==0)){var r=n.lanes;r&=e.pendingLanes,t|=r,n.lanes=t,vl(e,t)}}function ts(e,n){var t=e.updateQueue,r=e.alternate;if(r!==null&&(r=r.updateQueue,t===r)){var a=null,l=null;if(t=t.firstBaseUpdate,t!==null){do{var o={eventTime:t.eventTime,lane:t.lane,tag:t.tag,payload:t.payload,callback:t.callback,next:null};l===null?a=l=o:l=l.next=o,t=t.next}while(t!==null);l===null?a=l=n:l=l.next=n}else a=l=n;t={baseState:r.baseState,firstBaseUpdate:a,lastBaseUpdate:l,shared:r.shared,effects:r.effects},e.updateQueue=t;return}e=t.lastBaseUpdate,e===null?t.firstBaseUpdate=n:e.next=n,t.lastBaseUpdate=n}function ta(e,n,t,r){var a=e.updateQueue;wn=!1;var l=a.firstBaseUpdate,o=a.lastBaseUpdate,i=a.shared.pending;if(i!==null){a.shared.pending=null;var u=i,c=u.next;u.next=null,o===null?l=c:o.next=c,o=u;var h=e.alternate;h!==null&&(h=h.updateQueue,i=h.lastBaseUpdate,i!==o&&(i===null?h.firstBaseUpdate=c:i.next=c,h.lastBaseUpdate=u))}if(l!==null){var g=a.baseState;o=0,h=c=u=null,i=l;do{var p=i.lane,x=i.eventTime;if((r&p)===p){h!==null&&(h=h.next={eventTime:x,lane:0,tag:i.tag,payload:i.payload,callback:i.callback,next:null});e:{var S=e,k=i;switch(p=n,x=t,k.tag){case 1:if(S=k.payload,typeof S=="function"){g=S.call(x,g,p);break e}g=S;break e;case 3:S.flags=S.flags&-65537|128;case 0:if(S=k.payload,p=typeof S=="function"?S.call(x,g,p):S,p==null)break e;g=Q({},g,p);break e;case 2:wn=!0}}i.callback!==null&&i.lane!==0&&(e.flags|=64,p=a.effects,p===null?a.effects=[i]:p.push(i))}else x={eventTime:x,lane:p,tag:i.tag,payload:i.payload,callback:i.callback,next:null},h===null?(c=h=x,u=g):h=h.next=x,o|=p;if(i=i.next,i===null){if(i=a.shared.pending,i===null)break;p=i,i=p.next,p.next=null,a.lastBaseUpdate=p,a.shared.pending=null}}while(!0);if(h===null&&(u=g),a.baseState=u,a.firstBaseUpdate=c,a.lastBaseUpdate=h,n=a.shared.interleaved,n!==null){a=n;do o|=a.lane,a=a.next;while(a!==n)}else l===null&&(a.shared.lanes=0);Dn|=o,e.lanes=o,e.memoizedState=g}}function rs(e,n,t){if(e=n.effects,n.effects=null,e!==null)for(n=0;nt?t:4,e(!0);var r=co.transition;co.transition={};try{e(!1),n()}finally{U=t,co.transition=r}}function xs(){return Me().memoizedState}function Td(e,n,t){var r=Cn(e);if(t={lane:r,action:t,hasEagerState:!1,eagerState:null,next:null},_s(e))Ss(n,t);else if(t=es(e,n,t,r),t!==null){var a=me();Be(t,e,r,a),Cs(t,n,r)}}function Ld(e,n,t){var r=Cn(e),a={lane:r,action:t,hasEagerState:!1,eagerState:null,next:null};if(_s(e))Ss(n,a);else{var l=e.alternate;if(e.lanes===0&&(l===null||l.lanes===0)&&(l=n.lastRenderedReducer,l!==null))try{var o=n.lastRenderedState,i=l(o,t);if(a.hasEagerState=!0,a.eagerState=i,Oe(i,o)){var u=n.interleaved;u===null?(a.next=a,ao(n)):(a.next=u.next,u.next=a),n.interleaved=a;return}}catch{}finally{}t=es(e,n,a,r),t!==null&&(a=me(),Be(t,e,r,a),Cs(t,n,r))}}function _s(e){var n=e.alternate;return e===K||n!==null&&n===K}function Ss(e,n){nr=la=!0;var t=e.pending;t===null?n.next=n:(n.next=t.next,t.next=n),e.pending=n}function Cs(e,n,t){if(t&4194240){var r=n.lanes;r&=e.pendingLanes,t|=r,n.lanes=t,vl(e,t)}}var ua={readContext:ze,useCallback:ce,useContext:ce,useEffect:ce,useImperativeHandle:ce,useInsertionEffect:ce,useLayoutEffect:ce,useMemo:ce,useReducer:ce,useRef:ce,useState:ce,useDebugValue:ce,useDeferredValue:ce,useTransition:ce,useMutableSource:ce,useSyncExternalStore:ce,useId:ce,unstable_isNewReconciler:!1},jd={readContext:ze,useCallback:function(e,n){return Qe().memoizedState=[e,n===void 0?null:n],e},useContext:ze,useEffect:hs,useImperativeHandle:function(e,n,t){return t=t!=null?t.concat([e]):null,oa(4194308,4,ys.bind(null,n,e),t)},useLayoutEffect:function(e,n){return oa(4194308,4,e,n)},useInsertionEffect:function(e,n){return oa(4,2,e,n)},useMemo:function(e,n){var t=Qe();return n=n===void 0?null:n,e=e(),t.memoizedState=[e,n],e},useReducer:function(e,n,t){var r=Qe();return n=t!==void 0?t(n):n,r.memoizedState=r.baseState=n,e={pending:null,interleaved:null,lanes:0,dispatch:null,lastRenderedReducer:e,lastRenderedState:n},r.queue=e,e=e.dispatch=Td.bind(null,K,e),[r.memoizedState,e]},useRef:function(e){var n=Qe();return e={current:e},n.memoizedState=e},useState:ds,useDebugValue:bo,useDeferredValue:function(e){return Qe().memoizedState=e},useTransition:function(){var e=ds(!1),n=e[0];return e=Pd.bind(null,e[1]),Qe().memoizedState=e,[n,e]},useMutableSource:function(){},useSyncExternalStore:function(e,n,t){var r=K,a=Qe();if(W){if(t===void 0)throw Error(w(407));t=t()}else{if(t=n(),ae===null)throw Error(w(349));On&30||is(r,n,t)}a.memoizedState=t;var l={value:t,getSnapshot:n};return a.queue=l,hs(ss.bind(null,r,l,e),[e]),r.flags|=2048,ar(9,us.bind(null,r,l,t,n),void 0,null),t},useId:function(){var e=Qe(),n=ae.identifierPrefix;if(W){var t=nn,r=en;t=(r&~(1<<32-Fe(r)-1)).toString(32)+t,n=":"+n+"R"+t,t=tr++,0<\/script>",e=e.removeChild(e.firstChild)):typeof r.is=="string"?e=o.createElement(t,{is:r.is}):(e=o.createElement(t),t==="select"&&(o=e,r.multiple?o.multiple=!0:r.size&&(o.size=r.size))):e=o.createElementNS(e,t),e[We]=n,e[Yt]=r,Hs(e,n,!1,!1),n.stateNode=e;e:{switch(o=sl(t,r),t){case"dialog":B("cancel",e),B("close",e),a=r;break;case"iframe":case"object":case"embed":B("load",e),a=r;break;case"video":case"audio":for(a=0;abt&&(n.flags|=128,r=!0,lr(l,!1),n.lanes=4194304)}else{if(!r)if(e=ra(o),e!==null){if(n.flags|=128,r=!0,t=e.updateQueue,t!==null&&(n.updateQueue=t,n.flags|=4),lr(l,!0),l.tail===null&&l.tailMode==="hidden"&&!o.alternate&&!W)return fe(n),null}else 2*X()-l.renderingStartTime>bt&&t!==1073741824&&(n.flags|=128,r=!0,lr(l,!1),n.lanes=4194304);l.isBackwards?(o.sibling=n.child,n.child=o):(t=l.last,t!==null?t.sibling=o:n.child=o,l.last=o)}return l.tail!==null?(n=l.tail,l.rendering=n,l.tail=n.sibling,l.renderingStartTime=X(),n.sibling=null,t=q.current,A(q,r?t&1|2:t&1),n):(fe(n),null);case 22:case 23:return $o(),r=n.memoizedState!==null,e!==null&&e.memoizedState!==null!==r&&(n.flags|=8192),r&&n.mode&1?Te&1073741824&&(fe(n),n.subtreeFlags&6&&(n.flags|=8192)):fe(n),null;case 24:return null;case 25:return null}throw Error(w(156,n.tag))}function Ud(e,n){switch(Gl(n),n.tag){case 1:return ve(n.type)&&Qr(),e=n.flags,e&65536?(n.flags=e&-65537|128,n):null;case 3:return ht(),V(be),V(se),so(),e=n.flags,e&65536&&!(e&128)?(n.flags=e&-65537|128,n):null;case 5:return io(n),null;case 13:if(V(q),e=n.memoizedState,e!==null&&e.dehydrated!==null){if(n.alternate===null)throw Error(w(340));ct()}return e=n.flags,e&65536?(n.flags=e&-65537|128,n):null;case 19:return V(q),null;case 4:return ht(),null;case 10:return to(n.type._context),null;case 22:case 23:return $o(),null;case 24:return null;default:return null}}var da=!1,de=!1,Ad=typeof WeakSet=="function"?WeakSet:Set,P=null;function mt(e,n){var t=e.ref;if(t!==null)if(typeof t=="function")try{t(null)}catch(r){G(e,n,r)}else t.current=null}function Ks(e,n,t){try{t()}catch(r){G(e,n,r)}}var Ys=!1;function $d(e,n){if($l=zr,e=Eu(),Ml(e)){if("selectionStart"in e)var t={start:e.selectionStart,end:e.selectionEnd};else e:{t=(t=e.ownerDocument)&&t.defaultView||window;var r=t.getSelection&&t.getSelection();if(r&&r.rangeCount!==0){t=r.anchorNode;var a=r.anchorOffset,l=r.focusNode;r=r.focusOffset;try{t.nodeType,l.nodeType}catch{t=null;break e}var o=0,i=-1,u=-1,c=0,h=0,g=e,p=null;n:for(;;){for(var x;g!==t||a!==0&&g.nodeType!==3||(i=o+a),g!==l||r!==0&&g.nodeType!==3||(u=o+r),g.nodeType===3&&(o+=g.nodeValue.length),(x=g.firstChild)!==null;)p=g,g=x;for(;;){if(g===e)break n;if(p===t&&++c===a&&(i=o),p===l&&++h===r&&(u=o),(x=g.nextSibling)!==null)break;g=p,p=g.parentNode}g=x}t=i===-1||u===-1?null:{start:i,end:u}}else t=null}t=t||{start:0,end:0}}else t=null;for(Bl={focusedElem:e,selectionRange:t},zr=!1,P=n;P!==null;)if(n=P,e=n.child,(n.subtreeFlags&1028)!==0&&e!==null)e.return=n,P=e;else for(;P!==null;){n=P;try{var S=n.alternate;if(n.flags&1024)switch(n.tag){case 0:case 11:case 15:break;case 1:if(S!==null){var k=S.memoizedProps,F=S.memoizedState,d=n.stateNode,s=d.getSnapshotBeforeUpdate(n.elementType===n.type?k:Ue(n.type,k),F);d.__reactInternalSnapshotBeforeUpdate=s}break;case 3:var f=n.stateNode.containerInfo;f.nodeType===1?f.textContent="":f.nodeType===9&&f.documentElement&&f.removeChild(f.documentElement);break;case 5:case 6:case 4:case 17:break;default:throw Error(w(163))}}catch(m){G(n,n.return,m)}if(e=n.sibling,e!==null){e.return=n.return,P=e;break}P=n.return}return S=Ys,Ys=!1,S}function or(e,n,t){var r=n.updateQueue;if(r=r!==null?r.lastEffect:null,r!==null){var a=r=r.next;do{if((a.tag&e)===e){var l=a.destroy;a.destroy=void 0,l!==void 0&&Ks(n,t,l)}a=a.next}while(a!==r)}}function pa(e,n){if(n=n.updateQueue,n=n!==null?n.lastEffect:null,n!==null){var t=n=n.next;do{if((t.tag&e)===e){var r=t.create;t.destroy=r()}t=t.next}while(t!==n)}}function Lo(e){var n=e.ref;if(n!==null){var t=e.stateNode;switch(e.tag){case 5:e=t;break;default:e=t}typeof n=="function"?n(e):n.current=e}}function Gs(e){var n=e.alternate;n!==null&&(e.alternate=null,Gs(n)),e.child=null,e.deletions=null,e.sibling=null,e.tag===5&&(n=e.stateNode,n!==null&&(delete n[We],delete n[Yt],delete n[Ql],delete n[_d],delete n[Sd])),e.stateNode=null,e.return=null,e.dependencies=null,e.memoizedProps=null,e.memoizedState=null,e.pendingProps=null,e.stateNode=null,e.updateQueue=null}function Xs(e){return e.tag===5||e.tag===3||e.tag===4}function Zs(e){e:for(;;){for(;e.sibling===null;){if(e.return===null||Xs(e.return))return null;e=e.return}for(e.sibling.return=e.return,e=e.sibling;e.tag!==5&&e.tag!==6&&e.tag!==18;){if(e.flags&2||e.child===null||e.tag===4)continue e;e.child.return=e,e=e.child}if(!(e.flags&2))return e.stateNode}}function jo(e,n,t){var r=e.tag;if(r===5||r===6)e=e.stateNode,n?t.nodeType===8?t.parentNode.insertBefore(e,n):t.insertBefore(e,n):(t.nodeType===8?(n=t.parentNode,n.insertBefore(e,t)):(n=t,n.appendChild(e)),t=t._reactRootContainer,t!=null||n.onclick!==null||(n.onclick=Wr));else if(r!==4&&(e=e.child,e!==null))for(jo(e,n,t),e=e.sibling;e!==null;)jo(e,n,t),e=e.sibling}function zo(e,n,t){var r=e.tag;if(r===5||r===6)e=e.stateNode,n?t.insertBefore(e,n):t.appendChild(e);else if(r!==4&&(e=e.child,e!==null))for(zo(e,n,t),e=e.sibling;e!==null;)zo(e,n,t),e=e.sibling}var ie=null,Ae=!1;function xn(e,n,t){for(t=t.child;t!==null;)Js(e,n,t),t=t.sibling}function Js(e,n,t){if(Ve&&typeof Ve.onCommitFiberUnmount=="function")try{Ve.onCommitFiberUnmount(Er,t)}catch{}switch(t.tag){case 5:de||mt(t,n);case 6:var r=ie,a=Ae;ie=null,xn(e,n,t),ie=r,Ae=a,ie!==null&&(Ae?(e=ie,t=t.stateNode,e.nodeType===8?e.parentNode.removeChild(t):e.removeChild(t)):ie.removeChild(t.stateNode));break;case 18:ie!==null&&(Ae?(e=ie,t=t.stateNode,e.nodeType===8?Hl(e.parentNode,t):e.nodeType===1&&Hl(e,t),Dt(e)):Hl(ie,t.stateNode));break;case 4:r=ie,a=Ae,ie=t.stateNode.containerInfo,Ae=!0,xn(e,n,t),ie=r,Ae=a;break;case 0:case 11:case 14:case 15:if(!de&&(r=t.updateQueue,r!==null&&(r=r.lastEffect,r!==null))){a=r=r.next;do{var l=a,o=l.destroy;l=l.tag,o!==void 0&&(l&2||l&4)&&Ks(t,n,o),a=a.next}while(a!==r)}xn(e,n,t);break;case 1:if(!de&&(mt(t,n),r=t.stateNode,typeof r.componentWillUnmount=="function"))try{r.props=t.memoizedProps,r.state=t.memoizedState,r.componentWillUnmount()}catch(i){G(t,n,i)}xn(e,n,t);break;case 21:xn(e,n,t);break;case 22:t.mode&1?(de=(r=de)||t.memoizedState!==null,xn(e,n,t),de=r):xn(e,n,t);break;default:xn(e,n,t)}}function ec(e){var n=e.updateQueue;if(n!==null){e.updateQueue=null;var t=e.stateNode;t===null&&(t=e.stateNode=new Ad),n.forEach(function(r){var a=Gd.bind(null,e,r);t.has(r)||(t.add(r),r.then(a,a))})}}function $e(e,n){var t=n.deletions;if(t!==null)for(var r=0;ra&&(a=o),r&=~l}if(r=a,r=X()-r,r=(120>r?120:480>r?480:1080>r?1080:1920>r?1920:3e3>r?3e3:4320>r?4320:1960*Vd(r/1960))-r,10e?16:e,Sn===null)var r=!1;else{if(e=Sn,Sn=null,ba=0,I&6)throw Error(w(331));var a=I;for(I|=4,P=e.current;P!==null;){var l=P,o=l.child;if(P.flags&16){var i=l.deletions;if(i!==null){for(var u=0;uX()-Io?An(e,0):Ro|=t),xe(e,n)}function pc(e,n){n===0&&(e.mode&1?(n=Pr,Pr<<=1,!(Pr&130023424)&&(Pr=4194304)):n=1);var t=me();e=tn(e,n),e!==null&&(Mt(e,n,t),xe(e,t))}function Yd(e){var n=e.memoizedState,t=0;n!==null&&(t=n.retryLane),pc(e,t)}function Gd(e,n){var t=0;switch(e.tag){case 13:var r=e.stateNode,a=e.memoizedState;a!==null&&(t=a.retryLane);break;case 19:r=e.stateNode;break;default:throw Error(w(314))}r!==null&&r.delete(n),pc(e,t)}var hc;hc=function(e,n,t){if(e!==null)if(e.memoizedProps!==n.pendingProps||be.current)we=!0;else{if(!(e.lanes&t)&&!(n.flags&128))return we=!1,Od(e,n,t);we=!!(e.flags&131072)}else we=!1,W&&n.flags&1048576&&Qu(n,Gr,n.index);switch(n.lanes=0,n.tag){case 2:var r=n.type;fa(e,n),e=n.pendingProps;var a=it(n,se.current);pt(n,t),a=po(null,n,r,e,a,t);var l=ho();return n.flags|=1,typeof a=="object"&&a!==null&&typeof a.render=="function"&&a.$$typeof===void 0?(n.tag=1,n.memoizedState=null,n.updateQueue=null,ve(r)?(l=!0,qr(n)):l=!1,n.memoizedState=a.state!==null&&a.state!==void 0?a.state:null,lo(n),a.updater=sa,n.stateNode=a,a._reactInternals=n,wo(n,r,e,t),n=So(null,n,r,!0,l,t)):(n.tag=0,W&&l&&Yl(n),ge(null,n,a,t),n=n.child),n;case 16:r=n.elementType;e:{switch(fa(e,n),e=n.pendingProps,a=r._init,r=a(r._payload),n.type=r,a=n.tag=Zd(r),e=Ue(r,e),a){case 0:n=_o(null,n,r,e,t);break e;case 1:n=Us(null,n,r,e,t);break e;case 11:n=Rs(null,n,r,e,t);break e;case 14:n=Is(null,n,r,Ue(r.type,e),t);break e}throw Error(w(306,r,""))}return n;case 0:return r=n.type,a=n.pendingProps,a=n.elementType===r?a:Ue(r,a),_o(e,n,r,a,t);case 1:return r=n.type,a=n.pendingProps,a=n.elementType===r?a:Ue(r,a),Us(e,n,r,a,t);case 3:e:{if(As(n),e===null)throw Error(w(387));r=n.pendingProps,l=n.memoizedState,a=l.element,ns(e,n),ta(n,r,null,t);var o=n.memoizedState;if(r=o.element,l.isDehydrated)if(l={element:r,isDehydrated:!1,cache:o.cache,pendingSuspenseBoundaries:o.pendingSuspenseBoundaries,transitions:o.transitions},n.updateQueue.baseState=l,n.memoizedState=l,n.flags&256){a=gt(Error(w(423)),n),n=$s(e,n,r,t,a);break e}else if(r!==a){a=gt(Error(w(424)),n),n=$s(e,n,r,t,a);break e}else for(Pe=mn(n.stateNode.containerInfo.firstChild),Ne=n,W=!0,De=null,t=Ju(n,null,r,t),n.child=t;t;)t.flags=t.flags&-3|4096,t=t.sibling;else{if(ct(),r===a){n=an(e,n,t);break e}ge(e,n,r,t)}n=n.child}return n;case 5:return as(n),e===null&&Zl(n),r=n.type,a=n.pendingProps,l=e!==null?e.memoizedProps:null,o=a.children,Vl(r,a)?o=null:l!==null&&Vl(r,l)&&(n.flags|=32),Ds(e,n),ge(e,n,o,t),n.child;case 6:return e===null&&Zl(n),null;case 13:return Bs(e,n,t);case 4:return oo(n,n.stateNode.containerInfo),r=n.pendingProps,e===null?n.child=ft(n,null,r,t):ge(e,n,r,t),n.child;case 11:return r=n.type,a=n.pendingProps,a=n.elementType===r?a:Ue(r,a),Rs(e,n,r,a,t);case 7:return ge(e,n,n.pendingProps,t),n.child;case 8:return ge(e,n,n.pendingProps.children,t),n.child;case 12:return ge(e,n,n.pendingProps.children,t),n.child;case 10:e:{if(r=n.type._context,a=n.pendingProps,l=n.memoizedProps,o=a.value,A(Jr,r._currentValue),r._currentValue=o,l!==null)if(Oe(l.value,o)){if(l.children===a.children&&!be.current){n=an(e,n,t);break e}}else for(l=n.child,l!==null&&(l.return=n);l!==null;){var i=l.dependencies;if(i!==null){o=l.child;for(var u=i.firstContext;u!==null;){if(u.context===r){if(l.tag===1){u=rn(-1,t&-t),u.tag=2;var c=l.updateQueue;if(c!==null){c=c.shared;var h=c.pending;h===null?u.next=u:(u.next=h.next,h.next=u),c.pending=u}}l.lanes|=t,u=l.alternate,u!==null&&(u.lanes|=t),ro(l.return,t,n),i.lanes|=t;break}u=u.next}}else if(l.tag===10)o=l.type===n.type?null:l.child;else if(l.tag===18){if(o=l.return,o===null)throw Error(w(341));o.lanes|=t,i=o.alternate,i!==null&&(i.lanes|=t),ro(o,t,n),o=l.sibling}else o=l.child;if(o!==null)o.return=l;else for(o=l;o!==null;){if(o===n){o=null;break}if(l=o.sibling,l!==null){l.return=o.return,o=l;break}o=o.return}l=o}ge(e,n,a.children,t),n=n.child}return n;case 9:return a=n.type,r=n.pendingProps.children,pt(n,t),a=ze(a),r=r(a),n.flags|=1,ge(e,n,r,t),n.child;case 14:return r=n.type,a=Ue(r,n.pendingProps),a=Ue(r.type,a),Is(e,n,r,a,t);case 15:return Fs(e,n,n.type,n.pendingProps,t);case 17:return r=n.type,a=n.pendingProps,a=n.elementType===r?a:Ue(r,a),fa(e,n),n.tag=1,ve(r)?(e=!0,qr(n)):e=!1,pt(n,t),Ns(n,r,a),wo(n,r,a,t),So(null,n,r,!0,e,t);case 19:return Ws(e,n,t);case 22:return Os(e,n,t)}throw Error(w(156,n.tag))};function gc(e,n){return qi(e,n)}function Xd(e,n,t,r){this.tag=e,this.key=t,this.sibling=this.child=this.return=this.stateNode=this.type=this.elementType=null,this.index=0,this.ref=null,this.pendingProps=n,this.dependencies=this.memoizedState=this.updateQueue=this.memoizedProps=null,this.mode=r,this.subtreeFlags=this.flags=0,this.deletions=null,this.childLanes=this.lanes=0,this.alternate=null}function Ie(e,n,t,r){return new Xd(e,n,t,r)}function Vo(e){return e=e.prototype,!(!e||!e.isReactComponent)}function Zd(e){if(typeof e=="function")return Vo(e)?1:0;if(e!=null){if(e=e.$$typeof,e===Ya)return 11;if(e===Za)return 14}return 2}function Nn(e,n){var t=e.alternate;return t===null?(t=Ie(e.tag,n,e.key,e.mode),t.elementType=e.elementType,t.type=e.type,t.stateNode=e.stateNode,t.alternate=e,e.alternate=t):(t.pendingProps=n,t.type=e.type,t.flags=0,t.subtreeFlags=0,t.deletions=null),t.flags=e.flags&14680064,t.childLanes=e.childLanes,t.lanes=e.lanes,t.child=e.child,t.memoizedProps=e.memoizedProps,t.memoizedState=e.memoizedState,t.updateQueue=e.updateQueue,n=e.dependencies,t.dependencies=n===null?null:{lanes:n.lanes,firstContext:n.firstContext},t.sibling=e.sibling,t.index=e.index,t.ref=e.ref,t}function xa(e,n,t,r,a,l){var o=2;if(r=e,typeof e=="function")Vo(e)&&(o=1);else if(typeof e=="string")o=5;else e:switch(e){case Kn:return Bn(t.children,a,l,n);case qa:o=8,a|=8;break;case Ka:return e=Ie(12,t,n,a|2),e.elementType=Ka,e.lanes=l,e;case Ga:return e=Ie(13,t,n,a),e.elementType=Ga,e.lanes=l,e;case Xa:return e=Ie(19,t,n,a),e.elementType=Xa,e.lanes=l,e;case _i:return _a(t,a,l,n);default:if(typeof e=="object"&&e!==null)switch(e.$$typeof){case ki:o=10;break e;case xi:o=9;break e;case Ya:o=11;break e;case Za:o=14;break e;case un:o=16,r=null;break e}throw Error(w(130,e==null?e:typeof e,""))}return n=Ie(o,t,n,a),n.elementType=e,n.type=r,n.lanes=l,n}function Bn(e,n,t,r){return e=Ie(7,e,r,n),e.lanes=t,e}function _a(e,n,t,r){return e=Ie(22,e,r,n),e.elementType=_i,e.lanes=t,e.stateNode={isHidden:!1},e}function Wo(e,n,t){return e=Ie(6,e,null,n),e.lanes=t,e}function Ho(e,n,t){return n=Ie(4,e.children!==null?e.children:[],e.key,n),n.lanes=t,n.stateNode={containerInfo:e.containerInfo,pendingChildren:null,implementation:e.implementation},n}function Jd(e,n,t,r,a){this.tag=n,this.containerInfo=e,this.finishedWork=this.pingCache=this.current=this.pendingChildren=null,this.timeoutHandle=-1,this.callbackNode=this.pendingContext=this.context=null,this.callbackPriority=0,this.eventTimes=bl(0),this.expirationTimes=bl(-1),this.entangledLanes=this.finishedLanes=this.mutableReadLanes=this.expiredLanes=this.pingedLanes=this.suspendedLanes=this.pendingLanes=0,this.entanglements=bl(0),this.identifierPrefix=r,this.onRecoverableError=a,this.mutableSourceEagerHydrationData=null}function Qo(e,n,t,r,a,l,o,i,u){return e=new Jd(e,n,t,i,u),n===1?(n=1,l===!0&&(n|=8)):n=0,l=Ie(3,null,null,n),e.current=l,l.stateNode=e,l.memoizedState={element:r,isDehydrated:t,cache:null,transitions:null,pendingSuspenseBoundaries:null},lo(l),e}function ep(e,n,t){var r=3"u"||typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE!="function"))try{__REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE(kc)}catch(e){console.error(e)}}kc(),gi.exports=Se;var lp=gi.exports,xc,_c=lp;xc=_c.createRoot,_c.hydrateRoot;var op={xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};const ip=e=>e.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase().trim(),ee=(e,n)=>{const t=L.forwardRef(({color:r="currentColor",size:a=24,strokeWidth:l=2,absoluteStrokeWidth:o,className:i="",children:u,...c},h)=>L.createElement("svg",{ref:h,...op,width:a,height:a,stroke:r,strokeWidth:o?Number(l)*24/Number(a):l,className:["lucide",`lucide-${ip(e)}`,i].join(" "),...c},[...n.map(([g,p])=>L.createElement(g,p)),...Array.isArray(u)?u:[u]]));return t.displayName=`${e}`,t},up=ee("ChevronDown",[["path",{d:"m6 9 6 6 6-6",key:"qrunsl"}]]),sp=ee("ChevronUp",[["path",{d:"m18 15-6-6-6 6",key:"153udz"}]]),cp=ee("Circle",[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}]]),Sc=ee("Download",[["path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4",key:"ih7n3h"}],["polyline",{points:"7 10 12 15 17 10",key:"2ggqvy"}],["line",{x1:"12",x2:"12",y1:"15",y2:"3",key:"1vk2je"}]]),fp=ee("Eraser",[["path",{d:"m7 21-4.3-4.3c-1-1-1-2.5 0-3.4l9.6-9.6c1-1 2.5-1 3.4 0l5.6 5.6c1 1 1 2.5 0 3.4L13 21",key:"182aya"}],["path",{d:"M22 21H7",key:"t4ddhn"}],["path",{d:"m5 11 9 9",key:"1mo9qw"}]]),dp=ee("Image",[["rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",ry:"2",key:"1m3agn"}],["circle",{cx:"9",cy:"9",r:"2",key:"af1f0g"}],["path",{d:"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21",key:"1xmnt7"}]]),pp=ee("Loader",[["line",{x1:"12",x2:"12",y1:"2",y2:"6",key:"gza1u7"}],["line",{x1:"12",x2:"12",y1:"18",y2:"22",key:"1qhbu9"}],["line",{x1:"4.93",x2:"7.76",y1:"4.93",y2:"7.76",key:"xae44r"}],["line",{x1:"16.24",x2:"19.07",y1:"16.24",y2:"19.07",key:"bxnmvf"}],["line",{x1:"2",x2:"6",y1:"12",y2:"12",key:"89khin"}],["line",{x1:"18",x2:"22",y1:"12",y2:"12",key:"pb8tfm"}],["line",{x1:"4.93",x2:"7.76",y1:"19.07",y2:"16.24",key:"1uxjnu"}],["line",{x1:"16.24",x2:"19.07",y1:"7.76",y2:"4.93",key:"6duxfx"}]]),hp=ee("Minus",[["path",{d:"M5 12h14",key:"1ays0h"}]]),gp=ee("Moon",[["path",{d:"M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z",key:"a7tn18"}]]),mp=ee("MousePointer",[["path",{d:"m3 3 7.07 16.97 2.51-7.39 7.39-2.51L3 3z",key:"y2ucgo"}],["path",{d:"m13 13 6 6",key:"1nhxnf"}]]),yp=ee("Palette",[["circle",{cx:"13.5",cy:"6.5",r:".5",fill:"currentColor",key:"1okk4w"}],["circle",{cx:"17.5",cy:"10.5",r:".5",fill:"currentColor",key:"f64h9f"}],["circle",{cx:"8.5",cy:"7.5",r:".5",fill:"currentColor",key:"fotxhn"}],["circle",{cx:"6.5",cy:"12.5",r:".5",fill:"currentColor",key:"qy21gx"}],["path",{d:"M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z",key:"12rzf8"}]]),bp=ee("Pause",[["rect",{width:"4",height:"16",x:"6",y:"4",key:"iffhe4"}],["rect",{width:"4",height:"16",x:"14",y:"4",key:"sjin7j"}]]),vp=ee("Play",[["polygon",{points:"5 3 19 12 5 21 5 3",key:"191637"}]]),wp=ee("Settings2",[["path",{d:"M20 7h-9",key:"3s1dr2"}],["path",{d:"M14 17H5",key:"gfn3mx"}],["circle",{cx:"17",cy:"17",r:"3",key:"18b49y"}],["circle",{cx:"7",cy:"7",r:"3",key:"dfmy0x"}]]),kp=ee("Sliders",[["line",{x1:"4",x2:"4",y1:"21",y2:"14",key:"1p332r"}],["line",{x1:"4",x2:"4",y1:"10",y2:"3",key:"gb41h5"}],["line",{x1:"12",x2:"12",y1:"21",y2:"12",key:"hf2csr"}],["line",{x1:"12",x2:"12",y1:"8",y2:"3",key:"1kfi7u"}],["line",{x1:"20",x2:"20",y1:"21",y2:"16",key:"1lhrwl"}],["line",{x1:"20",x2:"20",y1:"12",y2:"3",key:"16vvfq"}],["line",{x1:"2",x2:"6",y1:"14",y2:"14",key:"1uebub"}],["line",{x1:"10",x2:"14",y1:"8",y2:"8",key:"1yglbp"}],["line",{x1:"18",x2:"22",y1:"16",y2:"16",key:"1jxqpz"}]]),xp=ee("Square",[["rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",key:"afitv7"}]]),_p=ee("Sun",[["circle",{cx:"12",cy:"12",r:"4",key:"4exip2"}],["path",{d:"M12 2v2",key:"tus03m"}],["path",{d:"M12 20v2",key:"1lh1kg"}],["path",{d:"m4.93 4.93 1.41 1.41",key:"149t6j"}],["path",{d:"m17.66 17.66 1.41 1.41",key:"ptbguv"}],["path",{d:"M2 12h2",key:"1t8f8n"}],["path",{d:"M20 12h2",key:"1q8mjw"}],["path",{d:"m6.34 17.66-1.41 1.41",key:"1m8zz5"}],["path",{d:"m19.07 4.93-1.41 1.41",key:"1shlcs"}]]),Sp=ee("Trash2",[["path",{d:"M3 6h18",key:"d0wm0j"}],["path",{d:"M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6",key:"4alrt4"}],["path",{d:"M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2",key:"v07s0e"}],["line",{x1:"10",x2:"10",y1:"11",y2:"17",key:"1uufr5"}],["line",{x1:"14",x2:"14",y1:"11",y2:"17",key:"xtxkd"}]]),Cp=ee("Upload",[["path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4",key:"ih7n3h"}],["polyline",{points:"17 8 12 3 7 8",key:"t8dd8p"}],["line",{x1:"12",x2:"12",y1:"3",y2:"15",key:"widbto"}]]),Ep=ee("Wand2",[["path",{d:"m21.64 3.64-1.28-1.28a1.21 1.21 0 0 0-1.72 0L2.36 18.64a1.21 1.21 0 0 0 0 1.72l1.28 1.28a1.2 1.2 0 0 0 1.72 0L21.64 5.36a1.2 1.2 0 0 0 0-1.72Z",key:"1bcowg"}],["path",{d:"m14 7 3 3",key:"1r5n42"}],["path",{d:"M5 6v4",key:"ilb8ba"}],["path",{d:"M19 14v4",key:"blhpug"}],["path",{d:"M10 2v2",key:"7u0qdc"}],["path",{d:"M7 8H3",key:"zfb6yr"}],["path",{d:"M21 16h-4",key:"1cnmox"}],["path",{d:"M11 3H9",key:"1obp7u"}]]);var _e=(e=>(e.Single="single",e.Line="line",e.Box="box",e.Circle="circle",e.Eraser="eraser",e))(_e||{});const Np="/strandify/assets/strandify_wasm_bg-D-IVqsEt.wasm",Pp=async(e={},n)=>{let t;if(n.startsWith("data:")){const r=n.replace(/^data:.*?base64,/,"");let a;if(typeof Buffer=="function"&&typeof Buffer.from=="function")a=Buffer.from(r,"base64");else if(typeof atob=="function"){const l=atob(r);a=new Uint8Array(l.length);for(let o=0;o"u"?(0,module.require)("util").TextDecoder:TextDecoder;let Cc=new Lp("utf-8",{ignoreBOM:!0,fatal:!0});Cc.decode();let La=null;function ja(){return(La===null||La.byteLength===0)&&(La=new Uint8Array(O.memory.buffer)),La}function za(e,n){return e=e>>>0,Cc.decode(ja().subarray(e,e+n))}const on=new Array(128).fill(void 0);on.push(void 0,null,!0,!1);let fr=on.length;function H(e){fr===on.length&&on.push(on.length+1);const n=fr;return fr=on[n],on[n]=e,n}function D(e){return on[e]}function jp(e){e<132||(on[e]=fr,fr=e)}function Go(e){const n=D(e);return jp(e),n}function Xo(e){const n=typeof e;if(n=="number"||n=="boolean"||e==null)return`${e}`;if(n=="string")return`"${e}"`;if(n=="symbol"){const a=e.description;return a==null?"Symbol":`Symbol(${a})`}if(n=="function"){const a=e.name;return typeof a=="string"&&a.length>0?`Function(${a})`:"Function"}if(Array.isArray(e)){const a=e.length;let l="[";a>0&&(l+=Xo(e[0]));for(let o=1;o1)r=t[1];else return toString.call(e);if(r=="Object")try{return"Object("+JSON.stringify(e)+")"}catch{return"Object"}return e instanceof Error?`${e.name}: ${e.message} -${e.stack}`:r}let Ma=0;const zp=typeof TextEncoder>"u"?(0,module.require)("util").TextEncoder:TextEncoder;let Ra=new zp("utf-8");const Mp=typeof Ra.encodeInto=="function"?function(e,n){return Ra.encodeInto(e,n)}:function(e,n){const t=Ra.encode(e);return n.set(t),{read:e.length,written:t.length}};function Ec(e,n,t){if(t===void 0){const i=Ra.encode(e),u=n(i.length,1)>>>0;return ja().subarray(u,u+i.length).set(i),Ma=i.length,u}let r=e.length,a=n(r,1)>>>0;const l=ja();let o=0;for(;o127)break;l[a+o]=i}if(o!==r){o!==0&&(e=e.slice(o)),a=t(a,r,r=o+e.length*3,1)>>>0;const i=ja().subarray(a+o,a+r),u=Mp(e,i);o+=u.written,a=t(a,r,o,1)>>>0}return Ma=o,a}let wt=null;function Pn(){return(wt===null||wt.buffer.detached===!0||wt.buffer.detached===void 0&&wt.buffer!==O.memory.buffer)&&(wt=new DataView(O.memory.buffer)),wt}let Ia=null;function Rp(){return(Ia===null||Ia.byteLength===0)&&(Ia=new Uint32Array(O.memory.buffer)),Ia}function Nc(e,n){return e=e>>>0,Rp().subarray(e/4,e/4+n)}function Ip(e,n,t,r){const a=O.circleCoords(e,n,t,r);return pr.__wrap(a)}function Fp(e,n,t,r,a){const l=O.lineCoords(e,n,t,r,a);return pr.__wrap(l)}function Op(e,n,t,r,a){const l=O.rectangleCoords(e,n,t,r,a);return pr.__wrap(l)}function Ke(e,n){try{return e.apply(this,n)}catch(t){O.__wbindgen_export_3(H(t))}}typeof FinalizationRegistry>"u"||new FinalizationRegistry(e=>O.__wbg_earlystopconfig_free(e>>>0,1)),typeof FinalizationRegistry>"u"||new FinalizationRegistry(e=>O.__wbg_patherconfig_free(e>>>0,1));const Zo=typeof FinalizationRegistry>"u"?{register:()=>{},unregister:()=>{}}:new FinalizationRegistry(e=>O.__wbg_peg_free(e>>>0,1));class dr{static __wrap(n){n=n>>>0;const t=Object.create(dr.prototype);return t.__wbg_ptr=n,Zo.register(t,t.__wbg_ptr,t),t}static __unwrap(n){return n instanceof dr?n.__destroy_into_raw():0}__destroy_into_raw(){const n=this.__wbg_ptr;return this.__wbg_ptr=0,Zo.unregister(this),n}free(){const n=this.__destroy_into_raw();O.__wbg_peg_free(n,0)}constructor(n,t){const r=O.peg_new(n,t);return this.__wbg_ptr=r>>>0,Zo.register(this,this.__wbg_ptr,this),this}withJitter(n){const t=O.peg_withJitter(this.__wbg_ptr,n);return dr.__wrap(t)}}const Pc=typeof FinalizationRegistry>"u"?{register:()=>{},unregister:()=>{}}:new FinalizationRegistry(e=>O.__wbg_shapecoords_free(e>>>0,1));class pr{static __wrap(n){n=n>>>0;const t=Object.create(pr.prototype);return t.__wbg_ptr=n,Pc.register(t,t.__wbg_ptr,t),t}__destroy_into_raw(){const n=this.__wbg_ptr;return this.__wbg_ptr=0,Pc.unregister(this),n}free(){const n=this.__destroy_into_raw();O.__wbg_shapecoords_free(n,0)}get_x(){try{const a=O.__wbindgen_add_to_stack_pointer(-16);O.shapecoords_get_x(a,this.__wbg_ptr);var n=Pn().getInt32(a+4*0,!0),t=Pn().getInt32(a+4*1,!0),r=Nc(n,t).slice();return O.__wbindgen_export_2(n,t*4,4),r}finally{O.__wbindgen_add_to_stack_pointer(16)}}get_y(){try{const a=O.__wbindgen_add_to_stack_pointer(-16);O.shapecoords_get_y(a,this.__wbg_ptr);var n=Pn().getInt32(a+4*0,!0),t=Pn().getInt32(a+4*1,!0),r=Nc(n,t).slice();return O.__wbindgen_export_2(n,t*4,4),r}finally{O.__wbindgen_add_to_stack_pointer(16)}}}typeof FinalizationRegistry>"u"||new FinalizationRegistry(e=>O.__wbg_yarn_free(e>>>0,1));function Dp(e,n){const t=za(e,n);return H(t)}function Up(e){return dr.__unwrap(Go(e))}function Ap(){const e=new Error;return H(e)}function $p(e,n){const t=D(n).stack,r=Ec(t,O.__wbindgen_export_0,O.__wbindgen_export_1),a=Ma;Pn().setInt32(e+4*1,a,!0),Pn().setInt32(e+4*0,r,!0)}function Bp(e,n){let t,r;try{t=e,r=n,console.error(za(e,n))}finally{O.__wbindgen_export_2(t,r,1)}}function Vp(e){Go(e)}function Wp(e){const n=D(e);return H(n)}function Hp(e){const n=D(e).crypto;return H(n)}function Qp(e){const n=D(e);return typeof n=="object"&&n!==null}function qp(e){const n=D(e).process;return H(n)}function Kp(e){const n=D(e).versions;return H(n)}function Yp(e){const n=D(e).node;return H(n)}function Gp(e){return typeof D(e)=="string"}function Xp(){return Ke(function(){const e=module.require;return H(e)},arguments)}function Zp(e){return typeof D(e)=="function"}function Jp(e){const n=D(e).msCrypto;return H(n)}function e0(e){const n=new Uint8Array(e>>>0);return H(n)}function n0(){return Ke(function(e,n){const t=Reflect.get(D(e),D(n));return H(t)},arguments)}function t0(e){return D(e).now()}function r0(){return Ke(function(){const e=self.self;return H(e)},arguments)}function a0(){return Ke(function(){const e=window.window;return H(e)},arguments)}function l0(){return Ke(function(){const e=globalThis.globalThis;return H(e)},arguments)}function o0(){return Ke(function(){const e=global.global;return H(e)},arguments)}function i0(e){return D(e)===void 0}function u0(e,n){const t=new Function(za(e,n));return H(t)}function s0(){return Ke(function(e,n){const t=D(e).call(D(n));return H(t)},arguments)}function c0(){return Ke(function(e,n,t){const r=D(e).call(D(n),D(t));return H(r)},arguments)}function f0(){const e=O.memory;return H(e)}function d0(e){const n=D(e).buffer;return H(n)}function p0(e,n,t){const r=new Uint8Array(D(e),n>>>0,t>>>0);return H(r)}function h0(){return Ke(function(e,n){D(e).randomFillSync(Go(n))},arguments)}function g0(e,n,t){const r=D(e).subarray(n>>>0,t>>>0);return H(r)}function m0(){return Ke(function(e,n){D(e).getRandomValues(D(n))},arguments)}function y0(e){const n=new Uint8Array(D(e));return H(n)}function b0(e,n,t){D(e).set(D(n),t>>>0)}function v0(e,n){throw new Error(za(e,n))}function w0(e,n){const t=Xo(D(n)),r=Ec(t,O.__wbindgen_export_0,O.__wbindgen_export_1),a=Ma;Pn().setInt32(e+4*1,a,!0),Pn().setInt32(e+4*0,r,!0)}URL=globalThis.URL;const $=await Pp({"./strandify_wasm_bg.js":{__wbindgen_string_new:Dp,__wbg_peg_unwrap:Up,__wbg_new_abda76e883ba8a5f:Ap,__wbg_stack_658279fe44541cf6:$p,__wbg_error_f851667af71bcfc6:Bp,__wbindgen_object_drop_ref:Vp,__wbindgen_object_clone_ref:Wp,__wbg_crypto_1d1f22824a6a080c:Hp,__wbindgen_is_object:Qp,__wbg_process_4a72847cc503995b:qp,__wbg_versions_f686565e586dd935:Kp,__wbg_node_104a2ff8d6ea03a2:Yp,__wbindgen_is_string:Gp,__wbg_require_cca90b1a94a0255b:Xp,__wbindgen_is_function:Zp,__wbg_msCrypto_eb05e62b530a1508:Jp,__wbg_newwithlength_ec548f448387c968:e0,__wbg_get_224d16597dbbfd96:n0,__wbg_now_a69647afb1f66247:t0,__wbg_self_3093d5d1f7bcb682:r0,__wbg_window_3bcfc4d31bc012f8:a0,__wbg_globalThis_86b222e13bdf32ed:l0,__wbg_global_e5a3fe56f8be9485:o0,__wbindgen_is_undefined:i0,__wbg_newnoargs_76313bd6ff35d0f2:u0,__wbg_call_1084a111329e68ce:s0,__wbg_call_89af060b4e1523f2:c0,__wbindgen_memory:f0,__wbg_buffer_b7b08af79b0b0974:d0,__wbg_newwithbyteoffsetandlength_8a2cb9ca96b27ec9:p0,__wbg_randomFillSync_5c9c955aa56b6049:h0,__wbg_subarray_7c2e3576afe181d1:g0,__wbg_getRandomValues_3aa56aa6edec874c:m0,__wbg_new_ea1883e1e5e86686:y0,__wbg_set_d1e79e2388520f18:b0,__wbindgen_throw:v0,__wbindgen_debug_string:w0}},Np),k0=$.memory,x0=$.__wbg_shapecoords_free,_0=$.shapecoords_get_x,S0=$.shapecoords_get_y,C0=$.circleCoords,E0=$.lineCoords,N0=$.squareCoords,P0=$.rectangleCoords,T0=$.__wbg_peg_free,L0=$.peg_new,j0=$.peg_withJitter,z0=$.__wbg_yarn_free,M0=$.yarn_new,R0=$.__wbg_earlystopconfig_free,I0=$.earlystopconfig_new,F0=$.__wbg_patherconfig_free,O0=$.patherconfig_new,D0=$.init_panic_hook,U0=$.computeSvg,A0=$.computePng,$0=$.__wbindgen_export_0,B0=$.__wbindgen_export_1,V0=$.__wbindgen_add_to_stack_pointer,W0=$.__wbindgen_export_2,H0=$.__wbindgen_export_3,Tc=$.__wbindgen_start,Q0=Object.freeze(Object.defineProperty({__proto__:null,__wbg_earlystopconfig_free:R0,__wbg_patherconfig_free:F0,__wbg_peg_free:T0,__wbg_shapecoords_free:x0,__wbg_yarn_free:z0,__wbindgen_add_to_stack_pointer:V0,__wbindgen_export_0:$0,__wbindgen_export_1:B0,__wbindgen_export_2:W0,__wbindgen_export_3:H0,__wbindgen_start:Tc,circleCoords:C0,computePng:A0,computeSvg:U0,earlystopconfig_new:I0,init_panic_hook:D0,lineCoords:E0,memory:k0,patherconfig_new:O0,peg_new:L0,peg_withJitter:j0,rectangleCoords:P0,shapecoords_get_x:_0,shapecoords_get_y:S0,squareCoords:N0,yarn_new:M0},Symbol.toStringTag,{value:"Module"}));Tp(Q0),Tc();const Lc=L.forwardRef(({image:e,pegs:n,setPegs:t,brushType:r,pegCount:a},l)=>{const[o,i]=L.useState({isDragging:!1,draggedPegIndex:-1,isDrawing:!1,isErasing:!1}),[u,c]=L.useState({x:0,y:0}),[h,g]=L.useState(null),[p,x]=L.useState([]),S=L.useRef(null),k=L.useRef(null),F=L.useCallback(v=>{if(!l||!("current"in l)||!l.current)return{x:0,y:0};const y=l.current.getBoundingClientRect();if("touches"in v){const N=v.touches[0];return{x:N.clientX-y.left,y:N.clientY-y.top}}return{x:v.clientX-y.left,y:v.clientY-y.top}},[l]),d=L.useCallback((v,y,N,E)=>{if(!l||!("current"in l)||!l.current)return[];if(isNaN(a)||a<2)return[];let j;switch(r){case _e.Line:j=Fp(v,y,N,E,a);break;case _e.Box:j=Op(Math.min(v,N),Math.min(y,E),Math.abs(v-N),Math.abs(y-E),a);break;case _e.Circle:j=Ip(v,y,Math.hypot(N-v,E-y),a);break;default:return[]}const Y=j.get_x(),ye=j.get_y(),Ye=[];return Y.forEach((kt,hr)=>Ye.push({x:Math.min(kt,l.current.width-1),y:Math.min(ye[hr],l.current.height-1)})),Ye},[r,a,l]),s=L.useCallback((v,y,N,E)=>{x(d(v,y,N,E))},[d]),f=L.useCallback(()=>{if(!l||!("current"in l)||!l.current||!k.current)return;const v=l.current,y=k.current.clientWidth,N=window.innerHeight*(y<700?.8:.6);let E,j;if(e){const Y=e.width/e.height,ye=y/N;Y>ye?(E=y,j=y/Y):(j=N,E=N*Y)}else E=y,j=y*(9/16);if(v.width!==E||v.height!==j){const Y=E/v.width,ye=j/v.height;v.width=E,v.height=j,t(Ye=>Ye.map(kt=>({x:kt.x*Y,y:kt.y*ye})))}},[l,e,t]),m=L.useCallback(v=>{if(v.preventDefault(),!l||!("current"in l)||!l.current)return;const{x:y,y:N}=F(v);if(c({x:y,y:N}),r===_e.Eraser){i(j=>({...j,isErasing:!0})),g({x:y,y:N,width:0,height:0});return}const E=n.findIndex(j=>Math.hypot(y-j.x,N-j.y)<5);if(E!==-1){i(j=>({...j,isDragging:!0,draggedPegIndex:E}));return}r===_e.Single?t([...n,{x:y,y:N}]):i(j=>({...j,isDrawing:!0}))},[r,n,l,t,F]),_=L.useCallback(v=>{if(v.preventDefault(),!l||!("current"in l)||!l.current)return;const{x:y,y:N}=F(v),{isDragging:E,draggedPegIndex:j,isErasing:Y,isDrawing:ye}=o;if(E&&j!==-1){const Ye=[...n];Ye[j]={x:y,y:N},t(Ye)}else Y&&h?g({x:Math.min(u.x,y),y:Math.min(u.y,N),width:Math.abs(y-u.x),height:Math.abs(N-u.y)}):ye&&s(u.x,u.y,y,N)},[o,n,u,h,l,t,s,F]),C=L.useCallback(v=>{if(v.preventDefault(),!l||!("current"in l)||!l.current)return;const{isErasing:y,isDrawing:N}=o;if(y&&r===_e.Eraser&&h){const E=n.filter(j=>!(j.x>=h.x&&j.x<=h.x+h.width&&j.y>=h.y&&j.y<=h.y+h.height));t(E)}else N&&t([...n,...p]);g(null),i({isDragging:!1,draggedPegIndex:-1,isDrawing:!1,isErasing:!1}),x([])},[o,r,n,p,h,l,t]);return L.useEffect(()=>{if(l===null||!("current"in l)||l.current===null)return;const v=l.current,y=v.getContext("2d");y&&(y.clearRect(0,0,v.width,v.height),e&&y.drawImage(e,0,0,v.width,v.height),h&&(y.fillStyle="rgba(255, 0, 0, 0.2)",y.fillRect(h.x,h.y,h.width,h.height),y.strokeStyle="rgba(255, 0, 0, 0.8)",y.strokeRect(h.x,h.y,h.width,h.height)),n.forEach(N=>{y.beginPath(),y.arc(N.x,N.y,5,0,Math.PI*2),y.fillStyle="red",y.fill()}),p.length>0&&(y.strokeStyle="rgba(255, 0, 0, 0.5)",y.fillStyle="rgba(255, 0, 0, 0.5)",p.forEach(N=>{y.beginPath(),y.arc(N.x,N.y,5,0,Math.PI*2),y.fill()}),p.length>1&&(y.beginPath(),y.moveTo(p[0].x,p[0].y),p.slice(1).forEach(N=>y.lineTo(N.x,N.y)),y.closePath(),y.stroke())))},[l,e,n,h,p]),L.useEffect(()=>{f()},[f]),L.useEffect(()=>{l&&"current"in l&&l.current&&(S.current=l.current.getContext("2d"),f())},[l,e,f]),L.useEffect(()=>(window.addEventListener("resize",f),()=>window.removeEventListener("resize",f)),[f]),b.jsx("div",{ref:k,className:"w-full",role:"region",children:b.jsx("canvas",{ref:l,className:"mx-auto border border-gray-200 dark:border-gray-600 cursor-crosshair touch-none",onMouseDown:m,onMouseMove:_,onMouseUp:C,onMouseLeave:C,onTouchStart:m,onTouchMove:_,onTouchEnd:C,onTouchCancel:C})})});Lc.displayName="Canvas";const jc=L.createContext(void 0),zc=({children:e})=>{const[n,t]=L.useState("light");L.useEffect(()=>{const a=localStorage.getItem("theme");a&&t(a)},[]),L.useEffect(()=>{localStorage.setItem("theme",n),n==="dark"?document.documentElement.classList.add("dark"):document.documentElement.classList.remove("dark");const a=document.querySelector('meta[name="theme-color"]'),l=getComputedStyle(document.documentElement).getPropertyValue("--light-bg-color").trim(),o=getComputedStyle(document.documentElement).getPropertyValue("--dark-bg-color").trim();console.log(o),console.log(l),a&&a.setAttribute("content",n==="dark"?o:l)},[n]);const r=()=>{t(a=>a==="light"?"dark":"light")};return b.jsx(jc.Provider,{value:{theme:n,toggleTheme:r},children:e})},q0=()=>{const e=L.useContext(jc);if(e===void 0)throw new Error("useTheme must be used within a ThemeProvider");return e};function K0({brushType:e,setBrushType:n,pegCount:t,setPegCount:r,onClearPegs:a,onAutoPegs:l,totalPegs:o}){return b.jsxs("div",{className:"bg-white dark:bg-gray-800 p-4 rounded-lg shadow-lg space-y-4",children:[b.jsx("div",{className:"grid grid-cols-5 gap-2",children:[{type:_e.Single,Icon:mp,label:"Single"},{type:_e.Line,Icon:hp,label:"Line"},{type:_e.Box,Icon:xp,label:"Box"},{type:_e.Circle,Icon:cp,label:"Circle"},{type:_e.Eraser,Icon:fp,label:"Eraser"}].map(({type:i,Icon:u,label:c})=>b.jsx("div",{onClick:()=>n(i),className:`sm:p-4 p-2 rounded-lg transition-colors cursor-pointer ${e===i?"bg-blue-100 dark:bg-blue-900 border-2 border-blue-500":"bg-gray-100 dark:bg-gray-700 border-2 border-gray-300 dark:border-gray-600 hover:bg-gray-200 dark:hover:bg-gray-600"}`,children:b.jsxs("div",{className:"flex flex-col items-center",children:[b.jsx(u,{className:`w-5 h-5 mb-1 ${e===i?"text-blue-500":"text-gray-600 dark:text-gray-400"}`}),b.jsx("span",{className:`text-xs font-medium ${e===i?"text-gray-800 dark:text-gray-200":"text-gray-600 dark:text-gray-400"}`,children:c})]})},i))}),b.jsxs("div",{className:"flex items-end gap-4 ",children:[b.jsxs("div",{className:"flex-1",children:[b.jsx("label",{className:"block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",children:"Tool Pegs"}),b.jsx("input",{type:"number",value:t,onChange:i=>r(parseInt(i.target.value)||50),className:"w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:ring-blue-500 focus:border-blue-500",min:"2",max:"1000"})]}),b.jsxs("div",{className:"flex flex-col",children:[b.jsxs("label",{className:"block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",children:["Total Pegs: ",o]}),b.jsxs("div",{className:"flex gap-2",children:[b.jsx("button",{onClick:a,className:"px-2 sm:px-4 py-2 bg-red-100 dark:bg-red-900 border-2 border-red-500 text-red-700 dark:text-red-300 rounded-lg hover:bg-red-200 dark:hover:bg-red-800 transition-colors",children:"Clear Pegs"}),b.jsx("button",{onClick:l,className:"px-2 sm:px-4 py-2 bg-blue-100 dark:bg-blue-900 border-2 border-blue-500 text-blue-700 dark:text-blue-300 rounded-lg hover:bg-blue-200 dark:hover:bg-blue-800 transition-colors",children:"Auto Pegs"})]})]})]})]})}function Y0({options:e,onChange:n}){const[t,r]=L.useState({pather:!0,advanced:!1,render:!0}),a=(u,c,h)=>{n({...e,[u]:{...e[u],[c]:h}})},l={pather:{title:"Pather Options",icon:wp,fields:[{section:"pather",key:"iterations",label:"Iterations",type:"number",min:1,step:500},{section:"pather",key:"width",label:"Width",type:"number",min:0,step:1},{section:"pather",key:"opacity",label:"Opacity",type:"number",min:0,max:1,step:.1}]},advanced:{title:"Advanced Settings",icon:kp,fields:[{section:"pather",key:"skipPegWithin",label:"Skip Peg Within",type:"number",min:0},{section:"pather",key:"beamWidth",label:"Beam Search Width",type:"number",min:1},{section:"earlyStop",key:"lossThreshold",label:"Early Stop Loss Threshold",type:"number",min:0,max:1,step:.01},{section:"earlyStop",key:"maxCount",label:"Early Stop Max Count",type:"number",min:1}]},render:{title:"Render Options",icon:yp,fields:[{section:"render",key:"width",label:"Width",type:"number",min:.1,step:.1},{section:"render",key:"opacity",label:"Opacity",type:"number",min:0,max:1,step:.1},{section:"render",key:"color",label:"Color",type:"color"},{section:"render",key:"bgColor",label:"Background Color",type:"color"}]}},o=({sectionKey:u,config:c})=>{const h=c.icon;return b.jsxs("div",{className:"bg-white dark:bg-gray-800 rounded-lg shadow-lg px-4 py-2",children:[b.jsxs("button",{onClick:()=>r(g=>({...g,[u]:!g[u]})),className:"w-full flex items-center justify-between text-gray-900 dark:text-white mb-2",children:[b.jsxs("div",{className:"flex items-center gap-2",children:[b.jsx(h,{className:"w-5 h-5"}),b.jsx("h3",{className:"font-medium",children:c.title})]}),t[u]?b.jsx(sp,{className:"w-5 h-5"}):b.jsx(up,{className:"w-5 h-5"})]}),t[u]&&b.jsx("div",{className:"space-y-4 mt-4",children:c.fields.map(g=>b.jsx(i,{field:g,value:e[g.section][g.key],onChange:p=>a(g.section,g.key,p)},`${g.section}-${g.key}`))})]})},i=({field:u,value:c,onChange:h})=>{const[g,p]=L.useState((c==null?void 0:c.toString())??"");L.useEffect(()=>{p((c==null?void 0:c.toString())??"")},[c]);const x="w-24 px-2 py-1 border border-gray-300 dark:border-gray-600 rounded bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:ring-blue-500 focus:border-blue-500",S=()=>{if(u.type==="number"){const k=g===""?null:parseFloat(g);g===""||k!==null&&!isNaN(k)&&k>=(u.min??-1/0)&&k<=(u.max??1/0)?h(k):p((c==null?void 0:c.toString())??"")}};return u.type==="number"?b.jsx("div",{children:b.jsxs("label",{className:"flex items-center justify-between text-sm text-gray-700 dark:text-gray-300",children:[b.jsx("span",{children:u.label}),b.jsx("input",{type:"text",inputMode:"decimal",value:g,onChange:k=>p(k.target.value),onBlur:S,onKeyDown:k=>{k.key==="Enter"&&S()},className:x})]})}):b.jsx("div",{children:b.jsxs("label",{className:"flex items-center justify-between text-sm text-gray-700 dark:text-gray-300",children:[b.jsx("span",{children:u.label}),b.jsx("input",{type:"color",value:c,onChange:k=>h(k.target.value),className:`${x} h-8 cursor-pointer`})]})})};return b.jsx("div",{className:"space-y-4",children:Object.entries(l).map(([u,c])=>b.jsx(o,{sectionKey:u,config:c},u))})}const G0=()=>(console.log("new worker"),new Worker(new URL("/strandify/assets/strandifyWorker-qi3TT6UT.js",import.meta.url),{type:"module"}));function X0(){const[e,n]=L.useState(!1),[t,r]=L.useState(null),a=L.useMemo(()=>G0(),[]);return L.useEffect(()=>(a.onmessage=l=>{console.log("message received from worker"),console.log(l),r(l.data.svg),n(!1)},a.onerror=l=>{n(!1),console.error(l)},()=>{a.terminate()}),[a]),{stringArtSvg:t,setStringArtSvg:r,createStringArt:async(l,o,i)=>{n(!0);const u=await new Promise(c=>{l.toBlob(h=>{h==null||h.arrayBuffer().then(g=>{c(new Uint8Array(g))})})});a.postMessage({imageData:u,pegs:o,options:i})},isComputing:e}}const Z0=({svgString:e})=>{const n=new DOMParser().parseFromString(e,"image/svg+xml"),t=n.documentElement,r=t.getAttribute("width")||"500",a=t.getAttribute("height")||"500",l=n.querySelector("rect"),o=Array.from(n.querySelectorAll("path")),i=o.length,[u,c]=L.useState(0),[h,g]=L.useState(!1),p=L.useRef(null),x=L.useRef(null),S=L.useCallback(f=>{const m=Number(f.target.value);m!==u&&(c(m),g(!1))},[u]),k=L.useCallback(f=>{x.current||(x.current=f);const m=f-x.current,_=i-u,C=2e3*(_/i),v=10,y=Math.min(m/C*_,_),N=u+Math.floor(y/v)*v;N>u&&c(N),y<_?p.current=requestAnimationFrame(k):g(!1)},[u,i]);L.useEffect(()=>(h?(x.current=null,p.current=requestAnimationFrame(k)):p.current&&(cancelAnimationFrame(p.current),p.current=null,x.current=null),()=>{p.current&&cancelAnimationFrame(p.current)}),[h,k]);const F=L.useCallback(()=>{if(!e)return;const f=new Blob([e],{type:"image/svg+xml"}),m=URL.createObjectURL(f),_=document.createElement("a");_.href=m,_.download="strandify.svg",document.body.appendChild(_),_.click(),document.body.removeChild(_),URL.revokeObjectURL(m)},[e]),d=L.useCallback(()=>{if(!e)return;const f=new Image,m=new Blob([e],{type:"image/svg+xml"}),_=URL.createObjectURL(m);f.onload=()=>{const C=document.createElement("canvas"),v=C.getContext("2d");v&&(C.width=f.width,C.height=f.height,v.drawImage(f,0,0),C.toBlob(y=>{if(y){const N=URL.createObjectURL(y),E=document.createElement("a");E.href=N,E.download="strandify.png",document.body.appendChild(E),E.click(),document.body.removeChild(E),URL.revokeObjectURL(N)}},"image/png"),URL.revokeObjectURL(_))},f.src=_},[e]),s=L.memo(()=>b.jsxs("svg",{width:r,height:a,children:[l&&b.jsx("g",{dangerouslySetInnerHTML:{__html:l.outerHTML}}),o.slice(0,u).map((f,m)=>b.jsx("g",{dangerouslySetInnerHTML:{__html:f.outerHTML}},m))]}));return b.jsxs("div",{style:{textAlign:"center"},children:[b.jsx(s,{}),b.jsxs("div",{className:"flex flex-row w-full items-center mt-4 gap-2",children:[b.jsx("button",{onClick:()=>g(f=>!f),className:"p-2 bg-blue-500 text-white rounded-full",children:h?b.jsx(bp,{}):b.jsx(vp,{})}),b.jsx("input",{type:"range",min:"0",max:i,value:u,onChange:S,className:"flex-grow mr-2"}),b.jsxs("div",{className:"text-gray-800 dark:text-white",children:[u," / ",i]})]}),b.jsxs("div",{className:"flex gap-2 items-center justify-center",children:[b.jsxs("button",{onClick:F,className:"px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600 transition-colors flex items-center gap-2",children:[b.jsx(Sc,{className:"w-5 h-5"}),b.jsx("span",{children:"Download SVG"})]}),b.jsxs("button",{onClick:d,className:"px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600 transition-colors flex items-center gap-2",children:[b.jsx(Sc,{className:"w-5 h-5"}),b.jsx("span",{children:"Download PNG"})]})]})]})},J0=()=>{const{theme:e,toggleTheme:n}=q0(),[t,r]=L.useState(!1),a=()=>{window.open("https://github.com/loiccoyle/strandify","_blank")};return b.jsx("header",{className:"mb-4",children:b.jsxs("div",{className:"flex items-center mb-2",children:[b.jsxs("div",{className:"flex flex-col md:flex-row items-center justify-around gap-2 w-full cursor-default",children:[b.jsx("h1",{className:"text-5xl font-extrabold tracking-tight dark:text-white text-gray-800",children:"Strandify"}),b.jsxs("p",{className:"text-base text-center grow sm:text-lg text-gray-600 dark:text-gray-300 italic relative",children:[b.jsx("span",{className:"sm:inline hidden",children:"Effortless string art, "}),b.jsx("span",{className:"sm:hidden inline",children:"String art,"}),b.jsxs("span",{className:"underline relative",onClick:()=>r(!t),onMouseEnter:()=>r(!0),onMouseLeave:()=>r(!1),children:["no strings attached",b.jsxs("span",{className:`absolute left-1/2 transform -translate-x-1/2 mt-6 p-2 w-64 text-xs text-gray-800 dark:text-gray-200 bg-white dark:bg-black rounded-lg shadow-lg z-10 transition-opacity duration-300 ${t?"opacity-100 visible":"opacity-0 invisible"}`,children:["Free and"," ",b.jsx("a",{href:"https://github.com/loiccoyle/strandify/tree/gh-pages",className:"underline font-bold",target:"_blank",children:"open-source"}),". All processing is done locally. Your photos never leave your device."]})]})]})]}),b.jsxs("div",{className:"flex justify-end mb-2 gap-2",children:[b.jsx("button",{onClick:a,className:"p-2 rounded-full bg-gray-200 dark:bg-gray-700 text-gray-800 dark:text-gray-200 hover:bg-gray-300 dark:hover:bg-gray-600 transition-colors","aria-label":"View GitHub repository",children:b.jsx("svg",{className:"w-6 h-6",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:b.jsx("path",{d:"M12 2C6.477 2 2 6.477 2 12c0 4.419 2.865 8.166 6.839 9.489.5.092.682-.217.682-.482 0-.238-.008-.866-.013-1.699-2.782.603-3.369-1.342-3.369-1.342-.454-1.155-1.11-1.462-1.11-1.462-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.831.092-.647.35-1.088.636-1.338-2.22-.252-4.555-1.111-4.555-4.943 0-1.091.39-1.984 1.029-2.688-.103-.253-.446-1.27.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.026 2.747-1.026.546 1.38.202 2.398.1 2.651.64.704 1.028 1.597 1.028 2.688 0 3.848-2.339 4.687-4.566 4.935.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12c0-5.523-4.477-10-10-10z",fill:"currentColor"})})}),b.jsx("button",{onClick:n,className:"p-2 rounded-full bg-gray-200 dark:bg-gray-700 text-gray-800 dark:text-gray-200 hover:bg-gray-300 dark:hover:bg-gray-600 transition-colors","aria-label":"Toggle dark mode",children:e==="light"?b.jsx(gp,{className:"w-6 h-6"}):b.jsx(_p,{className:"w-6 h-6"})})]})]})})},eh=()=>b.jsxs("footer",{className:"text-center text-gray-600 dark:text-gray-300 text-xs",children:[b.jsxs("p",{children:["Made with \u2764\uFE0F by"," ",b.jsx("a",{href:"https://loiccoyle.com",className:"underline font-bold",target:"_blank",children:"Lo\xEFc Coyle"})]}),"It broke? Open an"," ",b.jsx("a",{href:"https://github.com/loiccoyle/strandify/issues/new",className:"underline font-bold",target:"_blank",children:"issue"})]});function nh(){const[e,n]=L.useState(null),[t,r]=L.useState([]),[a,l]=L.useState(_e.Circle),[o,i]=L.useState(500),[u,c]=L.useState({pather:{iterations:4e3,skipPegWithin:10,beamWidth:1,width:1,opacity:.2},earlyStop:{lossThreshold:null,maxCount:1e3},render:{width:1,opacity:.2,color:"#000000",bgColor:"#ffffff"}}),h=L.useRef(null),{stringArtSvg:g,setStringArtSvg:p,createStringArt:x,isComputing:S}=X0(),k=L.useCallback(m=>{var v;const _=(v=m.target.files)==null?void 0:v[0];if(!_)return;const C=new FileReader;C.onload=y=>{var E;const N=new Image;N.onload=()=>n(N),N.src=(E=y.target)==null?void 0:E.result},C.readAsDataURL(_)},[]),F=L.useCallback(()=>{n(null),r([]),p(null)},[p,r,n]),d=L.useCallback(()=>{r([])},[]),s=L.useCallback(()=>{if(!h.current)return;const m=h.current,_=[],C=o;if(a===_e.Box)for(let v=0;v[...v,..._])},[a,o]),f=L.useCallback(async()=>{!h.current||t.length===0||x(h.current,t,u)},[t,x,u]);return L.useEffect(()=>{if(g===null)return;const m=new DOMParser().parseFromString(g,"image/svg+xml"),_=m.documentElement,C=m.querySelector("rect"),v=Array.from(m.querySelectorAll("path"));for(let y=0;y"u"?(0,module.require)("util").TextEncoder:TextEncoder;let Ra=new zp("utf-8");const Mp=typeof Ra.encodeInto=="function"?function(e,n){return Ra.encodeInto(e,n)}:function(e,n){const t=Ra.encode(e);return n.set(t),{read:e.length,written:t.length}};function Ec(e,n,t){if(t===void 0){const i=Ra.encode(e),u=n(i.length,1)>>>0;return ja().subarray(u,u+i.length).set(i),Ma=i.length,u}let r=e.length,a=n(r,1)>>>0;const l=ja();let o=0;for(;o127)break;l[a+o]=i}if(o!==r){o!==0&&(e=e.slice(o)),a=t(a,r,r=o+e.length*3,1)>>>0;const i=ja().subarray(a+o,a+r),u=Mp(e,i);o+=u.written,a=t(a,r,o,1)>>>0}return Ma=o,a}let wt=null;function Pn(){return(wt===null||wt.buffer.detached===!0||wt.buffer.detached===void 0&&wt.buffer!==O.memory.buffer)&&(wt=new DataView(O.memory.buffer)),wt}let Ia=null;function Rp(){return(Ia===null||Ia.byteLength===0)&&(Ia=new Uint32Array(O.memory.buffer)),Ia}function Nc(e,n){return e=e>>>0,Rp().subarray(e/4,e/4+n)}function Ip(e,n,t,r){const a=O.circleCoords(e,n,t,r);return pr.__wrap(a)}function Fp(e,n,t,r,a){const l=O.lineCoords(e,n,t,r,a);return pr.__wrap(l)}function Op(e,n,t,r,a){const l=O.rectangleCoords(e,n,t,r,a);return pr.__wrap(l)}function Ke(e,n){try{return e.apply(this,n)}catch(t){O.__wbindgen_export_3(H(t))}}typeof FinalizationRegistry>"u"||new FinalizationRegistry(e=>O.__wbg_earlystopconfig_free(e>>>0,1)),typeof FinalizationRegistry>"u"||new FinalizationRegistry(e=>O.__wbg_patherconfig_free(e>>>0,1));const Zo=typeof FinalizationRegistry>"u"?{register:()=>{},unregister:()=>{}}:new FinalizationRegistry(e=>O.__wbg_peg_free(e>>>0,1));class dr{static __wrap(n){n=n>>>0;const t=Object.create(dr.prototype);return t.__wbg_ptr=n,Zo.register(t,t.__wbg_ptr,t),t}static __unwrap(n){return n instanceof dr?n.__destroy_into_raw():0}__destroy_into_raw(){const n=this.__wbg_ptr;return this.__wbg_ptr=0,Zo.unregister(this),n}free(){const n=this.__destroy_into_raw();O.__wbg_peg_free(n,0)}constructor(n,t){const r=O.peg_new(n,t);return this.__wbg_ptr=r>>>0,Zo.register(this,this.__wbg_ptr,this),this}withJitter(n){const t=O.peg_withJitter(this.__wbg_ptr,n);return dr.__wrap(t)}}const Pc=typeof FinalizationRegistry>"u"?{register:()=>{},unregister:()=>{}}:new FinalizationRegistry(e=>O.__wbg_shapecoords_free(e>>>0,1));class pr{static __wrap(n){n=n>>>0;const t=Object.create(pr.prototype);return t.__wbg_ptr=n,Pc.register(t,t.__wbg_ptr,t),t}__destroy_into_raw(){const n=this.__wbg_ptr;return this.__wbg_ptr=0,Pc.unregister(this),n}free(){const n=this.__destroy_into_raw();O.__wbg_shapecoords_free(n,0)}get_x(){try{const a=O.__wbindgen_add_to_stack_pointer(-16);O.shapecoords_get_x(a,this.__wbg_ptr);var n=Pn().getInt32(a+4*0,!0),t=Pn().getInt32(a+4*1,!0),r=Nc(n,t).slice();return O.__wbindgen_export_2(n,t*4,4),r}finally{O.__wbindgen_add_to_stack_pointer(16)}}get_y(){try{const a=O.__wbindgen_add_to_stack_pointer(-16);O.shapecoords_get_y(a,this.__wbg_ptr);var n=Pn().getInt32(a+4*0,!0),t=Pn().getInt32(a+4*1,!0),r=Nc(n,t).slice();return O.__wbindgen_export_2(n,t*4,4),r}finally{O.__wbindgen_add_to_stack_pointer(16)}}}typeof FinalizationRegistry>"u"||new FinalizationRegistry(e=>O.__wbg_yarn_free(e>>>0,1));function Dp(e,n){const t=za(e,n);return H(t)}function Up(e){return dr.__unwrap(Go(e))}function Ap(){const e=new Error;return H(e)}function $p(e,n){const t=D(n).stack,r=Ec(t,O.__wbindgen_export_0,O.__wbindgen_export_1),a=Ma;Pn().setInt32(e+4*1,a,!0),Pn().setInt32(e+4*0,r,!0)}function Bp(e,n){let t,r;try{t=e,r=n,console.error(za(e,n))}finally{O.__wbindgen_export_2(t,r,1)}}function Vp(e){Go(e)}function Wp(e){const n=D(e);return H(n)}function Hp(e){const n=D(e).crypto;return H(n)}function Qp(e){const n=D(e);return typeof n=="object"&&n!==null}function qp(e){const n=D(e).process;return H(n)}function Kp(e){const n=D(e).versions;return H(n)}function Yp(e){const n=D(e).node;return H(n)}function Gp(e){return typeof D(e)=="string"}function Xp(){return Ke(function(){const e=module.require;return H(e)},arguments)}function Zp(e){return typeof D(e)=="function"}function Jp(e){const n=D(e).msCrypto;return H(n)}function e0(e){const n=new Uint8Array(e>>>0);return H(n)}function n0(){return Ke(function(e,n){const t=Reflect.get(D(e),D(n));return H(t)},arguments)}function t0(e){return D(e).now()}function r0(){return Ke(function(){const e=self.self;return H(e)},arguments)}function a0(){return Ke(function(){const e=window.window;return H(e)},arguments)}function l0(){return Ke(function(){const e=globalThis.globalThis;return H(e)},arguments)}function o0(){return Ke(function(){const e=global.global;return H(e)},arguments)}function i0(e){return D(e)===void 0}function u0(e,n){const t=new Function(za(e,n));return H(t)}function s0(){return Ke(function(e,n){const t=D(e).call(D(n));return H(t)},arguments)}function c0(){return Ke(function(e,n,t){const r=D(e).call(D(n),D(t));return H(r)},arguments)}function f0(){const e=O.memory;return H(e)}function d0(e){const n=D(e).buffer;return H(n)}function p0(e,n,t){const r=new Uint8Array(D(e),n>>>0,t>>>0);return H(r)}function h0(){return Ke(function(e,n){D(e).randomFillSync(Go(n))},arguments)}function g0(e,n,t){const r=D(e).subarray(n>>>0,t>>>0);return H(r)}function m0(){return Ke(function(e,n){D(e).getRandomValues(D(n))},arguments)}function y0(e){const n=new Uint8Array(D(e));return H(n)}function b0(e,n,t){D(e).set(D(n),t>>>0)}function v0(e,n){throw new Error(za(e,n))}function w0(e,n){const t=Xo(D(n)),r=Ec(t,O.__wbindgen_export_0,O.__wbindgen_export_1),a=Ma;Pn().setInt32(e+4*1,a,!0),Pn().setInt32(e+4*0,r,!0)}URL=globalThis.URL;const $=await Pp({"./strandify_wasm_bg.js":{__wbindgen_string_new:Dp,__wbg_peg_unwrap:Up,__wbg_new_abda76e883ba8a5f:Ap,__wbg_stack_658279fe44541cf6:$p,__wbg_error_f851667af71bcfc6:Bp,__wbindgen_object_drop_ref:Vp,__wbindgen_object_clone_ref:Wp,__wbg_crypto_1d1f22824a6a080c:Hp,__wbindgen_is_object:Qp,__wbg_process_4a72847cc503995b:qp,__wbg_versions_f686565e586dd935:Kp,__wbg_node_104a2ff8d6ea03a2:Yp,__wbindgen_is_string:Gp,__wbg_require_cca90b1a94a0255b:Xp,__wbindgen_is_function:Zp,__wbg_msCrypto_eb05e62b530a1508:Jp,__wbg_newwithlength_ec548f448387c968:e0,__wbg_get_224d16597dbbfd96:n0,__wbg_now_a69647afb1f66247:t0,__wbg_self_3093d5d1f7bcb682:r0,__wbg_window_3bcfc4d31bc012f8:a0,__wbg_globalThis_86b222e13bdf32ed:l0,__wbg_global_e5a3fe56f8be9485:o0,__wbindgen_is_undefined:i0,__wbg_newnoargs_76313bd6ff35d0f2:u0,__wbg_call_1084a111329e68ce:s0,__wbg_call_89af060b4e1523f2:c0,__wbindgen_memory:f0,__wbg_buffer_b7b08af79b0b0974:d0,__wbg_newwithbyteoffsetandlength_8a2cb9ca96b27ec9:p0,__wbg_randomFillSync_5c9c955aa56b6049:h0,__wbg_subarray_7c2e3576afe181d1:g0,__wbg_getRandomValues_3aa56aa6edec874c:m0,__wbg_new_ea1883e1e5e86686:y0,__wbg_set_d1e79e2388520f18:b0,__wbindgen_throw:v0,__wbindgen_debug_string:w0}},Np),k0=$.memory,x0=$.__wbg_shapecoords_free,_0=$.shapecoords_get_x,S0=$.shapecoords_get_y,C0=$.circleCoords,E0=$.lineCoords,N0=$.squareCoords,P0=$.rectangleCoords,T0=$.__wbg_peg_free,L0=$.peg_new,j0=$.peg_withJitter,z0=$.__wbg_yarn_free,M0=$.yarn_new,R0=$.__wbg_earlystopconfig_free,I0=$.earlystopconfig_new,F0=$.__wbg_patherconfig_free,O0=$.patherconfig_new,D0=$.init_panic_hook,U0=$.computeSvg,A0=$.computePng,$0=$.__wbindgen_export_0,B0=$.__wbindgen_export_1,V0=$.__wbindgen_add_to_stack_pointer,W0=$.__wbindgen_export_2,H0=$.__wbindgen_export_3,Tc=$.__wbindgen_start,Q0=Object.freeze(Object.defineProperty({__proto__:null,__wbg_earlystopconfig_free:R0,__wbg_patherconfig_free:F0,__wbg_peg_free:T0,__wbg_shapecoords_free:x0,__wbg_yarn_free:z0,__wbindgen_add_to_stack_pointer:V0,__wbindgen_export_0:$0,__wbindgen_export_1:B0,__wbindgen_export_2:W0,__wbindgen_export_3:H0,__wbindgen_start:Tc,circleCoords:C0,computePng:A0,computeSvg:U0,earlystopconfig_new:I0,init_panic_hook:D0,lineCoords:E0,memory:k0,patherconfig_new:O0,peg_new:L0,peg_withJitter:j0,rectangleCoords:P0,shapecoords_get_x:_0,shapecoords_get_y:S0,squareCoords:N0,yarn_new:M0},Symbol.toStringTag,{value:"Module"}));Tp(Q0),Tc();const Lc=L.forwardRef(({image:e,pegs:n,setPegs:t,brushType:r,pegCount:a},l)=>{const[o,i]=L.useState({isDragging:!1,draggedPegIndex:-1,isDrawing:!1,isErasing:!1}),[u,c]=L.useState({x:0,y:0}),[h,g]=L.useState(null),[p,x]=L.useState([]),S=L.useRef(null),k=L.useRef(null),F=L.useCallback(v=>{if(!l||!("current"in l)||!l.current)return{x:0,y:0};const y=l.current.getBoundingClientRect();if("touches"in v){const N=v.touches[0];return{x:N.clientX-y.left,y:N.clientY-y.top}}return{x:v.clientX-y.left,y:v.clientY-y.top}},[l]),d=L.useCallback((v,y,N,E)=>{if(!l||!("current"in l)||!l.current)return[];if(isNaN(a)||a<2)return[];let j;switch(r){case _e.Line:j=Fp(v,y,N,E,a);break;case _e.Box:j=Op(Math.min(v,N),Math.min(y,E),Math.abs(v-N),Math.abs(y-E),a);break;case _e.Circle:j=Ip(v,y,Math.hypot(N-v,E-y),a);break;default:return[]}const Y=j.get_x(),ye=j.get_y(),Ye=[];return Y.forEach((kt,hr)=>Ye.push({x:Math.min(kt,l.current.width-1),y:Math.min(ye[hr],l.current.height-1)})),Ye},[r,a,l]),s=L.useCallback((v,y,N,E)=>{x(d(v,y,N,E))},[d]),f=L.useCallback(()=>{if(!l||!("current"in l)||!l.current||!k.current)return;const v=l.current,y=k.current.clientWidth,N=window.innerHeight*(y<700?.8:.6);let E,j;if(e){const Y=e.width/e.height,ye=y/N;Y>ye?(E=Math.min(y,e.width),j=E/Y):(j=Math.min(N,e.height),E=j*Y)}else E=y,j=y*(9/16);if(v.width!==E||v.height!==j){const Y=E/v.width,ye=j/v.height;v.width=E,v.height=j,t(Ye=>Ye.map(kt=>({x:kt.x*Y,y:kt.y*ye})))}},[l,e,t]),m=L.useCallback(v=>{if(v.preventDefault(),!l||!("current"in l)||!l.current)return;const{x:y,y:N}=F(v);if(c({x:y,y:N}),r===_e.Eraser){i(j=>({...j,isErasing:!0})),g({x:y,y:N,width:0,height:0});return}const E=n.findIndex(j=>Math.hypot(y-j.x,N-j.y)<5);if(E!==-1){i(j=>({...j,isDragging:!0,draggedPegIndex:E}));return}r===_e.Single?t([...n,{x:y,y:N}]):i(j=>({...j,isDrawing:!0}))},[r,n,l,t,F]),_=L.useCallback(v=>{if(v.preventDefault(),!l||!("current"in l)||!l.current)return;const{x:y,y:N}=F(v),{isDragging:E,draggedPegIndex:j,isErasing:Y,isDrawing:ye}=o;if(E&&j!==-1){const Ye=[...n];Ye[j]={x:y,y:N},t(Ye)}else Y&&h?g({x:Math.min(u.x,y),y:Math.min(u.y,N),width:Math.abs(y-u.x),height:Math.abs(N-u.y)}):ye&&s(u.x,u.y,y,N)},[o,n,u,h,l,t,s,F]),C=L.useCallback(v=>{if(v.preventDefault(),!l||!("current"in l)||!l.current)return;const{isErasing:y,isDrawing:N}=o;if(y&&r===_e.Eraser&&h){const E=n.filter(j=>!(j.x>=h.x&&j.x<=h.x+h.width&&j.y>=h.y&&j.y<=h.y+h.height));t(E)}else N&&t([...n,...p]);g(null),i({isDragging:!1,draggedPegIndex:-1,isDrawing:!1,isErasing:!1}),x([])},[o,r,n,p,h,l,t]);return L.useEffect(()=>{if(l===null||!("current"in l)||l.current===null)return;const v=l.current,y=v.getContext("2d");y&&(y.clearRect(0,0,v.width,v.height),e&&y.drawImage(e,0,0,v.width,v.height),h&&(y.fillStyle="rgba(255, 0, 0, 0.2)",y.fillRect(h.x,h.y,h.width,h.height),y.strokeStyle="rgba(255, 0, 0, 0.8)",y.strokeRect(h.x,h.y,h.width,h.height)),n.forEach(N=>{y.beginPath(),y.arc(N.x,N.y,5,0,Math.PI*2),y.fillStyle="red",y.fill()}),p.length>0&&(y.strokeStyle="rgba(255, 0, 0, 0.5)",y.fillStyle="rgba(255, 0, 0, 0.5)",p.forEach(N=>{y.beginPath(),y.arc(N.x,N.y,5,0,Math.PI*2),y.fill()}),p.length>1&&(y.beginPath(),y.moveTo(p[0].x,p[0].y),p.slice(1).forEach(N=>y.lineTo(N.x,N.y)),y.closePath(),y.stroke())))},[l,e,n,h,p]),L.useEffect(()=>{f()},[f]),L.useEffect(()=>{l&&"current"in l&&l.current&&(S.current=l.current.getContext("2d"),f())},[l,e,f]),L.useEffect(()=>(window.addEventListener("resize",f),()=>window.removeEventListener("resize",f)),[f]),b.jsx("div",{ref:k,className:"w-full",role:"region",children:b.jsx("canvas",{ref:l,className:"mx-auto border border-gray-200 dark:border-gray-600 cursor-crosshair touch-none",onMouseDown:m,onMouseMove:_,onMouseUp:C,onMouseLeave:C,onTouchStart:m,onTouchMove:_,onTouchEnd:C,onTouchCancel:C})})});Lc.displayName="Canvas";const jc=L.createContext(void 0),zc=({children:e})=>{const[n,t]=L.useState("light");L.useEffect(()=>{const a=localStorage.getItem("theme");a&&t(a)},[]),L.useEffect(()=>{localStorage.setItem("theme",n),n==="dark"?document.documentElement.classList.add("dark"):document.documentElement.classList.remove("dark");const a=document.querySelector('meta[name="theme-color"]'),l=getComputedStyle(document.documentElement).getPropertyValue("--light-bg-color").trim(),o=getComputedStyle(document.documentElement).getPropertyValue("--dark-bg-color").trim();a&&a.setAttribute("content",n==="dark"?o:l)},[n]);const r=()=>{t(a=>a==="light"?"dark":"light")};return b.jsx(jc.Provider,{value:{theme:n,toggleTheme:r},children:e})},q0=()=>{const e=L.useContext(jc);if(e===void 0)throw new Error("useTheme must be used within a ThemeProvider");return e};function K0({brushType:e,setBrushType:n,pegCount:t,setPegCount:r,onClearPegs:a,onAutoPegs:l,totalPegs:o}){return b.jsxs("div",{className:"bg-white dark:bg-gray-800 p-4 rounded-lg shadow-lg space-y-4",children:[b.jsx("div",{className:"grid grid-cols-5 gap-2",children:[{type:_e.Single,Icon:mp,label:"Single"},{type:_e.Line,Icon:hp,label:"Line"},{type:_e.Box,Icon:xp,label:"Box"},{type:_e.Circle,Icon:cp,label:"Circle"},{type:_e.Eraser,Icon:fp,label:"Eraser"}].map(({type:i,Icon:u,label:c})=>b.jsx("div",{onClick:()=>n(i),className:`sm:p-4 p-2 rounded-lg transition-colors cursor-pointer ${e===i?"bg-blue-100 dark:bg-blue-900 border-2 border-blue-500":"bg-gray-100 dark:bg-gray-700 border-2 border-gray-300 dark:border-gray-600 hover:bg-gray-200 dark:hover:bg-gray-600"}`,children:b.jsxs("div",{className:"flex flex-col items-center",children:[b.jsx(u,{className:`w-5 h-5 mb-1 ${e===i?"text-blue-500":"text-gray-600 dark:text-gray-400"}`}),b.jsx("span",{className:`text-xs font-medium ${e===i?"text-gray-800 dark:text-gray-200":"text-gray-600 dark:text-gray-400"}`,children:c})]})},i))}),b.jsxs("div",{className:"flex items-end gap-4 ",children:[b.jsxs("div",{className:"flex-1",children:[b.jsx("label",{className:"block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",children:"Tool Pegs"}),b.jsx("input",{type:"number",value:t,onChange:i=>r(parseInt(i.target.value)||50),className:"w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-lg bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:ring-blue-500 focus:border-blue-500",min:"2",max:"1000"})]}),b.jsxs("div",{className:"flex flex-col",children:[b.jsxs("label",{className:"block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1",children:["Total Pegs: ",o]}),b.jsxs("div",{className:"flex gap-2",children:[b.jsx("button",{onClick:a,className:"px-2 sm:px-4 py-2 bg-red-100 dark:bg-red-900 border-2 border-red-500 text-red-700 dark:text-red-300 rounded-lg hover:bg-red-200 dark:hover:bg-red-800 transition-colors",children:"Clear Pegs"}),b.jsx("button",{onClick:l,className:"px-2 sm:px-4 py-2 bg-blue-100 dark:bg-blue-900 border-2 border-blue-500 text-blue-700 dark:text-blue-300 rounded-lg hover:bg-blue-200 dark:hover:bg-blue-800 transition-colors",children:"Auto Pegs"})]})]})]})]})}function Y0({options:e,onChange:n}){const[t,r]=L.useState({pather:!0,advanced:!1,render:!0}),a=(u,c,h)=>{n({...e,[u]:{...e[u],[c]:h}})},l={pather:{title:"Pather Options",icon:wp,fields:[{section:"pather",key:"iterations",label:"Iterations",type:"number",min:1,step:500},{section:"pather",key:"width",label:"Width",type:"number",min:0,step:1},{section:"pather",key:"opacity",label:"Opacity",type:"number",min:0,max:1,step:.1}]},advanced:{title:"Advanced Settings",icon:kp,fields:[{section:"pather",key:"skipPegWithin",label:"Skip Peg Within",type:"number",min:0},{section:"pather",key:"beamWidth",label:"Beam Search Width",type:"number",min:1},{section:"earlyStop",key:"lossThreshold",label:"Early Stop Loss Threshold",type:"number",min:0,max:1,step:.01},{section:"earlyStop",key:"maxCount",label:"Early Stop Max Count",type:"number",min:1}]},render:{title:"Render Options",icon:yp,fields:[{section:"render",key:"width",label:"Width",type:"number",min:.1,step:.1},{section:"render",key:"opacity",label:"Opacity",type:"number",min:0,max:1,step:.1},{section:"render",key:"color",label:"Color",type:"color"},{section:"render",key:"bgColor",label:"Background Color",type:"color"}]}},o=({sectionKey:u,config:c})=>{const h=c.icon;return b.jsxs("div",{className:"bg-white dark:bg-gray-800 rounded-lg shadow-lg px-4 py-2",children:[b.jsxs("button",{onClick:()=>r(g=>({...g,[u]:!g[u]})),className:"w-full flex items-center justify-between text-gray-900 dark:text-white mb-2",children:[b.jsxs("div",{className:"flex items-center gap-2",children:[b.jsx(h,{className:"w-5 h-5"}),b.jsx("h3",{className:"font-medium",children:c.title})]}),t[u]?b.jsx(sp,{className:"w-5 h-5"}):b.jsx(up,{className:"w-5 h-5"})]}),t[u]&&b.jsx("div",{className:"space-y-4 mt-4",children:c.fields.map(g=>b.jsx(i,{field:g,value:e[g.section][g.key],onChange:p=>a(g.section,g.key,p)},`${g.section}-${g.key}`))})]})},i=({field:u,value:c,onChange:h})=>{const[g,p]=L.useState((c==null?void 0:c.toString())??"");L.useEffect(()=>{p((c==null?void 0:c.toString())??"")},[c]);const x="w-24 px-2 py-1 border border-gray-300 dark:border-gray-600 rounded bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:ring-blue-500 focus:border-blue-500",S=()=>{if(u.type==="number"){const k=g===""?null:parseFloat(g);g===""||k!==null&&!isNaN(k)&&k>=(u.min??-1/0)&&k<=(u.max??1/0)?h(k):p((c==null?void 0:c.toString())??"")}};return u.type==="number"?b.jsx("div",{children:b.jsxs("label",{className:"flex items-center justify-between text-sm text-gray-700 dark:text-gray-300",children:[b.jsx("span",{children:u.label}),b.jsx("input",{type:"text",inputMode:"decimal",value:g,onChange:k=>p(k.target.value),onBlur:S,onKeyDown:k=>{k.key==="Enter"&&S()},className:x})]})}):b.jsx("div",{children:b.jsxs("label",{className:"flex items-center justify-between text-sm text-gray-700 dark:text-gray-300",children:[b.jsx("span",{children:u.label}),b.jsx("input",{type:"color",value:c,onChange:k=>h(k.target.value),className:`${x} h-8 cursor-pointer`})]})})};return b.jsx("div",{className:"space-y-4",children:Object.entries(l).map(([u,c])=>b.jsx(o,{sectionKey:u,config:c},u))})}const G0=()=>(console.log("new worker"),new Worker(new URL("/strandify/assets/strandifyWorker-qi3TT6UT.js",import.meta.url),{type:"module"}));function X0(){const[e,n]=L.useState(!1),[t,r]=L.useState(null),a=L.useMemo(()=>G0(),[]);return L.useEffect(()=>(a.onmessage=l=>{console.log("message received from worker"),console.log(l),r(l.data.svg),n(!1)},a.onerror=l=>{n(!1),console.error(l)},()=>{a.terminate()}),[a]),{stringArtSvg:t,setStringArtSvg:r,createStringArt:async(l,o,i)=>{n(!0);const u=await new Promise(c=>{l.toBlob(h=>{h==null||h.arrayBuffer().then(g=>{c(new Uint8Array(g))})})});a.postMessage({imageData:u,pegs:o,options:i})},isComputing:e}}const Z0=({svgString:e})=>{const n=new DOMParser().parseFromString(e,"image/svg+xml"),t=n.documentElement,r=t.getAttribute("width")||"500",a=t.getAttribute("height")||"500",l=n.querySelector("rect"),o=Array.from(n.querySelectorAll("path")),i=o.length,[u,c]=L.useState(0),[h,g]=L.useState(!1),p=L.useRef(null),x=L.useRef(null),S=L.useCallback(f=>{const m=Number(f.target.value);m!==u&&(c(m),g(!1))},[u]),k=L.useCallback(f=>{x.current||(x.current=f);const m=f-x.current,_=i-u,C=2e3*(_/i),v=10,y=Math.min(m/C*_,_),N=u+Math.floor(y/v)*v;N>u&&c(N),y<_?p.current=requestAnimationFrame(k):g(!1)},[u,i]);L.useEffect(()=>(h?(x.current=null,p.current=requestAnimationFrame(k)):p.current&&(cancelAnimationFrame(p.current),p.current=null,x.current=null),()=>{p.current&&cancelAnimationFrame(p.current)}),[h,k]);const F=L.useCallback(()=>{if(!e)return;const f=new Blob([e],{type:"image/svg+xml"}),m=URL.createObjectURL(f),_=document.createElement("a");_.href=m,_.download="strandify.svg",document.body.appendChild(_),_.click(),document.body.removeChild(_),URL.revokeObjectURL(m)},[e]),d=L.useCallback(()=>{if(!e)return;const f=new Image,m=new Blob([e],{type:"image/svg+xml"}),_=URL.createObjectURL(m);f.onload=()=>{const C=document.createElement("canvas"),v=C.getContext("2d");v&&(C.width=f.width,C.height=f.height,v.drawImage(f,0,0),C.toBlob(y=>{if(y){const N=URL.createObjectURL(y),E=document.createElement("a");E.href=N,E.download="strandify.png",document.body.appendChild(E),E.click(),document.body.removeChild(E),URL.revokeObjectURL(N)}},"image/png"),URL.revokeObjectURL(_))},f.src=_},[e]),s=L.memo(()=>b.jsxs("svg",{width:r,height:a,children:[l&&b.jsx("g",{dangerouslySetInnerHTML:{__html:l.outerHTML}}),o.slice(0,u).map((f,m)=>b.jsx("g",{dangerouslySetInnerHTML:{__html:f.outerHTML}},m))]}));return b.jsxs("div",{style:{textAlign:"center"},children:[b.jsx(s,{}),b.jsxs("div",{className:"flex flex-row w-full items-center mt-4 gap-2",children:[b.jsx("button",{onClick:()=>g(f=>!f),className:"p-2 bg-blue-500 text-white rounded-full",children:h?b.jsx(bp,{}):b.jsx(vp,{})}),b.jsx("input",{type:"range",min:"0",max:i,value:u,onChange:S,className:"flex-grow mr-2"}),b.jsxs("div",{className:"text-gray-800 dark:text-white",children:[u," / ",i]})]}),b.jsxs("div",{className:"flex gap-2 items-center justify-center",children:[b.jsxs("button",{onClick:F,className:"px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600 transition-colors flex items-center gap-2",children:[b.jsx(Sc,{className:"w-5 h-5"}),b.jsx("span",{children:"Download SVG"})]}),b.jsxs("button",{onClick:d,className:"px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600 transition-colors flex items-center gap-2",children:[b.jsx(Sc,{className:"w-5 h-5"}),b.jsx("span",{children:"Download PNG"})]})]})]})},J0=()=>{const{theme:e,toggleTheme:n}=q0(),[t,r]=L.useState(!1),a=()=>{window.open("https://github.com/loiccoyle/strandify","_blank")};return b.jsx("header",{className:"mb-4",children:b.jsxs("div",{className:"flex items-center mb-2",children:[b.jsxs("div",{className:"flex flex-col md:flex-row items-center justify-around gap-2 w-full cursor-default",children:[b.jsx("h1",{className:"text-5xl font-extrabold tracking-tight dark:text-white text-gray-800",children:"Strandify"}),b.jsxs("p",{className:"text-base text-center grow sm:text-lg text-gray-600 dark:text-gray-300 italic relative",children:[b.jsx("span",{className:"sm:inline hidden",children:"Effortless string art, "}),b.jsx("span",{className:"sm:hidden inline",children:"String art,"}),b.jsxs("span",{className:"underline relative",onClick:()=>r(!t),onMouseEnter:()=>r(!0),onMouseLeave:()=>r(!1),children:["no strings attached",b.jsxs("span",{className:`absolute left-1/2 transform -translate-x-1/2 mt-6 p-2 w-64 text-xs text-gray-800 dark:text-gray-200 bg-white dark:bg-black rounded-lg shadow-lg z-10 transition-opacity duration-300 ${t?"opacity-100 visible":"opacity-0 invisible"}`,children:["Free and"," ",b.jsx("a",{href:"https://github.com/loiccoyle/strandify/tree/gh-pages",className:"underline font-bold",target:"_blank",children:"open-source"}),". All processing is done locally. Your photos never leave your device."]})]})]})]}),b.jsxs("div",{className:"flex justify-end mb-2 gap-2",children:[b.jsx("button",{onClick:a,className:"p-2 rounded-full bg-gray-200 dark:bg-gray-700 text-gray-800 dark:text-gray-200 hover:bg-gray-300 dark:hover:bg-gray-600 transition-colors","aria-label":"View GitHub repository",children:b.jsx("svg",{className:"w-6 h-6",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:b.jsx("path",{d:"M12 2C6.477 2 2 6.477 2 12c0 4.419 2.865 8.166 6.839 9.489.5.092.682-.217.682-.482 0-.238-.008-.866-.013-1.699-2.782.603-3.369-1.342-3.369-1.342-.454-1.155-1.11-1.462-1.11-1.462-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.831.092-.647.35-1.088.636-1.338-2.22-.252-4.555-1.111-4.555-4.943 0-1.091.39-1.984 1.029-2.688-.103-.253-.446-1.27.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.026 2.747-1.026.546 1.38.202 2.398.1 2.651.64.704 1.028 1.597 1.028 2.688 0 3.848-2.339 4.687-4.566 4.935.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12c0-5.523-4.477-10-10-10z",fill:"currentColor"})})}),b.jsx("button",{onClick:n,className:"p-2 rounded-full bg-gray-200 dark:bg-gray-700 text-gray-800 dark:text-gray-200 hover:bg-gray-300 dark:hover:bg-gray-600 transition-colors","aria-label":"Toggle dark mode",children:e==="light"?b.jsx(gp,{className:"w-6 h-6"}):b.jsx(_p,{className:"w-6 h-6"})})]})]})})},eh=()=>b.jsxs("footer",{className:"text-center text-gray-600 dark:text-gray-300 text-xs",children:[b.jsxs("p",{children:["Made with \u2764\uFE0F by"," ",b.jsx("a",{href:"https://loiccoyle.com",className:"underline font-bold",target:"_blank",children:"Lo\xEFc Coyle"})]}),"It broke? Open an"," ",b.jsx("a",{href:"https://github.com/loiccoyle/strandify/issues/new",className:"underline font-bold",target:"_blank",children:"issue"})]});function nh(){const[e,n]=L.useState(null),[t,r]=L.useState([]),[a,l]=L.useState(_e.Circle),[o,i]=L.useState(500),[u,c]=L.useState({pather:{iterations:4e3,skipPegWithin:10,beamWidth:1,width:1,opacity:.2},earlyStop:{lossThreshold:null,maxCount:1e3},render:{width:1,opacity:.2,color:"#000000",bgColor:"#ffffff"}}),h=L.useRef(null),{stringArtSvg:g,setStringArtSvg:p,createStringArt:x,isComputing:S}=X0(),k=L.useCallback(m=>{var v;const _=(v=m.target.files)==null?void 0:v[0];if(!_)return;const C=new FileReader;C.onload=y=>{var E;const N=new Image;N.onload=()=>n(N),N.src=(E=y.target)==null?void 0:E.result},C.readAsDataURL(_)},[]),F=L.useCallback(()=>{n(null),r([]),p(null)},[p,r,n]),d=L.useCallback(()=>{r([])},[]),s=L.useCallback(()=>{if(!h.current)return;const m=h.current,_=[],C=o;if(a===_e.Box)for(let v=0;v[...v,..._])},[a,o]),f=L.useCallback(async()=>{!h.current||t.length===0||x(h.current,t,u)},[t,x,u]);return L.useEffect(()=>{if(g===null)return;const m=new DOMParser().parseFromString(g,"image/svg+xml"),_=m.documentElement,C=m.querySelector("rect"),v=Array.from(m.querySelectorAll("path"));for(let y=0;y Strandify - string art, no strings attached - + diff --git a/src/components/Canvas.tsx b/src/components/Canvas.tsx index a3e9d2e..370dc6f 100644 --- a/src/components/Canvas.tsx +++ b/src/components/Canvas.tsx @@ -148,11 +148,11 @@ export const Canvas = forwardRef( const containerAspectRatio = maxWidth / maxHeight; if (imageAspectRatio > containerAspectRatio) { - width = maxWidth; - height = maxWidth / imageAspectRatio; + width = Math.min(maxWidth, image.width); + height = width / imageAspectRatio; } else { - height = maxHeight; - width = maxHeight * imageAspectRatio; + height = Math.min(maxHeight, image.height); + width = height * imageAspectRatio; } } else { width = maxWidth; diff --git a/src/contexts/ThemeContext.tsx b/src/contexts/ThemeContext.tsx index 3ed29ec..bafac4c 100644 --- a/src/contexts/ThemeContext.tsx +++ b/src/contexts/ThemeContext.tsx @@ -37,8 +37,6 @@ export const ThemeProvider: React.FC<{ children: React.ReactNode }> = ({ const darkColor = getComputedStyle(document.documentElement) .getPropertyValue("--dark-bg-color") .trim(); - console.log(darkColor); - console.log(lightColor); if (metaTag) { metaTag.setAttribute(