@popmelt.com/core 0.5.17 → 0.5.19

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,19 +1,20 @@
1
1
  "use client";
2
- var ka=Object.defineProperty,Ca=Object.defineProperties;var Ma=Object.getOwnPropertyDescriptors;var qo=Object.getOwnPropertySymbols;var hs=Object.prototype.hasOwnProperty,ys=Object.prototype.propertyIsEnumerable;var ms=(e,t,o)=>t in e?ka(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,f=(e,t)=>{for(var o in t||(t={}))hs.call(t,o)&&ms(e,o,t[o]);if(qo)for(var o of qo(t))ys.call(t,o)&&ms(e,o,t[o]);return e},h=(e,t)=>Ca(e,Ma(t));var Qo=e=>typeof e=="symbol"?e:e+"",Hn=(e,t)=>{var o={};for(var r in e)hs.call(e,r)&&t.indexOf(r)<0&&(o[r]=e[r]);if(e!=null&&qo)for(var r of qo(e))t.indexOf(r)<0&&ys.call(e,r)&&(o[r]=e[r]);return o};import{createContext as Pp,useCallback as Gt,useContext as Bp,useEffect as zt,useMemo as Ao,useRef as Xt,useState as Ut}from"react";import{useCallback as Ts,useEffect as Ta,useSyncExternalStore as La}from"react";var Cn="http://localhost:1111";function kn(e,t={},o=15e3){let r=new AbortController;t.signal&&t.signal.addEventListener("abort",()=>r.abort());let n=setTimeout(()=>r.abort(),o);return fetch(e,h(f({},t),{signal:r.signal})).finally(()=>clearTimeout(n))}async function xs(e=Cn){try{let t=await kn(`${e}/capabilities`,{},5e3);return t.ok?await t.json():null}catch(t){return null}}async function er(e=Cn){try{let t=new AbortController,o=setTimeout(()=>t.abort(),2e3),r=await fetch(`${e}/status`,{signal:t.signal});return clearTimeout(o),r.ok?await r.json():null}catch(t){return null}}async function bs(e){try{let t=new AbortController,o=setTimeout(()=>t.abort(),500),r=await fetch(`http://localhost:${e}/status`,{signal:t.signal});return clearTimeout(o),r.ok?await r.json():null}catch(t){return null}}async function vs(e){if(e&&e!=="http://localhost:1111")try{let c=new URL(e);return{url:e,port:parseInt(c.port,10)||1111}}catch(c){return null}let n=typeof window!="undefined"?window.location.origin:null,i=await bs(1111);if(i&&i.devOrigin&&n&&i.devOrigin===n)return{url:"http://localhost:1111",port:1111};let s=Array.from({length:8},(c,d)=>{let u=1112+d;return bs(u).then(p=>p?{status:p,port:u}:null)}),l=(await Promise.all(s)).filter(c=>c!==null),a=[];i&&a.push({port:1111,devOrigin:i.devOrigin});for(let c of l)a.push({port:c.port,devOrigin:c.status.devOrigin});if(n){let c=a.find(d=>d.devOrigin===n);if(c)return{url:`http://localhost:${c.port}`,port:c.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 Ss(e,t,o=Cn,r,n,i,s,l){let a=new FormData;if(a.append("screenshot",e,"screenshot.png"),a.append("feedback",t),r&&a.append("color",r),n&&a.append("provider",n),i&&a.append("model",i),l&&a.append("sourceId",l),s)for(let[d,u]of s)for(let p=0;p<u.length;p++)a.append(`image-${d}-${p}`,u[p],`image-${d}-${p}.png`);let c=await kn(`${o}/send`,{method:"POST",body:a},3e4);if(!c.ok){let d=await c.text();throw new Error(`Bridge returned ${c.status}: ${d}`)}return c.json()}async function ws(e=Cn,t){try{let o=await kn(`${e}/mcp/install`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(t?{serverUrl:t}:{})},15e3);return o.ok?await o.json():null}catch(o){return null}}async function Es(e,t=Cn){let o=await kn(`${t}/model/component`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!o.ok){let r=await o.text();throw new Error(`Bridge returned ${o.status}: ${r}`)}return o.json()}async function ks(e,t=Cn){let o=await kn(`${t}/model/component`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!o.ok){let r=await o.text();throw new Error(`Bridge returned ${o.status}: ${r}`)}return o.json()}async function Ar(e,t,o=Cn){let r=await kn(`${o}/model/token`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e,value:t})},1e4);if(!r.ok){let n=await r.text();throw new Error(`Bridge returned ${r.status}: ${n}`)}return r.json()}async function Cs(e,t=Cn){let o=await kn(`${t}/model/token`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e})},1e4);if(!o.ok){let r=await o.text();throw new Error(`Bridge returned ${o.status}: ${r}`)}return o.json()}async function io(e=Cn){var t;try{let o=await kn(`${e}/model`,{},5e3);return o.ok&&(t=(await o.json()).model)!=null?t:null}catch(o){return null}}async function Ms(e,t,o=Cn,r,n,i,s,l){let a;if(s&&s.length>0){let c=new FormData,d=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"});c.append("screenshot",d,"screenshot.png"),c.append("feedback",JSON.stringify({threadId:e,reply:t,color:r,provider:n,model:i,sourceId:l}));for(let u=0;u<s.length;u++)c.append(`image-reply-${u}`,s[u],`reply-image-${u}.png`);a=await kn(`${o}/reply`,{method:"POST",body:c},3e4)}else a=await kn(`${o}/reply`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({threadId:e,reply:t,color:r,provider:n,model:i,sourceId:l})},3e4);if(!a.ok){let c=await a.text();throw new Error(`Bridge returned ${a.status}: ${c}`)}return a.json()}var As=typeof crypto!="undefined"&&typeof crypto.randomUUID=="function"?crypto.randomUUID():Math.random().toString(36).slice(2);function Br(){return As}var Ia={isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,lastErrorByJob:{},pendingQuestions:[],incrementalResolutions:[],capabilitiesVersion:0},tr=f({},Ia),Pr=new Set,so=null,Ls=null,Yn=null,Is=0,ao=null,lo=null;async function Ra(e){return e&&e!=="http://localhost:1111"?(ao=e,e):ao||lo||(lo=vs(e).then(o=>{var r;return ao=(r=o==null?void 0:o.url)!=null?r:null,lo=null,ao}).catch(()=>(lo=null,null)),lo)}function Ps(){return ao}function Rs(){return tr}function Aa(e){return Pr.add(e),()=>{Pr.delete(e)}}function tn(e){tr=e(tr);for(let t of Pr)t()}function Bs(e){if(so&&so.readyState!==EventSource.CLOSED&&Ls===e)return;so&&(so.close(),so=null),Yn&&(clearTimeout(Yn),Yn=null),Ls=e;let t=++Is,o=new EventSource(`${e}/events?sourceId=${As}`);so=o;let r=()=>t!==Is;o.addEventListener("connected",()=>{r()||er(e).then(n=>{var d,u;if(r())return;let i=(d=n==null?void 0:n.activeJobs)!=null?d:n!=null&&n.activeJob?[n.activeJob]:[],s=new Set(i.map(p=>p.id)),l=(u=n==null?void 0:n.recentJobs)!=null?u:[],a=new Map(l.map(p=>[p.id,p])),c=i.length>0;tn(p=>{let g=f({},p.lastErrorByJob),S=p.activeJobIds.filter(b=>!s.has(b));for(let b of S){let w=a.get(b);(w==null?void 0:w.status)==="error"&&w.error&&(g[b]=w.error)}let v=p.activeJobIds.filter(b=>s.has(b));for(let b of s)v.includes(b)||v.push(b);return h(f({},p),{isConnected:!0,status:c?"streaming":S.length>0||p.status==="disconnected"?"idle":p.status,activeJobId:c?i[i.length-1].id:v.length>0?v[v.length-1]:null,activeJobIds:v,lastErrorByJob:g,lastCompletedJobId:S.length>0?S[S.length-1]:p.lastCompletedJobId})})})}),o.addEventListener("job_started",n=>{if(r())return;let i=JSON.parse(n.data),s=i.jobId;tn(l=>h(f({},l),{status:"streaming",activeJobId:s,activeJobIds:[...l.activeJobIds,s],jobResponses:h(f({},l.jobResponses),{[s]:""}),jobThinking:h(f({},l.jobThinking),{[s]:""}),currentResponse:"",currentThinking:"",lastResponseText:null,lastThreadId:null,events:[...l.events,{type:"job_started",data:i,timestamp:Date.now()}]}))}),o.addEventListener("delta",n=>{if(r())return;let i=JSON.parse(n.data),s=i.jobId,l=i.text||"";tn(a=>h(f({},a),{jobResponses:s?h(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()}]}))}),o.addEventListener("thinking",n=>{if(r())return;let i=JSON.parse(n.data),s=i.jobId,l=i.text||"";tn(a=>h(f({},a),{jobThinking:s?h(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()}]}))}),o.addEventListener("tool_use",n=>{if(r())return;let i=JSON.parse(n.data);tn(s=>h(f({},s),{events:[...s.events,{type:"tool_use",data:i,timestamp:Date.now()}]}))}),o.addEventListener("done",n=>{if(r())return;let i=JSON.parse(n.data),s=i.jobId;tn(l=>{var g;let a=s?l.activeJobIds.filter(S=>S!==s):l.activeJobIds,c=f({},l.jobResponses),d=f({},l.jobThinking),u=s?c[s]:void 0;s&&(delete c[s],delete d[s]);let p=s===l.activeJobId?a.length>0?a[a.length-1]:null:l.activeJobId;return h(f(h(f({},l),{activeJobIds:a,activeJobId:p,jobResponses:c,jobThinking:d,lastCompletedJobId:s!=null?s:l.activeJobId,lastResponseText:u||l.currentResponse||i.responseText||null,lastThreadId:(g=i.threadId)!=null?g:null}),s===l.activeJobId?{currentResponse:p&&c[p]||"",currentThinking:p&&d[p]||""}:{}),{events:[...l.events,{type:"done",data:i,timestamp:Date.now()}]})})}),o.addEventListener("question",n=>{if(r())return;let i=JSON.parse(n.data);tn(s=>h(f({},s),{pendingQuestions:[...s.pendingQuestions,{jobId:i.jobId,threadId:i.threadId,question:i.question,annotationIds:i.annotationIds,timestamp:Date.now()}],events:[...s.events,{type:"question",data:i,timestamp:Date.now()}]}))}),o.addEventListener("capabilities_changed",()=>{r()||tn(n=>h(f({},n),{capabilitiesVersion:n.capabilitiesVersion+1}))}),o.addEventListener("queue_drained",()=>{r()||tn(n=>h(f({},n),{status:n.status==="error"?"error":"idle",activeJobId:null,activeJobIds:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastErrorByJob:{},incrementalResolutions:[]}))}),o.addEventListener("error",n=>{var i,s;if(!r()){if(o.readyState===EventSource.CLOSED)tn(l=>h(f({},l),{isConnected:!1,status:"disconnected"})),Yn&&(clearTimeout(Yn),Yn=null),Yn=setTimeout(()=>{er(e).then(l=>{l&&Bs(e)})},5e3);else if(n instanceof MessageEvent){let l=JSON.parse(n.data),a=(i=l.jobId)!=null?i:null,c=(s=l.message)!=null?s:"";tn(d=>{let u=a?d.activeJobIds.filter(g=>g!==a):d.activeJobIds,p=u.length>0?d.status:"error";return h(f({},d),{status:p,activeJobIds:u,lastCompletedJobId:a!=null?a:d.activeJobId,lastErrorByJob:a&&c?h(f({},d.lastErrorByJob),{[a]:c}):d.lastErrorByJob,events:[...d.events,{type:"error",data:l,timestamp:Date.now()}]})})}}}),o.onerror=()=>{r()||o.readyState===EventSource.CLOSED&&tn(n=>h(f({},n),{isConnected:!1,status:"disconnected"}))}}function Os(e="http://localhost:1111"){let t=La(Aa,Rs,Rs);Ta(()=>{Ra(e).then(n=>{n&&er(n).then(i=>{i&&Bs(n)})})},[e]);let o=Ts(()=>{tn(()=>h(f({},tr),{events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,lastErrorByJob:{},incrementalResolutions:[]}))},[]),r=Ts(n=>{tn(i=>h(f({},i),{pendingQuestions:i.pendingQuestions.filter(s=>s.threadId!==n)}))},[]);return h(f({},t),{clearEvents:o,dismissQuestion:r})}import{useEffect as Pa,useReducer as Ba}from"react";var Oa={isAnnotating:!1,activeTool:"inspector",activeColor:"#ff0000",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function nr(){return Math.random().toString(36).substring(2,9)}function Ds(e){return e.status?e:e.captured?h(f({},e),{status:"in_flight"}):h(f({},e),{status:"pending"})}function Zt(e){return h(f({},e),{undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}],redoStack:[]})}function Da(e,t){return h(f({},e),{isAnnotating:t})}function Ha(e,t){return h(f({},e),{activeTool:t,inspectedElement:null})}function Fa(e,t){return h(f({},e),{activeColor:t})}function Na(e,t){return h(f({},e),{strokeWidth:t})}function _a(e,t){return h(f({},e),{currentPath:[t]})}function za(e,t){return h(f({},e),{currentPath:[...e.currentPath,t]})}function $a(e){return h(f({},e),{currentPath:[]})}function Wa(e,t){if(e.currentPath.length<2&&e.activeTool!=="text")return h(f({},e),{currentPath:[]});let o={id:nr(),type:e.activeTool,points:e.currentPath,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",groupId:t==null?void 0:t.groupId,elements:t==null?void 0:t.elements},r=Zt(e);return h(f({},r),{annotations:[...e.annotations,o],currentPath:[]})}function Ya(e,t){var n;let o=f({id:(n=t.id)!=null?n:nr(),type:"text",points:[t.point],text:t.text,fontSize:t.fontSize||12,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",groupId:t.groupId,linkedSelector:t.linkedSelector,linkedAnchor:t.linkedAnchor,elements:t.elements},t.imageCount?{imageCount:t.imageCount}:{}),r=t.groupId?e:Zt(e);return h(f({},r),{annotations:[...e.annotations,o]})}function ja(e,t){let o=Zt(e);return h(f({},o),{annotations:e.annotations.map(r=>r.id===t.id?f(h(f({},r),{text:t.text}),t.imageCount!=null?{imageCount:t.imageCount}:{}):r)})}function Ga(e,t){return h(f({},e),{annotations:e.annotations.map(o=>o.id===t.id?h(f({},o),{fontSize:Math.max(12,Math.min(72,t.fontSize))}):o)})}function Va(e,t){let o=Zt(e),r=e.annotations.find(i=>i.id===t.id),n=r==null?void 0:r.groupId;return h(f({},o),{annotations:e.annotations.filter(i=>i.id!==t.id&&!(n&&i.groupId===n))})}function Ua(e,t){let o=t.saveUndo?Zt(e):e,r=e.annotations.find(i=>i.id===t.id),n=r==null?void 0:r.groupId;return h(f({},o),{annotations:e.annotations.map(i=>{if(!(i.id===t.id||n&&i.groupId===n))return i;let l=t.delta.x,a=t.delta.y;return h(f({},i),{points:i.points.map(c=>({x:c.x+l,y:c.y+a}))})})})}function Ja(e,t){let o=t.saveUndo?Zt(e):e,r=e.annotations.find(s=>s.id===t.id);if(!r||r.type==="text"||r.points.length<2)return e;let n=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),c=r.points[0],d=r.points[r.points.length-1],u=Math.min(c.x,d.x),p=Math.max(c.y,d.y);n=l-u,i=a-p}return h(f({},o),{annotations:e.annotations.map(s=>s.id===t.id?h(f({},s),{points:t.points}):r.groupId&&s.groupId===r.groupId&&s.type==="text"?h(f({},s),{points:s.points.map(l=>({x:l.x+n,y:l.y+i}))}):s)})}function Xa(e,t){let o=Zt(e);return h(f({},o),{annotations:[...e.annotations,...t.annotations.map(Ds)]})}function Ka(e,t){let o=new Set,r=[];for(let n of t.annotations)o.has(n.id)||(o.add(n.id),r.push(Ds(n)));return h(f({},e),{annotations:r})}function Za(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 qa(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 Qa(e,t){let{id:o,addToSelection:r}=t;if(o===null)return h(f({},e),{selectedAnnotationIds:[],lastSelectedId:null});if(r)if(e.selectedAnnotationIds.includes(o)){let i=e.selectedAnnotationIds.filter(s=>s!==o);return h(f({},e),{selectedAnnotationIds:i,lastSelectedId:i.length>0?i[i.length-1]:null})}else return h(f({},e),{selectedAnnotationIds:[...e.selectedAnnotationIds,o],lastSelectedId:o});return h(f({},e),{selectedAnnotationIds:[o],lastSelectedId:o})}function ec(e,t){let o=new Set;for(let r of e.selectedAnnotationIds){let n=e.annotations.find(i=>i.id===r);n!=null&&n.groupId&&o.add(n.groupId)}return h(f({},e),{annotations:e.annotations.map(r=>{let n=e.selectedAnnotationIds.includes(r.id),i=r.groupId&&o.has(r.groupId);return!n&&!i?r:h(f({},r),{color:t.color})})})}function tc(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 nc(e){return h(f({},e),{annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]})}function oc(e,t){return h(f({},e),{inspectedElement:t})}function rc(e,t){let{selector:o,element:r,property:n,original:i,modified:s}=t,l=e.styleModifications.findIndex(a=>a.selector===o);if(i===s&&l<0)return e;if(l>=0){let a=e.styleModifications[l];if(a.captured){let g=Zt(e),S=g.styleModifications.map((v,b)=>b===l?h(f({},v),{changes:[{property:n,original:i,modified:s}],captured:!1}):v);return h(f({},g),{styleModifications:S})}let c=a.changes.findIndex(g=>g.property===n),d,u=e;if(c>=0){let g=a.changes[c];s===g.original?d=a.changes.filter((S,v)=>v!==c):d=a.changes.map((S,v)=>v===c?h(f({},S),{modified:s}):S)}else{if(i===s)return e;u=Zt(e),d=[...a.changes,{property:n,original:i,modified:s}]}if(d.length===0)return h(f({},u),{styleModifications:u.styleModifications.filter((g,S)=>S!==l)});let p=u.styleModifications.map((g,S)=>S===l?h(f({},g),{changes:d}):g);return h(f({},u),{styleModifications:p})}else{let a=Zt(e),c={selector:o,element:r,changes:[{property:n,original:i,modified:s}]};return h(f({},a),{styleModifications:[...a.styleModifications,c]})}}function ic(e,t){let{selector:o,durableSelector:r,element:n,changes:i}=t,s=i.filter(c=>c.original!==c.modified);if(s.length===0)return e;let l=Zt(e),a=l.styleModifications.findIndex(c=>c.selector===o);if(a>=0){let c=l.styleModifications[a],d=c.captured?[]:[...c.changes];for(let u of s){let p=d.findIndex(g=>g.property===u.property);p>=0?u.modified===d[p].original?d=d.filter((g,S)=>S!==p):d=d.map((g,S)=>S===p?h(f({},g),{modified:u.modified}):g):d.push(u)}return d.length===0?h(f({},l),{styleModifications:l.styleModifications.filter((u,p)=>p!==a)}):h(f({},l),{styleModifications:l.styleModifications.map((u,p)=>p===a?h(f({},u),{changes:d,captured:!1}):u)})}else return h(f({},l),{styleModifications:[...l.styleModifications,{selector:o,durableSelector:r,element:n,changes:s}]})}function sc(e,t){let{selector:o,property:r}=t,n=Zt(e),i=n.styleModifications.map(s=>s.selector!==o?s:h(f({},s),{changes:s.changes.filter(l=>l.property!==r)})).filter(s=>s.changes.length>0);return h(f({},n),{styleModifications:i})}function lc(e){if(e.styleModifications.length===0)return h(f({},e),{inspectedElement:null});let t=Zt(e);return h(f({},t),{styleModifications:[],inspectedElement:null})}function ac(e,t){return h(f({},e),{styleModifications:t})}function cc(e,t){let{updates:o}=t,r=new Map(o.map(n=>[n.id,n]));return h(f({},e),{annotations:e.annotations.map(n=>{let i=r.get(n.id);return i?f(h(f({},n),{points:[i.point,...n.points.slice(1)]}),i.linkedAnchor?{linkedAnchor:i.linkedAnchor}:{}):n})})}function dc(e,t){let o=new Set(t.ids);return h(f({},e),{annotations:e.annotations.map(r=>o.has(r.id)?h(f({},r),{status:t.status}):r)})}function uc(e,t){let o=new Set(t.ids),r=new Set;for(let n of e.annotations)o.has(n.id)&&n.groupId&&r.add(n.groupId);return h(f({},e),{annotations:e.annotations.map(n=>o.has(n.id)||n.groupId&&r.has(n.groupId)?h(f({},n),{threadId:t.threadId}):n)})}function pc(e,t){let o=new Set(t.ids),r=new Set;for(let n of e.annotations)o.has(n.id)&&n.groupId&&r.add(n.groupId);return h(f({},e),{annotations:e.annotations.map(n=>o.has(n.id)||n.groupId&&r.has(n.groupId)?h(f({},n),{status:"waiting_input",question:t.question,threadId:t.threadId}):n)})}function fc(e,t){let o=new Map(t.resolutions.map(n=>[n.annotationId,n])),r=new Map;for(let n of e.annotations){let i=o.get(n.id);i&&n.groupId&&r.set(n.groupId,i)}return h(f({},e),{annotations:e.annotations.map(n=>{var s,l,a;let i=o.get(n.id)||(n.groupId?r.get(n.groupId):void 0);return i?h(f({},n),{status:i.status,resolutionSummary:i.summary,scope:(l=(s=i.finalScope)!=null?s:i.inferredScope)!=null?l:null,replyCount:((a=n.replyCount)!=null?a:0)+1,question:void 0,threadId:n.threadId||t.threadId}):n})})}function gc(e,t){let{linkedSelectors:o,styleSelectors:r}=t,n=new Set(o),i=new Set(r),s=new Set,l=new Set;for(let p of e.annotations)p.linkedSelector&&n.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)),c=e.styleModifications.filter(p=>!i.has(p.selector));if(a.length===e.annotations.length&&c.length===e.styleModifications.length)return e;let d=e.selectedAnnotationIds.filter(p=>!s.has(p)),u=e.inspectedElement&&i.has(e.inspectedElement.info.selector)?null:e.inspectedElement;return h(f({},e),{annotations:a,styleModifications:c,selectedAnnotationIds:d,lastSelectedId:d.length>0?d[d.length-1]:null,inspectedElement:u})}function mc(e,t){let o=e.spacingTokenChanges.findIndex(r=>r.tokenPath===t.tokenPath);return o>=0?h(f({},e),{spacingTokenChanges:e.spacingTokenChanges.map((r,n)=>n===o?t:r)}):h(f({},e),{spacingTokenChanges:[...e.spacingTokenChanges,t]})}function hc(e,t){return h(f({},e),{spacingTokenChanges:t})}function yc(e,t){let o=Zt(e),r=e.spacingTokenMods.findIndex(i=>i.tokenPath===t.tokenPath),n;if(r>=0){let i=e.spacingTokenMods[r],s=h(f({},t),{originalValue:i.originalValue,originalPx:i.originalPx});n=e.spacingTokenMods.map((l,a)=>a===r?s:l)}else n=[...e.spacingTokenMods,t];return h(f({},o),{spacingTokenMods:n})}function bc(e,t){let o=Zt(e),r=e.spacingTokenMods.findIndex(a=>a.tokenPath===t.tokenPath),n=r>=0?e.spacingTokenMods[r].originalValue:t.originalValue,i=r>=0?e.spacingTokenMods[r].originalPx:parseFloat(t.originalValue)||0,s={tokenPath:t.tokenPath,originalValue:n,currentValue:"__deleted__",targets:r>=0?e.spacingTokenMods[r].targets:[],originalPx:i,currentPx:0},l;return r>=0?l=e.spacingTokenMods.map((a,c)=>c===r?s:a):l=[...e.spacingTokenMods,s],h(f({},o),{spacingTokenMods:l})}var xc={SET_ANNOTATING:Da,SET_TOOL:Ha,SET_COLOR:Fa,SET_STROKE_WIDTH:Na,START_PATH:_a,CONTINUE_PATH:za,CANCEL_PATH:$a,FINISH_PATH:Wa,ADD_TEXT:Ya,UPDATE_TEXT:ja,UPDATE_TEXT_SIZE:Ga,DELETE_ANNOTATION:Va,MOVE_ANNOTATION:Ua,RESIZE_ANNOTATION:Ja,PASTE_ANNOTATIONS:Xa,RESTORE_ANNOTATIONS:Ka,UNDO:Za,REDO:qa,SELECT_ANNOTATION:Qa,UPDATE_ANNOTATION_COLOR:ec,MARK_CAPTURED:tc,CLEAR:nc,SELECT_ELEMENT:oc,MODIFY_STYLE:rc,MODIFY_STYLES_BATCH:ic,CLEAR_STYLE:sc,CLEAR_ALL_STYLES:lc,RESTORE_STYLE_MODIFICATIONS:ac,UPDATE_LINKED_POSITIONS:cc,CLEANUP_ORPHANED:gc,SET_ANNOTATION_STATUS:dc,SET_ANNOTATION_THREAD:uc,SET_ANNOTATION_QUESTION:pc,APPLY_RESOLUTIONS:fc,ADD_SPACING_TOKEN_CHANGE:mc,RESTORE_SPACING_TOKEN_CHANGES:hc,MODIFY_SPACING_TOKEN:yc,DELETE_SPACING_TOKEN:bc};function vc(e,t){let o=xc[t.type];return o?o(e,t.payload):e}function Hs(){let[e,t]=Ba(vc,Oa);return Pa(()=>{let o=r=>{(r.metaKey||r.ctrlKey)&&r.key==="z"&&(r.preventDefault(),r.shiftKey?t({type:"REDO"}):t({type:"UNDO"}))};return window.addEventListener("keydown",o),()=>window.removeEventListener("keydown",o)},[]),[e,t]}import{domToCanvas as Sc}from"modern-screenshot";function Or(e){let t=document.createElement("canvas").getContext("2d");return t?(t.fillStyle=e,t.fillStyle):"#888888"}function Dr(e,t=[],o,r){let n=new Map,i=[];for(let l of e)if(l.groupId){let a=n.get(l.groupId)||[];a.push(l),n.set(l.groupId,a)}else i.push(l);let s=[];for(let[l,a]of n){let c=a.find(u=>u.type!=="text"),d=a.find(u=>u.type==="text");if(c){let u=c.linkedSelector||(d==null?void 0:d.linkedSelector),p=(d==null?void 0:d.imageCount)||c.imageCount;s.push(f(h(f({id:c.id,type:c.type,instruction:d==null?void 0:d.text},u?{linkedSelector:u}:{}),{elements:c.elements||[]}),p?{imageCount:p}:{}))}}for(let l of i)s.push(f(h(f({id:l.id,type:l.type,instruction:l.type==="text"?l.text:void 0},l.linkedSelector?{linkedSelector:l.linkedSelector}:{}),{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},o?{inspectedElement:o}:{}),r&&r.length>0?{spacingTokenChanges:r}:{})}function wc(e){if(!e.points||e.points.length===0)return null;let t=e.points.map(r=>r.x),o=e.points.map(r=>r.y);return{minX:Math.min(...t),minY:Math.min(...o),maxX:Math.max(...t),maxY:Math.max(...o)}}function Ec(e,t){if(e.length===0)return[];let o=e.map(d=>({annotation:d,bounds:wc(d)})).filter(d=>d.bounds!==null);if(o.length===0)return[];o.sort((d,u)=>d.bounds.minY-u.bounds.minY);let r=Math.min(...o.map(d=>d.bounds.minY)),n=Math.max(...o.map(d=>d.bounds.maxY));if(n-r<=t){let d=(r+n)/2,u=Math.max(0,d-t/2);return[{top:u,bottom:u+t,annotations:e}]}let i=[],s=50,l=Math.max(0,r-s),a=[],c=l;for(let{annotation:d,bounds:u}of o){let p=u.maxY+s;if(p-l<=t)a.push(d),c=Math.max(c,p);else{if(a.length>0){let g=(l+c)/2,S=Math.max(0,g-t/2);i.push({top:S,bottom:S+t,annotations:a})}l=Math.max(0,u.minY-s),a=[d],c=u.maxY+s}}if(a.length>0){let d=(l+c)/2,u=Math.max(0,d-t/2);i.push({top:u,bottom:u+t,annotations:a})}return i}function kc(e,t,o,r){e.save(),e.scale(r,r);for(let n of t){let i=n.points.map(s=>({x:s.x,y:s.y-o}));switch(e.strokeStyle=n.color,e.fillStyle=n.color,e.lineWidth=n.strokeWidth,e.lineCap="round",e.lineJoin="round",n.type){case"freehand":if(i.length<2)break;e.beginPath(),e.moveTo(i[0].x,i[0].y);for(let s=1;s<i.length;s++)e.lineTo(i[s].x,i[s].y);e.stroke();break;case"line":if(i.length<2)break;e.beginPath(),e.moveTo(i[0].x,i[0].y),e.lineTo(i[i.length-1].x,i[i.length-1].y),e.stroke();break;case"rectangle":{if(i.length<2)break;let s=i[0],l=i[i.length-1],a=Math.min(s.x,l.x),c=Math.min(s.y,l.y),d=Math.abs(l.x-s.x),u=Math.abs(l.y-s.y);e.strokeRect(a,c,d,u);break}case"circle":{if(i.length<2)break;let s=i[0],l=i[i.length-1],a=(s.x+l.x)/2,c=(s.y+l.y)/2,d=Math.abs(l.x-s.x)/2,u=Math.abs(l.y-s.y)/2;e.beginPath(),e.ellipse(a,c,d,u,0,0,Math.PI*2),e.stroke();break}case"text":{if(!n.text||i.length<1)break;let s=i[0],l=n.fontSize||16;e.font=`${l}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`,e.fillStyle=n.color;let c=(n.imageCount&&n.imageCount>0?`[${n.imageCount} image${n.imageCount>1?"s":""}] ${n.text}`:n.text).split(`
3
- `),d=l*1.2,u=4,p=0;for(let g of c)p=Math.max(p,e.measureText(g).width);e.fillRect(s.x-u,s.y-u,p+u*2,c.length*d+u*2),e.fillStyle="#ffffff",c.forEach((g,S)=>{e.fillText(g,s.x,s.y+l+S*d)});break}}}e.restore()}async function Hr(e,t,o=[]){try{let r=window.devicePixelRatio||1,n=window.innerWidth,i=window.innerHeight,s=o.filter(c=>{var d;return((d=c.status)!=null?d:"pending")==="pending"});console.log("[Screenshot] Starting capture with",s.length,"active annotations (filtered",o.length-s.length,"captured)");let l=Ec(s,i);if(l.length===0){let c=await Fs(e,[],window.scrollY,n,i,r);return c?[c]:[]}let a=[];for(let c=0;c<l.length;c++){let d=l[c],u=await Fs(e,d.annotations,d.top,n,i,r);u?a.push(u):console.warn(`[Screenshot] Region ${c+1} failed to capture`)}return console.log("[Screenshot] Capture complete"),a}catch(r){return console.error("[Screenshot] Capture failed:",r),[]}}async function Fs(e,t,o,r,n,i){try{let s=await Sc(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:n,style:{transform:`translate(${-window.scrollX}px, ${-o}px)`}}),l=document.createElement("canvas");l.width=r*i,l.height=n*i;let a=l.getContext("2d");return a?(a.drawImage(s,0,0,r*i,n*i,0,0,r*i,n*i),kc(a,t,o,i),new Promise(c=>{l.toBlob(d=>c(d),"image/png")})):null}catch(s){return console.error("Region capture failed:",s),null}}async function Fr(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,c)=>{let d=new Image;d.onload=()=>a(d),d.onerror=c,d.src=URL.createObjectURL(l)}))),o=t[0].width,r=t.reduce((l,a)=>l+a.height,0),n=document.createElement("canvas");n.width=o,n.height=r;let i=n.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=>{n.toBlob(a=>l(a),"image/png")})}async function Ns(e,t,o){try{let r=Array.isArray(e)?e:[e];if(r.length===0)return!1;let n=await Fr(r);if(!n)return!1;let i={"image/png":n},s=t&&t.length>0,l=o&&o.length>0;if(s||l){let a=t?t.filter(c=>{var d;return((d=c.status)!=null?d:"pending")==="pending"}):[];if(a.length>0||l){let c=Dr(a,o||[]),d=new Blob([JSON.stringify(c,null,2)],{type:"text/plain"});i["text/plain"]=d}}return await navigator.clipboard.write([new ClipboardItem(i)]),!0}catch(r){return console.warn("Clipboard write failed:",r),!1}}import{useCallback as Pt,useEffect as Vt,useMemo as Li,useRef as Ct,useState as it}from"react";import{useCallback as uo,useRef as Mc}from"react";function Nr(e,t,o,r){if(t.length<2)return;let n=t[0],i=t[t.length-1];if(!n||!i)return;let s=(n.x+i.x)/2,l=(n.y+i.y)/2,a=Math.abs(i.x-n.x)/2,c=Math.abs(i.y-n.y)/2;e.beginPath(),e.strokeStyle=o,e.lineWidth=r,e.ellipse(s,l,a,c,0,0,Math.PI*2),e.stroke()}function _r(e,t,o,r){if(t.length<2)return;let n=t[0],i=t[t.length-1];if(!(!n||!i)){e.beginPath(),e.strokeStyle=o,e.lineWidth=r,e.lineCap="round",e.lineJoin="round",e.moveTo(n.x,n.y);for(let s=1;s<t.length-1;s++){let l=t[s],a=t[s+1];if(!l||!a)continue;let c=(l.x+a.x)/2,d=(l.y+a.y)/2;e.quadraticCurveTo(l.x,l.y,c,d)}e.lineTo(i.x,i.y),e.stroke()}}function zr(e,t,o,r){if(t.length<2)return;let n=t[0],i=t[t.length-1];!n||!i||(e.beginPath(),e.strokeStyle=o,e.lineWidth=r,e.lineCap="round",e.moveTo(n.x,n.y),e.lineTo(i.x,i.y),e.stroke())}function $r(e,t,o,r){if(t.length<2)return;let n=t[0],i=t[t.length-1];if(!n||!i)return;let s=Math.min(n.x,i.x),l=Math.min(n.y,i.y),a=Math.abs(i.x-n.x),c=Math.abs(i.y-n.y);e.beginPath(),e.strokeStyle=o,e.lineWidth=r,e.lineCap="round",e.lineJoin="round",e.strokeRect(s,l,a,c)}var Wt='"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';function Cc(e,t,o){if(!t||e.measureText(t).width<=o)return[t];let r=t.split(/\s+/),n=[],i="";for(let s of r){let l=i?i+" "+s:s;i&&e.measureText(l).width>o?(n.push(i),i=s):i=l}return i&&n.push(i),n.length>0?n:[t]}function co(e){let t=window.innerWidth-e-16;if(t<400)return Math.max(60,t)}function jn(e,t,o){let r=[];for(let n of t)r.push(...Cc(e,n,o));return r}function _s(e,t,o,r,n=12,i,s){if(!o)return;let l=n*1.4,a=o.split(`
4
- `),c=i!==void 0?[i+". "+(a[0]||""),...a.slice(1)]:a;e.font=`${n}px ${Wt}`,e.textBaseline="middle";let d=s!==void 0?Math.min(400,Math.max(60,window.innerWidth-s-16)):400,u=jn(e,c,d),p=Math.min(d,Math.max(...u.map(w=>e.measureText(w).width))),g=u.length*l,S=c.length*l,v=g-S,b=t.y-v;e.fillStyle=r,e.fillRect(t.x-4,b-4,p+8,g+8),e.fillStyle="#ffffff",u.forEach((w,O)=>{e.fillText(w,t.x,b+O*l+l/2)})}var zs=11,Wr=4,Tc=`600 ${zs}px system-ui, -apple-system, sans-serif`;function Yr(e,t,o){return e.map(r=>({x:r.x-t,y:r.y-o}))}function Lc(e,t,o,r,n,i){let s=String(r);e.font=Tc;let a=e.measureText(s).width+Wr*2,c=zs+Wr*2,d=t-a/2,u=o+i/2+2;e.fillStyle=n,e.fillRect(d,u,a,c),e.fillStyle="#ffffff",e.textBaseline="middle",e.fillText(s,d+Wr,u+c/2)}function Ic(e,t){if(e.points.length<2&&e.type!=="text")return null;switch(e.type){case"rectangle":case"freehand":{let o,r;if(e.type==="freehand")o=Math.min(...e.points.map(n=>n.x)),r=Math.max(...e.points.map(n=>n.y));else{let n=e.points[0],i=e.points[e.points.length-1];o=Math.min(n.x,i.x),r=Math.max(n.y,i.y)}return{x:o,y:r}}case"circle":{let o=e.points[0],r=e.points[e.points.length-1],n=Math.min(o.x,r.x),i=(Math.min(o.y,r.y)+Math.max(o.y,r.y))/2;return{x:n,y:i}}case"line":{let o=e.points[0],r=e.points[e.points.length-1],n=o.y>r.y?o:r;return{x:n.x,y:n.y}}default:return null}}function $s(){let e=Mc(null),t=uo(()=>{let l=e.current;if(!l)return;let a=l.getContext("2d");a&&a.clearRect(0,0,l.width,l.height)},[]),o=uo((l,a,c)=>{var S;let d=e.current;if(!d)return;let u=d.getContext("2d");if(!u)return;let g=((S=l.status)!=null?S:l.captured?"in_flight":"pending")==="pending"||c?l.color:"#999999";switch(l.type){case"freehand":_r(u,l.points,g,l.strokeWidth);break;case"line":zr(u,l.points,g,l.strokeWidth);break;case"rectangle":$r(u,l.points,g,l.strokeWidth);break;case"circle":Nr(u,l.points,g,l.strokeWidth);break;case"text":l.text&&l.points[0]&&_s(u,l.points[0],l.text,g,l.fontSize,a,l.points[0].x);break}},[]),r=uo((l,a,c,d)=>{let u=e.current;if(!u||l.length<2)return;let p=u.getContext("2d");if(p)switch(a){case"freehand":_r(p,l,c,d);break;case"line":zr(p,l,c,d);break;case"rectangle":$r(p,l,c,d);break;case"circle":Nr(p,l,c,d);break}},[]),n=uo((l,a)=>{let c=e.current;if(!c||l.points.length<2)return;let d=c.getContext("2d");if(d){if(d.fillStyle="#ffffff",d.strokeStyle=l.color,d.lineWidth=1.5,l.type==="line"){let u=l.points[0],p=l.points[l.points.length-1];[u,p].forEach(g=>{d.beginPath(),d.arc(g.x,g.y,a/2,0,Math.PI*2),d.fill(),d.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),S=Math.max(u.x,p.x),v=Math.min(u.y,p.y),b=Math.max(u.y,p.y),w=(g+S)/2,O=(v+b)/2;[{x:w,y:v},{x:w,y:b},{x:g,y:O},{x:S,y:O}].forEach(k=>{d.beginPath(),d.rect(k.x-a/2,k.y-a/2,a,a),d.fill(),d.stroke()});return}if(l.type==="rectangle"||l.type==="freehand"){let u,p,g,S;if(l.type==="freehand")u=Math.min(...l.points.map(b=>b.x)),p=Math.max(...l.points.map(b=>b.x)),g=Math.min(...l.points.map(b=>b.y)),S=Math.max(...l.points.map(b=>b.y));else{let b=l.points[0],w=l.points[l.points.length-1];u=Math.min(b.x,w.x),p=Math.max(b.x,w.x),g=Math.min(b.y,w.y),S=Math.max(b.y,w.y)}[{x:u,y:g},{x:p,y:g},{x:u,y:S},{x:p,y:S}].forEach(b=>{d.beginPath(),d.rect(b.x-a/2,b.y-a/2,a,a),d.fill(),d.stroke()})}}},[]),i=uo((l,a,c,d,u,p,g,S=0,v=0,b,w)=>{var O;if(t(),l.forEach(A=>{var $;let k=h(f({},A),{points:Yr(A.points,S,v)}),E=b==null?void 0:b.get(A.id),I=($=w==null?void 0:w.has(A.id))!=null?$:!1;o(k,E,I)}),a.length>0){let A=Yr(a,S,v);r(A,c,d,u)}if(p&&p.length>0&&g){let A=e.current,k=A==null?void 0:A.getContext("2d");for(let E of p){let I=l.find($=>$.id===E);if(I){let $=h(f({},I),{points:Yr(I.points,S,v)});if(n($,g),k&&I.type!=="text"&&b&&!(I.groupId&&l.some(j=>j.groupId===I.groupId&&j.type==="text"))){let j=b.get(I.id);if(j!==void 0){let T=Ic($,g);if(T){let K=((O=I.status)!=null?O:I.captured?"in_flight":"pending")==="pending"?I.color:"#999999";Lc(k,T.x,T.y,j,K,g)}}}}}}},[t,o,r,n]),s=uo(()=>{let l=e.current;if(!l)return;let a=window.devicePixelRatio||1;l.width=window.innerWidth*a,l.height=window.innerHeight*a;let c=l.getContext("2d");c&&c.scale(a,a)},[]);return{canvasRef:e,clearCanvas:t,drawAnnotation:o,drawCurrentPath:r,redrawAll:i,resizeCanvas:s}}import{useEffect as Rc,useRef as Ac}from"react";function Ws(){let e=Ac({shift:!1,cmd:!1});return Rc(()=>{let t=n=>{n.key==="Shift"&&(e.current.shift=!0),(n.key==="Meta"||n.key==="Control")&&(e.current.cmd=!0)},o=n=>{n.key==="Shift"&&(e.current.shift=!1),(n.key==="Meta"||n.key==="Control")&&(e.current.cmd=!1)},r=()=>{e.current={shift:!1,cmd:!1}};return window.addEventListener("keydown",t,!0),window.addEventListener("keyup",o,!0),window.addEventListener("blur",r),()=>{window.removeEventListener("keydown",t,!0),window.removeEventListener("keyup",o,!0),window.removeEventListener("blur",r)}},[]),e}import{useEffect as Pc}from"react";function Ys(e,t,o,r,n){Pc(()=>{let i=s=>{if(e){if(e.linkedSelector)return;s.preventDefault(),s.stopPropagation();let a=s.deltaY>0?-2:2;t(c=>c?h(f({},c),{fontSize:Math.max(12,Math.min(72,c.fontSize+a))}):null);return}if(!o)return;s.preventDefault();let l=r.find(a=>a.id===o);if(l&&l.type==="text"&&!l.linkedSelector){let a=l.fontSize||12,c=s.deltaY>0?-2:2;n({type:"UPDATE_TEXT_SIZE",payload:{id:o,fontSize:a+c}})}};return window.addEventListener("wheel",i,{passive:!1}),()=>{window.removeEventListener("wheel",i)}},[o,e,r,n,t])}import{useCallback as ol,useEffect as pr,useRef as rl,useState as $o}from"react";function or(e){let t=Object.keys(e).find(n=>n.startsWith("__reactFiber$")||n.startsWith("__reactInternalInstance$"));if(!t)return null;let o=e[t],r=[];for(;o;){let n=o.type,i=(n==null?void 0:n.displayName)||(n==null?void 0:n.name);i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&r.unshift(i),o=o.return}return r.length>0?{name:r[r.length-1],path:r}:null}function jr(e){let t=Object.keys(e).find(n=>n.startsWith("__reactFiber$")||n.startsWith("__reactInternalInstance$"));if(!t)return[];let o=e[t],r=[];for(;o;){let n=o.type,i=typeof n=="function"||typeof n=="object"?(n==null?void 0:n.displayName)||(n==null?void 0:n.name):null;i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&r.push({name:i,fiber:o}),o=o.return}return r.reverse(),r}function rr(e){let t=e,o=new Set;for(;t&&!o.has(t);){if(o.add(t),t.stateNode instanceof Element)return t.stateNode;t.child?t=t.child:t=null}return null}function js(e){if(e.id)return`#${e.id}`;let t=e.tagName.toLowerCase(),o=Array.from(e.classList).slice(0,3).join(".");return o?`${t}.${o}`:t}function sn(e){if(e.id&&!e.id.startsWith("radix-")&&!e.id.startsWith(":"))return`#${CSS.escape(e.id)}`;let t=[],o=e;for(;o&&o!==document.documentElement;){let r=o.tagName.toLowerCase();if(o.id&&!o.id.startsWith("radix-")&&!o.id.startsWith(":")){t.unshift(`#${CSS.escape(o.id)}`);break}let n=Array.from(o.classList).filter(s=>!s.startsWith("_")&&s.length<30).slice(0,2);n.length>0&&(r+="."+n.map(s=>CSS.escape(s)).join("."));let i=o.parentElement;if(i){let s=Array.from(i.children).filter(l=>l.tagName===o.tagName);if(s.length>1){let l=s.indexOf(o)+1;r+=`:nth-of-type(${l})`}}t.unshift(r),o=i}return t.join(" > ")}function Jt(e){try{return document.querySelector(e)}catch(t){return null}}function ir(e,t=0){var a;let o=jr(e);if(o.length===0)return null;let r=o.map(c=>c.name),n=o.length-1,i=Math.max(0,Math.min(o.length-1,n-t)),s=o[i],l=(a=rr(s.fiber))!=null?a:e;return{name:s.name,path:r,depthIndex:i,rootElement:l}}function Gs(e,t){var i,s;let o=jr(e),r=t.toLowerCase(),n=-1;for(let l=o.length-1;l>=0;l--){let a=o[l].name;if(a===t){let c=(i=rr(o[l].fiber))!=null?i:e;return{name:t,path:o.map(d=>d.name),depthIndex:l,rootElement:c}}if(n===-1){let c=a.toLowerCase();(c.length>=4&&r.includes(c)||r.length>=4&&c.includes(r))&&(n=l)}}if(n>=0){let l=(s=rr(o[n].fiber))!=null?s:e;return{name:t,path:o.map(a=>a.name),depthIndex:n,rootElement:l}}return null}function po(e){let t=fo(),o=[],r=new Set,n=t.currentNode;for(;n=t.nextNode();){let i=Gs(n,e);i&&!r.has(i.rootElement)&&(r.add(i.rootElement),o.push(i))}return o}function Gr(e){let t=new Map;if(e.size===0)return t;let o=new Set(e),r=fo(),n=new Set,i=r.currentNode;for(;(i=r.nextNode())&&o.size>0;)for(let s of o){let l=Gs(i,s);if(!l||n.has(l.rootElement))continue;n.add(l.rootElement);let a=l.rootElement.getBoundingClientRect();t.set(s,a.top+window.scrollY),o.delete(s);break}for(let s of o)t.set(s,1/0);return t}function fo(){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 qt(e){let t={selector:js(e),tagName:e.tagName.toLowerCase()};e.id&&(t.id=e.id),e.classList.length>0&&(t.className=Array.from(e.classList).join(" "));let o=Vs(e);o&&o.length>0&&o.length<200&&(t.textContent=o);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 n=or(e);n&&(t.reactComponent=n.name);let i=Bc(e);return i&&(t.context=i),t}function Vs(e){let t="";for(let o of e.childNodes)o.nodeType===Node.TEXT_NODE&&(t+=o.textContent||"");return t.trim()}function Gn(e,t){let o=document.elementsFromPoint(e,t);for(let r of o)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 Bc(e){let t=e.parentElement,o=["section","article","nav","aside","header","footer","main"];for(;t&&t!==document.body;){let r=t.tagName.toLowerCase();if(o.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 Us(e){let t=new Set,o=[],r=window.scrollX,n=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-n;if(l<0||a<0||l>window.innerWidth||a>window.innerHeight)continue;let c=Gn(l,a);c&&!t.has(c)&&(t.add(c),o.push(qt(c)))}return o.slice(0,3)}function Vr(e){if(e.length===0)return[];let t=e.map(r=>r.x),o=e.map(r=>r.y);return Us({minX:Math.min(...t),minY:Math.min(...o),maxX:Math.max(...t),maxY:Math.max(...o)})}function At(e,t){return e.style.getPropertyValue(t)!==""}function Oc(e,t=30){if(e<=0)return[];let o=[],r=fo(),n=.5,i=r.currentNode;for(;(i=r.nextNode())&&o.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);!At(s,"padding-top")&&Math.abs((parseFloat(a.paddingTop)||0)-e)<n&&o.push({element:s,property:"padding-top"}),!At(s,"padding-bottom")&&Math.abs((parseFloat(a.paddingBottom)||0)-e)<n&&o.length<t&&o.push({element:s,property:"padding-bottom"}),!At(s,"padding-left")&&Math.abs((parseFloat(a.paddingLeft)||0)-e)<n&&o.length<t&&o.push({element:s,property:"padding-left"}),!At(s,"padding-right")&&Math.abs((parseFloat(a.paddingRight)||0)-e)<n&&o.length<t&&o.push({element:s,property:"padding-right"}),!At(s,"margin-top")&&Math.abs((parseFloat(a.marginTop)||0)-e)<n&&o.length<t&&o.push({element:s,property:"margin-top"}),!At(s,"margin-bottom")&&Math.abs((parseFloat(a.marginBottom)||0)-e)<n&&o.length<t&&o.push({element:s,property:"margin-bottom"}),!At(s,"margin-left")&&Math.abs((parseFloat(a.marginLeft)||0)-e)<n&&o.length<t&&o.push({element:s,property:"margin-left"}),!At(s,"margin-right")&&Math.abs((parseFloat(a.marginRight)||0)-e)<n&&o.length<t&&o.push({element:s,property:"margin-right"});let c=a.display;if((c.includes("flex")||c.includes("grid"))&&o.length<t){let d=At(s,"gap"),u=parseFloat(a.gap)||0,p=parseFloat(a.rowGap)||0,g=parseFloat(a.columnGap)||0;!d&&Math.abs(u-e)<n?o.push({element:s,property:"gap"}):!At(s,"row-gap")&&Math.abs(p-e)<n?o.push({element:s,property:"row-gap"}):!At(s,"column-gap")&&Math.abs(g-e)<n&&o.push({element:s,property:"column-gap"})}}return o}function Ur(e,t=30){if(e<=0)return[];let o=[],r=fo(),n=.5,i=r.currentNode;for(;(i=r.nextNode())&&o.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),c=parseFloat(a.borderTopWidth)||0,d=parseFloat(a.borderRightWidth)||0,u=parseFloat(a.borderBottomWidth)||0,p=parseFloat(a.borderLeftWidth)||0,g=s.clientWidth,S=s.clientHeight,v=parseFloat(a.paddingTop)||0;!At(s,"padding-top")&&Math.abs(v-e)<n&&o.push({x:l.left+p,y:l.top+c,width:g,height:e,direction:"vertical",property:"padding-top"});let b=parseFloat(a.paddingBottom)||0;!At(s,"padding-bottom")&&Math.abs(b-e)<n&&o.length<t&&o.push({x:l.left+p,y:l.top+c+S-e,width:g,height:e,direction:"vertical",property:"padding-bottom"});let w=parseFloat(a.paddingLeft)||0;!At(s,"padding-left")&&Math.abs(w-e)<n&&o.length<t&&o.push({x:l.left+p,y:l.top+c,width:e,height:S,direction:"horizontal",property:"padding-left"});let O=parseFloat(a.paddingRight)||0;!At(s,"padding-right")&&Math.abs(O-e)<n&&o.length<t&&o.push({x:l.left+p+g-e,y:l.top+c,width:e,height:S,direction:"horizontal",property:"padding-right"});let A=parseFloat(a.marginTop)||0;!At(s,"margin-top")&&Math.abs(A-e)<n&&o.length<t&&o.push({x:l.left,y:l.top-e,width:l.width,height:e,direction:"vertical",property:"margin-top"});let k=parseFloat(a.marginBottom)||0;!At(s,"margin-bottom")&&Math.abs(k-e)<n&&o.length<t&&o.push({x:l.left,y:l.bottom,width:l.width,height:e,direction:"vertical",property:"margin-bottom"});let E=parseFloat(a.marginLeft)||0;!At(s,"margin-left")&&Math.abs(E-e)<n&&o.length<t&&o.push({x:l.left-e,y:l.top,width:e,height:l.height,direction:"horizontal",property:"margin-left"});let I=parseFloat(a.marginRight)||0;!At(s,"margin-right")&&Math.abs(I-e)<n&&o.length<t&&o.push({x:l.right,y:l.top,width:e,height:l.height,direction:"horizontal",property:"margin-right"});let $=a.display;if(($.includes("flex")||$.includes("grid"))&&o.length<t&&!At(s,"gap")){let j=Array.from(s.children).filter(T=>{let D=getComputedStyle(T);return D.display!=="none"&&D.position!=="absolute"&&D.position!=="fixed"});if(j.length>=2)for(let T=0;T<j.length-1&&o.length<t;T++){let D=j[T].getBoundingClientRect(),K=j[T+1].getBoundingClientRect(),ee=K.top-D.bottom;Math.abs(ee-e)<n&&ee>.5&&o.push({x:Math.min(D.left,K.left),y:D.bottom,width:Math.max(D.right,K.right)-Math.min(D.left,K.left),height:ee,direction:"vertical",property:"gap"});let me=K.left-D.right;Math.abs(me-e)<n&&me>.5&&o.push({x:D.right,y:Math.min(D.top,K.top),width:me,height:Math.max(D.bottom,K.bottom)-Math.min(D.top,K.top),direction:"horizontal",property:"gap"})}}}return o}function sr(e){return typeof e=="string"?{value:e}:e}var Xs={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 Js(e,t){let o=Xs[t];return o?o.includes(e):!1}function Dc(e,t){let o=e.split(/\s+/);for(let r of o){if(r===t)return!0;let n=r.lastIndexOf(":");if(n>=0&&r.slice(n+1)===t)return!0}return!1}function Hc(e){var l,a;let t=e.lastIndexOf(":"),o=t>=0?e.slice(t+1):e,r=o.indexOf("-");if(r<0)return null;let n=o.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=o.slice(0,o.indexOf("-",r+1)>0?o.indexOf("-",r+1):r);return(a=(l=i[s])!=null?l:i[n])!=null?a:null}function Jr(e,t=30){let o=parseFloat(e.value);if(isNaN(o)||o<=0)return[];if(e.bindings&&e.bindings.length>0){let n=[],i=fo(),s=i.currentNode;for(;(s=i.nextNode())&&n.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 c=l.className;if(typeof c=="string")for(let d of e.bindings){if(!Dc(c,d))continue;let u=Hc(d);if(u&&!(e.property&&!Js(u,e.property))){n.push({element:l,property:u});break}}}return n}let r=Oc(o,t*2);return e.property?r.filter(n=>Js(n.property,e.property)).slice(0,t):r.slice(0,t)}function Xr(e,t=30){let o=Jr(e,t),r=[];for(let n of o){let i=n.element,s=i.getBoundingClientRect(),l=getComputedStyle(i),a=parseFloat(l.borderTopWidth)||0,c=parseFloat(l.borderRightWidth)||0,d=parseFloat(l.borderLeftWidth)||0,u=i.clientWidth,p=i.clientHeight;switch(n.property){case"padding-top":{let g=parseFloat(l.paddingTop)||0;r.push({x:s.left+d,y:s.top+a,width:u,height:g,direction:"vertical",property:n.property});break}case"padding-bottom":{let g=parseFloat(l.paddingBottom)||0;r.push({x:s.left+d,y:s.top+a+p-g,width:u,height:g,direction:"vertical",property:n.property});break}case"padding-left":{let g=parseFloat(l.paddingLeft)||0;r.push({x:s.left+d,y:s.top+a,width:g,height:p,direction:"horizontal",property:n.property});break}case"padding-right":{let g=parseFloat(l.paddingRight)||0;r.push({x:s.left+d+u-g,y:s.top+a,width:g,height:p,direction:"horizontal",property:n.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:n.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:n.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:n.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:n.property});break}case"gap":case"row-gap":case"column-gap":{let g=Array.from(i.children).filter(S=>{let v=getComputedStyle(S);return v.display!=="none"&&v.position!=="absolute"&&v.position!=="fixed"});for(let S=0;S<g.length-1&&r.length<t;S++){let v=g[S].getBoundingClientRect(),b=g[S+1].getBoundingClientRect(),w=b.top-v.bottom;w>.5&&r.push({x:Math.min(v.left,b.left),y:v.bottom,width:Math.max(v.right,b.right)-Math.min(v.left,b.left),height:w,direction:"vertical",property:"gap"});let O=b.left-v.right;O>.5&&r.push({x:v.right,y:Math.min(v.top,b.top),width:O,height:Math.max(v.bottom,b.bottom)-Math.min(v.top,b.top),direction:"horizontal",property:"gap"})}break}}}return r}function Ks(e,t){let o=new Set,r=Do(t);for(let n of e){let i=qs[n.property];if(!i)continue;let s=n.element.className;if(typeof s=="string")for(let l of i){let a=`${l}-${r}`;for(let c of s.split(/\s+/)){let d=c.lastIndexOf(":"),u=d>=0?c.slice(d+1):c;if(u===a){o.add(u);break}}}}return[...o]}function Zs(e){let t=new Set;for(let o of e)for(let[r,n]of Object.entries(Xs))if(n.includes(o.property)){t.add(r);break}if(t.size===1)return[...t][0]}function Kr(e,t,o){if(t===o)return e;let r=Do(t),n=Do(o);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}-${n}`:i})}var Fc={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 Do(e){var t;return(t=Fc[e])!=null?t:`[${e}px]`}var qs={"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 Nc(e,t,o,r){let n=qs[t];if(!n)return null;let i=Do(o);for(let s of n){let l=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+s+"-(?:"+_c(i)+"|\\["+o+"px\\]))(?:\\s|$)"),a=e.match(l);if(a!=null&&a[1]){let c=Do(r),d=a[1].lastIndexOf(":"),u=d>=0?a[1].slice(0,d+1):"";return{matched:a[1],suggested:`${u}${s}-${c}`}}}return null}function _c(e){return e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function Qs(e,t,o){let r=new Set,n=[];for(let i of e){let s=sn(i.element),l=`${s}::${i.property}`;if(r.has(l))continue;r.add(l);let a=or(i.element),c=i.element.className||"",d=Nc(c,i.property,t,o);n.push({selector:s,reactComponent:a==null?void 0:a.name,className:c,property:i.property,matchedClass:d==null?void 0:d.matched,suggestedClass:d==null?void 0:d.suggested})}return n}function Ho(e,t){return window.getComputedStyle(e).getPropertyValue(t)}function Zr(e,t){if(e instanceof HTMLElement){let r=e.style.getPropertyValue(t);if(r)return r}let o=zc(e,t);return o&&o.includes("var(")?o:Ho(e,t)}function zc(e,t){let o=t.replace(/-([a-z])/g,(r,n)=>n.toUpperCase());try{for(let r of document.styleSheets)try{let n=r.cssRules||r.rules;for(let i of n)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[o];if(l&&l.includes("var("))return l}}catch(n){}}catch(r){}return null}function lr(e,t){if(e instanceof HTMLElement){let r=e.style.getPropertyValue(t);if(r)return r}let o=t.replace(/-([a-z])/g,(r,n)=>n.toUpperCase());try{for(let r of document.styleSheets)try{let n=r.cssRules||r.rules;for(let i of n)if(i instanceof CSSStyleRule&&e.matches(i.selectorText)){let s=i.style.getPropertyValue(t);if(s)return s;let l=i.style[o];if(l)return l}}catch(n){}}catch(r){}return null}function ar(e){let t=window.getComputedStyle(e).display;return t==="flex"||t==="inline-flex"||t==="grid"||t==="inline-grid"}function Fo(e){let t=window.getComputedStyle(e);return{row:parseFloat(t.rowGap)||0,column:parseFloat(t.columnGap)||0}}function $c(e){let t=[];for(let o of e){let r=t.find(n=>n.axis!==o.axis?!1:o.axis==="row"?Math.abs(n.y-o.y)<2&&Math.abs(n.h-o.h)<2:Math.abs(n.x-o.x)<2&&Math.abs(n.w-o.w)<2);if(r)if(o.axis==="row"){let n=Math.min(r.x,o.x),i=Math.max(r.x+r.w,o.x+o.w);r.x=n,r.w=i-n}else{let n=Math.min(r.y,o.y),i=Math.max(r.y+r.h,o.y+o.h);r.y=n,r.h=i-n}else t.push(f({},o))}return t}function Vn(e){let t=Array.from(e.children).filter(a=>{if(!(a instanceof HTMLElement))return!1;let c=window.getComputedStyle(a);return c.display!=="none"&&c.position!=="absolute"&&c.position!=="fixed"});if(t.length<2)return[];let o=[],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 c=t[a].getBoundingClientRect(),d=t[a+1].getBoundingClientRect();if(d.left>c.right+.5&&o.push({axis:"column",x:c.right,y:r.top,w:d.left-c.right,h:r.height}),d.top>c.bottom+.5&&o.push({axis:"row",x:r.left,y:c.bottom,w:r.width,h:d.top-c.bottom}),!(d.left>c.right+.5)&&!(d.top>c.bottom+.5))if(s){let u=(c.bottom+d.top)/2;o.push({axis:"row",x:r.left,y:u-l/2,w:r.width,h:l})}else{let u=(c.right+d.left)/2;o.push({axis:"column",x:u-l/2,y:r.top,w:l,h:r.height})}}return $c(o)}function qr(e,t){let o=window.getComputedStyle(e),r=o.display;if(r!=="flex"&&r!=="inline-flex")return!1;let n=o.justifyContent;if(n!=="space-between"&&n!=="space-around"&&n!=="space-evenly"&&n!=="stretch")return!1;let i=o.flexDirection;return!(t!==(i==="column"||i==="column-reverse"?"row":"column")||parseFloat(t==="row"?o.rowGap:o.columnGap)>0)}function go(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 Un(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 Qr(e){for(let t of e.childNodes)if(t.nodeType===Node.TEXT_NODE&&(t.textContent||"").trim().length>0)return!0;return!1}function mo(e){var d,u;let t=document.createRange(),o=!1;for(let p of e.childNodes)p.nodeType===Node.TEXT_NODE&&(p.textContent||"").trim().length>0&&(o||(t.setStart(p,0),o=!0),t.setEnd(p,(u=(d=p.textContent)==null?void 0:d.length)!=null?u:0));if(!o)return null;let r=t.getBoundingClientRect(),n=window.getComputedStyle(e),i=parseFloat(n.fontSize)||16,s=parseFloat(n.lineHeight);isNaN(s)&&(s=i*1.2);let l=Math.max(1,t.getClientRects().length),a=Math.max(r.height,l*s),c=(a-r.height)/2;return new DOMRect(r.x,r.y-c,r.width,a)}function No(e){let t=window.getComputedStyle(e),o=parseFloat(t.fontSize)||16,r=parseFloat(t.lineHeight);return isNaN(r)&&(r=o*1.2),{fontSize:o,lineHeight:r}}function _e(e,t,o){e instanceof HTMLElement&&e.style.setProperty(t,o,"important")}function ei(e,t,o){e instanceof HTMLElement&&e.style.removeProperty(t)}function cr(e){var t;for(let o of e){let r=Jt(o.selector);if(!r&&o.durableSelector&&(r=Jt(o.durableSelector),r)){let n=(t=o.selector.match(/\[data-pm="([^"]+)"\]/))==null?void 0:t[1];n&&r.setAttribute("data-pm",n)}if(r)for(let n of o.changes)_e(r,n.property,n.modified)}}function ti(e,t){let o=Jt(e);if(!o)return;let r=t.find(n=>n.selector===e);if(r)for(let n of r.changes)ei(o,n.property,n.original)}function dr(e){for(let t of e){let o=Jt(t.selector);if(o)for(let r of t.changes)ei(o,r.property,r.original)}}function tl(e,t,o,r){if(e)for(let n of e){if(n instanceof CSSGroupingRule){tl(n.cssRules,t,o,r);continue}if(n instanceof CSSStyleRule){let i=n.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&Wc(n.style,t,o,r)}}}function Wc(e,t,o,r){for(let n=0;n<e.length;n++){let i=e[n];if(i!=null&&i.startsWith("--")){if(o.has(i))continue;o.add(i);let s=t.getPropertyValue(i).trim();nl(s)&&r.push({name:i,value:s,usage:`var(${i})`})}}}var ur=null,Yc=5e3;function ni(){if(ur&&Date.now()-ur.timestamp<Yc)return ur.variables;let e=[],t=new Set,o=getComputedStyle(document.documentElement);try{for(let i of document.styleSheets)try{tl(i.cssRules||i.rules,o,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=o.getPropertyValue(s).trim();nl(l)&&e.push({name:s,value:l,usage:`var(${s})`})}}let n=e.sort((i,s)=>i.name.localeCompare(s.name));return ur={variables:n,timestamp:Date.now()},n}function nl(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 _o(e,t){let o=t.match(/var\((--[^,)]+)(?:,\s*([^)]+))?\)/);if(o){let r=o[1],n=o[2];return getComputedStyle(document.documentElement).getPropertyValue(r).trim()||n||t}return t}function zo(e,t){if(!e)return null;let o=el(e);if(!o)return null;for(let r of t){let n=el(r.value);if(n&&o===n)return r}return null}function el(e){if(!e)return null;let t=e.trim().toLowerCase();if(t.startsWith("oklch(")){let o=t.match(/oklch\(\s*([\d.]+%?)\s+([\d.]+%?)\s+([\d.]+)/);if(o){let r=o[1].endsWith("%")?parseFloat(o[1])/100:parseFloat(o[1]),n=o[2].endsWith("%")?parseFloat(o[2])/100:parseFloat(o[2]),i=parseFloat(o[3]);r=Math.round(r*100)/100,n=Math.round(n*1e3)/1e3;let s=Math.round(i);return`oklch(${r} ${n} ${s})`}}if(t.startsWith("rgb")){let o=t.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(o)return`rgb(${o[1]},${o[2]},${o[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 Jn,jsx as Xe,jsxs as pn}from"react/jsx-runtime";var Xn=22,ho=12,jc=3,Gc=250,oi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Vc=3e3;function Uc(i){var s=i,{left:e,top:t,style:o,children:r}=s,n=Hn(s,["left","top","style","children"]);return Xe("div",h(f({"data-devtools":"badge-hit-area"},n),{style:f({position:"fixed",left:`max(0px, ${e}px)`,top:`max(0px, ${t}px)`,padding:ho,transform:`translate(min(0px, calc(100vw - max(0px, ${e}px) - 100%)), min(0px, calc(100vh - max(0px, ${t}px) - 100%)))`},o),children:r}))}function il({annotations:e,supersededAnnotations:t,inFlightIds:o,scrollX:r,scrollY:n,annotationGroupMap:i,onViewThread:s,onSelectAnnotation:l,canvasRef:a}){var b,w,O,A;let[c,d]=$o(0),[u,p]=$o(()=>Math.floor(Math.random()*oi.length)),g=!!(o&&o.size>0);pr(()=>{if(!g)return;let k=setInterval(()=>{d(I=>(I+1)%jc)},Gc),E=setInterval(()=>{p(I=>(I+1)%oi.length)},Vc);return()=>{clearInterval(k),clearInterval(E)}},[g]);let S=[];for(let k of e){if(k.type!=="text"||!k.text||!k.points[0]||t.has(k))continue;let E=k.groupId?e.filter(xe=>xe.groupId===k.groupId):[k],I=!!(o&&(o.has(k.id)||E.some(xe=>o.has(xe.id)))),$=(b=k.status)!=null?b:"pending",q=E.some(xe=>xe.status==="resolved"||xe.status==="needs_review"),j=E.some(xe=>xe.threadId);if(!I&&$!=="resolved"&&$!=="needs_review"&&!q&&!j)continue;let T=k.threadId||((w=E.find(xe=>xe.threadId))==null?void 0:w.threadId),D=$==="needs_review"||E.some(xe=>xe.status==="needs_review"),K=E.reduce((xe,ge)=>{var Ge;return xe+((Ge=ge.replyCount)!=null?Ge:0)},0),ee=k.points[0],me=k.fontSize||12,ve=me*1.4,ae=k.text.split(`
5
- `),Re=i.get(k.id),We=Re!==void 0?[Re+". "+(ae[0]||""),...ae.slice(1)]:ae,Me=(A=(O=a==null?void 0:a.current)==null?void 0:O.getContext("2d"))!=null?A:document.createElement("canvas").getContext("2d");if(!Me)continue;Me.font=`${me}px ${Wt}`;let ne=ee.x-r,Ae=co(ne),G=Ae!==void 0?Math.min(400,Ae):400,oe=jn(Me,We,G),Ee=Math.min(G,Math.max(...oe.map(xe=>Me.measureText(xe).width))),ce=oe.length*ve,Ke=We.length*ve,Te=ce-Ke;S.push({id:k.id,threadId:T,x:ee.x+Ee+4,y:ee.y-4-Te,size:ce+8,color:k.color,isInFlight:I,isNeedsReview:D,replyCount:K})}if(S.length===0)return null;let v=!!s;return Xe(Jn,{children:S.map(k=>Xe(Uc,{left:k.x-r-ho,top:k.y-n-ho,onClick:v&&k.threadId?()=>{l==null||l(k.id),s(k.threadId)}:void 0,style:{pointerEvents:v?"auto":"none",cursor:v&&k.threadId?"pointer":void 0,zIndex:9999},children:Xe("div",{"data-devtools":"annotation-badge",style:{height:k.size,display:"flex",alignItems:"center",backgroundColor:k.color,fontFamily:Wt,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:k.isInFlight?pn(Jn,{children:[Xe("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?pn(Jn,{children:[Xe("circle",{cx:"7",cy:"7",r:"2"}),Xe("circle",{cx:"17",cy:"7",r:"2"}),Xe("circle",{cx:"7",cy:"17",r:"2"}),Xe("circle",{cx:"17",cy:"17",r:"2"})]}):pn(Jn,{children:[Xe("circle",{cx:"12",cy:"6",r:"2"}),Xe("circle",{cx:"6",cy:"12",r:"2"}),Xe("circle",{cx:"18",cy:"12",r:"2"}),Xe("circle",{cx:"12",cy:"18",r:"2"})]})}),Xe("span",{style:{opacity:.7},children:oi[u]})]}):pn(Jn,{children:[k.isNeedsReview?Xe("span",{style:{fontWeight:700},children:"?"}):pn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[Xe("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),Xe("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),Xe("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),Xe("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),Xe("span",{style:{opacity:.7},children:k.replyCount>0?`${k.replyCount} ${k.replyCount===1?"reply":"replies"}`:"Cancelled"})]})})},k.id))})}function ri({inFlightSelectorColors:e,animated:t=!0}){let[o,r]=$o([]);if(pr(()=>{if(e.size===0){r([]);return}let i=null,s=()=>{let c=[];for(let[d,u]of e){let p=Jt(d);if(!p)continue;let g=p.getBoundingClientRect();c.push({selector:d,top:g.top,left:g.left,width:g.width,height:g.height,color:u})}r(c)},l=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(s)};s(),window.addEventListener("scroll",l,!0),window.addEventListener("resize",l,!0);let a=new MutationObserver(l);return a.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",l,!0),window.removeEventListener("resize",l,!0),a.disconnect(),i&&cancelAnimationFrame(i)}},[e]),o.length===0)return null;let n={position:"absolute",width:2,height:2,pointerEvents:"none"};return pn(Jn,{children:[t&&Xe("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),o.map(i=>pn("div",{"data-devtools":"marching-ants",style:{position:"fixed",top:i.top,left:i.left,width:i.width,height:i.height,pointerEvents:"none",zIndex:9995,overflow:"visible"},children:[Xe("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible"},children:Xe("rect",{x:"0.5",y:"0.5",width:Math.max(0,i.width-1),height:Math.max(0,i.height-1),fill:"none",stroke:i.color,strokeWidth:"1",strokeDasharray:"2 4",style:t?{animation:"popmelt-march 0.5s steps(2) infinite"}:void 0})}),Xe("div",{style:h(f({},n),{top:-1,left:-1,backgroundColor:i.color})}),Xe("div",{style:h(f({},n),{top:-1,right:-1,backgroundColor:i.color})}),Xe("div",{style:h(f({},n),{bottom:-1,left:-1,backgroundColor:i.color})}),Xe("div",{style:h(f({},n),{bottom:-1,right:-1,backgroundColor:i.color})})]},i.selector))]})}function sl({annotations:e,supersededAnnotations:t,scrollX:o,scrollY:r,onReply:n,annotationGroupMap:i,canvasRef:s}){let l=e.filter(d=>t.has(d)?!1:d.status==="waiting_input"&&d.question&&d.threadId);if(l.length===0)return null;let a=new Set,c=[];for(let d of l){if(!d.threadId||a.has(d.threadId))continue;a.add(d.threadId);let u=d.type==="text"?d:e.find(p=>p.groupId&&p.groupId===d.groupId&&p.type==="text")||d;if(u.type==="text"&&u.text&&u.points[0]){let p=u.points[0],g=u.fontSize||12,S=g*1.4,v=u.text.split(`
6
- `),b=i.get(u.id),w=b!==void 0?[b+". "+(v[0]||""),...v.slice(1)]:v,A=document.createElement("canvas").getContext("2d");if(!A)continue;A.font=`${g}px ${Wt}`;let k=p.x-o,E=co(k),I=E!==void 0?Math.min(400,E):400,$=jn(A,w,I),q=Math.min(I,Math.max(...$.map(ee=>A.measureText(ee).width))),j=$.length*S,T=w.length*S,D=j-T,K=j+8;c.push({annotation:d,x:p.x+q+4,y:p.y-4-D,size:K})}}return c.length===0?null:Xe(Jn,{children:c.map(({annotation:d,x:u,y:p,size:g})=>Xe(Jc,{annotation:d,x:u-o,y:p-r,size:g,onReply:n},`question-${d.threadId}`))})}function Jc({annotation:e,x:t,y:o,size:r,onReply:n}){let[i,s]=$o(!1),[l,a]=$o(""),c=rl(null),d=rl(null);pr(()=>{i&&c.current&&c.current.focus()},[i]),pr(()=>{if(!i)return;let v=w=>{d.current&&!w.composedPath().includes(d.current)&&s(!1)},b=w=>{w.key==="Escape"&&s(!1)};return document.addEventListener("mousedown",v),document.addEventListener("keydown",b),()=>{document.removeEventListener("mousedown",v),document.removeEventListener("keydown",b)}},[i]);let u=ol(()=>{!l.trim()||!e.threadId||(n(e.threadId,l.trim()),a(""),s(!1))},[l,e.threadId,n]),p=ol(v=>{v.key==="Enter"&&(v.metaKey||v.ctrlKey)&&(v.preventDefault(),u())},[u]),g=i?t:t-ho,S=i?o:o-ho;return pn("div",{ref:d,"data-devtools":"question-badge",style:{position:"fixed",left:`max(0px, ${g}px)`,top:`max(0px, ${S}px)`,padding:i?0:ho,transform:`translate(min(0px, calc(100vw - max(0px, ${g}px) - 100%)), min(0px, calc(100vh - max(0px, ${S}px) - 100%)))`,zIndex:i?10002:9999,pointerEvents:"auto",cursor:i?void 0:"pointer"},children:[!i&&pn("div",{onClick:()=>s(!0),style:{height:r,display:"flex",alignItems:"center",backgroundColor:e.color,padding:`0 ${4}px`,gap:4,fontFamily:Wt,fontSize:12,color:"#ffffff",whiteSpace:"nowrap"},children:[pn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[Xe("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),Xe("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),Xe("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),Xe("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),Xe("span",{style:{opacity:.7},children:"reply?"})]}),i&&pn("div",{style:{minWidth:260,maxWidth:360,backgroundColor:"#ffffff",fontFamily:Wt,fontSize:12,color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)"},children:[Xe("div",{style:{padding:`${6}px ${8}px`,lineHeight:1.4},children:e.question}),pn("div",{style:{padding:`0 ${4}px ${4}px`},children:[Xe("textarea",{ref:c,value:l,onChange:v=>a(v.target.value),onKeyDown:p,placeholder:"Type your reply...",style:{width:"100%",minHeight:40,padding:4,fontSize:12,fontFamily:Wt,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"}}),Xe("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:4},children:Xe("button",{onClick:u,disabled:!l.trim(),style:{padding:"4px 12px",fontSize:11,fontFamily:Wt,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 fr(e){var i;let t=new Set,o=new Map;for(let s of e){if(!s.linkedSelector)continue;let l=o.get(s.linkedSelector)||[];l.push(s),o.set(s.linkedSelector,l)}let r=new Set,n=new Set;for(let s of o.values()){if(s.length<=1){(i=s[0])!=null&&i.groupId&&n.add(s[0].groupId);continue}s.sort((a,c)=>c.timestamp-a.timestamp);let l=s[0];l.groupId&&n.add(l.groupId);for(let a=1;a<s.length;a++){let c=s[a];t.add(c),c.groupId&&r.add(c.groupId)}}for(let s of e)s.groupId&&r.has(s.groupId)&&!n.has(s.groupId)&&t.add(s);return t}import{useEffect as ll,useLayoutEffect as Xc,useState as al}from"react";import{jsx as ii,jsxs as dl}from"react/jsx-runtime";function Kc(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var cl=["top-left","top-right","bottom-right","bottom-left"];function ul({element:e,radius:t,accentColor:o,hoveredCorner:r,draggingCorner:n,cursorViewport:i}){let[s,l]=al(null),[a,c]=al(!1);if(ll(()=>{let w=k=>{(k.key==="Meta"||k.key==="Control")&&c(!0)},O=k=>{(k.key==="Meta"||k.key==="Control")&&c(!1)},A=()=>c(!1);return window.addEventListener("keydown",w,!0),window.addEventListener("keyup",O,!0),window.addEventListener("blur",A),()=>{window.removeEventListener("keydown",w,!0),window.removeEventListener("keyup",O,!0),window.removeEventListener("blur",A)}},[]),ll(()=>{if(!e){l(null);return}let w=()=>{l(e.getBoundingClientRect())};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[e]),Xc(()=>{e&&l(e.getBoundingClientRect())},[e,t["top-left"],t["top-right"],t["bottom-right"],t["bottom-left"]]),!s)return null;let d=s.width,u=s.height,p=Kc(o,.2),g={"top-left":{x:0,y:t["top-left"]},"top-right":{x:d,y:t["top-right"]},"bottom-right":{x:d,y:u-t["bottom-right"]},"bottom-left":{x:0,y:u-t["bottom-left"]}},S=new Set,v=n!=null?n:r;if(v)if(a)S.add(v);else for(let w of cl)S.add(w);let b={position:"fixed",top:s.top,left:s.left,width:d,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"};return dl("div",{"data-devtools":"border-radius-handles",style:b,children:[dl("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${u}`,children:[ii("rect",{x:"0.5",y:"0.5",width:Math.max(0,d-1),height:Math.max(0,u-1),fill:"none",stroke:p,strokeWidth:"1"}),cl.map(w=>{let O=g[w],A=S.has(w);return ii("circle",{cx:O.x,cy:O.y,r:w===(n!=null?n:r)?3:2.5,fill:o,stroke:"#ffffff",strokeWidth:w===(n!=null?n:r)?4:2,paintOrder:"stroke"},w)})]}),i&&v&&(()=>{let w=Math.round(t[v]);return ii("div",{style:{position:"fixed",left:i.x+8,top:i.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:w})})()]})}import{useEffect as Zc,useState as qc}from"react";function Kn(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);if(o)return`oklch(${o[1]} / ${t})`;let r=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);if(r){let n=parseInt(r[1],16),i=parseInt(r[2],16),s=parseInt(r[3],16);return`rgba(${n}, ${i}, ${s}, ${t})`}return`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}import{Fragment as Qc,jsx as Zn,jsxs as Wo}from"react/jsx-runtime";function bo({element:e,isSelected:t=!1,elementInfo:o,color:r="#3b82f6",annotationNumber:n,changeCount:i,hideTooltip:s=!1}){let[l,a]=qc(null);if(Zc(()=>{if(!e){a(null);return}let I=()=>{let $=e.getBoundingClientRect();a($)};return I(),window.addEventListener("scroll",I,{passive:!0}),window.addEventListener("resize",I,{passive:!0}),()=>{window.removeEventListener("scroll",I),window.removeEventListener("resize",I)}},[e]),!l||!e)return null;let c={position:"fixed",top:l.top,left:l.left,width:l.width,height:l.height,pointerEvents:"none",zIndex:9996,backgroundColor:t?Kn(r,.1):Kn(r,.05),overflow:"visible"},d={position:"absolute",width:2,height:2,backgroundColor:r,pointerEvents:"none"},u=e.tagName.toLowerCase(),p=e.id?`#${e.id}`:"",g=e.classList.length>0?"."+Array.from(e.classList).slice(0,2).join("."):"",S=o==null?void 0:o.reactComponent,v=S?`<${S}> ${u}${p}${g}`:`${u}${p}${g}`,b=22,w=l.height>=window.innerHeight,O=w?0:l.top>=b?l.top-b:l.bottom,A=w?{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:O,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},E=!s&&Wo("div",{"data-devtools":"tooltip",style:A,children:[n!==void 0&&Wo("span",{children:[n,"."]}),Zn("span",{style:{overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0},children:v}),i!==void 0&&i>0&&Wo("span",{style:{opacity:.8},children:["(",i," ",i===1?"change":"changes",")"]})]});return Wo(Qc,{children:[Wo("div",{"data-devtools":"highlight",style:c,children:[Zn("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:Zn("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"}))}),Zn("div",{style:h(f({},d),{top:-1,left:-1})}),Zn("div",{style:h(f({},d),{top:-1,right:-1})}),Zn("div",{style:h(f({},d),{bottom:-1,left:-1})}),Zn("div",{style:h(f({},d),{bottom:-1,right:-1})}),w&&E]}),!w&&E]})}import{useEffect as pl,useLayoutEffect as ed,useState as si}from"react";import{jsx as In,jsxs as ai}from"react/jsx-runtime";function li(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function ci({element:e,gap:t,accentColor:o,hoveredAxis:r,draggingAxis:n,cursorViewport:i,isAutoGap:s=!1,refreshKey:l=0}){let[a,c]=si(null),[d,u]=si([]),[p,g]=si(!1);if(pl(()=>{let q=D=>{(D.key==="Meta"||D.key==="Control")&&g(!0)},j=D=>{(D.key==="Meta"||D.key==="Control")&&g(!1)},T=()=>g(!1);return window.addEventListener("keydown",q,!0),window.addEventListener("keyup",j,!0),window.addEventListener("blur",T),()=>{window.removeEventListener("keydown",q,!0),window.removeEventListener("keyup",j,!0),window.removeEventListener("blur",T)}},[]),pl(()=>{if(!e){c(null),u([]);return}let q=()=>{c(e.getBoundingClientRect()),u(Vn(e))};return q(),window.addEventListener("scroll",q,{passive:!0}),window.addEventListener("resize",q,{passive:!0}),()=>{window.removeEventListener("scroll",q),window.removeEventListener("resize",q)}},[e]),ed(()=>{e&&(c(e.getBoundingClientRect()),u(Vn(e)))},[e,t.row,t.column,l]),!a||d.length===0)return null;let S=a.width,v=a.height,b="pm-gap-stripe-pattern",w=li(o,.25),O=li(o,.1),A=li(o,.2),k=8,E=2,I={position:"fixed",top:a.top,left:a.left,width:S,height:v,pointerEvents:"none",zIndex:9996,overflow:"visible"},$=n!=null?n:r;return ai("div",{"data-devtools":"gap-handles",style:I,children:[ai("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${S} ${v}`,children:[In("defs",{children:In("pattern",{id:b,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:In("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:w,strokeWidth:"1.5"})})}),In("rect",{x:"0.5",y:"0.5",width:Math.max(0,S-1),height:Math.max(0,v-1),fill:"none",stroke:A,strokeWidth:"1"}),d.map((q,j)=>{let T=q.x-a.left,D=q.y-a.top,K=q.w,ee=q.h,me=p?q.axis===$:!0;return(q.axis==="row"?t.row:t.column)===0?null:ai("g",{opacity:me?1:.6,children:[In("rect",{x:T,y:D,width:K,height:ee,fill:O}),In("rect",{x:T,y:D,width:K,height:ee,fill:`url(#${b})`})]},j)}),$&&(()=>{let q=d.filter(Ae=>Ae.axis===$);if(q.length===0)return null;let j=q[0];if(i&&q.length>1){let Ae=1/0;for(let G of q){let oe=G.x+G.w/2,Ee=G.y+G.h/2,ce=Math.abs(i.x-oe)+Math.abs(i.y-Ee);ce<Ae&&(Ae=ce,j=G)}}let T=j.x-a.left,D=j.y-a.top,K=j.w,ee=j.h,me=T+K/2,ve=D+ee/2;if(s)return In("circle",{cx:me,cy:ve,r:1.5,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let ae=$==="column",Re=ae?E:k,We=ae?k:E,Me=me-Re/2,ne=ve-We/2;return In("rect",{x:Me,y:ne,width:Re,height:We,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),i&&$&&(()=>{let q=s?"auto":String(Math.round($==="row"?t.row:t.column));return In("div",{style:{position:"fixed",left:i.x+8,top:i.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:q})})()]})}import{useCallback as id,useEffect as sd,useState as ld}from"react";import{useEffect as td,useState as fl}from"react";var nd=3,od=250,di=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],rd=3e3;function gr(e){let[t,o]=fl(0),[r,n]=fl(()=>Math.floor(Math.random()*di.length));return td(()=>{if(!e)return;let i=setInterval(()=>o(l=>(l+1)%nd),od),s=setInterval(()=>n(l=>(l+1)%di.length),rd);return()=>{clearInterval(i),clearInterval(s)}},[e]),{charIndex:t,word:di[r]}}import{Fragment as ui,jsx as ln,jsxs as xo}from"react/jsx-runtime";function ad(e){let{element:t}=e,o=t.tagName,r=t.id?`#${t.id}`:"",n=t.className?"."+t.className.split(" ").slice(0,2).join("."):"",i=t.reactComponent;return i?`<${i}> ${o}${r}${n}`:`${o}${r}${n}`}var gl=22,pi=12;function cd(i){var s=i,{left:e,top:t,style:o,children:r}=s,n=Hn(s,["left","top","style","children"]);return ln("div",h(f({"data-devtools":"badge-hit-area"},n),{style:f({position:"fixed",left:`max(0px, ${e}px)`,top:`max(0px, ${t}px)`,padding:pi,transform:`translate(min(0px, calc(100vw - max(0px, ${e}px) - 100%)), min(0px, calc(100vh - max(0px, ${t}px) - 100%)))`},o),children:r}))}function ml({styleModifications:e,isInspecting:t,accentColor:o,annotationGroupCount:r,dispatch:n,inFlightSelectors:i}){let[s,l]=ld([]),a=i&&i.size>0,{charIndex:c,word:d}=gr(!!a);sd(()=>{if(t){l([]);return}let S=null,v=()=>{let O=[];e.forEach((A,k)=>{let E=Jt(A.selector);if(!E)return;let I=E.getBoundingClientRect();O.push({selector:A.selector,modIndex:k,top:I.top>=gl?I.top-gl:I.bottom,left:I.left,label:ad(A),changeCount:A.changes.length,annotationNumber:r+k+1})}),l(O)},b=()=>{S&&cancelAnimationFrame(S),S=requestAnimationFrame(v)};v(),window.addEventListener("scroll",b,!0),window.addEventListener("resize",b,!0);let w=new MutationObserver(b);return w.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),window.addEventListener("load",b),document.fonts.ready.then(b),()=>{window.removeEventListener("scroll",b,!0),window.removeEventListener("resize",b,!0),window.removeEventListener("load",b),w.disconnect(),S&&cancelAnimationFrame(S)}},[e,t,r]);let u=id(S=>{let v=e[S];if(!v)return;let b=Jt(v.selector);b&&(n({type:"SELECT_ANNOTATION",payload:{id:null}}),n({type:"SET_TOOL",payload:"inspector"}),n({type:"SELECT_ELEMENT",payload:{el:b,info:v.element}}))},[e,n]);if(s.length===0)return null;let p={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,whiteSpace:"nowrap",maxWidth:400},g={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return ln(ui,{children:s.map(S=>{let v=i==null?void 0:i.has(S.selector);return ln(cd,{left:S.left-pi,top:S.top-pi,onClick:()=>u(S.modIndex),style:{zIndex:1e4,cursor:"pointer",pointerEvents:"auto"},children:xo("div",{"data-devtools":"badge",style:h(f({},p),{backgroundColor:v?"#999999":o}),children:[xo("span",{children:[S.annotationNumber,"."]}),ln("span",{style:g,children:S.label}),xo("span",{style:{opacity:.8},children:["(",S.changeCount," ",S.changeCount===1?"change":"changes",")"]}),v&&xo("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[ln("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?xo(ui,{children:[ln("circle",{cx:"7",cy:"7",r:"2"}),ln("circle",{cx:"17",cy:"7",r:"2"}),ln("circle",{cx:"7",cy:"17",r:"2"}),ln("circle",{cx:"17",cy:"17",r:"2"})]}):xo(ui,{children:[ln("circle",{cx:"12",cy:"6",r:"2"}),ln("circle",{cx:"6",cy:"12",r:"2"}),ln("circle",{cx:"18",cy:"12",r:"2"}),ln("circle",{cx:"12",cy:"18",r:"2"})]})}),d]})]})},S.selector)})})}import{useEffect as dd,useState as ud}from"react";import{Fragment as fd,jsx as hl}from"react/jsx-runtime";function pd(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function yl({styleModifications:e,accentColor:t}){let[o,r]=ud([]);if(dd(()=>{let i=null,s=()=>{let c=[];for(let d of e){let u=Jt(d.selector);if(!u)continue;let p=u.getBoundingClientRect();if(p.width===0&&p.height===0)continue;let g=Un(u);c.push({selector:d.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(c)},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]),o.length===0)return null;let n=pd(t,.2);return hl(fd,{children:o.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 ${n}`,borderRadius:i.borderRadius,boxSizing:"border-box"};return hl("div",{"data-devtools":"mod-border",style:s},i.selector)})})}import{useEffect as bl,useLayoutEffect as gd,useState as xl}from"react";import{jsx as Fn,jsxs as gi}from"react/jsx-runtime";function fi(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var md={top:"bottom",bottom:"top",left:"right",right:"left"};function mi({element:e,padding:t,accentColor:o,hoveredSide:r,draggingSide:n,cursorViewport:i,refreshKey:s}){let[l,a]=xl(null),[c,d]=xl(!1);if(bl(()=>{let K=ve=>{(ve.key==="Meta"||ve.key==="Control")&&d(!0)},ee=ve=>{(ve.key==="Meta"||ve.key==="Control")&&d(!1)},me=()=>d(!1);return window.addEventListener("keydown",K,!0),window.addEventListener("keyup",ee,!0),window.addEventListener("blur",me),()=>{window.removeEventListener("keydown",K,!0),window.removeEventListener("keyup",ee,!0),window.removeEventListener("blur",me)}},[]),bl(()=>{if(!e){a(null);return}let K=()=>{a(e.getBoundingClientRect())};return K(),window.addEventListener("scroll",K,{passive:!0}),window.addEventListener("resize",K,{passive:!0}),()=>{window.removeEventListener("scroll",K),window.removeEventListener("resize",K)}},[e]),gd(()=>{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:S,bottom:v,left:b}=t,w="pm-stripe-pattern",O=fi(o,.25),A=fi(o,.1),k=fi(o,.2),E=8,I=2,$={position:"fixed",top:l.top,left:l.left,width:u,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"},q=["top","right","bottom","left"],j={top:`0,0 ${u},0 ${u-S},${g} ${b},${g}`,right:`${u},0 ${u},${p} ${u-S},${p-v} ${u-S},${g}`,bottom:`0,${p} ${b},${p-v} ${u-S},${p-v} ${u},${p}`,left:`0,0 ${b},${g} ${b},${p-v} 0,${p}`},T={top:{x:u/2-E/2,y:g/2-I/2,w:E,h:I},bottom:{x:u/2-E/2,y:p-v/2-I/2,w:E,h:I},left:{x:b/2-I/2,y:p/2-E/2,w:I,h:E},right:{x:u-S/2-I/2,y:p/2-E/2,w:I,h:E}},D=new Set;return n?D.add(n):r&&(D.add(r),c||D.add(md[r])),gi("div",{"data-devtools":"padding-handles",style:$,children:[gi("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${u} ${p}`,children:[Fn("defs",{children:Fn("pattern",{id:w,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Fn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:O,strokeWidth:"1.5"})})}),Fn("rect",{x:"0.5",y:"0.5",width:Math.max(0,u-1),height:Math.max(0,p-1),fill:"none",stroke:k,strokeWidth:"1"}),q.map(K=>{if(t[K]<=0)return null;let me=D.has(K);return gi("g",{opacity:me?1:.6,children:[Fn("polygon",{points:j[K],fill:A}),Fn("polygon",{points:j[K],fill:`url(#${w})`})]},K)}),q.map(K=>{let ee=T[K],me=D.has(K);return Fn("rect",{x:ee.x,y:ee.y,width:ee.w,height:ee.h,fill:o,stroke:"#ffffff",strokeWidth:me?4:2,paintOrder:"stroke"},`handle-${K}`)})]}),i&&(r||n)&&(()=>{let K=n!=null?n:r,ee=Math.round(t[K]);return Fn("div",{style:{position:"fixed",left:i.x+8,top:i.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:ee})})()]})}import{useCallback as Mn,useEffect as gn,useMemo as Sr,useRef as on,useState as jt}from"react";import{Check as vr,ChevronDown as Ei,MoveHorizontal as Al,RotateCcw as zd,Shrink as $d,X as Wd}from"lucide-react";var hd="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",bn={borderWidth:3,borderStyle:"solid",borderImage:`url("${hd}") 4 / 1.9 / 0 round`};var mr={"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 vo(e){var t,o;return(o=(t=mr[e])==null?void 0:t[0])!=null?o:"px"}function Nn(e){let t=e.match(/^([\d.-]+)(.*)$/);return t?{num:parseFloat(t[1]),unit:t[2]||""}:{num:0,unit:""}}function hr(e,t,o,r){let n=e.trim();if(!n)return"";let i=n.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i);if(i)return`${parseFloat(i[1])}${i[2].toLowerCase()}`;let s=parseFloat(n);if(!isNaN(s)){if(r){let{unit:l}=Nn(o);return`${s}${l||vo(t)}`}return`${s}${vo(t)}`}return n}function hi(e,t){if(!t||t==="px")return e;if(t==="rem"){let o=parseFloat(getComputedStyle(document.documentElement).fontSize)||16;return Math.round(e/o*1e3)/1e3}return e}import{useCallback as yd,useEffect as bd,useRef as vl,useState as xd}from"react";import{Plus as Sl,X as vd}from"lucide-react";import{jsx as nn,jsxs as qn}from"react/jsx-runtime";var yr=[{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 Sd(e){if(!e||e==="none")return[];let t=[],o=/([\w-]+)\(([^)]+)\)/g,r;for(;(r=o.exec(e))!==null;){let n=r[1],i=r[2],s=parseFloat(i);isNaN(s)||t.push({name:n,value:s})}return t}function yi(e){return e.length===0?"none":e.map(t=>{var n;let o=yr.find(i=>i.name===t.name),r=(n=o==null?void 0:o.unit)!=null?n:"";return`${t.name}(${t.value}${r})`}).join(" ")}function wl({value:e,onChange:t,accentColor:o,modified:r,panelContentRef:n}){let i=Sd(e),[s,l]=xd(!1),a=vl(null),c=vl(null);bd(()=>{if(!s)return;let A=k=>{a.current&&!k.composedPath().includes(a.current)&&l(!1)};return document.addEventListener("mousedown",A,!0),()=>document.removeEventListener("mousedown",A,!0)},[s]);let d=yr.filter(A=>!i.some(k=>k.name===A.name)),u=A=>{let k=[...i,{name:A.name,value:A.defaultValue}];t(yi(k)),l(!1)},p=A=>{let k=i.filter((E,I)=>I!==A);t(yi(k))},g=(A,k)=>{let E=i.map((I,$)=>$===A?h(f({},I),{value:k}):I);t(yi(E))},S={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},v=yd(A=>{var D;if(!c.current)return{position:"fixed",top:0,left:0};let k=c.current.getBoundingClientRect(),E=c.current.closest('[data-devtools="panel"]'),I=E?E.getBoundingClientRect():{top:0,left:0,bottom:9999},$=(D=n==null?void 0:n.current)==null?void 0:D.getBoundingClientRect(),q=A*24+8,T=I.bottom-k.bottom<q;return h(f({position:"fixed"},T?{bottom:I.bottom-k.top+2-I.top}:{top:k.bottom+2-I.top}),{left:$?$.left+4-I.left:k.left-I.left,width:$?$.width-8:140,zIndex:10001})},[n]),b={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)"},w={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"},O=A=>nn("div",{ref:a,style:f(f({},v(A.length)),b),children:A.map(k=>nn("button",{type:"button",onClick:()=>u(k),style:w,onMouseEnter:E=>{E.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:E=>{E.currentTarget.style.backgroundColor="transparent"},children:k.label},k.name))});return i.length===0?qn("div",{children:[qn("div",{style:{display:"flex",alignItems:"center",gap:4},children:[nn(Rn,{modified:!1,children:nn("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:h(f({},S),{color:"#999",cursor:"default"})})}),nn("button",{ref:c,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:nn(Sl,{size:12})})]}),s&&O(yr)]}):qn("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[i.map((A,k)=>{let E=yr.find(I=>I.name===A.name);return E?qn("div",{style:{display:"flex",alignItems:"center",gap:4},children:[nn("span",{style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:r?o:"#94a3b8",fontWeight:r?600:400,width:56,flexShrink:0,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:E.label}),nn(Rn,{modified:r,children:qn("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[nn("input",{type:"range",min:E.min,max:E.max,step:E.step,value:A.value,onChange:I=>g(k,parseFloat(I.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${o} ${(A.value-E.min)/(E.max-E.min)*100}%, rgba(0,0,0,0.1) ${(A.value-E.min)/(E.max-E.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),nn("input",{type:"number",min:E.min,max:E.max,step:E.step,value:E.unit==="px"||E.unit==="deg"?Math.round(A.value):Math.round(A.value*100)/100,onChange:I=>g(k,parseFloat(I.target.value)||0),style:h(f({},S),{width:44,padding:"2px 4px",textAlign:"right",flexShrink:0})}),E.unit&&nn("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:E.unit})]})}),nn("button",{type:"button",onClick:()=>p(k),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:nn(vd,{size:10})})]},A.name):null}),d.length>0&&qn("div",{children:[qn("button",{ref:c,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:[nn(Sl,{size:10}),"Add filter"]}),s&&O(d)]})]})}import{useCallback as wo,useEffect as Cd,useRef as br,useState as El}from"react";import{AlignHorizontalSpaceAround as Md,AlignVerticalSpaceAround as Td,Columns3 as Ld,Grid2x2 as Id,RectangleHorizontal as Rd,Rows3 as Ad,UnfoldHorizontal as kl,UnfoldVertical as Cl}from"lucide-react";import{useCallback as wd,useEffect as Ed,useRef as Yo}from"react";import{jsx as kd}from"react/jsx-runtime";var bi=[0,1,2,4,8,12,16,20,24,28,32];function So({value:e,onChange:t,onPreview:o,onScrubEnd:r,onReset:n,isModified:i,accentColor:s,defaultUnit:l="rem",snapSteps:a,color:c,style:d,children:u}){let p=Yo(null),g=Yo(null),S=Yo(n),v=Yo(i),b=Yo(!1);S.current=n,v.current=i,Ed(()=>{let O=k=>{let E=g.current;if(!E)return;E.hasMoved=!0,b.current=k.shiftKey;let I=E.unit==="rem"||E.unit==="em"?.1:1;E.accum+=k.movementX*I;let $=Math.max(0,Math.round((E.startValue+E.accum)*10)/10);if(k.shiftKey&&a){let q=E.unit==="rem"||E.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,j=E.unit==="rem"||E.unit==="em"?$*q:$,T=a[a.length-1];for(let D=0;D<a.length-1;D++){let K=a[D],ee=a[D+1];if(j<=(K+ee)/2){T=K;break}if(j<ee){T=ee;break}}j>a[a.length-1]&&(T=Math.round(j/8)*8),$=E.unit==="rem"||E.unit==="em"?Math.round(T/q*1e3)/1e3:T}o==null||o(`${$}${E.unit}`)},A=()=>{let k=g.current;if(!k)return;let E=Math.max(0,Math.round((k.startValue+k.accum)*10)/10);if(b.current&&a){let $=k.unit==="rem"||k.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,q=k.unit==="rem"||k.unit==="em"?E*$:E,j=a[a.length-1];for(let T=0;T<a.length-1;T++){let D=a[T],K=a[T+1];if(q<=(D+K)/2){j=D;break}if(q<K){j=K;break}}q>a[a.length-1]&&(j=Math.round(q/8)*8),E=k.unit==="rem"||k.unit==="em"?Math.round(j/$*1e3)/1e3:j}let I=k.hasMoved&&E!==k.startValue;g.current=null,document.exitPointerLock(),I?t(`${E}${k.unit}`):k.hasMoved?o==null||o(`${k.startValue}${k.unit}`):v.current&&S.current&&S.current(),r==null||r()};return document.addEventListener("mousemove",O),document.addEventListener("mouseup",A),()=>{document.removeEventListener("mousemove",O),document.removeEventListener("mouseup",A)}},[t,o,r]);let w=wd(O=>{var E;if(O.button!==0)return;O.preventDefault();let A=Nn(e),k=A.unit&&A.unit!=="px"?A.unit:l;g.current={startValue:A.num,unit:k,accum:0,hasMoved:!1},(E=p.current)==null||E.requestPointerLock()},[e,l]);return kd("span",{ref:p,onMouseDown:w,title:i?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:f({color:i?s||"#3b82f6":c||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize"},d),children:u})}import{Fragment as xi,jsx as Ce,jsxs as Nt}from"react/jsx-runtime";function Pd({gridCols:e,gridRows:t,gridModified:o,accentColor:r,onColsChange:n,onRowsChange:i}){return Ce(an,{style:{width:100},children:Nt("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[Ce("input",{type:"number",min:1,max:12,value:e,onChange:s=>n(parseInt(s.target.value)||1),style:h(f({},Yt),{width:32,textAlign:"center",padding:2})}),Ce("span",{style:{fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:o?r:"#999",fontWeight:o?600:400,fontSize:11,margin:"0 4px"},children:"\xD7"}),Ce("input",{type:"number",min:1,max:12,value:t,onChange:s=>i(parseInt(s.target.value)||1),style:h(f({},Yt),{width:32,textAlign:"center",padding:2})})]})})}function Ml({element:e,getValue:t,getOriginalValue:o,handleChange:r,isModified:n,onResetProperty:i,isCollapsed:s,onToggle:l,sectionHeaderStyle:a,activeDropdown:c,onDropdownChange:d,panelContentRef:u,accentColor:p,onFieldHover:g,preferredUnit:S,onUnitCycle:v}){let b=d,w=t("display"),O=t("flex-direction"),A=Tl(w,O),k=w==="flex"||w==="inline-flex",E=w==="grid",I=k||E,$=t("width"),q=t("height"),j=n("width")?$:lr(e,"width"),T=n("height")?q:lr(e,"height"),D=vi($,j),K=vi(q,T),ee=t("min-width"),me=t("max-width"),ve=t("min-height"),ae=t("max-height"),Re=Eo(t("padding")),We=t("gap"),Me=t("row-gap"),ne=t("column-gap"),Ae=t("grid-template-columns"),G=t("grid-template-rows"),oe=t("overflow"),Ee=Ae.split(/\s+/).filter(J=>J&&J!=="none").length||1,ce=G.split(/\s+/).filter(J=>J&&J!=="none").length||1,[Ke,Te]=El(!1),xe=c!==null,ge=xe||Ke,Ge=xe?.3:Ke?.65:1,xt=({mode:J,icon:Ie,active:Fe})=>Ce("button",{type:"button",onClick:()=>Ll(J,r),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:Fe?Kn(p,.15):"transparent",color:Fe?p:"#64748b",cursor:"pointer",fontSize:14},children:Ie}),dt=(J,Ie,Fe)=>{Fe==="fixed"?r(J,Ie):r(J,xr(Fe,Ie))},Ve=J=>{let Ie=Eo(t("padding")),Fe=J||"0";r("padding",`${Ie.top} ${Fe} ${Ie.bottom} ${Fe}`)},z=J=>{let Ie=Eo(t("padding")),Fe=J||"0";r("padding",`${Fe} ${Ie.right} ${Fe} ${Ie.left}`)},[ie,Q]=El({}),Se=wo((J,Ie)=>Fe=>{Ie(Fe),Q(ft=>h(f({},ft),{[J]:Fe}))},[]),Le=wo(J=>{Q(Ie=>{let Fe=f({},Ie);return delete Fe[J],Fe})},[]),Ze=wo(J=>{let Ie=Eo(t("padding"));_e(e,"padding",`${Ie.top} ${J} ${Ie.bottom} ${J}`)},[e,t]),fe=wo(J=>{let Ie=Eo(t("padding"));_e(e,"padding",`${J} ${Ie.right} ${J} ${Ie.left}`)},[e,t]),lt=wo(J=>Ie=>{_e(e,J,Ie)},[e]),Qe=O==="column"||O==="column-reverse",Tt=J=>J==="center"?1:J==="flex-end"||J==="end"?2:0,Ot=Tt(t("justify-content")),st=Tt(t("align-items")),at=Qe?st:Ot,Dt=Qe?Ot:st,tt=br(null),vt=br({x:0,y:0}),$e=br({col:at,row:Dt});$e.current={col:at,row:Dt};let en=wo((J,Ie)=>{let Fe=["flex-start","center","flex-end"];Qe?(r("justify-content",Fe[Ie]),r("align-items",Fe[J])):(r("justify-content",Fe[J]),r("align-items",Fe[Ie]))},[Qe,r]),Kt=br(en);Kt.current=en,Cd(()=>{let Ie=Fe=>{let ft=tt.current;if(!ft||!Fe.composedPath().includes(ft))return;Fe.preventDefault(),Fe.stopPropagation(),vt.current.x+=Fe.deltaX,vt.current.y+=Fe.deltaY;let{col:Lt,row:pt}=$e.current,bt=!1;Math.abs(vt.current.x)>=30&&(Lt=Math.max(0,Math.min(2,Lt+(vt.current.x>0?1:-1))),vt.current.x=0,vt.current.y=0,bt=!0),!bt&&Math.abs(vt.current.y)>=30&&(pt=Math.max(0,Math.min(2,pt+(vt.current.y>0?1:-1))),vt.current.x=0,vt.current.y=0,bt=!0),bt&&(Lt!==$e.current.col||pt!==$e.current.row)&&Kt.current(Lt,pt)};return document.addEventListener("wheel",Ie,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",Ie,{capture:!0})},[]);let rn=()=>Ce("div",{ref:tt,onMouseEnter:()=>{Te(!0),u.current&&(u.current.style.overflowY="hidden")},onMouseLeave:()=>{Te(!1),u.current&&(u.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:vn,borderRadius:2,display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gridTemplateRows:"repeat(3, 1fr)",padding:6,gap:2,touchAction:"none"},children:[0,1,2].map(J=>[0,1,2].map(Ie=>Ce("button",{type:"button",onClick:()=>en(Ie,J),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:Ie===at&&J===Dt?Ce("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:Ie===0?Nt(xi,{children:[Ce("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),Ce("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),Ce("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):Ie===1?Nt(xi,{children:[Ce("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),Ce("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),Ce("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):Nt(xi,{children:[Ce("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),Ce("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),Ce("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]})}):Ce("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${J}-${Ie}`)))}),mn=n("grid-template-columns")||n("grid-template-rows");return Nt("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Ce("div",{style:a,children:Ce("span",{children:I?"Auto layout":"Layout"})}),Nt("div",{style:{padding:"8px 12px"},children:[Nt("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:vn,borderRadius:2,padding:2,opacity:Ge,transition:"opacity 150ms ease"},children:[Ce(xt,{mode:"block",icon:Ce(Rd,{size:16}),active:A==="block"}),Ce(xt,{mode:"flex-col",icon:Ce(Ad,{size:16}),active:A==="flex-col"}),Ce(xt,{mode:"flex-row",icon:Ce(Ld,{size:16}),active:A==="flex-row"}),Ce(xt,{mode:"grid",icon:Ce(Id,{size:16}),active:A==="grid"})]}),Nt("div",{style:{display:"flex",gap:4,marginBottom:8},children:[Ce(Si,{label:"W",property:"width",cssValue:D==="fixed"?$:`${Math.round(e.getBoundingClientRect().width)}px`,mode:D,onValueChange:J=>r("width",J),onModeChange:J=>{if(J==="fixed"){let Ie=e.getBoundingClientRect();r("width",`${Math.round(Ie.width)}px`)}else r("width",xr(J,$))},modified:n("width"),dimmed:xe&&c!=="width",dropdownOpen:c==="width",onDropdownChange:J=>b(J?"width":null),panelContentRef:u,accentColor:p,onReset:()=>i("width"),minValue:ee!=="none"&&ee!=="0px"&&ee!=="auto"?ee:"",maxValue:me!=="none"&&me!=="auto"?me:"",onMinChange:J=>r("min-width",J||"0"),onMaxChange:J=>r("max-width",J||"none"),onMinReset:()=>i("min-width"),onMaxReset:()=>i("max-width"),minModified:n("min-width"),maxModified:n("max-width")}),Ce(Si,{label:"H",property:"height",cssValue:K==="fixed"?q:`${Math.round(e.getBoundingClientRect().height)}px`,mode:K,onValueChange:J=>r("height",J),onModeChange:J=>{if(J==="fixed"){let Ie=e.getBoundingClientRect();r("height",`${Math.round(Ie.height)}px`)}else r("height",xr(J,q))},modified:n("height"),dimmed:xe&&c!=="height",dropdownOpen:c==="height",onDropdownChange:J=>b(J?"height":null),panelContentRef:u,minValue:ve!=="none"&&ve!=="0px"&&ve!=="auto"?ve:"",maxValue:ae!=="none"&&ae!=="auto"?ae:"",onMinChange:J=>r("min-height",J||"0"),onMaxChange:J=>r("max-height",J||"none"),onMinReset:()=>i("min-height"),onMaxReset:()=>i("max-height"),minModified:n("min-height"),maxModified:n("max-height"),accentColor:p,onReset:()=>i("height")})]}),k&&Nt("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8},children:[Ce("div",{style:{opacity:xe?.3:1,transition:"opacity 150ms ease"},children:rn()}),Nt("div",{style:{flex:1,opacity:Ge,transition:"opacity 150ms ease"},children:[Ce("div",{onClick:n("gap")?()=>i("gap"):void 0,title:n("gap")?"Click to reset":void 0,style:{fontSize:9,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:n("gap")?p:"#999",fontWeight:n("gap")?600:400,marginBottom:2,cursor:n("gap")?"pointer":"default"},children:"Gap"}),Ce(an,{dimmed:xe,children:Nt("div",{style:{display:"flex",alignItems:"center"},children:[Ce(So,{value:We,onChange:J=>{Le("gap"),r("gap",J)},onPreview:Se("gap",lt("gap")),onScrubEnd:()=>Le("gap"),onReset:()=>i("gap"),isModified:n("gap"),accentColor:p,defaultUnit:S,children:O==="column"||O==="column-reverse"?Ce(Cl,{size:12,strokeWidth:n("gap")?2.5:1.5}):Ce(kl,{size:12,strokeWidth:n("gap")?2.5:1.5})}),Ce(xn,{property:"gap",value:ie.gap||We,onChange:J=>r("gap",J),isModified:n("gap")||"gap"in ie,style:h(f({},Yt),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:S,onUnitCycle:v})]})})]})]}),E&&Nt("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:Ge,transition:"opacity 150ms ease"},children:[Ce(Pd,{gridCols:Ee,gridRows:ce,gridModified:mn,accentColor:p,onColsChange:J=>r("grid-template-columns",`repeat(${J}, 1fr)`),onRowsChange:J=>r("grid-template-rows",`repeat(${J}, 1fr)`)}),Nt("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[Ce(an,{dimmed:xe,children:Nt("div",{style:{display:"flex",alignItems:"center"},children:[Ce(So,{value:ne||We,onChange:J=>{Le("column-gap"),r("column-gap",J)},onPreview:Se("column-gap",lt("column-gap")),onScrubEnd:()=>Le("column-gap"),onReset:()=>i("column-gap"),isModified:n("column-gap"),accentColor:p,defaultUnit:S,children:Ce(kl,{size:12,strokeWidth:n("column-gap")?2.5:1.5})}),Ce(xn,{property:"column-gap",value:ie["column-gap"]||ne||We,onChange:J=>r("column-gap",J),isModified:n("column-gap")||"column-gap"in ie,placeholder:"col",style:h(f({},Yt),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:S,onUnitCycle:v})]})}),Ce(an,{dimmed:xe,children:Nt("div",{style:{display:"flex",alignItems:"center"},children:[Ce(So,{value:Me||We,onChange:J=>{Le("row-gap"),r("row-gap",J)},onPreview:Se("row-gap",lt("row-gap")),onScrubEnd:()=>Le("row-gap"),onReset:()=>i("row-gap"),isModified:n("row-gap"),accentColor:p,defaultUnit:S,children:Ce(Cl,{size:12,strokeWidth:n("row-gap")?2.5:1.5})}),Ce(xn,{property:"row-gap",value:ie["row-gap"]||Me||We,onChange:J=>r("row-gap",J),isModified:n("row-gap")||"row-gap"in ie,placeholder:"row",style:h(f({},Yt),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:S,onUnitCycle:v})]})})]})]}),I&&Nt("div",{onMouseEnter:()=>g==null?void 0:g("padding"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:Ge,transition:"opacity 150ms ease"},children:[Ce(an,{style:{flex:1},dimmed:xe,children:Nt("div",{style:{display:"flex",alignItems:"center"},children:[Ce(So,{value:Re.left,onChange:J=>{Le("padding-h"),Ve(J)},onPreview:Se("padding-h",Ze),onScrubEnd:()=>Le("padding-h"),onReset:()=>i("padding"),isModified:n("padding"),accentColor:p,defaultUnit:S,snapSteps:bi,children:Ce(Md,{size:12,strokeWidth:n("padding")?2.5:1.5})}),Ce(xn,{property:"padding",value:ie["padding-h"]||Re.left,onChange:J=>Ve(J),isModified:n("padding")||"padding-h"in ie,placeholder:"H pad",style:h(f({},Yt),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:S,onUnitCycle:v})]})}),Ce(an,{style:{flex:1},dimmed:xe,children:Nt("div",{style:{display:"flex",alignItems:"center"},children:[Ce(So,{value:Re.top,onChange:J=>{Le("padding-v"),z(J)},onPreview:Se("padding-v",fe),onScrubEnd:()=>Le("padding-v"),onReset:()=>i("padding"),isModified:n("padding"),accentColor:p,defaultUnit:S,snapSteps:bi,children:Ce(Td,{size:12,strokeWidth:n("padding")?2.5:1.5})}),Ce(xn,{property:"padding",value:ie["padding-v"]||Re.top,onChange:J=>z(J),isModified:n("padding")||"padding-v"in ie,placeholder:"V pad",style:h(f({},Yt),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:S,onUnitCycle:v})]})})]}),Nt("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:Ge,transition:"opacity 150ms ease"},children:[Ce("input",{type:"checkbox",checked:oe==="hidden",onChange:J=>r("overflow",J.target.checked?"hidden":"visible"),style:{margin:0,accentColor:p}}),"Clip content"]})]})]})}import{AlignCenter as Bd,AlignJustify as Od,AlignLeft as Dd,AlignRight as Hd,Baseline as Fd,ChevronDown as Nd,WholeWord as _d}from"lucide-react";import{jsx as ct,jsxs as An}from"react/jsx-runtime";var Il={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function Rl({element:e,getValue:t,handleChange:o,isModified:r,onResetProperty:n,isCollapsed:i,onToggle:s,sectionHeaderStyle:l,accentColor:a,colorVariables:c,activeColorDropdown:d,onColorDropdownChange:u,panelContentRef:p,preferredUnit:g,onUnitCycle:S}){var K;let v=t("font-family"),b=t("font-size"),w=t("font-weight"),O=t("line-height"),A=t("letter-spacing"),k=t("text-align"),E=t("color"),I=String(w),$=Il[I]||I,q=_o(e,E),j=E.includes("var(")?null:zo(q,c),T=({align:ee,icon:me})=>{let ve=k===ee;return ct("button",{type:"button",onClick:()=>o("text-align",ee),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:ve?Kn(a,.15):"transparent",color:ve?a:"#64748b",cursor:"pointer"},children:me})},D=((K=v.split(",")[0])==null?void 0:K.trim().replace(/^["']|["']$/g,""))||"System";return An("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[ct("div",{style:l,children:ct("span",{children:"Typography"})}),An("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[ct(an,{children:An("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[ct("input",{type:"text",value:v,onChange:ee=>o("font-family",ee.target.value),style:h(f({},Yt),{flex:1,minWidth:0,padding:0,fontWeight:r("font-family")?600:400,color:r("font-family")?a:"inherit"}),title:v}),ct(Nd,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),An("div",{style:{display:"flex",gap:4},children:[ct(an,{style:{flex:1},children:ct("select",{value:I,onChange:ee=>o("font-weight",ee.target.value),style:h(f({},Yt),{padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:r("font-weight")?600:400,color:r("font-weight")?a:"inherit"}),children:Object.entries(Il).map(([ee,me])=>ct("option",{value:ee,children:me},ee))})}),ct(an,{style:{flex:1},children:ct("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:ct(xn,{property:"font-size",value:b,onChange:ee=>o("font-size",ee),isModified:r("font-size"),min:1,max:999,style:h(f({},Yt),{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:S})})})]}),An("div",{style:{display:"flex",gap:4},children:[ct(an,{style:{flex:1},children:An("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[ct(Fd,{size:12,style:{color:r("line-height")?a:"#999",flexShrink:0}}),ct(xn,{property:"line-height",value:O,onChange:ee=>o("line-height",ee),isModified:r("line-height"),step:.1,min:0,placeholder:"Auto",style:h(f({},Yt),{flex:1,minWidth:0,padding:0,fontWeight:r("line-height")?600:400,color:r("line-height")?a:"inherit"}),showUnit:!1})]})}),ct(an,{style:{flex:1},children:An("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[ct(_d,{size:12,style:{color:r("letter-spacing")?a:"#999",flexShrink:0}}),ct(xn,{property:"letter-spacing",value:A,onChange:ee=>o("letter-spacing",ee),isModified:r("letter-spacing"),step:.1,placeholder:"\u2014",style:h(f({},Yt),{flex:1,minWidth:0,padding:0,fontWeight:r("letter-spacing")?600:400,color:r("letter-spacing")?a:"inherit"}),showUnit:!1})]})})]}),An("div",{style:{display:"flex",gap:2,backgroundColor:vn,borderRadius:2,padding:2},children:[ct(T,{align:"left",icon:ct(Dd,{size:14})}),ct(T,{align:"center",icon:ct(Bd,{size:14})}),ct(T,{align:"right",icon:ct(Hd,{size:14})}),ct(T,{align:"justify",icon:ct(Od,{size:14})})]}),An("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[ct("span",{onClick:r("color")?()=>n("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"}),ct("div",{style:{flex:1,minWidth:0},children:ct(wi,{value:E,resolvedValue:q,colorVariables:c,matchingVariable:j,onChange:ee=>o("color",ee),accentColor:a,modified:r("color"),panelContentRef:p,isDropdownOpen:d==="color",onDropdownChange:ee=>u(ee?"color":null)})})]})]})]})}import{Fragment as jd,jsx as pe,jsxs as ht}from"react/jsx-runtime";var Pl=[{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 Yd(e,t){let o=t.trim().toLowerCase();switch(e){case"opacity":return o==="1";case"border-width":return o==="0px"||o==="0"||o==="medium";case"border-radius":return o==="0px"||o==="0";case"border-style":return o==="none";case"box-shadow":return o==="none";case"backdrop-filter":return o==="none"||o==="";case"letter-spacing":return o==="normal"||o==="0px"||o==="0";case"background-color":return o==="rgba(0, 0, 0, 0)"||o==="transparent";default:return!1}}function vi(e,t){return!t||e==="auto"||e==="fit-content"||e==="max-content"||e==="min-content"?"hug":e==="100%"||t==="100%"?"fill":"fixed"}function xr(e,t){switch(e){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let o=Nn(t);if(typeof o.num=="number"&&!isNaN(o.num)){let r=o.unit==="%"?"px":o.unit||"px";return`${o.num}${r}`}return"auto"}}}function Eo(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 Tl(e,t){return e==="grid"?"grid":e==="flex"||e==="inline-flex"?t==="column"||t==="column-reverse"?"flex-col":"flex-row":"block"}function Ll(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 vn="rgba(0, 0, 0, 0.04)",Yt={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 Si({label:e,property:t,cssValue:o,mode:r,onValueChange:n,onModeChange:i,modified:s,dimmed:l,dropdownOpen:a,onDropdownChange:c,panelContentRef:d,accentColor:u="#3b82f6",onReset:p,minValue:g,maxValue:S,onMinChange:v,onMaxChange:b,onMinReset:w,onMaxReset:O,minModified:A,maxModified:k}){let E=Nn(o),I=s?E.unit||vo(t):vo(t),$=!s&&E.unit&&E.unit!==I?hi(E.num,I):E.num,[q,j]=jt(!1),[T,D]=jt(String($)),[K,ee]=jt(!1),me=on(null),ve=on(null),ae=on(null),Re=on(!1);gn(()=>{q||D(String($))},[$,q]),gn(()=>{if(!a)return;let ce=Te=>{ve.current&&!Te.composedPath().includes(ve.current)&&ae.current&&!Te.composedPath().includes(ae.current)&&(c==null||c(!1))},Ke=Te=>{Te.key==="Escape"&&(c==null||c(!1))};return document.addEventListener("mousedown",ce),document.addEventListener("keydown",Ke),()=>{document.removeEventListener("mousedown",ce),document.removeEventListener("keydown",Ke)}},[a,c]),gn(()=>{q&&me.current&&(me.current.focus(),me.current.select())},[q]);let We=()=>{let ce=hr(T,t,o,s);n(ce||`${Math.max(0,parseFloat(T)||0)}${I}`),j(!1)},Me=()=>{if(Re.current){Re.current=!1;return}We()},ne=ce=>{if(ce.key==="Enter"){We();return}if(ce.key==="Escape"){Re.current=!0,D(String($)),j(!1);return}if(ce.key==="ArrowUp"||ce.key==="ArrowDown"){ce.preventDefault();let Ke=ce.key==="ArrowUp"?1:-1,Te=ce.shiftKey?8:ce.altKey?.1:1,xe=parseFloat(T)||0,ge=Math.round(Math.max(0,xe+Ke*Te)*1e3)/1e3;D(String(ge)),n(`${ge}${I}`)}},Ae={fixed:"Fixed",hug:"Hug",fill:"Fill"},G={fixed:pe(Al,{size:12}),hug:pe($d,{size:12}),fill:pe(Al,{size:12})},oe=()=>{c==null||c(!a)},Ee=()=>{if(!ae.current||!(d!=null&&d.current))return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let ce=ae.current.getBoundingClientRect(),Ke=d.current.getBoundingClientRect(),Te=d.current.closest('[data-devtools="panel"]'),xe=Te?Te.getBoundingClientRect():{top:0,left:0};return{position:"fixed",top:ce.bottom+4-xe.top,left:Ke.left+4-xe.left,width:Ke.width-8}};return ht("div",{ref:ae,onMouseEnter:()=>ee(!0),onMouseLeave:()=>ee(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:q?u:K?"rgba(0,0,0,0.15)":"transparent",backgroundColor:vn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:l?.3:1},children:[pe("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"?q?pe("input",{ref:me,type:"text",inputMode:"numeric",value:T,onChange:ce=>D(ce.target.value),onKeyDown:ne,onBlur:Me,style:h(f({},Yt),{flex:1,minWidth:0,padding:"4px 2px"})}):pe("span",{onClick:()=>j(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:$}):pe("span",{style:{flex:1}}),ht("button",{type:"button",onClick:oe,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:[Ae[r],pe(Ei,{size:12})]}),a&&ht("div",{ref:ve,style:h(f({},Ee()),{backgroundColor:"#ffffff",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:[ht("button",{type:"button",onClick:()=>{i("fixed"),c==null||c(!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:[G.fixed,ht("span",{children:["Fixed ",t," (",o,")"]}),r==="fixed"&&pe(vr,{size:14,style:{marginLeft:"auto"}})]}),ht("button",{type:"button",onClick:()=>{i("hug"),c==null||c(!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:[G.hug,pe("span",{children:"Hug contents"}),r==="hug"&&pe(vr,{size:14,style:{marginLeft:"auto"}})]}),ht("button",{type:"button",onClick:()=>{i("fill"),c==null||c(!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:[G.fill,pe("span",{children:"Fill container"}),r==="fill"&&pe(vr,{size:14,style:{marginLeft:"auto"}})]}),pe("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),ht("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[ht("div",{style:{display:"flex",alignItems:"center",backgroundColor:vn,borderRadius:2,padding:"4px 8px"},children:[pe("span",{onClick:A?ce=>{ce.stopPropagation(),w==null||w()}:void 0,title:A?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:A?u:"#999",fontWeight:A?600:400,marginRight:8,flexShrink:0,cursor:A?"pointer":"default"},children:"Min"}),pe("input",{type:"text",value:g||"",placeholder:"\u2014",onChange:ce=>v==null?void 0:v(ce.target.value),onClick:ce=>ce.stopPropagation(),style:h(f({},Yt),{flex:1,minWidth:0,padding:0,textAlign:"right",color:A?u:"inherit",fontWeight:A?600:400})})]}),ht("div",{style:{display:"flex",alignItems:"center",backgroundColor:vn,borderRadius:2,padding:"4px 8px"},children:[pe("span",{onClick:k?ce=>{ce.stopPropagation(),O==null||O()}:void 0,title:k?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:k?u:"#999",fontWeight:k?600:400,marginRight:8,flexShrink:0,cursor:k?"pointer":"default"},children:"Max"}),pe("input",{type:"text",value:S||"",placeholder:"\u2014",onChange:ce=>b==null?void 0:b(ce.target.value),onClick:ce=>ce.stopPropagation(),style:h(f({},Yt),{flex:1,minWidth:0,padding:0,textAlign:"right",color:k?u:"inherit",fontWeight:k?600:400})})]})]})]})]})}function an({children:e,style:t,dimmed:o}){let[r,n]=jt(!1);return pe("div",{onMouseEnter:()=>n(!0),onMouseLeave:()=>n(!1),style:f({position:"relative",borderRadius:2,border:"1px solid",borderColor:r?"rgba(0,0,0,0.15)":"transparent",backgroundColor:vn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:o?.3:1},t),children:e})}function Rn({children:e}){let[t,o]=jt(!1);return pe("div",{onMouseEnter:()=>o(!0),onMouseLeave:()=>o(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:t?"rgba(0,0,0,0.15)":"transparent",backgroundColor:vn,transition:"border-color 100ms ease"},children:e})}function xn({property:e,value:t,onChange:o,isModified:r=!1,step:n=1,min:i,max:s,style:l,placeholder:a,showUnit:c=!0,unitStyle:d,preferredUnit:u,onUnitCycle:p}){let g=Nn(t),S=vo(e),v=mr[e],w=u&&v&&v.includes(u)?u:S,O=r&&g.unit||w,A=!r&&g.unit&&g.unit!==O?hi(g.num,O):g.num,[k,E]=jt(!1),[I,$]=jt(""),q=Me=>{E(!0),$(String(A||"")),requestAnimationFrame(()=>Me.target.select())},j=()=>{if(E(!1),I.trim()){let Me=hr(I,e,t,r);Me&&o(Me)}},T=Me=>{let ne=Me.target.value;$(ne);let Ae=ne.trim(),G=Ae.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),oe=Ae.match(/^(-?[\d.]+)$/);if(G){let Ee=parseFloat(G[1]);isNaN(Ee)||o(`${Ee}${G[2].toLowerCase()}`)}else if(oe){let Ee=parseFloat(oe[1]);isNaN(Ee)||o(`${Ee}${O}`)}},D=Me=>{if(Me.key==="Enter"){if(I.trim()){let ne=hr(I,e,t,r);ne&&o(ne)}Me.target.blur();return}if(Me.key==="ArrowUp"||Me.key==="ArrowDown"){Me.preventDefault();let ne=Me.shiftKey?10:Me.altKey?.1:1,Ae=(Me.key==="ArrowUp"?1:-1)*n*ne,G=parseFloat(I)||A||0,oe=Math.round((G+Ae)*1e3)/1e3;i!==void 0&&(oe=Math.max(i,oe)),s!==void 0&&(oe=Math.min(s,oe)),$(String(oe)),o(`${oe}${O}`)}},K=/^-?[\d.]/.test(t.trim()),ee=k?I:K?String(A):"",ve=k&&/\s*(rem|em|px|%)\s*$/i.test(I)?"":O,ae=p&&(ve==="rem"||ve==="px"),Re={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},We=h(f({},d!=null?d:Re),{pointerEvents:"auto",cursor:"pointer"});return ht(jd,{children:[pe("input",{type:"text",inputMode:"decimal",value:ee,onFocus:q,onBlur:j,onChange:T,onKeyDown:D,placeholder:a,style:l}),c&&ve&&pe("span",{style:ae?We:d!=null?d:Re,onClick:ae?p:void 0,title:ae?"Click to switch units":void 0,children:ve})]})}function wi({value:e,resolvedValue:t,colorVariables:o,matchingVariable:r,onChange:n,accentColor:i="#3b82f6",modified:s,panelContentRef:l,isDropdownOpen:a,onDropdownChange:c}){let[d,u]=jt(!1),p=!e.includes("var(")&&r?r.usage:e,[g,S]=jt(p),[v,b]=jt(!1),[w,O]=jt(!1),[A,k]=jt(!1),E=on(null),I=on(null),$=on(null),q=a!==void 0?a:v,j=c||b,T=Mn(()=>{if(!$.current)return{position:"fixed",top:0,left:0,width:200};let ne=$.current.getBoundingClientRect(),Ae=$.current.closest('[data-devtools="panel"]'),G=Ae?Ae.getBoundingClientRect():{top:0,left:0};if(l!=null&&l.current){let oe=l.current.getBoundingClientRect();return{position:"fixed",top:ne.bottom+4-G.top,left:oe.left+4-G.left,width:oe.width-8}}return{position:"fixed",top:ne.bottom+4-G.top,left:ne.left-G.left,width:ne.width}},[l]);gn(()=>{if(!d){let ne=!e.includes("var(")&&r?r.usage:e;S(ne)}},[e,d,r]),gn(()=>{if(!q&&!w)return;let ne=G=>{$.current&&!G.composedPath().includes($.current)&&(j(!1),O(!1))},Ae=G=>{G.key==="Escape"&&(j(!1),O(!1))};return document.addEventListener("mousedown",ne),document.addEventListener("keydown",Ae),()=>{document.removeEventListener("mousedown",ne),document.removeEventListener("keydown",Ae)}},[q,w]),gn(()=>{d&&E.current&&(E.current.focus(),E.current.select())},[d]);let D=Sr(()=>{if(!g||g.startsWith("#")||g.startsWith("rgb")||g.startsWith("hsl")||g.startsWith("oklch"))return[];let ne=g.toLowerCase();return o.filter(Ae=>Ae.name.toLowerCase().includes(ne)||Ae.usage.toLowerCase().includes(ne)).slice(0,8)},[g,o]),K=()=>{n(g),u(!1),O(!1)},ee=ne=>{S(ne),ne.includes("var")||ne.includes("--")||ne.length>0&&!ne.startsWith("#")?O(!0):O(!1)},me=ne=>{S(ne.usage),n(ne.usage),j(!1),O(!1),u(!1)},ve=()=>{setTimeout(()=>{!q&&!w&&K()},150)},ae=ne=>{ne.key==="Enter"?K():ne.key==="Escape"&&(S(e),u(!1),O(!1))},Re=Sr(()=>{let ne=t.trim().toLowerCase();if(ne.startsWith("#"))return ne.length===4?`#${ne[1]}${ne[1]}${ne[2]}${ne[2]}${ne[3]}${ne[3]}`:ne.slice(0,7);let Ae=ne.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(Ae){let oe=parseInt(Ae[1],10).toString(16).padStart(2,"0"),Ee=parseInt(Ae[2],10).toString(16).padStart(2,"0"),ce=parseInt(Ae[3],10).toString(16).padStart(2,"0");return`#${oe}${Ee}${ce}`}let G=ne.match(/oklch\(\s*([\d.]+)/);if(G){let oe=Math.max(0,Math.min(1,parseFloat(G[1]))),Ee=Math.round(oe*255).toString(16).padStart(2,"0");return`#${Ee}${Ee}${Ee}`}return"#000000"},[t]),We=ne=>{let Ae=ne.target.value;S(Ae),n(Ae)},Me=e.includes("var(");return ht("div",{ref:$,onMouseEnter:()=>k(!0),onMouseLeave:()=>k(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:d?i:A?"rgba(0,0,0,0.15)":"transparent",backgroundColor:vn,transition:"border-color 100ms ease",overflow:"hidden"},children:[ht("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[ht("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[pe("input",{type:"color",value:Re,onChange:We,style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),pe("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:t,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),d?pe("input",{ref:E,type:"text",value:g,onChange:ne=>ee(ne.target.value),onKeyDown:ae,onBlur:ve,style:h(f({},Yt),{flex:1,minWidth:0})}):pe("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}),o.length>0&&pe("button",{type:"button",onClick:()=>j(!q),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:pe(Ei,{size:12})})]}),w&&D.length>0&&pe("div",{style:h(f({},T()),{backgroundColor:"#ffffff",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:D.map(ne=>ht("button",{type:"button",onClick:()=>me(ne),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:[pe("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:ne.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),pe("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:ne.name})]},ne.name))}),q&&pe("div",{ref:I,style:h(f({},T()),{backgroundColor:"#ffffff",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:o.map(ne=>ht("button",{type:"button",onClick:()=>me(ne),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:p===ne.usage||e===ne.usage?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:p===ne.usage||e===ne.usage?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[pe("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:ne.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),pe("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:ne.name}),(p===ne.usage||e===ne.usage)&&pe(vr,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},ne.name))})]})}function Bl({element:e,elementInfo:t,selector:o,styleModifications:r,dispatch:n,onClose:i,onHover:s,accentColor:l="#3b82f6",toolbarRef:a}){var dt,Ve;let c=on(null),d=on(null),[u,p]=jt(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch(z){return!1}});gn(()=>{if(u)return;let z=setTimeout(()=>p(!0),50);return()=>clearTimeout(z)},[u]);let[g,S]=jt(null),[v,b]=jt(null),w=g!==null||v!==null,[O,A]=jt("rem"),k=Mn(()=>{A(z=>z==="rem"?"px":"rem")},[]),E=on(new Map),[I,$]=jt(""),q=Sr(()=>ni(),[]);gn(()=>{let z=ie=>{var Se;if(ie.key!=="Escape")return;let Q=document.activeElement;Q&&((Se=c.current)!=null&&Se.contains(Q))||i()};return window.addEventListener("keydown",z),()=>window.removeEventListener("keydown",z)},[i]);let j=on({top:0,left:0,maxHeight:400}),[,T]=jt(0),D="devtools-panel-position",K=on({x:0,y:0}),ee=on(null),me=on(!1);gn(()=>{try{let z=localStorage.getItem(D);if(z){let ie=JSON.parse(z);typeof ie.top=="number"&&typeof ie.left=="number"&&(me.current=!0,j.current=h(f({},j.current),{top:ie.top,left:ie.left}))}}catch(z){}},[]),gn(()=>{let z=Q=>{var $e;let Se=ee.current;if(!Se)return;let Le=Se.startOffsetX+(Q.clientX-Se.startX),Ze=Se.startOffsetY+(Q.clientY-Se.startY),fe=280,lt=16,Qe=Math.max(lt,Math.min(window.innerWidth-fe-lt,j.current.left+Le)),Tt=Math.max(lt,j.current.top+Ze);K.current={x:Qe-j.current.left,y:Tt-j.current.top};let Ot=c.current,st=Ot==null?void 0:Ot.parentElement;if(!st)return;st.style.top=`${Tt}px`,st.style.left=`${Qe}px`;let at=($e=a==null?void 0:a.current)==null?void 0:$e.getBoundingClientRect(),Dt=window.innerHeight-16;at&&Qe+fe>at.left&&(Dt=at.top-8);let tt=Math.max(0,Tt),vt=Math.max(200,Dt-tt);Ot&&(Ot.style.maxHeight=`${vt}px`)},ie=()=>{if(!ee.current)return;let Q=j.current.top+K.current.y,Se=j.current.left+K.current.x;j.current=h(f({},j.current),{top:Q,left:Se}),K.current={x:0,y:0},me.current=!0;try{localStorage.setItem(D,JSON.stringify({top:Q,left:Se}))}catch(Le){}ee.current=null};return window.addEventListener("mousemove",z),window.addEventListener("mouseup",ie),()=>{window.removeEventListener("mousemove",z),window.removeEventListener("mouseup",ie)}},[]);let ve=Mn(z=>{z.button!==0||z.target.closest("button")||(z.preventDefault(),ee.current={startX:z.clientX,startY:z.clientY,startOffsetX:K.current.x,startOffsetY:K.current.y})},[]);gn(()=>{K.current={x:0,y:0};let z=(Se=!1)=>{var Dt;let Le=c.current,Ze=280,fe=8,lt,Qe;if(me.current)lt=j.current.top,Qe=j.current.left;else{let tt=e.getBoundingClientRect();Qe=tt.right+fe,lt=tt.top,Qe+Ze>window.innerWidth-fe&&(Qe=tt.left-Ze-fe),Qe<fe&&(Qe=Math.max(fe,(window.innerWidth-Ze)/2))}let Tt=(Dt=a==null?void 0:a.current)==null?void 0:Dt.getBoundingClientRect(),Ot=window.innerHeight-16;Tt&&Qe+Ze>Tt.left&&(Ot=Tt.top-fe);let st=Math.max(0,lt),at=Math.max(200,Ot-st);if(j.current={top:lt,left:Qe,maxHeight:at},Se&&Le){let tt=Le.parentElement;tt&&!me.current&&(tt.style.top=`${lt+K.current.y}px`,tt.style.left=`${Qe+K.current.x}px`),Le.style.maxHeight=`${at}px`}else T(tt=>tt+1)};z(!1);let ie=()=>z(!0),Q=()=>z(!1);return window.addEventListener("scroll",ie,{passive:!0}),window.addEventListener("resize",Q,{passive:!0}),()=>{window.removeEventListener("scroll",ie),window.removeEventListener("resize",Q)}},[e]),gn(()=>{let z=c.current;if(!z)return;let ie=Q=>{let Se=d.current;if(!Se){Q.preventDefault();return}let{scrollTop:Le,scrollHeight:Ze,clientHeight:fe}=Se,lt=Le<=0&&Q.deltaY<0,Qe=Le+fe>=Ze&&Q.deltaY>0;(lt||Qe)&&Q.preventDefault()};return z.addEventListener("wheel",ie,{passive:!1}),()=>z.removeEventListener("wheel",ie)},[]);let ae=Sr(()=>r.find(z=>z.selector===o),[r,o]),Re=Mn(z=>{let ie=ae==null?void 0:ae.changes.find(Q=>Q.property===z);if(ie)return ie.modified;if(z.includes("color")){let Q=Zr(e,z);if(Q&&Q.includes("var("))return Q}return Ho(e,z)},[e,ae]),We=Mn(z=>{if(E.current.has(z))return E.current.get(z);let ie=ae==null?void 0:ae.changes.find(Se=>Se.property===z);if(ie)return ie.original;let Q=Ho(e,z);return E.current.set(z,Q),Q},[e,ae]),Me=Mn((z,ie)=>{let Q=We(z);_e(e,z,ie),z==="backdrop-filter"&&_e(e,"-webkit-backdrop-filter",ie),n({type:"MODIFY_STYLE",payload:{selector:o,element:t,property:z,original:Q,modified:ie}})},[e,o,t,n,We]),ne=Mn(()=>{ti(o,r);let z=r.find(ie=>ie.selector===o);if(z)for(let ie of z.changes)n({type:"CLEAR_STYLE",payload:{selector:o,property:ie.property}});E.current.clear()},[o,r,n]),Ae=Mn(z=>{let ie=r.find(Se=>Se.selector===o);ie!=null&&ie.changes.find(Se=>Se.property===z)&&e instanceof HTMLElement&&(e.style.removeProperty(z),n({type:"CLEAR_STYLE",payload:{selector:o,property:z}}),E.current.delete(z))},[e,o,r,n]),G=Mn(()=>{let z=I.split(";").map(ie=>ie.trim()).filter(ie=>ie);for(let ie of z){let Q=ie.indexOf(":");if(Q>0){let Se=ie.slice(0,Q).trim(),Le=ie.slice(Q+1).trim();Se&&Le&&Me(Se,Le)}}$("")},[I,Me]),oe=Mn(z=>{var ie;return(ie=ae==null?void 0:ae.changes.some(Q=>Q.property===z))!=null?ie:!1},[ae]),Ee=z=>{var Ze;let ie=Re(z.property),Q=oe(z.property),Se=!Q&&Yd(z.property,ie),Le={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&&z.type!=="backdrop-filter")return pe(Rn,{modified:!1,children:pe("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:fe=>Me(z.property,fe.target.value),style:h(f({},Le),{color:"#999"})})});switch(z.type){case"color":{let fe=_o(e,ie),lt=ie.includes("var(")?null:zo(fe,q);return pe(wi,{value:ie,resolvedValue:fe,colorVariables:q,matchingVariable:lt,onChange:Qe=>Me(z.property,Qe),accentColor:l,modified:Q,panelContentRef:d,isDropdownOpen:v===z.property,onDropdownChange:Qe=>b(Qe?z.property:null)})}case"number":{if(!!mr[z.property])return pe(Rn,{modified:Q,children:pe(xn,{property:z.property,value:ie,onChange:Qe=>Me(z.property,Qe),isModified:Q,min:z.min,max:z.max,step:z.step||1,style:h(f({},Le),{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:O,onUnitCycle:k})});let{num:lt}=Nn(ie);return pe(Rn,{modified:Q,children:pe("input",{type:"number",value:lt,min:z.min,max:z.max,step:z.step||1,onChange:Qe=>Me(z.property,Qe.target.value),style:Le})})}case"select":return pe(Rn,{modified:Q,children:ht("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[pe("select",{value:ie,onChange:fe=>Me(z.property,fe.target.value),style:h(f({},Le),{cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"}),children:(Ze=z.options)==null?void 0:Ze.map(fe=>pe("option",{value:fe,children:fe},fe))}),pe("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:pe(Ei,{size:12})})]})});case"spacing":return pe(Rn,{modified:Q,children:pe("input",{type:"text",value:ie,onChange:fe=>Me(z.property,fe.target.value),placeholder:"e.g., 10px or 10px 20px",style:Le})});case"backdrop-filter":return pe(wl,{value:ie,onChange:fe=>Me(z.property,fe),accentColor:l,modified:Q,panelContentRef:d});default:return pe(Rn,{modified:Q,children:pe("input",{type:"text",value:ie,onChange:fe=>Me(z.property,fe.target.value),style:Le})})}},ce=(dt=ae==null?void 0:ae.changes.length)!=null?dt:0,Ke=(Ve=ae==null?void 0:ae.captured)!=null?Ve:!1,Te=h(f({position:"fixed",top:j.current.top,left:j.current.left,width:280,maxHeight:j.current.maxHeight,backgroundColor:"rgba(255, 255, 255, 0.85)",backdropFilter:"blur(32px)",WebkitBackdropFilter:"blur(32px)"},bn),{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"}),xe={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:ee.current?"grabbing":"grab"},ge={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"},Ge={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},xt={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return pe("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:j.current.top+K.current.y,left:j.current.left+K.current.x,zIndex:1e4,pointerEvents:"none"},children:ht("div",{ref:c,"data-devtools":"panel",style:h(f({},Te),{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:[ht("div",{style:xe,onMouseDown:ve,children:[ht("div",{style:{display:"flex",alignItems:"center",gap:8,overflow:"hidden"},children:[pe("span",{style:{fontWeight:600,fontSize:11,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:t.tagName}),ce>0&&pe("span",{style:{backgroundColor:Ke?"#999999":l,color:"#fff",fontSize:9,padding:"1px 4px",borderRadius:2},children:ce})]}),ht("div",{style:{display:"flex",gap:4},children:[ce>0&&pe("button",{type:"button",onClick:ne,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:pe(zd,{size:14})}),pe("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:pe(Wd,{size:14})})]})]}),ht("div",{ref:d,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[pe("div",{style:{opacity:v?.3:1,transition:"opacity 150ms ease"},children:pe(Ml,{element:e,getValue:Re,getOriginalValue:We,handleChange:Me,isModified:oe,onResetProperty:Ae,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:ge,activeDropdown:g,onDropdownChange:S,panelContentRef:d,accentColor:l,onFieldHover:s,preferredUnit:O,onUnitCycle:k})}),pe("div",{style:{opacity:g?.3:1,transition:"opacity 150ms ease"},children:pe(Rl,{element:e,getValue:Re,handleChange:Me,isModified:oe,onResetProperty:Ae,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:ge,accentColor:l,colorVariables:q,activeColorDropdown:v,onColorDropdownChange:b,panelContentRef:d,preferredUnit:O,onUnitCycle:k})}),Pl.map((z,ie)=>{let Q=ie===Pl.length-1,Se=v&&z.properties.some(Ze=>Ze.property===v);return ht("div",{style:{borderBottom:Q?"none":"1px solid rgba(0,0,0,0.08)",opacity:w&&!Se?.3:1,transition:"opacity 150ms ease"},children:[pe("div",{style:ge,children:pe("span",{children:z.name})}),pe("div",{style:{padding:"4px 0"},children:z.properties.map(Ze=>{let fe=oe(Ze.property),lt=Se&&Ze.property!==v;return ht("div",{style:h(f({},Ge),{opacity:lt?.3:1,transition:"opacity 150ms ease"}),children:[pe("span",{onClick:fe?()=>Ae(Ze.property):void 0,title:fe?"Click to reset":void 0,style:h(f({},xt),{color:fe?l:"#64748b",fontWeight:fe?600:400,cursor:fe?"pointer":"default"}),children:Ze.label}),pe("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:Ee(Ze)})]},Ze.property)})})]},z.name)}),ht("div",{style:{opacity:w?.3:1,transition:"opacity 150ms ease"},children:[pe("div",{style:ge,children:pe("span",{children:"Raw CSS"})}),ht("div",{style:{padding:"8px 12px"},children:[pe("textarea",{value:I,onChange:z=>$(z.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"}}),I.trim()&&pe("button",{type:"button",onClick:G,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:l,color:"#fff",cursor:"pointer",opacity:I.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as Gd,useLayoutEffect as Vd,useState as Ud}from"react";import{Fragment as Zd,jsx as Qn,jsxs as Kd}from"react/jsx-runtime";var ki=["flex-start","center","flex-end"],Ci=["flex-start","center","flex-end"];function Jd(e){return e==="normal"||e==="flex-start"||e==="start"?"flex-start":e==="flex-end"||e==="end"?"flex-end":e==="center"?"center":null}function Xd(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 Ol(e){let t=Array.from(e.children);if(t.length===0)return null;let o=1/0,r=1/0,n=-1/0,i=-1/0;for(let s of t){let l=s.getBoundingClientRect();l.width===0&&l.height===0||(l.top<o&&(o=l.top),l.left<r&&(r=l.left),l.bottom>n&&(n=l.bottom),l.right>i&&(i=l.right))}return o===1/0?null:new DOMRect(r,o,i-r,n-o)}function Dl({element:e,modifier:t,accentColor:o,refreshKey:r=0}){let[n,i]=Ud(null);if(Gd(()=>{if(!e){i(null);return}let v=()=>i(Ol(e));return v(),window.addEventListener("scroll",v,{passive:!0}),window.addEventListener("resize",v,{passive:!0}),()=>{window.removeEventListener("scroll",v),window.removeEventListener("resize",v)}},[e]),Vd(()=>{e&&i(Ol(e))},[e,r]),!n)return null;let s=n,l=window.getComputedStyle(e),a=l.display;if(a!=="flex"&&a!=="inline-flex")return null;let c=l.flexDirection,d=c==="column"||c==="column-reverse"?"vertical":"horizontal",u=d==="horizontal"?"vertical":"horizontal",p=[];if(t==="shift"){let v=Jd(l.justifyContent);if(v){let b=ki.indexOf(v);d==="horizontal"?(b>0&&p.push("left"),b<ki.length-1&&p.push("right")):(b>0&&p.push("up"),b<ki.length-1&&p.push("down"))}}else{let v=Xd(l.alignItems);if(v){let b=Ci.indexOf(v);u==="horizontal"?(b>0&&p.push("left"),b<Ci.length-1&&p.push("right")):(b>0&&p.push("up"),b<Ci.length-1&&p.push("down"))}}if(p.length===0)return null;let g=14,S=7;return Qn(Zd,{children:p.map(v=>{let b,w;switch(v){case"right":b=s.right+g,w=s.top+s.height/2;break;case"left":b=s.left-g,w=s.top+s.height/2;break;case"down":b=s.left+s.width/2,w=s.bottom+g;break;case"up":b=s.left+s.width/2,w=s.top-g;break}let O=v==="right"?0:v==="left"?180:v==="down"?90:-90,A={position:"fixed",left:b-S,top:w-S,width:S*2,height:S*2,pointerEvents:"none",zIndex:9997};return Qn("div",{"data-devtools":"swipe-hint",style:A,children:Qn("svg",{width:S*2,height:S*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:Kd("g",{transform:`rotate(${O})`,children:[Qn("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),Qn("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),Qn("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:o,strokeWidth:"1.5",strokeLinecap:"round"}),Qn("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:o,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},v)})})}import{useEffect as qd,useLayoutEffect as Qd,useState as eu}from"react";import{jsx as Mi,jsxs as Ti}from"react/jsx-runtime";function tu(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function Hl({element:e,fontSize:t,lineHeight:o,accentColor:r,hoveredProperty:n,draggingProperty:i,cursorViewport:s}){let[l,a]=eu(null);if(qd(()=>{if(!e){a(null);return}let w=()=>{a(mo(e))};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[e]),Qd(()=>{e&&a(mo(e))},[e,t,o]),!l)return null;let c=l.width,d=l.height,u=tu(r,.2),p=i!=null?i:n,g=8,S=2,v={position:"fixed",top:l.top,left:l.left,width:c,height:d,pointerEvents:"none",zIndex:9996,overflow:"visible"},b=w=>w==="font-size"?`${Math.round(t)}`:(t>0?o/t:1.2).toFixed(2).replace(/\.?0+$/,"");return Ti("div",{"data-devtools":"text-handles",style:v,children:[Ti("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${d}`,children:[Mi("rect",{x:"0.5",y:"0.5",width:Math.max(0,c-1),height:Math.max(0,d-1),fill:"none",stroke:u,strokeWidth:"1"}),(p==="font-size"||!p)&&Mi("rect",{x:c-S/2,y:d/2-g/2,width:S,height:g,fill:r,stroke:"#ffffff",strokeWidth:p==="font-size"?4:2,paintOrder:"stroke"}),(p==="line-height"||!p)&&Mi("rect",{x:c/2-g/2,y:d-S/2,width:g,height:S,fill:r,stroke:"#ffffff",strokeWidth:p==="line-height"?4:2,paintOrder:"stroke"})]}),s&&p&&(()=>{let w=p==="font-size"?"Aa":"Lh",O=b(p);return Ti("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:[w," ",O]})})()]})}import{Fragment as Co,jsx as ot,jsxs as ko}from"react/jsx-runtime";var Fl=8,Ii=[0,1,2,4,8,12,16,20,24,28,32],Ri="devtools-active-text";function Nl(e,t,o=0){let r=e.left+window.scrollX+4,n=t==="top-left"?e.top+window.scrollY-Xn-o*Xn+4:e.bottom+window.scrollY+4-1+o*Xn,i=window.scrollY+4,s=window.scrollY+window.innerHeight-Xn-4;return n<i?n=e.top+window.scrollY+4:n>s&&(n=Math.max(e.top+window.scrollY+4,s)),{x:r,y:n}}function _l({state:e,dispatch:t,onScreenshot:o,inFlightAnnotationIds:r,inFlightStyleSelectors:n,inFlightSelectorColors:i,onAttachImages:s,onReply:l,onViewThread:a,onCloseThread:c,onModelComponentsAdd:d,onModelComponentFocus:u,onModelComponentHover:p,modelComponentNames:g,modelPanelHoveredComponent:S,modelSpacingTokenHover:v,highlightedAnnotationIds:b,externalCanvasRef:w,toolbarRef:O}){var ss,ls,as,cs,ds,us,ps,fs,gs;let{canvasRef:A,redrawAll:k,resizeCanvas:E}=$s(),I=Pt(y=>{A.current=y,w&&(w.current=y)},[w,A]),$=Ct(!1);Vt(()=>{let y=A.current;if(!y)return;let x=()=>{$.current&&($.current=!1,y.style.pointerEvents="")},X=M=>{M.button===0&&$.current&&x()};return window.addEventListener("mousedown",X),()=>window.removeEventListener("mousedown",X)},[A]);let[q,j]=it(!1),[T,D]=it(()=>{if(typeof window=="undefined")return null;try{let y=localStorage.getItem(Ri);return y?JSON.parse(y):null}catch(y){return null}}),[K,ee]=it(null),[me,ve]=it(null),[ae,Re]=it(null),We=Ct(null),Me=Ct(null),ne=Ct({x:0,y:0}),Ae=Ct([]),G=Ct(0),[oe,Ee]=it(null),[ce,Ke]=it(new Map),Te=Ct(0),xe=Ct(null),[ge,Ge]=it(null),[xt,dt]=it(null),Ve=Ct({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}),[z,ie]=it(null),[Q,Se]=it(null),[Le,Ze]=it(null),[fe,lt]=it(null),Qe=Ct({x:0,y:0}),[Tt,Ot]=it({x:0,y:0}),st=Ct({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}),[at,Dt]=it(null),[tt,vt]=it(null),[$e,en]=it(null),[Kt,rn]=it(!1),[mn,En]=it(0),[J,Ie]=it(null),Fe=Ct({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}),[ft,Lt]=it(null),[pt,bt]=it(null),[St,dn]=it(null),$t=Ct({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[kt,hn]=it(null),[W,te]=it(null),[U,Pe]=it(null),Be=Ws(),he=Ct(i);he.current=i;let It=Pt(y=>{let x=he.current;if(!x||x.size===0)return!1;for(let X of x.keys())try{if(y.matches(X))return!0}catch(M){}return!1},[]),R=Ct(e);R.current=e;let Z=Ct(T);Z.current=T;let de=Ct([]),Oe=Ct(o);Oe.current=o;let[ye,ke]=it(null),Ne=e.selectedAnnotationIds;de.current=Ne;let gt=Pt((y,x=!1)=>{t({type:"SELECT_ANNOTATION",payload:{id:y,addToSelection:x}})},[t]),Ue=Pt(()=>{t({type:"SELECT_ANNOTATION",payload:{id:null}})},[t]),[et,Ht]=it(null),[wt,Tr]=it({x:window.scrollX,y:window.scrollY});Vt(()=>(E(),window.addEventListener("resize",E),()=>window.removeEventListener("resize",E)),[E]),Vt(()=>{let y=()=>{Tr({x:window.scrollX,y:window.scrollY})};return window.addEventListener("scroll",y,{passive:!0}),()=>window.removeEventListener("scroll",y)},[]),Vt(()=>{T?localStorage.setItem(Ri,JSON.stringify(T)):localStorage.removeItem(Ri)},[T]),Ys(T,D,K,e.annotations,t);let zn=Ct(oe);zn.current=oe,Vt(()=>{if(e.activeTool!=="model"||!e.isAnnotating)return;let y=x=>{if(!x.altKey||!zn.current)return;x.preventDefault();let X=x.deltaY>0?-1:1;Te.current=Math.max(0,Te.current+X);let M=xe.current;if(M){let B=ir(M,Te.current);Ee(B)}};return window.addEventListener("wheel",y,{passive:!1}),()=>window.removeEventListener("wheel",y)},[e.activeTool,e.isAnnotating]),Vt(()=>{e.activeTool!=="model"&&(Ee(null),Ke(new Map),Te.current=0,xe.current=null)},[e.activeTool]),Vt(()=>{var X;let y=(X=oe==null?void 0:oe.name)!=null?X:null,x=y&&(g!=null&&g.has(y))?y:null;p==null||p(x)},[oe,g,p]);let[Bo,Uo]=it(null);Vt(()=>{var X;if(!S){Uo(null);return}let y=po(S.name),x=S.instanceIndex;Uo((X=y[x%y.length])!=null?X:null)},[S]);let[un,Lr]=it([]);Vt(()=>{var y,x;if(!v){Lr([]);return}(x=(y=v.token)==null?void 0:y.bindings)!=null&&x.length?Lr(Xr(v.token)):Lr(Ur(v.px))},[v]);let ua=Ct(null),pa=Ct(null);ua.current=at,pa.current=tt,Vt(()=>{let y=["flex-start","center","flex-end"],x=["flex-start","center","flex-end"],M=null,B=!1,H=null,se=null,F=(ue,we)=>{let je=Gn(ue,we);for(;je&&je!==document.documentElement;){let rt=window.getComputedStyle(je).display;if(rt==="flex"||rt==="inline-flex")return je;je=je.parentElement}return null},V=ue=>{let we=window.getComputedStyle(ue).flexDirection;return we==="column"||we==="column-reverse"?"vertical":"horizontal"},m=ue=>{let we=ue.getAttribute("data-pm");return we||(we=Math.random().toString(36).substring(2,8),ue.setAttribute("data-pm",we)),{selector:`[data-pm="${we}"]`,durableSelector:sn(ue)}},C=()=>{B=!0,M&&clearTimeout(M),M=setTimeout(()=>{B=!1,M=null},300)},Y=(ue,we,Je)=>{let je=V(ue);if(we===je){let De=window.getComputedStyle(ue).justifyContent,mt=De==="normal"||De==="flex-start"||De==="start"?"flex-start":De==="flex-end"||De==="end"?"flex-end":De==="center"?"center":null;if(!mt)return;let Ft=y.indexOf(mt)+Je;if(Ft<0||Ft>=y.length)return;let Ln=y[Ft],{selector:Wn,durableSelector:Rr}=m(ue);_e(ue,"justify-content",Ln),t({type:"MODIFY_STYLES_BATCH",payload:{selector:Wn,durableSelector:Rr,element:qt(ue),changes:[{property:"justify-content",original:De,modified:Ln}]}})}else{let De=window.getComputedStyle(ue).flexDirection,mt=je==="horizontal"?"column":"row",{selector:yn,durableSelector:Ft}=m(ue);_e(ue,"flex-direction",mt),t({type:"MODIFY_STYLES_BATCH",payload:{selector:yn,durableSelector:Ft,element:qt(ue),changes:[{property:"flex-direction",original:De,modified:mt}]}})}En(rt=>rt+1)},L=(ue,we,Je)=>{let rt=V(ue)==="horizontal"?"vertical":"horizontal";if(we!==rt)return;let mt=window.getComputedStyle(ue).alignItems,yn=mt==="normal"||mt==="stretch"||mt==="flex-start"||mt==="start"?"flex-start":mt==="flex-end"||mt==="end"?"flex-end":mt==="center"?"center":null;if(!yn)return;let Ln=x.indexOf(yn)+Je;if(Ln<0||Ln>=x.length)return;let Wn=x[Ln],{selector:Rr,durableSelector:wa}=m(ue);_e(ue,"align-items",Wn),t({type:"MODIFY_STYLES_BATCH",payload:{selector:Rr,durableSelector:wa,element:qt(ue),changes:[{property:"align-items",original:mt,modified:Wn}]}}),En(Ea=>Ea+1)},P=20,N=null,_=null,le=0,be=(ue,we,Je)=>{let je=F(we,Je);Ie(je?{modifier:ue,target:je}:null)},nt=ue=>{if(!(e.activeTool!=="hand"||!e.isAnnotating)){if(ue.key==="Shift"&&!ue.altKey){let we=Qe.current;be("shift",we.x,we.y)}else if(ue.key==="Alt"&&!ue.shiftKey){let we=Qe.current;be("alt",we.x,we.y)}}},Ye=ue=>{if(e.activeTool!=="hand"||!e.isAnnotating)return;let we=ue.shiftKey&&!ue.altKey,Je=ue.altKey&&!ue.shiftKey;if(!we&&!Je||ue.buttons!==0){N=null,_=null,le=0,H=null,se=null,Ie(null);return}if(H===null&&(H=ue.clientX,se=ue.clientY,be(we?"shift":"alt",ue.clientX,ue.clientY)),B)return;N===null&&(N=ue.clientX,_=ue.clientY,le=0);let je=ue.clientX-N,rt=ue.clientY-_,De=Math.abs(je)>=Math.abs(rt)?je:rt;if(Math.abs(De)>3){let Wn=De>0?1:-1;if(le!==0&&Wn!==le){N=ue.clientX,_=ue.clientY,le=0;return}le=Wn}if(Math.abs(je)<P&&Math.abs(rt)<P)return;let mt=F(H,se);if(!mt)return;let yn=Math.abs(je)>=Math.abs(rt)?"horizontal":"vertical",Ln=(yn==="horizontal"?je:rt)>0?1:-1;N=null,_=null,le=0,we?Y(mt,yn,Ln):L(mt,yn,Ln),C()},Rt=ue=>{(ue.key==="Shift"||ue.key==="Alt")&&(H=null,se=null,N=null,_=null,le=0,Ie(null))},ut=()=>{Ie(null),N=null,_=null,le=0};return window.addEventListener("keydown",nt),window.addEventListener("mousemove",Ye),window.addEventListener("mousedown",ut),window.addEventListener("keyup",Rt),()=>{window.removeEventListener("keydown",nt),window.removeEventListener("mousemove",Ye),window.removeEventListener("mousedown",ut),window.removeEventListener("keyup",Rt),M&&clearTimeout(M)}},[e.activeTool,e.isAnnotating,t]),Vt(()=>{let y=x=>{var H,se,F,V;if(x.key==="Escape"){if(Z.current)return;if(e.activeTool==="model"&&ce.size>0){x.preventDefault(),Ke(new Map);return}if(de.current.length>0){x.preventDefault(),Ue();return}}if(x.key==="Enter"&&e.activeTool==="model"&&ce.size>0&&d){x.preventDefault();let m=[...ce.keys()].filter(C=>!(g!=null&&g.has(C)));m.length>0&&d(m),Ke(new Map);return}if((x.metaKey||x.ctrlKey)&&x.key==="v"&&Ae.current.length>0&&!Z.current){x.preventDefault(),G.current++;let m=G.current*20,Y=((H=Ae.current[0])==null?void 0:H.groupId)?Math.random().toString(36).substring(2,9):void 0,L=Ae.current.map(N=>h(f({},N),{id:Math.random().toString(36).substring(2,9),groupId:N.groupId?Y:void 0,timestamp:Date.now(),points:N.points.map(_=>({x:_.x+m,y:_.y+m}))}));t({type:"PASTE_ANNOTATIONS",payload:{annotations:L}});let P=L.find(N=>N.type!=="text")||L[0];P&&gt(P.id);return}let X=de.current;if(X.length===0||Z.current)return;let M=(F=(se=x.composedPath)==null?void 0:se.call(x)[0])!=null?F:x.target,B=M==null?void 0:M.tagName;if(!(B==="INPUT"||B==="TEXTAREA"||M!=null&&M.isContentEditable)&&(x.key==="Delete"||x.key==="Backspace")){if(x.preventDefault(),c){let m=R.current.annotations;for(let C of X){let Y=m.find(P=>P.id===C);if(!Y)continue;let L=Y.threadId||Y.groupId&&((V=m.find(P=>P.groupId===Y.groupId&&P.threadId))==null?void 0:V.threadId);L&&c(L)}}for(let m of X)t({type:"DELETE_ANNOTATION",payload:{id:m}});Ue()}};return window.addEventListener("keydown",y),()=>window.removeEventListener("keydown",y)},[t,Ue,gt,e.activeTool,ce,g,d,c]);let Dn=Li(()=>fr(e.annotations),[e.annotations]),Jo=Li(()=>{let y=new Map,x=new Set,X=1;for(let M of e.annotations)if(!Dn.has(M))if(M.groupId){if(!x.has(M.groupId)){x.add(M.groupId);let B=e.annotations.filter(H=>H.groupId===M.groupId);for(let H of B)y.set(H.id,X);X++}}else y.set(M.id,X),X++;return y},[e.annotations,Dn]),Qi=Li(()=>{if(Ne.length===0)return null;let y=new Map;for(let x of Ne){let X=e.annotations.find(B=>B.id===x);if(!X)continue;let M=X.groupId?e.annotations.filter(B=>B.groupId===X.groupId):[X];for(let B of M)if(B.linkedSelector&&!(i!=null&&i.has(B.linkedSelector))){let H=B.color||e.activeColor;y.set(B.linkedSelector,H)}}return y.size>0?y:null},[Ne,e.annotations,e.activeColor,i]);Vt(()=>{let y=e.annotations.filter(x=>!(Dn.has(x)||T&&!T.isNew&&x.id===T.id));k(y,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,Ne,Fl,wt.x,wt.y,Jo,b)},[e.annotations,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,k,T,Ne,wt,Jo,Dn,b]),Vt(()=>{if(me){let y=Math.random().toString(36).substring(2,9);D({id:y,point:me.point,text:"",fontSize:12,isNew:!0,groupId:me.groupId}),ve(null)}},[me]),Vt(()=>{ae&&(D({id:Math.random().toString(36).substring(2,9),point:ae.point,text:"",fontSize:12,isNew:!0,linkedSelector:ae.linkedSelector,linkedAnchor:ae.linkedAnchor,elements:ae.elements}),Re(null))},[ae]);let Xo=Ct(null),Ko=(ss=T==null?void 0:T.id)!=null?ss:null;Vt(()=>{Ko&&We.current?requestAnimationFrame(()=>{var X;let y=We.current;if(!y||(y.focus(),Me.current===Ko))return;Me.current=Ko;let x=Z.current;if(x){if(Xo.current!==null){let M=Math.min(Xo.current,y.value.length);y.setSelectionRange(M,M);return}if(!x.isNew&&x.clickPoint){let M=A.current;if(!M)return;let B=M.getContext("2d");if(!B)return;B.font=`${x.fontSize}px ${Wt}`;let H=x.fontSize*1.4,se=x.text.split(`
7
- `),F=x.clickPoint.y-x.point.y,V=Math.max(0,Math.min(se.length-1,Math.floor(F/H))),m=x.clickPoint.x-x.point.x,C=se[V]||"",Y=0;for(let P=0;P<=C.length;P++){let N=B.measureText(C.substring(0,P)).width;if(N>m){let _=P>0?B.measureText(C.substring(0,P-1)).width:0;Y=m-_<N-m?P-1:P;break}Y=P}let L=Y;for(let P=0;P<V;P++)L+=(((X=se[P])==null?void 0:X.length)||0)+1;y.setSelectionRange(L,L)}}}):(Me.current=null,Xo.current=null)},[Ko,A]);let oo=Pt(y=>{let x=A.current;if(!x)return{x:0,y:0};let X=x.getBoundingClientRect(),M,B;if("touches"in y&&y.touches[0])M=y.touches[0].clientX,B=y.touches[0].clientY;else if("clientX"in y)M=y.clientX,B=y.clientY;else return{x:0,y:0};return{x:M-X.left+window.scrollX,y:B-X.top+window.scrollY}},[A]),$n=Pt((y,x,X,M)=>{let B=X.x-x.x,H=X.y-x.y,se=B*B+H*H;if(se===0)return Math.sqrt((y.x-x.x)**2+(y.y-x.y)**2)<=M;let F=Math.max(0,Math.min(1,((y.x-x.x)*B+(y.y-x.y)*H)/se)),V=x.x+F*B,m=x.y+F*H;return Math.sqrt((y.x-V)**2+(y.y-m)**2)<=M},[]),Zo=Pt(y=>{for(let X=e.annotations.length-1;X>=0;X--){let M=e.annotations[X];if(!M||Dn.has(M))continue;let B=(M.strokeWidth||3)+4;switch(M.type){case"text":{if(!M.points[0]||!M.text)continue;let H=M.points[0],se=M.fontSize||12,F=A.current;if(F){let V=F.getContext("2d");if(V){V.font=`${se}px ${Wt}`;let m=M.text.split(`
8
- `),C=H.x-wt.x,Y=co(C),L=Y!==void 0?Math.min(400,Y):void 0,P=L?jn(V,m,L):m,N=L?Math.min(L,Math.max(...P.map(nt=>V.measureText(nt).width))):Math.max(...m.map(nt=>V.measureText(nt).width)),_=P.length*(se*1.4),le=m.length*(se*1.4),be=_-le;if(y.x>=H.x-4-4&&y.x<=H.x+N+4+4&&y.y>=H.y-4-4-be&&y.y<=H.y+le+4+4)return M}}break}case"rectangle":{if(M.points.length<2)continue;let H=M.points[0],se=M.points[M.points.length-1],F=Math.min(H.x,se.x),V=Math.max(H.x,se.x),m=Math.min(H.y,se.y),C=Math.max(H.y,se.y),Y=$n(y,{x:F,y:m},{x:V,y:m},B),L=$n(y,{x:F,y:C},{x:V,y:C},B),P=$n(y,{x:F,y:m},{x:F,y:C},B),N=$n(y,{x:V,y:m},{x:V,y:C},B);if(Y||L||P||N)return M;break}case"circle":{if(M.points.length<2)continue;let H=M.points[0],se=M.points[M.points.length-1],F=(H.x+se.x)/2,V=(H.y+se.y)/2,m=Math.abs(se.x-H.x)/2,C=Math.abs(se.y-H.y)/2,Y=y.x-F,L=y.y-V,P=Math.sqrt((Y/m)**2+(L/C)**2);if(Math.abs(P-1)*Math.max(m,C)<=B)return M;break}case"line":{if(M.points.length<2)continue;let H=M.points[0],se=M.points[M.points.length-1];if($n(y,H,se,B))return M;break}case"freehand":{if(M.points.length<2)continue;for(let H=0;H<M.points.length-1;H++){let se=M.points[H],F=M.points[H+1];if($n(y,se,F,B))return M}break}}}return null},[e.annotations,A,$n,Dn,wt.x]),es=Pt(y=>{let x=Zo(y);return(x==null?void 0:x.type)==="text"?x:null},[Zo]),ts=Pt(y=>{if(Ne.length===0)return null;let x=Fl/2+4;for(let X of Ne){let M=e.annotations.find(B=>B.id===X);if(!(!M||M.points.length<2)){if(M.type==="line"){let B=M.points[0],H=M.points[M.points.length-1];if(Math.sqrt((y.x-B.x)**2+(y.y-B.y)**2)<=x)return{handle:"start",annotationId:X};if(Math.sqrt((y.x-H.x)**2+(y.y-H.y)**2)<=x)return{handle:"end",annotationId:X};continue}if(M.type==="circle"){let B=M.points[0],H=M.points[M.points.length-1],se=Math.min(B.x,H.x),F=Math.max(B.x,H.x),V=Math.min(B.y,H.y),m=Math.max(B.y,H.y),C=(se+F)/2,Y=(V+m)/2,L=[{handle:"top",x:C,y:V},{handle:"bottom",x:C,y:m},{handle:"left",x:se,y:Y},{handle:"right",x:F,y:Y}];for(let{handle:P,x:N,y:_}of L)if(Math.sqrt((y.x-N)**2+(y.y-_)**2)<=x)return{handle:P,annotationId:X};continue}if(M.type==="rectangle"||M.type==="freehand"){let B=M.points[0],H=M.points[M.points.length-1],se,F,V,m;M.type==="freehand"?(se=Math.min(...M.points.map(Y=>Y.x)),F=Math.max(...M.points.map(Y=>Y.x)),V=Math.min(...M.points.map(Y=>Y.y)),m=Math.max(...M.points.map(Y=>Y.y))):(se=Math.min(B.x,H.x),F=Math.max(B.x,H.x),V=Math.min(B.y,H.y),m=Math.max(B.y,H.y));let C=[{corner:"topLeft",x:se,y:V},{corner:"topRight",x:F,y:V},{corner:"bottomLeft",x:se,y:m},{corner:"bottomRight",x:F,y:m}];for(let{corner:Y,x:L,y:P}of C)if(Math.sqrt((y.x-L)**2+(y.y-P)**2)<=x)return{handle:Y,annotationId:X}}}}return null},[Ne,e.annotations]);Vt(()=>{let y=x=>{if(ne.current={x:x.clientX+window.scrollX,y:x.clientY+window.scrollY},!T){let X=es(ne.current);ee((X==null?void 0:X.id)||null)}};return window.addEventListener("mousemove",y),()=>window.removeEventListener("mousemove",y)},[T,es]);let ro=Pt(()=>{var x;if(!T)return;let y=((x=T.images)==null?void 0:x.length)||0;if(T.text.trim()||y>0)if(T.isNew){let X=nr();t({type:"ADD_TEXT",payload:f({point:T.point,text:T.text||(y>0?`[${y} image${y>1?"s":""}]`:""),fontSize:T.fontSize,id:X,groupId:T.groupId,linkedSelector:T.linkedSelector,linkedAnchor:T.linkedAnchor,elements:T.elements},y>0?{imageCount:y}:{})}),y>0&&T.images&&s&&s(X,T.images)}else t({type:"UPDATE_TEXT",payload:f({id:T.id,text:T.text||(y>0?`[${y} image${y>1?"s":""}]`:"")},y>0?{imageCount:y}:{})}),y>0&&T.images&&s&&s(T.id,T.images);else T.isNew||t({type:"DELETE_ANNOTATION",payload:{id:T.id}});D(null)},[T,t,s]),Tn=Pt(y=>{for(let x=0;x<Ii.length-1;x++){let X=Ii[x],M=Ii[x+1];if(y<=(X+M)/2)return X;if(y<M)return M}return Math.round(y/8)*8},[]),ns=Pt((y,x,X,M)=>{let B=X.top+Math.max(M.top,4),H=X.bottom-Math.max(M.bottom,4),se=X.left+Math.max(M.left,4),F=X.right-Math.max(M.right,4);if(y<X.left||y>X.right||x<X.top||x>X.bottom)return null;let V=x<B,m=x>H,C=y<se,Y=y>F;return V&&C?M.top>=M.left?"top":"left":V&&Y?M.top>=M.right?"top":"right":m&&C?M.bottom>=M.left?"bottom":"left":m&&Y?M.bottom>=M.right?"bottom":"right":V?"top":m?"bottom":C?"left":Y?"right":null},[]),os=Pt(y=>{var H,se;if(!e.isAnnotating)return;if(e.inspectedElement&&e.activeTool==="hand"&&!("button"in y&&y.button===2)){y.preventDefault(),y.stopPropagation(),t({type:"SELECT_ELEMENT",payload:null});return}let x=oo(y),X="shiftKey"in y&&y.shiftKey;if(e.activeTool==="inspector"){if("button"in y&&y.button===2)return;if(ge&&!It(ge)){let F=qt(ge),V=sn(ge),m=ge.getBoundingClientRect(),C=ge.getAttribute("data-pm");C||(C=Math.random().toString(36).substring(2,8),ge.setAttribute("data-pm",C));let Y=`[data-pm="${C}"]`,L=e.styleModifications.some(be=>{try{return ge.matches(be.selector)}catch(nt){return!1}}),P=e.annotations.filter(be=>{if(!be.linkedSelector)return!1;try{return ge.matches(be.linkedSelector)}catch(nt){return!1}}).length,N=(L?1:0)+P,_=m.top>=Xn*(1+N)?"top-left":"bottom-left",le=Nl(m,_,N);Re({point:le,linkedSelector:Y,linkedAnchor:_,elements:[h(f({},F),{selector:V})]})}return}if(e.activeTool==="model"){if("button"in y&&y.button===2)return;if(oe){let F=oe.name;if(g!=null&&g.has(F)){u==null||u(F);return}"shiftKey"in y&&y.shiftKey?Ke(m=>{let C=new Map(m);return C.has(F)?C.delete(F):C.set(F,oe),C}):ce.size===1&&ce.has(F)?(d&&d([F]),Ke(new Map)):Ke(new Map([[F,oe]]))}return}if(e.activeTool==="hand"&&at&&tt){let F=at,V=F.getAttribute("data-pm");V||(V=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",V));let m=sn(F),C=`[data-pm="${V}"]`,Y=qt(F),L=Fo(F),P=x.x-window.scrollX,N=x.y-window.scrollY,_=Kt,le=window.getComputedStyle(F).justifyContent,be=0;if(_){let Ye=Vn(F).find(Rt=>Rt.axis===tt);be=Ye?tt==="column"?Ye.w:Ye.h:0}_e(F,"transition","none"),st.current={isDragging:!0,hasMoved:!1,axis:tt,startX:P,startY:N,originalRow:_?be:L.row,originalColumn:_?be:L.column,element:F,elementInfo:h(f({},Y),{selector:C}),selector:C,durableSelector:m,isAuto:_,originalJustifyContent:le,visualGap:be},en({axis:tt,row:_?be:L.row,column:_?be:L.column});return}if(e.activeTool==="hand"&&kt&&W){let F=kt,V=F.getAttribute("data-pm");V||(V=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",V));let m=`[data-pm="${V}"]`,C=qt(F),{fontSize:Y,lineHeight:L}=No(F),P=Y>0?L/Y:1.2,N=x.x-window.scrollX,_=x.y-window.scrollY;_e(F,"transition","none");let le=sn(F);$t.current={isDragging:!0,property:W,startX:N,startY:_,originalFontSize:Y,originalLineHeight:L,originalRatio:P,element:F,elementInfo:h(f({},C),{selector:m}),selector:m,durableSelector:le},Pe({property:W,fontSize:Y,lineHeight:L});return}if(e.activeTool==="hand"&&ft&&pt){let F=ft,V=F.getAttribute("data-pm");V||(V=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",V));let m=`[data-pm="${V}"]`,C=sn(F),Y=qt(F),L=Un(F),P=F.getBoundingClientRect(),N=Math.floor(P.height/2),_=x.y-window.scrollY;_e(F,"transition","none"),Fe.current={isDragging:!0,corner:pt,startY:_,original:L,maxRadius:N,element:F,elementInfo:h(f({},Y),{selector:m}),selector:m,durableSelector:C},dn({corner:pt,radius:f({},L)});return}if(e.activeTool==="hand"&&z&&Q){let F=z,V=F.getAttribute("data-pm");V||(V=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",V));let m=`[data-pm="${V}"]`,C=sn(F),Y=qt(F),L=go(F),P=x.x-window.scrollX,N=x.y-window.scrollY;_e(F,"transition","none"),Ve.current={isDragging:!0,side:Q,startX:P,startY:N,original:L,element:F,elementInfo:h(f({},Y),{selector:m}),selector:m,durableSelector:C},lt({side:Q,padding:f({},L)});return}let M=ts(x);if(M){let F=e.annotations.find(V=>V.id===M.annotationId);if(F&&F.type!=="text"&&((H=F.status)!=null?H:"pending")==="pending"){Ht({annotationId:M.annotationId,handle:M.handle,startPoint:x,originalPoints:[...F.points],hasMoved:!1});return}}let B=Zo(x);if(B&&B.points[0]){if(T&&ro(),B.type!=="text"?(gt(B.id,X),B.color&&t({type:"SET_COLOR",payload:B.color})):X||Ue(),a){let F=B.threadId||(B.groupId?(se=e.annotations.find(V=>V.groupId===B.groupId&&V.threadId))==null?void 0:se.threadId:void 0);F&&a(F)}ke({annotation:B,startPoint:x,hasMoved:!1});return}if(X||Ue(),e.activeTool==="text"){T&&ro();let F=Math.random().toString(36).substring(2,9);D({id:F,point:x,text:"",fontSize:12,isNew:!0});return}j(!0),t({type:"START_PATH",payload:x})},[e.isAnnotating,e.activeTool,e.inspectedElement,e.annotations,T,Ne,ge,z,Q,ft,pt,at,tt,Kt,kt,W,oe,ce,g,d,u,a,oo,Zo,ts,t,gt,Ue,ro]),rs=Pt(y=>{var X,M;let x=oo(y);if(e.activeTool==="inspector"&&e.isAnnotating){let B=x.x-window.scrollX,H=x.y-window.scrollY,se=Gn(B,H),F=se&&It(se)?null:se;F!==ge&&(Ge(F),dt(F?qt(F):null));return}if(e.activeTool==="model"&&e.isAnnotating){let B=x.x-window.scrollX,H=x.y-window.scrollY,se=Gn(B,H);if(se!==xe.current&&(xe.current=se,Te.current=0),se){let F=ir(se,Te.current);Ee(F)}else Ee(null);return}if(e.activeTool==="hand"&&e.isAnnotating){let B=x.x-window.scrollX,H=x.y-window.scrollY;Qe.current={x:B,y:H},Ot({x:B,y:H});let se=Be.current.cmd,F=Be.current.shift;if(st.current.isDragging){let m=st.current,C=m.element;if(!C)return;if(!m.hasMoved){let N=Math.abs(B-m.startX),_=Math.abs(H-m.startY);if(N<=2&&_<=2)return;m.hasMoved=!0,m.isAuto&&(_e(C,"justify-content","normal"),_e(C,"row-gap",`${m.visualGap}px`),_e(C,"column-gap",`${m.visualGap}px`),rn(!1))}let Y=m.axis,L=m.originalRow,P=m.originalColumn;if(Y==="column"){let N=B-m.startX;P=m.originalColumn+N,se||(L=m.originalRow+N)}else{let N=H-m.startY;L=m.originalRow+N,se||(P=m.originalColumn+N)}L=Math.max(0,L),P=Math.max(0,P),F&&(L=Tn(L),P=Tn(P)),L=Math.round(L),P=Math.round(P),_e(C,"row-gap",`${L}px`),_e(C,"column-gap",`${P}px`),en({axis:Y,row:L,column:P});return}if(Fe.current.isDragging){let m=Fe.current,C=m.element;if(!C)return;let Y=H-m.startY,L=m.corner,P=m.original,N=f({},P);if(se){let _=P[L]+Y;_=Math.max(0,Math.min(m.maxRadius,_)),F&&(_=Tn(_)),_=Math.round(_),N[L]=_}else{let _=P[L]+Y;_=Math.max(0,Math.min(m.maxRadius,_)),F&&(_=Tn(_)),_=Math.round(_),N={"top-left":_,"top-right":_,"bottom-right":_,"bottom-left":_}}_e(C,"border-top-left-radius",`${N["top-left"]}px`),_e(C,"border-top-right-radius",`${N["top-right"]}px`),_e(C,"border-bottom-right-radius",`${N["bottom-right"]}px`),_e(C,"border-bottom-left-radius",`${N["bottom-left"]}px`),dn({corner:L,radius:N});return}if($t.current.isDragging){let m=$t.current,C=m.element;if(!C)return;let Y=m.property,L=m.originalFontSize,P=m.originalLineHeight,N=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(Y==="font-size"){let le=B-m.startX;L=m.originalFontSize+le,L=Math.max(1,L)}else{let le=H-m.startY;P=m.originalLineHeight+le,P=Math.max(L,P)}if(F)if(Y==="font-size"){let le=N[0],be=Math.abs(L-le);for(let nt of N){let Ye=Math.abs(L-nt);Ye<be&&(le=nt,be=Ye)}L=le}else{let le=L>0?P/L:1.2,be=Math.round(le*2)/2;P=L*Math.max(1,be)}L=Math.round(L),P=Math.round(P*10)/10,_e(C,"font-size",`${L}px`);let _=L>0?Math.round(P/L*1e3)/1e3:1.2;_e(C,"line-height",`${_}`),Pe({property:Y,fontSize:L,lineHeight:P});return}if(Ve.current.isDragging){let m=Ve.current,C=m.element;if(!C)return;let Y=m.side,L=m.original,P=L.top,N=L.right,_=L.bottom,le=L.left;if(Y==="top"){let be=m.startY-H;P=L.top+be,se||(_=L.bottom+be)}else if(Y==="bottom"){let be=H-m.startY;_=L.bottom+be,se||(P=L.top+be)}else if(Y==="left"){let be=m.startX-B;le=L.left+be,se||(N=L.right+be)}else if(Y==="right"){let be=B-m.startX;N=L.right+be,se||(le=L.left+be)}P=Math.max(0,P),N=Math.max(0,N),_=Math.max(0,_),le=Math.max(0,le),F&&(P=Tn(P),N=Tn(N),_=Tn(_),le=Tn(le)),P=Math.round(P),N=Math.round(N),_=Math.round(_),le=Math.round(le),_e(C,"padding",`${P}px ${N}px ${_}px ${le}px`),lt({side:Y,padding:{top:P,right:N,bottom:_,left:le}});return}let V=Gn(B,H);for(;V&&V.tagName==="A";)V=V.parentElement;{let C=[];V&&C.push(V),ft&&ft!==V&&C.push(ft);let Y=null,L=16,P=null;for(let N of C){let _=N.getBoundingClientRect(),le=Un(N),be=[["top-left",_.left,_.top+le["top-left"]],["top-right",_.right,_.top+le["top-right"]],["bottom-right",_.right,_.bottom-le["bottom-right"]],["bottom-left",_.left,_.bottom-le["bottom-left"]]];for(let[nt,Ye,Rt]of be){let ut=Math.hypot(B-Ye,H-Rt);ut<L&&(L=ut,Y=nt,P=N)}}if(Y&&P){Lt(P),bt(Y),z&&ie(null),Q&&Se(null),at&&Dt(null),tt&&vt(null),rn(!1),kt&&hn(null),W&&te(null);return}}ft&&Lt(null),pt&&bt(null);{let m=[];V&&ar(V)&&m.push(V);let C=(X=V==null?void 0:V.parentElement)!=null?X:null;for(;C&&C!==document.body&&m.length<3;)ar(C)&&m.push(C),C=C.parentElement;for(let Y of m){let P=Vn(Y).find(N=>B>=N.x&&B<=N.x+N.w&&H>=N.y&&H<=N.y+N.h);if(P){Dt(Y),vt(P.axis),rn(qr(Y,P.axis)),z&&ie(null),Q&&Se(null),kt&&hn(null),W&&te(null);return}}}at&&Dt(null),tt&&vt(null),rn(!1);{let C=[];V&&C.push(V),kt&&kt!==V&&C.push(kt);let Y=null,L=1/0,P=null;for(let N of C){if(!Qr(N))continue;let _=mo(N);if(!_)continue;let le=B>=_.left&&B<=_.right&&H>=_.top&&H<=_.bottom,be=[["font-size",_.right,_.top+_.height/2],["line-height",_.left+_.width/2,_.bottom]];for(let[nt,Ye,Rt]of be){let ut=Math.hypot(B-Ye,H-Rt);(le||ut<12)&&ut<L&&(L=ut,Y=nt,P=N)}}Y&&P?(hn(P),te(Y)):(kt&&hn(null),W&&te(null))}if(V!==z&&ie(V),V){let m=go(V),C=V.getBoundingClientRect(),Y=ns(B,H,C,m);Se(Y)}else Se(null);return}if(et){let{handle:B,originalPoints:H,hasMoved:se}=et,F=e.annotations.find(L=>L.id===et.annotationId);if(!F)return;let V="metaKey"in y,m=V&&(y.metaKey||y.ctrlKey),C=V&&y.shiftKey,Y;if(F.type==="line"){let L=H[0],P=H[H.length-1];B==="start"?Y=[x,P]:Y=[L,x]}else if(F.type==="freehand"){let L=Math.min(...H.map(De=>De.x)),P=Math.max(...H.map(De=>De.x)),N=Math.min(...H.map(De=>De.y)),_=Math.max(...H.map(De=>De.y)),le=(L+P)/2,be=(N+_)/2,nt=P-L||1,Ye=_-N||1,Rt=nt/Ye,ut=L,ue=P,we=N,Je=_;switch(B){case"topLeft":ut=x.x,we=x.y;break;case"topRight":ue=x.x,we=x.y;break;case"bottomLeft":ut=x.x,Je=x.y;break;case"bottomRight":ue=x.x,Je=x.y;break}if(m)switch(B){case"topLeft":ue=P+(L-ut),Je=_+(N-we);break;case"topRight":ut=L-(ue-P),Je=_+(N-we);break;case"bottomLeft":ue=P+(L-ut),we=N-(Je-_);break;case"bottomRight":ut=L-(ue-P),we=N-(Je-_);break}if(C){let De=ue-ut,mt=Je-we;if(Math.abs(De/mt)>Rt){let Ft=Math.abs(mt)*Rt*Math.sign(De);B==="topLeft"||B==="bottomLeft"?ut=ue-Ft:ue=ut+Ft}else{let Ft=Math.abs(De)/Rt*Math.sign(mt);B==="topLeft"||B==="topRight"?we=Je-Ft:Je=we+Ft}}let je=ue-ut||1,rt=Je-we||1;Y=H.map(De=>({x:ut+(De.x-L)/nt*je,y:we+(De.y-N)/Ye*rt}))}else if(F.type==="circle"){let L=H[0],P=H[H.length-1],N=Math.min(L.x,P.x),_=Math.max(L.x,P.x),le=Math.min(L.y,P.y),be=Math.max(L.y,P.y),nt=(N+_)/2,Ye=(le+be)/2,Rt=_-N,ut=be-le,ue=N,we=_,Je=le,je=be;switch(B){case"top":if(Je=x.y,m&&(je=Ye+(Ye-x.y)),C){let De=(je-Je)*(Rt/ut)/2;ue=nt-De,we=nt+De}break;case"bottom":if(je=x.y,m&&(Je=Ye-(x.y-Ye)),C){let De=(je-Je)*(Rt/ut)/2;ue=nt-De,we=nt+De}break;case"left":if(ue=x.x,m&&(we=nt+(nt-x.x)),C){let De=(we-ue)*(ut/Rt)/2;Je=Ye-De,je=Ye+De}break;case"right":if(we=x.x,m&&(ue=nt-(x.x-nt)),C){let De=(we-ue)*(ut/Rt)/2;Je=Ye-De,je=Ye+De}break}Y=[{x:ue,y:Je},{x:we,y:je}]}else{let L=H[0],P=H[H.length-1],N=Math.min(L.x,P.x),_=Math.max(L.x,P.x),le=Math.min(L.y,P.y),be=Math.max(L.y,P.y),nt=(N+_)/2,Ye=(le+be)/2,Rt=_-N||1,ut=be-le||1,ue=Rt/ut,we=N,Je=_,je=le,rt=be;switch(B){case"topLeft":we=x.x,je=x.y;break;case"topRight":Je=x.x,je=x.y;break;case"bottomLeft":we=x.x,rt=x.y;break;case"bottomRight":Je=x.x,rt=x.y;break}if(m)switch(B){case"topLeft":Je=_+(N-we),rt=be+(le-je);break;case"topRight":we=N-(Je-_),rt=be+(le-je);break;case"bottomLeft":Je=_+(N-we),je=le-(rt-be);break;case"bottomRight":we=N-(Je-_),je=le-(rt-be);break}if(C){let De=Je-we,mt=rt-je;if(Math.abs(De/mt)>ue){let Ft=Math.abs(mt)*ue*Math.sign(De);B==="topLeft"||B==="bottomLeft"?we=Je-Ft:Je=we+Ft}else{let Ft=Math.abs(De)/ue*Math.sign(mt);B==="topLeft"||B==="topRight"?je=rt-Ft:rt=je+Ft}}Y=[{x:we,y:je},{x:Je,y:rt}]}t({type:"RESIZE_ANNOTATION",payload:{id:et.annotationId,points:Y,saveUndo:!se}}),se||Ht(h(f({},et),{hasMoved:!0}));return}if(ye&&((M=ye.annotation.status)!=null?M:"pending")==="pending"){let B=x.x-ye.startPoint.x,H=x.y-ye.startPoint.y;if((Math.abs(B)>2||Math.abs(H)>2)&&!ye.hasMoved)ke(h(f({},ye),{hasMoved:!0,startPoint:x})),t({type:"MOVE_ANNOTATION",payload:{id:ye.annotation.id,delta:{x:B,y:H},saveUndo:!0}});else if(ye.hasMoved){let F=x.x-ye.startPoint.x,V=x.y-ye.startPoint.y;ke(h(f({},ye),{startPoint:x})),t({type:"MOVE_ANNOTATION",payload:{id:ye.annotation.id,delta:{x:F,y:V}}})}return}!q||!e.isAnnotating||t({type:"CONTINUE_PATH",payload:x})},[q,e.isAnnotating,e.activeTool,ye,et,ge,z,Q,ft,pt,at,tt,kt,W,oo,t,Tn,ns]),Ir=Pt(y=>{var M,B,H,se,F,V;if($t.current.isDragging){let m=$t.current,C=m.element;if(C&&m.selector&&m.elementInfo&&U){C instanceof HTMLElement&&(C.style.removeProperty("font-size"),C.style.removeProperty("line-height"),C.style.removeProperty("transition"));let Y=[];if(m.originalFontSize!==U.fontSize&&(_e(C,"font-size",`${U.fontSize}px`),Y.push({property:"font-size",original:`${m.originalFontSize}px`,modified:`${U.fontSize}px`})),m.originalLineHeight!==U.lineHeight){let L=m.originalFontSize>0?Math.round(m.originalLineHeight/m.originalFontSize*1e3)/1e3:1.2,P=U.fontSize>0?Math.round(U.lineHeight/U.fontSize*1e3)/1e3:1.2;_e(C,"line-height",`${P}`),Y.push({property:"line-height",original:`${L}`,modified:`${P}`})}Y.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:m.selector,durableSelector:(M=m.durableSelector)!=null?M:void 0,element:m.elementInfo,changes:Y}})}$t.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},Pe(null);return}if(st.current.isDragging){let m=st.current,C=m.element,Y="button"in y&&y.button===2;if(!m.hasMoved&&!Y&&C&&m.selector&&m.elementInfo){C instanceof HTMLElement&&C.style.removeProperty("transition");let L=["space-between","space-around","stretch","normal"],P=m.originalJustifyContent||"normal",N=L.indexOf(P),_=L[(N+1)%L.length],le=[];_==="normal"?(_e(C,"justify-content","normal"),le.push({property:"justify-content",original:m.originalJustifyContent,modified:"normal"})):_==="stretch"?(_e(C,"justify-content",_),_e(C,"row-gap","8px"),_e(C,"column-gap","8px"),le.push({property:"justify-content",original:m.originalJustifyContent||"normal",modified:_}),m.originalRow!==8&&le.push({property:"row-gap",original:`${m.originalRow}px`,modified:"8px"}),m.originalColumn!==8&&le.push({property:"column-gap",original:`${m.originalColumn}px`,modified:"8px"})):(C instanceof HTMLElement&&(C.style.removeProperty("row-gap"),C.style.removeProperty("column-gap")),_e(C,"justify-content",_),le.push({property:"justify-content",original:m.originalJustifyContent||"normal",modified:_}),m.originalRow>0&&le.push({property:"row-gap",original:`${m.originalRow}px`,modified:"0px"}),m.originalColumn>0&&le.push({property:"column-gap",original:`${m.originalColumn}px`,modified:"0px"})),le.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:m.selector,durableSelector:(B=m.durableSelector)!=null?B:void 0,element:m.elementInfo,changes:le}})}else if(m.hasMoved&&C&&m.selector&&m.elementInfo&&$e){C instanceof HTMLElement&&(C.style.removeProperty("row-gap"),C.style.removeProperty("column-gap"),C.style.removeProperty("transition"));let L=[];m.isAuto?(C instanceof HTMLElement&&C.style.removeProperty("justify-content"),_e(C,"justify-content","normal"),_e(C,"row-gap",`${$e.row}px`),_e(C,"column-gap",`${$e.column}px`),L.push({property:"justify-content",original:m.originalJustifyContent,modified:"normal"}),L.push({property:"row-gap",original:"0px",modified:`${$e.row}px`}),L.push({property:"column-gap",original:"0px",modified:`${$e.column}px`})):(m.originalRow!==$e.row&&(_e(C,"row-gap",`${$e.row}px`),L.push({property:"row-gap",original:`${m.originalRow}px`,modified:`${$e.row}px`})),m.originalColumn!==$e.column&&(_e(C,"column-gap",`${$e.column}px`),L.push({property:"column-gap",original:`${m.originalColumn}px`,modified:`${$e.column}px`}))),L.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:m.selector,durableSelector:(H=m.durableSelector)!=null?H:void 0,element:m.elementInfo,changes:L}})}st.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},en(null);return}if(Fe.current.isDragging){let m=Fe.current,C=m.element;if(C&&m.selector&&m.elementInfo&&St){C instanceof HTMLElement&&(C.style.removeProperty("border-top-left-radius"),C.style.removeProperty("border-top-right-radius"),C.style.removeProperty("border-bottom-right-radius"),C.style.removeProperty("border-bottom-left-radius"),C.style.removeProperty("transition"));let Y=["top-left","top-right","bottom-right","bottom-left"],L={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},P=[];for(let N of Y)m.original[N]!==St.radius[N]&&(_e(C,L[N],`${St.radius[N]}px`),P.push({property:L[N],original:`${m.original[N]}px`,modified:`${St.radius[N]}px`}));P.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:m.selector,durableSelector:(se=m.durableSelector)!=null?se:void 0,element:m.elementInfo,changes:P}})}Fe.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},dn(null);return}if(Ve.current.isDragging){let m=Ve.current,C=m.element,Y=m.selector,L=m.elementInfo;if(C&&Y&&L&&fe){let P=m.original,N=fe.padding;C instanceof HTMLElement&&(C.style.removeProperty("padding"),C.style.removeProperty("transition"));let _=[],le=[{prop:"padding-top",origVal:P.top,newVal:N.top},{prop:"padding-right",origVal:P.right,newVal:N.right},{prop:"padding-bottom",origVal:P.bottom,newVal:N.bottom},{prop:"padding-left",origVal:P.left,newVal:N.left}];for(let{prop:be,origVal:nt,newVal:Ye}of le)nt!==Ye&&(_e(C,be,`${Ye}px`),_.push({property:be,original:`${nt}px`,modified:`${Ye}px`}));_.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:Y,durableSelector:(F=m.durableSelector)!=null?F:void 0,element:L,changes:_}})}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},lt(null);return}if(et){Ht(null);return}if(ye){if(!ye.hasMoved&&ye.annotation.type==="text"&&((V=ye.annotation.status)!=null?V:"pending")==="pending"){let m=oo(y);D({id:ye.annotation.id,point:ye.annotation.points[0],text:ye.annotation.text||"",fontSize:ye.annotation.fontSize||12,isNew:!1,clickPoint:m,groupId:ye.annotation.groupId})}ke(null);return}if(!q)return;let x=5;if(e.currentPath.length>=2){let m=e.currentPath[0],C=e.currentPath[e.currentPath.length-1],Y=Math.abs(C.x-m.x),L=Math.abs(C.y-m.y);if((e.activeTool==="line"?Math.sqrt(Y*Y+L*L)<x:Y<x&&L<x)&&["rectangle","circle","line"].includes(e.activeTool)){j(!1),t({type:"CANCEL_PATH"});return}}let X=Vr(e.currentPath);if(e.activeTool==="rectangle"&&e.currentPath.length>=2){let m=e.currentPath[0],C=e.currentPath[e.currentPath.length-1],Y=Math.min(m.x,C.x),L=Math.max(m.y,C.y),P=e.strokeWidth/2,N=Math.random().toString(36).substring(2,9);ve({point:{x:Y-P+4,y:L+P+4},groupId:N}),j(!1),t({type:"FINISH_PATH",payload:{groupId:N,elements:X}});return}j(!1),t({type:"FINISH_PATH",payload:{elements:X}})},[q,ye,et,fe,St,$e,U,oo,t,e.activeTool,e.currentPath,e.strokeWidth]),fa=Pt(y=>{let x=y.target.value;Xo.current=y.target.selectionStart,D(X=>X&&h(f({},X),{text:x}))},[]),ga=Pt(y=>{y.key==="Escape"?D(null):y.key==="Enter"&&!y.shiftKey&&(y.preventDefault(),ro())},[ro]),ma=Pt(y=>{if(!T)return;let x=y.clipboardData.items,X=[];for(let M=0;M<x.length;M++){let B=x[M];if(B.type.startsWith("image/")){let H=B.getAsFile();H&&X.push(H)}}X.length>0&&(y.preventDefault(),D(M=>M?h(f({},M),{images:[...M.images||[],...X]}):null))},[T]),ha=Pt(y=>{if(!e.isAnnotating)return;if(e.activeTool==="hand"){y.preventDefault();let X=z||at||ft||kt;if(X&&!It(X)){let M=qt(X),B=sn(X);t({type:"SELECT_ELEMENT",payload:{el:X,info:h(f({},M),{selector:B})}})}return}y.preventDefault();let x=A.current;x&&($.current=!0,x.style.pointerEvents="none",setTimeout(()=>{$.current&&($.current=!1,x.style.pointerEvents="")},4e3))},[e.activeTool,e.isAnnotating,z,at,ft,kt,t,It,A]);Vt(()=>{let y=e.annotations.filter(H=>H.linkedSelector);if(y.length===0)return;let x=null,X=()=>{var se,F,V;let H=[];for(let m of y){let C=document.querySelector(m.linkedSelector);if(!C&&((F=(se=m.elements)==null?void 0:se[0])!=null&&F.selector)&&m.linkedSelector.startsWith("[data-pm=")){try{C=document.querySelector(m.elements[0].selector)}catch(Ye){}if(C){let Ye=(V=m.linkedSelector.match(/data-pm="([^"]+)"/))==null?void 0:V[1];Ye&&C.setAttribute("data-pm",Ye)}}if(!C)continue;let Y=C.getBoundingClientRect(),L=e.styleModifications.some(Ye=>{try{return C.matches(Ye.selector)}catch(Rt){return!1}}),P=y.filter(Ye=>Ye.id!==m.id&&Ye.timestamp<m.timestamp&&Ye.linkedSelector===m.linkedSelector).length,N=(L?1:0)+P,_=Y.top>=Xn*(1+N)?"top-left":"bottom-left",le=Nl(Y,_,N),be=m.points[0],nt=_!==m.linkedAnchor;be&&(nt||Math.abs(le.x-be.x)>1||Math.abs(le.y-be.y)>1)&&H.push({id:m.id,point:le,linkedAnchor:nt?_:void 0})}H.length>0&&t({type:"UPDATE_LINKED_POSITIONS",payload:{updates:H}})},M=()=>{x&&cancelAnimationFrame(x),x=requestAnimationFrame(X)};X(),window.addEventListener("scroll",M,!0),window.addEventListener("resize",M,!0),window.addEventListener("load",M),document.fonts.ready.then(M);let B=new MutationObserver(M);return B.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",M,!0),window.removeEventListener("resize",M,!0),window.removeEventListener("load",M),B.disconnect(),x&&cancelAnimationFrame(x)}},[e.annotations,t]);let ya=()=>{var y,x,X;if(!e.isAnnotating)return"default";if(et){let{handle:M}=et;return M==="start"||M==="end"?"move":M==="top"||M==="bottom"?"ns-resize":M==="left"||M==="right"?"ew-resize":M==="topLeft"||M==="bottomRight"?"nwse-resize":"nesw-resize"}if(e.activeTool==="text")return"text";if(e.activeTool==="hand"){let M=(y=$e==null?void 0:$e.axis)!=null?y:tt;if(M==="row")return"ns-resize";if(M==="column")return"ew-resize";if(St||pt)return"ns-resize";let B=(x=U==null?void 0:U.property)!=null?x:W;if(B==="font-size")return"ew-resize";if(B==="line-height")return"ns-resize";let H=(X=fe==null?void 0:fe.side)!=null?X:Q;return H==="top"||H==="bottom"?"ns-resize":H==="left"||H==="right"?"ew-resize":"default"}return"crosshair"},ba={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:e.isAnnotating?"auto":"none",visibility:e.isAnnotating?"visible":"hidden",cursor:ya()},Oo=Pt(()=>{let y=A.current;if(!y||!T)return{width:100,height:12*1.4,isWrapped:!1};let x=y.getContext("2d");if(!x)return{width:100,height:T.fontSize*1.4,isWrapped:!1};x.font=`${T.fontSize}px ${Wt}`;let M=x.measureText("Type here...").width,B=T.text.split(`
9
- `),H=B.length>0?Math.max(M,...B.map(C=>x.measureText(C||" ").width)):M,se=T.point.x-wt.x,F=co(se);if(F!==void 0&&H>F){let C=jn(x,B,F),Y=Math.min(F,Math.max(M,...C.map(P=>x.measureText(P).width))),L=Math.max(1,C.length)*T.fontSize*1.4;return{width:Y,height:L,isWrapped:!0}}let m=Math.max(1,B.length)*T.fontSize*1.4;return{width:H,height:m,isWrapped:!1}},[T,A,wt.x])(),xa=T?Math.max(1,T.text.split(`
10
- `).length)*T.fontSize*1.4+8:0,is=Oo.height+8,va=Oo.isWrapped?is-xa:0,Sa=T?{position:"fixed",left:T.point.x-4-wt.x,top:T.point.y-4-wt.y-va,zIndex:9999,width:Oo.width+8,height:is,padding:4,fontSize:T.fontSize,fontFamily:Wt,color:"#ffffff",backgroundColor:e.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:Oo.isWrapped?"pre-wrap":"pre",wordBreak:Oo.isWrapped?"break-word":void 0}:{};return ko(Co,{children:[ot("canvas",{ref:I,id:"devtools-canvas",style:ba,onMouseDown:os,onMouseMove:rs,onMouseUp:y=>Ir(y),onMouseLeave:y=>{Ir(y),Ge(null),dt(null)},onTouchStart:os,onTouchMove:rs,onTouchEnd:y=>Ir(y),onContextMenu:ha}),T&&ko(Co,{children:[ot("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),ot("textarea",{id:"devtools-text-input",ref:We,value:T.text,onChange:fa,onKeyDown:ga,onPaste:ma,onBlur:ro,placeholder:"Type here...",style:Sa}),T.images&&T.images.length>0&&ko("div",{"data-devtools":!0,style:{position:"fixed",left:T.point.x-4-wt.x,top:T.point.y-4-wt.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:[T.images.length," image",T.images.length>1?"s":""," attached"]})]}),e.isAnnotating&&e.activeTool!=="hand"&&e.styleModifications.length>0&&ot(ml,{styleModifications:e.styleModifications,isInspecting:!!e.inspectedElement,accentColor:e.activeColor,annotationGroupCount:new Set(e.annotations.map(y=>y.groupId||y.id)).size,dispatch:t,inFlightSelectors:n}),e.activeTool==="hand"&&e.isAnnotating&&e.styleModifications.length>0&&ot(yl,{styleModifications:e.styleModifications,accentColor:e.activeColor}),e.isAnnotating&&ot(il,{annotations:e.annotations,supersededAnnotations:Dn,inFlightIds:r,scrollX:wt.x,scrollY:wt.y,annotationGroupMap:Jo,onViewThread:a,onSelectAnnotation:gt,canvasRef:A}),e.isAnnotating&&l&&ot(sl,{annotations:e.annotations,supersededAnnotations:Dn,scrollX:wt.x,scrollY:wt.y,onReply:l,annotationGroupMap:Jo,canvasRef:A}),e.isAnnotating&&i&&i.size>0&&ot(ri,{inFlightSelectorColors:i}),e.isAnnotating&&Qi&&ot(ri,{inFlightSelectorColors:Qi,animated:!1}),e.activeTool==="hand"&&e.isAnnotating&&($e?st.current.element:at)&&ot(ci,{element:$e?st.current.element:at,gap:$e?{row:$e.row,column:$e.column}:Fo(at),accentColor:e.activeColor,hoveredAxis:tt,draggingAxis:(ls=$e==null?void 0:$e.axis)!=null?ls:null,cursorViewport:Tt,isAutoGap:Kt,refreshKey:mn}),e.activeTool==="hand"&&e.isAnnotating&&J&&ot(Dl,{element:J.target,modifier:J.modifier,accentColor:e.activeColor,refreshKey:mn}),e.activeTool==="hand"&&e.isAnnotating&&!J&&(St?Fe.current.element:ft)&&ot(ul,{element:St?Fe.current.element:ft,radius:(as=St==null?void 0:St.radius)!=null?as:Un(ft),accentColor:e.activeColor,hoveredCorner:pt,draggingCorner:(cs=St==null?void 0:St.corner)!=null?cs:null,cursorViewport:Tt}),e.activeTool==="hand"&&e.isAnnotating&&!J&&(U?$t.current.element:kt)&&ot(Hl,{element:U?$t.current.element:kt,fontSize:(ds=U==null?void 0:U.fontSize)!=null?ds:No(kt).fontSize,lineHeight:(us=U==null?void 0:U.lineHeight)!=null?us:No(kt).lineHeight,accentColor:e.activeColor,hoveredProperty:W,draggingProperty:(ps=U==null?void 0:U.property)!=null?ps:null,cursorViewport:Tt}),e.activeTool==="hand"&&e.isAnnotating&&!J&&(fe?Ve.current.element:z)&&ot(mi,{element:fe?Ve.current.element:z,padding:(fs=fe==null?void 0:fe.padding)!=null?fs:go(z),accentColor:e.activeColor,hoveredSide:Q,draggingSide:(gs=fe==null?void 0:fe.side)!=null?gs:null,cursorViewport:Tt,refreshKey:U?U.fontSize+U.lineHeight*1e3:0}),e.activeTool==="inspector"&&e.isAnnotating&&ot(Co,{children:ge&&!e.inspectedElement&&(()=>{let y=!!ae||!!(T!=null&&T.linkedSelector)||e.annotations.some(x=>{if(!x.linkedSelector)return!1;try{return ge.matches(x.linkedSelector)}catch(X){return!1}});return ot(bo,{element:ge,isSelected:!1,elementInfo:xt,color:e.activeColor,hideTooltip:y})})()}),e.activeTool==="model"&&e.isAnnotating&&ce.size>0&&[...ce.entries()].map(([y,x])=>ot(bo,{element:x.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:x.rootElement.tagName.toLowerCase(),reactComponent:y},color:"#8b5cf6"},y)),e.activeTool==="model"&&e.isAnnotating&&Bo&&ot(bo,{element:Bo.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:Bo.rootElement.tagName.toLowerCase(),reactComponent:Bo.name},color:"#22c55e"}),e.activeTool==="model"&&e.isAnnotating&&un.length>0&&un.map((y,x)=>ot("div",{style:{position:"absolute",left:y.x,top:y.y,width:y.width,height:y.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:y.direction==="vertical"?ko(Co,{children:[ot("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ot("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ot("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ot("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:y.height<16?-6:"50%",transform:y.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(y.height)})]}):ko(Co,{children:[ot("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ot("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ot("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ot("div",{style:{position:"absolute",left:y.width<30?0:"50%",top:(y.width<30,void 0),bottom:"calc(50% + 4px)",transform:y.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(y.width)})]})},x)),e.activeTool==="model"&&e.isAnnotating&&oe&&ot(bo,{element:oe.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:oe.rootElement.tagName.toLowerCase(),reactComponent:oe.name},color:g!=null&&g.has(oe.name)?"#22c55e":"#8b5cf6"}),e.activeTool==="hand"&&e.isAnnotating&&e.inspectedElement&&ko(Co,{children:[Le&&Le!=="padding"&&Le!=="gap"&&(()=>{var F;let y=new Set(e.annotations.map(V=>V.groupId||V.id)).size,x=e.inspectedElement.info.selector,X=e.styleModifications.findIndex(V=>V.selector===x),M=X>=0?y+X+1:y+e.styleModifications.length+1,B=e.styleModifications.find(V=>V.selector===x),H=(F=B==null?void 0:B.changes.length)!=null?F:0,se=!!(B!=null&&B.captured);return ot(bo,{element:e.inspectedElement.el,isSelected:!0,elementInfo:e.inspectedElement.info,color:se?"#999999":e.activeColor,annotationNumber:M,changeCount:H})})(),Le==="padding"&&ot(mi,{element:e.inspectedElement.el,padding:go(e.inspectedElement.el),accentColor:e.activeColor,hoveredSide:null,draggingSide:null}),Le==="gap"&&ot(ci,{element:e.inspectedElement.el,gap:Fo(e.inspectedElement.el),accentColor:e.activeColor,hoveredAxis:null,draggingAxis:null}),ot(Bl,{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:Ze,accentColor:e.activeColor,toolbarRef:O})]})]})}import{useCallback as cn,useEffect as wn,useMemo as Di,useRef as Bt,useState as jo}from"react";import{Circle as Tu,Component as Lu,Hand as Iu,MessageCircle as Ru,Pen as Au,Slash as Pu,Square as Bu,Trash2 as Ou,Type as Du}from"lucide-react";import{useEffect as nu,useRef as ou}from"react";function zl(e,t,o,r,n){let i=ou(0);nu(()=>{if(!o.current||(localStorage.setItem(n.expanded,String(e)),!e))return;let s=t.annotations.length;(s>=i.current||s===0||!r)&&(localStorage.setItem(n.annotations,JSON.stringify(t.annotations)),i.current=s),localStorage.setItem(n.styleMods,JSON.stringify(t.styleModifications)),localStorage.setItem(n.spacingChanges,JSON.stringify(t.spacingTokenChanges)),localStorage.setItem(n.tool,t.activeTool),localStorage.setItem(n.color,t.activeColor),localStorage.setItem(n.stroke,String(t.strokeWidth)),t.inspectedElement?localStorage.setItem(n.inspected,JSON.stringify({selector:t.inspectedElement.info.selector,info:t.inspectedElement.info})):localStorage.removeItem(n.inspected)},[e,t.annotations,t.styleModifications,t.spacingTokenChanges,t.activeTool,t.activeColor,t.strokeWidth,t.inspectedElement,r,o,n])}import{Component as ru,createElement as iu,useCallback as Er,useEffect as To,useRef as Mo,useState as Sn}from"react";import{Fragment as Lo,jsx as He,jsxs as Qt}from"react/jsx-runtime";var $l="popmelt-library-tab",su=/^#[0-9a-fA-F]{3,8}$/,lu=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,au=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),cu=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function Wl(e){let t=e.trim();return su.test(t)||lu.test(t)||au.has(t.toLowerCase())}function du(e){return cu.test(e.trim())}function uu(e){let t=e.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return t?parseFloat(t[1]):null}function Pi(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 o=[];for(let[r,n]of Object.entries(e)){let i=t?`${t}.${r}`:r;if(n!==null&&typeof n=="object"&&!Array.isArray(n)){let s=n;typeof s.value=="string"?o.push([i,s.value]):o.push(...Pi(n,i))}else o.push([i,Array.isArray(n)?n.map(String).join(", "):String(n!=null?n:"")])}return o}function pu(e){return e.length===0?"generic":e.filter(([,r])=>Wl(r)).length>e.length/2?"colors":e.filter(([,r])=>du(r)).length>e.length/2?"spacing":"generic"}var fu=h(f({position:"fixed",top:16,right:16,bottom:80,width:300,backgroundColor:"#ffffff"},bn),{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"}),Yl={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},gu=h(f({},Yl),{color:"#1f2937",borderBottom:"1.5px solid #1f2937"});function mu({entries:e}){let t=[],o=[];for(let r of e)Wl(r[1])?t.push(r):o.push(r);return Qt(Lo,{children:[t.length>0&&He("div",{style:{display:"flex",flexWrap:"wrap",gap:2,marginBottom:o.length>0?6:0},children:t.map(([r,n])=>He("div",{title:`${r.split(".").pop()}: ${n}`,style:{width:28,height:28,backgroundColor:n,outline:"1px solid rgba(0,0,0,0.08)",outlineOffset:-1}},r))}),o.length>0&&He(Bi,{entries:o})]})}var wr=[0,1,2,4,8,12,16,20,24,28,32];function hu(e){if(e<=32){let t=wr[0],o=Math.abs(e-t);for(let r=1;r<wr.length;r++){let n=Math.abs(e-wr[r]);n<o&&(t=wr[r],o=n)}return t}return Math.round(e/8)*8}function yu({label:e,value:t,px:o,tokenPath:r,rawToken:n,onHover:i,onModify:s,onDelete:l}){let[a,c]=Sn(!1),[d,u]=Sn(null),p=Mo(!1),g=Mo(0),S=Mo(0),v=Mo([]),b=d!==null?d:o,w=d!==null?`${d}px`:t,O=d!==null,A=Er(E=>{E.preventDefault(),p.current=!0,g.current=E.clientX,S.current=o;let I=sr(n);v.current=Jr(I);let $=j=>{let T=j.clientX-g.current,D=Math.max(0,Math.round(S.current+T));j.shiftKey&&(D=hu(D));for(let K of v.current)K.element.style.setProperty(K.property,D+"px","important");u(D),i==null||i({name:e,px:D,token:I})},q=()=>{window.removeEventListener("mousemove",$),window.removeEventListener("mouseup",q),document.body.style.cursor="",p.current=!1,u(j=>{if(j!==null&&j!==o&&s){let T=sr(n),D=T.bindings&&T.bindings.length>0,K;if(D){let ae=Kr(T.bindings,S.current,j);K=JSON.stringify(h(f({},T),{value:`${j}px`,bindings:ae}))}else{let ae=Ks(v.current,S.current),Re=Zs(v.current);if(ae.length>0){let We=Kr(ae,S.current,j);K=JSON.stringify({value:`${j}px`,property:Re,bindings:We})}else K=`${j}px`}let ee=typeof n=="string"?n:JSON.stringify(n),me=v.current.map(ae=>({selector:sn(ae.element),property:ae.property})),ve=Qs(v.current,S.current,j);s({tokenPath:r,originalValue:ee,currentValue:K,targets:me,originalPx:S.current,currentPx:j},{id:Math.random().toString(36).substring(2,9),tokenPath:r,tokenName:e,originalPx:S.current,newPx:j,affectedElements:ve})}return j})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",$),window.addEventListener("mouseup",q)},[o,e,r,n,i,s]),k=sr(n);return Qt("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",fontSize:11,padding:"1px 0",cursor:"ew-resize",userSelect:"none"},onMouseEnter:()=>{p.current||(c(!0),i==null||i({name:e,px:b,token:k}))},onMouseLeave:()=>{p.current||(c(!1),i==null||i(null))},onMouseDown:A,children:[He("span",{style:{color:a||O?"#FF0000":"#9ca3af"},children:e}),Qt("span",{style:{display:"flex",alignItems:"center",gap:4},children:[He("span",{style:{color:a||O?"#FF0000":"#6b7280",fontWeight:600},children:w}),l&&a&&!O&&He("button",{type:"button",title:"Remove token",onMouseDown:E=>{E.stopPropagation();let I=typeof n=="string"?n:JSON.stringify(n);l(r,I)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:E=>{E.currentTarget.style.color="#FF0000"},onMouseLeave:E=>{E.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function bu({entries:e,categoryKey:t,rawTokens:o,onHover:r,onModify:n,onDelete:i}){let s=[],l=[];for(let a of e){let c=uu(a[1]);c!==null?s.push([a[0],a[1],c]):l.push(a)}return Qt(Lo,{children:[s.length>0&&He("div",{style:{display:"flex",flexDirection:"column",gap:2},children:s.map(([a,c,d])=>{let u=a.split(".").pop(),p=o?xu(o,a):c,g=p&&typeof p=="object"&&"value"in p?p:c;return He(yu,{label:u,value:c,px:d,tokenPath:`tokens.${t}.${a}`,rawToken:g,onHover:r,onModify:n,onDelete:i},a)})}),l.length>0&&He(Bi,{entries:l})]})}function xu(e,t){let o=t.split("."),r=e;for(let n of o){if(r==null||typeof r!="object")return;r=r[n]}return r}function Bi({entries:e}){return He("div",{style:{display:"flex",flexDirection:"column",gap:3},children:e.map(([t,o])=>Qt("div",{style:{fontSize:11},children:[He("div",{style:{color:"#9ca3af",fontSize:10,marginBottom:1},children:t}),He("div",{style:{color:"#1f2937",lineHeight:1.4,paddingLeft:8},children:o})]},t))})}function jl({entries:e,categoryKey:t,rawTokens:o,onSpacingHover:r,onModifyToken:n,onDeleteToken:i}){let s=pu(e);return s==="colors"?He(mu,{entries:e}):s==="spacing"?He(bu,{entries:e,categoryKey:t,rawTokens:o,onHover:r,onModify:n,onDelete:i}):He(Bi,{entries:e})}function vu(e){let t=e.toLowerCase(),o=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}}),n=r.currentNode;for(;n=r.nextNode();){let i=n,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,c=typeof a=="function"||typeof a=="object"?(a==null?void 0:a.displayName)||(a==null?void 0:a.name):null;if(typeof c=="string"){let d=c.toLowerCase();if(d===t){let u=f({},l.memoizedProps);return delete u.ref,{type:a,props:u}}if(!o){if(d.length>=4&&t.includes(d)){let u=f({},l.memoizedProps);delete u.ref,o={type:a,props:u}}else if(t.length>=4&&d.includes(t)){let u=f({},l.memoizedProps);delete u.ref,o={type:a,props:u}}}}l=l.return}}return o}var Ai=class extends ru{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}};function Su({children:e}){return He("div",{style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:6},children:e})}function wu({tokens:e,onSpacingTokenHover:t,onModifyToken:o,onDeleteToken:r}){return!e||Object.keys(e).length===0?He("div",{style:{color:"#9ca3af",fontSize:11},children:"No tokens defined yet."}):He(Lo,{children:Object.entries(e).map(([n,i])=>Qt("div",{style:{marginBottom:14},children:[He(Su,{children:n}),He(jl,{entries:Pi(i),categoryKey:n,rawTokens:i,onSpacingHover:t,onModifyToken:o,onDeleteToken:r})]},n))})}function Eu({rules:e}){return!e||e.length===0?He("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."}):He(Lo,{children:e.map((t,o)=>Qt("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[Qt("span",{style:{color:"#9ca3af",flexShrink:0},children:[o+1,"."]}),He("span",{children:t})]},o))})}function ku({name:e,value:t,selected:o,highlighted:r,onRemove:n,onHover:i}){var j;let[s,l]=Sn(!1),[a,c]=Sn(!1),d=Mo(null),u=Mo(0),[p,g]=Sn(0),[S,v]=Sn(0),b=Pi(t),w=(j=b.find(([T])=>T==="description"))==null?void 0:j[1];To(()=>{if(!a&&!r){g(0),v(0),u.current=0;return}let T=po(e);g(T.length)},[a,r,e]),To(()=>{o&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[o]);let O=o||r||a,A=o?"139,92,246":"34,197,94",k=o?"#8b5cf6":"#22c55e",E=O?`rgba(${A},0.06)`:void 0,I=O?`inset 0 0 0 1.5px rgba(${A},0.35)`:void 0,$=r||a,q=Er(()=>{let T=po(e);if(T.length===0)return;let D=u.current%T.length;T[D].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),v(D),u.current=D+1,i==null||i({name:e,instanceIndex:D})},[e,i]);return Qt("div",{ref:d,onClick:q,onMouseEnter:()=>{c(!0),i==null||i({name:e,instanceIndex:0})},onMouseLeave:()=>{c(!1),i==null||i(null)},style:{marginBottom:8,background:E,padding:6,boxShadow:I,cursor:"pointer"},children:[Qt("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[Qt("div",{style:{display:"flex",alignItems:"center",gap:6,marginBottom:6},children:[He("div",{style:{fontWeight:700,fontSize:11,letterSpacing:"0.05em",padding:"2px 6px",backgroundColor:$?k:"transparent",color:$?"#fff":"#6b7280"},children:e}),$&&p>1&&Qt("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[S+1,"/",p]})]}),n&&a&&He("button",{type:"button",title:"Remove from model",onClick:T=>{T.stopPropagation(),n(e)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:T=>{T.currentTarget.style.color="#FF0000"},onMouseLeave:T=>{T.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),w&&He("div",{style:{fontSize:11,color:$?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:w}),s?He(jl,{entries:b.filter(([T])=>T!=="description"),categoryKey:""}):He(Cu,{name:e,onNotFound:()=>l(!0),entries:b})]})}function Cu({name:e,onNotFound:t}){let[o,r]=Sn(null),[n,i]=Sn(!1);return To(()=>{let s=vu(e);s||t(),r(s),i(!0)},[e,t]),!n||!o?null:He(Ai,{onError:t,children:He("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:He("div",{style:{zoom:.5,pointerEvents:"none"},children:iu(o.type,o.props)})})})}function Mu({components:e,selectedComponent:t,hoveredComponent:o,onRemove:r,onHover:n}){if(!e||Object.keys(e).length===0)return He("div",{style:{color:"#9ca3af",fontSize:11},children:"No component patterns defined yet."});let i=new Set(Object.keys(e)),s=Gr(i),l=Object.entries(e).sort(([a],[c])=>{var d,u;return((d=s.get(a))!=null?d:1/0)-((u=s.get(c))!=null?u:1/0)});return He(Lo,{children:l.map(([a,c])=>He(ku,{name:a,value:c,selected:t===a,highlighted:o===a,onRemove:r,onHover:n},a))})}function Gl({bridgeUrl:e,modelRefreshKey:t,onMouseEnter:o,onMouseLeave:r,selectedComponent:n,hoveredComponent:i,onComponentHover:s,onSpacingTokenHover:l,onModifySpacingToken:a,onDeleteSpacingToken:c,onComponentAdded:d,onComponentRemoved:u}){let[p,g]=Sn(void 0),[S,v]=Sn(!0),[b,w]=Sn(()=>{try{let D=localStorage.getItem($l);if(D==="tokens"||D==="components"||D==="rules")return D}catch(D){}return"components"});To(()=>{io(e).then(D=>{g(D),v(!1)})},[e,t]),To(()=>{try{localStorage.setItem($l,b)}catch(D){}},[b]),To(()=>{n&&(w("components"),io(e).then(D=>{D&&g(D)}))},[n,e]);let O=Er((D,K)=>{g(ee=>{if(!(ee!=null&&ee.tokens))return ee;let me=JSON.parse(JSON.stringify(ee.tokens)),ve=D.split("."),ae=me;for(let Re=1;Re<ve.length-1;Re++)if(ae=ae[ve[Re]],!ae)return ee;return delete ae[ve[ve.length-1]],h(f({},ee),{tokens:me})}),c==null||c(D,K)},[c]),A=Er(D=>{g(K=>{if(!(K!=null&&K.components))return K;let ve=K.components,{[D]:ee}=ve,me=Hn(ve,[Qo(D)]);return h(f({},K),{components:me})}),u==null||u(D)},[u]),k=p==null?void 0:p.tokens,E=p==null?void 0:p.components,I=p==null?void 0:p.rules,$=k&&Object.keys(k).length>0,q=E&&Object.keys(E).length>0,j=I&&I.length>0,T=!p||!$&&!q&&!j;return Qt("div",{style:fu,onMouseEnter:o,onMouseLeave:r,children:[Qt("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[He("span",{children:"Model"}),He("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"M"})]}),He("div",{style:{display:"flex",gap:12,marginBottom:10,borderBottom:"1px solid rgba(0,0,0,0.08)",paddingBottom:6},children:["components","rules"].map(D=>He("button",{type:"button",style:b===D?gu:Yl,onClick:()=>w(D),children:D.charAt(0).toUpperCase()+D.slice(1)},D))}),He("div",{style:{flex:1,overflowY:"auto",minHeight:0},children:S?He("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):T?He("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):Qt(Lo,{children:[b==="components"&&He(Mu,{components:E,selectedComponent:n,hoveredComponent:i,onRemove:A,onHover:s}),b==="tokens"&&He(wu,{tokens:k,onSpacingTokenHover:l,onModifyToken:a,onDeleteToken:c?O:void 0}),b==="rules"&&He(Eu,{rules:I})]})})]})}import{jsx as Vl}from"react/jsx-runtime";var Pn={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#f3f4f6",bgHover:"#f9fafb",separator:"#e5e7eb"};function Bn({children:e,active:t,siblingActive:o,disabled:r,onClick:n,title:i}){let s=()=>r?.4:o&&!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?Pn.bgActive:"transparent",color:t?Pn.iconActive:Pn.iconDefault,opacity:s()};return Vl("button",{type:"button",onClick:r?void 0:n,title:i,disabled:r,style:l,onMouseEnter:a=>{r||(a.currentTarget.style.opacity="1",t||(a.currentTarget.style.backgroundColor=Pn.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 Oi(){return Vl("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as eo,jsx as re,jsxs as yt}from"react/jsx-runtime";var to=[{type:"rectangle",icon:Bu,label:"Rectangle",shortcut:"R"},{type:"circle",icon:Tu,label:"Oval",shortcut:"O"},{type:"line",icon:Pu,label:"Line",shortcut:"L"},{type:"freehand",icon:Au,label:"Pen",shortcut:"P"}],Hu=new Set(to.map(e=>e.type));function Fu(e,t,o,r,n,i,s,l){let a=(e-n)*(r-i)-(o-n)*(t-i),c=(e-s)*(i-l)-(n-s)*(t-l),d=(e-o)*(l-r)-(s-o)*(t-r),u=a<0||c<0||d<0,p=a>0||c>0||d>0;return!(u&&p)}function Nu(){let e=window.innerWidth-16,t=e-326,o=window.innerHeight-80;return{left:t,right:e,y:o}}var _u=[{type:"text",icon:Du,label:"Text",shortcut:"T"}],Ul={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 Za=Object.defineProperty,Qa=Object.defineProperties;var ec=Object.getOwnPropertyDescriptors;var sr=Object.getOwnPropertySymbols;var Is=Object.prototype.hasOwnProperty,Rs=Object.prototype.propertyIsEnumerable;var Ts=(e,t,n)=>t in e?Za(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,f=(e,t)=>{for(var n in t||(t={}))Is.call(t,n)&&Ts(e,n,t[n]);if(sr)for(var n of sr(t))Rs.call(t,n)&&Ts(e,n,t[n]);return e},h=(e,t)=>Qa(e,ec(t));var lr=e=>typeof e=="symbol"?e:e+"",_n=(e,t)=>{var n={};for(var r in e)Is.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(e!=null&&sr)for(var r of sr(e))t.indexOf(r)<0&&Rs.call(e,r)&&(n[r]=e[r]);return n};import{createContext as Bf,useCallback as jt,useContext as Of,useEffect as Ot,useMemo as No,useRef as Vt,useState as Ut}from"react";import{useCallback as _s,useEffect as tc,useSyncExternalStore as nc}from"react";var Mn="http://localhost:1111";function kn(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,h(f({},t),{signal:r.signal})).finally(()=>clearTimeout(o))}async function As(e=Mn){try{let t=await kn(`${e}/capabilities`,{},5e3);return t.ok?await t.json():null}catch(t){return null}}async function fo(e=Mn){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 Ls(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 Ps(e){if(e&&e!=="http://localhost:1111")try{let c=new URL(e);return{url:e,port:parseInt(c.port,10)||1111}}catch(c){return null}let o=typeof window!="undefined"?window.location.origin:null,i=await Ls(1111);if(i&&i.devOrigin&&o&&i.devOrigin===o)return{url:"http://localhost:1111",port:1111};let s=Array.from({length:8},(c,d)=>{let u=1112+d;return Ls(u).then(p=>p?{status:p,port:u}:null)}),l=(await Promise.all(s)).filter(c=>c!==null),a=[];i&&a.push({port:1111,devOrigin:i.devOrigin});for(let c of l)a.push({port:c.port,devOrigin:c.status.devOrigin});if(o){let c=a.find(d=>d.devOrigin===o);if(c)return{url:`http://localhost:${c.port}`,port:c.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 Bs(e,t,n=Mn,r,o,i,s,l){let a=new FormData;if(a.append("screenshot",e,"screenshot.png"),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[d,u]of s)for(let p=0;p<u.length;p++)a.append(`image-${d}-${p}`,u[p],`image-${d}-${p}.png`);let c=await kn(`${n}/send`,{method:"POST",body:a},3e4);if(!c.ok){let d=await c.text();throw new Error(`Bridge returned ${c.status}: ${d}`)}return c.json()}async function Os(e=Mn,t){try{let n=await kn(`${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 Ds(e,t=Mn){let n=await kn(`${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 Ns(e,t=Mn){let n=await kn(`${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 $r(e,t,n=Mn){let r=await kn(`${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 Fs(e,t=Mn){let n=await kn(`${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 go(e=Mn){var t;try{let n=await kn(`${e}/model`,{},5e3);return n.ok&&(t=(await n.json()).model)!=null?t:null}catch(n){return null}}async function Hs(e,t,n=Mn,r,o,i,s,l){let a;if(s&&s.length>0){let c=new FormData,d=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"});c.append("screenshot",d,"screenshot.png"),c.append("feedback",JSON.stringify({threadId:e,reply:t,color:r,provider:o,model:i,sourceId:l}));for(let u=0;u<s.length;u++)c.append(`image-reply-${u}`,s[u],`reply-image-${u}.png`);a=await kn(`${n}/reply`,{method:"POST",body:c},3e4)}else a=await kn(`${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 c=await a.text();throw new Error(`Bridge returned ${a.status}: ${c}`)}return a.json()}var $s={};var Js=typeof crypto!="undefined"&&typeof crypto.randomUUID=="function"?crypto.randomUUID():Math.random().toString(36).slice(2);function jr(){return Js}var Xn=typeof $s!="undefined"?$s.hot:void 0,_t=Xn==null?void 0:Xn.data,oc={isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,lastErrorByJob:{},pendingQuestions:[],incrementalResolutions:[],capabilitiesVersion:0},Ws,_o=(Ws=_t==null?void 0:_t.store)!=null?Ws:f({},oc),Ys,ar=(Ys=_t==null?void 0:_t.listeners)!=null?Ys:new Set,js,Un=(js=_t==null?void 0:_t.activeEs)!=null?js:null,Gs,Wr=(Gs=_t==null?void 0:_t.activeBridgeUrl)!=null?Gs:null,Vn=null,Vs,Yr=(Vs=_t==null?void 0:_t.connectionGeneration)!=null?Vs:0;Xn!=null&&Xn.data&&Object.defineProperties(Xn.data,{store:{get:()=>_o,configurable:!0},listeners:{get:()=>ar,configurable:!0},activeEs:{get:()=>Un,configurable:!0},activeBridgeUrl:{get:()=>Wr,configurable:!0},connectionGeneration:{get:()=>Yr,configurable:!0},discoveredBridgeUrl:{get:()=>Jn,configurable:!0}});var Us,Jn=(Us=_t==null?void 0:_t.discoveredBridgeUrl)!=null?Us:null,mo=null;async function rc(e){return e&&e!=="http://localhost:1111"?(Jn=e,e):Jn||mo||(mo=Ps(e).then(n=>{var r;return Jn=(r=n==null?void 0:n.url)!=null?r:null,mo=null,Jn}).catch(()=>(mo=null,null)),mo)}function Xs(){return Jn}function zs(){return _o}function ic(e){return ar.add(e),()=>{ar.delete(e)}}function tn(e){_o=e(_o);for(let t of ar)t()}function Ks(e){if(Un&&Un.readyState!==EventSource.CLOSED&&Wr===e)return;Un&&(Un.close(),Un=null),Vn&&(clearTimeout(Vn),Vn=null),Wr=e;let t=++Yr,n=new EventSource(`${e}/events?sourceId=${Js}`);Un=n;let r=()=>t!==Yr;n.addEventListener("connected",()=>{r()||fo(e).then(o=>{var d,u;if(r())return;let i=(d=o==null?void 0:o.activeJobs)!=null?d:o!=null&&o.activeJob?[o.activeJob]:[],s=new Set(i.map(p=>p.id)),l=(u=o==null?void 0:o.recentJobs)!=null?u:[],a=new Map(l.map(p=>[p.id,p])),c=i.length>0;tn(p=>{let g=f({},p.lastErrorByJob),v=p.activeJobIds.filter(y=>!s.has(y));for(let y of v){let w=a.get(y);(w==null?void 0:w.status)==="error"&&w.error&&(g[y]=w.error)}let S=p.activeJobIds.filter(y=>s.has(y));for(let y of s)S.includes(y)||S.push(y);return h(f({},p),{isConnected:!0,status:c?"streaming":v.length>0||p.status==="disconnected"?"idle":p.status,activeJobId:c?i[i.length-1].id:S.length>0?S[S.length-1]:null,activeJobIds:S,lastErrorByJob:g,lastCompletedJobId:v.length>0?v[v.length-1]:p.lastCompletedJobId})})})}),n.addEventListener("job_started",o=>{if(r())return;let i=JSON.parse(o.data),s=i.jobId;tn(l=>h(f({},l),{status:"streaming",activeJobId:s,activeJobIds:[...l.activeJobIds,s],jobResponses:h(f({},l.jobResponses),{[s]:""}),jobThinking:h(f({},l.jobThinking),{[s]:""}),currentResponse:"",currentThinking:"",lastResponseText:null,lastThreadId:null,events:[...l.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,l=i.text||"";tn(a=>h(f({},a),{jobResponses:s?h(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,l=i.text||"";tn(a=>h(f({},a),{jobThinking:s?h(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);tn(s=>h(f({},s),{events:[...s.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;tn(l=>{var g;let a=s?l.activeJobIds.filter(v=>v!==s):l.activeJobIds,c=f({},l.jobResponses),d=f({},l.jobThinking),u=s?c[s]:void 0;s&&(delete c[s],delete d[s]);let p=s===l.activeJobId?a.length>0?a[a.length-1]:null:l.activeJobId;return h(f(h(f({},l),{activeJobIds:a,activeJobId:p,jobResponses:c,jobThinking:d,lastCompletedJobId:s!=null?s:l.activeJobId,lastResponseText:u||l.currentResponse||i.responseText||null,lastThreadId:(g=i.threadId)!=null?g:null}),s===l.activeJobId?{currentResponse:p&&c[p]||"",currentThinking:p&&d[p]||""}:{}),{events:[...l.events,{type:"done",data:i,timestamp:Date.now()}]})})}),n.addEventListener("question",o=>{if(r())return;let i=JSON.parse(o.data);tn(s=>h(f({},s),{pendingQuestions:[...s.pendingQuestions,{jobId:i.jobId,threadId:i.threadId,question:i.question,annotationIds:i.annotationIds,timestamp:Date.now()}],events:[...s.events,{type:"question",data:i,timestamp:Date.now()}]}))}),n.addEventListener("capabilities_changed",()=>{r()||tn(o=>h(f({},o),{capabilitiesVersion:o.capabilitiesVersion+1}))}),n.addEventListener("queue_drained",()=>{r()||tn(o=>h(f({},o),{status:o.status==="error"?"error":"idle",activeJobId:null,activeJobIds:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastErrorByJob:{},incrementalResolutions:[]}))}),n.addEventListener("error",o=>{var i,s;if(!r()){if(n.readyState===EventSource.CLOSED)tn(l=>h(f({},l),{isConnected:!1,status:"disconnected"})),Vn&&(clearTimeout(Vn),Vn=null),Vn=setTimeout(()=>{fo(e).then(l=>{l&&Ks(e)})},5e3);else if(o instanceof MessageEvent){let l=JSON.parse(o.data),a=(i=l.jobId)!=null?i:null,c=(s=l.message)!=null?s:"";tn(d=>{let u=a?d.activeJobIds.filter(g=>g!==a):d.activeJobIds,p=u.length>0?d.status:"error";return h(f({},d),{status:p,activeJobIds:u,lastCompletedJobId:a!=null?a:d.activeJobId,lastErrorByJob:a&&c?h(f({},d.lastErrorByJob),{[a]:c}):d.lastErrorByJob,events:[...d.events,{type:"error",data:l,timestamp:Date.now()}]})})}}}),n.onerror=()=>{r()||n.readyState===EventSource.CLOSED&&tn(o=>h(f({},o),{isConnected:!1,status:"disconnected"}))}}function qs(e="http://localhost:1111"){let t=nc(ic,zs,zs);tc(()=>{rc(e).then(o=>{o&&fo(o).then(i=>{i&&Ks(o)})})},[e]);let n=_s(()=>{tn(()=>h(f({},_o),{events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,lastErrorByJob:{},incrementalResolutions:[]}))},[]),r=_s(o=>{tn(i=>h(f({},i),{pendingQuestions:i.pendingQuestions.filter(s=>s.threadId!==o)}))},[]);return h(f({},t),{clearEvents:n,dismissQuestion:r})}import{useEffect as sc,useReducer as lc}from"react";var ac={isAnnotating:!1,activeTool:"inspector",activeColor:"#ff0000",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function cr(){return Math.random().toString(36).substring(2,9)}function Zs(e){return e.status?e:e.captured?h(f({},e),{status:"in_flight"}):h(f({},e),{status:"pending"})}function Qt(e){return h(f({},e),{undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}],redoStack:[]})}function cc(e,t){return h(f({},e),{isAnnotating:t})}function dc(e,t){return h(f({},e),{activeTool:t,inspectedElement:null})}function uc(e,t){return h(f({},e),{activeColor:t})}function pc(e,t){return h(f({},e),{strokeWidth:t})}function fc(e,t){return h(f({},e),{currentPath:[t]})}function gc(e,t){return h(f({},e),{currentPath:[...e.currentPath,t]})}function mc(e){return h(f({},e),{currentPath:[]})}function hc(e,t){if(e.currentPath.length<2&&e.activeTool!=="text")return h(f({},e),{currentPath:[]});let n={id:cr(),type:e.activeTool,points:e.currentPath,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",groupId:t==null?void 0:t.groupId,elements:t==null?void 0:t.elements},r=Qt(e);return h(f({},r),{annotations:[...e.annotations,n],currentPath:[]})}function yc(e,t){var o;let n=f({id:(o=t.id)!=null?o:cr(),type:"text",points:[t.point],text:t.text,fontSize:t.fontSize||12,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",groupId:t.groupId,linkedSelector:t.linkedSelector,linkedAnchor:t.linkedAnchor,elements:t.elements},t.imageCount?{imageCount:t.imageCount}:{}),r=t.groupId?e:Qt(e);return h(f({},r),{annotations:[...e.annotations,n]})}function bc(e,t){let n=Qt(e);return h(f({},n),{annotations:e.annotations.map(r=>r.id===t.id?f(h(f({},r),{text:t.text}),t.imageCount!=null?{imageCount:t.imageCount}:{}):r)})}function xc(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 vc(e,t){let n=Qt(e),r=e.annotations.find(i=>i.id===t.id),o=r==null?void 0:r.groupId;return h(f({},n),{annotations:e.annotations.filter(i=>i.id!==t.id&&!(o&&i.groupId===o))})}function Sc(e,t){let n=t.saveUndo?Qt(e):e,r=e.annotations.find(i=>i.id===t.id),o=r==null?void 0:r.groupId;return h(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 h(f({},i),{points:i.points.map(c=>({x:c.x+l,y:c.y+a}))})})})}function wc(e,t){let n=t.saveUndo?Qt(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),c=r.points[0],d=r.points[r.points.length-1],u=Math.min(c.x,d.x),p=Math.max(c.y,d.y);o=l-u,i=a-p}return h(f({},n),{annotations:e.annotations.map(s=>s.id===t.id?h(f({},s),{points:t.points}):r.groupId&&s.groupId===r.groupId&&s.type==="text"?h(f({},s),{points:s.points.map(l=>({x:l.x+o,y:l.y+i}))}):s)})}function Ec(e,t){let n=Qt(e);return h(f({},n),{annotations:[...e.annotations,...t.annotations.map(Zs)]})}function Cc(e,t){let n=new Set,r=[];for(let o of t.annotations)n.has(o.id)||(n.add(o.id),r.push(Zs(o)));return h(f({},e),{annotations:r})}function kc(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 Mc(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 Tc(e,t){let{id:n,addToSelection:r}=t;if(n===null)return h(f({},e),{selectedAnnotationIds:[],lastSelectedId:null});if(r)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 Ic(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 h(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:h(f({},r),{color:t.color})})})}function Rc(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 Lc(e){return h(f({},e),{annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]})}function Ac(e,t){return h(f({},e),{inspectedElement:t})}function Pc(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=Qt(e),v=g.styleModifications.map((S,y)=>y===l?h(f({},S),{changes:[{property:o,original:i,modified:s}],captured:!1}):S);return h(f({},g),{styleModifications:v})}let c=a.changes.findIndex(g=>g.property===o),d,u=e;if(c>=0){let g=a.changes[c];s===g.original?d=a.changes.filter((v,S)=>S!==c):d=a.changes.map((v,S)=>S===c?h(f({},v),{modified:s}):v)}else{if(i===s)return e;u=Qt(e),d=[...a.changes,{property:o,original:i,modified:s}]}if(d.length===0)return h(f({},u),{styleModifications:u.styleModifications.filter((g,v)=>v!==l)});let p=u.styleModifications.map((g,v)=>v===l?h(f({},g),{changes:d}):g);return h(f({},u),{styleModifications:p})}else{let a=Qt(e),c={selector:n,element:r,changes:[{property:o,original:i,modified:s}]};return h(f({},a),{styleModifications:[...a.styleModifications,c]})}}function Bc(e,t){let{selector:n,durableSelector:r,element:o,changes:i}=t,s=i.filter(c=>c.original!==c.modified);if(s.length===0)return e;let l=Qt(e),a=l.styleModifications.findIndex(c=>c.selector===n);if(a>=0){let c=l.styleModifications[a],d=c.captured?[]:[...c.changes];for(let u of s){let p=d.findIndex(g=>g.property===u.property);p>=0?u.modified===d[p].original?d=d.filter((g,v)=>v!==p):d=d.map((g,v)=>v===p?h(f({},g),{modified:u.modified}):g):d.push(u)}return d.length===0?h(f({},l),{styleModifications:l.styleModifications.filter((u,p)=>p!==a)}):h(f({},l),{styleModifications:l.styleModifications.map((u,p)=>p===a?h(f({},u),{changes:d,captured:!1}):u)})}else return h(f({},l),{styleModifications:[...l.styleModifications,{selector:n,durableSelector:r,element:o,changes:s}]})}function Oc(e,t){let{selector:n,property:r}=t,o=Qt(e),i=o.styleModifications.map(s=>s.selector!==n?s:h(f({},s),{changes:s.changes.filter(l=>l.property!==r)})).filter(s=>s.changes.length>0);return h(f({},o),{styleModifications:i})}function Dc(e){if(e.styleModifications.length===0)return h(f({},e),{inspectedElement:null});let t=Qt(e);return h(f({},t),{styleModifications:[],inspectedElement:null})}function Nc(e,t){return h(f({},e),{styleModifications:t})}function Fc(e,t){let{updates:n}=t,r=new Map(n.map(o=>[o.id,o]));return h(f({},e),{annotations:e.annotations.map(o=>{let i=r.get(o.id);return i?f(h(f({},o),{points:[i.point,...o.points.slice(1)]}),i.linkedAnchor?{linkedAnchor:i.linkedAnchor}:{}):o})})}function Hc(e,t){let n=new Set(t.ids);return h(f({},e),{annotations:e.annotations.map(r=>n.has(r.id)?h(f({},r),{status:t.status}):r)})}function _c(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 h(f({},e),{annotations:e.annotations.map(o=>n.has(o.id)||o.groupId&&r.has(o.groupId)?h(f({},o),{threadId:t.threadId}):o)})}function zc(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 h(f({},e),{annotations:e.annotations.map(o=>n.has(o.id)||o.groupId&&r.has(o.groupId)?h(f({},o),{status:"waiting_input",question:t.question,threadId:t.threadId}):o)})}function $c(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 h(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?h(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 Wc(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)),c=e.styleModifications.filter(p=>!i.has(p.selector));if(a.length===e.annotations.length&&c.length===e.styleModifications.length)return e;let d=e.selectedAnnotationIds.filter(p=>!s.has(p)),u=e.inspectedElement&&i.has(e.inspectedElement.info.selector)?null:e.inspectedElement;return h(f({},e),{annotations:a,styleModifications:c,selectedAnnotationIds:d,lastSelectedId:d.length>0?d[d.length-1]:null,inspectedElement:u})}function Yc(e,t){let n=e.spacingTokenChanges.findIndex(r=>r.tokenPath===t.tokenPath);return n>=0?h(f({},e),{spacingTokenChanges:e.spacingTokenChanges.map((r,o)=>o===n?t:r)}):h(f({},e),{spacingTokenChanges:[...e.spacingTokenChanges,t]})}function jc(e,t){return h(f({},e),{spacingTokenChanges:t})}function Gc(e,t){let n=Qt(e),r=e.spacingTokenMods.findIndex(i=>i.tokenPath===t.tokenPath),o;if(r>=0){let i=e.spacingTokenMods[r],s=h(f({},t),{originalValue:i.originalValue,originalPx:i.originalPx});o=e.spacingTokenMods.map((l,a)=>a===r?s:l)}else o=[...e.spacingTokenMods,t];return h(f({},n),{spacingTokenMods:o})}function Vc(e,t){let n=Qt(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,c)=>c===r?s:a):l=[...e.spacingTokenMods,s],h(f({},n),{spacingTokenMods:l})}var Uc={SET_ANNOTATING:cc,SET_TOOL:dc,SET_COLOR:uc,SET_STROKE_WIDTH:pc,START_PATH:fc,CONTINUE_PATH:gc,CANCEL_PATH:mc,FINISH_PATH:hc,ADD_TEXT:yc,UPDATE_TEXT:bc,UPDATE_TEXT_SIZE:xc,DELETE_ANNOTATION:vc,MOVE_ANNOTATION:Sc,RESIZE_ANNOTATION:wc,PASTE_ANNOTATIONS:Ec,RESTORE_ANNOTATIONS:Cc,UNDO:kc,REDO:Mc,SELECT_ANNOTATION:Tc,UPDATE_ANNOTATION_COLOR:Ic,MARK_CAPTURED:Rc,CLEAR:Lc,SELECT_ELEMENT:Ac,MODIFY_STYLE:Pc,MODIFY_STYLES_BATCH:Bc,CLEAR_STYLE:Oc,CLEAR_ALL_STYLES:Dc,RESTORE_STYLE_MODIFICATIONS:Nc,UPDATE_LINKED_POSITIONS:Fc,CLEANUP_ORPHANED:Wc,SET_ANNOTATION_STATUS:Hc,SET_ANNOTATION_THREAD:_c,SET_ANNOTATION_QUESTION:zc,APPLY_RESOLUTIONS:$c,ADD_SPACING_TOKEN_CHANGE:Yc,RESTORE_SPACING_TOKEN_CHANGES:jc,MODIFY_SPACING_TOKEN:Gc,DELETE_SPACING_TOKEN:Vc};function Jc(e,t){let n=Uc[t.type];return n?n(e,t.payload):e}function Qs(){let[e,t]=lc(Jc,ac);return sc(()=>{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{domToCanvas as Xc}from"modern-screenshot";function Gr(e){let t=document.createElement("canvas").getContext("2d");return t?(t.fillStyle=e,t.fillStyle):"#888888"}function Vr(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 c=a.find(u=>u.type!=="text"),d=a.find(u=>u.type==="text");if(c){let u=c.linkedSelector||(d==null?void 0:d.linkedSelector),p=(d==null?void 0:d.imageCount)||c.imageCount;s.push(f(h(f({id:c.id,type:c.type,instruction:d==null?void 0:d.text},u?{linkedSelector:u}:{}),{elements:c.elements||[]}),p?{imageCount:p}:{}))}}for(let l of i)s.push(f(h(f({id:l.id,type:l.type,instruction:l.type==="text"?l.text:void 0},l.linkedSelector?{linkedSelector:l.linkedSelector}:{}),{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 Kc(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 qc(e,t){if(e.length===0)return[];let n=e.map(d=>({annotation:d,bounds:Kc(d)})).filter(d=>d.bounds!==null);if(n.length===0)return[];n.sort((d,u)=>d.bounds.minY-u.bounds.minY);let r=Math.min(...n.map(d=>d.bounds.minY)),o=Math.max(...n.map(d=>d.bounds.maxY));if(o-r<=t){let d=(r+o)/2,u=Math.max(0,d-t/2);return[{top:u,bottom:u+t,annotations:e}]}let i=[],s=50,l=Math.max(0,r-s),a=[],c=l;for(let{annotation:d,bounds:u}of n){let p=u.maxY+s;if(p-l<=t)a.push(d),c=Math.max(c,p);else{if(a.length>0){let g=(l+c)/2,v=Math.max(0,g-t/2);i.push({top:v,bottom:v+t,annotations:a})}l=Math.max(0,u.minY-s),a=[d],c=u.maxY+s}}if(a.length>0){let d=(l+c)/2,u=Math.max(0,d-t/2);i.push({top:u,bottom:u+t,annotations:a})}return i}function Zc(e,t,n,r){e.save(),e.scale(r,r);for(let o of t){let i=o.points.map(s=>({x:s.x,y:s.y-n}));switch(e.strokeStyle=o.color,e.fillStyle=o.color,e.lineWidth=o.strokeWidth,e.lineCap="round",e.lineJoin="round",o.type){case"freehand":if(i.length<2)break;e.beginPath(),e.moveTo(i[0].x,i[0].y);for(let s=1;s<i.length;s++)e.lineTo(i[s].x,i[s].y);e.stroke();break;case"line":if(i.length<2)break;e.beginPath(),e.moveTo(i[0].x,i[0].y),e.lineTo(i[i.length-1].x,i[i.length-1].y),e.stroke();break;case"rectangle":{if(i.length<2)break;let s=i[0],l=i[i.length-1],a=Math.min(s.x,l.x),c=Math.min(s.y,l.y),d=Math.abs(l.x-s.x),u=Math.abs(l.y-s.y);e.strokeRect(a,c,d,u);break}case"circle":{if(i.length<2)break;let s=i[0],l=i[i.length-1],a=(s.x+l.x)/2,c=(s.y+l.y)/2,d=Math.abs(l.x-s.x)/2,u=Math.abs(l.y-s.y)/2;e.beginPath(),e.ellipse(a,c,d,u,0,0,Math.PI*2),e.stroke();break}case"text":{if(!o.text||i.length<1)break;let s=i[0],l=o.fontSize||16;e.font=`${l}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`,e.fillStyle=o.color;let c=(o.imageCount&&o.imageCount>0?`[${o.imageCount} image${o.imageCount>1?"s":""}] ${o.text}`:o.text).split(`
3
+ `),d=l*1.2,u=4,p=0;for(let g of c)p=Math.max(p,e.measureText(g).width);e.fillRect(s.x-u,s.y-u,p+u*2,c.length*d+u*2),e.fillStyle="#ffffff",c.forEach((g,v)=>{e.fillText(g,s.x,s.y+l+v*d)});break}}}e.restore()}async function Ur(e,t,n=[]){try{let r=window.devicePixelRatio||1,o=window.innerWidth,i=window.innerHeight,s=n.filter(c=>{var d;return((d=c.status)!=null?d:"pending")==="pending"});console.log("[Screenshot] Starting capture with",s.length,"active annotations (filtered",n.length-s.length,"captured)");let l=qc(s,i);if(l.length===0){let c=await el(e,[],window.scrollY,o,i,r);return c?[c]:[]}let a=[];for(let c=0;c<l.length;c++){let d=l[c],u=await el(e,d.annotations,d.top,o,i,r);u?a.push(u):console.warn(`[Screenshot] Region ${c+1} failed to capture`)}return console.log("[Screenshot] Capture complete"),a}catch(r){return console.error("[Screenshot] Capture failed:",r),[]}}async function el(e,t,n,r,o,i){try{let s=await Xc(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)`}}),l=document.createElement("canvas");l.width=r*i,l.height=o*i;let a=l.getContext("2d");return a?(a.drawImage(s,0,0,r*i,o*i,0,0,r*i,o*i),Zc(a,t,n,i),new Promise(c=>{l.toBlob(d=>c(d),"image/png")})):null}catch(s){return console.error("Region capture failed:",s),null}}async function Jr(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,c)=>{let d=new Image;d.onload=()=>a(d),d.onerror=c,d.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 tl(e,t,n){try{let r=Array.isArray(e)?e:[e];if(r.length===0)return!1;let o=await Jr(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(c=>{var d;return((d=c.status)!=null?d:"pending")==="pending"}):[];if(a.length>0||l){let c=Vr(a,n||[]),d=new Blob([JSON.stringify(c,null,2)],{type:"text/plain"});i["text/plain"]=d}}return await navigator.clipboard.write([new ClipboardItem(i)]),!0}catch(r){return console.warn("Clipboard write failed:",r),!1}}import{useCallback as At,useEffect as Gt,useMemo as _i,useRef as Ct,useState as lt}from"react";import{useCallback as yo,useRef as ed}from"react";function Xr(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,c=Math.abs(i.y-o.y)/2;e.beginPath(),e.strokeStyle=n,e.lineWidth=r,e.ellipse(s,l,a,c,0,0,Math.PI*2),e.stroke()}function Kr(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 c=(l.x+a.x)/2,d=(l.y+a.y)/2;e.quadraticCurveTo(l.x,l.y,c,d)}e.lineTo(i.x,i.y),e.stroke()}}function qr(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 Zr(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),c=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,c)}var zt='"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';function Qc(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 ho(e){let t=window.innerWidth-e-16;if(t<400)return Math.max(60,t)}function Kn(e,t,n){let r=[];for(let o of t)r.push(...Qc(e,o,n));return r}function nl(e,t,n,r,o=12,i,s){if(!n)return;let l=o*1.4,a=n.split(`
4
+ `),c=i!==void 0?[i+". "+(a[0]||""),...a.slice(1)]:a;e.font=`${o}px ${zt}`,e.textBaseline="middle";let d=s!==void 0?Math.min(400,Math.max(60,window.innerWidth-s-16)):400,u=Kn(e,c,d),p=Math.min(d,Math.max(...u.map(w=>e.measureText(w).width))),g=u.length*l,v=c.length*l,S=g-v,y=t.y-S;e.fillStyle=r,e.fillRect(t.x-4,y-4,p+8,g+8),e.fillStyle="#ffffff",u.forEach((w,O)=>{e.fillText(w,t.x,y+O*l+l/2)})}var ol=11,Qr=4,td=`600 ${ol}px system-ui, -apple-system, sans-serif`;function ei(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=td;let a=e.measureText(s).width+Qr*2,c=ol+Qr*2,d=t-a/2,u=n+i/2+2;e.fillStyle=o,e.fillRect(d,u,a,c),e.fillStyle="#ffffff",e.textBaseline="middle",e.fillText(s,d+Qr,u+c/2)}function od(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 rl(){let e=ed(null),t=yo(()=>{let l=e.current;if(!l)return;let a=l.getContext("2d");a&&a.clearRect(0,0,l.width,l.height)},[]),n=yo((l,a,c)=>{var v;let d=e.current;if(!d)return;let u=d.getContext("2d");if(!u)return;let g=((v=l.status)!=null?v:l.captured?"in_flight":"pending")==="pending"||c?l.color:"#999999";switch(l.type){case"freehand":Kr(u,l.points,g,l.strokeWidth);break;case"line":qr(u,l.points,g,l.strokeWidth);break;case"rectangle":Zr(u,l.points,g,l.strokeWidth);break;case"circle":Xr(u,l.points,g,l.strokeWidth);break;case"text":l.text&&l.points[0]&&nl(u,l.points[0],l.text,g,l.fontSize,a,l.points[0].x);break}},[]),r=yo((l,a,c,d)=>{let u=e.current;if(!u||l.length<2)return;let p=u.getContext("2d");if(p)switch(a){case"freehand":Kr(p,l,c,d);break;case"line":qr(p,l,c,d);break;case"rectangle":Zr(p,l,c,d);break;case"circle":Xr(p,l,c,d);break}},[]),o=yo((l,a)=>{let c=e.current;if(!c||l.points.length<2)return;let d=c.getContext("2d");if(d){if(d.fillStyle="#ffffff",d.strokeStyle=l.color,d.lineWidth=1.5,l.type==="line"){let u=l.points[0],p=l.points[l.points.length-1];[u,p].forEach(g=>{d.beginPath(),d.arc(g.x,g.y,a/2,0,Math.PI*2),d.fill(),d.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),v=Math.max(u.x,p.x),S=Math.min(u.y,p.y),y=Math.max(u.y,p.y),w=(g+v)/2,O=(S+y)/2;[{x:w,y:S},{x:w,y},{x:g,y:O},{x:v,y:O}].forEach(k=>{d.beginPath(),d.rect(k.x-a/2,k.y-a/2,a,a),d.fill(),d.stroke()});return}if(l.type==="rectangle"||l.type==="freehand"){let u,p,g,v;if(l.type==="freehand")u=Math.min(...l.points.map(y=>y.x)),p=Math.max(...l.points.map(y=>y.x)),g=Math.min(...l.points.map(y=>y.y)),v=Math.max(...l.points.map(y=>y.y));else{let y=l.points[0],w=l.points[l.points.length-1];u=Math.min(y.x,w.x),p=Math.max(y.x,w.x),g=Math.min(y.y,w.y),v=Math.max(y.y,w.y)}[{x:u,y:g},{x:p,y:g},{x:u,y:v},{x:p,y:v}].forEach(y=>{d.beginPath(),d.rect(y.x-a/2,y.y-a/2,a,a),d.fill(),d.stroke()})}}},[]),i=yo((l,a,c,d,u,p,g,v=0,S=0,y,w)=>{var O;if(t(),l.forEach(R=>{var D;let k=h(f({},R),{points:ei(R.points,v,S)}),E=y==null?void 0:y.get(R.id),A=(D=w==null?void 0:w.has(R.id))!=null?D:!1;n(k,E,A)}),a.length>0){let R=ei(a,v,S);r(R,c,d,u)}if(p&&p.length>0&&g){let R=e.current,k=R==null?void 0:R.getContext("2d");for(let E of p){let A=l.find(D=>D.id===E);if(A){let D=h(f({},A),{points:ei(A.points,v,S)});if(o(D,g),k&&A.type!=="text"&&y&&!(A.groupId&&l.some($=>$.groupId===A.groupId&&$.type==="text"))){let $=y.get(A.id);if($!==void 0){let C=od(D,g);if(C){let te=((O=A.status)!=null?O:A.captured?"in_flight":"pending")==="pending"?A.color:"#999999";nd(k,C.x,C.y,$,te,g)}}}}}}},[t,n,r,o]),s=yo(()=>{let l=e.current;if(!l)return;let a=window.devicePixelRatio||1;l.width=window.innerWidth*a,l.height=window.innerHeight*a;let c=l.getContext("2d");c&&c.scale(a,a)},[]);return{canvasRef:e,clearCanvas:t,drawAnnotation:n,drawCurrentPath:r,redrawAll:i,resizeCanvas:s}}import{useEffect as rd,useRef as id}from"react";function il(){let e=id({shift:!1,cmd:!1});return rd(()=>{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 sd}from"react";function sl(e,t,n,r,o){sd(()=>{let i=s=>{if(e){if(e.linkedSelector)return;s.preventDefault(),s.stopPropagation();let a=s.deltaY>0?-2:2;t(c=>c?h(f({},c),{fontSize:Math.max(12,Math.min(72,c.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,c=s.deltaY>0?-2:2;o({type:"UPDATE_TEXT_SIZE",payload:{id:n,fontSize:a+c}})}};return window.addEventListener("wheel",i,{passive:!1}),()=>{window.removeEventListener("wheel",i)}},[n,e,r,o,t])}import{useCallback as vl,useEffect as xr,useRef as Sl,useState as Vo}from"react";function dr(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 ti(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 ur(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 ll(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 sn(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 Xt(e){try{return document.querySelector(e)}catch(t){return null}}function pr(e,t=0){var a;let n=ti(e);if(n.length===0)return null;let r=n.map(c=>c.name),o=n.length-1,i=Math.max(0,Math.min(n.length-1,o-t)),s=n[i],l=(a=ur(s.fiber))!=null?a:e;return{name:s.name,path:r,depthIndex:i,rootElement:l}}function al(e,t){var i,s;let n=ti(e),r=t.toLowerCase(),o=-1;for(let l=n.length-1;l>=0;l--){let a=n[l].name;if(a===t){let c=(i=ur(n[l].fiber))!=null?i:e;return{name:t,path:n.map(d=>d.name),depthIndex:l,rootElement:c}}if(o===-1){let c=a.toLowerCase();(c.length>=4&&r.includes(c)||r.length>=4&&c.includes(r))&&(o=l)}}if(o>=0){let l=(s=ur(n[o].fiber))!=null?s:e;return{name:t,path:n.map(a=>a.name),depthIndex:o,rootElement:l}}return null}function bo(e){let t=xo(),n=[],r=new Set,o=t.currentNode;for(;o=t.nextNode();){let i=al(o,e);i&&!r.has(i.rootElement)&&(r.add(i.rootElement),n.push(i))}return n}function ni(e){let t=new Map;if(e.size===0)return t;let n=new Set(e),r=xo(),o=new Set,i=r.currentNode;for(;(i=r.nextNode())&&n.size>0;)for(let s of n){let l=al(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 xo(){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 en(e){let t={selector:ll(e),tagName:e.tagName.toLowerCase()};e.id&&(t.id=e.id),e.classList.length>0&&(t.className=Array.from(e.classList).join(" "));let n=cl(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=dr(e);o&&(t.reactComponent=o.name);let i=ld(e);return i&&(t.context=i),t}function cl(e){let t="";for(let n of e.childNodes)n.nodeType===Node.TEXT_NODE&&(t+=n.textContent||"");return t.trim()}function qn(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 ld(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 dl(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 c=qn(l,a);c&&!t.has(c)&&(t.add(c),n.push(en(c)))}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 dl({minX:Math.min(...t),minY:Math.min(...n),maxX:Math.max(...t),maxY:Math.max(...n)})}function Lt(e,t){return e.style.getPropertyValue(t)!==""}function ad(e,t=30){if(e<=0)return[];let n=[],r=xo(),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);!Lt(s,"padding-top")&&Math.abs((parseFloat(a.paddingTop)||0)-e)<o&&n.push({element:s,property:"padding-top"}),!Lt(s,"padding-bottom")&&Math.abs((parseFloat(a.paddingBottom)||0)-e)<o&&n.length<t&&n.push({element:s,property:"padding-bottom"}),!Lt(s,"padding-left")&&Math.abs((parseFloat(a.paddingLeft)||0)-e)<o&&n.length<t&&n.push({element:s,property:"padding-left"}),!Lt(s,"padding-right")&&Math.abs((parseFloat(a.paddingRight)||0)-e)<o&&n.length<t&&n.push({element:s,property:"padding-right"}),!Lt(s,"margin-top")&&Math.abs((parseFloat(a.marginTop)||0)-e)<o&&n.length<t&&n.push({element:s,property:"margin-top"}),!Lt(s,"margin-bottom")&&Math.abs((parseFloat(a.marginBottom)||0)-e)<o&&n.length<t&&n.push({element:s,property:"margin-bottom"}),!Lt(s,"margin-left")&&Math.abs((parseFloat(a.marginLeft)||0)-e)<o&&n.length<t&&n.push({element:s,property:"margin-left"}),!Lt(s,"margin-right")&&Math.abs((parseFloat(a.marginRight)||0)-e)<o&&n.length<t&&n.push({element:s,property:"margin-right"});let c=a.display;if((c.includes("flex")||c.includes("grid"))&&n.length<t){let d=Lt(s,"gap"),u=parseFloat(a.gap)||0,p=parseFloat(a.rowGap)||0,g=parseFloat(a.columnGap)||0;!d&&Math.abs(u-e)<o?n.push({element:s,property:"gap"}):!Lt(s,"row-gap")&&Math.abs(p-e)<o?n.push({element:s,property:"row-gap"}):!Lt(s,"column-gap")&&Math.abs(g-e)<o&&n.push({element:s,property:"column-gap"})}}return n}function ri(e,t=30){if(e<=0)return[];let n=[],r=xo(),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),c=parseFloat(a.borderTopWidth)||0,d=parseFloat(a.borderRightWidth)||0,u=parseFloat(a.borderBottomWidth)||0,p=parseFloat(a.borderLeftWidth)||0,g=s.clientWidth,v=s.clientHeight,S=parseFloat(a.paddingTop)||0;!Lt(s,"padding-top")&&Math.abs(S-e)<o&&n.push({x:l.left+p,y:l.top+c,width:g,height:e,direction:"vertical",property:"padding-top"});let y=parseFloat(a.paddingBottom)||0;!Lt(s,"padding-bottom")&&Math.abs(y-e)<o&&n.length<t&&n.push({x:l.left+p,y:l.top+c+v-e,width:g,height:e,direction:"vertical",property:"padding-bottom"});let w=parseFloat(a.paddingLeft)||0;!Lt(s,"padding-left")&&Math.abs(w-e)<o&&n.length<t&&n.push({x:l.left+p,y:l.top+c,width:e,height:v,direction:"horizontal",property:"padding-left"});let O=parseFloat(a.paddingRight)||0;!Lt(s,"padding-right")&&Math.abs(O-e)<o&&n.length<t&&n.push({x:l.left+p+g-e,y:l.top+c,width:e,height:v,direction:"horizontal",property:"padding-right"});let R=parseFloat(a.marginTop)||0;!Lt(s,"margin-top")&&Math.abs(R-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 k=parseFloat(a.marginBottom)||0;!Lt(s,"margin-bottom")&&Math.abs(k-e)<o&&n.length<t&&n.push({x:l.left,y:l.bottom,width:l.width,height:e,direction:"vertical",property:"margin-bottom"});let E=parseFloat(a.marginLeft)||0;!Lt(s,"margin-left")&&Math.abs(E-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 A=parseFloat(a.marginRight)||0;!Lt(s,"margin-right")&&Math.abs(A-e)<o&&n.length<t&&n.push({x:l.right,y:l.top,width:e,height:l.height,direction:"horizontal",property:"margin-right"});let D=a.display;if((D.includes("flex")||D.includes("grid"))&&n.length<t&&!Lt(s,"gap")){let $=Array.from(s.children).filter(C=>{let G=getComputedStyle(C);return G.display!=="none"&&G.position!=="absolute"&&G.position!=="fixed"});if($.length>=2)for(let C=0;C<$.length-1&&n.length<t;C++){let G=$[C].getBoundingClientRect(),te=$[C+1].getBoundingClientRect(),re=te.top-G.bottom;Math.abs(re-e)<o&&re>.5&&n.push({x:Math.min(G.left,te.left),y:G.bottom,width:Math.max(G.right,te.right)-Math.min(G.left,te.left),height:re,direction:"vertical",property:"gap"});let Se=te.left-G.right;Math.abs(Se-e)<o&&Se>.5&&n.push({x:G.right,y:Math.min(G.top,te.top),width:Se,height:Math.max(G.bottom,te.bottom)-Math.min(G.top,te.top),direction:"horizontal",property:"gap"})}}}return n}function fr(e){return typeof e=="string"?{value:e}:e}var pl={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 ul(e,t){let n=pl[t];return n?n.includes(e):!1}function cd(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 dd(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 ii(e,t=30){let n=parseFloat(e.value);if(isNaN(n)||n<=0)return[];if(e.bindings&&e.bindings.length>0){let o=[],i=xo(),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 c=l.className;if(typeof c=="string")for(let d of e.bindings){if(!cd(c,d))continue;let u=dd(d);if(u&&!(e.property&&!ul(u,e.property))){o.push({element:l,property:u});break}}}return o}let r=ad(n,t*2);return e.property?r.filter(o=>ul(o.property,e.property)).slice(0,t):r.slice(0,t)}function si(e,t=30){let n=ii(e,t),r=[];for(let o of n){let i=o.element,s=i.getBoundingClientRect(),l=getComputedStyle(i),a=parseFloat(l.borderTopWidth)||0,c=parseFloat(l.borderRightWidth)||0,d=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+d,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+d,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+d,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+d+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(v=>{let S=getComputedStyle(v);return S.display!=="none"&&S.position!=="absolute"&&S.position!=="fixed"});for(let v=0;v<g.length-1&&r.length<t;v++){let S=g[v].getBoundingClientRect(),y=g[v+1].getBoundingClientRect(),w=y.top-S.bottom;w>.5&&r.push({x:Math.min(S.left,y.left),y:S.bottom,width:Math.max(S.right,y.right)-Math.min(S.left,y.left),height:w,direction:"vertical",property:"gap"});let O=y.left-S.right;O>.5&&r.push({x:S.right,y:Math.min(S.top,y.top),width:O,height:Math.max(S.bottom,y.bottom)-Math.min(S.top,y.top),direction:"horizontal",property:"gap"})}break}}}return r}function fl(e,t){let n=new Set,r=zo(t);for(let o of e){let i=ml[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 c of s.split(/\s+/)){let d=c.lastIndexOf(":"),u=d>=0?c.slice(d+1):c;if(u===a){n.add(u);break}}}}return[...n]}function gl(e){let t=new Set;for(let n of e)for(let[r,o]of Object.entries(pl))if(o.includes(n.property)){t.add(r);break}if(t.size===1)return[...t][0]}function li(e,t,n){if(t===n)return e;let r=zo(t),o=zo(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 ud={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 zo(e){var t;return(t=ud[e])!=null?t:`[${e}px]`}var ml={"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 pd(e,t,n,r){let o=ml[t];if(!o)return null;let i=zo(n);for(let s of o){let l=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+s+"-(?:"+fd(i)+"|\\["+n+"px\\]))(?:\\s|$)"),a=e.match(l);if(a!=null&&a[1]){let c=zo(r),d=a[1].lastIndexOf(":"),u=d>=0?a[1].slice(0,d+1):"";return{matched:a[1],suggested:`${u}${s}-${c}`}}}return null}function fd(e){return e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function hl(e,t,n){let r=new Set,o=[];for(let i of e){let s=sn(i.element),l=`${s}::${i.property}`;if(r.has(l))continue;r.add(l);let a=dr(i.element),c=i.element.className||"",d=pd(c,i.property,t,n);o.push({selector:s,reactComponent:a==null?void 0:a.name,className:c,property:i.property,matchedClass:d==null?void 0:d.matched,suggestedClass:d==null?void 0:d.suggested})}return o}function $o(e,t){return window.getComputedStyle(e).getPropertyValue(t)}function ai(e,t){if(e instanceof HTMLElement){let r=e.style.getPropertyValue(t);if(r)return r}let n=gd(e,t);return n&&n.includes("var(")?n:$o(e,t)}function gd(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 gr(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 mr(e){let t=window.getComputedStyle(e).display;return t==="flex"||t==="inline-flex"||t==="grid"||t==="inline-grid"}function Wo(e){let t=window.getComputedStyle(e);return{row:parseFloat(t.rowGap)||0,column:parseFloat(t.columnGap)||0}}function md(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 Zn(e){let t=Array.from(e.children).filter(a=>{if(!(a instanceof HTMLElement))return!1;let c=window.getComputedStyle(a);return c.display!=="none"&&c.position!=="absolute"&&c.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 c=t[a].getBoundingClientRect(),d=t[a+1].getBoundingClientRect();if(d.left>c.right+.5&&n.push({axis:"column",x:c.right,y:r.top,w:d.left-c.right,h:r.height}),d.top>c.bottom+.5&&n.push({axis:"row",x:r.left,y:c.bottom,w:r.width,h:d.top-c.bottom}),!(d.left>c.right+.5)&&!(d.top>c.bottom+.5))if(s){let u=(c.bottom+d.top)/2;n.push({axis:"row",x:r.left,y:u-l/2,w:r.width,h:l})}else{let u=(c.right+d.left)/2;n.push({axis:"column",x:u-l/2,y:r.top,w:l,h:r.height})}}return md(n)}function ci(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 vo(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 Qn(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 di(e){for(let t of e.childNodes)if(t.nodeType===Node.TEXT_NODE&&(t.textContent||"").trim().length>0)return!0;return!1}function So(e){var d,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=(d=p.textContent)==null?void 0:d.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),c=(a-r.height)/2;return new DOMRect(r.x,r.y-c,r.width,a)}function Yo(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 _e(e,t,n){e instanceof HTMLElement&&e.style.setProperty(t,n,"important")}function ui(e,t,n){e instanceof HTMLElement&&e.style.removeProperty(t)}function hr(e){var t;for(let n of e){let r=Xt(n.selector);if(!r&&n.durableSelector&&(r=Xt(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)_e(r,o.property,o.modified)}}function pi(e,t){let n=Xt(e);if(!n)return;let r=t.find(o=>o.selector===e);if(r)for(let o of r.changes)ui(n,o.property,o.original)}function yr(e){for(let t of e){let n=Xt(t.selector);if(n)for(let r of t.changes)ui(n,r.property,r.original)}}function bl(e,t,n,r){if(e)for(let o of e){if(o instanceof CSSGroupingRule){bl(o.cssRules,t,n,r);continue}if(o instanceof CSSStyleRule){let i=o.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&hd(o.style,t,n,r)}}}function hd(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();xl(s)&&r.push({name:i,value:s,usage:`var(${i})`})}}}var br=null,yd=5e3;function fi(){if(br&&Date.now()-br.timestamp<yd)return br.variables;let e=[],t=new Set,n=getComputedStyle(document.documentElement);try{for(let i of document.styleSheets)try{bl(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();xl(l)&&e.push({name:s,value:l,usage:`var(${s})`})}}let o=e.sort((i,s)=>i.name.localeCompare(s.name));return br={variables:o,timestamp:Date.now()},o}function xl(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 jo(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 Go(e,t){if(!e)return null;let n=yl(e);if(!n)return null;for(let r of t){let o=yl(r.value);if(o&&n===o)return r}return null}function yl(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 eo,jsx as Ue,jsxs as mn}from"react/jsx-runtime";var to=22,zn=12,bd=3,xd=250,gi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],vd=3e3;function Sd(i){var s=i,{left:e,top:t,style:n,children:r}=s,o=_n(s,["left","top","style","children"]);let l=e+zn,a=t+zn;return Ue("div",h(f({"data-devtools":"badge-hit-area"},o),{style:f({position:"fixed",left:e,top:t,padding:zn},n),children:Ue("div",{style:{transform:`translate(min(0px, calc(100vw - ${l}px - 100%)), min(0px, calc(100vh - ${a}px - 100%)))`},children:r})}))}function wl({annotations:e,supersededAnnotations:t,inFlightIds:n,scrollX:r,scrollY:o,annotationGroupMap:i,onViewThread:s,onSelectAnnotation:l,canvasRef:a}){var y,w,O,R;let[c,d]=Vo(0),[u,p]=Vo(()=>Math.floor(Math.random()*gi.length)),g=!!(n&&n.size>0);xr(()=>{if(!g)return;let k=setInterval(()=>{d(A=>(A+1)%bd)},xd),E=setInterval(()=>{p(A=>(A+1)%gi.length)},vd);return()=>{clearInterval(k),clearInterval(E)}},[g]);let v=[];for(let k of e){if(k.type!=="text"||!k.text||!k.points[0]||t.has(k))continue;let E=k.groupId?e.filter(xe=>xe.groupId===k.groupId):[k],A=!!(n&&(n.has(k.id)||E.some(xe=>n.has(xe.id)))),D=(y=k.status)!=null?y:"pending",K=E.some(xe=>xe.status==="resolved"||xe.status==="needs_review"),$=E.some(xe=>xe.threadId);if(!A&&D!=="resolved"&&D!=="needs_review"&&!K&&!$)continue;let C=k.threadId||((w=E.find(xe=>xe.threadId))==null?void 0:w.threadId),G=D==="needs_review"||E.some(xe=>xe.status==="needs_review"),te=E.reduce((xe,se)=>{var Ve;return xe+((Ve=se.replyCount)!=null?Ve:0)},0),re=k.points[0],Se=k.fontSize||12,Te=Se*1.4,fe=k.text.split(`
5
+ `),Oe=i.get(k.id),ze=Oe!==void 0?[Oe+". "+(fe[0]||""),...fe.slice(1)]:fe,Ce=(R=(O=a==null?void 0:a.current)==null?void 0:O.getContext("2d"))!=null?R:document.createElement("canvas").getContext("2d");if(!Ce)continue;Ce.font=`${Se}px ${zt}`;let oe=re.x-r,Ie=ho(oe),Re=Ie!==void 0?Math.min(400,Ie):400,Ee=Kn(Ce,ze,Re),U=Math.min(Re,Math.max(...Ee.map(xe=>Ce.measureText(xe).width))),ee=Ee.length*Te,Le=ze.length*Te,Fe=ee-Le;v.push({id:k.id,threadId:C,x:re.x+U+4,y:re.y-4-Fe,size:ee+8,color:k.color,isInFlight:A,isNeedsReview:G,replyCount:te})}if(v.length===0)return null;let S=!!s;return Ue(eo,{children:v.map(k=>Ue(Sd,{left:k.x-r-zn,top:k.y-o-zn,onClick:S&&k.threadId?()=>{l==null||l(k.id),s(k.threadId)}:void 0,style:{pointerEvents:S?"auto":"none",cursor:S&&k.threadId?"pointer":void 0,zIndex:9999},children:Ue("div",{"data-devtools":"annotation-badge",style:{height:k.size,display:"flex",alignItems:"center",backgroundColor:k.color,fontFamily:zt,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:k.isInFlight?mn(eo,{children:[Ue("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?mn(eo,{children:[Ue("circle",{cx:"7",cy:"7",r:"2"}),Ue("circle",{cx:"17",cy:"7",r:"2"}),Ue("circle",{cx:"7",cy:"17",r:"2"}),Ue("circle",{cx:"17",cy:"17",r:"2"})]}):mn(eo,{children:[Ue("circle",{cx:"12",cy:"6",r:"2"}),Ue("circle",{cx:"6",cy:"12",r:"2"}),Ue("circle",{cx:"18",cy:"12",r:"2"}),Ue("circle",{cx:"12",cy:"18",r:"2"})]})}),Ue("span",{style:{opacity:.7},children:gi[u]})]}):mn(eo,{children:[k.isNeedsReview?Ue("span",{style:{fontWeight:700},children:"?"}):mn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[Ue("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),Ue("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),Ue("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),Ue("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),Ue("span",{style:{opacity:.7},children:k.replyCount>0?`${k.replyCount} ${k.replyCount===1?"reply":"replies"}`:"Cancelled"})]})})},k.id))})}function mi({inFlightSelectorColors:e,animated:t=!0}){let[n,r]=Vo([]);if(xr(()=>{if(e.size===0){r([]);return}let i=null,s=()=>{let c=[];for(let[d,u]of e){let p=Xt(d);if(!p)continue;let g=p.getBoundingClientRect();c.push({selector:d,top:g.top,left:g.left,width:g.width,height:g.height,color:u})}r(c)},l=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(s)};s(),window.addEventListener("scroll",l,!0),window.addEventListener("resize",l,!0);let a=new MutationObserver(l);return a.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",l,!0),window.removeEventListener("resize",l,!0),a.disconnect(),i&&cancelAnimationFrame(i)}},[e]),n.length===0)return null;let o={position:"absolute",width:2,height:2,pointerEvents:"none"};return mn(eo,{children:[t&&Ue("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),n.map(i=>mn("div",{"data-devtools":"marching-ants",style:{position:"fixed",top:i.top,left:i.left,width:i.width,height:i.height,pointerEvents:"none",zIndex:9995,overflow:"visible"},children:[Ue("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible"},children:Ue("rect",{x:"0.5",y:"0.5",width:Math.max(0,i.width-1),height:Math.max(0,i.height-1),fill:"none",stroke:i.color,strokeWidth:"1",strokeDasharray:"2 4",style:t?{animation:"popmelt-march 0.5s steps(2) infinite"}:void 0})}),Ue("div",{style:h(f({},o),{top:-1,left:-1,backgroundColor:i.color})}),Ue("div",{style:h(f({},o),{top:-1,right:-1,backgroundColor:i.color})}),Ue("div",{style:h(f({},o),{bottom:-1,left:-1,backgroundColor:i.color})}),Ue("div",{style:h(f({},o),{bottom:-1,right:-1,backgroundColor:i.color})})]},i.selector))]})}function El({annotations:e,supersededAnnotations:t,scrollX:n,scrollY:r,onReply:o,annotationGroupMap:i,canvasRef:s}){let l=e.filter(d=>t.has(d)?!1:d.status==="waiting_input"&&d.question&&d.threadId);if(l.length===0)return null;let a=new Set,c=[];for(let d of l){if(!d.threadId||a.has(d.threadId))continue;a.add(d.threadId);let u=d.type==="text"?d:e.find(p=>p.groupId&&p.groupId===d.groupId&&p.type==="text")||d;if(u.type==="text"&&u.text&&u.points[0]){let p=u.points[0],g=u.fontSize||12,v=g*1.4,S=u.text.split(`
6
+ `),y=i.get(u.id),w=y!==void 0?[y+". "+(S[0]||""),...S.slice(1)]:S,R=document.createElement("canvas").getContext("2d");if(!R)continue;R.font=`${g}px ${zt}`;let k=p.x-n,E=ho(k),A=E!==void 0?Math.min(400,E):400,D=Kn(R,w,A),K=Math.min(A,Math.max(...D.map(re=>R.measureText(re).width))),$=D.length*v,C=w.length*v,G=$-C,te=$+8;c.push({annotation:d,x:p.x+K+4,y:p.y-4-G,size:te})}}return c.length===0?null:Ue(eo,{children:c.map(({annotation:d,x:u,y:p,size:g})=>Ue(wd,{annotation:d,x:u-n,y:p-r,size:g,onReply:o},`question-${d.threadId}`))})}function wd({annotation:e,x:t,y:n,size:r,onReply:o}){let[i,s]=Vo(!1),[l,a]=Vo(""),c=Sl(null),d=Sl(null);xr(()=>{i&&c.current&&c.current.focus()},[i]),xr(()=>{if(!i)return;let S=w=>{d.current&&!w.composedPath().includes(d.current)&&s(!1)},y=w=>{w.key==="Escape"&&s(!1)};return document.addEventListener("mousedown",S),document.addEventListener("keydown",y),()=>{document.removeEventListener("mousedown",S),document.removeEventListener("keydown",y)}},[i]);let u=vl(()=>{!l.trim()||!e.threadId||(o(e.threadId,l.trim()),a(""),s(!1))},[l,e.threadId,o]),p=vl(S=>{S.key==="Enter"&&(S.metaKey||S.ctrlKey)&&(S.preventDefault(),u())},[u]),g=i?t:t-zn,v=i?n:n-zn;return mn("div",{ref:d,"data-devtools":"question-badge",style:{position:"fixed",left:`max(0px, ${g}px)`,top:`max(0px, ${v}px)`,padding:i?0:zn,transform:`translate(min(0px, calc(100vw - max(0px, ${g}px) - 100%)), min(0px, calc(100vh - max(0px, ${v}px) - 100%)))`,zIndex:i?10002:9999,pointerEvents:"auto",cursor:i?void 0:"pointer"},children:[!i&&mn("div",{onClick:()=>s(!0),style:{height:r,display:"flex",alignItems:"center",backgroundColor:e.color,padding:`0 ${4}px`,gap:4,fontFamily:zt,fontSize:12,color:"#ffffff",whiteSpace:"nowrap"},children:[mn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[Ue("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),Ue("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),Ue("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),Ue("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),Ue("span",{style:{opacity:.7},children:"reply?"})]}),i&&mn("div",{style:{minWidth:260,maxWidth:360,backgroundColor:"#ffffff",fontFamily:zt,fontSize:12,color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)"},children:[Ue("div",{style:{padding:`${6}px ${8}px`,lineHeight:1.4},children:e.question}),mn("div",{style:{padding:`0 ${4}px ${4}px`},children:[Ue("textarea",{ref:c,value:l,onChange:S=>a(S.target.value),onKeyDown:p,placeholder:"Type your reply...",style:{width:"100%",minHeight:40,padding:4,fontSize:12,fontFamily:zt,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"}}),Ue("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:4},children:Ue("button",{onClick:u,disabled:!l.trim(),style:{padding:"4px 12px",fontSize:11,fontFamily:zt,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 vr(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,c)=>c.timestamp-a.timestamp);let l=s[0];l.groupId&&o.add(l.groupId);for(let a=1;a<s.length;a++){let c=s[a];t.add(c),c.groupId&&r.add(c.groupId)}}for(let s of e)s.groupId&&r.has(s.groupId)&&!o.has(s.groupId)&&t.add(s);return t}import{useEffect as Cl,useLayoutEffect as Ed,useState as kl}from"react";import{jsx as hi,jsxs as Tl}from"react/jsx-runtime";function Cd(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 Ml=["top-left","top-right","bottom-right","bottom-left"];function Il({element:e,radius:t,accentColor:n,hoveredCorner:r,draggingCorner:o,cursorViewport:i}){let[s,l]=kl(null),[a,c]=kl(!1);if(Cl(()=>{let w=k=>{(k.key==="Meta"||k.key==="Control")&&c(!0)},O=k=>{(k.key==="Meta"||k.key==="Control")&&c(!1)},R=()=>c(!1);return window.addEventListener("keydown",w,!0),window.addEventListener("keyup",O,!0),window.addEventListener("blur",R),()=>{window.removeEventListener("keydown",w,!0),window.removeEventListener("keyup",O,!0),window.removeEventListener("blur",R)}},[]),Cl(()=>{if(!e){l(null);return}let w=()=>{l(e.getBoundingClientRect())};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[e]),Ed(()=>{e&&l(e.getBoundingClientRect())},[e,t["top-left"],t["top-right"],t["bottom-right"],t["bottom-left"]]),!s)return null;let d=s.width,u=s.height,p=Cd(n,.2),g={"top-left":{x:0,y:t["top-left"]},"top-right":{x:d,y:t["top-right"]},"bottom-right":{x:d,y:u-t["bottom-right"]},"bottom-left":{x:0,y:u-t["bottom-left"]}},v=new Set,S=o!=null?o:r;if(S)if(a)v.add(S);else for(let w of Ml)v.add(w);let y={position:"fixed",top:s.top,left:s.left,width:d,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"};return Tl("div",{"data-devtools":"border-radius-handles",style:y,children:[Tl("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${u}`,children:[hi("rect",{x:"0.5",y:"0.5",width:Math.max(0,d-1),height:Math.max(0,u-1),fill:"none",stroke:p,strokeWidth:"1"}),Ml.map(w=>{let O=g[w],R=v.has(w);return hi("circle",{cx:O.x,cy:O.y,r:w===(o!=null?o:r)?3:2.5,fill:n,stroke:"#ffffff",strokeWidth:w===(o!=null?o:r)?4:2,paintOrder:"stroke"},w)})]}),i&&S&&(()=>{let w=Math.round(t[S]);return hi("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:w})})()]})}import{useEffect as kd,useState as Md}from"react";function no(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 Td,jsx as oo,jsxs as Uo}from"react/jsx-runtime";function Eo({element:e,isSelected:t=!1,elementInfo:n,color:r="#3b82f6",annotationNumber:o,changeCount:i,hideTooltip:s=!1}){let[l,a]=Md(null);if(kd(()=>{if(!e){a(null);return}let A=()=>{let D=e.getBoundingClientRect();a(D)};return A(),window.addEventListener("scroll",A,{passive:!0}),window.addEventListener("resize",A,{passive:!0}),()=>{window.removeEventListener("scroll",A),window.removeEventListener("resize",A)}},[e]),!l||!e)return null;let c={position:"fixed",top:l.top,left:l.left,width:l.width,height:l.height,pointerEvents:"none",zIndex:9996,backgroundColor:t?no(r,.1):no(r,.05),overflow:"visible"},d={position:"absolute",width:2,height:2,backgroundColor:r,pointerEvents:"none"},u=e.tagName.toLowerCase(),p=e.id?`#${e.id}`:"",g=e.classList.length>0?"."+Array.from(e.classList).slice(0,2).join("."):"",v=n==null?void 0:n.reactComponent,S=v?`<${v}> ${u}${p}${g}`:`${u}${p}${g}`,y=22,w=l.height>=window.innerHeight,O=w?0:l.top>=y?l.top-y:l.bottom,R=w?{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:O,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},E=!s&&Uo("div",{"data-devtools":"tooltip",style:R,children:[o!==void 0&&Uo("span",{children:[o,"."]}),oo("span",{style:{overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0},children:S}),i!==void 0&&i>0&&Uo("span",{style:{opacity:.8},children:["(",i," ",i===1?"change":"changes",")"]})]});return Uo(Td,{children:[Uo("div",{"data-devtools":"highlight",style:c,children:[oo("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:oo("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"}))}),oo("div",{style:h(f({},d),{top:-1,left:-1})}),oo("div",{style:h(f({},d),{top:-1,right:-1})}),oo("div",{style:h(f({},d),{bottom:-1,left:-1})}),oo("div",{style:h(f({},d),{bottom:-1,right:-1})}),w&&E]}),!w&&E]})}import{useEffect as Rl,useLayoutEffect as Id,useState as yi}from"react";import{jsx as Pn,jsxs as xi}from"react/jsx-runtime";function bi(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 vi({element:e,gap:t,accentColor:n,hoveredAxis:r,draggingAxis:o,cursorViewport:i,isAutoGap:s=!1,refreshKey:l=0}){let[a,c]=yi(null),[d,u]=yi([]),[p,g]=yi(!1);if(Rl(()=>{let K=G=>{(G.key==="Meta"||G.key==="Control")&&g(!0)},$=G=>{(G.key==="Meta"||G.key==="Control")&&g(!1)},C=()=>g(!1);return window.addEventListener("keydown",K,!0),window.addEventListener("keyup",$,!0),window.addEventListener("blur",C),()=>{window.removeEventListener("keydown",K,!0),window.removeEventListener("keyup",$,!0),window.removeEventListener("blur",C)}},[]),Rl(()=>{if(!e){c(null),u([]);return}let K=()=>{c(e.getBoundingClientRect()),u(Zn(e))};return K(),window.addEventListener("scroll",K,{passive:!0}),window.addEventListener("resize",K,{passive:!0}),()=>{window.removeEventListener("scroll",K),window.removeEventListener("resize",K)}},[e]),Id(()=>{e&&(c(e.getBoundingClientRect()),u(Zn(e)))},[e,t.row,t.column,l]),!a||d.length===0)return null;let v=a.width,S=a.height,y="pm-gap-stripe-pattern",w=bi(n,.25),O=bi(n,.1),R=bi(n,.2),k=8,E=2,A={position:"fixed",top:a.top,left:a.left,width:v,height:S,pointerEvents:"none",zIndex:9996,overflow:"visible"},D=o!=null?o:r;return xi("div",{"data-devtools":"gap-handles",style:A,children:[xi("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${v} ${S}`,children:[Pn("defs",{children:Pn("pattern",{id:y,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Pn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:w,strokeWidth:"1.5"})})}),Pn("rect",{x:"0.5",y:"0.5",width:Math.max(0,v-1),height:Math.max(0,S-1),fill:"none",stroke:R,strokeWidth:"1"}),d.map((K,$)=>{let C=K.x-a.left,G=K.y-a.top,te=K.w,re=K.h,Se=p?K.axis===D:!0;return(K.axis==="row"?t.row:t.column)===0?null:xi("g",{opacity:Se?1:.6,children:[Pn("rect",{x:C,y:G,width:te,height:re,fill:O}),Pn("rect",{x:C,y:G,width:te,height:re,fill:`url(#${y})`})]},$)}),D&&(()=>{let K=d.filter(Ie=>Ie.axis===D);if(K.length===0)return null;let $=K[0];if(i&&K.length>1){let Ie=1/0;for(let Re of K){let Ee=Re.x+Re.w/2,U=Re.y+Re.h/2,ee=Math.abs(i.x-Ee)+Math.abs(i.y-U);ee<Ie&&(Ie=ee,$=Re)}}let C=$.x-a.left,G=$.y-a.top,te=$.w,re=$.h,Se=C+te/2,Te=G+re/2;if(s)return Pn("circle",{cx:Se,cy:Te,r:1.5,fill:n,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let fe=D==="column",Oe=fe?E:k,ze=fe?k:E,Ce=Se-Oe/2,oe=Te-ze/2;return Pn("rect",{x:Ce,y:oe,width:Oe,height:ze,fill:n,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),i&&D&&(()=>{let K=s?"auto":String(Math.round(D==="row"?t.row:t.column));return Pn("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:K})})()]})}import{useCallback as Bd,useEffect as Od,useState as Dd}from"react";import{useEffect as Rd,useState as Ll}from"react";var Ld=3,Ad=250,Si=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Pd=3e3;function Sr(e){let[t,n]=Ll(0),[r,o]=Ll(()=>Math.floor(Math.random()*Si.length));return Rd(()=>{if(!e)return;let i=setInterval(()=>n(l=>(l+1)%Ld),Ad),s=setInterval(()=>o(l=>(l+1)%Si.length),Pd);return()=>{clearInterval(i),clearInterval(s)}},[e]),{charIndex:t,word:Si[r]}}import{Fragment as wi,jsx as ln,jsxs as Co}from"react/jsx-runtime";function Nd(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 Al=22,Ei=12;function Fd(i){var s=i,{left:e,top:t,style:n,children:r}=s,o=_n(s,["left","top","style","children"]);return ln("div",h(f({"data-devtools":"badge-hit-area"},o),{style:f({position:"fixed",left:`max(0px, ${e}px)`,top:`max(0px, ${t}px)`,padding:Ei,transform:`translate(min(0px, calc(100vw - max(0px, ${e}px) - 100%)), min(0px, calc(100vh - max(0px, ${t}px) - 100%)))`},n),children:r}))}function Pl({styleModifications:e,isInspecting:t,accentColor:n,annotationGroupCount:r,dispatch:o,inFlightSelectors:i}){let[s,l]=Dd([]),a=i&&i.size>0,{charIndex:c,word:d}=Sr(!!a);Od(()=>{if(t){l([]);return}let v=null,S=()=>{let O=[];e.forEach((R,k)=>{let E=Xt(R.selector);if(!E)return;let A=E.getBoundingClientRect();O.push({selector:R.selector,modIndex:k,top:A.top>=Al?A.top-Al:A.bottom,left:A.left,label:Nd(R),changeCount:R.changes.length,annotationNumber:r+k+1})}),l(O)},y=()=>{v&&cancelAnimationFrame(v),v=requestAnimationFrame(S)};S(),window.addEventListener("scroll",y,!0),window.addEventListener("resize",y,!0);let w=new MutationObserver(y);return w.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),window.addEventListener("load",y),document.fonts.ready.then(y),()=>{window.removeEventListener("scroll",y,!0),window.removeEventListener("resize",y,!0),window.removeEventListener("load",y),w.disconnect(),v&&cancelAnimationFrame(v)}},[e,t,r]);let u=Bd(v=>{let S=e[v];if(!S)return;let y=Xt(S.selector);y&&(o({type:"SELECT_ANNOTATION",payload:{id:null}}),o({type:"SET_TOOL",payload:"inspector"}),o({type:"SELECT_ELEMENT",payload:{el:y,info:S.element}}))},[e,o]);if(s.length===0)return null;let p={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},g={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return ln(wi,{children:s.map(v=>{let S=i==null?void 0:i.has(v.selector);return ln(Fd,{left:v.left-Ei,top:v.top-Ei,onClick:()=>u(v.modIndex),style:{zIndex:1e4,cursor:"pointer",pointerEvents:"auto"},children:Co("div",{"data-devtools":"badge",style:h(f({},p),{backgroundColor:S?"#999999":n}),children:[Co("span",{children:[v.annotationNumber,"."]}),ln("span",{style:g,children:v.label}),Co("span",{style:{opacity:.8},children:["(",v.changeCount," ",v.changeCount===1?"change":"changes",")"]}),S&&Co("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[ln("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?Co(wi,{children:[ln("circle",{cx:"7",cy:"7",r:"2"}),ln("circle",{cx:"17",cy:"7",r:"2"}),ln("circle",{cx:"7",cy:"17",r:"2"}),ln("circle",{cx:"17",cy:"17",r:"2"})]}):Co(wi,{children:[ln("circle",{cx:"12",cy:"6",r:"2"}),ln("circle",{cx:"6",cy:"12",r:"2"}),ln("circle",{cx:"18",cy:"12",r:"2"}),ln("circle",{cx:"12",cy:"18",r:"2"})]})}),d]})]})},v.selector)})})}import{useEffect as Hd,useState as _d}from"react";import{Fragment as $d,jsx as Bl}from"react/jsx-runtime";function zd(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 Ol({styleModifications:e,accentColor:t}){let[n,r]=_d([]);if(Hd(()=>{let i=null,s=()=>{let c=[];for(let d of e){let u=Xt(d.selector);if(!u)continue;let p=u.getBoundingClientRect();if(p.width===0&&p.height===0)continue;let g=Qn(u);c.push({selector:d.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(c)},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=zd(t,.2);return Bl($d,{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 Bl("div",{"data-devtools":"mod-border",style:s},i.selector)})})}import{useEffect as Dl,useLayoutEffect as Wd,useState as Nl}from"react";import{jsx as $n,jsxs as ki}from"react/jsx-runtime";function Ci(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 Yd={top:"bottom",bottom:"top",left:"right",right:"left"};function Mi({element:e,padding:t,accentColor:n,hoveredSide:r,draggingSide:o,cursorViewport:i,refreshKey:s}){let[l,a]=Nl(null),[c,d]=Nl(!1);if(Dl(()=>{let te=Te=>{(Te.key==="Meta"||Te.key==="Control")&&d(!0)},re=Te=>{(Te.key==="Meta"||Te.key==="Control")&&d(!1)},Se=()=>d(!1);return window.addEventListener("keydown",te,!0),window.addEventListener("keyup",re,!0),window.addEventListener("blur",Se),()=>{window.removeEventListener("keydown",te,!0),window.removeEventListener("keyup",re,!0),window.removeEventListener("blur",Se)}},[]),Dl(()=>{if(!e){a(null);return}let te=()=>{a(e.getBoundingClientRect())};return te(),window.addEventListener("scroll",te,{passive:!0}),window.addEventListener("resize",te,{passive:!0}),()=>{window.removeEventListener("scroll",te),window.removeEventListener("resize",te)}},[e]),Wd(()=>{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:v,bottom:S,left:y}=t,w="pm-stripe-pattern",O=Ci(n,.25),R=Ci(n,.1),k=Ci(n,.2),E=8,A=2,D={position:"fixed",top:l.top,left:l.left,width:u,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"},K=["top","right","bottom","left"],$={top:`0,0 ${u},0 ${u-v},${g} ${y},${g}`,right:`${u},0 ${u},${p} ${u-v},${p-S} ${u-v},${g}`,bottom:`0,${p} ${y},${p-S} ${u-v},${p-S} ${u},${p}`,left:`0,0 ${y},${g} ${y},${p-S} 0,${p}`},C={top:{x:u/2-E/2,y:g/2-A/2,w:E,h:A},bottom:{x:u/2-E/2,y:p-S/2-A/2,w:E,h:A},left:{x:y/2-A/2,y:p/2-E/2,w:A,h:E},right:{x:u-v/2-A/2,y:p/2-E/2,w:A,h:E}},G=new Set;return o?G.add(o):r&&(G.add(r),c||G.add(Yd[r])),ki("div",{"data-devtools":"padding-handles",style:D,children:[ki("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${u} ${p}`,children:[$n("defs",{children:$n("pattern",{id:w,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:$n("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:O,strokeWidth:"1.5"})})}),$n("rect",{x:"0.5",y:"0.5",width:Math.max(0,u-1),height:Math.max(0,p-1),fill:"none",stroke:k,strokeWidth:"1"}),K.map(te=>{if(t[te]<=0)return null;let Se=G.has(te);return ki("g",{opacity:Se?1:.6,children:[$n("polygon",{points:$[te],fill:R}),$n("polygon",{points:$[te],fill:`url(#${w})`})]},te)}),K.map(te=>{let re=C[te],Se=G.has(te);return $n("rect",{x:re.x,y:re.y,width:re.w,height:re.h,fill:n,stroke:"#ffffff",strokeWidth:Se?4:2,paintOrder:"stroke"},`handle-${te}`)})]}),i&&(r||o)&&(()=>{let te=o!=null?o:r,re=Math.round(t[te]);return $n("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:re})})()]})}import{useCallback as Tn,useEffect as yn,useMemo as Ir,useRef as on,useState as Wt}from"react";import{Check as Tr,ChevronDown as Oi,MoveHorizontal as Jl,RotateCcw as gu,Shrink as mu,X as hu}from"lucide-react";var jd="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",Sn={borderWidth:3,borderStyle:"solid",borderImage:`url("${jd}") 4 / 1.9 / 0 round`};var wr={"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 ko(e){var t,n;return(n=(t=wr[e])==null?void 0:t[0])!=null?n:"px"}function Wn(e){let t=e.match(/^([\d.-]+)(.*)$/);return t?{num:parseFloat(t[1]),unit:t[2]||""}:{num:0,unit:""}}function Er(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}=Wn(n);return`${s}${l||ko(t)}`}return`${s}${ko(t)}`}return o}function Ti(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 Gd,useEffect as Vd,useRef as Fl,useState as Ud}from"react";import{Plus as Hl,X as Jd}from"lucide-react";import{jsx as nn,jsxs as ro}from"react/jsx-runtime";var Cr=[{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 Xd(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 Ii(e){return e.length===0?"none":e.map(t=>{var o;let n=Cr.find(i=>i.name===t.name),r=(o=n==null?void 0:n.unit)!=null?o:"";return`${t.name}(${t.value}${r})`}).join(" ")}function _l({value:e,onChange:t,accentColor:n,modified:r,panelContentRef:o}){let i=Xd(e),[s,l]=Ud(!1),a=Fl(null),c=Fl(null);Vd(()=>{if(!s)return;let R=k=>{a.current&&!k.composedPath().includes(a.current)&&l(!1)};return document.addEventListener("mousedown",R,!0),()=>document.removeEventListener("mousedown",R,!0)},[s]);let d=Cr.filter(R=>!i.some(k=>k.name===R.name)),u=R=>{let k=[...i,{name:R.name,value:R.defaultValue}];t(Ii(k)),l(!1)},p=R=>{let k=i.filter((E,A)=>A!==R);t(Ii(k))},g=(R,k)=>{let E=i.map((A,D)=>D===R?h(f({},A),{value:k}):A);t(Ii(E))},v={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},S=Gd(R=>{var G;if(!c.current)return{position:"fixed",top:0,left:0};let k=c.current.getBoundingClientRect(),E=c.current.closest('[data-devtools="panel"]'),A=E?E.getBoundingClientRect():{top:0,left:0,bottom:9999},D=(G=o==null?void 0:o.current)==null?void 0:G.getBoundingClientRect(),K=R*24+8,C=A.bottom-k.bottom<K;return h(f({position:"fixed"},C?{bottom:A.bottom-k.top+2-A.top}:{top:k.bottom+2-A.top}),{left:D?D.left+4-A.left:k.left-A.left,width:D?D.width-8:140,zIndex:10001})},[o]),y={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)"},w={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"},O=R=>nn("div",{ref:a,style:f(f({},S(R.length)),y),children:R.map(k=>nn("button",{type:"button",onClick:()=>u(k),style:w,onMouseEnter:E=>{E.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:E=>{E.currentTarget.style.backgroundColor="transparent"},children:k.label},k.name))});return i.length===0?ro("div",{children:[ro("div",{style:{display:"flex",alignItems:"center",gap:4},children:[nn(Bn,{modified:!1,children:nn("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:h(f({},v),{color:"#999",cursor:"default"})})}),nn("button",{ref:c,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:nn(Hl,{size:12})})]}),s&&O(Cr)]}):ro("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[i.map((R,k)=>{let E=Cr.find(A=>A.name===R.name);return E?ro("div",{style:{display:"flex",alignItems:"center",gap:4},children:[nn("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:E.label}),nn(Bn,{modified:r,children:ro("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[nn("input",{type:"range",min:E.min,max:E.max,step:E.step,value:R.value,onChange:A=>g(k,parseFloat(A.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${n} ${(R.value-E.min)/(E.max-E.min)*100}%, rgba(0,0,0,0.1) ${(R.value-E.min)/(E.max-E.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),nn("input",{type:"number",min:E.min,max:E.max,step:E.step,value:E.unit==="px"||E.unit==="deg"?Math.round(R.value):Math.round(R.value*100)/100,onChange:A=>g(k,parseFloat(A.target.value)||0),style:h(f({},v),{width:44,padding:"2px 4px",textAlign:"right",flexShrink:0})}),E.unit&&nn("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:E.unit})]})}),nn("button",{type:"button",onClick:()=>p(k),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:nn(Jd,{size:10})})]},R.name):null}),d.length>0&&ro("div",{children:[ro("button",{ref:c,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:[nn(Hl,{size:10}),"Add filter"]}),s&&O(d)]})]})}import{useCallback as To,useEffect as Qd,useRef as kr,useState as zl}from"react";import{AlignHorizontalSpaceAround as eu,AlignVerticalSpaceAround as tu,Columns3 as nu,Grid2x2 as ou,RectangleHorizontal as ru,Rows3 as iu,UnfoldHorizontal as $l,UnfoldVertical as Wl}from"lucide-react";import{useCallback as Kd,useEffect as qd,useRef as Jo}from"react";import{jsx as Zd}from"react/jsx-runtime";var Ri=[0,1,2,4,8,12,16,20,24,28,32];function Mo({value:e,onChange:t,onPreview:n,onScrubEnd:r,onReset:o,isModified:i,accentColor:s,defaultUnit:l="rem",snapSteps:a,color:c,style:d,children:u}){let p=Jo(null),g=Jo(null),v=Jo(o),S=Jo(i),y=Jo(!1);v.current=o,S.current=i,qd(()=>{let O=k=>{let E=g.current;if(!E)return;E.hasMoved=!0,y.current=k.shiftKey;let A=E.unit==="rem"||E.unit==="em"?.1:1;E.accum+=k.movementX*A;let D=Math.max(0,Math.round((E.startValue+E.accum)*10)/10);if(k.shiftKey&&a){let K=E.unit==="rem"||E.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,$=E.unit==="rem"||E.unit==="em"?D*K:D,C=a[a.length-1];for(let G=0;G<a.length-1;G++){let te=a[G],re=a[G+1];if($<=(te+re)/2){C=te;break}if($<re){C=re;break}}$>a[a.length-1]&&(C=Math.round($/8)*8),D=E.unit==="rem"||E.unit==="em"?Math.round(C/K*1e3)/1e3:C}n==null||n(`${D}${E.unit}`)},R=()=>{let k=g.current;if(!k)return;let E=Math.max(0,Math.round((k.startValue+k.accum)*10)/10);if(y.current&&a){let D=k.unit==="rem"||k.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,K=k.unit==="rem"||k.unit==="em"?E*D:E,$=a[a.length-1];for(let C=0;C<a.length-1;C++){let G=a[C],te=a[C+1];if(K<=(G+te)/2){$=G;break}if(K<te){$=te;break}}K>a[a.length-1]&&($=Math.round(K/8)*8),E=k.unit==="rem"||k.unit==="em"?Math.round($/D*1e3)/1e3:$}let A=k.hasMoved&&E!==k.startValue;g.current=null,document.exitPointerLock(),A?t(`${E}${k.unit}`):k.hasMoved?n==null||n(`${k.startValue}${k.unit}`):S.current&&v.current&&v.current(),r==null||r()};return document.addEventListener("mousemove",O),document.addEventListener("mouseup",R),()=>{document.removeEventListener("mousemove",O),document.removeEventListener("mouseup",R)}},[t,n,r]);let w=Kd(O=>{var E;if(O.button!==0)return;O.preventDefault();let R=Wn(e),k=R.unit&&R.unit!=="px"?R.unit:l;g.current={startValue:R.num,unit:k,accum:0,hasMoved:!1},(E=p.current)==null||E.requestPointerLock()},[e,l]);return Zd("span",{ref:p,onMouseDown:w,title:i?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:f({color:i?s||"#3b82f6":c||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize"},d),children:u})}import{Fragment as Li,jsx as we,jsxs as Ht}from"react/jsx-runtime";function su({gridCols:e,gridRows:t,gridModified:n,accentColor:r,onColsChange:o,onRowsChange:i}){return we(an,{style:{width:100},children:Ht("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[we("input",{type:"number",min:1,max:12,value:e,onChange:s=>o(parseInt(s.target.value)||1),style:h(f({},$t),{width:32,textAlign:"center",padding:2})}),we("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"}),we("input",{type:"number",min:1,max:12,value:t,onChange:s=>i(parseInt(s.target.value)||1),style:h(f({},$t),{width:32,textAlign:"center",padding:2})})]})})}function Yl({element:e,getValue:t,getOriginalValue:n,handleChange:r,isModified:o,onResetProperty:i,isCollapsed:s,onToggle:l,sectionHeaderStyle:a,activeDropdown:c,onDropdownChange:d,panelContentRef:u,accentColor:p,onFieldHover:g,preferredUnit:v,onUnitCycle:S}){let y=d,w=t("display"),O=t("flex-direction"),R=jl(w,O),k=w==="flex"||w==="inline-flex",E=w==="grid",A=k||E,D=t("width"),K=t("height"),$=o("width")?D:gr(e,"width"),C=o("height")?K:gr(e,"height"),G=Ai(D,$),te=Ai(K,C),re=t("min-width"),Se=t("max-width"),Te=t("min-height"),fe=t("max-height"),Oe=Io(t("padding")),ze=t("gap"),Ce=t("row-gap"),oe=t("column-gap"),Ie=t("grid-template-columns"),Re=t("grid-template-rows"),Ee=t("overflow"),U=Ie.split(/\s+/).filter(X=>X&&X!=="none").length||1,ee=Re.split(/\s+/).filter(X=>X&&X!=="none").length||1,[Le,Fe]=zl(!1),xe=c!==null,se=xe||Le,Ve=xe?.3:Le?.65:1,Tt=({mode:X,icon:ke,active:We})=>we("button",{type:"button",onClick:()=>Gl(X,r),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:We?no(p,.15):"transparent",color:We?p:"#64748b",cursor:"pointer",fontSize:14},children:ke}),rt=(X,ke,We)=>{We==="fixed"?r(X,ke):r(X,Mr(We,ke))},Je=X=>{let ke=Io(t("padding")),We=X||"0";r("padding",`${ke.top} ${We} ${ke.bottom} ${We}`)},_=X=>{let ke=Io(t("padding")),We=X||"0";r("padding",`${We} ${ke.right} ${We} ${ke.left}`)},[Q,q]=zl({}),be=To((X,ke)=>We=>{ke(We),q(vt=>h(f({},vt),{[X]:We}))},[]),Me=To(X=>{q(ke=>{let We=f({},ke);return delete We[X],We})},[]),Ke=To(X=>{let ke=Io(t("padding"));_e(e,"padding",`${ke.top} ${X} ${ke.bottom} ${X}`)},[e,t]),ge=To(X=>{let ke=Io(t("padding"));_e(e,"padding",`${X} ${ke.right} ${X} ${ke.left}`)},[e,t]),ut=To(X=>ke=>{_e(e,X,ke)},[e]),Qe=O==="column"||O==="column-reverse",Mt=X=>X==="center"?1:X==="flex-end"||X==="end"?2:0,Dt=Mt(t("justify-content")),at=Mt(t("align-items")),ct=Qe?at:Dt,Nt=Qe?Dt:at,nt=kr(null),bt=kr({x:0,y:0}),$e=kr({col:ct,row:Nt});$e.current={col:ct,row:Nt};let Kt=To((X,ke)=>{let We=["flex-start","center","flex-end"];Qe?(r("justify-content",We[ke]),r("align-items",We[X])):(r("justify-content",We[X]),r("align-items",We[ke]))},[Qe,r]),qt=kr(Kt);qt.current=Kt,Qd(()=>{let ke=We=>{let vt=nt.current;if(!vt||!We.composedPath().includes(vt))return;We.preventDefault(),We.stopPropagation(),bt.current.x+=We.deltaX,bt.current.y+=We.deltaY;let{col:Jt,row:tt}=$e.current,wt=!1;Math.abs(bt.current.x)>=30&&(Jt=Math.max(0,Math.min(2,Jt+(bt.current.x>0?1:-1))),bt.current.x=0,bt.current.y=0,wt=!0),!wt&&Math.abs(bt.current.y)>=30&&(tt=Math.max(0,Math.min(2,tt+(bt.current.y>0?1:-1))),bt.current.x=0,bt.current.y=0,wt=!0),wt&&(Jt!==$e.current.col||tt!==$e.current.row)&&qt.current(Jt,tt)};return document.addEventListener("wheel",ke,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",ke,{capture:!0})},[]);let bn=()=>we("div",{ref:nt,onMouseEnter:()=>{Fe(!0),u.current&&(u.current.style.overflowY="hidden")},onMouseLeave:()=>{Fe(!1),u.current&&(u.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:En,borderRadius:2,display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gridTemplateRows:"repeat(3, 1fr)",padding:6,gap:2,touchAction:"none"},children:[0,1,2].map(X=>[0,1,2].map(ke=>we("button",{type:"button",onClick:()=>Kt(ke,X),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:ke===ct&&X===Nt?we("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:ke===0?Ht(Li,{children:[we("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),we("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),we("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):ke===1?Ht(Li,{children:[we("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),we("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),we("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):Ht(Li,{children:[we("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),we("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),we("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]})}):we("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${X}-${ke}`)))}),un=o("grid-template-columns")||o("grid-template-rows");return Ht("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[we("div",{style:a,children:we("span",{children:A?"Auto layout":"Layout"})}),Ht("div",{style:{padding:"8px 12px"},children:[Ht("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:En,borderRadius:2,padding:2,opacity:Ve,transition:"opacity 150ms ease"},children:[we(Tt,{mode:"block",icon:we(ru,{size:16}),active:R==="block"}),we(Tt,{mode:"flex-col",icon:we(iu,{size:16}),active:R==="flex-col"}),we(Tt,{mode:"flex-row",icon:we(nu,{size:16}),active:R==="flex-row"}),we(Tt,{mode:"grid",icon:we(ou,{size:16}),active:R==="grid"})]}),Ht("div",{style:{display:"flex",gap:4,marginBottom:8},children:[we(Pi,{label:"W",property:"width",cssValue:G==="fixed"?D:`${Math.round(e.getBoundingClientRect().width)}px`,mode:G,onValueChange:X=>r("width",X),onModeChange:X=>{if(X==="fixed"){let ke=e.getBoundingClientRect();r("width",`${Math.round(ke.width)}px`)}else r("width",Mr(X,D))},modified:o("width"),dimmed:xe&&c!=="width",dropdownOpen:c==="width",onDropdownChange:X=>y(X?"width":null),panelContentRef:u,accentColor:p,onReset:()=>i("width"),minValue:re!=="none"&&re!=="0px"&&re!=="auto"?re:"",maxValue:Se!=="none"&&Se!=="auto"?Se:"",onMinChange:X=>r("min-width",X||"0"),onMaxChange:X=>r("max-width",X||"none"),onMinReset:()=>i("min-width"),onMaxReset:()=>i("max-width"),minModified:o("min-width"),maxModified:o("max-width")}),we(Pi,{label:"H",property:"height",cssValue:te==="fixed"?K:`${Math.round(e.getBoundingClientRect().height)}px`,mode:te,onValueChange:X=>r("height",X),onModeChange:X=>{if(X==="fixed"){let ke=e.getBoundingClientRect();r("height",`${Math.round(ke.height)}px`)}else r("height",Mr(X,K))},modified:o("height"),dimmed:xe&&c!=="height",dropdownOpen:c==="height",onDropdownChange:X=>y(X?"height":null),panelContentRef:u,minValue:Te!=="none"&&Te!=="0px"&&Te!=="auto"?Te:"",maxValue:fe!=="none"&&fe!=="auto"?fe:"",onMinChange:X=>r("min-height",X||"0"),onMaxChange:X=>r("max-height",X||"none"),onMinReset:()=>i("min-height"),onMaxReset:()=>i("max-height"),minModified:o("min-height"),maxModified:o("max-height"),accentColor:p,onReset:()=>i("height")})]}),k&&Ht("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8},children:[we("div",{style:{opacity:xe?.3:1,transition:"opacity 150ms ease"},children:bn()}),Ht("div",{style:{flex:1,opacity:Ve,transition:"opacity 150ms ease"},children:[we("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"}),we(an,{dimmed:xe,children:Ht("div",{style:{display:"flex",alignItems:"center"},children:[we(Mo,{value:ze,onChange:X=>{Me("gap"),r("gap",X)},onPreview:be("gap",ut("gap")),onScrubEnd:()=>Me("gap"),onReset:()=>i("gap"),isModified:o("gap"),accentColor:p,defaultUnit:v,children:O==="column"||O==="column-reverse"?we(Wl,{size:12,strokeWidth:o("gap")?2.5:1.5}):we($l,{size:12,strokeWidth:o("gap")?2.5:1.5})}),we(wn,{property:"gap",value:Q.gap||ze,onChange:X=>r("gap",X),isModified:o("gap")||"gap"in Q,style:h(f({},$t),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:v,onUnitCycle:S})]})})]})]}),E&&Ht("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:Ve,transition:"opacity 150ms ease"},children:[we(su,{gridCols:U,gridRows:ee,gridModified:un,accentColor:p,onColsChange:X=>r("grid-template-columns",`repeat(${X}, 1fr)`),onRowsChange:X=>r("grid-template-rows",`repeat(${X}, 1fr)`)}),Ht("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[we(an,{dimmed:xe,children:Ht("div",{style:{display:"flex",alignItems:"center"},children:[we(Mo,{value:oe||ze,onChange:X=>{Me("column-gap"),r("column-gap",X)},onPreview:be("column-gap",ut("column-gap")),onScrubEnd:()=>Me("column-gap"),onReset:()=>i("column-gap"),isModified:o("column-gap"),accentColor:p,defaultUnit:v,children:we($l,{size:12,strokeWidth:o("column-gap")?2.5:1.5})}),we(wn,{property:"column-gap",value:Q["column-gap"]||oe||ze,onChange:X=>r("column-gap",X),isModified:o("column-gap")||"column-gap"in Q,placeholder:"col",style:h(f({},$t),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:v,onUnitCycle:S})]})}),we(an,{dimmed:xe,children:Ht("div",{style:{display:"flex",alignItems:"center"},children:[we(Mo,{value:Ce||ze,onChange:X=>{Me("row-gap"),r("row-gap",X)},onPreview:be("row-gap",ut("row-gap")),onScrubEnd:()=>Me("row-gap"),onReset:()=>i("row-gap"),isModified:o("row-gap"),accentColor:p,defaultUnit:v,children:we(Wl,{size:12,strokeWidth:o("row-gap")?2.5:1.5})}),we(wn,{property:"row-gap",value:Q["row-gap"]||Ce||ze,onChange:X=>r("row-gap",X),isModified:o("row-gap")||"row-gap"in Q,placeholder:"row",style:h(f({},$t),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:v,onUnitCycle:S})]})})]})]}),A&&Ht("div",{onMouseEnter:()=>g==null?void 0:g("padding"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:Ve,transition:"opacity 150ms ease"},children:[we(an,{style:{flex:1},dimmed:xe,children:Ht("div",{style:{display:"flex",alignItems:"center"},children:[we(Mo,{value:Oe.left,onChange:X=>{Me("padding-h"),Je(X)},onPreview:be("padding-h",Ke),onScrubEnd:()=>Me("padding-h"),onReset:()=>i("padding"),isModified:o("padding"),accentColor:p,defaultUnit:v,snapSteps:Ri,children:we(eu,{size:12,strokeWidth:o("padding")?2.5:1.5})}),we(wn,{property:"padding",value:Q["padding-h"]||Oe.left,onChange:X=>Je(X),isModified:o("padding")||"padding-h"in Q,placeholder:"H pad",style:h(f({},$t),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:v,onUnitCycle:S})]})}),we(an,{style:{flex:1},dimmed:xe,children:Ht("div",{style:{display:"flex",alignItems:"center"},children:[we(Mo,{value:Oe.top,onChange:X=>{Me("padding-v"),_(X)},onPreview:be("padding-v",ge),onScrubEnd:()=>Me("padding-v"),onReset:()=>i("padding"),isModified:o("padding"),accentColor:p,defaultUnit:v,snapSteps:Ri,children:we(tu,{size:12,strokeWidth:o("padding")?2.5:1.5})}),we(wn,{property:"padding",value:Q["padding-v"]||Oe.top,onChange:X=>_(X),isModified:o("padding")||"padding-v"in Q,placeholder:"V pad",style:h(f({},$t),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:v,onUnitCycle:S})]})})]}),Ht("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:Ve,transition:"opacity 150ms ease"},children:[we("input",{type:"checkbox",checked:Ee==="hidden",onChange:X=>r("overflow",X.target.checked?"hidden":"visible"),style:{margin:0,accentColor:p}}),"Clip content"]})]})]})}import{AlignCenter as lu,AlignJustify as au,AlignLeft as cu,AlignRight as du,Baseline as uu,ChevronDown as pu,WholeWord as fu}from"lucide-react";import{jsx as ft,jsxs as On}from"react/jsx-runtime";var Vl={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function Ul({element:e,getValue:t,handleChange:n,isModified:r,onResetProperty:o,isCollapsed:i,onToggle:s,sectionHeaderStyle:l,accentColor:a,colorVariables:c,activeColorDropdown:d,onColorDropdownChange:u,panelContentRef:p,preferredUnit:g,onUnitCycle:v}){var te;let S=t("font-family"),y=t("font-size"),w=t("font-weight"),O=t("line-height"),R=t("letter-spacing"),k=t("text-align"),E=t("color"),A=String(w),D=Vl[A]||A,K=jo(e,E),$=E.includes("var(")?null:Go(K,c),C=({align:re,icon:Se})=>{let Te=k===re;return ft("button",{type:"button",onClick:()=>n("text-align",re),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:Te?no(a,.15):"transparent",color:Te?a:"#64748b",cursor:"pointer"},children:Se})},G=((te=S.split(",")[0])==null?void 0:te.trim().replace(/^["']|["']$/g,""))||"System";return On("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[ft("div",{style:l,children:ft("span",{children:"Typography"})}),On("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[ft(an,{children:On("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[ft("input",{type:"text",value:S,onChange:re=>n("font-family",re.target.value),style:h(f({},$t),{flex:1,minWidth:0,padding:0,fontWeight:r("font-family")?600:400,color:r("font-family")?a:"inherit"}),title:S}),ft(pu,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),On("div",{style:{display:"flex",gap:4},children:[ft(an,{style:{flex:1},children:ft("select",{value:A,onChange:re=>n("font-weight",re.target.value),style:h(f({},$t),{padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:r("font-weight")?600:400,color:r("font-weight")?a:"inherit"}),children:Object.entries(Vl).map(([re,Se])=>ft("option",{value:re,children:Se},re))})}),ft(an,{style:{flex:1},children:ft("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:ft(wn,{property:"font-size",value:y,onChange:re=>n("font-size",re),isModified:r("font-size"),min:1,max:999,style:h(f({},$t),{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:v})})})]}),On("div",{style:{display:"flex",gap:4},children:[ft(an,{style:{flex:1},children:On("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[ft(uu,{size:12,style:{color:r("line-height")?a:"#999",flexShrink:0}}),ft(wn,{property:"line-height",value:O,onChange:re=>n("line-height",re),isModified:r("line-height"),step:.1,min:0,placeholder:"Auto",style:h(f({},$t),{flex:1,minWidth:0,padding:0,fontWeight:r("line-height")?600:400,color:r("line-height")?a:"inherit"}),showUnit:!1})]})}),ft(an,{style:{flex:1},children:On("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[ft(fu,{size:12,style:{color:r("letter-spacing")?a:"#999",flexShrink:0}}),ft(wn,{property:"letter-spacing",value:R,onChange:re=>n("letter-spacing",re),isModified:r("letter-spacing"),step:.1,placeholder:"\u2014",style:h(f({},$t),{flex:1,minWidth:0,padding:0,fontWeight:r("letter-spacing")?600:400,color:r("letter-spacing")?a:"inherit"}),showUnit:!1})]})})]}),On("div",{style:{display:"flex",gap:2,backgroundColor:En,borderRadius:2,padding:2},children:[ft(C,{align:"left",icon:ft(cu,{size:14})}),ft(C,{align:"center",icon:ft(lu,{size:14})}),ft(C,{align:"right",icon:ft(du,{size:14})}),ft(C,{align:"justify",icon:ft(au,{size:14})})]}),On("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[ft("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"}),ft("div",{style:{flex:1,minWidth:0},children:ft(Bi,{value:E,resolvedValue:K,colorVariables:c,matchingVariable:$,onChange:re=>n("color",re),accentColor:a,modified:r("color"),panelContentRef:p,isDropdownOpen:d==="color",onDropdownChange:re=>u(re?"color":null)})})]})]})]})}import{Fragment as bu,jsx as ue,jsxs as yt}from"react/jsx-runtime";var Xl=[{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 yu(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 Ai(e,t){return!t||e==="auto"||e==="fit-content"||e==="max-content"||e==="min-content"?"hug":e==="100%"||t==="100%"?"fill":"fixed"}function Mr(e,t){switch(e){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let n=Wn(t);if(typeof n.num=="number"&&!isNaN(n.num)){let r=n.unit==="%"?"px":n.unit||"px";return`${n.num}${r}`}return"auto"}}}function Io(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 jl(e,t){return e==="grid"?"grid":e==="flex"||e==="inline-flex"?t==="column"||t==="column-reverse"?"flex-col":"flex-row":"block"}function Gl(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 En="rgba(0, 0, 0, 0.04)",$t={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 Pi({label:e,property:t,cssValue:n,mode:r,onValueChange:o,onModeChange:i,modified:s,dimmed:l,dropdownOpen:a,onDropdownChange:c,panelContentRef:d,accentColor:u="#3b82f6",onReset:p,minValue:g,maxValue:v,onMinChange:S,onMaxChange:y,onMinReset:w,onMaxReset:O,minModified:R,maxModified:k}){let E=Wn(n),A=s?E.unit||ko(t):ko(t),D=!s&&E.unit&&E.unit!==A?Ti(E.num,A):E.num,[K,$]=Wt(!1),[C,G]=Wt(String(D)),[te,re]=Wt(!1),Se=on(null),Te=on(null),fe=on(null),Oe=on(!1);yn(()=>{K||G(String(D))},[D,K]),yn(()=>{if(!a)return;let ee=Fe=>{Te.current&&!Fe.composedPath().includes(Te.current)&&fe.current&&!Fe.composedPath().includes(fe.current)&&(c==null||c(!1))},Le=Fe=>{Fe.key==="Escape"&&(c==null||c(!1))};return document.addEventListener("mousedown",ee),document.addEventListener("keydown",Le),()=>{document.removeEventListener("mousedown",ee),document.removeEventListener("keydown",Le)}},[a,c]),yn(()=>{K&&Se.current&&(Se.current.focus(),Se.current.select())},[K]);let ze=()=>{let ee=Er(C,t,n,s);o(ee||`${Math.max(0,parseFloat(C)||0)}${A}`),$(!1)},Ce=()=>{if(Oe.current){Oe.current=!1;return}ze()},oe=ee=>{if(ee.key==="Enter"){ze();return}if(ee.key==="Escape"){Oe.current=!0,G(String(D)),$(!1);return}if(ee.key==="ArrowUp"||ee.key==="ArrowDown"){ee.preventDefault();let Le=ee.key==="ArrowUp"?1:-1,Fe=ee.shiftKey?8:ee.altKey?.1:1,xe=parseFloat(C)||0,se=Math.round(Math.max(0,xe+Le*Fe)*1e3)/1e3;G(String(se)),o(`${se}${A}`)}},Ie={fixed:"Fixed",hug:"Hug",fill:"Fill"},Re={fixed:ue(Jl,{size:12}),hug:ue(mu,{size:12}),fill:ue(Jl,{size:12})},Ee=()=>{c==null||c(!a)},U=()=>{if(!fe.current||!(d!=null&&d.current))return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let ee=fe.current.getBoundingClientRect(),Le=d.current.getBoundingClientRect(),Fe=d.current.closest('[data-devtools="panel"]'),xe=Fe?Fe.getBoundingClientRect():{top:0,left:0};return{position:"fixed",top:ee.bottom+4-xe.top,left:Le.left+4-xe.left,width:Le.width-8}};return yt("div",{ref:fe,onMouseEnter:()=>re(!0),onMouseLeave:()=>re(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:K?u:te?"rgba(0,0,0,0.15)":"transparent",backgroundColor:En,transition:"border-color 100ms ease, opacity 150ms ease",opacity:l?.3:1},children:[ue("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"?K?ue("input",{ref:Se,type:"text",inputMode:"numeric",value:C,onChange:ee=>G(ee.target.value),onKeyDown:oe,onBlur:Ce,style:h(f({},$t),{flex:1,minWidth:0,padding:"4px 2px"})}):ue("span",{onClick:()=>$(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:D}):ue("span",{style:{flex:1}}),yt("button",{type:"button",onClick:Ee,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:[Ie[r],ue(Oi,{size:12})]}),a&&yt("div",{ref:Te,style:h(f({},U()),{backgroundColor:"#ffffff",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:[yt("button",{type:"button",onClick:()=>{i("fixed"),c==null||c(!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:[Re.fixed,yt("span",{children:["Fixed ",t," (",n,")"]}),r==="fixed"&&ue(Tr,{size:14,style:{marginLeft:"auto"}})]}),yt("button",{type:"button",onClick:()=>{i("hug"),c==null||c(!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:[Re.hug,ue("span",{children:"Hug contents"}),r==="hug"&&ue(Tr,{size:14,style:{marginLeft:"auto"}})]}),yt("button",{type:"button",onClick:()=>{i("fill"),c==null||c(!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:[Re.fill,ue("span",{children:"Fill container"}),r==="fill"&&ue(Tr,{size:14,style:{marginLeft:"auto"}})]}),ue("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),yt("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[yt("div",{style:{display:"flex",alignItems:"center",backgroundColor:En,borderRadius:2,padding:"4px 8px"},children:[ue("span",{onClick:R?ee=>{ee.stopPropagation(),w==null||w()}:void 0,title:R?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:R?u:"#999",fontWeight:R?600:400,marginRight:8,flexShrink:0,cursor:R?"pointer":"default"},children:"Min"}),ue("input",{type:"text",value:g||"",placeholder:"\u2014",onChange:ee=>S==null?void 0:S(ee.target.value),onClick:ee=>ee.stopPropagation(),style:h(f({},$t),{flex:1,minWidth:0,padding:0,textAlign:"right",color:R?u:"inherit",fontWeight:R?600:400})})]}),yt("div",{style:{display:"flex",alignItems:"center",backgroundColor:En,borderRadius:2,padding:"4px 8px"},children:[ue("span",{onClick:k?ee=>{ee.stopPropagation(),O==null||O()}:void 0,title:k?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:k?u:"#999",fontWeight:k?600:400,marginRight:8,flexShrink:0,cursor:k?"pointer":"default"},children:"Max"}),ue("input",{type:"text",value:v||"",placeholder:"\u2014",onChange:ee=>y==null?void 0:y(ee.target.value),onClick:ee=>ee.stopPropagation(),style:h(f({},$t),{flex:1,minWidth:0,padding:0,textAlign:"right",color:k?u:"inherit",fontWeight:k?600:400})})]})]})]})]})}function an({children:e,style:t,dimmed:n}){let[r,o]=Wt(!1);return ue("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:En,transition:"border-color 100ms ease, opacity 150ms ease",opacity:n?.3:1},t),children:e})}function Bn({children:e}){let[t,n]=Wt(!1);return ue("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:En,transition:"border-color 100ms ease"},children:e})}function wn({property:e,value:t,onChange:n,isModified:r=!1,step:o=1,min:i,max:s,style:l,placeholder:a,showUnit:c=!0,unitStyle:d,preferredUnit:u,onUnitCycle:p}){let g=Wn(t),v=ko(e),S=wr[e],w=u&&S&&S.includes(u)?u:v,O=r&&g.unit||w,R=!r&&g.unit&&g.unit!==O?Ti(g.num,O):g.num,[k,E]=Wt(!1),[A,D]=Wt(""),K=Ce=>{E(!0),D(String(R||"")),requestAnimationFrame(()=>Ce.target.select())},$=()=>{if(E(!1),A.trim()){let Ce=Er(A,e,t,r);Ce&&n(Ce)}},C=Ce=>{let oe=Ce.target.value;D(oe);let Ie=oe.trim(),Re=Ie.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),Ee=Ie.match(/^(-?[\d.]+)$/);if(Re){let U=parseFloat(Re[1]);isNaN(U)||n(`${U}${Re[2].toLowerCase()}`)}else if(Ee){let U=parseFloat(Ee[1]);isNaN(U)||n(`${U}${O}`)}},G=Ce=>{if(Ce.key==="Enter"){if(A.trim()){let oe=Er(A,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,Ie=(Ce.key==="ArrowUp"?1:-1)*o*oe,Re=parseFloat(A)||R||0,Ee=Math.round((Re+Ie)*1e3)/1e3;i!==void 0&&(Ee=Math.max(i,Ee)),s!==void 0&&(Ee=Math.min(s,Ee)),D(String(Ee)),n(`${Ee}${O}`)}},te=/^-?[\d.]/.test(t.trim()),re=k?A:te?String(R):"",Te=k&&/\s*(rem|em|px|%)\s*$/i.test(A)?"":O,fe=p&&(Te==="rem"||Te==="px"),Oe={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},ze=h(f({},d!=null?d:Oe),{pointerEvents:"auto",cursor:"pointer"});return yt(bu,{children:[ue("input",{type:"text",inputMode:"decimal",value:re,onFocus:K,onBlur:$,onChange:C,onKeyDown:G,placeholder:a,style:l}),c&&Te&&ue("span",{style:fe?ze:d!=null?d:Oe,onClick:fe?p:void 0,title:fe?"Click to switch units":void 0,children:Te})]})}function Bi({value:e,resolvedValue:t,colorVariables:n,matchingVariable:r,onChange:o,accentColor:i="#3b82f6",modified:s,panelContentRef:l,isDropdownOpen:a,onDropdownChange:c}){let[d,u]=Wt(!1),p=!e.includes("var(")&&r?r.usage:e,[g,v]=Wt(p),[S,y]=Wt(!1),[w,O]=Wt(!1),[R,k]=Wt(!1),E=on(null),A=on(null),D=on(null),K=a!==void 0?a:S,$=c||y,C=Tn(()=>{if(!D.current)return{position:"fixed",top:0,left:0,width:200};let oe=D.current.getBoundingClientRect(),Ie=D.current.closest('[data-devtools="panel"]'),Re=Ie?Ie.getBoundingClientRect():{top:0,left:0};if(l!=null&&l.current){let Ee=l.current.getBoundingClientRect();return{position:"fixed",top:oe.bottom+4-Re.top,left:Ee.left+4-Re.left,width:Ee.width-8}}return{position:"fixed",top:oe.bottom+4-Re.top,left:oe.left-Re.left,width:oe.width}},[l]);yn(()=>{if(!d){let oe=!e.includes("var(")&&r?r.usage:e;v(oe)}},[e,d,r]),yn(()=>{if(!K&&!w)return;let oe=Re=>{D.current&&!Re.composedPath().includes(D.current)&&($(!1),O(!1))},Ie=Re=>{Re.key==="Escape"&&($(!1),O(!1))};return document.addEventListener("mousedown",oe),document.addEventListener("keydown",Ie),()=>{document.removeEventListener("mousedown",oe),document.removeEventListener("keydown",Ie)}},[K,w]),yn(()=>{d&&E.current&&(E.current.focus(),E.current.select())},[d]);let G=Ir(()=>{if(!g||g.startsWith("#")||g.startsWith("rgb")||g.startsWith("hsl")||g.startsWith("oklch"))return[];let oe=g.toLowerCase();return n.filter(Ie=>Ie.name.toLowerCase().includes(oe)||Ie.usage.toLowerCase().includes(oe)).slice(0,8)},[g,n]),te=()=>{o(g),u(!1),O(!1)},re=oe=>{v(oe),oe.includes("var")||oe.includes("--")||oe.length>0&&!oe.startsWith("#")?O(!0):O(!1)},Se=oe=>{v(oe.usage),o(oe.usage),$(!1),O(!1),u(!1)},Te=()=>{setTimeout(()=>{!K&&!w&&te()},150)},fe=oe=>{oe.key==="Enter"?te():oe.key==="Escape"&&(v(e),u(!1),O(!1))},Oe=Ir(()=>{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 Ie=oe.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(Ie){let Ee=parseInt(Ie[1],10).toString(16).padStart(2,"0"),U=parseInt(Ie[2],10).toString(16).padStart(2,"0"),ee=parseInt(Ie[3],10).toString(16).padStart(2,"0");return`#${Ee}${U}${ee}`}let Re=oe.match(/oklch\(\s*([\d.]+)/);if(Re){let Ee=Math.max(0,Math.min(1,parseFloat(Re[1]))),U=Math.round(Ee*255).toString(16).padStart(2,"0");return`#${U}${U}${U}`}return"#000000"},[t]),ze=oe=>{let Ie=oe.target.value;v(Ie),o(Ie)},Ce=e.includes("var(");return yt("div",{ref:D,onMouseEnter:()=>k(!0),onMouseLeave:()=>k(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:d?i:R?"rgba(0,0,0,0.15)":"transparent",backgroundColor:En,transition:"border-color 100ms ease",overflow:"hidden"},children:[yt("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[yt("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[ue("input",{type:"color",value:Oe,onChange:ze,style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),ue("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:t,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),d?ue("input",{ref:E,type:"text",value:g,onChange:oe=>re(oe.target.value),onKeyDown:fe,onBlur:Te,style:h(f({},$t),{flex:1,minWidth:0})}):ue("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&&ue("button",{type:"button",onClick:()=>$(!K),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:ue(Oi,{size:12})})]}),w&&G.length>0&&ue("div",{style:h(f({},C()),{backgroundColor:"#ffffff",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:G.map(oe=>yt("button",{type:"button",onClick:()=>Se(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:[ue("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:oe.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ue("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:oe.name})]},oe.name))}),K&&ue("div",{ref:A,style:h(f({},C()),{backgroundColor:"#ffffff",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=>yt("button",{type:"button",onClick:()=>Se(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:[ue("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:oe.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ue("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:oe.name}),(p===oe.usage||e===oe.usage)&&ue(Tr,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},oe.name))})]})}function Kl({element:e,elementInfo:t,selector:n,styleModifications:r,dispatch:o,onClose:i,onHover:s,accentColor:l="#3b82f6",toolbarRef:a}){var rt,Je;let c=on(null),d=on(null),[u,p]=Wt(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch(_){return!1}});yn(()=>{if(u)return;let _=setTimeout(()=>p(!0),50);return()=>clearTimeout(_)},[u]);let[g,v]=Wt(null),[S,y]=Wt(null),w=g!==null||S!==null,[O,R]=Wt("rem"),k=Tn(()=>{R(_=>_==="rem"?"px":"rem")},[]),E=on(new Map),[A,D]=Wt(""),K=Ir(()=>fi(),[]);yn(()=>{let _=Q=>{var be;if(Q.key!=="Escape")return;let q=document.activeElement;q&&((be=c.current)!=null&&be.contains(q))||i()};return window.addEventListener("keydown",_),()=>window.removeEventListener("keydown",_)},[i]);let $=on({top:0,left:0,maxHeight:400}),[,C]=Wt(0),G="devtools-panel-position",te=on({x:0,y:0}),re=on(null),Se=on(!1);yn(()=>{try{let _=localStorage.getItem(G);if(_){let Q=JSON.parse(_);typeof Q.top=="number"&&typeof Q.left=="number"&&(Se.current=!0,$.current=h(f({},$.current),{top:Q.top,left:Q.left}))}}catch(_){}},[]),yn(()=>{let _=q=>{var $e;let be=re.current;if(!be)return;let Me=be.startOffsetX+(q.clientX-be.startX),Ke=be.startOffsetY+(q.clientY-be.startY),ge=280,ut=16,Qe=Math.max(ut,Math.min(window.innerWidth-ge-ut,$.current.left+Me)),Mt=Math.max(ut,$.current.top+Ke);te.current={x:Qe-$.current.left,y:Mt-$.current.top};let Dt=c.current,at=Dt==null?void 0:Dt.parentElement;if(!at)return;at.style.top=`${Mt}px`,at.style.left=`${Qe}px`;let ct=($e=a==null?void 0:a.current)==null?void 0:$e.getBoundingClientRect(),Nt=window.innerHeight-16;ct&&Qe+ge>ct.left&&(Nt=ct.top-8);let nt=Math.max(0,Mt),bt=Math.max(200,Nt-nt);Dt&&(Dt.style.maxHeight=`${bt}px`)},Q=()=>{if(!re.current)return;let q=$.current.top+te.current.y,be=$.current.left+te.current.x;$.current=h(f({},$.current),{top:q,left:be}),te.current={x:0,y:0},Se.current=!0;try{localStorage.setItem(G,JSON.stringify({top:q,left:be}))}catch(Me){}re.current=null};return window.addEventListener("mousemove",_),window.addEventListener("mouseup",Q),()=>{window.removeEventListener("mousemove",_),window.removeEventListener("mouseup",Q)}},[]);let Te=Tn(_=>{_.button!==0||_.target.closest("button")||(_.preventDefault(),re.current={startX:_.clientX,startY:_.clientY,startOffsetX:te.current.x,startOffsetY:te.current.y})},[]);yn(()=>{te.current={x:0,y:0};let _=(be=!1)=>{var Nt;let Me=c.current,Ke=280,ge=8,ut,Qe;if(Se.current)ut=$.current.top,Qe=$.current.left;else{let nt=e.getBoundingClientRect();Qe=nt.right+ge,ut=nt.top,Qe+Ke>window.innerWidth-ge&&(Qe=nt.left-Ke-ge),Qe<ge&&(Qe=Math.max(ge,(window.innerWidth-Ke)/2))}let Mt=(Nt=a==null?void 0:a.current)==null?void 0:Nt.getBoundingClientRect(),Dt=window.innerHeight-16;Mt&&Qe+Ke>Mt.left&&(Dt=Mt.top-ge);let at=Math.max(0,ut),ct=Math.max(200,Dt-at);if($.current={top:ut,left:Qe,maxHeight:ct},be&&Me){let nt=Me.parentElement;nt&&!Se.current&&(nt.style.top=`${ut+te.current.y}px`,nt.style.left=`${Qe+te.current.x}px`),Me.style.maxHeight=`${ct}px`}else C(nt=>nt+1)};_(!1);let Q=()=>_(!0),q=()=>_(!1);return window.addEventListener("scroll",Q,{passive:!0}),window.addEventListener("resize",q,{passive:!0}),()=>{window.removeEventListener("scroll",Q),window.removeEventListener("resize",q)}},[e]),yn(()=>{let _=c.current;if(!_)return;let Q=q=>{let be=d.current;if(!be){q.preventDefault();return}let{scrollTop:Me,scrollHeight:Ke,clientHeight:ge}=be,ut=Me<=0&&q.deltaY<0,Qe=Me+ge>=Ke&&q.deltaY>0;(ut||Qe)&&q.preventDefault()};return _.addEventListener("wheel",Q,{passive:!1}),()=>_.removeEventListener("wheel",Q)},[]);let fe=Ir(()=>r.find(_=>_.selector===n),[r,n]),Oe=Tn(_=>{let Q=fe==null?void 0:fe.changes.find(q=>q.property===_);if(Q)return Q.modified;if(_.includes("color")){let q=ai(e,_);if(q&&q.includes("var("))return q}return $o(e,_)},[e,fe]),ze=Tn(_=>{if(E.current.has(_))return E.current.get(_);let Q=fe==null?void 0:fe.changes.find(be=>be.property===_);if(Q)return Q.original;let q=$o(e,_);return E.current.set(_,q),q},[e,fe]),Ce=Tn((_,Q)=>{let q=ze(_);_e(e,_,Q),_==="backdrop-filter"&&_e(e,"-webkit-backdrop-filter",Q),o({type:"MODIFY_STYLE",payload:{selector:n,element:t,property:_,original:q,modified:Q}})},[e,n,t,o,ze]),oe=Tn(()=>{pi(n,r);let _=r.find(Q=>Q.selector===n);if(_)for(let Q of _.changes)o({type:"CLEAR_STYLE",payload:{selector:n,property:Q.property}});E.current.clear()},[n,r,o]),Ie=Tn(_=>{let Q=r.find(be=>be.selector===n);Q!=null&&Q.changes.find(be=>be.property===_)&&e instanceof HTMLElement&&(e.style.removeProperty(_),o({type:"CLEAR_STYLE",payload:{selector:n,property:_}}),E.current.delete(_))},[e,n,r,o]),Re=Tn(()=>{let _=A.split(";").map(Q=>Q.trim()).filter(Q=>Q);for(let Q of _){let q=Q.indexOf(":");if(q>0){let be=Q.slice(0,q).trim(),Me=Q.slice(q+1).trim();be&&Me&&Ce(be,Me)}}D("")},[A,Ce]),Ee=Tn(_=>{var Q;return(Q=fe==null?void 0:fe.changes.some(q=>q.property===_))!=null?Q:!1},[fe]),U=_=>{var Ke;let Q=Oe(_.property),q=Ee(_.property),be=!q&&yu(_.property,Q),Me={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(be&&_.type!=="backdrop-filter")return ue(Bn,{modified:!1,children:ue("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:ge=>Ce(_.property,ge.target.value),style:h(f({},Me),{color:"#999"})})});switch(_.type){case"color":{let ge=jo(e,Q),ut=Q.includes("var(")?null:Go(ge,K);return ue(Bi,{value:Q,resolvedValue:ge,colorVariables:K,matchingVariable:ut,onChange:Qe=>Ce(_.property,Qe),accentColor:l,modified:q,panelContentRef:d,isDropdownOpen:S===_.property,onDropdownChange:Qe=>y(Qe?_.property:null)})}case"number":{if(!!wr[_.property])return ue(Bn,{modified:q,children:ue(wn,{property:_.property,value:Q,onChange:Qe=>Ce(_.property,Qe),isModified:q,min:_.min,max:_.max,step:_.step||1,style:h(f({},Me),{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:O,onUnitCycle:k})});let{num:ut}=Wn(Q);return ue(Bn,{modified:q,children:ue("input",{type:"number",value:ut,min:_.min,max:_.max,step:_.step||1,onChange:Qe=>Ce(_.property,Qe.target.value),style:Me})})}case"select":return ue(Bn,{modified:q,children:yt("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[ue("select",{value:Q,onChange:ge=>Ce(_.property,ge.target.value),style:h(f({},Me),{cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"}),children:(Ke=_.options)==null?void 0:Ke.map(ge=>ue("option",{value:ge,children:ge},ge))}),ue("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:ue(Oi,{size:12})})]})});case"spacing":return ue(Bn,{modified:q,children:ue("input",{type:"text",value:Q,onChange:ge=>Ce(_.property,ge.target.value),placeholder:"e.g., 10px or 10px 20px",style:Me})});case"backdrop-filter":return ue(_l,{value:Q,onChange:ge=>Ce(_.property,ge),accentColor:l,modified:q,panelContentRef:d});default:return ue(Bn,{modified:q,children:ue("input",{type:"text",value:Q,onChange:ge=>Ce(_.property,ge.target.value),style:Me})})}},ee=(rt=fe==null?void 0:fe.changes.length)!=null?rt:0,Le=(Je=fe==null?void 0:fe.captured)!=null?Je:!1,Fe=h(f({position:"fixed",top:$.current.top,left:$.current.left,width:280,maxHeight:$.current.maxHeight,backgroundColor:"rgba(255, 255, 255, 0.85)",backdropFilter:"blur(32px)",WebkitBackdropFilter:"blur(32px)"},Sn),{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"}),xe={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:re.current?"grabbing":"grab"},se={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"},Ve={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},Tt={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return ue("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:$.current.top+te.current.y,left:$.current.left+te.current.x,zIndex:1e4,pointerEvents:"none"},children:yt("div",{ref:c,"data-devtools":"panel",style:h(f({},Fe),{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:[yt("div",{style:xe,onMouseDown:Te,children:[yt("div",{style:{display:"flex",alignItems:"center",gap:8,overflow:"hidden"},children:[ue("span",{style:{fontWeight:600,fontSize:11,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:t.tagName}),ee>0&&ue("span",{style:{backgroundColor:Le?"#999999":l,color:"#fff",fontSize:9,padding:"1px 4px",borderRadius:2},children:ee})]}),yt("div",{style:{display:"flex",gap:4},children:[ee>0&&ue("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:ue(gu,{size:14})}),ue("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:ue(hu,{size:14})})]})]}),yt("div",{ref:d,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[ue("div",{style:{opacity:S?.3:1,transition:"opacity 150ms ease"},children:ue(Yl,{element:e,getValue:Oe,getOriginalValue:ze,handleChange:Ce,isModified:Ee,onResetProperty:Ie,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:se,activeDropdown:g,onDropdownChange:v,panelContentRef:d,accentColor:l,onFieldHover:s,preferredUnit:O,onUnitCycle:k})}),ue("div",{style:{opacity:g?.3:1,transition:"opacity 150ms ease"},children:ue(Ul,{element:e,getValue:Oe,handleChange:Ce,isModified:Ee,onResetProperty:Ie,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:se,accentColor:l,colorVariables:K,activeColorDropdown:S,onColorDropdownChange:y,panelContentRef:d,preferredUnit:O,onUnitCycle:k})}),Xl.map((_,Q)=>{let q=Q===Xl.length-1,be=S&&_.properties.some(Ke=>Ke.property===S);return yt("div",{style:{borderBottom:q?"none":"1px solid rgba(0,0,0,0.08)",opacity:w&&!be?.3:1,transition:"opacity 150ms ease"},children:[ue("div",{style:se,children:ue("span",{children:_.name})}),ue("div",{style:{padding:"4px 0"},children:_.properties.map(Ke=>{let ge=Ee(Ke.property),ut=be&&Ke.property!==S;return yt("div",{style:h(f({},Ve),{opacity:ut?.3:1,transition:"opacity 150ms ease"}),children:[ue("span",{onClick:ge?()=>Ie(Ke.property):void 0,title:ge?"Click to reset":void 0,style:h(f({},Tt),{color:ge?l:"#64748b",fontWeight:ge?600:400,cursor:ge?"pointer":"default"}),children:Ke.label}),ue("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:U(Ke)})]},Ke.property)})})]},_.name)}),yt("div",{style:{opacity:w?.3:1,transition:"opacity 150ms ease"},children:[ue("div",{style:se,children:ue("span",{children:"Raw CSS"})}),yt("div",{style:{padding:"8px 12px"},children:[ue("textarea",{value:A,onChange:_=>D(_.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"}}),A.trim()&&ue("button",{type:"button",onClick:Re,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:l,color:"#fff",cursor:"pointer",opacity:A.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as xu,useLayoutEffect as vu,useState as Su}from"react";import{Fragment as ku,jsx as io,jsxs as Cu}from"react/jsx-runtime";var Di=["flex-start","center","flex-end"],Ni=["flex-start","center","flex-end"];function wu(e){return e==="normal"||e==="flex-start"||e==="start"?"flex-start":e==="flex-end"||e==="end"?"flex-end":e==="center"?"center":null}function Eu(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 ql(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 Zl({element:e,modifier:t,accentColor:n,refreshKey:r=0}){let[o,i]=Su(null);if(xu(()=>{if(!e){i(null);return}let S=()=>i(ql(e));return S(),window.addEventListener("scroll",S,{passive:!0}),window.addEventListener("resize",S,{passive:!0}),()=>{window.removeEventListener("scroll",S),window.removeEventListener("resize",S)}},[e]),vu(()=>{e&&i(ql(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 c=l.flexDirection,d=c==="column"||c==="column-reverse"?"vertical":"horizontal",u=d==="horizontal"?"vertical":"horizontal",p=[];if(t==="shift"){let S=wu(l.justifyContent);if(S){let y=Di.indexOf(S);d==="horizontal"?(y>0&&p.push("left"),y<Di.length-1&&p.push("right")):(y>0&&p.push("up"),y<Di.length-1&&p.push("down"))}}else{let S=Eu(l.alignItems);if(S){let y=Ni.indexOf(S);u==="horizontal"?(y>0&&p.push("left"),y<Ni.length-1&&p.push("right")):(y>0&&p.push("up"),y<Ni.length-1&&p.push("down"))}}if(p.length===0)return null;let g=14,v=7;return io(ku,{children:p.map(S=>{let y,w;switch(S){case"right":y=s.right+g,w=s.top+s.height/2;break;case"left":y=s.left-g,w=s.top+s.height/2;break;case"down":y=s.left+s.width/2,w=s.bottom+g;break;case"up":y=s.left+s.width/2,w=s.top-g;break}let O=S==="right"?0:S==="left"?180:S==="down"?90:-90,R={position:"fixed",left:y-v,top:w-v,width:v*2,height:v*2,pointerEvents:"none",zIndex:9997};return io("div",{"data-devtools":"swipe-hint",style:R,children:io("svg",{width:v*2,height:v*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:Cu("g",{transform:`rotate(${O})`,children:[io("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),io("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),io("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:n,strokeWidth:"1.5",strokeLinecap:"round"}),io("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:n,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},S)})})}import{useEffect as Mu,useLayoutEffect as Tu,useState as Iu}from"react";import{jsx as Fi,jsxs as Hi}from"react/jsx-runtime";function Ru(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 Ql({element:e,fontSize:t,lineHeight:n,accentColor:r,hoveredProperty:o,draggingProperty:i,cursorViewport:s}){let[l,a]=Iu(null);if(Mu(()=>{if(!e){a(null);return}let w=()=>{a(So(e))};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[e]),Tu(()=>{e&&a(So(e))},[e,t,n]),!l)return null;let c=l.width,d=l.height,u=Ru(r,.2),p=i!=null?i:o,g=8,v=2,S={position:"fixed",top:l.top,left:l.left,width:c,height:d,pointerEvents:"none",zIndex:9996,overflow:"visible"},y=w=>w==="font-size"?`${Math.round(t)}`:(t>0?n/t:1.2).toFixed(2).replace(/\.?0+$/,"");return Hi("div",{"data-devtools":"text-handles",style:S,children:[Hi("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${d}`,children:[Fi("rect",{x:"0.5",y:"0.5",width:Math.max(0,c-1),height:Math.max(0,d-1),fill:"none",stroke:u,strokeWidth:"1"}),(p==="font-size"||!p)&&Fi("rect",{x:c-v/2,y:d/2-g/2,width:v,height:g,fill:r,stroke:"#ffffff",strokeWidth:p==="font-size"?4:2,paintOrder:"stroke"}),(p==="line-height"||!p)&&Fi("rect",{x:c/2-g/2,y:d-v/2,width:g,height:v,fill:r,stroke:"#ffffff",strokeWidth:p==="line-height"?4:2,paintOrder:"stroke"})]}),s&&p&&(()=>{let w=p==="font-size"?"Aa":"Lh",O=y(p);return Hi("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:[w," ",O]})})()]})}import{Fragment as Lo,jsx as ot,jsxs as Ro}from"react/jsx-runtime";var ea=8,zi=[0,1,2,4,8,12,16,20,24,28,32],$i="devtools-active-text";function ta(e,t,n=0){let r=e.left+window.scrollX+4,o=t==="top-left"?e.top+window.scrollY-to-n*to+4:e.bottom+window.scrollY+4-1+n*to,i=window.scrollY+4,s=window.scrollY+window.innerHeight-to-4;return o<i?o=e.top+window.scrollY+4:o>s&&(o=Math.max(e.top+window.scrollY+4,s)),{x:r,y:o}}function na({state:e,dispatch:t,onScreenshot:n,inFlightAnnotationIds:r,inFlightStyleSelectors:o,inFlightSelectorColors:i,onAttachImages:s,onReply:l,onViewThread:a,onCloseThread:c,onModelComponentsAdd:d,onModelComponentFocus:u,onModelComponentHover:p,modelComponentNames:g,modelPanelHoveredComponent:v,modelSpacingTokenHover:S,highlightedAnnotationIds:y,externalCanvasRef:w,toolbarRef:O}){var bs,xs,vs,Ss,ws,Es,Cs,ks,Ms;let{canvasRef:R,redrawAll:k,resizeCanvas:E}=rl(),A=At(b=>{R.current=b,w&&(w.current=b)},[w,R]),D=Ct(!1);Gt(()=>{let b=R.current;if(!b)return;let x=()=>{D.current&&(D.current=!1,b.style.pointerEvents="")},J=T=>{T.button===0&&D.current&&x()};return window.addEventListener("mousedown",J),()=>window.removeEventListener("mousedown",J)},[R]);let[K,$]=lt(!1),[C,G]=lt(()=>{if(typeof window=="undefined")return null;try{let b=localStorage.getItem($i);return b?JSON.parse(b):null}catch(b){return null}}),[te,re]=lt(null),[Se,Te]=lt(null),[fe,Oe]=lt(null),ze=Ct(null),Ce=Ct(null),oe=Ct({x:0,y:0}),Ie=Ct([]),Re=Ct(0),[Ee,U]=lt(null),[ee,Le]=lt(new Map),Fe=Ct(0),xe=Ct(null),[se,Ve]=lt(null),[Tt,rt]=lt(null),Je=Ct({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}),[_,Q]=lt(null),[q,be]=lt(null),[Me,Ke]=lt(null),[ge,ut]=lt(null),Qe=Ct({x:0,y:0}),[Mt,Dt]=lt({x:0,y:0}),at=Ct({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}),[ct,Nt]=lt(null),[nt,bt]=lt(null),[$e,Kt]=lt(null),[qt,bn]=lt(!1),[un,xn]=lt(0),[X,ke]=lt(null),We=Ct({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}),[vt,Jt]=lt(null),[tt,wt]=lt(null),[St,pn]=lt(null),fn=Ct({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[mt,gn]=lt(null),[W,ne]=lt(null),[V,Ae]=lt(null),De=il(),he=Ct(i);he.current=i;let It=At(b=>{let x=he.current;if(!x||x.size===0)return!1;for(let J of x.keys())try{if(b.matches(J))return!0}catch(T){}return!1},[]),Zt=Ct(e);Zt.current=e;let L=Ct(C);L.current=C;let Z=Ct([]),ce=Ct(n);ce.current=n;let[pe,me]=lt(null),Pe=e.selectedAnnotationIds;Z.current=Pe;let qe=At((b,x=!1)=>{t({type:"SELECT_ANNOTATION",payload:{id:b,addToSelection:x}})},[t]),dt=At(()=>{t({type:"SELECT_ANNOTATION",payload:{id:null}})},[t]),[Ne,pt]=lt(null),[it,In]=lt({x:window.scrollX,y:window.scrollY});Gt(()=>(E(),window.addEventListener("resize",E),()=>window.removeEventListener("resize",E)),[E]),Gt(()=>{let b=()=>{In({x:window.scrollX,y:window.scrollY})};return window.addEventListener("scroll",b,{passive:!0}),()=>window.removeEventListener("scroll",b)},[]),Gt(()=>{C?localStorage.setItem($i,JSON.stringify(C)):localStorage.removeItem($i)},[C]),sl(C,G,te,e.annotations,t);let er=Ct(Ee);er.current=Ee,Gt(()=>{if(e.activeTool!=="model"||!e.isAnnotating)return;let b=x=>{if(!x.altKey||!er.current)return;x.preventDefault();let J=x.deltaY>0?-1:1;Fe.current=Math.max(0,Fe.current+J);let T=xe.current;if(T){let B=pr(T,Fe.current);U(B)}};return window.addEventListener("wheel",b,{passive:!1}),()=>window.removeEventListener("wheel",b)},[e.activeTool,e.isAnnotating]),Gt(()=>{e.activeTool!=="model"&&(U(null),Le(new Map),Fe.current=0,xe.current=null)},[e.activeTool]),Gt(()=>{var J;let b=(J=Ee==null?void 0:Ee.name)!=null?J:null,x=b&&(g!=null&&g.has(b))?b:null;p==null||p(x)},[Ee,g,p]);let[Rn,Hr]=lt(null);Gt(()=>{var J;if(!v){Hr(null);return}let b=bo(v.name),x=v.instanceIndex;Hr((J=b[x%b.length])!=null?J:null)},[v]);let[tr,rn]=lt([]);Gt(()=>{var b,x;if(!S){rn([]);return}(x=(b=S.token)==null?void 0:b.bindings)!=null&&x.length?rn(si(S.token)):rn(ri(S.px))},[S]);let _a=Ct(null),za=Ct(null);_a.current=ct,za.current=nt,Gt(()=>{let b=["flex-start","center","flex-end"],x=["flex-start","center","flex-end"],T=null,B=!1,N=null,le=null,F=(de,ve)=>{let Ge=qn(de,ve);for(;Ge&&Ge!==document.documentElement;){let st=window.getComputedStyle(Ge).display;if(st==="flex"||st==="inline-flex")return Ge;Ge=Ge.parentElement}return null},j=de=>{let ve=window.getComputedStyle(de).flexDirection;return ve==="column"||ve==="column-reverse"?"vertical":"horizontal"},m=de=>{let ve=de.getAttribute("data-pm");return ve||(ve=Math.random().toString(36).substring(2,8),de.setAttribute("data-pm",ve)),{selector:`[data-pm="${ve}"]`,durableSelector:sn(de)}},M=()=>{B=!0,T&&clearTimeout(T),T=setTimeout(()=>{B=!1,T=null},300)},Y=(de,ve,Xe)=>{let Ge=j(de);if(ve===Ge){let He=window.getComputedStyle(de).justifyContent,ht=He==="normal"||He==="flex-start"||He==="start"?"flex-start":He==="flex-end"||He==="end"?"flex-end":He==="center"?"center":null;if(!ht)return;let Ft=b.indexOf(ht)+Xe;if(Ft<0||Ft>=b.length)return;let An=b[Ft],{selector:Gn,durableSelector:zr}=m(de);_e(de,"justify-content",An),t({type:"MODIFY_STYLES_BATCH",payload:{selector:Gn,durableSelector:zr,element:en(de),changes:[{property:"justify-content",original:He,modified:An}]}})}else{let He=window.getComputedStyle(de).flexDirection,ht=Ge==="horizontal"?"column":"row",{selector:vn,durableSelector:Ft}=m(de);_e(de,"flex-direction",ht),t({type:"MODIFY_STYLES_BATCH",payload:{selector:vn,durableSelector:Ft,element:en(de),changes:[{property:"flex-direction",original:He,modified:ht}]}})}xn(st=>st+1)},I=(de,ve,Xe)=>{let st=j(de)==="horizontal"?"vertical":"horizontal";if(ve!==st)return;let ht=window.getComputedStyle(de).alignItems,vn=ht==="normal"||ht==="stretch"||ht==="flex-start"||ht==="start"?"flex-start":ht==="flex-end"||ht==="end"?"flex-end":ht==="center"?"center":null;if(!vn)return;let An=x.indexOf(vn)+Xe;if(An<0||An>=x.length)return;let Gn=x[An],{selector:zr,durableSelector:Ka}=m(de);_e(de,"align-items",Gn),t({type:"MODIFY_STYLES_BATCH",payload:{selector:zr,durableSelector:Ka,element:en(de),changes:[{property:"align-items",original:ht,modified:Gn}]}}),xn(qa=>qa+1)},P=20,H=null,z=null,ae=0,ye=(de,ve,Xe)=>{let Ge=F(ve,Xe);ke(Ge?{modifier:de,target:Ge}:null)},et=de=>{if(!(e.activeTool!=="hand"||!e.isAnnotating)){if(de.key==="Shift"&&!de.altKey){let ve=Qe.current;ye("shift",ve.x,ve.y)}else if(de.key==="Alt"&&!de.shiftKey){let ve=Qe.current;ye("alt",ve.x,ve.y)}}},je=de=>{if(e.activeTool!=="hand"||!e.isAnnotating)return;let ve=de.shiftKey&&!de.altKey,Xe=de.altKey&&!de.shiftKey;if(!ve&&!Xe||de.buttons!==0){H=null,z=null,ae=0,N=null,le=null,ke(null);return}if(N===null&&(N=de.clientX,le=de.clientY,ye(ve?"shift":"alt",de.clientX,de.clientY)),B)return;H===null&&(H=de.clientX,z=de.clientY,ae=0);let Ge=de.clientX-H,st=de.clientY-z,He=Math.abs(Ge)>=Math.abs(st)?Ge:st;if(Math.abs(He)>3){let Gn=He>0?1:-1;if(ae!==0&&Gn!==ae){H=de.clientX,z=de.clientY,ae=0;return}ae=Gn}if(Math.abs(Ge)<P&&Math.abs(st)<P)return;let ht=F(N,le);if(!ht)return;let vn=Math.abs(Ge)>=Math.abs(st)?"horizontal":"vertical",An=(vn==="horizontal"?Ge:st)>0?1:-1;H=null,z=null,ae=0,ve?Y(ht,vn,An):I(ht,vn,An),M()},Rt=de=>{(de.key==="Shift"||de.key==="Alt")&&(N=null,le=null,H=null,z=null,ae=0,ke(null))},gt=()=>{ke(null),H=null,z=null,ae=0};return window.addEventListener("keydown",et),window.addEventListener("mousemove",je),window.addEventListener("mousedown",gt),window.addEventListener("keyup",Rt),()=>{window.removeEventListener("keydown",et),window.removeEventListener("mousemove",je),window.removeEventListener("mousedown",gt),window.removeEventListener("keyup",Rt),T&&clearTimeout(T)}},[e.activeTool,e.isAnnotating,t]),Gt(()=>{let b=x=>{var N,le,F,j;if(x.key==="Escape"){if(L.current)return;if(e.activeTool==="model"&&ee.size>0){x.preventDefault(),Le(new Map);return}if(Z.current.length>0){x.preventDefault(),dt();return}}if(x.key==="Enter"&&e.activeTool==="model"&&ee.size>0&&d){x.preventDefault();let m=[...ee.keys()].filter(M=>!(g!=null&&g.has(M)));m.length>0&&d(m),Le(new Map);return}if((x.metaKey||x.ctrlKey)&&x.key==="v"&&Ie.current.length>0&&!L.current){x.preventDefault(),Re.current++;let m=Re.current*20,Y=((N=Ie.current[0])==null?void 0:N.groupId)?Math.random().toString(36).substring(2,9):void 0,I=Ie.current.map(H=>h(f({},H),{id:Math.random().toString(36).substring(2,9),groupId:H.groupId?Y:void 0,timestamp:Date.now(),points:H.points.map(z=>({x:z.x+m,y:z.y+m}))}));t({type:"PASTE_ANNOTATIONS",payload:{annotations:I}});let P=I.find(H=>H.type!=="text")||I[0];P&&qe(P.id);return}let J=Z.current;if(J.length===0||L.current)return;let T=(F=(le=x.composedPath)==null?void 0:le.call(x)[0])!=null?F:x.target,B=T==null?void 0:T.tagName;if(!(B==="INPUT"||B==="TEXTAREA"||T!=null&&T.isContentEditable)&&(x.key==="Delete"||x.key==="Backspace")){if(x.preventDefault(),c){let m=Zt.current.annotations;for(let M of J){let Y=m.find(P=>P.id===M);if(!Y)continue;let I=Y.threadId||Y.groupId&&((j=m.find(P=>P.groupId===Y.groupId&&P.threadId))==null?void 0:j.threadId);I&&c(I)}}for(let m of J)t({type:"DELETE_ANNOTATION",payload:{id:m}});dt()}};return window.addEventListener("keydown",b),()=>window.removeEventListener("keydown",b)},[t,dt,qe,e.activeTool,ee,g,d,c]);let Hn=_i(()=>vr(e.annotations),[e.annotations]),nr=_i(()=>{let b=new Map,x=new Set,J=1;for(let T of e.annotations)if(!Hn.has(T))if(T.groupId){if(!x.has(T.groupId)){x.add(T.groupId);let B=e.annotations.filter(N=>N.groupId===T.groupId);for(let N of B)b.set(N.id,J);J++}}else b.set(T.id,J),J++;return b},[e.annotations,Hn]),us=_i(()=>{if(Pe.length===0)return null;let b=new Map;for(let x of Pe){let J=e.annotations.find(B=>B.id===x);if(!J)continue;let T=J.groupId?e.annotations.filter(B=>B.groupId===J.groupId):[J];for(let B of T)if(B.linkedSelector&&!(i!=null&&i.has(B.linkedSelector))){let N=B.color||e.activeColor;b.set(B.linkedSelector,N)}}return b.size>0?b:null},[Pe,e.annotations,e.activeColor,i]);Gt(()=>{let b=e.annotations.filter(x=>!(Hn.has(x)||C&&!C.isNew&&x.id===C.id));k(b,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,Pe,ea,it.x,it.y,nr,y)},[e.annotations,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,k,C,Pe,it,nr,Hn,y]),Gt(()=>{if(Se){let b=Math.random().toString(36).substring(2,9);G({id:b,point:Se.point,text:"",fontSize:12,isNew:!0,groupId:Se.groupId}),Te(null)}},[Se]),Gt(()=>{fe&&(G({id:Math.random().toString(36).substring(2,9),point:fe.point,text:"",fontSize:12,isNew:!0,linkedSelector:fe.linkedSelector,linkedAnchor:fe.linkedAnchor,elements:fe.elements}),Oe(null))},[fe]);let or=Ct(null),rr=(bs=C==null?void 0:C.id)!=null?bs:null;Gt(()=>{rr&&ze.current?requestAnimationFrame(()=>{var J;let b=ze.current;if(!b||(b.focus(),Ce.current===rr))return;Ce.current=rr;let x=L.current;if(x){if(or.current!==null){let T=Math.min(or.current,b.value.length);b.setSelectionRange(T,T);return}if(!x.isNew&&x.clickPoint){let T=R.current;if(!T)return;let B=T.getContext("2d");if(!B)return;B.font=`${x.fontSize}px ${zt}`;let N=x.fontSize*1.4,le=x.text.split(`
7
+ `),F=x.clickPoint.y-x.point.y,j=Math.max(0,Math.min(le.length-1,Math.floor(F/N))),m=x.clickPoint.x-x.point.x,M=le[j]||"",Y=0;for(let P=0;P<=M.length;P++){let H=B.measureText(M.substring(0,P)).width;if(H>m){let z=P>0?B.measureText(M.substring(0,P-1)).width:0;Y=m-z<H-m?P-1:P;break}Y=P}let I=Y;for(let P=0;P<j;P++)I+=(((J=le[P])==null?void 0:J.length)||0)+1;b.setSelectionRange(I,I)}}}):(Ce.current=null,or.current=null)},[rr,R]);let uo=At(b=>{let x=R.current;if(!x)return{x:0,y:0};let J=x.getBoundingClientRect(),T,B;if("touches"in b&&b.touches[0])T=b.touches[0].clientX,B=b.touches[0].clientY;else if("clientX"in b)T=b.clientX,B=b.clientY;else return{x:0,y:0};return{x:T-J.left+window.scrollX,y:B-J.top+window.scrollY}},[R]),jn=At((b,x,J,T)=>{let B=J.x-x.x,N=J.y-x.y,le=B*B+N*N;if(le===0)return Math.sqrt((b.x-x.x)**2+(b.y-x.y)**2)<=T;let F=Math.max(0,Math.min(1,((b.x-x.x)*B+(b.y-x.y)*N)/le)),j=x.x+F*B,m=x.y+F*N;return Math.sqrt((b.x-j)**2+(b.y-m)**2)<=T},[]),ir=At(b=>{for(let J=e.annotations.length-1;J>=0;J--){let T=e.annotations[J];if(!T||Hn.has(T))continue;let B=(T.strokeWidth||3)+4;switch(T.type){case"text":{if(!T.points[0]||!T.text)continue;let N=T.points[0],le=T.fontSize||12,F=R.current;if(F){let j=F.getContext("2d");if(j){j.font=`${le}px ${zt}`;let m=T.text.split(`
8
+ `),M=N.x-it.x,Y=ho(M),I=Y!==void 0?Math.min(400,Y):void 0,P=I?Kn(j,m,I):m,H=I?Math.min(I,Math.max(...P.map(et=>j.measureText(et).width))):Math.max(...m.map(et=>j.measureText(et).width)),z=P.length*(le*1.4),ae=m.length*(le*1.4),ye=z-ae;if(b.x>=N.x-4-4&&b.x<=N.x+H+4+4&&b.y>=N.y-4-4-ye&&b.y<=N.y+ae+4+4)return T}}break}case"rectangle":{if(T.points.length<2)continue;let N=T.points[0],le=T.points[T.points.length-1],F=Math.min(N.x,le.x),j=Math.max(N.x,le.x),m=Math.min(N.y,le.y),M=Math.max(N.y,le.y),Y=jn(b,{x:F,y:m},{x:j,y:m},B),I=jn(b,{x:F,y:M},{x:j,y:M},B),P=jn(b,{x:F,y:m},{x:F,y:M},B),H=jn(b,{x:j,y:m},{x:j,y:M},B);if(Y||I||P||H)return T;break}case"circle":{if(T.points.length<2)continue;let N=T.points[0],le=T.points[T.points.length-1],F=(N.x+le.x)/2,j=(N.y+le.y)/2,m=Math.abs(le.x-N.x)/2,M=Math.abs(le.y-N.y)/2,Y=b.x-F,I=b.y-j,P=Math.sqrt((Y/m)**2+(I/M)**2);if(Math.abs(P-1)*Math.max(m,M)<=B)return T;break}case"line":{if(T.points.length<2)continue;let N=T.points[0],le=T.points[T.points.length-1];if(jn(b,N,le,B))return T;break}case"freehand":{if(T.points.length<2)continue;for(let N=0;N<T.points.length-1;N++){let le=T.points[N],F=T.points[N+1];if(jn(b,le,F,B))return T}break}}}return null},[e.annotations,R,jn,Hn,it.x]),ps=At(b=>{let x=ir(b);return(x==null?void 0:x.type)==="text"?x:null},[ir]),fs=At(b=>{if(Pe.length===0)return null;let x=ea/2+4;for(let J of Pe){let T=e.annotations.find(B=>B.id===J);if(!(!T||T.points.length<2)){if(T.type==="line"){let B=T.points[0],N=T.points[T.points.length-1];if(Math.sqrt((b.x-B.x)**2+(b.y-B.y)**2)<=x)return{handle:"start",annotationId:J};if(Math.sqrt((b.x-N.x)**2+(b.y-N.y)**2)<=x)return{handle:"end",annotationId:J};continue}if(T.type==="circle"){let B=T.points[0],N=T.points[T.points.length-1],le=Math.min(B.x,N.x),F=Math.max(B.x,N.x),j=Math.min(B.y,N.y),m=Math.max(B.y,N.y),M=(le+F)/2,Y=(j+m)/2,I=[{handle:"top",x:M,y:j},{handle:"bottom",x:M,y:m},{handle:"left",x:le,y:Y},{handle:"right",x:F,y:Y}];for(let{handle:P,x:H,y:z}of I)if(Math.sqrt((b.x-H)**2+(b.y-z)**2)<=x)return{handle:P,annotationId:J};continue}if(T.type==="rectangle"||T.type==="freehand"){let B=T.points[0],N=T.points[T.points.length-1],le,F,j,m;T.type==="freehand"?(le=Math.min(...T.points.map(Y=>Y.x)),F=Math.max(...T.points.map(Y=>Y.x)),j=Math.min(...T.points.map(Y=>Y.y)),m=Math.max(...T.points.map(Y=>Y.y))):(le=Math.min(B.x,N.x),F=Math.max(B.x,N.x),j=Math.min(B.y,N.y),m=Math.max(B.y,N.y));let M=[{corner:"topLeft",x:le,y:j},{corner:"topRight",x:F,y:j},{corner:"bottomLeft",x:le,y:m},{corner:"bottomRight",x:F,y:m}];for(let{corner:Y,x:I,y:P}of M)if(Math.sqrt((b.x-I)**2+(b.y-P)**2)<=x)return{handle:Y,annotationId:J}}}}return null},[Pe,e.annotations]);Gt(()=>{let b=x=>{if(oe.current={x:x.clientX+window.scrollX,y:x.clientY+window.scrollY},!C){let J=ps(oe.current);re((J==null?void 0:J.id)||null)}};return window.addEventListener("mousemove",b),()=>window.removeEventListener("mousemove",b)},[C,ps]);let po=At(()=>{var x;if(!C)return;let b=((x=C.images)==null?void 0:x.length)||0;if(C.text.trim()||b>0)if(C.isNew){let J=cr();t({type:"ADD_TEXT",payload:f({point:C.point,text:C.text||(b>0?`[${b} image${b>1?"s":""}]`:""),fontSize:C.fontSize,id:J,groupId:C.groupId,linkedSelector:C.linkedSelector,linkedAnchor:C.linkedAnchor,elements:C.elements},b>0?{imageCount:b}:{})}),b>0&&C.images&&s&&s(J,C.images)}else t({type:"UPDATE_TEXT",payload:f({id:C.id,text:C.text||(b>0?`[${b} image${b>1?"s":""}]`:"")},b>0?{imageCount:b}:{})}),b>0&&C.images&&s&&s(C.id,C.images);else C.isNew||t({type:"DELETE_ANNOTATION",payload:{id:C.id}});G(null)},[C,t,s]),Ln=At(b=>{for(let x=0;x<zi.length-1;x++){let J=zi[x],T=zi[x+1];if(b<=(J+T)/2)return J;if(b<T)return T}return Math.round(b/8)*8},[]),gs=At((b,x,J,T)=>{let B=J.top+Math.max(T.top,4),N=J.bottom-Math.max(T.bottom,4),le=J.left+Math.max(T.left,4),F=J.right-Math.max(T.right,4);if(b<J.left||b>J.right||x<J.top||x>J.bottom)return null;let j=x<B,m=x>N,M=b<le,Y=b>F;return j&&M?T.top>=T.left?"top":"left":j&&Y?T.top>=T.right?"top":"right":m&&M?T.bottom>=T.left?"bottom":"left":m&&Y?T.bottom>=T.right?"bottom":"right":j?"top":m?"bottom":M?"left":Y?"right":null},[]),ms=At(b=>{var N,le;if(!e.isAnnotating)return;if(e.inspectedElement&&e.activeTool==="hand"&&!("button"in b&&b.button===2)){b.preventDefault(),b.stopPropagation(),t({type:"SELECT_ELEMENT",payload:null});return}let x=uo(b),J="shiftKey"in b&&b.shiftKey;if(e.activeTool==="inspector"){if("button"in b&&b.button===2)return;if(se&&!It(se)){let F=en(se),j=sn(se),m=se.getBoundingClientRect(),M=se.getAttribute("data-pm");M||(M=Math.random().toString(36).substring(2,8),se.setAttribute("data-pm",M));let Y=`[data-pm="${M}"]`,I=e.styleModifications.some(ye=>{try{return se.matches(ye.selector)}catch(et){return!1}}),P=e.annotations.filter(ye=>{if(!ye.linkedSelector)return!1;try{return se.matches(ye.linkedSelector)}catch(et){return!1}}).length,H=(I?1:0)+P,z=m.top>=to*(1+H)?"top-left":"bottom-left",ae=ta(m,z,H);Oe({point:ae,linkedSelector:Y,linkedAnchor:z,elements:[h(f({},F),{selector:j})]})}return}if(e.activeTool==="model"){if("button"in b&&b.button===2)return;if(Ee){let F=Ee.name;if(g!=null&&g.has(F)){u==null||u(F);return}"shiftKey"in b&&b.shiftKey?Le(m=>{let M=new Map(m);return M.has(F)?M.delete(F):M.set(F,Ee),M}):ee.size===1&&ee.has(F)?(d&&d([F]),Le(new Map)):Le(new Map([[F,Ee]]))}return}if(e.activeTool==="hand"&&ct&&nt){let F=ct,j=F.getAttribute("data-pm");j||(j=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",j));let m=sn(F),M=`[data-pm="${j}"]`,Y=en(F),I=Wo(F),P=x.x-window.scrollX,H=x.y-window.scrollY,z=qt,ae=window.getComputedStyle(F).justifyContent,ye=0;if(z){let je=Zn(F).find(Rt=>Rt.axis===nt);ye=je?nt==="column"?je.w:je.h:0}_e(F,"transition","none"),at.current={isDragging:!0,hasMoved:!1,axis:nt,startX:P,startY:H,originalRow:z?ye:I.row,originalColumn:z?ye:I.column,element:F,elementInfo:h(f({},Y),{selector:M}),selector:M,durableSelector:m,isAuto:z,originalJustifyContent:ae,visualGap:ye},Kt({axis:nt,row:z?ye:I.row,column:z?ye:I.column});return}if(e.activeTool==="hand"&&mt&&W){let F=mt,j=F.getAttribute("data-pm");j||(j=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",j));let m=`[data-pm="${j}"]`,M=en(F),{fontSize:Y,lineHeight:I}=Yo(F),P=Y>0?I/Y:1.2,H=x.x-window.scrollX,z=x.y-window.scrollY;_e(F,"transition","none");let ae=sn(F);fn.current={isDragging:!0,property:W,startX:H,startY:z,originalFontSize:Y,originalLineHeight:I,originalRatio:P,element:F,elementInfo:h(f({},M),{selector:m}),selector:m,durableSelector:ae},Ae({property:W,fontSize:Y,lineHeight:I});return}if(e.activeTool==="hand"&&vt&&tt){let F=vt,j=F.getAttribute("data-pm");j||(j=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",j));let m=`[data-pm="${j}"]`,M=sn(F),Y=en(F),I=Qn(F),P=F.getBoundingClientRect(),H=Math.floor(P.height/2),z=x.y-window.scrollY;_e(F,"transition","none"),We.current={isDragging:!0,corner:tt,startY:z,original:I,maxRadius:H,element:F,elementInfo:h(f({},Y),{selector:m}),selector:m,durableSelector:M},pn({corner:tt,radius:f({},I)});return}if(e.activeTool==="hand"&&_&&q){let F=_,j=F.getAttribute("data-pm");j||(j=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",j));let m=`[data-pm="${j}"]`,M=sn(F),Y=en(F),I=vo(F),P=x.x-window.scrollX,H=x.y-window.scrollY;_e(F,"transition","none"),Je.current={isDragging:!0,side:q,startX:P,startY:H,original:I,element:F,elementInfo:h(f({},Y),{selector:m}),selector:m,durableSelector:M},ut({side:q,padding:f({},I)});return}let T=fs(x);if(T){let F=e.annotations.find(j=>j.id===T.annotationId);if(F&&F.type!=="text"&&((N=F.status)!=null?N:"pending")==="pending"){pt({annotationId:T.annotationId,handle:T.handle,startPoint:x,originalPoints:[...F.points],hasMoved:!1});return}}let B=ir(x);if(B&&B.points[0]){if(C&&po(),B.type!=="text"?(qe(B.id,J),B.color&&t({type:"SET_COLOR",payload:B.color})):J||dt(),a){let F=B.threadId||(B.groupId?(le=e.annotations.find(j=>j.groupId===B.groupId&&j.threadId))==null?void 0:le.threadId:void 0);F&&a(F)}me({annotation:B,startPoint:x,hasMoved:!1});return}if(J||dt(),e.activeTool==="text"){C&&po();let F=Math.random().toString(36).substring(2,9);G({id:F,point:x,text:"",fontSize:12,isNew:!0});return}$(!0),t({type:"START_PATH",payload:x})},[e.isAnnotating,e.activeTool,e.inspectedElement,e.annotations,C,Pe,se,_,q,vt,tt,ct,nt,qt,mt,W,Ee,ee,g,d,u,a,uo,ir,fs,t,qe,dt,po]),hs=At(b=>{var J,T;let x=uo(b);if(e.activeTool==="inspector"&&e.isAnnotating){let B=x.x-window.scrollX,N=x.y-window.scrollY,le=qn(B,N),F=le&&It(le)?null:le;F!==se&&(Ve(F),rt(F?en(F):null));return}if(e.activeTool==="model"&&e.isAnnotating){let B=x.x-window.scrollX,N=x.y-window.scrollY,le=qn(B,N);if(le!==xe.current&&(xe.current=le,Fe.current=0),le){let F=pr(le,Fe.current);U(F)}else U(null);return}if(e.activeTool==="hand"&&e.isAnnotating){let B=x.x-window.scrollX,N=x.y-window.scrollY;Qe.current={x:B,y:N},Dt({x:B,y:N});let le=De.current.cmd,F=De.current.shift;if(at.current.isDragging){let m=at.current,M=m.element;if(!M)return;if(!m.hasMoved){let H=Math.abs(B-m.startX),z=Math.abs(N-m.startY);if(H<=2&&z<=2)return;m.hasMoved=!0,m.isAuto&&(_e(M,"justify-content","normal"),_e(M,"row-gap",`${m.visualGap}px`),_e(M,"column-gap",`${m.visualGap}px`),bn(!1))}let Y=m.axis,I=m.originalRow,P=m.originalColumn;if(Y==="column"){let H=B-m.startX;P=m.originalColumn+H,le||(I=m.originalRow+H)}else{let H=N-m.startY;I=m.originalRow+H,le||(P=m.originalColumn+H)}I=Math.max(0,I),P=Math.max(0,P),F&&(I=Ln(I),P=Ln(P)),I=Math.round(I),P=Math.round(P),_e(M,"row-gap",`${I}px`),_e(M,"column-gap",`${P}px`),Kt({axis:Y,row:I,column:P});return}if(We.current.isDragging){let m=We.current,M=m.element;if(!M)return;let Y=N-m.startY,I=m.corner,P=m.original,H=f({},P);if(le){let z=P[I]+Y;z=Math.max(0,Math.min(m.maxRadius,z)),F&&(z=Ln(z)),z=Math.round(z),H[I]=z}else{let z=P[I]+Y;z=Math.max(0,Math.min(m.maxRadius,z)),F&&(z=Ln(z)),z=Math.round(z),H={"top-left":z,"top-right":z,"bottom-right":z,"bottom-left":z}}_e(M,"border-top-left-radius",`${H["top-left"]}px`),_e(M,"border-top-right-radius",`${H["top-right"]}px`),_e(M,"border-bottom-right-radius",`${H["bottom-right"]}px`),_e(M,"border-bottom-left-radius",`${H["bottom-left"]}px`),pn({corner:I,radius:H});return}if(fn.current.isDragging){let m=fn.current,M=m.element;if(!M)return;let Y=m.property,I=m.originalFontSize,P=m.originalLineHeight,H=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(Y==="font-size"){let ae=B-m.startX;I=m.originalFontSize+ae,I=Math.max(1,I)}else{let ae=N-m.startY;P=m.originalLineHeight+ae,P=Math.max(I,P)}if(F)if(Y==="font-size"){let ae=H[0],ye=Math.abs(I-ae);for(let et of H){let je=Math.abs(I-et);je<ye&&(ae=et,ye=je)}I=ae}else{let ae=I>0?P/I:1.2,ye=Math.round(ae*2)/2;P=I*Math.max(1,ye)}I=Math.round(I),P=Math.round(P*10)/10,_e(M,"font-size",`${I}px`);let z=I>0?Math.round(P/I*1e3)/1e3:1.2;_e(M,"line-height",`${z}`),Ae({property:Y,fontSize:I,lineHeight:P});return}if(Je.current.isDragging){let m=Je.current,M=m.element;if(!M)return;let Y=m.side,I=m.original,P=I.top,H=I.right,z=I.bottom,ae=I.left;if(Y==="top"){let ye=m.startY-N;P=I.top+ye,le||(z=I.bottom+ye)}else if(Y==="bottom"){let ye=N-m.startY;z=I.bottom+ye,le||(P=I.top+ye)}else if(Y==="left"){let ye=m.startX-B;ae=I.left+ye,le||(H=I.right+ye)}else if(Y==="right"){let ye=B-m.startX;H=I.right+ye,le||(ae=I.left+ye)}P=Math.max(0,P),H=Math.max(0,H),z=Math.max(0,z),ae=Math.max(0,ae),F&&(P=Ln(P),H=Ln(H),z=Ln(z),ae=Ln(ae)),P=Math.round(P),H=Math.round(H),z=Math.round(z),ae=Math.round(ae),_e(M,"padding",`${P}px ${H}px ${z}px ${ae}px`),ut({side:Y,padding:{top:P,right:H,bottom:z,left:ae}});return}let j=qn(B,N);for(;j&&j.tagName==="A";)j=j.parentElement;{let M=[];j&&M.push(j),vt&&vt!==j&&M.push(vt);let Y=null,I=16,P=null;for(let H of M){let z=H.getBoundingClientRect(),ae=Qn(H),ye=[["top-left",z.left,z.top+ae["top-left"]],["top-right",z.right,z.top+ae["top-right"]],["bottom-right",z.right,z.bottom-ae["bottom-right"]],["bottom-left",z.left,z.bottom-ae["bottom-left"]]];for(let[et,je,Rt]of ye){let gt=Math.hypot(B-je,N-Rt);gt<I&&(I=gt,Y=et,P=H)}}if(Y&&P){Jt(P),wt(Y),_&&Q(null),q&&be(null),ct&&Nt(null),nt&&bt(null),bn(!1),mt&&gn(null),W&&ne(null);return}}vt&&Jt(null),tt&&wt(null);{let m=[];j&&mr(j)&&m.push(j);let M=(J=j==null?void 0:j.parentElement)!=null?J:null;for(;M&&M!==document.body&&m.length<3;)mr(M)&&m.push(M),M=M.parentElement;for(let Y of m){let P=Zn(Y).find(H=>B>=H.x&&B<=H.x+H.w&&N>=H.y&&N<=H.y+H.h);if(P){Nt(Y),bt(P.axis),bn(ci(Y,P.axis)),_&&Q(null),q&&be(null),mt&&gn(null),W&&ne(null);return}}}ct&&Nt(null),nt&&bt(null),bn(!1);{let M=[];j&&M.push(j),mt&&mt!==j&&M.push(mt);let Y=null,I=1/0,P=null;for(let H of M){if(!di(H))continue;let z=So(H);if(!z)continue;let ae=B>=z.left&&B<=z.right&&N>=z.top&&N<=z.bottom,ye=[["font-size",z.right,z.top+z.height/2],["line-height",z.left+z.width/2,z.bottom]];for(let[et,je,Rt]of ye){let gt=Math.hypot(B-je,N-Rt);(ae||gt<12)&&gt<I&&(I=gt,Y=et,P=H)}}Y&&P?(gn(P),ne(Y)):(mt&&gn(null),W&&ne(null))}if(j!==_&&Q(j),j){let m=vo(j),M=j.getBoundingClientRect(),Y=gs(B,N,M,m);be(Y)}else be(null);return}if(Ne){let{handle:B,originalPoints:N,hasMoved:le}=Ne,F=e.annotations.find(I=>I.id===Ne.annotationId);if(!F)return;let j="metaKey"in b,m=j&&(b.metaKey||b.ctrlKey),M=j&&b.shiftKey,Y;if(F.type==="line"){let I=N[0],P=N[N.length-1];B==="start"?Y=[x,P]:Y=[I,x]}else if(F.type==="freehand"){let I=Math.min(...N.map(He=>He.x)),P=Math.max(...N.map(He=>He.x)),H=Math.min(...N.map(He=>He.y)),z=Math.max(...N.map(He=>He.y)),ae=(I+P)/2,ye=(H+z)/2,et=P-I||1,je=z-H||1,Rt=et/je,gt=I,de=P,ve=H,Xe=z;switch(B){case"topLeft":gt=x.x,ve=x.y;break;case"topRight":de=x.x,ve=x.y;break;case"bottomLeft":gt=x.x,Xe=x.y;break;case"bottomRight":de=x.x,Xe=x.y;break}if(m)switch(B){case"topLeft":de=P+(I-gt),Xe=z+(H-ve);break;case"topRight":gt=I-(de-P),Xe=z+(H-ve);break;case"bottomLeft":de=P+(I-gt),ve=H-(Xe-z);break;case"bottomRight":gt=I-(de-P),ve=H-(Xe-z);break}if(M){let He=de-gt,ht=Xe-ve;if(Math.abs(He/ht)>Rt){let Ft=Math.abs(ht)*Rt*Math.sign(He);B==="topLeft"||B==="bottomLeft"?gt=de-Ft:de=gt+Ft}else{let Ft=Math.abs(He)/Rt*Math.sign(ht);B==="topLeft"||B==="topRight"?ve=Xe-Ft:Xe=ve+Ft}}let Ge=de-gt||1,st=Xe-ve||1;Y=N.map(He=>({x:gt+(He.x-I)/et*Ge,y:ve+(He.y-H)/je*st}))}else if(F.type==="circle"){let I=N[0],P=N[N.length-1],H=Math.min(I.x,P.x),z=Math.max(I.x,P.x),ae=Math.min(I.y,P.y),ye=Math.max(I.y,P.y),et=(H+z)/2,je=(ae+ye)/2,Rt=z-H,gt=ye-ae,de=H,ve=z,Xe=ae,Ge=ye;switch(B){case"top":if(Xe=x.y,m&&(Ge=je+(je-x.y)),M){let He=(Ge-Xe)*(Rt/gt)/2;de=et-He,ve=et+He}break;case"bottom":if(Ge=x.y,m&&(Xe=je-(x.y-je)),M){let He=(Ge-Xe)*(Rt/gt)/2;de=et-He,ve=et+He}break;case"left":if(de=x.x,m&&(ve=et+(et-x.x)),M){let He=(ve-de)*(gt/Rt)/2;Xe=je-He,Ge=je+He}break;case"right":if(ve=x.x,m&&(de=et-(x.x-et)),M){let He=(ve-de)*(gt/Rt)/2;Xe=je-He,Ge=je+He}break}Y=[{x:de,y:Xe},{x:ve,y:Ge}]}else{let I=N[0],P=N[N.length-1],H=Math.min(I.x,P.x),z=Math.max(I.x,P.x),ae=Math.min(I.y,P.y),ye=Math.max(I.y,P.y),et=(H+z)/2,je=(ae+ye)/2,Rt=z-H||1,gt=ye-ae||1,de=Rt/gt,ve=H,Xe=z,Ge=ae,st=ye;switch(B){case"topLeft":ve=x.x,Ge=x.y;break;case"topRight":Xe=x.x,Ge=x.y;break;case"bottomLeft":ve=x.x,st=x.y;break;case"bottomRight":Xe=x.x,st=x.y;break}if(m)switch(B){case"topLeft":Xe=z+(H-ve),st=ye+(ae-Ge);break;case"topRight":ve=H-(Xe-z),st=ye+(ae-Ge);break;case"bottomLeft":Xe=z+(H-ve),Ge=ae-(st-ye);break;case"bottomRight":ve=H-(Xe-z),Ge=ae-(st-ye);break}if(M){let He=Xe-ve,ht=st-Ge;if(Math.abs(He/ht)>de){let Ft=Math.abs(ht)*de*Math.sign(He);B==="topLeft"||B==="bottomLeft"?ve=Xe-Ft:Xe=ve+Ft}else{let Ft=Math.abs(He)/de*Math.sign(ht);B==="topLeft"||B==="topRight"?Ge=st-Ft:st=Ge+Ft}}Y=[{x:ve,y:Ge},{x:Xe,y:st}]}t({type:"RESIZE_ANNOTATION",payload:{id:Ne.annotationId,points:Y,saveUndo:!le}}),le||pt(h(f({},Ne),{hasMoved:!0}));return}if(pe&&((T=pe.annotation.status)!=null?T:"pending")==="pending"){let B=x.x-pe.startPoint.x,N=x.y-pe.startPoint.y;if((Math.abs(B)>2||Math.abs(N)>2)&&!pe.hasMoved)me(h(f({},pe),{hasMoved:!0,startPoint:x})),t({type:"MOVE_ANNOTATION",payload:{id:pe.annotation.id,delta:{x:B,y:N},saveUndo:!0}});else if(pe.hasMoved){let F=x.x-pe.startPoint.x,j=x.y-pe.startPoint.y;me(h(f({},pe),{startPoint:x})),t({type:"MOVE_ANNOTATION",payload:{id:pe.annotation.id,delta:{x:F,y:j}}})}return}!K||!e.isAnnotating||t({type:"CONTINUE_PATH",payload:x})},[K,e.isAnnotating,e.activeTool,pe,Ne,se,_,q,vt,tt,ct,nt,mt,W,uo,t,Ln,gs]),_r=At(b=>{var T,B,N,le,F,j;if(fn.current.isDragging){let m=fn.current,M=m.element;if(M&&m.selector&&m.elementInfo&&V){M instanceof HTMLElement&&(M.style.removeProperty("font-size"),M.style.removeProperty("line-height"),M.style.removeProperty("transition"));let Y=[];if(m.originalFontSize!==V.fontSize&&(_e(M,"font-size",`${V.fontSize}px`),Y.push({property:"font-size",original:`${m.originalFontSize}px`,modified:`${V.fontSize}px`})),m.originalLineHeight!==V.lineHeight){let I=m.originalFontSize>0?Math.round(m.originalLineHeight/m.originalFontSize*1e3)/1e3:1.2,P=V.fontSize>0?Math.round(V.lineHeight/V.fontSize*1e3)/1e3:1.2;_e(M,"line-height",`${P}`),Y.push({property:"line-height",original:`${I}`,modified:`${P}`})}Y.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:m.selector,durableSelector:(T=m.durableSelector)!=null?T:void 0,element:m.elementInfo,changes:Y}})}fn.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},Ae(null);return}if(at.current.isDragging){let m=at.current,M=m.element,Y="button"in b&&b.button===2;if(!m.hasMoved&&!Y&&M&&m.selector&&m.elementInfo){M instanceof HTMLElement&&M.style.removeProperty("transition");let I=["space-between","space-around","stretch","normal"],P=m.originalJustifyContent||"normal",H=I.indexOf(P),z=I[(H+1)%I.length],ae=[];z==="normal"?(_e(M,"justify-content","normal"),ae.push({property:"justify-content",original:m.originalJustifyContent,modified:"normal"})):z==="stretch"?(_e(M,"justify-content",z),_e(M,"row-gap","8px"),_e(M,"column-gap","8px"),ae.push({property:"justify-content",original:m.originalJustifyContent||"normal",modified:z}),m.originalRow!==8&&ae.push({property:"row-gap",original:`${m.originalRow}px`,modified:"8px"}),m.originalColumn!==8&&ae.push({property:"column-gap",original:`${m.originalColumn}px`,modified:"8px"})):(M instanceof HTMLElement&&(M.style.removeProperty("row-gap"),M.style.removeProperty("column-gap")),_e(M,"justify-content",z),ae.push({property:"justify-content",original:m.originalJustifyContent||"normal",modified:z}),m.originalRow>0&&ae.push({property:"row-gap",original:`${m.originalRow}px`,modified:"0px"}),m.originalColumn>0&&ae.push({property:"column-gap",original:`${m.originalColumn}px`,modified:"0px"})),ae.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:m.selector,durableSelector:(B=m.durableSelector)!=null?B:void 0,element:m.elementInfo,changes:ae}})}else if(m.hasMoved&&M&&m.selector&&m.elementInfo&&$e){M instanceof HTMLElement&&(M.style.removeProperty("row-gap"),M.style.removeProperty("column-gap"),M.style.removeProperty("transition"));let I=[];m.isAuto?(M instanceof HTMLElement&&M.style.removeProperty("justify-content"),_e(M,"justify-content","normal"),_e(M,"row-gap",`${$e.row}px`),_e(M,"column-gap",`${$e.column}px`),I.push({property:"justify-content",original:m.originalJustifyContent,modified:"normal"}),I.push({property:"row-gap",original:"0px",modified:`${$e.row}px`}),I.push({property:"column-gap",original:"0px",modified:`${$e.column}px`})):(m.originalRow!==$e.row&&(_e(M,"row-gap",`${$e.row}px`),I.push({property:"row-gap",original:`${m.originalRow}px`,modified:`${$e.row}px`})),m.originalColumn!==$e.column&&(_e(M,"column-gap",`${$e.column}px`),I.push({property:"column-gap",original:`${m.originalColumn}px`,modified:`${$e.column}px`}))),I.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:m.selector,durableSelector:(N=m.durableSelector)!=null?N:void 0,element:m.elementInfo,changes:I}})}at.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},Kt(null);return}if(We.current.isDragging){let m=We.current,M=m.element;if(M&&m.selector&&m.elementInfo&&St){M instanceof HTMLElement&&(M.style.removeProperty("border-top-left-radius"),M.style.removeProperty("border-top-right-radius"),M.style.removeProperty("border-bottom-right-radius"),M.style.removeProperty("border-bottom-left-radius"),M.style.removeProperty("transition"));let Y=["top-left","top-right","bottom-right","bottom-left"],I={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},P=[];for(let H of Y)m.original[H]!==St.radius[H]&&(_e(M,I[H],`${St.radius[H]}px`),P.push({property:I[H],original:`${m.original[H]}px`,modified:`${St.radius[H]}px`}));P.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:m.selector,durableSelector:(le=m.durableSelector)!=null?le:void 0,element:m.elementInfo,changes:P}})}We.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},pn(null);return}if(Je.current.isDragging){let m=Je.current,M=m.element,Y=m.selector,I=m.elementInfo;if(M&&Y&&I&&ge){let P=m.original,H=ge.padding;M instanceof HTMLElement&&(M.style.removeProperty("padding"),M.style.removeProperty("transition"));let z=[],ae=[{prop:"padding-top",origVal:P.top,newVal:H.top},{prop:"padding-right",origVal:P.right,newVal:H.right},{prop:"padding-bottom",origVal:P.bottom,newVal:H.bottom},{prop:"padding-left",origVal:P.left,newVal:H.left}];for(let{prop:ye,origVal:et,newVal:je}of ae)et!==je&&(_e(M,ye,`${je}px`),z.push({property:ye,original:`${et}px`,modified:`${je}px`}));z.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:Y,durableSelector:(F=m.durableSelector)!=null?F:void 0,element:I,changes:z}})}Je.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},ut(null);return}if(Ne){pt(null);return}if(pe){if(!pe.hasMoved&&pe.annotation.type==="text"&&((j=pe.annotation.status)!=null?j:"pending")==="pending"){let m=uo(b);G({id:pe.annotation.id,point:pe.annotation.points[0],text:pe.annotation.text||"",fontSize:pe.annotation.fontSize||12,isNew:!1,clickPoint:m,groupId:pe.annotation.groupId})}me(null);return}if(!K)return;let x=5;if(e.currentPath.length>=2){let m=e.currentPath[0],M=e.currentPath[e.currentPath.length-1],Y=Math.abs(M.x-m.x),I=Math.abs(M.y-m.y);if((e.activeTool==="line"?Math.sqrt(Y*Y+I*I)<x:Y<x&&I<x)&&["rectangle","circle","line"].includes(e.activeTool)){$(!1),t({type:"CANCEL_PATH"});return}}let J=oi(e.currentPath);if(e.activeTool==="rectangle"&&e.currentPath.length>=2){let m=e.currentPath[0],M=e.currentPath[e.currentPath.length-1],Y=Math.min(m.x,M.x),I=Math.max(m.y,M.y),P=e.strokeWidth/2,H=Math.random().toString(36).substring(2,9);Te({point:{x:Y-P+4,y:I+P+4},groupId:H}),$(!1),t({type:"FINISH_PATH",payload:{groupId:H,elements:J}});return}$(!1),t({type:"FINISH_PATH",payload:{elements:J}})},[K,pe,Ne,ge,St,$e,V,uo,t,e.activeTool,e.currentPath,e.strokeWidth]),$a=At(b=>{let x=b.target.value;or.current=b.target.selectionStart,G(J=>J&&h(f({},J),{text:x}))},[]),Wa=At(b=>{b.key==="Escape"?G(null):b.key==="Enter"&&!b.shiftKey&&(b.preventDefault(),po())},[po]),Ya=At(b=>{if(!C)return;let x=b.clipboardData.items,J=[];for(let T=0;T<x.length;T++){let B=x[T];if(B.type.startsWith("image/")){let N=B.getAsFile();N&&J.push(N)}}J.length>0&&(b.preventDefault(),G(T=>T?h(f({},T),{images:[...T.images||[],...J]}):null))},[C]),ja=At(b=>{if(!e.isAnnotating)return;if(e.activeTool==="hand"){b.preventDefault();let J=_||ct||vt||mt;if(J&&!It(J)){let T=en(J),B=sn(J);t({type:"SELECT_ELEMENT",payload:{el:J,info:h(f({},T),{selector:B})}})}return}b.preventDefault();let x=R.current;x&&(D.current=!0,x.style.pointerEvents="none",setTimeout(()=>{D.current&&(D.current=!1,x.style.pointerEvents="")},4e3))},[e.activeTool,e.isAnnotating,_,ct,vt,mt,t,It,R]);Gt(()=>{let b=e.annotations.filter(N=>N.linkedSelector);if(b.length===0)return;let x=null,J=()=>{var le,F,j;let N=[];for(let m of b){let M=document.querySelector(m.linkedSelector);if(!M&&((F=(le=m.elements)==null?void 0:le[0])!=null&&F.selector)&&m.linkedSelector.startsWith("[data-pm=")){try{M=document.querySelector(m.elements[0].selector)}catch(je){}if(M){let je=(j=m.linkedSelector.match(/data-pm="([^"]+)"/))==null?void 0:j[1];je&&M.setAttribute("data-pm",je)}}if(!M)continue;let Y=M.getBoundingClientRect(),I=e.styleModifications.some(je=>{try{return M.matches(je.selector)}catch(Rt){return!1}}),P=b.filter(je=>je.id!==m.id&&je.timestamp<m.timestamp&&je.linkedSelector===m.linkedSelector).length,H=(I?1:0)+P,z=Y.top>=to*(1+H)?"top-left":"bottom-left",ae=ta(Y,z,H),ye=m.points[0],et=z!==m.linkedAnchor;ye&&(et||Math.abs(ae.x-ye.x)>1||Math.abs(ae.y-ye.y)>1)&&N.push({id:m.id,point:ae,linkedAnchor:et?z:void 0})}N.length>0&&t({type:"UPDATE_LINKED_POSITIONS",payload:{updates:N}})},T=()=>{x&&cancelAnimationFrame(x),x=requestAnimationFrame(J)};J(),window.addEventListener("scroll",T,!0),window.addEventListener("resize",T,!0),window.addEventListener("load",T),document.fonts.ready.then(T);let B=new MutationObserver(T);return B.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",T,!0),window.removeEventListener("resize",T,!0),window.removeEventListener("load",T),B.disconnect(),x&&cancelAnimationFrame(x)}},[e.annotations,t]);let Ga=()=>{var b,x,J;if(!e.isAnnotating)return"default";if(Ne){let{handle:T}=Ne;return T==="start"||T==="end"?"move":T==="top"||T==="bottom"?"ns-resize":T==="left"||T==="right"?"ew-resize":T==="topLeft"||T==="bottomRight"?"nwse-resize":"nesw-resize"}if(e.activeTool==="text")return"text";if(e.activeTool==="hand"){let T=(b=$e==null?void 0:$e.axis)!=null?b:nt;if(T==="row")return"ns-resize";if(T==="column")return"ew-resize";if(St||tt)return"ns-resize";let B=(x=V==null?void 0:V.property)!=null?x:W;if(B==="font-size")return"ew-resize";if(B==="line-height")return"ns-resize";let N=(J=ge==null?void 0:ge.side)!=null?J:q;return N==="top"||N==="bottom"?"ns-resize":N==="left"||N==="right"?"ew-resize":"default"}return"crosshair"},Va={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:e.isAnnotating?"auto":"none",visibility:e.isAnnotating?"visible":"hidden",cursor:Ga()},Ho=At(()=>{let b=R.current;if(!b||!C)return{width:100,height:12*1.4,isWrapped:!1};let x=b.getContext("2d");if(!x)return{width:100,height:C.fontSize*1.4,isWrapped:!1};x.font=`${C.fontSize}px ${zt}`;let T=x.measureText("Type here...").width,B=C.text.split(`
9
+ `),N=B.length>0?Math.max(T,...B.map(M=>x.measureText(M||" ").width)):T,le=C.point.x-it.x,F=ho(le);if(F!==void 0&&N>F){let M=Kn(x,B,F),Y=Math.min(F,Math.max(T,...M.map(P=>x.measureText(P).width))),I=Math.max(1,M.length)*C.fontSize*1.4;return{width:Y,height:I,isWrapped:!0}}let m=Math.max(1,B.length)*C.fontSize*1.4;return{width:N,height:m,isWrapped:!1}},[C,R,it.x])(),Ua=C?Math.max(1,C.text.split(`
10
+ `).length)*C.fontSize*1.4+8:0,ys=Ho.height+8,Ja=Ho.isWrapped?ys-Ua:0,Xa=C?{position:"fixed",left:C.point.x-4-it.x,top:C.point.y-4-it.y-Ja,zIndex:9999,width:Ho.width+8,height:ys,padding:4,fontSize:C.fontSize,fontFamily:zt,color:"#ffffff",backgroundColor:e.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:Ho.isWrapped?"pre-wrap":"pre",wordBreak:Ho.isWrapped?"break-word":void 0}:{};return Ro(Lo,{children:[ot("canvas",{ref:A,id:"devtools-canvas",style:Va,onMouseDown:ms,onMouseMove:hs,onMouseUp:b=>_r(b),onMouseLeave:b=>{_r(b),Ve(null),rt(null)},onTouchStart:ms,onTouchMove:hs,onTouchEnd:b=>_r(b),onContextMenu:ja}),C&&Ro(Lo,{children:[ot("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),ot("textarea",{id:"devtools-text-input",ref:ze,value:C.text,onChange:$a,onKeyDown:Wa,onPaste:Ya,onBlur:po,placeholder:"Type here...",style:Xa}),C.images&&C.images.length>0&&Ro("div",{"data-devtools":!0,style:{position:"fixed",left:C.point.x-4-it.x,top:C.point.y-4-it.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:[C.images.length," image",C.images.length>1?"s":""," attached"]})]}),e.isAnnotating&&e.activeTool!=="hand"&&e.styleModifications.length>0&&ot(Pl,{styleModifications:e.styleModifications,isInspecting:!!e.inspectedElement,accentColor:e.activeColor,annotationGroupCount:new Set(e.annotations.map(b=>b.groupId||b.id)).size,dispatch:t,inFlightSelectors:o}),e.activeTool==="hand"&&e.isAnnotating&&e.styleModifications.length>0&&ot(Ol,{styleModifications:e.styleModifications,accentColor:e.activeColor}),e.isAnnotating&&ot(wl,{annotations:e.annotations,supersededAnnotations:Hn,inFlightIds:r,scrollX:it.x,scrollY:it.y,annotationGroupMap:nr,onViewThread:a,onSelectAnnotation:qe,canvasRef:R}),e.isAnnotating&&l&&ot(El,{annotations:e.annotations,supersededAnnotations:Hn,scrollX:it.x,scrollY:it.y,onReply:l,annotationGroupMap:nr,canvasRef:R}),e.isAnnotating&&i&&i.size>0&&ot(mi,{inFlightSelectorColors:i}),e.isAnnotating&&us&&ot(mi,{inFlightSelectorColors:us,animated:!1}),e.activeTool==="hand"&&e.isAnnotating&&($e?at.current.element:ct)&&ot(vi,{element:$e?at.current.element:ct,gap:$e?{row:$e.row,column:$e.column}:Wo(ct),accentColor:e.activeColor,hoveredAxis:nt,draggingAxis:(xs=$e==null?void 0:$e.axis)!=null?xs:null,cursorViewport:Mt,isAutoGap:qt,refreshKey:un}),e.activeTool==="hand"&&e.isAnnotating&&X&&ot(Zl,{element:X.target,modifier:X.modifier,accentColor:e.activeColor,refreshKey:un}),e.activeTool==="hand"&&e.isAnnotating&&!X&&(St?We.current.element:vt)&&ot(Il,{element:St?We.current.element:vt,radius:(vs=St==null?void 0:St.radius)!=null?vs:Qn(vt),accentColor:e.activeColor,hoveredCorner:tt,draggingCorner:(Ss=St==null?void 0:St.corner)!=null?Ss:null,cursorViewport:Mt}),e.activeTool==="hand"&&e.isAnnotating&&!X&&(V?fn.current.element:mt)&&ot(Ql,{element:V?fn.current.element:mt,fontSize:(ws=V==null?void 0:V.fontSize)!=null?ws:Yo(mt).fontSize,lineHeight:(Es=V==null?void 0:V.lineHeight)!=null?Es:Yo(mt).lineHeight,accentColor:e.activeColor,hoveredProperty:W,draggingProperty:(Cs=V==null?void 0:V.property)!=null?Cs:null,cursorViewport:Mt}),e.activeTool==="hand"&&e.isAnnotating&&!X&&(ge?Je.current.element:_)&&ot(Mi,{element:ge?Je.current.element:_,padding:(ks=ge==null?void 0:ge.padding)!=null?ks:vo(_),accentColor:e.activeColor,hoveredSide:q,draggingSide:(Ms=ge==null?void 0:ge.side)!=null?Ms:null,cursorViewport:Mt,refreshKey:V?V.fontSize+V.lineHeight*1e3:0}),e.activeTool==="inspector"&&e.isAnnotating&&ot(Lo,{children:se&&!e.inspectedElement&&(()=>{let b=!!fe||!!(C!=null&&C.linkedSelector)||e.annotations.some(x=>{if(!x.linkedSelector)return!1;try{return se.matches(x.linkedSelector)}catch(J){return!1}});return ot(Eo,{element:se,isSelected:!1,elementInfo:Tt,color:e.activeColor,hideTooltip:b})})()}),e.activeTool==="model"&&e.isAnnotating&&ee.size>0&&[...ee.entries()].map(([b,x])=>ot(Eo,{element:x.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:x.rootElement.tagName.toLowerCase(),reactComponent:b},color:"#8b5cf6"},b)),e.activeTool==="model"&&e.isAnnotating&&Rn&&ot(Eo,{element:Rn.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:Rn.rootElement.tagName.toLowerCase(),reactComponent:Rn.name},color:"#22c55e"}),e.activeTool==="model"&&e.isAnnotating&&tr.length>0&&tr.map((b,x)=>ot("div",{style:{position:"absolute",left:b.x,top:b.y,width:b.width,height:b.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:b.direction==="vertical"?Ro(Lo,{children:[ot("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ot("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ot("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ot("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:b.height<16?-6:"50%",transform:b.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(b.height)})]}):Ro(Lo,{children:[ot("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ot("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ot("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ot("div",{style:{position:"absolute",left:b.width<30?0:"50%",top:(b.width<30,void 0),bottom:"calc(50% + 4px)",transform:b.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(b.width)})]})},x)),e.activeTool==="model"&&e.isAnnotating&&Ee&&ot(Eo,{element:Ee.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:Ee.rootElement.tagName.toLowerCase(),reactComponent:Ee.name},color:g!=null&&g.has(Ee.name)?"#22c55e":"#8b5cf6"}),e.activeTool==="hand"&&e.isAnnotating&&e.inspectedElement&&Ro(Lo,{children:[Me&&Me!=="padding"&&Me!=="gap"&&(()=>{var F;let b=new Set(e.annotations.map(j=>j.groupId||j.id)).size,x=e.inspectedElement.info.selector,J=e.styleModifications.findIndex(j=>j.selector===x),T=J>=0?b+J+1:b+e.styleModifications.length+1,B=e.styleModifications.find(j=>j.selector===x),N=(F=B==null?void 0:B.changes.length)!=null?F:0,le=!!(B!=null&&B.captured);return ot(Eo,{element:e.inspectedElement.el,isSelected:!0,elementInfo:e.inspectedElement.info,color:le?"#999999":e.activeColor,annotationNumber:T,changeCount:N})})(),Me==="padding"&&ot(Mi,{element:e.inspectedElement.el,padding:vo(e.inspectedElement.el),accentColor:e.activeColor,hoveredSide:null,draggingSide:null}),Me==="gap"&&ot(vi,{element:e.inspectedElement.el,gap:Wo(e.inspectedElement.el),accentColor:e.activeColor,hoveredAxis:null,draggingAxis:null}),ot(Kl,{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:Ke,accentColor:e.activeColor,toolbarRef:O})]})]})}import{useCallback as dn,useEffect as Cn,useMemo as Xi,useRef as Pt,useState as qo}from"react";import{Circle as Mp,Component as Tp,Hand as Ip,MessageCircle as Rp,Pen as Lp,Slash as Ap,Square as Pp,Trash2 as Bp,Type as Op}from"lucide-react";import{useEffect as Lu,useRef as Au}from"react";function oa(e,t,n,r,o){let i=Au(0);Lu(()=>{if(!n.current||(localStorage.setItem(o.expanded,String(e)),!e))return;let s=t.annotations.length;(s>=i.current||s===0||!r)&&(localStorage.setItem(o.annotations,JSON.stringify(t.annotations)),i.current=s),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.annotations,t.styleModifications,t.spacingTokenChanges,t.activeTool,t.activeColor,t.strokeWidth,t.inspectedElement,r,n,o])}import{Component as Xu,createElement as Ku,useCallback as Br,useEffect as so,useRef as Ao,useState as cn}from"react";import{Link2 as qu}from"lucide-react";var Pu={colors:[],fonts:[],typeScale:[],spacing:[],radii:[],shadows:[],other:[],references:{}},Bu=/^#[0-9a-fA-F]{3,8}$/,Ou=/^(?:rgba?|hsla?|oklch|oklab|lch|lab)\(/,Du=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 ia(e){let t=e.trim().toLowerCase();return Bu.test(t)||Ou.test(t)||Du.has(t)}var Nu=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function Wi(e){return Nu.test(e.trim())}var ra=new Set(["serif","sans-serif","monospace","cursive","fantasy","system-ui","ui-serif","ui-sans-serif","ui-monospace","ui-rounded"]);function Fu(e){let t=e.trim().toLowerCase();return!!(ra.has(t)||t.includes(",")&&t.split(",").some(n=>ra.has(n.trim().replace(/['"]/g,""))))}function Hu(e){let t=e.trim().toLowerCase(),n=t.match(/\d+(\.\d+)?px/g);return!!(n&&n.length>=2&&(ia(t.replace(/[^#()\w,.\s/%]/g,"").split(/\s+/).pop()||"")||t.includes("rgb")||t.includes("hsl")||t.includes("#")))}var _u=/(?:^--(color|bg|fg|accent|border-color|text-color|surface|background|foreground))|(?:-(color|bg|fg)$)/i,zu=/^--(font-family|font|ff|family)/i,$u=/^--(font-size|text-size|fs|text-(?:xs|sm|base|md|lg|xl|2xl|3xl|4xl|5xl))/i,Wu=/^--(space|gap|padding|margin|inset)/i,Yu=/^--(radius|rounded|br|border-radius)/i,ju=/^--(shadow|elevation|drop-shadow)/i;function sa(e,t){let n=e.toLowerCase();return ju.test(n)?"shadows":Yu.test(n)?"radii":zu.test(n)?"fonts":$u.test(n)&&Wi(t)?"typeScale":_u.test(n)||ia(t)?"colors":Fu(t)?"fonts":Hu(t)?"shadows":Wu.test(n)&&Wi(t)||Wi(t)?"spacing":"other"}function la(e,t,n,r){if(e)for(let o of e){if(o instanceof CSSGroupingRule){la(o.cssRules,t,n,r);continue}if(o instanceof CSSStyleRule){let i=o.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&Gu(o.style,t,n,r)}}}var aa=/var\((--[^,)]+)/;function Gu(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=sa(i,s);r[l].push([i,s]);let c=e.getPropertyValue(i).trim().match(aa);c&&(r.references[i]=c[1])}}function Rr(e){let t=e.trim().match(/^(-?\d+(?:\.\d+)?)/);return t?parseFloat(t[1]):null}function Ar(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 ca(e){return e==="colors"?(t,n)=>{let r=Ar(t[1]),o=Ar(n[1]);return r!==null&&o!==null?r-o:t[0].localeCompare(n[0])}:e==="typeScale"||e==="spacing"||e==="radii"?(t,n)=>{let r=Rr(t[1]),o=Rr(n[1]);return r!==null&&o!==null?r-o:t[0].localeCompare(n[0])}:e==="other"?(t,n)=>{let r=Rr(t[1]),o=Rr(n[1]);return r!==null&&o!==null?r-o:t[0].localeCompare(n[0])}:(t,n)=>t[0].localeCompare(n[0])}function Vu(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 da(e){let t=new Map;for(let o of e){let i=Vu(o[0]),s=t.get(i);s||(s=[],t.set(i,s)),s.push(o)}let n=ca("colors");for(let o of t.values())o.sort(n);let r=[...t.entries()];return r.sort((o,i)=>{var a,c;let s=(a=Ar(o[1][0][1]))!=null?a:0,l=(c=Ar(i[1][0][1]))!=null?c:0;return s-l}),r}var Uu=["colors","fonts","typeScale","spacing","radii","shadows","other"],Lr=null,Ju=5e3;function ua(){if(typeof document=="undefined")return Pu;if(Lr&&Date.now()-Lr.timestamp<Ju)return Lr.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{la(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=sa(i,s);e[l].push([i,s]);let c=r.getPropertyValue(i).trim().match(aa);c&&(e.references[i]=c[1])}for(let o of Uu)e[o].sort(ca(o));return Lr={tokens:e,timestamp:Date.now()},e}import{Fragment as Po,jsx as Be,jsxs as Yt}from"react/jsx-runtime";var pa="popmelt-library-tab",Zu=/^#[0-9a-fA-F]{3,8}$/,Qu=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,ep=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),tp=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function ga(e){let t=e.trim();return Zu.test(t)||Qu.test(t)||ep.has(t.toLowerCase())}function np(e){return tp.test(e.trim())}function op(e){let t=e.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return t?parseFloat(t[1]):null}function ma(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(...ma(o,i))}else n.push([i,Array.isArray(o)?o.map(String).join(", "):String(o!=null?o:"")])}return n}function rp(e){return e.length===0?"generic":e.filter(([,r])=>ga(r)).length>e.length/2?"colors":e.filter(([,r])=>np(r)).length>e.length/2?"spacing":"generic"}var ip=h(f({position:"fixed",top:16,right:16,bottom:80,width:300,backgroundColor:"#ffffff"},Sn),{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"}),ha={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},sp=h(f({},ha),{color:"#1f2937",borderBottom:"1.5px solid #1f2937"});function lp({varName:e,value:t,reference:n}){return Be("div",{title:n?`${e} \u2192 ${n}
11
+ ${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&&Be(qu,{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)ga(i[1])?n.push(i):r.push(i);let o=da(n);return Yt(Po,{children:[o.map(([i,s])=>Yt("div",{style:{marginBottom:4},children:[Yt("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:2},children:[i,s.length>1?` (${s.length})`:""]}),Be("div",{style:{display:"flex",flexWrap:"wrap",gap:2},children:s.map(([l,a])=>Be(lp,{varName:l,value:a,reference:t[l]},l))})]},i)),r.length>0&&Be(Or,{entries:r})]})}var Pr=[0,1,2,4,8,12,16,20,24,28,32];function ap(e){if(e<=32){let t=Pr[0],n=Math.abs(e-t);for(let r=1;r<Pr.length;r++){let o=Math.abs(e-Pr[r]);o<n&&(t=Pr[r],n=o)}return t}return Math.round(e/8)*8}function cp({label:e,value:t,px:n,tokenPath:r,rawToken:o,onHover:i,onModify:s,onDelete:l}){let[a,c]=cn(!1),[d,u]=cn(null),p=Ao(!1),g=Ao(0),v=Ao(0),S=Ao([]),y=d!==null?d:n,w=d!==null?`${d}px`:t,O=d!==null,R=Br(E=>{E.preventDefault(),p.current=!0,g.current=E.clientX,v.current=n;let A=fr(o);S.current=ii(A);let D=$=>{let C=$.clientX-g.current,G=Math.max(0,Math.round(v.current+C));$.shiftKey&&(G=ap(G));for(let te of S.current)te.element.style.setProperty(te.property,G+"px","important");u(G),i==null||i({name:e,px:G,token:A})},K=()=>{window.removeEventListener("mousemove",D),window.removeEventListener("mouseup",K),document.body.style.cursor="",p.current=!1,u($=>{if($!==null&&$!==n&&s){let C=fr(o),G=C.bindings&&C.bindings.length>0,te;if(G){let fe=li(C.bindings,v.current,$);te=JSON.stringify(h(f({},C),{value:`${$}px`,bindings:fe}))}else{let fe=fl(S.current,v.current),Oe=gl(S.current);if(fe.length>0){let ze=li(fe,v.current,$);te=JSON.stringify({value:`${$}px`,property:Oe,bindings:ze})}else te=`${$}px`}let re=typeof o=="string"?o:JSON.stringify(o),Se=S.current.map(fe=>({selector:sn(fe.element),property:fe.property})),Te=hl(S.current,v.current,$);s({tokenPath:r,originalValue:re,currentValue:te,targets:Se,originalPx:v.current,currentPx:$},{id:Math.random().toString(36).substring(2,9),tokenPath:r,tokenName:e,originalPx:v.current,newPx:$,affectedElements:Te})}return $})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",D),window.addEventListener("mouseup",K)},[n,e,r,o,i,s]),k=fr(o);return Yt("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",fontSize:11,padding:"1px 0",cursor:"ew-resize",userSelect:"none"},onMouseEnter:()=>{p.current||(c(!0),i==null||i({name:e,px:y,token:k}))},onMouseLeave:()=>{p.current||(c(!1),i==null||i(null))},onMouseDown:R,children:[Be("span",{style:{color:a||O?"#FF0000":"#9ca3af"},children:e}),Yt("span",{style:{display:"flex",alignItems:"center",gap:4},children:[Be("span",{style:{color:a||O?"#FF0000":"#6b7280",fontWeight:600},children:w}),l&&a&&!O&&Be("button",{type:"button",title:"Remove token",onMouseDown:E=>{E.stopPropagation();let A=typeof o=="string"?o:JSON.stringify(o);l(r,A)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:E=>{E.currentTarget.style.color="#FF0000"},onMouseLeave:E=>{E.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function dp({entries:e,categoryKey:t,rawTokens:n,onHover:r,onModify:o,onDelete:i}){let s=[],l=[];for(let a of e){let c=op(a[1]);c!==null?s.push([a[0],a[1],c]):l.push(a)}return Yt(Po,{children:[s.length>0&&Be("div",{style:{display:"flex",flexDirection:"column",gap:2},children:s.map(([a,c,d])=>{let u=a.split(".").pop(),p=n?up(n,a):c,g=p&&typeof p=="object"&&"value"in p?p:c;return Be(cp,{label:u,value:c,px:d,tokenPath:`tokens.${t}.${a}`,rawToken:g,onHover:r,onModify:o,onDelete:i},a)})}),l.length>0&&Be(Or,{entries:l})]})}function up(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 Or({entries:e}){return Be("div",{style:{display:"flex",flexDirection:"column",gap:3},children:e.map(([t,n])=>Yt("div",{style:{fontSize:11},children:[Be("div",{style:{color:"#9ca3af",fontSize:10,marginBottom:1},children:t}),Be("div",{style:{color:"#1f2937",lineHeight:1.4,paddingLeft:8},children:n})]},t))})}function pp({entries:e,categoryKey:t,rawTokens:n,onSpacingHover:r,onModifyToken:o,onDeleteToken:i}){let s=rp(e);return s==="colors"?Be(ya,{entries:e}):s==="spacing"?Be(dp,{entries:e,categoryKey:t,rawTokens:n,onHover:r,onModify:o,onDelete:i}):Be(Or,{entries:e})}function fp(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,c=typeof a=="function"||typeof a=="object"?(a==null?void 0:a.displayName)||(a==null?void 0:a.name):null;if(typeof c=="string"){let d=c.toLowerCase();if(d===t){let u=f({},l.memoizedProps);return delete u.ref,{type:a,props:u}}if(!n){if(d.length>=4&&t.includes(d)){let u=f({},l.memoizedProps);delete u.ref,n={type:a,props:u}}else if(t.length>=4&&d.includes(t)){let u=f({},l.memoizedProps);delete u.ref,n={type:a,props:u}}}}l=l.return}}return n}var Yi=class extends Xu{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}},ba="popmelt-principles-collapsed";function gp(){try{let e=localStorage.getItem(ba);if(e)return new Set(JSON.parse(e))}catch(e){}return new Set}function mp(e){try{localStorage.setItem(ba,JSON.stringify([...e]))}catch(t){}}function hp({id:e,label:t,count:n,children:r,collapsed:o,onToggle:i}){return Yt("div",{style:{marginBottom:14},children:[Yt("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:[Be("span",{style:{display:"inline-flex",alignItems:"center",justifyContent:"center",width:10,fontSize:9,color:"#9ca3af",transform:o?"rotate(-90deg)":"rotate(0deg)"},children:"\u25BC"}),t,Be("span",{style:{fontWeight:400,color:"#9ca3af"},children:n})]}),!o&&r]})}var yp={colors:"Colors",fonts:"Fonts",typeScale:"Type Scale",spacing:"Spacing",radii:"Radii",shadows:"Shadows",other:"Other"},fa=["colors","fonts","typeScale","spacing","radii","shadows","other"];function bp(){let[e,t]=cn(null),[n,r]=cn(gp);so(()=>{t(ua())},[]);let o=Br(s=>{r(l=>{let a=new Set(l);return a.has(s)?a.delete(s):a.add(s),mp(a),a})},[]);return e?fa.some(s=>e[s].length>0)?Be(Po,{children:fa.map(s=>{let l=e[s];return l.length===0?null:Be(hp,{id:s,label:yp[s],count:l.length,collapsed:n.has(s),onToggle:o,children:s==="colors"?Be(ya,{entries:l,references:e.references}):Be(Or,{entries:l})},s)})}):Be("div",{style:{color:"#9ca3af",fontSize:11},children:"No :root tokens found."}):null}function xp({rules:e}){return!e||e.length===0?Be("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."}):Be(Po,{children:e.map((t,n)=>Yt("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[Yt("span",{style:{color:"#9ca3af",flexShrink:0},children:[n+1,"."]}),Be("span",{children:t})]},n))})}function vp({name:e,value:t,selected:n,highlighted:r,onRemove:o,onHover:i}){var $;let[s,l]=cn(!1),[a,c]=cn(!1),d=Ao(null),u=Ao(0),[p,g]=cn(0),[v,S]=cn(0),y=ma(t),w=($=y.find(([C])=>C==="description"))==null?void 0:$[1];so(()=>{if(!a&&!r){g(0),S(0),u.current=0;return}let C=bo(e);g(C.length)},[a,r,e]),so(()=>{n&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[n]);let O=n||r||a,R=n?"139,92,246":"34,197,94",k=n?"#8b5cf6":"#22c55e",E=O?`rgba(${R},0.06)`:void 0,A=O?`inset 0 0 0 1.5px rgba(${R},0.35)`:void 0,D=r||a,K=Br(()=>{let C=bo(e);if(C.length===0)return;let G=u.current%C.length;C[G].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),S(G),u.current=G+1,i==null||i({name:e,instanceIndex:G})},[e,i]);return Yt("div",{ref:d,onClick:K,onMouseEnter:()=>{c(!0),i==null||i({name:e,instanceIndex:0})},onMouseLeave:()=>{c(!1),i==null||i(null)},style:{marginBottom:8,background:E,padding:6,boxShadow:A,cursor:"pointer"},children:[Yt("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[Yt("div",{style:{display:"flex",alignItems:"center",gap:6,marginBottom:6},children:[Be("div",{style:{fontWeight:700,fontSize:11,letterSpacing:"0.05em",padding:"2px 6px",backgroundColor:D?k:"transparent",color:D?"#fff":"#6b7280"},children:e}),D&&p>1&&Yt("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[v+1,"/",p]})]}),o&&a&&Be("button",{type:"button",title:"Remove from model",onClick:C=>{C.stopPropagation(),o(e)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:C=>{C.currentTarget.style.color="#FF0000"},onMouseLeave:C=>{C.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),w&&Be("div",{style:{fontSize:11,color:D?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:w}),s?Be(pp,{entries:y.filter(([C])=>C!=="description"),categoryKey:""}):Be(Sp,{name:e,onNotFound:()=>l(!0),entries:y})]})}function Sp({name:e,onNotFound:t}){let[n,r]=cn(null),[o,i]=cn(!1);return so(()=>{let s=fp(e);s||t(),r(s),i(!0)},[e,t]),!o||!n?null:Be(Yi,{onError:t,children:Be("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:Be("div",{style:{zoom:.5,pointerEvents:"none"},children:Ku(n.type,n.props)})})})}function wp({components:e,selectedComponent:t,hoveredComponent:n,onRemove:r,onHover:o}){if(!e||Object.keys(e).length===0)return Be("div",{style:{color:"#9ca3af",fontSize:11},children:"No component patterns defined yet."});let i=new Set(Object.keys(e)),s=ni(i),l=Object.entries(e).sort(([a],[c])=>{var d,u;return((d=s.get(a))!=null?d:1/0)-((u=s.get(c))!=null?u:1/0)});return Be(Po,{children:l.map(([a,c])=>Be(vp,{name:a,value:c,selected:t===a,highlighted:n===a,onRemove:r,onHover:o},a))})}function xa({bridgeUrl:e,modelRefreshKey:t,onMouseEnter:n,onMouseLeave:r,selectedComponent:o,hoveredComponent:i,onComponentHover:s,onSpacingTokenHover:l,onModifySpacingToken:a,onDeleteSpacingToken:c,onComponentAdded:d,onComponentRemoved:u}){let[p,g]=cn(void 0),[v,S]=cn(!0),[y,w]=cn(()=>{try{let D=localStorage.getItem(pa);if(D==="patterns"||D==="principles"||D==="rules")return D}catch(D){}return"patterns"});so(()=>{go(e).then(D=>{g(D),S(!1)})},[e,t]),so(()=>{try{localStorage.setItem(pa,y)}catch(D){}},[y]),so(()=>{o&&(w("patterns"),go(e).then(D=>{D&&g(D)}))},[o,e]);let O=Br(D=>{g(K=>{if(!(K!=null&&K.components))return K;let G=K.components,{[D]:$}=G,C=_n(G,[lr(D)]);return h(f({},K),{components:C})}),u==null||u(D)},[u]),R=p==null?void 0:p.components,k=p==null?void 0:p.rules,E=R&&Object.keys(R).length>0,A=k&&k.length>0;return Yt("div",{style:ip,onMouseEnter:n,onMouseLeave:r,children:[Yt("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[Be("span",{children:"Model"}),Be("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"M"})]}),Be("div",{style:{display:"flex",gap:12,marginBottom:10,borderBottom:"1px solid rgba(0,0,0,0.08)",paddingBottom:6},children:["patterns","principles","rules"].map(D=>Be("button",{type:"button",style:y===D?sp:ha,onClick:()=>w(D),children:D.charAt(0).toUpperCase()+D.slice(1)},D))}),Be("div",{style:{flex:1,overflowY:"auto",minHeight:0},children:y==="principles"?Be(bp,{}):v?Be("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):!p||!E&&!A?Be("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):Yt(Po,{children:[y==="patterns"&&Be(wp,{components:R,selectedComponent:o,hoveredComponent:i,onRemove:O,onHover:s}),y==="rules"&&Be(xp,{rules:k})]})})]})}import{jsx as Bo}from"react/jsx-runtime";var Ep="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",Cp="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 ji({size:e=16,style:t}){return Bo("svg",{width:e,height:e,viewBox:"0 0 1200 1200",fill:"currentColor",stroke:"none",style:f({flexShrink:0},t),children:Bo("path",{d:Ep})})}function Gi({size:e=16,style:t}){return Bo("svg",{width:e,height:e,viewBox:"0 0 158.7128 157.296",fill:"currentColor",stroke:"none",style:f({flexShrink:0},t),children:Bo("path",{d:Cp})})}function Vi({provider:e,size:t=16,style:n}){return e==="codex"?Bo(Gi,{size:t,style:n}):Bo(ji,{size:t,style:n})}var Xo=[{id:"claude-opus-4-6",label:"Opus 4.6"},{id:"claude-sonnet-4-6",label:"Sonn 4.6"}],Ko=[{id:"gpt-5.3-codex",label:"Codex 5.3"},{id:"gpt-5.3-codex-spark",label:"Spark 5.3"},{id:"gpt-5.1-codex-mini",label:"Mini 5.1"}];var kp=[...Xo,...Ko];function Ui(e,t){if(!e)return t==="codex"?"Codex":"Claude Code";let n=kp.find(r=>r.id===e);return n?n.label:e.replace(/-\d{8,}$/,"")}import{jsx as va}from"react/jsx-runtime";var Dn={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#f3f4f6",bgHover:"#f9fafb",separator:"#e5e7eb"};function Nn({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?Dn.bgActive:"transparent",color:t?Dn.iconActive:Dn.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=Dn.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 Ji(){return va("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as lo,jsx as ie,jsxs as xt}from"react/jsx-runtime";var ao=[{type:"rectangle",icon:Pp,label:"Rectangle",shortcut:"R"},{type:"circle",icon:Mp,label:"Oval",shortcut:"O"},{type:"line",icon:Ap,label:"Line",shortcut:"L"},{type:"freehand",icon:Lp,label:"Pen",shortcut:"P"}],Dp=new Set(ao.map(e=>e.type));function Np(e,t,n,r,o,i,s,l){let a=(e-o)*(r-i)-(n-o)*(t-i),c=(e-s)*(i-l)-(o-s)*(t-l),d=(e-n)*(l-r)-(s-n)*(t-r),u=a<0||c<0||d<0,p=a>0||c>0||d>0;return!(u&&p)}function Fp(){let e=window.innerWidth-16,t=e-326,n=window.innerHeight-80;return{left:t,right:e,y:n}}var Hp=[{type:"text",icon:Op,label:"Text",shortcut:"T"}],Sa={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.
11
12
 
12
- Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},zu=h(f({position:"fixed",bottom:16,right:16,zIndex:9999,display:"flex",alignItems:"center",backgroundColor:"#ffffff"},bn),{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)"}),Hi="devtools-toolbar-expanded",Fi="devtools-annotations",Ni="devtools-style-modifications",_i="devtools-active-tool",Jl="devtools-active-color",Xl="devtools-stroke-width",Kl="devtools-inspected-element",zi="devtools-spacing-changes",$u={expanded:Hi,annotations:Fi,styleMods:Ni,spacingChanges:zi,tool:_i,color:Jl,stroke:Xl,inspected:Kl};function Wu(){return re("svg",{width:"16",height:"16",viewBox:"0 0 1200 1200",fill:"currentColor",stroke:"none",children:re("path",{d:"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"})})}function Yu(){return re("svg",{width:"16",height:"16",viewBox:"0 0 158.7128 157.296",fill:"currentColor",stroke:"none",children:re("path",{d:"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 Zl({state:e,dispatch:t,onScreenshot:o,onSendToClaude:r,hasActiveJobs:n,activeJobColor:i,onCrosshairHover:s,onClear:l,provider:a="claude",onProviderChange:c,availableProviders:d,modelIndex:u=0,modelCount:p=2,modelLabel:g="Opus 4.6",onModelChange:S,onViewThread:v,isThreadPanelOpen:b,mcpStatus:w,onInstallMcp:O,mcpJustInstalled:A,bridgeUrl:k,isBridgeConnected:E,modelSelectedComponent:I,modelCanvasHoveredComponent:$,onModelComponentHover:q,onSpacingTokenHover:j,onModifySpacingToken:T,onDeleteSpacingToken:D,modelRefreshKey:K,onModelComponentAdded:ee,onModelComponentRemoved:me,onMouseEnter:ve,toolbarRef:ae}){let[Re,We]=jo(()=>typeof window=="undefined"?!1:localStorage.getItem(Hi)==="true"),[Me,ne]=jo(0),Ae=Bt(0),G=Bt(0),oe=Bt(e.isAnnotating),Ee=Bt(!1),ce=Bt(typeof window!="undefined"?localStorage.getItem(_i):null),Ke=Bt(typeof window!="undefined"?localStorage.getItem(Jl):null),Te=Bt(typeof window!="undefined"?localStorage.getItem(Xl):null),{charIndex:xe}=gr(!!n),[ge,Ge]=jo(null),xt=Bt(!1),dt=Bt(null),Ve=Bt(null),z=Bt({x:0,y:0}),ie=Bt(null),Q=Bt(null),Se=Bt(null),Le=cn(()=>{ie.current=null,Q.current=null,Se.current&&(clearTimeout(Se.current),Se.current=null)},[]),Ze=cn(W=>{Ve.current&&(clearTimeout(Ve.current),Ve.current=null),xt.current?(ie.current=W,Q.current=f({},z.current),Se.current&&clearTimeout(Se.current),Se.current=setTimeout(()=>{ie.current&&(Ge(ie.current),Le())},300)):(dt.current&&clearTimeout(dt.current),dt.current=setTimeout(()=>{xt.current=!0,Ge(W),dt.current=null},500))},[Le]),fe=cn(()=>{Le(),dt.current&&(clearTimeout(dt.current),dt.current=null),Ve.current=setTimeout(()=>{xt.current=!1,Ge(null)},150)},[Le]),lt=cn(W=>{if(z.current={x:W.clientX,y:W.clientY},ie.current&&Q.current){let te=Q.current,U=Nu();Fu(W.clientX,W.clientY,te.x,te.y,U.left,U.y,U.right,U.y)||(Ge(ie.current),Le())}},[Le]),Qe=Di(()=>{let W=(d!=null?d:[]).map(te=>te==="claude"?"Claude":te==="codex"?"Codex":te);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}]}},[d]);zl(Re,e,Ee,!!n,$u),wn(()=>{if(localStorage.getItem(Hi)==="true"&&!e.isAnnotating){if(Re||We(!0),t({type:"SET_TOOL",payload:ce.current||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),Ke.current&&t({type:"SET_COLOR",payload:Ke.current}),Te.current){let he=parseFloat(Te.current);isNaN(he)||t({type:"SET_STROKE_WIDTH",payload:he})}let te=localStorage.getItem(Fi);if(te)try{let he=JSON.parse(te);Array.isArray(he)&&he.length>0&&t({type:"RESTORE_ANNOTATIONS",payload:{annotations:he}})}catch(he){}let U=localStorage.getItem(Ni);if(U)try{let he=JSON.parse(U);Array.isArray(he)&&he.length>0&&(t({type:"RESTORE_STYLE_MODIFICATIONS",payload:he}),cr(he))}catch(he){}let Pe=localStorage.getItem(zi);if(Pe)try{let he=JSON.parse(Pe);Array.isArray(he)&&he.length>0&&t({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:he})}catch(he){}let Be=localStorage.getItem(Kl);if(Be)try{let{selector:he,info:It}=JSON.parse(Be);if(he){let R=Jt(he);if(R){let Z=It||h(f({},qt(R)),{selector:he});t({type:"SELECT_ELEMENT",payload:{el:R,info:Z}})}}}catch(he){}}return Ee.current=!0,()=>{Ee.current=!1}},[]);let Tt=Bt(e.styleModifications);wn(()=>{let W=Tt.current,te=e.styleModifications;W!==te&&(dr(W),cr(te),Tt.current=te)},[e.styleModifications]),wn(()=>{let W=oe.current;oe.current=e.isAnnotating,W&&!e.isAnnotating&&Re&&We(!1)},[e.isAnnotating,Re]);let Ot=Bt(Re);Ot.current=Re,wn(()=>{let W=U=>{if(U.key==="Meta"||U.key==="Control"){let Pe=Date.now();if(Pe-Ae.current<300){if(G.current++,G.current>=2){if(Ot.current)t({type:"SET_ANNOTATING",payload:!1}),We(!1);else{let It=localStorage.getItem(_i);t({type:"SET_TOOL",payload:It||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),We(!0)}G.current=0}}else G.current=1;Ae.current=Pe}else G.current=0},te=U=>{U.key!=="Meta"&&U.key!=="Control"&&(G.current=0)};return window.addEventListener("keydown",W),window.addEventListener("keyup",te),()=>{window.removeEventListener("keydown",W),window.removeEventListener("keyup",te)}},[t]);let st=cn(W=>{Le(),t({type:"SET_TOOL",payload:W}),e.isAnnotating||t({type:"SET_ANNOTATING",payload:!0}),xt.current=!1,Ge(null),dt.current&&(clearTimeout(dt.current),dt.current=null),Ve.current&&(clearTimeout(Ve.current),Ve.current=null)},[t,e.isAnnotating,Le]),at=cn(async()=>{window.focus(),await o()},[o]),Dt=cn(async()=>{r&&await r()},[r]),tt=cn(()=>{t({type:"SET_ANNOTATING",payload:!1}),We(!1)},[t]),vt=cn(()=>{dr(e.styleModifications),document.querySelectorAll("[data-pm]").forEach(W=>W.removeAttribute("data-pm")),t({type:"CLEAR"}),t({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(Fi),localStorage.removeItem(Ni),localStorage.removeItem(zi),St(null),l==null||l()},[t,e.styleModifications,l]),[$e,en]=jo(29),Kt=Bt(null),rn=Bt(null),mn=Bt(!1),En=cn(W=>{let te=W.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return te&&te[1]?parseFloat(te[1]):null},[]);wn(()=>{mn.current=!0;let W=`oklch(0.628 0.258 ${$e})`;t({type:"SET_COLOR",payload:W}),requestAnimationFrame(()=>{mn.current=!1})},[$e,t]),wn(()=>{if(mn.current)return;let W=En(e.activeColor);W!==null&&Math.abs(W-$e)>.5&&en(W)},[e.activeColor,En,$e]);let J=e.annotations.length>0;wn(()=>{let W=rn.current;if(!W||!J)return;let te=U=>{U.preventDefault(),U.stopPropagation();let Pe=U.deltaY>0?-1:1,Be=(($e+Pe)%360+360)%360,he=`oklch(0.628 0.258 ${Be})`;en(Be),e.selectedAnnotationIds.length>0&&t({type:"UPDATE_ANNOTATION_COLOR",payload:{id:e.lastSelectedId||e.selectedAnnotationIds[0],color:he}})};return W.addEventListener("wheel",te,{passive:!1}),()=>W.removeEventListener("wheel",te)},[J,e.selectedAnnotationIds,e.lastSelectedId,$e,t]);let Ie=Bt(!1),Fe=cn(()=>{Ie.current=!1,Kt.current=setTimeout(()=>{Ie.current=!0,en(29)},500)},[]),ft=cn(()=>{Kt.current&&(clearTimeout(Kt.current),Kt.current=null)},[]);wn(()=>()=>{Kt.current&&clearTimeout(Kt.current),Se.current&&clearTimeout(Se.current)},[]);let Lt=Di(()=>fr(e.annotations),[e.annotations]),pt=Di(()=>{let W=[],te=new Set;for(let U of e.annotations)if(!Lt.has(U))if(U.groupId){if(!te.has(U.groupId)){te.add(U.groupId);let Pe=e.annotations.filter(he=>he.groupId===U.groupId&&!Lt.has(he)),Be=Pe.find(he=>he.type!=="text")||Pe[0];W.push({id:Be.id,annotations:Pe})}}else W.push({id:U.id,annotations:[U]});return W},[e.annotations,Lt]),[bt,St]=jo(null),dn=pt.length+e.styleModifications.length;wn(()=>{(dn===0||bt!==null&&bt>=dn)&&St(null)},[dn,bt]),wn(()=>{if(e.selectedAnnotationIds.length===0&&!e.inspectedElement){St(null);return}if(e.selectedAnnotationIds.length>0){let W=e.selectedAnnotationIds[0],te=pt.findIndex(U=>U.id===W||U.annotations.some(Pe=>Pe.id===W));te>=0&&te!==bt&&St(te)}},[e.selectedAnnotationIds,e.inspectedElement,pt]);let $t=cn(()=>{var te;if(dn===0)return;let W;if(bt===null?W=0:W=(bt+1)%dn,St(W),W<pt.length){let U=pt[W];if(!U)return;t({type:"SELECT_ELEMENT",payload:null}),t({type:"SELECT_ANNOTATION",payload:{id:U.id}});let Pe=U.annotations.find(ke=>ke.type!=="text")||U.annotations[0];if(U.annotations.some(ke=>ke.linkedSelector))t({type:"SET_TOOL",payload:"inspector"});else if(Pe!=null&&Pe.type&&Pe.type!=="text"&&Pe.type!=="inspector"){t({type:"SET_TOOL",payload:Pe.type});let ke=to.findIndex(Ne=>Ne.type===Pe.type);ke>=0&&ne(ke)}if(Pe!=null&&Pe.color){t({type:"SET_COLOR",payload:Pe.color});let ke=En(Pe.color);ke!==null&&en(ke)}let he=U.annotations.flatMap(ke=>ke.points);if(he.length===0)return;let It=Math.min(...he.map(ke=>ke.x)),R=Math.max(...he.map(ke=>ke.x)),Z=Math.min(...he.map(ke=>ke.y)),de=Math.max(...he.map(ke=>ke.y)),Oe=(It+R)/2,ye=(Z+de)/2;if(window.scrollTo({left:Oe-window.innerWidth/2,top:ye-window.innerHeight/2,behavior:"smooth"}),b&&v){let ke=(te=U.annotations.find(Ne=>Ne.threadId))==null?void 0:te.threadId;ke&&v(ke)}}else{let U=W-pt.length,Pe=e.styleModifications[U];if(!Pe)return;let Be=Jt(Pe.selector);if(!Be)return;t({type:"SELECT_ANNOTATION",payload:{id:null}}),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SELECT_ELEMENT",payload:{el:Be,info:Pe.element}});let he=Be.getBoundingClientRect(),It=he.left+he.width/2+window.scrollX,R=he.top+he.height/2+window.scrollY;window.scrollTo({left:It-window.innerWidth/2,top:R-window.innerHeight/2,behavior:"smooth"})}},[pt,e.styleModifications,dn,bt,t,En,b,v]);wn(()=>{if(!Re)return;let W=te=>{var he;let U=document.activeElement;for(;(he=U==null?void 0:U.shadowRoot)!=null&&he.activeElement;)U=U.shadowRoot.activeElement;if((U==null?void 0:U.tagName)==="INPUT"||(U==null?void 0:U.tagName)==="TEXTAREA"||U!=null&&U.isContentEditable)return;if((te.metaKey||te.ctrlKey)&&te.key==="Enter"){r&&(e.annotations.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(It=>!It.captured).length>0)&&(te.preventDefault(),Dt());return}if((te.metaKey||te.ctrlKey)&&(te.key==="c"||te.key==="C"||te.code==="KeyC")){(e.annotations.length>0||e.styleModifications.length>0)&&(te.preventDefault(),window.focus(),at());return}if((te.metaKey||te.ctrlKey)&&(te.key==="Backspace"||te.key==="Delete")){te.preventDefault(),vt();return}if(te.metaKey||te.ctrlKey||te.altKey)return;let Pe={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand"};if(te.key.toLowerCase()==="m"){te.preventDefault(),st("model");return}let Be=Pe[te.key.toLowerCase()];if(Be){te.preventDefault();let It=to.findIndex(R=>R.type===Be);It>=0&&ne(It),st(Be)}};return window.addEventListener("keydown",W),()=>window.removeEventListener("keydown",W)},[Re,st,at,Dt,r,vt,e.annotations.length,e.styleModifications.length,e.spacingTokenChanges,ge]);let kt=h(f({},zu),{borderRadius:0,padding:Re?"0 8px":"0",width:Re?"auto":48,height:48,gap:0,justifyContent:Re?"flex-start":"center"}),hn=E===!1?"rgba(239, 68, 68, 0.4)":n&&i?i:Pn.iconActive;return Re?yt(eo,{children:[re("style",{children:`
13
+ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},_p=h(f({position:"fixed",bottom:16,right:16,zIndex:9999,display:"flex",alignItems:"center",backgroundColor:"#ffffff"},Sn),{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)"}),Ki="devtools-toolbar-expanded",qi="devtools-annotations",Zi="devtools-style-modifications",Qi="devtools-active-tool",wa="devtools-active-color",Ea="devtools-stroke-width",Ca="devtools-inspected-element",es="devtools-spacing-changes",zp={expanded:Ki,annotations:qi,styleMods:Zi,spacingChanges:es,tool:Qi,color:wa,stroke:Ea,inspected:Ca};function ka({state:e,dispatch:t,onScreenshot:n,onSendToClaude:r,hasActiveJobs:o,activeJobColor:i,onCrosshairHover:s,onClear:l,provider:a="claude",onProviderChange:c,availableProviders:d,modelIndex:u=0,modelCount:p=2,modelLabel:g="Opus 4.6",onModelChange:v,onViewThread:S,isThreadPanelOpen:y,mcpStatus:w,onInstallMcp:O,mcpJustInstalled:R,bridgeUrl:k,isBridgeConnected:E,modelSelectedComponent:A,modelCanvasHoveredComponent:D,onModelComponentHover:K,onSpacingTokenHover:$,onModifySpacingToken:C,onDeleteSpacingToken:G,modelRefreshKey:te,onModelComponentAdded:re,onModelComponentRemoved:Se,onMouseEnter:Te,toolbarRef:fe}){let[Oe,ze]=qo(()=>typeof window=="undefined"?!1:localStorage.getItem(Ki)==="true"),[Ce,oe]=qo(0),Ie=Pt(0),Re=Pt(0),Ee=Pt(e.isAnnotating),U=Pt(!1),ee=Pt(typeof window!="undefined"?localStorage.getItem(Qi):null),Le=Pt(typeof window!="undefined"?localStorage.getItem(wa):null),Fe=Pt(typeof window!="undefined"?localStorage.getItem(Ea):null),{charIndex:xe}=Sr(!!o),[se,Ve]=qo(null),Tt=Pt(!1),rt=Pt(null),Je=Pt(null),_=Pt({x:0,y:0}),Q=Pt(null),q=Pt(null),be=Pt(null),Me=dn(()=>{Q.current=null,q.current=null,be.current&&(clearTimeout(be.current),be.current=null)},[]),Ke=dn(W=>{Je.current&&(clearTimeout(Je.current),Je.current=null),Tt.current?(Q.current=W,q.current=f({},_.current),be.current&&clearTimeout(be.current),be.current=setTimeout(()=>{Q.current&&(Ve(Q.current),Me())},300)):(rt.current&&clearTimeout(rt.current),rt.current=setTimeout(()=>{Tt.current=!0,Ve(W),rt.current=null},500))},[Me]),ge=dn(()=>{Me(),rt.current&&(clearTimeout(rt.current),rt.current=null),Je.current=setTimeout(()=>{Tt.current=!1,Ve(null)},150)},[Me]),ut=dn(W=>{if(_.current={x:W.clientX,y:W.clientY},Q.current&&q.current){let ne=q.current,V=Fp();Np(W.clientX,W.clientY,ne.x,ne.y,V.left,V.y,V.right,V.y)||(Ve(Q.current),Me())}},[Me]),Qe=Xi(()=>{let W=(d!=null?d:[]).map(ne=>ne==="claude"?"Claude":ne==="codex"?"Codex":ne);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}]}},[d]);oa(Oe,e,U,!!o,zp),Cn(()=>{if(localStorage.getItem(Ki)==="true"&&!e.isAnnotating){if(Oe||ze(!0),t({type:"SET_TOOL",payload:ee.current||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),Le.current&&t({type:"SET_COLOR",payload:Le.current}),Fe.current){let he=parseFloat(Fe.current);isNaN(he)||t({type:"SET_STROKE_WIDTH",payload:he})}let ne=localStorage.getItem(qi);if(ne)try{let he=JSON.parse(ne);Array.isArray(he)&&he.length>0&&t({type:"RESTORE_ANNOTATIONS",payload:{annotations:he}})}catch(he){}let V=localStorage.getItem(Zi);if(V)try{let he=JSON.parse(V);Array.isArray(he)&&he.length>0&&(t({type:"RESTORE_STYLE_MODIFICATIONS",payload:he}),hr(he))}catch(he){}let Ae=localStorage.getItem(es);if(Ae)try{let he=JSON.parse(Ae);Array.isArray(he)&&he.length>0&&t({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:he})}catch(he){}let De=localStorage.getItem(Ca);if(De)try{let{selector:he,info:It}=JSON.parse(De);if(he){let Zt=Xt(he);if(Zt){let L=It||h(f({},en(Zt)),{selector:he});t({type:"SELECT_ELEMENT",payload:{el:Zt,info:L}})}}}catch(he){}}return U.current=!0,()=>{U.current=!1}},[]);let Mt=Pt(e.styleModifications);Cn(()=>{let W=Mt.current,ne=e.styleModifications;W!==ne&&(yr(W),hr(ne),Mt.current=ne)},[e.styleModifications]),Cn(()=>{let W=Ee.current;Ee.current=e.isAnnotating,W&&!e.isAnnotating&&Oe&&ze(!1)},[e.isAnnotating,Oe]);let Dt=Pt(Oe);Dt.current=Oe,Cn(()=>{let W=V=>{if(V.key==="Meta"||V.key==="Control"){let Ae=Date.now();if(Ae-Ie.current<300){if(Re.current++,Re.current>=2){if(Dt.current)t({type:"SET_ANNOTATING",payload:!1}),ze(!1);else{let It=localStorage.getItem(Qi);t({type:"SET_TOOL",payload:It||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),ze(!0)}Re.current=0}}else Re.current=1;Ie.current=Ae}else Re.current=0},ne=V=>{V.key!=="Meta"&&V.key!=="Control"&&(Re.current=0)};return window.addEventListener("keydown",W),window.addEventListener("keyup",ne),()=>{window.removeEventListener("keydown",W),window.removeEventListener("keyup",ne)}},[t]);let at=dn(W=>{Me(),t({type:"SET_TOOL",payload:W}),e.isAnnotating||t({type:"SET_ANNOTATING",payload:!0}),Tt.current=!1,Ve(null),rt.current&&(clearTimeout(rt.current),rt.current=null),Je.current&&(clearTimeout(Je.current),Je.current=null)},[t,e.isAnnotating,Me]),ct=dn(async()=>{window.focus(),await n()},[n]),Nt=dn(async()=>{r&&await r()},[r]),nt=dn(()=>{t({type:"SET_ANNOTATING",payload:!1}),ze(!1)},[t]),bt=dn(()=>{yr(e.styleModifications),document.querySelectorAll("[data-pm]").forEach(W=>W.removeAttribute("data-pm")),t({type:"CLEAR"}),t({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(qi),localStorage.removeItem(Zi),localStorage.removeItem(es),St(null),l==null||l()},[t,e.styleModifications,l]),[$e,Kt]=qo(29),qt=Pt(null),bn=Pt(null),un=Pt(!1),xn=dn(W=>{let ne=W.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return ne&&ne[1]?parseFloat(ne[1]):null},[]);Cn(()=>{un.current=!0;let W=`oklch(0.628 0.258 ${$e})`;t({type:"SET_COLOR",payload:W}),requestAnimationFrame(()=>{un.current=!1})},[$e,t]),Cn(()=>{if(un.current)return;let W=xn(e.activeColor);W!==null&&Math.abs(W-$e)>.5&&Kt(W)},[e.activeColor,xn,$e]);let X=e.annotations.length>0;Cn(()=>{let W=bn.current;if(!W||!X)return;let ne=V=>{V.preventDefault(),V.stopPropagation();let Ae=V.deltaY>0?-1:1,De=(($e+Ae)%360+360)%360,he=`oklch(0.628 0.258 ${De})`;Kt(De),e.selectedAnnotationIds.length>0&&t({type:"UPDATE_ANNOTATION_COLOR",payload:{id:e.lastSelectedId||e.selectedAnnotationIds[0],color:he}})};return W.addEventListener("wheel",ne,{passive:!1}),()=>W.removeEventListener("wheel",ne)},[X,e.selectedAnnotationIds,e.lastSelectedId,$e,t]);let ke=Pt(!1),We=dn(()=>{ke.current=!1,qt.current=setTimeout(()=>{ke.current=!0,Kt(29)},500)},[]),vt=dn(()=>{qt.current&&(clearTimeout(qt.current),qt.current=null)},[]);Cn(()=>()=>{qt.current&&clearTimeout(qt.current),be.current&&clearTimeout(be.current)},[]);let Jt=Xi(()=>vr(e.annotations),[e.annotations]),tt=Xi(()=>{let W=[],ne=new Set;for(let V of e.annotations)if(!Jt.has(V))if(V.groupId){if(!ne.has(V.groupId)){ne.add(V.groupId);let Ae=e.annotations.filter(he=>he.groupId===V.groupId&&!Jt.has(he)),De=Ae.find(he=>he.type!=="text")||Ae[0];W.push({id:De.id,annotations:Ae})}}else W.push({id:V.id,annotations:[V]});return W},[e.annotations,Jt]),[wt,St]=qo(null),pn=tt.length+e.styleModifications.length;Cn(()=>{(pn===0||wt!==null&&wt>=pn)&&St(null)},[pn,wt]),Cn(()=>{if(e.selectedAnnotationIds.length===0&&!e.inspectedElement){St(null);return}if(e.selectedAnnotationIds.length>0){let W=e.selectedAnnotationIds[0],ne=tt.findIndex(V=>V.id===W||V.annotations.some(Ae=>Ae.id===W));ne>=0&&ne!==wt&&St(ne)}},[e.selectedAnnotationIds,e.inspectedElement,tt]);let fn=dn(()=>{var ne;if(pn===0)return;let W;if(wt===null?W=0:W=(wt+1)%pn,St(W),W<tt.length){let V=tt[W];if(!V)return;t({type:"SELECT_ELEMENT",payload:null}),t({type:"SELECT_ANNOTATION",payload:{id:V.id}});let Ae=V.annotations.find(me=>me.type!=="text")||V.annotations[0];if(V.annotations.some(me=>me.linkedSelector))t({type:"SET_TOOL",payload:"inspector"});else if(Ae!=null&&Ae.type&&Ae.type!=="text"&&Ae.type!=="inspector"){t({type:"SET_TOOL",payload:Ae.type});let me=ao.findIndex(Pe=>Pe.type===Ae.type);me>=0&&oe(me)}if(Ae!=null&&Ae.color){t({type:"SET_COLOR",payload:Ae.color});let me=xn(Ae.color);me!==null&&Kt(me)}let he=V.annotations.flatMap(me=>me.points);if(he.length===0)return;let It=Math.min(...he.map(me=>me.x)),Zt=Math.max(...he.map(me=>me.x)),L=Math.min(...he.map(me=>me.y)),Z=Math.max(...he.map(me=>me.y)),ce=(It+Zt)/2,pe=(L+Z)/2;if(window.scrollTo({left:ce-window.innerWidth/2,top:pe-window.innerHeight/2,behavior:"smooth"}),y&&S){let me=(ne=V.annotations.find(Pe=>Pe.threadId))==null?void 0:ne.threadId;me&&S(me)}}else{let V=W-tt.length,Ae=e.styleModifications[V];if(!Ae)return;let De=Xt(Ae.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:Ae.element}});let he=De.getBoundingClientRect(),It=he.left+he.width/2+window.scrollX,Zt=he.top+he.height/2+window.scrollY;window.scrollTo({left:It-window.innerWidth/2,top:Zt-window.innerHeight/2,behavior:"smooth"})}},[tt,e.styleModifications,pn,wt,t,xn,y,S]);Cn(()=>{if(!Oe)return;let W=ne=>{var he;let V=document.activeElement;for(;(he=V==null?void 0:V.shadowRoot)!=null&&he.activeElement;)V=V.shadowRoot.activeElement;if((V==null?void 0:V.tagName)==="INPUT"||(V==null?void 0:V.tagName)==="TEXTAREA"||V!=null&&V.isContentEditable)return;if((ne.metaKey||ne.ctrlKey)&&ne.key==="Enter"){r&&(e.annotations.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(It=>!It.captured).length>0)&&(ne.preventDefault(),Nt());return}if((ne.metaKey||ne.ctrlKey)&&(ne.key==="c"||ne.key==="C"||ne.code==="KeyC")){(e.annotations.length>0||e.styleModifications.length>0)&&(ne.preventDefault(),window.focus(),ct());return}if((ne.metaKey||ne.ctrlKey)&&(ne.key==="Backspace"||ne.key==="Delete")){ne.preventDefault(),bt();return}if(ne.metaKey||ne.ctrlKey||ne.altKey)return;let Ae={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand"};if(ne.key.toLowerCase()==="m"){ne.preventDefault(),at("model");return}let De=Ae[ne.key.toLowerCase()];if(De){ne.preventDefault();let It=ao.findIndex(Zt=>Zt.type===De);It>=0&&oe(It),at(De)}};return window.addEventListener("keydown",W),()=>window.removeEventListener("keydown",W)},[Oe,at,ct,Nt,r,bt,e.annotations.length,e.styleModifications.length,e.spacingTokenChanges,se]);let mt=h(f({},_p),{borderRadius:0,padding:Oe?"0 8px":"0",width:Oe?"auto":48,height:48,gap:0,justifyContent:Oe?"flex-start":"center"}),gn=E===!1?"rgba(239, 68, 68, 0.4)":o&&i?i:Dn.iconActive;return Oe?xt(lo,{children:[ie("style",{children:`
13
14
  @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
14
- `}),re("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),!b&&(ge==="model"||e.activeTool==="model")&&re(Gl,{bridgeUrl:k,selectedComponent:I,hoveredComponent:$,onComponentHover:q,onSpacingTokenHover:j,onModifySpacingToken:T,onDeleteSpacingToken:D,modelRefreshKey:K,onComponentAdded:ee,onComponentRemoved:me,onMouseEnter:()=>{Le(),Ve.current&&(clearTimeout(Ve.current),Ve.current=null)},onMouseLeave:e.activeTool==="model"?void 0:fe}),ge&&ge!=="model"&&(ge==="provider"||Ul[ge])&&(()=>{let W=ge==="provider"?Qe:Ul[ge];return yt("div",{onMouseEnter:ge==="collapse"?()=>{Le(),Ve.current&&(clearTimeout(Ve.current),Ve.current=null)}:void 0,onMouseLeave:ge==="collapse"?fe:void 0,style:f(h(f({position:"fixed",bottom:80,right:16,width:300,backgroundColor:"#ffffff"},bn),{boxSizing:"content-box",zIndex:10001,fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12}),ge!=="collapse"?{pointerEvents:"none"}:{}),children:[ge==="collapse"&&re("div",{style:{marginBottom:10},children:re("svg",{width:"48",height:"48",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:re("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"})})}),yt("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[re("span",{children:W.name}),W.keys[0]&&re("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:W.keys[0].key})]}),re("div",{style:{color:"#6b7280",lineHeight:1.5,marginBottom:ge==="collapse"?0:10},children:W.desc.split(`
15
+ `}),ie("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),!y&&(se==="model"||e.activeTool==="model")&&ie(xa,{bridgeUrl:k,selectedComponent:A,hoveredComponent:D,onComponentHover:K,onSpacingTokenHover:$,onModifySpacingToken:C,onDeleteSpacingToken:G,modelRefreshKey:te,onComponentAdded:re,onComponentRemoved:Se,onMouseEnter:()=>{Me(),Je.current&&(clearTimeout(Je.current),Je.current=null)},onMouseLeave:e.activeTool==="model"?void 0:ge}),se&&se!=="model"&&(se==="provider"||Sa[se])&&(()=>{let W=se==="provider"?Qe:Sa[se];return xt("div",{onMouseEnter:se==="collapse"?()=>{Me(),Je.current&&(clearTimeout(Je.current),Je.current=null)}:void 0,onMouseLeave:se==="collapse"?ge:void 0,style:f(h(f({position:"fixed",bottom:80,right:16,width:300,backgroundColor:"#ffffff"},Sn),{boxSizing:"content-box",zIndex:10001,fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12}),se!=="collapse"?{pointerEvents:"none"}:{}),children:[se==="collapse"&&ie("div",{style:{marginBottom:10},children:ie("svg",{width:"48",height:"48",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:ie("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"})})}),xt("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[ie("span",{children:W.name}),W.keys[0]&&ie("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:W.keys[0].key})]}),ie("div",{style:{color:"#6b7280",lineHeight:1.5,marginBottom:se==="collapse"?0:10},children:W.desc.split(`
15
16
 
16
- `).map((te,U)=>re("p",{style:{margin:0,marginTop:U>0?8:0},children:te},U))}),W.usage.map((te,U)=>yt("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[re("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),re("span",{children:te})]},U)),ge==="collapse"&&w&&Object.keys(w).length>0&&(()=>{let te=Object.entries(w).filter(([,Be])=>Be.found&&!Be.disabled).map(([Be])=>Be.charAt(0).toUpperCase()+Be.slice(1)),U=Object.entries(w).filter(([,Be])=>!Be.found).map(([Be])=>Be);if(te.length===0&&U.length===0)return null;let Pe=U.map(Be=>Be.charAt(0).toUpperCase()+Be.slice(1));return yt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8,display:"flex",alignItems:"center",gap:6,fontSize:11},children:[re("span",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:te.length>0?"#22c55e":"rgba(0,0,0,0.2)",flexShrink:0}}),te.length>0?yt("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[yt("span",{children:["Taste library ready in ",te.join(", "),A&&" \u2014 restart CLI to activate"]}),U.length>0&&O&&!A&&yt("button",{type:"button",onClick:Be=>{Be.stopPropagation(),O()},style:{border:"none",background:"transparent",color:"#3b82f6",fontSize:10,fontWeight:500,fontFamily:"inherit",padding:0,cursor:"pointer",pointerEvents:"auto",textDecoration:"underline",textUnderlineOffset:2},children:["+ ",Pe.join(", ")]})]}):U.length>0&&O?yt("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[re("span",{children:"Connect Popmelt MCP"}),re("button",{type:"button",onClick:Be=>{Be.stopPropagation(),O()},style:{border:"none",background:"#1f2937",color:"#fff",fontSize:10,fontWeight:600,fontFamily:"inherit",padding:"2px 8px",cursor:"pointer",pointerEvents:"auto"},children:"Connect"})]}):null]})})(),W.keys.length>1&&re("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((te,U)=>yt("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:te.accent?"#fff":"#6b7280"},children:[re("code",{style:{fontSize:10,backgroundColor:te.accent?e.activeColor:"rgba(0,0,0,0.06)",color:te.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:te.key}),re("span",{style:{color:te.accent?e.activeColor:void 0,fontWeight:te.accent?600:void 0},children:te.desc})]},U))})]})})(),yt("div",{ref:W=>{ae&&(ae.current=W)},id:"devtools-toolbar",style:kt,onMouseEnter:ve,onMouseMove:lt,children:[(e.annotations.length>0||e.styleModifications.length>0)&&yt(eo,{children:[re("span",{onMouseEnter:()=>Ze("clear"),onMouseLeave:fe,children:re(Bn,{onClick:vt,title:"Clear all (\u2318\u232B)",children:re(Ou,{size:17,strokeWidth:1.5})})}),re(Oi,{})]}),yt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[re("span",{onMouseEnter:()=>Ze("inspector"),onMouseLeave:fe,children:re(Bn,{active:e.isAnnotating&&e.activeTool==="inspector",siblingActive:e.isAnnotating,onClick:()=>st("inspector"),children:re(Ru,{size:20,strokeWidth:1.5})})}),re("span",{onMouseEnter:()=>Ze("hand"),onMouseLeave:fe,children:re(Bn,{active:e.isAnnotating&&e.activeTool==="hand",siblingActive:e.isAnnotating,onClick:()=>st("hand"),children:yt("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[re(Iu,{size:20,strokeWidth:1.5}),e.styleModifications.filter(W=>!W.captured).length>0&&re("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=to[Me],te=W.icon,U=e.isAnnotating&&Hu.has(e.activeTool);return re("span",{onMouseEnter:()=>Ze(W.type),onMouseLeave:fe,children:yt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[re(Bn,{active:U,siblingActive:e.isAnnotating,onClick:()=>st(W.type),children:re(te,{size:20,strokeWidth:1.5})}),re("button",{type:"button",onClick:()=>{let Pe=(Me+1)%to.length;ne(Pe),st(to[Pe].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&&!U?.5:1,transition:"opacity 150ms ease"},children:to.map((Pe,Be)=>re("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:Be===Me?Pn.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},Be))})]})})})(),_u.map(({type:W,icon:te,label:U,shortcut:Pe})=>re("span",{onMouseEnter:()=>Ze(W),onMouseLeave:fe,children:re(Bn,{active:e.isAnnotating&&e.activeTool===W,siblingActive:e.isAnnotating,onClick:()=>st(W),children:re(te,{size:20,strokeWidth:1.5})})},W)),re("span",{onMouseEnter:()=>Ze("model"),onMouseLeave:fe,children:re(Bn,{active:e.isAnnotating&&e.activeTool==="model",siblingActive:e.isAnnotating,onClick:()=>st("model"),children:re(Lu,{size:17,strokeWidth:1.5})})})]}),re(Oi,{}),yt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(pt.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(W=>!W.captured).length>0)&&(()=>{var Be;let W=bt!==null&&bt<pt.length?pt[bt]:null,te=e.annotations.length>0&&e.annotations.every(he=>he.status&&he.status!=="pending"),U=bt!==null?(Be=W==null?void 0:W.annotations.some(he=>he.status&&he.status!=="pending"))!=null?Be:!1:te,Pe=`oklch(0.628 0.258 ${$e})`;return re("span",{onMouseEnter:()=>Ze("counter"),onMouseLeave:fe,children:re("button",{ref:rn,type:"button",onClick:()=>{if(Ie.current){Ie.current=!1;return}$t()},onMouseDown:Fe,onMouseUp:ft,onMouseLeave:ft,title:"Cycle through annotations \u2022 Scroll to change color \u2022 Long press to reset",style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,padding:0,marginRight:4,border:"none",borderRadius:0,background:U?"#999999":Pe,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:bt!==null?bt+1:pt.length+e.styleModifications.length+e.spacingTokenChanges.filter(he=>!he.captured).length})})})(),c&&re("span",{onMouseEnter:()=>Ze("provider"),onMouseLeave:fe,style:{display:"contents"},children:yt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[re(Bn,{onClick:()=>c(a==="claude"?"codex":"claude"),children:a==="claude"?re(Wu,{}):re(Yu,{})}),yt("button",{type:"button",onClick:()=>{let W=(u+1)%p;S==null||S(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:Pn.iconDefault,whiteSpace:"nowrap"},children:[re("span",{children:g}),re("span",{style:{display:"flex",flexDirection:"column",gap:2},children:Array.from({length:p},(W,te)=>re("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:te===u?Pn.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},te))})]})]})}),re("div",{onMouseEnter:W=>{s==null||s(!0),W.currentTarget.style.opacity="1",Ze("collapse")},onMouseLeave:W=>{s==null||s(!1),W.currentTarget.style.opacity=n?"1":"0.3",fe()},style:{display:"inline-flex",opacity:n?1:.3,transition:"opacity 150ms ease"},children:re(Bn,{onClick:tt,title:"Collapse (\u2318\u2318)",children:n?re("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:hn,children:xe===1?yt(eo,{children:[re("circle",{cx:"7",cy:"7",r:"2"}),re("circle",{cx:"17",cy:"7",r:"2"}),re("circle",{cx:"7",cy:"17",r:"2"}),re("circle",{cx:"17",cy:"17",r:"2"})]}):yt(eo,{children:[re("circle",{cx:"12",cy:"6",r:"2"}),re("circle",{cx:"6",cy:"12",r:"2"}),re("circle",{cx:"18",cy:"12",r:"2"}),re("circle",{cx:"12",cy:"18",r:"2"})]})}):yt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:hn,strokeWidth:"1.5",strokeLinecap:"round",style:{transform:"rotate(45deg)"},children:[re("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),re("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),re("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),re("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})]})]}):yt(eo,{children:[re("style",{children:"@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }"}),re("div",{ref:W=>{ae&&(ae.current=W)},id:"devtools-toolbar",style:h(f({},kt),{overflow:"visible",opacity:.5,transition:"opacity 150ms ease"}),onMouseEnter:W=>{W.currentTarget.style.opacity="1",ve==null||ve()},onMouseLeave:W=>W.currentTarget.style.opacity="0.5",children:re("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:n?re("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:hn,children:xe===1?yt(eo,{children:[re("circle",{cx:"7",cy:"7",r:"2"}),re("circle",{cx:"17",cy:"7",r:"2"}),re("circle",{cx:"7",cy:"17",r:"2"}),re("circle",{cx:"17",cy:"17",r:"2"})]}):yt(eo,{children:[re("circle",{cx:"12",cy:"6",r:"2"}),re("circle",{cx:"6",cy:"12",r:"2"}),re("circle",{cx:"18",cy:"12",r:"2"}),re("circle",{cx:"12",cy:"18",r:"2"})]})}):yt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:hn,strokeWidth:"1.5",strokeLinecap:"round",children:[re("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),re("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),re("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),re("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})}import{useEffect as Io,useRef as ju,useState as $i}from"react";import{Fragment as Ql,jsx as Mt,jsxs as Go}from"react/jsx-runtime";var Gu={position:"fixed",bottom:86,right:16,zIndex:9999,display:"flex",flexDirection:"column"},Vu=24,Uu=6,Ju=Vu-Uu,Xu=8,ql=h(f({display:"flex",alignItems:"center",gap:6,padding:"4px 10px",backgroundColor:"rgba(255, 255, 255, 0.85)"},bn),{backdropFilter:"blur(32px)",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,color:"#1f2937",whiteSpace:"nowrap",transition:"transform 200ms ease, opacity 200ms ease"});function Ku(e){var s;let t=e.filter(l=>l.type==="tool_use");if(t.length===0)return"Starting\u2026";let o=t[t.length-1],r=String(o.data.tool||""),n=o.data.file?String(o.data.file):null,i=n?(s=n.split("/").pop())!=null?s:n: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":return"Running command";case"Glob":return"Searching files";case"Grep":return"Searching code";default:return r?`Using ${r}`:"Working\u2026"}}function Zu(e,t){if(e.some(n=>n.type==="question"&&n.data.jobId===t))return"Has a question";let r=e.find(n=>n.type==="done"&&n.data.jobId===t);if(r){let n=r.data.resolutions;if(Array.isArray(n)&&n.length>0)return"Applied changes"}return"Replied"}function qu({color:e}){let[t,o]=$i(0);return Io(()=>{let r=setInterval(()=>{o(n=>(n+1)%2)},250);return()=>clearInterval(r)},[]),Mt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?Go(Ql,{children:[Mt("circle",{cx:"7",cy:"7",r:"2"}),Mt("circle",{cx:"17",cy:"7",r:"2"}),Mt("circle",{cx:"7",cy:"17",r:"2"}),Mt("circle",{cx:"17",cy:"17",r:"2"})]}):Go(Ql,{children:[Mt("circle",{cx:"12",cy:"6",r:"2"}),Mt("circle",{cx:"6",cy:"12",r:"2"}),Mt("circle",{cx:"18",cy:"12",r:"2"}),Mt("circle",{cx:"12",cy:"18",r:"2"})]})})}function Qu({color:e}){return Mt("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:e,opacity:.6}})}function ep({color:e}){return Mt("span",{style:{color:e,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function tp(){return Mt("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function ea({bridge:e,inFlightJobs:t,isVisible:o,onHover:r,clearSignal:n,onViewThread:i,onCancel:s,onHoverJob:l,isConnected:a,dismissedThreadIds:c}){let[d,u]=$i([]),[p,g]=$i(!1);Io(()=>{n>0&&u([])},[n]),Io(()=>{!c||c.size===0||u(b=>{let w=b.filter(O=>!O.threadId||!c.has(O.threadId));return w.length===b.length?b:w})},[c]),Io(()=>{u(b=>{var k;let w=new Set(b.map(E=>E.jobId)),O=!1,A=b.map(E=>{let I=t[E.jobId];return I&&(!E.threadId||E.color==="#888")?(O=!0,h(f({},E),{threadId:E.threadId||I.threadId,color:E.color==="#888"?I.color:E.color})):E});for(let[E,I]of Object.entries(t))w.has(E)||(A.push({jobId:E,color:I.color,status:"queued",threadId:I.threadId}),O=!0);for(let E of e.activeJobIds)if(!w.has(E)&&!A.some(I=>I.jobId===E)){let I=e.events.find($=>$.type==="job_started"&&$.data.jobId===E);A.push({jobId:E,color:"#888",status:"working",threadId:(k=I==null?void 0:I.data)==null?void 0:k.threadId}),O=!0}return O?A:b})},[t,e.activeJobIds]),Io(()=>{if(e.activeJobIds.length===0)return;let b=new Set(e.activeJobIds);u(w=>w.map(O=>b.has(O.jobId)&&O.status!=="done"&&O.status!=="error"?h(f({},O),{status:"working"}):O))},[e.activeJobIds]);let S=ju(null);if(Io(()=>{let b=e.lastCompletedJobId;if(!b||b===S.current)return;S.current=b;let w=e.events.find(I=>I.type==="error"&&(I.data.jobId===b||e.status==="error")),O=!!w,A=O?void 0:Zu(e.events,b),k=w?String(w.data.message||""):void 0,E=w?!!w.data.cancelled:void 0;u(I=>I.map($=>$.jobId===b?h(f({},$),{status:O?"error":"done",doneLabel:A,errorMessage:k,cancelled:E}):$))},[e.lastCompletedJobId,e.events,e.status]),!o||d.length===0&&a!==!1)return null;let v=!p&&d.length>1;return Go("div",{style:Gu,"data-devtools":!0,onMouseEnter:()=>{g(!0),r(!0)},onMouseLeave:()=>{g(!1),r(!1),l==null||l(null)},children:[[...d].reverse().map((b,w)=>{var E;let O=w===d.length-1,A=d.length-1-w,k=b.status==="working"?Ku(e.events.filter(I=>I.data.jobId===b.jobId)):b.status==="queued"?"Queued":b.status==="done"?b.doneLabel||"Done":b.cancelled?"Cancelled":(E=b.errorMessage)!=null&&E.includes("Timed out")?"Timed out":"Error";return Mt("div",{style:{position:"relative",zIndex:w,marginBottom:v?O?0:-Ju:O?0:Xu,transform:v?`scale(${Math.max(.94,1-A*.02)})`:"scale(1)",opacity:v?Math.max(.5,1-A*.15):1,transformOrigin:"bottom right",transition:"margin-bottom 250ms ease, transform 250ms ease, opacity 250ms ease"},children:Go("div",{style:h(f({},ql),{cursor:b.threadId&&i?"pointer":void 0}),onClick:b.threadId&&i?()=>i(b.threadId):void 0,onMouseEnter:l?()=>l(b.jobId):void 0,onMouseLeave:l?()=>l(null):void 0,title:b.errorMessage||void 0,children:[b.status==="working"&&Mt(qu,{color:b.color}),b.status==="queued"&&Mt(Qu,{color:b.color}),b.status==="done"&&Mt(ep,{color:b.color}),b.status==="error"&&Mt(tp,{}),Mt("span",{style:{color:b.status==="queued"?"#9ca3af":"#1f2937"},children:k}),b.status==="working"&&s&&Mt("button",{onClick:I=>{I.stopPropagation(),s(b.jobId)},style:{background:"none",border:"none",cursor:"pointer",color:"#9ca3af",fontSize:14,padding:"0 4px",lineHeight:1},title:"Cancel",children:"\xD7"}),(b.status==="done"||b.status==="error")&&Mt("button",{onClick:I=>{I.stopPropagation(),u($=>$.filter(q=>q.jobId!==b.jobId))},style:{background:"none",border:"none",cursor:"pointer",color:"#9ca3af",fontSize:14,padding:"0 4px",lineHeight:1},title:"Dismiss",children:"\xD7"})]})},b.jobId)}),a===!1&&d.length>0&&Go("div",{style:h(f({},ql),{color:"#9ca3af"}),children:[Mt("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#f59e0b"}}),Mt("span",{children:"Reconnecting\u2026"})]})]})}import{Fragment as rp,jsx as op,jsxs as ip}from"react/jsx-runtime";var np=`
17
+ `).map((ne,V)=>ie("p",{style:{margin:0,marginTop:V>0?8:0},children:ne},V))}),W.usage.map((ne,V)=>xt("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[ie("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),ie("span",{children:ne})]},V)),se==="collapse"&&w&&Object.keys(w).length>0&&(()=>{let ne=Object.entries(w).filter(([,De])=>De.found&&!De.disabled).map(([De])=>De.charAt(0).toUpperCase()+De.slice(1)),V=Object.entries(w).filter(([,De])=>!De.found).map(([De])=>De);if(ne.length===0&&V.length===0)return null;let Ae=V.map(De=>De.charAt(0).toUpperCase()+De.slice(1));return xt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8,display:"flex",alignItems:"center",gap:6,fontSize:11},children:[ie("span",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:ne.length>0?"#22c55e":"rgba(0,0,0,0.2)",flexShrink:0}}),ne.length>0?xt("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[xt("span",{children:["Taste library ready in ",ne.join(", "),R&&" \u2014 restart CLI to activate"]}),V.length>0&&O&&!R&&xt("button",{type:"button",onClick:De=>{De.stopPropagation(),O()},style:{border:"none",background:"transparent",color:"#3b82f6",fontSize:10,fontWeight:500,fontFamily:"inherit",padding:0,cursor:"pointer",pointerEvents:"auto",textDecoration:"underline",textUnderlineOffset:2},children:["+ ",Ae.join(", ")]})]}):V.length>0&&O?xt("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[ie("span",{children:"Connect Popmelt MCP"}),ie("button",{type:"button",onClick:De=>{De.stopPropagation(),O()},style:{border:"none",background:"#1f2937",color:"#fff",fontSize:10,fontWeight:600,fontFamily:"inherit",padding:"2px 8px",cursor:"pointer",pointerEvents:"auto"},children:"Connect"})]}):null]})})(),W.keys.length>1&&ie("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((ne,V)=>xt("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:ne.accent?"#fff":"#6b7280"},children:[ie("code",{style:{fontSize:10,backgroundColor:ne.accent?e.activeColor:"rgba(0,0,0,0.06)",color:ne.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:ne.key}),ie("span",{style:{color:ne.accent?e.activeColor:void 0,fontWeight:ne.accent?600:void 0},children:ne.desc})]},V))})]})})(),xt("div",{ref:W=>{fe&&(fe.current=W)},id:"devtools-toolbar",style:mt,onMouseEnter:Te,onMouseMove:ut,children:[(e.annotations.length>0||e.styleModifications.length>0)&&xt(lo,{children:[ie("span",{onMouseEnter:()=>Ke("clear"),onMouseLeave:ge,children:ie(Nn,{onClick:bt,title:"Clear all (\u2318\u232B)",children:ie(Bp,{size:17,strokeWidth:1.5})})}),ie(Ji,{})]}),xt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[ie("span",{onMouseEnter:()=>Ke("inspector"),onMouseLeave:ge,children:ie(Nn,{active:e.isAnnotating&&e.activeTool==="inspector",siblingActive:e.isAnnotating,onClick:()=>at("inspector"),children:ie(Rp,{size:20,strokeWidth:1.5})})}),ie("span",{onMouseEnter:()=>Ke("hand"),onMouseLeave:ge,children:ie(Nn,{active:e.isAnnotating&&e.activeTool==="hand",siblingActive:e.isAnnotating,onClick:()=>at("hand"),children:xt("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[ie(Ip,{size:20,strokeWidth:1.5}),e.styleModifications.filter(W=>!W.captured).length>0&&ie("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=ao[Ce],ne=W.icon,V=e.isAnnotating&&Dp.has(e.activeTool);return ie("span",{onMouseEnter:()=>Ke(W.type),onMouseLeave:ge,children:xt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[ie(Nn,{active:V,siblingActive:e.isAnnotating,onClick:()=>at(W.type),children:ie(ne,{size:20,strokeWidth:1.5})}),ie("button",{type:"button",onClick:()=>{let Ae=(Ce+1)%ao.length;oe(Ae),at(ao[Ae].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&&!V?.5:1,transition:"opacity 150ms ease"},children:ao.map((Ae,De)=>ie("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:De===Ce?Dn.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},De))})]})})})(),Hp.map(({type:W,icon:ne,label:V,shortcut:Ae})=>ie("span",{onMouseEnter:()=>Ke(W),onMouseLeave:ge,children:ie(Nn,{active:e.isAnnotating&&e.activeTool===W,siblingActive:e.isAnnotating,onClick:()=>at(W),children:ie(ne,{size:20,strokeWidth:1.5})})},W)),ie("span",{onMouseEnter:()=>Ke("model"),onMouseLeave:ge,children:ie(Nn,{active:e.isAnnotating&&e.activeTool==="model",siblingActive:e.isAnnotating,onClick:()=>at("model"),children:ie(Tp,{size:17,strokeWidth:1.5})})})]}),ie(Ji,{}),xt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(tt.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(W=>!W.captured).length>0)&&(()=>{var De;let W=wt!==null&&wt<tt.length?tt[wt]:null,ne=e.annotations.length>0&&e.annotations.every(he=>he.status&&he.status!=="pending"),V=wt!==null?(De=W==null?void 0:W.annotations.some(he=>he.status&&he.status!=="pending"))!=null?De:!1:ne,Ae=`oklch(0.628 0.258 ${$e})`;return ie("span",{onMouseEnter:()=>Ke("counter"),onMouseLeave:ge,children:ie("button",{ref:bn,type:"button",onClick:()=>{if(ke.current){ke.current=!1;return}fn()},onMouseDown:We,onMouseUp:vt,onMouseLeave:vt,title:"Cycle through annotations \u2022 Scroll to change color \u2022 Long press to reset",style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,padding:0,marginRight:4,border:"none",borderRadius:0,background:V?"#999999":Ae,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:wt!==null?wt+1:tt.length+e.styleModifications.length+e.spacingTokenChanges.filter(he=>!he.captured).length})})})(),c&&ie("span",{onMouseEnter:()=>Ke("provider"),onMouseLeave:ge,style:{display:"contents"},children:xt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[ie(Nn,{onClick:()=>c(a==="claude"?"codex":"claude"),children:a==="claude"?ie(ji,{}):ie(Gi,{})}),xt("button",{type:"button",onClick:()=>{let W=(u+1)%p;v==null||v(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:Dn.iconDefault,whiteSpace:"nowrap"},children:[ie("span",{children:g}),ie("span",{style:{display:"flex",flexDirection:"column",gap:2},children:Array.from({length:p},(W,ne)=>ie("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:ne===u?Dn.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},ne))})]})]})}),ie("div",{onMouseEnter:W=>{s==null||s(!0),W.currentTarget.style.opacity="1",Ke("collapse")},onMouseLeave:W=>{s==null||s(!1),W.currentTarget.style.opacity=o?"1":"0.3",ge()},style:{display:"inline-flex",opacity:o?1:.3,transition:"opacity 150ms ease"},children:ie(Nn,{onClick:nt,title:"Collapse (\u2318\u2318)",children:o?ie("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:gn,children:xe===1?xt(lo,{children:[ie("circle",{cx:"7",cy:"7",r:"2"}),ie("circle",{cx:"17",cy:"7",r:"2"}),ie("circle",{cx:"7",cy:"17",r:"2"}),ie("circle",{cx:"17",cy:"17",r:"2"})]}):xt(lo,{children:[ie("circle",{cx:"12",cy:"6",r:"2"}),ie("circle",{cx:"6",cy:"12",r:"2"}),ie("circle",{cx:"18",cy:"12",r:"2"}),ie("circle",{cx:"12",cy:"18",r:"2"})]})}):xt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:gn,strokeWidth:"1.5",strokeLinecap:"round",style:{transform:"rotate(45deg)"},children:[ie("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),ie("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),ie("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),ie("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})]})]}):xt(lo,{children:[ie("style",{children:"@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }"}),ie("div",{ref:W=>{fe&&(fe.current=W)},id:"devtools-toolbar",style:h(f({},mt),{overflow:"visible",opacity:.5,transition:"opacity 150ms ease"}),onMouseEnter:W=>{W.currentTarget.style.opacity="1",Te==null||Te()},onMouseLeave:W=>W.currentTarget.style.opacity="0.5",children:ie("button",{type:"button",style:{display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,border:"none",background:"none",cursor:"pointer",padding:0},onClick:()=>{ze(!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:o?ie("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:gn,children:xe===1?xt(lo,{children:[ie("circle",{cx:"7",cy:"7",r:"2"}),ie("circle",{cx:"17",cy:"7",r:"2"}),ie("circle",{cx:"7",cy:"17",r:"2"}),ie("circle",{cx:"17",cy:"17",r:"2"})]}):xt(lo,{children:[ie("circle",{cx:"12",cy:"6",r:"2"}),ie("circle",{cx:"6",cy:"12",r:"2"}),ie("circle",{cx:"18",cy:"12",r:"2"}),ie("circle",{cx:"12",cy:"18",r:"2"})]})}):xt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:gn,strokeWidth:"1.5",strokeLinecap:"round",children:[ie("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),ie("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),ie("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),ie("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})}import{useEffect as Oo,useRef as $p,useState as ts}from"react";import{Fragment as Ta,jsx as kt,jsxs as Zo}from"react/jsx-runtime";var Wp={position:"fixed",bottom:86,right:16,zIndex:9999,display:"flex",flexDirection:"column"},Yp=24,jp=6,Gp=Yp-jp,Vp=8,Ma=h(f({display:"flex",alignItems:"center",gap:6,padding:"4px 10px",backgroundColor:"rgba(255, 255, 255, 0.85)"},Sn),{backdropFilter:"blur(32px)",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,color:"#1f2937",whiteSpace:"nowrap",transition:"transform 200ms ease, opacity 200ms ease"});function Up(e){var s;let t=e.filter(l=>l.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?(s=o.split("/").pop())!=null?s:o: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":return"Running command";case"Glob":return"Searching files";case"Grep":return"Searching code";default:return r?`Using ${r}`:"Working\u2026"}}function Jp(e){let t=e.replace(/^Error:\s*/i,"");return t.length>40?t.slice(0,37)+"...":t}function Xp(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 Kp({color:e}){let[t,n]=ts(0);return Oo(()=>{let r=setInterval(()=>{n(o=>(o+1)%2)},250);return()=>clearInterval(r)},[]),kt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?Zo(Ta,{children:[kt("circle",{cx:"7",cy:"7",r:"2"}),kt("circle",{cx:"17",cy:"7",r:"2"}),kt("circle",{cx:"7",cy:"17",r:"2"}),kt("circle",{cx:"17",cy:"17",r:"2"})]}):Zo(Ta,{children:[kt("circle",{cx:"12",cy:"6",r:"2"}),kt("circle",{cx:"6",cy:"12",r:"2"}),kt("circle",{cx:"18",cy:"12",r:"2"}),kt("circle",{cx:"12",cy:"18",r:"2"})]})})}function qp({color:e}){return kt("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:e,opacity:.6}})}function Zp({color:e}){return kt("span",{style:{color:e,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function Qp(){return kt("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function Ia({bridge:e,inFlightJobs:t,isVisible:n,onHover:r,clearSignal:o,onViewThread:i,onCancel:s,onHoverJob:l,isConnected:a,dismissedThreadIds:c}){let[d,u]=ts([]),[p,g]=ts(!1);Oo(()=>{o>0&&u([])},[o]),Oo(()=>{!c||c.size===0||u(y=>{let w=y.filter(O=>!O.threadId||!c.has(O.threadId));return w.length===y.length?y:w})},[c]),Oo(()=>{u(y=>{var k;let w=new Set(y.map(E=>E.jobId)),O=!1,R=y.map(E=>{let A=t[E.jobId];return A&&(!E.threadId||E.color==="#888")?(O=!0,h(f({},E),{threadId:E.threadId||A.threadId,color:E.color==="#888"?A.color:E.color})):E});for(let[E,A]of Object.entries(t))w.has(E)||(R.push({jobId:E,color:A.color,status:"queued",threadId:A.threadId}),O=!0);for(let E of e.activeJobIds)if(!w.has(E)&&!R.some(A=>A.jobId===E)){let A=e.events.find(D=>D.type==="job_started"&&D.data.jobId===E);R.push({jobId:E,color:"#888",status:"working",threadId:(k=A==null?void 0:A.data)==null?void 0:k.threadId}),O=!0}return O?R:y})},[t,e.activeJobIds]),Oo(()=>{if(e.activeJobIds.length===0)return;let y=new Set(e.activeJobIds);u(w=>w.map(O=>y.has(O.jobId)&&O.status!=="done"&&O.status!=="error"?h(f({},O),{status:"working"}):O))},[e.activeJobIds]);let v=$p(null);if(Oo(()=>{let y=e.lastCompletedJobId;if(!y||y===v.current)return;v.current=y;let w=e.events.find(D=>D.type==="error"&&(D.data.jobId===y||e.status==="error")),O=!!w,R=O?void 0:Xp(e.events,y),k=w?String(w.data.message||""):void 0,E=w?!!w.data.cancelled:void 0,A=w==null?void 0:w.data.threadId;u(D=>D.map(K=>K.jobId===y?h(f({},K),{status:O?"error":"done",doneLabel:R,errorMessage:k,cancelled:E,threadId:K.threadId||A}):K))},[e.lastCompletedJobId,e.events,e.status]),!n||d.length===0&&a!==!1)return null;let S=!p&&d.length>1;return Zo("div",{style:Wp,"data-devtools":!0,onMouseEnter:()=>{g(!0),r(!0)},onMouseLeave:()=>{g(!1),r(!1),l==null||l(null)},children:[[...d].reverse().map((y,w)=>{let O=w===d.length-1,R=d.length-1-w,k=y.status==="working"?Up(e.events.filter(E=>E.data.jobId===y.jobId)):y.status==="queued"?"Queued":y.status==="done"?y.doneLabel||"Done":y.cancelled?"Cancelled":y.errorMessage?Jp(y.errorMessage):"Error";return kt("div",{style:{position:"relative",zIndex:w,marginBottom:S?O?0:-Gp:O?0:Vp,transform:S?`scale(${Math.max(.94,1-R*.02)})`:"scale(1)",opacity:S?Math.max(.5,1-R*.15):1,transformOrigin:"bottom right",transition:"margin-bottom 250ms ease, transform 250ms ease, opacity 250ms ease"},children:Zo("div",{style:h(f({},Ma),{cursor:y.threadId&&i?"pointer":void 0}),onClick:y.threadId&&i?()=>i(y.threadId):void 0,onMouseEnter:l?()=>l(y.jobId):void 0,onMouseLeave:l?()=>l(null):void 0,title:y.errorMessage||void 0,children:[y.status==="working"&&kt(Kp,{color:y.color}),y.status==="queued"&&kt(qp,{color:y.color}),y.status==="done"&&kt(Zp,{color:y.color}),y.status==="error"&&kt(Qp,{}),kt("span",{style:{color:y.status==="queued"?"#9ca3af":"#1f2937"},children:k}),y.status==="working"&&s&&kt("button",{onClick:E=>{E.stopPropagation(),s(y.jobId)},style:{background:"none",border:"none",cursor:"pointer",color:"#9ca3af",fontSize:14,padding:"0 4px",lineHeight:1},title:"Cancel",children:"\xD7"}),(y.status==="done"||y.status==="error")&&kt("button",{onClick:E=>{E.stopPropagation(),u(A=>A.filter(D=>D.jobId!==y.jobId))},style:{background:"none",border:"none",cursor:"pointer",color:"#9ca3af",fontSize:14,padding:"0 4px",lineHeight:1},title:"Dismiss",children:"\xD7"})]})},y.jobId)}),a===!1&&d.length>0&&Zo("div",{style:h(f({},Ma),{color:"#9ca3af"}),children:[kt("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#f59e0b"}}),kt("span",{children:"Reconnecting\u2026"})]})]})}import{Fragment as nf,jsx as tf,jsxs as of}from"react/jsx-runtime";var ef=`
17
18
  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
18
19
  :host {
19
20
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
@@ -22,9 +23,16 @@ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{
22
23
  line-height: 1.5;
23
24
  -webkit-font-smoothing: antialiased;
24
25
  }
25
- `;function ta({children:e}){return ip(rp,{children:[op("style",{children:np}),e]})}import{useLayoutEffect as sp,useRef as lp,useState as ap}from"react";import{createPortal as cp}from"react-dom";import{Fragment as up,jsx as dp,jsxs as pp}from"react/jsx-runtime";function na({children:e}){let t=lp(null),[o,r]=ap(null);return sp(()=>{let n=t.current;if(!n||n.shadowRoot)return;let i=n.attachShadow({mode:"open"}),s=document.createElement("div");s.setAttribute("data-popmelt-root",""),i.appendChild(s),r(s)},[]),pp(up,{children:[dp("div",{ref:t,"data-popmelt-shadow-host":!0,style:{position:"absolute",width:0,height:0,overflow:"visible"}}),o&&cp(e,o)]})}import{useCallback as Cr,useEffect as _n,useRef as On,useState as no}from"react";import{Fragment as yp,jsx as Et}from"react/jsx-runtime";var oa="ui-monospace, SFMono-Regular, Menlo, monospace",fp=/^#[0-9a-fA-F]{3,8}$/,gp=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,mp=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 hp(e){let t=e.trim();return fp.test(t)||gp.test(t)||mp.has(t.toLowerCase())}function Wi(e,t){return Et("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 Vo(e){let t=[],o=/(`[^`]+`)|(\*\*\*(.+?)\*\*\*)|(\*\*(.+?)\*\*)|(\*(.+?)\*)|(_([^_]+?)_)|(\[([^\]]+)\]\(([^)]+)\))|(#[0-9a-fA-F]{3,8})(?![0-9a-fA-F])|((?:rgba?|hsla?|oklch)\([^)]+\))/g,r=0,n;for(;(n=o.exec(e))!==null;){if(n.index>r&&t.push(e.slice(r,n.index)),n[1]){let i=n[1].slice(1,-1);hp(i)&&t.push(Wi(i,`sw-${n.index}`)),t.push(Et("code",{style:{fontFamily:oa,fontSize:"0.9em",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2},children:i},n.index))}else n[3]!==void 0?t.push(Et("strong",{children:Et("em",{children:n[3]})},n.index)):n[5]!==void 0?t.push(Et("strong",{children:n[5]},n.index)):n[7]!==void 0?t.push(Et("em",{children:n[7]},n.index)):n[9]!==void 0?t.push(Et("em",{children:n[9]},n.index)):n[11]!==void 0&&n[12]!==void 0?t.push(Et("a",{href:n[12],target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline"},children:n[11]},n.index)):n[13]!==void 0?(t.push(Wi(n[13],`sw-${n.index}`)),t.push(n[13])):n[14]!==void 0&&(t.push(Wi(n[14],`sw-${n.index}`)),t.push(n[14]));r=n.index+n[0].length}return r<e.length&&t.push(e.slice(r)),t}function kr(e){var n;let t=e.split(`
26
- `),o=[],r=0;for(;r<t.length;){let i=t[r];if(i.trimStart().startsWith("```")){let c=[];for(r++;r<t.length&&!t[r].trimStart().startsWith("```");)c.push(t[r]),r++;r++,o.push(Et("pre",{style:{fontFamily:oa,fontSize:"0.9em",lineHeight:1.4,backgroundColor:"rgba(0,0,0,0.04)",padding:"6px 8px",margin:"4px 0",overflowX:"auto",whiteSpace:"pre"},children:c.join(`
27
- `)},o.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(i)){o.push(Et("hr",{style:{border:"none",borderTop:"1px solid rgba(0,0,0,0.1)",margin:"6px 0"}},o.length)),r++;continue}let s=i.match(/^(#{1,4})\s+(.+)/);if(s){let c=s[1].length,d={1:16,2:14,3:13,4:12};o.push(Et("div",{style:{fontWeight:700,fontSize:(n=d[c])!=null?n:12,margin:"8px 0 2px"},children:Vo(s[2])},o.length)),r++;continue}if(i.trimStart().startsWith("|")&&i.trimEnd().endsWith("|")){let c=[];for(;r<t.length&&t[r].trimStart().startsWith("|")&&t[r].trimEnd().endsWith("|");)c.push(t[r]),r++;let d=w=>/^\|[\s\-:|]+\|$/.test(w),u=c.filter(w=>!d(w)),p=w=>w.split("|").slice(1,-1).map(O=>O.trim()),g=w=>/^\*\*.+\*\*$/.test(w)||/^__.+__$/.test(w),S=u.map(p),v=S.length>1&&S.slice(1).every(w=>w[0]&&g(w[0])),b=S.length>0&&S[0].every(w=>g(w));o.push(Et("div",{style:{overflowX:"auto",margin:"4px 0",paddingBottom:4},children:Et("table",{style:{borderCollapse:"separate",borderSpacing:0,fontSize:"0.95em",width:"max-content",minWidth:"100%"},children:Et("tbody",{children:u.map((w,O)=>Et("tr",{children:p(w).map((A,k)=>Et(O===0?"th":"td",{style:f({border:"1px solid rgba(0,0,0,0.1)",padding:"3px 6px",textAlign:"left",fontWeight:O===0?600:400,minWidth:60,whiteSpace:"nowrap"},k===0&&v||O===0&&b?h(f(f({position:"sticky"},k===0&&v?{left:0}:{}),O===0&&b?{top:0}:{}),{background:"#fff",zIndex:k===0&&v&&O===0&&b?2:1}):{}),children:Vo(A)},k))},O))})})},o.length));continue}if(i.match(/^(\s*)([-*])\s+(.+)/)){let c=[];for(;r<t.length&&/^\s*[-*]\s+/.test(t[r]);){let d=t[r].match(/^\s*[-*]\s+(.+)/);d&&c.push(Et("li",{children:Vo(d[1])},c.length)),r++}o.push(Et("ul",{style:{margin:"2px 0",paddingLeft:20},children:c},o.length));continue}if(i.match(/^(\s*)\d+\.\s+(.+)/)){let c=[];for(;r<t.length&&/^\s*\d+\.\s+/.test(t[r]);){let d=t[r].match(/^\s*\d+\.\s+(.+)/);d&&c.push(Et("li",{children:Vo(d[1])},c.length)),r++}o.push(Et("ol",{style:{margin:"2px 0",paddingLeft:20},children:c},o.length));continue}if(i.trim()===""){o.push(Et("div",{style:{height:4}},o.length)),r++;continue}o.push(Et("div",{style:{margin:"2px 0"},children:Vo(i)},o.length)),r++}return Et(yp,{children:o})}import{Fragment as Vi,jsx as ze,jsxs as _t}from"react/jsx-runtime";var Mr=400,Ro=16,Ui=3,bp=16,Yi="devtools-thread-panel-position";function ji(){return{top:Ro,left:window.innerWidth-Mr-2*Ui-Ro}}function ra(e,t,o){let r=o==null?void 0:o.getBoundingClientRect(),n=window.innerHeight-Ro;return r&&t+Mr+2*Ui>r.left&&(n=r.top-bp),Math.max(200,n-Math.max(0,e))}var xp=h(f({width:Mr,backgroundColor:"#ffffff"},bn),{boxSizing:"content-box",display:"flex",flexDirection:"column",overflow:"hidden",fontFamily:Wt,fontSize:12,color:"#1f2937",pointerEvents:"auto"}),vp={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"4px 5px 4px 10px",margin:"3px 3px 0",fontWeight:600,fontSize:12},Sp={flex:1,overflowY:"auto",padding:"8px 0",scrollbarWidth:"none"},wp=`
26
+ /* Break :host font inheritance for component previews \u2014 let mirrored host
27
+ page styles (Tailwind, globals) apply instead of Popmelt's monospace. */
28
+ [data-popmelt-panel] {
29
+ font: 16px / 1.5 system-ui, -apple-system, sans-serif;
30
+ color: initial;
31
+ -webkit-font-smoothing: auto;
32
+ }
33
+ `;function Ra({children:e}){return of(nf,{children:[tf("style",{children:ef}),e]})}import{useEffect as rf,useLayoutEffect as sf,useRef as lf,useState as La}from"react";import{createPortal as af}from"react-dom";import{Fragment as pf,jsx as uf,jsxs as ff}from"react/jsx-runtime";function cf(e){return e.tagName==="STYLE"||e.tagName==="LINK"&&e.rel==="stylesheet"}function df(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&&cf(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 Aa({children:e}){let t=lf(null),[n,r]=La(null),[o,i]=La(null);return sf(()=>{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)},[]),rf(()=>{if(n)return df(n)},[n]),ff(pf,{children:[uf("div",{ref:t,"data-popmelt-shadow-host":!0,style:{position:"absolute",width:0,height:0,overflow:"visible"}}),o&&af(e,o)]})}import{useCallback as Nr,useEffect as Yn,useRef as Fn,useState as co}from"react";import{Fragment as bf,jsx as Et}from"react/jsx-runtime";var Pa="ui-monospace, SFMono-Regular, Menlo, monospace",gf=/^#[0-9a-fA-F]{3,8}$/,mf=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,hf=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 yf(e){let t=e.trim();return gf.test(t)||mf.test(t)||hf.has(t.toLowerCase())}function ns(e,t){return Et("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 Qo(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);yf(i)&&t.push(ns(i,`sw-${o.index}`)),t.push(Et("code",{style:{fontFamily:Pa,fontSize:"0.9em",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2},children:i},o.index))}else o[3]!==void 0?t.push(Et("strong",{children:Et("em",{children:o[3]})},o.index)):o[5]!==void 0?t.push(Et("strong",{children:o[5]},o.index)):o[7]!==void 0?t.push(Et("em",{children:o[7]},o.index)):o[9]!==void 0?t.push(Et("em",{children:o[9]},o.index)):o[11]!==void 0&&o[12]!==void 0?t.push(Et("a",{href:o[12],target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline"},children:o[11]},o.index)):o[13]!==void 0?(t.push(ns(o[13],`sw-${o.index}`)),t.push(o[13])):o[14]!==void 0&&(t.push(ns(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 Dr(e){var o;let t=e.split(`
34
+ `),n=[],r=0;for(;r<t.length;){let i=t[r];if(i.trimStart().startsWith("```")){let c=[];for(r++;r<t.length&&!t[r].trimStart().startsWith("```");)c.push(t[r]),r++;r++,n.push(Et("pre",{style:{fontFamily:Pa,fontSize:"0.9em",lineHeight:1.4,backgroundColor:"rgba(0,0,0,0.04)",padding:"6px 8px",margin:"4px 0",overflowX:"auto",whiteSpace:"pre"},children:c.join(`
35
+ `)},n.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(i)){n.push(Et("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 c=s[1].length,d={1:16,2:14,3:13,4:12};n.push(Et("div",{style:{fontWeight:700,fontSize:(o=d[c])!=null?o:12,margin:"8px 0 2px"},children:Qo(s[2])},n.length)),r++;continue}if(i.trimStart().startsWith("|")&&i.trimEnd().endsWith("|")){let c=[];for(;r<t.length&&t[r].trimStart().startsWith("|")&&t[r].trimEnd().endsWith("|");)c.push(t[r]),r++;let d=w=>/^\|[\s\-:|]+\|$/.test(w),u=c.filter(w=>!d(w)),p=w=>w.split("|").slice(1,-1).map(O=>O.trim()),g=w=>/^\*\*.+\*\*$/.test(w)||/^__.+__$/.test(w),v=u.map(p),S=v.length>1&&v.slice(1).every(w=>w[0]&&g(w[0])),y=v.length>0&&v[0].every(w=>g(w));n.push(Et("div",{style:{overflowX:"auto",margin:"4px 0",paddingBottom:4},children:Et("table",{style:{borderCollapse:"separate",borderSpacing:0,fontSize:"0.95em",width:"max-content",minWidth:"100%"},children:Et("tbody",{children:u.map((w,O)=>Et("tr",{children:p(w).map((R,k)=>Et(O===0?"th":"td",{style:f({border:"1px solid rgba(0,0,0,0.1)",padding:"3px 6px",textAlign:"left",fontWeight:O===0?600:400,minWidth:60,whiteSpace:"nowrap"},k===0&&S||O===0&&y?h(f(f({position:"sticky"},k===0&&S?{left:0}:{}),O===0&&y?{top:0}:{}),{background:"#fff",zIndex:k===0&&S&&O===0&&y?2:1}):{}),children:Qo(R)},k))},O))})})},n.length));continue}if(i.match(/^(\s*)([-*])\s+(.+)/)){let c=[];for(;r<t.length&&/^\s*[-*]\s+/.test(t[r]);){let d=t[r].match(/^\s*[-*]\s+(.+)/);d&&c.push(Et("li",{children:Qo(d[1])},c.length)),r++}n.push(Et("ul",{style:{margin:"2px 0",paddingLeft:20},children:c},n.length));continue}if(i.match(/^(\s*)\d+\.\s+(.+)/)){let c=[];for(;r<t.length&&/^\s*\d+\.\s+/.test(t[r]);){let d=t[r].match(/^\s*\d+\.\s+(.+)/);d&&c.push(Et("li",{children:Qo(d[1])},c.length)),r++}n.push(Et("ol",{style:{margin:"2px 0",paddingLeft:20},children:c},n.length));continue}if(i.trim()===""){n.push(Et("div",{style:{height:4}},n.length)),r++;continue}n.push(Et("div",{style:{margin:"2px 0"},children:Qo(i)},n.length)),r++}return Et(bf,{children:n})}import{Fragment as ss,jsx as Ye,jsxs as Bt}from"react/jsx-runtime";var Fr=400,Do=16,ls=3,xf=16,os="devtools-thread-panel-position";function rs(){return{top:Do,left:window.innerWidth-Fr-2*ls-Do}}function Ba(e,t,n){let r=n==null?void 0:n.getBoundingClientRect(),o=window.innerHeight-Do;return r&&t+Fr+2*ls>r.left&&(o=r.top-xf),Math.max(200,o-Math.max(0,e))}var vf=h(f({width:Fr,backgroundColor:"#ffffff"},Sn),{boxSizing:"content-box",display:"flex",flexDirection:"column",overflow:"hidden",fontFamily:zt,fontSize:12,color:"#1f2937",pointerEvents:"auto"}),Sf={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"4px 5px 4px 10px",margin:"3px 3px 0",fontWeight:600,fontSize:12},wf={flex:1,overflowY:"auto",padding:"8px 0",scrollbarWidth:"none"},Ef=`
28
36
  [data-devtools="thread-panel-messages"]:hover {
29
37
  scrollbar-width: thin !important;
30
38
  }
@@ -38,4 +46,4 @@ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{
38
46
  background: rgba(0,0,0,0.15);
39
47
  border-radius: 3px;
40
48
  }
41
- `,Ep={borderTop:"1px solid rgba(0, 0, 0, 0.08)",padding:12};function ia(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 sa(e){return new Date(e).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var Gi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],kp=3e3,Cp=250;function la({size:e=14}){return ze("svg",{width:e,height:e,viewBox:"0 0 1200 1200",fill:"#6b7280",stroke:"none",style:{flexShrink:0},children:ze("path",{d:"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"})})}function Mp({color:e}){let[t,o]=no(0),[r,n]=no(()=>Math.floor(Math.random()*Gi.length));return _n(()=>{let i=setInterval(()=>o(l=>(l+1)%2),Cp),s=setInterval(()=>n(l=>(l+1)%Gi.length),kp);return()=>{clearInterval(i),clearInterval(s)}},[]),_t("span",{style:{display:"inline-flex",alignItems:"center",gap:4},children:[ze("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?_t(Vi,{children:[ze("circle",{cx:"7",cy:"7",r:"2"}),ze("circle",{cx:"17",cy:"7",r:"2"}),ze("circle",{cx:"7",cy:"17",r:"2"}),ze("circle",{cx:"17",cy:"17",r:"2"})]}):_t(Vi,{children:[ze("circle",{cx:"12",cy:"6",r:"2"}),ze("circle",{cx:"6",cy:"12",r:"2"}),ze("circle",{cx:"18",cy:"12",r:"2"}),ze("circle",{cx:"12",cy:"18",r:"2"})]})}),ze("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:Gi[r]})]})}function Tp(e){var n;let t=String(e.data.tool||""),o=e.data.file?String(e.data.file):null,r=o?(n=o.split("/").pop())!=null?n:o: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"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}}var Lp=new Set(["Read","Glob","Grep","WebFetch","WebSearch"]),Ip=new Set(["Edit","Write","Bash"]);function Rp(e){let t=0,o=!1;for(let r of e){if(r.type!=="tool_use")continue;let n=String(r.data.tool||"");Ip.has(n)?o=!0:Lp.has(n)&&t++}return!o&&t>=3?"researching":o?"applying changes":null}function Ap(e){let t=[];for(let o of e)if(o.type==="tool_use"){let r=Tp(o);r&&t.push({kind:"tool",label:r})}else if(o.type==="delta"){let r=String(o.data.text||"");if(!r)continue;let n=t[t.length-1];n&&n.kind==="text"?n.text+=r:t.push({kind:"text",text:r})}else if(o.type==="thinking"){let r=String(o.data.text||"");if(!r)continue;let n=t[t.length-1];n&&n.kind==="thinking"?n.text+=r:t.push({kind:"thinking",text:r})}return t}function aa({threadId:e,bridgeUrl:t,accentColor:o,isStreaming:r,streamingEvents:n,onClose:i,onReply:s,onCancel:l,lastError:a,onMouseEnter:c,toolbarRef:d}){let[u,p]=no([]),[g,S]=no(!0),[v,b]=no(""),[w,O]=no([]),A=On(null),k=On(null),E=On(null),I=On(r),$=On(ji()),q=On({x:0,y:0}),j=On(!1),T=On({x:0,y:0,offsetX:0,offsetY:0}),D=On(!1),[,K]=no(0);_n(()=>{try{let G=localStorage.getItem(Yi);if(G){let oe=JSON.parse(G);typeof oe.top=="number"&&typeof oe.left=="number"&&(D.current=!0,$.current={top:oe.top,left:oe.left},K(Ee=>Ee+1))}}catch(G){}},[]),_n(()=>{let G=()=>{D.current||($.current=ji()),K(oe=>oe+1)};return window.addEventListener("resize",G,{passive:!0}),()=>window.removeEventListener("resize",G)},[]),_n(()=>{let G=E.current;if(!G)return;let oe=Te=>{Te.button!==0||Te.target.closest("button")||(Te.preventDefault(),Te.stopPropagation(),j.current=!0,T.current={x:Te.clientX,y:Te.clientY,offsetX:q.current.x,offsetY:q.current.y})},Ee=Te=>{if(!j.current)return;let xe=T.current,ge=xe.offsetX+(Te.clientX-xe.x),Ge=xe.offsetY+(Te.clientY-xe.y),xt=Math.max(Ro,Math.min(window.innerWidth-Mr-2*Ui-Ro,$.current.left+ge)),dt=Math.max(Ro,$.current.top+Ge);q.current={x:xt-$.current.left,y:dt-$.current.top};let Ve=k.current;Ve&&(Ve.style.top=`${dt}px`,Ve.style.left=`${xt}px`,Ve.style.height=`${ra(dt,xt,d==null?void 0:d.current)}px`)},ce=()=>{if(!j.current)return;let Te=$.current.top+q.current.y,xe=$.current.left+q.current.x;$.current={top:Te,left:xe},q.current={x:0,y:0},D.current=!0;try{localStorage.setItem(Yi,JSON.stringify({top:Te,left:xe}))}catch(ge){}j.current=!1},Ke=()=>{$.current=ji(),q.current={x:0,y:0},D.current=!1;try{localStorage.removeItem(Yi)}catch(Te){}K(Te=>Te+1)};return G.addEventListener("mousedown",oe),window.addEventListener("mousemove",Ee),window.addEventListener("mouseup",ce),G.addEventListener("dblclick",Ke),()=>{G.removeEventListener("mousedown",oe),window.removeEventListener("mousemove",Ee),window.removeEventListener("mouseup",ce),G.removeEventListener("dblclick",Ke)}},[]);let ee=Cr(()=>{fetch(`${t}/thread/${e}`).then(G=>G.json()).then(G=>{var oe;p((oe=G.messages)!=null?oe:[]),S(!1)}).catch(()=>S(!1))},[t,e]);_n(()=>{S(!0),ee()},[ee]),_n(()=>{I.current&&!r&&ee(),I.current=r},[r,ee]);let me=n?Ap(n):[],ve=n?Rp(n):null;_n(()=>{A.current&&(A.current.scrollTop=A.current.scrollHeight)},[u,me.length,r]),_n(()=>{let G=oe=>{oe.key==="Escape"&&(oe.stopPropagation(),i())};return document.addEventListener("keydown",G),()=>document.removeEventListener("keydown",G)},[i]);let ae=Cr(()=>{if(!v.trim()||!s)return;let G=v.trim(),oe=w.length>0?w:void 0;p(Ee=>[...Ee,{role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:oe?`${G} [${oe.length} image${oe.length>1?"s":""}]`:G}]),s(e,G,oe),b(""),O([])},[v,w,e,s]),Re=Cr(G=>{let oe=G.clipboardData.items,Ee=[];for(let ce=0;ce<oe.length;ce++){let Ke=oe[ce];if(Ke.type.startsWith("image/")){let Te=Ke.getAsFile();Te&&Ee.push(Te)}}Ee.length>0&&(G.preventDefault(),O(ce=>[...ce,...Ee]))},[]),We=Cr(G=>{G.key==="Enter"&&(G.metaKey||G.ctrlKey)&&(G.preventDefault(),ae())},[ae]),Me=$.current.top+q.current.y,ne=$.current.left+q.current.x,Ae=ra(Me,ne,d==null?void 0:d.current);return _t(Vi,{children:[ze("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:G=>{G.target===G.currentTarget&&i()},style:{position:"fixed",inset:0,zIndex:9999}}),_t("div",{ref:k,style:h(f({},xp),{height:Ae,position:"fixed",top:Me,left:ne,zIndex:1e4}),"data-devtools":"thread-panel",onMouseEnter:c,children:[_t("div",{ref:E,style:h(f({},vp),{backgroundColor:o,color:"#ffffff",cursor:"grab",userSelect:"none",WebkitUserSelect:"none"}),children:[ze("span",{children:"Conversation"}),ze("button",{onClick:i,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),ze("style",{dangerouslySetInnerHTML:{__html:wp}}),_t("div",{ref:A,style:Sp,"data-devtools":"thread-panel-messages",children:[g&&ze("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!g&&u.length===0&&!r&&ze("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),u.map((G,oe)=>{let Ee=G.role==="human";if(G.cancelled)return ze("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:oe===u.length-1?1:.5},children:_t("div",{style:{display:"flex",alignItems:"center",gap:4},children:[ze("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:"Cancelled"}),ze("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:sa(G.timestamp)})]})},`${G.jobId}-${oe}`);let ce=Ee?G.replyToQuestion||G.feedbackSummary||"(annotation)":ia(G.responseText||""),Ke=Ee?void 0:G.question,Te=!Ee&&G.resolutions&&G.resolutions.length>0,xe=!Ee&&G.toolsUsed&&G.toolsUsed.length>0;if(!ce&&!Ke&&!Te)return null;let ge=oe===u.length-1;return _t("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:ge?1:.5},children:[_t("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[!Ee&&ze(la,{size:11}),ze("span",{style:{fontWeight:600,fontSize:11,color:Ee?o:"#6b7280"},children:Ee?"You":"Claude Code"}),ze("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:sa(G.timestamp)})]}),ce&&ze("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:Ee?ce:kr(ce)}),Ke&&ze("div",{style:{marginTop:ce?4:0,lineHeight:1.5,wordBreak:"break-word"},children:kr(Ke)}),(xe||Te)&&_t("div",{style:{marginTop:ce||Ke?6:0,padding:"4px 8px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#6b7280"},children:[xe&&ze("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:G.toolsUsed.map((Ge,xt)=>ze("div",{children:Ge},xt))}),Te&&G.resolutions.map((Ge,xt)=>{var z;let dt=(z=Ge.finalScope)!=null?z:Ge.inferredScope,Ve=dt?`${dt.breadth} \xB7 ${dt.target}`:null;return _t("div",{style:{marginTop:xe?4:0},children:[ze("span",{style:{color:Ge.status==="resolved"?"#10b981":"#f59e0b"},children:Ge.status==="resolved"?"Done":"Needs review"}),Ve&&ze("span",{style:{marginLeft:6,padding:"1px 5px",backgroundColor:"rgba(0, 0, 0, 0.06)",fontSize:10,fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace"},children:Ve}),Ge.summary?` \u2014 ${Ge.summary}`:""]},xt)})]})]},`${G.jobId}-${oe}`)}),r&&_t("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[_t("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[ze(la,{size:11}),ze("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:"Claude Code"}),ve&&ze("span",{style:{fontSize:10,color:"#b0b7c3",fontStyle:"italic"},children:ve}),_t("span",{style:{marginLeft:"auto",display:"flex",alignItems:"center",gap:6},children:[ze(Mp,{color:o}),l&&ze("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"},children:"Cancel"})]})]}),me.map((G,oe)=>{if(G.kind==="tool")return ze("div",{style:{paddingLeft:12,fontSize:11,color:"#9ca3af",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",lineHeight:1.6},children:G.label},oe);if(G.kind==="thinking")return ze("div",{style:{paddingLeft:12,marginTop:2,marginBottom:2,fontSize:11,color:"#9ca3af",fontStyle:"italic",lineHeight:1.4,whiteSpace:"pre-wrap",wordBreak:"break-word",maxHeight:80,overflowY:"auto"},children:G.text},oe);let Ee=ia(G.text);return Ee?ze("div",{style:{paddingLeft:12,marginTop:2,marginBottom:2,lineHeight:1.5,wordBreak:"break-word"},children:kr(Ee)},oe):null})]})]}),!r&&a&&_t("div",{style:{padding:"8px 16px",backgroundColor:"rgba(239, 68, 68, 0.06)",borderBottom:"1px solid rgba(0,0,0,0.04)",fontSize:11,color:"#dc2626",lineHeight:1.4},children:[ze("span",{style:{fontWeight:600},children:"Error: "}),a]}),s&&_t("div",{style:Ep,children:[w.length>0&&_t("div",{style:{fontSize:11,color:"#6b7280",marginBottom:4,display:"flex",alignItems:"center",gap:4},children:[_t("span",{children:[w.length," image",w.length>1?"s":""," attached"]}),ze("button",{onClick:()=>O([]),style:{background:"none",border:"none",cursor:"pointer",fontSize:11,color:"#9ca3af",padding:"0 2px"},children:"\xD7"})]}),ze("textarea",{value:v,onChange:G=>b(G.target.value),onKeyDown:We,onPaste:Re,placeholder:"Reply... (Cmd+Enter to send)",style:{width:"100%",minHeight:60,padding:4,fontSize:12,fontFamily:Wt,backgroundColor:"rgba(0, 0, 0, 0.03)",color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)",borderRadius:0,outline:"none",resize:"vertical",lineHeight:1.4,boxSizing:"border-box"}}),ze("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:6},children:ze("button",{onClick:ae,disabled:!v.trim(),style:{padding:"5px 14px",fontSize:11,fontFamily:Wt,fontWeight:600,backgroundColor:v.trim()?o:"rgba(0,0,0,0.1)",color:v.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:v.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}import{Fragment as Fp,jsx as Po,jsxs as ca}from"react/jsx-runtime";var da=Pp(null),Ji="devtools-provider",Xi="devtools-model",Ki="devtools-open-thread-id",Zi=[{id:"claude-opus-4-6",label:"Opus 4.6"},{id:"claude-sonnet-4-6",label:"Sonn 4.6"}],qi=[{id:"gpt-5.3-codex",label:"Codex 5.3"},{id:"gpt-5.3-codex-spark",label:"Spark 5.3"},{id:"gpt-5.1-codex-mini",label:"Mini 5.1"}];function Op(e,t,o){let r=e==="codex"?qi:Zi;return Math.min(o,(t==="codex"?qi:Zi).length-1)}function Dp({children:e,enabled:t=process.env.NODE_ENV==="development",bridgeUrl:o=typeof window!="undefined"?(r=>(r=window.__POPMELT_BRIDGE_URL__)!=null?r:"http://localhost:1111")():"http://localhost:1111"}){var te,U,Pe,Be,he,It;let[n,i]=Hs(),s=Os(o),l=Xt(null),a=Xt(null),c=(te=Ps())!=null?te:o,d=Xt(new Map),[u,p]=Ut(()=>typeof window=="undefined"?"claude":localStorage.getItem(Ji)||"claude"),[g,S]=Ut(()=>{if(typeof window=="undefined")return 0;let R=localStorage.getItem(Xi);return R&&parseInt(R,10)||0}),[v,b]=Ut(["claude","codex"]),[w,O]=Ut({}),[A,k]=Ut(!1);zt(()=>{s.isConnected&&xs(c).then(R=>{if(!R)return;let Z=Object.entries(R.providers).filter(([,ye])=>ye.available).map(([ye])=>ye);Z.length>0&&b(Z);let de={};for(let[ye,ke]of Object.entries(R.providers))ke.mcp&&(de[ye]=ke.mcp);O(de),Object.values(de).every(ye=>ye.found)&&k(!1)})},[s.isConnected,s.capabilitiesVersion,c]),zt(()=>{if(v.length>0&&!v.includes(u)){let R=v[0];p(R),localStorage.setItem(Ji,R)}},[v,u]);let E=u==="codex"?qi:Zi,I=(U=E[g])!=null?U:E[0],$=Gt(R=>{let Z=u;p(R),localStorage.setItem(Ji,R);let de=Op(Z,R,g);S(de),localStorage.setItem(Xi,String(de))},[u,g]),q=Gt(R=>{S(R),localStorage.setItem(Xi,String(R))},[]),j=Gt(async()=>{let R=await ws(c);if(!R)return;let Z={};for(let[de,Oe]of Object.entries(R.capabilities.providers))Oe.mcp&&(Z[de]=Oe.mcp);O(Z),R.results.some(de=>de.installed)&&k(!0)},[c]),[T,D]=Ut(new Set),[K,ee]=Ut(null),[me,ve]=Ut(null),[ae,Re]=Ut(null),[We,Me]=Ut(null);zt(()=>{s.isConnected&&io(c).then(R=>{R!=null&&R.components&&D(new Set(Object.keys(R.components)))})},[s.isConnected,c]);let ne=Gt(async R=>{let Z=[];for(let de of R)try{(await Es(de,c)).added&&Z.push(de)}catch(Oe){console.error("[Popmelt] Failed to add component to model:",de,Oe)}Z.length>0&&(D(de=>{let Oe=new Set(de);for(let ye of Z)Oe.add(ye);return Oe}),ee(Z[Z.length-1]))},[c]),Ae=Gt(R=>{ee(R)},[]),G=Gt(()=>{io(c).then(R=>{R!=null&&R.components&&D(new Set(Object.keys(R.components)))})},[c]),oe=Gt(async R=>{try{(await ks(R,c)).removed&&D(de=>{let Oe=new Set(de);return Oe.delete(R),Oe})}catch(Z){console.error("[Popmelt] Failed to remove component from model:",Z)}},[c]),Ee=Gt((R,Z)=>{i({type:"MODIFY_SPACING_TOKEN",payload:R}),i({type:"ADD_SPACING_TOKEN_CHANGE",payload:Z})},[i]),ce=Gt((R,Z)=>{i({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:R,originalValue:Z}})},[i]),[Ke,Te]=Ut(0),xe=Xt([]);zt(()=>{let R=xe.current,Z=n.spacingTokenMods;xe.current=Z;let de=new Map(R.map(ke=>[ke.tokenPath,ke])),Oe=new Map(Z.map(ke=>[ke.tokenPath,ke])),ye=!1;for(let[ke,Ne]of Oe){let gt=de.get(ke);if(!(gt&&gt.currentValue===Ne.currentValue)){ye=!0,Ne.currentValue==="__deleted__"?Cs(ke,c).catch(Ue=>console.error("[Popmelt] Failed to sync token delete:",Ue)):Ar(ke,Ne.currentValue,c).catch(Ue=>console.error("[Popmelt] Failed to sync token update:",Ue));for(let Ue of Ne.targets){let et=document.querySelector(Ue.selector);if(et)if(Ne.currentValue==="__deleted__")et.style.removeProperty(Ue.property);else{let Ht=Ne.currentPx;Ht>0&&et.style.setProperty(Ue.property,`${Ht}px`,"important")}}}}for(let[ke,Ne]of de)if(!Oe.has(ke)){ye=!0,Ar(ke,Ne.originalValue,c).catch(gt=>console.error("[Popmelt] Failed to restore token on undo:",gt));for(let gt of Ne.targets){let Ue=document.querySelector(gt.selector);Ue&&Ue.style.removeProperty(gt.property)}}ye&&Te(ke=>ke+1)},[n.spacingTokenMods,c]);let[ge,Ge]=Ut(()=>typeof window=="undefined"?null:localStorage.getItem(Ki)||null),[xt,dt]=Ut(new Set),[Ve,z]=Ut(null);zt(()=>{ge?localStorage.setItem(Ki,ge):localStorage.removeItem(Ki)},[ge]);let ie="popmelt-in-flight-jobs",[Q,Se]=Ut(()=>{try{let R=sessionStorage.getItem(ie);return R?JSON.parse(R):{}}catch(R){return{}}});zt(()=>{try{Object.keys(Q).length>0?sessionStorage.setItem(ie,JSON.stringify(Q)):sessionStorage.removeItem(ie)}catch(R){}},[Q]);let Le=Xt(new Map);zt(()=>{for(let[R,Z]of Object.entries(Q))Z.annotationIds.length>0&&Le.current.set(R,Z.annotationIds)},[Q]);let Ze=Xt(!1);zt(()=>{if(Ze.current||n.annotations.length===0)return;Ze.current=!0;let R=new Set;for(let de of Object.values(Q))for(let Oe of de.annotationIds)R.add(Oe);let Z=n.annotations.filter(de=>R.has(de.id)?!1:!!(de.status==="in_flight"||(de.status==="pending"||!de.status)&&(de.captured||de.threadId))).map(de=>de.id);Z.length>0&&i({type:"SET_ANNOTATION_STATUS",payload:{ids:Z,status:"dismissed"}})},[n.annotations,Q,i]);let fe=Ao(()=>{let R=new Set;for(let Z of Object.values(Q))for(let de of Z.annotationIds)R.add(de);return R},[Q]),lt=Ao(()=>{let R=new Set;for(let Z of Object.values(Q))for(let de of Z.styleSelectors)R.add(de);return R},[Q]),Qe=Ao(()=>{let R=new Map;for(let Z of Object.values(Q)){for(let de of Z.styleSelectors)R.set(de,Z.color);for(let de of Z.annotationIds){let Oe=n.annotations.find(ye=>ye.id===de);if(Oe&&(Oe.linkedSelector&&R.set(Oe.linkedSelector,Z.color),Oe.groupId))for(let ye of n.annotations)ye.groupId===Oe.groupId&&ye.linkedSelector&&R.set(ye.linkedSelector,Z.color)}}return R},[Q,n.annotations]),Tt=Xt(n.annotations);Tt.current=n.annotations;let Ot=Xt(n.styleModifications);Ot.current=n.styleModifications;let st=Xt(Q);st.current=Q,zt(()=>{let R=null,Z=()=>{var gt,Ue;if(Object.keys(st.current).length>0)return;let Oe=Tt.current,ye=Ot.current,ke=[],Ne=[];for(let et of Oe){if(!et.linkedSelector||!et.linkedSelector.startsWith("[data-pm=")||et.captured||et.status&&et.status!=="pending")continue;let Ht=document.querySelector(et.linkedSelector);!Ht&&((Ue=(gt=et.elements)==null?void 0:gt[0])!=null&&Ue.selector)&&(Ht=document.querySelector(et.elements[0].selector)),Ht||ke.push(et.linkedSelector)}for(let et of ye)document.querySelector(et.selector)||Ne.push(et.selector);(ke.length>0||Ne.length>0)&&i({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:ke,styleSelectors:Ne}})},de=new MutationObserver(Oe=>{Oe.some(ye=>ye.removedNodes.length>0)&&(R&&clearTimeout(R),R=setTimeout(Z,3e3))});return de.observe(document.body,{childList:!0,subtree:!0}),()=>{de.disconnect(),R&&clearTimeout(R)}},[i]),zt(()=>{s.lastCompletedJobId&&s.lastCompletedJobId in Q&&Se(R=>{var Oe;let ye=R,{[Oe=s.lastCompletedJobId]:Z}=ye;return Hn(ye,[Qo(Oe)])})},[s.lastCompletedJobId]);let at=Xt(new Set);zt(()=>{let R=s.events.filter(Z=>Z.type==="done"&&Z.data.resolutions);for(let Z of R){let de=Z.data.jobId;at.current.has(de)||(at.current.add(de),Array.isArray(Z.data.resolutions)&&i({type:"APPLY_RESOLUTIONS",payload:{resolutions:Z.data.resolutions,threadId:Z.data.threadId}}))}},[s.events,i]);let Dt=Xt(new Set);zt(()=>{let R=s.events.filter(Z=>Z.type==="error"&&Z.data.cancelled);for(let Z of R){let de=Z.data.jobId;if(!de||Dt.current.has(de))continue;Dt.current.add(de);let Oe=Q[de];Oe&&Oe.annotationIds.length>0&&i({type:"SET_ANNOTATION_STATUS",payload:{ids:Oe.annotationIds,status:"dismissed"}})}},[s.events,Q,i]);let tt=Xt(0);zt(()=>{let R=s.incrementalResolutions;if(R.length<=tt.current)return;let Z=R.slice(tt.current);tt.current=R.length,i({type:"APPLY_RESOLUTIONS",payload:{resolutions:Z}})},[s.incrementalResolutions,i]),zt(()=>{s.incrementalResolutions.length===0&&(tt.current=0)},[s.incrementalResolutions.length]);let vt=Xt(s.status);zt(()=>{let R=vt.current;vt.current=s.status,R==="disconnected"&&s.status==="idle"&&Se({})},[s.status]);let $e=Gt(async()=>{let R=l.current;if(!R)return!1;let Z=await Hr(document.body,R,n.annotations);if(Z.length===0)return!1;let de=await Ns(Z,n.annotations,n.styleModifications);return de&&i({type:"MARK_CAPTURED"}),de},[n.annotations,n.styleModifications,i]),en=Gt((R,Z)=>{let de=d.current.get(R)||[];d.current.set(R,[...de,...Z])},[]),Kt=Gt(async()=>{let R=l.current;if(!R)return!1;let Z=n.annotations.filter(Ue=>{var et;return((et=Ue.status)!=null?et:"pending")==="pending"}),de=n.spacingTokenChanges.filter(Ue=>!Ue.captured);if(Z.length===0&&n.styleModifications.filter(Ue=>!Ue.captured).length===0&&de.length===0)return!1;let Oe=await Hr(document.body,R,n.annotations);if(Oe.length===0)return!1;let ye=await Fr(Oe);if(!ye)return!1;let ke=Dr(Z,n.styleModifications,void 0,de.length>0?de:void 0),Ne=JSON.stringify(ke),gt=new Map;for(let Ue of Z){let et=d.current.get(Ue.id);if(et&&et.length>0&&gt.set(Ue.id,et),Ue.groupId){for(let Ht of Z)if(Ht.groupId===Ue.groupId&&Ht.id!==Ue.id){let wt=d.current.get(Ht.id);wt&&wt.length>0&&gt.set(Ht.id,wt)}}}try{let Ue=Or(n.activeColor),{jobId:et,threadId:Ht}=await Ss(ye,Ne,c,Ue,u,I.id,gt.size>0?gt:void 0,Br());for(let un of gt.keys())d.current.delete(un);let wt=Z.map(un=>un.id),Tr=n.styleModifications.filter(un=>!un.captured).map(un=>un.selector);Se(un=>h(f({},un),{[et]:{annotationIds:wt,styleSelectors:Tr,color:n.activeColor,threadId:Ht}})),i({type:"MARK_CAPTURED"}),Ht&&wt.length>0&&i({type:"SET_ANNOTATION_THREAD",payload:{ids:wt,threadId:Ht}});let zn=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),Uo=((zn!=null&&zn[1]?parseFloat(zn[1]):29)+60)%360;return i({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${Uo})`}),!0}catch(Ue){return console.error("[Pare] Failed to send to bridge:",Ue),!1}},[n.annotations,n.styleModifications,n.spacingTokenChanges,n.activeColor,i,c,u,I.id]),rn=Gt(async(R,Z,de)=>{try{let Oe=Or(n.activeColor),{jobId:ye}=await Ms(R,Z,c,Oe,u,I.id,de,Br());Se(Ne=>h(f({},Ne),{[ye]:{annotationIds:[],styleSelectors:[],color:n.activeColor,threadId:R}}));let ke=n.annotations.filter(Ne=>Ne.threadId===R&&(Ne.status==="waiting_input"||Ne.status==="resolved"||Ne.status==="needs_review"));ke.length>0&&(i({type:"SET_ANNOTATION_STATUS",payload:{ids:ke.map(Ne=>Ne.id),status:"in_flight"}}),Se(Ne=>{let gt=Ne[ye];return gt?h(f({},Ne),{[ye]:h(f({},gt),{annotationIds:[...gt.annotationIds,...ke.map(Ue=>Ue.id)]})}):Ne})),s.dismissQuestion(R)}catch(Oe){console.error("[Pare] Failed to send reply:",Oe)}},[n.activeColor,n.annotations,c,s.dismissQuestion,i,u,I.id]),mn=Xt(new Set);zt(()=>{for(let R of s.pendingQuestions){if(mn.current.has(R.jobId))continue;mn.current.add(R.jobId);let Z=R.annotationIds&&R.annotationIds.length>0?R.annotationIds:void 0;!Z&&R.threadId&&(Z=n.annotations.filter(de=>de.threadId===R.threadId).map(de=>de.id)),Z&&Z.length>0&&i({type:"SET_ANNOTATION_QUESTION",payload:{ids:Z,question:R.question,threadId:R.threadId}})}},[s.pendingQuestions,i,n.annotations]);let En=Ao(()=>{if(s.activeJobId&&s.activeJobId in Q)return Q[s.activeJobId].color;let R=Object.values(Q);return R.length>0?R[R.length-1].color:void 0},[s.activeJobId,Q]),J=Gt(R=>{Ge(R)},[]),Ie=Gt(R=>{if(!R){z(null);return}let Z=Le.current.get(R);Z&&Z.length>0?z(new Set(Z)):z(null)},[]),Fe=Gt(async R=>{try{let Z=R?`${c}/cancel?jobId=${R}`:`${c}/cancel`;await fetch(Z,{method:"POST"})}catch(Z){}},[c]);zt(()=>{n.activeTool==="model"&&ge&&Ge(null)},[n.activeTool]);let ft=Xt(null);zt(()=>{n.isAnnotating?ft.current&&(Ge(ft.current),ft.current=null):ge&&(ft.current=ge,Ge(null))},[n.isAnnotating]);let Lt=Ao(()=>{if(!ge)return null;for(let[R,Z]of Object.entries(Q))if(Z.threadId===ge)return R;return null},[ge,Q]),[pt,bt]=Ut(!1),[St,dn]=Ut(0),$t=Xt(null),kt=Gt(R=>{R?($t.current&&(clearTimeout($t.current),$t.current=null),bt(!0)):$t.current=setTimeout(()=>{bt(!1),$t.current=null},150)},[]),hn=Gt(()=>{dn(R=>R+1),s.clearEvents(),Ge(null),dt(new Set)},[s.clearEvents]);zt(()=>()=>{$t.current&&clearTimeout($t.current)},[]);let W=Ao(()=>({isEnabled:t}),[t]);return t?ca(da.Provider,{value:W,children:[e,Po(_l,{state:n,dispatch:i,onScreenshot:$e,inFlightAnnotationIds:fe,inFlightStyleSelectors:lt,inFlightSelectorColors:Qe,onAttachImages:en,onReply:s.isConnected?rn:void 0,onViewThread:s.isConnected?J:void 0,onCloseThread:R=>{Ge(null),R&&dt(Z=>new Set(Z).add(R))},onModelComponentsAdd:s.isConnected?ne:void 0,onModelComponentFocus:s.isConnected?Ae:void 0,onModelComponentHover:ve,modelComponentNames:T,modelPanelHoveredComponent:ae,modelSpacingTokenHover:We,highlightedAnnotationIds:Ve,externalCanvasRef:l,toolbarRef:a}),Po(na,{children:ca(ta,{children:[Po(Zl,{state:n,dispatch:i,onScreenshot:$e,onSendToClaude:s.isConnected?Kt:void 0,hasActiveJobs:Object.keys(Q).length>0||s.activeJobIds.length>0,activeJobColor:En,onCrosshairHover:kt,onClear:hn,provider:u,onProviderChange:s.isConnected&&v.length>1?$:void 0,availableProviders:v,modelIndex:g,modelCount:E.length,modelLabel:I.label,onModelChange:s.isConnected?q:void 0,onViewThread:s.isConnected?J:void 0,isThreadPanelOpen:ge!==null,mcpStatus:w,onInstallMcp:s.isConnected?j:void 0,mcpJustInstalled:A,bridgeUrl:c,isBridgeConnected:s.isConnected,modelSelectedComponent:K,modelCanvasHoveredComponent:me,onModelComponentHover:Re,onSpacingTokenHover:Me,onModifySpacingToken:s.isConnected?Ee:void 0,onDeleteSpacingToken:s.isConnected?ce:void 0,modelRefreshKey:Ke,onModelComponentAdded:G,onModelComponentRemoved:oe,toolbarRef:a}),ge&&s.isConnected&&Po(aa,{threadId:ge,bridgeUrl:c,accentColor:(Be=(Pe=n.annotations.find(R=>R.threadId===ge))==null?void 0:Pe.color)!=null?Be:n.activeColor,isStreaming:Lt!==null,streamingEvents:Lt?s.events.filter(R=>R.data.jobId===Lt):[],onClose:()=>Ge(null),onReply:rn,onCancel:Lt?()=>Fe(Lt):void 0,lastError:(It=(he=s.lastErrorByJob)==null?void 0:he[Lt!=null?Lt:""])!=null?It:void 0,toolbarRef:a}),Po(ea,{bridge:s,bridgeUrl:c,inFlightJobs:Q,isVisible:pt||s.lastResponseText!==null||s.activeJobIds.length>0,onHover:kt,clearSignal:St,onReply:rn,onViewThread:J,onCancel:Fe,onHoverJob:Ie,isConnected:s.isConnected,dismissedThreadIds:xt})]})})]}):Po(Fp,{children:e})}function Hp(){let e=Bp(da);if(!e)throw new Error("usePopmelt must be used within PopmeltProvider");return e}export{Dp as PopmeltProvider,Hp as usePopmelt};
49
+ `,Cf={borderTop:"1px solid rgba(0, 0, 0, 0.08)",padding:12};function Oa(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 Da(e){return new Date(e).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var is=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],kf=3e3,Mf=250;function Tf({color:e}){let[t,n]=co(0),[r,o]=co(()=>Math.floor(Math.random()*is.length));return Yn(()=>{let i=setInterval(()=>n(l=>(l+1)%2),Mf),s=setInterval(()=>o(l=>(l+1)%is.length),kf);return()=>{clearInterval(i),clearInterval(s)}},[]),Bt("span",{style:{display:"inline-flex",alignItems:"center",gap:4},children:[Ye("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?Bt(ss,{children:[Ye("circle",{cx:"7",cy:"7",r:"2"}),Ye("circle",{cx:"17",cy:"7",r:"2"}),Ye("circle",{cx:"7",cy:"17",r:"2"}),Ye("circle",{cx:"17",cy:"17",r:"2"})]}):Bt(ss,{children:[Ye("circle",{cx:"12",cy:"6",r:"2"}),Ye("circle",{cx:"6",cy:"12",r:"2"}),Ye("circle",{cx:"18",cy:"12",r:"2"}),Ye("circle",{cx:"12",cy:"18",r:"2"})]})}),Ye("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:is[r]})]})}function If(e){var o;let t=String(e.data.tool||""),n=e.data.file?String(e.data.file):null,r=n?(o=n.split("/").pop())!=null?o:n: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"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}}var Rf=new Set(["Read","Glob","Grep","WebFetch","WebSearch"]),Lf=new Set(["Edit","Write","Bash"]);function Af(e){let t=0,n=!1;for(let r of e){if(r.type!=="tool_use")continue;let o=String(r.data.tool||"");Lf.has(o)?n=!0:Rf.has(o)&&t++}return!n&&t>=3?"researching":n?"applying changes":null}function Pf(e){let t=[];for(let n of e)if(n.type==="tool_use"){let r=If(n);r&&t.push({kind:"tool",label:r})}else if(n.type==="delta"){let r=String(n.data.text||"");if(!r)continue;let o=t[t.length-1];o&&o.kind==="text"?o.text+=r:t.push({kind:"text",text:r})}else if(n.type==="thinking"){let r=String(n.data.text||"");if(!r)continue;let o=t[t.length-1];o&&o.kind==="thinking"?o.text+=r:t.push({kind:"thinking",text:r})}return t}function Na({threadId:e,bridgeUrl:t,accentColor:n,isStreaming:r,streamingEvents:o,onClose:i,onReply:s,onCancel:l,lastError:a,onMouseEnter:c,toolbarRef:d,currentModel:u,currentProvider:p}){let[g,v]=co([]),[S,y]=co(!0),[w,O]=co(""),[R,k]=co([]),E=Fn(null),A=Fn(null),D=Fn(null),K=Fn(r),$=Fn(rs()),C=Fn({x:0,y:0}),G=Fn(!1),te=Fn({x:0,y:0,offsetX:0,offsetY:0}),re=Fn(!1),[,Se]=co(0);Yn(()=>{try{let U=localStorage.getItem(os);if(U){let ee=JSON.parse(U);typeof ee.top=="number"&&typeof ee.left=="number"&&(re.current=!0,$.current={top:ee.top,left:ee.left},Se(Le=>Le+1))}}catch(U){}},[]),Yn(()=>{let U=()=>{re.current||($.current=rs()),Se(ee=>ee+1)};return window.addEventListener("resize",U,{passive:!0}),()=>window.removeEventListener("resize",U)},[]),Yn(()=>{let U=D.current;if(!U)return;let ee=se=>{se.button!==0||se.target.closest("button")||(se.preventDefault(),se.stopPropagation(),G.current=!0,te.current={x:se.clientX,y:se.clientY,offsetX:C.current.x,offsetY:C.current.y})},Le=se=>{if(!G.current)return;let Ve=te.current,Tt=Ve.offsetX+(se.clientX-Ve.x),rt=Ve.offsetY+(se.clientY-Ve.y),Je=Math.max(Do,Math.min(window.innerWidth-Fr-2*ls-Do,$.current.left+Tt)),_=Math.max(Do,$.current.top+rt);C.current={x:Je-$.current.left,y:_-$.current.top};let Q=A.current;Q&&(Q.style.top=`${_}px`,Q.style.left=`${Je}px`,Q.style.height=`${Ba(_,Je,d==null?void 0:d.current)}px`)},Fe=()=>{if(!G.current)return;let se=$.current.top+C.current.y,Ve=$.current.left+C.current.x;$.current={top:se,left:Ve},C.current={x:0,y:0},re.current=!0;try{localStorage.setItem(os,JSON.stringify({top:se,left:Ve}))}catch(Tt){}G.current=!1},xe=()=>{$.current=rs(),C.current={x:0,y:0},re.current=!1;try{localStorage.removeItem(os)}catch(se){}Se(se=>se+1)};return U.addEventListener("mousedown",ee),window.addEventListener("mousemove",Le),window.addEventListener("mouseup",Fe),U.addEventListener("dblclick",xe),()=>{U.removeEventListener("mousedown",ee),window.removeEventListener("mousemove",Le),window.removeEventListener("mouseup",Fe),U.removeEventListener("dblclick",xe)}},[]);let Te=Nr(()=>{fetch(`${t}/thread/${e}`).then(U=>U.json()).then(U=>{var ee;v((ee=U.messages)!=null?ee:[]),y(!1)}).catch(()=>y(!1))},[t,e]);Yn(()=>{y(!0),Te()},[Te]),Yn(()=>{K.current&&!r&&Te(),K.current=r},[r,Te]);let fe=o?Pf(o):[],Oe=o?Af(o):null;Yn(()=>{E.current&&(E.current.scrollTop=E.current.scrollHeight)},[g,fe.length,r]),Yn(()=>{let U=ee=>{ee.key==="Escape"&&(ee.stopPropagation(),i())};return document.addEventListener("keydown",U),()=>document.removeEventListener("keydown",U)},[i]);let ze=Nr(()=>{if(!w.trim()||!s)return;let U=w.trim(),ee=R.length>0?R:void 0;v(Le=>[...Le,{role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:ee?`${U} [${ee.length} image${ee.length>1?"s":""}]`:U}]),s(e,U,ee),O(""),k([])},[w,R,e,s]),Ce=Nr(U=>{let ee=U.clipboardData.items,Le=[];for(let Fe=0;Fe<ee.length;Fe++){let xe=ee[Fe];if(xe.type.startsWith("image/")){let se=xe.getAsFile();se&&Le.push(se)}}Le.length>0&&(U.preventDefault(),k(Fe=>[...Fe,...Le]))},[]),oe=Nr(U=>{U.key==="Enter"&&(U.metaKey||U.ctrlKey)&&(U.preventDefault(),ze())},[ze]),Ie=$.current.top+C.current.y,Re=$.current.left+C.current.x,Ee=Ba(Ie,Re,d==null?void 0:d.current);return Bt(ss,{children:[Ye("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:U=>{U.target===U.currentTarget&&i()},style:{position:"fixed",inset:0,zIndex:9999}}),Bt("div",{ref:A,style:h(f({},vf),{height:Ee,position:"fixed",top:Ie,left:Re,zIndex:1e4}),"data-devtools":"thread-panel",onMouseEnter:c,children:[Bt("div",{ref:D,style:h(f({},Sf),{backgroundColor:n,color:"#ffffff",cursor:"grab",userSelect:"none",WebkitUserSelect:"none"}),children:[Ye("span",{children:"Conversation"}),Ye("button",{onClick:i,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),Ye("style",{dangerouslySetInnerHTML:{__html:Ef}}),Bt("div",{ref:E,style:wf,"data-devtools":"thread-panel-messages",children:[S&&Ye("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!S&&g.length===0&&!r&&Ye("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),g.map((U,ee)=>{let Le=U.role==="human";if(U.cancelled||U.error)return Bt("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:ee===g.length-1?1:.5},children:[Bt("div",{style:{display:"flex",alignItems:"center",gap:4},children:[Ye("span",{style:{fontSize:11,color:U.error?"#dc2626":"#9ca3af",fontStyle:"italic"},children:U.error?"Error":"Cancelled"}),Ye("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:Da(U.timestamp)})]}),U.error&&Ye("div",{style:{fontSize:12,color:"#6b7280",marginTop:4,lineHeight:1.4},children:U.error})]},`${U.jobId}-${ee}`);let Fe=Le?U.replyToQuestion||U.feedbackSummary||"(annotation)":Oa(U.responseText||""),xe=Le?void 0:U.question,se=!Le&&U.resolutions&&U.resolutions.length>0,Ve=!Le&&U.toolsUsed&&U.toolsUsed.length>0;if(!Fe&&!xe&&!se)return null;let Tt=ee===g.length-1;return Bt("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:Tt?1:.5},children:[Bt("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[!Le&&Ye(Vi,{provider:U.provider,size:11,style:{color:"#6b7280"}}),Ye("span",{style:{fontWeight:600,fontSize:11,color:Le?n:"#6b7280"},children:Le?"You":Ui(U.model,U.provider)}),Ye("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:Da(U.timestamp)})]}),Fe&&Ye("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:Le?Fe:Dr(Fe)}),xe&&Ye("div",{style:{marginTop:Fe?4:0,lineHeight:1.5,wordBreak:"break-word"},children:Dr(xe)}),(Ve||se)&&Bt("div",{style:{marginTop:Fe||xe?6:0,padding:"4px 8px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#6b7280"},children:[Ve&&Ye("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:U.toolsUsed.map((rt,Je)=>Ye("div",{children:rt},Je))}),se&&U.resolutions.map((rt,Je)=>{var q;let _=(q=rt.finalScope)!=null?q:rt.inferredScope,Q=_?`${_.breadth} \xB7 ${_.target}`:null;return Bt("div",{style:{marginTop:Ve?4:0},children:[Ye("span",{style:{color:rt.status==="resolved"?"#10b981":"#f59e0b"},children:rt.status==="resolved"?"Done":"Needs review"}),Q&&Ye("span",{style:{marginLeft:6,padding:"1px 5px",backgroundColor:"rgba(0, 0, 0, 0.06)",fontSize:10,fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace"},children:Q}),rt.summary?` \u2014 ${rt.summary}`:""]},Je)})]})]},`${U.jobId}-${ee}`)}),r&&Bt("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[Bt("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[Ye(Vi,{provider:p,size:11,style:{color:"#6b7280"}}),Ye("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:Ui(u,p)}),Oe&&Ye("span",{style:{fontSize:10,color:"#b0b7c3",fontStyle:"italic"},children:Oe}),Bt("span",{style:{marginLeft:"auto",display:"flex",alignItems:"center",gap:6},children:[Ye(Tf,{color:n}),l&&Ye("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"},children:"Cancel"})]})]}),fe.map((U,ee)=>{if(U.kind==="tool")return Ye("div",{style:{paddingLeft:12,fontSize:11,color:"#9ca3af",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",lineHeight:1.6},children:U.label},ee);if(U.kind==="thinking")return Ye("div",{style:{paddingLeft:12,marginTop:2,marginBottom:2,fontSize:11,color:"#9ca3af",fontStyle:"italic",lineHeight:1.4,whiteSpace:"pre-wrap",wordBreak:"break-word",maxHeight:80,overflowY:"auto"},children:U.text},ee);let Le=Oa(U.text);return Le?Ye("div",{style:{paddingLeft:12,marginTop:2,marginBottom:2,lineHeight:1.5,wordBreak:"break-word"},children:Dr(Le)},ee):null})]})]}),!r&&a&&Bt("div",{style:{padding:"8px 16px",backgroundColor:"rgba(239, 68, 68, 0.06)",borderBottom:"1px solid rgba(0,0,0,0.04)",fontSize:11,color:"#dc2626",lineHeight:1.4},children:[Ye("span",{style:{fontWeight:600},children:"Error: "}),a]}),s&&Bt("div",{style:Cf,children:[R.length>0&&Bt("div",{style:{fontSize:11,color:"#6b7280",marginBottom:4,display:"flex",alignItems:"center",gap:4},children:[Bt("span",{children:[R.length," image",R.length>1?"s":""," attached"]}),Ye("button",{onClick:()=>k([]),style:{background:"none",border:"none",cursor:"pointer",fontSize:11,color:"#9ca3af",padding:"0 2px"},children:"\xD7"})]}),Ye("textarea",{value:w,onChange:U=>O(U.target.value),onKeyDown:oe,onPaste:Ce,placeholder:"Reply... (Cmd+Enter to send)",style:{width:"100%",minHeight:60,padding:4,fontSize:12,fontFamily:zt,backgroundColor:"rgba(0, 0, 0, 0.03)",color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)",borderRadius:0,outline:"none",resize:"vertical",lineHeight:1.4,boxSizing:"border-box"}}),Ye("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:6},children:Ye("button",{onClick:ze,disabled:!w.trim(),style:{padding:"5px 14px",fontSize:11,fontFamily:zt,fontWeight:600,backgroundColor:w.trim()?n:"rgba(0,0,0,0.1)",color:w.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:w.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}import{Fragment as Hf,jsx as Fo,jsxs as Fa}from"react/jsx-runtime";var Ha=Bf(null),as="devtools-provider",cs="devtools-model",ds="devtools-open-thread-id";function Df(e,t,n){let r=e==="codex"?Ko:Xo;return Math.min(n,(t==="codex"?Ko:Xo).length-1)}function Nf({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"}){var V,Ae,De,he,It,Zt;let[o,i]=Qs(),s=qs(n),l=Vt(null),a=Vt(null),c=(V=Xs())!=null?V:n,d=Vt(new Map),[u,p]=Ut(()=>typeof window=="undefined"?"claude":localStorage.getItem(as)||"claude"),[g,v]=Ut(()=>{if(typeof window=="undefined")return 0;let L=localStorage.getItem(cs);return L&&parseInt(L,10)||0}),[S,y]=Ut(["claude","codex"]),[w,O]=Ut({}),[R,k]=Ut(!1);Ot(()=>{s.isConnected&&As(c).then(L=>{if(!L)return;let Z=Object.entries(L.providers).filter(([,me])=>me.available).map(([me])=>me);Z.length>0&&y(Z);let ce={};for(let[me,Pe]of Object.entries(L.providers))Pe.mcp&&(ce[me]=Pe.mcp);O(ce),Object.values(ce).every(me=>me.found)&&k(!1)})},[s.isConnected,s.capabilitiesVersion,c]),Ot(()=>{if(S.length>0&&!S.includes(u)){let L=S[0];p(L),localStorage.setItem(as,L)}},[S,u]);let E=u==="codex"?Ko:Xo,A=(Ae=E[g])!=null?Ae:E[0],D=jt(L=>{let Z=u;p(L),localStorage.setItem(as,L);let ce=Df(Z,L,g);v(ce),localStorage.setItem(cs,String(ce))},[u,g]),K=jt(L=>{v(L),localStorage.setItem(cs,String(L))},[]),$=jt(async()=>{let L=await Os(c);if(!L)return;let Z={};for(let[ce,pe]of Object.entries(L.capabilities.providers))pe.mcp&&(Z[ce]=pe.mcp);O(Z),L.results.some(ce=>ce.installed)&&k(!0)},[c]),[C,G]=Ut(new Set),[te,re]=Ut(null),[Se,Te]=Ut(null),[fe,Oe]=Ut(null),[ze,Ce]=Ut(null);Ot(()=>{s.isConnected&&go(c).then(L=>{L!=null&&L.components&&G(new Set(Object.keys(L.components)))})},[s.isConnected,c]);let oe=jt(async L=>{let Z=[];for(let ce of L)try{(await Ds(ce,c)).added&&Z.push(ce)}catch(pe){console.error("[Popmelt] Failed to add component to model:",ce,pe)}Z.length>0&&(G(ce=>{let pe=new Set(ce);for(let me of Z)pe.add(me);return pe}),re(Z[Z.length-1]))},[c]),Ie=jt(L=>{re(L)},[]),Re=jt(()=>{go(c).then(L=>{L!=null&&L.components&&G(new Set(Object.keys(L.components)))})},[c]),Ee=jt(async L=>{try{(await Ns(L,c)).removed&&G(ce=>{let pe=new Set(ce);return pe.delete(L),pe})}catch(Z){console.error("[Popmelt] Failed to remove component from model:",Z)}},[c]),U=jt((L,Z)=>{i({type:"MODIFY_SPACING_TOKEN",payload:L}),i({type:"ADD_SPACING_TOKEN_CHANGE",payload:Z})},[i]),ee=jt((L,Z)=>{i({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:L,originalValue:Z}})},[i]),[Le,Fe]=Ut(0),xe=Vt([]);Ot(()=>{let L=xe.current,Z=o.spacingTokenMods;xe.current=Z;let ce=new Map(L.map(Pe=>[Pe.tokenPath,Pe])),pe=new Map(Z.map(Pe=>[Pe.tokenPath,Pe])),me=!1;for(let[Pe,qe]of pe){let dt=ce.get(Pe);if(!(dt&&dt.currentValue===qe.currentValue)){me=!0,qe.currentValue==="__deleted__"?Fs(Pe,c).catch(Ne=>console.error("[Popmelt] Failed to sync token delete:",Ne)):$r(Pe,qe.currentValue,c).catch(Ne=>console.error("[Popmelt] Failed to sync token update:",Ne));for(let Ne of qe.targets){let pt=document.querySelector(Ne.selector);if(pt)if(qe.currentValue==="__deleted__")pt.style.removeProperty(Ne.property);else{let it=qe.currentPx;it>0&&pt.style.setProperty(Ne.property,`${it}px`,"important")}}}}for(let[Pe,qe]of ce)if(!pe.has(Pe)){me=!0,$r(Pe,qe.originalValue,c).catch(dt=>console.error("[Popmelt] Failed to restore token on undo:",dt));for(let dt of qe.targets){let Ne=document.querySelector(dt.selector);Ne&&Ne.style.removeProperty(dt.property)}}me&&Fe(Pe=>Pe+1)},[o.spacingTokenMods,c]);let[se,Ve]=Ut(()=>typeof window=="undefined"?null:localStorage.getItem(ds)||null),[Tt,rt]=Ut(new Set),[Je,_]=Ut(null);Ot(()=>{se?localStorage.setItem(ds,se):localStorage.removeItem(ds)},[se]);let Q="popmelt-in-flight-jobs",[q,be]=Ut(()=>{try{let L=sessionStorage.getItem(Q);return L?JSON.parse(L):{}}catch(L){return{}}});Ot(()=>{try{Object.keys(q).length>0?sessionStorage.setItem(Q,JSON.stringify(q)):sessionStorage.removeItem(Q)}catch(L){}},[q]);let Me=Vt(new Map);Ot(()=>{for(let[L,Z]of Object.entries(q))Z.annotationIds.length>0&&Me.current.set(L,Z.annotationIds)},[q]);let Ke=Vt(!1);Ot(()=>{if(Ke.current||o.annotations.length===0)return;Ke.current=!0;let L=new Set;for(let ce of Object.values(q))for(let pe of ce.annotationIds)L.add(pe);let Z=o.annotations.filter(ce=>L.has(ce.id)?!1:!!(ce.status==="in_flight"||(ce.status==="pending"||!ce.status)&&(ce.captured||ce.threadId))).map(ce=>ce.id);Z.length>0&&i({type:"SET_ANNOTATION_STATUS",payload:{ids:Z,status:"dismissed"}})},[o.annotations,q,i]);let ge=No(()=>{let L=new Set;for(let Z of Object.values(q))for(let ce of Z.annotationIds)L.add(ce);return L},[q]),ut=No(()=>{let L=new Set;for(let Z of Object.values(q))for(let ce of Z.styleSelectors)L.add(ce);return L},[q]),Qe=No(()=>{let L=new Map;for(let Z of Object.values(q)){for(let ce of Z.styleSelectors)L.set(ce,Z.color);for(let ce of Z.annotationIds){let pe=o.annotations.find(me=>me.id===ce);if(pe&&(pe.linkedSelector&&L.set(pe.linkedSelector,Z.color),pe.groupId))for(let me of o.annotations)me.groupId===pe.groupId&&me.linkedSelector&&L.set(me.linkedSelector,Z.color)}}return L},[q,o.annotations]),Mt=Vt(o.annotations);Mt.current=o.annotations;let Dt=Vt(o.styleModifications);Dt.current=o.styleModifications;let at=Vt(q);at.current=q,Ot(()=>{let L=null,Z=()=>{var dt,Ne;if(Object.keys(at.current).length>0)return;let pe=Mt.current,me=Dt.current,Pe=[],qe=[];for(let pt of pe){if(!pt.linkedSelector||!pt.linkedSelector.startsWith("[data-pm=")||pt.captured||pt.status&&pt.status!=="pending")continue;let it=document.querySelector(pt.linkedSelector);!it&&((Ne=(dt=pt.elements)==null?void 0:dt[0])!=null&&Ne.selector)&&(it=document.querySelector(pt.elements[0].selector)),it||Pe.push(pt.linkedSelector)}for(let pt of me)document.querySelector(pt.selector)||qe.push(pt.selector);(Pe.length>0||qe.length>0)&&i({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:Pe,styleSelectors:qe}})},ce=new MutationObserver(pe=>{pe.some(me=>me.removedNodes.length>0)&&(L&&clearTimeout(L),L=setTimeout(Z,3e3))});return ce.observe(document.body,{childList:!0,subtree:!0}),()=>{ce.disconnect(),L&&clearTimeout(L)}},[i]),Ot(()=>{s.lastCompletedJobId&&s.lastCompletedJobId in q&&be(L=>{var pe;let me=L,{[pe=s.lastCompletedJobId]:Z}=me;return _n(me,[lr(pe)])})},[s.lastCompletedJobId]);let ct=Vt(!1);Ot(()=>{if(!s.isConnected){ct.current=!1;return}if(ct.current||(ct.current=!0,Object.keys(q).length===0))return;let Z=setTimeout(()=>{fo(c).then(ce=>{var me;if(!ce)return;let pe=new Set(((me=ce.activeJobs)!=null?me:[]).map(Pe=>Pe.id));be(Pe=>{let qe=Object.keys(Pe).filter(Ne=>!pe.has(Ne));if(qe.length===0)return Pe;let dt=f({},Pe);for(let Ne of qe)delete dt[Ne];return dt})})},500);return()=>clearTimeout(Z)},[s.isConnected,c]);let Nt=Vt(new Set);Ot(()=>{let L=s.events.filter(Z=>Z.type==="done"&&Z.data.resolutions);for(let Z of L){let ce=Z.data.jobId;Nt.current.has(ce)||(Nt.current.add(ce),Array.isArray(Z.data.resolutions)&&i({type:"APPLY_RESOLUTIONS",payload:{resolutions:Z.data.resolutions,threadId:Z.data.threadId}}))}},[s.events,i]);let nt=Vt(new Set);Ot(()=>{let L=s.events.filter(Z=>Z.type==="error"&&Z.data.cancelled);for(let Z of L){let ce=Z.data.jobId;if(!ce||nt.current.has(ce))continue;nt.current.add(ce);let pe=q[ce];pe&&pe.annotationIds.length>0&&i({type:"SET_ANNOTATION_STATUS",payload:{ids:pe.annotationIds,status:"dismissed"}})}},[s.events,q,i]);let bt=Vt(0);Ot(()=>{let L=s.incrementalResolutions;if(L.length<=bt.current)return;let Z=L.slice(bt.current);bt.current=L.length,i({type:"APPLY_RESOLUTIONS",payload:{resolutions:Z}})},[s.incrementalResolutions,i]),Ot(()=>{s.incrementalResolutions.length===0&&(bt.current=0)},[s.incrementalResolutions.length]);let $e=Vt(s.status);Ot(()=>{let L=$e.current;$e.current=s.status,L==="disconnected"&&s.status==="idle"&&be({})},[s.status]);let Kt=jt(async()=>{let L=l.current;if(!L)return!1;let Z=await Ur(document.body,L,o.annotations);if(Z.length===0)return!1;let ce=await tl(Z,o.annotations,o.styleModifications);return ce&&i({type:"MARK_CAPTURED"}),ce},[o.annotations,o.styleModifications,i]),qt=jt((L,Z)=>{let ce=d.current.get(L)||[];d.current.set(L,[...ce,...Z])},[]),bn=jt(async()=>{let L=l.current;if(!L)return!1;let Z=o.annotations.filter(Ne=>{var pt;return((pt=Ne.status)!=null?pt:"pending")==="pending"}),ce=o.spacingTokenChanges.filter(Ne=>!Ne.captured);if(Z.length===0&&o.styleModifications.filter(Ne=>!Ne.captured).length===0&&ce.length===0)return!1;let pe=await Ur(document.body,L,o.annotations);if(pe.length===0)return!1;let me=await Jr(pe);if(!me)return!1;let Pe=Vr(Z,o.styleModifications,void 0,ce.length>0?ce:void 0),qe=JSON.stringify(Pe),dt=new Map;for(let Ne of Z){let pt=d.current.get(Ne.id);if(pt&&pt.length>0&&dt.set(Ne.id,pt),Ne.groupId){for(let it of Z)if(it.groupId===Ne.groupId&&it.id!==Ne.id){let In=d.current.get(it.id);In&&In.length>0&&dt.set(it.id,In)}}}try{let Ne=Gr(o.activeColor),{jobId:pt,threadId:it}=await Bs(me,qe,c,Ne,u,A.id,dt.size>0?dt:void 0,jr());for(let rn of dt.keys())d.current.delete(rn);let In=Z.map(rn=>rn.id),er=o.styleModifications.filter(rn=>!rn.captured).map(rn=>rn.selector);be(rn=>h(f({},rn),{[pt]:{annotationIds:In,styleSelectors:er,color:o.activeColor,threadId:it}})),i({type:"MARK_CAPTURED"}),it&&In.length>0&&i({type:"SET_ANNOTATION_THREAD",payload:{ids:In,threadId:it}});let Rn=o.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),tr=((Rn!=null&&Rn[1]?parseFloat(Rn[1]):29)+60)%360;return i({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${tr})`}),!0}catch(Ne){return console.error("[Pare] Failed to send to bridge:",Ne),!1}},[o.annotations,o.styleModifications,o.spacingTokenChanges,o.activeColor,i,c,u,A.id]),un=jt(async(L,Z,ce)=>{try{let pe=Gr(o.activeColor),{jobId:me}=await Hs(L,Z,c,pe,u,A.id,ce,jr());be(qe=>h(f({},qe),{[me]:{annotationIds:[],styleSelectors:[],color:o.activeColor,threadId:L}}));let Pe=o.annotations.filter(qe=>qe.threadId===L&&(qe.status==="waiting_input"||qe.status==="resolved"||qe.status==="needs_review"));Pe.length>0&&(i({type:"SET_ANNOTATION_STATUS",payload:{ids:Pe.map(qe=>qe.id),status:"in_flight"}}),be(qe=>{let dt=qe[me];return dt?h(f({},qe),{[me]:h(f({},dt),{annotationIds:[...dt.annotationIds,...Pe.map(Ne=>Ne.id)]})}):qe})),s.dismissQuestion(L)}catch(pe){console.error("[Pare] Failed to send reply:",pe)}},[o.activeColor,o.annotations,c,s.dismissQuestion,i,u,A.id]),xn=Vt(new Set);Ot(()=>{for(let L of s.pendingQuestions){if(xn.current.has(L.jobId))continue;xn.current.add(L.jobId);let Z=L.annotationIds&&L.annotationIds.length>0?L.annotationIds:void 0;!Z&&L.threadId&&(Z=o.annotations.filter(ce=>ce.threadId===L.threadId).map(ce=>ce.id)),Z&&Z.length>0&&i({type:"SET_ANNOTATION_QUESTION",payload:{ids:Z,question:L.question,threadId:L.threadId}})}},[s.pendingQuestions,i,o.annotations]);let X=No(()=>{if(s.activeJobId&&s.activeJobId in q)return q[s.activeJobId].color;let L=Object.values(q);return L.length>0?L[L.length-1].color:void 0},[s.activeJobId,q]),ke=jt(L=>{Ve(L)},[]),We=jt(L=>{if(!L){_(null);return}let Z=Me.current.get(L);Z&&Z.length>0?_(new Set(Z)):_(null)},[]),vt=jt(async L=>{try{let Z=L?`${c}/cancel?jobId=${L}`:`${c}/cancel`;await fetch(Z,{method:"POST"})}catch(Z){}},[c]);Ot(()=>{o.activeTool==="model"&&se&&Ve(null)},[o.activeTool]);let Jt=Vt(null);Ot(()=>{o.isAnnotating?Jt.current&&(Ve(Jt.current),Jt.current=null):se&&(Jt.current=se,Ve(null))},[o.isAnnotating]);let tt=No(()=>{if(!se)return null;for(let[L,Z]of Object.entries(q))if(Z.threadId===se)return L;return null},[se,q]),[wt,St]=Ut(!1),[pn,fn]=Ut(0),mt=Vt(null),gn=jt(L=>{L?(mt.current&&(clearTimeout(mt.current),mt.current=null),St(!0)):mt.current=setTimeout(()=>{St(!1),mt.current=null},150)},[]),W=jt(()=>{fn(L=>L+1),s.clearEvents(),Ve(null),rt(new Set)},[s.clearEvents]);Ot(()=>()=>{mt.current&&clearTimeout(mt.current)},[]);let ne=No(()=>({isEnabled:t}),[t]);return t?Fa(Ha.Provider,{value:ne,children:[e,Fo(na,{state:o,dispatch:i,onScreenshot:Kt,inFlightAnnotationIds:ge,inFlightStyleSelectors:ut,inFlightSelectorColors:Qe,onAttachImages:qt,onReply:s.isConnected?un:void 0,onViewThread:s.isConnected?ke:void 0,onCloseThread:L=>{Ve(null),L&&rt(Z=>new Set(Z).add(L))},onModelComponentsAdd:s.isConnected?oe:void 0,onModelComponentFocus:s.isConnected?Ie:void 0,onModelComponentHover:Te,modelComponentNames:C,modelPanelHoveredComponent:fe,modelSpacingTokenHover:ze,highlightedAnnotationIds:Je,externalCanvasRef:l,toolbarRef:a}),Fo(Aa,{children:Fa(Ra,{children:[Fo(ka,{state:o,dispatch:i,onScreenshot:Kt,onSendToClaude:s.isConnected?bn:void 0,hasActiveJobs:Object.keys(q).length>0||s.activeJobIds.length>0,activeJobColor:X,onCrosshairHover:gn,onClear:W,provider:u,onProviderChange:s.isConnected&&S.length>1?D:void 0,availableProviders:S,modelIndex:g,modelCount:E.length,modelLabel:A.label,onModelChange:s.isConnected?K:void 0,onViewThread:s.isConnected?ke:void 0,isThreadPanelOpen:se!==null,mcpStatus:w,onInstallMcp:s.isConnected?$:void 0,mcpJustInstalled:R,bridgeUrl:c,isBridgeConnected:s.isConnected,modelSelectedComponent:te,modelCanvasHoveredComponent:Se,onModelComponentHover:Oe,onSpacingTokenHover:Ce,onModifySpacingToken:s.isConnected?U:void 0,onDeleteSpacingToken:s.isConnected?ee:void 0,modelRefreshKey:Le,onModelComponentAdded:Re,onModelComponentRemoved:Ee,toolbarRef:a}),se&&s.isConnected&&Fo(Na,{threadId:se,bridgeUrl:c,accentColor:(he=(De=o.annotations.find(L=>L.threadId===se))==null?void 0:De.color)!=null?he:o.activeColor,isStreaming:tt!==null,streamingEvents:tt?s.events.filter(L=>L.data.jobId===tt):[],onClose:()=>Ve(null),onReply:un,onCancel:tt?()=>vt(tt):void 0,lastError:(Zt=(It=s.lastErrorByJob)==null?void 0:It[tt!=null?tt:""])!=null?Zt:void 0,toolbarRef:a,currentModel:A.id,currentProvider:u}),Fo(Ia,{bridge:s,bridgeUrl:c,inFlightJobs:q,isVisible:wt||s.lastResponseText!==null||s.activeJobIds.length>0,onHover:gn,clearSignal:pn,onReply:un,onViewThread:ke,onCancel:vt,onHoverJob:We,isConnected:s.isConnected,dismissedThreadIds:Tt})]})})]}):Fo(Hf,{children:e})}function Ff(){let e=Of(Ha);if(!e)throw new Error("usePopmelt must be used within PopmeltProvider");return e}export{Nf as PopmeltProvider,Ff as usePopmelt};