@popmelt.com/core 0.5.5 → 0.5.6

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.
Files changed (2) hide show
  1. package/dist/index.mjs +15 -15
  2. package/package.json +1 -1
package/dist/index.mjs CHANGED
@@ -1,21 +1,21 @@
1
1
  "use client";
2
- var gl=Object.defineProperty,ml=Object.defineProperties;var hl=Object.getOwnPropertyDescriptors;var $o=Object.getOwnPropertySymbols;var fs=Object.prototype.hasOwnProperty,gs=Object.prototype.propertyIsEnumerable;var ps=(t,e,o)=>e in t?gl(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,m=(t,e)=>{for(var o in e||(e={}))fs.call(e,o)&&ps(t,o,e[o]);if($o)for(var o of $o(e))gs.call(e,o)&&ps(t,o,e[o]);return t},b=(t,e)=>ml(t,hl(e));var Wo=t=>typeof t=="symbol"?t:t+"",Bn=(t,e)=>{var o={};for(var n in t)fs.call(t,n)&&e.indexOf(n)<0&&(o[n]=t[n]);if(t!=null&&$o)for(var n of $o(t))e.indexOf(n)<0&&gs.call(t,n)&&(o[n]=t[n]);return o};import{createContext as fp,useCallback as Pe,useContext as gp,useEffect as Te,useMemo as wo,useRef as Qe,useState as Ke}from"react";import{useCallback as jo,useEffect as yl,useRef as Ts,useState as bl}from"react";var on="http://localhost:1111";async function ms(t=on){try{let e=await fetch(`${t}/capabilities`);return e.ok?await e.json():null}catch(e){return null}}async function Yo(t=on){try{let e=new AbortController,o=setTimeout(()=>e.abort(),2e3),n=await fetch(`${t}/status`,{signal:e.signal});return clearTimeout(o),n.ok?await n.json():null}catch(e){return null}}async function hs(t,e,o=on,n,r,i,a){let s=new FormData;if(s.append("screenshot",t,"screenshot.png"),s.append("feedback",e),n&&s.append("color",n),r&&s.append("provider",r),i&&s.append("model",i),a)for(let[l,d]of a)for(let u=0;u<d.length;u++)s.append(`image-${l}-${u}`,d[u],`image-${l}-${u}.png`);let c=await fetch(`${o}/send`,{method:"POST",body:s});if(!c.ok){let l=await c.text();throw new Error(`Bridge returned ${c.status}: ${l}`)}return c.json()}async function ys(t,e,o=on,n,r,i,a,s,c){let l=new FormData;l.append("screenshot",t,"screenshot.png"),l.append("goal",e),i&&l.append("pageUrl",i),a&&l.append("viewport",JSON.stringify(a)),n&&l.append("provider",n),r&&l.append("model",r),s&&l.append("manifest",JSON.stringify(s)),c&&l.append("feedback",c);let d=await fetch(`${o}/plan`,{method:"POST",body:l});if(!d.ok){let u=await d.text();throw new Error(`Bridge returned ${d.status}: ${u}`)}return d.json()}async function bs(t,e=on,o){let n=await fetch(`${e}/plan/approve`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({planId:t,approvedTaskIds:o})});if(!n.ok){let r=await n.text();throw new Error(`Bridge returned ${n.status}: ${r}`)}return n.json()}async function xs(t,e,o=on,n,r){let i=new FormData;i.append("screenshot",e,"screenshot.png"),i.append("planId",t),n&&i.append("provider",n),r&&i.append("model",r);let a=await fetch(`${o}/plan/review`,{method:"POST",body:i});if(!a.ok){let s=await a.text();throw new Error(`Bridge returned ${a.status}: ${s}`)}return a.json()}async function vs(t,e,o,n=on,r,i){let a=new FormData;a.append("screenshot",t,"screenshot.png"),a.append("planId",e),a.append("tasks",JSON.stringify(o)),r&&a.append("provider",r),i&&a.append("model",i);let s=await fetch(`${n}/plan/execute`,{method:"POST",body:a});if(!s.ok){let c=await s.text();throw new Error(`Bridge returned ${s.status}: ${c}`)}return s.json()}async function Ss(t=on,e){try{let o=await fetch(`${t}/mcp/install`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e?{serverUrl:e}:{})});return o.ok?await o.json():null}catch(o){return null}}async function ws(t,e=on){let o=await fetch(`${e}/model/component`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:t})});if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function ks(t,e=on){let o=await fetch(`${e}/model/component`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:t})});if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function vr(t,e,o=on){let n=await fetch(`${o}/model/token`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:t,value:e})});if(!n.ok){let r=await n.text();throw new Error(`Bridge returned ${n.status}: ${r}`)}return n.json()}async function Cs(t,e=on){let o=await fetch(`${e}/model/token`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:t})});if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function eo(t=on){var e;try{let o=await fetch(`${t}/model`);return o.ok&&(e=(await o.json()).model)!=null?e:null}catch(o){return null}}async function Es(t,e,o=on,n,r,i,a){let s;if(a&&a.length>0){let c=new FormData,l=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",l,"screenshot.png"),c.append("feedback",JSON.stringify({threadId:t,reply:e,color:n,provider:r,model:i}));for(let d=0;d<a.length;d++)c.append(`image-reply-${d}`,a[d],`reply-image-${d}.png`);s=await fetch(`${o}/reply`,{method:"POST",body:c})}else s=await fetch(`${o}/reply`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({threadId:t,reply:e,color:n,provider:r,model:i})});if(!s.ok){let c=await s.text();throw new Error(`Bridge returned ${s.status}: ${c}`)}return s.json()}function Ms(t="http://localhost:1111"){let[e,o]=bl({isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,pendingQuestions:[],pendingPlans:[],planReviews:[],incrementalResolutions:[]}),n=Ts(null),r=Ts(null),i=jo(()=>{n.current&&(n.current.close(),n.current=null);let l=new EventSource(`${t}/events`);n.current=l,l.addEventListener("connected",()=>{Yo(t).then(d=>{var f;let u=(f=d==null?void 0:d.activeJobs)!=null?f:d!=null&&d.activeJob?[d.activeJob]:[],p=u.length>0;o(g=>b(m({},g),{isConnected:!0,status:p?"streaming":"idle",activeJobId:p?u[u.length-1].id:g.activeJobId,activeJobIds:u.map(y=>y.id)}))})}),l.addEventListener("job_started",d=>{let u=JSON.parse(d.data),p=u.jobId;o(f=>b(m({},f),{status:"streaming",activeJobId:p,activeJobIds:[...f.activeJobIds,p],jobResponses:b(m({},f.jobResponses),{[p]:""}),jobThinking:b(m({},f.jobThinking),{[p]:""}),currentResponse:"",currentThinking:"",lastResponseText:null,lastThreadId:null,events:[...f.events,{type:"job_started",data:u,timestamp:Date.now()}]}))}),l.addEventListener("delta",d=>{let u=JSON.parse(d.data),p=u.jobId,f=u.text||"";o(g=>b(m({},g),{jobResponses:p?b(m({},g.jobResponses),{[p]:(g.jobResponses[p]||"")+f}):g.jobResponses,currentResponse:!p||p===g.activeJobId?g.currentResponse+f:g.currentResponse,events:[...g.events,{type:"delta",data:u,timestamp:Date.now()}]}))}),l.addEventListener("thinking",d=>{let u=JSON.parse(d.data),p=u.jobId,f=u.text||"";o(g=>b(m({},g),{jobThinking:p?b(m({},g.jobThinking),{[p]:(g.jobThinking[p]||"")+f}):g.jobThinking,currentThinking:!p||p===g.activeJobId?g.currentThinking+f:g.currentThinking,events:[...g.events,{type:"thinking",data:u,timestamp:Date.now()}]}))}),l.addEventListener("tool_use",d=>{let u=JSON.parse(d.data);o(p=>b(m({},p),{events:[...p.events,{type:"tool_use",data:u,timestamp:Date.now()}]}))}),l.addEventListener("done",d=>{let u=JSON.parse(d.data),p=u.jobId;o(f=>{var N;let g=p?f.activeJobIds.filter(R=>R!==p):f.activeJobIds,y=m({},f.jobResponses),S=m({},f.jobThinking),x=p?y[p]:void 0;p&&(delete y[p],delete S[p]);let L=p===f.activeJobId?g.length>0?g[g.length-1]:null:f.activeJobId;return b(m(b(m({},f),{activeJobIds:g,activeJobId:L,jobResponses:y,jobThinking:S,lastCompletedJobId:p!=null?p:f.activeJobId,lastResponseText:x||f.currentResponse||u.responseText||null,lastThreadId:(N=u.threadId)!=null?N:null}),p===f.activeJobId?{currentResponse:L&&y[L]||"",currentThinking:L&&S[L]||""}:{}),{events:[...f.events,{type:"done",data:u,timestamp:Date.now()}]})})}),l.addEventListener("question",d=>{let u=JSON.parse(d.data);o(p=>b(m({},p),{pendingQuestions:[...p.pendingQuestions,{jobId:u.jobId,threadId:u.threadId,question:u.question,annotationIds:u.annotationIds,timestamp:Date.now()}],events:[...p.events,{type:"question",data:u,timestamp:Date.now()}]}))}),l.addEventListener("plan_ready",d=>{let u=JSON.parse(d.data);o(p=>b(m({},p),{pendingPlans:[...p.pendingPlans,{jobId:u.jobId,planId:u.planId,tasks:u.tasks,threadId:u.threadId,timestamp:Date.now()}],events:[...p.events,{type:"plan_ready",data:u,timestamp:Date.now()}]}))}),l.addEventListener("plan_review",d=>{let u=JSON.parse(d.data);o(p=>b(m({},p),{planReviews:[...p.planReviews,{planId:u.planId,verdict:u.verdict,summary:u.summary,issues:u.issues,timestamp:Date.now()}],events:[...p.events,{type:"plan_review",data:u,timestamp:Date.now()}]}))}),l.addEventListener("task_resolved",d=>{var f;let u=JSON.parse(d.data),p=(f=u.resolutions)!=null?f:[];o(g=>b(m({},g),{incrementalResolutions:[...g.incrementalResolutions,...p],events:[...g.events,{type:"task_resolved",data:u,timestamp:Date.now()}]}))}),l.addEventListener("queue_drained",()=>{o(d=>b(m({},d),{status:d.status==="error"?"error":"idle",activeJobId:null,activeJobIds:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},incrementalResolutions:[]}))}),l.addEventListener("error",d=>{var u;if(l.readyState===EventSource.CLOSED)o(p=>b(m({},p),{isConnected:!1,status:"disconnected"})),r.current=setTimeout(()=>{Yo(t).then(p=>{p&&i()})},5e3);else if(d instanceof MessageEvent){let p=JSON.parse(d.data),f=(u=p.jobId)!=null?u:null;o(g=>{let y=f?g.activeJobIds.filter(x=>x!==f):g.activeJobIds,S=y.length>0?g.status:"error";return b(m({},g),{status:S,activeJobIds:y,lastCompletedJobId:f!=null?f:g.activeJobId,events:[...g.events,{type:"error",data:p,timestamp:Date.now()}]})})}}),l.onerror=()=>{l.readyState===EventSource.CLOSED&&o(d=>b(m({},d),{isConnected:!1,status:"disconnected"}))}},[t]);yl(()=>(Yo(t).then(l=>{l&&i()}),()=>{n.current&&(n.current.close(),n.current=null),r.current&&clearTimeout(r.current)}),[t,i]);let a=jo(()=>{o(l=>b(m({},l),{events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,incrementalResolutions:[]}))},[]),s=jo(l=>{o(d=>b(m({},d),{pendingQuestions:d.pendingQuestions.filter(u=>u.threadId!==l)}))},[]),c=jo(l=>{o(d=>b(m({},d),{pendingPlans:d.pendingPlans.filter(u=>u.planId!==l)}))},[]);return b(m({},e),{clearEvents:a,dismissQuestion:s,dismissPlan:c})}import{useEffect as xl,useReducer as vl}from"react";var Sl={isAnnotating:!1,activeTool:"inspector",activeColor:"#ff0000",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function no(){return Math.random().toString(36).substring(2,9)}function Is(t){return t.status?t:t.captured?b(m({},t),{status:"in_flight"}):b(m({},t),{status:"pending"})}function Ze(t){return b(m({},t),{undoStack:[...t.undoStack,{annotations:t.annotations,styleModifications:t.styleModifications,spacingTokenMods:t.spacingTokenMods}],redoStack:[]})}function wl(t,e){return b(m({},t),{isAnnotating:e})}function kl(t,e){return b(m({},t),{activeTool:e,inspectedElement:null})}function Cl(t,e){return b(m({},t),{activeColor:e})}function El(t,e){return b(m({},t),{strokeWidth:e})}function Tl(t,e){return b(m({},t),{currentPath:[e]})}function Ml(t,e){return b(m({},t),{currentPath:[...t.currentPath,e]})}function Il(t){return b(m({},t),{currentPath:[]})}function Ll(t,e){if(t.currentPath.length<2&&t.activeTool!=="text")return b(m({},t),{currentPath:[]});let o={id:no(),type:t.activeTool,points:t.currentPath,color:t.activeColor,strokeWidth:t.strokeWidth,timestamp:Date.now(),status:"pending",groupId:e==null?void 0:e.groupId,elements:e==null?void 0:e.elements},n=Ze(t);return b(m({},n),{annotations:[...t.annotations,o],currentPath:[]})}function Rl(t,e){var r;let o=m({id:(r=e.id)!=null?r:no(),type:"text",points:[e.point],text:e.text,fontSize:e.fontSize||12,color:t.activeColor,strokeWidth:t.strokeWidth,timestamp:Date.now(),status:"pending",groupId:e.groupId,linkedSelector:e.linkedSelector,linkedAnchor:e.linkedAnchor,elements:e.elements},e.imageCount?{imageCount:e.imageCount}:{}),n=e.groupId?t:Ze(t);return b(m({},n),{annotations:[...t.annotations,o]})}function Al(t,e){let o=Ze(t);return b(m({},o),{annotations:t.annotations.map(n=>n.id===e.id?m(b(m({},n),{text:e.text}),e.imageCount!=null?{imageCount:e.imageCount}:{}):n)})}function Pl(t,e){return b(m({},t),{annotations:t.annotations.map(o=>o.id===e.id?b(m({},o),{fontSize:Math.max(12,Math.min(72,e.fontSize))}):o)})}function Nl(t,e){let o=Ze(t),n=t.annotations.find(i=>i.id===e.id),r=n==null?void 0:n.groupId;return b(m({},o),{annotations:t.annotations.filter(i=>i.id!==e.id&&!(r&&i.groupId===r))})}function Bl(t,e){let o=e.saveUndo?Ze(t):t,n=t.annotations.find(i=>i.id===e.id),r=n==null?void 0:n.groupId;return b(m({},o),{annotations:t.annotations.map(i=>{if(!(i.id===e.id||r&&i.groupId===r))return i;let s=e.delta.x,c=e.delta.y;return b(m({},i),{points:i.points.map(l=>({x:l.x+s,y:l.y+c}))})})})}function Dl(t,e){let o=e.saveUndo?Ze(t):t,n=t.annotations.find(a=>a.id===e.id);if(!n||n.type==="text"||n.points.length<2)return t;let r=0,i=0;if(n.type==="rectangle"&&n.groupId){let a=e.points,s=Math.min(a[0].x,a[1].x),c=Math.max(a[0].y,a[1].y),l=n.points[0],d=n.points[n.points.length-1],u=Math.min(l.x,d.x),p=Math.max(l.y,d.y);r=s-u,i=c-p}return b(m({},o),{annotations:t.annotations.map(a=>a.id===e.id?b(m({},a),{points:e.points}):n.groupId&&a.groupId===n.groupId&&a.type==="text"?b(m({},a),{points:a.points.map(s=>({x:s.x+r,y:s.y+i}))}):a)})}function Ol(t,e){let o=Ze(t);return b(m({},o),{annotations:[...t.annotations,...e.annotations.map(Is)]})}function Fl(t,e){let o=new Set,n=[];for(let r of e.annotations)o.has(r.id)||(o.add(r.id),n.push(Is(r)));return b(m({},t),{annotations:n})}function Hl(t){if(t.undoStack.length===0)return t;let e=t.undoStack[t.undoStack.length-1];return b(m({},t),{annotations:(e==null?void 0:e.annotations)||[],styleModifications:(e==null?void 0:e.styleModifications)||[],spacingTokenMods:(e==null?void 0:e.spacingTokenMods)||[],undoStack:t.undoStack.slice(0,-1),redoStack:[...t.redoStack,{annotations:t.annotations,styleModifications:t.styleModifications,spacingTokenMods:t.spacingTokenMods}]})}function zl(t){if(t.redoStack.length===0)return t;let e=t.redoStack[t.redoStack.length-1];return b(m({},t),{annotations:(e==null?void 0:e.annotations)||[],styleModifications:(e==null?void 0:e.styleModifications)||[],spacingTokenMods:(e==null?void 0:e.spacingTokenMods)||[],redoStack:t.redoStack.slice(0,-1),undoStack:[...t.undoStack,{annotations:t.annotations,styleModifications:t.styleModifications,spacingTokenMods:t.spacingTokenMods}]})}function _l(t,e){let{id:o,addToSelection:n}=e;if(o===null)return b(m({},t),{selectedAnnotationIds:[],lastSelectedId:null});if(n)if(t.selectedAnnotationIds.includes(o)){let i=t.selectedAnnotationIds.filter(a=>a!==o);return b(m({},t),{selectedAnnotationIds:i,lastSelectedId:i.length>0?i[i.length-1]:null})}else return b(m({},t),{selectedAnnotationIds:[...t.selectedAnnotationIds,o],lastSelectedId:o});return b(m({},t),{selectedAnnotationIds:[o],lastSelectedId:o})}function $l(t,e){let o=new Set;for(let n of t.selectedAnnotationIds){let r=t.annotations.find(i=>i.id===n);r!=null&&r.groupId&&o.add(r.groupId)}return b(m({},t),{annotations:t.annotations.map(n=>{let r=t.selectedAnnotationIds.includes(n.id),i=n.groupId&&o.has(n.groupId);return!r&&!i?n:b(m({},n),{color:e.color})})})}function Wl(t){return b(m({},t),{annotations:t.annotations.map(e=>b(m({},e),{captured:!0,status:e.status==="pending"||!e.status?"in_flight":e.status})),styleModifications:t.styleModifications.map(e=>b(m({},e),{captured:!0})),spacingTokenChanges:t.spacingTokenChanges.map(e=>b(m({},e),{captured:!0}))})}function Yl(t){return b(m({},t),{annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]})}function jl(t,e){return b(m({},t),{inspectedElement:e})}function Gl(t,e){let{selector:o,element:n,property:r,original:i,modified:a}=e,s=t.styleModifications.findIndex(c=>c.selector===o);if(i===a&&s<0)return t;if(s>=0){let c=t.styleModifications[s];if(c.captured){let f=Ze(t),g=f.styleModifications.map((y,S)=>S===s?b(m({},y),{changes:[{property:r,original:i,modified:a}],captured:!1}):y);return b(m({},f),{styleModifications:g})}let l=c.changes.findIndex(f=>f.property===r),d,u=t;if(l>=0){let f=c.changes[l];a===f.original?d=c.changes.filter((g,y)=>y!==l):d=c.changes.map((g,y)=>y===l?b(m({},g),{modified:a}):g)}else{if(i===a)return t;u=Ze(t),d=[...c.changes,{property:r,original:i,modified:a}]}if(d.length===0)return b(m({},u),{styleModifications:u.styleModifications.filter((f,g)=>g!==s)});let p=u.styleModifications.map((f,g)=>g===s?b(m({},f),{changes:d}):f);return b(m({},u),{styleModifications:p})}else{let c=Ze(t),l={selector:o,element:n,changes:[{property:r,original:i,modified:a}]};return b(m({},c),{styleModifications:[...c.styleModifications,l]})}}function Vl(t,e){let{selector:o,durableSelector:n,element:r,changes:i}=e,a=i.filter(l=>l.original!==l.modified);if(a.length===0)return t;let s=Ze(t),c=s.styleModifications.findIndex(l=>l.selector===o);if(c>=0){let l=s.styleModifications[c],d=l.captured?[]:[...l.changes];for(let u of a){let p=d.findIndex(f=>f.property===u.property);p>=0?u.modified===d[p].original?d=d.filter((f,g)=>g!==p):d=d.map((f,g)=>g===p?b(m({},f),{modified:u.modified}):f):d.push(u)}return d.length===0?b(m({},s),{styleModifications:s.styleModifications.filter((u,p)=>p!==c)}):b(m({},s),{styleModifications:s.styleModifications.map((u,p)=>p===c?b(m({},u),{changes:d,captured:!1}):u)})}else return b(m({},s),{styleModifications:[...s.styleModifications,{selector:o,durableSelector:n,element:r,changes:a}]})}function Xl(t,e){let{selector:o,property:n}=e,r=Ze(t),i=r.styleModifications.map(a=>a.selector!==o?a:b(m({},a),{changes:a.changes.filter(s=>s.property!==n)})).filter(a=>a.changes.length>0);return b(m({},r),{styleModifications:i})}function Jl(t){if(t.styleModifications.length===0)return b(m({},t),{inspectedElement:null});let e=Ze(t);return b(m({},e),{styleModifications:[],inspectedElement:null})}function Kl(t,e){return b(m({},t),{styleModifications:e})}function Ul(t,e){let{updates:o}=e,n=new Map(o.map(r=>[r.id,r]));return b(m({},t),{annotations:t.annotations.map(r=>{let i=n.get(r.id);return i?m(b(m({},r),{points:[i.point,...r.points.slice(1)]}),i.linkedAnchor?{linkedAnchor:i.linkedAnchor}:{}):r})})}function Zl(t,e){let o=new Set(e.ids);return b(m({},t),{annotations:t.annotations.map(n=>o.has(n.id)?b(m({},n),{status:e.status}):n)})}function ql(t,e){let o=new Set(e.ids),n=new Set;for(let r of t.annotations)o.has(r.id)&&r.groupId&&n.add(r.groupId);return b(m({},t),{annotations:t.annotations.map(r=>o.has(r.id)||r.groupId&&n.has(r.groupId)?b(m({},r),{threadId:e.threadId}):r)})}function Ql(t,e){let o=new Set(e.ids),n=new Set;for(let r of t.annotations)o.has(r.id)&&r.groupId&&n.add(r.groupId);return b(m({},t),{annotations:t.annotations.map(r=>o.has(r.id)||r.groupId&&n.has(r.groupId)?b(m({},r),{status:"waiting_input",question:e.question,threadId:e.threadId}):r)})}function tc(t,e){let o=new Map(e.resolutions.map(r=>[r.annotationId,r])),n=new Map;for(let r of t.annotations){let i=o.get(r.id);i&&r.groupId&&n.set(r.groupId,i)}return b(m({},t),{annotations:t.annotations.map(r=>{var a,s,c;let i=o.get(r.id)||(r.groupId?n.get(r.groupId):void 0);return i?b(m({},r),{status:i.status,resolutionSummary:i.summary,scope:(s=(a=i.finalScope)!=null?a:i.inferredScope)!=null?s:null,replyCount:((c=r.replyCount)!=null?c:0)+1,question:void 0,threadId:r.threadId||e.threadId}):r})})}function ec(t,e){let{groupId:o,planId:n,planTaskId:r,instruction:i,region:a,color:s,linkedSelector:c,elements:l}=e,d=i.length>60?i.slice(0,60).replace(/\s+\S*$/,"")+"\u2026":i,u={id:no(),type:"rectangle",points:[{x:a.x,y:a.y},{x:a.x+a.width,y:a.y+a.height}],color:s,strokeWidth:2,timestamp:Date.now(),groupId:o,linkedSelector:c,elements:l,planId:n,planTaskId:r,status:"pending"},p={id:no(),type:"text",points:[{x:a.x,y:a.y+a.height+4}],text:d,fontSize:12,color:s,strokeWidth:2,timestamp:Date.now(),status:"pending",groupId:o,linkedSelector:c,elements:l,planId:n,planTaskId:r};return b(m({},t),{annotations:[...t.annotations,u,p]})}function nc(t,e){let{linkedSelectors:o,styleSelectors:n}=e,r=new Set(o),i=new Set(n),a=new Set,s=new Set;for(let p of t.annotations)p.linkedSelector&&r.has(p.linkedSelector)&&(a.add(p.id),p.groupId&&s.add(p.groupId));for(let p of t.annotations)p.groupId&&s.has(p.groupId)&&a.add(p.id);let c=t.annotations.filter(p=>!a.has(p.id)),l=t.styleModifications.filter(p=>!i.has(p.selector));if(c.length===t.annotations.length&&l.length===t.styleModifications.length)return t;let d=t.selectedAnnotationIds.filter(p=>!a.has(p)),u=t.inspectedElement&&i.has(t.inspectedElement.info.selector)?null:t.inspectedElement;return b(m({},t),{annotations:c,styleModifications:l,selectedAnnotationIds:d,lastSelectedId:d.length>0?d[d.length-1]:null,inspectedElement:u})}function oc(t,e){let o=t.spacingTokenChanges.findIndex(n=>n.tokenPath===e.tokenPath);return o>=0?b(m({},t),{spacingTokenChanges:t.spacingTokenChanges.map((n,r)=>r===o?e:n)}):b(m({},t),{spacingTokenChanges:[...t.spacingTokenChanges,e]})}function rc(t,e){return b(m({},t),{spacingTokenChanges:e})}function ic(t,e){let o=Ze(t),n=t.spacingTokenMods.findIndex(i=>i.tokenPath===e.tokenPath),r;if(n>=0){let i=t.spacingTokenMods[n],a=b(m({},e),{originalValue:i.originalValue,originalPx:i.originalPx});r=t.spacingTokenMods.map((s,c)=>c===n?a:s)}else r=[...t.spacingTokenMods,e];return b(m({},o),{spacingTokenMods:r})}function sc(t,e){let o=Ze(t),n=t.spacingTokenMods.findIndex(c=>c.tokenPath===e.tokenPath),r=n>=0?t.spacingTokenMods[n].originalValue:e.originalValue,i=n>=0?t.spacingTokenMods[n].originalPx:parseFloat(e.originalValue)||0,a={tokenPath:e.tokenPath,originalValue:r,currentValue:"__deleted__",targets:n>=0?t.spacingTokenMods[n].targets:[],originalPx:i,currentPx:0},s;return n>=0?s=t.spacingTokenMods.map((c,l)=>l===n?a:c):s=[...t.spacingTokenMods,a],b(m({},o),{spacingTokenMods:s})}var ac={SET_ANNOTATING:wl,SET_TOOL:kl,SET_COLOR:Cl,SET_STROKE_WIDTH:El,START_PATH:Tl,CONTINUE_PATH:Ml,CANCEL_PATH:Il,FINISH_PATH:Ll,ADD_TEXT:Rl,UPDATE_TEXT:Al,UPDATE_TEXT_SIZE:Pl,DELETE_ANNOTATION:Nl,MOVE_ANNOTATION:Bl,RESIZE_ANNOTATION:Dl,PASTE_ANNOTATIONS:Ol,RESTORE_ANNOTATIONS:Fl,UNDO:Hl,REDO:zl,SELECT_ANNOTATION:_l,UPDATE_ANNOTATION_COLOR:$l,MARK_CAPTURED:Wl,CLEAR:Yl,SELECT_ELEMENT:jl,MODIFY_STYLE:Gl,MODIFY_STYLES_BATCH:Vl,CLEAR_STYLE:Xl,CLEAR_ALL_STYLES:Jl,RESTORE_STYLE_MODIFICATIONS:Kl,UPDATE_LINKED_POSITIONS:Ul,CLEANUP_ORPHANED:nc,SET_ANNOTATION_STATUS:Zl,SET_ANNOTATION_THREAD:ql,SET_ANNOTATION_QUESTION:Ql,APPLY_RESOLUTIONS:tc,ADD_PLAN_ANNOTATION:ec,ADD_SPACING_TOKEN_CHANGE:oc,RESTORE_SPACING_TOKEN_CHANGES:rc,MODIFY_SPACING_TOKEN:ic,DELETE_SPACING_TOKEN:sc};function lc(t,e){let o=ac[e.type];return o?o(t,e.payload):t}function Ls(){let[t,e]=vl(lc,Sl);return xl(()=>{let o=n=>{(n.metaKey||n.ctrlKey)&&n.key==="z"&&(n.preventDefault(),n.shiftKey?e({type:"REDO"}):e({type:"UNDO"}))};return window.addEventListener("keydown",o),()=>window.removeEventListener("keydown",o)},[]),[t,e]}function Wn(t){let e=Object.keys(t).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!e)return null;let o=t[e],n=[];for(;o;){let r=o.type,i=(r==null?void 0:r.displayName)||(r==null?void 0:r.name);i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&n.unshift(i),o=o.return}return n.length>0?{name:n[n.length-1],path:n}:null}function Sr(t){let e=Object.keys(t).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!e)return[];let o=t[e],n=[];for(;o;){let r=o.type,i=typeof r=="function"||typeof r=="object"?(r==null?void 0:r.displayName)||(r==null?void 0:r.name):null;i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&n.push({name:i,fiber:o}),o=o.return}return n.reverse(),n}function Go(t){let e=t,o=new Set;for(;e&&!o.has(e);){if(o.add(e),e.stateNode instanceof Element)return e.stateNode;e.child?e=e.child:e=null}return null}function Rs(t){if(t.id)return`#${t.id}`;let e=t.tagName.toLowerCase(),o=Array.from(t.classList).slice(0,3).join(".");return o?`${e}.${o}`:e}function an(t){if(t.id&&!t.id.startsWith("radix-")&&!t.id.startsWith(":"))return`#${CSS.escape(t.id)}`;let e=[],o=t;for(;o&&o!==document.documentElement;){let n=o.tagName.toLowerCase();if(o.id&&!o.id.startsWith("radix-")&&!o.id.startsWith(":")){e.unshift(`#${CSS.escape(o.id)}`);break}let r=Array.from(o.classList).filter(a=>!a.startsWith("_")&&a.length<30).slice(0,2);r.length>0&&(n+="."+r.map(a=>CSS.escape(a)).join("."));let i=o.parentElement;if(i){let a=Array.from(i.children).filter(s=>s.tagName===o.tagName);if(a.length>1){let s=a.indexOf(o)+1;n+=`:nth-of-type(${s})`}}e.unshift(n),o=i}return e.join(" > ")}function Xe(t){try{return document.querySelector(t)}catch(e){return null}}function Vo(t,e=0){var c;let o=Sr(t);if(o.length===0)return null;let n=o.map(l=>l.name),r=o.length-1,i=Math.max(0,Math.min(o.length-1,r-e)),a=o[i],s=(c=Go(a.fiber))!=null?c:t;return{name:a.name,path:n,depthIndex:i,rootElement:s}}function As(t,e){var i,a;let o=Sr(t),n=e.toLowerCase(),r=-1;for(let s=o.length-1;s>=0;s--){let c=o[s].name;if(c===e){let l=(i=Go(o[s].fiber))!=null?i:t;return{name:e,path:o.map(d=>d.name),depthIndex:s,rootElement:l}}if(r===-1){let l=c.toLowerCase();(l.length>=4&&n.includes(l)||n.length>=4&&l.includes(n))&&(r=s)}}if(r>=0){let s=(a=Go(o[r].fiber))!=null?a:t;return{name:e,path:o.map(c=>c.name),depthIndex:r,rootElement:s}}return null}function oo(t){let e=ro(),o=[],n=new Set,r=e.currentNode;for(;r=e.nextNode();){let i=As(r,t);i&&!n.has(i.rootElement)&&(n.add(i.rootElement),o.push(i))}return o}function wr(t){let e=new Map;if(t.size===0)return e;let o=new Set(t),n=ro(),r=new Set,i=n.currentNode;for(;(i=n.nextNode())&&o.size>0;)for(let a of o){let s=As(i,a);if(!s||r.has(s.rootElement))continue;r.add(s.rootElement);let c=s.rootElement.getBoundingClientRect();e.set(a,c.top+window.scrollY),o.delete(a);break}for(let a of o)e.set(a,1/0);return e}function ro(){return document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT,{acceptNode(t){return t.closest("#devtools-toolbar, #devtools-canvas, #devtools-scrim, [data-popmelt-panel]")?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}})}function Je(t){let e={selector:Rs(t),tagName:t.tagName.toLowerCase()};t.id&&(e.id=t.id),t.classList.length>0&&(e.className=Array.from(t.classList).join(" "));let o=Co(t);o&&o.length>0&&o.length<200&&(e.textContent=o);let n={};for(let a of t.attributes)a.name.startsWith("data-")&&(n[a.name]=a.value);Object.keys(n).length>0&&(e.dataAttributes=n);let r=Wn(t);r&&(e.reactComponent=r.name);let i=cc(t);return i&&(e.context=i),e}function Co(t){let e="";for(let o of t.childNodes)o.nodeType===Node.TEXT_NODE&&(e+=o.textContent||"");return e.trim()}function Dn(t,e){let o=document.elementsFromPoint(t,e);for(let n of o)if(n instanceof HTMLElement&&!(n.id==="devtools-canvas"||n.id==="devtools-toolbar"||n.id==="devtools-scrim")&&!n.closest("#devtools-toolbar")&&!(n.dataset.devtools||n.closest("[data-devtools]"))&&!["html","body"].includes(n.tagName.toLowerCase()))return n;return null}function cc(t){let e=t.parentElement,o=["section","article","nav","aside","header","footer","main"];for(;e&&e!==document.body;){let n=e.tagName.toLowerCase();if(o.includes(n)&&e.id)return`${n}#${e.id}`;if(e.id&&!e.id.startsWith("radix-")&&!e.id.startsWith(":"))return`${n}#${e.id}`;e=e.parentElement}return null}function Ps(t){let e=new Set,o=[],n=window.scrollX,r=window.scrollY,i=[{x:(t.minX+t.maxX)/2,y:(t.minY+t.maxY)/2},{x:t.minX,y:t.minY},{x:t.maxX,y:t.minY},{x:t.minX,y:t.maxY},{x:t.maxX,y:t.maxY}];for(let a of i){let s=a.x-n,c=a.y-r;if(s<0||c<0||s>window.innerWidth||c>window.innerHeight)continue;let l=Dn(s,c);l&&!e.has(l)&&(e.add(l),o.push(Je(l)))}return o.slice(0,3)}function kr(t){if(t.length===0)return[];let e=t.map(n=>n.x),o=t.map(n=>n.y);return Ps({minX:Math.min(...e),minY:Math.min(...o),maxX:Math.max(...e),maxY:Math.max(...o)})}function Cr(t){let e=t.x+t.width/2,o=t.y+t.height/2,n=e-window.scrollX,r=o-window.scrollY,i=Dn(n,r);if(!i||!(i instanceof HTMLElement))return null;if(!i.hasAttribute("data-pm")){let d=Math.random().toString(36).substring(2,9);i.setAttribute("data-pm",d)}let s=`[data-pm="${i.getAttribute("data-pm")}"]`,c=Je(i),l=i.getBoundingClientRect();return{selector:s,info:c,rect:l}}function Le(t,e){return t.style.getPropertyValue(e)!==""}function dc(t,e=30){if(t<=0)return[];let o=[],n=ro(),r=.5,i=n.currentNode;for(;(i=n.nextNode())&&o.length<e;){let a=i,s=a.getBoundingClientRect();if(s.bottom<-50||s.top>window.innerHeight+50||s.right<-50||s.left>window.innerWidth+50||s.width<1||s.height<1)continue;let c=getComputedStyle(a);!Le(a,"padding-top")&&Math.abs((parseFloat(c.paddingTop)||0)-t)<r&&o.push({element:a,property:"padding-top"}),!Le(a,"padding-bottom")&&Math.abs((parseFloat(c.paddingBottom)||0)-t)<r&&o.length<e&&o.push({element:a,property:"padding-bottom"}),!Le(a,"padding-left")&&Math.abs((parseFloat(c.paddingLeft)||0)-t)<r&&o.length<e&&o.push({element:a,property:"padding-left"}),!Le(a,"padding-right")&&Math.abs((parseFloat(c.paddingRight)||0)-t)<r&&o.length<e&&o.push({element:a,property:"padding-right"}),!Le(a,"margin-top")&&Math.abs((parseFloat(c.marginTop)||0)-t)<r&&o.length<e&&o.push({element:a,property:"margin-top"}),!Le(a,"margin-bottom")&&Math.abs((parseFloat(c.marginBottom)||0)-t)<r&&o.length<e&&o.push({element:a,property:"margin-bottom"}),!Le(a,"margin-left")&&Math.abs((parseFloat(c.marginLeft)||0)-t)<r&&o.length<e&&o.push({element:a,property:"margin-left"}),!Le(a,"margin-right")&&Math.abs((parseFloat(c.marginRight)||0)-t)<r&&o.length<e&&o.push({element:a,property:"margin-right"});let l=c.display;if((l.includes("flex")||l.includes("grid"))&&o.length<e){let d=Le(a,"gap"),u=parseFloat(c.gap)||0,p=parseFloat(c.rowGap)||0,f=parseFloat(c.columnGap)||0;!d&&Math.abs(u-t)<r?o.push({element:a,property:"gap"}):!Le(a,"row-gap")&&Math.abs(p-t)<r?o.push({element:a,property:"row-gap"}):!Le(a,"column-gap")&&Math.abs(f-t)<r&&o.push({element:a,property:"column-gap"})}}return o}function Er(t,e=30){if(t<=0)return[];let o=[],n=ro(),r=.5,i=n.currentNode;for(;(i=n.nextNode())&&o.length<e;){let a=i,s=a.getBoundingClientRect();if(s.bottom<-50||s.top>window.innerHeight+50||s.right<-50||s.left>window.innerWidth+50||s.width<1||s.height<1)continue;let c=getComputedStyle(a),l=parseFloat(c.borderTopWidth)||0,d=parseFloat(c.borderRightWidth)||0,u=parseFloat(c.borderBottomWidth)||0,p=parseFloat(c.borderLeftWidth)||0,f=a.clientWidth,g=a.clientHeight,y=parseFloat(c.paddingTop)||0;!Le(a,"padding-top")&&Math.abs(y-t)<r&&o.push({x:s.left+p,y:s.top+l,width:f,height:t,direction:"vertical",property:"padding-top"});let S=parseFloat(c.paddingBottom)||0;!Le(a,"padding-bottom")&&Math.abs(S-t)<r&&o.length<e&&o.push({x:s.left+p,y:s.top+l+g-t,width:f,height:t,direction:"vertical",property:"padding-bottom"});let x=parseFloat(c.paddingLeft)||0;!Le(a,"padding-left")&&Math.abs(x-t)<r&&o.length<e&&o.push({x:s.left+p,y:s.top+l,width:t,height:g,direction:"horizontal",property:"padding-left"});let L=parseFloat(c.paddingRight)||0;!Le(a,"padding-right")&&Math.abs(L-t)<r&&o.length<e&&o.push({x:s.left+p+f-t,y:s.top+l,width:t,height:g,direction:"horizontal",property:"padding-right"});let N=parseFloat(c.marginTop)||0;!Le(a,"margin-top")&&Math.abs(N-t)<r&&o.length<e&&o.push({x:s.left,y:s.top-t,width:s.width,height:t,direction:"vertical",property:"margin-top"});let R=parseFloat(c.marginBottom)||0;!Le(a,"margin-bottom")&&Math.abs(R-t)<r&&o.length<e&&o.push({x:s.left,y:s.bottom,width:s.width,height:t,direction:"vertical",property:"margin-bottom"});let M=parseFloat(c.marginLeft)||0;!Le(a,"margin-left")&&Math.abs(M-t)<r&&o.length<e&&o.push({x:s.left-t,y:s.top,width:t,height:s.height,direction:"horizontal",property:"margin-left"});let C=parseFloat(c.marginRight)||0;!Le(a,"margin-right")&&Math.abs(C-t)<r&&o.length<e&&o.push({x:s.right,y:s.top,width:t,height:s.height,direction:"horizontal",property:"margin-right"});let nt=c.display;if((nt.includes("flex")||nt.includes("grid"))&&o.length<e&&!Le(a,"gap")){let G=Array.from(a.children).filter(U=>{let O=getComputedStyle(U);return O.display!=="none"&&O.position!=="absolute"&&O.position!=="fixed"});if(G.length>=2)for(let U=0;U<G.length-1&&o.length<e;U++){let O=G[U].getBoundingClientRect(),tt=G[U+1].getBoundingClientRect(),et=tt.top-O.bottom;Math.abs(et-t)<r&&et>.5&&o.push({x:Math.min(O.left,tt.left),y:O.bottom,width:Math.max(O.right,tt.right)-Math.min(O.left,tt.left),height:et,direction:"vertical",property:"gap"});let vt=tt.left-O.right;Math.abs(vt-t)<r&&vt>.5&&o.push({x:O.right,y:Math.min(O.top,tt.top),width:vt,height:Math.max(O.bottom,tt.bottom)-Math.min(O.top,tt.top),direction:"horizontal",property:"gap"})}}}return o}function Xo(t){return typeof t=="string"?{value:t}:t}var Bs={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 Ns(t,e){let o=Bs[e];return o?o.includes(t):!1}function uc(t,e){let o=t.split(/\s+/);for(let n of o){if(n===e)return!0;let r=n.lastIndexOf(":");if(r>=0&&n.slice(r+1)===e)return!0}return!1}function pc(t){var s,c;let e=t.lastIndexOf(":"),o=e>=0?t.slice(e+1):t,n=o.indexOf("-");if(n<0)return null;let r=o.slice(0,n),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"},a=o.slice(0,o.indexOf("-",n+1)>0?o.indexOf("-",n+1):n);return(c=(s=i[a])!=null?s:i[r])!=null?c:null}function Tr(t,e=30){let o=parseFloat(t.value);if(isNaN(o)||o<=0)return[];if(t.bindings&&t.bindings.length>0){let r=[],i=ro(),a=i.currentNode;for(;(a=i.nextNode())&&r.length<e;){let s=a,c=s.getBoundingClientRect();if(c.bottom<-50||c.top>window.innerHeight+50||c.right<-50||c.left>window.innerWidth+50||c.width<1||c.height<1)continue;let l=s.className;if(typeof l=="string")for(let d of t.bindings){if(!uc(l,d))continue;let u=pc(d);if(u&&!(t.property&&!Ns(u,t.property))){r.push({element:s,property:u});break}}}return r}let n=dc(o,e*2);return t.property?n.filter(r=>Ns(r.property,t.property)).slice(0,e):n.slice(0,e)}function Mr(t,e=30){let o=Tr(t,e),n=[];for(let r of o){let i=r.element,a=i.getBoundingClientRect(),s=getComputedStyle(i),c=parseFloat(s.borderTopWidth)||0,l=parseFloat(s.borderRightWidth)||0,d=parseFloat(s.borderLeftWidth)||0,u=i.clientWidth,p=i.clientHeight;switch(r.property){case"padding-top":{let f=parseFloat(s.paddingTop)||0;n.push({x:a.left+d,y:a.top+c,width:u,height:f,direction:"vertical",property:r.property});break}case"padding-bottom":{let f=parseFloat(s.paddingBottom)||0;n.push({x:a.left+d,y:a.top+c+p-f,width:u,height:f,direction:"vertical",property:r.property});break}case"padding-left":{let f=parseFloat(s.paddingLeft)||0;n.push({x:a.left+d,y:a.top+c,width:f,height:p,direction:"horizontal",property:r.property});break}case"padding-right":{let f=parseFloat(s.paddingRight)||0;n.push({x:a.left+d+u-f,y:a.top+c,width:f,height:p,direction:"horizontal",property:r.property});break}case"margin-top":{let f=parseFloat(s.marginTop)||0;n.push({x:a.left,y:a.top-f,width:a.width,height:f,direction:"vertical",property:r.property});break}case"margin-bottom":{let f=parseFloat(s.marginBottom)||0;n.push({x:a.left,y:a.bottom,width:a.width,height:f,direction:"vertical",property:r.property});break}case"margin-left":{let f=parseFloat(s.marginLeft)||0;n.push({x:a.left-f,y:a.top,width:f,height:a.height,direction:"horizontal",property:r.property});break}case"margin-right":{let f=parseFloat(s.marginRight)||0;n.push({x:a.right,y:a.top,width:f,height:a.height,direction:"horizontal",property:r.property});break}case"gap":case"row-gap":case"column-gap":{let f=Array.from(i.children).filter(g=>{let y=getComputedStyle(g);return y.display!=="none"&&y.position!=="absolute"&&y.position!=="fixed"});for(let g=0;g<f.length-1&&n.length<e;g++){let y=f[g].getBoundingClientRect(),S=f[g+1].getBoundingClientRect(),x=S.top-y.bottom;x>.5&&n.push({x:Math.min(y.left,S.left),y:y.bottom,width:Math.max(y.right,S.right)-Math.min(y.left,S.left),height:x,direction:"vertical",property:"gap"});let L=S.left-y.right;L>.5&&n.push({x:y.right,y:Math.min(y.top,S.top),width:L,height:Math.max(y.bottom,S.bottom)-Math.min(y.top,S.top),direction:"horizontal",property:"gap"})}break}}}return n}function Ds(t,e){let o=new Set,n=Eo(e);for(let r of t){let i=Fs[r.property];if(!i)continue;let a=r.element.className;if(typeof a=="string")for(let s of i){let c=`${s}-${n}`;for(let l of a.split(/\s+/)){let d=l.lastIndexOf(":"),u=d>=0?l.slice(d+1):l;if(u===c){o.add(u);break}}}}return[...o]}function Os(t){let e=new Set;for(let o of t)for(let[n,r]of Object.entries(Bs))if(r.includes(o.property)){e.add(n);break}if(e.size===1)return[...e][0]}function Ir(t,e,o){if(e===o)return t;let n=Eo(e),r=Eo(o);return t.map(i=>{let a=i.lastIndexOf("-");if(a<0)return i;let s=i.slice(0,a),c=i.slice(a+1);return c===n||c===`[${e}px]`?`${s}-${r}`: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 Eo(t){var e;return(e=fc[t])!=null?e:`[${t}px]`}var Fs={"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 gc(t,e,o,n){let r=Fs[e];if(!r)return null;let i=Eo(o);for(let a of r){let s=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+a+"-(?:"+mc(i)+"|\\["+o+"px\\]))(?:\\s|$)"),c=t.match(s);if(c!=null&&c[1]){let l=Eo(n),d=c[1].lastIndexOf(":"),u=d>=0?c[1].slice(0,d+1):"";return{matched:c[1],suggested:`${u}${a}-${l}`}}}return null}function mc(t){return t.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function Hs(t,e,o){let n=new Set,r=[];for(let i of t){let a=an(i.element),s=`${a}::${i.property}`;if(n.has(s))continue;n.add(s);let c=Wn(i.element),l=i.element.className||"",d=gc(l,i.property,e,o);r.push({selector:a,reactComponent:c==null?void 0:c.name,className:l,property:i.property,matchedClass:d==null?void 0:d.matched,suggestedClass:d==null?void 0:d.suggested})}return r}function To(t,e){return window.getComputedStyle(t).getPropertyValue(e)}function Lr(t,e){if(t instanceof HTMLElement){let n=t.style.getPropertyValue(e);if(n)return n}let o=hc(t,e);return o&&o.includes("var(")?o:To(t,e)}function hc(t,e){let o=e.replace(/-([a-z])/g,(n,r)=>r.toUpperCase());try{for(let n of document.styleSheets)try{let r=n.cssRules||n.rules;for(let i of r)if(i instanceof CSSStyleRule&&t.matches(i.selectorText)){let a=i.style.getPropertyValue(e);if(a&&a.includes("var("))return a;let s=i.style[o];if(s&&s.includes("var("))return s}}catch(r){}}catch(n){}return null}function Jo(t,e){if(t instanceof HTMLElement){let n=t.style.getPropertyValue(e);if(n)return n}let o=e.replace(/-([a-z])/g,(n,r)=>r.toUpperCase());try{for(let n of document.styleSheets)try{let r=n.cssRules||n.rules;for(let i of r)if(i instanceof CSSStyleRule&&t.matches(i.selectorText)){let a=i.style.getPropertyValue(e);if(a)return a;let s=i.style[o];if(s)return s}}catch(r){}}catch(n){}return null}function Ko(t){let e=window.getComputedStyle(t).display;return e==="flex"||e==="inline-flex"||e==="grid"||e==="inline-grid"}function Mo(t){let e=window.getComputedStyle(t);return{row:parseFloat(e.rowGap)||0,column:parseFloat(e.columnGap)||0}}function yc(t){let e=[];for(let o of t){let n=e.find(r=>r.axis!==o.axis?!1:o.axis==="row"?Math.abs(r.y-o.y)<2&&Math.abs(r.h-o.h)<2:Math.abs(r.x-o.x)<2&&Math.abs(r.w-o.w)<2);if(n)if(o.axis==="row"){let r=Math.min(n.x,o.x),i=Math.max(n.x+n.w,o.x+o.w);n.x=r,n.w=i-r}else{let r=Math.min(n.y,o.y),i=Math.max(n.y+n.h,o.y+o.h);n.y=r,n.h=i-r}else e.push(m({},o))}return e}function Yn(t){let e=Array.from(t.children).filter(c=>{if(!(c instanceof HTMLElement))return!1;let l=window.getComputedStyle(c);return l.display!=="none"&&l.position!=="absolute"&&l.position!=="fixed"});if(e.length<2)return[];let o=[],n=t.getBoundingClientRect(),i=window.getComputedStyle(t).flexDirection,a=i==="column"||i==="column-reverse",s=6;for(let c=0;c<e.length-1;c++){let l=e[c].getBoundingClientRect(),d=e[c+1].getBoundingClientRect();if(d.left>l.right+.5&&o.push({axis:"column",x:l.right,y:n.top,w:d.left-l.right,h:n.height}),d.top>l.bottom+.5&&o.push({axis:"row",x:n.left,y:l.bottom,w:n.width,h:d.top-l.bottom}),!(d.left>l.right+.5)&&!(d.top>l.bottom+.5))if(a){let u=(l.bottom+d.top)/2;o.push({axis:"row",x:n.left,y:u-s/2,w:n.width,h:s})}else{let u=(l.right+d.left)/2;o.push({axis:"column",x:u-s/2,y:n.top,w:s,h:n.height})}}return yc(o)}function Rr(t,e){let o=window.getComputedStyle(t),n=o.display;if(n!=="flex"&&n!=="inline-flex")return!1;let r=o.justifyContent;if(r!=="space-between"&&r!=="space-around"&&r!=="space-evenly"&&r!=="stretch")return!1;let i=o.flexDirection;return!(e!==(i==="column"||i==="column-reverse"?"row":"column")||parseFloat(e==="row"?o.rowGap:o.columnGap)>0)}function io(t){let e=window.getComputedStyle(t);return{top:parseFloat(e.paddingTop)||0,right:parseFloat(e.paddingRight)||0,bottom:parseFloat(e.paddingBottom)||0,left:parseFloat(e.paddingLeft)||0}}function jn(t){let e=window.getComputedStyle(t);return{"top-left":parseFloat(e.borderTopLeftRadius)||0,"top-right":parseFloat(e.borderTopRightRadius)||0,"bottom-right":parseFloat(e.borderBottomRightRadius)||0,"bottom-left":parseFloat(e.borderBottomLeftRadius)||0}}function Ar(t){for(let e of t.childNodes)if(e.nodeType===Node.TEXT_NODE&&(e.textContent||"").trim().length>0)return!0;return!1}function so(t){var d,u;let e=document.createRange(),o=!1;for(let p of t.childNodes)p.nodeType===Node.TEXT_NODE&&(p.textContent||"").trim().length>0&&(o||(e.setStart(p,0),o=!0),e.setEnd(p,(u=(d=p.textContent)==null?void 0:d.length)!=null?u:0));if(!o)return null;let n=e.getBoundingClientRect(),r=window.getComputedStyle(t),i=parseFloat(r.fontSize)||16,a=parseFloat(r.lineHeight);isNaN(a)&&(a=i*1.2);let s=Math.max(1,e.getClientRects().length),c=Math.max(n.height,s*a),l=(c-n.height)/2;return new DOMRect(n.x,n.y-l,n.width,c)}function Io(t){let e=window.getComputedStyle(t),o=parseFloat(e.fontSize)||16,n=parseFloat(e.lineHeight);return isNaN(n)&&(n=o*1.2),{fontSize:o,lineHeight:n}}function Yt(t,e,o){t instanceof HTMLElement&&t.style.setProperty(e,o,"important")}function Pr(t,e,o){t instanceof HTMLElement&&t.style.removeProperty(e)}function Uo(t){var e;for(let o of t){let n=Xe(o.selector);if(!n&&o.durableSelector&&(n=Xe(o.durableSelector),n)){let r=(e=o.selector.match(/\[data-pm="([^"]+)"\]/))==null?void 0:e[1];r&&n.setAttribute("data-pm",r)}if(n)for(let r of o.changes)Yt(n,r.property,r.modified)}}function Nr(t,e){let o=Xe(t);if(!o)return;let n=e.find(r=>r.selector===t);if(n)for(let r of n.changes)Pr(o,r.property,r.original)}function Zo(t){for(let e of t){let o=Xe(e.selector);if(o)for(let n of e.changes)Pr(o,n.property,n.original)}}function _s(t,e,o,n){if(t)for(let r of t){if(r instanceof CSSGroupingRule){_s(r.cssRules,e,o,n);continue}if(r instanceof CSSStyleRule){let i=r.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&bc(r.style,e,o,n)}}}function bc(t,e,o,n){for(let r=0;r<t.length;r++){let i=t[r];if(i!=null&&i.startsWith("--")){if(o.has(i))continue;o.add(i);let a=e.getPropertyValue(i).trim();$s(a)&&n.push({name:i,value:a,usage:`var(${i})`})}}}var qo=null,xc=5e3;function Br(){if(qo&&Date.now()-qo.timestamp<xc)return qo.variables;let t=[],e=new Set,o=getComputedStyle(document.documentElement);try{for(let i of document.styleSheets)try{_s(i.cssRules||i.rules,o,e,t)}catch(a){}}catch(i){}let n=document.documentElement.style;for(let i=0;i<n.length;i++){let a=n[i];if(a!=null&&a.startsWith("--")&&!e.has(a)){e.add(a);let s=o.getPropertyValue(a).trim();$s(s)&&t.push({name:a,value:s,usage:`var(${a})`})}}let r=t.sort((i,a)=>i.name.localeCompare(a.name));return qo={variables:r,timestamp:Date.now()},r}function $s(t){if(!t)return!1;let e=t.toLowerCase().trim();return!!(/^#([0-9a-f]{3}|[0-9a-f]{4}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(e)||e.startsWith("rgb")||e.startsWith("hsl")||e.startsWith("oklch")||e.startsWith("oklab")||e.startsWith("lch")||e.startsWith("lab")||["transparent","currentcolor","inherit","white","black","red","green","blue","yellow","orange","purple","pink","gray","grey"].includes(e))}function Lo(t,e){let o=e.match(/var\((--[^,)]+)(?:,\s*([^)]+))?\)/);if(o){let n=o[1],r=o[2];return getComputedStyle(document.documentElement).getPropertyValue(n).trim()||r||e}return e}function Ro(t,e){if(!t)return null;let o=zs(t);if(!o)return null;for(let n of e){let r=zs(n.value);if(r&&o===r)return n}return null}function zs(t){if(!t)return null;let e=t.trim().toLowerCase();if(e.startsWith("oklch(")){let o=e.match(/oklch\(\s*([\d.]+%?)\s+([\d.]+%?)\s+([\d.]+)/);if(o){let n=o[1].endsWith("%")?parseFloat(o[1])/100:parseFloat(o[1]),r=o[2].endsWith("%")?parseFloat(o[2])/100:parseFloat(o[2]),i=parseFloat(o[3]);n=Math.round(n*100)/100,r=Math.round(r*1e3)/1e3;let a=Math.round(i);return`oklch(${n} ${r} ${a})`}}if(e.startsWith("rgb")){let o=e.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(o)return`rgb(${o[1]},${o[2]},${o[3]})`}return e.startsWith("#")?e.length===4?`#${e[1]}${e[1]}${e[2]}${e[2]}${e[3]}${e[3]}`:e.slice(0,7):e}var vc=new Set(["button","a","input","select","textarea"]),Sc=new Set(["button","link"]),wc=new Set(["h1","h2","h3","h4","h5","h6","nav","main","header","footer","section","article","aside"]),kc=["fontSize","fontWeight","fontFamily","lineHeight","letterSpacing","color","backgroundColor","padding","gap","borderRadius","boxShadow"];var Dr=150;function Cc(t){let e=0,o=t.parentElement;for(;o&&o!==document.body;)e++,o=o.parentElement;return e}function Ec(t){return!(t.startsWith("_")||t.startsWith("css-")||t.length>30)}function Tc(t){let e=Array.from(t.classList).filter(Ec).slice(0,3);return e.length>0?e.join(" "):void 0}function Mc(t,e){let o=window.getComputedStyle(t),n=e?window.getComputedStyle(e):null,r={};for(let i of kc){let a=o.getPropertyValue(i.replace(/[A-Z]/g,s=>`-${s.toLowerCase()}`));if(a&&!(i==="backgroundColor"&&(a==="rgba(0, 0, 0, 0)"||a==="transparent"))&&!(i==="boxShadow"&&a==="none")){if(i==="boxShadow"&&(a="yes"),i==="fontFamily"&&(a=a.split(",")[0].trim().replace(/['"]/g,"")),n){let s=n.getPropertyValue(i.replace(/[A-Z]/g,c=>`-${c.toLowerCase()}`));if(a===s)continue}r[i]=a}}return Object.keys(r).length>0?r:void 0}function Ic(t){if(!(t instanceof HTMLElement))return!1;let e=window.getComputedStyle(t);if(e.display==="none"||e.visibility==="hidden")return!1;if(t.offsetParent===null){let o=t.tagName.toLowerCase();if(o==="body"||o==="html")return!0;let n=e.position;return n==="fixed"||n==="sticky"}return!0}function Lc(t){return!!(t instanceof HTMLElement&&t.dataset.devtools||t.closest("[data-devtools]")||t.id==="devtools-canvas"||t.id==="devtools-toolbar"||t.id==="devtools-scrim")}function Rc(t){let e=t.tagName.toLowerCase(),o=Co(t);if(o&&o.length>0||vc.has(e))return!0;let n=t.getAttribute("role");return!!(n&&Sc.has(n)||wc.has(e)||(e==="img"||e==="svg")&&(t.getAttribute("alt")||t.getAttribute("aria-label")))}function Ws(){var l,d,u,p,f;let t=[],e=document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT),o=e.nextNode();for(;o;){let g=o;if(o=e.nextNode(),Lc(g)||!Ic(g))continue;let y=g.getBoundingClientRect();if(y.width<1||y.height<1||!Rc(g))continue;let S=g.tagName.toLowerCase(),x=Co(g),L=Cc(g),N=g.getAttribute("role")||void 0,R=S==="a"&&g.getAttribute("href")||void 0,M=S==="img"&&g.getAttribute("alt")||void 0,C=(l=Wn(g))==null?void 0:l.name,nt=Tc(g),j=Mc(g,g.parentElement),G={tag:S,rect:{x:Math.round(y.left+window.scrollX),y:Math.round(y.top+window.scrollY),w:Math.round(y.width),h:Math.round(y.height)},depth:L};x&&(G.text=x.length>80?x.slice(0,80)+"...":x),C&&(G.component=C),nt&&(G.classes=nt),j&&(G.styles=j),N&&(G.role=N),R&&(G.href=R),M&&(G.alt=M),t.push({el:g,entry:G})}t.sort((g,y)=>y.entry.depth-g.entry.depth);let n=new Set;for(let g=0;g<t.length;g++){let y=t[g];if(n.has(y.el))continue;let S=y.el.parentElement;if(!S||!t.find(R=>R.el===S))continue;let L=(d=y.el.textContent)==null?void 0:d.trim(),N=(u=S.textContent)==null?void 0:u.trim();L&&N&&L===N&&n.add(y.el)}let r=t.filter(g=>!n.has(g.el)),i=new Map;for(let g of r){let y=g.el.parentElement,S=[y?Array.from(y.classList).join("."):"",g.entry.tag,(p=g.entry.component)!=null?p:"",g.entry.styles?JSON.stringify(g.entry.styles):""].join("|"),x=(f=i.get(S))!=null?f:[];x.push(g),i.set(S,x)}let a=[],s=new Set;for(let[,g]of i)if(g.length>3){a.push(g[0].entry,g[1].entry),s.add(g[0].el),s.add(g[1].el);let y=1/0,S=1/0,x=-1/0,L=-1/0;for(let N=2;N<g.length;N++){let R=g[N].entry.rect;y=Math.min(y,R.x),S=Math.min(S,R.y),x=Math.max(x,R.x+R.w),L=Math.max(L,R.y+R.h)}a.push({tag:g[0].entry.tag,text:`(+${g.length-2} similar items)`,rect:{x:Math.round(y),y:Math.round(S),w:Math.round(x-y),h:Math.round(L-S)},depth:g[0].entry.depth});for(let N of g)s.add(N.el)}for(let g of r)s.has(g.el)||a.push(g.entry);let c=Math.max(document.documentElement.scrollHeight,1);if(a.sort((g,y)=>{let S=g.rect.w*g.rect.h,x=y.rect.w*y.rect.h,L=S*(1+.5*(1-g.rect.y/c));return x*(1+.5*(1-y.rect.y/c))-L}),a.length>Dr){let g=a.slice(0,Dr);return g.push({tag:"truncated",text:`${a.length-Dr} additional elements omitted`,rect:{x:0,y:0,w:0,h:0},depth:0}),g}return a}import{domToCanvas as Ac}from"modern-screenshot";function Fr(t){let e=document.createElement("canvas").getContext("2d");return e?(e.fillStyle=t,e.fillStyle):"#888888"}function Qo(t,e=[],o,n){let r=new Map,i=[];for(let s of t)if(s.groupId){let c=r.get(s.groupId)||[];c.push(s),r.set(s.groupId,c)}else i.push(s);let a=[];for(let[s,c]of r){let l=c.find(u=>u.type!=="text"),d=c.find(u=>u.type==="text");if(l){let u=l.linkedSelector||(d==null?void 0:d.linkedSelector),p=(d==null?void 0:d.imageCount)||l.imageCount;a.push(m(b(m({id:l.id,type:l.type,instruction:d==null?void 0:d.text},u?{linkedSelector:u}:{}),{elements:l.elements||[]}),p?{imageCount:p}:{}))}}for(let s of i)a.push(m(b(m({id:s.id,type:s.type,instruction:s.type==="text"?s.text:void 0},s.linkedSelector?{linkedSelector:s.linkedSelector}:{}),{elements:s.elements||[]}),s.imageCount?{imageCount:s.imageCount}:{}));return m(m({timestamp:new Date().toISOString(),url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},scrollPosition:{x:window.scrollX,y:window.scrollY},annotations:a,styleModifications:e},o?{inspectedElement:o}:{}),n&&n.length>0?{spacingTokenChanges:n}:{})}function Ys(t){if(!t.points||t.points.length===0)return null;let e=t.points.map(n=>n.x),o=t.points.map(n=>n.y);return{minX:Math.min(...e),minY:Math.min(...o),maxX:Math.max(...e),maxY:Math.max(...o)}}function Pc(t,e){if(t.length===0)return[];let o=t.map(d=>({annotation:d,bounds:Ys(d)})).filter(d=>d.bounds!==null);if(o.length===0)return[];o.sort((d,u)=>d.bounds.minY-u.bounds.minY);let n=Math.min(...o.map(d=>d.bounds.minY)),r=Math.max(...o.map(d=>d.bounds.maxY));if(r-n<=e){let d=(n+r)/2,u=Math.max(0,d-e/2);return[{top:u,bottom:u+e,annotations:t}]}let i=[],a=50,s=Math.max(0,n-a),c=[],l=s;for(let{annotation:d,bounds:u}of o){let p=u.maxY+a;if(p-s<=e)c.push(d),l=Math.max(l,p);else{if(c.length>0){let f=(s+l)/2,g=Math.max(0,f-e/2);i.push({top:g,bottom:g+e,annotations:c})}s=Math.max(0,u.minY-a),c=[d],l=u.maxY+a}}if(c.length>0){let d=(s+l)/2,u=Math.max(0,d-e/2);i.push({top:u,bottom:u+e,annotations:c})}return i}function Nc(t,e,o,n){t.save(),t.scale(n,n);for(let r of e){let i=r.points.map(a=>({x:a.x,y:a.y-o}));switch(t.strokeStyle=r.color,t.fillStyle=r.color,t.lineWidth=r.strokeWidth,t.lineCap="round",t.lineJoin="round",r.type){case"freehand":if(i.length<2)break;t.beginPath(),t.moveTo(i[0].x,i[0].y);for(let a=1;a<i.length;a++)t.lineTo(i[a].x,i[a].y);t.stroke();break;case"line":if(i.length<2)break;t.beginPath(),t.moveTo(i[0].x,i[0].y),t.lineTo(i[i.length-1].x,i[i.length-1].y),t.stroke();break;case"rectangle":{if(i.length<2)break;let a=i[0],s=i[i.length-1],c=Math.min(a.x,s.x),l=Math.min(a.y,s.y),d=Math.abs(s.x-a.x),u=Math.abs(s.y-a.y);t.strokeRect(c,l,d,u);break}case"circle":{if(i.length<2)break;let a=i[0],s=i[i.length-1],c=(a.x+s.x)/2,l=(a.y+s.y)/2,d=Math.abs(s.x-a.x)/2,u=Math.abs(s.y-a.y)/2;t.beginPath(),t.ellipse(c,l,d,u,0,0,Math.PI*2),t.stroke();break}case"text":{if(!r.text||i.length<1)break;let a=i[0],s=r.fontSize||16;t.font=`${s}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`,t.fillStyle=r.color;let l=(r.imageCount&&r.imageCount>0?`[${r.imageCount} image${r.imageCount>1?"s":""}] ${r.text}`:r.text).split(`
3
- `),d=s*1.2,u=4,p=0;for(let f of l)p=Math.max(p,t.measureText(f).width);t.fillRect(a.x-u,a.y-u,p+u*2,l.length*d+u*2),t.fillStyle="#ffffff",l.forEach((f,g)=>{t.fillText(f,a.x,a.y+s+g*d)});break}}}t.restore()}async function Hr(t,e,o=[]){try{let n=window.devicePixelRatio||1,r=window.innerWidth,i=window.innerHeight,a=o.filter(l=>{var d;return((d=l.status)!=null?d:"pending")==="pending"});console.log("[Screenshot] Starting capture with",a.length,"active annotations (filtered",o.length-a.length,"captured)");let s=Pc(a,i);if(s.length===0){let l=await Or(t,[],window.scrollY,r,i,n);return l?[l]:[]}let c=[];for(let l=0;l<s.length;l++){let d=s[l],u=await Or(t,d.annotations,d.top,r,i,n);u?c.push(u):console.warn(`[Screenshot] Region ${l+1} failed to capture`)}return console.log("[Screenshot] Capture complete"),c}catch(n){return console.error("[Screenshot] Capture failed:",n),[]}}async function Or(t,e,o,n,r,i){try{let a=await Ac(t,{filter:l=>!(l instanceof HTMLElement&&(l.id==="devtools-canvas"||l.id==="devtools-toolbar"||l.id==="devtools-scrim"||l.dataset.devtools||l.closest("[data-devtools]"))),scale:i,backgroundColor:"#ffffff",width:n,height:r,style:{transform:`translate(${-window.scrollX}px, ${-o}px)`}}),s=document.createElement("canvas");s.width=n*i,s.height=r*i;let c=s.getContext("2d");return c?(c.drawImage(a,0,0,n*i,r*i,0,0,n*i,r*i),Nc(c,e,o,i),new Promise(l=>{s.toBlob(d=>l(d),"image/png")})):null}catch(a){return console.error("Region capture failed:",a),null}}async function tr(t){if(t.length===0)return null;if(t.length===1)return t[0];let e=await Promise.all(t.map(s=>new Promise((c,l)=>{let d=new Image;d.onload=()=>c(d),d.onerror=l,d.src=URL.createObjectURL(s)}))),o=e[0].width,n=e.reduce((s,c)=>s+c.height,0),r=document.createElement("canvas");r.width=o,r.height=n;let i=r.getContext("2d");if(!i)return null;let a=0;for(let s of e)i.drawImage(s,0,a),a+=s.height,URL.revokeObjectURL(s.src);return new Promise(s=>{r.toBlob(c=>s(c),"image/png")})}async function er(t,e=[]){let n=window.innerWidth,r=window.innerHeight,i=Math.max(document.body.scrollHeight,document.documentElement.scrollHeight),a=window.scrollX,s=window.scrollY,c=[];try{let l=Math.ceil(i/r);for(let d=0;d<l;d++){let u=d*r;window.scrollTo(a,u),await new Promise(S=>requestAnimationFrame(()=>requestAnimationFrame(()=>S())));let p=u,f=u+r,g=e.filter(S=>{let x=Ys(S);return x?x.maxY>=p&&x.minY<=f:!1}),y=await Or(t,g,u,n,Math.min(r,i-u),1);y&&c.push(y)}}finally{window.scrollTo(a,s)}return tr(c)}async function js(t,e,o){try{let n=Array.isArray(t)?t:[t];if(n.length===0)return!1;let r=await tr(n);if(!r)return!1;let i={"image/png":r},a=e&&e.length>0,s=o&&o.length>0;if(a||s){let c=e?e.filter(l=>{var d;return((d=l.status)!=null?d:"pending")==="pending"}):[];if(c.length>0||s){let l=Qo(c,o||[]),d=new Blob([JSON.stringify(l,null,2)],{type:"text/plain"});i["text/plain"]=d}}return await navigator.clipboard.write([new ClipboardItem(i)]),!0}catch(n){return console.warn("Clipboard write failed:",n),!1}}import{useCallback as Oe,useEffect as je,useMemo as xi,useRef as Ce,useState as le}from"react";import{useCallback as ao,useRef as Bc}from"react";function zr(t,e,o,n){if(e.length<2)return;let r=e[0],i=e[e.length-1];if(!r||!i)return;let a=(r.x+i.x)/2,s=(r.y+i.y)/2,c=Math.abs(i.x-r.x)/2,l=Math.abs(i.y-r.y)/2;t.beginPath(),t.strokeStyle=o,t.lineWidth=n,t.ellipse(a,s,c,l,0,0,Math.PI*2),t.stroke()}function _r(t,e,o,n){if(e.length<2)return;let r=e[0],i=e[e.length-1];if(!(!r||!i)){t.beginPath(),t.strokeStyle=o,t.lineWidth=n,t.lineCap="round",t.lineJoin="round",t.moveTo(r.x,r.y);for(let a=1;a<e.length-1;a++){let s=e[a],c=e[a+1];if(!s||!c)continue;let l=(s.x+c.x)/2,d=(s.y+c.y)/2;t.quadraticCurveTo(s.x,s.y,l,d)}t.lineTo(i.x,i.y),t.stroke()}}function $r(t,e,o,n){if(e.length<2)return;let r=e[0],i=e[e.length-1];!r||!i||(t.beginPath(),t.strokeStyle=o,t.lineWidth=n,t.lineCap="round",t.moveTo(r.x,r.y),t.lineTo(i.x,i.y),t.stroke())}function Wr(t,e,o,n){if(e.length<2)return;let r=e[0],i=e[e.length-1];if(!r||!i)return;let a=Math.min(r.x,i.x),s=Math.min(r.y,i.y),c=Math.abs(i.x-r.x),l=Math.abs(i.y-r.y);t.beginPath(),t.strokeStyle=o,t.lineWidth=n,t.lineCap="round",t.lineJoin="round",t.strokeRect(a,s,c,l)}var ve='"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';function Gs(t,e,o,n,r=12,i){if(!o)return;let a=r*1.4,s=o.split(`
4
- `),c=i!==void 0?[i+". "+(s[0]||""),...s.slice(1)]:s;t.font=`${r}px ${ve}`,t.textBaseline="middle";let l=c.map(f=>t.measureText(f).width),d=Math.min(400,Math.max(...l)),u=c.length*a,p=c.map((f,g)=>{if(l[g]<=400)return f;let y=0,S=f.length;for(;y<S;){let x=y+S+1>>1;t.measureText(f.slice(0,x)+"\u2026").width<=400?y=x:S=x-1}return f.slice(0,y)+"\u2026"});t.fillStyle=n,t.fillRect(e.x-4,e.y-4,d+8,u+8),t.fillStyle="#ffffff",p.forEach((f,g)=>{t.fillText(f,e.x,e.y+g*a+a/2)})}var Vs=11,Yr=4,Dc=`600 ${Vs}px system-ui, -apple-system, sans-serif`;function jr(t,e,o){return t.map(n=>({x:n.x-e,y:n.y-o}))}function Oc(t,e,o,n,r,i){let a=String(n);t.font=Dc;let c=t.measureText(a).width+Yr*2,l=Vs+Yr*2,d=e-c/2,u=o+i/2+2;t.fillStyle=r,t.fillRect(d,u,c,l),t.fillStyle="#ffffff",t.textBaseline="middle",t.fillText(a,d+Yr,u+l/2)}function Fc(t,e){if(t.points.length<2&&t.type!=="text")return null;switch(t.type){case"rectangle":case"freehand":{let o,n;if(t.type==="freehand")o=Math.min(...t.points.map(r=>r.x)),n=Math.max(...t.points.map(r=>r.y));else{let r=t.points[0],i=t.points[t.points.length-1];o=Math.min(r.x,i.x),n=Math.max(r.y,i.y)}return{x:o,y:n}}case"circle":{let o=t.points[0],n=t.points[t.points.length-1],r=Math.min(o.x,n.x),i=(Math.min(o.y,n.y)+Math.max(o.y,n.y))/2;return{x:r,y:i}}case"line":{let o=t.points[0],n=t.points[t.points.length-1],r=o.y>n.y?o:n;return{x:r.x,y:r.y}}default:return null}}function Xs(){let t=Bc(null),e=ao(()=>{let s=t.current;if(!s)return;let c=s.getContext("2d");c&&c.clearRect(0,0,s.width,s.height)},[]),o=ao((s,c)=>{var f;let l=t.current;if(!l)return;let d=l.getContext("2d");if(!d)return;let p=((f=s.status)!=null?f:s.captured?"in_flight":"pending")==="pending"?s.color:"#999999";switch(s.type){case"freehand":_r(d,s.points,p,s.strokeWidth);break;case"line":$r(d,s.points,p,s.strokeWidth);break;case"rectangle":Wr(d,s.points,p,s.strokeWidth);break;case"circle":zr(d,s.points,p,s.strokeWidth);break;case"text":s.text&&s.points[0]&&Gs(d,s.points[0],s.text,p,s.fontSize,c);break}},[]),n=ao((s,c,l,d)=>{let u=t.current;if(!u||s.length<2)return;let p=u.getContext("2d");if(p)switch(c){case"freehand":_r(p,s,l,d);break;case"line":$r(p,s,l,d);break;case"rectangle":Wr(p,s,l,d);break;case"circle":zr(p,s,l,d);break}},[]),r=ao((s,c)=>{let l=t.current;if(!l||s.points.length<2)return;let d=l.getContext("2d");if(d){if(d.fillStyle="#ffffff",d.strokeStyle=s.color,d.lineWidth=1.5,s.type==="line"){let u=s.points[0],p=s.points[s.points.length-1];[u,p].forEach(f=>{d.beginPath(),d.arc(f.x,f.y,c/2,0,Math.PI*2),d.fill(),d.stroke()});return}if(s.type==="circle"){let u=s.points[0],p=s.points[s.points.length-1],f=Math.min(u.x,p.x),g=Math.max(u.x,p.x),y=Math.min(u.y,p.y),S=Math.max(u.y,p.y),x=(f+g)/2,L=(y+S)/2;[{x,y},{x,y:S},{x:f,y:L},{x:g,y:L}].forEach(R=>{d.beginPath(),d.rect(R.x-c/2,R.y-c/2,c,c),d.fill(),d.stroke()});return}if(s.type==="rectangle"||s.type==="freehand"){let u,p,f,g;if(s.type==="freehand")u=Math.min(...s.points.map(S=>S.x)),p=Math.max(...s.points.map(S=>S.x)),f=Math.min(...s.points.map(S=>S.y)),g=Math.max(...s.points.map(S=>S.y));else{let S=s.points[0],x=s.points[s.points.length-1];u=Math.min(S.x,x.x),p=Math.max(S.x,x.x),f=Math.min(S.y,x.y),g=Math.max(S.y,x.y)}[{x:u,y:f},{x:p,y:f},{x:u,y:g},{x:p,y:g}].forEach(S=>{d.beginPath(),d.rect(S.x-c/2,S.y-c/2,c,c),d.fill(),d.stroke()})}}},[]),i=ao((s,c,l,d,u,p,f,g=0,y=0,S)=>{var x;if(e(),s.forEach(L=>{let N=b(m({},L),{points:jr(L.points,g,y)}),R=S==null?void 0:S.get(L.id);o(N,R)}),c.length>0){let L=jr(c,g,y);n(L,l,d,u)}if(p&&p.length>0&&f){let L=t.current,N=L==null?void 0:L.getContext("2d");for(let R of p){let M=s.find(C=>C.id===R);if(M){let C=b(m({},M),{points:jr(M.points,g,y)});if(r(C,f),N&&M.type!=="text"&&S&&!(M.groupId&&s.some(j=>j.groupId===M.groupId&&j.type==="text"))){let j=S.get(M.id);if(j!==void 0){let G=Fc(C,f);if(G){let O=((x=M.status)!=null?x:M.captured?"in_flight":"pending")==="pending"?M.color:"#999999";Oc(N,G.x,G.y,j,O,f)}}}}}}},[e,o,n,r]),a=ao(()=>{let s=t.current;if(!s)return;let c=window.devicePixelRatio||1;s.width=window.innerWidth*c,s.height=window.innerHeight*c;let l=s.getContext("2d");l&&l.scale(c,c)},[]);return{canvasRef:t,clearCanvas:e,drawAnnotation:o,drawCurrentPath:n,redrawAll:i,resizeCanvas:a}}import{useEffect as Hc,useRef as zc}from"react";function Js(){let t=zc({shift:!1,cmd:!1});return Hc(()=>{let e=r=>{r.key==="Shift"&&(t.current.shift=!0),(r.key==="Meta"||r.key==="Control")&&(t.current.cmd=!0)},o=r=>{r.key==="Shift"&&(t.current.shift=!1),(r.key==="Meta"||r.key==="Control")&&(t.current.cmd=!1)},n=()=>{t.current={shift:!1,cmd:!1}};return window.addEventListener("keydown",e,!0),window.addEventListener("keyup",o,!0),window.addEventListener("blur",n),()=>{window.removeEventListener("keydown",e,!0),window.removeEventListener("keyup",o,!0),window.removeEventListener("blur",n)}},[]),t}import{useEffect as _c}from"react";function Ks(t,e,o,n,r){_c(()=>{let i=a=>{if(t){if(t.linkedSelector)return;a.preventDefault(),a.stopPropagation();let c=a.deltaY>0?-2:2;e(l=>l?b(m({},l),{fontSize:Math.max(12,Math.min(72,l.fontSize+c))}):null);return}if(!o)return;a.preventDefault();let s=n.find(c=>c.id===o);if(s&&s.type==="text"&&!s.linkedSelector){let c=s.fontSize||12,l=a.deltaY>0?-2:2;r({type:"UPDATE_TEXT_SIZE",payload:{id:o,fontSize:c+l}})}};return window.addEventListener("wheel",i,{passive:!1}),()=>{window.removeEventListener("wheel",i)}},[o,t,n,r,e])}import{useCallback as Us,useEffect as Ao,useRef as Zs,useState as Gn}from"react";import{Fragment as bn,jsx as It,jsxs as Be}from"react/jsx-runtime";var lo=22,xn=12,qs=3,Qs=250,Gr=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],ta=3e3,Vr=["planning","strategizing","scheming","mapping","scoping","drafting","outlining","architecting"];function Jr(i){var a=i,{left:t,top:e,style:o,children:n}=a,r=Bn(a,["left","top","style","children"]);return It("div",b(m({"data-devtools":"badge-hit-area"},r),{style:m({position:"fixed",left:`max(0px, ${t}px)`,top:`max(0px, ${e}px)`,padding:xn,transform:`translate(min(0px, calc(100vw - max(0px, ${t}px) - 100%)), min(0px, calc(100vh - max(0px, ${e}px) - 100%)))`},o),children:n}))}function ea({annotations:t,supersededAnnotations:e,inFlightIds:o,scrollX:n,scrollY:r,annotationGroupMap:i,onViewThread:a,onSelectAnnotation:s}){var y,S;let[c,l]=Gn(0),[d,u]=Gn(()=>Math.floor(Math.random()*Gr.length)),p=!!(o&&o.size>0);Ao(()=>{if(!p)return;let x=setInterval(()=>{l(N=>(N+1)%qs)},Qs),L=setInterval(()=>{u(N=>(N+1)%Gr.length)},ta);return()=>{clearInterval(x),clearInterval(L)}},[p]);let f=[];for(let x of t){if(x.type!=="text"||!x.text||!x.points[0]||e.has(x))continue;let L=x.groupId?t.filter(V=>V.groupId===x.groupId):[x],N=!!(o&&(o.has(x.id)||L.some(V=>o.has(V.id)))),R=(y=x.status)!=null?y:"pending",M=L.some(V=>V.status==="resolved"||V.status==="needs_review"),C=L.some(V=>V.threadId);if(!N&&R!=="resolved"&&R!=="needs_review"&&!M&&!C)continue;let nt=x.threadId||((S=L.find(V=>V.threadId))==null?void 0:S.threadId),j=R==="needs_review"||L.some(V=>V.status==="needs_review"),G=L.reduce((V,St)=>{var Pt;return V+((Pt=St.replyCount)!=null?Pt:0)},0)||1,U=x.points[0],O=x.fontSize||12,tt=O*1.4,et=x.text.split(`
5
- `),vt=i.get(x.id),dt=vt!==void 0?[vt+". "+(et[0]||""),...et.slice(1)]:et,Dt=document.createElement("canvas").getContext("2d");if(!Dt)continue;Dt.font=`${O}px ${ve}`;let Ot=Math.min(400,Math.max(...dt.map(V=>Dt.measureText(V).width))),At=dt.length*tt;f.push({id:x.id,threadId:nt,x:U.x+Ot+4,y:U.y-4,size:At+8,color:x.color,isInFlight:N,isNeedsReview:j,replyCount:G})}if(f.length===0)return null;let g=!!a;return It(bn,{children:f.map(x=>It(Jr,{left:x.x-n-xn,top:x.y-r-xn,onClick:g&&x.threadId?()=>{s==null||s(x.id),a(x.threadId)}:void 0,style:{pointerEvents:g?"auto":"none",cursor:g&&x.threadId?"pointer":void 0,zIndex:9999},children:It("div",{"data-devtools":"annotation-badge",style:{height:x.size,display:"flex",alignItems:"center",backgroundColor:x.color,fontFamily:ve,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:x.isInFlight?Be(bn,{children:[It("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?Be(bn,{children:[It("circle",{cx:"7",cy:"7",r:"2"}),It("circle",{cx:"17",cy:"7",r:"2"}),It("circle",{cx:"7",cy:"17",r:"2"}),It("circle",{cx:"17",cy:"17",r:"2"})]}):Be(bn,{children:[It("circle",{cx:"12",cy:"6",r:"2"}),It("circle",{cx:"6",cy:"12",r:"2"}),It("circle",{cx:"18",cy:"12",r:"2"}),It("circle",{cx:"12",cy:"18",r:"2"})]})}),It("span",{style:{opacity:.7},children:Gr[d]})]}):Be(bn,{children:[x.isNeedsReview?It("span",{style:{fontWeight:700},children:"?"}):Be("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[It("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),It("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),It("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),It("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),Be("span",{style:{opacity:.7},children:[x.replyCount," ",x.replyCount===1?"reply":"replies"]})]})})},x.id))})}function na({annotations:t,supersededAnnotations:e,scrollX:o,scrollY:n,annotationGroupMap:r,planThreadId:i,taskCount:a,planStatus:s,onViewThread:c,onSelectAnnotation:l}){var p;let d=[];for(let f of t){if(f.type!=="text"||!f.text||!f.points[0]||e.has(f))continue;let g=(p=f.status)!=null?p:"pending",y=f.groupId?t.filter(et=>et.groupId===f.groupId):[f],S=y.some(et=>et.threadId===i),x=!S&&!f.planId&&(g==="in_flight"||g==="pending"||f.captured)&&!y.some(et=>et.status==="resolved"||et.status==="needs_review");if(!S&&!x||g==="resolved"||g==="needs_review")continue;let L=f.points[0],N=f.fontSize||12,R=N*1.4,M=f.text.split(`
6
- `),C=r.get(f.id),nt=C!==void 0?[C+". "+(M[0]||""),...M.slice(1)]:M,G=document.createElement("canvas").getContext("2d");if(!G)continue;G.font=`${N}px ${ve}`;let U=Math.min(400,Math.max(...nt.map(et=>G.measureText(et).width))),tt=nt.length*R+8;d.push({annotation:f,x:L.x+U+4,y:L.y-4,size:tt,groupNumber:C})}if(d.length===0)return null;let u=s==="planning";return It(bn,{children:d.map(({annotation:f,x:g,y,size:S})=>u?It($c,{x:g-o,y:y-n,size:S,color:f.color,onClick:()=>{l==null||l(f.id),c(i)}},`plan-thinking-${f.id}`):It(Jr,{left:g-o-xn,top:y-n-xn,onClick:()=>{l==null||l(f.id),c(i)},style:{cursor:"pointer",zIndex:9999,pointerEvents:"auto"},children:Be("div",{"data-devtools":"plan-waiting-badge",style:{height:S,display:"flex",alignItems:"center",backgroundColor:f.color,fontFamily:ve,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:[Be("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[It("circle",{cx:"12",cy:"12",r:"10"}),It("path",{d:"M9.09 9a3 3 0 015.83 1c0 2-3 3-3 3"}),It("line",{x1:"12",y1:"17",x2:"12.01",y2:"17"})]}),Be("span",{style:{opacity:.7},children:[a," task",a!==1?"s":""," \u2014 approve?"]})]})},`plan-waiting-${f.id}`))})}function $c({x:t,y:e,size:o,color:n,onClick:r}){let[i,a]=Gn(0),[s,c]=Gn(()=>Math.floor(Math.random()*Vr.length));return Ao(()=>{let l=setInterval(()=>{a(u=>(u+1)%qs)},Qs),d=setInterval(()=>{c(u=>(u+1)%Vr.length)},ta);return()=>{clearInterval(l),clearInterval(d)}},[]),It(Jr,{left:t-xn,top:e-xn,onClick:r,style:{pointerEvents:r?"auto":"none",cursor:r?"pointer":void 0,zIndex:9999},children:Be("div",{"data-devtools":"plan-thinking-badge",style:{height:o,display:"flex",alignItems:"center",backgroundColor:n,fontFamily:ve,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:[It("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:i===1?Be(bn,{children:[It("circle",{cx:"7",cy:"7",r:"2"}),It("circle",{cx:"17",cy:"7",r:"2"}),It("circle",{cx:"7",cy:"17",r:"2"}),It("circle",{cx:"17",cy:"17",r:"2"})]}):Be(bn,{children:[It("circle",{cx:"12",cy:"6",r:"2"}),It("circle",{cx:"6",cy:"12",r:"2"}),It("circle",{cx:"18",cy:"12",r:"2"}),It("circle",{cx:"12",cy:"18",r:"2"})]})}),It("span",{style:{opacity:.7},children:Vr[s]})]})})}function Kr({inFlightSelectorColors:t,animated:e=!0}){let[o,n]=Gn([]);if(Ao(()=>{if(t.size===0){n([]);return}let i=null,a=()=>{let l=[];for(let[d,u]of t){let p=Xe(d);if(!p)continue;let f=p.getBoundingClientRect();l.push({selector:d,top:f.top,left:f.left,width:f.width,height:f.height,color:u})}n(l)},s=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(a)};a(),window.addEventListener("scroll",s,!0),window.addEventListener("resize",s,!0);let c=new MutationObserver(s);return c.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",s,!0),window.removeEventListener("resize",s,!0),c.disconnect(),i&&cancelAnimationFrame(i)}},[t]),o.length===0)return null;let r={position:"absolute",width:2,height:2,pointerEvents:"none"};return Be(bn,{children:[e&&It("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),o.map(i=>Be("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:[It("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible"},children:It("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:e?{animation:"popmelt-march 0.5s steps(2) infinite"}:void 0})}),It("div",{style:b(m({},r),{top:-1,left:-1,backgroundColor:i.color})}),It("div",{style:b(m({},r),{top:-1,right:-1,backgroundColor:i.color})}),It("div",{style:b(m({},r),{bottom:-1,left:-1,backgroundColor:i.color})}),It("div",{style:b(m({},r),{bottom:-1,right:-1,backgroundColor:i.color})})]},i.selector))]})}function oa({annotations:t,supersededAnnotations:e,scrollX:o,scrollY:n,onReply:r,annotationGroupMap:i}){let a=t.filter(l=>e.has(l)?!1:l.status==="waiting_input"&&l.question&&l.threadId);if(a.length===0)return null;let s=new Set,c=[];for(let l of a){if(!l.threadId||s.has(l.threadId))continue;s.add(l.threadId);let d=l.type==="text"?l:t.find(u=>u.groupId&&u.groupId===l.groupId&&u.type==="text")||l;if(d.type==="text"&&d.text&&d.points[0]){let u=d.points[0],p=d.fontSize||12,f=p*1.4,g=d.text.split(`
7
- `),y=i.get(d.id),S=y!==void 0?[y+". "+(g[0]||""),...g.slice(1)]:g,L=document.createElement("canvas").getContext("2d");if(!L)continue;L.font=`${p}px ${ve}`;let N=Math.min(400,Math.max(...S.map(C=>L.measureText(C).width))),M=S.length*f+8;c.push({annotation:l,x:u.x+N+4,y:u.y-4,size:M})}}return c.length===0?null:It(bn,{children:c.map(({annotation:l,x:d,y:u,size:p})=>It(Wc,{annotation:l,x:d-o,y:u-n,size:p,onReply:r},`question-${l.threadId}`))})}function Wc({annotation:t,x:e,y:o,size:n,onReply:r}){let[i,a]=Gn(!1),[s,c]=Gn(""),l=Zs(null),d=Zs(null);Ao(()=>{i&&l.current&&l.current.focus()},[i]),Ao(()=>{if(!i)return;let y=x=>{d.current&&!d.current.contains(x.target)&&a(!1)},S=x=>{x.key==="Escape"&&a(!1)};return document.addEventListener("mousedown",y),document.addEventListener("keydown",S),()=>{document.removeEventListener("mousedown",y),document.removeEventListener("keydown",S)}},[i]);let u=Us(()=>{!s.trim()||!t.threadId||(r(t.threadId,s.trim()),c(""),a(!1))},[s,t.threadId,r]),p=Us(y=>{y.key==="Enter"&&(y.metaKey||y.ctrlKey)&&(y.preventDefault(),u())},[u]),f=i?e:e-xn,g=i?o:o-xn;return Be("div",{ref:d,"data-devtools":"question-badge",style:{position:"fixed",left:`max(0px, ${f}px)`,top:`max(0px, ${g}px)`,padding:i?0:xn,transform:`translate(min(0px, calc(100vw - max(0px, ${f}px) - 100%)), min(0px, calc(100vh - max(0px, ${g}px) - 100%)))`,zIndex:i?10002:9999,pointerEvents:"auto",cursor:i?void 0:"pointer"},children:[!i&&Be("div",{onClick:()=>a(!0),style:{height:n,display:"flex",alignItems:"center",backgroundColor:t.color,padding:`0 ${4}px`,gap:4,fontFamily:ve,fontSize:12,color:"#ffffff",whiteSpace:"nowrap"},children:[Be("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[It("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),It("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),It("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),It("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),It("span",{style:{opacity:.7},children:"reply?"})]}),i&&Be("div",{style:{minWidth:260,maxWidth:360,backgroundColor:"#ffffff",fontFamily:ve,fontSize:12,color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)"},children:[It("div",{style:{padding:`${6}px ${8}px`,lineHeight:1.4},children:t.question}),Be("div",{style:{padding:`0 ${4}px ${4}px`},children:[It("textarea",{ref:l,value:s,onChange:y=>c(y.target.value),onKeyDown:p,placeholder:"Type your reply...",style:{width:"100%",minHeight:40,padding:4,fontSize:12,fontFamily:ve,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"}}),It("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:4},children:It("button",{onClick:u,disabled:!s.trim(),style:{padding:"4px 12px",fontSize:11,fontFamily:ve,fontWeight:600,backgroundColor:s.trim()?t.color:"rgba(0,0,0,0.1)",color:s.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:s.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}function nr(t){var i;let e=new Set,o=new Map;for(let a of t){if(!a.linkedSelector)continue;let s=o.get(a.linkedSelector)||[];s.push(a),o.set(a.linkedSelector,s)}let n=new Set,r=new Set;for(let a of o.values()){if(a.length<=1){(i=a[0])!=null&&i.groupId&&r.add(a[0].groupId);continue}a.sort((c,l)=>l.timestamp-c.timestamp);let s=a[0];s.groupId&&r.add(s.groupId);for(let c=1;c<a.length;c++){let l=a[c];e.add(l),l.groupId&&n.add(l.groupId)}}for(let a of t)a.groupId&&n.has(a.groupId)&&!r.has(a.groupId)&&e.add(a);return e}import{useEffect as ra,useLayoutEffect as Yc,useState as ia}from"react";import{jsx as Ur,jsxs as aa}from"react/jsx-runtime";function jc(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${e})`:`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}var sa=["top-left","top-right","bottom-right","bottom-left"];function la({element:t,radius:e,accentColor:o,hoveredCorner:n,draggingCorner:r,cursorViewport:i}){let[a,s]=ia(null),[c,l]=ia(!1);if(ra(()=>{let x=R=>{(R.key==="Meta"||R.key==="Control")&&l(!0)},L=R=>{(R.key==="Meta"||R.key==="Control")&&l(!1)},N=()=>l(!1);return window.addEventListener("keydown",x,!0),window.addEventListener("keyup",L,!0),window.addEventListener("blur",N),()=>{window.removeEventListener("keydown",x,!0),window.removeEventListener("keyup",L,!0),window.removeEventListener("blur",N)}},[]),ra(()=>{if(!t){s(null);return}let x=()=>{s(t.getBoundingClientRect())};return x(),window.addEventListener("scroll",x,{passive:!0}),window.addEventListener("resize",x,{passive:!0}),()=>{window.removeEventListener("scroll",x),window.removeEventListener("resize",x)}},[t]),Yc(()=>{t&&s(t.getBoundingClientRect())},[t,e["top-left"],e["top-right"],e["bottom-right"],e["bottom-left"]]),!a)return null;let d=a.width,u=a.height,p=jc(o,.2),f={"top-left":{x:0,y:e["top-left"]},"top-right":{x:d,y:e["top-right"]},"bottom-right":{x:d,y:u-e["bottom-right"]},"bottom-left":{x:0,y:u-e["bottom-left"]}},g=new Set,y=r!=null?r:n;if(y)if(c)g.add(y);else for(let x of sa)g.add(x);let S={position:"fixed",top:a.top,left:a.left,width:d,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"};return aa("div",{"data-devtools":"border-radius-handles",style:S,children:[aa("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${u}`,children:[Ur("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"}),sa.map(x=>{let L=f[x],N=g.has(x);return Ur("circle",{cx:L.x,cy:L.y,r:x===(r!=null?r:n)?3:2.5,fill:o,stroke:"#ffffff",strokeWidth:x===(r!=null?r:n)?4:2,paintOrder:"stroke"},x)})]}),i&&y&&(()=>{let x=Math.round(e[y]);return Ur("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:x})})()]})}import{useEffect as Gc,useState as Vc}from"react";function Vn(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);if(o)return`oklch(${o[1]} / ${e})`;let n=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t);if(n){let r=parseInt(n[1],16),i=parseInt(n[2],16),a=parseInt(n[3],16);return`rgba(${r}, ${i}, ${a}, ${e})`}return`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}import{Fragment as Xc,jsx as Xn,jsxs as Po}from"react/jsx-runtime";function co({element:t,isSelected:e=!1,elementInfo:o,color:n="#3b82f6",annotationNumber:r,changeCount:i,hideTooltip:a=!1}){let[s,c]=Vc(null);if(Gc(()=>{if(!t){c(null);return}let C=()=>{let nt=t.getBoundingClientRect();c(nt)};return C(),window.addEventListener("scroll",C,{passive:!0}),window.addEventListener("resize",C,{passive:!0}),()=>{window.removeEventListener("scroll",C),window.removeEventListener("resize",C)}},[t]),!s||!t)return null;let l={position:"fixed",top:s.top,left:s.left,width:s.width,height:s.height,pointerEvents:"none",zIndex:9996,backgroundColor:e?Vn(n,.1):Vn(n,.05),overflow:"visible"},d={position:"absolute",width:2,height:2,backgroundColor:n,pointerEvents:"none"},u=t.tagName.toLowerCase(),p=t.id?`#${t.id}`:"",f=t.classList.length>0?"."+Array.from(t.classList).slice(0,2).join("."):"",g=o==null?void 0:o.reactComponent,y=g?`<${g}> ${u}${p}${f}`:`${u}${p}${f}`,S=22,x=s.height>=window.innerHeight,L=x?0:s.top>=S?s.top-S:s.bottom,N=x?{position:"absolute",top:8,left:8,zIndex:9997,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,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400}:{position:"fixed",top:L,left:s.left,zIndex:9997,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,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400},M=!a&&Po("div",{"data-devtools":"tooltip",style:N,children:[r!==void 0&&Po("span",{children:[r,"."]}),Xn("span",{style:{overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0},children:y}),i!==void 0&&i>0&&Po("span",{style:{opacity:.8},children:["(",i," ",i===1?"change":"changes",")"]})]});return Po(Xc,{children:[Po("div",{"data-devtools":"highlight",style:l,children:[Xn("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:Xn("rect",m({x:"0.5",y:"0.5",width:Math.max(0,s.width-1),height:Math.max(0,s.height-1),fill:"none",stroke:n,strokeWidth:"1"},!e&&{strokeDasharray:"2 4"}))}),Xn("div",{style:b(m({},d),{top:-1,left:-1})}),Xn("div",{style:b(m({},d),{top:-1,right:-1})}),Xn("div",{style:b(m({},d),{bottom:-1,left:-1})}),Xn("div",{style:b(m({},d),{bottom:-1,right:-1})}),x&&M]}),!x&&M]})}import{useEffect as ca,useLayoutEffect as Jc,useState as Zr}from"react";import{jsx as Mn,jsxs as Qr}from"react/jsx-runtime";function qr(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${e})`:`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}function ti({element:t,gap:e,accentColor:o,hoveredAxis:n,draggingAxis:r,cursorViewport:i,isAutoGap:a=!1,refreshKey:s=0}){let[c,l]=Zr(null),[d,u]=Zr([]),[p,f]=Zr(!1);if(ca(()=>{let j=O=>{(O.key==="Meta"||O.key==="Control")&&f(!0)},G=O=>{(O.key==="Meta"||O.key==="Control")&&f(!1)},U=()=>f(!1);return window.addEventListener("keydown",j,!0),window.addEventListener("keyup",G,!0),window.addEventListener("blur",U),()=>{window.removeEventListener("keydown",j,!0),window.removeEventListener("keyup",G,!0),window.removeEventListener("blur",U)}},[]),ca(()=>{if(!t){l(null),u([]);return}let j=()=>{l(t.getBoundingClientRect()),u(Yn(t))};return j(),window.addEventListener("scroll",j,{passive:!0}),window.addEventListener("resize",j,{passive:!0}),()=>{window.removeEventListener("scroll",j),window.removeEventListener("resize",j)}},[t]),Jc(()=>{t&&(l(t.getBoundingClientRect()),u(Yn(t)))},[t,e.row,e.column,s]),!c||d.length===0)return null;let g=c.width,y=c.height,S="pm-gap-stripe-pattern",x=qr(o,.25),L=qr(o,.1),N=qr(o,.2),R=8,M=2,C={position:"fixed",top:c.top,left:c.left,width:g,height:y,pointerEvents:"none",zIndex:9996,overflow:"visible"},nt=r!=null?r:n;return Qr("div",{"data-devtools":"gap-handles",style:C,children:[Qr("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${g} ${y}`,children:[Mn("defs",{children:Mn("pattern",{id:S,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Mn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:x,strokeWidth:"1.5"})})}),Mn("rect",{x:"0.5",y:"0.5",width:Math.max(0,g-1),height:Math.max(0,y-1),fill:"none",stroke:N,strokeWidth:"1"}),d.map((j,G)=>{let U=j.x-c.left,O=j.y-c.top,tt=j.w,et=j.h,vt=p?j.axis===nt:!0;return(j.axis==="row"?e.row:e.column)===0?null:Qr("g",{opacity:vt?1:.6,children:[Mn("rect",{x:U,y:O,width:tt,height:et,fill:L}),Mn("rect",{x:U,y:O,width:tt,height:et,fill:`url(#${S})`})]},G)}),nt&&(()=>{let j=d.filter(St=>St.axis===nt);if(j.length===0)return null;let G=j[0];if(i&&j.length>1){let St=1/0;for(let Pt of j){let Kt=Pt.x+Pt.w/2,ee=Pt.y+Pt.h/2,lt=Math.abs(i.x-Kt)+Math.abs(i.y-ee);lt<St&&(St=lt,G=Pt)}}let U=G.x-c.left,O=G.y-c.top,tt=G.w,et=G.h,vt=U+tt/2,dt=O+et/2;if(a)return Mn("circle",{cx:vt,cy:dt,r:1.5,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let bt=nt==="column",Dt=bt?M:R,Ot=bt?R:M,At=vt-Dt/2,V=dt-Ot/2;return Mn("rect",{x:At,y:V,width:Dt,height:Ot,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),i&&nt&&(()=>{let j=a?"auto":String(Math.round(nt==="row"?e.row:e.column));return Mn("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:j})})()]})}import{useCallback as Qc,useEffect as td,useState as ed}from"react";import{useEffect as Kc,useState as da}from"react";var Uc=3,Zc=250,ei=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],qc=3e3;function or(t){let[e,o]=da(0),[n,r]=da(()=>Math.floor(Math.random()*ei.length));return Kc(()=>{if(!t)return;let i=setInterval(()=>o(s=>(s+1)%Uc),Zc),a=setInterval(()=>r(s=>(s+1)%ei.length),qc);return()=>{clearInterval(i),clearInterval(a)}},[t]),{charIndex:e,word:ei[n]}}import{Fragment as ni,jsx as ln,jsxs as uo}from"react/jsx-runtime";function nd(t){let{element:e}=t,o=e.tagName,n=e.id?`#${e.id}`:"",r=e.className?"."+e.className.split(" ").slice(0,2).join("."):"",i=e.reactComponent;return i?`<${i}> ${o}${n}${r}`:`${o}${n}${r}`}var ua=22,oi=12;function od(i){var a=i,{left:t,top:e,style:o,children:n}=a,r=Bn(a,["left","top","style","children"]);return ln("div",b(m({"data-devtools":"badge-hit-area"},r),{style:m({position:"fixed",left:`max(0px, ${t}px)`,top:`max(0px, ${e}px)`,padding:oi,transform:`translate(min(0px, calc(100vw - max(0px, ${t}px) - 100%)), min(0px, calc(100vh - max(0px, ${e}px) - 100%)))`},o),children:n}))}function pa({styleModifications:t,isInspecting:e,accentColor:o,annotationGroupCount:n,dispatch:r,inFlightSelectors:i}){let[a,s]=ed([]),c=i&&i.size>0,{charIndex:l,word:d}=or(!!c);td(()=>{if(e){s([]);return}let g=null,y=()=>{let L=[];t.forEach((N,R)=>{let M=Xe(N.selector);if(!M)return;let C=M.getBoundingClientRect();L.push({selector:N.selector,modIndex:R,top:C.top>=ua?C.top-ua:C.bottom,left:C.left,label:nd(N),changeCount:N.changes.length,annotationNumber:n+R+1})}),s(L)},S=()=>{g&&cancelAnimationFrame(g),g=requestAnimationFrame(y)};y(),window.addEventListener("scroll",S,!0),window.addEventListener("resize",S,!0);let x=new MutationObserver(S);return x.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),window.addEventListener("load",S),document.fonts.ready.then(S),()=>{window.removeEventListener("scroll",S,!0),window.removeEventListener("resize",S,!0),window.removeEventListener("load",S),x.disconnect(),g&&cancelAnimationFrame(g)}},[t,e,n]);let u=Qc(g=>{let y=t[g];if(!y)return;let S=Xe(y.selector);S&&(r({type:"SELECT_ANNOTATION",payload:{id:null}}),r({type:"SET_TOOL",payload:"inspector"}),r({type:"SELECT_ELEMENT",payload:{el:S,info:y.element}}))},[t,r]);if(a.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},f={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return ln(ni,{children:a.map(g=>{let y=i==null?void 0:i.has(g.selector);return ln(od,{left:g.left-oi,top:g.top-oi,onClick:()=>u(g.modIndex),style:{zIndex:1e4,cursor:"pointer",pointerEvents:"auto"},children:uo("div",{"data-devtools":"badge",style:b(m({},p),{backgroundColor:y?"#999999":o}),children:[uo("span",{children:[g.annotationNumber,"."]}),ln("span",{style:f,children:g.label}),uo("span",{style:{opacity:.8},children:["(",g.changeCount," ",g.changeCount===1?"change":"changes",")"]}),y&&uo("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:l===1?uo(ni,{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"})]}):uo(ni,{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]})]})},g.selector)})})}import{useEffect as rd,useState as id}from"react";import{Fragment as ad,jsx as fa}from"react/jsx-runtime";function sd(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${e})`:`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}function ga({styleModifications:t,accentColor:e}){let[o,n]=id([]);if(rd(()=>{let i=null,a=()=>{let l=[];for(let d of t){let u=Xe(d.selector);if(!u)continue;let p=u.getBoundingClientRect();if(p.width===0&&p.height===0)continue;let f=jn(u);l.push({selector:d.selector,top:p.top,left:p.left,width:p.width,height:p.height,borderRadius:`${f["top-left"]}px ${f["top-right"]}px ${f["bottom-right"]}px ${f["bottom-left"]}px`})}n(l)},s=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(a)};a(),window.addEventListener("scroll",s,{passive:!0}),window.addEventListener("resize",s,{passive:!0});let c=new MutationObserver(s);return c.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",s),window.removeEventListener("resize",s),c.disconnect(),i&&cancelAnimationFrame(i)}},[t]),o.length===0)return null;let r=sd(e,.2);return fa(ad,{children:o.map(i=>{let a={position:"fixed",top:i.top,left:i.left,width:i.width,height:i.height,pointerEvents:"none",zIndex:9995,border:`1px solid ${r}`,borderRadius:i.borderRadius,boxSizing:"border-box"};return fa("div",{"data-devtools":"mod-border",style:a},i.selector)})})}import{useEffect as ma,useLayoutEffect as ld,useState as ha}from"react";import{jsx as On,jsxs as ii}from"react/jsx-runtime";function ri(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${e})`:`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}var cd={top:"bottom",bottom:"top",left:"right",right:"left"};function si({element:t,padding:e,accentColor:o,hoveredSide:n,draggingSide:r,cursorViewport:i,refreshKey:a}){let[s,c]=ha(null),[l,d]=ha(!1);if(ma(()=>{let tt=dt=>{(dt.key==="Meta"||dt.key==="Control")&&d(!0)},et=dt=>{(dt.key==="Meta"||dt.key==="Control")&&d(!1)},vt=()=>d(!1);return window.addEventListener("keydown",tt,!0),window.addEventListener("keyup",et,!0),window.addEventListener("blur",vt),()=>{window.removeEventListener("keydown",tt,!0),window.removeEventListener("keyup",et,!0),window.removeEventListener("blur",vt)}},[]),ma(()=>{if(!t){c(null);return}let tt=()=>{c(t.getBoundingClientRect())};return tt(),window.addEventListener("scroll",tt,{passive:!0}),window.addEventListener("resize",tt,{passive:!0}),()=>{window.removeEventListener("scroll",tt),window.removeEventListener("resize",tt)}},[t]),ld(()=>{t&&c(t.getBoundingClientRect())},[t,e.top,e.right,e.bottom,e.left,a]),!s)return null;let u=s.width,p=s.height,{top:f,right:g,bottom:y,left:S}=e,x="pm-stripe-pattern",L=ri(o,.25),N=ri(o,.1),R=ri(o,.2),M=8,C=2,nt={position:"fixed",top:s.top,left:s.left,width:u,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"},j=["top","right","bottom","left"],G={top:`0,0 ${u},0 ${u-g},${f} ${S},${f}`,right:`${u},0 ${u},${p} ${u-g},${p-y} ${u-g},${f}`,bottom:`0,${p} ${S},${p-y} ${u-g},${p-y} ${u},${p}`,left:`0,0 ${S},${f} ${S},${p-y} 0,${p}`},U={top:{x:u/2-M/2,y:f/2-C/2,w:M,h:C},bottom:{x:u/2-M/2,y:p-y/2-C/2,w:M,h:C},left:{x:S/2-C/2,y:p/2-M/2,w:C,h:M},right:{x:u-g/2-C/2,y:p/2-M/2,w:C,h:M}},O=new Set;return r?O.add(r):n&&(O.add(n),l||O.add(cd[n])),ii("div",{"data-devtools":"padding-handles",style:nt,children:[ii("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${u} ${p}`,children:[On("defs",{children:On("pattern",{id:x,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:On("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:L,strokeWidth:"1.5"})})}),On("rect",{x:"0.5",y:"0.5",width:Math.max(0,u-1),height:Math.max(0,p-1),fill:"none",stroke:R,strokeWidth:"1"}),j.map(tt=>{if(e[tt]<=0)return null;let vt=O.has(tt);return ii("g",{opacity:vt?1:.6,children:[On("polygon",{points:G[tt],fill:N}),On("polygon",{points:G[tt],fill:`url(#${x})`})]},tt)}),j.map(tt=>{let et=U[tt],vt=O.has(tt);return On("rect",{x:et.x,y:et.y,width:et.w,height:et.h,fill:o,stroke:"#ffffff",strokeWidth:vt?4:2,paintOrder:"stroke"},`handle-${tt}`)})]}),i&&(n||r)&&(()=>{let tt=r!=null?r:n,et=Math.round(e[tt]);return On("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:et})})()]})}import{useCallback as Sn,useEffect as un,useMemo as dr,useRef as sn,useState as He}from"react";import{Check as cr,ChevronDown as gi,MoveHorizontal as Ia,RotateCcw as Bd,Shrink as Dd,X as Od}from"lucide-react";var dd="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",fn={borderWidth:3,borderStyle:"solid",borderImage:`url("${dd}") 4 / 1.9 / 0 round`};var rr={"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 po(t){var e,o;return(o=(e=rr[t])==null?void 0:e[0])!=null?o:"px"}function Fn(t){let e=t.match(/^([\d.-]+)(.*)$/);return e?{num:parseFloat(e[1]),unit:e[2]||""}:{num:0,unit:""}}function ir(t,e,o,n){let r=t.trim();if(!r)return"";let i=r.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i);if(i)return`${parseFloat(i[1])}${i[2].toLowerCase()}`;let a=parseFloat(r);if(!isNaN(a)){if(n){let{unit:s}=Fn(o);return`${a}${s||po(e)}`}return`${a}${po(e)}`}return r}function ai(t,e){if(!e||e==="px")return t;if(e==="rem"){let o=parseFloat(getComputedStyle(document.documentElement).fontSize)||16;return Math.round(t/o*1e3)/1e3}return t}import{useCallback as ud,useEffect as pd,useRef as ya,useState as fd}from"react";import{Plus as ba,X as gd}from"lucide-react";import{jsx as rn,jsxs as Jn}from"react/jsx-runtime";var sr=[{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 md(t){if(!t||t==="none")return[];let e=[],o=/([\w-]+)\(([^)]+)\)/g,n;for(;(n=o.exec(t))!==null;){let r=n[1],i=n[2],a=parseFloat(i);isNaN(a)||e.push({name:r,value:a})}return e}function li(t){return t.length===0?"none":t.map(e=>{var r;let o=sr.find(i=>i.name===e.name),n=(r=o==null?void 0:o.unit)!=null?r:"";return`${e.name}(${e.value}${n})`}).join(" ")}function xa({value:t,onChange:e,accentColor:o,modified:n,panelContentRef:r}){let i=md(t),[a,s]=fd(!1),c=ya(null),l=ya(null);pd(()=>{if(!a)return;let N=R=>{c.current&&!c.current.contains(R.target)&&s(!1)};return document.addEventListener("mousedown",N,!0),()=>document.removeEventListener("mousedown",N,!0)},[a]);let d=sr.filter(N=>!i.some(R=>R.name===N.name)),u=N=>{let R=[...i,{name:N.name,value:N.defaultValue}];e(li(R)),s(!1)},p=N=>{let R=i.filter((M,C)=>C!==N);e(li(R))},f=(N,R)=>{let M=i.map((C,nt)=>nt===N?b(m({},C),{value:R}):C);e(li(M))},g={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},y=ud(N=>{var O;if(!l.current)return{position:"fixed",top:0,left:0};let R=l.current.getBoundingClientRect(),M=l.current.closest('[data-devtools="panel"]'),C=M?M.getBoundingClientRect():{top:0,left:0,bottom:9999},nt=(O=r==null?void 0:r.current)==null?void 0:O.getBoundingClientRect(),j=N*24+8,U=C.bottom-R.bottom<j;return b(m({position:"fixed"},U?{bottom:C.bottom-R.top+2-C.top}:{top:R.bottom+2-C.top}),{left:nt?nt.left+4-C.left:R.left-C.left,width:nt?nt.width-8:140,zIndex:10001})},[r]),S={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)"},x={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"},L=N=>rn("div",{ref:c,style:m(m({},y(N.length)),S),children:N.map(R=>rn("button",{type:"button",onClick:()=>u(R),style:x,onMouseEnter:M=>{M.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:M=>{M.currentTarget.style.backgroundColor="transparent"},children:R.label},R.name))});return i.length===0?Jn("div",{children:[Jn("div",{style:{display:"flex",alignItems:"center",gap:4},children:[rn(In,{modified:!1,children:rn("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:b(m({},g),{color:"#999",cursor:"default"})})}),rn("button",{ref:l,type:"button",onClick:()=>s(!a),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:rn(ba,{size:12})})]}),a&&L(sr)]}):Jn("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[i.map((N,R)=>{let M=sr.find(C=>C.name===N.name);return M?Jn("div",{style:{display:"flex",alignItems:"center",gap:4},children:[rn("span",{style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:n?o:"#94a3b8",fontWeight:n?600:400,width:56,flexShrink:0,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:M.label}),rn(In,{modified:n,children:Jn("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[rn("input",{type:"range",min:M.min,max:M.max,step:M.step,value:N.value,onChange:C=>f(R,parseFloat(C.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${o} ${(N.value-M.min)/(M.max-M.min)*100}%, rgba(0,0,0,0.1) ${(N.value-M.min)/(M.max-M.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),rn("input",{type:"number",min:M.min,max:M.max,step:M.step,value:M.unit==="px"||M.unit==="deg"?Math.round(N.value):Math.round(N.value*100)/100,onChange:C=>f(R,parseFloat(C.target.value)||0),style:b(m({},g),{width:44,padding:"2px 4px",textAlign:"right",flexShrink:0})}),M.unit&&rn("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:M.unit})]})}),rn("button",{type:"button",onClick:()=>p(R),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:rn(gd,{size:10})})]},N.name):null}),d.length>0&&Jn("div",{children:[Jn("button",{ref:l,type:"button",onClick:()=>s(!a),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:[rn(ba,{size:10}),"Add filter"]}),a&&L(d)]})]})}import{useCallback as go,useEffect as xd,useRef as ar,useState as va}from"react";import{AlignHorizontalSpaceAround as vd,AlignVerticalSpaceAround as Sd,Columns3 as wd,Grid2x2 as kd,RectangleHorizontal as Cd,Rows3 as Ed,UnfoldHorizontal as Sa,UnfoldVertical as wa}from"lucide-react";import{useCallback as hd,useEffect as yd,useRef as No}from"react";import{jsx as bd}from"react/jsx-runtime";var ci=[0,1,2,4,8,12,16,20,24,28,32];function fo({value:t,onChange:e,onPreview:o,onScrubEnd:n,onReset:r,isModified:i,accentColor:a,defaultUnit:s="rem",snapSteps:c,color:l,style:d,children:u}){let p=No(null),f=No(null),g=No(r),y=No(i),S=No(!1);g.current=r,y.current=i,yd(()=>{let L=R=>{let M=f.current;if(!M)return;M.hasMoved=!0,S.current=R.shiftKey;let C=M.unit==="rem"||M.unit==="em"?.1:1;M.accum+=R.movementX*C;let nt=Math.max(0,Math.round((M.startValue+M.accum)*10)/10);if(R.shiftKey&&c){let j=M.unit==="rem"||M.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,G=M.unit==="rem"||M.unit==="em"?nt*j:nt,U=c[c.length-1];for(let O=0;O<c.length-1;O++){let tt=c[O],et=c[O+1];if(G<=(tt+et)/2){U=tt;break}if(G<et){U=et;break}}G>c[c.length-1]&&(U=Math.round(G/8)*8),nt=M.unit==="rem"||M.unit==="em"?Math.round(U/j*1e3)/1e3:U}o==null||o(`${nt}${M.unit}`)},N=()=>{let R=f.current;if(!R)return;let M=Math.max(0,Math.round((R.startValue+R.accum)*10)/10);if(S.current&&c){let nt=R.unit==="rem"||R.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,j=R.unit==="rem"||R.unit==="em"?M*nt:M,G=c[c.length-1];for(let U=0;U<c.length-1;U++){let O=c[U],tt=c[U+1];if(j<=(O+tt)/2){G=O;break}if(j<tt){G=tt;break}}j>c[c.length-1]&&(G=Math.round(j/8)*8),M=R.unit==="rem"||R.unit==="em"?Math.round(G/nt*1e3)/1e3:G}let C=R.hasMoved&&M!==R.startValue;f.current=null,document.exitPointerLock(),C?e(`${M}${R.unit}`):R.hasMoved?o==null||o(`${R.startValue}${R.unit}`):y.current&&g.current&&g.current(),n==null||n()};return document.addEventListener("mousemove",L),document.addEventListener("mouseup",N),()=>{document.removeEventListener("mousemove",L),document.removeEventListener("mouseup",N)}},[e,o,n]);let x=hd(L=>{var M;if(L.button!==0)return;L.preventDefault();let N=Fn(t),R=N.unit&&N.unit!=="px"?N.unit:s;f.current={startValue:N.num,unit:R,accum:0,hasMoved:!1},(M=p.current)==null||M.requestPointerLock()},[t,s]);return bd("span",{ref:p,onMouseDown:x,title:i?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:m({color:i?a||"#3b82f6":l||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize"},d),children:u})}import{Fragment as di,jsx as Tt,jsxs as De}from"react/jsx-runtime";function Td({gridCols:t,gridRows:e,gridModified:o,accentColor:n,onColsChange:r,onRowsChange:i}){return Tt(cn,{style:{width:100},children:De("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[Tt("input",{type:"number",min:1,max:12,value:t,onChange:a=>r(parseInt(a.target.value)||1),style:b(m({},Fe),{width:32,textAlign:"center",padding:2})}),Tt("span",{style:{fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:o?n:"#999",fontWeight:o?600:400,fontSize:11,margin:"0 4px"},children:"\xD7"}),Tt("input",{type:"number",min:1,max:12,value:e,onChange:a=>i(parseInt(a.target.value)||1),style:b(m({},Fe),{width:32,textAlign:"center",padding:2})})]})})}function ka({element:t,getValue:e,getOriginalValue:o,handleChange:n,isModified:r,onResetProperty:i,isCollapsed:a,onToggle:s,sectionHeaderStyle:c,activeDropdown:l,onDropdownChange:d,panelContentRef:u,accentColor:p,onFieldHover:f,preferredUnit:g,onUnitCycle:y}){let S=d,x=e("display"),L=e("flex-direction"),N=Ca(x,L),R=x==="flex"||x==="inline-flex",M=x==="grid",C=R||M,nt=e("width"),j=e("height"),G=r("width")?nt:Jo(t,"width"),U=r("height")?j:Jo(t,"height"),O=ui(nt,G),tt=ui(j,U),et=e("min-width"),vt=e("max-width"),dt=e("min-height"),bt=e("max-height"),Dt=mo(e("padding")),Ot=e("gap"),At=e("row-gap"),V=e("column-gap"),St=e("grid-template-columns"),Pt=e("grid-template-rows"),Kt=e("overflow"),ee=St.split(/\s+/).filter(Z=>Z&&Z!=="none").length||1,lt=Pt.split(/\s+/).filter(Z=>Z&&Z!=="none").length||1,[ot,Y]=va(!1),gt=l!==null,Ht=gt||ot,ht=gt?.3:ot?.65:1,Et=({mode:Z,icon:Lt,active:qt})=>Tt("button",{type:"button",onClick:()=>Ea(Z,n),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:qt?Vn(p,.15):"transparent",color:qt?p:"#64748b",cursor:"pointer",fontSize:14},children:Lt}),zt=(Z,Lt,qt)=>{qt==="fixed"?n(Z,Lt):n(Z,lr(qt,Lt))},W=Z=>{let Lt=mo(e("padding")),qt=Z||"0";n("padding",`${Lt.top} ${qt} ${Lt.bottom} ${qt}`)},it=Z=>{let Lt=mo(e("padding")),qt=Z||"0";n("padding",`${qt} ${Lt.right} ${qt} ${Lt.left}`)},[ct,mt]=va({}),Nt=go((Z,Lt)=>qt=>{Lt(qt),mt(me=>b(m({},me),{[Z]:qt}))},[]),Bt=go(Z=>{mt(Lt=>{let qt=m({},Lt);return delete qt[Z],qt})},[]),xt=go(Z=>{let Lt=mo(e("padding"));Yt(t,"padding",`${Lt.top} ${Z} ${Lt.bottom} ${Z}`)},[t,e]),ue=go(Z=>{let Lt=mo(e("padding"));Yt(t,"padding",`${Z} ${Lt.right} ${Z} ${Lt.left}`)},[t,e]),Vt=go(Z=>Lt=>{Yt(t,Z,Lt)},[t]),ie=L==="column"||L==="column-reverse",Me=Z=>Z==="center"?1:Z==="flex-end"||Z==="end"?2:0,ne=Me(e("justify-content")),ze=Me(e("align-items")),Ut=ie?ze:ne,fe=ie?ne:ze,Ge=ar(null),ge=ar({x:0,y:0}),Ue=ar({col:Ut,row:fe});Ue.current={col:Ut,row:fe};let Ve=go((Z,Lt)=>{let qt=["flex-start","center","flex-end"];ie?(n("justify-content",qt[Lt]),n("align-items",qt[Z])):(n("justify-content",qt[Z]),n("align-items",qt[Lt]))},[ie,n]),_e=ar(Ve);_e.current=Ve,xd(()=>{let Lt=qt=>{let me=Ge.current;if(!me||!me.contains(qt.target))return;qt.preventDefault(),qt.stopPropagation(),ge.current.x+=qt.deltaX,ge.current.y+=qt.deltaY;let{col:ke,row:ce}=Ue.current,te=!1;Math.abs(ge.current.x)>=30&&(ke=Math.max(0,Math.min(2,ke+(ge.current.x>0?1:-1))),ge.current.x=0,ge.current.y=0,te=!0),!te&&Math.abs(ge.current.y)>=30&&(ce=Math.max(0,Math.min(2,ce+(ge.current.y>0?1:-1))),ge.current.x=0,ge.current.y=0,te=!0),te&&(ke!==Ue.current.col||ce!==Ue.current.row)&&_e.current(ke,ce)};return document.addEventListener("wheel",Lt,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",Lt,{capture:!0})},[]);let tn=()=>Tt("div",{ref:Ge,onMouseEnter:()=>{Y(!0),u.current&&(u.current.style.overflowY="hidden")},onMouseLeave:()=>{Y(!1),u.current&&(u.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:mn,borderRadius:2,display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gridTemplateRows:"repeat(3, 1fr)",padding:6,gap:2,touchAction:"none"},children:[0,1,2].map(Z=>[0,1,2].map(Lt=>Tt("button",{type:"button",onClick:()=>Ve(Lt,Z),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:Lt===Ut&&Z===fe?Tt("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:Lt===0?De(di,{children:[Tt("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),Tt("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),Tt("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):Lt===1?De(di,{children:[Tt("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),Tt("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),Tt("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):De(di,{children:[Tt("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),Tt("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),Tt("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]})}):Tt("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${Z}-${Lt}`)))}),$e=r("grid-template-columns")||r("grid-template-rows");return De("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Tt("div",{style:c,children:Tt("span",{children:C?"Auto layout":"Layout"})}),De("div",{style:{padding:"8px 12px"},children:[De("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:mn,borderRadius:2,padding:2,opacity:ht,transition:"opacity 150ms ease"},children:[Tt(Et,{mode:"block",icon:Tt(Cd,{size:16}),active:N==="block"}),Tt(Et,{mode:"flex-col",icon:Tt(Ed,{size:16}),active:N==="flex-col"}),Tt(Et,{mode:"flex-row",icon:Tt(wd,{size:16}),active:N==="flex-row"}),Tt(Et,{mode:"grid",icon:Tt(kd,{size:16}),active:N==="grid"})]}),De("div",{style:{display:"flex",gap:4,marginBottom:8},children:[Tt(pi,{label:"W",property:"width",cssValue:O==="fixed"?nt:`${Math.round(t.getBoundingClientRect().width)}px`,mode:O,onValueChange:Z=>n("width",Z),onModeChange:Z=>{if(Z==="fixed"){let Lt=t.getBoundingClientRect();n("width",`${Math.round(Lt.width)}px`)}else n("width",lr(Z,nt))},modified:r("width"),dimmed:gt&&l!=="width",dropdownOpen:l==="width",onDropdownChange:Z=>S(Z?"width":null),panelContentRef:u,accentColor:p,onReset:()=>i("width"),minValue:et!=="none"&&et!=="0px"&&et!=="auto"?et:"",maxValue:vt!=="none"&&vt!=="auto"?vt:"",onMinChange:Z=>n("min-width",Z||"0"),onMaxChange:Z=>n("max-width",Z||"none"),onMinReset:()=>i("min-width"),onMaxReset:()=>i("max-width"),minModified:r("min-width"),maxModified:r("max-width")}),Tt(pi,{label:"H",property:"height",cssValue:tt==="fixed"?j:`${Math.round(t.getBoundingClientRect().height)}px`,mode:tt,onValueChange:Z=>n("height",Z),onModeChange:Z=>{if(Z==="fixed"){let Lt=t.getBoundingClientRect();n("height",`${Math.round(Lt.height)}px`)}else n("height",lr(Z,j))},modified:r("height"),dimmed:gt&&l!=="height",dropdownOpen:l==="height",onDropdownChange:Z=>S(Z?"height":null),panelContentRef:u,minValue:dt!=="none"&&dt!=="0px"&&dt!=="auto"?dt:"",maxValue:bt!=="none"&&bt!=="auto"?bt:"",onMinChange:Z=>n("min-height",Z||"0"),onMaxChange:Z=>n("max-height",Z||"none"),onMinReset:()=>i("min-height"),onMaxReset:()=>i("max-height"),minModified:r("min-height"),maxModified:r("max-height"),accentColor:p,onReset:()=>i("height")})]}),R&&De("div",{onMouseEnter:()=>f==null?void 0:f("gap"),onMouseLeave:()=>f==null?void 0:f("element"),style:{display:"flex",gap:8,marginBottom:8},children:[Tt("div",{style:{opacity:gt?.3:1,transition:"opacity 150ms ease"},children:tn()}),De("div",{style:{flex:1,opacity:ht,transition:"opacity 150ms ease"},children:[Tt("div",{onClick:r("gap")?()=>i("gap"):void 0,title:r("gap")?"Click to reset":void 0,style:{fontSize:9,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:r("gap")?p:"#999",fontWeight:r("gap")?600:400,marginBottom:2,cursor:r("gap")?"pointer":"default"},children:"Gap"}),Tt(cn,{dimmed:gt,children:De("div",{style:{display:"flex",alignItems:"center"},children:[Tt(fo,{value:Ot,onChange:Z=>{Bt("gap"),n("gap",Z)},onPreview:Nt("gap",Vt("gap")),onScrubEnd:()=>Bt("gap"),onReset:()=>i("gap"),isModified:r("gap"),accentColor:p,defaultUnit:g,children:L==="column"||L==="column-reverse"?Tt(wa,{size:12,strokeWidth:r("gap")?2.5:1.5}):Tt(Sa,{size:12,strokeWidth:r("gap")?2.5:1.5})}),Tt(gn,{property:"gap",value:ct.gap||Ot,onChange:Z=>n("gap",Z),isModified:r("gap")||"gap"in ct,style:b(m({},Fe),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:y})]})})]})]}),M&&De("div",{onMouseEnter:()=>f==null?void 0:f("gap"),onMouseLeave:()=>f==null?void 0:f("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:ht,transition:"opacity 150ms ease"},children:[Tt(Td,{gridCols:ee,gridRows:lt,gridModified:$e,accentColor:p,onColsChange:Z=>n("grid-template-columns",`repeat(${Z}, 1fr)`),onRowsChange:Z=>n("grid-template-rows",`repeat(${Z}, 1fr)`)}),De("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[Tt(cn,{dimmed:gt,children:De("div",{style:{display:"flex",alignItems:"center"},children:[Tt(fo,{value:V||Ot,onChange:Z=>{Bt("column-gap"),n("column-gap",Z)},onPreview:Nt("column-gap",Vt("column-gap")),onScrubEnd:()=>Bt("column-gap"),onReset:()=>i("column-gap"),isModified:r("column-gap"),accentColor:p,defaultUnit:g,children:Tt(Sa,{size:12,strokeWidth:r("column-gap")?2.5:1.5})}),Tt(gn,{property:"column-gap",value:ct["column-gap"]||V||Ot,onChange:Z=>n("column-gap",Z),isModified:r("column-gap")||"column-gap"in ct,placeholder:"col",style:b(m({},Fe),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:y})]})}),Tt(cn,{dimmed:gt,children:De("div",{style:{display:"flex",alignItems:"center"},children:[Tt(fo,{value:At||Ot,onChange:Z=>{Bt("row-gap"),n("row-gap",Z)},onPreview:Nt("row-gap",Vt("row-gap")),onScrubEnd:()=>Bt("row-gap"),onReset:()=>i("row-gap"),isModified:r("row-gap"),accentColor:p,defaultUnit:g,children:Tt(wa,{size:12,strokeWidth:r("row-gap")?2.5:1.5})}),Tt(gn,{property:"row-gap",value:ct["row-gap"]||At||Ot,onChange:Z=>n("row-gap",Z),isModified:r("row-gap")||"row-gap"in ct,placeholder:"row",style:b(m({},Fe),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:y})]})})]})]}),C&&De("div",{onMouseEnter:()=>f==null?void 0:f("padding"),onMouseLeave:()=>f==null?void 0:f("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:ht,transition:"opacity 150ms ease"},children:[Tt(cn,{style:{flex:1},dimmed:gt,children:De("div",{style:{display:"flex",alignItems:"center"},children:[Tt(fo,{value:Dt.left,onChange:Z=>{Bt("padding-h"),W(Z)},onPreview:Nt("padding-h",xt),onScrubEnd:()=>Bt("padding-h"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:p,defaultUnit:g,snapSteps:ci,children:Tt(vd,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Tt(gn,{property:"padding",value:ct["padding-h"]||Dt.left,onChange:Z=>W(Z),isModified:r("padding")||"padding-h"in ct,placeholder:"H pad",style:b(m({},Fe),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:y})]})}),Tt(cn,{style:{flex:1},dimmed:gt,children:De("div",{style:{display:"flex",alignItems:"center"},children:[Tt(fo,{value:Dt.top,onChange:Z=>{Bt("padding-v"),it(Z)},onPreview:Nt("padding-v",ue),onScrubEnd:()=>Bt("padding-v"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:p,defaultUnit:g,snapSteps:ci,children:Tt(Sd,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Tt(gn,{property:"padding",value:ct["padding-v"]||Dt.top,onChange:Z=>it(Z),isModified:r("padding")||"padding-v"in ct,placeholder:"V pad",style:b(m({},Fe),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:y})]})})]}),De("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:ht,transition:"opacity 150ms ease"},children:[Tt("input",{type:"checkbox",checked:Kt==="hidden",onChange:Z=>n("overflow",Z.target.checked?"hidden":"visible"),style:{margin:0,accentColor:p}}),"Clip content"]})]})]})}import{AlignCenter as Md,AlignJustify as Id,AlignLeft as Ld,AlignRight as Rd,Baseline as Ad,ChevronDown as Pd,WholeWord as Nd}from"lucide-react";import{jsx as de,jsxs as Ln}from"react/jsx-runtime";var Ta={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function Ma({element:t,getValue:e,handleChange:o,isModified:n,onResetProperty:r,isCollapsed:i,onToggle:a,sectionHeaderStyle:s,accentColor:c,colorVariables:l,activeColorDropdown:d,onColorDropdownChange:u,panelContentRef:p,preferredUnit:f,onUnitCycle:g}){var tt;let y=e("font-family"),S=e("font-size"),x=e("font-weight"),L=e("line-height"),N=e("letter-spacing"),R=e("text-align"),M=e("color"),C=String(x),nt=Ta[C]||C,j=Lo(t,M),G=M.includes("var(")?null:Ro(j,l),U=({align:et,icon:vt})=>{let dt=R===et;return de("button",{type:"button",onClick:()=>o("text-align",et),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:dt?Vn(c,.15):"transparent",color:dt?c:"#64748b",cursor:"pointer"},children:vt})},O=((tt=y.split(",")[0])==null?void 0:tt.trim().replace(/^["']|["']$/g,""))||"System";return Ln("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[de("div",{style:s,children:de("span",{children:"Typography"})}),Ln("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[de(cn,{children:Ln("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[de("input",{type:"text",value:y,onChange:et=>o("font-family",et.target.value),style:b(m({},Fe),{flex:1,minWidth:0,padding:0,fontWeight:n("font-family")?600:400,color:n("font-family")?c:"inherit"}),title:y}),de(Pd,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),Ln("div",{style:{display:"flex",gap:4},children:[de(cn,{style:{flex:1},children:de("select",{value:C,onChange:et=>o("font-weight",et.target.value),style:b(m({},Fe),{padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:n("font-weight")?600:400,color:n("font-weight")?c:"inherit"}),children:Object.entries(Ta).map(([et,vt])=>de("option",{value:et,children:vt},et))})}),de(cn,{style:{flex:1},children:de("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:de(gn,{property:"font-size",value:S,onChange:et=>o("font-size",et),isModified:n("font-size"),min:1,max:999,style:b(m({},Fe),{padding:"6px 8px",paddingRight:24,fontWeight:n("font-size")?600:400,color:n("font-size")?c:"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:f,onUnitCycle:g})})})]}),Ln("div",{style:{display:"flex",gap:4},children:[de(cn,{style:{flex:1},children:Ln("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[de(Ad,{size:12,style:{color:n("line-height")?c:"#999",flexShrink:0}}),de(gn,{property:"line-height",value:L,onChange:et=>o("line-height",et),isModified:n("line-height"),step:.1,min:0,placeholder:"Auto",style:b(m({},Fe),{flex:1,minWidth:0,padding:0,fontWeight:n("line-height")?600:400,color:n("line-height")?c:"inherit"}),showUnit:!1})]})}),de(cn,{style:{flex:1},children:Ln("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[de(Nd,{size:12,style:{color:n("letter-spacing")?c:"#999",flexShrink:0}}),de(gn,{property:"letter-spacing",value:N,onChange:et=>o("letter-spacing",et),isModified:n("letter-spacing"),step:.1,placeholder:"\u2014",style:b(m({},Fe),{flex:1,minWidth:0,padding:0,fontWeight:n("letter-spacing")?600:400,color:n("letter-spacing")?c:"inherit"}),showUnit:!1})]})})]}),Ln("div",{style:{display:"flex",gap:2,backgroundColor:mn,borderRadius:2,padding:2},children:[de(U,{align:"left",icon:de(Ld,{size:14})}),de(U,{align:"center",icon:de(Md,{size:14})}),de(U,{align:"right",icon:de(Rd,{size:14})}),de(U,{align:"justify",icon:de(Id,{size:14})})]}),Ln("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[de("span",{onClick:n("color")?()=>r("color"):void 0,title:n("color")?"Click to reset":void 0,style:{fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:n("color")?c:"#64748b",fontWeight:n("color")?600:400,cursor:n("color")?"pointer":"default",width:40,flexShrink:0},children:"Color"}),de("div",{style:{flex:1,minWidth:0},children:de(fi,{value:M,resolvedValue:j,colorVariables:l,matchingVariable:G,onChange:et=>o("color",et),accentColor:c,modified:n("color"),panelContentRef:p,isDropdownOpen:d==="color",onDropdownChange:et=>u(et?"color":null)})})]})]})]})}import{Fragment as Hd,jsx as ft,jsxs as ye}from"react/jsx-runtime";var La=[{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 Fd(t,e){let o=e.trim().toLowerCase();switch(t){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 ui(t,e){return!e||t==="auto"||t==="fit-content"||t==="max-content"||t==="min-content"?"hug":t==="100%"||e==="100%"?"fill":"fixed"}function lr(t,e){switch(t){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let o=Fn(e);if(typeof o.num=="number"&&!isNaN(o.num)){let n=o.unit==="%"?"px":o.unit||"px";return`${o.num}${n}`}return"auto"}}}function mo(t){let e=t.split(/\s+/).filter(Boolean);return e.length===1?{top:e[0],right:e[0],bottom:e[0],left:e[0]}:e.length===2?{top:e[0],right:e[1],bottom:e[0],left:e[1]}:e.length===3?{top:e[0],right:e[1],bottom:e[2],left:e[1]}:e.length>=4?{top:e[0],right:e[1],bottom:e[2],left:e[3]}:{top:"0px",right:"0px",bottom:"0px",left:"0px"}}function Ca(t,e){return t==="grid"?"grid":t==="flex"||t==="inline-flex"?e==="column"||e==="column-reverse"?"flex-col":"flex-row":"block"}function Ea(t,e){switch(t){case"block":e("display","block");break;case"flex-row":e("display","flex"),e("flex-direction","row");break;case"flex-col":e("display","flex"),e("flex-direction","column");break;case"grid":e("display","grid");break}}var mn="rgba(0, 0, 0, 0.04)",Fe={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:t,property:e,cssValue:o,mode:n,onValueChange:r,onModeChange:i,modified:a,dimmed:s,dropdownOpen:c,onDropdownChange:l,panelContentRef:d,accentColor:u="#3b82f6",onReset:p,minValue:f,maxValue:g,onMinChange:y,onMaxChange:S,onMinReset:x,onMaxReset:L,minModified:N,maxModified:R}){let M=Fn(o),C=a?M.unit||po(e):po(e),nt=!a&&M.unit&&M.unit!==C?ai(M.num,C):M.num,[j,G]=He(!1),[U,O]=He(String(nt)),[tt,et]=He(!1),vt=sn(null),dt=sn(null),bt=sn(null),Dt=sn(!1);un(()=>{j||O(String(nt))},[nt,j]),un(()=>{if(!c)return;let lt=Y=>{dt.current&&!dt.current.contains(Y.target)&&bt.current&&!bt.current.contains(Y.target)&&(l==null||l(!1))},ot=Y=>{Y.key==="Escape"&&(l==null||l(!1))};return document.addEventListener("mousedown",lt),document.addEventListener("keydown",ot),()=>{document.removeEventListener("mousedown",lt),document.removeEventListener("keydown",ot)}},[c,l]),un(()=>{j&&vt.current&&(vt.current.focus(),vt.current.select())},[j]);let Ot=()=>{let lt=ir(U,e,o,a);r(lt||`${Math.max(0,parseFloat(U)||0)}${C}`),G(!1)},At=()=>{if(Dt.current){Dt.current=!1;return}Ot()},V=lt=>{if(lt.key==="Enter"){Ot();return}if(lt.key==="Escape"){Dt.current=!0,O(String(nt)),G(!1);return}if(lt.key==="ArrowUp"||lt.key==="ArrowDown"){lt.preventDefault();let ot=lt.key==="ArrowUp"?1:-1,Y=lt.shiftKey?8:lt.altKey?.1:1,gt=parseFloat(U)||0,Ht=Math.round(Math.max(0,gt+ot*Y)*1e3)/1e3;O(String(Ht)),r(`${Ht}${C}`)}},St={fixed:"Fixed",hug:"Hug",fill:"Fill"},Pt={fixed:ft(Ia,{size:12}),hug:ft(Dd,{size:12}),fill:ft(Ia,{size:12})},Kt=()=>{l==null||l(!c)},ee=()=>{if(!bt.current||!(d!=null&&d.current))return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let lt=bt.current.getBoundingClientRect(),ot=d.current.getBoundingClientRect(),Y=d.current.closest('[data-devtools="panel"]'),gt=Y?Y.getBoundingClientRect():{top:0,left:0};return{position:"fixed",top:lt.bottom+4-gt.top,left:ot.left+4-gt.left,width:ot.width-8}};return ye("div",{ref:bt,onMouseEnter:()=>et(!0),onMouseLeave:()=>et(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:j?u:tt?"rgba(0,0,0,0.15)":"transparent",backgroundColor:mn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:s?.3:1},children:[ft("span",{onClick:a&&p?p: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,padding:"0 8px",flexShrink:0,cursor:a?"pointer":"default"},children:t}),n==="fixed"?j?ft("input",{ref:vt,type:"text",inputMode:"numeric",value:U,onChange:lt=>O(lt.target.value),onKeyDown:V,onBlur:At,style:b(m({},Fe),{flex:1,minWidth:0,padding:"4px 2px"})}):ft("span",{onClick:()=>G(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:nt}):ft("span",{style:{flex:1}}),ye("button",{type:"button",onClick:Kt,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:[St[n],ft(gi,{size:12})]}),c&&ye("div",{ref:dt,style:b(m({},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:[ye("button",{type:"button",onClick:()=>{i("fixed"),l==null||l(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:n==="fixed"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:n==="fixed"?600:400,cursor:"pointer",textAlign:"left"},children:[Pt.fixed,ye("span",{children:["Fixed ",e," (",o,")"]}),n==="fixed"&&ft(cr,{size:14,style:{marginLeft:"auto"}})]}),ye("button",{type:"button",onClick:()=>{i("hug"),l==null||l(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:n==="hug"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:n==="hug"?600:400,cursor:"pointer",textAlign:"left"},children:[Pt.hug,ft("span",{children:"Hug contents"}),n==="hug"&&ft(cr,{size:14,style:{marginLeft:"auto"}})]}),ye("button",{type:"button",onClick:()=>{i("fill"),l==null||l(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:n==="fill"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:n==="fill"?600:400,cursor:"pointer",textAlign:"left"},children:[Pt.fill,ft("span",{children:"Fill container"}),n==="fill"&&ft(cr,{size:14,style:{marginLeft:"auto"}})]}),ft("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),ye("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[ye("div",{style:{display:"flex",alignItems:"center",backgroundColor:mn,borderRadius:2,padding:"4px 8px"},children:[ft("span",{onClick:N?lt=>{lt.stopPropagation(),x==null||x()}:void 0,title:N?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:N?u:"#999",fontWeight:N?600:400,marginRight:8,flexShrink:0,cursor:N?"pointer":"default"},children:"Min"}),ft("input",{type:"text",value:f||"",placeholder:"\u2014",onChange:lt=>y==null?void 0:y(lt.target.value),onClick:lt=>lt.stopPropagation(),style:b(m({},Fe),{flex:1,minWidth:0,padding:0,textAlign:"right",color:N?u:"inherit",fontWeight:N?600:400})})]}),ye("div",{style:{display:"flex",alignItems:"center",backgroundColor:mn,borderRadius:2,padding:"4px 8px"},children:[ft("span",{onClick:R?lt=>{lt.stopPropagation(),L==null||L()}: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:"Max"}),ft("input",{type:"text",value:g||"",placeholder:"\u2014",onChange:lt=>S==null?void 0:S(lt.target.value),onClick:lt=>lt.stopPropagation(),style:b(m({},Fe),{flex:1,minWidth:0,padding:0,textAlign:"right",color:R?u:"inherit",fontWeight:R?600:400})})]})]})]})]})}function cn({children:t,style:e,dimmed:o}){let[n,r]=He(!1);return ft("div",{onMouseEnter:()=>r(!0),onMouseLeave:()=>r(!1),style:m({position:"relative",borderRadius:2,border:"1px solid",borderColor:n?"rgba(0,0,0,0.15)":"transparent",backgroundColor:mn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:o?.3:1},e),children:t})}function In({children:t}){let[e,o]=He(!1);return ft("div",{onMouseEnter:()=>o(!0),onMouseLeave:()=>o(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:e?"rgba(0,0,0,0.15)":"transparent",backgroundColor:mn,transition:"border-color 100ms ease"},children:t})}function gn({property:t,value:e,onChange:o,isModified:n=!1,step:r=1,min:i,max:a,style:s,placeholder:c,showUnit:l=!0,unitStyle:d,preferredUnit:u,onUnitCycle:p}){let f=Fn(e),g=po(t),y=rr[t],x=u&&y&&y.includes(u)?u:g,L=n&&f.unit||x,N=!n&&f.unit&&f.unit!==L?ai(f.num,L):f.num,[R,M]=He(!1),[C,nt]=He(""),j=At=>{M(!0),nt(String(N||"")),requestAnimationFrame(()=>At.target.select())},G=()=>{if(M(!1),C.trim()){let At=ir(C,t,e,n);At&&o(At)}},U=At=>{let V=At.target.value;nt(V);let St=V.trim(),Pt=St.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),Kt=St.match(/^(-?[\d.]+)$/);if(Pt){let ee=parseFloat(Pt[1]);isNaN(ee)||o(`${ee}${Pt[2].toLowerCase()}`)}else if(Kt){let ee=parseFloat(Kt[1]);isNaN(ee)||o(`${ee}${L}`)}},O=At=>{if(At.key==="Enter"){if(C.trim()){let V=ir(C,t,e,n);V&&o(V)}At.target.blur();return}if(At.key==="ArrowUp"||At.key==="ArrowDown"){At.preventDefault();let V=At.shiftKey?10:At.altKey?.1:1,St=(At.key==="ArrowUp"?1:-1)*r*V,Pt=parseFloat(C)||N||0,Kt=Math.round((Pt+St)*1e3)/1e3;i!==void 0&&(Kt=Math.max(i,Kt)),a!==void 0&&(Kt=Math.min(a,Kt)),nt(String(Kt)),o(`${Kt}${L}`)}},tt=/^-?[\d.]/.test(e.trim()),et=R?C:tt?String(N):"",dt=R&&/\s*(rem|em|px|%)\s*$/i.test(C)?"":L,bt=p&&(dt==="rem"||dt==="px"),Dt={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},Ot=b(m({},d!=null?d:Dt),{pointerEvents:"auto",cursor:"pointer"});return ye(Hd,{children:[ft("input",{type:"text",inputMode:"decimal",value:et,onFocus:j,onBlur:G,onChange:U,onKeyDown:O,placeholder:c,style:s}),l&&dt&&ft("span",{style:bt?Ot:d!=null?d:Dt,onClick:bt?p:void 0,title:bt?"Click to switch units":void 0,children:dt})]})}function fi({value:t,resolvedValue:e,colorVariables:o,matchingVariable:n,onChange:r,accentColor:i="#3b82f6",modified:a,panelContentRef:s,isDropdownOpen:c,onDropdownChange:l}){let[d,u]=He(!1),p=!t.includes("var(")&&n?n.usage:t,[f,g]=He(p),[y,S]=He(!1),[x,L]=He(!1),[N,R]=He(!1),M=sn(null),C=sn(null),nt=sn(null),j=c!==void 0?c:y,G=l||S,U=Sn(()=>{if(!nt.current)return{position:"fixed",top:0,left:0,width:200};let V=nt.current.getBoundingClientRect(),St=nt.current.closest('[data-devtools="panel"]'),Pt=St?St.getBoundingClientRect():{top:0,left:0};if(s!=null&&s.current){let Kt=s.current.getBoundingClientRect();return{position:"fixed",top:V.bottom+4-Pt.top,left:Kt.left+4-Pt.left,width:Kt.width-8}}return{position:"fixed",top:V.bottom+4-Pt.top,left:V.left-Pt.left,width:V.width}},[s]);un(()=>{if(!d){let V=!t.includes("var(")&&n?n.usage:t;g(V)}},[t,d,n]),un(()=>{if(!j&&!x)return;let V=Pt=>{nt.current&&!nt.current.contains(Pt.target)&&(G(!1),L(!1))},St=Pt=>{Pt.key==="Escape"&&(G(!1),L(!1))};return document.addEventListener("mousedown",V),document.addEventListener("keydown",St),()=>{document.removeEventListener("mousedown",V),document.removeEventListener("keydown",St)}},[j,x]),un(()=>{d&&M.current&&(M.current.focus(),M.current.select())},[d]);let O=dr(()=>{if(!f||f.startsWith("#")||f.startsWith("rgb")||f.startsWith("hsl")||f.startsWith("oklch"))return[];let V=f.toLowerCase();return o.filter(St=>St.name.toLowerCase().includes(V)||St.usage.toLowerCase().includes(V)).slice(0,8)},[f,o]),tt=()=>{r(f),u(!1),L(!1)},et=V=>{g(V),V.includes("var")||V.includes("--")||V.length>0&&!V.startsWith("#")?L(!0):L(!1)},vt=V=>{g(V.usage),r(V.usage),G(!1),L(!1),u(!1)},dt=()=>{setTimeout(()=>{!j&&!x&&tt()},150)},bt=V=>{V.key==="Enter"?tt():V.key==="Escape"&&(g(t),u(!1),L(!1))},Dt=dr(()=>{let V=e.trim().toLowerCase();if(V.startsWith("#"))return V.length===4?`#${V[1]}${V[1]}${V[2]}${V[2]}${V[3]}${V[3]}`:V.slice(0,7);let St=V.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(St){let Kt=parseInt(St[1],10).toString(16).padStart(2,"0"),ee=parseInt(St[2],10).toString(16).padStart(2,"0"),lt=parseInt(St[3],10).toString(16).padStart(2,"0");return`#${Kt}${ee}${lt}`}let Pt=V.match(/oklch\(\s*([\d.]+)/);if(Pt){let Kt=Math.max(0,Math.min(1,parseFloat(Pt[1]))),ee=Math.round(Kt*255).toString(16).padStart(2,"0");return`#${ee}${ee}${ee}`}return"#000000"},[e]),Ot=V=>{let St=V.target.value;g(St),r(St)},At=t.includes("var(");return ye("div",{ref:nt,onMouseEnter:()=>R(!0),onMouseLeave:()=>R(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:d?i:N?"rgba(0,0,0,0.15)":"transparent",backgroundColor:mn,transition:"border-color 100ms ease",overflow:"hidden"},children:[ye("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[ye("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[ft("input",{type:"color",value:Dt,onChange:Ot,style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),ft("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:e,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),d?ft("input",{ref:M,type:"text",value:f,onChange:V=>et(V.target.value),onKeyDown:bt,onBlur:dt,style:b(m({},Fe),{flex:1,minWidth:0})}):ft("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:a?i:"inherit"},title:p,children:p}),o.length>0&&ft("button",{type:"button",onClick:()=>G(!j),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:ft(gi,{size:12})})]}),x&&O.length>0&&ft("div",{style:b(m({},U()),{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:O.map(V=>ye("button",{type:"button",onClick:()=>vt(V),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:[ft("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:V.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ft("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:V.name})]},V.name))}),j&&ft("div",{ref:C,style:b(m({},U()),{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(V=>ye("button",{type:"button",onClick:()=>vt(V),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:p===V.usage||t===V.usage?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:p===V.usage||t===V.usage?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[ft("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:V.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ft("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:V.name}),(p===V.usage||t===V.usage)&&ft(cr,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},V.name))})]})}function Ra({element:t,elementInfo:e,selector:o,styleModifications:n,dispatch:r,onClose:i,onHover:a,accentColor:s="#3b82f6"}){var Et,zt;let c=sn(null),l=sn(null),[d,u]=He(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch(W){return!1}});un(()=>{if(d)return;let W=setTimeout(()=>u(!0),50);return()=>clearTimeout(W)},[d]);let[p,f]=He(null),[g,y]=He(null),S=p!==null||g!==null,[x,L]=He("rem"),N=Sn(()=>{L(W=>W==="rem"?"px":"rem")},[]),R=sn(new Map),[M,C]=He(""),nt=dr(()=>Br(),[]);un(()=>{let W=it=>{var mt;if(it.key!=="Escape")return;let ct=document.activeElement;ct&&((mt=c.current)!=null&&mt.contains(ct))||i()};return window.addEventListener("keydown",W),()=>window.removeEventListener("keydown",W)},[i]);let j=sn({top:0,left:0,maxHeight:400}),[,G]=He(0),U="devtools-panel-position",O=sn({x:0,y:0}),tt=sn(null),et=sn(!1);un(()=>{try{let W=localStorage.getItem(U);if(W){let it=JSON.parse(W);typeof it.top=="number"&&typeof it.left=="number"&&(et.current=!0,j.current=b(m({},j.current),{top:it.top,left:it.left}))}}catch(W){}},[]),un(()=>{let W=ct=>{let mt=tt.current;if(!mt)return;let Nt=mt.startOffsetX+(ct.clientX-mt.startX),Bt=mt.startOffsetY+(ct.clientY-mt.startY),xt=280,ue=16,Vt=Math.max(ue,Math.min(window.innerWidth-xt-ue,j.current.left+Nt)),ie=Math.max(ue,j.current.top+Bt);O.current={x:Vt-j.current.left,y:ie-j.current.top};let Me=c.current,ne=Me==null?void 0:Me.parentElement;if(!ne)return;ne.style.top=`${ie}px`,ne.style.left=`${Vt}px`;let ze=document.getElementById("devtools-toolbar"),Ut=ze==null?void 0:ze.getBoundingClientRect(),fe=window.innerHeight-16;Ut&&Vt+xt>Ut.left&&(fe=Ut.top-8);let Ge=Math.max(0,ie),ge=Math.max(200,fe-Ge);Me&&(Me.style.maxHeight=`${ge}px`)},it=()=>{if(!tt.current)return;let ct=j.current.top+O.current.y,mt=j.current.left+O.current.x;j.current=b(m({},j.current),{top:ct,left:mt}),O.current={x:0,y:0},et.current=!0;try{localStorage.setItem(U,JSON.stringify({top:ct,left:mt}))}catch(Nt){}tt.current=null};return window.addEventListener("mousemove",W),window.addEventListener("mouseup",it),()=>{window.removeEventListener("mousemove",W),window.removeEventListener("mouseup",it)}},[]);let vt=Sn(W=>{W.button!==0||W.target.closest("button")||(W.preventDefault(),tt.current={startX:W.clientX,startY:W.clientY,startOffsetX:O.current.x,startOffsetY:O.current.y})},[]);un(()=>{O.current={x:0,y:0};let W=(mt=!1)=>{let Nt=c.current,Bt=280,xt=8,ue,Vt;if(et.current)ue=j.current.top,Vt=j.current.left;else{let fe=t.getBoundingClientRect();Vt=fe.right+xt,ue=fe.top,Vt+Bt>window.innerWidth-xt&&(Vt=fe.left-Bt-xt),Vt<xt&&(Vt=Math.max(xt,(window.innerWidth-Bt)/2))}let ie=document.getElementById("devtools-toolbar"),Me=ie==null?void 0:ie.getBoundingClientRect(),ne=window.innerHeight-16;Me&&Vt+Bt>Me.left&&(ne=Me.top-xt);let ze=Math.max(0,ue),Ut=Math.max(200,ne-ze);if(j.current={top:ue,left:Vt,maxHeight:Ut},mt&&Nt){let fe=Nt.parentElement;fe&&!et.current&&(fe.style.top=`${ue+O.current.y}px`,fe.style.left=`${Vt+O.current.x}px`),Nt.style.maxHeight=`${Ut}px`}else G(fe=>fe+1)};W(!1);let it=()=>W(!0),ct=()=>W(!1);return window.addEventListener("scroll",it,{passive:!0}),window.addEventListener("resize",ct,{passive:!0}),()=>{window.removeEventListener("scroll",it),window.removeEventListener("resize",ct)}},[t]),un(()=>{let W=c.current;if(!W)return;let it=ct=>{let mt=l.current;if(!mt){ct.preventDefault();return}let{scrollTop:Nt,scrollHeight:Bt,clientHeight:xt}=mt,ue=Nt<=0&&ct.deltaY<0,Vt=Nt+xt>=Bt&&ct.deltaY>0;(ue||Vt)&&ct.preventDefault()};return W.addEventListener("wheel",it,{passive:!1}),()=>W.removeEventListener("wheel",it)},[]);let dt=dr(()=>n.find(W=>W.selector===o),[n,o]),bt=Sn(W=>{let it=dt==null?void 0:dt.changes.find(ct=>ct.property===W);if(it)return it.modified;if(W.includes("color")){let ct=Lr(t,W);if(ct&&ct.includes("var("))return ct}return To(t,W)},[t,dt]),Dt=Sn(W=>{if(R.current.has(W))return R.current.get(W);let it=dt==null?void 0:dt.changes.find(mt=>mt.property===W);if(it)return it.original;let ct=To(t,W);return R.current.set(W,ct),ct},[t,dt]),Ot=Sn((W,it)=>{let ct=Dt(W);Yt(t,W,it),W==="backdrop-filter"&&Yt(t,"-webkit-backdrop-filter",it),r({type:"MODIFY_STYLE",payload:{selector:o,element:e,property:W,original:ct,modified:it}})},[t,o,e,r,Dt]),At=Sn(()=>{Nr(o,n);let W=n.find(it=>it.selector===o);if(W)for(let it of W.changes)r({type:"CLEAR_STYLE",payload:{selector:o,property:it.property}});R.current.clear()},[o,n,r]),V=Sn(W=>{let it=n.find(mt=>mt.selector===o);it!=null&&it.changes.find(mt=>mt.property===W)&&t instanceof HTMLElement&&(t.style.removeProperty(W),r({type:"CLEAR_STYLE",payload:{selector:o,property:W}}),R.current.delete(W))},[t,o,n,r]),St=Sn(()=>{let W=M.split(";").map(it=>it.trim()).filter(it=>it);for(let it of W){let ct=it.indexOf(":");if(ct>0){let mt=it.slice(0,ct).trim(),Nt=it.slice(ct+1).trim();mt&&Nt&&Ot(mt,Nt)}}C("")},[M,Ot]),Pt=Sn(W=>{var it;return(it=dt==null?void 0:dt.changes.some(ct=>ct.property===W))!=null?it:!1},[dt]),Kt=W=>{var Bt;let it=bt(W.property),ct=Pt(W.property),mt=!ct&&Fd(W.property,it),Nt={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(mt&&W.type!=="backdrop-filter")return ft(In,{modified:!1,children:ft("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:xt=>Ot(W.property,xt.target.value),style:b(m({},Nt),{color:"#999"})})});switch(W.type){case"color":{let xt=Lo(t,it),ue=it.includes("var(")?null:Ro(xt,nt);return ft(fi,{value:it,resolvedValue:xt,colorVariables:nt,matchingVariable:ue,onChange:Vt=>Ot(W.property,Vt),accentColor:s,modified:ct,panelContentRef:l,isDropdownOpen:g===W.property,onDropdownChange:Vt=>y(Vt?W.property:null)})}case"number":{if(!!rr[W.property])return ft(In,{modified:ct,children:ft(gn,{property:W.property,value:it,onChange:Vt=>Ot(W.property,Vt),isModified:ct,min:W.min,max:W.max,step:W.step||1,style:b(m({},Nt),{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:x,onUnitCycle:N})});let{num:ue}=Fn(it);return ft(In,{modified:ct,children:ft("input",{type:"number",value:ue,min:W.min,max:W.max,step:W.step||1,onChange:Vt=>Ot(W.property,Vt.target.value),style:Nt})})}case"select":return ft(In,{modified:ct,children:ye("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[ft("select",{value:it,onChange:xt=>Ot(W.property,xt.target.value),style:b(m({},Nt),{cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"}),children:(Bt=W.options)==null?void 0:Bt.map(xt=>ft("option",{value:xt,children:xt},xt))}),ft("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:ft(gi,{size:12})})]})});case"spacing":return ft(In,{modified:ct,children:ft("input",{type:"text",value:it,onChange:xt=>Ot(W.property,xt.target.value),placeholder:"e.g., 10px or 10px 20px",style:Nt})});case"backdrop-filter":return ft(xa,{value:it,onChange:xt=>Ot(W.property,xt),accentColor:s,modified:ct,panelContentRef:l});default:return ft(In,{modified:ct,children:ft("input",{type:"text",value:it,onChange:xt=>Ot(W.property,xt.target.value),style:Nt})})}},ee=(Et=dt==null?void 0:dt.changes.length)!=null?Et:0,lt=(zt=dt==null?void 0:dt.captured)!=null?zt:!1,ot=b(m({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)"},fn),{zIndex:1e4,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontSize:12,overflow:"hidden",display:"flex",flexDirection:"column",opacity:d?1:0,transition:"opacity 150ms ease"}),Y={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:tt.current?"grabbing":"grab"},gt={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"12px 12px 6px",userSelect:"none",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontWeight:600,color:"#475569"},Ht={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},ht={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return ft("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:j.current.top+O.current.y,left:j.current.left+O.current.x,zIndex:1e4,pointerEvents:"none"},children:ye("div",{ref:c,"data-devtools":"panel",style:b(m({},ot),{position:"relative",top:0,left:0,zIndex:0,pointerEvents:"auto"}),onMouseEnter:()=>a==null?void 0:a("element"),onMouseLeave:()=>a==null?void 0:a(null),children:[ye("div",{style:Y,onMouseDown:vt,children:[ye("div",{style:{display:"flex",alignItems:"center",gap:8,overflow:"hidden"},children:[ft("span",{style:{fontWeight:600,fontSize:11,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:e.tagName}),ee>0&&ft("span",{style:{backgroundColor:lt?"#999999":s,color:"#fff",fontSize:9,padding:"1px 4px",borderRadius:2},children:ee})]}),ye("div",{style:{display:"flex",gap:4},children:[ee>0&&ft("button",{type:"button",onClick:At,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:ft(Bd,{size:14})}),ft("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:ft(Od,{size:14})})]})]}),ye("div",{ref:l,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[ft("div",{style:{opacity:g?.3:1,transition:"opacity 150ms ease"},children:ft(ka,{element:t,getValue:bt,getOriginalValue:Dt,handleChange:Ot,isModified:Pt,onResetProperty:V,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:gt,activeDropdown:p,onDropdownChange:f,panelContentRef:l,accentColor:s,onFieldHover:a,preferredUnit:x,onUnitCycle:N})}),ft("div",{style:{opacity:p?.3:1,transition:"opacity 150ms ease"},children:ft(Ma,{element:t,getValue:bt,handleChange:Ot,isModified:Pt,onResetProperty:V,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:gt,accentColor:s,colorVariables:nt,activeColorDropdown:g,onColorDropdownChange:y,panelContentRef:l,preferredUnit:x,onUnitCycle:N})}),La.map((W,it)=>{let ct=it===La.length-1,mt=g&&W.properties.some(Bt=>Bt.property===g);return ye("div",{style:{borderBottom:ct?"none":"1px solid rgba(0,0,0,0.08)",opacity:S&&!mt?.3:1,transition:"opacity 150ms ease"},children:[ft("div",{style:gt,children:ft("span",{children:W.name})}),ft("div",{style:{padding:"4px 0"},children:W.properties.map(Bt=>{let xt=Pt(Bt.property),ue=mt&&Bt.property!==g;return ye("div",{style:b(m({},Ht),{opacity:ue?.3:1,transition:"opacity 150ms ease"}),children:[ft("span",{onClick:xt?()=>V(Bt.property):void 0,title:xt?"Click to reset":void 0,style:b(m({},ht),{color:xt?s:"#64748b",fontWeight:xt?600:400,cursor:xt?"pointer":"default"}),children:Bt.label}),ft("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:Kt(Bt)})]},Bt.property)})})]},W.name)}),ye("div",{style:{opacity:S?.3:1,transition:"opacity 150ms ease"},children:[ft("div",{style:gt,children:ft("span",{children:"Raw CSS"})}),ye("div",{style:{padding:"8px 12px"},children:[ft("textarea",{value:M,onChange:W=>C(W.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"}}),M.trim()&&ft("button",{type:"button",onClick:St,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:s,color:"#fff",cursor:"pointer",opacity:M.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as zd,useLayoutEffect as _d,useState as $d}from"react";import{Fragment as Gd,jsx as Kn,jsxs as jd}from"react/jsx-runtime";var mi=["flex-start","center","flex-end"],hi=["flex-start","center","flex-end"];function Wd(t){return t==="normal"||t==="flex-start"||t==="start"?"flex-start":t==="flex-end"||t==="end"?"flex-end":t==="center"?"center":null}function Yd(t){return t==="normal"||t==="stretch"||t==="flex-start"||t==="start"?"flex-start":t==="flex-end"||t==="end"?"flex-end":t==="center"?"center":null}function Aa(t){let e=Array.from(t.children);if(e.length===0)return null;let o=1/0,n=1/0,r=-1/0,i=-1/0;for(let a of e){let s=a.getBoundingClientRect();s.width===0&&s.height===0||(s.top<o&&(o=s.top),s.left<n&&(n=s.left),s.bottom>r&&(r=s.bottom),s.right>i&&(i=s.right))}return o===1/0?null:new DOMRect(n,o,i-n,r-o)}function Pa({element:t,modifier:e,accentColor:o,refreshKey:n=0}){let[r,i]=$d(null);if(zd(()=>{if(!t){i(null);return}let y=()=>i(Aa(t));return y(),window.addEventListener("scroll",y,{passive:!0}),window.addEventListener("resize",y,{passive:!0}),()=>{window.removeEventListener("scroll",y),window.removeEventListener("resize",y)}},[t]),_d(()=>{t&&i(Aa(t))},[t,n]),!r)return null;let a=r,s=window.getComputedStyle(t),c=s.display;if(c!=="flex"&&c!=="inline-flex")return null;let l=s.flexDirection,d=l==="column"||l==="column-reverse"?"vertical":"horizontal",u=d==="horizontal"?"vertical":"horizontal",p=[];if(e==="shift"){let y=Wd(s.justifyContent);if(y){let S=mi.indexOf(y);d==="horizontal"?(S>0&&p.push("left"),S<mi.length-1&&p.push("right")):(S>0&&p.push("up"),S<mi.length-1&&p.push("down"))}}else{let y=Yd(s.alignItems);if(y){let S=hi.indexOf(y);u==="horizontal"?(S>0&&p.push("left"),S<hi.length-1&&p.push("right")):(S>0&&p.push("up"),S<hi.length-1&&p.push("down"))}}if(p.length===0)return null;let f=14,g=7;return Kn(Gd,{children:p.map(y=>{let S,x;switch(y){case"right":S=a.right+f,x=a.top+a.height/2;break;case"left":S=a.left-f,x=a.top+a.height/2;break;case"down":S=a.left+a.width/2,x=a.bottom+f;break;case"up":S=a.left+a.width/2,x=a.top-f;break}let L=y==="right"?0:y==="left"?180:y==="down"?90:-90,N={position:"fixed",left:S-g,top:x-g,width:g*2,height:g*2,pointerEvents:"none",zIndex:9997};return Kn("div",{"data-devtools":"swipe-hint",style:N,children:Kn("svg",{width:g*2,height:g*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:jd("g",{transform:`rotate(${L})`,children:[Kn("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),Kn("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),Kn("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:o,strokeWidth:"1.5",strokeLinecap:"round"}),Kn("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:o,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},y)})})}import{useEffect as Vd,useLayoutEffect as Xd,useState as Jd}from"react";import{jsx as yi,jsxs as bi}from"react/jsx-runtime";function Kd(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${e})`:`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}function Na({element:t,fontSize:e,lineHeight:o,accentColor:n,hoveredProperty:r,draggingProperty:i,cursorViewport:a}){let[s,c]=Jd(null);if(Vd(()=>{if(!t){c(null);return}let x=()=>{c(so(t))};return x(),window.addEventListener("scroll",x,{passive:!0}),window.addEventListener("resize",x,{passive:!0}),()=>{window.removeEventListener("scroll",x),window.removeEventListener("resize",x)}},[t]),Xd(()=>{t&&c(so(t))},[t,e,o]),!s)return null;let l=s.width,d=s.height,u=Kd(n,.2),p=i!=null?i:r,f=8,g=2,y={position:"fixed",top:s.top,left:s.left,width:l,height:d,pointerEvents:"none",zIndex:9996,overflow:"visible"},S=x=>x==="font-size"?`${Math.round(e)}`:(e>0?o/e:1.2).toFixed(2).replace(/\.?0+$/,"");return bi("div",{"data-devtools":"text-handles",style:y,children:[bi("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${l} ${d}`,children:[yi("rect",{x:"0.5",y:"0.5",width:Math.max(0,l-1),height:Math.max(0,d-1),fill:"none",stroke:u,strokeWidth:"1"}),(p==="font-size"||!p)&&yi("rect",{x:l-g/2,y:d/2-f/2,width:g,height:f,fill:n,stroke:"#ffffff",strokeWidth:p==="font-size"?4:2,paintOrder:"stroke"}),(p==="line-height"||!p)&&yi("rect",{x:l/2-f/2,y:d-g/2,width:f,height:g,fill:n,stroke:"#ffffff",strokeWidth:p==="line-height"?4:2,paintOrder:"stroke"})]}),a&&p&&(()=>{let x=p==="font-size"?"Aa":"Lh",L=S(p);return bi("div",{style:{position:"fixed",left:a.x+8,top:a.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:[x," ",L]})})()]})}import{Fragment as yo,jsx as re,jsxs as ho}from"react/jsx-runtime";var Ba=8,vi=[0,1,2,4,8,12,16,20,24,28,32],Si="devtools-active-text";function Da(t,e,o=0){let n=t.left+window.scrollX+4,r=e==="top-left"?t.top+window.scrollY-lo-o*lo+4:t.bottom+window.scrollY+4-1+o*lo;return{x:n,y:r}}function Oa({state:t,dispatch:e,onScreenshot:o,inFlightAnnotationIds:n,inFlightStyleSelectors:r,inFlightSelectorColors:i,onAttachImages:a,onReply:s,onViewThread:c,activePlan:l,onModelComponentsAdd:d,onModelComponentFocus:u,onModelComponentHover:p,modelComponentNames:f,modelPanelHoveredComponent:g,modelSpacingTokenHover:y}){var es,ns,os,rs,is,ss,as,ls,cs,ds,us;let{canvasRef:S,redrawAll:x,resizeCanvas:L}=Xs(),N=Ce(!1);je(()=>{let v=S.current;if(!v)return;let k=()=>{N.current&&(N.current=!1,v.style.pointerEvents="")},q=E=>{E.button===0&&N.current&&k()};return window.addEventListener("mousedown",q),()=>window.removeEventListener("mousedown",q)},[S]);let[R,M]=le(!1),[C,nt]=le(()=>{if(typeof window=="undefined")return null;try{let v=localStorage.getItem(Si);return v?JSON.parse(v):null}catch(v){return null}}),[j,G]=le(null),[U,O]=le(null),[tt,et]=le(null),vt=Ce(null),dt=Ce(null),bt=Ce({x:0,y:0}),Dt=Ce([]),Ot=Ce(0),[At,V]=le(null),[St,Pt]=le(new Map),Kt=Ce(0),ee=Ce(null),[lt,ot]=le(null),[Y,gt]=le(null),Ht=Ce({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}),[ht,Et]=le(null),[zt,W]=le(null),[it,ct]=le(null),[mt,Nt]=le(null),Bt=Ce({x:0,y:0}),[xt,ue]=le({x:0,y:0}),Vt=Ce({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}),[ie,Me]=le(null),[ne,ze]=le(null),[Ut,fe]=le(null),[Ge,ge]=le(!1),[Ue,Ve]=le(0),[_e,tn]=le(null),$e=Ce({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}),[we,Z]=le(null),[Lt,qt]=le(null),[me,ke]=le(null),ce=Ce({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[te,en]=le(null),[nn,wn]=le(null),[oe,X]=le(null),rt=Js(),h=Ce(i);h.current=i;let I=Oe(v=>{let k=h.current;if(!k||k.size===0)return!1;for(let q of k.keys())try{if(v.matches(q))return!0}catch(E){}return!1},[]),A=Ce(t);A.current=t;let z=Ce(C);z.current=C;let yt=Ce([]),Rt=Ce(o);Rt.current=o;let[Q,jt]=le(null),Mt=t.selectedAnnotationIds;yt.current=Mt;let _t=Oe((v,k=!1)=>{e({type:"SELECT_ANNOTATION",payload:{id:v,addToSelection:k}})},[e]),wt=Oe(()=>{e({type:"SELECT_ANNOTATION",payload:{id:null}})},[e]),[Gt,We]=le(null),[be,kn]=le({x:window.scrollX,y:window.scrollY});je(()=>(L(),window.addEventListener("resize",L),()=>window.removeEventListener("resize",L)),[L]),je(()=>{let v=()=>{kn({x:window.scrollX,y:window.scrollY})};return window.addEventListener("scroll",v,{passive:!0}),()=>window.removeEventListener("scroll",v)},[]),je(()=>{C?localStorage.setItem(Si,JSON.stringify(C)):localStorage.removeItem(Si)},[C]),Ks(C,nt,j,t.annotations,e);let zn=Ce(At);zn.current=At,je(()=>{if(t.activeTool!=="model"||!t.isAnnotating)return;let v=k=>{if(!k.altKey||!zn.current)return;k.preventDefault();let q=k.deltaY>0?-1:1;Kt.current=Math.max(0,Kt.current+q);let E=ee.current;if(E){let B=Vo(E,Kt.current);V(B)}};return window.addEventListener("wheel",v,{passive:!1}),()=>window.removeEventListener("wheel",v)},[t.activeTool,t.isAnnotating]),je(()=>{t.activeTool!=="model"&&(V(null),Pt(new Map),Kt.current=0,ee.current=null)},[t.activeTool]),je(()=>{var q;let v=(q=At==null?void 0:At.name)!=null?q:null,k=v&&(f!=null&&f.has(v))?v:null;p==null||p(k)},[At,f,p]);let[Ye,Nn]=le(null);je(()=>{var q;if(!g){Nn(null);return}let v=oo(g.name),k=g.instanceIndex;Nn((q=v[k%v.length])!=null?q:null)},[g]);let[Xi,yr]=le([]);je(()=>{var v,k;if(!y){yr([]);return}(k=(v=y.token)==null?void 0:v.bindings)!=null&&k.length?yr(Mr(y.token)):yr(Er(y.px))},[y]);let ol=Ce(null),rl=Ce(null);ol.current=ie,rl.current=ne,je(()=>{let v=["flex-start","center","flex-end"],k=["flex-start","center","flex-end"],E=null,B=!1,H=null,at=null,D=(pt,Ct)=>{let Jt=Dn(pt,Ct);for(;Jt&&Jt!==document.documentElement;){let ae=window.getComputedStyle(Jt).display;if(ae==="flex"||ae==="inline-flex")return Jt;Jt=Jt.parentElement}return null},K=pt=>{let Ct=window.getComputedStyle(pt).flexDirection;return Ct==="column"||Ct==="column-reverse"?"vertical":"horizontal"},w=pt=>{let Ct=pt.getAttribute("data-pm");return Ct||(Ct=Math.random().toString(36).substring(2,8),pt.setAttribute("data-pm",Ct)),{selector:`[data-pm="${Ct}"]`,durableSelector:an(pt)}},T=()=>{B=!0,E&&clearTimeout(E),E=setTimeout(()=>{B=!1,E=null},300)},J=(pt,Ct,Zt)=>{let Jt=K(pt);if(Ct===Jt){let $t=window.getComputedStyle(pt).justifyContent,he=$t==="normal"||$t==="flex-start"||$t==="start"?"flex-start":$t==="flex-end"||$t==="end"?"flex-end":$t==="center"?"center":null;if(!he)return;let Ne=v.indexOf(he)+Zt;if(Ne<0||Ne>=v.length)return;let Tn=v[Ne],{selector:$n,durableSelector:xr}=w(pt);Yt(pt,"justify-content",Tn),e({type:"MODIFY_STYLES_BATCH",payload:{selector:$n,durableSelector:xr,element:Je(pt),changes:[{property:"justify-content",original:$t,modified:Tn}]}})}else{let $t=window.getComputedStyle(pt).flexDirection,he=Jt==="horizontal"?"column":"row",{selector:pn,durableSelector:Ne}=w(pt);Yt(pt,"flex-direction",he),e({type:"MODIFY_STYLES_BATCH",payload:{selector:pn,durableSelector:Ne,element:Je(pt),changes:[{property:"flex-direction",original:$t,modified:he}]}})}Ve(ae=>ae+1)},P=(pt,Ct,Zt)=>{let ae=K(pt)==="horizontal"?"vertical":"horizontal";if(Ct!==ae)return;let he=window.getComputedStyle(pt).alignItems,pn=he==="normal"||he==="stretch"||he==="flex-start"||he==="start"?"flex-start":he==="flex-end"||he==="end"?"flex-end":he==="center"?"center":null;if(!pn)return;let Tn=k.indexOf(pn)+Zt;if(Tn<0||Tn>=k.length)return;let $n=k[Tn],{selector:xr,durableSelector:pl}=w(pt);Yt(pt,"align-items",$n),e({type:"MODIFY_STYLES_BATCH",payload:{selector:xr,durableSelector:pl,element:Je(pt),changes:[{property:"align-items",original:he,modified:$n}]}}),Ve(fl=>fl+1)},F=20,$=null,_=null,ut=0,kt=(pt,Ct,Zt)=>{let Jt=D(Ct,Zt);tn(Jt?{modifier:pt,target:Jt}:null)},se=pt=>{if(!(t.activeTool!=="hand"||!t.isAnnotating)){if(pt.key==="Shift"&&!pt.altKey){let Ct=Bt.current;kt("shift",Ct.x,Ct.y)}else if(pt.key==="Alt"&&!pt.shiftKey){let Ct=Bt.current;kt("alt",Ct.x,Ct.y)}}},Xt=pt=>{if(t.activeTool!=="hand"||!t.isAnnotating)return;let Ct=pt.shiftKey&&!pt.altKey,Zt=pt.altKey&&!pt.shiftKey;if(!Ct&&!Zt||pt.buttons!==0){$=null,_=null,ut=0,H=null,at=null,tn(null);return}if(H===null&&(H=pt.clientX,at=pt.clientY,kt(Ct?"shift":"alt",pt.clientX,pt.clientY)),B)return;$===null&&($=pt.clientX,_=pt.clientY,ut=0);let Jt=pt.clientX-$,ae=pt.clientY-_,$t=Math.abs(Jt)>=Math.abs(ae)?Jt:ae;if(Math.abs($t)>3){let $n=$t>0?1:-1;if(ut!==0&&$n!==ut){$=pt.clientX,_=pt.clientY,ut=0;return}ut=$n}if(Math.abs(Jt)<F&&Math.abs(ae)<F)return;let he=D(H,at);if(!he)return;let pn=Math.abs(Jt)>=Math.abs(ae)?"horizontal":"vertical",Tn=(pn==="horizontal"?Jt:ae)>0?1:-1;$=null,_=null,ut=0,Ct?J(he,pn,Tn):P(he,pn,Tn),T()},Ie=pt=>{(pt.key==="Shift"||pt.key==="Alt")&&(H=null,at=null,$=null,_=null,ut=0,tn(null))},pe=()=>{tn(null),$=null,_=null,ut=0};return window.addEventListener("keydown",se),window.addEventListener("mousemove",Xt),window.addEventListener("mousedown",pe),window.addEventListener("keyup",Ie),()=>{window.removeEventListener("keydown",se),window.removeEventListener("mousemove",Xt),window.removeEventListener("mousedown",pe),window.removeEventListener("keyup",Ie),E&&clearTimeout(E)}},[t.activeTool,t.isAnnotating,e]),je(()=>{let v=k=>{var B,H,at;if(k.key==="Escape"){if(z.current)return;if(t.activeTool==="model"&&St.size>0){k.preventDefault(),Pt(new Map);return}if(yt.current.length>0){k.preventDefault(),wt();return}}if(k.key==="Enter"&&t.activeTool==="model"&&St.size>0&&d){k.preventDefault();let D=[...St.keys()].filter(K=>!(f!=null&&f.has(K)));D.length>0&&d(D),Pt(new Map);return}if((k.metaKey||k.ctrlKey)&&k.key==="v"&&Dt.current.length>0&&!z.current){k.preventDefault(),Ot.current++;let D=Ot.current*20,w=((B=Dt.current[0])==null?void 0:B.groupId)?Math.random().toString(36).substring(2,9):void 0,T=Dt.current.map(P=>b(m({},P),{id:Math.random().toString(36).substring(2,9),groupId:P.groupId?w:void 0,timestamp:Date.now(),points:P.points.map(F=>({x:F.x+D,y:F.y+D}))}));e({type:"PASTE_ANNOTATIONS",payload:{annotations:T}});let J=T.find(P=>P.type!=="text")||T[0];J&&_t(J.id);return}let q=yt.current;if(q.length===0||z.current)return;let E=(H=k.target)==null?void 0:H.tagName;if(!(E==="INPUT"||E==="TEXTAREA"||(at=k.target)!=null&&at.isContentEditable)&&(k.key==="Delete"||k.key==="Backspace")){k.preventDefault();for(let D of q)e({type:"DELETE_ANNOTATION",payload:{id:D}});wt()}};return window.addEventListener("keydown",v),()=>window.removeEventListener("keydown",v)},[e,wt,_t,t.activeTool,St,f,d]);let Cn=xi(()=>nr(t.annotations),[t.annotations]),ko=xi(()=>{let v=new Map,k=new Set,q=1;for(let E of t.annotations)if(!Cn.has(E))if(E.groupId){if(!k.has(E.groupId)){k.add(E.groupId);let B=t.annotations.filter(H=>H.groupId===E.groupId);for(let H of B)v.set(H.id,q);q++}}else v.set(E.id,q),q++;return v},[t.annotations,Cn]),Ji=xi(()=>{if(Mt.length===0)return null;let v=new Map;for(let k of Mt){let q=t.annotations.find(B=>B.id===k);if(!q)continue;let E=q.groupId?t.annotations.filter(B=>B.groupId===q.groupId):[q];for(let B of E)if(B.linkedSelector&&!(i!=null&&i.has(B.linkedSelector))){let H=B.color||t.activeColor;v.set(B.linkedSelector,H)}}return v.size>0?v:null},[Mt,t.annotations,t.activeColor,i]);je(()=>{let v=t.annotations.filter(k=>!(Cn.has(k)||C&&!C.isNew&&k.id===C.id));x(v,t.currentPath,t.activeTool,t.activeColor,t.strokeWidth,Mt,Ba,be.x,be.y,ko)},[t.annotations,t.currentPath,t.activeTool,t.activeColor,t.strokeWidth,x,C,Mt,be,ko,Cn]),je(()=>{if(U){let v=Math.random().toString(36).substring(2,9);nt({id:v,point:U.point,text:"",fontSize:12,isNew:!0,groupId:U.groupId}),O(null)}},[U]),je(()=>{tt&&(nt({id:Math.random().toString(36).substring(2,9),point:tt.point,text:"",fontSize:12,isNew:!0,linkedSelector:tt.linkedSelector,linkedAnchor:tt.linkedAnchor,elements:tt.elements}),et(null))},[tt]);let Ho=Ce(null),zo=(es=C==null?void 0:C.id)!=null?es:null;je(()=>{zo&&vt.current?requestAnimationFrame(()=>{var q;let v=vt.current;if(!v||(v.focus(),dt.current===zo))return;dt.current=zo;let k=z.current;if(k){if(Ho.current!==null){let E=Math.min(Ho.current,v.value.length);v.setSelectionRange(E,E);return}if(!k.isNew&&k.clickPoint){let E=S.current;if(!E)return;let B=E.getContext("2d");if(!B)return;B.font=`${k.fontSize}px ${ve}`;let H=k.fontSize*1.4,at=k.text.split(`
8
- `),D=k.clickPoint.y-k.point.y,K=Math.max(0,Math.min(at.length-1,Math.floor(D/H))),w=k.clickPoint.x-k.point.x,T=at[K]||"",J=0;for(let F=0;F<=T.length;F++){let $=B.measureText(T.substring(0,F)).width;if($>w){let _=F>0?B.measureText(T.substring(0,F-1)).width:0;J=w-_<$-w?F-1:F;break}J=F}let P=J;for(let F=0;F<K;F++)P+=(((q=at[F])==null?void 0:q.length)||0)+1;v.setSelectionRange(P,P)}}}):(dt.current=null,Ho.current=null)},[zo,S]);let Qn=Oe(v=>{let k=S.current;if(!k)return{x:0,y:0};let q=k.getBoundingClientRect(),E,B;if("touches"in v&&v.touches[0])E=v.touches[0].clientX,B=v.touches[0].clientY;else if("clientX"in v)E=v.clientX,B=v.clientY;else return{x:0,y:0};return{x:E-q.left+window.scrollX,y:B-q.top+window.scrollY}},[S]),_n=Oe((v,k,q,E)=>{let B=q.x-k.x,H=q.y-k.y,at=B*B+H*H;if(at===0)return Math.sqrt((v.x-k.x)**2+(v.y-k.y)**2)<=E;let D=Math.max(0,Math.min(1,((v.x-k.x)*B+(v.y-k.y)*H)/at)),K=k.x+D*B,w=k.y+D*H;return Math.sqrt((v.x-K)**2+(v.y-w)**2)<=E},[]),_o=Oe(v=>{for(let q=t.annotations.length-1;q>=0;q--){let E=t.annotations[q];if(!E||Cn.has(E))continue;let B=(E.strokeWidth||3)+4;switch(E.type){case"text":{if(!E.points[0]||!E.text)continue;let H=E.points[0],at=E.fontSize||12,D=S.current;if(D){let K=D.getContext("2d");if(K){K.font=`${at}px ${ve}`;let w=E.text.split(`
9
- `),T=Math.max(...w.map(P=>K.measureText(P).width)),J=w.length*(at*1.4);if(v.x>=H.x-4-4&&v.x<=H.x+T+4+4&&v.y>=H.y-4-4&&v.y<=H.y+J+4+4)return E}}break}case"rectangle":{if(E.points.length<2)continue;let H=E.points[0],at=E.points[E.points.length-1],D=Math.min(H.x,at.x),K=Math.max(H.x,at.x),w=Math.min(H.y,at.y),T=Math.max(H.y,at.y),J=_n(v,{x:D,y:w},{x:K,y:w},B),P=_n(v,{x:D,y:T},{x:K,y:T},B),F=_n(v,{x:D,y:w},{x:D,y:T},B),$=_n(v,{x:K,y:w},{x:K,y:T},B);if(J||P||F||$)return E;break}case"circle":{if(E.points.length<2)continue;let H=E.points[0],at=E.points[E.points.length-1],D=(H.x+at.x)/2,K=(H.y+at.y)/2,w=Math.abs(at.x-H.x)/2,T=Math.abs(at.y-H.y)/2,J=v.x-D,P=v.y-K,F=Math.sqrt((J/w)**2+(P/T)**2);if(Math.abs(F-1)*Math.max(w,T)<=B)return E;break}case"line":{if(E.points.length<2)continue;let H=E.points[0],at=E.points[E.points.length-1];if(_n(v,H,at,B))return E;break}case"freehand":{if(E.points.length<2)continue;for(let H=0;H<E.points.length-1;H++){let at=E.points[H],D=E.points[H+1];if(_n(v,at,D,B))return E}break}}}return null},[t.annotations,S,_n,Cn]),Ki=Oe(v=>{let k=_o(v);return(k==null?void 0:k.type)==="text"?k:null},[_o]),Ui=Oe(v=>{if(Mt.length===0)return null;let k=Ba/2+4;for(let q of Mt){let E=t.annotations.find(B=>B.id===q);if(!(!E||E.points.length<2)){if(E.type==="line"){let B=E.points[0],H=E.points[E.points.length-1];if(Math.sqrt((v.x-B.x)**2+(v.y-B.y)**2)<=k)return{handle:"start",annotationId:q};if(Math.sqrt((v.x-H.x)**2+(v.y-H.y)**2)<=k)return{handle:"end",annotationId:q};continue}if(E.type==="circle"){let B=E.points[0],H=E.points[E.points.length-1],at=Math.min(B.x,H.x),D=Math.max(B.x,H.x),K=Math.min(B.y,H.y),w=Math.max(B.y,H.y),T=(at+D)/2,J=(K+w)/2,P=[{handle:"top",x:T,y:K},{handle:"bottom",x:T,y:w},{handle:"left",x:at,y:J},{handle:"right",x:D,y:J}];for(let{handle:F,x:$,y:_}of P)if(Math.sqrt((v.x-$)**2+(v.y-_)**2)<=k)return{handle:F,annotationId:q};continue}if(E.type==="rectangle"||E.type==="freehand"){let B=E.points[0],H=E.points[E.points.length-1],at,D,K,w;E.type==="freehand"?(at=Math.min(...E.points.map(J=>J.x)),D=Math.max(...E.points.map(J=>J.x)),K=Math.min(...E.points.map(J=>J.y)),w=Math.max(...E.points.map(J=>J.y))):(at=Math.min(B.x,H.x),D=Math.max(B.x,H.x),K=Math.min(B.y,H.y),w=Math.max(B.y,H.y));let T=[{corner:"topLeft",x:at,y:K},{corner:"topRight",x:D,y:K},{corner:"bottomLeft",x:at,y:w},{corner:"bottomRight",x:D,y:w}];for(let{corner:J,x:P,y:F}of T)if(Math.sqrt((v.x-P)**2+(v.y-F)**2)<=k)return{handle:J,annotationId:q}}}}return null},[Mt,t.annotations]);je(()=>{let v=k=>{if(bt.current={x:k.clientX+window.scrollX,y:k.clientY+window.scrollY},!C){let q=Ki(bt.current);G((q==null?void 0:q.id)||null)}};return window.addEventListener("mousemove",v),()=>window.removeEventListener("mousemove",v)},[C,Ki]);let to=Oe(()=>{var k;if(!C)return;let v=((k=C.images)==null?void 0:k.length)||0;if(C.text.trim()||v>0)if(C.isNew){let q=no();e({type:"ADD_TEXT",payload:m({point:C.point,text:C.text||(v>0?`[${v} image${v>1?"s":""}]`:""),fontSize:C.fontSize,id:q,groupId:C.groupId,linkedSelector:C.linkedSelector,linkedAnchor:C.linkedAnchor,elements:C.elements},v>0?{imageCount:v}:{})}),v>0&&C.images&&a&&a(q,C.images)}else e({type:"UPDATE_TEXT",payload:m({id:C.id,text:C.text||(v>0?`[${v} image${v>1?"s":""}]`:"")},v>0?{imageCount:v}:{})}),v>0&&C.images&&a&&a(C.id,C.images);else C.isNew||e({type:"DELETE_ANNOTATION",payload:{id:C.id}});nt(null)},[C,e,a]),En=Oe(v=>{for(let k=0;k<vi.length-1;k++){let q=vi[k],E=vi[k+1];if(v<=(q+E)/2)return q;if(v<E)return E}return Math.round(v/8)*8},[]),Zi=Oe((v,k,q,E)=>{let B=q.top+Math.max(E.top,4),H=q.bottom-Math.max(E.bottom,4),at=q.left+Math.max(E.left,4),D=q.right-Math.max(E.right,4);if(v<q.left||v>q.right||k<q.top||k>q.bottom)return null;let K=k<B,w=k>H,T=v<at,J=v>D;return K&&T?E.top>=E.left?"top":"left":K&&J?E.top>=E.right?"top":"right":w&&T?E.bottom>=E.left?"bottom":"left":w&&J?E.bottom>=E.right?"bottom":"right":K?"top":w?"bottom":T?"left":J?"right":null},[]),qi=Oe(v=>{var H,at;if(!t.isAnnotating)return;if(t.inspectedElement&&t.activeTool==="hand"&&!("button"in v&&v.button===2)){v.preventDefault(),v.stopPropagation(),e({type:"SELECT_ELEMENT",payload:null});return}let k=Qn(v),q="shiftKey"in v&&v.shiftKey;if(t.activeTool==="inspector"){if("button"in v&&v.button===2)return;if(lt&&!I(lt)){let D=Je(lt),K=an(lt),w=lt.getBoundingClientRect(),T=lt.getAttribute("data-pm");T||(T=Math.random().toString(36).substring(2,8),lt.setAttribute("data-pm",T));let J=`[data-pm="${T}"]`,P=t.styleModifications.some(kt=>{try{return lt.matches(kt.selector)}catch(se){return!1}}),F=t.annotations.filter(kt=>{if(!kt.linkedSelector)return!1;try{return lt.matches(kt.linkedSelector)}catch(se){return!1}}).length,$=(P?1:0)+F,_=w.top>=lo*(1+$)?"top-left":"bottom-left",ut=Da(w,_,$);et({point:ut,linkedSelector:J,linkedAnchor:_,elements:[b(m({},D),{selector:K})]})}return}if(t.activeTool==="model"){if("button"in v&&v.button===2)return;if(At){let D=At.name;if(f!=null&&f.has(D)){u==null||u(D);return}"shiftKey"in v&&v.shiftKey?Pt(w=>{let T=new Map(w);return T.has(D)?T.delete(D):T.set(D,At),T}):St.size===1&&St.has(D)?(d&&d([D]),Pt(new Map)):Pt(new Map([[D,At]]))}return}if(t.activeTool==="hand"&&ie&&ne){let D=ie,K=D.getAttribute("data-pm");K||(K=Math.random().toString(36).substring(2,8),D.setAttribute("data-pm",K));let w=an(D),T=`[data-pm="${K}"]`,J=Je(D),P=Mo(D),F=k.x-window.scrollX,$=k.y-window.scrollY,_=Ge,ut=window.getComputedStyle(D).justifyContent,kt=0;if(_){let Xt=Yn(D).find(Ie=>Ie.axis===ne);kt=Xt?ne==="column"?Xt.w:Xt.h:0}Yt(D,"transition","none"),Vt.current={isDragging:!0,hasMoved:!1,axis:ne,startX:F,startY:$,originalRow:_?kt:P.row,originalColumn:_?kt:P.column,element:D,elementInfo:b(m({},J),{selector:T}),selector:T,durableSelector:w,isAuto:_,originalJustifyContent:ut,visualGap:kt},fe({axis:ne,row:_?kt:P.row,column:_?kt:P.column});return}if(t.activeTool==="hand"&&te&&nn){let D=te,K=D.getAttribute("data-pm");K||(K=Math.random().toString(36).substring(2,8),D.setAttribute("data-pm",K));let w=`[data-pm="${K}"]`,T=Je(D),{fontSize:J,lineHeight:P}=Io(D),F=J>0?P/J:1.2,$=k.x-window.scrollX,_=k.y-window.scrollY;Yt(D,"transition","none");let ut=an(D);ce.current={isDragging:!0,property:nn,startX:$,startY:_,originalFontSize:J,originalLineHeight:P,originalRatio:F,element:D,elementInfo:b(m({},T),{selector:w}),selector:w,durableSelector:ut},X({property:nn,fontSize:J,lineHeight:P});return}if(t.activeTool==="hand"&&we&&Lt){let D=we,K=D.getAttribute("data-pm");K||(K=Math.random().toString(36).substring(2,8),D.setAttribute("data-pm",K));let w=`[data-pm="${K}"]`,T=an(D),J=Je(D),P=jn(D),F=D.getBoundingClientRect(),$=Math.floor(F.height/2),_=k.y-window.scrollY;Yt(D,"transition","none"),$e.current={isDragging:!0,corner:Lt,startY:_,original:P,maxRadius:$,element:D,elementInfo:b(m({},J),{selector:w}),selector:w,durableSelector:T},ke({corner:Lt,radius:m({},P)});return}if(t.activeTool==="hand"&&ht&&zt){let D=ht,K=D.getAttribute("data-pm");K||(K=Math.random().toString(36).substring(2,8),D.setAttribute("data-pm",K));let w=`[data-pm="${K}"]`,T=an(D),J=Je(D),P=io(D),F=k.x-window.scrollX,$=k.y-window.scrollY;Yt(D,"transition","none"),Ht.current={isDragging:!0,side:zt,startX:F,startY:$,original:P,element:D,elementInfo:b(m({},J),{selector:w}),selector:w,durableSelector:T},Nt({side:zt,padding:m({},P)});return}let E=Ui(k);if(E){let D=t.annotations.find(K=>K.id===E.annotationId);if(D&&D.type!=="text"&&((H=D.status)!=null?H:"pending")==="pending"){We({annotationId:E.annotationId,handle:E.handle,startPoint:k,originalPoints:[...D.points],hasMoved:!1});return}}let B=_o(k);if(B&&B.points[0]){if(C&&to(),B.type!=="text"){if(_t(B.id,q),B.color&&e({type:"SET_COLOR",payload:B.color}),c){let D=B.threadId||(B.groupId?(at=t.annotations.find(K=>K.groupId===B.groupId&&K.threadId))==null?void 0:at.threadId:void 0);D&&c(D)}}else q||wt();jt({annotation:B,startPoint:k,hasMoved:!1});return}if(q||wt(),t.activeTool==="text"){C&&to();let D=Math.random().toString(36).substring(2,9);nt({id:D,point:k,text:"",fontSize:12,isNew:!0});return}M(!0),e({type:"START_PATH",payload:k})},[t.isAnnotating,t.activeTool,t.inspectedElement,t.annotations,C,Mt,lt,ht,zt,we,Lt,ie,ne,Ge,te,nn,At,St,f,d,u,c,Qn,_o,Ui,e,_t,wt,to]),Qi=Oe(v=>{var q,E;let k=Qn(v);if(t.activeTool==="inspector"&&t.isAnnotating){let B=k.x-window.scrollX,H=k.y-window.scrollY,at=Dn(B,H),D=at&&I(at)?null:at;D!==lt&&(ot(D),gt(D?Je(D):null));return}if(t.activeTool==="model"&&t.isAnnotating){let B=k.x-window.scrollX,H=k.y-window.scrollY,at=Dn(B,H);if(at!==ee.current&&(ee.current=at,Kt.current=0),at){let D=Vo(at,Kt.current);V(D)}else V(null);return}if(t.activeTool==="hand"&&t.isAnnotating){let B=k.x-window.scrollX,H=k.y-window.scrollY;Bt.current={x:B,y:H},ue({x:B,y:H});let at=rt.current.cmd,D=rt.current.shift;if(Vt.current.isDragging){let w=Vt.current,T=w.element;if(!T)return;if(!w.hasMoved){let $=Math.abs(B-w.startX),_=Math.abs(H-w.startY);if($<=2&&_<=2)return;w.hasMoved=!0,w.isAuto&&(Yt(T,"justify-content","normal"),Yt(T,"row-gap",`${w.visualGap}px`),Yt(T,"column-gap",`${w.visualGap}px`),ge(!1))}let J=w.axis,P=w.originalRow,F=w.originalColumn;if(J==="column"){let $=B-w.startX;F=w.originalColumn+$,at||(P=w.originalRow+$)}else{let $=H-w.startY;P=w.originalRow+$,at||(F=w.originalColumn+$)}P=Math.max(0,P),F=Math.max(0,F),D&&(P=En(P),F=En(F)),P=Math.round(P),F=Math.round(F),Yt(T,"row-gap",`${P}px`),Yt(T,"column-gap",`${F}px`),fe({axis:J,row:P,column:F});return}if($e.current.isDragging){let w=$e.current,T=w.element;if(!T)return;let J=H-w.startY,P=w.corner,F=w.original,$=m({},F);if(at){let _=F[P]+J;_=Math.max(0,Math.min(w.maxRadius,_)),D&&(_=En(_)),_=Math.round(_),$[P]=_}else{let _=F[P]+J;_=Math.max(0,Math.min(w.maxRadius,_)),D&&(_=En(_)),_=Math.round(_),$={"top-left":_,"top-right":_,"bottom-right":_,"bottom-left":_}}Yt(T,"border-top-left-radius",`${$["top-left"]}px`),Yt(T,"border-top-right-radius",`${$["top-right"]}px`),Yt(T,"border-bottom-right-radius",`${$["bottom-right"]}px`),Yt(T,"border-bottom-left-radius",`${$["bottom-left"]}px`),ke({corner:P,radius:$});return}if(ce.current.isDragging){let w=ce.current,T=w.element;if(!T)return;let J=w.property,P=w.originalFontSize,F=w.originalLineHeight,$=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(J==="font-size"){let ut=B-w.startX;P=w.originalFontSize+ut,P=Math.max(1,P)}else{let ut=H-w.startY;F=w.originalLineHeight+ut,F=Math.max(P,F)}if(D)if(J==="font-size"){let ut=$[0],kt=Math.abs(P-ut);for(let se of $){let Xt=Math.abs(P-se);Xt<kt&&(ut=se,kt=Xt)}P=ut}else{let ut=P>0?F/P:1.2,kt=Math.round(ut*2)/2;F=P*Math.max(1,kt)}P=Math.round(P),F=Math.round(F*10)/10,Yt(T,"font-size",`${P}px`);let _=P>0?Math.round(F/P*1e3)/1e3:1.2;Yt(T,"line-height",`${_}`),X({property:J,fontSize:P,lineHeight:F});return}if(Ht.current.isDragging){let w=Ht.current,T=w.element;if(!T)return;let J=w.side,P=w.original,F=P.top,$=P.right,_=P.bottom,ut=P.left;if(J==="top"){let kt=w.startY-H;F=P.top+kt,at||(_=P.bottom+kt)}else if(J==="bottom"){let kt=H-w.startY;_=P.bottom+kt,at||(F=P.top+kt)}else if(J==="left"){let kt=w.startX-B;ut=P.left+kt,at||($=P.right+kt)}else if(J==="right"){let kt=B-w.startX;$=P.right+kt,at||(ut=P.left+kt)}F=Math.max(0,F),$=Math.max(0,$),_=Math.max(0,_),ut=Math.max(0,ut),D&&(F=En(F),$=En($),_=En(_),ut=En(ut)),F=Math.round(F),$=Math.round($),_=Math.round(_),ut=Math.round(ut),Yt(T,"padding",`${F}px ${$}px ${_}px ${ut}px`),Nt({side:J,padding:{top:F,right:$,bottom:_,left:ut}});return}let K=Dn(B,H);for(;K&&K.tagName==="A";)K=K.parentElement;{let T=[];K&&T.push(K),we&&we!==K&&T.push(we);let J=null,P=16,F=null;for(let $ of T){let _=$.getBoundingClientRect(),ut=jn($),kt=[["top-left",_.left,_.top+ut["top-left"]],["top-right",_.right,_.top+ut["top-right"]],["bottom-right",_.right,_.bottom-ut["bottom-right"]],["bottom-left",_.left,_.bottom-ut["bottom-left"]]];for(let[se,Xt,Ie]of kt){let pe=Math.hypot(B-Xt,H-Ie);pe<P&&(P=pe,J=se,F=$)}}if(J&&F){Z(F),qt(J),ht&&Et(null),zt&&W(null),ie&&Me(null),ne&&ze(null),ge(!1),te&&en(null),nn&&wn(null);return}}we&&Z(null),Lt&&qt(null);{let w=[];K&&Ko(K)&&w.push(K);let T=(q=K==null?void 0:K.parentElement)!=null?q:null;for(;T&&T!==document.body&&w.length<3;)Ko(T)&&w.push(T),T=T.parentElement;for(let J of w){let F=Yn(J).find($=>B>=$.x&&B<=$.x+$.w&&H>=$.y&&H<=$.y+$.h);if(F){Me(J),ze(F.axis),ge(Rr(J,F.axis)),ht&&Et(null),zt&&W(null),te&&en(null),nn&&wn(null);return}}}ie&&Me(null),ne&&ze(null),ge(!1);{let T=[];K&&T.push(K),te&&te!==K&&T.push(te);let J=null,P=1/0,F=null;for(let $ of T){if(!Ar($))continue;let _=so($);if(!_)continue;let ut=B>=_.left&&B<=_.right&&H>=_.top&&H<=_.bottom,kt=[["font-size",_.right,_.top+_.height/2],["line-height",_.left+_.width/2,_.bottom]];for(let[se,Xt,Ie]of kt){let pe=Math.hypot(B-Xt,H-Ie);(ut||pe<12)&&pe<P&&(P=pe,J=se,F=$)}}J&&F?(en(F),wn(J)):(te&&en(null),nn&&wn(null))}if(K!==ht&&Et(K),K){let w=io(K),T=K.getBoundingClientRect(),J=Zi(B,H,T,w);W(J)}else W(null);return}if(Gt){let{handle:B,originalPoints:H,hasMoved:at}=Gt,D=t.annotations.find(P=>P.id===Gt.annotationId);if(!D)return;let K="metaKey"in v,w=K&&(v.metaKey||v.ctrlKey),T=K&&v.shiftKey,J;if(D.type==="line"){let P=H[0],F=H[H.length-1];B==="start"?J=[k,F]:J=[P,k]}else if(D.type==="freehand"){let P=Math.min(...H.map($t=>$t.x)),F=Math.max(...H.map($t=>$t.x)),$=Math.min(...H.map($t=>$t.y)),_=Math.max(...H.map($t=>$t.y)),ut=(P+F)/2,kt=($+_)/2,se=F-P||1,Xt=_-$||1,Ie=se/Xt,pe=P,pt=F,Ct=$,Zt=_;switch(B){case"topLeft":pe=k.x,Ct=k.y;break;case"topRight":pt=k.x,Ct=k.y;break;case"bottomLeft":pe=k.x,Zt=k.y;break;case"bottomRight":pt=k.x,Zt=k.y;break}if(w)switch(B){case"topLeft":pt=F+(P-pe),Zt=_+($-Ct);break;case"topRight":pe=P-(pt-F),Zt=_+($-Ct);break;case"bottomLeft":pt=F+(P-pe),Ct=$-(Zt-_);break;case"bottomRight":pe=P-(pt-F),Ct=$-(Zt-_);break}if(T){let $t=pt-pe,he=Zt-Ct;if(Math.abs($t/he)>Ie){let Ne=Math.abs(he)*Ie*Math.sign($t);B==="topLeft"||B==="bottomLeft"?pe=pt-Ne:pt=pe+Ne}else{let Ne=Math.abs($t)/Ie*Math.sign(he);B==="topLeft"||B==="topRight"?Ct=Zt-Ne:Zt=Ct+Ne}}let Jt=pt-pe||1,ae=Zt-Ct||1;J=H.map($t=>({x:pe+($t.x-P)/se*Jt,y:Ct+($t.y-$)/Xt*ae}))}else if(D.type==="circle"){let P=H[0],F=H[H.length-1],$=Math.min(P.x,F.x),_=Math.max(P.x,F.x),ut=Math.min(P.y,F.y),kt=Math.max(P.y,F.y),se=($+_)/2,Xt=(ut+kt)/2,Ie=_-$,pe=kt-ut,pt=$,Ct=_,Zt=ut,Jt=kt;switch(B){case"top":if(Zt=k.y,w&&(Jt=Xt+(Xt-k.y)),T){let $t=(Jt-Zt)*(Ie/pe)/2;pt=se-$t,Ct=se+$t}break;case"bottom":if(Jt=k.y,w&&(Zt=Xt-(k.y-Xt)),T){let $t=(Jt-Zt)*(Ie/pe)/2;pt=se-$t,Ct=se+$t}break;case"left":if(pt=k.x,w&&(Ct=se+(se-k.x)),T){let $t=(Ct-pt)*(pe/Ie)/2;Zt=Xt-$t,Jt=Xt+$t}break;case"right":if(Ct=k.x,w&&(pt=se-(k.x-se)),T){let $t=(Ct-pt)*(pe/Ie)/2;Zt=Xt-$t,Jt=Xt+$t}break}J=[{x:pt,y:Zt},{x:Ct,y:Jt}]}else{let P=H[0],F=H[H.length-1],$=Math.min(P.x,F.x),_=Math.max(P.x,F.x),ut=Math.min(P.y,F.y),kt=Math.max(P.y,F.y),se=($+_)/2,Xt=(ut+kt)/2,Ie=_-$||1,pe=kt-ut||1,pt=Ie/pe,Ct=$,Zt=_,Jt=ut,ae=kt;switch(B){case"topLeft":Ct=k.x,Jt=k.y;break;case"topRight":Zt=k.x,Jt=k.y;break;case"bottomLeft":Ct=k.x,ae=k.y;break;case"bottomRight":Zt=k.x,ae=k.y;break}if(w)switch(B){case"topLeft":Zt=_+($-Ct),ae=kt+(ut-Jt);break;case"topRight":Ct=$-(Zt-_),ae=kt+(ut-Jt);break;case"bottomLeft":Zt=_+($-Ct),Jt=ut-(ae-kt);break;case"bottomRight":Ct=$-(Zt-_),Jt=ut-(ae-kt);break}if(T){let $t=Zt-Ct,he=ae-Jt;if(Math.abs($t/he)>pt){let Ne=Math.abs(he)*pt*Math.sign($t);B==="topLeft"||B==="bottomLeft"?Ct=Zt-Ne:Zt=Ct+Ne}else{let Ne=Math.abs($t)/pt*Math.sign(he);B==="topLeft"||B==="topRight"?Jt=ae-Ne:ae=Jt+Ne}}J=[{x:Ct,y:Jt},{x:Zt,y:ae}]}e({type:"RESIZE_ANNOTATION",payload:{id:Gt.annotationId,points:J,saveUndo:!at}}),at||We(b(m({},Gt),{hasMoved:!0}));return}if(Q&&((E=Q.annotation.status)!=null?E:"pending")==="pending"){let B=k.x-Q.startPoint.x,H=k.y-Q.startPoint.y;if((Math.abs(B)>2||Math.abs(H)>2)&&!Q.hasMoved)jt(b(m({},Q),{hasMoved:!0,startPoint:k})),e({type:"MOVE_ANNOTATION",payload:{id:Q.annotation.id,delta:{x:B,y:H},saveUndo:!0}});else if(Q.hasMoved){let D=k.x-Q.startPoint.x,K=k.y-Q.startPoint.y;jt(b(m({},Q),{startPoint:k})),e({type:"MOVE_ANNOTATION",payload:{id:Q.annotation.id,delta:{x:D,y:K}}})}return}!R||!t.isAnnotating||e({type:"CONTINUE_PATH",payload:k})},[R,t.isAnnotating,t.activeTool,Q,Gt,lt,ht,zt,we,Lt,ie,ne,te,nn,Qn,e,En,Zi]),br=Oe(v=>{var E,B,H,at,D,K;if(ce.current.isDragging){let w=ce.current,T=w.element;if(T&&w.selector&&w.elementInfo&&oe){T instanceof HTMLElement&&(T.style.removeProperty("font-size"),T.style.removeProperty("line-height"),T.style.removeProperty("transition"));let J=[];if(w.originalFontSize!==oe.fontSize&&(Yt(T,"font-size",`${oe.fontSize}px`),J.push({property:"font-size",original:`${w.originalFontSize}px`,modified:`${oe.fontSize}px`})),w.originalLineHeight!==oe.lineHeight){let P=w.originalFontSize>0?Math.round(w.originalLineHeight/w.originalFontSize*1e3)/1e3:1.2,F=oe.fontSize>0?Math.round(oe.lineHeight/oe.fontSize*1e3)/1e3:1.2;Yt(T,"line-height",`${F}`),J.push({property:"line-height",original:`${P}`,modified:`${F}`})}J.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:w.selector,durableSelector:(E=w.durableSelector)!=null?E:void 0,element:w.elementInfo,changes:J}})}ce.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},X(null);return}if(Vt.current.isDragging){let w=Vt.current,T=w.element,J="button"in v&&v.button===2;if(!w.hasMoved&&!J&&T&&w.selector&&w.elementInfo){T instanceof HTMLElement&&T.style.removeProperty("transition");let P=["space-between","space-around","stretch","normal"],F=w.originalJustifyContent||"normal",$=P.indexOf(F),_=P[($+1)%P.length],ut=[];_==="normal"?(Yt(T,"justify-content","normal"),ut.push({property:"justify-content",original:w.originalJustifyContent,modified:"normal"})):_==="stretch"?(Yt(T,"justify-content",_),Yt(T,"row-gap","8px"),Yt(T,"column-gap","8px"),ut.push({property:"justify-content",original:w.originalJustifyContent||"normal",modified:_}),w.originalRow!==8&&ut.push({property:"row-gap",original:`${w.originalRow}px`,modified:"8px"}),w.originalColumn!==8&&ut.push({property:"column-gap",original:`${w.originalColumn}px`,modified:"8px"})):(T instanceof HTMLElement&&(T.style.removeProperty("row-gap"),T.style.removeProperty("column-gap")),Yt(T,"justify-content",_),ut.push({property:"justify-content",original:w.originalJustifyContent||"normal",modified:_}),w.originalRow>0&&ut.push({property:"row-gap",original:`${w.originalRow}px`,modified:"0px"}),w.originalColumn>0&&ut.push({property:"column-gap",original:`${w.originalColumn}px`,modified:"0px"})),ut.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:w.selector,durableSelector:(B=w.durableSelector)!=null?B:void 0,element:w.elementInfo,changes:ut}})}else if(w.hasMoved&&T&&w.selector&&w.elementInfo&&Ut){T instanceof HTMLElement&&(T.style.removeProperty("row-gap"),T.style.removeProperty("column-gap"),T.style.removeProperty("transition"));let P=[];w.isAuto?(T instanceof HTMLElement&&T.style.removeProperty("justify-content"),Yt(T,"justify-content","normal"),Yt(T,"row-gap",`${Ut.row}px`),Yt(T,"column-gap",`${Ut.column}px`),P.push({property:"justify-content",original:w.originalJustifyContent,modified:"normal"}),P.push({property:"row-gap",original:"0px",modified:`${Ut.row}px`}),P.push({property:"column-gap",original:"0px",modified:`${Ut.column}px`})):(w.originalRow!==Ut.row&&(Yt(T,"row-gap",`${Ut.row}px`),P.push({property:"row-gap",original:`${w.originalRow}px`,modified:`${Ut.row}px`})),w.originalColumn!==Ut.column&&(Yt(T,"column-gap",`${Ut.column}px`),P.push({property:"column-gap",original:`${w.originalColumn}px`,modified:`${Ut.column}px`}))),P.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:w.selector,durableSelector:(H=w.durableSelector)!=null?H:void 0,element:w.elementInfo,changes:P}})}Vt.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},fe(null);return}if($e.current.isDragging){let w=$e.current,T=w.element;if(T&&w.selector&&w.elementInfo&&me){T instanceof HTMLElement&&(T.style.removeProperty("border-top-left-radius"),T.style.removeProperty("border-top-right-radius"),T.style.removeProperty("border-bottom-right-radius"),T.style.removeProperty("border-bottom-left-radius"),T.style.removeProperty("transition"));let J=["top-left","top-right","bottom-right","bottom-left"],P={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},F=[];for(let $ of J)w.original[$]!==me.radius[$]&&(Yt(T,P[$],`${me.radius[$]}px`),F.push({property:P[$],original:`${w.original[$]}px`,modified:`${me.radius[$]}px`}));F.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:w.selector,durableSelector:(at=w.durableSelector)!=null?at:void 0,element:w.elementInfo,changes:F}})}$e.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},ke(null);return}if(Ht.current.isDragging){let w=Ht.current,T=w.element,J=w.selector,P=w.elementInfo;if(T&&J&&P&&mt){let F=w.original,$=mt.padding;T instanceof HTMLElement&&(T.style.removeProperty("padding"),T.style.removeProperty("transition"));let _=[],ut=[{prop:"padding-top",origVal:F.top,newVal:$.top},{prop:"padding-right",origVal:F.right,newVal:$.right},{prop:"padding-bottom",origVal:F.bottom,newVal:$.bottom},{prop:"padding-left",origVal:F.left,newVal:$.left}];for(let{prop:kt,origVal:se,newVal:Xt}of ut)se!==Xt&&(Yt(T,kt,`${Xt}px`),_.push({property:kt,original:`${se}px`,modified:`${Xt}px`}));_.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:J,durableSelector:(D=w.durableSelector)!=null?D:void 0,element:P,changes:_}})}Ht.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},Nt(null);return}if(Gt){We(null);return}if(Q){if(!Q.hasMoved&&Q.annotation.type==="text"&&((K=Q.annotation.status)!=null?K:"pending")==="pending"){let w=Qn(v);nt({id:Q.annotation.id,point:Q.annotation.points[0],text:Q.annotation.text||"",fontSize:Q.annotation.fontSize||12,isNew:!1,clickPoint:w,groupId:Q.annotation.groupId})}jt(null);return}if(!R)return;let k=5;if(t.currentPath.length>=2){let w=t.currentPath[0],T=t.currentPath[t.currentPath.length-1],J=Math.abs(T.x-w.x),P=Math.abs(T.y-w.y);if((t.activeTool==="line"?Math.sqrt(J*J+P*P)<k:J<k&&P<k)&&["rectangle","circle","line"].includes(t.activeTool)){M(!1),e({type:"CANCEL_PATH"});return}}let q=kr(t.currentPath);if(t.activeTool==="rectangle"&&t.currentPath.length>=2){let w=t.currentPath[0],T=t.currentPath[t.currentPath.length-1],J=Math.min(w.x,T.x),P=Math.max(w.y,T.y),F=t.strokeWidth/2,$=Math.random().toString(36).substring(2,9);O({point:{x:J-F+4,y:P+F+4},groupId:$}),M(!1),e({type:"FINISH_PATH",payload:{groupId:$,elements:q}});return}M(!1),e({type:"FINISH_PATH",payload:{elements:q}})},[R,Q,Gt,mt,me,Ut,oe,Qn,e,t.activeTool,t.currentPath,t.strokeWidth]),il=Oe(v=>{let k=v.target.value;Ho.current=v.target.selectionStart,nt(q=>q&&b(m({},q),{text:k}))},[]),sl=Oe(v=>{v.key==="Escape"?nt(null):v.key==="Enter"&&!v.shiftKey&&(v.preventDefault(),to())},[to]),al=Oe(v=>{if(!C)return;let k=v.clipboardData.items,q=[];for(let E=0;E<k.length;E++){let B=k[E];if(B.type.startsWith("image/")){let H=B.getAsFile();H&&q.push(H)}}q.length>0&&(v.preventDefault(),nt(E=>E?b(m({},E),{images:[...E.images||[],...q]}):null))},[C]),ll=Oe(v=>{if(!t.isAnnotating)return;if(t.activeTool==="hand"){v.preventDefault();let q=ht||ie||we||te;if(q&&!I(q)){let E=Je(q),B=an(q);e({type:"SELECT_ELEMENT",payload:{el:q,info:b(m({},E),{selector:B})}})}return}v.preventDefault();let k=S.current;k&&(N.current=!0,k.style.pointerEvents="none",setTimeout(()=>{N.current&&(N.current=!1,k.style.pointerEvents="")},4e3))},[t.activeTool,t.isAnnotating,ht,ie,we,te,e,I,S]);je(()=>{let v=t.annotations.filter(H=>H.linkedSelector);if(v.length===0)return;let k=null,q=()=>{var at,D,K;let H=[];for(let w of v){let T=document.querySelector(w.linkedSelector);if(!T&&((D=(at=w.elements)==null?void 0:at[0])!=null&&D.selector)&&w.linkedSelector.startsWith("[data-pm=")){try{T=document.querySelector(w.elements[0].selector)}catch(Xt){}if(T){let Xt=(K=w.linkedSelector.match(/data-pm="([^"]+)"/))==null?void 0:K[1];Xt&&T.setAttribute("data-pm",Xt)}}if(!T)continue;let J=T.getBoundingClientRect(),P=t.styleModifications.some(Xt=>{try{return T.matches(Xt.selector)}catch(Ie){return!1}}),F=v.filter(Xt=>Xt.id!==w.id&&Xt.timestamp<w.timestamp&&Xt.linkedSelector===w.linkedSelector).length,$=(P?1:0)+F,_=J.top>=lo*(1+$)?"top-left":"bottom-left",ut=Da(J,_,$),kt=w.points[0],se=_!==w.linkedAnchor;kt&&(se||Math.abs(ut.x-kt.x)>1||Math.abs(ut.y-kt.y)>1)&&H.push({id:w.id,point:ut,linkedAnchor:se?_:void 0})}H.length>0&&e({type:"UPDATE_LINKED_POSITIONS",payload:{updates:H}})},E=()=>{k&&cancelAnimationFrame(k),k=requestAnimationFrame(q)};q(),window.addEventListener("scroll",E,!0),window.addEventListener("resize",E,!0),window.addEventListener("load",E),document.fonts.ready.then(E);let B=new MutationObserver(E);return B.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",E,!0),window.removeEventListener("resize",E,!0),window.removeEventListener("load",E),B.disconnect(),k&&cancelAnimationFrame(k)}},[t.annotations,e]);let cl=()=>{var v,k,q;if(!t.isAnnotating)return"default";if(Gt){let{handle:E}=Gt;return E==="start"||E==="end"?"move":E==="top"||E==="bottom"?"ns-resize":E==="left"||E==="right"?"ew-resize":E==="topLeft"||E==="bottomRight"?"nwse-resize":"nesw-resize"}if(t.activeTool==="text")return"text";if(t.activeTool==="hand"){let E=(v=Ut==null?void 0:Ut.axis)!=null?v:ne;if(E==="row")return"ns-resize";if(E==="column")return"ew-resize";if(me||Lt)return"ns-resize";let B=(k=oe==null?void 0:oe.property)!=null?k:nn;if(B==="font-size")return"ew-resize";if(B==="line-height")return"ns-resize";let H=(q=mt==null?void 0:mt.side)!=null?q:zt;return H==="top"||H==="bottom"?"ns-resize":H==="left"||H==="right"?"ew-resize":"default"}return"crosshair"},dl={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:t.isAnnotating?"auto":"none",visibility:t.isAnnotating?"visible":"hidden",cursor:cl()},ts=Oe(()=>{let v=S.current;if(!v||!C)return{width:100,height:12*1.4};let k=v.getContext("2d");if(!k)return{width:100,height:C.fontSize*1.4};k.font=`${C.fontSize}px ${ve}`;let E=k.measureText("Type here...").width,B=C.text.split(`
10
- `),H=B.length>0?Math.max(E,...B.map(D=>k.measureText(D||" ").width)):E,at=Math.max(1,B.length)*C.fontSize*1.4;return{width:H,height:at}},[C,S])(),ul=C?{position:"fixed",left:C.point.x-4-be.x,top:C.point.y-4-be.y,zIndex:9999,width:ts.width+8,height:ts.height+8,padding:4,fontSize:C.fontSize,fontFamily:ve,color:"#ffffff",backgroundColor:t.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:"pre"}:{};return ho(yo,{children:[re("canvas",{ref:S,id:"devtools-canvas",style:dl,onMouseDown:qi,onMouseMove:Qi,onMouseUp:v=>br(v),onMouseLeave:v=>br(v),onTouchStart:qi,onTouchMove:Qi,onTouchEnd:v=>br(v),onContextMenu:ll}),C&&ho(yo,{children:[re("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),re("textarea",{id:"devtools-text-input",ref:vt,value:C.text,onChange:il,onKeyDown:sl,onPaste:al,onBlur:to,placeholder:"Type here...",style:ul}),C.images&&C.images.length>0&&ho("div",{"data-devtools":!0,style:{position:"fixed",left:C.point.x-4-be.x,top:C.point.y-4-be.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"]})]}),t.isAnnotating&&t.activeTool!=="hand"&&t.styleModifications.length>0&&re(pa,{styleModifications:t.styleModifications,isInspecting:!!t.inspectedElement,accentColor:t.activeColor,annotationGroupCount:new Set(t.annotations.map(v=>v.groupId||v.id)).size,dispatch:e,inFlightSelectors:r}),t.activeTool==="hand"&&t.isAnnotating&&t.styleModifications.length>0&&re(ga,{styleModifications:t.styleModifications,accentColor:t.activeColor}),t.isAnnotating&&re(ea,{annotations:t.annotations,supersededAnnotations:Cn,inFlightIds:n,scrollX:be.x,scrollY:be.y,annotationGroupMap:ko,onViewThread:c,onSelectAnnotation:_t}),t.isAnnotating&&((l==null?void 0:l.status)==="awaiting_approval"||(l==null?void 0:l.status)==="planning")&&l.threadId&&c&&re(na,{annotations:t.annotations,supersededAnnotations:Cn,scrollX:be.x,scrollY:be.y,annotationGroupMap:ko,planThreadId:l.threadId,taskCount:(os=(ns=l.tasks)==null?void 0:ns.length)!=null?os:0,planStatus:l.status,onViewThread:c,onSelectAnnotation:_t}),t.isAnnotating&&s&&re(oa,{annotations:t.annotations,supersededAnnotations:Cn,scrollX:be.x,scrollY:be.y,onReply:s,annotationGroupMap:ko}),t.isAnnotating&&i&&i.size>0&&re(Kr,{inFlightSelectorColors:i}),t.isAnnotating&&Ji&&re(Kr,{inFlightSelectorColors:Ji,animated:!1}),t.activeTool==="hand"&&t.isAnnotating&&(Ut?Vt.current.element:ie)&&re(ti,{element:Ut?Vt.current.element:ie,gap:Ut?{row:Ut.row,column:Ut.column}:Mo(ie),accentColor:t.activeColor,hoveredAxis:ne,draggingAxis:(rs=Ut==null?void 0:Ut.axis)!=null?rs:null,cursorViewport:xt,isAutoGap:Ge,refreshKey:Ue}),t.activeTool==="hand"&&t.isAnnotating&&_e&&re(Pa,{element:_e.target,modifier:_e.modifier,accentColor:t.activeColor,refreshKey:Ue}),t.activeTool==="hand"&&t.isAnnotating&&!_e&&(me?$e.current.element:we)&&re(la,{element:me?$e.current.element:we,radius:(is=me==null?void 0:me.radius)!=null?is:jn(we),accentColor:t.activeColor,hoveredCorner:Lt,draggingCorner:(ss=me==null?void 0:me.corner)!=null?ss:null,cursorViewport:xt}),t.activeTool==="hand"&&t.isAnnotating&&!_e&&(oe?ce.current.element:te)&&re(Na,{element:oe?ce.current.element:te,fontSize:(as=oe==null?void 0:oe.fontSize)!=null?as:Io(te).fontSize,lineHeight:(ls=oe==null?void 0:oe.lineHeight)!=null?ls:Io(te).lineHeight,accentColor:t.activeColor,hoveredProperty:nn,draggingProperty:(cs=oe==null?void 0:oe.property)!=null?cs:null,cursorViewport:xt}),t.activeTool==="hand"&&t.isAnnotating&&!_e&&(mt?Ht.current.element:ht)&&re(si,{element:mt?Ht.current.element:ht,padding:(ds=mt==null?void 0:mt.padding)!=null?ds:io(ht),accentColor:t.activeColor,hoveredSide:zt,draggingSide:(us=mt==null?void 0:mt.side)!=null?us:null,cursorViewport:xt,refreshKey:oe?oe.fontSize+oe.lineHeight*1e3:0}),t.activeTool==="inspector"&&t.isAnnotating&&re(yo,{children:lt&&!t.inspectedElement&&(()=>{let v=!!tt||!!(C!=null&&C.linkedSelector)||t.annotations.some(k=>{if(!k.linkedSelector)return!1;try{return lt.matches(k.linkedSelector)}catch(q){return!1}});return re(co,{element:lt,isSelected:!1,elementInfo:Y,color:t.activeColor,hideTooltip:v})})()}),t.activeTool==="model"&&t.isAnnotating&&St.size>0&&[...St.entries()].map(([v,k])=>re(co,{element:k.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:k.rootElement.tagName.toLowerCase(),reactComponent:v},color:"#8b5cf6"},v)),t.activeTool==="model"&&t.isAnnotating&&Ye&&re(co,{element:Ye.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:Ye.rootElement.tagName.toLowerCase(),reactComponent:Ye.name},color:"#22c55e"}),t.activeTool==="model"&&t.isAnnotating&&Xi.length>0&&Xi.map((v,k)=>re("div",{style:{position:"absolute",left:v.x,top:v.y,width:v.width,height:v.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:v.direction==="vertical"?ho(yo,{children:[re("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),re("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),re("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),re("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:v.height<16?-6:"50%",transform:v.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(v.height)})]}):ho(yo,{children:[re("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),re("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),re("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),re("div",{style:{position:"absolute",left:v.width<30?0:"50%",top:(v.width<30,void 0),bottom:"calc(50% + 4px)",transform:v.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(v.width)})]})},k)),t.activeTool==="model"&&t.isAnnotating&&At&&re(co,{element:At.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:At.rootElement.tagName.toLowerCase(),reactComponent:At.name},color:f!=null&&f.has(At.name)?"#22c55e":"#8b5cf6"}),t.activeTool==="hand"&&t.isAnnotating&&t.inspectedElement&&ho(yo,{children:[it&&it!=="padding"&&it!=="gap"&&(()=>{var D;let v=new Set(t.annotations.map(K=>K.groupId||K.id)).size,k=t.inspectedElement.info.selector,q=t.styleModifications.findIndex(K=>K.selector===k),E=q>=0?v+q+1:v+t.styleModifications.length+1,B=t.styleModifications.find(K=>K.selector===k),H=(D=B==null?void 0:B.changes.length)!=null?D:0,at=!!(B!=null&&B.captured);return re(co,{element:t.inspectedElement.el,isSelected:!0,elementInfo:t.inspectedElement.info,color:at?"#999999":t.activeColor,annotationNumber:E,changeCount:H})})(),it==="padding"&&re(si,{element:t.inspectedElement.el,padding:io(t.inspectedElement.el),accentColor:t.activeColor,hoveredSide:null,draggingSide:null}),it==="gap"&&re(ti,{element:t.inspectedElement.el,gap:Mo(t.inspectedElement.el),accentColor:t.activeColor,hoveredAxis:null,draggingAxis:null}),re(Ra,{element:t.inspectedElement.el,elementInfo:t.inspectedElement.info,selector:t.inspectedElement.info.selector,styleModifications:t.styleModifications,dispatch:e,onClose:()=>e({type:"SELECT_ELEMENT",payload:null}),onHover:ct,accentColor:t.activeColor})]})]})}import{useCallback as dn,useEffect as yn,useMemo as Ti,useRef as Re,useState as Bo}from"react";import{Circle as Su,Component as wu,Hand as ku,MessageCircle as Cu,Pen as Eu,Slash as Tu,Square as Mu,Trash2 as Iu,Type as Lu}from"lucide-react";import{useEffect as Ud,useRef as Zd}from"react";function Fa(t,e,o,n,r){let i=Zd(0);Ud(()=>{if(!o.current||(localStorage.setItem(r.expanded,String(t)),!t))return;let a=e.annotations.length;(a>=i.current||a===0||!n)&&(localStorage.setItem(r.annotations,JSON.stringify(e.annotations)),i.current=a),localStorage.setItem(r.styleMods,JSON.stringify(e.styleModifications)),localStorage.setItem(r.spacingChanges,JSON.stringify(e.spacingTokenChanges)),localStorage.setItem(r.tool,e.activeTool),localStorage.setItem(r.color,e.activeColor),localStorage.setItem(r.stroke,String(e.strokeWidth)),e.inspectedElement?localStorage.setItem(r.inspected,JSON.stringify({selector:e.inspectedElement.info.selector,info:e.inspectedElement.info})):localStorage.removeItem(r.inspected)},[t,e.annotations,e.styleModifications,e.spacingTokenChanges,e.activeTool,e.activeColor,e.strokeWidth,e.inspectedElement,n,o,r])}import{Component as qd,createElement as Qd,useCallback as pr,useEffect as xo,useRef as bo,useState as hn}from"react";import{Fragment as vo,jsx as Wt,jsxs as qe}from"react/jsx-runtime";var Ha="popmelt-library-tab",tu=/^#[0-9a-fA-F]{3,8}$/,eu=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,nu=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),ou=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function za(t){let e=t.trim();return tu.test(e)||eu.test(e)||nu.has(e.toLowerCase())}function ru(t){return ou.test(t.trim())}function iu(t){let e=t.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return e?parseFloat(e[1]):null}function ki(t,e=""){if(t==null)return[];if(typeof t!="object")return[[e,String(t)]];if(Array.isArray(t))return[[e,t.map(String).join(", ")]];let o=[];for(let[n,r]of Object.entries(t)){let i=e?`${e}.${n}`:n;if(r!==null&&typeof r=="object"&&!Array.isArray(r)){let a=r;typeof a.value=="string"?o.push([i,a.value]):o.push(...ki(r,i))}else o.push([i,Array.isArray(r)?r.map(String).join(", "):String(r!=null?r:"")])}return o}function su(t){return t.length===0?"generic":t.filter(([,n])=>za(n)).length>t.length/2?"colors":t.filter(([,n])=>ru(n)).length>t.length/2?"spacing":"generic"}var au=b(m({position:"fixed",top:16,right:16,bottom:80,width:300,backgroundColor:"#ffffff"},fn),{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"}),_a={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},lu=b(m({},_a),{color:"#1f2937",borderBottom:"1.5px solid #1f2937"});function cu({entries:t}){let e=[],o=[];for(let n of t)za(n[1])?e.push(n):o.push(n);return qe(vo,{children:[e.length>0&&Wt("div",{style:{display:"flex",flexWrap:"wrap",gap:2,marginBottom:o.length>0?6:0},children:e.map(([n,r])=>Wt("div",{title:`${n.split(".").pop()}: ${r}`,style:{width:28,height:28,backgroundColor:r,outline:"1px solid rgba(0,0,0,0.08)",outlineOffset:-1}},n))}),o.length>0&&Wt(Ci,{entries:o})]})}var ur=[0,1,2,4,8,12,16,20,24,28,32];function du(t){if(t<=32){let e=ur[0],o=Math.abs(t-e);for(let n=1;n<ur.length;n++){let r=Math.abs(t-ur[n]);r<o&&(e=ur[n],o=r)}return e}return Math.round(t/8)*8}function uu({label:t,value:e,px:o,tokenPath:n,rawToken:r,onHover:i,onModify:a,onDelete:s}){let[c,l]=hn(!1),[d,u]=hn(null),p=bo(!1),f=bo(0),g=bo(0),y=bo([]),S=d!==null?d:o,x=d!==null?`${d}px`:e,L=d!==null,N=pr(M=>{M.preventDefault(),p.current=!0,f.current=M.clientX,g.current=o;let C=Xo(r);y.current=Tr(C);let nt=G=>{let U=G.clientX-f.current,O=Math.max(0,Math.round(g.current+U));G.shiftKey&&(O=du(O));for(let tt of y.current)tt.element.style.setProperty(tt.property,O+"px","important");u(O),i==null||i({name:t,px:O,token:C})},j=()=>{window.removeEventListener("mousemove",nt),window.removeEventListener("mouseup",j),document.body.style.cursor="",p.current=!1,u(G=>{if(G!==null&&G!==o&&a){let U=Xo(r),O=U.bindings&&U.bindings.length>0,tt;if(O){let bt=Ir(U.bindings,g.current,G);tt=JSON.stringify(b(m({},U),{value:`${G}px`,bindings:bt}))}else{let bt=Ds(y.current,g.current),Dt=Os(y.current);if(bt.length>0){let Ot=Ir(bt,g.current,G);tt=JSON.stringify({value:`${G}px`,property:Dt,bindings:Ot})}else tt=`${G}px`}let et=typeof r=="string"?r:JSON.stringify(r),vt=y.current.map(bt=>({selector:an(bt.element),property:bt.property})),dt=Hs(y.current,g.current,G);a({tokenPath:n,originalValue:et,currentValue:tt,targets:vt,originalPx:g.current,currentPx:G},{id:Math.random().toString(36).substring(2,9),tokenPath:n,tokenName:t,originalPx:g.current,newPx:G,affectedElements:dt})}return G})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",nt),window.addEventListener("mouseup",j)},[o,t,n,r,i,a]),R=Xo(r);return qe("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",fontSize:11,padding:"1px 0",cursor:"ew-resize",userSelect:"none"},onMouseEnter:()=>{p.current||(l(!0),i==null||i({name:t,px:S,token:R}))},onMouseLeave:()=>{p.current||(l(!1),i==null||i(null))},onMouseDown:N,children:[Wt("span",{style:{color:c||L?"#FF0000":"#9ca3af"},children:t}),qe("span",{style:{display:"flex",alignItems:"center",gap:4},children:[Wt("span",{style:{color:c||L?"#FF0000":"#6b7280",fontWeight:600},children:x}),s&&c&&!L&&Wt("button",{type:"button",title:"Remove token",onMouseDown:M=>{M.stopPropagation();let C=typeof r=="string"?r:JSON.stringify(r);s(n,C)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:M=>{M.currentTarget.style.color="#FF0000"},onMouseLeave:M=>{M.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function pu({entries:t,categoryKey:e,rawTokens:o,onHover:n,onModify:r,onDelete:i}){let a=[],s=[];for(let c of t){let l=iu(c[1]);l!==null?a.push([c[0],c[1],l]):s.push(c)}return qe(vo,{children:[a.length>0&&Wt("div",{style:{display:"flex",flexDirection:"column",gap:2},children:a.map(([c,l,d])=>{let u=c.split(".").pop(),p=o?fu(o,c):l,f=p&&typeof p=="object"&&"value"in p?p:l;return Wt(uu,{label:u,value:l,px:d,tokenPath:`tokens.${e}.${c}`,rawToken:f,onHover:n,onModify:r,onDelete:i},c)})}),s.length>0&&Wt(Ci,{entries:s})]})}function fu(t,e){let o=e.split("."),n=t;for(let r of o){if(n==null||typeof n!="object")return;n=n[r]}return n}function Ci({entries:t}){return Wt("div",{style:{display:"flex",flexDirection:"column",gap:3},children:t.map(([e,o])=>qe("div",{style:{fontSize:11},children:[Wt("div",{style:{color:"#9ca3af",fontSize:10,marginBottom:1},children:e}),Wt("div",{style:{color:"#1f2937",lineHeight:1.4,paddingLeft:8},children:o})]},e))})}function $a({entries:t,categoryKey:e,rawTokens:o,onSpacingHover:n,onModifyToken:r,onDeleteToken:i}){let a=su(t);return a==="colors"?Wt(cu,{entries:t}):a==="spacing"?Wt(pu,{entries:t,categoryKey:e,rawTokens:o,onHover:n,onModify:r,onDelete:i}):Wt(Ci,{entries:t})}function gu(t){let e=t.toLowerCase(),o=null,n=document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT,{acceptNode(i){return i.closest("#devtools-toolbar, #devtools-canvas, #devtools-scrim, [data-popmelt-panel]")?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}}),r=n.currentNode;for(;r=n.nextNode();){let i=r,a=Object.keys(i).find(c=>c.startsWith("__reactFiber$")||c.startsWith("__reactInternalInstance$"));if(!a)continue;let s=i[a];for(;s;){let c=s.type,l=typeof c=="function"||typeof c=="object"?(c==null?void 0:c.displayName)||(c==null?void 0:c.name):null;if(typeof l=="string"){let d=l.toLowerCase();if(d===e){let u=m({},s.memoizedProps);return delete u.ref,{type:c,props:u}}if(!o){if(d.length>=4&&e.includes(d)){let u=m({},s.memoizedProps);delete u.ref,o={type:c,props:u}}else if(e.length>=4&&d.includes(e)){let u=m({},s.memoizedProps);delete u.ref,o={type:c,props:u}}}}s=s.return}}return o}var wi=class extends qd{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 mu({children:t}){return Wt("div",{style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:6},children:t})}function hu({tokens:t,onSpacingTokenHover:e,onModifyToken:o,onDeleteToken:n}){return!t||Object.keys(t).length===0?Wt("div",{style:{color:"#9ca3af",fontSize:11},children:"No tokens defined yet."}):Wt(vo,{children:Object.entries(t).map(([r,i])=>qe("div",{style:{marginBottom:14},children:[Wt(mu,{children:r}),Wt($a,{entries:ki(i),categoryKey:r,rawTokens:i,onSpacingHover:e,onModifyToken:o,onDeleteToken:n})]},r))})}function yu({rules:t}){return!t||t.length===0?Wt("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."}):Wt(vo,{children:t.map((e,o)=>qe("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[qe("span",{style:{color:"#9ca3af",flexShrink:0},children:[o+1,"."]}),Wt("span",{children:e})]},o))})}function bu({name:t,value:e,selected:o,highlighted:n,onRemove:r,onHover:i}){var G;let[a,s]=hn(!1),[c,l]=hn(!1),d=bo(null),u=bo(0),[p,f]=hn(0),[g,y]=hn(0),S=ki(e),x=(G=S.find(([U])=>U==="description"))==null?void 0:G[1];xo(()=>{if(!c&&!n){f(0),y(0),u.current=0;return}let U=oo(t);f(U.length)},[c,n,t]),xo(()=>{o&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[o]);let L=o||n||c,N=o?"139,92,246":"34,197,94",R=o?"#8b5cf6":"#22c55e",M=L?`rgba(${N},0.06)`:void 0,C=L?`inset 0 0 0 1.5px rgba(${N},0.35)`:void 0,nt=n||c,j=pr(()=>{let U=oo(t);if(U.length===0)return;let O=u.current%U.length;U[O].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),y(O),u.current=O+1,i==null||i({name:t,instanceIndex:O})},[t,i]);return qe("div",{ref:d,onClick:j,onMouseEnter:()=>{l(!0),i==null||i({name:t,instanceIndex:0})},onMouseLeave:()=>{l(!1),i==null||i(null)},style:{marginBottom:8,background:M,padding:6,boxShadow:C,cursor:"pointer"},children:[qe("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[qe("div",{style:{display:"flex",alignItems:"center",gap:6,marginBottom:6},children:[Wt("div",{style:{fontWeight:700,fontSize:11,letterSpacing:"0.05em",padding:"2px 6px",backgroundColor:nt?R:"transparent",color:nt?"#fff":"#6b7280"},children:t}),nt&&p>1&&qe("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[g+1,"/",p]})]}),r&&c&&Wt("button",{type:"button",title:"Remove from model",onClick:U=>{U.stopPropagation(),r(t)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:U=>{U.currentTarget.style.color="#FF0000"},onMouseLeave:U=>{U.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),x&&Wt("div",{style:{fontSize:11,color:nt?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:x}),a?Wt($a,{entries:S.filter(([U])=>U!=="description"),categoryKey:""}):Wt(xu,{name:t,onNotFound:()=>s(!0),entries:S})]})}function xu({name:t,onNotFound:e}){let[o,n]=hn(null),[r,i]=hn(!1);return xo(()=>{let a=gu(t);a||e(),n(a),i(!0)},[t,e]),!r||!o?null:Wt(wi,{onError:e,children:Wt("div",{"data-popmelt-panel":!0,onClick:a=>{a.preventDefault(),a.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"},children:Wt("div",{style:{zoom:.5},children:Qd(o.type,o.props)})})})}function vu({components:t,selectedComponent:e,hoveredComponent:o,onRemove:n,onHover:r}){if(!t||Object.keys(t).length===0)return Wt("div",{style:{color:"#9ca3af",fontSize:11},children:"No component patterns defined yet."});let i=new Set(Object.keys(t)),a=wr(i),s=Object.entries(t).sort(([c],[l])=>{var d,u;return((d=a.get(c))!=null?d:1/0)-((u=a.get(l))!=null?u:1/0)});return Wt(vo,{children:s.map(([c,l])=>Wt(bu,{name:c,value:l,selected:e===c,highlighted:o===c,onRemove:n,onHover:r},c))})}function Wa({bridgeUrl:t,modelRefreshKey:e,onMouseEnter:o,onMouseLeave:n,selectedComponent:r,hoveredComponent:i,onComponentHover:a,onSpacingTokenHover:s,onModifySpacingToken:c,onDeleteSpacingToken:l,onComponentAdded:d,onComponentRemoved:u}){let[p,f]=hn(void 0),[g,y]=hn(!0),[S,x]=hn(()=>{try{let O=localStorage.getItem(Ha);if(O==="tokens"||O==="components"||O==="rules")return O}catch(O){}return"components"});xo(()=>{eo(t).then(O=>{f(O),y(!1)})},[t,e]),xo(()=>{try{localStorage.setItem(Ha,S)}catch(O){}},[S]),xo(()=>{r&&(x("components"),eo(t).then(O=>{O&&f(O)}))},[r,t]);let L=pr((O,tt)=>{f(et=>{if(!(et!=null&&et.tokens))return et;let vt=JSON.parse(JSON.stringify(et.tokens)),dt=O.split("."),bt=vt;for(let Dt=1;Dt<dt.length-1;Dt++)if(bt=bt[dt[Dt]],!bt)return et;return delete bt[dt[dt.length-1]],b(m({},et),{tokens:vt})}),l==null||l(O,tt)},[l]),N=pr(O=>{f(tt=>{if(!(tt!=null&&tt.components))return tt;let dt=tt.components,{[O]:et}=dt,vt=Bn(dt,[Wo(O)]);return b(m({},tt),{components:vt})}),u==null||u(O)},[u]),R=p==null?void 0:p.tokens,M=p==null?void 0:p.components,C=p==null?void 0:p.rules,nt=R&&Object.keys(R).length>0,j=M&&Object.keys(M).length>0,G=C&&C.length>0,U=!p||!nt&&!j&&!G;return qe("div",{style:au,onMouseEnter:o,onMouseLeave:n,children:[qe("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[Wt("span",{children:"Model"}),Wt("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"M"})]}),Wt("div",{style:{display:"flex",gap:12,marginBottom:10,borderBottom:"1px solid rgba(0,0,0,0.08)",paddingBottom:6},children:["components","rules"].map(O=>Wt("button",{type:"button",style:S===O?lu:_a,onClick:()=>x(O),children:O.charAt(0).toUpperCase()+O.slice(1)},O))}),Wt("div",{style:{flex:1,overflowY:"auto",minHeight:0},children:g?Wt("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):U?Wt("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):qe(vo,{children:[S==="components"&&Wt(vu,{components:M,selectedComponent:r,hoveredComponent:i,onRemove:N,onHover:a}),S==="tokens"&&Wt(hu,{tokens:R,onSpacingTokenHover:s,onModifyToken:c,onDeleteToken:l?L:void 0}),S==="rules"&&Wt(yu,{rules:C})]})})]})}import{jsx as Ya}from"react/jsx-runtime";var Rn={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#f3f4f6",bgHover:"#f9fafb",separator:"#e5e7eb"};function An({children:t,active:e,siblingActive:o,disabled:n,onClick:r,title:i}){let a=()=>n?.4:o&&!e?.5:1,s={position:"relative",display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,borderRadius:0,border:"none",cursor:n?"default":"pointer",transition:"background-color 150ms ease, color 150ms ease, transform 100ms ease, opacity 150ms ease",backgroundColor:e?Rn.bgActive:"transparent",color:e?Rn.iconActive:Rn.iconDefault,opacity:a()};return Ya("button",{type:"button",onClick:n?void 0:r,title:i,disabled:n,style:s,onMouseEnter:c=>{n||(c.currentTarget.style.opacity="1",e||(c.currentTarget.style.backgroundColor=Rn.bgHover))},onMouseLeave:c=>{n||(c.currentTarget.style.opacity=String(a()),e||(c.currentTarget.style.backgroundColor="transparent"))},onMouseDown:c=>{n||(c.currentTarget.style.transform="scale(0.95)")},onMouseUp:c=>{n||(c.currentTarget.style.transform="scale(1)")},children:t})}function Ei(){return Ya("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as Un,jsx as st,jsxs as xe}from"react/jsx-runtime";var Zn=[{type:"rectangle",icon:Mu,label:"Rectangle",shortcut:"R"},{type:"circle",icon:Su,label:"Oval",shortcut:"O"},{type:"line",icon:Tu,label:"Line",shortcut:"L"},{type:"freehand",icon:Eu,label:"Pen",shortcut:"P"}],Ru=new Set(Zn.map(t=>t.type));function Au(t,e,o,n,r,i,a,s){let c=(t-r)*(n-i)-(o-r)*(e-i),l=(t-a)*(i-s)-(r-a)*(e-s),d=(t-o)*(s-n)-(a-o)*(e-n),u=c<0||l<0||d<0,p=c>0||l>0||d>0;return!(u&&p)}function Pu(){let t=window.innerWidth-16,e=t-326,o=window.innerHeight-80;return{left:e,right:t,y:o}}var Nu=[{type:"text",icon:Lu,label:"Text",shortcut:"T"}],ja={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 Sl=Object.defineProperty,wl=Object.defineProperties;var kl=Object.getOwnPropertyDescriptors;var Yo=Object.getOwnPropertySymbols;var bs=Object.prototype.hasOwnProperty,xs=Object.prototype.propertyIsEnumerable;var ys=(t,e,o)=>e in t?Sl(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,m=(t,e)=>{for(var o in e||(e={}))bs.call(e,o)&&ys(t,o,e[o]);if(Yo)for(var o of Yo(e))xs.call(e,o)&&ys(t,o,e[o]);return t},y=(t,e)=>wl(t,kl(e));var jo=t=>typeof t=="symbol"?t:t+"",Dn=(t,e)=>{var o={};for(var n in t)bs.call(t,n)&&e.indexOf(n)<0&&(o[n]=t[n]);if(t!=null&&Yo)for(var n of Yo(t))e.indexOf(n)<0&&xs.call(t,n)&&(o[n]=t[n]);return o};import{createContext as wp,useCallback as Pe,useContext as kp,useEffect as Te,useMemo as Co,useRef as tn,useState as Ue}from"react";import{useCallback as Ci,useEffect as Cl,useSyncExternalStore as El}from"react";var rn="http://localhost:1111";async function vs(t=rn){try{let e=await fetch(`${t}/capabilities`);return e.ok?await e.json():null}catch(e){return null}}async function Go(t=rn){try{let e=new AbortController,o=setTimeout(()=>e.abort(),2e3),n=await fetch(`${t}/status`,{signal:e.signal});return clearTimeout(o),n.ok?await n.json():null}catch(e){return null}}async function Ss(t,e,o=rn,n,i,r,s){let a=new FormData;if(a.append("screenshot",t,"screenshot.png"),a.append("feedback",e),n&&a.append("color",n),i&&a.append("provider",i),r&&a.append("model",r),s)for(let[c,d]of s)for(let u=0;u<d.length;u++)a.append(`image-${c}-${u}`,d[u],`image-${c}-${u}.png`);let l=await fetch(`${o}/send`,{method:"POST",body:a});if(!l.ok){let c=await l.text();throw new Error(`Bridge returned ${l.status}: ${c}`)}return l.json()}async function ws(t,e,o=rn,n,i,r,s,a,l){let c=new FormData;c.append("screenshot",t,"screenshot.png"),c.append("goal",e),r&&c.append("pageUrl",r),s&&c.append("viewport",JSON.stringify(s)),n&&c.append("provider",n),i&&c.append("model",i),a&&c.append("manifest",JSON.stringify(a)),l&&c.append("feedback",l);let d=await fetch(`${o}/plan`,{method:"POST",body:c});if(!d.ok){let u=await d.text();throw new Error(`Bridge returned ${d.status}: ${u}`)}return d.json()}async function ks(t,e=rn,o){let n=await fetch(`${e}/plan/approve`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({planId:t,approvedTaskIds:o})});if(!n.ok){let i=await n.text();throw new Error(`Bridge returned ${n.status}: ${i}`)}return n.json()}async function Cs(t,e,o=rn,n,i){let r=new FormData;r.append("screenshot",e,"screenshot.png"),r.append("planId",t),n&&r.append("provider",n),i&&r.append("model",i);let s=await fetch(`${o}/plan/review`,{method:"POST",body:r});if(!s.ok){let a=await s.text();throw new Error(`Bridge returned ${s.status}: ${a}`)}return s.json()}async function Es(t,e,o,n=rn,i,r){let s=new FormData;s.append("screenshot",t,"screenshot.png"),s.append("planId",e),s.append("tasks",JSON.stringify(o)),i&&s.append("provider",i),r&&s.append("model",r);let a=await fetch(`${n}/plan/execute`,{method:"POST",body:s});if(!a.ok){let l=await a.text();throw new Error(`Bridge returned ${a.status}: ${l}`)}return a.json()}async function Ts(t=rn,e){try{let o=await fetch(`${t}/mcp/install`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e?{serverUrl:e}:{})});return o.ok?await o.json():null}catch(o){return null}}async function Ms(t,e=rn){let o=await fetch(`${e}/model/component`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:t})});if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function Is(t,e=rn){let o=await fetch(`${e}/model/component`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:t})});if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function ki(t,e,o=rn){let n=await fetch(`${o}/model/token`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:t,value:e})});if(!n.ok){let i=await n.text();throw new Error(`Bridge returned ${n.status}: ${i}`)}return n.json()}async function Ls(t,e=rn){let o=await fetch(`${e}/model/token`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:t})});if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function no(t=rn){var e;try{let o=await fetch(`${t}/model`);return o.ok&&(e=(await o.json()).model)!=null?e:null}catch(o){return null}}async function Rs(t,e,o=rn,n,i,r,s){let a;if(s&&s.length>0){let l=new FormData,c=new Blob([new Uint8Array([137,80,78,71,13,10,26,10,0,0,0,13,73,72,68,82,0,0,0,1,0,0,0,1,8,6,0,0,0,31,21,196,137,0,0,0,10,73,68,65,84,120,156,98,0,0,0,2,0,1,229,39,222,252,0,0,0,0,73,69,78,68,174,66,96,130])],{type:"image/png"});l.append("screenshot",c,"screenshot.png"),l.append("feedback",JSON.stringify({threadId:t,reply:e,color:n,provider:i,model:r}));for(let d=0;d<s.length;d++)l.append(`image-reply-${d}`,s[d],`reply-image-${d}.png`);a=await fetch(`${o}/reply`,{method:"POST",body:l})}else a=await fetch(`${o}/reply`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({threadId:t,reply:e,color:n,provider:i,model:r})});if(!a.ok){let l=await a.text();throw new Error(`Bridge returned ${a.status}: ${l}`)}return a.json()}var Tl={isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,pendingQuestions:[],pendingPlans:[],planReviews:[],incrementalResolutions:[]},Xo=m({},Tl),Ei=new Set,oo=null,As=null,Vo=null;function Ps(){return Xo}function Ml(t){return Ei.add(t),()=>{Ei.delete(t)}}function je(t){Xo=t(Xo);for(let e of Ei)e()}function Bs(t){if(oo&&oo.readyState!==EventSource.CLOSED&&As===t)return;oo&&(oo.close(),oo=null),Vo&&(clearTimeout(Vo),Vo=null),As=t;let e=new EventSource(`${t}/events`);oo=e,e.addEventListener("connected",()=>{Go(t).then(o=>{var r;let n=(r=o==null?void 0:o.activeJobs)!=null?r:o!=null&&o.activeJob?[o.activeJob]:[],i=n.length>0;je(s=>y(m({},s),{isConnected:!0,status:i?"streaming":"idle",activeJobId:i?n[n.length-1].id:s.activeJobId,activeJobIds:n.map(a=>a.id)}))})}),e.addEventListener("job_started",o=>{let n=JSON.parse(o.data),i=n.jobId;je(r=>y(m({},r),{status:"streaming",activeJobId:i,activeJobIds:[...r.activeJobIds,i],jobResponses:y(m({},r.jobResponses),{[i]:""}),jobThinking:y(m({},r.jobThinking),{[i]:""}),currentResponse:"",currentThinking:"",lastResponseText:null,lastThreadId:null,events:[...r.events,{type:"job_started",data:n,timestamp:Date.now()}]}))}),e.addEventListener("delta",o=>{let n=JSON.parse(o.data),i=n.jobId,r=n.text||"";je(s=>y(m({},s),{jobResponses:i?y(m({},s.jobResponses),{[i]:(s.jobResponses[i]||"")+r}):s.jobResponses,currentResponse:!i||i===s.activeJobId?s.currentResponse+r:s.currentResponse,events:[...s.events,{type:"delta",data:n,timestamp:Date.now()}]}))}),e.addEventListener("thinking",o=>{let n=JSON.parse(o.data),i=n.jobId,r=n.text||"";je(s=>y(m({},s),{jobThinking:i?y(m({},s.jobThinking),{[i]:(s.jobThinking[i]||"")+r}):s.jobThinking,currentThinking:!i||i===s.activeJobId?s.currentThinking+r:s.currentThinking,events:[...s.events,{type:"thinking",data:n,timestamp:Date.now()}]}))}),e.addEventListener("tool_use",o=>{let n=JSON.parse(o.data);je(i=>y(m({},i),{events:[...i.events,{type:"tool_use",data:n,timestamp:Date.now()}]}))}),e.addEventListener("done",o=>{let n=JSON.parse(o.data),i=n.jobId;je(r=>{var u;let s=i?r.activeJobIds.filter(p=>p!==i):r.activeJobIds,a=m({},r.jobResponses),l=m({},r.jobThinking),c=i?a[i]:void 0;i&&(delete a[i],delete l[i]);let d=i===r.activeJobId?s.length>0?s[s.length-1]:null:r.activeJobId;return y(m(y(m({},r),{activeJobIds:s,activeJobId:d,jobResponses:a,jobThinking:l,lastCompletedJobId:i!=null?i:r.activeJobId,lastResponseText:c||r.currentResponse||n.responseText||null,lastThreadId:(u=n.threadId)!=null?u:null}),i===r.activeJobId?{currentResponse:d&&a[d]||"",currentThinking:d&&l[d]||""}:{}),{events:[...r.events,{type:"done",data:n,timestamp:Date.now()}]})})}),e.addEventListener("question",o=>{let n=JSON.parse(o.data);je(i=>y(m({},i),{pendingQuestions:[...i.pendingQuestions,{jobId:n.jobId,threadId:n.threadId,question:n.question,annotationIds:n.annotationIds,timestamp:Date.now()}],events:[...i.events,{type:"question",data:n,timestamp:Date.now()}]}))}),e.addEventListener("plan_ready",o=>{let n=JSON.parse(o.data);je(i=>y(m({},i),{pendingPlans:[...i.pendingPlans,{jobId:n.jobId,planId:n.planId,tasks:n.tasks,threadId:n.threadId,timestamp:Date.now()}],events:[...i.events,{type:"plan_ready",data:n,timestamp:Date.now()}]}))}),e.addEventListener("plan_review",o=>{let n=JSON.parse(o.data);je(i=>y(m({},i),{planReviews:[...i.planReviews,{planId:n.planId,verdict:n.verdict,summary:n.summary,issues:n.issues,timestamp:Date.now()}],events:[...i.events,{type:"plan_review",data:n,timestamp:Date.now()}]}))}),e.addEventListener("task_resolved",o=>{var r;let n=JSON.parse(o.data),i=(r=n.resolutions)!=null?r:[];je(s=>y(m({},s),{incrementalResolutions:[...s.incrementalResolutions,...i],events:[...s.events,{type:"task_resolved",data:n,timestamp:Date.now()}]}))}),e.addEventListener("queue_drained",()=>{je(o=>y(m({},o),{status:o.status==="error"?"error":"idle",activeJobId:null,activeJobIds:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},incrementalResolutions:[]}))}),e.addEventListener("error",o=>{var n;if(e.readyState===EventSource.CLOSED)je(i=>y(m({},i),{isConnected:!1,status:"disconnected"})),Vo=setTimeout(()=>{Go(t).then(i=>{i&&Bs(t)})},5e3);else if(o instanceof MessageEvent){let i=JSON.parse(o.data),r=(n=i.jobId)!=null?n:null;je(s=>{let a=r?s.activeJobIds.filter(c=>c!==r):s.activeJobIds,l=a.length>0?s.status:"error";return y(m({},s),{status:l,activeJobIds:a,lastCompletedJobId:r!=null?r:s.activeJobId,events:[...s.events,{type:"error",data:i,timestamp:Date.now()}]})})}}),e.onerror=()=>{e.readyState===EventSource.CLOSED&&je(o=>y(m({},o),{isConnected:!1,status:"disconnected"}))}}function Ns(t="http://localhost:1111"){let e=El(Ml,Ps,Ps);Cl(()=>{Go(t).then(r=>{r&&Bs(t)})},[t]);let o=Ci(()=>{je(()=>y(m({},Xo),{events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,incrementalResolutions:[]}))},[]),n=Ci(r=>{je(s=>y(m({},s),{pendingQuestions:s.pendingQuestions.filter(a=>a.threadId!==r)}))},[]),i=Ci(r=>{je(s=>y(m({},s),{pendingPlans:s.pendingPlans.filter(a=>a.planId!==r)}))},[]);return y(m({},e),{clearEvents:o,dismissQuestion:n,dismissPlan:i})}import{useEffect as Il,useReducer as Ll}from"react";var Rl={isAnnotating:!1,activeTool:"inspector",activeColor:"#ff0000",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function io(){return Math.random().toString(36).substring(2,9)}function Ds(t){return t.status?t:t.captured?y(m({},t),{status:"in_flight"}):y(m({},t),{status:"pending"})}function qe(t){return y(m({},t),{undoStack:[...t.undoStack,{annotations:t.annotations,styleModifications:t.styleModifications,spacingTokenMods:t.spacingTokenMods}],redoStack:[]})}function Al(t,e){return y(m({},t),{isAnnotating:e})}function Pl(t,e){return y(m({},t),{activeTool:e,inspectedElement:null})}function Bl(t,e){return y(m({},t),{activeColor:e})}function Nl(t,e){return y(m({},t),{strokeWidth:e})}function Dl(t,e){return y(m({},t),{currentPath:[e]})}function Ol(t,e){return y(m({},t),{currentPath:[...t.currentPath,e]})}function Fl(t){return y(m({},t),{currentPath:[]})}function Hl(t,e){if(t.currentPath.length<2&&t.activeTool!=="text")return y(m({},t),{currentPath:[]});let o={id:io(),type:t.activeTool,points:t.currentPath,color:t.activeColor,strokeWidth:t.strokeWidth,timestamp:Date.now(),status:"pending",groupId:e==null?void 0:e.groupId,elements:e==null?void 0:e.elements},n=qe(t);return y(m({},n),{annotations:[...t.annotations,o],currentPath:[]})}function zl(t,e){var i;let o=m({id:(i=e.id)!=null?i:io(),type:"text",points:[e.point],text:e.text,fontSize:e.fontSize||12,color:t.activeColor,strokeWidth:t.strokeWidth,timestamp:Date.now(),status:"pending",groupId:e.groupId,linkedSelector:e.linkedSelector,linkedAnchor:e.linkedAnchor,elements:e.elements},e.imageCount?{imageCount:e.imageCount}:{}),n=e.groupId?t:qe(t);return y(m({},n),{annotations:[...t.annotations,o]})}function _l(t,e){let o=qe(t);return y(m({},o),{annotations:t.annotations.map(n=>n.id===e.id?m(y(m({},n),{text:e.text}),e.imageCount!=null?{imageCount:e.imageCount}:{}):n)})}function $l(t,e){return y(m({},t),{annotations:t.annotations.map(o=>o.id===e.id?y(m({},o),{fontSize:Math.max(12,Math.min(72,e.fontSize))}):o)})}function Wl(t,e){let o=qe(t),n=t.annotations.find(r=>r.id===e.id),i=n==null?void 0:n.groupId;return y(m({},o),{annotations:t.annotations.filter(r=>r.id!==e.id&&!(i&&r.groupId===i))})}function Yl(t,e){let o=e.saveUndo?qe(t):t,n=t.annotations.find(r=>r.id===e.id),i=n==null?void 0:n.groupId;return y(m({},o),{annotations:t.annotations.map(r=>{if(!(r.id===e.id||i&&r.groupId===i))return r;let a=e.delta.x,l=e.delta.y;return y(m({},r),{points:r.points.map(c=>({x:c.x+a,y:c.y+l}))})})})}function jl(t,e){let o=e.saveUndo?qe(t):t,n=t.annotations.find(s=>s.id===e.id);if(!n||n.type==="text"||n.points.length<2)return t;let i=0,r=0;if(n.type==="rectangle"&&n.groupId){let s=e.points,a=Math.min(s[0].x,s[1].x),l=Math.max(s[0].y,s[1].y),c=n.points[0],d=n.points[n.points.length-1],u=Math.min(c.x,d.x),p=Math.max(c.y,d.y);i=a-u,r=l-p}return y(m({},o),{annotations:t.annotations.map(s=>s.id===e.id?y(m({},s),{points:e.points}):n.groupId&&s.groupId===n.groupId&&s.type==="text"?y(m({},s),{points:s.points.map(a=>({x:a.x+i,y:a.y+r}))}):s)})}function Gl(t,e){let o=qe(t);return y(m({},o),{annotations:[...t.annotations,...e.annotations.map(Ds)]})}function Vl(t,e){let o=new Set,n=[];for(let i of e.annotations)o.has(i.id)||(o.add(i.id),n.push(Ds(i)));return y(m({},t),{annotations:n})}function Xl(t){if(t.undoStack.length===0)return t;let e=t.undoStack[t.undoStack.length-1];return y(m({},t),{annotations:(e==null?void 0:e.annotations)||[],styleModifications:(e==null?void 0:e.styleModifications)||[],spacingTokenMods:(e==null?void 0:e.spacingTokenMods)||[],undoStack:t.undoStack.slice(0,-1),redoStack:[...t.redoStack,{annotations:t.annotations,styleModifications:t.styleModifications,spacingTokenMods:t.spacingTokenMods}]})}function Jl(t){if(t.redoStack.length===0)return t;let e=t.redoStack[t.redoStack.length-1];return y(m({},t),{annotations:(e==null?void 0:e.annotations)||[],styleModifications:(e==null?void 0:e.styleModifications)||[],spacingTokenMods:(e==null?void 0:e.spacingTokenMods)||[],redoStack:t.redoStack.slice(0,-1),undoStack:[...t.undoStack,{annotations:t.annotations,styleModifications:t.styleModifications,spacingTokenMods:t.spacingTokenMods}]})}function Kl(t,e){let{id:o,addToSelection:n}=e;if(o===null)return y(m({},t),{selectedAnnotationIds:[],lastSelectedId:null});if(n)if(t.selectedAnnotationIds.includes(o)){let r=t.selectedAnnotationIds.filter(s=>s!==o);return y(m({},t),{selectedAnnotationIds:r,lastSelectedId:r.length>0?r[r.length-1]:null})}else return y(m({},t),{selectedAnnotationIds:[...t.selectedAnnotationIds,o],lastSelectedId:o});return y(m({},t),{selectedAnnotationIds:[o],lastSelectedId:o})}function Ul(t,e){let o=new Set;for(let n of t.selectedAnnotationIds){let i=t.annotations.find(r=>r.id===n);i!=null&&i.groupId&&o.add(i.groupId)}return y(m({},t),{annotations:t.annotations.map(n=>{let i=t.selectedAnnotationIds.includes(n.id),r=n.groupId&&o.has(n.groupId);return!i&&!r?n:y(m({},n),{color:e.color})})})}function Zl(t){return y(m({},t),{annotations:t.annotations.map(e=>y(m({},e),{captured:!0,status:e.status==="pending"||!e.status?"in_flight":e.status})),styleModifications:t.styleModifications.map(e=>y(m({},e),{captured:!0})),spacingTokenChanges:t.spacingTokenChanges.map(e=>y(m({},e),{captured:!0}))})}function ql(t){return y(m({},t),{annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]})}function Ql(t,e){return y(m({},t),{inspectedElement:e})}function tc(t,e){let{selector:o,element:n,property:i,original:r,modified:s}=e,a=t.styleModifications.findIndex(l=>l.selector===o);if(r===s&&a<0)return t;if(a>=0){let l=t.styleModifications[a];if(l.captured){let f=qe(t),g=f.styleModifications.map((x,k)=>k===a?y(m({},x),{changes:[{property:i,original:r,modified:s}],captured:!1}):x);return y(m({},f),{styleModifications:g})}let c=l.changes.findIndex(f=>f.property===i),d,u=t;if(c>=0){let f=l.changes[c];s===f.original?d=l.changes.filter((g,x)=>x!==c):d=l.changes.map((g,x)=>x===c?y(m({},g),{modified:s}):g)}else{if(r===s)return t;u=qe(t),d=[...l.changes,{property:i,original:r,modified:s}]}if(d.length===0)return y(m({},u),{styleModifications:u.styleModifications.filter((f,g)=>g!==a)});let p=u.styleModifications.map((f,g)=>g===a?y(m({},f),{changes:d}):f);return y(m({},u),{styleModifications:p})}else{let l=qe(t),c={selector:o,element:n,changes:[{property:i,original:r,modified:s}]};return y(m({},l),{styleModifications:[...l.styleModifications,c]})}}function ec(t,e){let{selector:o,durableSelector:n,element:i,changes:r}=e,s=r.filter(c=>c.original!==c.modified);if(s.length===0)return t;let a=qe(t),l=a.styleModifications.findIndex(c=>c.selector===o);if(l>=0){let c=a.styleModifications[l],d=c.captured?[]:[...c.changes];for(let u of s){let p=d.findIndex(f=>f.property===u.property);p>=0?u.modified===d[p].original?d=d.filter((f,g)=>g!==p):d=d.map((f,g)=>g===p?y(m({},f),{modified:u.modified}):f):d.push(u)}return d.length===0?y(m({},a),{styleModifications:a.styleModifications.filter((u,p)=>p!==l)}):y(m({},a),{styleModifications:a.styleModifications.map((u,p)=>p===l?y(m({},u),{changes:d,captured:!1}):u)})}else return y(m({},a),{styleModifications:[...a.styleModifications,{selector:o,durableSelector:n,element:i,changes:s}]})}function nc(t,e){let{selector:o,property:n}=e,i=qe(t),r=i.styleModifications.map(s=>s.selector!==o?s:y(m({},s),{changes:s.changes.filter(a=>a.property!==n)})).filter(s=>s.changes.length>0);return y(m({},i),{styleModifications:r})}function oc(t){if(t.styleModifications.length===0)return y(m({},t),{inspectedElement:null});let e=qe(t);return y(m({},e),{styleModifications:[],inspectedElement:null})}function ic(t,e){return y(m({},t),{styleModifications:e})}function rc(t,e){let{updates:o}=e,n=new Map(o.map(i=>[i.id,i]));return y(m({},t),{annotations:t.annotations.map(i=>{let r=n.get(i.id);return r?m(y(m({},i),{points:[r.point,...i.points.slice(1)]}),r.linkedAnchor?{linkedAnchor:r.linkedAnchor}:{}):i})})}function sc(t,e){let o=new Set(e.ids);return y(m({},t),{annotations:t.annotations.map(n=>o.has(n.id)?y(m({},n),{status:e.status}):n)})}function ac(t,e){let o=new Set(e.ids),n=new Set;for(let i of t.annotations)o.has(i.id)&&i.groupId&&n.add(i.groupId);return y(m({},t),{annotations:t.annotations.map(i=>o.has(i.id)||i.groupId&&n.has(i.groupId)?y(m({},i),{threadId:e.threadId}):i)})}function lc(t,e){let o=new Set(e.ids),n=new Set;for(let i of t.annotations)o.has(i.id)&&i.groupId&&n.add(i.groupId);return y(m({},t),{annotations:t.annotations.map(i=>o.has(i.id)||i.groupId&&n.has(i.groupId)?y(m({},i),{status:"waiting_input",question:e.question,threadId:e.threadId}):i)})}function cc(t,e){let o=new Map(e.resolutions.map(i=>[i.annotationId,i])),n=new Map;for(let i of t.annotations){let r=o.get(i.id);r&&i.groupId&&n.set(i.groupId,r)}return y(m({},t),{annotations:t.annotations.map(i=>{var s,a,l;let r=o.get(i.id)||(i.groupId?n.get(i.groupId):void 0);return r?y(m({},i),{status:r.status,resolutionSummary:r.summary,scope:(a=(s=r.finalScope)!=null?s:r.inferredScope)!=null?a:null,replyCount:((l=i.replyCount)!=null?l:0)+1,question:void 0,threadId:i.threadId||e.threadId}):i})})}function dc(t,e){let{groupId:o,planId:n,planTaskId:i,instruction:r,region:s,color:a,linkedSelector:l,elements:c}=e,d=r.length>60?r.slice(0,60).replace(/\s+\S*$/,"")+"\u2026":r,u={id:io(),type:"rectangle",points:[{x:s.x,y:s.y},{x:s.x+s.width,y:s.y+s.height}],color:a,strokeWidth:2,timestamp:Date.now(),groupId:o,linkedSelector:l,elements:c,planId:n,planTaskId:i,status:"pending"},p={id:io(),type:"text",points:[{x:s.x,y:s.y+s.height+4}],text:d,fontSize:12,color:a,strokeWidth:2,timestamp:Date.now(),status:"pending",groupId:o,linkedSelector:l,elements:c,planId:n,planTaskId:i};return y(m({},t),{annotations:[...t.annotations,u,p]})}function uc(t,e){let{linkedSelectors:o,styleSelectors:n}=e,i=new Set(o),r=new Set(n),s=new Set,a=new Set;for(let p of t.annotations)p.linkedSelector&&i.has(p.linkedSelector)&&(s.add(p.id),p.groupId&&a.add(p.groupId));for(let p of t.annotations)p.groupId&&a.has(p.groupId)&&s.add(p.id);let l=t.annotations.filter(p=>!s.has(p.id)),c=t.styleModifications.filter(p=>!r.has(p.selector));if(l.length===t.annotations.length&&c.length===t.styleModifications.length)return t;let d=t.selectedAnnotationIds.filter(p=>!s.has(p)),u=t.inspectedElement&&r.has(t.inspectedElement.info.selector)?null:t.inspectedElement;return y(m({},t),{annotations:l,styleModifications:c,selectedAnnotationIds:d,lastSelectedId:d.length>0?d[d.length-1]:null,inspectedElement:u})}function pc(t,e){let o=t.spacingTokenChanges.findIndex(n=>n.tokenPath===e.tokenPath);return o>=0?y(m({},t),{spacingTokenChanges:t.spacingTokenChanges.map((n,i)=>i===o?e:n)}):y(m({},t),{spacingTokenChanges:[...t.spacingTokenChanges,e]})}function fc(t,e){return y(m({},t),{spacingTokenChanges:e})}function gc(t,e){let o=qe(t),n=t.spacingTokenMods.findIndex(r=>r.tokenPath===e.tokenPath),i;if(n>=0){let r=t.spacingTokenMods[n],s=y(m({},e),{originalValue:r.originalValue,originalPx:r.originalPx});i=t.spacingTokenMods.map((a,l)=>l===n?s:a)}else i=[...t.spacingTokenMods,e];return y(m({},o),{spacingTokenMods:i})}function mc(t,e){let o=qe(t),n=t.spacingTokenMods.findIndex(l=>l.tokenPath===e.tokenPath),i=n>=0?t.spacingTokenMods[n].originalValue:e.originalValue,r=n>=0?t.spacingTokenMods[n].originalPx:parseFloat(e.originalValue)||0,s={tokenPath:e.tokenPath,originalValue:i,currentValue:"__deleted__",targets:n>=0?t.spacingTokenMods[n].targets:[],originalPx:r,currentPx:0},a;return n>=0?a=t.spacingTokenMods.map((l,c)=>c===n?s:l):a=[...t.spacingTokenMods,s],y(m({},o),{spacingTokenMods:a})}var hc={SET_ANNOTATING:Al,SET_TOOL:Pl,SET_COLOR:Bl,SET_STROKE_WIDTH:Nl,START_PATH:Dl,CONTINUE_PATH:Ol,CANCEL_PATH:Fl,FINISH_PATH:Hl,ADD_TEXT:zl,UPDATE_TEXT:_l,UPDATE_TEXT_SIZE:$l,DELETE_ANNOTATION:Wl,MOVE_ANNOTATION:Yl,RESIZE_ANNOTATION:jl,PASTE_ANNOTATIONS:Gl,RESTORE_ANNOTATIONS:Vl,UNDO:Xl,REDO:Jl,SELECT_ANNOTATION:Kl,UPDATE_ANNOTATION_COLOR:Ul,MARK_CAPTURED:Zl,CLEAR:ql,SELECT_ELEMENT:Ql,MODIFY_STYLE:tc,MODIFY_STYLES_BATCH:ec,CLEAR_STYLE:nc,CLEAR_ALL_STYLES:oc,RESTORE_STYLE_MODIFICATIONS:ic,UPDATE_LINKED_POSITIONS:rc,CLEANUP_ORPHANED:uc,SET_ANNOTATION_STATUS:sc,SET_ANNOTATION_THREAD:ac,SET_ANNOTATION_QUESTION:lc,APPLY_RESOLUTIONS:cc,ADD_PLAN_ANNOTATION:dc,ADD_SPACING_TOKEN_CHANGE:pc,RESTORE_SPACING_TOKEN_CHANGES:fc,MODIFY_SPACING_TOKEN:gc,DELETE_SPACING_TOKEN:mc};function yc(t,e){let o=hc[e.type];return o?o(t,e.payload):t}function Os(){let[t,e]=Ll(yc,Rl);return Il(()=>{let o=n=>{(n.metaKey||n.ctrlKey)&&n.key==="z"&&(n.preventDefault(),n.shiftKey?e({type:"REDO"}):e({type:"UNDO"}))};return window.addEventListener("keydown",o),()=>window.removeEventListener("keydown",o)},[]),[t,e]}function Yn(t){let e=Object.keys(t).find(i=>i.startsWith("__reactFiber$")||i.startsWith("__reactInternalInstance$"));if(!e)return null;let o=t[e],n=[];for(;o;){let i=o.type,r=(i==null?void 0:i.displayName)||(i==null?void 0:i.name);r&&typeof r=="string"&&/^[A-Z]/.test(r)&&!r.startsWith("_")&&r!=="Fragment"&&n.unshift(r),o=o.return}return n.length>0?{name:n[n.length-1],path:n}:null}function Ti(t){let e=Object.keys(t).find(i=>i.startsWith("__reactFiber$")||i.startsWith("__reactInternalInstance$"));if(!e)return[];let o=t[e],n=[];for(;o;){let i=o.type,r=typeof i=="function"||typeof i=="object"?(i==null?void 0:i.displayName)||(i==null?void 0:i.name):null;r&&typeof r=="string"&&/^[A-Z]/.test(r)&&!r.startsWith("_")&&r!=="Fragment"&&n.push({name:r,fiber:o}),o=o.return}return n.reverse(),n}function Jo(t){let e=t,o=new Set;for(;e&&!o.has(e);){if(o.add(e),e.stateNode instanceof Element)return e.stateNode;e.child?e=e.child:e=null}return null}function Fs(t){if(t.id)return`#${t.id}`;let e=t.tagName.toLowerCase(),o=Array.from(t.classList).slice(0,3).join(".");return o?`${e}.${o}`:e}function ln(t){if(t.id&&!t.id.startsWith("radix-")&&!t.id.startsWith(":"))return`#${CSS.escape(t.id)}`;let e=[],o=t;for(;o&&o!==document.documentElement;){let n=o.tagName.toLowerCase();if(o.id&&!o.id.startsWith("radix-")&&!o.id.startsWith(":")){e.unshift(`#${CSS.escape(o.id)}`);break}let i=Array.from(o.classList).filter(s=>!s.startsWith("_")&&s.length<30).slice(0,2);i.length>0&&(n+="."+i.map(s=>CSS.escape(s)).join("."));let r=o.parentElement;if(r){let s=Array.from(r.children).filter(a=>a.tagName===o.tagName);if(s.length>1){let a=s.indexOf(o)+1;n+=`:nth-of-type(${a})`}}e.unshift(n),o=r}return e.join(" > ")}function Je(t){try{return document.querySelector(t)}catch(e){return null}}function Ko(t,e=0){var l;let o=Ti(t);if(o.length===0)return null;let n=o.map(c=>c.name),i=o.length-1,r=Math.max(0,Math.min(o.length-1,i-e)),s=o[r],a=(l=Jo(s.fiber))!=null?l:t;return{name:s.name,path:n,depthIndex:r,rootElement:a}}function Hs(t,e){var r,s;let o=Ti(t),n=e.toLowerCase(),i=-1;for(let a=o.length-1;a>=0;a--){let l=o[a].name;if(l===e){let c=(r=Jo(o[a].fiber))!=null?r:t;return{name:e,path:o.map(d=>d.name),depthIndex:a,rootElement:c}}if(i===-1){let c=l.toLowerCase();(c.length>=4&&n.includes(c)||n.length>=4&&c.includes(n))&&(i=a)}}if(i>=0){let a=(s=Jo(o[i].fiber))!=null?s:t;return{name:e,path:o.map(l=>l.name),depthIndex:i,rootElement:a}}return null}function ro(t){let e=so(),o=[],n=new Set,i=e.currentNode;for(;i=e.nextNode();){let r=Hs(i,t);r&&!n.has(r.rootElement)&&(n.add(r.rootElement),o.push(r))}return o}function Mi(t){let e=new Map;if(t.size===0)return e;let o=new Set(t),n=so(),i=new Set,r=n.currentNode;for(;(r=n.nextNode())&&o.size>0;)for(let s of o){let a=Hs(r,s);if(!a||i.has(a.rootElement))continue;i.add(a.rootElement);let l=a.rootElement.getBoundingClientRect();e.set(s,l.top+window.scrollY),o.delete(s);break}for(let s of o)e.set(s,1/0);return e}function so(){return document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT,{acceptNode(t){return t.closest("#devtools-toolbar, #devtools-canvas, #devtools-scrim, [data-popmelt-panel]")?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}})}function Ke(t){let e={selector:Fs(t),tagName:t.tagName.toLowerCase()};t.id&&(e.id=t.id),t.classList.length>0&&(e.className=Array.from(t.classList).join(" "));let o=To(t);o&&o.length>0&&o.length<200&&(e.textContent=o);let n={};for(let s of t.attributes)s.name.startsWith("data-")&&(n[s.name]=s.value);Object.keys(n).length>0&&(e.dataAttributes=n);let i=Yn(t);i&&(e.reactComponent=i.name);let r=bc(t);return r&&(e.context=r),e}function To(t){let e="";for(let o of t.childNodes)o.nodeType===Node.TEXT_NODE&&(e+=o.textContent||"");return e.trim()}function On(t,e){let o=document.elementsFromPoint(t,e);for(let n of o)if(n instanceof HTMLElement&&!(n.id==="devtools-canvas"||n.id==="devtools-toolbar"||n.id==="devtools-scrim")&&!n.closest("#devtools-toolbar")&&!(n.dataset.devtools||n.closest("[data-devtools]"))&&!["html","body"].includes(n.tagName.toLowerCase()))return n;return null}function bc(t){let e=t.parentElement,o=["section","article","nav","aside","header","footer","main"];for(;e&&e!==document.body;){let n=e.tagName.toLowerCase();if(o.includes(n)&&e.id)return`${n}#${e.id}`;if(e.id&&!e.id.startsWith("radix-")&&!e.id.startsWith(":"))return`${n}#${e.id}`;e=e.parentElement}return null}function zs(t){let e=new Set,o=[],n=window.scrollX,i=window.scrollY,r=[{x:(t.minX+t.maxX)/2,y:(t.minY+t.maxY)/2},{x:t.minX,y:t.minY},{x:t.maxX,y:t.minY},{x:t.minX,y:t.maxY},{x:t.maxX,y:t.maxY}];for(let s of r){let a=s.x-n,l=s.y-i;if(a<0||l<0||a>window.innerWidth||l>window.innerHeight)continue;let c=On(a,l);c&&!e.has(c)&&(e.add(c),o.push(Ke(c)))}return o.slice(0,3)}function Ii(t){if(t.length===0)return[];let e=t.map(n=>n.x),o=t.map(n=>n.y);return zs({minX:Math.min(...e),minY:Math.min(...o),maxX:Math.max(...e),maxY:Math.max(...o)})}function Li(t){let e=t.x+t.width/2,o=t.y+t.height/2,n=e-window.scrollX,i=o-window.scrollY,r=On(n,i);if(!r||!(r instanceof HTMLElement))return null;if(!r.hasAttribute("data-pm")){let d=Math.random().toString(36).substring(2,9);r.setAttribute("data-pm",d)}let a=`[data-pm="${r.getAttribute("data-pm")}"]`,l=Ke(r),c=r.getBoundingClientRect();return{selector:a,info:l,rect:c}}function Le(t,e){return t.style.getPropertyValue(e)!==""}function xc(t,e=30){if(t<=0)return[];let o=[],n=so(),i=.5,r=n.currentNode;for(;(r=n.nextNode())&&o.length<e;){let s=r,a=s.getBoundingClientRect();if(a.bottom<-50||a.top>window.innerHeight+50||a.right<-50||a.left>window.innerWidth+50||a.width<1||a.height<1)continue;let l=getComputedStyle(s);!Le(s,"padding-top")&&Math.abs((parseFloat(l.paddingTop)||0)-t)<i&&o.push({element:s,property:"padding-top"}),!Le(s,"padding-bottom")&&Math.abs((parseFloat(l.paddingBottom)||0)-t)<i&&o.length<e&&o.push({element:s,property:"padding-bottom"}),!Le(s,"padding-left")&&Math.abs((parseFloat(l.paddingLeft)||0)-t)<i&&o.length<e&&o.push({element:s,property:"padding-left"}),!Le(s,"padding-right")&&Math.abs((parseFloat(l.paddingRight)||0)-t)<i&&o.length<e&&o.push({element:s,property:"padding-right"}),!Le(s,"margin-top")&&Math.abs((parseFloat(l.marginTop)||0)-t)<i&&o.length<e&&o.push({element:s,property:"margin-top"}),!Le(s,"margin-bottom")&&Math.abs((parseFloat(l.marginBottom)||0)-t)<i&&o.length<e&&o.push({element:s,property:"margin-bottom"}),!Le(s,"margin-left")&&Math.abs((parseFloat(l.marginLeft)||0)-t)<i&&o.length<e&&o.push({element:s,property:"margin-left"}),!Le(s,"margin-right")&&Math.abs((parseFloat(l.marginRight)||0)-t)<i&&o.length<e&&o.push({element:s,property:"margin-right"});let c=l.display;if((c.includes("flex")||c.includes("grid"))&&o.length<e){let d=Le(s,"gap"),u=parseFloat(l.gap)||0,p=parseFloat(l.rowGap)||0,f=parseFloat(l.columnGap)||0;!d&&Math.abs(u-t)<i?o.push({element:s,property:"gap"}):!Le(s,"row-gap")&&Math.abs(p-t)<i?o.push({element:s,property:"row-gap"}):!Le(s,"column-gap")&&Math.abs(f-t)<i&&o.push({element:s,property:"column-gap"})}}return o}function Ri(t,e=30){if(t<=0)return[];let o=[],n=so(),i=.5,r=n.currentNode;for(;(r=n.nextNode())&&o.length<e;){let s=r,a=s.getBoundingClientRect();if(a.bottom<-50||a.top>window.innerHeight+50||a.right<-50||a.left>window.innerWidth+50||a.width<1||a.height<1)continue;let l=getComputedStyle(s),c=parseFloat(l.borderTopWidth)||0,d=parseFloat(l.borderRightWidth)||0,u=parseFloat(l.borderBottomWidth)||0,p=parseFloat(l.borderLeftWidth)||0,f=s.clientWidth,g=s.clientHeight,x=parseFloat(l.paddingTop)||0;!Le(s,"padding-top")&&Math.abs(x-t)<i&&o.push({x:a.left+p,y:a.top+c,width:f,height:t,direction:"vertical",property:"padding-top"});let k=parseFloat(l.paddingBottom)||0;!Le(s,"padding-bottom")&&Math.abs(k-t)<i&&o.length<e&&o.push({x:a.left+p,y:a.top+c+g-t,width:f,height:t,direction:"vertical",property:"padding-bottom"});let b=parseFloat(l.paddingLeft)||0;!Le(s,"padding-left")&&Math.abs(b-t)<i&&o.length<e&&o.push({x:a.left+p,y:a.top+c,width:t,height:g,direction:"horizontal",property:"padding-left"});let P=parseFloat(l.paddingRight)||0;!Le(s,"padding-right")&&Math.abs(P-t)<i&&o.length<e&&o.push({x:a.left+p+f-t,y:a.top+c,width:t,height:g,direction:"horizontal",property:"padding-right"});let B=parseFloat(l.marginTop)||0;!Le(s,"margin-top")&&Math.abs(B-t)<i&&o.length<e&&o.push({x:a.left,y:a.top-t,width:a.width,height:t,direction:"vertical",property:"margin-top"});let A=parseFloat(l.marginBottom)||0;!Le(s,"margin-bottom")&&Math.abs(A-t)<i&&o.length<e&&o.push({x:a.left,y:a.bottom,width:a.width,height:t,direction:"vertical",property:"margin-bottom"});let M=parseFloat(l.marginLeft)||0;!Le(s,"margin-left")&&Math.abs(M-t)<i&&o.length<e&&o.push({x:a.left-t,y:a.top,width:t,height:a.height,direction:"horizontal",property:"margin-left"});let C=parseFloat(l.marginRight)||0;!Le(s,"margin-right")&&Math.abs(C-t)<i&&o.length<e&&o.push({x:a.right,y:a.top,width:t,height:a.height,direction:"horizontal",property:"margin-right"});let nt=l.display;if((nt.includes("flex")||nt.includes("grid"))&&o.length<e&&!Le(s,"gap")){let G=Array.from(s.children).filter(U=>{let O=getComputedStyle(U);return O.display!=="none"&&O.position!=="absolute"&&O.position!=="fixed"});if(G.length>=2)for(let U=0;U<G.length-1&&o.length<e;U++){let O=G[U].getBoundingClientRect(),tt=G[U+1].getBoundingClientRect(),et=tt.top-O.bottom;Math.abs(et-t)<i&&et>.5&&o.push({x:Math.min(O.left,tt.left),y:O.bottom,width:Math.max(O.right,tt.right)-Math.min(O.left,tt.left),height:et,direction:"vertical",property:"gap"});let vt=tt.left-O.right;Math.abs(vt-t)<i&&vt>.5&&o.push({x:O.right,y:Math.min(O.top,tt.top),width:vt,height:Math.max(O.bottom,tt.bottom)-Math.min(O.top,tt.top),direction:"horizontal",property:"gap"})}}}return o}function Uo(t){return typeof t=="string"?{value:t}:t}var $s={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 _s(t,e){let o=$s[e];return o?o.includes(t):!1}function vc(t,e){let o=t.split(/\s+/);for(let n of o){if(n===e)return!0;let i=n.lastIndexOf(":");if(i>=0&&n.slice(i+1)===e)return!0}return!1}function Sc(t){var a,l;let e=t.lastIndexOf(":"),o=e>=0?t.slice(e+1):t,n=o.indexOf("-");if(n<0)return null;let i=o.slice(0,n),r={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("-",n+1)>0?o.indexOf("-",n+1):n);return(l=(a=r[s])!=null?a:r[i])!=null?l:null}function Ai(t,e=30){let o=parseFloat(t.value);if(isNaN(o)||o<=0)return[];if(t.bindings&&t.bindings.length>0){let i=[],r=so(),s=r.currentNode;for(;(s=r.nextNode())&&i.length<e;){let a=s,l=a.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let c=a.className;if(typeof c=="string")for(let d of t.bindings){if(!vc(c,d))continue;let u=Sc(d);if(u&&!(t.property&&!_s(u,t.property))){i.push({element:a,property:u});break}}}return i}let n=xc(o,e*2);return t.property?n.filter(i=>_s(i.property,t.property)).slice(0,e):n.slice(0,e)}function Pi(t,e=30){let o=Ai(t,e),n=[];for(let i of o){let r=i.element,s=r.getBoundingClientRect(),a=getComputedStyle(r),l=parseFloat(a.borderTopWidth)||0,c=parseFloat(a.borderRightWidth)||0,d=parseFloat(a.borderLeftWidth)||0,u=r.clientWidth,p=r.clientHeight;switch(i.property){case"padding-top":{let f=parseFloat(a.paddingTop)||0;n.push({x:s.left+d,y:s.top+l,width:u,height:f,direction:"vertical",property:i.property});break}case"padding-bottom":{let f=parseFloat(a.paddingBottom)||0;n.push({x:s.left+d,y:s.top+l+p-f,width:u,height:f,direction:"vertical",property:i.property});break}case"padding-left":{let f=parseFloat(a.paddingLeft)||0;n.push({x:s.left+d,y:s.top+l,width:f,height:p,direction:"horizontal",property:i.property});break}case"padding-right":{let f=parseFloat(a.paddingRight)||0;n.push({x:s.left+d+u-f,y:s.top+l,width:f,height:p,direction:"horizontal",property:i.property});break}case"margin-top":{let f=parseFloat(a.marginTop)||0;n.push({x:s.left,y:s.top-f,width:s.width,height:f,direction:"vertical",property:i.property});break}case"margin-bottom":{let f=parseFloat(a.marginBottom)||0;n.push({x:s.left,y:s.bottom,width:s.width,height:f,direction:"vertical",property:i.property});break}case"margin-left":{let f=parseFloat(a.marginLeft)||0;n.push({x:s.left-f,y:s.top,width:f,height:s.height,direction:"horizontal",property:i.property});break}case"margin-right":{let f=parseFloat(a.marginRight)||0;n.push({x:s.right,y:s.top,width:f,height:s.height,direction:"horizontal",property:i.property});break}case"gap":case"row-gap":case"column-gap":{let f=Array.from(r.children).filter(g=>{let x=getComputedStyle(g);return x.display!=="none"&&x.position!=="absolute"&&x.position!=="fixed"});for(let g=0;g<f.length-1&&n.length<e;g++){let x=f[g].getBoundingClientRect(),k=f[g+1].getBoundingClientRect(),b=k.top-x.bottom;b>.5&&n.push({x:Math.min(x.left,k.left),y:x.bottom,width:Math.max(x.right,k.right)-Math.min(x.left,k.left),height:b,direction:"vertical",property:"gap"});let P=k.left-x.right;P>.5&&n.push({x:x.right,y:Math.min(x.top,k.top),width:P,height:Math.max(x.bottom,k.bottom)-Math.min(x.top,k.top),direction:"horizontal",property:"gap"})}break}}}return n}function Ws(t,e){let o=new Set,n=Mo(e);for(let i of t){let r=js[i.property];if(!r)continue;let s=i.element.className;if(typeof s=="string")for(let a of r){let l=`${a}-${n}`;for(let c of s.split(/\s+/)){let d=c.lastIndexOf(":"),u=d>=0?c.slice(d+1):c;if(u===l){o.add(u);break}}}}return[...o]}function Ys(t){let e=new Set;for(let o of t)for(let[n,i]of Object.entries($s))if(i.includes(o.property)){e.add(n);break}if(e.size===1)return[...e][0]}function Bi(t,e,o){if(e===o)return t;let n=Mo(e),i=Mo(o);return t.map(r=>{let s=r.lastIndexOf("-");if(s<0)return r;let a=r.slice(0,s),l=r.slice(s+1);return l===n||l===`[${e}px]`?`${a}-${i}`:r})}var wc={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 Mo(t){var e;return(e=wc[t])!=null?e:`[${t}px]`}var js={"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 kc(t,e,o,n){let i=js[e];if(!i)return null;let r=Mo(o);for(let s of i){let a=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+s+"-(?:"+Cc(r)+"|\\["+o+"px\\]))(?:\\s|$)"),l=t.match(a);if(l!=null&&l[1]){let c=Mo(n),d=l[1].lastIndexOf(":"),u=d>=0?l[1].slice(0,d+1):"";return{matched:l[1],suggested:`${u}${s}-${c}`}}}return null}function Cc(t){return t.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function Gs(t,e,o){let n=new Set,i=[];for(let r of t){let s=ln(r.element),a=`${s}::${r.property}`;if(n.has(a))continue;n.add(a);let l=Yn(r.element),c=r.element.className||"",d=kc(c,r.property,e,o);i.push({selector:s,reactComponent:l==null?void 0:l.name,className:c,property:r.property,matchedClass:d==null?void 0:d.matched,suggestedClass:d==null?void 0:d.suggested})}return i}function Io(t,e){return window.getComputedStyle(t).getPropertyValue(e)}function Ni(t,e){if(t instanceof HTMLElement){let n=t.style.getPropertyValue(e);if(n)return n}let o=Ec(t,e);return o&&o.includes("var(")?o:Io(t,e)}function Ec(t,e){let o=e.replace(/-([a-z])/g,(n,i)=>i.toUpperCase());try{for(let n of document.styleSheets)try{let i=n.cssRules||n.rules;for(let r of i)if(r instanceof CSSStyleRule&&t.matches(r.selectorText)){let s=r.style.getPropertyValue(e);if(s&&s.includes("var("))return s;let a=r.style[o];if(a&&a.includes("var("))return a}}catch(i){}}catch(n){}return null}function Zo(t,e){if(t instanceof HTMLElement){let n=t.style.getPropertyValue(e);if(n)return n}let o=e.replace(/-([a-z])/g,(n,i)=>i.toUpperCase());try{for(let n of document.styleSheets)try{let i=n.cssRules||n.rules;for(let r of i)if(r instanceof CSSStyleRule&&t.matches(r.selectorText)){let s=r.style.getPropertyValue(e);if(s)return s;let a=r.style[o];if(a)return a}}catch(i){}}catch(n){}return null}function qo(t){let e=window.getComputedStyle(t).display;return e==="flex"||e==="inline-flex"||e==="grid"||e==="inline-grid"}function Lo(t){let e=window.getComputedStyle(t);return{row:parseFloat(e.rowGap)||0,column:parseFloat(e.columnGap)||0}}function Tc(t){let e=[];for(let o of t){let n=e.find(i=>i.axis!==o.axis?!1:o.axis==="row"?Math.abs(i.y-o.y)<2&&Math.abs(i.h-o.h)<2:Math.abs(i.x-o.x)<2&&Math.abs(i.w-o.w)<2);if(n)if(o.axis==="row"){let i=Math.min(n.x,o.x),r=Math.max(n.x+n.w,o.x+o.w);n.x=i,n.w=r-i}else{let i=Math.min(n.y,o.y),r=Math.max(n.y+n.h,o.y+o.h);n.y=i,n.h=r-i}else e.push(m({},o))}return e}function jn(t){let e=Array.from(t.children).filter(l=>{if(!(l instanceof HTMLElement))return!1;let c=window.getComputedStyle(l);return c.display!=="none"&&c.position!=="absolute"&&c.position!=="fixed"});if(e.length<2)return[];let o=[],n=t.getBoundingClientRect(),r=window.getComputedStyle(t).flexDirection,s=r==="column"||r==="column-reverse",a=6;for(let l=0;l<e.length-1;l++){let c=e[l].getBoundingClientRect(),d=e[l+1].getBoundingClientRect();if(d.left>c.right+.5&&o.push({axis:"column",x:c.right,y:n.top,w:d.left-c.right,h:n.height}),d.top>c.bottom+.5&&o.push({axis:"row",x:n.left,y:c.bottom,w:n.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:n.left,y:u-a/2,w:n.width,h:a})}else{let u=(c.right+d.left)/2;o.push({axis:"column",x:u-a/2,y:n.top,w:a,h:n.height})}}return Tc(o)}function Di(t,e){let o=window.getComputedStyle(t),n=o.display;if(n!=="flex"&&n!=="inline-flex")return!1;let i=o.justifyContent;if(i!=="space-between"&&i!=="space-around"&&i!=="space-evenly"&&i!=="stretch")return!1;let r=o.flexDirection;return!(e!==(r==="column"||r==="column-reverse"?"row":"column")||parseFloat(e==="row"?o.rowGap:o.columnGap)>0)}function ao(t){let e=window.getComputedStyle(t);return{top:parseFloat(e.paddingTop)||0,right:parseFloat(e.paddingRight)||0,bottom:parseFloat(e.paddingBottom)||0,left:parseFloat(e.paddingLeft)||0}}function Gn(t){let e=window.getComputedStyle(t);return{"top-left":parseFloat(e.borderTopLeftRadius)||0,"top-right":parseFloat(e.borderTopRightRadius)||0,"bottom-right":parseFloat(e.borderBottomRightRadius)||0,"bottom-left":parseFloat(e.borderBottomLeftRadius)||0}}function Oi(t){for(let e of t.childNodes)if(e.nodeType===Node.TEXT_NODE&&(e.textContent||"").trim().length>0)return!0;return!1}function lo(t){var d,u;let e=document.createRange(),o=!1;for(let p of t.childNodes)p.nodeType===Node.TEXT_NODE&&(p.textContent||"").trim().length>0&&(o||(e.setStart(p,0),o=!0),e.setEnd(p,(u=(d=p.textContent)==null?void 0:d.length)!=null?u:0));if(!o)return null;let n=e.getBoundingClientRect(),i=window.getComputedStyle(t),r=parseFloat(i.fontSize)||16,s=parseFloat(i.lineHeight);isNaN(s)&&(s=r*1.2);let a=Math.max(1,e.getClientRects().length),l=Math.max(n.height,a*s),c=(l-n.height)/2;return new DOMRect(n.x,n.y-c,n.width,l)}function Ro(t){let e=window.getComputedStyle(t),o=parseFloat(e.fontSize)||16,n=parseFloat(e.lineHeight);return isNaN(n)&&(n=o*1.2),{fontSize:o,lineHeight:n}}function Yt(t,e,o){t instanceof HTMLElement&&t.style.setProperty(e,o,"important")}function Fi(t,e,o){t instanceof HTMLElement&&t.style.removeProperty(e)}function Qo(t){var e;for(let o of t){let n=Je(o.selector);if(!n&&o.durableSelector&&(n=Je(o.durableSelector),n)){let i=(e=o.selector.match(/\[data-pm="([^"]+)"\]/))==null?void 0:e[1];i&&n.setAttribute("data-pm",i)}if(n)for(let i of o.changes)Yt(n,i.property,i.modified)}}function Hi(t,e){let o=Je(t);if(!o)return;let n=e.find(i=>i.selector===t);if(n)for(let i of n.changes)Fi(o,i.property,i.original)}function ti(t){for(let e of t){let o=Je(e.selector);if(o)for(let n of e.changes)Fi(o,n.property,n.original)}}function Xs(t,e,o,n){if(t)for(let i of t){if(i instanceof CSSGroupingRule){Xs(i.cssRules,e,o,n);continue}if(i instanceof CSSStyleRule){let r=i.selectorText.toLowerCase();(r===":root"||r==="html"||r==="*"||r.includes(":root"))&&Mc(i.style,e,o,n)}}}function Mc(t,e,o,n){for(let i=0;i<t.length;i++){let r=t[i];if(r!=null&&r.startsWith("--")){if(o.has(r))continue;o.add(r);let s=e.getPropertyValue(r).trim();Js(s)&&n.push({name:r,value:s,usage:`var(${r})`})}}}var ei=null,Ic=5e3;function zi(){if(ei&&Date.now()-ei.timestamp<Ic)return ei.variables;let t=[],e=new Set,o=getComputedStyle(document.documentElement);try{for(let r of document.styleSheets)try{Xs(r.cssRules||r.rules,o,e,t)}catch(s){}}catch(r){}let n=document.documentElement.style;for(let r=0;r<n.length;r++){let s=n[r];if(s!=null&&s.startsWith("--")&&!e.has(s)){e.add(s);let a=o.getPropertyValue(s).trim();Js(a)&&t.push({name:s,value:a,usage:`var(${s})`})}}let i=t.sort((r,s)=>r.name.localeCompare(s.name));return ei={variables:i,timestamp:Date.now()},i}function Js(t){if(!t)return!1;let e=t.toLowerCase().trim();return!!(/^#([0-9a-f]{3}|[0-9a-f]{4}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(e)||e.startsWith("rgb")||e.startsWith("hsl")||e.startsWith("oklch")||e.startsWith("oklab")||e.startsWith("lch")||e.startsWith("lab")||["transparent","currentcolor","inherit","white","black","red","green","blue","yellow","orange","purple","pink","gray","grey"].includes(e))}function Ao(t,e){let o=e.match(/var\((--[^,)]+)(?:,\s*([^)]+))?\)/);if(o){let n=o[1],i=o[2];return getComputedStyle(document.documentElement).getPropertyValue(n).trim()||i||e}return e}function Po(t,e){if(!t)return null;let o=Vs(t);if(!o)return null;for(let n of e){let i=Vs(n.value);if(i&&o===i)return n}return null}function Vs(t){if(!t)return null;let e=t.trim().toLowerCase();if(e.startsWith("oklch(")){let o=e.match(/oklch\(\s*([\d.]+%?)\s+([\d.]+%?)\s+([\d.]+)/);if(o){let n=o[1].endsWith("%")?parseFloat(o[1])/100:parseFloat(o[1]),i=o[2].endsWith("%")?parseFloat(o[2])/100:parseFloat(o[2]),r=parseFloat(o[3]);n=Math.round(n*100)/100,i=Math.round(i*1e3)/1e3;let s=Math.round(r);return`oklch(${n} ${i} ${s})`}}if(e.startsWith("rgb")){let o=e.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(o)return`rgb(${o[1]},${o[2]},${o[3]})`}return e.startsWith("#")?e.length===4?`#${e[1]}${e[1]}${e[2]}${e[2]}${e[3]}${e[3]}`:e.slice(0,7):e}var Lc=new Set(["button","a","input","select","textarea"]),Rc=new Set(["button","link"]),Ac=new Set(["h1","h2","h3","h4","h5","h6","nav","main","header","footer","section","article","aside"]),Pc=["fontSize","fontWeight","fontFamily","lineHeight","letterSpacing","color","backgroundColor","padding","gap","borderRadius","boxShadow"];var _i=150;function Bc(t){let e=0,o=t.parentElement;for(;o&&o!==document.body;)e++,o=o.parentElement;return e}function Nc(t){return!(t.startsWith("_")||t.startsWith("css-")||t.length>30)}function Dc(t){let e=Array.from(t.classList).filter(Nc).slice(0,3);return e.length>0?e.join(" "):void 0}function Oc(t,e){let o=window.getComputedStyle(t),n=e?window.getComputedStyle(e):null,i={};for(let r of Pc){let s=o.getPropertyValue(r.replace(/[A-Z]/g,a=>`-${a.toLowerCase()}`));if(s&&!(r==="backgroundColor"&&(s==="rgba(0, 0, 0, 0)"||s==="transparent"))&&!(r==="boxShadow"&&s==="none")){if(r==="boxShadow"&&(s="yes"),r==="fontFamily"&&(s=s.split(",")[0].trim().replace(/['"]/g,"")),n){let a=n.getPropertyValue(r.replace(/[A-Z]/g,l=>`-${l.toLowerCase()}`));if(s===a)continue}i[r]=s}}return Object.keys(i).length>0?i:void 0}function Fc(t){if(!(t instanceof HTMLElement))return!1;let e=window.getComputedStyle(t);if(e.display==="none"||e.visibility==="hidden")return!1;if(t.offsetParent===null){let o=t.tagName.toLowerCase();if(o==="body"||o==="html")return!0;let n=e.position;return n==="fixed"||n==="sticky"}return!0}function Hc(t){return!!(t instanceof HTMLElement&&t.dataset.devtools||t.closest("[data-devtools]")||t.id==="devtools-canvas"||t.id==="devtools-toolbar"||t.id==="devtools-scrim")}function zc(t){let e=t.tagName.toLowerCase(),o=To(t);if(o&&o.length>0||Lc.has(e))return!0;let n=t.getAttribute("role");return!!(n&&Rc.has(n)||Ac.has(e)||(e==="img"||e==="svg")&&(t.getAttribute("alt")||t.getAttribute("aria-label")))}function Ks(){var c,d,u,p,f;let t=[],e=document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT),o=e.nextNode();for(;o;){let g=o;if(o=e.nextNode(),Hc(g)||!Fc(g))continue;let x=g.getBoundingClientRect();if(x.width<1||x.height<1||!zc(g))continue;let k=g.tagName.toLowerCase(),b=To(g),P=Bc(g),B=g.getAttribute("role")||void 0,A=k==="a"&&g.getAttribute("href")||void 0,M=k==="img"&&g.getAttribute("alt")||void 0,C=(c=Yn(g))==null?void 0:c.name,nt=Dc(g),j=Oc(g,g.parentElement),G={tag:k,rect:{x:Math.round(x.left+window.scrollX),y:Math.round(x.top+window.scrollY),w:Math.round(x.width),h:Math.round(x.height)},depth:P};b&&(G.text=b.length>80?b.slice(0,80)+"...":b),C&&(G.component=C),nt&&(G.classes=nt),j&&(G.styles=j),B&&(G.role=B),A&&(G.href=A),M&&(G.alt=M),t.push({el:g,entry:G})}t.sort((g,x)=>x.entry.depth-g.entry.depth);let n=new Set;for(let g=0;g<t.length;g++){let x=t[g];if(n.has(x.el))continue;let k=x.el.parentElement;if(!k||!t.find(A=>A.el===k))continue;let P=(d=x.el.textContent)==null?void 0:d.trim(),B=(u=k.textContent)==null?void 0:u.trim();P&&B&&P===B&&n.add(x.el)}let i=t.filter(g=>!n.has(g.el)),r=new Map;for(let g of i){let x=g.el.parentElement,k=[x?Array.from(x.classList).join("."):"",g.entry.tag,(p=g.entry.component)!=null?p:"",g.entry.styles?JSON.stringify(g.entry.styles):""].join("|"),b=(f=r.get(k))!=null?f:[];b.push(g),r.set(k,b)}let s=[],a=new Set;for(let[,g]of r)if(g.length>3){s.push(g[0].entry,g[1].entry),a.add(g[0].el),a.add(g[1].el);let x=1/0,k=1/0,b=-1/0,P=-1/0;for(let B=2;B<g.length;B++){let A=g[B].entry.rect;x=Math.min(x,A.x),k=Math.min(k,A.y),b=Math.max(b,A.x+A.w),P=Math.max(P,A.y+A.h)}s.push({tag:g[0].entry.tag,text:`(+${g.length-2} similar items)`,rect:{x:Math.round(x),y:Math.round(k),w:Math.round(b-x),h:Math.round(P-k)},depth:g[0].entry.depth});for(let B of g)a.add(B.el)}for(let g of i)a.has(g.el)||s.push(g.entry);let l=Math.max(document.documentElement.scrollHeight,1);if(s.sort((g,x)=>{let k=g.rect.w*g.rect.h,b=x.rect.w*x.rect.h,P=k*(1+.5*(1-g.rect.y/l));return b*(1+.5*(1-x.rect.y/l))-P}),s.length>_i){let g=s.slice(0,_i);return g.push({tag:"truncated",text:`${s.length-_i} additional elements omitted`,rect:{x:0,y:0,w:0,h:0},depth:0}),g}return s}import{domToCanvas as _c}from"modern-screenshot";function Wi(t){let e=document.createElement("canvas").getContext("2d");return e?(e.fillStyle=t,e.fillStyle):"#888888"}function ni(t,e=[],o,n){let i=new Map,r=[];for(let a of t)if(a.groupId){let l=i.get(a.groupId)||[];l.push(a),i.set(a.groupId,l)}else r.push(a);let s=[];for(let[a,l]of i){let c=l.find(u=>u.type!=="text"),d=l.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(m(y(m({id:c.id,type:c.type,instruction:d==null?void 0:d.text},u?{linkedSelector:u}:{}),{elements:c.elements||[]}),p?{imageCount:p}:{}))}}for(let a of r)s.push(m(y(m({id:a.id,type:a.type,instruction:a.type==="text"?a.text:void 0},a.linkedSelector?{linkedSelector:a.linkedSelector}:{}),{elements:a.elements||[]}),a.imageCount?{imageCount:a.imageCount}:{}));return m(m({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:e},o?{inspectedElement:o}:{}),n&&n.length>0?{spacingTokenChanges:n}:{})}function Us(t){if(!t.points||t.points.length===0)return null;let e=t.points.map(n=>n.x),o=t.points.map(n=>n.y);return{minX:Math.min(...e),minY:Math.min(...o),maxX:Math.max(...e),maxY:Math.max(...o)}}function $c(t,e){if(t.length===0)return[];let o=t.map(d=>({annotation:d,bounds:Us(d)})).filter(d=>d.bounds!==null);if(o.length===0)return[];o.sort((d,u)=>d.bounds.minY-u.bounds.minY);let n=Math.min(...o.map(d=>d.bounds.minY)),i=Math.max(...o.map(d=>d.bounds.maxY));if(i-n<=e){let d=(n+i)/2,u=Math.max(0,d-e/2);return[{top:u,bottom:u+e,annotations:t}]}let r=[],s=50,a=Math.max(0,n-s),l=[],c=a;for(let{annotation:d,bounds:u}of o){let p=u.maxY+s;if(p-a<=e)l.push(d),c=Math.max(c,p);else{if(l.length>0){let f=(a+c)/2,g=Math.max(0,f-e/2);r.push({top:g,bottom:g+e,annotations:l})}a=Math.max(0,u.minY-s),l=[d],c=u.maxY+s}}if(l.length>0){let d=(a+c)/2,u=Math.max(0,d-e/2);r.push({top:u,bottom:u+e,annotations:l})}return r}function Wc(t,e,o,n){t.save(),t.scale(n,n);for(let i of e){let r=i.points.map(s=>({x:s.x,y:s.y-o}));switch(t.strokeStyle=i.color,t.fillStyle=i.color,t.lineWidth=i.strokeWidth,t.lineCap="round",t.lineJoin="round",i.type){case"freehand":if(r.length<2)break;t.beginPath(),t.moveTo(r[0].x,r[0].y);for(let s=1;s<r.length;s++)t.lineTo(r[s].x,r[s].y);t.stroke();break;case"line":if(r.length<2)break;t.beginPath(),t.moveTo(r[0].x,r[0].y),t.lineTo(r[r.length-1].x,r[r.length-1].y),t.stroke();break;case"rectangle":{if(r.length<2)break;let s=r[0],a=r[r.length-1],l=Math.min(s.x,a.x),c=Math.min(s.y,a.y),d=Math.abs(a.x-s.x),u=Math.abs(a.y-s.y);t.strokeRect(l,c,d,u);break}case"circle":{if(r.length<2)break;let s=r[0],a=r[r.length-1],l=(s.x+a.x)/2,c=(s.y+a.y)/2,d=Math.abs(a.x-s.x)/2,u=Math.abs(a.y-s.y)/2;t.beginPath(),t.ellipse(l,c,d,u,0,0,Math.PI*2),t.stroke();break}case"text":{if(!i.text||r.length<1)break;let s=r[0],a=i.fontSize||16;t.font=`${a}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`,t.fillStyle=i.color;let c=(i.imageCount&&i.imageCount>0?`[${i.imageCount} image${i.imageCount>1?"s":""}] ${i.text}`:i.text).split(`
3
+ `),d=a*1.2,u=4,p=0;for(let f of c)p=Math.max(p,t.measureText(f).width);t.fillRect(s.x-u,s.y-u,p+u*2,c.length*d+u*2),t.fillStyle="#ffffff",c.forEach((f,g)=>{t.fillText(f,s.x,s.y+a+g*d)});break}}}t.restore()}async function Yi(t,e,o=[]){try{let n=window.devicePixelRatio||1,i=window.innerWidth,r=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 a=$c(s,r);if(a.length===0){let c=await $i(t,[],window.scrollY,i,r,n);return c?[c]:[]}let l=[];for(let c=0;c<a.length;c++){let d=a[c],u=await $i(t,d.annotations,d.top,i,r,n);u?l.push(u):console.warn(`[Screenshot] Region ${c+1} failed to capture`)}return console.log("[Screenshot] Capture complete"),l}catch(n){return console.error("[Screenshot] Capture failed:",n),[]}}async function $i(t,e,o,n,i,r){try{let s=await _c(t,{filter:c=>!(c instanceof HTMLElement&&(c.id==="devtools-canvas"||c.id==="devtools-toolbar"||c.id==="devtools-scrim"||c.dataset.devtools||c.closest("[data-devtools]"))),scale:r,backgroundColor:"#ffffff",width:n,height:i,style:{transform:`translate(${-window.scrollX}px, ${-o}px)`}}),a=document.createElement("canvas");a.width=n*r,a.height=i*r;let l=a.getContext("2d");return l?(l.drawImage(s,0,0,n*r,i*r,0,0,n*r,i*r),Wc(l,e,o,r),new Promise(c=>{a.toBlob(d=>c(d),"image/png")})):null}catch(s){return console.error("Region capture failed:",s),null}}async function oi(t){if(t.length===0)return null;if(t.length===1)return t[0];let e=await Promise.all(t.map(a=>new Promise((l,c)=>{let d=new Image;d.onload=()=>l(d),d.onerror=c,d.src=URL.createObjectURL(a)}))),o=e[0].width,n=e.reduce((a,l)=>a+l.height,0),i=document.createElement("canvas");i.width=o,i.height=n;let r=i.getContext("2d");if(!r)return null;let s=0;for(let a of e)r.drawImage(a,0,s),s+=a.height,URL.revokeObjectURL(a.src);return new Promise(a=>{i.toBlob(l=>a(l),"image/png")})}async function ii(t,e=[]){let n=window.innerWidth,i=window.innerHeight,r=Math.max(document.body.scrollHeight,document.documentElement.scrollHeight),s=window.scrollX,a=window.scrollY,l=[];try{let c=Math.ceil(r/i);for(let d=0;d<c;d++){let u=d*i;window.scrollTo(s,u),await new Promise(k=>requestAnimationFrame(()=>requestAnimationFrame(()=>k())));let p=u,f=u+i,g=e.filter(k=>{let b=Us(k);return b?b.maxY>=p&&b.minY<=f:!1}),x=await $i(t,g,u,n,Math.min(i,r-u),1);x&&l.push(x)}}finally{window.scrollTo(s,a)}return oi(l)}async function Zs(t,e,o){try{let n=Array.isArray(t)?t:[t];if(n.length===0)return!1;let i=await oi(n);if(!i)return!1;let r={"image/png":i},s=e&&e.length>0,a=o&&o.length>0;if(s||a){let l=e?e.filter(c=>{var d;return((d=c.status)!=null?d:"pending")==="pending"}):[];if(l.length>0||a){let c=ni(l,o||[]),d=new Blob([JSON.stringify(c,null,2)],{type:"text/plain"});r["text/plain"]=d}}return await navigator.clipboard.write([new ClipboardItem(r)]),!0}catch(n){return console.warn("Clipboard write failed:",n),!1}}import{useCallback as Oe,useEffect as Ge,useMemo as Cr,useRef as Ce,useState as le}from"react";import{useCallback as co,useRef as Yc}from"react";function ji(t,e,o,n){if(e.length<2)return;let i=e[0],r=e[e.length-1];if(!i||!r)return;let s=(i.x+r.x)/2,a=(i.y+r.y)/2,l=Math.abs(r.x-i.x)/2,c=Math.abs(r.y-i.y)/2;t.beginPath(),t.strokeStyle=o,t.lineWidth=n,t.ellipse(s,a,l,c,0,0,Math.PI*2),t.stroke()}function Gi(t,e,o,n){if(e.length<2)return;let i=e[0],r=e[e.length-1];if(!(!i||!r)){t.beginPath(),t.strokeStyle=o,t.lineWidth=n,t.lineCap="round",t.lineJoin="round",t.moveTo(i.x,i.y);for(let s=1;s<e.length-1;s++){let a=e[s],l=e[s+1];if(!a||!l)continue;let c=(a.x+l.x)/2,d=(a.y+l.y)/2;t.quadraticCurveTo(a.x,a.y,c,d)}t.lineTo(r.x,r.y),t.stroke()}}function Vi(t,e,o,n){if(e.length<2)return;let i=e[0],r=e[e.length-1];!i||!r||(t.beginPath(),t.strokeStyle=o,t.lineWidth=n,t.lineCap="round",t.moveTo(i.x,i.y),t.lineTo(r.x,r.y),t.stroke())}function Xi(t,e,o,n){if(e.length<2)return;let i=e[0],r=e[e.length-1];if(!i||!r)return;let s=Math.min(i.x,r.x),a=Math.min(i.y,r.y),l=Math.abs(r.x-i.x),c=Math.abs(r.y-i.y);t.beginPath(),t.strokeStyle=o,t.lineWidth=n,t.lineCap="round",t.lineJoin="round",t.strokeRect(s,a,l,c)}var ve='"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';function qs(t,e,o,n,i=12,r){if(!o)return;let s=i*1.4,a=o.split(`
4
+ `),l=r!==void 0?[r+". "+(a[0]||""),...a.slice(1)]:a;t.font=`${i}px ${ve}`,t.textBaseline="middle";let c=l.map(f=>t.measureText(f).width),d=Math.min(400,Math.max(...c)),u=l.length*s,p=l.map((f,g)=>{if(c[g]<=400)return f;let x=0,k=f.length;for(;x<k;){let b=x+k+1>>1;t.measureText(f.slice(0,b)+"\u2026").width<=400?x=b:k=b-1}return f.slice(0,x)+"\u2026"});t.fillStyle=n,t.fillRect(e.x-4,e.y-4,d+8,u+8),t.fillStyle="#ffffff",p.forEach((f,g)=>{t.fillText(f,e.x,e.y+g*s+s/2)})}var Qs=11,Ji=4,jc=`600 ${Qs}px system-ui, -apple-system, sans-serif`;function Ki(t,e,o){return t.map(n=>({x:n.x-e,y:n.y-o}))}function Gc(t,e,o,n,i,r){let s=String(n);t.font=jc;let l=t.measureText(s).width+Ji*2,c=Qs+Ji*2,d=e-l/2,u=o+r/2+2;t.fillStyle=i,t.fillRect(d,u,l,c),t.fillStyle="#ffffff",t.textBaseline="middle",t.fillText(s,d+Ji,u+c/2)}function Vc(t,e){if(t.points.length<2&&t.type!=="text")return null;switch(t.type){case"rectangle":case"freehand":{let o,n;if(t.type==="freehand")o=Math.min(...t.points.map(i=>i.x)),n=Math.max(...t.points.map(i=>i.y));else{let i=t.points[0],r=t.points[t.points.length-1];o=Math.min(i.x,r.x),n=Math.max(i.y,r.y)}return{x:o,y:n}}case"circle":{let o=t.points[0],n=t.points[t.points.length-1],i=Math.min(o.x,n.x),r=(Math.min(o.y,n.y)+Math.max(o.y,n.y))/2;return{x:i,y:r}}case"line":{let o=t.points[0],n=t.points[t.points.length-1],i=o.y>n.y?o:n;return{x:i.x,y:i.y}}default:return null}}function ta(){let t=Yc(null),e=co(()=>{let a=t.current;if(!a)return;let l=a.getContext("2d");l&&l.clearRect(0,0,a.width,a.height)},[]),o=co((a,l)=>{var f;let c=t.current;if(!c)return;let d=c.getContext("2d");if(!d)return;let p=((f=a.status)!=null?f:a.captured?"in_flight":"pending")==="pending"?a.color:"#999999";switch(a.type){case"freehand":Gi(d,a.points,p,a.strokeWidth);break;case"line":Vi(d,a.points,p,a.strokeWidth);break;case"rectangle":Xi(d,a.points,p,a.strokeWidth);break;case"circle":ji(d,a.points,p,a.strokeWidth);break;case"text":a.text&&a.points[0]&&qs(d,a.points[0],a.text,p,a.fontSize,l);break}},[]),n=co((a,l,c,d)=>{let u=t.current;if(!u||a.length<2)return;let p=u.getContext("2d");if(p)switch(l){case"freehand":Gi(p,a,c,d);break;case"line":Vi(p,a,c,d);break;case"rectangle":Xi(p,a,c,d);break;case"circle":ji(p,a,c,d);break}},[]),i=co((a,l)=>{let c=t.current;if(!c||a.points.length<2)return;let d=c.getContext("2d");if(d){if(d.fillStyle="#ffffff",d.strokeStyle=a.color,d.lineWidth=1.5,a.type==="line"){let u=a.points[0],p=a.points[a.points.length-1];[u,p].forEach(f=>{d.beginPath(),d.arc(f.x,f.y,l/2,0,Math.PI*2),d.fill(),d.stroke()});return}if(a.type==="circle"){let u=a.points[0],p=a.points[a.points.length-1],f=Math.min(u.x,p.x),g=Math.max(u.x,p.x),x=Math.min(u.y,p.y),k=Math.max(u.y,p.y),b=(f+g)/2,P=(x+k)/2;[{x:b,y:x},{x:b,y:k},{x:f,y:P},{x:g,y:P}].forEach(A=>{d.beginPath(),d.rect(A.x-l/2,A.y-l/2,l,l),d.fill(),d.stroke()});return}if(a.type==="rectangle"||a.type==="freehand"){let u,p,f,g;if(a.type==="freehand")u=Math.min(...a.points.map(k=>k.x)),p=Math.max(...a.points.map(k=>k.x)),f=Math.min(...a.points.map(k=>k.y)),g=Math.max(...a.points.map(k=>k.y));else{let k=a.points[0],b=a.points[a.points.length-1];u=Math.min(k.x,b.x),p=Math.max(k.x,b.x),f=Math.min(k.y,b.y),g=Math.max(k.y,b.y)}[{x:u,y:f},{x:p,y:f},{x:u,y:g},{x:p,y:g}].forEach(k=>{d.beginPath(),d.rect(k.x-l/2,k.y-l/2,l,l),d.fill(),d.stroke()})}}},[]),r=co((a,l,c,d,u,p,f,g=0,x=0,k)=>{var b;if(e(),a.forEach(P=>{let B=y(m({},P),{points:Ki(P.points,g,x)}),A=k==null?void 0:k.get(P.id);o(B,A)}),l.length>0){let P=Ki(l,g,x);n(P,c,d,u)}if(p&&p.length>0&&f){let P=t.current,B=P==null?void 0:P.getContext("2d");for(let A of p){let M=a.find(C=>C.id===A);if(M){let C=y(m({},M),{points:Ki(M.points,g,x)});if(i(C,f),B&&M.type!=="text"&&k&&!(M.groupId&&a.some(j=>j.groupId===M.groupId&&j.type==="text"))){let j=k.get(M.id);if(j!==void 0){let G=Vc(C,f);if(G){let O=((b=M.status)!=null?b:M.captured?"in_flight":"pending")==="pending"?M.color:"#999999";Gc(B,G.x,G.y,j,O,f)}}}}}}},[e,o,n,i]),s=co(()=>{let a=t.current;if(!a)return;let l=window.devicePixelRatio||1;a.width=window.innerWidth*l,a.height=window.innerHeight*l;let c=a.getContext("2d");c&&c.scale(l,l)},[]);return{canvasRef:t,clearCanvas:e,drawAnnotation:o,drawCurrentPath:n,redrawAll:r,resizeCanvas:s}}import{useEffect as Xc,useRef as Jc}from"react";function ea(){let t=Jc({shift:!1,cmd:!1});return Xc(()=>{let e=i=>{i.key==="Shift"&&(t.current.shift=!0),(i.key==="Meta"||i.key==="Control")&&(t.current.cmd=!0)},o=i=>{i.key==="Shift"&&(t.current.shift=!1),(i.key==="Meta"||i.key==="Control")&&(t.current.cmd=!1)},n=()=>{t.current={shift:!1,cmd:!1}};return window.addEventListener("keydown",e,!0),window.addEventListener("keyup",o,!0),window.addEventListener("blur",n),()=>{window.removeEventListener("keydown",e,!0),window.removeEventListener("keyup",o,!0),window.removeEventListener("blur",n)}},[]),t}import{useEffect as Kc}from"react";function na(t,e,o,n,i){Kc(()=>{let r=s=>{if(t){if(t.linkedSelector)return;s.preventDefault(),s.stopPropagation();let l=s.deltaY>0?-2:2;e(c=>c?y(m({},c),{fontSize:Math.max(12,Math.min(72,c.fontSize+l))}):null);return}if(!o)return;s.preventDefault();let a=n.find(l=>l.id===o);if(a&&a.type==="text"&&!a.linkedSelector){let l=a.fontSize||12,c=s.deltaY>0?-2:2;i({type:"UPDATE_TEXT_SIZE",payload:{id:o,fontSize:l+c}})}};return window.addEventListener("wheel",r,{passive:!1}),()=>{window.removeEventListener("wheel",r)}},[o,t,n,i,e])}import{useCallback as oa,useEffect as Bo,useRef as ia,useState as Vn}from"react";import{Fragment as xn,jsx as It,jsxs as Ne}from"react/jsx-runtime";var uo=22,vn=12,ra=3,sa=250,Ui=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],aa=3e3,Zi=["planning","strategizing","scheming","mapping","scoping","drafting","outlining","architecting"];function Qi(r){var s=r,{left:t,top:e,style:o,children:n}=s,i=Dn(s,["left","top","style","children"]);return It("div",y(m({"data-devtools":"badge-hit-area"},i),{style:m({position:"fixed",left:`max(0px, ${t}px)`,top:`max(0px, ${e}px)`,padding:vn,transform:`translate(min(0px, calc(100vw - max(0px, ${t}px) - 100%)), min(0px, calc(100vh - max(0px, ${e}px) - 100%)))`},o),children:n}))}function la({annotations:t,supersededAnnotations:e,inFlightIds:o,scrollX:n,scrollY:i,annotationGroupMap:r,onViewThread:s,onSelectAnnotation:a}){var x,k;let[l,c]=Vn(0),[d,u]=Vn(()=>Math.floor(Math.random()*Ui.length)),p=!!(o&&o.size>0);Bo(()=>{if(!p)return;let b=setInterval(()=>{c(B=>(B+1)%ra)},sa),P=setInterval(()=>{u(B=>(B+1)%Ui.length)},aa);return()=>{clearInterval(b),clearInterval(P)}},[p]);let f=[];for(let b of t){if(b.type!=="text"||!b.text||!b.points[0]||e.has(b))continue;let P=b.groupId?t.filter(V=>V.groupId===b.groupId):[b],B=!!(o&&(o.has(b.id)||P.some(V=>o.has(V.id)))),A=(x=b.status)!=null?x:"pending",M=P.some(V=>V.status==="resolved"||V.status==="needs_review"),C=P.some(V=>V.threadId);if(!B&&A!=="resolved"&&A!=="needs_review"&&!M&&!C)continue;let nt=b.threadId||((k=P.find(V=>V.threadId))==null?void 0:k.threadId),j=A==="needs_review"||P.some(V=>V.status==="needs_review"),G=P.reduce((V,St)=>{var Pt;return V+((Pt=St.replyCount)!=null?Pt:0)},0)||1,U=b.points[0],O=b.fontSize||12,tt=O*1.4,et=b.text.split(`
5
+ `),vt=r.get(b.id),dt=vt!==void 0?[vt+". "+(et[0]||""),...et.slice(1)]:et,Dt=document.createElement("canvas").getContext("2d");if(!Dt)continue;Dt.font=`${O}px ${ve}`;let Ot=Math.min(400,Math.max(...dt.map(V=>Dt.measureText(V).width))),At=dt.length*tt;f.push({id:b.id,threadId:nt,x:U.x+Ot+4,y:U.y-4,size:At+8,color:b.color,isInFlight:B,isNeedsReview:j,replyCount:G})}if(f.length===0)return null;let g=!!s;return It(xn,{children:f.map(b=>It(Qi,{left:b.x-n-vn,top:b.y-i-vn,onClick:g&&b.threadId?()=>{a==null||a(b.id),s(b.threadId)}:void 0,style:{pointerEvents:g?"auto":"none",cursor:g&&b.threadId?"pointer":void 0,zIndex:9999},children:It("div",{"data-devtools":"annotation-badge",style:{height:b.size,display:"flex",alignItems:"center",backgroundColor:b.color,fontFamily:ve,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:b.isInFlight?Ne(xn,{children:[It("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:l===1?Ne(xn,{children:[It("circle",{cx:"7",cy:"7",r:"2"}),It("circle",{cx:"17",cy:"7",r:"2"}),It("circle",{cx:"7",cy:"17",r:"2"}),It("circle",{cx:"17",cy:"17",r:"2"})]}):Ne(xn,{children:[It("circle",{cx:"12",cy:"6",r:"2"}),It("circle",{cx:"6",cy:"12",r:"2"}),It("circle",{cx:"18",cy:"12",r:"2"}),It("circle",{cx:"12",cy:"18",r:"2"})]})}),It("span",{style:{opacity:.7},children:Ui[d]})]}):Ne(xn,{children:[b.isNeedsReview?It("span",{style:{fontWeight:700},children:"?"}):Ne("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[It("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),It("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),It("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),It("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),Ne("span",{style:{opacity:.7},children:[b.replyCount," ",b.replyCount===1?"reply":"replies"]})]})})},b.id))})}function ca({annotations:t,supersededAnnotations:e,scrollX:o,scrollY:n,annotationGroupMap:i,planThreadId:r,taskCount:s,planStatus:a,onViewThread:l,onSelectAnnotation:c}){var p;let d=[];for(let f of t){if(f.type!=="text"||!f.text||!f.points[0]||e.has(f))continue;let g=(p=f.status)!=null?p:"pending",x=f.groupId?t.filter(et=>et.groupId===f.groupId):[f],k=x.some(et=>et.threadId===r),b=!k&&!f.planId&&(g==="in_flight"||g==="pending"||f.captured)&&!x.some(et=>et.status==="resolved"||et.status==="needs_review");if(!k&&!b||g==="resolved"||g==="needs_review")continue;let P=f.points[0],B=f.fontSize||12,A=B*1.4,M=f.text.split(`
6
+ `),C=i.get(f.id),nt=C!==void 0?[C+". "+(M[0]||""),...M.slice(1)]:M,G=document.createElement("canvas").getContext("2d");if(!G)continue;G.font=`${B}px ${ve}`;let U=Math.min(400,Math.max(...nt.map(et=>G.measureText(et).width))),tt=nt.length*A+8;d.push({annotation:f,x:P.x+U+4,y:P.y-4,size:tt,groupNumber:C})}if(d.length===0)return null;let u=a==="planning";return It(xn,{children:d.map(({annotation:f,x:g,y:x,size:k})=>u?It(Uc,{x:g-o,y:x-n,size:k,color:f.color,onClick:()=>{c==null||c(f.id),l(r)}},`plan-thinking-${f.id}`):It(Qi,{left:g-o-vn,top:x-n-vn,onClick:()=>{c==null||c(f.id),l(r)},style:{cursor:"pointer",zIndex:9999,pointerEvents:"auto"},children:Ne("div",{"data-devtools":"plan-waiting-badge",style:{height:k,display:"flex",alignItems:"center",backgroundColor:f.color,fontFamily:ve,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:[Ne("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[It("circle",{cx:"12",cy:"12",r:"10"}),It("path",{d:"M9.09 9a3 3 0 015.83 1c0 2-3 3-3 3"}),It("line",{x1:"12",y1:"17",x2:"12.01",y2:"17"})]}),Ne("span",{style:{opacity:.7},children:[s," task",s!==1?"s":""," \u2014 approve?"]})]})},`plan-waiting-${f.id}`))})}function Uc({x:t,y:e,size:o,color:n,onClick:i}){let[r,s]=Vn(0),[a,l]=Vn(()=>Math.floor(Math.random()*Zi.length));return Bo(()=>{let c=setInterval(()=>{s(u=>(u+1)%ra)},sa),d=setInterval(()=>{l(u=>(u+1)%Zi.length)},aa);return()=>{clearInterval(c),clearInterval(d)}},[]),It(Qi,{left:t-vn,top:e-vn,onClick:i,style:{pointerEvents:i?"auto":"none",cursor:i?"pointer":void 0,zIndex:9999},children:Ne("div",{"data-devtools":"plan-thinking-badge",style:{height:o,display:"flex",alignItems:"center",backgroundColor:n,fontFamily:ve,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:[It("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:r===1?Ne(xn,{children:[It("circle",{cx:"7",cy:"7",r:"2"}),It("circle",{cx:"17",cy:"7",r:"2"}),It("circle",{cx:"7",cy:"17",r:"2"}),It("circle",{cx:"17",cy:"17",r:"2"})]}):Ne(xn,{children:[It("circle",{cx:"12",cy:"6",r:"2"}),It("circle",{cx:"6",cy:"12",r:"2"}),It("circle",{cx:"18",cy:"12",r:"2"}),It("circle",{cx:"12",cy:"18",r:"2"})]})}),It("span",{style:{opacity:.7},children:Zi[a]})]})})}function tr({inFlightSelectorColors:t,animated:e=!0}){let[o,n]=Vn([]);if(Bo(()=>{if(t.size===0){n([]);return}let r=null,s=()=>{let c=[];for(let[d,u]of t){let p=Je(d);if(!p)continue;let f=p.getBoundingClientRect();c.push({selector:d,top:f.top,left:f.left,width:f.width,height:f.height,color:u})}n(c)},a=()=>{r&&cancelAnimationFrame(r),r=requestAnimationFrame(s)};s(),window.addEventListener("scroll",a,!0),window.addEventListener("resize",a,!0);let l=new MutationObserver(a);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",a,!0),window.removeEventListener("resize",a,!0),l.disconnect(),r&&cancelAnimationFrame(r)}},[t]),o.length===0)return null;let i={position:"absolute",width:2,height:2,pointerEvents:"none"};return Ne(xn,{children:[e&&It("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),o.map(r=>Ne("div",{"data-devtools":"marching-ants",style:{position:"fixed",top:r.top,left:r.left,width:r.width,height:r.height,pointerEvents:"none",zIndex:9995,overflow:"visible"},children:[It("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible"},children:It("rect",{x:"0.5",y:"0.5",width:Math.max(0,r.width-1),height:Math.max(0,r.height-1),fill:"none",stroke:r.color,strokeWidth:"1",strokeDasharray:"2 4",style:e?{animation:"popmelt-march 0.5s steps(2) infinite"}:void 0})}),It("div",{style:y(m({},i),{top:-1,left:-1,backgroundColor:r.color})}),It("div",{style:y(m({},i),{top:-1,right:-1,backgroundColor:r.color})}),It("div",{style:y(m({},i),{bottom:-1,left:-1,backgroundColor:r.color})}),It("div",{style:y(m({},i),{bottom:-1,right:-1,backgroundColor:r.color})})]},r.selector))]})}function da({annotations:t,supersededAnnotations:e,scrollX:o,scrollY:n,onReply:i,annotationGroupMap:r}){let s=t.filter(c=>e.has(c)?!1:c.status==="waiting_input"&&c.question&&c.threadId);if(s.length===0)return null;let a=new Set,l=[];for(let c of s){if(!c.threadId||a.has(c.threadId))continue;a.add(c.threadId);let d=c.type==="text"?c:t.find(u=>u.groupId&&u.groupId===c.groupId&&u.type==="text")||c;if(d.type==="text"&&d.text&&d.points[0]){let u=d.points[0],p=d.fontSize||12,f=p*1.4,g=d.text.split(`
7
+ `),x=r.get(d.id),k=x!==void 0?[x+". "+(g[0]||""),...g.slice(1)]:g,P=document.createElement("canvas").getContext("2d");if(!P)continue;P.font=`${p}px ${ve}`;let B=Math.min(400,Math.max(...k.map(C=>P.measureText(C).width))),M=k.length*f+8;l.push({annotation:c,x:u.x+B+4,y:u.y-4,size:M})}}return l.length===0?null:It(xn,{children:l.map(({annotation:c,x:d,y:u,size:p})=>It(Zc,{annotation:c,x:d-o,y:u-n,size:p,onReply:i},`question-${c.threadId}`))})}function Zc({annotation:t,x:e,y:o,size:n,onReply:i}){let[r,s]=Vn(!1),[a,l]=Vn(""),c=ia(null),d=ia(null);Bo(()=>{r&&c.current&&c.current.focus()},[r]),Bo(()=>{if(!r)return;let x=b=>{d.current&&!d.current.contains(b.target)&&s(!1)},k=b=>{b.key==="Escape"&&s(!1)};return document.addEventListener("mousedown",x),document.addEventListener("keydown",k),()=>{document.removeEventListener("mousedown",x),document.removeEventListener("keydown",k)}},[r]);let u=oa(()=>{!a.trim()||!t.threadId||(i(t.threadId,a.trim()),l(""),s(!1))},[a,t.threadId,i]),p=oa(x=>{x.key==="Enter"&&(x.metaKey||x.ctrlKey)&&(x.preventDefault(),u())},[u]),f=r?e:e-vn,g=r?o:o-vn;return Ne("div",{ref:d,"data-devtools":"question-badge",style:{position:"fixed",left:`max(0px, ${f}px)`,top:`max(0px, ${g}px)`,padding:r?0:vn,transform:`translate(min(0px, calc(100vw - max(0px, ${f}px) - 100%)), min(0px, calc(100vh - max(0px, ${g}px) - 100%)))`,zIndex:r?10002:9999,pointerEvents:"auto",cursor:r?void 0:"pointer"},children:[!r&&Ne("div",{onClick:()=>s(!0),style:{height:n,display:"flex",alignItems:"center",backgroundColor:t.color,padding:`0 ${4}px`,gap:4,fontFamily:ve,fontSize:12,color:"#ffffff",whiteSpace:"nowrap"},children:[Ne("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[It("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),It("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),It("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),It("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),It("span",{style:{opacity:.7},children:"reply?"})]}),r&&Ne("div",{style:{minWidth:260,maxWidth:360,backgroundColor:"#ffffff",fontFamily:ve,fontSize:12,color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)"},children:[It("div",{style:{padding:`${6}px ${8}px`,lineHeight:1.4},children:t.question}),Ne("div",{style:{padding:`0 ${4}px ${4}px`},children:[It("textarea",{ref:c,value:a,onChange:x=>l(x.target.value),onKeyDown:p,placeholder:"Type your reply...",style:{width:"100%",minHeight:40,padding:4,fontSize:12,fontFamily:ve,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"}}),It("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:4},children:It("button",{onClick:u,disabled:!a.trim(),style:{padding:"4px 12px",fontSize:11,fontFamily:ve,fontWeight:600,backgroundColor:a.trim()?t.color:"rgba(0,0,0,0.1)",color:a.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:a.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}function ri(t){var r;let e=new Set,o=new Map;for(let s of t){if(!s.linkedSelector)continue;let a=o.get(s.linkedSelector)||[];a.push(s),o.set(s.linkedSelector,a)}let n=new Set,i=new Set;for(let s of o.values()){if(s.length<=1){(r=s[0])!=null&&r.groupId&&i.add(s[0].groupId);continue}s.sort((l,c)=>c.timestamp-l.timestamp);let a=s[0];a.groupId&&i.add(a.groupId);for(let l=1;l<s.length;l++){let c=s[l];e.add(c),c.groupId&&n.add(c.groupId)}}for(let s of t)s.groupId&&n.has(s.groupId)&&!i.has(s.groupId)&&e.add(s);return e}import{useEffect as ua,useLayoutEffect as qc,useState as pa}from"react";import{jsx as er,jsxs as ga}from"react/jsx-runtime";function Qc(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${e})`:`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}var fa=["top-left","top-right","bottom-right","bottom-left"];function ma({element:t,radius:e,accentColor:o,hoveredCorner:n,draggingCorner:i,cursorViewport:r}){let[s,a]=pa(null),[l,c]=pa(!1);if(ua(()=>{let b=A=>{(A.key==="Meta"||A.key==="Control")&&c(!0)},P=A=>{(A.key==="Meta"||A.key==="Control")&&c(!1)},B=()=>c(!1);return window.addEventListener("keydown",b,!0),window.addEventListener("keyup",P,!0),window.addEventListener("blur",B),()=>{window.removeEventListener("keydown",b,!0),window.removeEventListener("keyup",P,!0),window.removeEventListener("blur",B)}},[]),ua(()=>{if(!t){a(null);return}let b=()=>{a(t.getBoundingClientRect())};return b(),window.addEventListener("scroll",b,{passive:!0}),window.addEventListener("resize",b,{passive:!0}),()=>{window.removeEventListener("scroll",b),window.removeEventListener("resize",b)}},[t]),qc(()=>{t&&a(t.getBoundingClientRect())},[t,e["top-left"],e["top-right"],e["bottom-right"],e["bottom-left"]]),!s)return null;let d=s.width,u=s.height,p=Qc(o,.2),f={"top-left":{x:0,y:e["top-left"]},"top-right":{x:d,y:e["top-right"]},"bottom-right":{x:d,y:u-e["bottom-right"]},"bottom-left":{x:0,y:u-e["bottom-left"]}},g=new Set,x=i!=null?i:n;if(x)if(l)g.add(x);else for(let b of fa)g.add(b);let k={position:"fixed",top:s.top,left:s.left,width:d,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"};return ga("div",{"data-devtools":"border-radius-handles",style:k,children:[ga("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${u}`,children:[er("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"}),fa.map(b=>{let P=f[b],B=g.has(b);return er("circle",{cx:P.x,cy:P.y,r:b===(i!=null?i:n)?3:2.5,fill:o,stroke:"#ffffff",strokeWidth:b===(i!=null?i:n)?4:2,paintOrder:"stroke"},b)})]}),r&&x&&(()=>{let b=Math.round(e[x]);return er("div",{style:{position:"fixed",left:r.x+8,top:r.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:b})})()]})}import{useEffect as td,useState as ed}from"react";function Xn(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);if(o)return`oklch(${o[1]} / ${e})`;let n=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t);if(n){let i=parseInt(n[1],16),r=parseInt(n[2],16),s=parseInt(n[3],16);return`rgba(${i}, ${r}, ${s}, ${e})`}return`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}import{Fragment as nd,jsx as Jn,jsxs as No}from"react/jsx-runtime";function po({element:t,isSelected:e=!1,elementInfo:o,color:n="#3b82f6",annotationNumber:i,changeCount:r,hideTooltip:s=!1}){let[a,l]=ed(null);if(td(()=>{if(!t){l(null);return}let C=()=>{let nt=t.getBoundingClientRect();l(nt)};return C(),window.addEventListener("scroll",C,{passive:!0}),window.addEventListener("resize",C,{passive:!0}),()=>{window.removeEventListener("scroll",C),window.removeEventListener("resize",C)}},[t]),!a||!t)return null;let c={position:"fixed",top:a.top,left:a.left,width:a.width,height:a.height,pointerEvents:"none",zIndex:9996,backgroundColor:e?Xn(n,.1):Xn(n,.05),overflow:"visible"},d={position:"absolute",width:2,height:2,backgroundColor:n,pointerEvents:"none"},u=t.tagName.toLowerCase(),p=t.id?`#${t.id}`:"",f=t.classList.length>0?"."+Array.from(t.classList).slice(0,2).join("."):"",g=o==null?void 0:o.reactComponent,x=g?`<${g}> ${u}${p}${f}`:`${u}${p}${f}`,k=22,b=a.height>=window.innerHeight,P=b?0:a.top>=k?a.top-k:a.bottom,B=b?{position:"absolute",top:8,left:8,zIndex:9997,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,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400}:{position:"fixed",top:P,left:a.left,zIndex:9997,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,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400},M=!s&&No("div",{"data-devtools":"tooltip",style:B,children:[i!==void 0&&No("span",{children:[i,"."]}),Jn("span",{style:{overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0},children:x}),r!==void 0&&r>0&&No("span",{style:{opacity:.8},children:["(",r," ",r===1?"change":"changes",")"]})]});return No(nd,{children:[No("div",{"data-devtools":"highlight",style:c,children:[Jn("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:Jn("rect",m({x:"0.5",y:"0.5",width:Math.max(0,a.width-1),height:Math.max(0,a.height-1),fill:"none",stroke:n,strokeWidth:"1"},!e&&{strokeDasharray:"2 4"}))}),Jn("div",{style:y(m({},d),{top:-1,left:-1})}),Jn("div",{style:y(m({},d),{top:-1,right:-1})}),Jn("div",{style:y(m({},d),{bottom:-1,left:-1})}),Jn("div",{style:y(m({},d),{bottom:-1,right:-1})}),b&&M]}),!b&&M]})}import{useEffect as ha,useLayoutEffect as od,useState as nr}from"react";import{jsx as In,jsxs as ir}from"react/jsx-runtime";function or(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${e})`:`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}function rr({element:t,gap:e,accentColor:o,hoveredAxis:n,draggingAxis:i,cursorViewport:r,isAutoGap:s=!1,refreshKey:a=0}){let[l,c]=nr(null),[d,u]=nr([]),[p,f]=nr(!1);if(ha(()=>{let j=O=>{(O.key==="Meta"||O.key==="Control")&&f(!0)},G=O=>{(O.key==="Meta"||O.key==="Control")&&f(!1)},U=()=>f(!1);return window.addEventListener("keydown",j,!0),window.addEventListener("keyup",G,!0),window.addEventListener("blur",U),()=>{window.removeEventListener("keydown",j,!0),window.removeEventListener("keyup",G,!0),window.removeEventListener("blur",U)}},[]),ha(()=>{if(!t){c(null),u([]);return}let j=()=>{c(t.getBoundingClientRect()),u(jn(t))};return j(),window.addEventListener("scroll",j,{passive:!0}),window.addEventListener("resize",j,{passive:!0}),()=>{window.removeEventListener("scroll",j),window.removeEventListener("resize",j)}},[t]),od(()=>{t&&(c(t.getBoundingClientRect()),u(jn(t)))},[t,e.row,e.column,a]),!l||d.length===0)return null;let g=l.width,x=l.height,k="pm-gap-stripe-pattern",b=or(o,.25),P=or(o,.1),B=or(o,.2),A=8,M=2,C={position:"fixed",top:l.top,left:l.left,width:g,height:x,pointerEvents:"none",zIndex:9996,overflow:"visible"},nt=i!=null?i:n;return ir("div",{"data-devtools":"gap-handles",style:C,children:[ir("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${g} ${x}`,children:[In("defs",{children:In("pattern",{id:k,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:In("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:b,strokeWidth:"1.5"})})}),In("rect",{x:"0.5",y:"0.5",width:Math.max(0,g-1),height:Math.max(0,x-1),fill:"none",stroke:B,strokeWidth:"1"}),d.map((j,G)=>{let U=j.x-l.left,O=j.y-l.top,tt=j.w,et=j.h,vt=p?j.axis===nt:!0;return(j.axis==="row"?e.row:e.column)===0?null:ir("g",{opacity:vt?1:.6,children:[In("rect",{x:U,y:O,width:tt,height:et,fill:P}),In("rect",{x:U,y:O,width:tt,height:et,fill:`url(#${k})`})]},G)}),nt&&(()=>{let j=d.filter(St=>St.axis===nt);if(j.length===0)return null;let G=j[0];if(r&&j.length>1){let St=1/0;for(let Pt of j){let Kt=Pt.x+Pt.w/2,ee=Pt.y+Pt.h/2,lt=Math.abs(r.x-Kt)+Math.abs(r.y-ee);lt<St&&(St=lt,G=Pt)}}let U=G.x-l.left,O=G.y-l.top,tt=G.w,et=G.h,vt=U+tt/2,dt=O+et/2;if(s)return In("circle",{cx:vt,cy:dt,r:1.5,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let bt=nt==="column",Dt=bt?M:A,Ot=bt?A:M,At=vt-Dt/2,V=dt-Ot/2;return In("rect",{x:At,y:V,width:Dt,height:Ot,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),r&&nt&&(()=>{let j=s?"auto":String(Math.round(nt==="row"?e.row:e.column));return In("div",{style:{position:"fixed",left:r.x+8,top:r.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:j})})()]})}import{useCallback as ld,useEffect as cd,useState as dd}from"react";import{useEffect as id,useState as ya}from"react";var rd=3,sd=250,sr=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],ad=3e3;function si(t){let[e,o]=ya(0),[n,i]=ya(()=>Math.floor(Math.random()*sr.length));return id(()=>{if(!t)return;let r=setInterval(()=>o(a=>(a+1)%rd),sd),s=setInterval(()=>i(a=>(a+1)%sr.length),ad);return()=>{clearInterval(r),clearInterval(s)}},[t]),{charIndex:e,word:sr[n]}}import{Fragment as ar,jsx as cn,jsxs as fo}from"react/jsx-runtime";function ud(t){let{element:e}=t,o=e.tagName,n=e.id?`#${e.id}`:"",i=e.className?"."+e.className.split(" ").slice(0,2).join("."):"",r=e.reactComponent;return r?`<${r}> ${o}${n}${i}`:`${o}${n}${i}`}var ba=22,lr=12;function pd(r){var s=r,{left:t,top:e,style:o,children:n}=s,i=Dn(s,["left","top","style","children"]);return cn("div",y(m({"data-devtools":"badge-hit-area"},i),{style:m({position:"fixed",left:`max(0px, ${t}px)`,top:`max(0px, ${e}px)`,padding:lr,transform:`translate(min(0px, calc(100vw - max(0px, ${t}px) - 100%)), min(0px, calc(100vh - max(0px, ${e}px) - 100%)))`},o),children:n}))}function xa({styleModifications:t,isInspecting:e,accentColor:o,annotationGroupCount:n,dispatch:i,inFlightSelectors:r}){let[s,a]=dd([]),l=r&&r.size>0,{charIndex:c,word:d}=si(!!l);cd(()=>{if(e){a([]);return}let g=null,x=()=>{let P=[];t.forEach((B,A)=>{let M=Je(B.selector);if(!M)return;let C=M.getBoundingClientRect();P.push({selector:B.selector,modIndex:A,top:C.top>=ba?C.top-ba:C.bottom,left:C.left,label:ud(B),changeCount:B.changes.length,annotationNumber:n+A+1})}),a(P)},k=()=>{g&&cancelAnimationFrame(g),g=requestAnimationFrame(x)};x(),window.addEventListener("scroll",k,!0),window.addEventListener("resize",k,!0);let b=new MutationObserver(k);return b.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),window.addEventListener("load",k),document.fonts.ready.then(k),()=>{window.removeEventListener("scroll",k,!0),window.removeEventListener("resize",k,!0),window.removeEventListener("load",k),b.disconnect(),g&&cancelAnimationFrame(g)}},[t,e,n]);let u=ld(g=>{let x=t[g];if(!x)return;let k=Je(x.selector);k&&(i({type:"SELECT_ANNOTATION",payload:{id:null}}),i({type:"SET_TOOL",payload:"inspector"}),i({type:"SELECT_ELEMENT",payload:{el:k,info:x.element}}))},[t,i]);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},f={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return cn(ar,{children:s.map(g=>{let x=r==null?void 0:r.has(g.selector);return cn(pd,{left:g.left-lr,top:g.top-lr,onClick:()=>u(g.modIndex),style:{zIndex:1e4,cursor:"pointer",pointerEvents:"auto"},children:fo("div",{"data-devtools":"badge",style:y(m({},p),{backgroundColor:x?"#999999":o}),children:[fo("span",{children:[g.annotationNumber,"."]}),cn("span",{style:f,children:g.label}),fo("span",{style:{opacity:.8},children:["(",g.changeCount," ",g.changeCount===1?"change":"changes",")"]}),x&&fo("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[cn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?fo(ar,{children:[cn("circle",{cx:"7",cy:"7",r:"2"}),cn("circle",{cx:"17",cy:"7",r:"2"}),cn("circle",{cx:"7",cy:"17",r:"2"}),cn("circle",{cx:"17",cy:"17",r:"2"})]}):fo(ar,{children:[cn("circle",{cx:"12",cy:"6",r:"2"}),cn("circle",{cx:"6",cy:"12",r:"2"}),cn("circle",{cx:"18",cy:"12",r:"2"}),cn("circle",{cx:"12",cy:"18",r:"2"})]})}),d]})]})},g.selector)})})}import{useEffect as fd,useState as gd}from"react";import{Fragment as hd,jsx as va}from"react/jsx-runtime";function md(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${e})`:`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}function Sa({styleModifications:t,accentColor:e}){let[o,n]=gd([]);if(fd(()=>{let r=null,s=()=>{let c=[];for(let d of t){let u=Je(d.selector);if(!u)continue;let p=u.getBoundingClientRect();if(p.width===0&&p.height===0)continue;let f=Gn(u);c.push({selector:d.selector,top:p.top,left:p.left,width:p.width,height:p.height,borderRadius:`${f["top-left"]}px ${f["top-right"]}px ${f["bottom-right"]}px ${f["bottom-left"]}px`})}n(c)},a=()=>{r&&cancelAnimationFrame(r),r=requestAnimationFrame(s)};s(),window.addEventListener("scroll",a,{passive:!0}),window.addEventListener("resize",a,{passive:!0});let l=new MutationObserver(a);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",a),window.removeEventListener("resize",a),l.disconnect(),r&&cancelAnimationFrame(r)}},[t]),o.length===0)return null;let i=md(e,.2);return va(hd,{children:o.map(r=>{let s={position:"fixed",top:r.top,left:r.left,width:r.width,height:r.height,pointerEvents:"none",zIndex:9995,border:`1px solid ${i}`,borderRadius:r.borderRadius,boxSizing:"border-box"};return va("div",{"data-devtools":"mod-border",style:s},r.selector)})})}import{useEffect as wa,useLayoutEffect as yd,useState as ka}from"react";import{jsx as Fn,jsxs as dr}from"react/jsx-runtime";function cr(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${e})`:`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}var bd={top:"bottom",bottom:"top",left:"right",right:"left"};function ur({element:t,padding:e,accentColor:o,hoveredSide:n,draggingSide:i,cursorViewport:r,refreshKey:s}){let[a,l]=ka(null),[c,d]=ka(!1);if(wa(()=>{let tt=dt=>{(dt.key==="Meta"||dt.key==="Control")&&d(!0)},et=dt=>{(dt.key==="Meta"||dt.key==="Control")&&d(!1)},vt=()=>d(!1);return window.addEventListener("keydown",tt,!0),window.addEventListener("keyup",et,!0),window.addEventListener("blur",vt),()=>{window.removeEventListener("keydown",tt,!0),window.removeEventListener("keyup",et,!0),window.removeEventListener("blur",vt)}},[]),wa(()=>{if(!t){l(null);return}let tt=()=>{l(t.getBoundingClientRect())};return tt(),window.addEventListener("scroll",tt,{passive:!0}),window.addEventListener("resize",tt,{passive:!0}),()=>{window.removeEventListener("scroll",tt),window.removeEventListener("resize",tt)}},[t]),yd(()=>{t&&l(t.getBoundingClientRect())},[t,e.top,e.right,e.bottom,e.left,s]),!a)return null;let u=a.width,p=a.height,{top:f,right:g,bottom:x,left:k}=e,b="pm-stripe-pattern",P=cr(o,.25),B=cr(o,.1),A=cr(o,.2),M=8,C=2,nt={position:"fixed",top:a.top,left:a.left,width:u,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"},j=["top","right","bottom","left"],G={top:`0,0 ${u},0 ${u-g},${f} ${k},${f}`,right:`${u},0 ${u},${p} ${u-g},${p-x} ${u-g},${f}`,bottom:`0,${p} ${k},${p-x} ${u-g},${p-x} ${u},${p}`,left:`0,0 ${k},${f} ${k},${p-x} 0,${p}`},U={top:{x:u/2-M/2,y:f/2-C/2,w:M,h:C},bottom:{x:u/2-M/2,y:p-x/2-C/2,w:M,h:C},left:{x:k/2-C/2,y:p/2-M/2,w:C,h:M},right:{x:u-g/2-C/2,y:p/2-M/2,w:C,h:M}},O=new Set;return i?O.add(i):n&&(O.add(n),c||O.add(bd[n])),dr("div",{"data-devtools":"padding-handles",style:nt,children:[dr("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:b,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Fn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:P,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:A,strokeWidth:"1"}),j.map(tt=>{if(e[tt]<=0)return null;let vt=O.has(tt);return dr("g",{opacity:vt?1:.6,children:[Fn("polygon",{points:G[tt],fill:B}),Fn("polygon",{points:G[tt],fill:`url(#${b})`})]},tt)}),j.map(tt=>{let et=U[tt],vt=O.has(tt);return Fn("rect",{x:et.x,y:et.y,width:et.w,height:et.h,fill:o,stroke:"#ffffff",strokeWidth:vt?4:2,paintOrder:"stroke"},`handle-${tt}`)})]}),r&&(n||i)&&(()=>{let tt=i!=null?i:n,et=Math.round(e[tt]);return Fn("div",{style:{position:"fixed",left:r.x+8,top:r.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:et})})()]})}import{useCallback as wn,useEffect as pn,useMemo as fi,useRef as an,useState as He}from"react";import{Check as pi,ChevronDown as xr,MoveHorizontal as Da,RotateCcw as Yd,Shrink as jd,X as Gd}from"lucide-react";var xd="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",gn={borderWidth:3,borderStyle:"solid",borderImage:`url("${xd}") 4 / 1.9 / 0 round`};var ai={"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 go(t){var e,o;return(o=(e=ai[t])==null?void 0:e[0])!=null?o:"px"}function Hn(t){let e=t.match(/^([\d.-]+)(.*)$/);return e?{num:parseFloat(e[1]),unit:e[2]||""}:{num:0,unit:""}}function li(t,e,o,n){let i=t.trim();if(!i)return"";let r=i.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i);if(r)return`${parseFloat(r[1])}${r[2].toLowerCase()}`;let s=parseFloat(i);if(!isNaN(s)){if(n){let{unit:a}=Hn(o);return`${s}${a||go(e)}`}return`${s}${go(e)}`}return i}function pr(t,e){if(!e||e==="px")return t;if(e==="rem"){let o=parseFloat(getComputedStyle(document.documentElement).fontSize)||16;return Math.round(t/o*1e3)/1e3}return t}import{useCallback as vd,useEffect as Sd,useRef as Ca,useState as wd}from"react";import{Plus as Ea,X as kd}from"lucide-react";import{jsx as sn,jsxs as Kn}from"react/jsx-runtime";var ci=[{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 Cd(t){if(!t||t==="none")return[];let e=[],o=/([\w-]+)\(([^)]+)\)/g,n;for(;(n=o.exec(t))!==null;){let i=n[1],r=n[2],s=parseFloat(r);isNaN(s)||e.push({name:i,value:s})}return e}function fr(t){return t.length===0?"none":t.map(e=>{var i;let o=ci.find(r=>r.name===e.name),n=(i=o==null?void 0:o.unit)!=null?i:"";return`${e.name}(${e.value}${n})`}).join(" ")}function Ta({value:t,onChange:e,accentColor:o,modified:n,panelContentRef:i}){let r=Cd(t),[s,a]=wd(!1),l=Ca(null),c=Ca(null);Sd(()=>{if(!s)return;let B=A=>{l.current&&!l.current.contains(A.target)&&a(!1)};return document.addEventListener("mousedown",B,!0),()=>document.removeEventListener("mousedown",B,!0)},[s]);let d=ci.filter(B=>!r.some(A=>A.name===B.name)),u=B=>{let A=[...r,{name:B.name,value:B.defaultValue}];e(fr(A)),a(!1)},p=B=>{let A=r.filter((M,C)=>C!==B);e(fr(A))},f=(B,A)=>{let M=r.map((C,nt)=>nt===B?y(m({},C),{value:A}):C);e(fr(M))},g={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},x=vd(B=>{var O;if(!c.current)return{position:"fixed",top:0,left:0};let A=c.current.getBoundingClientRect(),M=c.current.closest('[data-devtools="panel"]'),C=M?M.getBoundingClientRect():{top:0,left:0,bottom:9999},nt=(O=i==null?void 0:i.current)==null?void 0:O.getBoundingClientRect(),j=B*24+8,U=C.bottom-A.bottom<j;return y(m({position:"fixed"},U?{bottom:C.bottom-A.top+2-C.top}:{top:A.bottom+2-C.top}),{left:nt?nt.left+4-C.left:A.left-C.left,width:nt?nt.width-8:140,zIndex:10001})},[i]),k={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)"},b={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"},P=B=>sn("div",{ref:l,style:m(m({},x(B.length)),k),children:B.map(A=>sn("button",{type:"button",onClick:()=>u(A),style:b,onMouseEnter:M=>{M.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:M=>{M.currentTarget.style.backgroundColor="transparent"},children:A.label},A.name))});return r.length===0?Kn("div",{children:[Kn("div",{style:{display:"flex",alignItems:"center",gap:4},children:[sn(Ln,{modified:!1,children:sn("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:y(m({},g),{color:"#999",cursor:"default"})})}),sn("button",{ref:c,type:"button",onClick:()=>a(!s),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,padding:0,border:"none",borderRadius:2,backgroundColor:"transparent",color:"#94a3b8",cursor:"pointer",flexShrink:0},children:sn(Ea,{size:12})})]}),s&&P(ci)]}):Kn("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[r.map((B,A)=>{let M=ci.find(C=>C.name===B.name);return M?Kn("div",{style:{display:"flex",alignItems:"center",gap:4},children:[sn("span",{style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:n?o:"#94a3b8",fontWeight:n?600:400,width:56,flexShrink:0,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:M.label}),sn(Ln,{modified:n,children:Kn("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[sn("input",{type:"range",min:M.min,max:M.max,step:M.step,value:B.value,onChange:C=>f(A,parseFloat(C.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${o} ${(B.value-M.min)/(M.max-M.min)*100}%, rgba(0,0,0,0.1) ${(B.value-M.min)/(M.max-M.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),sn("input",{type:"number",min:M.min,max:M.max,step:M.step,value:M.unit==="px"||M.unit==="deg"?Math.round(B.value):Math.round(B.value*100)/100,onChange:C=>f(A,parseFloat(C.target.value)||0),style:y(m({},g),{width:44,padding:"2px 4px",textAlign:"right",flexShrink:0})}),M.unit&&sn("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:M.unit})]})}),sn("button",{type:"button",onClick:()=>p(A),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:sn(kd,{size:10})})]},B.name):null}),d.length>0&&Kn("div",{children:[Kn("button",{ref:c,type:"button",onClick:()=>a(!s),style:{display:"flex",alignItems:"center",gap:4,padding:"2px 4px",border:"none",borderRadius:2,backgroundColor:"transparent",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#94a3b8",cursor:"pointer"},children:[sn(Ea,{size:10}),"Add filter"]}),s&&P(d)]})]})}import{useCallback as ho,useEffect as Id,useRef as di,useState as Ma}from"react";import{AlignHorizontalSpaceAround as Ld,AlignVerticalSpaceAround as Rd,Columns3 as Ad,Grid2x2 as Pd,RectangleHorizontal as Bd,Rows3 as Nd,UnfoldHorizontal as Ia,UnfoldVertical as La}from"lucide-react";import{useCallback as Ed,useEffect as Td,useRef as Do}from"react";import{jsx as Md}from"react/jsx-runtime";var gr=[0,1,2,4,8,12,16,20,24,28,32];function mo({value:t,onChange:e,onPreview:o,onScrubEnd:n,onReset:i,isModified:r,accentColor:s,defaultUnit:a="rem",snapSteps:l,color:c,style:d,children:u}){let p=Do(null),f=Do(null),g=Do(i),x=Do(r),k=Do(!1);g.current=i,x.current=r,Td(()=>{let P=A=>{let M=f.current;if(!M)return;M.hasMoved=!0,k.current=A.shiftKey;let C=M.unit==="rem"||M.unit==="em"?.1:1;M.accum+=A.movementX*C;let nt=Math.max(0,Math.round((M.startValue+M.accum)*10)/10);if(A.shiftKey&&l){let j=M.unit==="rem"||M.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,G=M.unit==="rem"||M.unit==="em"?nt*j:nt,U=l[l.length-1];for(let O=0;O<l.length-1;O++){let tt=l[O],et=l[O+1];if(G<=(tt+et)/2){U=tt;break}if(G<et){U=et;break}}G>l[l.length-1]&&(U=Math.round(G/8)*8),nt=M.unit==="rem"||M.unit==="em"?Math.round(U/j*1e3)/1e3:U}o==null||o(`${nt}${M.unit}`)},B=()=>{let A=f.current;if(!A)return;let M=Math.max(0,Math.round((A.startValue+A.accum)*10)/10);if(k.current&&l){let nt=A.unit==="rem"||A.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,j=A.unit==="rem"||A.unit==="em"?M*nt:M,G=l[l.length-1];for(let U=0;U<l.length-1;U++){let O=l[U],tt=l[U+1];if(j<=(O+tt)/2){G=O;break}if(j<tt){G=tt;break}}j>l[l.length-1]&&(G=Math.round(j/8)*8),M=A.unit==="rem"||A.unit==="em"?Math.round(G/nt*1e3)/1e3:G}let C=A.hasMoved&&M!==A.startValue;f.current=null,document.exitPointerLock(),C?e(`${M}${A.unit}`):A.hasMoved?o==null||o(`${A.startValue}${A.unit}`):x.current&&g.current&&g.current(),n==null||n()};return document.addEventListener("mousemove",P),document.addEventListener("mouseup",B),()=>{document.removeEventListener("mousemove",P),document.removeEventListener("mouseup",B)}},[e,o,n]);let b=Ed(P=>{var M;if(P.button!==0)return;P.preventDefault();let B=Hn(t),A=B.unit&&B.unit!=="px"?B.unit:a;f.current={startValue:B.num,unit:A,accum:0,hasMoved:!1},(M=p.current)==null||M.requestPointerLock()},[t,a]);return Md("span",{ref:p,onMouseDown:b,title:r?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:m({color:r?s||"#3b82f6":c||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize"},d),children:u})}import{Fragment as mr,jsx as Tt,jsxs as De}from"react/jsx-runtime";function Dd({gridCols:t,gridRows:e,gridModified:o,accentColor:n,onColsChange:i,onRowsChange:r}){return Tt(dn,{style:{width:100},children:De("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[Tt("input",{type:"number",min:1,max:12,value:t,onChange:s=>i(parseInt(s.target.value)||1),style:y(m({},Fe),{width:32,textAlign:"center",padding:2})}),Tt("span",{style:{fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:o?n:"#999",fontWeight:o?600:400,fontSize:11,margin:"0 4px"},children:"\xD7"}),Tt("input",{type:"number",min:1,max:12,value:e,onChange:s=>r(parseInt(s.target.value)||1),style:y(m({},Fe),{width:32,textAlign:"center",padding:2})})]})})}function Ra({element:t,getValue:e,getOriginalValue:o,handleChange:n,isModified:i,onResetProperty:r,isCollapsed:s,onToggle:a,sectionHeaderStyle:l,activeDropdown:c,onDropdownChange:d,panelContentRef:u,accentColor:p,onFieldHover:f,preferredUnit:g,onUnitCycle:x}){let k=d,b=e("display"),P=e("flex-direction"),B=Aa(b,P),A=b==="flex"||b==="inline-flex",M=b==="grid",C=A||M,nt=e("width"),j=e("height"),G=i("width")?nt:Zo(t,"width"),U=i("height")?j:Zo(t,"height"),O=hr(nt,G),tt=hr(j,U),et=e("min-width"),vt=e("max-width"),dt=e("min-height"),bt=e("max-height"),Dt=yo(e("padding")),Ot=e("gap"),At=e("row-gap"),V=e("column-gap"),St=e("grid-template-columns"),Pt=e("grid-template-rows"),Kt=e("overflow"),ee=St.split(/\s+/).filter(Z=>Z&&Z!=="none").length||1,lt=Pt.split(/\s+/).filter(Z=>Z&&Z!=="none").length||1,[ot,Y]=Ma(!1),gt=c!==null,Ht=gt||ot,ht=gt?.3:ot?.65:1,Et=({mode:Z,icon:Lt,active:qt})=>Tt("button",{type:"button",onClick:()=>Pa(Z,n),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:qt?Xn(p,.15):"transparent",color:qt?p:"#64748b",cursor:"pointer",fontSize:14},children:Lt}),zt=(Z,Lt,qt)=>{qt==="fixed"?n(Z,Lt):n(Z,ui(qt,Lt))},W=Z=>{let Lt=yo(e("padding")),qt=Z||"0";n("padding",`${Lt.top} ${qt} ${Lt.bottom} ${qt}`)},rt=Z=>{let Lt=yo(e("padding")),qt=Z||"0";n("padding",`${qt} ${Lt.right} ${qt} ${Lt.left}`)},[ct,mt]=Ma({}),Bt=ho((Z,Lt)=>qt=>{Lt(qt),mt(me=>y(m({},me),{[Z]:qt}))},[]),Nt=ho(Z=>{mt(Lt=>{let qt=m({},Lt);return delete qt[Z],qt})},[]),xt=ho(Z=>{let Lt=yo(e("padding"));Yt(t,"padding",`${Lt.top} ${Z} ${Lt.bottom} ${Z}`)},[t,e]),ue=ho(Z=>{let Lt=yo(e("padding"));Yt(t,"padding",`${Z} ${Lt.right} ${Z} ${Lt.left}`)},[t,e]),Vt=ho(Z=>Lt=>{Yt(t,Z,Lt)},[t]),re=P==="column"||P==="column-reverse",Me=Z=>Z==="center"?1:Z==="flex-end"||Z==="end"?2:0,ne=Me(e("justify-content")),ze=Me(e("align-items")),Ut=re?ze:ne,fe=re?ne:ze,Ve=di(null),ge=di({x:0,y:0}),Ze=di({col:Ut,row:fe});Ze.current={col:Ut,row:fe};let Xe=ho((Z,Lt)=>{let qt=["flex-start","center","flex-end"];re?(n("justify-content",qt[Lt]),n("align-items",qt[Z])):(n("justify-content",qt[Z]),n("align-items",qt[Lt]))},[re,n]),_e=di(Xe);_e.current=Xe,Id(()=>{let Lt=qt=>{let me=Ve.current;if(!me||!me.contains(qt.target))return;qt.preventDefault(),qt.stopPropagation(),ge.current.x+=qt.deltaX,ge.current.y+=qt.deltaY;let{col:ke,row:ce}=Ze.current,te=!1;Math.abs(ge.current.x)>=30&&(ke=Math.max(0,Math.min(2,ke+(ge.current.x>0?1:-1))),ge.current.x=0,ge.current.y=0,te=!0),!te&&Math.abs(ge.current.y)>=30&&(ce=Math.max(0,Math.min(2,ce+(ge.current.y>0?1:-1))),ge.current.x=0,ge.current.y=0,te=!0),te&&(ke!==Ze.current.col||ce!==Ze.current.row)&&_e.current(ke,ce)};return document.addEventListener("wheel",Lt,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",Lt,{capture:!0})},[]);let en=()=>Tt("div",{ref:Ve,onMouseEnter:()=>{Y(!0),u.current&&(u.current.style.overflowY="hidden")},onMouseLeave:()=>{Y(!1),u.current&&(u.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:hn,borderRadius:2,display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gridTemplateRows:"repeat(3, 1fr)",padding:6,gap:2,touchAction:"none"},children:[0,1,2].map(Z=>[0,1,2].map(Lt=>Tt("button",{type:"button",onClick:()=>Xe(Lt,Z),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:Lt===Ut&&Z===fe?Tt("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:Lt===0?De(mr,{children:[Tt("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),Tt("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),Tt("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):Lt===1?De(mr,{children:[Tt("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),Tt("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),Tt("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):De(mr,{children:[Tt("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),Tt("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),Tt("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]})}):Tt("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${Z}-${Lt}`)))}),$e=i("grid-template-columns")||i("grid-template-rows");return De("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Tt("div",{style:l,children:Tt("span",{children:C?"Auto layout":"Layout"})}),De("div",{style:{padding:"8px 12px"},children:[De("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:hn,borderRadius:2,padding:2,opacity:ht,transition:"opacity 150ms ease"},children:[Tt(Et,{mode:"block",icon:Tt(Bd,{size:16}),active:B==="block"}),Tt(Et,{mode:"flex-col",icon:Tt(Nd,{size:16}),active:B==="flex-col"}),Tt(Et,{mode:"flex-row",icon:Tt(Ad,{size:16}),active:B==="flex-row"}),Tt(Et,{mode:"grid",icon:Tt(Pd,{size:16}),active:B==="grid"})]}),De("div",{style:{display:"flex",gap:4,marginBottom:8},children:[Tt(yr,{label:"W",property:"width",cssValue:O==="fixed"?nt:`${Math.round(t.getBoundingClientRect().width)}px`,mode:O,onValueChange:Z=>n("width",Z),onModeChange:Z=>{if(Z==="fixed"){let Lt=t.getBoundingClientRect();n("width",`${Math.round(Lt.width)}px`)}else n("width",ui(Z,nt))},modified:i("width"),dimmed:gt&&c!=="width",dropdownOpen:c==="width",onDropdownChange:Z=>k(Z?"width":null),panelContentRef:u,accentColor:p,onReset:()=>r("width"),minValue:et!=="none"&&et!=="0px"&&et!=="auto"?et:"",maxValue:vt!=="none"&&vt!=="auto"?vt:"",onMinChange:Z=>n("min-width",Z||"0"),onMaxChange:Z=>n("max-width",Z||"none"),onMinReset:()=>r("min-width"),onMaxReset:()=>r("max-width"),minModified:i("min-width"),maxModified:i("max-width")}),Tt(yr,{label:"H",property:"height",cssValue:tt==="fixed"?j:`${Math.round(t.getBoundingClientRect().height)}px`,mode:tt,onValueChange:Z=>n("height",Z),onModeChange:Z=>{if(Z==="fixed"){let Lt=t.getBoundingClientRect();n("height",`${Math.round(Lt.height)}px`)}else n("height",ui(Z,j))},modified:i("height"),dimmed:gt&&c!=="height",dropdownOpen:c==="height",onDropdownChange:Z=>k(Z?"height":null),panelContentRef:u,minValue:dt!=="none"&&dt!=="0px"&&dt!=="auto"?dt:"",maxValue:bt!=="none"&&bt!=="auto"?bt:"",onMinChange:Z=>n("min-height",Z||"0"),onMaxChange:Z=>n("max-height",Z||"none"),onMinReset:()=>r("min-height"),onMaxReset:()=>r("max-height"),minModified:i("min-height"),maxModified:i("max-height"),accentColor:p,onReset:()=>r("height")})]}),A&&De("div",{onMouseEnter:()=>f==null?void 0:f("gap"),onMouseLeave:()=>f==null?void 0:f("element"),style:{display:"flex",gap:8,marginBottom:8},children:[Tt("div",{style:{opacity:gt?.3:1,transition:"opacity 150ms ease"},children:en()}),De("div",{style:{flex:1,opacity:ht,transition:"opacity 150ms ease"},children:[Tt("div",{onClick:i("gap")?()=>r("gap"):void 0,title:i("gap")?"Click to reset":void 0,style:{fontSize:9,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:i("gap")?p:"#999",fontWeight:i("gap")?600:400,marginBottom:2,cursor:i("gap")?"pointer":"default"},children:"Gap"}),Tt(dn,{dimmed:gt,children:De("div",{style:{display:"flex",alignItems:"center"},children:[Tt(mo,{value:Ot,onChange:Z=>{Nt("gap"),n("gap",Z)},onPreview:Bt("gap",Vt("gap")),onScrubEnd:()=>Nt("gap"),onReset:()=>r("gap"),isModified:i("gap"),accentColor:p,defaultUnit:g,children:P==="column"||P==="column-reverse"?Tt(La,{size:12,strokeWidth:i("gap")?2.5:1.5}):Tt(Ia,{size:12,strokeWidth:i("gap")?2.5:1.5})}),Tt(mn,{property:"gap",value:ct.gap||Ot,onChange:Z=>n("gap",Z),isModified:i("gap")||"gap"in ct,style:y(m({},Fe),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:x})]})})]})]}),M&&De("div",{onMouseEnter:()=>f==null?void 0:f("gap"),onMouseLeave:()=>f==null?void 0:f("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:ht,transition:"opacity 150ms ease"},children:[Tt(Dd,{gridCols:ee,gridRows:lt,gridModified:$e,accentColor:p,onColsChange:Z=>n("grid-template-columns",`repeat(${Z}, 1fr)`),onRowsChange:Z=>n("grid-template-rows",`repeat(${Z}, 1fr)`)}),De("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[Tt(dn,{dimmed:gt,children:De("div",{style:{display:"flex",alignItems:"center"},children:[Tt(mo,{value:V||Ot,onChange:Z=>{Nt("column-gap"),n("column-gap",Z)},onPreview:Bt("column-gap",Vt("column-gap")),onScrubEnd:()=>Nt("column-gap"),onReset:()=>r("column-gap"),isModified:i("column-gap"),accentColor:p,defaultUnit:g,children:Tt(Ia,{size:12,strokeWidth:i("column-gap")?2.5:1.5})}),Tt(mn,{property:"column-gap",value:ct["column-gap"]||V||Ot,onChange:Z=>n("column-gap",Z),isModified:i("column-gap")||"column-gap"in ct,placeholder:"col",style:y(m({},Fe),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:x})]})}),Tt(dn,{dimmed:gt,children:De("div",{style:{display:"flex",alignItems:"center"},children:[Tt(mo,{value:At||Ot,onChange:Z=>{Nt("row-gap"),n("row-gap",Z)},onPreview:Bt("row-gap",Vt("row-gap")),onScrubEnd:()=>Nt("row-gap"),onReset:()=>r("row-gap"),isModified:i("row-gap"),accentColor:p,defaultUnit:g,children:Tt(La,{size:12,strokeWidth:i("row-gap")?2.5:1.5})}),Tt(mn,{property:"row-gap",value:ct["row-gap"]||At||Ot,onChange:Z=>n("row-gap",Z),isModified:i("row-gap")||"row-gap"in ct,placeholder:"row",style:y(m({},Fe),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:x})]})})]})]}),C&&De("div",{onMouseEnter:()=>f==null?void 0:f("padding"),onMouseLeave:()=>f==null?void 0:f("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:ht,transition:"opacity 150ms ease"},children:[Tt(dn,{style:{flex:1},dimmed:gt,children:De("div",{style:{display:"flex",alignItems:"center"},children:[Tt(mo,{value:Dt.left,onChange:Z=>{Nt("padding-h"),W(Z)},onPreview:Bt("padding-h",xt),onScrubEnd:()=>Nt("padding-h"),onReset:()=>r("padding"),isModified:i("padding"),accentColor:p,defaultUnit:g,snapSteps:gr,children:Tt(Ld,{size:12,strokeWidth:i("padding")?2.5:1.5})}),Tt(mn,{property:"padding",value:ct["padding-h"]||Dt.left,onChange:Z=>W(Z),isModified:i("padding")||"padding-h"in ct,placeholder:"H pad",style:y(m({},Fe),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:x})]})}),Tt(dn,{style:{flex:1},dimmed:gt,children:De("div",{style:{display:"flex",alignItems:"center"},children:[Tt(mo,{value:Dt.top,onChange:Z=>{Nt("padding-v"),rt(Z)},onPreview:Bt("padding-v",ue),onScrubEnd:()=>Nt("padding-v"),onReset:()=>r("padding"),isModified:i("padding"),accentColor:p,defaultUnit:g,snapSteps:gr,children:Tt(Rd,{size:12,strokeWidth:i("padding")?2.5:1.5})}),Tt(mn,{property:"padding",value:ct["padding-v"]||Dt.top,onChange:Z=>rt(Z),isModified:i("padding")||"padding-v"in ct,placeholder:"V pad",style:y(m({},Fe),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:x})]})})]}),De("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:ht,transition:"opacity 150ms ease"},children:[Tt("input",{type:"checkbox",checked:Kt==="hidden",onChange:Z=>n("overflow",Z.target.checked?"hidden":"visible"),style:{margin:0,accentColor:p}}),"Clip content"]})]})]})}import{AlignCenter as Od,AlignJustify as Fd,AlignLeft as Hd,AlignRight as zd,Baseline as _d,ChevronDown as $d,WholeWord as Wd}from"lucide-react";import{jsx as de,jsxs as Rn}from"react/jsx-runtime";var Ba={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function Na({element:t,getValue:e,handleChange:o,isModified:n,onResetProperty:i,isCollapsed:r,onToggle:s,sectionHeaderStyle:a,accentColor:l,colorVariables:c,activeColorDropdown:d,onColorDropdownChange:u,panelContentRef:p,preferredUnit:f,onUnitCycle:g}){var tt;let x=e("font-family"),k=e("font-size"),b=e("font-weight"),P=e("line-height"),B=e("letter-spacing"),A=e("text-align"),M=e("color"),C=String(b),nt=Ba[C]||C,j=Ao(t,M),G=M.includes("var(")?null:Po(j,c),U=({align:et,icon:vt})=>{let dt=A===et;return de("button",{type:"button",onClick:()=>o("text-align",et),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:dt?Xn(l,.15):"transparent",color:dt?l:"#64748b",cursor:"pointer"},children:vt})},O=((tt=x.split(",")[0])==null?void 0:tt.trim().replace(/^["']|["']$/g,""))||"System";return Rn("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[de("div",{style:a,children:de("span",{children:"Typography"})}),Rn("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[de(dn,{children:Rn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[de("input",{type:"text",value:x,onChange:et=>o("font-family",et.target.value),style:y(m({},Fe),{flex:1,minWidth:0,padding:0,fontWeight:n("font-family")?600:400,color:n("font-family")?l:"inherit"}),title:x}),de($d,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),Rn("div",{style:{display:"flex",gap:4},children:[de(dn,{style:{flex:1},children:de("select",{value:C,onChange:et=>o("font-weight",et.target.value),style:y(m({},Fe),{padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:n("font-weight")?600:400,color:n("font-weight")?l:"inherit"}),children:Object.entries(Ba).map(([et,vt])=>de("option",{value:et,children:vt},et))})}),de(dn,{style:{flex:1},children:de("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:de(mn,{property:"font-size",value:k,onChange:et=>o("font-size",et),isModified:n("font-size"),min:1,max:999,style:y(m({},Fe),{padding:"6px 8px",paddingRight:24,fontWeight:n("font-size")?600:400,color:n("font-size")?l:"inherit"}),unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:f,onUnitCycle:g})})})]}),Rn("div",{style:{display:"flex",gap:4},children:[de(dn,{style:{flex:1},children:Rn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[de(_d,{size:12,style:{color:n("line-height")?l:"#999",flexShrink:0}}),de(mn,{property:"line-height",value:P,onChange:et=>o("line-height",et),isModified:n("line-height"),step:.1,min:0,placeholder:"Auto",style:y(m({},Fe),{flex:1,minWidth:0,padding:0,fontWeight:n("line-height")?600:400,color:n("line-height")?l:"inherit"}),showUnit:!1})]})}),de(dn,{style:{flex:1},children:Rn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[de(Wd,{size:12,style:{color:n("letter-spacing")?l:"#999",flexShrink:0}}),de(mn,{property:"letter-spacing",value:B,onChange:et=>o("letter-spacing",et),isModified:n("letter-spacing"),step:.1,placeholder:"\u2014",style:y(m({},Fe),{flex:1,minWidth:0,padding:0,fontWeight:n("letter-spacing")?600:400,color:n("letter-spacing")?l:"inherit"}),showUnit:!1})]})})]}),Rn("div",{style:{display:"flex",gap:2,backgroundColor:hn,borderRadius:2,padding:2},children:[de(U,{align:"left",icon:de(Hd,{size:14})}),de(U,{align:"center",icon:de(Od,{size:14})}),de(U,{align:"right",icon:de(zd,{size:14})}),de(U,{align:"justify",icon:de(Fd,{size:14})})]}),Rn("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[de("span",{onClick:n("color")?()=>i("color"):void 0,title:n("color")?"Click to reset":void 0,style:{fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:n("color")?l:"#64748b",fontWeight:n("color")?600:400,cursor:n("color")?"pointer":"default",width:40,flexShrink:0},children:"Color"}),de("div",{style:{flex:1,minWidth:0},children:de(br,{value:M,resolvedValue:j,colorVariables:c,matchingVariable:G,onChange:et=>o("color",et),accentColor:l,modified:n("color"),panelContentRef:p,isDropdownOpen:d==="color",onDropdownChange:et=>u(et?"color":null)})})]})]})]})}import{Fragment as Xd,jsx as ft,jsxs as ye}from"react/jsx-runtime";var Oa=[{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 Vd(t,e){let o=e.trim().toLowerCase();switch(t){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 hr(t,e){return!e||t==="auto"||t==="fit-content"||t==="max-content"||t==="min-content"?"hug":t==="100%"||e==="100%"?"fill":"fixed"}function ui(t,e){switch(t){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let o=Hn(e);if(typeof o.num=="number"&&!isNaN(o.num)){let n=o.unit==="%"?"px":o.unit||"px";return`${o.num}${n}`}return"auto"}}}function yo(t){let e=t.split(/\s+/).filter(Boolean);return e.length===1?{top:e[0],right:e[0],bottom:e[0],left:e[0]}:e.length===2?{top:e[0],right:e[1],bottom:e[0],left:e[1]}:e.length===3?{top:e[0],right:e[1],bottom:e[2],left:e[1]}:e.length>=4?{top:e[0],right:e[1],bottom:e[2],left:e[3]}:{top:"0px",right:"0px",bottom:"0px",left:"0px"}}function Aa(t,e){return t==="grid"?"grid":t==="flex"||t==="inline-flex"?e==="column"||e==="column-reverse"?"flex-col":"flex-row":"block"}function Pa(t,e){switch(t){case"block":e("display","block");break;case"flex-row":e("display","flex"),e("flex-direction","row");break;case"flex-col":e("display","flex"),e("flex-direction","column");break;case"grid":e("display","grid");break}}var hn="rgba(0, 0, 0, 0.04)",Fe={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 yr({label:t,property:e,cssValue:o,mode:n,onValueChange:i,onModeChange:r,modified:s,dimmed:a,dropdownOpen:l,onDropdownChange:c,panelContentRef:d,accentColor:u="#3b82f6",onReset:p,minValue:f,maxValue:g,onMinChange:x,onMaxChange:k,onMinReset:b,onMaxReset:P,minModified:B,maxModified:A}){let M=Hn(o),C=s?M.unit||go(e):go(e),nt=!s&&M.unit&&M.unit!==C?pr(M.num,C):M.num,[j,G]=He(!1),[U,O]=He(String(nt)),[tt,et]=He(!1),vt=an(null),dt=an(null),bt=an(null),Dt=an(!1);pn(()=>{j||O(String(nt))},[nt,j]),pn(()=>{if(!l)return;let lt=Y=>{dt.current&&!dt.current.contains(Y.target)&&bt.current&&!bt.current.contains(Y.target)&&(c==null||c(!1))},ot=Y=>{Y.key==="Escape"&&(c==null||c(!1))};return document.addEventListener("mousedown",lt),document.addEventListener("keydown",ot),()=>{document.removeEventListener("mousedown",lt),document.removeEventListener("keydown",ot)}},[l,c]),pn(()=>{j&&vt.current&&(vt.current.focus(),vt.current.select())},[j]);let Ot=()=>{let lt=li(U,e,o,s);i(lt||`${Math.max(0,parseFloat(U)||0)}${C}`),G(!1)},At=()=>{if(Dt.current){Dt.current=!1;return}Ot()},V=lt=>{if(lt.key==="Enter"){Ot();return}if(lt.key==="Escape"){Dt.current=!0,O(String(nt)),G(!1);return}if(lt.key==="ArrowUp"||lt.key==="ArrowDown"){lt.preventDefault();let ot=lt.key==="ArrowUp"?1:-1,Y=lt.shiftKey?8:lt.altKey?.1:1,gt=parseFloat(U)||0,Ht=Math.round(Math.max(0,gt+ot*Y)*1e3)/1e3;O(String(Ht)),i(`${Ht}${C}`)}},St={fixed:"Fixed",hug:"Hug",fill:"Fill"},Pt={fixed:ft(Da,{size:12}),hug:ft(jd,{size:12}),fill:ft(Da,{size:12})},Kt=()=>{c==null||c(!l)},ee=()=>{if(!bt.current||!(d!=null&&d.current))return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let lt=bt.current.getBoundingClientRect(),ot=d.current.getBoundingClientRect(),Y=d.current.closest('[data-devtools="panel"]'),gt=Y?Y.getBoundingClientRect():{top:0,left:0};return{position:"fixed",top:lt.bottom+4-gt.top,left:ot.left+4-gt.left,width:ot.width-8}};return ye("div",{ref:bt,onMouseEnter:()=>et(!0),onMouseLeave:()=>et(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:j?u:tt?"rgba(0,0,0,0.15)":"transparent",backgroundColor:hn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:a?.3:1},children:[ft("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:t}),n==="fixed"?j?ft("input",{ref:vt,type:"text",inputMode:"numeric",value:U,onChange:lt=>O(lt.target.value),onKeyDown:V,onBlur:At,style:y(m({},Fe),{flex:1,minWidth:0,padding:"4px 2px"})}):ft("span",{onClick:()=>G(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:nt}):ft("span",{style:{flex:1}}),ye("button",{type:"button",onClick:Kt,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:[St[n],ft(xr,{size:12})]}),l&&ye("div",{ref:dt,style:y(m({},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:[ye("button",{type:"button",onClick:()=>{r("fixed"),c==null||c(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:n==="fixed"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:n==="fixed"?600:400,cursor:"pointer",textAlign:"left"},children:[Pt.fixed,ye("span",{children:["Fixed ",e," (",o,")"]}),n==="fixed"&&ft(pi,{size:14,style:{marginLeft:"auto"}})]}),ye("button",{type:"button",onClick:()=>{r("hug"),c==null||c(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:n==="hug"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:n==="hug"?600:400,cursor:"pointer",textAlign:"left"},children:[Pt.hug,ft("span",{children:"Hug contents"}),n==="hug"&&ft(pi,{size:14,style:{marginLeft:"auto"}})]}),ye("button",{type:"button",onClick:()=>{r("fill"),c==null||c(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:n==="fill"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:n==="fill"?600:400,cursor:"pointer",textAlign:"left"},children:[Pt.fill,ft("span",{children:"Fill container"}),n==="fill"&&ft(pi,{size:14,style:{marginLeft:"auto"}})]}),ft("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),ye("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[ye("div",{style:{display:"flex",alignItems:"center",backgroundColor:hn,borderRadius:2,padding:"4px 8px"},children:[ft("span",{onClick:B?lt=>{lt.stopPropagation(),b==null||b()}:void 0,title:B?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:B?u:"#999",fontWeight:B?600:400,marginRight:8,flexShrink:0,cursor:B?"pointer":"default"},children:"Min"}),ft("input",{type:"text",value:f||"",placeholder:"\u2014",onChange:lt=>x==null?void 0:x(lt.target.value),onClick:lt=>lt.stopPropagation(),style:y(m({},Fe),{flex:1,minWidth:0,padding:0,textAlign:"right",color:B?u:"inherit",fontWeight:B?600:400})})]}),ye("div",{style:{display:"flex",alignItems:"center",backgroundColor:hn,borderRadius:2,padding:"4px 8px"},children:[ft("span",{onClick:A?lt=>{lt.stopPropagation(),P==null||P()}: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:"Max"}),ft("input",{type:"text",value:g||"",placeholder:"\u2014",onChange:lt=>k==null?void 0:k(lt.target.value),onClick:lt=>lt.stopPropagation(),style:y(m({},Fe),{flex:1,minWidth:0,padding:0,textAlign:"right",color:A?u:"inherit",fontWeight:A?600:400})})]})]})]})]})}function dn({children:t,style:e,dimmed:o}){let[n,i]=He(!1);return ft("div",{onMouseEnter:()=>i(!0),onMouseLeave:()=>i(!1),style:m({position:"relative",borderRadius:2,border:"1px solid",borderColor:n?"rgba(0,0,0,0.15)":"transparent",backgroundColor:hn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:o?.3:1},e),children:t})}function Ln({children:t}){let[e,o]=He(!1);return ft("div",{onMouseEnter:()=>o(!0),onMouseLeave:()=>o(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:e?"rgba(0,0,0,0.15)":"transparent",backgroundColor:hn,transition:"border-color 100ms ease"},children:t})}function mn({property:t,value:e,onChange:o,isModified:n=!1,step:i=1,min:r,max:s,style:a,placeholder:l,showUnit:c=!0,unitStyle:d,preferredUnit:u,onUnitCycle:p}){let f=Hn(e),g=go(t),x=ai[t],b=u&&x&&x.includes(u)?u:g,P=n&&f.unit||b,B=!n&&f.unit&&f.unit!==P?pr(f.num,P):f.num,[A,M]=He(!1),[C,nt]=He(""),j=At=>{M(!0),nt(String(B||"")),requestAnimationFrame(()=>At.target.select())},G=()=>{if(M(!1),C.trim()){let At=li(C,t,e,n);At&&o(At)}},U=At=>{let V=At.target.value;nt(V);let St=V.trim(),Pt=St.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),Kt=St.match(/^(-?[\d.]+)$/);if(Pt){let ee=parseFloat(Pt[1]);isNaN(ee)||o(`${ee}${Pt[2].toLowerCase()}`)}else if(Kt){let ee=parseFloat(Kt[1]);isNaN(ee)||o(`${ee}${P}`)}},O=At=>{if(At.key==="Enter"){if(C.trim()){let V=li(C,t,e,n);V&&o(V)}At.target.blur();return}if(At.key==="ArrowUp"||At.key==="ArrowDown"){At.preventDefault();let V=At.shiftKey?10:At.altKey?.1:1,St=(At.key==="ArrowUp"?1:-1)*i*V,Pt=parseFloat(C)||B||0,Kt=Math.round((Pt+St)*1e3)/1e3;r!==void 0&&(Kt=Math.max(r,Kt)),s!==void 0&&(Kt=Math.min(s,Kt)),nt(String(Kt)),o(`${Kt}${P}`)}},tt=/^-?[\d.]/.test(e.trim()),et=A?C:tt?String(B):"",dt=A&&/\s*(rem|em|px|%)\s*$/i.test(C)?"":P,bt=p&&(dt==="rem"||dt==="px"),Dt={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},Ot=y(m({},d!=null?d:Dt),{pointerEvents:"auto",cursor:"pointer"});return ye(Xd,{children:[ft("input",{type:"text",inputMode:"decimal",value:et,onFocus:j,onBlur:G,onChange:U,onKeyDown:O,placeholder:l,style:a}),c&&dt&&ft("span",{style:bt?Ot:d!=null?d:Dt,onClick:bt?p:void 0,title:bt?"Click to switch units":void 0,children:dt})]})}function br({value:t,resolvedValue:e,colorVariables:o,matchingVariable:n,onChange:i,accentColor:r="#3b82f6",modified:s,panelContentRef:a,isDropdownOpen:l,onDropdownChange:c}){let[d,u]=He(!1),p=!t.includes("var(")&&n?n.usage:t,[f,g]=He(p),[x,k]=He(!1),[b,P]=He(!1),[B,A]=He(!1),M=an(null),C=an(null),nt=an(null),j=l!==void 0?l:x,G=c||k,U=wn(()=>{if(!nt.current)return{position:"fixed",top:0,left:0,width:200};let V=nt.current.getBoundingClientRect(),St=nt.current.closest('[data-devtools="panel"]'),Pt=St?St.getBoundingClientRect():{top:0,left:0};if(a!=null&&a.current){let Kt=a.current.getBoundingClientRect();return{position:"fixed",top:V.bottom+4-Pt.top,left:Kt.left+4-Pt.left,width:Kt.width-8}}return{position:"fixed",top:V.bottom+4-Pt.top,left:V.left-Pt.left,width:V.width}},[a]);pn(()=>{if(!d){let V=!t.includes("var(")&&n?n.usage:t;g(V)}},[t,d,n]),pn(()=>{if(!j&&!b)return;let V=Pt=>{nt.current&&!nt.current.contains(Pt.target)&&(G(!1),P(!1))},St=Pt=>{Pt.key==="Escape"&&(G(!1),P(!1))};return document.addEventListener("mousedown",V),document.addEventListener("keydown",St),()=>{document.removeEventListener("mousedown",V),document.removeEventListener("keydown",St)}},[j,b]),pn(()=>{d&&M.current&&(M.current.focus(),M.current.select())},[d]);let O=fi(()=>{if(!f||f.startsWith("#")||f.startsWith("rgb")||f.startsWith("hsl")||f.startsWith("oklch"))return[];let V=f.toLowerCase();return o.filter(St=>St.name.toLowerCase().includes(V)||St.usage.toLowerCase().includes(V)).slice(0,8)},[f,o]),tt=()=>{i(f),u(!1),P(!1)},et=V=>{g(V),V.includes("var")||V.includes("--")||V.length>0&&!V.startsWith("#")?P(!0):P(!1)},vt=V=>{g(V.usage),i(V.usage),G(!1),P(!1),u(!1)},dt=()=>{setTimeout(()=>{!j&&!b&&tt()},150)},bt=V=>{V.key==="Enter"?tt():V.key==="Escape"&&(g(t),u(!1),P(!1))},Dt=fi(()=>{let V=e.trim().toLowerCase();if(V.startsWith("#"))return V.length===4?`#${V[1]}${V[1]}${V[2]}${V[2]}${V[3]}${V[3]}`:V.slice(0,7);let St=V.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(St){let Kt=parseInt(St[1],10).toString(16).padStart(2,"0"),ee=parseInt(St[2],10).toString(16).padStart(2,"0"),lt=parseInt(St[3],10).toString(16).padStart(2,"0");return`#${Kt}${ee}${lt}`}let Pt=V.match(/oklch\(\s*([\d.]+)/);if(Pt){let Kt=Math.max(0,Math.min(1,parseFloat(Pt[1]))),ee=Math.round(Kt*255).toString(16).padStart(2,"0");return`#${ee}${ee}${ee}`}return"#000000"},[e]),Ot=V=>{let St=V.target.value;g(St),i(St)},At=t.includes("var(");return ye("div",{ref:nt,onMouseEnter:()=>A(!0),onMouseLeave:()=>A(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:d?r:B?"rgba(0,0,0,0.15)":"transparent",backgroundColor:hn,transition:"border-color 100ms ease",overflow:"hidden"},children:[ye("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[ye("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[ft("input",{type:"color",value:Dt,onChange:Ot,style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),ft("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:e,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),d?ft("input",{ref:M,type:"text",value:f,onChange:V=>et(V.target.value),onKeyDown:bt,onBlur:dt,style:y(m({},Fe),{flex:1,minWidth:0})}):ft("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?r:"inherit"},title:p,children:p}),o.length>0&&ft("button",{type:"button",onClick:()=>G(!j),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:ft(xr,{size:12})})]}),b&&O.length>0&&ft("div",{style:y(m({},U()),{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:O.map(V=>ye("button",{type:"button",onClick:()=>vt(V),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:[ft("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:V.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ft("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:V.name})]},V.name))}),j&&ft("div",{ref:C,style:y(m({},U()),{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(V=>ye("button",{type:"button",onClick:()=>vt(V),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:p===V.usage||t===V.usage?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:p===V.usage||t===V.usage?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[ft("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:V.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ft("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:V.name}),(p===V.usage||t===V.usage)&&ft(pi,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},V.name))})]})}function Fa({element:t,elementInfo:e,selector:o,styleModifications:n,dispatch:i,onClose:r,onHover:s,accentColor:a="#3b82f6"}){var Et,zt;let l=an(null),c=an(null),[d,u]=He(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch(W){return!1}});pn(()=>{if(d)return;let W=setTimeout(()=>u(!0),50);return()=>clearTimeout(W)},[d]);let[p,f]=He(null),[g,x]=He(null),k=p!==null||g!==null,[b,P]=He("rem"),B=wn(()=>{P(W=>W==="rem"?"px":"rem")},[]),A=an(new Map),[M,C]=He(""),nt=fi(()=>zi(),[]);pn(()=>{let W=rt=>{var mt;if(rt.key!=="Escape")return;let ct=document.activeElement;ct&&((mt=l.current)!=null&&mt.contains(ct))||r()};return window.addEventListener("keydown",W),()=>window.removeEventListener("keydown",W)},[r]);let j=an({top:0,left:0,maxHeight:400}),[,G]=He(0),U="devtools-panel-position",O=an({x:0,y:0}),tt=an(null),et=an(!1);pn(()=>{try{let W=localStorage.getItem(U);if(W){let rt=JSON.parse(W);typeof rt.top=="number"&&typeof rt.left=="number"&&(et.current=!0,j.current=y(m({},j.current),{top:rt.top,left:rt.left}))}}catch(W){}},[]),pn(()=>{let W=ct=>{let mt=tt.current;if(!mt)return;let Bt=mt.startOffsetX+(ct.clientX-mt.startX),Nt=mt.startOffsetY+(ct.clientY-mt.startY),xt=280,ue=16,Vt=Math.max(ue,Math.min(window.innerWidth-xt-ue,j.current.left+Bt)),re=Math.max(ue,j.current.top+Nt);O.current={x:Vt-j.current.left,y:re-j.current.top};let Me=l.current,ne=Me==null?void 0:Me.parentElement;if(!ne)return;ne.style.top=`${re}px`,ne.style.left=`${Vt}px`;let ze=document.getElementById("devtools-toolbar"),Ut=ze==null?void 0:ze.getBoundingClientRect(),fe=window.innerHeight-16;Ut&&Vt+xt>Ut.left&&(fe=Ut.top-8);let Ve=Math.max(0,re),ge=Math.max(200,fe-Ve);Me&&(Me.style.maxHeight=`${ge}px`)},rt=()=>{if(!tt.current)return;let ct=j.current.top+O.current.y,mt=j.current.left+O.current.x;j.current=y(m({},j.current),{top:ct,left:mt}),O.current={x:0,y:0},et.current=!0;try{localStorage.setItem(U,JSON.stringify({top:ct,left:mt}))}catch(Bt){}tt.current=null};return window.addEventListener("mousemove",W),window.addEventListener("mouseup",rt),()=>{window.removeEventListener("mousemove",W),window.removeEventListener("mouseup",rt)}},[]);let vt=wn(W=>{W.button!==0||W.target.closest("button")||(W.preventDefault(),tt.current={startX:W.clientX,startY:W.clientY,startOffsetX:O.current.x,startOffsetY:O.current.y})},[]);pn(()=>{O.current={x:0,y:0};let W=(mt=!1)=>{let Bt=l.current,Nt=280,xt=8,ue,Vt;if(et.current)ue=j.current.top,Vt=j.current.left;else{let fe=t.getBoundingClientRect();Vt=fe.right+xt,ue=fe.top,Vt+Nt>window.innerWidth-xt&&(Vt=fe.left-Nt-xt),Vt<xt&&(Vt=Math.max(xt,(window.innerWidth-Nt)/2))}let re=document.getElementById("devtools-toolbar"),Me=re==null?void 0:re.getBoundingClientRect(),ne=window.innerHeight-16;Me&&Vt+Nt>Me.left&&(ne=Me.top-xt);let ze=Math.max(0,ue),Ut=Math.max(200,ne-ze);if(j.current={top:ue,left:Vt,maxHeight:Ut},mt&&Bt){let fe=Bt.parentElement;fe&&!et.current&&(fe.style.top=`${ue+O.current.y}px`,fe.style.left=`${Vt+O.current.x}px`),Bt.style.maxHeight=`${Ut}px`}else G(fe=>fe+1)};W(!1);let rt=()=>W(!0),ct=()=>W(!1);return window.addEventListener("scroll",rt,{passive:!0}),window.addEventListener("resize",ct,{passive:!0}),()=>{window.removeEventListener("scroll",rt),window.removeEventListener("resize",ct)}},[t]),pn(()=>{let W=l.current;if(!W)return;let rt=ct=>{let mt=c.current;if(!mt){ct.preventDefault();return}let{scrollTop:Bt,scrollHeight:Nt,clientHeight:xt}=mt,ue=Bt<=0&&ct.deltaY<0,Vt=Bt+xt>=Nt&&ct.deltaY>0;(ue||Vt)&&ct.preventDefault()};return W.addEventListener("wheel",rt,{passive:!1}),()=>W.removeEventListener("wheel",rt)},[]);let dt=fi(()=>n.find(W=>W.selector===o),[n,o]),bt=wn(W=>{let rt=dt==null?void 0:dt.changes.find(ct=>ct.property===W);if(rt)return rt.modified;if(W.includes("color")){let ct=Ni(t,W);if(ct&&ct.includes("var("))return ct}return Io(t,W)},[t,dt]),Dt=wn(W=>{if(A.current.has(W))return A.current.get(W);let rt=dt==null?void 0:dt.changes.find(mt=>mt.property===W);if(rt)return rt.original;let ct=Io(t,W);return A.current.set(W,ct),ct},[t,dt]),Ot=wn((W,rt)=>{let ct=Dt(W);Yt(t,W,rt),W==="backdrop-filter"&&Yt(t,"-webkit-backdrop-filter",rt),i({type:"MODIFY_STYLE",payload:{selector:o,element:e,property:W,original:ct,modified:rt}})},[t,o,e,i,Dt]),At=wn(()=>{Hi(o,n);let W=n.find(rt=>rt.selector===o);if(W)for(let rt of W.changes)i({type:"CLEAR_STYLE",payload:{selector:o,property:rt.property}});A.current.clear()},[o,n,i]),V=wn(W=>{let rt=n.find(mt=>mt.selector===o);rt!=null&&rt.changes.find(mt=>mt.property===W)&&t instanceof HTMLElement&&(t.style.removeProperty(W),i({type:"CLEAR_STYLE",payload:{selector:o,property:W}}),A.current.delete(W))},[t,o,n,i]),St=wn(()=>{let W=M.split(";").map(rt=>rt.trim()).filter(rt=>rt);for(let rt of W){let ct=rt.indexOf(":");if(ct>0){let mt=rt.slice(0,ct).trim(),Bt=rt.slice(ct+1).trim();mt&&Bt&&Ot(mt,Bt)}}C("")},[M,Ot]),Pt=wn(W=>{var rt;return(rt=dt==null?void 0:dt.changes.some(ct=>ct.property===W))!=null?rt:!1},[dt]),Kt=W=>{var Nt;let rt=bt(W.property),ct=Pt(W.property),mt=!ct&&Vd(W.property,rt),Bt={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(mt&&W.type!=="backdrop-filter")return ft(Ln,{modified:!1,children:ft("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:xt=>Ot(W.property,xt.target.value),style:y(m({},Bt),{color:"#999"})})});switch(W.type){case"color":{let xt=Ao(t,rt),ue=rt.includes("var(")?null:Po(xt,nt);return ft(br,{value:rt,resolvedValue:xt,colorVariables:nt,matchingVariable:ue,onChange:Vt=>Ot(W.property,Vt),accentColor:a,modified:ct,panelContentRef:c,isDropdownOpen:g===W.property,onDropdownChange:Vt=>x(Vt?W.property:null)})}case"number":{if(!!ai[W.property])return ft(Ln,{modified:ct,children:ft(mn,{property:W.property,value:rt,onChange:Vt=>Ot(W.property,Vt),isModified:ct,min:W.min,max:W.max,step:W.step||1,style:y(m({},Bt),{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:b,onUnitCycle:B})});let{num:ue}=Hn(rt);return ft(Ln,{modified:ct,children:ft("input",{type:"number",value:ue,min:W.min,max:W.max,step:W.step||1,onChange:Vt=>Ot(W.property,Vt.target.value),style:Bt})})}case"select":return ft(Ln,{modified:ct,children:ye("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[ft("select",{value:rt,onChange:xt=>Ot(W.property,xt.target.value),style:y(m({},Bt),{cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"}),children:(Nt=W.options)==null?void 0:Nt.map(xt=>ft("option",{value:xt,children:xt},xt))}),ft("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:ft(xr,{size:12})})]})});case"spacing":return ft(Ln,{modified:ct,children:ft("input",{type:"text",value:rt,onChange:xt=>Ot(W.property,xt.target.value),placeholder:"e.g., 10px or 10px 20px",style:Bt})});case"backdrop-filter":return ft(Ta,{value:rt,onChange:xt=>Ot(W.property,xt),accentColor:a,modified:ct,panelContentRef:c});default:return ft(Ln,{modified:ct,children:ft("input",{type:"text",value:rt,onChange:xt=>Ot(W.property,xt.target.value),style:Bt})})}},ee=(Et=dt==null?void 0:dt.changes.length)!=null?Et:0,lt=(zt=dt==null?void 0:dt.captured)!=null?zt:!1,ot=y(m({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)"},gn),{zIndex:1e4,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontSize:12,overflow:"hidden",display:"flex",flexDirection:"column",opacity:d?1:0,transition:"opacity 150ms ease"}),Y={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:tt.current?"grabbing":"grab"},gt={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"12px 12px 6px",userSelect:"none",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontWeight:600,color:"#475569"},Ht={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},ht={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return ft("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:j.current.top+O.current.y,left:j.current.left+O.current.x,zIndex:1e4,pointerEvents:"none"},children:ye("div",{ref:l,"data-devtools":"panel",style:y(m({},ot),{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:[ye("div",{style:Y,onMouseDown:vt,children:[ye("div",{style:{display:"flex",alignItems:"center",gap:8,overflow:"hidden"},children:[ft("span",{style:{fontWeight:600,fontSize:11,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:e.tagName}),ee>0&&ft("span",{style:{backgroundColor:lt?"#999999":a,color:"#fff",fontSize:9,padding:"1px 4px",borderRadius:2},children:ee})]}),ye("div",{style:{display:"flex",gap:4},children:[ee>0&&ft("button",{type:"button",onClick:At,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:ft(Yd,{size:14})}),ft("button",{type:"button",onClick:r,title:"Close",style:{display:"flex",alignItems:"center",justifyContent:"center",width:24,height:24,border:"none",background:"none",cursor:"pointer",color:"#64748b",borderRadius:2},children:ft(Gd,{size:14})})]})]}),ye("div",{ref:c,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[ft("div",{style:{opacity:g?.3:1,transition:"opacity 150ms ease"},children:ft(Ra,{element:t,getValue:bt,getOriginalValue:Dt,handleChange:Ot,isModified:Pt,onResetProperty:V,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:gt,activeDropdown:p,onDropdownChange:f,panelContentRef:c,accentColor:a,onFieldHover:s,preferredUnit:b,onUnitCycle:B})}),ft("div",{style:{opacity:p?.3:1,transition:"opacity 150ms ease"},children:ft(Na,{element:t,getValue:bt,handleChange:Ot,isModified:Pt,onResetProperty:V,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:gt,accentColor:a,colorVariables:nt,activeColorDropdown:g,onColorDropdownChange:x,panelContentRef:c,preferredUnit:b,onUnitCycle:B})}),Oa.map((W,rt)=>{let ct=rt===Oa.length-1,mt=g&&W.properties.some(Nt=>Nt.property===g);return ye("div",{style:{borderBottom:ct?"none":"1px solid rgba(0,0,0,0.08)",opacity:k&&!mt?.3:1,transition:"opacity 150ms ease"},children:[ft("div",{style:gt,children:ft("span",{children:W.name})}),ft("div",{style:{padding:"4px 0"},children:W.properties.map(Nt=>{let xt=Pt(Nt.property),ue=mt&&Nt.property!==g;return ye("div",{style:y(m({},Ht),{opacity:ue?.3:1,transition:"opacity 150ms ease"}),children:[ft("span",{onClick:xt?()=>V(Nt.property):void 0,title:xt?"Click to reset":void 0,style:y(m({},ht),{color:xt?a:"#64748b",fontWeight:xt?600:400,cursor:xt?"pointer":"default"}),children:Nt.label}),ft("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:Kt(Nt)})]},Nt.property)})})]},W.name)}),ye("div",{style:{opacity:k?.3:1,transition:"opacity 150ms ease"},children:[ft("div",{style:gt,children:ft("span",{children:"Raw CSS"})}),ye("div",{style:{padding:"8px 12px"},children:[ft("textarea",{value:M,onChange:W=>C(W.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"}}),M.trim()&&ft("button",{type:"button",onClick:St,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:a,color:"#fff",cursor:"pointer",opacity:M.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as Jd,useLayoutEffect as Kd,useState as Ud}from"react";import{Fragment as tu,jsx as Un,jsxs as Qd}from"react/jsx-runtime";var vr=["flex-start","center","flex-end"],Sr=["flex-start","center","flex-end"];function Zd(t){return t==="normal"||t==="flex-start"||t==="start"?"flex-start":t==="flex-end"||t==="end"?"flex-end":t==="center"?"center":null}function qd(t){return t==="normal"||t==="stretch"||t==="flex-start"||t==="start"?"flex-start":t==="flex-end"||t==="end"?"flex-end":t==="center"?"center":null}function Ha(t){let e=Array.from(t.children);if(e.length===0)return null;let o=1/0,n=1/0,i=-1/0,r=-1/0;for(let s of e){let a=s.getBoundingClientRect();a.width===0&&a.height===0||(a.top<o&&(o=a.top),a.left<n&&(n=a.left),a.bottom>i&&(i=a.bottom),a.right>r&&(r=a.right))}return o===1/0?null:new DOMRect(n,o,r-n,i-o)}function za({element:t,modifier:e,accentColor:o,refreshKey:n=0}){let[i,r]=Ud(null);if(Jd(()=>{if(!t){r(null);return}let x=()=>r(Ha(t));return x(),window.addEventListener("scroll",x,{passive:!0}),window.addEventListener("resize",x,{passive:!0}),()=>{window.removeEventListener("scroll",x),window.removeEventListener("resize",x)}},[t]),Kd(()=>{t&&r(Ha(t))},[t,n]),!i)return null;let s=i,a=window.getComputedStyle(t),l=a.display;if(l!=="flex"&&l!=="inline-flex")return null;let c=a.flexDirection,d=c==="column"||c==="column-reverse"?"vertical":"horizontal",u=d==="horizontal"?"vertical":"horizontal",p=[];if(e==="shift"){let x=Zd(a.justifyContent);if(x){let k=vr.indexOf(x);d==="horizontal"?(k>0&&p.push("left"),k<vr.length-1&&p.push("right")):(k>0&&p.push("up"),k<vr.length-1&&p.push("down"))}}else{let x=qd(a.alignItems);if(x){let k=Sr.indexOf(x);u==="horizontal"?(k>0&&p.push("left"),k<Sr.length-1&&p.push("right")):(k>0&&p.push("up"),k<Sr.length-1&&p.push("down"))}}if(p.length===0)return null;let f=14,g=7;return Un(tu,{children:p.map(x=>{let k,b;switch(x){case"right":k=s.right+f,b=s.top+s.height/2;break;case"left":k=s.left-f,b=s.top+s.height/2;break;case"down":k=s.left+s.width/2,b=s.bottom+f;break;case"up":k=s.left+s.width/2,b=s.top-f;break}let P=x==="right"?0:x==="left"?180:x==="down"?90:-90,B={position:"fixed",left:k-g,top:b-g,width:g*2,height:g*2,pointerEvents:"none",zIndex:9997};return Un("div",{"data-devtools":"swipe-hint",style:B,children:Un("svg",{width:g*2,height:g*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:Qd("g",{transform:`rotate(${P})`,children:[Un("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),Un("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),Un("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:o,strokeWidth:"1.5",strokeLinecap:"round"}),Un("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:o,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},x)})})}import{useEffect as eu,useLayoutEffect as nu,useState as ou}from"react";import{jsx as wr,jsxs as kr}from"react/jsx-runtime";function iu(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${e})`:`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}function _a({element:t,fontSize:e,lineHeight:o,accentColor:n,hoveredProperty:i,draggingProperty:r,cursorViewport:s}){let[a,l]=ou(null);if(eu(()=>{if(!t){l(null);return}let b=()=>{l(lo(t))};return b(),window.addEventListener("scroll",b,{passive:!0}),window.addEventListener("resize",b,{passive:!0}),()=>{window.removeEventListener("scroll",b),window.removeEventListener("resize",b)}},[t]),nu(()=>{t&&l(lo(t))},[t,e,o]),!a)return null;let c=a.width,d=a.height,u=iu(n,.2),p=r!=null?r:i,f=8,g=2,x={position:"fixed",top:a.top,left:a.left,width:c,height:d,pointerEvents:"none",zIndex:9996,overflow:"visible"},k=b=>b==="font-size"?`${Math.round(e)}`:(e>0?o/e:1.2).toFixed(2).replace(/\.?0+$/,"");return kr("div",{"data-devtools":"text-handles",style:x,children:[kr("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${d}`,children:[wr("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)&&wr("rect",{x:c-g/2,y:d/2-f/2,width:g,height:f,fill:n,stroke:"#ffffff",strokeWidth:p==="font-size"?4:2,paintOrder:"stroke"}),(p==="line-height"||!p)&&wr("rect",{x:c/2-f/2,y:d-g/2,width:f,height:g,fill:n,stroke:"#ffffff",strokeWidth:p==="line-height"?4:2,paintOrder:"stroke"})]}),s&&p&&(()=>{let b=p==="font-size"?"Aa":"Lh",P=k(p);return kr("div",{style:{position:"fixed",left:s.x+8,top:s.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:[b," ",P]})})()]})}import{Fragment as xo,jsx as ie,jsxs as bo}from"react/jsx-runtime";var $a=8,Er=[0,1,2,4,8,12,16,20,24,28,32],Tr="devtools-active-text";function Wa(t,e,o=0){let n=t.left+window.scrollX+4,i=e==="top-left"?t.top+window.scrollY-uo-o*uo+4:t.bottom+window.scrollY+4-1+o*uo;return{x:n,y:i}}function Ya({state:t,dispatch:e,onScreenshot:o,inFlightAnnotationIds:n,inFlightStyleSelectors:i,inFlightSelectorColors:r,onAttachImages:s,onReply:a,onViewThread:l,activePlan:c,onModelComponentsAdd:d,onModelComponentFocus:u,onModelComponentHover:p,modelComponentNames:f,modelPanelHoveredComponent:g,modelSpacingTokenHover:x}){var ss,as,ls,cs,ds,us,ps,fs,gs,ms,hs;let{canvasRef:k,redrawAll:b,resizeCanvas:P}=ta(),B=Ce(!1);Ge(()=>{let v=k.current;if(!v)return;let w=()=>{B.current&&(B.current=!1,v.style.pointerEvents="")},q=E=>{E.button===0&&B.current&&w()};return window.addEventListener("mousedown",q),()=>window.removeEventListener("mousedown",q)},[k]);let[A,M]=le(!1),[C,nt]=le(()=>{if(typeof window=="undefined")return null;try{let v=localStorage.getItem(Tr);return v?JSON.parse(v):null}catch(v){return null}}),[j,G]=le(null),[U,O]=le(null),[tt,et]=le(null),vt=Ce(null),dt=Ce(null),bt=Ce({x:0,y:0}),Dt=Ce([]),Ot=Ce(0),[At,V]=le(null),[St,Pt]=le(new Map),Kt=Ce(0),ee=Ce(null),[lt,ot]=le(null),[Y,gt]=le(null),Ht=Ce({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}),[ht,Et]=le(null),[zt,W]=le(null),[rt,ct]=le(null),[mt,Bt]=le(null),Nt=Ce({x:0,y:0}),[xt,ue]=le({x:0,y:0}),Vt=Ce({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}),[re,Me]=le(null),[ne,ze]=le(null),[Ut,fe]=le(null),[Ve,ge]=le(!1),[Ze,Xe]=le(0),[_e,en]=le(null),$e=Ce({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}),[we,Z]=le(null),[Lt,qt]=le(null),[me,ke]=le(null),ce=Ce({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[te,nn]=le(null),[on,kn]=le(null),[oe,X]=le(null),it=ea(),h=Ce(r);h.current=r;let I=Oe(v=>{let w=h.current;if(!w||w.size===0)return!1;for(let q of w.keys())try{if(v.matches(q))return!0}catch(E){}return!1},[]),L=Ce(t);L.current=t;let z=Ce(C);z.current=C;let yt=Ce([]),Rt=Ce(o);Rt.current=o;let[Q,jt]=le(null),Mt=t.selectedAnnotationIds;yt.current=Mt;let _t=Oe((v,w=!1)=>{e({type:"SELECT_ANNOTATION",payload:{id:v,addToSelection:w}})},[e]),wt=Oe(()=>{e({type:"SELECT_ANNOTATION",payload:{id:null}})},[e]),[Gt,We]=le(null),[be,Cn]=le({x:window.scrollX,y:window.scrollY});Ge(()=>(P(),window.addEventListener("resize",P),()=>window.removeEventListener("resize",P)),[P]),Ge(()=>{let v=()=>{Cn({x:window.scrollX,y:window.scrollY})};return window.addEventListener("scroll",v,{passive:!0}),()=>window.removeEventListener("scroll",v)},[]),Ge(()=>{C?localStorage.setItem(Tr,JSON.stringify(C)):localStorage.removeItem(Tr)},[C]),na(C,nt,j,t.annotations,e);let _n=Ce(At);_n.current=At,Ge(()=>{if(t.activeTool!=="model"||!t.isAnnotating)return;let v=w=>{if(!w.altKey||!_n.current)return;w.preventDefault();let q=w.deltaY>0?-1:1;Kt.current=Math.max(0,Kt.current+q);let E=ee.current;if(E){let N=Ko(E,Kt.current);V(N)}};return window.addEventListener("wheel",v,{passive:!1}),()=>window.removeEventListener("wheel",v)},[t.activeTool,t.isAnnotating]),Ge(()=>{t.activeTool!=="model"&&(V(null),Pt(new Map),Kt.current=0,ee.current=null)},[t.activeTool]),Ge(()=>{var q;let v=(q=At==null?void 0:At.name)!=null?q:null,w=v&&(f!=null&&f.has(v))?v:null;p==null||p(w)},[At,f,p]);let[Ye,Nn]=le(null);Ge(()=>{var q;if(!g){Nn(null);return}let v=ro(g.name),w=g.instanceIndex;Nn((q=v[w%v.length])!=null?q:null)},[g]);let[qr,vi]=le([]);Ge(()=>{var v,w;if(!x){vi([]);return}(w=(v=x.token)==null?void 0:v.bindings)!=null&&w.length?vi(Pi(x.token)):vi(Ri(x.px))},[x]);let dl=Ce(null),ul=Ce(null);dl.current=re,ul.current=ne,Ge(()=>{let v=["flex-start","center","flex-end"],w=["flex-start","center","flex-end"],E=null,N=!1,H=null,at=null,D=(pt,Ct)=>{let Jt=On(pt,Ct);for(;Jt&&Jt!==document.documentElement;){let ae=window.getComputedStyle(Jt).display;if(ae==="flex"||ae==="inline-flex")return Jt;Jt=Jt.parentElement}return null},K=pt=>{let Ct=window.getComputedStyle(pt).flexDirection;return Ct==="column"||Ct==="column-reverse"?"vertical":"horizontal"},S=pt=>{let Ct=pt.getAttribute("data-pm");return Ct||(Ct=Math.random().toString(36).substring(2,8),pt.setAttribute("data-pm",Ct)),{selector:`[data-pm="${Ct}"]`,durableSelector:ln(pt)}},T=()=>{N=!0,E&&clearTimeout(E),E=setTimeout(()=>{N=!1,E=null},300)},J=(pt,Ct,Zt)=>{let Jt=K(pt);if(Ct===Jt){let $t=window.getComputedStyle(pt).justifyContent,he=$t==="normal"||$t==="flex-start"||$t==="start"?"flex-start":$t==="flex-end"||$t==="end"?"flex-end":$t==="center"?"center":null;if(!he)return;let Be=v.indexOf(he)+Zt;if(Be<0||Be>=v.length)return;let Mn=v[Be],{selector:Wn,durableSelector:wi}=S(pt);Yt(pt,"justify-content",Mn),e({type:"MODIFY_STYLES_BATCH",payload:{selector:Wn,durableSelector:wi,element:Ke(pt),changes:[{property:"justify-content",original:$t,modified:Mn}]}})}else{let $t=window.getComputedStyle(pt).flexDirection,he=Jt==="horizontal"?"column":"row",{selector:fn,durableSelector:Be}=S(pt);Yt(pt,"flex-direction",he),e({type:"MODIFY_STYLES_BATCH",payload:{selector:fn,durableSelector:Be,element:Ke(pt),changes:[{property:"flex-direction",original:$t,modified:he}]}})}Xe(ae=>ae+1)},R=(pt,Ct,Zt)=>{let ae=K(pt)==="horizontal"?"vertical":"horizontal";if(Ct!==ae)return;let he=window.getComputedStyle(pt).alignItems,fn=he==="normal"||he==="stretch"||he==="flex-start"||he==="start"?"flex-start":he==="flex-end"||he==="end"?"flex-end":he==="center"?"center":null;if(!fn)return;let Mn=w.indexOf(fn)+Zt;if(Mn<0||Mn>=w.length)return;let Wn=w[Mn],{selector:wi,durableSelector:xl}=S(pt);Yt(pt,"align-items",Wn),e({type:"MODIFY_STYLES_BATCH",payload:{selector:wi,durableSelector:xl,element:Ke(pt),changes:[{property:"align-items",original:he,modified:Wn}]}}),Xe(vl=>vl+1)},F=20,$=null,_=null,ut=0,kt=(pt,Ct,Zt)=>{let Jt=D(Ct,Zt);en(Jt?{modifier:pt,target:Jt}:null)},se=pt=>{if(!(t.activeTool!=="hand"||!t.isAnnotating)){if(pt.key==="Shift"&&!pt.altKey){let Ct=Nt.current;kt("shift",Ct.x,Ct.y)}else if(pt.key==="Alt"&&!pt.shiftKey){let Ct=Nt.current;kt("alt",Ct.x,Ct.y)}}},Xt=pt=>{if(t.activeTool!=="hand"||!t.isAnnotating)return;let Ct=pt.shiftKey&&!pt.altKey,Zt=pt.altKey&&!pt.shiftKey;if(!Ct&&!Zt||pt.buttons!==0){$=null,_=null,ut=0,H=null,at=null,en(null);return}if(H===null&&(H=pt.clientX,at=pt.clientY,kt(Ct?"shift":"alt",pt.clientX,pt.clientY)),N)return;$===null&&($=pt.clientX,_=pt.clientY,ut=0);let Jt=pt.clientX-$,ae=pt.clientY-_,$t=Math.abs(Jt)>=Math.abs(ae)?Jt:ae;if(Math.abs($t)>3){let Wn=$t>0?1:-1;if(ut!==0&&Wn!==ut){$=pt.clientX,_=pt.clientY,ut=0;return}ut=Wn}if(Math.abs(Jt)<F&&Math.abs(ae)<F)return;let he=D(H,at);if(!he)return;let fn=Math.abs(Jt)>=Math.abs(ae)?"horizontal":"vertical",Mn=(fn==="horizontal"?Jt:ae)>0?1:-1;$=null,_=null,ut=0,Ct?J(he,fn,Mn):R(he,fn,Mn),T()},Ie=pt=>{(pt.key==="Shift"||pt.key==="Alt")&&(H=null,at=null,$=null,_=null,ut=0,en(null))},pe=()=>{en(null),$=null,_=null,ut=0};return window.addEventListener("keydown",se),window.addEventListener("mousemove",Xt),window.addEventListener("mousedown",pe),window.addEventListener("keyup",Ie),()=>{window.removeEventListener("keydown",se),window.removeEventListener("mousemove",Xt),window.removeEventListener("mousedown",pe),window.removeEventListener("keyup",Ie),E&&clearTimeout(E)}},[t.activeTool,t.isAnnotating,e]),Ge(()=>{let v=w=>{var N,H,at;if(w.key==="Escape"){if(z.current)return;if(t.activeTool==="model"&&St.size>0){w.preventDefault(),Pt(new Map);return}if(yt.current.length>0){w.preventDefault(),wt();return}}if(w.key==="Enter"&&t.activeTool==="model"&&St.size>0&&d){w.preventDefault();let D=[...St.keys()].filter(K=>!(f!=null&&f.has(K)));D.length>0&&d(D),Pt(new Map);return}if((w.metaKey||w.ctrlKey)&&w.key==="v"&&Dt.current.length>0&&!z.current){w.preventDefault(),Ot.current++;let D=Ot.current*20,S=((N=Dt.current[0])==null?void 0:N.groupId)?Math.random().toString(36).substring(2,9):void 0,T=Dt.current.map(R=>y(m({},R),{id:Math.random().toString(36).substring(2,9),groupId:R.groupId?S:void 0,timestamp:Date.now(),points:R.points.map(F=>({x:F.x+D,y:F.y+D}))}));e({type:"PASTE_ANNOTATIONS",payload:{annotations:T}});let J=T.find(R=>R.type!=="text")||T[0];J&&_t(J.id);return}let q=yt.current;if(q.length===0||z.current)return;let E=(H=w.target)==null?void 0:H.tagName;if(!(E==="INPUT"||E==="TEXTAREA"||(at=w.target)!=null&&at.isContentEditable)&&(w.key==="Delete"||w.key==="Backspace")){w.preventDefault();for(let D of q)e({type:"DELETE_ANNOTATION",payload:{id:D}});wt()}};return window.addEventListener("keydown",v),()=>window.removeEventListener("keydown",v)},[e,wt,_t,t.activeTool,St,f,d]);let En=Cr(()=>ri(t.annotations),[t.annotations]),Eo=Cr(()=>{let v=new Map,w=new Set,q=1;for(let E of t.annotations)if(!En.has(E))if(E.groupId){if(!w.has(E.groupId)){w.add(E.groupId);let N=t.annotations.filter(H=>H.groupId===E.groupId);for(let H of N)v.set(H.id,q);q++}}else v.set(E.id,q),q++;return v},[t.annotations,En]),Qr=Cr(()=>{if(Mt.length===0)return null;let v=new Map;for(let w of Mt){let q=t.annotations.find(N=>N.id===w);if(!q)continue;let E=q.groupId?t.annotations.filter(N=>N.groupId===q.groupId):[q];for(let N of E)if(N.linkedSelector&&!(r!=null&&r.has(N.linkedSelector))){let H=N.color||t.activeColor;v.set(N.linkedSelector,H)}}return v.size>0?v:null},[Mt,t.annotations,t.activeColor,r]);Ge(()=>{let v=t.annotations.filter(w=>!(En.has(w)||C&&!C.isNew&&w.id===C.id));b(v,t.currentPath,t.activeTool,t.activeColor,t.strokeWidth,Mt,$a,be.x,be.y,Eo)},[t.annotations,t.currentPath,t.activeTool,t.activeColor,t.strokeWidth,b,C,Mt,be,Eo,En]),Ge(()=>{if(U){let v=Math.random().toString(36).substring(2,9);nt({id:v,point:U.point,text:"",fontSize:12,isNew:!0,groupId:U.groupId}),O(null)}},[U]),Ge(()=>{tt&&(nt({id:Math.random().toString(36).substring(2,9),point:tt.point,text:"",fontSize:12,isNew:!0,linkedSelector:tt.linkedSelector,linkedAnchor:tt.linkedAnchor,elements:tt.elements}),et(null))},[tt]);let _o=Ce(null),$o=(ss=C==null?void 0:C.id)!=null?ss:null;Ge(()=>{$o&&vt.current?requestAnimationFrame(()=>{var q;let v=vt.current;if(!v||(v.focus(),dt.current===$o))return;dt.current=$o;let w=z.current;if(w){if(_o.current!==null){let E=Math.min(_o.current,v.value.length);v.setSelectionRange(E,E);return}if(!w.isNew&&w.clickPoint){let E=k.current;if(!E)return;let N=E.getContext("2d");if(!N)return;N.font=`${w.fontSize}px ${ve}`;let H=w.fontSize*1.4,at=w.text.split(`
8
+ `),D=w.clickPoint.y-w.point.y,K=Math.max(0,Math.min(at.length-1,Math.floor(D/H))),S=w.clickPoint.x-w.point.x,T=at[K]||"",J=0;for(let F=0;F<=T.length;F++){let $=N.measureText(T.substring(0,F)).width;if($>S){let _=F>0?N.measureText(T.substring(0,F-1)).width:0;J=S-_<$-S?F-1:F;break}J=F}let R=J;for(let F=0;F<K;F++)R+=(((q=at[F])==null?void 0:q.length)||0)+1;v.setSelectionRange(R,R)}}}):(dt.current=null,_o.current=null)},[$o,k]);let to=Oe(v=>{let w=k.current;if(!w)return{x:0,y:0};let q=w.getBoundingClientRect(),E,N;if("touches"in v&&v.touches[0])E=v.touches[0].clientX,N=v.touches[0].clientY;else if("clientX"in v)E=v.clientX,N=v.clientY;else return{x:0,y:0};return{x:E-q.left+window.scrollX,y:N-q.top+window.scrollY}},[k]),$n=Oe((v,w,q,E)=>{let N=q.x-w.x,H=q.y-w.y,at=N*N+H*H;if(at===0)return Math.sqrt((v.x-w.x)**2+(v.y-w.y)**2)<=E;let D=Math.max(0,Math.min(1,((v.x-w.x)*N+(v.y-w.y)*H)/at)),K=w.x+D*N,S=w.y+D*H;return Math.sqrt((v.x-K)**2+(v.y-S)**2)<=E},[]),Wo=Oe(v=>{for(let q=t.annotations.length-1;q>=0;q--){let E=t.annotations[q];if(!E||En.has(E))continue;let N=(E.strokeWidth||3)+4;switch(E.type){case"text":{if(!E.points[0]||!E.text)continue;let H=E.points[0],at=E.fontSize||12,D=k.current;if(D){let K=D.getContext("2d");if(K){K.font=`${at}px ${ve}`;let S=E.text.split(`
9
+ `),T=Math.max(...S.map(R=>K.measureText(R).width)),J=S.length*(at*1.4);if(v.x>=H.x-4-4&&v.x<=H.x+T+4+4&&v.y>=H.y-4-4&&v.y<=H.y+J+4+4)return E}}break}case"rectangle":{if(E.points.length<2)continue;let H=E.points[0],at=E.points[E.points.length-1],D=Math.min(H.x,at.x),K=Math.max(H.x,at.x),S=Math.min(H.y,at.y),T=Math.max(H.y,at.y),J=$n(v,{x:D,y:S},{x:K,y:S},N),R=$n(v,{x:D,y:T},{x:K,y:T},N),F=$n(v,{x:D,y:S},{x:D,y:T},N),$=$n(v,{x:K,y:S},{x:K,y:T},N);if(J||R||F||$)return E;break}case"circle":{if(E.points.length<2)continue;let H=E.points[0],at=E.points[E.points.length-1],D=(H.x+at.x)/2,K=(H.y+at.y)/2,S=Math.abs(at.x-H.x)/2,T=Math.abs(at.y-H.y)/2,J=v.x-D,R=v.y-K,F=Math.sqrt((J/S)**2+(R/T)**2);if(Math.abs(F-1)*Math.max(S,T)<=N)return E;break}case"line":{if(E.points.length<2)continue;let H=E.points[0],at=E.points[E.points.length-1];if($n(v,H,at,N))return E;break}case"freehand":{if(E.points.length<2)continue;for(let H=0;H<E.points.length-1;H++){let at=E.points[H],D=E.points[H+1];if($n(v,at,D,N))return E}break}}}return null},[t.annotations,k,$n,En]),ts=Oe(v=>{let w=Wo(v);return(w==null?void 0:w.type)==="text"?w:null},[Wo]),es=Oe(v=>{if(Mt.length===0)return null;let w=$a/2+4;for(let q of Mt){let E=t.annotations.find(N=>N.id===q);if(!(!E||E.points.length<2)){if(E.type==="line"){let N=E.points[0],H=E.points[E.points.length-1];if(Math.sqrt((v.x-N.x)**2+(v.y-N.y)**2)<=w)return{handle:"start",annotationId:q};if(Math.sqrt((v.x-H.x)**2+(v.y-H.y)**2)<=w)return{handle:"end",annotationId:q};continue}if(E.type==="circle"){let N=E.points[0],H=E.points[E.points.length-1],at=Math.min(N.x,H.x),D=Math.max(N.x,H.x),K=Math.min(N.y,H.y),S=Math.max(N.y,H.y),T=(at+D)/2,J=(K+S)/2,R=[{handle:"top",x:T,y:K},{handle:"bottom",x:T,y:S},{handle:"left",x:at,y:J},{handle:"right",x:D,y:J}];for(let{handle:F,x:$,y:_}of R)if(Math.sqrt((v.x-$)**2+(v.y-_)**2)<=w)return{handle:F,annotationId:q};continue}if(E.type==="rectangle"||E.type==="freehand"){let N=E.points[0],H=E.points[E.points.length-1],at,D,K,S;E.type==="freehand"?(at=Math.min(...E.points.map(J=>J.x)),D=Math.max(...E.points.map(J=>J.x)),K=Math.min(...E.points.map(J=>J.y)),S=Math.max(...E.points.map(J=>J.y))):(at=Math.min(N.x,H.x),D=Math.max(N.x,H.x),K=Math.min(N.y,H.y),S=Math.max(N.y,H.y));let T=[{corner:"topLeft",x:at,y:K},{corner:"topRight",x:D,y:K},{corner:"bottomLeft",x:at,y:S},{corner:"bottomRight",x:D,y:S}];for(let{corner:J,x:R,y:F}of T)if(Math.sqrt((v.x-R)**2+(v.y-F)**2)<=w)return{handle:J,annotationId:q}}}}return null},[Mt,t.annotations]);Ge(()=>{let v=w=>{if(bt.current={x:w.clientX+window.scrollX,y:w.clientY+window.scrollY},!C){let q=ts(bt.current);G((q==null?void 0:q.id)||null)}};return window.addEventListener("mousemove",v),()=>window.removeEventListener("mousemove",v)},[C,ts]);let eo=Oe(()=>{var w;if(!C)return;let v=((w=C.images)==null?void 0:w.length)||0;if(C.text.trim()||v>0)if(C.isNew){let q=io();e({type:"ADD_TEXT",payload:m({point:C.point,text:C.text||(v>0?`[${v} image${v>1?"s":""}]`:""),fontSize:C.fontSize,id:q,groupId:C.groupId,linkedSelector:C.linkedSelector,linkedAnchor:C.linkedAnchor,elements:C.elements},v>0?{imageCount:v}:{})}),v>0&&C.images&&s&&s(q,C.images)}else e({type:"UPDATE_TEXT",payload:m({id:C.id,text:C.text||(v>0?`[${v} image${v>1?"s":""}]`:"")},v>0?{imageCount:v}:{})}),v>0&&C.images&&s&&s(C.id,C.images);else C.isNew||e({type:"DELETE_ANNOTATION",payload:{id:C.id}});nt(null)},[C,e,s]),Tn=Oe(v=>{for(let w=0;w<Er.length-1;w++){let q=Er[w],E=Er[w+1];if(v<=(q+E)/2)return q;if(v<E)return E}return Math.round(v/8)*8},[]),ns=Oe((v,w,q,E)=>{let N=q.top+Math.max(E.top,4),H=q.bottom-Math.max(E.bottom,4),at=q.left+Math.max(E.left,4),D=q.right-Math.max(E.right,4);if(v<q.left||v>q.right||w<q.top||w>q.bottom)return null;let K=w<N,S=w>H,T=v<at,J=v>D;return K&&T?E.top>=E.left?"top":"left":K&&J?E.top>=E.right?"top":"right":S&&T?E.bottom>=E.left?"bottom":"left":S&&J?E.bottom>=E.right?"bottom":"right":K?"top":S?"bottom":T?"left":J?"right":null},[]),os=Oe(v=>{var H,at;if(!t.isAnnotating)return;if(t.inspectedElement&&t.activeTool==="hand"&&!("button"in v&&v.button===2)){v.preventDefault(),v.stopPropagation(),e({type:"SELECT_ELEMENT",payload:null});return}let w=to(v),q="shiftKey"in v&&v.shiftKey;if(t.activeTool==="inspector"){if("button"in v&&v.button===2)return;if(lt&&!I(lt)){let D=Ke(lt),K=ln(lt),S=lt.getBoundingClientRect(),T=lt.getAttribute("data-pm");T||(T=Math.random().toString(36).substring(2,8),lt.setAttribute("data-pm",T));let J=`[data-pm="${T}"]`,R=t.styleModifications.some(kt=>{try{return lt.matches(kt.selector)}catch(se){return!1}}),F=t.annotations.filter(kt=>{if(!kt.linkedSelector)return!1;try{return lt.matches(kt.linkedSelector)}catch(se){return!1}}).length,$=(R?1:0)+F,_=S.top>=uo*(1+$)?"top-left":"bottom-left",ut=Wa(S,_,$);et({point:ut,linkedSelector:J,linkedAnchor:_,elements:[y(m({},D),{selector:K})]})}return}if(t.activeTool==="model"){if("button"in v&&v.button===2)return;if(At){let D=At.name;if(f!=null&&f.has(D)){u==null||u(D);return}"shiftKey"in v&&v.shiftKey?Pt(S=>{let T=new Map(S);return T.has(D)?T.delete(D):T.set(D,At),T}):St.size===1&&St.has(D)?(d&&d([D]),Pt(new Map)):Pt(new Map([[D,At]]))}return}if(t.activeTool==="hand"&&re&&ne){let D=re,K=D.getAttribute("data-pm");K||(K=Math.random().toString(36).substring(2,8),D.setAttribute("data-pm",K));let S=ln(D),T=`[data-pm="${K}"]`,J=Ke(D),R=Lo(D),F=w.x-window.scrollX,$=w.y-window.scrollY,_=Ve,ut=window.getComputedStyle(D).justifyContent,kt=0;if(_){let Xt=jn(D).find(Ie=>Ie.axis===ne);kt=Xt?ne==="column"?Xt.w:Xt.h:0}Yt(D,"transition","none"),Vt.current={isDragging:!0,hasMoved:!1,axis:ne,startX:F,startY:$,originalRow:_?kt:R.row,originalColumn:_?kt:R.column,element:D,elementInfo:y(m({},J),{selector:T}),selector:T,durableSelector:S,isAuto:_,originalJustifyContent:ut,visualGap:kt},fe({axis:ne,row:_?kt:R.row,column:_?kt:R.column});return}if(t.activeTool==="hand"&&te&&on){let D=te,K=D.getAttribute("data-pm");K||(K=Math.random().toString(36).substring(2,8),D.setAttribute("data-pm",K));let S=`[data-pm="${K}"]`,T=Ke(D),{fontSize:J,lineHeight:R}=Ro(D),F=J>0?R/J:1.2,$=w.x-window.scrollX,_=w.y-window.scrollY;Yt(D,"transition","none");let ut=ln(D);ce.current={isDragging:!0,property:on,startX:$,startY:_,originalFontSize:J,originalLineHeight:R,originalRatio:F,element:D,elementInfo:y(m({},T),{selector:S}),selector:S,durableSelector:ut},X({property:on,fontSize:J,lineHeight:R});return}if(t.activeTool==="hand"&&we&&Lt){let D=we,K=D.getAttribute("data-pm");K||(K=Math.random().toString(36).substring(2,8),D.setAttribute("data-pm",K));let S=`[data-pm="${K}"]`,T=ln(D),J=Ke(D),R=Gn(D),F=D.getBoundingClientRect(),$=Math.floor(F.height/2),_=w.y-window.scrollY;Yt(D,"transition","none"),$e.current={isDragging:!0,corner:Lt,startY:_,original:R,maxRadius:$,element:D,elementInfo:y(m({},J),{selector:S}),selector:S,durableSelector:T},ke({corner:Lt,radius:m({},R)});return}if(t.activeTool==="hand"&&ht&&zt){let D=ht,K=D.getAttribute("data-pm");K||(K=Math.random().toString(36).substring(2,8),D.setAttribute("data-pm",K));let S=`[data-pm="${K}"]`,T=ln(D),J=Ke(D),R=ao(D),F=w.x-window.scrollX,$=w.y-window.scrollY;Yt(D,"transition","none"),Ht.current={isDragging:!0,side:zt,startX:F,startY:$,original:R,element:D,elementInfo:y(m({},J),{selector:S}),selector:S,durableSelector:T},Bt({side:zt,padding:m({},R)});return}let E=es(w);if(E){let D=t.annotations.find(K=>K.id===E.annotationId);if(D&&D.type!=="text"&&((H=D.status)!=null?H:"pending")==="pending"){We({annotationId:E.annotationId,handle:E.handle,startPoint:w,originalPoints:[...D.points],hasMoved:!1});return}}let N=Wo(w);if(N&&N.points[0]){if(C&&eo(),N.type!=="text"){if(_t(N.id,q),N.color&&e({type:"SET_COLOR",payload:N.color}),l){let D=N.threadId||(N.groupId?(at=t.annotations.find(K=>K.groupId===N.groupId&&K.threadId))==null?void 0:at.threadId:void 0);D&&l(D)}}else q||wt();jt({annotation:N,startPoint:w,hasMoved:!1});return}if(q||wt(),t.activeTool==="text"){C&&eo();let D=Math.random().toString(36).substring(2,9);nt({id:D,point:w,text:"",fontSize:12,isNew:!0});return}M(!0),e({type:"START_PATH",payload:w})},[t.isAnnotating,t.activeTool,t.inspectedElement,t.annotations,C,Mt,lt,ht,zt,we,Lt,re,ne,Ve,te,on,At,St,f,d,u,l,to,Wo,es,e,_t,wt,eo]),is=Oe(v=>{var q,E;let w=to(v);if(t.activeTool==="inspector"&&t.isAnnotating){let N=w.x-window.scrollX,H=w.y-window.scrollY,at=On(N,H),D=at&&I(at)?null:at;D!==lt&&(ot(D),gt(D?Ke(D):null));return}if(t.activeTool==="model"&&t.isAnnotating){let N=w.x-window.scrollX,H=w.y-window.scrollY,at=On(N,H);if(at!==ee.current&&(ee.current=at,Kt.current=0),at){let D=Ko(at,Kt.current);V(D)}else V(null);return}if(t.activeTool==="hand"&&t.isAnnotating){let N=w.x-window.scrollX,H=w.y-window.scrollY;Nt.current={x:N,y:H},ue({x:N,y:H});let at=it.current.cmd,D=it.current.shift;if(Vt.current.isDragging){let S=Vt.current,T=S.element;if(!T)return;if(!S.hasMoved){let $=Math.abs(N-S.startX),_=Math.abs(H-S.startY);if($<=2&&_<=2)return;S.hasMoved=!0,S.isAuto&&(Yt(T,"justify-content","normal"),Yt(T,"row-gap",`${S.visualGap}px`),Yt(T,"column-gap",`${S.visualGap}px`),ge(!1))}let J=S.axis,R=S.originalRow,F=S.originalColumn;if(J==="column"){let $=N-S.startX;F=S.originalColumn+$,at||(R=S.originalRow+$)}else{let $=H-S.startY;R=S.originalRow+$,at||(F=S.originalColumn+$)}R=Math.max(0,R),F=Math.max(0,F),D&&(R=Tn(R),F=Tn(F)),R=Math.round(R),F=Math.round(F),Yt(T,"row-gap",`${R}px`),Yt(T,"column-gap",`${F}px`),fe({axis:J,row:R,column:F});return}if($e.current.isDragging){let S=$e.current,T=S.element;if(!T)return;let J=H-S.startY,R=S.corner,F=S.original,$=m({},F);if(at){let _=F[R]+J;_=Math.max(0,Math.min(S.maxRadius,_)),D&&(_=Tn(_)),_=Math.round(_),$[R]=_}else{let _=F[R]+J;_=Math.max(0,Math.min(S.maxRadius,_)),D&&(_=Tn(_)),_=Math.round(_),$={"top-left":_,"top-right":_,"bottom-right":_,"bottom-left":_}}Yt(T,"border-top-left-radius",`${$["top-left"]}px`),Yt(T,"border-top-right-radius",`${$["top-right"]}px`),Yt(T,"border-bottom-right-radius",`${$["bottom-right"]}px`),Yt(T,"border-bottom-left-radius",`${$["bottom-left"]}px`),ke({corner:R,radius:$});return}if(ce.current.isDragging){let S=ce.current,T=S.element;if(!T)return;let J=S.property,R=S.originalFontSize,F=S.originalLineHeight,$=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(J==="font-size"){let ut=N-S.startX;R=S.originalFontSize+ut,R=Math.max(1,R)}else{let ut=H-S.startY;F=S.originalLineHeight+ut,F=Math.max(R,F)}if(D)if(J==="font-size"){let ut=$[0],kt=Math.abs(R-ut);for(let se of $){let Xt=Math.abs(R-se);Xt<kt&&(ut=se,kt=Xt)}R=ut}else{let ut=R>0?F/R:1.2,kt=Math.round(ut*2)/2;F=R*Math.max(1,kt)}R=Math.round(R),F=Math.round(F*10)/10,Yt(T,"font-size",`${R}px`);let _=R>0?Math.round(F/R*1e3)/1e3:1.2;Yt(T,"line-height",`${_}`),X({property:J,fontSize:R,lineHeight:F});return}if(Ht.current.isDragging){let S=Ht.current,T=S.element;if(!T)return;let J=S.side,R=S.original,F=R.top,$=R.right,_=R.bottom,ut=R.left;if(J==="top"){let kt=S.startY-H;F=R.top+kt,at||(_=R.bottom+kt)}else if(J==="bottom"){let kt=H-S.startY;_=R.bottom+kt,at||(F=R.top+kt)}else if(J==="left"){let kt=S.startX-N;ut=R.left+kt,at||($=R.right+kt)}else if(J==="right"){let kt=N-S.startX;$=R.right+kt,at||(ut=R.left+kt)}F=Math.max(0,F),$=Math.max(0,$),_=Math.max(0,_),ut=Math.max(0,ut),D&&(F=Tn(F),$=Tn($),_=Tn(_),ut=Tn(ut)),F=Math.round(F),$=Math.round($),_=Math.round(_),ut=Math.round(ut),Yt(T,"padding",`${F}px ${$}px ${_}px ${ut}px`),Bt({side:J,padding:{top:F,right:$,bottom:_,left:ut}});return}let K=On(N,H);for(;K&&K.tagName==="A";)K=K.parentElement;{let T=[];K&&T.push(K),we&&we!==K&&T.push(we);let J=null,R=16,F=null;for(let $ of T){let _=$.getBoundingClientRect(),ut=Gn($),kt=[["top-left",_.left,_.top+ut["top-left"]],["top-right",_.right,_.top+ut["top-right"]],["bottom-right",_.right,_.bottom-ut["bottom-right"]],["bottom-left",_.left,_.bottom-ut["bottom-left"]]];for(let[se,Xt,Ie]of kt){let pe=Math.hypot(N-Xt,H-Ie);pe<R&&(R=pe,J=se,F=$)}}if(J&&F){Z(F),qt(J),ht&&Et(null),zt&&W(null),re&&Me(null),ne&&ze(null),ge(!1),te&&nn(null),on&&kn(null);return}}we&&Z(null),Lt&&qt(null);{let S=[];K&&qo(K)&&S.push(K);let T=(q=K==null?void 0:K.parentElement)!=null?q:null;for(;T&&T!==document.body&&S.length<3;)qo(T)&&S.push(T),T=T.parentElement;for(let J of S){let F=jn(J).find($=>N>=$.x&&N<=$.x+$.w&&H>=$.y&&H<=$.y+$.h);if(F){Me(J),ze(F.axis),ge(Di(J,F.axis)),ht&&Et(null),zt&&W(null),te&&nn(null),on&&kn(null);return}}}re&&Me(null),ne&&ze(null),ge(!1);{let T=[];K&&T.push(K),te&&te!==K&&T.push(te);let J=null,R=1/0,F=null;for(let $ of T){if(!Oi($))continue;let _=lo($);if(!_)continue;let ut=N>=_.left&&N<=_.right&&H>=_.top&&H<=_.bottom,kt=[["font-size",_.right,_.top+_.height/2],["line-height",_.left+_.width/2,_.bottom]];for(let[se,Xt,Ie]of kt){let pe=Math.hypot(N-Xt,H-Ie);(ut||pe<12)&&pe<R&&(R=pe,J=se,F=$)}}J&&F?(nn(F),kn(J)):(te&&nn(null),on&&kn(null))}if(K!==ht&&Et(K),K){let S=ao(K),T=K.getBoundingClientRect(),J=ns(N,H,T,S);W(J)}else W(null);return}if(Gt){let{handle:N,originalPoints:H,hasMoved:at}=Gt,D=t.annotations.find(R=>R.id===Gt.annotationId);if(!D)return;let K="metaKey"in v,S=K&&(v.metaKey||v.ctrlKey),T=K&&v.shiftKey,J;if(D.type==="line"){let R=H[0],F=H[H.length-1];N==="start"?J=[w,F]:J=[R,w]}else if(D.type==="freehand"){let R=Math.min(...H.map($t=>$t.x)),F=Math.max(...H.map($t=>$t.x)),$=Math.min(...H.map($t=>$t.y)),_=Math.max(...H.map($t=>$t.y)),ut=(R+F)/2,kt=($+_)/2,se=F-R||1,Xt=_-$||1,Ie=se/Xt,pe=R,pt=F,Ct=$,Zt=_;switch(N){case"topLeft":pe=w.x,Ct=w.y;break;case"topRight":pt=w.x,Ct=w.y;break;case"bottomLeft":pe=w.x,Zt=w.y;break;case"bottomRight":pt=w.x,Zt=w.y;break}if(S)switch(N){case"topLeft":pt=F+(R-pe),Zt=_+($-Ct);break;case"topRight":pe=R-(pt-F),Zt=_+($-Ct);break;case"bottomLeft":pt=F+(R-pe),Ct=$-(Zt-_);break;case"bottomRight":pe=R-(pt-F),Ct=$-(Zt-_);break}if(T){let $t=pt-pe,he=Zt-Ct;if(Math.abs($t/he)>Ie){let Be=Math.abs(he)*Ie*Math.sign($t);N==="topLeft"||N==="bottomLeft"?pe=pt-Be:pt=pe+Be}else{let Be=Math.abs($t)/Ie*Math.sign(he);N==="topLeft"||N==="topRight"?Ct=Zt-Be:Zt=Ct+Be}}let Jt=pt-pe||1,ae=Zt-Ct||1;J=H.map($t=>({x:pe+($t.x-R)/se*Jt,y:Ct+($t.y-$)/Xt*ae}))}else if(D.type==="circle"){let R=H[0],F=H[H.length-1],$=Math.min(R.x,F.x),_=Math.max(R.x,F.x),ut=Math.min(R.y,F.y),kt=Math.max(R.y,F.y),se=($+_)/2,Xt=(ut+kt)/2,Ie=_-$,pe=kt-ut,pt=$,Ct=_,Zt=ut,Jt=kt;switch(N){case"top":if(Zt=w.y,S&&(Jt=Xt+(Xt-w.y)),T){let $t=(Jt-Zt)*(Ie/pe)/2;pt=se-$t,Ct=se+$t}break;case"bottom":if(Jt=w.y,S&&(Zt=Xt-(w.y-Xt)),T){let $t=(Jt-Zt)*(Ie/pe)/2;pt=se-$t,Ct=se+$t}break;case"left":if(pt=w.x,S&&(Ct=se+(se-w.x)),T){let $t=(Ct-pt)*(pe/Ie)/2;Zt=Xt-$t,Jt=Xt+$t}break;case"right":if(Ct=w.x,S&&(pt=se-(w.x-se)),T){let $t=(Ct-pt)*(pe/Ie)/2;Zt=Xt-$t,Jt=Xt+$t}break}J=[{x:pt,y:Zt},{x:Ct,y:Jt}]}else{let R=H[0],F=H[H.length-1],$=Math.min(R.x,F.x),_=Math.max(R.x,F.x),ut=Math.min(R.y,F.y),kt=Math.max(R.y,F.y),se=($+_)/2,Xt=(ut+kt)/2,Ie=_-$||1,pe=kt-ut||1,pt=Ie/pe,Ct=$,Zt=_,Jt=ut,ae=kt;switch(N){case"topLeft":Ct=w.x,Jt=w.y;break;case"topRight":Zt=w.x,Jt=w.y;break;case"bottomLeft":Ct=w.x,ae=w.y;break;case"bottomRight":Zt=w.x,ae=w.y;break}if(S)switch(N){case"topLeft":Zt=_+($-Ct),ae=kt+(ut-Jt);break;case"topRight":Ct=$-(Zt-_),ae=kt+(ut-Jt);break;case"bottomLeft":Zt=_+($-Ct),Jt=ut-(ae-kt);break;case"bottomRight":Ct=$-(Zt-_),Jt=ut-(ae-kt);break}if(T){let $t=Zt-Ct,he=ae-Jt;if(Math.abs($t/he)>pt){let Be=Math.abs(he)*pt*Math.sign($t);N==="topLeft"||N==="bottomLeft"?Ct=Zt-Be:Zt=Ct+Be}else{let Be=Math.abs($t)/pt*Math.sign(he);N==="topLeft"||N==="topRight"?Jt=ae-Be:ae=Jt+Be}}J=[{x:Ct,y:Jt},{x:Zt,y:ae}]}e({type:"RESIZE_ANNOTATION",payload:{id:Gt.annotationId,points:J,saveUndo:!at}}),at||We(y(m({},Gt),{hasMoved:!0}));return}if(Q&&((E=Q.annotation.status)!=null?E:"pending")==="pending"){let N=w.x-Q.startPoint.x,H=w.y-Q.startPoint.y;if((Math.abs(N)>2||Math.abs(H)>2)&&!Q.hasMoved)jt(y(m({},Q),{hasMoved:!0,startPoint:w})),e({type:"MOVE_ANNOTATION",payload:{id:Q.annotation.id,delta:{x:N,y:H},saveUndo:!0}});else if(Q.hasMoved){let D=w.x-Q.startPoint.x,K=w.y-Q.startPoint.y;jt(y(m({},Q),{startPoint:w})),e({type:"MOVE_ANNOTATION",payload:{id:Q.annotation.id,delta:{x:D,y:K}}})}return}!A||!t.isAnnotating||e({type:"CONTINUE_PATH",payload:w})},[A,t.isAnnotating,t.activeTool,Q,Gt,lt,ht,zt,we,Lt,re,ne,te,on,to,e,Tn,ns]),Si=Oe(v=>{var E,N,H,at,D,K;if(ce.current.isDragging){let S=ce.current,T=S.element;if(T&&S.selector&&S.elementInfo&&oe){T instanceof HTMLElement&&(T.style.removeProperty("font-size"),T.style.removeProperty("line-height"),T.style.removeProperty("transition"));let J=[];if(S.originalFontSize!==oe.fontSize&&(Yt(T,"font-size",`${oe.fontSize}px`),J.push({property:"font-size",original:`${S.originalFontSize}px`,modified:`${oe.fontSize}px`})),S.originalLineHeight!==oe.lineHeight){let R=S.originalFontSize>0?Math.round(S.originalLineHeight/S.originalFontSize*1e3)/1e3:1.2,F=oe.fontSize>0?Math.round(oe.lineHeight/oe.fontSize*1e3)/1e3:1.2;Yt(T,"line-height",`${F}`),J.push({property:"line-height",original:`${R}`,modified:`${F}`})}J.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(E=S.durableSelector)!=null?E:void 0,element:S.elementInfo,changes:J}})}ce.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},X(null);return}if(Vt.current.isDragging){let S=Vt.current,T=S.element,J="button"in v&&v.button===2;if(!S.hasMoved&&!J&&T&&S.selector&&S.elementInfo){T instanceof HTMLElement&&T.style.removeProperty("transition");let R=["space-between","space-around","stretch","normal"],F=S.originalJustifyContent||"normal",$=R.indexOf(F),_=R[($+1)%R.length],ut=[];_==="normal"?(Yt(T,"justify-content","normal"),ut.push({property:"justify-content",original:S.originalJustifyContent,modified:"normal"})):_==="stretch"?(Yt(T,"justify-content",_),Yt(T,"row-gap","8px"),Yt(T,"column-gap","8px"),ut.push({property:"justify-content",original:S.originalJustifyContent||"normal",modified:_}),S.originalRow!==8&&ut.push({property:"row-gap",original:`${S.originalRow}px`,modified:"8px"}),S.originalColumn!==8&&ut.push({property:"column-gap",original:`${S.originalColumn}px`,modified:"8px"})):(T instanceof HTMLElement&&(T.style.removeProperty("row-gap"),T.style.removeProperty("column-gap")),Yt(T,"justify-content",_),ut.push({property:"justify-content",original:S.originalJustifyContent||"normal",modified:_}),S.originalRow>0&&ut.push({property:"row-gap",original:`${S.originalRow}px`,modified:"0px"}),S.originalColumn>0&&ut.push({property:"column-gap",original:`${S.originalColumn}px`,modified:"0px"})),ut.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(N=S.durableSelector)!=null?N:void 0,element:S.elementInfo,changes:ut}})}else if(S.hasMoved&&T&&S.selector&&S.elementInfo&&Ut){T instanceof HTMLElement&&(T.style.removeProperty("row-gap"),T.style.removeProperty("column-gap"),T.style.removeProperty("transition"));let R=[];S.isAuto?(T instanceof HTMLElement&&T.style.removeProperty("justify-content"),Yt(T,"justify-content","normal"),Yt(T,"row-gap",`${Ut.row}px`),Yt(T,"column-gap",`${Ut.column}px`),R.push({property:"justify-content",original:S.originalJustifyContent,modified:"normal"}),R.push({property:"row-gap",original:"0px",modified:`${Ut.row}px`}),R.push({property:"column-gap",original:"0px",modified:`${Ut.column}px`})):(S.originalRow!==Ut.row&&(Yt(T,"row-gap",`${Ut.row}px`),R.push({property:"row-gap",original:`${S.originalRow}px`,modified:`${Ut.row}px`})),S.originalColumn!==Ut.column&&(Yt(T,"column-gap",`${Ut.column}px`),R.push({property:"column-gap",original:`${S.originalColumn}px`,modified:`${Ut.column}px`}))),R.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(H=S.durableSelector)!=null?H:void 0,element:S.elementInfo,changes:R}})}Vt.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},fe(null);return}if($e.current.isDragging){let S=$e.current,T=S.element;if(T&&S.selector&&S.elementInfo&&me){T instanceof HTMLElement&&(T.style.removeProperty("border-top-left-radius"),T.style.removeProperty("border-top-right-radius"),T.style.removeProperty("border-bottom-right-radius"),T.style.removeProperty("border-bottom-left-radius"),T.style.removeProperty("transition"));let J=["top-left","top-right","bottom-right","bottom-left"],R={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},F=[];for(let $ of J)S.original[$]!==me.radius[$]&&(Yt(T,R[$],`${me.radius[$]}px`),F.push({property:R[$],original:`${S.original[$]}px`,modified:`${me.radius[$]}px`}));F.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(at=S.durableSelector)!=null?at:void 0,element:S.elementInfo,changes:F}})}$e.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},ke(null);return}if(Ht.current.isDragging){let S=Ht.current,T=S.element,J=S.selector,R=S.elementInfo;if(T&&J&&R&&mt){let F=S.original,$=mt.padding;T instanceof HTMLElement&&(T.style.removeProperty("padding"),T.style.removeProperty("transition"));let _=[],ut=[{prop:"padding-top",origVal:F.top,newVal:$.top},{prop:"padding-right",origVal:F.right,newVal:$.right},{prop:"padding-bottom",origVal:F.bottom,newVal:$.bottom},{prop:"padding-left",origVal:F.left,newVal:$.left}];for(let{prop:kt,origVal:se,newVal:Xt}of ut)se!==Xt&&(Yt(T,kt,`${Xt}px`),_.push({property:kt,original:`${se}px`,modified:`${Xt}px`}));_.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:J,durableSelector:(D=S.durableSelector)!=null?D:void 0,element:R,changes:_}})}Ht.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},Bt(null);return}if(Gt){We(null);return}if(Q){if(!Q.hasMoved&&Q.annotation.type==="text"&&((K=Q.annotation.status)!=null?K:"pending")==="pending"){let S=to(v);nt({id:Q.annotation.id,point:Q.annotation.points[0],text:Q.annotation.text||"",fontSize:Q.annotation.fontSize||12,isNew:!1,clickPoint:S,groupId:Q.annotation.groupId})}jt(null);return}if(!A)return;let w=5;if(t.currentPath.length>=2){let S=t.currentPath[0],T=t.currentPath[t.currentPath.length-1],J=Math.abs(T.x-S.x),R=Math.abs(T.y-S.y);if((t.activeTool==="line"?Math.sqrt(J*J+R*R)<w:J<w&&R<w)&&["rectangle","circle","line"].includes(t.activeTool)){M(!1),e({type:"CANCEL_PATH"});return}}let q=Ii(t.currentPath);if(t.activeTool==="rectangle"&&t.currentPath.length>=2){let S=t.currentPath[0],T=t.currentPath[t.currentPath.length-1],J=Math.min(S.x,T.x),R=Math.max(S.y,T.y),F=t.strokeWidth/2,$=Math.random().toString(36).substring(2,9);O({point:{x:J-F+4,y:R+F+4},groupId:$}),M(!1),e({type:"FINISH_PATH",payload:{groupId:$,elements:q}});return}M(!1),e({type:"FINISH_PATH",payload:{elements:q}})},[A,Q,Gt,mt,me,Ut,oe,to,e,t.activeTool,t.currentPath,t.strokeWidth]),pl=Oe(v=>{let w=v.target.value;_o.current=v.target.selectionStart,nt(q=>q&&y(m({},q),{text:w}))},[]),fl=Oe(v=>{v.key==="Escape"?nt(null):v.key==="Enter"&&!v.shiftKey&&(v.preventDefault(),eo())},[eo]),gl=Oe(v=>{if(!C)return;let w=v.clipboardData.items,q=[];for(let E=0;E<w.length;E++){let N=w[E];if(N.type.startsWith("image/")){let H=N.getAsFile();H&&q.push(H)}}q.length>0&&(v.preventDefault(),nt(E=>E?y(m({},E),{images:[...E.images||[],...q]}):null))},[C]),ml=Oe(v=>{if(!t.isAnnotating)return;if(t.activeTool==="hand"){v.preventDefault();let q=ht||re||we||te;if(q&&!I(q)){let E=Ke(q),N=ln(q);e({type:"SELECT_ELEMENT",payload:{el:q,info:y(m({},E),{selector:N})}})}return}v.preventDefault();let w=k.current;w&&(B.current=!0,w.style.pointerEvents="none",setTimeout(()=>{B.current&&(B.current=!1,w.style.pointerEvents="")},4e3))},[t.activeTool,t.isAnnotating,ht,re,we,te,e,I,k]);Ge(()=>{let v=t.annotations.filter(H=>H.linkedSelector);if(v.length===0)return;let w=null,q=()=>{var at,D,K;let H=[];for(let S of v){let T=document.querySelector(S.linkedSelector);if(!T&&((D=(at=S.elements)==null?void 0:at[0])!=null&&D.selector)&&S.linkedSelector.startsWith("[data-pm=")){try{T=document.querySelector(S.elements[0].selector)}catch(Xt){}if(T){let Xt=(K=S.linkedSelector.match(/data-pm="([^"]+)"/))==null?void 0:K[1];Xt&&T.setAttribute("data-pm",Xt)}}if(!T)continue;let J=T.getBoundingClientRect(),R=t.styleModifications.some(Xt=>{try{return T.matches(Xt.selector)}catch(Ie){return!1}}),F=v.filter(Xt=>Xt.id!==S.id&&Xt.timestamp<S.timestamp&&Xt.linkedSelector===S.linkedSelector).length,$=(R?1:0)+F,_=J.top>=uo*(1+$)?"top-left":"bottom-left",ut=Wa(J,_,$),kt=S.points[0],se=_!==S.linkedAnchor;kt&&(se||Math.abs(ut.x-kt.x)>1||Math.abs(ut.y-kt.y)>1)&&H.push({id:S.id,point:ut,linkedAnchor:se?_:void 0})}H.length>0&&e({type:"UPDATE_LINKED_POSITIONS",payload:{updates:H}})},E=()=>{w&&cancelAnimationFrame(w),w=requestAnimationFrame(q)};q(),window.addEventListener("scroll",E,!0),window.addEventListener("resize",E,!0),window.addEventListener("load",E),document.fonts.ready.then(E);let N=new MutationObserver(E);return N.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",E,!0),window.removeEventListener("resize",E,!0),window.removeEventListener("load",E),N.disconnect(),w&&cancelAnimationFrame(w)}},[t.annotations,e]);let hl=()=>{var v,w,q;if(!t.isAnnotating)return"default";if(Gt){let{handle:E}=Gt;return E==="start"||E==="end"?"move":E==="top"||E==="bottom"?"ns-resize":E==="left"||E==="right"?"ew-resize":E==="topLeft"||E==="bottomRight"?"nwse-resize":"nesw-resize"}if(t.activeTool==="text")return"text";if(t.activeTool==="hand"){let E=(v=Ut==null?void 0:Ut.axis)!=null?v:ne;if(E==="row")return"ns-resize";if(E==="column")return"ew-resize";if(me||Lt)return"ns-resize";let N=(w=oe==null?void 0:oe.property)!=null?w:on;if(N==="font-size")return"ew-resize";if(N==="line-height")return"ns-resize";let H=(q=mt==null?void 0:mt.side)!=null?q:zt;return H==="top"||H==="bottom"?"ns-resize":H==="left"||H==="right"?"ew-resize":"default"}return"crosshair"},yl={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:t.isAnnotating?"auto":"none",visibility:t.isAnnotating?"visible":"hidden",cursor:hl()},rs=Oe(()=>{let v=k.current;if(!v||!C)return{width:100,height:12*1.4};let w=v.getContext("2d");if(!w)return{width:100,height:C.fontSize*1.4};w.font=`${C.fontSize}px ${ve}`;let E=w.measureText("Type here...").width,N=C.text.split(`
10
+ `),H=N.length>0?Math.max(E,...N.map(D=>w.measureText(D||" ").width)):E,at=Math.max(1,N.length)*C.fontSize*1.4;return{width:H,height:at}},[C,k])(),bl=C?{position:"fixed",left:C.point.x-4-be.x,top:C.point.y-4-be.y,zIndex:9999,width:rs.width+8,height:rs.height+8,padding:4,fontSize:C.fontSize,fontFamily:ve,color:"#ffffff",backgroundColor:t.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:"pre"}:{};return bo(xo,{children:[ie("canvas",{ref:k,id:"devtools-canvas",style:yl,onMouseDown:os,onMouseMove:is,onMouseUp:v=>Si(v),onMouseLeave:v=>Si(v),onTouchStart:os,onTouchMove:is,onTouchEnd:v=>Si(v),onContextMenu:ml}),C&&bo(xo,{children:[ie("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),ie("textarea",{id:"devtools-text-input",ref:vt,value:C.text,onChange:pl,onKeyDown:fl,onPaste:gl,onBlur:eo,placeholder:"Type here...",style:bl}),C.images&&C.images.length>0&&bo("div",{"data-devtools":!0,style:{position:"fixed",left:C.point.x-4-be.x,top:C.point.y-4-be.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"]})]}),t.isAnnotating&&t.activeTool!=="hand"&&t.styleModifications.length>0&&ie(xa,{styleModifications:t.styleModifications,isInspecting:!!t.inspectedElement,accentColor:t.activeColor,annotationGroupCount:new Set(t.annotations.map(v=>v.groupId||v.id)).size,dispatch:e,inFlightSelectors:i}),t.activeTool==="hand"&&t.isAnnotating&&t.styleModifications.length>0&&ie(Sa,{styleModifications:t.styleModifications,accentColor:t.activeColor}),t.isAnnotating&&ie(la,{annotations:t.annotations,supersededAnnotations:En,inFlightIds:n,scrollX:be.x,scrollY:be.y,annotationGroupMap:Eo,onViewThread:l,onSelectAnnotation:_t}),t.isAnnotating&&((c==null?void 0:c.status)==="awaiting_approval"||(c==null?void 0:c.status)==="planning")&&c.threadId&&l&&ie(ca,{annotations:t.annotations,supersededAnnotations:En,scrollX:be.x,scrollY:be.y,annotationGroupMap:Eo,planThreadId:c.threadId,taskCount:(ls=(as=c.tasks)==null?void 0:as.length)!=null?ls:0,planStatus:c.status,onViewThread:l,onSelectAnnotation:_t}),t.isAnnotating&&a&&ie(da,{annotations:t.annotations,supersededAnnotations:En,scrollX:be.x,scrollY:be.y,onReply:a,annotationGroupMap:Eo}),t.isAnnotating&&r&&r.size>0&&ie(tr,{inFlightSelectorColors:r}),t.isAnnotating&&Qr&&ie(tr,{inFlightSelectorColors:Qr,animated:!1}),t.activeTool==="hand"&&t.isAnnotating&&(Ut?Vt.current.element:re)&&ie(rr,{element:Ut?Vt.current.element:re,gap:Ut?{row:Ut.row,column:Ut.column}:Lo(re),accentColor:t.activeColor,hoveredAxis:ne,draggingAxis:(cs=Ut==null?void 0:Ut.axis)!=null?cs:null,cursorViewport:xt,isAutoGap:Ve,refreshKey:Ze}),t.activeTool==="hand"&&t.isAnnotating&&_e&&ie(za,{element:_e.target,modifier:_e.modifier,accentColor:t.activeColor,refreshKey:Ze}),t.activeTool==="hand"&&t.isAnnotating&&!_e&&(me?$e.current.element:we)&&ie(ma,{element:me?$e.current.element:we,radius:(ds=me==null?void 0:me.radius)!=null?ds:Gn(we),accentColor:t.activeColor,hoveredCorner:Lt,draggingCorner:(us=me==null?void 0:me.corner)!=null?us:null,cursorViewport:xt}),t.activeTool==="hand"&&t.isAnnotating&&!_e&&(oe?ce.current.element:te)&&ie(_a,{element:oe?ce.current.element:te,fontSize:(ps=oe==null?void 0:oe.fontSize)!=null?ps:Ro(te).fontSize,lineHeight:(fs=oe==null?void 0:oe.lineHeight)!=null?fs:Ro(te).lineHeight,accentColor:t.activeColor,hoveredProperty:on,draggingProperty:(gs=oe==null?void 0:oe.property)!=null?gs:null,cursorViewport:xt}),t.activeTool==="hand"&&t.isAnnotating&&!_e&&(mt?Ht.current.element:ht)&&ie(ur,{element:mt?Ht.current.element:ht,padding:(ms=mt==null?void 0:mt.padding)!=null?ms:ao(ht),accentColor:t.activeColor,hoveredSide:zt,draggingSide:(hs=mt==null?void 0:mt.side)!=null?hs:null,cursorViewport:xt,refreshKey:oe?oe.fontSize+oe.lineHeight*1e3:0}),t.activeTool==="inspector"&&t.isAnnotating&&ie(xo,{children:lt&&!t.inspectedElement&&(()=>{let v=!!tt||!!(C!=null&&C.linkedSelector)||t.annotations.some(w=>{if(!w.linkedSelector)return!1;try{return lt.matches(w.linkedSelector)}catch(q){return!1}});return ie(po,{element:lt,isSelected:!1,elementInfo:Y,color:t.activeColor,hideTooltip:v})})()}),t.activeTool==="model"&&t.isAnnotating&&St.size>0&&[...St.entries()].map(([v,w])=>ie(po,{element:w.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:w.rootElement.tagName.toLowerCase(),reactComponent:v},color:"#8b5cf6"},v)),t.activeTool==="model"&&t.isAnnotating&&Ye&&ie(po,{element:Ye.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:Ye.rootElement.tagName.toLowerCase(),reactComponent:Ye.name},color:"#22c55e"}),t.activeTool==="model"&&t.isAnnotating&&qr.length>0&&qr.map((v,w)=>ie("div",{style:{position:"absolute",left:v.x,top:v.y,width:v.width,height:v.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:v.direction==="vertical"?bo(xo,{children:[ie("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ie("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ie("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ie("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:v.height<16?-6:"50%",transform:v.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(v.height)})]}):bo(xo,{children:[ie("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ie("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ie("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ie("div",{style:{position:"absolute",left:v.width<30?0:"50%",top:(v.width<30,void 0),bottom:"calc(50% + 4px)",transform:v.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(v.width)})]})},w)),t.activeTool==="model"&&t.isAnnotating&&At&&ie(po,{element:At.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:At.rootElement.tagName.toLowerCase(),reactComponent:At.name},color:f!=null&&f.has(At.name)?"#22c55e":"#8b5cf6"}),t.activeTool==="hand"&&t.isAnnotating&&t.inspectedElement&&bo(xo,{children:[rt&&rt!=="padding"&&rt!=="gap"&&(()=>{var D;let v=new Set(t.annotations.map(K=>K.groupId||K.id)).size,w=t.inspectedElement.info.selector,q=t.styleModifications.findIndex(K=>K.selector===w),E=q>=0?v+q+1:v+t.styleModifications.length+1,N=t.styleModifications.find(K=>K.selector===w),H=(D=N==null?void 0:N.changes.length)!=null?D:0,at=!!(N!=null&&N.captured);return ie(po,{element:t.inspectedElement.el,isSelected:!0,elementInfo:t.inspectedElement.info,color:at?"#999999":t.activeColor,annotationNumber:E,changeCount:H})})(),rt==="padding"&&ie(ur,{element:t.inspectedElement.el,padding:ao(t.inspectedElement.el),accentColor:t.activeColor,hoveredSide:null,draggingSide:null}),rt==="gap"&&ie(rr,{element:t.inspectedElement.el,gap:Lo(t.inspectedElement.el),accentColor:t.activeColor,hoveredAxis:null,draggingAxis:null}),ie(Fa,{element:t.inspectedElement.el,elementInfo:t.inspectedElement.info,selector:t.inspectedElement.info.selector,styleModifications:t.styleModifications,dispatch:e,onClose:()=>e({type:"SELECT_ELEMENT",payload:null}),onHover:ct,accentColor:t.activeColor})]})]})}import{useCallback as un,useEffect as bn,useMemo as Ar,useRef as Re,useState as Oo}from"react";import{Circle as Ru,Component as Au,Hand as Pu,MessageCircle as Bu,Pen as Nu,Slash as Du,Square as Ou,Trash2 as Fu,Type as Hu}from"lucide-react";import{useEffect as ru,useRef as su}from"react";function ja(t,e,o,n,i){let r=su(0);ru(()=>{if(!o.current||(localStorage.setItem(i.expanded,String(t)),!t))return;let s=e.annotations.length;(s>=r.current||s===0||!n)&&(localStorage.setItem(i.annotations,JSON.stringify(e.annotations)),r.current=s),localStorage.setItem(i.styleMods,JSON.stringify(e.styleModifications)),localStorage.setItem(i.spacingChanges,JSON.stringify(e.spacingTokenChanges)),localStorage.setItem(i.tool,e.activeTool),localStorage.setItem(i.color,e.activeColor),localStorage.setItem(i.stroke,String(e.strokeWidth)),e.inspectedElement?localStorage.setItem(i.inspected,JSON.stringify({selector:e.inspectedElement.info.selector,info:e.inspectedElement.info})):localStorage.removeItem(i.inspected)},[t,e.annotations,e.styleModifications,e.spacingTokenChanges,e.activeTool,e.activeColor,e.strokeWidth,e.inspectedElement,n,o,i])}import{Component as au,createElement as lu,useCallback as mi,useEffect as So,useRef as vo,useState as yn}from"react";import{Fragment as wo,jsx as Wt,jsxs as Qe}from"react/jsx-runtime";var Ga="popmelt-library-tab",cu=/^#[0-9a-fA-F]{3,8}$/,du=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,uu=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),pu=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function Va(t){let e=t.trim();return cu.test(e)||du.test(e)||uu.has(e.toLowerCase())}function fu(t){return pu.test(t.trim())}function gu(t){let e=t.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return e?parseFloat(e[1]):null}function Ir(t,e=""){if(t==null)return[];if(typeof t!="object")return[[e,String(t)]];if(Array.isArray(t))return[[e,t.map(String).join(", ")]];let o=[];for(let[n,i]of Object.entries(t)){let r=e?`${e}.${n}`:n;if(i!==null&&typeof i=="object"&&!Array.isArray(i)){let s=i;typeof s.value=="string"?o.push([r,s.value]):o.push(...Ir(i,r))}else o.push([r,Array.isArray(i)?i.map(String).join(", "):String(i!=null?i:"")])}return o}function mu(t){return t.length===0?"generic":t.filter(([,n])=>Va(n)).length>t.length/2?"colors":t.filter(([,n])=>fu(n)).length>t.length/2?"spacing":"generic"}var hu=y(m({position:"fixed",top:16,right:16,bottom:80,width:300,backgroundColor:"#ffffff"},gn),{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"}),Xa={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},yu=y(m({},Xa),{color:"#1f2937",borderBottom:"1.5px solid #1f2937"});function bu({entries:t}){let e=[],o=[];for(let n of t)Va(n[1])?e.push(n):o.push(n);return Qe(wo,{children:[e.length>0&&Wt("div",{style:{display:"flex",flexWrap:"wrap",gap:2,marginBottom:o.length>0?6:0},children:e.map(([n,i])=>Wt("div",{title:`${n.split(".").pop()}: ${i}`,style:{width:28,height:28,backgroundColor:i,outline:"1px solid rgba(0,0,0,0.08)",outlineOffset:-1}},n))}),o.length>0&&Wt(Lr,{entries:o})]})}var gi=[0,1,2,4,8,12,16,20,24,28,32];function xu(t){if(t<=32){let e=gi[0],o=Math.abs(t-e);for(let n=1;n<gi.length;n++){let i=Math.abs(t-gi[n]);i<o&&(e=gi[n],o=i)}return e}return Math.round(t/8)*8}function vu({label:t,value:e,px:o,tokenPath:n,rawToken:i,onHover:r,onModify:s,onDelete:a}){let[l,c]=yn(!1),[d,u]=yn(null),p=vo(!1),f=vo(0),g=vo(0),x=vo([]),k=d!==null?d:o,b=d!==null?`${d}px`:e,P=d!==null,B=mi(M=>{M.preventDefault(),p.current=!0,f.current=M.clientX,g.current=o;let C=Uo(i);x.current=Ai(C);let nt=G=>{let U=G.clientX-f.current,O=Math.max(0,Math.round(g.current+U));G.shiftKey&&(O=xu(O));for(let tt of x.current)tt.element.style.setProperty(tt.property,O+"px","important");u(O),r==null||r({name:t,px:O,token:C})},j=()=>{window.removeEventListener("mousemove",nt),window.removeEventListener("mouseup",j),document.body.style.cursor="",p.current=!1,u(G=>{if(G!==null&&G!==o&&s){let U=Uo(i),O=U.bindings&&U.bindings.length>0,tt;if(O){let bt=Bi(U.bindings,g.current,G);tt=JSON.stringify(y(m({},U),{value:`${G}px`,bindings:bt}))}else{let bt=Ws(x.current,g.current),Dt=Ys(x.current);if(bt.length>0){let Ot=Bi(bt,g.current,G);tt=JSON.stringify({value:`${G}px`,property:Dt,bindings:Ot})}else tt=`${G}px`}let et=typeof i=="string"?i:JSON.stringify(i),vt=x.current.map(bt=>({selector:ln(bt.element),property:bt.property})),dt=Gs(x.current,g.current,G);s({tokenPath:n,originalValue:et,currentValue:tt,targets:vt,originalPx:g.current,currentPx:G},{id:Math.random().toString(36).substring(2,9),tokenPath:n,tokenName:t,originalPx:g.current,newPx:G,affectedElements:dt})}return G})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",nt),window.addEventListener("mouseup",j)},[o,t,n,i,r,s]),A=Uo(i);return Qe("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",fontSize:11,padding:"1px 0",cursor:"ew-resize",userSelect:"none"},onMouseEnter:()=>{p.current||(c(!0),r==null||r({name:t,px:k,token:A}))},onMouseLeave:()=>{p.current||(c(!1),r==null||r(null))},onMouseDown:B,children:[Wt("span",{style:{color:l||P?"#FF0000":"#9ca3af"},children:t}),Qe("span",{style:{display:"flex",alignItems:"center",gap:4},children:[Wt("span",{style:{color:l||P?"#FF0000":"#6b7280",fontWeight:600},children:b}),a&&l&&!P&&Wt("button",{type:"button",title:"Remove token",onMouseDown:M=>{M.stopPropagation();let C=typeof i=="string"?i:JSON.stringify(i);a(n,C)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:M=>{M.currentTarget.style.color="#FF0000"},onMouseLeave:M=>{M.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function Su({entries:t,categoryKey:e,rawTokens:o,onHover:n,onModify:i,onDelete:r}){let s=[],a=[];for(let l of t){let c=gu(l[1]);c!==null?s.push([l[0],l[1],c]):a.push(l)}return Qe(wo,{children:[s.length>0&&Wt("div",{style:{display:"flex",flexDirection:"column",gap:2},children:s.map(([l,c,d])=>{let u=l.split(".").pop(),p=o?wu(o,l):c,f=p&&typeof p=="object"&&"value"in p?p:c;return Wt(vu,{label:u,value:c,px:d,tokenPath:`tokens.${e}.${l}`,rawToken:f,onHover:n,onModify:i,onDelete:r},l)})}),a.length>0&&Wt(Lr,{entries:a})]})}function wu(t,e){let o=e.split("."),n=t;for(let i of o){if(n==null||typeof n!="object")return;n=n[i]}return n}function Lr({entries:t}){return Wt("div",{style:{display:"flex",flexDirection:"column",gap:3},children:t.map(([e,o])=>Qe("div",{style:{fontSize:11},children:[Wt("div",{style:{color:"#9ca3af",fontSize:10,marginBottom:1},children:e}),Wt("div",{style:{color:"#1f2937",lineHeight:1.4,paddingLeft:8},children:o})]},e))})}function Ja({entries:t,categoryKey:e,rawTokens:o,onSpacingHover:n,onModifyToken:i,onDeleteToken:r}){let s=mu(t);return s==="colors"?Wt(bu,{entries:t}):s==="spacing"?Wt(Su,{entries:t,categoryKey:e,rawTokens:o,onHover:n,onModify:i,onDelete:r}):Wt(Lr,{entries:t})}function ku(t){let e=t.toLowerCase(),o=null,n=document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT,{acceptNode(r){return r.closest("#devtools-toolbar, #devtools-canvas, #devtools-scrim, [data-popmelt-panel]")?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}}),i=n.currentNode;for(;i=n.nextNode();){let r=i,s=Object.keys(r).find(l=>l.startsWith("__reactFiber$")||l.startsWith("__reactInternalInstance$"));if(!s)continue;let a=r[s];for(;a;){let l=a.type,c=typeof l=="function"||typeof l=="object"?(l==null?void 0:l.displayName)||(l==null?void 0:l.name):null;if(typeof c=="string"){let d=c.toLowerCase();if(d===e){let u=m({},a.memoizedProps);return delete u.ref,{type:l,props:u}}if(!o){if(d.length>=4&&e.includes(d)){let u=m({},a.memoizedProps);delete u.ref,o={type:l,props:u}}else if(e.length>=4&&d.includes(e)){let u=m({},a.memoizedProps);delete u.ref,o={type:l,props:u}}}}a=a.return}}return o}var Mr=class extends au{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 Cu({children:t}){return Wt("div",{style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:6},children:t})}function Eu({tokens:t,onSpacingTokenHover:e,onModifyToken:o,onDeleteToken:n}){return!t||Object.keys(t).length===0?Wt("div",{style:{color:"#9ca3af",fontSize:11},children:"No tokens defined yet."}):Wt(wo,{children:Object.entries(t).map(([i,r])=>Qe("div",{style:{marginBottom:14},children:[Wt(Cu,{children:i}),Wt(Ja,{entries:Ir(r),categoryKey:i,rawTokens:r,onSpacingHover:e,onModifyToken:o,onDeleteToken:n})]},i))})}function Tu({rules:t}){return!t||t.length===0?Wt("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."}):Wt(wo,{children:t.map((e,o)=>Qe("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[Qe("span",{style:{color:"#9ca3af",flexShrink:0},children:[o+1,"."]}),Wt("span",{children:e})]},o))})}function Mu({name:t,value:e,selected:o,highlighted:n,onRemove:i,onHover:r}){var G;let[s,a]=yn(!1),[l,c]=yn(!1),d=vo(null),u=vo(0),[p,f]=yn(0),[g,x]=yn(0),k=Ir(e),b=(G=k.find(([U])=>U==="description"))==null?void 0:G[1];So(()=>{if(!l&&!n){f(0),x(0),u.current=0;return}let U=ro(t);f(U.length)},[l,n,t]),So(()=>{o&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[o]);let P=o||n||l,B=o?"139,92,246":"34,197,94",A=o?"#8b5cf6":"#22c55e",M=P?`rgba(${B},0.06)`:void 0,C=P?`inset 0 0 0 1.5px rgba(${B},0.35)`:void 0,nt=n||l,j=mi(()=>{let U=ro(t);if(U.length===0)return;let O=u.current%U.length;U[O].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),x(O),u.current=O+1,r==null||r({name:t,instanceIndex:O})},[t,r]);return Qe("div",{ref:d,onClick:j,onMouseEnter:()=>{c(!0),r==null||r({name:t,instanceIndex:0})},onMouseLeave:()=>{c(!1),r==null||r(null)},style:{marginBottom:8,background:M,padding:6,boxShadow:C,cursor:"pointer"},children:[Qe("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[Qe("div",{style:{display:"flex",alignItems:"center",gap:6,marginBottom:6},children:[Wt("div",{style:{fontWeight:700,fontSize:11,letterSpacing:"0.05em",padding:"2px 6px",backgroundColor:nt?A:"transparent",color:nt?"#fff":"#6b7280"},children:t}),nt&&p>1&&Qe("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[g+1,"/",p]})]}),i&&l&&Wt("button",{type:"button",title:"Remove from model",onClick:U=>{U.stopPropagation(),i(t)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:U=>{U.currentTarget.style.color="#FF0000"},onMouseLeave:U=>{U.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),b&&Wt("div",{style:{fontSize:11,color:nt?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:b}),s?Wt(Ja,{entries:k.filter(([U])=>U!=="description"),categoryKey:""}):Wt(Iu,{name:t,onNotFound:()=>a(!0),entries:k})]})}function Iu({name:t,onNotFound:e}){let[o,n]=yn(null),[i,r]=yn(!1);return So(()=>{let s=ku(t);s||e(),n(s),r(!0)},[t,e]),!i||!o?null:Wt(Mr,{onError:e,children:Wt("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"},children:Wt("div",{style:{zoom:.5},children:lu(o.type,o.props)})})})}function Lu({components:t,selectedComponent:e,hoveredComponent:o,onRemove:n,onHover:i}){if(!t||Object.keys(t).length===0)return Wt("div",{style:{color:"#9ca3af",fontSize:11},children:"No component patterns defined yet."});let r=new Set(Object.keys(t)),s=Mi(r),a=Object.entries(t).sort(([l],[c])=>{var d,u;return((d=s.get(l))!=null?d:1/0)-((u=s.get(c))!=null?u:1/0)});return Wt(wo,{children:a.map(([l,c])=>Wt(Mu,{name:l,value:c,selected:e===l,highlighted:o===l,onRemove:n,onHover:i},l))})}function Ka({bridgeUrl:t,modelRefreshKey:e,onMouseEnter:o,onMouseLeave:n,selectedComponent:i,hoveredComponent:r,onComponentHover:s,onSpacingTokenHover:a,onModifySpacingToken:l,onDeleteSpacingToken:c,onComponentAdded:d,onComponentRemoved:u}){let[p,f]=yn(void 0),[g,x]=yn(!0),[k,b]=yn(()=>{try{let O=localStorage.getItem(Ga);if(O==="tokens"||O==="components"||O==="rules")return O}catch(O){}return"components"});So(()=>{no(t).then(O=>{f(O),x(!1)})},[t,e]),So(()=>{try{localStorage.setItem(Ga,k)}catch(O){}},[k]),So(()=>{i&&(b("components"),no(t).then(O=>{O&&f(O)}))},[i,t]);let P=mi((O,tt)=>{f(et=>{if(!(et!=null&&et.tokens))return et;let vt=JSON.parse(JSON.stringify(et.tokens)),dt=O.split("."),bt=vt;for(let Dt=1;Dt<dt.length-1;Dt++)if(bt=bt[dt[Dt]],!bt)return et;return delete bt[dt[dt.length-1]],y(m({},et),{tokens:vt})}),c==null||c(O,tt)},[c]),B=mi(O=>{f(tt=>{if(!(tt!=null&&tt.components))return tt;let dt=tt.components,{[O]:et}=dt,vt=Dn(dt,[jo(O)]);return y(m({},tt),{components:vt})}),u==null||u(O)},[u]),A=p==null?void 0:p.tokens,M=p==null?void 0:p.components,C=p==null?void 0:p.rules,nt=A&&Object.keys(A).length>0,j=M&&Object.keys(M).length>0,G=C&&C.length>0,U=!p||!nt&&!j&&!G;return Qe("div",{style:hu,onMouseEnter:o,onMouseLeave:n,children:[Qe("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[Wt("span",{children:"Model"}),Wt("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"M"})]}),Wt("div",{style:{display:"flex",gap:12,marginBottom:10,borderBottom:"1px solid rgba(0,0,0,0.08)",paddingBottom:6},children:["components","rules"].map(O=>Wt("button",{type:"button",style:k===O?yu:Xa,onClick:()=>b(O),children:O.charAt(0).toUpperCase()+O.slice(1)},O))}),Wt("div",{style:{flex:1,overflowY:"auto",minHeight:0},children:g?Wt("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):U?Wt("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):Qe(wo,{children:[k==="components"&&Wt(Lu,{components:M,selectedComponent:i,hoveredComponent:r,onRemove:B,onHover:s}),k==="tokens"&&Wt(Eu,{tokens:A,onSpacingTokenHover:a,onModifyToken:l,onDeleteToken:c?P:void 0}),k==="rules"&&Wt(Tu,{rules:C})]})})]})}import{jsx as Ua}from"react/jsx-runtime";var An={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#f3f4f6",bgHover:"#f9fafb",separator:"#e5e7eb"};function Pn({children:t,active:e,siblingActive:o,disabled:n,onClick:i,title:r}){let s=()=>n?.4:o&&!e?.5:1,a={position:"relative",display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,borderRadius:0,border:"none",cursor:n?"default":"pointer",transition:"background-color 150ms ease, color 150ms ease, transform 100ms ease, opacity 150ms ease",backgroundColor:e?An.bgActive:"transparent",color:e?An.iconActive:An.iconDefault,opacity:s()};return Ua("button",{type:"button",onClick:n?void 0:i,title:r,disabled:n,style:a,onMouseEnter:l=>{n||(l.currentTarget.style.opacity="1",e||(l.currentTarget.style.backgroundColor=An.bgHover))},onMouseLeave:l=>{n||(l.currentTarget.style.opacity=String(s()),e||(l.currentTarget.style.backgroundColor="transparent"))},onMouseDown:l=>{n||(l.currentTarget.style.transform="scale(0.95)")},onMouseUp:l=>{n||(l.currentTarget.style.transform="scale(1)")},children:t})}function Rr(){return Ua("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as Zn,jsx as st,jsxs as xe}from"react/jsx-runtime";var qn=[{type:"rectangle",icon:Ou,label:"Rectangle",shortcut:"R"},{type:"circle",icon:Ru,label:"Oval",shortcut:"O"},{type:"line",icon:Du,label:"Line",shortcut:"L"},{type:"freehand",icon:Nu,label:"Pen",shortcut:"P"}],zu=new Set(qn.map(t=>t.type));function _u(t,e,o,n,i,r,s,a){let l=(t-i)*(n-r)-(o-i)*(e-r),c=(t-s)*(r-a)-(i-s)*(e-a),d=(t-o)*(a-n)-(s-o)*(e-n),u=l<0||c<0||d<0,p=l>0||c>0||d>0;return!(u&&p)}function $u(){let t=window.innerWidth-16,e=t-326,o=window.innerHeight-80;return{left:e,right:t,y:o}}var Wu=[{type:"text",icon:Hu,label:"Text",shortcut:"T"}],Za={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
11
 
12
- Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},Bu=b(m({position:"fixed",bottom:16,right:16,zIndex:9999,display:"flex",alignItems:"center",backgroundColor:"#ffffff"},fn),{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)"}),Mi="devtools-toolbar-expanded",Ii="devtools-annotations",Li="devtools-style-modifications",Ri="devtools-active-tool",Ga="devtools-active-color",Va="devtools-stroke-width",Xa="devtools-inspected-element",Ai="devtools-spacing-changes",Du={expanded:Mi,annotations:Ii,styleMods:Li,spacingChanges:Ai,tool:Ri,color:Ga,stroke:Va,inspected:Xa};function Ou(){return st("svg",{width:"16",height:"16",viewBox:"0 0 1200 1200",fill:"currentColor",stroke:"none",children:st("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 Fu(){return st("svg",{width:"16",height:"16",viewBox:"0 0 158.7128 157.296",fill:"currentColor",stroke:"none",children:st("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 Ja({state:t,dispatch:e,onScreenshot:o,onSendToClaude:n,onPlanGoal:r,hasActiveJobs:i,activeJobColor:a,onCrosshairHover:s,onClear:c,provider:l="claude",onProviderChange:d,availableProviders:u,modelIndex:p=0,modelCount:f=2,modelLabel:g="Opus 4.6",onModelChange:y,onViewThread:S,isThreadPanelOpen:x,activePlan:L,mcpStatus:N,onInstallMcp:R,mcpJustInstalled:M,bridgeUrl:C,modelSelectedComponent:nt,modelCanvasHoveredComponent:j,onModelComponentHover:G,onSpacingTokenHover:U,onModifySpacingToken:O,onDeleteSpacingToken:tt,modelRefreshKey:et,onModelComponentAdded:vt,onModelComponentRemoved:dt}){let[bt,Dt]=Bo(()=>typeof window=="undefined"?!1:localStorage.getItem(Mi)==="true"),[Ot,At]=Bo(0),V=Re(0),St=Re(0),Pt=Re(t.isAnnotating),Kt=Re(!1),ee=Re(typeof window!="undefined"?localStorage.getItem(Ri):null),lt=Re(typeof window!="undefined"?localStorage.getItem(Ga):null),ot=Re(typeof window!="undefined"?localStorage.getItem(Va):null),{charIndex:Y}=or(!!i),[gt,Ht]=Bo(null),ht=Re(!1),Et=Re(null),zt=Re(null),W=Re({x:0,y:0}),it=Re(null),ct=Re(null),mt=Re(null),Nt=dn(()=>{it.current=null,ct.current=null,mt.current&&(clearTimeout(mt.current),mt.current=null)},[]),Bt=dn(X=>{zt.current&&(clearTimeout(zt.current),zt.current=null),ht.current?(it.current=X,ct.current=m({},W.current),mt.current&&clearTimeout(mt.current),mt.current=setTimeout(()=>{it.current&&(Ht(it.current),Nt())},300)):(Et.current&&clearTimeout(Et.current),Et.current=setTimeout(()=>{ht.current=!0,Ht(X),Et.current=null},500))},[Nt]),xt=dn(()=>{Nt(),Et.current&&(clearTimeout(Et.current),Et.current=null),zt.current=setTimeout(()=>{ht.current=!1,Ht(null)},150)},[Nt]),ue=dn(X=>{if(W.current={x:X.clientX,y:X.clientY},it.current&&ct.current){let rt=ct.current,h=Pu();Au(X.clientX,X.clientY,rt.x,rt.y,h.left,h.y,h.right,h.y)||(Ht(it.current),Nt())}},[Nt]),Vt=Ti(()=>{let X=(u!=null?u:[]).map(rt=>rt==="claude"?"Claude":rt==="codex"?"Codex":rt);return{name:"AI Model",desc:X.length>1?`${X.join(" and ")} are available.`:X.length===1?`Connected to ${X[0]}.`:"No AI providers detected.",usage:X.length>1?["Click the logo to switch between providers","Click the model name to switch tiers"]:["Click the model name to switch tiers"],keys:X.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}]}},[u]);Fa(bt,t,Kt,!!i,Du),yn(()=>{if(localStorage.getItem(Mi)==="true"&&!t.isAnnotating){if(bt||Dt(!0),e({type:"SET_TOOL",payload:ee.current||"inspector"}),e({type:"SET_ANNOTATING",payload:!0}),lt.current&&e({type:"SET_COLOR",payload:lt.current}),ot.current){let z=parseFloat(ot.current);isNaN(z)||e({type:"SET_STROKE_WIDTH",payload:z})}let rt=localStorage.getItem(Ii);if(rt)try{let z=JSON.parse(rt);Array.isArray(z)&&z.length>0&&e({type:"RESTORE_ANNOTATIONS",payload:{annotations:z}})}catch(z){}let h=localStorage.getItem(Li);if(h)try{let z=JSON.parse(h);Array.isArray(z)&&z.length>0&&(e({type:"RESTORE_STYLE_MODIFICATIONS",payload:z}),Uo(z))}catch(z){}let I=localStorage.getItem(Ai);if(I)try{let z=JSON.parse(I);Array.isArray(z)&&z.length>0&&e({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:z})}catch(z){}let A=localStorage.getItem(Xa);if(A)try{let{selector:z,info:yt}=JSON.parse(A);if(z){let Rt=Xe(z);if(Rt){let Q=yt||b(m({},Je(Rt)),{selector:z});e({type:"SELECT_ELEMENT",payload:{el:Rt,info:Q}})}}}catch(z){}}return Kt.current=!0,()=>{Kt.current=!1}},[]);let ie=Re(t.styleModifications);yn(()=>{let X=ie.current,rt=t.styleModifications;X!==rt&&(Zo(X),Uo(rt),ie.current=rt)},[t.styleModifications]),yn(()=>{let X=Pt.current;Pt.current=t.isAnnotating,X&&!t.isAnnotating&&bt&&Dt(!1)},[t.isAnnotating,bt]);let Me=Re(bt);Me.current=bt,yn(()=>{let X=h=>{if(h.key==="Meta"||h.key==="Control"){let I=Date.now();if(I-V.current<300){if(St.current++,St.current>=2){if(Me.current)e({type:"SET_ANNOTATING",payload:!1}),Dt(!1);else{let yt=localStorage.getItem(Ri);e({type:"SET_TOOL",payload:yt||"inspector"}),e({type:"SET_ANNOTATING",payload:!0}),Dt(!0)}St.current=0}}else St.current=1;V.current=I}else St.current=0},rt=h=>{h.key!=="Meta"&&h.key!=="Control"&&(St.current=0)};return window.addEventListener("keydown",X),window.addEventListener("keyup",rt),()=>{window.removeEventListener("keydown",X),window.removeEventListener("keyup",rt)}},[e]);let ne=dn(X=>{Nt(),e({type:"SET_TOOL",payload:X}),t.isAnnotating||e({type:"SET_ANNOTATING",payload:!0}),ht.current=!1,Ht(null),Et.current&&(clearTimeout(Et.current),Et.current=null),zt.current&&(clearTimeout(zt.current),zt.current=null)},[e,t.isAnnotating,Nt]),ze=dn(async()=>{window.focus(),await o()},[o]),Ut=dn(async()=>{let X=t.annotations.filter(I=>{var A;return((A=I.status)!=null?A:"pending")==="pending"}),rt=t.styleModifications.filter(I=>!I.captured),h=X.some(I=>I.type!=="text");if(r){let I=X.filter(z=>z.type==="text"&&z.text),A=I.find(z=>z.text.toLowerCase().startsWith("/plan "));if(A){let z=A.text.replace(/^\/plan\s+/i,""),yt=I.filter(Q=>Q!==A&&Q.text).map(Q=>Q.text),Rt=[z,...yt].join(". ");await r(Rt);return}}n&&await n()},[n,r,t.annotations,t.styleModifications,t.spacingTokenChanges]),fe=dn(()=>{e({type:"SET_ANNOTATING",payload:!1}),Dt(!1)},[e]),Ge=dn(()=>{Zo(t.styleModifications),document.querySelectorAll("[data-pm]").forEach(X=>X.removeAttribute("data-pm")),e({type:"CLEAR"}),e({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(Ii),localStorage.removeItem(Li),localStorage.removeItem(Ai),te(null),c==null||c()},[e,t.styleModifications,c]),[ge,Ue]=Bo(29),Ve=Re(null),_e=Re(null),tn=Re(!1),$e=dn(X=>{let rt=X.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return rt&&rt[1]?parseFloat(rt[1]):null},[]);yn(()=>{tn.current=!0;let X=`oklch(0.628 0.258 ${ge})`;e({type:"SET_COLOR",payload:X}),requestAnimationFrame(()=>{tn.current=!1})},[ge,e]),yn(()=>{if(tn.current)return;let X=$e(t.activeColor);X!==null&&Math.abs(X-ge)>.5&&Ue(X)},[t.activeColor,$e,ge]);let we=t.annotations.length>0;yn(()=>{let X=_e.current;if(!X||!we)return;let rt=h=>{h.preventDefault(),h.stopPropagation();let I=h.deltaY>0?-1:1,A=((ge+I)%360+360)%360,z=`oklch(0.628 0.258 ${A})`;Ue(A),t.selectedAnnotationIds.length>0&&e({type:"UPDATE_ANNOTATION_COLOR",payload:{id:t.lastSelectedId||t.selectedAnnotationIds[0],color:z}})};return X.addEventListener("wheel",rt,{passive:!1}),()=>X.removeEventListener("wheel",rt)},[we,t.selectedAnnotationIds,t.lastSelectedId,ge,e]);let Z=Re(!1),Lt=dn(()=>{Z.current=!1,Ve.current=setTimeout(()=>{Z.current=!0,Ue(29)},500)},[]),qt=dn(()=>{Ve.current&&(clearTimeout(Ve.current),Ve.current=null)},[]);yn(()=>()=>{Ve.current&&clearTimeout(Ve.current),mt.current&&clearTimeout(mt.current)},[]);let me=Ti(()=>nr(t.annotations),[t.annotations]),ke=Ti(()=>{let X=[],rt=new Set;for(let h of t.annotations)if(!me.has(h))if(h.groupId){if(!rt.has(h.groupId)){rt.add(h.groupId);let I=t.annotations.filter(z=>z.groupId===h.groupId&&!me.has(z)),A=I.find(z=>z.type!=="text")||I[0];X.push({id:A.id,annotations:I})}}else X.push({id:h.id,annotations:[h]});return X},[t.annotations,me]),[ce,te]=Bo(null),en=ke.length+t.styleModifications.length;yn(()=>{(en===0||ce!==null&&ce>=en)&&te(null)},[en,ce]),yn(()=>{if(t.selectedAnnotationIds.length===0&&!t.inspectedElement){te(null);return}if(t.selectedAnnotationIds.length>0){let X=t.selectedAnnotationIds[0],rt=ke.findIndex(h=>h.id===X||h.annotations.some(I=>I.id===X));rt>=0&&rt!==ce&&te(rt)}},[t.selectedAnnotationIds,t.inspectedElement,ke]);let nn=dn(()=>{var rt;if(en===0)return;let X;if(ce===null?X=0:X=(ce+1)%en,te(X),X<ke.length){let h=ke[X];if(!h)return;e({type:"SELECT_ELEMENT",payload:null}),e({type:"SELECT_ANNOTATION",payload:{id:h.id}});let I=h.annotations.find(wt=>wt.type!=="text")||h.annotations[0];if(h.annotations.some(wt=>wt.linkedSelector))e({type:"SET_TOOL",payload:"inspector"});else if(I!=null&&I.type&&I.type!=="text"&&I.type!=="inspector"){e({type:"SET_TOOL",payload:I.type});let wt=Zn.findIndex(Gt=>Gt.type===I.type);wt>=0&&At(wt)}if(I!=null&&I.color){e({type:"SET_COLOR",payload:I.color});let wt=$e(I.color);wt!==null&&Ue(wt)}let z=h.annotations.flatMap(wt=>wt.points);if(z.length===0)return;let yt=Math.min(...z.map(wt=>wt.x)),Rt=Math.max(...z.map(wt=>wt.x)),Q=Math.min(...z.map(wt=>wt.y)),jt=Math.max(...z.map(wt=>wt.y)),Mt=(yt+Rt)/2,_t=(Q+jt)/2;if(window.scrollTo({left:Mt-window.innerWidth/2,top:_t-window.innerHeight/2,behavior:"smooth"}),x&&S){let wt=(rt=h.annotations.find(Gt=>Gt.threadId))==null?void 0:rt.threadId;wt&&S(wt)}}else{let h=X-ke.length,I=t.styleModifications[h];if(!I)return;let A=Xe(I.selector);if(!A)return;e({type:"SELECT_ANNOTATION",payload:{id:null}}),e({type:"SET_TOOL",payload:"inspector"}),e({type:"SELECT_ELEMENT",payload:{el:A,info:I.element}});let z=A.getBoundingClientRect(),yt=z.left+z.width/2+window.scrollX,Rt=z.top+z.height/2+window.scrollY;window.scrollTo({left:yt-window.innerWidth/2,top:Rt-window.innerHeight/2,behavior:"smooth"})}},[ke,t.styleModifications,en,ce,e,$e,x,S]);yn(()=>{if(!bt)return;let X=rt=>{let h=document.activeElement;if((h==null?void 0:h.tagName)==="INPUT"||(h==null?void 0:h.tagName)==="TEXTAREA")return;if((rt.metaKey||rt.ctrlKey)&&rt.key==="Enter"){(n||r)&&(t.annotations.length>0||t.styleModifications.length>0||t.spacingTokenChanges.filter(z=>!z.captured).length>0)&&(rt.preventDefault(),Ut());return}if((rt.metaKey||rt.ctrlKey)&&(rt.key==="c"||rt.key==="C"||rt.code==="KeyC")){(t.annotations.length>0||t.styleModifications.length>0)&&(rt.preventDefault(),window.focus(),ze());return}if((rt.metaKey||rt.ctrlKey)&&(rt.key==="Backspace"||rt.key==="Delete")){rt.preventDefault(),Ge();return}if(rt.metaKey||rt.ctrlKey||rt.altKey)return;let I={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand"};if(rt.key.toLowerCase()==="m"){rt.preventDefault(),ne("model");return}let A=I[rt.key.toLowerCase()];if(A){rt.preventDefault();let z=Zn.findIndex(yt=>yt.type===A);z>=0&&At(z),ne(A)}};return window.addEventListener("keydown",X),()=>window.removeEventListener("keydown",X)},[bt,ne,ze,Ut,n,r,Ge,t.annotations.length,t.styleModifications.length,t.spacingTokenChanges,gt]);let wn=b(m({},Bu),{borderRadius:0,padding:bt?"0 8px":"0",width:bt?"auto":48,height:48,gap:0,justifyContent:bt?"flex-start":"center"}),oe=i&&a?a:Rn.iconActive;return bt?xe(Un,{children:[st("style",{children:`
12
+ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},Yu=y(m({position:"fixed",bottom:16,right:16,zIndex:9999,display:"flex",alignItems:"center",backgroundColor:"#ffffff"},gn),{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)"}),Pr="devtools-toolbar-expanded",Br="devtools-annotations",Nr="devtools-style-modifications",Dr="devtools-active-tool",qa="devtools-active-color",Qa="devtools-stroke-width",tl="devtools-inspected-element",Or="devtools-spacing-changes",ju={expanded:Pr,annotations:Br,styleMods:Nr,spacingChanges:Or,tool:Dr,color:qa,stroke:Qa,inspected:tl};function Gu(){return st("svg",{width:"16",height:"16",viewBox:"0 0 1200 1200",fill:"currentColor",stroke:"none",children:st("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 Vu(){return st("svg",{width:"16",height:"16",viewBox:"0 0 158.7128 157.296",fill:"currentColor",stroke:"none",children:st("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 el({state:t,dispatch:e,onScreenshot:o,onSendToClaude:n,onPlanGoal:i,hasActiveJobs:r,activeJobColor:s,onCrosshairHover:a,onClear:l,provider:c="claude",onProviderChange:d,availableProviders:u,modelIndex:p=0,modelCount:f=2,modelLabel:g="Opus 4.6",onModelChange:x,onViewThread:k,isThreadPanelOpen:b,activePlan:P,mcpStatus:B,onInstallMcp:A,mcpJustInstalled:M,bridgeUrl:C,modelSelectedComponent:nt,modelCanvasHoveredComponent:j,onModelComponentHover:G,onSpacingTokenHover:U,onModifySpacingToken:O,onDeleteSpacingToken:tt,modelRefreshKey:et,onModelComponentAdded:vt,onModelComponentRemoved:dt}){let[bt,Dt]=Oo(()=>typeof window=="undefined"?!1:localStorage.getItem(Pr)==="true"),[Ot,At]=Oo(0),V=Re(0),St=Re(0),Pt=Re(t.isAnnotating),Kt=Re(!1),ee=Re(typeof window!="undefined"?localStorage.getItem(Dr):null),lt=Re(typeof window!="undefined"?localStorage.getItem(qa):null),ot=Re(typeof window!="undefined"?localStorage.getItem(Qa):null),{charIndex:Y}=si(!!r),[gt,Ht]=Oo(null),ht=Re(!1),Et=Re(null),zt=Re(null),W=Re({x:0,y:0}),rt=Re(null),ct=Re(null),mt=Re(null),Bt=un(()=>{rt.current=null,ct.current=null,mt.current&&(clearTimeout(mt.current),mt.current=null)},[]),Nt=un(X=>{zt.current&&(clearTimeout(zt.current),zt.current=null),ht.current?(rt.current=X,ct.current=m({},W.current),mt.current&&clearTimeout(mt.current),mt.current=setTimeout(()=>{rt.current&&(Ht(rt.current),Bt())},300)):(Et.current&&clearTimeout(Et.current),Et.current=setTimeout(()=>{ht.current=!0,Ht(X),Et.current=null},500))},[Bt]),xt=un(()=>{Bt(),Et.current&&(clearTimeout(Et.current),Et.current=null),zt.current=setTimeout(()=>{ht.current=!1,Ht(null)},150)},[Bt]),ue=un(X=>{if(W.current={x:X.clientX,y:X.clientY},rt.current&&ct.current){let it=ct.current,h=$u();_u(X.clientX,X.clientY,it.x,it.y,h.left,h.y,h.right,h.y)||(Ht(rt.current),Bt())}},[Bt]),Vt=Ar(()=>{let X=(u!=null?u:[]).map(it=>it==="claude"?"Claude":it==="codex"?"Codex":it);return{name:"AI Model",desc:X.length>1?`${X.join(" and ")} are available.`:X.length===1?`Connected to ${X[0]}.`:"No AI providers detected.",usage:X.length>1?["Click the logo to switch between providers","Click the model name to switch tiers"]:["Click the model name to switch tiers"],keys:X.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}]}},[u]);ja(bt,t,Kt,!!r,ju),bn(()=>{if(localStorage.getItem(Pr)==="true"&&!t.isAnnotating){if(bt||Dt(!0),e({type:"SET_TOOL",payload:ee.current||"inspector"}),e({type:"SET_ANNOTATING",payload:!0}),lt.current&&e({type:"SET_COLOR",payload:lt.current}),ot.current){let z=parseFloat(ot.current);isNaN(z)||e({type:"SET_STROKE_WIDTH",payload:z})}let it=localStorage.getItem(Br);if(it)try{let z=JSON.parse(it);Array.isArray(z)&&z.length>0&&e({type:"RESTORE_ANNOTATIONS",payload:{annotations:z}})}catch(z){}let h=localStorage.getItem(Nr);if(h)try{let z=JSON.parse(h);Array.isArray(z)&&z.length>0&&(e({type:"RESTORE_STYLE_MODIFICATIONS",payload:z}),Qo(z))}catch(z){}let I=localStorage.getItem(Or);if(I)try{let z=JSON.parse(I);Array.isArray(z)&&z.length>0&&e({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:z})}catch(z){}let L=localStorage.getItem(tl);if(L)try{let{selector:z,info:yt}=JSON.parse(L);if(z){let Rt=Je(z);if(Rt){let Q=yt||y(m({},Ke(Rt)),{selector:z});e({type:"SELECT_ELEMENT",payload:{el:Rt,info:Q}})}}}catch(z){}}return Kt.current=!0,()=>{Kt.current=!1}},[]);let re=Re(t.styleModifications);bn(()=>{let X=re.current,it=t.styleModifications;X!==it&&(ti(X),Qo(it),re.current=it)},[t.styleModifications]),bn(()=>{let X=Pt.current;Pt.current=t.isAnnotating,X&&!t.isAnnotating&&bt&&Dt(!1)},[t.isAnnotating,bt]);let Me=Re(bt);Me.current=bt,bn(()=>{let X=h=>{if(h.key==="Meta"||h.key==="Control"){let I=Date.now();if(I-V.current<300){if(St.current++,St.current>=2){if(Me.current)e({type:"SET_ANNOTATING",payload:!1}),Dt(!1);else{let yt=localStorage.getItem(Dr);e({type:"SET_TOOL",payload:yt||"inspector"}),e({type:"SET_ANNOTATING",payload:!0}),Dt(!0)}St.current=0}}else St.current=1;V.current=I}else St.current=0},it=h=>{h.key!=="Meta"&&h.key!=="Control"&&(St.current=0)};return window.addEventListener("keydown",X),window.addEventListener("keyup",it),()=>{window.removeEventListener("keydown",X),window.removeEventListener("keyup",it)}},[e]);let ne=un(X=>{Bt(),e({type:"SET_TOOL",payload:X}),t.isAnnotating||e({type:"SET_ANNOTATING",payload:!0}),ht.current=!1,Ht(null),Et.current&&(clearTimeout(Et.current),Et.current=null),zt.current&&(clearTimeout(zt.current),zt.current=null)},[e,t.isAnnotating,Bt]),ze=un(async()=>{window.focus(),await o()},[o]),Ut=un(async()=>{let X=t.annotations.filter(I=>{var L;return((L=I.status)!=null?L:"pending")==="pending"}),it=t.styleModifications.filter(I=>!I.captured),h=X.some(I=>I.type!=="text");if(i){let I=X.filter(z=>z.type==="text"&&z.text),L=I.find(z=>z.text.toLowerCase().startsWith("/plan "));if(L){let z=L.text.replace(/^\/plan\s+/i,""),yt=I.filter(Q=>Q!==L&&Q.text).map(Q=>Q.text),Rt=[z,...yt].join(". ");await i(Rt);return}}n&&await n()},[n,i,t.annotations,t.styleModifications,t.spacingTokenChanges]),fe=un(()=>{e({type:"SET_ANNOTATING",payload:!1}),Dt(!1)},[e]),Ve=un(()=>{ti(t.styleModifications),document.querySelectorAll("[data-pm]").forEach(X=>X.removeAttribute("data-pm")),e({type:"CLEAR"}),e({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(Br),localStorage.removeItem(Nr),localStorage.removeItem(Or),te(null),l==null||l()},[e,t.styleModifications,l]),[ge,Ze]=Oo(29),Xe=Re(null),_e=Re(null),en=Re(!1),$e=un(X=>{let it=X.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return it&&it[1]?parseFloat(it[1]):null},[]);bn(()=>{en.current=!0;let X=`oklch(0.628 0.258 ${ge})`;e({type:"SET_COLOR",payload:X}),requestAnimationFrame(()=>{en.current=!1})},[ge,e]),bn(()=>{if(en.current)return;let X=$e(t.activeColor);X!==null&&Math.abs(X-ge)>.5&&Ze(X)},[t.activeColor,$e,ge]);let we=t.annotations.length>0;bn(()=>{let X=_e.current;if(!X||!we)return;let it=h=>{h.preventDefault(),h.stopPropagation();let I=h.deltaY>0?-1:1,L=((ge+I)%360+360)%360,z=`oklch(0.628 0.258 ${L})`;Ze(L),t.selectedAnnotationIds.length>0&&e({type:"UPDATE_ANNOTATION_COLOR",payload:{id:t.lastSelectedId||t.selectedAnnotationIds[0],color:z}})};return X.addEventListener("wheel",it,{passive:!1}),()=>X.removeEventListener("wheel",it)},[we,t.selectedAnnotationIds,t.lastSelectedId,ge,e]);let Z=Re(!1),Lt=un(()=>{Z.current=!1,Xe.current=setTimeout(()=>{Z.current=!0,Ze(29)},500)},[]),qt=un(()=>{Xe.current&&(clearTimeout(Xe.current),Xe.current=null)},[]);bn(()=>()=>{Xe.current&&clearTimeout(Xe.current),mt.current&&clearTimeout(mt.current)},[]);let me=Ar(()=>ri(t.annotations),[t.annotations]),ke=Ar(()=>{let X=[],it=new Set;for(let h of t.annotations)if(!me.has(h))if(h.groupId){if(!it.has(h.groupId)){it.add(h.groupId);let I=t.annotations.filter(z=>z.groupId===h.groupId&&!me.has(z)),L=I.find(z=>z.type!=="text")||I[0];X.push({id:L.id,annotations:I})}}else X.push({id:h.id,annotations:[h]});return X},[t.annotations,me]),[ce,te]=Oo(null),nn=ke.length+t.styleModifications.length;bn(()=>{(nn===0||ce!==null&&ce>=nn)&&te(null)},[nn,ce]),bn(()=>{if(t.selectedAnnotationIds.length===0&&!t.inspectedElement){te(null);return}if(t.selectedAnnotationIds.length>0){let X=t.selectedAnnotationIds[0],it=ke.findIndex(h=>h.id===X||h.annotations.some(I=>I.id===X));it>=0&&it!==ce&&te(it)}},[t.selectedAnnotationIds,t.inspectedElement,ke]);let on=un(()=>{var it;if(nn===0)return;let X;if(ce===null?X=0:X=(ce+1)%nn,te(X),X<ke.length){let h=ke[X];if(!h)return;e({type:"SELECT_ELEMENT",payload:null}),e({type:"SELECT_ANNOTATION",payload:{id:h.id}});let I=h.annotations.find(wt=>wt.type!=="text")||h.annotations[0];if(h.annotations.some(wt=>wt.linkedSelector))e({type:"SET_TOOL",payload:"inspector"});else if(I!=null&&I.type&&I.type!=="text"&&I.type!=="inspector"){e({type:"SET_TOOL",payload:I.type});let wt=qn.findIndex(Gt=>Gt.type===I.type);wt>=0&&At(wt)}if(I!=null&&I.color){e({type:"SET_COLOR",payload:I.color});let wt=$e(I.color);wt!==null&&Ze(wt)}let z=h.annotations.flatMap(wt=>wt.points);if(z.length===0)return;let yt=Math.min(...z.map(wt=>wt.x)),Rt=Math.max(...z.map(wt=>wt.x)),Q=Math.min(...z.map(wt=>wt.y)),jt=Math.max(...z.map(wt=>wt.y)),Mt=(yt+Rt)/2,_t=(Q+jt)/2;if(window.scrollTo({left:Mt-window.innerWidth/2,top:_t-window.innerHeight/2,behavior:"smooth"}),b&&k){let wt=(it=h.annotations.find(Gt=>Gt.threadId))==null?void 0:it.threadId;wt&&k(wt)}}else{let h=X-ke.length,I=t.styleModifications[h];if(!I)return;let L=Je(I.selector);if(!L)return;e({type:"SELECT_ANNOTATION",payload:{id:null}}),e({type:"SET_TOOL",payload:"inspector"}),e({type:"SELECT_ELEMENT",payload:{el:L,info:I.element}});let z=L.getBoundingClientRect(),yt=z.left+z.width/2+window.scrollX,Rt=z.top+z.height/2+window.scrollY;window.scrollTo({left:yt-window.innerWidth/2,top:Rt-window.innerHeight/2,behavior:"smooth"})}},[ke,t.styleModifications,nn,ce,e,$e,b,k]);bn(()=>{if(!bt)return;let X=it=>{let h=document.activeElement;if((h==null?void 0:h.tagName)==="INPUT"||(h==null?void 0:h.tagName)==="TEXTAREA")return;if((it.metaKey||it.ctrlKey)&&it.key==="Enter"){(n||i)&&(t.annotations.length>0||t.styleModifications.length>0||t.spacingTokenChanges.filter(z=>!z.captured).length>0)&&(it.preventDefault(),Ut());return}if((it.metaKey||it.ctrlKey)&&(it.key==="c"||it.key==="C"||it.code==="KeyC")){(t.annotations.length>0||t.styleModifications.length>0)&&(it.preventDefault(),window.focus(),ze());return}if((it.metaKey||it.ctrlKey)&&(it.key==="Backspace"||it.key==="Delete")){it.preventDefault(),Ve();return}if(it.metaKey||it.ctrlKey||it.altKey)return;let I={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand"};if(it.key.toLowerCase()==="m"){it.preventDefault(),ne("model");return}let L=I[it.key.toLowerCase()];if(L){it.preventDefault();let z=qn.findIndex(yt=>yt.type===L);z>=0&&At(z),ne(L)}};return window.addEventListener("keydown",X),()=>window.removeEventListener("keydown",X)},[bt,ne,ze,Ut,n,i,Ve,t.annotations.length,t.styleModifications.length,t.spacingTokenChanges,gt]);let kn=y(m({},Yu),{borderRadius:0,padding:bt?"0 8px":"0",width:bt?"auto":48,height:48,gap:0,justifyContent:bt?"flex-start":"center"}),oe=r&&s?s:An.iconActive;return bt?xe(Zn,{children:[st("style",{children:`
13
13
  @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
14
- `}),st("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),!x&&(gt==="model"||t.activeTool==="model")&&st(Wa,{bridgeUrl:C,selectedComponent:nt,hoveredComponent:j,onComponentHover:G,onSpacingTokenHover:U,onModifySpacingToken:O,onDeleteSpacingToken:tt,modelRefreshKey:et,onComponentAdded:vt,onComponentRemoved:dt,onMouseEnter:()=>{Nt(),zt.current&&(clearTimeout(zt.current),zt.current=null)},onMouseLeave:t.activeTool==="model"?void 0:xt}),gt&&gt!=="model"&&(gt==="provider"||ja[gt])&&(()=>{let X=gt==="provider"?Vt:ja[gt];return xe("div",{onMouseEnter:gt==="collapse"?()=>{Nt(),zt.current&&(clearTimeout(zt.current),zt.current=null)}:void 0,onMouseLeave:gt==="collapse"?xt:void 0,style:m(b(m({position:"fixed",bottom:80,right:16,width:300,backgroundColor:"#ffffff"},fn),{boxSizing:"content-box",zIndex:10001,fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12}),gt!=="collapse"?{pointerEvents:"none"}:{}),children:[gt==="collapse"&&st("div",{style:{marginBottom:10},children:st("svg",{width:"48",height:"48",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:st("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"})})}),xe("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[st("span",{children:X.name}),X.keys[0]&&st("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:X.keys[0].key})]}),st("div",{style:{color:"#6b7280",lineHeight:1.5,marginBottom:gt==="collapse"?0:10},children:X.desc.split(`
14
+ `}),st("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),!b&&(gt==="model"||t.activeTool==="model")&&st(Ka,{bridgeUrl:C,selectedComponent:nt,hoveredComponent:j,onComponentHover:G,onSpacingTokenHover:U,onModifySpacingToken:O,onDeleteSpacingToken:tt,modelRefreshKey:et,onComponentAdded:vt,onComponentRemoved:dt,onMouseEnter:()=>{Bt(),zt.current&&(clearTimeout(zt.current),zt.current=null)},onMouseLeave:t.activeTool==="model"?void 0:xt}),gt&&gt!=="model"&&(gt==="provider"||Za[gt])&&(()=>{let X=gt==="provider"?Vt:Za[gt];return xe("div",{onMouseEnter:gt==="collapse"?()=>{Bt(),zt.current&&(clearTimeout(zt.current),zt.current=null)}:void 0,onMouseLeave:gt==="collapse"?xt:void 0,style:m(y(m({position:"fixed",bottom:80,right:16,width:300,backgroundColor:"#ffffff"},gn),{boxSizing:"content-box",zIndex:10001,fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12}),gt!=="collapse"?{pointerEvents:"none"}:{}),children:[gt==="collapse"&&st("div",{style:{marginBottom:10},children:st("svg",{width:"48",height:"48",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:st("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"})})}),xe("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[st("span",{children:X.name}),X.keys[0]&&st("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:X.keys[0].key})]}),st("div",{style:{color:"#6b7280",lineHeight:1.5,marginBottom:gt==="collapse"?0:10},children:X.desc.split(`
15
15
 
16
- `).map((rt,h)=>st("p",{style:{margin:0,marginTop:h>0?8:0},children:rt},h))}),X.usage.map((rt,h)=>xe("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[st("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),st("span",{children:rt})]},h)),gt==="collapse"&&N&&Object.keys(N).length>0&&(()=>{let rt=Object.entries(N).filter(([,A])=>A.found&&!A.disabled).map(([A])=>A.charAt(0).toUpperCase()+A.slice(1)),h=Object.entries(N).filter(([,A])=>!A.found).map(([A])=>A);if(rt.length===0&&h.length===0)return null;let I=h.map(A=>A.charAt(0).toUpperCase()+A.slice(1));return xe("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8,display:"flex",alignItems:"center",gap:6,fontSize:11},children:[st("span",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:rt.length>0?"#22c55e":"rgba(0,0,0,0.2)",flexShrink:0}}),rt.length>0?xe("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[xe("span",{children:["Taste library ready in ",rt.join(", "),M&&" \u2014 restart CLI to activate"]}),h.length>0&&R&&!M&&xe("button",{type:"button",onClick:A=>{A.stopPropagation(),R()},style:{border:"none",background:"transparent",color:"#3b82f6",fontSize:10,fontWeight:500,fontFamily:"inherit",padding:0,cursor:"pointer",pointerEvents:"auto",textDecoration:"underline",textUnderlineOffset:2},children:["+ ",I.join(", ")]})]}):h.length>0&&R?xe("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[st("span",{children:"Connect Popmelt MCP"}),st("button",{type:"button",onClick:A=>{A.stopPropagation(),R()},style:{border:"none",background:"#1f2937",color:"#fff",fontSize:10,fontWeight:600,fontFamily:"inherit",padding:"2px 8px",cursor:"pointer",pointerEvents:"auto"},children:"Connect"})]}):null]})})(),X.keys.length>1&&st("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8,display:"flex",flexDirection:"column",gap:4},children:X.keys.slice(1).map((rt,h)=>xe("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:rt.accent?"#fff":"#6b7280"},children:[st("code",{style:{fontSize:10,backgroundColor:rt.accent?t.activeColor:"rgba(0,0,0,0.06)",color:rt.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:rt.key}),st("span",{style:{color:rt.accent?t.activeColor:void 0,fontWeight:rt.accent?600:void 0},children:rt.desc})]},h))})]})})(),xe("div",{id:"devtools-toolbar",style:wn,onMouseMove:ue,children:[(t.annotations.length>0||t.styleModifications.length>0)&&xe(Un,{children:[st("span",{onMouseEnter:()=>Bt("clear"),onMouseLeave:xt,children:st(An,{onClick:Ge,title:"Clear all (\u2318\u232B)",children:st(Iu,{size:17,strokeWidth:1.5})})}),st(Ei,{})]}),xe("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[st("span",{onMouseEnter:()=>Bt("inspector"),onMouseLeave:xt,children:st(An,{active:t.isAnnotating&&t.activeTool==="inspector",siblingActive:t.isAnnotating,onClick:()=>ne("inspector"),children:st(Cu,{size:20,strokeWidth:1.5})})}),st("span",{onMouseEnter:()=>Bt("hand"),onMouseLeave:xt,children:st(An,{active:t.isAnnotating&&t.activeTool==="hand",siblingActive:t.isAnnotating,onClick:()=>ne("hand"),children:xe("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[st(ku,{size:20,strokeWidth:1.5}),t.styleModifications.filter(X=>!X.captured).length>0&&st("div",{style:{position:"absolute",top:-7,right:-9,minWidth:14,height:14,borderRadius:0,backgroundColor:t.activeColor,color:"#fff",fontSize:9,fontWeight:700,display:"flex",alignItems:"center",justifyContent:"center",padding:"0 2px",lineHeight:1},children:t.styleModifications.filter(X=>!X.captured).length})]})})}),(()=>{let X=Zn[Ot],rt=X.icon,h=t.isAnnotating&&Ru.has(t.activeTool);return st("span",{onMouseEnter:()=>Bt(X.type),onMouseLeave:xt,children:xe("div",{style:{display:"flex",alignItems:"center",gap:0},children:[st(An,{active:h,siblingActive:t.isAnnotating,onClick:()=>ne(X.type),children:st(rt,{size:20,strokeWidth:1.5})}),st("button",{type:"button",onClick:()=>{let I=(Ot+1)%Zn.length;At(I),ne(Zn[I].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:t.isAnnotating&&!h?.5:1,transition:"opacity 150ms ease"},children:Zn.map((I,A)=>st("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:A===Ot?Rn.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},A))})]})})})(),Nu.map(({type:X,icon:rt,label:h,shortcut:I})=>st("span",{onMouseEnter:()=>Bt(X),onMouseLeave:xt,children:st(An,{active:t.isAnnotating&&t.activeTool===X,siblingActive:t.isAnnotating,onClick:()=>ne(X),children:st(rt,{size:20,strokeWidth:1.5})})},X)),st("span",{onMouseEnter:()=>Bt("model"),onMouseLeave:xt,children:st(An,{active:t.isAnnotating&&t.activeTool==="model",siblingActive:t.isAnnotating,onClick:()=>ne("model"),children:st(wu,{size:17,strokeWidth:1.5})})})]}),st(Ei,{}),xe("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(ke.length>0||t.styleModifications.length>0||t.spacingTokenChanges.filter(X=>!X.captured).length>0)&&(()=>{var A;let X=ce!==null&&ce<ke.length?ke[ce]:null,rt=t.annotations.length>0&&t.annotations.every(z=>z.status&&z.status!=="pending"),h=ce!==null?(A=X==null?void 0:X.annotations.some(z=>z.status&&z.status!=="pending"))!=null?A:!1:rt,I=`oklch(0.628 0.258 ${ge})`;return st("span",{onMouseEnter:()=>Bt("counter"),onMouseLeave:xt,children:st("button",{ref:_e,type:"button",onClick:()=>{if(Z.current){Z.current=!1;return}nn()},onMouseDown:Lt,onMouseUp:qt,onMouseLeave:qt,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:h?"#999999":I,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:ce!==null?ce+1:ke.length+t.styleModifications.length+t.spacingTokenChanges.filter(z=>!z.captured).length})})})(),d&&st("span",{onMouseEnter:()=>Bt("provider"),onMouseLeave:xt,style:{display:"contents"},children:xe("div",{style:{display:"flex",alignItems:"center",gap:0},children:[st(An,{onClick:()=>d(l==="claude"?"codex":"claude"),children:l==="claude"?st(Ou,{}):st(Fu,{})}),xe("button",{type:"button",onClick:()=>{let X=(p+1)%f;y==null||y(X)},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:Rn.iconDefault,whiteSpace:"nowrap"},children:[st("span",{children:g}),st("span",{style:{display:"flex",flexDirection:"column",gap:2},children:Array.from({length:f},(X,rt)=>st("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:rt===p?Rn.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},rt))})]})]})}),st("div",{onMouseEnter:X=>{s==null||s(!0),X.currentTarget.style.opacity="1",Bt("collapse")},onMouseLeave:X=>{s==null||s(!1),X.currentTarget.style.opacity=i?"1":"0.3",xt()},style:{display:"inline-flex",opacity:i?1:.3,transition:"opacity 150ms ease"},children:st(An,{onClick:fe,title:"Collapse (\u2318\u2318)",children:i?st("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:oe,children:Y===1?xe(Un,{children:[st("circle",{cx:"7",cy:"7",r:"2"}),st("circle",{cx:"17",cy:"7",r:"2"}),st("circle",{cx:"7",cy:"17",r:"2"}),st("circle",{cx:"17",cy:"17",r:"2"})]}):xe(Un,{children:[st("circle",{cx:"12",cy:"6",r:"2"}),st("circle",{cx:"6",cy:"12",r:"2"}),st("circle",{cx:"18",cy:"12",r:"2"}),st("circle",{cx:"12",cy:"18",r:"2"})]})}):xe("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:oe,strokeWidth:"1.5",strokeLinecap:"round",style:{transform:"rotate(45deg)"},children:[st("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),st("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),st("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),st("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})]})]}):xe(Un,{children:[st("style",{children:"@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }"}),st("div",{id:"devtools-toolbar",style:b(m({},wn),{overflow:"visible",opacity:.5,transition:"opacity 150ms ease"}),onMouseEnter:X=>X.currentTarget.style.opacity="1",onMouseLeave:X=>X.currentTarget.style.opacity="0.5",children:st("button",{type:"button",style:{display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,border:"none",background:"none",cursor:"pointer",padding:0},onClick:()=>{Dt(!0),e({type:"SET_TOOL",payload:"inspector"}),e({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:i?st("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:oe,children:Y===1?xe(Un,{children:[st("circle",{cx:"7",cy:"7",r:"2"}),st("circle",{cx:"17",cy:"7",r:"2"}),st("circle",{cx:"7",cy:"17",r:"2"}),st("circle",{cx:"17",cy:"17",r:"2"})]}):xe(Un,{children:[st("circle",{cx:"12",cy:"6",r:"2"}),st("circle",{cx:"6",cy:"12",r:"2"}),st("circle",{cx:"18",cy:"12",r:"2"}),st("circle",{cx:"12",cy:"18",r:"2"})]})}):xe("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:oe,strokeWidth:"1.5",strokeLinecap:"round",children:[st("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),st("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),st("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),st("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})}import{useCallback as Pi,useEffect as Do,useRef as Ni,useState as fr}from"react";import{Fragment as Ka,jsx as Ae,jsxs as Bi}from"react/jsx-runtime";var Hu={position:"fixed",bottom:70,right:16,zIndex:9999,display:"flex",flexDirection:"column",gap:10},zu=b(m({display:"flex",alignItems:"center",gap:6,padding:"4px 10px",backgroundColor:"rgba(255, 255, 255, 0.85)"},fn),{backdropFilter:"blur(32px)",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,color:"#1f2937",whiteSpace:"nowrap",transition:"transform 200ms ease, opacity 200ms ease"});function _u(t){var a;let e=t.filter(s=>s.type==="tool_use");if(e.length===0)return"Starting\u2026";let o=e[e.length-1],n=String(o.data.tool||""),r=o.data.file?String(o.data.file):null,i=r?(a=r.split("/").pop())!=null?a:r:null;switch(n){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 n?`Using ${n}`:"Working\u2026"}}function $u(t,e){if(t.some(r=>r.type==="question"&&r.data.jobId===e))return"Has a question";let n=t.find(r=>r.type==="done"&&r.data.jobId===e);if(n){let r=n.data.resolutions;if(Array.isArray(r)&&r.length>0)return"Applied changes"}return"Replied"}function Wu({color:t}){let[e,o]=fr(0);return Do(()=>{let n=setInterval(()=>{o(r=>(r+1)%2)},250);return()=>clearInterval(n)},[]),Ae("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:t,style:{verticalAlign:"middle",flexShrink:0},children:e===1?Bi(Ka,{children:[Ae("circle",{cx:"7",cy:"7",r:"2"}),Ae("circle",{cx:"17",cy:"7",r:"2"}),Ae("circle",{cx:"7",cy:"17",r:"2"}),Ae("circle",{cx:"17",cy:"17",r:"2"})]}):Bi(Ka,{children:[Ae("circle",{cx:"12",cy:"6",r:"2"}),Ae("circle",{cx:"6",cy:"12",r:"2"}),Ae("circle",{cx:"18",cy:"12",r:"2"}),Ae("circle",{cx:"12",cy:"18",r:"2"})]})})}function Yu({color:t}){return Ae("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:t,opacity:.6}})}function ju({color:t}){return Ae("span",{style:{color:t,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function Gu(){return Ae("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function Vu({onDismiss:t,children:e}){let o=Ni(null),n=Ni(null),[r,i]=fr(0),[a,s]=fr(!1),c=60,l=Pi(p=>{var f;n.current={startX:p.clientX,startY:p.clientY,locked:!1},(f=o.current)==null||f.setPointerCapture(p.pointerId)},[]),d=Pi(p=>{let f=n.current;if(!f)return;let g=p.clientX-f.startX,y=p.clientY-f.startY;if(!f.locked){if(Math.abs(g)<4&&Math.abs(y)<4)return;if(f.locked=!0,Math.abs(y)>Math.abs(g)){n.current=null;return}}i(Math.max(0,g))},[]),u=Pi(()=>{n.current&&(n.current=null,r>=c?(s(!0),setTimeout(t,200)):i(0))},[r,t]);return Ae("div",{ref:o,onPointerDown:l,onPointerMove:d,onPointerUp:u,onPointerCancel:u,style:{transform:a?"translateX(120%)":`translateX(${r}px)`,opacity:a?0:1-r/(c*3),transition:n.current?"none":"transform 200ms ease, opacity 200ms ease",touchAction:"pan-y"},children:e})}function Ua({bridge:t,inFlightJobs:e,isVisible:o,onHover:n,clearSignal:r,onViewThread:i}){let[a,s]=fr([]);Do(()=>{r>0&&s([])},[r]),Do(()=>{s(l=>{let d=new Set(l.map(p=>p.jobId)),u=[...l];for(let[p,f]of Object.entries(e))d.has(p)||u.push({jobId:p,color:f.color,status:"queued",threadId:f.threadId});for(let p of t.activeJobIds)!d.has(p)&&!e[p]&&u.push({jobId:p,color:"#888",status:"working"});return u.length!==l.length?u:l})},[e,t.activeJobIds]),Do(()=>{if(t.activeJobIds.length===0)return;let l=new Set(t.activeJobIds);s(d=>d.map(u=>l.has(u.jobId)&&u.status!=="done"&&u.status!=="error"?b(m({},u),{status:"working"}):u))},[t.activeJobIds]);let c=Ni(null);return Do(()=>{let l=t.lastCompletedJobId;if(!l||l===c.current)return;c.current=l;let d=t.events.some(p=>p.type==="error"&&(p.data.jobId===l||t.status==="error")),u=d?void 0:$u(t.events,l);s(p=>p.map(f=>f.jobId===l?b(m({},f),{status:d?"error":"done",doneLabel:u}):f))},[t.lastCompletedJobId,t.events,t.status]),!o||a.length===0?null:Ae("div",{style:Hu,"data-devtools":!0,onMouseEnter:()=>n(!0),onMouseLeave:()=>n(!1),children:a.map(l=>{let d=l.status==="working"?_u(t.events.filter(u=>u.data.jobId===l.jobId)):l.status==="queued"?"Queued":l.status==="done"?l.doneLabel||"Done":"Error";return Ae(Vu,{onDismiss:()=>s(u=>u.filter(p=>p.jobId!==l.jobId)),children:Bi("div",{style:b(m({},zu),{cursor:l.threadId&&i?"pointer":void 0}),onClick:l.threadId&&i?()=>i(l.threadId):void 0,children:[l.status==="working"&&Ae(Wu,{color:l.color}),l.status==="queued"&&Ae(Yu,{color:l.color}),l.status==="done"&&Ae(ju,{color:l.color}),l.status==="error"&&Ae(Gu,{}),Ae("span",{style:{color:l.status==="queued"?"#9ca3af":"#1f2937"},children:d})]})},l.jobId)})})}import{useCallback as mr,useEffect as Hn,useRef as Pn,useState as qn}from"react";import{Fragment as Zu,jsx as Se}from"react/jsx-runtime";var Za="ui-monospace, SFMono-Regular, Menlo, monospace",Xu=/^#[0-9a-fA-F]{3,8}$/,Ju=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,Ku=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 Uu(t){let e=t.trim();return Xu.test(e)||Ju.test(e)||Ku.has(e.toLowerCase())}function Di(t,e){return Se("span",{style:{display:"inline-block",width:10,height:10,backgroundColor:t,border:"1px solid rgba(0,0,0,0.15)",borderRadius:2,verticalAlign:"middle",marginRight:3}},e)}function Oo(t){let e=[],o=/(`[^`]+`)|(\*\*\*(.+?)\*\*\*)|(\*\*(.+?)\*\*)|(\*(.+?)\*)|(_([^_]+?)_)|(\[([^\]]+)\]\(([^)]+)\))|(#[0-9a-fA-F]{3,8})(?![0-9a-fA-F])|((?:rgba?|hsla?|oklch)\([^)]+\))/g,n=0,r;for(;(r=o.exec(t))!==null;){if(r.index>n&&e.push(t.slice(n,r.index)),r[1]){let i=r[1].slice(1,-1);Uu(i)&&e.push(Di(i,`sw-${r.index}`)),e.push(Se("code",{style:{fontFamily:Za,fontSize:"0.9em",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2},children:i},r.index))}else r[3]!==void 0?e.push(Se("strong",{children:Se("em",{children:r[3]})},r.index)):r[5]!==void 0?e.push(Se("strong",{children:r[5]},r.index)):r[7]!==void 0?e.push(Se("em",{children:r[7]},r.index)):r[9]!==void 0?e.push(Se("em",{children:r[9]},r.index)):r[11]!==void 0&&r[12]!==void 0?e.push(Se("a",{href:r[12],target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline"},children:r[11]},r.index)):r[13]!==void 0?(e.push(Di(r[13],`sw-${r.index}`)),e.push(r[13])):r[14]!==void 0&&(e.push(Di(r[14],`sw-${r.index}`)),e.push(r[14]));n=r.index+r[0].length}return n<t.length&&e.push(t.slice(n)),e}function gr(t){var r;let e=t.split(`
17
- `),o=[],n=0;for(;n<e.length;){let i=e[n];if(i.trimStart().startsWith("```")){let l=[];for(n++;n<e.length&&!e[n].trimStart().startsWith("```");)l.push(e[n]),n++;n++,o.push(Se("pre",{style:{fontFamily:Za,fontSize:"0.9em",lineHeight:1.4,backgroundColor:"rgba(0,0,0,0.04)",padding:"6px 8px",margin:"4px 0",overflowX:"auto",whiteSpace:"pre"},children:l.join(`
18
- `)},o.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(i)){o.push(Se("hr",{style:{border:"none",borderTop:"1px solid rgba(0,0,0,0.1)",margin:"6px 0"}},o.length)),n++;continue}let a=i.match(/^(#{1,4})\s+(.+)/);if(a){let l=a[1].length,d={1:16,2:14,3:13,4:12};o.push(Se("div",{style:{fontWeight:700,fontSize:(r=d[l])!=null?r:12,margin:"8px 0 2px"},children:Oo(a[2])},o.length)),n++;continue}if(i.trimStart().startsWith("|")&&i.trimEnd().endsWith("|")){let l=[];for(;n<e.length&&e[n].trimStart().startsWith("|")&&e[n].trimEnd().endsWith("|");)l.push(e[n]),n++;let d=x=>/^\|[\s\-:|]+\|$/.test(x),u=l.filter(x=>!d(x)),p=x=>x.split("|").slice(1,-1).map(L=>L.trim()),f=x=>/^\*\*.+\*\*$/.test(x)||/^__.+__$/.test(x),g=u.map(p),y=g.length>1&&g.slice(1).every(x=>x[0]&&f(x[0])),S=g.length>0&&g[0].every(x=>f(x));o.push(Se("div",{style:{overflowX:"auto",margin:"4px 0",paddingBottom:4},children:Se("table",{style:{borderCollapse:"separate",borderSpacing:0,fontSize:"0.95em",width:"max-content",minWidth:"100%"},children:Se("tbody",{children:u.map((x,L)=>Se("tr",{children:p(x).map((N,R)=>Se(L===0?"th":"td",{style:m({border:"1px solid rgba(0,0,0,0.1)",padding:"3px 6px",textAlign:"left",fontWeight:L===0?600:400,minWidth:60,whiteSpace:"nowrap"},R===0&&y||L===0&&S?b(m(m({position:"sticky"},R===0&&y?{left:0}:{}),L===0&&S?{top:0}:{}),{background:"#fff",zIndex:R===0&&y&&L===0&&S?2:1}):{}),children:Oo(N)},R))},L))})})},o.length));continue}if(i.match(/^(\s*)([-*])\s+(.+)/)){let l=[];for(;n<e.length&&/^\s*[-*]\s+/.test(e[n]);){let d=e[n].match(/^\s*[-*]\s+(.+)/);d&&l.push(Se("li",{children:Oo(d[1])},l.length)),n++}o.push(Se("ul",{style:{margin:"2px 0",paddingLeft:20},children:l},o.length));continue}if(i.match(/^(\s*)\d+\.\s+(.+)/)){let l=[];for(;n<e.length&&/^\s*\d+\.\s+/.test(e[n]);){let d=e[n].match(/^\s*\d+\.\s+(.+)/);d&&l.push(Se("li",{children:Oo(d[1])},l.length)),n++}o.push(Se("ol",{style:{margin:"2px 0",paddingLeft:20},children:l},o.length));continue}if(i.trim()===""){o.push(Se("div",{style:{height:4}},o.length)),n++;continue}o.push(Se("div",{style:{margin:"2px 0"},children:Oo(i)},o.length)),n++}return Se(Zu,{children:o})}import{Fragment as zi,jsx as Ft,jsxs as Ee}from"react/jsx-runtime";var hr=400,So=16,_i=3,qu=16,Oi="devtools-thread-panel-position";function Fi(){return{top:So,left:window.innerWidth-hr-2*_i-So}}function qa(t,e){let o=document.getElementById("devtools-toolbar"),n=o==null?void 0:o.getBoundingClientRect(),r=window.innerHeight-So;return n&&e+hr+2*_i>n.left&&(r=n.top-qu),Math.max(200,r-Math.max(0,t))}var Qu=b(m({width:hr,backgroundColor:"#ffffff"},fn),{boxSizing:"content-box",display:"flex",flexDirection:"column",overflow:"hidden",fontFamily:ve,fontSize:12,color:"#1f2937",pointerEvents:"auto"}),tp={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"4px 5px 4px 10px",margin:"3px 3px 0",fontWeight:600,fontSize:12},ep={flex:1,overflowY:"auto",padding:"8px 0",scrollbarWidth:"none"},np=`
16
+ `).map((it,h)=>st("p",{style:{margin:0,marginTop:h>0?8:0},children:it},h))}),X.usage.map((it,h)=>xe("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[st("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),st("span",{children:it})]},h)),gt==="collapse"&&B&&Object.keys(B).length>0&&(()=>{let it=Object.entries(B).filter(([,L])=>L.found&&!L.disabled).map(([L])=>L.charAt(0).toUpperCase()+L.slice(1)),h=Object.entries(B).filter(([,L])=>!L.found).map(([L])=>L);if(it.length===0&&h.length===0)return null;let I=h.map(L=>L.charAt(0).toUpperCase()+L.slice(1));return xe("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8,display:"flex",alignItems:"center",gap:6,fontSize:11},children:[st("span",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:it.length>0?"#22c55e":"rgba(0,0,0,0.2)",flexShrink:0}}),it.length>0?xe("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[xe("span",{children:["Taste library ready in ",it.join(", "),M&&" \u2014 restart CLI to activate"]}),h.length>0&&A&&!M&&xe("button",{type:"button",onClick:L=>{L.stopPropagation(),A()},style:{border:"none",background:"transparent",color:"#3b82f6",fontSize:10,fontWeight:500,fontFamily:"inherit",padding:0,cursor:"pointer",pointerEvents:"auto",textDecoration:"underline",textUnderlineOffset:2},children:["+ ",I.join(", ")]})]}):h.length>0&&A?xe("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[st("span",{children:"Connect Popmelt MCP"}),st("button",{type:"button",onClick:L=>{L.stopPropagation(),A()},style:{border:"none",background:"#1f2937",color:"#fff",fontSize:10,fontWeight:600,fontFamily:"inherit",padding:"2px 8px",cursor:"pointer",pointerEvents:"auto"},children:"Connect"})]}):null]})})(),X.keys.length>1&&st("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8,display:"flex",flexDirection:"column",gap:4},children:X.keys.slice(1).map((it,h)=>xe("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:it.accent?"#fff":"#6b7280"},children:[st("code",{style:{fontSize:10,backgroundColor:it.accent?t.activeColor:"rgba(0,0,0,0.06)",color:it.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:it.key}),st("span",{style:{color:it.accent?t.activeColor:void 0,fontWeight:it.accent?600:void 0},children:it.desc})]},h))})]})})(),xe("div",{id:"devtools-toolbar",style:kn,onMouseMove:ue,children:[(t.annotations.length>0||t.styleModifications.length>0)&&xe(Zn,{children:[st("span",{onMouseEnter:()=>Nt("clear"),onMouseLeave:xt,children:st(Pn,{onClick:Ve,title:"Clear all (\u2318\u232B)",children:st(Fu,{size:17,strokeWidth:1.5})})}),st(Rr,{})]}),xe("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[st("span",{onMouseEnter:()=>Nt("inspector"),onMouseLeave:xt,children:st(Pn,{active:t.isAnnotating&&t.activeTool==="inspector",siblingActive:t.isAnnotating,onClick:()=>ne("inspector"),children:st(Bu,{size:20,strokeWidth:1.5})})}),st("span",{onMouseEnter:()=>Nt("hand"),onMouseLeave:xt,children:st(Pn,{active:t.isAnnotating&&t.activeTool==="hand",siblingActive:t.isAnnotating,onClick:()=>ne("hand"),children:xe("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[st(Pu,{size:20,strokeWidth:1.5}),t.styleModifications.filter(X=>!X.captured).length>0&&st("div",{style:{position:"absolute",top:-7,right:-9,minWidth:14,height:14,borderRadius:0,backgroundColor:t.activeColor,color:"#fff",fontSize:9,fontWeight:700,display:"flex",alignItems:"center",justifyContent:"center",padding:"0 2px",lineHeight:1},children:t.styleModifications.filter(X=>!X.captured).length})]})})}),(()=>{let X=qn[Ot],it=X.icon,h=t.isAnnotating&&zu.has(t.activeTool);return st("span",{onMouseEnter:()=>Nt(X.type),onMouseLeave:xt,children:xe("div",{style:{display:"flex",alignItems:"center",gap:0},children:[st(Pn,{active:h,siblingActive:t.isAnnotating,onClick:()=>ne(X.type),children:st(it,{size:20,strokeWidth:1.5})}),st("button",{type:"button",onClick:()=>{let I=(Ot+1)%qn.length;At(I),ne(qn[I].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:t.isAnnotating&&!h?.5:1,transition:"opacity 150ms ease"},children:qn.map((I,L)=>st("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:L===Ot?An.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},L))})]})})})(),Wu.map(({type:X,icon:it,label:h,shortcut:I})=>st("span",{onMouseEnter:()=>Nt(X),onMouseLeave:xt,children:st(Pn,{active:t.isAnnotating&&t.activeTool===X,siblingActive:t.isAnnotating,onClick:()=>ne(X),children:st(it,{size:20,strokeWidth:1.5})})},X)),st("span",{onMouseEnter:()=>Nt("model"),onMouseLeave:xt,children:st(Pn,{active:t.isAnnotating&&t.activeTool==="model",siblingActive:t.isAnnotating,onClick:()=>ne("model"),children:st(Au,{size:17,strokeWidth:1.5})})})]}),st(Rr,{}),xe("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(ke.length>0||t.styleModifications.length>0||t.spacingTokenChanges.filter(X=>!X.captured).length>0)&&(()=>{var L;let X=ce!==null&&ce<ke.length?ke[ce]:null,it=t.annotations.length>0&&t.annotations.every(z=>z.status&&z.status!=="pending"),h=ce!==null?(L=X==null?void 0:X.annotations.some(z=>z.status&&z.status!=="pending"))!=null?L:!1:it,I=`oklch(0.628 0.258 ${ge})`;return st("span",{onMouseEnter:()=>Nt("counter"),onMouseLeave:xt,children:st("button",{ref:_e,type:"button",onClick:()=>{if(Z.current){Z.current=!1;return}on()},onMouseDown:Lt,onMouseUp:qt,onMouseLeave:qt,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:h?"#999999":I,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:ce!==null?ce+1:ke.length+t.styleModifications.length+t.spacingTokenChanges.filter(z=>!z.captured).length})})})(),d&&st("span",{onMouseEnter:()=>Nt("provider"),onMouseLeave:xt,style:{display:"contents"},children:xe("div",{style:{display:"flex",alignItems:"center",gap:0},children:[st(Pn,{onClick:()=>d(c==="claude"?"codex":"claude"),children:c==="claude"?st(Gu,{}):st(Vu,{})}),xe("button",{type:"button",onClick:()=>{let X=(p+1)%f;x==null||x(X)},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:An.iconDefault,whiteSpace:"nowrap"},children:[st("span",{children:g}),st("span",{style:{display:"flex",flexDirection:"column",gap:2},children:Array.from({length:f},(X,it)=>st("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:it===p?An.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},it))})]})]})}),st("div",{onMouseEnter:X=>{a==null||a(!0),X.currentTarget.style.opacity="1",Nt("collapse")},onMouseLeave:X=>{a==null||a(!1),X.currentTarget.style.opacity=r?"1":"0.3",xt()},style:{display:"inline-flex",opacity:r?1:.3,transition:"opacity 150ms ease"},children:st(Pn,{onClick:fe,title:"Collapse (\u2318\u2318)",children:r?st("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:oe,children:Y===1?xe(Zn,{children:[st("circle",{cx:"7",cy:"7",r:"2"}),st("circle",{cx:"17",cy:"7",r:"2"}),st("circle",{cx:"7",cy:"17",r:"2"}),st("circle",{cx:"17",cy:"17",r:"2"})]}):xe(Zn,{children:[st("circle",{cx:"12",cy:"6",r:"2"}),st("circle",{cx:"6",cy:"12",r:"2"}),st("circle",{cx:"18",cy:"12",r:"2"}),st("circle",{cx:"12",cy:"18",r:"2"})]})}):xe("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:oe,strokeWidth:"1.5",strokeLinecap:"round",style:{transform:"rotate(45deg)"},children:[st("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),st("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),st("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),st("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})]})]}):xe(Zn,{children:[st("style",{children:"@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }"}),st("div",{id:"devtools-toolbar",style:y(m({},kn),{overflow:"visible",opacity:.5,transition:"opacity 150ms ease"}),onMouseEnter:X=>X.currentTarget.style.opacity="1",onMouseLeave:X=>X.currentTarget.style.opacity="0.5",children:st("button",{type:"button",style:{display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,border:"none",background:"none",cursor:"pointer",padding:0},onClick:()=>{Dt(!0),e({type:"SET_TOOL",payload:"inspector"}),e({type:"SET_ANNOTATING",payload:!0})},onMouseEnter:()=>a==null?void 0:a(!0),onMouseLeave:()=>a==null?void 0:a(!1),title:"Open annotation toolbar (\u2318\u2318)",children:r?st("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:oe,children:Y===1?xe(Zn,{children:[st("circle",{cx:"7",cy:"7",r:"2"}),st("circle",{cx:"17",cy:"7",r:"2"}),st("circle",{cx:"7",cy:"17",r:"2"}),st("circle",{cx:"17",cy:"17",r:"2"})]}):xe(Zn,{children:[st("circle",{cx:"12",cy:"6",r:"2"}),st("circle",{cx:"6",cy:"12",r:"2"}),st("circle",{cx:"18",cy:"12",r:"2"}),st("circle",{cx:"12",cy:"18",r:"2"})]})}):xe("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:oe,strokeWidth:"1.5",strokeLinecap:"round",children:[st("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),st("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),st("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),st("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})}import{useCallback as Fr,useEffect as Fo,useRef as Hr,useState as hi}from"react";import{Fragment as nl,jsx as Ae,jsxs as zr}from"react/jsx-runtime";var Xu={position:"fixed",bottom:70,right:16,zIndex:9999,display:"flex",flexDirection:"column",gap:10},Ju=y(m({display:"flex",alignItems:"center",gap:6,padding:"4px 10px",backgroundColor:"rgba(255, 255, 255, 0.85)"},gn),{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(t){var s;let e=t.filter(a=>a.type==="tool_use");if(e.length===0)return"Starting\u2026";let o=e[e.length-1],n=String(o.data.tool||""),i=o.data.file?String(o.data.file):null,r=i?(s=i.split("/").pop())!=null?s:i:null;switch(n){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";default:return n?`Using ${n}`:"Working\u2026"}}function Uu(t,e){if(t.some(i=>i.type==="question"&&i.data.jobId===e))return"Has a question";let n=t.find(i=>i.type==="done"&&i.data.jobId===e);if(n){let i=n.data.resolutions;if(Array.isArray(i)&&i.length>0)return"Applied changes"}return"Replied"}function Zu({color:t}){let[e,o]=hi(0);return Fo(()=>{let n=setInterval(()=>{o(i=>(i+1)%2)},250);return()=>clearInterval(n)},[]),Ae("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:t,style:{verticalAlign:"middle",flexShrink:0},children:e===1?zr(nl,{children:[Ae("circle",{cx:"7",cy:"7",r:"2"}),Ae("circle",{cx:"17",cy:"7",r:"2"}),Ae("circle",{cx:"7",cy:"17",r:"2"}),Ae("circle",{cx:"17",cy:"17",r:"2"})]}):zr(nl,{children:[Ae("circle",{cx:"12",cy:"6",r:"2"}),Ae("circle",{cx:"6",cy:"12",r:"2"}),Ae("circle",{cx:"18",cy:"12",r:"2"}),Ae("circle",{cx:"12",cy:"18",r:"2"})]})})}function qu({color:t}){return Ae("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:t,opacity:.6}})}function Qu({color:t}){return Ae("span",{style:{color:t,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function tp(){return Ae("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function ep({onDismiss:t,children:e}){let o=Hr(null),n=Hr(null),[i,r]=hi(0),[s,a]=hi(!1),l=60,c=Fr(p=>{var f;n.current={startX:p.clientX,startY:p.clientY,locked:!1},(f=o.current)==null||f.setPointerCapture(p.pointerId)},[]),d=Fr(p=>{let f=n.current;if(!f)return;let g=p.clientX-f.startX,x=p.clientY-f.startY;if(!f.locked){if(Math.abs(g)<4&&Math.abs(x)<4)return;if(f.locked=!0,Math.abs(x)>Math.abs(g)){n.current=null;return}}r(Math.max(0,g))},[]),u=Fr(()=>{n.current&&(n.current=null,i>=l?(a(!0),setTimeout(t,200)):r(0))},[i,t]);return Ae("div",{ref:o,onPointerDown:c,onPointerMove:d,onPointerUp:u,onPointerCancel:u,style:{transform:s?"translateX(120%)":`translateX(${i}px)`,opacity:s?0:1-i/(l*3),transition:n.current?"none":"transform 200ms ease, opacity 200ms ease",touchAction:"pan-y"},children:e})}function ol({bridge:t,inFlightJobs:e,isVisible:o,onHover:n,clearSignal:i,onViewThread:r}){let[s,a]=hi([]);Fo(()=>{i>0&&a([])},[i]),Fo(()=>{a(c=>{let d=new Set(c.map(p=>p.jobId)),u=[...c];for(let[p,f]of Object.entries(e))d.has(p)||u.push({jobId:p,color:f.color,status:"queued",threadId:f.threadId});for(let p of t.activeJobIds)!d.has(p)&&!e[p]&&u.push({jobId:p,color:"#888",status:"working"});return u.length!==c.length?u:c})},[e,t.activeJobIds]),Fo(()=>{if(t.activeJobIds.length===0)return;let c=new Set(t.activeJobIds);a(d=>d.map(u=>c.has(u.jobId)&&u.status!=="done"&&u.status!=="error"?y(m({},u),{status:"working"}):u))},[t.activeJobIds]);let l=Hr(null);return Fo(()=>{let c=t.lastCompletedJobId;if(!c||c===l.current)return;l.current=c;let d=t.events.some(p=>p.type==="error"&&(p.data.jobId===c||t.status==="error")),u=d?void 0:Uu(t.events,c);a(p=>p.map(f=>f.jobId===c?y(m({},f),{status:d?"error":"done",doneLabel:u}):f))},[t.lastCompletedJobId,t.events,t.status]),!o||s.length===0?null:Ae("div",{style:Xu,"data-devtools":!0,onMouseEnter:()=>n(!0),onMouseLeave:()=>n(!1),children:s.map(c=>{let d=c.status==="working"?Ku(t.events.filter(u=>u.data.jobId===c.jobId)):c.status==="queued"?"Queued":c.status==="done"?c.doneLabel||"Done":"Error";return Ae(ep,{onDismiss:()=>a(u=>u.filter(p=>p.jobId!==c.jobId)),children:zr("div",{style:y(m({},Ju),{cursor:c.threadId&&r?"pointer":void 0}),onClick:c.threadId&&r?()=>r(c.threadId):void 0,children:[c.status==="working"&&Ae(Zu,{color:c.color}),c.status==="queued"&&Ae(qu,{color:c.color}),c.status==="done"&&Ae(Qu,{color:c.color}),c.status==="error"&&Ae(tp,{}),Ae("span",{style:{color:c.status==="queued"?"#9ca3af":"#1f2937"},children:d})]})},c.jobId)})})}import{useCallback as bi,useEffect as zn,useRef as Bn,useState as Qn}from"react";import{Fragment as sp,jsx as Se}from"react/jsx-runtime";var il="ui-monospace, SFMono-Regular, Menlo, monospace",np=/^#[0-9a-fA-F]{3,8}$/,op=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,ip=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 rp(t){let e=t.trim();return np.test(e)||op.test(e)||ip.has(e.toLowerCase())}function _r(t,e){return Se("span",{style:{display:"inline-block",width:10,height:10,backgroundColor:t,border:"1px solid rgba(0,0,0,0.15)",borderRadius:2,verticalAlign:"middle",marginRight:3}},e)}function Ho(t){let e=[],o=/(`[^`]+`)|(\*\*\*(.+?)\*\*\*)|(\*\*(.+?)\*\*)|(\*(.+?)\*)|(_([^_]+?)_)|(\[([^\]]+)\]\(([^)]+)\))|(#[0-9a-fA-F]{3,8})(?![0-9a-fA-F])|((?:rgba?|hsla?|oklch)\([^)]+\))/g,n=0,i;for(;(i=o.exec(t))!==null;){if(i.index>n&&e.push(t.slice(n,i.index)),i[1]){let r=i[1].slice(1,-1);rp(r)&&e.push(_r(r,`sw-${i.index}`)),e.push(Se("code",{style:{fontFamily:il,fontSize:"0.9em",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2},children:r},i.index))}else i[3]!==void 0?e.push(Se("strong",{children:Se("em",{children:i[3]})},i.index)):i[5]!==void 0?e.push(Se("strong",{children:i[5]},i.index)):i[7]!==void 0?e.push(Se("em",{children:i[7]},i.index)):i[9]!==void 0?e.push(Se("em",{children:i[9]},i.index)):i[11]!==void 0&&i[12]!==void 0?e.push(Se("a",{href:i[12],target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline"},children:i[11]},i.index)):i[13]!==void 0?(e.push(_r(i[13],`sw-${i.index}`)),e.push(i[13])):i[14]!==void 0&&(e.push(_r(i[14],`sw-${i.index}`)),e.push(i[14]));n=i.index+i[0].length}return n<t.length&&e.push(t.slice(n)),e}function yi(t){var i;let e=t.split(`
17
+ `),o=[],n=0;for(;n<e.length;){let r=e[n];if(r.trimStart().startsWith("```")){let c=[];for(n++;n<e.length&&!e[n].trimStart().startsWith("```");)c.push(e[n]),n++;n++,o.push(Se("pre",{style:{fontFamily:il,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(`
18
+ `)},o.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(r)){o.push(Se("hr",{style:{border:"none",borderTop:"1px solid rgba(0,0,0,0.1)",margin:"6px 0"}},o.length)),n++;continue}let s=r.match(/^(#{1,4})\s+(.+)/);if(s){let c=s[1].length,d={1:16,2:14,3:13,4:12};o.push(Se("div",{style:{fontWeight:700,fontSize:(i=d[c])!=null?i:12,margin:"8px 0 2px"},children:Ho(s[2])},o.length)),n++;continue}if(r.trimStart().startsWith("|")&&r.trimEnd().endsWith("|")){let c=[];for(;n<e.length&&e[n].trimStart().startsWith("|")&&e[n].trimEnd().endsWith("|");)c.push(e[n]),n++;let d=b=>/^\|[\s\-:|]+\|$/.test(b),u=c.filter(b=>!d(b)),p=b=>b.split("|").slice(1,-1).map(P=>P.trim()),f=b=>/^\*\*.+\*\*$/.test(b)||/^__.+__$/.test(b),g=u.map(p),x=g.length>1&&g.slice(1).every(b=>b[0]&&f(b[0])),k=g.length>0&&g[0].every(b=>f(b));o.push(Se("div",{style:{overflowX:"auto",margin:"4px 0",paddingBottom:4},children:Se("table",{style:{borderCollapse:"separate",borderSpacing:0,fontSize:"0.95em",width:"max-content",minWidth:"100%"},children:Se("tbody",{children:u.map((b,P)=>Se("tr",{children:p(b).map((B,A)=>Se(P===0?"th":"td",{style:m({border:"1px solid rgba(0,0,0,0.1)",padding:"3px 6px",textAlign:"left",fontWeight:P===0?600:400,minWidth:60,whiteSpace:"nowrap"},A===0&&x||P===0&&k?y(m(m({position:"sticky"},A===0&&x?{left:0}:{}),P===0&&k?{top:0}:{}),{background:"#fff",zIndex:A===0&&x&&P===0&&k?2:1}):{}),children:Ho(B)},A))},P))})})},o.length));continue}if(r.match(/^(\s*)([-*])\s+(.+)/)){let c=[];for(;n<e.length&&/^\s*[-*]\s+/.test(e[n]);){let d=e[n].match(/^\s*[-*]\s+(.+)/);d&&c.push(Se("li",{children:Ho(d[1])},c.length)),n++}o.push(Se("ul",{style:{margin:"2px 0",paddingLeft:20},children:c},o.length));continue}if(r.match(/^(\s*)\d+\.\s+(.+)/)){let c=[];for(;n<e.length&&/^\s*\d+\.\s+/.test(e[n]);){let d=e[n].match(/^\s*\d+\.\s+(.+)/);d&&c.push(Se("li",{children:Ho(d[1])},c.length)),n++}o.push(Se("ol",{style:{margin:"2px 0",paddingLeft:20},children:c},o.length));continue}if(r.trim()===""){o.push(Se("div",{style:{height:4}},o.length)),n++;continue}o.push(Se("div",{style:{margin:"2px 0"},children:Ho(r)},o.length)),n++}return Se(sp,{children:o})}import{Fragment as jr,jsx as Ft,jsxs as Ee}from"react/jsx-runtime";var xi=400,ko=16,Gr=3,ap=16,$r="devtools-thread-panel-position";function Wr(){return{top:ko,left:window.innerWidth-xi-2*Gr-ko}}function rl(t,e){let o=document.getElementById("devtools-toolbar"),n=o==null?void 0:o.getBoundingClientRect(),i=window.innerHeight-ko;return n&&e+xi+2*Gr>n.left&&(i=n.top-ap),Math.max(200,i-Math.max(0,t))}var lp=y(m({width:xi,backgroundColor:"#ffffff"},gn),{boxSizing:"content-box",display:"flex",flexDirection:"column",overflow:"hidden",fontFamily:ve,fontSize:12,color:"#1f2937",pointerEvents:"auto"}),cp={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"4px 5px 4px 10px",margin:"3px 3px 0",fontWeight:600,fontSize:12},dp={flex:1,overflowY:"auto",padding:"8px 0",scrollbarWidth:"none"},up=`
19
19
  [data-devtools="thread-panel-messages"]:hover {
20
20
  scrollbar-width: thin !important;
21
21
  }
@@ -29,4 +29,4 @@ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{
29
29
  background: rgba(0,0,0,0.15);
30
30
  border-radius: 3px;
31
31
  }
32
- `,op={borderTop:"1px solid rgba(0, 0, 0, 0.08)",padding:12};function Qa(t){return t.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 rp(t){return new Date(t).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var Hi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],ip=3e3,sp=250;function tl({size:t=14}){return Ft("svg",{width:t,height:t,viewBox:"0 0 1200 1200",fill:"#6b7280",stroke:"none",style:{flexShrink:0},children:Ft("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 ap({color:t}){let[e,o]=qn(0),[n,r]=qn(()=>Math.floor(Math.random()*Hi.length));return Hn(()=>{let i=setInterval(()=>o(s=>(s+1)%2),sp),a=setInterval(()=>r(s=>(s+1)%Hi.length),ip);return()=>{clearInterval(i),clearInterval(a)}},[]),Ee("span",{style:{display:"inline-flex",alignItems:"center",gap:4},children:[Ft("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:t,style:{verticalAlign:"middle",flexShrink:0},children:e===1?Ee(zi,{children:[Ft("circle",{cx:"7",cy:"7",r:"2"}),Ft("circle",{cx:"17",cy:"7",r:"2"}),Ft("circle",{cx:"7",cy:"17",r:"2"}),Ft("circle",{cx:"17",cy:"17",r:"2"})]}):Ee(zi,{children:[Ft("circle",{cx:"12",cy:"6",r:"2"}),Ft("circle",{cx:"6",cy:"12",r:"2"}),Ft("circle",{cx:"18",cy:"12",r:"2"}),Ft("circle",{cx:"12",cy:"18",r:"2"})]})}),Ft("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:Hi[n]})]})}function lp(t){var r;let e=String(t.data.tool||""),o=t.data.file?String(t.data.file):null,n=o?(r=o.split("/").pop())!=null?r:o:null;switch(e){case"Read":return n?`Reading ${n}`:"Reading file";case"Edit":return n?`Editing ${n}`:"Editing file";case"Write":return n?`Writing ${n}`:"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 e?`Using ${e}`:null}}var cp=new Set(["Read","Glob","Grep","WebFetch","WebSearch"]),dp=new Set(["Edit","Write","Bash"]);function up(t){let e=0,o=!1;for(let n of t){if(n.type!=="tool_use")continue;let r=String(n.data.tool||"");dp.has(r)?o=!0:cp.has(r)&&e++}return!o&&e>=3?"researching":o?"applying changes":null}function pp(t){let e=[];for(let o of t)if(o.type==="tool_use"){let n=lp(o);n&&e.push({kind:"tool",label:n})}else if(o.type==="delta"){let n=String(o.data.text||"");if(!n)continue;let r=e[e.length-1];r&&r.kind==="text"?r.text+=n:e.push({kind:"text",text:n})}else if(o.type==="thinking"){let n=String(o.data.text||"");if(!n)continue;let r=e[e.length-1];r&&r.kind==="thinking"?r.text+=n:e.push({kind:"thinking",text:n})}return e}function el({threadId:t,bridgeUrl:e,accentColor:o,isStreaming:n,streamingEvents:r,onClose:i,onReply:a,activePlan:s,planAnnotations:c,inFlightJobs:l,onViewThread:d,onApprovePlan:u,onDismissPlan:p}){var ee,lt;let[f,g]=qn([]),[y,S]=qn(!0),[x,L]=qn(""),[N,R]=qn([]),M=Pn(null),C=Pn(null),nt=Pn(null),j=Pn(n),G=Pn(Fi()),U=Pn({x:0,y:0}),O=Pn(!1),tt=Pn({x:0,y:0,offsetX:0,offsetY:0}),et=Pn(!1),[,vt]=qn(0);Hn(()=>{try{let ot=localStorage.getItem(Oi);if(ot){let Y=JSON.parse(ot);typeof Y.top=="number"&&typeof Y.left=="number"&&(et.current=!0,G.current={top:Y.top,left:Y.left},vt(gt=>gt+1))}}catch(ot){}},[]),Hn(()=>{let ot=()=>{et.current||(G.current=Fi()),vt(Y=>Y+1)};return window.addEventListener("resize",ot,{passive:!0}),()=>window.removeEventListener("resize",ot)},[]),Hn(()=>{let ot=nt.current;if(!ot)return;let Y=Et=>{Et.button!==0||Et.target.closest("button")||(Et.preventDefault(),Et.stopPropagation(),O.current=!0,tt.current={x:Et.clientX,y:Et.clientY,offsetX:U.current.x,offsetY:U.current.y})},gt=Et=>{if(!O.current)return;let zt=tt.current,W=zt.offsetX+(Et.clientX-zt.x),it=zt.offsetY+(Et.clientY-zt.y),ct=Math.max(So,Math.min(window.innerWidth-hr-2*_i-So,G.current.left+W)),mt=Math.max(So,G.current.top+it);U.current={x:ct-G.current.left,y:mt-G.current.top};let Nt=C.current;Nt&&(Nt.style.top=`${mt}px`,Nt.style.left=`${ct}px`,Nt.style.height=`${qa(mt,ct)}px`)},Ht=()=>{if(!O.current)return;let Et=G.current.top+U.current.y,zt=G.current.left+U.current.x;G.current={top:Et,left:zt},U.current={x:0,y:0},et.current=!0;try{localStorage.setItem(Oi,JSON.stringify({top:Et,left:zt}))}catch(W){}O.current=!1},ht=()=>{G.current=Fi(),U.current={x:0,y:0},et.current=!1;try{localStorage.removeItem(Oi)}catch(Et){}vt(Et=>Et+1)};return ot.addEventListener("mousedown",Y),window.addEventListener("mousemove",gt),window.addEventListener("mouseup",Ht),ot.addEventListener("dblclick",ht),()=>{ot.removeEventListener("mousedown",Y),window.removeEventListener("mousemove",gt),window.removeEventListener("mouseup",Ht),ot.removeEventListener("dblclick",ht)}},[]);let dt=mr(()=>{fetch(`${e}/thread/${t}`).then(ot=>ot.json()).then(ot=>{var Y;g((Y=ot.messages)!=null?Y:[]),S(!1)}).catch(()=>S(!1))},[e,t]);Hn(()=>{S(!0),dt()},[dt]),Hn(()=>{j.current&&!n&&dt(),j.current=n},[n,dt]);let bt=r?pp(r):[],Dt=r?up(r):null;Hn(()=>{M.current&&(M.current.scrollTop=M.current.scrollHeight)},[f,bt.length,n]),Hn(()=>{let ot=Y=>{Y.key==="Escape"&&(Y.stopPropagation(),i())};return document.addEventListener("keydown",ot),()=>document.removeEventListener("keydown",ot)},[i]);let Ot=mr(()=>{if(!x.trim()||!a)return;let ot=x.trim(),Y=N.length>0?N:void 0;g(gt=>[...gt,{role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:Y?`${ot} [${Y.length} image${Y.length>1?"s":""}]`:ot}]),a(t,ot,Y),L(""),R([])},[x,N,t,a]),At=mr(ot=>{let Y=ot.clipboardData.items,gt=[];for(let Ht=0;Ht<Y.length;Ht++){let ht=Y[Ht];if(ht.type.startsWith("image/")){let Et=ht.getAsFile();Et&&gt.push(Et)}}gt.length>0&&(ot.preventDefault(),R(Ht=>[...Ht,...gt]))},[]),V=mr(ot=>{ot.key==="Enter"&&(ot.metaKey||ot.ctrlKey)&&(ot.preventDefault(),Ot())},[Ot]),St=G.current.top+U.current.y,Pt=G.current.left+U.current.x,Kt=qa(St,Pt);return Ee(zi,{children:[Ft("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:ot=>{ot.target===ot.currentTarget&&i()},style:{position:"fixed",inset:0,zIndex:9999}}),Ee("div",{ref:C,style:b(m({},Qu),{height:Kt,position:"fixed",top:St,left:Pt,zIndex:1e4}),"data-devtools":"thread-panel",children:[Ee("div",{ref:nt,style:b(m({},tp),{backgroundColor:o,color:"#ffffff",cursor:"grab",userSelect:"none",WebkitUserSelect:"none"}),children:[Ft("span",{children:"Conversation"}),Ft("button",{onClick:i,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),Ft("style",{dangerouslySetInnerHTML:{__html:np}}),Ee("div",{ref:M,style:ep,"data-devtools":"thread-panel-messages",children:[y&&Ft("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!y&&f.length===0&&!n&&Ft("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),f.map((ot,Y)=>{let gt=ot.role==="human",Ht=gt?ot.replyToQuestion||ot.feedbackSummary||"(annotation)":Qa(ot.responseText||""),ht=gt?void 0:ot.question,Et=!gt&&ot.resolutions&&ot.resolutions.length>0,zt=!gt&&ot.toolsUsed&&ot.toolsUsed.length>0;if(!Ht&&!ht&&!Et)return null;let W=Y===f.length-1;return Ee("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:W?1:.5},children:[Ee("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[!gt&&Ft(tl,{size:11}),Ft("span",{style:{fontWeight:600,fontSize:11,color:gt?o:"#6b7280"},children:gt?"You":"Claude Code"}),Ft("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:rp(ot.timestamp)})]}),Ht&&Ft("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:gt?Ht:gr(Ht)}),ht&&Ft("div",{style:{marginTop:Ht?4:0,lineHeight:1.5,wordBreak:"break-word"},children:gr(ht)}),(zt||Et)&&Ee("div",{style:{marginTop:Ht||ht?6:0,padding:"4px 8px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#6b7280"},children:[zt&&Ft("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:ot.toolsUsed.map((it,ct)=>Ft("div",{children:it},ct))}),Et&&ot.resolutions.map((it,ct)=>{var Bt;let mt=(Bt=it.finalScope)!=null?Bt:it.inferredScope,Nt=mt?`${mt.breadth} \xB7 ${mt.target}`:null;return Ee("div",{style:{marginTop:zt?4:0},children:[Ft("span",{style:{color:it.status==="resolved"?"#10b981":"#f59e0b"},children:it.status==="resolved"?"Done":"Needs review"}),Nt&&Ft("span",{style:{marginLeft:6,padding:"1px 5px",backgroundColor:"rgba(0, 0, 0, 0.06)",fontSize:10,fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace"},children:Nt}),it.summary?` \u2014 ${it.summary}`:""]},ct)})]})]},`${ot.jobId}-${Y}`)}),s&&c&&c.length>0&&Ee("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[Ft("div",{style:{fontWeight:600,fontSize:11,color:"#6b7280",marginBottom:6},children:"Plan Tasks"}),c.map(ot=>{var Et,zt;let Y=(Et=s.tasks)==null?void 0:Et.find(W=>W.id===ot.planTaskId),Ht=l&&Object.values(l).some(W=>W.annotationIds.includes(ot.id))?"running":(zt=ot.status)!=null?zt:"pending",ht=Ht==="resolved"?"#10b981":Ht==="running"?ot.color:Ht==="needs_review"?"#f59e0b":"#9ca3af";return Ee("div",{style:{display:"flex",alignItems:"flex-start",gap:8,padding:"4px 0",cursor:ot.threadId&&d?"pointer":"default"},onClick:()=>{ot.threadId&&d&&d(ot.threadId)},children:[Ft("div",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:ht,marginTop:4,flexShrink:0}}),Ee("div",{style:{flex:1,fontSize:11,lineHeight:1.4},children:[Ft("div",{children:(Y==null?void 0:Y.instruction)||ot.text||ot.planTaskId}),Ft("div",{style:{color:"#9ca3af",fontSize:10},children:Ht})]})]},ot.id)})]}),(s==null?void 0:s.status)==="awaiting_approval"&&u&&p&&Ee("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[Ee("div",{style:{fontWeight:600,fontSize:12},children:[(ee=c==null?void 0:c.length)!=null?ee:0," task",((lt=c==null?void 0:c.length)!=null?lt:0)!==1?"s":""," planned"]}),Ft("div",{style:{color:"#6b7280",fontSize:11,marginTop:2,marginBottom:8},children:"Review annotations, then approve to start workers"}),Ee("div",{style:{display:"flex",gap:8},children:[Ft("button",{onClick:u,style:{padding:"5px 14px",fontSize:11,fontWeight:600,fontFamily:ve,backgroundColor:"#1f2937",color:"#ffffff",border:"none",cursor:"pointer"},children:"Approve"}),Ft("button",{onClick:p,style:{padding:"5px 14px",fontSize:11,fontWeight:600,fontFamily:ve,backgroundColor:"transparent",color:"#6b7280",border:"1px solid rgba(0, 0, 0, 0.1)",cursor:"pointer"},children:"Dismiss"})]})]}),n&&Ee("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[Ee("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[Ft(tl,{size:11}),Ft("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:"Claude Code"}),Dt&&Ft("span",{style:{fontSize:10,color:"#b0b7c3",fontStyle:"italic"},children:Dt}),Ft("span",{style:{marginLeft:"auto"},children:Ft(ap,{color:o})})]}),bt.map((ot,Y)=>{if(ot.kind==="tool")return Ft("div",{style:{paddingLeft:12,fontSize:11,color:"#9ca3af",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",lineHeight:1.6},children:ot.label},Y);if(ot.kind==="thinking")return Ft("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:ot.text},Y);let gt=Qa(ot.text);return gt?Ft("div",{style:{paddingLeft:12,marginTop:2,marginBottom:2,lineHeight:1.5,wordBreak:"break-word"},children:gr(gt)},Y):null})]})]}),a&&Ee("div",{style:op,children:[N.length>0&&Ee("div",{style:{fontSize:11,color:"#6b7280",marginBottom:4,display:"flex",alignItems:"center",gap:4},children:[Ee("span",{children:[N.length," image",N.length>1?"s":""," attached"]}),Ft("button",{onClick:()=>R([]),style:{background:"none",border:"none",cursor:"pointer",fontSize:11,color:"#9ca3af",padding:"0 2px"},children:"\xD7"})]}),Ft("textarea",{value:x,onChange:ot=>L(ot.target.value),onKeyDown:V,onPaste:At,placeholder:"Reply... (Cmd+Enter to send)",style:{width:"100%",minHeight:60,padding:4,fontSize:12,fontFamily:ve,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"}}),Ft("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:6},children:Ft("button",{onClick:Ot,disabled:!x.trim(),style:{padding:"5px 14px",fontSize:11,fontFamily:ve,fontWeight:600,backgroundColor:x.trim()?o:"rgba(0,0,0,0.1)",color:x.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:x.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}import{Fragment as xp,jsx as Fo,jsxs as vp}from"react/jsx-runtime";var nl=fp(null),mp="http://localhost:1111",$i="devtools-provider",Wi="devtools-model",Yi="devtools-open-thread-id",ji="devtools-active-plan",Gi=[{id:"claude-opus-4-6",label:"Opus 4.6"},{id:"claude-sonnet-4-6",label:"Sonn 4.6"}],Vi=[{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 hp(t,e,o){let n=t==="codex"?Vi:Gi;return Math.min(o,(e==="codex"?Vi:Gi).length-1)}function yp({children:t,enabled:e=process.env.NODE_ENV==="development",bridgeUrl:o=mp}){var oe,X,rt;let[n,r]=Ls(),i=Ms(o),a=Qe(new Map),[s,c]=Ke(()=>typeof window=="undefined"?"claude":localStorage.getItem($i)||"claude"),[l,d]=Ke(()=>{if(typeof window=="undefined")return 0;let h=localStorage.getItem(Wi);return h&&parseInt(h,10)||0}),[u,p]=Ke(["claude","codex"]),[f,g]=Ke({}),[y,S]=Ke(!1);Te(()=>{i.isConnected&&ms(o).then(h=>{if(!h)return;let I=Object.entries(h.providers).filter(([,yt])=>yt.available).map(([yt])=>yt);I.length>0&&p(I);let A={};for(let[yt,Rt]of Object.entries(h.providers))Rt.mcp&&(A[yt]=Rt.mcp);g(A),Object.values(A).every(yt=>yt.found)&&S(!1)})},[i.isConnected,o]),Te(()=>{if(u.length>0&&!u.includes(s)){let h=u[0];c(h),localStorage.setItem($i,h)}},[u,s]);let x=s==="codex"?Vi:Gi,L=(oe=x[l])!=null?oe:x[0],N=Pe(h=>{let I=s;c(h),localStorage.setItem($i,h);let A=hp(I,h,l);d(A),localStorage.setItem(Wi,String(A))},[s,l]),R=Pe(h=>{d(h),localStorage.setItem(Wi,String(h))},[]),M=Pe(async()=>{let h=await Ss(o);if(!h)return;let I={};for(let[A,z]of Object.entries(h.capabilities.providers))z.mcp&&(I[A]=z.mcp);g(I),h.results.some(A=>A.installed)&&S(!0)},[o]),[C,nt]=Ke(new Set),[j,G]=Ke(null),[U,O]=Ke(null),[tt,et]=Ke(null),[vt,dt]=Ke(null);Te(()=>{i.isConnected&&eo(o).then(h=>{h!=null&&h.components&&nt(new Set(Object.keys(h.components)))})},[i.isConnected,o]);let bt=Pe(async h=>{let I=[];for(let A of h)try{(await ws(A,o)).added&&I.push(A)}catch(z){console.error("[Popmelt] Failed to add component to model:",A,z)}I.length>0&&(nt(A=>{let z=new Set(A);for(let yt of I)z.add(yt);return z}),G(I[I.length-1]))},[o]),Dt=Pe(h=>{G(h)},[]),Ot=Pe(()=>{eo(o).then(h=>{h!=null&&h.components&&nt(new Set(Object.keys(h.components)))})},[o]),At=Pe(async h=>{try{(await ks(h,o)).removed&&nt(A=>{let z=new Set(A);return z.delete(h),z})}catch(I){console.error("[Popmelt] Failed to remove component from model:",I)}},[o]),V=Pe((h,I)=>{r({type:"MODIFY_SPACING_TOKEN",payload:h}),r({type:"ADD_SPACING_TOKEN_CHANGE",payload:I})},[r]),St=Pe((h,I)=>{r({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:h,originalValue:I}})},[r]),[Pt,Kt]=Ke(0),ee=Qe([]);Te(()=>{let h=ee.current,I=n.spacingTokenMods;ee.current=I;let A=new Map(h.map(Rt=>[Rt.tokenPath,Rt])),z=new Map(I.map(Rt=>[Rt.tokenPath,Rt])),yt=!1;for(let[Rt,Q]of z){let jt=A.get(Rt);if(!(jt&&jt.currentValue===Q.currentValue)){yt=!0,Q.currentValue==="__deleted__"?Cs(Rt,o).catch(Mt=>console.error("[Popmelt] Failed to sync token delete:",Mt)):vr(Rt,Q.currentValue,o).catch(Mt=>console.error("[Popmelt] Failed to sync token update:",Mt));for(let Mt of Q.targets){let _t=document.querySelector(Mt.selector);if(_t)if(Q.currentValue==="__deleted__")_t.style.removeProperty(Mt.property);else{let wt=Q.currentPx;wt>0&&_t.style.setProperty(Mt.property,`${wt}px`,"important")}}}}for(let[Rt,Q]of A)if(!z.has(Rt)){yt=!0,vr(Rt,Q.originalValue,o).catch(jt=>console.error("[Popmelt] Failed to restore token on undo:",jt));for(let jt of Q.targets){let Mt=document.querySelector(jt.selector);Mt&&Mt.style.removeProperty(jt.property)}}yt&&Kt(Rt=>Rt+1)},[n.spacingTokenMods,o]);let[lt,ot]=Ke(()=>typeof window=="undefined"?null:localStorage.getItem(Yi)||null),[Y,gt]=Ke(()=>{if(typeof window=="undefined")return null;try{let h=localStorage.getItem(ji);return h?JSON.parse(h):null}catch(h){return null}});Te(()=>{lt?localStorage.setItem(Yi,lt):localStorage.removeItem(Yi)},[lt]),Te(()=>{Y?localStorage.setItem(ji,JSON.stringify(Y)):localStorage.removeItem(ji)},[Y]);let Ht="popmelt-in-flight-jobs",[ht,Et]=Ke(()=>{try{let h=sessionStorage.getItem(Ht);return h?JSON.parse(h):{}}catch(h){return{}}});Te(()=>{try{Object.keys(ht).length>0?sessionStorage.setItem(Ht,JSON.stringify(ht)):sessionStorage.removeItem(Ht)}catch(h){}},[ht]);let zt=Qe(!1);Te(()=>{if(zt.current||n.annotations.length===0)return;zt.current=!0;let h=new Set;for(let A of Object.values(ht))for(let z of A.annotationIds)h.add(z);let I=n.annotations.filter(A=>h.has(A.id)?!1:!!(A.status==="in_flight"||(A.status==="pending"||!A.status)&&(A.captured||A.threadId))).map(A=>A.id);I.length>0&&r({type:"SET_ANNOTATION_STATUS",payload:{ids:I,status:"dismissed"}}),Y&&(Y.status==="planning"||Y.status==="executing"||Y.status==="reviewing")&&Object.keys(ht).length===0&&gt(null)},[n.annotations,ht,r,Y]);let W=wo(()=>{let h=new Set;for(let I of Object.values(ht))for(let A of I.annotationIds)h.add(A);return h},[ht]),it=wo(()=>{let h=new Set;for(let I of Object.values(ht))for(let A of I.styleSelectors)h.add(A);return h},[ht]),ct=wo(()=>{let h=new Map;for(let I of Object.values(ht)){for(let A of I.styleSelectors)h.set(A,I.color);for(let A of I.annotationIds){let z=n.annotations.find(yt=>yt.id===A);if(z&&(z.linkedSelector&&h.set(z.linkedSelector,I.color),z.groupId))for(let yt of n.annotations)yt.groupId===z.groupId&&yt.linkedSelector&&h.set(yt.linkedSelector,I.color)}}return h},[ht,n.annotations]),mt=Qe(n.annotations);mt.current=n.annotations;let Nt=Qe(n.styleModifications);Nt.current=n.styleModifications;let Bt=Qe(ht);Bt.current=ht,Te(()=>{let h=null,I=()=>{var jt,Mt;if(Object.keys(Bt.current).length>0)return;let z=mt.current,yt=Nt.current,Rt=[],Q=[];for(let _t of z){if(!_t.linkedSelector||!_t.linkedSelector.startsWith("[data-pm=")||_t.captured||_t.status&&_t.status!=="pending")continue;let wt=document.querySelector(_t.linkedSelector);!wt&&((Mt=(jt=_t.elements)==null?void 0:jt[0])!=null&&Mt.selector)&&(wt=document.querySelector(_t.elements[0].selector)),wt||Rt.push(_t.linkedSelector)}for(let _t of yt)document.querySelector(_t.selector)||Q.push(_t.selector);(Rt.length>0||Q.length>0)&&r({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:Rt,styleSelectors:Q}})},A=new MutationObserver(z=>{z.some(yt=>yt.removedNodes.length>0)&&(h&&clearTimeout(h),h=setTimeout(I,3e3))});return A.observe(document.body,{childList:!0,subtree:!0}),()=>{A.disconnect(),h&&clearTimeout(h)}},[r]),Te(()=>{i.lastCompletedJobId&&i.lastCompletedJobId in ht&&Et(h=>{var z;let yt=h,{[z=i.lastCompletedJobId]:I}=yt;return Bn(yt,[Wo(z)])})},[i.lastCompletedJobId]);let xt=Qe(new Set);Te(()=>{let h=i.events.filter(I=>I.type==="done"&&I.data.resolutions);for(let I of h){let A=I.data.jobId;xt.current.has(A)||(xt.current.add(A),Array.isArray(I.data.resolutions)&&r({type:"APPLY_RESOLUTIONS",payload:{resolutions:I.data.resolutions,threadId:I.data.threadId}}))}},[i.events,r]);let ue=Qe(0);Te(()=>{let h=i.incrementalResolutions;if(h.length<=ue.current)return;let I=h.slice(ue.current);ue.current=h.length,r({type:"APPLY_RESOLUTIONS",payload:{resolutions:I}})},[i.incrementalResolutions,r]),Te(()=>{i.incrementalResolutions.length===0&&(ue.current=0)},[i.incrementalResolutions.length]);let Vt=Qe(i.status);Te(()=>{let h=Vt.current;Vt.current=i.status,h==="disconnected"&&i.status==="idle"&&Et({})},[i.status]);let ie=Pe(async()=>{let h=document.getElementById("devtools-canvas");if(!h)return!1;let I=await Hr(document.body,h,n.annotations);if(I.length===0)return!1;let A=await js(I,n.annotations,n.styleModifications);return A&&r({type:"MARK_CAPTURED"}),A},[n.annotations,n.styleModifications,r]),Me=Pe(async h=>{var I;try{let A=n.annotations.filter(Gt=>{var We;return((We=Gt.status)!=null?We:"pending")==="pending"}),z=await er(document.body,A);if(!z)return!1;let yt=Ws(),Rt=n.styleModifications.filter(Gt=>!Gt.captured),Q=(I=n.inspectedElement)==null?void 0:I.info,Mt=A.length>0||Rt.length>0||!!Q?JSON.stringify(Qo(A,Rt,Q)):void 0,{planId:_t,threadId:wt}=await ys(z,h,o,s,L.id,window.location.href,{width:window.innerWidth,height:window.innerHeight},yt,Mt);if(gt({planId:_t,threadId:wt,goal:h,status:"planning"}),wt){let Gt=n.annotations.filter(We=>{var be;return We.type==="text"&&((be=We.status)!=null?be:"pending")==="pending"}).map(We=>We.id);Gt.length>0&&r({type:"SET_ANNOTATION_THREAD",payload:{ids:Gt,threadId:wt}})}return r({type:"MARK_CAPTURED"}),wt&&ot(wt),!0}catch(A){return console.error("[Pare] Failed to send plan:",A),!1}},[o,s,L.id,n.annotations,n.styleModifications,n.inspectedElement,r]),ne=Pe(async h=>{let I=Y==null?void 0:Y.planId;if(!I)return;let A=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),z=A!=null&&A[1]?parseFloat(A[1]):29,yt=h.length>1?360/h.length:0;for(let Rt=0;Rt<h.length;Rt++){let Q=h[Rt],jt=(z+Rt*yt)%360,Mt=`oklch(0.628 0.258 ${Math.round(jt)})`,_t=Q.region.y+Q.region.height/2,wt=window.innerHeight;(_t<window.scrollY||_t>window.scrollY+wt)&&(window.scrollTo({top:Math.max(0,_t-wt/2),behavior:"instant"}),await new Promise(kn=>requestAnimationFrame(()=>requestAnimationFrame(()=>kn()))));let Gt=Cr(Q.region),We=Math.random().toString(36).substring(2,9),be=Gt?{x:Gt.rect.left+window.scrollX,y:Gt.rect.top+window.scrollY,width:Gt.rect.width,height:Gt.rect.height}:Q.region;r({type:"ADD_PLAN_ANNOTATION",payload:{groupId:We,planId:I,planTaskId:Q.id,instruction:Q.instruction,region:be,color:Mt,linkedSelector:Gt==null?void 0:Gt.selector,elements:Gt?[Gt.info]:void 0}}),Rt<h.length-1&&await new Promise(kn=>setTimeout(kn,200))}},[Y==null?void 0:Y.planId,n.activeColor,r]),ze=Pe((h,I)=>{let A=a.current.get(h)||[];a.current.set(h,[...A,...I])},[]),Ut=Pe(async()=>{let h=document.getElementById("devtools-canvas");if(!h)return!1;let I=n.annotations.filter(Mt=>{var _t;return((_t=Mt.status)!=null?_t:"pending")==="pending"}),A=n.spacingTokenChanges.filter(Mt=>!Mt.captured);if(I.length===0&&n.styleModifications.filter(Mt=>!Mt.captured).length===0&&A.length===0)return!1;let z=await Hr(document.body,h,n.annotations);if(z.length===0)return!1;let yt=await tr(z);if(!yt)return!1;let Rt=Qo(I,n.styleModifications,void 0,A.length>0?A:void 0),Q=JSON.stringify(Rt),jt=new Map;for(let Mt of I){let _t=a.current.get(Mt.id);if(_t&&_t.length>0&&jt.set(Mt.id,_t),Mt.groupId){for(let wt of I)if(wt.groupId===Mt.groupId&&wt.id!==Mt.id){let Gt=a.current.get(wt.id);Gt&&Gt.length>0&&jt.set(wt.id,Gt)}}}try{let Mt=Fr(n.activeColor),{jobId:_t,threadId:wt}=await hs(yt,Q,o,Mt,s,L.id,jt.size>0?jt:void 0);for(let Ye of jt.keys())a.current.delete(Ye);let Gt=I.map(Ye=>Ye.id),We=n.styleModifications.filter(Ye=>!Ye.captured).map(Ye=>Ye.selector);Et(Ye=>b(m({},Ye),{[_t]:{annotationIds:Gt,styleSelectors:We,color:n.activeColor,threadId:wt}})),r({type:"MARK_CAPTURED"}),wt&&Gt.length>0&&r({type:"SET_ANNOTATION_THREAD",payload:{ids:Gt,threadId:wt}});let be=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),zn=((be!=null&&be[1]?parseFloat(be[1]):29)+60)%360;return r({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${zn})`}),!0}catch(Mt){return console.error("[Pare] Failed to send to bridge:",Mt),!1}},[n.annotations,n.styleModifications,n.spacingTokenChanges,n.activeColor,r,o,s,L.id]),fe=Pe(async(h,I,A)=>{try{let z=Fr(n.activeColor),{jobId:yt}=await Es(h,I,o,z,s,L.id,A);Et(Q=>b(m({},Q),{[yt]:{annotationIds:[],styleSelectors:[],color:n.activeColor,threadId:h}}));let Rt=n.annotations.filter(Q=>Q.threadId===h&&(Q.status==="waiting_input"||Q.status==="resolved"||Q.status==="needs_review"));Rt.length>0&&(r({type:"SET_ANNOTATION_STATUS",payload:{ids:Rt.map(Q=>Q.id),status:"in_flight"}}),Et(Q=>{let jt=Q[yt];return jt?b(m({},Q),{[yt]:b(m({},jt),{annotationIds:[...jt.annotationIds,...Rt.map(Mt=>Mt.id)]})}):Q})),i.dismissQuestion(h)}catch(z){console.error("[Pare] Failed to send reply:",z)}},[n.activeColor,n.annotations,o,i.dismissQuestion,r,s,L.id]),Ge=Pe(async()=>{if(!(!Y||!Y.planId))try{await bs(Y.planId,o),gt(Q=>Q?b(m({},Q),{status:"executing"}):null);let h=await er(document.body);if(!h)return;let I=n.annotations.filter(Q=>{var jt;return Q.planId===Y.planId&&Q.type!=="text"&&((jt=Q.status)!=null?jt:"pending")==="pending"}),A=I.map(Q=>{var kn,zn,Ye;let jt=Q.groupId?n.annotations.find(Nn=>Nn.groupId===Q.groupId&&Nn.type==="text"):void 0,Mt=(kn=Q.points[0])!=null?kn:{x:0,y:0},_t=(zn=Q.points[1])!=null?zn:Mt,wt=Math.min(Mt.x,_t.x),Gt=Math.min(Mt.y,_t.y),We=Math.abs(_t.x-Mt.x)||100,be=Math.abs(_t.y-Mt.y)||100;return{planTaskId:Q.planTaskId||Q.id,annotationId:Q.id,instruction:(jt==null?void 0:jt.text)||Q.text||"No instruction",region:{x:wt,y:Gt,width:We,height:be},linkedSelector:Q.linkedSelector,elements:(Ye=Q.elements)==null?void 0:Ye.map(Nn=>({selector:Nn.selector,reactComponent:Nn.reactComponent}))}});if(A.length===0)return;let{jobId:z}=await vs(h,Y.planId,A,o,s,L.id),yt=[],Rt=new Set;for(let Q of I)if(Rt.has(Q.id)||(Rt.add(Q.id),yt.push(Q.id)),Q.groupId)for(let jt of n.annotations)jt.groupId===Q.groupId&&!Rt.has(jt.id)&&(Rt.add(jt.id),yt.push(jt.id));Et(Q=>b(m({},Q),{[z]:{annotationIds:yt,styleSelectors:[],color:n.activeColor,planId:Y.planId}})),r({type:"SET_ANNOTATION_STATUS",payload:{ids:yt,status:"in_flight"}}),r({type:"MARK_CAPTURED"})}catch(h){console.error("[Pare] Failed to approve plan:",h)}},[Y,n.annotations,n.activeColor,o,s,L.id,r]),ge=Pe(()=>{if(gt(null),Y!=null&&Y.planId){let h=n.annotations.filter(I=>I.planId===Y.planId);for(let I of h)r({type:"DELETE_ANNOTATION",payload:{id:I.id}})}},[Y,n.annotations,r]),Ue=Qe(new Set);Te(()=>{for(let h of i.pendingQuestions){if(Ue.current.has(h.jobId))continue;Ue.current.add(h.jobId);let I=h.annotationIds&&h.annotationIds.length>0?h.annotationIds:void 0;!I&&h.threadId&&(I=n.annotations.filter(A=>A.threadId===h.threadId).map(A=>A.id)),I&&I.length>0&&r({type:"SET_ANNOTATION_QUESTION",payload:{ids:I,question:h.question,threadId:h.threadId}})}},[i.pendingQuestions,r,n.annotations]);let Ve=Qe(new Set),_e=Qe(null);Te(()=>{for(let h of i.pendingPlans){if(Ve.current.has(h.planId))continue;Ve.current.add(h.planId);let I=h.tasks.length===1;gt(A=>(A==null?void 0:A.planId)!==h.planId?A:b(m({},A),{tasks:h.tasks,threadId:h.threadId,status:I?"executing":"awaiting_approval"})),ne(h.tasks).then(()=>{I&&(_e.current=h.planId)}),i.dismissPlan(h.planId)}},[i.pendingPlans]),Te(()=>{!_e.current||!Y||Y.planId!==_e.current||n.annotations.filter(I=>I.planId===Y.planId&&I.type!=="text").length===0||(_e.current=null,Ge())},[Y,n.annotations,Ge]),Te(()=>{for(let h of i.planReviews)!Y||Y.planId!==h.planId||h.verdict==="pass"&&gt(I=>I?b(m({},I),{status:"done"}):null)},[i.planReviews,Y]);let tn=Qe(new Set);Te(()=>{!Y||Y.status!=="executing"||tn.current.has(Y.planId)||Object.entries(ht).filter(([A,z])=>z.planId===Y.planId).length>0||n.annotations.filter(A=>A.planId===Y.planId&&(A.status==="resolved"||A.status==="needs_review")).length===0||(tn.current.add(Y.planId),(async()=>{try{gt(z=>z?b(m({},z),{status:"reviewing"}):null);let A=await er(document.body);if(!A)return;await xs(Y.planId,A,o,s,L.id)}catch(A){console.error("[Pare] Failed to trigger review:",A)}})())},[Y,ht,n.annotations,o,s,L.id]);let $e=wo(()=>{if(i.activeJobId&&i.activeJobId in ht)return ht[i.activeJobId].color;let h=Object.values(ht);return h.length>0?h[h.length-1].color:void 0},[i.activeJobId,ht]),we=Pe(h=>{ot(h)},[]);Te(()=>{n.activeTool==="model"&&lt&&ot(null)},[n.activeTool]);let Z=Qe(null);Te(()=>{n.isAnnotating?Z.current&&(ot(Z.current),Z.current=null):lt&&(Z.current=lt,ot(null))},[n.isAnnotating]);let Lt=wo(()=>{if(!lt)return null;for(let[h,I]of Object.entries(ht))if(I.threadId===lt)return h;return null},[lt,ht]),[qt,me]=Ke(!1),[ke,ce]=Ke(0),te=Qe(null),en=Pe(h=>{h?(te.current&&(clearTimeout(te.current),te.current=null),me(!0)):te.current=setTimeout(()=>{me(!1),te.current=null},150)},[]),nn=Pe(()=>{ce(h=>h+1),i.clearEvents()},[i.clearEvents]);Te(()=>()=>{te.current&&clearTimeout(te.current)},[]);let wn=wo(()=>({isEnabled:e}),[e]);return e?vp(nl.Provider,{value:wn,children:[t,Fo(Oa,{state:n,dispatch:r,onScreenshot:ie,inFlightAnnotationIds:W,inFlightStyleSelectors:it,inFlightSelectorColors:ct,onAttachImages:ze,onReply:i.isConnected?fe:void 0,onViewThread:i.isConnected?we:void 0,activePlan:Y,onModelComponentsAdd:i.isConnected?bt:void 0,onModelComponentFocus:i.isConnected?Dt:void 0,onModelComponentHover:O,modelComponentNames:C,modelPanelHoveredComponent:tt,modelSpacingTokenHover:vt}),Fo(Ja,{state:n,dispatch:r,onScreenshot:ie,onSendToClaude:i.isConnected?Ut:void 0,onPlanGoal:i.isConnected?Me:void 0,hasActiveJobs:Object.keys(ht).length>0||i.activeJobIds.length>0,activeJobColor:$e,onCrosshairHover:en,onClear:nn,provider:s,onProviderChange:i.isConnected&&u.length>1?N:void 0,availableProviders:u,modelIndex:l,modelCount:x.length,modelLabel:L.label,onModelChange:i.isConnected?R:void 0,onViewThread:i.isConnected?we:void 0,isThreadPanelOpen:lt!==null,activePlan:Y,mcpStatus:f,onInstallMcp:i.isConnected?M:void 0,mcpJustInstalled:y,bridgeUrl:o,modelSelectedComponent:j,modelCanvasHoveredComponent:U,onModelComponentHover:et,onSpacingTokenHover:dt,onModifySpacingToken:i.isConnected?V:void 0,onDeleteSpacingToken:i.isConnected?St:void 0,modelRefreshKey:Pt,onModelComponentAdded:Ot,onModelComponentRemoved:At}),lt&&i.isConnected&&Fo(el,{threadId:lt,bridgeUrl:o,accentColor:(rt=(X=n.annotations.find(h=>h.threadId===lt))==null?void 0:X.color)!=null?rt:n.activeColor,isStreaming:Lt!==null,streamingEvents:Lt?i.events.filter(h=>h.data.jobId===Lt):[],onClose:()=>ot(null),onReply:fe,activePlan:Y,planAnnotations:Y?n.annotations.filter(h=>h.planId===Y.planId&&h.type!=="text"):void 0,inFlightJobs:ht,onViewThread:we,onApprovePlan:(Y==null?void 0:Y.status)==="awaiting_approval"?Ge:void 0,onDismissPlan:(Y==null?void 0:Y.status)==="awaiting_approval"?ge:void 0}),i.isConnected&&Fo(Ua,{bridge:i,bridgeUrl:o,inFlightJobs:ht,isVisible:qt||i.lastResponseText!==null||i.activeJobIds.length>0,onHover:en,clearSignal:ke,onReply:fe,onViewThread:we})]}):Fo(xp,{children:t})}function bp(){let t=gp(nl);if(!t)throw new Error("usePopmelt must be used within PopmeltProvider");return t}export{yp as PopmeltProvider,bp as usePopmelt};
32
+ `,pp={borderTop:"1px solid rgba(0, 0, 0, 0.08)",padding:12};function sl(t){return t.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 fp(t){return new Date(t).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var Yr=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],gp=3e3,mp=250;function al({size:t=14}){return Ft("svg",{width:t,height:t,viewBox:"0 0 1200 1200",fill:"#6b7280",stroke:"none",style:{flexShrink:0},children:Ft("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 hp({color:t}){let[e,o]=Qn(0),[n,i]=Qn(()=>Math.floor(Math.random()*Yr.length));return zn(()=>{let r=setInterval(()=>o(a=>(a+1)%2),mp),s=setInterval(()=>i(a=>(a+1)%Yr.length),gp);return()=>{clearInterval(r),clearInterval(s)}},[]),Ee("span",{style:{display:"inline-flex",alignItems:"center",gap:4},children:[Ft("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:t,style:{verticalAlign:"middle",flexShrink:0},children:e===1?Ee(jr,{children:[Ft("circle",{cx:"7",cy:"7",r:"2"}),Ft("circle",{cx:"17",cy:"7",r:"2"}),Ft("circle",{cx:"7",cy:"17",r:"2"}),Ft("circle",{cx:"17",cy:"17",r:"2"})]}):Ee(jr,{children:[Ft("circle",{cx:"12",cy:"6",r:"2"}),Ft("circle",{cx:"6",cy:"12",r:"2"}),Ft("circle",{cx:"18",cy:"12",r:"2"}),Ft("circle",{cx:"12",cy:"18",r:"2"})]})}),Ft("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:Yr[n]})]})}function yp(t){var i;let e=String(t.data.tool||""),o=t.data.file?String(t.data.file):null,n=o?(i=o.split("/").pop())!=null?i:o:null;switch(e){case"Read":return n?`Reading ${n}`:"Reading file";case"Edit":return n?`Editing ${n}`:"Editing file";case"Write":return n?`Writing ${n}`:"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 e?`Using ${e}`:null}}var bp=new Set(["Read","Glob","Grep","WebFetch","WebSearch"]),xp=new Set(["Edit","Write","Bash"]);function vp(t){let e=0,o=!1;for(let n of t){if(n.type!=="tool_use")continue;let i=String(n.data.tool||"");xp.has(i)?o=!0:bp.has(i)&&e++}return!o&&e>=3?"researching":o?"applying changes":null}function Sp(t){let e=[];for(let o of t)if(o.type==="tool_use"){let n=yp(o);n&&e.push({kind:"tool",label:n})}else if(o.type==="delta"){let n=String(o.data.text||"");if(!n)continue;let i=e[e.length-1];i&&i.kind==="text"?i.text+=n:e.push({kind:"text",text:n})}else if(o.type==="thinking"){let n=String(o.data.text||"");if(!n)continue;let i=e[e.length-1];i&&i.kind==="thinking"?i.text+=n:e.push({kind:"thinking",text:n})}return e}function ll({threadId:t,bridgeUrl:e,accentColor:o,isStreaming:n,streamingEvents:i,onClose:r,onReply:s,activePlan:a,planAnnotations:l,inFlightJobs:c,onViewThread:d,onApprovePlan:u,onDismissPlan:p}){var ee,lt;let[f,g]=Qn([]),[x,k]=Qn(!0),[b,P]=Qn(""),[B,A]=Qn([]),M=Bn(null),C=Bn(null),nt=Bn(null),j=Bn(n),G=Bn(Wr()),U=Bn({x:0,y:0}),O=Bn(!1),tt=Bn({x:0,y:0,offsetX:0,offsetY:0}),et=Bn(!1),[,vt]=Qn(0);zn(()=>{try{let ot=localStorage.getItem($r);if(ot){let Y=JSON.parse(ot);typeof Y.top=="number"&&typeof Y.left=="number"&&(et.current=!0,G.current={top:Y.top,left:Y.left},vt(gt=>gt+1))}}catch(ot){}},[]),zn(()=>{let ot=()=>{et.current||(G.current=Wr()),vt(Y=>Y+1)};return window.addEventListener("resize",ot,{passive:!0}),()=>window.removeEventListener("resize",ot)},[]),zn(()=>{let ot=nt.current;if(!ot)return;let Y=Et=>{Et.button!==0||Et.target.closest("button")||(Et.preventDefault(),Et.stopPropagation(),O.current=!0,tt.current={x:Et.clientX,y:Et.clientY,offsetX:U.current.x,offsetY:U.current.y})},gt=Et=>{if(!O.current)return;let zt=tt.current,W=zt.offsetX+(Et.clientX-zt.x),rt=zt.offsetY+(Et.clientY-zt.y),ct=Math.max(ko,Math.min(window.innerWidth-xi-2*Gr-ko,G.current.left+W)),mt=Math.max(ko,G.current.top+rt);U.current={x:ct-G.current.left,y:mt-G.current.top};let Bt=C.current;Bt&&(Bt.style.top=`${mt}px`,Bt.style.left=`${ct}px`,Bt.style.height=`${rl(mt,ct)}px`)},Ht=()=>{if(!O.current)return;let Et=G.current.top+U.current.y,zt=G.current.left+U.current.x;G.current={top:Et,left:zt},U.current={x:0,y:0},et.current=!0;try{localStorage.setItem($r,JSON.stringify({top:Et,left:zt}))}catch(W){}O.current=!1},ht=()=>{G.current=Wr(),U.current={x:0,y:0},et.current=!1;try{localStorage.removeItem($r)}catch(Et){}vt(Et=>Et+1)};return ot.addEventListener("mousedown",Y),window.addEventListener("mousemove",gt),window.addEventListener("mouseup",Ht),ot.addEventListener("dblclick",ht),()=>{ot.removeEventListener("mousedown",Y),window.removeEventListener("mousemove",gt),window.removeEventListener("mouseup",Ht),ot.removeEventListener("dblclick",ht)}},[]);let dt=bi(()=>{fetch(`${e}/thread/${t}`).then(ot=>ot.json()).then(ot=>{var Y;g((Y=ot.messages)!=null?Y:[]),k(!1)}).catch(()=>k(!1))},[e,t]);zn(()=>{k(!0),dt()},[dt]),zn(()=>{j.current&&!n&&dt(),j.current=n},[n,dt]);let bt=i?Sp(i):[],Dt=i?vp(i):null;zn(()=>{M.current&&(M.current.scrollTop=M.current.scrollHeight)},[f,bt.length,n]),zn(()=>{let ot=Y=>{Y.key==="Escape"&&(Y.stopPropagation(),r())};return document.addEventListener("keydown",ot),()=>document.removeEventListener("keydown",ot)},[r]);let Ot=bi(()=>{if(!b.trim()||!s)return;let ot=b.trim(),Y=B.length>0?B:void 0;g(gt=>[...gt,{role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:Y?`${ot} [${Y.length} image${Y.length>1?"s":""}]`:ot}]),s(t,ot,Y),P(""),A([])},[b,B,t,s]),At=bi(ot=>{let Y=ot.clipboardData.items,gt=[];for(let Ht=0;Ht<Y.length;Ht++){let ht=Y[Ht];if(ht.type.startsWith("image/")){let Et=ht.getAsFile();Et&&gt.push(Et)}}gt.length>0&&(ot.preventDefault(),A(Ht=>[...Ht,...gt]))},[]),V=bi(ot=>{ot.key==="Enter"&&(ot.metaKey||ot.ctrlKey)&&(ot.preventDefault(),Ot())},[Ot]),St=G.current.top+U.current.y,Pt=G.current.left+U.current.x,Kt=rl(St,Pt);return Ee(jr,{children:[Ft("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:ot=>{ot.target===ot.currentTarget&&r()},style:{position:"fixed",inset:0,zIndex:9999}}),Ee("div",{ref:C,style:y(m({},lp),{height:Kt,position:"fixed",top:St,left:Pt,zIndex:1e4}),"data-devtools":"thread-panel",children:[Ee("div",{ref:nt,style:y(m({},cp),{backgroundColor:o,color:"#ffffff",cursor:"grab",userSelect:"none",WebkitUserSelect:"none"}),children:[Ft("span",{children:"Conversation"}),Ft("button",{onClick:r,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),Ft("style",{dangerouslySetInnerHTML:{__html:up}}),Ee("div",{ref:M,style:dp,"data-devtools":"thread-panel-messages",children:[x&&Ft("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!x&&f.length===0&&!n&&Ft("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),f.map((ot,Y)=>{let gt=ot.role==="human",Ht=gt?ot.replyToQuestion||ot.feedbackSummary||"(annotation)":sl(ot.responseText||""),ht=gt?void 0:ot.question,Et=!gt&&ot.resolutions&&ot.resolutions.length>0,zt=!gt&&ot.toolsUsed&&ot.toolsUsed.length>0;if(!Ht&&!ht&&!Et)return null;let W=Y===f.length-1;return Ee("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:W?1:.5},children:[Ee("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[!gt&&Ft(al,{size:11}),Ft("span",{style:{fontWeight:600,fontSize:11,color:gt?o:"#6b7280"},children:gt?"You":"Claude Code"}),Ft("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:fp(ot.timestamp)})]}),Ht&&Ft("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:gt?Ht:yi(Ht)}),ht&&Ft("div",{style:{marginTop:Ht?4:0,lineHeight:1.5,wordBreak:"break-word"},children:yi(ht)}),(zt||Et)&&Ee("div",{style:{marginTop:Ht||ht?6:0,padding:"4px 8px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#6b7280"},children:[zt&&Ft("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:ot.toolsUsed.map((rt,ct)=>Ft("div",{children:rt},ct))}),Et&&ot.resolutions.map((rt,ct)=>{var Nt;let mt=(Nt=rt.finalScope)!=null?Nt:rt.inferredScope,Bt=mt?`${mt.breadth} \xB7 ${mt.target}`:null;return Ee("div",{style:{marginTop:zt?4:0},children:[Ft("span",{style:{color:rt.status==="resolved"?"#10b981":"#f59e0b"},children:rt.status==="resolved"?"Done":"Needs review"}),Bt&&Ft("span",{style:{marginLeft:6,padding:"1px 5px",backgroundColor:"rgba(0, 0, 0, 0.06)",fontSize:10,fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace"},children:Bt}),rt.summary?` \u2014 ${rt.summary}`:""]},ct)})]})]},`${ot.jobId}-${Y}`)}),a&&l&&l.length>0&&Ee("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[Ft("div",{style:{fontWeight:600,fontSize:11,color:"#6b7280",marginBottom:6},children:"Plan Tasks"}),l.map(ot=>{var Et,zt;let Y=(Et=a.tasks)==null?void 0:Et.find(W=>W.id===ot.planTaskId),Ht=c&&Object.values(c).some(W=>W.annotationIds.includes(ot.id))?"running":(zt=ot.status)!=null?zt:"pending",ht=Ht==="resolved"?"#10b981":Ht==="running"?ot.color:Ht==="needs_review"?"#f59e0b":"#9ca3af";return Ee("div",{style:{display:"flex",alignItems:"flex-start",gap:8,padding:"4px 0",cursor:ot.threadId&&d?"pointer":"default"},onClick:()=>{ot.threadId&&d&&d(ot.threadId)},children:[Ft("div",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:ht,marginTop:4,flexShrink:0}}),Ee("div",{style:{flex:1,fontSize:11,lineHeight:1.4},children:[Ft("div",{children:(Y==null?void 0:Y.instruction)||ot.text||ot.planTaskId}),Ft("div",{style:{color:"#9ca3af",fontSize:10},children:Ht})]})]},ot.id)})]}),(a==null?void 0:a.status)==="awaiting_approval"&&u&&p&&Ee("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[Ee("div",{style:{fontWeight:600,fontSize:12},children:[(ee=l==null?void 0:l.length)!=null?ee:0," task",((lt=l==null?void 0:l.length)!=null?lt:0)!==1?"s":""," planned"]}),Ft("div",{style:{color:"#6b7280",fontSize:11,marginTop:2,marginBottom:8},children:"Review annotations, then approve to start workers"}),Ee("div",{style:{display:"flex",gap:8},children:[Ft("button",{onClick:u,style:{padding:"5px 14px",fontSize:11,fontWeight:600,fontFamily:ve,backgroundColor:"#1f2937",color:"#ffffff",border:"none",cursor:"pointer"},children:"Approve"}),Ft("button",{onClick:p,style:{padding:"5px 14px",fontSize:11,fontWeight:600,fontFamily:ve,backgroundColor:"transparent",color:"#6b7280",border:"1px solid rgba(0, 0, 0, 0.1)",cursor:"pointer"},children:"Dismiss"})]})]}),n&&Ee("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[Ee("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[Ft(al,{size:11}),Ft("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:"Claude Code"}),Dt&&Ft("span",{style:{fontSize:10,color:"#b0b7c3",fontStyle:"italic"},children:Dt}),Ft("span",{style:{marginLeft:"auto"},children:Ft(hp,{color:o})})]}),bt.map((ot,Y)=>{if(ot.kind==="tool")return Ft("div",{style:{paddingLeft:12,fontSize:11,color:"#9ca3af",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",lineHeight:1.6},children:ot.label},Y);if(ot.kind==="thinking")return Ft("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:ot.text},Y);let gt=sl(ot.text);return gt?Ft("div",{style:{paddingLeft:12,marginTop:2,marginBottom:2,lineHeight:1.5,wordBreak:"break-word"},children:yi(gt)},Y):null})]})]}),s&&Ee("div",{style:pp,children:[B.length>0&&Ee("div",{style:{fontSize:11,color:"#6b7280",marginBottom:4,display:"flex",alignItems:"center",gap:4},children:[Ee("span",{children:[B.length," image",B.length>1?"s":""," attached"]}),Ft("button",{onClick:()=>A([]),style:{background:"none",border:"none",cursor:"pointer",fontSize:11,color:"#9ca3af",padding:"0 2px"},children:"\xD7"})]}),Ft("textarea",{value:b,onChange:ot=>P(ot.target.value),onKeyDown:V,onPaste:At,placeholder:"Reply... (Cmd+Enter to send)",style:{width:"100%",minHeight:60,padding:4,fontSize:12,fontFamily:ve,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"}}),Ft("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:6},children:Ft("button",{onClick:Ot,disabled:!b.trim(),style:{padding:"5px 14px",fontSize:11,fontFamily:ve,fontWeight:600,backgroundColor:b.trim()?o:"rgba(0,0,0,0.1)",color:b.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:b.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}import{Fragment as Ip,jsx as zo,jsxs as Lp}from"react/jsx-runtime";var cl=wp(null),Cp="http://localhost:1111",Vr="devtools-provider",Xr="devtools-model",Jr="devtools-open-thread-id",Kr="devtools-active-plan",Ur=[{id:"claude-opus-4-6",label:"Opus 4.6"},{id:"claude-sonnet-4-6",label:"Sonn 4.6"}],Zr=[{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 Ep(t,e,o){let n=t==="codex"?Zr:Ur;return Math.min(o,(e==="codex"?Zr:Ur).length-1)}function Tp({children:t,enabled:e=process.env.NODE_ENV==="development",bridgeUrl:o=Cp}){var oe,X,it;let[n,i]=Os(),r=Ns(o),s=tn(new Map),[a,l]=Ue(()=>typeof window=="undefined"?"claude":localStorage.getItem(Vr)||"claude"),[c,d]=Ue(()=>{if(typeof window=="undefined")return 0;let h=localStorage.getItem(Xr);return h&&parseInt(h,10)||0}),[u,p]=Ue(["claude","codex"]),[f,g]=Ue({}),[x,k]=Ue(!1);Te(()=>{r.isConnected&&vs(o).then(h=>{if(!h)return;let I=Object.entries(h.providers).filter(([,yt])=>yt.available).map(([yt])=>yt);I.length>0&&p(I);let L={};for(let[yt,Rt]of Object.entries(h.providers))Rt.mcp&&(L[yt]=Rt.mcp);g(L),Object.values(L).every(yt=>yt.found)&&k(!1)})},[r.isConnected,o]),Te(()=>{if(u.length>0&&!u.includes(a)){let h=u[0];l(h),localStorage.setItem(Vr,h)}},[u,a]);let b=a==="codex"?Zr:Ur,P=(oe=b[c])!=null?oe:b[0],B=Pe(h=>{let I=a;l(h),localStorage.setItem(Vr,h);let L=Ep(I,h,c);d(L),localStorage.setItem(Xr,String(L))},[a,c]),A=Pe(h=>{d(h),localStorage.setItem(Xr,String(h))},[]),M=Pe(async()=>{let h=await Ts(o);if(!h)return;let I={};for(let[L,z]of Object.entries(h.capabilities.providers))z.mcp&&(I[L]=z.mcp);g(I),h.results.some(L=>L.installed)&&k(!0)},[o]),[C,nt]=Ue(new Set),[j,G]=Ue(null),[U,O]=Ue(null),[tt,et]=Ue(null),[vt,dt]=Ue(null);Te(()=>{r.isConnected&&no(o).then(h=>{h!=null&&h.components&&nt(new Set(Object.keys(h.components)))})},[r.isConnected,o]);let bt=Pe(async h=>{let I=[];for(let L of h)try{(await Ms(L,o)).added&&I.push(L)}catch(z){console.error("[Popmelt] Failed to add component to model:",L,z)}I.length>0&&(nt(L=>{let z=new Set(L);for(let yt of I)z.add(yt);return z}),G(I[I.length-1]))},[o]),Dt=Pe(h=>{G(h)},[]),Ot=Pe(()=>{no(o).then(h=>{h!=null&&h.components&&nt(new Set(Object.keys(h.components)))})},[o]),At=Pe(async h=>{try{(await Is(h,o)).removed&&nt(L=>{let z=new Set(L);return z.delete(h),z})}catch(I){console.error("[Popmelt] Failed to remove component from model:",I)}},[o]),V=Pe((h,I)=>{i({type:"MODIFY_SPACING_TOKEN",payload:h}),i({type:"ADD_SPACING_TOKEN_CHANGE",payload:I})},[i]),St=Pe((h,I)=>{i({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:h,originalValue:I}})},[i]),[Pt,Kt]=Ue(0),ee=tn([]);Te(()=>{let h=ee.current,I=n.spacingTokenMods;ee.current=I;let L=new Map(h.map(Rt=>[Rt.tokenPath,Rt])),z=new Map(I.map(Rt=>[Rt.tokenPath,Rt])),yt=!1;for(let[Rt,Q]of z){let jt=L.get(Rt);if(!(jt&&jt.currentValue===Q.currentValue)){yt=!0,Q.currentValue==="__deleted__"?Ls(Rt,o).catch(Mt=>console.error("[Popmelt] Failed to sync token delete:",Mt)):ki(Rt,Q.currentValue,o).catch(Mt=>console.error("[Popmelt] Failed to sync token update:",Mt));for(let Mt of Q.targets){let _t=document.querySelector(Mt.selector);if(_t)if(Q.currentValue==="__deleted__")_t.style.removeProperty(Mt.property);else{let wt=Q.currentPx;wt>0&&_t.style.setProperty(Mt.property,`${wt}px`,"important")}}}}for(let[Rt,Q]of L)if(!z.has(Rt)){yt=!0,ki(Rt,Q.originalValue,o).catch(jt=>console.error("[Popmelt] Failed to restore token on undo:",jt));for(let jt of Q.targets){let Mt=document.querySelector(jt.selector);Mt&&Mt.style.removeProperty(jt.property)}}yt&&Kt(Rt=>Rt+1)},[n.spacingTokenMods,o]);let[lt,ot]=Ue(()=>typeof window=="undefined"?null:localStorage.getItem(Jr)||null),[Y,gt]=Ue(()=>{if(typeof window=="undefined")return null;try{let h=localStorage.getItem(Kr);return h?JSON.parse(h):null}catch(h){return null}});Te(()=>{lt?localStorage.setItem(Jr,lt):localStorage.removeItem(Jr)},[lt]),Te(()=>{Y?localStorage.setItem(Kr,JSON.stringify(Y)):localStorage.removeItem(Kr)},[Y]);let Ht="popmelt-in-flight-jobs",[ht,Et]=Ue(()=>{try{let h=sessionStorage.getItem(Ht);return h?JSON.parse(h):{}}catch(h){return{}}});Te(()=>{try{Object.keys(ht).length>0?sessionStorage.setItem(Ht,JSON.stringify(ht)):sessionStorage.removeItem(Ht)}catch(h){}},[ht]);let zt=tn(!1);Te(()=>{if(zt.current||n.annotations.length===0)return;zt.current=!0;let h=new Set;for(let L of Object.values(ht))for(let z of L.annotationIds)h.add(z);let I=n.annotations.filter(L=>h.has(L.id)?!1:!!(L.status==="in_flight"||(L.status==="pending"||!L.status)&&(L.captured||L.threadId))).map(L=>L.id);I.length>0&&i({type:"SET_ANNOTATION_STATUS",payload:{ids:I,status:"dismissed"}}),Y&&(Y.status==="planning"||Y.status==="executing"||Y.status==="reviewing")&&Object.keys(ht).length===0&&gt(null)},[n.annotations,ht,i,Y]);let W=Co(()=>{let h=new Set;for(let I of Object.values(ht))for(let L of I.annotationIds)h.add(L);return h},[ht]),rt=Co(()=>{let h=new Set;for(let I of Object.values(ht))for(let L of I.styleSelectors)h.add(L);return h},[ht]),ct=Co(()=>{let h=new Map;for(let I of Object.values(ht)){for(let L of I.styleSelectors)h.set(L,I.color);for(let L of I.annotationIds){let z=n.annotations.find(yt=>yt.id===L);if(z&&(z.linkedSelector&&h.set(z.linkedSelector,I.color),z.groupId))for(let yt of n.annotations)yt.groupId===z.groupId&&yt.linkedSelector&&h.set(yt.linkedSelector,I.color)}}return h},[ht,n.annotations]),mt=tn(n.annotations);mt.current=n.annotations;let Bt=tn(n.styleModifications);Bt.current=n.styleModifications;let Nt=tn(ht);Nt.current=ht,Te(()=>{let h=null,I=()=>{var jt,Mt;if(Object.keys(Nt.current).length>0)return;let z=mt.current,yt=Bt.current,Rt=[],Q=[];for(let _t of z){if(!_t.linkedSelector||!_t.linkedSelector.startsWith("[data-pm=")||_t.captured||_t.status&&_t.status!=="pending")continue;let wt=document.querySelector(_t.linkedSelector);!wt&&((Mt=(jt=_t.elements)==null?void 0:jt[0])!=null&&Mt.selector)&&(wt=document.querySelector(_t.elements[0].selector)),wt||Rt.push(_t.linkedSelector)}for(let _t of yt)document.querySelector(_t.selector)||Q.push(_t.selector);(Rt.length>0||Q.length>0)&&i({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:Rt,styleSelectors:Q}})},L=new MutationObserver(z=>{z.some(yt=>yt.removedNodes.length>0)&&(h&&clearTimeout(h),h=setTimeout(I,3e3))});return L.observe(document.body,{childList:!0,subtree:!0}),()=>{L.disconnect(),h&&clearTimeout(h)}},[i]),Te(()=>{r.lastCompletedJobId&&r.lastCompletedJobId in ht&&Et(h=>{var z;let yt=h,{[z=r.lastCompletedJobId]:I}=yt;return Dn(yt,[jo(z)])})},[r.lastCompletedJobId]);let xt=tn(new Set);Te(()=>{let h=r.events.filter(I=>I.type==="done"&&I.data.resolutions);for(let I of h){let L=I.data.jobId;xt.current.has(L)||(xt.current.add(L),Array.isArray(I.data.resolutions)&&i({type:"APPLY_RESOLUTIONS",payload:{resolutions:I.data.resolutions,threadId:I.data.threadId}}))}},[r.events,i]);let ue=tn(0);Te(()=>{let h=r.incrementalResolutions;if(h.length<=ue.current)return;let I=h.slice(ue.current);ue.current=h.length,i({type:"APPLY_RESOLUTIONS",payload:{resolutions:I}})},[r.incrementalResolutions,i]),Te(()=>{r.incrementalResolutions.length===0&&(ue.current=0)},[r.incrementalResolutions.length]);let Vt=tn(r.status);Te(()=>{let h=Vt.current;Vt.current=r.status,h==="disconnected"&&r.status==="idle"&&Et({})},[r.status]);let re=Pe(async()=>{let h=document.getElementById("devtools-canvas");if(!h)return!1;let I=await Yi(document.body,h,n.annotations);if(I.length===0)return!1;let L=await Zs(I,n.annotations,n.styleModifications);return L&&i({type:"MARK_CAPTURED"}),L},[n.annotations,n.styleModifications,i]),Me=Pe(async h=>{var I;try{let L=n.annotations.filter(Gt=>{var We;return((We=Gt.status)!=null?We:"pending")==="pending"}),z=await ii(document.body,L);if(!z)return!1;let yt=Ks(),Rt=n.styleModifications.filter(Gt=>!Gt.captured),Q=(I=n.inspectedElement)==null?void 0:I.info,Mt=L.length>0||Rt.length>0||!!Q?JSON.stringify(ni(L,Rt,Q)):void 0,{planId:_t,threadId:wt}=await ws(z,h,o,a,P.id,window.location.href,{width:window.innerWidth,height:window.innerHeight},yt,Mt);if(gt({planId:_t,threadId:wt,goal:h,status:"planning"}),wt){let Gt=n.annotations.filter(We=>{var be;return We.type==="text"&&((be=We.status)!=null?be:"pending")==="pending"}).map(We=>We.id);Gt.length>0&&i({type:"SET_ANNOTATION_THREAD",payload:{ids:Gt,threadId:wt}})}return i({type:"MARK_CAPTURED"}),wt&&ot(wt),!0}catch(L){return console.error("[Pare] Failed to send plan:",L),!1}},[o,a,P.id,n.annotations,n.styleModifications,n.inspectedElement,i]),ne=Pe(async h=>{let I=Y==null?void 0:Y.planId;if(!I)return;let L=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),z=L!=null&&L[1]?parseFloat(L[1]):29,yt=h.length>1?360/h.length:0;for(let Rt=0;Rt<h.length;Rt++){let Q=h[Rt],jt=(z+Rt*yt)%360,Mt=`oklch(0.628 0.258 ${Math.round(jt)})`,_t=Q.region.y+Q.region.height/2,wt=window.innerHeight;(_t<window.scrollY||_t>window.scrollY+wt)&&(window.scrollTo({top:Math.max(0,_t-wt/2),behavior:"instant"}),await new Promise(Cn=>requestAnimationFrame(()=>requestAnimationFrame(()=>Cn()))));let Gt=Li(Q.region),We=Math.random().toString(36).substring(2,9),be=Gt?{x:Gt.rect.left+window.scrollX,y:Gt.rect.top+window.scrollY,width:Gt.rect.width,height:Gt.rect.height}:Q.region;i({type:"ADD_PLAN_ANNOTATION",payload:{groupId:We,planId:I,planTaskId:Q.id,instruction:Q.instruction,region:be,color:Mt,linkedSelector:Gt==null?void 0:Gt.selector,elements:Gt?[Gt.info]:void 0}}),Rt<h.length-1&&await new Promise(Cn=>setTimeout(Cn,200))}},[Y==null?void 0:Y.planId,n.activeColor,i]),ze=Pe((h,I)=>{let L=s.current.get(h)||[];s.current.set(h,[...L,...I])},[]),Ut=Pe(async()=>{let h=document.getElementById("devtools-canvas");if(!h)return!1;let I=n.annotations.filter(Mt=>{var _t;return((_t=Mt.status)!=null?_t:"pending")==="pending"}),L=n.spacingTokenChanges.filter(Mt=>!Mt.captured);if(I.length===0&&n.styleModifications.filter(Mt=>!Mt.captured).length===0&&L.length===0)return!1;let z=await Yi(document.body,h,n.annotations);if(z.length===0)return!1;let yt=await oi(z);if(!yt)return!1;let Rt=ni(I,n.styleModifications,void 0,L.length>0?L:void 0),Q=JSON.stringify(Rt),jt=new Map;for(let Mt of I){let _t=s.current.get(Mt.id);if(_t&&_t.length>0&&jt.set(Mt.id,_t),Mt.groupId){for(let wt of I)if(wt.groupId===Mt.groupId&&wt.id!==Mt.id){let Gt=s.current.get(wt.id);Gt&&Gt.length>0&&jt.set(wt.id,Gt)}}}try{let Mt=Wi(n.activeColor),{jobId:_t,threadId:wt}=await Ss(yt,Q,o,Mt,a,P.id,jt.size>0?jt:void 0);for(let Ye of jt.keys())s.current.delete(Ye);let Gt=I.map(Ye=>Ye.id),We=n.styleModifications.filter(Ye=>!Ye.captured).map(Ye=>Ye.selector);Et(Ye=>y(m({},Ye),{[_t]:{annotationIds:Gt,styleSelectors:We,color:n.activeColor,threadId:wt}})),i({type:"MARK_CAPTURED"}),wt&&Gt.length>0&&i({type:"SET_ANNOTATION_THREAD",payload:{ids:Gt,threadId:wt}});let be=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),_n=((be!=null&&be[1]?parseFloat(be[1]):29)+60)%360;return i({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${_n})`}),!0}catch(Mt){return console.error("[Pare] Failed to send to bridge:",Mt),!1}},[n.annotations,n.styleModifications,n.spacingTokenChanges,n.activeColor,i,o,a,P.id]),fe=Pe(async(h,I,L)=>{try{let z=Wi(n.activeColor),{jobId:yt}=await Rs(h,I,o,z,a,P.id,L);Et(Q=>y(m({},Q),{[yt]:{annotationIds:[],styleSelectors:[],color:n.activeColor,threadId:h}}));let Rt=n.annotations.filter(Q=>Q.threadId===h&&(Q.status==="waiting_input"||Q.status==="resolved"||Q.status==="needs_review"));Rt.length>0&&(i({type:"SET_ANNOTATION_STATUS",payload:{ids:Rt.map(Q=>Q.id),status:"in_flight"}}),Et(Q=>{let jt=Q[yt];return jt?y(m({},Q),{[yt]:y(m({},jt),{annotationIds:[...jt.annotationIds,...Rt.map(Mt=>Mt.id)]})}):Q})),r.dismissQuestion(h)}catch(z){console.error("[Pare] Failed to send reply:",z)}},[n.activeColor,n.annotations,o,r.dismissQuestion,i,a,P.id]),Ve=Pe(async()=>{if(!(!Y||!Y.planId))try{await ks(Y.planId,o),gt(Q=>Q?y(m({},Q),{status:"executing"}):null);let h=await ii(document.body);if(!h)return;let I=n.annotations.filter(Q=>{var jt;return Q.planId===Y.planId&&Q.type!=="text"&&((jt=Q.status)!=null?jt:"pending")==="pending"}),L=I.map(Q=>{var Cn,_n,Ye;let jt=Q.groupId?n.annotations.find(Nn=>Nn.groupId===Q.groupId&&Nn.type==="text"):void 0,Mt=(Cn=Q.points[0])!=null?Cn:{x:0,y:0},_t=(_n=Q.points[1])!=null?_n:Mt,wt=Math.min(Mt.x,_t.x),Gt=Math.min(Mt.y,_t.y),We=Math.abs(_t.x-Mt.x)||100,be=Math.abs(_t.y-Mt.y)||100;return{planTaskId:Q.planTaskId||Q.id,annotationId:Q.id,instruction:(jt==null?void 0:jt.text)||Q.text||"No instruction",region:{x:wt,y:Gt,width:We,height:be},linkedSelector:Q.linkedSelector,elements:(Ye=Q.elements)==null?void 0:Ye.map(Nn=>({selector:Nn.selector,reactComponent:Nn.reactComponent}))}});if(L.length===0)return;let{jobId:z}=await Es(h,Y.planId,L,o,a,P.id),yt=[],Rt=new Set;for(let Q of I)if(Rt.has(Q.id)||(Rt.add(Q.id),yt.push(Q.id)),Q.groupId)for(let jt of n.annotations)jt.groupId===Q.groupId&&!Rt.has(jt.id)&&(Rt.add(jt.id),yt.push(jt.id));Et(Q=>y(m({},Q),{[z]:{annotationIds:yt,styleSelectors:[],color:n.activeColor,planId:Y.planId}})),i({type:"SET_ANNOTATION_STATUS",payload:{ids:yt,status:"in_flight"}}),i({type:"MARK_CAPTURED"})}catch(h){console.error("[Pare] Failed to approve plan:",h)}},[Y,n.annotations,n.activeColor,o,a,P.id,i]),ge=Pe(()=>{if(gt(null),Y!=null&&Y.planId){let h=n.annotations.filter(I=>I.planId===Y.planId);for(let I of h)i({type:"DELETE_ANNOTATION",payload:{id:I.id}})}},[Y,n.annotations,i]),Ze=tn(new Set);Te(()=>{for(let h of r.pendingQuestions){if(Ze.current.has(h.jobId))continue;Ze.current.add(h.jobId);let I=h.annotationIds&&h.annotationIds.length>0?h.annotationIds:void 0;!I&&h.threadId&&(I=n.annotations.filter(L=>L.threadId===h.threadId).map(L=>L.id)),I&&I.length>0&&i({type:"SET_ANNOTATION_QUESTION",payload:{ids:I,question:h.question,threadId:h.threadId}})}},[r.pendingQuestions,i,n.annotations]);let Xe=tn(new Set),_e=tn(null);Te(()=>{for(let h of r.pendingPlans){if(Xe.current.has(h.planId))continue;Xe.current.add(h.planId);let I=h.tasks.length===1;gt(L=>(L==null?void 0:L.planId)!==h.planId?L:y(m({},L),{tasks:h.tasks,threadId:h.threadId,status:I?"executing":"awaiting_approval"})),ne(h.tasks).then(()=>{I&&(_e.current=h.planId)}),r.dismissPlan(h.planId)}},[r.pendingPlans]),Te(()=>{!_e.current||!Y||Y.planId!==_e.current||n.annotations.filter(I=>I.planId===Y.planId&&I.type!=="text").length===0||(_e.current=null,Ve())},[Y,n.annotations,Ve]),Te(()=>{for(let h of r.planReviews)!Y||Y.planId!==h.planId||h.verdict==="pass"&&gt(I=>I?y(m({},I),{status:"done"}):null)},[r.planReviews,Y]);let en=tn(new Set);Te(()=>{!Y||Y.status!=="executing"||en.current.has(Y.planId)||Object.entries(ht).filter(([L,z])=>z.planId===Y.planId).length>0||n.annotations.filter(L=>L.planId===Y.planId&&(L.status==="resolved"||L.status==="needs_review")).length===0||(en.current.add(Y.planId),(async()=>{try{gt(z=>z?y(m({},z),{status:"reviewing"}):null);let L=await ii(document.body);if(!L)return;await Cs(Y.planId,L,o,a,P.id)}catch(L){console.error("[Pare] Failed to trigger review:",L)}})())},[Y,ht,n.annotations,o,a,P.id]);let $e=Co(()=>{if(r.activeJobId&&r.activeJobId in ht)return ht[r.activeJobId].color;let h=Object.values(ht);return h.length>0?h[h.length-1].color:void 0},[r.activeJobId,ht]),we=Pe(h=>{ot(h)},[]);Te(()=>{n.activeTool==="model"&&lt&&ot(null)},[n.activeTool]);let Z=tn(null);Te(()=>{n.isAnnotating?Z.current&&(ot(Z.current),Z.current=null):lt&&(Z.current=lt,ot(null))},[n.isAnnotating]);let Lt=Co(()=>{if(!lt)return null;for(let[h,I]of Object.entries(ht))if(I.threadId===lt)return h;return null},[lt,ht]),[qt,me]=Ue(!1),[ke,ce]=Ue(0),te=tn(null),nn=Pe(h=>{h?(te.current&&(clearTimeout(te.current),te.current=null),me(!0)):te.current=setTimeout(()=>{me(!1),te.current=null},150)},[]),on=Pe(()=>{ce(h=>h+1),r.clearEvents()},[r.clearEvents]);Te(()=>()=>{te.current&&clearTimeout(te.current)},[]);let kn=Co(()=>({isEnabled:e}),[e]);return e?Lp(cl.Provider,{value:kn,children:[t,zo(Ya,{state:n,dispatch:i,onScreenshot:re,inFlightAnnotationIds:W,inFlightStyleSelectors:rt,inFlightSelectorColors:ct,onAttachImages:ze,onReply:r.isConnected?fe:void 0,onViewThread:r.isConnected?we:void 0,activePlan:Y,onModelComponentsAdd:r.isConnected?bt:void 0,onModelComponentFocus:r.isConnected?Dt:void 0,onModelComponentHover:O,modelComponentNames:C,modelPanelHoveredComponent:tt,modelSpacingTokenHover:vt}),zo(el,{state:n,dispatch:i,onScreenshot:re,onSendToClaude:r.isConnected?Ut:void 0,onPlanGoal:r.isConnected?Me:void 0,hasActiveJobs:Object.keys(ht).length>0||r.activeJobIds.length>0,activeJobColor:$e,onCrosshairHover:nn,onClear:on,provider:a,onProviderChange:r.isConnected&&u.length>1?B:void 0,availableProviders:u,modelIndex:c,modelCount:b.length,modelLabel:P.label,onModelChange:r.isConnected?A:void 0,onViewThread:r.isConnected?we:void 0,isThreadPanelOpen:lt!==null,activePlan:Y,mcpStatus:f,onInstallMcp:r.isConnected?M:void 0,mcpJustInstalled:x,bridgeUrl:o,modelSelectedComponent:j,modelCanvasHoveredComponent:U,onModelComponentHover:et,onSpacingTokenHover:dt,onModifySpacingToken:r.isConnected?V:void 0,onDeleteSpacingToken:r.isConnected?St:void 0,modelRefreshKey:Pt,onModelComponentAdded:Ot,onModelComponentRemoved:At}),lt&&r.isConnected&&zo(ll,{threadId:lt,bridgeUrl:o,accentColor:(it=(X=n.annotations.find(h=>h.threadId===lt))==null?void 0:X.color)!=null?it:n.activeColor,isStreaming:Lt!==null,streamingEvents:Lt?r.events.filter(h=>h.data.jobId===Lt):[],onClose:()=>ot(null),onReply:fe,activePlan:Y,planAnnotations:Y?n.annotations.filter(h=>h.planId===Y.planId&&h.type!=="text"):void 0,inFlightJobs:ht,onViewThread:we,onApprovePlan:(Y==null?void 0:Y.status)==="awaiting_approval"?Ve:void 0,onDismissPlan:(Y==null?void 0:Y.status)==="awaiting_approval"?ge:void 0}),r.isConnected&&zo(ol,{bridge:r,bridgeUrl:o,inFlightJobs:ht,isVisible:qt||r.lastResponseText!==null||r.activeJobIds.length>0,onHover:nn,clearSignal:ke,onReply:fe,onViewThread:we})]}):zo(Ip,{children:t})}function Mp(){let t=kp(cl);if(!t)throw new Error("usePopmelt must be used within PopmeltProvider");return t}export{Tp as PopmeltProvider,Mp as usePopmelt};