@popmelt.com/core 0.4.0 → 0.5.1

package/dist/index.mjs

@@ -1,21 +1,21 @@
 "use client";
-var Aa=Object.defineProperty,Pa=Object.defineProperties;var Na=Object.getOwnPropertyDescriptors;var xo=Object.getOwnPropertySymbols;var Nr=Object.prototype.hasOwnProperty,Br=Object.prototype.propertyIsEnumerable;var Pr=(t,e,o)=>e in t?Aa(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,m=(t,e)=>{for(var o in e||(e={}))Nr.call(e,o)&&Pr(t,o,e[o]);if(xo)for(var o of xo(e))Br.call(e,o)&&Pr(t,o,e[o]);return t},x=(t,e)=>Pa(t,Na(e));var vo=t=>typeof t=="symbol"?t:t+"",So=(t,e)=>{var o={};for(var n in t)Nr.call(t,n)&&e.indexOf(n)<0&&(o[n]=t[n]);if(t!=null&&xo)for(var n of xo(t))e.indexOf(n)<0&&Br.call(t,n)&&(o[n]=t[n]);return o};import{createContext as wu,useCallback as Pe,useContext as ku,useEffect as Oe,useMemo as qn,useRef as en,useState as je}from"react";import{useCallback as ko,useEffect as Ba,useRef as Vr,useState as Oa}from"react";var tn="http://localhost:1111";async function Or(t=tn){try{let e=await fetch(`${t}/capabilities`);return e.ok?await e.json():null}catch(e){return null}}async function wo(t=tn){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 Fr(t,e,o=tn,n,i,r,a){let s=new FormData;if(s.append("screenshot",t,"screenshot.png"),s.append("feedback",e),n&&s.append("color",n),i&&s.append("provider",i),r&&s.append("model",r),a)for(let[c,d]of a)for(let u=0;u<d.length;u++)s.append(`image-${c}-${u}`,d[u],`image-${c}-${u}.png`);let l=await fetch(`${o}/send`,{method:"POST",body:s});if(!l.ok){let c=await l.text();throw new Error(`Bridge returned ${l.status}: ${c}`)}return l.json()}async function Dr(t,e,o=tn,n,i,r,a,s,l){let c=new FormData;c.append("screenshot",t,"screenshot.png"),c.append("goal",e),r&&c.append("pageUrl",r),a&&c.append("viewport",JSON.stringify(a)),n&&c.append("provider",n),i&&c.append("model",i),s&&c.append("manifest",JSON.stringify(s)),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 Hr(t,e=tn,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 zr(t,e,o=tn,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 a=await fetch(`${o}/plan/review`,{method:"POST",body:r});if(!a.ok){let s=await a.text();throw new Error(`Bridge returned ${a.status}: ${s}`)}return a.json()}async function _r(t,e,o,n=tn,i,r){let a=new FormData;a.append("screenshot",t,"screenshot.png"),a.append("planId",e),a.append("tasks",JSON.stringify(o)),i&&a.append("provider",i),r&&a.append("model",r);let s=await fetch(`${n}/plan/execute`,{method:"POST",body:a});if(!s.ok){let l=await s.text();throw new Error(`Bridge returned ${s.status}: ${l}`)}return s.json()}async function $r(t=tn,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 Wr(t,e=tn){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 Yr(t,e=tn){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 Zo(t,e,o=tn){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 jr(t,e=tn){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 zn(t=tn){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 Gr(t,e,o=tn,n,i,r,a){let s;if(a&&a.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<a.length;d++)l.append(`image-reply-${d}`,a[d],`reply-image-${d}.png`);s=await fetch(`${o}/reply`,{method:"POST",body:l})}else s=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(!s.ok){let l=await s.text();throw new Error(`Bridge returned ${s.status}: ${l}`)}return s.json()}function Jr(t="http://localhost:1111"){let[e,o]=Oa({isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,pendingQuestions:[],pendingPlans:[],planReviews:[],incrementalResolutions:[]}),n=Vr(null),i=Vr(null),r=ko(()=>{n.current&&(n.current.close(),n.current=null);let c=new EventSource(`${t}/events`);n.current=c,c.addEventListener("connected",()=>{wo(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=>x(m({},g),{isConnected:!0,status:p?"streaming":"idle",activeJobId:p?u[u.length-1].id:g.activeJobId,activeJobIds:u.map(b=>b.id)}))})}),c.addEventListener("job_started",d=>{let u=JSON.parse(d.data),p=u.jobId;o(f=>x(m({},f),{status:"streaming",activeJobId:p,activeJobIds:[...f.activeJobIds,p],jobResponses:x(m({},f.jobResponses),{[p]:""}),jobThinking:x(m({},f.jobThinking),{[p]:""}),currentResponse:"",currentThinking:"",lastResponseText:null,lastThreadId:null,events:[...f.events,{type:"job_started",data:u,timestamp:Date.now()}]}))}),c.addEventListener("delta",d=>{let u=JSON.parse(d.data),p=u.jobId,f=u.text||"";o(g=>x(m({},g),{jobResponses:p?x(m({},g.jobResponses),{[p]:(g.jobResponses[p]||"")+f}):g.jobResponses,currentResponse:!p||p===g.activeJobId?g.currentResponse+f:g.currentResponse}))}),c.addEventListener("thinking",d=>{let u=JSON.parse(d.data),p=u.jobId,f=u.text||"";o(g=>x(m({},g),{jobThinking:p?x(m({},g.jobThinking),{[p]:(g.jobThinking[p]||"")+f}):g.jobThinking,currentThinking:!p||p===g.activeJobId?g.currentThinking+f:g.currentThinking}))}),c.addEventListener("tool_use",d=>{let u=JSON.parse(d.data);o(p=>x(m({},p),{events:[...p.events,{type:"tool_use",data:u,timestamp:Date.now()}]}))}),c.addEventListener("done",d=>{let u=JSON.parse(d.data),p=u.jobId;o(f=>{var P;let g=p?f.activeJobIds.filter(I=>I!==p):f.activeJobIds,b=m({},f.jobResponses),k=m({},f.jobThinking),w=p?b[p]:void 0;p&&(delete b[p],delete k[p]);let M=p===f.activeJobId?g.length>0?g[g.length-1]:null:f.activeJobId;return x(m(x(m({},f),{activeJobIds:g,activeJobId:M,jobResponses:b,jobThinking:k,lastCompletedJobId:p!=null?p:f.activeJobId,lastResponseText:w||f.currentResponse||u.responseText||null,lastThreadId:(P=u.threadId)!=null?P:null}),p===f.activeJobId?{currentResponse:M&&b[M]||"",currentThinking:M&&k[M]||""}:{}),{events:[...f.events,{type:"done",data:u,timestamp:Date.now()}]})})}),c.addEventListener("question",d=>{let u=JSON.parse(d.data);o(p=>x(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()}]}))}),c.addEventListener("plan_ready",d=>{let u=JSON.parse(d.data);o(p=>x(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()}]}))}),c.addEventListener("plan_review",d=>{let u=JSON.parse(d.data);o(p=>x(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()}]}))}),c.addEventListener("task_resolved",d=>{var f;let u=JSON.parse(d.data),p=(f=u.resolutions)!=null?f:[];o(g=>x(m({},g),{incrementalResolutions:[...g.incrementalResolutions,...p],events:[...g.events,{type:"task_resolved",data:u,timestamp:Date.now()}]}))}),c.addEventListener("queue_drained",()=>{o(d=>x(m({},d),{status:d.status==="error"?"error":"idle",activeJobId:null,activeJobIds:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},incrementalResolutions:[]}))}),c.addEventListener("error",d=>{var u;if(c.readyState===EventSource.CLOSED)o(p=>x(m({},p),{isConnected:!1,status:"disconnected"})),i.current=setTimeout(()=>{wo(t).then(p=>{p&&r()})},5e3);else if(d instanceof MessageEvent){let p=JSON.parse(d.data),f=(u=p.jobId)!=null?u:null;o(g=>{let b=f?g.activeJobIds.filter(w=>w!==f):g.activeJobIds,k=b.length>0?g.status:"error";return x(m({},g),{status:k,activeJobIds:b,lastCompletedJobId:f!=null?f:g.activeJobId,events:[...g.events,{type:"error",data:p,timestamp:Date.now()}]})})}}),c.onerror=()=>{c.readyState===EventSource.CLOSED&&o(d=>x(m({},d),{isConnected:!1,status:"disconnected"}))}},[t]);Ba(()=>(wo(t).then(c=>{c&&r()}),()=>{n.current&&(n.current.close(),n.current=null),i.current&&clearTimeout(i.current)}),[t,r]);let a=ko(()=>{o(c=>x(m({},c),{events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,incrementalResolutions:[]}))},[]),s=ko(c=>{o(d=>x(m({},d),{pendingQuestions:d.pendingQuestions.filter(u=>u.threadId!==c)}))},[]),l=ko(c=>{o(d=>x(m({},d),{pendingPlans:d.pendingPlans.filter(u=>u.planId!==c)}))},[]);return x(m({},e),{clearEvents:a,dismissQuestion:s,dismissPlan:l})}import{useEffect as Fa,useReducer as Da}from"react";var Ha={isAnnotating:!1,activeTool:"inspector",activeColor:"#ff0000",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function _n(){return Math.random().toString(36).substring(2,9)}function Xr(t){return t.status?t:t.captured?x(m({},t),{status:"in_flight"}):x(m({},t),{status:"pending"})}function Xe(t){return x(m({},t),{undoStack:[...t.undoStack,{annotations:t.annotations,styleModifications:t.styleModifications,spacingTokenMods:t.spacingTokenMods}],redoStack:[]})}function za(t,e){return x(m({},t),{isAnnotating:e})}function _a(t,e){return x(m({},t),{activeTool:e,inspectedElement:null})}function $a(t,e){return x(m({},t),{activeColor:e})}function Wa(t,e){return x(m({},t),{strokeWidth:e})}function Ya(t,e){return x(m({},t),{currentPath:[e]})}function ja(t,e){return x(m({},t),{currentPath:[...t.currentPath,e]})}function Ga(t){return x(m({},t),{currentPath:[]})}function Va(t,e){if(t.currentPath.length<2&&t.activeTool!=="text")return x(m({},t),{currentPath:[]});let o={id:_n(),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=Xe(t);return x(m({},n),{annotations:[...t.annotations,o],currentPath:[]})}function Ja(t,e){var i;let o=m({id:(i=e.id)!=null?i:_n(),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:Xe(t);return x(m({},n),{annotations:[...t.annotations,o]})}function Xa(t,e){let o=Xe(t);return x(m({},o),{annotations:t.annotations.map(n=>n.id===e.id?m(x(m({},n),{text:e.text}),e.imageCount!=null?{imageCount:e.imageCount}:{}):n)})}function Ka(t,e){return x(m({},t),{annotations:t.annotations.map(o=>o.id===e.id?x(m({},o),{fontSize:Math.max(12,Math.min(72,e.fontSize))}):o)})}function Ua(t,e){let o=Xe(t),n=t.annotations.find(r=>r.id===e.id),i=n==null?void 0:n.groupId;return x(m({},o),{annotations:t.annotations.filter(r=>r.id!==e.id&&!(i&&r.groupId===i))})}function Za(t,e){let o=e.saveUndo?Xe(t):t,n=t.annotations.find(r=>r.id===e.id),i=n==null?void 0:n.groupId;return x(m({},o),{annotations:t.annotations.map(r=>{if(!(r.id===e.id||i&&r.groupId===i))return r;let s=e.delta.x,l=e.delta.y;return x(m({},r),{points:r.points.map(c=>({x:c.x+s,y:c.y+l}))})})})}function qa(t,e){let o=e.saveUndo?Xe(t):t,n=t.annotations.find(a=>a.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 a=e.points,s=Math.min(a[0].x,a[1].x),l=Math.max(a[0].y,a[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=s-u,r=l-p}return x(m({},o),{annotations:t.annotations.map(a=>a.id===e.id?x(m({},a),{points:e.points}):n.groupId&&a.groupId===n.groupId&&a.type==="text"?x(m({},a),{points:a.points.map(s=>({x:s.x+i,y:s.y+r}))}):a)})}function Qa(t,e){let o=Xe(t);return x(m({},o),{annotations:[...t.annotations,...e.annotations.map(Xr)]})}function tl(t,e){let o=new Set,n=[];for(let i of e.annotations)o.has(i.id)||(o.add(i.id),n.push(Xr(i)));return x(m({},t),{annotations:n})}function el(t){if(t.undoStack.length===0)return t;let e=t.undoStack[t.undoStack.length-1];return x(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 nl(t){if(t.redoStack.length===0)return t;let e=t.redoStack[t.redoStack.length-1];return x(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 ol(t,e){let{id:o,addToSelection:n}=e;if(o===null)return x(m({},t),{selectedAnnotationIds:[],lastSelectedId:null});if(n)if(t.selectedAnnotationIds.includes(o)){let r=t.selectedAnnotationIds.filter(a=>a!==o);return x(m({},t),{selectedAnnotationIds:r,lastSelectedId:r.length>0?r[r.length-1]:null})}else return x(m({},t),{selectedAnnotationIds:[...t.selectedAnnotationIds,o],lastSelectedId:o});return x(m({},t),{selectedAnnotationIds:[o],lastSelectedId:o})}function il(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 x(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:x(m({},n),{color:e.color})})})}function rl(t){return x(m({},t),{annotations:t.annotations.map(e=>x(m({},e),{captured:!0,status:e.status==="pending"||!e.status?"in_flight":e.status})),styleModifications:t.styleModifications.map(e=>x(m({},e),{captured:!0})),spacingTokenChanges:t.spacingTokenChanges.map(e=>x(m({},e),{captured:!0}))})}function sl(t){return x(m({},t),{annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]})}function al(t,e){return x(m({},t),{inspectedElement:e})}function ll(t,e){let{selector:o,element:n,property:i,original:r,modified:a}=e,s=t.styleModifications.findIndex(l=>l.selector===o);if(r===a&&s<0)return t;if(s>=0){let l=t.styleModifications[s];if(l.captured){let f=Xe(t),g=f.styleModifications.map((b,k)=>k===s?x(m({},b),{changes:[{property:i,original:r,modified:a}],captured:!1}):b);return x(m({},f),{styleModifications:g})}let c=l.changes.findIndex(f=>f.property===i),d,u=t;if(c>=0){let f=l.changes[c];a===f.original?d=l.changes.filter((g,b)=>b!==c):d=l.changes.map((g,b)=>b===c?x(m({},g),{modified:a}):g)}else{if(r===a)return t;u=Xe(t),d=[...l.changes,{property:i,original:r,modified:a}]}if(d.length===0)return x(m({},u),{styleModifications:u.styleModifications.filter((f,g)=>g!==s)});let p=u.styleModifications.map((f,g)=>g===s?x(m({},f),{changes:d}):f);return x(m({},u),{styleModifications:p})}else{let l=Xe(t),c={selector:o,element:n,changes:[{property:i,original:r,modified:a}]};return x(m({},l),{styleModifications:[...l.styleModifications,c]})}}function cl(t,e){let{selector:o,durableSelector:n,element:i,changes:r}=e,a=r.filter(c=>c.original!==c.modified);if(a.length===0)return t;let s=Xe(t),l=s.styleModifications.findIndex(c=>c.selector===o);if(l>=0){let c=s.styleModifications[l],d=c.captured?[]:[...c.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?x(m({},f),{modified:u.modified}):f):d.push(u)}return d.length===0?x(m({},s),{styleModifications:s.styleModifications.filter((u,p)=>p!==l)}):x(m({},s),{styleModifications:s.styleModifications.map((u,p)=>p===l?x(m({},u),{changes:d,captured:!1}):u)})}else return x(m({},s),{styleModifications:[...s.styleModifications,{selector:o,durableSelector:n,element:i,changes:a}]})}function dl(t,e){let{selector:o,property:n}=e,i=Xe(t),r=i.styleModifications.map(a=>a.selector!==o?a:x(m({},a),{changes:a.changes.filter(s=>s.property!==n)})).filter(a=>a.changes.length>0);return x(m({},i),{styleModifications:r})}function ul(t){if(t.styleModifications.length===0)return x(m({},t),{inspectedElement:null});let e=Xe(t);return x(m({},e),{styleModifications:[],inspectedElement:null})}function pl(t,e){return x(m({},t),{styleModifications:e})}function fl(t,e){let{updates:o}=e,n=new Map(o.map(i=>[i.id,i]));return x(m({},t),{annotations:t.annotations.map(i=>{let r=n.get(i.id);return r?m(x(m({},i),{points:[r.point,...i.points.slice(1)]}),r.linkedAnchor?{linkedAnchor:r.linkedAnchor}:{}):i})})}function gl(t,e){let o=new Set(e.ids);return x(m({},t),{annotations:t.annotations.map(n=>o.has(n.id)?x(m({},n),{status:e.status}):n)})}function ml(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 x(m({},t),{annotations:t.annotations.map(i=>o.has(i.id)||i.groupId&&n.has(i.groupId)?x(m({},i),{threadId:e.threadId}):i)})}function hl(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 x(m({},t),{annotations:t.annotations.map(i=>o.has(i.id)||i.groupId&&n.has(i.groupId)?x(m({},i),{status:"waiting_input",question:e.question,threadId:e.threadId}):i)})}function yl(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 x(m({},t),{annotations:t.annotations.map(i=>{var a,s,l;let r=o.get(i.id)||(i.groupId?n.get(i.groupId):void 0);return r?x(m({},i),{status:r.status,resolutionSummary:r.summary,scope:(s=(a=r.finalScope)!=null?a:r.inferredScope)!=null?s:null,replyCount:((l=i.replyCount)!=null?l:0)+1,question:void 0,threadId:i.threadId||e.threadId}):i})})}function bl(t,e){let{groupId:o,planId:n,planTaskId:i,instruction:r,region:a,color:s,linkedSelector:l,elements:c}=e,d=r.length>60?r.slice(0,60).replace(/\s+\S*$/,"")+"\u2026":r,u={id:_n(),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:l,elements:c,planId:n,planTaskId:i,status:"pending"},p={id:_n(),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:l,elements:c,planId:n,planTaskId:i};return x(m({},t),{annotations:[...t.annotations,u,p]})}function xl(t,e){let{linkedSelectors:o,styleSelectors:n}=e,i=new Set(o),r=new Set(n),a=new Set,s=new Set;for(let p of t.annotations)p.linkedSelector&&i.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 l=t.annotations.filter(p=>!a.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=>!a.has(p)),u=t.inspectedElement&&r.has(t.inspectedElement.info.selector)?null:t.inspectedElement;return x(m({},t),{annotations:l,styleModifications:c,selectedAnnotationIds:d,lastSelectedId:d.length>0?d[d.length-1]:null,inspectedElement:u})}function vl(t,e){let o=t.spacingTokenChanges.findIndex(n=>n.tokenPath===e.tokenPath);return o>=0?x(m({},t),{spacingTokenChanges:t.spacingTokenChanges.map((n,i)=>i===o?e:n)}):x(m({},t),{spacingTokenChanges:[...t.spacingTokenChanges,e]})}function Sl(t,e){return x(m({},t),{spacingTokenChanges:e})}function wl(t,e){let o=Xe(t),n=t.spacingTokenMods.findIndex(r=>r.tokenPath===e.tokenPath),i;if(n>=0){let r=t.spacingTokenMods[n],a=x(m({},e),{originalValue:r.originalValue,originalPx:r.originalPx});i=t.spacingTokenMods.map((s,l)=>l===n?a:s)}else i=[...t.spacingTokenMods,e];return x(m({},o),{spacingTokenMods:i})}function kl(t,e){let o=Xe(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,a={tokenPath:e.tokenPath,originalValue:i,currentValue:"__deleted__",targets:n>=0?t.spacingTokenMods[n].targets:[],originalPx:r,currentPx:0},s;return n>=0?s=t.spacingTokenMods.map((l,c)=>c===n?a:l):s=[...t.spacingTokenMods,a],x(m({},o),{spacingTokenMods:s})}var Cl={SET_ANNOTATING:za,SET_TOOL:_a,SET_COLOR:$a,SET_STROKE_WIDTH:Wa,START_PATH:Ya,CONTINUE_PATH:ja,CANCEL_PATH:Ga,FINISH_PATH:Va,ADD_TEXT:Ja,UPDATE_TEXT:Xa,UPDATE_TEXT_SIZE:Ka,DELETE_ANNOTATION:Ua,MOVE_ANNOTATION:Za,RESIZE_ANNOTATION:qa,PASTE_ANNOTATIONS:Qa,RESTORE_ANNOTATIONS:tl,UNDO:el,REDO:nl,SELECT_ANNOTATION:ol,UPDATE_ANNOTATION_COLOR:il,MARK_CAPTURED:rl,CLEAR:sl,SELECT_ELEMENT:al,MODIFY_STYLE:ll,MODIFY_STYLES_BATCH:cl,CLEAR_STYLE:dl,CLEAR_ALL_STYLES:ul,RESTORE_STYLE_MODIFICATIONS:pl,UPDATE_LINKED_POSITIONS:fl,CLEANUP_ORPHANED:xl,SET_ANNOTATION_STATUS:gl,SET_ANNOTATION_THREAD:ml,SET_ANNOTATION_QUESTION:hl,APPLY_RESOLUTIONS:yl,ADD_PLAN_ANNOTATION:bl,ADD_SPACING_TOKEN_CHANGE:vl,RESTORE_SPACING_TOKEN_CHANGES:Sl,MODIFY_SPACING_TOKEN:wl,DELETE_SPACING_TOKEN:kl};function El(t,e){let o=Cl[e.type];return o?o(t,e.payload):t}function Kr(){let[t,e]=Da(El,Ha);return Fa(()=>{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 eo(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 Tl(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 _e(t){let e={selector:Tl(t),tagName:t.tagName.toLowerCase()};t.id&&(e.id=t.id),t.classList.length>0&&(e.className=Array.from(t.classList).join(" "));let o=no(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 i=eo(t);i&&(e.reactComponent=i.name);let r=Ml(t);return r&&(e.context=r),e}function no(t){let e="";for(let o of t.childNodes)o.nodeType===Node.TEXT_NODE&&(e+=o.textContent||"");return e.trim()}function Tn(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 Ml(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 Zr(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 a of r){let s=a.x-n,l=a.y-i;if(s<0||l<0||s>window.innerWidth||l>window.innerHeight)continue;let c=Tn(s,l);c&&!e.has(c)&&(e.add(c),o.push(_e(c)))}return o.slice(0,3)}function Qo(t){if(t.length===0)return[];let e=t.map(n=>n.x),o=t.map(n=>n.y);return Zr({minX:Math.min(...e),minY:Math.min(...o),maxX:Math.max(...e),maxY:Math.max(...o)})}function qr(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 qo(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 Co(t,e=0){var l;let o=qr(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)),a=o[r],s=(l=qo(a.fiber))!=null?l:t;return{name:a.name,path:n,depthIndex:r,rootElement:s}}function Qr(t,e){var r,a;let o=qr(t),n=e.toLowerCase(),i=-1;for(let s=o.length-1;s>=0;s--){let l=o[s].name;if(l===e){let c=(r=qo(o[s].fiber))!=null?r:t;return{name:e,path:o.map(d=>d.name),depthIndex:s,rootElement:c}}if(i===-1){let c=l.toLowerCase();(c.length>=4&&n.includes(c)||n.length>=4&&c.includes(n))&&(i=s)}}if(i>=0){let s=(a=qo(o[i].fiber))!=null?a:t;return{name:e,path:o.map(l=>l.name),depthIndex:i,rootElement:s}}return null}function $n(t){let e=oo(),o=[],n=new Set,i=e.currentNode;for(;i=e.nextNode();){let r=Qr(i,t);r&&!n.has(r.rootElement)&&(n.add(r.rootElement),o.push(r))}return o}function ti(t){let e=new Map;if(t.size===0)return e;let o=new Set(t),n=oo(),i=new Set,r=n.currentNode;for(;(r=n.nextNode())&&o.size>0;)for(let a of o){let s=Qr(r,a);if(!s||i.has(s.rootElement))continue;i.add(s.rootElement);let l=s.rootElement.getBoundingClientRect();e.set(a,l.top+window.scrollY),o.delete(a);break}for(let a of o)e.set(a,1/0);return e}function oo(){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 Le(t,e){return t.style.getPropertyValue(e)!==""}function Il(t,e=30){if(t<=0)return[];let o=[],n=oo(),i=.5,r=n.currentNode;for(;(r=n.nextNode())&&o.length<e;){let a=r,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 l=getComputedStyle(a);!Le(a,"padding-top")&&Math.abs((parseFloat(l.paddingTop)||0)-t)<i&&o.push({element:a,property:"padding-top"}),!Le(a,"padding-bottom")&&Math.abs((parseFloat(l.paddingBottom)||0)-t)<i&&o.length<e&&o.push({element:a,property:"padding-bottom"}),!Le(a,"padding-left")&&Math.abs((parseFloat(l.paddingLeft)||0)-t)<i&&o.length<e&&o.push({element:a,property:"padding-left"}),!Le(a,"padding-right")&&Math.abs((parseFloat(l.paddingRight)||0)-t)<i&&o.length<e&&o.push({element:a,property:"padding-right"}),!Le(a,"margin-top")&&Math.abs((parseFloat(l.marginTop)||0)-t)<i&&o.length<e&&o.push({element:a,property:"margin-top"}),!Le(a,"margin-bottom")&&Math.abs((parseFloat(l.marginBottom)||0)-t)<i&&o.length<e&&o.push({element:a,property:"margin-bottom"}),!Le(a,"margin-left")&&Math.abs((parseFloat(l.marginLeft)||0)-t)<i&&o.length<e&&o.push({element:a,property:"margin-left"}),!Le(a,"margin-right")&&Math.abs((parseFloat(l.marginRight)||0)-t)<i&&o.length<e&&o.push({element:a,property:"margin-right"});let c=l.display;if((c.includes("flex")||c.includes("grid"))&&o.length<e){let d=Le(a,"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:a,property:"gap"}):!Le(a,"row-gap")&&Math.abs(p-t)<i?o.push({element:a,property:"row-gap"}):!Le(a,"column-gap")&&Math.abs(f-t)<i&&o.push({element:a,property:"column-gap"})}}return o}function ei(t,e=30){if(t<=0)return[];let o=[],n=oo(),i=.5,r=n.currentNode;for(;(r=n.nextNode())&&o.length<e;){let a=r,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 l=getComputedStyle(a),c=parseFloat(l.borderTopWidth)||0,d=parseFloat(l.borderRightWidth)||0,u=parseFloat(l.borderBottomWidth)||0,p=parseFloat(l.borderLeftWidth)||0,f=a.clientWidth,g=a.clientHeight,b=parseFloat(l.paddingTop)||0;!Le(a,"padding-top")&&Math.abs(b-t)<i&&o.push({x:s.left+p,y:s.top+c,width:f,height:t,direction:"vertical",property:"padding-top"});let k=parseFloat(l.paddingBottom)||0;!Le(a,"padding-bottom")&&Math.abs(k-t)<i&&o.length<e&&o.push({x:s.left+p,y:s.top+c+g-t,width:f,height:t,direction:"vertical",property:"padding-bottom"});let w=parseFloat(l.paddingLeft)||0;!Le(a,"padding-left")&&Math.abs(w-t)<i&&o.length<e&&o.push({x:s.left+p,y:s.top+c,width:t,height:g,direction:"horizontal",property:"padding-left"});let M=parseFloat(l.paddingRight)||0;!Le(a,"padding-right")&&Math.abs(M-t)<i&&o.length<e&&o.push({x:s.left+p+f-t,y:s.top+c,width:t,height:g,direction:"horizontal",property:"padding-right"});let P=parseFloat(l.marginTop)||0;!Le(a,"margin-top")&&Math.abs(P-t)<i&&o.length<e&&o.push({x:s.left,y:s.top-t,width:s.width,height:t,direction:"vertical",property:"margin-top"});let I=parseFloat(l.marginBottom)||0;!Le(a,"margin-bottom")&&Math.abs(I-t)<i&&o.length<e&&o.push({x:s.left,y:s.bottom,width:s.width,height:t,direction:"vertical",property:"margin-bottom"});let h=parseFloat(l.marginLeft)||0;!Le(a,"margin-left")&&Math.abs(h-t)<i&&o.length<e&&o.push({x:s.left-t,y:s.top,width:t,height:s.height,direction:"horizontal",property:"margin-left"});let W=parseFloat(l.marginRight)||0;!Le(a,"margin-right")&&Math.abs(W-t)<i&&o.length<e&&o.push({x:s.right,y:s.top,width:t,height:s.height,direction:"horizontal",property:"margin-right"});let it=l.display;if((it.includes("flex")||it.includes("grid"))&&o.length<e&&!Le(a,"gap")){let K=Array.from(a.children).filter(q=>{let O=getComputedStyle(q);return O.display!=="none"&&O.position!=="absolute"&&O.position!=="fixed"});if(K.length>=2)for(let q=0;q<K.length-1&&o.length<e;q++){let O=K[q].getBoundingClientRect(),Q=K[q+1].getBoundingClientRect(),U=Q.top-O.bottom;Math.abs(U-t)<i&&U>.5&&o.push({x:Math.min(O.left,Q.left),y:O.bottom,width:Math.max(O.right,Q.right)-Math.min(O.left,Q.left),height:U,direction:"vertical",property:"gap"});let Mt=Q.left-O.right;Math.abs(Mt-t)<i&&Mt>.5&&o.push({x:O.right,y:Math.min(O.top,Q.top),width:Mt,height:Math.max(O.bottom,Q.bottom)-Math.min(O.top,Q.top),direction:"horizontal",property:"gap"})}}}return o}function rn(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(a=>!a.startsWith("_")&&a.length<30).slice(0,2);i.length>0&&(n+="."+i.map(a=>CSS.escape(a)).join("."));let r=o.parentElement;if(r){let a=Array.from(r.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=r}return e.join(" > ")}function Eo(t){return typeof t=="string"?{value:t}:t}var ts={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 Ur(t,e){let o=ts[e];return o?o.includes(t):!1}function Ll(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 Rl(t){var s,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"},a=o.slice(0,o.indexOf("-",n+1)>0?o.indexOf("-",n+1):n);return(l=(s=r[a])!=null?s:r[i])!=null?l:null}function ni(t,e=30){let o=parseFloat(t.value);if(isNaN(o)||o<=0)return[];if(t.bindings&&t.bindings.length>0){let i=[],r=oo(),a=r.currentNode;for(;(a=r.nextNode())&&i.length<e;){let s=a,l=s.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let c=s.className;if(typeof c=="string")for(let d of t.bindings){if(!Ll(c,d))continue;let u=Rl(d);if(u&&!(t.property&&!Ur(u,t.property))){i.push({element:s,property:u});break}}}return i}let n=Il(o,e*2);return t.property?n.filter(i=>Ur(i.property,t.property)).slice(0,e):n.slice(0,e)}function oi(t,e=30){let o=ni(t,e),n=[];for(let i of o){let r=i.element,a=r.getBoundingClientRect(),s=getComputedStyle(r),l=parseFloat(s.borderTopWidth)||0,c=parseFloat(s.borderRightWidth)||0,d=parseFloat(s.borderLeftWidth)||0,u=r.clientWidth,p=r.clientHeight;switch(i.property){case"padding-top":{let f=parseFloat(s.paddingTop)||0;n.push({x:a.left+d,y:a.top+l,width:u,height:f,direction:"vertical",property:i.property});break}case"padding-bottom":{let f=parseFloat(s.paddingBottom)||0;n.push({x:a.left+d,y:a.top+l+p-f,width:u,height:f,direction:"vertical",property:i.property});break}case"padding-left":{let f=parseFloat(s.paddingLeft)||0;n.push({x:a.left+d,y:a.top+l,width:f,height:p,direction:"horizontal",property:i.property});break}case"padding-right":{let f=parseFloat(s.paddingRight)||0;n.push({x:a.left+d+u-f,y:a.top+l,width:f,height:p,direction:"horizontal",property:i.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:i.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:i.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:i.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:i.property});break}case"gap":case"row-gap":case"column-gap":{let f=Array.from(r.children).filter(g=>{let b=getComputedStyle(g);return b.display!=="none"&&b.position!=="absolute"&&b.position!=="fixed"});for(let g=0;g<f.length-1&&n.length<e;g++){let b=f[g].getBoundingClientRect(),k=f[g+1].getBoundingClientRect(),w=k.top-b.bottom;w>.5&&n.push({x:Math.min(b.left,k.left),y:b.bottom,width:Math.max(b.right,k.right)-Math.min(b.left,k.left),height:w,direction:"vertical",property:"gap"});let M=k.left-b.right;M>.5&&n.push({x:b.right,y:Math.min(b.top,k.top),width:M,height:Math.max(b.bottom,k.bottom)-Math.min(b.top,k.top),direction:"horizontal",property:"gap"})}break}}}return n}function es(t,e){let o=new Set,n=to(e);for(let i of t){let r=os[i.property];if(!r)continue;let a=i.element.className;if(typeof a=="string")for(let s of r){let l=`${s}-${n}`;for(let c of a.split(/\s+/)){let d=c.lastIndexOf(":"),u=d>=0?c.slice(d+1):c;if(u===l){o.add(u);break}}}}return[...o]}function ns(t){let e=new Set;for(let o of t)for(let[n,i]of Object.entries(ts))if(i.includes(o.property)){e.add(n);break}if(e.size===1)return[...e][0]}function ii(t,e,o){if(e===o)return t;let n=to(e),i=to(o);return t.map(r=>{let a=r.lastIndexOf("-");if(a<0)return r;let s=r.slice(0,a),l=r.slice(a+1);return l===n||l===`[${e}px]`?`${s}-${i}`:r})}var Al={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 to(t){var e;return(e=Al[t])!=null?e:`[${t}px]`}var os={"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 Pl(t,e,o,n){let i=os[e];if(!i)return null;let r=to(o);for(let a of i){let s=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+a+"-(?:"+Nl(r)+"|\\["+o+"px\\]))(?:\\s|$)"),l=t.match(s);if(l!=null&&l[1]){let c=to(n),d=l[1].lastIndexOf(":"),u=d>=0?l[1].slice(0,d+1):"";return{matched:l[1],suggested:`${u}${a}-${c}`}}}return null}function Nl(t){return t.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function is(t,e,o){let n=new Set,i=[];for(let r of t){let a=rn(r.element),s=`${a}::${r.property}`;if(n.has(s))continue;n.add(s);let l=eo(r.element),c=r.element.className||"",d=Pl(c,r.property,e,o);i.push({selector:a,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 $e(t){try{return document.querySelector(t)}catch(e){return null}}function ri(t){let e=t.x+t.width/2,o=t.y+t.height/2,n=e-window.scrollX,i=o-window.scrollY,r=Tn(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 s=`[data-pm="${r.getAttribute("data-pm")}"]`,l=_e(r),c=r.getBoundingClientRect();return{selector:s,info:l,rect:c}}function io(t,e){return window.getComputedStyle(t).getPropertyValue(e)}function si(t,e){if(t instanceof HTMLElement){let n=t.style.getPropertyValue(e);if(n)return n}let o=Bl(t,e);return o&&o.includes("var(")?o:io(t,e)}function Bl(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 a=r.style.getPropertyValue(e);if(a&&a.includes("var("))return a;let s=r.style[o];if(s&&s.includes("var("))return s}}catch(i){}}catch(n){}return null}function To(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 a=r.style.getPropertyValue(e);if(a)return a;let s=r.style[o];if(s)return s}}catch(i){}}catch(n){}return null}function Mo(t){let e=window.getComputedStyle(t).display;return e==="flex"||e==="inline-flex"||e==="grid"||e==="inline-grid"}function ro(t){let e=window.getComputedStyle(t);return{row:parseFloat(e.rowGap)||0,column:parseFloat(e.columnGap)||0}}function Ol(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 An(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,a=r==="column"||r==="column-reverse",s=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(a){let u=(c.bottom+d.top)/2;o.push({axis:"row",x:n.left,y:u-s/2,w:n.width,h:s})}else{let u=(c.right+d.left)/2;o.push({axis:"column",x:u-s/2,y:n.top,w:s,h:n.height})}}return Ol(o)}function ai(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 Wn(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 Pn(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 li(t){for(let e of t.childNodes)if(e.nodeType===Node.TEXT_NODE&&(e.textContent||"").trim().length>0)return!0;return!1}function Yn(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,a=parseFloat(i.lineHeight);isNaN(a)&&(a=r*1.2);let s=Math.max(1,e.getClientRects().length),l=Math.max(n.height,s*a),c=(l-n.height)/2;return new DOMRect(n.x,n.y-c,n.width,l)}function so(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 jt(t,e,o){t instanceof HTMLElement&&t.style.setProperty(e,o,"important")}function ci(t,e,o){t instanceof HTMLElement&&t.style.removeProperty(e)}function Io(t){var e;for(let o of t){let n=$e(o.selector);if(!n&&o.durableSelector&&(n=$e(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)jt(n,i.property,i.modified)}}function di(t,e){let o=$e(t);if(!o)return;let n=e.find(i=>i.selector===t);if(n)for(let i of n.changes)ci(o,i.property,i.original)}function Lo(t){for(let e of t){let o=$e(e.selector);if(o)for(let n of e.changes)ci(o,n.property,n.original)}}function ss(t,e,o,n){if(t)for(let i of t){if(i instanceof CSSGroupingRule){ss(i.cssRules,e,o,n);continue}if(i instanceof CSSStyleRule){let r=i.selectorText.toLowerCase();(r===":root"||r==="html"||r==="*"||r.includes(":root"))&&Fl(i.style,e,o,n)}}}function Fl(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 a=e.getPropertyValue(r).trim();as(a)&&n.push({name:r,value:a,usage:`var(${r})`})}}}var Ro=null,Dl=5e3;function ui(){if(Ro&&Date.now()-Ro.timestamp<Dl)return Ro.variables;let t=[],e=new Set,o=getComputedStyle(document.documentElement);try{for(let r of document.styleSheets)try{ss(r.cssRules||r.rules,o,e,t)}catch(a){}}catch(r){}let n=document.documentElement.style;for(let r=0;r<n.length;r++){let a=n[r];if(a!=null&&a.startsWith("--")&&!e.has(a)){e.add(a);let s=o.getPropertyValue(a).trim();as(s)&&t.push({name:a,value:s,usage:`var(${a})`})}}let i=t.sort((r,a)=>r.name.localeCompare(a.name));return Ro={variables:i,timestamp:Date.now()},i}function as(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=rs(t);if(!o)return null;for(let n of e){let i=rs(n.value);if(i&&o===i)return n}return null}function rs(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 a=Math.round(r);return`oklch(${n} ${i} ${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 Hl=new Set(["button","a","input","select","textarea"]),zl=new Set(["button","link"]),_l=new Set(["h1","h2","h3","h4","h5","h6","nav","main","header","footer","section","article","aside"]),$l=["fontSize","fontWeight","fontFamily","lineHeight","letterSpacing","color","backgroundColor","padding","gap","borderRadius","boxShadow"];var pi=150;function Wl(t){let e=0,o=t.parentElement;for(;o&&o!==document.body;)e++,o=o.parentElement;return e}function Yl(t){return!(t.startsWith("_")||t.startsWith("css-")||t.length>30)}function jl(t){let e=Array.from(t.classList).filter(Yl).slice(0,3);return e.length>0?e.join(" "):void 0}function Gl(t,e){let o=window.getComputedStyle(t),n=e?window.getComputedStyle(e):null,i={};for(let r of $l){let a=o.getPropertyValue(r.replace(/[A-Z]/g,s=>`-${s.toLowerCase()}`));if(a&&!(r==="backgroundColor"&&(a==="rgba(0, 0, 0, 0)"||a==="transparent"))&&!(r==="boxShadow"&&a==="none")){if(r==="boxShadow"&&(a="yes"),r==="fontFamily"&&(a=a.split(",")[0].trim().replace(/['"]/g,"")),n){let s=n.getPropertyValue(r.replace(/[A-Z]/g,l=>`-${l.toLowerCase()}`));if(a===s)continue}i[r]=a}}return Object.keys(i).length>0?i:void 0}function Vl(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 Jl(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 Xl(t){let e=t.tagName.toLowerCase(),o=no(t);if(o&&o.length>0||Hl.has(e))return!0;let n=t.getAttribute("role");return!!(n&&zl.has(n)||_l.has(e)||(e==="img"||e==="svg")&&(t.getAttribute("alt")||t.getAttribute("aria-label")))}function ls(){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(),Jl(g)||!Vl(g))continue;let b=g.getBoundingClientRect();if(b.width<1||b.height<1||!Xl(g))continue;let k=g.tagName.toLowerCase(),w=no(g),M=Wl(g),P=g.getAttribute("role")||void 0,I=k==="a"&&g.getAttribute("href")||void 0,h=k==="img"&&g.getAttribute("alt")||void 0,W=(c=eo(g))==null?void 0:c.name,it=jl(g),Y=Gl(g,g.parentElement),K={tag:k,rect:{x:Math.round(b.left+window.scrollX),y:Math.round(b.top+window.scrollY),w:Math.round(b.width),h:Math.round(b.height)},depth:M};w&&(K.text=w.length>80?w.slice(0,80)+"...":w),W&&(K.component=W),it&&(K.classes=it),Y&&(K.styles=Y),P&&(K.role=P),I&&(K.href=I),h&&(K.alt=h),t.push({el:g,entry:K})}t.sort((g,b)=>b.entry.depth-g.entry.depth);let n=new Set;for(let g=0;g<t.length;g++){let b=t[g];if(n.has(b.el))continue;let k=b.el.parentElement;if(!k||!t.find(I=>I.el===k))continue;let M=(d=b.el.textContent)==null?void 0:d.trim(),P=(u=k.textContent)==null?void 0:u.trim();M&&P&&M===P&&n.add(b.el)}let i=t.filter(g=>!n.has(g.el)),r=new Map;for(let g of i){let b=g.el.parentElement,k=[b?Array.from(b.classList).join("."):"",g.entry.tag,(p=g.entry.component)!=null?p:"",g.entry.styles?JSON.stringify(g.entry.styles):""].join("|"),w=(f=r.get(k))!=null?f:[];w.push(g),r.set(k,w)}let a=[],s=new Set;for(let[,g]of r)if(g.length>3){a.push(g[0].entry,g[1].entry),s.add(g[0].el),s.add(g[1].el);let b=1/0,k=1/0,w=-1/0,M=-1/0;for(let P=2;P<g.length;P++){let I=g[P].entry.rect;b=Math.min(b,I.x),k=Math.min(k,I.y),w=Math.max(w,I.x+I.w),M=Math.max(M,I.y+I.h)}a.push({tag:g[0].entry.tag,text:`(+${g.length-2} similar items)`,rect:{x:Math.round(b),y:Math.round(k),w:Math.round(w-b),h:Math.round(M-k)},depth:g[0].entry.depth});for(let P of g)s.add(P.el)}for(let g of i)s.has(g.el)||a.push(g.entry);let l=Math.max(document.documentElement.scrollHeight,1);if(a.sort((g,b)=>{let k=g.rect.w*g.rect.h,w=b.rect.w*b.rect.h,M=k*(1+.5*(1-g.rect.y/l));return w*(1+.5*(1-b.rect.y/l))-M}),a.length>pi){let g=a.slice(0,pi);return g.push({tag:"truncated",text:`${a.length-pi} additional elements omitted`,rect:{x:0,y:0,w:0,h:0},depth:0}),g}return a}import{domToCanvas as Kl}from"modern-screenshot";function gi(t){let e=document.createElement("canvas").getContext("2d");return e?(e.fillStyle=t,e.fillStyle):"#888888"}function No(t,e=[],o,n){let i=new Map,r=[];for(let s of t)if(s.groupId){let l=i.get(s.groupId)||[];l.push(s),i.set(s.groupId,l)}else r.push(s);let a=[];for(let[s,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;a.push(m(x(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 s of r)a.push(m(x(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 cs(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 Ul(t,e){if(t.length===0)return[];let o=t.map(d=>({annotation:d,bounds:cs(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=[],a=50,s=Math.max(0,n-a),l=[],c=s;for(let{annotation:d,bounds:u}of o){let p=u.maxY+a;if(p-s<=e)l.push(d),c=Math.max(c,p);else{if(l.length>0){let f=(s+c)/2,g=Math.max(0,f-e/2);r.push({top:g,bottom:g+e,annotations:l})}s=Math.max(0,u.minY-a),l=[d],c=u.maxY+a}}if(l.length>0){let d=(s+c)/2,u=Math.max(0,d-e/2);r.push({top:u,bottom:u+e,annotations:l})}return r}function Zl(t,e,o,n){t.save(),t.scale(n,n);for(let i of e){let r=i.points.map(a=>({x:a.x,y:a.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 a=1;a<r.length;a++)t.lineTo(r[a].x,r[a].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 a=r[0],s=r[r.length-1],l=Math.min(a.x,s.x),c=Math.min(a.y,s.y),d=Math.abs(s.x-a.x),u=Math.abs(s.y-a.y);t.strokeRect(l,c,d,u);break}case"circle":{if(r.length<2)break;let a=r[0],s=r[r.length-1],l=(a.x+s.x)/2,c=(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(l,c,d,u,0,0,Math.PI*2),t.stroke();break}case"text":{if(!i.text||r.length<1)break;let a=r[0],s=i.fontSize||16;t.font=`${s}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(`
+var Aa=Object.defineProperty,Pa=Object.defineProperties;var Na=Object.getOwnPropertyDescriptors;var xo=Object.getOwnPropertySymbols;var Nr=Object.prototype.hasOwnProperty,Br=Object.prototype.propertyIsEnumerable;var Pr=(t,e,o)=>e in t?Aa(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,m=(t,e)=>{for(var o in e||(e={}))Nr.call(e,o)&&Pr(t,o,e[o]);if(xo)for(var o of xo(e))Br.call(e,o)&&Pr(t,o,e[o]);return t},x=(t,e)=>Pa(t,Na(e));var vo=t=>typeof t=="symbol"?t:t+"",So=(t,e)=>{var o={};for(var n in t)Nr.call(t,n)&&e.indexOf(n)<0&&(o[n]=t[n]);if(t!=null&&xo)for(var n of xo(t))e.indexOf(n)<0&&Br.call(t,n)&&(o[n]=t[n]);return o};import{createContext as wu,useCallback as Ne,useContext as ku,useEffect as Fe,useMemo as qn,useRef as en,useState as je}from"react";import{useCallback as ko,useEffect as Ba,useRef as Vr,useState as Oa}from"react";var tn="http://localhost:1111";async function Or(t=tn){try{let e=await fetch(`${t}/capabilities`);return e.ok?await e.json():null}catch(e){return null}}async function wo(t=tn){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 Fr(t,e,o=tn,n,i,r,a){let s=new FormData;if(s.append("screenshot",t,"screenshot.png"),s.append("feedback",e),n&&s.append("color",n),i&&s.append("provider",i),r&&s.append("model",r),a)for(let[c,d]of a)for(let u=0;u<d.length;u++)s.append(`image-${c}-${u}`,d[u],`image-${c}-${u}.png`);let l=await fetch(`${o}/send`,{method:"POST",body:s});if(!l.ok){let c=await l.text();throw new Error(`Bridge returned ${l.status}: ${c}`)}return l.json()}async function Dr(t,e,o=tn,n,i,r,a,s,l){let c=new FormData;c.append("screenshot",t,"screenshot.png"),c.append("goal",e),r&&c.append("pageUrl",r),a&&c.append("viewport",JSON.stringify(a)),n&&c.append("provider",n),i&&c.append("model",i),s&&c.append("manifest",JSON.stringify(s)),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 Hr(t,e=tn,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 zr(t,e,o=tn,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 a=await fetch(`${o}/plan/review`,{method:"POST",body:r});if(!a.ok){let s=await a.text();throw new Error(`Bridge returned ${a.status}: ${s}`)}return a.json()}async function _r(t,e,o,n=tn,i,r){let a=new FormData;a.append("screenshot",t,"screenshot.png"),a.append("planId",e),a.append("tasks",JSON.stringify(o)),i&&a.append("provider",i),r&&a.append("model",r);let s=await fetch(`${n}/plan/execute`,{method:"POST",body:a});if(!s.ok){let l=await s.text();throw new Error(`Bridge returned ${s.status}: ${l}`)}return s.json()}async function $r(t=tn,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 Wr(t,e=tn){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 Yr(t,e=tn){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 Zo(t,e,o=tn){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 jr(t,e=tn){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 zn(t=tn){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 Gr(t,e,o=tn,n,i,r,a){let s;if(a&&a.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<a.length;d++)l.append(`image-reply-${d}`,a[d],`reply-image-${d}.png`);s=await fetch(`${o}/reply`,{method:"POST",body:l})}else s=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(!s.ok){let l=await s.text();throw new Error(`Bridge returned ${s.status}: ${l}`)}return s.json()}function Jr(t="http://localhost:1111"){let[e,o]=Oa({isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,pendingQuestions:[],pendingPlans:[],planReviews:[],incrementalResolutions:[]}),n=Vr(null),i=Vr(null),r=ko(()=>{n.current&&(n.current.close(),n.current=null);let c=new EventSource(`${t}/events`);n.current=c,c.addEventListener("connected",()=>{wo(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=>x(m({},g),{isConnected:!0,status:p?"streaming":"idle",activeJobId:p?u[u.length-1].id:g.activeJobId,activeJobIds:u.map(b=>b.id)}))})}),c.addEventListener("job_started",d=>{let u=JSON.parse(d.data),p=u.jobId;o(f=>x(m({},f),{status:"streaming",activeJobId:p,activeJobIds:[...f.activeJobIds,p],jobResponses:x(m({},f.jobResponses),{[p]:""}),jobThinking:x(m({},f.jobThinking),{[p]:""}),currentResponse:"",currentThinking:"",lastResponseText:null,lastThreadId:null,events:[...f.events,{type:"job_started",data:u,timestamp:Date.now()}]}))}),c.addEventListener("delta",d=>{let u=JSON.parse(d.data),p=u.jobId,f=u.text||"";o(g=>x(m({},g),{jobResponses:p?x(m({},g.jobResponses),{[p]:(g.jobResponses[p]||"")+f}):g.jobResponses,currentResponse:!p||p===g.activeJobId?g.currentResponse+f:g.currentResponse}))}),c.addEventListener("thinking",d=>{let u=JSON.parse(d.data),p=u.jobId,f=u.text||"";o(g=>x(m({},g),{jobThinking:p?x(m({},g.jobThinking),{[p]:(g.jobThinking[p]||"")+f}):g.jobThinking,currentThinking:!p||p===g.activeJobId?g.currentThinking+f:g.currentThinking}))}),c.addEventListener("tool_use",d=>{let u=JSON.parse(d.data);o(p=>x(m({},p),{events:[...p.events,{type:"tool_use",data:u,timestamp:Date.now()}]}))}),c.addEventListener("done",d=>{let u=JSON.parse(d.data),p=u.jobId;o(f=>{var N;let g=p?f.activeJobIds.filter(L=>L!==p):f.activeJobIds,b=m({},f.jobResponses),k=m({},f.jobThinking),w=p?b[p]:void 0;p&&(delete b[p],delete k[p]);let I=p===f.activeJobId?g.length>0?g[g.length-1]:null:f.activeJobId;return x(m(x(m({},f),{activeJobIds:g,activeJobId:I,jobResponses:b,jobThinking:k,lastCompletedJobId:p!=null?p:f.activeJobId,lastResponseText:w||f.currentResponse||u.responseText||null,lastThreadId:(N=u.threadId)!=null?N:null}),p===f.activeJobId?{currentResponse:I&&b[I]||"",currentThinking:I&&k[I]||""}:{}),{events:[...f.events,{type:"done",data:u,timestamp:Date.now()}]})})}),c.addEventListener("question",d=>{let u=JSON.parse(d.data);o(p=>x(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()}]}))}),c.addEventListener("plan_ready",d=>{let u=JSON.parse(d.data);o(p=>x(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()}]}))}),c.addEventListener("plan_review",d=>{let u=JSON.parse(d.data);o(p=>x(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()}]}))}),c.addEventListener("task_resolved",d=>{var f;let u=JSON.parse(d.data),p=(f=u.resolutions)!=null?f:[];o(g=>x(m({},g),{incrementalResolutions:[...g.incrementalResolutions,...p],events:[...g.events,{type:"task_resolved",data:u,timestamp:Date.now()}]}))}),c.addEventListener("queue_drained",()=>{o(d=>x(m({},d),{status:d.status==="error"?"error":"idle",activeJobId:null,activeJobIds:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},incrementalResolutions:[]}))}),c.addEventListener("error",d=>{var u;if(c.readyState===EventSource.CLOSED)o(p=>x(m({},p),{isConnected:!1,status:"disconnected"})),i.current=setTimeout(()=>{wo(t).then(p=>{p&&r()})},5e3);else if(d instanceof MessageEvent){let p=JSON.parse(d.data),f=(u=p.jobId)!=null?u:null;o(g=>{let b=f?g.activeJobIds.filter(w=>w!==f):g.activeJobIds,k=b.length>0?g.status:"error";return x(m({},g),{status:k,activeJobIds:b,lastCompletedJobId:f!=null?f:g.activeJobId,events:[...g.events,{type:"error",data:p,timestamp:Date.now()}]})})}}),c.onerror=()=>{c.readyState===EventSource.CLOSED&&o(d=>x(m({},d),{isConnected:!1,status:"disconnected"}))}},[t]);Ba(()=>(wo(t).then(c=>{c&&r()}),()=>{n.current&&(n.current.close(),n.current=null),i.current&&clearTimeout(i.current)}),[t,r]);let a=ko(()=>{o(c=>x(m({},c),{events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,incrementalResolutions:[]}))},[]),s=ko(c=>{o(d=>x(m({},d),{pendingQuestions:d.pendingQuestions.filter(u=>u.threadId!==c)}))},[]),l=ko(c=>{o(d=>x(m({},d),{pendingPlans:d.pendingPlans.filter(u=>u.planId!==c)}))},[]);return x(m({},e),{clearEvents:a,dismissQuestion:s,dismissPlan:l})}import{useEffect as Fa,useReducer as Da}from"react";var Ha={isAnnotating:!1,activeTool:"inspector",activeColor:"#ff0000",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function _n(){return Math.random().toString(36).substring(2,9)}function Xr(t){return t.status?t:t.captured?x(m({},t),{status:"in_flight"}):x(m({},t),{status:"pending"})}function Xe(t){return x(m({},t),{undoStack:[...t.undoStack,{annotations:t.annotations,styleModifications:t.styleModifications,spacingTokenMods:t.spacingTokenMods}],redoStack:[]})}function za(t,e){return x(m({},t),{isAnnotating:e})}function _a(t,e){return x(m({},t),{activeTool:e,inspectedElement:null})}function $a(t,e){return x(m({},t),{activeColor:e})}function Wa(t,e){return x(m({},t),{strokeWidth:e})}function Ya(t,e){return x(m({},t),{currentPath:[e]})}function ja(t,e){return x(m({},t),{currentPath:[...t.currentPath,e]})}function Ga(t){return x(m({},t),{currentPath:[]})}function Va(t,e){if(t.currentPath.length<2&&t.activeTool!=="text")return x(m({},t),{currentPath:[]});let o={id:_n(),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=Xe(t);return x(m({},n),{annotations:[...t.annotations,o],currentPath:[]})}function Ja(t,e){var i;let o=m({id:(i=e.id)!=null?i:_n(),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:Xe(t);return x(m({},n),{annotations:[...t.annotations,o]})}function Xa(t,e){let o=Xe(t);return x(m({},o),{annotations:t.annotations.map(n=>n.id===e.id?m(x(m({},n),{text:e.text}),e.imageCount!=null?{imageCount:e.imageCount}:{}):n)})}function Ka(t,e){return x(m({},t),{annotations:t.annotations.map(o=>o.id===e.id?x(m({},o),{fontSize:Math.max(12,Math.min(72,e.fontSize))}):o)})}function Ua(t,e){let o=Xe(t),n=t.annotations.find(r=>r.id===e.id),i=n==null?void 0:n.groupId;return x(m({},o),{annotations:t.annotations.filter(r=>r.id!==e.id&&!(i&&r.groupId===i))})}function Za(t,e){let o=e.saveUndo?Xe(t):t,n=t.annotations.find(r=>r.id===e.id),i=n==null?void 0:n.groupId;return x(m({},o),{annotations:t.annotations.map(r=>{if(!(r.id===e.id||i&&r.groupId===i))return r;let s=e.delta.x,l=e.delta.y;return x(m({},r),{points:r.points.map(c=>({x:c.x+s,y:c.y+l}))})})})}function qa(t,e){let o=e.saveUndo?Xe(t):t,n=t.annotations.find(a=>a.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 a=e.points,s=Math.min(a[0].x,a[1].x),l=Math.max(a[0].y,a[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=s-u,r=l-p}return x(m({},o),{annotations:t.annotations.map(a=>a.id===e.id?x(m({},a),{points:e.points}):n.groupId&&a.groupId===n.groupId&&a.type==="text"?x(m({},a),{points:a.points.map(s=>({x:s.x+i,y:s.y+r}))}):a)})}function Qa(t,e){let o=Xe(t);return x(m({},o),{annotations:[...t.annotations,...e.annotations.map(Xr)]})}function tl(t,e){let o=new Set,n=[];for(let i of e.annotations)o.has(i.id)||(o.add(i.id),n.push(Xr(i)));return x(m({},t),{annotations:n})}function el(t){if(t.undoStack.length===0)return t;let e=t.undoStack[t.undoStack.length-1];return x(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 nl(t){if(t.redoStack.length===0)return t;let e=t.redoStack[t.redoStack.length-1];return x(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 ol(t,e){let{id:o,addToSelection:n}=e;if(o===null)return x(m({},t),{selectedAnnotationIds:[],lastSelectedId:null});if(n)if(t.selectedAnnotationIds.includes(o)){let r=t.selectedAnnotationIds.filter(a=>a!==o);return x(m({},t),{selectedAnnotationIds:r,lastSelectedId:r.length>0?r[r.length-1]:null})}else return x(m({},t),{selectedAnnotationIds:[...t.selectedAnnotationIds,o],lastSelectedId:o});return x(m({},t),{selectedAnnotationIds:[o],lastSelectedId:o})}function il(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 x(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:x(m({},n),{color:e.color})})})}function rl(t){return x(m({},t),{annotations:t.annotations.map(e=>x(m({},e),{captured:!0,status:e.status==="pending"||!e.status?"in_flight":e.status})),styleModifications:t.styleModifications.map(e=>x(m({},e),{captured:!0})),spacingTokenChanges:t.spacingTokenChanges.map(e=>x(m({},e),{captured:!0}))})}function sl(t){return x(m({},t),{annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]})}function al(t,e){return x(m({},t),{inspectedElement:e})}function ll(t,e){let{selector:o,element:n,property:i,original:r,modified:a}=e,s=t.styleModifications.findIndex(l=>l.selector===o);if(r===a&&s<0)return t;if(s>=0){let l=t.styleModifications[s];if(l.captured){let f=Xe(t),g=f.styleModifications.map((b,k)=>k===s?x(m({},b),{changes:[{property:i,original:r,modified:a}],captured:!1}):b);return x(m({},f),{styleModifications:g})}let c=l.changes.findIndex(f=>f.property===i),d,u=t;if(c>=0){let f=l.changes[c];a===f.original?d=l.changes.filter((g,b)=>b!==c):d=l.changes.map((g,b)=>b===c?x(m({},g),{modified:a}):g)}else{if(r===a)return t;u=Xe(t),d=[...l.changes,{property:i,original:r,modified:a}]}if(d.length===0)return x(m({},u),{styleModifications:u.styleModifications.filter((f,g)=>g!==s)});let p=u.styleModifications.map((f,g)=>g===s?x(m({},f),{changes:d}):f);return x(m({},u),{styleModifications:p})}else{let l=Xe(t),c={selector:o,element:n,changes:[{property:i,original:r,modified:a}]};return x(m({},l),{styleModifications:[...l.styleModifications,c]})}}function cl(t,e){let{selector:o,durableSelector:n,element:i,changes:r}=e,a=r.filter(c=>c.original!==c.modified);if(a.length===0)return t;let s=Xe(t),l=s.styleModifications.findIndex(c=>c.selector===o);if(l>=0){let c=s.styleModifications[l],d=c.captured?[]:[...c.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?x(m({},f),{modified:u.modified}):f):d.push(u)}return d.length===0?x(m({},s),{styleModifications:s.styleModifications.filter((u,p)=>p!==l)}):x(m({},s),{styleModifications:s.styleModifications.map((u,p)=>p===l?x(m({},u),{changes:d,captured:!1}):u)})}else return x(m({},s),{styleModifications:[...s.styleModifications,{selector:o,durableSelector:n,element:i,changes:a}]})}function dl(t,e){let{selector:o,property:n}=e,i=Xe(t),r=i.styleModifications.map(a=>a.selector!==o?a:x(m({},a),{changes:a.changes.filter(s=>s.property!==n)})).filter(a=>a.changes.length>0);return x(m({},i),{styleModifications:r})}function ul(t){if(t.styleModifications.length===0)return x(m({},t),{inspectedElement:null});let e=Xe(t);return x(m({},e),{styleModifications:[],inspectedElement:null})}function pl(t,e){return x(m({},t),{styleModifications:e})}function fl(t,e){let{updates:o}=e,n=new Map(o.map(i=>[i.id,i]));return x(m({},t),{annotations:t.annotations.map(i=>{let r=n.get(i.id);return r?m(x(m({},i),{points:[r.point,...i.points.slice(1)]}),r.linkedAnchor?{linkedAnchor:r.linkedAnchor}:{}):i})})}function gl(t,e){let o=new Set(e.ids);return x(m({},t),{annotations:t.annotations.map(n=>o.has(n.id)?x(m({},n),{status:e.status}):n)})}function ml(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 x(m({},t),{annotations:t.annotations.map(i=>o.has(i.id)||i.groupId&&n.has(i.groupId)?x(m({},i),{threadId:e.threadId}):i)})}function hl(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 x(m({},t),{annotations:t.annotations.map(i=>o.has(i.id)||i.groupId&&n.has(i.groupId)?x(m({},i),{status:"waiting_input",question:e.question,threadId:e.threadId}):i)})}function yl(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 x(m({},t),{annotations:t.annotations.map(i=>{var a,s,l;let r=o.get(i.id)||(i.groupId?n.get(i.groupId):void 0);return r?x(m({},i),{status:r.status,resolutionSummary:r.summary,scope:(s=(a=r.finalScope)!=null?a:r.inferredScope)!=null?s:null,replyCount:((l=i.replyCount)!=null?l:0)+1,question:void 0,threadId:i.threadId||e.threadId}):i})})}function bl(t,e){let{groupId:o,planId:n,planTaskId:i,instruction:r,region:a,color:s,linkedSelector:l,elements:c}=e,d=r.length>60?r.slice(0,60).replace(/\s+\S*$/,"")+"\u2026":r,u={id:_n(),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:l,elements:c,planId:n,planTaskId:i,status:"pending"},p={id:_n(),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:l,elements:c,planId:n,planTaskId:i};return x(m({},t),{annotations:[...t.annotations,u,p]})}function xl(t,e){let{linkedSelectors:o,styleSelectors:n}=e,i=new Set(o),r=new Set(n),a=new Set,s=new Set;for(let p of t.annotations)p.linkedSelector&&i.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 l=t.annotations.filter(p=>!a.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=>!a.has(p)),u=t.inspectedElement&&r.has(t.inspectedElement.info.selector)?null:t.inspectedElement;return x(m({},t),{annotations:l,styleModifications:c,selectedAnnotationIds:d,lastSelectedId:d.length>0?d[d.length-1]:null,inspectedElement:u})}function vl(t,e){let o=t.spacingTokenChanges.findIndex(n=>n.tokenPath===e.tokenPath);return o>=0?x(m({},t),{spacingTokenChanges:t.spacingTokenChanges.map((n,i)=>i===o?e:n)}):x(m({},t),{spacingTokenChanges:[...t.spacingTokenChanges,e]})}function Sl(t,e){return x(m({},t),{spacingTokenChanges:e})}function wl(t,e){let o=Xe(t),n=t.spacingTokenMods.findIndex(r=>r.tokenPath===e.tokenPath),i;if(n>=0){let r=t.spacingTokenMods[n],a=x(m({},e),{originalValue:r.originalValue,originalPx:r.originalPx});i=t.spacingTokenMods.map((s,l)=>l===n?a:s)}else i=[...t.spacingTokenMods,e];return x(m({},o),{spacingTokenMods:i})}function kl(t,e){let o=Xe(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,a={tokenPath:e.tokenPath,originalValue:i,currentValue:"__deleted__",targets:n>=0?t.spacingTokenMods[n].targets:[],originalPx:r,currentPx:0},s;return n>=0?s=t.spacingTokenMods.map((l,c)=>c===n?a:l):s=[...t.spacingTokenMods,a],x(m({},o),{spacingTokenMods:s})}var Cl={SET_ANNOTATING:za,SET_TOOL:_a,SET_COLOR:$a,SET_STROKE_WIDTH:Wa,START_PATH:Ya,CONTINUE_PATH:ja,CANCEL_PATH:Ga,FINISH_PATH:Va,ADD_TEXT:Ja,UPDATE_TEXT:Xa,UPDATE_TEXT_SIZE:Ka,DELETE_ANNOTATION:Ua,MOVE_ANNOTATION:Za,RESIZE_ANNOTATION:qa,PASTE_ANNOTATIONS:Qa,RESTORE_ANNOTATIONS:tl,UNDO:el,REDO:nl,SELECT_ANNOTATION:ol,UPDATE_ANNOTATION_COLOR:il,MARK_CAPTURED:rl,CLEAR:sl,SELECT_ELEMENT:al,MODIFY_STYLE:ll,MODIFY_STYLES_BATCH:cl,CLEAR_STYLE:dl,CLEAR_ALL_STYLES:ul,RESTORE_STYLE_MODIFICATIONS:pl,UPDATE_LINKED_POSITIONS:fl,CLEANUP_ORPHANED:xl,SET_ANNOTATION_STATUS:gl,SET_ANNOTATION_THREAD:ml,SET_ANNOTATION_QUESTION:hl,APPLY_RESOLUTIONS:yl,ADD_PLAN_ANNOTATION:bl,ADD_SPACING_TOKEN_CHANGE:vl,RESTORE_SPACING_TOKEN_CHANGES:Sl,MODIFY_SPACING_TOKEN:wl,DELETE_SPACING_TOKEN:kl};function El(t,e){let o=Cl[e.type];return o?o(t,e.payload):t}function Kr(){let[t,e]=Da(El,Ha);return Fa(()=>{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 eo(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 Tl(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 _e(t){let e={selector:Tl(t),tagName:t.tagName.toLowerCase()};t.id&&(e.id=t.id),t.classList.length>0&&(e.className=Array.from(t.classList).join(" "));let o=no(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 i=eo(t);i&&(e.reactComponent=i.name);let r=Ml(t);return r&&(e.context=r),e}function no(t){let e="";for(let o of t.childNodes)o.nodeType===Node.TEXT_NODE&&(e+=o.textContent||"");return e.trim()}function Tn(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 Ml(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 Zr(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 a of r){let s=a.x-n,l=a.y-i;if(s<0||l<0||s>window.innerWidth||l>window.innerHeight)continue;let c=Tn(s,l);c&&!e.has(c)&&(e.add(c),o.push(_e(c)))}return o.slice(0,3)}function Qo(t){if(t.length===0)return[];let e=t.map(n=>n.x),o=t.map(n=>n.y);return Zr({minX:Math.min(...e),minY:Math.min(...o),maxX:Math.max(...e),maxY:Math.max(...o)})}function qr(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 qo(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 Co(t,e=0){var l;let o=qr(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)),a=o[r],s=(l=qo(a.fiber))!=null?l:t;return{name:a.name,path:n,depthIndex:r,rootElement:s}}function Qr(t,e){var r,a;let o=qr(t),n=e.toLowerCase(),i=-1;for(let s=o.length-1;s>=0;s--){let l=o[s].name;if(l===e){let c=(r=qo(o[s].fiber))!=null?r:t;return{name:e,path:o.map(d=>d.name),depthIndex:s,rootElement:c}}if(i===-1){let c=l.toLowerCase();(c.length>=4&&n.includes(c)||n.length>=4&&c.includes(n))&&(i=s)}}if(i>=0){let s=(a=qo(o[i].fiber))!=null?a:t;return{name:e,path:o.map(l=>l.name),depthIndex:i,rootElement:s}}return null}function $n(t){let e=oo(),o=[],n=new Set,i=e.currentNode;for(;i=e.nextNode();){let r=Qr(i,t);r&&!n.has(r.rootElement)&&(n.add(r.rootElement),o.push(r))}return o}function ti(t){let e=new Map;if(t.size===0)return e;let o=new Set(t),n=oo(),i=new Set,r=n.currentNode;for(;(r=n.nextNode())&&o.size>0;)for(let a of o){let s=Qr(r,a);if(!s||i.has(s.rootElement))continue;i.add(s.rootElement);let l=s.rootElement.getBoundingClientRect();e.set(a,l.top+window.scrollY),o.delete(a);break}for(let a of o)e.set(a,1/0);return e}function oo(){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 Re(t,e){return t.style.getPropertyValue(e)!==""}function Il(t,e=30){if(t<=0)return[];let o=[],n=oo(),i=.5,r=n.currentNode;for(;(r=n.nextNode())&&o.length<e;){let a=r,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 l=getComputedStyle(a);!Re(a,"padding-top")&&Math.abs((parseFloat(l.paddingTop)||0)-t)<i&&o.push({element:a,property:"padding-top"}),!Re(a,"padding-bottom")&&Math.abs((parseFloat(l.paddingBottom)||0)-t)<i&&o.length<e&&o.push({element:a,property:"padding-bottom"}),!Re(a,"padding-left")&&Math.abs((parseFloat(l.paddingLeft)||0)-t)<i&&o.length<e&&o.push({element:a,property:"padding-left"}),!Re(a,"padding-right")&&Math.abs((parseFloat(l.paddingRight)||0)-t)<i&&o.length<e&&o.push({element:a,property:"padding-right"}),!Re(a,"margin-top")&&Math.abs((parseFloat(l.marginTop)||0)-t)<i&&o.length<e&&o.push({element:a,property:"margin-top"}),!Re(a,"margin-bottom")&&Math.abs((parseFloat(l.marginBottom)||0)-t)<i&&o.length<e&&o.push({element:a,property:"margin-bottom"}),!Re(a,"margin-left")&&Math.abs((parseFloat(l.marginLeft)||0)-t)<i&&o.length<e&&o.push({element:a,property:"margin-left"}),!Re(a,"margin-right")&&Math.abs((parseFloat(l.marginRight)||0)-t)<i&&o.length<e&&o.push({element:a,property:"margin-right"});let c=l.display;if((c.includes("flex")||c.includes("grid"))&&o.length<e){let d=Re(a,"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:a,property:"gap"}):!Re(a,"row-gap")&&Math.abs(p-t)<i?o.push({element:a,property:"row-gap"}):!Re(a,"column-gap")&&Math.abs(f-t)<i&&o.push({element:a,property:"column-gap"})}}return o}function ei(t,e=30){if(t<=0)return[];let o=[],n=oo(),i=.5,r=n.currentNode;for(;(r=n.nextNode())&&o.length<e;){let a=r,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 l=getComputedStyle(a),c=parseFloat(l.borderTopWidth)||0,d=parseFloat(l.borderRightWidth)||0,u=parseFloat(l.borderBottomWidth)||0,p=parseFloat(l.borderLeftWidth)||0,f=a.clientWidth,g=a.clientHeight,b=parseFloat(l.paddingTop)||0;!Re(a,"padding-top")&&Math.abs(b-t)<i&&o.push({x:s.left+p,y:s.top+c,width:f,height:t,direction:"vertical",property:"padding-top"});let k=parseFloat(l.paddingBottom)||0;!Re(a,"padding-bottom")&&Math.abs(k-t)<i&&o.length<e&&o.push({x:s.left+p,y:s.top+c+g-t,width:f,height:t,direction:"vertical",property:"padding-bottom"});let w=parseFloat(l.paddingLeft)||0;!Re(a,"padding-left")&&Math.abs(w-t)<i&&o.length<e&&o.push({x:s.left+p,y:s.top+c,width:t,height:g,direction:"horizontal",property:"padding-left"});let I=parseFloat(l.paddingRight)||0;!Re(a,"padding-right")&&Math.abs(I-t)<i&&o.length<e&&o.push({x:s.left+p+f-t,y:s.top+c,width:t,height:g,direction:"horizontal",property:"padding-right"});let N=parseFloat(l.marginTop)||0;!Re(a,"margin-top")&&Math.abs(N-t)<i&&o.length<e&&o.push({x:s.left,y:s.top-t,width:s.width,height:t,direction:"vertical",property:"margin-top"});let L=parseFloat(l.marginBottom)||0;!Re(a,"margin-bottom")&&Math.abs(L-t)<i&&o.length<e&&o.push({x:s.left,y:s.bottom,width:s.width,height:t,direction:"vertical",property:"margin-bottom"});let h=parseFloat(l.marginLeft)||0;!Re(a,"margin-left")&&Math.abs(h-t)<i&&o.length<e&&o.push({x:s.left-t,y:s.top,width:t,height:s.height,direction:"horizontal",property:"margin-left"});let Y=parseFloat(l.marginRight)||0;!Re(a,"margin-right")&&Math.abs(Y-t)<i&&o.length<e&&o.push({x:s.right,y:s.top,width:t,height:s.height,direction:"horizontal",property:"margin-right"});let ot=l.display;if((ot.includes("flex")||ot.includes("grid"))&&o.length<e&&!Re(a,"gap")){let U=Array.from(a.children).filter(Q=>{let O=getComputedStyle(Q);return O.display!=="none"&&O.position!=="absolute"&&O.position!=="fixed"});if(U.length>=2)for(let Q=0;Q<U.length-1&&o.length<e;Q++){let O=U[Q].getBoundingClientRect(),tt=U[Q+1].getBoundingClientRect(),Z=tt.top-O.bottom;Math.abs(Z-t)<i&&Z>.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:Z,direction:"vertical",property:"gap"});let It=tt.left-O.right;Math.abs(It-t)<i&&It>.5&&o.push({x:O.right,y:Math.min(O.top,tt.top),width:It,height:Math.max(O.bottom,tt.bottom)-Math.min(O.top,tt.top),direction:"horizontal",property:"gap"})}}}return o}function rn(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(a=>!a.startsWith("_")&&a.length<30).slice(0,2);i.length>0&&(n+="."+i.map(a=>CSS.escape(a)).join("."));let r=o.parentElement;if(r){let a=Array.from(r.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=r}return e.join(" > ")}function Eo(t){return typeof t=="string"?{value:t}:t}var ts={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 Ur(t,e){let o=ts[e];return o?o.includes(t):!1}function Ll(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 Rl(t){var s,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"},a=o.slice(0,o.indexOf("-",n+1)>0?o.indexOf("-",n+1):n);return(l=(s=r[a])!=null?s:r[i])!=null?l:null}function ni(t,e=30){let o=parseFloat(t.value);if(isNaN(o)||o<=0)return[];if(t.bindings&&t.bindings.length>0){let i=[],r=oo(),a=r.currentNode;for(;(a=r.nextNode())&&i.length<e;){let s=a,l=s.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let c=s.className;if(typeof c=="string")for(let d of t.bindings){if(!Ll(c,d))continue;let u=Rl(d);if(u&&!(t.property&&!Ur(u,t.property))){i.push({element:s,property:u});break}}}return i}let n=Il(o,e*2);return t.property?n.filter(i=>Ur(i.property,t.property)).slice(0,e):n.slice(0,e)}function oi(t,e=30){let o=ni(t,e),n=[];for(let i of o){let r=i.element,a=r.getBoundingClientRect(),s=getComputedStyle(r),l=parseFloat(s.borderTopWidth)||0,c=parseFloat(s.borderRightWidth)||0,d=parseFloat(s.borderLeftWidth)||0,u=r.clientWidth,p=r.clientHeight;switch(i.property){case"padding-top":{let f=parseFloat(s.paddingTop)||0;n.push({x:a.left+d,y:a.top+l,width:u,height:f,direction:"vertical",property:i.property});break}case"padding-bottom":{let f=parseFloat(s.paddingBottom)||0;n.push({x:a.left+d,y:a.top+l+p-f,width:u,height:f,direction:"vertical",property:i.property});break}case"padding-left":{let f=parseFloat(s.paddingLeft)||0;n.push({x:a.left+d,y:a.top+l,width:f,height:p,direction:"horizontal",property:i.property});break}case"padding-right":{let f=parseFloat(s.paddingRight)||0;n.push({x:a.left+d+u-f,y:a.top+l,width:f,height:p,direction:"horizontal",property:i.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:i.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:i.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:i.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:i.property});break}case"gap":case"row-gap":case"column-gap":{let f=Array.from(r.children).filter(g=>{let b=getComputedStyle(g);return b.display!=="none"&&b.position!=="absolute"&&b.position!=="fixed"});for(let g=0;g<f.length-1&&n.length<e;g++){let b=f[g].getBoundingClientRect(),k=f[g+1].getBoundingClientRect(),w=k.top-b.bottom;w>.5&&n.push({x:Math.min(b.left,k.left),y:b.bottom,width:Math.max(b.right,k.right)-Math.min(b.left,k.left),height:w,direction:"vertical",property:"gap"});let I=k.left-b.right;I>.5&&n.push({x:b.right,y:Math.min(b.top,k.top),width:I,height:Math.max(b.bottom,k.bottom)-Math.min(b.top,k.top),direction:"horizontal",property:"gap"})}break}}}return n}function es(t,e){let o=new Set,n=to(e);for(let i of t){let r=os[i.property];if(!r)continue;let a=i.element.className;if(typeof a=="string")for(let s of r){let l=`${s}-${n}`;for(let c of a.split(/\s+/)){let d=c.lastIndexOf(":"),u=d>=0?c.slice(d+1):c;if(u===l){o.add(u);break}}}}return[...o]}function ns(t){let e=new Set;for(let o of t)for(let[n,i]of Object.entries(ts))if(i.includes(o.property)){e.add(n);break}if(e.size===1)return[...e][0]}function ii(t,e,o){if(e===o)return t;let n=to(e),i=to(o);return t.map(r=>{let a=r.lastIndexOf("-");if(a<0)return r;let s=r.slice(0,a),l=r.slice(a+1);return l===n||l===`[${e}px]`?`${s}-${i}`:r})}var Al={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 to(t){var e;return(e=Al[t])!=null?e:`[${t}px]`}var os={"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 Pl(t,e,o,n){let i=os[e];if(!i)return null;let r=to(o);for(let a of i){let s=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+a+"-(?:"+Nl(r)+"|\\["+o+"px\\]))(?:\\s|$)"),l=t.match(s);if(l!=null&&l[1]){let c=to(n),d=l[1].lastIndexOf(":"),u=d>=0?l[1].slice(0,d+1):"";return{matched:l[1],suggested:`${u}${a}-${c}`}}}return null}function Nl(t){return t.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function is(t,e,o){let n=new Set,i=[];for(let r of t){let a=rn(r.element),s=`${a}::${r.property}`;if(n.has(s))continue;n.add(s);let l=eo(r.element),c=r.element.className||"",d=Pl(c,r.property,e,o);i.push({selector:a,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 $e(t){try{return document.querySelector(t)}catch(e){return null}}function ri(t){let e=t.x+t.width/2,o=t.y+t.height/2,n=e-window.scrollX,i=o-window.scrollY,r=Tn(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 s=`[data-pm="${r.getAttribute("data-pm")}"]`,l=_e(r),c=r.getBoundingClientRect();return{selector:s,info:l,rect:c}}function io(t,e){return window.getComputedStyle(t).getPropertyValue(e)}function si(t,e){if(t instanceof HTMLElement){let n=t.style.getPropertyValue(e);if(n)return n}let o=Bl(t,e);return o&&o.includes("var(")?o:io(t,e)}function Bl(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 a=r.style.getPropertyValue(e);if(a&&a.includes("var("))return a;let s=r.style[o];if(s&&s.includes("var("))return s}}catch(i){}}catch(n){}return null}function To(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 a=r.style.getPropertyValue(e);if(a)return a;let s=r.style[o];if(s)return s}}catch(i){}}catch(n){}return null}function Mo(t){let e=window.getComputedStyle(t).display;return e==="flex"||e==="inline-flex"||e==="grid"||e==="inline-grid"}function ro(t){let e=window.getComputedStyle(t);return{row:parseFloat(e.rowGap)||0,column:parseFloat(e.columnGap)||0}}function Ol(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 An(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,a=r==="column"||r==="column-reverse",s=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(a){let u=(c.bottom+d.top)/2;o.push({axis:"row",x:n.left,y:u-s/2,w:n.width,h:s})}else{let u=(c.right+d.left)/2;o.push({axis:"column",x:u-s/2,y:n.top,w:s,h:n.height})}}return Ol(o)}function ai(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 Wn(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 Pn(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 li(t){for(let e of t.childNodes)if(e.nodeType===Node.TEXT_NODE&&(e.textContent||"").trim().length>0)return!0;return!1}function Yn(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,a=parseFloat(i.lineHeight);isNaN(a)&&(a=r*1.2);let s=Math.max(1,e.getClientRects().length),l=Math.max(n.height,s*a),c=(l-n.height)/2;return new DOMRect(n.x,n.y-c,n.width,l)}function so(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 jt(t,e,o){t instanceof HTMLElement&&t.style.setProperty(e,o,"important")}function ci(t,e,o){t instanceof HTMLElement&&t.style.removeProperty(e)}function Io(t){var e;for(let o of t){let n=$e(o.selector);if(!n&&o.durableSelector&&(n=$e(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)jt(n,i.property,i.modified)}}function di(t,e){let o=$e(t);if(!o)return;let n=e.find(i=>i.selector===t);if(n)for(let i of n.changes)ci(o,i.property,i.original)}function Lo(t){for(let e of t){let o=$e(e.selector);if(o)for(let n of e.changes)ci(o,n.property,n.original)}}function ss(t,e,o,n){if(t)for(let i of t){if(i instanceof CSSGroupingRule){ss(i.cssRules,e,o,n);continue}if(i instanceof CSSStyleRule){let r=i.selectorText.toLowerCase();(r===":root"||r==="html"||r==="*"||r.includes(":root"))&&Fl(i.style,e,o,n)}}}function Fl(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 a=e.getPropertyValue(r).trim();as(a)&&n.push({name:r,value:a,usage:`var(${r})`})}}}var Ro=null,Dl=5e3;function ui(){if(Ro&&Date.now()-Ro.timestamp<Dl)return Ro.variables;let t=[],e=new Set,o=getComputedStyle(document.documentElement);try{for(let r of document.styleSheets)try{ss(r.cssRules||r.rules,o,e,t)}catch(a){}}catch(r){}let n=document.documentElement.style;for(let r=0;r<n.length;r++){let a=n[r];if(a!=null&&a.startsWith("--")&&!e.has(a)){e.add(a);let s=o.getPropertyValue(a).trim();as(s)&&t.push({name:a,value:s,usage:`var(${a})`})}}let i=t.sort((r,a)=>r.name.localeCompare(a.name));return Ro={variables:i,timestamp:Date.now()},i}function as(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=rs(t);if(!o)return null;for(let n of e){let i=rs(n.value);if(i&&o===i)return n}return null}function rs(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 a=Math.round(r);return`oklch(${n} ${i} ${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 Hl=new Set(["button","a","input","select","textarea"]),zl=new Set(["button","link"]),_l=new Set(["h1","h2","h3","h4","h5","h6","nav","main","header","footer","section","article","aside"]),$l=["fontSize","fontWeight","fontFamily","lineHeight","letterSpacing","color","backgroundColor","padding","gap","borderRadius","boxShadow"];var pi=150;function Wl(t){let e=0,o=t.parentElement;for(;o&&o!==document.body;)e++,o=o.parentElement;return e}function Yl(t){return!(t.startsWith("_")||t.startsWith("css-")||t.length>30)}function jl(t){let e=Array.from(t.classList).filter(Yl).slice(0,3);return e.length>0?e.join(" "):void 0}function Gl(t,e){let o=window.getComputedStyle(t),n=e?window.getComputedStyle(e):null,i={};for(let r of $l){let a=o.getPropertyValue(r.replace(/[A-Z]/g,s=>`-${s.toLowerCase()}`));if(a&&!(r==="backgroundColor"&&(a==="rgba(0, 0, 0, 0)"||a==="transparent"))&&!(r==="boxShadow"&&a==="none")){if(r==="boxShadow"&&(a="yes"),r==="fontFamily"&&(a=a.split(",")[0].trim().replace(/['"]/g,"")),n){let s=n.getPropertyValue(r.replace(/[A-Z]/g,l=>`-${l.toLowerCase()}`));if(a===s)continue}i[r]=a}}return Object.keys(i).length>0?i:void 0}function Vl(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 Jl(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 Xl(t){let e=t.tagName.toLowerCase(),o=no(t);if(o&&o.length>0||Hl.has(e))return!0;let n=t.getAttribute("role");return!!(n&&zl.has(n)||_l.has(e)||(e==="img"||e==="svg")&&(t.getAttribute("alt")||t.getAttribute("aria-label")))}function ls(){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(),Jl(g)||!Vl(g))continue;let b=g.getBoundingClientRect();if(b.width<1||b.height<1||!Xl(g))continue;let k=g.tagName.toLowerCase(),w=no(g),I=Wl(g),N=g.getAttribute("role")||void 0,L=k==="a"&&g.getAttribute("href")||void 0,h=k==="img"&&g.getAttribute("alt")||void 0,Y=(c=eo(g))==null?void 0:c.name,ot=jl(g),j=Gl(g,g.parentElement),U={tag:k,rect:{x:Math.round(b.left+window.scrollX),y:Math.round(b.top+window.scrollY),w:Math.round(b.width),h:Math.round(b.height)},depth:I};w&&(U.text=w.length>80?w.slice(0,80)+"...":w),Y&&(U.component=Y),ot&&(U.classes=ot),j&&(U.styles=j),N&&(U.role=N),L&&(U.href=L),h&&(U.alt=h),t.push({el:g,entry:U})}t.sort((g,b)=>b.entry.depth-g.entry.depth);let n=new Set;for(let g=0;g<t.length;g++){let b=t[g];if(n.has(b.el))continue;let k=b.el.parentElement;if(!k||!t.find(L=>L.el===k))continue;let I=(d=b.el.textContent)==null?void 0:d.trim(),N=(u=k.textContent)==null?void 0:u.trim();I&&N&&I===N&&n.add(b.el)}let i=t.filter(g=>!n.has(g.el)),r=new Map;for(let g of i){let b=g.el.parentElement,k=[b?Array.from(b.classList).join("."):"",g.entry.tag,(p=g.entry.component)!=null?p:"",g.entry.styles?JSON.stringify(g.entry.styles):""].join("|"),w=(f=r.get(k))!=null?f:[];w.push(g),r.set(k,w)}let a=[],s=new Set;for(let[,g]of r)if(g.length>3){a.push(g[0].entry,g[1].entry),s.add(g[0].el),s.add(g[1].el);let b=1/0,k=1/0,w=-1/0,I=-1/0;for(let N=2;N<g.length;N++){let L=g[N].entry.rect;b=Math.min(b,L.x),k=Math.min(k,L.y),w=Math.max(w,L.x+L.w),I=Math.max(I,L.y+L.h)}a.push({tag:g[0].entry.tag,text:`(+${g.length-2} similar items)`,rect:{x:Math.round(b),y:Math.round(k),w:Math.round(w-b),h:Math.round(I-k)},depth:g[0].entry.depth});for(let N of g)s.add(N.el)}for(let g of i)s.has(g.el)||a.push(g.entry);let l=Math.max(document.documentElement.scrollHeight,1);if(a.sort((g,b)=>{let k=g.rect.w*g.rect.h,w=b.rect.w*b.rect.h,I=k*(1+.5*(1-g.rect.y/l));return w*(1+.5*(1-b.rect.y/l))-I}),a.length>pi){let g=a.slice(0,pi);return g.push({tag:"truncated",text:`${a.length-pi} additional elements omitted`,rect:{x:0,y:0,w:0,h:0},depth:0}),g}return a}import{domToCanvas as Kl}from"modern-screenshot";function gi(t){let e=document.createElement("canvas").getContext("2d");return e?(e.fillStyle=t,e.fillStyle):"#888888"}function No(t,e=[],o,n){let i=new Map,r=[];for(let s of t)if(s.groupId){let l=i.get(s.groupId)||[];l.push(s),i.set(s.groupId,l)}else r.push(s);let a=[];for(let[s,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;a.push(m(x(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 s of r)a.push(m(x(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 cs(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 Ul(t,e){if(t.length===0)return[];let o=t.map(d=>({annotation:d,bounds:cs(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=[],a=50,s=Math.max(0,n-a),l=[],c=s;for(let{annotation:d,bounds:u}of o){let p=u.maxY+a;if(p-s<=e)l.push(d),c=Math.max(c,p);else{if(l.length>0){let f=(s+c)/2,g=Math.max(0,f-e/2);r.push({top:g,bottom:g+e,annotations:l})}s=Math.max(0,u.minY-a),l=[d],c=u.maxY+a}}if(l.length>0){let d=(s+c)/2,u=Math.max(0,d-e/2);r.push({top:u,bottom:u+e,annotations:l})}return r}function Zl(t,e,o,n){t.save(),t.scale(n,n);for(let i of e){let r=i.points.map(a=>({x:a.x,y:a.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 a=1;a<r.length;a++)t.lineTo(r[a].x,r[a].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 a=r[0],s=r[r.length-1],l=Math.min(a.x,s.x),c=Math.min(a.y,s.y),d=Math.abs(s.x-a.x),u=Math.abs(s.y-a.y);t.strokeRect(l,c,d,u);break}case"circle":{if(r.length<2)break;let a=r[0],s=r[r.length-1],l=(a.x+s.x)/2,c=(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(l,c,d,u,0,0,Math.PI*2),t.stroke();break}case"text":{if(!i.text||r.length<1)break;let a=r[0],s=i.fontSize||16;t.font=`${s}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(`
 `),d=s*1.2,u=4,p=0;for(let f of c)p=Math.max(p,t.measureText(f).width);t.fillRect(a.x-u,a.y-u,p+u*2,c.length*d+u*2),t.fillStyle="#ffffff",c.forEach((f,g)=>{t.fillText(f,a.x,a.y+s+g*d)});break}}}t.restore()}async function mi(t,e,o=[]){try{let n=window.devicePixelRatio||1,i=window.innerWidth,r=window.innerHeight,a=o.filter(c=>{var d;return((d=c.status)!=null?d:"pending")==="pending"});console.log("[Screenshot] Starting capture with",a.length,"active annotations (filtered",o.length-a.length,"captured)");let s=Ul(a,r);if(s.length===0){let c=await fi(t,[],window.scrollY,i,r,n);return c?[c]:[]}let l=[];for(let c=0;c<s.length;c++){let d=s[c],u=await fi(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 fi(t,e,o,n,i,r){try{let a=await Kl(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)`}}),s=document.createElement("canvas");s.width=n*r,s.height=i*r;let l=s.getContext("2d");return l?(l.drawImage(a,0,0,n*r,i*r,0,0,n*r,i*r),Zl(l,e,o,r),new Promise(c=>{s.toBlob(d=>c(d),"image/png")})):null}catch(a){return console.error("Region capture failed:",a),null}}async function Bo(t){if(t.length===0)return null;if(t.length===1)return t[0];let e=await Promise.all(t.map(s=>new Promise((l,c)=>{let d=new Image;d.onload=()=>l(d),d.onerror=c,d.src=URL.createObjectURL(s)}))),o=e[0].width,n=e.reduce((s,l)=>s+l.height,0),i=document.createElement("canvas");i.width=o,i.height=n;let r=i.getContext("2d");if(!r)return null;let a=0;for(let s of e)r.drawImage(s,0,a),a+=s.height,URL.revokeObjectURL(s.src);return new Promise(s=>{i.toBlob(l=>s(l),"image/png")})}async function Oo(t,e=[]){let n=window.innerWidth,i=window.innerHeight,r=Math.max(document.body.scrollHeight,document.documentElement.scrollHeight),a=window.scrollX,s=window.scrollY,l=[];try{let c=Math.ceil(r/i);for(let d=0;d<c;d++){let u=d*i;window.scrollTo(a,u),await new Promise(k=>requestAnimationFrame(()=>requestAnimationFrame(()=>k())));let p=u,f=u+i,g=e.filter(k=>{let w=cs(k);return w?w.maxY>=p&&w.minY<=f:!1}),b=await fi(t,g,u,n,Math.min(i,r-u),1);b&&l.push(b)}}finally{window.scrollTo(a,s)}return Bo(l)}async function ds(t,e,o){try{let n=Array.isArray(t)?t:[t];if(n.length===0)return!1;let i=await Bo(n);if(!i)return!1;let r={"image/png":i},a=e&&e.length>0,s=o&&o.length>0;if(a||s){let l=e?e.filter(c=>{var d;return((d=c.status)!=null?d:"pending")==="pending"}):[];if(l.length>0||s){let c=No(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 Me,useEffect as Ie,useMemo as _i,useRef as we,useState as Kt}from"react";import{useCallback as jn,useRef as ql}from"react";function hi(t,e,o,n){if(e.length<2)return;let i=e[0],r=e[e.length-1];if(!i||!r)return;let a=(i.x+r.x)/2,s=(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(a,s,l,c,0,0,Math.PI*2),t.stroke()}function yi(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 a=1;a<e.length-1;a++){let s=e[a],l=e[a+1];if(!s||!l)continue;let c=(s.x+l.x)/2,d=(s.y+l.y)/2;t.quadraticCurveTo(s.x,s.y,c,d)}t.lineTo(r.x,r.y),t.stroke()}}function bi(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 a=Math.min(i.x,r.x),s=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(a,s,l,c)}var Se='"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';function us(t,e,o,n,i=12,r){if(!o)return;let a=i*1.4,s=o.split(`
-`),l=r!==void 0?[r+". "+(s[0]||""),...s.slice(1)]:s;t.font=`${i}px ${Se}`,t.textBaseline="middle";let c=l.map(f=>t.measureText(f).width),d=Math.min(400,Math.max(...c)),u=l.length*a,p=l.map((f,g)=>{if(c[g]<=400)return f;let b=0,k=f.length;for(;b<k;){let w=b+k+1>>1;t.measureText(f.slice(0,w)+"\u2026").width<=400?b=w:k=w-1}return f.slice(0,b)+"\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 ps=11,vi=4,Ql=`600 ${ps}px system-ui, -apple-system, sans-serif`;function Si(t,e,o){return t.map(n=>({x:n.x-e,y:n.y-o}))}function tc(t,e,o,n,i,r){let a=String(n);t.font=Ql;let l=t.measureText(a).width+vi*2,c=ps+vi*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(a,d+vi,u+c/2)}function ec(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 fs(){let t=ql(null),e=jn(()=>{let s=t.current;if(!s)return;let l=s.getContext("2d");l&&l.clearRect(0,0,s.width,s.height)},[]),o=jn((s,l)=>{var f;let c=t.current;if(!c)return;let d=c.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":yi(d,s.points,p,s.strokeWidth);break;case"line":bi(d,s.points,p,s.strokeWidth);break;case"rectangle":xi(d,s.points,p,s.strokeWidth);break;case"circle":hi(d,s.points,p,s.strokeWidth);break;case"text":s.text&&s.points[0]&&us(d,s.points[0],s.text,p,s.fontSize,l);break}},[]),n=jn((s,l,c,d)=>{let u=t.current;if(!u||s.length<2)return;let p=u.getContext("2d");if(p)switch(l){case"freehand":yi(p,s,c,d);break;case"line":bi(p,s,c,d);break;case"rectangle":xi(p,s,c,d);break;case"circle":hi(p,s,c,d);break}},[]),i=jn((s,l)=>{let c=t.current;if(!c||s.points.length<2)return;let d=c.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,l/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),b=Math.min(u.y,p.y),k=Math.max(u.y,p.y),w=(f+g)/2,M=(b+k)/2;[{x:w,y:b},{x:w,y:k},{x:f,y:M},{x:g,y:M}].forEach(I=>{d.beginPath(),d.rect(I.x-l/2,I.y-l/2,l,l),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(k=>k.x)),p=Math.max(...s.points.map(k=>k.x)),f=Math.min(...s.points.map(k=>k.y)),g=Math.max(...s.points.map(k=>k.y));else{let k=s.points[0],w=s.points[s.points.length-1];u=Math.min(k.x,w.x),p=Math.max(k.x,w.x),f=Math.min(k.y,w.y),g=Math.max(k.y,w.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=jn((s,l,c,d,u,p,f,g=0,b=0,k)=>{var w;if(e(),s.forEach(M=>{let P=x(m({},M),{points:Si(M.points,g,b)}),I=k==null?void 0:k.get(M.id);o(P,I)}),l.length>0){let M=Si(l,g,b);n(M,c,d,u)}if(p&&p.length>0&&f){let M=t.current,P=M==null?void 0:M.getContext("2d");for(let I of p){let h=s.find(W=>W.id===I);if(h){let W=x(m({},h),{points:Si(h.points,g,b)});if(i(W,f),P&&h.type!=="text"&&k&&!(h.groupId&&s.some(Y=>Y.groupId===h.groupId&&Y.type==="text"))){let Y=k.get(h.id);if(Y!==void 0){let K=ec(W,f);if(K){let O=((w=h.status)!=null?w:h.captured?"in_flight":"pending")==="pending"?h.color:"#999999";tc(P,K.x,K.y,Y,O,f)}}}}}}},[e,o,n,i]),a=jn(()=>{let s=t.current;if(!s)return;let l=window.devicePixelRatio||1;s.width=window.innerWidth*l,s.height=window.innerHeight*l;let c=s.getContext("2d");c&&c.scale(l,l)},[]);return{canvasRef:t,clearCanvas:e,drawAnnotation:o,drawCurrentPath:n,redrawAll:r,resizeCanvas:a}}import{useEffect as nc,useRef as oc}from"react";function gs(){let t=oc({shift:!1,cmd:!1});return nc(()=>{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 ic}from"react";function ms(t,e,o,n,i){ic(()=>{let r=a=>{if(t){if(t.linkedSelector)return;a.preventDefault(),a.stopPropagation();let l=a.deltaY>0?-2:2;e(c=>c?x(m({},c),{fontSize:Math.max(12,Math.min(72,c.fontSize+l))}):null);return}if(!o)return;a.preventDefault();let s=n.find(l=>l.id===o);if(s&&s.type==="text"&&!s.linkedSelector){let l=s.fontSize||12,c=a.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])}function Fo(t){var r;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,i=new Set;for(let a of o.values()){if(a.length<=1){(r=a[0])!=null&&r.groupId&&i.add(a[0].groupId);continue}a.sort((l,c)=>c.timestamp-l.timestamp);let s=a[0];s.groupId&&i.add(s.groupId);for(let l=1;l<a.length;l++){let c=a[l];e.add(c),c.groupId&&n.add(c.groupId)}}for(let a of t)a.groupId&&n.has(a.groupId)&&!i.has(a.groupId)&&e.add(a);return e}import{useEffect as hs,useLayoutEffect as rc,useState as ys}from"react";import{jsx as wi,jsxs as xs}from"react/jsx-runtime";function sc(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 bs=["top-left","top-right","bottom-right","bottom-left"];function vs({element:t,radius:e,accentColor:o,hoveredCorner:n,draggingCorner:i,cursorViewport:r}){let[a,s]=ys(null),[l,c]=ys(!1);if(hs(()=>{let w=I=>{(I.key==="Meta"||I.key==="Control")&&c(!0)},M=I=>{(I.key==="Meta"||I.key==="Control")&&c(!1)},P=()=>c(!1);return window.addEventListener("keydown",w,!0),window.addEventListener("keyup",M,!0),window.addEventListener("blur",P),()=>{window.removeEventListener("keydown",w,!0),window.removeEventListener("keyup",M,!0),window.removeEventListener("blur",P)}},[]),hs(()=>{if(!t){s(null);return}let w=()=>{s(t.getBoundingClientRect())};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[t]),rc(()=>{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=sc(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,b=i!=null?i:n;if(b)if(l)g.add(b);else for(let w of bs)g.add(w);let k={position:"fixed",top:a.top,left:a.left,width:d,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"};return xs("div",{"data-devtools":"border-radius-handles",style:k,children:[xs("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${u}`,children:[wi("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"}),bs.map(w=>{let M=f[w],P=g.has(w);return wi("circle",{cx:M.x,cy:M.y,r:w===(i!=null?i:n)?3:2.5,fill:o,stroke:"#ffffff",strokeWidth:w===(i!=null?i:n)?4:2,paintOrder:"stroke"},w)})]}),r&&b&&(()=>{let w=Math.round(e[b]);return wi("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:w})})()]})}import{useEffect as ac,useState as lc}from"react";import{Fragment as cc,jsx as Nn,jsxs as ao}from"react/jsx-runtime";function Ss(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),a=parseInt(n[3],16);return`rgba(${i}, ${r}, ${a}, ${e})`}return`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}function Gn({element:t,isSelected:e=!1,elementInfo:o,color:n="#3b82f6",annotationNumber:i,changeCount:r,hideTooltip:a=!1}){let[s,l]=lc(null);if(ac(()=>{if(!t){l(null);return}let I=()=>{let h=t.getBoundingClientRect();l(h)};return I(),window.addEventListener("scroll",I,{passive:!0}),window.addEventListener("resize",I,{passive:!0}),()=>{window.removeEventListener("scroll",I),window.removeEventListener("resize",I)}},[t]),!s||!t)return null;let c={position:"fixed",top:s.top,left:s.left,width:s.width,height:s.height,pointerEvents:"none",zIndex:9996,backgroundColor:e?Ss(n,.1):Ss(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,b=g?`<${g}> ${u}${p}${f}`:`${u}${p}${f}`,k=22,M={position:"fixed",top:s.top>=k?s.top-k:s.bottom,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},P={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return ao(cc,{children:[ao("div",{"data-devtools":"highlight",style:c,children:[Nn("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:Nn("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"}))}),Nn("div",{style:x(m({},d),{top:-1,left:-1})}),Nn("div",{style:x(m({},d),{top:-1,right:-1})}),Nn("div",{style:x(m({},d),{bottom:-1,left:-1})}),Nn("div",{style:x(m({},d),{bottom:-1,right:-1})})]}),!a&&ao("div",{"data-devtools":"tooltip",style:M,children:[i!==void 0&&ao("span",{children:[i,"."]}),Nn("span",{style:P,children:b}),r!==void 0&&r>0&&ao("span",{style:{opacity:.8},children:["(",r," ",r===1?"change":"changes",")"]})]})]})}import{useEffect as ws,useLayoutEffect as dc,useState as ki}from"react";import{jsx as xn,jsxs as Ei}from"react/jsx-runtime";function Ci(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:i,cursorViewport:r,isAutoGap:a=!1,refreshKey:s=0}){let[l,c]=ki(null),[d,u]=ki([]),[p,f]=ki(!1);if(ws(()=>{let Y=O=>{(O.key==="Meta"||O.key==="Control")&&f(!0)},K=O=>{(O.key==="Meta"||O.key==="Control")&&f(!1)},q=()=>f(!1);return window.addEventListener("keydown",Y,!0),window.addEventListener("keyup",K,!0),window.addEventListener("blur",q),()=>{window.removeEventListener("keydown",Y,!0),window.removeEventListener("keyup",K,!0),window.removeEventListener("blur",q)}},[]),ws(()=>{if(!t){c(null),u([]);return}let Y=()=>{c(t.getBoundingClientRect()),u(An(t))};return Y(),window.addEventListener("scroll",Y,{passive:!0}),window.addEventListener("resize",Y,{passive:!0}),()=>{window.removeEventListener("scroll",Y),window.removeEventListener("resize",Y)}},[t]),dc(()=>{t&&(c(t.getBoundingClientRect()),u(An(t)))},[t,e.row,e.column,s]),!l||d.length===0)return null;let g=l.width,b=l.height,k="pm-gap-stripe-pattern",w=Ci(o,.25),M=Ci(o,.1),P=Ci(o,.2),I=8,h=2,W={position:"fixed",top:l.top,left:l.left,width:g,height:b,pointerEvents:"none",zIndex:9996,overflow:"visible"},it=i!=null?i:n;return Ei("div",{"data-devtools":"gap-handles",style:W,children:[Ei("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${g} ${b}`,children:[xn("defs",{children:xn("pattern",{id:k,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:xn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:w,strokeWidth:"1.5"})})}),xn("rect",{x:"0.5",y:"0.5",width:Math.max(0,g-1),height:Math.max(0,b-1),fill:"none",stroke:P,strokeWidth:"1"}),d.map((Y,K)=>{let q=Y.x-l.left,O=Y.y-l.top,Q=Y.w,U=Y.h,Mt=p?Y.axis===it:!0;return(Y.axis==="row"?e.row:e.column)===0?null:Ei("g",{opacity:Mt?1:.6,children:[xn("rect",{x:q,y:O,width:Q,height:U,fill:M}),xn("rect",{x:q,y:O,width:Q,height:U,fill:`url(#${k})`})]},K)}),it&&(()=>{let Y=d.filter(bt=>bt.axis===it);if(Y.length===0)return null;let K=Y[0];if(r&&Y.length>1){let bt=1/0;for(let vt of Y){let Yt=vt.x+vt.w/2,Nt=vt.y+vt.h/2,ht=Math.abs(r.x-Yt)+Math.abs(r.y-Nt);ht<bt&&(bt=ht,K=vt)}}let q=K.x-l.left,O=K.y-l.top,Q=K.w,U=K.h,Mt=q+Q/2,mt=O+U/2;if(a)return xn("circle",{cx:Mt,cy:mt,r:1.5,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let St=it==="column",Z=St?h:I,at=St?I:h,wt=Mt-Z/2,F=mt-at/2;return xn("rect",{x:wt,y:F,width:Z,height:at,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),r&&it&&(()=>{let Y=a?"auto":String(Math.round(it==="row"?e.row:e.column));return xn("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:Y})})()]})}import{useCallback as mc,useEffect as hc,useState as yc}from"react";import{useEffect as uc,useState as ks}from"react";var pc=3,fc=250,Mi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],gc=3e3;function Do(t){let[e,o]=ks(0),[n,i]=ks(()=>Math.floor(Math.random()*Mi.length));return uc(()=>{if(!t)return;let r=setInterval(()=>o(s=>(s+1)%pc),fc),a=setInterval(()=>i(s=>(s+1)%Mi.length),gc);return()=>{clearInterval(r),clearInterval(a)}},[t]),{charIndex:e,word:Mi[n]}}import{Fragment as Ii,jsx as ln,jsxs as Vn}from"react/jsx-runtime";function bc(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 Cs=22;function Es({styleModifications:t,isInspecting:e,accentColor:o,annotationGroupCount:n,dispatch:i,inFlightSelectors:r}){let[a,s]=yc([]),l=r&&r.size>0,{charIndex:c,word:d}=Do(!!l);hc(()=>{if(e){s([]);return}let g=null,b=()=>{let M=[];t.forEach((P,I)=>{let h=$e(P.selector);if(!h)return;let W=h.getBoundingClientRect();M.push({selector:P.selector,modIndex:I,top:W.top>=Cs?W.top-Cs:W.bottom,left:W.left,label:bc(P),changeCount:P.changes.length,annotationNumber:n+I+1})}),s(M)},k=()=>{g&&cancelAnimationFrame(g),g=requestAnimationFrame(b)};b(),window.addEventListener("scroll",k,!0),window.addEventListener("resize",k,!0);let w=new MutationObserver(k);return w.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),w.disconnect(),g&&cancelAnimationFrame(g)}},[t,e,n]);let u=mc(g=>{let b=t[g];if(!b)return;let k=$e(b.selector);k&&(i({type:"SELECT_ANNOTATION",payload:{id:null}}),i({type:"SET_TOOL",payload:"inspector"}),i({type:"SELECT_ELEMENT",payload:{el:k,info:b.element}}))},[t,i]);if(a.length===0)return null;let p={position:"fixed",zIndex:1e4,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,cursor:"pointer",whiteSpace:"nowrap",maxWidth:400},f={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return ln(Ii,{children:a.map(g=>{let b=r==null?void 0:r.has(g.selector);return Vn("div",{"data-devtools":"badge",style:x(m({},p),{top:g.top,left:g.left,backgroundColor:b?"#999999":o}),onClick:()=>u(g.modIndex),children:[Vn("span",{children:[g.annotationNumber,"."]}),ln("span",{style:f,children:g.label}),Vn("span",{style:{opacity:.8},children:["(",g.changeCount," ",g.changeCount===1?"change":"changes",")"]}),b&&Vn("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[ln("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?Vn(Ii,{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"})]}):Vn(Ii,{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 xc,useState as vc}from"react";import{Fragment as wc,jsx as Ts}from"react/jsx-runtime";function Sc(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 Ms({styleModifications:t,accentColor:e}){let[o,n]=vc([]);if(xc(()=>{let r=null,a=()=>{let c=[];for(let d of t){let u=$e(d.selector);if(!u)continue;let p=u.getBoundingClientRect();if(p.width===0&&p.height===0)continue;let f=Pn(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)},s=()=>{r&&cancelAnimationFrame(r),r=requestAnimationFrame(a)};a(),window.addEventListener("scroll",s,{passive:!0}),window.addEventListener("resize",s,{passive:!0});let l=new MutationObserver(s);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",s),window.removeEventListener("resize",s),l.disconnect(),r&&cancelAnimationFrame(r)}},[t]),o.length===0)return null;let i=Sc(e,.2);return Ts(wc,{children:o.map(r=>{let a={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 Ts("div",{"data-devtools":"mod-border",style:a},r.selector)})})}import{useEffect as Is,useLayoutEffect as kc,useState as Ls}from"react";import{jsx as Mn,jsxs as Ri}from"react/jsx-runtime";function Li(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 Cc={top:"bottom",bottom:"top",left:"right",right:"left"};function Ai({element:t,padding:e,accentColor:o,hoveredSide:n,draggingSide:i,cursorViewport:r,refreshKey:a}){let[s,l]=Ls(null),[c,d]=Ls(!1);if(Is(()=>{let Q=mt=>{(mt.key==="Meta"||mt.key==="Control")&&d(!0)},U=mt=>{(mt.key==="Meta"||mt.key==="Control")&&d(!1)},Mt=()=>d(!1);return window.addEventListener("keydown",Q,!0),window.addEventListener("keyup",U,!0),window.addEventListener("blur",Mt),()=>{window.removeEventListener("keydown",Q,!0),window.removeEventListener("keyup",U,!0),window.removeEventListener("blur",Mt)}},[]),Is(()=>{if(!t){l(null);return}let Q=()=>{l(t.getBoundingClientRect())};return Q(),window.addEventListener("scroll",Q,{passive:!0}),window.addEventListener("resize",Q,{passive:!0}),()=>{window.removeEventListener("scroll",Q),window.removeEventListener("resize",Q)}},[t]),kc(()=>{t&&l(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:b,left:k}=e,w="pm-stripe-pattern",M=Li(o,.25),P=Li(o,.1),I=Li(o,.2),h=8,W=2,it={position:"fixed",top:s.top,left:s.left,width:u,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"},Y=["top","right","bottom","left"],K={top:`0,0 ${u},0 ${u-g},${f} ${k},${f}`,right:`${u},0 ${u},${p} ${u-g},${p-b} ${u-g},${f}`,bottom:`0,${p} ${k},${p-b} ${u-g},${p-b} ${u},${p}`,left:`0,0 ${k},${f} ${k},${p-b} 0,${p}`},q={top:{x:u/2-h/2,y:f/2-W/2,w:h,h:W},bottom:{x:u/2-h/2,y:p-b/2-W/2,w:h,h:W},left:{x:k/2-W/2,y:p/2-h/2,w:W,h},right:{x:u-g/2-W/2,y:p/2-h/2,w:W,h}},O=new Set;return i?O.add(i):n&&(O.add(n),c||O.add(Cc[n])),Ri("div",{"data-devtools":"padding-handles",style:it,children:[Ri("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${u} ${p}`,children:[Mn("defs",{children:Mn("pattern",{id:w,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Mn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:M,strokeWidth:"1.5"})})}),Mn("rect",{x:"0.5",y:"0.5",width:Math.max(0,u-1),height:Math.max(0,p-1),fill:"none",stroke:I,strokeWidth:"1"}),Y.map(Q=>{if(e[Q]<=0)return null;let Mt=O.has(Q);return Ri("g",{opacity:Mt?1:.6,children:[Mn("polygon",{points:K[Q],fill:P}),Mn("polygon",{points:K[Q],fill:`url(#${w})`})]},Q)}),Y.map(Q=>{let U=q[Q],Mt=O.has(Q);return Mn("rect",{x:U.x,y:U.y,width:U.w,height:U.h,fill:o,stroke:"#ffffff",strokeWidth:Mt?4:2,paintOrder:"stroke"},`handle-${Q}`)})]}),r&&(n||i)&&(()=>{let Q=i!=null?i:n,U=Math.round(e[Q]);return Mn("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:U})})()]})}import{useCallback as He,useEffect as Ke,useMemo as $o,useRef as fe,useState as Te}from"react";import{AlignCenter as Tc,AlignHorizontalSpaceAround as Mc,AlignJustify as Ic,AlignLeft as Lc,AlignRight as Rc,AlignVerticalSpaceAround as Ac,Baseline as Pc,Check as Ho,ChevronDown as Wo,Columns3 as Nc,Grid2x2 as Bc,MoveHorizontal as Rs,Plus as As,RectangleHorizontal as Oc,RotateCcw as Fc,Rows3 as Dc,Shrink as Hc,UnfoldHorizontal as Ps,UnfoldVertical as Ns,WholeWord as zc,X as zs}from"lucide-react";var Ec="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",cn={borderWidth:3,borderStyle:"solid",borderImage:`url("${Ec}") 4 / 1.9 / 0 round`};import{Fragment as _o,jsx as E,jsxs as yt}from"react/jsx-runtime";function _s(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),a=parseInt(n[3],16);return`rgba(${i}, ${r}, ${a}, ${e})`}return`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}var Bs=[{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 _c(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 Os(t,e){return!e||t==="auto"||t==="fit-content"||t==="max-content"||t==="min-content"?"hug":t==="100%"||e==="100%"?"fill":"fixed"}function Pi(t,e){switch(t){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let o=Jn(e);if(typeof o.num=="number"&&!isNaN(o.num)){let n=o.unit==="%"?"px":o.unit||"px";return`${o.num}${n}`}return"auto"}}}function lo(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 $c(t,e){return t==="grid"?"grid":t==="flex"||t==="inline-flex"?e==="column"||e==="column-reverse"?"flex-col":"flex-row":"block"}function Wc(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 Sn="rgba(0, 0, 0, 0.04)",We={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},Oi={"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 uo(t){var e,o;return(o=(e=Oi[t])==null?void 0:e[0])!=null?o:"px"}function Bi(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 a=parseFloat(i);if(!isNaN(a)){if(n){let{unit:s}=Jn(o);return`${a}${s||uo(e)}`}return`${a}${uo(e)}`}return i}function $s(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}function Fs({label:t,property:e,cssValue:o,mode:n,onValueChange:i,onModeChange:r,modified:a,dimmed:s,dropdownOpen:l,onDropdownChange:c,panelContentRef:d,accentColor:u="#3b82f6",onReset:p,minValue:f,maxValue:g,onMinChange:b,onMaxChange:k,onMinReset:w,onMaxReset:M,minModified:P,maxModified:I}){let h=Jn(o),W=a&&h.unit||uo(e),it=!a&&h.unit&&h.unit!==W?$s(h.num,W):h.num,[Y,K]=Te(!1),[q,O]=Te(String(it)),[Q,U]=Te(!1),Mt=fe(null),mt=fe(null),St=fe(null),Z=fe(!1);Ke(()=>{Y||O(String(it))},[it,Y]),Ke(()=>{if(!l)return;let ht=ut=>{mt.current&&!mt.current.contains(ut.target)&&St.current&&!St.current.contains(ut.target)&&(c==null||c(!1))},ue=ut=>{ut.key==="Escape"&&(c==null||c(!1))};return document.addEventListener("mousedown",ht),document.addEventListener("keydown",ue),()=>{document.removeEventListener("mousedown",ht),document.removeEventListener("keydown",ue)}},[l,c]),Ke(()=>{Y&&Mt.current&&(Mt.current.focus(),Mt.current.select())},[Y]);let at=()=>{let ht=Bi(q,e,o,a);i(ht||`${Math.max(0,parseFloat(q)||0)}${W}`),K(!1)},wt=()=>{if(Z.current){Z.current=!1;return}at()},F=ht=>{if(ht.key==="Enter"){at();return}if(ht.key==="Escape"){Z.current=!0,O(String(it)),K(!1);return}if(ht.key==="ArrowUp"||ht.key==="ArrowDown"){ht.preventDefault();let ue=ht.key==="ArrowUp"?1:-1,ut=ht.shiftKey?8:ht.altKey?.1:1,Tt=parseFloat(q)||0,It=Math.round(Math.max(0,Tt+ue*ut)*1e3)/1e3;O(String(It)),i(`${It}${W}`)}},bt={fixed:"Fixed",hug:"Hug",fill:"Fill"},vt={fixed:E(Rs,{size:12}),hug:E(Hc,{size:12}),fill:E(Rs,{size:12})},Yt=()=>{c==null||c(!l)},Nt=()=>{if(!St.current||!(d!=null&&d.current))return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let ht=St.current.getBoundingClientRect(),ue=d.current.getBoundingClientRect(),ut=d.current.closest('[data-devtools="panel"]'),Tt=ut?ut.getBoundingClientRect():{top:0,left:0};return{position:"fixed",top:ht.bottom+4-Tt.top,left:ue.left+4-Tt.left,width:ue.width-8}};return yt("div",{ref:St,onMouseEnter:()=>U(!0),onMouseLeave:()=>U(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:Y?u:Q?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Sn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:s?.3:1},children:[E("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"?Y?E("input",{ref:Mt,type:"text",inputMode:"numeric",value:q,onChange:ht=>O(ht.target.value),onKeyDown:F,onBlur:wt,style:x(m({},We),{flex:1,minWidth:0,padding:"4px 2px"})}):E("span",{onClick:()=>K(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:it}):E("span",{style:{flex:1}}),yt("button",{type:"button",onClick:Yt,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:[bt[n],E(Wo,{size:12})]}),l&&yt("div",{ref:mt,style:x(m({},Nt()),{backgroundColor:"#ffffff",border:"1px solid rgba(0,0,0,0.1)",borderRadius:0,zIndex:10001,overflow:"hidden",fontSize:12,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace'}),children:[yt("button",{type:"button",onClick:()=>{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:[vt.fixed,yt("span",{children:["Fixed ",e," (",o,")"]}),n==="fixed"&&E(Ho,{size:14,style:{marginLeft:"auto"}})]}),yt("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:[vt.hug,E("span",{children:"Hug contents"}),n==="hug"&&E(Ho,{size:14,style:{marginLeft:"auto"}})]}),yt("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:[vt.fill,E("span",{children:"Fill container"}),n==="fill"&&E(Ho,{size:14,style:{marginLeft:"auto"}})]}),E("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),yt("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[yt("div",{style:{display:"flex",alignItems:"center",backgroundColor:Sn,borderRadius:2,padding:"4px 8px"},children:[E("span",{onClick:P?ht=>{ht.stopPropagation(),w==null||w()}:void 0,title:P?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:P?u:"#999",fontWeight:P?600:400,marginRight:8,flexShrink:0,cursor:P?"pointer":"default"},children:"Min"}),E("input",{type:"text",value:f||"",placeholder:"\u2014",onChange:ht=>b==null?void 0:b(ht.target.value),onClick:ht=>ht.stopPropagation(),style:x(m({},We),{flex:1,minWidth:0,padding:0,textAlign:"right",color:P?u:"inherit",fontWeight:P?600:400})})]}),yt("div",{style:{display:"flex",alignItems:"center",backgroundColor:Sn,borderRadius:2,padding:"4px 8px"},children:[E("span",{onClick:I?ht=>{ht.stopPropagation(),M==null||M()}:void 0,title:I?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:I?u:"#999",fontWeight:I?600:400,marginRight:8,flexShrink:0,cursor:I?"pointer":"default"},children:"Max"}),E("input",{type:"text",value:g||"",placeholder:"\u2014",onChange:ht=>k==null?void 0:k(ht.target.value),onClick:ht=>ht.stopPropagation(),style:x(m({},We),{flex:1,minWidth:0,padding:0,textAlign:"right",color:I?u:"inherit",fontWeight:I?600:400})})]})]})]})]})}function dn({children:t,style:e,dimmed:o}){let[n,i]=Te(!1);return E("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:Sn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:o?.3:1},e),children:t})}function In({children:t}){let[e,o]=Te(!1);return E("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:Sn,transition:"border-color 100ms ease"},children:t})}var zo=[{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 Yc(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],a=parseFloat(r);isNaN(a)||e.push({name:i,value:a})}return e}function Ni(t){return t.length===0?"none":t.map(e=>{var i;let o=zo.find(r=>r.name===e.name),n=(i=o==null?void 0:o.unit)!=null?i:"";return`${e.name}(${e.value}${n})`}).join(" ")}function jc({value:t,onChange:e,accentColor:o,modified:n,panelContentRef:i}){let r=Yc(t),[a,s]=Te(!1),l=fe(null),c=fe(null);Ke(()=>{if(!a)return;let P=I=>{l.current&&!l.current.contains(I.target)&&s(!1)};return document.addEventListener("mousedown",P,!0),()=>document.removeEventListener("mousedown",P,!0)},[a]);let d=zo.filter(P=>!r.some(I=>I.name===P.name)),u=P=>{let I=[...r,{name:P.name,value:P.defaultValue}];e(Ni(I)),s(!1)},p=P=>{let I=r.filter((h,W)=>W!==P);e(Ni(I))},f=(P,I)=>{let h=r.map((W,it)=>it===P?x(m({},W),{value:I}):W);e(Ni(h))},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"},b=He(P=>{var O;if(!c.current)return{position:"fixed",top:0,left:0};let I=c.current.getBoundingClientRect(),h=c.current.closest('[data-devtools="panel"]'),W=h?h.getBoundingClientRect():{top:0,left:0,bottom:9999},it=(O=i==null?void 0:i.current)==null?void 0:O.getBoundingClientRect(),Y=P*24+8,q=W.bottom-I.bottom<Y;return x(m({position:"fixed"},q?{bottom:W.bottom-I.top+2-W.top}:{top:I.bottom+2-W.top}),{left:it?it.left+4-W.left:I.left-W.left,width:it?it.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)"},w={display:"block",width:"100%",padding:"4px 10px",border:"none",backgroundColor:"transparent",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#334155",cursor:"pointer",textAlign:"left"},M=P=>E("div",{ref:l,style:m(m({},b(P.length)),k),children:P.map(I=>E("button",{type:"button",onClick:()=>u(I),style:w,onMouseEnter:h=>{h.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:h=>{h.currentTarget.style.backgroundColor="transparent"},children:I.label},I.name))});return r.length===0?yt("div",{children:[yt("div",{style:{display:"flex",alignItems:"center",gap:4},children:[E(In,{modified:!1,children:E("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:x(m({},g),{color:"#999",cursor:"default"})})}),E("button",{ref:c,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:E(As,{size:12})})]}),a&&M(zo)]}):yt("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[r.map((P,I)=>{let h=zo.find(W=>W.name===P.name);return h?yt("div",{style:{display:"flex",alignItems:"center",gap:4},children:[E("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:h.label}),E(In,{modified:n,children:yt("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[E("input",{type:"range",min:h.min,max:h.max,step:h.step,value:P.value,onChange:W=>f(I,parseFloat(W.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${o} ${(P.value-h.min)/(h.max-h.min)*100}%, rgba(0,0,0,0.1) ${(P.value-h.min)/(h.max-h.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),E("input",{type:"number",min:h.min,max:h.max,step:h.step,value:h.unit==="px"||h.unit==="deg"?Math.round(P.value):Math.round(P.value*100)/100,onChange:W=>f(I,parseFloat(W.target.value)||0),style:x(m({},g),{width:44,padding:"2px 4px",textAlign:"right",flexShrink:0})}),h.unit&&E("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:h.unit})]})}),E("button",{type:"button",onClick:()=>p(I),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:E(zs,{size:10})})]},P.name):null}),d.length>0&&yt("div",{children:[yt("button",{ref:c,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:[E(As,{size:10}),"Add filter"]}),a&&M(d)]})]})}function vn({property:t,value:e,onChange:o,isModified:n=!1,step:i=1,min:r,max:a,style:s,placeholder:l,showUnit:c=!0,unitStyle:d,preferredUnit:u,onUnitCycle:p}){let f=Jn(e),g=uo(t),b=Oi[t],w=u&&b&&b.includes(u)?u:g,M=n&&f.unit||w,P=!n&&f.unit&&f.unit!==M?$s(f.num,M):f.num,[I,h]=Te(!1),[W,it]=Te(""),Y=wt=>{h(!0),it(String(P||"")),requestAnimationFrame(()=>wt.target.select())},K=()=>{if(h(!1),W.trim()){let wt=Bi(W,t,e,n);wt&&o(wt)}},q=wt=>{let F=wt.target.value;it(F);let bt=F.trim(),vt=bt.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),Yt=bt.match(/^(-?[\d.]+)$/);if(vt){let Nt=parseFloat(vt[1]);isNaN(Nt)||o(`${Nt}${vt[2].toLowerCase()}`)}else if(Yt){let Nt=parseFloat(Yt[1]);isNaN(Nt)||o(`${Nt}${M}`)}},O=wt=>{if(wt.key==="Enter"){if(W.trim()){let F=Bi(W,t,e,n);F&&o(F)}wt.target.blur();return}if(wt.key==="ArrowUp"||wt.key==="ArrowDown"){wt.preventDefault();let F=wt.shiftKey?10:wt.altKey?.1:1,bt=(wt.key==="ArrowUp"?1:-1)*i*F,vt=parseFloat(W)||P||0,Yt=Math.round((vt+bt)*1e3)/1e3;r!==void 0&&(Yt=Math.max(r,Yt)),a!==void 0&&(Yt=Math.min(a,Yt)),it(String(Yt)),o(`${Yt}${M}`)}},Q=/^-?[\d.]/.test(e.trim()),U=I?W:Q?String(P):"",mt=I&&/\s*(rem|em|px|%)\s*$/i.test(W)?"":M,St=p&&(mt==="rem"||mt==="px"),Z={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},at=x(m({},d!=null?d:Z),{pointerEvents:"auto",cursor:"pointer"});return yt(_o,{children:[E("input",{type:"text",inputMode:"decimal",value:U,onFocus:Y,onBlur:K,onChange:q,onKeyDown:O,placeholder:l,style:s}),c&&mt&&E("span",{style:St?at:d!=null?d:Z,onClick:St?p:void 0,title:St?"Click to switch units":void 0,children:mt})]})}function Ws({value:t,resolvedValue:e,colorVariables:o,matchingVariable:n,onChange:i,accentColor:r="#3b82f6",modified:a,panelContentRef:s,isDropdownOpen:l,onDropdownChange:c}){let[d,u]=Te(!1),p=!t.includes("var(")&&n?n.usage:t,[f,g]=Te(p),[b,k]=Te(!1),[w,M]=Te(!1),[P,I]=Te(!1),h=fe(null),W=fe(null),it=fe(null),Y=l!==void 0?l:b,K=c||k,q=He(()=>{if(!it.current)return{position:"fixed",top:0,left:0,width:200};let F=it.current.getBoundingClientRect(),bt=it.current.closest('[data-devtools="panel"]'),vt=bt?bt.getBoundingClientRect():{top:0,left:0};if(s!=null&&s.current){let Yt=s.current.getBoundingClientRect();return{position:"fixed",top:F.bottom+4-vt.top,left:Yt.left+4-vt.left,width:Yt.width-8}}return{position:"fixed",top:F.bottom+4-vt.top,left:F.left-vt.left,width:F.width}},[s]);Ke(()=>{if(!d){let F=!t.includes("var(")&&n?n.usage:t;g(F)}},[t,d,n]),Ke(()=>{if(!Y&&!w)return;let F=vt=>{it.current&&!it.current.contains(vt.target)&&(K(!1),M(!1))},bt=vt=>{vt.key==="Escape"&&(K(!1),M(!1))};return document.addEventListener("mousedown",F),document.addEventListener("keydown",bt),()=>{document.removeEventListener("mousedown",F),document.removeEventListener("keydown",bt)}},[Y,w]),Ke(()=>{d&&h.current&&(h.current.focus(),h.current.select())},[d]);let O=$o(()=>{if(!f||f.startsWith("#")||f.startsWith("rgb")||f.startsWith("hsl")||f.startsWith("oklch"))return[];let F=f.toLowerCase();return o.filter(bt=>bt.name.toLowerCase().includes(F)||bt.usage.toLowerCase().includes(F)).slice(0,8)},[f,o]),Q=()=>{i(f),u(!1),M(!1)},U=F=>{g(F),F.includes("var")||F.includes("--")||F.length>0&&!F.startsWith("#")?M(!0):M(!1)},Mt=F=>{g(F.usage),i(F.usage),K(!1),M(!1),u(!1)},mt=()=>{setTimeout(()=>{!Y&&!w&&Q()},150)},St=F=>{F.key==="Enter"?Q():F.key==="Escape"&&(g(t),u(!1),M(!1))},Z=$o(()=>{let F=e.trim().toLowerCase();if(F.startsWith("#"))return F.length===4?`#${F[1]}${F[1]}${F[2]}${F[2]}${F[3]}${F[3]}`:F.slice(0,7);let bt=F.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(bt){let Yt=parseInt(bt[1],10).toString(16).padStart(2,"0"),Nt=parseInt(bt[2],10).toString(16).padStart(2,"0"),ht=parseInt(bt[3],10).toString(16).padStart(2,"0");return`#${Yt}${Nt}${ht}`}let vt=F.match(/oklch\(\s*([\d.]+)/);if(vt){let Yt=Math.max(0,Math.min(1,parseFloat(vt[1]))),Nt=Math.round(Yt*255).toString(16).padStart(2,"0");return`#${Nt}${Nt}${Nt}`}return"#000000"},[e]),at=F=>{let bt=F.target.value;g(bt),i(bt)},wt=t.includes("var(");return yt("div",{ref:it,onMouseEnter:()=>I(!0),onMouseLeave:()=>I(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:d?r:P?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Sn,transition:"border-color 100ms ease",overflow:"hidden"},children:[yt("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[yt("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[E("input",{type:"color",value:Z,onChange:at,style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),E("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:e,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),d?E("input",{ref:h,type:"text",value:f,onChange:F=>U(F.target.value),onKeyDown:St,onBlur:mt,style:x(m({},We),{flex:1,minWidth:0})}):E("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?r:"inherit"},title:p,children:p}),o.length>0&&E("button",{type:"button",onClick:()=>K(!Y),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:E(Wo,{size:12})})]}),w&&O.length>0&&E("div",{style:x(m({},q()),{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(F=>yt("button",{type:"button",onClick:()=>Mt(F),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:[E("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:F.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),E("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:F.name})]},F.name))}),Y&&E("div",{ref:W,style:x(m({},q()),{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(F=>yt("button",{type:"button",onClick:()=>Mt(F),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:p===F.usage||t===F.usage?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:p===F.usage||t===F.usage?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[E("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:F.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),E("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:F.name}),(p===F.usage||t===F.usage)&&E(Ho,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},F.name))})]})}function Gc({gridCols:t,gridRows:e,gridModified:o,accentColor:n,onColsChange:i,onRowsChange:r}){return E(dn,{style:{width:100},children:yt("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[E("input",{type:"number",min:1,max:12,value:t,onChange:a=>i(parseInt(a.target.value)||1),style:x(m({},We),{width:32,textAlign:"center",padding:2})}),E("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"}),E("input",{type:"number",min:1,max:12,value:e,onChange:a=>r(parseInt(a.target.value)||1),style:x(m({},We),{width:32,textAlign:"center",padding:2})})]})})}function Vc({element:t,getValue:e,getOriginalValue:o,handleChange:n,isModified:i,onResetProperty:r,isCollapsed:a,onToggle:s,sectionHeaderStyle:l,activeDropdown:c,onDropdownChange:d,panelContentRef:u,accentColor:p,onFieldHover:f,preferredUnit:g,onUnitCycle:b}){let k=d,w=e("display"),M=e("flex-direction"),P=$c(w,M),I=w==="flex"||w==="inline-flex",h=w==="grid",W=I||h,it=e("width"),Y=e("height"),K=i("width")?it:To(t,"width"),q=i("height")?Y:To(t,"height"),O=Os(it,K),Q=Os(Y,q),U=e("min-width"),Mt=e("max-width"),mt=e("min-height"),St=e("max-height"),Z=lo(e("padding")),at=e("gap"),wt=e("row-gap"),F=e("column-gap"),bt=e("grid-template-columns"),vt=e("grid-template-rows"),Yt=e("overflow"),Nt=bt.split(/\s+/).filter(X=>X&&X!=="none").length||1,ht=vt.split(/\s+/).filter(X=>X&&X!=="none").length||1,[ue,ut]=Te(!1),Tt=c!==null,It=Tt||ue,be=Tt?.3:ue?.65:1,oe=({mode:X,icon:Ft,active:Pt})=>E("button",{type:"button",onClick:()=>Wc(X,n),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:Pt?_s(p,.15):"transparent",color:Pt?p:"#64748b",cursor:"pointer",fontSize:14},children:Ft}),he=(X,Ft,Pt)=>{Pt==="fixed"?n(X,Ft):n(X,Pi(Pt,Ft))},G=X=>{let Ft=lo(e("padding")),Pt=X||"0";n("padding",`${Ft.top} ${Pt} ${Ft.bottom} ${Pt}`)},gt=X=>{let Ft=lo(e("padding")),Pt=X||"0";n("padding",`${Pt} ${Ft.right} ${Pt} ${Ft.left}`)},[lt,Rt]=Te({}),_t=He((X,Ft)=>Pt=>{Ft(Pt),Rt(Qe=>x(m({},Qe),{[X]:Pt}))},[]),At=He(X=>{Rt(Ft=>{let Pt=m({},Ft);return delete Pt[X],Pt})},[]),kt=He(X=>{let Ft=lo(e("padding"));jt(t,"padding",`${Ft.top} ${X} ${Ft.bottom} ${X}`)},[t,e]),Qt=He(X=>{let Ft=lo(e("padding"));jt(t,"padding",`${X} ${Ft.right} ${X} ${Ft.left}`)},[t,e]),Dt=He(X=>Ft=>{jt(t,X,Ft)},[t]),Ce=M==="column"||M==="column-reverse",re=X=>X==="center"?1:X==="flex-end"||X==="end"?2:0,pe=re(e("justify-content")),Ut=re(e("align-items")),Ee=Ce?Ut:pe,ae=Ce?pe:Ut,Ge=fe(null),ce=fe({x:0,y:0}),Ve=fe({col:Ee,row:ae});Ve.current={col:Ee,row:ae};let ve=He((X,Ft)=>{let Pt=["flex-start","center","flex-end"];Ce?(n("justify-content",Pt[Ft]),n("align-items",Pt[X])):(n("justify-content",Pt[X]),n("align-items",Pt[Ft]))},[Ce,n]),Ze=fe(ve);Ze.current=ve,Ke(()=>{let Ft=Pt=>{let Qe=Ge.current;if(!Qe||!Qe.contains(Pt.target))return;Pt.preventDefault(),Pt.stopPropagation(),ce.current.x+=Pt.deltaX,ce.current.y+=Pt.deltaY;let{col:te,row:Vt}=Ve.current,Fe=!1;Math.abs(ce.current.x)>=30&&(te=Math.max(0,Math.min(2,te+(ce.current.x>0?1:-1))),ce.current.x=0,ce.current.y=0,Fe=!0),!Fe&&Math.abs(ce.current.y)>=30&&(Vt=Math.max(0,Math.min(2,Vt+(ce.current.y>0?1:-1))),ce.current.x=0,ce.current.y=0,Fe=!0),Fe&&(te!==Ve.current.col||Vt!==Ve.current.row)&&Ze.current(te,Vt)};return document.addEventListener("wheel",Ft,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",Ft,{capture:!0})},[]);let ze=()=>E("div",{ref:Ge,onMouseEnter:()=>{ut(!0),u.current&&(u.current.style.overflowY="hidden")},onMouseLeave:()=>{ut(!1),u.current&&(u.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:Sn,borderRadius:2,display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gridTemplateRows:"repeat(3, 1fr)",padding:6,gap:2,touchAction:"none"},children:[0,1,2].map(X=>[0,1,2].map(Ft=>E("button",{type:"button",onClick:()=>ve(Ft,X),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:Ft===Ee&&X===ae?E("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:Ft===0?yt(_o,{children:[E("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),E("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),E("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):Ft===1?yt(_o,{children:[E("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),E("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),E("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):yt(_o,{children:[E("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),E("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),E("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]})}):E("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${X}-${Ft}`)))}),ye=i("grid-template-columns")||i("grid-template-rows");return yt("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[E("div",{style:l,children:E("span",{children:W?"Auto layout":"Layout"})}),yt("div",{style:{padding:"8px 12px"},children:[yt("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:Sn,borderRadius:2,padding:2,opacity:be,transition:"opacity 150ms ease"},children:[E(oe,{mode:"block",icon:E(Oc,{size:16}),active:P==="block"}),E(oe,{mode:"flex-col",icon:E(Dc,{size:16}),active:P==="flex-col"}),E(oe,{mode:"flex-row",icon:E(Nc,{size:16}),active:P==="flex-row"}),E(oe,{mode:"grid",icon:E(Bc,{size:16}),active:P==="grid"})]}),yt("div",{style:{display:"flex",gap:4,marginBottom:8},children:[E(Fs,{label:"W",property:"width",cssValue:O==="fixed"?it:`${Math.round(t.getBoundingClientRect().width)}px`,mode:O,onValueChange:X=>n("width",X),onModeChange:X=>{if(X==="fixed"){let Ft=t.getBoundingClientRect();n("width",`${Math.round(Ft.width)}px`)}else n("width",Pi(X,it))},modified:i("width"),dimmed:Tt&&c!=="width",dropdownOpen:c==="width",onDropdownChange:X=>k(X?"width":null),panelContentRef:u,accentColor:p,onReset:()=>r("width"),minValue:U!=="none"&&U!=="0px"&&U!=="auto"?U:"",maxValue:Mt!=="none"&&Mt!=="auto"?Mt:"",onMinChange:X=>n("min-width",X||"0"),onMaxChange:X=>n("max-width",X||"none"),onMinReset:()=>r("min-width"),onMaxReset:()=>r("max-width"),minModified:i("min-width"),maxModified:i("max-width")}),E(Fs,{label:"H",property:"height",cssValue:Q==="fixed"?Y:`${Math.round(t.getBoundingClientRect().height)}px`,mode:Q,onValueChange:X=>n("height",X),onModeChange:X=>{if(X==="fixed"){let Ft=t.getBoundingClientRect();n("height",`${Math.round(Ft.height)}px`)}else n("height",Pi(X,Y))},modified:i("height"),dimmed:Tt&&c!=="height",dropdownOpen:c==="height",onDropdownChange:X=>k(X?"height":null),panelContentRef:u,minValue:mt!=="none"&&mt!=="0px"&&mt!=="auto"?mt:"",maxValue:St!=="none"&&St!=="auto"?St:"",onMinChange:X=>n("min-height",X||"0"),onMaxChange:X=>n("max-height",X||"none"),onMinReset:()=>r("min-height"),onMaxReset:()=>r("max-height"),minModified:i("min-height"),maxModified:i("max-height"),accentColor:p,onReset:()=>r("height")})]}),I&&yt("div",{onMouseEnter:()=>f==null?void 0:f("gap"),onMouseLeave:()=>f==null?void 0:f("element"),style:{display:"flex",gap:8,marginBottom:8},children:[E("div",{style:{opacity:Tt?.3:1,transition:"opacity 150ms ease"},children:ze()}),yt("div",{style:{flex:1,opacity:be,transition:"opacity 150ms ease"},children:[E("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"}),E(dn,{dimmed:Tt,children:yt("div",{style:{display:"flex",alignItems:"center"},children:[E(co,{value:at,onChange:X=>{At("gap"),n("gap",X)},onPreview:_t("gap",Dt("gap")),onScrubEnd:()=>At("gap"),onReset:()=>r("gap"),isModified:i("gap"),accentColor:p,defaultUnit:g,children:M==="column"||M==="column-reverse"?E(Ns,{size:12,strokeWidth:i("gap")?2.5:1.5}):E(Ps,{size:12,strokeWidth:i("gap")?2.5:1.5})}),E(vn,{property:"gap",value:lt.gap||at,onChange:X=>n("gap",X),isModified:i("gap")||"gap"in lt,style:x(m({},We),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:b})]})})]})]}),h&&yt("div",{onMouseEnter:()=>f==null?void 0:f("gap"),onMouseLeave:()=>f==null?void 0:f("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:be,transition:"opacity 150ms ease"},children:[E(Gc,{gridCols:Nt,gridRows:ht,gridModified:ye,accentColor:p,onColsChange:X=>n("grid-template-columns",`repeat(${X}, 1fr)`),onRowsChange:X=>n("grid-template-rows",`repeat(${X}, 1fr)`)}),yt("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[E(dn,{dimmed:Tt,children:yt("div",{style:{display:"flex",alignItems:"center"},children:[E(co,{value:F||at,onChange:X=>{At("column-gap"),n("column-gap",X)},onPreview:_t("column-gap",Dt("column-gap")),onScrubEnd:()=>At("column-gap"),onReset:()=>r("column-gap"),isModified:i("column-gap"),accentColor:p,defaultUnit:g,children:E(Ps,{size:12,strokeWidth:i("column-gap")?2.5:1.5})}),E(vn,{property:"column-gap",value:lt["column-gap"]||F||at,onChange:X=>n("column-gap",X),isModified:i("column-gap")||"column-gap"in lt,placeholder:"col",style:x(m({},We),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:b})]})}),E(dn,{dimmed:Tt,children:yt("div",{style:{display:"flex",alignItems:"center"},children:[E(co,{value:wt||at,onChange:X=>{At("row-gap"),n("row-gap",X)},onPreview:_t("row-gap",Dt("row-gap")),onScrubEnd:()=>At("row-gap"),onReset:()=>r("row-gap"),isModified:i("row-gap"),accentColor:p,defaultUnit:g,children:E(Ns,{size:12,strokeWidth:i("row-gap")?2.5:1.5})}),E(vn,{property:"row-gap",value:lt["row-gap"]||wt||at,onChange:X=>n("row-gap",X),isModified:i("row-gap")||"row-gap"in lt,placeholder:"row",style:x(m({},We),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:b})]})})]})]}),W&&yt("div",{onMouseEnter:()=>f==null?void 0:f("padding"),onMouseLeave:()=>f==null?void 0:f("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:be,transition:"opacity 150ms ease"},children:[E(dn,{style:{flex:1},dimmed:Tt,children:yt("div",{style:{display:"flex",alignItems:"center"},children:[E(co,{value:Z.left,onChange:X=>{At("padding-h"),G(X)},onPreview:_t("padding-h",kt),onScrubEnd:()=>At("padding-h"),onReset:()=>r("padding"),isModified:i("padding"),accentColor:p,defaultUnit:g,snapSteps:Hs,children:E(Mc,{size:12,strokeWidth:i("padding")?2.5:1.5})}),E(vn,{property:"padding",value:lt["padding-h"]||Z.left,onChange:X=>G(X),isModified:i("padding")||"padding-h"in lt,placeholder:"H pad",style:x(m({},We),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:b})]})}),E(dn,{style:{flex:1},dimmed:Tt,children:yt("div",{style:{display:"flex",alignItems:"center"},children:[E(co,{value:Z.top,onChange:X=>{At("padding-v"),gt(X)},onPreview:_t("padding-v",Qt),onScrubEnd:()=>At("padding-v"),onReset:()=>r("padding"),isModified:i("padding"),accentColor:p,defaultUnit:g,snapSteps:Hs,children:E(Ac,{size:12,strokeWidth:i("padding")?2.5:1.5})}),E(vn,{property:"padding",value:lt["padding-v"]||Z.top,onChange:X=>gt(X),isModified:i("padding")||"padding-v"in lt,placeholder:"V pad",style:x(m({},We),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:b})]})})]}),yt("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:be,transition:"opacity 150ms ease"},children:[E("input",{type:"checkbox",checked:Yt==="hidden",onChange:X=>n("overflow",X.target.checked?"hidden":"visible"),style:{margin:0,accentColor:p}}),"Clip content"]})]})]})}var Ds={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function Jc({element:t,getValue:e,handleChange:o,isModified:n,onResetProperty:i,isCollapsed:r,onToggle:a,sectionHeaderStyle:s,accentColor:l,colorVariables:c,activeColorDropdown:d,onColorDropdownChange:u,panelContentRef:p,preferredUnit:f,onUnitCycle:g}){var Q;let b=e("font-family"),k=e("font-size"),w=e("font-weight"),M=e("line-height"),P=e("letter-spacing"),I=e("text-align"),h=e("color"),W=String(w),it=Ds[W]||W,Y=Ao(t,h),K=h.includes("var(")?null:Po(Y,c),q=({align:U,icon:Mt})=>{let mt=I===U;return E("button",{type:"button",onClick:()=>o("text-align",U),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:mt?_s(l,.15):"transparent",color:mt?l:"#64748b",cursor:"pointer"},children:Mt})},O=((Q=b.split(",")[0])==null?void 0:Q.trim().replace(/^["']|["']$/g,""))||"System";return yt("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[E("div",{style:s,children:E("span",{children:"Typography"})}),yt("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[E(dn,{children:yt("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[E("input",{type:"text",value:b,onChange:U=>o("font-family",U.target.value),style:x(m({},We),{flex:1,minWidth:0,padding:0,fontWeight:n("font-family")?600:400,color:n("font-family")?l:"inherit"}),title:b}),E(Wo,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),yt("div",{style:{display:"flex",gap:4},children:[E(dn,{style:{flex:1},children:E("select",{value:W,onChange:U=>o("font-weight",U.target.value),style:x(m({},We),{padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:n("font-weight")?600:400,color:n("font-weight")?l:"inherit"}),children:Object.entries(Ds).map(([U,Mt])=>E("option",{value:U,children:Mt},U))})}),E(dn,{style:{flex:1},children:E("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:E(vn,{property:"font-size",value:k,onChange:U=>o("font-size",U),isModified:n("font-size"),min:1,max:999,style:x(m({},We),{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})})})]}),yt("div",{style:{display:"flex",gap:4},children:[E(dn,{style:{flex:1},children:yt("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[E(Pc,{size:12,style:{color:n("line-height")?l:"#999",flexShrink:0}}),E(vn,{property:"line-height",value:M,onChange:U=>o("line-height",U),isModified:n("line-height"),step:.1,min:0,placeholder:"Auto",style:x(m({},We),{flex:1,minWidth:0,padding:0,fontWeight:n("line-height")?600:400,color:n("line-height")?l:"inherit"}),showUnit:!1})]})}),E(dn,{style:{flex:1},children:yt("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[E(zc,{size:12,style:{color:n("letter-spacing")?l:"#999",flexShrink:0}}),E(vn,{property:"letter-spacing",value:P,onChange:U=>o("letter-spacing",U),isModified:n("letter-spacing"),step:.1,placeholder:"\u2014",style:x(m({},We),{flex:1,minWidth:0,padding:0,fontWeight:n("letter-spacing")?600:400,color:n("letter-spacing")?l:"inherit"}),showUnit:!1})]})})]}),yt("div",{style:{display:"flex",gap:2,backgroundColor:Sn,borderRadius:2,padding:2},children:[E(q,{align:"left",icon:E(Lc,{size:14})}),E(q,{align:"center",icon:E(Tc,{size:14})}),E(q,{align:"right",icon:E(Rc,{size:14})}),E(q,{align:"justify",icon:E(Ic,{size:14})})]}),yt("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[E("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"}),E("div",{style:{flex:1,minWidth:0},children:E(Ws,{value:h,resolvedValue:Y,colorVariables:c,matchingVariable:K,onChange:U=>o("color",U),accentColor:l,modified:n("color"),panelContentRef:p,isDropdownOpen:d==="color",onDropdownChange:U=>u(U?"color":null)})})]})]})]})}function Jn(t){let e=t.match(/^([\d.-]+)(.*)$/);return e?{num:parseFloat(e[1]),unit:e[2]||""}:{num:0,unit:""}}var Hs=[0,1,2,4,8,12,16,20,24,28,32];function co({value:t,onChange:e,onPreview:o,onScrubEnd:n,onReset:i,isModified:r,accentColor:a,defaultUnit:s="rem",snapSteps:l,color:c,style:d,children:u}){let p=fe(null),f=fe(null),g=fe(i),b=fe(r),k=fe(!1);g.current=i,b.current=r,Ke(()=>{let M=I=>{let h=f.current;if(!h)return;h.hasMoved=!0,k.current=I.shiftKey;let W=h.unit==="rem"||h.unit==="em"?.1:1;h.accum+=I.movementX*W;let it=Math.max(0,Math.round((h.startValue+h.accum)*10)/10);if(I.shiftKey&&l){let Y=h.unit==="rem"||h.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,K=h.unit==="rem"||h.unit==="em"?it*Y:it,q=l[l.length-1];for(let O=0;O<l.length-1;O++){let Q=l[O],U=l[O+1];if(K<=(Q+U)/2){q=Q;break}if(K<U){q=U;break}}K>l[l.length-1]&&(q=Math.round(K/8)*8),it=h.unit==="rem"||h.unit==="em"?Math.round(q/Y*1e3)/1e3:q}o==null||o(`${it}${h.unit}`)},P=()=>{let I=f.current;if(!I)return;let h=Math.max(0,Math.round((I.startValue+I.accum)*10)/10);if(k.current&&l){let it=I.unit==="rem"||I.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,Y=I.unit==="rem"||I.unit==="em"?h*it:h,K=l[l.length-1];for(let q=0;q<l.length-1;q++){let O=l[q],Q=l[q+1];if(Y<=(O+Q)/2){K=O;break}if(Y<Q){K=Q;break}}Y>l[l.length-1]&&(K=Math.round(Y/8)*8),h=I.unit==="rem"||I.unit==="em"?Math.round(K/it*1e3)/1e3:K}let W=I.hasMoved&&h!==I.startValue;f.current=null,document.exitPointerLock(),W?e(`${h}${I.unit}`):I.hasMoved?o==null||o(`${I.startValue}${I.unit}`):b.current&&g.current&&g.current(),n==null||n()};return document.addEventListener("mousemove",M),document.addEventListener("mouseup",P),()=>{document.removeEventListener("mousemove",M),document.removeEventListener("mouseup",P)}},[e,o,n]);let w=He(M=>{var h;if(M.button!==0)return;M.preventDefault();let P=Jn(t),I=P.unit&&P.unit!=="px"?P.unit:s;f.current={startValue:P.num,unit:I,accum:0,hasMoved:!1},(h=p.current)==null||h.requestPointerLock()},[t,s]);return E("span",{ref:p,onMouseDown:w,title:r?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:m({color:r?a||"#3b82f6":c||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize"},d),children:u})}function Ys({element:t,elementInfo:e,selector:o,styleModifications:n,dispatch:i,onClose:r,onHover:a,accentColor:s="#3b82f6"}){var oe,he;let l=fe(null),c=fe(null),[d,u]=Te(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch(G){return!1}});Ke(()=>{if(d)return;let G=setTimeout(()=>u(!0),50);return()=>clearTimeout(G)},[d]);let[p,f]=Te(null),[g,b]=Te(null),k=p!==null||g!==null,[w,M]=Te("rem"),P=He(()=>{M(G=>G==="rem"?"px":"rem")},[]),I=fe(new Map),[h,W]=Te(""),it=$o(()=>ui(),[]);Ke(()=>{let G=gt=>{var Rt;if(gt.key!=="Escape")return;let lt=document.activeElement;lt&&((Rt=l.current)!=null&&Rt.contains(lt))||r()};return window.addEventListener("keydown",G),()=>window.removeEventListener("keydown",G)},[r]);let Y=fe({top:0,left:0,maxHeight:400}),[,K]=Te(0),q="devtools-panel-position",O=fe({x:0,y:0}),Q=fe(null),U=fe(!1);Ke(()=>{try{let G=localStorage.getItem(q);if(G){let gt=JSON.parse(G);typeof gt.top=="number"&&typeof gt.left=="number"&&(U.current=!0,Y.current=x(m({},Y.current),{top:gt.top,left:gt.left}))}}catch(G){}},[]),Ke(()=>{let G=lt=>{let Rt=Q.current;if(!Rt)return;let _t=Rt.startOffsetX+(lt.clientX-Rt.startX),At=Rt.startOffsetY+(lt.clientY-Rt.startY),kt=280,Qt=16,Dt=Math.max(Qt,Math.min(window.innerWidth-kt-Qt,Y.current.left+_t)),Ce=Math.max(Qt,Y.current.top+At);O.current={x:Dt-Y.current.left,y:Ce-Y.current.top};let re=l.current,pe=re==null?void 0:re.parentElement;if(!pe)return;pe.style.top=`${Ce}px`,pe.style.left=`${Dt}px`;let Ut=document.getElementById("devtools-toolbar"),Ee=Ut==null?void 0:Ut.getBoundingClientRect(),ae=window.innerHeight-16;Ee&&Dt+kt>Ee.left&&(ae=Ee.top-8);let Ge=Math.max(0,Ce),ce=Math.max(200,ae-Ge);re&&(re.style.maxHeight=`${ce}px`)},gt=()=>{if(!Q.current)return;let lt=Y.current.top+O.current.y,Rt=Y.current.left+O.current.x;Y.current=x(m({},Y.current),{top:lt,left:Rt}),O.current={x:0,y:0},U.current=!0;try{localStorage.setItem(q,JSON.stringify({top:lt,left:Rt}))}catch(_t){}Q.current=null};return window.addEventListener("mousemove",G),window.addEventListener("mouseup",gt),()=>{window.removeEventListener("mousemove",G),window.removeEventListener("mouseup",gt)}},[]);let Mt=He(G=>{G.button!==0||G.target.closest("button")||(G.preventDefault(),Q.current={startX:G.clientX,startY:G.clientY,startOffsetX:O.current.x,startOffsetY:O.current.y})},[]);Ke(()=>{O.current={x:0,y:0};let G=(Rt=!1)=>{let _t=l.current,At=280,kt=8,Qt,Dt;if(U.current)Qt=Y.current.top,Dt=Y.current.left;else{let ae=t.getBoundingClientRect();Dt=ae.right+kt,Qt=ae.top,Dt+At>window.innerWidth-kt&&(Dt=ae.left-At-kt),Dt<kt&&(Dt=Math.max(kt,(window.innerWidth-At)/2))}let Ce=document.getElementById("devtools-toolbar"),re=Ce==null?void 0:Ce.getBoundingClientRect(),pe=window.innerHeight-16;re&&Dt+At>re.left&&(pe=re.top-kt);let Ut=Math.max(0,Qt),Ee=Math.max(200,pe-Ut);if(Y.current={top:Qt,left:Dt,maxHeight:Ee},Rt&&_t){let ae=_t.parentElement;ae&&!U.current&&(ae.style.top=`${Qt+O.current.y}px`,ae.style.left=`${Dt+O.current.x}px`),_t.style.maxHeight=`${Ee}px`}else K(ae=>ae+1)};G(!1);let gt=()=>G(!0),lt=()=>G(!1);return window.addEventListener("scroll",gt,{passive:!0}),window.addEventListener("resize",lt,{passive:!0}),()=>{window.removeEventListener("scroll",gt),window.removeEventListener("resize",lt)}},[t]),Ke(()=>{let G=l.current;if(!G)return;let gt=lt=>{let Rt=c.current;if(!Rt){lt.preventDefault();return}let{scrollTop:_t,scrollHeight:At,clientHeight:kt}=Rt,Qt=_t<=0&&lt.deltaY<0,Dt=_t+kt>=At&&lt.deltaY>0;(Qt||Dt)&&lt.preventDefault()};return G.addEventListener("wheel",gt,{passive:!1}),()=>G.removeEventListener("wheel",gt)},[]);let mt=$o(()=>n.find(G=>G.selector===o),[n,o]),St=He(G=>{let gt=mt==null?void 0:mt.changes.find(lt=>lt.property===G);if(gt)return gt.modified;if(G.includes("color")){let lt=si(t,G);if(lt&&lt.includes("var("))return lt}return io(t,G)},[t,mt]),Z=He(G=>{if(I.current.has(G))return I.current.get(G);let gt=mt==null?void 0:mt.changes.find(Rt=>Rt.property===G);if(gt)return gt.original;let lt=io(t,G);return I.current.set(G,lt),lt},[t,mt]),at=He((G,gt)=>{let lt=Z(G);jt(t,G,gt),G==="backdrop-filter"&&jt(t,"-webkit-backdrop-filter",gt),i({type:"MODIFY_STYLE",payload:{selector:o,element:e,property:G,original:lt,modified:gt}})},[t,o,e,i,Z]),wt=He(()=>{di(o,n);let G=n.find(gt=>gt.selector===o);if(G)for(let gt of G.changes)i({type:"CLEAR_STYLE",payload:{selector:o,property:gt.property}});I.current.clear()},[o,n,i]),F=He(G=>{let gt=n.find(Rt=>Rt.selector===o);gt!=null&&gt.changes.find(Rt=>Rt.property===G)&&t instanceof HTMLElement&&(t.style.removeProperty(G),i({type:"CLEAR_STYLE",payload:{selector:o,property:G}}),I.current.delete(G))},[t,o,n,i]),bt=He(()=>{let G=h.split(";").map(gt=>gt.trim()).filter(gt=>gt);for(let gt of G){let lt=gt.indexOf(":");if(lt>0){let Rt=gt.slice(0,lt).trim(),_t=gt.slice(lt+1).trim();Rt&&_t&&at(Rt,_t)}}W("")},[h,at]),vt=He(G=>{var gt;return(gt=mt==null?void 0:mt.changes.some(lt=>lt.property===G))!=null?gt:!1},[mt]),Yt=G=>{var At;let gt=St(G.property),lt=vt(G.property),Rt=!lt&&_c(G.property,gt),_t={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};if(Rt&&G.type!=="backdrop-filter")return E(In,{modified:!1,children:E("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:kt=>at(G.property,kt.target.value),style:x(m({},_t),{color:"#999"})})});switch(G.type){case"color":{let kt=Ao(t,gt),Qt=gt.includes("var(")?null:Po(kt,it);return E(Ws,{value:gt,resolvedValue:kt,colorVariables:it,matchingVariable:Qt,onChange:Dt=>at(G.property,Dt),accentColor:s,modified:lt,panelContentRef:c,isDropdownOpen:g===G.property,onDropdownChange:Dt=>b(Dt?G.property:null)})}case"number":{if(!!Oi[G.property])return E(In,{modified:lt,children:E(vn,{property:G.property,value:gt,onChange:Dt=>at(G.property,Dt),isModified:lt,min:G.min,max:G.max,step:G.step||1,style:x(m({},_t),{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:w,onUnitCycle:P})});let{num:Qt}=Jn(gt);return E(In,{modified:lt,children:E("input",{type:"number",value:Qt,min:G.min,max:G.max,step:G.step||1,onChange:Dt=>at(G.property,Dt.target.value),style:_t})})}case"select":return E(In,{modified:lt,children:yt("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[E("select",{value:gt,onChange:kt=>at(G.property,kt.target.value),style:x(m({},_t),{cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"}),children:(At=G.options)==null?void 0:At.map(kt=>E("option",{value:kt,children:kt},kt))}),E("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:E(Wo,{size:12})})]})});case"spacing":return E(In,{modified:lt,children:E("input",{type:"text",value:gt,onChange:kt=>at(G.property,kt.target.value),placeholder:"e.g., 10px or 10px 20px",style:_t})});case"backdrop-filter":return E(jc,{value:gt,onChange:kt=>at(G.property,kt),accentColor:s,modified:lt,panelContentRef:c});default:return E(In,{modified:lt,children:E("input",{type:"text",value:gt,onChange:kt=>at(G.property,kt.target.value),style:_t})})}},Nt=(oe=mt==null?void 0:mt.changes.length)!=null?oe:0,ht=(he=mt==null?void 0:mt.captured)!=null?he:!1,ue=x(m({position:"fixed",top:Y.current.top,left:Y.current.left,width:280,maxHeight:Y.current.maxHeight,backgroundColor:"rgba(255, 255, 255, 0.85)",backdropFilter:"blur(32px)",WebkitBackdropFilter:"blur(32px)"},cn),{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"}),ut={display:"flex",alignItems:"center",justifyContent:"space-between",margin:"3px 3px 0",padding:"8px 7px 8px 12px",borderBottom:"1px solid rgba(0,0,0,0.1)",backgroundColor:"#f8fafc",cursor:Q.current?"grabbing":"grab"},Tt={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"12px 12px 6px",userSelect:"none",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontWeight:600,color:"#475569"},It={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},be={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return E("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:Y.current.top+O.current.y,left:Y.current.left+O.current.x,zIndex:1e4,pointerEvents:"none"},children:yt("div",{ref:l,"data-devtools":"panel",style:x(m({},ue),{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:[yt("div",{style:ut,onMouseDown:Mt,children:[yt("div",{style:{display:"flex",alignItems:"center",gap:8,overflow:"hidden"},children:[E("span",{style:{fontWeight:600,fontSize:11,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:e.tagName}),Nt>0&&E("span",{style:{backgroundColor:ht?"#999999":s,color:"#fff",fontSize:9,padding:"1px 4px",borderRadius:2},children:Nt})]}),yt("div",{style:{display:"flex",gap:4},children:[Nt>0&&E("button",{type:"button",onClick:wt,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:E(Fc,{size:14})}),E("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:E(zs,{size:14})})]})]}),yt("div",{ref:c,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[E("div",{style:{opacity:g?.3:1,transition:"opacity 150ms ease"},children:E(Vc,{element:t,getValue:St,getOriginalValue:Z,handleChange:at,isModified:vt,onResetProperty:F,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:Tt,activeDropdown:p,onDropdownChange:f,panelContentRef:c,accentColor:s,onFieldHover:a,preferredUnit:w,onUnitCycle:P})}),E("div",{style:{opacity:p?.3:1,transition:"opacity 150ms ease"},children:E(Jc,{element:t,getValue:St,handleChange:at,isModified:vt,onResetProperty:F,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:Tt,accentColor:s,colorVariables:it,activeColorDropdown:g,onColorDropdownChange:b,panelContentRef:c,preferredUnit:w,onUnitCycle:P})}),Bs.map((G,gt)=>{let lt=gt===Bs.length-1,Rt=g&&G.properties.some(At=>At.property===g);return yt("div",{style:{borderBottom:lt?"none":"1px solid rgba(0,0,0,0.08)",opacity:k&&!Rt?.3:1,transition:"opacity 150ms ease"},children:[E("div",{style:Tt,children:E("span",{children:G.name})}),E("div",{style:{padding:"4px 0"},children:G.properties.map(At=>{let kt=vt(At.property),Qt=Rt&&At.property!==g;return yt("div",{style:x(m({},It),{opacity:Qt?.3:1,transition:"opacity 150ms ease"}),children:[E("span",{onClick:kt?()=>F(At.property):void 0,title:kt?"Click to reset":void 0,style:x(m({},be),{color:kt?s:"#64748b",fontWeight:kt?600:400,cursor:kt?"pointer":"default"}),children:At.label}),E("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:Yt(At)})]},At.property)})})]},G.name)}),yt("div",{style:{opacity:k?.3:1,transition:"opacity 150ms ease"},children:[E("div",{style:Tt,children:E("span",{children:"Raw CSS"})}),yt("div",{style:{padding:"8px 12px"},children:[E("textarea",{value:h,onChange:G=>W(G.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"}}),h.trim()&&E("button",{type:"button",onClick:bt,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:s,color:"#fff",cursor:"pointer",opacity:h.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as Xc,useLayoutEffect as Kc,useState as Uc}from"react";import{Fragment as td,jsx as Bn,jsxs as Qc}from"react/jsx-runtime";var Fi=["flex-start","center","flex-end"],Di=["flex-start","center","flex-end"];function Zc(t){return t==="normal"||t==="flex-start"||t==="start"?"flex-start":t==="flex-end"||t==="end"?"flex-end":t==="center"?"center":null}function qc(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 js(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 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>i&&(i=s.bottom),s.right>r&&(r=s.right))}return o===1/0?null:new DOMRect(n,o,r-n,i-o)}function Gs({element:t,modifier:e,accentColor:o,refreshKey:n=0}){let[i,r]=Uc(null);if(Xc(()=>{if(!t){r(null);return}let b=()=>r(js(t));return b(),window.addEventListener("scroll",b,{passive:!0}),window.addEventListener("resize",b,{passive:!0}),()=>{window.removeEventListener("scroll",b),window.removeEventListener("resize",b)}},[t]),Kc(()=>{t&&r(js(t))},[t,n]),!i)return null;let a=i,s=window.getComputedStyle(t),l=s.display;if(l!=="flex"&&l!=="inline-flex")return null;let c=s.flexDirection,d=c==="column"||c==="column-reverse"?"vertical":"horizontal",u=d==="horizontal"?"vertical":"horizontal",p=[];if(e==="shift"){let b=Zc(s.justifyContent);if(b){let k=Fi.indexOf(b);d==="horizontal"?(k>0&&p.push("left"),k<Fi.length-1&&p.push("right")):(k>0&&p.push("up"),k<Fi.length-1&&p.push("down"))}}else{let b=qc(s.alignItems);if(b){let k=Di.indexOf(b);u==="horizontal"?(k>0&&p.push("left"),k<Di.length-1&&p.push("right")):(k>0&&p.push("up"),k<Di.length-1&&p.push("down"))}}if(p.length===0)return null;let f=14,g=7;return Bn(td,{children:p.map(b=>{let k,w;switch(b){case"right":k=a.right+f,w=a.top+a.height/2;break;case"left":k=a.left-f,w=a.top+a.height/2;break;case"down":k=a.left+a.width/2,w=a.bottom+f;break;case"up":k=a.left+a.width/2,w=a.top-f;break}let M=b==="right"?0:b==="left"?180:b==="down"?90:-90,P={position:"fixed",left:k-g,top:w-g,width:g*2,height:g*2,pointerEvents:"none",zIndex:9997};return Bn("div",{"data-devtools":"swipe-hint",style:P,children:Bn("svg",{width:g*2,height:g*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:Qc("g",{transform:`rotate(${M})`,children:[Bn("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),Bn("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),Bn("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:o,strokeWidth:"1.5",strokeLinecap:"round"}),Bn("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:o,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},b)})})}import{useEffect as ed,useLayoutEffect as nd,useState as od}from"react";import{jsx as Hi,jsxs as zi}from"react/jsx-runtime";function id(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 Vs({element:t,fontSize:e,lineHeight:o,accentColor:n,hoveredProperty:i,draggingProperty:r,cursorViewport:a}){let[s,l]=od(null);if(ed(()=>{if(!t){l(null);return}let w=()=>{l(Yn(t))};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[t]),nd(()=>{t&&l(Yn(t))},[t,e,o]),!s)return null;let c=s.width,d=s.height,u=id(n,.2),p=r!=null?r:i,f=8,g=2,b={position:"fixed",top:s.top,left:s.left,width:c,height:d,pointerEvents:"none",zIndex:9996,overflow:"visible"},k=w=>w==="font-size"?`${Math.round(e)}`:(e>0?o/e:1.2).toFixed(2).replace(/\.?0+$/,"");return zi("div",{"data-devtools":"text-handles",style:b,children:[zi("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${d}`,children:[Hi("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)&&Hi("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)&&Hi("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"})]}),a&&p&&(()=>{let w=p==="font-size"?"Aa":"Lh",M=k(p);return zi("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:[w," ",M]})})()]})}import{Fragment as Ye,jsx as st,jsxs as ge}from"react/jsx-runtime";var Js=8,$i=[0,1,2,4,8,12,16,20,24,28,32],po=22,Wi="devtools-active-text";function Xs(t,e,o=0){let n=t.left+window.scrollX+4,i=e==="top-left"?t.top+window.scrollY-po-o*po+4:t.bottom+window.scrollY+4-1+o*po;return{x:n,y:i}}function Us({state:t,dispatch:e,onScreenshot:o,inFlightAnnotationIds:n,inFlightStyleSelectors:i,inFlightSelectorColors:r,onAttachImages:a,onReply:s,onViewThread:l,activePlan:c,onModelComponentsAdd:d,onModelComponentFocus:u,onModelComponentHover:p,modelComponentNames:f,modelPanelHoveredComponent:g,modelSpacingTokenHover:b}){var wr,kr,Cr,Er,Tr,Mr,Ir,Lr,Rr,Ar;let{canvasRef:k,redrawAll:w,resizeCanvas:M}=fs(),[P,I]=Kt(!1),[h,W]=Kt(()=>{if(typeof window=="undefined")return null;try{let S=localStorage.getItem(Wi);return S?JSON.parse(S):null}catch(S){return null}}),[it,Y]=Kt(null),[K,q]=Kt(null),[O,Q]=Kt(null),U=we(null),Mt=we(null),mt=we({x:0,y:0}),St=we([]),Z=we(0),[at,wt]=Kt(null),[F,bt]=Kt(new Map),vt=we(0),Yt=we(null),[Nt,ht]=Kt(null),[ue,ut]=Kt(null),Tt=we({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}),[It,be]=Kt(null),[oe,he]=Kt(null),[G,gt]=Kt(null),[lt,Rt]=Kt(null),_t=we({x:0,y:0}),[At,kt]=Kt({x:0,y:0}),Qt=we({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}),[Dt,Ce]=Kt(null),[re,pe]=Kt(null),[Ut,Ee]=Kt(null),[ae,Ge]=Kt(!1),[ce,Ve]=Kt(0),[ve,Ze]=Kt(null),ze=we({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}),[ye,qe]=Kt(null),[X,Ft]=Kt(null),[Pt,Qe]=Kt(null),te=we({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[Vt,Fe]=Kt(null),[Ne,gn]=Kt(null),[ee,sn]=Kt(null),J=gs(),nt=we(r);nt.current=r;let y=Me(S=>{let C=nt.current;if(!C||C.size===0)return!1;for(let ot of C.keys())try{if(S.matches(ot))return!0}catch(T){}return!1},[]),L=we(t);L.current=t;let A=we(h);A.current=h;let _=we([]),Ct=we(o);Ct.current=o;let[pt,dt]=Kt(null),Bt=t.selectedAnnotationIds;_.current=Bt;let Lt=Me((S,C=!1)=>{e({type:"SELECT_ANNOTATION",payload:{id:S,addToSelection:C}})},[e]),Ht=Me(()=>{e({type:"SELECT_ANNOTATION",payload:{id:null}})},[e]),[xt,qt]=Kt(null),[le,nn]=Kt({x:window.scrollX,y:window.scrollY});Ie(()=>(M(),window.addEventListener("resize",M),()=>window.removeEventListener("resize",M)),[M]),Ie(()=>{let S=()=>{nn({x:window.scrollX,y:window.scrollY})};return window.addEventListener("scroll",S,{passive:!0}),()=>window.removeEventListener("scroll",S)},[]),Ie(()=>{h?localStorage.setItem(Wi,JSON.stringify(h)):localStorage.removeItem(Wi)},[h]),ms(h,W,it,t.annotations,e);let fn=we(at);fn.current=at,Ie(()=>{if(t.activeTool!=="model"||!t.isAnnotating)return;let S=C=>{if(!C.altKey||!fn.current)return;C.preventDefault();let ot=C.deltaY>0?-1:1;vt.current=Math.max(0,vt.current+ot);let T=Yt.current;if(T){let B=Co(T,vt.current);wt(B)}};return window.addEventListener("wheel",S,{passive:!1}),()=>window.removeEventListener("wheel",S)},[t.activeTool,t.isAnnotating]),Ie(()=>{t.activeTool!=="model"&&(wt(null),bt(new Map),vt.current=0,Yt.current=null)},[t.activeTool]),Ie(()=>{var ot;let S=(ot=at==null?void 0:at.name)!=null?ot:null,C=S&&(f!=null&&f.has(S))?S:null;p==null||p(C)},[at,f,p]);let[mn,Je]=Kt(null);Ie(()=>{var ot;if(!g){Je(null);return}let S=$n(g.name),C=g.instanceIndex;Je((ot=S[C%S.length])!=null?ot:null)},[g]);let[En,Xo]=Kt([]);Ie(()=>{var S,C;if(!b){Xo([]);return}(C=(S=b.token)==null?void 0:S.bindings)!=null&&C.length?Xo(oi(b.token)):Xo(ei(b.px))},[b]);let va=we(null),Sa=we(null);va.current=Dt,Sa.current=re,Ie(()=>{let S=["flex-start","center","flex-end"],C=["flex-start","center","flex-end"],T=null,B=!1,D=null,H=null,tt=(ft,Et)=>{let Gt=Tn(ft,Et);for(;Gt&&Gt!==document.documentElement;){let ie=window.getComputedStyle(Gt).display;if(ie==="flex"||ie==="inline-flex")return Gt;Gt=Gt.parentElement}return null},et=ft=>{let Et=window.getComputedStyle(ft).flexDirection;return Et==="column"||Et==="column-reverse"?"vertical":"horizontal"},v=ft=>{let Et=ft.getAttribute("data-pm");return Et||(Et=Math.random().toString(36).substring(2,8),ft.setAttribute("data-pm",Et)),{selector:`[data-pm="${Et}"]`,durableSelector:rn(ft)}},R=()=>{B=!0,T&&clearTimeout(T),T=setTimeout(()=>{B=!1,T=null},300)},V=(ft,Et,Xt)=>{let Gt=et(ft);if(Et===Gt){let $t=window.getComputedStyle(ft).justifyContent,de=$t==="normal"||$t==="flex-start"||$t==="start"?"flex-start":$t==="flex-end"||$t==="end"?"flex-end":$t==="center"?"center":null;if(!de)return;let Be=S.indexOf(de)+Xt;if(Be<0||Be>=S.length)return;let bn=S[Be],{selector:Rn,durableSelector:Uo}=v(ft);jt(ft,"justify-content",bn),e({type:"MODIFY_STYLES_BATCH",payload:{selector:Rn,durableSelector:Uo,element:_e(ft),changes:[{property:"justify-content",original:$t,modified:bn}]}})}else{let $t=window.getComputedStyle(ft).flexDirection,de=Gt==="horizontal"?"column":"row",{selector:an,durableSelector:Be}=v(ft);jt(ft,"flex-direction",de),e({type:"MODIFY_STYLES_BATCH",payload:{selector:an,durableSelector:Be,element:_e(ft),changes:[{property:"flex-direction",original:$t,modified:de}]}})}Ve(ie=>ie+1)},N=(ft,Et,Xt)=>{let ie=et(ft)==="horizontal"?"vertical":"horizontal";if(Et!==ie)return;let de=window.getComputedStyle(ft).alignItems,an=de==="normal"||de==="stretch"||de==="flex-start"||de==="start"?"flex-start":de==="flex-end"||de==="end"?"flex-end":de==="center"?"center":null;if(!an)return;let bn=C.indexOf(an)+Xt;if(bn<0||bn>=C.length)return;let Rn=C[bn],{selector:Uo,durableSelector:La}=v(ft);jt(ft,"align-items",Rn),e({type:"MODIFY_STYLES_BATCH",payload:{selector:Uo,durableSelector:La,element:_e(ft),changes:[{property:"align-items",original:de,modified:Rn}]}}),Ve(Ra=>Ra+1)},$=20,z=null,j=null,ct=0,Ot=(ft,Et,Xt)=>{let Gt=tt(Et,Xt);Ze(Gt?{modifier:ft,target:Gt}:null)},ne=ft=>{if(!(t.activeTool!=="hand"||!t.isAnnotating)){if(ft.key==="Shift"&&!ft.altKey){let Et=_t.current;Ot("shift",Et.x,Et.y)}else if(ft.key==="Alt"&&!ft.shiftKey){let Et=_t.current;Ot("alt",Et.x,Et.y)}}},Jt=ft=>{if(t.activeTool!=="hand"||!t.isAnnotating)return;let Et=ft.shiftKey&&!ft.altKey,Xt=ft.altKey&&!ft.shiftKey;if(!Et&&!Xt||ft.buttons!==0){z=null,j=null,ct=0,D=null,H=null,Ze(null);return}if(D===null&&(D=ft.clientX,H=ft.clientY,Ot(Et?"shift":"alt",ft.clientX,ft.clientY)),B)return;z===null&&(z=ft.clientX,j=ft.clientY,ct=0);let Gt=ft.clientX-z,ie=ft.clientY-j,$t=Math.abs(Gt)>=Math.abs(ie)?Gt:ie;if(Math.abs($t)>3){let Rn=$t>0?1:-1;if(ct!==0&&Rn!==ct){z=ft.clientX,j=ft.clientY,ct=0;return}ct=Rn}if(Math.abs(Gt)<$&&Math.abs(ie)<$)return;let de=tt(D,H);if(!de)return;let an=Math.abs(Gt)>=Math.abs(ie)?"horizontal":"vertical",bn=(an==="horizontal"?Gt:ie)>0?1:-1;z=null,j=null,ct=0,Et?V(de,an,bn):N(de,an,bn),R()},De=ft=>{(ft.key==="Shift"||ft.key==="Alt")&&(D=null,H=null,z=null,j=null,ct=0,Ze(null))},se=()=>{Ze(null),z=null,j=null,ct=0};return window.addEventListener("keydown",ne),window.addEventListener("mousemove",Jt),window.addEventListener("mousedown",se),window.addEventListener("keyup",De),()=>{window.removeEventListener("keydown",ne),window.removeEventListener("mousemove",Jt),window.removeEventListener("mousedown",se),window.removeEventListener("keyup",De),T&&clearTimeout(T)}},[t.activeTool,t.isAnnotating,e]),Ie(()=>{let S=C=>{var T;if(C.key==="Escape"){if(A.current)return;if(t.activeTool==="model"&&F.size>0){C.preventDefault(),bt(new Map);return}if(_.current.length>0){C.preventDefault(),Ht();return}}if(C.key==="Enter"&&t.activeTool==="model"&&F.size>0&&d){C.preventDefault();let B=[...F.keys()].filter(D=>!(f!=null&&f.has(D)));B.length>0&&d(B),bt(new Map);return}if((C.metaKey||C.ctrlKey)&&C.key==="v"&&St.current.length>0&&!A.current){C.preventDefault(),Z.current++;let B=Z.current*20,H=((T=St.current[0])==null?void 0:T.groupId)?Math.random().toString(36).substring(2,9):void 0,tt=St.current.map(v=>x(m({},v),{id:Math.random().toString(36).substring(2,9),groupId:v.groupId?H:void 0,timestamp:Date.now(),points:v.points.map(R=>({x:R.x+B,y:R.y+B}))}));e({type:"PASTE_ANNOTATIONS",payload:{annotations:tt}});let et=tt.find(v=>v.type!=="text")||tt[0];et&&Lt(et.id);return}let ot=_.current;if(!(ot.length===0||A.current)&&(C.key==="Delete"||C.key==="Backspace")){C.preventDefault();for(let B of ot)e({type:"DELETE_ANNOTATION",payload:{id:B}});Ht()}};return window.addEventListener("keydown",S),()=>window.removeEventListener("keydown",S)},[e,Ht,Lt,t.activeTool,F,f,d]);let hn=_i(()=>Fo(t.annotations),[t.annotations]),Qn=_i(()=>{let S=new Map,C=new Set,ot=1;for(let T of t.annotations)if(!hn.has(T))if(T.groupId){if(!C.has(T.groupId)){C.add(T.groupId);let B=t.annotations.filter(D=>D.groupId===T.groupId);for(let D of B)S.set(D.id,ot);ot++}}else S.set(T.id,ot),ot++;return S},[t.annotations,hn]),mr=_i(()=>{if(Bt.length===0)return null;let S=new Map;for(let C of Bt){let ot=t.annotations.find(B=>B.id===C);if(!ot)continue;let T=ot.groupId?t.annotations.filter(B=>B.groupId===ot.groupId):[ot];for(let B of T)if(B.linkedSelector&&!(r!=null&&r.has(B.linkedSelector))){let D=B.color||t.activeColor;S.set(B.linkedSelector,D)}}return S.size>0?S:null},[Bt,t.annotations,t.activeColor,r]);Ie(()=>{let S=t.annotations.filter(C=>!(hn.has(C)||h&&!h.isNew&&C.id===h.id));w(S,t.currentPath,t.activeTool,t.activeColor,t.strokeWidth,Bt,Js,le.x,le.y,Qn)},[t.annotations,t.currentPath,t.activeTool,t.activeColor,t.strokeWidth,w,h,Bt,le,Qn,hn]),Ie(()=>{if(K){let S=Math.random().toString(36).substring(2,9);W({id:S,point:K.point,text:"",fontSize:12,isNew:!0,groupId:K.groupId}),q(null)}},[K]),Ie(()=>{O&&(W({id:Math.random().toString(36).substring(2,9),point:O.point,text:"",fontSize:12,isNew:!0,linkedSelector:O.linkedSelector,linkedAnchor:O.linkedAnchor,elements:O.elements}),Q(null))},[O]),Ie(()=>{h&&U.current?requestAnimationFrame(()=>{var C;let S=U.current;if(S&&(S.focus(),Mt.current!==h.id&&(Mt.current=h.id,!h.isNew&&h.clickPoint))){let ot=k.current;if(!ot)return;let T=ot.getContext("2d");if(!T)return;T.font=`${h.fontSize}px ${Se}`;let B=h.fontSize*1.4,D=h.text.split(`
-`),H=h.clickPoint.y-h.point.y,tt=Math.max(0,Math.min(D.length-1,Math.floor(H/B))),et=h.clickPoint.x-h.point.x,v=D[tt]||"",R=0;for(let N=0;N<=v.length;N++){let $=T.measureText(v.substring(0,N)).width;if($>et){let z=N>0?T.measureText(v.substring(0,N-1)).width:0;R=et-z<$-et?N-1:N;break}R=N}let V=R;for(let N=0;N<tt;N++)V+=(((C=D[N])==null?void 0:C.length)||0)+1;S.setSelectionRange(V,V)}}):Mt.current=null},[h,k]);let Dn=Me(S=>{let C=k.current;if(!C)return{x:0,y:0};let ot=C.getBoundingClientRect(),T,B;if("touches"in S&&S.touches[0])T=S.touches[0].clientX,B=S.touches[0].clientY;else if("clientX"in S)T=S.clientX,B=S.clientY;else return{x:0,y:0};return{x:T-ot.left+window.scrollX,y:B-ot.top+window.scrollY}},[k]),Ln=Me((S,C,ot,T)=>{let B=ot.x-C.x,D=ot.y-C.y,H=B*B+D*D;if(H===0)return Math.sqrt((S.x-C.x)**2+(S.y-C.y)**2)<=T;let tt=Math.max(0,Math.min(1,((S.x-C.x)*B+(S.y-C.y)*D)/H)),et=C.x+tt*B,v=C.y+tt*D;return Math.sqrt((S.x-et)**2+(S.y-v)**2)<=T},[]),bo=Me(S=>{for(let ot=t.annotations.length-1;ot>=0;ot--){let T=t.annotations[ot];if(!T||hn.has(T))continue;let B=(T.strokeWidth||3)+4;switch(T.type){case"text":{if(!T.points[0]||!T.text)continue;let D=T.points[0],H=T.fontSize||12,tt=k.current;if(tt){let et=tt.getContext("2d");if(et){et.font=`${H}px ${Se}`;let v=T.text.split(`
-`),R=Math.max(...v.map(N=>et.measureText(N).width)),V=v.length*(H*1.4);if(S.x>=D.x-4-4&&S.x<=D.x+R+4+4&&S.y>=D.y-4-4&&S.y<=D.y+V+4+4)return T}}break}case"rectangle":{if(T.points.length<2)continue;let D=T.points[0],H=T.points[T.points.length-1],tt=Math.min(D.x,H.x),et=Math.max(D.x,H.x),v=Math.min(D.y,H.y),R=Math.max(D.y,H.y),V=Ln(S,{x:tt,y:v},{x:et,y:v},B),N=Ln(S,{x:tt,y:R},{x:et,y:R},B),$=Ln(S,{x:tt,y:v},{x:tt,y:R},B),z=Ln(S,{x:et,y:v},{x:et,y:R},B);if(V||N||$||z)return T;break}case"circle":{if(T.points.length<2)continue;let D=T.points[0],H=T.points[T.points.length-1],tt=(D.x+H.x)/2,et=(D.y+H.y)/2,v=Math.abs(H.x-D.x)/2,R=Math.abs(H.y-D.y)/2,V=S.x-tt,N=S.y-et,$=Math.sqrt((V/v)**2+(N/R)**2);if(Math.abs($-1)*Math.max(v,R)<=B)return T;break}case"line":{if(T.points.length<2)continue;let D=T.points[0],H=T.points[T.points.length-1];if(Ln(S,D,H,B))return T;break}case"freehand":{if(T.points.length<2)continue;for(let D=0;D<T.points.length-1;D++){let H=T.points[D],tt=T.points[D+1];if(Ln(S,H,tt,B))return T}break}}}return null},[t.annotations,k,Ln,hn]),hr=Me(S=>{let C=bo(S);return(C==null?void 0:C.type)==="text"?C:null},[bo]),yr=Me(S=>{if(Bt.length===0)return null;let C=Js/2+4;for(let ot of Bt){let T=t.annotations.find(B=>B.id===ot);if(!(!T||T.points.length<2)){if(T.type==="line"){let B=T.points[0],D=T.points[T.points.length-1];if(Math.sqrt((S.x-B.x)**2+(S.y-B.y)**2)<=C)return{handle:"start",annotationId:ot};if(Math.sqrt((S.x-D.x)**2+(S.y-D.y)**2)<=C)return{handle:"end",annotationId:ot};continue}if(T.type==="circle"){let B=T.points[0],D=T.points[T.points.length-1],H=Math.min(B.x,D.x),tt=Math.max(B.x,D.x),et=Math.min(B.y,D.y),v=Math.max(B.y,D.y),R=(H+tt)/2,V=(et+v)/2,N=[{handle:"top",x:R,y:et},{handle:"bottom",x:R,y:v},{handle:"left",x:H,y:V},{handle:"right",x:tt,y:V}];for(let{handle:$,x:z,y:j}of N)if(Math.sqrt((S.x-z)**2+(S.y-j)**2)<=C)return{handle:$,annotationId:ot};continue}if(T.type==="rectangle"||T.type==="freehand"){let B=T.points[0],D=T.points[T.points.length-1],H,tt,et,v;T.type==="freehand"?(H=Math.min(...T.points.map(V=>V.x)),tt=Math.max(...T.points.map(V=>V.x)),et=Math.min(...T.points.map(V=>V.y)),v=Math.max(...T.points.map(V=>V.y))):(H=Math.min(B.x,D.x),tt=Math.max(B.x,D.x),et=Math.min(B.y,D.y),v=Math.max(B.y,D.y));let R=[{corner:"topLeft",x:H,y:et},{corner:"topRight",x:tt,y:et},{corner:"bottomLeft",x:H,y:v},{corner:"bottomRight",x:tt,y:v}];for(let{corner:V,x:N,y:$}of R)if(Math.sqrt((S.x-N)**2+(S.y-$)**2)<=C)return{handle:V,annotationId:ot}}}}return null},[Bt,t.annotations]);Ie(()=>{let S=C=>{if(mt.current={x:C.clientX+window.scrollX,y:C.clientY+window.scrollY},!h){let ot=hr(mt.current);Y((ot==null?void 0:ot.id)||null)}};return window.addEventListener("mousemove",S),()=>window.removeEventListener("mousemove",S)},[h,hr]);let Hn=Me(()=>{var C;if(!h)return;let S=((C=h.images)==null?void 0:C.length)||0;if(h.text.trim()||S>0)if(h.isNew){let ot=_n();e({type:"ADD_TEXT",payload:m({point:h.point,text:h.text||(S>0?`[${S} image${S>1?"s":""}]`:""),fontSize:h.fontSize,id:ot,groupId:h.groupId,linkedSelector:h.linkedSelector,linkedAnchor:h.linkedAnchor,elements:h.elements},S>0?{imageCount:S}:{})}),S>0&&h.images&&a&&a(ot,h.images)}else e({type:"UPDATE_TEXT",payload:m({id:h.id,text:h.text||(S>0?`[${S} image${S>1?"s":""}]`:"")},S>0?{imageCount:S}:{})}),S>0&&h.images&&a&&a(h.id,h.images);else h.isNew||e({type:"DELETE_ANNOTATION",payload:{id:h.id}});W(null)},[h,e,a]),yn=Me(S=>{for(let C=0;C<$i.length-1;C++){let ot=$i[C],T=$i[C+1];if(S<=(ot+T)/2)return ot;if(S<T)return T}return Math.round(S/8)*8},[]),br=Me((S,C,ot,T)=>{let B=ot.top+Math.max(T.top,4),D=ot.bottom-Math.max(T.bottom,4),H=ot.left+Math.max(T.left,4),tt=ot.right-Math.max(T.right,4);if(S<ot.left||S>ot.right||C<ot.top||C>ot.bottom)return null;let et=C<B,v=C>D,R=S<H,V=S>tt;return et&&R?T.top>=T.left?"top":"left":et&&V?T.top>=T.right?"top":"right":v&&R?T.bottom>=T.left?"bottom":"left":v&&V?T.bottom>=T.right?"bottom":"right":et?"top":v?"bottom":R?"left":V?"right":null},[]),xr=Me(S=>{var D;if(!t.isAnnotating)return;if(t.inspectedElement&&t.activeTool==="hand"&&!("button"in S&&S.button===2)){S.preventDefault(),S.stopPropagation(),e({type:"SELECT_ELEMENT",payload:null});return}let C=Dn(S),ot="shiftKey"in S&&S.shiftKey;if(t.activeTool==="inspector"){if("button"in S&&S.button===2)return;if(Nt&&!y(Nt)){let H=_e(Nt),tt=rn(Nt),et=Nt.getBoundingClientRect(),v=Nt.getAttribute("data-pm");v||(v=Math.random().toString(36).substring(2,8),Nt.setAttribute("data-pm",v));let R=`[data-pm="${v}"]`,V=t.styleModifications.some(ct=>{try{return Nt.matches(ct.selector)}catch(Ot){return!1}}),N=t.annotations.filter(ct=>{if(!ct.linkedSelector)return!1;try{return Nt.matches(ct.linkedSelector)}catch(Ot){return!1}}).length,$=(V?1:0)+N,z=et.top>=po*(1+$)?"top-left":"bottom-left",j=Xs(et,z,$);Q({point:j,linkedSelector:R,linkedAnchor:z,elements:[x(m({},H),{selector:tt})]})}return}if(t.activeTool==="model"){if("button"in S&&S.button===2)return;if(at){let H=at.name;if(f!=null&&f.has(H)){u==null||u(H);return}"shiftKey"in S&&S.shiftKey?bt(et=>{let v=new Map(et);return v.has(H)?v.delete(H):v.set(H,at),v}):F.size===1&&F.has(H)?(d&&d([H]),bt(new Map)):bt(new Map([[H,at]]))}return}if(t.activeTool==="hand"&&Dt&&re){let H=Dt,tt=H.getAttribute("data-pm");tt||(tt=Math.random().toString(36).substring(2,8),H.setAttribute("data-pm",tt));let et=rn(H),v=`[data-pm="${tt}"]`,R=_e(H),V=ro(H),N=C.x-window.scrollX,$=C.y-window.scrollY,z=ae,j=window.getComputedStyle(H).justifyContent,ct=0;if(z){let ne=An(H).find(Jt=>Jt.axis===re);ct=ne?re==="column"?ne.w:ne.h:0}jt(H,"transition","none"),Qt.current={isDragging:!0,hasMoved:!1,axis:re,startX:N,startY:$,originalRow:z?ct:V.row,originalColumn:z?ct:V.column,element:H,elementInfo:x(m({},R),{selector:v}),selector:v,durableSelector:et,isAuto:z,originalJustifyContent:j,visualGap:ct},Ee({axis:re,row:z?ct:V.row,column:z?ct:V.column});return}if(t.activeTool==="hand"&&Vt&&Ne){let H=Vt,tt=H.getAttribute("data-pm");tt||(tt=Math.random().toString(36).substring(2,8),H.setAttribute("data-pm",tt));let et=`[data-pm="${tt}"]`,v=_e(H),{fontSize:R,lineHeight:V}=so(H),N=R>0?V/R:1.2,$=C.x-window.scrollX,z=C.y-window.scrollY;jt(H,"transition","none");let j=rn(H);te.current={isDragging:!0,property:Ne,startX:$,startY:z,originalFontSize:R,originalLineHeight:V,originalRatio:N,element:H,elementInfo:x(m({},v),{selector:et}),selector:et,durableSelector:j},sn({property:Ne,fontSize:R,lineHeight:V});return}if(t.activeTool==="hand"&&ye&&X){let H=ye,tt=H.getAttribute("data-pm");tt||(tt=Math.random().toString(36).substring(2,8),H.setAttribute("data-pm",tt));let et=`[data-pm="${tt}"]`,v=rn(H),R=_e(H),V=Pn(H),N=H.getBoundingClientRect(),$=Math.floor(N.height/2),z=C.y-window.scrollY;jt(H,"transition","none"),ze.current={isDragging:!0,corner:X,startY:z,original:V,maxRadius:$,element:H,elementInfo:x(m({},R),{selector:et}),selector:et,durableSelector:v},Qe({corner:X,radius:m({},V)});return}if(t.activeTool==="hand"&&It&&oe){let H=It,tt=H.getAttribute("data-pm");tt||(tt=Math.random().toString(36).substring(2,8),H.setAttribute("data-pm",tt));let et=`[data-pm="${tt}"]`,v=rn(H),R=_e(H),V=Wn(H),N=C.x-window.scrollX,$=C.y-window.scrollY;jt(H,"transition","none"),Tt.current={isDragging:!0,side:oe,startX:N,startY:$,original:V,element:H,elementInfo:x(m({},R),{selector:et}),selector:et,durableSelector:v},Rt({side:oe,padding:m({},V)});return}let T=yr(C);if(T){let H=t.annotations.find(tt=>tt.id===T.annotationId);if(H&&H.type!=="text"&&((D=H.status)!=null?D:"pending")==="pending"){qt({annotationId:T.annotationId,handle:T.handle,startPoint:C,originalPoints:[...H.points],hasMoved:!1});return}}let B=bo(C);if(B&&B.points[0]){h&&Hn(),B.type!=="text"?(Lt(B.id,ot),B.color&&e({type:"SET_COLOR",payload:B.color})):ot||Ht(),dt({annotation:B,startPoint:C,hasMoved:!1});return}if(ot||Ht(),t.activeTool==="text"){h&&Hn();let H=Math.random().toString(36).substring(2,9);W({id:H,point:C,text:"",fontSize:12,isNew:!0});return}I(!0),e({type:"START_PATH",payload:C})},[t.isAnnotating,t.activeTool,t.inspectedElement,t.annotations,h,Bt,Nt,It,oe,ye,X,Dt,re,ae,Vt,Ne,at,F,f,d,u,Dn,bo,yr,e,Lt,Ht,Hn]),vr=Me(S=>{var ot,T;let C=Dn(S);if(t.activeTool==="inspector"&&t.isAnnotating){let B=C.x-window.scrollX,D=C.y-window.scrollY,H=Tn(B,D),tt=H&&y(H)?null:H;tt!==Nt&&(ht(tt),ut(tt?_e(tt):null));return}if(t.activeTool==="model"&&t.isAnnotating){let B=C.x-window.scrollX,D=C.y-window.scrollY,H=Tn(B,D);if(H!==Yt.current&&(Yt.current=H,vt.current=0),H){let tt=Co(H,vt.current);wt(tt)}else wt(null);return}if(t.activeTool==="hand"&&t.isAnnotating){let B=C.x-window.scrollX,D=C.y-window.scrollY;_t.current={x:B,y:D},kt({x:B,y:D});let H=J.current.cmd,tt=J.current.shift;if(Qt.current.isDragging){let v=Qt.current,R=v.element;if(!R)return;if(!v.hasMoved){let z=Math.abs(B-v.startX),j=Math.abs(D-v.startY);if(z<=2&&j<=2)return;v.hasMoved=!0,v.isAuto&&(jt(R,"justify-content","normal"),jt(R,"row-gap",`${v.visualGap}px`),jt(R,"column-gap",`${v.visualGap}px`),Ge(!1))}let V=v.axis,N=v.originalRow,$=v.originalColumn;if(V==="column"){let z=B-v.startX;$=v.originalColumn+z,H||(N=v.originalRow+z)}else{let z=D-v.startY;N=v.originalRow+z,H||($=v.originalColumn+z)}N=Math.max(0,N),$=Math.max(0,$),tt&&(N=yn(N),$=yn($)),N=Math.round(N),$=Math.round($),jt(R,"row-gap",`${N}px`),jt(R,"column-gap",`${$}px`),Ee({axis:V,row:N,column:$});return}if(ze.current.isDragging){let v=ze.current,R=v.element;if(!R)return;let V=D-v.startY,N=v.corner,$=v.original,z=m({},$);if(H){let j=$[N]+V;j=Math.max(0,Math.min(v.maxRadius,j)),tt&&(j=yn(j)),j=Math.round(j),z[N]=j}else{let j=$[N]+V;j=Math.max(0,Math.min(v.maxRadius,j)),tt&&(j=yn(j)),j=Math.round(j),z={"top-left":j,"top-right":j,"bottom-right":j,"bottom-left":j}}jt(R,"border-top-left-radius",`${z["top-left"]}px`),jt(R,"border-top-right-radius",`${z["top-right"]}px`),jt(R,"border-bottom-right-radius",`${z["bottom-right"]}px`),jt(R,"border-bottom-left-radius",`${z["bottom-left"]}px`),Qe({corner:N,radius:z});return}if(te.current.isDragging){let v=te.current,R=v.element;if(!R)return;let V=v.property,N=v.originalFontSize,$=v.originalLineHeight,z=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(V==="font-size"){let ct=B-v.startX;N=v.originalFontSize+ct,N=Math.max(1,N)}else{let ct=D-v.startY;$=v.originalLineHeight+ct,$=Math.max(N,$)}if(tt)if(V==="font-size"){let ct=z[0],Ot=Math.abs(N-ct);for(let ne of z){let Jt=Math.abs(N-ne);Jt<Ot&&(ct=ne,Ot=Jt)}N=ct}else{let ct=N>0?$/N:1.2,Ot=Math.round(ct*2)/2;$=N*Math.max(1,Ot)}N=Math.round(N),$=Math.round($*10)/10,jt(R,"font-size",`${N}px`);let j=N>0?Math.round($/N*1e3)/1e3:1.2;jt(R,"line-height",`${j}`),sn({property:V,fontSize:N,lineHeight:$});return}if(Tt.current.isDragging){let v=Tt.current,R=v.element;if(!R)return;let V=v.side,N=v.original,$=N.top,z=N.right,j=N.bottom,ct=N.left;if(V==="top"){let Ot=v.startY-D;$=N.top+Ot,H||(j=N.bottom+Ot)}else if(V==="bottom"){let Ot=D-v.startY;j=N.bottom+Ot,H||($=N.top+Ot)}else if(V==="left"){let Ot=v.startX-B;ct=N.left+Ot,H||(z=N.right+Ot)}else if(V==="right"){let Ot=B-v.startX;z=N.right+Ot,H||(ct=N.left+Ot)}$=Math.max(0,$),z=Math.max(0,z),j=Math.max(0,j),ct=Math.max(0,ct),tt&&($=yn($),z=yn(z),j=yn(j),ct=yn(ct)),$=Math.round($),z=Math.round(z),j=Math.round(j),ct=Math.round(ct),jt(R,"padding",`${$}px ${z}px ${j}px ${ct}px`),Rt({side:V,padding:{top:$,right:z,bottom:j,left:ct}});return}let et=Tn(B,D);for(;et&&et.tagName==="A";)et=et.parentElement;{let R=[];et&&R.push(et),ye&&ye!==et&&R.push(ye);let V=null,N=16,$=null;for(let z of R){let j=z.getBoundingClientRect(),ct=Pn(z),Ot=[["top-left",j.left,j.top+ct["top-left"]],["top-right",j.right,j.top+ct["top-right"]],["bottom-right",j.right,j.bottom-ct["bottom-right"]],["bottom-left",j.left,j.bottom-ct["bottom-left"]]];for(let[ne,Jt,De]of Ot){let se=Math.hypot(B-Jt,D-De);se<N&&(N=se,V=ne,$=z)}}if(V&&$){qe($),Ft(V),It&&be(null),oe&&he(null),Dt&&Ce(null),re&&pe(null),Ge(!1),Vt&&Fe(null),Ne&&gn(null);return}}ye&&qe(null),X&&Ft(null);{let v=[];et&&Mo(et)&&v.push(et);let R=(ot=et==null?void 0:et.parentElement)!=null?ot:null;for(;R&&R!==document.body&&v.length<3;)Mo(R)&&v.push(R),R=R.parentElement;for(let V of v){let $=An(V).find(z=>B>=z.x&&B<=z.x+z.w&&D>=z.y&&D<=z.y+z.h);if($){Ce(V),pe($.axis),Ge(ai(V,$.axis)),It&&be(null),oe&&he(null),Vt&&Fe(null),Ne&&gn(null);return}}}Dt&&Ce(null),re&&pe(null),Ge(!1);{let R=[];et&&R.push(et),Vt&&Vt!==et&&R.push(Vt);let V=null,N=1/0,$=null;for(let z of R){if(!li(z))continue;let j=Yn(z);if(!j)continue;let ct=B>=j.left&&B<=j.right&&D>=j.top&&D<=j.bottom,Ot=[["font-size",j.right,j.top+j.height/2],["line-height",j.left+j.width/2,j.bottom]];for(let[ne,Jt,De]of Ot){let se=Math.hypot(B-Jt,D-De);(ct||se<12)&&se<N&&(N=se,V=ne,$=z)}}V&&$?(Fe($),gn(V)):(Vt&&Fe(null),Ne&&gn(null))}if(et!==It&&be(et),et){let v=Wn(et),R=et.getBoundingClientRect(),V=br(B,D,R,v);he(V)}else he(null);return}if(xt){let{handle:B,originalPoints:D,hasMoved:H}=xt,tt=t.annotations.find(N=>N.id===xt.annotationId);if(!tt)return;let et="metaKey"in S,v=et&&(S.metaKey||S.ctrlKey),R=et&&S.shiftKey,V;if(tt.type==="line"){let N=D[0],$=D[D.length-1];B==="start"?V=[C,$]:V=[N,C]}else if(tt.type==="freehand"){let N=Math.min(...D.map($t=>$t.x)),$=Math.max(...D.map($t=>$t.x)),z=Math.min(...D.map($t=>$t.y)),j=Math.max(...D.map($t=>$t.y)),ct=(N+$)/2,Ot=(z+j)/2,ne=$-N||1,Jt=j-z||1,De=ne/Jt,se=N,ft=$,Et=z,Xt=j;switch(B){case"topLeft":se=C.x,Et=C.y;break;case"topRight":ft=C.x,Et=C.y;break;case"bottomLeft":se=C.x,Xt=C.y;break;case"bottomRight":ft=C.x,Xt=C.y;break}if(v)switch(B){case"topLeft":ft=$+(N-se),Xt=j+(z-Et);break;case"topRight":se=N-(ft-$),Xt=j+(z-Et);break;case"bottomLeft":ft=$+(N-se),Et=z-(Xt-j);break;case"bottomRight":se=N-(ft-$),Et=z-(Xt-j);break}if(R){let $t=ft-se,de=Xt-Et;if(Math.abs($t/de)>De){let Be=Math.abs(de)*De*Math.sign($t);B==="topLeft"||B==="bottomLeft"?se=ft-Be:ft=se+Be}else{let Be=Math.abs($t)/De*Math.sign(de);B==="topLeft"||B==="topRight"?Et=Xt-Be:Xt=Et+Be}}let Gt=ft-se||1,ie=Xt-Et||1;V=D.map($t=>({x:se+($t.x-N)/ne*Gt,y:Et+($t.y-z)/Jt*ie}))}else if(tt.type==="circle"){let N=D[0],$=D[D.length-1],z=Math.min(N.x,$.x),j=Math.max(N.x,$.x),ct=Math.min(N.y,$.y),Ot=Math.max(N.y,$.y),ne=(z+j)/2,Jt=(ct+Ot)/2,De=j-z,se=Ot-ct,ft=z,Et=j,Xt=ct,Gt=Ot;switch(B){case"top":if(Xt=C.y,v&&(Gt=Jt+(Jt-C.y)),R){let $t=(Gt-Xt)*(De/se)/2;ft=ne-$t,Et=ne+$t}break;case"bottom":if(Gt=C.y,v&&(Xt=Jt-(C.y-Jt)),R){let $t=(Gt-Xt)*(De/se)/2;ft=ne-$t,Et=ne+$t}break;case"left":if(ft=C.x,v&&(Et=ne+(ne-C.x)),R){let $t=(Et-ft)*(se/De)/2;Xt=Jt-$t,Gt=Jt+$t}break;case"right":if(Et=C.x,v&&(ft=ne-(C.x-ne)),R){let $t=(Et-ft)*(se/De)/2;Xt=Jt-$t,Gt=Jt+$t}break}V=[{x:ft,y:Xt},{x:Et,y:Gt}]}else{let N=D[0],$=D[D.length-1],z=Math.min(N.x,$.x),j=Math.max(N.x,$.x),ct=Math.min(N.y,$.y),Ot=Math.max(N.y,$.y),ne=(z+j)/2,Jt=(ct+Ot)/2,De=j-z||1,se=Ot-ct||1,ft=De/se,Et=z,Xt=j,Gt=ct,ie=Ot;switch(B){case"topLeft":Et=C.x,Gt=C.y;break;case"topRight":Xt=C.x,Gt=C.y;break;case"bottomLeft":Et=C.x,ie=C.y;break;case"bottomRight":Xt=C.x,ie=C.y;break}if(v)switch(B){case"topLeft":Xt=j+(z-Et),ie=Ot+(ct-Gt);break;case"topRight":Et=z-(Xt-j),ie=Ot+(ct-Gt);break;case"bottomLeft":Xt=j+(z-Et),Gt=ct-(ie-Ot);break;case"bottomRight":Et=z-(Xt-j),Gt=ct-(ie-Ot);break}if(R){let $t=Xt-Et,de=ie-Gt;if(Math.abs($t/de)>ft){let Be=Math.abs(de)*ft*Math.sign($t);B==="topLeft"||B==="bottomLeft"?Et=Xt-Be:Xt=Et+Be}else{let Be=Math.abs($t)/ft*Math.sign(de);B==="topLeft"||B==="topRight"?Gt=ie-Be:ie=Gt+Be}}V=[{x:Et,y:Gt},{x:Xt,y:ie}]}e({type:"RESIZE_ANNOTATION",payload:{id:xt.annotationId,points:V,saveUndo:!H}}),H||qt(x(m({},xt),{hasMoved:!0}));return}if(pt&&((T=pt.annotation.status)!=null?T:"pending")==="pending"){let B=C.x-pt.startPoint.x,D=C.y-pt.startPoint.y;if((Math.abs(B)>2||Math.abs(D)>2)&&!pt.hasMoved)dt(x(m({},pt),{hasMoved:!0,startPoint:C})),e({type:"MOVE_ANNOTATION",payload:{id:pt.annotation.id,delta:{x:B,y:D},saveUndo:!0}});else if(pt.hasMoved){let tt=C.x-pt.startPoint.x,et=C.y-pt.startPoint.y;dt(x(m({},pt),{startPoint:C})),e({type:"MOVE_ANNOTATION",payload:{id:pt.annotation.id,delta:{x:tt,y:et}}})}return}!P||!t.isAnnotating||e({type:"CONTINUE_PATH",payload:C})},[P,t.isAnnotating,t.activeTool,pt,xt,Nt,It,oe,ye,X,Dt,re,Vt,Ne,Dn,e,yn,br]),Ko=Me(S=>{var T,B,D,H,tt,et;if(te.current.isDragging){let v=te.current,R=v.element;if(R&&v.selector&&v.elementInfo&&ee){R instanceof HTMLElement&&(R.style.removeProperty("font-size"),R.style.removeProperty("line-height"),R.style.removeProperty("transition"));let V=[];if(v.originalFontSize!==ee.fontSize&&(jt(R,"font-size",`${ee.fontSize}px`),V.push({property:"font-size",original:`${v.originalFontSize}px`,modified:`${ee.fontSize}px`})),v.originalLineHeight!==ee.lineHeight){let N=v.originalFontSize>0?Math.round(v.originalLineHeight/v.originalFontSize*1e3)/1e3:1.2,$=ee.fontSize>0?Math.round(ee.lineHeight/ee.fontSize*1e3)/1e3:1.2;jt(R,"line-height",`${$}`),V.push({property:"line-height",original:`${N}`,modified:`${$}`})}V.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:v.selector,durableSelector:(T=v.durableSelector)!=null?T:void 0,element:v.elementInfo,changes:V}})}te.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},sn(null);return}if(Qt.current.isDragging){let v=Qt.current,R=v.element,V="button"in S&&S.button===2;if(!v.hasMoved&&!V&&R&&v.selector&&v.elementInfo){R instanceof HTMLElement&&R.style.removeProperty("transition");let N=["space-between","space-around","stretch","normal"],$=v.originalJustifyContent||"normal",z=N.indexOf($),j=N[(z+1)%N.length],ct=[];j==="normal"?(jt(R,"justify-content","normal"),ct.push({property:"justify-content",original:v.originalJustifyContent,modified:"normal"})):j==="stretch"?(jt(R,"justify-content",j),jt(R,"row-gap","8px"),jt(R,"column-gap","8px"),ct.push({property:"justify-content",original:v.originalJustifyContent||"normal",modified:j}),v.originalRow!==8&&ct.push({property:"row-gap",original:`${v.originalRow}px`,modified:"8px"}),v.originalColumn!==8&&ct.push({property:"column-gap",original:`${v.originalColumn}px`,modified:"8px"})):(R instanceof HTMLElement&&(R.style.removeProperty("row-gap"),R.style.removeProperty("column-gap")),jt(R,"justify-content",j),ct.push({property:"justify-content",original:v.originalJustifyContent||"normal",modified:j}),v.originalRow>0&&ct.push({property:"row-gap",original:`${v.originalRow}px`,modified:"0px"}),v.originalColumn>0&&ct.push({property:"column-gap",original:`${v.originalColumn}px`,modified:"0px"})),ct.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:v.selector,durableSelector:(B=v.durableSelector)!=null?B:void 0,element:v.elementInfo,changes:ct}})}else if(v.hasMoved&&R&&v.selector&&v.elementInfo&&Ut){R instanceof HTMLElement&&(R.style.removeProperty("row-gap"),R.style.removeProperty("column-gap"),R.style.removeProperty("transition"));let N=[];v.isAuto?(R instanceof HTMLElement&&R.style.removeProperty("justify-content"),jt(R,"justify-content","normal"),jt(R,"row-gap",`${Ut.row}px`),jt(R,"column-gap",`${Ut.column}px`),N.push({property:"justify-content",original:v.originalJustifyContent,modified:"normal"}),N.push({property:"row-gap",original:"0px",modified:`${Ut.row}px`}),N.push({property:"column-gap",original:"0px",modified:`${Ut.column}px`})):(v.originalRow!==Ut.row&&(jt(R,"row-gap",`${Ut.row}px`),N.push({property:"row-gap",original:`${v.originalRow}px`,modified:`${Ut.row}px`})),v.originalColumn!==Ut.column&&(jt(R,"column-gap",`${Ut.column}px`),N.push({property:"column-gap",original:`${v.originalColumn}px`,modified:`${Ut.column}px`}))),N.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:v.selector,durableSelector:(D=v.durableSelector)!=null?D:void 0,element:v.elementInfo,changes:N}})}Qt.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},Ee(null);return}if(ze.current.isDragging){let v=ze.current,R=v.element;if(R&&v.selector&&v.elementInfo&&Pt){R instanceof HTMLElement&&(R.style.removeProperty("border-top-left-radius"),R.style.removeProperty("border-top-right-radius"),R.style.removeProperty("border-bottom-right-radius"),R.style.removeProperty("border-bottom-left-radius"),R.style.removeProperty("transition"));let V=["top-left","top-right","bottom-right","bottom-left"],N={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},$=[];for(let z of V)v.original[z]!==Pt.radius[z]&&(jt(R,N[z],`${Pt.radius[z]}px`),$.push({property:N[z],original:`${v.original[z]}px`,modified:`${Pt.radius[z]}px`}));$.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:v.selector,durableSelector:(H=v.durableSelector)!=null?H:void 0,element:v.elementInfo,changes:$}})}ze.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},Qe(null);return}if(Tt.current.isDragging){let v=Tt.current,R=v.element,V=v.selector,N=v.elementInfo;if(R&&V&&N&&lt){let $=v.original,z=lt.padding;R instanceof HTMLElement&&(R.style.removeProperty("padding"),R.style.removeProperty("transition"));let j=[],ct=[{prop:"padding-top",origVal:$.top,newVal:z.top},{prop:"padding-right",origVal:$.right,newVal:z.right},{prop:"padding-bottom",origVal:$.bottom,newVal:z.bottom},{prop:"padding-left",origVal:$.left,newVal:z.left}];for(let{prop:Ot,origVal:ne,newVal:Jt}of ct)ne!==Jt&&(jt(R,Ot,`${Jt}px`),j.push({property:Ot,original:`${ne}px`,modified:`${Jt}px`}));j.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:V,durableSelector:(tt=v.durableSelector)!=null?tt:void 0,element:N,changes:j}})}Tt.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},Rt(null);return}if(xt){qt(null);return}if(pt){if(!pt.hasMoved&&pt.annotation.type==="text"&&((et=pt.annotation.status)!=null?et:"pending")==="pending"){let v=Dn(S);W({id:pt.annotation.id,point:pt.annotation.points[0],text:pt.annotation.text||"",fontSize:pt.annotation.fontSize||12,isNew:!1,clickPoint:v,groupId:pt.annotation.groupId})}dt(null);return}if(!P)return;let C=5;if(t.currentPath.length>=2){let v=t.currentPath[0],R=t.currentPath[t.currentPath.length-1],V=Math.abs(R.x-v.x),N=Math.abs(R.y-v.y);if((t.activeTool==="line"?Math.sqrt(V*V+N*N)<C:V<C&&N<C)&&["rectangle","circle","line"].includes(t.activeTool)){I(!1),e({type:"CANCEL_PATH"});return}}let ot=Qo(t.currentPath);if(t.activeTool==="rectangle"&&t.currentPath.length>=2){let v=t.currentPath[0],R=t.currentPath[t.currentPath.length-1],V=Math.min(v.x,R.x),N=Math.max(v.y,R.y),$=t.strokeWidth/2,z=Math.random().toString(36).substring(2,9);q({point:{x:V-$+4,y:N+$+4},groupId:z}),I(!1),e({type:"FINISH_PATH",payload:{groupId:z,elements:ot}});return}I(!1),e({type:"FINISH_PATH",payload:{elements:ot}})},[P,pt,xt,lt,Pt,Ut,ee,Dn,e,t.activeTool,t.currentPath,t.strokeWidth]),wa=Me(S=>{h&&W(x(m({},h),{text:S.target.value}))},[h]),ka=Me(S=>{S.key==="Escape"?W(null):S.key==="Enter"&&!S.shiftKey&&(S.preventDefault(),Hn())},[Hn]),Ca=Me(S=>{if(!h)return;let C=S.clipboardData.items,ot=[];for(let T=0;T<C.length;T++){let B=C[T];if(B.type.startsWith("image/")){let D=B.getAsFile();D&&ot.push(D)}}ot.length>0&&(S.preventDefault(),W(T=>T?x(m({},T),{images:[...T.images||[],...ot]}):null))},[h]),Ea=Me(S=>{if(t.activeTool!=="hand"||!t.isAnnotating)return;S.preventDefault();let C=It||Dt||ye||Vt;if(C&&!y(C)){let ot=_e(C),T=rn(C);e({type:"SELECT_ELEMENT",payload:{el:C,info:x(m({},ot),{selector:T})}})}},[t.activeTool,t.isAnnotating,It,Dt,ye,Vt,e,y]);Ie(()=>{let S=t.annotations.filter(D=>D.linkedSelector);if(S.length===0)return;let C=null,ot=()=>{var H,tt,et;let D=[];for(let v of S){let R=document.querySelector(v.linkedSelector);if(!R&&((tt=(H=v.elements)==null?void 0:H[0])!=null&&tt.selector)&&v.linkedSelector.startsWith("[data-pm=")){try{R=document.querySelector(v.elements[0].selector)}catch(Jt){}if(R){let Jt=(et=v.linkedSelector.match(/data-pm="([^"]+)"/))==null?void 0:et[1];Jt&&R.setAttribute("data-pm",Jt)}}if(!R)continue;let V=R.getBoundingClientRect(),N=t.styleModifications.some(Jt=>{try{return R.matches(Jt.selector)}catch(De){return!1}}),$=S.filter(Jt=>Jt.id!==v.id&&Jt.timestamp<v.timestamp&&Jt.linkedSelector===v.linkedSelector).length,z=(N?1:0)+$,j=V.top>=po*(1+z)?"top-left":"bottom-left",ct=Xs(V,j,z),Ot=v.points[0],ne=j!==v.linkedAnchor;Ot&&(ne||Math.abs(ct.x-Ot.x)>1||Math.abs(ct.y-Ot.y)>1)&&D.push({id:v.id,point:ct,linkedAnchor:ne?j:void 0})}D.length>0&&e({type:"UPDATE_LINKED_POSITIONS",payload:{updates:D}})},T=()=>{C&&cancelAnimationFrame(C),C=requestAnimationFrame(ot)};ot(),window.addEventListener("scroll",T,!0),window.addEventListener("resize",T,!0),window.addEventListener("load",T),document.fonts.ready.then(T);let B=new MutationObserver(T);return B.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",T,!0),window.removeEventListener("resize",T,!0),window.removeEventListener("load",T),B.disconnect(),C&&cancelAnimationFrame(C)}},[t.annotations,e]);let Ta=()=>{var S,C,ot;if(!t.isAnnotating)return"default";if(xt){let{handle:T}=xt;return T==="start"||T==="end"?"move":T==="top"||T==="bottom"?"ns-resize":T==="left"||T==="right"?"ew-resize":T==="topLeft"||T==="bottomRight"?"nwse-resize":"nesw-resize"}if(t.activeTool==="text")return"text";if(t.activeTool==="hand"){let T=(S=Ut==null?void 0:Ut.axis)!=null?S:re;if(T==="row")return"ns-resize";if(T==="column")return"ew-resize";if(Pt||X)return"ns-resize";let B=(C=ee==null?void 0:ee.property)!=null?C:Ne;if(B==="font-size")return"ew-resize";if(B==="line-height")return"ns-resize";let D=(ot=lt==null?void 0:lt.side)!=null?ot:oe;return D==="top"||D==="bottom"?"ns-resize":D==="left"||D==="right"?"ew-resize":"default"}return"crosshair"},Ma={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:t.isAnnotating?"auto":"none",visibility:t.isAnnotating?"visible":"hidden",cursor:Ta()},Sr=Me(()=>{let S=k.current;if(!S||!h)return{width:100,height:12*1.4};let C=S.getContext("2d");if(!C)return{width:100,height:h.fontSize*1.4};C.font=`${h.fontSize}px ${Se}`;let T=C.measureText("Type here...").width,B=h.text.split(`
-`),D=B.length>0?Math.max(T,...B.map(tt=>C.measureText(tt||" ").width)):T,H=Math.max(1,B.length)*h.fontSize*1.4;return{width:D,height:H}},[h,k])(),Ia=h?{position:"fixed",left:h.point.x-4-le.x,top:h.point.y-4-le.y,zIndex:9999,width:Sr.width+8,height:Sr.height+8,padding:4,fontSize:h.fontSize,fontFamily:Se,color:"#ffffff",backgroundColor:t.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:"pre"}:{};return ge(Ye,{children:[st("canvas",{ref:k,id:"devtools-canvas",style:Ma,onMouseDown:xr,onMouseMove:vr,onMouseUp:S=>Ko(S),onMouseLeave:S=>Ko(S),onTouchStart:xr,onTouchMove:vr,onTouchEnd:S=>Ko(S),onContextMenu:Ea}),h&&ge(Ye,{children:[st("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),st("textarea",{id:"devtools-text-input",ref:U,value:h.text,onChange:wa,onKeyDown:ka,onPaste:Ca,onBlur:Hn,placeholder:"Type here...",style:Ia}),h.images&&h.images.length>0&&ge("div",{"data-devtools":!0,style:{position:"fixed",left:h.point.x-4-le.x,top:h.point.y-4-le.y-20,zIndex:1e4,fontSize:11,fontFamily:"system-ui, sans-serif",color:"#fff",backgroundColor:"rgba(0,0,0,0.7)",padding:"2px 6px",borderRadius:3,whiteSpace:"nowrap"},children:[h.images.length," image",h.images.length>1?"s":""," attached"]})]}),t.isAnnotating&&t.activeTool!=="hand"&&t.styleModifications.length>0&&st(Es,{styleModifications:t.styleModifications,isInspecting:!!t.inspectedElement,accentColor:t.activeColor,annotationGroupCount:new Set(t.annotations.map(S=>S.groupId||S.id)).size,dispatch:e,inFlightSelectors:i}),t.activeTool==="hand"&&t.isAnnotating&&t.styleModifications.length>0&&st(Ms,{styleModifications:t.styleModifications,accentColor:t.activeColor}),t.isAnnotating&&st(rd,{annotations:t.annotations,supersededAnnotations:hn,inFlightIds:n,scrollX:le.x,scrollY:le.y,annotationGroupMap:Qn,onViewThread:l,onSelectAnnotation:Lt}),t.isAnnotating&&((c==null?void 0:c.status)==="awaiting_approval"||(c==null?void 0:c.status)==="planning")&&c.threadId&&l&&st(sd,{annotations:t.annotations,supersededAnnotations:hn,scrollX:le.x,scrollY:le.y,annotationGroupMap:Qn,planThreadId:c.threadId,taskCount:(kr=(wr=c.tasks)==null?void 0:wr.length)!=null?kr:0,planStatus:c.status,onViewThread:l,onSelectAnnotation:Lt}),t.isAnnotating&&s&&st(ld,{annotations:t.annotations,supersededAnnotations:hn,scrollX:le.x,scrollY:le.y,onReply:s,annotationGroupMap:Qn}),t.isAnnotating&&r&&r.size>0&&st(Ks,{inFlightSelectorColors:r}),t.isAnnotating&&mr&&st(Ks,{inFlightSelectorColors:mr,animated:!1}),t.activeTool==="hand"&&t.isAnnotating&&(Ut?Qt.current.element:Dt)&&st(Ti,{element:Ut?Qt.current.element:Dt,gap:Ut?{row:Ut.row,column:Ut.column}:ro(Dt),accentColor:t.activeColor,hoveredAxis:re,draggingAxis:(Cr=Ut==null?void 0:Ut.axis)!=null?Cr:null,cursorViewport:At,isAutoGap:ae,refreshKey:ce}),t.activeTool==="hand"&&t.isAnnotating&&ve&&st(Gs,{element:ve.target,modifier:ve.modifier,accentColor:t.activeColor,refreshKey:ce}),t.activeTool==="hand"&&t.isAnnotating&&!ve&&(Pt?ze.current.element:ye)&&st(vs,{element:Pt?ze.current.element:ye,radius:(Er=Pt==null?void 0:Pt.radius)!=null?Er:Pn(ye),accentColor:t.activeColor,hoveredCorner:X,draggingCorner:(Tr=Pt==null?void 0:Pt.corner)!=null?Tr:null,cursorViewport:At}),t.activeTool==="hand"&&t.isAnnotating&&!ve&&(ee?te.current.element:Vt)&&st(Vs,{element:ee?te.current.element:Vt,fontSize:(Mr=ee==null?void 0:ee.fontSize)!=null?Mr:so(Vt).fontSize,lineHeight:(Ir=ee==null?void 0:ee.lineHeight)!=null?Ir:so(Vt).lineHeight,accentColor:t.activeColor,hoveredProperty:Ne,draggingProperty:(Lr=ee==null?void 0:ee.property)!=null?Lr:null,cursorViewport:At}),t.activeTool==="hand"&&t.isAnnotating&&!ve&&(lt?Tt.current.element:It)&&st(Ai,{element:lt?Tt.current.element:It,padding:(Rr=lt==null?void 0:lt.padding)!=null?Rr:Wn(It),accentColor:t.activeColor,hoveredSide:oe,draggingSide:(Ar=lt==null?void 0:lt.side)!=null?Ar:null,cursorViewport:At,refreshKey:ee?ee.fontSize+ee.lineHeight*1e3:0}),t.activeTool==="inspector"&&t.isAnnotating&&st(Ye,{children:Nt&&!t.inspectedElement&&(()=>{let S=!!O||!!(h!=null&&h.linkedSelector)||t.annotations.some(C=>{if(!C.linkedSelector)return!1;try{return Nt.matches(C.linkedSelector)}catch(ot){return!1}});return st(Gn,{element:Nt,isSelected:!1,elementInfo:ue,color:t.activeColor,hideTooltip:S})})()}),t.activeTool==="model"&&t.isAnnotating&&F.size>0&&[...F.entries()].map(([S,C])=>st(Gn,{element:C.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:C.rootElement.tagName.toLowerCase(),reactComponent:S},color:"#8b5cf6"},S)),t.activeTool==="model"&&t.isAnnotating&&mn&&st(Gn,{element:mn.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:mn.rootElement.tagName.toLowerCase(),reactComponent:mn.name},color:"#22c55e"}),t.activeTool==="model"&&t.isAnnotating&&En.length>0&&En.map((S,C)=>st("div",{style:{position:"absolute",left:S.x,top:S.y,width:S.width,height:S.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:S.direction==="vertical"?ge(Ye,{children:[st("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),st("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),st("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),st("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:S.height<16?-6:"50%",transform:S.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(S.height)})]}):ge(Ye,{children:[st("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),st("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),st("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),st("div",{style:{position:"absolute",left:S.width<30?0:"50%",top:(S.width<30,void 0),bottom:"calc(50% + 4px)",transform:S.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(S.width)})]})},C)),t.activeTool==="model"&&t.isAnnotating&&at&&st(Gn,{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&&ge(Ye,{children:[G&&G!=="padding"&&G!=="gap"&&(()=>{var tt;let S=new Set(t.annotations.map(et=>et.groupId||et.id)).size,C=t.inspectedElement.info.selector,ot=t.styleModifications.findIndex(et=>et.selector===C),T=ot>=0?S+ot+1:S+t.styleModifications.length+1,B=t.styleModifications.find(et=>et.selector===C),D=(tt=B==null?void 0:B.changes.length)!=null?tt:0,H=!!(B!=null&&B.captured);return st(Gn,{element:t.inspectedElement.el,isSelected:!0,elementInfo:t.inspectedElement.info,color:H?"#999999":t.activeColor,annotationNumber:T,changeCount:D})})(),G==="padding"&&st(Ai,{element:t.inspectedElement.el,padding:Wn(t.inspectedElement.el),accentColor:t.activeColor,hoveredSide:null,draggingSide:null}),G==="gap"&&st(Ti,{element:t.inspectedElement.el,gap:ro(t.inspectedElement.el),accentColor:t.activeColor,hoveredAxis:null,draggingAxis:null}),st(Ys,{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:gt,accentColor:t.activeColor})]})]})}var Zs=3,qs=250,Yi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Qs=3e3;function rd({annotations:t,supersededAnnotations:e,inFlightIds:o,scrollX:n,scrollY:i,annotationGroupMap:r,onViewThread:a,onSelectAnnotation:s}){var b,k;let[l,c]=Kt(0),[d,u]=Kt(()=>Math.floor(Math.random()*Yi.length)),p=!!(o&&o.size>0);Ie(()=>{if(!p)return;let w=setInterval(()=>{c(P=>(P+1)%Zs)},qs),M=setInterval(()=>{u(P=>(P+1)%Yi.length)},Qs);return()=>{clearInterval(w),clearInterval(M)}},[p]);let f=[];for(let w of t){if(w.type!=="text"||!w.text||!w.points[0]||e.has(w))continue;let M=w.groupId?t.filter(F=>F.groupId===w.groupId):[w],P=!!(o&&(o.has(w.id)||M.some(F=>o.has(F.id)))),I=(b=w.status)!=null?b:"pending",h=M.some(F=>F.status==="resolved"||F.status==="needs_review"),W=M.some(F=>F.threadId);if(!P&&I!=="resolved"&&I!=="needs_review"&&!h&&!W)continue;let it=w.threadId||((k=M.find(F=>F.threadId))==null?void 0:k.threadId),Y=I==="needs_review"||M.some(F=>F.status==="needs_review"),K=M.reduce((F,bt)=>{var vt;return F+((vt=bt.replyCount)!=null?vt:0)},0)||1,q=w.points[0],O=w.fontSize||12,Q=O*1.4,U=w.text.split(`
-`),Mt=r.get(w.id),mt=Mt!==void 0?[Mt+". "+(U[0]||""),...U.slice(1)]:U,Z=document.createElement("canvas").getContext("2d");if(!Z)continue;Z.font=`${O}px ${Se}`;let at=Math.min(400,Math.max(...mt.map(F=>Z.measureText(F).width))),wt=mt.length*Q;f.push({id:w.id,threadId:it,x:q.x+at+4,y:q.y-4,size:wt+8,color:w.color,isInFlight:P,isNeedsReview:Y,replyCount:K})}if(f.length===0)return null;let g=!!a;return st(Ye,{children:f.map(w=>st("div",{"data-devtools":"annotation-badge",onClick:g&&w.threadId?()=>{s==null||s(w.id),a(w.threadId)}:void 0,style:{position:"fixed",left:w.x-n,top:w.y-i,height:w.size,display:"flex",alignItems:"center",pointerEvents:g?"auto":"none",cursor:g&&w.threadId?"pointer":void 0,zIndex:9999,backgroundColor:w.color,fontFamily:Se,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:w.isInFlight?ge(Ye,{children:[st("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:l===1?ge(Ye,{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"})]}):ge(Ye,{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"})]})}),st("span",{style:{opacity:.7},children:Yi[d]})]}):ge(Ye,{children:[w.isNeedsReview?st("span",{style:{fontWeight:700},children:"?"}):ge("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",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"})]}),ge("span",{style:{opacity:.7},children:[w.replyCount," ",w.replyCount===1?"reply":"replies"]})]})},w.id))})}function sd({annotations:t,supersededAnnotations:e,scrollX:o,scrollY:n,annotationGroupMap:i,planThreadId:r,taskCount:a,planStatus:s,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",b=f.groupId?t.filter(U=>U.groupId===f.groupId):[f],k=b.some(U=>U.threadId===r),w=!k&&!f.planId&&(g==="in_flight"||g==="pending"||f.captured)&&!b.some(U=>U.status==="resolved"||U.status==="needs_review");if(!k&&!w||g==="resolved"||g==="needs_review")continue;let M=f.points[0],P=f.fontSize||12,I=P*1.4,h=f.text.split(`
-`),W=i.get(f.id),it=W!==void 0?[W+". "+(h[0]||""),...h.slice(1)]:h,K=document.createElement("canvas").getContext("2d");if(!K)continue;K.font=`${P}px ${Se}`;let q=Math.min(400,Math.max(...it.map(U=>K.measureText(U).width))),Q=it.length*I+8;d.push({annotation:f,x:M.x+q+4,y:M.y-4,size:Q,groupNumber:W})}if(d.length===0)return null;let u=s==="planning";return st(Ye,{children:d.map(({annotation:f,x:g,y:b,size:k})=>u?st(ad,{x:g-o,y:b-n,size:k,color:f.color,onClick:()=>{c==null||c(f.id),l(r)}},`plan-thinking-${f.id}`):ge("div",{"data-devtools":"plan-waiting-badge",onClick:()=>{c==null||c(f.id),l(r)},style:{position:"fixed",left:g-o,top:b-n,height:k,display:"flex",alignItems:"center",cursor:"pointer",backgroundColor:f.color,fontFamily:Se,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap",zIndex:9999,pointerEvents:"auto"},children:[ge("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[st("circle",{cx:"12",cy:"12",r:"10"}),st("path",{d:"M9.09 9a3 3 0 015.83 1c0 2-3 3-3 3"}),st("line",{x1:"12",y1:"17",x2:"12.01",y2:"17"})]}),ge("span",{style:{opacity:.7},children:[a," task",a!==1?"s":""," \u2014 approve?"]})]},`plan-waiting-${f.id}`))})}function ad({x:t,y:e,size:o,color:n,onClick:i}){let[r,a]=Kt(0),[s,l]=Kt(()=>Math.floor(Math.random()*ji.length));return Ie(()=>{let c=setInterval(()=>{a(u=>(u+1)%Zs)},qs),d=setInterval(()=>{l(u=>(u+1)%ji.length)},Qs);return()=>{clearInterval(c),clearInterval(d)}},[]),ge("div",{"data-devtools":"plan-thinking-badge",onClick:i,style:{position:"fixed",left:t,top:e,height:o,display:"flex",alignItems:"center",pointerEvents:i?"auto":"none",cursor:i?"pointer":void 0,zIndex:9999,backgroundColor:n,fontFamily:Se,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:[st("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:r===1?ge(Ye,{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"})]}):ge(Ye,{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"})]})}),st("span",{style:{opacity:.7},children:ji[s]})]})}var ji=["planning","strategizing","scheming","mapping","scoping","drafting","outlining","architecting"];function Ks({inFlightSelectorColors:t,animated:e=!0}){let[o,n]=Kt([]);if(Ie(()=>{if(t.size===0){n([]);return}let r=null,a=()=>{let c=[];for(let[d,u]of t){let p=$e(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)},s=()=>{r&&cancelAnimationFrame(r),r=requestAnimationFrame(a)};a(),window.addEventListener("scroll",s,!0),window.addEventListener("resize",s,!0);let l=new MutationObserver(s);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",s,!0),window.removeEventListener("resize",s,!0),l.disconnect(),r&&cancelAnimationFrame(r)}},[t]),o.length===0)return null;let i={position:"absolute",width:2,height:2,pointerEvents:"none"};return ge(Ye,{children:[e&&st("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),o.map(r=>ge("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:[st("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible"},children:st("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})}),st("div",{style:x(m({},i),{top:-1,left:-1,backgroundColor:r.color})}),st("div",{style:x(m({},i),{top:-1,right:-1,backgroundColor:r.color})}),st("div",{style:x(m({},i),{bottom:-1,left:-1,backgroundColor:r.color})}),st("div",{style:x(m({},i),{bottom:-1,right:-1,backgroundColor:r.color})})]},r.selector))]})}function ld({annotations:t,supersededAnnotations:e,scrollX:o,scrollY:n,onReply:i,annotationGroupMap:r}){let a=t.filter(c=>e.has(c)?!1:c.status==="waiting_input"&&c.question&&c.threadId);if(a.length===0)return null;let s=new Set,l=[];for(let c of a){if(!c.threadId||s.has(c.threadId))continue;s.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(`
-`),b=r.get(d.id),k=b!==void 0?[b+". "+(g[0]||""),...g.slice(1)]:g,M=document.createElement("canvas").getContext("2d");if(!M)continue;M.font=`${p}px ${Se}`;let P=Math.min(400,Math.max(...k.map(W=>M.measureText(W).width))),h=k.length*f+8;l.push({annotation:c,x:u.x+P+4,y:u.y-4,size:h})}}return l.length===0?null:st(Ye,{children:l.map(({annotation:c,x:d,y:u,size:p})=>st(cd,{annotation:c,x:d-o,y:u-n,size:p,onReply:i},`question-${c.threadId}`))})}function cd({annotation:t,x:e,y:o,size:n,onReply:i}){let[r,a]=Kt(!1),[s,l]=Kt(""),c=we(null),d=we(null);Ie(()=>{r&&c.current&&c.current.focus()},[r]),Ie(()=>{if(!r)return;let f=b=>{d.current&&!d.current.contains(b.target)&&a(!1)},g=b=>{b.key==="Escape"&&a(!1)};return document.addEventListener("mousedown",f),document.addEventListener("keydown",g),()=>{document.removeEventListener("mousedown",f),document.removeEventListener("keydown",g)}},[r]);let u=Me(()=>{!s.trim()||!t.threadId||(i(t.threadId,s.trim()),l(""),a(!1))},[s,t.threadId,i]),p=Me(f=>{f.key==="Enter"&&(f.metaKey||f.ctrlKey)&&(f.preventDefault(),u())},[u]);return ge("div",{ref:d,"data-devtools":"question-badge",style:{position:"fixed",left:e,top:o,zIndex:r?10002:9999,pointerEvents:"auto"},children:[!r&&ge("div",{onClick:()=>a(!0),style:{height:n,display:"flex",alignItems:"center",backgroundColor:t.color,cursor:"pointer",padding:`0 ${4}px`,gap:4,fontFamily:Se,fontSize:12,color:"#ffffff",whiteSpace:"nowrap"},children:[ge("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",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"})]}),st("span",{style:{opacity:.7},children:"reply?"})]}),r&&ge("div",{style:{minWidth:260,maxWidth:360,backgroundColor:"#ffffff",fontFamily:Se,fontSize:12,color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)"},children:[st("div",{style:{padding:`${6}px ${8}px`,lineHeight:1.4},children:t.question}),ge("div",{style:{padding:`0 ${4}px ${4}px`},children:[st("textarea",{ref:c,value:s,onChange:f=>l(f.target.value),onKeyDown:p,placeholder:"Type your reply...",style:{width:"100%",minHeight:40,padding:4,fontSize:12,fontFamily:Se,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"}}),st("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:4},children:st("button",{onClick:u,disabled:!s.trim(),style:{padding:"4px 12px",fontSize:11,fontFamily:Se,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"})})]})]})]})}import{useCallback as on,useEffect as pn,useMemo as Ui,useRef as Re,useState as fo}from"react";import{Circle as Od,Component as Fd,Hand as Dd,MessageCircle as Hd,Pen as zd,Slash as _d,Square as $d,Trash2 as Wd,Type as Yd}from"lucide-react";import{useEffect as dd,useRef as ud}from"react";function ta(t,e,o,n,i){let r=ud(0);dd(()=>{if(!o.current||(localStorage.setItem(i.expanded,String(t)),!t))return;let a=e.annotations.length;(a>=r.current||a===0||!n)&&(localStorage.setItem(i.annotations,JSON.stringify(e.annotations)),r.current=a),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 pd,createElement as fd,useCallback as jo,useEffect as Kn,useRef as Xn,useState as un}from"react";import{Fragment as Un,jsx as Wt,jsxs as Ue}from"react/jsx-runtime";var ea="popmelt-library-tab",gd=/^#[0-9a-fA-F]{3,8}$/,md=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,hd=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),yd=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function na(t){let e=t.trim();return gd.test(e)||md.test(e)||hd.has(e.toLowerCase())}function bd(t){return yd.test(t.trim())}function xd(t){let e=t.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return e?parseFloat(e[1]):null}function Ji(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 a=i;typeof a.value=="string"?o.push([r,a.value]):o.push(...Ji(i,r))}else o.push([r,Array.isArray(i)?i.map(String).join(", "):String(i!=null?i:"")])}return o}function vd(t){return t.length===0?"generic":t.filter(([,n])=>na(n)).length>t.length/2?"colors":t.filter(([,n])=>bd(n)).length>t.length/2?"spacing":"generic"}var Sd=x(m({position:"fixed",top:16,right:16,bottom:80,width:300,backgroundColor:"#ffffff"},cn),{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"}),oa={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},wd=x(m({},oa),{color:"#1f2937",borderBottom:"1.5px solid #1f2937"});function kd({entries:t}){let e=[],o=[];for(let n of t)na(n[1])?e.push(n):o.push(n);return Ue(Un,{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(Xi,{entries:o})]})}var Yo=[0,1,2,4,8,12,16,20,24,28,32];function Cd(t){if(t<=32){let e=Yo[0],o=Math.abs(t-e);for(let n=1;n<Yo.length;n++){let i=Math.abs(t-Yo[n]);i<o&&(e=Yo[n],o=i)}return e}return Math.round(t/8)*8}function Ed({label:t,value:e,px:o,tokenPath:n,rawToken:i,onHover:r,onModify:a,onDelete:s}){let[l,c]=un(!1),[d,u]=un(null),p=Xn(!1),f=Xn(0),g=Xn(0),b=Xn([]),k=d!==null?d:o,w=d!==null?`${d}px`:e,M=d!==null,P=jo(h=>{h.preventDefault(),p.current=!0,f.current=h.clientX,g.current=o;let W=Eo(i);b.current=ni(W);let it=K=>{let q=K.clientX-f.current,O=Math.max(0,Math.round(g.current+q));K.shiftKey&&(O=Cd(O));for(let Q of b.current)Q.element.style.setProperty(Q.property,O+"px","important");u(O),r==null||r({name:t,px:O,token:W})},Y=()=>{window.removeEventListener("mousemove",it),window.removeEventListener("mouseup",Y),document.body.style.cursor="",p.current=!1,u(K=>{if(K!==null&&K!==o&&a){let q=Eo(i),O=q.bindings&&q.bindings.length>0,Q;if(O){let St=ii(q.bindings,g.current,K);Q=JSON.stringify(x(m({},q),{value:`${K}px`,bindings:St}))}else{let St=es(b.current,g.current),Z=ns(b.current);if(St.length>0){let at=ii(St,g.current,K);Q=JSON.stringify({value:`${K}px`,property:Z,bindings:at})}else Q=`${K}px`}let U=typeof i=="string"?i:JSON.stringify(i),Mt=b.current.map(St=>({selector:rn(St.element),property:St.property})),mt=is(b.current,g.current,K);a({tokenPath:n,originalValue:U,currentValue:Q,targets:Mt,originalPx:g.current,currentPx:K},{id:Math.random().toString(36).substring(2,9),tokenPath:n,tokenName:t,originalPx:g.current,newPx:K,affectedElements:mt})}return K})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",it),window.addEventListener("mouseup",Y)},[o,t,n,i,r,a]),I=Eo(i);return Ue("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:I}))},onMouseLeave:()=>{p.current||(c(!1),r==null||r(null))},onMouseDown:P,children:[Wt("span",{style:{color:l||M?"#FF0000":"#9ca3af"},children:t}),Ue("span",{style:{display:"flex",alignItems:"center",gap:4},children:[Wt("span",{style:{color:l||M?"#FF0000":"#6b7280",fontWeight:600},children:w}),s&&l&&!M&&Wt("button",{type:"button",title:"Remove token",onMouseDown:h=>{h.stopPropagation();let W=typeof i=="string"?i:JSON.stringify(i);s(n,W)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:h=>{h.currentTarget.style.color="#FF0000"},onMouseLeave:h=>{h.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function Td({entries:t,categoryKey:e,rawTokens:o,onHover:n,onModify:i,onDelete:r}){let a=[],s=[];for(let l of t){let c=xd(l[1]);c!==null?a.push([l[0],l[1],c]):s.push(l)}return Ue(Un,{children:[a.length>0&&Wt("div",{style:{display:"flex",flexDirection:"column",gap:2},children:a.map(([l,c,d])=>{let u=l.split(".").pop(),p=o?Md(o,l):c,f=p&&typeof p=="object"&&"value"in p?p:c;return Wt(Ed,{label:u,value:c,px:d,tokenPath:`tokens.${e}.${l}`,rawToken:f,onHover:n,onModify:i,onDelete:r},l)})}),s.length>0&&Wt(Xi,{entries:s})]})}function Md(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 Xi({entries:t}){return Wt("div",{style:{display:"flex",flexDirection:"column",gap:3},children:t.map(([e,o])=>Ue("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 ia({entries:t,categoryKey:e,rawTokens:o,onSpacingHover:n,onModifyToken:i,onDeleteToken:r}){let a=vd(t);return a==="colors"?Wt(kd,{entries:t}):a==="spacing"?Wt(Td,{entries:t,categoryKey:e,rawTokens:o,onHover:n,onModify:i,onDelete:r}):Wt(Xi,{entries:t})}function Id(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,a=Object.keys(r).find(l=>l.startsWith("__reactFiber$")||l.startsWith("__reactInternalInstance$"));if(!a)continue;let s=r[a];for(;s;){let l=s.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({},s.memoizedProps);return delete u.ref,{type:l,props:u}}if(!o){if(d.length>=4&&e.includes(d)){let u=m({},s.memoizedProps);delete u.ref,o={type:l,props:u}}else if(e.length>=4&&d.includes(e)){let u=m({},s.memoizedProps);delete u.ref,o={type:l,props:u}}}}s=s.return}}return o}var Vi=class extends pd{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 Ld({children:t}){return Wt("div",{style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:6},children:t})}function Rd({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(Un,{children:Object.entries(t).map(([i,r])=>Ue("div",{style:{marginBottom:14},children:[Wt(Ld,{children:i}),Wt(ia,{entries:Ji(r),categoryKey:i,rawTokens:r,onSpacingHover:e,onModifyToken:o,onDeleteToken:n})]},i))})}function Ad({rules:t}){return!t||t.length===0?Wt("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."}):Wt(Un,{children:t.map((e,o)=>Ue("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[Ue("span",{style:{color:"#9ca3af",flexShrink:0},children:[o+1,"."]}),Wt("span",{children:e})]},o))})}function Pd({name:t,value:e,selected:o,highlighted:n,onRemove:i,onHover:r}){var K;let[a,s]=un(!1),[l,c]=un(!1),d=Xn(null),u=Xn(0),[p,f]=un(0),[g,b]=un(0),k=Ji(e),w=(K=k.find(([q])=>q==="description"))==null?void 0:K[1];Kn(()=>{if(!l&&!n){f(0),b(0),u.current=0;return}let q=$n(t);f(q.length)},[l,n,t]),Kn(()=>{o&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[o]);let M=o||n||l,P=o?"139,92,246":"34,197,94",I=o?"#8b5cf6":"#22c55e",h=M?`rgba(${P},0.06)`:void 0,W=M?`inset 0 0 0 1.5px rgba(${P},0.35)`:void 0,it=n||l,Y=jo(()=>{let q=$n(t);if(q.length===0)return;let O=u.current%q.length;q[O].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),b(O),u.current=O+1,r==null||r({name:t,instanceIndex:O})},[t,r]);return Ue("div",{ref:d,onClick:Y,onMouseEnter:()=>{c(!0),r==null||r({name:t,instanceIndex:0})},onMouseLeave:()=>{c(!1),r==null||r(null)},style:{marginBottom:8,background:h,padding:6,boxShadow:W,cursor:"pointer"},children:[Ue("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[Ue("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:it?I:"transparent",color:it?"#fff":"#6b7280"},children:t}),it&&p>1&&Ue("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[g+1,"/",p]})]}),i&&l&&Wt("button",{type:"button",title:"Remove from model",onClick:q=>{q.stopPropagation(),i(t)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:q=>{q.currentTarget.style.color="#FF0000"},onMouseLeave:q=>{q.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),w&&Wt("div",{style:{fontSize:11,color:it?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:w}),a?Wt(ia,{entries:k.filter(([q])=>q!=="description"),categoryKey:""}):Wt(Nd,{name:t,onNotFound:()=>s(!0),entries:k})]})}function Nd({name:t,onNotFound:e}){let[o,n]=un(null),[i,r]=un(!1);return Kn(()=>{let a=Id(t);a||e(),n(a),r(!0)},[t,e]),!i||!o?null:Wt(Vi,{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:fd(o.type,o.props)})})})}function Bd({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)),a=ti(r),s=Object.entries(t).sort(([l],[c])=>{var d,u;return((d=a.get(l))!=null?d:1/0)-((u=a.get(c))!=null?u:1/0)});return Wt(Un,{children:s.map(([l,c])=>Wt(Pd,{name:l,value:c,selected:e===l,highlighted:o===l,onRemove:n,onHover:i},l))})}function ra({bridgeUrl:t,modelRefreshKey:e,onMouseEnter:o,onMouseLeave:n,selectedComponent:i,hoveredComponent:r,onComponentHover:a,onSpacingTokenHover:s,onModifySpacingToken:l,onDeleteSpacingToken:c,onComponentAdded:d,onComponentRemoved:u}){let[p,f]=un(void 0),[g,b]=un(!0),[k,w]=un(()=>{try{let O=localStorage.getItem(ea);if(O==="tokens"||O==="components"||O==="rules")return O}catch(O){}return"components"});Kn(()=>{zn(t).then(O=>{f(O),b(!1)})},[t,e]),Kn(()=>{try{localStorage.setItem(ea,k)}catch(O){}},[k]),Kn(()=>{i&&(w("components"),zn(t).then(O=>{O&&f(O)}))},[i,t]);let M=jo((O,Q)=>{f(U=>{if(!(U!=null&&U.tokens))return U;let Mt=JSON.parse(JSON.stringify(U.tokens)),mt=O.split("."),St=Mt;for(let Z=1;Z<mt.length-1;Z++)if(St=St[mt[Z]],!St)return U;return delete St[mt[mt.length-1]],x(m({},U),{tokens:Mt})}),c==null||c(O,Q)},[c]),P=jo(O=>{f(Q=>{if(!(Q!=null&&Q.components))return Q;let mt=Q.components,{[O]:U}=mt,Mt=So(mt,[vo(O)]);return x(m({},Q),{components:Mt})}),u==null||u(O)},[u]),I=p==null?void 0:p.tokens,h=p==null?void 0:p.components,W=p==null?void 0:p.rules,it=I&&Object.keys(I).length>0,Y=h&&Object.keys(h).length>0,K=W&&W.length>0,q=!p||!it&&!Y&&!K;return Ue("div",{style:Sd,onMouseEnter:o,onMouseLeave:n,children:[Ue("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?wd:oa,onClick:()=>w(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..."}):q?Wt("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):Ue(Un,{children:[k==="components"&&Wt(Bd,{components:h,selectedComponent:i,hoveredComponent:r,onRemove:P,onHover:a}),k==="tokens"&&Wt(Rd,{tokens:I,onSpacingTokenHover:s,onModifyToken:l,onDeleteToken:c?M:void 0}),k==="rules"&&Wt(Ad,{rules:W})]})})]})}import{jsx as sa}from"react/jsx-runtime";var kn={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#f3f4f6",bgHover:"#f9fafb",separator:"#e5e7eb"};function Cn({children:t,active:e,siblingActive:o,disabled:n,onClick:i,title:r}){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?kn.bgActive:"transparent",color:e?kn.iconActive:kn.iconDefault,opacity:a()};return sa("button",{type:"button",onClick:n?void 0:i,title:r,disabled:n,style:s,onMouseEnter:l=>{n||(l.currentTarget.style.opacity="1",e||(l.currentTarget.style.backgroundColor=kn.bgHover))},onMouseLeave:l=>{n||(l.currentTarget.style.opacity=String(a()),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 Ki(){return sa("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as On,jsx as rt,jsxs as me}from"react/jsx-runtime";var Fn=[{type:"rectangle",icon:$d,label:"Rectangle",shortcut:"R"},{type:"circle",icon:Od,label:"Oval",shortcut:"O"},{type:"line",icon:_d,label:"Line",shortcut:"L"},{type:"freehand",icon:zd,label:"Pen",shortcut:"P"}],jd=new Set(Fn.map(t=>t.type));function Gd(t,e,o,n,i,r,a,s){let l=(t-i)*(n-r)-(o-i)*(e-r),c=(t-a)*(r-s)-(i-a)*(e-s),d=(t-o)*(s-n)-(a-o)*(e-n),u=l<0||c<0||d<0,p=l>0||c>0||d>0;return!(u&&p)}function Vd(){let t=window.innerWidth-16,e=t-326,o=window.innerHeight-80;return{left:e,right:t,y:o}}var Jd=[{type:"text",icon:Yd,label:"Text",shortcut:"T"}],aa={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.
+`),l=r!==void 0?[r+". "+(s[0]||""),...s.slice(1)]:s;t.font=`${i}px ${Se}`,t.textBaseline="middle";let c=l.map(f=>t.measureText(f).width),d=Math.min(400,Math.max(...c)),u=l.length*a,p=l.map((f,g)=>{if(c[g]<=400)return f;let b=0,k=f.length;for(;b<k;){let w=b+k+1>>1;t.measureText(f.slice(0,w)+"\u2026").width<=400?b=w:k=w-1}return f.slice(0,b)+"\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 ps=11,vi=4,Ql=`600 ${ps}px system-ui, -apple-system, sans-serif`;function Si(t,e,o){return t.map(n=>({x:n.x-e,y:n.y-o}))}function tc(t,e,o,n,i,r){let a=String(n);t.font=Ql;let l=t.measureText(a).width+vi*2,c=ps+vi*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(a,d+vi,u+c/2)}function ec(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 fs(){let t=ql(null),e=jn(()=>{let s=t.current;if(!s)return;let l=s.getContext("2d");l&&l.clearRect(0,0,s.width,s.height)},[]),o=jn((s,l)=>{var f;let c=t.current;if(!c)return;let d=c.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":yi(d,s.points,p,s.strokeWidth);break;case"line":bi(d,s.points,p,s.strokeWidth);break;case"rectangle":xi(d,s.points,p,s.strokeWidth);break;case"circle":hi(d,s.points,p,s.strokeWidth);break;case"text":s.text&&s.points[0]&&us(d,s.points[0],s.text,p,s.fontSize,l);break}},[]),n=jn((s,l,c,d)=>{let u=t.current;if(!u||s.length<2)return;let p=u.getContext("2d");if(p)switch(l){case"freehand":yi(p,s,c,d);break;case"line":bi(p,s,c,d);break;case"rectangle":xi(p,s,c,d);break;case"circle":hi(p,s,c,d);break}},[]),i=jn((s,l)=>{let c=t.current;if(!c||s.points.length<2)return;let d=c.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,l/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),b=Math.min(u.y,p.y),k=Math.max(u.y,p.y),w=(f+g)/2,I=(b+k)/2;[{x:w,y:b},{x:w,y:k},{x:f,y:I},{x:g,y:I}].forEach(L=>{d.beginPath(),d.rect(L.x-l/2,L.y-l/2,l,l),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(k=>k.x)),p=Math.max(...s.points.map(k=>k.x)),f=Math.min(...s.points.map(k=>k.y)),g=Math.max(...s.points.map(k=>k.y));else{let k=s.points[0],w=s.points[s.points.length-1];u=Math.min(k.x,w.x),p=Math.max(k.x,w.x),f=Math.min(k.y,w.y),g=Math.max(k.y,w.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=jn((s,l,c,d,u,p,f,g=0,b=0,k)=>{var w;if(e(),s.forEach(I=>{let N=x(m({},I),{points:Si(I.points,g,b)}),L=k==null?void 0:k.get(I.id);o(N,L)}),l.length>0){let I=Si(l,g,b);n(I,c,d,u)}if(p&&p.length>0&&f){let I=t.current,N=I==null?void 0:I.getContext("2d");for(let L of p){let h=s.find(Y=>Y.id===L);if(h){let Y=x(m({},h),{points:Si(h.points,g,b)});if(i(Y,f),N&&h.type!=="text"&&k&&!(h.groupId&&s.some(j=>j.groupId===h.groupId&&j.type==="text"))){let j=k.get(h.id);if(j!==void 0){let U=ec(Y,f);if(U){let O=((w=h.status)!=null?w:h.captured?"in_flight":"pending")==="pending"?h.color:"#999999";tc(N,U.x,U.y,j,O,f)}}}}}}},[e,o,n,i]),a=jn(()=>{let s=t.current;if(!s)return;let l=window.devicePixelRatio||1;s.width=window.innerWidth*l,s.height=window.innerHeight*l;let c=s.getContext("2d");c&&c.scale(l,l)},[]);return{canvasRef:t,clearCanvas:e,drawAnnotation:o,drawCurrentPath:n,redrawAll:r,resizeCanvas:a}}import{useEffect as nc,useRef as oc}from"react";function gs(){let t=oc({shift:!1,cmd:!1});return nc(()=>{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 ic}from"react";function ms(t,e,o,n,i){ic(()=>{let r=a=>{if(t){if(t.linkedSelector)return;a.preventDefault(),a.stopPropagation();let l=a.deltaY>0?-2:2;e(c=>c?x(m({},c),{fontSize:Math.max(12,Math.min(72,c.fontSize+l))}):null);return}if(!o)return;a.preventDefault();let s=n.find(l=>l.id===o);if(s&&s.type==="text"&&!s.linkedSelector){let l=s.fontSize||12,c=a.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])}function Fo(t){var r;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,i=new Set;for(let a of o.values()){if(a.length<=1){(r=a[0])!=null&&r.groupId&&i.add(a[0].groupId);continue}a.sort((l,c)=>c.timestamp-l.timestamp);let s=a[0];s.groupId&&i.add(s.groupId);for(let l=1;l<a.length;l++){let c=a[l];e.add(c),c.groupId&&n.add(c.groupId)}}for(let a of t)a.groupId&&n.has(a.groupId)&&!i.has(a.groupId)&&e.add(a);return e}import{useEffect as hs,useLayoutEffect as rc,useState as ys}from"react";import{jsx as wi,jsxs as xs}from"react/jsx-runtime";function sc(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 bs=["top-left","top-right","bottom-right","bottom-left"];function vs({element:t,radius:e,accentColor:o,hoveredCorner:n,draggingCorner:i,cursorViewport:r}){let[a,s]=ys(null),[l,c]=ys(!1);if(hs(()=>{let w=L=>{(L.key==="Meta"||L.key==="Control")&&c(!0)},I=L=>{(L.key==="Meta"||L.key==="Control")&&c(!1)},N=()=>c(!1);return window.addEventListener("keydown",w,!0),window.addEventListener("keyup",I,!0),window.addEventListener("blur",N),()=>{window.removeEventListener("keydown",w,!0),window.removeEventListener("keyup",I,!0),window.removeEventListener("blur",N)}},[]),hs(()=>{if(!t){s(null);return}let w=()=>{s(t.getBoundingClientRect())};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[t]),rc(()=>{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=sc(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,b=i!=null?i:n;if(b)if(l)g.add(b);else for(let w of bs)g.add(w);let k={position:"fixed",top:a.top,left:a.left,width:d,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"};return xs("div",{"data-devtools":"border-radius-handles",style:k,children:[xs("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${u}`,children:[wi("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"}),bs.map(w=>{let I=f[w],N=g.has(w);return wi("circle",{cx:I.x,cy:I.y,r:w===(i!=null?i:n)?3:2.5,fill:o,stroke:"#ffffff",strokeWidth:w===(i!=null?i:n)?4:2,paintOrder:"stroke"},w)})]}),r&&b&&(()=>{let w=Math.round(e[b]);return wi("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:w})})()]})}import{useEffect as ac,useState as lc}from"react";import{Fragment as cc,jsx as Nn,jsxs as ao}from"react/jsx-runtime";function Ss(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),a=parseInt(n[3],16);return`rgba(${i}, ${r}, ${a}, ${e})`}return`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}function Gn({element:t,isSelected:e=!1,elementInfo:o,color:n="#3b82f6",annotationNumber:i,changeCount:r,hideTooltip:a=!1}){let[s,l]=lc(null);if(ac(()=>{if(!t){l(null);return}let L=()=>{let h=t.getBoundingClientRect();l(h)};return L(),window.addEventListener("scroll",L,{passive:!0}),window.addEventListener("resize",L,{passive:!0}),()=>{window.removeEventListener("scroll",L),window.removeEventListener("resize",L)}},[t]),!s||!t)return null;let c={position:"fixed",top:s.top,left:s.left,width:s.width,height:s.height,pointerEvents:"none",zIndex:9996,backgroundColor:e?Ss(n,.1):Ss(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,b=g?`<${g}> ${u}${p}${f}`:`${u}${p}${f}`,k=22,I={position:"fixed",top:s.top>=k?s.top-k:s.bottom,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},N={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return ao(cc,{children:[ao("div",{"data-devtools":"highlight",style:c,children:[Nn("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:Nn("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"}))}),Nn("div",{style:x(m({},d),{top:-1,left:-1})}),Nn("div",{style:x(m({},d),{top:-1,right:-1})}),Nn("div",{style:x(m({},d),{bottom:-1,left:-1})}),Nn("div",{style:x(m({},d),{bottom:-1,right:-1})})]}),!a&&ao("div",{"data-devtools":"tooltip",style:I,children:[i!==void 0&&ao("span",{children:[i,"."]}),Nn("span",{style:N,children:b}),r!==void 0&&r>0&&ao("span",{style:{opacity:.8},children:["(",r," ",r===1?"change":"changes",")"]})]})]})}import{useEffect as ws,useLayoutEffect as dc,useState as ki}from"react";import{jsx as xn,jsxs as Ei}from"react/jsx-runtime";function Ci(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:i,cursorViewport:r,isAutoGap:a=!1,refreshKey:s=0}){let[l,c]=ki(null),[d,u]=ki([]),[p,f]=ki(!1);if(ws(()=>{let j=O=>{(O.key==="Meta"||O.key==="Control")&&f(!0)},U=O=>{(O.key==="Meta"||O.key==="Control")&&f(!1)},Q=()=>f(!1);return window.addEventListener("keydown",j,!0),window.addEventListener("keyup",U,!0),window.addEventListener("blur",Q),()=>{window.removeEventListener("keydown",j,!0),window.removeEventListener("keyup",U,!0),window.removeEventListener("blur",Q)}},[]),ws(()=>{if(!t){c(null),u([]);return}let j=()=>{c(t.getBoundingClientRect()),u(An(t))};return j(),window.addEventListener("scroll",j,{passive:!0}),window.addEventListener("resize",j,{passive:!0}),()=>{window.removeEventListener("scroll",j),window.removeEventListener("resize",j)}},[t]),dc(()=>{t&&(c(t.getBoundingClientRect()),u(An(t)))},[t,e.row,e.column,s]),!l||d.length===0)return null;let g=l.width,b=l.height,k="pm-gap-stripe-pattern",w=Ci(o,.25),I=Ci(o,.1),N=Ci(o,.2),L=8,h=2,Y={position:"fixed",top:l.top,left:l.left,width:g,height:b,pointerEvents:"none",zIndex:9996,overflow:"visible"},ot=i!=null?i:n;return Ei("div",{"data-devtools":"gap-handles",style:Y,children:[Ei("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${g} ${b}`,children:[xn("defs",{children:xn("pattern",{id:k,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:xn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:w,strokeWidth:"1.5"})})}),xn("rect",{x:"0.5",y:"0.5",width:Math.max(0,g-1),height:Math.max(0,b-1),fill:"none",stroke:N,strokeWidth:"1"}),d.map((j,U)=>{let Q=j.x-l.left,O=j.y-l.top,tt=j.w,Z=j.h,It=p?j.axis===ot:!0;return(j.axis==="row"?e.row:e.column)===0?null:Ei("g",{opacity:It?1:.6,children:[xn("rect",{x:Q,y:O,width:tt,height:Z,fill:I}),xn("rect",{x:Q,y:O,width:tt,height:Z,fill:`url(#${k})`})]},U)}),ot&&(()=>{let j=d.filter(bt=>bt.axis===ot);if(j.length===0)return null;let U=j[0];if(r&&j.length>1){let bt=1/0;for(let vt of j){let Yt=vt.x+vt.w/2,Bt=vt.y+vt.h/2,ht=Math.abs(r.x-Yt)+Math.abs(r.y-Bt);ht<bt&&(bt=ht,U=vt)}}let Q=U.x-l.left,O=U.y-l.top,tt=U.w,Z=U.h,It=Q+tt/2,mt=O+Z/2;if(a)return xn("circle",{cx:It,cy:mt,r:1.5,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let St=ot==="column",q=St?h:L,st=St?L:h,wt=It-q/2,F=mt-st/2;return xn("rect",{x:wt,y:F,width:q,height:st,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),r&&ot&&(()=>{let j=a?"auto":String(Math.round(ot==="row"?e.row:e.column));return xn("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 mc,useEffect as hc,useState as yc}from"react";import{useEffect as uc,useState as ks}from"react";var pc=3,fc=250,Mi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],gc=3e3;function Do(t){let[e,o]=ks(0),[n,i]=ks(()=>Math.floor(Math.random()*Mi.length));return uc(()=>{if(!t)return;let r=setInterval(()=>o(s=>(s+1)%pc),fc),a=setInterval(()=>i(s=>(s+1)%Mi.length),gc);return()=>{clearInterval(r),clearInterval(a)}},[t]),{charIndex:e,word:Mi[n]}}import{Fragment as Ii,jsx as ln,jsxs as Vn}from"react/jsx-runtime";function bc(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 Cs=22;function Es({styleModifications:t,isInspecting:e,accentColor:o,annotationGroupCount:n,dispatch:i,inFlightSelectors:r}){let[a,s]=yc([]),l=r&&r.size>0,{charIndex:c,word:d}=Do(!!l);hc(()=>{if(e){s([]);return}let g=null,b=()=>{let I=[];t.forEach((N,L)=>{let h=$e(N.selector);if(!h)return;let Y=h.getBoundingClientRect();I.push({selector:N.selector,modIndex:L,top:Y.top>=Cs?Y.top-Cs:Y.bottom,left:Y.left,label:bc(N),changeCount:N.changes.length,annotationNumber:n+L+1})}),s(I)},k=()=>{g&&cancelAnimationFrame(g),g=requestAnimationFrame(b)};b(),window.addEventListener("scroll",k,!0),window.addEventListener("resize",k,!0);let w=new MutationObserver(k);return w.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),w.disconnect(),g&&cancelAnimationFrame(g)}},[t,e,n]);let u=mc(g=>{let b=t[g];if(!b)return;let k=$e(b.selector);k&&(i({type:"SELECT_ANNOTATION",payload:{id:null}}),i({type:"SET_TOOL",payload:"inspector"}),i({type:"SELECT_ELEMENT",payload:{el:k,info:b.element}}))},[t,i]);if(a.length===0)return null;let p={position:"fixed",zIndex:1e4,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,cursor:"pointer",whiteSpace:"nowrap",maxWidth:400},f={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return ln(Ii,{children:a.map(g=>{let b=r==null?void 0:r.has(g.selector);return Vn("div",{"data-devtools":"badge",style:x(m({},p),{top:g.top,left:g.left,backgroundColor:b?"#999999":o}),onClick:()=>u(g.modIndex),children:[Vn("span",{children:[g.annotationNumber,"."]}),ln("span",{style:f,children:g.label}),Vn("span",{style:{opacity:.8},children:["(",g.changeCount," ",g.changeCount===1?"change":"changes",")"]}),b&&Vn("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[ln("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?Vn(Ii,{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"})]}):Vn(Ii,{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 xc,useState as vc}from"react";import{Fragment as wc,jsx as Ts}from"react/jsx-runtime";function Sc(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 Ms({styleModifications:t,accentColor:e}){let[o,n]=vc([]);if(xc(()=>{let r=null,a=()=>{let c=[];for(let d of t){let u=$e(d.selector);if(!u)continue;let p=u.getBoundingClientRect();if(p.width===0&&p.height===0)continue;let f=Pn(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)},s=()=>{r&&cancelAnimationFrame(r),r=requestAnimationFrame(a)};a(),window.addEventListener("scroll",s,{passive:!0}),window.addEventListener("resize",s,{passive:!0});let l=new MutationObserver(s);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",s),window.removeEventListener("resize",s),l.disconnect(),r&&cancelAnimationFrame(r)}},[t]),o.length===0)return null;let i=Sc(e,.2);return Ts(wc,{children:o.map(r=>{let a={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 Ts("div",{"data-devtools":"mod-border",style:a},r.selector)})})}import{useEffect as Is,useLayoutEffect as kc,useState as Ls}from"react";import{jsx as Mn,jsxs as Ri}from"react/jsx-runtime";function Li(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 Cc={top:"bottom",bottom:"top",left:"right",right:"left"};function Ai({element:t,padding:e,accentColor:o,hoveredSide:n,draggingSide:i,cursorViewport:r,refreshKey:a}){let[s,l]=Ls(null),[c,d]=Ls(!1);if(Is(()=>{let tt=mt=>{(mt.key==="Meta"||mt.key==="Control")&&d(!0)},Z=mt=>{(mt.key==="Meta"||mt.key==="Control")&&d(!1)},It=()=>d(!1);return window.addEventListener("keydown",tt,!0),window.addEventListener("keyup",Z,!0),window.addEventListener("blur",It),()=>{window.removeEventListener("keydown",tt,!0),window.removeEventListener("keyup",Z,!0),window.removeEventListener("blur",It)}},[]),Is(()=>{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]),kc(()=>{t&&l(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:b,left:k}=e,w="pm-stripe-pattern",I=Li(o,.25),N=Li(o,.1),L=Li(o,.2),h=8,Y=2,ot={position:"fixed",top:s.top,left:s.left,width:u,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"},j=["top","right","bottom","left"],U={top:`0,0 ${u},0 ${u-g},${f} ${k},${f}`,right:`${u},0 ${u},${p} ${u-g},${p-b} ${u-g},${f}`,bottom:`0,${p} ${k},${p-b} ${u-g},${p-b} ${u},${p}`,left:`0,0 ${k},${f} ${k},${p-b} 0,${p}`},Q={top:{x:u/2-h/2,y:f/2-Y/2,w:h,h:Y},bottom:{x:u/2-h/2,y:p-b/2-Y/2,w:h,h:Y},left:{x:k/2-Y/2,y:p/2-h/2,w:Y,h},right:{x:u-g/2-Y/2,y:p/2-h/2,w:Y,h}},O=new Set;return i?O.add(i):n&&(O.add(n),c||O.add(Cc[n])),Ri("div",{"data-devtools":"padding-handles",style:ot,children:[Ri("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${u} ${p}`,children:[Mn("defs",{children:Mn("pattern",{id:w,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Mn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:I,strokeWidth:"1.5"})})}),Mn("rect",{x:"0.5",y:"0.5",width:Math.max(0,u-1),height:Math.max(0,p-1),fill:"none",stroke:L,strokeWidth:"1"}),j.map(tt=>{if(e[tt]<=0)return null;let It=O.has(tt);return Ri("g",{opacity:It?1:.6,children:[Mn("polygon",{points:U[tt],fill:N}),Mn("polygon",{points:U[tt],fill:`url(#${w})`})]},tt)}),j.map(tt=>{let Z=Q[tt],It=O.has(tt);return Mn("rect",{x:Z.x,y:Z.y,width:Z.w,height:Z.h,fill:o,stroke:"#ffffff",strokeWidth:It?4:2,paintOrder:"stroke"},`handle-${tt}`)})]}),r&&(n||i)&&(()=>{let tt=i!=null?i:n,Z=Math.round(e[tt]);return Mn("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:Z})})()]})}import{useCallback as He,useEffect as Ke,useMemo as $o,useRef as fe,useState as Te}from"react";import{AlignCenter as Tc,AlignHorizontalSpaceAround as Mc,AlignJustify as Ic,AlignLeft as Lc,AlignRight as Rc,AlignVerticalSpaceAround as Ac,Baseline as Pc,Check as Ho,ChevronDown as Wo,Columns3 as Nc,Grid2x2 as Bc,MoveHorizontal as Rs,Plus as As,RectangleHorizontal as Oc,RotateCcw as Fc,Rows3 as Dc,Shrink as Hc,UnfoldHorizontal as Ps,UnfoldVertical as Ns,WholeWord as zc,X as zs}from"lucide-react";var Ec="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",cn={borderWidth:3,borderStyle:"solid",borderImage:`url("${Ec}") 4 / 1.9 / 0 round`};import{Fragment as _o,jsx as E,jsxs as yt}from"react/jsx-runtime";function _s(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),a=parseInt(n[3],16);return`rgba(${i}, ${r}, ${a}, ${e})`}return`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}var Bs=[{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 _c(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 Os(t,e){return!e||t==="auto"||t==="fit-content"||t==="max-content"||t==="min-content"?"hug":t==="100%"||e==="100%"?"fill":"fixed"}function Pi(t,e){switch(t){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let o=Jn(e);if(typeof o.num=="number"&&!isNaN(o.num)){let n=o.unit==="%"?"px":o.unit||"px";return`${o.num}${n}`}return"auto"}}}function lo(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 $c(t,e){return t==="grid"?"grid":t==="flex"||t==="inline-flex"?e==="column"||e==="column-reverse"?"flex-col":"flex-row":"block"}function Wc(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 Sn="rgba(0, 0, 0, 0.04)",We={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},Oi={"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 uo(t){var e,o;return(o=(e=Oi[t])==null?void 0:e[0])!=null?o:"px"}function Bi(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 a=parseFloat(i);if(!isNaN(a)){if(n){let{unit:s}=Jn(o);return`${a}${s||uo(e)}`}return`${a}${uo(e)}`}return i}function $s(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}function Fs({label:t,property:e,cssValue:o,mode:n,onValueChange:i,onModeChange:r,modified:a,dimmed:s,dropdownOpen:l,onDropdownChange:c,panelContentRef:d,accentColor:u="#3b82f6",onReset:p,minValue:f,maxValue:g,onMinChange:b,onMaxChange:k,onMinReset:w,onMaxReset:I,minModified:N,maxModified:L}){let h=Jn(o),Y=a&&h.unit||uo(e),ot=!a&&h.unit&&h.unit!==Y?$s(h.num,Y):h.num,[j,U]=Te(!1),[Q,O]=Te(String(ot)),[tt,Z]=Te(!1),It=fe(null),mt=fe(null),St=fe(null),q=fe(!1);Ke(()=>{j||O(String(ot))},[ot,j]),Ke(()=>{if(!l)return;let ht=ct=>{mt.current&&!mt.current.contains(ct.target)&&St.current&&!St.current.contains(ct.target)&&(c==null||c(!1))},ue=ct=>{ct.key==="Escape"&&(c==null||c(!1))};return document.addEventListener("mousedown",ht),document.addEventListener("keydown",ue),()=>{document.removeEventListener("mousedown",ht),document.removeEventListener("keydown",ue)}},[l,c]),Ke(()=>{j&&It.current&&(It.current.focus(),It.current.select())},[j]);let st=()=>{let ht=Bi(Q,e,o,a);i(ht||`${Math.max(0,parseFloat(Q)||0)}${Y}`),U(!1)},wt=()=>{if(q.current){q.current=!1;return}st()},F=ht=>{if(ht.key==="Enter"){st();return}if(ht.key==="Escape"){q.current=!0,O(String(ot)),U(!1);return}if(ht.key==="ArrowUp"||ht.key==="ArrowDown"){ht.preventDefault();let ue=ht.key==="ArrowUp"?1:-1,ct=ht.shiftKey?8:ht.altKey?.1:1,Mt=parseFloat(Q)||0,Lt=Math.round(Math.max(0,Mt+ue*ct)*1e3)/1e3;O(String(Lt)),i(`${Lt}${Y}`)}},bt={fixed:"Fixed",hug:"Hug",fill:"Fill"},vt={fixed:E(Rs,{size:12}),hug:E(Hc,{size:12}),fill:E(Rs,{size:12})},Yt=()=>{c==null||c(!l)},Bt=()=>{if(!St.current||!(d!=null&&d.current))return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let ht=St.current.getBoundingClientRect(),ue=d.current.getBoundingClientRect(),ct=d.current.closest('[data-devtools="panel"]'),Mt=ct?ct.getBoundingClientRect():{top:0,left:0};return{position:"fixed",top:ht.bottom+4-Mt.top,left:ue.left+4-Mt.left,width:ue.width-8}};return yt("div",{ref:St,onMouseEnter:()=>Z(!0),onMouseLeave:()=>Z(!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:Sn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:s?.3:1},children:[E("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?E("input",{ref:It,type:"text",inputMode:"numeric",value:Q,onChange:ht=>O(ht.target.value),onKeyDown:F,onBlur:wt,style:x(m({},We),{flex:1,minWidth:0,padding:"4px 2px"})}):E("span",{onClick:()=>U(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:ot}):E("span",{style:{flex:1}}),yt("button",{type:"button",onClick:Yt,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:[bt[n],E(Wo,{size:12})]}),l&&yt("div",{ref:mt,style:x(m({},Bt()),{backgroundColor:"#ffffff",border:"1px solid rgba(0,0,0,0.1)",borderRadius:0,zIndex:10001,overflow:"hidden",fontSize:12,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace'}),children:[yt("button",{type:"button",onClick:()=>{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:[vt.fixed,yt("span",{children:["Fixed ",e," (",o,")"]}),n==="fixed"&&E(Ho,{size:14,style:{marginLeft:"auto"}})]}),yt("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:[vt.hug,E("span",{children:"Hug contents"}),n==="hug"&&E(Ho,{size:14,style:{marginLeft:"auto"}})]}),yt("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:[vt.fill,E("span",{children:"Fill container"}),n==="fill"&&E(Ho,{size:14,style:{marginLeft:"auto"}})]}),E("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),yt("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[yt("div",{style:{display:"flex",alignItems:"center",backgroundColor:Sn,borderRadius:2,padding:"4px 8px"},children:[E("span",{onClick:N?ht=>{ht.stopPropagation(),w==null||w()}: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"}),E("input",{type:"text",value:f||"",placeholder:"\u2014",onChange:ht=>b==null?void 0:b(ht.target.value),onClick:ht=>ht.stopPropagation(),style:x(m({},We),{flex:1,minWidth:0,padding:0,textAlign:"right",color:N?u:"inherit",fontWeight:N?600:400})})]}),yt("div",{style:{display:"flex",alignItems:"center",backgroundColor:Sn,borderRadius:2,padding:"4px 8px"},children:[E("span",{onClick:L?ht=>{ht.stopPropagation(),I==null||I()}:void 0,title:L?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:L?u:"#999",fontWeight:L?600:400,marginRight:8,flexShrink:0,cursor:L?"pointer":"default"},children:"Max"}),E("input",{type:"text",value:g||"",placeholder:"\u2014",onChange:ht=>k==null?void 0:k(ht.target.value),onClick:ht=>ht.stopPropagation(),style:x(m({},We),{flex:1,minWidth:0,padding:0,textAlign:"right",color:L?u:"inherit",fontWeight:L?600:400})})]})]})]})]})}function dn({children:t,style:e,dimmed:o}){let[n,i]=Te(!1);return E("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:Sn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:o?.3:1},e),children:t})}function In({children:t}){let[e,o]=Te(!1);return E("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:Sn,transition:"border-color 100ms ease"},children:t})}var zo=[{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 Yc(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],a=parseFloat(r);isNaN(a)||e.push({name:i,value:a})}return e}function Ni(t){return t.length===0?"none":t.map(e=>{var i;let o=zo.find(r=>r.name===e.name),n=(i=o==null?void 0:o.unit)!=null?i:"";return`${e.name}(${e.value}${n})`}).join(" ")}function jc({value:t,onChange:e,accentColor:o,modified:n,panelContentRef:i}){let r=Yc(t),[a,s]=Te(!1),l=fe(null),c=fe(null);Ke(()=>{if(!a)return;let N=L=>{l.current&&!l.current.contains(L.target)&&s(!1)};return document.addEventListener("mousedown",N,!0),()=>document.removeEventListener("mousedown",N,!0)},[a]);let d=zo.filter(N=>!r.some(L=>L.name===N.name)),u=N=>{let L=[...r,{name:N.name,value:N.defaultValue}];e(Ni(L)),s(!1)},p=N=>{let L=r.filter((h,Y)=>Y!==N);e(Ni(L))},f=(N,L)=>{let h=r.map((Y,ot)=>ot===N?x(m({},Y),{value:L}):Y);e(Ni(h))},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"},b=He(N=>{var O;if(!c.current)return{position:"fixed",top:0,left:0};let L=c.current.getBoundingClientRect(),h=c.current.closest('[data-devtools="panel"]'),Y=h?h.getBoundingClientRect():{top:0,left:0,bottom:9999},ot=(O=i==null?void 0:i.current)==null?void 0:O.getBoundingClientRect(),j=N*24+8,Q=Y.bottom-L.bottom<j;return x(m({position:"fixed"},Q?{bottom:Y.bottom-L.top+2-Y.top}:{top:L.bottom+2-Y.top}),{left:ot?ot.left+4-Y.left:L.left-Y.left,width:ot?ot.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)"},w={display:"block",width:"100%",padding:"4px 10px",border:"none",backgroundColor:"transparent",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#334155",cursor:"pointer",textAlign:"left"},I=N=>E("div",{ref:l,style:m(m({},b(N.length)),k),children:N.map(L=>E("button",{type:"button",onClick:()=>u(L),style:w,onMouseEnter:h=>{h.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:h=>{h.currentTarget.style.backgroundColor="transparent"},children:L.label},L.name))});return r.length===0?yt("div",{children:[yt("div",{style:{display:"flex",alignItems:"center",gap:4},children:[E(In,{modified:!1,children:E("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:x(m({},g),{color:"#999",cursor:"default"})})}),E("button",{ref:c,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:E(As,{size:12})})]}),a&&I(zo)]}):yt("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[r.map((N,L)=>{let h=zo.find(Y=>Y.name===N.name);return h?yt("div",{style:{display:"flex",alignItems:"center",gap:4},children:[E("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:h.label}),E(In,{modified:n,children:yt("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[E("input",{type:"range",min:h.min,max:h.max,step:h.step,value:N.value,onChange:Y=>f(L,parseFloat(Y.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${o} ${(N.value-h.min)/(h.max-h.min)*100}%, rgba(0,0,0,0.1) ${(N.value-h.min)/(h.max-h.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),E("input",{type:"number",min:h.min,max:h.max,step:h.step,value:h.unit==="px"||h.unit==="deg"?Math.round(N.value):Math.round(N.value*100)/100,onChange:Y=>f(L,parseFloat(Y.target.value)||0),style:x(m({},g),{width:44,padding:"2px 4px",textAlign:"right",flexShrink:0})}),h.unit&&E("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:h.unit})]})}),E("button",{type:"button",onClick:()=>p(L),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:E(zs,{size:10})})]},N.name):null}),d.length>0&&yt("div",{children:[yt("button",{ref:c,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:[E(As,{size:10}),"Add filter"]}),a&&I(d)]})]})}function vn({property:t,value:e,onChange:o,isModified:n=!1,step:i=1,min:r,max:a,style:s,placeholder:l,showUnit:c=!0,unitStyle:d,preferredUnit:u,onUnitCycle:p}){let f=Jn(e),g=uo(t),b=Oi[t],w=u&&b&&b.includes(u)?u:g,I=n&&f.unit||w,N=!n&&f.unit&&f.unit!==I?$s(f.num,I):f.num,[L,h]=Te(!1),[Y,ot]=Te(""),j=wt=>{h(!0),ot(String(N||"")),requestAnimationFrame(()=>wt.target.select())},U=()=>{if(h(!1),Y.trim()){let wt=Bi(Y,t,e,n);wt&&o(wt)}},Q=wt=>{let F=wt.target.value;ot(F);let bt=F.trim(),vt=bt.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),Yt=bt.match(/^(-?[\d.]+)$/);if(vt){let Bt=parseFloat(vt[1]);isNaN(Bt)||o(`${Bt}${vt[2].toLowerCase()}`)}else if(Yt){let Bt=parseFloat(Yt[1]);isNaN(Bt)||o(`${Bt}${I}`)}},O=wt=>{if(wt.key==="Enter"){if(Y.trim()){let F=Bi(Y,t,e,n);F&&o(F)}wt.target.blur();return}if(wt.key==="ArrowUp"||wt.key==="ArrowDown"){wt.preventDefault();let F=wt.shiftKey?10:wt.altKey?.1:1,bt=(wt.key==="ArrowUp"?1:-1)*i*F,vt=parseFloat(Y)||N||0,Yt=Math.round((vt+bt)*1e3)/1e3;r!==void 0&&(Yt=Math.max(r,Yt)),a!==void 0&&(Yt=Math.min(a,Yt)),ot(String(Yt)),o(`${Yt}${I}`)}},tt=/^-?[\d.]/.test(e.trim()),Z=L?Y:tt?String(N):"",mt=L&&/\s*(rem|em|px|%)\s*$/i.test(Y)?"":I,St=p&&(mt==="rem"||mt==="px"),q={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},st=x(m({},d!=null?d:q),{pointerEvents:"auto",cursor:"pointer"});return yt(_o,{children:[E("input",{type:"text",inputMode:"decimal",value:Z,onFocus:j,onBlur:U,onChange:Q,onKeyDown:O,placeholder:l,style:s}),c&&mt&&E("span",{style:St?st:d!=null?d:q,onClick:St?p:void 0,title:St?"Click to switch units":void 0,children:mt})]})}function Ws({value:t,resolvedValue:e,colorVariables:o,matchingVariable:n,onChange:i,accentColor:r="#3b82f6",modified:a,panelContentRef:s,isDropdownOpen:l,onDropdownChange:c}){let[d,u]=Te(!1),p=!t.includes("var(")&&n?n.usage:t,[f,g]=Te(p),[b,k]=Te(!1),[w,I]=Te(!1),[N,L]=Te(!1),h=fe(null),Y=fe(null),ot=fe(null),j=l!==void 0?l:b,U=c||k,Q=He(()=>{if(!ot.current)return{position:"fixed",top:0,left:0,width:200};let F=ot.current.getBoundingClientRect(),bt=ot.current.closest('[data-devtools="panel"]'),vt=bt?bt.getBoundingClientRect():{top:0,left:0};if(s!=null&&s.current){let Yt=s.current.getBoundingClientRect();return{position:"fixed",top:F.bottom+4-vt.top,left:Yt.left+4-vt.left,width:Yt.width-8}}return{position:"fixed",top:F.bottom+4-vt.top,left:F.left-vt.left,width:F.width}},[s]);Ke(()=>{if(!d){let F=!t.includes("var(")&&n?n.usage:t;g(F)}},[t,d,n]),Ke(()=>{if(!j&&!w)return;let F=vt=>{ot.current&&!ot.current.contains(vt.target)&&(U(!1),I(!1))},bt=vt=>{vt.key==="Escape"&&(U(!1),I(!1))};return document.addEventListener("mousedown",F),document.addEventListener("keydown",bt),()=>{document.removeEventListener("mousedown",F),document.removeEventListener("keydown",bt)}},[j,w]),Ke(()=>{d&&h.current&&(h.current.focus(),h.current.select())},[d]);let O=$o(()=>{if(!f||f.startsWith("#")||f.startsWith("rgb")||f.startsWith("hsl")||f.startsWith("oklch"))return[];let F=f.toLowerCase();return o.filter(bt=>bt.name.toLowerCase().includes(F)||bt.usage.toLowerCase().includes(F)).slice(0,8)},[f,o]),tt=()=>{i(f),u(!1),I(!1)},Z=F=>{g(F),F.includes("var")||F.includes("--")||F.length>0&&!F.startsWith("#")?I(!0):I(!1)},It=F=>{g(F.usage),i(F.usage),U(!1),I(!1),u(!1)},mt=()=>{setTimeout(()=>{!j&&!w&&tt()},150)},St=F=>{F.key==="Enter"?tt():F.key==="Escape"&&(g(t),u(!1),I(!1))},q=$o(()=>{let F=e.trim().toLowerCase();if(F.startsWith("#"))return F.length===4?`#${F[1]}${F[1]}${F[2]}${F[2]}${F[3]}${F[3]}`:F.slice(0,7);let bt=F.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(bt){let Yt=parseInt(bt[1],10).toString(16).padStart(2,"0"),Bt=parseInt(bt[2],10).toString(16).padStart(2,"0"),ht=parseInt(bt[3],10).toString(16).padStart(2,"0");return`#${Yt}${Bt}${ht}`}let vt=F.match(/oklch\(\s*([\d.]+)/);if(vt){let Yt=Math.max(0,Math.min(1,parseFloat(vt[1]))),Bt=Math.round(Yt*255).toString(16).padStart(2,"0");return`#${Bt}${Bt}${Bt}`}return"#000000"},[e]),st=F=>{let bt=F.target.value;g(bt),i(bt)},wt=t.includes("var(");return yt("div",{ref:ot,onMouseEnter:()=>L(!0),onMouseLeave:()=>L(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:d?r:N?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Sn,transition:"border-color 100ms ease",overflow:"hidden"},children:[yt("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[yt("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[E("input",{type:"color",value:q,onChange:st,style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),E("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:e,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),d?E("input",{ref:h,type:"text",value:f,onChange:F=>Z(F.target.value),onKeyDown:St,onBlur:mt,style:x(m({},We),{flex:1,minWidth:0})}):E("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?r:"inherit"},title:p,children:p}),o.length>0&&E("button",{type:"button",onClick:()=>U(!j),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:E(Wo,{size:12})})]}),w&&O.length>0&&E("div",{style:x(m({},Q()),{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(F=>yt("button",{type:"button",onClick:()=>It(F),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:[E("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:F.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),E("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:F.name})]},F.name))}),j&&E("div",{ref:Y,style:x(m({},Q()),{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(F=>yt("button",{type:"button",onClick:()=>It(F),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:p===F.usage||t===F.usage?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:p===F.usage||t===F.usage?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[E("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:F.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),E("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:F.name}),(p===F.usage||t===F.usage)&&E(Ho,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},F.name))})]})}function Gc({gridCols:t,gridRows:e,gridModified:o,accentColor:n,onColsChange:i,onRowsChange:r}){return E(dn,{style:{width:100},children:yt("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[E("input",{type:"number",min:1,max:12,value:t,onChange:a=>i(parseInt(a.target.value)||1),style:x(m({},We),{width:32,textAlign:"center",padding:2})}),E("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"}),E("input",{type:"number",min:1,max:12,value:e,onChange:a=>r(parseInt(a.target.value)||1),style:x(m({},We),{width:32,textAlign:"center",padding:2})})]})})}function Vc({element:t,getValue:e,getOriginalValue:o,handleChange:n,isModified:i,onResetProperty:r,isCollapsed:a,onToggle:s,sectionHeaderStyle:l,activeDropdown:c,onDropdownChange:d,panelContentRef:u,accentColor:p,onFieldHover:f,preferredUnit:g,onUnitCycle:b}){let k=d,w=e("display"),I=e("flex-direction"),N=$c(w,I),L=w==="flex"||w==="inline-flex",h=w==="grid",Y=L||h,ot=e("width"),j=e("height"),U=i("width")?ot:To(t,"width"),Q=i("height")?j:To(t,"height"),O=Os(ot,U),tt=Os(j,Q),Z=e("min-width"),It=e("max-width"),mt=e("min-height"),St=e("max-height"),q=lo(e("padding")),st=e("gap"),wt=e("row-gap"),F=e("column-gap"),bt=e("grid-template-columns"),vt=e("grid-template-rows"),Yt=e("overflow"),Bt=bt.split(/\s+/).filter(J=>J&&J!=="none").length||1,ht=vt.split(/\s+/).filter(J=>J&&J!=="none").length||1,[ue,ct]=Te(!1),Mt=c!==null,Lt=Mt||ue,be=Mt?.3:ue?.65:1,ne=({mode:J,icon:Ft,active:Nt})=>E("button",{type:"button",onClick:()=>Wc(J,n),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:Nt?_s(p,.15):"transparent",color:Nt?p:"#64748b",cursor:"pointer",fontSize:14},children:Ft}),he=(J,Ft,Nt)=>{Nt==="fixed"?n(J,Ft):n(J,Pi(Nt,Ft))},G=J=>{let Ft=lo(e("padding")),Nt=J||"0";n("padding",`${Ft.top} ${Nt} ${Ft.bottom} ${Nt}`)},gt=J=>{let Ft=lo(e("padding")),Nt=J||"0";n("padding",`${Nt} ${Ft.right} ${Nt} ${Ft.left}`)},[at,At]=Te({}),_t=He((J,Ft)=>Nt=>{Ft(Nt),At(Qe=>x(m({},Qe),{[J]:Nt}))},[]),Pt=He(J=>{At(Ft=>{let Nt=m({},Ft);return delete Nt[J],Nt})},[]),kt=He(J=>{let Ft=lo(e("padding"));jt(t,"padding",`${Ft.top} ${J} ${Ft.bottom} ${J}`)},[t,e]),Qt=He(J=>{let Ft=lo(e("padding"));jt(t,"padding",`${J} ${Ft.right} ${J} ${Ft.left}`)},[t,e]),Dt=He(J=>Ft=>{jt(t,J,Ft)},[t]),Ce=I==="column"||I==="column-reverse",re=J=>J==="center"?1:J==="flex-end"||J==="end"?2:0,pe=re(e("justify-content")),Ut=re(e("align-items")),Ee=Ce?Ut:pe,ae=Ce?pe:Ut,Ge=fe(null),ce=fe({x:0,y:0}),Ve=fe({col:Ee,row:ae});Ve.current={col:Ee,row:ae};let ve=He((J,Ft)=>{let Nt=["flex-start","center","flex-end"];Ce?(n("justify-content",Nt[Ft]),n("align-items",Nt[J])):(n("justify-content",Nt[J]),n("align-items",Nt[Ft]))},[Ce,n]),Ze=fe(ve);Ze.current=ve,Ke(()=>{let Ft=Nt=>{let Qe=Ge.current;if(!Qe||!Qe.contains(Nt.target))return;Nt.preventDefault(),Nt.stopPropagation(),ce.current.x+=Nt.deltaX,ce.current.y+=Nt.deltaY;let{col:te,row:Jt}=Ve.current,De=!1;Math.abs(ce.current.x)>=30&&(te=Math.max(0,Math.min(2,te+(ce.current.x>0?1:-1))),ce.current.x=0,ce.current.y=0,De=!0),!De&&Math.abs(ce.current.y)>=30&&(Jt=Math.max(0,Math.min(2,Jt+(ce.current.y>0?1:-1))),ce.current.x=0,ce.current.y=0,De=!0),De&&(te!==Ve.current.col||Jt!==Ve.current.row)&&Ze.current(te,Jt)};return document.addEventListener("wheel",Ft,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",Ft,{capture:!0})},[]);let ze=()=>E("div",{ref:Ge,onMouseEnter:()=>{ct(!0),u.current&&(u.current.style.overflowY="hidden")},onMouseLeave:()=>{ct(!1),u.current&&(u.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:Sn,borderRadius:2,display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gridTemplateRows:"repeat(3, 1fr)",padding:6,gap:2,touchAction:"none"},children:[0,1,2].map(J=>[0,1,2].map(Ft=>E("button",{type:"button",onClick:()=>ve(Ft,J),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:Ft===Ee&&J===ae?E("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:Ft===0?yt(_o,{children:[E("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),E("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),E("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):Ft===1?yt(_o,{children:[E("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),E("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),E("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):yt(_o,{children:[E("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),E("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),E("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]})}):E("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${J}-${Ft}`)))}),ye=i("grid-template-columns")||i("grid-template-rows");return yt("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[E("div",{style:l,children:E("span",{children:Y?"Auto layout":"Layout"})}),yt("div",{style:{padding:"8px 12px"},children:[yt("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:Sn,borderRadius:2,padding:2,opacity:be,transition:"opacity 150ms ease"},children:[E(ne,{mode:"block",icon:E(Oc,{size:16}),active:N==="block"}),E(ne,{mode:"flex-col",icon:E(Dc,{size:16}),active:N==="flex-col"}),E(ne,{mode:"flex-row",icon:E(Nc,{size:16}),active:N==="flex-row"}),E(ne,{mode:"grid",icon:E(Bc,{size:16}),active:N==="grid"})]}),yt("div",{style:{display:"flex",gap:4,marginBottom:8},children:[E(Fs,{label:"W",property:"width",cssValue:O==="fixed"?ot:`${Math.round(t.getBoundingClientRect().width)}px`,mode:O,onValueChange:J=>n("width",J),onModeChange:J=>{if(J==="fixed"){let Ft=t.getBoundingClientRect();n("width",`${Math.round(Ft.width)}px`)}else n("width",Pi(J,ot))},modified:i("width"),dimmed:Mt&&c!=="width",dropdownOpen:c==="width",onDropdownChange:J=>k(J?"width":null),panelContentRef:u,accentColor:p,onReset:()=>r("width"),minValue:Z!=="none"&&Z!=="0px"&&Z!=="auto"?Z:"",maxValue:It!=="none"&&It!=="auto"?It:"",onMinChange:J=>n("min-width",J||"0"),onMaxChange:J=>n("max-width",J||"none"),onMinReset:()=>r("min-width"),onMaxReset:()=>r("max-width"),minModified:i("min-width"),maxModified:i("max-width")}),E(Fs,{label:"H",property:"height",cssValue:tt==="fixed"?j:`${Math.round(t.getBoundingClientRect().height)}px`,mode:tt,onValueChange:J=>n("height",J),onModeChange:J=>{if(J==="fixed"){let Ft=t.getBoundingClientRect();n("height",`${Math.round(Ft.height)}px`)}else n("height",Pi(J,j))},modified:i("height"),dimmed:Mt&&c!=="height",dropdownOpen:c==="height",onDropdownChange:J=>k(J?"height":null),panelContentRef:u,minValue:mt!=="none"&&mt!=="0px"&&mt!=="auto"?mt:"",maxValue:St!=="none"&&St!=="auto"?St:"",onMinChange:J=>n("min-height",J||"0"),onMaxChange:J=>n("max-height",J||"none"),onMinReset:()=>r("min-height"),onMaxReset:()=>r("max-height"),minModified:i("min-height"),maxModified:i("max-height"),accentColor:p,onReset:()=>r("height")})]}),L&&yt("div",{onMouseEnter:()=>f==null?void 0:f("gap"),onMouseLeave:()=>f==null?void 0:f("element"),style:{display:"flex",gap:8,marginBottom:8},children:[E("div",{style:{opacity:Mt?.3:1,transition:"opacity 150ms ease"},children:ze()}),yt("div",{style:{flex:1,opacity:be,transition:"opacity 150ms ease"},children:[E("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"}),E(dn,{dimmed:Mt,children:yt("div",{style:{display:"flex",alignItems:"center"},children:[E(co,{value:st,onChange:J=>{Pt("gap"),n("gap",J)},onPreview:_t("gap",Dt("gap")),onScrubEnd:()=>Pt("gap"),onReset:()=>r("gap"),isModified:i("gap"),accentColor:p,defaultUnit:g,children:I==="column"||I==="column-reverse"?E(Ns,{size:12,strokeWidth:i("gap")?2.5:1.5}):E(Ps,{size:12,strokeWidth:i("gap")?2.5:1.5})}),E(vn,{property:"gap",value:at.gap||st,onChange:J=>n("gap",J),isModified:i("gap")||"gap"in at,style:x(m({},We),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:b})]})})]})]}),h&&yt("div",{onMouseEnter:()=>f==null?void 0:f("gap"),onMouseLeave:()=>f==null?void 0:f("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:be,transition:"opacity 150ms ease"},children:[E(Gc,{gridCols:Bt,gridRows:ht,gridModified:ye,accentColor:p,onColsChange:J=>n("grid-template-columns",`repeat(${J}, 1fr)`),onRowsChange:J=>n("grid-template-rows",`repeat(${J}, 1fr)`)}),yt("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[E(dn,{dimmed:Mt,children:yt("div",{style:{display:"flex",alignItems:"center"},children:[E(co,{value:F||st,onChange:J=>{Pt("column-gap"),n("column-gap",J)},onPreview:_t("column-gap",Dt("column-gap")),onScrubEnd:()=>Pt("column-gap"),onReset:()=>r("column-gap"),isModified:i("column-gap"),accentColor:p,defaultUnit:g,children:E(Ps,{size:12,strokeWidth:i("column-gap")?2.5:1.5})}),E(vn,{property:"column-gap",value:at["column-gap"]||F||st,onChange:J=>n("column-gap",J),isModified:i("column-gap")||"column-gap"in at,placeholder:"col",style:x(m({},We),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:b})]})}),E(dn,{dimmed:Mt,children:yt("div",{style:{display:"flex",alignItems:"center"},children:[E(co,{value:wt||st,onChange:J=>{Pt("row-gap"),n("row-gap",J)},onPreview:_t("row-gap",Dt("row-gap")),onScrubEnd:()=>Pt("row-gap"),onReset:()=>r("row-gap"),isModified:i("row-gap"),accentColor:p,defaultUnit:g,children:E(Ns,{size:12,strokeWidth:i("row-gap")?2.5:1.5})}),E(vn,{property:"row-gap",value:at["row-gap"]||wt||st,onChange:J=>n("row-gap",J),isModified:i("row-gap")||"row-gap"in at,placeholder:"row",style:x(m({},We),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:b})]})})]})]}),Y&&yt("div",{onMouseEnter:()=>f==null?void 0:f("padding"),onMouseLeave:()=>f==null?void 0:f("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:be,transition:"opacity 150ms ease"},children:[E(dn,{style:{flex:1},dimmed:Mt,children:yt("div",{style:{display:"flex",alignItems:"center"},children:[E(co,{value:q.left,onChange:J=>{Pt("padding-h"),G(J)},onPreview:_t("padding-h",kt),onScrubEnd:()=>Pt("padding-h"),onReset:()=>r("padding"),isModified:i("padding"),accentColor:p,defaultUnit:g,snapSteps:Hs,children:E(Mc,{size:12,strokeWidth:i("padding")?2.5:1.5})}),E(vn,{property:"padding",value:at["padding-h"]||q.left,onChange:J=>G(J),isModified:i("padding")||"padding-h"in at,placeholder:"H pad",style:x(m({},We),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:b})]})}),E(dn,{style:{flex:1},dimmed:Mt,children:yt("div",{style:{display:"flex",alignItems:"center"},children:[E(co,{value:q.top,onChange:J=>{Pt("padding-v"),gt(J)},onPreview:_t("padding-v",Qt),onScrubEnd:()=>Pt("padding-v"),onReset:()=>r("padding"),isModified:i("padding"),accentColor:p,defaultUnit:g,snapSteps:Hs,children:E(Ac,{size:12,strokeWidth:i("padding")?2.5:1.5})}),E(vn,{property:"padding",value:at["padding-v"]||q.top,onChange:J=>gt(J),isModified:i("padding")||"padding-v"in at,placeholder:"V pad",style:x(m({},We),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:g,onUnitCycle:b})]})})]}),yt("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:be,transition:"opacity 150ms ease"},children:[E("input",{type:"checkbox",checked:Yt==="hidden",onChange:J=>n("overflow",J.target.checked?"hidden":"visible"),style:{margin:0,accentColor:p}}),"Clip content"]})]})]})}var Ds={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function Jc({element:t,getValue:e,handleChange:o,isModified:n,onResetProperty:i,isCollapsed:r,onToggle:a,sectionHeaderStyle:s,accentColor:l,colorVariables:c,activeColorDropdown:d,onColorDropdownChange:u,panelContentRef:p,preferredUnit:f,onUnitCycle:g}){var tt;let b=e("font-family"),k=e("font-size"),w=e("font-weight"),I=e("line-height"),N=e("letter-spacing"),L=e("text-align"),h=e("color"),Y=String(w),ot=Ds[Y]||Y,j=Ao(t,h),U=h.includes("var(")?null:Po(j,c),Q=({align:Z,icon:It})=>{let mt=L===Z;return E("button",{type:"button",onClick:()=>o("text-align",Z),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:mt?_s(l,.15):"transparent",color:mt?l:"#64748b",cursor:"pointer"},children:It})},O=((tt=b.split(",")[0])==null?void 0:tt.trim().replace(/^["']|["']$/g,""))||"System";return yt("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[E("div",{style:s,children:E("span",{children:"Typography"})}),yt("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[E(dn,{children:yt("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[E("input",{type:"text",value:b,onChange:Z=>o("font-family",Z.target.value),style:x(m({},We),{flex:1,minWidth:0,padding:0,fontWeight:n("font-family")?600:400,color:n("font-family")?l:"inherit"}),title:b}),E(Wo,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),yt("div",{style:{display:"flex",gap:4},children:[E(dn,{style:{flex:1},children:E("select",{value:Y,onChange:Z=>o("font-weight",Z.target.value),style:x(m({},We),{padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:n("font-weight")?600:400,color:n("font-weight")?l:"inherit"}),children:Object.entries(Ds).map(([Z,It])=>E("option",{value:Z,children:It},Z))})}),E(dn,{style:{flex:1},children:E("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:E(vn,{property:"font-size",value:k,onChange:Z=>o("font-size",Z),isModified:n("font-size"),min:1,max:999,style:x(m({},We),{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})})})]}),yt("div",{style:{display:"flex",gap:4},children:[E(dn,{style:{flex:1},children:yt("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[E(Pc,{size:12,style:{color:n("line-height")?l:"#999",flexShrink:0}}),E(vn,{property:"line-height",value:I,onChange:Z=>o("line-height",Z),isModified:n("line-height"),step:.1,min:0,placeholder:"Auto",style:x(m({},We),{flex:1,minWidth:0,padding:0,fontWeight:n("line-height")?600:400,color:n("line-height")?l:"inherit"}),showUnit:!1})]})}),E(dn,{style:{flex:1},children:yt("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[E(zc,{size:12,style:{color:n("letter-spacing")?l:"#999",flexShrink:0}}),E(vn,{property:"letter-spacing",value:N,onChange:Z=>o("letter-spacing",Z),isModified:n("letter-spacing"),step:.1,placeholder:"\u2014",style:x(m({},We),{flex:1,minWidth:0,padding:0,fontWeight:n("letter-spacing")?600:400,color:n("letter-spacing")?l:"inherit"}),showUnit:!1})]})})]}),yt("div",{style:{display:"flex",gap:2,backgroundColor:Sn,borderRadius:2,padding:2},children:[E(Q,{align:"left",icon:E(Lc,{size:14})}),E(Q,{align:"center",icon:E(Tc,{size:14})}),E(Q,{align:"right",icon:E(Rc,{size:14})}),E(Q,{align:"justify",icon:E(Ic,{size:14})})]}),yt("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[E("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"}),E("div",{style:{flex:1,minWidth:0},children:E(Ws,{value:h,resolvedValue:j,colorVariables:c,matchingVariable:U,onChange:Z=>o("color",Z),accentColor:l,modified:n("color"),panelContentRef:p,isDropdownOpen:d==="color",onDropdownChange:Z=>u(Z?"color":null)})})]})]})]})}function Jn(t){let e=t.match(/^([\d.-]+)(.*)$/);return e?{num:parseFloat(e[1]),unit:e[2]||""}:{num:0,unit:""}}var Hs=[0,1,2,4,8,12,16,20,24,28,32];function co({value:t,onChange:e,onPreview:o,onScrubEnd:n,onReset:i,isModified:r,accentColor:a,defaultUnit:s="rem",snapSteps:l,color:c,style:d,children:u}){let p=fe(null),f=fe(null),g=fe(i),b=fe(r),k=fe(!1);g.current=i,b.current=r,Ke(()=>{let I=L=>{let h=f.current;if(!h)return;h.hasMoved=!0,k.current=L.shiftKey;let Y=h.unit==="rem"||h.unit==="em"?.1:1;h.accum+=L.movementX*Y;let ot=Math.max(0,Math.round((h.startValue+h.accum)*10)/10);if(L.shiftKey&&l){let j=h.unit==="rem"||h.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,U=h.unit==="rem"||h.unit==="em"?ot*j:ot,Q=l[l.length-1];for(let O=0;O<l.length-1;O++){let tt=l[O],Z=l[O+1];if(U<=(tt+Z)/2){Q=tt;break}if(U<Z){Q=Z;break}}U>l[l.length-1]&&(Q=Math.round(U/8)*8),ot=h.unit==="rem"||h.unit==="em"?Math.round(Q/j*1e3)/1e3:Q}o==null||o(`${ot}${h.unit}`)},N=()=>{let L=f.current;if(!L)return;let h=Math.max(0,Math.round((L.startValue+L.accum)*10)/10);if(k.current&&l){let ot=L.unit==="rem"||L.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,j=L.unit==="rem"||L.unit==="em"?h*ot:h,U=l[l.length-1];for(let Q=0;Q<l.length-1;Q++){let O=l[Q],tt=l[Q+1];if(j<=(O+tt)/2){U=O;break}if(j<tt){U=tt;break}}j>l[l.length-1]&&(U=Math.round(j/8)*8),h=L.unit==="rem"||L.unit==="em"?Math.round(U/ot*1e3)/1e3:U}let Y=L.hasMoved&&h!==L.startValue;f.current=null,document.exitPointerLock(),Y?e(`${h}${L.unit}`):L.hasMoved?o==null||o(`${L.startValue}${L.unit}`):b.current&&g.current&&g.current(),n==null||n()};return document.addEventListener("mousemove",I),document.addEventListener("mouseup",N),()=>{document.removeEventListener("mousemove",I),document.removeEventListener("mouseup",N)}},[e,o,n]);let w=He(I=>{var h;if(I.button!==0)return;I.preventDefault();let N=Jn(t),L=N.unit&&N.unit!=="px"?N.unit:s;f.current={startValue:N.num,unit:L,accum:0,hasMoved:!1},(h=p.current)==null||h.requestPointerLock()},[t,s]);return E("span",{ref:p,onMouseDown:w,title:r?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:m({color:r?a||"#3b82f6":c||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize"},d),children:u})}function Ys({element:t,elementInfo:e,selector:o,styleModifications:n,dispatch:i,onClose:r,onHover:a,accentColor:s="#3b82f6"}){var ne,he;let l=fe(null),c=fe(null),[d,u]=Te(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch(G){return!1}});Ke(()=>{if(d)return;let G=setTimeout(()=>u(!0),50);return()=>clearTimeout(G)},[d]);let[p,f]=Te(null),[g,b]=Te(null),k=p!==null||g!==null,[w,I]=Te("rem"),N=He(()=>{I(G=>G==="rem"?"px":"rem")},[]),L=fe(new Map),[h,Y]=Te(""),ot=$o(()=>ui(),[]);Ke(()=>{let G=gt=>{var At;if(gt.key!=="Escape")return;let at=document.activeElement;at&&((At=l.current)!=null&&At.contains(at))||r()};return window.addEventListener("keydown",G),()=>window.removeEventListener("keydown",G)},[r]);let j=fe({top:0,left:0,maxHeight:400}),[,U]=Te(0),Q="devtools-panel-position",O=fe({x:0,y:0}),tt=fe(null),Z=fe(!1);Ke(()=>{try{let G=localStorage.getItem(Q);if(G){let gt=JSON.parse(G);typeof gt.top=="number"&&typeof gt.left=="number"&&(Z.current=!0,j.current=x(m({},j.current),{top:gt.top,left:gt.left}))}}catch(G){}},[]),Ke(()=>{let G=at=>{let At=tt.current;if(!At)return;let _t=At.startOffsetX+(at.clientX-At.startX),Pt=At.startOffsetY+(at.clientY-At.startY),kt=280,Qt=16,Dt=Math.max(Qt,Math.min(window.innerWidth-kt-Qt,j.current.left+_t)),Ce=Math.max(Qt,j.current.top+Pt);O.current={x:Dt-j.current.left,y:Ce-j.current.top};let re=l.current,pe=re==null?void 0:re.parentElement;if(!pe)return;pe.style.top=`${Ce}px`,pe.style.left=`${Dt}px`;let Ut=document.getElementById("devtools-toolbar"),Ee=Ut==null?void 0:Ut.getBoundingClientRect(),ae=window.innerHeight-16;Ee&&Dt+kt>Ee.left&&(ae=Ee.top-8);let Ge=Math.max(0,Ce),ce=Math.max(200,ae-Ge);re&&(re.style.maxHeight=`${ce}px`)},gt=()=>{if(!tt.current)return;let at=j.current.top+O.current.y,At=j.current.left+O.current.x;j.current=x(m({},j.current),{top:at,left:At}),O.current={x:0,y:0},Z.current=!0;try{localStorage.setItem(Q,JSON.stringify({top:at,left:At}))}catch(_t){}tt.current=null};return window.addEventListener("mousemove",G),window.addEventListener("mouseup",gt),()=>{window.removeEventListener("mousemove",G),window.removeEventListener("mouseup",gt)}},[]);let It=He(G=>{G.button!==0||G.target.closest("button")||(G.preventDefault(),tt.current={startX:G.clientX,startY:G.clientY,startOffsetX:O.current.x,startOffsetY:O.current.y})},[]);Ke(()=>{O.current={x:0,y:0};let G=(At=!1)=>{let _t=l.current,Pt=280,kt=8,Qt,Dt;if(Z.current)Qt=j.current.top,Dt=j.current.left;else{let ae=t.getBoundingClientRect();Dt=ae.right+kt,Qt=ae.top,Dt+Pt>window.innerWidth-kt&&(Dt=ae.left-Pt-kt),Dt<kt&&(Dt=Math.max(kt,(window.innerWidth-Pt)/2))}let Ce=document.getElementById("devtools-toolbar"),re=Ce==null?void 0:Ce.getBoundingClientRect(),pe=window.innerHeight-16;re&&Dt+Pt>re.left&&(pe=re.top-kt);let Ut=Math.max(0,Qt),Ee=Math.max(200,pe-Ut);if(j.current={top:Qt,left:Dt,maxHeight:Ee},At&&_t){let ae=_t.parentElement;ae&&!Z.current&&(ae.style.top=`${Qt+O.current.y}px`,ae.style.left=`${Dt+O.current.x}px`),_t.style.maxHeight=`${Ee}px`}else U(ae=>ae+1)};G(!1);let gt=()=>G(!0),at=()=>G(!1);return window.addEventListener("scroll",gt,{passive:!0}),window.addEventListener("resize",at,{passive:!0}),()=>{window.removeEventListener("scroll",gt),window.removeEventListener("resize",at)}},[t]),Ke(()=>{let G=l.current;if(!G)return;let gt=at=>{let At=c.current;if(!At){at.preventDefault();return}let{scrollTop:_t,scrollHeight:Pt,clientHeight:kt}=At,Qt=_t<=0&&at.deltaY<0,Dt=_t+kt>=Pt&&at.deltaY>0;(Qt||Dt)&&at.preventDefault()};return G.addEventListener("wheel",gt,{passive:!1}),()=>G.removeEventListener("wheel",gt)},[]);let mt=$o(()=>n.find(G=>G.selector===o),[n,o]),St=He(G=>{let gt=mt==null?void 0:mt.changes.find(at=>at.property===G);if(gt)return gt.modified;if(G.includes("color")){let at=si(t,G);if(at&&at.includes("var("))return at}return io(t,G)},[t,mt]),q=He(G=>{if(L.current.has(G))return L.current.get(G);let gt=mt==null?void 0:mt.changes.find(At=>At.property===G);if(gt)return gt.original;let at=io(t,G);return L.current.set(G,at),at},[t,mt]),st=He((G,gt)=>{let at=q(G);jt(t,G,gt),G==="backdrop-filter"&&jt(t,"-webkit-backdrop-filter",gt),i({type:"MODIFY_STYLE",payload:{selector:o,element:e,property:G,original:at,modified:gt}})},[t,o,e,i,q]),wt=He(()=>{di(o,n);let G=n.find(gt=>gt.selector===o);if(G)for(let gt of G.changes)i({type:"CLEAR_STYLE",payload:{selector:o,property:gt.property}});L.current.clear()},[o,n,i]),F=He(G=>{let gt=n.find(At=>At.selector===o);gt!=null&&gt.changes.find(At=>At.property===G)&&t instanceof HTMLElement&&(t.style.removeProperty(G),i({type:"CLEAR_STYLE",payload:{selector:o,property:G}}),L.current.delete(G))},[t,o,n,i]),bt=He(()=>{let G=h.split(";").map(gt=>gt.trim()).filter(gt=>gt);for(let gt of G){let at=gt.indexOf(":");if(at>0){let At=gt.slice(0,at).trim(),_t=gt.slice(at+1).trim();At&&_t&&st(At,_t)}}Y("")},[h,st]),vt=He(G=>{var gt;return(gt=mt==null?void 0:mt.changes.some(at=>at.property===G))!=null?gt:!1},[mt]),Yt=G=>{var Pt;let gt=St(G.property),at=vt(G.property),At=!at&&_c(G.property,gt),_t={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};if(At&&G.type!=="backdrop-filter")return E(In,{modified:!1,children:E("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:kt=>st(G.property,kt.target.value),style:x(m({},_t),{color:"#999"})})});switch(G.type){case"color":{let kt=Ao(t,gt),Qt=gt.includes("var(")?null:Po(kt,ot);return E(Ws,{value:gt,resolvedValue:kt,colorVariables:ot,matchingVariable:Qt,onChange:Dt=>st(G.property,Dt),accentColor:s,modified:at,panelContentRef:c,isDropdownOpen:g===G.property,onDropdownChange:Dt=>b(Dt?G.property:null)})}case"number":{if(!!Oi[G.property])return E(In,{modified:at,children:E(vn,{property:G.property,value:gt,onChange:Dt=>st(G.property,Dt),isModified:at,min:G.min,max:G.max,step:G.step||1,style:x(m({},_t),{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:w,onUnitCycle:N})});let{num:Qt}=Jn(gt);return E(In,{modified:at,children:E("input",{type:"number",value:Qt,min:G.min,max:G.max,step:G.step||1,onChange:Dt=>st(G.property,Dt.target.value),style:_t})})}case"select":return E(In,{modified:at,children:yt("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[E("select",{value:gt,onChange:kt=>st(G.property,kt.target.value),style:x(m({},_t),{cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"}),children:(Pt=G.options)==null?void 0:Pt.map(kt=>E("option",{value:kt,children:kt},kt))}),E("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:E(Wo,{size:12})})]})});case"spacing":return E(In,{modified:at,children:E("input",{type:"text",value:gt,onChange:kt=>st(G.property,kt.target.value),placeholder:"e.g., 10px or 10px 20px",style:_t})});case"backdrop-filter":return E(jc,{value:gt,onChange:kt=>st(G.property,kt),accentColor:s,modified:at,panelContentRef:c});default:return E(In,{modified:at,children:E("input",{type:"text",value:gt,onChange:kt=>st(G.property,kt.target.value),style:_t})})}},Bt=(ne=mt==null?void 0:mt.changes.length)!=null?ne:0,ht=(he=mt==null?void 0:mt.captured)!=null?he:!1,ue=x(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)"},cn),{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"}),ct={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"},Mt={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"},Lt={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},be={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return E("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:yt("div",{ref:l,"data-devtools":"panel",style:x(m({},ue),{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:[yt("div",{style:ct,onMouseDown:It,children:[yt("div",{style:{display:"flex",alignItems:"center",gap:8,overflow:"hidden"},children:[E("span",{style:{fontWeight:600,fontSize:11,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:e.tagName}),Bt>0&&E("span",{style:{backgroundColor:ht?"#999999":s,color:"#fff",fontSize:9,padding:"1px 4px",borderRadius:2},children:Bt})]}),yt("div",{style:{display:"flex",gap:4},children:[Bt>0&&E("button",{type:"button",onClick:wt,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:E(Fc,{size:14})}),E("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:E(zs,{size:14})})]})]}),yt("div",{ref:c,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[E("div",{style:{opacity:g?.3:1,transition:"opacity 150ms ease"},children:E(Vc,{element:t,getValue:St,getOriginalValue:q,handleChange:st,isModified:vt,onResetProperty:F,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:Mt,activeDropdown:p,onDropdownChange:f,panelContentRef:c,accentColor:s,onFieldHover:a,preferredUnit:w,onUnitCycle:N})}),E("div",{style:{opacity:p?.3:1,transition:"opacity 150ms ease"},children:E(Jc,{element:t,getValue:St,handleChange:st,isModified:vt,onResetProperty:F,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:Mt,accentColor:s,colorVariables:ot,activeColorDropdown:g,onColorDropdownChange:b,panelContentRef:c,preferredUnit:w,onUnitCycle:N})}),Bs.map((G,gt)=>{let at=gt===Bs.length-1,At=g&&G.properties.some(Pt=>Pt.property===g);return yt("div",{style:{borderBottom:at?"none":"1px solid rgba(0,0,0,0.08)",opacity:k&&!At?.3:1,transition:"opacity 150ms ease"},children:[E("div",{style:Mt,children:E("span",{children:G.name})}),E("div",{style:{padding:"4px 0"},children:G.properties.map(Pt=>{let kt=vt(Pt.property),Qt=At&&Pt.property!==g;return yt("div",{style:x(m({},Lt),{opacity:Qt?.3:1,transition:"opacity 150ms ease"}),children:[E("span",{onClick:kt?()=>F(Pt.property):void 0,title:kt?"Click to reset":void 0,style:x(m({},be),{color:kt?s:"#64748b",fontWeight:kt?600:400,cursor:kt?"pointer":"default"}),children:Pt.label}),E("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:Yt(Pt)})]},Pt.property)})})]},G.name)}),yt("div",{style:{opacity:k?.3:1,transition:"opacity 150ms ease"},children:[E("div",{style:Mt,children:E("span",{children:"Raw CSS"})}),yt("div",{style:{padding:"8px 12px"},children:[E("textarea",{value:h,onChange:G=>Y(G.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"}}),h.trim()&&E("button",{type:"button",onClick:bt,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:s,color:"#fff",cursor:"pointer",opacity:h.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as Xc,useLayoutEffect as Kc,useState as Uc}from"react";import{Fragment as td,jsx as Bn,jsxs as Qc}from"react/jsx-runtime";var Fi=["flex-start","center","flex-end"],Di=["flex-start","center","flex-end"];function Zc(t){return t==="normal"||t==="flex-start"||t==="start"?"flex-start":t==="flex-end"||t==="end"?"flex-end":t==="center"?"center":null}function qc(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 js(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 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>i&&(i=s.bottom),s.right>r&&(r=s.right))}return o===1/0?null:new DOMRect(n,o,r-n,i-o)}function Gs({element:t,modifier:e,accentColor:o,refreshKey:n=0}){let[i,r]=Uc(null);if(Xc(()=>{if(!t){r(null);return}let b=()=>r(js(t));return b(),window.addEventListener("scroll",b,{passive:!0}),window.addEventListener("resize",b,{passive:!0}),()=>{window.removeEventListener("scroll",b),window.removeEventListener("resize",b)}},[t]),Kc(()=>{t&&r(js(t))},[t,n]),!i)return null;let a=i,s=window.getComputedStyle(t),l=s.display;if(l!=="flex"&&l!=="inline-flex")return null;let c=s.flexDirection,d=c==="column"||c==="column-reverse"?"vertical":"horizontal",u=d==="horizontal"?"vertical":"horizontal",p=[];if(e==="shift"){let b=Zc(s.justifyContent);if(b){let k=Fi.indexOf(b);d==="horizontal"?(k>0&&p.push("left"),k<Fi.length-1&&p.push("right")):(k>0&&p.push("up"),k<Fi.length-1&&p.push("down"))}}else{let b=qc(s.alignItems);if(b){let k=Di.indexOf(b);u==="horizontal"?(k>0&&p.push("left"),k<Di.length-1&&p.push("right")):(k>0&&p.push("up"),k<Di.length-1&&p.push("down"))}}if(p.length===0)return null;let f=14,g=7;return Bn(td,{children:p.map(b=>{let k,w;switch(b){case"right":k=a.right+f,w=a.top+a.height/2;break;case"left":k=a.left-f,w=a.top+a.height/2;break;case"down":k=a.left+a.width/2,w=a.bottom+f;break;case"up":k=a.left+a.width/2,w=a.top-f;break}let I=b==="right"?0:b==="left"?180:b==="down"?90:-90,N={position:"fixed",left:k-g,top:w-g,width:g*2,height:g*2,pointerEvents:"none",zIndex:9997};return Bn("div",{"data-devtools":"swipe-hint",style:N,children:Bn("svg",{width:g*2,height:g*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:Qc("g",{transform:`rotate(${I})`,children:[Bn("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),Bn("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),Bn("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:o,strokeWidth:"1.5",strokeLinecap:"round"}),Bn("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:o,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},b)})})}import{useEffect as ed,useLayoutEffect as nd,useState as od}from"react";import{jsx as Hi,jsxs as zi}from"react/jsx-runtime";function id(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 Vs({element:t,fontSize:e,lineHeight:o,accentColor:n,hoveredProperty:i,draggingProperty:r,cursorViewport:a}){let[s,l]=od(null);if(ed(()=>{if(!t){l(null);return}let w=()=>{l(Yn(t))};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[t]),nd(()=>{t&&l(Yn(t))},[t,e,o]),!s)return null;let c=s.width,d=s.height,u=id(n,.2),p=r!=null?r:i,f=8,g=2,b={position:"fixed",top:s.top,left:s.left,width:c,height:d,pointerEvents:"none",zIndex:9996,overflow:"visible"},k=w=>w==="font-size"?`${Math.round(e)}`:(e>0?o/e:1.2).toFixed(2).replace(/\.?0+$/,"");return zi("div",{"data-devtools":"text-handles",style:b,children:[zi("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${d}`,children:[Hi("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)&&Hi("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)&&Hi("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"})]}),a&&p&&(()=>{let w=p==="font-size"?"Aa":"Lh",I=k(p);return zi("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:[w," ",I]})})()]})}import{Fragment as Ye,jsx as rt,jsxs as ge}from"react/jsx-runtime";var Js=8,$i=[0,1,2,4,8,12,16,20,24,28,32],po=22,Wi="devtools-active-text";function Xs(t,e,o=0){let n=t.left+window.scrollX+4,i=e==="top-left"?t.top+window.scrollY-po-o*po+4:t.bottom+window.scrollY+4-1+o*po;return{x:n,y:i}}function Us({state:t,dispatch:e,onScreenshot:o,inFlightAnnotationIds:n,inFlightStyleSelectors:i,inFlightSelectorColors:r,onAttachImages:a,onReply:s,onViewThread:l,activePlan:c,onModelComponentsAdd:d,onModelComponentFocus:u,onModelComponentHover:p,modelComponentNames:f,modelPanelHoveredComponent:g,modelSpacingTokenHover:b}){var wr,kr,Cr,Er,Tr,Mr,Ir,Lr,Rr,Ar;let{canvasRef:k,redrawAll:w,resizeCanvas:I}=fs(),[N,L]=Kt(!1),[h,Y]=Kt(()=>{if(typeof window=="undefined")return null;try{let S=localStorage.getItem(Wi);return S?JSON.parse(S):null}catch(S){return null}}),[ot,j]=Kt(null),[U,Q]=Kt(null),[O,tt]=Kt(null),Z=we(null),It=we(null),mt=we({x:0,y:0}),St=we([]),q=we(0),[st,wt]=Kt(null),[F,bt]=Kt(new Map),vt=we(0),Yt=we(null),[Bt,ht]=Kt(null),[ue,ct]=Kt(null),Mt=we({isDragging:!1,side:null,startX:0,startY:0,original:{top:0,right:0,bottom:0,left:0},element:null,elementInfo:null,selector:null,durableSelector:null}),[Lt,be]=Kt(null),[ne,he]=Kt(null),[G,gt]=Kt(null),[at,At]=Kt(null),_t=we({x:0,y:0}),[Pt,kt]=Kt({x:0,y:0}),Qt=we({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}),[Dt,Ce]=Kt(null),[re,pe]=Kt(null),[Ut,Ee]=Kt(null),[ae,Ge]=Kt(!1),[ce,Ve]=Kt(0),[ve,Ze]=Kt(null),ze=we({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}),[ye,qe]=Kt(null),[J,Ft]=Kt(null),[Nt,Qe]=Kt(null),te=we({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[Jt,De]=Kt(null),[Be,gn]=Kt(null),[ee,sn]=Kt(null),V=gs(),et=we(r);et.current=r;let y=Me(S=>{let C=et.current;if(!C||C.size===0)return!1;for(let nt of C.keys())try{if(S.matches(nt))return!0}catch(M){}return!1},[]),R=we(t);R.current=t;let A=we(h);A.current=h;let z=we([]),Ct=we(o);Ct.current=o;let[dt,lt]=Kt(null),Ot=t.selectedAnnotationIds;z.current=Ot;let Rt=Me((S,C=!1)=>{e({type:"SELECT_ANNOTATION",payload:{id:S,addToSelection:C}})},[e]),Ht=Me(()=>{e({type:"SELECT_ANNOTATION",payload:{id:null}})},[e]),[xt,qt]=Kt(null),[le,nn]=Kt({x:window.scrollX,y:window.scrollY});Ie(()=>(I(),window.addEventListener("resize",I),()=>window.removeEventListener("resize",I)),[I]),Ie(()=>{let S=()=>{nn({x:window.scrollX,y:window.scrollY})};return window.addEventListener("scroll",S,{passive:!0}),()=>window.removeEventListener("scroll",S)},[]),Ie(()=>{h?localStorage.setItem(Wi,JSON.stringify(h)):localStorage.removeItem(Wi)},[h]),ms(h,Y,ot,t.annotations,e);let fn=we(st);fn.current=st,Ie(()=>{if(t.activeTool!=="model"||!t.isAnnotating)return;let S=C=>{if(!C.altKey||!fn.current)return;C.preventDefault();let nt=C.deltaY>0?-1:1;vt.current=Math.max(0,vt.current+nt);let M=Yt.current;if(M){let B=Co(M,vt.current);wt(B)}};return window.addEventListener("wheel",S,{passive:!1}),()=>window.removeEventListener("wheel",S)},[t.activeTool,t.isAnnotating]),Ie(()=>{t.activeTool!=="model"&&(wt(null),bt(new Map),vt.current=0,Yt.current=null)},[t.activeTool]),Ie(()=>{var nt;let S=(nt=st==null?void 0:st.name)!=null?nt:null,C=S&&(f!=null&&f.has(S))?S:null;p==null||p(C)},[st,f,p]);let[mn,Je]=Kt(null);Ie(()=>{var nt;if(!g){Je(null);return}let S=$n(g.name),C=g.instanceIndex;Je((nt=S[C%S.length])!=null?nt:null)},[g]);let[En,Xo]=Kt([]);Ie(()=>{var S,C;if(!b){Xo([]);return}(C=(S=b.token)==null?void 0:S.bindings)!=null&&C.length?Xo(oi(b.token)):Xo(ei(b.px))},[b]);let va=we(null),Sa=we(null);va.current=Dt,Sa.current=re,Ie(()=>{let S=["flex-start","center","flex-end"],C=["flex-start","center","flex-end"],M=null,B=!1,D=null,ut=null,H=(ft,Tt)=>{let Vt=Tn(ft,Tt);for(;Vt&&Vt!==document.documentElement;){let ie=window.getComputedStyle(Vt).display;if(ie==="flex"||ie==="inline-flex")return Vt;Vt=Vt.parentElement}return null},X=ft=>{let Tt=window.getComputedStyle(ft).flexDirection;return Tt==="column"||Tt==="column-reverse"?"vertical":"horizontal"},v=ft=>{let Tt=ft.getAttribute("data-pm");return Tt||(Tt=Math.random().toString(36).substring(2,8),ft.setAttribute("data-pm",Tt)),{selector:`[data-pm="${Tt}"]`,durableSelector:rn(ft)}},T=()=>{B=!0,M&&clearTimeout(M),M=setTimeout(()=>{B=!1,M=null},300)},K=(ft,Tt,Xt)=>{let Vt=X(ft);if(Tt===Vt){let $t=window.getComputedStyle(ft).justifyContent,de=$t==="normal"||$t==="flex-start"||$t==="start"?"flex-start":$t==="flex-end"||$t==="end"?"flex-end":$t==="center"?"center":null;if(!de)return;let Oe=S.indexOf(de)+Xt;if(Oe<0||Oe>=S.length)return;let bn=S[Oe],{selector:Rn,durableSelector:Uo}=v(ft);jt(ft,"justify-content",bn),e({type:"MODIFY_STYLES_BATCH",payload:{selector:Rn,durableSelector:Uo,element:_e(ft),changes:[{property:"justify-content",original:$t,modified:bn}]}})}else{let $t=window.getComputedStyle(ft).flexDirection,de=Vt==="horizontal"?"column":"row",{selector:an,durableSelector:Oe}=v(ft);jt(ft,"flex-direction",de),e({type:"MODIFY_STYLES_BATCH",payload:{selector:an,durableSelector:Oe,element:_e(ft),changes:[{property:"flex-direction",original:$t,modified:de}]}})}Ve(ie=>ie+1)},P=(ft,Tt,Xt)=>{let ie=X(ft)==="horizontal"?"vertical":"horizontal";if(Tt!==ie)return;let de=window.getComputedStyle(ft).alignItems,an=de==="normal"||de==="stretch"||de==="flex-start"||de==="start"?"flex-start":de==="flex-end"||de==="end"?"flex-end":de==="center"?"center":null;if(!an)return;let bn=C.indexOf(an)+Xt;if(bn<0||bn>=C.length)return;let Rn=C[bn],{selector:Uo,durableSelector:La}=v(ft);jt(ft,"align-items",Rn),e({type:"MODIFY_STYLES_BATCH",payload:{selector:Uo,durableSelector:La,element:_e(ft),changes:[{property:"align-items",original:de,modified:Rn}]}}),Ve(Ra=>Ra+1)},W=20,_=null,$=null,pt=0,Et=(ft,Tt,Xt)=>{let Vt=H(Tt,Xt);Ze(Vt?{modifier:ft,target:Vt}:null)},oe=ft=>{if(!(t.activeTool!=="hand"||!t.isAnnotating)){if(ft.key==="Shift"&&!ft.altKey){let Tt=_t.current;Et("shift",Tt.x,Tt.y)}else if(ft.key==="Alt"&&!ft.shiftKey){let Tt=_t.current;Et("alt",Tt.x,Tt.y)}}},Gt=ft=>{if(t.activeTool!=="hand"||!t.isAnnotating)return;let Tt=ft.shiftKey&&!ft.altKey,Xt=ft.altKey&&!ft.shiftKey;if(!Tt&&!Xt||ft.buttons!==0){_=null,$=null,pt=0,D=null,ut=null,Ze(null);return}if(D===null&&(D=ft.clientX,ut=ft.clientY,Et(Tt?"shift":"alt",ft.clientX,ft.clientY)),B)return;_===null&&(_=ft.clientX,$=ft.clientY,pt=0);let Vt=ft.clientX-_,ie=ft.clientY-$,$t=Math.abs(Vt)>=Math.abs(ie)?Vt:ie;if(Math.abs($t)>3){let Rn=$t>0?1:-1;if(pt!==0&&Rn!==pt){_=ft.clientX,$=ft.clientY,pt=0;return}pt=Rn}if(Math.abs(Vt)<W&&Math.abs(ie)<W)return;let de=H(D,ut);if(!de)return;let an=Math.abs(Vt)>=Math.abs(ie)?"horizontal":"vertical",bn=(an==="horizontal"?Vt:ie)>0?1:-1;_=null,$=null,pt=0,Tt?K(de,an,bn):P(de,an,bn),T()},Le=ft=>{(ft.key==="Shift"||ft.key==="Alt")&&(D=null,ut=null,_=null,$=null,pt=0,Ze(null))},se=()=>{Ze(null),_=null,$=null,pt=0};return window.addEventListener("keydown",oe),window.addEventListener("mousemove",Gt),window.addEventListener("mousedown",se),window.addEventListener("keyup",Le),()=>{window.removeEventListener("keydown",oe),window.removeEventListener("mousemove",Gt),window.removeEventListener("mousedown",se),window.removeEventListener("keyup",Le),M&&clearTimeout(M)}},[t.activeTool,t.isAnnotating,e]),Ie(()=>{let S=C=>{var M;if(C.key==="Escape"){if(A.current)return;if(t.activeTool==="model"&&F.size>0){C.preventDefault(),bt(new Map);return}if(z.current.length>0){C.preventDefault(),Ht();return}}if(C.key==="Enter"&&t.activeTool==="model"&&F.size>0&&d){C.preventDefault();let B=[...F.keys()].filter(D=>!(f!=null&&f.has(D)));B.length>0&&d(B),bt(new Map);return}if((C.metaKey||C.ctrlKey)&&C.key==="v"&&St.current.length>0&&!A.current){C.preventDefault(),q.current++;let B=q.current*20,ut=((M=St.current[0])==null?void 0:M.groupId)?Math.random().toString(36).substring(2,9):void 0,H=St.current.map(v=>x(m({},v),{id:Math.random().toString(36).substring(2,9),groupId:v.groupId?ut:void 0,timestamp:Date.now(),points:v.points.map(T=>({x:T.x+B,y:T.y+B}))}));e({type:"PASTE_ANNOTATIONS",payload:{annotations:H}});let X=H.find(v=>v.type!=="text")||H[0];X&&Rt(X.id);return}let nt=z.current;if(!(nt.length===0||A.current)&&(C.key==="Delete"||C.key==="Backspace")){C.preventDefault();for(let B of nt)e({type:"DELETE_ANNOTATION",payload:{id:B}});Ht()}};return window.addEventListener("keydown",S),()=>window.removeEventListener("keydown",S)},[e,Ht,Rt,t.activeTool,F,f,d]);let hn=_i(()=>Fo(t.annotations),[t.annotations]),Qn=_i(()=>{let S=new Map,C=new Set,nt=1;for(let M of t.annotations)if(!hn.has(M))if(M.groupId){if(!C.has(M.groupId)){C.add(M.groupId);let B=t.annotations.filter(D=>D.groupId===M.groupId);for(let D of B)S.set(D.id,nt);nt++}}else S.set(M.id,nt),nt++;return S},[t.annotations,hn]),mr=_i(()=>{if(Ot.length===0)return null;let S=new Map;for(let C of Ot){let nt=t.annotations.find(B=>B.id===C);if(!nt)continue;let M=nt.groupId?t.annotations.filter(B=>B.groupId===nt.groupId):[nt];for(let B of M)if(B.linkedSelector&&!(r!=null&&r.has(B.linkedSelector))){let D=B.color||t.activeColor;S.set(B.linkedSelector,D)}}return S.size>0?S:null},[Ot,t.annotations,t.activeColor,r]);Ie(()=>{let S=t.annotations.filter(C=>!(hn.has(C)||h&&!h.isNew&&C.id===h.id));w(S,t.currentPath,t.activeTool,t.activeColor,t.strokeWidth,Ot,Js,le.x,le.y,Qn)},[t.annotations,t.currentPath,t.activeTool,t.activeColor,t.strokeWidth,w,h,Ot,le,Qn,hn]),Ie(()=>{if(U){let S=Math.random().toString(36).substring(2,9);Y({id:S,point:U.point,text:"",fontSize:12,isNew:!0,groupId:U.groupId}),Q(null)}},[U]),Ie(()=>{O&&(Y({id:Math.random().toString(36).substring(2,9),point:O.point,text:"",fontSize:12,isNew:!0,linkedSelector:O.linkedSelector,linkedAnchor:O.linkedAnchor,elements:O.elements}),tt(null))},[O]),Ie(()=>{h&&Z.current?requestAnimationFrame(()=>{var C;let S=Z.current;if(S&&(S.focus(),It.current!==h.id&&(It.current=h.id,!h.isNew&&h.clickPoint))){let nt=k.current;if(!nt)return;let M=nt.getContext("2d");if(!M)return;M.font=`${h.fontSize}px ${Se}`;let B=h.fontSize*1.4,D=h.text.split(`
+`),ut=h.clickPoint.y-h.point.y,H=Math.max(0,Math.min(D.length-1,Math.floor(ut/B))),X=h.clickPoint.x-h.point.x,v=D[H]||"",T=0;for(let P=0;P<=v.length;P++){let W=M.measureText(v.substring(0,P)).width;if(W>X){let _=P>0?M.measureText(v.substring(0,P-1)).width:0;T=X-_<W-X?P-1:P;break}T=P}let K=T;for(let P=0;P<H;P++)K+=(((C=D[P])==null?void 0:C.length)||0)+1;S.setSelectionRange(K,K)}}):It.current=null},[h,k]);let Dn=Me(S=>{let C=k.current;if(!C)return{x:0,y:0};let nt=C.getBoundingClientRect(),M,B;if("touches"in S&&S.touches[0])M=S.touches[0].clientX,B=S.touches[0].clientY;else if("clientX"in S)M=S.clientX,B=S.clientY;else return{x:0,y:0};return{x:M-nt.left+window.scrollX,y:B-nt.top+window.scrollY}},[k]),Ln=Me((S,C,nt,M)=>{let B=nt.x-C.x,D=nt.y-C.y,ut=B*B+D*D;if(ut===0)return Math.sqrt((S.x-C.x)**2+(S.y-C.y)**2)<=M;let H=Math.max(0,Math.min(1,((S.x-C.x)*B+(S.y-C.y)*D)/ut)),X=C.x+H*B,v=C.y+H*D;return Math.sqrt((S.x-X)**2+(S.y-v)**2)<=M},[]),bo=Me(S=>{for(let nt=t.annotations.length-1;nt>=0;nt--){let M=t.annotations[nt];if(!M||hn.has(M))continue;let B=(M.strokeWidth||3)+4;switch(M.type){case"text":{if(!M.points[0]||!M.text)continue;let D=M.points[0],ut=M.fontSize||12,H=k.current;if(H){let X=H.getContext("2d");if(X){X.font=`${ut}px ${Se}`;let v=M.text.split(`
+`),T=Math.max(...v.map(P=>X.measureText(P).width)),K=v.length*(ut*1.4);if(S.x>=D.x-4-4&&S.x<=D.x+T+4+4&&S.y>=D.y-4-4&&S.y<=D.y+K+4+4)return M}}break}case"rectangle":{if(M.points.length<2)continue;let D=M.points[0],ut=M.points[M.points.length-1],H=Math.min(D.x,ut.x),X=Math.max(D.x,ut.x),v=Math.min(D.y,ut.y),T=Math.max(D.y,ut.y),K=Ln(S,{x:H,y:v},{x:X,y:v},B),P=Ln(S,{x:H,y:T},{x:X,y:T},B),W=Ln(S,{x:H,y:v},{x:H,y:T},B),_=Ln(S,{x:X,y:v},{x:X,y:T},B);if(K||P||W||_)return M;break}case"circle":{if(M.points.length<2)continue;let D=M.points[0],ut=M.points[M.points.length-1],H=(D.x+ut.x)/2,X=(D.y+ut.y)/2,v=Math.abs(ut.x-D.x)/2,T=Math.abs(ut.y-D.y)/2,K=S.x-H,P=S.y-X,W=Math.sqrt((K/v)**2+(P/T)**2);if(Math.abs(W-1)*Math.max(v,T)<=B)return M;break}case"line":{if(M.points.length<2)continue;let D=M.points[0],ut=M.points[M.points.length-1];if(Ln(S,D,ut,B))return M;break}case"freehand":{if(M.points.length<2)continue;for(let D=0;D<M.points.length-1;D++){let ut=M.points[D],H=M.points[D+1];if(Ln(S,ut,H,B))return M}break}}}return null},[t.annotations,k,Ln,hn]),hr=Me(S=>{let C=bo(S);return(C==null?void 0:C.type)==="text"?C:null},[bo]),yr=Me(S=>{if(Ot.length===0)return null;let C=Js/2+4;for(let nt of Ot){let M=t.annotations.find(B=>B.id===nt);if(!(!M||M.points.length<2)){if(M.type==="line"){let B=M.points[0],D=M.points[M.points.length-1];if(Math.sqrt((S.x-B.x)**2+(S.y-B.y)**2)<=C)return{handle:"start",annotationId:nt};if(Math.sqrt((S.x-D.x)**2+(S.y-D.y)**2)<=C)return{handle:"end",annotationId:nt};continue}if(M.type==="circle"){let B=M.points[0],D=M.points[M.points.length-1],ut=Math.min(B.x,D.x),H=Math.max(B.x,D.x),X=Math.min(B.y,D.y),v=Math.max(B.y,D.y),T=(ut+H)/2,K=(X+v)/2,P=[{handle:"top",x:T,y:X},{handle:"bottom",x:T,y:v},{handle:"left",x:ut,y:K},{handle:"right",x:H,y:K}];for(let{handle:W,x:_,y:$}of P)if(Math.sqrt((S.x-_)**2+(S.y-$)**2)<=C)return{handle:W,annotationId:nt};continue}if(M.type==="rectangle"||M.type==="freehand"){let B=M.points[0],D=M.points[M.points.length-1],ut,H,X,v;M.type==="freehand"?(ut=Math.min(...M.points.map(K=>K.x)),H=Math.max(...M.points.map(K=>K.x)),X=Math.min(...M.points.map(K=>K.y)),v=Math.max(...M.points.map(K=>K.y))):(ut=Math.min(B.x,D.x),H=Math.max(B.x,D.x),X=Math.min(B.y,D.y),v=Math.max(B.y,D.y));let T=[{corner:"topLeft",x:ut,y:X},{corner:"topRight",x:H,y:X},{corner:"bottomLeft",x:ut,y:v},{corner:"bottomRight",x:H,y:v}];for(let{corner:K,x:P,y:W}of T)if(Math.sqrt((S.x-P)**2+(S.y-W)**2)<=C)return{handle:K,annotationId:nt}}}}return null},[Ot,t.annotations]);Ie(()=>{let S=C=>{if(mt.current={x:C.clientX+window.scrollX,y:C.clientY+window.scrollY},!h){let nt=hr(mt.current);j((nt==null?void 0:nt.id)||null)}};return window.addEventListener("mousemove",S),()=>window.removeEventListener("mousemove",S)},[h,hr]);let Hn=Me(()=>{var C;if(!h)return;let S=((C=h.images)==null?void 0:C.length)||0;if(h.text.trim()||S>0)if(h.isNew){let nt=_n();e({type:"ADD_TEXT",payload:m({point:h.point,text:h.text||(S>0?`[${S} image${S>1?"s":""}]`:""),fontSize:h.fontSize,id:nt,groupId:h.groupId,linkedSelector:h.linkedSelector,linkedAnchor:h.linkedAnchor,elements:h.elements},S>0?{imageCount:S}:{})}),S>0&&h.images&&a&&a(nt,h.images)}else e({type:"UPDATE_TEXT",payload:m({id:h.id,text:h.text||(S>0?`[${S} image${S>1?"s":""}]`:"")},S>0?{imageCount:S}:{})}),S>0&&h.images&&a&&a(h.id,h.images);else h.isNew||e({type:"DELETE_ANNOTATION",payload:{id:h.id}});Y(null)},[h,e,a]),yn=Me(S=>{for(let C=0;C<$i.length-1;C++){let nt=$i[C],M=$i[C+1];if(S<=(nt+M)/2)return nt;if(S<M)return M}return Math.round(S/8)*8},[]),br=Me((S,C,nt,M)=>{let B=nt.top+Math.max(M.top,4),D=nt.bottom-Math.max(M.bottom,4),ut=nt.left+Math.max(M.left,4),H=nt.right-Math.max(M.right,4);if(S<nt.left||S>nt.right||C<nt.top||C>nt.bottom)return null;let X=C<B,v=C>D,T=S<ut,K=S>H;return X&&T?M.top>=M.left?"top":"left":X&&K?M.top>=M.right?"top":"right":v&&T?M.bottom>=M.left?"bottom":"left":v&&K?M.bottom>=M.right?"bottom":"right":X?"top":v?"bottom":T?"left":K?"right":null},[]),xr=Me(S=>{var D,ut;if(!t.isAnnotating)return;if(t.inspectedElement&&t.activeTool==="hand"&&!("button"in S&&S.button===2)){S.preventDefault(),S.stopPropagation(),e({type:"SELECT_ELEMENT",payload:null});return}let C=Dn(S),nt="shiftKey"in S&&S.shiftKey;if(t.activeTool==="inspector"){if("button"in S&&S.button===2)return;if(Bt&&!y(Bt)){let H=_e(Bt),X=rn(Bt),v=Bt.getBoundingClientRect(),T=Bt.getAttribute("data-pm");T||(T=Math.random().toString(36).substring(2,8),Bt.setAttribute("data-pm",T));let K=`[data-pm="${T}"]`,P=t.styleModifications.some(Et=>{try{return Bt.matches(Et.selector)}catch(oe){return!1}}),W=t.annotations.filter(Et=>{if(!Et.linkedSelector)return!1;try{return Bt.matches(Et.linkedSelector)}catch(oe){return!1}}).length,_=(P?1:0)+W,$=v.top>=po*(1+_)?"top-left":"bottom-left",pt=Xs(v,$,_);tt({point:pt,linkedSelector:K,linkedAnchor:$,elements:[x(m({},H),{selector:X})]})}return}if(t.activeTool==="model"){if("button"in S&&S.button===2)return;if(st){let H=st.name;if(f!=null&&f.has(H)){u==null||u(H);return}"shiftKey"in S&&S.shiftKey?bt(v=>{let T=new Map(v);return T.has(H)?T.delete(H):T.set(H,st),T}):F.size===1&&F.has(H)?(d&&d([H]),bt(new Map)):bt(new Map([[H,st]]))}return}if(t.activeTool==="hand"&&Dt&&re){let H=Dt,X=H.getAttribute("data-pm");X||(X=Math.random().toString(36).substring(2,8),H.setAttribute("data-pm",X));let v=rn(H),T=`[data-pm="${X}"]`,K=_e(H),P=ro(H),W=C.x-window.scrollX,_=C.y-window.scrollY,$=ae,pt=window.getComputedStyle(H).justifyContent,Et=0;if($){let Gt=An(H).find(Le=>Le.axis===re);Et=Gt?re==="column"?Gt.w:Gt.h:0}jt(H,"transition","none"),Qt.current={isDragging:!0,hasMoved:!1,axis:re,startX:W,startY:_,originalRow:$?Et:P.row,originalColumn:$?Et:P.column,element:H,elementInfo:x(m({},K),{selector:T}),selector:T,durableSelector:v,isAuto:$,originalJustifyContent:pt,visualGap:Et},Ee({axis:re,row:$?Et:P.row,column:$?Et:P.column});return}if(t.activeTool==="hand"&&Jt&&Be){let H=Jt,X=H.getAttribute("data-pm");X||(X=Math.random().toString(36).substring(2,8),H.setAttribute("data-pm",X));let v=`[data-pm="${X}"]`,T=_e(H),{fontSize:K,lineHeight:P}=so(H),W=K>0?P/K:1.2,_=C.x-window.scrollX,$=C.y-window.scrollY;jt(H,"transition","none");let pt=rn(H);te.current={isDragging:!0,property:Be,startX:_,startY:$,originalFontSize:K,originalLineHeight:P,originalRatio:W,element:H,elementInfo:x(m({},T),{selector:v}),selector:v,durableSelector:pt},sn({property:Be,fontSize:K,lineHeight:P});return}if(t.activeTool==="hand"&&ye&&J){let H=ye,X=H.getAttribute("data-pm");X||(X=Math.random().toString(36).substring(2,8),H.setAttribute("data-pm",X));let v=`[data-pm="${X}"]`,T=rn(H),K=_e(H),P=Pn(H),W=H.getBoundingClientRect(),_=Math.floor(W.height/2),$=C.y-window.scrollY;jt(H,"transition","none"),ze.current={isDragging:!0,corner:J,startY:$,original:P,maxRadius:_,element:H,elementInfo:x(m({},K),{selector:v}),selector:v,durableSelector:T},Qe({corner:J,radius:m({},P)});return}if(t.activeTool==="hand"&&Lt&&ne){let H=Lt,X=H.getAttribute("data-pm");X||(X=Math.random().toString(36).substring(2,8),H.setAttribute("data-pm",X));let v=`[data-pm="${X}"]`,T=rn(H),K=_e(H),P=Wn(H),W=C.x-window.scrollX,_=C.y-window.scrollY;jt(H,"transition","none"),Mt.current={isDragging:!0,side:ne,startX:W,startY:_,original:P,element:H,elementInfo:x(m({},K),{selector:v}),selector:v,durableSelector:T},At({side:ne,padding:m({},P)});return}let M=yr(C);if(M){let H=t.annotations.find(X=>X.id===M.annotationId);if(H&&H.type!=="text"&&((D=H.status)!=null?D:"pending")==="pending"){qt({annotationId:M.annotationId,handle:M.handle,startPoint:C,originalPoints:[...H.points],hasMoved:!1});return}}let B=bo(C);if(B&&B.points[0]){if(h&&Hn(),B.type!=="text"){if(Rt(B.id,nt),B.color&&e({type:"SET_COLOR",payload:B.color}),l){let H=B.threadId||(B.groupId?(ut=t.annotations.find(X=>X.groupId===B.groupId&&X.threadId))==null?void 0:ut.threadId:void 0);H&&l(H)}}else nt||Ht();lt({annotation:B,startPoint:C,hasMoved:!1});return}if(nt||Ht(),t.activeTool==="text"){h&&Hn();let H=Math.random().toString(36).substring(2,9);Y({id:H,point:C,text:"",fontSize:12,isNew:!0});return}L(!0),e({type:"START_PATH",payload:C})},[t.isAnnotating,t.activeTool,t.inspectedElement,t.annotations,h,Ot,Bt,Lt,ne,ye,J,Dt,re,ae,Jt,Be,st,F,f,d,u,l,Dn,bo,yr,e,Rt,Ht,Hn]),vr=Me(S=>{var nt,M;let C=Dn(S);if(t.activeTool==="inspector"&&t.isAnnotating){let B=C.x-window.scrollX,D=C.y-window.scrollY,ut=Tn(B,D),H=ut&&y(ut)?null:ut;H!==Bt&&(ht(H),ct(H?_e(H):null));return}if(t.activeTool==="model"&&t.isAnnotating){let B=C.x-window.scrollX,D=C.y-window.scrollY,ut=Tn(B,D);if(ut!==Yt.current&&(Yt.current=ut,vt.current=0),ut){let H=Co(ut,vt.current);wt(H)}else wt(null);return}if(t.activeTool==="hand"&&t.isAnnotating){let B=C.x-window.scrollX,D=C.y-window.scrollY;_t.current={x:B,y:D},kt({x:B,y:D});let ut=V.current.cmd,H=V.current.shift;if(Qt.current.isDragging){let v=Qt.current,T=v.element;if(!T)return;if(!v.hasMoved){let _=Math.abs(B-v.startX),$=Math.abs(D-v.startY);if(_<=2&&$<=2)return;v.hasMoved=!0,v.isAuto&&(jt(T,"justify-content","normal"),jt(T,"row-gap",`${v.visualGap}px`),jt(T,"column-gap",`${v.visualGap}px`),Ge(!1))}let K=v.axis,P=v.originalRow,W=v.originalColumn;if(K==="column"){let _=B-v.startX;W=v.originalColumn+_,ut||(P=v.originalRow+_)}else{let _=D-v.startY;P=v.originalRow+_,ut||(W=v.originalColumn+_)}P=Math.max(0,P),W=Math.max(0,W),H&&(P=yn(P),W=yn(W)),P=Math.round(P),W=Math.round(W),jt(T,"row-gap",`${P}px`),jt(T,"column-gap",`${W}px`),Ee({axis:K,row:P,column:W});return}if(ze.current.isDragging){let v=ze.current,T=v.element;if(!T)return;let K=D-v.startY,P=v.corner,W=v.original,_=m({},W);if(ut){let $=W[P]+K;$=Math.max(0,Math.min(v.maxRadius,$)),H&&($=yn($)),$=Math.round($),_[P]=$}else{let $=W[P]+K;$=Math.max(0,Math.min(v.maxRadius,$)),H&&($=yn($)),$=Math.round($),_={"top-left":$,"top-right":$,"bottom-right":$,"bottom-left":$}}jt(T,"border-top-left-radius",`${_["top-left"]}px`),jt(T,"border-top-right-radius",`${_["top-right"]}px`),jt(T,"border-bottom-right-radius",`${_["bottom-right"]}px`),jt(T,"border-bottom-left-radius",`${_["bottom-left"]}px`),Qe({corner:P,radius:_});return}if(te.current.isDragging){let v=te.current,T=v.element;if(!T)return;let K=v.property,P=v.originalFontSize,W=v.originalLineHeight,_=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(K==="font-size"){let pt=B-v.startX;P=v.originalFontSize+pt,P=Math.max(1,P)}else{let pt=D-v.startY;W=v.originalLineHeight+pt,W=Math.max(P,W)}if(H)if(K==="font-size"){let pt=_[0],Et=Math.abs(P-pt);for(let oe of _){let Gt=Math.abs(P-oe);Gt<Et&&(pt=oe,Et=Gt)}P=pt}else{let pt=P>0?W/P:1.2,Et=Math.round(pt*2)/2;W=P*Math.max(1,Et)}P=Math.round(P),W=Math.round(W*10)/10,jt(T,"font-size",`${P}px`);let $=P>0?Math.round(W/P*1e3)/1e3:1.2;jt(T,"line-height",`${$}`),sn({property:K,fontSize:P,lineHeight:W});return}if(Mt.current.isDragging){let v=Mt.current,T=v.element;if(!T)return;let K=v.side,P=v.original,W=P.top,_=P.right,$=P.bottom,pt=P.left;if(K==="top"){let Et=v.startY-D;W=P.top+Et,ut||($=P.bottom+Et)}else if(K==="bottom"){let Et=D-v.startY;$=P.bottom+Et,ut||(W=P.top+Et)}else if(K==="left"){let Et=v.startX-B;pt=P.left+Et,ut||(_=P.right+Et)}else if(K==="right"){let Et=B-v.startX;_=P.right+Et,ut||(pt=P.left+Et)}W=Math.max(0,W),_=Math.max(0,_),$=Math.max(0,$),pt=Math.max(0,pt),H&&(W=yn(W),_=yn(_),$=yn($),pt=yn(pt)),W=Math.round(W),_=Math.round(_),$=Math.round($),pt=Math.round(pt),jt(T,"padding",`${W}px ${_}px ${$}px ${pt}px`),At({side:K,padding:{top:W,right:_,bottom:$,left:pt}});return}let X=Tn(B,D);for(;X&&X.tagName==="A";)X=X.parentElement;{let T=[];X&&T.push(X),ye&&ye!==X&&T.push(ye);let K=null,P=16,W=null;for(let _ of T){let $=_.getBoundingClientRect(),pt=Pn(_),Et=[["top-left",$.left,$.top+pt["top-left"]],["top-right",$.right,$.top+pt["top-right"]],["bottom-right",$.right,$.bottom-pt["bottom-right"]],["bottom-left",$.left,$.bottom-pt["bottom-left"]]];for(let[oe,Gt,Le]of Et){let se=Math.hypot(B-Gt,D-Le);se<P&&(P=se,K=oe,W=_)}}if(K&&W){qe(W),Ft(K),Lt&&be(null),ne&&he(null),Dt&&Ce(null),re&&pe(null),Ge(!1),Jt&&De(null),Be&&gn(null);return}}ye&&qe(null),J&&Ft(null);{let v=[];X&&Mo(X)&&v.push(X);let T=(nt=X==null?void 0:X.parentElement)!=null?nt:null;for(;T&&T!==document.body&&v.length<3;)Mo(T)&&v.push(T),T=T.parentElement;for(let K of v){let W=An(K).find(_=>B>=_.x&&B<=_.x+_.w&&D>=_.y&&D<=_.y+_.h);if(W){Ce(K),pe(W.axis),Ge(ai(K,W.axis)),Lt&&be(null),ne&&he(null),Jt&&De(null),Be&&gn(null);return}}}Dt&&Ce(null),re&&pe(null),Ge(!1);{let T=[];X&&T.push(X),Jt&&Jt!==X&&T.push(Jt);let K=null,P=1/0,W=null;for(let _ of T){if(!li(_))continue;let $=Yn(_);if(!$)continue;let pt=B>=$.left&&B<=$.right&&D>=$.top&&D<=$.bottom,Et=[["font-size",$.right,$.top+$.height/2],["line-height",$.left+$.width/2,$.bottom]];for(let[oe,Gt,Le]of Et){let se=Math.hypot(B-Gt,D-Le);(pt||se<12)&&se<P&&(P=se,K=oe,W=_)}}K&&W?(De(W),gn(K)):(Jt&&De(null),Be&&gn(null))}if(X!==Lt&&be(X),X){let v=Wn(X),T=X.getBoundingClientRect(),K=br(B,D,T,v);he(K)}else he(null);return}if(xt){let{handle:B,originalPoints:D,hasMoved:ut}=xt,H=t.annotations.find(P=>P.id===xt.annotationId);if(!H)return;let X="metaKey"in S,v=X&&(S.metaKey||S.ctrlKey),T=X&&S.shiftKey,K;if(H.type==="line"){let P=D[0],W=D[D.length-1];B==="start"?K=[C,W]:K=[P,C]}else if(H.type==="freehand"){let P=Math.min(...D.map($t=>$t.x)),W=Math.max(...D.map($t=>$t.x)),_=Math.min(...D.map($t=>$t.y)),$=Math.max(...D.map($t=>$t.y)),pt=(P+W)/2,Et=(_+$)/2,oe=W-P||1,Gt=$-_||1,Le=oe/Gt,se=P,ft=W,Tt=_,Xt=$;switch(B){case"topLeft":se=C.x,Tt=C.y;break;case"topRight":ft=C.x,Tt=C.y;break;case"bottomLeft":se=C.x,Xt=C.y;break;case"bottomRight":ft=C.x,Xt=C.y;break}if(v)switch(B){case"topLeft":ft=W+(P-se),Xt=$+(_-Tt);break;case"topRight":se=P-(ft-W),Xt=$+(_-Tt);break;case"bottomLeft":ft=W+(P-se),Tt=_-(Xt-$);break;case"bottomRight":se=P-(ft-W),Tt=_-(Xt-$);break}if(T){let $t=ft-se,de=Xt-Tt;if(Math.abs($t/de)>Le){let Oe=Math.abs(de)*Le*Math.sign($t);B==="topLeft"||B==="bottomLeft"?se=ft-Oe:ft=se+Oe}else{let Oe=Math.abs($t)/Le*Math.sign(de);B==="topLeft"||B==="topRight"?Tt=Xt-Oe:Xt=Tt+Oe}}let Vt=ft-se||1,ie=Xt-Tt||1;K=D.map($t=>({x:se+($t.x-P)/oe*Vt,y:Tt+($t.y-_)/Gt*ie}))}else if(H.type==="circle"){let P=D[0],W=D[D.length-1],_=Math.min(P.x,W.x),$=Math.max(P.x,W.x),pt=Math.min(P.y,W.y),Et=Math.max(P.y,W.y),oe=(_+$)/2,Gt=(pt+Et)/2,Le=$-_,se=Et-pt,ft=_,Tt=$,Xt=pt,Vt=Et;switch(B){case"top":if(Xt=C.y,v&&(Vt=Gt+(Gt-C.y)),T){let $t=(Vt-Xt)*(Le/se)/2;ft=oe-$t,Tt=oe+$t}break;case"bottom":if(Vt=C.y,v&&(Xt=Gt-(C.y-Gt)),T){let $t=(Vt-Xt)*(Le/se)/2;ft=oe-$t,Tt=oe+$t}break;case"left":if(ft=C.x,v&&(Tt=oe+(oe-C.x)),T){let $t=(Tt-ft)*(se/Le)/2;Xt=Gt-$t,Vt=Gt+$t}break;case"right":if(Tt=C.x,v&&(ft=oe-(C.x-oe)),T){let $t=(Tt-ft)*(se/Le)/2;Xt=Gt-$t,Vt=Gt+$t}break}K=[{x:ft,y:Xt},{x:Tt,y:Vt}]}else{let P=D[0],W=D[D.length-1],_=Math.min(P.x,W.x),$=Math.max(P.x,W.x),pt=Math.min(P.y,W.y),Et=Math.max(P.y,W.y),oe=(_+$)/2,Gt=(pt+Et)/2,Le=$-_||1,se=Et-pt||1,ft=Le/se,Tt=_,Xt=$,Vt=pt,ie=Et;switch(B){case"topLeft":Tt=C.x,Vt=C.y;break;case"topRight":Xt=C.x,Vt=C.y;break;case"bottomLeft":Tt=C.x,ie=C.y;break;case"bottomRight":Xt=C.x,ie=C.y;break}if(v)switch(B){case"topLeft":Xt=$+(_-Tt),ie=Et+(pt-Vt);break;case"topRight":Tt=_-(Xt-$),ie=Et+(pt-Vt);break;case"bottomLeft":Xt=$+(_-Tt),Vt=pt-(ie-Et);break;case"bottomRight":Tt=_-(Xt-$),Vt=pt-(ie-Et);break}if(T){let $t=Xt-Tt,de=ie-Vt;if(Math.abs($t/de)>ft){let Oe=Math.abs(de)*ft*Math.sign($t);B==="topLeft"||B==="bottomLeft"?Tt=Xt-Oe:Xt=Tt+Oe}else{let Oe=Math.abs($t)/ft*Math.sign(de);B==="topLeft"||B==="topRight"?Vt=ie-Oe:ie=Vt+Oe}}K=[{x:Tt,y:Vt},{x:Xt,y:ie}]}e({type:"RESIZE_ANNOTATION",payload:{id:xt.annotationId,points:K,saveUndo:!ut}}),ut||qt(x(m({},xt),{hasMoved:!0}));return}if(dt&&((M=dt.annotation.status)!=null?M:"pending")==="pending"){let B=C.x-dt.startPoint.x,D=C.y-dt.startPoint.y;if((Math.abs(B)>2||Math.abs(D)>2)&&!dt.hasMoved)lt(x(m({},dt),{hasMoved:!0,startPoint:C})),e({type:"MOVE_ANNOTATION",payload:{id:dt.annotation.id,delta:{x:B,y:D},saveUndo:!0}});else if(dt.hasMoved){let H=C.x-dt.startPoint.x,X=C.y-dt.startPoint.y;lt(x(m({},dt),{startPoint:C})),e({type:"MOVE_ANNOTATION",payload:{id:dt.annotation.id,delta:{x:H,y:X}}})}return}!N||!t.isAnnotating||e({type:"CONTINUE_PATH",payload:C})},[N,t.isAnnotating,t.activeTool,dt,xt,Bt,Lt,ne,ye,J,Dt,re,Jt,Be,Dn,e,yn,br]),Ko=Me(S=>{var M,B,D,ut,H,X;if(te.current.isDragging){let v=te.current,T=v.element;if(T&&v.selector&&v.elementInfo&&ee){T instanceof HTMLElement&&(T.style.removeProperty("font-size"),T.style.removeProperty("line-height"),T.style.removeProperty("transition"));let K=[];if(v.originalFontSize!==ee.fontSize&&(jt(T,"font-size",`${ee.fontSize}px`),K.push({property:"font-size",original:`${v.originalFontSize}px`,modified:`${ee.fontSize}px`})),v.originalLineHeight!==ee.lineHeight){let P=v.originalFontSize>0?Math.round(v.originalLineHeight/v.originalFontSize*1e3)/1e3:1.2,W=ee.fontSize>0?Math.round(ee.lineHeight/ee.fontSize*1e3)/1e3:1.2;jt(T,"line-height",`${W}`),K.push({property:"line-height",original:`${P}`,modified:`${W}`})}K.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:v.selector,durableSelector:(M=v.durableSelector)!=null?M:void 0,element:v.elementInfo,changes:K}})}te.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},sn(null);return}if(Qt.current.isDragging){let v=Qt.current,T=v.element,K="button"in S&&S.button===2;if(!v.hasMoved&&!K&&T&&v.selector&&v.elementInfo){T instanceof HTMLElement&&T.style.removeProperty("transition");let P=["space-between","space-around","stretch","normal"],W=v.originalJustifyContent||"normal",_=P.indexOf(W),$=P[(_+1)%P.length],pt=[];$==="normal"?(jt(T,"justify-content","normal"),pt.push({property:"justify-content",original:v.originalJustifyContent,modified:"normal"})):$==="stretch"?(jt(T,"justify-content",$),jt(T,"row-gap","8px"),jt(T,"column-gap","8px"),pt.push({property:"justify-content",original:v.originalJustifyContent||"normal",modified:$}),v.originalRow!==8&&pt.push({property:"row-gap",original:`${v.originalRow}px`,modified:"8px"}),v.originalColumn!==8&&pt.push({property:"column-gap",original:`${v.originalColumn}px`,modified:"8px"})):(T instanceof HTMLElement&&(T.style.removeProperty("row-gap"),T.style.removeProperty("column-gap")),jt(T,"justify-content",$),pt.push({property:"justify-content",original:v.originalJustifyContent||"normal",modified:$}),v.originalRow>0&&pt.push({property:"row-gap",original:`${v.originalRow}px`,modified:"0px"}),v.originalColumn>0&&pt.push({property:"column-gap",original:`${v.originalColumn}px`,modified:"0px"})),pt.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:v.selector,durableSelector:(B=v.durableSelector)!=null?B:void 0,element:v.elementInfo,changes:pt}})}else if(v.hasMoved&&T&&v.selector&&v.elementInfo&&Ut){T instanceof HTMLElement&&(T.style.removeProperty("row-gap"),T.style.removeProperty("column-gap"),T.style.removeProperty("transition"));let P=[];v.isAuto?(T instanceof HTMLElement&&T.style.removeProperty("justify-content"),jt(T,"justify-content","normal"),jt(T,"row-gap",`${Ut.row}px`),jt(T,"column-gap",`${Ut.column}px`),P.push({property:"justify-content",original:v.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`})):(v.originalRow!==Ut.row&&(jt(T,"row-gap",`${Ut.row}px`),P.push({property:"row-gap",original:`${v.originalRow}px`,modified:`${Ut.row}px`})),v.originalColumn!==Ut.column&&(jt(T,"column-gap",`${Ut.column}px`),P.push({property:"column-gap",original:`${v.originalColumn}px`,modified:`${Ut.column}px`}))),P.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:v.selector,durableSelector:(D=v.durableSelector)!=null?D:void 0,element:v.elementInfo,changes:P}})}Qt.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},Ee(null);return}if(ze.current.isDragging){let v=ze.current,T=v.element;if(T&&v.selector&&v.elementInfo&&Nt){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 K=["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"},W=[];for(let _ of K)v.original[_]!==Nt.radius[_]&&(jt(T,P[_],`${Nt.radius[_]}px`),W.push({property:P[_],original:`${v.original[_]}px`,modified:`${Nt.radius[_]}px`}));W.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:v.selector,durableSelector:(ut=v.durableSelector)!=null?ut:void 0,element:v.elementInfo,changes:W}})}ze.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},Qe(null);return}if(Mt.current.isDragging){let v=Mt.current,T=v.element,K=v.selector,P=v.elementInfo;if(T&&K&&P&&at){let W=v.original,_=at.padding;T instanceof HTMLElement&&(T.style.removeProperty("padding"),T.style.removeProperty("transition"));let $=[],pt=[{prop:"padding-top",origVal:W.top,newVal:_.top},{prop:"padding-right",origVal:W.right,newVal:_.right},{prop:"padding-bottom",origVal:W.bottom,newVal:_.bottom},{prop:"padding-left",origVal:W.left,newVal:_.left}];for(let{prop:Et,origVal:oe,newVal:Gt}of pt)oe!==Gt&&(jt(T,Et,`${Gt}px`),$.push({property:Et,original:`${oe}px`,modified:`${Gt}px`}));$.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:K,durableSelector:(H=v.durableSelector)!=null?H:void 0,element:P,changes:$}})}Mt.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},At(null);return}if(xt){qt(null);return}if(dt){if(!dt.hasMoved&&dt.annotation.type==="text"&&((X=dt.annotation.status)!=null?X:"pending")==="pending"){let v=Dn(S);Y({id:dt.annotation.id,point:dt.annotation.points[0],text:dt.annotation.text||"",fontSize:dt.annotation.fontSize||12,isNew:!1,clickPoint:v,groupId:dt.annotation.groupId})}lt(null);return}if(!N)return;let C=5;if(t.currentPath.length>=2){let v=t.currentPath[0],T=t.currentPath[t.currentPath.length-1],K=Math.abs(T.x-v.x),P=Math.abs(T.y-v.y);if((t.activeTool==="line"?Math.sqrt(K*K+P*P)<C:K<C&&P<C)&&["rectangle","circle","line"].includes(t.activeTool)){L(!1),e({type:"CANCEL_PATH"});return}}let nt=Qo(t.currentPath);if(t.activeTool==="rectangle"&&t.currentPath.length>=2){let v=t.currentPath[0],T=t.currentPath[t.currentPath.length-1],K=Math.min(v.x,T.x),P=Math.max(v.y,T.y),W=t.strokeWidth/2,_=Math.random().toString(36).substring(2,9);Q({point:{x:K-W+4,y:P+W+4},groupId:_}),L(!1),e({type:"FINISH_PATH",payload:{groupId:_,elements:nt}});return}L(!1),e({type:"FINISH_PATH",payload:{elements:nt}})},[N,dt,xt,at,Nt,Ut,ee,Dn,e,t.activeTool,t.currentPath,t.strokeWidth]),wa=Me(S=>{h&&Y(x(m({},h),{text:S.target.value}))},[h]),ka=Me(S=>{S.key==="Escape"?Y(null):S.key==="Enter"&&!S.shiftKey&&(S.preventDefault(),Hn())},[Hn]),Ca=Me(S=>{if(!h)return;let C=S.clipboardData.items,nt=[];for(let M=0;M<C.length;M++){let B=C[M];if(B.type.startsWith("image/")){let D=B.getAsFile();D&&nt.push(D)}}nt.length>0&&(S.preventDefault(),Y(M=>M?x(m({},M),{images:[...M.images||[],...nt]}):null))},[h]),Ea=Me(S=>{if(t.activeTool!=="hand"||!t.isAnnotating)return;S.preventDefault();let C=Lt||Dt||ye||Jt;if(C&&!y(C)){let nt=_e(C),M=rn(C);e({type:"SELECT_ELEMENT",payload:{el:C,info:x(m({},nt),{selector:M})}})}},[t.activeTool,t.isAnnotating,Lt,Dt,ye,Jt,e,y]);Ie(()=>{let S=t.annotations.filter(D=>D.linkedSelector);if(S.length===0)return;let C=null,nt=()=>{var ut,H,X;let D=[];for(let v of S){let T=document.querySelector(v.linkedSelector);if(!T&&((H=(ut=v.elements)==null?void 0:ut[0])!=null&&H.selector)&&v.linkedSelector.startsWith("[data-pm=")){try{T=document.querySelector(v.elements[0].selector)}catch(Gt){}if(T){let Gt=(X=v.linkedSelector.match(/data-pm="([^"]+)"/))==null?void 0:X[1];Gt&&T.setAttribute("data-pm",Gt)}}if(!T)continue;let K=T.getBoundingClientRect(),P=t.styleModifications.some(Gt=>{try{return T.matches(Gt.selector)}catch(Le){return!1}}),W=S.filter(Gt=>Gt.id!==v.id&&Gt.timestamp<v.timestamp&&Gt.linkedSelector===v.linkedSelector).length,_=(P?1:0)+W,$=K.top>=po*(1+_)?"top-left":"bottom-left",pt=Xs(K,$,_),Et=v.points[0],oe=$!==v.linkedAnchor;Et&&(oe||Math.abs(pt.x-Et.x)>1||Math.abs(pt.y-Et.y)>1)&&D.push({id:v.id,point:pt,linkedAnchor:oe?$:void 0})}D.length>0&&e({type:"UPDATE_LINKED_POSITIONS",payload:{updates:D}})},M=()=>{C&&cancelAnimationFrame(C),C=requestAnimationFrame(nt)};nt(),window.addEventListener("scroll",M,!0),window.addEventListener("resize",M,!0),window.addEventListener("load",M),document.fonts.ready.then(M);let B=new MutationObserver(M);return B.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",M,!0),window.removeEventListener("resize",M,!0),window.removeEventListener("load",M),B.disconnect(),C&&cancelAnimationFrame(C)}},[t.annotations,e]);let Ta=()=>{var S,C,nt;if(!t.isAnnotating)return"default";if(xt){let{handle:M}=xt;return M==="start"||M==="end"?"move":M==="top"||M==="bottom"?"ns-resize":M==="left"||M==="right"?"ew-resize":M==="topLeft"||M==="bottomRight"?"nwse-resize":"nesw-resize"}if(t.activeTool==="text")return"text";if(t.activeTool==="hand"){let M=(S=Ut==null?void 0:Ut.axis)!=null?S:re;if(M==="row")return"ns-resize";if(M==="column")return"ew-resize";if(Nt||J)return"ns-resize";let B=(C=ee==null?void 0:ee.property)!=null?C:Be;if(B==="font-size")return"ew-resize";if(B==="line-height")return"ns-resize";let D=(nt=at==null?void 0:at.side)!=null?nt:ne;return D==="top"||D==="bottom"?"ns-resize":D==="left"||D==="right"?"ew-resize":"default"}return"crosshair"},Ma={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:t.isAnnotating?"auto":"none",visibility:t.isAnnotating?"visible":"hidden",cursor:Ta()},Sr=Me(()=>{let S=k.current;if(!S||!h)return{width:100,height:12*1.4};let C=S.getContext("2d");if(!C)return{width:100,height:h.fontSize*1.4};C.font=`${h.fontSize}px ${Se}`;let M=C.measureText("Type here...").width,B=h.text.split(`
+`),D=B.length>0?Math.max(M,...B.map(H=>C.measureText(H||" ").width)):M,ut=Math.max(1,B.length)*h.fontSize*1.4;return{width:D,height:ut}},[h,k])(),Ia=h?{position:"fixed",left:h.point.x-4-le.x,top:h.point.y-4-le.y,zIndex:9999,width:Sr.width+8,height:Sr.height+8,padding:4,fontSize:h.fontSize,fontFamily:Se,color:"#ffffff",backgroundColor:t.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:"pre"}:{};return ge(Ye,{children:[rt("canvas",{ref:k,id:"devtools-canvas",style:Ma,onMouseDown:xr,onMouseMove:vr,onMouseUp:S=>Ko(S),onMouseLeave:S=>Ko(S),onTouchStart:xr,onTouchMove:vr,onTouchEnd:S=>Ko(S),onContextMenu:Ea}),h&&ge(Ye,{children:[rt("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),rt("textarea",{id:"devtools-text-input",ref:Z,value:h.text,onChange:wa,onKeyDown:ka,onPaste:Ca,onBlur:Hn,placeholder:"Type here...",style:Ia}),h.images&&h.images.length>0&&ge("div",{"data-devtools":!0,style:{position:"fixed",left:h.point.x-4-le.x,top:h.point.y-4-le.y-20,zIndex:1e4,fontSize:11,fontFamily:"system-ui, sans-serif",color:"#fff",backgroundColor:"rgba(0,0,0,0.7)",padding:"2px 6px",borderRadius:3,whiteSpace:"nowrap"},children:[h.images.length," image",h.images.length>1?"s":""," attached"]})]}),t.isAnnotating&&t.activeTool!=="hand"&&t.styleModifications.length>0&&rt(Es,{styleModifications:t.styleModifications,isInspecting:!!t.inspectedElement,accentColor:t.activeColor,annotationGroupCount:new Set(t.annotations.map(S=>S.groupId||S.id)).size,dispatch:e,inFlightSelectors:i}),t.activeTool==="hand"&&t.isAnnotating&&t.styleModifications.length>0&&rt(Ms,{styleModifications:t.styleModifications,accentColor:t.activeColor}),t.isAnnotating&&rt(rd,{annotations:t.annotations,supersededAnnotations:hn,inFlightIds:n,scrollX:le.x,scrollY:le.y,annotationGroupMap:Qn,onViewThread:l,onSelectAnnotation:Rt}),t.isAnnotating&&((c==null?void 0:c.status)==="awaiting_approval"||(c==null?void 0:c.status)==="planning")&&c.threadId&&l&&rt(sd,{annotations:t.annotations,supersededAnnotations:hn,scrollX:le.x,scrollY:le.y,annotationGroupMap:Qn,planThreadId:c.threadId,taskCount:(kr=(wr=c.tasks)==null?void 0:wr.length)!=null?kr:0,planStatus:c.status,onViewThread:l,onSelectAnnotation:Rt}),t.isAnnotating&&s&&rt(ld,{annotations:t.annotations,supersededAnnotations:hn,scrollX:le.x,scrollY:le.y,onReply:s,annotationGroupMap:Qn}),t.isAnnotating&&r&&r.size>0&&rt(Ks,{inFlightSelectorColors:r}),t.isAnnotating&&mr&&rt(Ks,{inFlightSelectorColors:mr,animated:!1}),t.activeTool==="hand"&&t.isAnnotating&&(Ut?Qt.current.element:Dt)&&rt(Ti,{element:Ut?Qt.current.element:Dt,gap:Ut?{row:Ut.row,column:Ut.column}:ro(Dt),accentColor:t.activeColor,hoveredAxis:re,draggingAxis:(Cr=Ut==null?void 0:Ut.axis)!=null?Cr:null,cursorViewport:Pt,isAutoGap:ae,refreshKey:ce}),t.activeTool==="hand"&&t.isAnnotating&&ve&&rt(Gs,{element:ve.target,modifier:ve.modifier,accentColor:t.activeColor,refreshKey:ce}),t.activeTool==="hand"&&t.isAnnotating&&!ve&&(Nt?ze.current.element:ye)&&rt(vs,{element:Nt?ze.current.element:ye,radius:(Er=Nt==null?void 0:Nt.radius)!=null?Er:Pn(ye),accentColor:t.activeColor,hoveredCorner:J,draggingCorner:(Tr=Nt==null?void 0:Nt.corner)!=null?Tr:null,cursorViewport:Pt}),t.activeTool==="hand"&&t.isAnnotating&&!ve&&(ee?te.current.element:Jt)&&rt(Vs,{element:ee?te.current.element:Jt,fontSize:(Mr=ee==null?void 0:ee.fontSize)!=null?Mr:so(Jt).fontSize,lineHeight:(Ir=ee==null?void 0:ee.lineHeight)!=null?Ir:so(Jt).lineHeight,accentColor:t.activeColor,hoveredProperty:Be,draggingProperty:(Lr=ee==null?void 0:ee.property)!=null?Lr:null,cursorViewport:Pt}),t.activeTool==="hand"&&t.isAnnotating&&!ve&&(at?Mt.current.element:Lt)&&rt(Ai,{element:at?Mt.current.element:Lt,padding:(Rr=at==null?void 0:at.padding)!=null?Rr:Wn(Lt),accentColor:t.activeColor,hoveredSide:ne,draggingSide:(Ar=at==null?void 0:at.side)!=null?Ar:null,cursorViewport:Pt,refreshKey:ee?ee.fontSize+ee.lineHeight*1e3:0}),t.activeTool==="inspector"&&t.isAnnotating&&rt(Ye,{children:Bt&&!t.inspectedElement&&(()=>{let S=!!O||!!(h!=null&&h.linkedSelector)||t.annotations.some(C=>{if(!C.linkedSelector)return!1;try{return Bt.matches(C.linkedSelector)}catch(nt){return!1}});return rt(Gn,{element:Bt,isSelected:!1,elementInfo:ue,color:t.activeColor,hideTooltip:S})})()}),t.activeTool==="model"&&t.isAnnotating&&F.size>0&&[...F.entries()].map(([S,C])=>rt(Gn,{element:C.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:C.rootElement.tagName.toLowerCase(),reactComponent:S},color:"#8b5cf6"},S)),t.activeTool==="model"&&t.isAnnotating&&mn&&rt(Gn,{element:mn.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:mn.rootElement.tagName.toLowerCase(),reactComponent:mn.name},color:"#22c55e"}),t.activeTool==="model"&&t.isAnnotating&&En.length>0&&En.map((S,C)=>rt("div",{style:{position:"absolute",left:S.x,top:S.y,width:S.width,height:S.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:S.direction==="vertical"?ge(Ye,{children:[rt("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),rt("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),rt("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),rt("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:S.height<16?-6:"50%",transform:S.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(S.height)})]}):ge(Ye,{children:[rt("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),rt("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),rt("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),rt("div",{style:{position:"absolute",left:S.width<30?0:"50%",top:(S.width<30,void 0),bottom:"calc(50% + 4px)",transform:S.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(S.width)})]})},C)),t.activeTool==="model"&&t.isAnnotating&&st&&rt(Gn,{element:st.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:st.rootElement.tagName.toLowerCase(),reactComponent:st.name},color:f!=null&&f.has(st.name)?"#22c55e":"#8b5cf6"}),t.activeTool==="hand"&&t.isAnnotating&&t.inspectedElement&&ge(Ye,{children:[G&&G!=="padding"&&G!=="gap"&&(()=>{var H;let S=new Set(t.annotations.map(X=>X.groupId||X.id)).size,C=t.inspectedElement.info.selector,nt=t.styleModifications.findIndex(X=>X.selector===C),M=nt>=0?S+nt+1:S+t.styleModifications.length+1,B=t.styleModifications.find(X=>X.selector===C),D=(H=B==null?void 0:B.changes.length)!=null?H:0,ut=!!(B!=null&&B.captured);return rt(Gn,{element:t.inspectedElement.el,isSelected:!0,elementInfo:t.inspectedElement.info,color:ut?"#999999":t.activeColor,annotationNumber:M,changeCount:D})})(),G==="padding"&&rt(Ai,{element:t.inspectedElement.el,padding:Wn(t.inspectedElement.el),accentColor:t.activeColor,hoveredSide:null,draggingSide:null}),G==="gap"&&rt(Ti,{element:t.inspectedElement.el,gap:ro(t.inspectedElement.el),accentColor:t.activeColor,hoveredAxis:null,draggingAxis:null}),rt(Ys,{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:gt,accentColor:t.activeColor})]})]})}var Zs=3,qs=250,Yi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Qs=3e3;function rd({annotations:t,supersededAnnotations:e,inFlightIds:o,scrollX:n,scrollY:i,annotationGroupMap:r,onViewThread:a,onSelectAnnotation:s}){var b,k;let[l,c]=Kt(0),[d,u]=Kt(()=>Math.floor(Math.random()*Yi.length)),p=!!(o&&o.size>0);Ie(()=>{if(!p)return;let w=setInterval(()=>{c(N=>(N+1)%Zs)},qs),I=setInterval(()=>{u(N=>(N+1)%Yi.length)},Qs);return()=>{clearInterval(w),clearInterval(I)}},[p]);let f=[];for(let w of t){if(w.type!=="text"||!w.text||!w.points[0]||e.has(w))continue;let I=w.groupId?t.filter(F=>F.groupId===w.groupId):[w],N=!!(o&&(o.has(w.id)||I.some(F=>o.has(F.id)))),L=(b=w.status)!=null?b:"pending",h=I.some(F=>F.status==="resolved"||F.status==="needs_review"),Y=I.some(F=>F.threadId);if(!N&&L!=="resolved"&&L!=="needs_review"&&!h&&!Y)continue;let ot=w.threadId||((k=I.find(F=>F.threadId))==null?void 0:k.threadId),j=L==="needs_review"||I.some(F=>F.status==="needs_review"),U=I.reduce((F,bt)=>{var vt;return F+((vt=bt.replyCount)!=null?vt:0)},0)||1,Q=w.points[0],O=w.fontSize||12,tt=O*1.4,Z=w.text.split(`
+`),It=r.get(w.id),mt=It!==void 0?[It+". "+(Z[0]||""),...Z.slice(1)]:Z,q=document.createElement("canvas").getContext("2d");if(!q)continue;q.font=`${O}px ${Se}`;let st=Math.min(400,Math.max(...mt.map(F=>q.measureText(F).width))),wt=mt.length*tt;f.push({id:w.id,threadId:ot,x:Q.x+st+4,y:Q.y-4,size:wt+8,color:w.color,isInFlight:N,isNeedsReview:j,replyCount:U})}if(f.length===0)return null;let g=!!a;return rt(Ye,{children:f.map(w=>rt("div",{"data-devtools":"annotation-badge",onClick:g&&w.threadId?()=>{s==null||s(w.id),a(w.threadId)}:void 0,style:{position:"fixed",left:w.x-n,top:w.y-i,height:w.size,display:"flex",alignItems:"center",pointerEvents:g?"auto":"none",cursor:g&&w.threadId?"pointer":void 0,zIndex:9999,backgroundColor:w.color,fontFamily:Se,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:w.isInFlight?ge(Ye,{children:[rt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:l===1?ge(Ye,{children:[rt("circle",{cx:"7",cy:"7",r:"2"}),rt("circle",{cx:"17",cy:"7",r:"2"}),rt("circle",{cx:"7",cy:"17",r:"2"}),rt("circle",{cx:"17",cy:"17",r:"2"})]}):ge(Ye,{children:[rt("circle",{cx:"12",cy:"6",r:"2"}),rt("circle",{cx:"6",cy:"12",r:"2"}),rt("circle",{cx:"18",cy:"12",r:"2"}),rt("circle",{cx:"12",cy:"18",r:"2"})]})}),rt("span",{style:{opacity:.7},children:Yi[d]})]}):ge(Ye,{children:[w.isNeedsReview?rt("span",{style:{fontWeight:700},children:"?"}):ge("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[rt("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),rt("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),rt("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),rt("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),ge("span",{style:{opacity:.7},children:[w.replyCount," ",w.replyCount===1?"reply":"replies"]})]})},w.id))})}function sd({annotations:t,supersededAnnotations:e,scrollX:o,scrollY:n,annotationGroupMap:i,planThreadId:r,taskCount:a,planStatus:s,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",b=f.groupId?t.filter(Z=>Z.groupId===f.groupId):[f],k=b.some(Z=>Z.threadId===r),w=!k&&!f.planId&&(g==="in_flight"||g==="pending"||f.captured)&&!b.some(Z=>Z.status==="resolved"||Z.status==="needs_review");if(!k&&!w||g==="resolved"||g==="needs_review")continue;let I=f.points[0],N=f.fontSize||12,L=N*1.4,h=f.text.split(`
+`),Y=i.get(f.id),ot=Y!==void 0?[Y+". "+(h[0]||""),...h.slice(1)]:h,U=document.createElement("canvas").getContext("2d");if(!U)continue;U.font=`${N}px ${Se}`;let Q=Math.min(400,Math.max(...ot.map(Z=>U.measureText(Z).width))),tt=ot.length*L+8;d.push({annotation:f,x:I.x+Q+4,y:I.y-4,size:tt,groupNumber:Y})}if(d.length===0)return null;let u=s==="planning";return rt(Ye,{children:d.map(({annotation:f,x:g,y:b,size:k})=>u?rt(ad,{x:g-o,y:b-n,size:k,color:f.color,onClick:()=>{c==null||c(f.id),l(r)}},`plan-thinking-${f.id}`):ge("div",{"data-devtools":"plan-waiting-badge",onClick:()=>{c==null||c(f.id),l(r)},style:{position:"fixed",left:g-o,top:b-n,height:k,display:"flex",alignItems:"center",cursor:"pointer",backgroundColor:f.color,fontFamily:Se,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap",zIndex:9999,pointerEvents:"auto"},children:[ge("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[rt("circle",{cx:"12",cy:"12",r:"10"}),rt("path",{d:"M9.09 9a3 3 0 015.83 1c0 2-3 3-3 3"}),rt("line",{x1:"12",y1:"17",x2:"12.01",y2:"17"})]}),ge("span",{style:{opacity:.7},children:[a," task",a!==1?"s":""," \u2014 approve?"]})]},`plan-waiting-${f.id}`))})}function ad({x:t,y:e,size:o,color:n,onClick:i}){let[r,a]=Kt(0),[s,l]=Kt(()=>Math.floor(Math.random()*ji.length));return Ie(()=>{let c=setInterval(()=>{a(u=>(u+1)%Zs)},qs),d=setInterval(()=>{l(u=>(u+1)%ji.length)},Qs);return()=>{clearInterval(c),clearInterval(d)}},[]),ge("div",{"data-devtools":"plan-thinking-badge",onClick:i,style:{position:"fixed",left:t,top:e,height:o,display:"flex",alignItems:"center",pointerEvents:i?"auto":"none",cursor:i?"pointer":void 0,zIndex:9999,backgroundColor:n,fontFamily:Se,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:[rt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:r===1?ge(Ye,{children:[rt("circle",{cx:"7",cy:"7",r:"2"}),rt("circle",{cx:"17",cy:"7",r:"2"}),rt("circle",{cx:"7",cy:"17",r:"2"}),rt("circle",{cx:"17",cy:"17",r:"2"})]}):ge(Ye,{children:[rt("circle",{cx:"12",cy:"6",r:"2"}),rt("circle",{cx:"6",cy:"12",r:"2"}),rt("circle",{cx:"18",cy:"12",r:"2"}),rt("circle",{cx:"12",cy:"18",r:"2"})]})}),rt("span",{style:{opacity:.7},children:ji[s]})]})}var ji=["planning","strategizing","scheming","mapping","scoping","drafting","outlining","architecting"];function Ks({inFlightSelectorColors:t,animated:e=!0}){let[o,n]=Kt([]);if(Ie(()=>{if(t.size===0){n([]);return}let r=null,a=()=>{let c=[];for(let[d,u]of t){let p=$e(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)},s=()=>{r&&cancelAnimationFrame(r),r=requestAnimationFrame(a)};a(),window.addEventListener("scroll",s,!0),window.addEventListener("resize",s,!0);let l=new MutationObserver(s);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",s,!0),window.removeEventListener("resize",s,!0),l.disconnect(),r&&cancelAnimationFrame(r)}},[t]),o.length===0)return null;let i={position:"absolute",width:2,height:2,pointerEvents:"none"};return ge(Ye,{children:[e&&rt("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),o.map(r=>ge("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:[rt("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible"},children:rt("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})}),rt("div",{style:x(m({},i),{top:-1,left:-1,backgroundColor:r.color})}),rt("div",{style:x(m({},i),{top:-1,right:-1,backgroundColor:r.color})}),rt("div",{style:x(m({},i),{bottom:-1,left:-1,backgroundColor:r.color})}),rt("div",{style:x(m({},i),{bottom:-1,right:-1,backgroundColor:r.color})})]},r.selector))]})}function ld({annotations:t,supersededAnnotations:e,scrollX:o,scrollY:n,onReply:i,annotationGroupMap:r}){let a=t.filter(c=>e.has(c)?!1:c.status==="waiting_input"&&c.question&&c.threadId);if(a.length===0)return null;let s=new Set,l=[];for(let c of a){if(!c.threadId||s.has(c.threadId))continue;s.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(`
+`),b=r.get(d.id),k=b!==void 0?[b+". "+(g[0]||""),...g.slice(1)]:g,I=document.createElement("canvas").getContext("2d");if(!I)continue;I.font=`${p}px ${Se}`;let N=Math.min(400,Math.max(...k.map(Y=>I.measureText(Y).width))),h=k.length*f+8;l.push({annotation:c,x:u.x+N+4,y:u.y-4,size:h})}}return l.length===0?null:rt(Ye,{children:l.map(({annotation:c,x:d,y:u,size:p})=>rt(cd,{annotation:c,x:d-o,y:u-n,size:p,onReply:i},`question-${c.threadId}`))})}function cd({annotation:t,x:e,y:o,size:n,onReply:i}){let[r,a]=Kt(!1),[s,l]=Kt(""),c=we(null),d=we(null);Ie(()=>{r&&c.current&&c.current.focus()},[r]),Ie(()=>{if(!r)return;let f=b=>{d.current&&!d.current.contains(b.target)&&a(!1)},g=b=>{b.key==="Escape"&&a(!1)};return document.addEventListener("mousedown",f),document.addEventListener("keydown",g),()=>{document.removeEventListener("mousedown",f),document.removeEventListener("keydown",g)}},[r]);let u=Me(()=>{!s.trim()||!t.threadId||(i(t.threadId,s.trim()),l(""),a(!1))},[s,t.threadId,i]),p=Me(f=>{f.key==="Enter"&&(f.metaKey||f.ctrlKey)&&(f.preventDefault(),u())},[u]);return ge("div",{ref:d,"data-devtools":"question-badge",style:{position:"fixed",left:e,top:o,zIndex:r?10002:9999,pointerEvents:"auto"},children:[!r&&ge("div",{onClick:()=>a(!0),style:{height:n,display:"flex",alignItems:"center",backgroundColor:t.color,cursor:"pointer",padding:`0 ${4}px`,gap:4,fontFamily:Se,fontSize:12,color:"#ffffff",whiteSpace:"nowrap"},children:[ge("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[rt("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),rt("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),rt("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),rt("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),rt("span",{style:{opacity:.7},children:"reply?"})]}),r&&ge("div",{style:{minWidth:260,maxWidth:360,backgroundColor:"#ffffff",fontFamily:Se,fontSize:12,color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)"},children:[rt("div",{style:{padding:`${6}px ${8}px`,lineHeight:1.4},children:t.question}),ge("div",{style:{padding:`0 ${4}px ${4}px`},children:[rt("textarea",{ref:c,value:s,onChange:f=>l(f.target.value),onKeyDown:p,placeholder:"Type your reply...",style:{width:"100%",minHeight:40,padding:4,fontSize:12,fontFamily:Se,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"}}),rt("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:4},children:rt("button",{onClick:u,disabled:!s.trim(),style:{padding:"4px 12px",fontSize:11,fontFamily:Se,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"})})]})]})]})}import{useCallback as on,useEffect as pn,useMemo as Ui,useRef as Ae,useState as fo}from"react";import{Circle as Od,Component as Fd,Hand as Dd,MessageCircle as Hd,Pen as zd,Slash as _d,Square as $d,Trash2 as Wd,Type as Yd}from"lucide-react";import{useEffect as dd,useRef as ud}from"react";function ta(t,e,o,n,i){let r=ud(0);dd(()=>{if(!o.current||(localStorage.setItem(i.expanded,String(t)),!t))return;let a=e.annotations.length;(a>=r.current||a===0||!n)&&(localStorage.setItem(i.annotations,JSON.stringify(e.annotations)),r.current=a),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 pd,createElement as fd,useCallback as jo,useEffect as Kn,useRef as Xn,useState as un}from"react";import{Fragment as Un,jsx as Wt,jsxs as Ue}from"react/jsx-runtime";var ea="popmelt-library-tab",gd=/^#[0-9a-fA-F]{3,8}$/,md=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,hd=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),yd=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function na(t){let e=t.trim();return gd.test(e)||md.test(e)||hd.has(e.toLowerCase())}function bd(t){return yd.test(t.trim())}function xd(t){let e=t.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return e?parseFloat(e[1]):null}function Ji(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 a=i;typeof a.value=="string"?o.push([r,a.value]):o.push(...Ji(i,r))}else o.push([r,Array.isArray(i)?i.map(String).join(", "):String(i!=null?i:"")])}return o}function vd(t){return t.length===0?"generic":t.filter(([,n])=>na(n)).length>t.length/2?"colors":t.filter(([,n])=>bd(n)).length>t.length/2?"spacing":"generic"}var Sd=x(m({position:"fixed",top:16,right:16,bottom:80,width:300,backgroundColor:"#ffffff"},cn),{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"}),oa={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},wd=x(m({},oa),{color:"#1f2937",borderBottom:"1.5px solid #1f2937"});function kd({entries:t}){let e=[],o=[];for(let n of t)na(n[1])?e.push(n):o.push(n);return Ue(Un,{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(Xi,{entries:o})]})}var Yo=[0,1,2,4,8,12,16,20,24,28,32];function Cd(t){if(t<=32){let e=Yo[0],o=Math.abs(t-e);for(let n=1;n<Yo.length;n++){let i=Math.abs(t-Yo[n]);i<o&&(e=Yo[n],o=i)}return e}return Math.round(t/8)*8}function Ed({label:t,value:e,px:o,tokenPath:n,rawToken:i,onHover:r,onModify:a,onDelete:s}){let[l,c]=un(!1),[d,u]=un(null),p=Xn(!1),f=Xn(0),g=Xn(0),b=Xn([]),k=d!==null?d:o,w=d!==null?`${d}px`:e,I=d!==null,N=jo(h=>{h.preventDefault(),p.current=!0,f.current=h.clientX,g.current=o;let Y=Eo(i);b.current=ni(Y);let ot=U=>{let Q=U.clientX-f.current,O=Math.max(0,Math.round(g.current+Q));U.shiftKey&&(O=Cd(O));for(let tt of b.current)tt.element.style.setProperty(tt.property,O+"px","important");u(O),r==null||r({name:t,px:O,token:Y})},j=()=>{window.removeEventListener("mousemove",ot),window.removeEventListener("mouseup",j),document.body.style.cursor="",p.current=!1,u(U=>{if(U!==null&&U!==o&&a){let Q=Eo(i),O=Q.bindings&&Q.bindings.length>0,tt;if(O){let St=ii(Q.bindings,g.current,U);tt=JSON.stringify(x(m({},Q),{value:`${U}px`,bindings:St}))}else{let St=es(b.current,g.current),q=ns(b.current);if(St.length>0){let st=ii(St,g.current,U);tt=JSON.stringify({value:`${U}px`,property:q,bindings:st})}else tt=`${U}px`}let Z=typeof i=="string"?i:JSON.stringify(i),It=b.current.map(St=>({selector:rn(St.element),property:St.property})),mt=is(b.current,g.current,U);a({tokenPath:n,originalValue:Z,currentValue:tt,targets:It,originalPx:g.current,currentPx:U},{id:Math.random().toString(36).substring(2,9),tokenPath:n,tokenName:t,originalPx:g.current,newPx:U,affectedElements:mt})}return U})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",ot),window.addEventListener("mouseup",j)},[o,t,n,i,r,a]),L=Eo(i);return Ue("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:L}))},onMouseLeave:()=>{p.current||(c(!1),r==null||r(null))},onMouseDown:N,children:[Wt("span",{style:{color:l||I?"#FF0000":"#9ca3af"},children:t}),Ue("span",{style:{display:"flex",alignItems:"center",gap:4},children:[Wt("span",{style:{color:l||I?"#FF0000":"#6b7280",fontWeight:600},children:w}),s&&l&&!I&&Wt("button",{type:"button",title:"Remove token",onMouseDown:h=>{h.stopPropagation();let Y=typeof i=="string"?i:JSON.stringify(i);s(n,Y)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:h=>{h.currentTarget.style.color="#FF0000"},onMouseLeave:h=>{h.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function Td({entries:t,categoryKey:e,rawTokens:o,onHover:n,onModify:i,onDelete:r}){let a=[],s=[];for(let l of t){let c=xd(l[1]);c!==null?a.push([l[0],l[1],c]):s.push(l)}return Ue(Un,{children:[a.length>0&&Wt("div",{style:{display:"flex",flexDirection:"column",gap:2},children:a.map(([l,c,d])=>{let u=l.split(".").pop(),p=o?Md(o,l):c,f=p&&typeof p=="object"&&"value"in p?p:c;return Wt(Ed,{label:u,value:c,px:d,tokenPath:`tokens.${e}.${l}`,rawToken:f,onHover:n,onModify:i,onDelete:r},l)})}),s.length>0&&Wt(Xi,{entries:s})]})}function Md(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 Xi({entries:t}){return Wt("div",{style:{display:"flex",flexDirection:"column",gap:3},children:t.map(([e,o])=>Ue("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 ia({entries:t,categoryKey:e,rawTokens:o,onSpacingHover:n,onModifyToken:i,onDeleteToken:r}){let a=vd(t);return a==="colors"?Wt(kd,{entries:t}):a==="spacing"?Wt(Td,{entries:t,categoryKey:e,rawTokens:o,onHover:n,onModify:i,onDelete:r}):Wt(Xi,{entries:t})}function Id(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,a=Object.keys(r).find(l=>l.startsWith("__reactFiber$")||l.startsWith("__reactInternalInstance$"));if(!a)continue;let s=r[a];for(;s;){let l=s.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({},s.memoizedProps);return delete u.ref,{type:l,props:u}}if(!o){if(d.length>=4&&e.includes(d)){let u=m({},s.memoizedProps);delete u.ref,o={type:l,props:u}}else if(e.length>=4&&d.includes(e)){let u=m({},s.memoizedProps);delete u.ref,o={type:l,props:u}}}}s=s.return}}return o}var Vi=class extends pd{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 Ld({children:t}){return Wt("div",{style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:6},children:t})}function Rd({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(Un,{children:Object.entries(t).map(([i,r])=>Ue("div",{style:{marginBottom:14},children:[Wt(Ld,{children:i}),Wt(ia,{entries:Ji(r),categoryKey:i,rawTokens:r,onSpacingHover:e,onModifyToken:o,onDeleteToken:n})]},i))})}function Ad({rules:t}){return!t||t.length===0?Wt("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."}):Wt(Un,{children:t.map((e,o)=>Ue("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[Ue("span",{style:{color:"#9ca3af",flexShrink:0},children:[o+1,"."]}),Wt("span",{children:e})]},o))})}function Pd({name:t,value:e,selected:o,highlighted:n,onRemove:i,onHover:r}){var U;let[a,s]=un(!1),[l,c]=un(!1),d=Xn(null),u=Xn(0),[p,f]=un(0),[g,b]=un(0),k=Ji(e),w=(U=k.find(([Q])=>Q==="description"))==null?void 0:U[1];Kn(()=>{if(!l&&!n){f(0),b(0),u.current=0;return}let Q=$n(t);f(Q.length)},[l,n,t]),Kn(()=>{o&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[o]);let I=o||n||l,N=o?"139,92,246":"34,197,94",L=o?"#8b5cf6":"#22c55e",h=I?`rgba(${N},0.06)`:void 0,Y=I?`inset 0 0 0 1.5px rgba(${N},0.35)`:void 0,ot=n||l,j=jo(()=>{let Q=$n(t);if(Q.length===0)return;let O=u.current%Q.length;Q[O].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),b(O),u.current=O+1,r==null||r({name:t,instanceIndex:O})},[t,r]);return Ue("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:h,padding:6,boxShadow:Y,cursor:"pointer"},children:[Ue("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[Ue("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:ot?L:"transparent",color:ot?"#fff":"#6b7280"},children:t}),ot&&p>1&&Ue("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[g+1,"/",p]})]}),i&&l&&Wt("button",{type:"button",title:"Remove from model",onClick:Q=>{Q.stopPropagation(),i(t)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:Q=>{Q.currentTarget.style.color="#FF0000"},onMouseLeave:Q=>{Q.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),w&&Wt("div",{style:{fontSize:11,color:ot?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:w}),a?Wt(ia,{entries:k.filter(([Q])=>Q!=="description"),categoryKey:""}):Wt(Nd,{name:t,onNotFound:()=>s(!0),entries:k})]})}function Nd({name:t,onNotFound:e}){let[o,n]=un(null),[i,r]=un(!1);return Kn(()=>{let a=Id(t);a||e(),n(a),r(!0)},[t,e]),!i||!o?null:Wt(Vi,{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:fd(o.type,o.props)})})})}function Bd({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)),a=ti(r),s=Object.entries(t).sort(([l],[c])=>{var d,u;return((d=a.get(l))!=null?d:1/0)-((u=a.get(c))!=null?u:1/0)});return Wt(Un,{children:s.map(([l,c])=>Wt(Pd,{name:l,value:c,selected:e===l,highlighted:o===l,onRemove:n,onHover:i},l))})}function ra({bridgeUrl:t,modelRefreshKey:e,onMouseEnter:o,onMouseLeave:n,selectedComponent:i,hoveredComponent:r,onComponentHover:a,onSpacingTokenHover:s,onModifySpacingToken:l,onDeleteSpacingToken:c,onComponentAdded:d,onComponentRemoved:u}){let[p,f]=un(void 0),[g,b]=un(!0),[k,w]=un(()=>{try{let O=localStorage.getItem(ea);if(O==="tokens"||O==="components"||O==="rules")return O}catch(O){}return"components"});Kn(()=>{zn(t).then(O=>{f(O),b(!1)})},[t,e]),Kn(()=>{try{localStorage.setItem(ea,k)}catch(O){}},[k]),Kn(()=>{i&&(w("components"),zn(t).then(O=>{O&&f(O)}))},[i,t]);let I=jo((O,tt)=>{f(Z=>{if(!(Z!=null&&Z.tokens))return Z;let It=JSON.parse(JSON.stringify(Z.tokens)),mt=O.split("."),St=It;for(let q=1;q<mt.length-1;q++)if(St=St[mt[q]],!St)return Z;return delete St[mt[mt.length-1]],x(m({},Z),{tokens:It})}),c==null||c(O,tt)},[c]),N=jo(O=>{f(tt=>{if(!(tt!=null&&tt.components))return tt;let mt=tt.components,{[O]:Z}=mt,It=So(mt,[vo(O)]);return x(m({},tt),{components:It})}),u==null||u(O)},[u]),L=p==null?void 0:p.tokens,h=p==null?void 0:p.components,Y=p==null?void 0:p.rules,ot=L&&Object.keys(L).length>0,j=h&&Object.keys(h).length>0,U=Y&&Y.length>0,Q=!p||!ot&&!j&&!U;return Ue("div",{style:Sd,onMouseEnter:o,onMouseLeave:n,children:[Ue("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?wd:oa,onClick:()=>w(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..."}):Q?Wt("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):Ue(Un,{children:[k==="components"&&Wt(Bd,{components:h,selectedComponent:i,hoveredComponent:r,onRemove:N,onHover:a}),k==="tokens"&&Wt(Rd,{tokens:L,onSpacingTokenHover:s,onModifyToken:l,onDeleteToken:c?I:void 0}),k==="rules"&&Wt(Ad,{rules:Y})]})})]})}import{jsx as sa}from"react/jsx-runtime";var kn={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#f3f4f6",bgHover:"#f9fafb",separator:"#e5e7eb"};function Cn({children:t,active:e,siblingActive:o,disabled:n,onClick:i,title:r}){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?kn.bgActive:"transparent",color:e?kn.iconActive:kn.iconDefault,opacity:a()};return sa("button",{type:"button",onClick:n?void 0:i,title:r,disabled:n,style:s,onMouseEnter:l=>{n||(l.currentTarget.style.opacity="1",e||(l.currentTarget.style.backgroundColor=kn.bgHover))},onMouseLeave:l=>{n||(l.currentTarget.style.opacity=String(a()),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 Ki(){return sa("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as On,jsx as it,jsxs as me}from"react/jsx-runtime";var Fn=[{type:"rectangle",icon:$d,label:"Rectangle",shortcut:"R"},{type:"circle",icon:Od,label:"Oval",shortcut:"O"},{type:"line",icon:_d,label:"Line",shortcut:"L"},{type:"freehand",icon:zd,label:"Pen",shortcut:"P"}],jd=new Set(Fn.map(t=>t.type));function Gd(t,e,o,n,i,r,a,s){let l=(t-i)*(n-r)-(o-i)*(e-r),c=(t-a)*(r-s)-(i-a)*(e-s),d=(t-o)*(s-n)-(a-o)*(e-n),u=l<0||c<0||d<0,p=l>0||c>0||d>0;return!(u&&p)}function Vd(){let t=window.innerWidth-16,e=t-326,o=window.innerHeight-80;return{left:e,right:t,y:o}}var Jd=[{type:"text",icon:Yd,label:"Text",shortcut:"T"}],aa={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.
 
-Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},Xd=x(m({position:"fixed",bottom:16,right:16,zIndex:9999,display:"flex",alignItems:"center",backgroundColor:"#ffffff"},cn),{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)"}),Zi="devtools-toolbar-expanded",qi="devtools-annotations",Qi="devtools-style-modifications",tr="devtools-active-tool",la="devtools-active-color",ca="devtools-stroke-width",da="devtools-inspected-element",er="devtools-spacing-changes",Kd={expanded:Zi,annotations:qi,styleMods:Qi,spacingChanges:er,tool:tr,color:la,stroke:ca,inspected:da};function Ud(){return rt("svg",{width:"16",height:"16",viewBox:"0 0 1200 1200",fill:"currentColor",stroke:"none",children:rt("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 Zd(){return rt("svg",{width:"16",height:"16",viewBox:"0 0 158.7128 157.296",fill:"currentColor",stroke:"none",children:rt("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 ua({state:t,dispatch:e,onScreenshot:o,onSendToClaude:n,onPlanGoal:i,hasActiveJobs:r,activeJobColor:a,onCrosshairHover:s,onClear:l,provider:c="claude",onProviderChange:d,availableProviders:u,modelIndex:p=0,modelCount:f=2,modelLabel:g="Opus 4.6",onModelChange:b,onViewThread:k,isThreadPanelOpen:w,activePlan:M,mcpStatus:P,onInstallMcp:I,mcpJustInstalled:h,bridgeUrl:W,modelSelectedComponent:it,modelCanvasHoveredComponent:Y,onModelComponentHover:K,onSpacingTokenHover:q,onModifySpacingToken:O,onDeleteSpacingToken:Q,modelRefreshKey:U,onModelComponentAdded:Mt,onModelComponentRemoved:mt}){let[St,Z]=fo(()=>typeof window=="undefined"?!1:localStorage.getItem(Zi)==="true"),[at,wt]=fo(0),F=Re(0),bt=Re(0),vt=Re(t.isAnnotating),Yt=Re(!1),Nt=Re(typeof window!="undefined"?localStorage.getItem(tr):null),ht=Re(typeof window!="undefined"?localStorage.getItem(la):null),ue=Re(typeof window!="undefined"?localStorage.getItem(ca):null),{charIndex:ut}=Do(!!r),[Tt,It]=fo(null),be=Re(!1),oe=Re(null),he=Re(null),G=Re({x:0,y:0}),gt=Re(null),lt=Re(null),Rt=Re(null),_t=on(()=>{gt.current=null,lt.current=null,Rt.current&&(clearTimeout(Rt.current),Rt.current=null)},[]),At=on(J=>{he.current&&(clearTimeout(he.current),he.current=null),be.current?(gt.current=J,lt.current=m({},G.current),Rt.current&&clearTimeout(Rt.current),Rt.current=setTimeout(()=>{gt.current&&(It(gt.current),_t())},300)):(oe.current&&clearTimeout(oe.current),oe.current=setTimeout(()=>{be.current=!0,It(J),oe.current=null},500))},[_t]),kt=on(()=>{_t(),oe.current&&(clearTimeout(oe.current),oe.current=null),he.current=setTimeout(()=>{be.current=!1,It(null)},150)},[_t]),Qt=on(J=>{if(G.current={x:J.clientX,y:J.clientY},gt.current&&lt.current){let nt=lt.current,y=Vd();Gd(J.clientX,J.clientY,nt.x,nt.y,y.left,y.y,y.right,y.y)||(It(gt.current),_t())}},[_t]),Dt=Ui(()=>{let J=(u!=null?u:[]).map(nt=>nt==="claude"?"Claude":nt==="codex"?"Codex":nt);return{name:"AI Model",desc:J.length>1?`${J.join(" and ")} are available.`:J.length===1?`Connected to ${J[0]}.`:"No AI providers detected.",usage:J.length>1?["Click the logo to switch between providers","Click the model name to switch tiers"]:["Click the model name to switch tiers"],keys:J.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]);ta(St,t,Yt,!!r,Kd),pn(()=>{if(localStorage.getItem(Zi)==="true"&&!t.isAnnotating){if(St||Z(!0),e({type:"SET_TOOL",payload:Nt.current||"inspector"}),e({type:"SET_ANNOTATING",payload:!0}),ht.current&&e({type:"SET_COLOR",payload:ht.current}),ue.current){let _=parseFloat(ue.current);isNaN(_)||e({type:"SET_STROKE_WIDTH",payload:_})}let nt=localStorage.getItem(qi);if(nt)try{let _=JSON.parse(nt);Array.isArray(_)&&_.length>0&&e({type:"RESTORE_ANNOTATIONS",payload:{annotations:_}})}catch(_){}let y=localStorage.getItem(Qi);if(y)try{let _=JSON.parse(y);Array.isArray(_)&&_.length>0&&(e({type:"RESTORE_STYLE_MODIFICATIONS",payload:_}),Io(_))}catch(_){}let L=localStorage.getItem(er);if(L)try{let _=JSON.parse(L);Array.isArray(_)&&_.length>0&&e({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:_})}catch(_){}let A=localStorage.getItem(da);if(A)try{let{selector:_,info:Ct}=JSON.parse(A);if(_){let pt=$e(_);if(pt){let dt=Ct||x(m({},_e(pt)),{selector:_});e({type:"SELECT_ELEMENT",payload:{el:pt,info:dt}})}}}catch(_){}}return Yt.current=!0,()=>{Yt.current=!1}},[]);let Ce=Re(t.styleModifications);pn(()=>{let J=Ce.current,nt=t.styleModifications;J!==nt&&(Lo(J),Io(nt),Ce.current=nt)},[t.styleModifications]),pn(()=>{let J=vt.current;vt.current=t.isAnnotating,J&&!t.isAnnotating&&St&&Z(!1)},[t.isAnnotating,St]);let re=Re(St);re.current=St,pn(()=>{let J=y=>{if(y.key==="Meta"||y.key==="Control"){let L=Date.now();if(L-F.current<300){if(bt.current++,bt.current>=2){if(re.current)e({type:"SET_ANNOTATING",payload:!1}),Z(!1);else{let Ct=localStorage.getItem(tr);e({type:"SET_TOOL",payload:Ct||"inspector"}),e({type:"SET_ANNOTATING",payload:!0}),Z(!0)}bt.current=0}}else bt.current=1;F.current=L}else bt.current=0},nt=y=>{y.key!=="Meta"&&y.key!=="Control"&&(bt.current=0)};return window.addEventListener("keydown",J),window.addEventListener("keyup",nt),()=>{window.removeEventListener("keydown",J),window.removeEventListener("keyup",nt)}},[e]);let pe=on(J=>{_t(),e({type:"SET_TOOL",payload:J}),t.isAnnotating||e({type:"SET_ANNOTATING",payload:!0}),be.current=!1,It(null),oe.current&&(clearTimeout(oe.current),oe.current=null),he.current&&(clearTimeout(he.current),he.current=null)},[e,t.isAnnotating,_t]),Ut=on(async()=>{window.focus(),await o()},[o]),Ee=on(async()=>{let J=t.annotations.filter(L=>{var A;return((A=L.status)!=null?A:"pending")==="pending"}),nt=t.styleModifications.filter(L=>!L.captured),y=J.some(L=>L.type!=="text");if(i){let L=J.filter(_=>_.type==="text"&&_.text),A=L.find(_=>_.text.toLowerCase().startsWith("/plan "));if(A){let _=A.text.replace(/^\/plan\s+/i,""),Ct=L.filter(dt=>dt!==A&&dt.text).map(dt=>dt.text),pt=[_,...Ct].join(". ");await i(pt);return}}n&&await n()},[n,i,t.annotations,t.styleModifications,t.spacingTokenChanges]),ae=on(()=>{e({type:"SET_ANNOTATING",payload:!1}),Z(!1)},[e]),Ge=on(()=>{Lo(t.styleModifications),document.querySelectorAll("[data-pm]").forEach(J=>J.removeAttribute("data-pm")),e({type:"CLEAR"}),e({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(qi),localStorage.removeItem(Qi),localStorage.removeItem(er),Fe(null),l==null||l()},[e,t.styleModifications,l]),[ce,Ve]=fo(29),ve=Re(null),Ze=Re(null),ze=Re(!1),ye=on(J=>{let nt=J.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return nt&&nt[1]?parseFloat(nt[1]):null},[]);pn(()=>{ze.current=!0;let J=`oklch(0.628 0.258 ${ce})`;e({type:"SET_COLOR",payload:J}),requestAnimationFrame(()=>{ze.current=!1})},[ce,e]),pn(()=>{if(ze.current)return;let J=ye(t.activeColor);J!==null&&Math.abs(J-ce)>.5&&Ve(J)},[t.activeColor,ye,ce]);let qe=t.annotations.length>0;pn(()=>{let J=Ze.current;if(!J||!qe)return;let nt=y=>{y.preventDefault(),y.stopPropagation();let L=y.deltaY>0?-1:1,A=((ce+L)%360+360)%360,_=`oklch(0.628 0.258 ${A})`;Ve(A),t.selectedAnnotationIds.length>0&&e({type:"UPDATE_ANNOTATION_COLOR",payload:{id:t.lastSelectedId||t.selectedAnnotationIds[0],color:_}})};return J.addEventListener("wheel",nt,{passive:!1}),()=>J.removeEventListener("wheel",nt)},[qe,t.selectedAnnotationIds,t.lastSelectedId,ce,e]);let X=Re(!1),Ft=on(()=>{X.current=!1,ve.current=setTimeout(()=>{X.current=!0,Ve(29)},500)},[]),Pt=on(()=>{ve.current&&(clearTimeout(ve.current),ve.current=null)},[]);pn(()=>()=>{ve.current&&clearTimeout(ve.current),Rt.current&&clearTimeout(Rt.current)},[]);let Qe=Ui(()=>Fo(t.annotations),[t.annotations]),te=Ui(()=>{let J=[],nt=new Set;for(let y of t.annotations)if(!Qe.has(y))if(y.groupId){if(!nt.has(y.groupId)){nt.add(y.groupId);let L=t.annotations.filter(_=>_.groupId===y.groupId&&!Qe.has(_)),A=L.find(_=>_.type!=="text")||L[0];J.push({id:A.id,annotations:L})}}else J.push({id:y.id,annotations:[y]});return J},[t.annotations,Qe]),[Vt,Fe]=fo(null),Ne=te.length+t.styleModifications.length;pn(()=>{(Ne===0||Vt!==null&&Vt>=Ne)&&Fe(null)},[Ne,Vt]),pn(()=>{if(t.selectedAnnotationIds.length===0&&!t.inspectedElement){Fe(null);return}if(t.selectedAnnotationIds.length>0){let J=t.selectedAnnotationIds[0],nt=te.findIndex(y=>y.id===J||y.annotations.some(L=>L.id===J));nt>=0&&nt!==Vt&&Fe(nt)}},[t.selectedAnnotationIds,t.inspectedElement,te]);let gn=on(()=>{var nt;if(Ne===0)return;let J;if(Vt===null?J=0:J=(Vt+1)%Ne,Fe(J),J<te.length){let y=te[J];if(!y)return;e({type:"SELECT_ELEMENT",payload:null}),e({type:"SELECT_ANNOTATION",payload:{id:y.id}});let L=y.annotations.find(xt=>xt.type!=="text")||y.annotations[0];if(y.annotations.some(xt=>xt.linkedSelector))e({type:"SET_TOOL",payload:"inspector"});else if(L!=null&&L.type&&L.type!=="text"&&L.type!=="inspector"){e({type:"SET_TOOL",payload:L.type});let xt=Fn.findIndex(qt=>qt.type===L.type);xt>=0&&wt(xt)}if(L!=null&&L.color){e({type:"SET_COLOR",payload:L.color});let xt=ye(L.color);xt!==null&&Ve(xt)}let _=y.annotations.flatMap(xt=>xt.points);if(_.length===0)return;let Ct=Math.min(..._.map(xt=>xt.x)),pt=Math.max(..._.map(xt=>xt.x)),dt=Math.min(..._.map(xt=>xt.y)),Bt=Math.max(..._.map(xt=>xt.y)),Lt=(Ct+pt)/2,Ht=(dt+Bt)/2;if(window.scrollTo({left:Lt-window.innerWidth/2,top:Ht-window.innerHeight/2,behavior:"smooth"}),w&&k){let xt=(nt=y.annotations.find(qt=>qt.threadId))==null?void 0:nt.threadId;xt&&k(xt)}}else{let y=J-te.length,L=t.styleModifications[y];if(!L)return;let A=$e(L.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:L.element}});let _=A.getBoundingClientRect(),Ct=_.left+_.width/2+window.scrollX,pt=_.top+_.height/2+window.scrollY;window.scrollTo({left:Ct-window.innerWidth/2,top:pt-window.innerHeight/2,behavior:"smooth"})}},[te,t.styleModifications,Ne,Vt,e,ye,w,k]);pn(()=>{if(!St)return;let J=nt=>{let y=document.activeElement;if((y==null?void 0:y.tagName)==="INPUT"||(y==null?void 0:y.tagName)==="TEXTAREA")return;if((nt.metaKey||nt.ctrlKey)&&nt.key==="Enter"){(n||i)&&(t.annotations.length>0||t.styleModifications.length>0||t.spacingTokenChanges.filter(_=>!_.captured).length>0)&&(nt.preventDefault(),Ee());return}if((nt.metaKey||nt.ctrlKey)&&(nt.key==="c"||nt.key==="C"||nt.code==="KeyC")){(t.annotations.length>0||t.styleModifications.length>0)&&(nt.preventDefault(),window.focus(),Ut());return}if((nt.metaKey||nt.ctrlKey)&&(nt.key==="Backspace"||nt.key==="Delete")){nt.preventDefault(),Ge();return}if(nt.metaKey||nt.ctrlKey||nt.altKey)return;let L={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand"};if(nt.key.toLowerCase()==="m"){nt.preventDefault(),pe("model");return}let A=L[nt.key.toLowerCase()];if(A){nt.preventDefault();let _=Fn.findIndex(Ct=>Ct.type===A);_>=0&&wt(_),pe(A)}};return window.addEventListener("keydown",J),()=>window.removeEventListener("keydown",J)},[St,pe,Ut,Ee,n,i,Ge,t.annotations.length,t.styleModifications.length,t.spacingTokenChanges,Tt]);let ee=x(m({},Xd),{borderRadius:0,padding:St?"0 8px":"0",width:St?"auto":48,height:48,gap:0,justifyContent:St?"flex-start":"center"}),sn=r&&a?a:kn.iconActive;return St?me(On,{children:[rt("style",{children:`
+Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},Xd=x(m({position:"fixed",bottom:16,right:16,zIndex:9999,display:"flex",alignItems:"center",backgroundColor:"#ffffff"},cn),{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)"}),Zi="devtools-toolbar-expanded",qi="devtools-annotations",Qi="devtools-style-modifications",tr="devtools-active-tool",la="devtools-active-color",ca="devtools-stroke-width",da="devtools-inspected-element",er="devtools-spacing-changes",Kd={expanded:Zi,annotations:qi,styleMods:Qi,spacingChanges:er,tool:tr,color:la,stroke:ca,inspected:da};function Ud(){return it("svg",{width:"16",height:"16",viewBox:"0 0 1200 1200",fill:"currentColor",stroke:"none",children:it("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 Zd(){return it("svg",{width:"16",height:"16",viewBox:"0 0 158.7128 157.296",fill:"currentColor",stroke:"none",children:it("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 ua({state:t,dispatch:e,onScreenshot:o,onSendToClaude:n,onPlanGoal:i,hasActiveJobs:r,activeJobColor:a,onCrosshairHover:s,onClear:l,provider:c="claude",onProviderChange:d,availableProviders:u,modelIndex:p=0,modelCount:f=2,modelLabel:g="Opus 4.6",onModelChange:b,onViewThread:k,isThreadPanelOpen:w,activePlan:I,mcpStatus:N,onInstallMcp:L,mcpJustInstalled:h,bridgeUrl:Y,modelSelectedComponent:ot,modelCanvasHoveredComponent:j,onModelComponentHover:U,onSpacingTokenHover:Q,onModifySpacingToken:O,onDeleteSpacingToken:tt,modelRefreshKey:Z,onModelComponentAdded:It,onModelComponentRemoved:mt}){let[St,q]=fo(()=>typeof window=="undefined"?!1:localStorage.getItem(Zi)==="true"),[st,wt]=fo(0),F=Ae(0),bt=Ae(0),vt=Ae(t.isAnnotating),Yt=Ae(!1),Bt=Ae(typeof window!="undefined"?localStorage.getItem(tr):null),ht=Ae(typeof window!="undefined"?localStorage.getItem(la):null),ue=Ae(typeof window!="undefined"?localStorage.getItem(ca):null),{charIndex:ct}=Do(!!r),[Mt,Lt]=fo(null),be=Ae(!1),ne=Ae(null),he=Ae(null),G=Ae({x:0,y:0}),gt=Ae(null),at=Ae(null),At=Ae(null),_t=on(()=>{gt.current=null,at.current=null,At.current&&(clearTimeout(At.current),At.current=null)},[]),Pt=on(V=>{he.current&&(clearTimeout(he.current),he.current=null),be.current?(gt.current=V,at.current=m({},G.current),At.current&&clearTimeout(At.current),At.current=setTimeout(()=>{gt.current&&(Lt(gt.current),_t())},300)):(ne.current&&clearTimeout(ne.current),ne.current=setTimeout(()=>{be.current=!0,Lt(V),ne.current=null},500))},[_t]),kt=on(()=>{_t(),ne.current&&(clearTimeout(ne.current),ne.current=null),he.current=setTimeout(()=>{be.current=!1,Lt(null)},150)},[_t]),Qt=on(V=>{if(G.current={x:V.clientX,y:V.clientY},gt.current&&at.current){let et=at.current,y=Vd();Gd(V.clientX,V.clientY,et.x,et.y,y.left,y.y,y.right,y.y)||(Lt(gt.current),_t())}},[_t]),Dt=Ui(()=>{let V=(u!=null?u:[]).map(et=>et==="claude"?"Claude":et==="codex"?"Codex":et);return{name:"AI Model",desc:V.length>1?`${V.join(" and ")} are available.`:V.length===1?`Connected to ${V[0]}.`:"No AI providers detected.",usage:V.length>1?["Click the logo to switch between providers","Click the model name to switch tiers"]:["Click the model name to switch tiers"],keys:V.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]);ta(St,t,Yt,!!r,Kd),pn(()=>{if(localStorage.getItem(Zi)==="true"&&!t.isAnnotating){if(St||q(!0),e({type:"SET_TOOL",payload:Bt.current||"inspector"}),e({type:"SET_ANNOTATING",payload:!0}),ht.current&&e({type:"SET_COLOR",payload:ht.current}),ue.current){let z=parseFloat(ue.current);isNaN(z)||e({type:"SET_STROKE_WIDTH",payload:z})}let et=localStorage.getItem(qi);if(et)try{let z=JSON.parse(et);Array.isArray(z)&&z.length>0&&e({type:"RESTORE_ANNOTATIONS",payload:{annotations:z}})}catch(z){}let y=localStorage.getItem(Qi);if(y)try{let z=JSON.parse(y);Array.isArray(z)&&z.length>0&&(e({type:"RESTORE_STYLE_MODIFICATIONS",payload:z}),Io(z))}catch(z){}let R=localStorage.getItem(er);if(R)try{let z=JSON.parse(R);Array.isArray(z)&&z.length>0&&e({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:z})}catch(z){}let A=localStorage.getItem(da);if(A)try{let{selector:z,info:Ct}=JSON.parse(A);if(z){let dt=$e(z);if(dt){let lt=Ct||x(m({},_e(dt)),{selector:z});e({type:"SELECT_ELEMENT",payload:{el:dt,info:lt}})}}}catch(z){}}return Yt.current=!0,()=>{Yt.current=!1}},[]);let Ce=Ae(t.styleModifications);pn(()=>{let V=Ce.current,et=t.styleModifications;V!==et&&(Lo(V),Io(et),Ce.current=et)},[t.styleModifications]),pn(()=>{let V=vt.current;vt.current=t.isAnnotating,V&&!t.isAnnotating&&St&&q(!1)},[t.isAnnotating,St]);let re=Ae(St);re.current=St,pn(()=>{let V=y=>{if(y.key==="Meta"||y.key==="Control"){let R=Date.now();if(R-F.current<300){if(bt.current++,bt.current>=2){if(re.current)e({type:"SET_ANNOTATING",payload:!1}),q(!1);else{let Ct=localStorage.getItem(tr);e({type:"SET_TOOL",payload:Ct||"inspector"}),e({type:"SET_ANNOTATING",payload:!0}),q(!0)}bt.current=0}}else bt.current=1;F.current=R}else bt.current=0},et=y=>{y.key!=="Meta"&&y.key!=="Control"&&(bt.current=0)};return window.addEventListener("keydown",V),window.addEventListener("keyup",et),()=>{window.removeEventListener("keydown",V),window.removeEventListener("keyup",et)}},[e]);let pe=on(V=>{_t(),e({type:"SET_TOOL",payload:V}),t.isAnnotating||e({type:"SET_ANNOTATING",payload:!0}),be.current=!1,Lt(null),ne.current&&(clearTimeout(ne.current),ne.current=null),he.current&&(clearTimeout(he.current),he.current=null)},[e,t.isAnnotating,_t]),Ut=on(async()=>{window.focus(),await o()},[o]),Ee=on(async()=>{let V=t.annotations.filter(R=>{var A;return((A=R.status)!=null?A:"pending")==="pending"}),et=t.styleModifications.filter(R=>!R.captured),y=V.some(R=>R.type!=="text");if(i){let R=V.filter(z=>z.type==="text"&&z.text),A=R.find(z=>z.text.toLowerCase().startsWith("/plan "));if(A){let z=A.text.replace(/^\/plan\s+/i,""),Ct=R.filter(lt=>lt!==A&&lt.text).map(lt=>lt.text),dt=[z,...Ct].join(". ");await i(dt);return}}n&&await n()},[n,i,t.annotations,t.styleModifications,t.spacingTokenChanges]),ae=on(()=>{e({type:"SET_ANNOTATING",payload:!1}),q(!1)},[e]),Ge=on(()=>{Lo(t.styleModifications),document.querySelectorAll("[data-pm]").forEach(V=>V.removeAttribute("data-pm")),e({type:"CLEAR"}),e({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(qi),localStorage.removeItem(Qi),localStorage.removeItem(er),De(null),l==null||l()},[e,t.styleModifications,l]),[ce,Ve]=fo(29),ve=Ae(null),Ze=Ae(null),ze=Ae(!1),ye=on(V=>{let et=V.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return et&&et[1]?parseFloat(et[1]):null},[]);pn(()=>{ze.current=!0;let V=`oklch(0.628 0.258 ${ce})`;e({type:"SET_COLOR",payload:V}),requestAnimationFrame(()=>{ze.current=!1})},[ce,e]),pn(()=>{if(ze.current)return;let V=ye(t.activeColor);V!==null&&Math.abs(V-ce)>.5&&Ve(V)},[t.activeColor,ye,ce]);let qe=t.annotations.length>0;pn(()=>{let V=Ze.current;if(!V||!qe)return;let et=y=>{y.preventDefault(),y.stopPropagation();let R=y.deltaY>0?-1:1,A=((ce+R)%360+360)%360,z=`oklch(0.628 0.258 ${A})`;Ve(A),t.selectedAnnotationIds.length>0&&e({type:"UPDATE_ANNOTATION_COLOR",payload:{id:t.lastSelectedId||t.selectedAnnotationIds[0],color:z}})};return V.addEventListener("wheel",et,{passive:!1}),()=>V.removeEventListener("wheel",et)},[qe,t.selectedAnnotationIds,t.lastSelectedId,ce,e]);let J=Ae(!1),Ft=on(()=>{J.current=!1,ve.current=setTimeout(()=>{J.current=!0,Ve(29)},500)},[]),Nt=on(()=>{ve.current&&(clearTimeout(ve.current),ve.current=null)},[]);pn(()=>()=>{ve.current&&clearTimeout(ve.current),At.current&&clearTimeout(At.current)},[]);let Qe=Ui(()=>Fo(t.annotations),[t.annotations]),te=Ui(()=>{let V=[],et=new Set;for(let y of t.annotations)if(!Qe.has(y))if(y.groupId){if(!et.has(y.groupId)){et.add(y.groupId);let R=t.annotations.filter(z=>z.groupId===y.groupId&&!Qe.has(z)),A=R.find(z=>z.type!=="text")||R[0];V.push({id:A.id,annotations:R})}}else V.push({id:y.id,annotations:[y]});return V},[t.annotations,Qe]),[Jt,De]=fo(null),Be=te.length+t.styleModifications.length;pn(()=>{(Be===0||Jt!==null&&Jt>=Be)&&De(null)},[Be,Jt]),pn(()=>{if(t.selectedAnnotationIds.length===0&&!t.inspectedElement){De(null);return}if(t.selectedAnnotationIds.length>0){let V=t.selectedAnnotationIds[0],et=te.findIndex(y=>y.id===V||y.annotations.some(R=>R.id===V));et>=0&&et!==Jt&&De(et)}},[t.selectedAnnotationIds,t.inspectedElement,te]);let gn=on(()=>{var et;if(Be===0)return;let V;if(Jt===null?V=0:V=(Jt+1)%Be,De(V),V<te.length){let y=te[V];if(!y)return;e({type:"SELECT_ELEMENT",payload:null}),e({type:"SELECT_ANNOTATION",payload:{id:y.id}});let R=y.annotations.find(xt=>xt.type!=="text")||y.annotations[0];if(y.annotations.some(xt=>xt.linkedSelector))e({type:"SET_TOOL",payload:"inspector"});else if(R!=null&&R.type&&R.type!=="text"&&R.type!=="inspector"){e({type:"SET_TOOL",payload:R.type});let xt=Fn.findIndex(qt=>qt.type===R.type);xt>=0&&wt(xt)}if(R!=null&&R.color){e({type:"SET_COLOR",payload:R.color});let xt=ye(R.color);xt!==null&&Ve(xt)}let z=y.annotations.flatMap(xt=>xt.points);if(z.length===0)return;let Ct=Math.min(...z.map(xt=>xt.x)),dt=Math.max(...z.map(xt=>xt.x)),lt=Math.min(...z.map(xt=>xt.y)),Ot=Math.max(...z.map(xt=>xt.y)),Rt=(Ct+dt)/2,Ht=(lt+Ot)/2;if(window.scrollTo({left:Rt-window.innerWidth/2,top:Ht-window.innerHeight/2,behavior:"smooth"}),w&&k){let xt=(et=y.annotations.find(qt=>qt.threadId))==null?void 0:et.threadId;xt&&k(xt)}}else{let y=V-te.length,R=t.styleModifications[y];if(!R)return;let A=$e(R.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:R.element}});let z=A.getBoundingClientRect(),Ct=z.left+z.width/2+window.scrollX,dt=z.top+z.height/2+window.scrollY;window.scrollTo({left:Ct-window.innerWidth/2,top:dt-window.innerHeight/2,behavior:"smooth"})}},[te,t.styleModifications,Be,Jt,e,ye,w,k]);pn(()=>{if(!St)return;let V=et=>{let y=document.activeElement;if((y==null?void 0:y.tagName)==="INPUT"||(y==null?void 0:y.tagName)==="TEXTAREA")return;if((et.metaKey||et.ctrlKey)&&et.key==="Enter"){(n||i)&&(t.annotations.length>0||t.styleModifications.length>0||t.spacingTokenChanges.filter(z=>!z.captured).length>0)&&(et.preventDefault(),Ee());return}if((et.metaKey||et.ctrlKey)&&(et.key==="c"||et.key==="C"||et.code==="KeyC")){(t.annotations.length>0||t.styleModifications.length>0)&&(et.preventDefault(),window.focus(),Ut());return}if((et.metaKey||et.ctrlKey)&&(et.key==="Backspace"||et.key==="Delete")){et.preventDefault(),Ge();return}if(et.metaKey||et.ctrlKey||et.altKey)return;let R={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand"};if(et.key.toLowerCase()==="m"){et.preventDefault(),pe("model");return}let A=R[et.key.toLowerCase()];if(A){et.preventDefault();let z=Fn.findIndex(Ct=>Ct.type===A);z>=0&&wt(z),pe(A)}};return window.addEventListener("keydown",V),()=>window.removeEventListener("keydown",V)},[St,pe,Ut,Ee,n,i,Ge,t.annotations.length,t.styleModifications.length,t.spacingTokenChanges,Mt]);let ee=x(m({},Xd),{borderRadius:0,padding:St?"0 8px":"0",width:St?"auto":48,height:48,gap:0,justifyContent:St?"flex-start":"center"}),sn=r&&a?a:kn.iconActive;return St?me(On,{children:[it("style",{children:`
         @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
-      `}),rt("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),(Tt==="model"||t.activeTool==="model")&&rt(ra,{bridgeUrl:W,selectedComponent:it,hoveredComponent:Y,onComponentHover:K,onSpacingTokenHover:q,onModifySpacingToken:O,onDeleteSpacingToken:Q,modelRefreshKey:U,onComponentAdded:Mt,onComponentRemoved:mt,onMouseEnter:()=>{_t(),he.current&&(clearTimeout(he.current),he.current=null)},onMouseLeave:t.activeTool==="model"?void 0:kt}),Tt&&Tt!=="model"&&(Tt==="provider"||aa[Tt])&&(()=>{let J=Tt==="provider"?Dt:aa[Tt];return me("div",{onMouseEnter:Tt==="collapse"?()=>{_t(),he.current&&(clearTimeout(he.current),he.current=null)}:void 0,onMouseLeave:Tt==="collapse"?kt:void 0,style:m(x(m({position:"fixed",bottom:80,right:16,width:300,backgroundColor:"#ffffff"},cn),{boxSizing:"content-box",zIndex:10001,fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12}),Tt!=="collapse"?{pointerEvents:"none"}:{}),children:[Tt==="collapse"&&rt("div",{style:{marginBottom:10},children:rt("svg",{width:"48",height:"48",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:rt("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"})})}),me("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[rt("span",{children:J.name}),J.keys[0]&&rt("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:J.keys[0].key})]}),rt("div",{style:{color:"#6b7280",lineHeight:1.5,marginBottom:Tt==="collapse"?0:10},children:J.desc.split(`
+      `}),it("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),(Mt==="model"||t.activeTool==="model")&&it(ra,{bridgeUrl:Y,selectedComponent:ot,hoveredComponent:j,onComponentHover:U,onSpacingTokenHover:Q,onModifySpacingToken:O,onDeleteSpacingToken:tt,modelRefreshKey:Z,onComponentAdded:It,onComponentRemoved:mt,onMouseEnter:()=>{_t(),he.current&&(clearTimeout(he.current),he.current=null)},onMouseLeave:t.activeTool==="model"?void 0:kt}),Mt&&Mt!=="model"&&(Mt==="provider"||aa[Mt])&&(()=>{let V=Mt==="provider"?Dt:aa[Mt];return me("div",{onMouseEnter:Mt==="collapse"?()=>{_t(),he.current&&(clearTimeout(he.current),he.current=null)}:void 0,onMouseLeave:Mt==="collapse"?kt:void 0,style:m(x(m({position:"fixed",bottom:80,right:16,width:300,backgroundColor:"#ffffff"},cn),{boxSizing:"content-box",zIndex:10001,fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12}),Mt!=="collapse"?{pointerEvents:"none"}:{}),children:[Mt==="collapse"&&it("div",{style:{marginBottom:10},children:it("svg",{width:"48",height:"48",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:it("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"})})}),me("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[it("span",{children:V.name}),V.keys[0]&&it("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:V.keys[0].key})]}),it("div",{style:{color:"#6b7280",lineHeight:1.5,marginBottom:Mt==="collapse"?0:10},children:V.desc.split(`
 
-`).map((nt,y)=>rt("p",{style:{margin:0,marginTop:y>0?8:0},children:nt},y))}),J.usage.map((nt,y)=>me("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[rt("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),rt("span",{children:nt})]},y)),Tt==="collapse"&&P&&Object.keys(P).length>0&&(()=>{let nt=Object.entries(P).filter(([,A])=>A.found&&!A.disabled).map(([A])=>A.charAt(0).toUpperCase()+A.slice(1)),y=Object.entries(P).filter(([,A])=>!A.found).map(([A])=>A);if(nt.length===0&&y.length===0)return null;let L=y.map(A=>A.charAt(0).toUpperCase()+A.slice(1));return me("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8,display:"flex",alignItems:"center",gap:6,fontSize:11},children:[rt("span",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:nt.length>0?"#22c55e":"rgba(0,0,0,0.2)",flexShrink:0}}),nt.length>0?me("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[me("span",{children:["Taste library ready in ",nt.join(", "),h&&" \u2014 restart CLI to activate"]}),y.length>0&&I&&!h&&me("button",{type:"button",onClick:A=>{A.stopPropagation(),I()},style:{border:"none",background:"transparent",color:"#3b82f6",fontSize:10,fontWeight:500,fontFamily:"inherit",padding:0,cursor:"pointer",pointerEvents:"auto",textDecoration:"underline",textUnderlineOffset:2},children:["+ ",L.join(", ")]})]}):y.length>0&&I?me("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[rt("span",{children:"Connect Popmelt MCP"}),rt("button",{type:"button",onClick:A=>{A.stopPropagation(),I()},style:{border:"none",background:"#1f2937",color:"#fff",fontSize:10,fontWeight:600,fontFamily:"inherit",padding:"2px 8px",cursor:"pointer",pointerEvents:"auto"},children:"Connect"})]}):null]})})(),J.keys.length>1&&rt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8,display:"flex",flexDirection:"column",gap:4},children:J.keys.slice(1).map((nt,y)=>me("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:nt.accent?"#fff":"#6b7280"},children:[rt("code",{style:{fontSize:10,backgroundColor:nt.accent?t.activeColor:"rgba(0,0,0,0.06)",color:nt.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:nt.key}),rt("span",{style:{color:nt.accent?t.activeColor:void 0,fontWeight:nt.accent?600:void 0},children:nt.desc})]},y))})]})})(),me("div",{id:"devtools-toolbar",style:ee,onMouseMove:Qt,children:[(t.annotations.length>0||t.styleModifications.length>0)&&me(On,{children:[rt("span",{onMouseEnter:()=>At("clear"),onMouseLeave:kt,children:rt(Cn,{onClick:Ge,title:"Clear all (\u2318\u232B)",children:rt(Wd,{size:17,strokeWidth:1.5})})}),rt(Ki,{})]}),me("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[rt("span",{onMouseEnter:()=>At("inspector"),onMouseLeave:kt,children:rt(Cn,{active:t.isAnnotating&&t.activeTool==="inspector",siblingActive:t.isAnnotating,onClick:()=>pe("inspector"),children:rt(Hd,{size:20,strokeWidth:1.5})})}),rt("span",{onMouseEnter:()=>At("hand"),onMouseLeave:kt,children:rt(Cn,{active:t.isAnnotating&&t.activeTool==="hand",siblingActive:t.isAnnotating,onClick:()=>pe("hand"),children:me("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[rt(Dd,{size:20,strokeWidth:1.5}),t.styleModifications.filter(J=>!J.captured).length>0&&rt("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(J=>!J.captured).length})]})})}),(()=>{let J=Fn[at],nt=J.icon,y=t.isAnnotating&&jd.has(t.activeTool);return rt("span",{onMouseEnter:()=>At(J.type),onMouseLeave:kt,children:me("div",{style:{display:"flex",alignItems:"center",gap:0},children:[rt(Cn,{active:y,siblingActive:t.isAnnotating,onClick:()=>pe(J.type),children:rt(nt,{size:20,strokeWidth:1.5})}),rt("button",{type:"button",onClick:()=>{let L=(at+1)%Fn.length;wt(L),pe(Fn[L].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&&!y?.5:1,transition:"opacity 150ms ease"},children:Fn.map((L,A)=>rt("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:A===at?kn.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},A))})]})})})(),Jd.map(({type:J,icon:nt,label:y,shortcut:L})=>rt("span",{onMouseEnter:()=>At(J),onMouseLeave:kt,children:rt(Cn,{active:t.isAnnotating&&t.activeTool===J,siblingActive:t.isAnnotating,onClick:()=>pe(J),children:rt(nt,{size:20,strokeWidth:1.5})})},J)),rt("span",{onMouseEnter:()=>At("model"),onMouseLeave:kt,children:rt(Cn,{active:t.isAnnotating&&t.activeTool==="model",siblingActive:t.isAnnotating,onClick:()=>pe("model"),children:rt(Fd,{size:17,strokeWidth:1.5})})})]}),rt(Ki,{}),me("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(te.length>0||t.styleModifications.length>0||t.spacingTokenChanges.filter(J=>!J.captured).length>0)&&(()=>{var A;let J=Vt!==null&&Vt<te.length?te[Vt]:null,nt=t.annotations.length>0&&t.annotations.every(_=>_.status&&_.status!=="pending"),y=Vt!==null?(A=J==null?void 0:J.annotations.some(_=>_.status&&_.status!=="pending"))!=null?A:!1:nt,L=`oklch(0.628 0.258 ${ce})`;return rt("span",{onMouseEnter:()=>At("counter"),onMouseLeave:kt,children:rt("button",{ref:Ze,type:"button",onClick:()=>{if(X.current){X.current=!1;return}gn()},onMouseDown:Ft,onMouseUp:Pt,onMouseLeave:Pt,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:y?"#999999":L,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:Vt!==null?Vt+1:te.length+t.styleModifications.length+t.spacingTokenChanges.filter(_=>!_.captured).length})})})(),d&&rt("span",{onMouseEnter:()=>At("provider"),onMouseLeave:kt,style:{display:"contents"},children:me("div",{style:{display:"flex",alignItems:"center",gap:0},children:[rt(Cn,{onClick:()=>d(c==="claude"?"codex":"claude"),children:c==="claude"?rt(Ud,{}):rt(Zd,{})}),me("button",{type:"button",onClick:()=>{let J=(p+1)%f;b==null||b(J)},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:kn.iconDefault,whiteSpace:"nowrap"},children:[rt("span",{children:g}),rt("span",{style:{display:"flex",flexDirection:"column",gap:2},children:Array.from({length:f},(J,nt)=>rt("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:nt===p?kn.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},nt))})]})]})}),rt("div",{onMouseEnter:J=>{s==null||s(!0),J.currentTarget.style.opacity="1",At("collapse")},onMouseLeave:J=>{s==null||s(!1),J.currentTarget.style.opacity=r?"1":"0.3",kt()},style:{display:"inline-flex",opacity:r?1:.3,transition:"opacity 150ms ease"},children:rt(Cn,{onClick:ae,title:"Collapse (\u2318\u2318)",children:r?rt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:sn,children:ut===1?me(On,{children:[rt("circle",{cx:"7",cy:"7",r:"2"}),rt("circle",{cx:"17",cy:"7",r:"2"}),rt("circle",{cx:"7",cy:"17",r:"2"}),rt("circle",{cx:"17",cy:"17",r:"2"})]}):me(On,{children:[rt("circle",{cx:"12",cy:"6",r:"2"}),rt("circle",{cx:"6",cy:"12",r:"2"}),rt("circle",{cx:"18",cy:"12",r:"2"}),rt("circle",{cx:"12",cy:"18",r:"2"})]})}):me("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:sn,strokeWidth:"1.5",strokeLinecap:"round",style:{transform:"rotate(45deg)"},children:[rt("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),rt("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),rt("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),rt("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})]})]}):me(On,{children:[rt("style",{children:"@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }"}),rt("div",{id:"devtools-toolbar",style:x(m({},ee),{overflow:"visible",opacity:.5,transition:"opacity 150ms ease"}),onMouseEnter:J=>J.currentTarget.style.opacity="1",onMouseLeave:J=>J.currentTarget.style.opacity="0.5",children:rt("button",{type:"button",style:{display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,border:"none",background:"none",cursor:"pointer",padding:0},onClick:()=>{Z(!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:r?rt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:sn,children:ut===1?me(On,{children:[rt("circle",{cx:"7",cy:"7",r:"2"}),rt("circle",{cx:"17",cy:"7",r:"2"}),rt("circle",{cx:"7",cy:"17",r:"2"}),rt("circle",{cx:"17",cy:"17",r:"2"})]}):me(On,{children:[rt("circle",{cx:"12",cy:"6",r:"2"}),rt("circle",{cx:"6",cy:"12",r:"2"}),rt("circle",{cx:"18",cy:"12",r:"2"}),rt("circle",{cx:"12",cy:"18",r:"2"})]})}):me("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:sn,strokeWidth:"1.5",strokeLinecap:"round",children:[rt("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),rt("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),rt("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),rt("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})}import{useCallback as nr,useEffect as go,useRef as or,useState as Go}from"react";import{Fragment as pa,jsx as Ae,jsxs as ir}from"react/jsx-runtime";var qd={position:"fixed",bottom:70,right:16,zIndex:9999,display:"flex",flexDirection:"column",gap:10},Qd=x(m({display:"flex",alignItems:"center",gap:6,padding:"4px 10px",backgroundColor:"rgba(255, 255, 255, 0.85)"},cn),{backdropFilter:"blur(32px)",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,color:"#1f2937",whiteSpace:"nowrap",transition:"transform 200ms ease, opacity 200ms ease"});function tu(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||""),i=o.data.file?String(o.data.file):null,r=i?(a=i.split("/").pop())!=null?a: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 eu(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 nu({color:t}){let[e,o]=Go(0);return go(()=>{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?ir(pa,{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"})]}):ir(pa,{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 ou({color:t}){return Ae("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:t,opacity:.6}})}function iu({color:t}){return Ae("span",{style:{color:t,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function ru(){return Ae("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function su({onDismiss:t,children:e}){let o=or(null),n=or(null),[i,r]=Go(0),[a,s]=Go(!1),l=60,c=nr(p=>{var f;n.current={startX:p.clientX,startY:p.clientY,locked:!1},(f=o.current)==null||f.setPointerCapture(p.pointerId)},[]),d=nr(p=>{let f=n.current;if(!f)return;let g=p.clientX-f.startX,b=p.clientY-f.startY;if(!f.locked){if(Math.abs(g)<4&&Math.abs(b)<4)return;if(f.locked=!0,Math.abs(b)>Math.abs(g)){n.current=null;return}}r(Math.max(0,g))},[]),u=nr(()=>{n.current&&(n.current=null,i>=l?(s(!0),setTimeout(t,200)):r(0))},[i,t]);return Ae("div",{ref:o,onPointerDown:c,onPointerMove:d,onPointerUp:u,onPointerCancel:u,style:{transform:a?"translateX(120%)":`translateX(${i}px)`,opacity:a?0:1-i/(l*3),transition:n.current?"none":"transform 200ms ease, opacity 200ms ease",touchAction:"pan-y"},children:e})}function fa({bridge:t,inFlightJobs:e,isVisible:o,onHover:n,clearSignal:i}){let[r,a]=Go([]);go(()=>{i>0&&a([])},[i]),go(()=>{a(l=>{let c=new Set(l.map(u=>u.jobId)),d=[...l];for(let[u,p]of Object.entries(e))c.has(u)||d.push({jobId:u,color:p.color,status:"queued"});return d.length!==l.length?d:l})},[e]),go(()=>{if(t.activeJobIds.length===0)return;let l=new Set(t.activeJobIds);a(c=>c.map(d=>l.has(d.jobId)&&d.status!=="done"&&d.status!=="error"?x(m({},d),{status:"working"}):d))},[t.activeJobIds]);let s=or(null);return go(()=>{let l=t.lastCompletedJobId;if(!l||l===s.current)return;s.current=l;let c=t.events.some(u=>u.type==="error"&&(u.data.jobId===l||t.status==="error")),d=c?void 0:eu(t.events,l);a(u=>u.map(p=>p.jobId===l?x(m({},p),{status:c?"error":"done",doneLabel:d}):p))},[t.lastCompletedJobId,t.events,t.status]),!o||r.length===0?null:Ae("div",{style:qd,"data-devtools":!0,onMouseEnter:()=>n(!0),onMouseLeave:()=>n(!1),children:r.map(l=>{let c=l.status==="working"?tu(t.events.filter(d=>d.data.jobId===l.jobId)):l.status==="queued"?"Queued":l.status==="done"?l.doneLabel||"Done":"Error";return Ae(su,{onDismiss:()=>a(d=>d.filter(u=>u.jobId!==l.jobId)),children:ir("div",{style:Qd,children:[l.status==="working"&&Ae(nu,{color:l.color}),l.status==="queued"&&Ae(ou,{color:l.color}),l.status==="done"&&Ae(iu,{color:l.color}),l.status==="error"&&Ae(ru,{}),Ae("span",{style:{color:l.status==="queued"?"#9ca3af":"#1f2937"},children:c})]})},l.jobId)})})}import{useCallback as Jo,useEffect as ho,useRef as sr,useState as Zn}from"react";import{Fragment as uu,jsx as xe}from"react/jsx-runtime";var ga="ui-monospace, SFMono-Regular, Menlo, monospace",au=/^#[0-9a-fA-F]{3,8}$/,lu=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,cu=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 du(t){let e=t.trim();return au.test(e)||lu.test(e)||cu.has(e.toLowerCase())}function rr(t,e){return xe("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 mo(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);du(r)&&e.push(rr(r,`sw-${i.index}`)),e.push(xe("code",{style:{fontFamily:ga,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(xe("strong",{children:xe("em",{children:i[3]})},i.index)):i[5]!==void 0?e.push(xe("strong",{children:i[5]},i.index)):i[7]!==void 0?e.push(xe("em",{children:i[7]},i.index)):i[9]!==void 0?e.push(xe("em",{children:i[9]},i.index)):i[11]!==void 0&&i[12]!==void 0?e.push(xe("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(rr(i[13],`sw-${i.index}`)),e.push(i[13])):i[14]!==void 0&&(e.push(rr(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 Vo(t){var i;let e=t.split(`
+`).map((et,y)=>it("p",{style:{margin:0,marginTop:y>0?8:0},children:et},y))}),V.usage.map((et,y)=>me("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[it("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),it("span",{children:et})]},y)),Mt==="collapse"&&N&&Object.keys(N).length>0&&(()=>{let et=Object.entries(N).filter(([,A])=>A.found&&!A.disabled).map(([A])=>A.charAt(0).toUpperCase()+A.slice(1)),y=Object.entries(N).filter(([,A])=>!A.found).map(([A])=>A);if(et.length===0&&y.length===0)return null;let R=y.map(A=>A.charAt(0).toUpperCase()+A.slice(1));return me("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8,display:"flex",alignItems:"center",gap:6,fontSize:11},children:[it("span",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:et.length>0?"#22c55e":"rgba(0,0,0,0.2)",flexShrink:0}}),et.length>0?me("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[me("span",{children:["Taste library ready in ",et.join(", "),h&&" \u2014 restart CLI to activate"]}),y.length>0&&L&&!h&&me("button",{type:"button",onClick:A=>{A.stopPropagation(),L()},style:{border:"none",background:"transparent",color:"#3b82f6",fontSize:10,fontWeight:500,fontFamily:"inherit",padding:0,cursor:"pointer",pointerEvents:"auto",textDecoration:"underline",textUnderlineOffset:2},children:["+ ",R.join(", ")]})]}):y.length>0&&L?me("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[it("span",{children:"Connect Popmelt MCP"}),it("button",{type:"button",onClick:A=>{A.stopPropagation(),L()},style:{border:"none",background:"#1f2937",color:"#fff",fontSize:10,fontWeight:600,fontFamily:"inherit",padding:"2px 8px",cursor:"pointer",pointerEvents:"auto"},children:"Connect"})]}):null]})})(),V.keys.length>1&&it("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8,display:"flex",flexDirection:"column",gap:4},children:V.keys.slice(1).map((et,y)=>me("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:et.accent?"#fff":"#6b7280"},children:[it("code",{style:{fontSize:10,backgroundColor:et.accent?t.activeColor:"rgba(0,0,0,0.06)",color:et.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:et.key}),it("span",{style:{color:et.accent?t.activeColor:void 0,fontWeight:et.accent?600:void 0},children:et.desc})]},y))})]})})(),me("div",{id:"devtools-toolbar",style:ee,onMouseMove:Qt,children:[(t.annotations.length>0||t.styleModifications.length>0)&&me(On,{children:[it("span",{onMouseEnter:()=>Pt("clear"),onMouseLeave:kt,children:it(Cn,{onClick:Ge,title:"Clear all (\u2318\u232B)",children:it(Wd,{size:17,strokeWidth:1.5})})}),it(Ki,{})]}),me("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[it("span",{onMouseEnter:()=>Pt("inspector"),onMouseLeave:kt,children:it(Cn,{active:t.isAnnotating&&t.activeTool==="inspector",siblingActive:t.isAnnotating,onClick:()=>pe("inspector"),children:it(Hd,{size:20,strokeWidth:1.5})})}),it("span",{onMouseEnter:()=>Pt("hand"),onMouseLeave:kt,children:it(Cn,{active:t.isAnnotating&&t.activeTool==="hand",siblingActive:t.isAnnotating,onClick:()=>pe("hand"),children:me("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[it(Dd,{size:20,strokeWidth:1.5}),t.styleModifications.filter(V=>!V.captured).length>0&&it("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(V=>!V.captured).length})]})})}),(()=>{let V=Fn[st],et=V.icon,y=t.isAnnotating&&jd.has(t.activeTool);return it("span",{onMouseEnter:()=>Pt(V.type),onMouseLeave:kt,children:me("div",{style:{display:"flex",alignItems:"center",gap:0},children:[it(Cn,{active:y,siblingActive:t.isAnnotating,onClick:()=>pe(V.type),children:it(et,{size:20,strokeWidth:1.5})}),it("button",{type:"button",onClick:()=>{let R=(st+1)%Fn.length;wt(R),pe(Fn[R].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&&!y?.5:1,transition:"opacity 150ms ease"},children:Fn.map((R,A)=>it("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:A===st?kn.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},A))})]})})})(),Jd.map(({type:V,icon:et,label:y,shortcut:R})=>it("span",{onMouseEnter:()=>Pt(V),onMouseLeave:kt,children:it(Cn,{active:t.isAnnotating&&t.activeTool===V,siblingActive:t.isAnnotating,onClick:()=>pe(V),children:it(et,{size:20,strokeWidth:1.5})})},V)),it("span",{onMouseEnter:()=>Pt("model"),onMouseLeave:kt,children:it(Cn,{active:t.isAnnotating&&t.activeTool==="model",siblingActive:t.isAnnotating,onClick:()=>pe("model"),children:it(Fd,{size:17,strokeWidth:1.5})})})]}),it(Ki,{}),me("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(te.length>0||t.styleModifications.length>0||t.spacingTokenChanges.filter(V=>!V.captured).length>0)&&(()=>{var A;let V=Jt!==null&&Jt<te.length?te[Jt]:null,et=t.annotations.length>0&&t.annotations.every(z=>z.status&&z.status!=="pending"),y=Jt!==null?(A=V==null?void 0:V.annotations.some(z=>z.status&&z.status!=="pending"))!=null?A:!1:et,R=`oklch(0.628 0.258 ${ce})`;return it("span",{onMouseEnter:()=>Pt("counter"),onMouseLeave:kt,children:it("button",{ref:Ze,type:"button",onClick:()=>{if(J.current){J.current=!1;return}gn()},onMouseDown:Ft,onMouseUp:Nt,onMouseLeave:Nt,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:y?"#999999":R,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:Jt!==null?Jt+1:te.length+t.styleModifications.length+t.spacingTokenChanges.filter(z=>!z.captured).length})})})(),d&&it("span",{onMouseEnter:()=>Pt("provider"),onMouseLeave:kt,style:{display:"contents"},children:me("div",{style:{display:"flex",alignItems:"center",gap:0},children:[it(Cn,{onClick:()=>d(c==="claude"?"codex":"claude"),children:c==="claude"?it(Ud,{}):it(Zd,{})}),me("button",{type:"button",onClick:()=>{let V=(p+1)%f;b==null||b(V)},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:kn.iconDefault,whiteSpace:"nowrap"},children:[it("span",{children:g}),it("span",{style:{display:"flex",flexDirection:"column",gap:2},children:Array.from({length:f},(V,et)=>it("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:et===p?kn.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},et))})]})]})}),it("div",{onMouseEnter:V=>{s==null||s(!0),V.currentTarget.style.opacity="1",Pt("collapse")},onMouseLeave:V=>{s==null||s(!1),V.currentTarget.style.opacity=r?"1":"0.3",kt()},style:{display:"inline-flex",opacity:r?1:.3,transition:"opacity 150ms ease"},children:it(Cn,{onClick:ae,title:"Collapse (\u2318\u2318)",children:r?it("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:sn,children:ct===1?me(On,{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"})]}):me(On,{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"})]})}):me("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:sn,strokeWidth:"1.5",strokeLinecap:"round",style:{transform:"rotate(45deg)"},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"})]})})})]})]})]}):me(On,{children:[it("style",{children:"@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }"}),it("div",{id:"devtools-toolbar",style:x(m({},ee),{overflow:"visible",opacity:.5,transition:"opacity 150ms ease"}),onMouseEnter:V=>V.currentTarget.style.opacity="1",onMouseLeave:V=>V.currentTarget.style.opacity="0.5",children:it("button",{type:"button",style:{display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,border:"none",background:"none",cursor:"pointer",padding:0},onClick:()=>{q(!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:r?it("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:sn,children:ct===1?me(On,{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"})]}):me(On,{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"})]})}):me("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:sn,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"})]})})})]})}import{useCallback as nr,useEffect as go,useRef as or,useState as Go}from"react";import{Fragment as pa,jsx as Pe,jsxs as ir}from"react/jsx-runtime";var qd={position:"fixed",bottom:70,right:16,zIndex:9999,display:"flex",flexDirection:"column",gap:10},Qd=x(m({display:"flex",alignItems:"center",gap:6,padding:"4px 10px",backgroundColor:"rgba(255, 255, 255, 0.85)"},cn),{backdropFilter:"blur(32px)",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,color:"#1f2937",whiteSpace:"nowrap",transition:"transform 200ms ease, opacity 200ms ease"});function tu(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||""),i=o.data.file?String(o.data.file):null,r=i?(a=i.split("/").pop())!=null?a: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 eu(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 nu({color:t}){let[e,o]=Go(0);return go(()=>{let n=setInterval(()=>{o(i=>(i+1)%2)},250);return()=>clearInterval(n)},[]),Pe("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:t,style:{verticalAlign:"middle",flexShrink:0},children:e===1?ir(pa,{children:[Pe("circle",{cx:"7",cy:"7",r:"2"}),Pe("circle",{cx:"17",cy:"7",r:"2"}),Pe("circle",{cx:"7",cy:"17",r:"2"}),Pe("circle",{cx:"17",cy:"17",r:"2"})]}):ir(pa,{children:[Pe("circle",{cx:"12",cy:"6",r:"2"}),Pe("circle",{cx:"6",cy:"12",r:"2"}),Pe("circle",{cx:"18",cy:"12",r:"2"}),Pe("circle",{cx:"12",cy:"18",r:"2"})]})})}function ou({color:t}){return Pe("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:t,opacity:.6}})}function iu({color:t}){return Pe("span",{style:{color:t,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function ru(){return Pe("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function su({onDismiss:t,children:e}){let o=or(null),n=or(null),[i,r]=Go(0),[a,s]=Go(!1),l=60,c=nr(p=>{var f;n.current={startX:p.clientX,startY:p.clientY,locked:!1},(f=o.current)==null||f.setPointerCapture(p.pointerId)},[]),d=nr(p=>{let f=n.current;if(!f)return;let g=p.clientX-f.startX,b=p.clientY-f.startY;if(!f.locked){if(Math.abs(g)<4&&Math.abs(b)<4)return;if(f.locked=!0,Math.abs(b)>Math.abs(g)){n.current=null;return}}r(Math.max(0,g))},[]),u=nr(()=>{n.current&&(n.current=null,i>=l?(s(!0),setTimeout(t,200)):r(0))},[i,t]);return Pe("div",{ref:o,onPointerDown:c,onPointerMove:d,onPointerUp:u,onPointerCancel:u,style:{transform:a?"translateX(120%)":`translateX(${i}px)`,opacity:a?0:1-i/(l*3),transition:n.current?"none":"transform 200ms ease, opacity 200ms ease",touchAction:"pan-y"},children:e})}function fa({bridge:t,inFlightJobs:e,isVisible:o,onHover:n,clearSignal:i}){let[r,a]=Go([]);go(()=>{i>0&&a([])},[i]),go(()=>{a(l=>{let c=new Set(l.map(u=>u.jobId)),d=[...l];for(let[u,p]of Object.entries(e))c.has(u)||d.push({jobId:u,color:p.color,status:"queued"});return d.length!==l.length?d:l})},[e]),go(()=>{if(t.activeJobIds.length===0)return;let l=new Set(t.activeJobIds);a(c=>c.map(d=>l.has(d.jobId)&&d.status!=="done"&&d.status!=="error"?x(m({},d),{status:"working"}):d))},[t.activeJobIds]);let s=or(null);return go(()=>{let l=t.lastCompletedJobId;if(!l||l===s.current)return;s.current=l;let c=t.events.some(u=>u.type==="error"&&(u.data.jobId===l||t.status==="error")),d=c?void 0:eu(t.events,l);a(u=>u.map(p=>p.jobId===l?x(m({},p),{status:c?"error":"done",doneLabel:d}):p))},[t.lastCompletedJobId,t.events,t.status]),!o||r.length===0?null:Pe("div",{style:qd,"data-devtools":!0,onMouseEnter:()=>n(!0),onMouseLeave:()=>n(!1),children:r.map(l=>{let c=l.status==="working"?tu(t.events.filter(d=>d.data.jobId===l.jobId)):l.status==="queued"?"Queued":l.status==="done"?l.doneLabel||"Done":"Error";return Pe(su,{onDismiss:()=>a(d=>d.filter(u=>u.jobId!==l.jobId)),children:ir("div",{style:Qd,children:[l.status==="working"&&Pe(nu,{color:l.color}),l.status==="queued"&&Pe(ou,{color:l.color}),l.status==="done"&&Pe(iu,{color:l.color}),l.status==="error"&&Pe(ru,{}),Pe("span",{style:{color:l.status==="queued"?"#9ca3af":"#1f2937"},children:c})]})},l.jobId)})})}import{useCallback as Jo,useEffect as ho,useRef as sr,useState as Zn}from"react";import{Fragment as uu,jsx as xe}from"react/jsx-runtime";var ga="ui-monospace, SFMono-Regular, Menlo, monospace",au=/^#[0-9a-fA-F]{3,8}$/,lu=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,cu=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 du(t){let e=t.trim();return au.test(e)||lu.test(e)||cu.has(e.toLowerCase())}function rr(t,e){return xe("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 mo(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);du(r)&&e.push(rr(r,`sw-${i.index}`)),e.push(xe("code",{style:{fontFamily:ga,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(xe("strong",{children:xe("em",{children:i[3]})},i.index)):i[5]!==void 0?e.push(xe("strong",{children:i[5]},i.index)):i[7]!==void 0?e.push(xe("em",{children:i[7]},i.index)):i[9]!==void 0?e.push(xe("em",{children:i[9]},i.index)):i[11]!==void 0&&i[12]!==void 0?e.push(xe("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(rr(i[13],`sw-${i.index}`)),e.push(i[13])):i[14]!==void 0&&(e.push(rr(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 Vo(t){var i;let e=t.split(`
 `),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(xe("pre",{style:{fontFamily:ga,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(`
-`)},o.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(r)){o.push(xe("hr",{style:{border:"none",borderTop:"1px solid rgba(0,0,0,0.1)",margin:"6px 0"}},o.length)),n++;continue}let a=r.match(/^(#{1,4})\s+(.+)/);if(a){let c=a[1].length,d={1:16,2:14,3:13,4:12};o.push(xe("div",{style:{fontWeight:700,fontSize:(i=d[c])!=null?i:12,margin:"8px 0 2px"},children:mo(a[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=w=>/^\|[\s\-:|]+\|$/.test(w),u=c.filter(w=>!d(w)),p=w=>w.split("|").slice(1,-1).map(M=>M.trim()),f=w=>/^\*\*.+\*\*$/.test(w)||/^__.+__$/.test(w),g=u.map(p),b=g.length>1&&g.slice(1).every(w=>w[0]&&f(w[0])),k=g.length>0&&g[0].every(w=>f(w));o.push(xe("div",{style:{overflowX:"auto",margin:"4px 0",paddingBottom:4},children:xe("table",{style:{borderCollapse:"separate",borderSpacing:0,fontSize:"0.95em",width:"max-content",minWidth:"100%"},children:xe("tbody",{children:u.map((w,M)=>xe("tr",{children:p(w).map((P,I)=>xe(M===0?"th":"td",{style:m({border:"1px solid rgba(0,0,0,0.1)",padding:"3px 6px",textAlign:"left",fontWeight:M===0?600:400,minWidth:60,whiteSpace:"nowrap"},I===0&&b||M===0&&k?x(m(m({position:"sticky"},I===0&&b?{left:0}:{}),M===0&&k?{top:0}:{}),{background:"#fff",zIndex:I===0&&b&&M===0&&k?2:1}):{}),children:mo(P)},I))},M))})})},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(xe("li",{children:mo(d[1])},c.length)),n++}o.push(xe("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(xe("li",{children:mo(d[1])},c.length)),n++}o.push(xe("ol",{style:{margin:"2px 0",paddingLeft:20},children:c},o.length));continue}if(r.trim()===""){o.push(xe("div",{style:{height:4}},o.length)),n++;continue}o.push(xe("div",{style:{margin:"2px 0"},children:mo(r)},o.length)),n++}return xe(uu,{children:o})}import{Fragment as lr,jsx as zt,jsxs as ke}from"react/jsx-runtime";var ma=x(m({position:"fixed",top:16,right:16,bottom:88,width:400,backgroundColor:"#ffffff"},cn),{boxSizing:"content-box",zIndex:1e4,display:"flex",flexDirection:"column",overflow:"hidden",fontFamily:Se,fontSize:12,color:"#1f2937"}),pu={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"4px 5px 4px 10px",margin:"3px 3px 0",fontWeight:600,fontSize:12},fu={flex:1,overflowY:"auto",padding:"8px 0",scrollbarWidth:"none"},gu=`
+`)},o.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(r)){o.push(xe("hr",{style:{border:"none",borderTop:"1px solid rgba(0,0,0,0.1)",margin:"6px 0"}},o.length)),n++;continue}let a=r.match(/^(#{1,4})\s+(.+)/);if(a){let c=a[1].length,d={1:16,2:14,3:13,4:12};o.push(xe("div",{style:{fontWeight:700,fontSize:(i=d[c])!=null?i:12,margin:"8px 0 2px"},children:mo(a[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=w=>/^\|[\s\-:|]+\|$/.test(w),u=c.filter(w=>!d(w)),p=w=>w.split("|").slice(1,-1).map(I=>I.trim()),f=w=>/^\*\*.+\*\*$/.test(w)||/^__.+__$/.test(w),g=u.map(p),b=g.length>1&&g.slice(1).every(w=>w[0]&&f(w[0])),k=g.length>0&&g[0].every(w=>f(w));o.push(xe("div",{style:{overflowX:"auto",margin:"4px 0",paddingBottom:4},children:xe("table",{style:{borderCollapse:"separate",borderSpacing:0,fontSize:"0.95em",width:"max-content",minWidth:"100%"},children:xe("tbody",{children:u.map((w,I)=>xe("tr",{children:p(w).map((N,L)=>xe(I===0?"th":"td",{style:m({border:"1px solid rgba(0,0,0,0.1)",padding:"3px 6px",textAlign:"left",fontWeight:I===0?600:400,minWidth:60,whiteSpace:"nowrap"},L===0&&b||I===0&&k?x(m(m({position:"sticky"},L===0&&b?{left:0}:{}),I===0&&k?{top:0}:{}),{background:"#fff",zIndex:L===0&&b&&I===0&&k?2:1}):{}),children:mo(N)},L))},I))})})},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(xe("li",{children:mo(d[1])},c.length)),n++}o.push(xe("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(xe("li",{children:mo(d[1])},c.length)),n++}o.push(xe("ol",{style:{margin:"2px 0",paddingLeft:20},children:c},o.length));continue}if(r.trim()===""){o.push(xe("div",{style:{height:4}},o.length)),n++;continue}o.push(xe("div",{style:{margin:"2px 0"},children:mo(r)},o.length)),n++}return xe(uu,{children:o})}import{Fragment as lr,jsx as zt,jsxs as ke}from"react/jsx-runtime";var ma=x(m({position:"fixed",top:16,right:16,bottom:88,width:400,backgroundColor:"#ffffff"},cn),{boxSizing:"content-box",zIndex:1e4,display:"flex",flexDirection:"column",overflow:"hidden",fontFamily:Se,fontSize:12,color:"#1f2937"}),pu={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"4px 5px 4px 10px",margin:"3px 3px 0",fontWeight:600,fontSize:12},fu={flex:1,overflowY:"auto",padding:"8px 0",scrollbarWidth:"none"},gu=`
 [data-devtools="thread-panel-messages"]:hover {
   scrollbar-width: thin !important;
 }
@@ -29,4 +29,4 @@ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{
   background: rgba(0,0,0,0.15);
   border-radius: 3px;
 }
-`,mu={borderTop:"1px solid rgba(0, 0, 0, 0.08)",padding:12};function ha(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 hu(t){return new Date(t).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var ar=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],yu=3e3,bu=250;function ya({size:t=14}){return zt("svg",{width:t,height:t,viewBox:"0 0 1200 1200",fill:"#6b7280",stroke:"none",style:{flexShrink:0},children:zt("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 xu({color:t}){let[e,o]=Zn(0),[n,i]=Zn(()=>Math.floor(Math.random()*ar.length));return ho(()=>{let r=setInterval(()=>o(s=>(s+1)%2),bu),a=setInterval(()=>i(s=>(s+1)%ar.length),yu);return()=>{clearInterval(r),clearInterval(a)}},[]),ke("span",{style:{display:"inline-flex",alignItems:"center",gap:4},children:[zt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:t,style:{verticalAlign:"middle",flexShrink:0},children:e===1?ke(lr,{children:[zt("circle",{cx:"7",cy:"7",r:"2"}),zt("circle",{cx:"17",cy:"7",r:"2"}),zt("circle",{cx:"7",cy:"17",r:"2"}),zt("circle",{cx:"17",cy:"17",r:"2"})]}):ke(lr,{children:[zt("circle",{cx:"12",cy:"6",r:"2"}),zt("circle",{cx:"6",cy:"12",r:"2"}),zt("circle",{cx:"18",cy:"12",r:"2"}),zt("circle",{cx:"12",cy:"18",r:"2"})]})}),zt("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:ar[n]})]})}function vu(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}}function Su(t){let e=[];for(let o of t)if(o.type==="tool_use"){let n=vu(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 ba({threadId:t,bridgeUrl:e,accentColor:o,isStreaming:n,streamingResponse:i,streamingThinking:r,streamingEvents:a,onClose:s,onReply:l,activePlan:c,planAnnotations:d,inFlightJobs:u,onViewThread:p,onApprovePlan:f,onDismissPlan:g}){var mt,St;let[b,k]=Zn([]),[w,M]=Zn(!0),[P,I]=Zn(""),[h,W]=Zn([]),it=sr(null),Y=sr(null),K=sr(n),q=Jo(()=>{fetch(`${e}/thread/${t}`).then(Z=>Z.json()).then(Z=>{var at;k((at=Z.messages)!=null?at:[]),M(!1)}).catch(()=>M(!1))},[e,t]);ho(()=>{M(!0),q()},[q]),ho(()=>{K.current&&!n&&q(),K.current=n},[n,q]);let O=a?Su(a):[];ho(()=>{it.current&&(it.current.scrollTop=it.current.scrollHeight)},[b,O.length,n]),ho(()=>{let Z=at=>{at.key==="Escape"&&(at.stopPropagation(),s())};return document.addEventListener("keydown",Z),()=>document.removeEventListener("keydown",Z)},[s]);let Q=Jo(()=>{if(!P.trim()||!l)return;let Z=P.trim(),at=h.length>0?h:void 0;k(wt=>[...wt,{role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:at?`${Z} [${at.length} image${at.length>1?"s":""}]`:Z}]),l(t,Z,at),I(""),W([])},[P,h,t,l]),U=Jo(Z=>{let at=Z.clipboardData.items,wt=[];for(let F=0;F<at.length;F++){let bt=at[F];if(bt.type.startsWith("image/")){let vt=bt.getAsFile();vt&&wt.push(vt)}}wt.length>0&&(Z.preventDefault(),W(F=>[...F,...wt]))},[]),Mt=Jo(Z=>{Z.key==="Enter"&&(Z.metaKey||Z.ctrlKey)&&(Z.preventDefault(),Q())},[Q]);return ke(lr,{children:[zt("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:s,style:{position:"fixed",inset:0,zIndex:ma.zIndex-1}}),ke("div",{ref:Y,style:ma,"data-devtools":"thread-panel",children:[ke("div",{style:x(m({},pu),{backgroundColor:o,color:"#ffffff"}),children:[zt("span",{children:"Conversation"}),zt("button",{onClick:s,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),zt("style",{dangerouslySetInnerHTML:{__html:gu}}),ke("div",{ref:it,style:fu,"data-devtools":"thread-panel-messages",children:[w&&zt("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!w&&b.length===0&&!n&&zt("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),b.map((Z,at)=>{let wt=Z.role==="human",F=wt?Z.replyToQuestion||Z.feedbackSummary||"(annotation)":ha(Z.responseText||""),bt=wt?void 0:Z.question,vt=!wt&&Z.resolutions&&Z.resolutions.length>0,Yt=!wt&&Z.toolsUsed&&Z.toolsUsed.length>0;if(!F&&!bt&&!vt)return null;let Nt=at===b.length-1;return ke("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:Nt?1:.5},children:[ke("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[!wt&&zt(ya,{size:11}),zt("span",{style:{fontWeight:600,fontSize:11,color:wt?o:"#6b7280"},children:wt?"You":"Claude Code"}),zt("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:hu(Z.timestamp)})]}),F&&zt("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:wt?F:Vo(F)}),bt&&zt("div",{style:{marginTop:F?4:0,lineHeight:1.5,wordBreak:"break-word"},children:Vo(bt)}),(Yt||vt)&&ke("div",{style:{marginTop:F||bt?6:0,padding:"4px 8px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#6b7280"},children:[Yt&&zt("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:Z.toolsUsed.map((ht,ue)=>zt("div",{children:ht},ue))}),vt&&Z.resolutions.map((ht,ue)=>{var It;let ut=(It=ht.finalScope)!=null?It:ht.inferredScope,Tt=ut?`${ut.breadth} \xB7 ${ut.target}`:null;return ke("div",{style:{marginTop:Yt?4:0},children:[zt("span",{style:{color:ht.status==="resolved"?"#10b981":"#f59e0b"},children:ht.status==="resolved"?"Done":"Needs review"}),Tt&&zt("span",{style:{marginLeft:6,padding:"1px 5px",backgroundColor:"rgba(0, 0, 0, 0.06)",fontSize:10,fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace"},children:Tt}),ht.summary?` \u2014 ${ht.summary}`:""]},ue)})]})]},`${Z.jobId}-${at}`)}),c&&d&&d.length>0&&ke("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[zt("div",{style:{fontWeight:600,fontSize:11,color:"#6b7280",marginBottom:6},children:"Plan Tasks"}),d.map(Z=>{var vt,Yt;let at=(vt=c.tasks)==null?void 0:vt.find(Nt=>Nt.id===Z.planTaskId),F=u&&Object.values(u).some(Nt=>Nt.annotationIds.includes(Z.id))?"running":(Yt=Z.status)!=null?Yt:"pending",bt=F==="resolved"?"#10b981":F==="running"?Z.color:F==="needs_review"?"#f59e0b":"#9ca3af";return ke("div",{style:{display:"flex",alignItems:"flex-start",gap:8,padding:"4px 0",cursor:Z.threadId&&p?"pointer":"default"},onClick:()=>{Z.threadId&&p&&p(Z.threadId)},children:[zt("div",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:bt,marginTop:4,flexShrink:0}}),ke("div",{style:{flex:1,fontSize:11,lineHeight:1.4},children:[zt("div",{children:(at==null?void 0:at.instruction)||Z.text||Z.planTaskId}),zt("div",{style:{color:"#9ca3af",fontSize:10},children:F})]})]},Z.id)})]}),(c==null?void 0:c.status)==="awaiting_approval"&&f&&g&&ke("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[ke("div",{style:{fontWeight:600,fontSize:12},children:[(mt=d==null?void 0:d.length)!=null?mt:0," task",((St=d==null?void 0:d.length)!=null?St:0)!==1?"s":""," planned"]}),zt("div",{style:{color:"#6b7280",fontSize:11,marginTop:2,marginBottom:8},children:"Review annotations, then approve to start workers"}),ke("div",{style:{display:"flex",gap:8},children:[zt("button",{onClick:f,style:{padding:"5px 14px",fontSize:11,fontWeight:600,fontFamily:Se,backgroundColor:"#1f2937",color:"#ffffff",border:"none",cursor:"pointer"},children:"Approve"}),zt("button",{onClick:g,style:{padding:"5px 14px",fontSize:11,fontWeight:600,fontFamily:Se,backgroundColor:"transparent",color:"#6b7280",border:"1px solid rgba(0, 0, 0, 0.1)",cursor:"pointer"},children:"Dismiss"})]})]}),n&&ke("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[ke("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[zt(ya,{size:11}),zt("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:"Claude Code"}),zt("span",{style:{marginLeft:"auto"},children:zt(xu,{color:o})})]}),O.map((Z,at)=>{if(Z.kind==="tool")return zt("div",{style:{paddingLeft:12,fontSize:11,color:"#9ca3af",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",lineHeight:1.6},children:Z.label},at);if(Z.kind==="thinking")return zt("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:Z.text},at);let wt=ha(Z.text);return wt?zt("div",{style:{paddingLeft:12,marginTop:2,marginBottom:2,lineHeight:1.5,wordBreak:"break-word"},children:Vo(wt)},at):null})]})]}),l&&ke("div",{style:mu,children:[h.length>0&&ke("div",{style:{fontSize:11,color:"#6b7280",marginBottom:4,display:"flex",alignItems:"center",gap:4},children:[ke("span",{children:[h.length," image",h.length>1?"s":""," attached"]}),zt("button",{onClick:()=>W([]),style:{background:"none",border:"none",cursor:"pointer",fontSize:11,color:"#9ca3af",padding:"0 2px"},children:"\xD7"})]}),zt("textarea",{value:P,onChange:Z=>I(Z.target.value),onKeyDown:Mt,onPaste:U,placeholder:"Reply... (Cmd+Enter to send)",style:{width:"100%",minHeight:60,padding:4,fontSize:12,fontFamily:Se,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"}}),zt("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:6},children:zt("button",{onClick:Q,disabled:!P.trim(),style:{padding:"5px 14px",fontSize:11,fontFamily:Se,fontWeight:600,backgroundColor:P.trim()?o:"rgba(0,0,0,0.1)",color:P.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:P.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}import{Fragment as Iu,jsx as yo,jsxs as Lu}from"react/jsx-runtime";var xa=wu(null),Cu="http://localhost:1111",cr="devtools-provider",dr="devtools-model",ur="devtools-open-thread-id",pr="devtools-active-plan",fr=[{id:"claude-opus-4-6",label:"Opus 4.6"},{id:"claude-sonnet-4-6",label:"Sonn 4.6"}],gr=[{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 Eu(t,e,o){let n=t==="codex"?gr:fr;return Math.min(o,(e==="codex"?gr:fr).length-1)}function Tu({children:t,enabled:e=process.env.NODE_ENV==="development",bridgeUrl:o=Cu}){var gn,ee,sn,J,nt;let[n,i]=Kr(),r=Jr(o),a=en(new Map),[s,l]=je(()=>typeof window=="undefined"?"claude":localStorage.getItem(cr)||"claude"),[c,d]=je(()=>{if(typeof window=="undefined")return 0;let y=localStorage.getItem(dr);return y&&parseInt(y,10)||0}),[u,p]=je(["claude","codex"]),[f,g]=je({}),[b,k]=je(!1);Oe(()=>{r.isConnected&&Or(o).then(y=>{if(!y)return;let L=Object.entries(y.providers).filter(([,Ct])=>Ct.available).map(([Ct])=>Ct);L.length>0&&p(L);let A={};for(let[Ct,pt]of Object.entries(y.providers))pt.mcp&&(A[Ct]=pt.mcp);g(A),Object.values(A).every(Ct=>Ct.found)&&k(!1)})},[r.isConnected,o]),Oe(()=>{if(u.length>0&&!u.includes(s)){let y=u[0];l(y),localStorage.setItem(cr,y)}},[u,s]);let w=s==="codex"?gr:fr,M=(gn=w[c])!=null?gn:w[0],P=Pe(y=>{let L=s;l(y),localStorage.setItem(cr,y);let A=Eu(L,y,c);d(A),localStorage.setItem(dr,String(A))},[s,c]),I=Pe(y=>{d(y),localStorage.setItem(dr,String(y))},[]),h=Pe(async()=>{let y=await $r(o);if(!y)return;let L={};for(let[A,_]of Object.entries(y.capabilities.providers))_.mcp&&(L[A]=_.mcp);g(L),y.results.some(A=>A.installed)&&k(!0)},[o]),[W,it]=je(new Set),[Y,K]=je(null),[q,O]=je(null),[Q,U]=je(null),[Mt,mt]=je(null);Oe(()=>{r.isConnected&&zn(o).then(y=>{y!=null&&y.components&&it(new Set(Object.keys(y.components)))})},[r.isConnected,o]);let St=Pe(async y=>{let L=[];for(let A of y)try{(await Wr(A,o)).added&&L.push(A)}catch(_){console.error("[Popmelt] Failed to add component to model:",A,_)}L.length>0&&(it(A=>{let _=new Set(A);for(let Ct of L)_.add(Ct);return _}),K(L[L.length-1]))},[o]),Z=Pe(y=>{K(y)},[]),at=Pe(()=>{zn(o).then(y=>{y!=null&&y.components&&it(new Set(Object.keys(y.components)))})},[o]),wt=Pe(async y=>{try{(await Yr(y,o)).removed&&it(A=>{let _=new Set(A);return _.delete(y),_})}catch(L){console.error("[Popmelt] Failed to remove component from model:",L)}},[o]),F=Pe((y,L)=>{i({type:"MODIFY_SPACING_TOKEN",payload:y}),i({type:"ADD_SPACING_TOKEN_CHANGE",payload:L})},[i]),bt=Pe((y,L)=>{i({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:y,originalValue:L}})},[i]),[vt,Yt]=je(0),Nt=en([]);Oe(()=>{let y=Nt.current,L=n.spacingTokenMods;Nt.current=L;let A=new Map(y.map(pt=>[pt.tokenPath,pt])),_=new Map(L.map(pt=>[pt.tokenPath,pt])),Ct=!1;for(let[pt,dt]of _){let Bt=A.get(pt);if(!(Bt&&Bt.currentValue===dt.currentValue)){Ct=!0,dt.currentValue==="__deleted__"?jr(pt,o).catch(Lt=>console.error("[Popmelt] Failed to sync token delete:",Lt)):Zo(pt,dt.currentValue,o).catch(Lt=>console.error("[Popmelt] Failed to sync token update:",Lt));for(let Lt of dt.targets){let Ht=document.querySelector(Lt.selector);if(Ht)if(dt.currentValue==="__deleted__")Ht.style.removeProperty(Lt.property);else{let xt=dt.currentPx;xt>0&&Ht.style.setProperty(Lt.property,`${xt}px`,"important")}}}}for(let[pt,dt]of A)if(!_.has(pt)){Ct=!0,Zo(pt,dt.originalValue,o).catch(Bt=>console.error("[Popmelt] Failed to restore token on undo:",Bt));for(let Bt of dt.targets){let Lt=document.querySelector(Bt.selector);Lt&&Lt.style.removeProperty(Bt.property)}}Ct&&Yt(pt=>pt+1)},[n.spacingTokenMods,o]);let[ht,ue]=je(()=>typeof window=="undefined"?null:localStorage.getItem(ur)||null),[ut,Tt]=je(()=>{if(typeof window=="undefined")return null;try{let y=localStorage.getItem(pr);return y?JSON.parse(y):null}catch(y){return null}});Oe(()=>{ht?localStorage.setItem(ur,ht):localStorage.removeItem(ur)},[ht]),Oe(()=>{ut?localStorage.setItem(pr,JSON.stringify(ut)):localStorage.removeItem(pr)},[ut]);let[It,be]=je({}),oe=en(!1);Oe(()=>{if(oe.current||n.annotations.length===0)return;oe.current=!0;let y=new Set;for(let A of Object.values(It))for(let _ of A.annotationIds)y.add(_);let L=n.annotations.filter(A=>y.has(A.id)?!1:!!(A.status==="in_flight"||(A.status==="pending"||!A.status)&&(A.captured||A.threadId))).map(A=>A.id);L.length>0&&i({type:"SET_ANNOTATION_STATUS",payload:{ids:L,status:"dismissed"}}),ut&&(ut.status==="planning"||ut.status==="executing"||ut.status==="reviewing")&&Object.keys(It).length===0&&Tt(null)},[n.annotations,It,i,ut]);let he=qn(()=>{let y=new Set;for(let L of Object.values(It))for(let A of L.annotationIds)y.add(A);return y},[It]),G=qn(()=>{let y=new Set;for(let L of Object.values(It))for(let A of L.styleSelectors)y.add(A);return y},[It]),gt=qn(()=>{let y=new Map;for(let L of Object.values(It)){for(let A of L.styleSelectors)y.set(A,L.color);for(let A of L.annotationIds){let _=n.annotations.find(Ct=>Ct.id===A);if(_&&(_.linkedSelector&&y.set(_.linkedSelector,L.color),_.groupId))for(let Ct of n.annotations)Ct.groupId===_.groupId&&Ct.linkedSelector&&y.set(Ct.linkedSelector,L.color)}}return y},[It,n.annotations]),lt=en(n.annotations);lt.current=n.annotations;let Rt=en(n.styleModifications);Rt.current=n.styleModifications;let _t=en(It);_t.current=It,Oe(()=>{let y=null,L=()=>{var Bt,Lt;if(Object.keys(_t.current).length>0)return;let _=lt.current,Ct=Rt.current,pt=[],dt=[];for(let Ht of _){if(!Ht.linkedSelector||!Ht.linkedSelector.startsWith("[data-pm=")||Ht.captured||Ht.status&&Ht.status!=="pending")continue;let xt=document.querySelector(Ht.linkedSelector);!xt&&((Lt=(Bt=Ht.elements)==null?void 0:Bt[0])!=null&&Lt.selector)&&(xt=document.querySelector(Ht.elements[0].selector)),xt||pt.push(Ht.linkedSelector)}for(let Ht of Ct)document.querySelector(Ht.selector)||dt.push(Ht.selector);(pt.length>0||dt.length>0)&&i({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:pt,styleSelectors:dt}})},A=new MutationObserver(_=>{_.some(Ct=>Ct.removedNodes.length>0)&&(y&&clearTimeout(y),y=setTimeout(L,3e3))});return A.observe(document.body,{childList:!0,subtree:!0}),()=>{A.disconnect(),y&&clearTimeout(y)}},[i]),Oe(()=>{r.lastCompletedJobId&&r.lastCompletedJobId in It&&be(y=>{var _;let Ct=y,{[_=r.lastCompletedJobId]:L}=Ct;return So(Ct,[vo(_)])})},[r.lastCompletedJobId]);let At=en(new Set);Oe(()=>{let y=r.events.filter(L=>L.type==="done"&&L.data.resolutions);for(let L of y){let A=L.data.jobId;At.current.has(A)||(At.current.add(A),Array.isArray(L.data.resolutions)&&i({type:"APPLY_RESOLUTIONS",payload:{resolutions:L.data.resolutions,threadId:L.data.threadId}}))}},[r.events,i]);let kt=en(0);Oe(()=>{let y=r.incrementalResolutions;if(y.length<=kt.current)return;let L=y.slice(kt.current);kt.current=y.length,i({type:"APPLY_RESOLUTIONS",payload:{resolutions:L}})},[r.incrementalResolutions,i]),Oe(()=>{r.incrementalResolutions.length===0&&(kt.current=0)},[r.incrementalResolutions.length]);let Qt=en(r.status);Oe(()=>{let y=Qt.current;Qt.current=r.status,y==="disconnected"&&r.status==="idle"&&be({})},[r.status]);let Dt=Pe(async()=>{let y=document.getElementById("devtools-canvas");if(!y)return!1;let L=await mi(document.body,y,n.annotations);if(L.length===0)return!1;let A=await ds(L,n.annotations,n.styleModifications);return A&&i({type:"MARK_CAPTURED"}),A},[n.annotations,n.styleModifications,i]),Ce=Pe(async y=>{var L;try{let A=n.annotations.filter(qt=>{var le;return((le=qt.status)!=null?le:"pending")==="pending"}),_=await Oo(document.body,A);if(!_)return!1;let Ct=ls(),pt=n.styleModifications.filter(qt=>!qt.captured),dt=(L=n.inspectedElement)==null?void 0:L.info,Lt=A.length>0||pt.length>0||!!dt?JSON.stringify(No(A,pt,dt)):void 0,{planId:Ht,threadId:xt}=await Dr(_,y,o,s,M.id,window.location.href,{width:window.innerWidth,height:window.innerHeight},Ct,Lt);if(Tt({planId:Ht,threadId:xt,goal:y,status:"planning"}),xt){let qt=n.annotations.filter(le=>{var nn;return le.type==="text"&&((nn=le.status)!=null?nn:"pending")==="pending"}).map(le=>le.id);qt.length>0&&i({type:"SET_ANNOTATION_THREAD",payload:{ids:qt,threadId:xt}})}return i({type:"MARK_CAPTURED"}),xt&&ue(xt),!0}catch(A){return console.error("[Pare] Failed to send plan:",A),!1}},[o,s,M.id,n.annotations,n.styleModifications,n.inspectedElement,i]),re=Pe(async y=>{let L=ut==null?void 0:ut.planId;if(!L)return;let A=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),_=A!=null&&A[1]?parseFloat(A[1]):29,Ct=y.length>1?360/y.length:0;for(let pt=0;pt<y.length;pt++){let dt=y[pt],Bt=(_+pt*Ct)%360,Lt=`oklch(0.628 0.258 ${Math.round(Bt)})`,Ht=dt.region.y+dt.region.height/2,xt=window.innerHeight;(Ht<window.scrollY||Ht>window.scrollY+xt)&&(window.scrollTo({top:Math.max(0,Ht-xt/2),behavior:"instant"}),await new Promise(fn=>requestAnimationFrame(()=>requestAnimationFrame(()=>fn()))));let qt=ri(dt.region),le=Math.random().toString(36).substring(2,9),nn=qt?{x:qt.rect.left+window.scrollX,y:qt.rect.top+window.scrollY,width:qt.rect.width,height:qt.rect.height}:dt.region;i({type:"ADD_PLAN_ANNOTATION",payload:{groupId:le,planId:L,planTaskId:dt.id,instruction:dt.instruction,region:nn,color:Lt,linkedSelector:qt==null?void 0:qt.selector,elements:qt?[qt.info]:void 0}}),pt<y.length-1&&await new Promise(fn=>setTimeout(fn,200))}},[ut==null?void 0:ut.planId,n.activeColor,i]),pe=Pe((y,L)=>{let A=a.current.get(y)||[];a.current.set(y,[...A,...L])},[]),Ut=Pe(async()=>{let y=document.getElementById("devtools-canvas");if(!y)return!1;let L=n.annotations.filter(Lt=>{var Ht;return((Ht=Lt.status)!=null?Ht:"pending")==="pending"}),A=n.spacingTokenChanges.filter(Lt=>!Lt.captured);if(L.length===0&&n.styleModifications.filter(Lt=>!Lt.captured).length===0&&A.length===0)return!1;let _=await mi(document.body,y,n.annotations);if(_.length===0)return!1;let Ct=await Bo(_);if(!Ct)return!1;let pt=No(L,n.styleModifications,void 0,A.length>0?A:void 0),dt=JSON.stringify(pt),Bt=new Map;for(let Lt of L){let Ht=a.current.get(Lt.id);if(Ht&&Ht.length>0&&Bt.set(Lt.id,Ht),Lt.groupId){for(let xt of L)if(xt.groupId===Lt.groupId&&xt.id!==Lt.id){let qt=a.current.get(xt.id);qt&&qt.length>0&&Bt.set(xt.id,qt)}}}try{let Lt=gi(n.activeColor),{jobId:Ht,threadId:xt}=await Fr(Ct,dt,o,Lt,s,M.id,Bt.size>0?Bt:void 0);for(let Je of Bt.keys())a.current.delete(Je);let qt=L.map(Je=>Je.id),le=n.styleModifications.filter(Je=>!Je.captured).map(Je=>Je.selector);be(Je=>x(m({},Je),{[Ht]:{annotationIds:qt,styleSelectors:le,color:n.activeColor,threadId:xt}})),i({type:"MARK_CAPTURED"}),xt&&qt.length>0&&i({type:"SET_ANNOTATION_THREAD",payload:{ids:qt,threadId:xt}});let nn=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),mn=((nn!=null&&nn[1]?parseFloat(nn[1]):29)+60)%360;return i({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${mn})`}),!0}catch(Lt){return console.error("[Pare] Failed to send to bridge:",Lt),!1}},[n.annotations,n.styleModifications,n.spacingTokenChanges,n.activeColor,i,o,s,M.id]),Ee=Pe(async(y,L,A)=>{try{let _=gi(n.activeColor),{jobId:Ct}=await Gr(y,L,o,_,s,M.id,A);be(dt=>x(m({},dt),{[Ct]:{annotationIds:[],styleSelectors:[],color:n.activeColor,threadId:y}}));let pt=n.annotations.filter(dt=>dt.threadId===y&&(dt.status==="waiting_input"||dt.status==="resolved"||dt.status==="needs_review"));pt.length>0&&(i({type:"SET_ANNOTATION_STATUS",payload:{ids:pt.map(dt=>dt.id),status:"in_flight"}}),be(dt=>{let Bt=dt[Ct];return Bt?x(m({},dt),{[Ct]:x(m({},Bt),{annotationIds:[...Bt.annotationIds,...pt.map(Lt=>Lt.id)]})}):dt})),r.dismissQuestion(y)}catch(_){console.error("[Pare] Failed to send reply:",_)}},[n.activeColor,n.annotations,o,r.dismissQuestion,i,s,M.id]),ae=Pe(async()=>{if(!(!ut||!ut.planId))try{await Hr(ut.planId,o),Tt(dt=>dt?x(m({},dt),{status:"executing"}):null);let y=await Oo(document.body);if(!y)return;let L=n.annotations.filter(dt=>{var Bt;return dt.planId===ut.planId&&dt.type!=="text"&&((Bt=dt.status)!=null?Bt:"pending")==="pending"}),A=L.map(dt=>{var fn,mn,Je;let Bt=dt.groupId?n.annotations.find(En=>En.groupId===dt.groupId&&En.type==="text"):void 0,Lt=(fn=dt.points[0])!=null?fn:{x:0,y:0},Ht=(mn=dt.points[1])!=null?mn:Lt,xt=Math.min(Lt.x,Ht.x),qt=Math.min(Lt.y,Ht.y),le=Math.abs(Ht.x-Lt.x)||100,nn=Math.abs(Ht.y-Lt.y)||100;return{planTaskId:dt.planTaskId||dt.id,annotationId:dt.id,instruction:(Bt==null?void 0:Bt.text)||dt.text||"No instruction",region:{x:xt,y:qt,width:le,height:nn},linkedSelector:dt.linkedSelector,elements:(Je=dt.elements)==null?void 0:Je.map(En=>({selector:En.selector,reactComponent:En.reactComponent}))}});if(A.length===0)return;let{jobId:_}=await _r(y,ut.planId,A,o,s,M.id),Ct=[],pt=new Set;for(let dt of L)if(pt.has(dt.id)||(pt.add(dt.id),Ct.push(dt.id)),dt.groupId)for(let Bt of n.annotations)Bt.groupId===dt.groupId&&!pt.has(Bt.id)&&(pt.add(Bt.id),Ct.push(Bt.id));be(dt=>x(m({},dt),{[_]:{annotationIds:Ct,styleSelectors:[],color:n.activeColor,planId:ut.planId}})),i({type:"SET_ANNOTATION_STATUS",payload:{ids:Ct,status:"in_flight"}}),i({type:"MARK_CAPTURED"})}catch(y){console.error("[Pare] Failed to approve plan:",y)}},[ut,n.annotations,n.activeColor,o,s,M.id,i]),Ge=Pe(()=>{if(Tt(null),ut!=null&&ut.planId){let y=n.annotations.filter(L=>L.planId===ut.planId);for(let L of y)i({type:"DELETE_ANNOTATION",payload:{id:L.id}})}},[ut,n.annotations,i]),ce=en(new Set);Oe(()=>{for(let y of r.pendingQuestions){if(ce.current.has(y.jobId))continue;ce.current.add(y.jobId);let L=y.annotationIds&&y.annotationIds.length>0?y.annotationIds:void 0;!L&&y.threadId&&(L=n.annotations.filter(A=>A.threadId===y.threadId).map(A=>A.id)),L&&L.length>0&&i({type:"SET_ANNOTATION_QUESTION",payload:{ids:L,question:y.question,threadId:y.threadId}})}},[r.pendingQuestions,i,n.annotations]);let Ve=en(new Set),ve=en(null);Oe(()=>{for(let y of r.pendingPlans){if(Ve.current.has(y.planId))continue;Ve.current.add(y.planId);let L=y.tasks.length===1;Tt(A=>(A==null?void 0:A.planId)!==y.planId?A:x(m({},A),{tasks:y.tasks,threadId:y.threadId,status:L?"executing":"awaiting_approval"})),re(y.tasks).then(()=>{L&&(ve.current=y.planId)}),r.dismissPlan(y.planId)}},[r.pendingPlans]),Oe(()=>{!ve.current||!ut||ut.planId!==ve.current||n.annotations.filter(L=>L.planId===ut.planId&&L.type!=="text").length===0||(ve.current=null,ae())},[ut,n.annotations,ae]),Oe(()=>{for(let y of r.planReviews)!ut||ut.planId!==y.planId||y.verdict==="pass"&&Tt(L=>L?x(m({},L),{status:"done"}):null)},[r.planReviews,ut]);let Ze=en(new Set);Oe(()=>{!ut||ut.status!=="executing"||Ze.current.has(ut.planId)||Object.entries(It).filter(([A,_])=>_.planId===ut.planId).length>0||n.annotations.filter(A=>A.planId===ut.planId&&(A.status==="resolved"||A.status==="needs_review")).length===0||(Ze.current.add(ut.planId),(async()=>{try{Tt(_=>_?x(m({},_),{status:"reviewing"}):null);let A=await Oo(document.body);if(!A)return;await zr(ut.planId,A,o,s,M.id)}catch(A){console.error("[Pare] Failed to trigger review:",A)}})())},[ut,It,n.annotations,o,s,M.id]);let ze=qn(()=>{if(r.activeJobId&&r.activeJobId in It)return It[r.activeJobId].color;let y=Object.values(It);return y.length>0?y[y.length-1].color:void 0},[r.activeJobId,It]),ye=Pe(y=>{ue(y)},[]),qe=qn(()=>{if(!ht)return null;for(let[y,L]of Object.entries(It))if(L.threadId===ht)return y;return null},[ht,It]),[X,Ft]=je(!1),[Pt,Qe]=je(0),te=en(null),Vt=Pe(y=>{y?(te.current&&(clearTimeout(te.current),te.current=null),Ft(!0)):te.current=setTimeout(()=>{Ft(!1),te.current=null},150)},[]),Fe=Pe(()=>{Qe(y=>y+1),r.clearEvents()},[r.clearEvents]);Oe(()=>()=>{te.current&&clearTimeout(te.current)},[]);let Ne=qn(()=>({isEnabled:e}),[e]);return e?Lu(xa.Provider,{value:Ne,children:[t,yo(Us,{state:n,dispatch:i,onScreenshot:Dt,inFlightAnnotationIds:he,inFlightStyleSelectors:G,inFlightSelectorColors:gt,onAttachImages:pe,onReply:r.isConnected?Ee:void 0,onViewThread:r.isConnected?ye:void 0,activePlan:ut,onModelComponentsAdd:r.isConnected?St:void 0,onModelComponentFocus:r.isConnected?Z:void 0,onModelComponentHover:O,modelComponentNames:W,modelPanelHoveredComponent:Q,modelSpacingTokenHover:Mt}),yo(ua,{state:n,dispatch:i,onScreenshot:Dt,onSendToClaude:r.isConnected?Ut:void 0,onPlanGoal:r.isConnected?Ce:void 0,hasActiveJobs:Object.keys(It).length>0||r.activeJobIds.length>0,activeJobColor:ze,onCrosshairHover:Vt,onClear:Fe,provider:s,onProviderChange:r.isConnected&&u.length>1?P:void 0,availableProviders:u,modelIndex:c,modelCount:w.length,modelLabel:M.label,onModelChange:r.isConnected?I:void 0,onViewThread:r.isConnected?ye:void 0,isThreadPanelOpen:ht!==null,activePlan:ut,mcpStatus:f,onInstallMcp:r.isConnected?h:void 0,mcpJustInstalled:b,bridgeUrl:o,modelSelectedComponent:Y,modelCanvasHoveredComponent:q,onModelComponentHover:U,onSpacingTokenHover:mt,onModifySpacingToken:r.isConnected?F:void 0,onDeleteSpacingToken:r.isConnected?bt:void 0,modelRefreshKey:vt,onModelComponentAdded:at,onModelComponentRemoved:wt}),ht&&r.isConnected&&yo(ba,{threadId:ht,bridgeUrl:o,accentColor:(sn=(ee=n.annotations.find(y=>y.threadId===ht))==null?void 0:ee.color)!=null?sn:n.activeColor,isStreaming:qe!==null,streamingResponse:qe&&(J=r.jobResponses[qe])!=null?J:"",streamingThinking:qe&&(nt=r.jobThinking[qe])!=null?nt:"",streamingEvents:qe?r.events.filter(y=>y.data.jobId===qe):[],onClose:()=>ue(null),onReply:Ee,activePlan:ut,planAnnotations:ut?n.annotations.filter(y=>y.planId===ut.planId&&y.type!=="text"):void 0,inFlightJobs:It,onViewThread:ye,onApprovePlan:(ut==null?void 0:ut.status)==="awaiting_approval"?ae:void 0,onDismissPlan:(ut==null?void 0:ut.status)==="awaiting_approval"?Ge:void 0}),r.isConnected&&yo(fa,{bridge:r,bridgeUrl:o,inFlightJobs:It,isVisible:X||r.lastResponseText!==null||r.activeJobIds.length>0,onHover:Vt,clearSignal:Pt,onReply:Ee})]}):yo(Iu,{children:t})}function Mu(){let t=ku(xa);if(!t)throw new Error("usePopmelt must be used within PopmeltProvider");return t}export{Tu as PopmeltProvider,Mu as usePopmelt};
+`,mu={borderTop:"1px solid rgba(0, 0, 0, 0.08)",padding:12};function ha(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 hu(t){return new Date(t).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var ar=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],yu=3e3,bu=250;function ya({size:t=14}){return zt("svg",{width:t,height:t,viewBox:"0 0 1200 1200",fill:"#6b7280",stroke:"none",style:{flexShrink:0},children:zt("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 xu({color:t}){let[e,o]=Zn(0),[n,i]=Zn(()=>Math.floor(Math.random()*ar.length));return ho(()=>{let r=setInterval(()=>o(s=>(s+1)%2),bu),a=setInterval(()=>i(s=>(s+1)%ar.length),yu);return()=>{clearInterval(r),clearInterval(a)}},[]),ke("span",{style:{display:"inline-flex",alignItems:"center",gap:4},children:[zt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:t,style:{verticalAlign:"middle",flexShrink:0},children:e===1?ke(lr,{children:[zt("circle",{cx:"7",cy:"7",r:"2"}),zt("circle",{cx:"17",cy:"7",r:"2"}),zt("circle",{cx:"7",cy:"17",r:"2"}),zt("circle",{cx:"17",cy:"17",r:"2"})]}):ke(lr,{children:[zt("circle",{cx:"12",cy:"6",r:"2"}),zt("circle",{cx:"6",cy:"12",r:"2"}),zt("circle",{cx:"18",cy:"12",r:"2"}),zt("circle",{cx:"12",cy:"18",r:"2"})]})}),zt("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:ar[n]})]})}function vu(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}}function Su(t){let e=[];for(let o of t)if(o.type==="tool_use"){let n=vu(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 ba({threadId:t,bridgeUrl:e,accentColor:o,isStreaming:n,streamingResponse:i,streamingThinking:r,streamingEvents:a,onClose:s,onReply:l,activePlan:c,planAnnotations:d,inFlightJobs:u,onViewThread:p,onApprovePlan:f,onDismissPlan:g}){var mt,St;let[b,k]=Zn([]),[w,I]=Zn(!0),[N,L]=Zn(""),[h,Y]=Zn([]),ot=sr(null),j=sr(null),U=sr(n),Q=Jo(()=>{fetch(`${e}/thread/${t}`).then(q=>q.json()).then(q=>{var st;k((st=q.messages)!=null?st:[]),I(!1)}).catch(()=>I(!1))},[e,t]);ho(()=>{I(!0),Q()},[Q]),ho(()=>{U.current&&!n&&Q(),U.current=n},[n,Q]);let O=a?Su(a):[];ho(()=>{ot.current&&(ot.current.scrollTop=ot.current.scrollHeight)},[b,O.length,n]),ho(()=>{let q=st=>{st.key==="Escape"&&(st.stopPropagation(),s())};return document.addEventListener("keydown",q),()=>document.removeEventListener("keydown",q)},[s]);let tt=Jo(()=>{if(!N.trim()||!l)return;let q=N.trim(),st=h.length>0?h:void 0;k(wt=>[...wt,{role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:st?`${q} [${st.length} image${st.length>1?"s":""}]`:q}]),l(t,q,st),L(""),Y([])},[N,h,t,l]),Z=Jo(q=>{let st=q.clipboardData.items,wt=[];for(let F=0;F<st.length;F++){let bt=st[F];if(bt.type.startsWith("image/")){let vt=bt.getAsFile();vt&&wt.push(vt)}}wt.length>0&&(q.preventDefault(),Y(F=>[...F,...wt]))},[]),It=Jo(q=>{q.key==="Enter"&&(q.metaKey||q.ctrlKey)&&(q.preventDefault(),tt())},[tt]);return ke(lr,{children:[zt("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:s,style:{position:"fixed",inset:0,zIndex:ma.zIndex-1}}),ke("div",{ref:j,style:ma,"data-devtools":"thread-panel",children:[ke("div",{style:x(m({},pu),{backgroundColor:o,color:"#ffffff"}),children:[zt("span",{children:"Conversation"}),zt("button",{onClick:s,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),zt("style",{dangerouslySetInnerHTML:{__html:gu}}),ke("div",{ref:ot,style:fu,"data-devtools":"thread-panel-messages",children:[w&&zt("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!w&&b.length===0&&!n&&zt("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),b.map((q,st)=>{let wt=q.role==="human",F=wt?q.replyToQuestion||q.feedbackSummary||"(annotation)":ha(q.responseText||""),bt=wt?void 0:q.question,vt=!wt&&q.resolutions&&q.resolutions.length>0,Yt=!wt&&q.toolsUsed&&q.toolsUsed.length>0;if(!F&&!bt&&!vt)return null;let Bt=st===b.length-1;return ke("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:Bt?1:.5},children:[ke("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[!wt&&zt(ya,{size:11}),zt("span",{style:{fontWeight:600,fontSize:11,color:wt?o:"#6b7280"},children:wt?"You":"Claude Code"}),zt("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:hu(q.timestamp)})]}),F&&zt("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:wt?F:Vo(F)}),bt&&zt("div",{style:{marginTop:F?4:0,lineHeight:1.5,wordBreak:"break-word"},children:Vo(bt)}),(Yt||vt)&&ke("div",{style:{marginTop:F||bt?6:0,padding:"4px 8px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#6b7280"},children:[Yt&&zt("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:q.toolsUsed.map((ht,ue)=>zt("div",{children:ht},ue))}),vt&&q.resolutions.map((ht,ue)=>{var Lt;let ct=(Lt=ht.finalScope)!=null?Lt:ht.inferredScope,Mt=ct?`${ct.breadth} \xB7 ${ct.target}`:null;return ke("div",{style:{marginTop:Yt?4:0},children:[zt("span",{style:{color:ht.status==="resolved"?"#10b981":"#f59e0b"},children:ht.status==="resolved"?"Done":"Needs review"}),Mt&&zt("span",{style:{marginLeft:6,padding:"1px 5px",backgroundColor:"rgba(0, 0, 0, 0.06)",fontSize:10,fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace"},children:Mt}),ht.summary?` \u2014 ${ht.summary}`:""]},ue)})]})]},`${q.jobId}-${st}`)}),c&&d&&d.length>0&&ke("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[zt("div",{style:{fontWeight:600,fontSize:11,color:"#6b7280",marginBottom:6},children:"Plan Tasks"}),d.map(q=>{var vt,Yt;let st=(vt=c.tasks)==null?void 0:vt.find(Bt=>Bt.id===q.planTaskId),F=u&&Object.values(u).some(Bt=>Bt.annotationIds.includes(q.id))?"running":(Yt=q.status)!=null?Yt:"pending",bt=F==="resolved"?"#10b981":F==="running"?q.color:F==="needs_review"?"#f59e0b":"#9ca3af";return ke("div",{style:{display:"flex",alignItems:"flex-start",gap:8,padding:"4px 0",cursor:q.threadId&&p?"pointer":"default"},onClick:()=>{q.threadId&&p&&p(q.threadId)},children:[zt("div",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:bt,marginTop:4,flexShrink:0}}),ke("div",{style:{flex:1,fontSize:11,lineHeight:1.4},children:[zt("div",{children:(st==null?void 0:st.instruction)||q.text||q.planTaskId}),zt("div",{style:{color:"#9ca3af",fontSize:10},children:F})]})]},q.id)})]}),(c==null?void 0:c.status)==="awaiting_approval"&&f&&g&&ke("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[ke("div",{style:{fontWeight:600,fontSize:12},children:[(mt=d==null?void 0:d.length)!=null?mt:0," task",((St=d==null?void 0:d.length)!=null?St:0)!==1?"s":""," planned"]}),zt("div",{style:{color:"#6b7280",fontSize:11,marginTop:2,marginBottom:8},children:"Review annotations, then approve to start workers"}),ke("div",{style:{display:"flex",gap:8},children:[zt("button",{onClick:f,style:{padding:"5px 14px",fontSize:11,fontWeight:600,fontFamily:Se,backgroundColor:"#1f2937",color:"#ffffff",border:"none",cursor:"pointer"},children:"Approve"}),zt("button",{onClick:g,style:{padding:"5px 14px",fontSize:11,fontWeight:600,fontFamily:Se,backgroundColor:"transparent",color:"#6b7280",border:"1px solid rgba(0, 0, 0, 0.1)",cursor:"pointer"},children:"Dismiss"})]})]}),n&&ke("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[ke("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[zt(ya,{size:11}),zt("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:"Claude Code"}),zt("span",{style:{marginLeft:"auto"},children:zt(xu,{color:o})})]}),O.map((q,st)=>{if(q.kind==="tool")return zt("div",{style:{paddingLeft:12,fontSize:11,color:"#9ca3af",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",lineHeight:1.6},children:q.label},st);if(q.kind==="thinking")return zt("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:q.text},st);let wt=ha(q.text);return wt?zt("div",{style:{paddingLeft:12,marginTop:2,marginBottom:2,lineHeight:1.5,wordBreak:"break-word"},children:Vo(wt)},st):null})]})]}),l&&ke("div",{style:mu,children:[h.length>0&&ke("div",{style:{fontSize:11,color:"#6b7280",marginBottom:4,display:"flex",alignItems:"center",gap:4},children:[ke("span",{children:[h.length," image",h.length>1?"s":""," attached"]}),zt("button",{onClick:()=>Y([]),style:{background:"none",border:"none",cursor:"pointer",fontSize:11,color:"#9ca3af",padding:"0 2px"},children:"\xD7"})]}),zt("textarea",{value:N,onChange:q=>L(q.target.value),onKeyDown:It,onPaste:Z,placeholder:"Reply... (Cmd+Enter to send)",style:{width:"100%",minHeight:60,padding:4,fontSize:12,fontFamily:Se,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"}}),zt("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:6},children:zt("button",{onClick:tt,disabled:!N.trim(),style:{padding:"5px 14px",fontSize:11,fontFamily:Se,fontWeight:600,backgroundColor:N.trim()?o:"rgba(0,0,0,0.1)",color:N.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:N.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}import{Fragment as Iu,jsx as yo,jsxs as Lu}from"react/jsx-runtime";var xa=wu(null),Cu="http://localhost:1111",cr="devtools-provider",dr="devtools-model",ur="devtools-open-thread-id",pr="devtools-active-plan",fr=[{id:"claude-opus-4-6",label:"Opus 4.6"},{id:"claude-sonnet-4-6",label:"Sonn 4.6"}],gr=[{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 Eu(t,e,o){let n=t==="codex"?gr:fr;return Math.min(o,(e==="codex"?gr:fr).length-1)}function Tu({children:t,enabled:e=process.env.NODE_ENV==="development",bridgeUrl:o=Cu}){var gn,ee,sn,V,et;let[n,i]=Kr(),r=Jr(o),a=en(new Map),[s,l]=je(()=>typeof window=="undefined"?"claude":localStorage.getItem(cr)||"claude"),[c,d]=je(()=>{if(typeof window=="undefined")return 0;let y=localStorage.getItem(dr);return y&&parseInt(y,10)||0}),[u,p]=je(["claude","codex"]),[f,g]=je({}),[b,k]=je(!1);Fe(()=>{r.isConnected&&Or(o).then(y=>{if(!y)return;let R=Object.entries(y.providers).filter(([,Ct])=>Ct.available).map(([Ct])=>Ct);R.length>0&&p(R);let A={};for(let[Ct,dt]of Object.entries(y.providers))dt.mcp&&(A[Ct]=dt.mcp);g(A),Object.values(A).every(Ct=>Ct.found)&&k(!1)})},[r.isConnected,o]),Fe(()=>{if(u.length>0&&!u.includes(s)){let y=u[0];l(y),localStorage.setItem(cr,y)}},[u,s]);let w=s==="codex"?gr:fr,I=(gn=w[c])!=null?gn:w[0],N=Ne(y=>{let R=s;l(y),localStorage.setItem(cr,y);let A=Eu(R,y,c);d(A),localStorage.setItem(dr,String(A))},[s,c]),L=Ne(y=>{d(y),localStorage.setItem(dr,String(y))},[]),h=Ne(async()=>{let y=await $r(o);if(!y)return;let R={};for(let[A,z]of Object.entries(y.capabilities.providers))z.mcp&&(R[A]=z.mcp);g(R),y.results.some(A=>A.installed)&&k(!0)},[o]),[Y,ot]=je(new Set),[j,U]=je(null),[Q,O]=je(null),[tt,Z]=je(null),[It,mt]=je(null);Fe(()=>{r.isConnected&&zn(o).then(y=>{y!=null&&y.components&&ot(new Set(Object.keys(y.components)))})},[r.isConnected,o]);let St=Ne(async y=>{let R=[];for(let A of y)try{(await Wr(A,o)).added&&R.push(A)}catch(z){console.error("[Popmelt] Failed to add component to model:",A,z)}R.length>0&&(ot(A=>{let z=new Set(A);for(let Ct of R)z.add(Ct);return z}),U(R[R.length-1]))},[o]),q=Ne(y=>{U(y)},[]),st=Ne(()=>{zn(o).then(y=>{y!=null&&y.components&&ot(new Set(Object.keys(y.components)))})},[o]),wt=Ne(async y=>{try{(await Yr(y,o)).removed&&ot(A=>{let z=new Set(A);return z.delete(y),z})}catch(R){console.error("[Popmelt] Failed to remove component from model:",R)}},[o]),F=Ne((y,R)=>{i({type:"MODIFY_SPACING_TOKEN",payload:y}),i({type:"ADD_SPACING_TOKEN_CHANGE",payload:R})},[i]),bt=Ne((y,R)=>{i({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:y,originalValue:R}})},[i]),[vt,Yt]=je(0),Bt=en([]);Fe(()=>{let y=Bt.current,R=n.spacingTokenMods;Bt.current=R;let A=new Map(y.map(dt=>[dt.tokenPath,dt])),z=new Map(R.map(dt=>[dt.tokenPath,dt])),Ct=!1;for(let[dt,lt]of z){let Ot=A.get(dt);if(!(Ot&&Ot.currentValue===lt.currentValue)){Ct=!0,lt.currentValue==="__deleted__"?jr(dt,o).catch(Rt=>console.error("[Popmelt] Failed to sync token delete:",Rt)):Zo(dt,lt.currentValue,o).catch(Rt=>console.error("[Popmelt] Failed to sync token update:",Rt));for(let Rt of lt.targets){let Ht=document.querySelector(Rt.selector);if(Ht)if(lt.currentValue==="__deleted__")Ht.style.removeProperty(Rt.property);else{let xt=lt.currentPx;xt>0&&Ht.style.setProperty(Rt.property,`${xt}px`,"important")}}}}for(let[dt,lt]of A)if(!z.has(dt)){Ct=!0,Zo(dt,lt.originalValue,o).catch(Ot=>console.error("[Popmelt] Failed to restore token on undo:",Ot));for(let Ot of lt.targets){let Rt=document.querySelector(Ot.selector);Rt&&Rt.style.removeProperty(Ot.property)}}Ct&&Yt(dt=>dt+1)},[n.spacingTokenMods,o]);let[ht,ue]=je(()=>typeof window=="undefined"?null:localStorage.getItem(ur)||null),[ct,Mt]=je(()=>{if(typeof window=="undefined")return null;try{let y=localStorage.getItem(pr);return y?JSON.parse(y):null}catch(y){return null}});Fe(()=>{ht?localStorage.setItem(ur,ht):localStorage.removeItem(ur)},[ht]),Fe(()=>{ct?localStorage.setItem(pr,JSON.stringify(ct)):localStorage.removeItem(pr)},[ct]);let[Lt,be]=je({}),ne=en(!1);Fe(()=>{if(ne.current||n.annotations.length===0)return;ne.current=!0;let y=new Set;for(let A of Object.values(Lt))for(let z of A.annotationIds)y.add(z);let R=n.annotations.filter(A=>y.has(A.id)?!1:!!(A.status==="in_flight"||(A.status==="pending"||!A.status)&&(A.captured||A.threadId))).map(A=>A.id);R.length>0&&i({type:"SET_ANNOTATION_STATUS",payload:{ids:R,status:"dismissed"}}),ct&&(ct.status==="planning"||ct.status==="executing"||ct.status==="reviewing")&&Object.keys(Lt).length===0&&Mt(null)},[n.annotations,Lt,i,ct]);let he=qn(()=>{let y=new Set;for(let R of Object.values(Lt))for(let A of R.annotationIds)y.add(A);return y},[Lt]),G=qn(()=>{let y=new Set;for(let R of Object.values(Lt))for(let A of R.styleSelectors)y.add(A);return y},[Lt]),gt=qn(()=>{let y=new Map;for(let R of Object.values(Lt)){for(let A of R.styleSelectors)y.set(A,R.color);for(let A of R.annotationIds){let z=n.annotations.find(Ct=>Ct.id===A);if(z&&(z.linkedSelector&&y.set(z.linkedSelector,R.color),z.groupId))for(let Ct of n.annotations)Ct.groupId===z.groupId&&Ct.linkedSelector&&y.set(Ct.linkedSelector,R.color)}}return y},[Lt,n.annotations]),at=en(n.annotations);at.current=n.annotations;let At=en(n.styleModifications);At.current=n.styleModifications;let _t=en(Lt);_t.current=Lt,Fe(()=>{let y=null,R=()=>{var Ot,Rt;if(Object.keys(_t.current).length>0)return;let z=at.current,Ct=At.current,dt=[],lt=[];for(let Ht of z){if(!Ht.linkedSelector||!Ht.linkedSelector.startsWith("[data-pm=")||Ht.captured||Ht.status&&Ht.status!=="pending")continue;let xt=document.querySelector(Ht.linkedSelector);!xt&&((Rt=(Ot=Ht.elements)==null?void 0:Ot[0])!=null&&Rt.selector)&&(xt=document.querySelector(Ht.elements[0].selector)),xt||dt.push(Ht.linkedSelector)}for(let Ht of Ct)document.querySelector(Ht.selector)||lt.push(Ht.selector);(dt.length>0||lt.length>0)&&i({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:dt,styleSelectors:lt}})},A=new MutationObserver(z=>{z.some(Ct=>Ct.removedNodes.length>0)&&(y&&clearTimeout(y),y=setTimeout(R,3e3))});return A.observe(document.body,{childList:!0,subtree:!0}),()=>{A.disconnect(),y&&clearTimeout(y)}},[i]),Fe(()=>{r.lastCompletedJobId&&r.lastCompletedJobId in Lt&&be(y=>{var z;let Ct=y,{[z=r.lastCompletedJobId]:R}=Ct;return So(Ct,[vo(z)])})},[r.lastCompletedJobId]);let Pt=en(new Set);Fe(()=>{let y=r.events.filter(R=>R.type==="done"&&R.data.resolutions);for(let R of y){let A=R.data.jobId;Pt.current.has(A)||(Pt.current.add(A),Array.isArray(R.data.resolutions)&&i({type:"APPLY_RESOLUTIONS",payload:{resolutions:R.data.resolutions,threadId:R.data.threadId}}))}},[r.events,i]);let kt=en(0);Fe(()=>{let y=r.incrementalResolutions;if(y.length<=kt.current)return;let R=y.slice(kt.current);kt.current=y.length,i({type:"APPLY_RESOLUTIONS",payload:{resolutions:R}})},[r.incrementalResolutions,i]),Fe(()=>{r.incrementalResolutions.length===0&&(kt.current=0)},[r.incrementalResolutions.length]);let Qt=en(r.status);Fe(()=>{let y=Qt.current;Qt.current=r.status,y==="disconnected"&&r.status==="idle"&&be({})},[r.status]);let Dt=Ne(async()=>{let y=document.getElementById("devtools-canvas");if(!y)return!1;let R=await mi(document.body,y,n.annotations);if(R.length===0)return!1;let A=await ds(R,n.annotations,n.styleModifications);return A&&i({type:"MARK_CAPTURED"}),A},[n.annotations,n.styleModifications,i]),Ce=Ne(async y=>{var R;try{let A=n.annotations.filter(qt=>{var le;return((le=qt.status)!=null?le:"pending")==="pending"}),z=await Oo(document.body,A);if(!z)return!1;let Ct=ls(),dt=n.styleModifications.filter(qt=>!qt.captured),lt=(R=n.inspectedElement)==null?void 0:R.info,Rt=A.length>0||dt.length>0||!!lt?JSON.stringify(No(A,dt,lt)):void 0,{planId:Ht,threadId:xt}=await Dr(z,y,o,s,I.id,window.location.href,{width:window.innerWidth,height:window.innerHeight},Ct,Rt);if(Mt({planId:Ht,threadId:xt,goal:y,status:"planning"}),xt){let qt=n.annotations.filter(le=>{var nn;return le.type==="text"&&((nn=le.status)!=null?nn:"pending")==="pending"}).map(le=>le.id);qt.length>0&&i({type:"SET_ANNOTATION_THREAD",payload:{ids:qt,threadId:xt}})}return i({type:"MARK_CAPTURED"}),xt&&ue(xt),!0}catch(A){return console.error("[Pare] Failed to send plan:",A),!1}},[o,s,I.id,n.annotations,n.styleModifications,n.inspectedElement,i]),re=Ne(async y=>{let R=ct==null?void 0:ct.planId;if(!R)return;let A=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),z=A!=null&&A[1]?parseFloat(A[1]):29,Ct=y.length>1?360/y.length:0;for(let dt=0;dt<y.length;dt++){let lt=y[dt],Ot=(z+dt*Ct)%360,Rt=`oklch(0.628 0.258 ${Math.round(Ot)})`,Ht=lt.region.y+lt.region.height/2,xt=window.innerHeight;(Ht<window.scrollY||Ht>window.scrollY+xt)&&(window.scrollTo({top:Math.max(0,Ht-xt/2),behavior:"instant"}),await new Promise(fn=>requestAnimationFrame(()=>requestAnimationFrame(()=>fn()))));let qt=ri(lt.region),le=Math.random().toString(36).substring(2,9),nn=qt?{x:qt.rect.left+window.scrollX,y:qt.rect.top+window.scrollY,width:qt.rect.width,height:qt.rect.height}:lt.region;i({type:"ADD_PLAN_ANNOTATION",payload:{groupId:le,planId:R,planTaskId:lt.id,instruction:lt.instruction,region:nn,color:Rt,linkedSelector:qt==null?void 0:qt.selector,elements:qt?[qt.info]:void 0}}),dt<y.length-1&&await new Promise(fn=>setTimeout(fn,200))}},[ct==null?void 0:ct.planId,n.activeColor,i]),pe=Ne((y,R)=>{let A=a.current.get(y)||[];a.current.set(y,[...A,...R])},[]),Ut=Ne(async()=>{let y=document.getElementById("devtools-canvas");if(!y)return!1;let R=n.annotations.filter(Rt=>{var Ht;return((Ht=Rt.status)!=null?Ht:"pending")==="pending"}),A=n.spacingTokenChanges.filter(Rt=>!Rt.captured);if(R.length===0&&n.styleModifications.filter(Rt=>!Rt.captured).length===0&&A.length===0)return!1;let z=await mi(document.body,y,n.annotations);if(z.length===0)return!1;let Ct=await Bo(z);if(!Ct)return!1;let dt=No(R,n.styleModifications,void 0,A.length>0?A:void 0),lt=JSON.stringify(dt),Ot=new Map;for(let Rt of R){let Ht=a.current.get(Rt.id);if(Ht&&Ht.length>0&&Ot.set(Rt.id,Ht),Rt.groupId){for(let xt of R)if(xt.groupId===Rt.groupId&&xt.id!==Rt.id){let qt=a.current.get(xt.id);qt&&qt.length>0&&Ot.set(xt.id,qt)}}}try{let Rt=gi(n.activeColor),{jobId:Ht,threadId:xt}=await Fr(Ct,lt,o,Rt,s,I.id,Ot.size>0?Ot:void 0);for(let Je of Ot.keys())a.current.delete(Je);let qt=R.map(Je=>Je.id),le=n.styleModifications.filter(Je=>!Je.captured).map(Je=>Je.selector);be(Je=>x(m({},Je),{[Ht]:{annotationIds:qt,styleSelectors:le,color:n.activeColor,threadId:xt}})),i({type:"MARK_CAPTURED"}),xt&&qt.length>0&&i({type:"SET_ANNOTATION_THREAD",payload:{ids:qt,threadId:xt}});let nn=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),mn=((nn!=null&&nn[1]?parseFloat(nn[1]):29)+60)%360;return i({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${mn})`}),!0}catch(Rt){return console.error("[Pare] Failed to send to bridge:",Rt),!1}},[n.annotations,n.styleModifications,n.spacingTokenChanges,n.activeColor,i,o,s,I.id]),Ee=Ne(async(y,R,A)=>{try{let z=gi(n.activeColor),{jobId:Ct}=await Gr(y,R,o,z,s,I.id,A);be(lt=>x(m({},lt),{[Ct]:{annotationIds:[],styleSelectors:[],color:n.activeColor,threadId:y}}));let dt=n.annotations.filter(lt=>lt.threadId===y&&(lt.status==="waiting_input"||lt.status==="resolved"||lt.status==="needs_review"));dt.length>0&&(i({type:"SET_ANNOTATION_STATUS",payload:{ids:dt.map(lt=>lt.id),status:"in_flight"}}),be(lt=>{let Ot=lt[Ct];return Ot?x(m({},lt),{[Ct]:x(m({},Ot),{annotationIds:[...Ot.annotationIds,...dt.map(Rt=>Rt.id)]})}):lt})),r.dismissQuestion(y)}catch(z){console.error("[Pare] Failed to send reply:",z)}},[n.activeColor,n.annotations,o,r.dismissQuestion,i,s,I.id]),ae=Ne(async()=>{if(!(!ct||!ct.planId))try{await Hr(ct.planId,o),Mt(lt=>lt?x(m({},lt),{status:"executing"}):null);let y=await Oo(document.body);if(!y)return;let R=n.annotations.filter(lt=>{var Ot;return lt.planId===ct.planId&&lt.type!=="text"&&((Ot=lt.status)!=null?Ot:"pending")==="pending"}),A=R.map(lt=>{var fn,mn,Je;let Ot=lt.groupId?n.annotations.find(En=>En.groupId===lt.groupId&&En.type==="text"):void 0,Rt=(fn=lt.points[0])!=null?fn:{x:0,y:0},Ht=(mn=lt.points[1])!=null?mn:Rt,xt=Math.min(Rt.x,Ht.x),qt=Math.min(Rt.y,Ht.y),le=Math.abs(Ht.x-Rt.x)||100,nn=Math.abs(Ht.y-Rt.y)||100;return{planTaskId:lt.planTaskId||lt.id,annotationId:lt.id,instruction:(Ot==null?void 0:Ot.text)||lt.text||"No instruction",region:{x:xt,y:qt,width:le,height:nn},linkedSelector:lt.linkedSelector,elements:(Je=lt.elements)==null?void 0:Je.map(En=>({selector:En.selector,reactComponent:En.reactComponent}))}});if(A.length===0)return;let{jobId:z}=await _r(y,ct.planId,A,o,s,I.id),Ct=[],dt=new Set;for(let lt of R)if(dt.has(lt.id)||(dt.add(lt.id),Ct.push(lt.id)),lt.groupId)for(let Ot of n.annotations)Ot.groupId===lt.groupId&&!dt.has(Ot.id)&&(dt.add(Ot.id),Ct.push(Ot.id));be(lt=>x(m({},lt),{[z]:{annotationIds:Ct,styleSelectors:[],color:n.activeColor,planId:ct.planId}})),i({type:"SET_ANNOTATION_STATUS",payload:{ids:Ct,status:"in_flight"}}),i({type:"MARK_CAPTURED"})}catch(y){console.error("[Pare] Failed to approve plan:",y)}},[ct,n.annotations,n.activeColor,o,s,I.id,i]),Ge=Ne(()=>{if(Mt(null),ct!=null&&ct.planId){let y=n.annotations.filter(R=>R.planId===ct.planId);for(let R of y)i({type:"DELETE_ANNOTATION",payload:{id:R.id}})}},[ct,n.annotations,i]),ce=en(new Set);Fe(()=>{for(let y of r.pendingQuestions){if(ce.current.has(y.jobId))continue;ce.current.add(y.jobId);let R=y.annotationIds&&y.annotationIds.length>0?y.annotationIds:void 0;!R&&y.threadId&&(R=n.annotations.filter(A=>A.threadId===y.threadId).map(A=>A.id)),R&&R.length>0&&i({type:"SET_ANNOTATION_QUESTION",payload:{ids:R,question:y.question,threadId:y.threadId}})}},[r.pendingQuestions,i,n.annotations]);let Ve=en(new Set),ve=en(null);Fe(()=>{for(let y of r.pendingPlans){if(Ve.current.has(y.planId))continue;Ve.current.add(y.planId);let R=y.tasks.length===1;Mt(A=>(A==null?void 0:A.planId)!==y.planId?A:x(m({},A),{tasks:y.tasks,threadId:y.threadId,status:R?"executing":"awaiting_approval"})),re(y.tasks).then(()=>{R&&(ve.current=y.planId)}),r.dismissPlan(y.planId)}},[r.pendingPlans]),Fe(()=>{!ve.current||!ct||ct.planId!==ve.current||n.annotations.filter(R=>R.planId===ct.planId&&R.type!=="text").length===0||(ve.current=null,ae())},[ct,n.annotations,ae]),Fe(()=>{for(let y of r.planReviews)!ct||ct.planId!==y.planId||y.verdict==="pass"&&Mt(R=>R?x(m({},R),{status:"done"}):null)},[r.planReviews,ct]);let Ze=en(new Set);Fe(()=>{!ct||ct.status!=="executing"||Ze.current.has(ct.planId)||Object.entries(Lt).filter(([A,z])=>z.planId===ct.planId).length>0||n.annotations.filter(A=>A.planId===ct.planId&&(A.status==="resolved"||A.status==="needs_review")).length===0||(Ze.current.add(ct.planId),(async()=>{try{Mt(z=>z?x(m({},z),{status:"reviewing"}):null);let A=await Oo(document.body);if(!A)return;await zr(ct.planId,A,o,s,I.id)}catch(A){console.error("[Pare] Failed to trigger review:",A)}})())},[ct,Lt,n.annotations,o,s,I.id]);let ze=qn(()=>{if(r.activeJobId&&r.activeJobId in Lt)return Lt[r.activeJobId].color;let y=Object.values(Lt);return y.length>0?y[y.length-1].color:void 0},[r.activeJobId,Lt]),ye=Ne(y=>{ue(y)},[]),qe=qn(()=>{if(!ht)return null;for(let[y,R]of Object.entries(Lt))if(R.threadId===ht)return y;return null},[ht,Lt]),[J,Ft]=je(!1),[Nt,Qe]=je(0),te=en(null),Jt=Ne(y=>{y?(te.current&&(clearTimeout(te.current),te.current=null),Ft(!0)):te.current=setTimeout(()=>{Ft(!1),te.current=null},150)},[]),De=Ne(()=>{Qe(y=>y+1),r.clearEvents()},[r.clearEvents]);Fe(()=>()=>{te.current&&clearTimeout(te.current)},[]);let Be=qn(()=>({isEnabled:e}),[e]);return e?Lu(xa.Provider,{value:Be,children:[t,yo(Us,{state:n,dispatch:i,onScreenshot:Dt,inFlightAnnotationIds:he,inFlightStyleSelectors:G,inFlightSelectorColors:gt,onAttachImages:pe,onReply:r.isConnected?Ee:void 0,onViewThread:r.isConnected?ye:void 0,activePlan:ct,onModelComponentsAdd:r.isConnected?St:void 0,onModelComponentFocus:r.isConnected?q:void 0,onModelComponentHover:O,modelComponentNames:Y,modelPanelHoveredComponent:tt,modelSpacingTokenHover:It}),yo(ua,{state:n,dispatch:i,onScreenshot:Dt,onSendToClaude:r.isConnected?Ut:void 0,onPlanGoal:r.isConnected?Ce:void 0,hasActiveJobs:Object.keys(Lt).length>0||r.activeJobIds.length>0,activeJobColor:ze,onCrosshairHover:Jt,onClear:De,provider:s,onProviderChange:r.isConnected&&u.length>1?N:void 0,availableProviders:u,modelIndex:c,modelCount:w.length,modelLabel:I.label,onModelChange:r.isConnected?L:void 0,onViewThread:r.isConnected?ye:void 0,isThreadPanelOpen:ht!==null,activePlan:ct,mcpStatus:f,onInstallMcp:r.isConnected?h:void 0,mcpJustInstalled:b,bridgeUrl:o,modelSelectedComponent:j,modelCanvasHoveredComponent:Q,onModelComponentHover:Z,onSpacingTokenHover:mt,onModifySpacingToken:r.isConnected?F:void 0,onDeleteSpacingToken:r.isConnected?bt:void 0,modelRefreshKey:vt,onModelComponentAdded:st,onModelComponentRemoved:wt}),ht&&r.isConnected&&yo(ba,{threadId:ht,bridgeUrl:o,accentColor:(sn=(ee=n.annotations.find(y=>y.threadId===ht))==null?void 0:ee.color)!=null?sn:n.activeColor,isStreaming:qe!==null,streamingResponse:qe&&(V=r.jobResponses[qe])!=null?V:"",streamingThinking:qe&&(et=r.jobThinking[qe])!=null?et:"",streamingEvents:qe?r.events.filter(y=>y.data.jobId===qe):[],onClose:()=>ue(null),onReply:Ee,activePlan:ct,planAnnotations:ct?n.annotations.filter(y=>y.planId===ct.planId&&y.type!=="text"):void 0,inFlightJobs:Lt,onViewThread:ye,onApprovePlan:(ct==null?void 0:ct.status)==="awaiting_approval"?ae:void 0,onDismissPlan:(ct==null?void 0:ct.status)==="awaiting_approval"?Ge:void 0}),r.isConnected&&yo(fa,{bridge:r,bridgeUrl:o,inFlightJobs:Lt,isVisible:J||r.lastResponseText!==null||r.activeJobIds.length>0,onHover:Jt,clearSignal:Nt,onReply:Ee})]}):yo(Iu,{children:t})}function Mu(){let t=ku(xa);if(!t)throw new Error("usePopmelt must be used within PopmeltProvider");return t}export{Tu as PopmeltProvider,Mu as usePopmelt};