@popmelt.com/core 0.6.6 → 0.6.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -1,21 +1,21 @@
1
1
  "use client";
2
- var Tc=Object.defineProperty,Mc=Object.defineProperties;var Ic=Object.getOwnPropertyDescriptors;var Ar=Object.getOwnPropertySymbols;var Ks=Object.prototype.hasOwnProperty,qs=Object.prototype.propertyIsEnumerable;var Xs=(e,t,n)=>t in e?Tc(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,f=(e,t)=>{for(var n in t||(t={}))Ks.call(t,n)&&Xs(e,n,t[n]);if(Ar)for(var n of Ar(t))qs.call(t,n)&&Xs(e,n,t[n]);return e},y=(e,t)=>Mc(e,Ic(t));var co=e=>typeof e=="symbol"?e:e+"",Hn=(e,t)=>{var n={};for(var r in e)Ks.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(e!=null&&Ar)for(var r of Ar(e))t.indexOf(r)<0&&qs.call(e,r)&&(n[r]=e[r]);return n};import{createContext as Eg,useCallback as nn,useContext as Tg,useEffect as Yt,useMemo as cr,useRef as Vt,useState as pn}from"react";import{useCallback as ll,useEffect as Lc,useSyncExternalStore as Rc}from"react";var jn="http://localhost:1111";function Wn(e,t={},n=15e3){let r=new AbortController;t.signal&&t.signal.addEventListener("abort",()=>r.abort());let o=setTimeout(()=>r.abort(),n);return fetch(e,y(f({},t),{signal:r.signal})).finally(()=>clearTimeout(o))}async function Qs(e=jn){try{let t=await Wn(`${e}/capabilities`,{},5e3);return t.ok?await t.json():null}catch(t){return null}}async function Ho(e=jn){try{let t=new AbortController,n=setTimeout(()=>t.abort(),2e3),r=await fetch(`${e}/status`,{signal:t.signal});return clearTimeout(n),r.ok?await r.json():null}catch(t){return null}}async function Zs(e){try{let t=new AbortController,n=setTimeout(()=>t.abort(),500),r=await fetch(`http://localhost:${e}/status`,{signal:t.signal});return clearTimeout(n),r.ok?await r.json():null}catch(t){return null}}async function el(e){if(e&&e!=="http://localhost:1111")try{let d=new URL(e);return{url:e,port:parseInt(d.port,10)||1111}}catch(d){return null}let o=typeof window!="undefined"?window.location.origin:null,i=await Zs(1111);if(i&&i.devOrigin&&o&&i.devOrigin===o)return{url:"http://localhost:1111",port:1111};let s=Array.from({length:8},(d,c)=>{let u=1112+c;return Zs(u).then(p=>p?{status:p,port:u}:null)}),l=(await Promise.all(s)).filter(d=>d!==null),a=[];i&&a.push({port:1111,devOrigin:i.devOrigin});for(let d of l)a.push({port:d.port,devOrigin:d.status.devOrigin});if(o){let d=a.find(c=>c.devOrigin===o);if(d)return{url:`http://localhost:${d.port}`,port:d.port}}return a.length===1?{url:`http://localhost:${a[0].port}`,port:a[0].port}:i?{url:"http://localhost:1111",port:1111}:a.length>0?{url:`http://localhost:${a[0].port}`,port:a[0].port}:null}async function Pr(e=jn,t,n=-1){try{let r=await Wn(`${e}/jobs/${t}/events?afterSeq=${n}`,{},5e3);return r.ok?await r.json():null}catch(r){return null}}async function tl(e,t,n=jn,r,o,i,s,l){let a=new FormData;if(e instanceof Map){let c=!0;for(let[u,p]of e){let g=encodeURIComponent(u);a.append(`screenshot-${g}`,p,`screenshot-${g}.png`),c&&(a.append("screenshot",p,"screenshot.png"),c=!1)}c&&a.append("screenshot",new Blob([],{type:"image/png"}),"screenshot.png")}else a.append("screenshot",e,"screenshot.png");if(a.append("feedback",t),r&&a.append("color",r),o&&a.append("provider",o),i&&a.append("model",i),l&&a.append("sourceId",l),s)for(let[c,u]of s)for(let p=0;p<u.length;p++)a.append(`image-${c}-${p}`,u[p],`image-${c}-${p}.png`);let d=await Wn(`${n}/send`,{method:"POST",body:a},3e4);if(!d.ok){let c=await d.text();throw new Error(`Bridge returned ${d.status}: ${c}`)}return d.json()}async function nl(e=jn,t){try{let n=await Wn(`${e}/mcp/install`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(t?{serverUrl:t}:{})},15e3);return n.ok?await n.json():null}catch(n){return null}}async function ol(e,t=jn){let n=await Wn(`${t}/model/component`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!n.ok){let r=await n.text();throw new Error(`Bridge returned ${n.status}: ${r}`)}return n.json()}async function rl(e,t=jn){let n=await Wn(`${t}/model/component`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!n.ok){let r=await n.text();throw new Error(`Bridge returned ${n.status}: ${r}`)}return n.json()}async function xi(e,t,n=jn){let r=await Wn(`${n}/model/token`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e,value:t})},1e4);if(!r.ok){let o=await r.text();throw new Error(`Bridge returned ${r.status}: ${o}`)}return r.json()}async function il(e,t=jn){let n=await Wn(`${t}/model/token`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e})},1e4);if(!n.ok){let r=await n.text();throw new Error(`Bridge returned ${n.status}: ${r}`)}return n.json()}async function Fo(e=jn){var t;try{let n=await Wn(`${e}/model`,{},5e3);return n.ok&&(t=(await n.json()).model)!=null?t:null}catch(n){return null}}async function sl(e,t,n=jn,r,o,i,s,l){let a;if(s&&s.length>0){let d=new FormData,c=new Blob([new Uint8Array([137,80,78,71,13,10,26,10,0,0,0,13,73,72,68,82,0,0,0,1,0,0,0,1,8,6,0,0,0,31,21,196,137,0,0,0,10,73,68,65,84,120,156,98,0,0,0,2,0,1,229,39,222,252,0,0,0,0,73,69,78,68,174,66,96,130])],{type:"image/png"});d.append("screenshot",c,"screenshot.png"),d.append("feedback",JSON.stringify({threadId:e,reply:t,color:r,provider:o,model:i,sourceId:l}));for(let u=0;u<s.length;u++)d.append(`image-reply-${u}`,s[u],`reply-image-${u}.png`);a=await Wn(`${n}/reply`,{method:"POST",body:d},3e4)}else a=await Wn(`${n}/reply`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({threadId:e,reply:t,color:r,provider:o,model:i,sourceId:l})},3e4);if(!a.ok){let d=await a.text();throw new Error(`Bridge returned ${a.status}: ${d}`)}return a.json()}var Dr={};var To=typeof Dr!="undefined"?Dr.hot:void 0,cl,dl,ul,_r=(ul=(dl=(cl=To==null?void 0:To.data)==null?void 0:cl.sourceId)!=null?dl:typeof localStorage!="undefined"&&localStorage.getItem("popmelt-source-id"))!=null?ul:typeof crypto!="undefined"&&typeof crypto.randomUUID=="function"?crypto.randomUUID():Math.random().toString(36).slice(2);To!=null&&To.data&&(To.data.sourceId=_r);try{typeof localStorage!="undefined"&&localStorage.setItem("popmelt-source-id",_r)}catch(e){}function wi(){return _r}var Mo=typeof Dr!="undefined"?Dr.hot:void 0,an=Mo==null?void 0:Mo.data,Ac={isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],activeJobThreads:{},currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,lastErrorByJob:{},pendingQuestions:[],incrementalResolutions:[],capabilitiesVersion:0},pl,Wo=(pl=an==null?void 0:an.store)!=null?pl:f({},Ac),fl,Or=(fl=an==null?void 0:an.listeners)!=null?fl:new Set,gl,ko=(gl=an==null?void 0:an.activeEs)!=null?gl:null,ml,Si=(ml=an==null?void 0:an.activeBridgeUrl)!=null?ml:null,wo=null,hl,Br=(hl=an==null?void 0:an.connectionGeneration)!=null?hl:0;Mo!=null&&Mo.data&&Object.defineProperties(Mo.data,{store:{get:()=>Wo,configurable:!0},listeners:{get:()=>Or,configurable:!0},activeEs:{get:()=>ko,configurable:!0},activeBridgeUrl:{get:()=>Si,configurable:!0},connectionGeneration:{get:()=>Br,configurable:!0},discoveredBridgeUrl:{get:()=>Eo,configurable:!0}});var Nr=new Set,zo=new Map,uo={};function Co(e,t){var r;if(!e)return!1;if(Nr.has(e)){let o=zo.get(e);return o||(o=[],zo.set(e,o)),o.push({type:(r=t.type)!=null?r:"",data:t}),!0}let n=uo[e];return n!==void 0&&typeof t.seq=="number"&&t.seq<=n}async function Pc(e,t,n){let r=()=>n!==Br;for(let o of t){if(r())return;Nr.add(o),zo.set(o,[])}await Promise.all(t.map(async o=>{var i;try{let s=await Pr(e,o);if(r())return;let l=(i=zo.get(o))!=null?i:[];if(s){if(Kt(a=>{let d=y(f({},a.jobResponses),{[o]:s.accumulated.response}),c=y(f({},a.jobThinking),{[o]:s.accumulated.thinking}),u=[...a.events];for(let p of s.events)p.type==="done"||p.type==="error"||u.push({type:p.type,data:p,timestamp:Date.now()});return y(f({},a),{jobResponses:d,jobThinking:c,currentResponse:o===a.activeJobId?s.accumulated.response:a.currentResponse,currentThinking:o===a.activeJobId?s.accumulated.thinking:a.currentThinking,events:u})}),uo[o]=s.currentSeq,!s.jobActive){let a=s.events.find(d=>d.type==="done"||d.type==="error");a&&vi(a.type,a,o)}for(let a of l)typeof a.data.seq=="number"&&a.data.seq<=s.currentSeq||vi(a.type,a.data,o)}else for(let a of l)vi(a.type,a.data,o)}finally{Nr.delete(o),zo.delete(o)}}))}function vi(e,t,n){var r;if(e==="delta"){let o=t.text||"";Kt(i=>y(f({},i),{jobResponses:y(f({},i.jobResponses),{[n]:(i.jobResponses[n]||"")+o}),currentResponse:n===i.activeJobId?i.currentResponse+o:i.currentResponse,events:[...i.events,{type:"delta",data:t,timestamp:Date.now()}]}))}else if(e==="thinking"){let o=t.text||"";Kt(i=>y(f({},i),{jobThinking:y(f({},i.jobThinking),{[n]:(i.jobThinking[n]||"")+o}),currentThinking:n===i.activeJobId?i.currentThinking+o:i.currentThinking,events:[...i.events,{type:"thinking",data:t,timestamp:Date.now()}]}))}else if(e==="done")delete uo[n],Kt(o=>{var c;let i=o.activeJobIds.filter(u=>u!==n),s=f({},o.jobResponses),l=f({},o.jobThinking),a=s[n];delete s[n],delete l[n];let d=n===o.activeJobId?i.length>0?i[i.length-1]:null:o.activeJobId;return y(f(y(f({},o),{activeJobIds:i,activeJobId:d,jobResponses:s,jobThinking:l,lastCompletedJobId:n,lastResponseText:a||o.currentResponse||t.responseText||null,lastThreadId:(c=t.threadId)!=null?c:null}),n===o.activeJobId?{currentResponse:d&&s[d]||"",currentThinking:d&&l[d]||""}:{}),{events:[...o.events,{type:"done",data:t,timestamp:Date.now()}]})});else if(e==="error"){delete uo[n];let o=(r=t.message)!=null?r:"";Kt(i=>{let s=i.activeJobIds.filter(a=>a!==n),l=s.length>0?i.status:"error";return y(f({},i),{status:l,activeJobIds:s,lastCompletedJobId:n,lastErrorByJob:o?y(f({},i.lastErrorByJob),{[n]:o}):i.lastErrorByJob,events:[...i.events,{type:"error",data:t,timestamp:Date.now()}]})})}else Kt(o=>y(f({},o),{events:[...o.events,{type:e,data:t,timestamp:Date.now()}]}))}var yl,Eo=(yl=an==null?void 0:an.discoveredBridgeUrl)!=null?yl:null,$o=null;async function Oc(e){return e&&e!=="http://localhost:1111"?(Eo=e,e):Eo||$o||($o=el(e).then(n=>{var r;return Eo=(r=n==null?void 0:n.url)!=null?r:null,$o=null,Eo}).catch(()=>($o=null,null)),$o)}function bl(){return Eo}function al(){return Wo}function Bc(e){return Or.add(e),()=>{Or.delete(e)}}function Kt(e){Wo=e(Wo);for(let t of Or)t()}function xl(e){if(ko&&ko.readyState!==EventSource.CLOSED&&Si===e)return;ko&&(ko.close(),ko=null),wo&&(clearTimeout(wo),wo=null),Si=e;let t=++Br,n=new EventSource(`${e}/events?sourceId=${_r}`);ko=n;let r=()=>t!==Br;n.addEventListener("connected",()=>{r()||Ho(e).then(o=>{var p,g;if(r())return;let i=(p=o==null?void 0:o.activeJobs)!=null?p:o!=null&&o.activeJob?[o.activeJob]:[],s=new Set(i.map(w=>w.id)),l=(g=o==null?void 0:o.recentJobs)!=null?g:[],a=new Map(l.map(w=>[w.id,w])),d=i.length>0;Kt(w=>{let C=f({},w.lastErrorByJob),R=w.activeJobIds.filter(M=>!s.has(M));for(let M of R){let T=a.get(M);(T==null?void 0:T.status)==="error"&&T.error&&(C[M]=T.error)}let P=w.activeJobIds.filter(M=>s.has(M));for(let M of s)P.includes(M)||P.push(M);let G={};for(let M of i)M.threadId&&(G[M.id]=M.threadId);return y(f({},w),{isConnected:!0,status:d?"streaming":R.length>0||w.status==="disconnected"?"idle":w.status,activeJobId:d?i[i.length-1].id:P.length>0?P[P.length-1]:null,activeJobIds:P,activeJobThreads:G,lastErrorByJob:C,lastCompletedJobId:R.length>0?R[R.length-1]:w.lastCompletedJobId})});let c=Wo.activeJobIds.filter(w=>!s.has(w)),u=[...Array.from(s),...c];u.length>0&&Pc(e,u,t).catch(()=>{})})}),n.addEventListener("job_started",o=>{if(r())return;let i=JSON.parse(o.data),s=i.jobId;if(Co(s,i))return;let l=i.threadId;Kt(a=>{var d,c,u,p;return y(f({},a),{status:"streaming",activeJobId:s,activeJobIds:a.activeJobIds.includes(s)?a.activeJobIds:[...a.activeJobIds,s],activeJobThreads:l?y(f({},a.activeJobThreads),{[s]:l}):a.activeJobThreads,jobResponses:y(f({},a.jobResponses),{[s]:(d=a.jobResponses[s])!=null?d:""}),jobThinking:y(f({},a.jobThinking),{[s]:(c=a.jobThinking[s])!=null?c:""}),currentResponse:(u=a.jobResponses[s])!=null?u:"",currentThinking:(p=a.jobThinking[s])!=null?p:"",lastResponseText:null,lastThreadId:null,events:[...a.events,{type:"job_started",data:i,timestamp:Date.now()}]})})}),n.addEventListener("delta",o=>{if(r())return;let i=JSON.parse(o.data),s=i.jobId;if(Co(s,i))return;let l=i.text||"";Kt(a=>y(f({},a),{jobResponses:s?y(f({},a.jobResponses),{[s]:(a.jobResponses[s]||"")+l}):a.jobResponses,currentResponse:!s||s===a.activeJobId?a.currentResponse+l:a.currentResponse,events:[...a.events,{type:"delta",data:i,timestamp:Date.now()}]}))}),n.addEventListener("thinking",o=>{if(r())return;let i=JSON.parse(o.data),s=i.jobId;if(Co(s,i))return;let l=i.text||"";Kt(a=>y(f({},a),{jobThinking:s?y(f({},a.jobThinking),{[s]:(a.jobThinking[s]||"")+l}):a.jobThinking,currentThinking:!s||s===a.activeJobId?a.currentThinking+l:a.currentThinking,events:[...a.events,{type:"thinking",data:i,timestamp:Date.now()}]}))}),n.addEventListener("tool_use",o=>{if(r())return;let i=JSON.parse(o.data),s=i.jobId;Co(s,i)||Kt(l=>y(f({},l),{events:[...l.events,{type:"tool_use",data:i,timestamp:Date.now()}]}))}),n.addEventListener("done",o=>{if(r())return;let i=JSON.parse(o.data),s=i.jobId;Co(s,i)||(s&&delete uo[s],Kt(l=>{var w;let a=s?l.activeJobIds.filter(C=>C!==s):l.activeJobIds,d=f({},l.jobResponses),c=f({},l.jobThinking),u=f({},l.activeJobThreads),p=s?d[s]:void 0;s&&(delete d[s],delete c[s],delete u[s]);let g=s===l.activeJobId?a.length>0?a[a.length-1]:null:l.activeJobId;return y(f(y(f({},l),{activeJobIds:a,activeJobId:g,jobResponses:d,jobThinking:c,lastCompletedJobId:s!=null?s:l.activeJobId,lastResponseText:p||l.currentResponse||i.responseText||null,lastThreadId:(w=i.threadId)!=null?w:null}),s===l.activeJobId?{currentResponse:g&&d[g]||"",currentThinking:g&&c[g]||""}:{}),{events:[...l.events,{type:"done",data:i,timestamp:Date.now()}]})}))}),n.addEventListener("question",o=>{if(r())return;let i=JSON.parse(o.data),s=i.jobId;Co(s,i)||Kt(l=>y(f({},l),{pendingQuestions:[...l.pendingQuestions,{jobId:i.jobId,threadId:i.threadId,question:i.question,annotationIds:i.annotationIds,timestamp:Date.now()}],events:[...l.events,{type:"question",data:i,timestamp:Date.now()}]}))}),n.addEventListener("capabilities_changed",()=>{r()||Kt(o=>y(f({},o),{capabilitiesVersion:o.capabilitiesVersion+1}))}),n.addEventListener("queue_drained",()=>{if(!r()){for(let o of Object.keys(uo))delete uo[o];Nr.clear(),zo.clear(),Kt(o=>y(f({},o),{status:o.status==="error"?"error":"idle",activeJobId:null,activeJobIds:[],activeJobThreads:{},currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastErrorByJob:{},incrementalResolutions:[]}))}}),n.addEventListener("error",o=>{var i,s;if(!r()){if(n.readyState===EventSource.CLOSED)Kt(l=>y(f({},l),{isConnected:!1,status:"disconnected"})),wo&&(clearTimeout(wo),wo=null),wo=setTimeout(()=>{Ho(e).then(l=>{l&&xl(e)})},5e3);else if(o instanceof MessageEvent){let l=JSON.parse(o.data),a=(i=l.jobId)!=null?i:null;if(Co(a!=null?a:void 0,l))return;a&&delete uo[a];let d=(s=l.message)!=null?s:"";Kt(c=>{let u=a?c.activeJobIds.filter(g=>g!==a):c.activeJobIds,p=u.length>0?c.status:"error";return y(f({},c),{status:p,activeJobIds:u,lastCompletedJobId:a!=null?a:c.activeJobId,lastErrorByJob:a&&d?y(f({},c.lastErrorByJob),{[a]:d}):c.lastErrorByJob,events:[...c.events,{type:"error",data:l,timestamp:Date.now()}]})})}}}),n.onerror=()=>{r()||n.readyState===EventSource.CLOSED&&Kt(o=>y(f({},o),{isConnected:!1,status:"disconnected"}))}}function vl(e="http://localhost:1111",t=!0){let n=Rc(Bc,al,al);Lc(()=>{t&&Oc(e).then(i=>{i&&Ho(i).then(s=>{s&&xl(i)})})},[e,t]);let r=ll(()=>{Kt(()=>y(f({},Wo),{events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,lastErrorByJob:{},incrementalResolutions:[]}))},[]),o=ll(i=>{Kt(s=>y(f({},s),{pendingQuestions:s.pendingQuestions.filter(l=>l.threadId!==i)}))},[]);return y(f({},n),{clearEvents:r,dismissQuestion:o})}import{useEffect as Nc,useReducer as Dc}from"react";var _c={isAnnotating:!1,activeTool:"inspector",activeColor:"oklch(0.628 0.258 29)",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function Hr(){return Math.random().toString(36).substring(2,9)}function Sl(e){return e.status?e:e.captured?y(f({},e),{status:"in_flight"}):y(f({},e),{status:"pending"})}function Cn(e){return y(f({},e),{undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}],redoStack:[]})}function Hc(e,t){return y(f({},e),{isAnnotating:t})}function Fc(e,t){return y(f({},e),{activeTool:t,inspectedElement:null})}function $c(e,t){return y(f({},e),{activeColor:t})}function zc(e,t){return y(f({},e),{strokeWidth:t})}function Wc(e,t){return y(f({},e),{currentPath:[t]})}function jc(e,t){return y(f({},e),{currentPath:[...e.currentPath,t]})}function Yc(e){return y(f({},e),{currentPath:[]})}function Gc(e,t){if(e.currentPath.length<2&&e.activeTool!=="text")return y(f({},e),{currentPath:[]});let n={id:Hr(),type:e.activeTool,points:e.currentPath,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",pathname:typeof window!="undefined"?window.location.pathname:"/",groupId:t==null?void 0:t.groupId,elements:t==null?void 0:t.elements},r=Cn(e);return y(f({},r),{annotations:[...e.annotations,n],currentPath:[]})}function Jc(e,t){var o;let n=f({id:(o=t.id)!=null?o:Hr(),type:"text",points:[t.point],text:t.text,fontSize:t.fontSize||12,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",pathname:typeof window!="undefined"?window.location.pathname:"/",groupId:t.groupId,linkedSelector:t.linkedSelector,linkedAnchor:t.linkedAnchor,elements:t.elements},t.imageCount?{imageCount:t.imageCount}:{}),r=t.groupId?e:Cn(e);return y(f({},r),{annotations:[...e.annotations,n]})}function Uc(e,t){let n=Cn(e);return y(f({},n),{annotations:e.annotations.map(r=>r.id===t.id?f(y(f({},r),{text:t.text}),t.imageCount!=null?{imageCount:t.imageCount}:{}):r)})}function Vc(e,t){return y(f({},e),{annotations:e.annotations.map(n=>n.id===t.id?y(f({},n),{fontSize:Math.max(12,Math.min(72,t.fontSize))}):n)})}function Xc(e,t){let n=Cn(e),r=e.annotations.find(i=>i.id===t.id),o=r==null?void 0:r.groupId;return y(f({},n),{annotations:e.annotations.filter(i=>i.id!==t.id&&!(o&&i.groupId===o))})}function Kc(e,t){let n=t.saveUndo?Cn(e):e,r=e.annotations.find(i=>i.id===t.id),o=r==null?void 0:r.groupId;return y(f({},n),{annotations:e.annotations.map(i=>{if(!(i.id===t.id||o&&i.groupId===o))return i;let l=t.delta.x,a=t.delta.y;return y(f({},i),{points:i.points.map(d=>({x:d.x+l,y:d.y+a}))})})})}function qc(e,t){let n=t.saveUndo?Cn(e):e,r=e.annotations.find(s=>s.id===t.id);if(!r||r.type==="text"||r.points.length<2)return e;let o=0,i=0;if(r.type==="rectangle"&&r.groupId){let s=t.points,l=Math.min(s[0].x,s[1].x),a=Math.max(s[0].y,s[1].y),d=r.points[0],c=r.points[r.points.length-1],u=Math.min(d.x,c.x),p=Math.max(d.y,c.y);o=l-u,i=a-p}return y(f({},n),{annotations:e.annotations.map(s=>s.id===t.id?y(f({},s),{points:t.points}):r.groupId&&s.groupId===r.groupId&&s.type==="text"?y(f({},s),{points:s.points.map(l=>({x:l.x+o,y:l.y+i}))}):s)})}function Zc(e,t){let n=Cn(e);return y(f({},n),{annotations:[...e.annotations,...t.annotations.map(Sl)]})}function Qc(e,t){let n=new Set,r=[];for(let o of t.annotations)n.has(o.id)||(n.add(o.id),r.push(Sl(o)));return y(f({},e),{annotations:r})}function ed(e){if(e.undoStack.length===0)return e;let t=e.undoStack[e.undoStack.length-1];return y(f({},e),{annotations:(t==null?void 0:t.annotations)||[],styleModifications:(t==null?void 0:t.styleModifications)||[],spacingTokenMods:(t==null?void 0:t.spacingTokenMods)||[],undoStack:e.undoStack.slice(0,-1),redoStack:[...e.redoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}]})}function td(e){if(e.redoStack.length===0)return e;let t=e.redoStack[e.redoStack.length-1];return y(f({},e),{annotations:(t==null?void 0:t.annotations)||[],styleModifications:(t==null?void 0:t.styleModifications)||[],spacingTokenMods:(t==null?void 0:t.spacingTokenMods)||[],redoStack:e.redoStack.slice(0,-1),undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}]})}function nd(e,t){let{id:n,addToSelection:r}=t;if(n===null)return y(f({},e),{selectedAnnotationIds:[],lastSelectedId:null});if(r)if(e.selectedAnnotationIds.includes(n)){let i=e.selectedAnnotationIds.filter(s=>s!==n);return y(f({},e),{selectedAnnotationIds:i,lastSelectedId:i.length>0?i[i.length-1]:null})}else return y(f({},e),{selectedAnnotationIds:[...e.selectedAnnotationIds,n],lastSelectedId:n});return y(f({},e),{selectedAnnotationIds:[n],lastSelectedId:n})}function od(e,t){let n=new Set;for(let r of e.selectedAnnotationIds){let o=e.annotations.find(i=>i.id===r);o!=null&&o.groupId&&n.add(o.groupId)}return y(f({},e),{annotations:e.annotations.map(r=>{let o=e.selectedAnnotationIds.includes(r.id),i=r.groupId&&n.has(r.groupId);return!o&&!i?r:y(f({},r),{color:t.color})})})}function rd(e){return y(f({},e),{annotations:e.annotations.map(t=>y(f({},t),{captured:!0,status:t.status==="pending"||!t.status?"in_flight":t.status})),styleModifications:e.styleModifications.map(t=>y(f({},t),{captured:!0})),spacingTokenChanges:e.spacingTokenChanges.map(t=>y(f({},t),{captured:!0}))})}function id(e){return y(f({},e),{annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]})}function sd(e,t){return y(f({},e),{inspectedElement:t})}function ld(e,t){let{selector:n,element:r,property:o,original:i,modified:s}=t,l=e.styleModifications.findIndex(a=>a.selector===n);if(i===s&&l<0)return e;if(l>=0){let a=e.styleModifications[l];if(a.captured){let g=Cn(e),w=g.styleModifications.map((C,R)=>R===l?y(f({},C),{changes:[{property:o,original:i,modified:s}],captured:!1}):C);return y(f({},g),{styleModifications:w})}let d=a.changes.findIndex(g=>g.property===o),c,u=e;if(d>=0){let g=a.changes[d];s===g.original?c=a.changes.filter((w,C)=>C!==d):c=a.changes.map((w,C)=>C===d?y(f({},w),{modified:s}):w)}else{if(i===s)return e;u=Cn(e),c=[...a.changes,{property:o,original:i,modified:s}]}if(c.length===0)return y(f({},u),{styleModifications:u.styleModifications.filter((g,w)=>w!==l)});let p=u.styleModifications.map((g,w)=>w===l?y(f({},g),{changes:c}):g);return y(f({},u),{styleModifications:p})}else{let a=Cn(e),d={selector:n,element:r,changes:[{property:o,original:i,modified:s}]};return y(f({},a),{styleModifications:[...a.styleModifications,d]})}}function ad(e,t){let{selector:n,durableSelector:r,element:o,changes:i}=t,s=i.filter(d=>d.original!==d.modified);if(s.length===0)return e;let l=Cn(e),a=l.styleModifications.findIndex(d=>d.selector===n);if(a>=0){let d=l.styleModifications[a],c=d.captured?[]:[...d.changes];for(let u of s){let p=c.findIndex(g=>g.property===u.property);p>=0?u.modified===c[p].original?c=c.filter((g,w)=>w!==p):c=c.map((g,w)=>w===p?y(f({},g),{modified:u.modified}):g):c.push(u)}return c.length===0?y(f({},l),{styleModifications:l.styleModifications.filter((u,p)=>p!==a)}):y(f({},l),{styleModifications:l.styleModifications.map((u,p)=>p===a?y(f({},u),{changes:c,captured:!1}):u)})}else return y(f({},l),{styleModifications:[...l.styleModifications,{selector:n,durableSelector:r,element:o,changes:s}]})}function cd(e,t){let{selector:n,property:r}=t,o=Cn(e),i=o.styleModifications.map(s=>s.selector!==n?s:y(f({},s),{changes:s.changes.filter(l=>l.property!==r)})).filter(s=>s.changes.length>0);return y(f({},o),{styleModifications:i})}function dd(e){if(e.styleModifications.length===0)return y(f({},e),{inspectedElement:null});let t=Cn(e);return y(f({},t),{styleModifications:[],inspectedElement:null})}function ud(e,t){return y(f({},e),{styleModifications:t})}function pd(e,t){let{updates:n}=t,r=new Map(n.map(o=>[o.id,o]));return y(f({},e),{annotations:e.annotations.map(o=>{let i=r.get(o.id);return i?f(y(f({},o),{points:[i.point,...o.points.slice(1)]}),i.linkedAnchor?{linkedAnchor:i.linkedAnchor}:{}):o})})}function fd(e,t){let n=new Set(t.ids);return y(f({},e),{annotations:e.annotations.map(r=>n.has(r.id)?y(f({},r),{status:t.status}):r)})}function gd(e,t){let n=new Set(t.ids),r=new Set;for(let o of e.annotations)n.has(o.id)&&o.groupId&&r.add(o.groupId);return y(f({},e),{annotations:e.annotations.map(o=>n.has(o.id)||o.groupId&&r.has(o.groupId)?y(f({},o),{threadId:t.threadId}):o)})}function md(e,t){let n=new Set(t.ids),r=new Set;for(let o of e.annotations)n.has(o.id)&&o.groupId&&r.add(o.groupId);return y(f({},e),{annotations:e.annotations.map(o=>n.has(o.id)||o.groupId&&r.has(o.groupId)?y(f({},o),{status:"waiting_input",question:t.question,threadId:t.threadId}):o)})}function hd(e,t){let n=new Map(t.resolutions.map(o=>[o.annotationId,o])),r=new Map;for(let o of e.annotations){let i=n.get(o.id);i&&o.groupId&&r.set(o.groupId,i)}return y(f({},e),{annotations:e.annotations.map(o=>{var s,l,a;let i=n.get(o.id)||(o.groupId?r.get(o.groupId):void 0);return i?y(f({},o),{status:i.status,resolutionSummary:i.summary,scope:(l=(s=i.finalScope)!=null?s:i.inferredScope)!=null?l:null,replyCount:((a=o.replyCount)!=null?a:0)+1,question:void 0,threadId:o.threadId||t.threadId}):o})})}function yd(e,t){let{linkedSelectors:n,styleSelectors:r}=t,o=new Set(n),i=new Set(r),s=new Set,l=new Set;for(let p of e.annotations)p.linkedSelector&&o.has(p.linkedSelector)&&(s.add(p.id),p.groupId&&l.add(p.groupId));for(let p of e.annotations)p.groupId&&l.has(p.groupId)&&s.add(p.id);let a=e.annotations.filter(p=>!s.has(p.id)),d=e.styleModifications.filter(p=>!i.has(p.selector));if(a.length===e.annotations.length&&d.length===e.styleModifications.length)return e;let c=e.selectedAnnotationIds.filter(p=>!s.has(p)),u=e.inspectedElement&&i.has(e.inspectedElement.info.selector)?null:e.inspectedElement;return y(f({},e),{annotations:a,styleModifications:d,selectedAnnotationIds:c,lastSelectedId:c.length>0?c[c.length-1]:null,inspectedElement:u})}function bd(e,t){let n=e.spacingTokenChanges.findIndex(r=>r.tokenPath===t.tokenPath);return n>=0?y(f({},e),{spacingTokenChanges:e.spacingTokenChanges.map((r,o)=>o===n?t:r)}):y(f({},e),{spacingTokenChanges:[...e.spacingTokenChanges,t]})}function xd(e,t){return y(f({},e),{spacingTokenChanges:t})}function vd(e,t){let n=Cn(e),r=e.spacingTokenMods.findIndex(i=>i.tokenPath===t.tokenPath),o;if(r>=0){let i=e.spacingTokenMods[r],s=y(f({},t),{originalValue:i.originalValue,originalPx:i.originalPx});o=e.spacingTokenMods.map((l,a)=>a===r?s:l)}else o=[...e.spacingTokenMods,t];return y(f({},n),{spacingTokenMods:o})}function Sd(e,t){let n=Cn(e),r=e.spacingTokenMods.findIndex(a=>a.tokenPath===t.tokenPath),o=r>=0?e.spacingTokenMods[r].originalValue:t.originalValue,i=r>=0?e.spacingTokenMods[r].originalPx:parseFloat(t.originalValue)||0,s={tokenPath:t.tokenPath,originalValue:o,currentValue:"__deleted__",targets:r>=0?e.spacingTokenMods[r].targets:[],originalPx:i,currentPx:0},l;return r>=0?l=e.spacingTokenMods.map((a,d)=>d===r?s:a):l=[...e.spacingTokenMods,s],y(f({},n),{spacingTokenMods:l})}var wd={SET_ANNOTATING:Hc,SET_TOOL:Fc,SET_COLOR:$c,SET_STROKE_WIDTH:zc,START_PATH:Wc,CONTINUE_PATH:jc,CANCEL_PATH:Yc,FINISH_PATH:Gc,ADD_TEXT:Jc,UPDATE_TEXT:Uc,UPDATE_TEXT_SIZE:Vc,DELETE_ANNOTATION:Xc,MOVE_ANNOTATION:Kc,RESIZE_ANNOTATION:qc,PASTE_ANNOTATIONS:Zc,RESTORE_ANNOTATIONS:Qc,UNDO:ed,REDO:td,SELECT_ANNOTATION:nd,UPDATE_ANNOTATION_COLOR:od,MARK_CAPTURED:rd,CLEAR:id,SELECT_ELEMENT:sd,MODIFY_STYLE:ld,MODIFY_STYLES_BATCH:ad,CLEAR_STYLE:cd,CLEAR_ALL_STYLES:dd,RESTORE_STYLE_MODIFICATIONS:ud,UPDATE_LINKED_POSITIONS:pd,CLEANUP_ORPHANED:yd,SET_ANNOTATION_STATUS:fd,SET_ANNOTATION_THREAD:gd,SET_ANNOTATION_QUESTION:md,APPLY_RESOLUTIONS:hd,ADD_SPACING_TOKEN_CHANGE:bd,RESTORE_SPACING_TOKEN_CHANGES:xd,MODIFY_SPACING_TOKEN:vd,DELETE_SPACING_TOKEN:Sd};function Cd(e,t){let n=wd[t.type];return n?n(e,t.payload):e}function wl(){let[e,t]=Dc(Cd,_c);return Nc(()=>{let n=r=>{(r.metaKey||r.ctrlKey)&&r.key==="z"&&(r.preventDefault(),r.shiftKey?t({type:"REDO"}):t({type:"UNDO"}))};return window.addEventListener("keydown",n),()=>window.removeEventListener("keydown",n)},[]),[e,t]}import{useSyncExternalStore as kd}from"react";if(typeof window!="undefined"&&!window.__popmeltPathPatch){window.__popmeltPathPatch=!0;for(let e of["pushState","replaceState"]){let t=History.prototype[e];History.prototype[e]=function(...n){let r=window.location.pathname;t.apply(this,n),window.dispatchEvent(new CustomEvent("popmelt:locationchange",{detail:{prevPath:r}}))}}}function Ed(e){return window.addEventListener("popstate",e),window.addEventListener("popmelt:locationchange",e),()=>{window.removeEventListener("popstate",e),window.removeEventListener("popmelt:locationchange",e)}}function Td(){return window.location.pathname}function jo(){return kd(Ed,Td,()=>"/")}import{domToCanvas as Md}from"modern-screenshot";function Ci(e){let t=document.createElement("canvas").getContext("2d");return t?(t.fillStyle=e,t.fillStyle):"#888888"}function ki(e,t=[],n,r){let o=new Map,i=[];for(let l of e)if(l.groupId){let a=o.get(l.groupId)||[];a.push(l),o.set(l.groupId,a)}else i.push(l);let s=[];for(let[l,a]of o){let d=a.find(u=>u.type!=="text"),c=a.find(u=>u.type==="text");if(d){let u=d.linkedSelector||(c==null?void 0:c.linkedSelector),p=(c==null?void 0:c.imageCount)||d.imageCount,g=d.pathname||(c==null?void 0:c.pathname);s.push(f(y(f(f({id:d.id,type:d.type,instruction:c==null?void 0:c.text},u?{linkedSelector:u}:{}),g?{pathname:g}:{}),{elements:d.elements||[]}),p?{imageCount:p}:{}))}}for(let l of i)s.push(f(y(f(f({id:l.id,type:l.type,instruction:l.type==="text"?l.text:void 0},l.linkedSelector?{linkedSelector:l.linkedSelector}:{}),l.pathname?{pathname:l.pathname}:{}),{elements:l.elements||[]}),l.imageCount?{imageCount:l.imageCount}:{}));return f(f({timestamp:new Date().toISOString(),url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},scrollPosition:{x:window.scrollX,y:window.scrollY},annotations:s,styleModifications:t},n?{inspectedElement:n}:{}),r&&r.length>0?{spacingTokenChanges:r}:{})}function Id(e){if(!e.points||e.points.length===0)return null;let t=e.points.map(r=>r.x),n=e.points.map(r=>r.y);return{minX:Math.min(...t),minY:Math.min(...n),maxX:Math.max(...t),maxY:Math.max(...n)}}function Ld(e,t){if(e.length===0)return[];let n=e.map(c=>({annotation:c,bounds:Id(c)})).filter(c=>c.bounds!==null);if(n.length===0)return[];n.sort((c,u)=>c.bounds.minY-u.bounds.minY);let r=Math.min(...n.map(c=>c.bounds.minY)),o=Math.max(...n.map(c=>c.bounds.maxY));if(o-r<=t){let c=(r+o)/2,u=Math.max(0,c-t/2);return[{top:u,bottom:u+t,annotations:e}]}let i=[],s=50,l=Math.max(0,r-s),a=[],d=l;for(let{annotation:c,bounds:u}of n){let p=u.maxY+s;if(p-l<=t)a.push(c),d=Math.max(d,p);else{if(a.length>0){let g=(l+d)/2,w=Math.max(0,g-t/2);i.push({top:w,bottom:w+t,annotations:a})}l=Math.max(0,u.minY-s),a=[c],d=u.maxY+s}}if(a.length>0){let c=(l+d)/2,u=Math.max(0,c-t/2);i.push({top:u,bottom:u+t,annotations:a})}return i}function Rd(e){let t=new Map;for(let n of e)if(n.linkedSelector)try{let r=document.querySelector(n.linkedSelector);if(r){let o=r.getBoundingClientRect();t.set(n.id,{x:o.left+window.scrollX,y:o.top+window.scrollY,width:o.width,height:o.height})}}catch(r){}return t}function Ad(e,t,n,r,o){if(e.save(),e.scale(r,r),o)for(let i of t){let s=o.get(i.id);if(!s)continue;let l=s.y-n;e.fillStyle=i.color,e.globalAlpha=.05,e.fillRect(s.x,l,s.width,s.height),e.globalAlpha=1,e.strokeStyle=i.color,e.lineWidth=1,e.setLineDash([2,4]),e.strokeRect(s.x,l,s.width,s.height),e.setLineDash([])}for(let i of t){let s=i.points.map(l=>({x:l.x,y:l.y-n}));switch(e.strokeStyle=i.color,e.fillStyle=i.color,e.lineWidth=i.strokeWidth,e.lineCap="round",e.lineJoin="round",i.type){case"freehand":if(s.length<2)break;e.beginPath(),e.moveTo(s[0].x,s[0].y);for(let l=1;l<s.length;l++)e.lineTo(s[l].x,s[l].y);e.stroke();break;case"line":if(s.length<2)break;e.beginPath(),e.moveTo(s[0].x,s[0].y),e.lineTo(s[s.length-1].x,s[s.length-1].y),e.stroke();break;case"rectangle":{if(s.length<2)break;let l=s[0],a=s[s.length-1],d=Math.min(l.x,a.x),c=Math.min(l.y,a.y),u=Math.abs(a.x-l.x),p=Math.abs(a.y-l.y);e.strokeRect(d,c,u,p);break}case"circle":{if(s.length<2)break;let l=s[0],a=s[s.length-1],d=(l.x+a.x)/2,c=(l.y+a.y)/2,u=Math.abs(a.x-l.x)/2,p=Math.abs(a.y-l.y)/2;e.beginPath(),e.ellipse(d,c,u,p,0,0,Math.PI*2),e.stroke();break}case"text":{if(!i.text||s.length<1)break;let l=s[0],a=i.fontSize||16;e.font=`${a}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`,e.fillStyle=i.color;let c=(i.imageCount&&i.imageCount>0?`[${i.imageCount} image${i.imageCount>1?"s":""}] ${i.text}`:i.text).split(`
3
- `),u=a*1.2,p=4,g=0;for(let w of c)g=Math.max(g,e.measureText(w).width);e.fillRect(l.x-p,l.y-p,g+p*2,c.length*u+p*2),e.fillStyle="#ffffff",c.forEach((w,C)=>{e.fillText(w,l.x,l.y+a+C*u)});break}}}e.restore()}async function gr(e,t,n=[]){try{let r=window.devicePixelRatio||1,o=window.innerWidth,i=window.innerHeight,s=n.filter(c=>{var u;return((u=c.status)!=null?u:"pending")==="pending"});console.log("[Screenshot] Starting capture with",s.length,"active annotations (filtered",n.length-s.length,"captured)");let l=Rd(s),a=Ld(s,i);if(a.length===0){let c=await Cl(e,[],window.scrollY,o,i,r,l);return c?[c]:[]}let d=[];for(let c=0;c<a.length;c++){let u=a[c],p=await Cl(e,u.annotations,u.top,o,i,r,l);p?d.push(p):console.warn(`[Screenshot] Region ${c+1} failed to capture`)}return console.log("[Screenshot] Capture complete"),d}catch(r){return console.error("[Screenshot] Capture failed:",r),[]}}async function Cl(e,t,n,r,o,i,s){try{let l=await Md(e,{filter:c=>!(c instanceof HTMLElement&&(c.id==="devtools-canvas"||c.id==="devtools-toolbar"||c.id==="devtools-scrim"||c.dataset.devtools!==void 0)),scale:i,backgroundColor:"#ffffff",width:r,height:o,style:{transform:`translate(${-window.scrollX}px, ${-n}px)`}}),a=document.createElement("canvas");a.width=r*i,a.height=o*i;let d=a.getContext("2d");return d?(d.drawImage(l,0,0,r*i,o*i,0,0,r*i,o*i),Ad(d,t,n,i,s),new Promise(c=>{a.toBlob(u=>c(u),"image/png")})):null}catch(l){return console.error("Region capture failed:",l),null}}async function mr(e){if(e.length===0)return null;if(e.length===1)return e[0];let t=await Promise.all(e.map(l=>new Promise((a,d)=>{let c=new Image;c.onload=()=>a(c),c.onerror=d,c.src=URL.createObjectURL(l)}))),n=t[0].width,r=t.reduce((l,a)=>l+a.height,0),o=document.createElement("canvas");o.width=n,o.height=r;let i=o.getContext("2d");if(!i)return null;let s=0;for(let l of t)i.drawImage(l,0,s),s+=l.height,URL.revokeObjectURL(l.src);return new Promise(l=>{o.toBlob(a=>l(a),"image/png")})}async function kl(e,t,n){try{let r=Array.isArray(e)?e:[e];if(r.length===0)return!1;let o=await mr(r);if(!o)return!1;let i={"image/png":o},s=t&&t.length>0,l=n&&n.length>0;if(s||l){let a=t?t.filter(d=>{var c;return((c=d.status)!=null?c:"pending")==="pending"}):[];if(a.length>0||l){let d=ki(a,n||[]),c=new Blob([JSON.stringify(d,null,2)],{type:"text/plain"});i["text/plain"]=c}}return await navigator.clipboard.write([new ClipboardItem(i)]),!0}catch(r){return console.warn("Clipboard write failed:",r),!1}}import{useCallback as Zt,useEffect as hn,useMemo as ri,useRef as jt,useState as gt}from"react";import{useCallback as Jo,useRef as Od}from"react";function Ei(e,t,n,r){if(t.length<2)return;let o=t[0],i=t[t.length-1];if(!o||!i)return;let s=(o.x+i.x)/2,l=(o.y+i.y)/2,a=Math.abs(i.x-o.x)/2,d=Math.abs(i.y-o.y)/2;e.beginPath(),e.strokeStyle=n,e.lineWidth=r,e.ellipse(s,l,a,d,0,0,Math.PI*2),e.stroke()}function Ti(e,t,n,r){if(t.length<2)return;let o=t[0],i=t[t.length-1];if(!(!o||!i)){e.beginPath(),e.strokeStyle=n,e.lineWidth=r,e.lineCap="round",e.lineJoin="round",e.moveTo(o.x,o.y);for(let s=1;s<t.length-1;s++){let l=t[s],a=t[s+1];if(!l||!a)continue;let d=(l.x+a.x)/2,c=(l.y+a.y)/2;e.quadraticCurveTo(l.x,l.y,d,c)}e.lineTo(i.x,i.y),e.stroke()}}function Mi(e,t,n,r){if(t.length<2)return;let o=t[0],i=t[t.length-1];!o||!i||(e.beginPath(),e.strokeStyle=n,e.lineWidth=r,e.lineCap="round",e.moveTo(o.x,o.y),e.lineTo(i.x,i.y),e.stroke())}function Ii(e,t,n,r){if(t.length<2)return;let o=t[0],i=t[t.length-1];if(!o||!i)return;let s=Math.min(o.x,i.x),l=Math.min(o.y,i.y),a=Math.abs(i.x-o.x),d=Math.abs(i.y-o.y);e.beginPath(),e.strokeStyle=n,e.lineWidth=r,e.lineCap="round",e.lineJoin="round",e.strokeRect(s,l,a,d)}var Ut='"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';function Pd(e,t,n){if(!t||e.measureText(t).width<=n)return[t];let r=t.split(/\s+/),o=[],i="";for(let s of r){let l=i?i+" "+s:s;i&&e.measureText(l).width>n?(o.push(i),i=s):i=l}return i&&o.push(i),o.length>0?o:[t]}function Yo(e){let t=window.innerWidth-e-16;return Math.max(60,Math.min(400,t))}function El(e,t,n){let r=[];for(let o of t)r.push(...Pd(e,o,n));return r}function Go(e,t,n){if(e.measureText(t).width<=n)return t;let r="\u2026";for(let o=t.length-1;o>0;o--){let i=t.slice(0,o)+r;if(e.measureText(i).width<=n)return i}return r}function Tl(e,t,n,r,o=12,i,s){if(!n)return;let l=o*1.4,a=n.replace(/\n/g," "),d=i!==void 0?i+". "+a:a;e.font=`${o}px ${Ut}`,e.textBaseline="middle";let c=s!==void 0?Math.min(400,Math.max(60,window.innerWidth-s-16)):400,u=Go(e,d,c),p=e.measureText(u).width;e.fillStyle=r,e.fillRect(t.x-4,t.y-4,p+8,l+8),e.fillStyle="#ffffff",e.fillText(u,t.x,t.y+l/2)}var Ml=11,Li=4,Bd=`600 ${Ml}px system-ui, -apple-system, sans-serif`;function Ri(e,t,n){return e.map(r=>({x:r.x-t,y:r.y-n}))}function Nd(e,t,n,r,o,i){let s=String(r);e.font=Bd;let a=e.measureText(s).width+Li*2,d=Ml+Li*2,c=t-a/2,u=n+i/2+2;e.fillStyle=o,e.fillRect(c,u,a,d),e.fillStyle="#ffffff",e.textBaseline="middle",e.fillText(s,c+Li,u+d/2)}function Dd(e,t){if(e.points.length<2&&e.type!=="text")return null;switch(e.type){case"rectangle":case"freehand":{let n,r;if(e.type==="freehand")n=Math.min(...e.points.map(o=>o.x)),r=Math.max(...e.points.map(o=>o.y));else{let o=e.points[0],i=e.points[e.points.length-1];n=Math.min(o.x,i.x),r=Math.max(o.y,i.y)}return{x:n,y:r}}case"circle":{let n=e.points[0],r=e.points[e.points.length-1],o=Math.min(n.x,r.x),i=(Math.min(n.y,r.y)+Math.max(n.y,r.y))/2;return{x:o,y:i}}case"line":{let n=e.points[0],r=e.points[e.points.length-1],o=n.y>r.y?n:r;return{x:o.x,y:o.y}}default:return null}}function Il(){let e=Od(null),t=Jo(()=>{let l=e.current;if(!l)return;let a=l.getContext("2d");a&&a.clearRect(0,0,l.width,l.height)},[]),n=Jo((l,a,d)=>{var w;let c=e.current;if(!c)return;let u=c.getContext("2d");if(!u)return;let g=((w=l.status)!=null?w:l.captured?"in_flight":"pending")==="pending"||d?l.color:"#999999";switch(l.type){case"freehand":Ti(u,l.points,g,l.strokeWidth);break;case"line":Mi(u,l.points,g,l.strokeWidth);break;case"rectangle":Ii(u,l.points,g,l.strokeWidth);break;case"circle":Ei(u,l.points,g,l.strokeWidth);break;case"text":l.text&&l.points[0]&&Tl(u,l.points[0],l.text,g,l.fontSize,a,l.points[0].x);break}},[]),r=Jo((l,a,d,c)=>{let u=e.current;if(!u||l.length<2)return;let p=u.getContext("2d");if(p)switch(a){case"freehand":Ti(p,l,d,c);break;case"line":Mi(p,l,d,c);break;case"rectangle":Ii(p,l,d,c);break;case"circle":Ei(p,l,d,c);break}},[]),o=Jo((l,a)=>{let d=e.current;if(!d||l.points.length<2)return;let c=d.getContext("2d");if(c){if(c.fillStyle="#ffffff",c.strokeStyle=l.color,c.lineWidth=1.5,l.type==="line"){let u=l.points[0],p=l.points[l.points.length-1];[u,p].forEach(g=>{c.beginPath(),c.arc(g.x,g.y,a/2,0,Math.PI*2),c.fill(),c.stroke()});return}if(l.type==="circle"){let u=l.points[0],p=l.points[l.points.length-1],g=Math.min(u.x,p.x),w=Math.max(u.x,p.x),C=Math.min(u.y,p.y),R=Math.max(u.y,p.y),P=(g+w)/2,G=(C+R)/2;[{x:P,y:C},{x:P,y:R},{x:g,y:G},{x:w,y:G}].forEach(T=>{c.beginPath(),c.rect(T.x-a/2,T.y-a/2,a,a),c.fill(),c.stroke()});return}if(l.type==="rectangle"||l.type==="freehand"){let u,p,g,w;if(l.type==="freehand")u=Math.min(...l.points.map(R=>R.x)),p=Math.max(...l.points.map(R=>R.x)),g=Math.min(...l.points.map(R=>R.y)),w=Math.max(...l.points.map(R=>R.y));else{let R=l.points[0],P=l.points[l.points.length-1];u=Math.min(R.x,P.x),p=Math.max(R.x,P.x),g=Math.min(R.y,P.y),w=Math.max(R.y,P.y)}[{x:u,y:g},{x:p,y:g},{x:u,y:w},{x:p,y:w}].forEach(R=>{c.beginPath(),c.rect(R.x-a/2,R.y-a/2,a,a),c.fill(),c.stroke()})}}},[]),i=Jo((l,a,d,c,u,p,g,w=0,C=0,R,P)=>{var G;if(t(),l.forEach(M=>{var W;let T=y(f({},M),{points:Ri(M.points,w,C)}),x=R==null?void 0:R.get(M.id),N=(W=P==null?void 0:P.has(M.id))!=null?W:!1;n(T,x,N)}),a.length>0){let M=Ri(a,w,C);r(M,d,c,u)}if(p&&p.length>0&&g){let M=e.current,T=M==null?void 0:M.getContext("2d");for(let x of p){let N=l.find(W=>W.id===x);if(N){let W=y(f({},N),{points:Ri(N.points,w,C)});if(o(W,g),T&&N.type!=="text"&&R&&!(N.groupId&&l.some(H=>H.groupId===N.groupId&&H.type==="text"))){let H=R.get(N.id);if(H!==void 0){let V=Dd(W,g);if(V){let A=((G=N.status)!=null?G:N.captured?"in_flight":"pending")==="pending"?N.color:"#999999";Nd(T,V.x,V.y,H,A,g)}}}}}}},[t,n,r,o]),s=Jo(()=>{let l=e.current;if(!l)return;let a=window.devicePixelRatio||1;l.width=window.innerWidth*a,l.height=window.innerHeight*a;let d=l.getContext("2d");d&&d.scale(a,a)},[]);return{canvasRef:e,clearCanvas:t,drawAnnotation:n,drawCurrentPath:r,redrawAll:i,resizeCanvas:s}}import{useEffect as _d,useRef as Hd}from"react";function Ll(){let e=Hd({shift:!1,cmd:!1});return _d(()=>{let t=o=>{o.key==="Shift"&&(e.current.shift=!0),(o.key==="Meta"||o.key==="Control")&&(e.current.cmd=!0)},n=o=>{o.key==="Shift"&&(e.current.shift=!1),(o.key==="Meta"||o.key==="Control")&&(e.current.cmd=!1)},r=()=>{e.current={shift:!1,cmd:!1}};return window.addEventListener("keydown",t,!0),window.addEventListener("keyup",n,!0),window.addEventListener("blur",r),()=>{window.removeEventListener("keydown",t,!0),window.removeEventListener("keyup",n,!0),window.removeEventListener("blur",r)}},[]),e}import{useEffect as Fd}from"react";function Rl(e,t,n,r,o){Fd(()=>{let i=s=>{if(e){if(e.linkedSelector)return;s.preventDefault(),s.stopPropagation();let a=s.deltaY>0?-2:2;t(d=>d?y(f({},d),{fontSize:Math.max(12,Math.min(72,d.fontSize+a))}):null);return}if(!n)return;s.preventDefault();let l=r.find(a=>a.id===n);if(l&&l.type==="text"&&!l.linkedSelector){let a=l.fontSize||12,d=s.deltaY>0?-2:2;o({type:"UPDATE_TEXT_SIZE",payload:{id:n,fontSize:a+d}})}};return window.addEventListener("wheel",i,{passive:!1}),()=>{window.removeEventListener("wheel",i)}},[n,e,r,o,t])}import{useCallback as Yl,useEffect as Xr,useRef as Gl,useState as wr}from"react";function Fr(e){let t=Object.keys(e).find(o=>o.startsWith("__reactFiber$")||o.startsWith("__reactInternalInstance$"));if(!t)return null;let n=e[t],r=[];for(;n;){let o=n.type,i=(o==null?void 0:o.displayName)||(o==null?void 0:o.name);i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&r.unshift(i),n=n.return}return r.length>0?{name:r[r.length-1],path:r}:null}function Ai(e){let t=Object.keys(e).find(o=>o.startsWith("__reactFiber$")||o.startsWith("__reactInternalInstance$"));if(!t)return[];let n=e[t],r=[];for(;n;){let o=n.type,i=typeof o=="function"||typeof o=="object"?(o==null?void 0:o.displayName)||(o==null?void 0:o.name):null;i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&r.push({name:i,fiber:n}),n=n.return}return r.reverse(),r}function $r(e){let t=e,n=new Set;for(;t&&!n.has(t);){if(n.add(t),t.stateNode instanceof Element)return t.stateNode;t.child?t=t.child:t=null}return null}function Al(e){if(e.id)return`#${e.id}`;let t=e.tagName.toLowerCase(),n=Array.from(e.classList).slice(0,3).join(".");return n?`${t}.${n}`:t}function Rn(e){if(e.id&&!e.id.startsWith("radix-")&&!e.id.startsWith(":"))return`#${CSS.escape(e.id)}`;let t=[],n=e;for(;n&&n!==document.documentElement;){let r=n.tagName.toLowerCase();if(n.id&&!n.id.startsWith("radix-")&&!n.id.startsWith(":")){t.unshift(`#${CSS.escape(n.id)}`);break}let o=Array.from(n.classList).filter(s=>!s.startsWith("_")&&s.length<30).slice(0,2);o.length>0&&(r+="."+o.map(s=>CSS.escape(s)).join("."));let i=n.parentElement;if(i){let s=Array.from(i.children).filter(l=>l.tagName===n.tagName);if(s.length>1){let l=s.indexOf(n)+1;r+=`:nth-of-type(${l})`}}t.unshift(r),n=i}return t.join(" > ")}function vn(e){try{return document.querySelector(e)}catch(t){return null}}function zr(e,t=0){var a;let n=Ai(e);if(n.length===0)return null;let r=n.map(d=>d.name),o=n.length-1,i=Math.max(0,Math.min(n.length-1,o-t)),s=n[i],l=(a=$r(s.fiber))!=null?a:e;return{name:s.name,path:r,depthIndex:i,rootElement:l}}function Pl(e,t){var i,s;let n=Ai(e),r=t.toLowerCase(),o=-1;for(let l=n.length-1;l>=0;l--){let a=n[l].name;if(a===t){let d=(i=$r(n[l].fiber))!=null?i:e;return{name:t,path:n.map(c=>c.name),depthIndex:l,rootElement:d}}if(o===-1){let d=a.toLowerCase();(d.length>=4&&r.includes(d)||r.length>=4&&d.includes(r))&&(o=l)}}if(o>=0){let l=(s=$r(n[o].fiber))!=null?s:e;return{name:t,path:n.map(a=>a.name),depthIndex:o,rootElement:l}}return null}function Uo(e){let t=Vo(),n=[],r=new Set,o=t.currentNode;for(;o=t.nextNode();){let i=Pl(o,e);i&&!r.has(i.rootElement)&&(r.add(i.rootElement),n.push(i))}return n}function Pi(e){let t=new Map;if(e.size===0)return t;let n=new Set(e),r=Vo(),o=new Set,i=r.currentNode;for(;(i=r.nextNode())&&n.size>0;)for(let s of n){let l=Pl(i,s);if(!l||o.has(l.rootElement))continue;o.add(l.rootElement);let a=l.rootElement.getBoundingClientRect();t.set(s,a.top+window.scrollY),n.delete(s);break}for(let s of n)t.set(s,1/0);return t}function Vo(){return document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT,{acceptNode(e){return e.closest("#devtools-toolbar, #devtools-canvas, #devtools-scrim, [data-popmelt-panel]")?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}})}function kn(e){let t={selector:Al(e),tagName:e.tagName.toLowerCase()};e.id&&(t.id=e.id),e.classList.length>0&&(t.className=Array.from(e.classList).join(" "));let n=Ol(e);n&&n.length>0&&n.length<200&&(t.textContent=n);let r={};for(let s of e.attributes)s.name.startsWith("data-")&&(r[s.name]=s.value);Object.keys(r).length>0&&(t.dataAttributes=r);let o=Fr(e);o&&(t.reactComponent=o.name);let i=$d(e);return i&&(t.context=i),t}function Ol(e){let t="";for(let n of e.childNodes)n.nodeType===Node.TEXT_NODE&&(t+=n.textContent||"");return t.trim()}function Io(e,t){let n=document.elementsFromPoint(e,t);for(let r of n)if(r instanceof HTMLElement&&!(r.id==="devtools-canvas"||r.id==="devtools-toolbar"||r.id==="devtools-scrim")&&!r.closest("#devtools-toolbar")&&!(r.dataset.devtools||r.closest("[data-devtools]"))&&!["html","body"].includes(r.tagName.toLowerCase()))return r;return null}function $d(e){let t=e.parentElement,n=["section","article","nav","aside","header","footer","main"];for(;t&&t!==document.body;){let r=t.tagName.toLowerCase();if(n.includes(r)&&t.id)return`${r}#${t.id}`;if(t.id&&!t.id.startsWith("radix-")&&!t.id.startsWith(":"))return`${r}#${t.id}`;t=t.parentElement}return null}function Bl(e){let t=new Set,n=[],r=window.scrollX,o=window.scrollY,i=[{x:(e.minX+e.maxX)/2,y:(e.minY+e.maxY)/2},{x:e.minX,y:e.minY},{x:e.maxX,y:e.minY},{x:e.minX,y:e.maxY},{x:e.maxX,y:e.maxY}];for(let s of i){let l=s.x-r,a=s.y-o;if(l<0||a<0||l>window.innerWidth||a>window.innerHeight)continue;let d=Io(l,a);d&&!t.has(d)&&(t.add(d),n.push(kn(d)))}return n.slice(0,3)}function Oi(e){if(e.length===0)return[];let t=e.map(r=>r.x),n=e.map(r=>r.y);return Bl({minX:Math.min(...t),minY:Math.min(...n),maxX:Math.max(...t),maxY:Math.max(...n)})}function qt(e,t){return e.style.getPropertyValue(t)!==""}function zd(e,t=30){if(e<=0)return[];let n=[],r=Vo(),o=.5,i=r.currentNode;for(;(i=r.nextNode())&&n.length<t;){let s=i,l=s.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let a=getComputedStyle(s);!qt(s,"padding-top")&&Math.abs((parseFloat(a.paddingTop)||0)-e)<o&&n.push({element:s,property:"padding-top"}),!qt(s,"padding-bottom")&&Math.abs((parseFloat(a.paddingBottom)||0)-e)<o&&n.length<t&&n.push({element:s,property:"padding-bottom"}),!qt(s,"padding-left")&&Math.abs((parseFloat(a.paddingLeft)||0)-e)<o&&n.length<t&&n.push({element:s,property:"padding-left"}),!qt(s,"padding-right")&&Math.abs((parseFloat(a.paddingRight)||0)-e)<o&&n.length<t&&n.push({element:s,property:"padding-right"}),!qt(s,"margin-top")&&Math.abs((parseFloat(a.marginTop)||0)-e)<o&&n.length<t&&n.push({element:s,property:"margin-top"}),!qt(s,"margin-bottom")&&Math.abs((parseFloat(a.marginBottom)||0)-e)<o&&n.length<t&&n.push({element:s,property:"margin-bottom"}),!qt(s,"margin-left")&&Math.abs((parseFloat(a.marginLeft)||0)-e)<o&&n.length<t&&n.push({element:s,property:"margin-left"}),!qt(s,"margin-right")&&Math.abs((parseFloat(a.marginRight)||0)-e)<o&&n.length<t&&n.push({element:s,property:"margin-right"});let d=a.display;if((d.includes("flex")||d.includes("grid"))&&n.length<t){let c=qt(s,"gap"),u=parseFloat(a.gap)||0,p=parseFloat(a.rowGap)||0,g=parseFloat(a.columnGap)||0;!c&&Math.abs(u-e)<o?n.push({element:s,property:"gap"}):!qt(s,"row-gap")&&Math.abs(p-e)<o?n.push({element:s,property:"row-gap"}):!qt(s,"column-gap")&&Math.abs(g-e)<o&&n.push({element:s,property:"column-gap"})}}return n}function Bi(e,t=30){if(e<=0)return[];let n=[],r=Vo(),o=.5,i=r.currentNode;for(;(i=r.nextNode())&&n.length<t;){let s=i,l=s.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let a=getComputedStyle(s),d=parseFloat(a.borderTopWidth)||0,c=parseFloat(a.borderRightWidth)||0,u=parseFloat(a.borderBottomWidth)||0,p=parseFloat(a.borderLeftWidth)||0,g=s.clientWidth,w=s.clientHeight,C=parseFloat(a.paddingTop)||0;!qt(s,"padding-top")&&Math.abs(C-e)<o&&n.push({x:l.left+p,y:l.top+d,width:g,height:e,direction:"vertical",property:"padding-top"});let R=parseFloat(a.paddingBottom)||0;!qt(s,"padding-bottom")&&Math.abs(R-e)<o&&n.length<t&&n.push({x:l.left+p,y:l.top+d+w-e,width:g,height:e,direction:"vertical",property:"padding-bottom"});let P=parseFloat(a.paddingLeft)||0;!qt(s,"padding-left")&&Math.abs(P-e)<o&&n.length<t&&n.push({x:l.left+p,y:l.top+d,width:e,height:w,direction:"horizontal",property:"padding-left"});let G=parseFloat(a.paddingRight)||0;!qt(s,"padding-right")&&Math.abs(G-e)<o&&n.length<t&&n.push({x:l.left+p+g-e,y:l.top+d,width:e,height:w,direction:"horizontal",property:"padding-right"});let M=parseFloat(a.marginTop)||0;!qt(s,"margin-top")&&Math.abs(M-e)<o&&n.length<t&&n.push({x:l.left,y:l.top-e,width:l.width,height:e,direction:"vertical",property:"margin-top"});let T=parseFloat(a.marginBottom)||0;!qt(s,"margin-bottom")&&Math.abs(T-e)<o&&n.length<t&&n.push({x:l.left,y:l.bottom,width:l.width,height:e,direction:"vertical",property:"margin-bottom"});let x=parseFloat(a.marginLeft)||0;!qt(s,"margin-left")&&Math.abs(x-e)<o&&n.length<t&&n.push({x:l.left-e,y:l.top,width:e,height:l.height,direction:"horizontal",property:"margin-left"});let N=parseFloat(a.marginRight)||0;!qt(s,"margin-right")&&Math.abs(N-e)<o&&n.length<t&&n.push({x:l.right,y:l.top,width:e,height:l.height,direction:"horizontal",property:"margin-right"});let W=a.display;if((W.includes("flex")||W.includes("grid"))&&n.length<t&&!qt(s,"gap")){let H=Array.from(s.children).filter(V=>{let k=getComputedStyle(V);return k.display!=="none"&&k.position!=="absolute"&&k.position!=="fixed"});if(H.length>=2)for(let V=0;V<H.length-1&&n.length<t;V++){let k=H[V].getBoundingClientRect(),A=H[V+1].getBoundingClientRect(),Q=A.top-k.bottom;Math.abs(Q-e)<o&&Q>.5&&n.push({x:Math.min(k.left,A.left),y:k.bottom,width:Math.max(k.right,A.right)-Math.min(k.left,A.left),height:Q,direction:"vertical",property:"gap"});let ie=A.left-k.right;Math.abs(ie-e)<o&&ie>.5&&n.push({x:k.right,y:Math.min(k.top,A.top),width:ie,height:Math.max(k.bottom,A.bottom)-Math.min(k.top,A.top),direction:"horizontal",property:"gap"})}}}return n}function Wr(e){return typeof e=="string"?{value:e}:e}var Dl={gap:["gap","row-gap","column-gap"],padding:["padding-top","padding-bottom","padding-left","padding-right"],margin:["margin-top","margin-bottom","margin-left","margin-right"]};function Nl(e,t){let n=Dl[t];return n?n.includes(e):!1}function Wd(e,t){let n=e.split(/\s+/);for(let r of n){if(r===t)return!0;let o=r.lastIndexOf(":");if(o>=0&&r.slice(o+1)===t)return!0}return!1}function jd(e){var l,a;let t=e.lastIndexOf(":"),n=t>=0?e.slice(t+1):e,r=n.indexOf("-");if(r<0)return null;let o=n.slice(0,r),i={gap:"gap","gap-x":"column-gap","gap-y":"row-gap",p:"padding",pt:"padding-top",pb:"padding-bottom",pl:"padding-left",pr:"padding-right",px:"padding-left",py:"padding-top",m:"margin",mt:"margin-top",mb:"margin-bottom",ml:"margin-left",mr:"margin-right",mx:"margin-left",my:"margin-top"},s=n.slice(0,n.indexOf("-",r+1)>0?n.indexOf("-",r+1):r);return(a=(l=i[s])!=null?l:i[o])!=null?a:null}function Ni(e,t=30){let n=parseFloat(e.value);if(isNaN(n)||n<=0)return[];if(e.bindings&&e.bindings.length>0){let o=[],i=Vo(),s=i.currentNode;for(;(s=i.nextNode())&&o.length<t;){let l=s,a=l.getBoundingClientRect();if(a.bottom<-50||a.top>window.innerHeight+50||a.right<-50||a.left>window.innerWidth+50||a.width<1||a.height<1)continue;let d=l.className;if(typeof d=="string")for(let c of e.bindings){if(!Wd(d,c))continue;let u=jd(c);if(u&&!(e.property&&!Nl(u,e.property))){o.push({element:l,property:u});break}}}return o}let r=zd(n,t*2);return e.property?r.filter(o=>Nl(o.property,e.property)).slice(0,t):r.slice(0,t)}function Di(e,t=30){let n=Ni(e,t),r=[];for(let o of n){let i=o.element,s=i.getBoundingClientRect(),l=getComputedStyle(i),a=parseFloat(l.borderTopWidth)||0,d=parseFloat(l.borderRightWidth)||0,c=parseFloat(l.borderLeftWidth)||0,u=i.clientWidth,p=i.clientHeight;switch(o.property){case"padding-top":{let g=parseFloat(l.paddingTop)||0;r.push({x:s.left+c,y:s.top+a,width:u,height:g,direction:"vertical",property:o.property});break}case"padding-bottom":{let g=parseFloat(l.paddingBottom)||0;r.push({x:s.left+c,y:s.top+a+p-g,width:u,height:g,direction:"vertical",property:o.property});break}case"padding-left":{let g=parseFloat(l.paddingLeft)||0;r.push({x:s.left+c,y:s.top+a,width:g,height:p,direction:"horizontal",property:o.property});break}case"padding-right":{let g=parseFloat(l.paddingRight)||0;r.push({x:s.left+c+u-g,y:s.top+a,width:g,height:p,direction:"horizontal",property:o.property});break}case"margin-top":{let g=parseFloat(l.marginTop)||0;r.push({x:s.left,y:s.top-g,width:s.width,height:g,direction:"vertical",property:o.property});break}case"margin-bottom":{let g=parseFloat(l.marginBottom)||0;r.push({x:s.left,y:s.bottom,width:s.width,height:g,direction:"vertical",property:o.property});break}case"margin-left":{let g=parseFloat(l.marginLeft)||0;r.push({x:s.left-g,y:s.top,width:g,height:s.height,direction:"horizontal",property:o.property});break}case"margin-right":{let g=parseFloat(l.marginRight)||0;r.push({x:s.right,y:s.top,width:g,height:s.height,direction:"horizontal",property:o.property});break}case"gap":case"row-gap":case"column-gap":{let g=Array.from(i.children).filter(w=>{let C=getComputedStyle(w);return C.display!=="none"&&C.position!=="absolute"&&C.position!=="fixed"});for(let w=0;w<g.length-1&&r.length<t;w++){let C=g[w].getBoundingClientRect(),R=g[w+1].getBoundingClientRect(),P=R.top-C.bottom;P>.5&&r.push({x:Math.min(C.left,R.left),y:C.bottom,width:Math.max(C.right,R.right)-Math.min(C.left,R.left),height:P,direction:"vertical",property:"gap"});let G=R.left-C.right;G>.5&&r.push({x:C.right,y:Math.min(C.top,R.top),width:G,height:Math.max(C.bottom,R.bottom)-Math.min(C.top,R.top),direction:"horizontal",property:"gap"})}break}}}return r}function _l(e,t){let n=new Set,r=hr(t);for(let o of e){let i=Fl[o.property];if(!i)continue;let s=o.element.className;if(typeof s=="string")for(let l of i){let a=`${l}-${r}`;for(let d of s.split(/\s+/)){let c=d.lastIndexOf(":"),u=c>=0?d.slice(c+1):d;if(u===a){n.add(u);break}}}}return[...n]}function Hl(e){let t=new Set;for(let n of e)for(let[r,o]of Object.entries(Dl))if(o.includes(n.property)){t.add(r);break}if(t.size===1)return[...t][0]}function _i(e,t,n){if(t===n)return e;let r=hr(t),o=hr(n);return e.map(i=>{let s=i.lastIndexOf("-");if(s<0)return i;let l=i.slice(0,s),a=i.slice(s+1);return a===r||a===`[${t}px]`?`${l}-${o}`:i})}var Yd={0:"0",1:"px",2:"0.5",4:"1",6:"1.5",8:"2",12:"3",16:"4",20:"5",24:"6",28:"7",32:"8",40:"10",48:"12",64:"16",80:"20",96:"24"};function hr(e){var t;return(t=Yd[e])!=null?t:`[${e}px]`}var Fl={"padding-top":["pt","py","p"],"padding-bottom":["pb","py","p"],"padding-left":["pl","px","p"],"padding-right":["pr","px","p"],"margin-top":["mt","my","m"],"margin-bottom":["mb","my","m"],"margin-left":["ml","mx","m"],"margin-right":["mr","mx","m"],gap:["gap"],"row-gap":["gap-y","gap"],"column-gap":["gap-x","gap"]};function Gd(e,t,n,r){let o=Fl[t];if(!o)return null;let i=hr(n);for(let s of o){let l=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+s+"-(?:"+Jd(i)+"|\\["+n+"px\\]))(?:\\s|$)"),a=e.match(l);if(a!=null&&a[1]){let d=hr(r),c=a[1].lastIndexOf(":"),u=c>=0?a[1].slice(0,c+1):"";return{matched:a[1],suggested:`${u}${s}-${d}`}}}return null}function Jd(e){return e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function $l(e,t,n){let r=new Set,o=[];for(let i of e){let s=Rn(i.element),l=`${s}::${i.property}`;if(r.has(l))continue;r.add(l);let a=Fr(i.element),d=i.element.className||"",c=Gd(d,i.property,t,n);o.push({selector:s,reactComponent:a==null?void 0:a.name,className:d,property:i.property,matchedClass:c==null?void 0:c.matched,suggestedClass:c==null?void 0:c.suggested})}return o}function yr(e,t){return window.getComputedStyle(e).getPropertyValue(t)}function Hi(e,t){if(e instanceof HTMLElement){let r=e.style.getPropertyValue(t);if(r)return r}let n=Ud(e,t);return n&&n.includes("var(")?n:yr(e,t)}function Ud(e,t){let n=t.replace(/-([a-z])/g,(r,o)=>o.toUpperCase());try{for(let r of document.styleSheets)try{let o=r.cssRules||r.rules;for(let i of o)if(i instanceof CSSStyleRule&&e.matches(i.selectorText)){let s=i.style.getPropertyValue(t);if(s&&s.includes("var("))return s;let l=i.style[n];if(l&&l.includes("var("))return l}}catch(o){}}catch(r){}return null}function jr(e,t){if(e instanceof HTMLElement){let r=e.style.getPropertyValue(t);if(r)return r}let n=t.replace(/-([a-z])/g,(r,o)=>o.toUpperCase());try{for(let r of document.styleSheets)try{let o=r.cssRules||r.rules;for(let i of o)if(i instanceof CSSStyleRule&&e.matches(i.selectorText)){let s=i.style.getPropertyValue(t);if(s)return s;let l=i.style[n];if(l)return l}}catch(o){}}catch(r){}return null}function Yr(e){let t=window.getComputedStyle(e).display;return t==="flex"||t==="inline-flex"||t==="grid"||t==="inline-grid"}function br(e){let t=window.getComputedStyle(e);return{row:parseFloat(t.rowGap)||0,column:parseFloat(t.columnGap)||0}}function Vd(e){let t=[];for(let n of e){let r=t.find(o=>o.axis!==n.axis?!1:n.axis==="row"?Math.abs(o.y-n.y)<2&&Math.abs(o.h-n.h)<2:Math.abs(o.x-n.x)<2&&Math.abs(o.w-n.w)<2);if(r)if(n.axis==="row"){let o=Math.min(r.x,n.x),i=Math.max(r.x+r.w,n.x+n.w);r.x=o,r.w=i-o}else{let o=Math.min(r.y,n.y),i=Math.max(r.y+r.h,n.y+n.h);r.y=o,r.h=i-o}else t.push(f({},n))}return t}function Lo(e){let t=Array.from(e.children).filter(a=>{if(!(a instanceof HTMLElement))return!1;let d=window.getComputedStyle(a);return d.display!=="none"&&d.position!=="absolute"&&d.position!=="fixed"});if(t.length<2)return[];let n=[],r=e.getBoundingClientRect(),i=window.getComputedStyle(e).flexDirection,s=i==="column"||i==="column-reverse",l=6;for(let a=0;a<t.length-1;a++){let d=t[a].getBoundingClientRect(),c=t[a+1].getBoundingClientRect();if(c.left>d.right+.5&&n.push({axis:"column",x:d.right,y:r.top,w:c.left-d.right,h:r.height}),c.top>d.bottom+.5&&n.push({axis:"row",x:r.left,y:d.bottom,w:r.width,h:c.top-d.bottom}),!(c.left>d.right+.5)&&!(c.top>d.bottom+.5))if(s){let u=(d.bottom+c.top)/2;n.push({axis:"row",x:r.left,y:u-l/2,w:r.width,h:l})}else{let u=(d.right+c.left)/2;n.push({axis:"column",x:u-l/2,y:r.top,w:l,h:r.height})}}return Vd(n)}function Fi(e,t){let n=window.getComputedStyle(e),r=n.display;if(r!=="flex"&&r!=="inline-flex")return!1;let o=n.justifyContent;if(o!=="space-between"&&o!=="space-around"&&o!=="space-evenly"&&o!=="stretch")return!1;let i=n.flexDirection;return!(t!==(i==="column"||i==="column-reverse"?"row":"column")||parseFloat(t==="row"?n.rowGap:n.columnGap)>0)}function Xo(e){let t=window.getComputedStyle(e);return{top:parseFloat(t.paddingTop)||0,right:parseFloat(t.paddingRight)||0,bottom:parseFloat(t.paddingBottom)||0,left:parseFloat(t.paddingLeft)||0}}function Ro(e){let t=window.getComputedStyle(e);return{"top-left":parseFloat(t.borderTopLeftRadius)||0,"top-right":parseFloat(t.borderTopRightRadius)||0,"bottom-right":parseFloat(t.borderBottomRightRadius)||0,"bottom-left":parseFloat(t.borderBottomLeftRadius)||0}}function $i(e){for(let t of e.childNodes)if(t.nodeType===Node.TEXT_NODE&&(t.textContent||"").trim().length>0)return!0;return!1}function Ko(e){var c,u;let t=document.createRange(),n=!1;for(let p of e.childNodes)p.nodeType===Node.TEXT_NODE&&(p.textContent||"").trim().length>0&&(n||(t.setStart(p,0),n=!0),t.setEnd(p,(u=(c=p.textContent)==null?void 0:c.length)!=null?u:0));if(!n)return null;let r=t.getBoundingClientRect(),o=window.getComputedStyle(e),i=parseFloat(o.fontSize)||16,s=parseFloat(o.lineHeight);isNaN(s)&&(s=i*1.2);let l=Math.max(1,t.getClientRects().length),a=Math.max(r.height,l*s),d=(a-r.height)/2;return new DOMRect(r.x,r.y-d,r.width,a)}function xr(e){let t=window.getComputedStyle(e),n=parseFloat(t.fontSize)||16,r=parseFloat(t.lineHeight);return isNaN(r)&&(r=n*1.2),{fontSize:n,lineHeight:r}}function Ve(e,t,n){e instanceof HTMLElement&&e.style.setProperty(t,n,"important")}function zi(e,t,n){e instanceof HTMLElement&&e.style.removeProperty(t)}function Gr(e){var t;for(let n of e){let r=vn(n.selector);if(!r&&n.durableSelector&&(r=vn(n.durableSelector),r)){let o=(t=n.selector.match(/\[data-pm="([^"]+)"\]/))==null?void 0:t[1];o&&r.setAttribute("data-pm",o)}if(r)for(let o of n.changes)Ve(r,o.property,o.modified)}}function Wi(e,t){let n=vn(e);if(!n)return;let r=t.find(o=>o.selector===e);if(r)for(let o of r.changes)zi(n,o.property,o.original)}function Jr(e){for(let t of e){let n=vn(t.selector);if(n)for(let r of t.changes)zi(n,r.property,r.original)}}function Wl(e,t,n,r){if(e)for(let o of e){if(o instanceof CSSGroupingRule){Wl(o.cssRules,t,n,r);continue}if(o instanceof CSSStyleRule){let i=o.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&Xd(o.style,t,n,r)}}}function Xd(e,t,n,r){for(let o=0;o<e.length;o++){let i=e[o];if(i!=null&&i.startsWith("--")){if(n.has(i))continue;n.add(i);let s=t.getPropertyValue(i).trim();jl(s)&&r.push({name:i,value:s,usage:`var(${i})`})}}}var Ur=null,Kd=5e3;function ji(){if(Ur&&Date.now()-Ur.timestamp<Kd)return Ur.variables;let e=[],t=new Set,n=getComputedStyle(document.documentElement);try{for(let i of document.styleSheets)try{Wl(i.cssRules||i.rules,n,t,e)}catch(s){}}catch(i){}let r=document.documentElement.style;for(let i=0;i<r.length;i++){let s=r[i];if(s!=null&&s.startsWith("--")&&!t.has(s)){t.add(s);let l=n.getPropertyValue(s).trim();jl(l)&&e.push({name:s,value:l,usage:`var(${s})`})}}let o=e.sort((i,s)=>i.name.localeCompare(s.name));return Ur={variables:o,timestamp:Date.now()},o}function jl(e){if(!e)return!1;let t=e.toLowerCase().trim();return!!(/^#([0-9a-f]{3}|[0-9a-f]{4}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)||t.startsWith("rgb")||t.startsWith("hsl")||t.startsWith("oklch")||t.startsWith("oklab")||t.startsWith("lch")||t.startsWith("lab")||["transparent","currentcolor","inherit","white","black","red","green","blue","yellow","orange","purple","pink","gray","grey"].includes(t))}function vr(e,t){let n=t.match(/var\((--[^,)]+)(?:,\s*([^)]+))?\)/);if(n){let r=n[1],o=n[2];return getComputedStyle(document.documentElement).getPropertyValue(r).trim()||o||t}return t}function Sr(e,t){if(!e)return null;let n=zl(e);if(!n)return null;for(let r of t){let o=zl(r.value);if(o&&n===o)return r}return null}function zl(e){if(!e)return null;let t=e.trim().toLowerCase();if(t.startsWith("oklch(")){let n=t.match(/oklch\(\s*([\d.]+%?)\s+([\d.]+%?)\s+([\d.]+)/);if(n){let r=n[1].endsWith("%")?parseFloat(n[1])/100:parseFloat(n[1]),o=n[2].endsWith("%")?parseFloat(n[2])/100:parseFloat(n[2]),i=parseFloat(n[3]);r=Math.round(r*100)/100,o=Math.round(o*1e3)/1e3;let s=Math.round(i);return`oklch(${r} ${o} ${s})`}}if(t.startsWith("rgb")){let n=t.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(n)return`rgb(${n[1]},${n[2]},${n[3]})`}return t.startsWith("#")?t.length===4?`#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}`:t.slice(0,7):t}import{Fragment as Ao,jsx as pt,jsxs as Un}from"react/jsx-runtime";var Fn=22,po=12,qd=3,Zd=250,Vr=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Qd=3e3;function eu(s){var l=s,{left:e,top:t,avoidBottom:n,style:r,children:o}=l,i=Hn(l,["left","top","avoidBottom","style","children"]);let a=e+po,d=t+po,c=n!==void 0?`${n}px`:"100vh";return pt("div",y(f({"data-devtools":"badge-hit-area"},i),{style:f({position:"fixed",left:e,top:t,padding:po},r),children:pt("div",{style:{transform:`translate(min(0px, calc(100vw - ${a}px - 100%)), min(0px, calc(${c} - ${d}px - 100%)))`},children:o})}))}function Jl({annotations:e,supersededAnnotations:t,inFlightIds:n,scrollX:r,scrollY:o,annotationGroupMap:i,onViewThread:s,onSelectAnnotation:l,onHoverAnnotation:a,canvasRef:d}){var x,N,W,_,H,V,k;let[c,u]=wr(0),[p,g]=wr(()=>Math.floor(Math.random()*Vr.length)),w=!!(n&&n.size>0);Xr(()=>{if(!w)return;let A=setInterval(()=>{u(ie=>(ie+1)%qd)},Zd),Q=setInterval(()=>{g(ie=>(ie+1)%Vr.length)},Qd);return()=>{clearInterval(A),clearInterval(Q)}},[w]);let C=[];for(let A of e){if(A.type!=="text"||!A.text||!A.points[0]||t.has(A))continue;let Q=A.groupId?e.filter(Oe=>Oe.groupId===A.groupId):[A],ie=(x=A.status)!=null?x:"pending",pe=Q.reduce((Oe,h)=>{var z;return Oe+((z=h.replyCount)!=null?z:0)},0),be=Oe=>Oe==="resolved"&&pe===0,me=!!(n&&(n.has(A.id)||Q.some(Oe=>n.has(Oe.id))))||A.status==="in_flight"||Q.some(Oe=>Oe.status==="in_flight")||be(A.status)||Q.some(Oe=>be(Oe.status)),We=Q.some(Oe=>{var h;return Oe.status==="resolved"&&((h=Oe.replyCount)!=null?h:0)>0||Oe.status==="needs_review"}),Ce=Q.some(Oe=>Oe.threadId);if(!me&&ie!=="resolved"&&ie!=="needs_review"&&!We&&!Ce)continue;let oe=A.threadId||((N=Q.find(Oe=>Oe.threadId))==null?void 0:N.threadId),_e=ie==="needs_review"||Q.some(Oe=>Oe.status==="needs_review"),Ne=A.points[0],je=A.fontSize||12,Fe=je*1.4,Ie=i.get(A.id),ct=A.text.replace(/\n/g," "),wt=Ie!==void 0?Ie+". "+ct:ct,Pe=(_=(W=d==null?void 0:d.current)==null?void 0:W.getContext("2d"))!=null?_:document.createElement("canvas").getContext("2d");if(!Pe)continue;Pe.font=`${je}px ${Ut}`;let Tt=Ne.x-r,nt=Yo(Tt),Lt=Go(Pe,wt,nt),Mt=Pe.measureText(Lt).width;C.push({id:A.id,threadId:oe,linkedSelector:A.linkedSelector||((H=Q.find(Oe=>Oe.linkedSelector))==null?void 0:H.linkedSelector),x:Ne.x+Mt+4,y:Ne.y-4,size:Fe+8,color:A.color,isInFlight:me,isNeedsReview:_e,replyCount:pe})}if(C.length===0)return null;let R=2,P=(k=(V=d==null?void 0:d.current)==null?void 0:V.getContext("2d"))!=null?k:document.createElement("canvas").getContext("2d"),G=C.map(A=>{var me;let Q;A.isInFlight?Q=(me=Vr[p])!=null?me:"thinking":A.replyCount>0?Q=`${A.replyCount} ${A.replyCount===1?"reply":"replies"}`:Q="Cancelled";let ie=11,pe=4,be=Q.length*7.2;return P&&(P.font=`12px ${Ut}`,be=P.measureText(Q).width),4+ie+pe+be+4}),M=typeof window!="undefined"?window.innerHeight:9999,T=[];for(let A=0;A<C.length;A++){let Q=C[A].y-o,ie=Math.min(Q,M-Fn),pe=ie+Fn,me=C[A].x-r;for(let We=0;We<A;We++){let Ce=C[We].y-o,oe=Math.min(Ce,M-Fn),_e=oe+Fn;if(!(ie<_e&&pe>oe))continue;let je=T[We]+G[We];me<je+R&&(me=je+R)}T.push(me)}return pt(Ao,{children:C.map((A,Q)=>{let ie=!!A.threadId;return pt(eu,{left:T[Q]-po,top:A.y-o-po,onMouseDown:ie?pe=>pe.stopPropagation():void 0,onClick:ie?pe=>{if(pe.stopPropagation(),l==null||l(A.id),s==null||s(A.threadId),A.linkedSelector)try{let be=document.querySelector(A.linkedSelector);if(be){let me=be.getBoundingClientRect();(me.bottom<0||me.top>window.innerHeight)&&be.scrollIntoView({behavior:"smooth",block:"center"})}}catch(be){}}:void 0,onMouseEnter:a?()=>a(A.id):void 0,onMouseLeave:a?()=>a(null):void 0,style:{pointerEvents:ie?"auto":"none",cursor:ie?"pointer":void 0,zIndex:9999},children:pt("div",{"data-devtools":"annotation-badge",style:{height:A.size,display:"flex",alignItems:"center",backgroundColor:A.color,fontFamily:Ut,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:A.isInFlight?Un(Ao,{children:[pt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?Un(Ao,{children:[pt("circle",{cx:"7",cy:"7",r:"2"}),pt("circle",{cx:"17",cy:"7",r:"2"}),pt("circle",{cx:"7",cy:"17",r:"2"}),pt("circle",{cx:"17",cy:"17",r:"2"})]}):Un(Ao,{children:[pt("circle",{cx:"12",cy:"6",r:"2"}),pt("circle",{cx:"6",cy:"12",r:"2"}),pt("circle",{cx:"18",cy:"12",r:"2"}),pt("circle",{cx:"12",cy:"18",r:"2"})]})}),pt("span",{style:{opacity:.7,color:"inherit"},children:Vr[p]})]}):Un(Ao,{children:[A.isNeedsReview?pt("span",{style:{fontWeight:700,color:"inherit"},children:"?"}):pt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:pt("polyline",{points:"4 12 10 18 20 6"})}),pt("span",{style:{opacity:.7,color:"inherit"},children:A.replyCount>0?`${A.replyCount} ${A.replyCount===1?"reply":"replies"}`:"Cancelled"})]})})},A.id)})})}function Yi({inFlightSelectorColors:e,animated:t=!0}){let[n,r]=wr([]);return Xr(()=>{if(e.size===0){r([]);return}let o=null,i=()=>{let a=[];for(let[d,c]of e){let u=vn(d);if(!u)continue;let p=u.getBoundingClientRect();a.push({selector:d,top:p.top,left:p.left,width:p.width,height:p.height,color:c})}r(a)},s=()=>{o&&cancelAnimationFrame(o),o=requestAnimationFrame(i)};i(),window.addEventListener("scroll",s,!0),window.addEventListener("resize",s,!0);let l=new MutationObserver(s);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",s,!0),window.removeEventListener("resize",s,!0),l.disconnect(),o&&cancelAnimationFrame(o)}},[e]),n.length===0?null:Un(Ao,{children:[t&&pt("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),n.map(o=>pt("div",{"data-devtools":"marching-ants",style:{position:"fixed",top:o.top,left:o.left,width:o.width,height:o.height,pointerEvents:"none",zIndex:9995,overflow:"visible"},children:pt("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible"},children:pt("rect",{x:"0.5",y:"0.5",width:Math.max(0,o.width-1),height:Math.max(0,o.height-1),fill:"none",stroke:o.color,strokeWidth:"1",strokeDasharray:"2 4",style:t?{animation:"popmelt-march 0.5s steps(2) infinite"}:void 0})})},o.selector))]})}function Ul({annotations:e,supersededAnnotations:t,scrollX:n,scrollY:r,onReply:o,annotationGroupMap:i,canvasRef:s,onHoverAnnotation:l}){let a=e.filter(u=>t.has(u)?!1:u.status==="waiting_input"&&u.question&&u.threadId);if(a.length===0)return null;let d=new Set,c=[];for(let u of a){if(!u.threadId||d.has(u.threadId))continue;d.add(u.threadId);let p=u.type==="text"?u:e.find(g=>g.groupId&&g.groupId===u.groupId&&g.type==="text")||u;if(p.type==="text"&&p.text&&p.points[0]){let g=p.points[0],w=p.fontSize||12,C=w*1.4,R=i.get(p.id),P=p.text.replace(/\n/g," "),G=R!==void 0?R+". "+P:P,T=document.createElement("canvas").getContext("2d");if(!T)continue;T.font=`${w}px ${Ut}`;let x=g.x-n,N=Yo(x),W=Go(T,G,N),_=T.measureText(W).width;c.push({annotation:u,x:g.x+_+4,y:g.y-4,size:C+8})}}return c.length===0?null:pt(Ao,{children:c.map(({annotation:u,x:p,y:g,size:w})=>pt(tu,{annotation:u,x:p-n,y:g-r,size:w,onReply:o,onHoverAnnotation:l},`question-${u.threadId}`))})}function tu({annotation:e,x:t,y:n,size:r,onReply:o,onHoverAnnotation:i}){let[s,l]=wr(!1),[a,d]=wr(""),c=Gl(null),u=Gl(null);Xr(()=>{s&&c.current&&c.current.focus()},[s]),Xr(()=>{if(!s)return;let R=G=>{u.current&&!G.composedPath().includes(u.current)&&l(!1)},P=G=>{G.key==="Escape"&&l(!1)};return document.addEventListener("mousedown",R),document.addEventListener("keydown",P),()=>{document.removeEventListener("mousedown",R),document.removeEventListener("keydown",P)}},[s]);let p=Yl(()=>{!a.trim()||!e.threadId||(o(e.threadId,a.trim()),d(""),l(!1))},[a,e.threadId,o]),g=Yl(R=>{R.key==="Enter"&&(R.metaKey||R.ctrlKey)&&(R.preventDefault(),p())},[p]),w=s?t:t-po,C=s?n:n-po;return Un("div",{ref:u,"data-devtools":"question-badge",onMouseEnter:i?()=>i(e.id):void 0,onMouseLeave:i?()=>i(null):void 0,style:{position:"fixed",left:`max(0px, ${w}px)`,top:`max(0px, ${C}px)`,padding:s?0:po,transform:`translate(min(0px, calc(100vw - max(0px, ${w}px) - 100%)), min(0px, calc(100vh - max(0px, ${C}px) - 100%)))`,zIndex:s?10002:9999,pointerEvents:"auto",cursor:s?void 0:"pointer"},children:[!s&&Un("div",{onClick:()=>l(!0),style:{height:r,display:"flex",alignItems:"center",backgroundColor:e.color,padding:`0 ${4}px`,gap:4,fontFamily:Ut,fontSize:12,color:"#ffffff",whiteSpace:"nowrap"},children:[Un("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[pt("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),pt("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),pt("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),pt("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),pt("span",{style:{opacity:.7},children:"reply?"})]}),s&&Un("div",{style:{minWidth:260,maxWidth:360,backgroundColor:"#eaeaea",fontFamily:Ut,fontSize:12,color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)"},children:[pt("div",{style:{padding:`${6}px ${8}px`,lineHeight:1.4},children:e.question}),Un("div",{style:{padding:`0 ${4}px ${4}px`},children:[pt("textarea",{ref:c,value:a,onChange:R=>d(R.target.value),onKeyDown:g,placeholder:"Type your reply...",style:{width:"100%",minHeight:40,padding:4,fontSize:12,fontFamily:Ut,backgroundColor:"rgba(0, 0, 0, 0.04)",color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)",borderRadius:0,outline:"none",resize:"vertical",lineHeight:1.4,boxSizing:"border-box"}}),pt("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:4},children:pt("button",{onClick:p,disabled:!a.trim(),style:{padding:"4px 12px",fontSize:11,fontFamily:Ut,fontWeight:600,backgroundColor:a.trim()?e.color:"rgba(0,0,0,0.1)",color:a.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:a.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}function Kr(e){var i;let t=new Set,n=new Map;for(let s of e){if(!s.linkedSelector)continue;let l=n.get(s.linkedSelector)||[];l.push(s),n.set(s.linkedSelector,l)}let r=new Set,o=new Set;for(let s of n.values()){if(s.length<=1){(i=s[0])!=null&&i.groupId&&o.add(s[0].groupId);continue}s.sort((a,d)=>d.timestamp-a.timestamp);let l=s[0];l.groupId&&o.add(l.groupId);for(let a=1;a<s.length;a++){let d=s[a];t.add(d),d.groupId&&r.add(d.groupId)}}for(let s of e)s.groupId&&r.has(s.groupId)&&!o.has(s.groupId)&&t.add(s);return t}import{useEffect as Vl,useLayoutEffect as nu,useState as Xl}from"react";import{jsx as Gi,jsxs as ql}from"react/jsx-runtime";function ou(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var Kl=["top-left","top-right","bottom-right","bottom-left"];function Zl({element:e,radius:t,accentColor:n,hoveredCorner:r,draggingCorner:o,cursorViewport:i}){let[s,l]=Xl(null),[a,d]=Xl(!1);if(Vl(()=>{let P=T=>{(T.key==="Meta"||T.key==="Control")&&d(!0)},G=T=>{(T.key==="Meta"||T.key==="Control")&&d(!1)},M=()=>d(!1);return window.addEventListener("keydown",P,!0),window.addEventListener("keyup",G,!0),window.addEventListener("blur",M),()=>{window.removeEventListener("keydown",P,!0),window.removeEventListener("keyup",G,!0),window.removeEventListener("blur",M)}},[]),Vl(()=>{if(!e){l(null);return}let P=()=>{l(e.getBoundingClientRect())};return P(),window.addEventListener("scroll",P,{passive:!0}),window.addEventListener("resize",P,{passive:!0}),()=>{window.removeEventListener("scroll",P),window.removeEventListener("resize",P)}},[e]),nu(()=>{e&&l(e.getBoundingClientRect())},[e,t["top-left"],t["top-right"],t["bottom-right"],t["bottom-left"]]),!s)return null;let c=s.width,u=s.height,p=ou(n,.2),g={"top-left":{x:0,y:t["top-left"]},"top-right":{x:c,y:t["top-right"]},"bottom-right":{x:c,y:u-t["bottom-right"]},"bottom-left":{x:0,y:u-t["bottom-left"]}},w=new Set,C=o!=null?o:r;if(C)if(a)w.add(C);else for(let P of Kl)w.add(P);let R={position:"fixed",top:s.top,left:s.left,width:c,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"};return ql("div",{"data-devtools":"border-radius-handles",style:R,children:[ql("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${u}`,children:[Gi("rect",{x:"0.5",y:"0.5",width:Math.max(0,c-1),height:Math.max(0,u-1),fill:"none",stroke:p,strokeWidth:"1"}),Kl.map(P=>{let G=g[P],M=w.has(P);return Gi("circle",{cx:G.x,cy:G.y,r:P===(o!=null?o:r)?3:2.5,fill:n,stroke:"#ffffff",strokeWidth:P===(o!=null?o:r)?4:2,paintOrder:"stroke"},P)})]}),i&&C&&(()=>{let P=Math.round(t[C]);return Gi("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:P})})()]})}import{useEffect as ru,useState as iu}from"react";function qo(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);if(n)return`oklch(${n[1]} / ${t})`;let r=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);if(r){let o=parseInt(r[1],16),i=parseInt(r[2],16),s=parseInt(r[3],16);return`rgba(${o}, ${i}, ${s}, ${t})`}return`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}import{Fragment as su,jsx as Ji,jsxs as Cr}from"react/jsx-runtime";function Vn({element:e,isSelected:t=!1,elementInfo:n,color:r="#3b82f6",annotationNumber:o,changeCount:i,hideTooltip:s=!1}){let[l,a]=iu(null);if(ru(()=>{if(!e){a(null);return}let x=()=>{let N=e.getBoundingClientRect();a(N)};return x(),window.addEventListener("scroll",x,{passive:!0}),window.addEventListener("resize",x,{passive:!0}),()=>{window.removeEventListener("scroll",x),window.removeEventListener("resize",x)}},[e]),!l||!e)return null;let d={position:"fixed",top:l.top,left:l.left,width:l.width,height:l.height,pointerEvents:"none",zIndex:9996,backgroundColor:qo(r,.05),overflow:"visible"},c=e.tagName.toLowerCase(),u=e.id?`#${e.id}`:"",p=e.classList.length>0?"."+Array.from(e.classList).slice(0,2).join("."):"",g=n==null?void 0:n.reactComponent,w=g?`<${g}> ${c}${u}${p}`:`${c}${u}${p}`,C=22,R=l.height>=window.innerHeight,P=R?0:l.top>=C?l.top-C:l.bottom,G=R?{position:"absolute",top:8,left:8,zIndex:9997,display:"flex",alignItems:"center",gap:6,backgroundColor:r,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400}:{position:"fixed",top:P,left:l.left,zIndex:9997,display:"flex",alignItems:"center",gap:6,backgroundColor:r,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400},T=!s&&Cr("div",{"data-devtools":"tooltip",style:G,children:[o!==void 0&&Cr("span",{children:[o,"."]}),Ji("span",{style:{overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0},children:w}),i!==void 0&&i>0&&Cr("span",{style:{opacity:.8},children:["(",i," ",i===1?"change":"changes",")"]})]});return Cr(su,{children:[Cr("div",{"data-devtools":"highlight",style:d,children:[Ji("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:Ji("rect",f({x:"0.5",y:"0.5",width:Math.max(0,l.width-1),height:Math.max(0,l.height-1),fill:"none",stroke:r,strokeWidth:"1"},!t&&{strokeDasharray:"2 4"}))}),R&&T]}),!R&&T]})}import{useEffect as Ql,useLayoutEffect as lu,useState as Ui}from"react";import{jsx as oo,jsxs as Xi}from"react/jsx-runtime";function Vi(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function Ki({element:e,gap:t,accentColor:n,hoveredAxis:r,draggingAxis:o,cursorViewport:i,isAutoGap:s=!1,refreshKey:l=0}){let[a,d]=Ui(null),[c,u]=Ui([]),[p,g]=Ui(!1);if(Ql(()=>{let _=k=>{(k.key==="Meta"||k.key==="Control")&&g(!0)},H=k=>{(k.key==="Meta"||k.key==="Control")&&g(!1)},V=()=>g(!1);return window.addEventListener("keydown",_,!0),window.addEventListener("keyup",H,!0),window.addEventListener("blur",V),()=>{window.removeEventListener("keydown",_,!0),window.removeEventListener("keyup",H,!0),window.removeEventListener("blur",V)}},[]),Ql(()=>{if(!e){d(null),u([]);return}let _=()=>{d(e.getBoundingClientRect()),u(Lo(e))};return _(),window.addEventListener("scroll",_,{passive:!0}),window.addEventListener("resize",_,{passive:!0}),()=>{window.removeEventListener("scroll",_),window.removeEventListener("resize",_)}},[e]),lu(()=>{e&&(d(e.getBoundingClientRect()),u(Lo(e)))},[e,t.row,t.column,l]),!a||c.length===0)return null;let w=a.width,C=a.height,R="pm-gap-stripe-pattern",P=Vi(n,.25),G=Vi(n,.1),M=Vi(n,.2),T=8,x=2,N={position:"fixed",top:a.top,left:a.left,width:w,height:C,pointerEvents:"none",zIndex:9996,overflow:"visible"},W=o!=null?o:r;return Xi("div",{"data-devtools":"gap-handles",style:N,children:[Xi("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${w} ${C}`,children:[oo("defs",{children:oo("pattern",{id:R,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:oo("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:P,strokeWidth:"1.5"})})}),oo("rect",{x:"0.5",y:"0.5",width:Math.max(0,w-1),height:Math.max(0,C-1),fill:"none",stroke:M,strokeWidth:"1"}),c.map((_,H)=>{let V=_.x-a.left,k=_.y-a.top,A=_.w,Q=_.h,ie=p?_.axis===W:!0;return(_.axis==="row"?t.row:t.column)===0?null:Xi("g",{opacity:ie?1:.6,children:[oo("rect",{x:V,y:k,width:A,height:Q,fill:G}),oo("rect",{x:V,y:k,width:A,height:Q,fill:`url(#${R})`})]},H)}),W&&(()=>{let _=c.filter(_e=>_e.axis===W);if(_.length===0)return null;let H=_[0];if(i&&_.length>1){let _e=1/0;for(let Ne of _){let je=Ne.x+Ne.w/2,Fe=Ne.y+Ne.h/2,Ie=Math.abs(i.x-je)+Math.abs(i.y-Fe);Ie<_e&&(_e=Ie,H=Ne)}}let V=H.x-a.left,k=H.y-a.top,A=H.w,Q=H.h,ie=V+A/2,pe=k+Q/2;if(s)return oo("circle",{cx:ie,cy:pe,r:1.5,fill:n,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let be=W==="column",me=be?x:T,We=be?T:x,Ce=ie-me/2,oe=pe-We/2;return oo("rect",{x:Ce,y:oe,width:me,height:We,fill:n,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),i&&W&&(()=>{let _=s?"auto":String(Math.round(W==="row"?t.row:t.column));return oo("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:_})})()]})}import{useCallback as pu,useEffect as fu,useState as gu}from"react";import{useEffect as au,useState as ea}from"react";var cu=3,du=250,qi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],uu=3e3;function ta(e){let[t,n]=ea(0),[r,o]=ea(()=>Math.floor(Math.random()*qi.length));return au(()=>{if(!e)return;let i=setInterval(()=>n(l=>(l+1)%cu),du),s=setInterval(()=>o(l=>(l+1)%qi.length),uu);return()=>{clearInterval(i),clearInterval(s)}},[e]),{charIndex:t,word:qi[r]}}import{Fragment as Zi,jsx as An,jsxs as Zo}from"react/jsx-runtime";function mu(e){let{element:t}=e,n=t.tagName,r=t.id?`#${t.id}`:"",o=t.className?"."+t.className.split(" ").slice(0,2).join("."):"",i=t.reactComponent;return i?`<${i}> ${n}${r}${o}`:`${n}${r}${o}`}var na=22,Qi=12;function hu(s){var l=s,{left:e,top:t,avoidBottom:n,style:r,children:o}=l,i=Hn(l,["left","top","avoidBottom","style","children"]);let a=n!==void 0?`${n}px`:"100vh";return An("div",y(f({"data-devtools":"badge-hit-area"},i),{style:f({position:"fixed",left:`max(0px, ${e}px)`,top:`max(0px, ${t}px)`,padding:Qi,transform:`translate(min(0px, calc(100vw - max(0px, ${e}px) - 100%)), min(0px, calc(${a} - max(0px, ${t}px) - 100%)))`},r),children:o}))}function oa({styleModifications:e,isInspecting:t,accentColor:n,annotationGroupCount:r,dispatch:o,inFlightSelectors:i,toolbarRef:s,onHoverSelector:l}){var G;let[a,d]=gu([]),c=i&&i.size>0,{charIndex:u,word:p}=ta(!!c);fu(()=>{if(t){d([]);return}let M=null,T=()=>{let W=[];e.forEach((_,H)=>{let V=vn(_.selector);if(!V)return;let k=V.getBoundingClientRect();W.push({selector:_.selector,modIndex:H,top:k.top>=na?k.top-na:k.bottom,left:k.left,label:mu(_),changeCount:_.changes.length,annotationNumber:r+H+1})}),d(W)},x=()=>{M&&cancelAnimationFrame(M),M=requestAnimationFrame(T)};T(),window.addEventListener("scroll",x,!0),window.addEventListener("resize",x,!0);let N=new MutationObserver(x);return N.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),window.addEventListener("load",x),document.fonts.ready.then(x),()=>{window.removeEventListener("scroll",x,!0),window.removeEventListener("resize",x,!0),window.removeEventListener("load",x),N.disconnect(),M&&cancelAnimationFrame(M)}},[e,t,r]);let g=pu(M=>{let T=e[M];if(!T)return;let x=vn(T.selector);x&&(o({type:"SELECT_ANNOTATION",payload:{id:null}}),o({type:"SET_TOOL",payload:"inspector"}),o({type:"SELECT_ELEMENT",payload:{el:x,info:T.element}}))},[e,o]);if(a.length===0)return null;let w=(G=s==null?void 0:s.current)==null?void 0:G.getBoundingClientRect(),C=w?w.top-8:void 0,R={display:"flex",alignItems:"center",gap:6,backgroundColor:n,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,whiteSpace:"nowrap",maxWidth:400},P={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return An(Zi,{children:a.map(M=>{let T=i==null?void 0:i.has(M.selector);return An(hu,{left:M.left-Qi,top:M.top-Qi,avoidBottom:C,onClick:()=>g(M.modIndex),onMouseEnter:l?()=>l(M.selector):void 0,onMouseLeave:l?()=>l(null):void 0,style:{zIndex:1e4,cursor:"pointer",pointerEvents:"auto"},children:Zo("div",{"data-devtools":"badge",style:y(f({},R),{backgroundColor:T?"#999999":n}),children:[Zo("span",{children:[M.annotationNumber,"."]}),An("span",{style:P,children:M.label}),Zo("span",{style:{opacity:.8},children:["(",M.changeCount," ",M.changeCount===1?"change":"changes",")"]}),T&&Zo("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[An("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:u===1?Zo(Zi,{children:[An("circle",{cx:"7",cy:"7",r:"2"}),An("circle",{cx:"17",cy:"7",r:"2"}),An("circle",{cx:"7",cy:"17",r:"2"}),An("circle",{cx:"17",cy:"17",r:"2"})]}):Zo(Zi,{children:[An("circle",{cx:"12",cy:"6",r:"2"}),An("circle",{cx:"6",cy:"12",r:"2"}),An("circle",{cx:"18",cy:"12",r:"2"}),An("circle",{cx:"12",cy:"18",r:"2"})]})}),p]})]})},M.selector)})})}import{useEffect as yu,useState as bu}from"react";import{Fragment as vu,jsx as ra}from"react/jsx-runtime";function xu(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function ia({styleModifications:e,accentColor:t}){let[n,r]=bu([]);if(yu(()=>{let i=null,s=()=>{let d=[];for(let c of e){let u=vn(c.selector);if(!u)continue;let p=u.getBoundingClientRect();if(p.width===0&&p.height===0)continue;let g=Ro(u);d.push({selector:c.selector,top:p.top,left:p.left,width:p.width,height:p.height,borderRadius:`${g["top-left"]}px ${g["top-right"]}px ${g["bottom-right"]}px ${g["bottom-left"]}px`})}r(d)},l=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(s)};s(),window.addEventListener("scroll",l,{passive:!0}),window.addEventListener("resize",l,{passive:!0});let a=new MutationObserver(l);return a.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",l),window.removeEventListener("resize",l),a.disconnect(),i&&cancelAnimationFrame(i)}},[e]),n.length===0)return null;let o=xu(t,.2);return ra(vu,{children:n.map(i=>{let s={position:"fixed",top:i.top,left:i.left,width:i.width,height:i.height,pointerEvents:"none",zIndex:9995,border:`1px solid ${o}`,borderRadius:i.borderRadius,boxSizing:"border-box"};return ra("div",{"data-devtools":"mod-border",style:s},i.selector)})})}import{useEffect as sa,useLayoutEffect as Su,useState as la}from"react";import{jsx as fo,jsxs as ts}from"react/jsx-runtime";function es(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var wu={top:"bottom",bottom:"top",left:"right",right:"left"};function ns({element:e,padding:t,accentColor:n,hoveredSide:r,draggingSide:o,cursorViewport:i,refreshKey:s}){let[l,a]=la(null),[d,c]=la(!1);if(sa(()=>{let A=pe=>{(pe.key==="Meta"||pe.key==="Control")&&c(!0)},Q=pe=>{(pe.key==="Meta"||pe.key==="Control")&&c(!1)},ie=()=>c(!1);return window.addEventListener("keydown",A,!0),window.addEventListener("keyup",Q,!0),window.addEventListener("blur",ie),()=>{window.removeEventListener("keydown",A,!0),window.removeEventListener("keyup",Q,!0),window.removeEventListener("blur",ie)}},[]),sa(()=>{if(!e){a(null);return}let A=()=>{a(e.getBoundingClientRect())};return A(),window.addEventListener("scroll",A,{passive:!0}),window.addEventListener("resize",A,{passive:!0}),()=>{window.removeEventListener("scroll",A),window.removeEventListener("resize",A)}},[e]),Su(()=>{e&&a(e.getBoundingClientRect())},[e,t.top,t.right,t.bottom,t.left,s]),!l)return null;let u=l.width,p=l.height,{top:g,right:w,bottom:C,left:R}=t,P="pm-stripe-pattern",G=es(n,.25),M=es(n,.1),T=es(n,.2),x=8,N=2,W={position:"fixed",top:l.top,left:l.left,width:u,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"},_=["top","right","bottom","left"],H={top:`0,0 ${u},0 ${u-w},${g} ${R},${g}`,right:`${u},0 ${u},${p} ${u-w},${p-C} ${u-w},${g}`,bottom:`0,${p} ${R},${p-C} ${u-w},${p-C} ${u},${p}`,left:`0,0 ${R},${g} ${R},${p-C} 0,${p}`},V={top:{x:u/2-x/2,y:g/2-N/2,w:x,h:N},bottom:{x:u/2-x/2,y:p-C/2-N/2,w:x,h:N},left:{x:R/2-N/2,y:p/2-x/2,w:N,h:x},right:{x:u-w/2-N/2,y:p/2-x/2,w:N,h:x}},k=new Set;return o?k.add(o):r&&(k.add(r),d||k.add(wu[r])),ts("div",{"data-devtools":"padding-handles",style:W,children:[ts("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${u} ${p}`,children:[fo("defs",{children:fo("pattern",{id:P,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:fo("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:G,strokeWidth:"1.5"})})}),fo("rect",{x:"0.5",y:"0.5",width:Math.max(0,u-1),height:Math.max(0,p-1),fill:"none",stroke:T,strokeWidth:"1"}),_.map(A=>{if(t[A]<=0)return null;let ie=k.has(A);return ts("g",{opacity:ie?1:.6,children:[fo("polygon",{points:H[A],fill:M}),fo("polygon",{points:H[A],fill:`url(#${P})`})]},A)}),_.map(A=>{let Q=V[A],ie=k.has(A);return fo("rect",{x:Q.x,y:Q.y,width:Q.w,height:Q.h,fill:n,stroke:"#ffffff",strokeWidth:ie?4:2,paintOrder:"stroke"},`handle-${A}`)})]}),i&&(r||o)&&(()=>{let A=o!=null?o:r,Q=Math.round(t[A]);return fo("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:Q})})()]})}import{useCallback as Xn,useEffect as $n,useMemo as oi,useRef as Ln,useState as dn}from"react";import{Check as ni,ChevronDown as ds,MoveHorizontal as xa,RotateCcw as Uu,Shrink as Vu,X as Xu}from"lucide-react";var Cu="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",go={borderWidth:3,borderStyle:"solid",borderImage:`url("${Cu}") 4 / 1.9 / 0 round`};var qr={"font-size":["rem","px","em"],"line-height":["","rem","px","em"],"letter-spacing":["rem","px","em"],gap:["rem","px","em"],"column-gap":["rem","px","em"],"row-gap":["rem","px","em"],padding:["rem","px","em","%"],margin:["rem","px","em","%"],width:["rem","px","%","em"],height:["rem","px","%","em"],"min-width":["rem","px","%","em"],"max-width":["rem","px","%","em"],"min-height":["rem","px","%","em"],"max-height":["rem","px","%","em"],"border-width":["px","rem","em"],"border-radius":["rem","px","%","em"]};function Qo(e){var t,n;return(n=(t=qr[e])==null?void 0:t[0])!=null?n:"px"}function mo(e){let t=e.match(/^([\d.-]+)(.*)$/);return t?{num:parseFloat(t[1]),unit:t[2]||""}:{num:0,unit:""}}function Zr(e,t,n,r){let o=e.trim();if(!o)return"";let i=o.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i);if(i)return`${parseFloat(i[1])}${i[2].toLowerCase()}`;let s=parseFloat(o);if(!isNaN(s)){if(r){let{unit:l}=mo(n);return`${s}${l||Qo(t)}`}return`${s}${Qo(t)}`}return o}function os(e,t){if(!t||t==="px")return e;if(t==="rem"){let n=parseFloat(getComputedStyle(document.documentElement).fontSize)||16;return Math.round(e/n*1e3)/1e3}return e}import{useCallback as ku,useEffect as Eu,useRef as aa,useState as Tu}from"react";import{Plus as ca,X as Mu}from"lucide-react";import{jsx as In,jsxs as Po}from"react/jsx-runtime";var Qr=[{name:"blur",label:"Blur",unit:"px",defaultValue:10,min:0,max:100,step:1},{name:"brightness",label:"Brightness",unit:"",defaultValue:1,min:0,max:3,step:.05},{name:"contrast",label:"Contrast",unit:"",defaultValue:1,min:0,max:3,step:.05},{name:"saturate",label:"Saturate",unit:"",defaultValue:1,min:0,max:3,step:.05},{name:"grayscale",label:"Grayscale",unit:"",defaultValue:0,min:0,max:1,step:.05},{name:"sepia",label:"Sepia",unit:"",defaultValue:0,min:0,max:1,step:.05},{name:"invert",label:"Invert",unit:"",defaultValue:0,min:0,max:1,step:.05},{name:"hue-rotate",label:"Hue Rotate",unit:"deg",defaultValue:0,min:0,max:360,step:1},{name:"opacity",label:"Opacity",unit:"",defaultValue:1,min:0,max:1,step:.05}];function Iu(e){if(!e||e==="none")return[];let t=[],n=/([\w-]+)\(([^)]+)\)/g,r;for(;(r=n.exec(e))!==null;){let o=r[1],i=r[2],s=parseFloat(i);isNaN(s)||t.push({name:o,value:s})}return t}function rs(e){return e.length===0?"none":e.map(t=>{var o;let n=Qr.find(i=>i.name===t.name),r=(o=n==null?void 0:n.unit)!=null?o:"";return`${t.name}(${t.value}${r})`}).join(" ")}function da({value:e,onChange:t,accentColor:n,modified:r,panelContentRef:o}){let i=Iu(e),[s,l]=Tu(!1),a=aa(null),d=aa(null);Eu(()=>{if(!s)return;let M=T=>{a.current&&!T.composedPath().includes(a.current)&&l(!1)};return document.addEventListener("mousedown",M,!0),()=>document.removeEventListener("mousedown",M,!0)},[s]);let c=Qr.filter(M=>!i.some(T=>T.name===M.name)),u=M=>{let T=[...i,{name:M.name,value:M.defaultValue}];t(rs(T)),l(!1)},p=M=>{let T=i.filter((x,N)=>N!==M);t(rs(T))},g=(M,T)=>{let x=i.map((N,W)=>W===M?y(f({},N),{value:T}):N);t(rs(x))},w={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},C=ku(M=>{var k;if(!d.current)return{position:"fixed",top:0,left:0};let T=d.current.getBoundingClientRect(),x=d.current.closest('[data-devtools="panel"]'),N=x?x.getBoundingClientRect():{top:0,left:0,bottom:9999},W=(k=o==null?void 0:o.current)==null?void 0:k.getBoundingClientRect(),_=M*24+8,V=N.bottom-T.bottom<_;return y(f({position:"fixed"},V?{bottom:N.bottom-T.top+2-N.top}:{top:T.bottom+2-N.top}),{left:W?W.left+4-N.left:T.left-N.left,width:W?W.width-8:140,zIndex:10001})},[o]),R={backgroundColor:"rgba(255, 255, 255, 0.95)",backdropFilter:"blur(16px)",WebkitBackdropFilter:"blur(16px)",border:"1px solid rgba(0,0,0,0.1)",borderRadius:4,padding:"4px 0",boxShadow:"0 4px 12px rgba(0,0,0,0.1)"},P={display:"block",width:"100%",padding:"4px 10px",border:"none",backgroundColor:"transparent",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#334155",cursor:"pointer",textAlign:"left"},G=M=>In("div",{ref:a,style:f(f({},C(M.length)),R),children:M.map(T=>In("button",{type:"button",onClick:()=>u(T),style:P,onMouseEnter:x=>{x.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:x=>{x.currentTarget.style.backgroundColor="transparent"},children:T.label},T.name))});return i.length===0?Po("div",{children:[Po("div",{style:{display:"flex",alignItems:"center",gap:4},children:[In(ro,{modified:!1,children:In("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:y(f({},w),{color:"#999",cursor:"default"})})}),In("button",{ref:d,type:"button",onClick:()=>l(!s),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,padding:0,border:"none",borderRadius:2,backgroundColor:"transparent",color:"#94a3b8",cursor:"pointer",flexShrink:0},children:In(ca,{size:12})})]}),s&&G(Qr)]}):Po("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[i.map((M,T)=>{let x=Qr.find(N=>N.name===M.name);return x?Po("div",{style:{display:"flex",alignItems:"center",gap:4},children:[In("span",{style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:r?n:"#94a3b8",fontWeight:r?600:400,width:56,flexShrink:0,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:x.label}),In(ro,{modified:r,children:Po("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[In("input",{type:"range",min:x.min,max:x.max,step:x.step,value:M.value,onChange:N=>g(T,parseFloat(N.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${n} ${(M.value-x.min)/(x.max-x.min)*100}%, rgba(0,0,0,0.1) ${(M.value-x.min)/(x.max-x.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),In("input",{type:"number",min:x.min,max:x.max,step:x.step,value:x.unit==="px"||x.unit==="deg"?Math.round(M.value):Math.round(M.value*100)/100,onChange:N=>g(T,parseFloat(N.target.value)||0),style:y(f({},w),{width:44,padding:"2px 4px",textAlign:"right",flexShrink:0})}),x.unit&&In("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:x.unit})]})}),In("button",{type:"button",onClick:()=>p(T),style:{display:"flex",alignItems:"center",justifyContent:"center",width:16,height:16,padding:0,border:"none",borderRadius:2,backgroundColor:"transparent",color:"#94a3b8",cursor:"pointer",flexShrink:0},children:In(Mu,{size:10})})]},M.name):null}),c.length>0&&Po("div",{children:[Po("button",{ref:d,type:"button",onClick:()=>l(!s),style:{display:"flex",alignItems:"center",gap:4,padding:"2px 4px",border:"none",borderRadius:2,backgroundColor:"transparent",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#94a3b8",cursor:"pointer"},children:[In(ca,{size:10}),"Add filter"]}),s&&G(c)]})]})}import{useCallback as tr,useEffect as Pu,useRef as ei,useState as ua}from"react";import{AlignHorizontalSpaceAround as Ou,AlignVerticalSpaceAround as Bu,Columns3 as Nu,Grid2x2 as Du,RectangleHorizontal as _u,Rows3 as Hu,UnfoldHorizontal as pa,UnfoldVertical as fa}from"lucide-react";import{useCallback as Lu,useEffect as Ru,useRef as kr}from"react";import{jsx as Au}from"react/jsx-runtime";var is=[0,1,2,4,8,12,16,20,24,28,32];function er({value:e,onChange:t,onPreview:n,onScrubEnd:r,onReset:o,isModified:i,accentColor:s,defaultUnit:l="rem",snapSteps:a,color:d,style:c,children:u}){let p=kr(null),g=kr(null),w=kr(o),C=kr(i),R=kr(!1);w.current=o,C.current=i,Ru(()=>{let G=T=>{let x=g.current;if(!x)return;x.hasMoved=!0,R.current=T.shiftKey;let N=x.unit==="rem"||x.unit==="em"?.1:1;x.accum+=T.movementX*N;let W=Math.max(0,Math.round((x.startValue+x.accum)*10)/10);if(T.shiftKey&&a){let _=x.unit==="rem"||x.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,H=x.unit==="rem"||x.unit==="em"?W*_:W,V=a[a.length-1];for(let k=0;k<a.length-1;k++){let A=a[k],Q=a[k+1];if(H<=(A+Q)/2){V=A;break}if(H<Q){V=Q;break}}H>a[a.length-1]&&(V=Math.round(H/8)*8),W=x.unit==="rem"||x.unit==="em"?Math.round(V/_*1e3)/1e3:V}n==null||n(`${W}${x.unit}`)},M=()=>{let T=g.current;if(!T)return;let x=Math.max(0,Math.round((T.startValue+T.accum)*10)/10);if(R.current&&a){let W=T.unit==="rem"||T.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,_=T.unit==="rem"||T.unit==="em"?x*W:x,H=a[a.length-1];for(let V=0;V<a.length-1;V++){let k=a[V],A=a[V+1];if(_<=(k+A)/2){H=k;break}if(_<A){H=A;break}}_>a[a.length-1]&&(H=Math.round(_/8)*8),x=T.unit==="rem"||T.unit==="em"?Math.round(H/W*1e3)/1e3:H}let N=T.hasMoved&&x!==T.startValue;g.current=null,document.exitPointerLock(),N?t(`${x}${T.unit}`):T.hasMoved?n==null||n(`${T.startValue}${T.unit}`):C.current&&w.current&&w.current(),r==null||r()};return document.addEventListener("mousemove",G),document.addEventListener("mouseup",M),()=>{document.removeEventListener("mousemove",G),document.removeEventListener("mouseup",M)}},[t,n,r]);let P=Lu(G=>{var x;if(G.button!==0)return;G.preventDefault();let M=mo(e),T=M.unit&&M.unit!=="px"?M.unit:l;g.current={startValue:M.num,unit:T,accum:0,hasMoved:!1},(x=p.current)==null||x.requestPointerLock()},[e,l]);return Au("span",{ref:p,onMouseDown:P,title:i?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:f({color:i?s||"#3b82f6":d||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize"},c),children:u})}import{Fragment as ss,jsx as Ae,jsxs as tn}from"react/jsx-runtime";function Fu({gridCols:e,gridRows:t,gridModified:n,accentColor:r,onColsChange:o,onRowsChange:i}){return Ae(Pn,{style:{width:100},children:tn("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[Ae("input",{type:"number",min:1,max:12,value:e,onChange:s=>o(parseInt(s.target.value)||1),style:y(f({},cn),{width:32,textAlign:"center",padding:2})}),Ae("span",{style:{fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:n?r:"#999",fontWeight:n?600:400,fontSize:11,margin:"0 4px"},children:"\xD7"}),Ae("input",{type:"number",min:1,max:12,value:t,onChange:s=>i(parseInt(s.target.value)||1),style:y(f({},cn),{width:32,textAlign:"center",padding:2})})]})})}function ga({element:e,getValue:t,getOriginalValue:n,handleChange:r,isModified:o,onResetProperty:i,isCollapsed:s,onToggle:l,sectionHeaderStyle:a,activeDropdown:d,onDropdownChange:c,panelContentRef:u,accentColor:p,onFieldHover:g,preferredUnit:w,onUnitCycle:C}){let R=c,P=t("display"),G=t("flex-direction"),M=ma(P,G),T=P==="flex"||P==="inline-flex",x=P==="grid",N=T||x,W=t("width"),_=t("height"),H=o("width")?W:jr(e,"width"),V=o("height")?_:jr(e,"height"),k=ls(W,H),A=ls(_,V),Q=t("min-width"),ie=t("max-width"),pe=t("min-height"),be=t("max-height"),me=nr(t("padding")),We=t("gap"),Ce=t("row-gap"),oe=t("column-gap"),_e=t("grid-template-columns"),Ne=t("grid-template-rows"),je=t("overflow"),Fe=_e.split(/\s+/).filter(ne=>ne&&ne!=="none").length||1,Ie=Ne.split(/\s+/).filter(ne=>ne&&ne!=="none").length||1,[ct,wt]=ua(!1),Pe=d!==null,Tt=Pe||ct,nt=Pe?.3:ct?.65:1,Lt=({mode:ne,icon:De,active:ot})=>Ae("button",{type:"button",onClick:()=>ha(ne,r),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:ot?qo(p,.15):"transparent",color:ot?p:"#64748b",cursor:"pointer",fontSize:14},children:De}),Mt=(ne,De,ot)=>{ot==="fixed"?r(ne,De):r(ne,ti(ot,De))},Oe=ne=>{let De=nr(t("padding")),ot=ne||"0";r("padding",`${De.top} ${ot} ${De.bottom} ${ot}`)},h=ne=>{let De=nr(t("padding")),ot=ne||"0";r("padding",`${ot} ${De.right} ${ot} ${De.left}`)},[z,te]=ua({}),se=tr((ne,De)=>ot=>{De(ot),te(Dn=>y(f({},Dn),{[ne]:ot}))},[]),ke=tr(ne=>{te(De=>{let ot=f({},De);return delete ot[ne],ot})},[]),ye=tr(ne=>{let De=nr(t("padding"));Ve(e,"padding",`${De.top} ${ne} ${De.bottom} ${ne}`)},[e,t]),ae=tr(ne=>{let De=nr(t("padding"));Ve(e,"padding",`${ne} ${De.right} ${ne} ${De.left}`)},[e,t]),de=tr(ne=>De=>{Ve(e,ne,De)},[e]),ue=G==="column"||G==="column-reverse",Ye=ne=>ne==="center"?1:ne==="flex-end"||ne==="end"?2:0,qe=Ye(t("justify-content")),st=Ye(t("align-items")),Pt=ue?st:qe,Ct=ue?qe:st,It=ei(null),Gt=ei({x:0,y:0}),Jt=ei({col:Pt,row:Ct});Jt.current={col:Pt,row:Ct};let $t=tr((ne,De)=>{let ot=["flex-start","center","flex-end"];ue?(r("justify-content",ot[De]),r("align-items",ot[ne])):(r("justify-content",ot[ne]),r("align-items",ot[De]))},[ue,r]),on=ei($t);on.current=$t,Pu(()=>{let De=ot=>{let Dn=It.current;if(!Dn||!ot.composedPath().includes(Dn))return;ot.preventDefault(),ot.stopPropagation(),Gt.current.x+=ot.deltaX,Gt.current.y+=ot.deltaY;let{col:Tn,row:Qt}=Jt.current,Mn=!1;Math.abs(Gt.current.x)>=30&&(Tn=Math.max(0,Math.min(2,Tn+(Gt.current.x>0?1:-1))),Gt.current.x=0,Gt.current.y=0,Mn=!0),!Mn&&Math.abs(Gt.current.y)>=30&&(Qt=Math.max(0,Math.min(2,Qt+(Gt.current.y>0?1:-1))),Gt.current.x=0,Gt.current.y=0,Mn=!0),Mn&&(Tn!==Jt.current.col||Qt!==Jt.current.row)&&on.current(Tn,Qt)};return document.addEventListener("wheel",De,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",De,{capture:!0})},[]);let Ot=()=>Ae("div",{ref:It,onMouseEnter:()=>{wt(!0),u.current&&(u.current.style.overflowY="hidden")},onMouseLeave:()=>{wt(!1),u.current&&(u.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:Jn,borderRadius:2,display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gridTemplateRows:"repeat(3, 1fr)",padding:6,gap:2,touchAction:"none"},children:[0,1,2].map(ne=>[0,1,2].map(De=>Ae("button",{type:"button",onClick:()=>$t(De,ne),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:De===Pt&&ne===Ct?Ae("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:De===0?tn(ss,{children:[Ae("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),Ae("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),Ae("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):De===1?tn(ss,{children:[Ae("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),Ae("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),Ae("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):tn(ss,{children:[Ae("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),Ae("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),Ae("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]})}):Ae("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${ne}-${De}`)))}),bn=o("grid-template-columns")||o("grid-template-rows");return tn("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Ae("div",{style:a,children:Ae("span",{children:N?"Auto layout":"Layout"})}),tn("div",{style:{padding:"8px 12px"},children:[tn("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:Jn,borderRadius:2,padding:2,opacity:nt,transition:"opacity 150ms ease"},children:[Ae(Lt,{mode:"block",icon:Ae(_u,{size:16}),active:M==="block"}),Ae(Lt,{mode:"flex-col",icon:Ae(Hu,{size:16}),active:M==="flex-col"}),Ae(Lt,{mode:"flex-row",icon:Ae(Nu,{size:16}),active:M==="flex-row"}),Ae(Lt,{mode:"grid",icon:Ae(Du,{size:16}),active:M==="grid"})]}),tn("div",{style:{display:"flex",gap:4,marginBottom:8},children:[Ae(as,{label:"W",property:"width",cssValue:k==="fixed"?W:`${Math.round(e.getBoundingClientRect().width)}px`,mode:k,onValueChange:ne=>r("width",ne),onModeChange:ne=>{if(ne==="fixed"){let De=e.getBoundingClientRect();r("width",`${Math.round(De.width)}px`)}else r("width",ti(ne,W))},modified:o("width"),dimmed:Pe&&d!=="width",dropdownOpen:d==="width",onDropdownChange:ne=>R(ne?"width":null),panelContentRef:u,accentColor:p,onReset:()=>i("width"),minValue:Q!=="none"&&Q!=="0px"&&Q!=="auto"?Q:"",maxValue:ie!=="none"&&ie!=="auto"?ie:"",onMinChange:ne=>r("min-width",ne||"0"),onMaxChange:ne=>r("max-width",ne||"none"),onMinReset:()=>i("min-width"),onMaxReset:()=>i("max-width"),minModified:o("min-width"),maxModified:o("max-width")}),Ae(as,{label:"H",property:"height",cssValue:A==="fixed"?_:`${Math.round(e.getBoundingClientRect().height)}px`,mode:A,onValueChange:ne=>r("height",ne),onModeChange:ne=>{if(ne==="fixed"){let De=e.getBoundingClientRect();r("height",`${Math.round(De.height)}px`)}else r("height",ti(ne,_))},modified:o("height"),dimmed:Pe&&d!=="height",dropdownOpen:d==="height",onDropdownChange:ne=>R(ne?"height":null),panelContentRef:u,minValue:pe!=="none"&&pe!=="0px"&&pe!=="auto"?pe:"",maxValue:be!=="none"&&be!=="auto"?be:"",onMinChange:ne=>r("min-height",ne||"0"),onMaxChange:ne=>r("max-height",ne||"none"),onMinReset:()=>i("min-height"),onMaxReset:()=>i("max-height"),minModified:o("min-height"),maxModified:o("max-height"),accentColor:p,onReset:()=>i("height")})]}),T&&tn("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8},children:[Ae("div",{style:{opacity:Pe?.3:1,transition:"opacity 150ms ease"},children:Ot()}),tn("div",{style:{flex:1,opacity:nt,transition:"opacity 150ms ease"},children:[Ae("div",{onClick:o("gap")?()=>i("gap"):void 0,title:o("gap")?"Click to reset":void 0,style:{fontSize:9,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:o("gap")?p:"#999",fontWeight:o("gap")?600:400,marginBottom:2,cursor:o("gap")?"pointer":"default"},children:"Gap"}),Ae(Pn,{dimmed:Pe,children:tn("div",{style:{display:"flex",alignItems:"center"},children:[Ae(er,{value:We,onChange:ne=>{ke("gap"),r("gap",ne)},onPreview:se("gap",de("gap")),onScrubEnd:()=>ke("gap"),onReset:()=>i("gap"),isModified:o("gap"),accentColor:p,defaultUnit:w,children:G==="column"||G==="column-reverse"?Ae(fa,{size:12,strokeWidth:o("gap")?2.5:1.5}):Ae(pa,{size:12,strokeWidth:o("gap")?2.5:1.5})}),Ae(Gn,{property:"gap",value:z.gap||We,onChange:ne=>r("gap",ne),isModified:o("gap")||"gap"in z,style:y(f({},cn),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:w,onUnitCycle:C})]})})]})]}),x&&tn("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:nt,transition:"opacity 150ms ease"},children:[Ae(Fu,{gridCols:Fe,gridRows:Ie,gridModified:bn,accentColor:p,onColsChange:ne=>r("grid-template-columns",`repeat(${ne}, 1fr)`),onRowsChange:ne=>r("grid-template-rows",`repeat(${ne}, 1fr)`)}),tn("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[Ae(Pn,{dimmed:Pe,children:tn("div",{style:{display:"flex",alignItems:"center"},children:[Ae(er,{value:oe||We,onChange:ne=>{ke("column-gap"),r("column-gap",ne)},onPreview:se("column-gap",de("column-gap")),onScrubEnd:()=>ke("column-gap"),onReset:()=>i("column-gap"),isModified:o("column-gap"),accentColor:p,defaultUnit:w,children:Ae(pa,{size:12,strokeWidth:o("column-gap")?2.5:1.5})}),Ae(Gn,{property:"column-gap",value:z["column-gap"]||oe||We,onChange:ne=>r("column-gap",ne),isModified:o("column-gap")||"column-gap"in z,placeholder:"col",style:y(f({},cn),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:w,onUnitCycle:C})]})}),Ae(Pn,{dimmed:Pe,children:tn("div",{style:{display:"flex",alignItems:"center"},children:[Ae(er,{value:Ce||We,onChange:ne=>{ke("row-gap"),r("row-gap",ne)},onPreview:se("row-gap",de("row-gap")),onScrubEnd:()=>ke("row-gap"),onReset:()=>i("row-gap"),isModified:o("row-gap"),accentColor:p,defaultUnit:w,children:Ae(fa,{size:12,strokeWidth:o("row-gap")?2.5:1.5})}),Ae(Gn,{property:"row-gap",value:z["row-gap"]||Ce||We,onChange:ne=>r("row-gap",ne),isModified:o("row-gap")||"row-gap"in z,placeholder:"row",style:y(f({},cn),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:w,onUnitCycle:C})]})})]})]}),N&&tn("div",{onMouseEnter:()=>g==null?void 0:g("padding"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:nt,transition:"opacity 150ms ease"},children:[Ae(Pn,{style:{flex:1},dimmed:Pe,children:tn("div",{style:{display:"flex",alignItems:"center"},children:[Ae(er,{value:me.left,onChange:ne=>{ke("padding-h"),Oe(ne)},onPreview:se("padding-h",ye),onScrubEnd:()=>ke("padding-h"),onReset:()=>i("padding"),isModified:o("padding"),accentColor:p,defaultUnit:w,snapSteps:is,children:Ae(Ou,{size:12,strokeWidth:o("padding")?2.5:1.5})}),Ae(Gn,{property:"padding",value:z["padding-h"]||me.left,onChange:ne=>Oe(ne),isModified:o("padding")||"padding-h"in z,placeholder:"H pad",style:y(f({},cn),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:w,onUnitCycle:C})]})}),Ae(Pn,{style:{flex:1},dimmed:Pe,children:tn("div",{style:{display:"flex",alignItems:"center"},children:[Ae(er,{value:me.top,onChange:ne=>{ke("padding-v"),h(ne)},onPreview:se("padding-v",ae),onScrubEnd:()=>ke("padding-v"),onReset:()=>i("padding"),isModified:o("padding"),accentColor:p,defaultUnit:w,snapSteps:is,children:Ae(Bu,{size:12,strokeWidth:o("padding")?2.5:1.5})}),Ae(Gn,{property:"padding",value:z["padding-v"]||me.top,onChange:ne=>h(ne),isModified:o("padding")||"padding-v"in z,placeholder:"V pad",style:y(f({},cn),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:w,onUnitCycle:C})]})})]}),tn("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:nt,transition:"opacity 150ms ease"},children:[Ae("input",{type:"checkbox",checked:je==="hidden",onChange:ne=>r("overflow",ne.target.checked?"hidden":"visible"),style:{margin:0,accentColor:p}}),"Clip content"]})]})]})}import{AlignCenter as $u,AlignJustify as zu,AlignLeft as Wu,AlignRight as ju,Baseline as Yu,ChevronDown as Gu,WholeWord as Ju}from"lucide-react";import{jsx as kt,jsxs as io}from"react/jsx-runtime";var ya={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function ba({element:e,getValue:t,handleChange:n,isModified:r,onResetProperty:o,isCollapsed:i,onToggle:s,sectionHeaderStyle:l,accentColor:a,colorVariables:d,activeColorDropdown:c,onColorDropdownChange:u,panelContentRef:p,preferredUnit:g,onUnitCycle:w}){var A;let C=t("font-family"),R=t("font-size"),P=t("font-weight"),G=t("line-height"),M=t("letter-spacing"),T=t("text-align"),x=t("color"),N=String(P),W=ya[N]||N,_=vr(e,x),H=x.includes("var(")?null:Sr(_,d),V=({align:Q,icon:ie})=>{let pe=T===Q;return kt("button",{type:"button",onClick:()=>n("text-align",Q),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:pe?qo(a,.15):"transparent",color:pe?a:"#64748b",cursor:"pointer"},children:ie})},k=((A=C.split(",")[0])==null?void 0:A.trim().replace(/^["']|["']$/g,""))||"System";return io("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[kt("div",{style:l,children:kt("span",{children:"Typography"})}),io("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[kt(Pn,{children:io("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[kt("input",{type:"text",value:C,onChange:Q=>n("font-family",Q.target.value),style:y(f({},cn),{flex:1,minWidth:0,padding:0,fontWeight:r("font-family")?600:400,color:r("font-family")?a:"inherit"}),title:C}),kt(Gu,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),io("div",{style:{display:"flex",gap:4},children:[kt(Pn,{style:{flex:1},children:kt("select",{value:N,onChange:Q=>n("font-weight",Q.target.value),style:y(f({},cn),{padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:r("font-weight")?600:400,color:r("font-weight")?a:"inherit"}),children:Object.entries(ya).map(([Q,ie])=>kt("option",{value:Q,children:ie},Q))})}),kt(Pn,{style:{flex:1},children:kt("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:kt(Gn,{property:"font-size",value:R,onChange:Q=>n("font-size",Q),isModified:r("font-size"),min:1,max:999,style:y(f({},cn),{padding:"6px 8px",paddingRight:24,fontWeight:r("font-size")?600:400,color:r("font-size")?a:"inherit"}),unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:g,onUnitCycle:w})})})]}),io("div",{style:{display:"flex",gap:4},children:[kt(Pn,{style:{flex:1},children:io("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[kt(Yu,{size:12,style:{color:r("line-height")?a:"#999",flexShrink:0}}),kt(Gn,{property:"line-height",value:G,onChange:Q=>n("line-height",Q),isModified:r("line-height"),step:.1,min:0,placeholder:"Auto",style:y(f({},cn),{flex:1,minWidth:0,padding:0,fontWeight:r("line-height")?600:400,color:r("line-height")?a:"inherit"}),showUnit:!1})]})}),kt(Pn,{style:{flex:1},children:io("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[kt(Ju,{size:12,style:{color:r("letter-spacing")?a:"#999",flexShrink:0}}),kt(Gn,{property:"letter-spacing",value:M,onChange:Q=>n("letter-spacing",Q),isModified:r("letter-spacing"),step:.1,placeholder:"\u2014",style:y(f({},cn),{flex:1,minWidth:0,padding:0,fontWeight:r("letter-spacing")?600:400,color:r("letter-spacing")?a:"inherit"}),showUnit:!1})]})})]}),io("div",{style:{display:"flex",gap:2,backgroundColor:Jn,borderRadius:2,padding:2},children:[kt(V,{align:"left",icon:kt(Wu,{size:14})}),kt(V,{align:"center",icon:kt($u,{size:14})}),kt(V,{align:"right",icon:kt(ju,{size:14})}),kt(V,{align:"justify",icon:kt(zu,{size:14})})]}),io("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[kt("span",{onClick:r("color")?()=>o("color"):void 0,title:r("color")?"Click to reset":void 0,style:{fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:r("color")?a:"#64748b",fontWeight:r("color")?600:400,cursor:r("color")?"pointer":"default",width:40,flexShrink:0},children:"Color"}),kt("div",{style:{flex:1,minWidth:0},children:kt(cs,{value:x,resolvedValue:_,colorVariables:d,matchingVariable:H,onChange:Q=>n("color",Q),accentColor:a,modified:r("color"),panelContentRef:p,isDropdownOpen:c==="color",onDropdownChange:Q=>u(Q?"color":null)})})]})]})]})}import{Fragment as qu,jsx as ve,jsxs as At}from"react/jsx-runtime";var va=[{name:"Background",properties:[{property:"background-color",label:"Color",type:"color"},{property:"opacity",label:"Opacity",type:"number",step:.1,min:0,max:1}]},{name:"Borders",properties:[{property:"border-width",label:"Width",type:"number",min:0,max:20},{property:"border-color",label:"Color",type:"color"},{property:"border-radius",label:"Radius",type:"number",min:0,max:100},{property:"border-style",label:"Style",type:"select",options:["none","solid","dashed","dotted","double"]}]},{name:"Effects",properties:[{property:"box-shadow",label:"Box Shadow",type:"text"},{property:"backdrop-filter",label:"Backdrop Filter",type:"backdrop-filter"},{property:"transform",label:"Transform",type:"text"}]}];function Ku(e,t){let n=t.trim().toLowerCase();switch(e){case"opacity":return n==="1";case"border-width":return n==="0px"||n==="0"||n==="medium";case"border-radius":return n==="0px"||n==="0";case"border-style":return n==="none";case"box-shadow":return n==="none";case"backdrop-filter":return n==="none"||n==="";case"letter-spacing":return n==="normal"||n==="0px"||n==="0";case"background-color":return n==="rgba(0, 0, 0, 0)"||n==="transparent";default:return!1}}function ls(e,t){return!t||e==="auto"||e==="fit-content"||e==="max-content"||e==="min-content"?"hug":e==="100%"||t==="100%"?"fill":"fixed"}function ti(e,t){switch(e){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let n=mo(t);if(typeof n.num=="number"&&!isNaN(n.num)){let r=n.unit==="%"?"px":n.unit||"px";return`${n.num}${r}`}return"auto"}}}function nr(e){let t=e.split(/\s+/).filter(Boolean);return t.length===1?{top:t[0],right:t[0],bottom:t[0],left:t[0]}:t.length===2?{top:t[0],right:t[1],bottom:t[0],left:t[1]}:t.length===3?{top:t[0],right:t[1],bottom:t[2],left:t[1]}:t.length>=4?{top:t[0],right:t[1],bottom:t[2],left:t[3]}:{top:"0px",right:"0px",bottom:"0px",left:"0px"}}function ma(e,t){return e==="grid"?"grid":e==="flex"||e==="inline-flex"?t==="column"||t==="column-reverse"?"flex-col":"flex-row":"block"}function ha(e,t){switch(e){case"block":t("display","block");break;case"flex-row":t("display","flex"),t("flex-direction","row");break;case"flex-col":t("display","flex"),t("flex-direction","column");break;case"grid":t("display","grid");break}}var Jn="rgba(0, 0, 0, 0.04)",cn={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};function as({label:e,property:t,cssValue:n,mode:r,onValueChange:o,onModeChange:i,modified:s,dimmed:l,dropdownOpen:a,onDropdownChange:d,panelContentRef:c,accentColor:u="#3b82f6",onReset:p,minValue:g,maxValue:w,onMinChange:C,onMaxChange:R,onMinReset:P,onMaxReset:G,minModified:M,maxModified:T}){let x=mo(n),N=s?x.unit||Qo(t):Qo(t),W=!s&&x.unit&&x.unit!==N?os(x.num,N):x.num,[_,H]=dn(!1),[V,k]=dn(String(W)),[A,Q]=dn(!1),ie=Ln(null),pe=Ln(null),be=Ln(null),me=Ln(!1);$n(()=>{_||k(String(W))},[W,_]),$n(()=>{if(!a)return;let Ie=wt=>{pe.current&&!wt.composedPath().includes(pe.current)&&be.current&&!wt.composedPath().includes(be.current)&&(d==null||d(!1))},ct=wt=>{wt.key==="Escape"&&(d==null||d(!1))};return document.addEventListener("mousedown",Ie),document.addEventListener("keydown",ct),()=>{document.removeEventListener("mousedown",Ie),document.removeEventListener("keydown",ct)}},[a,d]),$n(()=>{_&&ie.current&&(ie.current.focus(),ie.current.select())},[_]);let We=()=>{let Ie=Zr(V,t,n,s);o(Ie||`${Math.max(0,parseFloat(V)||0)}${N}`),H(!1)},Ce=()=>{if(me.current){me.current=!1;return}We()},oe=Ie=>{if(Ie.key==="Enter"){We();return}if(Ie.key==="Escape"){me.current=!0,k(String(W)),H(!1);return}if(Ie.key==="ArrowUp"||Ie.key==="ArrowDown"){Ie.preventDefault();let ct=Ie.key==="ArrowUp"?1:-1,wt=Ie.shiftKey?8:Ie.altKey?.1:1,Pe=parseFloat(V)||0,Tt=Math.round(Math.max(0,Pe+ct*wt)*1e3)/1e3;k(String(Tt)),o(`${Tt}${N}`)}},_e={fixed:"Fixed",hug:"Hug",fill:"Fill"},Ne={fixed:ve(xa,{size:12}),hug:ve(Vu,{size:12}),fill:ve(xa,{size:12})},je=()=>{d==null||d(!a)},Fe=()=>{if(!be.current||!(c!=null&&c.current))return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let Ie=be.current.getBoundingClientRect(),ct=c.current.getBoundingClientRect(),wt=c.current.closest('[data-devtools="panel"]'),Pe=wt?wt.getBoundingClientRect():{top:0,left:0};return{position:"fixed",top:Ie.bottom+4-Pe.top,left:ct.left+4-Pe.left,width:ct.width-8}};return At("div",{ref:be,onMouseEnter:()=>Q(!0),onMouseLeave:()=>Q(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:_?u:A?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Jn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:l?.3:1},children:[ve("span",{onClick:s&&p?p:void 0,title:s?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:s?u:"#999",fontWeight:s?600:400,padding:"0 8px",flexShrink:0,cursor:s?"pointer":"default"},children:e}),r==="fixed"?_?ve("input",{ref:ie,type:"text",inputMode:"numeric",value:V,onChange:Ie=>k(Ie.target.value),onKeyDown:oe,onBlur:Ce,style:y(f({},cn),{flex:1,minWidth:0,padding:"4px 2px"})}):ve("span",{onClick:()=>H(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:W}):ve("span",{style:{flex:1}}),At("button",{type:"button",onClick:je,style:{display:"flex",alignItems:"center",gap:2,padding:"4px 8px",border:"none",outline:"none",backgroundColor:"transparent",color:"#999",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"pointer",flexShrink:0},children:[_e[r],ve(ds,{size:12})]}),a&&At("div",{ref:pe,style:y(f({},Fe()),{backgroundColor:"#eaeaea",border:"1px solid rgba(0,0,0,0.1)",borderRadius:0,zIndex:10001,overflow:"hidden",fontSize:12,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace'}),children:[At("button",{type:"button",onClick:()=>{i("fixed"),d==null||d(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:r==="fixed"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:r==="fixed"?600:400,cursor:"pointer",textAlign:"left"},children:[Ne.fixed,At("span",{children:["Fixed ",t," (",n,")"]}),r==="fixed"&&ve(ni,{size:14,style:{marginLeft:"auto"}})]}),At("button",{type:"button",onClick:()=>{i("hug"),d==null||d(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:r==="hug"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:r==="hug"?600:400,cursor:"pointer",textAlign:"left"},children:[Ne.hug,ve("span",{children:"Hug contents"}),r==="hug"&&ve(ni,{size:14,style:{marginLeft:"auto"}})]}),At("button",{type:"button",onClick:()=>{i("fill"),d==null||d(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:r==="fill"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:r==="fill"?600:400,cursor:"pointer",textAlign:"left"},children:[Ne.fill,ve("span",{children:"Fill container"}),r==="fill"&&ve(ni,{size:14,style:{marginLeft:"auto"}})]}),ve("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),At("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[At("div",{style:{display:"flex",alignItems:"center",backgroundColor:Jn,borderRadius:2,padding:"4px 8px"},children:[ve("span",{onClick:M?Ie=>{Ie.stopPropagation(),P==null||P()}:void 0,title:M?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:M?u:"#999",fontWeight:M?600:400,marginRight:8,flexShrink:0,cursor:M?"pointer":"default"},children:"Min"}),ve("input",{type:"text",value:g||"",placeholder:"\u2014",onChange:Ie=>C==null?void 0:C(Ie.target.value),onClick:Ie=>Ie.stopPropagation(),style:y(f({},cn),{flex:1,minWidth:0,padding:0,textAlign:"right",color:M?u:"inherit",fontWeight:M?600:400})})]}),At("div",{style:{display:"flex",alignItems:"center",backgroundColor:Jn,borderRadius:2,padding:"4px 8px"},children:[ve("span",{onClick:T?Ie=>{Ie.stopPropagation(),G==null||G()}:void 0,title:T?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:T?u:"#999",fontWeight:T?600:400,marginRight:8,flexShrink:0,cursor:T?"pointer":"default"},children:"Max"}),ve("input",{type:"text",value:w||"",placeholder:"\u2014",onChange:Ie=>R==null?void 0:R(Ie.target.value),onClick:Ie=>Ie.stopPropagation(),style:y(f({},cn),{flex:1,minWidth:0,padding:0,textAlign:"right",color:T?u:"inherit",fontWeight:T?600:400})})]})]})]})]})}function Pn({children:e,style:t,dimmed:n}){let[r,o]=dn(!1);return ve("div",{onMouseEnter:()=>o(!0),onMouseLeave:()=>o(!1),style:f({position:"relative",borderRadius:2,border:"1px solid",borderColor:r?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Jn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:n?.3:1},t),children:e})}function ro({children:e}){let[t,n]=dn(!1);return ve("div",{onMouseEnter:()=>n(!0),onMouseLeave:()=>n(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:t?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Jn,transition:"border-color 100ms ease"},children:e})}function Gn({property:e,value:t,onChange:n,isModified:r=!1,step:o=1,min:i,max:s,style:l,placeholder:a,showUnit:d=!0,unitStyle:c,preferredUnit:u,onUnitCycle:p}){let g=mo(t),w=Qo(e),C=qr[e],P=u&&C&&C.includes(u)?u:w,G=r&&g.unit||P,M=!r&&g.unit&&g.unit!==G?os(g.num,G):g.num,[T,x]=dn(!1),[N,W]=dn(""),_=Ce=>{x(!0),W(String(M||"")),requestAnimationFrame(()=>Ce.target.select())},H=()=>{if(x(!1),N.trim()){let Ce=Zr(N,e,t,r);Ce&&n(Ce)}},V=Ce=>{let oe=Ce.target.value;W(oe);let _e=oe.trim(),Ne=_e.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),je=_e.match(/^(-?[\d.]+)$/);if(Ne){let Fe=parseFloat(Ne[1]);isNaN(Fe)||n(`${Fe}${Ne[2].toLowerCase()}`)}else if(je){let Fe=parseFloat(je[1]);isNaN(Fe)||n(`${Fe}${G}`)}},k=Ce=>{if(Ce.key==="Enter"){if(N.trim()){let oe=Zr(N,e,t,r);oe&&n(oe)}Ce.target.blur();return}if(Ce.key==="ArrowUp"||Ce.key==="ArrowDown"){Ce.preventDefault();let oe=Ce.shiftKey?10:Ce.altKey?.1:1,_e=(Ce.key==="ArrowUp"?1:-1)*o*oe,Ne=parseFloat(N)||M||0,je=Math.round((Ne+_e)*1e3)/1e3;i!==void 0&&(je=Math.max(i,je)),s!==void 0&&(je=Math.min(s,je)),W(String(je)),n(`${je}${G}`)}},A=/^-?[\d.]/.test(t.trim()),Q=T?N:A?String(M):"",pe=T&&/\s*(rem|em|px|%)\s*$/i.test(N)?"":G,be=p&&(pe==="rem"||pe==="px"),me={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},We=y(f({},c!=null?c:me),{pointerEvents:"auto",cursor:"pointer"});return At(qu,{children:[ve("input",{type:"text",inputMode:"decimal",value:Q,onFocus:_,onBlur:H,onChange:V,onKeyDown:k,placeholder:a,style:l}),d&&pe&&ve("span",{style:be?We:c!=null?c:me,onClick:be?p:void 0,title:be?"Click to switch units":void 0,children:pe})]})}function cs({value:e,resolvedValue:t,colorVariables:n,matchingVariable:r,onChange:o,accentColor:i="#3b82f6",modified:s,panelContentRef:l,isDropdownOpen:a,onDropdownChange:d}){let[c,u]=dn(!1),p=!e.includes("var(")&&r?r.usage:e,[g,w]=dn(p),[C,R]=dn(!1),[P,G]=dn(!1),[M,T]=dn(!1),x=Ln(null),N=Ln(null),W=Ln(null),_=a!==void 0?a:C,H=d||R,V=Xn(()=>{if(!W.current)return{position:"fixed",top:0,left:0,width:200};let oe=W.current.getBoundingClientRect(),_e=W.current.closest('[data-devtools="panel"]'),Ne=_e?_e.getBoundingClientRect():{top:0,left:0};if(l!=null&&l.current){let je=l.current.getBoundingClientRect();return{position:"fixed",top:oe.bottom+4-Ne.top,left:je.left+4-Ne.left,width:je.width-8}}return{position:"fixed",top:oe.bottom+4-Ne.top,left:oe.left-Ne.left,width:oe.width}},[l]);$n(()=>{if(!c){let oe=!e.includes("var(")&&r?r.usage:e;w(oe)}},[e,c,r]),$n(()=>{if(!_&&!P)return;let oe=Ne=>{W.current&&!Ne.composedPath().includes(W.current)&&(H(!1),G(!1))},_e=Ne=>{Ne.key==="Escape"&&(H(!1),G(!1))};return document.addEventListener("mousedown",oe),document.addEventListener("keydown",_e),()=>{document.removeEventListener("mousedown",oe),document.removeEventListener("keydown",_e)}},[_,P]),$n(()=>{c&&x.current&&(x.current.focus(),x.current.select())},[c]);let k=oi(()=>{if(!g||g.startsWith("#")||g.startsWith("rgb")||g.startsWith("hsl")||g.startsWith("oklch"))return[];let oe=g.toLowerCase();return n.filter(_e=>_e.name.toLowerCase().includes(oe)||_e.usage.toLowerCase().includes(oe)).slice(0,8)},[g,n]),A=()=>{o(g),u(!1),G(!1)},Q=oe=>{w(oe),oe.includes("var")||oe.includes("--")||oe.length>0&&!oe.startsWith("#")?G(!0):G(!1)},ie=oe=>{w(oe.usage),o(oe.usage),H(!1),G(!1),u(!1)},pe=()=>{setTimeout(()=>{!_&&!P&&A()},150)},be=oe=>{oe.key==="Enter"?A():oe.key==="Escape"&&(w(e),u(!1),G(!1))},me=oi(()=>{let oe=t.trim().toLowerCase();if(oe.startsWith("#"))return oe.length===4?`#${oe[1]}${oe[1]}${oe[2]}${oe[2]}${oe[3]}${oe[3]}`:oe.slice(0,7);let _e=oe.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(_e){let je=parseInt(_e[1],10).toString(16).padStart(2,"0"),Fe=parseInt(_e[2],10).toString(16).padStart(2,"0"),Ie=parseInt(_e[3],10).toString(16).padStart(2,"0");return`#${je}${Fe}${Ie}`}let Ne=oe.match(/oklch\(\s*([\d.]+)/);if(Ne){let je=Math.max(0,Math.min(1,parseFloat(Ne[1]))),Fe=Math.round(je*255).toString(16).padStart(2,"0");return`#${Fe}${Fe}${Fe}`}return"#000000"},[t]),We=oe=>{let _e=oe.target.value;w(_e),o(_e)},Ce=e.includes("var(");return At("div",{ref:W,onMouseEnter:()=>T(!0),onMouseLeave:()=>T(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:c?i:M?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Jn,transition:"border-color 100ms ease",overflow:"hidden"},children:[At("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[At("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[ve("input",{type:"color",value:me,onChange:We,style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),ve("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:t,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),c?ve("input",{ref:x,type:"text",value:g,onChange:oe=>Q(oe.target.value),onKeyDown:be,onBlur:pe,style:y(f({},cn),{flex:1,minWidth:0})}):ve("span",{onClick:()=>u(!0),style:{flex:1,minWidth:0,padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",color:s?i:"inherit"},title:p,children:p}),n.length>0&&ve("button",{type:"button",onClick:()=>H(!_),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:ve(ds,{size:12})})]}),P&&k.length>0&&ve("div",{style:y(f({},V()),{backgroundColor:"#eaeaea",border:"1px solid rgba(0,0,0,0.1)",borderRadius:0,zIndex:10001,maxHeight:200,overflowY:"auto",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace'}),children:k.map(oe=>At("button",{type:"button",onClick:()=>ie(oe),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:"transparent",color:"#1e293b",cursor:"pointer",textAlign:"left",fontSize:12},children:[ve("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:oe.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ve("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:oe.name})]},oe.name))}),_&&ve("div",{ref:N,style:y(f({},V()),{backgroundColor:"#eaeaea",border:"1px solid rgba(0,0,0,0.1)",borderRadius:0,zIndex:10001,maxHeight:280,overflowY:"auto",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace'}),children:n.map(oe=>At("button",{type:"button",onClick:()=>ie(oe),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:p===oe.usage||e===oe.usage?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:p===oe.usage||e===oe.usage?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[ve("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:oe.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ve("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:oe.name}),(p===oe.usage||e===oe.usage)&&ve(ni,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},oe.name))})]})}function Sa({element:e,elementInfo:t,selector:n,styleModifications:r,dispatch:o,onClose:i,onHover:s,accentColor:l="#3b82f6",toolbarRef:a}){var Mt,Oe;let d=Ln(null),c=Ln(null),[u,p]=dn(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch(h){return!1}});$n(()=>{if(u)return;let h=setTimeout(()=>p(!0),50);return()=>clearTimeout(h)},[u]);let[g,w]=dn(null),[C,R]=dn(null),P=g!==null||C!==null,[G,M]=dn("rem"),T=Xn(()=>{M(h=>h==="rem"?"px":"rem")},[]),x=Ln(new Map),[N,W]=dn(""),_=oi(()=>ji(),[]);$n(()=>{let h=z=>{var se;if(z.key!=="Escape")return;let te=document.activeElement;te&&((se=d.current)!=null&&se.contains(te))||i()};return window.addEventListener("keydown",h),()=>window.removeEventListener("keydown",h)},[i]);let H=Ln({top:0,left:0,maxHeight:400}),[,V]=dn(0),k="devtools-panel-position",A=Ln({x:0,y:0}),Q=Ln(null),ie=Ln(!1);$n(()=>{try{let h=localStorage.getItem(k);if(h){let z=JSON.parse(h);typeof z.top=="number"&&typeof z.left=="number"&&(ie.current=!0,H.current=y(f({},H.current),{top:z.top,left:z.left}))}}catch(h){}},[]),$n(()=>{let h=te=>{var Jt;let se=Q.current;if(!se)return;let ke=se.startOffsetX+(te.clientX-se.startX),ye=se.startOffsetY+(te.clientY-se.startY),ae=280,de=16,ue=Math.max(de,Math.min(window.innerWidth-ae-de,H.current.left+ke)),Ye=Math.max(de,H.current.top+ye);A.current={x:ue-H.current.left,y:Ye-H.current.top};let qe=d.current,st=qe==null?void 0:qe.parentElement;if(!st)return;st.style.top=`${Ye}px`,st.style.left=`${ue}px`;let Pt=(Jt=a==null?void 0:a.current)==null?void 0:Jt.getBoundingClientRect(),Ct=window.innerHeight-16;Pt&&ue+ae>Pt.left&&(Ct=Pt.top-8);let It=Math.max(0,Ye),Gt=Math.max(200,Ct-It);qe&&(qe.style.maxHeight=`${Gt}px`)},z=()=>{if(!Q.current)return;let te=H.current.top+A.current.y,se=H.current.left+A.current.x;H.current=y(f({},H.current),{top:te,left:se}),A.current={x:0,y:0},ie.current=!0;try{localStorage.setItem(k,JSON.stringify({top:te,left:se}))}catch(ke){}Q.current=null};return window.addEventListener("mousemove",h),window.addEventListener("mouseup",z),()=>{window.removeEventListener("mousemove",h),window.removeEventListener("mouseup",z)}},[]);let pe=Xn(h=>{h.button!==0||h.target.closest("button")||(h.preventDefault(),Q.current={startX:h.clientX,startY:h.clientY,startOffsetX:A.current.x,startOffsetY:A.current.y})},[]);$n(()=>{A.current={x:0,y:0};let h=(se=!1)=>{var Ct;let ke=d.current,ye=280,ae=8,de,ue;if(ie.current)de=H.current.top,ue=H.current.left;else{let It=e.getBoundingClientRect();ue=It.right+ae,de=It.top,ue+ye>window.innerWidth-ae&&(ue=It.left-ye-ae),ue<ae&&(ue=Math.max(ae,(window.innerWidth-ye)/2))}let Ye=(Ct=a==null?void 0:a.current)==null?void 0:Ct.getBoundingClientRect(),qe=window.innerHeight-16;Ye&&ue+ye>Ye.left&&(qe=Ye.top-ae);let st=Math.max(0,de),Pt=Math.max(200,qe-st);if(H.current={top:de,left:ue,maxHeight:Pt},se&&ke){let It=ke.parentElement;It&&!ie.current&&(It.style.top=`${de+A.current.y}px`,It.style.left=`${ue+A.current.x}px`),ke.style.maxHeight=`${Pt}px`}else V(It=>It+1)};h(!1);let z=()=>h(!0),te=()=>h(!1);return window.addEventListener("scroll",z,{passive:!0}),window.addEventListener("resize",te,{passive:!0}),()=>{window.removeEventListener("scroll",z),window.removeEventListener("resize",te)}},[e]),$n(()=>{let h=d.current;if(!h)return;let z=te=>{let se=c.current;if(!se){te.preventDefault();return}let{scrollTop:ke,scrollHeight:ye,clientHeight:ae}=se,de=ke<=0&&te.deltaY<0,ue=ke+ae>=ye&&te.deltaY>0;(de||ue)&&te.preventDefault()};return h.addEventListener("wheel",z,{passive:!1}),()=>h.removeEventListener("wheel",z)},[]);let be=oi(()=>r.find(h=>h.selector===n),[r,n]),me=Xn(h=>{let z=be==null?void 0:be.changes.find(te=>te.property===h);if(z)return z.modified;if(h.includes("color")){let te=Hi(e,h);if(te&&te.includes("var("))return te}return yr(e,h)},[e,be]),We=Xn(h=>{if(x.current.has(h))return x.current.get(h);let z=be==null?void 0:be.changes.find(se=>se.property===h);if(z)return z.original;let te=yr(e,h);return x.current.set(h,te),te},[e,be]),Ce=Xn((h,z)=>{let te=We(h);Ve(e,h,z),h==="backdrop-filter"&&Ve(e,"-webkit-backdrop-filter",z),o({type:"MODIFY_STYLE",payload:{selector:n,element:t,property:h,original:te,modified:z}})},[e,n,t,o,We]),oe=Xn(()=>{Wi(n,r);let h=r.find(z=>z.selector===n);if(h)for(let z of h.changes)o({type:"CLEAR_STYLE",payload:{selector:n,property:z.property}});x.current.clear()},[n,r,o]),_e=Xn(h=>{let z=r.find(se=>se.selector===n);z!=null&&z.changes.find(se=>se.property===h)&&e instanceof HTMLElement&&(e.style.removeProperty(h),o({type:"CLEAR_STYLE",payload:{selector:n,property:h}}),x.current.delete(h))},[e,n,r,o]),Ne=Xn(()=>{let h=N.split(";").map(z=>z.trim()).filter(z=>z);for(let z of h){let te=z.indexOf(":");if(te>0){let se=z.slice(0,te).trim(),ke=z.slice(te+1).trim();se&&ke&&Ce(se,ke)}}W("")},[N,Ce]),je=Xn(h=>{var z;return(z=be==null?void 0:be.changes.some(te=>te.property===h))!=null?z:!1},[be]),Fe=h=>{var ye;let z=me(h.property),te=je(h.property),se=!te&&Ku(h.property,z),ke={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};if(se&&h.type!=="backdrop-filter")return ve(ro,{modified:!1,children:ve("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:ae=>Ce(h.property,ae.target.value),style:y(f({},ke),{color:"#999"})})});switch(h.type){case"color":{let ae=vr(e,z),de=z.includes("var(")?null:Sr(ae,_);return ve(cs,{value:z,resolvedValue:ae,colorVariables:_,matchingVariable:de,onChange:ue=>Ce(h.property,ue),accentColor:l,modified:te,panelContentRef:c,isDropdownOpen:C===h.property,onDropdownChange:ue=>R(ue?h.property:null)})}case"number":{if(!!qr[h.property])return ve(ro,{modified:te,children:ve(Gn,{property:h.property,value:z,onChange:ue=>Ce(h.property,ue),isModified:te,min:h.min,max:h.max,step:h.step||1,style:y(f({},ke),{paddingRight:32}),unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:G,onUnitCycle:T})});let{num:de}=mo(z);return ve(ro,{modified:te,children:ve("input",{type:"number",value:de,min:h.min,max:h.max,step:h.step||1,onChange:ue=>Ce(h.property,ue.target.value),style:ke})})}case"select":return ve(ro,{modified:te,children:At("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[ve("select",{value:z,onChange:ae=>Ce(h.property,ae.target.value),style:y(f({},ke),{cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"}),children:(ye=h.options)==null?void 0:ye.map(ae=>ve("option",{value:ae,children:ae},ae))}),ve("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:ve(ds,{size:12})})]})});case"spacing":return ve(ro,{modified:te,children:ve("input",{type:"text",value:z,onChange:ae=>Ce(h.property,ae.target.value),placeholder:"e.g., 10px or 10px 20px",style:ke})});case"backdrop-filter":return ve(da,{value:z,onChange:ae=>Ce(h.property,ae),accentColor:l,modified:te,panelContentRef:c});default:return ve(ro,{modified:te,children:ve("input",{type:"text",value:z,onChange:ae=>Ce(h.property,ae.target.value),style:ke})})}},Ie=(Mt=be==null?void 0:be.changes.length)!=null?Mt:0,ct=(Oe=be==null?void 0:be.captured)!=null?Oe:!1,wt=y(f({position:"fixed",top:H.current.top,left:H.current.left,width:280,maxHeight:H.current.maxHeight,backgroundColor:"rgba(255, 255, 255, 0.85)",backdropFilter:"blur(32px)",WebkitBackdropFilter:"blur(32px)"},go),{zIndex:1e4,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontSize:12,overflow:"hidden",display:"flex",flexDirection:"column",opacity:u?1:0,transition:"opacity 150ms ease"}),Pe={display:"flex",alignItems:"center",justifyContent:"space-between",margin:"3px 3px 0",padding:"8px 7px 8px 12px",borderBottom:"1px solid rgba(0,0,0,0.1)",backgroundColor:"#f8fafc",cursor:Q.current?"grabbing":"grab"},Tt={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"12px 12px 6px",userSelect:"none",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontWeight:600,color:"#475569"},nt={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},Lt={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return ve("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:H.current.top+A.current.y,left:H.current.left+A.current.x,zIndex:1e4,pointerEvents:"none"},children:At("div",{ref:d,"data-devtools":"panel",style:y(f({},wt),{position:"relative",top:0,left:0,zIndex:0,pointerEvents:"auto"}),onMouseEnter:()=>s==null?void 0:s("element"),onMouseLeave:()=>s==null?void 0:s(null),children:[At("div",{style:Pe,onMouseDown:pe,children:[At("div",{style:{display:"flex",alignItems:"center",gap:8,overflow:"hidden"},children:[ve("span",{style:{fontWeight:600,fontSize:11,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:t.tagName}),Ie>0&&ve("span",{style:{backgroundColor:ct?"#999999":l,color:"#fff",fontSize:9,padding:"1px 4px",borderRadius:2},children:Ie})]}),At("div",{style:{display:"flex",gap:4},children:[Ie>0&&ve("button",{type:"button",onClick:oe,title:"Reset all changes",style:{display:"flex",alignItems:"center",justifyContent:"center",width:24,height:24,border:"none",background:"none",cursor:"pointer",color:"#64748b",borderRadius:2},children:ve(Uu,{size:14})}),ve("button",{type:"button",onClick:i,title:"Close",style:{display:"flex",alignItems:"center",justifyContent:"center",width:24,height:24,border:"none",background:"none",cursor:"pointer",color:"#64748b",borderRadius:2},children:ve(Xu,{size:14})})]})]}),At("div",{ref:c,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[ve("div",{style:{opacity:C?.3:1,transition:"opacity 150ms ease"},children:ve(ga,{element:e,getValue:me,getOriginalValue:We,handleChange:Ce,isModified:je,onResetProperty:_e,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:Tt,activeDropdown:g,onDropdownChange:w,panelContentRef:c,accentColor:l,onFieldHover:s,preferredUnit:G,onUnitCycle:T})}),ve("div",{style:{opacity:g?.3:1,transition:"opacity 150ms ease"},children:ve(ba,{element:e,getValue:me,handleChange:Ce,isModified:je,onResetProperty:_e,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:Tt,accentColor:l,colorVariables:_,activeColorDropdown:C,onColorDropdownChange:R,panelContentRef:c,preferredUnit:G,onUnitCycle:T})}),va.map((h,z)=>{let te=z===va.length-1,se=C&&h.properties.some(ye=>ye.property===C);return At("div",{style:{borderBottom:te?"none":"1px solid rgba(0,0,0,0.08)",opacity:P&&!se?.3:1,transition:"opacity 150ms ease"},children:[ve("div",{style:Tt,children:ve("span",{children:h.name})}),ve("div",{style:{padding:"4px 0"},children:h.properties.map(ye=>{let ae=je(ye.property),de=se&&ye.property!==C;return At("div",{style:y(f({},nt),{opacity:de?.3:1,transition:"opacity 150ms ease"}),children:[ve("span",{onClick:ae?()=>_e(ye.property):void 0,title:ae?"Click to reset":void 0,style:y(f({},Lt),{color:ae?l:"#64748b",fontWeight:ae?600:400,cursor:ae?"pointer":"default"}),children:ye.label}),ve("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:Fe(ye)})]},ye.property)})})]},h.name)}),At("div",{style:{opacity:P?.3:1,transition:"opacity 150ms ease"},children:[ve("div",{style:Tt,children:ve("span",{children:"Raw CSS"})}),At("div",{style:{padding:"8px 12px"},children:[ve("textarea",{value:N,onChange:h=>W(h.target.value),placeholder:"property: value; ...",style:{width:"100%",height:60,padding:8,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"1px solid rgba(0,0,0,0.1)",borderRadius:2,resize:"vertical",outline:"none"}}),N.trim()&&ve("button",{type:"button",onClick:Ne,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:l,color:"#fff",cursor:"pointer",opacity:N.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as Zu,useLayoutEffect as Qu,useState as ep}from"react";import{Fragment as rp,jsx as Oo,jsxs as op}from"react/jsx-runtime";var us=["flex-start","center","flex-end"],ps=["flex-start","center","flex-end"];function tp(e){return e==="normal"||e==="flex-start"||e==="start"?"flex-start":e==="flex-end"||e==="end"?"flex-end":e==="center"?"center":null}function np(e){return e==="normal"||e==="stretch"||e==="flex-start"||e==="start"?"flex-start":e==="flex-end"||e==="end"?"flex-end":e==="center"?"center":null}function wa(e){let t=Array.from(e.children);if(t.length===0)return null;let n=1/0,r=1/0,o=-1/0,i=-1/0;for(let s of t){let l=s.getBoundingClientRect();l.width===0&&l.height===0||(l.top<n&&(n=l.top),l.left<r&&(r=l.left),l.bottom>o&&(o=l.bottom),l.right>i&&(i=l.right))}return n===1/0?null:new DOMRect(r,n,i-r,o-n)}function Ca({element:e,modifier:t,accentColor:n,refreshKey:r=0}){let[o,i]=ep(null);if(Zu(()=>{if(!e){i(null);return}let C=()=>i(wa(e));return C(),window.addEventListener("scroll",C,{passive:!0}),window.addEventListener("resize",C,{passive:!0}),()=>{window.removeEventListener("scroll",C),window.removeEventListener("resize",C)}},[e]),Qu(()=>{e&&i(wa(e))},[e,r]),!o)return null;let s=o,l=window.getComputedStyle(e),a=l.display;if(a!=="flex"&&a!=="inline-flex")return null;let d=l.flexDirection,c=d==="column"||d==="column-reverse"?"vertical":"horizontal",u=c==="horizontal"?"vertical":"horizontal",p=[];if(t==="shift"){let C=tp(l.justifyContent);if(C){let R=us.indexOf(C);c==="horizontal"?(R>0&&p.push("left"),R<us.length-1&&p.push("right")):(R>0&&p.push("up"),R<us.length-1&&p.push("down"))}}else{let C=np(l.alignItems);if(C){let R=ps.indexOf(C);u==="horizontal"?(R>0&&p.push("left"),R<ps.length-1&&p.push("right")):(R>0&&p.push("up"),R<ps.length-1&&p.push("down"))}}if(p.length===0)return null;let g=14,w=7;return Oo(rp,{children:p.map(C=>{let R,P;switch(C){case"right":R=s.right+g,P=s.top+s.height/2;break;case"left":R=s.left-g,P=s.top+s.height/2;break;case"down":R=s.left+s.width/2,P=s.bottom+g;break;case"up":R=s.left+s.width/2,P=s.top-g;break}let G=C==="right"?0:C==="left"?180:C==="down"?90:-90,M={position:"fixed",left:R-w,top:P-w,width:w*2,height:w*2,pointerEvents:"none",zIndex:9997};return Oo("div",{"data-devtools":"swipe-hint",style:M,children:Oo("svg",{width:w*2,height:w*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:op("g",{transform:`rotate(${G})`,children:[Oo("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),Oo("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),Oo("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:n,strokeWidth:"1.5",strokeLinecap:"round"}),Oo("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:n,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},C)})})}import{useEffect as ip,useLayoutEffect as sp,useState as lp}from"react";import{jsx as fs,jsxs as gs}from"react/jsx-runtime";function ap(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function ka({element:e,fontSize:t,lineHeight:n,accentColor:r,hoveredProperty:o,draggingProperty:i,cursorViewport:s}){let[l,a]=lp(null);if(ip(()=>{if(!e){a(null);return}let P=()=>{a(Ko(e))};return P(),window.addEventListener("scroll",P,{passive:!0}),window.addEventListener("resize",P,{passive:!0}),()=>{window.removeEventListener("scroll",P),window.removeEventListener("resize",P)}},[e]),sp(()=>{e&&a(Ko(e))},[e,t,n]),!l)return null;let d=l.width,c=l.height,u=ap(r,.2),p=i!=null?i:o,g=8,w=2,C={position:"fixed",top:l.top,left:l.left,width:d,height:c,pointerEvents:"none",zIndex:9996,overflow:"visible"},R=P=>P==="font-size"?`${Math.round(t)}`:(t>0?n/t:1.2).toFixed(2).replace(/\.?0+$/,"");return gs("div",{"data-devtools":"text-handles",style:C,children:[gs("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${c}`,children:[fs("rect",{x:"0.5",y:"0.5",width:Math.max(0,d-1),height:Math.max(0,c-1),fill:"none",stroke:u,strokeWidth:"1"}),(p==="font-size"||!p)&&fs("rect",{x:d-w/2,y:c/2-g/2,width:w,height:g,fill:r,stroke:"#ffffff",strokeWidth:p==="font-size"?4:2,paintOrder:"stroke"}),(p==="line-height"||!p)&&fs("rect",{x:d/2-g/2,y:c-w/2,width:g,height:w,fill:r,stroke:"#ffffff",strokeWidth:p==="line-height"?4:2,paintOrder:"stroke"})]}),s&&p&&(()=>{let P=p==="font-size"?"Aa":"Lh",G=R(p);return gs("div",{style:{position:"fixed",left:s.x+8,top:s.y-28,background:r,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:[P," ",G]})})()]})}import{Fragment as rr,jsx as at,jsxs as or}from"react/jsx-runtime";var Ea=8,ms=[0,1,2,4,8,12,16,20,24,28,32],hs="devtools-active-text";function Ta(e,t,n=0,r,o){let i=e.left+window.scrollX+4,s=t==="top-left"?e.top+window.scrollY-Fn-n*Fn+4:e.bottom+window.scrollY+4-1+n*Fn,l=window.scrollY+4,a=window.scrollY+window.innerHeight-Fn-4,d=90,c=!1;if(r&&o!==void 0){let u=r.getBoundingClientRect();if(e.left+4+o+4+d>u.left){let g=window.scrollY+u.top-Fn-4;g<a&&(a=g,c=!0)}}return s<l?s=e.top+window.scrollY+4:s>a&&(s=c?a:Math.max(e.top+window.scrollY+4,a)),{x:i,y:s}}function Ma({state:e,dispatch:t,onScreenshot:n,inFlightAnnotationIds:r,inFlightStyleSelectors:o,inFlightSelectorColors:i,onAttachImages:s,onReply:l,onViewThread:a,onCloseThread:d,onModelComponentsAdd:c,onModelComponentFocus:u,onModelComponentHover:p,modelComponentNames:g,modelPanelHoveredComponent:w,modelSpacingTokenHover:C,highlightedAnnotationIds:R,focusedThreadAnnotationId:P,externalCanvasRef:G,toolbarRef:M}){var $s,zs,Ws,js,Ys,Gs,Js,Us,Vs;let{canvasRef:T,redrawAll:x,resizeCanvas:N}=Il(),W=Zt(m=>{T.current=m,G&&(G.current=m)},[G,T]),_=jt(!1);hn(()=>{let m=T.current;if(!m)return;let b=()=>{_.current&&(_.current=!1,m.style.pointerEvents="")},q=I=>{I.button===0&&_.current&&b()};return window.addEventListener("mousedown",q),()=>window.removeEventListener("mousedown",q)},[T]);let[H,V]=gt(!1),[k,A]=gt(()=>{if(typeof window=="undefined")return null;try{let m=localStorage.getItem(hs);return m?JSON.parse(m):null}catch(m){return null}}),[Q,ie]=gt(null),[pe,be]=gt(null),[me,We]=gt(null),Ce=jt(null),oe=jt(null),_e=jt({x:0,y:0}),Ne=jt([]),je=jt(0),[Fe,Ie]=gt(null),[ct,wt]=gt(new Map),Pe=jt(0),Tt=jt(null),[nt,Lt]=gt(null),[Mt,Oe]=gt(null),[h,z]=gt(null),[te,se]=gt(null),ke=jt({isDragging:!1,side:null,startX:0,startY:0,original:{top:0,right:0,bottom:0,left:0},element:null,elementInfo:null,selector:null,durableSelector:null}),[ye,ae]=gt(null),[de,ue]=gt(null),[Ye,qe]=gt(null),[st,Pt]=gt(null),Ct=jt({x:0,y:0}),[It,Gt]=gt({x:0,y:0}),Jt=jt({isDragging:!1,hasMoved:!1,axis:null,startX:0,startY:0,originalRow:0,originalColumn:0,element:null,elementInfo:null,selector:null,durableSelector:null,isAuto:!1,originalJustifyContent:"",visualGap:0}),[$t,on]=gt(null),[Ot,bn]=gt(null),[St,ne]=gt(null),[De,ot]=gt(!1),[Dn,Tn]=gt(0),[Qt,Mn]=gt(null),Sn=jt({isDragging:!1,corner:null,startY:0,original:{"top-left":0,"top-right":0,"bottom-right":0,"bottom-left":0},maxRadius:0,element:null,elementInfo:null,selector:null,durableSelector:null}),[Bt,ur]=gt(null),[fn,Nt]=gt(null),[Dt,yt]=gt(null),rn=jt({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[_t,Qn]=gt(null),[wn,bo]=gt(null),[lt,eo]=gt(null),xo=Ll(),vo=jt(i);vo.current=i;let to=Zt(m=>{let b=vo.current;if(!b||b.size===0)return!1;for(let q of b.keys())try{if(m.matches(q))return!0}catch(I){}return!1},[]),D=jt(e);D.current=e;let X=jt(k);X.current=k;let re=jt([]),we=jt(n);we.current=n;let[K,Ee]=gt(null),Te=e.selectedAnnotationIds;re.current=Te;let Le=Zt((m,b=!1)=>{t({type:"SELECT_ANNOTATION",payload:{id:m,addToSelection:b}})},[t]),v=Zt(()=>{t({type:"SELECT_ANNOTATION",payload:{id:null}})},[t]),[B,ee]=gt(null),[le,Me]=gt({x:window.scrollX,y:window.scrollY});hn(()=>(N(),window.addEventListener("resize",N),()=>window.removeEventListener("resize",N)),[N]),hn(()=>{let m=()=>{Me({x:window.scrollX,y:window.scrollY})};return window.addEventListener("scroll",m,{passive:!0}),()=>window.removeEventListener("scroll",m)},[]),hn(()=>{k?localStorage.setItem(hs,JSON.stringify(k)):localStorage.removeItem(hs)},[k]),Rl(k,A,Q,e.annotations,t);let ge=jt(Fe);ge.current=Fe,hn(()=>{if(e.activeTool!=="model"||!e.isAnnotating)return;let m=b=>{if(!b.altKey||!ge.current)return;b.preventDefault();let q=b.deltaY>0?-1:1;Pe.current=Math.max(0,Pe.current+q);let I=Tt.current;if(I){let L=zr(I,Pe.current);Ie(L)}};return window.addEventListener("wheel",m,{passive:!1}),()=>window.removeEventListener("wheel",m)},[e.activeTool,e.isAnnotating]),hn(()=>{e.activeTool!=="model"&&(Ie(null),wt(new Map),Pe.current=0,Tt.current=null)},[e.activeTool]),hn(()=>{var q;let m=(q=Fe==null?void 0:Fe.name)!=null?q:null,b=m&&(g!=null&&g.has(m))?m:null;p==null||p(b)},[Fe,g,p]);let[Ge,Xe]=gt(null);hn(()=>{var q;if(!w){Xe(null);return}let m=Uo(w.name),b=w.instanceIndex;Xe((q=m[b%m.length])!=null?q:null)},[w]);let[mt,Ze]=gt([]);hn(()=>{var m,b;if(!C){Ze([]);return}(b=(m=C.token)==null?void 0:m.bindings)!=null&&b.length?Ze(Di(C.token)):Ze(Bi(C.px))},[C]);let rt=jt(null),dt=jt(null);rt.current=$t,dt.current=Ot,hn(()=>{let m=["flex-start","center","flex-end"],b=["flex-start","center","flex-end"],I=null,L=!1,j=null,ce=null,$=(he,Re)=>{let et=Io(he,Re);for(;et&&et!==document.documentElement;){let vt=window.getComputedStyle(et).display;if(vt==="flex"||vt==="inline-flex")return et;et=et.parentElement}return null},Z=he=>{let Re=window.getComputedStyle(he).flexDirection;return Re==="column"||Re==="column-reverse"?"vertical":"horizontal"},S=he=>{let Re=he.getAttribute("data-pm");return Re||(Re=Math.random().toString(36).substring(2,8),he.setAttribute("data-pm",Re)),{selector:`[data-pm="${Re}"]`,durableSelector:Rn(he)}},E=()=>{L=!0,I&&clearTimeout(I),I=setTimeout(()=>{L=!1,I=null},300)},J=(he,Re,it)=>{let et=Z(he);if(Re===et){let Je=window.getComputedStyle(he).justifyContent,Rt=Je==="normal"||Je==="flex-start"||Je==="start"?"flex-start":Je==="flex-end"||Je==="end"?"flex-end":Je==="center"?"center":null;if(!Rt)return;let en=m.indexOf(Rt)+it;if(en<0||en>=m.length)return;let no=m[en],{selector:So,durableSelector:bi}=S(he);Ve(he,"justify-content",no),t({type:"MODIFY_STYLES_BATCH",payload:{selector:So,durableSelector:bi,element:kn(he),changes:[{property:"justify-content",original:Je,modified:no}]}})}else{let Je=window.getComputedStyle(he).flexDirection,Rt=et==="horizontal"?"column":"row",{selector:zn,durableSelector:en}=S(he);Ve(he,"flex-direction",Rt),t({type:"MODIFY_STYLES_BATCH",payload:{selector:zn,durableSelector:en,element:kn(he),changes:[{property:"flex-direction",original:Je,modified:Rt}]}})}Tn(vt=>vt+1)},O=(he,Re,it)=>{let vt=Z(he)==="horizontal"?"vertical":"horizontal";if(Re!==vt)return;let Rt=window.getComputedStyle(he).alignItems,zn=Rt==="normal"||Rt==="stretch"||Rt==="flex-start"||Rt==="start"?"flex-start":Rt==="flex-end"||Rt==="end"?"flex-end":Rt==="center"?"center":null;if(!zn)return;let no=b.indexOf(zn)+it;if(no<0||no>=b.length)return;let So=b[no],{selector:bi,durableSelector:kc}=S(he);Ve(he,"align-items",So),t({type:"MODIFY_STYLES_BATCH",payload:{selector:bi,durableSelector:kc,element:kn(he),changes:[{property:"align-items",original:Rt,modified:So}]}}),Tn(Ec=>Ec+1)},F=20,Y=null,U=null,xe=0,Be=(he,Re,it)=>{let et=$(Re,it);Mn(et?{modifier:he,target:et}:null)},Ue=he=>{if(!(e.activeTool!=="hand"||!e.isAnnotating)){if(he.key==="Shift"&&!he.altKey){let Re=Ct.current;Be("shift",Re.x,Re.y)}else if(he.key==="Alt"&&!he.shiftKey){let Re=Ct.current;Be("alt",Re.x,Re.y)}}},Ke=he=>{if(e.activeTool!=="hand"||!e.isAnnotating)return;let Re=he.shiftKey&&!he.altKey,it=he.altKey&&!he.shiftKey;if(!Re&&!it||he.buttons!==0){Y=null,U=null,xe=0,j=null,ce=null,Mn(null);return}if(j===null&&(j=he.clientX,ce=he.clientY,Be(Re?"shift":"alt",he.clientX,he.clientY)),L)return;Y===null&&(Y=he.clientX,U=he.clientY,xe=0);let et=he.clientX-Y,vt=he.clientY-U,Je=Math.abs(et)>=Math.abs(vt)?et:vt;if(Math.abs(Je)>3){let So=Je>0?1:-1;if(xe!==0&&So!==xe){Y=he.clientX,U=he.clientY,xe=0;return}xe=So}if(Math.abs(et)<F&&Math.abs(vt)<F)return;let Rt=$(j,ce);if(!Rt)return;let zn=Math.abs(et)>=Math.abs(vt)?"horizontal":"vertical",no=(zn==="horizontal"?et:vt)>0?1:-1;Y=null,U=null,xe=0,Re?J(Rt,zn,no):O(Rt,zn,no),E()},Ht=he=>{(he.key==="Shift"||he.key==="Alt")&&(j=null,ce=null,Y=null,U=null,xe=0,Mn(null))},Qe=()=>{Mn(null),Y=null,U=null,xe=0};return window.addEventListener("keydown",Ue),window.addEventListener("mousemove",Ke),window.addEventListener("mousedown",Qe),window.addEventListener("keyup",Ht),()=>{window.removeEventListener("keydown",Ue),window.removeEventListener("mousemove",Ke),window.removeEventListener("mousedown",Qe),window.removeEventListener("keyup",Ht),I&&clearTimeout(I)}},[e.activeTool,e.isAnnotating,t]),hn(()=>{let m=b=>{var j,ce,$,Z;if(b.key==="Escape"){if(X.current)return;if(e.activeTool==="model"&&ct.size>0){b.preventDefault(),wt(new Map);return}if(re.current.length>0){b.preventDefault(),v();return}}if(b.key==="Enter"&&e.activeTool==="model"&&ct.size>0&&c){b.preventDefault();let S=[...ct.keys()].filter(E=>!(g!=null&&g.has(E)));S.length>0&&c(S),wt(new Map);return}if((b.metaKey||b.ctrlKey)&&b.key==="v"&&Ne.current.length>0&&!X.current){b.preventDefault(),je.current++;let S=je.current*20,J=((j=Ne.current[0])==null?void 0:j.groupId)?Math.random().toString(36).substring(2,9):void 0,O=Ne.current.map(Y=>y(f({},Y),{id:Math.random().toString(36).substring(2,9),groupId:Y.groupId?J:void 0,timestamp:Date.now(),points:Y.points.map(U=>({x:U.x+S,y:U.y+S}))}));t({type:"PASTE_ANNOTATIONS",payload:{annotations:O}});let F=O.find(Y=>Y.type!=="text")||O[0];F&&Le(F.id);return}let q=re.current;if(q.length===0||X.current)return;let I=($=(ce=b.composedPath)==null?void 0:ce.call(b)[0])!=null?$:b.target,L=I==null?void 0:I.tagName;if(!(L==="INPUT"||L==="TEXTAREA"||I!=null&&I.isContentEditable)&&(b.key==="Delete"||b.key==="Backspace")){if(b.preventDefault(),d){let S=D.current.annotations;for(let E of q){let J=S.find(F=>F.id===E);if(!J)continue;let O=J.threadId||J.groupId&&((Z=S.find(F=>F.groupId===J.groupId&&F.threadId))==null?void 0:Z.threadId);O&&d(O)}}for(let S of q)t({type:"DELETE_ANNOTATION",payload:{id:S}});v()}};return window.addEventListener("keydown",m),()=>window.removeEventListener("keydown",m)},[t,v,Le,e.activeTool,ct,g,c,d]);let ut=jo(),ht=ri(()=>e.annotations.filter(m=>!m.pathname||m.pathname===ut),[e.annotations,ut]),gn=ri(()=>Kr(e.annotations),[e.annotations]),mn=ri(()=>{let m=new Map,b=new Set,q=1,I=[...e.annotations].sort((L,j)=>L.timestamp-j.timestamp);for(let L of I)if(!gn.has(L))if(L.groupId){if(!b.has(L.groupId)){b.add(L.groupId);let j=e.annotations.filter(ce=>ce.groupId===L.groupId);for(let ce of j)m.set(ce.id,q);q++}}else m.set(L.id,q),q++;return m},[e.annotations,gn]),sn=ri(()=>{if(Te.length===0)return null;let m=new Map;for(let b of Te){let q=e.annotations.find(L=>L.id===b);if(!q)continue;let I=q.groupId?e.annotations.filter(L=>L.groupId===q.groupId):[q];for(let L of I)if(L.linkedSelector&&!(i!=null&&i.has(L.linkedSelector))){let j=L.color||e.activeColor;m.set(L.linkedSelector,j)}}return m.size>0?m:null},[Te,e.annotations,e.activeColor,i]);hn(()=>{let m=ht.filter(b=>!(gn.has(b)||k&&!k.isNew&&b.id===k.id));x(m,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,Te,Ea,le.x,le.y,mn,R)},[ht,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,x,k,Te,le,mn,gn,R]),hn(()=>{if(pe){let m=Math.random().toString(36).substring(2,9);A({id:m,point:pe.point,text:"",fontSize:12,isNew:!0,groupId:pe.groupId}),be(null)}},[pe]),hn(()=>{me&&(A({id:Math.random().toString(36).substring(2,9),point:me.point,text:"",fontSize:12,isNew:!0,linkedSelector:me.linkedSelector,linkedAnchor:me.linkedAnchor,elements:me.elements}),We(null))},[me]);let bt=jt(null),ln=($s=k==null?void 0:k.id)!=null?$s:null;hn(()=>{ln&&Ce.current?requestAnimationFrame(()=>{var q;let m=Ce.current;if(!m||(m.focus(),oe.current===ln))return;oe.current=ln;let b=X.current;if(b){if(bt.current!==null){let I=Math.min(bt.current,m.value.length);m.setSelectionRange(I,I);return}if(!b.isNew&&b.clickPoint){let I=T.current;if(!I)return;let L=I.getContext("2d");if(!L)return;L.font=`${b.fontSize}px ${Ut}`;let j=b.fontSize*1.4,ce=b.text.split(`
4
- `),$=b.clickPoint.y-b.point.y,Z=Math.max(0,Math.min(ce.length-1,Math.floor($/j))),S=b.clickPoint.x-b.point.x,E=ce[Z]||"",J=0;for(let F=0;F<=E.length;F++){let Y=L.measureText(E.substring(0,F)).width;if(Y>S){let U=F>0?L.measureText(E.substring(0,F-1)).width:0;J=S-U<Y-S?F-1:F;break}J=F}let O=J;for(let F=0;F<Z;F++)O+=(((q=ce[F])==null?void 0:q.length)||0)+1;m.setSelectionRange(O,O)}}}):(oe.current=null,bt.current=null)},[ln,T]);let He=Zt(m=>{let b=T.current;if(!b)return{x:0,y:0};let q=b.getBoundingClientRect(),I,L;if("touches"in m&&m.touches[0])I=m.touches[0].clientX,L=m.touches[0].clientY;else if("clientX"in m)I=m.clientX,L=m.clientY;else return{x:0,y:0};return{x:I-q.left+window.scrollX,y:L-q.top+window.scrollY}},[T]),xt=Zt((m,b,q,I)=>{let L=q.x-b.x,j=q.y-b.y,ce=L*L+j*j;if(ce===0)return Math.sqrt((m.x-b.x)**2+(m.y-b.y)**2)<=I;let $=Math.max(0,Math.min(1,((m.x-b.x)*L+(m.y-b.y)*j)/ce)),Z=b.x+$*L,S=b.y+$*j;return Math.sqrt((m.x-Z)**2+(m.y-S)**2)<=I},[]),Wt=Zt(m=>{for(let q=ht.length-1;q>=0;q--){let I=ht[q];if(!I||gn.has(I))continue;let L=(I.strokeWidth||3)+4;switch(I.type){case"text":{if(!I.points[0]||!I.text)continue;let j=I.points[0],ce=I.fontSize||12,$=T.current;if($){let Z=$.getContext("2d");if(Z){Z.font=`${ce}px ${Ut}`;let S=I.text.replace(/\n/g," "),E=j.x-le.x,J=Yo(E),O=Go(Z,S,J),F=Z.measureText(O).width,Y=ce*1.4;if(m.x>=j.x-4-4&&m.x<=j.x+F+4+4&&m.y>=j.y-4-4&&m.y<=j.y+Y+4+4)return I}}break}case"rectangle":{if(I.points.length<2)continue;let j=I.points[0],ce=I.points[I.points.length-1],$=Math.min(j.x,ce.x),Z=Math.max(j.x,ce.x),S=Math.min(j.y,ce.y),E=Math.max(j.y,ce.y),J=xt(m,{x:$,y:S},{x:Z,y:S},L),O=xt(m,{x:$,y:E},{x:Z,y:E},L),F=xt(m,{x:$,y:S},{x:$,y:E},L),Y=xt(m,{x:Z,y:S},{x:Z,y:E},L);if(J||O||F||Y)return I;break}case"circle":{if(I.points.length<2)continue;let j=I.points[0],ce=I.points[I.points.length-1],$=(j.x+ce.x)/2,Z=(j.y+ce.y)/2,S=Math.abs(ce.x-j.x)/2,E=Math.abs(ce.y-j.y)/2,J=m.x-$,O=m.y-Z,F=Math.sqrt((J/S)**2+(O/E)**2);if(Math.abs(F-1)*Math.max(S,E)<=L)return I;break}case"line":{if(I.points.length<2)continue;let j=I.points[0],ce=I.points[I.points.length-1];if(xt(m,j,ce,L))return I;break}case"freehand":{if(I.points.length<2)continue;for(let j=0;j<I.points.length-1;j++){let ce=I.points[j],$=I.points[j+1];if(xt(m,ce,$,L))return I}break}}}return null},[ht,T,xt,gn,le.x]),xn=Zt(m=>{let b=Wt(m);return(b==null?void 0:b.type)==="text"?b:null},[Wt]),ao=Zt(m=>{if(Te.length===0)return null;let b=Ea/2+4;for(let q of Te){let I=e.annotations.find(L=>L.id===q);if(!(!I||I.points.length<2)){if(I.type==="line"){let L=I.points[0],j=I.points[I.points.length-1];if(Math.sqrt((m.x-L.x)**2+(m.y-L.y)**2)<=b)return{handle:"start",annotationId:q};if(Math.sqrt((m.x-j.x)**2+(m.y-j.y)**2)<=b)return{handle:"end",annotationId:q};continue}if(I.type==="circle"){let L=I.points[0],j=I.points[I.points.length-1],ce=Math.min(L.x,j.x),$=Math.max(L.x,j.x),Z=Math.min(L.y,j.y),S=Math.max(L.y,j.y),E=(ce+$)/2,J=(Z+S)/2,O=[{handle:"top",x:E,y:Z},{handle:"bottom",x:E,y:S},{handle:"left",x:ce,y:J},{handle:"right",x:$,y:J}];for(let{handle:F,x:Y,y:U}of O)if(Math.sqrt((m.x-Y)**2+(m.y-U)**2)<=b)return{handle:F,annotationId:q};continue}if(I.type==="rectangle"||I.type==="freehand"){let L=I.points[0],j=I.points[I.points.length-1],ce,$,Z,S;I.type==="freehand"?(ce=Math.min(...I.points.map(J=>J.x)),$=Math.max(...I.points.map(J=>J.x)),Z=Math.min(...I.points.map(J=>J.y)),S=Math.max(...I.points.map(J=>J.y))):(ce=Math.min(L.x,j.x),$=Math.max(L.x,j.x),Z=Math.min(L.y,j.y),S=Math.max(L.y,j.y));let E=[{corner:"topLeft",x:ce,y:Z},{corner:"topRight",x:$,y:Z},{corner:"bottomLeft",x:ce,y:S},{corner:"bottomRight",x:$,y:S}];for(let{corner:J,x:O,y:F}of E)if(Math.sqrt((m.x-O)**2+(m.y-F)**2)<=b)return{handle:J,annotationId:q}}}}return null},[Te,e.annotations]);hn(()=>{let m=b=>{if(_e.current={x:b.clientX+window.scrollX,y:b.clientY+window.scrollY},!k){let q=xn(_e.current);ie((q==null?void 0:q.id)||null)}};return window.addEventListener("mousemove",m),()=>window.removeEventListener("mousemove",m)},[k,xn]);let _n=Zt(()=>{var b;if(!k)return;let m=((b=k.images)==null?void 0:b.length)||0;if(k.text.trim()||m>0)if(k.isNew){let q=Hr();t({type:"ADD_TEXT",payload:f({point:k.point,text:k.text||(m>0?`[${m} image${m>1?"s":""}]`:""),fontSize:k.fontSize,id:q,groupId:k.groupId,linkedSelector:k.linkedSelector,linkedAnchor:k.linkedAnchor,elements:k.elements},m>0?{imageCount:m}:{})}),m>0&&k.images&&s&&s(q,k.images)}else t({type:"UPDATE_TEXT",payload:f({id:k.id,text:k.text||(m>0?`[${m} image${m>1?"s":""}]`:"")},m>0?{imageCount:m}:{})}),m>0&&k.images&&s&&s(k.id,k.images);else k.isNew||t({type:"DELETE_ANNOTATION",payload:{id:k.id}});A(null)},[k,t,s]),Xt=Zt(m=>{for(let b=0;b<ms.length-1;b++){let q=ms[b],I=ms[b+1];if(m<=(q+I)/2)return q;if(m<I)return I}return Math.round(m/8)*8},[]),hi=Zt((m,b,q,I)=>{let L=q.top+Math.max(I.top,4),j=q.bottom-Math.max(I.bottom,4),ce=q.left+Math.max(I.left,4),$=q.right-Math.max(I.right,4);if(m<q.left||m>q.right||b<q.top||b>q.bottom)return null;let Z=b<L,S=b>j,E=m<ce,J=m>$;return Z&&E?I.top>=I.left?"top":"left":Z&&J?I.top>=I.right?"top":"right":S&&E?I.bottom>=I.left?"bottom":"left":S&&J?I.bottom>=I.right?"bottom":"right":Z?"top":S?"bottom":E?"left":J?"right":null},[]),Rr=Zt(m=>{var j,ce;if(!e.isAnnotating)return;if(e.inspectedElement&&e.activeTool==="hand"&&!("button"in m&&m.button===2)){m.preventDefault(),m.stopPropagation(),t({type:"SELECT_ELEMENT",payload:null});return}let b=He(m),q="shiftKey"in m&&m.shiftKey;if(e.activeTool==="inspector"){if("button"in m&&m.button===2)return;if(nt&&!to(nt)){let $=e.annotations.find(Ue=>{if(!Ue.linkedSelector||!Ue.threadId)return!1;try{return nt.matches(Ue.linkedSelector)}catch(Ke){return!1}});if($!=null&&$.threadId&&a){a($.threadId),requestAnimationFrame(()=>{var Ht;let Ue=document.querySelector("[data-popmelt-shadow-host]"),Ke=(Ht=Ue==null?void 0:Ue.shadowRoot)==null?void 0:Ht.querySelector("[data-popmelt-reply]");Ke==null||Ke.focus()});return}let Z=kn(nt),S=Rn(nt),E=nt.getBoundingClientRect(),J=nt.getAttribute("data-pm");J||(J=Math.random().toString(36).substring(2,8),nt.setAttribute("data-pm",J));let O=`[data-pm="${J}"]`,F=e.styleModifications.some(Ue=>{try{return nt.matches(Ue.selector)}catch(Ke){return!1}}),Y=e.annotations.filter(Ue=>{if(!Ue.linkedSelector)return!1;try{return nt.matches(Ue.linkedSelector)}catch(Ke){return!1}}).length,U=(F?1:0)+Y,xe=E.top>=Fn*(1+U)?"top-left":"bottom-left",Be=Ta(E,xe,U,M==null?void 0:M.current);We({point:Be,linkedSelector:O,linkedAnchor:xe,elements:[y(f({},Z),{selector:S})]})}return}if(e.activeTool==="model"){if("button"in m&&m.button===2)return;if(Fe){let $=Fe.name;if(g!=null&&g.has($)){u==null||u($);return}"shiftKey"in m&&m.shiftKey?wt(S=>{let E=new Map(S);return E.has($)?E.delete($):E.set($,Fe),E}):ct.size===1&&ct.has($)?(c&&c([$]),wt(new Map)):wt(new Map([[$,Fe]]))}return}if(e.activeTool==="hand"&&$t&&Ot){let $=$t,Z=$.getAttribute("data-pm");Z||(Z=Math.random().toString(36).substring(2,8),$.setAttribute("data-pm",Z));let S=Rn($),E=`[data-pm="${Z}"]`,J=kn($),O=br($),F=b.x-window.scrollX,Y=b.y-window.scrollY,U=De,xe=window.getComputedStyle($).justifyContent,Be=0;if(U){let Ke=Lo($).find(Ht=>Ht.axis===Ot);Be=Ke?Ot==="column"?Ke.w:Ke.h:0}Ve($,"transition","none"),Jt.current={isDragging:!0,hasMoved:!1,axis:Ot,startX:F,startY:Y,originalRow:U?Be:O.row,originalColumn:U?Be:O.column,element:$,elementInfo:y(f({},J),{selector:E}),selector:E,durableSelector:S,isAuto:U,originalJustifyContent:xe,visualGap:Be},ne({axis:Ot,row:U?Be:O.row,column:U?Be:O.column});return}if(e.activeTool==="hand"&&_t&&wn){let $=_t,Z=$.getAttribute("data-pm");Z||(Z=Math.random().toString(36).substring(2,8),$.setAttribute("data-pm",Z));let S=`[data-pm="${Z}"]`,E=kn($),{fontSize:J,lineHeight:O}=xr($),F=J>0?O/J:1.2,Y=b.x-window.scrollX,U=b.y-window.scrollY;Ve($,"transition","none");let xe=Rn($);rn.current={isDragging:!0,property:wn,startX:Y,startY:U,originalFontSize:J,originalLineHeight:O,originalRatio:F,element:$,elementInfo:y(f({},E),{selector:S}),selector:S,durableSelector:xe},eo({property:wn,fontSize:J,lineHeight:O});return}if(e.activeTool==="hand"&&Bt&&fn){let $=Bt,Z=$.getAttribute("data-pm");Z||(Z=Math.random().toString(36).substring(2,8),$.setAttribute("data-pm",Z));let S=`[data-pm="${Z}"]`,E=Rn($),J=kn($),O=Ro($),F=$.getBoundingClientRect(),Y=Math.floor(F.height/2),U=b.y-window.scrollY;Ve($,"transition","none"),Sn.current={isDragging:!0,corner:fn,startY:U,original:O,maxRadius:Y,element:$,elementInfo:y(f({},J),{selector:S}),selector:S,durableSelector:E},yt({corner:fn,radius:f({},O)});return}if(e.activeTool==="hand"&&ye&&de){let $=ye,Z=$.getAttribute("data-pm");Z||(Z=Math.random().toString(36).substring(2,8),$.setAttribute("data-pm",Z));let S=`[data-pm="${Z}"]`,E=Rn($),J=kn($),O=Xo($),F=b.x-window.scrollX,Y=b.y-window.scrollY;Ve($,"transition","none"),ke.current={isDragging:!0,side:de,startX:F,startY:Y,original:O,element:$,elementInfo:y(f({},J),{selector:S}),selector:S,durableSelector:E},Pt({side:de,padding:f({},O)});return}let I=ao(b);if(I){let $=e.annotations.find(Z=>Z.id===I.annotationId);if($&&$.type!=="text"&&((j=$.status)!=null?j:"pending")==="pending"){ee({annotationId:I.annotationId,handle:I.handle,startPoint:b,originalPoints:[...$.points],hasMoved:!1});return}}let L=Wt(b);if(L&&L.points[0]){if(k&&_n(),L.type!=="text"?(Le(L.id,q),L.color&&t({type:"SET_COLOR",payload:L.color})):q||v(),a){let $=L.threadId||(L.groupId?(ce=e.annotations.find(Z=>Z.groupId===L.groupId&&Z.threadId))==null?void 0:ce.threadId:void 0);$&&a($)}Ee({annotation:L,startPoint:b,hasMoved:!1});return}if(q||v(),e.activeTool==="text"){k&&_n();let $=Math.random().toString(36).substring(2,9);A({id:$,point:b,text:"",fontSize:12,isNew:!0});return}V(!0),t({type:"START_PATH",payload:b})},[e.isAnnotating,e.activeTool,e.inspectedElement,e.annotations,k,Te,nt,ye,de,Bt,fn,$t,Ot,De,_t,wn,Fe,ct,g,c,u,a,He,Wt,ao,t,Le,v,_n]),pr=Zt(m=>{var q,I;let b=He(m);if(e.activeTool==="inspector"&&e.isAnnotating){let L=b.x-window.scrollX,j=b.y-window.scrollY,ce=Io(L,j),$=ce&&to(ce)?null:ce;$!==nt&&(Lt($),Oe($?kn($):null));return}if(e.activeTool==="model"&&e.isAnnotating){let L=b.x-window.scrollX,j=b.y-window.scrollY,ce=Io(L,j);if(ce!==Tt.current&&(Tt.current=ce,Pe.current=0),ce){let $=zr(ce,Pe.current);Ie($)}else Ie(null);return}if(e.activeTool==="hand"&&e.isAnnotating){let L=b.x-window.scrollX,j=b.y-window.scrollY;Ct.current={x:L,y:j},Gt({x:L,y:j});let ce=xo.current.cmd,$=xo.current.shift;if(Jt.current.isDragging){let S=Jt.current,E=S.element;if(!E)return;if(!S.hasMoved){let Y=Math.abs(L-S.startX),U=Math.abs(j-S.startY);if(Y<=2&&U<=2)return;S.hasMoved=!0,S.isAuto&&(Ve(E,"justify-content","normal"),Ve(E,"row-gap",`${S.visualGap}px`),Ve(E,"column-gap",`${S.visualGap}px`),ot(!1))}let J=S.axis,O=S.originalRow,F=S.originalColumn;if(J==="column"){let Y=L-S.startX;F=S.originalColumn+Y,ce||(O=S.originalRow+Y)}else{let Y=j-S.startY;O=S.originalRow+Y,ce||(F=S.originalColumn+Y)}O=Math.max(0,O),F=Math.max(0,F),$&&(O=Xt(O),F=Xt(F)),O=Math.round(O),F=Math.round(F),Ve(E,"row-gap",`${O}px`),Ve(E,"column-gap",`${F}px`),ne({axis:J,row:O,column:F});return}if(Sn.current.isDragging){let S=Sn.current,E=S.element;if(!E)return;let J=j-S.startY,O=S.corner,F=S.original,Y=f({},F);if(ce){let U=F[O]+J;U=Math.max(0,Math.min(S.maxRadius,U)),$&&(U=Xt(U)),U=Math.round(U),Y[O]=U}else{let U=F[O]+J;U=Math.max(0,Math.min(S.maxRadius,U)),$&&(U=Xt(U)),U=Math.round(U),Y={"top-left":U,"top-right":U,"bottom-right":U,"bottom-left":U}}Ve(E,"border-top-left-radius",`${Y["top-left"]}px`),Ve(E,"border-top-right-radius",`${Y["top-right"]}px`),Ve(E,"border-bottom-right-radius",`${Y["bottom-right"]}px`),Ve(E,"border-bottom-left-radius",`${Y["bottom-left"]}px`),yt({corner:O,radius:Y});return}if(rn.current.isDragging){let S=rn.current,E=S.element;if(!E)return;let J=S.property,O=S.originalFontSize,F=S.originalLineHeight,Y=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(J==="font-size"){let xe=L-S.startX;O=S.originalFontSize+xe,O=Math.max(1,O)}else{let xe=j-S.startY;F=S.originalLineHeight+xe,F=Math.max(O,F)}if($)if(J==="font-size"){let xe=Y[0],Be=Math.abs(O-xe);for(let Ue of Y){let Ke=Math.abs(O-Ue);Ke<Be&&(xe=Ue,Be=Ke)}O=xe}else{let xe=O>0?F/O:1.2,Be=Math.round(xe*2)/2;F=O*Math.max(1,Be)}O=Math.round(O),F=Math.round(F*10)/10,Ve(E,"font-size",`${O}px`);let U=O>0?Math.round(F/O*1e3)/1e3:1.2;Ve(E,"line-height",`${U}`),eo({property:J,fontSize:O,lineHeight:F});return}if(ke.current.isDragging){let S=ke.current,E=S.element;if(!E)return;let J=S.side,O=S.original,F=O.top,Y=O.right,U=O.bottom,xe=O.left;if(J==="top"){let Be=S.startY-j;F=O.top+Be,ce||(U=O.bottom+Be)}else if(J==="bottom"){let Be=j-S.startY;U=O.bottom+Be,ce||(F=O.top+Be)}else if(J==="left"){let Be=S.startX-L;xe=O.left+Be,ce||(Y=O.right+Be)}else if(J==="right"){let Be=L-S.startX;Y=O.right+Be,ce||(xe=O.left+Be)}F=Math.max(0,F),Y=Math.max(0,Y),U=Math.max(0,U),xe=Math.max(0,xe),$&&(F=Xt(F),Y=Xt(Y),U=Xt(U),xe=Xt(xe)),F=Math.round(F),Y=Math.round(Y),U=Math.round(U),xe=Math.round(xe),Ve(E,"padding",`${F}px ${Y}px ${U}px ${xe}px`),Pt({side:J,padding:{top:F,right:Y,bottom:U,left:xe}});return}let Z=Io(L,j);for(;Z&&Z.tagName==="A";)Z=Z.parentElement;{let E=[];Z&&E.push(Z),Bt&&Bt!==Z&&E.push(Bt);let J=null,O=16,F=null;for(let Y of E){let U=Y.getBoundingClientRect(),xe=Ro(Y),Be=[["top-left",U.left,U.top+xe["top-left"]],["top-right",U.right,U.top+xe["top-right"]],["bottom-right",U.right,U.bottom-xe["bottom-right"]],["bottom-left",U.left,U.bottom-xe["bottom-left"]]];for(let[Ue,Ke,Ht]of Be){let Qe=Math.hypot(L-Ke,j-Ht);Qe<O&&(O=Qe,J=Ue,F=Y)}}if(J&&F){ur(F),Nt(J),ye&&ae(null),de&&ue(null),$t&&on(null),Ot&&bn(null),ot(!1),_t&&Qn(null),wn&&bo(null);return}}Bt&&ur(null),fn&&Nt(null);{let S=[];Z&&Yr(Z)&&S.push(Z);let E=(q=Z==null?void 0:Z.parentElement)!=null?q:null;for(;E&&E!==document.body&&S.length<3;)Yr(E)&&S.push(E),E=E.parentElement;for(let J of S){let F=Lo(J).find(Y=>L>=Y.x&&L<=Y.x+Y.w&&j>=Y.y&&j<=Y.y+Y.h);if(F){on(J),bn(F.axis),ot(Fi(J,F.axis)),ye&&ae(null),de&&ue(null),_t&&Qn(null),wn&&bo(null);return}}}$t&&on(null),Ot&&bn(null),ot(!1);{let E=[];Z&&E.push(Z),_t&&_t!==Z&&E.push(_t);let J=null,O=1/0,F=null;for(let Y of E){if(!$i(Y))continue;let U=Ko(Y);if(!U)continue;let xe=L>=U.left&&L<=U.right&&j>=U.top&&j<=U.bottom,Be=[["font-size",U.right,U.top+U.height/2],["line-height",U.left+U.width/2,U.bottom]];for(let[Ue,Ke,Ht]of Be){let Qe=Math.hypot(L-Ke,j-Ht);(xe||Qe<12)&&Qe<O&&(O=Qe,J=Ue,F=Y)}}J&&F?(Qn(F),bo(J)):(_t&&Qn(null),wn&&bo(null))}if(Z!==ye&&ae(Z),Z){let S=Xo(Z),E=Z.getBoundingClientRect(),J=hi(L,j,E,S);ue(J)}else ue(null);return}if(B){let{handle:L,originalPoints:j,hasMoved:ce}=B,$=e.annotations.find(O=>O.id===B.annotationId);if(!$)return;let Z="metaKey"in m,S=Z&&(m.metaKey||m.ctrlKey),E=Z&&m.shiftKey,J;if($.type==="line"){let O=j[0],F=j[j.length-1];L==="start"?J=[b,F]:J=[O,b]}else if($.type==="freehand"){let O=Math.min(...j.map(Je=>Je.x)),F=Math.max(...j.map(Je=>Je.x)),Y=Math.min(...j.map(Je=>Je.y)),U=Math.max(...j.map(Je=>Je.y)),xe=(O+F)/2,Be=(Y+U)/2,Ue=F-O||1,Ke=U-Y||1,Ht=Ue/Ke,Qe=O,he=F,Re=Y,it=U;switch(L){case"topLeft":Qe=b.x,Re=b.y;break;case"topRight":he=b.x,Re=b.y;break;case"bottomLeft":Qe=b.x,it=b.y;break;case"bottomRight":he=b.x,it=b.y;break}if(S)switch(L){case"topLeft":he=F+(O-Qe),it=U+(Y-Re);break;case"topRight":Qe=O-(he-F),it=U+(Y-Re);break;case"bottomLeft":he=F+(O-Qe),Re=Y-(it-U);break;case"bottomRight":Qe=O-(he-F),Re=Y-(it-U);break}if(E){let Je=he-Qe,Rt=it-Re;if(Math.abs(Je/Rt)>Ht){let en=Math.abs(Rt)*Ht*Math.sign(Je);L==="topLeft"||L==="bottomLeft"?Qe=he-en:he=Qe+en}else{let en=Math.abs(Je)/Ht*Math.sign(Rt);L==="topLeft"||L==="topRight"?Re=it-en:it=Re+en}}let et=he-Qe||1,vt=it-Re||1;J=j.map(Je=>({x:Qe+(Je.x-O)/Ue*et,y:Re+(Je.y-Y)/Ke*vt}))}else if($.type==="circle"){let O=j[0],F=j[j.length-1],Y=Math.min(O.x,F.x),U=Math.max(O.x,F.x),xe=Math.min(O.y,F.y),Be=Math.max(O.y,F.y),Ue=(Y+U)/2,Ke=(xe+Be)/2,Ht=U-Y,Qe=Be-xe,he=Y,Re=U,it=xe,et=Be;switch(L){case"top":if(it=b.y,S&&(et=Ke+(Ke-b.y)),E){let Je=(et-it)*(Ht/Qe)/2;he=Ue-Je,Re=Ue+Je}break;case"bottom":if(et=b.y,S&&(it=Ke-(b.y-Ke)),E){let Je=(et-it)*(Ht/Qe)/2;he=Ue-Je,Re=Ue+Je}break;case"left":if(he=b.x,S&&(Re=Ue+(Ue-b.x)),E){let Je=(Re-he)*(Qe/Ht)/2;it=Ke-Je,et=Ke+Je}break;case"right":if(Re=b.x,S&&(he=Ue-(b.x-Ue)),E){let Je=(Re-he)*(Qe/Ht)/2;it=Ke-Je,et=Ke+Je}break}J=[{x:he,y:it},{x:Re,y:et}]}else{let O=j[0],F=j[j.length-1],Y=Math.min(O.x,F.x),U=Math.max(O.x,F.x),xe=Math.min(O.y,F.y),Be=Math.max(O.y,F.y),Ue=(Y+U)/2,Ke=(xe+Be)/2,Ht=U-Y||1,Qe=Be-xe||1,he=Ht/Qe,Re=Y,it=U,et=xe,vt=Be;switch(L){case"topLeft":Re=b.x,et=b.y;break;case"topRight":it=b.x,et=b.y;break;case"bottomLeft":Re=b.x,vt=b.y;break;case"bottomRight":it=b.x,vt=b.y;break}if(S)switch(L){case"topLeft":it=U+(Y-Re),vt=Be+(xe-et);break;case"topRight":Re=Y-(it-U),vt=Be+(xe-et);break;case"bottomLeft":it=U+(Y-Re),et=xe-(vt-Be);break;case"bottomRight":Re=Y-(it-U),et=xe-(vt-Be);break}if(E){let Je=it-Re,Rt=vt-et;if(Math.abs(Je/Rt)>he){let en=Math.abs(Rt)*he*Math.sign(Je);L==="topLeft"||L==="bottomLeft"?Re=it-en:it=Re+en}else{let en=Math.abs(Je)/he*Math.sign(Rt);L==="topLeft"||L==="topRight"?et=vt-en:vt=et+en}}J=[{x:Re,y:et},{x:it,y:vt}]}t({type:"RESIZE_ANNOTATION",payload:{id:B.annotationId,points:J,saveUndo:!ce}}),ce||ee(y(f({},B),{hasMoved:!0}));return}if(K&&((I=K.annotation.status)!=null?I:"pending")==="pending"){let L=b.x-K.startPoint.x,j=b.y-K.startPoint.y;if((Math.abs(L)>2||Math.abs(j)>2)&&!K.hasMoved)Ee(y(f({},K),{hasMoved:!0,startPoint:b})),t({type:"MOVE_ANNOTATION",payload:{id:K.annotation.id,delta:{x:L,y:j},saveUndo:!0}});else if(K.hasMoved){let $=b.x-K.startPoint.x,Z=b.y-K.startPoint.y;Ee(y(f({},K),{startPoint:b})),t({type:"MOVE_ANNOTATION",payload:{id:K.annotation.id,delta:{x:$,y:Z}}})}return}!H||!e.isAnnotating||t({type:"CONTINUE_PATH",payload:b})},[H,e.isAnnotating,e.activeTool,K,B,nt,ye,de,Bt,fn,$t,Ot,_t,wn,He,t,Xt,hi]),yi=Zt(m=>{var I,L,j,ce,$,Z;if(rn.current.isDragging){let S=rn.current,E=S.element;if(E&&S.selector&&S.elementInfo&&lt){E instanceof HTMLElement&&(E.style.removeProperty("font-size"),E.style.removeProperty("line-height"),E.style.removeProperty("transition"));let J=[];if(S.originalFontSize!==lt.fontSize&&(Ve(E,"font-size",`${lt.fontSize}px`),J.push({property:"font-size",original:`${S.originalFontSize}px`,modified:`${lt.fontSize}px`})),S.originalLineHeight!==lt.lineHeight){let O=S.originalFontSize>0?Math.round(S.originalLineHeight/S.originalFontSize*1e3)/1e3:1.2,F=lt.fontSize>0?Math.round(lt.lineHeight/lt.fontSize*1e3)/1e3:1.2;Ve(E,"line-height",`${F}`),J.push({property:"line-height",original:`${O}`,modified:`${F}`})}J.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(I=S.durableSelector)!=null?I:void 0,element:S.elementInfo,changes:J}})}rn.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},eo(null);return}if(Jt.current.isDragging){let S=Jt.current,E=S.element,J="button"in m&&m.button===2;if(!S.hasMoved&&!J&&E&&S.selector&&S.elementInfo){E instanceof HTMLElement&&E.style.removeProperty("transition");let O=["space-between","space-around","stretch","normal"],F=S.originalJustifyContent||"normal",Y=O.indexOf(F),U=O[(Y+1)%O.length],xe=[];U==="normal"?(Ve(E,"justify-content","normal"),xe.push({property:"justify-content",original:S.originalJustifyContent,modified:"normal"})):U==="stretch"?(Ve(E,"justify-content",U),Ve(E,"row-gap","8px"),Ve(E,"column-gap","8px"),xe.push({property:"justify-content",original:S.originalJustifyContent||"normal",modified:U}),S.originalRow!==8&&xe.push({property:"row-gap",original:`${S.originalRow}px`,modified:"8px"}),S.originalColumn!==8&&xe.push({property:"column-gap",original:`${S.originalColumn}px`,modified:"8px"})):(E instanceof HTMLElement&&(E.style.removeProperty("row-gap"),E.style.removeProperty("column-gap")),Ve(E,"justify-content",U),xe.push({property:"justify-content",original:S.originalJustifyContent||"normal",modified:U}),S.originalRow>0&&xe.push({property:"row-gap",original:`${S.originalRow}px`,modified:"0px"}),S.originalColumn>0&&xe.push({property:"column-gap",original:`${S.originalColumn}px`,modified:"0px"})),xe.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(L=S.durableSelector)!=null?L:void 0,element:S.elementInfo,changes:xe}})}else if(S.hasMoved&&E&&S.selector&&S.elementInfo&&St){E instanceof HTMLElement&&(E.style.removeProperty("row-gap"),E.style.removeProperty("column-gap"),E.style.removeProperty("transition"));let O=[];S.isAuto?(E instanceof HTMLElement&&E.style.removeProperty("justify-content"),Ve(E,"justify-content","normal"),Ve(E,"row-gap",`${St.row}px`),Ve(E,"column-gap",`${St.column}px`),O.push({property:"justify-content",original:S.originalJustifyContent,modified:"normal"}),O.push({property:"row-gap",original:"0px",modified:`${St.row}px`}),O.push({property:"column-gap",original:"0px",modified:`${St.column}px`})):(S.originalRow!==St.row&&(Ve(E,"row-gap",`${St.row}px`),O.push({property:"row-gap",original:`${S.originalRow}px`,modified:`${St.row}px`})),S.originalColumn!==St.column&&(Ve(E,"column-gap",`${St.column}px`),O.push({property:"column-gap",original:`${S.originalColumn}px`,modified:`${St.column}px`}))),O.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(j=S.durableSelector)!=null?j:void 0,element:S.elementInfo,changes:O}})}Jt.current={isDragging:!1,hasMoved:!1,axis:null,startX:0,startY:0,originalRow:0,originalColumn:0,element:null,elementInfo:null,selector:null,durableSelector:null,isAuto:!1,originalJustifyContent:"",visualGap:0},ne(null);return}if(Sn.current.isDragging){let S=Sn.current,E=S.element;if(E&&S.selector&&S.elementInfo&&Dt){E instanceof HTMLElement&&(E.style.removeProperty("border-top-left-radius"),E.style.removeProperty("border-top-right-radius"),E.style.removeProperty("border-bottom-right-radius"),E.style.removeProperty("border-bottom-left-radius"),E.style.removeProperty("transition"));let J=["top-left","top-right","bottom-right","bottom-left"],O={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},F=[];for(let Y of J)S.original[Y]!==Dt.radius[Y]&&(Ve(E,O[Y],`${Dt.radius[Y]}px`),F.push({property:O[Y],original:`${S.original[Y]}px`,modified:`${Dt.radius[Y]}px`}));F.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(ce=S.durableSelector)!=null?ce:void 0,element:S.elementInfo,changes:F}})}Sn.current={isDragging:!1,corner:null,startY:0,original:{"top-left":0,"top-right":0,"bottom-right":0,"bottom-left":0},maxRadius:0,element:null,elementInfo:null,selector:null,durableSelector:null},yt(null);return}if(ke.current.isDragging){let S=ke.current,E=S.element,J=S.selector,O=S.elementInfo;if(E&&J&&O&&st){let F=S.original,Y=st.padding;E instanceof HTMLElement&&(E.style.removeProperty("padding"),E.style.removeProperty("transition"));let U=[],xe=[{prop:"padding-top",origVal:F.top,newVal:Y.top},{prop:"padding-right",origVal:F.right,newVal:Y.right},{prop:"padding-bottom",origVal:F.bottom,newVal:Y.bottom},{prop:"padding-left",origVal:F.left,newVal:Y.left}];for(let{prop:Be,origVal:Ue,newVal:Ke}of xe)Ue!==Ke&&(Ve(E,Be,`${Ke}px`),U.push({property:Be,original:`${Ue}px`,modified:`${Ke}px`}));U.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:J,durableSelector:($=S.durableSelector)!=null?$:void 0,element:O,changes:U}})}ke.current={isDragging:!1,side:null,startX:0,startY:0,original:{top:0,right:0,bottom:0,left:0},element:null,elementInfo:null,selector:null,durableSelector:null},Pt(null);return}if(B){ee(null);return}if(K){if(!K.hasMoved&&K.annotation.type==="text"&&((Z=K.annotation.status)!=null?Z:"pending")==="pending"){let S=He(m);A({id:K.annotation.id,point:K.annotation.points[0],text:K.annotation.text||"",fontSize:K.annotation.fontSize||12,isNew:!1,clickPoint:S,groupId:K.annotation.groupId})}Ee(null);return}if(!H)return;let b=5;if(e.currentPath.length>=2){let S=e.currentPath[0],E=e.currentPath[e.currentPath.length-1],J=Math.abs(E.x-S.x),O=Math.abs(E.y-S.y);if((e.activeTool==="line"?Math.sqrt(J*J+O*O)<b:J<b&&O<b)&&["rectangle","circle","line"].includes(e.activeTool)){V(!1),t({type:"CANCEL_PATH"});return}}let q=Oi(e.currentPath);if(e.activeTool==="rectangle"&&e.currentPath.length>=2){let S=e.currentPath[0],E=e.currentPath[e.currentPath.length-1],J=Math.min(S.x,E.x),O=Math.max(S.y,E.y),F=e.strokeWidth/2,Y=Math.random().toString(36).substring(2,9);be({point:{x:J-F+4,y:O+F+4},groupId:Y}),V(!1),t({type:"FINISH_PATH",payload:{groupId:Y,elements:q}});return}V(!1),t({type:"FINISH_PATH",payload:{elements:q}})},[H,K,B,st,Dt,St,lt,He,t,e.activeTool,e.currentPath,e.strokeWidth]),mc=Zt(m=>{let b=m.target.value;bt.current=m.target.selectionStart,A(q=>q&&y(f({},q),{text:b}))},[]),hc=Zt(m=>{m.key==="Escape"?A(null):m.key==="Enter"&&!m.shiftKey&&(m.preventDefault(),_n())},[_n]),yc=Zt(m=>{if(!k)return;let b=m.clipboardData.items,q=[];for(let I=0;I<b.length;I++){let L=b[I];if(L.type.startsWith("image/")){let j=L.getAsFile();j&&q.push(j)}}q.length>0&&(m.preventDefault(),A(I=>I?y(f({},I),{images:[...I.images||[],...q]}):null))},[k]),bc=Zt(m=>{if(!e.isAnnotating)return;if(e.activeTool==="hand"){m.preventDefault();let q=ye||$t||Bt||_t;if(q&&!to(q)){let I=kn(q),L=Rn(q);t({type:"SELECT_ELEMENT",payload:{el:q,info:y(f({},I),{selector:L})}})}return}m.preventDefault();let b=T.current;b&&(_.current=!0,b.style.pointerEvents="none",setTimeout(()=>{_.current&&(_.current=!1,b.style.pointerEvents="")},4e3))},[e.activeTool,e.isAnnotating,ye,$t,Bt,_t,t,to,T]);hn(()=>{let m=ht.filter(ce=>ce.linkedSelector);if(m.length===0)return;let b=null,q=document.createElement("canvas").getContext("2d"),I=()=>{var $,Z,S;let ce=[];for(let E of m){let J=document.querySelector(E.linkedSelector);if(!J&&((Z=($=E.elements)==null?void 0:$[0])!=null&&Z.selector)&&E.linkedSelector.startsWith("[data-pm=")){try{J=document.querySelector(E.elements[0].selector)}catch(Qe){}if(J){let Qe=(S=E.linkedSelector.match(/data-pm="([^"]+)"/))==null?void 0:S[1];Qe&&J.setAttribute("data-pm",Qe)}}if(!J)continue;let O=J.getBoundingClientRect(),F=e.styleModifications.some(Qe=>{try{return J.matches(Qe.selector)}catch(he){return!1}}),Y=m.filter(Qe=>Qe.id!==E.id&&Qe.timestamp<E.timestamp&&Qe.linkedSelector===E.linkedSelector).length,U=(F?1:0)+Y,xe;if(E.text&&q){let Qe=E.fontSize||12;q.font=`${Qe}px ${Ut}`,xe=Math.max(...E.text.split(`
5
- `).map(he=>q.measureText(he).width))}let Be=O.top>=Fn*(1+U)?"top-left":"bottom-left",Ue=Ta(O,Be,U,M==null?void 0:M.current,xe),Ke=E.points[0],Ht=Be!==E.linkedAnchor;Ke&&(Ht||Math.abs(Ue.x-Ke.x)>1||Math.abs(Ue.y-Ke.y)>1)&&ce.push({id:E.id,point:Ue,linkedAnchor:Ht?Be:void 0})}ce.length>0&&t({type:"UPDATE_LINKED_POSITIONS",payload:{updates:ce}})},L=()=>{b&&cancelAnimationFrame(b),b=requestAnimationFrame(I)};I(),window.addEventListener("scroll",L,!0),window.addEventListener("resize",L,!0),window.addEventListener("load",L),document.fonts.ready.then(L);let j=new MutationObserver(L);return j.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",L,!0),window.removeEventListener("resize",L,!0),window.removeEventListener("load",L),j.disconnect(),b&&cancelAnimationFrame(b)}},[ht,t]);let xc=()=>{var m,b,q;if(!e.isAnnotating)return"default";if(B){let{handle:I}=B;return I==="start"||I==="end"?"move":I==="top"||I==="bottom"?"ns-resize":I==="left"||I==="right"?"ew-resize":I==="topLeft"||I==="bottomRight"?"nwse-resize":"nesw-resize"}if(e.activeTool==="text")return"text";if(e.activeTool==="hand"){let I=(m=St==null?void 0:St.axis)!=null?m:Ot;if(I==="row")return"ns-resize";if(I==="column")return"ew-resize";if(Dt||fn)return"ns-resize";let L=(b=lt==null?void 0:lt.property)!=null?b:wn;if(L==="font-size")return"ew-resize";if(L==="line-height")return"ns-resize";let j=(q=st==null?void 0:st.side)!=null?q:de;return j==="top"||j==="bottom"?"ns-resize":j==="left"||j==="right"?"ew-resize":"default"}return"crosshair"},vc={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:e.isAnnotating?"auto":"none",visibility:e.isAnnotating?"visible":"hidden",cursor:xc()},fr=Zt(()=>{let m=T.current;if(!m||!k)return{width:100,height:12*1.4,isWrapped:!1};let b=m.getContext("2d");if(!b)return{width:100,height:k.fontSize*1.4,isWrapped:!1};b.font=`${k.fontSize}px ${Ut}`;let I=b.measureText("Type here...").width,L=k.text.split(`
6
- `),j=L.length>0?Math.max(I,...L.map(E=>b.measureText(E||" ").width)):I,ce=k.point.x-le.x,$=Yo(ce);if(j>$){let E=El(b,L,$),J=Math.min($,Math.max(I,...E.map(F=>b.measureText(F).width))),O=Math.max(1,E.length)*k.fontSize*1.4;return{width:J,height:O,isWrapped:!0}}let S=Math.max(1,L.length)*k.fontSize*1.4;return{width:j,height:S,isWrapped:!1}},[k,T,le.x])(),Sc=k?Math.max(1,k.text.split(`
7
- `).length)*k.fontSize*1.4+8:0,Fs=fr.height+8,wc=fr.isWrapped?Fs-Sc:0,Cc=k?{position:"fixed",left:k.point.x-4-le.x,top:k.point.y-4-le.y-wc,zIndex:9999,width:fr.width+8,height:Fs,padding:4,fontSize:k.fontSize,fontFamily:Ut,color:"#ffffff",backgroundColor:e.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:fr.isWrapped?"pre-wrap":"pre",wordBreak:fr.isWrapped?"break-word":void 0}:{};return or(rr,{children:[at("canvas",{ref:W,id:"devtools-canvas",style:vc,onMouseDown:Rr,onMouseMove:pr,onMouseUp:m=>yi(m),onMouseLeave:m=>{yi(m),Lt(null),Oe(null)},onTouchStart:Rr,onTouchMove:pr,onTouchEnd:m=>yi(m),onContextMenu:bc}),k&&or(rr,{children:[at("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),at("textarea",{id:"devtools-text-input",ref:Ce,value:k.text,onChange:mc,onKeyDown:hc,onPaste:yc,onBlur:_n,placeholder:"Type here...",style:Cc}),k.images&&k.images.length>0&&or("div",{"data-devtools":!0,style:{position:"fixed",left:k.point.x-4-le.x,top:k.point.y-4-le.y-20,zIndex:1e4,fontSize:11,fontFamily:"system-ui, sans-serif",color:"#fff",backgroundColor:"rgba(0,0,0,0.7)",padding:"2px 6px",borderRadius:3,whiteSpace:"nowrap"},children:[k.images.length," image",k.images.length>1?"s":""," attached"]})]}),e.isAnnotating&&e.activeTool!=="hand"&&e.styleModifications.length>0&&at(oa,{styleModifications:e.styleModifications,isInspecting:!!e.inspectedElement,accentColor:e.activeColor,annotationGroupCount:new Set(ht.map(m=>m.groupId||m.id)).size,dispatch:t,inFlightSelectors:o,toolbarRef:M,onHoverSelector:se}),e.activeTool==="hand"&&e.isAnnotating&&e.styleModifications.length>0&&at(ia,{styleModifications:e.styleModifications,accentColor:e.activeColor}),e.isAnnotating&&at(Jl,{annotations:ht,supersededAnnotations:gn,inFlightIds:r,scrollX:le.x,scrollY:le.y,annotationGroupMap:mn,onViewThread:a,onSelectAnnotation:Le,onHoverAnnotation:z,canvasRef:T}),e.isAnnotating&&l&&at(Ul,{annotations:ht,supersededAnnotations:gn,scrollX:le.x,scrollY:le.y,onReply:l,annotationGroupMap:mn,canvasRef:T,onHoverAnnotation:z}),e.isAnnotating&&i&&i.size>0&&at(Yi,{inFlightSelectorColors:i}),e.isAnnotating&&sn&&at(Yi,{inFlightSelectorColors:sn,animated:!1}),e.activeTool==="hand"&&e.isAnnotating&&(St?Jt.current.element:$t)&&at(Ki,{element:St?Jt.current.element:$t,gap:St?{row:St.row,column:St.column}:br($t),accentColor:e.activeColor,hoveredAxis:Ot,draggingAxis:(zs=St==null?void 0:St.axis)!=null?zs:null,cursorViewport:It,isAutoGap:De,refreshKey:Dn}),e.activeTool==="hand"&&e.isAnnotating&&Qt&&at(Ca,{element:Qt.target,modifier:Qt.modifier,accentColor:e.activeColor,refreshKey:Dn}),e.activeTool==="hand"&&e.isAnnotating&&!Qt&&(Dt?Sn.current.element:Bt)&&at(Zl,{element:Dt?Sn.current.element:Bt,radius:(Ws=Dt==null?void 0:Dt.radius)!=null?Ws:Ro(Bt),accentColor:e.activeColor,hoveredCorner:fn,draggingCorner:(js=Dt==null?void 0:Dt.corner)!=null?js:null,cursorViewport:It}),e.activeTool==="hand"&&e.isAnnotating&&!Qt&&(lt?rn.current.element:_t)&&at(ka,{element:lt?rn.current.element:_t,fontSize:(Ys=lt==null?void 0:lt.fontSize)!=null?Ys:xr(_t).fontSize,lineHeight:(Gs=lt==null?void 0:lt.lineHeight)!=null?Gs:xr(_t).lineHeight,accentColor:e.activeColor,hoveredProperty:wn,draggingProperty:(Js=lt==null?void 0:lt.property)!=null?Js:null,cursorViewport:It}),e.activeTool==="hand"&&e.isAnnotating&&!Qt&&(st?ke.current.element:ye)&&at(ns,{element:st?ke.current.element:ye,padding:(Us=st==null?void 0:st.padding)!=null?Us:Xo(ye),accentColor:e.activeColor,hoveredSide:de,draggingSide:(Vs=st==null?void 0:st.side)!=null?Vs:null,cursorViewport:It,refreshKey:lt?lt.fontSize+lt.lineHeight*1e3:0}),e.activeTool==="inspector"&&e.isAnnotating&&at(rr,{children:nt&&!e.inspectedElement&&(()=>{let m=(k==null?void 0:k.linkedSelector)||(me==null?void 0:me.linkedSelector);if(m)try{if(nt.matches(m))return null}catch(q){}let b=!!me||!!(k!=null&&k.linkedSelector)||ht.some(q=>{if(!q.linkedSelector)return!1;try{return nt.matches(q.linkedSelector)}catch(I){return!1}});return at(Vn,{element:nt,isSelected:!1,elementInfo:Mt,color:e.activeColor,hideTooltip:b})})()}),((k==null?void 0:k.linkedSelector)||(me==null?void 0:me.linkedSelector))&&(()=>{let m=(k==null?void 0:k.linkedSelector)||(me==null?void 0:me.linkedSelector);if(!m)return null;let b=null;try{b=document.querySelector(m)}catch(q){}return b?at(Vn,{element:b,isSelected:!0,color:e.activeColor,hideTooltip:!0}):null})(),P&&(()=>{let m=e.annotations.find(I=>I.id===P);if(!(m!=null&&m.linkedSelector))return null;let b=null;try{b=document.querySelector(m.linkedSelector)}catch(I){}if(!b)return null;let q=!!(r&&r.has(m.id));return at(Vn,{element:b,isSelected:!q,color:m.color,hideTooltip:!0})})(),h&&(()=>{let m=e.annotations.find(L=>L.id===h);if(!(m!=null&&m.linkedSelector))return null;let b=null;try{b=document.querySelector(m.linkedSelector)}catch(L){}if(!b)return null;let q=m.groupId?e.annotations.filter(L=>L.groupId===m.groupId):[m],I=!!(r&&q.some(L=>r.has(L.id)));return at(Vn,{element:b,isSelected:!I,color:m.color,hideTooltip:!0})})(),te&&(()=>{let m=null;try{m=document.querySelector(te)}catch(q){}if(!m)return null;let b=!!(o&&o.has(te));return at(Vn,{element:m,isSelected:!b,color:e.activeColor,hideTooltip:!0})})(),e.activeTool==="model"&&e.isAnnotating&&ct.size>0&&[...ct.entries()].map(([m,b])=>at(Vn,{element:b.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:b.rootElement.tagName.toLowerCase(),reactComponent:m},color:"#8b5cf6"},m)),e.activeTool==="model"&&e.isAnnotating&&Ge&&at(Vn,{element:Ge.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:Ge.rootElement.tagName.toLowerCase(),reactComponent:Ge.name},color:"#22c55e"}),e.activeTool==="model"&&e.isAnnotating&&mt.length>0&&mt.map((m,b)=>at("div",{style:{position:"absolute",left:m.x,top:m.y,width:m.width,height:m.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:m.direction==="vertical"?or(rr,{children:[at("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),at("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),at("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),at("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:m.height<16?-6:"50%",transform:m.height<16?"none":"translateY(-50%)",fontSize:11,fontWeight:600,color:"#fff",backgroundColor:"#FF0000",padding:"2px 4px",whiteSpace:"nowrap",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1},children:Math.round(m.height)})]}):or(rr,{children:[at("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),at("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),at("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),at("div",{style:{position:"absolute",left:m.width<30?0:"50%",top:(m.width<30,void 0),bottom:"calc(50% + 4px)",transform:m.width<30?"none":"translateX(-50%)",fontSize:11,fontWeight:600,color:"#fff",backgroundColor:"#FF0000",padding:"2px 4px",whiteSpace:"nowrap",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1},children:Math.round(m.width)})]})},b)),e.activeTool==="model"&&e.isAnnotating&&Fe&&at(Vn,{element:Fe.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:Fe.rootElement.tagName.toLowerCase(),reactComponent:Fe.name},color:g!=null&&g.has(Fe.name)?"#22c55e":"#8b5cf6"}),e.activeTool==="hand"&&e.isAnnotating&&e.inspectedElement&&or(rr,{children:[Ye&&Ye!=="padding"&&Ye!=="gap"&&(()=>{var $;let m=new Set(ht.map(Z=>Z.groupId||Z.id)).size,b=e.inspectedElement.info.selector,q=e.styleModifications.findIndex(Z=>Z.selector===b),I=q>=0?m+q+1:m+e.styleModifications.length+1,L=e.styleModifications.find(Z=>Z.selector===b),j=($=L==null?void 0:L.changes.length)!=null?$:0,ce=!!(L!=null&&L.captured);return at(Vn,{element:e.inspectedElement.el,isSelected:!0,elementInfo:e.inspectedElement.info,color:ce?"#999999":e.activeColor,annotationNumber:I,changeCount:j})})(),Ye==="padding"&&at(ns,{element:e.inspectedElement.el,padding:Xo(e.inspectedElement.el),accentColor:e.activeColor,hoveredSide:null,draggingSide:null}),Ye==="gap"&&at(Ki,{element:e.inspectedElement.el,gap:br(e.inspectedElement.el),accentColor:e.activeColor,hoveredAxis:null,draggingAxis:null}),at(Sa,{element:e.inspectedElement.el,elementInfo:e.inspectedElement.info,selector:e.inspectedElement.info.selector,styleModifications:e.styleModifications,dispatch:t,onClose:()=>t({type:"SELECT_ELEMENT",payload:null}),onHover:qe,accentColor:e.activeColor,toolbarRef:M})]})]})}import{useCallback as Bn,useEffect as yn,useMemo as Er,useRef as Ft,useState as lr}from"react";import{Circle as of,Component as rf,Hand as sf,MessageCircle as lf,Pen as af,Slash as cf,Square as df,Trash2 as uf,Type as pf}from"lucide-react";import{useEffect as Ia,useRef as La}from"react";function Ra(e,t,n,r,o){let i=La(0),s=La(t.annotations);Ia(()=>{if(!n.current||!e)return;s.current=t.annotations;let l=t.annotations.length;l>0&&(l>=i.current||!r)&&(localStorage.setItem(o.annotations,JSON.stringify(t.annotations)),i.current=l)},[t.annotations,e,r,n,o]),Ia(()=>{n.current&&(localStorage.setItem(o.expanded,String(e)),e&&(localStorage.setItem(o.styleMods,JSON.stringify(t.styleModifications)),localStorage.setItem(o.spacingChanges,JSON.stringify(t.spacingTokenChanges)),localStorage.setItem(o.tool,t.activeTool),localStorage.setItem(o.color,t.activeColor),localStorage.setItem(o.stroke,String(t.strokeWidth)),t.inspectedElement?localStorage.setItem(o.inspected,JSON.stringify({selector:t.inspectedElement.info.selector,info:t.inspectedElement.info})):localStorage.removeItem(o.inspected)))},[e,t.styleModifications,t.spacingTokenChanges,t.activeTool,t.activeColor,t.strokeWidth,t.inspectedElement,n,o])}import{Component as Tp,createElement as Mp,useCallback as ci,useEffect as ho,useRef as Bo,useState as On}from"react";import{Link2 as Ip}from"lucide-react";var cp={colors:[],fonts:[],typeScale:[],spacing:[],radii:[],shadows:[],other:[],references:{}},dp=/^#[0-9a-fA-F]{3,8}$/,up=/^(?:rgba?|hsla?|oklch|oklab|lch|lab)\(/,pp=new Set(["transparent","currentcolor","inherit","white","black","red","green","blue","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]);function Pa(e){let t=e.trim().toLowerCase();return dp.test(t)||up.test(t)||pp.has(t)}var fp=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function ys(e){return fp.test(e.trim())}var Aa=new Set(["serif","sans-serif","monospace","cursive","fantasy","system-ui","ui-serif","ui-sans-serif","ui-monospace","ui-rounded"]);function gp(e){let t=e.trim().toLowerCase();return!!(Aa.has(t)||t.includes(",")&&t.split(",").some(n=>Aa.has(n.trim().replace(/['"]/g,""))))}function mp(e){let t=e.trim().toLowerCase(),n=t.match(/\d+(\.\d+)?px/g);return!!(n&&n.length>=2&&(Pa(t.replace(/[^#()\w,.\s/%]/g,"").split(/\s+/).pop()||"")||t.includes("rgb")||t.includes("hsl")||t.includes("#")))}var hp=/(?:^--(color|bg|fg|accent|border-color|text-color|surface|background|foreground))|(?:-(color|bg|fg)$)/i,yp=/^--(font-family|font|ff|family)/i,bp=/^--(font-size|text-size|fs|text-(?:xs|sm|base|md|lg|xl|2xl|3xl|4xl|5xl))/i,xp=/^--(space|gap|padding|margin|inset)/i,vp=/^--(radius|rounded|br|border-radius)/i,Sp=/^--(shadow|elevation|drop-shadow)/i;function Oa(e,t){let n=e.toLowerCase();return Sp.test(n)?"shadows":vp.test(n)?"radii":yp.test(n)?"fonts":bp.test(n)&&ys(t)?"typeScale":hp.test(n)||Pa(t)?"colors":gp(t)?"fonts":mp(t)?"shadows":xp.test(n)&&ys(t)||ys(t)?"spacing":"other"}function Ba(e,t,n,r){if(e)for(let o of e){if(o instanceof CSSGroupingRule){Ba(o.cssRules,t,n,r);continue}if(o instanceof CSSStyleRule){let i=o.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&wp(o.style,t,n,r)}}}var Na=/var\((--[^,)]+)/;function wp(e,t,n,r){for(let o=0;o<e.length;o++){let i=e[o];if(!(i!=null&&i.startsWith("--"))||n.has(i))continue;n.add(i);let s=t.getPropertyValue(i).trim();if(!s)continue;let l=Oa(i,s);r[l].push([i,s]);let d=e.getPropertyValue(i).trim().match(Na);d&&(r.references[i]=d[1])}}function ii(e){let t=e.trim().match(/^(-?\d+(?:\.\d+)?)/);return t?parseFloat(t[1]):null}function li(e){let t=e.trim().toLowerCase(),n=t.match(/oklch\(\s*([\d.]+%?)/);if(n){let i=n[1];return i.endsWith("%")?parseFloat(i)/100:parseFloat(i)}let r=t.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(r){let[i,s,l]=[parseInt(r[1],10),parseInt(r[2],10),parseInt(r[3],10)];return(.2126*i+.7152*s+.0722*l)/255}let o=t.match(/hsla?\(\s*[\d.]+[,\s]+[\d.]+%?[,\s]+([\d.]+)%?/);if(o)return parseFloat(o[1])/100;if(t.startsWith("#")){let i=t.slice(1);(i.length===3||i.length===4)&&(i=i[0]+i[0]+i[1]+i[1]+i[2]+i[2]);let s=parseInt(i.slice(0,2),16),l=parseInt(i.slice(2,4),16),a=parseInt(i.slice(4,6),16);if(!isNaN(s))return(.2126*s+.7152*l+.0722*a)/255}return null}function Da(e){return e==="colors"?(t,n)=>{let r=li(t[1]),o=li(n[1]);return r!==null&&o!==null?r-o:t[0].localeCompare(n[0])}:e==="typeScale"||e==="spacing"||e==="radii"?(t,n)=>{let r=ii(t[1]),o=ii(n[1]);return r!==null&&o!==null?r-o:t[0].localeCompare(n[0])}:e==="other"?(t,n)=>{let r=ii(t[1]),o=ii(n[1]);return r!==null&&o!==null?r-o:t[0].localeCompare(n[0])}:(t,n)=>t[0].localeCompare(n[0])}function Cp(e){let t=e.replace(/^--/,"");t=t.replace(/^(?:color|clr)-/,"");let n=t.split("-");return n.length>1&&/^\d+$/.test(n[n.length-1])&&n.pop(),n.join("-")}function _a(e){let t=new Map;for(let o of e){let i=Cp(o[0]),s=t.get(i);s||(s=[],t.set(i,s)),s.push(o)}let n=Da("colors");for(let o of t.values())o.sort(n);let r=[...t.entries()];return r.sort((o,i)=>{var a,d;let s=(a=li(o[1][0][1]))!=null?a:0,l=(d=li(i[1][0][1]))!=null?d:0;return s-l}),r}var kp=["colors","fonts","typeScale","spacing","radii","shadows","other"],si=null,Ep=5e3;function Ha(){if(typeof document=="undefined")return cp;if(si&&Date.now()-si.timestamp<Ep)return si.tokens;let e={colors:[],fonts:[],typeScale:[],spacing:[],radii:[],shadows:[],other:[],references:{}},t=new Set,n=getComputedStyle(document.documentElement);try{for(let o of document.styleSheets)try{Ba(o.cssRules||o.rules,n,t,e)}catch(i){}}catch(o){}let r=document.documentElement.style;for(let o=0;o<r.length;o++){let i=r[o];if(!(i!=null&&i.startsWith("--"))||t.has(i))continue;t.add(i);let s=n.getPropertyValue(i).trim();if(!s)continue;let l=Oa(i,s);e[l].push([i,s]);let d=r.getPropertyValue(i).trim().match(Na);d&&(e.references[i]=d[1])}for(let o of kp)e[o].sort(Da(o));return si={tokens:e,timestamp:Date.now()},e}import{Fragment as ir,jsx as $e,jsxs as un}from"react/jsx-runtime";var Fa="popmelt-library-tab",Lp=/^#[0-9a-fA-F]{3,8}$/,Rp=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,Ap=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),Pp=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function za(e){let t=e.trim();return Lp.test(t)||Rp.test(t)||Ap.has(t.toLowerCase())}function Op(e){return Pp.test(e.trim())}function Bp(e){let t=e.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return t?parseFloat(t[1]):null}function Wa(e,t=""){if(e==null)return[];if(typeof e!="object")return[[t,String(e)]];if(Array.isArray(e))return[[t,e.map(String).join(", ")]];let n=[];for(let[r,o]of Object.entries(e)){let i=t?`${t}.${r}`:r;if(o!==null&&typeof o=="object"&&!Array.isArray(o)){let s=o;typeof s.value=="string"?n.push([i,s.value]):n.push(...Wa(o,i))}else n.push([i,Array.isArray(o)?o.map(String).join(", "):String(o!=null?o:"")])}return n}function Np(e){return e.length===0?"generic":e.filter(([,r])=>za(r)).length>e.length/2?"colors":e.filter(([,r])=>Op(r)).length>e.length/2?"spacing":"generic"}var Dp=y(f({position:"fixed",top:16,right:16,bottom:80,width:300,backgroundColor:"#eaeaea"},go),{boxSizing:"content-box",zIndex:10001,display:"flex",flexDirection:"column",overflow:"hidden",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12,pointerEvents:"auto"}),ja={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},_p=y(f({},ja),{color:"#1f2937",borderBottom:"1.5px solid #1f2937"});function Hp({varName:e,value:t,reference:n}){return $e("div",{title:n?`${e} \u2192 ${n}
8
- ${t}`:`${e}: ${t}`,style:{width:28,height:28,backgroundColor:t,outline:"1px solid rgba(0,0,0,0.08)",outlineOffset:-1,position:"relative"},children:n&&$e(Ip,{size:10,strokeWidth:2.5,style:{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",color:"white",filter:"drop-shadow(0 0 1px rgba(0,0,0,0.5))"}})})}function Ya({entries:e,references:t}){let n=[],r=[];for(let i of e)za(i[1])?n.push(i):r.push(i);let o=_a(n);return un(ir,{children:[o.map(([i,s])=>un("div",{style:{marginBottom:4},children:[un("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:2},children:[i,s.length>1?` (${s.length})`:""]}),$e("div",{style:{display:"flex",flexWrap:"wrap",gap:2},children:s.map(([l,a])=>$e(Hp,{varName:l,value:a,reference:t[l]},l))})]},i)),r.length>0&&$e(di,{entries:r})]})}var ai=[0,1,2,4,8,12,16,20,24,28,32];function Fp(e){if(e<=32){let t=ai[0],n=Math.abs(e-t);for(let r=1;r<ai.length;r++){let o=Math.abs(e-ai[r]);o<n&&(t=ai[r],n=o)}return t}return Math.round(e/8)*8}function $p({label:e,value:t,px:n,tokenPath:r,rawToken:o,onHover:i,onModify:s,onDelete:l}){let[a,d]=On(!1),[c,u]=On(null),p=Bo(!1),g=Bo(0),w=Bo(0),C=Bo([]),R=c!==null?c:n,P=c!==null?`${c}px`:t,G=c!==null,M=ci(x=>{x.preventDefault(),p.current=!0,g.current=x.clientX,w.current=n;let N=Wr(o);C.current=Ni(N);let W=H=>{let V=H.clientX-g.current,k=Math.max(0,Math.round(w.current+V));H.shiftKey&&(k=Fp(k));for(let A of C.current)A.element.style.setProperty(A.property,k+"px","important");u(k),i==null||i({name:e,px:k,token:N})},_=()=>{window.removeEventListener("mousemove",W),window.removeEventListener("mouseup",_),document.body.style.cursor="",p.current=!1,u(H=>{if(H!==null&&H!==n&&s){let V=Wr(o),k=V.bindings&&V.bindings.length>0,A;if(k){let be=_i(V.bindings,w.current,H);A=JSON.stringify(y(f({},V),{value:`${H}px`,bindings:be}))}else{let be=_l(C.current,w.current),me=Hl(C.current);if(be.length>0){let We=_i(be,w.current,H);A=JSON.stringify({value:`${H}px`,property:me,bindings:We})}else A=`${H}px`}let Q=typeof o=="string"?o:JSON.stringify(o),ie=C.current.map(be=>({selector:Rn(be.element),property:be.property})),pe=$l(C.current,w.current,H);s({tokenPath:r,originalValue:Q,currentValue:A,targets:ie,originalPx:w.current,currentPx:H},{id:Math.random().toString(36).substring(2,9),tokenPath:r,tokenName:e,originalPx:w.current,newPx:H,affectedElements:pe})}return H})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",W),window.addEventListener("mouseup",_)},[n,e,r,o,i,s]),T=Wr(o);return un("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",fontSize:11,padding:"1px 0",cursor:"ew-resize",userSelect:"none"},onMouseEnter:()=>{p.current||(d(!0),i==null||i({name:e,px:R,token:T}))},onMouseLeave:()=>{p.current||(d(!1),i==null||i(null))},onMouseDown:M,children:[$e("span",{style:{color:a||G?"#FF0000":"#9ca3af"},children:e}),un("span",{style:{display:"flex",alignItems:"center",gap:4},children:[$e("span",{style:{color:a||G?"#FF0000":"#6b7280",fontWeight:600},children:P}),l&&a&&!G&&$e("button",{type:"button",title:"Remove token",onMouseDown:x=>{x.stopPropagation();let N=typeof o=="string"?o:JSON.stringify(o);l(r,N)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:x=>{x.currentTarget.style.color="#FF0000"},onMouseLeave:x=>{x.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function zp({entries:e,categoryKey:t,rawTokens:n,onHover:r,onModify:o,onDelete:i}){let s=[],l=[];for(let a of e){let d=Bp(a[1]);d!==null?s.push([a[0],a[1],d]):l.push(a)}return un(ir,{children:[s.length>0&&$e("div",{style:{display:"flex",flexDirection:"column",gap:2},children:s.map(([a,d,c])=>{let u=a.split(".").pop(),p=n?Wp(n,a):d,g=p&&typeof p=="object"&&"value"in p?p:d;return $e($p,{label:u,value:d,px:c,tokenPath:`tokens.${t}.${a}`,rawToken:g,onHover:r,onModify:o,onDelete:i},a)})}),l.length>0&&$e(di,{entries:l})]})}function Wp(e,t){let n=t.split("."),r=e;for(let o of n){if(r==null||typeof r!="object")return;r=r[o]}return r}function di({entries:e}){return $e("div",{style:{display:"flex",flexDirection:"column",gap:3},children:e.map(([t,n])=>un("div",{style:{fontSize:11},children:[$e("div",{style:{color:"#9ca3af",fontSize:10,marginBottom:1},children:t}),$e("div",{style:{color:"#1f2937",lineHeight:1.4,paddingLeft:8},children:n})]},t))})}function jp({entries:e,categoryKey:t,rawTokens:n,onSpacingHover:r,onModifyToken:o,onDeleteToken:i}){let s=Np(e);return s==="colors"?$e(Ya,{entries:e}):s==="spacing"?$e(zp,{entries:e,categoryKey:t,rawTokens:n,onHover:r,onModify:o,onDelete:i}):$e(di,{entries:e})}function Yp(e){let t=e.toLowerCase(),n=null,r=document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT,{acceptNode(i){return i.closest("#devtools-toolbar, #devtools-canvas, #devtools-scrim, [data-popmelt-panel]")?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}}),o=r.currentNode;for(;o=r.nextNode();){let i=o,s=Object.keys(i).find(a=>a.startsWith("__reactFiber$")||a.startsWith("__reactInternalInstance$"));if(!s)continue;let l=i[s];for(;l;){let a=l.type,d=typeof a=="function"||typeof a=="object"?(a==null?void 0:a.displayName)||(a==null?void 0:a.name):null;if(typeof d=="string"){let c=d.toLowerCase();if(c===t){let u=f({},l.memoizedProps);return delete u.ref,{type:a,props:u}}if(!n){if(c.length>=4&&t.includes(c)){let u=f({},l.memoizedProps);delete u.ref,n={type:a,props:u}}else if(t.length>=4&&c.includes(t)){let u=f({},l.memoizedProps);delete u.ref,n={type:a,props:u}}}}l=l.return}}return n}var bs=class extends Tp{constructor(){super(...arguments);this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(){this.props.onError()}render(){return this.state.hasError?null:this.props.children}},Ga="popmelt-principles-collapsed";function Gp(){try{let e=localStorage.getItem(Ga);if(e)return new Set(JSON.parse(e))}catch(e){}return new Set}function Jp(e){try{localStorage.setItem(Ga,JSON.stringify([...e]))}catch(t){}}function Up({id:e,label:t,count:n,children:r,collapsed:o,onToggle:i}){return un("div",{style:{marginBottom:14},children:[un("div",{onClick:()=>i(e),style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:o?0:6,cursor:"pointer",display:"flex",alignItems:"center",gap:4,userSelect:"none"},children:[$e("span",{style:{display:"inline-flex",alignItems:"center",justifyContent:"center",width:10,fontSize:9,color:"#9ca3af",transform:o?"rotate(-90deg)":"rotate(0deg)"},children:"\u25BC"}),t,$e("span",{style:{fontWeight:400,color:"#9ca3af"},children:n})]}),!o&&r]})}var Vp={colors:"Colors",fonts:"Fonts",typeScale:"Type Scale",spacing:"Spacing",radii:"Radii",shadows:"Shadows",other:"Other"},$a=["colors","fonts","typeScale","spacing","radii","shadows","other"];function Xp(){let[e,t]=On(null),[n,r]=On(Gp);ho(()=>{t(Ha())},[]);let o=ci(s=>{r(l=>{let a=new Set(l);return a.has(s)?a.delete(s):a.add(s),Jp(a),a})},[]);return e?$a.some(s=>e[s].length>0)?$e(ir,{children:$a.map(s=>{let l=e[s];return l.length===0?null:$e(Up,{id:s,label:Vp[s],count:l.length,collapsed:n.has(s),onToggle:o,children:s==="colors"?$e(Ya,{entries:l,references:e.references}):$e(di,{entries:l})},s)})}):$e("div",{style:{color:"#9ca3af",fontSize:11},children:"No :root tokens found."}):null}function Kp({rules:e}){return!e||e.length===0?$e("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."}):$e(ir,{children:e.map((t,n)=>un("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[un("span",{style:{color:"#9ca3af",flexShrink:0},children:[n+1,"."]}),$e("span",{children:t})]},n))})}function qp({name:e,value:t,selected:n,highlighted:r,onRemove:o,onHover:i}){var H;let[s,l]=On(!1),[a,d]=On(!1),c=Bo(null),u=Bo(0),[p,g]=On(0),[w,C]=On(0),R=Wa(t),P=(H=R.find(([V])=>V==="description"))==null?void 0:H[1];ho(()=>{if(!a&&!r){g(0),C(0),u.current=0;return}let V=Uo(e);g(V.length)},[a,r,e]),ho(()=>{n&&c.current&&c.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[n]);let G=n||r||a,M=n?"139,92,246":"34,197,94",T=n?"#8b5cf6":"#22c55e",x=G?`rgba(${M},0.06)`:void 0,N=G?`inset 0 0 0 1.5px rgba(${M},0.35)`:void 0,W=r||a,_=ci(()=>{let V=Uo(e);if(V.length===0)return;let k=u.current%V.length;V[k].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),C(k),u.current=k+1,i==null||i({name:e,instanceIndex:k})},[e,i]);return un("div",{ref:c,onClick:_,onMouseEnter:()=>{d(!0),i==null||i({name:e,instanceIndex:0})},onMouseLeave:()=>{d(!1),i==null||i(null)},style:{marginBottom:8,background:x,padding:6,boxShadow:N,cursor:"pointer"},children:[un("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[un("div",{style:{display:"flex",alignItems:"center",gap:6,marginBottom:6},children:[$e("div",{style:{fontWeight:700,fontSize:11,letterSpacing:"0.05em",padding:"2px 6px",backgroundColor:W?T:"transparent",color:W?"#fff":"#6b7280"},children:e}),W&&p>1&&un("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[w+1,"/",p]})]}),o&&a&&$e("button",{type:"button",title:"Remove from model",onClick:V=>{V.stopPropagation(),o(e)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:V=>{V.currentTarget.style.color="#FF0000"},onMouseLeave:V=>{V.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),P&&$e("div",{style:{fontSize:11,color:W?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:P}),s?$e(jp,{entries:R.filter(([V])=>V!=="description"),categoryKey:""}):$e(Zp,{name:e,onNotFound:()=>l(!0),entries:R})]})}function Zp({name:e,onNotFound:t}){let[n,r]=On(null),[o,i]=On(!1);return ho(()=>{let s=Yp(e);s||t(),r(s),i(!0)},[e,t]),!o||!n?null:$e(bs,{onError:t,children:$e("div",{"data-popmelt-panel":!0,onClick:s=>{s.preventDefault(),s.stopPropagation()},style:{width:"100%",overflowY:"auto",overflowX:"hidden",maxHeight:150,padding:"1rem",outline:"1px solid rgba(0,0,0,0.06)",backgroundColor:"rgb(250,250,250)",boxSizing:"border-box",marginBottom:4,display:"flex",flexDirection:"column",justifyContent:"stretch",alignItems:"center",contain:"layout paint",position:"relative",isolation:"isolate"},children:$e("div",{style:{zoom:.5,pointerEvents:"none"},children:Mp(n.type,n.props)})})})}function Qp({components:e,selectedComponent:t,hoveredComponent:n,onRemove:r,onHover:o}){if(!e||Object.keys(e).length===0)return $e("div",{style:{color:"#9ca3af",fontSize:11},children:"No component patterns defined yet."});let i=new Set(Object.keys(e)),s=Pi(i),l=Object.entries(e).sort(([a],[d])=>{var c,u;return((c=s.get(a))!=null?c:1/0)-((u=s.get(d))!=null?u:1/0)});return $e(ir,{children:l.map(([a,d])=>$e(qp,{name:a,value:d,selected:t===a,highlighted:n===a,onRemove:r,onHover:o},a))})}function Ja({bridgeUrl:e,modelRefreshKey:t,onMouseEnter:n,onMouseLeave:r,selectedComponent:o,hoveredComponent:i,onComponentHover:s,onSpacingTokenHover:l,onModifySpacingToken:a,onDeleteSpacingToken:d,onComponentAdded:c,onComponentRemoved:u}){let[p,g]=On(void 0),[w,C]=On(!0),[R,P]=On(()=>{try{let _=localStorage.getItem(Fa);if(_==="patterns"||_==="principles"||_==="rules")return _}catch(_){}return"patterns"});ho(()=>{Fo(e).then(_=>{g(_),C(!1)})},[e,t]),ho(()=>{try{localStorage.setItem(Fa,R)}catch(_){}},[R]),ho(()=>{o&&(P("patterns"),Fo(e).then(_=>{_&&g(_)}))},[o,e]);let G=ci(_=>{g(H=>{if(!(H!=null&&H.components))return H;let A=H.components,{[_]:V}=A,k=Hn(A,[co(_)]);return y(f({},H),{components:k})}),u==null||u(_)},[u]),M=p==null?void 0:p.components,T=p==null?void 0:p.rules,x=M&&Object.keys(M).length>0,N=T&&T.length>0,W=Bo(null);return ho(()=>{let _=W.current;if(!_)return;let H=n,V=r;return H&&_.addEventListener("mouseenter",H),V&&_.addEventListener("mouseleave",V),()=>{H&&_.removeEventListener("mouseenter",H),V&&_.removeEventListener("mouseleave",V)}},[n,r]),un("div",{ref:W,style:Dp,children:[un("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[$e("span",{children:"Model"}),$e("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"M"})]}),$e("div",{style:{display:"flex",gap:12,marginBottom:10,borderBottom:"1px solid rgba(0,0,0,0.08)",paddingBottom:6},children:["patterns","principles","rules"].map(_=>$e("button",{type:"button",style:R===_?_p:ja,onClick:()=>P(_),children:_.charAt(0).toUpperCase()+_.slice(1)},_))}),$e("div",{style:{flex:1,overflowY:"auto",minHeight:0},children:R==="principles"?$e(Xp,{}):w?$e("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):!p||!x&&!N?$e("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):un(ir,{children:[R==="patterns"&&$e(Qp,{components:M,selectedComponent:o,hoveredComponent:i,onRemove:G,onHover:s}),R==="rules"&&$e(Kp,{rules:T})]})})]})}import{jsx as sr}from"react/jsx-runtime";var ef="M 233.959793 800.214905 L 468.644287 668.536987 L 472.590637 657.100647 L 468.644287 650.738403 L 457.208069 650.738403 L 417.986633 648.322144 L 283.892639 644.69812 L 167.597321 639.865845 L 54.926208 633.825623 L 26.577238 627.785339 L 3.3e-05 592.751709 L 2.73832 575.27533 L 26.577238 559.248352 L 60.724873 562.228149 L 136.187973 567.382629 L 249.422867 575.194763 L 331.570496 580.026978 L 453.261841 592.671082 L 472.590637 592.671082 L 475.328857 584.859009 L 468.724915 580.026978 L 463.570557 575.194763 L 346.389313 495.785217 L 219.543671 411.865906 L 153.100723 363.543762 L 117.181267 339.060425 L 99.060455 316.107361 L 91.248367 266.01355 L 123.865784 230.093994 L 167.677887 233.073853 L 178.872513 236.053772 L 223.248367 270.201477 L 318.040283 343.570496 L 441.825592 434.738342 L 459.946411 449.798706 L 467.194672 444.64447 L 468.080597 441.020203 L 459.946411 427.409485 L 392.617493 305.718323 L 320.778564 181.932983 L 288.80542 130.630859 L 280.348999 99.865845 C 277.369171 87.221436 275.194641 76.590698 275.194641 63.624268 L 312.322174 13.20813 L 332.8591 6.604126 L 382.389313 13.20813 L 403.248352 31.328979 L 434.013519 101.71814 L 483.865753 212.537048 L 561.181274 363.221497 L 583.812134 407.919434 L 595.892639 449.315491 L 600.40271 461.959839 L 608.214783 461.959839 L 608.214783 454.711609 L 614.577271 369.825623 L 626.335632 265.61084 L 637.771851 131.516846 L 641.718201 93.745117 L 660.402832 48.483276 L 697.530334 24.000122 L 726.52356 37.852417 L 750.362549 72 L 747.060486 94.067139 L 732.886047 186.201416 L 705.100708 330.52356 L 686.979919 427.167847 L 697.530334 427.167847 L 709.61084 415.087341 L 758.496704 350.174561 L 840.644348 247.490051 L 876.885925 206.738342 L 919.167847 161.71814 L 946.308838 140.29541 L 997.61084 140.29541 L 1035.38269 196.429626 L 1018.469849 254.416199 L 965.637634 321.422852 L 921.825562 378.201538 L 859.006714 462.765259 L 819.785278 530.41626 L 823.409424 535.812073 L 832.75177 534.92627 L 974.657776 504.724915 L 1051.328979 490.872559 L 1142.818848 475.167786 L 1184.214844 494.496582 L 1188.724854 514.147644 L 1172.456421 554.335693 L 1074.604126 578.496765 L 959.838989 601.449829 L 788.939636 641.879272 L 786.845764 643.409485 L 789.261841 646.389343 L 866.255127 653.637634 L 899.194702 655.409424 L 979.812134 655.409424 L 1129.932861 666.604187 L 1169.154419 692.537109 L 1192.671265 724.268677 L 1188.724854 748.429688 L 1128.322144 779.194641 L 1046.818848 759.865845 L 856.590759 714.604126 L 791.355774 698.335754 L 782.335693 698.335754 L 782.335693 703.731567 L 836.69812 756.885986 L 936.322205 846.845581 L 1061.073975 962.81897 L 1067.436279 991.490112 L 1051.409424 1014.120911 L 1034.496704 1011.704712 L 924.885986 929.234924 L 882.604126 892.107544 L 786.845764 811.48999 L 780.483276 811.48999 L 780.483276 819.946289 L 802.550415 852.241699 L 919.087341 1027.409424 L 925.127625 1081.127686 L 916.671204 1098.604126 L 886.469849 1109.154419 L 853.288696 1103.114136 L 785.073914 1007.355835 L 714.684631 899.516785 L 657.906067 802.872498 L 650.979858 806.81897 L 617.476624 1167.704834 L 601.771851 1186.147705 L 565.530212 1200 L 535.328857 1177.046997 L 519.302124 1139.919556 L 535.328857 1066.550537 L 554.657776 970.792053 L 570.362488 894.68457 L 584.536926 800.134277 L 592.993347 768.724976 L 592.429626 766.630859 L 585.503479 767.516968 L 514.22821 865.369263 L 405.825531 1011.865906 L 320.053711 1103.677979 L 299.516815 1111.812256 L 263.919525 1093.369263 L 267.221497 1060.429688 L 287.114136 1031.114136 L 405.825531 880.107361 L 477.422913 786.52356 L 523.651062 732.483276 L 523.328918 724.671265 L 520.590698 724.671265 L 205.288605 929.395935 L 149.154434 936.644409 L 124.993355 914.01355 L 127.973183 876.885986 L 139.409409 864.80542 L 234.201385 799.570435 L 233.879227 799.8927 Z",tf="M60.8734,57.2556v-14.9432c0-1.2586.4722-2.2029,1.5728-2.8314l30.0443-17.3023c4.0899-2.3593,8.9662-3.4599,13.9988-3.4599,18.8759,0,30.8307,14.6289,30.8307,30.2006,0,1.1007,0,2.3593-.158,3.6178l-31.1446-18.2467c-1.8872-1.1006-3.7754-1.1006-5.6629,0l-39.4812,22.9651ZM131.0276,115.4561v-35.7074c0-2.2028-.9446-3.7756-2.8318-4.8763l-39.481-22.9651,12.8982-7.3934c1.1007-.6285,2.0453-.6285,3.1458,0l30.0441,17.3024c8.6523,5.0341,14.4708,15.7296,14.4708,26.1107,0,11.9539-7.0769,22.965-18.2461,27.527v.0021ZM51.593,83.9964l-12.8982-7.5497c-1.1007-.6285-1.5728-1.5728-1.5728-2.8314v-34.6048c0-16.8303,12.8982-29.5722,30.3585-29.5722,6.607,0,12.7403,2.2029,17.9324,6.1349l-30.987,17.9324c-1.8871,1.1007-2.8314,2.6735-2.8314,4.8764v45.6159l-.0014-.0015ZM79.3562,100.0403l-18.4829-10.3811v-22.0209l18.4829-10.3811,18.4812,10.3811v22.0209l-18.4812,10.3811ZM91.2319,147.8591c-6.607,0-12.7403-2.2031-17.9324-6.1344l30.9866-17.9333c1.8872-1.1005,2.8318-2.6728,2.8318-4.8759v-45.616l13.0564,7.5498c1.1005.6285,1.5723,1.5728,1.5723,2.8314v34.6051c0,16.8297-13.0564,29.5723-30.5147,29.5723v.001ZM53.9522,112.7822l-30.0443-17.3024c-8.652-5.0343-14.471-15.7296-14.471-26.1107,0-12.1119,7.2356-22.9652,18.403-27.5272v35.8634c0,2.2028.9443,3.7756,2.8314,4.8763l39.3248,22.8068-12.8982,7.3938c-1.1007.6287-2.045.6287-3.1456,0ZM52.2229,138.5791c-17.7745,0-30.8306-13.3713-30.8306-29.8871,0-1.2585.1578-2.5169.3143-3.7754l30.987,17.9323c1.8871,1.1005,3.7757,1.1005,5.6628,0l39.4811-22.807v14.9435c0,1.2585-.4721,2.2021-1.5728,2.8308l-30.0443,17.3025c-4.0898,2.359-8.9662,3.4605-13.9989,3.4605h.0014ZM91.2319,157.296c19.0327,0,34.9188-13.5272,38.5383-31.4594,17.6164-4.562,28.9425-21.0779,28.9425-37.908,0-11.0112-4.719-21.7066-13.2133-29.4143.7867-3.3035,1.2595-6.607,1.2595-9.909,0-22.4929-18.2471-39.3247-39.3251-39.3247-4.2461,0-8.3363.6285-12.4262,2.045-7.0792-6.9213-16.8318-11.3254-27.5271-11.3254-19.0331,0-34.9191,13.5268-38.5384,31.4591C11.3255,36.0212,0,52.5373,0,69.3675c0,11.0112,4.7184,21.7065,13.2125,29.4142-.7865,3.3035-1.2586,6.6067-1.2586,9.9092,0,22.4923,18.2466,39.3241,39.3248,39.3241,4.2462,0,8.3362-.6277,12.426-2.0441,7.0776,6.921,16.8302,11.3251,27.5271,11.3251Z";function xs({size:e=16,style:t}){return sr("svg",{width:e,height:e,viewBox:"0 0 1200 1200",fill:"currentColor",stroke:"none",style:f({flexShrink:0},t),children:sr("path",{d:ef})})}function vs({size:e=16,style:t}){return sr("svg",{width:e,height:e,viewBox:"0 0 158.7128 157.296",fill:"currentColor",stroke:"none",style:f({flexShrink:0},t),children:sr("path",{d:tf})})}function Ss({provider:e,size:t=16,style:n}){return e==="codex"?sr(vs,{size:t,style:n}):sr(xs,{size:t,style:n})}var ui=[{id:"claude-opus-4-6",label:"Opus 4.6"},{id:"claude-sonnet-4-6",label:"Sonn 4.6"}],pi=[{id:"gpt-5.4",label:"GPT 5.4"},{id:"gpt-5.3-codex",label:"Codex 5.3"},{id:"gpt-5.3-codex-spark",label:"Spark 5.3"}];var nf=[...ui,...pi];function ws(e,t){if(!e)return t==="codex"?"Codex":"Claude Code";let n=nf.find(r=>r.id===e);return n?n.label:e.replace(/-\d{8,}$/,"")}import{jsx as Va}from"react/jsx-runtime";var so={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#dedede",bgHover:"#e2e2e2",separator:"#e5e7eb"};function yo({children:e,active:t,siblingActive:n,disabled:r,onClick:o,title:i}){let s=()=>r?.4:n&&!t?.5:1,l={position:"relative",display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,borderRadius:0,border:"none",cursor:r?"default":"pointer",transition:"background-color 150ms ease, color 150ms ease, transform 100ms ease, opacity 150ms ease",backgroundColor:t?so.bgActive:"transparent",color:t?so.iconActive:so.iconDefault,opacity:s()};return Va("button",{type:"button",onClick:r?void 0:o,title:i,disabled:r,style:l,onMouseEnter:a=>{r||(a.currentTarget.style.opacity="1",t||(a.currentTarget.style.backgroundColor=so.bgHover))},onMouseLeave:a=>{r||(a.currentTarget.style.opacity=String(s()),t||(a.currentTarget.style.backgroundColor="transparent"))},onMouseDown:a=>{r||(a.currentTarget.style.transform="scale(0.95)")},onMouseUp:a=>{r||(a.currentTarget.style.transform="scale(1)")},children:e})}function Ua(){return Va("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as Tr,jsx as Se,jsxs as Et}from"react/jsx-runtime";var No=[{type:"rectangle",icon:df,label:"Rectangle",shortcut:"R"},{type:"circle",icon:of,label:"Oval",shortcut:"O"},{type:"line",icon:cf,label:"Line",shortcut:"L"},{type:"freehand",icon:af,label:"Pen",shortcut:"P"}],ff=new Set(No.map(e=>e.type));function gf(e,t,n,r,o,i,s,l){let a=(e-o)*(r-i)-(n-o)*(t-i),d=(e-s)*(i-l)-(o-s)*(t-l),c=(e-n)*(l-r)-(s-n)*(t-r),u=a<0||d<0||c<0,p=a>0||d>0||c>0;return!(u&&p)}function mf(){let e=window.innerWidth-16,t=e-326,n=window.innerHeight-80;return{left:t,right:e,y:n}}var hf=[{type:"text",icon:pf,label:"Text",shortcut:"T"}],Xa={inspector:{name:"Comment",desc:"Pin feedback to specific elements on the page.",usage:["Click any element to attach a comment","Type your note, then hand off to your AI","Your AI may ask clarifying questions","Replies get threaded"],keys:[{key:"C",desc:"Select tool"},{key:"Click",desc:"Pin comment to element"},{key:"Esc",desc:"Deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},hand:{name:"Handle",desc:"Quickly finetune layout and typescale.",usage:["Edges \u2192 padding","Between items \u2192 spacing","Corners \u2192 rounding","Right of text \u2192 font size","Below text \u2192 line height","Click a spacing handle to cycle distribution","Right-click \u2192 inspect element styles"],keys:[{key:"H",desc:"Select tool"},{key:"Shift",desc:"Snap to scale"},{key:"\u2325 + swipe",desc:"Cycle justify / flip direction"},{key:"\u21E7 + swipe",desc:"Cycle align-items"},{key:"Right-click",desc:"Inspect styles"},{key:"Esc",desc:"Deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},rectangle:{name:"Rectangle",desc:"Draw rectangular highlights to mark areas of interest.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"R",desc:"Rectangle"},{key:"O",desc:"Oval"},{key:"L",desc:"Line"},{key:"P",desc:"Pen"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},circle:{name:"Oval",desc:"Draw oval highlights to mark areas of interest.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"O",desc:"Oval"},{key:"R",desc:"Rectangle"},{key:"L",desc:"Line"},{key:"P",desc:"Pen"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},line:{name:"Line",desc:"Draw line annotations to point at or connect elements.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"L",desc:"Line"},{key:"R",desc:"Rectangle"},{key:"O",desc:"Oval"},{key:"P",desc:"Pen"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},freehand:{name:"Pen",desc:"Draw freehand paths to annotate freely.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"P",desc:"Pen"},{key:"R",desc:"Rectangle"},{key:"O",desc:"Oval"},{key:"L",desc:"Line"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},text:{name:"Text",desc:"Place text labels anywhere on the page.",usage:["Click to place, then start typing","Click away or press Enter to finish","Scroll while hovering a label to resize it"],keys:[{key:"T",desc:"Select tool"},{key:"Esc",desc:"Cancel text or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},model:{name:"Model",desc:"Promote components into the local design model.",usage:["Hover to highlight component boundaries","Scroll to walk up/down the component tree","Click to add to model.json","Green = already in model"],keys:[{key:"M",desc:"Select tool"},{key:"Scroll",desc:"Walk tree depth"},{key:"Click",desc:"Promote component"},{key:"Esc",desc:"Deselect"}]},counter:{name:"Annotations",desc:"Click to cycle, scroll to change color, long press to reset.",usage:[],keys:[{key:"Click",desc:"Cycle annotations"},{key:"Scroll",desc:"Change color"},{key:"Hold",desc:"Reset to red"}]},clear:{name:"Clear",desc:"Remove all annotations and style changes.",usage:[],keys:[{key:"\u2318 \u232B",desc:"Clear all"},{key:"\u232B",desc:"Delete selected annotation"},{key:"\u2318 Z",desc:"Undo"},{key:"\u2318 \u21E7 Z",desc:"Redo"}]},collapse:{name:"Popmelt",desc:`Comment and zhuzh, then hand off.
2
+ var Wc=Object.defineProperty,Gc=Object.defineProperties;var jc=Object.getOwnPropertyDescriptors;var Gr=Object.getOwnPropertySymbols;var sa=Object.prototype.hasOwnProperty,aa=Object.prototype.propertyIsEnumerable;var ia=(e,t,n)=>t in e?Wc(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,f=(e,t)=>{for(var n in t||(t={}))sa.call(t,n)&&ia(e,n,t[n]);if(Gr)for(var n of Gr(t))aa.call(t,n)&&ia(e,n,t[n]);return e},h=(e,t)=>Gc(e,jc(t));var Co=e=>typeof e=="symbol"?e:e+"",jn=(e,t)=>{var n={};for(var o in e)sa.call(e,o)&&t.indexOf(o)<0&&(n[o]=e[o]);if(e!=null&&Gr)for(var o of Gr(e))t.indexOf(o)<0&&aa.call(e,o)&&(n[o]=e[o]);return n};import{createContext as Jg,useCallback as dn,useContext as Ug,useEffect as zt,useMemo as fo,useRef as tn,useState as nn}from"react";import{useCallback as ba,useEffect as Yc,useSyncExternalStore as Jc}from"react";var Yn="http://localhost:1111";function On(e,t={},n=15e3){let o=new AbortController;t.signal&&t.signal.addEventListener("abort",()=>o.abort());let r=setTimeout(()=>o.abort(),n);return fetch(e,h(f({},t),{signal:o.signal})).finally(()=>clearTimeout(r))}async function ca(e=Yn){try{let t=await On(`${e}/capabilities`,{},5e3);return t.ok?await t.json():null}catch(t){return null}}async function rr(e=Yn){try{let t=new AbortController,n=setTimeout(()=>t.abort(),2e3),o=await fetch(`${e}/status`,{signal:t.signal});return clearTimeout(n),o.ok?await o.json():null}catch(t){return null}}async function la(e){try{let t=new AbortController,n=setTimeout(()=>t.abort(),500),o=await fetch(`http://localhost:${e}/status`,{signal:t.signal});return clearTimeout(n),o.ok?await o.json():null}catch(t){return null}}async function da(e){if(e&&e!=="http://localhost:1111")try{let d=new URL(e);return{url:e,port:parseInt(d.port,10)||1111}}catch(d){return null}let r=typeof window!="undefined"?window.location.origin:null,i=await la(1111);if(i&&i.devOrigin&&r&&i.devOrigin===r)return{url:"http://localhost:1111",port:1111};let s=Array.from({length:8},(d,c)=>{let p=1112+c;return la(p).then(u=>u?{status:u,port:p}:null)}),a=(await Promise.all(s)).filter(d=>d!==null),l=[];i&&l.push({port:1111,devOrigin:i.devOrigin});for(let d of a)l.push({port:d.port,devOrigin:d.status.devOrigin});if(r){let d=l.find(c=>c.devOrigin===r);if(d)return{url:`http://localhost:${d.port}`,port:d.port}}return l.length===1?{url:`http://localhost:${l[0].port}`,port:l[0].port}:i?{url:"http://localhost:1111",port:1111}:l.length>0?{url:`http://localhost:${l[0].port}`,port:l[0].port}:null}async function jr(e=Yn,t,n=-1){try{let o=await On(`${e}/jobs/${t}/events?afterSeq=${n}`,{},5e3);return o.ok?await o.json():null}catch(o){return null}}async function ua(e,t,n=Yn,o,r,i,s,a){let l=new FormData;if(e instanceof Map){let c=!0;for(let[p,u]of e){let g=encodeURIComponent(p);l.append(`screenshot-${g}`,u,`screenshot-${g}.webp`),c&&(l.append("screenshot",u,"screenshot.webp"),c=!1)}c&&l.append("screenshot",new Blob([],{type:"image/webp"}),"screenshot.webp")}else l.append("screenshot",e,"screenshot.webp");if(l.append("feedback",t),o&&l.append("color",o),r&&l.append("provider",r),i&&l.append("model",i),a&&l.append("sourceId",a),s)for(let[c,p]of s)for(let u=0;u<p.length;u++)l.append(`image-${c}-${u}`,p[u],`image-${c}-${u}.webp`);let d=await On(`${n}/send`,{method:"POST",body:l},3e4);if(!d.ok){let c=await d.text();throw new Error(`Bridge returned ${d.status}: ${c}`)}return d.json()}async function pa(e,t=Yn){let n=await On(`${t}/model/component`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!n.ok){let o=await n.text();throw new Error(`Bridge returned ${n.status}: ${o}`)}return n.json()}async function fa(e,t=Yn){let n=await On(`${t}/model/component`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!n.ok){let o=await n.text();throw new Error(`Bridge returned ${n.status}: ${o}`)}return n.json()}async function Bi(e,t,n=Yn){let o=await On(`${n}/model/token`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e,value:t})},1e4);if(!o.ok){let r=await o.text();throw new Error(`Bridge returned ${o.status}: ${r}`)}return o.json()}async function ga(e,t=Yn){let n=await On(`${t}/model/token`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e})},1e4);if(!n.ok){let o=await n.text();throw new Error(`Bridge returned ${n.status}: ${o}`)}return n.json()}async function ir(e=Yn){var t;try{let n=await On(`${e}/model`,{},5e3);return n.ok&&(t=(await n.json()).model)!=null?t:null}catch(n){return null}}async function ma(e=Yn){try{return(await On(`${e}/restart`,{method:"POST"},5e3)).ok||await On(`${e}/shutdown`,{method:"POST"},5e3),!0}catch(t){try{await On(`${e}/shutdown`,{method:"POST"},5e3)}catch(n){}return!0}}async function ha(e=Yn,t,n){let o=await On(`${e}/model/synthesize`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({provider:t,model:n})},1e4);if(!o.ok){let r=await o.text();throw new Error(`Bridge returned ${o.status}: ${r}`)}return o.json()}async function ya(e,t,n=Yn,o,r,i,s,a){let l;if(s&&s.length>0){let d=new FormData,c=new Blob([new Uint8Array([137,80,78,71,13,10,26,10,0,0,0,13,73,72,68,82,0,0,0,1,0,0,0,1,8,6,0,0,0,31,21,196,137,0,0,0,10,73,68,65,84,120,156,98,0,0,0,2,0,1,229,39,222,252,0,0,0,0,73,69,78,68,174,66,96,130])],{type:"image/png"});d.append("screenshot",c,"screenshot.png"),d.append("feedback",JSON.stringify({threadId:e,reply:t,color:o,provider:r,model:i,sourceId:a}));for(let p=0;p<s.length;p++)d.append(`image-reply-${p}`,s[p],`reply-image-${p}.webp`);l=await On(`${n}/reply`,{method:"POST",body:d},3e4)}else l=await On(`${n}/reply`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({threadId:e,reply:t,color:o,provider:r,model:i,sourceId:a})},3e4);if(!l.ok){let d=await l.text();throw new Error(`Bridge returned ${l.status}: ${d}`)}return l.json()}var Vr={};var Fo=typeof Vr!="undefined"?Vr.hot:void 0,va,Sa,wa,Xr=(wa=(Sa=(va=Fo==null?void 0:Fo.data)==null?void 0:va.sourceId)!=null?Sa:typeof localStorage!="undefined"&&localStorage.getItem("popmelt-source-id"))!=null?wa:typeof crypto!="undefined"&&typeof crypto.randomUUID=="function"?crypto.randomUUID():Math.random().toString(36).slice(2);Fo!=null&&Fo.data&&(Fo.data.sourceId=Xr);try{typeof localStorage!="undefined"&&localStorage.setItem("popmelt-source-id",Xr)}catch(e){}function Ni(){return Xr}var $o=typeof Vr!="undefined"?Vr.hot:void 0,mn=$o==null?void 0:$o.data,Uc={isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],activeJobThreads:{},currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,lastErrorByJob:{},pendingQuestions:[],incrementalResolutions:[],capabilitiesVersion:0},Ca,lr=(Ca=mn==null?void 0:mn.store)!=null?Ca:f({},Uc),Ea,Yr=(Ea=mn==null?void 0:mn.listeners)!=null?Ea:new Set,ka,No=(ka=mn==null?void 0:mn.activeEs)!=null?ka:null,Ta,_i=(Ta=mn==null?void 0:mn.activeBridgeUrl)!=null?Ta:null,Do=null,Ma,Jr=(Ma=mn==null?void 0:mn.connectionGeneration)!=null?Ma:0;$o!=null&&$o.data&&Object.defineProperties($o.data,{store:{get:()=>lr,configurable:!0},listeners:{get:()=>Yr,configurable:!0},activeEs:{get:()=>No,configurable:!0},activeBridgeUrl:{get:()=>_i,configurable:!0},connectionGeneration:{get:()=>Jr,configurable:!0},discoveredBridgeUrl:{get:()=>Ho,configurable:!0}});var Ur=new Set,ar=new Map,Eo={};function _o(e,t){var o;if(!e)return!1;if(Ur.has(e)){let r=ar.get(e);return r||(r=[],ar.set(e,r)),r.push({type:(o=t.type)!=null?o:"",data:t}),!0}let n=Eo[e];return n!==void 0&&typeof t.seq=="number"&&t.seq<=n}async function Vc(e,t,n){let o=()=>n!==Jr;for(let r of t){if(o())return;Ur.add(r),ar.set(r,[])}await Promise.all(t.map(async r=>{var i;try{let s=await jr(e,r);if(o())return;let a=(i=ar.get(r))!=null?i:[];if(s){if(an(l=>{let d=h(f({},l.jobResponses),{[r]:s.accumulated.response}),c=h(f({},l.jobThinking),{[r]:s.accumulated.thinking}),p=[...l.events];for(let u of s.events)u.type==="done"||u.type==="error"||p.push({type:u.type,data:u,timestamp:Date.now()});return h(f({},l),{jobResponses:d,jobThinking:c,currentResponse:r===l.activeJobId?s.accumulated.response:l.currentResponse,currentThinking:r===l.activeJobId?s.accumulated.thinking:l.currentThinking,events:p})}),Eo[r]=s.currentSeq,!s.jobActive){let l=s.events.find(d=>d.type==="done"||d.type==="error");l&&Di(l.type,l,r)}for(let l of a)typeof l.data.seq=="number"&&l.data.seq<=s.currentSeq||Di(l.type,l.data,r)}else for(let l of a)Di(l.type,l.data,r)}finally{Ur.delete(r),ar.delete(r)}}))}function Di(e,t,n){var o;if(e==="delta"){let r=t.text||"";an(i=>h(f({},i),{jobResponses:h(f({},i.jobResponses),{[n]:(i.jobResponses[n]||"")+r}),currentResponse:n===i.activeJobId?i.currentResponse+r:i.currentResponse,events:[...i.events,{type:"delta",data:t,timestamp:Date.now()}]}))}else if(e==="thinking"){let r=t.text||"";an(i=>h(f({},i),{jobThinking:h(f({},i.jobThinking),{[n]:(i.jobThinking[n]||"")+r}),currentThinking:n===i.activeJobId?i.currentThinking+r:i.currentThinking,events:[...i.events,{type:"thinking",data:t,timestamp:Date.now()}]}))}else if(e==="done")delete Eo[n],an(r=>{var c;let i=r.activeJobIds.filter(p=>p!==n),s=f({},r.jobResponses),a=f({},r.jobThinking),l=s[n];delete s[n],delete a[n];let d=n===r.activeJobId?i.length>0?i[i.length-1]:null:r.activeJobId;return h(f(h(f({},r),{activeJobIds:i,activeJobId:d,jobResponses:s,jobThinking:a,lastCompletedJobId:n,lastResponseText:l||r.currentResponse||t.responseText||null,lastThreadId:(c=t.threadId)!=null?c:null}),n===r.activeJobId?{currentResponse:d&&s[d]||"",currentThinking:d&&a[d]||""}:{}),{events:[...r.events,{type:"done",data:t,timestamp:Date.now()}]})});else if(e==="error"){delete Eo[n];let r=(o=t.message)!=null?o:"";an(i=>{let s=i.activeJobIds.filter(l=>l!==n),a=s.length>0?i.status:"error";return h(f({},i),{status:a,activeJobIds:s,lastCompletedJobId:n,lastErrorByJob:r?h(f({},i.lastErrorByJob),{[n]:r}):i.lastErrorByJob,events:[...i.events,{type:"error",data:t,timestamp:Date.now()}]})})}else an(r=>h(f({},r),{events:[...r.events,{type:e,data:t,timestamp:Date.now()}]}))}var Ia,Ho=(Ia=mn==null?void 0:mn.discoveredBridgeUrl)!=null?Ia:null,sr=null;async function Xc(e){return e&&e!=="http://localhost:1111"?(Ho=e,e):Ho||sr||(sr=da(e).then(n=>{var o;return Ho=(o=n==null?void 0:n.url)!=null?o:null,sr=null,Ho}).catch(()=>(sr=null,null)),sr)}function La(){return Ho}function xa(){return lr}function Kc(e){return Yr.add(e),()=>{Yr.delete(e)}}function an(e){lr=e(lr);for(let t of Yr)t()}function Ra(e){if(No&&No.readyState!==EventSource.CLOSED&&_i===e)return;No&&(No.close(),No=null),Do&&(clearTimeout(Do),Do=null),_i=e;let t=++Jr,n=new EventSource(`${e}/events?sourceId=${Xr}`);No=n;let o=()=>t!==Jr;n.addEventListener("connected",()=>{o()||rr(e).then(r=>{var u,g;if(o())return;let i=(u=r==null?void 0:r.activeJobs)!=null?u:r!=null&&r.activeJob?[r.activeJob]:[],s=new Set(i.map(b=>b.id)),a=(g=r==null?void 0:r.recentJobs)!=null?g:[],l=new Map(a.map(b=>[b.id,b])),d=i.length>0;an(b=>{let x=f({},b.lastErrorByJob),A=b.activeJobIds.filter(P=>!s.has(P));for(let P of A){let O=l.get(P);(O==null?void 0:O.status)==="error"&&O.error&&(x[P]=O.error)}let T=b.activeJobIds.filter(P=>s.has(P));for(let P of s)T.includes(P)||T.push(P);let z={};for(let P of i)P.threadId&&(z[P.id]=P.threadId);return h(f({},b),{isConnected:!0,status:d?"streaming":A.length>0||b.status==="disconnected"?"idle":b.status,activeJobId:d?i[i.length-1].id:T.length>0?T[T.length-1]:null,activeJobIds:T,activeJobThreads:z,lastErrorByJob:x,lastCompletedJobId:A.length>0?A[A.length-1]:b.lastCompletedJobId})});let c=lr.activeJobIds.filter(b=>!s.has(b)),p=[...Array.from(s),...c];p.length>0&&Vc(e,p,t).catch(()=>{})})}),n.addEventListener("job_started",r=>{if(o())return;let i=JSON.parse(r.data),s=i.jobId;if(_o(s,i))return;let a=i.threadId;an(l=>{var d,c,p,u;return h(f({},l),{status:"streaming",activeJobId:s,activeJobIds:l.activeJobIds.includes(s)?l.activeJobIds:[...l.activeJobIds,s],activeJobThreads:a?h(f({},l.activeJobThreads),{[s]:a}):l.activeJobThreads,jobResponses:h(f({},l.jobResponses),{[s]:(d=l.jobResponses[s])!=null?d:""}),jobThinking:h(f({},l.jobThinking),{[s]:(c=l.jobThinking[s])!=null?c:""}),currentResponse:(p=l.jobResponses[s])!=null?p:"",currentThinking:(u=l.jobThinking[s])!=null?u:"",lastResponseText:null,lastThreadId:null,events:[...l.events,{type:"job_started",data:i,timestamp:Date.now()}]})})}),n.addEventListener("delta",r=>{if(o())return;let i=JSON.parse(r.data),s=i.jobId;if(_o(s,i))return;let a=i.text||"";an(l=>h(f({},l),{jobResponses:s?h(f({},l.jobResponses),{[s]:(l.jobResponses[s]||"")+a}):l.jobResponses,currentResponse:!s||s===l.activeJobId?l.currentResponse+a:l.currentResponse,events:[...l.events,{type:"delta",data:i,timestamp:Date.now()}]}))}),n.addEventListener("thinking",r=>{if(o())return;let i=JSON.parse(r.data),s=i.jobId;if(_o(s,i))return;let a=i.text||"";an(l=>h(f({},l),{jobThinking:s?h(f({},l.jobThinking),{[s]:(l.jobThinking[s]||"")+a}):l.jobThinking,currentThinking:!s||s===l.activeJobId?l.currentThinking+a:l.currentThinking,events:[...l.events,{type:"thinking",data:i,timestamp:Date.now()}]}))}),n.addEventListener("tool_use",r=>{if(o())return;let i=JSON.parse(r.data),s=i.jobId;_o(s,i)||an(a=>h(f({},a),{events:[...a.events,{type:"tool_use",data:i,timestamp:Date.now()}]}))}),n.addEventListener("done",r=>{if(o())return;let i=JSON.parse(r.data),s=i.jobId;_o(s,i)||(s&&delete Eo[s],an(a=>{var b;let l=s?a.activeJobIds.filter(x=>x!==s):a.activeJobIds,d=f({},a.jobResponses),c=f({},a.jobThinking),p=f({},a.activeJobThreads),u=s?d[s]:void 0;s&&(delete d[s],delete c[s],delete p[s]);let g=s===a.activeJobId?l.length>0?l[l.length-1]:null:a.activeJobId;return h(f(h(f({},a),{activeJobIds:l,activeJobId:g,jobResponses:d,jobThinking:c,lastCompletedJobId:s!=null?s:a.activeJobId,lastResponseText:u||a.currentResponse||i.responseText||null,lastThreadId:(b=i.threadId)!=null?b:null}),s===a.activeJobId?{currentResponse:g&&d[g]||"",currentThinking:g&&c[g]||""}:{}),{events:[...a.events,{type:"done",data:i,timestamp:Date.now()}]})}))}),n.addEventListener("question",r=>{if(o())return;let i=JSON.parse(r.data),s=i.jobId;_o(s,i)||an(a=>h(f({},a),{pendingQuestions:[...a.pendingQuestions,{jobId:i.jobId,threadId:i.threadId,question:i.question,annotationIds:i.annotationIds,timestamp:Date.now()}],events:[...a.events,{type:"question",data:i,timestamp:Date.now()}]}))}),n.addEventListener("capabilities_changed",()=>{o()||an(r=>h(f({},r),{capabilitiesVersion:r.capabilitiesVersion+1}))}),n.addEventListener("queue_drained",()=>{if(!o()){for(let r of Object.keys(Eo))delete Eo[r];Ur.clear(),ar.clear(),an(r=>h(f({},r),{status:r.status==="error"?"error":"idle",activeJobId:null,activeJobIds:[],activeJobThreads:{},currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastErrorByJob:{},incrementalResolutions:[]}))}}),n.addEventListener("error",r=>{var i,s;if(!o()){if(n.readyState===EventSource.CLOSED)an(a=>h(f({},a),{isConnected:!1,status:"disconnected"})),Do&&(clearTimeout(Do),Do=null),Do=setTimeout(()=>{rr(e).then(a=>{a&&Ra(e)})},5e3);else if(r instanceof MessageEvent){let a=JSON.parse(r.data),l=(i=a.jobId)!=null?i:null;if(_o(l!=null?l:void 0,a))return;l&&delete Eo[l];let d=(s=a.message)!=null?s:"";an(c=>{let p=l?c.activeJobIds.filter(g=>g!==l):c.activeJobIds,u=p.length>0?c.status:"error";return h(f({},c),{status:u,activeJobIds:p,lastCompletedJobId:l!=null?l:c.activeJobId,lastErrorByJob:l&&d?h(f({},c.lastErrorByJob),{[l]:d}):c.lastErrorByJob,events:[...c.events,{type:"error",data:a,timestamp:Date.now()}]})})}}}),n.onerror=()=>{o()||n.readyState===EventSource.CLOSED&&an(r=>h(f({},r),{isConnected:!1,status:"disconnected"}))}}function Aa(e="http://localhost:1111",t=!0){let n=Jc(Kc,xa,xa);Yc(()=>{t&&Xc(e).then(i=>{i&&rr(i).then(s=>{s&&Ra(i)})})},[e,t]);let o=ba(()=>{an(()=>h(f({},lr),{events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,lastErrorByJob:{},incrementalResolutions:[]}))},[]),r=ba(i=>{an(s=>h(f({},s),{pendingQuestions:s.pendingQuestions.filter(a=>a.threadId!==i)}))},[]);return h(f({},n),{clearEvents:o,dismissQuestion:r})}import{useEffect as qc,useReducer as Zc}from"react";var Qc={isAnnotating:!1,activeTool:"inspector",activeColor:"oklch(0.628 0.258 29)",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function Kr(){return Math.random().toString(36).substring(2,9)}function Pa(e){return e.status?e:e.captured?h(f({},e),{status:"in_flight"}):h(f({},e),{status:"pending"})}function Mn(e){return h(f({},e),{undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}],redoStack:[]})}function ed(e,t){return h(f({},e),{isAnnotating:t})}function td(e,t){return h(f({},e),{activeTool:t,inspectedElement:null})}function nd(e,t){return h(f({},e),{activeColor:t})}function od(e,t){return h(f({},e),{strokeWidth:t})}function rd(e,t){return h(f({},e),{currentPath:[t]})}function id(e,t){return h(f({},e),{currentPath:[...e.currentPath,t]})}function sd(e){return h(f({},e),{currentPath:[]})}function ad(e,t){if(e.currentPath.length<2&&e.activeTool!=="text")return h(f({},e),{currentPath:[]});let n={id:Kr(),type:e.activeTool,points:e.currentPath,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",pathname:typeof window!="undefined"?window.location.pathname:"/",groupId:t==null?void 0:t.groupId,elements:t==null?void 0:t.elements},o=Mn(e);return h(f({},o),{annotations:[...e.annotations,n],currentPath:[]})}function ld(e,t){var r;let n=f({id:(r=t.id)!=null?r:Kr(),type:"text",points:[t.point],text:t.text,fontSize:t.fontSize||12,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",pathname:typeof window!="undefined"?window.location.pathname:"/",groupId:t.groupId,linkedSelector:t.linkedSelector,linkedAnchor:t.linkedAnchor,elements:t.elements},t.imageCount?{imageCount:t.imageCount}:{}),o=t.groupId?e:Mn(e);return h(f({},o),{annotations:[...e.annotations,n]})}function cd(e,t){let n=Mn(e);return h(f({},n),{annotations:e.annotations.map(o=>o.id===t.id?f(h(f({},o),{text:t.text}),t.imageCount!=null?{imageCount:t.imageCount}:{}):o)})}function dd(e,t){return h(f({},e),{annotations:e.annotations.map(n=>n.id===t.id?h(f({},n),{fontSize:Math.max(12,Math.min(72,t.fontSize))}):n)})}function ud(e,t){let n=Mn(e),o=e.annotations.find(i=>i.id===t.id),r=o==null?void 0:o.groupId;return h(f({},n),{annotations:e.annotations.filter(i=>i.id!==t.id&&!(r&&i.groupId===r))})}function pd(e,t){let n=t.saveUndo?Mn(e):e,o=e.annotations.find(i=>i.id===t.id),r=o==null?void 0:o.groupId;return h(f({},n),{annotations:e.annotations.map(i=>{if(!(i.id===t.id||r&&i.groupId===r))return i;let a=t.delta.x,l=t.delta.y;return h(f({},i),{points:i.points.map(d=>({x:d.x+a,y:d.y+l}))})})})}function fd(e,t){let n=t.saveUndo?Mn(e):e,o=e.annotations.find(s=>s.id===t.id);if(!o||o.type==="text"||o.points.length<2)return e;let r=0,i=0;if(o.type==="rectangle"&&o.groupId){let s=t.points,a=Math.min(s[0].x,s[1].x),l=Math.max(s[0].y,s[1].y),d=o.points[0],c=o.points[o.points.length-1],p=Math.min(d.x,c.x),u=Math.max(d.y,c.y);r=a-p,i=l-u}return h(f({},n),{annotations:e.annotations.map(s=>s.id===t.id?h(f({},s),{points:t.points}):o.groupId&&s.groupId===o.groupId&&s.type==="text"?h(f({},s),{points:s.points.map(a=>({x:a.x+r,y:a.y+i}))}):s)})}function gd(e,t){let n=Mn(e);return h(f({},n),{annotations:[...e.annotations,...t.annotations.map(Pa)]})}function md(e,t){let n=new Set,o=[];for(let r of t.annotations)n.has(r.id)||(n.add(r.id),o.push(Pa(r)));return h(f({},e),{annotations:o})}function hd(e){if(e.undoStack.length===0)return e;let t=e.undoStack[e.undoStack.length-1];return h(f({},e),{annotations:(t==null?void 0:t.annotations)||[],styleModifications:(t==null?void 0:t.styleModifications)||[],spacingTokenMods:(t==null?void 0:t.spacingTokenMods)||[],undoStack:e.undoStack.slice(0,-1),redoStack:[...e.redoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}]})}function yd(e){if(e.redoStack.length===0)return e;let t=e.redoStack[e.redoStack.length-1];return h(f({},e),{annotations:(t==null?void 0:t.annotations)||[],styleModifications:(t==null?void 0:t.styleModifications)||[],spacingTokenMods:(t==null?void 0:t.spacingTokenMods)||[],redoStack:e.redoStack.slice(0,-1),undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}]})}function bd(e,t){let{id:n,addToSelection:o}=t;if(n===null)return h(f({},e),{selectedAnnotationIds:[],lastSelectedId:null});if(o)if(e.selectedAnnotationIds.includes(n)){let i=e.selectedAnnotationIds.filter(s=>s!==n);return h(f({},e),{selectedAnnotationIds:i,lastSelectedId:i.length>0?i[i.length-1]:null})}else return h(f({},e),{selectedAnnotationIds:[...e.selectedAnnotationIds,n],lastSelectedId:n});return h(f({},e),{selectedAnnotationIds:[n],lastSelectedId:n})}function xd(e,t){let n=new Set;for(let o of e.selectedAnnotationIds){let r=e.annotations.find(i=>i.id===o);r!=null&&r.groupId&&n.add(r.groupId)}return h(f({},e),{annotations:e.annotations.map(o=>{let r=e.selectedAnnotationIds.includes(o.id),i=o.groupId&&n.has(o.groupId);return!r&&!i?o:h(f({},o),{color:t.color})})})}function vd(e){return h(f({},e),{annotations:e.annotations.map(t=>h(f({},t),{captured:!0,status:t.status==="pending"||!t.status?"in_flight":t.status})),styleModifications:e.styleModifications.map(t=>h(f({},t),{captured:!0})),spacingTokenChanges:e.spacingTokenChanges.map(t=>h(f({},t),{captured:!0}))})}function Sd(e){return h(f({},e),{annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]})}function wd(e,t){return h(f({},e),{inspectedElement:t})}function Cd(e,t){let{selector:n,element:o,property:r,original:i,modified:s}=t,a=e.styleModifications.findIndex(l=>l.selector===n);if(i===s&&a<0)return e;if(a>=0){let l=e.styleModifications[a];if(l.captured){let g=Mn(e),b=g.styleModifications.map((x,A)=>A===a?h(f({},x),{changes:[{property:r,original:i,modified:s}],captured:!1}):x);return h(f({},g),{styleModifications:b})}let d=l.changes.findIndex(g=>g.property===r),c,p=e;if(d>=0){let g=l.changes[d];s===g.original?c=l.changes.filter((b,x)=>x!==d):c=l.changes.map((b,x)=>x===d?h(f({},b),{modified:s}):b)}else{if(i===s)return e;p=Mn(e),c=[...l.changes,{property:r,original:i,modified:s}]}if(c.length===0)return h(f({},p),{styleModifications:p.styleModifications.filter((g,b)=>b!==a)});let u=p.styleModifications.map((g,b)=>b===a?h(f({},g),{changes:c}):g);return h(f({},p),{styleModifications:u})}else{let l=Mn(e),d={selector:n,element:o,changes:[{property:r,original:i,modified:s}]};return h(f({},l),{styleModifications:[...l.styleModifications,d]})}}function Ed(e,t){let{selector:n,durableSelector:o,element:r,changes:i}=t,s=i.filter(d=>d.original!==d.modified);if(s.length===0)return e;let a=Mn(e),l=a.styleModifications.findIndex(d=>d.selector===n);if(l>=0){let d=a.styleModifications[l],c=d.captured?[]:[...d.changes];for(let p of s){let u=c.findIndex(g=>g.property===p.property);u>=0?p.modified===c[u].original?c=c.filter((g,b)=>b!==u):c=c.map((g,b)=>b===u?h(f({},g),{modified:p.modified}):g):c.push(p)}return c.length===0?h(f({},a),{styleModifications:a.styleModifications.filter((p,u)=>u!==l)}):h(f({},a),{styleModifications:a.styleModifications.map((p,u)=>u===l?h(f({},p),{changes:c,captured:!1}):p)})}else return h(f({},a),{styleModifications:[...a.styleModifications,{selector:n,durableSelector:o,element:r,changes:s}]})}function kd(e,t){let{selector:n,property:o}=t,r=Mn(e),i=r.styleModifications.map(s=>s.selector!==n?s:h(f({},s),{changes:s.changes.filter(a=>a.property!==o)})).filter(s=>s.changes.length>0);return h(f({},r),{styleModifications:i})}function Td(e){if(e.styleModifications.length===0)return h(f({},e),{inspectedElement:null});let t=Mn(e);return h(f({},t),{styleModifications:[],inspectedElement:null})}function Md(e,t){return h(f({},e),{styleModifications:t})}function Id(e,t){let{updates:n}=t,o=new Map(n.map(r=>[r.id,r]));return h(f({},e),{annotations:e.annotations.map(r=>{let i=o.get(r.id);return i?f(h(f({},r),{points:[i.point,...r.points.slice(1)]}),i.linkedAnchor?{linkedAnchor:i.linkedAnchor}:{}):r})})}function Ld(e,t){let n=new Set(t.ids);return h(f({},e),{annotations:e.annotations.map(o=>n.has(o.id)?h(f({},o),{status:t.status}):o)})}function Rd(e,t){let n=new Set(t.ids),o=new Set;for(let r of e.annotations)n.has(r.id)&&r.groupId&&o.add(r.groupId);return h(f({},e),{annotations:e.annotations.map(r=>n.has(r.id)||r.groupId&&o.has(r.groupId)?h(f({},r),{threadId:t.threadId}):r)})}function Ad(e,t){let n=new Set(t.ids),o=new Set;for(let r of e.annotations)n.has(r.id)&&r.groupId&&o.add(r.groupId);return h(f({},e),{annotations:e.annotations.map(r=>n.has(r.id)||r.groupId&&o.has(r.groupId)?h(f({},r),{status:"waiting_input",question:t.question,threadId:t.threadId}):r)})}function Pd(e,t){let n=new Map(t.resolutions.map(r=>[r.annotationId,r])),o=new Map;for(let r of e.annotations){let i=n.get(r.id);i&&r.groupId&&o.set(r.groupId,i)}return h(f({},e),{annotations:e.annotations.map(r=>{var s,a,l;let i=n.get(r.id)||(r.groupId?o.get(r.groupId):void 0);return i?h(f({},r),{status:i.status,resolutionSummary:i.summary,scope:(a=(s=i.finalScope)!=null?s:i.inferredScope)!=null?a:null,replyCount:((l=r.replyCount)!=null?l:0)+1,question:void 0,threadId:r.threadId||t.threadId}):r})})}function Od(e,t){let{linkedSelectors:n,styleSelectors:o}=t,r=new Set(n),i=new Set(o),s=new Set,a=new Set;for(let u of e.annotations)u.linkedSelector&&r.has(u.linkedSelector)&&(s.add(u.id),u.groupId&&a.add(u.groupId));for(let u of e.annotations)u.groupId&&a.has(u.groupId)&&s.add(u.id);let l=e.annotations.filter(u=>!s.has(u.id)),d=e.styleModifications.filter(u=>!i.has(u.selector));if(l.length===e.annotations.length&&d.length===e.styleModifications.length)return e;let c=e.selectedAnnotationIds.filter(u=>!s.has(u)),p=e.inspectedElement&&i.has(e.inspectedElement.info.selector)?null:e.inspectedElement;return h(f({},e),{annotations:l,styleModifications:d,selectedAnnotationIds:c,lastSelectedId:c.length>0?c[c.length-1]:null,inspectedElement:p})}function Bd(e,t){let n=e.spacingTokenChanges.findIndex(o=>o.tokenPath===t.tokenPath);return n>=0?h(f({},e),{spacingTokenChanges:e.spacingTokenChanges.map((o,r)=>r===n?t:o)}):h(f({},e),{spacingTokenChanges:[...e.spacingTokenChanges,t]})}function Dd(e,t){return h(f({},e),{spacingTokenChanges:t})}function _d(e,t){let n=Mn(e),o=e.spacingTokenMods.findIndex(i=>i.tokenPath===t.tokenPath),r;if(o>=0){let i=e.spacingTokenMods[o],s=h(f({},t),{originalValue:i.originalValue,originalPx:i.originalPx});r=e.spacingTokenMods.map((a,l)=>l===o?s:a)}else r=[...e.spacingTokenMods,t];return h(f({},n),{spacingTokenMods:r})}function Nd(e,t){let n=Mn(e),o=e.spacingTokenMods.findIndex(l=>l.tokenPath===t.tokenPath),r=o>=0?e.spacingTokenMods[o].originalValue:t.originalValue,i=o>=0?e.spacingTokenMods[o].originalPx:parseFloat(t.originalValue)||0,s={tokenPath:t.tokenPath,originalValue:r,currentValue:"__deleted__",targets:o>=0?e.spacingTokenMods[o].targets:[],originalPx:i,currentPx:0},a;return o>=0?a=e.spacingTokenMods.map((l,d)=>d===o?s:l):a=[...e.spacingTokenMods,s],h(f({},n),{spacingTokenMods:a})}var Hd={SET_ANNOTATING:ed,SET_TOOL:td,SET_COLOR:nd,SET_STROKE_WIDTH:od,START_PATH:rd,CONTINUE_PATH:id,CANCEL_PATH:sd,FINISH_PATH:ad,ADD_TEXT:ld,UPDATE_TEXT:cd,UPDATE_TEXT_SIZE:dd,DELETE_ANNOTATION:ud,MOVE_ANNOTATION:pd,RESIZE_ANNOTATION:fd,PASTE_ANNOTATIONS:gd,RESTORE_ANNOTATIONS:md,UNDO:hd,REDO:yd,SELECT_ANNOTATION:bd,UPDATE_ANNOTATION_COLOR:xd,MARK_CAPTURED:vd,CLEAR:Sd,SELECT_ELEMENT:wd,MODIFY_STYLE:Cd,MODIFY_STYLES_BATCH:Ed,CLEAR_STYLE:kd,CLEAR_ALL_STYLES:Td,RESTORE_STYLE_MODIFICATIONS:Md,UPDATE_LINKED_POSITIONS:Id,CLEANUP_ORPHANED:Od,SET_ANNOTATION_STATUS:Ld,SET_ANNOTATION_THREAD:Rd,SET_ANNOTATION_QUESTION:Ad,APPLY_RESOLUTIONS:Pd,ADD_SPACING_TOKEN_CHANGE:Bd,RESTORE_SPACING_TOKEN_CHANGES:Dd,MODIFY_SPACING_TOKEN:_d,DELETE_SPACING_TOKEN:Nd};function Fd(e,t){let n=Hd[t.type];return n?n(e,t.payload):e}function Oa(){let[e,t]=Zc(Fd,Qc);return qc(()=>{let n=o=>{(o.metaKey||o.ctrlKey)&&o.key==="z"&&(o.preventDefault(),o.shiftKey?t({type:"REDO"}):t({type:"UNDO"}))};return window.addEventListener("keydown",n),()=>window.removeEventListener("keydown",n)},[]),[e,t]}import{useSyncExternalStore as $d}from"react";if(typeof window!="undefined"&&!window.__popmeltPathPatch){window.__popmeltPathPatch=!0;for(let e of["pushState","replaceState"]){let t=History.prototype[e];History.prototype[e]=function(...n){let o=window.location.pathname;t.apply(this,n),window.dispatchEvent(new CustomEvent("popmelt:locationchange",{detail:{prevPath:o}}))}}}function zd(e){return window.addEventListener("popstate",e),window.addEventListener("popmelt:locationchange",e),()=>{window.removeEventListener("popstate",e),window.removeEventListener("popmelt:locationchange",e)}}function Wd(){return window.location.pathname}function cr(){return $d(zd,Wd,()=>"/")}var Ba="popmelt-toolbar-snap-position";function zo(e){return e.startsWith("top-")}function Wo(e){return e.endsWith("-right")}function Rr(e){return e.endsWith("-center")}function Da(){try{let e=localStorage.getItem(Ba);if(e&&Gd(e))return e}catch(e){}return"bottom-right"}function _a(e){try{localStorage.setItem(Ba,e)}catch(t){}}function Gd(e){return["bottom-right","bottom-center","bottom-left","top-right","top-center","top-left"].includes(e)}function Na(e,t,n){let o=zo(e)?16:n-16-54;return Rr(e)?{position:"fixed",top:o,left:t/2,transform:"translateX(-50%)"}:Wo(e)?{position:"fixed",top:o,right:16,left:"auto"}:{position:"fixed",top:o,left:16,right:"auto"}}function Ha(e,t,n){let r=zo(e)?{top:82}:{bottom:82},i;return Rr(e)?i={left:t/2,transform:"translateX(-50%)"}:Wo(e)?i={right:16}:i={left:16},f(f({position:"fixed"},r),i)}function Fa(e,t,n){let o=zo(e),r=o?{top:78}:{bottom:78},i,s;return Rr(e)?(i={left:"50%",transform:"translateX(-50%)"},s="center"):Wo(e)?(i={right:16},s="flex-end"):(i={left:16},s="flex-start"),h(f(f({position:"fixed"},r),i),{zIndex:9999,display:"flex",flexDirection:"column",alignItems:s})}function $a(e){let t=zo(e),n=Wo(e)||Rr(e);return{position:"fixed",top:t&&n?82:16,right:16,bottom:!t&&n?82:16}}function za(e,t,n){let r=zo(e),i,s;Wo(e)||Rr(e)?(i=t-16,s=i-326):(s=16,i=s+326);let a=r?82:n-16-54-12;return{left:s,right:i,y:a}}var Wa=["top-left","top-center","top-right","bottom-left","bottom-center","bottom-right"];import{domToCanvas as jd}from"modern-screenshot";function Hi(e){let t=document.createElement("canvas").getContext("2d");return t?(t.fillStyle=e,t.fillStyle):"#888888"}function Fi(e,t=[],n,o){let r=new Map,i=[];for(let a of e)if(a.groupId){let l=r.get(a.groupId)||[];l.push(a),r.set(a.groupId,l)}else i.push(a);let s=[];for(let[a,l]of r){let d=l.find(p=>p.type!=="text"),c=l.find(p=>p.type==="text");if(d){let p=d.linkedSelector||(c==null?void 0:c.linkedSelector),u=(c==null?void 0:c.imageCount)||d.imageCount,g=d.pathname||(c==null?void 0:c.pathname);s.push(f(h(f(f({id:d.id,type:d.type,instruction:c==null?void 0:c.text},p?{linkedSelector:p}:{}),g?{pathname:g}:{}),{elements:d.elements||[]}),u?{imageCount:u}:{}))}}for(let a of i)s.push(f(h(f(f({id:a.id,type:a.type,instruction:a.type==="text"?a.text:void 0},a.linkedSelector?{linkedSelector:a.linkedSelector}:{}),a.pathname?{pathname:a.pathname}:{}),{elements:a.elements||[]}),a.imageCount?{imageCount:a.imageCount}:{}));return f(f({timestamp:new Date().toISOString(),url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},scrollPosition:{x:window.scrollX,y:window.scrollY},annotations:s,styleModifications:t},n?{inspectedElement:n}:{}),o&&o.length>0?{spacingTokenChanges:o}:{})}function Yd(e){if(!e.points||e.points.length===0)return null;let t=e.points.map(o=>o.x),n=e.points.map(o=>o.y);return{minX:Math.min(...t),minY:Math.min(...n),maxX:Math.max(...t),maxY:Math.max(...n)}}function Jd(e,t){if(e.length===0)return[];let n=e.map(c=>({annotation:c,bounds:Yd(c)})).filter(c=>c.bounds!==null);if(n.length===0)return[];n.sort((c,p)=>c.bounds.minY-p.bounds.minY);let o=Math.min(...n.map(c=>c.bounds.minY)),r=Math.max(...n.map(c=>c.bounds.maxY));if(r-o<=t){let c=(o+r)/2,p=Math.max(0,c-t/2);return[{top:p,bottom:p+t,annotations:e}]}let i=[],s=50,a=Math.max(0,o-s),l=[],d=a;for(let{annotation:c,bounds:p}of n){let u=p.maxY+s;if(u-a<=t)l.push(c),d=Math.max(d,u);else{if(l.length>0){let g=(a+d)/2,b=Math.max(0,g-t/2);i.push({top:b,bottom:b+t,annotations:l})}a=Math.max(0,p.minY-s),l=[c],d=p.maxY+s}}if(l.length>0){let c=(a+d)/2,p=Math.max(0,c-t/2);i.push({top:p,bottom:p+t,annotations:l})}return i}function Ud(e){let t=new Map;for(let n of e)if(n.linkedSelector)try{let o=document.querySelector(n.linkedSelector);if(o){let r=o.getBoundingClientRect();t.set(n.id,{x:r.left+window.scrollX,y:r.top+window.scrollY,width:r.width,height:r.height})}}catch(o){}return t}function Vd(e,t,n,o,r){if(e.save(),e.scale(o,o),r)for(let i of t){let s=r.get(i.id);if(!s)continue;let a=s.y-n;e.fillStyle=i.color,e.globalAlpha=.05,e.fillRect(s.x,a,s.width,s.height),e.globalAlpha=1,e.strokeStyle=i.color,e.lineWidth=1,e.setLineDash([2,4]),e.strokeRect(s.x,a,s.width,s.height),e.setLineDash([])}for(let i of t){let s=i.points.map(a=>({x:a.x,y:a.y-n}));switch(e.strokeStyle=i.color,e.fillStyle=i.color,e.lineWidth=i.strokeWidth,e.lineCap="round",e.lineJoin="round",i.type){case"freehand":if(s.length<2)break;e.beginPath(),e.moveTo(s[0].x,s[0].y);for(let a=1;a<s.length;a++)e.lineTo(s[a].x,s[a].y);e.stroke();break;case"line":if(s.length<2)break;e.beginPath(),e.moveTo(s[0].x,s[0].y),e.lineTo(s[s.length-1].x,s[s.length-1].y),e.stroke();break;case"rectangle":{if(s.length<2)break;let a=s[0],l=s[s.length-1],d=Math.min(a.x,l.x),c=Math.min(a.y,l.y),p=Math.abs(l.x-a.x),u=Math.abs(l.y-a.y);e.strokeRect(d,c,p,u);break}case"circle":{if(s.length<2)break;let a=s[0],l=s[s.length-1],d=(a.x+l.x)/2,c=(a.y+l.y)/2,p=Math.abs(l.x-a.x)/2,u=Math.abs(l.y-a.y)/2;e.beginPath(),e.ellipse(d,c,p,u,0,0,Math.PI*2),e.stroke();break}case"text":{if(!i.text||s.length<1)break;let a=s[0],l=i.fontSize||16;e.font=`${l}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`,e.fillStyle=i.color;let c=(i.imageCount&&i.imageCount>0?`[${i.imageCount} image${i.imageCount>1?"s":""}] ${i.text}`:i.text).split(`
3
+ `),p=l*1.2,u=4,g=0;for(let b of c)g=Math.max(g,e.measureText(b).width);e.fillRect(a.x-u,a.y-u,g+u*2,c.length*p+u*2),e.fillStyle="#ffffff",c.forEach((b,x)=>{e.fillText(b,a.x,a.y+l+x*p)});break}}}e.restore()}async function Ar(e,t,n=[],o){var r;try{let i=(r=o==null?void 0:o.dpr)!=null?r:window.devicePixelRatio||1,s=window.innerWidth,a=window.innerHeight,l=n.filter(u=>{var g;return((g=u.status)!=null?g:"pending")==="pending"});console.log("[Screenshot] Starting capture with",l.length,"active annotations (filtered",n.length-l.length,"captured)");let d=Ud(l),c=Jd(l,a);if(c.length===0){let u=await Ga(e,[],window.scrollY,s,a,i,d);return u?[u]:[]}let p=[];for(let u=0;u<c.length;u++){let g=c[u],b=await Ga(e,g.annotations,g.top,s,a,i,d);b?p.push(b):console.warn(`[Screenshot] Region ${u+1} failed to capture`)}return console.log("[Screenshot] Capture complete"),p}catch(i){return console.error("[Screenshot] Capture failed:",i),[]}}async function Ga(e,t,n,o,r,i,s){try{let a=getComputedStyle(document.documentElement).backgroundColor,d=await jd(e,{filter:u=>!(u instanceof HTMLElement&&(u.id==="devtools-canvas"||u.id==="devtools-toolbar"||u.id==="devtools-scrim"||u.dataset.devtools!==void 0)),scale:i,backgroundColor:a&&a!=="rgba(0, 0, 0, 0)"&&a!=="transparent"?a:"#ffffff",width:o,height:r,style:{transform:`translate(${-window.scrollX}px, ${-n}px)`}}),c=document.createElement("canvas");c.width=o*i,c.height=r*i;let p=c.getContext("2d");return p?(p.drawImage(d,0,0,o*i,r*i,0,0,o*i,r*i),Vd(p,t,n,i,s),new Promise(u=>{c.toBlob(g=>u(g),"image/webp",.8)})):null}catch(a){return console.error("Region capture failed:",a),null}}async function Pr(e){if(e.length===0)return null;if(e.length===1)return e[0];let t=await Promise.all(e.map(a=>new Promise((l,d)=>{let c=new Image;c.onload=()=>l(c),c.onerror=d,c.src=URL.createObjectURL(a)}))),n=t[0].width,o=t.reduce((a,l)=>a+l.height,0),r=document.createElement("canvas");r.width=n,r.height=o;let i=r.getContext("2d");if(!i)return null;let s=0;for(let a of t)i.drawImage(a,0,s),s+=a.height,URL.revokeObjectURL(a.src);return new Promise(a=>{r.toBlob(l=>a(l),"image/webp",.8)})}async function ja(e,t,n){try{let o=Array.isArray(e)?e:[e];if(o.length===0)return!1;let r=await Pr(o);if(!r)return!1;let i=r;if(r.type!=="image/png"){let d=new Image,c=URL.createObjectURL(r);await new Promise(u=>{d.onload=()=>u(),d.src=c}),URL.revokeObjectURL(c);let p=document.createElement("canvas");p.width=d.naturalWidth,p.height=d.naturalHeight,p.getContext("2d").drawImage(d,0,0),i=await new Promise(u=>p.toBlob(g=>u(g),"image/png"))}let s={"image/png":i},a=t&&t.length>0,l=n&&n.length>0;if(a||l){let d=t?t.filter(c=>{var p;return((p=c.status)!=null?p:"pending")==="pending"}):[];if(d.length>0||l){let c=Fi(d,n||[]),p=new Blob([JSON.stringify(c,null,2)],{type:"text/plain"});s["text/plain"]=p}}return await navigator.clipboard.write([new ClipboardItem(s)]),!0}catch(o){return console.warn("Clipboard write failed:",o),!1}}import{useCallback as cn,useEffect as xn,useMemo as bi,useRef as Xt,useState as vt}from"react";import{useCallback as pr,useRef as Kd}from"react";function $i(e,t,n,o){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!r||!i)return;let s=(r.x+i.x)/2,a=(r.y+i.y)/2,l=Math.abs(i.x-r.x)/2,d=Math.abs(i.y-r.y)/2;e.beginPath(),e.strokeStyle=n,e.lineWidth=o,e.ellipse(s,a,l,d,0,0,Math.PI*2),e.stroke()}function zi(e,t,n,o){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!(!r||!i)){e.beginPath(),e.strokeStyle=n,e.lineWidth=o,e.lineCap="round",e.lineJoin="round",e.moveTo(r.x,r.y);for(let s=1;s<t.length-1;s++){let a=t[s],l=t[s+1];if(!a||!l)continue;let d=(a.x+l.x)/2,c=(a.y+l.y)/2;e.quadraticCurveTo(a.x,a.y,d,c)}e.lineTo(i.x,i.y),e.stroke()}}function Wi(e,t,n,o){if(t.length<2)return;let r=t[0],i=t[t.length-1];!r||!i||(e.beginPath(),e.strokeStyle=n,e.lineWidth=o,e.lineCap="round",e.moveTo(r.x,r.y),e.lineTo(i.x,i.y),e.stroke())}function Gi(e,t,n,o){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!r||!i)return;let s=Math.min(r.x,i.x),a=Math.min(r.y,i.y),l=Math.abs(i.x-r.x),d=Math.abs(i.y-r.y);e.beginPath(),e.strokeStyle=n,e.lineWidth=o,e.lineCap="round",e.lineJoin="round",e.strokeRect(s,a,l,d)}var Qt='"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';function Xd(e,t,n){if(!t||e.measureText(t).width<=n)return[t];let o=t.split(/\s+/),r=[],i="";for(let s of o){let a=i?i+" "+s:s;i&&e.measureText(a).width>n?(r.push(i),i=s):i=a}return i&&r.push(i),r.length>0?r:[t]}function dr(e){let t=window.innerWidth-e-16;return Math.max(60,Math.min(400,t))}function Ya(e,t,n){let o=[];for(let r of t)o.push(...Xd(e,r,n));return o}function ur(e,t,n){if(e.measureText(t).width<=n)return t;let o="\u2026";for(let r=t.length-1;r>0;r--){let i=t.slice(0,r)+o;if(e.measureText(i).width<=n)return i}return o}function Ja(e,t,n,o,r=12,i,s){if(!n)return;let a=r*1.4,l=n.replace(/\n/g," "),d=i!==void 0?i+". "+l:l;e.font=`${r}px ${Qt}`,e.textBaseline="middle";let c=s!==void 0?Math.min(400,Math.max(60,window.innerWidth-s-16)):400,p=ur(e,d,c),u=e.measureText(p).width;e.fillStyle=o,e.fillRect(t.x-4,t.y-4,u+8,a+8),e.fillStyle="#ffffff",e.fillText(p,t.x,t.y+a/2)}var Ua=11,ji=4,qd=`600 ${Ua}px system-ui, -apple-system, sans-serif`;function Yi(e,t,n){return e.map(o=>({x:o.x-t,y:o.y-n}))}function Zd(e,t,n,o,r,i){let s=String(o);e.font=qd;let l=e.measureText(s).width+ji*2,d=Ua+ji*2,c=t-l/2,p=n+i/2+2;e.fillStyle=r,e.fillRect(c,p,l,d),e.fillStyle="#ffffff",e.textBaseline="middle",e.fillText(s,c+ji,p+d/2)}function Qd(e,t){if(e.points.length<2&&e.type!=="text")return null;switch(e.type){case"rectangle":case"freehand":{let n,o;if(e.type==="freehand")n=Math.min(...e.points.map(r=>r.x)),o=Math.max(...e.points.map(r=>r.y));else{let r=e.points[0],i=e.points[e.points.length-1];n=Math.min(r.x,i.x),o=Math.max(r.y,i.y)}return{x:n,y:o}}case"circle":{let n=e.points[0],o=e.points[e.points.length-1],r=Math.min(n.x,o.x),i=(Math.min(n.y,o.y)+Math.max(n.y,o.y))/2;return{x:r,y:i}}case"line":{let n=e.points[0],o=e.points[e.points.length-1],r=n.y>o.y?n:o;return{x:r.x,y:r.y}}default:return null}}function Va(){let e=Kd(null),t=pr(()=>{let a=e.current;if(!a)return;let l=a.getContext("2d");l&&l.clearRect(0,0,a.width,a.height)},[]),n=pr((a,l,d)=>{var b;let c=e.current;if(!c)return;let p=c.getContext("2d");if(!p)return;let g=((b=a.status)!=null?b:a.captured?"in_flight":"pending")==="pending"||d?a.color:"#999999";switch(a.type){case"freehand":zi(p,a.points,g,a.strokeWidth);break;case"line":Wi(p,a.points,g,a.strokeWidth);break;case"rectangle":Gi(p,a.points,g,a.strokeWidth);break;case"circle":$i(p,a.points,g,a.strokeWidth);break;case"text":a.text&&a.points[0]&&Ja(p,a.points[0],a.text,g,a.fontSize,l,a.points[0].x);break}},[]),o=pr((a,l,d,c)=>{let p=e.current;if(!p||a.length<2)return;let u=p.getContext("2d");if(u)switch(l){case"freehand":zi(u,a,d,c);break;case"line":Wi(u,a,d,c);break;case"rectangle":Gi(u,a,d,c);break;case"circle":$i(u,a,d,c);break}},[]),r=pr((a,l)=>{let d=e.current;if(!d||a.points.length<2)return;let c=d.getContext("2d");if(c){if(c.fillStyle="#ffffff",c.strokeStyle=a.color,c.lineWidth=1.5,a.type==="line"){let p=a.points[0],u=a.points[a.points.length-1];[p,u].forEach(g=>{c.beginPath(),c.arc(g.x,g.y,l/2,0,Math.PI*2),c.fill(),c.stroke()});return}if(a.type==="circle"){let p=a.points[0],u=a.points[a.points.length-1],g=Math.min(p.x,u.x),b=Math.max(p.x,u.x),x=Math.min(p.y,u.y),A=Math.max(p.y,u.y),T=(g+b)/2,z=(x+A)/2;[{x:T,y:x},{x:T,y:A},{x:g,y:z},{x:b,y:z}].forEach(O=>{c.beginPath(),c.rect(O.x-l/2,O.y-l/2,l,l),c.fill(),c.stroke()});return}if(a.type==="rectangle"||a.type==="freehand"){let p,u,g,b;if(a.type==="freehand")p=Math.min(...a.points.map(A=>A.x)),u=Math.max(...a.points.map(A=>A.x)),g=Math.min(...a.points.map(A=>A.y)),b=Math.max(...a.points.map(A=>A.y));else{let A=a.points[0],T=a.points[a.points.length-1];p=Math.min(A.x,T.x),u=Math.max(A.x,T.x),g=Math.min(A.y,T.y),b=Math.max(A.y,T.y)}[{x:p,y:g},{x:u,y:g},{x:p,y:b},{x:u,y:b}].forEach(A=>{c.beginPath(),c.rect(A.x-l/2,A.y-l/2,l,l),c.fill(),c.stroke()})}}},[]),i=pr((a,l,d,c,p,u,g,b=0,x=0,A,T)=>{var z;if(t(),a.forEach(P=>{var re;let O=h(f({},P),{points:Yi(P.points,b,x)}),k=A==null?void 0:A.get(P.id),G=(re=T==null?void 0:T.has(P.id))!=null?re:!1;n(O,k,G)}),l.length>0){let P=Yi(l,b,x);o(P,d,c,p)}if(u&&u.length>0&&g){let P=e.current,O=P==null?void 0:P.getContext("2d");for(let k of u){let G=a.find(re=>re.id===k);if(G){let re=h(f({},G),{points:Yi(G.points,b,x)});if(r(re,g),O&&G.type!=="text"&&A&&!(G.groupId&&a.some(W=>W.groupId===G.groupId&&W.type==="text"))){let W=A.get(G.id);if(W!==void 0){let Q=Qd(re,g);if(Q){let ee=((z=G.status)!=null?z:G.captured?"in_flight":"pending")==="pending"?G.color:"#999999";Zd(O,Q.x,Q.y,W,ee,g)}}}}}}},[t,n,o,r]),s=pr(()=>{let a=e.current;if(!a)return;let l=window.devicePixelRatio||1;a.width=window.innerWidth*l,a.height=window.innerHeight*l;let d=a.getContext("2d");d&&d.scale(l,l)},[]);return{canvasRef:e,clearCanvas:t,drawAnnotation:n,drawCurrentPath:o,redrawAll:i,resizeCanvas:s}}import{useEffect as eu,useRef as tu}from"react";function Xa(){let e=tu({shift:!1,cmd:!1});return eu(()=>{let t=r=>{r.key==="Shift"&&(e.current.shift=!0),(r.key==="Meta"||r.key==="Control")&&(e.current.cmd=!0)},n=r=>{r.key==="Shift"&&(e.current.shift=!1),(r.key==="Meta"||r.key==="Control")&&(e.current.cmd=!1)},o=()=>{e.current={shift:!1,cmd:!1}};return window.addEventListener("keydown",t,!0),window.addEventListener("keyup",n,!0),window.addEventListener("blur",o),()=>{window.removeEventListener("keydown",t,!0),window.removeEventListener("keyup",n,!0),window.removeEventListener("blur",o)}},[]),e}import{useEffect as nu}from"react";function Ka(e,t,n,o,r){nu(()=>{let i=s=>{if(e){if(e.linkedSelector)return;s.preventDefault(),s.stopPropagation();let l=s.deltaY>0?-2:2;t(d=>d?h(f({},d),{fontSize:Math.max(12,Math.min(72,d.fontSize+l))}):null);return}if(!n)return;s.preventDefault();let a=o.find(l=>l.id===n);if(a&&a.type==="text"&&!a.linkedSelector){let l=a.fontSize||12,d=s.deltaY>0?-2:2;r({type:"UPDATE_TEXT_SIZE",payload:{id:n,fontSize:l+d}})}};return window.addEventListener("wheel",i,{passive:!1}),()=>{window.removeEventListener("wheel",i)}},[n,e,o,r,t])}import{useCallback as ul,useEffect as li,useRef as pl,useState as _r}from"react";function qr(e){let t=Object.keys(e).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!t)return null;let n=e[t],o=[];for(;n;){let r=n.type,i=(r==null?void 0:r.displayName)||(r==null?void 0:r.name);i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&o.unshift(i),n=n.return}return o.length>0?{name:o[o.length-1],path:o}:null}function Ji(e){let t=Object.keys(e).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!t)return[];let n=e[t],o=[];for(;n;){let r=n.type,i=typeof r=="function"||typeof r=="object"?(r==null?void 0:r.displayName)||(r==null?void 0:r.name):null;i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&o.push({name:i,fiber:n}),n=n.return}return o.reverse(),o}function Zr(e){let t=e,n=new Set;for(;t&&!n.has(t);){if(n.add(t),t.stateNode instanceof Element)return t.stateNode;t.child?t=t.child:t=null}return null}function qa(e){if(e.id)return`#${e.id}`;let t=e.tagName.toLowerCase(),n=Array.from(e.classList).slice(0,3).join(".");return n?`${t}.${n}`:t}function Hn(e){if(e.id&&!e.id.startsWith("radix-")&&!e.id.startsWith(":"))return`#${CSS.escape(e.id)}`;let t=[],n=e;for(;n&&n!==document.documentElement;){let o=n.tagName.toLowerCase();if(n.id&&!n.id.startsWith("radix-")&&!n.id.startsWith(":")){t.unshift(`#${CSS.escape(n.id)}`);break}let r=Array.from(n.classList).filter(s=>!s.startsWith("_")&&s.length<30).slice(0,2);r.length>0&&(o+="."+r.map(s=>CSS.escape(s)).join("."));let i=n.parentElement;if(i){let s=Array.from(i.children).filter(a=>a.tagName===n.tagName);if(s.length>1){let a=s.indexOf(n)+1;o+=`:nth-of-type(${a})`}}t.unshift(o),n=i}return t.join(" > ")}function In(e){try{return document.querySelector(e)}catch(t){return null}}function Qr(e,t=0){var l;let n=Ji(e);if(n.length===0)return null;let o=n.map(d=>d.name),r=n.length-1,i=Math.max(0,Math.min(n.length-1,r-t)),s=n[i],a=(l=Zr(s.fiber))!=null?l:e;return{name:s.name,path:o,depthIndex:i,rootElement:a}}function Za(e,t){var i,s;let n=Ji(e),o=t.toLowerCase(),r=-1;for(let a=n.length-1;a>=0;a--){let l=n[a].name;if(l===t){let d=(i=Zr(n[a].fiber))!=null?i:e;return{name:t,path:n.map(c=>c.name),depthIndex:a,rootElement:d}}if(r===-1){let d=l.toLowerCase();(d.length>=4&&o.includes(d)||o.length>=4&&d.includes(o))&&(r=a)}}if(r>=0){let a=(s=Zr(n[r].fiber))!=null?s:e;return{name:t,path:n.map(l=>l.name),depthIndex:r,rootElement:a}}return null}function fr(e){let t=gr(),n=[],o=new Set,r=t.currentNode;for(;r=t.nextNode();){let i=Za(r,e);i&&!o.has(i.rootElement)&&(o.add(i.rootElement),n.push(i))}return n}function Ui(e){let t=new Map;if(e.size===0)return t;let n=new Set(e),o=gr(),r=new Set,i=o.currentNode;for(;(i=o.nextNode())&&n.size>0;)for(let s of n){let a=Za(i,s);if(!a||r.has(a.rootElement))continue;r.add(a.rootElement);let l=a.rootElement.getBoundingClientRect();t.set(s,l.top+window.scrollY),n.delete(s);break}for(let s of n)t.set(s,1/0);return t}function gr(){return document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT,{acceptNode(e){return e.closest("#devtools-toolbar, #devtools-canvas, #devtools-scrim, [data-popmelt-panel]")?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}})}function Ln(e){let t={selector:qa(e),tagName:e.tagName.toLowerCase()};e.id&&(t.id=e.id),e.classList.length>0&&(t.className=Array.from(e.classList).join(" "));let n=Qa(e);n&&n.length>0&&n.length<200&&(t.textContent=n);let o={};for(let s of e.attributes)s.name.startsWith("data-")&&(o[s.name]=s.value);Object.keys(o).length>0&&(t.dataAttributes=o);let r=qr(e);r&&(t.reactComponent=r.name);let i=ou(e);return i&&(t.context=i),t}function Qa(e){let t="";for(let n of e.childNodes)n.nodeType===Node.TEXT_NODE&&(t+=n.textContent||"");return t.trim()}function Go(e,t){let n=document.elementsFromPoint(e,t);for(let o of n)if(o instanceof HTMLElement&&!(o.id==="devtools-canvas"||o.id==="devtools-toolbar"||o.id==="devtools-scrim")&&!o.closest("#devtools-toolbar")&&!(o.dataset.devtools||o.closest("[data-devtools]"))&&!["html","body"].includes(o.tagName.toLowerCase()))return o;return null}function ou(e){let t=e.parentElement,n=["section","article","nav","aside","header","footer","main"];for(;t&&t!==document.body;){let o=t.tagName.toLowerCase();if(n.includes(o)&&t.id)return`${o}#${t.id}`;if(t.id&&!t.id.startsWith("radix-")&&!t.id.startsWith(":"))return`${o}#${t.id}`;t=t.parentElement}return null}function el(e){let t=new Set,n=[],o=window.scrollX,r=window.scrollY,i=[{x:(e.minX+e.maxX)/2,y:(e.minY+e.maxY)/2},{x:e.minX,y:e.minY},{x:e.maxX,y:e.minY},{x:e.minX,y:e.maxY},{x:e.maxX,y:e.maxY}];for(let s of i){let a=s.x-o,l=s.y-r;if(a<0||l<0||a>window.innerWidth||l>window.innerHeight)continue;let d=Go(a,l);d&&!t.has(d)&&(t.add(d),n.push(Ln(d)))}return n.slice(0,3)}function Vi(e){if(e.length===0)return[];let t=e.map(o=>o.x),n=e.map(o=>o.y);return el({minX:Math.min(...t),minY:Math.min(...n),maxX:Math.max(...t),maxY:Math.max(...n)})}function ln(e,t){return e.style.getPropertyValue(t)!==""}function ru(e,t=30){if(e<=0)return[];let n=[],o=gr(),r=.5,i=o.currentNode;for(;(i=o.nextNode())&&n.length<t;){let s=i,a=s.getBoundingClientRect();if(a.bottom<-50||a.top>window.innerHeight+50||a.right<-50||a.left>window.innerWidth+50||a.width<1||a.height<1)continue;let l=getComputedStyle(s);!ln(s,"padding-top")&&Math.abs((parseFloat(l.paddingTop)||0)-e)<r&&n.push({element:s,property:"padding-top"}),!ln(s,"padding-bottom")&&Math.abs((parseFloat(l.paddingBottom)||0)-e)<r&&n.length<t&&n.push({element:s,property:"padding-bottom"}),!ln(s,"padding-left")&&Math.abs((parseFloat(l.paddingLeft)||0)-e)<r&&n.length<t&&n.push({element:s,property:"padding-left"}),!ln(s,"padding-right")&&Math.abs((parseFloat(l.paddingRight)||0)-e)<r&&n.length<t&&n.push({element:s,property:"padding-right"}),!ln(s,"margin-top")&&Math.abs((parseFloat(l.marginTop)||0)-e)<r&&n.length<t&&n.push({element:s,property:"margin-top"}),!ln(s,"margin-bottom")&&Math.abs((parseFloat(l.marginBottom)||0)-e)<r&&n.length<t&&n.push({element:s,property:"margin-bottom"}),!ln(s,"margin-left")&&Math.abs((parseFloat(l.marginLeft)||0)-e)<r&&n.length<t&&n.push({element:s,property:"margin-left"}),!ln(s,"margin-right")&&Math.abs((parseFloat(l.marginRight)||0)-e)<r&&n.length<t&&n.push({element:s,property:"margin-right"});let d=l.display;if((d.includes("flex")||d.includes("grid"))&&n.length<t){let c=ln(s,"gap"),p=parseFloat(l.gap)||0,u=parseFloat(l.rowGap)||0,g=parseFloat(l.columnGap)||0;!c&&Math.abs(p-e)<r?n.push({element:s,property:"gap"}):!ln(s,"row-gap")&&Math.abs(u-e)<r?n.push({element:s,property:"row-gap"}):!ln(s,"column-gap")&&Math.abs(g-e)<r&&n.push({element:s,property:"column-gap"})}}return n}function Xi(e,t=30){if(e<=0)return[];let n=[],o=gr(),r=.5,i=o.currentNode;for(;(i=o.nextNode())&&n.length<t;){let s=i,a=s.getBoundingClientRect();if(a.bottom<-50||a.top>window.innerHeight+50||a.right<-50||a.left>window.innerWidth+50||a.width<1||a.height<1)continue;let l=getComputedStyle(s),d=parseFloat(l.borderTopWidth)||0,c=parseFloat(l.borderRightWidth)||0,p=parseFloat(l.borderBottomWidth)||0,u=parseFloat(l.borderLeftWidth)||0,g=s.clientWidth,b=s.clientHeight,x=parseFloat(l.paddingTop)||0;!ln(s,"padding-top")&&Math.abs(x-e)<r&&n.push({x:a.left+u,y:a.top+d,width:g,height:e,direction:"vertical",property:"padding-top"});let A=parseFloat(l.paddingBottom)||0;!ln(s,"padding-bottom")&&Math.abs(A-e)<r&&n.length<t&&n.push({x:a.left+u,y:a.top+d+b-e,width:g,height:e,direction:"vertical",property:"padding-bottom"});let T=parseFloat(l.paddingLeft)||0;!ln(s,"padding-left")&&Math.abs(T-e)<r&&n.length<t&&n.push({x:a.left+u,y:a.top+d,width:e,height:b,direction:"horizontal",property:"padding-left"});let z=parseFloat(l.paddingRight)||0;!ln(s,"padding-right")&&Math.abs(z-e)<r&&n.length<t&&n.push({x:a.left+u+g-e,y:a.top+d,width:e,height:b,direction:"horizontal",property:"padding-right"});let P=parseFloat(l.marginTop)||0;!ln(s,"margin-top")&&Math.abs(P-e)<r&&n.length<t&&n.push({x:a.left,y:a.top-e,width:a.width,height:e,direction:"vertical",property:"margin-top"});let O=parseFloat(l.marginBottom)||0;!ln(s,"margin-bottom")&&Math.abs(O-e)<r&&n.length<t&&n.push({x:a.left,y:a.bottom,width:a.width,height:e,direction:"vertical",property:"margin-bottom"});let k=parseFloat(l.marginLeft)||0;!ln(s,"margin-left")&&Math.abs(k-e)<r&&n.length<t&&n.push({x:a.left-e,y:a.top,width:e,height:a.height,direction:"horizontal",property:"margin-left"});let G=parseFloat(l.marginRight)||0;!ln(s,"margin-right")&&Math.abs(G-e)<r&&n.length<t&&n.push({x:a.right,y:a.top,width:e,height:a.height,direction:"horizontal",property:"margin-right"});let re=l.display;if((re.includes("flex")||re.includes("grid"))&&n.length<t&&!ln(s,"gap")){let W=Array.from(s.children).filter(Q=>{let N=getComputedStyle(Q);return N.display!=="none"&&N.position!=="absolute"&&N.position!=="fixed"});if(W.length>=2)for(let Q=0;Q<W.length-1&&n.length<t;Q++){let N=W[Q].getBoundingClientRect(),ee=W[Q+1].getBoundingClientRect(),M=ee.top-N.bottom;Math.abs(M-e)<r&&M>.5&&n.push({x:Math.min(N.left,ee.left),y:N.bottom,width:Math.max(N.right,ee.right)-Math.min(N.left,ee.left),height:M,direction:"vertical",property:"gap"});let Le=ee.left-N.right;Math.abs(Le-e)<r&&Le>.5&&n.push({x:N.right,y:Math.min(N.top,ee.top),width:Le,height:Math.max(N.bottom,ee.bottom)-Math.min(N.top,ee.top),direction:"horizontal",property:"gap"})}}}return n}function ei(e){return typeof e=="string"?{value:e}:e}var nl={gap:["gap","row-gap","column-gap"],padding:["padding-top","padding-bottom","padding-left","padding-right"],margin:["margin-top","margin-bottom","margin-left","margin-right"]};function tl(e,t){let n=nl[t];return n?n.includes(e):!1}function iu(e,t){let n=e.split(/\s+/);for(let o of n){if(o===t)return!0;let r=o.lastIndexOf(":");if(r>=0&&o.slice(r+1)===t)return!0}return!1}function su(e){var a,l;let t=e.lastIndexOf(":"),n=t>=0?e.slice(t+1):e,o=n.indexOf("-");if(o<0)return null;let r=n.slice(0,o),i={gap:"gap","gap-x":"column-gap","gap-y":"row-gap",p:"padding",pt:"padding-top",pb:"padding-bottom",pl:"padding-left",pr:"padding-right",px:"padding-left",py:"padding-top",m:"margin",mt:"margin-top",mb:"margin-bottom",ml:"margin-left",mr:"margin-right",mx:"margin-left",my:"margin-top"},s=n.slice(0,n.indexOf("-",o+1)>0?n.indexOf("-",o+1):o);return(l=(a=i[s])!=null?a:i[r])!=null?l:null}function Ki(e,t=30){let n=parseFloat(e.value);if(isNaN(n)||n<=0)return[];if(e.bindings&&e.bindings.length>0){let r=[],i=gr(),s=i.currentNode;for(;(s=i.nextNode())&&r.length<t;){let a=s,l=a.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let d=a.className;if(typeof d=="string")for(let c of e.bindings){if(!iu(d,c))continue;let p=su(c);if(p&&!(e.property&&!tl(p,e.property))){r.push({element:a,property:p});break}}}return r}let o=ru(n,t*2);return e.property?o.filter(r=>tl(r.property,e.property)).slice(0,t):o.slice(0,t)}function qi(e,t=30){let n=Ki(e,t),o=[];for(let r of n){let i=r.element,s=i.getBoundingClientRect(),a=getComputedStyle(i),l=parseFloat(a.borderTopWidth)||0,d=parseFloat(a.borderRightWidth)||0,c=parseFloat(a.borderLeftWidth)||0,p=i.clientWidth,u=i.clientHeight;switch(r.property){case"padding-top":{let g=parseFloat(a.paddingTop)||0;o.push({x:s.left+c,y:s.top+l,width:p,height:g,direction:"vertical",property:r.property});break}case"padding-bottom":{let g=parseFloat(a.paddingBottom)||0;o.push({x:s.left+c,y:s.top+l+u-g,width:p,height:g,direction:"vertical",property:r.property});break}case"padding-left":{let g=parseFloat(a.paddingLeft)||0;o.push({x:s.left+c,y:s.top+l,width:g,height:u,direction:"horizontal",property:r.property});break}case"padding-right":{let g=parseFloat(a.paddingRight)||0;o.push({x:s.left+c+p-g,y:s.top+l,width:g,height:u,direction:"horizontal",property:r.property});break}case"margin-top":{let g=parseFloat(a.marginTop)||0;o.push({x:s.left,y:s.top-g,width:s.width,height:g,direction:"vertical",property:r.property});break}case"margin-bottom":{let g=parseFloat(a.marginBottom)||0;o.push({x:s.left,y:s.bottom,width:s.width,height:g,direction:"vertical",property:r.property});break}case"margin-left":{let g=parseFloat(a.marginLeft)||0;o.push({x:s.left-g,y:s.top,width:g,height:s.height,direction:"horizontal",property:r.property});break}case"margin-right":{let g=parseFloat(a.marginRight)||0;o.push({x:s.right,y:s.top,width:g,height:s.height,direction:"horizontal",property:r.property});break}case"gap":case"row-gap":case"column-gap":{let g=Array.from(i.children).filter(b=>{let x=getComputedStyle(b);return x.display!=="none"&&x.position!=="absolute"&&x.position!=="fixed"});for(let b=0;b<g.length-1&&o.length<t;b++){let x=g[b].getBoundingClientRect(),A=g[b+1].getBoundingClientRect(),T=A.top-x.bottom;T>.5&&o.push({x:Math.min(x.left,A.left),y:x.bottom,width:Math.max(x.right,A.right)-Math.min(x.left,A.left),height:T,direction:"vertical",property:"gap"});let z=A.left-x.right;z>.5&&o.push({x:x.right,y:Math.min(x.top,A.top),width:z,height:Math.max(x.bottom,A.bottom)-Math.min(x.top,A.top),direction:"horizontal",property:"gap"})}break}}}return o}function ol(e,t){let n=new Set,o=Or(t);for(let r of e){let i=il[r.property];if(!i)continue;let s=r.element.className;if(typeof s=="string")for(let a of i){let l=`${a}-${o}`;for(let d of s.split(/\s+/)){let c=d.lastIndexOf(":"),p=c>=0?d.slice(c+1):d;if(p===l){n.add(p);break}}}}return[...n]}function rl(e){let t=new Set;for(let n of e)for(let[o,r]of Object.entries(nl))if(r.includes(n.property)){t.add(o);break}if(t.size===1)return[...t][0]}function Zi(e,t,n){if(t===n)return e;let o=Or(t),r=Or(n);return e.map(i=>{let s=i.lastIndexOf("-");if(s<0)return i;let a=i.slice(0,s),l=i.slice(s+1);return l===o||l===`[${t}px]`?`${a}-${r}`:i})}var au={0:"0",1:"px",2:"0.5",4:"1",6:"1.5",8:"2",12:"3",16:"4",20:"5",24:"6",28:"7",32:"8",40:"10",48:"12",64:"16",80:"20",96:"24"};function Or(e){var t;return(t=au[e])!=null?t:`[${e}px]`}var il={"padding-top":["pt","py","p"],"padding-bottom":["pb","py","p"],"padding-left":["pl","px","p"],"padding-right":["pr","px","p"],"margin-top":["mt","my","m"],"margin-bottom":["mb","my","m"],"margin-left":["ml","mx","m"],"margin-right":["mr","mx","m"],gap:["gap"],"row-gap":["gap-y","gap"],"column-gap":["gap-x","gap"]};function lu(e,t,n,o){let r=il[t];if(!r)return null;let i=Or(n);for(let s of r){let a=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+s+"-(?:"+cu(i)+"|\\["+n+"px\\]))(?:\\s|$)"),l=e.match(a);if(l!=null&&l[1]){let d=Or(o),c=l[1].lastIndexOf(":"),p=c>=0?l[1].slice(0,c+1):"";return{matched:l[1],suggested:`${p}${s}-${d}`}}}return null}function cu(e){return e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function sl(e,t,n){let o=new Set,r=[];for(let i of e){let s=Hn(i.element),a=`${s}::${i.property}`;if(o.has(a))continue;o.add(a);let l=qr(i.element),d=i.element.className||"",c=lu(d,i.property,t,n);r.push({selector:s,reactComponent:l==null?void 0:l.name,className:d,property:i.property,matchedClass:c==null?void 0:c.matched,suggestedClass:c==null?void 0:c.suggested})}return r}function ti(e,t){return window.getComputedStyle(e).getPropertyValue(t)}function ni(e,t){if(e instanceof HTMLElement){let o=e.style.getPropertyValue(t);if(o)return o}let n=t.replace(/-([a-z])/g,(o,r)=>r.toUpperCase());try{for(let o of document.styleSheets)try{let r=o.cssRules||o.rules;for(let i of r)if(i instanceof CSSStyleRule&&e.matches(i.selectorText)){let s=i.style.getPropertyValue(t);if(s)return s;let a=i.style[n];if(a)return a}}catch(r){}}catch(o){}return null}function oi(e){let t=window.getComputedStyle(e).display;return t==="flex"||t==="inline-flex"||t==="grid"||t==="inline-grid"}function jo(e){let t=window.getComputedStyle(e);return{row:parseFloat(t.rowGap)||0,column:parseFloat(t.columnGap)||0}}function du(e){let t=[];for(let n of e){let o=t.find(r=>r.axis!==n.axis?!1:n.axis==="row"?Math.abs(r.y-n.y)<2&&Math.abs(r.h-n.h)<2:Math.abs(r.x-n.x)<2&&Math.abs(r.w-n.w)<2);if(o)if(n.axis==="row"){let r=Math.min(o.x,n.x),i=Math.max(o.x+o.w,n.x+n.w);o.x=r,o.w=i-r}else{let r=Math.min(o.y,n.y),i=Math.max(o.y+o.h,n.y+n.h);o.y=r,o.h=i-r}else t.push(f({},n))}return t}function yo(e){let t=Array.from(e.children).filter(l=>{if(!(l instanceof HTMLElement))return!1;let d=window.getComputedStyle(l);return d.display!=="none"&&d.position!=="absolute"&&d.position!=="fixed"});if(t.length<2)return[];let n=[],o=e.getBoundingClientRect(),i=window.getComputedStyle(e).flexDirection,s=i==="column"||i==="column-reverse",a=6;for(let l=0;l<t.length-1;l++){let d=t[l].getBoundingClientRect(),c=t[l+1].getBoundingClientRect();if(c.left>d.right+.5&&n.push({axis:"column",x:d.right,y:o.top,w:c.left-d.right,h:o.height}),c.top>d.bottom+.5&&n.push({axis:"row",x:o.left,y:d.bottom,w:o.width,h:c.top-d.bottom}),!(c.left>d.right+.5)&&!(c.top>d.bottom+.5))if(s){let p=(d.bottom+c.top)/2;n.push({axis:"row",x:o.left,y:p-a/2,w:o.width,h:a})}else{let p=(d.right+c.left)/2;n.push({axis:"column",x:p-a/2,y:o.top,w:a,h:o.height})}}return du(n)}function Qi(e,t){let n=window.getComputedStyle(e),o=n.display;if(o!=="flex"&&o!=="inline-flex")return!1;let r=n.justifyContent;if(r!=="space-between"&&r!=="space-around"&&r!=="space-evenly"&&r!=="stretch")return!1;let i=n.flexDirection;return!(t!==(i==="column"||i==="column-reverse"?"row":"column")||parseFloat(t==="row"?n.rowGap:n.columnGap)>0)}function mr(e){let t=window.getComputedStyle(e);return{top:parseFloat(t.paddingTop)||0,right:parseFloat(t.paddingRight)||0,bottom:parseFloat(t.paddingBottom)||0,left:parseFloat(t.paddingLeft)||0}}function Yo(e){let t=window.getComputedStyle(e);return{"top-left":parseFloat(t.borderTopLeftRadius)||0,"top-right":parseFloat(t.borderTopRightRadius)||0,"bottom-right":parseFloat(t.borderBottomRightRadius)||0,"bottom-left":parseFloat(t.borderBottomLeftRadius)||0}}function es(e){for(let t of e.childNodes)if(t.nodeType===Node.TEXT_NODE&&(t.textContent||"").trim().length>0)return!0;return!1}function hr(e){var c,p;let t=document.createRange(),n=!1;for(let u of e.childNodes)u.nodeType===Node.TEXT_NODE&&(u.textContent||"").trim().length>0&&(n||(t.setStart(u,0),n=!0),t.setEnd(u,(p=(c=u.textContent)==null?void 0:c.length)!=null?p:0));if(!n)return null;let o=t.getBoundingClientRect(),r=window.getComputedStyle(e),i=parseFloat(r.fontSize)||16,s=parseFloat(r.lineHeight);isNaN(s)&&(s=i*1.2);let a=Math.max(1,t.getClientRects().length),l=Math.max(o.height,a*s),d=(l-o.height)/2;return new DOMRect(o.x,o.y-d,o.width,l)}function Br(e){let t=window.getComputedStyle(e),n=parseFloat(t.fontSize)||16,o=parseFloat(t.lineHeight);return isNaN(o)&&(o=n*1.2),{fontSize:n,lineHeight:o}}function Qe(e,t,n){e instanceof HTMLElement&&e.style.setProperty(t,n,"important")}function al(e,t,n){e instanceof HTMLElement&&e.style.removeProperty(t)}function ri(e){var t;for(let n of e){let o=In(n.selector);if(!o&&n.durableSelector&&(o=In(n.durableSelector),o)){let r=(t=n.selector.match(/\[data-pm="([^"]+)"\]/))==null?void 0:t[1];r&&o.setAttribute("data-pm",r)}if(o)for(let r of n.changes)Qe(o,r.property,r.modified)}}function ii(e){for(let t of e){let n=In(t.selector);if(n)for(let o of t.changes)al(n,o.property,o.original)}}function cl(e,t,n,o){if(e)for(let r of e){if(r instanceof CSSGroupingRule){cl(r.cssRules,t,n,o);continue}if(r instanceof CSSStyleRule){let i=r.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&uu(r.style,t,n,o)}}}function uu(e,t,n,o){for(let r=0;r<e.length;r++){let i=e[r];if(i!=null&&i.startsWith("--")){if(n.has(i))continue;n.add(i);let s=t.getPropertyValue(i).trim();dl(s)&&o.push({name:i,value:s,usage:`var(${i})`})}}}var si=null,pu=5e3;function ts(){if(si&&Date.now()-si.timestamp<pu)return si.variables;let e=[],t=new Set,n=getComputedStyle(document.documentElement);try{for(let i of document.styleSheets)try{cl(i.cssRules||i.rules,n,t,e)}catch(s){}}catch(i){}let o=document.documentElement.style;for(let i=0;i<o.length;i++){let s=o[i];if(s!=null&&s.startsWith("--")&&!t.has(s)){t.add(s);let a=n.getPropertyValue(s).trim();dl(a)&&e.push({name:s,value:a,usage:`var(${s})`})}}let r=e.sort((i,s)=>i.name.localeCompare(s.name));return si={variables:r,timestamp:Date.now()},r}function dl(e){if(!e)return!1;let t=e.toLowerCase().trim();return!!(/^#([0-9a-f]{3}|[0-9a-f]{4}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)||t.startsWith("rgb")||t.startsWith("hsl")||t.startsWith("oklch")||t.startsWith("oklab")||t.startsWith("lch")||t.startsWith("lab")||["transparent","currentcolor","inherit","white","black","red","green","blue","yellow","orange","purple","pink","gray","grey"].includes(t))}function yr(e,t){let n=t.match(/var\((--[^,)]+)(?:,\s*([^)]+))?\)/);if(n){let o=n[1],r=n[2];return getComputedStyle(document.documentElement).getPropertyValue(o).trim()||r||t}return t}function Dr(e,t){if(!e)return null;let n=ll(e);if(!n)return null;for(let o of t){let r=ll(o.value);if(r&&n===r)return o}return null}function ll(e){if(!e)return null;let t=e.trim().toLowerCase();if(t.startsWith("oklch(")){let n=t.match(/oklch\(\s*([\d.]+%?)\s+([\d.]+%?)\s+([\d.]+)/);if(n){let o=n[1].endsWith("%")?parseFloat(n[1])/100:parseFloat(n[1]),r=n[2].endsWith("%")?parseFloat(n[2])/100:parseFloat(n[2]),i=parseFloat(n[3]);o=Math.round(o*100)/100,r=Math.round(r*1e3)/1e3;let s=Math.round(i);return`oklch(${o} ${r} ${s})`}}if(t.startsWith("rgb")){let n=t.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(n)return`rgb(${n[1]},${n[2]},${n[3]})`}return t.startsWith("#")?t.length===4?`#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}`:t.slice(0,7):t}import{Fragment as Jo,jsx as yt,jsxs as to}from"react/jsx-runtime";var Jn=22,ko=12,fu=3,gu=250,ai=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],mu=3e3;function hu(s){var a=s,{left:e,top:t,avoidBottom:n,style:o,children:r}=a,i=jn(a,["left","top","avoidBottom","style","children"]);let l=e+ko,d=t+ko,c=n!==void 0?`${n}px`:"100vh";return yt("div",h(f({"data-devtools":"badge-hit-area"},i),{style:f({position:"fixed",left:e,top:t,padding:ko},o),children:yt("div",{style:{transform:`translate(min(0px, calc(100vw - ${l}px - 100%)), min(0px, calc(${c} - ${d}px - 100%)))`},children:r})}))}function fl({annotations:e,supersededAnnotations:t,inFlightIds:n,activeIds:o,queuePositions:r,scrollX:i,scrollY:s,annotationGroupMap:a,onViewThread:l,onSelectAnnotation:d,onHoverAnnotation:c,canvasRef:p}){var oe,W,Q,N,ee,M,Le;let[u,g]=_r(0),[b,x]=_r(()=>Math.floor(Math.random()*ai.length)),A=!!(n&&n.size>0);li(()=>{if(!A)return;let V=setInterval(()=>{g(D=>(D+1)%fu)},gu),fe=setInterval(()=>{x(D=>(D+1)%ai.length)},mu);return()=>{clearInterval(V),clearInterval(fe)}},[A]);let T=[];for(let V of e){if(V.type!=="text"||!V.text||!V.points[0]||t.has(V))continue;let fe=V.groupId?e.filter(he=>he.groupId===V.groupId):[V],D=(oe=V.status)!=null?oe:"pending",ae=fe.reduce((he,te)=>{var ie;return he+((ie=te.replyCount)!=null?ie:0)},0),I=he=>he==="resolved"&&ae===0,pe=!!(n&&(n.has(V.id)||fe.some(he=>n.has(he.id))))||V.status==="in_flight"||fe.some(he=>he.status==="in_flight")||I(V.status)||fe.some(he=>I(he.status)),me=fe.some(he=>{var te;return he.status==="resolved"&&((te=he.replyCount)!=null?te:0)>0||he.status==="needs_review"}),Fe=fe.some(he=>he.threadId);if(!pe&&D!=="resolved"&&D!=="needs_review"&&!me&&!Fe)continue;let we=V.threadId||((W=fe.find(he=>he.threadId))==null?void 0:W.threadId),Je=D==="needs_review"||fe.some(he=>he.status==="needs_review"),Re=V.points[0],Ce=V.fontSize||12,at=Ce*1.4,gt=a.get(V.id),bt=V.text.replace(/\n/g," "),Yt=gt!==void 0?gt+". "+bt:bt,K=(N=(Q=p==null?void 0:p.current)==null?void 0:Q.getContext("2d"))!=null?N:document.createElement("canvas").getContext("2d");if(!K)continue;K.font=`${Ce}px ${Qt}`;let X=Re.x-i,Te=dr(X),Oe=ur(K,Yt,Te),Xe=K.measureText(Oe).width,Pe=pe&&!!o&&!o.has(V.id)&&!fe.some(he=>o.has(he.id));T.push({id:V.id,threadId:we,linkedSelector:V.linkedSelector||((ee=fe.find(he=>he.linkedSelector))==null?void 0:ee.linkedSelector),x:Re.x+Xe+4,y:Re.y-4,size:at+8,color:V.color,isInFlight:pe,isQueued:Pe,queuePosition:void 0,isNeedsReview:Je,replyCount:ae})}let z=T.filter(V=>V.isQueued);if(z.length>0&&z.forEach((V,fe)=>{var D;V.queuePosition=(D=r==null?void 0:r.get(V.id))!=null?D:`(${fe+1}/${z.length})`}),T.length===0)return null;let P=2,O=(Le=(M=p==null?void 0:p.current)==null?void 0:M.getContext("2d"))!=null?Le:document.createElement("canvas").getContext("2d"),k=T.map(V=>{var me;let fe;V.isQueued?fe=V.queuePosition?`queued ${V.queuePosition}`:"queued":V.isInFlight?fe=(me=ai[b])!=null?me:"thinking":V.replyCount>0?fe=`${V.replyCount} ${V.replyCount===1?"reply":"replies"}`:fe="Cancelled";let D=!V.isQueued,ae=D?11:0,I=D?4:0,pe=fe.length*7.2;return O&&(O.font=`12px ${Qt}`,pe=O.measureText(fe).width),4+ae+I+pe+4}),G=typeof window!="undefined"?window.innerHeight:9999,re=[];for(let V=0;V<T.length;V++){let fe=T[V].y-s,D=Math.min(fe,G-Jn),ae=D+Jn,pe=T[V].x-i;for(let me=0;me<V;me++){let Fe=T[me].y-s,we=Math.min(Fe,G-Jn),Je=we+Jn;if(!(D<Je&&ae>we))continue;let Ce=re[me]+k[me];pe<Ce+P&&(pe=Ce+P)}re.push(pe)}return yt(Jo,{children:T.map((V,fe)=>{let D=!!V.threadId;return yt(hu,{left:re[fe]-ko,top:V.y-s-ko,onMouseDown:D?ae=>ae.stopPropagation():void 0,onClick:D?ae=>{if(ae.stopPropagation(),d==null||d(V.id),l==null||l(V.threadId),V.linkedSelector)try{let I=document.querySelector(V.linkedSelector);if(I){let pe=I.getBoundingClientRect();(pe.bottom<0||pe.top>window.innerHeight)&&I.scrollIntoView({behavior:"smooth",block:"center"})}}catch(I){}}:void 0,onMouseEnter:c?()=>c(V.id):void 0,onMouseLeave:c?()=>c(null):void 0,style:{pointerEvents:D?"auto":"none",cursor:D?"pointer":void 0,zIndex:9999},children:yt("div",{"data-devtools":"annotation-badge",style:{height:V.size,display:"flex",alignItems:"center",backgroundColor:V.color,fontFamily:Qt,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:V.isQueued?to("span",{style:{opacity:.5,color:"inherit"},children:["queued",V.queuePosition?` ${V.queuePosition}`:""]}):V.isInFlight?to(Jo,{children:[yt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:u===1?to(Jo,{children:[yt("circle",{cx:"7",cy:"7",r:"2"}),yt("circle",{cx:"17",cy:"7",r:"2"}),yt("circle",{cx:"7",cy:"17",r:"2"}),yt("circle",{cx:"17",cy:"17",r:"2"})]}):to(Jo,{children:[yt("circle",{cx:"12",cy:"6",r:"2"}),yt("circle",{cx:"6",cy:"12",r:"2"}),yt("circle",{cx:"18",cy:"12",r:"2"}),yt("circle",{cx:"12",cy:"18",r:"2"})]})}),yt("span",{style:{opacity:.7,color:"inherit"},children:ai[b]})]}):to(Jo,{children:[V.isNeedsReview?yt("span",{style:{fontWeight:700,color:"inherit"},children:"?"}):yt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:yt("polyline",{points:"4 12 10 18 20 6"})}),yt("span",{style:{opacity:.7,color:"inherit"},children:V.replyCount>0?`${V.replyCount} ${V.replyCount===1?"reply":"replies"}`:"Cancelled"})]})})},V.id)})})}function ns({inFlightSelectorColors:e,animated:t=!0}){let[n,o]=_r([]);return li(()=>{if(e.size===0){o([]);return}let r=null,i=()=>{let l=[];for(let[d,c]of e){let p=In(d);if(!p)continue;let u=p.getBoundingClientRect();l.push({selector:d,top:u.top,left:u.left,width:u.width,height:u.height,color:c})}o(l)},s=()=>{r&&cancelAnimationFrame(r),r=requestAnimationFrame(i)};i(),window.addEventListener("scroll",s,!0),window.addEventListener("resize",s,!0);let a=new MutationObserver(s);return a.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",s,!0),window.removeEventListener("resize",s,!0),a.disconnect(),r&&cancelAnimationFrame(r)}},[e]),n.length===0?null:to(Jo,{children:[t&&yt("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),n.map(r=>yt("div",{"data-devtools":"marching-ants",style:{position:"fixed",top:r.top,left:r.left,width:r.width,height:r.height,pointerEvents:"none",zIndex:9995,overflow:"visible"},children:yt("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible"},children:yt("rect",{x:"0.5",y:"0.5",width:Math.max(0,r.width-1),height:Math.max(0,r.height-1),fill:"none",stroke:r.color,strokeWidth:"1",strokeDasharray:"2 4",style:t?{animation:"popmelt-march 0.5s steps(2) infinite"}:void 0})})},r.selector))]})}function gl({annotations:e,supersededAnnotations:t,scrollX:n,scrollY:o,onReply:r,annotationGroupMap:i,canvasRef:s,onHoverAnnotation:a}){let l=e.filter(p=>t.has(p)?!1:p.status==="waiting_input"&&p.question&&p.threadId);if(l.length===0)return null;let d=new Set,c=[];for(let p of l){if(!p.threadId||d.has(p.threadId))continue;d.add(p.threadId);let u=p.type==="text"?p:e.find(g=>g.groupId&&g.groupId===p.groupId&&g.type==="text")||p;if(u.type==="text"&&u.text&&u.points[0]){let g=u.points[0],b=u.fontSize||12,x=b*1.4,A=i.get(u.id),T=u.text.replace(/\n/g," "),z=A!==void 0?A+". "+T:T,O=document.createElement("canvas").getContext("2d");if(!O)continue;O.font=`${b}px ${Qt}`;let k=g.x-n,G=dr(k),re=ur(O,z,G),oe=O.measureText(re).width;c.push({annotation:p,x:g.x+oe+4,y:g.y-4,size:x+8})}}return c.length===0?null:yt(Jo,{children:c.map(({annotation:p,x:u,y:g,size:b})=>yt(yu,{annotation:p,x:u-n,y:g-o,size:b,onReply:r,onHoverAnnotation:a},`question-${p.threadId}`))})}function yu({annotation:e,x:t,y:n,size:o,onReply:r,onHoverAnnotation:i}){let[s,a]=_r(!1),[l,d]=_r(""),c=pl(null),p=pl(null);li(()=>{s&&c.current&&c.current.focus()},[s]),li(()=>{if(!s)return;let A=z=>{p.current&&!z.composedPath().includes(p.current)&&a(!1)},T=z=>{z.key==="Escape"&&a(!1)};return document.addEventListener("mousedown",A),document.addEventListener("keydown",T),()=>{document.removeEventListener("mousedown",A),document.removeEventListener("keydown",T)}},[s]);let u=ul(()=>{!l.trim()||!e.threadId||(r(e.threadId,l.trim()),d(""),a(!1))},[l,e.threadId,r]),g=ul(A=>{A.key==="Enter"&&(A.metaKey||A.ctrlKey)&&(A.preventDefault(),u())},[u]),b=s?t:t-ko,x=s?n:n-ko;return to("div",{ref:p,"data-devtools":"question-badge",onMouseEnter:i?()=>i(e.id):void 0,onMouseLeave:i?()=>i(null):void 0,style:{position:"fixed",left:`max(0px, ${b}px)`,top:`max(0px, ${x}px)`,padding:s?0:ko,transform:`translate(min(0px, calc(100vw - max(0px, ${b}px) - 100%)), min(0px, calc(100vh - max(0px, ${x}px) - 100%)))`,zIndex:s?10002:9999,pointerEvents:"auto",cursor:s?void 0:"pointer"},children:[!s&&to("div",{onClick:()=>a(!0),style:{height:o,display:"flex",alignItems:"center",backgroundColor:e.color,padding:`0 ${4}px`,gap:4,fontFamily:Qt,fontSize:12,color:"#ffffff",whiteSpace:"nowrap"},children:[to("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[yt("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),yt("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),yt("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),yt("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),yt("span",{style:{opacity:.7},children:"reply?"})]}),s&&to("div",{style:{minWidth:260,maxWidth:360,backgroundColor:"#eaeaea",fontFamily:Qt,fontSize:12,color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)"},children:[yt("div",{style:{padding:`${6}px ${8}px`,lineHeight:1.4},children:e.question}),to("div",{style:{padding:`0 ${4}px ${4}px`},children:[yt("textarea",{ref:c,value:l,onChange:A=>d(A.target.value),onKeyDown:g,placeholder:"Type your reply...",style:{width:"100%",minHeight:40,padding:4,fontSize:12,fontFamily:Qt,backgroundColor:"rgba(0, 0, 0, 0.04)",color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)",borderRadius:0,outline:"none",resize:"vertical",lineHeight:1.4,boxSizing:"border-box"}}),yt("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:4},children:yt("button",{onClick:u,disabled:!l.trim(),style:{padding:"4px 12px",fontSize:11,fontFamily:Qt,fontWeight:600,backgroundColor:l.trim()?e.color:"rgba(0,0,0,0.1)",color:l.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:l.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}function ci(e){var i;let t=new Set,n=new Map;for(let s of e){if(!s.linkedSelector)continue;let a=n.get(s.linkedSelector)||[];a.push(s),n.set(s.linkedSelector,a)}let o=new Set,r=new Set;for(let s of n.values()){if(s.length<=1){(i=s[0])!=null&&i.groupId&&r.add(s[0].groupId);continue}s.sort((l,d)=>d.timestamp-l.timestamp);let a=s[0];a.groupId&&r.add(a.groupId);for(let l=1;l<s.length;l++){let d=s[l];t.add(d),d.groupId&&o.add(d.groupId)}}for(let s of e)s.groupId&&o.has(s.groupId)&&!r.has(s.groupId)&&t.add(s);return t}import{useEffect as ml,useLayoutEffect as bu,useState as hl}from"react";import{jsx as os,jsxs as bl}from"react/jsx-runtime";function xu(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var yl=["top-left","top-right","bottom-right","bottom-left"];function xl({element:e,radius:t,accentColor:n,hoveredCorner:o,draggingCorner:r,cursorViewport:i}){let[s,a]=hl(null),[l,d]=hl(!1);if(ml(()=>{let T=O=>{(O.key==="Meta"||O.key==="Control")&&d(!0)},z=O=>{(O.key==="Meta"||O.key==="Control")&&d(!1)},P=()=>d(!1);return window.addEventListener("keydown",T,!0),window.addEventListener("keyup",z,!0),window.addEventListener("blur",P),()=>{window.removeEventListener("keydown",T,!0),window.removeEventListener("keyup",z,!0),window.removeEventListener("blur",P)}},[]),ml(()=>{if(!e){a(null);return}let T=()=>{a(e.getBoundingClientRect())};return T(),window.addEventListener("scroll",T,{passive:!0}),window.addEventListener("resize",T,{passive:!0}),()=>{window.removeEventListener("scroll",T),window.removeEventListener("resize",T)}},[e]),bu(()=>{e&&a(e.getBoundingClientRect())},[e,t["top-left"],t["top-right"],t["bottom-right"],t["bottom-left"]]),!s)return null;let c=s.width,p=s.height,u=xu(n,.2),g={"top-left":{x:0,y:t["top-left"]},"top-right":{x:c,y:t["top-right"]},"bottom-right":{x:c,y:p-t["bottom-right"]},"bottom-left":{x:0,y:p-t["bottom-left"]}},b=new Set,x=r!=null?r:o;if(x)if(l)b.add(x);else for(let T of yl)b.add(T);let A={position:"fixed",top:s.top,left:s.left,width:c,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"};return bl("div",{"data-devtools":"border-radius-handles",style:A,children:[bl("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${p}`,children:[os("rect",{x:"0.5",y:"0.5",width:Math.max(0,c-1),height:Math.max(0,p-1),fill:"none",stroke:u,strokeWidth:"1"}),yl.map(T=>{let z=g[T],P=b.has(T);return os("circle",{cx:z.x,cy:z.y,r:T===(r!=null?r:o)?3:2.5,fill:n,stroke:"#ffffff",strokeWidth:T===(r!=null?r:o)?4:2,paintOrder:"stroke"},T)})]}),i&&x&&(()=>{let T=Math.round(t[x]);return os("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:T})})()]})}import{useEffect as vu,useState as Su}from"react";function Uo(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);if(n)return`oklch(${n[1]} / ${t})`;let o=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);if(o){let r=parseInt(o[1],16),i=parseInt(o[2],16),s=parseInt(o[3],16);return`rgba(${r}, ${i}, ${s}, ${t})`}return`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}import{Fragment as wu,jsx as rs,jsxs as Nr}from"react/jsx-runtime";function lo({element:e,isSelected:t=!1,elementInfo:n,color:o="#3b82f6",annotationNumber:r,changeCount:i,hideTooltip:s=!1}){let[a,l]=Su(null);if(vu(()=>{if(!e){l(null);return}let k=()=>{let G=e.getBoundingClientRect();l(G)};return k(),window.addEventListener("scroll",k,{passive:!0}),window.addEventListener("resize",k,{passive:!0}),()=>{window.removeEventListener("scroll",k),window.removeEventListener("resize",k)}},[e]),!a||!e)return null;let d={position:"fixed",top:a.top,left:a.left,width:a.width,height:a.height,pointerEvents:"none",zIndex:9996,backgroundColor:Uo(o,.05),overflow:"visible"},c=e.tagName.toLowerCase(),p=e.id?`#${e.id}`:"",u=e.classList.length>0?"."+Array.from(e.classList).slice(0,2).join("."):"",g=n==null?void 0:n.reactComponent,b=g?`<${g}> ${c}${p}${u}`:`${c}${p}${u}`,x=22,A=a.height>=window.innerHeight,T=A?0:a.top>=x?a.top-x:a.bottom,z=A?{position:"absolute",top:8,left:8,zIndex:9997,display:"flex",alignItems:"center",gap:6,backgroundColor:o,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400}:{position:"fixed",top:T,left:a.left,zIndex:9997,display:"flex",alignItems:"center",gap:6,backgroundColor:o,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400},O=!s&&Nr("div",{"data-devtools":"tooltip",style:z,children:[r!==void 0&&Nr("span",{children:[r,"."]}),rs("span",{style:{overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0},children:b}),i!==void 0&&i>0&&Nr("span",{style:{opacity:.8},children:["(",i," ",i===1?"change":"changes",")"]})]});return Nr(wu,{children:[Nr("div",{"data-devtools":"highlight",style:d,children:[rs("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:rs("rect",f({x:"0.5",y:"0.5",width:Math.max(0,a.width-1),height:Math.max(0,a.height-1),fill:"none",stroke:o,strokeWidth:"1"},!t&&{strokeDasharray:"2 4"}))}),A&&O]}),!A&&O]})}import{useEffect as vl,useLayoutEffect as Cu,useState as is}from"react";import{jsx as bo,jsxs as as}from"react/jsx-runtime";function ss(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function ls({element:e,gap:t,accentColor:n,hoveredAxis:o,draggingAxis:r,cursorViewport:i,isAutoGap:s=!1,refreshKey:a=0}){let[l,d]=is(null),[c,p]=is([]),[u,g]=is(!1);if(vl(()=>{let oe=N=>{(N.key==="Meta"||N.key==="Control")&&g(!0)},W=N=>{(N.key==="Meta"||N.key==="Control")&&g(!1)},Q=()=>g(!1);return window.addEventListener("keydown",oe,!0),window.addEventListener("keyup",W,!0),window.addEventListener("blur",Q),()=>{window.removeEventListener("keydown",oe,!0),window.removeEventListener("keyup",W,!0),window.removeEventListener("blur",Q)}},[]),vl(()=>{if(!e){d(null),p([]);return}let oe=()=>{d(e.getBoundingClientRect()),p(yo(e))};return oe(),window.addEventListener("scroll",oe,{passive:!0}),window.addEventListener("resize",oe,{passive:!0}),()=>{window.removeEventListener("scroll",oe),window.removeEventListener("resize",oe)}},[e]),Cu(()=>{e&&(d(e.getBoundingClientRect()),p(yo(e)))},[e,t.row,t.column,a]),!l||c.length===0)return null;let b=l.width,x=l.height,A="pm-gap-stripe-pattern",T=ss(n,.25),z=ss(n,.1),P=ss(n,.2),O=8,k=2,G={position:"fixed",top:l.top,left:l.left,width:b,height:x,pointerEvents:"none",zIndex:9996,overflow:"visible"},re=r!=null?r:o;return as("div",{"data-devtools":"gap-handles",style:G,children:[as("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${b} ${x}`,children:[bo("defs",{children:bo("pattern",{id:A,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:bo("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:T,strokeWidth:"1.5"})})}),bo("rect",{x:"0.5",y:"0.5",width:Math.max(0,b-1),height:Math.max(0,x-1),fill:"none",stroke:P,strokeWidth:"1"}),c.map((oe,W)=>{let Q=oe.x-l.left,N=oe.y-l.top,ee=oe.w,M=oe.h,Le=u?oe.axis===re:!0;return(oe.axis==="row"?t.row:t.column)===0?null:as("g",{opacity:Le?1:.6,children:[bo("rect",{x:Q,y:N,width:ee,height:M,fill:z}),bo("rect",{x:Q,y:N,width:ee,height:M,fill:`url(#${A})`})]},W)}),re&&(()=>{let oe=c.filter(me=>me.axis===re);if(oe.length===0)return null;let W=oe[0];if(i&&oe.length>1){let me=1/0;for(let Fe of oe){let we=Fe.x+Fe.w/2,Je=Fe.y+Fe.h/2,Re=Math.abs(i.x-we)+Math.abs(i.y-Je);Re<me&&(me=Re,W=Fe)}}let Q=W.x-l.left,N=W.y-l.top,ee=W.w,M=W.h,Le=Q+ee/2,V=N+M/2;if(s)return bo("circle",{cx:Le,cy:V,r:1.5,fill:n,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let fe=re==="column",D=fe?k:O,ae=fe?O:k,I=Le-D/2,pe=V-ae/2;return bo("rect",{x:I,y:pe,width:D,height:ae,fill:n,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),i&&re&&(()=>{let oe=s?"auto":String(Math.round(re==="row"?t.row:t.column));return bo("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:oe})})()]})}import{useCallback as Iu,useEffect as Lu,useState as Ru}from"react";import{useEffect as Eu,useState as Sl}from"react";var ku=3,Tu=250,cs=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Mu=3e3;function wl(e){let[t,n]=Sl(0),[o,r]=Sl(()=>Math.floor(Math.random()*cs.length));return Eu(()=>{if(!e)return;let i=setInterval(()=>n(a=>(a+1)%ku),Tu),s=setInterval(()=>r(a=>(a+1)%cs.length),Mu);return()=>{clearInterval(i),clearInterval(s)}},[e]),{charIndex:t,word:cs[o]}}import{Fragment as ds,jsx as Fn,jsxs as br}from"react/jsx-runtime";function Au(e){let{element:t}=e,n=t.tagName,o=t.id?`#${t.id}`:"",r=t.className?"."+t.className.split(" ").slice(0,2).join("."):"",i=t.reactComponent;return i?`<${i}> ${n}${o}${r}`:`${n}${o}${r}`}var Cl=22,us=12;function Pu(s){var a=s,{left:e,top:t,avoidBottom:n,style:o,children:r}=a,i=jn(a,["left","top","avoidBottom","style","children"]);let l=n!==void 0?`${n}px`:"100vh";return Fn("div",h(f({"data-devtools":"badge-hit-area"},i),{style:f({position:"fixed",left:`max(0px, ${e}px)`,top:`max(0px, ${t}px)`,padding:us,transform:`translate(min(0px, calc(100vw - max(0px, ${e}px) - 100%)), min(0px, calc(${l} - max(0px, ${t}px) - 100%)))`},o),children:r}))}function El({styleModifications:e,isInspecting:t,accentColor:n,annotationGroupCount:o,dispatch:r,inFlightSelectors:i,toolbarRef:s,onHoverSelector:a}){var z;let[l,d]=Ru([]),c=i&&i.size>0,{charIndex:p,word:u}=wl(!!c);Lu(()=>{if(t){d([]);return}let P=null,O=()=>{let re=[];e.forEach((oe,W)=>{let Q=In(oe.selector);if(!Q)return;let N=Q.getBoundingClientRect();re.push({selector:oe.selector,modIndex:W,top:N.top>=Cl?N.top-Cl:N.bottom,left:N.left,label:Au(oe),changeCount:oe.changes.length,annotationNumber:o+W+1})}),d(re)},k=()=>{P&&cancelAnimationFrame(P),P=requestAnimationFrame(O)};O(),window.addEventListener("scroll",k,!0),window.addEventListener("resize",k,!0);let G=new MutationObserver(k);return G.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),window.addEventListener("load",k),document.fonts.ready.then(k),()=>{window.removeEventListener("scroll",k,!0),window.removeEventListener("resize",k,!0),window.removeEventListener("load",k),G.disconnect(),P&&cancelAnimationFrame(P)}},[e,t,o]);let g=Iu(P=>{let O=e[P];if(!O)return;let k=In(O.selector);k&&(r({type:"SELECT_ANNOTATION",payload:{id:null}}),r({type:"SET_TOOL",payload:"inspector"}),r({type:"SELECT_ELEMENT",payload:{el:k,info:O.element}}))},[e,r]);if(l.length===0)return null;let b=(z=s==null?void 0:s.current)==null?void 0:z.getBoundingClientRect(),x=b?b.top-8:void 0,A={display:"flex",alignItems:"center",gap:6,backgroundColor:n,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,whiteSpace:"nowrap",maxWidth:400},T={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return Fn(ds,{children:l.map(P=>{let O=i==null?void 0:i.has(P.selector);return Fn(Pu,{left:P.left-us,top:P.top-us,avoidBottom:x,onClick:()=>g(P.modIndex),onMouseEnter:a?()=>a(P.selector):void 0,onMouseLeave:a?()=>a(null):void 0,style:{zIndex:1e4,cursor:"pointer",pointerEvents:"auto"},children:br("div",{"data-devtools":"badge",style:h(f({},A),{backgroundColor:O?"#999999":n}),children:[br("span",{children:[P.annotationNumber,"."]}),Fn("span",{style:T,children:P.label}),br("span",{style:{opacity:.8},children:["(",P.changeCount," ",P.changeCount===1?"change":"changes",")"]}),O&&br("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[Fn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:p===1?br(ds,{children:[Fn("circle",{cx:"7",cy:"7",r:"2"}),Fn("circle",{cx:"17",cy:"7",r:"2"}),Fn("circle",{cx:"7",cy:"17",r:"2"}),Fn("circle",{cx:"17",cy:"17",r:"2"})]}):br(ds,{children:[Fn("circle",{cx:"12",cy:"6",r:"2"}),Fn("circle",{cx:"6",cy:"12",r:"2"}),Fn("circle",{cx:"18",cy:"12",r:"2"}),Fn("circle",{cx:"12",cy:"18",r:"2"})]})}),u]})]})},P.selector)})})}import{useEffect as Ou,useState as Bu}from"react";import{Fragment as _u,jsx as kl}from"react/jsx-runtime";function Du(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function Tl({styleModifications:e,accentColor:t}){let[n,o]=Bu([]);if(Ou(()=>{let i=null,s=()=>{let d=[];for(let c of e){let p=In(c.selector);if(!p)continue;let u=p.getBoundingClientRect();if(u.width===0&&u.height===0)continue;let g=Yo(p);d.push({selector:c.selector,top:u.top,left:u.left,width:u.width,height:u.height,borderRadius:`${g["top-left"]}px ${g["top-right"]}px ${g["bottom-right"]}px ${g["bottom-left"]}px`})}o(d)},a=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(s)};s(),window.addEventListener("scroll",a,{passive:!0}),window.addEventListener("resize",a,{passive:!0});let l=new MutationObserver(a);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",a),window.removeEventListener("resize",a),l.disconnect(),i&&cancelAnimationFrame(i)}},[e]),n.length===0)return null;let r=Du(t,.2);return kl(_u,{children:n.map(i=>{let s={position:"fixed",top:i.top,left:i.left,width:i.width,height:i.height,pointerEvents:"none",zIndex:9995,border:`1px solid ${r}`,borderRadius:i.borderRadius,boxSizing:"border-box"};return kl("div",{"data-devtools":"mod-border",style:s},i.selector)})})}import{useEffect as Ml,useLayoutEffect as Nu,useState as Il}from"react";import{jsx as To,jsxs as fs}from"react/jsx-runtime";function ps(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var Hu={top:"bottom",bottom:"top",left:"right",right:"left"};function gs({element:e,padding:t,accentColor:n,hoveredSide:o,draggingSide:r,cursorViewport:i,refreshKey:s}){let[a,l]=Il(null),[d,c]=Il(!1);if(Ml(()=>{let ee=V=>{(V.key==="Meta"||V.key==="Control")&&c(!0)},M=V=>{(V.key==="Meta"||V.key==="Control")&&c(!1)},Le=()=>c(!1);return window.addEventListener("keydown",ee,!0),window.addEventListener("keyup",M,!0),window.addEventListener("blur",Le),()=>{window.removeEventListener("keydown",ee,!0),window.removeEventListener("keyup",M,!0),window.removeEventListener("blur",Le)}},[]),Ml(()=>{if(!e){l(null);return}let ee=()=>{l(e.getBoundingClientRect())};return ee(),window.addEventListener("scroll",ee,{passive:!0}),window.addEventListener("resize",ee,{passive:!0}),()=>{window.removeEventListener("scroll",ee),window.removeEventListener("resize",ee)}},[e]),Nu(()=>{e&&l(e.getBoundingClientRect())},[e,t.top,t.right,t.bottom,t.left,s]),!a)return null;let p=a.width,u=a.height,{top:g,right:b,bottom:x,left:A}=t,T="pm-stripe-pattern",z=ps(n,.25),P=ps(n,.1),O=ps(n,.2),k=8,G=2,re={position:"fixed",top:a.top,left:a.left,width:p,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"},oe=["top","right","bottom","left"],W={top:`0,0 ${p},0 ${p-b},${g} ${A},${g}`,right:`${p},0 ${p},${u} ${p-b},${u-x} ${p-b},${g}`,bottom:`0,${u} ${A},${u-x} ${p-b},${u-x} ${p},${u}`,left:`0,0 ${A},${g} ${A},${u-x} 0,${u}`},Q={top:{x:p/2-k/2,y:g/2-G/2,w:k,h:G},bottom:{x:p/2-k/2,y:u-x/2-G/2,w:k,h:G},left:{x:A/2-G/2,y:u/2-k/2,w:G,h:k},right:{x:p-b/2-G/2,y:u/2-k/2,w:G,h:k}},N=new Set;return r?N.add(r):o&&(N.add(o),d||N.add(Hu[o])),fs("div",{"data-devtools":"padding-handles",style:re,children:[fs("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${p} ${u}`,children:[To("defs",{children:To("pattern",{id:T,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:To("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:z,strokeWidth:"1.5"})})}),To("rect",{x:"0.5",y:"0.5",width:Math.max(0,p-1),height:Math.max(0,u-1),fill:"none",stroke:O,strokeWidth:"1"}),oe.map(ee=>{if(t[ee]<=0)return null;let Le=N.has(ee);return fs("g",{opacity:Le?1:.6,children:[To("polygon",{points:W[ee],fill:P}),To("polygon",{points:W[ee],fill:`url(#${T})`})]},ee)}),oe.map(ee=>{let M=Q[ee],Le=N.has(ee);return To("rect",{x:M.x,y:M.y,width:M.w,height:M.h,fill:n,stroke:"#ffffff",strokeWidth:Le?4:2,paintOrder:"stroke"},`handle-${ee}`)})]}),i&&(o||r)&&(()=>{let ee=r!=null?r:o,M=Math.round(t[ee]);return To("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:M})})()]})}import{useCallback as co,useEffect as Vn,useMemo as yi,useRef as Dn,useState as yn}from"react";import{Check as hi,ChevronDown as ws,MoveHorizontal as $l,Shrink as cp}from"lucide-react";var Fu="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",xr={borderWidth:3,borderStyle:"solid",borderImage:`url("${Fu}") 4 / 1.9 / 0 round`};function di({color:e="rgb(0,0,0)",animated:t=!1}={}){let n=`<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='${e}' stroke-width='.75'/></svg>`;return f({position:"absolute",inset:-3,padding:5,backgroundImage:`url("data:image/svg+xml,${encodeURIComponent(n)}")`,backgroundSize:"5px 5px",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",maskComposite:"exclude",pointerEvents:"none"},t?{animation:"popmelt-border-march 0.8s linear infinite"}:{})}var ui={"font-size":["rem","px","em"],"line-height":["","rem","px","em"],"letter-spacing":["rem","px","em"],gap:["rem","px","em"],"column-gap":["rem","px","em"],"row-gap":["rem","px","em"],padding:["rem","px","em","%"],margin:["rem","px","em","%"],width:["rem","px","%","em"],height:["rem","px","%","em"],"min-width":["rem","px","%","em"],"max-width":["rem","px","%","em"],"min-height":["rem","px","%","em"],"max-height":["rem","px","%","em"],"border-width":["px","rem","em"],"border-radius":["rem","px","%","em"]};function vr(e){var t,n;return(n=(t=ui[e])==null?void 0:t[0])!=null?n:"px"}function Mo(e){let t=e.match(/^([\d.-]+)(.*)$/);return t?{num:parseFloat(t[1]),unit:t[2]||""}:{num:0,unit:""}}function pi(e,t,n,o){let r=e.trim();if(!r)return"";let i=r.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i);if(i)return`${parseFloat(i[1])}${i[2].toLowerCase()}`;let s=parseFloat(r);if(!isNaN(s)){if(o){let{unit:a}=Mo(n);return`${s}${a||vr(t)}`}return`${s}${vr(t)}`}return r}function ms(e,t){if(!t||t==="px")return e;if(t==="rem"){let n=parseFloat(getComputedStyle(document.documentElement).fontSize)||16;return Math.round(e/n*1e3)/1e3}return e}import{useCallback as $u,useEffect as zu,useRef as Ll,useState as Wu}from"react";import{Plus as Rl,X as Gu}from"lucide-react";import{jsx as Bn,jsxs as Vo}from"react/jsx-runtime";var fi=[{name:"blur",label:"Blur",unit:"px",defaultValue:10,min:0,max:100,step:1},{name:"brightness",label:"Brightness",unit:"",defaultValue:1,min:0,max:3,step:.05},{name:"contrast",label:"Contrast",unit:"",defaultValue:1,min:0,max:3,step:.05},{name:"saturate",label:"Saturate",unit:"",defaultValue:1,min:0,max:3,step:.05},{name:"grayscale",label:"Grayscale",unit:"",defaultValue:0,min:0,max:1,step:.05},{name:"sepia",label:"Sepia",unit:"",defaultValue:0,min:0,max:1,step:.05},{name:"invert",label:"Invert",unit:"",defaultValue:0,min:0,max:1,step:.05},{name:"hue-rotate",label:"Hue Rotate",unit:"deg",defaultValue:0,min:0,max:360,step:1},{name:"opacity",label:"Opacity",unit:"",defaultValue:1,min:0,max:1,step:.05}];function ju(e){if(!e||e==="none")return[];let t=[],n=/([\w-]+)\(([^)]+)\)/g,o;for(;(o=n.exec(e))!==null;){let r=o[1],i=o[2],s=parseFloat(i);isNaN(s)||t.push({name:r,value:s})}return t}function hs(e){return e.length===0?"none":e.map(t=>{var r;let n=fi.find(i=>i.name===t.name),o=(r=n==null?void 0:n.unit)!=null?r:"";return`${t.name}(${t.value}${o})`}).join(" ")}function Al({value:e,onChange:t,accentColor:n,modified:o,panelContentRef:r}){let i=ju(e),[s,a]=Wu(!1),l=Ll(null),d=Ll(null);zu(()=>{if(!s)return;let P=O=>{l.current&&!O.composedPath().includes(l.current)&&a(!1)};return document.addEventListener("mousedown",P,!0),()=>document.removeEventListener("mousedown",P,!0)},[s]);let c=fi.filter(P=>!i.some(O=>O.name===P.name)),p=P=>{let O=[...i,{name:P.name,value:P.defaultValue}];t(hs(O)),a(!1)},u=P=>{let O=i.filter((k,G)=>G!==P);t(hs(O))},g=(P,O)=>{let k=i.map((G,re)=>re===P?h(f({},G),{value:O}):G);t(hs(k))},b={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},x=$u(P=>{var W;if(!d.current)return{position:"fixed",top:0,left:0};let O=d.current.getBoundingClientRect(),k=(W=r==null?void 0:r.current)==null?void 0:W.getBoundingClientRect(),G=P*24+8,oe=window.innerHeight-O.bottom<G;return h(f({position:"fixed"},oe?{bottom:window.innerHeight-O.top+2}:{top:O.bottom+2}),{left:k?k.left+4:O.left,width:k?k.width-8:140,zIndex:10001})},[r]),A={backgroundColor:"rgba(255, 255, 255, 0.95)",backdropFilter:"blur(16px)",WebkitBackdropFilter:"blur(16px)",border:"1px solid rgba(0,0,0,0.1)",borderRadius:4,padding:"4px 0",boxShadow:"0 4px 12px rgba(0,0,0,0.1)"},T={display:"block",width:"100%",padding:"4px 10px",border:"none",backgroundColor:"transparent",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#334155",cursor:"pointer",textAlign:"left"},z=P=>Bn("div",{ref:l,style:f(f({},x(P.length)),A),children:P.map(O=>Bn("button",{type:"button",onClick:()=>p(O),style:T,onMouseEnter:k=>{k.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:k=>{k.currentTarget.style.backgroundColor="transparent"},children:O.label},O.name))});return i.length===0?Vo("div",{children:[Vo("div",{style:{display:"flex",alignItems:"center",gap:4},children:[Bn(xo,{modified:!1,children:Bn("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:h(f({},b),{color:"#999",cursor:"default"})})}),Bn("button",{ref:d,type:"button",onClick:()=>a(!s),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,padding:0,border:"none",borderRadius:2,backgroundColor:"transparent",color:"#94a3b8",cursor:"pointer",flexShrink:0},children:Bn(Rl,{size:12})})]}),s&&z(fi)]}):Vo("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[i.map((P,O)=>{let k=fi.find(G=>G.name===P.name);return k?Vo("div",{style:{display:"flex",alignItems:"center",gap:4},children:[Bn("span",{style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:o?n:"#94a3b8",fontWeight:o?600:400,width:56,flexShrink:0,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:k.label}),Bn(xo,{modified:o,children:Vo("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[Bn("input",{type:"range",min:k.min,max:k.max,step:k.step,value:P.value,onChange:G=>g(O,parseFloat(G.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${n} ${(P.value-k.min)/(k.max-k.min)*100}%, rgba(0,0,0,0.1) ${(P.value-k.min)/(k.max-k.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),Bn("input",{type:"number",min:k.min,max:k.max,step:k.step,value:k.unit==="px"||k.unit==="deg"?Math.round(P.value):Math.round(P.value*100)/100,onChange:G=>g(O,parseFloat(G.target.value)||0),style:h(f({},b),{width:44,padding:"2px 4px",textAlign:"right",flexShrink:0})}),k.unit&&Bn("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:k.unit})]})}),Bn("button",{type:"button",onClick:()=>u(O),style:{display:"flex",alignItems:"center",justifyContent:"center",width:16,height:16,padding:0,border:"none",borderRadius:2,backgroundColor:"transparent",color:"#94a3b8",cursor:"pointer",flexShrink:0},children:Bn(Gu,{size:10})})]},P.name):null}),c.length>0&&Vo("div",{children:[Vo("button",{ref:d,type:"button",onClick:()=>a(!s),style:{display:"flex",alignItems:"center",gap:4,padding:"2px 4px",border:"none",borderRadius:2,backgroundColor:"transparent",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#94a3b8",cursor:"pointer"},children:[Bn(Rl,{size:10}),"Add filter"]}),s&&z(c)]})]})}import{useCallback as oo,useEffect as Vu,useRef as gi,useState as Pl}from"react";import{AlignHorizontalSpaceAround as Xu,AlignVerticalSpaceAround as Ku,Columns3 as qu,Grid2x2 as Zu,RectangleHorizontal as Qu,Rows3 as ep,UnfoldHorizontal as Ol,UnfoldVertical as Bl}from"lucide-react";import{useCallback as Yu,useEffect as Ju,useRef as Hr}from"react";import{jsx as Uu}from"react/jsx-runtime";var ys=[0,1,2,4,8,12,16,20,24,28,32];function Sr({value:e,onChange:t,onPreview:n,onScrubEnd:o,onReset:r,isModified:i,accentColor:s,defaultUnit:a="rem",snapSteps:l,color:d,style:c,children:p}){let u=Hr(null),g=Hr(null),b=Hr(r),x=Hr(i),A=Hr(!1);b.current=r,x.current=i,Ju(()=>{let z=O=>{let k=g.current;if(!k)return;k.hasMoved=!0,A.current=O.shiftKey;let G=k.unit==="rem"||k.unit==="em"?.1:1;k.accum+=O.movementX*G;let re=Math.max(0,Math.round((k.startValue+k.accum)*10)/10);if(O.shiftKey&&l){let oe=k.unit==="rem"||k.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,W=k.unit==="rem"||k.unit==="em"?re*oe:re,Q=l[l.length-1];for(let N=0;N<l.length-1;N++){let ee=l[N],M=l[N+1];if(W<=(ee+M)/2){Q=ee;break}if(W<M){Q=M;break}}W>l[l.length-1]&&(Q=Math.round(W/8)*8),re=k.unit==="rem"||k.unit==="em"?Math.round(Q/oe*1e3)/1e3:Q}n==null||n(`${re}${k.unit}`)},P=()=>{let O=g.current;if(!O)return;let k=Math.max(0,Math.round((O.startValue+O.accum)*10)/10);if(A.current&&l){let re=O.unit==="rem"||O.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,oe=O.unit==="rem"||O.unit==="em"?k*re:k,W=l[l.length-1];for(let Q=0;Q<l.length-1;Q++){let N=l[Q],ee=l[Q+1];if(oe<=(N+ee)/2){W=N;break}if(oe<ee){W=ee;break}}oe>l[l.length-1]&&(W=Math.round(oe/8)*8),k=O.unit==="rem"||O.unit==="em"?Math.round(W/re*1e3)/1e3:W}let G=O.hasMoved&&k!==O.startValue;g.current=null,document.exitPointerLock(),G?t(`${k}${O.unit}`):O.hasMoved?n==null||n(`${O.startValue}${O.unit}`):x.current&&b.current&&b.current(),o==null||o()};return document.addEventListener("mousemove",z),document.addEventListener("mouseup",P),()=>{document.removeEventListener("mousemove",z),document.removeEventListener("mouseup",P)}},[t,n,o]);let T=Yu(z=>{var k;if(z.button!==0)return;z.preventDefault();let P=Mo(e),O=P.unit&&P.unit!=="px"?P.unit:a;g.current={startValue:P.num,unit:O,accum:0,hasMoved:!1},(k=u.current)==null||k.requestPointerLock()},[e,a]);return Uu("span",{ref:u,onMouseDown:T,title:i?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:f({color:i?s||"#3b82f6":d||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize"},c),children:p})}import{Fragment as bs,jsx as Be,jsxs as fn}from"react/jsx-runtime";function tp({gridCols:e,gridRows:t,gridModified:n,accentColor:o,onColsChange:r,onRowsChange:i}){return Be($n,{style:{width:100},children:fn("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[Be("input",{type:"number",min:1,max:12,value:e,onChange:s=>r(parseInt(s.target.value)||1),style:h(f({},hn),{width:32,textAlign:"center",padding:2})}),Be("span",{style:{fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:n?o:"#999",fontWeight:n?600:400,fontSize:11,margin:"0 4px"},children:"\xD7"}),Be("input",{type:"number",min:1,max:12,value:t,onChange:s=>i(parseInt(s.target.value)||1),style:h(f({},hn),{width:32,textAlign:"center",padding:2})})]})})}function Dl({element:e,getValue:t,getOriginalValue:n,handleChange:o,isModified:r,onResetProperty:i,isCollapsed:s,onToggle:a,sectionHeaderStyle:l,activeDropdown:d,onDropdownChange:c,panelContentRef:p,accentColor:u,onFieldHover:g,preferredUnit:b,onUnitCycle:x}){let A=c,T=t("display"),z=t("flex-direction"),P=_l(T,z),O=T==="flex"||T==="inline-flex",k=T==="grid",G=O||k,re=z==="column"||z==="column-reverse",oe=t("width"),W=t("height"),Q=r("width")?oe:ni(e,"width"),N=r("height")?W:ni(e,"height"),ee=xs(oe,Q),M=xs(W,N),Le=t("min-width"),V=t("max-width"),fe=t("min-height"),D=t("max-height"),ae=wr(t("padding")),I=t("gap"),pe=t("row-gap"),me=t("column-gap"),Fe=t("grid-template-columns"),we=t("grid-template-rows"),Je=t("overflow"),Re=Fe.split(/\s+/).filter($=>$&&$!=="none").length||1,Ce=we.split(/\s+/).filter($=>$&&$!=="none").length||1,[at,gt]=Pl(!1),bt=d!==null,Yt=bt||at,K=bt?.3:at?.65:1,X=({mode:$,icon:De,active:Ge})=>Be("button",{type:"button",onClick:()=>Nl($,o),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:Ge?Uo(u,.15):"transparent",color:Ge?u:"#64748b",cursor:"pointer",fontSize:14},children:De}),Te=($,De,Ge)=>{Ge==="fixed"?o($,De):o($,mi(Ge,De))},Oe=$=>{let De=wr(t("padding")),Ge=$||"0";o("padding",`${De.top} ${Ge} ${De.bottom} ${Ge}`)},Xe=$=>{let De=wr(t("padding")),Ge=$||"0";o("padding",`${Ge} ${De.right} ${Ge} ${De.left}`)},[Pe,he]=Pl({}),te=oo(($,De)=>Ge=>{De(Ge),he(En=>h(f({},En),{[$]:Ge}))},[]),ie=oo($=>{he(De=>{let Ge=f({},De);return delete Ge[$],Ge})},[]),ve=oo($=>{let De=wr(t("padding"));Qe(e,"padding",`${De.top} ${$} ${De.bottom} ${$}`)},[e,t]),Me=oo($=>{let De=wr(t("padding"));Qe(e,"padding",`${$} ${De.right} ${$} ${De.left}`)},[e,t]),mt=oo($=>De=>{Qe(e,$,De)},[e]),Ne=re?"row":"column",ze=Ne==="row"?"row-gap":"column-gap",nt=ze==="row-gap"?pe||I:me||I,St=r(ze)||r("gap"),Ke=oo(()=>{let De=yo(e).find(En=>En.axis===Ne);if(De)return Ne==="row"?De.h:De.w;let Ge=jo(e);return Ne==="row"?Ge.row:Ge.column},[e,Ne]),Rt=oo(()=>{let $=t("justify-content");return $==="space-between"?"between":$==="space-around"||$==="space-evenly"?"around":"fixed"},[t])(),_n=oo(($,De)=>{if($==="fixed"){let Ge=Math.max(0,Math.round(Ke()*1e3)/1e3),En=De||(Ge>0?`${Ge}px`:"8px");o("justify-content","normal"),o(ze,En);return}o("justify-content",$==="between"?"space-between":"space-around"),o(ze,"0px")},[ze,Ke,o]),Kn=oo($=>{if(Rt!=="fixed"){_n("fixed",$);return}o(ze,$)},[_n,Rt,ze,o]),vn=oo($=>{Qe(e,"justify-content","normal"),Qe(e,ze,$)},[e,ze]),It=$=>$==="center"?1:$==="flex-end"||$==="end"?2:0,qn=It(t("justify-content")),on=It(t("align-items")),Zn=re?on:qn,xt=re?qn:on,rn=gi(null),_t=gi({x:0,y:0}),sn=gi({col:Zn,row:xt});sn.current={col:Zn,row:xt};let Nn=oo(($,De)=>{let Ge=["flex-start","center","flex-end"];re?(o("justify-content",Ge[De]),o("align-items",Ge[$])):(o("justify-content",Ge[$]),o("align-items",Ge[De]))},[re,o]),An=gi(Nn);An.current=Nn,Vu(()=>{let De=Ge=>{let En=rn.current;if(!En||!Ge.composedPath().includes(En))return;Ge.preventDefault(),Ge.stopPropagation(),_t.current.x+=Ge.deltaX,_t.current.y+=Ge.deltaY;let{col:At,row:qt}=sn.current,wn=!1;Math.abs(_t.current.x)>=30&&(At=Math.max(0,Math.min(2,At+(_t.current.x>0?1:-1))),_t.current.x=0,_t.current.y=0,wn=!0),!wn&&Math.abs(_t.current.y)>=30&&(qt=Math.max(0,Math.min(2,qt+(_t.current.y>0?1:-1))),_t.current.x=0,_t.current.y=0,wn=!0),wn&&(At!==sn.current.col||qt!==sn.current.row)&&An.current(At,qt)};return document.addEventListener("wheel",De,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",De,{capture:!0})},[]);let Kt=()=>Be("div",{ref:rn,onMouseEnter:()=>{gt(!0),p.current&&(p.current.style.overflowY="hidden")},onMouseLeave:()=>{gt(!1),p.current&&(p.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:Un,borderRadius:2,display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gridTemplateRows:"repeat(3, 1fr)",padding:6,gap:2,touchAction:"none"},children:[0,1,2].map($=>[0,1,2].map(De=>Be("button",{type:"button",onClick:()=>Nn(De,$),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:De===Zn&&$===xt?Be("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:De===0?fn(bs,{children:[Be("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Be("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Be("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]}):De===1?fn(bs,{children:[Be("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Be("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Be("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]}):fn(bs,{children:[Be("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Be("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Be("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]})}):Be("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${$}-${De}`)))}),Sn=r("grid-template-columns")||r("grid-template-rows");return fn("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Be("div",{style:l,children:Be("span",{children:G?"Auto layout":"Layout"})}),fn("div",{style:{padding:"8px 12px"},children:[fn("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:Un,borderRadius:2,padding:2,opacity:K,transition:"opacity 150ms ease"},children:[Be(X,{mode:"block",icon:Be(Qu,{size:16}),active:P==="block"}),Be(X,{mode:"flex-col",icon:Be(ep,{size:16}),active:P==="flex-col"}),Be(X,{mode:"flex-row",icon:Be(qu,{size:16}),active:P==="flex-row"}),Be(X,{mode:"grid",icon:Be(Zu,{size:16}),active:P==="grid"})]}),fn("div",{style:{display:"flex",gap:4,marginBottom:8},children:[Be(vs,{label:"W",property:"width",cssValue:ee==="fixed"?oe:`${Math.round(e.getBoundingClientRect().width)}px`,mode:ee,onValueChange:$=>o("width",$),onModeChange:$=>{if($==="fixed"){let De=e.getBoundingClientRect();o("width",`${Math.round(De.width)}px`)}else o("width",mi($,oe))},modified:r("width"),dimmed:bt&&d!=="width",dropdownOpen:d==="width",onDropdownChange:$=>A($?"width":null),panelContentRef:p,accentColor:u,onReset:()=>i("width"),minValue:Le!=="none"&&Le!=="0px"&&Le!=="auto"?Le:"",maxValue:V!=="none"&&V!=="auto"?V:"",onMinChange:$=>o("min-width",$||"0"),onMaxChange:$=>o("max-width",$||"none"),onMinReset:()=>i("min-width"),onMaxReset:()=>i("max-width"),minModified:r("min-width"),maxModified:r("max-width")}),Be(vs,{label:"H",property:"height",cssValue:M==="fixed"?W:`${Math.round(e.getBoundingClientRect().height)}px`,mode:M,onValueChange:$=>o("height",$),onModeChange:$=>{if($==="fixed"){let De=e.getBoundingClientRect();o("height",`${Math.round(De.height)}px`)}else o("height",mi($,W))},modified:r("height"),dimmed:bt&&d!=="height",dropdownOpen:d==="height",onDropdownChange:$=>A($?"height":null),panelContentRef:p,minValue:fe!=="none"&&fe!=="0px"&&fe!=="auto"?fe:"",maxValue:D!=="none"&&D!=="auto"?D:"",onMinChange:$=>o("min-height",$||"0"),onMaxChange:$=>o("max-height",$||"none"),onMinReset:()=>i("min-height"),onMaxReset:()=>i("max-height"),minModified:r("min-height"),maxModified:r("max-height"),accentColor:u,onReset:()=>i("height")})]}),O&&fn("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8},children:[Be("div",{style:{opacity:bt?.3:1,transition:"opacity 150ms ease"},children:Kt()}),fn("div",{style:{flex:1,opacity:K,transition:"opacity 150ms ease"},children:[Be("div",{onClick:St?()=>{i(ze),i("gap")}:void 0,title:St?"Click to reset":void 0,style:{fontSize:9,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:St?u:"#999",fontWeight:St?600:400,marginBottom:2,cursor:St?"pointer":"default"},children:"Gap"}),Be("div",{style:{display:"flex",gap:2,marginBottom:4,backgroundColor:Un,borderRadius:2,padding:2},children:["fixed","between","around"].map($=>{let De=Rt===$;return Be("button",{type:"button",onClick:()=>_n($),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"4px 6px",border:"none",borderRadius:2,backgroundColor:De?Uo(u,.15):"transparent",color:De?u:"#64748b",cursor:"pointer",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontWeight:De?600:400,textTransform:"capitalize"},children:$},$)})}),Be($n,{dimmed:bt,children:fn("div",{style:{display:"flex",alignItems:"center"},children:[Be(Sr,{value:nt,onChange:$=>{ie("gap"),Kn($)},onPreview:te("gap",vn),onScrubEnd:()=>ie("gap"),onReset:()=>{i(ze),i("gap")},isModified:St,accentColor:u,defaultUnit:b,children:z==="column"||z==="column-reverse"?Be(Bl,{size:12,strokeWidth:St?2.5:1.5}):Be(Ol,{size:12,strokeWidth:St?2.5:1.5})}),Be(ro,{property:ze,value:Pe.gap||(Rt==="fixed"?nt:`${Math.max(0,Math.round(Ke()*1e3)/1e3)}px`),onChange:$=>Kn($),isModified:St||"gap"in Pe,style:h(f({},hn),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:x})]})})]})]}),k&&fn("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:K,transition:"opacity 150ms ease"},children:[Be(tp,{gridCols:Re,gridRows:Ce,gridModified:Sn,accentColor:u,onColsChange:$=>o("grid-template-columns",`repeat(${$}, 1fr)`),onRowsChange:$=>o("grid-template-rows",`repeat(${$}, 1fr)`)}),fn("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[Be($n,{dimmed:bt,children:fn("div",{style:{display:"flex",alignItems:"center"},children:[Be(Sr,{value:me||I,onChange:$=>{ie("column-gap"),o("column-gap",$)},onPreview:te("column-gap",mt("column-gap")),onScrubEnd:()=>ie("column-gap"),onReset:()=>i("column-gap"),isModified:r("column-gap"),accentColor:u,defaultUnit:b,children:Be(Ol,{size:12,strokeWidth:r("column-gap")?2.5:1.5})}),Be(ro,{property:"column-gap",value:Pe["column-gap"]||me||I,onChange:$=>o("column-gap",$),isModified:r("column-gap")||"column-gap"in Pe,placeholder:"col",style:h(f({},hn),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:x})]})}),Be($n,{dimmed:bt,children:fn("div",{style:{display:"flex",alignItems:"center"},children:[Be(Sr,{value:pe||I,onChange:$=>{ie("row-gap"),o("row-gap",$)},onPreview:te("row-gap",mt("row-gap")),onScrubEnd:()=>ie("row-gap"),onReset:()=>i("row-gap"),isModified:r("row-gap"),accentColor:u,defaultUnit:b,children:Be(Bl,{size:12,strokeWidth:r("row-gap")?2.5:1.5})}),Be(ro,{property:"row-gap",value:Pe["row-gap"]||pe||I,onChange:$=>o("row-gap",$),isModified:r("row-gap")||"row-gap"in Pe,placeholder:"row",style:h(f({},hn),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:x})]})})]})]}),G&&fn("div",{onMouseEnter:()=>g==null?void 0:g("padding"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:K,transition:"opacity 150ms ease"},children:[Be($n,{style:{flex:1},dimmed:bt,children:fn("div",{style:{display:"flex",alignItems:"center"},children:[Be(Sr,{value:ae.left,onChange:$=>{ie("padding-h"),Oe($)},onPreview:te("padding-h",ve),onScrubEnd:()=>ie("padding-h"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:u,defaultUnit:b,snapSteps:ys,children:Be(Xu,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Be(ro,{property:"padding",value:Pe["padding-h"]||ae.left,onChange:$=>Oe($),isModified:r("padding")||"padding-h"in Pe,placeholder:"H pad",style:h(f({},hn),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:x})]})}),Be($n,{style:{flex:1},dimmed:bt,children:fn("div",{style:{display:"flex",alignItems:"center"},children:[Be(Sr,{value:ae.top,onChange:$=>{ie("padding-v"),Xe($)},onPreview:te("padding-v",Me),onScrubEnd:()=>ie("padding-v"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:u,defaultUnit:b,snapSteps:ys,children:Be(Ku,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Be(ro,{property:"padding",value:Pe["padding-v"]||ae.top,onChange:$=>Xe($),isModified:r("padding")||"padding-v"in Pe,placeholder:"V pad",style:h(f({},hn),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:x})]})})]}),fn("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:K,transition:"opacity 150ms ease"},children:[Be("input",{type:"checkbox",checked:Je==="hidden",onChange:$=>o("overflow",$.target.checked?"hidden":"visible"),style:{margin:0,accentColor:u}}),"Clip content"]})]})]})}import{AlignCenter as np,AlignJustify as op,AlignLeft as rp,AlignRight as ip,Baseline as sp,ChevronDown as ap,WholeWord as lp}from"lucide-react";import{jsx as Tt,jsxs as vo}from"react/jsx-runtime";var Hl={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function Fl({element:e,getValue:t,handleChange:n,isModified:o,onResetProperty:r,isCollapsed:i,onToggle:s,sectionHeaderStyle:a,accentColor:l,colorVariables:d,activeColorDropdown:c,onColorDropdownChange:p,panelContentRef:u,preferredUnit:g,onUnitCycle:b}){var ee;let x=t("font-family"),A=t("font-size"),T=t("font-weight"),z=t("line-height"),P=t("letter-spacing"),O=t("text-align"),k=t("color"),G=String(T),re=Hl[G]||G,oe=yr(e,k),W=k.includes("var(")?null:Dr(oe,d),Q=({align:M,icon:Le})=>{let V=O===M;return Tt("button",{type:"button",onClick:()=>n("text-align",M),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:V?Uo(l,.15):"transparent",color:V?l:"#64748b",cursor:"pointer"},children:Le})},N=((ee=x.split(",")[0])==null?void 0:ee.trim().replace(/^["']|["']$/g,""))||"System";return vo("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Tt("div",{style:a,children:Tt("span",{children:"Typography"})}),vo("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[Tt($n,{children:vo("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[Tt("input",{type:"text",value:x,onChange:M=>n("font-family",M.target.value),style:h(f({},hn),{flex:1,minWidth:0,padding:0,fontWeight:o("font-family")?600:400,color:o("font-family")?l:"inherit"}),title:x}),Tt(ap,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),vo("div",{style:{display:"flex",gap:4},children:[Tt($n,{style:{flex:1},children:Tt("select",{value:G,onChange:M=>n("font-weight",M.target.value),style:h(f({},hn),{padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:o("font-weight")?600:400,color:o("font-weight")?l:"inherit"}),children:Object.entries(Hl).map(([M,Le])=>Tt("option",{value:M,children:Le},M))})}),Tt($n,{style:{flex:1},children:Tt("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:Tt(ro,{property:"font-size",value:A,onChange:M=>n("font-size",M),isModified:o("font-size"),min:1,max:999,style:h(f({},hn),{padding:"6px 8px",paddingRight:24,fontWeight:o("font-size")?600:400,color:o("font-size")?l:"inherit"}),unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:g,onUnitCycle:b})})})]}),vo("div",{style:{display:"flex",gap:4},children:[Tt($n,{style:{flex:1},children:vo("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[Tt(sp,{size:12,style:{color:o("line-height")?l:"#999",flexShrink:0}}),Tt(ro,{property:"line-height",value:z,onChange:M=>n("line-height",M),isModified:o("line-height"),step:.1,min:0,placeholder:"Auto",style:h(f({},hn),{flex:1,minWidth:0,padding:0,fontWeight:o("line-height")?600:400,color:o("line-height")?l:"inherit"}),showUnit:!1})]})}),Tt($n,{style:{flex:1},children:vo("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[Tt(lp,{size:12,style:{color:o("letter-spacing")?l:"#999",flexShrink:0}}),Tt(ro,{property:"letter-spacing",value:P,onChange:M=>n("letter-spacing",M),isModified:o("letter-spacing"),step:.1,placeholder:"\u2014",style:h(f({},hn),{flex:1,minWidth:0,padding:0,fontWeight:o("letter-spacing")?600:400,color:o("letter-spacing")?l:"inherit"}),showUnit:!1})]})})]}),vo("div",{style:{display:"flex",gap:2,backgroundColor:Un,borderRadius:2,padding:2},children:[Tt(Q,{align:"left",icon:Tt(rp,{size:14})}),Tt(Q,{align:"center",icon:Tt(np,{size:14})}),Tt(Q,{align:"right",icon:Tt(ip,{size:14})}),Tt(Q,{align:"justify",icon:Tt(op,{size:14})})]}),vo("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[Tt("span",{onClick:o("color")?()=>r("color"):void 0,title:o("color")?"Click to reset":void 0,style:{fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:o("color")?l:"#64748b",fontWeight:o("color")?600:400,cursor:o("color")?"pointer":"default",width:40,flexShrink:0},children:"Color"}),Tt("div",{style:{flex:1,minWidth:0},children:Tt(Ss,{value:k,resolvedValue:oe,colorVariables:d,matchingVariable:W,onChange:M=>n("color",M),accentColor:l,modified:o("color"),panelContentRef:u,isDropdownOpen:c==="color",onDropdownChange:M=>p(M?"color":null)})})]})]})]})}import{Fragment as up,jsx as Ee,jsxs as jt}from"react/jsx-runtime";var zl=[{name:"Background",properties:[{property:"background-color",label:"Color",type:"color"},{property:"opacity",label:"Opacity",type:"number",step:.1,min:0,max:1}]},{name:"Borders",properties:[{property:"border-width",label:"Width",type:"number",min:0,max:20},{property:"border-color",label:"Color",type:"color"},{property:"border-radius",label:"Radius",type:"number",min:0,max:100},{property:"border-style",label:"Style",type:"select",options:["none","solid","dashed","dotted","double"]}]},{name:"Effects",properties:[{property:"box-shadow",label:"Box Shadow",type:"text"},{property:"backdrop-filter",label:"Backdrop Filter",type:"backdrop-filter"},{property:"transform",label:"Transform",type:"text"}]}];function dp(e,t){let n=t.trim().toLowerCase();switch(e){case"opacity":return n==="1";case"border-width":return n==="0px"||n==="0"||n==="medium";case"border-radius":return n==="0px"||n==="0";case"border-style":return n==="none";case"box-shadow":return n==="none";case"backdrop-filter":return n==="none"||n==="";case"letter-spacing":return n==="normal"||n==="0px"||n==="0";case"background-color":return n==="rgba(0, 0, 0, 0)"||n==="transparent";default:return!1}}function xs(e,t){return!t||e==="auto"||e==="fit-content"||e==="max-content"||e==="min-content"?"hug":e==="100%"||t==="100%"?"fill":"fixed"}function mi(e,t){switch(e){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let n=Mo(t);if(typeof n.num=="number"&&!isNaN(n.num)){let o=n.unit==="%"?"px":n.unit||"px";return`${n.num}${o}`}return"auto"}}}function wr(e){let t=e.split(/\s+/).filter(Boolean);return t.length===1?{top:t[0],right:t[0],bottom:t[0],left:t[0]}:t.length===2?{top:t[0],right:t[1],bottom:t[0],left:t[1]}:t.length===3?{top:t[0],right:t[1],bottom:t[2],left:t[1]}:t.length>=4?{top:t[0],right:t[1],bottom:t[2],left:t[3]}:{top:"0px",right:"0px",bottom:"0px",left:"0px"}}function _l(e,t){return e==="grid"?"grid":e==="flex"||e==="inline-flex"?t==="column"||t==="column-reverse"?"flex-col":"flex-row":"block"}function Nl(e,t){switch(e){case"block":t("display","block");break;case"flex-row":t("display","flex"),t("flex-direction","row");break;case"flex-col":t("display","flex"),t("flex-direction","column");break;case"grid":t("display","grid");break}}var Un="rgba(0, 0, 0, 0.04)",hn={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};function vs({label:e,property:t,cssValue:n,mode:o,onValueChange:r,onModeChange:i,modified:s,dimmed:a,dropdownOpen:l,onDropdownChange:d,panelContentRef:c,accentColor:p="#3b82f6",onReset:u,minValue:g,maxValue:b,onMinChange:x,onMaxChange:A,onMinReset:T,onMaxReset:z,minModified:P,maxModified:O}){let k=Mo(n),G=s?k.unit||vr(t):vr(t),re=!s&&k.unit&&k.unit!==G?ms(k.num,G):k.num,[oe,W]=yn(!1),[Q,N]=yn(String(re)),[ee,M]=yn(!1),Le=Dn(null),V=Dn(null),fe=Dn(null),D=Dn(!1);Vn(()=>{oe||N(String(re))},[re,oe]),Vn(()=>{if(!l)return;let Re=at=>{V.current&&!at.composedPath().includes(V.current)&&fe.current&&!at.composedPath().includes(fe.current)&&(d==null||d(!1))},Ce=at=>{at.key==="Escape"&&(d==null||d(!1))};return document.addEventListener("mousedown",Re),document.addEventListener("keydown",Ce),()=>{document.removeEventListener("mousedown",Re),document.removeEventListener("keydown",Ce)}},[l,d]),Vn(()=>{oe&&Le.current&&(Le.current.focus(),Le.current.select())},[oe]);let ae=()=>{let Re=pi(Q,t,n,s);r(Re||`${Math.max(0,parseFloat(Q)||0)}${G}`),W(!1)},I=()=>{if(D.current){D.current=!1;return}ae()},pe=Re=>{if(Re.key==="Enter"){ae();return}if(Re.key==="Escape"){D.current=!0,N(String(re)),W(!1);return}if(Re.key==="ArrowUp"||Re.key==="ArrowDown"){Re.preventDefault();let Ce=Re.key==="ArrowUp"?1:-1,at=Re.shiftKey?8:Re.altKey?.1:1,gt=parseFloat(Q)||0,bt=Math.round(Math.max(0,gt+Ce*at)*1e3)/1e3;N(String(bt)),r(`${bt}${G}`)}},me={fixed:"Fixed",hug:"Hug",fill:"Fill"},Fe={fixed:Ee($l,{size:12}),hug:Ee(cp,{size:12}),fill:Ee($l,{size:12})},we=()=>{d==null||d(!l)},Je=()=>{if(!fe.current||!(c!=null&&c.current))return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let Re=fe.current.getBoundingClientRect(),Ce=c.current.getBoundingClientRect();return{position:"fixed",top:Re.bottom+4,left:Ce.left+4,width:Ce.width-8}};return jt("div",{ref:fe,onMouseEnter:()=>M(!0),onMouseLeave:()=>M(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:oe?p:ee?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Un,transition:"border-color 100ms ease, opacity 150ms ease",opacity:a?.3:1},children:[Ee("span",{onClick:s&&u?u:void 0,title:s?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:s?p:"#999",fontWeight:s?600:400,padding:"0 8px",flexShrink:0,cursor:s?"pointer":"default"},children:e}),o==="fixed"?oe?Ee("input",{ref:Le,type:"text",inputMode:"numeric",value:Q,onChange:Re=>N(Re.target.value),onKeyDown:pe,onBlur:I,style:h(f({},hn),{flex:1,minWidth:0,padding:"4px 2px"})}):Ee("span",{onClick:()=>W(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:re}):Ee("span",{style:{flex:1}}),jt("button",{type:"button",onClick:we,style:{display:"flex",alignItems:"center",gap:2,padding:"4px 8px",border:"none",outline:"none",backgroundColor:"transparent",color:"#999",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"pointer",flexShrink:0},children:[me[o],Ee(ws,{size:12})]}),l&&jt("div",{ref:V,style:h(f({},Je()),{backgroundColor:"#eaeaea",border:"1px solid rgba(0,0,0,0.1)",borderRadius:0,zIndex:10001,overflow:"hidden",fontSize:12,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace'}),children:[jt("button",{type:"button",onClick:()=>{i("fixed"),d==null||d(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:o==="fixed"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:o==="fixed"?600:400,cursor:"pointer",textAlign:"left"},children:[Fe.fixed,jt("span",{children:["Fixed ",t," (",n,")"]}),o==="fixed"&&Ee(hi,{size:14,style:{marginLeft:"auto"}})]}),jt("button",{type:"button",onClick:()=>{i("hug"),d==null||d(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:o==="hug"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:o==="hug"?600:400,cursor:"pointer",textAlign:"left"},children:[Fe.hug,Ee("span",{children:"Hug contents"}),o==="hug"&&Ee(hi,{size:14,style:{marginLeft:"auto"}})]}),jt("button",{type:"button",onClick:()=>{i("fill"),d==null||d(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:o==="fill"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:o==="fill"?600:400,cursor:"pointer",textAlign:"left"},children:[Fe.fill,Ee("span",{children:"Fill container"}),o==="fill"&&Ee(hi,{size:14,style:{marginLeft:"auto"}})]}),Ee("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),jt("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[jt("div",{style:{display:"flex",alignItems:"center",backgroundColor:Un,borderRadius:2,padding:"4px 8px"},children:[Ee("span",{onClick:P?Re=>{Re.stopPropagation(),T==null||T()}:void 0,title:P?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:P?p:"#999",fontWeight:P?600:400,marginRight:8,flexShrink:0,cursor:P?"pointer":"default"},children:"Min"}),Ee("input",{type:"text",value:g||"",placeholder:"\u2014",onChange:Re=>x==null?void 0:x(Re.target.value),onClick:Re=>Re.stopPropagation(),style:h(f({},hn),{flex:1,minWidth:0,padding:0,textAlign:"right",color:P?p:"inherit",fontWeight:P?600:400})})]}),jt("div",{style:{display:"flex",alignItems:"center",backgroundColor:Un,borderRadius:2,padding:"4px 8px"},children:[Ee("span",{onClick:O?Re=>{Re.stopPropagation(),z==null||z()}:void 0,title:O?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:O?p:"#999",fontWeight:O?600:400,marginRight:8,flexShrink:0,cursor:O?"pointer":"default"},children:"Max"}),Ee("input",{type:"text",value:b||"",placeholder:"\u2014",onChange:Re=>A==null?void 0:A(Re.target.value),onClick:Re=>Re.stopPropagation(),style:h(f({},hn),{flex:1,minWidth:0,padding:0,textAlign:"right",color:O?p:"inherit",fontWeight:O?600:400})})]})]})]})]})}function $n({children:e,style:t,dimmed:n}){let[o,r]=yn(!1);return Ee("div",{onMouseEnter:()=>r(!0),onMouseLeave:()=>r(!1),style:f({position:"relative",borderRadius:2,border:"1px solid",borderColor:o?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Un,transition:"border-color 100ms ease, opacity 150ms ease",opacity:n?.3:1},t),children:e})}function xo({children:e}){let[t,n]=yn(!1);return Ee("div",{onMouseEnter:()=>n(!0),onMouseLeave:()=>n(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:t?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Un,transition:"border-color 100ms ease"},children:e})}function ro({property:e,value:t,onChange:n,isModified:o=!1,step:r=1,min:i,max:s,style:a,placeholder:l,showUnit:d=!0,unitStyle:c,preferredUnit:p,onUnitCycle:u}){let g=Mo(t),b=vr(e),x=ui[e],T=p&&x&&x.includes(p)?p:b,z=o&&g.unit||T,P=!o&&g.unit&&g.unit!==z?ms(g.num,z):g.num,[O,k]=yn(!1),[G,re]=yn(""),oe=I=>{k(!0),re(String(P||"")),requestAnimationFrame(()=>I.target.select())},W=()=>{if(k(!1),G.trim()){let I=pi(G,e,t,o);I&&n(I)}},Q=I=>{let pe=I.target.value;re(pe);let me=pe.trim(),Fe=me.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),we=me.match(/^(-?[\d.]+)$/);if(Fe){let Je=parseFloat(Fe[1]);isNaN(Je)||n(`${Je}${Fe[2].toLowerCase()}`)}else if(we){let Je=parseFloat(we[1]);isNaN(Je)||n(`${Je}${z}`)}},N=I=>{if(I.key==="Enter"){if(G.trim()){let pe=pi(G,e,t,o);pe&&n(pe)}I.target.blur();return}if(I.key==="ArrowUp"||I.key==="ArrowDown"){I.preventDefault();let pe=I.shiftKey?10:I.altKey?.1:1,me=(I.key==="ArrowUp"?1:-1)*r*pe,Fe=parseFloat(G)||P||0,we=Math.round((Fe+me)*1e3)/1e3;i!==void 0&&(we=Math.max(i,we)),s!==void 0&&(we=Math.min(s,we)),re(String(we)),n(`${we}${z}`)}},ee=/^-?[\d.]/.test(t.trim()),M=O?G:ee?String(P):"",V=O&&/\s*(rem|em|px|%)\s*$/i.test(G)?"":z,fe=u&&(V==="rem"||V==="px"),D={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},ae=h(f({},c!=null?c:D),{pointerEvents:"auto",cursor:"pointer"});return jt(up,{children:[Ee("input",{type:"text",inputMode:"decimal",value:M,onFocus:oe,onBlur:W,onChange:Q,onKeyDown:N,placeholder:l,style:a}),d&&V&&Ee("span",{style:fe?ae:c!=null?c:D,onClick:fe?u:void 0,title:fe?"Click to switch units":void 0,children:V})]})}function Ss({value:e,resolvedValue:t,colorVariables:n,matchingVariable:o,onChange:r,accentColor:i="#3b82f6",modified:s,panelContentRef:a,isDropdownOpen:l,onDropdownChange:d}){let[c,p]=yn(!1),u=e,[g,b]=yn(u),[x,A]=yn(!1),[T,z]=yn(!1),[P,O]=yn(!1),k=Dn(null),G=Dn(null),re=Dn(null),oe=l!==void 0?l:x,W=d||A,Q=co(()=>{if(!re.current)return{position:"fixed",top:0,left:0,width:200};let I=re.current.getBoundingClientRect();if(a!=null&&a.current){let pe=a.current.getBoundingClientRect();return{position:"fixed",top:I.bottom+4,left:pe.left+4,width:pe.width-8}}return{position:"fixed",top:I.bottom+4,left:I.left,width:I.width}},[a]);Vn(()=>{c||b(e)},[e,c]),Vn(()=>{if(!oe&&!T)return;let I=me=>{re.current&&!me.composedPath().includes(re.current)&&(W(!1),z(!1))},pe=me=>{me.key==="Escape"&&(W(!1),z(!1))};return document.addEventListener("mousedown",I),document.addEventListener("keydown",pe),()=>{document.removeEventListener("mousedown",I),document.removeEventListener("keydown",pe)}},[oe,T]),Vn(()=>{c&&k.current&&(k.current.focus(),k.current.select())},[c]);let N=yi(()=>{if(!g||g.startsWith("#")||g.startsWith("rgb")||g.startsWith("hsl")||g.startsWith("oklch"))return[];let I=g.toLowerCase();return n.filter(pe=>pe.name.toLowerCase().includes(I)||pe.usage.toLowerCase().includes(I)).slice(0,8)},[g,n]),ee=()=>{r(g),p(!1),z(!1)},M=I=>{b(I),I.includes("var")||I.includes("--")||I.length>0&&!I.startsWith("#")?z(!0):z(!1)},Le=I=>{b(I.value),r(I.value),W(!1),z(!1),p(!1)},V=()=>{setTimeout(()=>{!oe&&!T&&ee()},150)},fe=I=>{I.key==="Enter"?ee():I.key==="Escape"&&(b(e),p(!1),z(!1))},D=yi(()=>{let I=t.trim().toLowerCase();if(I.startsWith("#"))return I.length===4?`#${I[1]}${I[1]}${I[2]}${I[2]}${I[3]}${I[3]}`:I.slice(0,7);let pe=I.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(pe){let Fe=parseInt(pe[1],10).toString(16).padStart(2,"0"),we=parseInt(pe[2],10).toString(16).padStart(2,"0"),Je=parseInt(pe[3],10).toString(16).padStart(2,"0");return`#${Fe}${we}${Je}`}let me=I.match(/oklch\(\s*([\d.]+)/);if(me){let Fe=Math.max(0,Math.min(1,parseFloat(me[1]))),we=Math.round(Fe*255).toString(16).padStart(2,"0");return`#${we}${we}${we}`}return"#000000"},[t]);return jt("div",{ref:re,onMouseEnter:()=>O(!0),onMouseLeave:()=>O(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:c?i:P?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Un,transition:"border-color 100ms ease",overflow:"hidden"},children:[jt("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[jt("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[Ee("input",{type:"color",value:D,onChange:I=>{let pe=I.target.value;b(pe),r(pe)},style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),Ee("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:t,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),c?Ee("input",{ref:k,type:"text",value:g,onChange:I=>M(I.target.value),onKeyDown:fe,onBlur:V,style:h(f({},hn),{flex:1,minWidth:0})}):Ee("span",{onClick:()=>p(!0),style:{flex:1,minWidth:0,padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",color:s?i:"inherit"},title:u,children:u}),n.length>0&&Ee("button",{type:"button",onClick:()=>W(!oe),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:Ee(ws,{size:12})})]}),T&&N.length>0&&Ee("div",{style:h(f({},Q()),{backgroundColor:"#eaeaea",border:"1px solid rgba(0,0,0,0.1)",borderRadius:0,zIndex:10001,maxHeight:200,overflowY:"auto",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace'}),children:N.map(I=>jt("button",{type:"button",onClick:()=>Le(I),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:"transparent",color:"#1e293b",cursor:"pointer",textAlign:"left",fontSize:12},children:[Ee("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:I.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),Ee("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:I.name})]},I.name))}),oe&&Ee("div",{ref:G,style:h(f({},Q()),{backgroundColor:"#eaeaea",border:"1px solid rgba(0,0,0,0.1)",borderRadius:0,zIndex:10001,maxHeight:280,overflowY:"auto",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace'}),children:n.map(I=>jt("button",{type:"button",onClick:()=>Le(I),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:(o==null?void 0:o.usage)===I.usage||e===I.value?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:(o==null?void 0:o.usage)===I.usage||e===I.value?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[Ee("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:I.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),Ee("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:I.name}),((o==null?void 0:o.usage)===I.usage||e===I.value)&&Ee(hi,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},I.name))})]})}function Wl({element:e,elementInfo:t,selector:n,styleModifications:o,dispatch:r,onClose:i,onHover:s,accentColor:a="#3b82f6",toolbarRef:l}){let d=Dn(null),c=Dn(null),[p,u]=yn(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch(K){return!1}});Vn(()=>{if(p)return;let K=setTimeout(()=>u(!0),50);return()=>clearTimeout(K)},[p]);let[g,b]=yn(null),[x,A]=yn(null),T=g!==null||x!==null,[z,P]=yn("rem"),O=co(()=>{P(K=>K==="rem"?"px":"rem")},[]),k=Dn(new Map),[G,re]=yn(""),oe=yi(()=>ts(),[]);Vn(()=>{let K=X=>{var Oe;if(X.key!=="Escape")return;let Te=document.activeElement;Te&&((Oe=d.current)!=null&&Oe.contains(Te))||i()};return window.addEventListener("keydown",K),()=>window.removeEventListener("keydown",K)},[i]);let W=Dn({top:0,left:0,maxHeight:400}),[,Q]=yn(0),N="devtools-panel-position",ee=Dn({x:0,y:0}),M=Dn(null),Le=Dn(!1);Vn(()=>{try{let K=localStorage.getItem(N);if(K){let X=JSON.parse(K);typeof X.top=="number"&&typeof X.left=="number"&&(Le.current=!0,W.current=h(f({},W.current),{top:X.top,left:X.left}))}}catch(K){}},[]),Vn(()=>{let K=Te=>{var Ke;let Oe=M.current;if(!Oe)return;let Xe=Oe.startOffsetX+(Te.clientX-Oe.startX),Pe=Oe.startOffsetY+(Te.clientY-Oe.startY),he=280,te=16,ie=Math.max(te,Math.min(window.innerWidth-he-te,W.current.left+Xe)),ve=Math.max(te,W.current.top+Pe);ee.current={x:ie-W.current.left,y:ve-W.current.top};let Me=d.current,mt=Me==null?void 0:Me.parentElement;if(!mt)return;mt.style.top=`${ve}px`,mt.style.left=`${ie}px`;let Ne=(Ke=l==null?void 0:l.current)==null?void 0:Ke.getBoundingClientRect(),ze=window.innerHeight-16;Ne&&ie+he>Ne.left&&(ze=Ne.top-8);let nt=Math.max(0,ve),St=Math.max(200,ze-nt);Me&&(Me.style.maxHeight=`${St}px`)},X=()=>{if(!M.current)return;let Te=W.current.top+ee.current.y,Oe=W.current.left+ee.current.x;W.current=h(f({},W.current),{top:Te,left:Oe}),ee.current={x:0,y:0},Le.current=!0;try{localStorage.setItem(N,JSON.stringify({top:Te,left:Oe}))}catch(Xe){}M.current=null};return window.addEventListener("mousemove",K),window.addEventListener("mouseup",X),()=>{window.removeEventListener("mousemove",K),window.removeEventListener("mouseup",X)}},[]);let V=co(K=>{K.button!==0||K.target.closest("button")||(K.preventDefault(),M.current={startX:K.clientX,startY:K.clientY,startOffsetX:ee.current.x,startOffsetY:ee.current.y})},[]);Vn(()=>{ee.current={x:0,y:0};let K=(Oe=!1)=>{var ze;let Xe=d.current,Pe=280,he=8,te,ie;if(Le.current)te=W.current.top,ie=W.current.left;else{let nt=e.getBoundingClientRect();ie=nt.right+he,te=nt.top,ie+Pe>window.innerWidth-he&&(ie=nt.left-Pe-he),ie<he&&(ie=Math.max(he,(window.innerWidth-Pe)/2))}let ve=(ze=l==null?void 0:l.current)==null?void 0:ze.getBoundingClientRect(),Me=window.innerHeight-16;ve&&ie+Pe>ve.left&&(Me=ve.top-he);let mt=Math.max(0,te),Ne=Math.max(200,Me-mt);if(W.current={top:te,left:ie,maxHeight:Ne},Oe&&Xe){let nt=Xe.parentElement;nt&&!Le.current&&(nt.style.top=`${te+ee.current.y}px`,nt.style.left=`${ie+ee.current.x}px`),Xe.style.maxHeight=`${Ne}px`}else Q(nt=>nt+1)};K(!1);let X=()=>K(!0),Te=()=>K(!1);return window.addEventListener("scroll",X,{passive:!0}),window.addEventListener("resize",Te,{passive:!0}),()=>{window.removeEventListener("scroll",X),window.removeEventListener("resize",Te)}},[e]),Vn(()=>{let K=d.current;if(!K)return;let X=Te=>{let Oe=c.current;if(!Oe){Te.preventDefault();return}let{scrollTop:Xe,scrollHeight:Pe,clientHeight:he}=Oe,te=Xe<=0&&Te.deltaY<0,ie=Xe+he>=Pe&&Te.deltaY>0;(te||ie)&&Te.preventDefault()};return K.addEventListener("wheel",X,{passive:!1}),()=>K.removeEventListener("wheel",X)},[]);let fe=yi(()=>o.find(K=>K.selector===n),[o,n]),D=co(K=>{let X=fe==null?void 0:fe.changes.find(Te=>Te.property===K);return X?X.modified:ti(e,K)},[e,fe]),ae=co((K,X)=>{if(!K.includes("color"))return X;let Te=X.trim(),Oe=oe.find(Pe=>Pe.usage===Te||Pe.name===Te),Xe=(Oe==null?void 0:Oe.value)||Te;return yr(e,Xe)},[oe,e]),I=co(K=>{if(k.current.has(K))return k.current.get(K);let X=fe==null?void 0:fe.changes.find(Oe=>Oe.property===K);if(X)return X.original;let Te=ti(e,K);return k.current.set(K,Te),Te},[e,fe]),pe=co((K,X)=>{let Te=I(K),Oe=ae(K,X);Qe(e,K,Oe),K==="backdrop-filter"&&Qe(e,"-webkit-backdrop-filter",Oe),r({type:"MODIFY_STYLE",payload:{selector:n,element:t,property:K,original:Te,modified:Oe}})},[e,n,t,r,ae,I]),me=co(K=>{let X=o.find(Oe=>Oe.selector===n);X!=null&&X.changes.find(Oe=>Oe.property===K)&&e instanceof HTMLElement&&(e.style.removeProperty(K),r({type:"CLEAR_STYLE",payload:{selector:n,property:K}}),k.current.delete(K))},[e,n,o,r]),Fe=co(()=>{let K=G.split(";").map(X=>X.trim()).filter(X=>X);for(let X of K){let Te=X.indexOf(":");if(Te>0){let Oe=X.slice(0,Te).trim(),Xe=X.slice(Te+1).trim();Oe&&Xe&&pe(Oe,Xe)}}re("")},[G,pe]),we=co(K=>{var X;return(X=fe==null?void 0:fe.changes.some(Te=>Te.property===K))!=null?X:!1},[fe]),Je=K=>{var Pe;let X=D(K.property),Te=we(K.property),Oe=!Te&&dp(K.property,X),Xe={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};if(Oe&&K.type!=="backdrop-filter")return Ee(xo,{modified:!1,children:Ee("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:he=>pe(K.property,he.target.value),style:h(f({},Xe),{color:"#999"})})});switch(K.type){case"color":{let he=yr(e,X),te=X.includes("var(")?null:Dr(he,oe);return Ee(Ss,{value:X,resolvedValue:he,colorVariables:oe,matchingVariable:te,onChange:ie=>pe(K.property,ie),accentColor:a,modified:Te,panelContentRef:c,isDropdownOpen:x===K.property,onDropdownChange:ie=>A(ie?K.property:null)})}case"number":{if(!!ui[K.property])return Ee(xo,{modified:Te,children:Ee(ro,{property:K.property,value:X,onChange:ie=>pe(K.property,ie),isModified:Te,min:K.min,max:K.max,step:K.step||1,style:h(f({},Xe),{paddingRight:32}),unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:z,onUnitCycle:O})});let{num:te}=Mo(X);return Ee(xo,{modified:Te,children:Ee("input",{type:"number",value:te,min:K.min,max:K.max,step:K.step||1,onChange:ie=>pe(K.property,ie.target.value),style:Xe})})}case"select":return Ee(xo,{modified:Te,children:jt("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[Ee("select",{value:X,onChange:he=>pe(K.property,he.target.value),style:h(f({},Xe),{cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"}),children:(Pe=K.options)==null?void 0:Pe.map(he=>Ee("option",{value:he,children:he},he))}),Ee("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:Ee(ws,{size:12})})]})});case"spacing":return Ee(xo,{modified:Te,children:Ee("input",{type:"text",value:X,onChange:he=>pe(K.property,he.target.value),placeholder:"e.g., 10px or 10px 20px",style:Xe})});case"backdrop-filter":return Ee(Al,{value:X,onChange:he=>pe(K.property,he),accentColor:a,modified:Te,panelContentRef:c});default:return Ee(xo,{modified:Te,children:Ee("input",{type:"text",value:X,onChange:he=>pe(K.property,he.target.value),style:Xe})})}},Re=t.reactComponent||t.tagName,Ce={position:"fixed",top:W.current.top,left:W.current.left,width:280,maxHeight:W.current.maxHeight,backgroundColor:"#eaeaea",borderWidth:3,borderStyle:"solid",borderColor:"transparent",boxSizing:"content-box",zIndex:10002,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontSize:12,overflow:"visible",display:"flex",flexDirection:"column",opacity:p?1:0,transition:"opacity 150ms ease"},at={display:"flex",alignItems:"center",justifyContent:"space-between",margin:4,padding:"4px 5px 4px 10px",backgroundColor:a,color:"#ffffff",cursor:M.current?"grabbing":"grab",userSelect:"none",WebkitUserSelect:"none"},gt={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"12px 12px 6px",userSelect:"none",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontWeight:600,color:"#475569"},bt={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},Yt={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return Ee("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:W.current.top+ee.current.y,left:W.current.left+ee.current.x,zIndex:10002,pointerEvents:"none"},children:jt("div",{ref:d,"data-devtools":"panel",style:h(f({},Ce),{position:"relative",top:0,left:0,zIndex:0,pointerEvents:"auto"}),onMouseEnter:()=>s==null?void 0:s("element"),onMouseLeave:()=>s==null?void 0:s(null),children:[Ee("div",{"aria-hidden":"true",style:di()}),jt("div",{style:at,onMouseDown:V,children:[Ee("div",{style:{display:"flex",alignItems:"center",gap:3,overflow:"hidden",minWidth:0},children:Ee("span",{style:{fontWeight:600,fontSize:12,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:Re})}),Ee("button",{type:"button",onClick:i,title:"Close",style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1,flexShrink:0},children:"\xD7"})]}),jt("div",{ref:c,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[Ee("div",{style:{opacity:x?.3:1,transition:"opacity 150ms ease"},children:Ee(Dl,{element:e,getValue:D,getOriginalValue:I,handleChange:pe,isModified:we,onResetProperty:me,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:gt,activeDropdown:g,onDropdownChange:b,panelContentRef:c,accentColor:a,onFieldHover:s,preferredUnit:z,onUnitCycle:O})}),Ee("div",{style:{opacity:g?.3:1,transition:"opacity 150ms ease"},children:Ee(Fl,{element:e,getValue:D,handleChange:pe,isModified:we,onResetProperty:me,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:gt,accentColor:a,colorVariables:oe,activeColorDropdown:x,onColorDropdownChange:A,panelContentRef:c,preferredUnit:z,onUnitCycle:O})}),zl.map((K,X)=>{let Te=X===zl.length-1,Oe=x&&K.properties.some(Pe=>Pe.property===x);return jt("div",{style:{borderBottom:Te?"none":"1px solid rgba(0,0,0,0.08)",opacity:T&&!Oe?.3:1,transition:"opacity 150ms ease"},children:[Ee("div",{style:gt,children:Ee("span",{children:K.name})}),Ee("div",{style:{padding:"4px 0"},children:K.properties.map(Pe=>{let he=we(Pe.property),te=Oe&&Pe.property!==x;return jt("div",{style:h(f({},bt),{opacity:te?.3:1,transition:"opacity 150ms ease"}),children:[Ee("span",{onClick:he?()=>me(Pe.property):void 0,title:he?"Click to reset":void 0,style:h(f({},Yt),{color:he?a:"#64748b",fontWeight:he?600:400,cursor:he?"pointer":"default"}),children:Pe.label}),Ee("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:Je(Pe)})]},Pe.property)})})]},K.name)}),jt("div",{style:{opacity:T?.3:1,transition:"opacity 150ms ease"},children:[Ee("div",{style:gt,children:Ee("span",{children:"Raw CSS"})}),jt("div",{style:{padding:"8px 12px"},children:[Ee("textarea",{value:G,onChange:K=>re(K.target.value),placeholder:"property: value; ...",style:{width:"100%",height:60,padding:8,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"1px solid rgba(0,0,0,0.1)",borderRadius:2,resize:"vertical",outline:"none"}}),G.trim()&&Ee("button",{type:"button",onClick:Fe,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:a,color:"#fff",cursor:"pointer",opacity:G.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as pp,useLayoutEffect as fp,useState as gp}from"react";import{Fragment as bp,jsx as Xo,jsxs as yp}from"react/jsx-runtime";var Cs=["flex-start","center","flex-end"],Es=["flex-start","center","flex-end"];function mp(e){return e==="normal"||e==="flex-start"||e==="start"?"flex-start":e==="flex-end"||e==="end"?"flex-end":e==="center"?"center":null}function hp(e){return e==="normal"||e==="stretch"||e==="flex-start"||e==="start"?"flex-start":e==="flex-end"||e==="end"?"flex-end":e==="center"?"center":null}function Gl(e){let t=Array.from(e.children);if(t.length===0)return null;let n=1/0,o=1/0,r=-1/0,i=-1/0;for(let s of t){let a=s.getBoundingClientRect();a.width===0&&a.height===0||(a.top<n&&(n=a.top),a.left<o&&(o=a.left),a.bottom>r&&(r=a.bottom),a.right>i&&(i=a.right))}return n===1/0?null:new DOMRect(o,n,i-o,r-n)}function jl({element:e,modifier:t,accentColor:n,refreshKey:o=0}){let[r,i]=gp(null);if(pp(()=>{if(!e){i(null);return}let x=()=>i(Gl(e));return x(),window.addEventListener("scroll",x,{passive:!0}),window.addEventListener("resize",x,{passive:!0}),()=>{window.removeEventListener("scroll",x),window.removeEventListener("resize",x)}},[e]),fp(()=>{e&&i(Gl(e))},[e,o]),!r)return null;let s=r,a=window.getComputedStyle(e),l=a.display;if(l!=="flex"&&l!=="inline-flex")return null;let d=a.flexDirection,c=d==="column"||d==="column-reverse"?"vertical":"horizontal",p=c==="horizontal"?"vertical":"horizontal",u=[];if(t==="shift"){let x=mp(a.justifyContent);if(x){let A=Cs.indexOf(x);c==="horizontal"?(A>0&&u.push("left"),A<Cs.length-1&&u.push("right")):(A>0&&u.push("up"),A<Cs.length-1&&u.push("down"))}}else{let x=hp(a.alignItems);if(x){let A=Es.indexOf(x);p==="horizontal"?(A>0&&u.push("left"),A<Es.length-1&&u.push("right")):(A>0&&u.push("up"),A<Es.length-1&&u.push("down"))}}if(u.length===0)return null;let g=14,b=7;return Xo(bp,{children:u.map(x=>{let A,T;switch(x){case"right":A=s.right+g,T=s.top+s.height/2;break;case"left":A=s.left-g,T=s.top+s.height/2;break;case"down":A=s.left+s.width/2,T=s.bottom+g;break;case"up":A=s.left+s.width/2,T=s.top-g;break}let z=x==="right"?0:x==="left"?180:x==="down"?90:-90,P={position:"fixed",left:A-b,top:T-b,width:b*2,height:b*2,pointerEvents:"none",zIndex:9997};return Xo("div",{"data-devtools":"swipe-hint",style:P,children:Xo("svg",{width:b*2,height:b*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:yp("g",{transform:`rotate(${z})`,children:[Xo("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),Xo("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),Xo("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:n,strokeWidth:"1.5",strokeLinecap:"round"}),Xo("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:n,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},x)})})}import{useEffect as xp,useLayoutEffect as vp,useState as Sp}from"react";import{jsx as ks,jsxs as Ts}from"react/jsx-runtime";function wp(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function Yl({element:e,fontSize:t,lineHeight:n,accentColor:o,hoveredProperty:r,draggingProperty:i,cursorViewport:s}){let[a,l]=Sp(null);if(xp(()=>{if(!e){l(null);return}let T=()=>{l(hr(e))};return T(),window.addEventListener("scroll",T,{passive:!0}),window.addEventListener("resize",T,{passive:!0}),()=>{window.removeEventListener("scroll",T),window.removeEventListener("resize",T)}},[e]),vp(()=>{e&&l(hr(e))},[e,t,n]),!a)return null;let d=a.width,c=a.height,p=wp(o,.2),u=i!=null?i:r,g=8,b=2,x={position:"fixed",top:a.top,left:a.left,width:d,height:c,pointerEvents:"none",zIndex:9996,overflow:"visible"},A=T=>T==="font-size"?`${Math.round(t)}`:(t>0?n/t:1.2).toFixed(2).replace(/\.?0+$/,"");return Ts("div",{"data-devtools":"text-handles",style:x,children:[Ts("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${c}`,children:[ks("rect",{x:"0.5",y:"0.5",width:Math.max(0,d-1),height:Math.max(0,c-1),fill:"none",stroke:p,strokeWidth:"1"}),(u==="font-size"||!u)&&ks("rect",{x:d-b/2,y:c/2-g/2,width:b,height:g,fill:o,stroke:"#ffffff",strokeWidth:u==="font-size"?4:2,paintOrder:"stroke"}),(u==="line-height"||!u)&&ks("rect",{x:d/2-g/2,y:c-b/2,width:g,height:b,fill:o,stroke:"#ffffff",strokeWidth:u==="line-height"?4:2,paintOrder:"stroke"})]}),s&&u&&(()=>{let T=u==="font-size"?"Aa":"Lh",z=A(u);return Ts("div",{style:{position:"fixed",left:s.x+8,top:s.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:[T," ",z]})})()]})}import{Fragment as Er,jsx as ft,jsxs as Cr}from"react/jsx-runtime";var Jl=8,Ms=[0,1,2,4,8,12,16,20,24,28,32],Is="devtools-active-text";function Ul(e,t,n=0,o,r){let i=e.left+window.scrollX+4,s=t==="top-left"?e.top+window.scrollY-Jn-n*Jn+4:e.bottom+window.scrollY+4-1+n*Jn,a=window.scrollY+4,l=window.scrollY+window.innerHeight-Jn-4,d=90,c=!1;if(o&&r!==void 0){let p=o.getBoundingClientRect();if(e.left+4+r+4+d>p.left){let g=window.scrollY+p.top-Jn-4;g<l&&(l=g,c=!0)}}return s<a?s=e.top+window.scrollY+4:s>l&&(s=c?l:Math.max(e.top+window.scrollY+4,l)),{x:i,y:s}}function Vl({state:e,dispatch:t,onScreenshot:n,inFlightAnnotationIds:o,activeAnnotationIds:r,queuePositionMap:i,inFlightStyleSelectors:s,inFlightSelectorColors:a,onAttachImages:l,onReply:d,onViewThread:c,onCloseThread:p,onModelComponentsAdd:u,onModelComponentFocus:g,onModelComponentHover:b,modelComponentNames:x,modelPanelHoveredComponent:A,modelSpacingTokenHover:T,highlightedAnnotationIds:z,focusedThreadAnnotationId:P,externalCanvasRef:O,toolbarRef:k}){var Ks,qs,Zs,Qs,ea,ta,na,oa,ra;let{canvasRef:G,redrawAll:re,resizeCanvas:oe}=Va(),W=cn(m=>{G.current=m,O&&(O.current=m)},[O,G]),Q=Xt(!1);xn(()=>{let m=G.current;if(!m)return;let y=()=>{Q.current&&(Q.current=!1,m.style.pointerEvents="")},Z=L=>{L.button===0&&Q.current&&y()};return window.addEventListener("mousedown",Z),()=>window.removeEventListener("mousedown",Z)},[G]);let[N,ee]=vt(!1),[M,Le]=vt(()=>{if(typeof window=="undefined")return null;try{let m=localStorage.getItem(Is);return m?JSON.parse(m):null}catch(m){return null}}),[V,fe]=vt(null),[D,ae]=vt(null),[I,pe]=vt(null),me=Xt(null),Fe=Xt(null),we=Xt({x:0,y:0}),Je=Xt([]),Re=Xt(0),[Ce,at]=vt(null),[gt,bt]=vt(new Map),Yt=Xt(0),K=Xt(null),[X,Te]=vt(null),[Oe,Xe]=vt(null),[Pe,he]=vt(null),[te,ie]=vt(null),ve=Xt({isDragging:!1,side:null,startX:0,startY:0,original:{top:0,right:0,bottom:0,left:0},element:null,elementInfo:null,selector:null,durableSelector:null}),[Me,mt]=vt(null),[Ne,ze]=vt(null),[nt,St]=vt(null),[Ke,qe]=vt(null),Rt=Xt({x:0,y:0}),[_n,Kn]=vt({x:0,y:0}),vn=Xt({isDragging:!1,hasMoved:!1,axis:null,startX:0,startY:0,originalRow:0,originalColumn:0,element:null,elementInfo:null,selector:null,durableSelector:null,isAuto:!1,originalJustifyContent:"",visualGap:0}),[It,qn]=vt(null),[on,Zn]=vt(null),[xt,rn]=vt(null),[_t,sn]=vt(!1),[Nn,An]=vt(0),[Kt,Sn]=vt(null),bn=Xt({isDragging:!1,corner:null,startY:0,original:{"top-left":0,"top-right":0,"bottom-right":0,"bottom-left":0},maxRadius:0,element:null,elementInfo:null,selector:null,durableSelector:null}),[$,De]=vt(null),[Ge,En]=vt(null),[At,qt]=vt(null),wn=Xt({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[Wt,Gt]=vt(null),[Pn,Nt]=vt(null),[lt,Ht]=vt(null),Jt=Xa(),nr=Xt(a);nr.current=a;let go=cn(m=>{let y=nr.current;if(!y||y.size===0)return!1;for(let Z of y.keys())try{if(m.matches(Z))return!0}catch(L){}return!1},[]),Ao=Xt(e);Ao.current=e;let ao=Xt(M);ao.current=M;let mo=Xt([]),or=Xt(n);or.current=n;let[w,H]=vt(null),q=e.selectedAnnotationIds;mo.current=q;let ye=cn((m,y=!1)=>{t({type:"SELECT_ANNOTATION",payload:{id:m,addToSelection:y}})},[t]),de=cn(()=>{t({type:"SELECT_ANNOTATION",payload:{id:null}})},[t]),[ge,He]=vt(null),[Ie,je]=vt({x:window.scrollX,y:window.scrollY});xn(()=>(oe(),window.addEventListener("resize",oe),()=>window.removeEventListener("resize",oe)),[oe]),xn(()=>{let m=()=>{je({x:window.scrollX,y:window.scrollY})};return window.addEventListener("scroll",m,{passive:!0}),()=>window.removeEventListener("scroll",m)},[]),xn(()=>{M?localStorage.setItem(Is,JSON.stringify(M)):localStorage.removeItem(Is)},[M]),Ka(M,Le,V,e.annotations,t);let Pt=Xt(Ce);Pt.current=Ce,xn(()=>{if(e.activeTool!=="model"||!e.isAnnotating)return;let m=y=>{if(!y.altKey||!Pt.current)return;y.preventDefault();let Z=y.deltaY>0?-1:1;Yt.current=Math.max(0,Yt.current+Z);let L=K.current;if(L){let R=Qr(L,Yt.current);at(R)}};return window.addEventListener("wheel",m,{passive:!1}),()=>window.removeEventListener("wheel",m)},[e.activeTool,e.isAnnotating]),xn(()=>{e.activeTool!=="model"&&(at(null),bt(new Map),Yt.current=0,K.current=null)},[e.activeTool]),xn(()=>{var Z;let m=(Z=Ce==null?void 0:Ce.name)!=null?Z:null,y=m&&(x!=null&&x.has(m))?m:null;b==null||b(y)},[Ce,x,b]);let[Ft,un]=vt(null);xn(()=>{var Z;if(!A){un(null);return}let m=fr(A.name),y=A.instanceIndex;un((Z=m[y%m.length])!=null?Z:null)},[A]);let[S,C]=vt([]);xn(()=>{var m,y;if(!T){C([]);return}(y=(m=T.token)==null?void 0:m.bindings)!=null&&y.length?C(qi(T.token)):C(Xi(T.px))},[T]);let le=Xt(null),ce=Xt(null);le.current=It,ce.current=on,xn(()=>{let m=["flex-start","center","flex-end"],y=["flex-start","center","flex-end"],L=null,R=!1,j=null,ue=null,F=(be,_e)=>{let it=Go(be,_e);for(;it&&it!==document.documentElement;){let Ct=window.getComputedStyle(it).display;if(Ct==="flex"||Ct==="inline-flex")return it;it=it.parentElement}return null},ne=be=>{let _e=window.getComputedStyle(be).flexDirection;return _e==="column"||_e==="column-reverse"?"vertical":"horizontal"},v=be=>{let _e=be.getAttribute("data-pm");return _e||(_e=Math.random().toString(36).substring(2,8),be.setAttribute("data-pm",_e)),{selector:`[data-pm="${_e}"]`,durableSelector:Hn(be)}},E=()=>{R=!0,L&&clearTimeout(L),L=setTimeout(()=>{R=!1,L=null},300)},J=(be,_e,ct)=>{let it=ne(be);if(_e===it){let et=window.getComputedStyle(be).justifyContent,Bt=et==="normal"||et==="flex-start"||et==="start"?"flex-start":et==="flex-end"||et==="end"?"flex-end":et==="center"?"center":null;if(!Bt)return;let pn=m.indexOf(Bt)+ct;if(pn<0||pn>=m.length)return;let ho=m[pn],{selector:Bo,durableSelector:Oi}=v(be);Qe(be,"justify-content",ho),t({type:"MODIFY_STYLES_BATCH",payload:{selector:Bo,durableSelector:Oi,element:Ln(be),changes:[{property:"justify-content",original:et,modified:ho}]}})}else{let et=window.getComputedStyle(be).flexDirection,Bt=it==="horizontal"?"column":"row",{selector:eo,durableSelector:pn}=v(be);Qe(be,"flex-direction",Bt),t({type:"MODIFY_STYLES_BATCH",payload:{selector:eo,durableSelector:pn,element:Ln(be),changes:[{property:"flex-direction",original:et,modified:Bt}]}})}An(Ct=>Ct+1)},B=(be,_e,ct)=>{let Ct=ne(be)==="horizontal"?"vertical":"horizontal";if(_e!==Ct)return;let Bt=window.getComputedStyle(be).alignItems,eo=Bt==="normal"||Bt==="stretch"||Bt==="flex-start"||Bt==="start"?"flex-start":Bt==="flex-end"||Bt==="end"?"flex-end":Bt==="center"?"center":null;if(!eo)return;let ho=y.indexOf(eo)+ct;if(ho<0||ho>=y.length)return;let Bo=y[ho],{selector:Oi,durableSelector:$c}=v(be);Qe(be,"align-items",Bo),t({type:"MODIFY_STYLES_BATCH",payload:{selector:Oi,durableSelector:$c,element:Ln(be),changes:[{property:"align-items",original:Bt,modified:Bo}]}}),An(zc=>zc+1)},_=20,Y=null,U=null,xe=0,$e=(be,_e,ct)=>{let it=F(_e,ct);Sn(it?{modifier:be,target:it}:null)},tt=be=>{if(!(e.activeTool!=="hand"||!e.isAnnotating)){if(be.key==="Shift"&&!be.altKey){let _e=Rt.current;$e("shift",_e.x,_e.y)}else if(be.key==="Alt"&&!be.shiftKey){let _e=Rt.current;$e("alt",_e.x,_e.y)}}},ot=be=>{if(e.activeTool!=="hand"||!e.isAnnotating)return;let _e=be.shiftKey&&!be.altKey,ct=be.altKey&&!be.shiftKey;if(!_e&&!ct||be.buttons!==0){Y=null,U=null,xe=0,j=null,ue=null,Sn(null);return}if(j===null&&(j=be.clientX,ue=be.clientY,$e(_e?"shift":"alt",be.clientX,be.clientY)),R)return;Y===null&&(Y=be.clientX,U=be.clientY,xe=0);let it=be.clientX-Y,Ct=be.clientY-U,et=Math.abs(it)>=Math.abs(Ct)?it:Ct;if(Math.abs(et)>3){let Bo=et>0?1:-1;if(xe!==0&&Bo!==xe){Y=be.clientX,U=be.clientY,xe=0;return}xe=Bo}if(Math.abs(it)<_&&Math.abs(Ct)<_)return;let Bt=F(j,ue);if(!Bt)return;let eo=Math.abs(it)>=Math.abs(Ct)?"horizontal":"vertical",ho=(eo==="horizontal"?it:Ct)>0?1:-1;Y=null,U=null,xe=0,_e?J(Bt,eo,ho):B(Bt,eo,ho),E()},$t=be=>{(be.key==="Shift"||be.key==="Alt")&&(j=null,ue=null,Y=null,U=null,xe=0,Sn(null))},rt=()=>{Sn(null),Y=null,U=null,xe=0};return window.addEventListener("keydown",tt),window.addEventListener("mousemove",ot),window.addEventListener("mousedown",rt),window.addEventListener("keyup",$t),()=>{window.removeEventListener("keydown",tt),window.removeEventListener("mousemove",ot),window.removeEventListener("mousedown",rt),window.removeEventListener("keyup",$t),L&&clearTimeout(L)}},[e.activeTool,e.isAnnotating,t]),xn(()=>{let m=y=>{var j,ue,F,ne;if(y.key==="Escape"){if(ao.current)return;if(e.activeTool==="model"&&gt.size>0){y.preventDefault(),bt(new Map);return}if(mo.current.length>0){y.preventDefault(),de();return}}if(y.key==="Enter"&&e.activeTool==="model"&&gt.size>0&&u){y.preventDefault();let v=[...gt.keys()].filter(E=>!(x!=null&&x.has(E)));v.length>0&&u(v),bt(new Map);return}if((y.metaKey||y.ctrlKey)&&y.key==="v"&&Je.current.length>0&&!ao.current){y.preventDefault(),Re.current++;let v=Re.current*20,J=((j=Je.current[0])==null?void 0:j.groupId)?Math.random().toString(36).substring(2,9):void 0,B=Je.current.map(Y=>h(f({},Y),{id:Math.random().toString(36).substring(2,9),groupId:Y.groupId?J:void 0,timestamp:Date.now(),points:Y.points.map(U=>({x:U.x+v,y:U.y+v}))}));t({type:"PASTE_ANNOTATIONS",payload:{annotations:B}});let _=B.find(Y=>Y.type!=="text")||B[0];_&&ye(_.id);return}let Z=mo.current;if(Z.length===0||ao.current)return;let L=(F=(ue=y.composedPath)==null?void 0:ue.call(y)[0])!=null?F:y.target,R=L==null?void 0:L.tagName;if(!(R==="INPUT"||R==="TEXTAREA"||L!=null&&L.isContentEditable)&&(y.key==="Delete"||y.key==="Backspace")){if(y.preventDefault(),p){let v=Ao.current.annotations;for(let E of Z){let J=v.find(_=>_.id===E);if(!J)continue;let B=J.threadId||J.groupId&&((ne=v.find(_=>_.groupId===J.groupId&&_.threadId))==null?void 0:ne.threadId);B&&p(B)}}for(let v of Z)t({type:"DELETE_ANNOTATION",payload:{id:v}});de()}};return window.addEventListener("keydown",m),()=>window.removeEventListener("keydown",m)},[t,de,ye,e.activeTool,gt,x,u,p]);let Ae=cr(),ke=bi(()=>e.annotations.filter(m=>!m.pathname||m.pathname===Ae),[e.annotations,Ae]),Ue=bi(()=>ci(e.annotations),[e.annotations]),Ye=bi(()=>{let m=new Map,y=new Set,Z=1,L=[...e.annotations].sort((R,j)=>R.timestamp-j.timestamp);for(let R of L)if(!Ue.has(R))if(R.groupId){if(!y.has(R.groupId)){y.add(R.groupId);let j=e.annotations.filter(ue=>ue.groupId===R.groupId);for(let ue of j)m.set(ue.id,Z);Z++}}else m.set(R.id,Z),Z++;return m},[e.annotations,Ue]),Et=bi(()=>{if(q.length===0)return null;let m=new Map;for(let y of q){let Z=e.annotations.find(R=>R.id===y);if(!Z)continue;let L=Z.groupId?e.annotations.filter(R=>R.groupId===Z.groupId):[Z];for(let R of L)if(R.linkedSelector&&!(a!=null&&a.has(R.linkedSelector))){let j=R.color||e.activeColor;m.set(R.linkedSelector,j)}}return m.size>0?m:null},[q,e.annotations,e.activeColor,a]);xn(()=>{let m=ke.filter(y=>!(Ue.has(y)||M&&!M.isNew&&y.id===M.id));re(m,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,q,Jl,Ie.x,Ie.y,Ye,z)},[ke,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,re,M,q,Ie,Ye,Ue,z]),xn(()=>{if(D){let m=Math.random().toString(36).substring(2,9);Le({id:m,point:D.point,text:"",fontSize:12,isNew:!0,groupId:D.groupId}),ae(null)}},[D]),xn(()=>{I&&(Le({id:Math.random().toString(36).substring(2,9),point:I.point,text:"",fontSize:12,isNew:!0,linkedSelector:I.linkedSelector,linkedAnchor:I.linkedAnchor,elements:I.elements}),pe(null))},[I]);let wt=Xt(null),ht=(Ks=M==null?void 0:M.id)!=null?Ks:null;xn(()=>{ht&&me.current?requestAnimationFrame(()=>{var Z;let m=me.current;if(!m||(m.focus(),Fe.current===ht))return;Fe.current=ht;let y=ao.current;if(y){if(wt.current!==null){let L=Math.min(wt.current,m.value.length);m.setSelectionRange(L,L);return}if(!y.isNew&&y.clickPoint){let L=G.current;if(!L)return;let R=L.getContext("2d");if(!R)return;R.font=`${y.fontSize}px ${Qt}`;let j=y.fontSize*1.4,ue=y.text.split(`
4
+ `),F=y.clickPoint.y-y.point.y,ne=Math.max(0,Math.min(ue.length-1,Math.floor(F/j))),v=y.clickPoint.x-y.point.x,E=ue[ne]||"",J=0;for(let _=0;_<=E.length;_++){let Y=R.measureText(E.substring(0,_)).width;if(Y>v){let U=_>0?R.measureText(E.substring(0,_-1)).width:0;J=v-U<Y-v?_-1:_;break}J=_}let B=J;for(let _=0;_<ne;_++)B+=(((Z=ue[_])==null?void 0:Z.length)||0)+1;m.setSelectionRange(B,B)}}}):(Fe.current=null,wt.current=null)},[ht,G]);let kt=cn(m=>{let y=G.current;if(!y)return{x:0,y:0};let Z=y.getBoundingClientRect(),L,R;if("touches"in m&&m.touches[0])L=m.touches[0].clientX,R=m.touches[0].clientY;else if("clientX"in m)L=m.clientX,R=m.clientY;else return{x:0,y:0};return{x:L-Z.left+window.scrollX,y:R-Z.top+window.scrollY}},[G]),ut=cn((m,y,Z,L)=>{let R=Z.x-y.x,j=Z.y-y.y,ue=R*R+j*j;if(ue===0)return Math.sqrt((m.x-y.x)**2+(m.y-y.y)**2)<=L;let F=Math.max(0,Math.min(1,((m.x-y.x)*R+(m.y-y.y)*j)/ue)),ne=y.x+F*R,v=y.y+F*j;return Math.sqrt((m.x-ne)**2+(m.y-v)**2)<=L},[]),Ut=cn(m=>{for(let Z=ke.length-1;Z>=0;Z--){let L=ke[Z];if(!L||Ue.has(L))continue;let R=(L.strokeWidth||3)+4;switch(L.type){case"text":{if(!L.points[0]||!L.text)continue;let j=L.points[0],ue=L.fontSize||12,F=G.current;if(F){let ne=F.getContext("2d");if(ne){ne.font=`${ue}px ${Qt}`;let v=L.text.replace(/\n/g," "),E=j.x-Ie.x,J=dr(E),B=ur(ne,v,J),_=ne.measureText(B).width,Y=ue*1.4;if(m.x>=j.x-4-4&&m.x<=j.x+_+4+4&&m.y>=j.y-4-4&&m.y<=j.y+Y+4+4)return L}}break}case"rectangle":{if(L.points.length<2)continue;let j=L.points[0],ue=L.points[L.points.length-1],F=Math.min(j.x,ue.x),ne=Math.max(j.x,ue.x),v=Math.min(j.y,ue.y),E=Math.max(j.y,ue.y),J=ut(m,{x:F,y:v},{x:ne,y:v},R),B=ut(m,{x:F,y:E},{x:ne,y:E},R),_=ut(m,{x:F,y:v},{x:F,y:E},R),Y=ut(m,{x:ne,y:v},{x:ne,y:E},R);if(J||B||_||Y)return L;break}case"circle":{if(L.points.length<2)continue;let j=L.points[0],ue=L.points[L.points.length-1],F=(j.x+ue.x)/2,ne=(j.y+ue.y)/2,v=Math.abs(ue.x-j.x)/2,E=Math.abs(ue.y-j.y)/2,J=m.x-F,B=m.y-ne,_=Math.sqrt((J/v)**2+(B/E)**2);if(Math.abs(_-1)*Math.max(v,E)<=R)return L;break}case"line":{if(L.points.length<2)continue;let j=L.points[0],ue=L.points[L.points.length-1];if(ut(m,j,ue,R))return L;break}case"freehand":{if(L.points.length<2)continue;for(let j=0;j<L.points.length-1;j++){let ue=L.points[j],F=L.points[j+1];if(ut(m,ue,F,R))return L}break}}}return null},[ke,G,ut,Ue,Ie.x]),Qn=cn(m=>{let y=Ut(m);return(y==null?void 0:y.type)==="text"?y:null},[Ut]),kn=cn(m=>{if(q.length===0)return null;let y=Jl/2+4;for(let Z of q){let L=e.annotations.find(R=>R.id===Z);if(!(!L||L.points.length<2)){if(L.type==="line"){let R=L.points[0],j=L.points[L.points.length-1];if(Math.sqrt((m.x-R.x)**2+(m.y-R.y)**2)<=y)return{handle:"start",annotationId:Z};if(Math.sqrt((m.x-j.x)**2+(m.y-j.y)**2)<=y)return{handle:"end",annotationId:Z};continue}if(L.type==="circle"){let R=L.points[0],j=L.points[L.points.length-1],ue=Math.min(R.x,j.x),F=Math.max(R.x,j.x),ne=Math.min(R.y,j.y),v=Math.max(R.y,j.y),E=(ue+F)/2,J=(ne+v)/2,B=[{handle:"top",x:E,y:ne},{handle:"bottom",x:E,y:v},{handle:"left",x:ue,y:J},{handle:"right",x:F,y:J}];for(let{handle:_,x:Y,y:U}of B)if(Math.sqrt((m.x-Y)**2+(m.y-U)**2)<=y)return{handle:_,annotationId:Z};continue}if(L.type==="rectangle"||L.type==="freehand"){let R=L.points[0],j=L.points[L.points.length-1],ue,F,ne,v;L.type==="freehand"?(ue=Math.min(...L.points.map(J=>J.x)),F=Math.max(...L.points.map(J=>J.x)),ne=Math.min(...L.points.map(J=>J.y)),v=Math.max(...L.points.map(J=>J.y))):(ue=Math.min(R.x,j.x),F=Math.max(R.x,j.x),ne=Math.min(R.y,j.y),v=Math.max(R.y,j.y));let E=[{corner:"topLeft",x:ue,y:ne},{corner:"topRight",x:F,y:ne},{corner:"bottomLeft",x:ue,y:v},{corner:"bottomRight",x:F,y:v}];for(let{corner:J,x:B,y:_}of E)if(Math.sqrt((m.x-B)**2+(m.y-_)**2)<=y)return{handle:J,annotationId:Z}}}}return null},[q,e.annotations]);xn(()=>{let m=y=>{if(we.current={x:y.clientX+window.scrollX,y:y.clientY+window.scrollY},!M){let Z=Qn(we.current);fe((Z==null?void 0:Z.id)||null)}};return window.addEventListener("mousemove",m),()=>window.removeEventListener("mousemove",m)},[M,Qn]);let Vt=cn(()=>{var y;if(!M)return;let m=((y=M.images)==null?void 0:y.length)||0;if(M.text.trim()||m>0)if(M.isNew){let Z=Kr();t({type:"ADD_TEXT",payload:f({point:M.point,text:M.text||(m>0?`[${m} image${m>1?"s":""}]`:""),fontSize:M.fontSize,id:Z,groupId:M.groupId,linkedSelector:M.linkedSelector,linkedAnchor:M.linkedAnchor,elements:M.elements},m>0?{imageCount:m}:{})}),m>0&&M.images&&l&&l(Z,M.images)}else t({type:"UPDATE_TEXT",payload:f({id:M.id,text:M.text||(m>0?`[${m} image${m>1?"s":""}]`:"")},m>0?{imageCount:m}:{})}),m>0&&M.images&&l&&l(M.id,M.images);else M.isNew||t({type:"DELETE_ANNOTATION",payload:{id:M.id}});Le(null)},[M,t,l]),pt=cn(m=>{for(let y=0;y<Ms.length-1;y++){let Z=Ms[y],L=Ms[y+1];if(m<=(Z+L)/2)return Z;if(m<L)return L}return Math.round(m/8)*8},[]),Cn=cn((m,y,Z,L)=>{let R=Z.top+Math.max(L.top,4),j=Z.bottom-Math.max(L.bottom,4),ue=Z.left+Math.max(L.left,4),F=Z.right-Math.max(L.right,4);if(m<Z.left||m>Z.right||y<Z.top||y>Z.bottom)return null;let ne=y<R,v=y>j,E=m<ue,J=m>F;return ne&&E?L.top>=L.left?"top":"left":ne&&J?L.top>=L.right?"top":"right":v&&E?L.bottom>=L.left?"bottom":"left":v&&J?L.bottom>=L.right?"bottom":"right":ne?"top":v?"bottom":E?"left":J?"right":null},[]),Ze=cn(m=>{var j,ue;if(!e.isAnnotating)return;if(e.inspectedElement&&e.activeTool==="hand"&&!("button"in m&&m.button===2)){m.preventDefault(),m.stopPropagation(),t({type:"SELECT_ELEMENT",payload:null});return}let y=kt(m),Z="shiftKey"in m&&m.shiftKey;if(e.activeTool==="inspector"){if("button"in m&&m.button===2)return;if(X&&!go(X)){let F=e.annotations.find(tt=>{if(!tt.linkedSelector||!tt.threadId)return!1;try{return X.matches(tt.linkedSelector)}catch(ot){return!1}});if(F!=null&&F.threadId&&c){c(F.threadId),requestAnimationFrame(()=>{var $t;let tt=document.querySelector("[data-popmelt-shadow-host]"),ot=($t=tt==null?void 0:tt.shadowRoot)==null?void 0:$t.querySelector("[data-popmelt-reply]");ot==null||ot.focus()});return}let ne=Ln(X),v=Hn(X),E=X.getBoundingClientRect(),J=X.getAttribute("data-pm");J||(J=Math.random().toString(36).substring(2,8),X.setAttribute("data-pm",J));let B=`[data-pm="${J}"]`,_=e.styleModifications.some(tt=>{try{return X.matches(tt.selector)}catch(ot){return!1}}),Y=e.annotations.filter(tt=>{if(!tt.linkedSelector)return!1;try{return X.matches(tt.linkedSelector)}catch(ot){return!1}}).length,U=(_?1:0)+Y,xe=E.top>=Jn*(1+U)?"top-left":"bottom-left",$e=Ul(E,xe,U,k==null?void 0:k.current);pe({point:$e,linkedSelector:B,linkedAnchor:xe,elements:[h(f({},ne),{selector:v})]})}return}if(e.activeTool==="model"){if("button"in m&&m.button===2)return;if(Ce){let F=Ce.name;if(x!=null&&x.has(F)){g==null||g(F);return}"shiftKey"in m&&m.shiftKey?bt(v=>{let E=new Map(v);return E.has(F)?E.delete(F):E.set(F,Ce),E}):gt.size===1&&gt.has(F)?(u&&u([F]),bt(new Map)):bt(new Map([[F,Ce]]))}return}if(e.activeTool==="hand"&&It&&on){let F=It,ne=F.getAttribute("data-pm");ne||(ne=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",ne));let v=Hn(F),E=`[data-pm="${ne}"]`,J=Ln(F),B=jo(F),_=y.x-window.scrollX,Y=y.y-window.scrollY,U=_t,xe=window.getComputedStyle(F).justifyContent,$e=0;if(U){let ot=yo(F).find($t=>$t.axis===on);$e=ot?on==="column"?ot.w:ot.h:0}Qe(F,"transition","none"),vn.current={isDragging:!0,hasMoved:!1,axis:on,startX:_,startY:Y,originalRow:U?$e:B.row,originalColumn:U?$e:B.column,element:F,elementInfo:h(f({},J),{selector:E}),selector:E,durableSelector:v,isAuto:U,originalJustifyContent:xe,visualGap:$e},rn({axis:on,row:U?$e:B.row,column:U?$e:B.column});return}if(e.activeTool==="hand"&&Wt&&Pn){let F=Wt,ne=F.getAttribute("data-pm");ne||(ne=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",ne));let v=`[data-pm="${ne}"]`,E=Ln(F),{fontSize:J,lineHeight:B}=Br(F),_=J>0?B/J:1.2,Y=y.x-window.scrollX,U=y.y-window.scrollY;Qe(F,"transition","none");let xe=Hn(F);wn.current={isDragging:!0,property:Pn,startX:Y,startY:U,originalFontSize:J,originalLineHeight:B,originalRatio:_,element:F,elementInfo:h(f({},E),{selector:v}),selector:v,durableSelector:xe},Ht({property:Pn,fontSize:J,lineHeight:B});return}if(e.activeTool==="hand"&&$&&Ge){let F=$,ne=F.getAttribute("data-pm");ne||(ne=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",ne));let v=`[data-pm="${ne}"]`,E=Hn(F),J=Ln(F),B=Yo(F),_=F.getBoundingClientRect(),Y=Math.floor(_.height/2),U=y.y-window.scrollY;Qe(F,"transition","none"),bn.current={isDragging:!0,corner:Ge,startY:U,original:B,maxRadius:Y,element:F,elementInfo:h(f({},J),{selector:v}),selector:v,durableSelector:E},qt({corner:Ge,radius:f({},B)});return}if(e.activeTool==="hand"&&Me&&Ne){let F=Me,ne=F.getAttribute("data-pm");ne||(ne=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",ne));let v=`[data-pm="${ne}"]`,E=Hn(F),J=Ln(F),B=mr(F),_=y.x-window.scrollX,Y=y.y-window.scrollY;Qe(F,"transition","none"),ve.current={isDragging:!0,side:Ne,startX:_,startY:Y,original:B,element:F,elementInfo:h(f({},J),{selector:v}),selector:v,durableSelector:E},qe({side:Ne,padding:f({},B)});return}let L=kn(y);if(L){let F=e.annotations.find(ne=>ne.id===L.annotationId);if(F&&F.type!=="text"&&((j=F.status)!=null?j:"pending")==="pending"){He({annotationId:L.annotationId,handle:L.handle,startPoint:y,originalPoints:[...F.points],hasMoved:!1});return}}let R=Ut(y);if(R&&R.points[0]){if(M&&Vt(),R.type!=="text"?(ye(R.id,Z),R.color&&t({type:"SET_COLOR",payload:R.color})):Z||de(),c){let F=R.threadId||(R.groupId?(ue=e.annotations.find(ne=>ne.groupId===R.groupId&&ne.threadId))==null?void 0:ue.threadId:void 0);F&&c(F)}H({annotation:R,startPoint:y,hasMoved:!1});return}if(Z||de(),e.activeTool==="text"){M&&Vt();let F=Math.random().toString(36).substring(2,9);Le({id:F,point:y,text:"",fontSize:12,isNew:!0});return}ee(!0),t({type:"START_PATH",payload:y})},[e.isAnnotating,e.activeTool,e.inspectedElement,e.annotations,M,q,X,Me,Ne,$,Ge,It,on,_t,Wt,Pn,Ce,gt,x,u,g,c,kt,Ut,kn,t,ye,de,Vt]),Ot=cn(m=>{var Z,L;let y=kt(m);if(e.activeTool==="inspector"&&e.isAnnotating){let R=y.x-window.scrollX,j=y.y-window.scrollY,ue=Go(R,j),F=ue&&go(ue)?null:ue;F!==X&&(Te(F),Xe(F?Ln(F):null));return}if(e.activeTool==="model"&&e.isAnnotating){let R=y.x-window.scrollX,j=y.y-window.scrollY,ue=Go(R,j);if(ue!==K.current&&(K.current=ue,Yt.current=0),ue){let F=Qr(ue,Yt.current);at(F)}else at(null);return}if(e.activeTool==="hand"&&e.isAnnotating){let R=y.x-window.scrollX,j=y.y-window.scrollY;Rt.current={x:R,y:j},Kn({x:R,y:j});let ue=Jt.current.cmd,F=Jt.current.shift;if(vn.current.isDragging){let v=vn.current,E=v.element;if(!E)return;if(!v.hasMoved){let Y=Math.abs(R-v.startX),U=Math.abs(j-v.startY);if(Y<=2&&U<=2)return;v.hasMoved=!0,v.isAuto&&(Qe(E,"justify-content","normal"),Qe(E,"row-gap",`${v.visualGap}px`),Qe(E,"column-gap",`${v.visualGap}px`),sn(!1))}let J=v.axis,B=v.originalRow,_=v.originalColumn;if(J==="column"){let Y=R-v.startX;_=v.originalColumn+Y,ue||(B=v.originalRow+Y)}else{let Y=j-v.startY;B=v.originalRow+Y,ue||(_=v.originalColumn+Y)}B=Math.max(0,B),_=Math.max(0,_),F&&(B=pt(B),_=pt(_)),B=Math.round(B),_=Math.round(_),Qe(E,"row-gap",`${B}px`),Qe(E,"column-gap",`${_}px`),rn({axis:J,row:B,column:_});return}if(bn.current.isDragging){let v=bn.current,E=v.element;if(!E)return;let J=j-v.startY,B=v.corner,_=v.original,Y=f({},_);if(ue){let U=_[B]+J;U=Math.max(0,Math.min(v.maxRadius,U)),F&&(U=pt(U)),U=Math.round(U),Y[B]=U}else{let U=_[B]+J;U=Math.max(0,Math.min(v.maxRadius,U)),F&&(U=pt(U)),U=Math.round(U),Y={"top-left":U,"top-right":U,"bottom-right":U,"bottom-left":U}}Qe(E,"border-top-left-radius",`${Y["top-left"]}px`),Qe(E,"border-top-right-radius",`${Y["top-right"]}px`),Qe(E,"border-bottom-right-radius",`${Y["bottom-right"]}px`),Qe(E,"border-bottom-left-radius",`${Y["bottom-left"]}px`),qt({corner:B,radius:Y});return}if(wn.current.isDragging){let v=wn.current,E=v.element;if(!E)return;let J=v.property,B=v.originalFontSize,_=v.originalLineHeight,Y=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(J==="font-size"){let xe=R-v.startX;B=v.originalFontSize+xe,B=Math.max(1,B)}else{let xe=j-v.startY;_=v.originalLineHeight+xe,_=Math.max(B,_)}if(F)if(J==="font-size"){let xe=Y[0],$e=Math.abs(B-xe);for(let tt of Y){let ot=Math.abs(B-tt);ot<$e&&(xe=tt,$e=ot)}B=xe}else{let xe=B>0?_/B:1.2,$e=Math.round(xe*2)/2;_=B*Math.max(1,$e)}B=Math.round(B),_=Math.round(_*10)/10,Qe(E,"font-size",`${B}px`);let U=B>0?Math.round(_/B*1e3)/1e3:1.2;Qe(E,"line-height",`${U}`),Ht({property:J,fontSize:B,lineHeight:_});return}if(ve.current.isDragging){let v=ve.current,E=v.element;if(!E)return;let J=v.side,B=v.original,_=B.top,Y=B.right,U=B.bottom,xe=B.left;if(J==="top"){let $e=v.startY-j;_=B.top+$e,ue||(U=B.bottom+$e)}else if(J==="bottom"){let $e=j-v.startY;U=B.bottom+$e,ue||(_=B.top+$e)}else if(J==="left"){let $e=v.startX-R;xe=B.left+$e,ue||(Y=B.right+$e)}else if(J==="right"){let $e=R-v.startX;Y=B.right+$e,ue||(xe=B.left+$e)}_=Math.max(0,_),Y=Math.max(0,Y),U=Math.max(0,U),xe=Math.max(0,xe),F&&(_=pt(_),Y=pt(Y),U=pt(U),xe=pt(xe)),_=Math.round(_),Y=Math.round(Y),U=Math.round(U),xe=Math.round(xe),Qe(E,"padding",`${_}px ${Y}px ${U}px ${xe}px`),qe({side:J,padding:{top:_,right:Y,bottom:U,left:xe}});return}let ne=Go(R,j);for(;ne&&ne.tagName==="A";)ne=ne.parentElement;{let E=[];ne&&E.push(ne),$&&$!==ne&&E.push($);let J=null,B=16,_=null;for(let Y of E){let U=Y.getBoundingClientRect(),xe=Yo(Y),$e=[["top-left",U.left,U.top+xe["top-left"]],["top-right",U.right,U.top+xe["top-right"]],["bottom-right",U.right,U.bottom-xe["bottom-right"]],["bottom-left",U.left,U.bottom-xe["bottom-left"]]];for(let[tt,ot,$t]of $e){let rt=Math.hypot(R-ot,j-$t);rt<B&&(B=rt,J=tt,_=Y)}}if(J&&_){De(_),En(J),Me&&mt(null),Ne&&ze(null),It&&qn(null),on&&Zn(null),sn(!1),Wt&&Gt(null),Pn&&Nt(null);return}}$&&De(null),Ge&&En(null);{let v=[];ne&&oi(ne)&&v.push(ne);let E=(Z=ne==null?void 0:ne.parentElement)!=null?Z:null;for(;E&&E!==document.body&&v.length<3;)oi(E)&&v.push(E),E=E.parentElement;for(let J of v){let _=yo(J).find(Y=>R>=Y.x&&R<=Y.x+Y.w&&j>=Y.y&&j<=Y.y+Y.h);if(_){qn(J),Zn(_.axis),sn(Qi(J,_.axis)),Me&&mt(null),Ne&&ze(null),Wt&&Gt(null),Pn&&Nt(null);return}}}It&&qn(null),on&&Zn(null),sn(!1);{let E=[];ne&&E.push(ne),Wt&&Wt!==ne&&E.push(Wt);let J=null,B=1/0,_=null;for(let Y of E){if(!es(Y))continue;let U=hr(Y);if(!U)continue;let xe=R>=U.left&&R<=U.right&&j>=U.top&&j<=U.bottom,$e=[["font-size",U.right,U.top+U.height/2],["line-height",U.left+U.width/2,U.bottom]];for(let[tt,ot,$t]of $e){let rt=Math.hypot(R-ot,j-$t);(xe||rt<12)&&rt<B&&(B=rt,J=tt,_=Y)}}J&&_?(Gt(_),Nt(J)):(Wt&&Gt(null),Pn&&Nt(null))}if(ne!==Me&&mt(ne),ne){let v=mr(ne),E=ne.getBoundingClientRect(),J=Cn(R,j,E,v);ze(J)}else ze(null);return}if(ge){let{handle:R,originalPoints:j,hasMoved:ue}=ge,F=e.annotations.find(B=>B.id===ge.annotationId);if(!F)return;let ne="metaKey"in m,v=ne&&(m.metaKey||m.ctrlKey),E=ne&&m.shiftKey,J;if(F.type==="line"){let B=j[0],_=j[j.length-1];R==="start"?J=[y,_]:J=[B,y]}else if(F.type==="freehand"){let B=Math.min(...j.map(et=>et.x)),_=Math.max(...j.map(et=>et.x)),Y=Math.min(...j.map(et=>et.y)),U=Math.max(...j.map(et=>et.y)),xe=(B+_)/2,$e=(Y+U)/2,tt=_-B||1,ot=U-Y||1,$t=tt/ot,rt=B,be=_,_e=Y,ct=U;switch(R){case"topLeft":rt=y.x,_e=y.y;break;case"topRight":be=y.x,_e=y.y;break;case"bottomLeft":rt=y.x,ct=y.y;break;case"bottomRight":be=y.x,ct=y.y;break}if(v)switch(R){case"topLeft":be=_+(B-rt),ct=U+(Y-_e);break;case"topRight":rt=B-(be-_),ct=U+(Y-_e);break;case"bottomLeft":be=_+(B-rt),_e=Y-(ct-U);break;case"bottomRight":rt=B-(be-_),_e=Y-(ct-U);break}if(E){let et=be-rt,Bt=ct-_e;if(Math.abs(et/Bt)>$t){let pn=Math.abs(Bt)*$t*Math.sign(et);R==="topLeft"||R==="bottomLeft"?rt=be-pn:be=rt+pn}else{let pn=Math.abs(et)/$t*Math.sign(Bt);R==="topLeft"||R==="topRight"?_e=ct-pn:ct=_e+pn}}let it=be-rt||1,Ct=ct-_e||1;J=j.map(et=>({x:rt+(et.x-B)/tt*it,y:_e+(et.y-Y)/ot*Ct}))}else if(F.type==="circle"){let B=j[0],_=j[j.length-1],Y=Math.min(B.x,_.x),U=Math.max(B.x,_.x),xe=Math.min(B.y,_.y),$e=Math.max(B.y,_.y),tt=(Y+U)/2,ot=(xe+$e)/2,$t=U-Y,rt=$e-xe,be=Y,_e=U,ct=xe,it=$e;switch(R){case"top":if(ct=y.y,v&&(it=ot+(ot-y.y)),E){let et=(it-ct)*($t/rt)/2;be=tt-et,_e=tt+et}break;case"bottom":if(it=y.y,v&&(ct=ot-(y.y-ot)),E){let et=(it-ct)*($t/rt)/2;be=tt-et,_e=tt+et}break;case"left":if(be=y.x,v&&(_e=tt+(tt-y.x)),E){let et=(_e-be)*(rt/$t)/2;ct=ot-et,it=ot+et}break;case"right":if(_e=y.x,v&&(be=tt-(y.x-tt)),E){let et=(_e-be)*(rt/$t)/2;ct=ot-et,it=ot+et}break}J=[{x:be,y:ct},{x:_e,y:it}]}else{let B=j[0],_=j[j.length-1],Y=Math.min(B.x,_.x),U=Math.max(B.x,_.x),xe=Math.min(B.y,_.y),$e=Math.max(B.y,_.y),tt=(Y+U)/2,ot=(xe+$e)/2,$t=U-Y||1,rt=$e-xe||1,be=$t/rt,_e=Y,ct=U,it=xe,Ct=$e;switch(R){case"topLeft":_e=y.x,it=y.y;break;case"topRight":ct=y.x,it=y.y;break;case"bottomLeft":_e=y.x,Ct=y.y;break;case"bottomRight":ct=y.x,Ct=y.y;break}if(v)switch(R){case"topLeft":ct=U+(Y-_e),Ct=$e+(xe-it);break;case"topRight":_e=Y-(ct-U),Ct=$e+(xe-it);break;case"bottomLeft":ct=U+(Y-_e),it=xe-(Ct-$e);break;case"bottomRight":_e=Y-(ct-U),it=xe-(Ct-$e);break}if(E){let et=ct-_e,Bt=Ct-it;if(Math.abs(et/Bt)>be){let pn=Math.abs(Bt)*be*Math.sign(et);R==="topLeft"||R==="bottomLeft"?_e=ct-pn:ct=_e+pn}else{let pn=Math.abs(et)/be*Math.sign(Bt);R==="topLeft"||R==="topRight"?it=Ct-pn:Ct=it+pn}}J=[{x:_e,y:it},{x:ct,y:Ct}]}t({type:"RESIZE_ANNOTATION",payload:{id:ge.annotationId,points:J,saveUndo:!ue}}),ue||He(h(f({},ge),{hasMoved:!0}));return}if(w&&((L=w.annotation.status)!=null?L:"pending")==="pending"){let R=y.x-w.startPoint.x,j=y.y-w.startPoint.y;if((Math.abs(R)>2||Math.abs(j)>2)&&!w.hasMoved)H(h(f({},w),{hasMoved:!0,startPoint:y})),t({type:"MOVE_ANNOTATION",payload:{id:w.annotation.id,delta:{x:R,y:j},saveUndo:!0}});else if(w.hasMoved){let F=y.x-w.startPoint.x,ne=y.y-w.startPoint.y;H(h(f({},w),{startPoint:y})),t({type:"MOVE_ANNOTATION",payload:{id:w.annotation.id,delta:{x:F,y:ne}}})}return}!N||!e.isAnnotating||t({type:"CONTINUE_PATH",payload:y})},[N,e.isAnnotating,e.activeTool,w,ge,X,Me,Ne,$,Ge,It,on,Wt,Pn,kt,t,pt,Cn]),Zt=cn(m=>{var L,R,j,ue,F,ne;if(wn.current.isDragging){let v=wn.current,E=v.element;if(E&&v.selector&&v.elementInfo&&lt){E instanceof HTMLElement&&(E.style.removeProperty("font-size"),E.style.removeProperty("line-height"),E.style.removeProperty("transition"));let J=[];if(v.originalFontSize!==lt.fontSize&&(Qe(E,"font-size",`${lt.fontSize}px`),J.push({property:"font-size",original:`${v.originalFontSize}px`,modified:`${lt.fontSize}px`})),v.originalLineHeight!==lt.lineHeight){let B=v.originalFontSize>0?Math.round(v.originalLineHeight/v.originalFontSize*1e3)/1e3:1.2,_=lt.fontSize>0?Math.round(lt.lineHeight/lt.fontSize*1e3)/1e3:1.2;Qe(E,"line-height",`${_}`),J.push({property:"line-height",original:`${B}`,modified:`${_}`})}J.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:v.selector,durableSelector:(L=v.durableSelector)!=null?L:void 0,element:v.elementInfo,changes:J}})}wn.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},Ht(null);return}if(vn.current.isDragging){let v=vn.current,E=v.element,J="button"in m&&m.button===2;if(!v.hasMoved&&!J&&E&&v.selector&&v.elementInfo){E instanceof HTMLElement&&E.style.removeProperty("transition");let B=["space-between","space-around","stretch","normal"],_=v.originalJustifyContent||"normal",Y=B.indexOf(_),U=B[(Y+1)%B.length],xe=[];U==="normal"?(Qe(E,"justify-content","normal"),xe.push({property:"justify-content",original:v.originalJustifyContent,modified:"normal"})):U==="stretch"?(Qe(E,"justify-content",U),Qe(E,"row-gap","8px"),Qe(E,"column-gap","8px"),xe.push({property:"justify-content",original:v.originalJustifyContent||"normal",modified:U}),v.originalRow!==8&&xe.push({property:"row-gap",original:`${v.originalRow}px`,modified:"8px"}),v.originalColumn!==8&&xe.push({property:"column-gap",original:`${v.originalColumn}px`,modified:"8px"})):(E instanceof HTMLElement&&(E.style.removeProperty("row-gap"),E.style.removeProperty("column-gap")),Qe(E,"justify-content",U),xe.push({property:"justify-content",original:v.originalJustifyContent||"normal",modified:U}),v.originalRow>0&&xe.push({property:"row-gap",original:`${v.originalRow}px`,modified:"0px"}),v.originalColumn>0&&xe.push({property:"column-gap",original:`${v.originalColumn}px`,modified:"0px"})),xe.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:v.selector,durableSelector:(R=v.durableSelector)!=null?R:void 0,element:v.elementInfo,changes:xe}})}else if(v.hasMoved&&E&&v.selector&&v.elementInfo&&xt){E instanceof HTMLElement&&(E.style.removeProperty("row-gap"),E.style.removeProperty("column-gap"),E.style.removeProperty("transition"));let B=[];v.isAuto?(E instanceof HTMLElement&&E.style.removeProperty("justify-content"),Qe(E,"justify-content","normal"),Qe(E,"row-gap",`${xt.row}px`),Qe(E,"column-gap",`${xt.column}px`),B.push({property:"justify-content",original:v.originalJustifyContent,modified:"normal"}),B.push({property:"row-gap",original:"0px",modified:`${xt.row}px`}),B.push({property:"column-gap",original:"0px",modified:`${xt.column}px`})):(v.originalRow!==xt.row&&(Qe(E,"row-gap",`${xt.row}px`),B.push({property:"row-gap",original:`${v.originalRow}px`,modified:`${xt.row}px`})),v.originalColumn!==xt.column&&(Qe(E,"column-gap",`${xt.column}px`),B.push({property:"column-gap",original:`${v.originalColumn}px`,modified:`${xt.column}px`}))),B.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:v.selector,durableSelector:(j=v.durableSelector)!=null?j:void 0,element:v.elementInfo,changes:B}})}vn.current={isDragging:!1,hasMoved:!1,axis:null,startX:0,startY:0,originalRow:0,originalColumn:0,element:null,elementInfo:null,selector:null,durableSelector:null,isAuto:!1,originalJustifyContent:"",visualGap:0},rn(null);return}if(bn.current.isDragging){let v=bn.current,E=v.element;if(E&&v.selector&&v.elementInfo&&At){E instanceof HTMLElement&&(E.style.removeProperty("border-top-left-radius"),E.style.removeProperty("border-top-right-radius"),E.style.removeProperty("border-bottom-right-radius"),E.style.removeProperty("border-bottom-left-radius"),E.style.removeProperty("transition"));let J=["top-left","top-right","bottom-right","bottom-left"],B={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},_=[];for(let Y of J)v.original[Y]!==At.radius[Y]&&(Qe(E,B[Y],`${At.radius[Y]}px`),_.push({property:B[Y],original:`${v.original[Y]}px`,modified:`${At.radius[Y]}px`}));_.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:v.selector,durableSelector:(ue=v.durableSelector)!=null?ue:void 0,element:v.elementInfo,changes:_}})}bn.current={isDragging:!1,corner:null,startY:0,original:{"top-left":0,"top-right":0,"bottom-right":0,"bottom-left":0},maxRadius:0,element:null,elementInfo:null,selector:null,durableSelector:null},qt(null);return}if(ve.current.isDragging){let v=ve.current,E=v.element,J=v.selector,B=v.elementInfo;if(E&&J&&B&&Ke){let _=v.original,Y=Ke.padding;E instanceof HTMLElement&&(E.style.removeProperty("padding"),E.style.removeProperty("transition"));let U=[],xe=[{prop:"padding-top",origVal:_.top,newVal:Y.top},{prop:"padding-right",origVal:_.right,newVal:Y.right},{prop:"padding-bottom",origVal:_.bottom,newVal:Y.bottom},{prop:"padding-left",origVal:_.left,newVal:Y.left}];for(let{prop:$e,origVal:tt,newVal:ot}of xe)tt!==ot&&(Qe(E,$e,`${ot}px`),U.push({property:$e,original:`${tt}px`,modified:`${ot}px`}));U.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:J,durableSelector:(F=v.durableSelector)!=null?F:void 0,element:B,changes:U}})}ve.current={isDragging:!1,side:null,startX:0,startY:0,original:{top:0,right:0,bottom:0,left:0},element:null,elementInfo:null,selector:null,durableSelector:null},qe(null);return}if(ge){He(null);return}if(w){if(!w.hasMoved&&w.annotation.type==="text"&&((ne=w.annotation.status)!=null?ne:"pending")==="pending"){let v=kt(m);Le({id:w.annotation.id,point:w.annotation.points[0],text:w.annotation.text||"",fontSize:w.annotation.fontSize||12,isNew:!1,clickPoint:v,groupId:w.annotation.groupId})}H(null);return}if(!N)return;let y=5;if(e.currentPath.length>=2){let v=e.currentPath[0],E=e.currentPath[e.currentPath.length-1],J=Math.abs(E.x-v.x),B=Math.abs(E.y-v.y);if((e.activeTool==="line"?Math.sqrt(J*J+B*B)<y:J<y&&B<y)&&["rectangle","circle","line"].includes(e.activeTool)){ee(!1),t({type:"CANCEL_PATH"});return}}let Z=Vi(e.currentPath);if(e.activeTool==="rectangle"&&e.currentPath.length>=2){let v=e.currentPath[0],E=e.currentPath[e.currentPath.length-1],J=Math.min(v.x,E.x),B=Math.max(v.y,E.y),_=e.strokeWidth/2,Y=Math.random().toString(36).substring(2,9);ae({point:{x:J-_+4,y:B+_+4},groupId:Y}),ee(!1),t({type:"FINISH_PATH",payload:{groupId:Y,elements:Z}});return}ee(!1),t({type:"FINISH_PATH",payload:{elements:Z}})},[N,w,ge,Ke,At,xt,lt,kt,t,e.activeTool,e.currentPath,e.strokeWidth]),Tn=cn(m=>{let y=m.target.value;wt.current=m.target.selectionStart,Le(Z=>Z&&h(f({},Z),{text:y}))},[]),Po=cn(m=>{m.key==="Escape"?Le(null):m.key==="Enter"&&!m.shiftKey&&(m.preventDefault(),Vt())},[Vt]),Oo=cn(m=>{if(!M)return;let y=m.clipboardData.items,Z=[];for(let L=0;L<y.length;L++){let R=y[L];if(R.type.startsWith("image/")){let j=R.getAsFile();j&&Z.push(j)}}Z.length>0&&(m.preventDefault(),Le(L=>L?h(f({},L),{images:[...L.images||[],...Z]}):null))},[M]),Gn=cn(m=>{if(!e.isAnnotating)return;if(e.activeTool==="hand"){m.preventDefault();let Z=Me||It||$||Wt;if(Z&&!go(Z)){let L=Ln(Z),R=Hn(Z);t({type:"SELECT_ELEMENT",payload:{el:Z,info:h(f({},L),{selector:R})}})}return}m.preventDefault();let y=G.current;y&&(Q.current=!0,y.style.pointerEvents="none",setTimeout(()=>{Q.current&&(Q.current=!1,y.style.pointerEvents="")},4e3))},[e.activeTool,e.isAnnotating,Me,It,$,Wt,t,go,G]);xn(()=>{let m=ke.filter(ue=>ue.linkedSelector);if(m.length===0)return;let y=null,Z=document.createElement("canvas").getContext("2d"),L=()=>{var F,ne,v;let ue=[];for(let E of m){let J=document.querySelector(E.linkedSelector);if(!J&&((ne=(F=E.elements)==null?void 0:F[0])!=null&&ne.selector)&&E.linkedSelector.startsWith("[data-pm=")){try{J=document.querySelector(E.elements[0].selector)}catch(rt){}if(J){let rt=(v=E.linkedSelector.match(/data-pm="([^"]+)"/))==null?void 0:v[1];rt&&J.setAttribute("data-pm",rt)}}if(!J)continue;let B=J.getBoundingClientRect(),_=e.styleModifications.some(rt=>{try{return J.matches(rt.selector)}catch(be){return!1}}),Y=m.filter(rt=>rt.id!==E.id&&rt.timestamp<E.timestamp&&rt.linkedSelector===E.linkedSelector).length,U=(_?1:0)+Y,xe;if(E.text&&Z){let rt=E.fontSize||12;Z.font=`${rt}px ${Qt}`,xe=Math.max(...E.text.split(`
5
+ `).map(be=>Z.measureText(be).width))}let $e=B.top>=Jn*(1+U)?"top-left":"bottom-left",tt=Ul(B,$e,U,k==null?void 0:k.current,xe),ot=E.points[0],$t=$e!==E.linkedAnchor;ot&&($t||Math.abs(tt.x-ot.x)>1||Math.abs(tt.y-ot.y)>1)&&ue.push({id:E.id,point:tt,linkedAnchor:$t?$e:void 0})}ue.length>0&&t({type:"UPDATE_LINKED_POSITIONS",payload:{updates:ue}})},R=()=>{y&&cancelAnimationFrame(y),y=requestAnimationFrame(L)};L(),window.addEventListener("scroll",R,!0),window.addEventListener("resize",R,!0),window.addEventListener("load",R),document.fonts.ready.then(R);let j=new MutationObserver(R);return j.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",R,!0),window.removeEventListener("resize",R,!0),window.removeEventListener("load",R),j.disconnect(),y&&cancelAnimationFrame(y)}},[ke,t]);let Vs=()=>{var m,y,Z;if(!e.isAnnotating)return"default";if(ge){let{handle:L}=ge;return L==="start"||L==="end"?"move":L==="top"||L==="bottom"?"ns-resize":L==="left"||L==="right"?"ew-resize":L==="topLeft"||L==="bottomRight"?"nwse-resize":"nesw-resize"}if(e.activeTool==="text")return"text";if(e.activeTool==="hand"){let L=(m=xt==null?void 0:xt.axis)!=null?m:on;if(L==="row")return"ns-resize";if(L==="column")return"ew-resize";if(At||Ge)return"ns-resize";let R=(y=lt==null?void 0:lt.property)!=null?y:Pn;if(R==="font-size")return"ew-resize";if(R==="line-height")return"ns-resize";let j=(Z=Ke==null?void 0:Ke.side)!=null?Z:Ne;return j==="top"||j==="bottom"?"ns-resize":j==="left"||j==="right"?"ew-resize":"default"}return"crosshair"},Ai={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:e.isAnnotating?"auto":"none",visibility:e.isAnnotating?"visible":"hidden",cursor:Vs()},Lr=cn(()=>{let m=G.current;if(!m||!M)return{width:100,height:12*1.4,isWrapped:!1};let y=m.getContext("2d");if(!y)return{width:100,height:M.fontSize*1.4,isWrapped:!1};y.font=`${M.fontSize}px ${Qt}`;let L=y.measureText("Type here...").width,R=M.text.split(`
6
+ `),j=R.length>0?Math.max(L,...R.map(E=>y.measureText(E||" ").width)):L,ue=M.point.x-Ie.x,F=dr(ue);if(j>F){let E=Ya(y,R,F),J=Math.min(F,Math.max(L,...E.map(_=>y.measureText(_).width))),B=Math.max(1,E.length)*M.fontSize*1.4;return{width:J,height:B,isWrapped:!0}}let v=Math.max(1,R.length)*M.fontSize*1.4;return{width:j,height:v,isWrapped:!1}},[M,G,Ie.x])(),Nc=M?Math.max(1,M.text.split(`
7
+ `).length)*M.fontSize*1.4+8:0,Xs=Lr.height+8,Hc=Lr.isWrapped?Xs-Nc:0,Fc=M?{position:"fixed",left:M.point.x-4-Ie.x,top:M.point.y-4-Ie.y-Hc,zIndex:9999,width:Lr.width+8,height:Xs,padding:4,fontSize:M.fontSize,fontFamily:Qt,color:"#ffffff",backgroundColor:e.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:Lr.isWrapped?"pre-wrap":"pre",wordBreak:Lr.isWrapped?"break-word":void 0}:{};return Cr(Er,{children:[ft("canvas",{ref:W,id:"devtools-canvas",style:Ai,onMouseDown:Ze,onMouseMove:Ot,onMouseUp:m=>Zt(m),onMouseLeave:m=>{Zt(m),Te(null),Xe(null)},onTouchStart:Ze,onTouchMove:Ot,onTouchEnd:m=>Zt(m),onContextMenu:Gn}),M&&Cr(Er,{children:[ft("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),ft("textarea",{id:"devtools-text-input",ref:me,value:M.text,onChange:Tn,onKeyDown:Po,onPaste:Oo,onBlur:Vt,placeholder:"Type here...",style:Fc}),M.images&&M.images.length>0&&Cr("div",{"data-devtools":!0,style:{position:"fixed",left:M.point.x-4-Ie.x,top:M.point.y-4-Ie.y-20,zIndex:1e4,fontSize:11,fontFamily:"system-ui, sans-serif",color:"#fff",backgroundColor:"rgba(0,0,0,0.7)",padding:"2px 6px",borderRadius:3,whiteSpace:"nowrap"},children:[M.images.length," image",M.images.length>1?"s":""," attached"]})]}),e.isAnnotating&&e.activeTool!=="hand"&&e.styleModifications.length>0&&ft(El,{styleModifications:e.styleModifications,isInspecting:!!e.inspectedElement,accentColor:e.activeColor,annotationGroupCount:new Set(ke.map(m=>m.groupId||m.id)).size,dispatch:t,inFlightSelectors:s,toolbarRef:k,onHoverSelector:ie}),e.activeTool==="hand"&&e.isAnnotating&&e.styleModifications.length>0&&ft(Tl,{styleModifications:e.styleModifications,accentColor:e.activeColor}),e.isAnnotating&&ft(fl,{annotations:ke,supersededAnnotations:Ue,inFlightIds:o,activeIds:r,queuePositions:i,scrollX:Ie.x,scrollY:Ie.y,annotationGroupMap:Ye,onViewThread:c,onSelectAnnotation:ye,onHoverAnnotation:he,canvasRef:G}),e.isAnnotating&&d&&ft(gl,{annotations:ke,supersededAnnotations:Ue,scrollX:Ie.x,scrollY:Ie.y,onReply:d,annotationGroupMap:Ye,canvasRef:G,onHoverAnnotation:he}),e.isAnnotating&&a&&a.size>0&&ft(ns,{inFlightSelectorColors:a}),e.isAnnotating&&Et&&ft(ns,{inFlightSelectorColors:Et,animated:!1}),e.activeTool==="hand"&&e.isAnnotating&&(xt?vn.current.element:It)&&ft(ls,{element:xt?vn.current.element:It,gap:xt?{row:xt.row,column:xt.column}:jo(It),accentColor:e.activeColor,hoveredAxis:on,draggingAxis:(qs=xt==null?void 0:xt.axis)!=null?qs:null,cursorViewport:_n,isAutoGap:_t,refreshKey:Nn}),e.activeTool==="hand"&&e.isAnnotating&&Kt&&ft(jl,{element:Kt.target,modifier:Kt.modifier,accentColor:e.activeColor,refreshKey:Nn}),e.activeTool==="hand"&&e.isAnnotating&&!Kt&&(At?bn.current.element:$)&&ft(xl,{element:At?bn.current.element:$,radius:(Zs=At==null?void 0:At.radius)!=null?Zs:Yo($),accentColor:e.activeColor,hoveredCorner:Ge,draggingCorner:(Qs=At==null?void 0:At.corner)!=null?Qs:null,cursorViewport:_n}),e.activeTool==="hand"&&e.isAnnotating&&!Kt&&(lt?wn.current.element:Wt)&&ft(Yl,{element:lt?wn.current.element:Wt,fontSize:(ea=lt==null?void 0:lt.fontSize)!=null?ea:Br(Wt).fontSize,lineHeight:(ta=lt==null?void 0:lt.lineHeight)!=null?ta:Br(Wt).lineHeight,accentColor:e.activeColor,hoveredProperty:Pn,draggingProperty:(na=lt==null?void 0:lt.property)!=null?na:null,cursorViewport:_n}),e.activeTool==="hand"&&e.isAnnotating&&!Kt&&(Ke?ve.current.element:Me)&&ft(gs,{element:Ke?ve.current.element:Me,padding:(oa=Ke==null?void 0:Ke.padding)!=null?oa:mr(Me),accentColor:e.activeColor,hoveredSide:Ne,draggingSide:(ra=Ke==null?void 0:Ke.side)!=null?ra:null,cursorViewport:_n,refreshKey:lt?lt.fontSize+lt.lineHeight*1e3:0}),e.activeTool==="inspector"&&e.isAnnotating&&ft(Er,{children:X&&!e.inspectedElement&&(()=>{let m=(M==null?void 0:M.linkedSelector)||(I==null?void 0:I.linkedSelector);if(m)try{if(X.matches(m))return null}catch(Z){}let y=!!I||!!(M!=null&&M.linkedSelector)||ke.some(Z=>{if(!Z.linkedSelector)return!1;try{return X.matches(Z.linkedSelector)}catch(L){return!1}});return ft(lo,{element:X,isSelected:!1,elementInfo:Oe,color:e.activeColor,hideTooltip:y})})()}),((M==null?void 0:M.linkedSelector)||(I==null?void 0:I.linkedSelector))&&(()=>{let m=(M==null?void 0:M.linkedSelector)||(I==null?void 0:I.linkedSelector);if(!m)return null;let y=null;try{y=document.querySelector(m)}catch(Z){}return y?ft(lo,{element:y,isSelected:!0,color:e.activeColor,hideTooltip:!0}):null})(),P&&(()=>{let m=e.annotations.find(L=>L.id===P);if(!(m!=null&&m.linkedSelector))return null;let y=null;try{y=document.querySelector(m.linkedSelector)}catch(L){}if(!y)return null;let Z=!!(o&&o.has(m.id));return ft(lo,{element:y,isSelected:!Z,color:m.color,hideTooltip:!0})})(),Pe&&(()=>{let m=e.annotations.find(R=>R.id===Pe);if(!(m!=null&&m.linkedSelector))return null;let y=null;try{y=document.querySelector(m.linkedSelector)}catch(R){}if(!y)return null;let Z=m.groupId?e.annotations.filter(R=>R.groupId===m.groupId):[m],L=!!(o&&Z.some(R=>o.has(R.id)));return ft(lo,{element:y,isSelected:!L,color:m.color,hideTooltip:!0})})(),te&&(()=>{let m=null;try{m=document.querySelector(te)}catch(Z){}if(!m)return null;let y=!!(s&&s.has(te));return ft(lo,{element:m,isSelected:!y,color:e.activeColor,hideTooltip:!0})})(),e.activeTool==="model"&&e.isAnnotating&&gt.size>0&&[...gt.entries()].map(([m,y])=>ft(lo,{element:y.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:y.rootElement.tagName.toLowerCase(),reactComponent:m},color:"#8b5cf6"},m)),e.activeTool==="model"&&e.isAnnotating&&Ft&&ft(lo,{element:Ft.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:Ft.rootElement.tagName.toLowerCase(),reactComponent:Ft.name},color:"#22c55e"}),e.activeTool==="model"&&e.isAnnotating&&S.length>0&&S.map((m,y)=>ft("div",{style:{position:"absolute",left:m.x,top:m.y,width:m.width,height:m.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:m.direction==="vertical"?Cr(Er,{children:[ft("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ft("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ft("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ft("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:m.height<16?-6:"50%",transform:m.height<16?"none":"translateY(-50%)",fontSize:11,fontWeight:600,color:"#fff",backgroundColor:"#FF0000",padding:"2px 4px",whiteSpace:"nowrap",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1},children:Math.round(m.height)})]}):Cr(Er,{children:[ft("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ft("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ft("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ft("div",{style:{position:"absolute",left:m.width<30?0:"50%",top:(m.width<30,void 0),bottom:"calc(50% + 4px)",transform:m.width<30?"none":"translateX(-50%)",fontSize:11,fontWeight:600,color:"#fff",backgroundColor:"#FF0000",padding:"2px 4px",whiteSpace:"nowrap",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1},children:Math.round(m.width)})]})},y)),e.activeTool==="model"&&e.isAnnotating&&Ce&&ft(lo,{element:Ce.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:Ce.rootElement.tagName.toLowerCase(),reactComponent:Ce.name},color:x!=null&&x.has(Ce.name)?"#22c55e":"#8b5cf6"}),e.activeTool==="hand"&&e.isAnnotating&&e.inspectedElement&&Cr(Er,{children:[nt&&nt!=="padding"&&nt!=="gap"&&(()=>{var F;let m=new Set(ke.map(ne=>ne.groupId||ne.id)).size,y=e.inspectedElement.info.selector,Z=e.styleModifications.findIndex(ne=>ne.selector===y),L=Z>=0?m+Z+1:m+e.styleModifications.length+1,R=e.styleModifications.find(ne=>ne.selector===y),j=(F=R==null?void 0:R.changes.length)!=null?F:0,ue=!!(R!=null&&R.captured);return ft(lo,{element:e.inspectedElement.el,isSelected:!0,elementInfo:e.inspectedElement.info,color:ue?"#999999":e.activeColor,annotationNumber:L,changeCount:j})})(),nt==="padding"&&ft(gs,{element:e.inspectedElement.el,padding:mr(e.inspectedElement.el),accentColor:e.activeColor,hoveredSide:null,draggingSide:null}),nt==="gap"&&ft(ls,{element:e.inspectedElement.el,gap:jo(e.inspectedElement.el),accentColor:e.activeColor,hoveredAxis:null,draggingAxis:null}),ft(Wl,{element:e.inspectedElement.el,elementInfo:e.inspectedElement.info,selector:e.inspectedElement.info.selector,styleModifications:e.styleModifications,dispatch:t,onClose:()=>t({type:"SELECT_ELEMENT",payload:null}),onHover:St,accentColor:e.activeColor,toolbarRef:k})]})]})}import{useCallback as Wn,useEffect as gn,useMemo as Zo,useRef as Dt,useState as Qo}from"react";import{Circle as wf,Component as Cf,Hand as Ef,MessageCircle as kf,Pen as Tf,Slash as Mf,Square as If,Trash2 as Lf,Type as Rf}from"lucide-react";import{useEffect as Xl,useRef as Kl}from"react";function ql(e,t,n,o,r){let i=Kl(0),s=Kl(t.annotations);Xl(()=>{if(!n.current||!e)return;s.current=t.annotations;let a=t.annotations.length;a>0&&(a>=i.current||!o)&&(localStorage.setItem(r.annotations,JSON.stringify(t.annotations)),i.current=a)},[t.annotations,e,o,n,r]),Xl(()=>{n.current&&(localStorage.setItem(r.expanded,String(e)),e&&(localStorage.setItem(r.styleMods,JSON.stringify(t.styleModifications)),localStorage.setItem(r.spacingChanges,JSON.stringify(t.spacingTokenChanges)),localStorage.setItem(r.tool,t.activeTool),localStorage.setItem(r.color,t.activeColor),localStorage.setItem(r.stroke,String(t.strokeWidth)),t.inspectedElement?localStorage.setItem(r.inspected,JSON.stringify({selector:t.inspectedElement.info.selector,info:t.inspectedElement.info})):localStorage.removeItem(r.inspected)))},[e,t.styleModifications,t.spacingTokenChanges,t.activeTool,t.activeColor,t.strokeWidth,t.inspectedElement,n,r])}import{Component as $p,createElement as zp,useCallback as Ci,useEffect as Io,useRef as Ko,useState as zn}from"react";import{Link2 as Wp}from"lucide-react";var Cp={colors:[],fonts:[],typeScale:[],spacing:[],radii:[],shadows:[],other:[],references:{}},Ep=/^#[0-9a-fA-F]{3,8}$/,kp=/^(?:rgba?|hsla?|oklch|oklab|lch|lab)\(/,Tp=new Set(["transparent","currentcolor","inherit","white","black","red","green","blue","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]);function Ql(e){let t=e.trim().toLowerCase();return Ep.test(t)||kp.test(t)||Tp.has(t)}var Mp=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function Ls(e){return Mp.test(e.trim())}var Zl=new Set(["serif","sans-serif","monospace","cursive","fantasy","system-ui","ui-serif","ui-sans-serif","ui-monospace","ui-rounded"]);function Ip(e){let t=e.trim().toLowerCase();return!!(Zl.has(t)||t.includes(",")&&t.split(",").some(n=>Zl.has(n.trim().replace(/['"]/g,""))))}function Lp(e){let t=e.trim().toLowerCase(),n=t.match(/\d+(\.\d+)?px/g);return!!(n&&n.length>=2&&(Ql(t.replace(/[^#()\w,.\s/%]/g,"").split(/\s+/).pop()||"")||t.includes("rgb")||t.includes("hsl")||t.includes("#")))}var Rp=/(?:^--(color|bg|fg|accent|border-color|text-color|surface|background|foreground))|(?:-(color|bg|fg)$)/i,Ap=/^--(font-family|font|ff|family)/i,Pp=/^--(font-size|text-size|fs|text-(?:xs|sm|base|md|lg|xl|2xl|3xl|4xl|5xl))/i,Op=/^--(space|gap|padding|margin|inset)/i,Bp=/^--(radius|rounded|br|border-radius)/i,Dp=/^--(shadow|elevation|drop-shadow)/i;function ec(e,t){let n=e.toLowerCase();return Dp.test(n)?"shadows":Bp.test(n)?"radii":Ap.test(n)?"fonts":Pp.test(n)&&Ls(t)?"typeScale":Rp.test(n)||Ql(t)?"colors":Ip(t)?"fonts":Lp(t)?"shadows":Op.test(n)&&Ls(t)||Ls(t)?"spacing":"other"}function tc(e,t,n,o){if(e)for(let r of e){if(r instanceof CSSGroupingRule){tc(r.cssRules,t,n,o);continue}if(r instanceof CSSStyleRule){let i=r.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&_p(r.style,t,n,o)}}}var nc=/var\((--[^,)]+)/;function _p(e,t,n,o){for(let r=0;r<e.length;r++){let i=e[r];if(!(i!=null&&i.startsWith("--"))||n.has(i))continue;n.add(i);let s=t.getPropertyValue(i).trim();if(!s)continue;let a=ec(i,s);o[a].push([i,s]);let d=e.getPropertyValue(i).trim().match(nc);d&&(o.references[i]=d[1])}}function xi(e){let t=e.trim().match(/^(-?\d+(?:\.\d+)?)/);return t?parseFloat(t[1]):null}function Si(e){let t=e.trim().toLowerCase(),n=t.match(/oklch\(\s*([\d.]+%?)/);if(n){let i=n[1];return i.endsWith("%")?parseFloat(i)/100:parseFloat(i)}let o=t.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(o){let[i,s,a]=[parseInt(o[1],10),parseInt(o[2],10),parseInt(o[3],10)];return(.2126*i+.7152*s+.0722*a)/255}let r=t.match(/hsla?\(\s*[\d.]+[,\s]+[\d.]+%?[,\s]+([\d.]+)%?/);if(r)return parseFloat(r[1])/100;if(t.startsWith("#")){let i=t.slice(1);(i.length===3||i.length===4)&&(i=i[0]+i[0]+i[1]+i[1]+i[2]+i[2]);let s=parseInt(i.slice(0,2),16),a=parseInt(i.slice(2,4),16),l=parseInt(i.slice(4,6),16);if(!isNaN(s))return(.2126*s+.7152*a+.0722*l)/255}return null}function oc(e){return e==="colors"?(t,n)=>{let o=Si(t[1]),r=Si(n[1]);return o!==null&&r!==null?o-r:t[0].localeCompare(n[0])}:e==="typeScale"||e==="spacing"||e==="radii"?(t,n)=>{let o=xi(t[1]),r=xi(n[1]);return o!==null&&r!==null?o-r:t[0].localeCompare(n[0])}:e==="other"?(t,n)=>{let o=xi(t[1]),r=xi(n[1]);return o!==null&&r!==null?o-r:t[0].localeCompare(n[0])}:(t,n)=>t[0].localeCompare(n[0])}function Np(e){let t=e.replace(/^--/,"");t=t.replace(/^(?:color|clr)-/,"");let n=t.split("-");return n.length>1&&/^\d+$/.test(n[n.length-1])&&n.pop(),n.join("-")}function rc(e){let t=new Map;for(let r of e){let i=Np(r[0]),s=t.get(i);s||(s=[],t.set(i,s)),s.push(r)}let n=oc("colors");for(let r of t.values())r.sort(n);let o=[...t.entries()];return o.sort((r,i)=>{var l,d;let s=(l=Si(r[1][0][1]))!=null?l:0,a=(d=Si(i[1][0][1]))!=null?d:0;return s-a}),o}var Hp=["colors","fonts","typeScale","spacing","radii","shadows","other"],vi=null,Fp=5e3;function ic(){if(typeof document=="undefined")return Cp;if(vi&&Date.now()-vi.timestamp<Fp)return vi.tokens;let e={colors:[],fonts:[],typeScale:[],spacing:[],radii:[],shadows:[],other:[],references:{}},t=new Set,n=getComputedStyle(document.documentElement);try{for(let r of document.styleSheets)try{tc(r.cssRules||r.rules,n,t,e)}catch(i){}}catch(r){}let o=document.documentElement.style;for(let r=0;r<o.length;r++){let i=o[r];if(!(i!=null&&i.startsWith("--"))||t.has(i))continue;t.add(i);let s=n.getPropertyValue(i).trim();if(!s)continue;let a=ec(i,s);e[a].push([i,s]);let d=o.getPropertyValue(i).trim().match(nc);d&&(e.references[i]=d[1])}for(let r of Hp)e[r].sort(oc(r));return vi={tokens:e,timestamp:Date.now()},e}import{Fragment as qo,jsx as We,jsxs as en}from"react/jsx-runtime";var sc="popmelt-library-tab",Gp=/^#[0-9a-fA-F]{3,8}$/,jp=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,Yp=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),Jp=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function lc(e){let t=e.trim();return Gp.test(t)||jp.test(t)||Yp.has(t.toLowerCase())}function Up(e){return Jp.test(e.trim())}function Vp(e){let t=e.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return t?parseFloat(t[1]):null}function cc(e,t=""){if(e==null)return[];if(typeof e!="object")return[[t,String(e)]];if(Array.isArray(e))return[[t,e.map(String).join(", ")]];let n=[];for(let[o,r]of Object.entries(e)){let i=t?`${t}.${o}`:o;if(r!==null&&typeof r=="object"&&!Array.isArray(r)){let s=r;typeof s.value=="string"?n.push([i,s.value]):n.push(...cc(r,i))}else n.push([i,Array.isArray(r)?r.map(String).join(", "):String(r!=null?r:"")])}return n}function Xp(e){return e.length===0?"generic":e.filter(([,o])=>lc(o)).length>e.length/2?"colors":e.filter(([,o])=>Up(o)).length>e.length/2?"spacing":"generic"}var Kp=h(f({width:300,backgroundColor:"#eaeaea"},xr),{boxSizing:"content-box",zIndex:10001,display:"flex",flexDirection:"column",overflow:"hidden",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12,pointerEvents:"auto"}),dc={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},qp=h(f({},dc),{color:"#1f2937",borderBottom:"1.5px solid #1f2937"});function Zp({varName:e,value:t,reference:n}){return We("div",{title:n?`${e} \u2192 ${n}
8
+ ${t}`:`${e}: ${t}`,style:{width:28,height:28,backgroundColor:t,outline:"1px solid rgba(0,0,0,0.08)",outlineOffset:-1,position:"relative"},children:n&&We(Wp,{size:10,strokeWidth:2.5,style:{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",color:"white",filter:"drop-shadow(0 0 1px rgba(0,0,0,0.5))"}})})}function uc({entries:e,references:t}){let n=[],o=[];for(let i of e)lc(i[1])?n.push(i):o.push(i);let r=rc(n);return en(qo,{children:[r.map(([i,s])=>en("div",{style:{marginBottom:4},children:[en("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:2},children:[i,s.length>1?` (${s.length})`:""]}),We("div",{style:{display:"flex",flexWrap:"wrap",gap:2},children:s.map(([a,l])=>We(Zp,{varName:a,value:l,reference:t[a]},a))})]},i)),o.length>0&&We(Ei,{entries:o})]})}var wi=[0,1,2,4,8,12,16,20,24,28,32];function Qp(e){if(e<=32){let t=wi[0],n=Math.abs(e-t);for(let o=1;o<wi.length;o++){let r=Math.abs(e-wi[o]);r<n&&(t=wi[o],n=r)}return t}return Math.round(e/8)*8}function ef({label:e,value:t,px:n,tokenPath:o,rawToken:r,onHover:i,onModify:s,onDelete:a}){let[l,d]=zn(!1),[c,p]=zn(null),u=Ko(!1),g=Ko(0),b=Ko(0),x=Ko([]),A=c!==null?c:n,T=c!==null?`${c}px`:t,z=c!==null,P=Ci(k=>{k.preventDefault(),u.current=!0,g.current=k.clientX,b.current=n;let G=ei(r);x.current=Ki(G);let re=W=>{let Q=W.clientX-g.current,N=Math.max(0,Math.round(b.current+Q));W.shiftKey&&(N=Qp(N));for(let ee of x.current)ee.element.style.setProperty(ee.property,N+"px","important");p(N),i==null||i({name:e,px:N,token:G})},oe=()=>{window.removeEventListener("mousemove",re),window.removeEventListener("mouseup",oe),document.body.style.cursor="",u.current=!1,p(W=>{if(W!==null&&W!==n&&s){let Q=ei(r),N=Q.bindings&&Q.bindings.length>0,ee;if(N){let fe=Zi(Q.bindings,b.current,W);ee=JSON.stringify(h(f({},Q),{value:`${W}px`,bindings:fe}))}else{let fe=ol(x.current,b.current),D=rl(x.current);if(fe.length>0){let ae=Zi(fe,b.current,W);ee=JSON.stringify({value:`${W}px`,property:D,bindings:ae})}else ee=`${W}px`}let M=typeof r=="string"?r:JSON.stringify(r),Le=x.current.map(fe=>({selector:Hn(fe.element),property:fe.property})),V=sl(x.current,b.current,W);s({tokenPath:o,originalValue:M,currentValue:ee,targets:Le,originalPx:b.current,currentPx:W},{id:Math.random().toString(36).substring(2,9),tokenPath:o,tokenName:e,originalPx:b.current,newPx:W,affectedElements:V})}return W})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",re),window.addEventListener("mouseup",oe)},[n,e,o,r,i,s]),O=ei(r);return en("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",fontSize:11,padding:"1px 0",cursor:"ew-resize",userSelect:"none"},onMouseEnter:()=>{u.current||(d(!0),i==null||i({name:e,px:A,token:O}))},onMouseLeave:()=>{u.current||(d(!1),i==null||i(null))},onMouseDown:P,children:[We("span",{style:{color:l||z?"#FF0000":"#9ca3af"},children:e}),en("span",{style:{display:"flex",alignItems:"center",gap:4},children:[We("span",{style:{color:l||z?"#FF0000":"#6b7280",fontWeight:600},children:T}),a&&l&&!z&&We("button",{type:"button",title:"Remove token",onMouseDown:k=>{k.stopPropagation();let G=typeof r=="string"?r:JSON.stringify(r);a(o,G)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:k=>{k.currentTarget.style.color="#FF0000"},onMouseLeave:k=>{k.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function tf({entries:e,categoryKey:t,rawTokens:n,onHover:o,onModify:r,onDelete:i}){let s=[],a=[];for(let l of e){let d=Vp(l[1]);d!==null?s.push([l[0],l[1],d]):a.push(l)}return en(qo,{children:[s.length>0&&We("div",{style:{display:"flex",flexDirection:"column",gap:2},children:s.map(([l,d,c])=>{let p=l.split(".").pop(),u=n?nf(n,l):d,g=u&&typeof u=="object"&&"value"in u?u:d;return We(ef,{label:p,value:d,px:c,tokenPath:`tokens.${t}.${l}`,rawToken:g,onHover:o,onModify:r,onDelete:i},l)})}),a.length>0&&We(Ei,{entries:a})]})}function nf(e,t){let n=t.split("."),o=e;for(let r of n){if(o==null||typeof o!="object")return;o=o[r]}return o}function Ei({entries:e}){return We("div",{style:{display:"flex",flexDirection:"column",gap:3},children:e.map(([t,n])=>en("div",{style:{fontSize:11},children:[We("div",{style:{color:"#9ca3af",fontSize:10,marginBottom:1},children:t}),We("div",{style:{color:"#1f2937",lineHeight:1.4,paddingLeft:8},children:n})]},t))})}function of({entries:e,categoryKey:t,rawTokens:n,onSpacingHover:o,onModifyToken:r,onDeleteToken:i}){let s=Xp(e);return s==="colors"?We(uc,{entries:e}):s==="spacing"?We(tf,{entries:e,categoryKey:t,rawTokens:n,onHover:o,onModify:r,onDelete:i}):We(Ei,{entries:e})}function rf(e){let t=e.toLowerCase(),n=null,o=document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT,{acceptNode(i){return i.closest("#devtools-toolbar, #devtools-canvas, #devtools-scrim, [data-popmelt-panel]")?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}}),r=o.currentNode;for(;r=o.nextNode();){let i=r,s=Object.keys(i).find(l=>l.startsWith("__reactFiber$")||l.startsWith("__reactInternalInstance$"));if(!s)continue;let a=i[s];for(;a;){let l=a.type,d=typeof l=="function"||typeof l=="object"?(l==null?void 0:l.displayName)||(l==null?void 0:l.name):null;if(typeof d=="string"){let c=d.toLowerCase();if(c===t){let p=f({},a.memoizedProps);return delete p.ref,{type:l,props:p}}if(!n){if(c.length>=4&&t.includes(c)){let p=f({},a.memoizedProps);delete p.ref,n={type:l,props:p}}else if(t.length>=4&&c.includes(t)){let p=f({},a.memoizedProps);delete p.ref,n={type:l,props:p}}}}a=a.return}}return n}var Rs=class extends $p{constructor(){super(...arguments);this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(){this.props.onError()}render(){return this.state.hasError?null:this.props.children}},pc="popmelt-principles-collapsed";function sf(){try{let e=localStorage.getItem(pc);if(e)return new Set(JSON.parse(e))}catch(e){}return new Set}function af(e){try{localStorage.setItem(pc,JSON.stringify([...e]))}catch(t){}}function lf({id:e,label:t,count:n,children:o,collapsed:r,onToggle:i}){return en("div",{style:{marginBottom:14},children:[en("div",{onClick:()=>i(e),style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:r?0:6,cursor:"pointer",display:"flex",alignItems:"center",gap:4,userSelect:"none"},children:[We("span",{style:{display:"inline-flex",alignItems:"center",justifyContent:"center",width:10,fontSize:9,color:"#9ca3af",transform:r?"rotate(-90deg)":"rotate(0deg)"},children:"\u25BC"}),t,We("span",{style:{fontWeight:400,color:"#9ca3af"},children:n})]}),!r&&o]})}var cf={colors:"Colors",fonts:"Fonts",typeScale:"Type Scale",spacing:"Spacing",radii:"Radii",shadows:"Shadows",other:"Other"},ac=["colors","fonts","typeScale","spacing","radii","shadows","other"];function df(){let[e,t]=zn(null),[n,o]=zn(sf);Io(()=>{t(ic())},[]);let r=Ci(s=>{o(a=>{let l=new Set(a);return l.has(s)?l.delete(s):l.add(s),af(l),l})},[]);return e?ac.some(s=>e[s].length>0)?We(qo,{children:ac.map(s=>{let a=e[s];return a.length===0?null:We(lf,{id:s,label:cf[s],count:a.length,collapsed:n.has(s),onToggle:r,children:s==="colors"?We(uc,{entries:a,references:e.references}):We(Ei,{entries:a})},s)})}):We("div",{style:{color:"#9ca3af",fontSize:11},children:"No :root tokens found."}):null}function uf({rules:e,onSynthesize:t,isSynthesizing:n}){if(!e||e.length===0)return We("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."});if(!e.some(i=>typeof i=="object"&&i!==null&&"scope"in i))return We(qo,{children:e.map((i,s)=>en("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[en("span",{style:{color:"#9ca3af",flexShrink:0},children:[s+1,"."]}),We("span",{children:typeof i=="string"?i:i.text})]},s))});let r=new Map;for(let i of e)if(typeof i=="string")r.has("general")||r.set("general",[]),r.get("general").push({id:"",text:i});else{let s=i.scope||"general";r.has(s)||r.set(s,[]),r.get(s).push({id:i.id,text:i.text})}return en(qo,{children:[t&&We("button",{type:"button",disabled:n,onClick:t,style:{width:"100%",border:"1px solid rgba(0,0,0,0.12)",background:n?"rgba(0,0,0,0.04)":"rgba(0,0,0,0.02)",cursor:n?"default":"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"5px 8px",marginBottom:10,color:n?"#9ca3af":"#6b7280"},children:n?"Synthesizing\u2026":"Synthesize"}),Array.from(r.entries()).map(([i,s])=>en("div",{style:{marginBottom:10},children:[We("div",{style:{fontWeight:700,fontSize:10,color:"#6b7280",letterSpacing:"0.05em",textTransform:"uppercase",marginBottom:4},children:i}),s.map((a,l)=>en("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4,fontSize:11},children:[We("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2022"}),We("span",{children:a.text})]},a.id||l))]},i))]})}function pf({name:e,value:t,selected:n,highlighted:o,onRemove:r,onHover:i}){var W;let[s,a]=zn(!1),[l,d]=zn(!1),c=Ko(null),p=Ko(0),[u,g]=zn(0),[b,x]=zn(0),A=cc(t),T=(W=A.find(([Q])=>Q==="description"))==null?void 0:W[1];Io(()=>{if(!l&&!o){g(0),x(0),p.current=0;return}let Q=fr(e);g(Q.length)},[l,o,e]),Io(()=>{n&&c.current&&c.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[n]);let z=n||o||l,P=n?"139,92,246":"34,197,94",O=n?"#8b5cf6":"#22c55e",k=z?`rgba(${P},0.06)`:void 0,G=z?`inset 0 0 0 1.5px rgba(${P},0.35)`:void 0,re=o||l,oe=Ci(()=>{let Q=fr(e);if(Q.length===0)return;let N=p.current%Q.length;Q[N].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),x(N),p.current=N+1,i==null||i({name:e,instanceIndex:N})},[e,i]);return en("div",{ref:c,onClick:oe,onMouseEnter:()=>{d(!0),i==null||i({name:e,instanceIndex:0})},onMouseLeave:()=>{d(!1),i==null||i(null)},style:{marginBottom:8,background:k,padding:6,boxShadow:G,cursor:"pointer"},children:[en("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[en("div",{style:{display:"flex",alignItems:"center",gap:6,marginBottom:6},children:[We("div",{style:{fontWeight:700,fontSize:11,letterSpacing:"0.05em",padding:"2px 6px",backgroundColor:re?O:"transparent",color:re?"#fff":"#6b7280"},children:e}),re&&u>1&&en("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[b+1,"/",u]})]}),r&&l&&We("button",{type:"button",title:"Remove from model",onClick:Q=>{Q.stopPropagation(),r(e)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:Q=>{Q.currentTarget.style.color="#FF0000"},onMouseLeave:Q=>{Q.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),T&&We("div",{style:{fontSize:11,color:re?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:T}),s?We(of,{entries:A.filter(([Q])=>Q!=="description"),categoryKey:""}):We(ff,{name:e,onNotFound:()=>a(!0),entries:A})]})}function ff({name:e,onNotFound:t}){let[n,o]=zn(null),[r,i]=zn(!1);return Io(()=>{let s=rf(e);s||t(),o(s),i(!0)},[e,t]),!r||!n?null:We(Rs,{onError:t,children:We("div",{"data-popmelt-panel":!0,onClick:s=>{s.preventDefault(),s.stopPropagation()},style:{width:"100%",overflowY:"auto",overflowX:"hidden",maxHeight:150,padding:"1rem",outline:"1px solid rgba(0,0,0,0.06)",backgroundColor:"rgb(250,250,250)",boxSizing:"border-box",marginBottom:4,display:"flex",flexDirection:"column",justifyContent:"stretch",alignItems:"center",contain:"layout paint",position:"relative",isolation:"isolate"},children:We("div",{style:{zoom:.5,pointerEvents:"none"},children:zp(n.type,n.props)})})})}function gf({components:e,selectedComponent:t,hoveredComponent:n,onRemove:o,onHover:r}){if(!e||Object.keys(e).length===0)return We("div",{style:{color:"#9ca3af",fontSize:11},children:"No component patterns defined yet."});let i=new Set(Object.keys(e)),s=Ui(i),a=Object.entries(e).sort(([l],[d])=>{var c,p;return((c=s.get(l))!=null?c:1/0)-((p=s.get(d))!=null?p:1/0)});return We(qo,{children:a.map(([l,d])=>We(pf,{name:l,value:d,selected:t===l,highlighted:n===l,onRemove:o,onHover:r},l))})}function fc({bridgeUrl:e,modelRefreshKey:t,onMouseEnter:n,onMouseLeave:o,selectedComponent:r,hoveredComponent:i,onComponentHover:s,onSpacingTokenHover:a,onModifySpacingToken:l,onDeleteSpacingToken:d,onComponentAdded:c,onComponentRemoved:p,onSynthesizeRules:u,isSynthesizing:g,snapPosition:b="bottom-right"}){let[x,A]=zn(void 0),[T,z]=zn(!0),[P,O]=zn(()=>{try{let N=localStorage.getItem(sc);if(N==="patterns"||N==="principles"||N==="rules")return N}catch(N){}return"patterns"});Io(()=>{ir(e).then(N=>{A(N),z(!1)})},[e,t]),Io(()=>{try{localStorage.setItem(sc,P)}catch(N){}},[P]),Io(()=>{r&&(O("patterns"),ir(e).then(N=>{N&&A(N)}))},[r,e]);let k=Ci(N=>{A(ee=>{if(!(ee!=null&&ee.components))return ee;let V=ee.components,{[N]:M}=V,Le=jn(V,[Co(N)]);return h(f({},ee),{components:Le})}),p==null||p(N)},[p]),G=x==null?void 0:x.components,re=x==null?void 0:x.rules,oe=G&&Object.keys(G).length>0,W=re&&re.length>0,Q=Ko(null);return Io(()=>{let N=Q.current;if(!N)return;let ee=n,M=o;return ee&&N.addEventListener("mouseenter",ee),M&&N.addEventListener("mouseleave",M),()=>{ee&&N.removeEventListener("mouseenter",ee),M&&N.removeEventListener("mouseleave",M)}},[n,o]),en("div",{ref:Q,style:f(f({},Kp),$a(b)),children:[en("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[We("span",{children:"Model"}),We("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"M"})]}),We("div",{style:{display:"flex",gap:12,marginBottom:10,borderBottom:"1px solid rgba(0,0,0,0.08)",paddingBottom:6},children:["patterns","principles","rules"].map(N=>We("button",{type:"button",style:P===N?qp:dc,onClick:()=>O(N),children:N.charAt(0).toUpperCase()+N.slice(1)},N))}),We("div",{style:{flex:1,overflowY:"auto",minHeight:0},children:P==="principles"?We(df,{}):T?We("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):!x||!oe&&!W?We("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):en(qo,{children:[P==="patterns"&&We(gf,{components:G,selectedComponent:r,hoveredComponent:i,onRemove:k,onHover:s}),P==="rules"&&We(uf,{rules:re,onSynthesize:u,isSynthesizing:g})]})})]})}import{jsx as So}from"react/jsx-runtime";var mf="M 233.959793 800.214905 L 468.644287 668.536987 L 472.590637 657.100647 L 468.644287 650.738403 L 457.208069 650.738403 L 417.986633 648.322144 L 283.892639 644.69812 L 167.597321 639.865845 L 54.926208 633.825623 L 26.577238 627.785339 L 3.3e-05 592.751709 L 2.73832 575.27533 L 26.577238 559.248352 L 60.724873 562.228149 L 136.187973 567.382629 L 249.422867 575.194763 L 331.570496 580.026978 L 453.261841 592.671082 L 472.590637 592.671082 L 475.328857 584.859009 L 468.724915 580.026978 L 463.570557 575.194763 L 346.389313 495.785217 L 219.543671 411.865906 L 153.100723 363.543762 L 117.181267 339.060425 L 99.060455 316.107361 L 91.248367 266.01355 L 123.865784 230.093994 L 167.677887 233.073853 L 178.872513 236.053772 L 223.248367 270.201477 L 318.040283 343.570496 L 441.825592 434.738342 L 459.946411 449.798706 L 467.194672 444.64447 L 468.080597 441.020203 L 459.946411 427.409485 L 392.617493 305.718323 L 320.778564 181.932983 L 288.80542 130.630859 L 280.348999 99.865845 C 277.369171 87.221436 275.194641 76.590698 275.194641 63.624268 L 312.322174 13.20813 L 332.8591 6.604126 L 382.389313 13.20813 L 403.248352 31.328979 L 434.013519 101.71814 L 483.865753 212.537048 L 561.181274 363.221497 L 583.812134 407.919434 L 595.892639 449.315491 L 600.40271 461.959839 L 608.214783 461.959839 L 608.214783 454.711609 L 614.577271 369.825623 L 626.335632 265.61084 L 637.771851 131.516846 L 641.718201 93.745117 L 660.402832 48.483276 L 697.530334 24.000122 L 726.52356 37.852417 L 750.362549 72 L 747.060486 94.067139 L 732.886047 186.201416 L 705.100708 330.52356 L 686.979919 427.167847 L 697.530334 427.167847 L 709.61084 415.087341 L 758.496704 350.174561 L 840.644348 247.490051 L 876.885925 206.738342 L 919.167847 161.71814 L 946.308838 140.29541 L 997.61084 140.29541 L 1035.38269 196.429626 L 1018.469849 254.416199 L 965.637634 321.422852 L 921.825562 378.201538 L 859.006714 462.765259 L 819.785278 530.41626 L 823.409424 535.812073 L 832.75177 534.92627 L 974.657776 504.724915 L 1051.328979 490.872559 L 1142.818848 475.167786 L 1184.214844 494.496582 L 1188.724854 514.147644 L 1172.456421 554.335693 L 1074.604126 578.496765 L 959.838989 601.449829 L 788.939636 641.879272 L 786.845764 643.409485 L 789.261841 646.389343 L 866.255127 653.637634 L 899.194702 655.409424 L 979.812134 655.409424 L 1129.932861 666.604187 L 1169.154419 692.537109 L 1192.671265 724.268677 L 1188.724854 748.429688 L 1128.322144 779.194641 L 1046.818848 759.865845 L 856.590759 714.604126 L 791.355774 698.335754 L 782.335693 698.335754 L 782.335693 703.731567 L 836.69812 756.885986 L 936.322205 846.845581 L 1061.073975 962.81897 L 1067.436279 991.490112 L 1051.409424 1014.120911 L 1034.496704 1011.704712 L 924.885986 929.234924 L 882.604126 892.107544 L 786.845764 811.48999 L 780.483276 811.48999 L 780.483276 819.946289 L 802.550415 852.241699 L 919.087341 1027.409424 L 925.127625 1081.127686 L 916.671204 1098.604126 L 886.469849 1109.154419 L 853.288696 1103.114136 L 785.073914 1007.355835 L 714.684631 899.516785 L 657.906067 802.872498 L 650.979858 806.81897 L 617.476624 1167.704834 L 601.771851 1186.147705 L 565.530212 1200 L 535.328857 1177.046997 L 519.302124 1139.919556 L 535.328857 1066.550537 L 554.657776 970.792053 L 570.362488 894.68457 L 584.536926 800.134277 L 592.993347 768.724976 L 592.429626 766.630859 L 585.503479 767.516968 L 514.22821 865.369263 L 405.825531 1011.865906 L 320.053711 1103.677979 L 299.516815 1111.812256 L 263.919525 1093.369263 L 267.221497 1060.429688 L 287.114136 1031.114136 L 405.825531 880.107361 L 477.422913 786.52356 L 523.651062 732.483276 L 523.328918 724.671265 L 520.590698 724.671265 L 205.288605 929.395935 L 149.154434 936.644409 L 124.993355 914.01355 L 127.973183 876.885986 L 139.409409 864.80542 L 234.201385 799.570435 L 233.879227 799.8927 Z",hf="M60.8734,57.2556v-14.9432c0-1.2586.4722-2.2029,1.5728-2.8314l30.0443-17.3023c4.0899-2.3593,8.9662-3.4599,13.9988-3.4599,18.8759,0,30.8307,14.6289,30.8307,30.2006,0,1.1007,0,2.3593-.158,3.6178l-31.1446-18.2467c-1.8872-1.1006-3.7754-1.1006-5.6629,0l-39.4812,22.9651ZM131.0276,115.4561v-35.7074c0-2.2028-.9446-3.7756-2.8318-4.8763l-39.481-22.9651,12.8982-7.3934c1.1007-.6285,2.0453-.6285,3.1458,0l30.0441,17.3024c8.6523,5.0341,14.4708,15.7296,14.4708,26.1107,0,11.9539-7.0769,22.965-18.2461,27.527v.0021ZM51.593,83.9964l-12.8982-7.5497c-1.1007-.6285-1.5728-1.5728-1.5728-2.8314v-34.6048c0-16.8303,12.8982-29.5722,30.3585-29.5722,6.607,0,12.7403,2.2029,17.9324,6.1349l-30.987,17.9324c-1.8871,1.1007-2.8314,2.6735-2.8314,4.8764v45.6159l-.0014-.0015ZM79.3562,100.0403l-18.4829-10.3811v-22.0209l18.4829-10.3811,18.4812,10.3811v22.0209l-18.4812,10.3811ZM91.2319,147.8591c-6.607,0-12.7403-2.2031-17.9324-6.1344l30.9866-17.9333c1.8872-1.1005,2.8318-2.6728,2.8318-4.8759v-45.616l13.0564,7.5498c1.1005.6285,1.5723,1.5728,1.5723,2.8314v34.6051c0,16.8297-13.0564,29.5723-30.5147,29.5723v.001ZM53.9522,112.7822l-30.0443-17.3024c-8.652-5.0343-14.471-15.7296-14.471-26.1107,0-12.1119,7.2356-22.9652,18.403-27.5272v35.8634c0,2.2028.9443,3.7756,2.8314,4.8763l39.3248,22.8068-12.8982,7.3938c-1.1007.6287-2.045.6287-3.1456,0ZM52.2229,138.5791c-17.7745,0-30.8306-13.3713-30.8306-29.8871,0-1.2585.1578-2.5169.3143-3.7754l30.987,17.9323c1.8871,1.1005,3.7757,1.1005,5.6628,0l39.4811-22.807v14.9435c0,1.2585-.4721,2.2021-1.5728,2.8308l-30.0443,17.3025c-4.0898,2.359-8.9662,3.4605-13.9989,3.4605h.0014ZM91.2319,157.296c19.0327,0,34.9188-13.5272,38.5383-31.4594,17.6164-4.562,28.9425-21.0779,28.9425-37.908,0-11.0112-4.719-21.7066-13.2133-29.4143.7867-3.3035,1.2595-6.607,1.2595-9.909,0-22.4929-18.2471-39.3247-39.3251-39.3247-4.2461,0-8.3363.6285-12.4262,2.045-7.0792-6.9213-16.8318-11.3254-27.5271-11.3254-19.0331,0-34.9191,13.5268-38.5384,31.4591C11.3255,36.0212,0,52.5373,0,69.3675c0,11.0112,4.7184,21.7065,13.2125,29.4142-.7865,3.3035-1.2586,6.6067-1.2586,9.9092,0,22.4923,18.2466,39.3241,39.3248,39.3241,4.2462,0,8.3362-.6277,12.426-2.0441,7.0776,6.921,16.8302,11.3251,27.5271,11.3251Z",yf="M29.8768 25.3531C30.9809 25.3531 31.876 26.2481 31.876 27.3522V31.3505C31.876 32.4545 30.9809 33.3496 29.8768 33.3496C28.7727 33.3496 27.8777 32.4545 27.8777 31.3505V27.3522C27.8777 26.2481 28.7727 25.3531 29.8768 25.3531ZM19.8812 25.3531C20.9852 25.3531 21.8803 26.2481 21.8803 27.3522V31.3505C21.8803 32.4545 20.9852 33.3496 19.8812 33.3496C18.7771 33.3496 17.882 32.4545 17.882 31.3505V27.3522C17.882 26.2481 18.7771 25.3531 19.8812 25.3531ZM24.8601 40.8772C36.974 40.8772 46.9603 33.8278 48.6801 30.8403C48.8058 30.6218 48.8464 30.3723 48.8464 30.1202V24.8018C48.8464 24.5813 48.8124 24.3622 48.7308 24.1574C47.9871 22.2899 46.0394 19.5773 43.5257 18.8495C43.1925 17.994 42.6989 16.7433 42.2384 15.8201C42.3154 15.1138 42.3426 14.3853 42.3426 13.6492C42.3426 10.99 41.7789 8.65743 40.0805 6.92044C39.2872 6.10915 38.3028 5.48684 37.1355 5.01903C34.3398 2.74775 30.2723 0.837036 24.8169 0.837036C19.3616 0.837036 15.3805 2.74775 12.5847 5.01903C11.4174 5.48684 10.433 6.10915 9.63975 6.92044C7.9413 8.65743 7.37764 10.99 7.37764 13.6492C7.37764 14.3853 7.40477 15.1138 7.48186 15.8201C7.02133 16.7433 6.52774 17.994 6.19449 18.8495C3.68082 19.5773 1.73309 22.2899 0.989389 24.1574C0.907813 24.3622 0.873779 24.5813 0.873779 24.8018V30.1202C0.873779 30.3723 0.914376 30.6218 1.04014 30.8403C2.75994 33.8278 12.7462 40.8772 24.8601 40.8772ZM26.485 13.0046C26.4 12.3422 26.3595 11.749 26.3584 11.2191L26.3584 11.1772C26.361 9.63975 26.6971 8.63938 27.2339 8.02499C27.9156 7.2448 29.3246 6.64707 32.2941 6.96844C35.3026 7.29402 36.9842 8.04072 37.9376 9.01574C38.8606 9.95971 39.3455 11.372 39.3455 13.6492C39.3455 16.0687 38.9969 17.4982 38.2302 18.3678C37.5012 19.1946 36.0656 19.8674 32.9214 19.8674C30.5041 19.8674 29.1221 19.0812 28.2386 17.9939C27.2899 16.8264 26.7559 15.1161 26.485 13.0046ZM23.2353 13.0046C23.3203 12.3422 23.3607 11.749 23.3619 11.2191L23.3619 11.1772C23.3592 9.63974 23.0232 8.63937 22.4863 8.02498C21.8046 7.24479 20.3957 6.64707 17.4261 6.96843C14.4176 7.29402 12.736 8.04071 11.7826 9.01573C10.8596 9.9597 10.3747 11.372 10.3747 13.6492C10.3747 16.0687 10.7234 17.4982 11.49 18.3677C12.219 19.1946 13.6546 19.8674 16.7989 19.8674C19.2161 19.8674 20.5981 19.0812 21.4816 17.9939C22.4304 16.8264 22.9643 15.1161 23.2353 13.0046ZM25.2042 18.8676L25.0543 18.8676C24.8715 18.8678 24.6005 18.868 24.516 18.8676C24.3045 19.2218 24.0693 19.5618 23.8075 19.884C22.2697 21.7764 19.9741 22.8644 16.7988 22.8644C13.3524 22.8644 10.8266 22.1471 9.24196 20.3498C9.15187 20.2476 9.07125 20.1406 9.07125 20.1406L8.87613 20.3498V33.5049C11.7429 35.0628 17.8959 37.8586 24.8601 37.8586C31.8243 37.8586 37.9773 35.0628 40.8441 33.5049V20.3498L40.649 20.1406C40.649 20.1406 40.5829 20.231 40.4783 20.3498C38.8936 22.1471 36.3678 22.8644 32.9214 22.8644C29.7461 22.8644 27.4506 21.7764 25.9127 19.884C25.6509 19.5618 25.4157 19.2218 25.2042 18.8676Z";function bf({size:e=16,style:t}){return So("svg",{width:e,height:e,viewBox:"0 0 1200 1200",fill:"currentColor",stroke:"none",style:f({flexShrink:0},t),children:So("path",{d:mf})})}function xf({size:e=16,style:t}){return So("svg",{width:e,height:e,viewBox:"0 0 158.7128 157.296",fill:"currentColor",stroke:"none",style:f({flexShrink:0},t),children:So("path",{d:hf})})}function vf({size:e=16,style:t}){return So("svg",{width:e,height:e,viewBox:"0 0 49.7202 40.0402",fill:"currentColor",stroke:"none",style:f({flexShrink:0},t),children:So("path",{d:yf,fillRule:"evenodd",clipRule:"evenodd"})})}function Fr({provider:e,size:t=16,style:n}){return e==="codex"?So(xf,{size:t,style:n}):e==="copilot"?So(vf,{size:t,style:n}):So(bf,{size:t,style:n})}var ki=[{id:"claude-opus-4-6",label:"Opus 4.6",source:"static"},{id:"claude-sonnet-4-6",label:"Sonn 4.6",source:"static"}],Ti=[{id:"gpt-5.4",label:"GPT 5.4",source:"static"},{id:"gpt-5.3-codex",label:"Codex 5.3",source:"static"},{id:"gpt-5.3-codex-spark",label:"Spark 5.3",source:"static"}],As=[{id:"",label:"Default",source:"static"}];var Sf=[...ki,...Ti,...As];function Ps(e,t){if(t==="copilot"&&!e)return"Copilot";if(!e)return t==="codex"?"Codex":"Claude Code";let n=Sf.find(o=>o.id===e);return n?n.label:e.replace(/-\d{8,}$/,"")}import{jsx as mc}from"react/jsx-runtime";var wo={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#dedede",bgHover:"#e2e2e2",separator:"#e5e7eb"};function Lo({children:e,active:t,siblingActive:n,disabled:o,onClick:r,title:i}){let s=()=>o?.4:n&&!t?.5:1,a={position:"relative",display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,borderRadius:0,border:"none",cursor:o?"default":"pointer",transition:"background-color 150ms ease, color 150ms ease, transform 100ms ease, opacity 150ms ease",backgroundColor:t?wo.bgActive:"transparent",color:t?wo.iconActive:wo.iconDefault,opacity:s()};return mc("button",{type:"button",onClick:o?void 0:r,title:i,disabled:o,style:a,onMouseEnter:l=>{o||(l.currentTarget.style.opacity="1",t||(l.currentTarget.style.backgroundColor=wo.bgHover))},onMouseLeave:l=>{o||(l.currentTarget.style.opacity=String(s()),t||(l.currentTarget.style.backgroundColor="transparent"))},onMouseDown:l=>{o||(l.currentTarget.style.transform="scale(0.95)")},onMouseUp:l=>{o||(l.currentTarget.style.transform="scale(1)")},children:e})}function gc(){return mc("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as $r,jsx as Se,jsxs as Mt}from"react/jsx-runtime";function Af(e,t){if(e<=0)return[];if(e<=4)return Array.from({length:e},(r,i)=>({key:`model-${i}`,index:i,active:i===t}));let n=e-1,o=r=>({key:`model-${r}`,index:r,active:r===t});return t===0?[o(0),o(1),o(2),{key:"overflow-after",overflow:!0}]:t===1?[{key:"overflow-before",overflow:!0},o(1),o(2),{key:"overflow-after",overflow:!0}]:t===n-1?[{key:"overflow-before",overflow:!0},o(n-2),o(n-1),o(n)]:t===n?[{key:"overflow-before",overflow:!0},o(n-2),o(n-1),o(n)]:t%2===0?[{key:"overflow-before",overflow:!0},o(t-1),o(t),{key:"overflow-after",overflow:!0}]:[{key:"overflow-before",overflow:!0},o(t),o(t+1),{key:"overflow-after",overflow:!0}]}var er=[{type:"rectangle",icon:If,label:"Rectangle",shortcut:"R"},{type:"circle",icon:wf,label:"Oval",shortcut:"O"},{type:"line",icon:Mf,label:"Line",shortcut:"L"},{type:"freehand",icon:Tf,label:"Pen",shortcut:"P"}],Pf=new Set(er.map(e=>e.type));function Of(e,t,n,o,r,i,s,a){let l=(e-r)*(o-i)-(n-r)*(t-i),d=(e-s)*(i-a)-(r-s)*(t-a),c=(e-n)*(a-o)-(s-n)*(t-o),p=l<0||d<0||c<0,u=l>0||d>0||c>0;return!(p&&u)}function Bf(e="bottom-right"){return za(e,window.innerWidth,window.innerHeight)}var Df=[{type:"text",icon:Rf,label:"Text",shortcut:"T"}],hc={inspector:{name:"Comment",desc:"Pin feedback to specific elements on the page.",usage:["Click any element to attach a comment","Type your note, then hand off to your AI","Your AI may ask clarifying questions","Replies get threaded"],keys:[{key:"C",desc:"Select tool"},{key:"Click",desc:"Pin comment to element"},{key:"Esc",desc:"Deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},hand:{name:"Handle",desc:"Quickly finetune layout and typescale.",usage:["Edges \u2192 padding","Between items \u2192 spacing","Corners \u2192 rounding","Right of text \u2192 font size","Below text \u2192 line height","Click a spacing handle to cycle distribution","Right-click \u2192 inspect element styles"],keys:[{key:"H",desc:"Select tool"},{key:"Shift",desc:"Snap to scale"},{key:"\u2325 + swipe",desc:"Cycle justify / flip direction"},{key:"\u21E7 + swipe",desc:"Cycle align-items"},{key:"Right-click",desc:"Inspect styles"},{key:"Esc",desc:"Deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},rectangle:{name:"Rectangle",desc:"Draw rectangular highlights to mark areas of interest.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"R",desc:"Rectangle"},{key:"O",desc:"Oval"},{key:"L",desc:"Line"},{key:"P",desc:"Pen"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},circle:{name:"Oval",desc:"Draw oval highlights to mark areas of interest.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"O",desc:"Oval"},{key:"R",desc:"Rectangle"},{key:"L",desc:"Line"},{key:"P",desc:"Pen"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},line:{name:"Line",desc:"Draw line annotations to point at or connect elements.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"L",desc:"Line"},{key:"R",desc:"Rectangle"},{key:"O",desc:"Oval"},{key:"P",desc:"Pen"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},freehand:{name:"Pen",desc:"Draw freehand paths to annotate freely.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"P",desc:"Pen"},{key:"R",desc:"Rectangle"},{key:"O",desc:"Oval"},{key:"L",desc:"Line"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},text:{name:"Text",desc:"Place text labels anywhere on the page.",usage:["Click to place, then start typing","Click away or press Enter to finish","Scroll while hovering a label to resize it"],keys:[{key:"T",desc:"Select tool"},{key:"Esc",desc:"Cancel text or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},model:{name:"Model",desc:"Promote components into the local design model.",usage:["Hover to highlight component boundaries","Scroll to walk up/down the component tree","Click to add to model.json","Green = already in model"],keys:[{key:"M",desc:"Select tool"},{key:"Scroll",desc:"Walk tree depth"},{key:"Click",desc:"Promote component"},{key:"Esc",desc:"Deselect"}]},counter:{name:"Annotations",desc:"Click to cycle, scroll to change color, long press to reset.",usage:[],keys:[{key:"Click",desc:"Cycle annotations"},{key:"Scroll",desc:"Change color"},{key:"Hold",desc:"Reset to red"}]},clear:{name:"Clear",desc:"Remove all annotations and style changes.",usage:[],keys:[{key:"\u2318 \u232B",desc:"Clear all"},{key:"\u232B",desc:"Delete selected annotation"},{key:"\u2318 Z",desc:"Undo"},{key:"\u2318 \u21E7 Z",desc:"Redo"}]},collapse:{name:"Popmelt",desc:`Comment and zhuzh, then hand off.
9
9
 
10
- Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},yf={position:"fixed",bottom:16,right:16,zIndex:9999,display:"flex",alignItems:"center",backgroundColor:"#eaeaea",borderWidth:3,borderStyle:"solid",borderColor:"transparent",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",cursor:"pointer",overflow:"visible",boxSizing:"content-box",transition:"all 0ms cubic-bezier(0.4, 0, 0.2, 1)"},Cs="devtools-toolbar-expanded",ks="devtools-annotations",Es="devtools-style-modifications",Ts="devtools-active-tool",Ka="devtools-active-color",qa="devtools-stroke-width",Za="devtools-inspected-element",Ms="devtools-spacing-changes",bf={expanded:Cs,annotations:ks,styleMods:Es,spacingChanges:Ms,tool:Ts,color:Ka,stroke:qa,inspected:Za};function Qa({state:e,dispatch:t,onScreenshot:n,onSendToClaude:r,hasActiveJobs:o,activeJobColor:i,onCrosshairHover:s,onClear:l,provider:a="claude",onProviderChange:d,availableProviders:c,modelIndex:u=0,modelCount:p=2,modelLabel:g="Opus 4.6",onModelChange:w,onViewThread:C,isThreadPanelOpen:R,mcpStatus:P,onInstallMcp:G,mcpJustInstalled:M,bridgeUrl:T,isBridgeConnected:x,modelSelectedComponent:N,modelCanvasHoveredComponent:W,onModelComponentHover:_,onSpacingTokenHover:H,onModifySpacingToken:V,onDeleteSpacingToken:k,modelRefreshKey:A,onModelComponentAdded:Q,onModelComponentRemoved:ie,onMouseEnter:pe,toolbarRef:be}){let[me,We]=lr(()=>typeof window=="undefined"?!1:localStorage.getItem(Cs)==="true"),[Ce,oe]=lr(0),_e=Ft(0),Ne=Ft(0),je=Ft(e.isAnnotating),Fe=Ft(!1),Ie=Ft(typeof window!="undefined"?localStorage.getItem(Ts):null),ct=Ft(typeof window!="undefined"?localStorage.getItem(Ka):null),wt=Ft(typeof window!="undefined"?localStorage.getItem(qa):null),[Pe,Tt]=lr(null),nt=Ft(!1),Lt=Ft(null),Mt=Ft(null),Oe=Ft(null),[h,z]=lr([]),te=Ft({x:0,y:0}),se=Ft(null),ke=Ft(null),ye=Ft(null),ae=Bn(()=>{se.current=null,ke.current=null,ye.current&&(clearTimeout(ye.current),ye.current=null)},[]),de=Bn(D=>{Mt.current&&(clearTimeout(Mt.current),Mt.current=null),nt.current?(se.current=D,ke.current=f({},te.current),ye.current&&clearTimeout(ye.current),ye.current=setTimeout(()=>{se.current&&(Tt(se.current),ae())},300)):(Lt.current&&clearTimeout(Lt.current),Lt.current=setTimeout(()=>{nt.current=!0,Tt(D),Lt.current=null},500))},[ae]),ue=Bn(()=>{ae(),Lt.current&&(clearTimeout(Lt.current),Lt.current=null),Mt.current=setTimeout(()=>{nt.current=!1,Tt(null)},150)},[ae]);yn(()=>{let D=Oe.current;if(!D)return;let X=()=>{ae(),Mt.current&&(clearTimeout(Mt.current),Mt.current=null)},re=()=>{Mt.current=setTimeout(()=>{nt.current=!1,Tt(null)},150)};return D.addEventListener("mouseenter",X),D.addEventListener("mouseleave",re),()=>{D.removeEventListener("mouseenter",X),D.removeEventListener("mouseleave",re)}},[Pe,ae]),yn(()=>{if(Pe!=="counter"||!T)return;let D=!1;return fetch(`${T}/threads/recent?limit=5`).then(X=>X.ok?X.json():[]).then(X=>{D||z(X)}).catch(()=>{}),()=>{D=!0}},[Pe,T]);let Ye=Bn(D=>{if(te.current={x:D.clientX,y:D.clientY},se.current&&ke.current){let X=ke.current,re=mf();gf(D.clientX,D.clientY,X.x,X.y,re.left,re.y,re.right,re.y)||(Tt(se.current),ae())}},[ae]),qe=Er(()=>{let D=(c!=null?c:[]).map(X=>X==="claude"?"Claude":X==="codex"?"Codex":X);return{name:"AI Model",desc:D.length>1?`${D.join(" and ")} are available.`:D.length===1?`Connected to ${D[0]}.`:"No AI providers detected.",usage:D.length>1?["Click the logo to switch between providers","Click the model name to switch tiers"]:["Click the model name to switch tiers"],keys:D.length>1?[{key:"Click",desc:"Switch"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]:[{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]}},[c]);Ra(me,e,Fe,!!o,bf),yn(()=>{let D=new URLSearchParams(window.location.search);if(!D.has("popmelt"))return;let X=document.createElement("style");X.textContent="nextjs-portal, vite-error-overlay { display: none !important; }",document.head.appendChild(X);let re=parseInt(D.get("popmelt")||"0",10)||0,we=()=>{We(!0),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SET_ANNOTATING",payload:!0})};if(re>0){let K=setTimeout(we,re);return()=>clearTimeout(K)}we()},[]),yn(()=>{var re;if(localStorage.getItem(Cs)==="true"&&!e.isAnnotating){if(me||We(!0),t({type:"SET_TOOL",payload:Ie.current||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),ct.current&&t({type:"SET_COLOR",payload:ct.current}),wt.current){let v=parseFloat(wt.current);isNaN(v)||t({type:"SET_STROKE_WIDTH",payload:v})}let we=localStorage.getItem(ks);if(we)try{let v=JSON.parse(we);if(Array.isArray(v)&&v.length>0){for(let B of v)(B.status==="waiting_input"||B.status==="in_flight")&&(B.status=B.threadId?"resolved":"pending");t({type:"RESTORE_ANNOTATIONS",payload:{annotations:v}})}}catch(v){}let K=localStorage.getItem(Es);if(K)try{let v=JSON.parse(K);Array.isArray(v)&&v.length>0&&(t({type:"RESTORE_STYLE_MODIFICATIONS",payload:v}),Gr(v))}catch(v){}let Ee=localStorage.getItem(Ms);if(Ee)try{let v=JSON.parse(Ee);Array.isArray(v)&&v.length>0&&t({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:v})}catch(v){}let Te=localStorage.getItem(Za);if(Te)try{let{selector:v,info:B}=JSON.parse(Te);if(v){let ee=vn(v);if(ee){let le=B||y(f({},kn(ee)),{selector:v});t({type:"SELECT_ELEMENT",payload:{el:ee,info:le}})}}}catch(v){}let Le=sessionStorage.getItem("popmelt-pending-focus");if(Le){sessionStorage.removeItem("popmelt-pending-focus");try{let{annotationId:v}=JSON.parse(Le);if(v){let B=we?(re=JSON.parse(we))!=null?re:[]:[];requestAnimationFrame(()=>{t({type:"SELECT_ANNOTATION",payload:{id:v}});let ee=B.find(le=>le.id===v);if(ee){let Me=(ee.groupId?B.filter(ge=>ge.groupId===ee.groupId):[ee]).flatMap(ge=>ge.points);if(Me.length>0){let ge=Math.min(...Me.map(Ze=>Ze.x)),Ge=Math.max(...Me.map(Ze=>Ze.x)),Xe=Math.min(...Me.map(Ze=>Ze.y)),mt=Math.max(...Me.map(Ze=>Ze.y));window.scrollTo({left:(ge+Ge)/2-window.innerWidth/2,top:(Xe+mt)/2-window.innerHeight/2,behavior:"smooth"})}}})}}catch(v){}}}let X=sessionStorage.getItem("popmelt-pending-thread");if(X){sessionStorage.removeItem("popmelt-pending-thread");try{let{threadId:we,selector:K,preview:Ee}=JSON.parse(X);we&&requestAnimationFrame(()=>{if(K)try{let Te=document.querySelector(K);if(Te){let Le=Te.getBoundingClientRect(),v=Math.random().toString(36).slice(2,9);t({type:"ADD_TEXT",payload:{id:v,point:{x:Le.left+Le.width,y:Le.top},text:Ee||"[thread]",linkedSelector:K,linkedAnchor:"top-left"}}),t({type:"SET_ANNOTATION_THREAD",payload:{ids:[v],threadId:we}}),t({type:"SET_ANNOTATION_STATUS",payload:{ids:[v],status:"resolved"}})}}catch(Te){}C&&C(we)})}catch(we){}}return Fe.current=!0,()=>{Fe.current=!1}},[]);let st=Ft(e.styleModifications);yn(()=>{let D=st.current,X=e.styleModifications;D!==X&&(Jr(D),Gr(X),st.current=X)},[e.styleModifications]),yn(()=>{let D=je.current;je.current=e.isAnnotating,D&&!e.isAnnotating&&me&&We(!1)},[e.isAnnotating,me]);let Pt=Ft(me);Pt.current=me,yn(()=>{let D=re=>{if(re.key==="Meta"||re.key==="Control"){let we=Date.now();if(we-_e.current<300){if(Ne.current++,Ne.current>=2){if(Pt.current)t({type:"SET_ANNOTATING",payload:!1}),We(!1);else{let Te=localStorage.getItem(Ts);t({type:"SET_TOOL",payload:Te||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),We(!0)}Ne.current=0}}else Ne.current=1;_e.current=we}else Ne.current=0},X=re=>{re.key!=="Meta"&&re.key!=="Control"&&(Ne.current=0)};return window.addEventListener("keydown",D),window.addEventListener("keyup",X),()=>{window.removeEventListener("keydown",D),window.removeEventListener("keyup",X)}},[t]);let Ct=Bn(D=>{ae(),t({type:"SET_TOOL",payload:D}),e.isAnnotating||t({type:"SET_ANNOTATING",payload:!0}),nt.current=!1,Tt(null),Lt.current&&(clearTimeout(Lt.current),Lt.current=null),Mt.current&&(clearTimeout(Mt.current),Mt.current=null)},[t,e.isAnnotating,ae]),It=Bn(async()=>{window.focus(),await n()},[n]),Gt=Bn(async()=>{r&&await r()},[r]),Jt=Bn(()=>{t({type:"SET_ANNOTATING",payload:!1}),We(!1)},[t]),$t=Bn(()=>{Jr(e.styleModifications),document.querySelectorAll("[data-pm]").forEach(D=>D.removeAttribute("data-pm")),t({type:"CLEAR"}),t({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(ks),localStorage.removeItem(Es),localStorage.removeItem(Ms),rn(null),l==null||l()},[t,e.styleModifications,l]),[on,Ot]=lr(()=>{if(ct.current){let D=ct.current.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);if(D!=null&&D[1])return parseFloat(D[1])}return 29}),bn=Ft(null),St=Ft(null),ne=Ft(!1),De=Bn(D=>{let X=D.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return X&&X[1]?parseFloat(X[1]):null},[]);yn(()=>{ne.current=!0;let D=`oklch(0.628 0.258 ${on})`;t({type:"SET_COLOR",payload:D}),requestAnimationFrame(()=>{ne.current=!1})},[on,t]),yn(()=>{if(ne.current)return;let D=De(e.activeColor);D!==null&&Math.abs(D-on)>.5&&Ot(D)},[e.activeColor,De,on]);let ot=e.annotations.length>0;yn(()=>{let D=St.current;if(!D||!ot)return;let X=re=>{re.preventDefault(),re.stopPropagation();let we=re.deltaY>0?-1:1,K=((on+we)%360+360)%360,Ee=`oklch(0.628 0.258 ${K})`;Ot(K),e.selectedAnnotationIds.length>0&&t({type:"UPDATE_ANNOTATION_COLOR",payload:{id:e.lastSelectedId||e.selectedAnnotationIds[0],color:Ee}})};return D.addEventListener("wheel",X,{passive:!1}),()=>D.removeEventListener("wheel",X)},[ot,e.selectedAnnotationIds,e.lastSelectedId,on,t]);let Dn=Ft(!1),Tn=Ft(0);yn(()=>{let D=e.annotations.some(we=>!we.status||we.status==="pending"),X=Dn.current;Dn.current=D;let re=Tn.current===0&&e.annotations.length>0;if(Tn.current=e.annotations.length,(X&&!D||re&&!D)&&e.annotations.length>0){let we=e.annotations.map(K=>De(K.color)).filter(K=>K!==null);if(we.length>0){let K=0,Ee=-1;for(let Te=0;Te<360;Te++){let Le=Math.min(...we.map(v=>{let B=Math.abs(Te-v);return Math.min(B,360-B)}));Le>Ee&&(Ee=Le,K=Te)}Ot(K)}}},[e.annotations,De]);let Qt=Ft(!1),Mn=Bn(()=>{Qt.current=!1,bn.current=setTimeout(()=>{Qt.current=!0,Ot(29)},500)},[]),Sn=Bn(()=>{bn.current&&(clearTimeout(bn.current),bn.current=null)},[]);yn(()=>()=>{bn.current&&clearTimeout(bn.current),ye.current&&clearTimeout(ye.current)},[]);let Bt=jo(),ur=Er(()=>e.annotations.filter(D=>!D.pathname||D.pathname===Bt),[e.annotations,Bt]),fn=Er(()=>Kr(e.annotations),[e.annotations]),Nt=Er(()=>{let D=[],X=new Set,re=[...e.annotations].sort((we,K)=>we.timestamp-K.timestamp);for(let we of re)if(!fn.has(we))if(we.groupId){if(!X.has(we.groupId)){X.add(we.groupId);let K=e.annotations.filter(Le=>Le.groupId===we.groupId&&!fn.has(Le)),Ee=K.find(Le=>Le.type!=="text")||K[0],Te=Math.min(...K.map(Le=>Le.timestamp));D.push({id:Ee.id,pathname:we.pathname,annotations:K,timestamp:Te})}}else D.push({id:we.id,pathname:we.pathname,annotations:[we],timestamp:we.timestamp});return D},[e.annotations,fn]),Dt=Er(()=>Nt.filter(D=>!D.pathname||D.pathname===Bt),[Nt,Bt]),[yt,rn]=lr(null),_t=Nt.length+e.styleModifications.length;yn(()=>{(_t===0||yt!==null&&yt>=_t)&&rn(null)},[_t,yt]),yn(()=>{if(e.selectedAnnotationIds.length===0&&!e.inspectedElement){rn(null);return}if(e.selectedAnnotationIds.length>0){let D=e.selectedAnnotationIds[0],X=Nt.findIndex(re=>re.id===D||re.annotations.some(we=>we.id===D));X>=0&&X!==yt&&rn(X)}},[e.selectedAnnotationIds,e.inspectedElement,Nt]);let Qn=Bn(()=>{var X;if(_t===0)return;let D;if(yt===null?D=0:yt+1>=_t?D=null:D=yt+1,rn(D),D===null){t({type:"SELECT_ANNOTATION",payload:{id:null}}),t({type:"SELECT_ELEMENT",payload:null});return}if(D<Nt.length){let re=Nt[D];if(!(!re.pathname||re.pathname===Bt)){sessionStorage.setItem("popmelt-pending-focus",JSON.stringify({annotationId:re.id,pathname:re.pathname})),window.location.href=re.pathname;return}t({type:"SELECT_ELEMENT",payload:null}),t({type:"SELECT_ANNOTATION",payload:{id:re.id}});let K=re.annotations.find(ge=>ge.type!=="text")||re.annotations[0];if(re.annotations.some(ge=>ge.linkedSelector))t({type:"SET_TOOL",payload:"inspector"});else if(K!=null&&K.type&&K.type!=="text"&&K.type!=="inspector"){t({type:"SET_TOOL",payload:K.type});let ge=No.findIndex(Ge=>Ge.type===K.type);ge>=0&&oe(ge)}if(K!=null&&K.color){t({type:"SET_COLOR",payload:K.color});let ge=De(K.color);ge!==null&&Ot(ge)}let Te=re.annotations.flatMap(ge=>ge.points);if(Te.length===0)return;let Le=Math.min(...Te.map(ge=>ge.x)),v=Math.max(...Te.map(ge=>ge.x)),B=Math.min(...Te.map(ge=>ge.y)),ee=Math.max(...Te.map(ge=>ge.y)),le=(Le+v)/2,Me=(B+ee)/2;if(window.scrollTo({left:le-window.innerWidth/2,top:Me-window.innerHeight/2,behavior:"smooth"}),R&&C){let ge=(X=re.annotations.find(Ge=>Ge.threadId))==null?void 0:X.threadId;ge&&C(ge)}}else{let re=D-Nt.length,we=e.styleModifications[re];if(!we)return;let K=vn(we.selector);if(!K)return;t({type:"SELECT_ANNOTATION",payload:{id:null}}),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SELECT_ELEMENT",payload:{el:K,info:we.element}});let Ee=K.getBoundingClientRect(),Te=Ee.left+Ee.width/2+window.scrollX,Le=Ee.top+Ee.height/2+window.scrollY;window.scrollTo({left:Te-window.innerWidth/2,top:Le-window.innerHeight/2,behavior:"smooth"})}},[Nt,Bt,e.styleModifications,_t,yt,t,De,R,C]);yn(()=>{if(!me)return;let D=X=>{var Ee;let re=document.activeElement;for(;(Ee=re==null?void 0:re.shadowRoot)!=null&&Ee.activeElement;)re=re.shadowRoot.activeElement;if((re==null?void 0:re.tagName)==="INPUT"||(re==null?void 0:re.tagName)==="TEXTAREA"||re!=null&&re.isContentEditable)return;if((X.metaKey||X.ctrlKey)&&X.key==="Enter"){r&&(e.annotations.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(Te=>!Te.captured).length>0)&&(X.preventDefault(),Gt());return}if((X.metaKey||X.ctrlKey)&&(X.key==="c"||X.key==="C"||X.code==="KeyC")){let Te=window.getSelection();if(Te&&Te.toString().length>0)return;(e.annotations.length>0||e.styleModifications.length>0)&&(X.preventDefault(),window.focus(),It());return}if((X.metaKey||X.ctrlKey)&&(X.key==="Backspace"||X.key==="Delete")){X.preventDefault(),$t();return}if(X.metaKey||X.ctrlKey||X.altKey)return;let we={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand"};if(X.key.toLowerCase()==="m"){X.preventDefault(),Ct("model");return}let K=we[X.key.toLowerCase()];if(K){X.preventDefault();let Te=No.findIndex(Le=>Le.type===K);Te>=0&&oe(Te),Ct(K)}};return window.addEventListener("keydown",D),()=>window.removeEventListener("keydown",D)},[me,Ct,It,Gt,r,$t,e.annotations.length,e.styleModifications.length,e.spacingTokenChanges,Pe]);let wn=y(f({},yf),{borderRadius:0,padding:me?"0 8px":"0",width:me?"auto":48,height:48,gap:0,justifyContent:me?"flex-start":"center"}),lt=`<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='${o&&i?i:"rgb(0,0,0)"}' stroke-width='.75'/></svg>`,eo=Se("div",{style:f({position:"absolute",inset:-3,padding:5,backgroundImage:`url("data:image/svg+xml,${encodeURIComponent(lt)}")`,backgroundSize:"5px 5px",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",maskComposite:"exclude",pointerEvents:"none"},o&&{animation:"popmelt-border-march 0.8s linear infinite"})}),xo=x===!1?"rgba(239, 68, 68, 0.4)":o&&i?i:so.iconActive,vo=Ft(null);yn(()=>{if(!me)return;let D=vo.current;if(!D)return;let X=()=>{s==null||s(!0),de("collapse")},re=()=>{s==null||s(!1),ue()};return D.addEventListener("mouseenter",X),D.addEventListener("mouseleave",re),()=>{D.removeEventListener("mouseenter",X),D.removeEventListener("mouseleave",re)}},[me,o,s,de,ue]);let to=Ft(null);return yn(()=>{if(me)return;let D=to.current;if(!D)return;let X=D.querySelector("[data-popmelt-logo]"),re=()=>{D.style.opacity="1",!o&&X&&(X.style.fill="#000"),pe==null||pe()},we=()=>{D.style.opacity=o?"1":"0.5",!o&&X&&(X.style.fill="none")};return D.addEventListener("mouseenter",re),D.addEventListener("mouseleave",we),()=>{D.removeEventListener("mouseenter",re),D.removeEventListener("mouseleave",we)}},[me,o,pe]),me?Et(Tr,{children:[Se("style",{children:`
10
+ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},_f={zIndex:9999,display:"flex",alignItems:"center",backgroundColor:"#eaeaea",borderWidth:3,borderStyle:"solid",borderColor:"transparent",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",cursor:"pointer",overflow:"visible",boxSizing:"content-box",transition:"none"},Os="devtools-toolbar-expanded",Bs="devtools-annotations",Ds="devtools-style-modifications",_s="devtools-active-tool",yc="devtools-active-color",bc="devtools-stroke-width",xc="devtools-inspected-element",Ns="devtools-spacing-changes",Nf={expanded:Os,annotations:Bs,styleMods:Ds,spacingChanges:Ns,tool:_s,color:yc,stroke:bc,inspected:xc};function vc({state:e,dispatch:t,onScreenshot:n,onSendToClaude:o,hasActiveJobs:r,activeJobColor:i,onCrosshairHover:s,onClear:a,provider:l="claude",onProviderChange:d,availableProviders:c,modelIndex:p=0,modelCount:u=2,modelLabel:g="Opus 4.6",onModelChange:b,onViewThread:x,isThreadPanelOpen:A,mcpStatus:T,bridgeUrl:z,isBridgeConnected:P,modelSelectedComponent:O,modelCanvasHoveredComponent:k,onModelComponentHover:G,onSpacingTokenHover:re,onModifySpacingToken:oe,onDeleteSpacingToken:W,modelRefreshKey:Q,onModelComponentAdded:N,onModelComponentRemoved:ee,onSynthesizeRules:M,isSynthesizing:Le,onMouseEnter:V,toolbarRef:fe,snapPosition:D="bottom-right",onSnapPositionChange:ae}){let[I,pe]=Qo(()=>typeof window!="undefined"?{w:window.innerWidth,h:window.innerHeight}:{w:1920,h:1080});gn(()=>{let w=()=>pe({w:window.innerWidth,h:window.innerHeight});return window.addEventListener("resize",w),()=>window.removeEventListener("resize",w)},[]);let[me,Fe]=Qo(()=>typeof window=="undefined"?!1:localStorage.getItem(Os)==="true"),[we,Je]=Qo(0),Re=Dt(0),Ce=Dt(0),at=Dt(e.isAnnotating),gt=Dt(!1),bt=Dt(typeof window!="undefined"?localStorage.getItem(_s):null),Yt=Dt(typeof window!="undefined"?localStorage.getItem(yc):null),K=Dt(typeof window!="undefined"?localStorage.getItem(bc):null),[X,Te]=Qo(null),Oe=Dt(!1),Xe=Dt(null),Pe=Dt(null),he=Dt(null),[te,ie]=Qo([]),ve=Dt({x:0,y:0}),Me=Dt(null),mt=Dt(null),Ne=Dt(null),ze=Wn(()=>{Me.current=null,mt.current=null,Ne.current&&(clearTimeout(Ne.current),Ne.current=null)},[]),nt=Wn(w=>{Pe.current&&(clearTimeout(Pe.current),Pe.current=null),Oe.current?(Me.current=w,mt.current=f({},ve.current),Ne.current&&clearTimeout(Ne.current),Ne.current=setTimeout(()=>{Me.current&&(Te(Me.current),ze())},300)):(Xe.current&&clearTimeout(Xe.current),Xe.current=setTimeout(()=>{Oe.current=!0,Te(w),Xe.current=null},500))},[ze]),St=Wn(()=>{ze(),Xe.current&&(clearTimeout(Xe.current),Xe.current=null),Pe.current=setTimeout(()=>{Oe.current=!1,Te(null)},150)},[ze]);gn(()=>{let w=he.current;if(!w)return;let H=()=>{ze(),Pe.current&&(clearTimeout(Pe.current),Pe.current=null)},q=()=>{Pe.current=setTimeout(()=>{Oe.current=!1,Te(null)},150)};return w.addEventListener("mouseenter",H),w.addEventListener("mouseleave",q),()=>{w.removeEventListener("mouseenter",H),w.removeEventListener("mouseleave",q)}},[X,ze]),gn(()=>{if(X!=="counter"||!z)return;let w=!1;return fetch(`${z}/threads/recent?limit=5`).then(H=>H.ok?H.json():[]).then(H=>{w||ie(H)}).catch(()=>{}),()=>{w=!0}},[X,z]);let Ke=Wn(w=>{if(ve.current={x:w.clientX,y:w.clientY},Me.current&&mt.current){let H=mt.current,q=Bf(D);Of(w.clientX,w.clientY,H.x,H.y,q.left,q.y,q.right,q.y)||(Te(Me.current),ze())}},[ze,D]),qe=Zo(()=>{let w=(c!=null?c:[]).map(H=>H==="claude"?"Claude":H==="codex"?"Codex":H==="copilot"?"Copilot":H);return{name:"AI Model",desc:w.length>1?`${w.join(" and ")} are available.`:w.length===1?`Connected to ${w[0]}.`:"No AI providers detected.",usage:w.length>1?["Click the logo to switch between providers","Click the model name to switch tiers"]:["Click the model name to switch tiers"],keys:w.length>1?[{key:"Click",desc:"Switch"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]:[{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]}},[c]),Rt=Zo(()=>{var q;let w=c&&c.length>0?c:["claude","codex","copilot"],H=w.indexOf(l);return(q=w[(H>=0?H+1:0)%w.length])!=null?q:l},[c,l]),_n=Zo(()=>Af(u,p),[u,p]);ql(me,e,gt,!!r,Nf),gn(()=>{let w=new URLSearchParams(window.location.search);if(!w.has("popmelt"))return;let H=document.createElement("style");H.textContent="nextjs-portal, vite-error-overlay { display: none !important; }",document.head.appendChild(H);let q=parseInt(w.get("popmelt")||"0",10)||0,ye=()=>{Fe(!0),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SET_ANNOTATING",payload:!0})};if(q>0){let de=setTimeout(ye,q);return()=>clearTimeout(de)}ye()},[]),gn(()=>{var q;if(localStorage.getItem(Os)==="true"&&!e.isAnnotating){if(me||Fe(!0),t({type:"SET_TOOL",payload:bt.current||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),Yt.current&&t({type:"SET_COLOR",payload:Yt.current}),K.current){let je=parseFloat(K.current);isNaN(je)||t({type:"SET_STROKE_WIDTH",payload:je})}let ye=localStorage.getItem(Bs);if(ye)try{let je=JSON.parse(ye);if(Array.isArray(je)&&je.length>0){for(let Pt of je)(Pt.status==="waiting_input"||Pt.status==="in_flight")&&(Pt.status=Pt.threadId?"resolved":"pending");t({type:"RESTORE_ANNOTATIONS",payload:{annotations:je}})}}catch(je){}let de=localStorage.getItem(Ds);if(de)try{let je=JSON.parse(de);Array.isArray(je)&&je.length>0&&(t({type:"RESTORE_STYLE_MODIFICATIONS",payload:je}),ri(je))}catch(je){}let ge=localStorage.getItem(Ns);if(ge)try{let je=JSON.parse(ge);Array.isArray(je)&&je.length>0&&t({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:je})}catch(je){}let He=localStorage.getItem(xc);if(He)try{let{selector:je,info:Pt}=JSON.parse(He);if(je){let Ft=In(je);if(Ft){let un=Pt||h(f({},Ln(Ft)),{selector:je});t({type:"SELECT_ELEMENT",payload:{el:Ft,info:un}})}}}catch(je){}let Ie=sessionStorage.getItem("popmelt-pending-focus");if(Ie){sessionStorage.removeItem("popmelt-pending-focus");try{let{annotationId:je}=JSON.parse(Ie);if(je){let Pt=ye?(q=JSON.parse(ye))!=null?q:[]:[];requestAnimationFrame(()=>{t({type:"SELECT_ANNOTATION",payload:{id:je}});let Ft=Pt.find(un=>un.id===je);if(Ft){let S=(Ft.groupId?Pt.filter(C=>C.groupId===Ft.groupId):[Ft]).flatMap(C=>C.points);if(S.length>0){let C=Math.min(...S.map(ke=>ke.x)),le=Math.max(...S.map(ke=>ke.x)),ce=Math.min(...S.map(ke=>ke.y)),Ae=Math.max(...S.map(ke=>ke.y));window.scrollTo({left:(C+le)/2-window.innerWidth/2,top:(ce+Ae)/2-window.innerHeight/2,behavior:"smooth"})}}})}}catch(je){}}}let H=sessionStorage.getItem("popmelt-pending-thread");if(H){sessionStorage.removeItem("popmelt-pending-thread");try{let{threadId:ye,selector:de,preview:ge}=JSON.parse(H);ye&&requestAnimationFrame(()=>{if(de)try{let He=document.querySelector(de);if(He){let Ie=He.getBoundingClientRect(),je=Math.random().toString(36).slice(2,9);t({type:"ADD_TEXT",payload:{id:je,point:{x:Ie.left+Ie.width,y:Ie.top},text:ge||"[thread]",linkedSelector:de,linkedAnchor:"top-left"}}),t({type:"SET_ANNOTATION_THREAD",payload:{ids:[je],threadId:ye}}),t({type:"SET_ANNOTATION_STATUS",payload:{ids:[je],status:"resolved"}})}}catch(He){}x&&x(ye)})}catch(ye){}}return gt.current=!0,()=>{gt.current=!1}},[]);let Kn=Dt(e.styleModifications);gn(()=>{let w=Kn.current,H=e.styleModifications;w!==H&&(ii(w),ri(H),Kn.current=H)},[e.styleModifications]),gn(()=>{let w=at.current;at.current=e.isAnnotating,w&&!e.isAnnotating&&me&&Fe(!1)},[e.isAnnotating,me]);let vn=Dt(me);vn.current=me,gn(()=>{let w=q=>{if(q.key==="Meta"||q.key==="Control"){let ye=Date.now();if(ye-Re.current<300){if(Ce.current++,Ce.current>=2){if(vn.current)t({type:"SET_ANNOTATING",payload:!1}),Fe(!1);else{let He=localStorage.getItem(_s);t({type:"SET_TOOL",payload:He||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),Fe(!0)}Ce.current=0}}else Ce.current=1;Re.current=ye}else Ce.current=0},H=q=>{q.key!=="Meta"&&q.key!=="Control"&&(Ce.current=0)};return window.addEventListener("keydown",w),window.addEventListener("keyup",H),()=>{window.removeEventListener("keydown",w),window.removeEventListener("keyup",H)}},[t]);let It=Wn(w=>{ze(),t({type:"SET_TOOL",payload:w}),e.isAnnotating||t({type:"SET_ANNOTATING",payload:!0}),Oe.current=!1,Te(null),Xe.current&&(clearTimeout(Xe.current),Xe.current=null),Pe.current&&(clearTimeout(Pe.current),Pe.current=null)},[t,e.isAnnotating,ze]),qn=Wn(async()=>{window.focus(),await n()},[n]),on=Wn(async()=>{o&&await o()},[o]),Zn=Wn(()=>{t({type:"SET_ANNOTATING",payload:!1}),Fe(!1)},[t]),xt=Wn(()=>{ii(e.styleModifications),document.querySelectorAll("[data-pm]").forEach(w=>w.removeAttribute("data-pm")),t({type:"CLEAR"}),t({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(Bs),localStorage.removeItem(Ds),localStorage.removeItem(Ns),lt(null),a==null||a()},[t,e.styleModifications,a]),[rn,_t]=Qo(()=>{if(Yt.current){let w=Yt.current.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);if(w!=null&&w[1])return parseFloat(w[1])}return 29}),sn=Dt(null),Nn=Dt(null),An=Dt(!1),Kt=Wn(w=>{let H=w.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return H&&H[1]?parseFloat(H[1]):null},[]);gn(()=>{An.current=!0;let w=`oklch(0.628 0.258 ${rn})`;t({type:"SET_COLOR",payload:w}),requestAnimationFrame(()=>{An.current=!1})},[rn,t]),gn(()=>{if(An.current)return;let w=Kt(e.activeColor);w!==null&&Math.abs(w-rn)>.5&&_t(w)},[e.activeColor,Kt,rn]);let Sn=Dt(null);gn(()=>{if(r&&i){let w=Kt(i);w!==null&&Math.abs(w-rn)>.5&&(Sn.current===null&&(Sn.current=rn),_t(w))}else Sn.current!==null&&(_t(Sn.current),Sn.current=null)},[r,i,Kt]);let bn=e.annotations.length>0;gn(()=>{let w=Nn.current;if(!w||!bn)return;let H=q=>{q.preventDefault(),q.stopPropagation();let ye=q.deltaY>0?-1:1,de=((rn+ye)%360+360)%360,ge=`oklch(0.628 0.258 ${de})`;_t(de),e.selectedAnnotationIds.length>0&&t({type:"UPDATE_ANNOTATION_COLOR",payload:{id:e.lastSelectedId||e.selectedAnnotationIds[0],color:ge}})};return w.addEventListener("wheel",H,{passive:!1}),()=>w.removeEventListener("wheel",H)},[bn,e.selectedAnnotationIds,e.lastSelectedId,rn,t]);let $=Dt(!1),De=Dt(0);gn(()=>{let w=e.annotations.some(ye=>!ye.status||ye.status==="pending"),H=$.current;$.current=w;let q=De.current===0&&e.annotations.length>0;if(De.current=e.annotations.length,(H&&!w||q&&!w)&&e.annotations.length>0){let ye=e.annotations.map(de=>Kt(de.color)).filter(de=>de!==null);if(ye.length>0){let de=0,ge=-1;for(let He=0;He<360;He++){let Ie=Math.min(...ye.map(je=>{let Pt=Math.abs(He-je);return Math.min(Pt,360-Pt)}));Ie>ge&&(ge=Ie,de=He)}_t(de)}}},[e.annotations,Kt]);let Ge=Dt(!1),En=Wn(()=>{Ge.current=!1,sn.current=setTimeout(()=>{Ge.current=!0,_t(29)},500)},[]),At=Wn(()=>{sn.current&&(clearTimeout(sn.current),sn.current=null)},[]);gn(()=>()=>{sn.current&&clearTimeout(sn.current),Ne.current&&clearTimeout(Ne.current)},[]);let qt=cr(),wn=Zo(()=>e.annotations.filter(w=>!w.pathname||w.pathname===qt),[e.annotations,qt]),Wt=Zo(()=>ci(e.annotations),[e.annotations]),Gt=Zo(()=>{let w=[],H=new Set,q=[...e.annotations].sort((ye,de)=>ye.timestamp-de.timestamp);for(let ye of q)if(!Wt.has(ye))if(ye.groupId){if(!H.has(ye.groupId)){H.add(ye.groupId);let de=e.annotations.filter(Ie=>Ie.groupId===ye.groupId&&!Wt.has(Ie)),ge=de.find(Ie=>Ie.type!=="text")||de[0],He=Math.min(...de.map(Ie=>Ie.timestamp));w.push({id:ge.id,pathname:ye.pathname,annotations:de,timestamp:He})}}else w.push({id:ye.id,pathname:ye.pathname,annotations:[ye],timestamp:ye.timestamp});return w},[e.annotations,Wt]),Pn=Zo(()=>Gt.filter(w=>!w.pathname||w.pathname===qt),[Gt,qt]),[Nt,lt]=Qo(null),Ht=Gt.length+e.styleModifications.length;gn(()=>{(Ht===0||Nt!==null&&Nt>=Ht)&&lt(null)},[Ht,Nt]),gn(()=>{if(e.selectedAnnotationIds.length===0&&!e.inspectedElement){lt(null);return}if(e.selectedAnnotationIds.length>0){let w=e.selectedAnnotationIds[0],H=Gt.findIndex(q=>q.id===w||q.annotations.some(ye=>ye.id===w));H>=0&&H!==Nt&&lt(H)}},[e.selectedAnnotationIds,e.inspectedElement,Gt]);let Jt=Wn(()=>{var H;if(Ht===0)return;let w;if(Nt===null?w=0:Nt+1>=Ht?w=null:w=Nt+1,lt(w),w===null){t({type:"SELECT_ANNOTATION",payload:{id:null}}),t({type:"SELECT_ELEMENT",payload:null});return}if(w<Gt.length){let q=Gt[w];if(!(!q.pathname||q.pathname===qt)){sessionStorage.setItem("popmelt-pending-focus",JSON.stringify({annotationId:q.id,pathname:q.pathname})),window.location.href=q.pathname;return}t({type:"SELECT_ELEMENT",payload:null}),t({type:"SELECT_ANNOTATION",payload:{id:q.id}});let de=q.annotations.find(C=>C.type!=="text")||q.annotations[0];if(q.annotations.some(C=>C.linkedSelector))t({type:"SET_TOOL",payload:"inspector"});else if(de!=null&&de.type&&de.type!=="text"&&de.type!=="inspector"){t({type:"SET_TOOL",payload:de.type});let C=er.findIndex(le=>le.type===de.type);C>=0&&Je(C)}if(de!=null&&de.color){t({type:"SET_COLOR",payload:de.color});let C=Kt(de.color);C!==null&&_t(C)}let He=q.annotations.flatMap(C=>C.points);if(He.length===0)return;let Ie=Math.min(...He.map(C=>C.x)),je=Math.max(...He.map(C=>C.x)),Pt=Math.min(...He.map(C=>C.y)),Ft=Math.max(...He.map(C=>C.y)),un=(Ie+je)/2,S=(Pt+Ft)/2;if(window.scrollTo({left:un-window.innerWidth/2,top:S-window.innerHeight/2,behavior:"smooth"}),A&&x){let C=(H=q.annotations.find(le=>le.threadId))==null?void 0:H.threadId;C&&x(C)}}else{let q=w-Gt.length,ye=e.styleModifications[q];if(!ye)return;let de=In(ye.selector);if(!de)return;t({type:"SELECT_ANNOTATION",payload:{id:null}}),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SELECT_ELEMENT",payload:{el:de,info:ye.element}});let ge=de.getBoundingClientRect(),He=ge.left+ge.width/2+window.scrollX,Ie=ge.top+ge.height/2+window.scrollY;window.scrollTo({left:He-window.innerWidth/2,top:Ie-window.innerHeight/2,behavior:"smooth"})}},[Gt,qt,e.styleModifications,Ht,Nt,t,Kt,A,x]);gn(()=>{if(!me)return;let w=H=>{var ge;let q=document.activeElement;for(;(ge=q==null?void 0:q.shadowRoot)!=null&&ge.activeElement;)q=q.shadowRoot.activeElement;if((q==null?void 0:q.tagName)==="INPUT"||(q==null?void 0:q.tagName)==="TEXTAREA"||q!=null&&q.isContentEditable)return;if((H.metaKey||H.ctrlKey)&&H.key==="Enter"){o&&(e.annotations.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(He=>!He.captured).length>0)&&(H.preventDefault(),on());return}if((H.metaKey||H.ctrlKey)&&(H.key==="c"||H.key==="C"||H.code==="KeyC")){let He=window.getSelection();if(He&&He.toString().length>0)return;(e.annotations.length>0||e.styleModifications.length>0)&&(H.preventDefault(),window.focus(),qn());return}if((H.metaKey||H.ctrlKey)&&(H.key==="Backspace"||H.key==="Delete")){H.preventDefault(),xt();return}if(H.metaKey||H.ctrlKey||H.altKey)return;let ye={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand"};if(H.key.toLowerCase()==="m"){H.preventDefault(),It("model");return}let de=ye[H.key.toLowerCase()];if(de){H.preventDefault();let He=er.findIndex(Ie=>Ie.type===de);He>=0&&Je(He),It(de)}};return window.addEventListener("keydown",w),()=>window.removeEventListener("keydown",w)},[me,It,qn,on,o,xt,e.annotations.length,e.styleModifications.length,e.spacingTokenChanges,X]);let nr=Na(D,I.w,I.h),go=h(f(f({},_f),nr),{borderRadius:0,padding:me?"0 8px":"0",width:me?"auto":48,height:48,gap:0,justifyContent:me?"flex-start":"center"}),Ao=Se("div",{style:di({color:r&&i?i:"rgb(0,0,0)",animated:!!r})}),ao=P===!1?"rgba(239, 68, 68, 0.4)":r&&i?i:wo.iconActive,mo=Dt(null);gn(()=>{if(!me)return;let w=mo.current;if(!w)return;let H=()=>{s==null||s(!0),nt("collapse")},q=()=>{s==null||s(!1),St()};return w.addEventListener("mouseenter",H),w.addEventListener("mouseleave",q),()=>{w.removeEventListener("mouseenter",H),w.removeEventListener("mouseleave",q)}},[me,r,s,nt,St]);let or=Dt(null);return gn(()=>{if(me)return;let w=or.current;if(!w)return;let H=w.querySelector("[data-popmelt-logo]"),q=()=>{w.style.opacity="1",!r&&H&&(H.style.fill="#000"),V==null||V()},ye=()=>{w.style.opacity=r?"1":"0.5",!r&&H&&(H.style.fill="none")};return w.addEventListener("mouseenter",q),w.addEventListener("mouseleave",ye),()=>{w.removeEventListener("mouseenter",q),w.removeEventListener("mouseleave",ye)}},[me,r,V]),me?Mt($r,{children:[Se("style",{children:`
11
11
  @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
12
12
  @keyframes popmelt-border-march { to { background-position: 0 -5px; } }
13
- `}),Se("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),!R&&(Pe==="model"||e.activeTool==="model")&&Se(Ja,{bridgeUrl:T,selectedComponent:N,hoveredComponent:W,onComponentHover:_,onSpacingTokenHover:H,onModifySpacingToken:V,onDeleteSpacingToken:k,modelRefreshKey:A,onComponentAdded:Q,onComponentRemoved:ie,onMouseEnter:()=>{ae(),Mt.current&&(clearTimeout(Mt.current),Mt.current=null)},onMouseLeave:e.activeTool==="model"?void 0:ue}),Pe&&Pe!=="model"&&(Pe==="provider"||Xa[Pe])&&(()=>{let D=Pe==="provider"?qe:Xa[Pe];return Et("div",{ref:Oe,style:f(y(f({position:"fixed",bottom:80,right:16,width:300,backgroundColor:"#eaeaea"},go),{boxSizing:"content-box",zIndex:10001,fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12}),Pe!=="collapse"&&Pe!=="counter"?{pointerEvents:"none"}:{}),children:[Pe==="collapse"&&Se("div",{style:{marginBottom:10},children:Se("svg",{width:"48",height:"48",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:Se("path",{d:"M11.1406 31.2559C11.2407 31.3875 11.351 31.5132 11.4697 31.6338L3.10449 40H2.39746L11.1406 31.2559ZM8.05371 40H7.34668L14.5498 32.7959C14.8554 32.7706 15.1541 32.7063 15.4414 32.6113L8.05371 40ZM18.2197 34.0762C18.3788 34.1569 18.5445 34.2272 18.7168 34.2861L13.0039 40H12.2969L18.2197 34.0762ZM17.9531 40H17.2461L26.1338 31.1113C26.438 31.0829 26.7427 31.0148 27.0439 30.9082L17.9531 40ZM40 22.9023L22.9033 40H22.1963L40 22.1953V22.9023ZM40 27.8525L27.8525 40H27.1455L40 27.1455V27.8525ZM40 32.8027L32.8027 40H32.0957L40 32.0957V32.8027ZM40 37.752L37.752 40H37.0449L40 37.0449V37.752ZM9.06543 28.3809C9.25255 28.4332 9.45183 28.4715 9.66504 28.4883L0 38.1543V37.4473L9.06543 28.3809ZM6.59375 25.9023C6.65822 26.0626 6.73171 26.2263 6.81445 26.3896L0 33.2041V32.4971L6.59375 25.9023ZM20.25 8.00293H20.249C21.5098 8.0286 22.7219 8.25094 23.8584 8.63672L23.8604 8.63574C23.8961 8.64787 23.9312 8.66145 23.9668 8.67383C24.0611 8.70686 24.1548 8.74106 24.248 8.77637C24.2915 8.79273 24.3357 8.80727 24.3789 8.82422L24.376 8.82617C27.6145 10.0955 30.1646 12.7301 31.3213 16.0234L31.3232 16.0225C31.3327 16.0493 31.3404 16.0766 31.3496 16.1035C31.7691 17.3256 32 18.6356 32 20C32 20.8726 31.9366 21.6706 31.7598 22.4902L31.7197 22.6328C31.6412 23.0066 31.5136 23.6108 31.3408 24.2217L31.3398 24.2246C31.2967 24.377 31.251 24.5299 31.2021 24.6797C30.9215 25.5403 30.5473 26.2998 30.0879 26.2998C29.7613 26.2996 29.5995 25.9674 29.4316 25.6221C29.2501 25.2487 29.0614 24.8605 28.6484 24.8604C27.8532 24.8604 27.2081 25.5046 27.208 26.2998V27.0771C27.2079 27.6079 26.9661 28.112 26.5205 28.4004C25.9146 28.7925 25.2357 28.6462 24.7959 28.2061L24.7949 28.208C24.7897 28.2028 24.7854 28.1967 24.7803 28.1914C24.7654 28.1761 24.7507 28.1606 24.7363 28.1445C24.7105 28.1156 24.6858 28.0857 24.6621 28.0547C24.6461 28.0339 24.6302 28.013 24.6152 27.9912C24.5931 27.9591 24.5726 27.9257 24.5527 27.8916C24.5392 27.8685 24.5261 27.8452 24.5137 27.8213C24.5093 27.8128 24.5043 27.8045 24.5 27.7959L24.501 27.7939C24.3932 27.5763 24.3282 27.3276 24.3281 27.0576V26.2998C24.328 25.5993 23.8278 25.0158 23.165 24.8867V24.8877C23.0752 24.8702 22.9826 24.8604 22.8877 24.8604C22.8446 24.8604 22.8019 24.8624 22.7598 24.8662C22.0247 24.9312 21.4483 25.5479 21.4482 26.2998C21.4482 26.9127 21.4608 27.5305 21.4736 28.1494L21.4951 29.3135C21.5 29.7013 21.5015 30.089 21.4971 30.4756C21.4874 31.3103 20.8426 32 20.0078 32C19.1732 31.9998 18.5292 31.3102 18.5195 30.4756C18.5159 30.1613 18.5176 29.8464 18.5205 29.5312V29.5322C18.5212 29.4593 18.5206 29.3864 18.5215 29.3135L18.5303 28.8154V28.8145C18.5343 28.5927 18.5384 28.371 18.543 28.1494C18.5558 27.5305 18.5684 28.1129 18.5684 27.5C18.5684 26.7047 17.9232 26.0596 17.1279 26.0596C16.907 26.0596 16.6978 26.1103 16.5107 26.1992C16.2161 26.3393 15.9767 26.5769 15.834 26.8701C15.8269 26.8846 15.8201 26.8993 15.8135 26.9141C15.7821 26.9845 15.7562 27.0579 15.7363 27.1338C15.7243 27.1798 15.7155 27.2267 15.708 27.2744C15.7012 27.3175 15.6953 27.361 15.6924 27.4053C15.6903 27.4366 15.6885 27.4681 15.6885 27.5V28.7383C15.6883 29.9234 14.4911 30.7248 13.4961 30.0811C13.0505 29.7926 12.8086 29.2886 12.8086 28.7578V26.2998C12.8086 25.9737 12.6984 25.674 12.5156 25.4326C12.4437 25.3381 12.3612 25.2521 12.2686 25.1777V25.1768C12.0219 24.9788 11.709 24.8604 11.3682 24.8604C10.9892 24.8604 10.8622 24.8872 10.7295 25.2295C10.5837 25.6055 10.4302 26 9.92773 26C9.33081 25.9996 8.95963 25.2403 8.71484 24.3799C8.5591 23.8325 8.45907 23.571 8.3623 23.0107C8.3501 22.9401 8.33284 22.8403 8.31738 22.7529C8.12812 21.9466 8.02043 21.1089 8.00293 20.249V20.25L8 20C8 19.8617 8.00317 19.724 8.00781 19.5869C8.00837 19.5703 8.00816 19.5537 8.00879 19.5371L8.00977 19.5352C8.0998 17.1716 8.87444 14.9844 10.1396 13.1631C10.1488 13.1499 10.1587 13.1372 10.168 13.124C12.255 10.1453 15.6582 8.15745 19.5352 8.00977L19.5371 8.00879C19.5537 8.00816 19.5703 8.00837 19.5869 8.00781C19.724 8.00317 19.8617 8 20 8L20.25 8.00293ZM5.72266 22.5303L0 28.2539V27.5469L5.62793 21.918C5.6553 22.1234 5.6868 22.3275 5.72266 22.5303ZM16.2637 26.8398L16.2617 26.8408C16.2784 26.8013 16.2954 26.7627 16.3135 26.7256C16.3203 26.7116 16.3275 26.6982 16.334 26.6855C16.3125 26.7277 16.289 26.7808 16.2637 26.8398ZM40 17.9531L33.9854 23.9668C34.051 23.6832 34.1043 23.4321 34.1445 23.2412L34.1641 23.1748L34.1865 23.0967L34.1963 23.0488L40 17.2461V17.9531ZM5.87012 16.7266C5.80321 17.0165 5.74649 17.3101 5.69727 17.6064L0 23.3047V22.5977L5.87012 16.7266ZM40 13.0039L34.4297 18.5732C34.409 18.3615 34.3832 18.1513 34.3535 17.9424L40 12.2969V13.0039ZM0 18.3555V17.6484L17.6484 0H18.3555L0 18.3555ZM40 8.05371L33.458 14.5947C33.3909 14.4277 33.3202 14.2625 33.2471 14.0986L40 7.34668V8.05371ZM0 13.4053V12.6982L12.6992 0H13.4062L0 13.4053ZM40 3.10352L31.6865 11.416C31.5868 11.2805 31.4851 11.1465 31.3809 11.0146L40 2.39648V3.10352ZM29.2881 8.86523C29.1595 8.75783 29.0288 8.65278 28.8965 8.5498L37.4473 0H38.1543L29.2881 8.86523ZM0 8.45508V7.74805L7.74805 0H8.45508L0 8.45508ZM26.2783 6.92578C26.1183 6.84878 25.9562 6.77534 25.793 6.7041L32.498 0H33.2051L26.2783 6.92578ZM17.6064 5.69727C17.3101 5.74649 17.0165 5.80321 16.7266 5.87012L22.5977 0H23.3047L17.6064 5.69727ZM22.5322 5.7207C22.3295 5.685 22.1254 5.65316 21.9199 5.62598L27.5469 0H28.2539L22.5322 5.7207ZM0 3.50586V2.79883L2.79883 0H3.50586L0 3.50586Z",fill:"currentColor"})})}),Et("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[Se("span",{children:D.name}),D.keys[0]&&Se("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:D.keys[0].key})]}),Se("div",{style:{color:"#6b7280",lineHeight:1.5,marginBottom:Pe==="collapse"?0:10},children:D.desc.split(`
13
+ `}),Se("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),!A&&(X==="model"||e.activeTool==="model")&&Se(fc,{bridgeUrl:z,selectedComponent:O,hoveredComponent:k,onComponentHover:G,onSpacingTokenHover:re,onModifySpacingToken:oe,onDeleteSpacingToken:W,modelRefreshKey:Q,onComponentAdded:N,onComponentRemoved:ee,onSynthesizeRules:M,isSynthesizing:Le,snapPosition:D,onMouseEnter:()=>{ze(),Pe.current&&(clearTimeout(Pe.current),Pe.current=null)},onMouseLeave:e.activeTool==="model"?void 0:St}),X&&X!=="model"&&(X==="provider"||hc[X])&&(()=>{let w=X==="provider"?qe:hc[X];return Mt("div",{ref:he,style:f(h(f(h(f({},Ha(D,I.w,I.h)),{width:300,backgroundColor:"#eaeaea"}),xr),{boxSizing:"content-box",zIndex:10001,fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12}),X!=="collapse"&&X!=="counter"?{pointerEvents:"none"}:{}),children:[X==="collapse"&&Se("div",{title:"Restart bridge",onClick:()=>{ma(z)},style:{marginBottom:10,cursor:"pointer",width:"fit-content"},children:Se("svg",{width:"48",height:"48",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:Se("path",{d:"M11.1406 31.2559C11.2407 31.3875 11.351 31.5132 11.4697 31.6338L3.10449 40H2.39746L11.1406 31.2559ZM8.05371 40H7.34668L14.5498 32.7959C14.8554 32.7706 15.1541 32.7063 15.4414 32.6113L8.05371 40ZM18.2197 34.0762C18.3788 34.1569 18.5445 34.2272 18.7168 34.2861L13.0039 40H12.2969L18.2197 34.0762ZM17.9531 40H17.2461L26.1338 31.1113C26.438 31.0829 26.7427 31.0148 27.0439 30.9082L17.9531 40ZM40 22.9023L22.9033 40H22.1963L40 22.1953V22.9023ZM40 27.8525L27.8525 40H27.1455L40 27.1455V27.8525ZM40 32.8027L32.8027 40H32.0957L40 32.0957V32.8027ZM40 37.752L37.752 40H37.0449L40 37.0449V37.752ZM9.06543 28.3809C9.25255 28.4332 9.45183 28.4715 9.66504 28.4883L0 38.1543V37.4473L9.06543 28.3809ZM6.59375 25.9023C6.65822 26.0626 6.73171 26.2263 6.81445 26.3896L0 33.2041V32.4971L6.59375 25.9023ZM20.25 8.00293H20.249C21.5098 8.0286 22.7219 8.25094 23.8584 8.63672L23.8604 8.63574C23.8961 8.64787 23.9312 8.66145 23.9668 8.67383C24.0611 8.70686 24.1548 8.74106 24.248 8.77637C24.2915 8.79273 24.3357 8.80727 24.3789 8.82422L24.376 8.82617C27.6145 10.0955 30.1646 12.7301 31.3213 16.0234L31.3232 16.0225C31.3327 16.0493 31.3404 16.0766 31.3496 16.1035C31.7691 17.3256 32 18.6356 32 20C32 20.8726 31.9366 21.6706 31.7598 22.4902L31.7197 22.6328C31.6412 23.0066 31.5136 23.6108 31.3408 24.2217L31.3398 24.2246C31.2967 24.377 31.251 24.5299 31.2021 24.6797C30.9215 25.5403 30.5473 26.2998 30.0879 26.2998C29.7613 26.2996 29.5995 25.9674 29.4316 25.6221C29.2501 25.2487 29.0614 24.8605 28.6484 24.8604C27.8532 24.8604 27.2081 25.5046 27.208 26.2998V27.0771C27.2079 27.6079 26.9661 28.112 26.5205 28.4004C25.9146 28.7925 25.2357 28.6462 24.7959 28.2061L24.7949 28.208C24.7897 28.2028 24.7854 28.1967 24.7803 28.1914C24.7654 28.1761 24.7507 28.1606 24.7363 28.1445C24.7105 28.1156 24.6858 28.0857 24.6621 28.0547C24.6461 28.0339 24.6302 28.013 24.6152 27.9912C24.5931 27.9591 24.5726 27.9257 24.5527 27.8916C24.5392 27.8685 24.5261 27.8452 24.5137 27.8213C24.5093 27.8128 24.5043 27.8045 24.5 27.7959L24.501 27.7939C24.3932 27.5763 24.3282 27.3276 24.3281 27.0576V26.2998C24.328 25.5993 23.8278 25.0158 23.165 24.8867V24.8877C23.0752 24.8702 22.9826 24.8604 22.8877 24.8604C22.8446 24.8604 22.8019 24.8624 22.7598 24.8662C22.0247 24.9312 21.4483 25.5479 21.4482 26.2998C21.4482 26.9127 21.4608 27.5305 21.4736 28.1494L21.4951 29.3135C21.5 29.7013 21.5015 30.089 21.4971 30.4756C21.4874 31.3103 20.8426 32 20.0078 32C19.1732 31.9998 18.5292 31.3102 18.5195 30.4756C18.5159 30.1613 18.5176 29.8464 18.5205 29.5312V29.5322C18.5212 29.4593 18.5206 29.3864 18.5215 29.3135L18.5303 28.8154V28.8145C18.5343 28.5927 18.5384 28.371 18.543 28.1494C18.5558 27.5305 18.5684 28.1129 18.5684 27.5C18.5684 26.7047 17.9232 26.0596 17.1279 26.0596C16.907 26.0596 16.6978 26.1103 16.5107 26.1992C16.2161 26.3393 15.9767 26.5769 15.834 26.8701C15.8269 26.8846 15.8201 26.8993 15.8135 26.9141C15.7821 26.9845 15.7562 27.0579 15.7363 27.1338C15.7243 27.1798 15.7155 27.2267 15.708 27.2744C15.7012 27.3175 15.6953 27.361 15.6924 27.4053C15.6903 27.4366 15.6885 27.4681 15.6885 27.5V28.7383C15.6883 29.9234 14.4911 30.7248 13.4961 30.0811C13.0505 29.7926 12.8086 29.2886 12.8086 28.7578V26.2998C12.8086 25.9737 12.6984 25.674 12.5156 25.4326C12.4437 25.3381 12.3612 25.2521 12.2686 25.1777V25.1768C12.0219 24.9788 11.709 24.8604 11.3682 24.8604C10.9892 24.8604 10.8622 24.8872 10.7295 25.2295C10.5837 25.6055 10.4302 26 9.92773 26C9.33081 25.9996 8.95963 25.2403 8.71484 24.3799C8.5591 23.8325 8.45907 23.571 8.3623 23.0107C8.3501 22.9401 8.33284 22.8403 8.31738 22.7529C8.12812 21.9466 8.02043 21.1089 8.00293 20.249V20.25L8 20C8 19.8617 8.00317 19.724 8.00781 19.5869C8.00837 19.5703 8.00816 19.5537 8.00879 19.5371L8.00977 19.5352C8.0998 17.1716 8.87444 14.9844 10.1396 13.1631C10.1488 13.1499 10.1587 13.1372 10.168 13.124C12.255 10.1453 15.6582 8.15745 19.5352 8.00977L19.5371 8.00879C19.5537 8.00816 19.5703 8.00837 19.5869 8.00781C19.724 8.00317 19.8617 8 20 8L20.25 8.00293ZM5.72266 22.5303L0 28.2539V27.5469L5.62793 21.918C5.6553 22.1234 5.6868 22.3275 5.72266 22.5303ZM16.2637 26.8398L16.2617 26.8408C16.2784 26.8013 16.2954 26.7627 16.3135 26.7256C16.3203 26.7116 16.3275 26.6982 16.334 26.6855C16.3125 26.7277 16.289 26.7808 16.2637 26.8398ZM40 17.9531L33.9854 23.9668C34.051 23.6832 34.1043 23.4321 34.1445 23.2412L34.1641 23.1748L34.1865 23.0967L34.1963 23.0488L40 17.2461V17.9531ZM5.87012 16.7266C5.80321 17.0165 5.74649 17.3101 5.69727 17.6064L0 23.3047V22.5977L5.87012 16.7266ZM40 13.0039L34.4297 18.5732C34.409 18.3615 34.3832 18.1513 34.3535 17.9424L40 12.2969V13.0039ZM0 18.3555V17.6484L17.6484 0H18.3555L0 18.3555ZM40 8.05371L33.458 14.5947C33.3909 14.4277 33.3202 14.2625 33.2471 14.0986L40 7.34668V8.05371ZM0 13.4053V12.6982L12.6992 0H13.4062L0 13.4053ZM40 3.10352L31.6865 11.416C31.5868 11.2805 31.4851 11.1465 31.3809 11.0146L40 2.39648V3.10352ZM29.2881 8.86523C29.1595 8.75783 29.0288 8.65278 28.8965 8.5498L37.4473 0H38.1543L29.2881 8.86523ZM0 8.45508V7.74805L7.74805 0H8.45508L0 8.45508ZM26.2783 6.92578C26.1183 6.84878 25.9562 6.77534 25.793 6.7041L32.498 0H33.2051L26.2783 6.92578ZM17.6064 5.69727C17.3101 5.74649 17.0165 5.80321 16.7266 5.87012L22.5977 0H23.3047L17.6064 5.69727ZM22.5322 5.7207C22.3295 5.685 22.1254 5.65316 21.9199 5.62598L27.5469 0H28.2539L22.5322 5.7207ZM0 3.50586V2.79883L2.79883 0H3.50586L0 3.50586Z",fill:"currentColor"})})}),Mt("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[Se("span",{children:w.name}),w.keys[0]&&Se("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:w.keys[0].key})]}),Se("div",{style:{color:"#6b7280",lineHeight:1.5,marginBottom:X==="collapse"?0:10},children:w.desc.split(`
14
14
 
15
- `).map((X,re)=>Se("p",{style:{margin:0,marginTop:re>0?8:0},children:X},re))}),D.usage.map((X,re)=>Et("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[Se("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),Se("span",{children:X})]},re)),Pe==="collapse"&&P&&Object.keys(P).length>0&&(()=>{let X=Object.entries(P).filter(([,K])=>K.found&&!K.disabled).map(([K])=>K.charAt(0).toUpperCase()+K.slice(1)),re=Object.entries(P).filter(([,K])=>!K.found).map(([K])=>K);if(X.length===0&&re.length===0)return null;let we=re.map(K=>K.charAt(0).toUpperCase()+K.slice(1));return Et("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8,display:"flex",alignItems:"center",gap:6,fontSize:11},children:[Se("span",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:X.length>0?"#22c55e":"rgba(0,0,0,0.2)",flexShrink:0}}),X.length>0?Et("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[Et("span",{children:["Registry available in ",X.join(", "),M&&" \u2014 restart CLI to activate"]}),re.length>0&&G&&!M&&Et("button",{type:"button",onClick:K=>{K.stopPropagation(),G()},style:{border:"none",background:"transparent",color:"#3b82f6",fontSize:10,fontWeight:500,fontFamily:"inherit",padding:0,cursor:"pointer",pointerEvents:"auto",textDecoration:"underline",textUnderlineOffset:2},children:["+ ",we.join(", ")]})]}):re.length>0&&G?Et("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[Se("span",{children:"Connect Popmelt MCP"}),Se("button",{type:"button",onClick:K=>{K.stopPropagation(),G()},style:{border:"none",background:"#1f2937",color:"#fff",fontSize:10,fontWeight:600,fontFamily:"inherit",padding:"2px 8px",cursor:"pointer",pointerEvents:"auto"},children:"Connect"})]}):null]})})(),D.keys.length>1&&Se("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8,display:"flex",flexDirection:"column",gap:4},children:D.keys.slice(1).map((X,re)=>Et("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:X.accent?"#fff":"#6b7280"},children:[Se("code",{style:{fontSize:10,backgroundColor:X.accent?e.activeColor:"rgba(0,0,0,0.06)",color:X.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:X.key}),Se("span",{style:{color:X.accent?e.activeColor:void 0,fontWeight:X.accent?600:void 0},children:X.desc})]},re))}),Pe==="counter"&&Nt.length>0&&(()=>{let X=Se("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8},children:Se("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:4,textTransform:"uppercase",letterSpacing:"0.05em"},children:"Active"})}),re=new Map;for(let Ee of Nt){let Te=Ee.pathname||Bt;re.has(Te)||re.set(Te,[]),re.get(Te).push(Ee)}let we=[...re.entries()],K=we.length>1;return Et("div",{children:[X,Se("div",{style:{maxHeight:200,overflowY:"auto",scrollbarWidth:"thin"},children:we.map(([Ee,Te])=>Se("div",{style:{marginBottom:K?4:0},children:Te.map(Le=>{var Ge,Xe,mt,Ze;let v=Le.annotations.find(rt=>rt.type==="text"&&rt.text),B=(v==null?void 0:v.text)||`[${(Xe=(Ge=Le.annotations[0])==null?void 0:Ge.type)!=null?Xe:"annotation"}]`,ee=e.selectedAnnotationIds.includes(Le.id),le=Nt.indexOf(Le),Me=le+1,ge=(Ze=(mt=Le.annotations[0])==null?void 0:mt.color)!=null?Ze:e.activeColor;return Et("div",{onClick:()=>{var dt;if(!(!Le.pathname||Le.pathname===Bt)){sessionStorage.setItem("popmelt-pending-focus",JSON.stringify({annotationId:Le.id,pathname:Le.pathname})),window.location.href=Le.pathname;return}if(rn(le),t({type:"SELECT_ELEMENT",payload:null}),t({type:"SELECT_ANNOTATION",payload:{id:Le.id}}),C){let ut=(dt=Le.annotations.find(ht=>ht.threadId))==null?void 0:dt.threadId;ut&&C(ut)}nt.current=!1,Tt(null)},style:{display:"flex",alignItems:"baseline",gap:4,padding:"2px 0",cursor:"pointer"},onMouseEnter:rt=>{let dt=rt.currentTarget.querySelector("[data-route-badge]");dt&&(dt.style.backgroundColor=ge,dt.style.color="#fff")},onMouseLeave:rt=>{if(ee)return;let dt=rt.currentTarget.querySelector("[data-route-badge]");dt&&(dt.style.backgroundColor="rgba(0,0,0,0.06)",dt.style.color="#6b7280")},children:[Et("code",{"data-route-badge":!0,style:{fontSize:10,color:ee?"#fff":"#6b7280",backgroundColor:ee?ge:"rgba(0,0,0,0.06)",padding:"1px 4px",flexShrink:0,whiteSpace:"nowrap"},children:[Me,". ",K?Ee:""]}),Se("span",{style:{fontSize:11,color:ee?"#1f2937":"#6b7280",fontWeight:ee?600:400,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:B})]},Le.id)})},Ee))})]})})(),Pe==="counter"&&(()=>{let X=new Set(Nt.flatMap(K=>K.annotations.map(Ee=>Ee.threadId).filter(Boolean))),re=h.filter(K=>!X.has(K.id));if(re.length===0)return null;let we=K=>{let Ee=Math.floor((Date.now()-K)/1e3);if(Ee<60)return"now";let Te=Math.floor(Ee/60);if(Te<60)return`${Te}m`;let Le=Math.floor(Te/60);return Le<24?`${Le}h`:`${Math.floor(Le/24)}d`};return Et("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8},children:[Se("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:4,textTransform:"uppercase",letterSpacing:"0.05em"},children:"Recent"}),re.map(K=>Et("div",{onClick:()=>{let Ee=K.elementIdentifiers[0];if(Ee){let Te=Ee.indexOf(":"),Le=Te>0&&Ee[0]==="/",v=Le?Ee.slice(0,Te):void 0,B=Le?Ee.slice(Te+1):Ee;if(!(!v||v===Bt)){sessionStorage.setItem("popmelt-pending-thread",JSON.stringify({threadId:K.id,selector:B,preview:K.preview})),window.location.href=v;return}try{let le=document.querySelector(B);if(le){let Me=le.getBoundingClientRect(),ge=Math.random().toString(36).slice(2,9);t({type:"ADD_TEXT",payload:{id:ge,point:{x:Me.left+Me.width,y:Me.top},text:K.preview,linkedSelector:B,linkedAnchor:"top-left"}}),t({type:"SET_ANNOTATION_THREAD",payload:{ids:[ge],threadId:K.id}}),t({type:"SET_ANNOTATION_STATUS",payload:{ids:[ge],status:"resolved"}})}}catch(le){}}C&&C(K.id),nt.current=!1,Tt(null)},style:{display:"flex",alignItems:"baseline",justifyContent:"space-between",gap:8,padding:"2px 0",cursor:"pointer",color:"#6b7280",fontSize:11},onMouseEnter:Ee=>{Ee.currentTarget.style.color="#1f2937"},onMouseLeave:Ee=>{Ee.currentTarget.style.color="#6b7280"},children:[Se("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:K.preview}),Se("span",{style:{flexShrink:0,fontSize:10,color:"#9ca3af"},children:we(K.createdAt)})]},K.id))]})})()]})})(),Et("div",{ref:D=>{be&&(be.current=D)},id:"devtools-toolbar",style:wn,onMouseEnter:pe,onMouseMove:Ye,children:[eo,Et("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[Se("span",{onMouseEnter:()=>de("inspector"),onMouseLeave:ue,children:Se(yo,{active:e.isAnnotating&&e.activeTool==="inspector",siblingActive:e.isAnnotating,onClick:()=>Ct("inspector"),children:Se(lf,{size:20,strokeWidth:1.5})})}),Se("span",{onMouseEnter:()=>de("hand"),onMouseLeave:ue,children:Se(yo,{active:e.isAnnotating&&e.activeTool==="hand",siblingActive:e.isAnnotating,onClick:()=>Ct("hand"),children:Et("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[Se(sf,{size:20,strokeWidth:1.5}),e.styleModifications.filter(D=>!D.captured).length>0&&Se("div",{style:{position:"absolute",top:-7,right:-9,minWidth:14,height:14,borderRadius:0,backgroundColor:e.activeColor,color:"#fff",fontSize:9,fontWeight:700,display:"flex",alignItems:"center",justifyContent:"center",padding:"0 2px",lineHeight:1},children:e.styleModifications.filter(D=>!D.captured).length})]})})}),(()=>{let D=No[Ce],X=D.icon,re=e.isAnnotating&&ff.has(e.activeTool);return Se("span",{onMouseEnter:()=>de(D.type),onMouseLeave:ue,children:Et("div",{style:{display:"flex",alignItems:"center",gap:0},children:[Se(yo,{active:re,siblingActive:e.isAnnotating,onClick:()=>Ct(D.type),children:Se(X,{size:20,strokeWidth:1.5})}),Se("button",{type:"button",onClick:()=>{let we=(Ce+1)%No.length;oe(we),Ct(No[we].type)},title:"Cycle shape tool",style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:2,width:12,height:32,border:"none",background:"none",cursor:"pointer",padding:"0 2px",opacity:e.isAnnotating&&!re?.5:1,transition:"opacity 150ms ease"},children:No.map((we,K)=>Se("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:K===Ce?so.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},K))})]})})})(),hf.map(({type:D,icon:X,label:re,shortcut:we})=>Se("span",{onMouseEnter:()=>de(D),onMouseLeave:ue,children:Se(yo,{active:e.isAnnotating&&e.activeTool===D,siblingActive:e.isAnnotating,onClick:()=>Ct(D),children:Se(X,{size:20,strokeWidth:1.5})})},D)),Se("span",{onMouseEnter:()=>de("model"),onMouseLeave:ue,children:Se(yo,{active:e.isAnnotating&&e.activeTool==="model",siblingActive:e.isAnnotating,onClick:()=>Ct("model"),children:Se(rf,{size:17,strokeWidth:1.5})})})]}),Se(Ua,{}),Et("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(Nt.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(D=>!D.captured).length>0)&&(()=>{var K;let D=yt!==null&&yt<Nt.length?Nt[yt]:null,X=e.annotations.length>0&&e.annotations.every(Ee=>Ee.status&&Ee.status!=="pending"),re=yt!==null?(K=D==null?void 0:D.annotations.some(Ee=>Ee.status&&Ee.status!=="pending"))!=null?K:!1:X,we=`oklch(0.628 0.258 ${on})`;return Se("span",{onMouseEnter:()=>de("counter"),onMouseLeave:ue,children:Se("button",{ref:St,type:"button",onClick:()=>{if(Qt.current){Qt.current=!1;return}Qn()},onMouseDown:Mn,onMouseUp:Sn,onMouseLeave:Sn,title:"",style:{display:"flex",alignItems:"center",justifyContent:"center",gap:4,minWidth:20,height:20,padding:"0 8px",marginRight:4,border:"none",borderRadius:0,background:re&&yt===null?"#999999":we,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:(()=>{let Ee=Nt.length+e.styleModifications.length+e.spacingTokenChanges.filter(Le=>!Le.captured).length;if(yt!==null)return Et(Tr,{children:[yt+1,Et("span",{style:{opacity:.4,display:"flex",gap:4},children:[Se("span",{children:"/"}),Se("span",{children:Ee})]})]});let Te=Dt.length+e.styleModifications.length+e.spacingTokenChanges.filter(Le=>!Le.captured).length;return Ee>Te?Et(Tr,{children:[Te,Et("span",{style:{opacity:.4,display:"flex",gap:4},children:[Se("span",{children:"/"}),Se("span",{children:Ee})]})]}):Ee})()})})})(),(e.annotations.length>0||e.styleModifications.length>0)&&Se("span",{onMouseEnter:()=>de("clear"),onMouseLeave:ue,children:Se(yo,{siblingActive:e.isAnnotating,onClick:$t,title:"Clear all (\u2318\u232B)",children:Se(uf,{size:17,strokeWidth:1.5})})}),d&&Et(Tr,{children:[Se("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 2px"}}),Se("span",{onMouseEnter:()=>de("provider"),onMouseLeave:ue,style:{display:"contents"},children:Et("div",{style:{display:"flex",alignItems:"center",gap:0},children:[Se(yo,{onClick:()=>d(a==="claude"?"codex":"claude"),children:a==="claude"?Se(xs,{}):Se(vs,{})}),Et("button",{type:"button",onClick:()=>{let D=(u+1)%p;w==null||w(D)},style:{display:"flex",alignItems:"center",gap:6,height:32,border:"none",background:"none",cursor:"pointer",padding:"0 4px 0 0",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:10,fontWeight:500,color:so.iconDefault,whiteSpace:"nowrap"},children:[Se("span",{children:g}),Se("span",{style:{display:"flex",flexDirection:"column",gap:2},children:Array.from({length:p},(D,X)=>Se("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:X===u?so.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},X))})]})]})})]}),Se("div",{ref:vo,style:{display:"inline-flex",cursor:"pointer"},children:Se("button",{type:"button",onClick:Jt,title:"Collapse (\u2318\u2318)",style:{display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,border:"none",background:"none",padding:0,cursor:"inherit"},children:Se("svg",{"data-popmelt-logo":!0,width:"30",height:"30",viewBox:"0 0 40 40",fill:xo,stroke:"none",xmlns:"http://www.w3.org/2000/svg",children:Se("path",{d:"M20.25 8.00293H20.249C21.5098 8.0286 22.7219 8.25094 23.8584 8.63672L23.8604 8.63574C23.8961 8.64787 23.9312 8.66145 23.9668 8.67383C24.0611 8.70686 24.1548 8.74106 24.248 8.77637C24.2915 8.79273 24.3357 8.80727 24.3789 8.82422L24.376 8.82617C27.6145 10.0955 30.1646 12.7301 31.3213 16.0234L31.3232 16.0225C31.3327 16.0493 31.3404 16.0766 31.3496 16.1035C31.7691 17.3256 32 18.6356 32 20C32 20.8726 31.9366 21.6706 31.7598 22.4902L31.7197 22.6328C31.6412 23.0066 31.5136 23.6108 31.3408 24.2217L31.3398 24.2246C31.2967 24.377 31.251 24.5299 31.2021 24.6797C30.9215 25.5403 30.5473 26.2998 30.0879 26.2998C29.7613 26.2996 29.5995 25.9674 29.4316 25.6221C29.2501 25.2487 29.0614 24.8605 28.6484 24.8604C27.8532 24.8604 27.2081 25.5046 27.208 26.2998V27.0771C27.2079 27.6079 26.9661 28.112 26.5205 28.4004C25.9146 28.7925 25.2357 28.6462 24.7959 28.2061L24.7949 28.208C24.7897 28.2028 24.7854 28.1967 24.7803 28.1914C24.7654 28.1761 24.7507 28.1606 24.7363 28.1445C24.7105 28.1156 24.6858 28.0857 24.6621 28.0547C24.6461 28.0339 24.6302 28.013 24.6152 27.9912C24.5931 27.9591 24.5726 27.9257 24.5527 27.8916C24.5392 27.8685 24.5261 27.8452 24.5137 27.8213C24.5093 27.8128 24.5043 27.8045 24.5 27.7959L24.501 27.7939C24.3932 27.5763 24.3282 27.3276 24.3281 27.0576V26.2998C24.328 25.5993 23.8278 25.0158 23.165 24.8867V24.8877C23.0752 24.8702 22.9826 24.8604 22.8877 24.8604C22.8446 24.8604 22.8019 24.8624 22.7598 24.8662C22.0247 24.9312 21.4483 25.5479 21.4482 26.2998C21.4482 26.9127 21.4608 27.5305 21.4736 28.1494L21.4951 29.3135C21.5 29.7013 21.5015 30.089 21.4971 30.4756C21.4874 31.3103 20.8426 32 20.0078 32C19.1732 31.9998 18.5292 31.3102 18.5195 30.4756C18.5159 30.1613 18.5176 29.8464 18.5205 29.5312V29.5322C18.5212 29.4593 18.5206 29.3864 18.5215 29.3135L18.5303 28.8154V28.8145C18.5343 28.5927 18.5384 28.371 18.543 28.1494C18.5558 27.5305 18.5684 28.1129 18.5684 27.5C18.5684 26.7047 17.9232 26.0596 17.1279 26.0596C16.907 26.0596 16.6978 26.1103 16.5107 26.1992C16.2161 26.3393 15.9767 26.5769 15.834 26.8701C15.8269 26.8846 15.8201 26.8993 15.8135 26.9141C15.7821 26.9845 15.7562 27.0579 15.7363 27.1338C15.7243 27.1798 15.7155 27.2267 15.708 27.2744C15.7012 27.3175 15.6953 27.361 15.6924 27.4053C15.6903 27.4366 15.6885 27.4681 15.6885 27.5V28.7383C15.6883 29.9234 14.4911 30.7248 13.4961 30.0811C13.0505 29.7926 12.8086 29.2886 12.8086 28.7578V26.2998C12.8086 25.9737 12.6984 25.674 12.5156 25.4326C12.4437 25.3381 12.3612 25.2521 12.2686 25.1777V25.1768C12.0219 24.9788 11.709 24.8604 11.3682 24.8604C10.9892 24.8604 10.8622 24.8872 10.7295 25.2295C10.5837 25.6055 10.4302 26 9.92773 26C9.33081 25.9996 8.95963 25.2403 8.71484 24.3799C8.5591 23.8325 8.45907 23.571 8.3623 23.0107C8.3501 22.9401 8.33284 22.8403 8.31738 22.7529C8.12812 21.9466 8.02043 21.1089 8.00293 20.249V20.25L8 20C8 19.8617 8.00317 19.724 8.00781 19.5869C8.00837 19.5703 8.00816 19.5537 8.00879 19.5371L8.00977 19.5352C8.0998 17.1716 8.87444 14.9844 10.1396 13.1631C10.1488 13.1499 10.1587 13.1372 10.168 13.124C12.255 10.1453 15.6582 8.15745 19.5352 8.00977L19.5371 8.00879C19.5537 8.00816 19.5703 8.00837 19.5869 8.00781C19.724 8.00317 19.8617 8 20 8L20.25 8.00293Z"})})})})]})]})]}):Et(Tr,{children:[Se("style",{children:`
15
+ `).map((H,q)=>Se("p",{style:{margin:0,marginTop:q>0?8:0},children:H},q))}),w.usage.map((H,q)=>Mt("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[Se("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),Se("span",{children:H})]},q)),X==="collapse"&&ae&&Mt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8},children:[Se("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:6,textTransform:"uppercase",letterSpacing:"0.05em"},children:"Position"}),Se("div",{style:{display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gap:3,width:"fit-content"},children:Wa.map(H=>{let q=H===D;return Se("button",{type:"button",onClick:()=>{Te(null),Oe.current=!1,ze(),ae(H)},title:H,style:{width:24,height:16,border:"none",cursor:"pointer",padding:0,backgroundColor:q?"#1f2937":"rgba(0,0,0,0.08)",transition:"background-color 100ms ease"},onMouseEnter:ye=>{q||(ye.currentTarget.style.backgroundColor="rgba(0,0,0,0.15)")},onMouseLeave:ye=>{q||(ye.currentTarget.style.backgroundColor="rgba(0,0,0,0.08)")}},H)})})]}),X==="collapse"&&T&&Object.keys(T).length>0&&(()=>{let H=Object.entries(T).filter(([,ge])=>ge.found&&!ge.disabled).map(([ge])=>ge.charAt(0).toUpperCase()+ge.slice(1)),q=Object.entries(T).filter(([,ge])=>!ge.found).map(([ge])=>ge);if(H.length===0&&q.length===0)return null;let ye=q.map(ge=>ge.charAt(0).toUpperCase()+ge.slice(1)),de=[...H,...ye];return Mt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8,display:"flex",alignItems:"center",gap:6,fontSize:11},children:[Se("span",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:H.length>0?"#22c55e":"rgba(0,0,0,0.2)",flexShrink:0}}),H.length>0?Mt("span",{style:{color:"#6b7280"},children:["Registry available in ",de.join(", ")]}):q.length>0?Mt("span",{style:{color:"#6b7280"},children:["Registry available in ",ye.join(", ")]}):null]})})(),w.keys.length>1&&Se("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8,display:"flex",flexDirection:"column",gap:4},children:w.keys.slice(1).map((H,q)=>Mt("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:H.accent?"#fff":"#6b7280"},children:[Se("code",{style:{fontSize:10,backgroundColor:H.accent?e.activeColor:"rgba(0,0,0,0.06)",color:H.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:H.key}),Se("span",{style:{color:H.accent?e.activeColor:void 0,fontWeight:H.accent?600:void 0},children:H.desc})]},q))}),X==="counter"&&Gt.length>0&&(()=>{let H=Se("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8},children:Se("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:4,textTransform:"uppercase",letterSpacing:"0.05em"},children:"Active"})}),q=new Map;for(let ge of Gt){let He=ge.pathname||qt;q.has(He)||q.set(He,[]),q.get(He).push(ge)}let ye=[...q.entries()],de=ye.length>1;return Mt("div",{children:[H,Se("div",{style:{maxHeight:200,overflowY:"auto",scrollbarWidth:"thin"},children:ye.map(([ge,He])=>Se("div",{style:{marginBottom:de?4:0},children:He.map(Ie=>{var le,ce,Ae,ke;let je=Ie.annotations.find(Ue=>Ue.type==="text"&&Ue.text),Pt=(je==null?void 0:je.text)||`[${(ce=(le=Ie.annotations[0])==null?void 0:le.type)!=null?ce:"annotation"}]`,Ft=e.selectedAnnotationIds.includes(Ie.id),un=Gt.indexOf(Ie),S=un+1,C=(ke=(Ae=Ie.annotations[0])==null?void 0:Ae.color)!=null?ke:e.activeColor;return Mt("div",{onClick:()=>{var Ye;if(!(!Ie.pathname||Ie.pathname===qt)){sessionStorage.setItem("popmelt-pending-focus",JSON.stringify({annotationId:Ie.id,pathname:Ie.pathname})),window.location.href=Ie.pathname;return}if(lt(un),t({type:"SELECT_ELEMENT",payload:null}),t({type:"SELECT_ANNOTATION",payload:{id:Ie.id}}),x){let Et=(Ye=Ie.annotations.find(wt=>wt.threadId))==null?void 0:Ye.threadId;Et&&x(Et)}Oe.current=!1,Te(null)},style:{display:"flex",alignItems:"baseline",gap:4,padding:"2px 0",cursor:"pointer"},onMouseEnter:Ue=>{let Ye=Ue.currentTarget.querySelector("[data-route-badge]");Ye&&(Ye.style.backgroundColor=C,Ye.style.color="#fff")},onMouseLeave:Ue=>{if(Ft)return;let Ye=Ue.currentTarget.querySelector("[data-route-badge]");Ye&&(Ye.style.backgroundColor="rgba(0,0,0,0.06)",Ye.style.color="#6b7280")},children:[Mt("code",{"data-route-badge":!0,style:{fontSize:10,color:Ft?"#fff":"#6b7280",backgroundColor:Ft?C:"rgba(0,0,0,0.06)",padding:"1px 4px",flexShrink:0,whiteSpace:"nowrap"},children:[S,". ",de?ge:""]}),Se("span",{style:{fontSize:11,color:Ft?"#1f2937":"#6b7280",fontWeight:Ft?600:400,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:Pt})]},Ie.id)})},ge))})]})})(),X==="counter"&&(()=>{let H=new Set(Gt.flatMap(de=>de.annotations.map(ge=>ge.threadId).filter(Boolean))),q=te.filter(de=>!H.has(de.id));if(q.length===0)return null;let ye=de=>{let ge=Math.floor((Date.now()-de)/1e3);if(ge<60)return"now";let He=Math.floor(ge/60);if(He<60)return`${He}m`;let Ie=Math.floor(He/60);return Ie<24?`${Ie}h`:`${Math.floor(Ie/24)}d`};return Mt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8},children:[Se("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:4,textTransform:"uppercase",letterSpacing:"0.05em"},children:"Recent"}),q.map(de=>Mt("div",{onClick:()=>{let ge=de.elementIdentifiers[0];if(ge){let He=ge.indexOf(":"),Ie=He>0&&ge[0]==="/",je=Ie?ge.slice(0,He):void 0,Pt=Ie?ge.slice(He+1):ge;if(!(!je||je===qt)){sessionStorage.setItem("popmelt-pending-thread",JSON.stringify({threadId:de.id,selector:Pt,preview:de.preview})),window.location.href=je;return}try{let un=document.querySelector(Pt);if(un){let S=un.getBoundingClientRect(),C=Math.random().toString(36).slice(2,9);t({type:"ADD_TEXT",payload:{id:C,point:{x:S.left+S.width,y:S.top},text:de.preview,linkedSelector:Pt,linkedAnchor:"top-left"}}),t({type:"SET_ANNOTATION_THREAD",payload:{ids:[C],threadId:de.id}}),t({type:"SET_ANNOTATION_STATUS",payload:{ids:[C],status:"resolved"}})}}catch(un){}}x&&x(de.id),Oe.current=!1,Te(null)},style:{display:"flex",alignItems:"baseline",justifyContent:"space-between",gap:8,padding:"2px 0",cursor:"pointer",color:"#6b7280",fontSize:11},onMouseEnter:ge=>{ge.currentTarget.style.color="#1f2937"},onMouseLeave:ge=>{ge.currentTarget.style.color="#6b7280"},children:[Se("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:de.preview}),Se("span",{style:{flexShrink:0,fontSize:10,color:"#9ca3af"},children:ye(de.createdAt)})]},de.id))]})})()]})})(),Mt("div",{ref:w=>{fe&&(fe.current=w)},id:"devtools-toolbar",style:go,onMouseEnter:V,onMouseMove:Ke,children:[Ao,Mt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[Se("span",{onMouseEnter:()=>nt("inspector"),onMouseLeave:St,children:Se(Lo,{active:e.isAnnotating&&e.activeTool==="inspector",siblingActive:e.isAnnotating,onClick:()=>It("inspector"),children:Se(kf,{size:20,strokeWidth:1.5})})}),Se("span",{onMouseEnter:()=>nt("hand"),onMouseLeave:St,children:Se(Lo,{active:e.isAnnotating&&e.activeTool==="hand",siblingActive:e.isAnnotating,onClick:()=>It("hand"),children:Mt("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[Se(Ef,{size:20,strokeWidth:1.5}),e.styleModifications.filter(w=>!w.captured).length>0&&Se("div",{style:{position:"absolute",top:-7,right:-9,minWidth:14,height:14,borderRadius:0,backgroundColor:e.activeColor,color:"#fff",fontSize:9,fontWeight:700,display:"flex",alignItems:"center",justifyContent:"center",padding:"0 2px",lineHeight:1},children:e.styleModifications.filter(w=>!w.captured).length})]})})}),(()=>{let w=er[we],H=w.icon,q=e.isAnnotating&&Pf.has(e.activeTool);return Se("span",{onMouseEnter:()=>nt(w.type),onMouseLeave:St,children:Mt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[Se(Lo,{active:q,siblingActive:e.isAnnotating,onClick:()=>It(w.type),children:Se(H,{size:20,strokeWidth:1.5})}),Se("button",{type:"button",onClick:()=>{let ye=(we+1)%er.length;Je(ye),It(er[ye].type)},title:"Cycle shape tool",style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:2,width:12,height:32,border:"none",background:"none",cursor:"pointer",padding:"0 2px",opacity:e.isAnnotating&&!q?.5:1,transition:"opacity 150ms ease"},children:er.map((ye,de)=>Se("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:de===we?wo.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},de))})]})})})(),Df.map(({type:w,icon:H,label:q,shortcut:ye})=>Se("span",{onMouseEnter:()=>nt(w),onMouseLeave:St,children:Se(Lo,{active:e.isAnnotating&&e.activeTool===w,siblingActive:e.isAnnotating,onClick:()=>It(w),children:Se(H,{size:20,strokeWidth:1.5})})},w)),Se("span",{onMouseEnter:()=>nt("model"),onMouseLeave:St,children:Se(Lo,{active:e.isAnnotating&&e.activeTool==="model",siblingActive:e.isAnnotating,onClick:()=>It("model"),children:Se(Cf,{size:17,strokeWidth:1.5})})})]}),Se(gc,{}),Mt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(Gt.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(w=>!w.captured).length>0)&&(()=>{var de;let w=Nt!==null&&Nt<Gt.length?Gt[Nt]:null,H=e.annotations.length>0&&e.annotations.every(ge=>ge.status&&ge.status!=="pending"),q=Nt!==null?(de=w==null?void 0:w.annotations.some(ge=>ge.status&&ge.status!=="pending"))!=null?de:!1:H,ye=`oklch(0.628 0.258 ${rn})`;return Se("span",{onMouseEnter:()=>nt("counter"),onMouseLeave:St,children:Se("button",{ref:Nn,type:"button",onClick:()=>{if(Ge.current){Ge.current=!1;return}Jt()},onMouseDown:En,onMouseUp:At,onMouseLeave:At,title:"",style:{display:"flex",alignItems:"center",justifyContent:"center",gap:4,minWidth:20,height:20,padding:"0 8px",marginRight:4,border:"none",borderRadius:0,background:q&&Nt===null?"#999999":ye,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:(()=>{let ge=Gt.length+e.styleModifications.length+e.spacingTokenChanges.filter(Ie=>!Ie.captured).length;if(Nt!==null)return Mt($r,{children:[Nt+1,Mt("span",{style:{opacity:.4,display:"flex",gap:4},children:[Se("span",{children:"/"}),Se("span",{children:ge})]})]});let He=Pn.length+e.styleModifications.length+e.spacingTokenChanges.filter(Ie=>!Ie.captured).length;return ge>He?Mt($r,{children:[He,Mt("span",{style:{opacity:.4,display:"flex",gap:4},children:[Se("span",{children:"/"}),Se("span",{children:ge})]})]}):ge})()})})})(),(e.annotations.length>0||e.styleModifications.length>0)&&Se("span",{onMouseEnter:()=>nt("clear"),onMouseLeave:St,children:Se(Lo,{siblingActive:e.isAnnotating,onClick:xt,title:"Clear all (\u2318\u232B)",children:Se(Lf,{size:17,strokeWidth:1.5})})}),d&&Mt($r,{children:[Se("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 2px"}}),Se("span",{onMouseEnter:()=>nt("provider"),onMouseLeave:St,style:{display:"contents"},children:Mt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[Se(Lo,{onClick:()=>d(Rt),children:Se(Fr,{provider:l})}),Mt("button",{type:"button",onClick:()=>{let w=(p+1)%u;b==null||b(w)},style:{display:"flex",alignItems:"center",gap:6,height:32,border:"none",background:"none",cursor:"pointer",padding:"0 4px 0 0",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:10,fontWeight:500,color:wo.iconDefault,whiteSpace:"nowrap"},children:[Se("span",{children:g}),Se("span",{style:{display:"flex",flexDirection:"column",alignItems:"center",gap:2},children:_n.map(w=>Se("div",{style:{width:w.overflow?2:3,height:w.overflow?2:3,borderRadius:"50%",backgroundColor:w.active?wo.iconDefault:"rgba(0,0,0,0.2)",opacity:w.overflow?.65:1,transition:"background-color 150ms ease, opacity 150ms ease"}},w.key))})]})]})})]}),Se("div",{ref:mo,style:{display:"inline-flex",cursor:"pointer"},children:Se("button",{type:"button",onClick:Zn,title:"Collapse (\u2318\u2318)",style:{display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,border:"none",background:"none",padding:0,cursor:"inherit"},children:Se("svg",{"data-popmelt-logo":!0,width:"30",height:"30",viewBox:"0 0 40 40",fill:ao,stroke:"none",xmlns:"http://www.w3.org/2000/svg",children:Se("path",{d:"M20.25 8.00293H20.249C21.5098 8.0286 22.7219 8.25094 23.8584 8.63672L23.8604 8.63574C23.8961 8.64787 23.9312 8.66145 23.9668 8.67383C24.0611 8.70686 24.1548 8.74106 24.248 8.77637C24.2915 8.79273 24.3357 8.80727 24.3789 8.82422L24.376 8.82617C27.6145 10.0955 30.1646 12.7301 31.3213 16.0234L31.3232 16.0225C31.3327 16.0493 31.3404 16.0766 31.3496 16.1035C31.7691 17.3256 32 18.6356 32 20C32 20.8726 31.9366 21.6706 31.7598 22.4902L31.7197 22.6328C31.6412 23.0066 31.5136 23.6108 31.3408 24.2217L31.3398 24.2246C31.2967 24.377 31.251 24.5299 31.2021 24.6797C30.9215 25.5403 30.5473 26.2998 30.0879 26.2998C29.7613 26.2996 29.5995 25.9674 29.4316 25.6221C29.2501 25.2487 29.0614 24.8605 28.6484 24.8604C27.8532 24.8604 27.2081 25.5046 27.208 26.2998V27.0771C27.2079 27.6079 26.9661 28.112 26.5205 28.4004C25.9146 28.7925 25.2357 28.6462 24.7959 28.2061L24.7949 28.208C24.7897 28.2028 24.7854 28.1967 24.7803 28.1914C24.7654 28.1761 24.7507 28.1606 24.7363 28.1445C24.7105 28.1156 24.6858 28.0857 24.6621 28.0547C24.6461 28.0339 24.6302 28.013 24.6152 27.9912C24.5931 27.9591 24.5726 27.9257 24.5527 27.8916C24.5392 27.8685 24.5261 27.8452 24.5137 27.8213C24.5093 27.8128 24.5043 27.8045 24.5 27.7959L24.501 27.7939C24.3932 27.5763 24.3282 27.3276 24.3281 27.0576V26.2998C24.328 25.5993 23.8278 25.0158 23.165 24.8867V24.8877C23.0752 24.8702 22.9826 24.8604 22.8877 24.8604C22.8446 24.8604 22.8019 24.8624 22.7598 24.8662C22.0247 24.9312 21.4483 25.5479 21.4482 26.2998C21.4482 26.9127 21.4608 27.5305 21.4736 28.1494L21.4951 29.3135C21.5 29.7013 21.5015 30.089 21.4971 30.4756C21.4874 31.3103 20.8426 32 20.0078 32C19.1732 31.9998 18.5292 31.3102 18.5195 30.4756C18.5159 30.1613 18.5176 29.8464 18.5205 29.5312V29.5322C18.5212 29.4593 18.5206 29.3864 18.5215 29.3135L18.5303 28.8154V28.8145C18.5343 28.5927 18.5384 28.371 18.543 28.1494C18.5558 27.5305 18.5684 28.1129 18.5684 27.5C18.5684 26.7047 17.9232 26.0596 17.1279 26.0596C16.907 26.0596 16.6978 26.1103 16.5107 26.1992C16.2161 26.3393 15.9767 26.5769 15.834 26.8701C15.8269 26.8846 15.8201 26.8993 15.8135 26.9141C15.7821 26.9845 15.7562 27.0579 15.7363 27.1338C15.7243 27.1798 15.7155 27.2267 15.708 27.2744C15.7012 27.3175 15.6953 27.361 15.6924 27.4053C15.6903 27.4366 15.6885 27.4681 15.6885 27.5V28.7383C15.6883 29.9234 14.4911 30.7248 13.4961 30.0811C13.0505 29.7926 12.8086 29.2886 12.8086 28.7578V26.2998C12.8086 25.9737 12.6984 25.674 12.5156 25.4326C12.4437 25.3381 12.3612 25.2521 12.2686 25.1777V25.1768C12.0219 24.9788 11.709 24.8604 11.3682 24.8604C10.9892 24.8604 10.8622 24.8872 10.7295 25.2295C10.5837 25.6055 10.4302 26 9.92773 26C9.33081 25.9996 8.95963 25.2403 8.71484 24.3799C8.5591 23.8325 8.45907 23.571 8.3623 23.0107C8.3501 22.9401 8.33284 22.8403 8.31738 22.7529C8.12812 21.9466 8.02043 21.1089 8.00293 20.249V20.25L8 20C8 19.8617 8.00317 19.724 8.00781 19.5869C8.00837 19.5703 8.00816 19.5537 8.00879 19.5371L8.00977 19.5352C8.0998 17.1716 8.87444 14.9844 10.1396 13.1631C10.1488 13.1499 10.1587 13.1372 10.168 13.124C12.255 10.1453 15.6582 8.15745 19.5352 8.00977L19.5371 8.00879C19.5537 8.00816 19.5703 8.00837 19.5869 8.00781C19.724 8.00317 19.8617 8 20 8L20.25 8.00293Z"})})})})]})]})]}):Mt($r,{children:[Se("style",{children:`
16
16
  @keyframes popmelt-border-march { to { background-position: 0 -5px; } }
17
- `}),Et("div",{ref:D=>{to.current=D,be&&(be.current=D)},id:"devtools-toolbar",style:y(f({},wn),{overflow:"visible",opacity:o?1:.5,transition:"opacity 150ms ease"}),children:[eo,Se("button",{type:"button",style:{display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,border:"none",background:"none",cursor:"pointer",padding:0},onClick:()=>{We(!0),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SET_ANNOTATING",payload:!0})},onMouseEnter:()=>s==null?void 0:s(!0),onMouseLeave:()=>s==null?void 0:s(!1),title:"Open annotation toolbar (\u2318\u2318)",children:Se("svg",{"data-popmelt-logo":!0,width:"30",height:"30",viewBox:"0 0 40 40",fill:"none",stroke:xo,strokeWidth:"1",strokeLinejoin:"round",xmlns:"http://www.w3.org/2000/svg",children:Se("path",{d:"M20.25 8.00293H20.249C21.5098 8.0286 22.7219 8.25094 23.8584 8.63672L23.8604 8.63574C23.8961 8.64787 23.9312 8.66145 23.9668 8.67383C24.0611 8.70686 24.1548 8.74106 24.248 8.77637C24.2915 8.79273 24.3357 8.80727 24.3789 8.82422L24.376 8.82617C27.6145 10.0955 30.1646 12.7301 31.3213 16.0234L31.3232 16.0225C31.3327 16.0493 31.3404 16.0766 31.3496 16.1035C31.7691 17.3256 32 18.6356 32 20C32 20.8726 31.9366 21.6706 31.7598 22.4902L31.7197 22.6328C31.6412 23.0066 31.5136 23.6108 31.3408 24.2217L31.3398 24.2246C31.2967 24.377 31.251 24.5299 31.2021 24.6797C30.9215 25.5403 30.5473 26.2998 30.0879 26.2998C29.7613 26.2996 29.5995 25.9674 29.4316 25.6221C29.2501 25.2487 29.0614 24.8605 28.6484 24.8604C27.8532 24.8604 27.2081 25.5046 27.208 26.2998V27.0771C27.2079 27.6079 26.9661 28.112 26.5205 28.4004C25.9146 28.7925 25.2357 28.6462 24.7959 28.2061L24.7949 28.208C24.7897 28.2028 24.7854 28.1967 24.7803 28.1914C24.7654 28.1761 24.7507 28.1606 24.7363 28.1445C24.7105 28.1156 24.6858 28.0857 24.6621 28.0547C24.6461 28.0339 24.6302 28.013 24.6152 27.9912C24.5931 27.9591 24.5726 27.9257 24.5527 27.8916C24.5392 27.8685 24.5261 27.8452 24.5137 27.8213C24.5093 27.8128 24.5043 27.8045 24.5 27.7959L24.501 27.7939C24.3932 27.5763 24.3282 27.3276 24.3281 27.0576V26.2998C24.328 25.5993 23.8278 25.0158 23.165 24.8867V24.8877C23.0752 24.8702 22.9826 24.8604 22.8877 24.8604C22.8446 24.8604 22.8019 24.8624 22.7598 24.8662C22.0247 24.9312 21.4483 25.5479 21.4482 26.2998C21.4482 26.9127 21.4608 27.5305 21.4736 28.1494L21.4951 29.3135C21.5 29.7013 21.5015 30.089 21.4971 30.4756C21.4874 31.3103 20.8426 32 20.0078 32C19.1732 31.9998 18.5292 31.3102 18.5195 30.4756C18.5159 30.1613 18.5176 29.8464 18.5205 29.5312V29.5322C18.5212 29.4593 18.5206 29.3864 18.5215 29.3135L18.5303 28.8154V28.8145C18.5343 28.5927 18.5384 28.371 18.543 28.1494C18.5558 27.5305 18.5684 28.1129 18.5684 27.5C18.5684 26.7047 17.9232 26.0596 17.1279 26.0596C16.907 26.0596 16.6978 26.1103 16.5107 26.1992C16.2161 26.3393 15.9767 26.5769 15.834 26.8701C15.8269 26.8846 15.8201 26.8993 15.8135 26.9141C15.7821 26.9845 15.7562 27.0579 15.7363 27.1338C15.7243 27.1798 15.7155 27.2267 15.708 27.2744C15.7012 27.3175 15.6953 27.361 15.6924 27.4053C15.6903 27.4366 15.6885 27.4681 15.6885 27.5V28.7383C15.6883 29.9234 14.4911 30.7248 13.4961 30.0811C13.0505 29.7926 12.8086 29.2886 12.8086 28.7578V26.2998C12.8086 25.9737 12.6984 25.674 12.5156 25.4326C12.4437 25.3381 12.3612 25.2521 12.2686 25.1777V25.1768C12.0219 24.9788 11.709 24.8604 11.3682 24.8604C10.9892 24.8604 10.8622 24.8872 10.7295 25.2295C10.5837 25.6055 10.4302 26 9.92773 26C9.33081 25.9996 8.95963 25.2403 8.71484 24.3799C8.5591 23.8325 8.45907 23.571 8.3623 23.0107C8.3501 22.9401 8.33284 22.8403 8.31738 22.7529C8.12812 21.9466 8.02043 21.1089 8.00293 20.249V20.25L8 20C8 19.8617 8.00317 19.724 8.00781 19.5869C8.00837 19.5703 8.00816 19.5537 8.00879 19.5371L8.00977 19.5352C8.0998 17.1716 8.87444 14.9844 10.1396 13.1631C10.1488 13.1499 10.1587 13.1372 10.168 13.124C12.255 10.1453 15.6582 8.15745 19.5352 8.00977L19.5371 8.00879C19.5537 8.00816 19.5703 8.00837 19.5869 8.00781C19.724 8.00317 19.8617 8 20 8L20.25 8.00293Z"})})})]})]})}import{useCallback as xf,useEffect as Kn,useRef as Mr,useState as Is}from"react";import{Fragment as tc,jsx as zt,jsxs as Ir}from"react/jsx-runtime";var vf={position:"fixed",bottom:86,right:16,zIndex:9999,display:"flex",flexDirection:"column",alignItems:"flex-end"},Sf=24,wf=6,Cf=Sf-wf,kf=8,ec=y(f({display:"flex",alignItems:"center",gap:6,padding:"4px 10px",backgroundColor:"rgba(255, 255, 255, 0.85)"},go),{backdropFilter:"blur(32px)",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,color:"#1f2937",whiteSpace:"nowrap",transition:"transform 200ms ease, opacity 200ms ease"});function Ef(e){var l;let t=e.filter(a=>a.type==="tool_use");if(t.length===0)return"Starting\u2026";let n=t[t.length-1],r=String(n.data.tool||""),o=n.data.file?String(n.data.file):null,i=o?(l=o.split("/").pop())!=null?l:o:null,s=n.data.content?String(n.data.content):null;switch(r){case"Read":return i?`Reading ${i}`:"Reading file";case"Edit":return i?`Editing ${i}`:"Editing file";case"Write":return i?`Writing ${i}`:"Writing file";case"Bash":{if(!s)return"Running command";let a=s.split(`
18
- `)[0].trim();return a.length<=40?a:a.slice(0,37)+"\u2026"}case"Glob":return"Searching files";case"Grep":return"Searching code";default:return r?`Using ${r}`:"Working\u2026"}}function Tf(e){let t=e.replace(/^Error:\s*/i,"");return t.length>40?t.slice(0,37)+"...":t}function Mf(e,t){if(e.some(o=>o.type==="question"&&o.data.jobId===t))return"Has a question";let r=e.find(o=>o.type==="done"&&o.data.jobId===t);if(r){let o=r.data.resolutions;if(Array.isArray(o)&&o.length>0)return"Applied changes"}return"Replied"}function If({color:e}){let[t,n]=Is(0);return Kn(()=>{let r=setInterval(()=>{n(o=>(o+1)%2)},250);return()=>clearInterval(r)},[]),zt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?Ir(tc,{children:[zt("circle",{cx:"7",cy:"7",r:"2"}),zt("circle",{cx:"17",cy:"7",r:"2"}),zt("circle",{cx:"7",cy:"17",r:"2"}),zt("circle",{cx:"17",cy:"17",r:"2"})]}):Ir(tc,{children:[zt("circle",{cx:"12",cy:"6",r:"2"}),zt("circle",{cx:"6",cy:"12",r:"2"}),zt("circle",{cx:"18",cy:"12",r:"2"}),zt("circle",{cx:"12",cy:"18",r:"2"})]})})}function Lf({color:e}){return zt("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:e,opacity:.6}})}function Rf({color:e}){return zt("span",{style:{color:e,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function Af(){return zt("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function Pf({onCancel:e}){let t=Mr(null);return Kn(()=>{let n=t.current;if(!n)return;let r=o=>{o.stopPropagation(),e()};return n.addEventListener("click",r),()=>n.removeEventListener("click",r)},[e]),zt("button",{ref:t,style:{background:"none",border:"none",cursor:"pointer",color:"#9ca3af",fontSize:14,padding:"0 4px",lineHeight:1},title:"Cancel",children:"\xD7"})}function Of({onDismiss:e}){let t=Mr(null);return Kn(()=>{let n=t.current;if(!n)return;let r=o=>{o.stopPropagation(),e()};return n.addEventListener("click",r),()=>n.removeEventListener("click",r)},[e]),zt("button",{ref:t,style:{background:"none",border:"none",cursor:"pointer",color:"#9ca3af",fontSize:14,padding:"0 4px",lineHeight:1},title:"Dismiss",children:"\xD7"})}function nc({bridge:e,inFlightJobs:t,isVisible:n,onHover:r,clearSignal:o,onViewThread:i,onClickJob:s,onCancel:l,onHoverJob:a,isConnected:d,dismissedThreadIds:c}){let[u,p]=Is([]),[g,w]=Is(!1);Kn(()=>{o>0&&p([])},[o]),Kn(()=>{!c||c.size===0||p(x=>{let N=x.filter(W=>!W.threadId||!c.has(W.threadId));return N.length===x.length?x:N})},[c]),Kn(()=>{p(x=>{var Q;let N=new Set(x.map(ie=>ie.jobId)),W=!1,_=x.map(ie=>{let pe=t[ie.jobId];return pe&&(!ie.threadId||ie.color==="#888")?(W=!0,y(f({},ie),{threadId:ie.threadId||pe.threadId,color:ie.color==="#888"?pe.color:ie.color})):ie});for(let[ie,pe]of Object.entries(t))N.has(ie)||(_.push({jobId:ie,color:pe.color,status:"queued",threadId:pe.threadId}),W=!0);let H=new Set(Object.keys(t)),V=new Set(e.activeJobIds),k=_.filter(ie=>ie.status!=="queued"?!0:H.has(ie.jobId)||V.has(ie.jobId));k.length!==_.length&&(W=!0);let A=new Set(k.map(ie=>ie.jobId));for(let ie of e.activeJobIds)if(!A.has(ie)){let pe=e.events.find(be=>be.type==="job_started"&&be.data.jobId===ie);k.push({jobId:ie,color:"#888",status:"working",threadId:(Q=pe==null?void 0:pe.data)==null?void 0:Q.threadId}),W=!0}return W?k:x})},[t,e.activeJobIds]),Kn(()=>{if(e.activeJobIds.length===0)return;let x=new Set(e.activeJobIds);p(N=>N.map(W=>x.has(W.jobId)&&W.status!=="done"&&W.status!=="error"?y(f({},W),{status:"working"}):W))},[e.activeJobIds]);let C=Mr(null);Kn(()=>{let x=e.lastCompletedJobId;if(!x||x===C.current)return;C.current=x;let N=e.events.find(A=>A.type==="error"&&(A.data.jobId===x||e.status==="error")),W=!!N,_=W?void 0:Mf(e.events,x),H=N?String(N.data.message||""):void 0,V=N?!!N.data.cancelled:void 0,k=N==null?void 0:N.data.threadId;p(A=>A.map(Q=>Q.jobId===x?y(f({},Q),{status:W?"error":"done",doneLabel:_,errorMessage:H,cancelled:V,threadId:Q.threadId||k}):Q))},[e.lastCompletedJobId,e.events,e.status]);let R=n&&(u.length>0||d===!1),P=Mr(null);Kn(()=>{if(!R)return;let x=P.current;if(!x)return;let N=()=>{w(!0),r(!0)},W=()=>{w(!1),r(!1),a==null||a(null)};return x.addEventListener("mouseenter",N),x.addEventListener("mouseleave",W),()=>{x.removeEventListener("mouseenter",N),x.removeEventListener("mouseleave",W)}},[R,r,a]);let G=Mr(new Map),M=xf((x,N)=>{N?G.current.set(x,N):G.current.delete(x)},[]);if(Kn(()=>{if(!R)return;let x=[];for(let N of u){let W=G.current.get(N.jobId);if(W){if(s){let _=N.jobId,H=()=>s(_);W.addEventListener("click",H),x.push(()=>W.removeEventListener("click",H))}if(a){let _=N.jobId,H=()=>a(_),V=()=>a(null);W.addEventListener("mouseenter",H),W.addEventListener("mouseleave",V),x.push(()=>{W.removeEventListener("mouseenter",H),W.removeEventListener("mouseleave",V)})}}}return()=>x.forEach(N=>N())},[R,u,s,a]),!R)return null;let T=!g&&u.length>1;return Ir("div",{ref:P,style:vf,"data-devtools":!0,children:[[...u].reverse().map((x,N)=>{let W=N===u.length-1,_=u.length-1-N,H=x.status==="working"?Ef(e.events.filter(V=>V.data.jobId===x.jobId)):x.status==="queued"?"Queued":x.status==="done"?x.doneLabel||"Done":x.cancelled?"Cancelled":x.errorMessage?Tf(x.errorMessage):"Error";return zt("div",{style:{position:"relative",zIndex:N,marginBottom:T?W?0:-Cf:W?0:kf,transform:T?`scale(${Math.max(.94,1-_*.02)})`:"scale(1)",opacity:T?Math.max(.5,1-_*.15):1,transformOrigin:"bottom right",transition:"margin-bottom 250ms ease, transform 250ms ease, opacity 250ms ease"},children:Ir("div",{ref:V=>M(x.jobId,V),style:y(f({},ec),{cursor:s?"pointer":void 0}),title:x.errorMessage||void 0,children:[x.status==="working"&&zt(If,{color:x.color}),x.status==="queued"&&zt(Lf,{color:x.color}),x.status==="done"&&zt(Rf,{color:x.color}),x.status==="error"&&zt(Af,{}),zt("span",{style:{color:x.status==="queued"?"#9ca3af":"#1f2937",maxWidth:160,overflow:"hidden",textOverflow:"ellipsis"},children:H}),x.status==="working"&&l&&zt(Pf,{onCancel:()=>l(x.jobId)}),(x.status==="done"||x.status==="error")&&zt(Of,{onDismiss:()=>p(V=>V.filter(k=>k.jobId!==x.jobId))})]})},x.jobId)}),d===!1&&u.length>0&&Ir("div",{style:y(f({},ec),{color:"#9ca3af"}),children:[zt("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#f59e0b"}}),zt("span",{children:"Reconnecting\u2026"})]})]})}import{Fragment as Df,jsx as Nf,jsxs as _f}from"react/jsx-runtime";var Bf=`
17
+ `}),Mt("div",{ref:w=>{or.current=w,fe&&(fe.current=w)},id:"devtools-toolbar",style:h(f({},go),{overflow:"visible",opacity:r?1:.5}),children:[Ao,Se("button",{type:"button",style:{display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,border:"none",background:"none",cursor:"pointer",padding:0},onClick:()=>{Fe(!0),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SET_ANNOTATING",payload:!0})},onMouseEnter:()=>s==null?void 0:s(!0),onMouseLeave:()=>s==null?void 0:s(!1),title:"Open annotation toolbar (\u2318\u2318)",children:Se("svg",{"data-popmelt-logo":!0,width:"30",height:"30",viewBox:"0 0 40 40",fill:"none",stroke:ao,strokeWidth:"1",strokeLinejoin:"round",xmlns:"http://www.w3.org/2000/svg",children:Se("path",{d:"M20.25 8.00293H20.249C21.5098 8.0286 22.7219 8.25094 23.8584 8.63672L23.8604 8.63574C23.8961 8.64787 23.9312 8.66145 23.9668 8.67383C24.0611 8.70686 24.1548 8.74106 24.248 8.77637C24.2915 8.79273 24.3357 8.80727 24.3789 8.82422L24.376 8.82617C27.6145 10.0955 30.1646 12.7301 31.3213 16.0234L31.3232 16.0225C31.3327 16.0493 31.3404 16.0766 31.3496 16.1035C31.7691 17.3256 32 18.6356 32 20C32 20.8726 31.9366 21.6706 31.7598 22.4902L31.7197 22.6328C31.6412 23.0066 31.5136 23.6108 31.3408 24.2217L31.3398 24.2246C31.2967 24.377 31.251 24.5299 31.2021 24.6797C30.9215 25.5403 30.5473 26.2998 30.0879 26.2998C29.7613 26.2996 29.5995 25.9674 29.4316 25.6221C29.2501 25.2487 29.0614 24.8605 28.6484 24.8604C27.8532 24.8604 27.2081 25.5046 27.208 26.2998V27.0771C27.2079 27.6079 26.9661 28.112 26.5205 28.4004C25.9146 28.7925 25.2357 28.6462 24.7959 28.2061L24.7949 28.208C24.7897 28.2028 24.7854 28.1967 24.7803 28.1914C24.7654 28.1761 24.7507 28.1606 24.7363 28.1445C24.7105 28.1156 24.6858 28.0857 24.6621 28.0547C24.6461 28.0339 24.6302 28.013 24.6152 27.9912C24.5931 27.9591 24.5726 27.9257 24.5527 27.8916C24.5392 27.8685 24.5261 27.8452 24.5137 27.8213C24.5093 27.8128 24.5043 27.8045 24.5 27.7959L24.501 27.7939C24.3932 27.5763 24.3282 27.3276 24.3281 27.0576V26.2998C24.328 25.5993 23.8278 25.0158 23.165 24.8867V24.8877C23.0752 24.8702 22.9826 24.8604 22.8877 24.8604C22.8446 24.8604 22.8019 24.8624 22.7598 24.8662C22.0247 24.9312 21.4483 25.5479 21.4482 26.2998C21.4482 26.9127 21.4608 27.5305 21.4736 28.1494L21.4951 29.3135C21.5 29.7013 21.5015 30.089 21.4971 30.4756C21.4874 31.3103 20.8426 32 20.0078 32C19.1732 31.9998 18.5292 31.3102 18.5195 30.4756C18.5159 30.1613 18.5176 29.8464 18.5205 29.5312V29.5322C18.5212 29.4593 18.5206 29.3864 18.5215 29.3135L18.5303 28.8154V28.8145C18.5343 28.5927 18.5384 28.371 18.543 28.1494C18.5558 27.5305 18.5684 28.1129 18.5684 27.5C18.5684 26.7047 17.9232 26.0596 17.1279 26.0596C16.907 26.0596 16.6978 26.1103 16.5107 26.1992C16.2161 26.3393 15.9767 26.5769 15.834 26.8701C15.8269 26.8846 15.8201 26.8993 15.8135 26.9141C15.7821 26.9845 15.7562 27.0579 15.7363 27.1338C15.7243 27.1798 15.7155 27.2267 15.708 27.2744C15.7012 27.3175 15.6953 27.361 15.6924 27.4053C15.6903 27.4366 15.6885 27.4681 15.6885 27.5V28.7383C15.6883 29.9234 14.4911 30.7248 13.4961 30.0811C13.0505 29.7926 12.8086 29.2886 12.8086 28.7578V26.2998C12.8086 25.9737 12.6984 25.674 12.5156 25.4326C12.4437 25.3381 12.3612 25.2521 12.2686 25.1777V25.1768C12.0219 24.9788 11.709 24.8604 11.3682 24.8604C10.9892 24.8604 10.8622 24.8872 10.7295 25.2295C10.5837 25.6055 10.4302 26 9.92773 26C9.33081 25.9996 8.95963 25.2403 8.71484 24.3799C8.5591 23.8325 8.45907 23.571 8.3623 23.0107C8.3501 22.9401 8.33284 22.8403 8.31738 22.7529C8.12812 21.9466 8.02043 21.1089 8.00293 20.249V20.25L8 20C8 19.8617 8.00317 19.724 8.00781 19.5869C8.00837 19.5703 8.00816 19.5537 8.00879 19.5371L8.00977 19.5352C8.0998 17.1716 8.87444 14.9844 10.1396 13.1631C10.1488 13.1499 10.1587 13.1372 10.168 13.124C12.255 10.1453 15.6582 8.15745 19.5352 8.00977L19.5371 8.00879C19.5537 8.00816 19.5703 8.00837 19.5869 8.00781C19.724 8.00317 19.8617 8 20 8L20.25 8.00293Z"})})})]})]})}import{useCallback as Hf,useEffect as io,useRef as zr,useState as Mi}from"react";import{Fragment as wc,jsx as Lt,jsxs as kr}from"react/jsx-runtime";var Ff=24,$f=6,zf=Ff-$f,Wf=8,Sc=h(f({display:"flex",alignItems:"center",gap:3,padding:0,backgroundColor:"#eaeaea"},xr),{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,whiteSpace:"nowrap",transition:"transform 200ms ease, opacity 200ms ease"});function Gf(e){var a;let t=e.filter(l=>l.type==="tool_use");if(t.length===0)return"Starting\u2026";let n=t[t.length-1],o=String(n.data.tool||""),r=n.data.file?String(n.data.file):null,i=r?(a=r.split("/").pop())!=null?a:r:null,s=n.data.content?String(n.data.content):null;switch(o){case"Read":return i?`Reading ${i}`:"Reading file";case"Edit":return i?`Editing ${i}`:"Editing file";case"Write":return i?`Writing ${i}`:"Writing file";case"Bash":{if(!s)return"Running command";let l=s.split(`
18
+ `)[0].trim();return l.length<=40?l:l.slice(0,37)+"\u2026"}case"Glob":return"Searching files";case"Grep":return"Searching code";default:return o?`Using ${o}`:"Working\u2026"}}function jf(e){let t=e.replace(/^Error:\s*/i,"");return t.length>40?t.slice(0,37)+"...":t}function Yf(e,t){if(e.some(i=>i.type==="question"&&i.data.jobId===t))return"Has a question";let o=new Set(["Edit","Write"]);return e.some(i=>i.type==="tool_use"&&i.data.jobId===t&&o.has(String(i.data.tool||"")))?"Applied changes":"Replied"}function Jf({color:e}){let[t,n]=Mi(0);return io(()=>{let o=setInterval(()=>{n(r=>(r+1)%2)},250);return()=>clearInterval(o)},[]),Lt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?kr(wc,{children:[Lt("circle",{cx:"7",cy:"7",r:"2"}),Lt("circle",{cx:"17",cy:"7",r:"2"}),Lt("circle",{cx:"7",cy:"17",r:"2"}),Lt("circle",{cx:"17",cy:"17",r:"2"})]}):kr(wc,{children:[Lt("circle",{cx:"12",cy:"6",r:"2"}),Lt("circle",{cx:"6",cy:"12",r:"2"}),Lt("circle",{cx:"18",cy:"12",r:"2"}),Lt("circle",{cx:"12",cy:"18",r:"2"})]})})}function Uf({color:e}){return Lt("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:e,opacity:.6}})}function Vf({color:e}){return Lt("span",{style:{color:e,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function Xf(){return Lt("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function Kf({onCancel:e}){let t=zr(null);return io(()=>{let n=t.current;if(!n)return;let o=s=>{s.stopPropagation(),e()},r=()=>{n.style.opacity="0.5"},i=()=>{n.style.opacity="0.7"};return n.addEventListener("click",o),n.addEventListener("mouseenter",r),n.addEventListener("mouseleave",i),()=>{n.removeEventListener("click",o),n.removeEventListener("mouseenter",r),n.removeEventListener("mouseleave",i)}},[e]),Lt("button",{ref:t,style:{background:"none",border:"none",cursor:"pointer",color:"#ffffff",opacity:.7,fontSize:14,padding:"0 2px",lineHeight:1},title:"Cancel",children:"\xD7"})}function qf({onDismiss:e}){let t=zr(null);return io(()=>{let n=t.current;if(!n)return;let o=s=>{s.stopPropagation(),e()},r=()=>{n.style.opacity="0.5"},i=()=>{n.style.opacity="0.7"};return n.addEventListener("click",o),n.addEventListener("mouseenter",r),n.addEventListener("mouseleave",i),()=>{n.removeEventListener("click",o),n.removeEventListener("mouseenter",r),n.removeEventListener("mouseleave",i)}},[e]),Lt("button",{ref:t,style:{background:"none",border:"none",cursor:"pointer",color:"#ffffff",opacity:.7,fontSize:14,padding:"0 2px",lineHeight:1},title:"Dismiss",children:"\xD7"})}function Cc({bridge:e,inFlightJobs:t,isVisible:n,onHover:o,clearSignal:r,onViewThread:i,onClickJob:s,onCancel:a,onHoverJob:l,isConnected:d,dismissedThreadIds:c,snapPosition:p="bottom-right"}){let[u,g]=Mi([]),[b,x]=Mi(!1),[A,T]=Mi(()=>typeof window!="undefined"?{w:window.innerWidth,h:window.innerHeight}:{w:1920,h:1080});io(()=>{let D=()=>T({w:window.innerWidth,h:window.innerHeight});return window.addEventListener("resize",D),()=>window.removeEventListener("resize",D)},[]);let z=Fa(p,A.w,A.h);io(()=>{r>0&&g([])},[r]),io(()=>{!c||c.size===0||g(D=>{let ae=D.filter(I=>!I.threadId||!c.has(I.threadId));return ae.length===D.length?D:ae})},[c]),io(()=>{g(D=>{var Re;let ae=new Set(D.map(Ce=>Ce.jobId)),I=!1,pe=D.map(Ce=>{let at=t[Ce.jobId];return at&&(!Ce.threadId||Ce.color==="#888")?(I=!0,h(f({},Ce),{threadId:Ce.threadId||at.threadId,color:Ce.color==="#888"?at.color:Ce.color})):Ce});for(let[Ce,at]of Object.entries(t))ae.has(Ce)||(pe.push({jobId:Ce,color:at.color,status:"queued",threadId:at.threadId}),I=!0);let me=new Set(Object.keys(t)),Fe=new Set(e.activeJobIds),we=pe.filter(Ce=>Ce.status!=="queued"?!0:me.has(Ce.jobId)||Fe.has(Ce.jobId));we.length!==pe.length&&(I=!0);let Je=new Set(we.map(Ce=>Ce.jobId));for(let Ce of e.activeJobIds)if(!Je.has(Ce)){let at=e.events.find(gt=>gt.type==="job_started"&&gt.data.jobId===Ce);we.push({jobId:Ce,color:"#888",status:"working",threadId:(Re=at==null?void 0:at.data)==null?void 0:Re.threadId}),I=!0}return I?we:D})},[t,e.activeJobIds]),io(()=>{if(e.activeJobIds.length===0)return;let D=new Set(e.activeJobIds);g(ae=>ae.map(I=>D.has(I.jobId)&&I.status!=="done"&&I.status!=="error"?h(f({},I),{status:"working"}):I))},[e.activeJobIds]);let P=zr(null);io(()=>{let D=e.lastCompletedJobId;if(!D||D===P.current)return;P.current=D;let ae=e.events.find(Je=>Je.type==="error"&&(Je.data.jobId===D||e.status==="error")),I=!!ae,pe=I?void 0:Yf(e.events,D),me=ae?String(ae.data.message||""):void 0,Fe=ae?!!ae.data.cancelled:void 0,we=ae==null?void 0:ae.data.threadId;g(Je=>Je.map(Re=>Re.jobId===D?h(f({},Re),{status:I?"error":"done",doneLabel:pe,errorMessage:me,cancelled:Fe,threadId:Re.threadId||we}):Re))},[e.lastCompletedJobId,e.events,e.status]);let O=n&&(u.length>0||d===!1),k=zr(null);io(()=>{if(!O)return;let D=k.current;if(!D)return;let ae=()=>{x(!0),o(!0)},I=()=>{x(!1),o(!1),l==null||l(null)};return D.addEventListener("mouseenter",ae),D.addEventListener("mouseleave",I),()=>{D.removeEventListener("mouseenter",ae),D.removeEventListener("mouseleave",I)}},[O,o,l]);let G=zr(new Map),re=Hf((D,ae)=>{ae?G.current.set(D,ae):G.current.delete(D)},[]);if(io(()=>{if(!O)return;let D=[];for(let ae of u){let I=G.current.get(ae.jobId);if(I){if(s){let pe=ae.jobId,me=()=>s(pe);I.addEventListener("click",me),D.push(()=>I.removeEventListener("click",me))}if(l){let pe=ae.jobId,me=()=>l(pe),Fe=()=>l(null);I.addEventListener("mouseenter",me),I.addEventListener("mouseleave",Fe),D.push(()=>{I.removeEventListener("mouseenter",me),I.removeEventListener("mouseleave",Fe)})}}}return()=>D.forEach(ae=>ae())},[O,u,s,l]),!O)return null;let oe={working:3,queued:2,error:1,done:0},W=[],Q=new Map;for(let D of u){if(!D.threadId){W.push(D);continue}let ae=Q.get(D.threadId);(!ae||oe[D.status]>oe[ae.status]||oe[D.status]===oe[ae.status])&&Q.set(D.threadId,D)}for(let D of Q.values())W.push(D);let N=W.filter(D=>D.status==="queued"),ee=new Map;N.forEach((D,ae)=>{ee.set(D.jobId,`(${ae+1}/${N.length})`)});let M=!b&&W.length>1,Le=zo(p),V=Wo(p),fe=Le?W:[...W].reverse();return kr("div",{ref:k,style:z,"data-devtools":!0,children:[Lt("style",{children:"@keyframes popmelt-badge-march { to { background-position: 0 -5px; } }"}),fe.map((D,ae)=>{var Fe;let I=ae===W.length-1,pe=W.length-1-ae,me=D.status==="working"?Gf(e.events.filter(we=>we.data.jobId===D.jobId)):D.status==="queued"?`Queued ${(Fe=ee.get(D.jobId))!=null?Fe:""}`:D.status==="done"?D.doneLabel||"Done":D.cancelled?"Cancelled":D.errorMessage?jf(D.errorMessage):"Error";return Lt("div",{style:{position:"relative",zIndex:W.length-ae,marginBottom:M?I?0:-zf:I?0:Wf,transform:M?`scale(${Math.max(.94,1-pe*.02)})`:"scale(1)",opacity:1,transformOrigin:`${Le?"top":"bottom"} ${V?"right":"left"}`,transition:"margin-bottom 250ms ease, transform 250ms ease, opacity 250ms ease"},children:kr("div",{ref:we=>re(D.jobId,we),style:f(h(f({},Sc),{position:"relative",overflow:"visible",cursor:s?"pointer":void 0}),D.status==="working"&&{borderImage:"none",borderColor:"transparent"}),title:D.errorMessage||void 0,children:[D.status==="working"&&(()=>{let we=`<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='${D.color}' stroke-width='.75'/></svg>`;return Lt("div",{style:{position:"absolute",inset:-3,padding:5,backgroundImage:`url("data:image/svg+xml,${encodeURIComponent(we)}")`,backgroundSize:"5px 5px",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",maskComposite:"exclude",pointerEvents:"none",animation:"popmelt-badge-march 0.8s linear infinite"}})})(),kr("div",{style:{display:"flex",alignItems:"center",gap:3,padding:"3px 5px 3px 8px",margin:3,backgroundColor:D.status==="error"?"#ef4444":D.color,color:"#ffffff"},children:[D.status==="working"&&Lt(Jf,{color:"#ffffff"}),D.status==="queued"&&Lt(Uf,{color:"#ffffff"}),D.status==="done"&&Lt(Vf,{color:"#ffffff"}),D.status==="error"&&Lt(Xf,{}),Lt("span",{style:{opacity:D.status==="queued"?.6:1,maxWidth:160,overflow:"hidden",textOverflow:"ellipsis"},children:me}),D.status==="working"&&a&&Lt(Kf,{onCancel:()=>a(D.jobId)}),(D.status==="done"||D.status==="error")&&Lt(qf,{onDismiss:()=>g(we=>we.filter(Je=>D.threadId?Je.threadId!==D.threadId:Je.jobId!==D.jobId))})]})]})},D.jobId)}),d===!1&&u.length>0&&Lt("div",{style:Sc,children:kr("div",{style:{display:"flex",alignItems:"center",gap:3,padding:"3px 5px 3px 8px",margin:3,backgroundColor:"#f59e0b",color:"#ffffff"},children:[Lt("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ffffff",opacity:.6}}),Lt("span",{children:"Reconnecting\u2026"})]})})]})}import{Fragment as eg,jsx as Qf,jsxs as tg}from"react/jsx-runtime";var Zf=`
19
19
  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
20
20
  :host {
21
21
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
@@ -44,9 +44,9 @@ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{
44
44
  color: initial;
45
45
  -webkit-font-smoothing: auto;
46
46
  }
47
- `;function oc({children:e}){return _f(Df,{children:[Nf("style",{children:Bf}),e]})}import{useEffect as Hf,useLayoutEffect as Ff,useRef as $f,useState as rc}from"react";import{createPortal as zf}from"react-dom";import{Fragment as Gf,jsx as Yf,jsxs as Jf}from"react/jsx-runtime";function Wf(e){return e.tagName==="STYLE"||e.tagName==="LINK"&&e.rel==="stylesheet"}function jf(e){let t=new Map,n=e.firstChild;function r(s){if(t.has(s)||s.hasAttribute("data-pm-mirror"))return;let l=s.cloneNode(!0);l.setAttribute("data-pm-mirror",""),e.insertBefore(l,n),t.set(s,l)}function o(s){let l=t.get(s);l&&(l.remove(),t.delete(s))}for(let s of document.querySelectorAll('link[rel="stylesheet"], style'))s.getRootNode()===document&&r(s);try{document.adoptedStyleSheets.length>0&&(e.adoptedStyleSheets=[...document.adoptedStyleSheets,...e.adoptedStyleSheets])}catch(s){}let i=new MutationObserver(s=>{for(let l of s)if(l.type==="childList"){for(let a of l.addedNodes)a instanceof Element&&Wf(a)&&r(a);for(let a of l.removedNodes)a instanceof Element&&o(a)}});return i.observe(document.head,{childList:!0}),document.body&&i.observe(document.body,{childList:!0}),()=>{i.disconnect();for(let s of t.values())s.remove();t.clear()}}function ic({children:e}){let t=$f(null),[n,r]=rc(null),[o,i]=rc(null);return Ff(()=>{let s=t.current;if(!s||s.shadowRoot)return;let l=s.attachShadow({mode:"open"}),a=document.createElement("div");a.setAttribute("data-popmelt-root",""),l.appendChild(a),r(l),i(a)},[]),Hf(()=>{if(n)return jf(n)},[n]),Jf(Gf,{children:[Yf("div",{ref:t,"data-popmelt-shadow-host":!0,style:{position:"absolute",width:0,height:0,overflow:"visible",zIndex:1e4}}),o&&zf(e,o)]})}import{useCallback as fi,useEffect as Zn,useRef as lo,useState as Nn}from"react";import{jsx as ze,jsxs as Do}from"react/jsx-runtime";var Rs="ui-monospace, SFMono-Regular, Menlo, monospace",Uf=0;function Vf({size:e=11}){let t=++Uf,n=`pm-vs-m${t}`,r=`pm-vs-f0-${t}`,o=`pm-vs-f1-${t}`,i=`pm-vs-g${t}`;return Do("svg",{width:e,height:e,viewBox:"0 0 100 100",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:{display:"inline",verticalAlign:"middle",marginLeft:3,flexShrink:0},children:[ze("mask",{id:n,maskType:"alpha",maskUnits:"userSpaceOnUse",x:"0",y:"0",width:"100",height:"100",children:ze("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M70.9119 99.3171C72.4869 99.9307 74.2828 99.8914 75.8725 99.1264L96.4608 89.2197C98.6242 88.1787 100 85.9892 100 83.5872V16.4133C100 14.0113 98.6243 11.8218 96.4609 10.7808L75.8725 0.873756C73.7862 -0.130129 71.3446 0.11576 69.5135 1.44695C69.252 1.63711 69.0028 1.84943 68.769 2.08341L29.3551 38.0415L12.1872 25.0096C10.589 23.7965 8.35363 23.8959 6.86933 25.2461L1.36303 30.2549C-0.452552 31.9064 -0.454633 34.7627 1.35853 36.417L16.2471 50.0001L1.35853 63.5832C-0.454633 65.2374 -0.452552 68.0938 1.36303 69.7453L6.86933 74.7541C8.35363 76.1043 10.589 76.2037 12.1872 74.9905L29.3551 61.9587L68.769 97.9167C69.3925 98.5406 70.1246 99.0104 70.9119 99.3171ZM75.0152 27.2989L45.1091 50.0001L75.0152 72.7012V27.2989Z",fill:"white"})}),Do("g",{mask:`url(#${n})`,children:[ze("path",{d:"M96.4614 10.7962L75.8569 0.875542C73.4719 -0.272773 70.6217 0.211611 68.75 2.08333L1.29858 63.5832C-0.515693 65.2373 -0.513607 68.0937 1.30308 69.7452L6.81272 74.754C8.29793 76.1042 10.5347 76.2036 12.1338 74.9905L93.3609 13.3699C96.086 11.3026 100 13.2462 100 16.6667V16.4275C100 14.0265 98.6246 11.8378 96.4614 10.7962Z",fill:"#0065A9"}),ze("g",{filter:`url(#${r})`,children:ze("path",{d:"M96.4614 89.2038L75.8569 99.1245C73.4719 100.273 70.6217 99.7884 68.75 97.9167L1.29858 36.4169C-0.515693 34.7627 -0.513607 31.9063 1.30308 30.2548L6.81272 25.246C8.29793 23.8958 10.5347 23.7964 12.1338 25.0095L93.3609 86.6301C96.086 88.6974 100 86.7538 100 83.3334V83.5726C100 85.9735 98.6246 88.1622 96.4614 89.2038Z",fill:"#007ACC"})}),ze("g",{filter:`url(#${o})`,children:ze("path",{d:"M75.8578 99.1263C73.4721 100.274 70.6219 99.7885 68.75 97.9166C71.0564 100.223 75 98.5895 75 95.3278V4.67213C75 1.41039 71.0564 -0.223106 68.75 2.08329C70.6219 0.211402 73.4721 -0.273666 75.8578 0.873633L96.4587 10.7807C98.6234 11.8217 100 14.0112 100 16.4132V83.5871C100 85.9891 98.6234 88.1786 96.4586 89.2196L75.8578 99.1263Z",fill:"#1F9CF0"})}),ze("g",{style:{mixBlendMode:"overlay"},opacity:"0.25",children:ze("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M70.8511 99.3171C72.4261 99.9306 74.2221 99.8913 75.8117 99.1264L96.4 89.2197C98.5634 88.1787 99.9392 85.9892 99.9392 83.5871V16.4133C99.9392 14.0112 98.5635 11.8217 96.4001 10.7807L75.8117 0.873695C73.7255 -0.13019 71.2838 0.115699 69.4527 1.44688C69.1912 1.63705 68.942 1.84937 68.7082 2.08335L29.2943 38.0414L12.1264 25.0096C10.5283 23.7964 8.29285 23.8959 6.80855 25.246L1.30225 30.2548C-0.513334 31.9064 -0.515415 34.7627 1.29775 36.4169L16.1863 50L1.29775 63.5832C-0.515415 65.2374 -0.513334 68.0937 1.30225 69.7452L6.80855 74.754C8.29285 76.1042 10.5283 76.2036 12.1264 74.9905L29.2943 61.9586L68.7082 97.9167C69.3317 98.5405 70.0638 99.0104 70.8511 99.3171ZM74.9544 27.2989L45.0483 50L74.9544 72.7012V27.2989Z",fill:`url(#${i})`})})]}),Do("defs",{children:[Do("filter",{id:r,x:"-8.39411",y:"15.8291",width:"116.727",height:"92.2456",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB",children:[ze("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),ze("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"}),ze("feOffset",{}),ze("feGaussianBlur",{stdDeviation:"4.16667"}),ze("feColorMatrix",{type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"}),ze("feBlend",{mode:"overlay",in2:"BackgroundImageFix",result:"effect1_dropShadow"}),ze("feBlend",{mode:"normal",in:"SourceGraphic",in2:"effect1_dropShadow",result:"shape"})]}),Do("filter",{id:o,x:"60.4167",y:"-8.07558",width:"47.9167",height:"116.151",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB",children:[ze("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),ze("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"}),ze("feOffset",{}),ze("feGaussianBlur",{stdDeviation:"4.16667"}),ze("feColorMatrix",{type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"}),ze("feBlend",{mode:"overlay",in2:"BackgroundImageFix",result:"effect1_dropShadow"}),ze("feBlend",{mode:"normal",in:"SourceGraphic",in2:"effect1_dropShadow",result:"shape"})]}),Do("linearGradient",{id:i,x1:"49.9392",y1:"0.257812",x2:"49.9392",y2:"99.7423",gradientUnits:"userSpaceOnUse",children:[ze("stop",{stopColor:"white"}),ze("stop",{offset:"1",stopColor:"white",stopOpacity:"0"})]})]})]})}var Xf=/^#[0-9a-fA-F]{3,8}$/,Kf=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,qf=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]);function Zf(e){let t=e.trim();return Xf.test(t)||Kf.test(t)||qf.has(t.toLowerCase())}function Ls(e,t){return ze("span",{style:{display:"inline-block",width:10,height:10,backgroundColor:e,border:"1px solid rgba(0,0,0,0.15)",borderRadius:2,verticalAlign:"middle",marginRight:3}},t)}function Lr(e){let t=[],n=/(`[^`]+`)|(\*\*\*(.+?)\*\*\*)|(\*\*(.+?)\*\*)|(\*(.+?)\*)|(_([^_]+?)_)|(\[([^\]]+)\]\(([^)]+)\))|(#[0-9a-fA-F]{3,8})(?![0-9a-fA-F])|((?:rgba?|hsla?|oklch)\([^)]+\))/g,r=0,o;for(;(o=n.exec(e))!==null;){if(o.index>r&&t.push(e.slice(r,o.index)),o[1]){let i=o[1].slice(1,-1);Zf(i)&&t.push(Ls(i,`sw-${o.index}`)),t.push(ze("code",{style:{fontFamily:Rs,fontSize:"0.9em",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2},children:i},o.index))}else if(o[3]!==void 0)t.push(ze("strong",{children:ze("em",{children:o[3]})},o.index));else if(o[5]!==void 0)t.push(ze("strong",{children:o[5]},o.index));else if(o[7]!==void 0)t.push(ze("em",{children:o[7]},o.index));else if(o[9]!==void 0)t.push(ze("em",{children:o[9]},o.index));else if(o[11]!==void 0&&o[12]!==void 0){let i=o[12],s=!/^https?:\/\/|^mailto:/i.test(i),l=s?`vscode://file/${i}`:i;s?t.push(Do("a",{href:l,target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline",whiteSpace:"nowrap",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2,fontFamily:Rs,fontSize:"0.9em"},children:[o[11],ze(Vf,{})]},o.index)):t.push(ze("a",{href:l,target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline"},children:o[11]},o.index))}else o[13]!==void 0?(t.push(Ls(o[13],`sw-${o.index}`)),t.push(o[13])):o[14]!==void 0&&(t.push(Ls(o[14],`sw-${o.index}`)),t.push(o[14]));r=o.index+o[0].length}return r<e.length&&t.push(e.slice(r)),t}function qn(e){var o;let t=e.split(`
48
- `),n=[],r=0;for(;r<t.length;){let i=t[r];if(i.trimStart().startsWith("```")){let d=[];for(r++;r<t.length&&!t[r].trimStart().startsWith("```");)d.push(t[r]),r++;r++,n.push(ze("pre",{style:{fontFamily:Rs,fontSize:"0.9em",lineHeight:1.4,backgroundColor:"rgba(0,0,0,0.04)",padding:"6px 8px",margin:"4px 0",overflowX:"auto",whiteSpace:"pre"},children:d.join(`
49
- `)},n.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(i)){n.push(ze("hr",{style:{border:"none",borderTop:"1px solid rgba(0,0,0,0.1)",margin:"6px 0"}},n.length)),r++;continue}let s=i.match(/^(#{1,4})\s+(.+)/);if(s){let d=s[1].length,c={1:16,2:14,3:13,4:12};n.push(ze("div",{style:{fontWeight:700,fontSize:(o=c[d])!=null?o:12,margin:"8px 0 2px"},children:Lr(s[2])},n.length)),r++;continue}if(i.trimStart().startsWith("|")&&i.trimEnd().endsWith("|")){let d=[];for(;r<t.length&&t[r].trimStart().startsWith("|")&&t[r].trimEnd().endsWith("|");)d.push(t[r]),r++;let c=P=>/^\|[\s\-:|]+\|$/.test(P),u=d.filter(P=>!c(P)),p=P=>P.split("|").slice(1,-1).map(G=>G.trim()),g=P=>/^\*\*.+\*\*$/.test(P)||/^__.+__$/.test(P),w=u.map(p),C=w.length>1&&w.slice(1).every(P=>P[0]&&g(P[0])),R=w.length>0&&w[0].every(P=>g(P));n.push(ze("div",{style:{overflowX:"auto",margin:"4px 0",paddingBottom:4},children:ze("table",{style:{borderCollapse:"separate",borderSpacing:0,fontSize:"0.95em",width:"max-content",minWidth:"100%"},children:ze("tbody",{children:u.map((P,G)=>ze("tr",{children:p(P).map((M,T)=>ze(G===0?"th":"td",{style:f({border:"1px solid rgba(0,0,0,0.1)",padding:"3px 6px",textAlign:"left",fontWeight:G===0?600:400,minWidth:60,whiteSpace:"nowrap"},T===0&&C||G===0&&R?y(f(f({position:"sticky"},T===0&&C?{left:0}:{}),G===0&&R?{top:0}:{}),{background:"#fff",zIndex:T===0&&C&&G===0&&R?2:1}):{}),children:Lr(M)},T))},G))})})},n.length));continue}if(i.match(/^(\s*)([-*])\s+(.+)/)){let d=[];for(;r<t.length;){let c=t[r].match(/^\s*[-*]\s+(.+)/);if(c)d.push(c[1]),r++;else if(d.length>0&&t[r].match(/^\s+\S/)&&!t[r].match(/^\s*\d+\.\s/)&&!t[r].match(/^\s*[-*]\s+/))d[d.length-1]+=" "+t[r].trim(),r++;else break}n.push(ze("ul",{style:{margin:0,paddingLeft:20,listStyleType:"disc",display:"flex",flexDirection:"column",gap:8},children:d.map((c,u)=>ze("li",{children:Lr(c)},u))},n.length));continue}if(i.match(/^(\s*)\d+\.\s+(.+)/)){let d=[];for(;r<t.length;){let c=t[r].match(/^\s*\d+\.\s+(.+)/);if(c)d.push(c[1]),r++;else if(d.length>0&&t[r].match(/^\s+\S/)&&!t[r].match(/^\s*\d+\.\s/)&&!t[r].match(/^\s*[-*]\s+/))d[d.length-1]+=" "+t[r].trim(),r++;else break}n.push(ze("ol",{style:{margin:0,paddingLeft:20,listStyleType:"decimal",display:"flex",flexDirection:"column",gap:8},children:d.map((c,u)=>ze("li",{children:Lr(c)},u))},n.length));continue}if(i.trim()===""){r++;continue}n.push(ze("div",{children:Lr(i)},n.length)),r++}return ze("div",{style:{display:"flex",flexDirection:"column",gap:8},children:n})}import{Fragment as _o,jsx as fe,jsxs as ft}from"react/jsx-runtime";var cc=400,En=16,dc=3,Qf=3,uc=4,eg=8,As="devtools-thread-panel-position",ar=cc+2*dc+2*uc,tg=ar+2*Qf;function Ps(){return{top:En,left:window.innerWidth-ar-En}}function sc(e,t,n){let r=n==null?void 0:n.getBoundingClientRect(),o=2*dc+2*uc,i=window.innerHeight-En-o;return r&&t+tg>r.left&&(i=r.top-eg-o),Math.max(200,i-Math.max(0,e))}var ng={width:cc,backgroundColor:"#eaeaea",borderWidth:3,borderStyle:"solid",borderColor:"transparent",boxSizing:"content-box",display:"flex",flexDirection:"column",overflow:"visible",padding:4,fontFamily:Ut,fontSize:12,color:"#1f2937",pointerEvents:"auto"},og={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"4px 5px 4px 10px",margin:0,fontWeight:600,fontSize:12,overflow:"hidden"},rg={flex:1,overflowY:"auto",padding:0,scrollbarWidth:"none"},ig=`
47
+ `;function Ec({children:e}){return tg(eg,{children:[Qf("style",{children:Zf}),e]})}import{useEffect as ng,useLayoutEffect as og,useRef as rg,useState as kc}from"react";import{createPortal as ig}from"react-dom";import{Fragment as cg,jsx as lg,jsxs as dg}from"react/jsx-runtime";function sg(e){return e.tagName==="STYLE"||e.tagName==="LINK"&&e.rel==="stylesheet"}function ag(e){let t=new Map,n=e.firstChild;function o(s){if(t.has(s)||s.hasAttribute("data-pm-mirror"))return;let a=s.cloneNode(!0);a.setAttribute("data-pm-mirror",""),e.insertBefore(a,n),t.set(s,a)}function r(s){let a=t.get(s);a&&(a.remove(),t.delete(s))}for(let s of document.querySelectorAll('link[rel="stylesheet"], style'))s.getRootNode()===document&&o(s);try{document.adoptedStyleSheets.length>0&&(e.adoptedStyleSheets=[...document.adoptedStyleSheets,...e.adoptedStyleSheets])}catch(s){}let i=new MutationObserver(s=>{for(let a of s)if(a.type==="childList"){for(let l of a.addedNodes)l instanceof Element&&sg(l)&&o(l);for(let l of a.removedNodes)l instanceof Element&&r(l)}});return i.observe(document.head,{childList:!0}),document.body&&i.observe(document.body,{childList:!0}),()=>{i.disconnect();for(let s of t.values())s.remove();t.clear()}}function Tc({children:e}){let t=rg(null),[n,o]=kc(null),[r,i]=kc(null);return og(()=>{let s=t.current;if(!s||s.shadowRoot)return;let a=s.attachShadow({mode:"open"}),l=document.createElement("div");l.setAttribute("data-popmelt-root",""),a.appendChild(l),o(a),i(l)},[]),ng(()=>{if(n)return ag(n)},[n]),dg(cg,{children:[lg("div",{ref:t,"data-popmelt-shadow-host":!0,style:{position:"absolute",width:0,height:0,overflow:"visible",zIndex:1e4}}),r&&ig(e,r)]})}import{memo as yg,useCallback as Tr,useEffect as po,useMemo as Mc,useRef as so,useState as Xn}from"react";import{jsx as Ve,jsxs as tr}from"react/jsx-runtime";var Fs="ui-monospace, SFMono-Regular, Menlo, monospace",ug=0;function pg({size:e=11}){let t=++ug,n=`pm-vs-m${t}`,o=`pm-vs-f0-${t}`,r=`pm-vs-f1-${t}`,i=`pm-vs-g${t}`;return tr("svg",{width:e,height:e,viewBox:"0 0 100 100",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:{display:"inline",verticalAlign:"middle",marginLeft:3,flexShrink:0},children:[Ve("mask",{id:n,maskType:"alpha",maskUnits:"userSpaceOnUse",x:"0",y:"0",width:"100",height:"100",children:Ve("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M70.9119 99.3171C72.4869 99.9307 74.2828 99.8914 75.8725 99.1264L96.4608 89.2197C98.6242 88.1787 100 85.9892 100 83.5872V16.4133C100 14.0113 98.6243 11.8218 96.4609 10.7808L75.8725 0.873756C73.7862 -0.130129 71.3446 0.11576 69.5135 1.44695C69.252 1.63711 69.0028 1.84943 68.769 2.08341L29.3551 38.0415L12.1872 25.0096C10.589 23.7965 8.35363 23.8959 6.86933 25.2461L1.36303 30.2549C-0.452552 31.9064 -0.454633 34.7627 1.35853 36.417L16.2471 50.0001L1.35853 63.5832C-0.454633 65.2374 -0.452552 68.0938 1.36303 69.7453L6.86933 74.7541C8.35363 76.1043 10.589 76.2037 12.1872 74.9905L29.3551 61.9587L68.769 97.9167C69.3925 98.5406 70.1246 99.0104 70.9119 99.3171ZM75.0152 27.2989L45.1091 50.0001L75.0152 72.7012V27.2989Z",fill:"white"})}),tr("g",{mask:`url(#${n})`,children:[Ve("path",{d:"M96.4614 10.7962L75.8569 0.875542C73.4719 -0.272773 70.6217 0.211611 68.75 2.08333L1.29858 63.5832C-0.515693 65.2373 -0.513607 68.0937 1.30308 69.7452L6.81272 74.754C8.29793 76.1042 10.5347 76.2036 12.1338 74.9905L93.3609 13.3699C96.086 11.3026 100 13.2462 100 16.6667V16.4275C100 14.0265 98.6246 11.8378 96.4614 10.7962Z",fill:"#0065A9"}),Ve("g",{filter:`url(#${o})`,children:Ve("path",{d:"M96.4614 89.2038L75.8569 99.1245C73.4719 100.273 70.6217 99.7884 68.75 97.9167L1.29858 36.4169C-0.515693 34.7627 -0.513607 31.9063 1.30308 30.2548L6.81272 25.246C8.29793 23.8958 10.5347 23.7964 12.1338 25.0095L93.3609 86.6301C96.086 88.6974 100 86.7538 100 83.3334V83.5726C100 85.9735 98.6246 88.1622 96.4614 89.2038Z",fill:"#007ACC"})}),Ve("g",{filter:`url(#${r})`,children:Ve("path",{d:"M75.8578 99.1263C73.4721 100.274 70.6219 99.7885 68.75 97.9166C71.0564 100.223 75 98.5895 75 95.3278V4.67213C75 1.41039 71.0564 -0.223106 68.75 2.08329C70.6219 0.211402 73.4721 -0.273666 75.8578 0.873633L96.4587 10.7807C98.6234 11.8217 100 14.0112 100 16.4132V83.5871C100 85.9891 98.6234 88.1786 96.4586 89.2196L75.8578 99.1263Z",fill:"#1F9CF0"})}),Ve("g",{style:{mixBlendMode:"overlay"},opacity:"0.25",children:Ve("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M70.8511 99.3171C72.4261 99.9306 74.2221 99.8913 75.8117 99.1264L96.4 89.2197C98.5634 88.1787 99.9392 85.9892 99.9392 83.5871V16.4133C99.9392 14.0112 98.5635 11.8217 96.4001 10.7807L75.8117 0.873695C73.7255 -0.13019 71.2838 0.115699 69.4527 1.44688C69.1912 1.63705 68.942 1.84937 68.7082 2.08335L29.2943 38.0414L12.1264 25.0096C10.5283 23.7964 8.29285 23.8959 6.80855 25.246L1.30225 30.2548C-0.513334 31.9064 -0.515415 34.7627 1.29775 36.4169L16.1863 50L1.29775 63.5832C-0.515415 65.2374 -0.513334 68.0937 1.30225 69.7452L6.80855 74.754C8.29285 76.1042 10.5283 76.2036 12.1264 74.9905L29.2943 61.9586L68.7082 97.9167C69.3317 98.5405 70.0638 99.0104 70.8511 99.3171ZM74.9544 27.2989L45.0483 50L74.9544 72.7012V27.2989Z",fill:`url(#${i})`})})]}),tr("defs",{children:[tr("filter",{id:o,x:"-8.39411",y:"15.8291",width:"116.727",height:"92.2456",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB",children:[Ve("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),Ve("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"}),Ve("feOffset",{}),Ve("feGaussianBlur",{stdDeviation:"4.16667"}),Ve("feColorMatrix",{type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"}),Ve("feBlend",{mode:"overlay",in2:"BackgroundImageFix",result:"effect1_dropShadow"}),Ve("feBlend",{mode:"normal",in:"SourceGraphic",in2:"effect1_dropShadow",result:"shape"})]}),tr("filter",{id:r,x:"60.4167",y:"-8.07558",width:"47.9167",height:"116.151",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB",children:[Ve("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),Ve("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"}),Ve("feOffset",{}),Ve("feGaussianBlur",{stdDeviation:"4.16667"}),Ve("feColorMatrix",{type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"}),Ve("feBlend",{mode:"overlay",in2:"BackgroundImageFix",result:"effect1_dropShadow"}),Ve("feBlend",{mode:"normal",in:"SourceGraphic",in2:"effect1_dropShadow",result:"shape"})]}),tr("linearGradient",{id:i,x1:"49.9392",y1:"0.257812",x2:"49.9392",y2:"99.7423",gradientUnits:"userSpaceOnUse",children:[Ve("stop",{stopColor:"white"}),Ve("stop",{offset:"1",stopColor:"white",stopOpacity:"0"})]})]})]})}var fg=/^#[0-9a-fA-F]{3,8}$/,gg=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,mg=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]);function hg(e){let t=e.trim();return fg.test(t)||gg.test(t)||mg.has(t.toLowerCase())}function Hs(e,t){return Ve("span",{style:{display:"inline-block",width:10,height:10,backgroundColor:e,border:"1px solid rgba(0,0,0,0.15)",borderRadius:2,verticalAlign:"middle",marginRight:3}},t)}function Wr(e){let t=[],n=/(`[^`]+`)|(\*\*\*(.+?)\*\*\*)|(\*\*(.+?)\*\*)|(\*(.+?)\*)|(_([^_]+?)_)|(\[([^\]]+)\]\(([^)]+)\))|(#[0-9a-fA-F]{3,8})(?![0-9a-fA-F])|((?:rgba?|hsla?|oklch)\([^)]+\))/g,o=0,r;for(;(r=n.exec(e))!==null;){if(r.index>o&&t.push(e.slice(o,r.index)),r[1]){let i=r[1].slice(1,-1);hg(i)&&t.push(Hs(i,`sw-${r.index}`)),t.push(Ve("code",{style:{fontFamily:Fs,fontSize:"0.9em",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2},children:i},r.index))}else if(r[3]!==void 0)t.push(Ve("strong",{children:Ve("em",{children:r[3]})},r.index));else if(r[5]!==void 0)t.push(Ve("strong",{children:r[5]},r.index));else if(r[7]!==void 0)t.push(Ve("em",{children:r[7]},r.index));else if(r[9]!==void 0)t.push(Ve("em",{children:r[9]},r.index));else if(r[11]!==void 0&&r[12]!==void 0){let i=r[12],s=!/^https?:\/\/|^mailto:/i.test(i),a=s?`vscode://file/${i}`:i;s?t.push(tr("a",{href:a,target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline",whiteSpace:"nowrap",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2,fontFamily:Fs,fontSize:"0.9em"},children:[r[11],Ve(pg,{})]},r.index)):t.push(Ve("a",{href:a,target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline"},children:r[11]},r.index))}else r[13]!==void 0?(t.push(Hs(r[13],`sw-${r.index}`)),t.push(r[13])):r[14]!==void 0&&(t.push(Hs(r[14],`sw-${r.index}`)),t.push(r[14]));o=r.index+r[0].length}return o<e.length&&t.push(e.slice(o)),t}function uo(e){var r;let t=e.split(`
48
+ `),n=[],o=0;for(;o<t.length;){let i=t[o];if(i.trimStart().startsWith("```")){let d=[];for(o++;o<t.length&&!t[o].trimStart().startsWith("```");)d.push(t[o]),o++;o++,n.push(Ve("pre",{style:{fontFamily:Fs,fontSize:"0.9em",lineHeight:1.4,backgroundColor:"rgba(0,0,0,0.04)",padding:"6px 8px",margin:"4px 0",overflowX:"auto",whiteSpace:"pre"},children:d.join(`
49
+ `)},n.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(i)){n.push(Ve("hr",{style:{border:"none",borderTop:"1px solid rgba(0,0,0,0.1)",margin:"6px 0"}},n.length)),o++;continue}let s=i.match(/^(#{1,4})\s+(.+)/);if(s){let d=s[1].length,c={1:16,2:14,3:13,4:12};n.push(Ve("div",{style:{fontWeight:700,fontSize:(r=c[d])!=null?r:12,margin:"8px 0 2px"},children:Wr(s[2])},n.length)),o++;continue}if(i.trimStart().startsWith("|")&&i.trimEnd().endsWith("|")){let d=[];for(;o<t.length&&t[o].trimStart().startsWith("|")&&t[o].trimEnd().endsWith("|");)d.push(t[o]),o++;let c=T=>/^\|[\s\-:|]+\|$/.test(T),p=d.filter(T=>!c(T)),u=T=>T.split("|").slice(1,-1).map(z=>z.trim()),g=T=>/^\*\*.+\*\*$/.test(T)||/^__.+__$/.test(T),b=p.map(u),x=b.length>1&&b.slice(1).every(T=>T[0]&&g(T[0])),A=b.length>0&&b[0].every(T=>g(T));n.push(Ve("div",{style:{overflowX:"auto",margin:"4px 0",paddingBottom:4},children:Ve("table",{style:{borderCollapse:"separate",borderSpacing:0,fontSize:"0.95em",width:"max-content",minWidth:"100%"},children:Ve("tbody",{children:p.map((T,z)=>Ve("tr",{children:u(T).map((P,O)=>Ve(z===0?"th":"td",{style:f({border:"1px solid rgba(0,0,0,0.1)",padding:"3px 6px",textAlign:"left",fontWeight:z===0?600:400,minWidth:60,whiteSpace:"nowrap"},O===0&&x||z===0&&A?h(f(f({position:"sticky"},O===0&&x?{left:0}:{}),z===0&&A?{top:0}:{}),{background:"#fff",zIndex:O===0&&x&&z===0&&A?2:1}):{}),children:Wr(P)},O))},z))})})},n.length));continue}if(i.match(/^(\s*)([-*])\s+(.+)/)){let d=[];for(;o<t.length;){let c=t[o].match(/^\s*[-*]\s+(.+)/);if(c)d.push(c[1]),o++;else if(d.length>0&&t[o].match(/^\s+\S/)&&!t[o].match(/^\s*\d+\.\s/)&&!t[o].match(/^\s*[-*]\s+/))d[d.length-1]+=" "+t[o].trim(),o++;else break}n.push(Ve("ul",{style:{margin:0,paddingLeft:20,listStyleType:"disc",display:"flex",flexDirection:"column",gap:8},children:d.map((c,p)=>Ve("li",{children:Wr(c)},p))},n.length));continue}if(i.match(/^(\s*)\d+\.\s+(.+)/)){let d=[];for(;o<t.length;){let c=t[o].match(/^\s*\d+\.\s+(.+)/);if(c)d.push(c[1]),o++;else if(d.length>0&&t[o].match(/^\s+\S/)&&!t[o].match(/^\s*\d+\.\s/)&&!t[o].match(/^\s*[-*]\s+/))d[d.length-1]+=" "+t[o].trim(),o++;else break}n.push(Ve("ol",{style:{margin:0,paddingLeft:20,listStyleType:"decimal",display:"flex",flexDirection:"column",gap:8},children:d.map((c,p)=>Ve("li",{children:Wr(c)},p))},n.length));continue}if(i.trim()===""){o++;continue}n.push(Ve("div",{children:Wr(i)},n.length)),o++}return Ve("div",{style:{display:"flex",flexDirection:"column",gap:8},children:n})}import{Fragment as Ro,jsx as se,jsxs as dt}from"react/jsx-runtime";var Rc=400,Rn=16,Ac=3,bg=3,Pc=4,xg=8,$s="devtools-thread-panel-position",Mr=Rc+2*Ac+2*Pc,vg=Mr+2*bg;function zs(){return{top:Rn,left:window.innerWidth-Mr-Rn}}function Ic(e,t,n){let o=n==null?void 0:n.getBoundingClientRect(),r=2*Ac+2*Pc,i=window.innerHeight-Rn-r;return o&&t+vg>o.left&&(i=o.top-xg-r),Math.max(200,i-Math.max(0,e))}var Sg={width:Rc,backgroundColor:"#eaeaea",borderWidth:3,borderStyle:"solid",borderColor:"transparent",boxSizing:"content-box",display:"flex",flexDirection:"column",overflow:"visible",padding:4,fontFamily:Qt,fontSize:12,color:"#1f2937",pointerEvents:"auto"},wg={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"4px 5px 4px 10px",margin:0,fontWeight:600,fontSize:12,overflow:"hidden"},Cg={flex:1,overflowY:"auto",padding:0,scrollbarWidth:"none"},Eg=`
50
50
  [data-devtools="thread-panel-messages"]:hover {
51
51
  scrollbar-width: thin !important;
52
52
  }
@@ -60,11 +60,11 @@ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{
60
60
  background: rgba(0,0,0,0.15);
61
61
  border-radius: 3px;
62
62
  }
63
- `,sg={borderTop:"1px solid rgba(0, 0, 0, 0.12)",display:"flex",alignItems:"center",gap:4,padding:"0 8px 0 10px"};function Os(e){return e.replace(/<resolution>[\s\S]*?<\/resolution>/g,"").replace(/<question>[\s\S]*?<\/question>/g,"").replace(/<plan>[\s\S]*?<\/plan>/g,"").replace(/<review>[\s\S]*?<\/review>/g,"").trim()}function lc(e){return new Date(e).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var Bs=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],lg=3e3,ag=250;function cg({color:e}){let[t,n]=Nn(0),[r,o]=Nn(()=>Math.floor(Math.random()*Bs.length));return Zn(()=>{let i=setInterval(()=>n(l=>(l+1)%2),ag),s=setInterval(()=>o(l=>(l+1)%Bs.length),lg);return()=>{clearInterval(i),clearInterval(s)}},[]),ft("span",{style:{display:"inline-flex",alignItems:"center",gap:4},children:[fe("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?ft(_o,{children:[fe("circle",{cx:"7",cy:"7",r:"2"}),fe("circle",{cx:"17",cy:"7",r:"2"}),fe("circle",{cx:"7",cy:"17",r:"2"}),fe("circle",{cx:"17",cy:"17",r:"2"})]}):ft(_o,{children:[fe("circle",{cx:"12",cy:"6",r:"2"}),fe("circle",{cx:"6",cy:"12",r:"2"}),fe("circle",{cx:"18",cy:"12",r:"2"}),fe("circle",{cx:"12",cy:"18",r:"2"})]})}),fe("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:Bs[r]})]})}var mi=32,gi={width:mi,height:mi,objectFit:"cover",cursor:"pointer",border:"1px solid rgba(0,0,0,0.1)"};function dg(e){let t=/^`(\/[^`]*)`$/gm,n=[...e.matchAll(t)];if(n.length===0)return null;let r=[];for(let o=0;o<n.length;o++){let i=n[o],s=i[1],l=i.index+i[0].length,a=o+1<n.length?n[o+1].index:e.length,d=e.slice(l,a).trim();r.push({route:s,text:d})}return r}function ug(e,t){let n=[];if(e.replyImageUrls)for(let r of e.replyImageUrls){let o=r.startsWith("blob:")||r.startsWith("http")?r:`${t}${r}`;n.push({url:o,label:"pasted image"})}return n}function pg(e,t){let n=[];if(e.imageUrls)for(let[,r]of Object.entries(e.imageUrls))for(let o of r)n.push({url:`${t}${o}`,label:"pasted image"});return n}function fg({src:e,onClose:t}){return Zn(()=>{let n=r=>{r.key==="Escape"&&(r.stopPropagation(),t())};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[t]),fe("div",{onClick:t,style:{position:"fixed",inset:0,zIndex:1e5,backgroundColor:"rgba(0,0,0,0.8)",display:"flex",alignItems:"center",justifyContent:"center",cursor:"zoom-out"},children:fe("img",{src:e,onClick:n=>n.stopPropagation(),style:{maxWidth:"90vw",maxHeight:"90vh",objectFit:"contain",cursor:"default",boxShadow:"0 4px 24px rgba(0,0,0,0.4)"}})})}function gg(e){var i;let t=String(e.data.tool||""),n=e.data.file?String(e.data.file):null,r=n?(i=n.split("/").pop())!=null?i:n:null,o=e.data.content?String(e.data.content):null;switch(t){case"Read":return r?`Reading ${r}`:"Reading file";case"Edit":return r?`Editing ${r}`:"Editing file";case"Write":return r?`Writing ${r}`:"Writing file";case"Bash":return o?mg(o):"Running command";case"Glob":return"Searching files";case"Grep":return"Searching code";case"WebFetch":return"Fetching page";case"WebSearch":return"Searching web";default:return t?`Using ${t}`:null}}function mg(e){let t=e.split(`
64
- `)[0].trim();return t.length<=60?t:t.slice(0,57)+"\u2026"}var hg=new Set(["Read","Glob","Grep","WebFetch","WebSearch"]),yg=new Set(["Edit","Write","Bash"]);function bg(e){let t=0,n=!1;for(let r of e){if(r.type!=="tool_use")continue;let o=String(r.data.tool||"");yg.has(o)?n=!0:hg.has(o)&&t++}return!n&&t>=3?"researching":n?"applying changes":null}function xg(e){var n;let t=[];for(let r of e)if(r.type==="tool_use"){let o=gg(r),i=String(r.data.tool||""),s=r.data.file?String(r.data.file):null,l=r.data.content?String(r.data.content):null,a=(n=s!=null?s:l)!=null?n:void 0;if(o){let d=t[t.length-1];d&&d.kind==="tool_group"&&d.tool===i?d.items.push({label:o,detail:a}):t.push({kind:"tool_group",tool:i,items:[{label:o,detail:a}]})}if(l&&s){let d=s.includes(".")?`.${s.split(".").pop().toLowerCase()}`:"",c=s.includes(".claude/plans/");t.push({kind:"file_content",file:s,content:l,ext:d,isPlan:c})}}else if(r.type==="delta"){let o=String(r.data.text||"");if(!o)continue;let i=t[t.length-1];i&&i.kind==="text"?i.text+=o:t.push({kind:"text",text:o})}else if(r.type==="thinking"){let o=String(r.data.text||"");if(!o)continue;let i=t[t.length-1];i&&i.kind==="thinking"?i.text+=o:t.push({kind:"thinking",text:o})}return t}function vg({file:e,content:t,ext:n,isPlan:r,onAccept:o}){var d;let[i,s]=Nn(r),l=(d=e.split("/").pop())!=null?d:e;return ft("div",{style:{margin:"4px 0 4px 12px",border:"1px solid rgba(0,0,0,0.08)",backgroundColor:"rgba(255,255,255,0.6)",fontSize:11},children:[ft("div",{onClick:()=>s(c=>!c),style:{display:"flex",alignItems:"center",gap:6,padding:"4px 8px",cursor:"pointer",userSelect:"none",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",color:"#374151"},children:[fe("span",{style:{fontSize:9,color:"#9ca3af"},children:i?"\u25BC":"\u25B6"}),fe("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:l}),r&&fe("span",{style:{fontSize:9,color:"#6366f1",fontFamily:"inherit"},children:"plan"})]}),i&&ft(_o,{children:[fe("div",{style:{maxHeight:300,overflowY:"auto",padding:"6px 10px",borderTop:"1px solid rgba(0,0,0,0.06)",lineHeight:1.5,wordBreak:"break-word"},children:n===".md"?qn(t):fe("pre",{style:{margin:0,fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,whiteSpace:"pre-wrap"},children:t})}),r&&o&&fe("div",{style:{padding:"4px 8px",borderTop:"1px solid rgba(0,0,0,0.06)",display:"flex",justifyContent:"flex-end"},children:fe("button",{onClick:c=>{c.stopPropagation(),o()},style:{background:"#111",color:"#fff",border:"none",padding:"4px 12px",fontSize:11,cursor:"pointer",fontFamily:"inherit"},children:"Accept"})})]})]})}function Sg(e){let t=[];for(let n of e){let r=t[t.length-1];r&&r.val===n?r.count++:t.push({val:n,count:1})}return t.map(n=>n.count>1?`${n.val} (x${n.count})`:n.val)}function wg(e,t){switch(e){case"Bash":{let n=t.map(r=>(r.label||"").split(/\s/)[0]).filter(Boolean);return`Used Bash: ${Sg(n).join(", ")}`}case"Read":return`Read: ${t.map(n=>n.label.replace(/^Reading /,"")).join(", ")}`;case"Edit":return`Edited: ${t.map(n=>n.label.replace(/^Editing /,"")).join(", ")}`;case"Write":return`Wrote: ${t.map(n=>n.label.replace(/^Writing /,"")).join(", ")}`;case"Grep":return t.length===1?"Searched code":`Searched code (${t.length})`;case"Glob":return t.length===1?"Searched files":`Searched files (${t.length})`;default:return`Used ${e}: ${t.map(n=>n.label).join(", ")}`}}var Cg={fontSize:11,color:"#9ca3af",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",lineHeight:1.6};function kg({label:e}){let t=e.indexOf(" ");return t===-1?fe(_o,{children:e}):ft(_o,{children:[fe("b",{children:e.slice(0,t)}),e.slice(t)]})}function ac({tool:e,items:t}){let[n,r]=Nn(!1),o=t.length>1;return ft("div",{style:Cg,children:[ft("div",{onClick:o?()=>r(i=>!i):void 0,style:{cursor:o?"pointer":"default",userSelect:"none",color:"#9ca3af"},children:[o&&fe("span",{style:{fontSize:13,marginRight:4},children:n?"\u25BE":"\u25B8"}),wg(e,t)]}),n&&fe("div",{style:{marginLeft:17},children:t.map((i,s)=>{var l;return fe("div",{children:fe(kg,{label:(l=i.detail)!=null?l:i.label})},s)})})]})}function pc({threadId:e,bridgeUrl:t,accentColor:n,isStreaming:r,streamingEvents:o,onClose:i,onReply:s,onCancel:l,lastError:a,onMouseEnter:d,toolbarRef:c,currentModel:u,currentProvider:p,annotationNumber:g,annotationText:w}){let[C,R]=Nn([]),[P,G]=Nn(!0),[M,T]=Nn(""),[x,N]=Nn([]),[W,_]=Nn(!1),[H,V]=Nn(!0),[k,A]=Nn(0),[Q,ie]=Nn(null),pe=lo(null),be=lo(null),me=lo(null),We=lo(r),Ce=lo(Ps()),oe=lo({x:0,y:0}),_e=lo(!1),Ne=lo({x:0,y:0,offsetX:0,offsetY:0}),je=lo(!0),[,Fe]=Nn(0);Zn(()=>{try{let h=localStorage.getItem(As);if(h){let z=JSON.parse(h);if(typeof z.top=="number"&&typeof z.left=="number"){let te=window.innerWidth-ar-En,se={top:Math.max(En,Math.min(z.top,window.innerHeight-En-200)),left:Math.max(En,Math.min(z.left,te))};je.current=se.left>=te-2,Ce.current=se,Fe(ke=>ke+1)}}}catch(h){}},[]),Zn(()=>{let h=()=>{if(je.current)Ce.current=Ps();else{let z=Ce.current,te=window.innerWidth-ar-En;Ce.current={top:Math.max(En,Math.min(z.top,window.innerHeight-En-200)),left:Math.max(En,Math.min(z.left,te))}}Fe(z=>z+1)};return window.addEventListener("resize",h,{passive:!0}),()=>window.removeEventListener("resize",h)},[]),Zn(()=>{let h=me.current;if(!h)return;let z=ye=>{ye.button!==0||ye.target.closest("button")||(ye.preventDefault(),ye.stopPropagation(),_e.current=!0,Ne.current={x:ye.clientX,y:ye.clientY,offsetX:oe.current.x,offsetY:oe.current.y})},te=ye=>{if(!_e.current)return;let ae=Ne.current,de=ae.offsetX+(ye.clientX-ae.x),ue=ae.offsetY+(ye.clientY-ae.y),Ye=Math.max(En,Math.min(window.innerWidth-ar-En,Ce.current.left+de)),qe=Math.max(En,Ce.current.top+ue);oe.current={x:Ye-Ce.current.left,y:qe-Ce.current.top};let st=be.current;st&&(st.style.top=`${qe}px`,st.style.left=`${Ye}px`,st.style.height=`${sc(qe,Ye,c==null?void 0:c.current)}px`)},se=()=>{if(!_e.current)return;let ye=Ce.current.top+oe.current.y,ae=Ce.current.left+oe.current.x;Ce.current={top:ye,left:ae},oe.current={x:0,y:0};let de=window.innerWidth-ar-En;je.current=ae>=de-2;try{localStorage.setItem(As,JSON.stringify({top:ye,left:ae}))}catch(ue){}_e.current=!1},ke=()=>{Ce.current=Ps(),oe.current={x:0,y:0},je.current=!0;try{localStorage.removeItem(As)}catch(ye){}Fe(ye=>ye+1)};return h.addEventListener("mousedown",z),window.addEventListener("mousemove",te),window.addEventListener("mouseup",se),h.addEventListener("dblclick",ke),()=>{h.removeEventListener("mousedown",z),window.removeEventListener("mousemove",te),window.removeEventListener("mouseup",se),h.removeEventListener("dblclick",ke)}},[]);let Ie=fi(()=>{fetch(`${t}/thread/${e}`).then(h=>h.json()).then(h=>{var z;R((z=h.messages)!=null?z:[]),G(!1)}).catch(()=>G(!1))},[t,e]);Zn(()=>{G(!0),Ie()},[Ie]),Zn(()=>{We.current&&!r&&Ie(),We.current=r},[r,Ie]);let ct=o?xg(o):[],wt=o?bg(o):null;Zn(()=>{let h=pe.current;if(!h)return;let z=()=>{V(h.scrollHeight-h.scrollTop-h.clientHeight<40);let se=h.scrollTop+h.clientHeight,ke=h.querySelectorAll("[data-msg]"),ye=0;for(let ae=0;ae<ke.length;ae++){let de=ke[ae];de.offsetTop+de.offsetHeight>se+20&&ye++}A(ye)};return h.addEventListener("scroll",z,{passive:!0}),()=>h.removeEventListener("scroll",z)},[]),Zn(()=>{H&&pe.current&&(pe.current.scrollTop=pe.current.scrollHeight)},[C,ct.length,r,H]),Zn(()=>{let h=z=>{z.key==="Escape"&&(z.stopPropagation(),i())};return document.addEventListener("keydown",h),()=>document.removeEventListener("keydown",h)},[i]);let Pe=fi(()=>{if(!M.trim()||!s)return;let h=M.trim(),z=x.length>0?x:void 0,te=z?z.map(se=>URL.createObjectURL(se)):void 0;R(se=>[...se,f({role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:h},te?{replyImageUrls:te}:{})]),s(e,h,z),T(""),N([])},[M,x,e,s]),Tt=fi(h=>{let z=h.clipboardData.items,te=[];for(let se=0;se<z.length;se++){let ke=z[se];if(ke.type.startsWith("image/")){let ye=ke.getAsFile();ye&&te.push(ye)}}te.length>0&&(h.preventDefault(),N(se=>[...se,...te]))},[]),nt=fi(h=>{h.key==="Enter"&&(h.metaKey||h.ctrlKey)&&(h.preventDefault(),Pe())},[Pe]),Lt=Ce.current.top+oe.current.y,Mt=Ce.current.left+oe.current.x,Oe=sc(Lt,Mt,c==null?void 0:c.current);return ft(_o,{children:[fe("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:h=>{h.target===h.currentTarget&&i()},style:{position:"fixed",inset:0,zIndex:9999}}),ft("div",{ref:be,style:y(f({},ng),{height:Oe,position:"fixed",top:Lt,left:Mt,zIndex:1e4}),"data-devtools":"thread-panel",onMouseEnter:d,children:[(()=>{let z=`<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='${r?n:"rgb(0,0,0)"}' stroke-width='.75'/></svg>`,te=`url("data:image/svg+xml,${encodeURIComponent(z)}")`;return ft(_o,{children:[fe("style",{children:`@keyframes popmelt-border-march { to { background-position: 0 -5px; } }
65
- [data-popmelt-reply]::placeholder { opacity: 0.35; }`}),fe("div",{style:f({position:"absolute",inset:-3,padding:5,backgroundImage:te,backgroundSize:"5px 5px",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",maskComposite:"exclude",pointerEvents:"none"},r&&{animation:"popmelt-border-march 0.8s linear infinite"})})]})})(),ft("div",{style:{display:"flex",flexDirection:"column",overflow:"hidden",flex:1,minHeight:0},children:[ft("div",{ref:me,style:y(f({},og),{backgroundColor:n,color:"#ffffff",cursor:"grab",userSelect:"none",WebkitUserSelect:"none"}),children:[ft("span",{style:{display:"flex",alignItems:"center",gap:3,minWidth:0},children:[fe("span",{style:{flexShrink:0},children:g?`${g}.`:"Conversation"}),w&&fe("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:w})]}),fe("button",{onClick:i,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),fe("style",{dangerouslySetInnerHTML:{__html:ig+`
63
+ `,kg={borderTop:"1px solid rgba(0, 0, 0, 0.12)",display:"flex",alignItems:"center",gap:4,padding:"0 8px 0 10px"};function Gs(e){return e.replace(/<resolution>[\s\S]*?<\/resolution>/g,"").replace(/<question>[\s\S]*?<\/question>/g,"").replace(/<plan>[\s\S]*?<\/plan>/g,"").replace(/<review>[\s\S]*?<\/review>/g,"").replace(/<novel>[\s\S]*?<\/novel>/g,"").trim()}function Tg(e){let t=e.match(/<novel>\s*([\s\S]*?)\s*<\/novel>/);if(!(t!=null&&t[1]))return[];try{let n=JSON.parse(t[1]);return Array.isArray(n)?n.filter(o=>{if(typeof o!="object"||o===null)return!1;let r=o;return typeof r.category=="string"&&typeof r.element=="string"&&typeof r.decision=="string"&&typeof r.reason=="string"}):[]}catch(n){return[]}}function Lc(e){return new Date(e).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var Ws=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Mg=3e3,Ig=250;function Lg({color:e}){let[t,n]=Xn(0),[o,r]=Xn(()=>Math.floor(Math.random()*Ws.length));return po(()=>{let i=setInterval(()=>n(a=>(a+1)%2),Ig),s=setInterval(()=>r(a=>(a+1)%Ws.length),Mg);return()=>{clearInterval(i),clearInterval(s)}},[]),dt("span",{style:{display:"inline-flex",alignItems:"center",gap:4},children:[se("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?dt(Ro,{children:[se("circle",{cx:"7",cy:"7",r:"2"}),se("circle",{cx:"17",cy:"7",r:"2"}),se("circle",{cx:"7",cy:"17",r:"2"}),se("circle",{cx:"17",cy:"17",r:"2"})]}):dt(Ro,{children:[se("circle",{cx:"12",cy:"6",r:"2"}),se("circle",{cx:"6",cy:"12",r:"2"}),se("circle",{cx:"18",cy:"12",r:"2"}),se("circle",{cx:"12",cy:"18",r:"2"})]})}),se("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:Ws[o]})]})}var Li=32,Ii={width:Li,height:Li,objectFit:"cover",cursor:"pointer",border:"1px solid rgba(0,0,0,0.1)"};function Rg(e){let t=/^`(\/[^`]*)`$/gm,n=[...e.matchAll(t)];if(n.length===0)return null;let o=[];for(let r=0;r<n.length;r++){let i=n[r],s=i[1],a=i.index+i[0].length,l=r+1<n.length?n[r+1].index:e.length,d=e.slice(a,l).trim();o.push({route:s,text:d})}return o}function Ag(e,t){let n=[];if(e.replyImageUrls)for(let o of e.replyImageUrls){let r=o.startsWith("blob:")||o.startsWith("http")?o:`${t}${o}`;n.push({url:r,label:"pasted image"})}return n}function Pg(e,t){let n=[];if(e.imageUrls)for(let[,o]of Object.entries(e.imageUrls))for(let r of o)n.push({url:`${t}${r}`,label:"pasted image"});return n}function Og({src:e,onClose:t}){return po(()=>{let n=o=>{o.key==="Escape"&&(o.stopPropagation(),t())};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[t]),se("div",{onClick:t,style:{position:"fixed",inset:0,zIndex:1e5,backgroundColor:"rgba(0,0,0,0.8)",display:"flex",alignItems:"center",justifyContent:"center",cursor:"zoom-out"},children:se("img",{src:e,onClick:n=>n.stopPropagation(),style:{maxWidth:"90vw",maxHeight:"90vh",objectFit:"contain",cursor:"default",boxShadow:"0 4px 24px rgba(0,0,0,0.4)"}})})}function Bg(e){var i;let t=String(e.data.tool||""),n=e.data.file?String(e.data.file):null,o=n?(i=n.split("/").pop())!=null?i:n:null,r=e.data.content?String(e.data.content):null;switch(t){case"Read":return o?`Reading ${o}`:"Reading file";case"Edit":return o?`Editing ${o}`:"Editing file";case"Write":return o?`Writing ${o}`:"Writing file";case"Bash":return r?Dg(r):"Running command";case"Glob":return"Searching files";case"Grep":return"Searching code";case"WebFetch":return"Fetching page";case"WebSearch":return"Searching web";default:return t?`Using ${t}`:null}}function Dg(e){let t=e.split(`
64
+ `)[0].trim();return t.length<=60?t:t.slice(0,57)+"\u2026"}var _g=new Set(["Read","Glob","Grep","WebFetch","WebSearch"]),Ng=new Set(["Edit","Write","Bash"]);function Hg(e){let t=0,n=!1;for(let o of e){if(o.type!=="tool_use")continue;let r=String(o.data.tool||"");Ng.has(r)?n=!0:_g.has(r)&&t++}return!n&&t>=3?"researching":n?"applying changes":null}function Fg(e){var n;let t=[];for(let o of e)if(o.type==="tool_use"){let r=Bg(o),i=String(o.data.tool||""),s=o.data.file?String(o.data.file):null,a=o.data.content?String(o.data.content):null,l=(n=s!=null?s:a)!=null?n:void 0;if(r){let d=t[t.length-1];d&&d.kind==="tool_group"&&d.tool===i?d.items.push({label:r,detail:l}):t.push({kind:"tool_group",tool:i,items:[{label:r,detail:l}]})}if(a&&s){let d=s.includes(".")?`.${s.split(".").pop().toLowerCase()}`:"",c=s.includes(".claude/plans/");t.push({kind:"file_content",file:s,content:a,ext:d,isPlan:c})}}else if(o.type==="delta"){let r=String(o.data.text||"");if(!r)continue;let i=t[t.length-1];i&&i.kind==="text"?i.text+=r:t.push({kind:"text",text:r})}else if(o.type==="thinking"){let r=String(o.data.text||"");if(!r)continue;let i=t[t.length-1];i&&i.kind==="thinking"?i.text+=r:t.push({kind:"thinking",text:r})}return t}function $g({file:e,content:t,ext:n,isPlan:o,onAccept:r}){var d;let[i,s]=Xn(o),a=(d=e.split("/").pop())!=null?d:e;return dt("div",{style:{margin:"4px 0 4px 12px",border:"1px solid rgba(0,0,0,0.08)",backgroundColor:"rgba(255,255,255,0.6)",fontSize:11},children:[dt("div",{onClick:()=>s(c=>!c),style:{display:"flex",alignItems:"center",gap:6,padding:"4px 8px",cursor:"pointer",userSelect:"none",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",color:"#374151"},children:[se("span",{style:{fontSize:9,color:"#9ca3af"},children:i?"\u25BC":"\u25B6"}),se("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:a}),o&&se("span",{style:{fontSize:9,color:"#6366f1",fontFamily:"inherit"},children:"plan"})]}),i&&dt(Ro,{children:[se("div",{style:{maxHeight:300,overflowY:"auto",padding:"6px 10px",borderTop:"1px solid rgba(0,0,0,0.06)",lineHeight:1.5,wordBreak:"break-word"},children:n===".md"?uo(t):se("pre",{style:{margin:0,fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,whiteSpace:"pre-wrap"},children:t})}),o&&r&&se("div",{style:{padding:"4px 8px",borderTop:"1px solid rgba(0,0,0,0.06)",display:"flex",justifyContent:"flex-end"},children:se("button",{onClick:c=>{c.stopPropagation(),r()},style:{background:"#111",color:"#fff",border:"none",padding:"4px 12px",fontSize:11,cursor:"pointer",fontFamily:"inherit"},children:"Accept"})})]})]})}function zg(e){let t=[];for(let n of e){let o=t[t.length-1];o&&o.val===n?o.count++:t.push({val:n,count:1})}return t.map(n=>n.count>1?`${n.val} (x${n.count})`:n.val)}function Wg(e,t){switch(e){case"Bash":{let n=t.map(o=>(o.label||"").split(/\s/)[0]).filter(Boolean);return`Used Bash: ${zg(n).join(", ")}`}case"Read":return`Read: ${t.map(n=>n.label.replace(/^Reading /,"")).join(", ")}`;case"Edit":return`Edited: ${t.map(n=>n.label.replace(/^Editing /,"")).join(", ")}`;case"Write":return`Wrote: ${t.map(n=>n.label.replace(/^Writing /,"")).join(", ")}`;case"Grep":return t.length===1?"Searched code":`Searched code (${t.length})`;case"Glob":return t.length===1?"Searched files":`Searched files (${t.length})`;default:return`Used ${e}: ${t.map(n=>n.label).join(", ")}`}}var Gg={fontSize:11,color:"#9ca3af",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",lineHeight:1.6};function jg({label:e}){let t=e.indexOf(" ");return t===-1?se(Ro,{children:e}):dt(Ro,{children:[se("b",{children:e.slice(0,t)}),e.slice(t)]})}function Oc({tool:e,items:t}){let[n,o]=Xn(!1),r=t.length>1;return dt("div",{style:Gg,children:[dt("div",{onClick:r?()=>o(i=>!i):void 0,style:{cursor:r?"pointer":"default",userSelect:"none",color:"#9ca3af"},children:[r&&se("span",{style:{fontSize:13,marginRight:4},children:n?"\u25BE":"\u25B8"}),Wg(e,t)]}),n&&se("div",{style:{marginLeft:17},children:t.map((i,s)=>{var a;return se("div",{children:se(jg,{label:(a=i.detail)!=null?a:i.label})},s)})})]})}var Yg=yg(function({msg:t,index:n,bridgeUrl:o,accentColor:r,onLightbox:i}){let s=t.role==="human";if(t.cancelled||t.error)return dt("div",{"data-msg":!0,style:{padding:16,display:"flex",flexDirection:"column",gap:8},children:[dt("div",{style:{display:"flex",alignItems:"center",gap:4},children:[se("span",{style:{fontSize:11,color:t.error?"#dc2626":"#9ca3af",fontStyle:"italic"},children:t.error?"Error":"Cancelled"}),se("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:Lc(t.timestamp)})]}),t.error&&se("div",{style:{fontSize:12,color:"#6b7280",lineHeight:1.4},children:t.error})]},`${t.jobId}-${n}`);let a=s?t.replyToQuestion||t.feedbackSummary||"(annotation)":Gs(t.responseText||""),l=s?void 0:t.question,d=!s&&t.resolutions&&t.resolutions.length>0,c=!s&&t.segments&&t.segments.length>0,p=!s&&!c&&t.toolsUsed&&t.toolsUsed.length>0;return!a&&!l&&!d&&!c?null:dt("div",{"data-msg":!0,style:{padding:16,display:"flex",flexDirection:"column",gap:8},children:[dt("div",{style:{display:"flex",alignItems:"center",gap:4},children:[!s&&se(Fr,{provider:t.provider,size:11,style:{color:"#6b7280"}}),se("span",{style:{fontWeight:600,fontSize:11,color:s?r:"#6b7280"},children:s?"You":Ps(t.model,t.provider)}),se("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:Lc(t.timestamp)})]}),s&&!t.replyToQuestion&&(()=>{let u=a?Rg(a):null;if(u&&t.screenshotUrls)return se("div",{style:{display:"flex",flexDirection:"column",gap:4},children:u.map((b,x)=>{var z;let A=(z=t.screenshotUrls)==null?void 0:z[b.route],T=A?`${o}${A}`:null;return dt("div",{style:{display:"flex",gap:6,alignItems:"flex-start"},children:[T?se("img",{src:T,title:b.route,style:h(f({},Ii),{flexShrink:0,marginTop:1}),onClick:()=>i(T)}):se("div",{style:{width:Li,height:Li,flexShrink:0}}),dt("div",{style:{lineHeight:1.5,wordBreak:"break-word",minWidth:0},children:[se("code",{style:{fontSize:10,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px"},children:b.route}),b.text&&se("div",{style:{marginTop:2},children:uo(b.text)})]})]},x)})});let g=t.screenshotUrl?`${o}${t.screenshotUrl}`:null;return g&&a?dt("div",{style:{display:"flex",gap:6,alignItems:"flex-start"},children:[se("img",{src:g,title:"screenshot",style:h(f({},Ii),{flexShrink:0,marginTop:1}),onClick:()=>i(g)}),se("div",{style:{lineHeight:1.5,wordBreak:"break-word",minWidth:0},children:a.includes(`
65
+ `)?uo(a):a})]}):a?se("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:a.includes(`
66
+ `)?uo(a):a}):null})(),s&&t.replyToQuestion&&a&&se("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:a.includes(`
67
+ `)?uo(a):a}),!s&&c&&t.segments.map((u,g)=>{if(u.kind==="tool_group")return se(Oc,{tool:u.tool,items:u.items},g);let b=Gs(u.text);return b?se("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:uo(b)},g):null}),!s&&!c&&a&&se("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:uo(a)}),s&&t.replyToQuestion&&(()=>{let u=Ag(t,o);return u.length===0?null:se("div",{style:{display:"flex",gap:4,flexWrap:"wrap",marginTop:6},children:u.map((g,b)=>se("img",{src:g.url,title:g.label,style:Ii,onClick:()=>i(g.url)},b))})})(),s&&!t.replyToQuestion&&(()=>{let u=Pg(t,o);return u.length===0?null:se("div",{style:{display:"flex",gap:4,flexWrap:"wrap",marginTop:6},children:u.map((g,b)=>se("img",{src:g.url,title:g.label,style:Ii,onClick:()=>i(g.url)},b))})})(),l&&se("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:uo(l)}),(p||d)&&dt("div",{style:{padding:"8px 16px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#374151"},children:[p&&se("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:t.toolsUsed.map((u,g)=>se("div",{children:u},g))}),d&&t.resolutions.map((u,g)=>{var x;let b=(x=u.finalScope)!=null?x:u.inferredScope;return dt("div",{style:{marginTop:p?4:0},children:[se("span",{style:{color:u.status==="resolved"?"#10b981":"#f59e0b"},children:u.status==="resolved"?"Done":"Needs review"}),u.summary?` \u2014 ${u.summary}`:""]},g)})]}),!s&&t.responseText&&(()=>{let u=Tg(t.responseText);return u.length===0?null:se("div",{style:{padding:"8px 16px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#374151",marginTop:2},children:u.map((g,b)=>dt("div",{style:{marginTop:b>0?6:0},children:[se("span",{style:{display:"inline-block",backgroundColor:"#8b5cf6",color:"#fff",fontSize:9,fontWeight:600,textTransform:"uppercase",padding:"1px 5px",borderRadius:3,marginRight:6,verticalAlign:"middle"},children:g.category}),se("strong",{children:g.element})," \u2014 ",g.decision,se("div",{style:{color:"#9ca3af",fontStyle:"italic",marginTop:1},children:g.reason})]},b))})})()]},`${t.jobId}-${n}`)});function Bc({threadId:e,bridgeUrl:t,accentColor:n,isStreaming:o,isQueued:r,queuePosition:i,streamingEvents:s,onClose:a,onReply:l,onCancel:d,lastError:c,onMouseEnter:p,toolbarRef:u,currentModel:g,currentProvider:b,annotationNumber:x,annotationText:A}){let[T,z]=Xn([]),[P,O]=Xn(!0),[k,G]=Xn(""),[re,oe]=Xn([]),W=so(!1),Q=so(null),[N,ee]=Xn(!0),[M,Le]=Xn(0),[V,fe]=Xn(null),D=Tr(te=>fe(te),[]),ae=so(null),I=Tr((te,ie)=>{let ve=te&&ie.trim();ae.current&&(ae.current.style.opacity=ve?"0.65":"1"),Q.current&&(Q.current.style.borderTop=`1px solid ${ve?n:"rgba(0,0,0,0.12)"}`)},[n]),pe=so(null),me=so(null),Fe=so(o),we=so(zs()),Je=so({x:0,y:0}),Re=so(!1),Ce=so({x:0,y:0,offsetX:0,offsetY:0}),at=so(!0),[,gt]=Xn(0);po(()=>{try{let te=localStorage.getItem($s);if(te){let ie=JSON.parse(te);if(typeof ie.top=="number"&&typeof ie.left=="number"){let ve=window.innerWidth-Mr-Rn,Me={top:Math.max(Rn,Math.min(ie.top,window.innerHeight-Rn-200)),left:Math.max(Rn,Math.min(ie.left,ve))};at.current=Me.left>=ve-2,we.current=Me,gt(mt=>mt+1)}}}catch(te){}},[]),po(()=>{let te=()=>{if(at.current)we.current=zs();else{let ie=we.current,ve=window.innerWidth-Mr-Rn;we.current={top:Math.max(Rn,Math.min(ie.top,window.innerHeight-Rn-200)),left:Math.max(Rn,Math.min(ie.left,ve))}}gt(ie=>ie+1)};return window.addEventListener("resize",te,{passive:!0}),()=>window.removeEventListener("resize",te)},[]),po(()=>{let te=me.current;if(!te)return;let ie=Ne=>{Ne.button!==0||Ne.target.closest("button")||(Ne.preventDefault(),Ne.stopPropagation(),Re.current=!0,Ce.current={x:Ne.clientX,y:Ne.clientY,offsetX:Je.current.x,offsetY:Je.current.y})},ve=Ne=>{if(!Re.current)return;let ze=Ce.current,nt=ze.offsetX+(Ne.clientX-ze.x),St=ze.offsetY+(Ne.clientY-ze.y),Ke=Math.max(Rn,Math.min(window.innerWidth-Mr-Rn,we.current.left+nt)),qe=Math.max(Rn,we.current.top+St);Je.current={x:Ke-we.current.left,y:qe-we.current.top};let Rt=pe.current;Rt&&(Rt.style.top=`${qe}px`,Rt.style.left=`${Ke}px`,Rt.style.height=`${Ic(qe,Ke,u==null?void 0:u.current)}px`)},Me=()=>{if(!Re.current)return;let Ne=we.current.top+Je.current.y,ze=we.current.left+Je.current.x;we.current={top:Ne,left:ze},Je.current={x:0,y:0};let nt=window.innerWidth-Mr-Rn;at.current=ze>=nt-2;try{localStorage.setItem($s,JSON.stringify({top:Ne,left:ze}))}catch(St){}Re.current=!1},mt=()=>{we.current=zs(),Je.current={x:0,y:0},at.current=!0;try{localStorage.removeItem($s)}catch(Ne){}gt(Ne=>Ne+1)};return te.addEventListener("mousedown",ie),window.addEventListener("mousemove",ve),window.addEventListener("mouseup",Me),te.addEventListener("dblclick",mt),()=>{te.removeEventListener("mousedown",ie),window.removeEventListener("mousemove",ve),window.removeEventListener("mouseup",Me),te.removeEventListener("dblclick",mt)}},[]);let bt=Tr(()=>{fetch(`${t}/thread/${e}`).then(te=>te.json()).then(te=>{var ie;z((ie=te.messages)!=null?ie:[]),O(!1)}).catch(()=>O(!1))},[t,e]);po(()=>{O(!0),bt()},[bt]),po(()=>{Fe.current&&!o&&bt(),Fe.current=o},[o]);let Yt=Mc(()=>s?Fg(s):[],[s]),K=Mc(()=>s?Hg(s):null,[s]);po(()=>{let te=ae.current;if(!te)return;let ie=()=>{ee(te.scrollHeight-te.scrollTop-te.clientHeight<40);let Me=te.scrollTop+te.clientHeight,mt=te.querySelectorAll("[data-msg]"),Ne=0;for(let ze=0;ze<mt.length;ze++){let nt=mt[ze];nt.offsetTop+nt.offsetHeight>Me+20&&Ne++}Le(Ne)};return te.addEventListener("scroll",ie,{passive:!0}),()=>te.removeEventListener("scroll",ie)},[]),po(()=>{N&&ae.current&&(ae.current.scrollTop=ae.current.scrollHeight)},[T,Yt.length,o,N]),po(()=>{let te=ie=>{ie.key==="Escape"&&(ie.stopPropagation(),a())};return document.addEventListener("keydown",te),()=>document.removeEventListener("keydown",te)},[a]);let X=Tr(()=>{if(!k.trim()||!l)return;let te=k.trim(),ie=re.length>0?re:void 0,ve=ie?ie.map(Me=>URL.createObjectURL(Me)):void 0;z(Me=>[...Me,f({role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:te},ve?{replyImageUrls:ve}:{})]),l(e,te,ie),G(""),oe([])},[k,re,e,l]),Te=Tr(te=>{let ie=te.clipboardData.items,ve=[];for(let Me=0;Me<ie.length;Me++){let mt=ie[Me];if(mt.type.startsWith("image/")){let Ne=mt.getAsFile();Ne&&ve.push(Ne)}}ve.length>0&&(te.preventDefault(),oe(Me=>[...Me,...ve]))},[]),Oe=Tr(te=>{te.key==="Enter"&&(te.metaKey||te.ctrlKey)&&(te.preventDefault(),X())},[X]),Xe=we.current.top+Je.current.y,Pe=we.current.left+Je.current.x,he=Ic(Xe,Pe,u==null?void 0:u.current);return dt(Ro,{children:[se("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:te=>{te.target===te.currentTarget&&a()},style:{position:"fixed",inset:0,zIndex:9999}}),dt("div",{ref:pe,style:h(f({},Sg),{height:he,position:"fixed",top:Xe,left:Pe,zIndex:1e4}),"data-devtools":"thread-panel",onMouseEnter:p,children:[(()=>{let ie=`<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='${o?n:"rgb(0,0,0)"}' stroke-width='.75'/></svg>`,ve=`url("data:image/svg+xml,${encodeURIComponent(ie)}")`;return dt(Ro,{children:[se("style",{children:`@keyframes popmelt-border-march { to { background-position: 0 -5px; } }
68
+ [data-popmelt-reply]::placeholder { opacity: 0.35; }`}),se("div",{style:f({position:"absolute",inset:-3,padding:5,backgroundImage:ve,backgroundSize:"5px 5px",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",maskComposite:"exclude",pointerEvents:"none"},o&&{animation:"popmelt-border-march 0.8s linear infinite"})})]})})(),dt("div",{style:{display:"flex",flexDirection:"column",overflow:"hidden",flex:1,minHeight:0},children:[dt("div",{ref:me,style:h(f({},wg),{backgroundColor:n,color:"#ffffff",cursor:"grab",userSelect:"none",WebkitUserSelect:"none"}),children:[dt("span",{style:{display:"flex",alignItems:"center",gap:3,minWidth:0},children:[se("span",{style:{flexShrink:0},children:x?`${x}.`:"Conversation"}),A&&se("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:A})]}),se("button",{onClick:a,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),se("style",{dangerouslySetInnerHTML:{__html:Eg+`
66
69
  [data-devtools="thread-panel"] ::selection { background: color-mix(in srgb, ${n} 15%, transparent); }
67
- `}}),ft("div",{ref:pe,style:y(f({},rg),{opacity:W&&M.trim()?.65:1,transition:"opacity 150ms ease"}),"data-devtools":"thread-panel-messages",children:[P&&fe("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!P&&C.length===0&&!r&&fe("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),C.map((h,z)=>{let te=h.role==="human";if(h.cancelled||h.error)return ft("div",{"data-msg":!0,style:{padding:16,display:"flex",flexDirection:"column",gap:8},children:[ft("div",{style:{display:"flex",alignItems:"center",gap:4},children:[fe("span",{style:{fontSize:11,color:h.error?"#dc2626":"#9ca3af",fontStyle:"italic"},children:h.error?"Error":"Cancelled"}),fe("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:lc(h.timestamp)})]}),h.error&&fe("div",{style:{fontSize:12,color:"#6b7280",lineHeight:1.4},children:h.error})]},`${h.jobId}-${z}`);let se=te?h.replyToQuestion||h.feedbackSummary||"(annotation)":Os(h.responseText||""),ke=te?void 0:h.question,ye=!te&&h.resolutions&&h.resolutions.length>0,ae=!te&&h.segments&&h.segments.length>0,de=!te&&!ae&&h.toolsUsed&&h.toolsUsed.length>0;return!se&&!ke&&!ye&&!ae?null:ft("div",{"data-msg":!0,style:{padding:16,display:"flex",flexDirection:"column",gap:8},children:[ft("div",{style:{display:"flex",alignItems:"center",gap:4},children:[!te&&fe(Ss,{provider:h.provider,size:11,style:{color:"#6b7280"}}),fe("span",{style:{fontWeight:600,fontSize:11,color:te?n:"#6b7280"},children:te?"You":ws(h.model,h.provider)}),fe("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:lc(h.timestamp)})]}),te&&!h.replyToQuestion&&(()=>{let ue=se?dg(se):null;if(ue&&h.screenshotUrls)return fe("div",{style:{display:"flex",flexDirection:"column",gap:4},children:ue.map((qe,st)=>{var It;let Pt=(It=h.screenshotUrls)==null?void 0:It[qe.route],Ct=Pt?`${t}${Pt}`:null;return ft("div",{style:{display:"flex",gap:6,alignItems:"flex-start"},children:[Ct?fe("img",{src:Ct,title:qe.route,style:y(f({},gi),{flexShrink:0,marginTop:1}),onClick:()=>ie(Ct)}):fe("div",{style:{width:mi,height:mi,flexShrink:0}}),ft("div",{style:{lineHeight:1.5,wordBreak:"break-word",minWidth:0},children:[fe("code",{style:{fontSize:10,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px"},children:qe.route}),qe.text&&fe("div",{style:{marginTop:2},children:qn(qe.text)})]})]},st)})});let Ye=h.screenshotUrl?`${t}${h.screenshotUrl}`:null;return Ye&&se?ft("div",{style:{display:"flex",gap:6,alignItems:"flex-start"},children:[fe("img",{src:Ye,title:"screenshot",style:y(f({},gi),{flexShrink:0,marginTop:1}),onClick:()=>ie(Ye)}),fe("div",{style:{lineHeight:1.5,wordBreak:"break-word",minWidth:0},children:se.includes(`
68
- `)?qn(se):se})]}):se?fe("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:se.includes(`
69
- `)?qn(se):se}):null})(),te&&h.replyToQuestion&&se&&fe("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:se.includes(`
70
- `)?qn(se):se}),!te&&ae&&h.segments.map((ue,Ye)=>{if(ue.kind==="tool_group")return fe(ac,{tool:ue.tool,items:ue.items},Ye);let qe=Os(ue.text);return qe?fe("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:qn(qe)},Ye):null}),!te&&!ae&&se&&fe("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:qn(se)}),te&&h.replyToQuestion&&(()=>{let ue=ug(h,t);return ue.length===0?null:fe("div",{style:{display:"flex",gap:4,flexWrap:"wrap",marginTop:6},children:ue.map((Ye,qe)=>fe("img",{src:Ye.url,title:Ye.label,style:gi,onClick:()=>ie(Ye.url)},qe))})})(),te&&!h.replyToQuestion&&(()=>{let ue=pg(h,t);return ue.length===0?null:fe("div",{style:{display:"flex",gap:4,flexWrap:"wrap",marginTop:6},children:ue.map((Ye,qe)=>fe("img",{src:Ye.url,title:Ye.label,style:gi,onClick:()=>ie(Ye.url)},qe))})})(),ke&&fe("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:qn(ke)}),(de||ye)&&ft("div",{style:{padding:"8px 16px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#374151"},children:[de&&fe("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:h.toolsUsed.map((ue,Ye)=>fe("div",{children:ue},Ye))}),ye&&h.resolutions.map((ue,Ye)=>{var Pt;let qe=(Pt=ue.finalScope)!=null?Pt:ue.inferredScope,st=qe?`${qe.breadth} \xB7 ${qe.target}`:null;return ft("div",{style:{marginTop:de?4:0},children:[fe("span",{style:{color:ue.status==="resolved"?"#10b981":"#f59e0b"},children:ue.status==="resolved"?"Done":"Needs review"}),ue.summary?` \u2014 ${ue.summary}`:""]},Ye)})]})]},`${h.jobId}-${z}`)}),r&&ft("div",{style:{padding:16,display:"flex",flexDirection:"column",gap:8},children:[ft("div",{style:{display:"flex",alignItems:"center",gap:4},children:[fe(Ss,{provider:p,size:11,style:{color:"#6b7280"}}),fe("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:ws(u,p)})]}),ct.map((h,z)=>{if(h.kind==="tool_group")return fe(ac,{tool:h.tool,items:h.items},z);if(h.kind==="file_content")return fe(vg,{file:h.file,content:h.content,ext:h.ext,isPlan:h.isPlan,onAccept:h.isPlan&&s?()=>s(e,"Looks good, please proceed with implementation."):void 0},z);if(h.kind==="thinking")return fe("div",{style:{paddingLeft:12,fontSize:11,color:"#9ca3af",fontStyle:"italic",lineHeight:1.4,whiteSpace:"pre-wrap",wordBreak:"break-word",maxHeight:80,overflowY:"auto"},children:h.text},z);let te=Os(h.text);return te?fe("div",{style:{paddingLeft:12,lineHeight:1.5,wordBreak:"break-word"},children:qn(te)},z):null}),ft("div",{style:{display:"flex",alignItems:"center",gap:6},children:[fe(cg,{color:n}),l&&fe("button",{onClick:l,style:{background:"none",border:"1px solid rgba(0,0,0,0.1)",color:"#6b7280",fontSize:10,padding:"2px 8px",cursor:"pointer",fontFamily:"inherit",marginLeft:"auto"},children:"Cancel"})]})]}),!H&&C.length>0&&fe("div",{style:{position:"sticky",bottom:5,display:"flex",justifyContent:"flex-end",paddingRight:3,pointerEvents:"none"},children:fe("button",{onClick:()=>{pe.current&&pe.current.scrollTo({top:pe.current.scrollHeight,behavior:"smooth"})},style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center",padding:4,fontSize:10,fontFamily:Ut,color:"transparent",backgroundColor:"#eaeaea",backgroundImage:`url("data:image/svg+xml,${encodeURIComponent("<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='rgb(0,0,0)' stroke-width='.75'/></svg>")}")`,backgroundSize:"5px 5px",border:"none",borderRadius:0,cursor:"pointer",pointerEvents:"auto",userSelect:"none"},children:ft("span",{style:{position:"relative",backgroundColor:"#eaeaea",padding:"0 6px",color:"#374151",fontFamily:Ut,lineHeight:1.4},children:[k," message",k!==1?"s":""," \u2193"]})})})]}),!r&&a&&ft("div",{style:{padding:"8px 16px",backgroundColor:"rgba(239, 68, 68, 0.06)",fontSize:11,color:"#dc2626",lineHeight:1.4},children:[fe("span",{style:{fontWeight:600},children:"Error: "}),a]}),s&&ft("div",{style:{flexShrink:0,position:"relative"},children:[x.length>0&&fe("div",{style:{position:"absolute",bottom:"100%",display:"flex",gap:4,padding:"6px 5px 5px",flexWrap:"wrap"},children:x.map((h,z)=>ft("span",{onClick:()=>N(te=>te.filter((se,ke)=>ke!==z)),onMouseEnter:te=>{let se=te.currentTarget.querySelector("[data-chip-x]");se&&(se.style.color="#fff")},onMouseLeave:te=>{let se=te.currentTarget.querySelector("[data-chip-x]");se&&(se.style.color="rgba(255,255,255,0.4)")},style:{display:"inline-flex",alignItems:"center",gap:4,fontSize:10,color:"#fff",backgroundColor:n,backdropFilter:"blur(4px)",padding:"2px 6px 2px 6px",cursor:"pointer"},children:["image ",z+1,fe("span",{"data-chip-x":!0,style:{fontSize:12,lineHeight:1,color:"rgba(255,255,255,0.4)"},children:"\xD7"})]},z))}),ft("div",{style:y(f({},sg),{borderTop:`1px solid ${W&&M.trim()?n:"rgba(0,0,0,0.12)"}`}),children:[fe("input",{"data-popmelt-reply":!0,autoFocus:!0,value:M,onChange:h=>T(h.target.value),onFocus:()=>_(!0),onBlur:()=>_(!1),onKeyDown:nt,onPaste:Tt,placeholder:"Reply here (cmd + enter to send)",style:{flex:1,minWidth:0,minHeight:44,padding:"0 4px",fontSize:12,fontFamily:Ut,backgroundColor:"transparent",color:"#1f2937",border:"none",outline:"none",lineHeight:"40px",boxSizing:"border-box"}}),fe("button",{onClick:Pe,disabled:!M.trim(),style:{display:"flex",alignItems:"center",justifyContent:"center",width:28,height:28,padding:0,background:"none",border:"none",cursor:M.trim()?"pointer":"default",color:M.trim()?n:"rgba(0,0,0,0.2)",flexShrink:0},children:ft("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round",children:[fe("path",{d:"M3.714 3.048a.498.498 0 0 0-.683.627l2.843 7.627a2 2 0 0 1 0 1.396l-2.842 7.627a.498.498 0 0 0 .682.627l18-8.5a.5.5 0 0 0 0-.904z"}),fe("path",{d:"M6 12h16"})]})})]})]})]})]}),Q&&fe(fg,{src:Q,onClose:()=>ie(null)})]})}import{jsx as dr,jsxs as gc}from"react/jsx-runtime";var Hs=Eg(null),Ns="devtools-provider",Ds="devtools-model",_s="devtools-open-thread-id";async function fc(e,t){t?await t(e):(window.history.pushState(window.history.state,"",e),window.dispatchEvent(new PopStateEvent("popstate",{state:window.history.state}))),await new Promise(n=>{requestAnimationFrame(()=>requestAnimationFrame(()=>{setTimeout(n,600)}))})}var Mg={0:0,1:1},Ig={0:0,1:1,2:1};function Lg(e,t,n){var o,i;let r=t==="codex"?pi:ui;return e==="claude"&&t==="codex"?(o=Mg[n])!=null?o:Math.min(n,r.length-1):e==="codex"&&t==="claude"&&(i=Ig[n])!=null?i:Math.min(n,r.length-1)}function Rg({children:e,enabled:t=process.env.NODE_ENV==="development",bridgeUrl:n=typeof window!="undefined"?(o=>(o=window.__POPMELT_BRIDGE_URL__)!=null?o:"http://localhost:1111")():"http://localhost:1111",navigate:r}){var X,re,we,K,Ee,Te,Le;let[i,s]=wl(),l=vl(n,t),a=Vt(null),d=Vt(null),c=(X=bl())!=null?X:n,u=Vt(new Map),p=Vt(new Map),g=Vt(!1),w=jo(),[C,R]=pn(()=>typeof window=="undefined"?"claude":localStorage.getItem(Ns)||"claude"),[P,G]=pn(()=>{if(typeof window=="undefined")return 0;let v=localStorage.getItem(Ds);return v&&parseInt(v,10)||0}),[M,T]=pn([]),[x,N]=pn({}),[W,_]=pn(!1);Yt(()=>{l.isConnected&&Qs(c).then(v=>{if(!v)return;let B=Object.entries(v.providers).filter(([,Me])=>Me.available).map(([Me])=>Me);B.length>0&&T(B);let ee={};for(let[Me,ge]of Object.entries(v.providers))ge.mcp&&(ee[Me]=ge.mcp);N(ee),Object.values(ee).every(Me=>Me.found)&&_(!1)})},[l.isConnected,l.capabilitiesVersion,c]),Yt(()=>{if(M.length>0&&!M.includes(C)){let v=M[0];R(v),localStorage.setItem(Ns,v)}},[M,C]);let H=C==="codex"?pi:ui,V=(re=H[P])!=null?re:H[0],k=nn(v=>{let B=C;R(v),localStorage.setItem(Ns,v);let ee=Lg(B,v,P);G(ee),localStorage.setItem(Ds,String(ee))},[C,P]),A=nn(v=>{G(v),localStorage.setItem(Ds,String(v))},[]),Q=nn(async()=>{let v=await nl(c);if(!v)return;let B={};for(let[ee,le]of Object.entries(v.capabilities.providers))le.mcp&&(B[ee]=le.mcp);N(B),v.results.some(ee=>ee.installed)&&_(!0)},[c]),[ie,pe]=pn(new Set),[be,me]=pn(null),[We,Ce]=pn(null),[oe,_e]=pn(null),[Ne,je]=pn(null);Yt(()=>{l.isConnected&&Fo(c).then(v=>{v!=null&&v.components&&pe(new Set(Object.keys(v.components)))})},[l.isConnected,c]);let Fe=nn(async v=>{let B=[];for(let ee of v)try{(await ol(ee,c)).added&&B.push(ee)}catch(le){console.error("[Popmelt] Failed to add component to model:",ee,le)}B.length>0&&(pe(ee=>{let le=new Set(ee);for(let Me of B)le.add(Me);return le}),me(B[B.length-1]))},[c]),Ie=nn(v=>{me(v)},[]),ct=nn(()=>{Fo(c).then(v=>{v!=null&&v.components&&pe(new Set(Object.keys(v.components)))})},[c]),wt=nn(async v=>{try{(await rl(v,c)).removed&&pe(ee=>{let le=new Set(ee);return le.delete(v),le})}catch(B){console.error("[Popmelt] Failed to remove component from model:",B)}},[c]),Pe=nn((v,B)=>{s({type:"MODIFY_SPACING_TOKEN",payload:v}),s({type:"ADD_SPACING_TOKEN_CHANGE",payload:B})},[s]),Tt=nn((v,B)=>{s({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:v,originalValue:B}})},[s]),[nt,Lt]=pn(0),Mt=Vt([]);Yt(()=>{let v=Mt.current,B=i.spacingTokenMods;Mt.current=B;let ee=new Map(v.map(ge=>[ge.tokenPath,ge])),le=new Map(B.map(ge=>[ge.tokenPath,ge])),Me=!1;for(let[ge,Ge]of le){let Xe=ee.get(ge);if(!(Xe&&Xe.currentValue===Ge.currentValue)){Me=!0,Ge.currentValue==="__deleted__"?il(ge,c).catch(mt=>console.error("[Popmelt] Failed to sync token delete:",mt)):xi(ge,Ge.currentValue,c).catch(mt=>console.error("[Popmelt] Failed to sync token update:",mt));for(let mt of Ge.targets){let Ze=document.querySelector(mt.selector);if(Ze)if(Ge.currentValue==="__deleted__")Ze.style.removeProperty(mt.property);else{let rt=Ge.currentPx;rt>0&&Ze.style.setProperty(mt.property,`${rt}px`,"important")}}}}for(let[ge,Ge]of ee)if(!le.has(ge)){Me=!0,xi(ge,Ge.originalValue,c).catch(Xe=>console.error("[Popmelt] Failed to restore token on undo:",Xe));for(let Xe of Ge.targets){let mt=document.querySelector(Xe.selector);mt&&mt.style.removeProperty(Xe.property)}}Me&&Lt(ge=>ge+1)},[i.spacingTokenMods,c]);let[Oe,h]=pn(()=>typeof window=="undefined"?null:localStorage.getItem(_s)||null),z=Vt(null),[te,se]=pn(new Set),[ke,ye]=pn(null);Yt(()=>{Oe?localStorage.setItem(_s,Oe):localStorage.removeItem(_s)},[Oe]);let ae="popmelt-in-flight-jobs",[de,ue]=pn(()=>{try{let v=localStorage.getItem(ae);return v?JSON.parse(v):{}}catch(v){return{}}});Yt(()=>{try{Object.keys(de).length>0?localStorage.setItem(ae,JSON.stringify(de)):localStorage.removeItem(ae)}catch(v){}},[de]),Yt(()=>{let v=B=>{if(B.key===ae)try{let ee=B.newValue?JSON.parse(B.newValue):{};ue(ee)}catch(ee){}};return window.addEventListener("storage",v),()=>window.removeEventListener("storage",v)},[]);let Ye=Vt(new Map),qe=Vt(new Map);Yt(()=>{for(let[v,B]of Object.entries(de))B.annotationIds.length>0&&Ye.current.set(v,B.annotationIds),B.threadId&&qe.current.set(v,B.threadId)},[de]);let st=Vt(!1);Yt(()=>{if(st.current||i.annotations.length===0)return;st.current=!0;let v=new Set;for(let ee of Object.values(de))for(let le of ee.annotationIds)v.add(le);let B=i.annotations.filter(ee=>v.has(ee.id)?!1:!!(ee.status==="in_flight"||(ee.status==="pending"||!ee.status)&&(ee.captured||ee.threadId))).map(ee=>ee.id);B.length>0&&s({type:"SET_ANNOTATION_STATUS",payload:{ids:B,status:"dismissed"}})},[i.annotations,de,s]);let Pt=cr(()=>{let v=new Set;for(let B of Object.values(de))for(let ee of B.annotationIds)v.add(ee);return v},[de]),Ct=cr(()=>{let v=new Set;for(let B of Object.values(de))for(let ee of B.styleSelectors)v.add(ee);return v},[de]),It=cr(()=>{let v=new Map;for(let B of Object.values(de)){for(let ee of B.styleSelectors)v.set(ee,B.color);for(let ee of B.annotationIds){let le=i.annotations.find(Me=>Me.id===ee);if(le&&(le.linkedSelector&&v.set(le.linkedSelector,B.color),le.groupId))for(let Me of i.annotations)Me.groupId===le.groupId&&Me.linkedSelector&&v.set(Me.linkedSelector,B.color)}}return v},[de,i.annotations]),Gt=Vt(i.annotations);Gt.current=i.annotations;let Jt=Vt(i.styleModifications);Jt.current=i.styleModifications;let $t=Vt(de);$t.current=de,Yt(()=>{let v=null,B=()=>{var Xe,mt;if(Object.keys($t.current).length>0)return;let le=Gt.current,Me=Jt.current,ge=[],Ge=[];for(let Ze of le){if(!Ze.linkedSelector||!Ze.linkedSelector.startsWith("[data-pm=")||Ze.pathname||Ze.captured||Ze.status&&Ze.status!=="pending")continue;let rt=document.querySelector(Ze.linkedSelector);!rt&&((mt=(Xe=Ze.elements)==null?void 0:Xe[0])!=null&&mt.selector)&&(rt=document.querySelector(Ze.elements[0].selector)),rt||ge.push(Ze.linkedSelector)}for(let Ze of Me)document.querySelector(Ze.selector)||Ge.push(Ze.selector);(ge.length>0||Ge.length>0)&&s({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:ge,styleSelectors:Ge}})},ee=new MutationObserver(le=>{le.some(Me=>Me.removedNodes.length>0)&&(v&&clearTimeout(v),v=setTimeout(B,3e3))});return ee.observe(document.body,{childList:!0,subtree:!0}),()=>{ee.disconnect(),v&&clearTimeout(v)}},[s]);let on=Vt(typeof window!="undefined"?window.location.pathname:"/");Yt(()=>{let v=le=>{if(g.current)return;let Me=window.location.pathname;if(le===Me)return;let ge=Gt.current.filter(Xe=>{var mt;return Xe.pathname===le&&((mt=Xe.status)!=null?mt:"pending")==="pending"});if(console.log(`[Popmelt] Navigation from ${le} \u2192 ${Me}, ${ge.length} pending annotations on departing page`),ge.length===0)return;let Ge=a.current;if(!Ge){console.warn("[Popmelt] No canvas ref for capture-on-leave");return}if(gr(document.body,Ge,ge).then(Xe=>mr(Xe)).then(Xe=>{Xe?(p.current.set(le,Xe),console.log(`[Popmelt] Cached screenshot for ${le} (${(Xe.size/1024).toFixed(0)}KB)`)):console.warn(`[Popmelt] Capture-on-leave produced no blob for ${le}`)}).catch(Xe=>{console.warn("[Popmelt] Capture-on-leave failed:",Xe)}),p.current.size>20){let Xe=[...p.current.entries()];p.current=new Map(Xe.slice(-10))}},B=le=>{var ge;let Me=(ge=le.detail)==null?void 0:ge.prevPath;Me&&(v(Me),on.current=window.location.pathname)},ee=()=>{let le=on.current;v(le),on.current=window.location.pathname};return window.addEventListener("popmelt:locationchange",B),window.addEventListener("popstate",ee),()=>{window.removeEventListener("popmelt:locationchange",B),window.removeEventListener("popstate",ee)}},[]),Yt(()=>{l.lastCompletedJobId&&l.lastCompletedJobId in de&&ue(v=>{var le;let Me=v,{[le=l.lastCompletedJobId]:B}=Me;return Hn(Me,[co(le)])})},[l.lastCompletedJobId]);let Ot=Vt(new Set),bn=Vt(!1);Yt(()=>{if(!l.isConnected){bn.current=!1;return}bn.current||(bn.current=!0,Ho(c).then(async v=>{var Ge,Xe,mt,Ze;if(!v)return;let B=(Ge=v.activeJobs)!=null?Ge:[],ee=(Xe=v.recentJobs)!=null?Xe:[],le=new Set(B.map(rt=>rt.id)),Me=JSON.parse(localStorage.getItem(ae)||"{}"),ge=new Set;for(let rt of Object.values(Me))if(rt.annotationIds)for(let dt of rt.annotationIds)ge.add(dt);ue(rt=>{var gn,mn,sn;let dt=f({},rt),ut=Date.now();for(let bt of Object.keys(dt)){if(bt.startsWith("_pending_")){let ln=parseInt(bt.replace(/^_pending_(?:reply_)?/,""),10);!isNaN(ln)&&ut-ln>3e4&&delete dt[bt];continue}le.has(bt)||delete dt[bt]}for(let bt of B)!dt[bt.id]&&((gn=bt.annotationIds)!=null&&gn.length||bt.threadId)&&(dt[bt.id]={annotationIds:(mn=bt.annotationIds)!=null?mn:[],styleSelectors:[],color:(sn=bt.color)!=null?sn:"#888",threadId:bt.threadId});let ht=new Set;for(let bt of ee)if(bt.annotationIds)for(let ln of bt.annotationIds)ht.add(ln);for(let bt of Object.keys(dt)){if(!bt.startsWith("_pending_"))continue;let ln=dt[bt];ln&&ln.annotationIds.some(He=>ht.has(He))&&delete dt[bt]}return dt});for(let rt of ee)if(rt.status==="done"&&(mt=rt.annotationIds)!=null&&mt.length&&rt.annotationIds.some(dt=>ge.has(dt))&&!Ot.current.has(rt.id))try{let dt=await Pr(c,rt.id);if(!dt)continue;let ut=dt.events.find(ht=>ht.type==="done");ut&&Array.isArray(ut.resolutions)&&(Ot.current.add(rt.id),s({type:"APPLY_RESOLUTIONS",payload:{resolutions:ut.resolutions,threadId:(Ze=ut.threadId)!=null?Ze:void 0}}))}catch(dt){}}))},[l.isConnected,c,s]),Yt(()=>{let v=l.events.filter(B=>B.type==="done"&&B.data.resolutions);for(let B of v){let ee=B.data.jobId;Ot.current.has(ee)||(Ot.current.add(ee),Array.isArray(B.data.resolutions)&&s({type:"APPLY_RESOLUTIONS",payload:{resolutions:B.data.resolutions,threadId:B.data.threadId}}))}},[l.events,s]);let St=Vt(new Set);Yt(()=>{let v=l.events.filter(B=>B.type==="error"&&B.data.cancelled);for(let B of v){let ee=B.data.jobId;if(!ee||St.current.has(ee))continue;St.current.add(ee);let le=de[ee];le&&le.annotationIds.length>0&&s({type:"SET_ANNOTATION_STATUS",payload:{ids:le.annotationIds,status:"dismissed"}})}},[l.events,de,s]);let ne=Vt(0);Yt(()=>{let v=l.incrementalResolutions;if(v.length<=ne.current)return;let B=v.slice(ne.current);ne.current=v.length,s({type:"APPLY_RESOLUTIONS",payload:{resolutions:B}})},[l.incrementalResolutions,s]),Yt(()=>{l.incrementalResolutions.length===0&&(ne.current=0)},[l.incrementalResolutions.length]);let De=nn(async()=>{let v=a.current;if(!v)return!1;let B=await gr(document.body,v,i.annotations);if(B.length===0)return!1;let ee=await kl(B,i.annotations,i.styleModifications);return ee&&s({type:"MARK_CAPTURED"}),ee},[i.annotations,i.styleModifications,s]),ot=nn((v,B)=>{let ee=u.current.get(v)||[];u.current.set(v,[...ee,...B])},[]),Dn=nn(async()=>{var ln;let v=a.current;if(!v)return!1;let B=i.annotations.filter(He=>{var xt;return((xt=He.status)!=null?xt:"pending")==="pending"}),ee=i.spacingTokenChanges.filter(He=>!He.captured);if(B.length===0&&i.styleModifications.filter(He=>!He.captured).length===0&&ee.length===0)return!1;let le=new Map;for(let He of B){let xt=He.pathname||w;le.has(xt)||le.set(xt,[]),le.get(xt).push(He)}let Me=new Map,ge=[...le.keys()].filter(He=>He!==w);if(ge.length>0){let He=w,xt={x:window.scrollX,y:window.scrollY};g.current=!0;for(let Wt of ge)try{console.log(`[Popmelt] Navigating to ${Wt} for screenshot capture`),await fc(Wt,r),window.location.pathname!==Wt&&console.warn(`[Popmelt] Navigation to ${Wt} did not take effect (at ${window.location.pathname})`);let xn=le.get(Wt)||[],ao=await gr(document.body,v,xn),_n=await mr(ao);_n&&(Me.set(Wt,_n),console.log(`[Popmelt] Captured ${Wt} (${(_n.size/1024).toFixed(0)}KB)`))}catch(xn){console.warn(`[Popmelt] Failed to capture ${Wt}:`,xn)}await fc(He,r),window.scrollTo(xt.x,xt.y),g.current=!1}let Ge=B.filter(He=>(He.pathname||w)===w),Xe=await gr(document.body,v,Ge.length>0?i.annotations:[]);if(Xe.length>0){let He=await mr(Xe);He&&Me.set(w,He)}if(Me.size===0)return!1;let mt=ki(B,i.styleModifications,void 0,ee.length>0?ee:void 0),Ze=JSON.stringify(mt),rt=new Map;for(let He of B){let xt=u.current.get(He.id);if(xt&&xt.length>0&&rt.set(He.id,xt),He.groupId){for(let Wt of B)if(Wt.groupId===He.groupId&&Wt.id!==He.id){let xn=u.current.get(Wt.id);xn&&xn.length>0&&rt.set(Wt.id,xn)}}}let dt=le.size>1;console.log(`[Popmelt] Submit: ${le.size} page(s), ${Me.size} screenshot(s), pages: [${[...le.keys()].join(", ")}], cached: [${[...p.current.keys()].join(", ")}]`);let ut=dt?Me:(ln=Me.get(w))!=null?ln:Me,ht=B.map(He=>He.id),gn=i.styleModifications.filter(He=>!He.captured).map(He=>He.selector),mn=Ci(i.activeColor),sn=`_pending_${Date.now()}`,bt={annotationIds:ht,styleSelectors:gn,color:i.activeColor,threadId:void 0};try{let He=JSON.parse(localStorage.getItem(ae)||"{}");He[sn]=bt,localStorage.setItem(ae,JSON.stringify(He))}catch(He){}ue(He=>y(f({},He),{[sn]:bt}));try{let{jobId:He,threadId:xt}=await tl(ut,Ze,c,mn,C,V.id,rt.size>0?rt:void 0,wi());for(let Xt of rt.keys())u.current.delete(Xt);for(let Xt of le.keys())p.current.delete(Xt);let Wt=y(f({},bt),{threadId:xt});try{let Xt=JSON.parse(localStorage.getItem(ae)||"{}");delete Xt[sn],Xt[He]=Wt,localStorage.setItem(ae,JSON.stringify(Xt))}catch(Xt){}ue(Xt=>{let pr=Xt,{[sn]:hi}=pr,Rr=Hn(pr,[co(sn)]);return y(f({},Rr),{[He]:Wt})}),s({type:"MARK_CAPTURED"}),xt&&ht.length>0&&s({type:"SET_ANNOTATION_THREAD",payload:{ids:ht,threadId:xt}});let xn=i.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),_n=((xn!=null&&xn[1]?parseFloat(xn[1]):29)+60)%360;return s({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${_n})`}),!0}catch(He){try{let xt=JSON.parse(localStorage.getItem(ae)||"{}");delete xt[sn],localStorage.setItem(ae,JSON.stringify(xt))}catch(xt){}return ue(xt=>{let ao=xt,{[sn]:Wt}=ao;return Hn(ao,[co(sn)])}),console.error("[Pare] Failed to send to bridge:",He),!1}},[i.annotations,i.styleModifications,i.spacingTokenChanges,i.activeColor,s,c,C,V.id,w,r]),Tn=nn(async(v,B,ee)=>{var mt,Ze,rt,dt;let le=(dt=(rt=(mt=Object.values($t.current).find(ut=>ut.threadId===v))==null?void 0:mt.color)!=null?rt:(Ze=i.annotations.find(ut=>ut.threadId===v))==null?void 0:Ze.color)!=null?dt:i.activeColor,Me=i.annotations.filter(ut=>ut.threadId===v&&(ut.status==="waiting_input"||ut.status==="resolved"||ut.status==="needs_review")),ge=Me.map(ut=>ut.id),Ge=`_pending_reply_${Date.now()}`,Xe={annotationIds:ge,styleSelectors:[],color:le,threadId:v};try{let ut=JSON.parse(localStorage.getItem(ae)||"{}");ut[Ge]=Xe,localStorage.setItem(ae,JSON.stringify(ut))}catch(ut){}ue(ut=>y(f({},ut),{[Ge]:Xe}));try{let ut=Ci(i.activeColor),{jobId:ht}=await sl(v,B,c,ut,C,V.id,ee,wi()),gn=f({},Xe);try{let mn=JSON.parse(localStorage.getItem(ae)||"{}");delete mn[Ge],mn[ht]=gn,localStorage.setItem(ae,JSON.stringify(mn))}catch(mn){}ue(mn=>{let ln=mn,{[Ge]:sn}=ln,bt=Hn(ln,[co(Ge)]);return y(f({},bt),{[ht]:gn})}),Me.length>0&&s({type:"SET_ANNOTATION_STATUS",payload:{ids:ge,status:"in_flight"}}),l.dismissQuestion(v)}catch(ut){try{let ht=JSON.parse(localStorage.getItem(ae)||"{}");delete ht[Ge],localStorage.setItem(ae,JSON.stringify(ht))}catch(ht){}ue(ht=>{let sn=ht,{[Ge]:gn}=sn;return Hn(sn,[co(Ge)])}),console.error("[Pare] Failed to send reply:",ut)}},[i.activeColor,i.annotations,c,l.dismissQuestion,s,C,V.id]),Qt=Vt(new Set);Yt(()=>{for(let v of l.pendingQuestions){if(Qt.current.has(v.jobId))continue;Qt.current.add(v.jobId);let B=v.annotationIds&&v.annotationIds.length>0?v.annotationIds:void 0;!B&&v.threadId&&(B=i.annotations.filter(ee=>ee.threadId===v.threadId).map(ee=>ee.id)),B&&B.length>0&&s({type:"SET_ANNOTATION_QUESTION",payload:{ids:B,question:v.question,threadId:v.threadId}})}},[l.pendingQuestions,s,i.annotations]);let Mn=cr(()=>{if(l.activeJobId&&l.activeJobId in de)return de[l.activeJobId].color;let v=Object.values(de);return v.length>0?v[v.length-1].color:void 0},[l.activeJobId,de]),Sn=nn(v=>{h(v)},[]),Bt=nn(v=>{var le;let B=de[v],ee=(B==null?void 0:B.threadId)||qe.current.get(v);ee&&(z.current=(le=B==null?void 0:B.color)!=null?le:null,h(ee))},[de]),ur=nn(v=>{if(!v){ye(null);return}let B=Ye.current.get(v);B&&B.length>0?ye(new Set(B)):ye(null)},[]),fn=nn(async v=>{try{let B=v?`${c}/cancel?jobId=${v}`:`${c}/cancel`;await fetch(B,{method:"POST"})}catch(B){}},[c]);Yt(()=>{i.activeTool==="model"&&Oe&&h(null)},[i.activeTool]);let Nt=Vt(null);Yt(()=>{i.isAnnotating?Nt.current&&(h(Nt.current),Nt.current=null):Oe&&(Nt.current=Oe,h(null))},[i.isAnnotating]);let Dt=cr(()=>{if(!Oe)return null;for(let[v,B]of Object.entries(de))if(B.threadId===Oe)return v;for(let[v,B]of Object.entries(l.activeJobThreads))if(B===Oe)return v;return null},[Oe,de,l.activeJobThreads]),yt=Oe?i.annotations.find(v=>v.threadId===Oe):void 0,rn=yt?i.annotations.indexOf(yt)+1:void 0,[_t,Qn]=pn(!1),[wn,bo]=pn(0),lt=Vt(null),eo=nn(v=>{v?(lt.current&&(clearTimeout(lt.current),lt.current=null),Qn(!0)):lt.current=setTimeout(()=>{Qn(!1),lt.current=null},150)},[]),xo=nn(()=>{bo(v=>v+1),l.clearEvents(),h(null),se(new Set),fn()},[l.clearEvents,fn]);Yt(()=>()=>{lt.current&&clearTimeout(lt.current)},[]);let[vo,to]=pn(!1);Yt(()=>{to(!0)},[]);let D=cr(()=>({isEnabled:t}),[t]);return!t||!vo?dr(Hs.Provider,{value:D,children:e}):gc(Hs.Provider,{value:D,children:[e,dr(Ma,{state:i,dispatch:s,onScreenshot:De,inFlightAnnotationIds:Pt,inFlightStyleSelectors:Ct,inFlightSelectorColors:It,onAttachImages:ot,onReply:l.isConnected?Tn:void 0,onViewThread:l.isConnected?Sn:void 0,onCloseThread:v=>{h(null),v&&se(B=>new Set(B).add(v))},onModelComponentsAdd:l.isConnected?Fe:void 0,onModelComponentFocus:l.isConnected?Ie:void 0,onModelComponentHover:Ce,modelComponentNames:ie,modelPanelHoveredComponent:oe,modelSpacingTokenHover:Ne,highlightedAnnotationIds:ke,focusedThreadAnnotationId:yt==null?void 0:yt.id,externalCanvasRef:a,toolbarRef:d}),dr(ic,{children:gc(oc,{children:[dr(Qa,{state:i,dispatch:s,onScreenshot:De,onSendToClaude:l.isConnected?Dn:void 0,hasActiveJobs:Object.keys(de).length>0||l.activeJobIds.length>0,activeJobColor:Mn,onCrosshairHover:eo,onClear:xo,provider:C,onProviderChange:l.isConnected&&M.length>1?k:void 0,availableProviders:M,modelIndex:P,modelCount:H.length,modelLabel:V.label,onModelChange:l.isConnected?A:void 0,onViewThread:l.isConnected?Sn:void 0,isThreadPanelOpen:Oe!==null,mcpStatus:x,onInstallMcp:l.isConnected?Q:void 0,mcpJustInstalled:W,bridgeUrl:c,isBridgeConnected:l.isConnected,modelSelectedComponent:be,modelCanvasHoveredComponent:We,onModelComponentHover:_e,onSpacingTokenHover:je,onModifySpacingToken:l.isConnected?Pe:void 0,onDeleteSpacingToken:l.isConnected?Tt:void 0,modelRefreshKey:nt,onModelComponentAdded:ct,onModelComponentRemoved:wt,toolbarRef:d}),Oe&&l.isConnected&&dr(pc,{threadId:Oe,bridgeUrl:c,accentColor:(K=(we=yt==null?void 0:yt.color)!=null?we:z.current)!=null?K:i.activeColor,isStreaming:Dt!==null,streamingEvents:Dt?l.events.filter(v=>v.data.jobId===Dt):[],onClose:()=>h(null),onReply:Tn,onCancel:Dt?()=>fn(Dt):void 0,lastError:(Le=(Ee=l.lastErrorByJob)==null?void 0:Ee[Dt!=null?Dt:""])!=null?Le:l.lastCompletedJobId&&qe.current.get(l.lastCompletedJobId)===Oe?(Te=l.lastErrorByJob)==null?void 0:Te[l.lastCompletedJobId]:void 0,toolbarRef:d,currentModel:V.id,currentProvider:C,annotationNumber:rn,annotationText:yt==null?void 0:yt.text}),dr(nc,{bridge:l,bridgeUrl:c,inFlightJobs:de,isVisible:_t||l.lastResponseText!==null||l.activeJobIds.length>0,onHover:eo,clearSignal:wn,onReply:Tn,onViewThread:Sn,onClickJob:Bt,onCancel:fn,onHoverJob:ur,isConnected:l.isConnected,dismissedThreadIds:te})]})})]})}function Ag(){let e=Tg(Hs);if(!e)throw new Error("usePopmelt must be used within PopmeltProvider");return e}export{Rg as PopmeltProvider,Ag as usePopmelt};
70
+ `}}),dt("div",{ref:ae,style:h(f({},Cg),{transition:"opacity 150ms ease"}),"data-devtools":"thread-panel-messages",children:[P&&se("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!P&&T.length===0&&!o&&se("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),T.map((te,ie)=>se(Yg,{msg:te,index:ie,bridgeUrl:t,accentColor:n,onLightbox:D},`${te.jobId}-${ie}`)),o&&se("div",{style:{padding:16,display:"flex",flexDirection:"column",gap:8},children:r?dt("div",{style:{display:"flex",alignItems:"center",gap:6},children:[dt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:n,style:{verticalAlign:"middle",flexShrink:0,opacity:.5},children:[se("circle",{cx:"12",cy:"6",r:"2"}),se("circle",{cx:"6",cy:"12",r:"2"}),se("circle",{cx:"18",cy:"12",r:"2"}),se("circle",{cx:"12",cy:"18",r:"2"})]}),dt("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:["queued",i?` ${i}`:""]})]}):dt(Ro,{children:[dt("div",{style:{display:"flex",alignItems:"center",gap:4},children:[se(Fr,{provider:b,size:11,style:{color:"#6b7280"}}),se("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:Ps(g,b)})]}),Yt.map((te,ie)=>{if(te.kind==="tool_group")return se(Oc,{tool:te.tool,items:te.items},ie);if(te.kind==="file_content")return se($g,{file:te.file,content:te.content,ext:te.ext,isPlan:te.isPlan,onAccept:te.isPlan&&l?()=>l(e,"Looks good, please proceed with implementation."):void 0},ie);if(te.kind==="thinking")return se("div",{style:{paddingLeft:12,fontSize:11,color:"#9ca3af",fontStyle:"italic",lineHeight:1.4,whiteSpace:"pre-wrap",wordBreak:"break-word",maxHeight:80,overflowY:"auto"},children:te.text},ie);let ve=Gs(te.text);return ve?se("div",{style:{paddingLeft:12,lineHeight:1.5,wordBreak:"break-word"},children:uo(ve)},ie):null}),dt("div",{style:{display:"flex",alignItems:"center",gap:6},children:[se(Lg,{color:n}),d&&se("button",{onClick:d,style:{background:"none",border:"1px solid rgba(0,0,0,0.1)",color:"#6b7280",fontSize:10,padding:"2px 8px",cursor:"pointer",fontFamily:"inherit",marginLeft:"auto"},children:"Cancel"})]})]})}),!N&&T.length>0&&se("div",{style:{position:"sticky",bottom:5,display:"flex",justifyContent:"flex-end",paddingRight:3,pointerEvents:"none"},children:se("button",{onClick:()=>{ae.current&&ae.current.scrollTo({top:ae.current.scrollHeight,behavior:"smooth"})},style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center",padding:4,fontSize:10,fontFamily:Qt,color:"transparent",backgroundColor:"#eaeaea",backgroundImage:`url("data:image/svg+xml,${encodeURIComponent("<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='rgb(0,0,0)' stroke-width='.75'/></svg>")}")`,backgroundSize:"5px 5px",border:"none",borderRadius:0,cursor:"pointer",pointerEvents:"auto",userSelect:"none"},children:dt("span",{style:{position:"relative",backgroundColor:"#eaeaea",padding:"0 6px",color:"#374151",fontFamily:Qt,lineHeight:1.4},children:[M," message",M!==1?"s":""," \u2193"]})})})]}),!o&&c&&dt("div",{style:{padding:"8px 16px",backgroundColor:"rgba(239, 68, 68, 0.06)",fontSize:11,color:"#dc2626",lineHeight:1.4},children:[se("span",{style:{fontWeight:600},children:"Error: "}),c]}),l&&dt("div",{style:{flexShrink:0,position:"relative"},children:[re.length>0&&se("div",{style:{position:"absolute",bottom:"100%",display:"flex",gap:4,padding:"6px 5px 5px",flexWrap:"wrap"},children:re.map((te,ie)=>dt("span",{onClick:()=>oe(ve=>ve.filter((Me,mt)=>mt!==ie)),onMouseEnter:ve=>{let Me=ve.currentTarget.querySelector("[data-chip-x]");Me&&(Me.style.color="#fff")},onMouseLeave:ve=>{let Me=ve.currentTarget.querySelector("[data-chip-x]");Me&&(Me.style.color="rgba(255,255,255,0.4)")},style:{display:"inline-flex",alignItems:"center",gap:4,fontSize:10,color:"#fff",backgroundColor:n,backdropFilter:"blur(4px)",padding:"2px 6px 2px 6px",cursor:"pointer"},children:["image ",ie+1,se("span",{"data-chip-x":!0,style:{fontSize:12,lineHeight:1,color:"rgba(255,255,255,0.4)"},children:"\xD7"})]},ie))}),dt("div",{ref:Q,style:h(f({},kg),{borderTop:"1px solid rgba(0,0,0,0.12)"}),children:[se("input",{"data-popmelt-reply":!0,autoFocus:!0,value:k,onChange:te=>{G(te.target.value),I(W.current,te.target.value)},onFocus:()=>{W.current=!0,I(!0,k)},onBlur:()=>{W.current=!1,I(!1,k)},onKeyDown:Oe,onPaste:Te,placeholder:"Reply here (cmd + enter to send)",style:{flex:1,minWidth:0,minHeight:44,padding:"0 4px",fontSize:12,fontFamily:Qt,backgroundColor:"transparent",color:"#1f2937",border:"none",outline:"none",lineHeight:"40px",boxSizing:"border-box"}}),se("button",{onClick:X,disabled:!k.trim(),style:{display:"flex",alignItems:"center",justifyContent:"center",width:28,height:28,padding:0,background:"none",border:"none",cursor:k.trim()?"pointer":"default",color:k.trim()?n:"rgba(0,0,0,0.2)",flexShrink:0},children:dt("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round",children:[se("path",{d:"M3.714 3.048a.498.498 0 0 0-.683.627l2.843 7.627a2 2 0 0 1 0 1.396l-2.842 7.627a.498.498 0 0 0 .682.627l18-8.5a.5.5 0 0 0 0-.904z"}),se("path",{d:"M6 12h16"})]})})]})]})]})]}),V&&se(Og,{src:V,onClose:()=>fe(null)})]})}import{jsx as Ir,jsxs as _c}from"react/jsx-runtime";var Vg=[],Us=Jg(null),js="devtools-provider",Ri="devtools-model",Ys="devtools-open-thread-id",Js="popmelt-synthesize-thread";async function Dc(e,t){t?await t(e):(window.history.pushState(window.history.state,"",e),window.dispatchEvent(new PopStateEvent("popstate",{state:window.history.state}))),await new Promise(n=>{requestAnimationFrame(()=>requestAnimationFrame(()=>{setTimeout(n,600)}))})}var Xg={0:0,1:1},Kg={0:0,1:1,2:1};function qg(e,t,n){var r,i;if(t==="copilot")return 0;let o=t==="codex"?Ti:ki;return e==="copilot"?0:e==="claude"&&t==="codex"?(r=Xg[n])!=null?r:Math.min(n,o.length-1):e==="codex"&&t==="claude"&&(i=Kg[n])!=null?i:Math.min(n,o.length-1)}function Zg({children:e,enabled:t=process.env.NODE_ENV==="development",bridgeUrl:n=typeof window!="undefined"?(r=>(r=window.__POPMELT_BRIDGE_URL__)!=null?r:"http://localhost:1111")():"http://localhost:1111",navigate:o}){var Ie,je,Pt,Ft,un;let[i,s]=Oa(),a=Aa(n,t),l=tn(null),d=tn(null),c=(Ie=La())!=null?Ie:n,p=tn(new Map),u=tn(new Map),g=tn(!1),b=cr(),[x,A]=nn(()=>typeof window=="undefined"?"claude":localStorage.getItem(js)||"claude"),[T,z]=nn(()=>{if(typeof window=="undefined")return 0;let S=localStorage.getItem(Ri);return S&&parseInt(S,10)||0}),[P,O]=nn([]),[k,G]=nn({}),[re,oe]=nn({});zt(()=>{a.isConnected&&ca(c).then(S=>{if(!S)return;let C=Object.entries(S.providers).filter(([,Ae])=>Ae.available).map(([Ae])=>Ae);C.length>0&&O(C);let le={};for(let[Ae,ke]of Object.entries(S.providers))ke.models&&ke.models.length>0&&(le[Ae]=ke.models);G(le);let ce={};for(let[Ae,ke]of Object.entries(S.providers))ke.mcp&&(ce[Ae]=ke.mcp);oe(ce)})},[a.isConnected,a.capabilitiesVersion,c]),zt(()=>{if(P.length>0&&!P.includes(x)){let S=P[0];A(S),localStorage.setItem(js,S)}},[P,x]);let W=x==="codex"?[...Ti]:x==="copilot"?[...As]:[...ki],Q=k[x]&&k[x].length>0?k[x]:W,N=(je=Q[T])!=null?je:Q[0];zt(()=>{T>=Q.length&&(z(0),localStorage.setItem(Ri,"0"))},[T,Q.length]);let ee=dn(S=>{let C=x;A(S),localStorage.setItem(js,S);let le=qg(C,S,T);z(le),localStorage.setItem(Ri,String(le))},[x,T]),M=dn(S=>{z(S),localStorage.setItem(Ri,String(S))},[]),[Le,V]=nn(new Set),[fe,D]=nn(null),[ae,I]=nn(null),[pe,me]=nn(null),[Fe,we]=nn(null);zt(()=>{a.isConnected&&ir(c).then(S=>{S!=null&&S.components&&V(new Set(Object.keys(S.components)))})},[a.isConnected,c]);let Je=dn(async S=>{let C=[];for(let le of S)try{(await pa(le,c)).added&&C.push(le)}catch(ce){console.error("[Popmelt] Failed to add component to model:",le,ce)}C.length>0&&(V(le=>{let ce=new Set(le);for(let Ae of C)ce.add(Ae);return ce}),D(C[C.length-1]))},[c]),Re=dn(S=>{D(S)},[]),Ce=dn(()=>{ir(c).then(S=>{S!=null&&S.components&&V(new Set(Object.keys(S.components)))})},[c]),at=dn(async S=>{try{(await fa(S,c)).removed&&V(le=>{let ce=new Set(le);return ce.delete(S),ce})}catch(C){console.error("[Popmelt] Failed to remove component from model:",C)}},[c]),gt=dn((S,C)=>{s({type:"MODIFY_SPACING_TOKEN",payload:S}),s({type:"ADD_SPACING_TOKEN_CHANGE",payload:C})},[s]),bt=dn((S,C)=>{s({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:S,originalValue:C}})},[s]),[Yt,K]=nn(null),[X,Te]=nn(()=>typeof window=="undefined"?null:localStorage.getItem(Js)||null);zt(()=>{X?localStorage.setItem(Js,X):localStorage.removeItem(Js)},[X]);let[Oe,Xe]=nn(0),Pe=tn([]);zt(()=>{let S=Pe.current,C=i.spacingTokenMods;Pe.current=C;let le=new Map(S.map(ke=>[ke.tokenPath,ke])),ce=new Map(C.map(ke=>[ke.tokenPath,ke])),Ae=!1;for(let[ke,Ue]of ce){let Ye=le.get(ke);if(!(Ye&&Ye.currentValue===Ue.currentValue)){Ae=!0,Ue.currentValue==="__deleted__"?ga(ke,c).catch(Et=>console.error("[Popmelt] Failed to sync token delete:",Et)):Bi(ke,Ue.currentValue,c).catch(Et=>console.error("[Popmelt] Failed to sync token update:",Et));for(let Et of Ue.targets){let wt=document.querySelector(Et.selector);if(wt)if(Ue.currentValue==="__deleted__")wt.style.removeProperty(Et.property);else{let ht=Ue.currentPx;ht>0&&wt.style.setProperty(Et.property,`${ht}px`,"important")}}}}for(let[ke,Ue]of le)if(!ce.has(ke)){Ae=!0,Bi(ke,Ue.originalValue,c).catch(Ye=>console.error("[Popmelt] Failed to restore token on undo:",Ye));for(let Ye of Ue.targets){let Et=document.querySelector(Ye.selector);Et&&Et.style.removeProperty(Ye.property)}}Ae&&Xe(ke=>ke+1)},[i.spacingTokenMods,c]);let[he,te]=nn(()=>Da()),ie=dn(S=>{te(S),_a(S)},[]),[ve,Me]=nn(()=>typeof window=="undefined"?null:localStorage.getItem(Ys)||null),mt=tn(null),[Ne,ze]=nn(new Set),[nt,St]=nn(null);zt(()=>{ve?localStorage.setItem(Ys,ve):localStorage.removeItem(Ys)},[ve]);let Ke="popmelt-in-flight-jobs",[qe,Rt]=nn(()=>{try{let S=localStorage.getItem(Ke);return S?JSON.parse(S):{}}catch(S){return{}}});zt(()=>{try{Object.keys(qe).length>0?localStorage.setItem(Ke,JSON.stringify(qe)):localStorage.removeItem(Ke)}catch(S){}},[qe]),zt(()=>{let S=C=>{if(C.key===Ke)try{let le=C.newValue?JSON.parse(C.newValue):{};Rt(le)}catch(le){}};return window.addEventListener("storage",S),()=>window.removeEventListener("storage",S)},[]);let _n=tn(new Map),Kn=tn(new Map);zt(()=>{for(let[S,C]of Object.entries(qe))C.annotationIds.length>0&&_n.current.set(S,C.annotationIds),C.threadId&&Kn.current.set(S,C.threadId)},[qe]);let vn=tn("");zt(()=>{if(i.annotations.length===0)return;let S=Object.keys(qe).sort().join(",");if(S===vn.current)return;vn.current=S;let C=new Set;for(let ce of Object.values(qe))for(let Ae of ce.annotationIds)C.add(Ae);let le=i.annotations.filter(ce=>C.has(ce.id)?!1:!!(ce.status==="in_flight"||(ce.status==="pending"||!ce.status)&&(ce.captured||ce.threadId))).map(ce=>ce.id);le.length>0&&s({type:"SET_ANNOTATION_STATUS",payload:{ids:le,status:"dismissed"}})},[i.annotations,qe,s]);let It=fo(()=>{let S=new Set;for(let C of Object.values(qe))for(let le of C.annotationIds)S.add(le);return S},[qe]),qn=fo(()=>{let S=new Set(a.activeJobIds),C=new Set;for(let[le,ce]of Object.entries(qe))if(S.has(le))for(let Ae of ce.annotationIds)C.add(Ae);return C},[qe,a.activeJobIds]),on=fo(()=>{let S=new Set(a.activeJobIds),C=Object.entries(qe).filter(([Ae])=>!S.has(Ae)),le=C.length,ce=new Map;return C.forEach(([,Ae],ke)=>{let Ue=`(${ke+1}/${le})`;for(let Ye of Ae.annotationIds)ce.set(Ye,Ue)}),ce},[qe,a.activeJobIds]),Zn=fo(()=>{let S=new Set;for(let C of Object.values(qe))for(let le of C.styleSelectors)S.add(le);return S},[qe]),xt=fo(()=>{let S=new Map;for(let C of Object.values(qe)){for(let le of C.styleSelectors)S.set(le,C.color);for(let le of C.annotationIds){let ce=i.annotations.find(Ae=>Ae.id===le);if(ce&&(ce.linkedSelector&&S.set(ce.linkedSelector,C.color),ce.groupId))for(let Ae of i.annotations)Ae.groupId===ce.groupId&&Ae.linkedSelector&&S.set(Ae.linkedSelector,C.color)}}return S},[qe,i.annotations]),rn=tn(i.annotations);rn.current=i.annotations;let _t=tn(i.styleModifications);_t.current=i.styleModifications;let sn=tn(qe);sn.current=qe,zt(()=>{let S=null,C=()=>{var Ye,Et;if(Object.keys(sn.current).length>0)return;let ce=rn.current,Ae=_t.current,ke=[],Ue=[];for(let wt of ce){if(!wt.linkedSelector||!wt.linkedSelector.startsWith("[data-pm=")||wt.pathname||wt.captured||wt.status&&wt.status!=="pending")continue;let ht=document.querySelector(wt.linkedSelector);!ht&&((Et=(Ye=wt.elements)==null?void 0:Ye[0])!=null&&Et.selector)&&(ht=document.querySelector(wt.elements[0].selector)),ht||ke.push(wt.linkedSelector)}for(let wt of Ae)document.querySelector(wt.selector)||Ue.push(wt.selector);(ke.length>0||Ue.length>0)&&s({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:ke,styleSelectors:Ue}})},le=new MutationObserver(ce=>{ce.some(Ae=>Ae.removedNodes.length>0)&&(S&&clearTimeout(S),S=setTimeout(C,3e3))});return le.observe(document.body,{childList:!0,subtree:!0}),()=>{le.disconnect(),S&&clearTimeout(S)}},[s]);let Nn=tn(typeof window!="undefined"?window.location.pathname:"/");zt(()=>{let S=ce=>{if(g.current)return;let Ae=window.location.pathname;if(ce===Ae)return;let ke=rn.current.filter(Ye=>{var Et;return Ye.pathname===ce&&((Et=Ye.status)!=null?Et:"pending")==="pending"});if(console.log(`[Popmelt] Navigation from ${ce} \u2192 ${Ae}, ${ke.length} pending annotations on departing page`),ke.length===0)return;let Ue=l.current;if(!Ue){console.warn("[Popmelt] No canvas ref for capture-on-leave");return}if(Ar(document.body,Ue,ke,{dpr:1}).then(Ye=>Pr(Ye)).then(Ye=>{Ye?(u.current.set(ce,Ye),console.log(`[Popmelt] Cached screenshot for ${ce} (${(Ye.size/1024).toFixed(0)}KB)`)):console.warn(`[Popmelt] Capture-on-leave produced no blob for ${ce}`)}).catch(Ye=>{console.warn("[Popmelt] Capture-on-leave failed:",Ye)}),u.current.size>20){let Ye=[...u.current.entries()];u.current=new Map(Ye.slice(-10))}},C=ce=>{var ke;let Ae=(ke=ce.detail)==null?void 0:ke.prevPath;Ae&&(S(Ae),Nn.current=window.location.pathname)},le=()=>{let ce=Nn.current;S(ce),Nn.current=window.location.pathname};return window.addEventListener("popmelt:locationchange",C),window.addEventListener("popstate",le),()=>{window.removeEventListener("popmelt:locationchange",C),window.removeEventListener("popstate",le)}},[]),zt(()=>{a.lastCompletedJobId&&a.lastCompletedJobId in qe&&Rt(S=>{var ce;let Ae=S,{[ce=a.lastCompletedJobId]:C}=Ae;return jn(Ae,[Co(ce)])}),a.lastCompletedJobId&&a.lastCompletedJobId===Yt&&(Xe(S=>S+1),K(null))},[a.lastCompletedJobId,Yt]);let An=tn(new Set),Kt=tn(!1);zt(()=>{if(!a.isConnected){Kt.current=!1;return}Kt.current||(Kt.current=!0,rr(c).then(async S=>{var Ue,Ye,Et,wt;if(!S)return;let C=(Ue=S.activeJobs)!=null?Ue:[],le=(Ye=S.recentJobs)!=null?Ye:[],ce=new Set(C.map(ht=>ht.id)),Ae=JSON.parse(localStorage.getItem(Ke)||"{}"),ke=new Set;for(let ht of Object.values(Ae))if(ht.annotationIds)for(let kt of ht.annotationIds)ke.add(kt);Rt(ht=>{var Qn,kn,Vt;let kt=f({},ht),ut=Date.now();for(let pt of Object.keys(kt)){if(pt.startsWith("_pending_")){let Cn=parseInt(pt.replace(/^_pending_(?:reply_)?/,""),10);!isNaN(Cn)&&ut-Cn>3e4&&delete kt[pt];continue}ce.has(pt)||delete kt[pt]}for(let pt of C)!kt[pt.id]&&((Qn=pt.annotationIds)!=null&&Qn.length||pt.threadId)&&(kt[pt.id]={annotationIds:(kn=pt.annotationIds)!=null?kn:[],styleSelectors:[],color:(Vt=pt.color)!=null?Vt:"#888",threadId:pt.threadId});let Ut=new Set;for(let pt of le)if(pt.annotationIds)for(let Cn of pt.annotationIds)Ut.add(Cn);for(let pt of Object.keys(kt)){if(!pt.startsWith("_pending_"))continue;let Cn=kt[pt];Cn&&Cn.annotationIds.some(Ze=>Ut.has(Ze))&&delete kt[pt]}return kt});for(let ht of le)if(ht.status==="done"&&(Et=ht.annotationIds)!=null&&Et.length&&ht.annotationIds.some(kt=>ke.has(kt))&&!An.current.has(ht.id))try{let kt=await jr(c,ht.id);if(!kt)continue;let ut=kt.events.find(Ut=>Ut.type==="done");ut&&Array.isArray(ut.resolutions)&&(An.current.add(ht.id),s({type:"APPLY_RESOLUTIONS",payload:{resolutions:ut.resolutions,threadId:(wt=ut.threadId)!=null?wt:void 0}}))}catch(kt){}}))},[a.isConnected,c,s]),zt(()=>{let S=a.events.filter(C=>C.type==="done"&&C.data.resolutions);for(let C of S){let le=C.data.jobId;An.current.has(le)||(An.current.add(le),Array.isArray(C.data.resolutions)&&s({type:"APPLY_RESOLUTIONS",payload:{resolutions:C.data.resolutions,threadId:C.data.threadId}}))}},[a.events,s]);let Sn=tn(new Set);zt(()=>{let S=a.events.filter(C=>C.type==="error"&&C.data.cancelled);for(let C of S){let le=C.data.jobId;if(!le||Sn.current.has(le))continue;Sn.current.add(le);let ce=qe[le];ce&&ce.annotationIds.length>0&&s({type:"SET_ANNOTATION_STATUS",payload:{ids:ce.annotationIds,status:"dismissed"}})}},[a.events,qe,s]);let bn=tn(0);zt(()=>{let S=a.incrementalResolutions;if(S.length<=bn.current)return;let C=S.slice(bn.current);bn.current=S.length,s({type:"APPLY_RESOLUTIONS",payload:{resolutions:C}})},[a.incrementalResolutions,s]),zt(()=>{a.incrementalResolutions.length===0&&(bn.current=0)},[a.incrementalResolutions.length]);let $=dn(async()=>{let S=l.current;if(!S)return!1;let C=await Ar(document.body,S,i.annotations);if(C.length===0)return!1;let le=await ja(C,i.annotations,i.styleModifications);return le&&s({type:"MARK_CAPTURED"}),le},[i.annotations,i.styleModifications,s]),De=dn((S,C)=>{let le=p.current.get(S)||[];p.current.set(S,[...le,...C])},[]),Ge=dn(async()=>{var Cn;let S=l.current;if(!S)return!1;let C=i.annotations.filter(Ze=>{var Ot;return((Ot=Ze.status)!=null?Ot:"pending")==="pending"}),le=i.spacingTokenChanges.filter(Ze=>!Ze.captured);if(C.length===0&&i.styleModifications.filter(Ze=>!Ze.captured).length===0&&le.length===0)return!1;let ce=new Map;for(let Ze of C){let Ot=Ze.pathname||b;ce.has(Ot)||ce.set(Ot,[]),ce.get(Ot).push(Ze)}let Ae=new Map,ke=[...ce.keys()].filter(Ze=>Ze!==b);if(ke.length>0){let Ze=b,Ot={x:window.scrollX,y:window.scrollY};g.current=!0;for(let Zt of ke)try{console.log(`[Popmelt] Navigating to ${Zt} for screenshot capture`),await Dc(Zt,o),window.location.pathname!==Zt&&console.warn(`[Popmelt] Navigation to ${Zt} did not take effect (at ${window.location.pathname})`);let Tn=ce.get(Zt)||[],Po=await Ar(document.body,S,Tn,{dpr:1}),Oo=await Pr(Po);Oo&&(Ae.set(Zt,Oo),console.log(`[Popmelt] Captured ${Zt} (${(Oo.size/1024).toFixed(0)}KB)`))}catch(Tn){console.warn(`[Popmelt] Failed to capture ${Zt}:`,Tn)}await Dc(Ze,o),window.scrollTo(Ot.x,Ot.y),g.current=!1}let Ue=C.filter(Ze=>(Ze.pathname||b)===b),Ye=await Ar(document.body,S,Ue.length>0?i.annotations:[],{dpr:1});if(Ye.length>0){let Ze=await Pr(Ye);Ze&&Ae.set(b,Ze)}if(Ae.size===0)return!1;let Et=Fi(C,i.styleModifications,void 0,le.length>0?le:void 0),wt=JSON.stringify(Et),ht=new Map;for(let Ze of C){let Ot=p.current.get(Ze.id);if(Ot&&Ot.length>0&&ht.set(Ze.id,Ot),Ze.groupId){for(let Zt of C)if(Zt.groupId===Ze.groupId&&Zt.id!==Ze.id){let Tn=p.current.get(Zt.id);Tn&&Tn.length>0&&ht.set(Zt.id,Tn)}}}let kt=ce.size>1;console.log(`[Popmelt] Submit: ${ce.size} page(s), ${Ae.size} screenshot(s), pages: [${[...ce.keys()].join(", ")}], cached: [${[...u.current.keys()].join(", ")}]`);let ut=kt?Ae:(Cn=Ae.get(b))!=null?Cn:Ae,Ut=C.map(Ze=>Ze.id),Qn=i.styleModifications.filter(Ze=>!Ze.captured).map(Ze=>Ze.selector),kn=Hi(i.activeColor),Vt=`_pending_${Date.now()}`,pt={annotationIds:Ut,styleSelectors:Qn,color:i.activeColor,threadId:void 0};try{let Ze=JSON.parse(localStorage.getItem(Ke)||"{}");Ze[Vt]=pt,localStorage.setItem(Ke,JSON.stringify(Ze))}catch(Ze){}Rt(Ze=>h(f({},Ze),{[Vt]:pt}));try{let{jobId:Ze,threadId:Ot}=await ua(ut,wt,c,kn,x,N.id,ht.size>0?ht:void 0,Ni());for(let Gn of ht.keys())p.current.delete(Gn);for(let Gn of ce.keys())u.current.delete(Gn);let Zt=h(f({},pt),{threadId:Ot});try{let Gn=JSON.parse(localStorage.getItem(Ke)||"{}");delete Gn[Vt],Gn[Ze]=Zt,localStorage.setItem(Ke,JSON.stringify(Gn))}catch(Gn){}Rt(Gn=>{let Pi=Gn,{[Vt]:Vs}=Pi,Ai=jn(Pi,[Co(Vt)]);return h(f({},Ai),{[Ze]:Zt})}),s({type:"MARK_CAPTURED"}),Ot&&Ut.length>0&&s({type:"SET_ANNOTATION_THREAD",payload:{ids:Ut,threadId:Ot}});let Tn=i.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),Oo=((Tn!=null&&Tn[1]?parseFloat(Tn[1]):29)+60)%360;return s({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${Oo})`}),!0}catch(Ze){try{let Ot=JSON.parse(localStorage.getItem(Ke)||"{}");delete Ot[Vt],localStorage.setItem(Ke,JSON.stringify(Ot))}catch(Ot){}return Rt(Ot=>{let Po=Ot,{[Vt]:Zt}=Po;return jn(Po,[Co(Vt)])}),console.error("[Pare] Failed to send to bridge:",Ze),!1}},[i.annotations,i.styleModifications,i.spacingTokenChanges,i.activeColor,s,c,x,N.id,b,o]),En=dn(async()=>{if(X){Me(X);return}try{let{jobId:S,threadId:C}=await ha(c,x,N.id);K(S),Te(C);let le={annotationIds:[],styleSelectors:[],color:"#6b7280",threadId:C};Rt(ce=>h(f({},ce),{[S]:le})),Me(C)}catch(S){console.error("[Popmelt] Failed to start synthesize:",S)}},[c,x,N.id,X]),At=dn(async(S,C,le)=>{var Et,wt,ht,kt;let ce=(kt=(ht=(Et=Object.values(sn.current).find(ut=>ut.threadId===S))==null?void 0:Et.color)!=null?ht:(wt=i.annotations.find(ut=>ut.threadId===S))==null?void 0:wt.color)!=null?kt:i.activeColor,Ae=i.annotations.filter(ut=>ut.threadId===S&&(ut.status==="waiting_input"||ut.status==="resolved"||ut.status==="needs_review")),ke=Ae.map(ut=>ut.id),Ue=`_pending_reply_${Date.now()}`,Ye={annotationIds:ke,styleSelectors:[],color:ce,threadId:S};try{let ut=JSON.parse(localStorage.getItem(Ke)||"{}");ut[Ue]=Ye,localStorage.setItem(Ke,JSON.stringify(ut))}catch(ut){}Rt(ut=>h(f({},ut),{[Ue]:Ye}));try{let ut=Hi(i.activeColor),{jobId:Ut}=await ya(S,C,c,ut,x,N.id,le,Ni()),Qn=f({},Ye);try{let kn=JSON.parse(localStorage.getItem(Ke)||"{}");delete kn[Ue],kn[Ut]=Qn,localStorage.setItem(Ke,JSON.stringify(kn))}catch(kn){}Rt(kn=>{let Cn=kn,{[Ue]:Vt}=Cn,pt=jn(Cn,[Co(Ue)]);return h(f({},pt),{[Ut]:Qn})}),Ae.length>0&&s({type:"SET_ANNOTATION_STATUS",payload:{ids:ke,status:"in_flight"}}),a.dismissQuestion(S)}catch(ut){try{let Ut=JSON.parse(localStorage.getItem(Ke)||"{}");delete Ut[Ue],localStorage.setItem(Ke,JSON.stringify(Ut))}catch(Ut){}Rt(Ut=>{let Vt=Ut,{[Ue]:Qn}=Vt;return jn(Vt,[Co(Ue)])}),console.error("[Pare] Failed to send reply:",ut)}},[i.activeColor,i.annotations,c,a.dismissQuestion,s,x,N.id]),qt=tn(new Set);zt(()=>{for(let S of a.pendingQuestions){if(qt.current.has(S.jobId))continue;qt.current.add(S.jobId);let C=S.annotationIds&&S.annotationIds.length>0?S.annotationIds:void 0;!C&&S.threadId&&(C=i.annotations.filter(le=>le.threadId===S.threadId).map(le=>le.id)),C&&C.length>0&&s({type:"SET_ANNOTATION_QUESTION",payload:{ids:C,question:S.question,threadId:S.threadId}})}},[a.pendingQuestions,s,i.annotations]);let wn=fo(()=>{if(a.activeJobId&&a.activeJobId in qe)return qe[a.activeJobId].color;let S=Object.values(qe);return S.length>0?S[S.length-1].color:void 0},[a.activeJobId,qe]),Wt=dn(S=>{Me(S)},[]),Gt=dn(S=>{var ce;let C=qe[S],le=(C==null?void 0:C.threadId)||Kn.current.get(S);le&&(mt.current=(ce=C==null?void 0:C.color)!=null?ce:null,Me(le))},[qe]),Pn=dn(S=>{if(!S){St(null);return}let C=_n.current.get(S);C&&C.length>0?St(new Set(C)):St(null)},[]),Nt=dn(async S=>{try{let C=S?`${c}/cancel?jobId=${S}`:`${c}/cancel`;await fetch(C,{method:"POST"})}catch(C){}},[c]);zt(()=>{i.activeTool==="model"&&ve&&ve!==X&&Me(null)},[i.activeTool]);let lt=tn(null);zt(()=>{i.isAnnotating?lt.current&&(Me(lt.current),lt.current=null):ve&&(lt.current=ve,Me(null))},[i.isAnnotating]);let Ht=fo(()=>{if(!ve)return null;for(let[S,C]of Object.entries(qe))if(C.threadId===ve)return S;for(let[S,C]of Object.entries(a.activeJobThreads))if(C===ve)return S;return null},[ve,qe,a.activeJobThreads]),Jt=ve?i.annotations.find(S=>S.threadId===ve):void 0,nr=fo(()=>Ht?a.events.filter(S=>S.data.jobId===Ht):Vg,[Ht,a.events.length]),go=fo(()=>{var S,C;return(C=(S=Jt==null?void 0:Jt.color)!=null?S:mt.current)!=null?C:i.activeColor},[Jt==null?void 0:Jt.color,i.activeColor]),Ao=Jt?i.annotations.indexOf(Jt)+1:void 0;zt(()=>{var C;let S=(C=Jt==null?void 0:Jt.color)!=null?C:mt.current;ve&&S&&s({type:"SET_COLOR",payload:S})},[ve]);let[ao,mo]=nn(!1),[or,w]=nn(0),H=tn(null),q=dn(S=>{S?(H.current&&(clearTimeout(H.current),H.current=null),mo(!0)):H.current=setTimeout(()=>{mo(!1),H.current=null},150)},[]),ye=dn(()=>{w(S=>S+1),a.clearEvents(),Me(null),ze(new Set),Nt()},[a.clearEvents,Nt]);zt(()=>()=>{H.current&&clearTimeout(H.current)},[]);let[de,ge]=nn(!1);zt(()=>{ge(!0)},[]);let He=fo(()=>({isEnabled:t}),[t]);return!t||!de?Ir(Us.Provider,{value:He,children:e}):_c(Us.Provider,{value:He,children:[e,Ir(Vl,{state:i,dispatch:s,onScreenshot:$,inFlightAnnotationIds:It,activeAnnotationIds:qn,queuePositionMap:on,inFlightStyleSelectors:Zn,inFlightSelectorColors:xt,onAttachImages:De,onReply:a.isConnected?At:void 0,onViewThread:a.isConnected?Wt:void 0,onCloseThread:S=>{Me(null),S&&ze(C=>new Set(C).add(S))},onModelComponentsAdd:a.isConnected?Je:void 0,onModelComponentFocus:a.isConnected?Re:void 0,onModelComponentHover:I,modelComponentNames:Le,modelPanelHoveredComponent:pe,modelSpacingTokenHover:Fe,highlightedAnnotationIds:nt,focusedThreadAnnotationId:Jt==null?void 0:Jt.id,externalCanvasRef:l,toolbarRef:d}),Ir(Tc,{children:_c(Ec,{children:[Ir(vc,{state:i,dispatch:s,onScreenshot:$,onSendToClaude:a.isConnected?Ge:void 0,hasActiveJobs:Object.keys(qe).length>0||a.activeJobIds.length>0,activeJobColor:wn,onCrosshairHover:q,onClear:ye,provider:x,onProviderChange:a.isConnected&&P.length>1?ee:void 0,availableProviders:P,modelIndex:T,modelCount:Q.length,modelLabel:N.label,onModelChange:a.isConnected?M:void 0,onViewThread:a.isConnected?Wt:void 0,isThreadPanelOpen:ve!==null&&ve!==X,mcpStatus:re,bridgeUrl:c,isBridgeConnected:a.isConnected,modelSelectedComponent:fe,modelCanvasHoveredComponent:ae,onModelComponentHover:me,onSpacingTokenHover:we,onModifySpacingToken:a.isConnected?gt:void 0,onDeleteSpacingToken:a.isConnected?bt:void 0,modelRefreshKey:Oe,onModelComponentAdded:Ce,onModelComponentRemoved:at,onSynthesizeRules:a.isConnected&&x!=="copilot"?En:void 0,isSynthesizing:Yt!==null,toolbarRef:d,snapPosition:he,onSnapPositionChange:ie}),ve&&Ir(Bc,{threadId:ve,bridgeUrl:c,accentColor:go,isStreaming:Ht!==null,isQueued:Ht!==null&&!a.activeJobIds.includes(Ht),queuePosition:Ht&&!a.activeJobIds.includes(Ht)?(()=>{let S=new Set(a.activeJobIds),C=Object.keys(qe).filter(ce=>!S.has(ce)),le=C.indexOf(Ht);return le>=0?`(${le+1}/${C.length})`:void 0})():void 0,streamingEvents:nr,onClose:()=>Me(null),onReply:At,onCancel:Ht?()=>Nt(Ht):void 0,lastError:(un=(Pt=a.lastErrorByJob)==null?void 0:Pt[Ht!=null?Ht:""])!=null?un:a.lastCompletedJobId&&Kn.current.get(a.lastCompletedJobId)===ve?(Ft=a.lastErrorByJob)==null?void 0:Ft[a.lastCompletedJobId]:void 0,toolbarRef:d,currentModel:N.id,currentProvider:x,annotationNumber:Ao,annotationText:Jt==null?void 0:Jt.text}),Ir(Cc,{bridge:a,bridgeUrl:c,inFlightJobs:qe,isVisible:ao||a.lastResponseText!==null||a.activeJobIds.length>0,onHover:q,clearSignal:or,onReply:At,onViewThread:Wt,onClickJob:Gt,onCancel:Nt,onHoverJob:Pn,isConnected:a.isConnected,dismissedThreadIds:Ne,snapPosition:he})]})})]})}function Qg(){let e=Ug(Us);if(!e)throw new Error("usePopmelt must be used within PopmeltProvider");return e}export{Zg as PopmeltProvider,Qg as usePopmelt};