@popmelt.com/core 0.5.9 → 0.5.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cli.mjs +12 -12
- package/dist/index.mjs +15 -15
- package/dist/server.mjs +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
var Fl=Object.defineProperty,Hl=Object.defineProperties;var _l=Object.getOwnPropertyDescriptors;var ir=Object.getOwnPropertySymbols;var Ms=Object.prototype.hasOwnProperty,Ls=Object.prototype.propertyIsEnumerable;var Is=(t,e,o)=>e in t?Fl(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,m=(t,e)=>{for(var o in e||(e={}))Ms.call(e,o)&&Is(t,o,e[o]);if(ir)for(var o of ir(e))Ls.call(e,o)&&Is(t,o,e[o]);return t},b=(t,e)=>Hl(t,_l(e));var sr=t=>typeof t=="symbol"?t:t+"",Wn=(t,e)=>{var o={};for(var n in t)Ms.call(t,n)&&e.indexOf(n)<0&&(o[n]=t[n]);if(t!=null&&ir)for(var n of ir(t))e.indexOf(n)<0&&Ls.call(t,n)&&(o[n]=t[n]);return o};import{createContext as Yp,useCallback as Pe,useContext as jp,useEffect as Re,useMemo as _o,useRef as on,useState as Xe}from"react";import{useCallback as Fr,useEffect as zl,useSyncExternalStore as $l}from"react";var un="http://localhost:1111";function dn(t,e={},o=15e3){let n=new AbortController;e.signal&&e.signal.addEventListener("abort",()=>n.abort());let r=setTimeout(()=>n.abort(),o);return fetch(t,b(m({},e),{signal:n.signal})).finally(()=>clearTimeout(r))}async function As(t=un){try{let e=await dn(`${t}/capabilities`,{},5e3);return e.ok?await e.json():null}catch(e){return null}}async function ar(t=un){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 Rs(t){try{let e=new AbortController,o=setTimeout(()=>e.abort(),500),n=await fetch(`http://localhost:${t}/status`,{signal:e.signal});return clearTimeout(o),n.ok?await n.json():null}catch(e){return null}}async function Ps(t){if(t&&t!=="http://localhost:1111")try{let c=new URL(t);return{url:t,port:parseInt(c.port,10)||1111}}catch(c){return null}let r=typeof window!="undefined"?window.location.origin:null,i=await Rs(1111);if(i&&(!i.devOrigin||!r||i.devOrigin===r))return{url:"http://localhost:1111",port:1111};let s=Array.from({length:8},(c,d)=>{let p=1112+d;return Rs(p).then(u=>u?{status:u,port:p}:null)}),a=(await Promise.all(s)).filter(c=>c!==null);if(r){let c=a.find(d=>d.status.devOrigin===r);if(c)return{url:`http://localhost:${c.port}`,port:c.port}}let l=[...i?[{port:1111}]:[],...a.map(c=>({port:c.port}))];return l.length===1?{url:`http://localhost:${l[0].port}`,port:l[0].port}:i?{url:"http://localhost:1111",port:1111}:l.length>0?{url:`http://localhost:${l[0].port}`,port:l[0].port}:null}async function Bs(t,e,o=un,n,r,i,s,a){let l=new FormData;if(l.append("screenshot",t,"screenshot.png"),l.append("feedback",e),n&&l.append("color",n),r&&l.append("provider",r),i&&l.append("model",i),a&&l.append("sourceId",a),s)for(let[d,p]of s)for(let u=0;u<p.length;u++)l.append(`image-${d}-${u}`,p[u],`image-${d}-${u}.png`);let c=await dn(`${o}/send`,{method:"POST",body:l},3e4);if(!c.ok){let d=await c.text();throw new Error(`Bridge returned ${c.status}: ${d}`)}return c.json()}async function Os(t,e,o=un,n,r,i,s,a,l,c){let d=new FormData;d.append("screenshot",t,"screenshot.png"),d.append("goal",e),i&&d.append("pageUrl",i),s&&d.append("viewport",JSON.stringify(s)),n&&d.append("provider",n),r&&d.append("model",r),a&&d.append("manifest",JSON.stringify(a)),l&&d.append("feedback",l),c&&d.append("sourceId",c);let p=await dn(`${o}/plan`,{method:"POST",body:d},3e4);if(!p.ok){let u=await p.text();throw new Error(`Bridge returned ${p.status}: ${u}`)}return p.json()}async function Ds(t,e=un,o){let n=await dn(`${e}/plan/approve`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({planId:t,approvedTaskIds:o})},1e4);if(!n.ok){let r=await n.text();throw new Error(`Bridge returned ${n.status}: ${r}`)}return n.json()}async function Ns(t,e,o=un,n,r,i){let s=new FormData;s.append("screenshot",e,"screenshot.png"),s.append("planId",t),n&&s.append("provider",n),r&&s.append("model",r),i&&s.append("sourceId",i);let a=await dn(`${o}/plan/review`,{method:"POST",body:s},3e4);if(!a.ok){let l=await a.text();throw new Error(`Bridge returned ${a.status}: ${l}`)}return a.json()}async function Fs(t,e,o,n=un,r,i,s){let a=new FormData;a.append("screenshot",t,"screenshot.png"),a.append("planId",e),a.append("tasks",JSON.stringify(o)),r&&a.append("provider",r),i&&a.append("model",i),s&&a.append("sourceId",s);let l=await dn(`${n}/plan/execute`,{method:"POST",body:a},3e4);if(!l.ok){let c=await l.text();throw new Error(`Bridge returned ${l.status}: ${c}`)}return l.json()}async function Hs(t=un,e){try{let o=await dn(`${t}/mcp/install`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e?{serverUrl:e}:{})},15e3);return o.ok?await o.json():null}catch(o){return null}}async function _s(t,e=un){let o=await dn(`${e}/model/component`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:t})},1e4);if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function zs(t,e=un){let o=await dn(`${e}/model/component`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:t})},1e4);if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function Nr(t,e,o=un){let n=await dn(`${o}/model/token`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:t,value:e})},1e4);if(!n.ok){let r=await n.text();throw new Error(`Bridge returned ${n.status}: ${r}`)}return n.json()}async function $s(t,e=un){let o=await dn(`${e}/model/token`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:t})},1e4);if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function mo(t=un){var e;try{let o=await dn(`${t}/model`,{},5e3);return o.ok&&(e=(await o.json()).model)!=null?e:null}catch(o){return null}}async function Ws(t,e,o=un,n,r,i,s,a){let l;if(s&&s.length>0){let c=new FormData,d=new Blob([new Uint8Array([137,80,78,71,13,10,26,10,0,0,0,13,73,72,68,82,0,0,0,1,0,0,0,1,8,6,0,0,0,31,21,196,137,0,0,0,10,73,68,65,84,120,156,98,0,0,0,2,0,1,229,39,222,252,0,0,0,0,73,69,78,68,174,66,96,130])],{type:"image/png"});c.append("screenshot",d,"screenshot.png"),c.append("feedback",JSON.stringify({threadId:t,reply:e,color:n,provider:r,model:i,sourceId:a}));for(let p=0;p<s.length;p++)c.append(`image-reply-${p}`,s[p],`reply-image-${p}.png`);l=await dn(`${o}/reply`,{method:"POST",body:c},3e4)}else l=await dn(`${o}/reply`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({threadId:t,reply:e,color:n,provider:r,model:i,sourceId:a})},3e4);if(!l.ok){let c=await l.text();throw new Error(`Bridge returned ${l.status}: ${c}`)}return l.json()}var Js=typeof crypto!="undefined"&&typeof crypto.randomUUID=="function"?crypto.randomUUID():Math.random().toString(36).slice(2);function xo(){return Js}var Wl={isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,lastErrorByJob:{},pendingQuestions:[],pendingPlans:[],planReviews:[],incrementalResolutions:[]},lr=m({},Wl),Hr=new Set,ho=null,Ys=null,Zn=null,js=0,bo=null,yo=null;async function Yl(t){return t&&t!=="http://localhost:1111"?(bo=t,t):bo||yo||(yo=Ps(t).then(o=>{var n;return bo=(n=o==null?void 0:o.url)!=null?n:null,yo=null,bo}).catch(()=>(yo=null,null)),yo)}function Vs(){return bo}function Gs(){return lr}function jl(t){return Hr.add(t),()=>{Hr.delete(t)}}function Je(t){lr=t(lr);for(let e of Hr)e()}function Xs(t){if(ho&&ho.readyState!==EventSource.CLOSED&&Ys===t)return;ho&&(ho.close(),ho=null),Zn&&(clearTimeout(Zn),Zn=null),Ys=t;let e=++js,o=new EventSource(`${t}/events?sourceId=${Js}`);ho=o;let n=()=>e!==js;o.addEventListener("connected",()=>{n()||ar(t).then(r=>{var d,p;if(n())return;let i=(d=r==null?void 0:r.activeJobs)!=null?d:r!=null&&r.activeJob?[r.activeJob]:[],s=new Set(i.map(u=>u.id)),a=(p=r==null?void 0:r.recentJobs)!=null?p:[],l=new Map(a.map(u=>[u.id,u])),c=i.length>0;Je(u=>{let g=m({},u.lastErrorByJob),f=u.activeJobIds.filter(x=>!s.has(x));for(let x of f){let y=l.get(x);(y==null?void 0:y.status)==="error"&&y.error&&(g[x]=y.error)}let h=u.activeJobIds.filter(x=>s.has(x));for(let x of s)h.includes(x)||h.push(x);return b(m({},u),{isConnected:!0,status:c?"streaming":f.length>0||u.status==="disconnected"?"idle":u.status,activeJobId:c?i[i.length-1].id:h.length>0?h[h.length-1]:null,activeJobIds:h,lastErrorByJob:g,lastCompletedJobId:f.length>0?f[f.length-1]:u.lastCompletedJobId})})})}),o.addEventListener("job_started",r=>{if(n())return;let i=JSON.parse(r.data),s=i.jobId;Je(a=>b(m({},a),{status:"streaming",activeJobId:s,activeJobIds:[...a.activeJobIds,s],jobResponses:b(m({},a.jobResponses),{[s]:""}),jobThinking:b(m({},a.jobThinking),{[s]:""}),currentResponse:"",currentThinking:"",lastResponseText:null,lastThreadId:null,events:[...a.events,{type:"job_started",data:i,timestamp:Date.now()}]}))}),o.addEventListener("delta",r=>{if(n())return;let i=JSON.parse(r.data),s=i.jobId,a=i.text||"";Je(l=>b(m({},l),{jobResponses:s?b(m({},l.jobResponses),{[s]:(l.jobResponses[s]||"")+a}):l.jobResponses,currentResponse:!s||s===l.activeJobId?l.currentResponse+a:l.currentResponse,events:[...l.events,{type:"delta",data:i,timestamp:Date.now()}]}))}),o.addEventListener("thinking",r=>{if(n())return;let i=JSON.parse(r.data),s=i.jobId,a=i.text||"";Je(l=>b(m({},l),{jobThinking:s?b(m({},l.jobThinking),{[s]:(l.jobThinking[s]||"")+a}):l.jobThinking,currentThinking:!s||s===l.activeJobId?l.currentThinking+a:l.currentThinking,events:[...l.events,{type:"thinking",data:i,timestamp:Date.now()}]}))}),o.addEventListener("tool_use",r=>{if(n())return;let i=JSON.parse(r.data);Je(s=>b(m({},s),{events:[...s.events,{type:"tool_use",data:i,timestamp:Date.now()}]}))}),o.addEventListener("done",r=>{if(n())return;let i=JSON.parse(r.data),s=i.jobId;Je(a=>{var g;let l=s?a.activeJobIds.filter(f=>f!==s):a.activeJobIds,c=m({},a.jobResponses),d=m({},a.jobThinking),p=s?c[s]:void 0;s&&(delete c[s],delete d[s]);let u=s===a.activeJobId?l.length>0?l[l.length-1]:null:a.activeJobId;return b(m(b(m({},a),{activeJobIds:l,activeJobId:u,jobResponses:c,jobThinking:d,lastCompletedJobId:s!=null?s:a.activeJobId,lastResponseText:p||a.currentResponse||i.responseText||null,lastThreadId:(g=i.threadId)!=null?g:null}),s===a.activeJobId?{currentResponse:u&&c[u]||"",currentThinking:u&&d[u]||""}:{}),{events:[...a.events,{type:"done",data:i,timestamp:Date.now()}]})})}),o.addEventListener("question",r=>{if(n())return;let i=JSON.parse(r.data);Je(s=>b(m({},s),{pendingQuestions:[...s.pendingQuestions,{jobId:i.jobId,threadId:i.threadId,question:i.question,annotationIds:i.annotationIds,timestamp:Date.now()}],events:[...s.events,{type:"question",data:i,timestamp:Date.now()}]}))}),o.addEventListener("plan_ready",r=>{if(n())return;let i=JSON.parse(r.data);Je(s=>b(m({},s),{pendingPlans:[...s.pendingPlans,{jobId:i.jobId,planId:i.planId,tasks:i.tasks,threadId:i.threadId,timestamp:Date.now()}],events:[...s.events,{type:"plan_ready",data:i,timestamp:Date.now()}]}))}),o.addEventListener("plan_review",r=>{if(n())return;let i=JSON.parse(r.data);Je(s=>b(m({},s),{planReviews:[...s.planReviews,{planId:i.planId,verdict:i.verdict,summary:i.summary,issues:i.issues,timestamp:Date.now()}],events:[...s.events,{type:"plan_review",data:i,timestamp:Date.now()}]}))}),o.addEventListener("task_resolved",r=>{var a;if(n())return;let i=JSON.parse(r.data),s=(a=i.resolutions)!=null?a:[];Je(l=>b(m({},l),{incrementalResolutions:[...l.incrementalResolutions,...s],events:[...l.events,{type:"task_resolved",data:i,timestamp:Date.now()}]}))}),o.addEventListener("queue_drained",()=>{n()||Je(r=>b(m({},r),{status:r.status==="error"?"error":"idle",activeJobId:null,activeJobIds:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastErrorByJob:{},incrementalResolutions:[]}))}),o.addEventListener("error",r=>{var i,s;if(!n()){if(o.readyState===EventSource.CLOSED)Je(a=>b(m({},a),{isConnected:!1,status:"disconnected"})),Zn&&(clearTimeout(Zn),Zn=null),Zn=setTimeout(()=>{ar(t).then(a=>{a&&Xs(t)})},5e3);else if(r instanceof MessageEvent){let a=JSON.parse(r.data),l=(i=a.jobId)!=null?i:null,c=(s=a.message)!=null?s:"";Je(d=>{let p=l?d.activeJobIds.filter(g=>g!==l):d.activeJobIds,u=p.length>0?d.status:"error";return b(m({},d),{status:u,activeJobIds:p,lastCompletedJobId:l!=null?l:d.activeJobId,lastErrorByJob:l&&c?b(m({},d.lastErrorByJob),{[l]:c}):d.lastErrorByJob,events:[...d.events,{type:"error",data:a,timestamp:Date.now()}]})})}}}),o.onerror=()=>{n()||o.readyState===EventSource.CLOSED&&Je(r=>b(m({},r),{isConnected:!1,status:"disconnected"}))}}function Us(t="http://localhost:1111"){let e=$l(jl,Gs,Gs);zl(()=>{Yl(t).then(i=>{i&&ar(i).then(s=>{s&&Xs(i)})})},[t]);let o=Fr(()=>{Je(()=>b(m({},lr),{events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,lastErrorByJob:{},incrementalResolutions:[]}))},[]),n=Fr(i=>{Je(s=>b(m({},s),{pendingQuestions:s.pendingQuestions.filter(a=>a.threadId!==i)}))},[]),r=Fr(i=>{Je(s=>b(m({},s),{pendingPlans:s.pendingPlans.filter(a=>a.planId!==i)}))},[]);return b(m({},e),{clearEvents:o,dismissQuestion:n,dismissPlan:r})}import{useEffect as Gl,useReducer as Jl}from"react";var Vl={isAnnotating:!1,activeTool:"inspector",activeColor:"#ff0000",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function vo(){return Math.random().toString(36).substring(2,9)}function Ks(t){return t.status?t:t.captured?b(m({},t),{status:"in_flight"}):b(m({},t),{status:"pending"})}function en(t){return b(m({},t),{undoStack:[...t.undoStack,{annotations:t.annotations,styleModifications:t.styleModifications,spacingTokenMods:t.spacingTokenMods}],redoStack:[]})}function Xl(t,e){return b(m({},t),{isAnnotating:e})}function Ul(t,e){return b(m({},t),{activeTool:e,inspectedElement:null})}function Kl(t,e){return b(m({},t),{activeColor:e})}function Zl(t,e){return b(m({},t),{strokeWidth:e})}function ql(t,e){return b(m({},t),{currentPath:[e]})}function Ql(t,e){return b(m({},t),{currentPath:[...t.currentPath,e]})}function tc(t){return b(m({},t),{currentPath:[]})}function ec(t,e){if(t.currentPath.length<2&&t.activeTool!=="text")return b(m({},t),{currentPath:[]});let o={id:vo(),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=en(t);return b(m({},n),{annotations:[...t.annotations,o],currentPath:[]})}function nc(t,e){var r;let o=m({id:(r=e.id)!=null?r:vo(),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:en(t);return b(m({},n),{annotations:[...t.annotations,o]})}function oc(t,e){let o=en(t);return b(m({},o),{annotations:t.annotations.map(n=>n.id===e.id?m(b(m({},n),{text:e.text}),e.imageCount!=null?{imageCount:e.imageCount}:{}):n)})}function rc(t,e){return b(m({},t),{annotations:t.annotations.map(o=>o.id===e.id?b(m({},o),{fontSize:Math.max(12,Math.min(72,e.fontSize))}):o)})}function ic(t,e){let o=en(t),n=t.annotations.find(i=>i.id===e.id),r=n==null?void 0:n.groupId;return b(m({},o),{annotations:t.annotations.filter(i=>i.id!==e.id&&!(r&&i.groupId===r))})}function sc(t,e){let o=e.saveUndo?en(t):t,n=t.annotations.find(i=>i.id===e.id),r=n==null?void 0:n.groupId;return b(m({},o),{annotations:t.annotations.map(i=>{if(!(i.id===e.id||r&&i.groupId===r))return i;let a=e.delta.x,l=e.delta.y;return b(m({},i),{points:i.points.map(c=>({x:c.x+a,y:c.y+l}))})})})}function ac(t,e){let o=e.saveUndo?en(t):t,n=t.annotations.find(s=>s.id===e.id);if(!n||n.type==="text"||n.points.length<2)return t;let r=0,i=0;if(n.type==="rectangle"&&n.groupId){let s=e.points,a=Math.min(s[0].x,s[1].x),l=Math.max(s[0].y,s[1].y),c=n.points[0],d=n.points[n.points.length-1],p=Math.min(c.x,d.x),u=Math.max(c.y,d.y);r=a-p,i=l-u}return b(m({},o),{annotations:t.annotations.map(s=>s.id===e.id?b(m({},s),{points:e.points}):n.groupId&&s.groupId===n.groupId&&s.type==="text"?b(m({},s),{points:s.points.map(a=>({x:a.x+r,y:a.y+i}))}):s)})}function lc(t,e){let o=en(t);return b(m({},o),{annotations:[...t.annotations,...e.annotations.map(Ks)]})}function cc(t,e){let o=new Set,n=[];for(let r of e.annotations)o.has(r.id)||(o.add(r.id),n.push(Ks(r)));return b(m({},t),{annotations:n})}function dc(t){if(t.undoStack.length===0)return t;let e=t.undoStack[t.undoStack.length-1];return b(m({},t),{annotations:(e==null?void 0:e.annotations)||[],styleModifications:(e==null?void 0:e.styleModifications)||[],spacingTokenMods:(e==null?void 0:e.spacingTokenMods)||[],undoStack:t.undoStack.slice(0,-1),redoStack:[...t.redoStack,{annotations:t.annotations,styleModifications:t.styleModifications,spacingTokenMods:t.spacingTokenMods}]})}function uc(t){if(t.redoStack.length===0)return t;let e=t.redoStack[t.redoStack.length-1];return b(m({},t),{annotations:(e==null?void 0:e.annotations)||[],styleModifications:(e==null?void 0:e.styleModifications)||[],spacingTokenMods:(e==null?void 0:e.spacingTokenMods)||[],redoStack:t.redoStack.slice(0,-1),undoStack:[...t.undoStack,{annotations:t.annotations,styleModifications:t.styleModifications,spacingTokenMods:t.spacingTokenMods}]})}function pc(t,e){let{id:o,addToSelection:n}=e;if(o===null)return b(m({},t),{selectedAnnotationIds:[],lastSelectedId:null});if(n)if(t.selectedAnnotationIds.includes(o)){let i=t.selectedAnnotationIds.filter(s=>s!==o);return b(m({},t),{selectedAnnotationIds:i,lastSelectedId:i.length>0?i[i.length-1]:null})}else return b(m({},t),{selectedAnnotationIds:[...t.selectedAnnotationIds,o],lastSelectedId:o});return b(m({},t),{selectedAnnotationIds:[o],lastSelectedId:o})}function fc(t,e){let o=new Set;for(let n of t.selectedAnnotationIds){let r=t.annotations.find(i=>i.id===n);r!=null&&r.groupId&&o.add(r.groupId)}return b(m({},t),{annotations:t.annotations.map(n=>{let r=t.selectedAnnotationIds.includes(n.id),i=n.groupId&&o.has(n.groupId);return!r&&!i?n:b(m({},n),{color:e.color})})})}function gc(t){return b(m({},t),{annotations:t.annotations.map(e=>b(m({},e),{captured:!0,status:e.status==="pending"||!e.status?"in_flight":e.status})),styleModifications:t.styleModifications.map(e=>b(m({},e),{captured:!0})),spacingTokenChanges:t.spacingTokenChanges.map(e=>b(m({},e),{captured:!0}))})}function mc(t){return b(m({},t),{annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]})}function hc(t,e){return b(m({},t),{inspectedElement:e})}function yc(t,e){let{selector:o,element:n,property:r,original:i,modified:s}=e,a=t.styleModifications.findIndex(l=>l.selector===o);if(i===s&&a<0)return t;if(a>=0){let l=t.styleModifications[a];if(l.captured){let g=en(t),f=g.styleModifications.map((h,x)=>x===a?b(m({},h),{changes:[{property:r,original:i,modified:s}],captured:!1}):h);return b(m({},g),{styleModifications:f})}let c=l.changes.findIndex(g=>g.property===r),d,p=t;if(c>=0){let g=l.changes[c];s===g.original?d=l.changes.filter((f,h)=>h!==c):d=l.changes.map((f,h)=>h===c?b(m({},f),{modified:s}):f)}else{if(i===s)return t;p=en(t),d=[...l.changes,{property:r,original:i,modified:s}]}if(d.length===0)return b(m({},p),{styleModifications:p.styleModifications.filter((g,f)=>f!==a)});let u=p.styleModifications.map((g,f)=>f===a?b(m({},g),{changes:d}):g);return b(m({},p),{styleModifications:u})}else{let l=en(t),c={selector:o,element:n,changes:[{property:r,original:i,modified:s}]};return b(m({},l),{styleModifications:[...l.styleModifications,c]})}}function bc(t,e){let{selector:o,durableSelector:n,element:r,changes:i}=e,s=i.filter(c=>c.original!==c.modified);if(s.length===0)return t;let a=en(t),l=a.styleModifications.findIndex(c=>c.selector===o);if(l>=0){let c=a.styleModifications[l],d=c.captured?[]:[...c.changes];for(let p of s){let u=d.findIndex(g=>g.property===p.property);u>=0?p.modified===d[u].original?d=d.filter((g,f)=>f!==u):d=d.map((g,f)=>f===u?b(m({},g),{modified:p.modified}):g):d.push(p)}return d.length===0?b(m({},a),{styleModifications:a.styleModifications.filter((p,u)=>u!==l)}):b(m({},a),{styleModifications:a.styleModifications.map((p,u)=>u===l?b(m({},p),{changes:d,captured:!1}):p)})}else return b(m({},a),{styleModifications:[...a.styleModifications,{selector:o,durableSelector:n,element:r,changes:s}]})}function xc(t,e){let{selector:o,property:n}=e,r=en(t),i=r.styleModifications.map(s=>s.selector!==o?s:b(m({},s),{changes:s.changes.filter(a=>a.property!==n)})).filter(s=>s.changes.length>0);return b(m({},r),{styleModifications:i})}function vc(t){if(t.styleModifications.length===0)return b(m({},t),{inspectedElement:null});let e=en(t);return b(m({},e),{styleModifications:[],inspectedElement:null})}function Sc(t,e){return b(m({},t),{styleModifications:e})}function wc(t,e){let{updates:o}=e,n=new Map(o.map(r=>[r.id,r]));return b(m({},t),{annotations:t.annotations.map(r=>{let i=n.get(r.id);return i?m(b(m({},r),{points:[i.point,...r.points.slice(1)]}),i.linkedAnchor?{linkedAnchor:i.linkedAnchor}:{}):r})})}function kc(t,e){let o=new Set(e.ids);return b(m({},t),{annotations:t.annotations.map(n=>o.has(n.id)?b(m({},n),{status:e.status}):n)})}function Ec(t,e){let o=new Set(e.ids),n=new Set;for(let r of t.annotations)o.has(r.id)&&r.groupId&&n.add(r.groupId);return b(m({},t),{annotations:t.annotations.map(r=>o.has(r.id)||r.groupId&&n.has(r.groupId)?b(m({},r),{threadId:e.threadId}):r)})}function Cc(t,e){let o=new Set(e.ids),n=new Set;for(let r of t.annotations)o.has(r.id)&&r.groupId&&n.add(r.groupId);return b(m({},t),{annotations:t.annotations.map(r=>o.has(r.id)||r.groupId&&n.has(r.groupId)?b(m({},r),{status:"waiting_input",question:e.question,threadId:e.threadId}):r)})}function Tc(t,e){let o=new Map(e.resolutions.map(r=>[r.annotationId,r])),n=new Map;for(let r of t.annotations){let i=o.get(r.id);i&&r.groupId&&n.set(r.groupId,i)}return b(m({},t),{annotations:t.annotations.map(r=>{var s,a,l;let i=o.get(r.id)||(r.groupId?n.get(r.groupId):void 0);return i?b(m({},r),{status:i.status,resolutionSummary:i.summary,scope:(a=(s=i.finalScope)!=null?s:i.inferredScope)!=null?a:null,replyCount:((l=r.replyCount)!=null?l:0)+1,question:void 0,threadId:r.threadId||e.threadId}):r})})}function Ic(t,e){let{groupId:o,planId:n,planTaskId:r,instruction:i,region:s,color:a,linkedSelector:l,elements:c}=e,d=i.length>60?i.slice(0,60).replace(/\s+\S*$/,"")+"\u2026":i,p={id:vo(),type:"rectangle",points:[{x:s.x,y:s.y},{x:s.x+s.width,y:s.y+s.height}],color:a,strokeWidth:2,timestamp:Date.now(),groupId:o,linkedSelector:l,elements:c,planId:n,planTaskId:r,status:"pending"},u={id:vo(),type:"text",points:[{x:s.x,y:s.y+s.height+4}],text:d,fontSize:12,color:a,strokeWidth:2,timestamp:Date.now(),status:"pending",groupId:o,linkedSelector:l,elements:c,planId:n,planTaskId:r};return b(m({},t),{annotations:[...t.annotations,p,u]})}function Mc(t,e){let{linkedSelectors:o,styleSelectors:n}=e,r=new Set(o),i=new Set(n),s=new Set,a=new Set;for(let u of t.annotations)u.linkedSelector&&r.has(u.linkedSelector)&&(s.add(u.id),u.groupId&&a.add(u.groupId));for(let u of t.annotations)u.groupId&&a.has(u.groupId)&&s.add(u.id);let l=t.annotations.filter(u=>!s.has(u.id)),c=t.styleModifications.filter(u=>!i.has(u.selector));if(l.length===t.annotations.length&&c.length===t.styleModifications.length)return t;let d=t.selectedAnnotationIds.filter(u=>!s.has(u)),p=t.inspectedElement&&i.has(t.inspectedElement.info.selector)?null:t.inspectedElement;return b(m({},t),{annotations:l,styleModifications:c,selectedAnnotationIds:d,lastSelectedId:d.length>0?d[d.length-1]:null,inspectedElement:p})}function Lc(t,e){let o=t.spacingTokenChanges.findIndex(n=>n.tokenPath===e.tokenPath);return o>=0?b(m({},t),{spacingTokenChanges:t.spacingTokenChanges.map((n,r)=>r===o?e:n)}):b(m({},t),{spacingTokenChanges:[...t.spacingTokenChanges,e]})}function Rc(t,e){return b(m({},t),{spacingTokenChanges:e})}function Ac(t,e){let o=en(t),n=t.spacingTokenMods.findIndex(i=>i.tokenPath===e.tokenPath),r;if(n>=0){let i=t.spacingTokenMods[n],s=b(m({},e),{originalValue:i.originalValue,originalPx:i.originalPx});r=t.spacingTokenMods.map((a,l)=>l===n?s:a)}else r=[...t.spacingTokenMods,e];return b(m({},o),{spacingTokenMods:r})}function Pc(t,e){let o=en(t),n=t.spacingTokenMods.findIndex(l=>l.tokenPath===e.tokenPath),r=n>=0?t.spacingTokenMods[n].originalValue:e.originalValue,i=n>=0?t.spacingTokenMods[n].originalPx:parseFloat(e.originalValue)||0,s={tokenPath:e.tokenPath,originalValue:r,currentValue:"__deleted__",targets:n>=0?t.spacingTokenMods[n].targets:[],originalPx:i,currentPx:0},a;return n>=0?a=t.spacingTokenMods.map((l,c)=>c===n?s:l):a=[...t.spacingTokenMods,s],b(m({},o),{spacingTokenMods:a})}var Bc={SET_ANNOTATING:Xl,SET_TOOL:Ul,SET_COLOR:Kl,SET_STROKE_WIDTH:Zl,START_PATH:ql,CONTINUE_PATH:Ql,CANCEL_PATH:tc,FINISH_PATH:ec,ADD_TEXT:nc,UPDATE_TEXT:oc,UPDATE_TEXT_SIZE:rc,DELETE_ANNOTATION:ic,MOVE_ANNOTATION:sc,RESIZE_ANNOTATION:ac,PASTE_ANNOTATIONS:lc,RESTORE_ANNOTATIONS:cc,UNDO:dc,REDO:uc,SELECT_ANNOTATION:pc,UPDATE_ANNOTATION_COLOR:fc,MARK_CAPTURED:gc,CLEAR:mc,SELECT_ELEMENT:hc,MODIFY_STYLE:yc,MODIFY_STYLES_BATCH:bc,CLEAR_STYLE:xc,CLEAR_ALL_STYLES:vc,RESTORE_STYLE_MODIFICATIONS:Sc,UPDATE_LINKED_POSITIONS:wc,CLEANUP_ORPHANED:Mc,SET_ANNOTATION_STATUS:kc,SET_ANNOTATION_THREAD:Ec,SET_ANNOTATION_QUESTION:Cc,APPLY_RESOLUTIONS:Tc,ADD_PLAN_ANNOTATION:Ic,ADD_SPACING_TOKEN_CHANGE:Lc,RESTORE_SPACING_TOKEN_CHANGES:Rc,MODIFY_SPACING_TOKEN:Ac,DELETE_SPACING_TOKEN:Pc};function Oc(t,e){let o=Bc[e.type];return o?o(t,e.payload):t}function Zs(){let[t,e]=Jl(Oc,Vl);return Gl(()=>{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 qn(t){let e=Object.keys(t).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!e)return null;let o=t[e],n=[];for(;o;){let r=o.type,i=(r==null?void 0:r.displayName)||(r==null?void 0:r.name);i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&n.unshift(i),o=o.return}return n.length>0?{name:n[n.length-1],path:n}:null}function _r(t){let e=Object.keys(t).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!e)return[];let o=t[e],n=[];for(;o;){let r=o.type,i=typeof r=="function"||typeof r=="object"?(r==null?void 0:r.displayName)||(r==null?void 0:r.name):null;i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&n.push({name:i,fiber:o}),o=o.return}return n.reverse(),n}function cr(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 qs(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 hn(t){if(t.id&&!t.id.startsWith("radix-")&&!t.id.startsWith(":"))return`#${CSS.escape(t.id)}`;let e=[],o=t;for(;o&&o!==document.documentElement;){let n=o.tagName.toLowerCase();if(o.id&&!o.id.startsWith("radix-")&&!o.id.startsWith(":")){e.unshift(`#${CSS.escape(o.id)}`);break}let r=Array.from(o.classList).filter(s=>!s.startsWith("_")&&s.length<30).slice(0,2);r.length>0&&(n+="."+r.map(s=>CSS.escape(s)).join("."));let i=o.parentElement;if(i){let s=Array.from(i.children).filter(a=>a.tagName===o.tagName);if(s.length>1){let a=s.indexOf(o)+1;n+=`:nth-of-type(${a})`}}e.unshift(n),o=i}return e.join(" > ")}function Ke(t){try{return document.querySelector(t)}catch(e){return null}}function dr(t,e=0){var l;let o=_r(t);if(o.length===0)return null;let n=o.map(c=>c.name),r=o.length-1,i=Math.max(0,Math.min(o.length-1,r-e)),s=o[i],a=(l=cr(s.fiber))!=null?l:t;return{name:s.name,path:n,depthIndex:i,rootElement:a}}function Qs(t,e){var i,s;let o=_r(t),n=e.toLowerCase(),r=-1;for(let a=o.length-1;a>=0;a--){let l=o[a].name;if(l===e){let c=(i=cr(o[a].fiber))!=null?i:t;return{name:e,path:o.map(d=>d.name),depthIndex:a,rootElement:c}}if(r===-1){let c=l.toLowerCase();(c.length>=4&&n.includes(c)||n.length>=4&&c.includes(n))&&(r=a)}}if(r>=0){let a=(s=cr(o[r].fiber))!=null?s:t;return{name:e,path:o.map(l=>l.name),depthIndex:r,rootElement:a}}return null}function So(t){let e=wo(),o=[],n=new Set,r=e.currentNode;for(;r=e.nextNode();){let i=Qs(r,t);i&&!n.has(i.rootElement)&&(n.add(i.rootElement),o.push(i))}return o}function zr(t){let e=new Map;if(t.size===0)return e;let o=new Set(t),n=wo(),r=new Set,i=n.currentNode;for(;(i=n.nextNode())&&o.size>0;)for(let s of o){let a=Qs(i,s);if(!a||r.has(a.rootElement))continue;r.add(a.rootElement);let l=a.rootElement.getBoundingClientRect();e.set(s,l.top+window.scrollY),o.delete(s);break}for(let s of o)e.set(s,1/0);return e}function wo(){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 Ze(t){let e={selector:qs(t),tagName:t.tagName.toLowerCase()};t.id&&(e.id=t.id),t.classList.length>0&&(e.className=Array.from(t.classList).join(" "));let o=$o(t);o&&o.length>0&&o.length<200&&(e.textContent=o);let n={};for(let s of t.attributes)s.name.startsWith("data-")&&(n[s.name]=s.value);Object.keys(n).length>0&&(e.dataAttributes=n);let r=qn(t);r&&(e.reactComponent=r.name);let i=Dc(t);return i&&(e.context=i),e}function $o(t){let e="";for(let o of t.childNodes)o.nodeType===Node.TEXT_NODE&&(e+=o.textContent||"");return e.trim()}function Yn(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 Dc(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 ta(t){let e=new Set,o=[],n=window.scrollX,r=window.scrollY,i=[{x:(t.minX+t.maxX)/2,y:(t.minY+t.maxY)/2},{x:t.minX,y:t.minY},{x:t.maxX,y:t.minY},{x:t.minX,y:t.maxY},{x:t.maxX,y:t.maxY}];for(let s of i){let a=s.x-n,l=s.y-r;if(a<0||l<0||a>window.innerWidth||l>window.innerHeight)continue;let c=Yn(a,l);c&&!e.has(c)&&(e.add(c),o.push(Ze(c)))}return o.slice(0,3)}function $r(t){if(t.length===0)return[];let e=t.map(n=>n.x),o=t.map(n=>n.y);return ta({minX:Math.min(...e),minY:Math.min(...o),maxX:Math.max(...e),maxY:Math.max(...o)})}function Wr(t){let e=t.x+t.width/2,o=t.y+t.height/2,n=e-window.scrollX,r=o-window.scrollY,i=Yn(n,r);if(!i||!(i instanceof HTMLElement))return null;if(!i.hasAttribute("data-pm")){let d=Math.random().toString(36).substring(2,9);i.setAttribute("data-pm",d)}let a=`[data-pm="${i.getAttribute("data-pm")}"]`,l=Ze(i),c=i.getBoundingClientRect();return{selector:a,info:l,rect:c}}function Oe(t,e){return t.style.getPropertyValue(e)!==""}function Nc(t,e=30){if(t<=0)return[];let o=[],n=wo(),r=.5,i=n.currentNode;for(;(i=n.nextNode())&&o.length<e;){let s=i,a=s.getBoundingClientRect();if(a.bottom<-50||a.top>window.innerHeight+50||a.right<-50||a.left>window.innerWidth+50||a.width<1||a.height<1)continue;let l=getComputedStyle(s);!Oe(s,"padding-top")&&Math.abs((parseFloat(l.paddingTop)||0)-t)<r&&o.push({element:s,property:"padding-top"}),!Oe(s,"padding-bottom")&&Math.abs((parseFloat(l.paddingBottom)||0)-t)<r&&o.length<e&&o.push({element:s,property:"padding-bottom"}),!Oe(s,"padding-left")&&Math.abs((parseFloat(l.paddingLeft)||0)-t)<r&&o.length<e&&o.push({element:s,property:"padding-left"}),!Oe(s,"padding-right")&&Math.abs((parseFloat(l.paddingRight)||0)-t)<r&&o.length<e&&o.push({element:s,property:"padding-right"}),!Oe(s,"margin-top")&&Math.abs((parseFloat(l.marginTop)||0)-t)<r&&o.length<e&&o.push({element:s,property:"margin-top"}),!Oe(s,"margin-bottom")&&Math.abs((parseFloat(l.marginBottom)||0)-t)<r&&o.length<e&&o.push({element:s,property:"margin-bottom"}),!Oe(s,"margin-left")&&Math.abs((parseFloat(l.marginLeft)||0)-t)<r&&o.length<e&&o.push({element:s,property:"margin-left"}),!Oe(s,"margin-right")&&Math.abs((parseFloat(l.marginRight)||0)-t)<r&&o.length<e&&o.push({element:s,property:"margin-right"});let c=l.display;if((c.includes("flex")||c.includes("grid"))&&o.length<e){let d=Oe(s,"gap"),p=parseFloat(l.gap)||0,u=parseFloat(l.rowGap)||0,g=parseFloat(l.columnGap)||0;!d&&Math.abs(p-t)<r?o.push({element:s,property:"gap"}):!Oe(s,"row-gap")&&Math.abs(u-t)<r?o.push({element:s,property:"row-gap"}):!Oe(s,"column-gap")&&Math.abs(g-t)<r&&o.push({element:s,property:"column-gap"})}}return o}function Yr(t,e=30){if(t<=0)return[];let o=[],n=wo(),r=.5,i=n.currentNode;for(;(i=n.nextNode())&&o.length<e;){let s=i,a=s.getBoundingClientRect();if(a.bottom<-50||a.top>window.innerHeight+50||a.right<-50||a.left>window.innerWidth+50||a.width<1||a.height<1)continue;let l=getComputedStyle(s),c=parseFloat(l.borderTopWidth)||0,d=parseFloat(l.borderRightWidth)||0,p=parseFloat(l.borderBottomWidth)||0,u=parseFloat(l.borderLeftWidth)||0,g=s.clientWidth,f=s.clientHeight,h=parseFloat(l.paddingTop)||0;!Oe(s,"padding-top")&&Math.abs(h-t)<r&&o.push({x:a.left+u,y:a.top+c,width:g,height:t,direction:"vertical",property:"padding-top"});let x=parseFloat(l.paddingBottom)||0;!Oe(s,"padding-bottom")&&Math.abs(x-t)<r&&o.length<e&&o.push({x:a.left+u,y:a.top+c+f-t,width:g,height:t,direction:"vertical",property:"padding-bottom"});let y=parseFloat(l.paddingLeft)||0;!Oe(s,"padding-left")&&Math.abs(y-t)<r&&o.length<e&&o.push({x:a.left+u,y:a.top+c,width:t,height:f,direction:"horizontal",property:"padding-left"});let P=parseFloat(l.paddingRight)||0;!Oe(s,"padding-right")&&Math.abs(P-t)<r&&o.length<e&&o.push({x:a.left+u+g-t,y:a.top+c,width:t,height:f,direction:"horizontal",property:"padding-right"});let C=parseFloat(l.marginTop)||0;!Oe(s,"margin-top")&&Math.abs(C-t)<r&&o.length<e&&o.push({x:a.left,y:a.top-t,width:a.width,height:t,direction:"vertical",property:"margin-top"});let M=parseFloat(l.marginBottom)||0;!Oe(s,"margin-bottom")&&Math.abs(M-t)<r&&o.length<e&&o.push({x:a.left,y:a.bottom,width:a.width,height:t,direction:"vertical",property:"margin-bottom"});let T=parseFloat(l.marginLeft)||0;!Oe(s,"margin-left")&&Math.abs(T-t)<r&&o.length<e&&o.push({x:a.left-t,y:a.top,width:t,height:a.height,direction:"horizontal",property:"margin-left"});let z=parseFloat(l.marginRight)||0;!Oe(s,"margin-right")&&Math.abs(z-t)<r&&o.length<e&&o.push({x:a.right,y:a.top,width:t,height:a.height,direction:"horizontal",property:"margin-right"});let R=l.display;if((R.includes("flex")||R.includes("grid"))&&o.length<e&&!Oe(s,"gap")){let q=Array.from(s.children).filter(et=>{let B=getComputedStyle(et);return B.display!=="none"&&B.position!=="absolute"&&B.position!=="fixed"});if(q.length>=2)for(let et=0;et<q.length-1&&o.length<e;et++){let B=q[et].getBoundingClientRect(),U=q[et+1].getBoundingClientRect(),tt=U.top-B.bottom;Math.abs(tt-t)<r&&tt>.5&&o.push({x:Math.min(B.left,U.left),y:B.bottom,width:Math.max(B.right,U.right)-Math.min(B.left,U.left),height:tt,direction:"vertical",property:"gap"});let kt=U.left-B.right;Math.abs(kt-t)<r&&kt>.5&&o.push({x:B.right,y:Math.min(B.top,U.top),width:kt,height:Math.max(B.bottom,U.bottom)-Math.min(B.top,U.top),direction:"horizontal",property:"gap"})}}}return o}function ur(t){return typeof t=="string"?{value:t}:t}var na={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 ea(t,e){let o=na[e];return o?o.includes(t):!1}function Fc(t,e){let o=t.split(/\s+/);for(let n of o){if(n===e)return!0;let r=n.lastIndexOf(":");if(r>=0&&n.slice(r+1)===e)return!0}return!1}function Hc(t){var a,l;let e=t.lastIndexOf(":"),o=e>=0?t.slice(e+1):t,n=o.indexOf("-");if(n<0)return null;let r=o.slice(0,n),i={gap:"gap","gap-x":"column-gap","gap-y":"row-gap",p:"padding",pt:"padding-top",pb:"padding-bottom",pl:"padding-left",pr:"padding-right",px:"padding-left",py:"padding-top",m:"margin",mt:"margin-top",mb:"margin-bottom",ml:"margin-left",mr:"margin-right",mx:"margin-left",my:"margin-top"},s=o.slice(0,o.indexOf("-",n+1)>0?o.indexOf("-",n+1):n);return(l=(a=i[s])!=null?a:i[r])!=null?l:null}function jr(t,e=30){let o=parseFloat(t.value);if(isNaN(o)||o<=0)return[];if(t.bindings&&t.bindings.length>0){let r=[],i=wo(),s=i.currentNode;for(;(s=i.nextNode())&&r.length<e;){let a=s,l=a.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let c=a.className;if(typeof c=="string")for(let d of t.bindings){if(!Fc(c,d))continue;let p=Hc(d);if(p&&!(t.property&&!ea(p,t.property))){r.push({element:a,property:p});break}}}return r}let n=Nc(o,e*2);return t.property?n.filter(r=>ea(r.property,t.property)).slice(0,e):n.slice(0,e)}function Gr(t,e=30){let o=jr(t,e),n=[];for(let r of o){let i=r.element,s=i.getBoundingClientRect(),a=getComputedStyle(i),l=parseFloat(a.borderTopWidth)||0,c=parseFloat(a.borderRightWidth)||0,d=parseFloat(a.borderLeftWidth)||0,p=i.clientWidth,u=i.clientHeight;switch(r.property){case"padding-top":{let g=parseFloat(a.paddingTop)||0;n.push({x:s.left+d,y:s.top+l,width:p,height:g,direction:"vertical",property:r.property});break}case"padding-bottom":{let g=parseFloat(a.paddingBottom)||0;n.push({x:s.left+d,y:s.top+l+u-g,width:p,height:g,direction:"vertical",property:r.property});break}case"padding-left":{let g=parseFloat(a.paddingLeft)||0;n.push({x:s.left+d,y:s.top+l,width:g,height:u,direction:"horizontal",property:r.property});break}case"padding-right":{let g=parseFloat(a.paddingRight)||0;n.push({x:s.left+d+p-g,y:s.top+l,width:g,height:u,direction:"horizontal",property:r.property});break}case"margin-top":{let g=parseFloat(a.marginTop)||0;n.push({x:s.left,y:s.top-g,width:s.width,height:g,direction:"vertical",property:r.property});break}case"margin-bottom":{let g=parseFloat(a.marginBottom)||0;n.push({x:s.left,y:s.bottom,width:s.width,height:g,direction:"vertical",property:r.property});break}case"margin-left":{let g=parseFloat(a.marginLeft)||0;n.push({x:s.left-g,y:s.top,width:g,height:s.height,direction:"horizontal",property:r.property});break}case"margin-right":{let g=parseFloat(a.marginRight)||0;n.push({x:s.right,y:s.top,width:g,height:s.height,direction:"horizontal",property:r.property});break}case"gap":case"row-gap":case"column-gap":{let g=Array.from(i.children).filter(f=>{let h=getComputedStyle(f);return h.display!=="none"&&h.position!=="absolute"&&h.position!=="fixed"});for(let f=0;f<g.length-1&&n.length<e;f++){let h=g[f].getBoundingClientRect(),x=g[f+1].getBoundingClientRect(),y=x.top-h.bottom;y>.5&&n.push({x:Math.min(h.left,x.left),y:h.bottom,width:Math.max(h.right,x.right)-Math.min(h.left,x.left),height:y,direction:"vertical",property:"gap"});let P=x.left-h.right;P>.5&&n.push({x:h.right,y:Math.min(h.top,x.top),width:P,height:Math.max(h.bottom,x.bottom)-Math.min(h.top,x.top),direction:"horizontal",property:"gap"})}break}}}return n}function oa(t,e){let o=new Set,n=Wo(e);for(let r of t){let i=ia[r.property];if(!i)continue;let s=r.element.className;if(typeof s=="string")for(let a of i){let l=`${a}-${n}`;for(let c of s.split(/\s+/)){let d=c.lastIndexOf(":"),p=d>=0?c.slice(d+1):c;if(p===l){o.add(p);break}}}}return[...o]}function ra(t){let e=new Set;for(let o of t)for(let[n,r]of Object.entries(na))if(r.includes(o.property)){e.add(n);break}if(e.size===1)return[...e][0]}function Jr(t,e,o){if(e===o)return t;let n=Wo(e),r=Wo(o);return t.map(i=>{let s=i.lastIndexOf("-");if(s<0)return i;let a=i.slice(0,s),l=i.slice(s+1);return l===n||l===`[${e}px]`?`${a}-${r}`:i})}var _c={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 Wo(t){var e;return(e=_c[t])!=null?e:`[${t}px]`}var ia={"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 zc(t,e,o,n){let r=ia[e];if(!r)return null;let i=Wo(o);for(let s of r){let a=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+s+"-(?:"+$c(i)+"|\\["+o+"px\\]))(?:\\s|$)"),l=t.match(a);if(l!=null&&l[1]){let c=Wo(n),d=l[1].lastIndexOf(":"),p=d>=0?l[1].slice(0,d+1):"";return{matched:l[1],suggested:`${p}${s}-${c}`}}}return null}function $c(t){return t.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function sa(t,e,o){let n=new Set,r=[];for(let i of t){let s=hn(i.element),a=`${s}::${i.property}`;if(n.has(a))continue;n.add(a);let l=qn(i.element),c=i.element.className||"",d=zc(c,i.property,e,o);r.push({selector:s,reactComponent:l==null?void 0:l.name,className:c,property:i.property,matchedClass:d==null?void 0:d.matched,suggestedClass:d==null?void 0:d.suggested})}return r}function Yo(t,e){return window.getComputedStyle(t).getPropertyValue(e)}function Vr(t,e){if(t instanceof HTMLElement){let n=t.style.getPropertyValue(e);if(n)return n}let o=Wc(t,e);return o&&o.includes("var(")?o:Yo(t,e)}function Wc(t,e){let o=e.replace(/-([a-z])/g,(n,r)=>r.toUpperCase());try{for(let n of document.styleSheets)try{let r=n.cssRules||n.rules;for(let i of r)if(i instanceof CSSStyleRule&&t.matches(i.selectorText)){let s=i.style.getPropertyValue(e);if(s&&s.includes("var("))return s;let a=i.style[o];if(a&&a.includes("var("))return a}}catch(r){}}catch(n){}return null}function pr(t,e){if(t instanceof HTMLElement){let n=t.style.getPropertyValue(e);if(n)return n}let o=e.replace(/-([a-z])/g,(n,r)=>r.toUpperCase());try{for(let n of document.styleSheets)try{let r=n.cssRules||n.rules;for(let i of r)if(i instanceof CSSStyleRule&&t.matches(i.selectorText)){let s=i.style.getPropertyValue(e);if(s)return s;let a=i.style[o];if(a)return a}}catch(r){}}catch(n){}return null}function fr(t){let e=window.getComputedStyle(t).display;return e==="flex"||e==="inline-flex"||e==="grid"||e==="inline-grid"}function jo(t){let e=window.getComputedStyle(t);return{row:parseFloat(e.rowGap)||0,column:parseFloat(e.columnGap)||0}}function Yc(t){let e=[];for(let o of t){let n=e.find(r=>r.axis!==o.axis?!1:o.axis==="row"?Math.abs(r.y-o.y)<2&&Math.abs(r.h-o.h)<2:Math.abs(r.x-o.x)<2&&Math.abs(r.w-o.w)<2);if(n)if(o.axis==="row"){let r=Math.min(n.x,o.x),i=Math.max(n.x+n.w,o.x+o.w);n.x=r,n.w=i-r}else{let r=Math.min(n.y,o.y),i=Math.max(n.y+n.h,o.y+o.h);n.y=r,n.h=i-r}else e.push(m({},o))}return e}function Qn(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(),i=window.getComputedStyle(t).flexDirection,s=i==="column"||i==="column-reverse",a=6;for(let l=0;l<e.length-1;l++){let c=e[l].getBoundingClientRect(),d=e[l+1].getBoundingClientRect();if(d.left>c.right+.5&&o.push({axis:"column",x:c.right,y:n.top,w:d.left-c.right,h:n.height}),d.top>c.bottom+.5&&o.push({axis:"row",x:n.left,y:c.bottom,w:n.width,h:d.top-c.bottom}),!(d.left>c.right+.5)&&!(d.top>c.bottom+.5))if(s){let p=(c.bottom+d.top)/2;o.push({axis:"row",x:n.left,y:p-a/2,w:n.width,h:a})}else{let p=(c.right+d.left)/2;o.push({axis:"column",x:p-a/2,y:n.top,w:a,h:n.height})}}return Yc(o)}function Xr(t,e){let o=window.getComputedStyle(t),n=o.display;if(n!=="flex"&&n!=="inline-flex")return!1;let r=o.justifyContent;if(r!=="space-between"&&r!=="space-around"&&r!=="space-evenly"&&r!=="stretch")return!1;let i=o.flexDirection;return!(e!==(i==="column"||i==="column-reverse"?"row":"column")||parseFloat(e==="row"?o.rowGap:o.columnGap)>0)}function ko(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 to(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 Ur(t){for(let e of t.childNodes)if(e.nodeType===Node.TEXT_NODE&&(e.textContent||"").trim().length>0)return!0;return!1}function Eo(t){var d,p;let e=document.createRange(),o=!1;for(let u of t.childNodes)u.nodeType===Node.TEXT_NODE&&(u.textContent||"").trim().length>0&&(o||(e.setStart(u,0),o=!0),e.setEnd(u,(p=(d=u.textContent)==null?void 0:d.length)!=null?p:0));if(!o)return null;let n=e.getBoundingClientRect(),r=window.getComputedStyle(t),i=parseFloat(r.fontSize)||16,s=parseFloat(r.lineHeight);isNaN(s)&&(s=i*1.2);let a=Math.max(1,e.getClientRects().length),l=Math.max(n.height,a*s),c=(l-n.height)/2;return new DOMRect(n.x,n.y-c,n.width,l)}function Go(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 Kr(t,e,o){t instanceof HTMLElement&&t.style.removeProperty(e)}function gr(t){var e;for(let o of t){let n=Ke(o.selector);if(!n&&o.durableSelector&&(n=Ke(o.durableSelector),n)){let r=(e=o.selector.match(/\[data-pm="([^"]+)"\]/))==null?void 0:e[1];r&&n.setAttribute("data-pm",r)}if(n)for(let r of o.changes)Jt(n,r.property,r.modified)}}function Zr(t,e){let o=Ke(t);if(!o)return;let n=e.find(r=>r.selector===t);if(n)for(let r of n.changes)Kr(o,r.property,r.original)}function mr(t){for(let e of t){let o=Ke(e.selector);if(o)for(let n of e.changes)Kr(o,n.property,n.original)}}function la(t,e,o,n){if(t)for(let r of t){if(r instanceof CSSGroupingRule){la(r.cssRules,e,o,n);continue}if(r instanceof CSSStyleRule){let i=r.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&jc(r.style,e,o,n)}}}function jc(t,e,o,n){for(let r=0;r<t.length;r++){let i=t[r];if(i!=null&&i.startsWith("--")){if(o.has(i))continue;o.add(i);let s=e.getPropertyValue(i).trim();ca(s)&&n.push({name:i,value:s,usage:`var(${i})`})}}}var hr=null,Gc=5e3;function qr(){if(hr&&Date.now()-hr.timestamp<Gc)return hr.variables;let t=[],e=new Set,o=getComputedStyle(document.documentElement);try{for(let i of document.styleSheets)try{la(i.cssRules||i.rules,o,e,t)}catch(s){}}catch(i){}let n=document.documentElement.style;for(let i=0;i<n.length;i++){let s=n[i];if(s!=null&&s.startsWith("--")&&!e.has(s)){e.add(s);let a=o.getPropertyValue(s).trim();ca(a)&&t.push({name:s,value:a,usage:`var(${s})`})}}let r=t.sort((i,s)=>i.name.localeCompare(s.name));return hr={variables:r,timestamp:Date.now()},r}function ca(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 Jo(t,e){let o=e.match(/var\((--[^,)]+)(?:,\s*([^)]+))?\)/);if(o){let n=o[1],r=o[2];return getComputedStyle(document.documentElement).getPropertyValue(n).trim()||r||e}return e}function Vo(t,e){if(!t)return null;let o=aa(t);if(!o)return null;for(let n of e){let r=aa(n.value);if(r&&o===r)return n}return null}function aa(t){if(!t)return null;let e=t.trim().toLowerCase();if(e.startsWith("oklch(")){let o=e.match(/oklch\(\s*([\d.]+%?)\s+([\d.]+%?)\s+([\d.]+)/);if(o){let n=o[1].endsWith("%")?parseFloat(o[1])/100:parseFloat(o[1]),r=o[2].endsWith("%")?parseFloat(o[2])/100:parseFloat(o[2]),i=parseFloat(o[3]);n=Math.round(n*100)/100,r=Math.round(r*1e3)/1e3;let s=Math.round(i);return`oklch(${n} ${r} ${s})`}}if(e.startsWith("rgb")){let o=e.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(o)return`rgb(${o[1]},${o[2]},${o[3]})`}return e.startsWith("#")?e.length===4?`#${e[1]}${e[1]}${e[2]}${e[2]}${e[3]}${e[3]}`:e.slice(0,7):e}var Jc=new Set(["button","a","input","select","textarea"]),Vc=new Set(["button","link"]),Xc=new Set(["h1","h2","h3","h4","h5","h6","nav","main","header","footer","section","article","aside"]),Uc=["fontSize","fontWeight","fontFamily","lineHeight","letterSpacing","color","backgroundColor","padding","gap","borderRadius","boxShadow"];var Qr=150;function Kc(t){let e=0,o=t.parentElement;for(;o&&o!==document.body;)e++,o=o.parentElement;return e}function Zc(t){return!(t.startsWith("_")||t.startsWith("css-")||t.length>30)}function qc(t){let e=Array.from(t.classList).filter(Zc).slice(0,3);return e.length>0?e.join(" "):void 0}function Qc(t,e){let o=window.getComputedStyle(t),n=e?window.getComputedStyle(e):null,r={};for(let i of Uc){let s=o.getPropertyValue(i.replace(/[A-Z]/g,a=>`-${a.toLowerCase()}`));if(s&&!(i==="backgroundColor"&&(s==="rgba(0, 0, 0, 0)"||s==="transparent"))&&!(i==="boxShadow"&&s==="none")){if(i==="boxShadow"&&(s="yes"),i==="fontFamily"&&(s=s.split(",")[0].trim().replace(/['"]/g,"")),n){let a=n.getPropertyValue(i.replace(/[A-Z]/g,l=>`-${l.toLowerCase()}`));if(s===a)continue}r[i]=s}}return Object.keys(r).length>0?r:void 0}function td(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 ed(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 nd(t){let e=t.tagName.toLowerCase(),o=$o(t);if(o&&o.length>0||Jc.has(e))return!0;let n=t.getAttribute("role");return!!(n&&Vc.has(n)||Xc.has(e)||(e==="img"||e==="svg")&&(t.getAttribute("alt")||t.getAttribute("aria-label")))}function da(){var c,d,p,u,g;let t=[],e=document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT),o=e.nextNode();for(;o;){let f=o;if(o=e.nextNode(),ed(f)||!td(f))continue;let h=f.getBoundingClientRect();if(h.width<1||h.height<1||!nd(f))continue;let x=f.tagName.toLowerCase(),y=$o(f),P=Kc(f),C=f.getAttribute("role")||void 0,M=x==="a"&&f.getAttribute("href")||void 0,T=x==="img"&&f.getAttribute("alt")||void 0,z=(c=qn(f))==null?void 0:c.name,R=qc(f),H=Qc(f,f.parentElement),q={tag:x,rect:{x:Math.round(h.left+window.scrollX),y:Math.round(h.top+window.scrollY),w:Math.round(h.width),h:Math.round(h.height)},depth:P};y&&(q.text=y.length>80?y.slice(0,80)+"...":y),z&&(q.component=z),R&&(q.classes=R),H&&(q.styles=H),C&&(q.role=C),M&&(q.href=M),T&&(q.alt=T),t.push({el:f,entry:q})}t.sort((f,h)=>h.entry.depth-f.entry.depth);let n=new Set;for(let f=0;f<t.length;f++){let h=t[f];if(n.has(h.el))continue;let x=h.el.parentElement;if(!x||!t.find(M=>M.el===x))continue;let P=(d=h.el.textContent)==null?void 0:d.trim(),C=(p=x.textContent)==null?void 0:p.trim();P&&C&&P===C&&n.add(h.el)}let r=t.filter(f=>!n.has(f.el)),i=new Map;for(let f of r){let h=f.el.parentElement,x=[h?Array.from(h.classList).join("."):"",f.entry.tag,(u=f.entry.component)!=null?u:"",f.entry.styles?JSON.stringify(f.entry.styles):""].join("|"),y=(g=i.get(x))!=null?g:[];y.push(f),i.set(x,y)}let s=[],a=new Set;for(let[,f]of i)if(f.length>3){s.push(f[0].entry,f[1].entry),a.add(f[0].el),a.add(f[1].el);let h=1/0,x=1/0,y=-1/0,P=-1/0;for(let C=2;C<f.length;C++){let M=f[C].entry.rect;h=Math.min(h,M.x),x=Math.min(x,M.y),y=Math.max(y,M.x+M.w),P=Math.max(P,M.y+M.h)}s.push({tag:f[0].entry.tag,text:`(+${f.length-2} similar items)`,rect:{x:Math.round(h),y:Math.round(x),w:Math.round(y-h),h:Math.round(P-x)},depth:f[0].entry.depth});for(let C of f)a.add(C.el)}for(let f of r)a.has(f.el)||s.push(f.entry);let l=Math.max(document.documentElement.scrollHeight,1);if(s.sort((f,h)=>{let x=f.rect.w*f.rect.h,y=h.rect.w*h.rect.h,P=x*(1+.5*(1-f.rect.y/l));return y*(1+.5*(1-h.rect.y/l))-P}),s.length>Qr){let f=s.slice(0,Qr);return f.push({tag:"truncated",text:`${s.length-Qr} additional elements omitted`,rect:{x:0,y:0,w:0,h:0},depth:0}),f}return s}import{domToCanvas as od}from"modern-screenshot";function ei(t){let e=document.createElement("canvas").getContext("2d");return e?(e.fillStyle=t,e.fillStyle):"#888888"}function yr(t,e=[],o,n){let r=new Map,i=[];for(let a of t)if(a.groupId){let l=r.get(a.groupId)||[];l.push(a),r.set(a.groupId,l)}else i.push(a);let s=[];for(let[a,l]of r){let c=l.find(p=>p.type!=="text"),d=l.find(p=>p.type==="text");if(c){let p=c.linkedSelector||(d==null?void 0:d.linkedSelector),u=(d==null?void 0:d.imageCount)||c.imageCount;s.push(m(b(m({id:c.id,type:c.type,instruction:d==null?void 0:d.text},p?{linkedSelector:p}:{}),{elements:c.elements||[]}),u?{imageCount:u}:{}))}}for(let a of i)s.push(m(b(m({id:a.id,type:a.type,instruction:a.type==="text"?a.text:void 0},a.linkedSelector?{linkedSelector:a.linkedSelector}:{}),{elements:a.elements||[]}),a.imageCount?{imageCount:a.imageCount}:{}));return m(m({timestamp:new Date().toISOString(),url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},scrollPosition:{x:window.scrollX,y:window.scrollY},annotations:s,styleModifications:e},o?{inspectedElement:o}:{}),n&&n.length>0?{spacingTokenChanges:n}:{})}function ua(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 rd(t,e){if(t.length===0)return[];let o=t.map(d=>({annotation:d,bounds:ua(d)})).filter(d=>d.bounds!==null);if(o.length===0)return[];o.sort((d,p)=>d.bounds.minY-p.bounds.minY);let n=Math.min(...o.map(d=>d.bounds.minY)),r=Math.max(...o.map(d=>d.bounds.maxY));if(r-n<=e){let d=(n+r)/2,p=Math.max(0,d-e/2);return[{top:p,bottom:p+e,annotations:t}]}let i=[],s=50,a=Math.max(0,n-s),l=[],c=a;for(let{annotation:d,bounds:p}of o){let u=p.maxY+s;if(u-a<=e)l.push(d),c=Math.max(c,u);else{if(l.length>0){let g=(a+c)/2,f=Math.max(0,g-e/2);i.push({top:f,bottom:f+e,annotations:l})}a=Math.max(0,p.minY-s),l=[d],c=p.maxY+s}}if(l.length>0){let d=(a+c)/2,p=Math.max(0,d-e/2);i.push({top:p,bottom:p+e,annotations:l})}return i}function id(t,e,o,n){t.save(),t.scale(n,n);for(let r of e){let i=r.points.map(s=>({x:s.x,y:s.y-o}));switch(t.strokeStyle=r.color,t.fillStyle=r.color,t.lineWidth=r.strokeWidth,t.lineCap="round",t.lineJoin="round",r.type){case"freehand":if(i.length<2)break;t.beginPath(),t.moveTo(i[0].x,i[0].y);for(let s=1;s<i.length;s++)t.lineTo(i[s].x,i[s].y);t.stroke();break;case"line":if(i.length<2)break;t.beginPath(),t.moveTo(i[0].x,i[0].y),t.lineTo(i[i.length-1].x,i[i.length-1].y),t.stroke();break;case"rectangle":{if(i.length<2)break;let s=i[0],a=i[i.length-1],l=Math.min(s.x,a.x),c=Math.min(s.y,a.y),d=Math.abs(a.x-s.x),p=Math.abs(a.y-s.y);t.strokeRect(l,c,d,p);break}case"circle":{if(i.length<2)break;let s=i[0],a=i[i.length-1],l=(s.x+a.x)/2,c=(s.y+a.y)/2,d=Math.abs(a.x-s.x)/2,p=Math.abs(a.y-s.y)/2;t.beginPath(),t.ellipse(l,c,d,p,0,0,Math.PI*2),t.stroke();break}case"text":{if(!r.text||i.length<1)break;let s=i[0],a=r.fontSize||16;t.font=`${a}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`,t.fillStyle=r.color;let c=(r.imageCount&&r.imageCount>0?`[${r.imageCount} image${r.imageCount>1?"s":""}] ${r.text}`:r.text).split(`
|
|
3
|
-
`),d=a*1.2,p=4,u=0;for(let g of c)u=Math.max(u,t.measureText(g).width);t.fillRect(s.x-p,s.y-p,u+p*2,c.length*d+p*2),t.fillStyle="#ffffff",c.forEach((g,f)=>{t.fillText(g,s.x,s.y+a+f*d)});break}}}t.restore()}async function ni(t,e,o=[]){try{let n=window.devicePixelRatio||1,r=window.innerWidth,i=window.innerHeight,s=o.filter(c=>{var d;return((d=c.status)!=null?d:"pending")==="pending"});console.log("[Screenshot] Starting capture with",s.length,"active annotations (filtered",o.length-s.length,"captured)");let a=rd(s,i);if(a.length===0){let c=await ti(t,[],window.scrollY,r,i,n);return c?[c]:[]}let l=[];for(let c=0;c<a.length;c++){let d=a[c],p=await ti(t,d.annotations,d.top,r,i,n);p?l.push(p):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 ti(t,e,o,n,r,i){try{let s=await od(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:i,backgroundColor:"#ffffff",width:n,height:r,style:{transform:`translate(${-window.scrollX}px, ${-o}px)`}}),a=document.createElement("canvas");a.width=n*i,a.height=r*i;let l=a.getContext("2d");return l?(l.drawImage(s,0,0,n*i,r*i,0,0,n*i,r*i),id(l,e,o,i),new Promise(c=>{a.toBlob(d=>c(d),"image/png")})):null}catch(s){return console.error("Region capture failed:",s),null}}async function br(t){if(t.length===0)return null;if(t.length===1)return t[0];let e=await Promise.all(t.map(a=>new Promise((l,c)=>{let d=new Image;d.onload=()=>l(d),d.onerror=c,d.src=URL.createObjectURL(a)}))),o=e[0].width,n=e.reduce((a,l)=>a+l.height,0),r=document.createElement("canvas");r.width=o,r.height=n;let i=r.getContext("2d");if(!i)return null;let s=0;for(let a of e)i.drawImage(a,0,s),s+=a.height,URL.revokeObjectURL(a.src);return new Promise(a=>{r.toBlob(l=>a(l),"image/png")})}async function xr(t,e=[]){let n=window.innerWidth,r=window.innerHeight,i=Math.max(document.body.scrollHeight,document.documentElement.scrollHeight),s=window.scrollX,a=window.scrollY,l=[];try{let c=Math.ceil(i/r);for(let d=0;d<c;d++){let p=d*r;window.scrollTo(s,p),await new Promise(x=>requestAnimationFrame(()=>requestAnimationFrame(()=>x())));let u=p,g=p+r,f=e.filter(x=>{let y=ua(x);return y?y.maxY>=u&&y.minY<=g:!1}),
|
|
4
|
-
`),c=i!==void 0?[i+". "+(l[0]||""),...l.slice(1)]:l;t.font=`${r}px ${
|
|
5
|
-
`),kt=i.get(y.id),at=kt!==void 0?[kt+". "+(tt[0]||""),...tt.slice(1)]:tt,Et=document.createElement("canvas").getContext("2d");if(!Et)continue;Et.font=`${B}px ${
|
|
6
|
-
`),
|
|
7
|
-
`),h=i.get(d.id),x=h!==void 0?[h+". "+(f[0]||""),...f.slice(1)]:f,P=document.createElement("canvas").getContext("2d");if(!P)continue;P.font=`${u}px ${Ee}`;let C=p.x-o,M=eo(C),T=M!==void 0?Math.min(400,M):400,z=jn(P,x,T),R=Math.min(T,Math.max(...z.map(U=>P.measureText(U).width))),H=z.length*g,q=x.length*g,et=H-q,B=H+8;l.push({annotation:c,x:p.x+R+4,y:p.y-4-et,size:B})}}return l.length===0?null:Rt(Rn,{children:l.map(({annotation:c,x:d,y:p,size:u})=>Rt(md,{annotation:c,x:d-o,y:p-n,size:u,onReply:r},`question-${c.threadId}`))})}function md({annotation:t,x:e,y:o,size:n,onReply:r}){let[i,s]=no(!1),[a,l]=no(""),c=xa(null),d=xa(null);Xo(()=>{i&&c.current&&c.current.focus()},[i]),Xo(()=>{if(!i)return;let h=y=>{d.current&&!d.current.contains(y.target)&&s(!1)},x=y=>{y.key==="Escape"&&s(!1)};return document.addEventListener("mousedown",h),document.addEventListener("keydown",x),()=>{document.removeEventListener("mousedown",h),document.removeEventListener("keydown",x)}},[i]);let p=ba(()=>{!a.trim()||!t.threadId||(r(t.threadId,a.trim()),l(""),s(!1))},[a,t.threadId,r]),u=ba(h=>{h.key==="Enter"&&(h.metaKey||h.ctrlKey)&&(h.preventDefault(),p())},[p]),g=i?e:e-An,f=i?o:o-An;return ze("div",{ref:d,"data-devtools":"question-badge",style:{position:"fixed",left:`max(0px, ${g}px)`,top:`max(0px, ${f}px)`,padding:i?0:An,transform:`translate(min(0px, calc(100vw - max(0px, ${g}px) - 100%)), min(0px, calc(100vh - max(0px, ${f}px) - 100%)))`,zIndex:i?10002:9999,pointerEvents:"auto",cursor:i?void 0:"pointer"},children:[!i&&ze("div",{onClick:()=>s(!0),style:{height:n,display:"flex",alignItems:"center",backgroundColor:t.color,padding:`0 ${4}px`,gap:4,fontFamily:Ee,fontSize:12,color:"#ffffff",whiteSpace:"nowrap"},children:[ze("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?"})]}),i&&ze("div",{style:{minWidth:260,maxWidth:360,backgroundColor:"#ffffff",fontFamily:Ee,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}),ze("div",{style:{padding:`0 ${4}px ${4}px`},children:[Rt("textarea",{ref:c,value:a,onChange:h=>l(h.target.value),onKeyDown:u,placeholder:"Type your reply...",style:{width:"100%",minHeight:40,padding:4,fontSize:12,fontFamily:Ee,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:p,disabled:!a.trim(),style:{padding:"4px 12px",fontSize:11,fontFamily:Ee,fontWeight:600,backgroundColor:a.trim()?t.color:"rgba(0,0,0,0.1)",color:a.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:a.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}function vr(t){var i;let e=new Set,o=new Map;for(let s of t){if(!s.linkedSelector)continue;let a=o.get(s.linkedSelector)||[];a.push(s),o.set(s.linkedSelector,a)}let n=new Set,r=new Set;for(let s of o.values()){if(s.length<=1){(i=s[0])!=null&&i.groupId&&r.add(s[0].groupId);continue}s.sort((l,c)=>c.timestamp-l.timestamp);let a=s[0];a.groupId&&r.add(a.groupId);for(let l=1;l<s.length;l++){let c=s[l];e.add(c),c.groupId&&n.add(c.groupId)}}for(let s of t)s.groupId&&n.has(s.groupId)&&!r.has(s.groupId)&&e.add(s);return e}import{useEffect as Ta,useLayoutEffect as hd,useState as Ia}from"react";import{jsx as fi,jsxs as La}from"react/jsx-runtime";function yd(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 Ma=["top-left","top-right","bottom-right","bottom-left"];function Ra({element:t,radius:e,accentColor:o,hoveredCorner:n,draggingCorner:r,cursorViewport:i}){let[s,a]=Ia(null),[l,c]=Ia(!1);if(Ta(()=>{let y=M=>{(M.key==="Meta"||M.key==="Control")&&c(!0)},P=M=>{(M.key==="Meta"||M.key==="Control")&&c(!1)},C=()=>c(!1);return window.addEventListener("keydown",y,!0),window.addEventListener("keyup",P,!0),window.addEventListener("blur",C),()=>{window.removeEventListener("keydown",y,!0),window.removeEventListener("keyup",P,!0),window.removeEventListener("blur",C)}},[]),Ta(()=>{if(!t){a(null);return}let y=()=>{a(t.getBoundingClientRect())};return y(),window.addEventListener("scroll",y,{passive:!0}),window.addEventListener("resize",y,{passive:!0}),()=>{window.removeEventListener("scroll",y),window.removeEventListener("resize",y)}},[t]),hd(()=>{t&&a(t.getBoundingClientRect())},[t,e["top-left"],e["top-right"],e["bottom-right"],e["bottom-left"]]),!s)return null;let d=s.width,p=s.height,u=yd(o,.2),g={"top-left":{x:0,y:e["top-left"]},"top-right":{x:d,y:e["top-right"]},"bottom-right":{x:d,y:p-e["bottom-right"]},"bottom-left":{x:0,y:p-e["bottom-left"]}},f=new Set,h=r!=null?r:n;if(h)if(l)f.add(h);else for(let y of Ma)f.add(y);let x={position:"fixed",top:s.top,left:s.left,width:d,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"};return La("div",{"data-devtools":"border-radius-handles",style:x,children:[La("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${p}`,children:[fi("rect",{x:"0.5",y:"0.5",width:Math.max(0,d-1),height:Math.max(0,p-1),fill:"none",stroke:u,strokeWidth:"1"}),Ma.map(y=>{let P=g[y],C=f.has(y);return fi("circle",{cx:P.x,cy:P.y,r:y===(r!=null?r:n)?3:2.5,fill:o,stroke:"#ffffff",strokeWidth:y===(r!=null?r:n)?4:2,paintOrder:"stroke"},y)})]}),i&&h&&(()=>{let y=Math.round(e[h]);return fi("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:y})})()]})}import{useEffect as bd,useState as xd}from"react";function ro(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);if(o)return`oklch(${o[1]} / ${e})`;let n=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t);if(n){let r=parseInt(n[1],16),i=parseInt(n[2],16),s=parseInt(n[3],16);return`rgba(${r}, ${i}, ${s}, ${e})`}return`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}import{Fragment as vd,jsx as io,jsxs as Uo}from"react/jsx-runtime";function To({element:t,isSelected:e=!1,elementInfo:o,color:n="#3b82f6",annotationNumber:r,changeCount:i,hideTooltip:s=!1}){let[a,l]=xd(null);if(bd(()=>{if(!t){l(null);return}let z=()=>{let R=t.getBoundingClientRect();l(R)};return z(),window.addEventListener("scroll",z,{passive:!0}),window.addEventListener("resize",z,{passive:!0}),()=>{window.removeEventListener("scroll",z),window.removeEventListener("resize",z)}},[t]),!a||!t)return null;let c={position:"fixed",top:a.top,left:a.left,width:a.width,height:a.height,pointerEvents:"none",zIndex:9996,backgroundColor:e?ro(n,.1):ro(n,.05),overflow:"visible"},d={position:"absolute",width:2,height:2,backgroundColor:n,pointerEvents:"none"},p=t.tagName.toLowerCase(),u=t.id?`#${t.id}`:"",g=t.classList.length>0?"."+Array.from(t.classList).slice(0,2).join("."):"",f=o==null?void 0:o.reactComponent,h=f?`<${f}> ${p}${u}${g}`:`${p}${u}${g}`,x=22,y=a.height>=window.innerHeight,P=y?0:a.top>=x?a.top-x:a.bottom,C=y?{position:"absolute",top:8,left:8,zIndex:9997,display:"flex",alignItems:"center",gap:6,backgroundColor:n,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400}:{position:"fixed",top:P,left:a.left,zIndex:9997,display:"flex",alignItems:"center",gap:6,backgroundColor:n,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400},T=!s&&Uo("div",{"data-devtools":"tooltip",style:C,children:[r!==void 0&&Uo("span",{children:[r,"."]}),io("span",{style:{overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0},children:h}),i!==void 0&&i>0&&Uo("span",{style:{opacity:.8},children:["(",i," ",i===1?"change":"changes",")"]})]});return Uo(vd,{children:[Uo("div",{"data-devtools":"highlight",style:c,children:[io("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:io("rect",m({x:"0.5",y:"0.5",width:Math.max(0,a.width-1),height:Math.max(0,a.height-1),fill:"none",stroke:n,strokeWidth:"1"},!e&&{strokeDasharray:"2 4"}))}),io("div",{style:b(m({},d),{top:-1,left:-1})}),io("div",{style:b(m({},d),{top:-1,right:-1})}),io("div",{style:b(m({},d),{bottom:-1,left:-1})}),io("div",{style:b(m({},d),{bottom:-1,right:-1})}),y&&T]}),!y&&T]})}import{useEffect as Aa,useLayoutEffect as Sd,useState as gi}from"react";import{jsx as Nn,jsxs as hi}from"react/jsx-runtime";function mi(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 yi({element:t,gap:e,accentColor:o,hoveredAxis:n,draggingAxis:r,cursorViewport:i,isAutoGap:s=!1,refreshKey:a=0}){let[l,c]=gi(null),[d,p]=gi([]),[u,g]=gi(!1);if(Aa(()=>{let H=B=>{(B.key==="Meta"||B.key==="Control")&&g(!0)},q=B=>{(B.key==="Meta"||B.key==="Control")&&g(!1)},et=()=>g(!1);return window.addEventListener("keydown",H,!0),window.addEventListener("keyup",q,!0),window.addEventListener("blur",et),()=>{window.removeEventListener("keydown",H,!0),window.removeEventListener("keyup",q,!0),window.removeEventListener("blur",et)}},[]),Aa(()=>{if(!t){c(null),p([]);return}let H=()=>{c(t.getBoundingClientRect()),p(Qn(t))};return H(),window.addEventListener("scroll",H,{passive:!0}),window.addEventListener("resize",H,{passive:!0}),()=>{window.removeEventListener("scroll",H),window.removeEventListener("resize",H)}},[t]),Sd(()=>{t&&(c(t.getBoundingClientRect()),p(Qn(t)))},[t,e.row,e.column,a]),!l||d.length===0)return null;let f=l.width,h=l.height,x="pm-gap-stripe-pattern",y=mi(o,.25),P=mi(o,.1),C=mi(o,.2),M=8,T=2,z={position:"fixed",top:l.top,left:l.left,width:f,height:h,pointerEvents:"none",zIndex:9996,overflow:"visible"},R=r!=null?r:n;return hi("div",{"data-devtools":"gap-handles",style:z,children:[hi("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${f} ${h}`,children:[Nn("defs",{children:Nn("pattern",{id:x,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Nn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:y,strokeWidth:"1.5"})})}),Nn("rect",{x:"0.5",y:"0.5",width:Math.max(0,f-1),height:Math.max(0,h-1),fill:"none",stroke:C,strokeWidth:"1"}),d.map((H,q)=>{let et=H.x-l.left,B=H.y-l.top,U=H.w,tt=H.h,kt=u?H.axis===R:!0;return(H.axis==="row"?e.row:e.column)===0?null:hi("g",{opacity:kt?1:.6,children:[Nn("rect",{x:et,y:B,width:U,height:tt,fill:P}),Nn("rect",{x:et,y:B,width:U,height:tt,fill:`url(#${x})`})]},q)}),R&&(()=>{let H=d.filter(_t=>_t.axis===R);if(H.length===0)return null;let q=H[0];if(i&&H.length>1){let _t=1/0;for(let St of H){let Vt=St.x+St.w/2,qt=St.y+St.h/2,Ot=Math.abs(i.x-Vt)+Math.abs(i.y-qt);Ot<_t&&(_t=Ot,q=St)}}let et=q.x-l.left,B=q.y-l.top,U=q.w,tt=q.h,kt=et+U/2,at=B+tt/2;if(s)return Nn("circle",{cx:kt,cy:at,r:1.5,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let Nt=R==="column",Et=Nt?T:M,Dt=Nt?M:T,Ft=kt-Et/2,G=at-Dt/2;return Nn("rect",{x:Ft,y:G,width:Et,height:Dt,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),i&&R&&(()=>{let H=s?"auto":String(Math.round(R==="row"?e.row:e.column));return Nn("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:H})})()]})}import{useCallback as Td,useEffect as Id,useState as Md}from"react";import{useEffect as wd,useState as Pa}from"react";var kd=3,Ed=250,bi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Cd=3e3;function Sr(t){let[e,o]=Pa(0),[n,r]=Pa(()=>Math.floor(Math.random()*bi.length));return wd(()=>{if(!t)return;let i=setInterval(()=>o(a=>(a+1)%kd),Ed),s=setInterval(()=>r(a=>(a+1)%bi.length),Cd);return()=>{clearInterval(i),clearInterval(s)}},[t]),{charIndex:e,word:bi[n]}}import{Fragment as xi,jsx as bn,jsxs as Io}from"react/jsx-runtime";function Ld(t){let{element:e}=t,o=e.tagName,n=e.id?`#${e.id}`:"",r=e.className?"."+e.className.split(" ").slice(0,2).join("."):"",i=e.reactComponent;return i?`<${i}> ${o}${n}${r}`:`${o}${n}${r}`}var Ba=22,vi=12;function Rd(i){var s=i,{left:t,top:e,style:o,children:n}=s,r=Wn(s,["left","top","style","children"]);return bn("div",b(m({"data-devtools":"badge-hit-area"},r),{style:m({position:"fixed",left:`max(0px, ${t}px)`,top:`max(0px, ${e}px)`,padding:vi,transform:`translate(min(0px, calc(100vw - max(0px, ${t}px) - 100%)), min(0px, calc(100vh - max(0px, ${e}px) - 100%)))`},o),children:n}))}function Oa({styleModifications:t,isInspecting:e,accentColor:o,annotationGroupCount:n,dispatch:r,inFlightSelectors:i}){let[s,a]=Md([]),l=i&&i.size>0,{charIndex:c,word:d}=Sr(!!l);Id(()=>{if(e){a([]);return}let f=null,h=()=>{let P=[];t.forEach((C,M)=>{let T=Ke(C.selector);if(!T)return;let z=T.getBoundingClientRect();P.push({selector:C.selector,modIndex:M,top:z.top>=Ba?z.top-Ba:z.bottom,left:z.left,label:Ld(C),changeCount:C.changes.length,annotationNumber:n+M+1})}),a(P)},x=()=>{f&&cancelAnimationFrame(f),f=requestAnimationFrame(h)};h(),window.addEventListener("scroll",x,!0),window.addEventListener("resize",x,!0);let y=new MutationObserver(x);return y.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),window.addEventListener("load",x),document.fonts.ready.then(x),()=>{window.removeEventListener("scroll",x,!0),window.removeEventListener("resize",x,!0),window.removeEventListener("load",x),y.disconnect(),f&&cancelAnimationFrame(f)}},[t,e,n]);let p=Td(f=>{let h=t[f];if(!h)return;let x=Ke(h.selector);x&&(r({type:"SELECT_ANNOTATION",payload:{id:null}}),r({type:"SET_TOOL",payload:"inspector"}),r({type:"SELECT_ELEMENT",payload:{el:x,info:h.element}}))},[t,r]);if(s.length===0)return null;let u={display:"flex",alignItems:"center",gap:6,backgroundColor:o,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,whiteSpace:"nowrap",maxWidth:400},g={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return bn(xi,{children:s.map(f=>{let h=i==null?void 0:i.has(f.selector);return bn(Rd,{left:f.left-vi,top:f.top-vi,onClick:()=>p(f.modIndex),style:{zIndex:1e4,cursor:"pointer",pointerEvents:"auto"},children:Io("div",{"data-devtools":"badge",style:b(m({},u),{backgroundColor:h?"#999999":o}),children:[Io("span",{children:[f.annotationNumber,"."]}),bn("span",{style:g,children:f.label}),Io("span",{style:{opacity:.8},children:["(",f.changeCount," ",f.changeCount===1?"change":"changes",")"]}),h&&Io("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[bn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?Io(xi,{children:[bn("circle",{cx:"7",cy:"7",r:"2"}),bn("circle",{cx:"17",cy:"7",r:"2"}),bn("circle",{cx:"7",cy:"17",r:"2"}),bn("circle",{cx:"17",cy:"17",r:"2"})]}):Io(xi,{children:[bn("circle",{cx:"12",cy:"6",r:"2"}),bn("circle",{cx:"6",cy:"12",r:"2"}),bn("circle",{cx:"18",cy:"12",r:"2"}),bn("circle",{cx:"12",cy:"18",r:"2"})]})}),d]})]})},f.selector)})})}import{useEffect as Ad,useState as Pd}from"react";import{Fragment as Od,jsx as Da}from"react/jsx-runtime";function Bd(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${e})`:`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}function Na({styleModifications:t,accentColor:e}){let[o,n]=Pd([]);if(Ad(()=>{let i=null,s=()=>{let c=[];for(let d of t){let p=Ke(d.selector);if(!p)continue;let u=p.getBoundingClientRect();if(u.width===0&&u.height===0)continue;let g=to(p);c.push({selector:d.selector,top:u.top,left:u.left,width:u.width,height:u.height,borderRadius:`${g["top-left"]}px ${g["top-right"]}px ${g["bottom-right"]}px ${g["bottom-left"]}px`})}n(c)},a=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(s)};s(),window.addEventListener("scroll",a,{passive:!0}),window.addEventListener("resize",a,{passive:!0});let l=new MutationObserver(a);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",a),window.removeEventListener("resize",a),l.disconnect(),i&&cancelAnimationFrame(i)}},[t]),o.length===0)return null;let r=Bd(e,.2);return Da(Od,{children:o.map(i=>{let s={position:"fixed",top:i.top,left:i.left,width:i.width,height:i.height,pointerEvents:"none",zIndex:9995,border:`1px solid ${r}`,borderRadius:i.borderRadius,boxSizing:"border-box"};return Da("div",{"data-devtools":"mod-border",style:s},i.selector)})})}import{useEffect as Fa,useLayoutEffect as Dd,useState as Ha}from"react";import{jsx as Jn,jsxs as wi}from"react/jsx-runtime";function Si(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 Nd={top:"bottom",bottom:"top",left:"right",right:"left"};function ki({element:t,padding:e,accentColor:o,hoveredSide:n,draggingSide:r,cursorViewport:i,refreshKey:s}){let[a,l]=Ha(null),[c,d]=Ha(!1);if(Fa(()=>{let U=at=>{(at.key==="Meta"||at.key==="Control")&&d(!0)},tt=at=>{(at.key==="Meta"||at.key==="Control")&&d(!1)},kt=()=>d(!1);return window.addEventListener("keydown",U,!0),window.addEventListener("keyup",tt,!0),window.addEventListener("blur",kt),()=>{window.removeEventListener("keydown",U,!0),window.removeEventListener("keyup",tt,!0),window.removeEventListener("blur",kt)}},[]),Fa(()=>{if(!t){l(null);return}let U=()=>{l(t.getBoundingClientRect())};return U(),window.addEventListener("scroll",U,{passive:!0}),window.addEventListener("resize",U,{passive:!0}),()=>{window.removeEventListener("scroll",U),window.removeEventListener("resize",U)}},[t]),Dd(()=>{t&&l(t.getBoundingClientRect())},[t,e.top,e.right,e.bottom,e.left,s]),!a)return null;let p=a.width,u=a.height,{top:g,right:f,bottom:h,left:x}=e,y="pm-stripe-pattern",P=Si(o,.25),C=Si(o,.1),M=Si(o,.2),T=8,z=2,R={position:"fixed",top:a.top,left:a.left,width:p,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"},H=["top","right","bottom","left"],q={top:`0,0 ${p},0 ${p-f},${g} ${x},${g}`,right:`${p},0 ${p},${u} ${p-f},${u-h} ${p-f},${g}`,bottom:`0,${u} ${x},${u-h} ${p-f},${u-h} ${p},${u}`,left:`0,0 ${x},${g} ${x},${u-h} 0,${u}`},et={top:{x:p/2-T/2,y:g/2-z/2,w:T,h:z},bottom:{x:p/2-T/2,y:u-h/2-z/2,w:T,h:z},left:{x:x/2-z/2,y:u/2-T/2,w:z,h:T},right:{x:p-f/2-z/2,y:u/2-T/2,w:z,h:T}},B=new Set;return r?B.add(r):n&&(B.add(n),c||B.add(Nd[n])),wi("div",{"data-devtools":"padding-handles",style:R,children:[wi("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${p} ${u}`,children:[Jn("defs",{children:Jn("pattern",{id:y,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Jn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:P,strokeWidth:"1.5"})})}),Jn("rect",{x:"0.5",y:"0.5",width:Math.max(0,p-1),height:Math.max(0,u-1),fill:"none",stroke:M,strokeWidth:"1"}),H.map(U=>{if(e[U]<=0)return null;let kt=B.has(U);return wi("g",{opacity:kt?1:.6,children:[Jn("polygon",{points:q[U],fill:C}),Jn("polygon",{points:q[U],fill:`url(#${y})`})]},U)}),H.map(U=>{let tt=et[U],kt=B.has(U);return Jn("rect",{x:tt.x,y:tt.y,width:tt.w,height:tt.h,fill:o,stroke:"#ffffff",strokeWidth:kt?4:2,paintOrder:"stroke"},`handle-${U}`)})]}),i&&(n||r)&&(()=>{let U=r!=null?r:n,tt=Math.round(e[U]);return Jn("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:tt})})()]})}import{useCallback as Pn,useEffect as wn,useMemo as Mr,useRef as fn,useState as Ge}from"react";import{Check as Ir,ChevronDown as Ai,MoveHorizontal as Ka,RotateCcw as au,Shrink as lu,X as cu}from"lucide-react";var Fd="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",Cn={borderWidth:3,borderStyle:"solid",borderImage:`url("${Fd}") 4 / 1.9 / 0 round`};var wr={"font-size":["rem","px","em"],"line-height":["","rem","px","em"],"letter-spacing":["rem","px","em"],gap:["rem","px","em"],"column-gap":["rem","px","em"],"row-gap":["rem","px","em"],padding:["rem","px","em","%"],margin:["rem","px","em","%"],width:["rem","px","%","em"],height:["rem","px","%","em"],"min-width":["rem","px","%","em"],"max-width":["rem","px","%","em"],"min-height":["rem","px","%","em"],"max-height":["rem","px","%","em"],"border-width":["px","rem","em"],"border-radius":["rem","px","%","em"]};function Mo(t){var e,o;return(o=(e=wr[t])==null?void 0:e[0])!=null?o:"px"}function Vn(t){let e=t.match(/^([\d.-]+)(.*)$/);return e?{num:parseFloat(e[1]),unit:e[2]||""}:{num:0,unit:""}}function kr(t,e,o,n){let r=t.trim();if(!r)return"";let i=r.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i);if(i)return`${parseFloat(i[1])}${i[2].toLowerCase()}`;let s=parseFloat(r);if(!isNaN(s)){if(n){let{unit:a}=Vn(o);return`${s}${a||Mo(e)}`}return`${s}${Mo(e)}`}return r}function Ei(t,e){if(!e||e==="px")return t;if(e==="rem"){let o=parseFloat(getComputedStyle(document.documentElement).fontSize)||16;return Math.round(t/o*1e3)/1e3}return t}import{useCallback as Hd,useEffect as _d,useRef as _a,useState as zd}from"react";import{Plus as za,X as $d}from"lucide-react";import{jsx as pn,jsxs as so}from"react/jsx-runtime";var Er=[{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 Wd(t){if(!t||t==="none")return[];let e=[],o=/([\w-]+)\(([^)]+)\)/g,n;for(;(n=o.exec(t))!==null;){let r=n[1],i=n[2],s=parseFloat(i);isNaN(s)||e.push({name:r,value:s})}return e}function Ci(t){return t.length===0?"none":t.map(e=>{var r;let o=Er.find(i=>i.name===e.name),n=(r=o==null?void 0:o.unit)!=null?r:"";return`${e.name}(${e.value}${n})`}).join(" ")}function $a({value:t,onChange:e,accentColor:o,modified:n,panelContentRef:r}){let i=Wd(t),[s,a]=zd(!1),l=_a(null),c=_a(null);_d(()=>{if(!s)return;let C=M=>{l.current&&!l.current.contains(M.target)&&a(!1)};return document.addEventListener("mousedown",C,!0),()=>document.removeEventListener("mousedown",C,!0)},[s]);let d=Er.filter(C=>!i.some(M=>M.name===C.name)),p=C=>{let M=[...i,{name:C.name,value:C.defaultValue}];e(Ci(M)),a(!1)},u=C=>{let M=i.filter((T,z)=>z!==C);e(Ci(M))},g=(C,M)=>{let T=i.map((z,R)=>R===C?b(m({},z),{value:M}):z);e(Ci(T))},f={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},h=Hd(C=>{var B;if(!c.current)return{position:"fixed",top:0,left:0};let M=c.current.getBoundingClientRect(),T=c.current.closest('[data-devtools="panel"]'),z=T?T.getBoundingClientRect():{top:0,left:0,bottom:9999},R=(B=r==null?void 0:r.current)==null?void 0:B.getBoundingClientRect(),H=C*24+8,et=z.bottom-M.bottom<H;return b(m({position:"fixed"},et?{bottom:z.bottom-M.top+2-z.top}:{top:M.bottom+2-z.top}),{left:R?R.left+4-z.left:M.left-z.left,width:R?R.width-8:140,zIndex:10001})},[r]),x={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)"},y={display:"block",width:"100%",padding:"4px 10px",border:"none",backgroundColor:"transparent",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#334155",cursor:"pointer",textAlign:"left"},P=C=>pn("div",{ref:l,style:m(m({},h(C.length)),x),children:C.map(M=>pn("button",{type:"button",onClick:()=>p(M),style:y,onMouseEnter:T=>{T.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:T=>{T.currentTarget.style.backgroundColor="transparent"},children:M.label},M.name))});return i.length===0?so("div",{children:[so("div",{style:{display:"flex",alignItems:"center",gap:4},children:[pn(Fn,{modified:!1,children:pn("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:b(m({},f),{color:"#999",cursor:"default"})})}),pn("button",{ref:c,type:"button",onClick:()=>a(!s),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,padding:0,border:"none",borderRadius:2,backgroundColor:"transparent",color:"#94a3b8",cursor:"pointer",flexShrink:0},children:pn(za,{size:12})})]}),s&&P(Er)]}):so("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[i.map((C,M)=>{let T=Er.find(z=>z.name===C.name);return T?so("div",{style:{display:"flex",alignItems:"center",gap:4},children:[pn("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:T.label}),pn(Fn,{modified:n,children:so("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[pn("input",{type:"range",min:T.min,max:T.max,step:T.step,value:C.value,onChange:z=>g(M,parseFloat(z.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${o} ${(C.value-T.min)/(T.max-T.min)*100}%, rgba(0,0,0,0.1) ${(C.value-T.min)/(T.max-T.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),pn("input",{type:"number",min:T.min,max:T.max,step:T.step,value:T.unit==="px"||T.unit==="deg"?Math.round(C.value):Math.round(C.value*100)/100,onChange:z=>g(M,parseFloat(z.target.value)||0),style:b(m({},f),{width:44,padding:"2px 4px",textAlign:"right",flexShrink:0})}),T.unit&&pn("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:T.unit})]})}),pn("button",{type:"button",onClick:()=>u(M),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:pn($d,{size:10})})]},C.name):null}),d.length>0&&so("div",{children:[so("button",{ref:c,type:"button",onClick:()=>a(!s),style:{display:"flex",alignItems:"center",gap:4,padding:"2px 4px",border:"none",borderRadius:2,backgroundColor:"transparent",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#94a3b8",cursor:"pointer"},children:[pn(za,{size:10}),"Add filter"]}),s&&P(d)]})]})}import{useCallback as Ro,useEffect as Jd,useRef as Cr,useState as Wa}from"react";import{AlignHorizontalSpaceAround as Vd,AlignVerticalSpaceAround as Xd,Columns3 as Ud,Grid2x2 as Kd,RectangleHorizontal as Zd,Rows3 as qd,UnfoldHorizontal as Ya,UnfoldVertical as ja}from"lucide-react";import{useCallback as Yd,useEffect as jd,useRef as Ko}from"react";import{jsx as Gd}from"react/jsx-runtime";var Ti=[0,1,2,4,8,12,16,20,24,28,32];function Lo({value:t,onChange:e,onPreview:o,onScrubEnd:n,onReset:r,isModified:i,accentColor:s,defaultUnit:a="rem",snapSteps:l,color:c,style:d,children:p}){let u=Ko(null),g=Ko(null),f=Ko(r),h=Ko(i),x=Ko(!1);f.current=r,h.current=i,jd(()=>{let P=M=>{let T=g.current;if(!T)return;T.hasMoved=!0,x.current=M.shiftKey;let z=T.unit==="rem"||T.unit==="em"?.1:1;T.accum+=M.movementX*z;let R=Math.max(0,Math.round((T.startValue+T.accum)*10)/10);if(M.shiftKey&&l){let H=T.unit==="rem"||T.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,q=T.unit==="rem"||T.unit==="em"?R*H:R,et=l[l.length-1];for(let B=0;B<l.length-1;B++){let U=l[B],tt=l[B+1];if(q<=(U+tt)/2){et=U;break}if(q<tt){et=tt;break}}q>l[l.length-1]&&(et=Math.round(q/8)*8),R=T.unit==="rem"||T.unit==="em"?Math.round(et/H*1e3)/1e3:et}o==null||o(`${R}${T.unit}`)},C=()=>{let M=g.current;if(!M)return;let T=Math.max(0,Math.round((M.startValue+M.accum)*10)/10);if(x.current&&l){let R=M.unit==="rem"||M.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,H=M.unit==="rem"||M.unit==="em"?T*R:T,q=l[l.length-1];for(let et=0;et<l.length-1;et++){let B=l[et],U=l[et+1];if(H<=(B+U)/2){q=B;break}if(H<U){q=U;break}}H>l[l.length-1]&&(q=Math.round(H/8)*8),T=M.unit==="rem"||M.unit==="em"?Math.round(q/R*1e3)/1e3:q}let z=M.hasMoved&&T!==M.startValue;g.current=null,document.exitPointerLock(),z?e(`${T}${M.unit}`):M.hasMoved?o==null||o(`${M.startValue}${M.unit}`):h.current&&f.current&&f.current(),n==null||n()};return document.addEventListener("mousemove",P),document.addEventListener("mouseup",C),()=>{document.removeEventListener("mousemove",P),document.removeEventListener("mouseup",C)}},[e,o,n]);let y=Yd(P=>{var T;if(P.button!==0)return;P.preventDefault();let C=Vn(t),M=C.unit&&C.unit!=="px"?C.unit:a;g.current={startValue:C.num,unit:M,accum:0,hasMoved:!1},(T=u.current)==null||T.requestPointerLock()},[t,a]);return Gd("span",{ref:u,onMouseDown:y,title:i?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:m({color:i?s||"#3b82f6":c||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize"},d),children:p})}import{Fragment as Ii,jsx as Mt,jsxs as $e}from"react/jsx-runtime";function Qd({gridCols:t,gridRows:e,gridModified:o,accentColor:n,onColsChange:r,onRowsChange:i}){return Mt(xn,{style:{width:100},children:$e("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[Mt("input",{type:"number",min:1,max:12,value:t,onChange:s=>r(parseInt(s.target.value)||1),style:b(m({},je),{width:32,textAlign:"center",padding:2})}),Mt("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"}),Mt("input",{type:"number",min:1,max:12,value:e,onChange:s=>i(parseInt(s.target.value)||1),style:b(m({},je),{width:32,textAlign:"center",padding:2})})]})})}function Ga({element:t,getValue:e,getOriginalValue:o,handleChange:n,isModified:r,onResetProperty:i,isCollapsed:s,onToggle:a,sectionHeaderStyle:l,activeDropdown:c,onDropdownChange:d,panelContentRef:p,accentColor:u,onFieldHover:g,preferredUnit:f,onUnitCycle:h}){let x=d,y=e("display"),P=e("flex-direction"),C=Ja(y,P),M=y==="flex"||y==="inline-flex",T=y==="grid",z=M||T,R=e("width"),H=e("height"),q=r("width")?R:pr(t,"width"),et=r("height")?H:pr(t,"height"),B=Mi(R,q),U=Mi(H,et),tt=e("min-width"),kt=e("max-width"),at=e("min-height"),Nt=e("max-height"),Et=Ao(e("padding")),Dt=e("gap"),Ft=e("row-gap"),G=e("column-gap"),_t=e("grid-template-columns"),St=e("grid-template-rows"),Vt=e("overflow"),qt=_t.split(/\s+/).filter(j=>j&&j!=="none").length||1,Ot=St.split(/\s+/).filter(j=>j&&j!=="none").length||1,[mt,se]=Wa(!1),Q=c!==null,yt=Q||mt,Z=Q?.3:mt?.65:1,Lt=({mode:j,icon:Ht,active:Wt})=>Mt("button",{type:"button",onClick:()=>Va(j,n),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:Wt?ro(u,.15):"transparent",color:Wt?u:"#64748b",cursor:"pointer",fontSize:14},children:Ht}),ee=(j,Ht,Wt)=>{Wt==="fixed"?n(j,Ht):n(j,Tr(Wt,Ht))},E=j=>{let Ht=Ao(e("padding")),Wt=j||"0";n("padding",`${Ht.top} ${Wt} ${Ht.bottom} ${Wt}`)},nt=j=>{let Ht=Ao(e("padding")),Wt=j||"0";n("padding",`${Wt} ${Ht.right} ${Wt} ${Ht.left}`)},[it,At]=Wa({}),bt=Ro((j,Ht)=>Wt=>{Ht(Wt),At(gn=>b(m({},gn),{[j]:Wt}))},[]),Ct=Ro(j=>{At(Ht=>{let Wt=m({},Ht);return delete Wt[j],Wt})},[]),ht=Ro(j=>{let Ht=Ao(e("padding"));Jt(t,"padding",`${Ht.top} ${j} ${Ht.bottom} ${j}`)},[t,e]),Xt=Ro(j=>{let Ht=Ao(e("padding"));Jt(t,"padding",`${j} ${Ht.right} ${j} ${Ht.left}`)},[t,e]),oe=Ro(j=>Ht=>{Jt(t,j,Ht)},[t]),be=P==="column"||P==="column-reverse",ae=j=>j==="center"?1:j==="flex-end"||j==="end"?2:0,Ne=ae(e("justify-content")),re=ae(e("align-items")),Fe=be?re:Ne,$t=be?Ne:re,Sn=Cr(null),Ie=Cr({x:0,y:0}),Ae=Cr({col:Fe,row:$t});Ae.current={col:Fe,row:$t};let qe=Ro((j,Ht)=>{let Wt=["flex-start","center","flex-end"];be?(n("justify-content",Wt[Ht]),n("align-items",Wt[j])):(n("justify-content",Wt[j]),n("align-items",Wt[Ht]))},[be,n]),rn=Cr(qe);rn.current=qe,Jd(()=>{let Ht=Wt=>{let gn=Sn.current;if(!gn||!gn.contains(Wt.target))return;Wt.preventDefault(),Wt.stopPropagation(),Ie.current.x+=Wt.deltaX,Ie.current.y+=Wt.deltaY;let{col:he,row:fe}=Ae.current,ge=!1;Math.abs(Ie.current.x)>=30&&(he=Math.max(0,Math.min(2,he+(Ie.current.x>0?1:-1))),Ie.current.x=0,Ie.current.y=0,ge=!0),!ge&&Math.abs(Ie.current.y)>=30&&(fe=Math.max(0,Math.min(2,fe+(Ie.current.y>0?1:-1))),Ie.current.x=0,Ie.current.y=0,ge=!0),ge&&(he!==Ae.current.col||fe!==Ae.current.row)&&rn.current(he,fe)};return document.addEventListener("wheel",Ht,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",Ht,{capture:!0})},[]);let sn=()=>Mt("div",{ref:Sn,onMouseEnter:()=>{se(!0),p.current&&(p.current.style.overflowY="hidden")},onMouseLeave:()=>{se(!1),p.current&&(p.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:In,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(Ht=>Mt("button",{type:"button",onClick:()=>qe(Ht,j),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:Ht===Fe&&j===$t?Mt("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:Ht===0?$e(Ii,{children:[Mt("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Mt("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Mt("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]}):Ht===1?$e(Ii,{children:[Mt("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Mt("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Mt("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]}):$e(Ii,{children:[Mt("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Mt("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Mt("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]})}):Mt("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${j}-${Ht}`)))}),an=r("grid-template-columns")||r("grid-template-rows");return $e("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Mt("div",{style:l,children:Mt("span",{children:z?"Auto layout":"Layout"})}),$e("div",{style:{padding:"8px 12px"},children:[$e("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:In,borderRadius:2,padding:2,opacity:Z,transition:"opacity 150ms ease"},children:[Mt(Lt,{mode:"block",icon:Mt(Zd,{size:16}),active:C==="block"}),Mt(Lt,{mode:"flex-col",icon:Mt(qd,{size:16}),active:C==="flex-col"}),Mt(Lt,{mode:"flex-row",icon:Mt(Ud,{size:16}),active:C==="flex-row"}),Mt(Lt,{mode:"grid",icon:Mt(Kd,{size:16}),active:C==="grid"})]}),$e("div",{style:{display:"flex",gap:4,marginBottom:8},children:[Mt(Li,{label:"W",property:"width",cssValue:B==="fixed"?R:`${Math.round(t.getBoundingClientRect().width)}px`,mode:B,onValueChange:j=>n("width",j),onModeChange:j=>{if(j==="fixed"){let Ht=t.getBoundingClientRect();n("width",`${Math.round(Ht.width)}px`)}else n("width",Tr(j,R))},modified:r("width"),dimmed:Q&&c!=="width",dropdownOpen:c==="width",onDropdownChange:j=>x(j?"width":null),panelContentRef:p,accentColor:u,onReset:()=>i("width"),minValue:tt!=="none"&&tt!=="0px"&&tt!=="auto"?tt:"",maxValue:kt!=="none"&&kt!=="auto"?kt:"",onMinChange:j=>n("min-width",j||"0"),onMaxChange:j=>n("max-width",j||"none"),onMinReset:()=>i("min-width"),onMaxReset:()=>i("max-width"),minModified:r("min-width"),maxModified:r("max-width")}),Mt(Li,{label:"H",property:"height",cssValue:U==="fixed"?H:`${Math.round(t.getBoundingClientRect().height)}px`,mode:U,onValueChange:j=>n("height",j),onModeChange:j=>{if(j==="fixed"){let Ht=t.getBoundingClientRect();n("height",`${Math.round(Ht.height)}px`)}else n("height",Tr(j,H))},modified:r("height"),dimmed:Q&&c!=="height",dropdownOpen:c==="height",onDropdownChange:j=>x(j?"height":null),panelContentRef:p,minValue:at!=="none"&&at!=="0px"&&at!=="auto"?at:"",maxValue:Nt!=="none"&&Nt!=="auto"?Nt:"",onMinChange:j=>n("min-height",j||"0"),onMaxChange:j=>n("max-height",j||"none"),onMinReset:()=>i("min-height"),onMaxReset:()=>i("max-height"),minModified:r("min-height"),maxModified:r("max-height"),accentColor:u,onReset:()=>i("height")})]}),M&&$e("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8},children:[Mt("div",{style:{opacity:Q?.3:1,transition:"opacity 150ms ease"},children:sn()}),$e("div",{style:{flex:1,opacity:Z,transition:"opacity 150ms ease"},children:[Mt("div",{onClick:r("gap")?()=>i("gap"):void 0,title:r("gap")?"Click to reset":void 0,style:{fontSize:9,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:r("gap")?u:"#999",fontWeight:r("gap")?600:400,marginBottom:2,cursor:r("gap")?"pointer":"default"},children:"Gap"}),Mt(xn,{dimmed:Q,children:$e("div",{style:{display:"flex",alignItems:"center"},children:[Mt(Lo,{value:Dt,onChange:j=>{Ct("gap"),n("gap",j)},onPreview:bt("gap",oe("gap")),onScrubEnd:()=>Ct("gap"),onReset:()=>i("gap"),isModified:r("gap"),accentColor:u,defaultUnit:f,children:P==="column"||P==="column-reverse"?Mt(ja,{size:12,strokeWidth:r("gap")?2.5:1.5}):Mt(Ya,{size:12,strokeWidth:r("gap")?2.5:1.5})}),Mt(Tn,{property:"gap",value:it.gap||Dt,onChange:j=>n("gap",j),isModified:r("gap")||"gap"in it,style:b(m({},je),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:f,onUnitCycle:h})]})})]})]}),T&&$e("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:Z,transition:"opacity 150ms ease"},children:[Mt(Qd,{gridCols:qt,gridRows:Ot,gridModified:an,accentColor:u,onColsChange:j=>n("grid-template-columns",`repeat(${j}, 1fr)`),onRowsChange:j=>n("grid-template-rows",`repeat(${j}, 1fr)`)}),$e("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[Mt(xn,{dimmed:Q,children:$e("div",{style:{display:"flex",alignItems:"center"},children:[Mt(Lo,{value:G||Dt,onChange:j=>{Ct("column-gap"),n("column-gap",j)},onPreview:bt("column-gap",oe("column-gap")),onScrubEnd:()=>Ct("column-gap"),onReset:()=>i("column-gap"),isModified:r("column-gap"),accentColor:u,defaultUnit:f,children:Mt(Ya,{size:12,strokeWidth:r("column-gap")?2.5:1.5})}),Mt(Tn,{property:"column-gap",value:it["column-gap"]||G||Dt,onChange:j=>n("column-gap",j),isModified:r("column-gap")||"column-gap"in it,placeholder:"col",style:b(m({},je),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:f,onUnitCycle:h})]})}),Mt(xn,{dimmed:Q,children:$e("div",{style:{display:"flex",alignItems:"center"},children:[Mt(Lo,{value:Ft||Dt,onChange:j=>{Ct("row-gap"),n("row-gap",j)},onPreview:bt("row-gap",oe("row-gap")),onScrubEnd:()=>Ct("row-gap"),onReset:()=>i("row-gap"),isModified:r("row-gap"),accentColor:u,defaultUnit:f,children:Mt(ja,{size:12,strokeWidth:r("row-gap")?2.5:1.5})}),Mt(Tn,{property:"row-gap",value:it["row-gap"]||Ft||Dt,onChange:j=>n("row-gap",j),isModified:r("row-gap")||"row-gap"in it,placeholder:"row",style:b(m({},je),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:f,onUnitCycle:h})]})})]})]}),z&&$e("div",{onMouseEnter:()=>g==null?void 0:g("padding"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:Z,transition:"opacity 150ms ease"},children:[Mt(xn,{style:{flex:1},dimmed:Q,children:$e("div",{style:{display:"flex",alignItems:"center"},children:[Mt(Lo,{value:Et.left,onChange:j=>{Ct("padding-h"),E(j)},onPreview:bt("padding-h",ht),onScrubEnd:()=>Ct("padding-h"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:u,defaultUnit:f,snapSteps:Ti,children:Mt(Vd,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Mt(Tn,{property:"padding",value:it["padding-h"]||Et.left,onChange:j=>E(j),isModified:r("padding")||"padding-h"in it,placeholder:"H pad",style:b(m({},je),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:f,onUnitCycle:h})]})}),Mt(xn,{style:{flex:1},dimmed:Q,children:$e("div",{style:{display:"flex",alignItems:"center"},children:[Mt(Lo,{value:Et.top,onChange:j=>{Ct("padding-v"),nt(j)},onPreview:bt("padding-v",Xt),onScrubEnd:()=>Ct("padding-v"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:u,defaultUnit:f,snapSteps:Ti,children:Mt(Xd,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Mt(Tn,{property:"padding",value:it["padding-v"]||Et.top,onChange:j=>nt(j),isModified:r("padding")||"padding-v"in it,placeholder:"V pad",style:b(m({},je),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:f,onUnitCycle:h})]})})]}),$e("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:Z,transition:"opacity 150ms ease"},children:[Mt("input",{type:"checkbox",checked:Vt==="hidden",onChange:j=>n("overflow",j.target.checked?"hidden":"visible"),style:{margin:0,accentColor:u}}),"Clip content"]})]})]})}import{AlignCenter as tu,AlignJustify as eu,AlignLeft as nu,AlignRight as ou,Baseline as ru,ChevronDown as iu,WholeWord as su}from"lucide-react";import{jsx as me,jsxs as Hn}from"react/jsx-runtime";var Xa={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function Ua({element:t,getValue:e,handleChange:o,isModified:n,onResetProperty:r,isCollapsed:i,onToggle:s,sectionHeaderStyle:a,accentColor:l,colorVariables:c,activeColorDropdown:d,onColorDropdownChange:p,panelContentRef:u,preferredUnit:g,onUnitCycle:f}){var U;let h=e("font-family"),x=e("font-size"),y=e("font-weight"),P=e("line-height"),C=e("letter-spacing"),M=e("text-align"),T=e("color"),z=String(y),R=Xa[z]||z,H=Jo(t,T),q=T.includes("var(")?null:Vo(H,c),et=({align:tt,icon:kt})=>{let at=M===tt;return me("button",{type:"button",onClick:()=>o("text-align",tt),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:at?ro(l,.15):"transparent",color:at?l:"#64748b",cursor:"pointer"},children:kt})},B=((U=h.split(",")[0])==null?void 0:U.trim().replace(/^["']|["']$/g,""))||"System";return Hn("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[me("div",{style:a,children:me("span",{children:"Typography"})}),Hn("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[me(xn,{children:Hn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[me("input",{type:"text",value:h,onChange:tt=>o("font-family",tt.target.value),style:b(m({},je),{flex:1,minWidth:0,padding:0,fontWeight:n("font-family")?600:400,color:n("font-family")?l:"inherit"}),title:h}),me(iu,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),Hn("div",{style:{display:"flex",gap:4},children:[me(xn,{style:{flex:1},children:me("select",{value:z,onChange:tt=>o("font-weight",tt.target.value),style:b(m({},je),{padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:n("font-weight")?600:400,color:n("font-weight")?l:"inherit"}),children:Object.entries(Xa).map(([tt,kt])=>me("option",{value:tt,children:kt},tt))})}),me(xn,{style:{flex:1},children:me("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:me(Tn,{property:"font-size",value:x,onChange:tt=>o("font-size",tt),isModified:n("font-size"),min:1,max:999,style:b(m({},je),{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:g,onUnitCycle:f})})})]}),Hn("div",{style:{display:"flex",gap:4},children:[me(xn,{style:{flex:1},children:Hn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[me(ru,{size:12,style:{color:n("line-height")?l:"#999",flexShrink:0}}),me(Tn,{property:"line-height",value:P,onChange:tt=>o("line-height",tt),isModified:n("line-height"),step:.1,min:0,placeholder:"Auto",style:b(m({},je),{flex:1,minWidth:0,padding:0,fontWeight:n("line-height")?600:400,color:n("line-height")?l:"inherit"}),showUnit:!1})]})}),me(xn,{style:{flex:1},children:Hn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[me(su,{size:12,style:{color:n("letter-spacing")?l:"#999",flexShrink:0}}),me(Tn,{property:"letter-spacing",value:C,onChange:tt=>o("letter-spacing",tt),isModified:n("letter-spacing"),step:.1,placeholder:"\u2014",style:b(m({},je),{flex:1,minWidth:0,padding:0,fontWeight:n("letter-spacing")?600:400,color:n("letter-spacing")?l:"inherit"}),showUnit:!1})]})})]}),Hn("div",{style:{display:"flex",gap:2,backgroundColor:In,borderRadius:2,padding:2},children:[me(et,{align:"left",icon:me(nu,{size:14})}),me(et,{align:"center",icon:me(tu,{size:14})}),me(et,{align:"right",icon:me(ou,{size:14})}),me(et,{align:"justify",icon:me(eu,{size:14})})]}),Hn("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[me("span",{onClick:n("color")?()=>r("color"):void 0,title:n("color")?"Click to reset":void 0,style:{fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:n("color")?l:"#64748b",fontWeight:n("color")?600:400,cursor:n("color")?"pointer":"default",width:40,flexShrink:0},children:"Color"}),me("div",{style:{flex:1,minWidth:0},children:me(Ri,{value:T,resolvedValue:H,colorVariables:c,matchingVariable:q,onChange:tt=>o("color",tt),accentColor:l,modified:n("color"),panelContentRef:u,isDropdownOpen:d==="color",onDropdownChange:tt=>p(tt?"color":null)})})]})]})]})}import{Fragment as uu,jsx as ut,jsxs as Se}from"react/jsx-runtime";var Za=[{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 du(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 Mi(t,e){return!e||t==="auto"||t==="fit-content"||t==="max-content"||t==="min-content"?"hug":t==="100%"||e==="100%"?"fill":"fixed"}function Tr(t,e){switch(t){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let o=Vn(e);if(typeof o.num=="number"&&!isNaN(o.num)){let n=o.unit==="%"?"px":o.unit||"px";return`${o.num}${n}`}return"auto"}}}function Ao(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 Ja(t,e){return t==="grid"?"grid":t==="flex"||t==="inline-flex"?e==="column"||e==="column-reverse"?"flex-col":"flex-row":"block"}function Va(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 In="rgba(0, 0, 0, 0.04)",je={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};function Li({label:t,property:e,cssValue:o,mode:n,onValueChange:r,onModeChange:i,modified:s,dimmed:a,dropdownOpen:l,onDropdownChange:c,panelContentRef:d,accentColor:p="#3b82f6",onReset:u,minValue:g,maxValue:f,onMinChange:h,onMaxChange:x,onMinReset:y,onMaxReset:P,minModified:C,maxModified:M}){let T=Vn(o),z=s?T.unit||Mo(e):Mo(e),R=!s&&T.unit&&T.unit!==z?Ei(T.num,z):T.num,[H,q]=Ge(!1),[et,B]=Ge(String(R)),[U,tt]=Ge(!1),kt=fn(null),at=fn(null),Nt=fn(null),Et=fn(!1);wn(()=>{H||B(String(R))},[R,H]),wn(()=>{if(!l)return;let Ot=se=>{at.current&&!at.current.contains(se.target)&&Nt.current&&!Nt.current.contains(se.target)&&(c==null||c(!1))},mt=se=>{se.key==="Escape"&&(c==null||c(!1))};return document.addEventListener("mousedown",Ot),document.addEventListener("keydown",mt),()=>{document.removeEventListener("mousedown",Ot),document.removeEventListener("keydown",mt)}},[l,c]),wn(()=>{H&&kt.current&&(kt.current.focus(),kt.current.select())},[H]);let Dt=()=>{let Ot=kr(et,e,o,s);r(Ot||`${Math.max(0,parseFloat(et)||0)}${z}`),q(!1)},Ft=()=>{if(Et.current){Et.current=!1;return}Dt()},G=Ot=>{if(Ot.key==="Enter"){Dt();return}if(Ot.key==="Escape"){Et.current=!0,B(String(R)),q(!1);return}if(Ot.key==="ArrowUp"||Ot.key==="ArrowDown"){Ot.preventDefault();let mt=Ot.key==="ArrowUp"?1:-1,se=Ot.shiftKey?8:Ot.altKey?.1:1,Q=parseFloat(et)||0,yt=Math.round(Math.max(0,Q+mt*se)*1e3)/1e3;B(String(yt)),r(`${yt}${z}`)}},_t={fixed:"Fixed",hug:"Hug",fill:"Fill"},St={fixed:ut(Ka,{size:12}),hug:ut(lu,{size:12}),fill:ut(Ka,{size:12})},Vt=()=>{c==null||c(!l)},qt=()=>{if(!Nt.current||!(d!=null&&d.current))return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let Ot=Nt.current.getBoundingClientRect(),mt=d.current.getBoundingClientRect(),se=d.current.closest('[data-devtools="panel"]'),Q=se?se.getBoundingClientRect():{top:0,left:0};return{position:"fixed",top:Ot.bottom+4-Q.top,left:mt.left+4-Q.left,width:mt.width-8}};return Se("div",{ref:Nt,onMouseEnter:()=>tt(!0),onMouseLeave:()=>tt(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:H?p:U?"rgba(0,0,0,0.15)":"transparent",backgroundColor:In,transition:"border-color 100ms ease, opacity 150ms ease",opacity:a?.3:1},children:[ut("span",{onClick:s&&u?u:void 0,title:s?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:s?p:"#999",fontWeight:s?600:400,padding:"0 8px",flexShrink:0,cursor:s?"pointer":"default"},children:t}),n==="fixed"?H?ut("input",{ref:kt,type:"text",inputMode:"numeric",value:et,onChange:Ot=>B(Ot.target.value),onKeyDown:G,onBlur:Ft,style:b(m({},je),{flex:1,minWidth:0,padding:"4px 2px"})}):ut("span",{onClick:()=>q(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:R}):ut("span",{style:{flex:1}}),Se("button",{type:"button",onClick:Vt,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:[_t[n],ut(Ai,{size:12})]}),l&&Se("div",{ref:at,style:b(m({},qt()),{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:[Se("button",{type:"button",onClick:()=>{i("fixed"),c==null||c(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:n==="fixed"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:n==="fixed"?600:400,cursor:"pointer",textAlign:"left"},children:[St.fixed,Se("span",{children:["Fixed ",e," (",o,")"]}),n==="fixed"&&ut(Ir,{size:14,style:{marginLeft:"auto"}})]}),Se("button",{type:"button",onClick:()=>{i("hug"),c==null||c(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:n==="hug"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:n==="hug"?600:400,cursor:"pointer",textAlign:"left"},children:[St.hug,ut("span",{children:"Hug contents"}),n==="hug"&&ut(Ir,{size:14,style:{marginLeft:"auto"}})]}),Se("button",{type:"button",onClick:()=>{i("fill"),c==null||c(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:n==="fill"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:n==="fill"?600:400,cursor:"pointer",textAlign:"left"},children:[St.fill,ut("span",{children:"Fill container"}),n==="fill"&&ut(Ir,{size:14,style:{marginLeft:"auto"}})]}),ut("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),Se("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[Se("div",{style:{display:"flex",alignItems:"center",backgroundColor:In,borderRadius:2,padding:"4px 8px"},children:[ut("span",{onClick:C?Ot=>{Ot.stopPropagation(),y==null||y()}:void 0,title:C?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:C?p:"#999",fontWeight:C?600:400,marginRight:8,flexShrink:0,cursor:C?"pointer":"default"},children:"Min"}),ut("input",{type:"text",value:g||"",placeholder:"\u2014",onChange:Ot=>h==null?void 0:h(Ot.target.value),onClick:Ot=>Ot.stopPropagation(),style:b(m({},je),{flex:1,minWidth:0,padding:0,textAlign:"right",color:C?p:"inherit",fontWeight:C?600:400})})]}),Se("div",{style:{display:"flex",alignItems:"center",backgroundColor:In,borderRadius:2,padding:"4px 8px"},children:[ut("span",{onClick:M?Ot=>{Ot.stopPropagation(),P==null||P()}:void 0,title:M?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:M?p:"#999",fontWeight:M?600:400,marginRight:8,flexShrink:0,cursor:M?"pointer":"default"},children:"Max"}),ut("input",{type:"text",value:f||"",placeholder:"\u2014",onChange:Ot=>x==null?void 0:x(Ot.target.value),onClick:Ot=>Ot.stopPropagation(),style:b(m({},je),{flex:1,minWidth:0,padding:0,textAlign:"right",color:M?p:"inherit",fontWeight:M?600:400})})]})]})]})]})}function xn({children:t,style:e,dimmed:o}){let[n,r]=Ge(!1);return ut("div",{onMouseEnter:()=>r(!0),onMouseLeave:()=>r(!1),style:m({position:"relative",borderRadius:2,border:"1px solid",borderColor:n?"rgba(0,0,0,0.15)":"transparent",backgroundColor:In,transition:"border-color 100ms ease, opacity 150ms ease",opacity:o?.3:1},e),children:t})}function Fn({children:t}){let[e,o]=Ge(!1);return ut("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:In,transition:"border-color 100ms ease"},children:t})}function Tn({property:t,value:e,onChange:o,isModified:n=!1,step:r=1,min:i,max:s,style:a,placeholder:l,showUnit:c=!0,unitStyle:d,preferredUnit:p,onUnitCycle:u}){let g=Vn(e),f=Mo(t),h=wr[t],y=p&&h&&h.includes(p)?p:f,P=n&&g.unit||y,C=!n&&g.unit&&g.unit!==P?Ei(g.num,P):g.num,[M,T]=Ge(!1),[z,R]=Ge(""),H=Ft=>{T(!0),R(String(C||"")),requestAnimationFrame(()=>Ft.target.select())},q=()=>{if(T(!1),z.trim()){let Ft=kr(z,t,e,n);Ft&&o(Ft)}},et=Ft=>{let G=Ft.target.value;R(G);let _t=G.trim(),St=_t.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),Vt=_t.match(/^(-?[\d.]+)$/);if(St){let qt=parseFloat(St[1]);isNaN(qt)||o(`${qt}${St[2].toLowerCase()}`)}else if(Vt){let qt=parseFloat(Vt[1]);isNaN(qt)||o(`${qt}${P}`)}},B=Ft=>{if(Ft.key==="Enter"){if(z.trim()){let G=kr(z,t,e,n);G&&o(G)}Ft.target.blur();return}if(Ft.key==="ArrowUp"||Ft.key==="ArrowDown"){Ft.preventDefault();let G=Ft.shiftKey?10:Ft.altKey?.1:1,_t=(Ft.key==="ArrowUp"?1:-1)*r*G,St=parseFloat(z)||C||0,Vt=Math.round((St+_t)*1e3)/1e3;i!==void 0&&(Vt=Math.max(i,Vt)),s!==void 0&&(Vt=Math.min(s,Vt)),R(String(Vt)),o(`${Vt}${P}`)}},U=/^-?[\d.]/.test(e.trim()),tt=M?z:U?String(C):"",at=M&&/\s*(rem|em|px|%)\s*$/i.test(z)?"":P,Nt=u&&(at==="rem"||at==="px"),Et={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},Dt=b(m({},d!=null?d:Et),{pointerEvents:"auto",cursor:"pointer"});return Se(uu,{children:[ut("input",{type:"text",inputMode:"decimal",value:tt,onFocus:H,onBlur:q,onChange:et,onKeyDown:B,placeholder:l,style:a}),c&&at&&ut("span",{style:Nt?Dt:d!=null?d:Et,onClick:Nt?u:void 0,title:Nt?"Click to switch units":void 0,children:at})]})}function Ri({value:t,resolvedValue:e,colorVariables:o,matchingVariable:n,onChange:r,accentColor:i="#3b82f6",modified:s,panelContentRef:a,isDropdownOpen:l,onDropdownChange:c}){let[d,p]=Ge(!1),u=!t.includes("var(")&&n?n.usage:t,[g,f]=Ge(u),[h,x]=Ge(!1),[y,P]=Ge(!1),[C,M]=Ge(!1),T=fn(null),z=fn(null),R=fn(null),H=l!==void 0?l:h,q=c||x,et=Pn(()=>{if(!R.current)return{position:"fixed",top:0,left:0,width:200};let G=R.current.getBoundingClientRect(),_t=R.current.closest('[data-devtools="panel"]'),St=_t?_t.getBoundingClientRect():{top:0,left:0};if(a!=null&&a.current){let Vt=a.current.getBoundingClientRect();return{position:"fixed",top:G.bottom+4-St.top,left:Vt.left+4-St.left,width:Vt.width-8}}return{position:"fixed",top:G.bottom+4-St.top,left:G.left-St.left,width:G.width}},[a]);wn(()=>{if(!d){let G=!t.includes("var(")&&n?n.usage:t;f(G)}},[t,d,n]),wn(()=>{if(!H&&!y)return;let G=St=>{R.current&&!R.current.contains(St.target)&&(q(!1),P(!1))},_t=St=>{St.key==="Escape"&&(q(!1),P(!1))};return document.addEventListener("mousedown",G),document.addEventListener("keydown",_t),()=>{document.removeEventListener("mousedown",G),document.removeEventListener("keydown",_t)}},[H,y]),wn(()=>{d&&T.current&&(T.current.focus(),T.current.select())},[d]);let B=Mr(()=>{if(!g||g.startsWith("#")||g.startsWith("rgb")||g.startsWith("hsl")||g.startsWith("oklch"))return[];let G=g.toLowerCase();return o.filter(_t=>_t.name.toLowerCase().includes(G)||_t.usage.toLowerCase().includes(G)).slice(0,8)},[g,o]),U=()=>{r(g),p(!1),P(!1)},tt=G=>{f(G),G.includes("var")||G.includes("--")||G.length>0&&!G.startsWith("#")?P(!0):P(!1)},kt=G=>{f(G.usage),r(G.usage),q(!1),P(!1),p(!1)},at=()=>{setTimeout(()=>{!H&&!y&&U()},150)},Nt=G=>{G.key==="Enter"?U():G.key==="Escape"&&(f(t),p(!1),P(!1))},Et=Mr(()=>{let G=e.trim().toLowerCase();if(G.startsWith("#"))return G.length===4?`#${G[1]}${G[1]}${G[2]}${G[2]}${G[3]}${G[3]}`:G.slice(0,7);let _t=G.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(_t){let Vt=parseInt(_t[1],10).toString(16).padStart(2,"0"),qt=parseInt(_t[2],10).toString(16).padStart(2,"0"),Ot=parseInt(_t[3],10).toString(16).padStart(2,"0");return`#${Vt}${qt}${Ot}`}let St=G.match(/oklch\(\s*([\d.]+)/);if(St){let Vt=Math.max(0,Math.min(1,parseFloat(St[1]))),qt=Math.round(Vt*255).toString(16).padStart(2,"0");return`#${qt}${qt}${qt}`}return"#000000"},[e]),Dt=G=>{let _t=G.target.value;f(_t),r(_t)},Ft=t.includes("var(");return Se("div",{ref:R,onMouseEnter:()=>M(!0),onMouseLeave:()=>M(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:d?i:C?"rgba(0,0,0,0.15)":"transparent",backgroundColor:In,transition:"border-color 100ms ease",overflow:"hidden"},children:[Se("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[Se("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[ut("input",{type:"color",value:Et,onChange:Dt,style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),ut("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:e,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),d?ut("input",{ref:T,type:"text",value:g,onChange:G=>tt(G.target.value),onKeyDown:Nt,onBlur:at,style:b(m({},je),{flex:1,minWidth:0})}):ut("span",{onClick:()=>p(!0),style:{flex:1,minWidth:0,padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",color:s?i:"inherit"},title:u,children:u}),o.length>0&&ut("button",{type:"button",onClick:()=>q(!H),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:ut(Ai,{size:12})})]}),y&&B.length>0&&ut("div",{style:b(m({},et()),{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:B.map(G=>Se("button",{type:"button",onClick:()=>kt(G),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:[ut("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:G.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ut("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:G.name})]},G.name))}),H&&ut("div",{ref:z,style:b(m({},et()),{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(G=>Se("button",{type:"button",onClick:()=>kt(G),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:u===G.usage||t===G.usage?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:u===G.usage||t===G.usage?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[ut("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:G.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ut("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:G.name}),(u===G.usage||t===G.usage)&&ut(Ir,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},G.name))})]})}function qa({element:t,elementInfo:e,selector:o,styleModifications:n,dispatch:r,onClose:i,onHover:s,accentColor:a="#3b82f6"}){var Lt,ee;let l=fn(null),c=fn(null),[d,p]=Ge(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch(E){return!1}});wn(()=>{if(d)return;let E=setTimeout(()=>p(!0),50);return()=>clearTimeout(E)},[d]);let[u,g]=Ge(null),[f,h]=Ge(null),x=u!==null||f!==null,[y,P]=Ge("rem"),C=Pn(()=>{P(E=>E==="rem"?"px":"rem")},[]),M=fn(new Map),[T,z]=Ge(""),R=Mr(()=>qr(),[]);wn(()=>{let E=nt=>{var At;if(nt.key!=="Escape")return;let it=document.activeElement;it&&((At=l.current)!=null&&At.contains(it))||i()};return window.addEventListener("keydown",E),()=>window.removeEventListener("keydown",E)},[i]);let H=fn({top:0,left:0,maxHeight:400}),[,q]=Ge(0),et="devtools-panel-position",B=fn({x:0,y:0}),U=fn(null),tt=fn(!1);wn(()=>{try{let E=localStorage.getItem(et);if(E){let nt=JSON.parse(E);typeof nt.top=="number"&&typeof nt.left=="number"&&(tt.current=!0,H.current=b(m({},H.current),{top:nt.top,left:nt.left}))}}catch(E){}},[]),wn(()=>{let E=it=>{let At=U.current;if(!At)return;let bt=At.startOffsetX+(it.clientX-At.startX),Ct=At.startOffsetY+(it.clientY-At.startY),ht=280,Xt=16,oe=Math.max(Xt,Math.min(window.innerWidth-ht-Xt,H.current.left+bt)),be=Math.max(Xt,H.current.top+Ct);B.current={x:oe-H.current.left,y:be-H.current.top};let ae=l.current,Ne=ae==null?void 0:ae.parentElement;if(!Ne)return;Ne.style.top=`${be}px`,Ne.style.left=`${oe}px`;let re=document.getElementById("devtools-toolbar"),Fe=re==null?void 0:re.getBoundingClientRect(),$t=window.innerHeight-16;Fe&&oe+ht>Fe.left&&($t=Fe.top-8);let Sn=Math.max(0,be),Ie=Math.max(200,$t-Sn);ae&&(ae.style.maxHeight=`${Ie}px`)},nt=()=>{if(!U.current)return;let it=H.current.top+B.current.y,At=H.current.left+B.current.x;H.current=b(m({},H.current),{top:it,left:At}),B.current={x:0,y:0},tt.current=!0;try{localStorage.setItem(et,JSON.stringify({top:it,left:At}))}catch(bt){}U.current=null};return window.addEventListener("mousemove",E),window.addEventListener("mouseup",nt),()=>{window.removeEventListener("mousemove",E),window.removeEventListener("mouseup",nt)}},[]);let kt=Pn(E=>{E.button!==0||E.target.closest("button")||(E.preventDefault(),U.current={startX:E.clientX,startY:E.clientY,startOffsetX:B.current.x,startOffsetY:B.current.y})},[]);wn(()=>{B.current={x:0,y:0};let E=(At=!1)=>{let bt=l.current,Ct=280,ht=8,Xt,oe;if(tt.current)Xt=H.current.top,oe=H.current.left;else{let $t=t.getBoundingClientRect();oe=$t.right+ht,Xt=$t.top,oe+Ct>window.innerWidth-ht&&(oe=$t.left-Ct-ht),oe<ht&&(oe=Math.max(ht,(window.innerWidth-Ct)/2))}let be=document.getElementById("devtools-toolbar"),ae=be==null?void 0:be.getBoundingClientRect(),Ne=window.innerHeight-16;ae&&oe+Ct>ae.left&&(Ne=ae.top-ht);let re=Math.max(0,Xt),Fe=Math.max(200,Ne-re);if(H.current={top:Xt,left:oe,maxHeight:Fe},At&&bt){let $t=bt.parentElement;$t&&!tt.current&&($t.style.top=`${Xt+B.current.y}px`,$t.style.left=`${oe+B.current.x}px`),bt.style.maxHeight=`${Fe}px`}else q($t=>$t+1)};E(!1);let nt=()=>E(!0),it=()=>E(!1);return window.addEventListener("scroll",nt,{passive:!0}),window.addEventListener("resize",it,{passive:!0}),()=>{window.removeEventListener("scroll",nt),window.removeEventListener("resize",it)}},[t]),wn(()=>{let E=l.current;if(!E)return;let nt=it=>{let At=c.current;if(!At){it.preventDefault();return}let{scrollTop:bt,scrollHeight:Ct,clientHeight:ht}=At,Xt=bt<=0&&it.deltaY<0,oe=bt+ht>=Ct&&it.deltaY>0;(Xt||oe)&&it.preventDefault()};return E.addEventListener("wheel",nt,{passive:!1}),()=>E.removeEventListener("wheel",nt)},[]);let at=Mr(()=>n.find(E=>E.selector===o),[n,o]),Nt=Pn(E=>{let nt=at==null?void 0:at.changes.find(it=>it.property===E);if(nt)return nt.modified;if(E.includes("color")){let it=Vr(t,E);if(it&&it.includes("var("))return it}return Yo(t,E)},[t,at]),Et=Pn(E=>{if(M.current.has(E))return M.current.get(E);let nt=at==null?void 0:at.changes.find(At=>At.property===E);if(nt)return nt.original;let it=Yo(t,E);return M.current.set(E,it),it},[t,at]),Dt=Pn((E,nt)=>{let it=Et(E);Jt(t,E,nt),E==="backdrop-filter"&&Jt(t,"-webkit-backdrop-filter",nt),r({type:"MODIFY_STYLE",payload:{selector:o,element:e,property:E,original:it,modified:nt}})},[t,o,e,r,Et]),Ft=Pn(()=>{Zr(o,n);let E=n.find(nt=>nt.selector===o);if(E)for(let nt of E.changes)r({type:"CLEAR_STYLE",payload:{selector:o,property:nt.property}});M.current.clear()},[o,n,r]),G=Pn(E=>{let nt=n.find(At=>At.selector===o);nt!=null&&nt.changes.find(At=>At.property===E)&&t instanceof HTMLElement&&(t.style.removeProperty(E),r({type:"CLEAR_STYLE",payload:{selector:o,property:E}}),M.current.delete(E))},[t,o,n,r]),_t=Pn(()=>{let E=T.split(";").map(nt=>nt.trim()).filter(nt=>nt);for(let nt of E){let it=nt.indexOf(":");if(it>0){let At=nt.slice(0,it).trim(),bt=nt.slice(it+1).trim();At&&bt&&Dt(At,bt)}}z("")},[T,Dt]),St=Pn(E=>{var nt;return(nt=at==null?void 0:at.changes.some(it=>it.property===E))!=null?nt:!1},[at]),Vt=E=>{var Ct;let nt=Nt(E.property),it=St(E.property),At=!it&&du(E.property,nt),bt={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};if(At&&E.type!=="backdrop-filter")return ut(Fn,{modified:!1,children:ut("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:ht=>Dt(E.property,ht.target.value),style:b(m({},bt),{color:"#999"})})});switch(E.type){case"color":{let ht=Jo(t,nt),Xt=nt.includes("var(")?null:Vo(ht,R);return ut(Ri,{value:nt,resolvedValue:ht,colorVariables:R,matchingVariable:Xt,onChange:oe=>Dt(E.property,oe),accentColor:a,modified:it,panelContentRef:c,isDropdownOpen:f===E.property,onDropdownChange:oe=>h(oe?E.property:null)})}case"number":{if(!!wr[E.property])return ut(Fn,{modified:it,children:ut(Tn,{property:E.property,value:nt,onChange:oe=>Dt(E.property,oe),isModified:it,min:E.min,max:E.max,step:E.step||1,style:b(m({},bt),{paddingRight:32}),unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:y,onUnitCycle:C})});let{num:Xt}=Vn(nt);return ut(Fn,{modified:it,children:ut("input",{type:"number",value:Xt,min:E.min,max:E.max,step:E.step||1,onChange:oe=>Dt(E.property,oe.target.value),style:bt})})}case"select":return ut(Fn,{modified:it,children:Se("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[ut("select",{value:nt,onChange:ht=>Dt(E.property,ht.target.value),style:b(m({},bt),{cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"}),children:(Ct=E.options)==null?void 0:Ct.map(ht=>ut("option",{value:ht,children:ht},ht))}),ut("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:ut(Ai,{size:12})})]})});case"spacing":return ut(Fn,{modified:it,children:ut("input",{type:"text",value:nt,onChange:ht=>Dt(E.property,ht.target.value),placeholder:"e.g., 10px or 10px 20px",style:bt})});case"backdrop-filter":return ut($a,{value:nt,onChange:ht=>Dt(E.property,ht),accentColor:a,modified:it,panelContentRef:c});default:return ut(Fn,{modified:it,children:ut("input",{type:"text",value:nt,onChange:ht=>Dt(E.property,ht.target.value),style:bt})})}},qt=(Lt=at==null?void 0:at.changes.length)!=null?Lt:0,Ot=(ee=at==null?void 0:at.captured)!=null?ee:!1,mt=b(m({position:"fixed",top:H.current.top,left:H.current.left,width:280,maxHeight:H.current.maxHeight,backgroundColor:"rgba(255, 255, 255, 0.85)",backdropFilter:"blur(32px)",WebkitBackdropFilter:"blur(32px)"},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"}),se={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:U.current?"grabbing":"grab"},Q={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"},yt={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},Z={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return ut("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:H.current.top+B.current.y,left:H.current.left+B.current.x,zIndex:1e4,pointerEvents:"none"},children:Se("div",{ref:l,"data-devtools":"panel",style:b(m({},mt),{position:"relative",top:0,left:0,zIndex:0,pointerEvents:"auto"}),onMouseEnter:()=>s==null?void 0:s("element"),onMouseLeave:()=>s==null?void 0:s(null),children:[Se("div",{style:se,onMouseDown:kt,children:[Se("div",{style:{display:"flex",alignItems:"center",gap:8,overflow:"hidden"},children:[ut("span",{style:{fontWeight:600,fontSize:11,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:e.tagName}),qt>0&&ut("span",{style:{backgroundColor:Ot?"#999999":a,color:"#fff",fontSize:9,padding:"1px 4px",borderRadius:2},children:qt})]}),Se("div",{style:{display:"flex",gap:4},children:[qt>0&&ut("button",{type:"button",onClick:Ft,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:ut(au,{size:14})}),ut("button",{type:"button",onClick:i,title:"Close",style:{display:"flex",alignItems:"center",justifyContent:"center",width:24,height:24,border:"none",background:"none",cursor:"pointer",color:"#64748b",borderRadius:2},children:ut(cu,{size:14})})]})]}),Se("div",{ref:c,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[ut("div",{style:{opacity:f?.3:1,transition:"opacity 150ms ease"},children:ut(Ga,{element:t,getValue:Nt,getOriginalValue:Et,handleChange:Dt,isModified:St,onResetProperty:G,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:Q,activeDropdown:u,onDropdownChange:g,panelContentRef:c,accentColor:a,onFieldHover:s,preferredUnit:y,onUnitCycle:C})}),ut("div",{style:{opacity:u?.3:1,transition:"opacity 150ms ease"},children:ut(Ua,{element:t,getValue:Nt,handleChange:Dt,isModified:St,onResetProperty:G,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:Q,accentColor:a,colorVariables:R,activeColorDropdown:f,onColorDropdownChange:h,panelContentRef:c,preferredUnit:y,onUnitCycle:C})}),Za.map((E,nt)=>{let it=nt===Za.length-1,At=f&&E.properties.some(Ct=>Ct.property===f);return Se("div",{style:{borderBottom:it?"none":"1px solid rgba(0,0,0,0.08)",opacity:x&&!At?.3:1,transition:"opacity 150ms ease"},children:[ut("div",{style:Q,children:ut("span",{children:E.name})}),ut("div",{style:{padding:"4px 0"},children:E.properties.map(Ct=>{let ht=St(Ct.property),Xt=At&&Ct.property!==f;return Se("div",{style:b(m({},yt),{opacity:Xt?.3:1,transition:"opacity 150ms ease"}),children:[ut("span",{onClick:ht?()=>G(Ct.property):void 0,title:ht?"Click to reset":void 0,style:b(m({},Z),{color:ht?a:"#64748b",fontWeight:ht?600:400,cursor:ht?"pointer":"default"}),children:Ct.label}),ut("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:Vt(Ct)})]},Ct.property)})})]},E.name)}),Se("div",{style:{opacity:x?.3:1,transition:"opacity 150ms ease"},children:[ut("div",{style:Q,children:ut("span",{children:"Raw CSS"})}),Se("div",{style:{padding:"8px 12px"},children:[ut("textarea",{value:T,onChange:E=>z(E.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"}}),T.trim()&&ut("button",{type:"button",onClick:_t,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:a,color:"#fff",cursor:"pointer",opacity:T.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as pu,useLayoutEffect as fu,useState as gu}from"react";import{Fragment as bu,jsx as ao,jsxs as yu}from"react/jsx-runtime";var Pi=["flex-start","center","flex-end"],Bi=["flex-start","center","flex-end"];function mu(t){return t==="normal"||t==="flex-start"||t==="start"?"flex-start":t==="flex-end"||t==="end"?"flex-end":t==="center"?"center":null}function hu(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 Qa(t){let e=Array.from(t.children);if(e.length===0)return null;let o=1/0,n=1/0,r=-1/0,i=-1/0;for(let s of e){let a=s.getBoundingClientRect();a.width===0&&a.height===0||(a.top<o&&(o=a.top),a.left<n&&(n=a.left),a.bottom>r&&(r=a.bottom),a.right>i&&(i=a.right))}return o===1/0?null:new DOMRect(n,o,i-n,r-o)}function tl({element:t,modifier:e,accentColor:o,refreshKey:n=0}){let[r,i]=gu(null);if(pu(()=>{if(!t){i(null);return}let h=()=>i(Qa(t));return h(),window.addEventListener("scroll",h,{passive:!0}),window.addEventListener("resize",h,{passive:!0}),()=>{window.removeEventListener("scroll",h),window.removeEventListener("resize",h)}},[t]),fu(()=>{t&&i(Qa(t))},[t,n]),!r)return null;let s=r,a=window.getComputedStyle(t),l=a.display;if(l!=="flex"&&l!=="inline-flex")return null;let c=a.flexDirection,d=c==="column"||c==="column-reverse"?"vertical":"horizontal",p=d==="horizontal"?"vertical":"horizontal",u=[];if(e==="shift"){let h=mu(a.justifyContent);if(h){let x=Pi.indexOf(h);d==="horizontal"?(x>0&&u.push("left"),x<Pi.length-1&&u.push("right")):(x>0&&u.push("up"),x<Pi.length-1&&u.push("down"))}}else{let h=hu(a.alignItems);if(h){let x=Bi.indexOf(h);p==="horizontal"?(x>0&&u.push("left"),x<Bi.length-1&&u.push("right")):(x>0&&u.push("up"),x<Bi.length-1&&u.push("down"))}}if(u.length===0)return null;let g=14,f=7;return ao(bu,{children:u.map(h=>{let x,y;switch(h){case"right":x=s.right+g,y=s.top+s.height/2;break;case"left":x=s.left-g,y=s.top+s.height/2;break;case"down":x=s.left+s.width/2,y=s.bottom+g;break;case"up":x=s.left+s.width/2,y=s.top-g;break}let P=h==="right"?0:h==="left"?180:h==="down"?90:-90,C={position:"fixed",left:x-f,top:y-f,width:f*2,height:f*2,pointerEvents:"none",zIndex:9997};return ao("div",{"data-devtools":"swipe-hint",style:C,children:ao("svg",{width:f*2,height:f*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:yu("g",{transform:`rotate(${P})`,children:[ao("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),ao("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),ao("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:o,strokeWidth:"1.5",strokeLinecap:"round"}),ao("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:o,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},h)})})}import{useEffect as xu,useLayoutEffect as vu,useState as Su}from"react";import{jsx as Oi,jsxs as Di}from"react/jsx-runtime";function wu(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 el({element:t,fontSize:e,lineHeight:o,accentColor:n,hoveredProperty:r,draggingProperty:i,cursorViewport:s}){let[a,l]=Su(null);if(xu(()=>{if(!t){l(null);return}let y=()=>{l(Eo(t))};return y(),window.addEventListener("scroll",y,{passive:!0}),window.addEventListener("resize",y,{passive:!0}),()=>{window.removeEventListener("scroll",y),window.removeEventListener("resize",y)}},[t]),vu(()=>{t&&l(Eo(t))},[t,e,o]),!a)return null;let c=a.width,d=a.height,p=wu(n,.2),u=i!=null?i:r,g=8,f=2,h={position:"fixed",top:a.top,left:a.left,width:c,height:d,pointerEvents:"none",zIndex:9996,overflow:"visible"},x=y=>y==="font-size"?`${Math.round(e)}`:(e>0?o/e:1.2).toFixed(2).replace(/\.?0+$/,"");return Di("div",{"data-devtools":"text-handles",style:h,children:[Di("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${d}`,children:[Oi("rect",{x:"0.5",y:"0.5",width:Math.max(0,c-1),height:Math.max(0,d-1),fill:"none",stroke:p,strokeWidth:"1"}),(u==="font-size"||!u)&&Oi("rect",{x:c-f/2,y:d/2-g/2,width:f,height:g,fill:n,stroke:"#ffffff",strokeWidth:u==="font-size"?4:2,paintOrder:"stroke"}),(u==="line-height"||!u)&&Oi("rect",{x:c/2-g/2,y:d-f/2,width:g,height:f,fill:n,stroke:"#ffffff",strokeWidth:u==="line-height"?4:2,paintOrder:"stroke"})]}),s&&u&&(()=>{let y=u==="font-size"?"Aa":"Lh",P=x(u);return Di("div",{style:{position:"fixed",left:s.x+8,top:s.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:[y," ",P]})})()]})}import{Fragment as Bo,jsx as le,jsxs as Po}from"react/jsx-runtime";var nl=8,Fi=[0,1,2,4,8,12,16,20,24,28,32],Hi="devtools-active-text";function ol(t,e,o=0){let n=t.left+window.scrollX+4,r=e==="top-left"?t.top+window.scrollY-oo-o*oo+4:t.bottom+window.scrollY+4-1+o*oo,i=window.scrollY+4,s=window.scrollY+window.innerHeight-oo-4;return r<i?r=t.top+window.scrollY+4:r>s&&(r=Math.max(t.top+window.scrollY+4,s)),{x:n,y:r}}function rl({state:t,dispatch:e,onScreenshot:o,inFlightAnnotationIds:n,inFlightStyleSelectors:r,inFlightSelectorColors:i,onAttachImages:s,onReply:a,onViewThread:l,onCloseThread:c,activePlan:d,onModelComponentsAdd:p,onModelComponentFocus:u,onModelComponentHover:g,modelComponentNames:f,modelPanelHoveredComponent:h,modelSpacingTokenHover:x}){var hs,ys,bs,xs,vs,Ss,ws,ks,Es,Cs,Ts;let{canvasRef:y,redrawAll:P,resizeCanvas:C}=ma(),M=Le(!1);Ve(()=>{let w=y.current;if(!w)return;let k=()=>{M.current&&(M.current=!1,w.style.pointerEvents="")},K=L=>{L.button===0&&M.current&&k()};return window.addEventListener("mousedown",K),()=>window.removeEventListener("mousedown",K)},[y]);let[T,z]=ue(!1),[R,H]=ue(()=>{if(typeof window=="undefined")return null;try{let w=localStorage.getItem(Hi);return w?JSON.parse(w):null}catch(w){return null}}),[q,et]=ue(null),[B,U]=ue(null),[tt,kt]=ue(null),at=Le(null),Nt=Le(null),Et=Le({x:0,y:0}),Dt=Le([]),Ft=Le(0),[G,_t]=ue(null),[St,Vt]=ue(new Map),qt=Le(0),Ot=Le(null),[mt,se]=ue(null),[Q,yt]=ue(null),Z=Le({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,ee]=ue(null),[E,nt]=ue(null),[it,At]=ue(null),[bt,Ct]=ue(null),ht=Le({x:0,y:0}),[Xt,oe]=ue({x:0,y:0}),be=Le({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}),[ae,Ne]=ue(null),[re,Fe]=ue(null),[$t,Sn]=ue(null),[Ie,Ae]=ue(!1),[qe,rn]=ue(0),[sn,an]=ue(null),He=Le({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}),[j,Ht]=ue(null),[Wt,gn]=ue(null),[he,fe]=ue(null),ge=Le({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[xe,mn]=ue(null),[ln,Qe]=ue(null),[ie,X]=ue(null),ot=ha(),ft=Le(i);ft.current=i;let xt=We(w=>{let k=ft.current;if(!k||k.size===0)return!1;for(let K of k.keys())try{if(w.matches(K))return!0}catch(L){}return!1},[]),Pt=Le(t);Pt.current=t;let pt=Le(R);pt.current=R;let Ye=Le([]),cn=Le(o);cn.current=o;let[v,J]=ue(null),V=t.selectedAnnotationIds;Ye.current=V;let wt=We((w,k=!1)=>{e({type:"SELECT_ANNOTATION",payload:{id:w,addToSelection:k}})},[e]),ct=We(()=>{e({type:"SELECT_ANNOTATION",payload:{id:null}})},[e]),[Tt,gt]=ue(null),[Bt,Gt]=ue({x:window.scrollX,y:window.scrollY});Ve(()=>(C(),window.addEventListener("resize",C),()=>window.removeEventListener("resize",C)),[C]),Ve(()=>{let w=()=>{Gt({x:window.scrollX,y:window.scrollY})};return window.addEventListener("scroll",w,{passive:!0}),()=>window.removeEventListener("scroll",w)},[]),Ve(()=>{R?localStorage.setItem(Hi,JSON.stringify(R)):localStorage.removeItem(Hi)},[R]),ya(R,H,q,t.annotations,e);let Qt=Le(G);Qt.current=G,Ve(()=>{if(t.activeTool!=="model"||!t.isAnnotating)return;let w=k=>{if(!k.altKey||!Qt.current)return;k.preventDefault();let K=k.deltaY>0?-1:1;qt.current=Math.max(0,qt.current+K);let L=Ot.current;if(L){let O=dr(L,qt.current);_t(O)}};return window.addEventListener("wheel",w,{passive:!1}),()=>window.removeEventListener("wheel",w)},[t.activeTool,t.isAnnotating]),Ve(()=>{t.activeTool!=="model"&&(_t(null),Vt(new Map),qt.current=0,Ot.current=null)},[t.activeTool]),Ve(()=>{var K;let w=(K=G==null?void 0:G.name)!=null?K:null,k=w&&(f!=null&&f.has(w))?w:null;g==null||g(k)},[G,f,g]);let[ce,pe]=ue(null);Ve(()=>{var K;if(!h){pe(null);return}let w=So(h.name),k=h.instanceIndex;pe((K=w[k%w.length])!=null?K:null)},[h]);let[Ue,tn]=ue([]);Ve(()=>{var w,k;if(!x){tn([]);return}(k=(w=x.token)==null?void 0:w.bindings)!=null&&k.length?tn(Gr(x.token)):tn(Yr(x.px))},[x]);let Bn=Le(null),po=Le(null);Bn.current=ae,po.current=re,Ve(()=>{let w=["flex-start","center","flex-end"],k=["flex-start","center","flex-end"],L=null,O=!1,N=null,st=null,F=(dt,It)=>{let Zt=Yn(dt,It);for(;Zt&&Zt!==document.documentElement;){let de=window.getComputedStyle(Zt).display;if(de==="flex"||de==="inline-flex")return Zt;Zt=Zt.parentElement}return null},W=dt=>{let It=window.getComputedStyle(dt).flexDirection;return It==="column"||It==="column-reverse"?"vertical":"horizontal"},S=dt=>{let It=dt.getAttribute("data-pm");return It||(It=Math.random().toString(36).substring(2,8),dt.setAttribute("data-pm",It)),{selector:`[data-pm="${It}"]`,durableSelector:hn(dt)}},I=()=>{O=!0,L&&clearTimeout(L),L=setTimeout(()=>{O=!1,L=null},300)},Y=(dt,It,te)=>{let Zt=W(dt);if(It===Zt){let Yt=window.getComputedStyle(dt).justifyContent,ve=Yt==="normal"||Yt==="flex-start"||Yt==="start"?"flex-start":Yt==="flex-end"||Yt==="end"?"flex-end":Yt==="center"?"center":null;if(!ve)return;let _e=w.indexOf(ve)+te;if(_e<0||_e>=w.length)return;let Dn=w[_e],{selector:Kn,durableSelector:Dr}=S(dt);Jt(dt,"justify-content",Dn),e({type:"MODIFY_STYLES_BATCH",payload:{selector:Kn,durableSelector:Dr,element:Ze(dt),changes:[{property:"justify-content",original:Yt,modified:Dn}]}})}else{let Yt=window.getComputedStyle(dt).flexDirection,ve=Zt==="horizontal"?"column":"row",{selector:En,durableSelector:_e}=S(dt);Jt(dt,"flex-direction",ve),e({type:"MODIFY_STYLES_BATCH",payload:{selector:En,durableSelector:_e,element:Ze(dt),changes:[{property:"flex-direction",original:Yt,modified:ve}]}})}rn(de=>de+1)},A=(dt,It,te)=>{let de=W(dt)==="horizontal"?"vertical":"horizontal";if(It!==de)return;let ve=window.getComputedStyle(dt).alignItems,En=ve==="normal"||ve==="stretch"||ve==="flex-start"||ve==="start"?"flex-start":ve==="flex-end"||ve==="end"?"flex-end":ve==="center"?"center":null;if(!En)return;let Dn=k.indexOf(En)+te;if(Dn<0||Dn>=k.length)return;let Kn=k[Dn],{selector:Dr,durableSelector:Dl}=S(dt);Jt(dt,"align-items",Kn),e({type:"MODIFY_STYLES_BATCH",payload:{selector:Dr,durableSelector:Dl,element:Ze(dt),changes:[{property:"align-items",original:ve,modified:Kn}]}}),rn(Nl=>Nl+1)},D=20,_=null,$=null,lt=0,vt=(dt,It,te)=>{let Zt=F(It,te);an(Zt?{modifier:dt,target:Zt}:null)},ne=dt=>{if(!(t.activeTool!=="hand"||!t.isAnnotating)){if(dt.key==="Shift"&&!dt.altKey){let It=ht.current;vt("shift",It.x,It.y)}else if(dt.key==="Alt"&&!dt.shiftKey){let It=ht.current;vt("alt",It.x,It.y)}}},Kt=dt=>{if(t.activeTool!=="hand"||!t.isAnnotating)return;let It=dt.shiftKey&&!dt.altKey,te=dt.altKey&&!dt.shiftKey;if(!It&&!te||dt.buttons!==0){_=null,$=null,lt=0,N=null,st=null,an(null);return}if(N===null&&(N=dt.clientX,st=dt.clientY,vt(It?"shift":"alt",dt.clientX,dt.clientY)),O)return;_===null&&(_=dt.clientX,$=dt.clientY,lt=0);let Zt=dt.clientX-_,de=dt.clientY-$,Yt=Math.abs(Zt)>=Math.abs(de)?Zt:de;if(Math.abs(Yt)>3){let Kn=Yt>0?1:-1;if(lt!==0&&Kn!==lt){_=dt.clientX,$=dt.clientY,lt=0;return}lt=Kn}if(Math.abs(Zt)<D&&Math.abs(de)<D)return;let ve=F(N,st);if(!ve)return;let En=Math.abs(Zt)>=Math.abs(de)?"horizontal":"vertical",Dn=(En==="horizontal"?Zt:de)>0?1:-1;_=null,$=null,lt=0,It?Y(ve,En,Dn):A(ve,En,Dn),I()},Be=dt=>{(dt.key==="Shift"||dt.key==="Alt")&&(N=null,st=null,_=null,$=null,lt=0,an(null))},ye=()=>{an(null),_=null,$=null,lt=0};return window.addEventListener("keydown",ne),window.addEventListener("mousemove",Kt),window.addEventListener("mousedown",ye),window.addEventListener("keyup",Be),()=>{window.removeEventListener("keydown",ne),window.removeEventListener("mousemove",Kt),window.removeEventListener("mousedown",ye),window.removeEventListener("keyup",Be),L&&clearTimeout(L)}},[t.activeTool,t.isAnnotating,e]),Ve(()=>{let w=k=>{var O,N,st,F;if(k.key==="Escape"){if(pt.current)return;if(t.activeTool==="model"&&St.size>0){k.preventDefault(),Vt(new Map);return}if(Ye.current.length>0){k.preventDefault(),ct();return}}if(k.key==="Enter"&&t.activeTool==="model"&&St.size>0&&p){k.preventDefault();let W=[...St.keys()].filter(S=>!(f!=null&&f.has(S)));W.length>0&&p(W),Vt(new Map);return}if((k.metaKey||k.ctrlKey)&&k.key==="v"&&Dt.current.length>0&&!pt.current){k.preventDefault(),Ft.current++;let W=Ft.current*20,I=((O=Dt.current[0])==null?void 0:O.groupId)?Math.random().toString(36).substring(2,9):void 0,Y=Dt.current.map(D=>b(m({},D),{id:Math.random().toString(36).substring(2,9),groupId:D.groupId?I:void 0,timestamp:Date.now(),points:D.points.map(_=>({x:_.x+W,y:_.y+W}))}));e({type:"PASTE_ANNOTATIONS",payload:{annotations:Y}});let A=Y.find(D=>D.type!=="text")||Y[0];A&&wt(A.id);return}let K=Ye.current;if(K.length===0||pt.current)return;let L=(N=k.target)==null?void 0:N.tagName;if(!(L==="INPUT"||L==="TEXTAREA"||(st=k.target)!=null&&st.isContentEditable)&&(k.key==="Delete"||k.key==="Backspace")){if(k.preventDefault(),c){let W=Pt.current.annotations;for(let S of K){let I=W.find(A=>A.id===S);if(!I)continue;let Y=I.threadId||I.groupId&&((F=W.find(A=>A.groupId===I.groupId&&A.threadId))==null?void 0:F.threadId);Y&&c(Y)}}for(let W of K)e({type:"DELETE_ANNOTATION",payload:{id:W}});ct()}};return window.addEventListener("keydown",w),()=>window.removeEventListener("keydown",w)},[e,ct,wt,t.activeTool,St,f,p,c]);let Me=Ni(()=>vr(t.annotations),[t.annotations]),kn=Ni(()=>{let w=new Map,k=new Set,K=1;for(let L of t.annotations)if(!Me.has(L))if(L.groupId){if(!k.has(L.groupId)){k.add(L.groupId);let O=t.annotations.filter(N=>N.groupId===L.groupId);for(let N of O)w.set(N.id,K);K++}}else w.set(L.id,K),K++;return w},[t.annotations,Me]),cs=Ni(()=>{if(V.length===0)return null;let w=new Map;for(let k of V){let K=t.annotations.find(O=>O.id===k);if(!K)continue;let L=K.groupId?t.annotations.filter(O=>O.groupId===K.groupId):[K];for(let O of L)if(O.linkedSelector&&!(i!=null&&i.has(O.linkedSelector))){let N=O.color||t.activeColor;w.set(O.linkedSelector,N)}}return w.size>0?w:null},[V,t.annotations,t.activeColor,i]);Ve(()=>{let w=t.annotations.filter(k=>!(Me.has(k)||R&&!R.isNew&&k.id===R.id));P(w,t.currentPath,t.activeTool,t.activeColor,t.strokeWidth,V,nl,Bt.x,Bt.y,kn)},[t.annotations,t.currentPath,t.activeTool,t.activeColor,t.strokeWidth,P,R,V,Bt,kn,Me]),Ve(()=>{if(B){let w=Math.random().toString(36).substring(2,9);H({id:w,point:B.point,text:"",fontSize:12,isNew:!0,groupId:B.groupId}),U(null)}},[B]),Ve(()=>{tt&&(H({id:Math.random().toString(36).substring(2,9),point:tt.point,text:"",fontSize:12,isNew:!0,linkedSelector:tt.linkedSelector,linkedAnchor:tt.linkedAnchor,elements:tt.elements}),kt(null))},[tt]);let nr=Le(null),or=(hs=R==null?void 0:R.id)!=null?hs:null;Ve(()=>{or&&at.current?requestAnimationFrame(()=>{var K;let w=at.current;if(!w||(w.focus(),Nt.current===or))return;Nt.current=or;let k=pt.current;if(k){if(nr.current!==null){let L=Math.min(nr.current,w.value.length);w.setSelectionRange(L,L);return}if(!k.isNew&&k.clickPoint){let L=y.current;if(!L)return;let O=L.getContext("2d");if(!O)return;O.font=`${k.fontSize}px ${Ee}`;let N=k.fontSize*1.4,st=k.text.split(`
|
|
8
|
-
`),F=k.clickPoint.y-k.point.y,W=Math.max(0,Math.min(st.length-1,Math.floor(F/N))),S=k.clickPoint.x-k.point.x,I=st[W]||"",Y=0;for(let D=0;D<=I.length;D++){let
|
|
9
|
-
`),I=N.x-Bt.x,Y=eo(I),A=Y!==void 0?Math.min(400,Y):void 0,D=A?jn(W,S,A):S,_=A?Math.min(A,Math.max(...D.map(ne=>W.measureText(ne).width))):Math.max(...S.map(ne=>W.measureText(ne).width)),$=D.length*(st*1.4),lt=S.length*(st*1.4),vt=$-lt;if(w.x>=N.x-4-4&&w.x<=N.x+_+4+4&&w.y>=N.y-4-4-vt&&w.y<=N.y+lt+4+4)return L}}break}case"rectangle":{if(L.points.length<2)continue;let N=L.points[0],st=L.points[L.points.length-1],F=Math.min(N.x,st.x),W=Math.max(N.x,st.x),S=Math.min(N.y,st.y),I=Math.max(N.y,st.y),Y=Un(w,{x:F,y:S},{x:W,y:S},O),A=Un(w,{x:F,y:I},{x:W,y:I},O),D=Un(w,{x:F,y:S},{x:F,y:I},O),_=Un(w,{x:W,y:S},{x:W,y:I},O);if(Y||A||D||_)return L;break}case"circle":{if(L.points.length<2)continue;let N=L.points[0],st=L.points[L.points.length-1],F=(N.x+st.x)/2,W=(N.y+st.y)/2,S=Math.abs(st.x-N.x)/2,I=Math.abs(st.y-N.y)/2,Y=w.x-F,A=w.y-W,D=Math.sqrt((Y/S)**2+(A/I)**2);if(Math.abs(D-1)*Math.max(S,I)<=O)return L;break}case"line":{if(L.points.length<2)continue;let N=L.points[0],st=L.points[L.points.length-1];if(Un(w,N,st,O))return L;break}case"freehand":{if(L.points.length<2)continue;for(let N=0;N<L.points.length-1;N++){let st=L.points[N],F=L.points[N+1];if(Un(w,st,F,O))return L}break}}}return null},[t.annotations,y,Un,Me,Bt.x]),ds=We(w=>{let k=rr(w);return(k==null?void 0:k.type)==="text"?k:null},[rr]),us=We(w=>{if(V.length===0)return null;let k=nl/2+4;for(let K of V){let L=t.annotations.find(O=>O.id===K);if(!(!L||L.points.length<2)){if(L.type==="line"){let O=L.points[0],N=L.points[L.points.length-1];if(Math.sqrt((w.x-O.x)**2+(w.y-O.y)**2)<=k)return{handle:"start",annotationId:K};if(Math.sqrt((w.x-N.x)**2+(w.y-N.y)**2)<=k)return{handle:"end",annotationId:K};continue}if(L.type==="circle"){let O=L.points[0],N=L.points[L.points.length-1],st=Math.min(O.x,N.x),F=Math.max(O.x,N.x),W=Math.min(O.y,N.y),S=Math.max(O.y,N.y),I=(st+F)/2,Y=(W+S)/2,A=[{handle:"top",x:I,y:W},{handle:"bottom",x:I,y:S},{handle:"left",x:st,y:Y},{handle:"right",x:F,y:Y}];for(let{handle:D,x:_,y:$}of A)if(Math.sqrt((w.x-_)**2+(w.y-$)**2)<=k)return{handle:D,annotationId:K};continue}if(L.type==="rectangle"||L.type==="freehand"){let O=L.points[0],N=L.points[L.points.length-1],st,F,W,S;L.type==="freehand"?(st=Math.min(...L.points.map(Y=>Y.x)),F=Math.max(...L.points.map(Y=>Y.x)),W=Math.min(...L.points.map(Y=>Y.y)),S=Math.max(...L.points.map(Y=>Y.y))):(st=Math.min(O.x,N.x),F=Math.max(O.x,N.x),W=Math.min(O.y,N.y),S=Math.max(O.y,N.y));let I=[{corner:"topLeft",x:st,y:W},{corner:"topRight",x:F,y:W},{corner:"bottomLeft",x:st,y:S},{corner:"bottomRight",x:F,y:S}];for(let{corner:Y,x:A,y:D}of I)if(Math.sqrt((w.x-A)**2+(w.y-D)**2)<=k)return{handle:Y,annotationId:K}}}}return null},[V,t.annotations]);Ve(()=>{let w=k=>{if(Et.current={x:k.clientX+window.scrollX,y:k.clientY+window.scrollY},!R){let K=ds(Et.current);et((K==null?void 0:K.id)||null)}};return window.addEventListener("mousemove",w),()=>window.removeEventListener("mousemove",w)},[R,ds]);let go=We(()=>{var k;if(!R)return;let w=((k=R.images)==null?void 0:k.length)||0;if(R.text.trim()||w>0)if(R.isNew){let K=vo();e({type:"ADD_TEXT",payload:m({point:R.point,text:R.text||(w>0?`[${w} image${w>1?"s":""}]`:""),fontSize:R.fontSize,id:K,groupId:R.groupId,linkedSelector:R.linkedSelector,linkedAnchor:R.linkedAnchor,elements:R.elements},w>0?{imageCount:w}:{})}),w>0&&R.images&&s&&s(K,R.images)}else e({type:"UPDATE_TEXT",payload:m({id:R.id,text:R.text||(w>0?`[${w} image${w>1?"s":""}]`:"")},w>0?{imageCount:w}:{})}),w>0&&R.images&&s&&s(R.id,R.images);else R.isNew||e({type:"DELETE_ANNOTATION",payload:{id:R.id}});H(null)},[R,e,s]),On=We(w=>{for(let k=0;k<Fi.length-1;k++){let K=Fi[k],L=Fi[k+1];if(w<=(K+L)/2)return K;if(w<L)return L}return Math.round(w/8)*8},[]),ps=We((w,k,K,L)=>{let O=K.top+Math.max(L.top,4),N=K.bottom-Math.max(L.bottom,4),st=K.left+Math.max(L.left,4),F=K.right-Math.max(L.right,4);if(w<K.left||w>K.right||k<K.top||k>K.bottom)return null;let W=k<O,S=k>N,I=w<st,Y=w>F;return W&&I?L.top>=L.left?"top":"left":W&&Y?L.top>=L.right?"top":"right":S&&I?L.bottom>=L.left?"bottom":"left":S&&Y?L.bottom>=L.right?"bottom":"right":W?"top":S?"bottom":I?"left":Y?"right":null},[]),fs=We(w=>{var N,st;if(!t.isAnnotating)return;if(t.inspectedElement&&t.activeTool==="hand"&&!("button"in w&&w.button===2)){w.preventDefault(),w.stopPropagation(),e({type:"SELECT_ELEMENT",payload:null});return}let k=fo(w),K="shiftKey"in w&&w.shiftKey;if(t.activeTool==="inspector"){if("button"in w&&w.button===2)return;if(mt&&!xt(mt)){let F=Ze(mt),W=hn(mt),S=mt.getBoundingClientRect(),I=mt.getAttribute("data-pm");I||(I=Math.random().toString(36).substring(2,8),mt.setAttribute("data-pm",I));let Y=`[data-pm="${I}"]`,A=t.styleModifications.some(vt=>{try{return mt.matches(vt.selector)}catch(ne){return!1}}),D=t.annotations.filter(vt=>{if(!vt.linkedSelector)return!1;try{return mt.matches(vt.linkedSelector)}catch(ne){return!1}}).length,_=(A?1:0)+D,$=S.top>=oo*(1+_)?"top-left":"bottom-left",lt=ol(S,$,_);kt({point:lt,linkedSelector:Y,linkedAnchor:$,elements:[b(m({},F),{selector:W})]})}return}if(t.activeTool==="model"){if("button"in w&&w.button===2)return;if(G){let F=G.name;if(f!=null&&f.has(F)){u==null||u(F);return}"shiftKey"in w&&w.shiftKey?Vt(S=>{let I=new Map(S);return I.has(F)?I.delete(F):I.set(F,G),I}):St.size===1&&St.has(F)?(p&&p([F]),Vt(new Map)):Vt(new Map([[F,G]]))}return}if(t.activeTool==="hand"&&ae&&re){let F=ae,W=F.getAttribute("data-pm");W||(W=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",W));let S=hn(F),I=`[data-pm="${W}"]`,Y=Ze(F),A=jo(F),D=k.x-window.scrollX,_=k.y-window.scrollY,$=Ie,lt=window.getComputedStyle(F).justifyContent,vt=0;if($){let Kt=Qn(F).find(Be=>Be.axis===re);vt=Kt?re==="column"?Kt.w:Kt.h:0}Jt(F,"transition","none"),be.current={isDragging:!0,hasMoved:!1,axis:re,startX:D,startY:_,originalRow:$?vt:A.row,originalColumn:$?vt:A.column,element:F,elementInfo:b(m({},Y),{selector:I}),selector:I,durableSelector:S,isAuto:$,originalJustifyContent:lt,visualGap:vt},Sn({axis:re,row:$?vt:A.row,column:$?vt:A.column});return}if(t.activeTool==="hand"&&xe&&ln){let F=xe,W=F.getAttribute("data-pm");W||(W=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",W));let S=`[data-pm="${W}"]`,I=Ze(F),{fontSize:Y,lineHeight:A}=Go(F),D=Y>0?A/Y:1.2,_=k.x-window.scrollX,$=k.y-window.scrollY;Jt(F,"transition","none");let lt=hn(F);ge.current={isDragging:!0,property:ln,startX:_,startY:$,originalFontSize:Y,originalLineHeight:A,originalRatio:D,element:F,elementInfo:b(m({},I),{selector:S}),selector:S,durableSelector:lt},X({property:ln,fontSize:Y,lineHeight:A});return}if(t.activeTool==="hand"&&j&&Wt){let F=j,W=F.getAttribute("data-pm");W||(W=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",W));let S=`[data-pm="${W}"]`,I=hn(F),Y=Ze(F),A=to(F),D=F.getBoundingClientRect(),_=Math.floor(D.height/2),$=k.y-window.scrollY;Jt(F,"transition","none"),He.current={isDragging:!0,corner:Wt,startY:$,original:A,maxRadius:_,element:F,elementInfo:b(m({},Y),{selector:S}),selector:S,durableSelector:I},fe({corner:Wt,radius:m({},A)});return}if(t.activeTool==="hand"&&Lt&&E){let F=Lt,W=F.getAttribute("data-pm");W||(W=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",W));let S=`[data-pm="${W}"]`,I=hn(F),Y=Ze(F),A=ko(F),D=k.x-window.scrollX,_=k.y-window.scrollY;Jt(F,"transition","none"),Z.current={isDragging:!0,side:E,startX:D,startY:_,original:A,element:F,elementInfo:b(m({},Y),{selector:S}),selector:S,durableSelector:I},Ct({side:E,padding:m({},A)});return}let L=us(k);if(L){let F=t.annotations.find(W=>W.id===L.annotationId);if(F&&F.type!=="text"&&((N=F.status)!=null?N:"pending")==="pending"){gt({annotationId:L.annotationId,handle:L.handle,startPoint:k,originalPoints:[...F.points],hasMoved:!1});return}}let O=rr(k);if(O&&O.points[0]){if(R&&go(),O.type!=="text"?(wt(O.id,K),O.color&&e({type:"SET_COLOR",payload:O.color})):K||ct(),l){let F=O.threadId||(O.groupId?(st=t.annotations.find(W=>W.groupId===O.groupId&&W.threadId))==null?void 0:st.threadId:void 0);F&&l(F)}J({annotation:O,startPoint:k,hasMoved:!1});return}if(K||ct(),t.activeTool==="text"){R&&go();let F=Math.random().toString(36).substring(2,9);H({id:F,point:k,text:"",fontSize:12,isNew:!0});return}z(!0),e({type:"START_PATH",payload:k})},[t.isAnnotating,t.activeTool,t.inspectedElement,t.annotations,R,V,mt,Lt,E,j,Wt,ae,re,Ie,xe,ln,G,St,f,p,u,l,fo,rr,us,e,wt,ct,go]),gs=We(w=>{var K,L;let k=fo(w);if(t.activeTool==="inspector"&&t.isAnnotating){let O=k.x-window.scrollX,N=k.y-window.scrollY,st=Yn(O,N),F=st&&xt(st)?null:st;F!==mt&&(se(F),yt(F?Ze(F):null));return}if(t.activeTool==="model"&&t.isAnnotating){let O=k.x-window.scrollX,N=k.y-window.scrollY,st=Yn(O,N);if(st!==Ot.current&&(Ot.current=st,qt.current=0),st){let F=dr(st,qt.current);_t(F)}else _t(null);return}if(t.activeTool==="hand"&&t.isAnnotating){let O=k.x-window.scrollX,N=k.y-window.scrollY;ht.current={x:O,y:N},oe({x:O,y:N});let st=ot.current.cmd,F=ot.current.shift;if(be.current.isDragging){let S=be.current,I=S.element;if(!I)return;if(!S.hasMoved){let _=Math.abs(O-S.startX),$=Math.abs(N-S.startY);if(_<=2&&$<=2)return;S.hasMoved=!0,S.isAuto&&(Jt(I,"justify-content","normal"),Jt(I,"row-gap",`${S.visualGap}px`),Jt(I,"column-gap",`${S.visualGap}px`),Ae(!1))}let Y=S.axis,A=S.originalRow,D=S.originalColumn;if(Y==="column"){let _=O-S.startX;D=S.originalColumn+_,st||(A=S.originalRow+_)}else{let _=N-S.startY;A=S.originalRow+_,st||(D=S.originalColumn+_)}A=Math.max(0,A),D=Math.max(0,D),F&&(A=On(A),D=On(D)),A=Math.round(A),D=Math.round(D),Jt(I,"row-gap",`${A}px`),Jt(I,"column-gap",`${D}px`),Sn({axis:Y,row:A,column:D});return}if(He.current.isDragging){let S=He.current,I=S.element;if(!I)return;let Y=N-S.startY,A=S.corner,D=S.original,_=m({},D);if(st){let $=D[A]+Y;$=Math.max(0,Math.min(S.maxRadius,$)),F&&($=On($)),$=Math.round($),_[A]=$}else{let $=D[A]+Y;$=Math.max(0,Math.min(S.maxRadius,$)),F&&($=On($)),$=Math.round($),_={"top-left":$,"top-right":$,"bottom-right":$,"bottom-left":$}}Jt(I,"border-top-left-radius",`${_["top-left"]}px`),Jt(I,"border-top-right-radius",`${_["top-right"]}px`),Jt(I,"border-bottom-right-radius",`${_["bottom-right"]}px`),Jt(I,"border-bottom-left-radius",`${_["bottom-left"]}px`),fe({corner:A,radius:_});return}if(ge.current.isDragging){let S=ge.current,I=S.element;if(!I)return;let Y=S.property,A=S.originalFontSize,D=S.originalLineHeight,_=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(Y==="font-size"){let lt=O-S.startX;A=S.originalFontSize+lt,A=Math.max(1,A)}else{let lt=N-S.startY;D=S.originalLineHeight+lt,D=Math.max(A,D)}if(F)if(Y==="font-size"){let lt=_[0],vt=Math.abs(A-lt);for(let ne of _){let Kt=Math.abs(A-ne);Kt<vt&&(lt=ne,vt=Kt)}A=lt}else{let lt=A>0?D/A:1.2,vt=Math.round(lt*2)/2;D=A*Math.max(1,vt)}A=Math.round(A),D=Math.round(D*10)/10,Jt(I,"font-size",`${A}px`);let $=A>0?Math.round(D/A*1e3)/1e3:1.2;Jt(I,"line-height",`${$}`),X({property:Y,fontSize:A,lineHeight:D});return}if(Z.current.isDragging){let S=Z.current,I=S.element;if(!I)return;let Y=S.side,A=S.original,D=A.top,_=A.right,$=A.bottom,lt=A.left;if(Y==="top"){let vt=S.startY-N;D=A.top+vt,st||($=A.bottom+vt)}else if(Y==="bottom"){let vt=N-S.startY;$=A.bottom+vt,st||(D=A.top+vt)}else if(Y==="left"){let vt=S.startX-O;lt=A.left+vt,st||(_=A.right+vt)}else if(Y==="right"){let vt=O-S.startX;_=A.right+vt,st||(lt=A.left+vt)}D=Math.max(0,D),_=Math.max(0,_),$=Math.max(0,$),lt=Math.max(0,lt),F&&(D=On(D),_=On(_),$=On($),lt=On(lt)),D=Math.round(D),_=Math.round(_),$=Math.round($),lt=Math.round(lt),Jt(I,"padding",`${D}px ${_}px ${$}px ${lt}px`),Ct({side:Y,padding:{top:D,right:_,bottom:$,left:lt}});return}let W=Yn(O,N);for(;W&&W.tagName==="A";)W=W.parentElement;{let I=[];W&&I.push(W),j&&j!==W&&I.push(j);let Y=null,A=16,D=null;for(let _ of I){let $=_.getBoundingClientRect(),lt=to(_),vt=[["top-left",$.left,$.top+lt["top-left"]],["top-right",$.right,$.top+lt["top-right"]],["bottom-right",$.right,$.bottom-lt["bottom-right"]],["bottom-left",$.left,$.bottom-lt["bottom-left"]]];for(let[ne,Kt,Be]of vt){let ye=Math.hypot(O-Kt,N-Be);ye<A&&(A=ye,Y=ne,D=_)}}if(Y&&D){Ht(D),gn(Y),Lt&&ee(null),E&&nt(null),ae&&Ne(null),re&&Fe(null),Ae(!1),xe&&mn(null),ln&&Qe(null);return}}j&&Ht(null),Wt&&gn(null);{let S=[];W&&fr(W)&&S.push(W);let I=(K=W==null?void 0:W.parentElement)!=null?K:null;for(;I&&I!==document.body&&S.length<3;)fr(I)&&S.push(I),I=I.parentElement;for(let Y of S){let D=Qn(Y).find(_=>O>=_.x&&O<=_.x+_.w&&N>=_.y&&N<=_.y+_.h);if(D){Ne(Y),Fe(D.axis),Ae(Xr(Y,D.axis)),Lt&&ee(null),E&&nt(null),xe&&mn(null),ln&&Qe(null);return}}}ae&&Ne(null),re&&Fe(null),Ae(!1);{let I=[];W&&I.push(W),xe&&xe!==W&&I.push(xe);let Y=null,A=1/0,D=null;for(let _ of I){if(!Ur(_))continue;let $=Eo(_);if(!$)continue;let lt=O>=$.left&&O<=$.right&&N>=$.top&&N<=$.bottom,vt=[["font-size",$.right,$.top+$.height/2],["line-height",$.left+$.width/2,$.bottom]];for(let[ne,Kt,Be]of vt){let ye=Math.hypot(O-Kt,N-Be);(lt||ye<12)&&ye<A&&(A=ye,Y=ne,D=_)}}Y&&D?(mn(D),Qe(Y)):(xe&&mn(null),ln&&Qe(null))}if(W!==Lt&&ee(W),W){let S=ko(W),I=W.getBoundingClientRect(),Y=ps(O,N,I,S);nt(Y)}else nt(null);return}if(Tt){let{handle:O,originalPoints:N,hasMoved:st}=Tt,F=t.annotations.find(A=>A.id===Tt.annotationId);if(!F)return;let W="metaKey"in w,S=W&&(w.metaKey||w.ctrlKey),I=W&&w.shiftKey,Y;if(F.type==="line"){let A=N[0],D=N[N.length-1];O==="start"?Y=[k,D]:Y=[A,k]}else if(F.type==="freehand"){let A=Math.min(...N.map(Yt=>Yt.x)),D=Math.max(...N.map(Yt=>Yt.x)),_=Math.min(...N.map(Yt=>Yt.y)),$=Math.max(...N.map(Yt=>Yt.y)),lt=(A+D)/2,vt=(_+$)/2,ne=D-A||1,Kt=$-_||1,Be=ne/Kt,ye=A,dt=D,It=_,te=$;switch(O){case"topLeft":ye=k.x,It=k.y;break;case"topRight":dt=k.x,It=k.y;break;case"bottomLeft":ye=k.x,te=k.y;break;case"bottomRight":dt=k.x,te=k.y;break}if(S)switch(O){case"topLeft":dt=D+(A-ye),te=$+(_-It);break;case"topRight":ye=A-(dt-D),te=$+(_-It);break;case"bottomLeft":dt=D+(A-ye),It=_-(te-$);break;case"bottomRight":ye=A-(dt-D),It=_-(te-$);break}if(I){let Yt=dt-ye,ve=te-It;if(Math.abs(Yt/ve)>Be){let _e=Math.abs(ve)*Be*Math.sign(Yt);O==="topLeft"||O==="bottomLeft"?ye=dt-_e:dt=ye+_e}else{let _e=Math.abs(Yt)/Be*Math.sign(ve);O==="topLeft"||O==="topRight"?It=te-_e:te=It+_e}}let Zt=dt-ye||1,de=te-It||1;Y=N.map(Yt=>({x:ye+(Yt.x-A)/ne*Zt,y:It+(Yt.y-_)/Kt*de}))}else if(F.type==="circle"){let A=N[0],D=N[N.length-1],_=Math.min(A.x,D.x),$=Math.max(A.x,D.x),lt=Math.min(A.y,D.y),vt=Math.max(A.y,D.y),ne=(_+$)/2,Kt=(lt+vt)/2,Be=$-_,ye=vt-lt,dt=_,It=$,te=lt,Zt=vt;switch(O){case"top":if(te=k.y,S&&(Zt=Kt+(Kt-k.y)),I){let Yt=(Zt-te)*(Be/ye)/2;dt=ne-Yt,It=ne+Yt}break;case"bottom":if(Zt=k.y,S&&(te=Kt-(k.y-Kt)),I){let Yt=(Zt-te)*(Be/ye)/2;dt=ne-Yt,It=ne+Yt}break;case"left":if(dt=k.x,S&&(It=ne+(ne-k.x)),I){let Yt=(It-dt)*(ye/Be)/2;te=Kt-Yt,Zt=Kt+Yt}break;case"right":if(It=k.x,S&&(dt=ne-(k.x-ne)),I){let Yt=(It-dt)*(ye/Be)/2;te=Kt-Yt,Zt=Kt+Yt}break}Y=[{x:dt,y:te},{x:It,y:Zt}]}else{let A=N[0],D=N[N.length-1],_=Math.min(A.x,D.x),$=Math.max(A.x,D.x),lt=Math.min(A.y,D.y),vt=Math.max(A.y,D.y),ne=(_+$)/2,Kt=(lt+vt)/2,Be=$-_||1,ye=vt-lt||1,dt=Be/ye,It=_,te=$,Zt=lt,de=vt;switch(O){case"topLeft":It=k.x,Zt=k.y;break;case"topRight":te=k.x,Zt=k.y;break;case"bottomLeft":It=k.x,de=k.y;break;case"bottomRight":te=k.x,de=k.y;break}if(S)switch(O){case"topLeft":te=$+(_-It),de=vt+(lt-Zt);break;case"topRight":It=_-(te-$),de=vt+(lt-Zt);break;case"bottomLeft":te=$+(_-It),Zt=lt-(de-vt);break;case"bottomRight":It=_-(te-$),Zt=lt-(de-vt);break}if(I){let Yt=te-It,ve=de-Zt;if(Math.abs(Yt/ve)>dt){let _e=Math.abs(ve)*dt*Math.sign(Yt);O==="topLeft"||O==="bottomLeft"?It=te-_e:te=It+_e}else{let _e=Math.abs(Yt)/dt*Math.sign(ve);O==="topLeft"||O==="topRight"?Zt=de-_e:de=Zt+_e}}Y=[{x:It,y:Zt},{x:te,y:de}]}e({type:"RESIZE_ANNOTATION",payload:{id:Tt.annotationId,points:Y,saveUndo:!st}}),st||gt(b(m({},Tt),{hasMoved:!0}));return}if(v&&((L=v.annotation.status)!=null?L:"pending")==="pending"){let O=k.x-v.startPoint.x,N=k.y-v.startPoint.y;if((Math.abs(O)>2||Math.abs(N)>2)&&!v.hasMoved)J(b(m({},v),{hasMoved:!0,startPoint:k})),e({type:"MOVE_ANNOTATION",payload:{id:v.annotation.id,delta:{x:O,y:N},saveUndo:!0}});else if(v.hasMoved){let F=k.x-v.startPoint.x,W=k.y-v.startPoint.y;J(b(m({},v),{startPoint:k})),e({type:"MOVE_ANNOTATION",payload:{id:v.annotation.id,delta:{x:F,y:W}}})}return}!T||!t.isAnnotating||e({type:"CONTINUE_PATH",payload:k})},[T,t.isAnnotating,t.activeTool,v,Tt,mt,Lt,E,j,Wt,ae,re,xe,ln,fo,e,On,ps]),Or=We(w=>{var L,O,N,st,F,W;if(ge.current.isDragging){let S=ge.current,I=S.element;if(I&&S.selector&&S.elementInfo&&ie){I instanceof HTMLElement&&(I.style.removeProperty("font-size"),I.style.removeProperty("line-height"),I.style.removeProperty("transition"));let Y=[];if(S.originalFontSize!==ie.fontSize&&(Jt(I,"font-size",`${ie.fontSize}px`),Y.push({property:"font-size",original:`${S.originalFontSize}px`,modified:`${ie.fontSize}px`})),S.originalLineHeight!==ie.lineHeight){let A=S.originalFontSize>0?Math.round(S.originalLineHeight/S.originalFontSize*1e3)/1e3:1.2,D=ie.fontSize>0?Math.round(ie.lineHeight/ie.fontSize*1e3)/1e3:1.2;Jt(I,"line-height",`${D}`),Y.push({property:"line-height",original:`${A}`,modified:`${D}`})}Y.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(L=S.durableSelector)!=null?L:void 0,element:S.elementInfo,changes:Y}})}ge.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},X(null);return}if(be.current.isDragging){let S=be.current,I=S.element,Y="button"in w&&w.button===2;if(!S.hasMoved&&!Y&&I&&S.selector&&S.elementInfo){I instanceof HTMLElement&&I.style.removeProperty("transition");let A=["space-between","space-around","stretch","normal"],D=S.originalJustifyContent||"normal",_=A.indexOf(D),$=A[(_+1)%A.length],lt=[];$==="normal"?(Jt(I,"justify-content","normal"),lt.push({property:"justify-content",original:S.originalJustifyContent,modified:"normal"})):$==="stretch"?(Jt(I,"justify-content",$),Jt(I,"row-gap","8px"),Jt(I,"column-gap","8px"),lt.push({property:"justify-content",original:S.originalJustifyContent||"normal",modified:$}),S.originalRow!==8&<.push({property:"row-gap",original:`${S.originalRow}px`,modified:"8px"}),S.originalColumn!==8&<.push({property:"column-gap",original:`${S.originalColumn}px`,modified:"8px"})):(I instanceof HTMLElement&&(I.style.removeProperty("row-gap"),I.style.removeProperty("column-gap")),Jt(I,"justify-content",$),lt.push({property:"justify-content",original:S.originalJustifyContent||"normal",modified:$}),S.originalRow>0&<.push({property:"row-gap",original:`${S.originalRow}px`,modified:"0px"}),S.originalColumn>0&<.push({property:"column-gap",original:`${S.originalColumn}px`,modified:"0px"})),lt.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(O=S.durableSelector)!=null?O:void 0,element:S.elementInfo,changes:lt}})}else if(S.hasMoved&&I&&S.selector&&S.elementInfo&&$t){I instanceof HTMLElement&&(I.style.removeProperty("row-gap"),I.style.removeProperty("column-gap"),I.style.removeProperty("transition"));let A=[];S.isAuto?(I instanceof HTMLElement&&I.style.removeProperty("justify-content"),Jt(I,"justify-content","normal"),Jt(I,"row-gap",`${$t.row}px`),Jt(I,"column-gap",`${$t.column}px`),A.push({property:"justify-content",original:S.originalJustifyContent,modified:"normal"}),A.push({property:"row-gap",original:"0px",modified:`${$t.row}px`}),A.push({property:"column-gap",original:"0px",modified:`${$t.column}px`})):(S.originalRow!==$t.row&&(Jt(I,"row-gap",`${$t.row}px`),A.push({property:"row-gap",original:`${S.originalRow}px`,modified:`${$t.row}px`})),S.originalColumn!==$t.column&&(Jt(I,"column-gap",`${$t.column}px`),A.push({property:"column-gap",original:`${S.originalColumn}px`,modified:`${$t.column}px`}))),A.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(N=S.durableSelector)!=null?N:void 0,element:S.elementInfo,changes:A}})}be.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},Sn(null);return}if(He.current.isDragging){let S=He.current,I=S.element;if(I&&S.selector&&S.elementInfo&&he){I instanceof HTMLElement&&(I.style.removeProperty("border-top-left-radius"),I.style.removeProperty("border-top-right-radius"),I.style.removeProperty("border-bottom-right-radius"),I.style.removeProperty("border-bottom-left-radius"),I.style.removeProperty("transition"));let Y=["top-left","top-right","bottom-right","bottom-left"],A={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},D=[];for(let _ of Y)S.original[_]!==he.radius[_]&&(Jt(I,A[_],`${he.radius[_]}px`),D.push({property:A[_],original:`${S.original[_]}px`,modified:`${he.radius[_]}px`}));D.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(st=S.durableSelector)!=null?st:void 0,element:S.elementInfo,changes:D}})}He.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},fe(null);return}if(Z.current.isDragging){let S=Z.current,I=S.element,Y=S.selector,A=S.elementInfo;if(I&&Y&&A&&bt){let D=S.original,_=bt.padding;I instanceof HTMLElement&&(I.style.removeProperty("padding"),I.style.removeProperty("transition"));let $=[],lt=[{prop:"padding-top",origVal:D.top,newVal:_.top},{prop:"padding-right",origVal:D.right,newVal:_.right},{prop:"padding-bottom",origVal:D.bottom,newVal:_.bottom},{prop:"padding-left",origVal:D.left,newVal:_.left}];for(let{prop:vt,origVal:ne,newVal:Kt}of lt)ne!==Kt&&(Jt(I,vt,`${Kt}px`),$.push({property:vt,original:`${ne}px`,modified:`${Kt}px`}));$.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:Y,durableSelector:(F=S.durableSelector)!=null?F:void 0,element:A,changes:$}})}Z.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},Ct(null);return}if(Tt){gt(null);return}if(v){if(!v.hasMoved&&v.annotation.type==="text"&&((W=v.annotation.status)!=null?W:"pending")==="pending"){let S=fo(w);H({id:v.annotation.id,point:v.annotation.points[0],text:v.annotation.text||"",fontSize:v.annotation.fontSize||12,isNew:!1,clickPoint:S,groupId:v.annotation.groupId})}J(null);return}if(!T)return;let k=5;if(t.currentPath.length>=2){let S=t.currentPath[0],I=t.currentPath[t.currentPath.length-1],Y=Math.abs(I.x-S.x),A=Math.abs(I.y-S.y);if((t.activeTool==="line"?Math.sqrt(Y*Y+A*A)<k:Y<k&&A<k)&&["rectangle","circle","line"].includes(t.activeTool)){z(!1),e({type:"CANCEL_PATH"});return}}let K=$r(t.currentPath);if(t.activeTool==="rectangle"&&t.currentPath.length>=2){let S=t.currentPath[0],I=t.currentPath[t.currentPath.length-1],Y=Math.min(S.x,I.x),A=Math.max(S.y,I.y),D=t.strokeWidth/2,_=Math.random().toString(36).substring(2,9);U({point:{x:Y-D+4,y:A+D+4},groupId:_}),z(!1),e({type:"FINISH_PATH",payload:{groupId:_,elements:K}});return}z(!1),e({type:"FINISH_PATH",payload:{elements:K}})},[T,v,Tt,bt,he,$t,ie,fo,e,t.activeTool,t.currentPath,t.strokeWidth]),Tl=We(w=>{let k=w.target.value;nr.current=w.target.selectionStart,H(K=>K&&b(m({},K),{text:k}))},[]),Il=We(w=>{w.key==="Escape"?H(null):w.key==="Enter"&&!w.shiftKey&&(w.preventDefault(),go())},[go]),Ml=We(w=>{if(!R)return;let k=w.clipboardData.items,K=[];for(let L=0;L<k.length;L++){let O=k[L];if(O.type.startsWith("image/")){let N=O.getAsFile();N&&K.push(N)}}K.length>0&&(w.preventDefault(),H(L=>L?b(m({},L),{images:[...L.images||[],...K]}):null))},[R]),Ll=We(w=>{if(!t.isAnnotating)return;if(t.activeTool==="hand"){w.preventDefault();let K=Lt||ae||j||xe;if(K&&!xt(K)){let L=Ze(K),O=hn(K);e({type:"SELECT_ELEMENT",payload:{el:K,info:b(m({},L),{selector:O})}})}return}w.preventDefault();let k=y.current;k&&(M.current=!0,k.style.pointerEvents="none",setTimeout(()=>{M.current&&(M.current=!1,k.style.pointerEvents="")},4e3))},[t.activeTool,t.isAnnotating,Lt,ae,j,xe,e,xt,y]);Ve(()=>{let w=t.annotations.filter(N=>N.linkedSelector);if(w.length===0)return;let k=null,K=()=>{var st,F,W;let N=[];for(let S of w){let I=document.querySelector(S.linkedSelector);if(!I&&((F=(st=S.elements)==null?void 0:st[0])!=null&&F.selector)&&S.linkedSelector.startsWith("[data-pm=")){try{I=document.querySelector(S.elements[0].selector)}catch(Kt){}if(I){let Kt=(W=S.linkedSelector.match(/data-pm="([^"]+)"/))==null?void 0:W[1];Kt&&I.setAttribute("data-pm",Kt)}}if(!I)continue;let Y=I.getBoundingClientRect(),A=t.styleModifications.some(Kt=>{try{return I.matches(Kt.selector)}catch(Be){return!1}}),D=w.filter(Kt=>Kt.id!==S.id&&Kt.timestamp<S.timestamp&&Kt.linkedSelector===S.linkedSelector).length,_=(A?1:0)+D,$=Y.top>=oo*(1+_)?"top-left":"bottom-left",lt=ol(Y,$,_),vt=S.points[0],ne=$!==S.linkedAnchor;vt&&(ne||Math.abs(lt.x-vt.x)>1||Math.abs(lt.y-vt.y)>1)&&N.push({id:S.id,point:lt,linkedAnchor:ne?$:void 0})}N.length>0&&e({type:"UPDATE_LINKED_POSITIONS",payload:{updates:N}})},L=()=>{k&&cancelAnimationFrame(k),k=requestAnimationFrame(K)};K(),window.addEventListener("scroll",L,!0),window.addEventListener("resize",L,!0),window.addEventListener("load",L),document.fonts.ready.then(L);let O=new MutationObserver(L);return O.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",L,!0),window.removeEventListener("resize",L,!0),window.removeEventListener("load",L),O.disconnect(),k&&cancelAnimationFrame(k)}},[t.annotations,e]);let Rl=()=>{var w,k,K;if(!t.isAnnotating)return"default";if(Tt){let{handle:L}=Tt;return L==="start"||L==="end"?"move":L==="top"||L==="bottom"?"ns-resize":L==="left"||L==="right"?"ew-resize":L==="topLeft"||L==="bottomRight"?"nwse-resize":"nesw-resize"}if(t.activeTool==="text")return"text";if(t.activeTool==="hand"){let L=(w=$t==null?void 0:$t.axis)!=null?w:re;if(L==="row")return"ns-resize";if(L==="column")return"ew-resize";if(he||Wt)return"ns-resize";let O=(k=ie==null?void 0:ie.property)!=null?k:ln;if(O==="font-size")return"ew-resize";if(O==="line-height")return"ns-resize";let N=(K=bt==null?void 0:bt.side)!=null?K:E;return N==="top"||N==="bottom"?"ns-resize":N==="left"||N==="right"?"ew-resize":"default"}return"crosshair"},Al={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:t.isAnnotating?"auto":"none",visibility:t.isAnnotating?"visible":"hidden",cursor:Rl()},zo=We(()=>{let w=y.current;if(!w||!R)return{width:100,height:12*1.4,isWrapped:!1};let k=w.getContext("2d");if(!k)return{width:100,height:R.fontSize*1.4,isWrapped:!1};k.font=`${R.fontSize}px ${Ee}`;let L=k.measureText("Type here...").width,O=R.text.split(`
|
|
10
|
-
`),N=O.length>0?Math.max(
|
|
11
|
-
`).length)*R.fontSize*1.4+8:0,ms=zo.height+8,Bl=zo.isWrapped?ms-Pl:0,Ol=R?{position:"fixed",left:R.point.x-4-Bt.x,top:R.point.y-4-Bt.y-Bl,zIndex:9999,width:zo.width+8,height:ms,padding:4,fontSize:R.fontSize,fontFamily:Ee,color:"#ffffff",backgroundColor:t.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:zo.isWrapped?"pre-wrap":"pre",wordBreak:zo.isWrapped?"break-word":void 0}:{};return Po(Bo,{children:[le("canvas",{ref:y,id:"devtools-canvas",style:Al,onMouseDown:fs,onMouseMove:gs,onMouseUp:w=>Or(w),onMouseLeave:w=>Or(w),onTouchStart:fs,onTouchMove:gs,onTouchEnd:w=>Or(w),onContextMenu:Ll}),R&&Po(Bo,{children:[le("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),le("textarea",{id:"devtools-text-input",ref:at,value:R.text,onChange:Tl,onKeyDown:Il,onPaste:Ml,onBlur:go,placeholder:"Type here...",style:Ol}),R.images&&R.images.length>0&&Po("div",{"data-devtools":!0,style:{position:"fixed",left:R.point.x-4-Bt.x,top:R.point.y-4-Bt.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:[R.images.length," image",R.images.length>1?"s":""," attached"]})]}),t.isAnnotating&&t.activeTool!=="hand"&&t.styleModifications.length>0&&le(Oa,{styleModifications:t.styleModifications,isInspecting:!!t.inspectedElement,accentColor:t.activeColor,annotationGroupCount:new Set(t.annotations.map(w=>w.groupId||w.id)).size,dispatch:e,inFlightSelectors:r}),t.activeTool==="hand"&&t.isAnnotating&&t.styleModifications.length>0&&le(Na,{styleModifications:t.styleModifications,accentColor:t.activeColor}),t.isAnnotating&&le(ka,{annotations:t.annotations,supersededAnnotations:Me,inFlightIds:n,scrollX:Bt.x,scrollY:Bt.y,annotationGroupMap:kn,onViewThread:l,onSelectAnnotation:wt}),t.isAnnotating&&((d==null?void 0:d.status)==="awaiting_approval"||(d==null?void 0:d.status)==="planning")&&d.threadId&&l&&le(Ea,{annotations:t.annotations,supersededAnnotations:Me,scrollX:Bt.x,scrollY:Bt.y,annotationGroupMap:kn,planThreadId:d.threadId,taskCount:(bs=(ys=d.tasks)==null?void 0:ys.length)!=null?bs:0,planStatus:d.status,onViewThread:l,onSelectAnnotation:wt}),t.isAnnotating&&a&&le(Ca,{annotations:t.annotations,supersededAnnotations:Me,scrollX:Bt.x,scrollY:Bt.y,onReply:a,annotationGroupMap:kn}),t.isAnnotating&&i&&i.size>0&&le(pi,{inFlightSelectorColors:i}),t.isAnnotating&&cs&&le(pi,{inFlightSelectorColors:cs,animated:!1}),t.activeTool==="hand"&&t.isAnnotating&&($t?be.current.element:ae)&&le(yi,{element:$t?be.current.element:ae,gap:$t?{row:$t.row,column:$t.column}:jo(ae),accentColor:t.activeColor,hoveredAxis:re,draggingAxis:(xs=$t==null?void 0:$t.axis)!=null?xs:null,cursorViewport:Xt,isAutoGap:Ie,refreshKey:qe}),t.activeTool==="hand"&&t.isAnnotating&&sn&&le(tl,{element:sn.target,modifier:sn.modifier,accentColor:t.activeColor,refreshKey:qe}),t.activeTool==="hand"&&t.isAnnotating&&!sn&&(he?He.current.element:j)&&le(Ra,{element:he?He.current.element:j,radius:(vs=he==null?void 0:he.radius)!=null?vs:to(j),accentColor:t.activeColor,hoveredCorner:Wt,draggingCorner:(Ss=he==null?void 0:he.corner)!=null?Ss:null,cursorViewport:Xt}),t.activeTool==="hand"&&t.isAnnotating&&!sn&&(ie?ge.current.element:xe)&&le(el,{element:ie?ge.current.element:xe,fontSize:(ws=ie==null?void 0:ie.fontSize)!=null?ws:Go(xe).fontSize,lineHeight:(ks=ie==null?void 0:ie.lineHeight)!=null?ks:Go(xe).lineHeight,accentColor:t.activeColor,hoveredProperty:ln,draggingProperty:(Es=ie==null?void 0:ie.property)!=null?Es:null,cursorViewport:Xt}),t.activeTool==="hand"&&t.isAnnotating&&!sn&&(bt?Z.current.element:Lt)&&le(ki,{element:bt?Z.current.element:Lt,padding:(Cs=bt==null?void 0:bt.padding)!=null?Cs:ko(Lt),accentColor:t.activeColor,hoveredSide:E,draggingSide:(Ts=bt==null?void 0:bt.side)!=null?Ts:null,cursorViewport:Xt,refreshKey:ie?ie.fontSize+ie.lineHeight*1e3:0}),t.activeTool==="inspector"&&t.isAnnotating&&le(Bo,{children:mt&&!t.inspectedElement&&(()=>{let w=!!tt||!!(R!=null&&R.linkedSelector)||t.annotations.some(k=>{if(!k.linkedSelector)return!1;try{return mt.matches(k.linkedSelector)}catch(K){return!1}});return le(To,{element:mt,isSelected:!1,elementInfo:Q,color:t.activeColor,hideTooltip:w})})()}),t.activeTool==="model"&&t.isAnnotating&&St.size>0&&[...St.entries()].map(([w,k])=>le(To,{element:k.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:k.rootElement.tagName.toLowerCase(),reactComponent:w},color:"#8b5cf6"},w)),t.activeTool==="model"&&t.isAnnotating&&ce&&le(To,{element:ce.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:ce.rootElement.tagName.toLowerCase(),reactComponent:ce.name},color:"#22c55e"}),t.activeTool==="model"&&t.isAnnotating&&Ue.length>0&&Ue.map((w,k)=>le("div",{style:{position:"absolute",left:w.x,top:w.y,width:w.width,height:w.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:w.direction==="vertical"?Po(Bo,{children:[le("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),le("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),le("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),le("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:w.height<16?-6:"50%",transform:w.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(w.height)})]}):Po(Bo,{children:[le("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),le("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),le("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),le("div",{style:{position:"absolute",left:w.width<30?0:"50%",top:(w.width<30,void 0),bottom:"calc(50% + 4px)",transform:w.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(w.width)})]})},k)),t.activeTool==="model"&&t.isAnnotating&&G&&le(To,{element:G.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:G.rootElement.tagName.toLowerCase(),reactComponent:G.name},color:f!=null&&f.has(G.name)?"#22c55e":"#8b5cf6"}),t.activeTool==="hand"&&t.isAnnotating&&t.inspectedElement&&Po(Bo,{children:[it&&it!=="padding"&&it!=="gap"&&(()=>{var F;let w=new Set(t.annotations.map(W=>W.groupId||W.id)).size,k=t.inspectedElement.info.selector,K=t.styleModifications.findIndex(W=>W.selector===k),L=K>=0?w+K+1:w+t.styleModifications.length+1,O=t.styleModifications.find(W=>W.selector===k),N=(F=O==null?void 0:O.changes.length)!=null?F:0,st=!!(O!=null&&O.captured);return le(To,{element:t.inspectedElement.el,isSelected:!0,elementInfo:t.inspectedElement.info,color:st?"#999999":t.activeColor,annotationNumber:L,changeCount:N})})(),it==="padding"&&le(ki,{element:t.inspectedElement.el,padding:ko(t.inspectedElement.el),accentColor:t.activeColor,hoveredSide:null,draggingSide:null}),it==="gap"&&le(yi,{element:t.inspectedElement.el,gap:jo(t.inspectedElement.el),accentColor:t.activeColor,hoveredAxis:null,draggingAxis:null}),le(qa,{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:At,accentColor:t.activeColor})]})]})}import{useCallback as vn,useEffect as Ln,useMemo as Yi,useRef as De,useState as Zo}from"react";import{Circle as Xu,Component as Uu,Hand as Ku,MessageCircle as Zu,Pen as qu,Slash as Qu,Square as tp,Trash2 as ep,Type as np}from"lucide-react";import{useEffect as ku,useRef as Eu}from"react";function il(t,e,o,n,r){let i=Eu(0);ku(()=>{if(!o.current||(localStorage.setItem(r.expanded,String(t)),!t))return;let s=e.annotations.length;(s>=i.current||s===0||!n)&&(localStorage.setItem(r.annotations,JSON.stringify(e.annotations)),i.current=s),localStorage.setItem(r.styleMods,JSON.stringify(e.styleModifications)),localStorage.setItem(r.spacingChanges,JSON.stringify(e.spacingTokenChanges)),localStorage.setItem(r.tool,e.activeTool),localStorage.setItem(r.color,e.activeColor),localStorage.setItem(r.stroke,String(e.strokeWidth)),e.inspectedElement?localStorage.setItem(r.inspected,JSON.stringify({selector:e.inspectedElement.info.selector,info:e.inspectedElement.info})):localStorage.removeItem(r.inspected)},[t,e.annotations,e.styleModifications,e.spacingTokenChanges,e.activeTool,e.activeColor,e.strokeWidth,e.inspectedElement,n,o,r])}import{Component as Cu,createElement as Tu,useCallback as Rr,useEffect as Do,useRef as Oo,useState as Mn}from"react";import{Fragment as No,jsx as jt,jsxs as nn}from"react/jsx-runtime";var sl="popmelt-library-tab",Iu=/^#[0-9a-fA-F]{3,8}$/,Mu=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,Lu=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),Ru=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function al(t){let e=t.trim();return Iu.test(e)||Mu.test(e)||Lu.has(e.toLowerCase())}function Au(t){return Ru.test(t.trim())}function Pu(t){let e=t.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return e?parseFloat(e[1]):null}function zi(t,e=""){if(t==null)return[];if(typeof t!="object")return[[e,String(t)]];if(Array.isArray(t))return[[e,t.map(String).join(", ")]];let o=[];for(let[n,r]of Object.entries(t)){let i=e?`${e}.${n}`:n;if(r!==null&&typeof r=="object"&&!Array.isArray(r)){let s=r;typeof s.value=="string"?o.push([i,s.value]):o.push(...zi(r,i))}else o.push([i,Array.isArray(r)?r.map(String).join(", "):String(r!=null?r:"")])}return o}function Bu(t){return t.length===0?"generic":t.filter(([,n])=>al(n)).length>t.length/2?"colors":t.filter(([,n])=>Au(n)).length>t.length/2?"spacing":"generic"}var Ou=b(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"}),ll={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},Du=b(m({},ll),{color:"#1f2937",borderBottom:"1.5px solid #1f2937"});function Nu({entries:t}){let e=[],o=[];for(let n of t)al(n[1])?e.push(n):o.push(n);return nn(No,{children:[e.length>0&&jt("div",{style:{display:"flex",flexWrap:"wrap",gap:2,marginBottom:o.length>0?6:0},children:e.map(([n,r])=>jt("div",{title:`${n.split(".").pop()}: ${r}`,style:{width:28,height:28,backgroundColor:r,outline:"1px solid rgba(0,0,0,0.08)",outlineOffset:-1}},n))}),o.length>0&&jt($i,{entries:o})]})}var Lr=[0,1,2,4,8,12,16,20,24,28,32];function Fu(t){if(t<=32){let e=Lr[0],o=Math.abs(t-e);for(let n=1;n<Lr.length;n++){let r=Math.abs(t-Lr[n]);r<o&&(e=Lr[n],o=r)}return e}return Math.round(t/8)*8}function Hu({label:t,value:e,px:o,tokenPath:n,rawToken:r,onHover:i,onModify:s,onDelete:a}){let[l,c]=Mn(!1),[d,p]=Mn(null),u=Oo(!1),g=Oo(0),f=Oo(0),h=Oo([]),x=d!==null?d:o,y=d!==null?`${d}px`:e,P=d!==null,C=Rr(T=>{T.preventDefault(),u.current=!0,g.current=T.clientX,f.current=o;let z=ur(r);h.current=jr(z);let R=q=>{let et=q.clientX-g.current,B=Math.max(0,Math.round(f.current+et));q.shiftKey&&(B=Fu(B));for(let U of h.current)U.element.style.setProperty(U.property,B+"px","important");p(B),i==null||i({name:t,px:B,token:z})},H=()=>{window.removeEventListener("mousemove",R),window.removeEventListener("mouseup",H),document.body.style.cursor="",u.current=!1,p(q=>{if(q!==null&&q!==o&&s){let et=ur(r),B=et.bindings&&et.bindings.length>0,U;if(B){let Nt=Jr(et.bindings,f.current,q);U=JSON.stringify(b(m({},et),{value:`${q}px`,bindings:Nt}))}else{let Nt=oa(h.current,f.current),Et=ra(h.current);if(Nt.length>0){let Dt=Jr(Nt,f.current,q);U=JSON.stringify({value:`${q}px`,property:Et,bindings:Dt})}else U=`${q}px`}let tt=typeof r=="string"?r:JSON.stringify(r),kt=h.current.map(Nt=>({selector:hn(Nt.element),property:Nt.property})),at=sa(h.current,f.current,q);s({tokenPath:n,originalValue:tt,currentValue:U,targets:kt,originalPx:f.current,currentPx:q},{id:Math.random().toString(36).substring(2,9),tokenPath:n,tokenName:t,originalPx:f.current,newPx:q,affectedElements:at})}return q})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",R),window.addEventListener("mouseup",H)},[o,t,n,r,i,s]),M=ur(r);return nn("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",fontSize:11,padding:"1px 0",cursor:"ew-resize",userSelect:"none"},onMouseEnter:()=>{u.current||(c(!0),i==null||i({name:t,px:x,token:M}))},onMouseLeave:()=>{u.current||(c(!1),i==null||i(null))},onMouseDown:C,children:[jt("span",{style:{color:l||P?"#FF0000":"#9ca3af"},children:t}),nn("span",{style:{display:"flex",alignItems:"center",gap:4},children:[jt("span",{style:{color:l||P?"#FF0000":"#6b7280",fontWeight:600},children:y}),a&&l&&!P&&jt("button",{type:"button",title:"Remove token",onMouseDown:T=>{T.stopPropagation();let z=typeof r=="string"?r:JSON.stringify(r);a(n,z)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:T=>{T.currentTarget.style.color="#FF0000"},onMouseLeave:T=>{T.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function _u({entries:t,categoryKey:e,rawTokens:o,onHover:n,onModify:r,onDelete:i}){let s=[],a=[];for(let l of t){let c=Pu(l[1]);c!==null?s.push([l[0],l[1],c]):a.push(l)}return nn(No,{children:[s.length>0&&jt("div",{style:{display:"flex",flexDirection:"column",gap:2},children:s.map(([l,c,d])=>{let p=l.split(".").pop(),u=o?zu(o,l):c,g=u&&typeof u=="object"&&"value"in u?u:c;return jt(Hu,{label:p,value:c,px:d,tokenPath:`tokens.${e}.${l}`,rawToken:g,onHover:n,onModify:r,onDelete:i},l)})}),a.length>0&&jt($i,{entries:a})]})}function zu(t,e){let o=e.split("."),n=t;for(let r of o){if(n==null||typeof n!="object")return;n=n[r]}return n}function $i({entries:t}){return jt("div",{style:{display:"flex",flexDirection:"column",gap:3},children:t.map(([e,o])=>nn("div",{style:{fontSize:11},children:[jt("div",{style:{color:"#9ca3af",fontSize:10,marginBottom:1},children:e}),jt("div",{style:{color:"#1f2937",lineHeight:1.4,paddingLeft:8},children:o})]},e))})}function cl({entries:t,categoryKey:e,rawTokens:o,onSpacingHover:n,onModifyToken:r,onDeleteToken:i}){let s=Bu(t);return s==="colors"?jt(Nu,{entries:t}):s==="spacing"?jt(_u,{entries:t,categoryKey:e,rawTokens:o,onHover:n,onModify:r,onDelete:i}):jt($i,{entries:t})}function $u(t){let e=t.toLowerCase(),o=null,n=document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT,{acceptNode(i){return i.closest("#devtools-toolbar, #devtools-canvas, #devtools-scrim, [data-popmelt-panel]")?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}}),r=n.currentNode;for(;r=n.nextNode();){let i=r,s=Object.keys(i).find(l=>l.startsWith("__reactFiber$")||l.startsWith("__reactInternalInstance$"));if(!s)continue;let a=i[s];for(;a;){let l=a.type,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 p=m({},a.memoizedProps);return delete p.ref,{type:l,props:p}}if(!o){if(d.length>=4&&e.includes(d)){let p=m({},a.memoizedProps);delete p.ref,o={type:l,props:p}}else if(e.length>=4&&d.includes(e)){let p=m({},a.memoizedProps);delete p.ref,o={type:l,props:p}}}}a=a.return}}return o}var _i=class extends Cu{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 Wu({children:t}){return jt("div",{style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:6},children:t})}function Yu({tokens:t,onSpacingTokenHover:e,onModifyToken:o,onDeleteToken:n}){return!t||Object.keys(t).length===0?jt("div",{style:{color:"#9ca3af",fontSize:11},children:"No tokens defined yet."}):jt(No,{children:Object.entries(t).map(([r,i])=>nn("div",{style:{marginBottom:14},children:[jt(Wu,{children:r}),jt(cl,{entries:zi(i),categoryKey:r,rawTokens:i,onSpacingHover:e,onModifyToken:o,onDeleteToken:n})]},r))})}function ju({rules:t}){return!t||t.length===0?jt("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."}):jt(No,{children:t.map((e,o)=>nn("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[nn("span",{style:{color:"#9ca3af",flexShrink:0},children:[o+1,"."]}),jt("span",{children:e})]},o))})}function Gu({name:t,value:e,selected:o,highlighted:n,onRemove:r,onHover:i}){var q;let[s,a]=Mn(!1),[l,c]=Mn(!1),d=Oo(null),p=Oo(0),[u,g]=Mn(0),[f,h]=Mn(0),x=zi(e),y=(q=x.find(([et])=>et==="description"))==null?void 0:q[1];Do(()=>{if(!l&&!n){g(0),h(0),p.current=0;return}let et=So(t);g(et.length)},[l,n,t]),Do(()=>{o&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[o]);let P=o||n||l,C=o?"139,92,246":"34,197,94",M=o?"#8b5cf6":"#22c55e",T=P?`rgba(${C},0.06)`:void 0,z=P?`inset 0 0 0 1.5px rgba(${C},0.35)`:void 0,R=n||l,H=Rr(()=>{let et=So(t);if(et.length===0)return;let B=p.current%et.length;et[B].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),h(B),p.current=B+1,i==null||i({name:t,instanceIndex:B})},[t,i]);return nn("div",{ref:d,onClick:H,onMouseEnter:()=>{c(!0),i==null||i({name:t,instanceIndex:0})},onMouseLeave:()=>{c(!1),i==null||i(null)},style:{marginBottom:8,background:T,padding:6,boxShadow:z,cursor:"pointer"},children:[nn("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[nn("div",{style:{display:"flex",alignItems:"center",gap:6,marginBottom:6},children:[jt("div",{style:{fontWeight:700,fontSize:11,letterSpacing:"0.05em",padding:"2px 6px",backgroundColor:R?M:"transparent",color:R?"#fff":"#6b7280"},children:t}),R&&u>1&&nn("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[f+1,"/",u]})]}),r&&l&&jt("button",{type:"button",title:"Remove from model",onClick:et=>{et.stopPropagation(),r(t)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:et=>{et.currentTarget.style.color="#FF0000"},onMouseLeave:et=>{et.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),y&&jt("div",{style:{fontSize:11,color:R?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:y}),s?jt(cl,{entries:x.filter(([et])=>et!=="description"),categoryKey:""}):jt(Ju,{name:t,onNotFound:()=>a(!0),entries:x})]})}function Ju({name:t,onNotFound:e}){let[o,n]=Mn(null),[r,i]=Mn(!1);return Do(()=>{let s=$u(t);s||e(),n(s),i(!0)},[t,e]),!r||!o?null:jt(_i,{onError:e,children:jt("div",{"data-popmelt-panel":!0,onClick:s=>{s.preventDefault(),s.stopPropagation()},style:{width:"100%",overflowY:"auto",overflowX:"hidden",maxHeight:150,padding:"1rem",outline:"1px solid rgba(0,0,0,0.06)",backgroundColor:"rgb(250,250,250)",boxSizing:"border-box",marginBottom:4,display:"flex",flexDirection:"column",justifyContent:"stretch",alignItems:"center"},children:jt("div",{style:{zoom:.5},children:Tu(o.type,o.props)})})})}function Vu({components:t,selectedComponent:e,hoveredComponent:o,onRemove:n,onHover:r}){if(!t||Object.keys(t).length===0)return jt("div",{style:{color:"#9ca3af",fontSize:11},children:"No component patterns defined yet."});let i=new Set(Object.keys(t)),s=zr(i),a=Object.entries(t).sort(([l],[c])=>{var d,p;return((d=s.get(l))!=null?d:1/0)-((p=s.get(c))!=null?p:1/0)});return jt(No,{children:a.map(([l,c])=>jt(Gu,{name:l,value:c,selected:e===l,highlighted:o===l,onRemove:n,onHover:r},l))})}function dl({bridgeUrl:t,modelRefreshKey:e,onMouseEnter:o,onMouseLeave:n,selectedComponent:r,hoveredComponent:i,onComponentHover:s,onSpacingTokenHover:a,onModifySpacingToken:l,onDeleteSpacingToken:c,onComponentAdded:d,onComponentRemoved:p}){let[u,g]=Mn(void 0),[f,h]=Mn(!0),[x,y]=Mn(()=>{try{let B=localStorage.getItem(sl);if(B==="tokens"||B==="components"||B==="rules")return B}catch(B){}return"components"});Do(()=>{mo(t).then(B=>{g(B),h(!1)})},[t,e]),Do(()=>{try{localStorage.setItem(sl,x)}catch(B){}},[x]),Do(()=>{r&&(y("components"),mo(t).then(B=>{B&&g(B)}))},[r,t]);let P=Rr((B,U)=>{g(tt=>{if(!(tt!=null&&tt.tokens))return tt;let kt=JSON.parse(JSON.stringify(tt.tokens)),at=B.split("."),Nt=kt;for(let Et=1;Et<at.length-1;Et++)if(Nt=Nt[at[Et]],!Nt)return tt;return delete Nt[at[at.length-1]],b(m({},tt),{tokens:kt})}),c==null||c(B,U)},[c]),C=Rr(B=>{g(U=>{if(!(U!=null&&U.components))return U;let at=U.components,{[B]:tt}=at,kt=Wn(at,[sr(B)]);return b(m({},U),{components:kt})}),p==null||p(B)},[p]),M=u==null?void 0:u.tokens,T=u==null?void 0:u.components,z=u==null?void 0:u.rules,R=M&&Object.keys(M).length>0,H=T&&Object.keys(T).length>0,q=z&&z.length>0,et=!u||!R&&!H&&!q;return nn("div",{style:Ou,onMouseEnter:o,onMouseLeave:n,children:[nn("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[jt("span",{children:"Model"}),jt("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"M"})]}),jt("div",{style:{display:"flex",gap:12,marginBottom:10,borderBottom:"1px solid rgba(0,0,0,0.08)",paddingBottom:6},children:["components","rules"].map(B=>jt("button",{type:"button",style:x===B?Du:ll,onClick:()=>y(B),children:B.charAt(0).toUpperCase()+B.slice(1)},B))}),jt("div",{style:{flex:1,overflowY:"auto",minHeight:0},children:f?jt("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):et?jt("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):nn(No,{children:[x==="components"&&jt(Vu,{components:T,selectedComponent:r,hoveredComponent:i,onRemove:C,onHover:s}),x==="tokens"&&jt(Yu,{tokens:M,onSpacingTokenHover:a,onModifyToken:l,onDeleteToken:c?P:void 0}),x==="rules"&&jt(ju,{rules:z})]})})]})}import{jsx as ul}from"react/jsx-runtime";var _n={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#f3f4f6",bgHover:"#f9fafb",separator:"#e5e7eb"};function zn({children:t,active:e,siblingActive:o,disabled:n,onClick:r,title:i}){let s=()=>n?.4:o&&!e?.5:1,a={position:"relative",display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,borderRadius:0,border:"none",cursor:n?"default":"pointer",transition:"background-color 150ms ease, color 150ms ease, transform 100ms ease, opacity 150ms ease",backgroundColor:e?_n.bgActive:"transparent",color:e?_n.iconActive:_n.iconDefault,opacity:s()};return ul("button",{type:"button",onClick:n?void 0:r,title:i,disabled:n,style:a,onMouseEnter:l=>{n||(l.currentTarget.style.opacity="1",e||(l.currentTarget.style.backgroundColor=_n.bgHover))},onMouseLeave:l=>{n||(l.currentTarget.style.opacity=String(s()),e||(l.currentTarget.style.backgroundColor="transparent"))},onMouseDown:l=>{n||(l.currentTarget.style.transform="scale(0.95)")},onMouseUp:l=>{n||(l.currentTarget.style.transform="scale(1)")},children:t})}function Wi(){return ul("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as lo,jsx as rt,jsxs as we}from"react/jsx-runtime";var co=[{type:"rectangle",icon:tp,label:"Rectangle",shortcut:"R"},{type:"circle",icon:Xu,label:"Oval",shortcut:"O"},{type:"line",icon:Qu,label:"Line",shortcut:"L"},{type:"freehand",icon:qu,label:"Pen",shortcut:"P"}],op=new Set(co.map(t=>t.type));function rp(t,e,o,n,r,i,s,a){let l=(t-r)*(n-i)-(o-r)*(e-i),c=(t-s)*(i-a)-(r-s)*(e-a),d=(t-o)*(a-n)-(s-o)*(e-n),p=l<0||c<0||d<0,u=l>0||c>0||d>0;return!(p&&u)}function ip(){let t=window.innerWidth-16,e=t-326,o=window.innerHeight-80;return{left:e,right:t,y:o}}var sp=[{type:"text",icon:np,label:"Text",shortcut:"T"}],pl={inspector:{name:"Comment",desc:"Pin feedback to specific elements on the page.",usage:["Click any element to attach a comment","Type your note, then hand off to your AI","Your AI may ask clarifying questions","Replies get threaded"],keys:[{key:"C",desc:"Select tool"},{key:"Click",desc:"Pin comment to element"},{key:"Esc",desc:"Deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},hand:{name:"Handle",desc:"Quickly finetune layout and typescale.",usage:["Edges \u2192 padding","Between items \u2192 spacing","Corners \u2192 rounding","Right of text \u2192 font size","Below text \u2192 line height","Click a spacing handle to cycle distribution","Right-click \u2192 inspect element styles"],keys:[{key:"H",desc:"Select tool"},{key:"Shift",desc:"Snap to scale"},{key:"\u2325 + swipe",desc:"Cycle justify / flip direction"},{key:"\u21E7 + swipe",desc:"Cycle align-items"},{key:"Right-click",desc:"Inspect styles"},{key:"Esc",desc:"Deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},rectangle:{name:"Rectangle",desc:"Draw rectangular highlights to mark areas of interest.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"R",desc:"Rectangle"},{key:"O",desc:"Oval"},{key:"L",desc:"Line"},{key:"P",desc:"Pen"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},circle:{name:"Oval",desc:"Draw oval highlights to mark areas of interest.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"O",desc:"Oval"},{key:"R",desc:"Rectangle"},{key:"L",desc:"Line"},{key:"P",desc:"Pen"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},line:{name:"Line",desc:"Draw line annotations to point at or connect elements.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"L",desc:"Line"},{key:"R",desc:"Rectangle"},{key:"O",desc:"Oval"},{key:"P",desc:"Pen"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},freehand:{name:"Pen",desc:"Draw freehand paths to annotate freely.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"P",desc:"Pen"},{key:"R",desc:"Rectangle"},{key:"O",desc:"Oval"},{key:"L",desc:"Line"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},text:{name:"Text",desc:"Place text labels anywhere on the page.",usage:["Click to place, then start typing","Click away or press Enter to finish","Scroll while hovering a label to resize it"],keys:[{key:"T",desc:"Select tool"},{key:"Esc",desc:"Cancel text or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},model:{name:"Model",desc:"Promote components into the local design model.",usage:["Hover to highlight component boundaries","Scroll to walk up/down the component tree","Click to add to model.json","Green = already in model"],keys:[{key:"M",desc:"Select tool"},{key:"Scroll",desc:"Walk tree depth"},{key:"Click",desc:"Promote component"},{key:"Esc",desc:"Deselect"}]},counter:{name:"Annotations",desc:"Click to cycle, scroll to change color, long press to reset.",usage:[],keys:[{key:"Click",desc:"Cycle annotations"},{key:"Scroll",desc:"Change color"},{key:"Hold",desc:"Reset to red"}]},clear:{name:"Clear",desc:"Remove all annotations and style changes.",usage:[],keys:[{key:"\u2318 \u232B",desc:"Clear all"},{key:"\u232B",desc:"Delete selected annotation"},{key:"\u2318 Z",desc:"Undo"},{key:"\u2318 \u21E7 Z",desc:"Redo"}]},collapse:{name:"Popmelt",desc:`Comment and zhuzh, then hand off.
|
|
2
|
+
var Fl=Object.defineProperty,Hl=Object.defineProperties;var _l=Object.getOwnPropertyDescriptors;var ir=Object.getOwnPropertySymbols;var Ms=Object.prototype.hasOwnProperty,Ls=Object.prototype.propertyIsEnumerable;var Is=(t,e,o)=>e in t?Fl(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,h=(t,e)=>{for(var o in e||(e={}))Ms.call(e,o)&&Is(t,o,e[o]);if(ir)for(var o of ir(e))Ls.call(e,o)&&Is(t,o,e[o]);return t},b=(t,e)=>Hl(t,_l(e));var sr=t=>typeof t=="symbol"?t:t+"",Wn=(t,e)=>{var o={};for(var n in t)Ms.call(t,n)&&e.indexOf(n)<0&&(o[n]=t[n]);if(t!=null&&ir)for(var n of ir(t))e.indexOf(n)<0&&Ls.call(t,n)&&(o[n]=t[n]);return o};import{createContext as Yp,useCallback as Pe,useContext as jp,useEffect as Re,useMemo as _o,useRef as on,useState as Xe}from"react";import{useCallback as Fr,useEffect as zl,useSyncExternalStore as $l}from"react";var un="http://localhost:1111";function dn(t,e={},o=15e3){let n=new AbortController;e.signal&&e.signal.addEventListener("abort",()=>n.abort());let r=setTimeout(()=>n.abort(),o);return fetch(t,b(h({},e),{signal:n.signal})).finally(()=>clearTimeout(r))}async function As(t=un){try{let e=await dn(`${t}/capabilities`,{},5e3);return e.ok?await e.json():null}catch(e){return null}}async function ar(t=un){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 Rs(t){try{let e=new AbortController,o=setTimeout(()=>e.abort(),500),n=await fetch(`http://localhost:${t}/status`,{signal:e.signal});return clearTimeout(o),n.ok?await n.json():null}catch(e){return null}}async function Ps(t){if(t&&t!=="http://localhost:1111")try{let c=new URL(t);return{url:t,port:parseInt(c.port,10)||1111}}catch(c){return null}let r=typeof window!="undefined"?window.location.origin:null,i=await Rs(1111);if(i&&i.devOrigin&&r&&i.devOrigin===r)return{url:"http://localhost:1111",port:1111};let s=Array.from({length:8},(c,d)=>{let p=1112+d;return Rs(p).then(u=>u?{status:u,port:p}:null)}),a=(await Promise.all(s)).filter(c=>c!==null),l=[];i&&l.push({port:1111,devOrigin:i.devOrigin});for(let c of a)l.push({port:c.port,devOrigin:c.status.devOrigin});if(r){let c=l.find(d=>d.devOrigin===r);if(c)return{url:`http://localhost:${c.port}`,port:c.port}}return l.length===1?{url:`http://localhost:${l[0].port}`,port:l[0].port}:i?{url:"http://localhost:1111",port:1111}:l.length>0?{url:`http://localhost:${l[0].port}`,port:l[0].port}:null}async function Bs(t,e,o=un,n,r,i,s,a){let l=new FormData;if(l.append("screenshot",t,"screenshot.png"),l.append("feedback",e),n&&l.append("color",n),r&&l.append("provider",r),i&&l.append("model",i),a&&l.append("sourceId",a),s)for(let[d,p]of s)for(let u=0;u<p.length;u++)l.append(`image-${d}-${u}`,p[u],`image-${d}-${u}.png`);let c=await dn(`${o}/send`,{method:"POST",body:l},3e4);if(!c.ok){let d=await c.text();throw new Error(`Bridge returned ${c.status}: ${d}`)}return c.json()}async function Os(t,e,o=un,n,r,i,s,a,l,c){let d=new FormData;d.append("screenshot",t,"screenshot.png"),d.append("goal",e),i&&d.append("pageUrl",i),s&&d.append("viewport",JSON.stringify(s)),n&&d.append("provider",n),r&&d.append("model",r),a&&d.append("manifest",JSON.stringify(a)),l&&d.append("feedback",l),c&&d.append("sourceId",c);let p=await dn(`${o}/plan`,{method:"POST",body:d},3e4);if(!p.ok){let u=await p.text();throw new Error(`Bridge returned ${p.status}: ${u}`)}return p.json()}async function Ds(t,e=un,o){let n=await dn(`${e}/plan/approve`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({planId:t,approvedTaskIds:o})},1e4);if(!n.ok){let r=await n.text();throw new Error(`Bridge returned ${n.status}: ${r}`)}return n.json()}async function Ns(t,e,o=un,n,r,i){let s=new FormData;s.append("screenshot",e,"screenshot.png"),s.append("planId",t),n&&s.append("provider",n),r&&s.append("model",r),i&&s.append("sourceId",i);let a=await dn(`${o}/plan/review`,{method:"POST",body:s},3e4);if(!a.ok){let l=await a.text();throw new Error(`Bridge returned ${a.status}: ${l}`)}return a.json()}async function Fs(t,e,o,n=un,r,i,s){let a=new FormData;a.append("screenshot",t,"screenshot.png"),a.append("planId",e),a.append("tasks",JSON.stringify(o)),r&&a.append("provider",r),i&&a.append("model",i),s&&a.append("sourceId",s);let l=await dn(`${n}/plan/execute`,{method:"POST",body:a},3e4);if(!l.ok){let c=await l.text();throw new Error(`Bridge returned ${l.status}: ${c}`)}return l.json()}async function Hs(t=un,e){try{let o=await dn(`${t}/mcp/install`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e?{serverUrl:e}:{})},15e3);return o.ok?await o.json():null}catch(o){return null}}async function _s(t,e=un){let o=await dn(`${e}/model/component`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:t})},1e4);if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function zs(t,e=un){let o=await dn(`${e}/model/component`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:t})},1e4);if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function Nr(t,e,o=un){let n=await dn(`${o}/model/token`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:t,value:e})},1e4);if(!n.ok){let r=await n.text();throw new Error(`Bridge returned ${n.status}: ${r}`)}return n.json()}async function $s(t,e=un){let o=await dn(`${e}/model/token`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:t})},1e4);if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function mo(t=un){var e;try{let o=await dn(`${t}/model`,{},5e3);return o.ok&&(e=(await o.json()).model)!=null?e:null}catch(o){return null}}async function Ws(t,e,o=un,n,r,i,s,a){let l;if(s&&s.length>0){let c=new FormData,d=new Blob([new Uint8Array([137,80,78,71,13,10,26,10,0,0,0,13,73,72,68,82,0,0,0,1,0,0,0,1,8,6,0,0,0,31,21,196,137,0,0,0,10,73,68,65,84,120,156,98,0,0,0,2,0,1,229,39,222,252,0,0,0,0,73,69,78,68,174,66,96,130])],{type:"image/png"});c.append("screenshot",d,"screenshot.png"),c.append("feedback",JSON.stringify({threadId:t,reply:e,color:n,provider:r,model:i,sourceId:a}));for(let p=0;p<s.length;p++)c.append(`image-reply-${p}`,s[p],`reply-image-${p}.png`);l=await dn(`${o}/reply`,{method:"POST",body:c},3e4)}else l=await dn(`${o}/reply`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({threadId:t,reply:e,color:n,provider:r,model:i,sourceId:a})},3e4);if(!l.ok){let c=await l.text();throw new Error(`Bridge returned ${l.status}: ${c}`)}return l.json()}var Js=typeof crypto!="undefined"&&typeof crypto.randomUUID=="function"?crypto.randomUUID():Math.random().toString(36).slice(2);function xo(){return Js}var Wl={isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,lastErrorByJob:{},pendingQuestions:[],pendingPlans:[],planReviews:[],incrementalResolutions:[]},lr=h({},Wl),Hr=new Set,ho=null,Ys=null,Zn=null,js=0,bo=null,yo=null;async function Yl(t){return t&&t!=="http://localhost:1111"?(bo=t,t):bo||yo||(yo=Ps(t).then(o=>{var n;return bo=(n=o==null?void 0:o.url)!=null?n:null,yo=null,bo}).catch(()=>(yo=null,null)),yo)}function Vs(){return bo}function Gs(){return lr}function jl(t){return Hr.add(t),()=>{Hr.delete(t)}}function Je(t){lr=t(lr);for(let e of Hr)e()}function Xs(t){if(ho&&ho.readyState!==EventSource.CLOSED&&Ys===t)return;ho&&(ho.close(),ho=null),Zn&&(clearTimeout(Zn),Zn=null),Ys=t;let e=++js,o=new EventSource(`${t}/events?sourceId=${Js}`);ho=o;let n=()=>e!==js;o.addEventListener("connected",()=>{n()||ar(t).then(r=>{var d,p;if(n())return;let i=(d=r==null?void 0:r.activeJobs)!=null?d:r!=null&&r.activeJob?[r.activeJob]:[],s=new Set(i.map(u=>u.id)),a=(p=r==null?void 0:r.recentJobs)!=null?p:[],l=new Map(a.map(u=>[u.id,u])),c=i.length>0;Je(u=>{let g=h({},u.lastErrorByJob),f=u.activeJobIds.filter(x=>!s.has(x));for(let x of f){let y=l.get(x);(y==null?void 0:y.status)==="error"&&y.error&&(g[x]=y.error)}let m=u.activeJobIds.filter(x=>s.has(x));for(let x of s)m.includes(x)||m.push(x);return b(h({},u),{isConnected:!0,status:c?"streaming":f.length>0||u.status==="disconnected"?"idle":u.status,activeJobId:c?i[i.length-1].id:m.length>0?m[m.length-1]:null,activeJobIds:m,lastErrorByJob:g,lastCompletedJobId:f.length>0?f[f.length-1]:u.lastCompletedJobId})})})}),o.addEventListener("job_started",r=>{if(n())return;let i=JSON.parse(r.data),s=i.jobId;Je(a=>b(h({},a),{status:"streaming",activeJobId:s,activeJobIds:[...a.activeJobIds,s],jobResponses:b(h({},a.jobResponses),{[s]:""}),jobThinking:b(h({},a.jobThinking),{[s]:""}),currentResponse:"",currentThinking:"",lastResponseText:null,lastThreadId:null,events:[...a.events,{type:"job_started",data:i,timestamp:Date.now()}]}))}),o.addEventListener("delta",r=>{if(n())return;let i=JSON.parse(r.data),s=i.jobId,a=i.text||"";Je(l=>b(h({},l),{jobResponses:s?b(h({},l.jobResponses),{[s]:(l.jobResponses[s]||"")+a}):l.jobResponses,currentResponse:!s||s===l.activeJobId?l.currentResponse+a:l.currentResponse,events:[...l.events,{type:"delta",data:i,timestamp:Date.now()}]}))}),o.addEventListener("thinking",r=>{if(n())return;let i=JSON.parse(r.data),s=i.jobId,a=i.text||"";Je(l=>b(h({},l),{jobThinking:s?b(h({},l.jobThinking),{[s]:(l.jobThinking[s]||"")+a}):l.jobThinking,currentThinking:!s||s===l.activeJobId?l.currentThinking+a:l.currentThinking,events:[...l.events,{type:"thinking",data:i,timestamp:Date.now()}]}))}),o.addEventListener("tool_use",r=>{if(n())return;let i=JSON.parse(r.data);Je(s=>b(h({},s),{events:[...s.events,{type:"tool_use",data:i,timestamp:Date.now()}]}))}),o.addEventListener("done",r=>{if(n())return;let i=JSON.parse(r.data),s=i.jobId;Je(a=>{var g;let l=s?a.activeJobIds.filter(f=>f!==s):a.activeJobIds,c=h({},a.jobResponses),d=h({},a.jobThinking),p=s?c[s]:void 0;s&&(delete c[s],delete d[s]);let u=s===a.activeJobId?l.length>0?l[l.length-1]:null:a.activeJobId;return b(h(b(h({},a),{activeJobIds:l,activeJobId:u,jobResponses:c,jobThinking:d,lastCompletedJobId:s!=null?s:a.activeJobId,lastResponseText:p||a.currentResponse||i.responseText||null,lastThreadId:(g=i.threadId)!=null?g:null}),s===a.activeJobId?{currentResponse:u&&c[u]||"",currentThinking:u&&d[u]||""}:{}),{events:[...a.events,{type:"done",data:i,timestamp:Date.now()}]})})}),o.addEventListener("question",r=>{if(n())return;let i=JSON.parse(r.data);Je(s=>b(h({},s),{pendingQuestions:[...s.pendingQuestions,{jobId:i.jobId,threadId:i.threadId,question:i.question,annotationIds:i.annotationIds,timestamp:Date.now()}],events:[...s.events,{type:"question",data:i,timestamp:Date.now()}]}))}),o.addEventListener("plan_ready",r=>{if(n())return;let i=JSON.parse(r.data);Je(s=>b(h({},s),{pendingPlans:[...s.pendingPlans,{jobId:i.jobId,planId:i.planId,tasks:i.tasks,threadId:i.threadId,timestamp:Date.now()}],events:[...s.events,{type:"plan_ready",data:i,timestamp:Date.now()}]}))}),o.addEventListener("plan_review",r=>{if(n())return;let i=JSON.parse(r.data);Je(s=>b(h({},s),{planReviews:[...s.planReviews,{planId:i.planId,verdict:i.verdict,summary:i.summary,issues:i.issues,timestamp:Date.now()}],events:[...s.events,{type:"plan_review",data:i,timestamp:Date.now()}]}))}),o.addEventListener("task_resolved",r=>{var a;if(n())return;let i=JSON.parse(r.data),s=(a=i.resolutions)!=null?a:[];Je(l=>b(h({},l),{incrementalResolutions:[...l.incrementalResolutions,...s],events:[...l.events,{type:"task_resolved",data:i,timestamp:Date.now()}]}))}),o.addEventListener("queue_drained",()=>{n()||Je(r=>b(h({},r),{status:r.status==="error"?"error":"idle",activeJobId:null,activeJobIds:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastErrorByJob:{},incrementalResolutions:[]}))}),o.addEventListener("error",r=>{var i,s;if(!n()){if(o.readyState===EventSource.CLOSED)Je(a=>b(h({},a),{isConnected:!1,status:"disconnected"})),Zn&&(clearTimeout(Zn),Zn=null),Zn=setTimeout(()=>{ar(t).then(a=>{a&&Xs(t)})},5e3);else if(r instanceof MessageEvent){let a=JSON.parse(r.data),l=(i=a.jobId)!=null?i:null,c=(s=a.message)!=null?s:"";Je(d=>{let p=l?d.activeJobIds.filter(g=>g!==l):d.activeJobIds,u=p.length>0?d.status:"error";return b(h({},d),{status:u,activeJobIds:p,lastCompletedJobId:l!=null?l:d.activeJobId,lastErrorByJob:l&&c?b(h({},d.lastErrorByJob),{[l]:c}):d.lastErrorByJob,events:[...d.events,{type:"error",data:a,timestamp:Date.now()}]})})}}}),o.onerror=()=>{n()||o.readyState===EventSource.CLOSED&&Je(r=>b(h({},r),{isConnected:!1,status:"disconnected"}))}}function Us(t="http://localhost:1111"){let e=$l(jl,Gs,Gs);zl(()=>{Yl(t).then(i=>{i&&ar(i).then(s=>{s&&Xs(i)})})},[t]);let o=Fr(()=>{Je(()=>b(h({},lr),{events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,lastErrorByJob:{},incrementalResolutions:[]}))},[]),n=Fr(i=>{Je(s=>b(h({},s),{pendingQuestions:s.pendingQuestions.filter(a=>a.threadId!==i)}))},[]),r=Fr(i=>{Je(s=>b(h({},s),{pendingPlans:s.pendingPlans.filter(a=>a.planId!==i)}))},[]);return b(h({},e),{clearEvents:o,dismissQuestion:n,dismissPlan:r})}import{useEffect as Gl,useReducer as Jl}from"react";var Vl={isAnnotating:!1,activeTool:"inspector",activeColor:"#ff0000",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function vo(){return Math.random().toString(36).substring(2,9)}function Ks(t){return t.status?t:t.captured?b(h({},t),{status:"in_flight"}):b(h({},t),{status:"pending"})}function en(t){return b(h({},t),{undoStack:[...t.undoStack,{annotations:t.annotations,styleModifications:t.styleModifications,spacingTokenMods:t.spacingTokenMods}],redoStack:[]})}function Xl(t,e){return b(h({},t),{isAnnotating:e})}function Ul(t,e){return b(h({},t),{activeTool:e,inspectedElement:null})}function Kl(t,e){return b(h({},t),{activeColor:e})}function Zl(t,e){return b(h({},t),{strokeWidth:e})}function ql(t,e){return b(h({},t),{currentPath:[e]})}function Ql(t,e){return b(h({},t),{currentPath:[...t.currentPath,e]})}function tc(t){return b(h({},t),{currentPath:[]})}function ec(t,e){if(t.currentPath.length<2&&t.activeTool!=="text")return b(h({},t),{currentPath:[]});let o={id:vo(),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=en(t);return b(h({},n),{annotations:[...t.annotations,o],currentPath:[]})}function nc(t,e){var r;let o=h({id:(r=e.id)!=null?r:vo(),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:en(t);return b(h({},n),{annotations:[...t.annotations,o]})}function oc(t,e){let o=en(t);return b(h({},o),{annotations:t.annotations.map(n=>n.id===e.id?h(b(h({},n),{text:e.text}),e.imageCount!=null?{imageCount:e.imageCount}:{}):n)})}function rc(t,e){return b(h({},t),{annotations:t.annotations.map(o=>o.id===e.id?b(h({},o),{fontSize:Math.max(12,Math.min(72,e.fontSize))}):o)})}function ic(t,e){let o=en(t),n=t.annotations.find(i=>i.id===e.id),r=n==null?void 0:n.groupId;return b(h({},o),{annotations:t.annotations.filter(i=>i.id!==e.id&&!(r&&i.groupId===r))})}function sc(t,e){let o=e.saveUndo?en(t):t,n=t.annotations.find(i=>i.id===e.id),r=n==null?void 0:n.groupId;return b(h({},o),{annotations:t.annotations.map(i=>{if(!(i.id===e.id||r&&i.groupId===r))return i;let a=e.delta.x,l=e.delta.y;return b(h({},i),{points:i.points.map(c=>({x:c.x+a,y:c.y+l}))})})})}function ac(t,e){let o=e.saveUndo?en(t):t,n=t.annotations.find(s=>s.id===e.id);if(!n||n.type==="text"||n.points.length<2)return t;let r=0,i=0;if(n.type==="rectangle"&&n.groupId){let s=e.points,a=Math.min(s[0].x,s[1].x),l=Math.max(s[0].y,s[1].y),c=n.points[0],d=n.points[n.points.length-1],p=Math.min(c.x,d.x),u=Math.max(c.y,d.y);r=a-p,i=l-u}return b(h({},o),{annotations:t.annotations.map(s=>s.id===e.id?b(h({},s),{points:e.points}):n.groupId&&s.groupId===n.groupId&&s.type==="text"?b(h({},s),{points:s.points.map(a=>({x:a.x+r,y:a.y+i}))}):s)})}function lc(t,e){let o=en(t);return b(h({},o),{annotations:[...t.annotations,...e.annotations.map(Ks)]})}function cc(t,e){let o=new Set,n=[];for(let r of e.annotations)o.has(r.id)||(o.add(r.id),n.push(Ks(r)));return b(h({},t),{annotations:n})}function dc(t){if(t.undoStack.length===0)return t;let e=t.undoStack[t.undoStack.length-1];return b(h({},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 uc(t){if(t.redoStack.length===0)return t;let e=t.redoStack[t.redoStack.length-1];return b(h({},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 pc(t,e){let{id:o,addToSelection:n}=e;if(o===null)return b(h({},t),{selectedAnnotationIds:[],lastSelectedId:null});if(n)if(t.selectedAnnotationIds.includes(o)){let i=t.selectedAnnotationIds.filter(s=>s!==o);return b(h({},t),{selectedAnnotationIds:i,lastSelectedId:i.length>0?i[i.length-1]:null})}else return b(h({},t),{selectedAnnotationIds:[...t.selectedAnnotationIds,o],lastSelectedId:o});return b(h({},t),{selectedAnnotationIds:[o],lastSelectedId:o})}function fc(t,e){let o=new Set;for(let n of t.selectedAnnotationIds){let r=t.annotations.find(i=>i.id===n);r!=null&&r.groupId&&o.add(r.groupId)}return b(h({},t),{annotations:t.annotations.map(n=>{let r=t.selectedAnnotationIds.includes(n.id),i=n.groupId&&o.has(n.groupId);return!r&&!i?n:b(h({},n),{color:e.color})})})}function gc(t){return b(h({},t),{annotations:t.annotations.map(e=>b(h({},e),{captured:!0,status:e.status==="pending"||!e.status?"in_flight":e.status})),styleModifications:t.styleModifications.map(e=>b(h({},e),{captured:!0})),spacingTokenChanges:t.spacingTokenChanges.map(e=>b(h({},e),{captured:!0}))})}function mc(t){return b(h({},t),{annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]})}function hc(t,e){return b(h({},t),{inspectedElement:e})}function yc(t,e){let{selector:o,element:n,property:r,original:i,modified:s}=e,a=t.styleModifications.findIndex(l=>l.selector===o);if(i===s&&a<0)return t;if(a>=0){let l=t.styleModifications[a];if(l.captured){let g=en(t),f=g.styleModifications.map((m,x)=>x===a?b(h({},m),{changes:[{property:r,original:i,modified:s}],captured:!1}):m);return b(h({},g),{styleModifications:f})}let c=l.changes.findIndex(g=>g.property===r),d,p=t;if(c>=0){let g=l.changes[c];s===g.original?d=l.changes.filter((f,m)=>m!==c):d=l.changes.map((f,m)=>m===c?b(h({},f),{modified:s}):f)}else{if(i===s)return t;p=en(t),d=[...l.changes,{property:r,original:i,modified:s}]}if(d.length===0)return b(h({},p),{styleModifications:p.styleModifications.filter((g,f)=>f!==a)});let u=p.styleModifications.map((g,f)=>f===a?b(h({},g),{changes:d}):g);return b(h({},p),{styleModifications:u})}else{let l=en(t),c={selector:o,element:n,changes:[{property:r,original:i,modified:s}]};return b(h({},l),{styleModifications:[...l.styleModifications,c]})}}function bc(t,e){let{selector:o,durableSelector:n,element:r,changes:i}=e,s=i.filter(c=>c.original!==c.modified);if(s.length===0)return t;let a=en(t),l=a.styleModifications.findIndex(c=>c.selector===o);if(l>=0){let c=a.styleModifications[l],d=c.captured?[]:[...c.changes];for(let p of s){let u=d.findIndex(g=>g.property===p.property);u>=0?p.modified===d[u].original?d=d.filter((g,f)=>f!==u):d=d.map((g,f)=>f===u?b(h({},g),{modified:p.modified}):g):d.push(p)}return d.length===0?b(h({},a),{styleModifications:a.styleModifications.filter((p,u)=>u!==l)}):b(h({},a),{styleModifications:a.styleModifications.map((p,u)=>u===l?b(h({},p),{changes:d,captured:!1}):p)})}else return b(h({},a),{styleModifications:[...a.styleModifications,{selector:o,durableSelector:n,element:r,changes:s}]})}function xc(t,e){let{selector:o,property:n}=e,r=en(t),i=r.styleModifications.map(s=>s.selector!==o?s:b(h({},s),{changes:s.changes.filter(a=>a.property!==n)})).filter(s=>s.changes.length>0);return b(h({},r),{styleModifications:i})}function vc(t){if(t.styleModifications.length===0)return b(h({},t),{inspectedElement:null});let e=en(t);return b(h({},e),{styleModifications:[],inspectedElement:null})}function Sc(t,e){return b(h({},t),{styleModifications:e})}function wc(t,e){let{updates:o}=e,n=new Map(o.map(r=>[r.id,r]));return b(h({},t),{annotations:t.annotations.map(r=>{let i=n.get(r.id);return i?h(b(h({},r),{points:[i.point,...r.points.slice(1)]}),i.linkedAnchor?{linkedAnchor:i.linkedAnchor}:{}):r})})}function kc(t,e){let o=new Set(e.ids);return b(h({},t),{annotations:t.annotations.map(n=>o.has(n.id)?b(h({},n),{status:e.status}):n)})}function Ec(t,e){let o=new Set(e.ids),n=new Set;for(let r of t.annotations)o.has(r.id)&&r.groupId&&n.add(r.groupId);return b(h({},t),{annotations:t.annotations.map(r=>o.has(r.id)||r.groupId&&n.has(r.groupId)?b(h({},r),{threadId:e.threadId}):r)})}function Cc(t,e){let o=new Set(e.ids),n=new Set;for(let r of t.annotations)o.has(r.id)&&r.groupId&&n.add(r.groupId);return b(h({},t),{annotations:t.annotations.map(r=>o.has(r.id)||r.groupId&&n.has(r.groupId)?b(h({},r),{status:"waiting_input",question:e.question,threadId:e.threadId}):r)})}function Tc(t,e){let o=new Map(e.resolutions.map(r=>[r.annotationId,r])),n=new Map;for(let r of t.annotations){let i=o.get(r.id);i&&r.groupId&&n.set(r.groupId,i)}return b(h({},t),{annotations:t.annotations.map(r=>{var s,a,l;let i=o.get(r.id)||(r.groupId?n.get(r.groupId):void 0);return i?b(h({},r),{status:i.status,resolutionSummary:i.summary,scope:(a=(s=i.finalScope)!=null?s:i.inferredScope)!=null?a:null,replyCount:((l=r.replyCount)!=null?l:0)+1,question:void 0,threadId:r.threadId||e.threadId}):r})})}function Ic(t,e){let{groupId:o,planId:n,planTaskId:r,instruction:i,region:s,color:a,linkedSelector:l,elements:c}=e,d=i.length>60?i.slice(0,60).replace(/\s+\S*$/,"")+"\u2026":i,p={id:vo(),type:"rectangle",points:[{x:s.x,y:s.y},{x:s.x+s.width,y:s.y+s.height}],color:a,strokeWidth:2,timestamp:Date.now(),groupId:o,linkedSelector:l,elements:c,planId:n,planTaskId:r,status:"pending"},u={id:vo(),type:"text",points:[{x:s.x,y:s.y+s.height+4}],text:d,fontSize:12,color:a,strokeWidth:2,timestamp:Date.now(),status:"pending",groupId:o,linkedSelector:l,elements:c,planId:n,planTaskId:r};return b(h({},t),{annotations:[...t.annotations,p,u]})}function Mc(t,e){let{linkedSelectors:o,styleSelectors:n}=e,r=new Set(o),i=new Set(n),s=new Set,a=new Set;for(let u of t.annotations)u.linkedSelector&&r.has(u.linkedSelector)&&(s.add(u.id),u.groupId&&a.add(u.groupId));for(let u of t.annotations)u.groupId&&a.has(u.groupId)&&s.add(u.id);let l=t.annotations.filter(u=>!s.has(u.id)),c=t.styleModifications.filter(u=>!i.has(u.selector));if(l.length===t.annotations.length&&c.length===t.styleModifications.length)return t;let d=t.selectedAnnotationIds.filter(u=>!s.has(u)),p=t.inspectedElement&&i.has(t.inspectedElement.info.selector)?null:t.inspectedElement;return b(h({},t),{annotations:l,styleModifications:c,selectedAnnotationIds:d,lastSelectedId:d.length>0?d[d.length-1]:null,inspectedElement:p})}function Lc(t,e){let o=t.spacingTokenChanges.findIndex(n=>n.tokenPath===e.tokenPath);return o>=0?b(h({},t),{spacingTokenChanges:t.spacingTokenChanges.map((n,r)=>r===o?e:n)}):b(h({},t),{spacingTokenChanges:[...t.spacingTokenChanges,e]})}function Rc(t,e){return b(h({},t),{spacingTokenChanges:e})}function Ac(t,e){let o=en(t),n=t.spacingTokenMods.findIndex(i=>i.tokenPath===e.tokenPath),r;if(n>=0){let i=t.spacingTokenMods[n],s=b(h({},e),{originalValue:i.originalValue,originalPx:i.originalPx});r=t.spacingTokenMods.map((a,l)=>l===n?s:a)}else r=[...t.spacingTokenMods,e];return b(h({},o),{spacingTokenMods:r})}function Pc(t,e){let o=en(t),n=t.spacingTokenMods.findIndex(l=>l.tokenPath===e.tokenPath),r=n>=0?t.spacingTokenMods[n].originalValue:e.originalValue,i=n>=0?t.spacingTokenMods[n].originalPx:parseFloat(e.originalValue)||0,s={tokenPath:e.tokenPath,originalValue:r,currentValue:"__deleted__",targets:n>=0?t.spacingTokenMods[n].targets:[],originalPx:i,currentPx:0},a;return n>=0?a=t.spacingTokenMods.map((l,c)=>c===n?s:l):a=[...t.spacingTokenMods,s],b(h({},o),{spacingTokenMods:a})}var Bc={SET_ANNOTATING:Xl,SET_TOOL:Ul,SET_COLOR:Kl,SET_STROKE_WIDTH:Zl,START_PATH:ql,CONTINUE_PATH:Ql,CANCEL_PATH:tc,FINISH_PATH:ec,ADD_TEXT:nc,UPDATE_TEXT:oc,UPDATE_TEXT_SIZE:rc,DELETE_ANNOTATION:ic,MOVE_ANNOTATION:sc,RESIZE_ANNOTATION:ac,PASTE_ANNOTATIONS:lc,RESTORE_ANNOTATIONS:cc,UNDO:dc,REDO:uc,SELECT_ANNOTATION:pc,UPDATE_ANNOTATION_COLOR:fc,MARK_CAPTURED:gc,CLEAR:mc,SELECT_ELEMENT:hc,MODIFY_STYLE:yc,MODIFY_STYLES_BATCH:bc,CLEAR_STYLE:xc,CLEAR_ALL_STYLES:vc,RESTORE_STYLE_MODIFICATIONS:Sc,UPDATE_LINKED_POSITIONS:wc,CLEANUP_ORPHANED:Mc,SET_ANNOTATION_STATUS:kc,SET_ANNOTATION_THREAD:Ec,SET_ANNOTATION_QUESTION:Cc,APPLY_RESOLUTIONS:Tc,ADD_PLAN_ANNOTATION:Ic,ADD_SPACING_TOKEN_CHANGE:Lc,RESTORE_SPACING_TOKEN_CHANGES:Rc,MODIFY_SPACING_TOKEN:Ac,DELETE_SPACING_TOKEN:Pc};function Oc(t,e){let o=Bc[e.type];return o?o(t,e.payload):t}function Zs(){let[t,e]=Jl(Oc,Vl);return Gl(()=>{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 qn(t){let e=Object.keys(t).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!e)return null;let o=t[e],n=[];for(;o;){let r=o.type,i=(r==null?void 0:r.displayName)||(r==null?void 0:r.name);i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&n.unshift(i),o=o.return}return n.length>0?{name:n[n.length-1],path:n}:null}function _r(t){let e=Object.keys(t).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!e)return[];let o=t[e],n=[];for(;o;){let r=o.type,i=typeof r=="function"||typeof r=="object"?(r==null?void 0:r.displayName)||(r==null?void 0:r.name):null;i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&n.push({name:i,fiber:o}),o=o.return}return n.reverse(),n}function cr(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 qs(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 hn(t){if(t.id&&!t.id.startsWith("radix-")&&!t.id.startsWith(":"))return`#${CSS.escape(t.id)}`;let e=[],o=t;for(;o&&o!==document.documentElement;){let n=o.tagName.toLowerCase();if(o.id&&!o.id.startsWith("radix-")&&!o.id.startsWith(":")){e.unshift(`#${CSS.escape(o.id)}`);break}let r=Array.from(o.classList).filter(s=>!s.startsWith("_")&&s.length<30).slice(0,2);r.length>0&&(n+="."+r.map(s=>CSS.escape(s)).join("."));let i=o.parentElement;if(i){let s=Array.from(i.children).filter(a=>a.tagName===o.tagName);if(s.length>1){let a=s.indexOf(o)+1;n+=`:nth-of-type(${a})`}}e.unshift(n),o=i}return e.join(" > ")}function Ke(t){try{return document.querySelector(t)}catch(e){return null}}function dr(t,e=0){var l;let o=_r(t);if(o.length===0)return null;let n=o.map(c=>c.name),r=o.length-1,i=Math.max(0,Math.min(o.length-1,r-e)),s=o[i],a=(l=cr(s.fiber))!=null?l:t;return{name:s.name,path:n,depthIndex:i,rootElement:a}}function Qs(t,e){var i,s;let o=_r(t),n=e.toLowerCase(),r=-1;for(let a=o.length-1;a>=0;a--){let l=o[a].name;if(l===e){let c=(i=cr(o[a].fiber))!=null?i:t;return{name:e,path:o.map(d=>d.name),depthIndex:a,rootElement:c}}if(r===-1){let c=l.toLowerCase();(c.length>=4&&n.includes(c)||n.length>=4&&c.includes(n))&&(r=a)}}if(r>=0){let a=(s=cr(o[r].fiber))!=null?s:t;return{name:e,path:o.map(l=>l.name),depthIndex:r,rootElement:a}}return null}function So(t){let e=wo(),o=[],n=new Set,r=e.currentNode;for(;r=e.nextNode();){let i=Qs(r,t);i&&!n.has(i.rootElement)&&(n.add(i.rootElement),o.push(i))}return o}function zr(t){let e=new Map;if(t.size===0)return e;let o=new Set(t),n=wo(),r=new Set,i=n.currentNode;for(;(i=n.nextNode())&&o.size>0;)for(let s of o){let a=Qs(i,s);if(!a||r.has(a.rootElement))continue;r.add(a.rootElement);let l=a.rootElement.getBoundingClientRect();e.set(s,l.top+window.scrollY),o.delete(s);break}for(let s of o)e.set(s,1/0);return e}function wo(){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 Ze(t){let e={selector:qs(t),tagName:t.tagName.toLowerCase()};t.id&&(e.id=t.id),t.classList.length>0&&(e.className=Array.from(t.classList).join(" "));let o=$o(t);o&&o.length>0&&o.length<200&&(e.textContent=o);let n={};for(let s of t.attributes)s.name.startsWith("data-")&&(n[s.name]=s.value);Object.keys(n).length>0&&(e.dataAttributes=n);let r=qn(t);r&&(e.reactComponent=r.name);let i=Dc(t);return i&&(e.context=i),e}function $o(t){let e="";for(let o of t.childNodes)o.nodeType===Node.TEXT_NODE&&(e+=o.textContent||"");return e.trim()}function Yn(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 Dc(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 ta(t){let e=new Set,o=[],n=window.scrollX,r=window.scrollY,i=[{x:(t.minX+t.maxX)/2,y:(t.minY+t.maxY)/2},{x:t.minX,y:t.minY},{x:t.maxX,y:t.minY},{x:t.minX,y:t.maxY},{x:t.maxX,y:t.maxY}];for(let s of i){let a=s.x-n,l=s.y-r;if(a<0||l<0||a>window.innerWidth||l>window.innerHeight)continue;let c=Yn(a,l);c&&!e.has(c)&&(e.add(c),o.push(Ze(c)))}return o.slice(0,3)}function $r(t){if(t.length===0)return[];let e=t.map(n=>n.x),o=t.map(n=>n.y);return ta({minX:Math.min(...e),minY:Math.min(...o),maxX:Math.max(...e),maxY:Math.max(...o)})}function Wr(t){let e=t.x+t.width/2,o=t.y+t.height/2,n=e-window.scrollX,r=o-window.scrollY,i=Yn(n,r);if(!i||!(i instanceof HTMLElement))return null;if(!i.hasAttribute("data-pm")){let d=Math.random().toString(36).substring(2,9);i.setAttribute("data-pm",d)}let a=`[data-pm="${i.getAttribute("data-pm")}"]`,l=Ze(i),c=i.getBoundingClientRect();return{selector:a,info:l,rect:c}}function Oe(t,e){return t.style.getPropertyValue(e)!==""}function Nc(t,e=30){if(t<=0)return[];let o=[],n=wo(),r=.5,i=n.currentNode;for(;(i=n.nextNode())&&o.length<e;){let s=i,a=s.getBoundingClientRect();if(a.bottom<-50||a.top>window.innerHeight+50||a.right<-50||a.left>window.innerWidth+50||a.width<1||a.height<1)continue;let l=getComputedStyle(s);!Oe(s,"padding-top")&&Math.abs((parseFloat(l.paddingTop)||0)-t)<r&&o.push({element:s,property:"padding-top"}),!Oe(s,"padding-bottom")&&Math.abs((parseFloat(l.paddingBottom)||0)-t)<r&&o.length<e&&o.push({element:s,property:"padding-bottom"}),!Oe(s,"padding-left")&&Math.abs((parseFloat(l.paddingLeft)||0)-t)<r&&o.length<e&&o.push({element:s,property:"padding-left"}),!Oe(s,"padding-right")&&Math.abs((parseFloat(l.paddingRight)||0)-t)<r&&o.length<e&&o.push({element:s,property:"padding-right"}),!Oe(s,"margin-top")&&Math.abs((parseFloat(l.marginTop)||0)-t)<r&&o.length<e&&o.push({element:s,property:"margin-top"}),!Oe(s,"margin-bottom")&&Math.abs((parseFloat(l.marginBottom)||0)-t)<r&&o.length<e&&o.push({element:s,property:"margin-bottom"}),!Oe(s,"margin-left")&&Math.abs((parseFloat(l.marginLeft)||0)-t)<r&&o.length<e&&o.push({element:s,property:"margin-left"}),!Oe(s,"margin-right")&&Math.abs((parseFloat(l.marginRight)||0)-t)<r&&o.length<e&&o.push({element:s,property:"margin-right"});let c=l.display;if((c.includes("flex")||c.includes("grid"))&&o.length<e){let d=Oe(s,"gap"),p=parseFloat(l.gap)||0,u=parseFloat(l.rowGap)||0,g=parseFloat(l.columnGap)||0;!d&&Math.abs(p-t)<r?o.push({element:s,property:"gap"}):!Oe(s,"row-gap")&&Math.abs(u-t)<r?o.push({element:s,property:"row-gap"}):!Oe(s,"column-gap")&&Math.abs(g-t)<r&&o.push({element:s,property:"column-gap"})}}return o}function Yr(t,e=30){if(t<=0)return[];let o=[],n=wo(),r=.5,i=n.currentNode;for(;(i=n.nextNode())&&o.length<e;){let s=i,a=s.getBoundingClientRect();if(a.bottom<-50||a.top>window.innerHeight+50||a.right<-50||a.left>window.innerWidth+50||a.width<1||a.height<1)continue;let l=getComputedStyle(s),c=parseFloat(l.borderTopWidth)||0,d=parseFloat(l.borderRightWidth)||0,p=parseFloat(l.borderBottomWidth)||0,u=parseFloat(l.borderLeftWidth)||0,g=s.clientWidth,f=s.clientHeight,m=parseFloat(l.paddingTop)||0;!Oe(s,"padding-top")&&Math.abs(m-t)<r&&o.push({x:a.left+u,y:a.top+c,width:g,height:t,direction:"vertical",property:"padding-top"});let x=parseFloat(l.paddingBottom)||0;!Oe(s,"padding-bottom")&&Math.abs(x-t)<r&&o.length<e&&o.push({x:a.left+u,y:a.top+c+f-t,width:g,height:t,direction:"vertical",property:"padding-bottom"});let y=parseFloat(l.paddingLeft)||0;!Oe(s,"padding-left")&&Math.abs(y-t)<r&&o.length<e&&o.push({x:a.left+u,y:a.top+c,width:t,height:f,direction:"horizontal",property:"padding-left"});let P=parseFloat(l.paddingRight)||0;!Oe(s,"padding-right")&&Math.abs(P-t)<r&&o.length<e&&o.push({x:a.left+u+g-t,y:a.top+c,width:t,height:f,direction:"horizontal",property:"padding-right"});let C=parseFloat(l.marginTop)||0;!Oe(s,"margin-top")&&Math.abs(C-t)<r&&o.length<e&&o.push({x:a.left,y:a.top-t,width:a.width,height:t,direction:"vertical",property:"margin-top"});let M=parseFloat(l.marginBottom)||0;!Oe(s,"margin-bottom")&&Math.abs(M-t)<r&&o.length<e&&o.push({x:a.left,y:a.bottom,width:a.width,height:t,direction:"vertical",property:"margin-bottom"});let T=parseFloat(l.marginLeft)||0;!Oe(s,"margin-left")&&Math.abs(T-t)<r&&o.length<e&&o.push({x:a.left-t,y:a.top,width:t,height:a.height,direction:"horizontal",property:"margin-left"});let H=parseFloat(l.marginRight)||0;!Oe(s,"margin-right")&&Math.abs(H-t)<r&&o.length<e&&o.push({x:a.right,y:a.top,width:t,height:a.height,direction:"horizontal",property:"margin-right"});let L=l.display;if((L.includes("flex")||L.includes("grid"))&&o.length<e&&!Oe(s,"gap")){let q=Array.from(s.children).filter(et=>{let B=getComputedStyle(et);return B.display!=="none"&&B.position!=="absolute"&&B.position!=="fixed"});if(q.length>=2)for(let et=0;et<q.length-1&&o.length<e;et++){let B=q[et].getBoundingClientRect(),U=q[et+1].getBoundingClientRect(),tt=U.top-B.bottom;Math.abs(tt-t)<r&&tt>.5&&o.push({x:Math.min(B.left,U.left),y:B.bottom,width:Math.max(B.right,U.right)-Math.min(B.left,U.left),height:tt,direction:"vertical",property:"gap"});let kt=U.left-B.right;Math.abs(kt-t)<r&&kt>.5&&o.push({x:B.right,y:Math.min(B.top,U.top),width:kt,height:Math.max(B.bottom,U.bottom)-Math.min(B.top,U.top),direction:"horizontal",property:"gap"})}}}return o}function ur(t){return typeof t=="string"?{value:t}:t}var na={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 ea(t,e){let o=na[e];return o?o.includes(t):!1}function Fc(t,e){let o=t.split(/\s+/);for(let n of o){if(n===e)return!0;let r=n.lastIndexOf(":");if(r>=0&&n.slice(r+1)===e)return!0}return!1}function Hc(t){var a,l;let e=t.lastIndexOf(":"),o=e>=0?t.slice(e+1):t,n=o.indexOf("-");if(n<0)return null;let r=o.slice(0,n),i={gap:"gap","gap-x":"column-gap","gap-y":"row-gap",p:"padding",pt:"padding-top",pb:"padding-bottom",pl:"padding-left",pr:"padding-right",px:"padding-left",py:"padding-top",m:"margin",mt:"margin-top",mb:"margin-bottom",ml:"margin-left",mr:"margin-right",mx:"margin-left",my:"margin-top"},s=o.slice(0,o.indexOf("-",n+1)>0?o.indexOf("-",n+1):n);return(l=(a=i[s])!=null?a:i[r])!=null?l:null}function jr(t,e=30){let o=parseFloat(t.value);if(isNaN(o)||o<=0)return[];if(t.bindings&&t.bindings.length>0){let r=[],i=wo(),s=i.currentNode;for(;(s=i.nextNode())&&r.length<e;){let a=s,l=a.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let c=a.className;if(typeof c=="string")for(let d of t.bindings){if(!Fc(c,d))continue;let p=Hc(d);if(p&&!(t.property&&!ea(p,t.property))){r.push({element:a,property:p});break}}}return r}let n=Nc(o,e*2);return t.property?n.filter(r=>ea(r.property,t.property)).slice(0,e):n.slice(0,e)}function Gr(t,e=30){let o=jr(t,e),n=[];for(let r of o){let i=r.element,s=i.getBoundingClientRect(),a=getComputedStyle(i),l=parseFloat(a.borderTopWidth)||0,c=parseFloat(a.borderRightWidth)||0,d=parseFloat(a.borderLeftWidth)||0,p=i.clientWidth,u=i.clientHeight;switch(r.property){case"padding-top":{let g=parseFloat(a.paddingTop)||0;n.push({x:s.left+d,y:s.top+l,width:p,height:g,direction:"vertical",property:r.property});break}case"padding-bottom":{let g=parseFloat(a.paddingBottom)||0;n.push({x:s.left+d,y:s.top+l+u-g,width:p,height:g,direction:"vertical",property:r.property});break}case"padding-left":{let g=parseFloat(a.paddingLeft)||0;n.push({x:s.left+d,y:s.top+l,width:g,height:u,direction:"horizontal",property:r.property});break}case"padding-right":{let g=parseFloat(a.paddingRight)||0;n.push({x:s.left+d+p-g,y:s.top+l,width:g,height:u,direction:"horizontal",property:r.property});break}case"margin-top":{let g=parseFloat(a.marginTop)||0;n.push({x:s.left,y:s.top-g,width:s.width,height:g,direction:"vertical",property:r.property});break}case"margin-bottom":{let g=parseFloat(a.marginBottom)||0;n.push({x:s.left,y:s.bottom,width:s.width,height:g,direction:"vertical",property:r.property});break}case"margin-left":{let g=parseFloat(a.marginLeft)||0;n.push({x:s.left-g,y:s.top,width:g,height:s.height,direction:"horizontal",property:r.property});break}case"margin-right":{let g=parseFloat(a.marginRight)||0;n.push({x:s.right,y:s.top,width:g,height:s.height,direction:"horizontal",property:r.property});break}case"gap":case"row-gap":case"column-gap":{let g=Array.from(i.children).filter(f=>{let m=getComputedStyle(f);return m.display!=="none"&&m.position!=="absolute"&&m.position!=="fixed"});for(let f=0;f<g.length-1&&n.length<e;f++){let m=g[f].getBoundingClientRect(),x=g[f+1].getBoundingClientRect(),y=x.top-m.bottom;y>.5&&n.push({x:Math.min(m.left,x.left),y:m.bottom,width:Math.max(m.right,x.right)-Math.min(m.left,x.left),height:y,direction:"vertical",property:"gap"});let P=x.left-m.right;P>.5&&n.push({x:m.right,y:Math.min(m.top,x.top),width:P,height:Math.max(m.bottom,x.bottom)-Math.min(m.top,x.top),direction:"horizontal",property:"gap"})}break}}}return n}function oa(t,e){let o=new Set,n=Wo(e);for(let r of t){let i=ia[r.property];if(!i)continue;let s=r.element.className;if(typeof s=="string")for(let a of i){let l=`${a}-${n}`;for(let c of s.split(/\s+/)){let d=c.lastIndexOf(":"),p=d>=0?c.slice(d+1):c;if(p===l){o.add(p);break}}}}return[...o]}function ra(t){let e=new Set;for(let o of t)for(let[n,r]of Object.entries(na))if(r.includes(o.property)){e.add(n);break}if(e.size===1)return[...e][0]}function Jr(t,e,o){if(e===o)return t;let n=Wo(e),r=Wo(o);return t.map(i=>{let s=i.lastIndexOf("-");if(s<0)return i;let a=i.slice(0,s),l=i.slice(s+1);return l===n||l===`[${e}px]`?`${a}-${r}`:i})}var _c={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 Wo(t){var e;return(e=_c[t])!=null?e:`[${t}px]`}var ia={"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 zc(t,e,o,n){let r=ia[e];if(!r)return null;let i=Wo(o);for(let s of r){let a=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+s+"-(?:"+$c(i)+"|\\["+o+"px\\]))(?:\\s|$)"),l=t.match(a);if(l!=null&&l[1]){let c=Wo(n),d=l[1].lastIndexOf(":"),p=d>=0?l[1].slice(0,d+1):"";return{matched:l[1],suggested:`${p}${s}-${c}`}}}return null}function $c(t){return t.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function sa(t,e,o){let n=new Set,r=[];for(let i of t){let s=hn(i.element),a=`${s}::${i.property}`;if(n.has(a))continue;n.add(a);let l=qn(i.element),c=i.element.className||"",d=zc(c,i.property,e,o);r.push({selector:s,reactComponent:l==null?void 0:l.name,className:c,property:i.property,matchedClass:d==null?void 0:d.matched,suggestedClass:d==null?void 0:d.suggested})}return r}function Yo(t,e){return window.getComputedStyle(t).getPropertyValue(e)}function Vr(t,e){if(t instanceof HTMLElement){let n=t.style.getPropertyValue(e);if(n)return n}let o=Wc(t,e);return o&&o.includes("var(")?o:Yo(t,e)}function Wc(t,e){let o=e.replace(/-([a-z])/g,(n,r)=>r.toUpperCase());try{for(let n of document.styleSheets)try{let r=n.cssRules||n.rules;for(let i of r)if(i instanceof CSSStyleRule&&t.matches(i.selectorText)){let s=i.style.getPropertyValue(e);if(s&&s.includes("var("))return s;let a=i.style[o];if(a&&a.includes("var("))return a}}catch(r){}}catch(n){}return null}function pr(t,e){if(t instanceof HTMLElement){let n=t.style.getPropertyValue(e);if(n)return n}let o=e.replace(/-([a-z])/g,(n,r)=>r.toUpperCase());try{for(let n of document.styleSheets)try{let r=n.cssRules||n.rules;for(let i of r)if(i instanceof CSSStyleRule&&t.matches(i.selectorText)){let s=i.style.getPropertyValue(e);if(s)return s;let a=i.style[o];if(a)return a}}catch(r){}}catch(n){}return null}function fr(t){let e=window.getComputedStyle(t).display;return e==="flex"||e==="inline-flex"||e==="grid"||e==="inline-grid"}function jo(t){let e=window.getComputedStyle(t);return{row:parseFloat(e.rowGap)||0,column:parseFloat(e.columnGap)||0}}function Yc(t){let e=[];for(let o of t){let n=e.find(r=>r.axis!==o.axis?!1:o.axis==="row"?Math.abs(r.y-o.y)<2&&Math.abs(r.h-o.h)<2:Math.abs(r.x-o.x)<2&&Math.abs(r.w-o.w)<2);if(n)if(o.axis==="row"){let r=Math.min(n.x,o.x),i=Math.max(n.x+n.w,o.x+o.w);n.x=r,n.w=i-r}else{let r=Math.min(n.y,o.y),i=Math.max(n.y+n.h,o.y+o.h);n.y=r,n.h=i-r}else e.push(h({},o))}return e}function Qn(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(),i=window.getComputedStyle(t).flexDirection,s=i==="column"||i==="column-reverse",a=6;for(let l=0;l<e.length-1;l++){let c=e[l].getBoundingClientRect(),d=e[l+1].getBoundingClientRect();if(d.left>c.right+.5&&o.push({axis:"column",x:c.right,y:n.top,w:d.left-c.right,h:n.height}),d.top>c.bottom+.5&&o.push({axis:"row",x:n.left,y:c.bottom,w:n.width,h:d.top-c.bottom}),!(d.left>c.right+.5)&&!(d.top>c.bottom+.5))if(s){let p=(c.bottom+d.top)/2;o.push({axis:"row",x:n.left,y:p-a/2,w:n.width,h:a})}else{let p=(c.right+d.left)/2;o.push({axis:"column",x:p-a/2,y:n.top,w:a,h:n.height})}}return Yc(o)}function Xr(t,e){let o=window.getComputedStyle(t),n=o.display;if(n!=="flex"&&n!=="inline-flex")return!1;let r=o.justifyContent;if(r!=="space-between"&&r!=="space-around"&&r!=="space-evenly"&&r!=="stretch")return!1;let i=o.flexDirection;return!(e!==(i==="column"||i==="column-reverse"?"row":"column")||parseFloat(e==="row"?o.rowGap:o.columnGap)>0)}function ko(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 to(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 Ur(t){for(let e of t.childNodes)if(e.nodeType===Node.TEXT_NODE&&(e.textContent||"").trim().length>0)return!0;return!1}function Eo(t){var d,p;let e=document.createRange(),o=!1;for(let u of t.childNodes)u.nodeType===Node.TEXT_NODE&&(u.textContent||"").trim().length>0&&(o||(e.setStart(u,0),o=!0),e.setEnd(u,(p=(d=u.textContent)==null?void 0:d.length)!=null?p:0));if(!o)return null;let n=e.getBoundingClientRect(),r=window.getComputedStyle(t),i=parseFloat(r.fontSize)||16,s=parseFloat(r.lineHeight);isNaN(s)&&(s=i*1.2);let a=Math.max(1,e.getClientRects().length),l=Math.max(n.height,a*s),c=(l-n.height)/2;return new DOMRect(n.x,n.y-c,n.width,l)}function Go(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 Kr(t,e,o){t instanceof HTMLElement&&t.style.removeProperty(e)}function gr(t){var e;for(let o of t){let n=Ke(o.selector);if(!n&&o.durableSelector&&(n=Ke(o.durableSelector),n)){let r=(e=o.selector.match(/\[data-pm="([^"]+)"\]/))==null?void 0:e[1];r&&n.setAttribute("data-pm",r)}if(n)for(let r of o.changes)Jt(n,r.property,r.modified)}}function Zr(t,e){let o=Ke(t);if(!o)return;let n=e.find(r=>r.selector===t);if(n)for(let r of n.changes)Kr(o,r.property,r.original)}function mr(t){for(let e of t){let o=Ke(e.selector);if(o)for(let n of e.changes)Kr(o,n.property,n.original)}}function la(t,e,o,n){if(t)for(let r of t){if(r instanceof CSSGroupingRule){la(r.cssRules,e,o,n);continue}if(r instanceof CSSStyleRule){let i=r.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&jc(r.style,e,o,n)}}}function jc(t,e,o,n){for(let r=0;r<t.length;r++){let i=t[r];if(i!=null&&i.startsWith("--")){if(o.has(i))continue;o.add(i);let s=e.getPropertyValue(i).trim();ca(s)&&n.push({name:i,value:s,usage:`var(${i})`})}}}var hr=null,Gc=5e3;function qr(){if(hr&&Date.now()-hr.timestamp<Gc)return hr.variables;let t=[],e=new Set,o=getComputedStyle(document.documentElement);try{for(let i of document.styleSheets)try{la(i.cssRules||i.rules,o,e,t)}catch(s){}}catch(i){}let n=document.documentElement.style;for(let i=0;i<n.length;i++){let s=n[i];if(s!=null&&s.startsWith("--")&&!e.has(s)){e.add(s);let a=o.getPropertyValue(s).trim();ca(a)&&t.push({name:s,value:a,usage:`var(${s})`})}}let r=t.sort((i,s)=>i.name.localeCompare(s.name));return hr={variables:r,timestamp:Date.now()},r}function ca(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 Jo(t,e){let o=e.match(/var\((--[^,)]+)(?:,\s*([^)]+))?\)/);if(o){let n=o[1],r=o[2];return getComputedStyle(document.documentElement).getPropertyValue(n).trim()||r||e}return e}function Vo(t,e){if(!t)return null;let o=aa(t);if(!o)return null;for(let n of e){let r=aa(n.value);if(r&&o===r)return n}return null}function aa(t){if(!t)return null;let e=t.trim().toLowerCase();if(e.startsWith("oklch(")){let o=e.match(/oklch\(\s*([\d.]+%?)\s+([\d.]+%?)\s+([\d.]+)/);if(o){let n=o[1].endsWith("%")?parseFloat(o[1])/100:parseFloat(o[1]),r=o[2].endsWith("%")?parseFloat(o[2])/100:parseFloat(o[2]),i=parseFloat(o[3]);n=Math.round(n*100)/100,r=Math.round(r*1e3)/1e3;let s=Math.round(i);return`oklch(${n} ${r} ${s})`}}if(e.startsWith("rgb")){let o=e.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(o)return`rgb(${o[1]},${o[2]},${o[3]})`}return e.startsWith("#")?e.length===4?`#${e[1]}${e[1]}${e[2]}${e[2]}${e[3]}${e[3]}`:e.slice(0,7):e}var Jc=new Set(["button","a","input","select","textarea"]),Vc=new Set(["button","link"]),Xc=new Set(["h1","h2","h3","h4","h5","h6","nav","main","header","footer","section","article","aside"]),Uc=["fontSize","fontWeight","fontFamily","lineHeight","letterSpacing","color","backgroundColor","padding","gap","borderRadius","boxShadow"];var Qr=150;function Kc(t){let e=0,o=t.parentElement;for(;o&&o!==document.body;)e++,o=o.parentElement;return e}function Zc(t){return!(t.startsWith("_")||t.startsWith("css-")||t.length>30)}function qc(t){let e=Array.from(t.classList).filter(Zc).slice(0,3);return e.length>0?e.join(" "):void 0}function Qc(t,e){let o=window.getComputedStyle(t),n=e?window.getComputedStyle(e):null,r={};for(let i of Uc){let s=o.getPropertyValue(i.replace(/[A-Z]/g,a=>`-${a.toLowerCase()}`));if(s&&!(i==="backgroundColor"&&(s==="rgba(0, 0, 0, 0)"||s==="transparent"))&&!(i==="boxShadow"&&s==="none")){if(i==="boxShadow"&&(s="yes"),i==="fontFamily"&&(s=s.split(",")[0].trim().replace(/['"]/g,"")),n){let a=n.getPropertyValue(i.replace(/[A-Z]/g,l=>`-${l.toLowerCase()}`));if(s===a)continue}r[i]=s}}return Object.keys(r).length>0?r:void 0}function td(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 ed(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 nd(t){let e=t.tagName.toLowerCase(),o=$o(t);if(o&&o.length>0||Jc.has(e))return!0;let n=t.getAttribute("role");return!!(n&&Vc.has(n)||Xc.has(e)||(e==="img"||e==="svg")&&(t.getAttribute("alt")||t.getAttribute("aria-label")))}function da(){var c,d,p,u,g;let t=[],e=document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT),o=e.nextNode();for(;o;){let f=o;if(o=e.nextNode(),ed(f)||!td(f))continue;let m=f.getBoundingClientRect();if(m.width<1||m.height<1||!nd(f))continue;let x=f.tagName.toLowerCase(),y=$o(f),P=Kc(f),C=f.getAttribute("role")||void 0,M=x==="a"&&f.getAttribute("href")||void 0,T=x==="img"&&f.getAttribute("alt")||void 0,H=(c=qn(f))==null?void 0:c.name,L=qc(f),_=Qc(f,f.parentElement),q={tag:x,rect:{x:Math.round(m.left+window.scrollX),y:Math.round(m.top+window.scrollY),w:Math.round(m.width),h:Math.round(m.height)},depth:P};y&&(q.text=y.length>80?y.slice(0,80)+"...":y),H&&(q.component=H),L&&(q.classes=L),_&&(q.styles=_),C&&(q.role=C),M&&(q.href=M),T&&(q.alt=T),t.push({el:f,entry:q})}t.sort((f,m)=>m.entry.depth-f.entry.depth);let n=new Set;for(let f=0;f<t.length;f++){let m=t[f];if(n.has(m.el))continue;let x=m.el.parentElement;if(!x||!t.find(M=>M.el===x))continue;let P=(d=m.el.textContent)==null?void 0:d.trim(),C=(p=x.textContent)==null?void 0:p.trim();P&&C&&P===C&&n.add(m.el)}let r=t.filter(f=>!n.has(f.el)),i=new Map;for(let f of r){let m=f.el.parentElement,x=[m?Array.from(m.classList).join("."):"",f.entry.tag,(u=f.entry.component)!=null?u:"",f.entry.styles?JSON.stringify(f.entry.styles):""].join("|"),y=(g=i.get(x))!=null?g:[];y.push(f),i.set(x,y)}let s=[],a=new Set;for(let[,f]of i)if(f.length>3){s.push(f[0].entry,f[1].entry),a.add(f[0].el),a.add(f[1].el);let m=1/0,x=1/0,y=-1/0,P=-1/0;for(let C=2;C<f.length;C++){let M=f[C].entry.rect;m=Math.min(m,M.x),x=Math.min(x,M.y),y=Math.max(y,M.x+M.w),P=Math.max(P,M.y+M.h)}s.push({tag:f[0].entry.tag,text:`(+${f.length-2} similar items)`,rect:{x:Math.round(m),y:Math.round(x),w:Math.round(y-m),h:Math.round(P-x)},depth:f[0].entry.depth});for(let C of f)a.add(C.el)}for(let f of r)a.has(f.el)||s.push(f.entry);let l=Math.max(document.documentElement.scrollHeight,1);if(s.sort((f,m)=>{let x=f.rect.w*f.rect.h,y=m.rect.w*m.rect.h,P=x*(1+.5*(1-f.rect.y/l));return y*(1+.5*(1-m.rect.y/l))-P}),s.length>Qr){let f=s.slice(0,Qr);return f.push({tag:"truncated",text:`${s.length-Qr} additional elements omitted`,rect:{x:0,y:0,w:0,h:0},depth:0}),f}return s}import{domToCanvas as od}from"modern-screenshot";function ei(t){let e=document.createElement("canvas").getContext("2d");return e?(e.fillStyle=t,e.fillStyle):"#888888"}function yr(t,e=[],o,n){let r=new Map,i=[];for(let a of t)if(a.groupId){let l=r.get(a.groupId)||[];l.push(a),r.set(a.groupId,l)}else i.push(a);let s=[];for(let[a,l]of r){let c=l.find(p=>p.type!=="text"),d=l.find(p=>p.type==="text");if(c){let p=c.linkedSelector||(d==null?void 0:d.linkedSelector),u=(d==null?void 0:d.imageCount)||c.imageCount;s.push(h(b(h({id:c.id,type:c.type,instruction:d==null?void 0:d.text},p?{linkedSelector:p}:{}),{elements:c.elements||[]}),u?{imageCount:u}:{}))}}for(let a of i)s.push(h(b(h({id:a.id,type:a.type,instruction:a.type==="text"?a.text:void 0},a.linkedSelector?{linkedSelector:a.linkedSelector}:{}),{elements:a.elements||[]}),a.imageCount?{imageCount:a.imageCount}:{}));return h(h({timestamp:new Date().toISOString(),url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},scrollPosition:{x:window.scrollX,y:window.scrollY},annotations:s,styleModifications:e},o?{inspectedElement:o}:{}),n&&n.length>0?{spacingTokenChanges:n}:{})}function ua(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 rd(t,e){if(t.length===0)return[];let o=t.map(d=>({annotation:d,bounds:ua(d)})).filter(d=>d.bounds!==null);if(o.length===0)return[];o.sort((d,p)=>d.bounds.minY-p.bounds.minY);let n=Math.min(...o.map(d=>d.bounds.minY)),r=Math.max(...o.map(d=>d.bounds.maxY));if(r-n<=e){let d=(n+r)/2,p=Math.max(0,d-e/2);return[{top:p,bottom:p+e,annotations:t}]}let i=[],s=50,a=Math.max(0,n-s),l=[],c=a;for(let{annotation:d,bounds:p}of o){let u=p.maxY+s;if(u-a<=e)l.push(d),c=Math.max(c,u);else{if(l.length>0){let g=(a+c)/2,f=Math.max(0,g-e/2);i.push({top:f,bottom:f+e,annotations:l})}a=Math.max(0,p.minY-s),l=[d],c=p.maxY+s}}if(l.length>0){let d=(a+c)/2,p=Math.max(0,d-e/2);i.push({top:p,bottom:p+e,annotations:l})}return i}function id(t,e,o,n){t.save(),t.scale(n,n);for(let r of e){let i=r.points.map(s=>({x:s.x,y:s.y-o}));switch(t.strokeStyle=r.color,t.fillStyle=r.color,t.lineWidth=r.strokeWidth,t.lineCap="round",t.lineJoin="round",r.type){case"freehand":if(i.length<2)break;t.beginPath(),t.moveTo(i[0].x,i[0].y);for(let s=1;s<i.length;s++)t.lineTo(i[s].x,i[s].y);t.stroke();break;case"line":if(i.length<2)break;t.beginPath(),t.moveTo(i[0].x,i[0].y),t.lineTo(i[i.length-1].x,i[i.length-1].y),t.stroke();break;case"rectangle":{if(i.length<2)break;let s=i[0],a=i[i.length-1],l=Math.min(s.x,a.x),c=Math.min(s.y,a.y),d=Math.abs(a.x-s.x),p=Math.abs(a.y-s.y);t.strokeRect(l,c,d,p);break}case"circle":{if(i.length<2)break;let s=i[0],a=i[i.length-1],l=(s.x+a.x)/2,c=(s.y+a.y)/2,d=Math.abs(a.x-s.x)/2,p=Math.abs(a.y-s.y)/2;t.beginPath(),t.ellipse(l,c,d,p,0,0,Math.PI*2),t.stroke();break}case"text":{if(!r.text||i.length<1)break;let s=i[0],a=r.fontSize||16;t.font=`${a}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`,t.fillStyle=r.color;let c=(r.imageCount&&r.imageCount>0?`[${r.imageCount} image${r.imageCount>1?"s":""}] ${r.text}`:r.text).split(`
|
|
3
|
+
`),d=a*1.2,p=4,u=0;for(let g of c)u=Math.max(u,t.measureText(g).width);t.fillRect(s.x-p,s.y-p,u+p*2,c.length*d+p*2),t.fillStyle="#ffffff",c.forEach((g,f)=>{t.fillText(g,s.x,s.y+a+f*d)});break}}}t.restore()}async function ni(t,e,o=[]){try{let n=window.devicePixelRatio||1,r=window.innerWidth,i=window.innerHeight,s=o.filter(c=>{var d;return((d=c.status)!=null?d:"pending")==="pending"});console.log("[Screenshot] Starting capture with",s.length,"active annotations (filtered",o.length-s.length,"captured)");let a=rd(s,i);if(a.length===0){let c=await ti(t,[],window.scrollY,r,i,n);return c?[c]:[]}let l=[];for(let c=0;c<a.length;c++){let d=a[c],p=await ti(t,d.annotations,d.top,r,i,n);p?l.push(p):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 ti(t,e,o,n,r,i){try{let s=await od(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:i,backgroundColor:"#ffffff",width:n,height:r,style:{transform:`translate(${-window.scrollX}px, ${-o}px)`}}),a=document.createElement("canvas");a.width=n*i,a.height=r*i;let l=a.getContext("2d");return l?(l.drawImage(s,0,0,n*i,r*i,0,0,n*i,r*i),id(l,e,o,i),new Promise(c=>{a.toBlob(d=>c(d),"image/png")})):null}catch(s){return console.error("Region capture failed:",s),null}}async function br(t){if(t.length===0)return null;if(t.length===1)return t[0];let e=await Promise.all(t.map(a=>new Promise((l,c)=>{let d=new Image;d.onload=()=>l(d),d.onerror=c,d.src=URL.createObjectURL(a)}))),o=e[0].width,n=e.reduce((a,l)=>a+l.height,0),r=document.createElement("canvas");r.width=o,r.height=n;let i=r.getContext("2d");if(!i)return null;let s=0;for(let a of e)i.drawImage(a,0,s),s+=a.height,URL.revokeObjectURL(a.src);return new Promise(a=>{r.toBlob(l=>a(l),"image/png")})}async function xr(t,e=[]){let n=window.innerWidth,r=window.innerHeight,i=Math.max(document.body.scrollHeight,document.documentElement.scrollHeight),s=window.scrollX,a=window.scrollY,l=[];try{let c=Math.ceil(i/r);for(let d=0;d<c;d++){let p=d*r;window.scrollTo(s,p),await new Promise(x=>requestAnimationFrame(()=>requestAnimationFrame(()=>x())));let u=p,g=p+r,f=e.filter(x=>{let y=ua(x);return y?y.maxY>=u&&y.minY<=g:!1}),m=await ti(t,f,p,n,Math.min(r,i-p),1);m&&l.push(m)}}finally{window.scrollTo(s,a)}return br(l)}async function pa(t,e,o){try{let n=Array.isArray(t)?t:[t];if(n.length===0)return!1;let r=await br(n);if(!r)return!1;let i={"image/png":r},s=e&&e.length>0,a=o&&o.length>0;if(s||a){let l=e?e.filter(c=>{var d;return((d=c.status)!=null?d:"pending")==="pending"}):[];if(l.length>0||a){let c=yr(l,o||[]),d=new Blob([JSON.stringify(c,null,2)],{type:"text/plain"});i["text/plain"]=d}}return await navigator.clipboard.write([new ClipboardItem(i)]),!0}catch(n){return console.warn("Clipboard write failed:",n),!1}}import{useCallback as We,useEffect as Ve,useMemo as Ni,useRef as Le,useState as ue}from"react";import{useCallback as Co,useRef as ad}from"react";function oi(t,e,o,n){if(e.length<2)return;let r=e[0],i=e[e.length-1];if(!r||!i)return;let s=(r.x+i.x)/2,a=(r.y+i.y)/2,l=Math.abs(i.x-r.x)/2,c=Math.abs(i.y-r.y)/2;t.beginPath(),t.strokeStyle=o,t.lineWidth=n,t.ellipse(s,a,l,c,0,0,Math.PI*2),t.stroke()}function ri(t,e,o,n){if(e.length<2)return;let r=e[0],i=e[e.length-1];if(!(!r||!i)){t.beginPath(),t.strokeStyle=o,t.lineWidth=n,t.lineCap="round",t.lineJoin="round",t.moveTo(r.x,r.y);for(let s=1;s<e.length-1;s++){let a=e[s],l=e[s+1];if(!a||!l)continue;let c=(a.x+l.x)/2,d=(a.y+l.y)/2;t.quadraticCurveTo(a.x,a.y,c,d)}t.lineTo(i.x,i.y),t.stroke()}}function ii(t,e,o,n){if(e.length<2)return;let r=e[0],i=e[e.length-1];!r||!i||(t.beginPath(),t.strokeStyle=o,t.lineWidth=n,t.lineCap="round",t.moveTo(r.x,r.y),t.lineTo(i.x,i.y),t.stroke())}function si(t,e,o,n){if(e.length<2)return;let r=e[0],i=e[e.length-1];if(!r||!i)return;let s=Math.min(r.x,i.x),a=Math.min(r.y,i.y),l=Math.abs(i.x-r.x),c=Math.abs(i.y-r.y);t.beginPath(),t.strokeStyle=o,t.lineWidth=n,t.lineCap="round",t.lineJoin="round",t.strokeRect(s,a,l,c)}var Ce='"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';function sd(t,e,o){if(!e||t.measureText(e).width<=o)return[e];let n=e.split(/\s+/),r=[],i="";for(let s of n){let a=i?i+" "+s:s;i&&t.measureText(a).width>o?(r.push(i),i=s):i=a}return i&&r.push(i),r.length>0?r:[e]}function eo(t){let e=window.innerWidth-t-16;if(e<400)return Math.max(60,e)}function jn(t,e,o){let n=[];for(let r of e)n.push(...sd(t,r,o));return n}function fa(t,e,o,n,r=12,i,s){if(!o)return;let a=r*1.4,l=o.split(`
|
|
4
|
+
`),c=i!==void 0?[i+". "+(l[0]||""),...l.slice(1)]:l;t.font=`${r}px ${Ce}`,t.textBaseline="middle";let d=s!==void 0?Math.min(400,Math.max(60,window.innerWidth-s-16)):400,p=jn(t,c,d),u=Math.min(d,Math.max(...p.map(y=>t.measureText(y).width))),g=p.length*a,f=c.length*a,m=g-f,x=e.y-m;t.fillStyle=n,t.fillRect(e.x-4,x-4,u+8,g+8),t.fillStyle="#ffffff",p.forEach((y,P)=>{t.fillText(y,e.x,x+P*a+a/2)})}var ga=11,ai=4,ld=`600 ${ga}px system-ui, -apple-system, sans-serif`;function li(t,e,o){return t.map(n=>({x:n.x-e,y:n.y-o}))}function cd(t,e,o,n,r,i){let s=String(n);t.font=ld;let l=t.measureText(s).width+ai*2,c=ga+ai*2,d=e-l/2,p=o+i/2+2;t.fillStyle=r,t.fillRect(d,p,l,c),t.fillStyle="#ffffff",t.textBaseline="middle",t.fillText(s,d+ai,p+c/2)}function dd(t,e){if(t.points.length<2&&t.type!=="text")return null;switch(t.type){case"rectangle":case"freehand":{let o,n;if(t.type==="freehand")o=Math.min(...t.points.map(r=>r.x)),n=Math.max(...t.points.map(r=>r.y));else{let r=t.points[0],i=t.points[t.points.length-1];o=Math.min(r.x,i.x),n=Math.max(r.y,i.y)}return{x:o,y:n}}case"circle":{let o=t.points[0],n=t.points[t.points.length-1],r=Math.min(o.x,n.x),i=(Math.min(o.y,n.y)+Math.max(o.y,n.y))/2;return{x:r,y:i}}case"line":{let o=t.points[0],n=t.points[t.points.length-1],r=o.y>n.y?o:n;return{x:r.x,y:r.y}}default:return null}}function ma(){let t=ad(null),e=Co(()=>{let a=t.current;if(!a)return;let l=a.getContext("2d");l&&l.clearRect(0,0,a.width,a.height)},[]),o=Co((a,l)=>{var g;let c=t.current;if(!c)return;let d=c.getContext("2d");if(!d)return;let u=((g=a.status)!=null?g:a.captured?"in_flight":"pending")==="pending"?a.color:"#999999";switch(a.type){case"freehand":ri(d,a.points,u,a.strokeWidth);break;case"line":ii(d,a.points,u,a.strokeWidth);break;case"rectangle":si(d,a.points,u,a.strokeWidth);break;case"circle":oi(d,a.points,u,a.strokeWidth);break;case"text":a.text&&a.points[0]&&fa(d,a.points[0],a.text,u,a.fontSize,l,a.points[0].x);break}},[]),n=Co((a,l,c,d)=>{let p=t.current;if(!p||a.length<2)return;let u=p.getContext("2d");if(u)switch(l){case"freehand":ri(u,a,c,d);break;case"line":ii(u,a,c,d);break;case"rectangle":si(u,a,c,d);break;case"circle":oi(u,a,c,d);break}},[]),r=Co((a,l)=>{let c=t.current;if(!c||a.points.length<2)return;let d=c.getContext("2d");if(d){if(d.fillStyle="#ffffff",d.strokeStyle=a.color,d.lineWidth=1.5,a.type==="line"){let p=a.points[0],u=a.points[a.points.length-1];[p,u].forEach(g=>{d.beginPath(),d.arc(g.x,g.y,l/2,0,Math.PI*2),d.fill(),d.stroke()});return}if(a.type==="circle"){let p=a.points[0],u=a.points[a.points.length-1],g=Math.min(p.x,u.x),f=Math.max(p.x,u.x),m=Math.min(p.y,u.y),x=Math.max(p.y,u.y),y=(g+f)/2,P=(m+x)/2;[{x:y,y:m},{x:y,y:x},{x:g,y:P},{x:f,y:P}].forEach(M=>{d.beginPath(),d.rect(M.x-l/2,M.y-l/2,l,l),d.fill(),d.stroke()});return}if(a.type==="rectangle"||a.type==="freehand"){let p,u,g,f;if(a.type==="freehand")p=Math.min(...a.points.map(x=>x.x)),u=Math.max(...a.points.map(x=>x.x)),g=Math.min(...a.points.map(x=>x.y)),f=Math.max(...a.points.map(x=>x.y));else{let x=a.points[0],y=a.points[a.points.length-1];p=Math.min(x.x,y.x),u=Math.max(x.x,y.x),g=Math.min(x.y,y.y),f=Math.max(x.y,y.y)}[{x:p,y:g},{x:u,y:g},{x:p,y:f},{x:u,y:f}].forEach(x=>{d.beginPath(),d.rect(x.x-l/2,x.y-l/2,l,l),d.fill(),d.stroke()})}}},[]),i=Co((a,l,c,d,p,u,g,f=0,m=0,x)=>{var y;if(e(),a.forEach(P=>{let C=b(h({},P),{points:li(P.points,f,m)}),M=x==null?void 0:x.get(P.id);o(C,M)}),l.length>0){let P=li(l,f,m);n(P,c,d,p)}if(u&&u.length>0&&g){let P=t.current,C=P==null?void 0:P.getContext("2d");for(let M of u){let T=a.find(H=>H.id===M);if(T){let H=b(h({},T),{points:li(T.points,f,m)});if(r(H,g),C&&T.type!=="text"&&x&&!(T.groupId&&a.some(_=>_.groupId===T.groupId&&_.type==="text"))){let _=x.get(T.id);if(_!==void 0){let q=dd(H,g);if(q){let B=((y=T.status)!=null?y:T.captured?"in_flight":"pending")==="pending"?T.color:"#999999";cd(C,q.x,q.y,_,B,g)}}}}}}},[e,o,n,r]),s=Co(()=>{let a=t.current;if(!a)return;let l=window.devicePixelRatio||1;a.width=window.innerWidth*l,a.height=window.innerHeight*l;let c=a.getContext("2d");c&&c.scale(l,l)},[]);return{canvasRef:t,clearCanvas:e,drawAnnotation:o,drawCurrentPath:n,redrawAll:i,resizeCanvas:s}}import{useEffect as ud,useRef as pd}from"react";function ha(){let t=pd({shift:!1,cmd:!1});return ud(()=>{let e=r=>{r.key==="Shift"&&(t.current.shift=!0),(r.key==="Meta"||r.key==="Control")&&(t.current.cmd=!0)},o=r=>{r.key==="Shift"&&(t.current.shift=!1),(r.key==="Meta"||r.key==="Control")&&(t.current.cmd=!1)},n=()=>{t.current={shift:!1,cmd:!1}};return window.addEventListener("keydown",e,!0),window.addEventListener("keyup",o,!0),window.addEventListener("blur",n),()=>{window.removeEventListener("keydown",e,!0),window.removeEventListener("keyup",o,!0),window.removeEventListener("blur",n)}},[]),t}import{useEffect as fd}from"react";function ya(t,e,o,n,r){fd(()=>{let i=s=>{if(t){if(t.linkedSelector)return;s.preventDefault(),s.stopPropagation();let l=s.deltaY>0?-2:2;e(c=>c?b(h({},c),{fontSize:Math.max(12,Math.min(72,c.fontSize+l))}):null);return}if(!o)return;s.preventDefault();let a=n.find(l=>l.id===o);if(a&&a.type==="text"&&!a.linkedSelector){let l=a.fontSize||12,c=s.deltaY>0?-2:2;r({type:"UPDATE_TEXT_SIZE",payload:{id:o,fontSize:l+c}})}};return window.addEventListener("wheel",i,{passive:!1}),()=>{window.removeEventListener("wheel",i)}},[o,t,n,r,e])}import{useCallback as ba,useEffect as Xo,useRef as xa,useState as no}from"react";import{Fragment as Rn,jsx as Rt,jsxs as ze}from"react/jsx-runtime";var oo=22,An=12,va=3,Sa=250,ci=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],wa=3e3,di=["planning","strategizing","scheming","mapping","scoping","drafting","outlining","architecting"];function ui(i){var s=i,{left:t,top:e,style:o,children:n}=s,r=Wn(s,["left","top","style","children"]);return Rt("div",b(h({"data-devtools":"badge-hit-area"},r),{style:h({position:"fixed",left:`max(0px, ${t}px)`,top:`max(0px, ${e}px)`,padding:An,transform:`translate(min(0px, calc(100vw - max(0px, ${t}px) - 100%)), min(0px, calc(100vh - max(0px, ${e}px) - 100%)))`},o),children:n}))}function ka({annotations:t,supersededAnnotations:e,inFlightIds:o,scrollX:n,scrollY:r,annotationGroupMap:i,onViewThread:s,onSelectAnnotation:a}){var m,x;let[l,c]=no(0),[d,p]=no(()=>Math.floor(Math.random()*ci.length)),u=!!(o&&o.size>0);Xo(()=>{if(!u)return;let y=setInterval(()=>{c(C=>(C+1)%va)},Sa),P=setInterval(()=>{p(C=>(C+1)%ci.length)},wa);return()=>{clearInterval(y),clearInterval(P)}},[u]);let g=[];for(let y of t){if(y.type!=="text"||!y.text||!y.points[0]||e.has(y))continue;let P=y.groupId?t.filter(mt=>mt.groupId===y.groupId):[y],C=!!(o&&(o.has(y.id)||P.some(mt=>o.has(mt.id)))),M=(m=y.status)!=null?m:"pending",T=P.some(mt=>mt.status==="resolved"||mt.status==="needs_review"),H=P.some(mt=>mt.threadId);if(!C&&M!=="resolved"&&M!=="needs_review"&&!T&&!H)continue;let L=y.threadId||((x=P.find(mt=>mt.threadId))==null?void 0:x.threadId),_=M==="needs_review"||P.some(mt=>mt.status==="needs_review"),q=P.reduce((mt,se)=>{var Q;return mt+((Q=se.replyCount)!=null?Q:0)},0)||1,et=y.points[0],B=y.fontSize||12,U=B*1.4,tt=y.text.split(`
|
|
5
|
+
`),kt=i.get(y.id),at=kt!==void 0?[kt+". "+(tt[0]||""),...tt.slice(1)]:tt,Et=document.createElement("canvas").getContext("2d");if(!Et)continue;Et.font=`${B}px ${Ce}`;let Dt=et.x-n,Ft=eo(Dt),G=Ft!==void 0?Math.min(400,Ft):400,_t=jn(Et,at,G),St=Math.min(G,Math.max(..._t.map(mt=>Et.measureText(mt).width))),Vt=_t.length*U,qt=at.length*U,Ot=Vt-qt;g.push({id:y.id,threadId:L,x:et.x+St+4,y:et.y-4-Ot,size:Vt+8,color:y.color,isInFlight:C,isNeedsReview:_,replyCount:q})}if(g.length===0)return null;let f=!!s;return Rt(Rn,{children:g.map(y=>Rt(ui,{left:y.x-n-An,top:y.y-r-An,onClick:f&&y.threadId?()=>{a==null||a(y.id),s(y.threadId)}:void 0,style:{pointerEvents:f?"auto":"none",cursor:f&&y.threadId?"pointer":void 0,zIndex:9999},children:Rt("div",{"data-devtools":"annotation-badge",style:{height:y.size,display:"flex",alignItems:"center",backgroundColor:y.color,fontFamily:Ce,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:y.isInFlight?ze(Rn,{children:[Rt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:l===1?ze(Rn,{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"})]}):ze(Rn,{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:ci[d]})]}):ze(Rn,{children:[y.isNeedsReview?Rt("span",{style:{fontWeight:700},children:"?"}):ze("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"})]}),ze("span",{style:{opacity:.7},children:[y.replyCount," ",y.replyCount===1?"reply":"replies"]})]})})},y.id))})}function Ea({annotations:t,supersededAnnotations:e,scrollX:o,scrollY:n,annotationGroupMap:r,planThreadId:i,taskCount:s,planStatus:a,onViewThread:l,onSelectAnnotation:c}){var u;let d=[];for(let g of t){if(g.type!=="text"||!g.text||!g.points[0]||e.has(g))continue;let f=(u=g.status)!=null?u:"pending",m=g.groupId?t.filter(Ft=>Ft.groupId===g.groupId):[g],x=m.some(Ft=>Ft.threadId===i),y=!x&&!g.planId&&(f==="in_flight"||f==="pending"||g.captured)&&!m.some(Ft=>Ft.status==="resolved"||Ft.status==="needs_review");if(!x&&!y||f==="resolved"||f==="needs_review")continue;let P=g.points[0],C=g.fontSize||12,M=C*1.4,T=g.text.split(`
|
|
6
|
+
`),H=r.get(g.id),L=H!==void 0?[H+". "+(T[0]||""),...T.slice(1)]:T,q=document.createElement("canvas").getContext("2d");if(!q)continue;q.font=`${C}px ${Ce}`;let et=P.x-o,B=eo(et),U=B!==void 0?Math.min(400,B):400,tt=jn(q,L,U),kt=Math.min(U,Math.max(...tt.map(Ft=>q.measureText(Ft).width))),at=tt.length*M,Nt=L.length*M,Et=at-Nt,Dt=at+8;d.push({annotation:g,x:P.x+kt+4,y:P.y-4-Et,size:Dt,groupNumber:H})}if(d.length===0)return null;let p=a==="planning";return Rt(Rn,{children:d.map(({annotation:g,x:f,y:m,size:x})=>p?Rt(gd,{x:f-o,y:m-n,size:x,color:g.color,onClick:()=>{c==null||c(g.id),l(i)}},`plan-thinking-${g.id}`):Rt(ui,{left:f-o-An,top:m-n-An,onClick:()=>{c==null||c(g.id),l(i)},style:{cursor:"pointer",zIndex:9999,pointerEvents:"auto"},children:ze("div",{"data-devtools":"plan-waiting-badge",style:{height:x,display:"flex",alignItems:"center",backgroundColor:g.color,fontFamily:Ce,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:[ze("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"})]}),ze("span",{style:{opacity:.7},children:[s," task",s!==1?"s":""," \u2014 approve?"]})]})},`plan-waiting-${g.id}`))})}function gd({x:t,y:e,size:o,color:n,onClick:r}){let[i,s]=no(0),[a,l]=no(()=>Math.floor(Math.random()*di.length));return Xo(()=>{let c=setInterval(()=>{s(p=>(p+1)%va)},Sa),d=setInterval(()=>{l(p=>(p+1)%di.length)},wa);return()=>{clearInterval(c),clearInterval(d)}},[]),Rt(ui,{left:t-An,top:e-An,onClick:r,style:{pointerEvents:r?"auto":"none",cursor:r?"pointer":void 0,zIndex:9999},children:ze("div",{"data-devtools":"plan-thinking-badge",style:{height:o,display:"flex",alignItems:"center",backgroundColor:n,fontFamily:Ce,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:i===1?ze(Rn,{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"})]}):ze(Rn,{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:di[a]})]})})}function pi({inFlightSelectorColors:t,animated:e=!0}){let[o,n]=no([]);if(Xo(()=>{if(t.size===0){n([]);return}let i=null,s=()=>{let c=[];for(let[d,p]of t){let u=Ke(d);if(!u)continue;let g=u.getBoundingClientRect();c.push({selector:d,top:g.top,left:g.left,width:g.width,height:g.height,color:p})}n(c)},a=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(s)};s(),window.addEventListener("scroll",a,!0),window.addEventListener("resize",a,!0);let l=new MutationObserver(a);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",a,!0),window.removeEventListener("resize",a,!0),l.disconnect(),i&&cancelAnimationFrame(i)}},[t]),o.length===0)return null;let r={position:"absolute",width:2,height:2,pointerEvents:"none"};return ze(Rn,{children:[e&&Rt("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),o.map(i=>ze("div",{"data-devtools":"marching-ants",style:{position:"fixed",top:i.top,left:i.left,width:i.width,height:i.height,pointerEvents:"none",zIndex:9995,overflow:"visible"},children:[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,i.width-1),height:Math.max(0,i.height-1),fill:"none",stroke:i.color,strokeWidth:"1",strokeDasharray:"2 4",style:e?{animation:"popmelt-march 0.5s steps(2) infinite"}:void 0})}),Rt("div",{style:b(h({},r),{top:-1,left:-1,backgroundColor:i.color})}),Rt("div",{style:b(h({},r),{top:-1,right:-1,backgroundColor:i.color})}),Rt("div",{style:b(h({},r),{bottom:-1,left:-1,backgroundColor:i.color})}),Rt("div",{style:b(h({},r),{bottom:-1,right:-1,backgroundColor:i.color})})]},i.selector))]})}function Ca({annotations:t,supersededAnnotations:e,scrollX:o,scrollY:n,onReply:r,annotationGroupMap:i}){let s=t.filter(c=>e.has(c)?!1:c.status==="waiting_input"&&c.question&&c.threadId);if(s.length===0)return null;let a=new Set,l=[];for(let c of s){if(!c.threadId||a.has(c.threadId))continue;a.add(c.threadId);let d=c.type==="text"?c:t.find(p=>p.groupId&&p.groupId===c.groupId&&p.type==="text")||c;if(d.type==="text"&&d.text&&d.points[0]){let p=d.points[0],u=d.fontSize||12,g=u*1.4,f=d.text.split(`
|
|
7
|
+
`),m=i.get(d.id),x=m!==void 0?[m+". "+(f[0]||""),...f.slice(1)]:f,P=document.createElement("canvas").getContext("2d");if(!P)continue;P.font=`${u}px ${Ce}`;let C=p.x-o,M=eo(C),T=M!==void 0?Math.min(400,M):400,H=jn(P,x,T),L=Math.min(T,Math.max(...H.map(U=>P.measureText(U).width))),_=H.length*g,q=x.length*g,et=_-q,B=_+8;l.push({annotation:c,x:p.x+L+4,y:p.y-4-et,size:B})}}return l.length===0?null:Rt(Rn,{children:l.map(({annotation:c,x:d,y:p,size:u})=>Rt(md,{annotation:c,x:d-o,y:p-n,size:u,onReply:r},`question-${c.threadId}`))})}function md({annotation:t,x:e,y:o,size:n,onReply:r}){let[i,s]=no(!1),[a,l]=no(""),c=xa(null),d=xa(null);Xo(()=>{i&&c.current&&c.current.focus()},[i]),Xo(()=>{if(!i)return;let m=y=>{d.current&&!d.current.contains(y.target)&&s(!1)},x=y=>{y.key==="Escape"&&s(!1)};return document.addEventListener("mousedown",m),document.addEventListener("keydown",x),()=>{document.removeEventListener("mousedown",m),document.removeEventListener("keydown",x)}},[i]);let p=ba(()=>{!a.trim()||!t.threadId||(r(t.threadId,a.trim()),l(""),s(!1))},[a,t.threadId,r]),u=ba(m=>{m.key==="Enter"&&(m.metaKey||m.ctrlKey)&&(m.preventDefault(),p())},[p]),g=i?e:e-An,f=i?o:o-An;return ze("div",{ref:d,"data-devtools":"question-badge",style:{position:"fixed",left:`max(0px, ${g}px)`,top:`max(0px, ${f}px)`,padding:i?0:An,transform:`translate(min(0px, calc(100vw - max(0px, ${g}px) - 100%)), min(0px, calc(100vh - max(0px, ${f}px) - 100%)))`,zIndex:i?10002:9999,pointerEvents:"auto",cursor:i?void 0:"pointer"},children:[!i&&ze("div",{onClick:()=>s(!0),style:{height:n,display:"flex",alignItems:"center",backgroundColor:t.color,padding:`0 ${4}px`,gap:4,fontFamily:Ce,fontSize:12,color:"#ffffff",whiteSpace:"nowrap"},children:[ze("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?"})]}),i&&ze("div",{style:{minWidth:260,maxWidth:360,backgroundColor:"#ffffff",fontFamily:Ce,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}),ze("div",{style:{padding:`0 ${4}px ${4}px`},children:[Rt("textarea",{ref:c,value:a,onChange:m=>l(m.target.value),onKeyDown:u,placeholder:"Type your reply...",style:{width:"100%",minHeight:40,padding:4,fontSize:12,fontFamily:Ce,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:p,disabled:!a.trim(),style:{padding:"4px 12px",fontSize:11,fontFamily:Ce,fontWeight:600,backgroundColor:a.trim()?t.color:"rgba(0,0,0,0.1)",color:a.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:a.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}function vr(t){var i;let e=new Set,o=new Map;for(let s of t){if(!s.linkedSelector)continue;let a=o.get(s.linkedSelector)||[];a.push(s),o.set(s.linkedSelector,a)}let n=new Set,r=new Set;for(let s of o.values()){if(s.length<=1){(i=s[0])!=null&&i.groupId&&r.add(s[0].groupId);continue}s.sort((l,c)=>c.timestamp-l.timestamp);let a=s[0];a.groupId&&r.add(a.groupId);for(let l=1;l<s.length;l++){let c=s[l];e.add(c),c.groupId&&n.add(c.groupId)}}for(let s of t)s.groupId&&n.has(s.groupId)&&!r.has(s.groupId)&&e.add(s);return e}import{useEffect as Ta,useLayoutEffect as hd,useState as Ia}from"react";import{jsx as fi,jsxs as La}from"react/jsx-runtime";function yd(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 Ma=["top-left","top-right","bottom-right","bottom-left"];function Ra({element:t,radius:e,accentColor:o,hoveredCorner:n,draggingCorner:r,cursorViewport:i}){let[s,a]=Ia(null),[l,c]=Ia(!1);if(Ta(()=>{let y=M=>{(M.key==="Meta"||M.key==="Control")&&c(!0)},P=M=>{(M.key==="Meta"||M.key==="Control")&&c(!1)},C=()=>c(!1);return window.addEventListener("keydown",y,!0),window.addEventListener("keyup",P,!0),window.addEventListener("blur",C),()=>{window.removeEventListener("keydown",y,!0),window.removeEventListener("keyup",P,!0),window.removeEventListener("blur",C)}},[]),Ta(()=>{if(!t){a(null);return}let y=()=>{a(t.getBoundingClientRect())};return y(),window.addEventListener("scroll",y,{passive:!0}),window.addEventListener("resize",y,{passive:!0}),()=>{window.removeEventListener("scroll",y),window.removeEventListener("resize",y)}},[t]),hd(()=>{t&&a(t.getBoundingClientRect())},[t,e["top-left"],e["top-right"],e["bottom-right"],e["bottom-left"]]),!s)return null;let d=s.width,p=s.height,u=yd(o,.2),g={"top-left":{x:0,y:e["top-left"]},"top-right":{x:d,y:e["top-right"]},"bottom-right":{x:d,y:p-e["bottom-right"]},"bottom-left":{x:0,y:p-e["bottom-left"]}},f=new Set,m=r!=null?r:n;if(m)if(l)f.add(m);else for(let y of Ma)f.add(y);let x={position:"fixed",top:s.top,left:s.left,width:d,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"};return La("div",{"data-devtools":"border-radius-handles",style:x,children:[La("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${p}`,children:[fi("rect",{x:"0.5",y:"0.5",width:Math.max(0,d-1),height:Math.max(0,p-1),fill:"none",stroke:u,strokeWidth:"1"}),Ma.map(y=>{let P=g[y],C=f.has(y);return fi("circle",{cx:P.x,cy:P.y,r:y===(r!=null?r:n)?3:2.5,fill:o,stroke:"#ffffff",strokeWidth:y===(r!=null?r:n)?4:2,paintOrder:"stroke"},y)})]}),i&&m&&(()=>{let y=Math.round(e[m]);return fi("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:y})})()]})}import{useEffect as bd,useState as xd}from"react";function ro(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);if(o)return`oklch(${o[1]} / ${e})`;let n=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t);if(n){let r=parseInt(n[1],16),i=parseInt(n[2],16),s=parseInt(n[3],16);return`rgba(${r}, ${i}, ${s}, ${e})`}return`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}import{Fragment as vd,jsx as io,jsxs as Uo}from"react/jsx-runtime";function To({element:t,isSelected:e=!1,elementInfo:o,color:n="#3b82f6",annotationNumber:r,changeCount:i,hideTooltip:s=!1}){let[a,l]=xd(null);if(bd(()=>{if(!t){l(null);return}let H=()=>{let L=t.getBoundingClientRect();l(L)};return H(),window.addEventListener("scroll",H,{passive:!0}),window.addEventListener("resize",H,{passive:!0}),()=>{window.removeEventListener("scroll",H),window.removeEventListener("resize",H)}},[t]),!a||!t)return null;let c={position:"fixed",top:a.top,left:a.left,width:a.width,height:a.height,pointerEvents:"none",zIndex:9996,backgroundColor:e?ro(n,.1):ro(n,.05),overflow:"visible"},d={position:"absolute",width:2,height:2,backgroundColor:n,pointerEvents:"none"},p=t.tagName.toLowerCase(),u=t.id?`#${t.id}`:"",g=t.classList.length>0?"."+Array.from(t.classList).slice(0,2).join("."):"",f=o==null?void 0:o.reactComponent,m=f?`<${f}> ${p}${u}${g}`:`${p}${u}${g}`,x=22,y=a.height>=window.innerHeight,P=y?0:a.top>=x?a.top-x:a.bottom,C=y?{position:"absolute",top:8,left:8,zIndex:9997,display:"flex",alignItems:"center",gap:6,backgroundColor:n,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400}:{position:"fixed",top:P,left:a.left,zIndex:9997,display:"flex",alignItems:"center",gap:6,backgroundColor:n,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400},T=!s&&Uo("div",{"data-devtools":"tooltip",style:C,children:[r!==void 0&&Uo("span",{children:[r,"."]}),io("span",{style:{overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0},children:m}),i!==void 0&&i>0&&Uo("span",{style:{opacity:.8},children:["(",i," ",i===1?"change":"changes",")"]})]});return Uo(vd,{children:[Uo("div",{"data-devtools":"highlight",style:c,children:[io("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:io("rect",h({x:"0.5",y:"0.5",width:Math.max(0,a.width-1),height:Math.max(0,a.height-1),fill:"none",stroke:n,strokeWidth:"1"},!e&&{strokeDasharray:"2 4"}))}),io("div",{style:b(h({},d),{top:-1,left:-1})}),io("div",{style:b(h({},d),{top:-1,right:-1})}),io("div",{style:b(h({},d),{bottom:-1,left:-1})}),io("div",{style:b(h({},d),{bottom:-1,right:-1})}),y&&T]}),!y&&T]})}import{useEffect as Aa,useLayoutEffect as Sd,useState as gi}from"react";import{jsx as Nn,jsxs as hi}from"react/jsx-runtime";function mi(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 yi({element:t,gap:e,accentColor:o,hoveredAxis:n,draggingAxis:r,cursorViewport:i,isAutoGap:s=!1,refreshKey:a=0}){let[l,c]=gi(null),[d,p]=gi([]),[u,g]=gi(!1);if(Aa(()=>{let _=B=>{(B.key==="Meta"||B.key==="Control")&&g(!0)},q=B=>{(B.key==="Meta"||B.key==="Control")&&g(!1)},et=()=>g(!1);return window.addEventListener("keydown",_,!0),window.addEventListener("keyup",q,!0),window.addEventListener("blur",et),()=>{window.removeEventListener("keydown",_,!0),window.removeEventListener("keyup",q,!0),window.removeEventListener("blur",et)}},[]),Aa(()=>{if(!t){c(null),p([]);return}let _=()=>{c(t.getBoundingClientRect()),p(Qn(t))};return _(),window.addEventListener("scroll",_,{passive:!0}),window.addEventListener("resize",_,{passive:!0}),()=>{window.removeEventListener("scroll",_),window.removeEventListener("resize",_)}},[t]),Sd(()=>{t&&(c(t.getBoundingClientRect()),p(Qn(t)))},[t,e.row,e.column,a]),!l||d.length===0)return null;let f=l.width,m=l.height,x="pm-gap-stripe-pattern",y=mi(o,.25),P=mi(o,.1),C=mi(o,.2),M=8,T=2,H={position:"fixed",top:l.top,left:l.left,width:f,height:m,pointerEvents:"none",zIndex:9996,overflow:"visible"},L=r!=null?r:n;return hi("div",{"data-devtools":"gap-handles",style:H,children:[hi("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${f} ${m}`,children:[Nn("defs",{children:Nn("pattern",{id:x,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Nn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:y,strokeWidth:"1.5"})})}),Nn("rect",{x:"0.5",y:"0.5",width:Math.max(0,f-1),height:Math.max(0,m-1),fill:"none",stroke:C,strokeWidth:"1"}),d.map((_,q)=>{let et=_.x-l.left,B=_.y-l.top,U=_.w,tt=_.h,kt=u?_.axis===L:!0;return(_.axis==="row"?e.row:e.column)===0?null:hi("g",{opacity:kt?1:.6,children:[Nn("rect",{x:et,y:B,width:U,height:tt,fill:P}),Nn("rect",{x:et,y:B,width:U,height:tt,fill:`url(#${x})`})]},q)}),L&&(()=>{let _=d.filter(_t=>_t.axis===L);if(_.length===0)return null;let q=_[0];if(i&&_.length>1){let _t=1/0;for(let St of _){let Vt=St.x+St.w/2,qt=St.y+St.h/2,Ot=Math.abs(i.x-Vt)+Math.abs(i.y-qt);Ot<_t&&(_t=Ot,q=St)}}let et=q.x-l.left,B=q.y-l.top,U=q.w,tt=q.h,kt=et+U/2,at=B+tt/2;if(s)return Nn("circle",{cx:kt,cy:at,r:1.5,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let Nt=L==="column",Et=Nt?T:M,Dt=Nt?M:T,Ft=kt-Et/2,G=at-Dt/2;return Nn("rect",{x:Ft,y:G,width:Et,height:Dt,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),i&&L&&(()=>{let _=s?"auto":String(Math.round(L==="row"?e.row:e.column));return Nn("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:_})})()]})}import{useCallback as Td,useEffect as Id,useState as Md}from"react";import{useEffect as wd,useState as Pa}from"react";var kd=3,Ed=250,bi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Cd=3e3;function Sr(t){let[e,o]=Pa(0),[n,r]=Pa(()=>Math.floor(Math.random()*bi.length));return wd(()=>{if(!t)return;let i=setInterval(()=>o(a=>(a+1)%kd),Ed),s=setInterval(()=>r(a=>(a+1)%bi.length),Cd);return()=>{clearInterval(i),clearInterval(s)}},[t]),{charIndex:e,word:bi[n]}}import{Fragment as xi,jsx as bn,jsxs as Io}from"react/jsx-runtime";function Ld(t){let{element:e}=t,o=e.tagName,n=e.id?`#${e.id}`:"",r=e.className?"."+e.className.split(" ").slice(0,2).join("."):"",i=e.reactComponent;return i?`<${i}> ${o}${n}${r}`:`${o}${n}${r}`}var Ba=22,vi=12;function Rd(i){var s=i,{left:t,top:e,style:o,children:n}=s,r=Wn(s,["left","top","style","children"]);return bn("div",b(h({"data-devtools":"badge-hit-area"},r),{style:h({position:"fixed",left:`max(0px, ${t}px)`,top:`max(0px, ${e}px)`,padding:vi,transform:`translate(min(0px, calc(100vw - max(0px, ${t}px) - 100%)), min(0px, calc(100vh - max(0px, ${e}px) - 100%)))`},o),children:n}))}function Oa({styleModifications:t,isInspecting:e,accentColor:o,annotationGroupCount:n,dispatch:r,inFlightSelectors:i}){let[s,a]=Md([]),l=i&&i.size>0,{charIndex:c,word:d}=Sr(!!l);Id(()=>{if(e){a([]);return}let f=null,m=()=>{let P=[];t.forEach((C,M)=>{let T=Ke(C.selector);if(!T)return;let H=T.getBoundingClientRect();P.push({selector:C.selector,modIndex:M,top:H.top>=Ba?H.top-Ba:H.bottom,left:H.left,label:Ld(C),changeCount:C.changes.length,annotationNumber:n+M+1})}),a(P)},x=()=>{f&&cancelAnimationFrame(f),f=requestAnimationFrame(m)};m(),window.addEventListener("scroll",x,!0),window.addEventListener("resize",x,!0);let y=new MutationObserver(x);return y.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),window.addEventListener("load",x),document.fonts.ready.then(x),()=>{window.removeEventListener("scroll",x,!0),window.removeEventListener("resize",x,!0),window.removeEventListener("load",x),y.disconnect(),f&&cancelAnimationFrame(f)}},[t,e,n]);let p=Td(f=>{let m=t[f];if(!m)return;let x=Ke(m.selector);x&&(r({type:"SELECT_ANNOTATION",payload:{id:null}}),r({type:"SET_TOOL",payload:"inspector"}),r({type:"SELECT_ELEMENT",payload:{el:x,info:m.element}}))},[t,r]);if(s.length===0)return null;let u={display:"flex",alignItems:"center",gap:6,backgroundColor:o,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,whiteSpace:"nowrap",maxWidth:400},g={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return bn(xi,{children:s.map(f=>{let m=i==null?void 0:i.has(f.selector);return bn(Rd,{left:f.left-vi,top:f.top-vi,onClick:()=>p(f.modIndex),style:{zIndex:1e4,cursor:"pointer",pointerEvents:"auto"},children:Io("div",{"data-devtools":"badge",style:b(h({},u),{backgroundColor:m?"#999999":o}),children:[Io("span",{children:[f.annotationNumber,"."]}),bn("span",{style:g,children:f.label}),Io("span",{style:{opacity:.8},children:["(",f.changeCount," ",f.changeCount===1?"change":"changes",")"]}),m&&Io("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[bn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?Io(xi,{children:[bn("circle",{cx:"7",cy:"7",r:"2"}),bn("circle",{cx:"17",cy:"7",r:"2"}),bn("circle",{cx:"7",cy:"17",r:"2"}),bn("circle",{cx:"17",cy:"17",r:"2"})]}):Io(xi,{children:[bn("circle",{cx:"12",cy:"6",r:"2"}),bn("circle",{cx:"6",cy:"12",r:"2"}),bn("circle",{cx:"18",cy:"12",r:"2"}),bn("circle",{cx:"12",cy:"18",r:"2"})]})}),d]})]})},f.selector)})})}import{useEffect as Ad,useState as Pd}from"react";import{Fragment as Od,jsx as Da}from"react/jsx-runtime";function Bd(t,e){let o=t.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${e})`:`color-mix(in srgb, ${t} ${Math.round(e*100)}%, transparent)`}function Na({styleModifications:t,accentColor:e}){let[o,n]=Pd([]);if(Ad(()=>{let i=null,s=()=>{let c=[];for(let d of t){let p=Ke(d.selector);if(!p)continue;let u=p.getBoundingClientRect();if(u.width===0&&u.height===0)continue;let g=to(p);c.push({selector:d.selector,top:u.top,left:u.left,width:u.width,height:u.height,borderRadius:`${g["top-left"]}px ${g["top-right"]}px ${g["bottom-right"]}px ${g["bottom-left"]}px`})}n(c)},a=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(s)};s(),window.addEventListener("scroll",a,{passive:!0}),window.addEventListener("resize",a,{passive:!0});let l=new MutationObserver(a);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",a),window.removeEventListener("resize",a),l.disconnect(),i&&cancelAnimationFrame(i)}},[t]),o.length===0)return null;let r=Bd(e,.2);return Da(Od,{children:o.map(i=>{let s={position:"fixed",top:i.top,left:i.left,width:i.width,height:i.height,pointerEvents:"none",zIndex:9995,border:`1px solid ${r}`,borderRadius:i.borderRadius,boxSizing:"border-box"};return Da("div",{"data-devtools":"mod-border",style:s},i.selector)})})}import{useEffect as Fa,useLayoutEffect as Dd,useState as Ha}from"react";import{jsx as Jn,jsxs as wi}from"react/jsx-runtime";function Si(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 Nd={top:"bottom",bottom:"top",left:"right",right:"left"};function ki({element:t,padding:e,accentColor:o,hoveredSide:n,draggingSide:r,cursorViewport:i,refreshKey:s}){let[a,l]=Ha(null),[c,d]=Ha(!1);if(Fa(()=>{let U=at=>{(at.key==="Meta"||at.key==="Control")&&d(!0)},tt=at=>{(at.key==="Meta"||at.key==="Control")&&d(!1)},kt=()=>d(!1);return window.addEventListener("keydown",U,!0),window.addEventListener("keyup",tt,!0),window.addEventListener("blur",kt),()=>{window.removeEventListener("keydown",U,!0),window.removeEventListener("keyup",tt,!0),window.removeEventListener("blur",kt)}},[]),Fa(()=>{if(!t){l(null);return}let U=()=>{l(t.getBoundingClientRect())};return U(),window.addEventListener("scroll",U,{passive:!0}),window.addEventListener("resize",U,{passive:!0}),()=>{window.removeEventListener("scroll",U),window.removeEventListener("resize",U)}},[t]),Dd(()=>{t&&l(t.getBoundingClientRect())},[t,e.top,e.right,e.bottom,e.left,s]),!a)return null;let p=a.width,u=a.height,{top:g,right:f,bottom:m,left:x}=e,y="pm-stripe-pattern",P=Si(o,.25),C=Si(o,.1),M=Si(o,.2),T=8,H=2,L={position:"fixed",top:a.top,left:a.left,width:p,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"},_=["top","right","bottom","left"],q={top:`0,0 ${p},0 ${p-f},${g} ${x},${g}`,right:`${p},0 ${p},${u} ${p-f},${u-m} ${p-f},${g}`,bottom:`0,${u} ${x},${u-m} ${p-f},${u-m} ${p},${u}`,left:`0,0 ${x},${g} ${x},${u-m} 0,${u}`},et={top:{x:p/2-T/2,y:g/2-H/2,w:T,h:H},bottom:{x:p/2-T/2,y:u-m/2-H/2,w:T,h:H},left:{x:x/2-H/2,y:u/2-T/2,w:H,h:T},right:{x:p-f/2-H/2,y:u/2-T/2,w:H,h:T}},B=new Set;return r?B.add(r):n&&(B.add(n),c||B.add(Nd[n])),wi("div",{"data-devtools":"padding-handles",style:L,children:[wi("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${p} ${u}`,children:[Jn("defs",{children:Jn("pattern",{id:y,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Jn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:P,strokeWidth:"1.5"})})}),Jn("rect",{x:"0.5",y:"0.5",width:Math.max(0,p-1),height:Math.max(0,u-1),fill:"none",stroke:M,strokeWidth:"1"}),_.map(U=>{if(e[U]<=0)return null;let kt=B.has(U);return wi("g",{opacity:kt?1:.6,children:[Jn("polygon",{points:q[U],fill:C}),Jn("polygon",{points:q[U],fill:`url(#${y})`})]},U)}),_.map(U=>{let tt=et[U],kt=B.has(U);return Jn("rect",{x:tt.x,y:tt.y,width:tt.w,height:tt.h,fill:o,stroke:"#ffffff",strokeWidth:kt?4:2,paintOrder:"stroke"},`handle-${U}`)})]}),i&&(n||r)&&(()=>{let U=r!=null?r:n,tt=Math.round(e[U]);return Jn("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:tt})})()]})}import{useCallback as Pn,useEffect as wn,useMemo as Mr,useRef as fn,useState as Ge}from"react";import{Check as Ir,ChevronDown as Ai,MoveHorizontal as Ka,RotateCcw as au,Shrink as lu,X as cu}from"lucide-react";var Fd="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",Cn={borderWidth:3,borderStyle:"solid",borderImage:`url("${Fd}") 4 / 1.9 / 0 round`};var wr={"font-size":["rem","px","em"],"line-height":["","rem","px","em"],"letter-spacing":["rem","px","em"],gap:["rem","px","em"],"column-gap":["rem","px","em"],"row-gap":["rem","px","em"],padding:["rem","px","em","%"],margin:["rem","px","em","%"],width:["rem","px","%","em"],height:["rem","px","%","em"],"min-width":["rem","px","%","em"],"max-width":["rem","px","%","em"],"min-height":["rem","px","%","em"],"max-height":["rem","px","%","em"],"border-width":["px","rem","em"],"border-radius":["rem","px","%","em"]};function Mo(t){var e,o;return(o=(e=wr[t])==null?void 0:e[0])!=null?o:"px"}function Vn(t){let e=t.match(/^([\d.-]+)(.*)$/);return e?{num:parseFloat(e[1]),unit:e[2]||""}:{num:0,unit:""}}function kr(t,e,o,n){let r=t.trim();if(!r)return"";let i=r.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i);if(i)return`${parseFloat(i[1])}${i[2].toLowerCase()}`;let s=parseFloat(r);if(!isNaN(s)){if(n){let{unit:a}=Vn(o);return`${s}${a||Mo(e)}`}return`${s}${Mo(e)}`}return r}function Ei(t,e){if(!e||e==="px")return t;if(e==="rem"){let o=parseFloat(getComputedStyle(document.documentElement).fontSize)||16;return Math.round(t/o*1e3)/1e3}return t}import{useCallback as Hd,useEffect as _d,useRef as _a,useState as zd}from"react";import{Plus as za,X as $d}from"lucide-react";import{jsx as pn,jsxs as so}from"react/jsx-runtime";var Er=[{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 Wd(t){if(!t||t==="none")return[];let e=[],o=/([\w-]+)\(([^)]+)\)/g,n;for(;(n=o.exec(t))!==null;){let r=n[1],i=n[2],s=parseFloat(i);isNaN(s)||e.push({name:r,value:s})}return e}function Ci(t){return t.length===0?"none":t.map(e=>{var r;let o=Er.find(i=>i.name===e.name),n=(r=o==null?void 0:o.unit)!=null?r:"";return`${e.name}(${e.value}${n})`}).join(" ")}function $a({value:t,onChange:e,accentColor:o,modified:n,panelContentRef:r}){let i=Wd(t),[s,a]=zd(!1),l=_a(null),c=_a(null);_d(()=>{if(!s)return;let C=M=>{l.current&&!l.current.contains(M.target)&&a(!1)};return document.addEventListener("mousedown",C,!0),()=>document.removeEventListener("mousedown",C,!0)},[s]);let d=Er.filter(C=>!i.some(M=>M.name===C.name)),p=C=>{let M=[...i,{name:C.name,value:C.defaultValue}];e(Ci(M)),a(!1)},u=C=>{let M=i.filter((T,H)=>H!==C);e(Ci(M))},g=(C,M)=>{let T=i.map((H,L)=>L===C?b(h({},H),{value:M}):H);e(Ci(T))},f={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},m=Hd(C=>{var B;if(!c.current)return{position:"fixed",top:0,left:0};let M=c.current.getBoundingClientRect(),T=c.current.closest('[data-devtools="panel"]'),H=T?T.getBoundingClientRect():{top:0,left:0,bottom:9999},L=(B=r==null?void 0:r.current)==null?void 0:B.getBoundingClientRect(),_=C*24+8,et=H.bottom-M.bottom<_;return b(h({position:"fixed"},et?{bottom:H.bottom-M.top+2-H.top}:{top:M.bottom+2-H.top}),{left:L?L.left+4-H.left:M.left-H.left,width:L?L.width-8:140,zIndex:10001})},[r]),x={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)"},y={display:"block",width:"100%",padding:"4px 10px",border:"none",backgroundColor:"transparent",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#334155",cursor:"pointer",textAlign:"left"},P=C=>pn("div",{ref:l,style:h(h({},m(C.length)),x),children:C.map(M=>pn("button",{type:"button",onClick:()=>p(M),style:y,onMouseEnter:T=>{T.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:T=>{T.currentTarget.style.backgroundColor="transparent"},children:M.label},M.name))});return i.length===0?so("div",{children:[so("div",{style:{display:"flex",alignItems:"center",gap:4},children:[pn(Fn,{modified:!1,children:pn("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:b(h({},f),{color:"#999",cursor:"default"})})}),pn("button",{ref:c,type:"button",onClick:()=>a(!s),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,padding:0,border:"none",borderRadius:2,backgroundColor:"transparent",color:"#94a3b8",cursor:"pointer",flexShrink:0},children:pn(za,{size:12})})]}),s&&P(Er)]}):so("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[i.map((C,M)=>{let T=Er.find(H=>H.name===C.name);return T?so("div",{style:{display:"flex",alignItems:"center",gap:4},children:[pn("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:T.label}),pn(Fn,{modified:n,children:so("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[pn("input",{type:"range",min:T.min,max:T.max,step:T.step,value:C.value,onChange:H=>g(M,parseFloat(H.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${o} ${(C.value-T.min)/(T.max-T.min)*100}%, rgba(0,0,0,0.1) ${(C.value-T.min)/(T.max-T.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),pn("input",{type:"number",min:T.min,max:T.max,step:T.step,value:T.unit==="px"||T.unit==="deg"?Math.round(C.value):Math.round(C.value*100)/100,onChange:H=>g(M,parseFloat(H.target.value)||0),style:b(h({},f),{width:44,padding:"2px 4px",textAlign:"right",flexShrink:0})}),T.unit&&pn("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:T.unit})]})}),pn("button",{type:"button",onClick:()=>u(M),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:pn($d,{size:10})})]},C.name):null}),d.length>0&&so("div",{children:[so("button",{ref:c,type:"button",onClick:()=>a(!s),style:{display:"flex",alignItems:"center",gap:4,padding:"2px 4px",border:"none",borderRadius:2,backgroundColor:"transparent",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#94a3b8",cursor:"pointer"},children:[pn(za,{size:10}),"Add filter"]}),s&&P(d)]})]})}import{useCallback as Ro,useEffect as Jd,useRef as Cr,useState as Wa}from"react";import{AlignHorizontalSpaceAround as Vd,AlignVerticalSpaceAround as Xd,Columns3 as Ud,Grid2x2 as Kd,RectangleHorizontal as Zd,Rows3 as qd,UnfoldHorizontal as Ya,UnfoldVertical as ja}from"lucide-react";import{useCallback as Yd,useEffect as jd,useRef as Ko}from"react";import{jsx as Gd}from"react/jsx-runtime";var Ti=[0,1,2,4,8,12,16,20,24,28,32];function Lo({value:t,onChange:e,onPreview:o,onScrubEnd:n,onReset:r,isModified:i,accentColor:s,defaultUnit:a="rem",snapSteps:l,color:c,style:d,children:p}){let u=Ko(null),g=Ko(null),f=Ko(r),m=Ko(i),x=Ko(!1);f.current=r,m.current=i,jd(()=>{let P=M=>{let T=g.current;if(!T)return;T.hasMoved=!0,x.current=M.shiftKey;let H=T.unit==="rem"||T.unit==="em"?.1:1;T.accum+=M.movementX*H;let L=Math.max(0,Math.round((T.startValue+T.accum)*10)/10);if(M.shiftKey&&l){let _=T.unit==="rem"||T.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,q=T.unit==="rem"||T.unit==="em"?L*_:L,et=l[l.length-1];for(let B=0;B<l.length-1;B++){let U=l[B],tt=l[B+1];if(q<=(U+tt)/2){et=U;break}if(q<tt){et=tt;break}}q>l[l.length-1]&&(et=Math.round(q/8)*8),L=T.unit==="rem"||T.unit==="em"?Math.round(et/_*1e3)/1e3:et}o==null||o(`${L}${T.unit}`)},C=()=>{let M=g.current;if(!M)return;let T=Math.max(0,Math.round((M.startValue+M.accum)*10)/10);if(x.current&&l){let L=M.unit==="rem"||M.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,_=M.unit==="rem"||M.unit==="em"?T*L:T,q=l[l.length-1];for(let et=0;et<l.length-1;et++){let B=l[et],U=l[et+1];if(_<=(B+U)/2){q=B;break}if(_<U){q=U;break}}_>l[l.length-1]&&(q=Math.round(_/8)*8),T=M.unit==="rem"||M.unit==="em"?Math.round(q/L*1e3)/1e3:q}let H=M.hasMoved&&T!==M.startValue;g.current=null,document.exitPointerLock(),H?e(`${T}${M.unit}`):M.hasMoved?o==null||o(`${M.startValue}${M.unit}`):m.current&&f.current&&f.current(),n==null||n()};return document.addEventListener("mousemove",P),document.addEventListener("mouseup",C),()=>{document.removeEventListener("mousemove",P),document.removeEventListener("mouseup",C)}},[e,o,n]);let y=Yd(P=>{var T;if(P.button!==0)return;P.preventDefault();let C=Vn(t),M=C.unit&&C.unit!=="px"?C.unit:a;g.current={startValue:C.num,unit:M,accum:0,hasMoved:!1},(T=u.current)==null||T.requestPointerLock()},[t,a]);return Gd("span",{ref:u,onMouseDown:y,title:i?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:h({color:i?s||"#3b82f6":c||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize"},d),children:p})}import{Fragment as Ii,jsx as Mt,jsxs as $e}from"react/jsx-runtime";function Qd({gridCols:t,gridRows:e,gridModified:o,accentColor:n,onColsChange:r,onRowsChange:i}){return Mt(xn,{style:{width:100},children:$e("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[Mt("input",{type:"number",min:1,max:12,value:t,onChange:s=>r(parseInt(s.target.value)||1),style:b(h({},je),{width:32,textAlign:"center",padding:2})}),Mt("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"}),Mt("input",{type:"number",min:1,max:12,value:e,onChange:s=>i(parseInt(s.target.value)||1),style:b(h({},je),{width:32,textAlign:"center",padding:2})})]})})}function Ga({element:t,getValue:e,getOriginalValue:o,handleChange:n,isModified:r,onResetProperty:i,isCollapsed:s,onToggle:a,sectionHeaderStyle:l,activeDropdown:c,onDropdownChange:d,panelContentRef:p,accentColor:u,onFieldHover:g,preferredUnit:f,onUnitCycle:m}){let x=d,y=e("display"),P=e("flex-direction"),C=Ja(y,P),M=y==="flex"||y==="inline-flex",T=y==="grid",H=M||T,L=e("width"),_=e("height"),q=r("width")?L:pr(t,"width"),et=r("height")?_:pr(t,"height"),B=Mi(L,q),U=Mi(_,et),tt=e("min-width"),kt=e("max-width"),at=e("min-height"),Nt=e("max-height"),Et=Ao(e("padding")),Dt=e("gap"),Ft=e("row-gap"),G=e("column-gap"),_t=e("grid-template-columns"),St=e("grid-template-rows"),Vt=e("overflow"),qt=_t.split(/\s+/).filter(j=>j&&j!=="none").length||1,Ot=St.split(/\s+/).filter(j=>j&&j!=="none").length||1,[mt,se]=Wa(!1),Q=c!==null,yt=Q||mt,K=Q?.3:mt?.65:1,Lt=({mode:j,icon:Ht,active:Wt})=>Mt("button",{type:"button",onClick:()=>Va(j,n),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:Wt?ro(u,.15):"transparent",color:Wt?u:"#64748b",cursor:"pointer",fontSize:14},children:Ht}),ee=(j,Ht,Wt)=>{Wt==="fixed"?n(j,Ht):n(j,Tr(Wt,Ht))},E=j=>{let Ht=Ao(e("padding")),Wt=j||"0";n("padding",`${Ht.top} ${Wt} ${Ht.bottom} ${Wt}`)},nt=j=>{let Ht=Ao(e("padding")),Wt=j||"0";n("padding",`${Wt} ${Ht.right} ${Wt} ${Ht.left}`)},[it,At]=Wa({}),bt=Ro((j,Ht)=>Wt=>{Ht(Wt),At(gn=>b(h({},gn),{[j]:Wt}))},[]),Ct=Ro(j=>{At(Ht=>{let Wt=h({},Ht);return delete Wt[j],Wt})},[]),ht=Ro(j=>{let Ht=Ao(e("padding"));Jt(t,"padding",`${Ht.top} ${j} ${Ht.bottom} ${j}`)},[t,e]),Xt=Ro(j=>{let Ht=Ao(e("padding"));Jt(t,"padding",`${j} ${Ht.right} ${j} ${Ht.left}`)},[t,e]),oe=Ro(j=>Ht=>{Jt(t,j,Ht)},[t]),be=P==="column"||P==="column-reverse",ae=j=>j==="center"?1:j==="flex-end"||j==="end"?2:0,Ne=ae(e("justify-content")),re=ae(e("align-items")),Fe=be?re:Ne,$t=be?Ne:re,Sn=Cr(null),Ie=Cr({x:0,y:0}),Ae=Cr({col:Fe,row:$t});Ae.current={col:Fe,row:$t};let qe=Ro((j,Ht)=>{let Wt=["flex-start","center","flex-end"];be?(n("justify-content",Wt[Ht]),n("align-items",Wt[j])):(n("justify-content",Wt[j]),n("align-items",Wt[Ht]))},[be,n]),rn=Cr(qe);rn.current=qe,Jd(()=>{let Ht=Wt=>{let gn=Sn.current;if(!gn||!gn.contains(Wt.target))return;Wt.preventDefault(),Wt.stopPropagation(),Ie.current.x+=Wt.deltaX,Ie.current.y+=Wt.deltaY;let{col:he,row:fe}=Ae.current,ge=!1;Math.abs(Ie.current.x)>=30&&(he=Math.max(0,Math.min(2,he+(Ie.current.x>0?1:-1))),Ie.current.x=0,Ie.current.y=0,ge=!0),!ge&&Math.abs(Ie.current.y)>=30&&(fe=Math.max(0,Math.min(2,fe+(Ie.current.y>0?1:-1))),Ie.current.x=0,Ie.current.y=0,ge=!0),ge&&(he!==Ae.current.col||fe!==Ae.current.row)&&rn.current(he,fe)};return document.addEventListener("wheel",Ht,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",Ht,{capture:!0})},[]);let sn=()=>Mt("div",{ref:Sn,onMouseEnter:()=>{se(!0),p.current&&(p.current.style.overflowY="hidden")},onMouseLeave:()=>{se(!1),p.current&&(p.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:In,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(Ht=>Mt("button",{type:"button",onClick:()=>qe(Ht,j),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:Ht===Fe&&j===$t?Mt("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:Ht===0?$e(Ii,{children:[Mt("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Mt("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Mt("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]}):Ht===1?$e(Ii,{children:[Mt("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Mt("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Mt("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]}):$e(Ii,{children:[Mt("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Mt("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Mt("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]})}):Mt("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${j}-${Ht}`)))}),an=r("grid-template-columns")||r("grid-template-rows");return $e("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Mt("div",{style:l,children:Mt("span",{children:H?"Auto layout":"Layout"})}),$e("div",{style:{padding:"8px 12px"},children:[$e("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:In,borderRadius:2,padding:2,opacity:K,transition:"opacity 150ms ease"},children:[Mt(Lt,{mode:"block",icon:Mt(Zd,{size:16}),active:C==="block"}),Mt(Lt,{mode:"flex-col",icon:Mt(qd,{size:16}),active:C==="flex-col"}),Mt(Lt,{mode:"flex-row",icon:Mt(Ud,{size:16}),active:C==="flex-row"}),Mt(Lt,{mode:"grid",icon:Mt(Kd,{size:16}),active:C==="grid"})]}),$e("div",{style:{display:"flex",gap:4,marginBottom:8},children:[Mt(Li,{label:"W",property:"width",cssValue:B==="fixed"?L:`${Math.round(t.getBoundingClientRect().width)}px`,mode:B,onValueChange:j=>n("width",j),onModeChange:j=>{if(j==="fixed"){let Ht=t.getBoundingClientRect();n("width",`${Math.round(Ht.width)}px`)}else n("width",Tr(j,L))},modified:r("width"),dimmed:Q&&c!=="width",dropdownOpen:c==="width",onDropdownChange:j=>x(j?"width":null),panelContentRef:p,accentColor:u,onReset:()=>i("width"),minValue:tt!=="none"&&tt!=="0px"&&tt!=="auto"?tt:"",maxValue:kt!=="none"&&kt!=="auto"?kt:"",onMinChange:j=>n("min-width",j||"0"),onMaxChange:j=>n("max-width",j||"none"),onMinReset:()=>i("min-width"),onMaxReset:()=>i("max-width"),minModified:r("min-width"),maxModified:r("max-width")}),Mt(Li,{label:"H",property:"height",cssValue:U==="fixed"?_:`${Math.round(t.getBoundingClientRect().height)}px`,mode:U,onValueChange:j=>n("height",j),onModeChange:j=>{if(j==="fixed"){let Ht=t.getBoundingClientRect();n("height",`${Math.round(Ht.height)}px`)}else n("height",Tr(j,_))},modified:r("height"),dimmed:Q&&c!=="height",dropdownOpen:c==="height",onDropdownChange:j=>x(j?"height":null),panelContentRef:p,minValue:at!=="none"&&at!=="0px"&&at!=="auto"?at:"",maxValue:Nt!=="none"&&Nt!=="auto"?Nt:"",onMinChange:j=>n("min-height",j||"0"),onMaxChange:j=>n("max-height",j||"none"),onMinReset:()=>i("min-height"),onMaxReset:()=>i("max-height"),minModified:r("min-height"),maxModified:r("max-height"),accentColor:u,onReset:()=>i("height")})]}),M&&$e("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8},children:[Mt("div",{style:{opacity:Q?.3:1,transition:"opacity 150ms ease"},children:sn()}),$e("div",{style:{flex:1,opacity:K,transition:"opacity 150ms ease"},children:[Mt("div",{onClick:r("gap")?()=>i("gap"):void 0,title:r("gap")?"Click to reset":void 0,style:{fontSize:9,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:r("gap")?u:"#999",fontWeight:r("gap")?600:400,marginBottom:2,cursor:r("gap")?"pointer":"default"},children:"Gap"}),Mt(xn,{dimmed:Q,children:$e("div",{style:{display:"flex",alignItems:"center"},children:[Mt(Lo,{value:Dt,onChange:j=>{Ct("gap"),n("gap",j)},onPreview:bt("gap",oe("gap")),onScrubEnd:()=>Ct("gap"),onReset:()=>i("gap"),isModified:r("gap"),accentColor:u,defaultUnit:f,children:P==="column"||P==="column-reverse"?Mt(ja,{size:12,strokeWidth:r("gap")?2.5:1.5}):Mt(Ya,{size:12,strokeWidth:r("gap")?2.5:1.5})}),Mt(Tn,{property:"gap",value:it.gap||Dt,onChange:j=>n("gap",j),isModified:r("gap")||"gap"in it,style:b(h({},je),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:f,onUnitCycle:m})]})})]})]}),T&&$e("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:K,transition:"opacity 150ms ease"},children:[Mt(Qd,{gridCols:qt,gridRows:Ot,gridModified:an,accentColor:u,onColsChange:j=>n("grid-template-columns",`repeat(${j}, 1fr)`),onRowsChange:j=>n("grid-template-rows",`repeat(${j}, 1fr)`)}),$e("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[Mt(xn,{dimmed:Q,children:$e("div",{style:{display:"flex",alignItems:"center"},children:[Mt(Lo,{value:G||Dt,onChange:j=>{Ct("column-gap"),n("column-gap",j)},onPreview:bt("column-gap",oe("column-gap")),onScrubEnd:()=>Ct("column-gap"),onReset:()=>i("column-gap"),isModified:r("column-gap"),accentColor:u,defaultUnit:f,children:Mt(Ya,{size:12,strokeWidth:r("column-gap")?2.5:1.5})}),Mt(Tn,{property:"column-gap",value:it["column-gap"]||G||Dt,onChange:j=>n("column-gap",j),isModified:r("column-gap")||"column-gap"in it,placeholder:"col",style:b(h({},je),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:f,onUnitCycle:m})]})}),Mt(xn,{dimmed:Q,children:$e("div",{style:{display:"flex",alignItems:"center"},children:[Mt(Lo,{value:Ft||Dt,onChange:j=>{Ct("row-gap"),n("row-gap",j)},onPreview:bt("row-gap",oe("row-gap")),onScrubEnd:()=>Ct("row-gap"),onReset:()=>i("row-gap"),isModified:r("row-gap"),accentColor:u,defaultUnit:f,children:Mt(ja,{size:12,strokeWidth:r("row-gap")?2.5:1.5})}),Mt(Tn,{property:"row-gap",value:it["row-gap"]||Ft||Dt,onChange:j=>n("row-gap",j),isModified:r("row-gap")||"row-gap"in it,placeholder:"row",style:b(h({},je),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:f,onUnitCycle:m})]})})]})]}),H&&$e("div",{onMouseEnter:()=>g==null?void 0:g("padding"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:K,transition:"opacity 150ms ease"},children:[Mt(xn,{style:{flex:1},dimmed:Q,children:$e("div",{style:{display:"flex",alignItems:"center"},children:[Mt(Lo,{value:Et.left,onChange:j=>{Ct("padding-h"),E(j)},onPreview:bt("padding-h",ht),onScrubEnd:()=>Ct("padding-h"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:u,defaultUnit:f,snapSteps:Ti,children:Mt(Vd,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Mt(Tn,{property:"padding",value:it["padding-h"]||Et.left,onChange:j=>E(j),isModified:r("padding")||"padding-h"in it,placeholder:"H pad",style:b(h({},je),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:f,onUnitCycle:m})]})}),Mt(xn,{style:{flex:1},dimmed:Q,children:$e("div",{style:{display:"flex",alignItems:"center"},children:[Mt(Lo,{value:Et.top,onChange:j=>{Ct("padding-v"),nt(j)},onPreview:bt("padding-v",Xt),onScrubEnd:()=>Ct("padding-v"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:u,defaultUnit:f,snapSteps:Ti,children:Mt(Xd,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Mt(Tn,{property:"padding",value:it["padding-v"]||Et.top,onChange:j=>nt(j),isModified:r("padding")||"padding-v"in it,placeholder:"V pad",style:b(h({},je),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:f,onUnitCycle:m})]})})]}),$e("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:K,transition:"opacity 150ms ease"},children:[Mt("input",{type:"checkbox",checked:Vt==="hidden",onChange:j=>n("overflow",j.target.checked?"hidden":"visible"),style:{margin:0,accentColor:u}}),"Clip content"]})]})]})}import{AlignCenter as tu,AlignJustify as eu,AlignLeft as nu,AlignRight as ou,Baseline as ru,ChevronDown as iu,WholeWord as su}from"lucide-react";import{jsx as me,jsxs as Hn}from"react/jsx-runtime";var Xa={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function Ua({element:t,getValue:e,handleChange:o,isModified:n,onResetProperty:r,isCollapsed:i,onToggle:s,sectionHeaderStyle:a,accentColor:l,colorVariables:c,activeColorDropdown:d,onColorDropdownChange:p,panelContentRef:u,preferredUnit:g,onUnitCycle:f}){var U;let m=e("font-family"),x=e("font-size"),y=e("font-weight"),P=e("line-height"),C=e("letter-spacing"),M=e("text-align"),T=e("color"),H=String(y),L=Xa[H]||H,_=Jo(t,T),q=T.includes("var(")?null:Vo(_,c),et=({align:tt,icon:kt})=>{let at=M===tt;return me("button",{type:"button",onClick:()=>o("text-align",tt),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:at?ro(l,.15):"transparent",color:at?l:"#64748b",cursor:"pointer"},children:kt})},B=((U=m.split(",")[0])==null?void 0:U.trim().replace(/^["']|["']$/g,""))||"System";return Hn("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[me("div",{style:a,children:me("span",{children:"Typography"})}),Hn("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[me(xn,{children:Hn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[me("input",{type:"text",value:m,onChange:tt=>o("font-family",tt.target.value),style:b(h({},je),{flex:1,minWidth:0,padding:0,fontWeight:n("font-family")?600:400,color:n("font-family")?l:"inherit"}),title:m}),me(iu,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),Hn("div",{style:{display:"flex",gap:4},children:[me(xn,{style:{flex:1},children:me("select",{value:H,onChange:tt=>o("font-weight",tt.target.value),style:b(h({},je),{padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:n("font-weight")?600:400,color:n("font-weight")?l:"inherit"}),children:Object.entries(Xa).map(([tt,kt])=>me("option",{value:tt,children:kt},tt))})}),me(xn,{style:{flex:1},children:me("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:me(Tn,{property:"font-size",value:x,onChange:tt=>o("font-size",tt),isModified:n("font-size"),min:1,max:999,style:b(h({},je),{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:g,onUnitCycle:f})})})]}),Hn("div",{style:{display:"flex",gap:4},children:[me(xn,{style:{flex:1},children:Hn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[me(ru,{size:12,style:{color:n("line-height")?l:"#999",flexShrink:0}}),me(Tn,{property:"line-height",value:P,onChange:tt=>o("line-height",tt),isModified:n("line-height"),step:.1,min:0,placeholder:"Auto",style:b(h({},je),{flex:1,minWidth:0,padding:0,fontWeight:n("line-height")?600:400,color:n("line-height")?l:"inherit"}),showUnit:!1})]})}),me(xn,{style:{flex:1},children:Hn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[me(su,{size:12,style:{color:n("letter-spacing")?l:"#999",flexShrink:0}}),me(Tn,{property:"letter-spacing",value:C,onChange:tt=>o("letter-spacing",tt),isModified:n("letter-spacing"),step:.1,placeholder:"\u2014",style:b(h({},je),{flex:1,minWidth:0,padding:0,fontWeight:n("letter-spacing")?600:400,color:n("letter-spacing")?l:"inherit"}),showUnit:!1})]})})]}),Hn("div",{style:{display:"flex",gap:2,backgroundColor:In,borderRadius:2,padding:2},children:[me(et,{align:"left",icon:me(nu,{size:14})}),me(et,{align:"center",icon:me(tu,{size:14})}),me(et,{align:"right",icon:me(ou,{size:14})}),me(et,{align:"justify",icon:me(eu,{size:14})})]}),Hn("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[me("span",{onClick:n("color")?()=>r("color"):void 0,title:n("color")?"Click to reset":void 0,style:{fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:n("color")?l:"#64748b",fontWeight:n("color")?600:400,cursor:n("color")?"pointer":"default",width:40,flexShrink:0},children:"Color"}),me("div",{style:{flex:1,minWidth:0},children:me(Ri,{value:T,resolvedValue:_,colorVariables:c,matchingVariable:q,onChange:tt=>o("color",tt),accentColor:l,modified:n("color"),panelContentRef:u,isDropdownOpen:d==="color",onDropdownChange:tt=>p(tt?"color":null)})})]})]})]})}import{Fragment as uu,jsx as ut,jsxs as Se}from"react/jsx-runtime";var Za=[{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 du(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 Mi(t,e){return!e||t==="auto"||t==="fit-content"||t==="max-content"||t==="min-content"?"hug":t==="100%"||e==="100%"?"fill":"fixed"}function Tr(t,e){switch(t){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let o=Vn(e);if(typeof o.num=="number"&&!isNaN(o.num)){let n=o.unit==="%"?"px":o.unit||"px";return`${o.num}${n}`}return"auto"}}}function Ao(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 Ja(t,e){return t==="grid"?"grid":t==="flex"||t==="inline-flex"?e==="column"||e==="column-reverse"?"flex-col":"flex-row":"block"}function Va(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 In="rgba(0, 0, 0, 0.04)",je={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};function Li({label:t,property:e,cssValue:o,mode:n,onValueChange:r,onModeChange:i,modified:s,dimmed:a,dropdownOpen:l,onDropdownChange:c,panelContentRef:d,accentColor:p="#3b82f6",onReset:u,minValue:g,maxValue:f,onMinChange:m,onMaxChange:x,onMinReset:y,onMaxReset:P,minModified:C,maxModified:M}){let T=Vn(o),H=s?T.unit||Mo(e):Mo(e),L=!s&&T.unit&&T.unit!==H?Ei(T.num,H):T.num,[_,q]=Ge(!1),[et,B]=Ge(String(L)),[U,tt]=Ge(!1),kt=fn(null),at=fn(null),Nt=fn(null),Et=fn(!1);wn(()=>{_||B(String(L))},[L,_]),wn(()=>{if(!l)return;let Ot=se=>{at.current&&!at.current.contains(se.target)&&Nt.current&&!Nt.current.contains(se.target)&&(c==null||c(!1))},mt=se=>{se.key==="Escape"&&(c==null||c(!1))};return document.addEventListener("mousedown",Ot),document.addEventListener("keydown",mt),()=>{document.removeEventListener("mousedown",Ot),document.removeEventListener("keydown",mt)}},[l,c]),wn(()=>{_&&kt.current&&(kt.current.focus(),kt.current.select())},[_]);let Dt=()=>{let Ot=kr(et,e,o,s);r(Ot||`${Math.max(0,parseFloat(et)||0)}${H}`),q(!1)},Ft=()=>{if(Et.current){Et.current=!1;return}Dt()},G=Ot=>{if(Ot.key==="Enter"){Dt();return}if(Ot.key==="Escape"){Et.current=!0,B(String(L)),q(!1);return}if(Ot.key==="ArrowUp"||Ot.key==="ArrowDown"){Ot.preventDefault();let mt=Ot.key==="ArrowUp"?1:-1,se=Ot.shiftKey?8:Ot.altKey?.1:1,Q=parseFloat(et)||0,yt=Math.round(Math.max(0,Q+mt*se)*1e3)/1e3;B(String(yt)),r(`${yt}${H}`)}},_t={fixed:"Fixed",hug:"Hug",fill:"Fill"},St={fixed:ut(Ka,{size:12}),hug:ut(lu,{size:12}),fill:ut(Ka,{size:12})},Vt=()=>{c==null||c(!l)},qt=()=>{if(!Nt.current||!(d!=null&&d.current))return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let Ot=Nt.current.getBoundingClientRect(),mt=d.current.getBoundingClientRect(),se=d.current.closest('[data-devtools="panel"]'),Q=se?se.getBoundingClientRect():{top:0,left:0};return{position:"fixed",top:Ot.bottom+4-Q.top,left:mt.left+4-Q.left,width:mt.width-8}};return Se("div",{ref:Nt,onMouseEnter:()=>tt(!0),onMouseLeave:()=>tt(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:_?p:U?"rgba(0,0,0,0.15)":"transparent",backgroundColor:In,transition:"border-color 100ms ease, opacity 150ms ease",opacity:a?.3:1},children:[ut("span",{onClick:s&&u?u:void 0,title:s?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:s?p:"#999",fontWeight:s?600:400,padding:"0 8px",flexShrink:0,cursor:s?"pointer":"default"},children:t}),n==="fixed"?_?ut("input",{ref:kt,type:"text",inputMode:"numeric",value:et,onChange:Ot=>B(Ot.target.value),onKeyDown:G,onBlur:Ft,style:b(h({},je),{flex:1,minWidth:0,padding:"4px 2px"})}):ut("span",{onClick:()=>q(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:L}):ut("span",{style:{flex:1}}),Se("button",{type:"button",onClick:Vt,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:[_t[n],ut(Ai,{size:12})]}),l&&Se("div",{ref:at,style:b(h({},qt()),{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:[Se("button",{type:"button",onClick:()=>{i("fixed"),c==null||c(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:n==="fixed"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:n==="fixed"?600:400,cursor:"pointer",textAlign:"left"},children:[St.fixed,Se("span",{children:["Fixed ",e," (",o,")"]}),n==="fixed"&&ut(Ir,{size:14,style:{marginLeft:"auto"}})]}),Se("button",{type:"button",onClick:()=>{i("hug"),c==null||c(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:n==="hug"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:n==="hug"?600:400,cursor:"pointer",textAlign:"left"},children:[St.hug,ut("span",{children:"Hug contents"}),n==="hug"&&ut(Ir,{size:14,style:{marginLeft:"auto"}})]}),Se("button",{type:"button",onClick:()=>{i("fill"),c==null||c(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:n==="fill"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:n==="fill"?600:400,cursor:"pointer",textAlign:"left"},children:[St.fill,ut("span",{children:"Fill container"}),n==="fill"&&ut(Ir,{size:14,style:{marginLeft:"auto"}})]}),ut("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),Se("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[Se("div",{style:{display:"flex",alignItems:"center",backgroundColor:In,borderRadius:2,padding:"4px 8px"},children:[ut("span",{onClick:C?Ot=>{Ot.stopPropagation(),y==null||y()}:void 0,title:C?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:C?p:"#999",fontWeight:C?600:400,marginRight:8,flexShrink:0,cursor:C?"pointer":"default"},children:"Min"}),ut("input",{type:"text",value:g||"",placeholder:"\u2014",onChange:Ot=>m==null?void 0:m(Ot.target.value),onClick:Ot=>Ot.stopPropagation(),style:b(h({},je),{flex:1,minWidth:0,padding:0,textAlign:"right",color:C?p:"inherit",fontWeight:C?600:400})})]}),Se("div",{style:{display:"flex",alignItems:"center",backgroundColor:In,borderRadius:2,padding:"4px 8px"},children:[ut("span",{onClick:M?Ot=>{Ot.stopPropagation(),P==null||P()}:void 0,title:M?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:M?p:"#999",fontWeight:M?600:400,marginRight:8,flexShrink:0,cursor:M?"pointer":"default"},children:"Max"}),ut("input",{type:"text",value:f||"",placeholder:"\u2014",onChange:Ot=>x==null?void 0:x(Ot.target.value),onClick:Ot=>Ot.stopPropagation(),style:b(h({},je),{flex:1,minWidth:0,padding:0,textAlign:"right",color:M?p:"inherit",fontWeight:M?600:400})})]})]})]})]})}function xn({children:t,style:e,dimmed:o}){let[n,r]=Ge(!1);return ut("div",{onMouseEnter:()=>r(!0),onMouseLeave:()=>r(!1),style:h({position:"relative",borderRadius:2,border:"1px solid",borderColor:n?"rgba(0,0,0,0.15)":"transparent",backgroundColor:In,transition:"border-color 100ms ease, opacity 150ms ease",opacity:o?.3:1},e),children:t})}function Fn({children:t}){let[e,o]=Ge(!1);return ut("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:In,transition:"border-color 100ms ease"},children:t})}function Tn({property:t,value:e,onChange:o,isModified:n=!1,step:r=1,min:i,max:s,style:a,placeholder:l,showUnit:c=!0,unitStyle:d,preferredUnit:p,onUnitCycle:u}){let g=Vn(e),f=Mo(t),m=wr[t],y=p&&m&&m.includes(p)?p:f,P=n&&g.unit||y,C=!n&&g.unit&&g.unit!==P?Ei(g.num,P):g.num,[M,T]=Ge(!1),[H,L]=Ge(""),_=Ft=>{T(!0),L(String(C||"")),requestAnimationFrame(()=>Ft.target.select())},q=()=>{if(T(!1),H.trim()){let Ft=kr(H,t,e,n);Ft&&o(Ft)}},et=Ft=>{let G=Ft.target.value;L(G);let _t=G.trim(),St=_t.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),Vt=_t.match(/^(-?[\d.]+)$/);if(St){let qt=parseFloat(St[1]);isNaN(qt)||o(`${qt}${St[2].toLowerCase()}`)}else if(Vt){let qt=parseFloat(Vt[1]);isNaN(qt)||o(`${qt}${P}`)}},B=Ft=>{if(Ft.key==="Enter"){if(H.trim()){let G=kr(H,t,e,n);G&&o(G)}Ft.target.blur();return}if(Ft.key==="ArrowUp"||Ft.key==="ArrowDown"){Ft.preventDefault();let G=Ft.shiftKey?10:Ft.altKey?.1:1,_t=(Ft.key==="ArrowUp"?1:-1)*r*G,St=parseFloat(H)||C||0,Vt=Math.round((St+_t)*1e3)/1e3;i!==void 0&&(Vt=Math.max(i,Vt)),s!==void 0&&(Vt=Math.min(s,Vt)),L(String(Vt)),o(`${Vt}${P}`)}},U=/^-?[\d.]/.test(e.trim()),tt=M?H:U?String(C):"",at=M&&/\s*(rem|em|px|%)\s*$/i.test(H)?"":P,Nt=u&&(at==="rem"||at==="px"),Et={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},Dt=b(h({},d!=null?d:Et),{pointerEvents:"auto",cursor:"pointer"});return Se(uu,{children:[ut("input",{type:"text",inputMode:"decimal",value:tt,onFocus:_,onBlur:q,onChange:et,onKeyDown:B,placeholder:l,style:a}),c&&at&&ut("span",{style:Nt?Dt:d!=null?d:Et,onClick:Nt?u:void 0,title:Nt?"Click to switch units":void 0,children:at})]})}function Ri({value:t,resolvedValue:e,colorVariables:o,matchingVariable:n,onChange:r,accentColor:i="#3b82f6",modified:s,panelContentRef:a,isDropdownOpen:l,onDropdownChange:c}){let[d,p]=Ge(!1),u=!t.includes("var(")&&n?n.usage:t,[g,f]=Ge(u),[m,x]=Ge(!1),[y,P]=Ge(!1),[C,M]=Ge(!1),T=fn(null),H=fn(null),L=fn(null),_=l!==void 0?l:m,q=c||x,et=Pn(()=>{if(!L.current)return{position:"fixed",top:0,left:0,width:200};let G=L.current.getBoundingClientRect(),_t=L.current.closest('[data-devtools="panel"]'),St=_t?_t.getBoundingClientRect():{top:0,left:0};if(a!=null&&a.current){let Vt=a.current.getBoundingClientRect();return{position:"fixed",top:G.bottom+4-St.top,left:Vt.left+4-St.left,width:Vt.width-8}}return{position:"fixed",top:G.bottom+4-St.top,left:G.left-St.left,width:G.width}},[a]);wn(()=>{if(!d){let G=!t.includes("var(")&&n?n.usage:t;f(G)}},[t,d,n]),wn(()=>{if(!_&&!y)return;let G=St=>{L.current&&!L.current.contains(St.target)&&(q(!1),P(!1))},_t=St=>{St.key==="Escape"&&(q(!1),P(!1))};return document.addEventListener("mousedown",G),document.addEventListener("keydown",_t),()=>{document.removeEventListener("mousedown",G),document.removeEventListener("keydown",_t)}},[_,y]),wn(()=>{d&&T.current&&(T.current.focus(),T.current.select())},[d]);let B=Mr(()=>{if(!g||g.startsWith("#")||g.startsWith("rgb")||g.startsWith("hsl")||g.startsWith("oklch"))return[];let G=g.toLowerCase();return o.filter(_t=>_t.name.toLowerCase().includes(G)||_t.usage.toLowerCase().includes(G)).slice(0,8)},[g,o]),U=()=>{r(g),p(!1),P(!1)},tt=G=>{f(G),G.includes("var")||G.includes("--")||G.length>0&&!G.startsWith("#")?P(!0):P(!1)},kt=G=>{f(G.usage),r(G.usage),q(!1),P(!1),p(!1)},at=()=>{setTimeout(()=>{!_&&!y&&U()},150)},Nt=G=>{G.key==="Enter"?U():G.key==="Escape"&&(f(t),p(!1),P(!1))},Et=Mr(()=>{let G=e.trim().toLowerCase();if(G.startsWith("#"))return G.length===4?`#${G[1]}${G[1]}${G[2]}${G[2]}${G[3]}${G[3]}`:G.slice(0,7);let _t=G.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(_t){let Vt=parseInt(_t[1],10).toString(16).padStart(2,"0"),qt=parseInt(_t[2],10).toString(16).padStart(2,"0"),Ot=parseInt(_t[3],10).toString(16).padStart(2,"0");return`#${Vt}${qt}${Ot}`}let St=G.match(/oklch\(\s*([\d.]+)/);if(St){let Vt=Math.max(0,Math.min(1,parseFloat(St[1]))),qt=Math.round(Vt*255).toString(16).padStart(2,"0");return`#${qt}${qt}${qt}`}return"#000000"},[e]),Dt=G=>{let _t=G.target.value;f(_t),r(_t)},Ft=t.includes("var(");return Se("div",{ref:L,onMouseEnter:()=>M(!0),onMouseLeave:()=>M(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:d?i:C?"rgba(0,0,0,0.15)":"transparent",backgroundColor:In,transition:"border-color 100ms ease",overflow:"hidden"},children:[Se("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[Se("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[ut("input",{type:"color",value:Et,onChange:Dt,style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),ut("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:e,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),d?ut("input",{ref:T,type:"text",value:g,onChange:G=>tt(G.target.value),onKeyDown:Nt,onBlur:at,style:b(h({},je),{flex:1,minWidth:0})}):ut("span",{onClick:()=>p(!0),style:{flex:1,minWidth:0,padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",color:s?i:"inherit"},title:u,children:u}),o.length>0&&ut("button",{type:"button",onClick:()=>q(!_),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:ut(Ai,{size:12})})]}),y&&B.length>0&&ut("div",{style:b(h({},et()),{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:B.map(G=>Se("button",{type:"button",onClick:()=>kt(G),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:[ut("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:G.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ut("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:G.name})]},G.name))}),_&&ut("div",{ref:H,style:b(h({},et()),{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(G=>Se("button",{type:"button",onClick:()=>kt(G),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:u===G.usage||t===G.usage?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:u===G.usage||t===G.usage?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[ut("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:G.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ut("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:G.name}),(u===G.usage||t===G.usage)&&ut(Ir,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},G.name))})]})}function qa({element:t,elementInfo:e,selector:o,styleModifications:n,dispatch:r,onClose:i,onHover:s,accentColor:a="#3b82f6"}){var Lt,ee;let l=fn(null),c=fn(null),[d,p]=Ge(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch(E){return!1}});wn(()=>{if(d)return;let E=setTimeout(()=>p(!0),50);return()=>clearTimeout(E)},[d]);let[u,g]=Ge(null),[f,m]=Ge(null),x=u!==null||f!==null,[y,P]=Ge("rem"),C=Pn(()=>{P(E=>E==="rem"?"px":"rem")},[]),M=fn(new Map),[T,H]=Ge(""),L=Mr(()=>qr(),[]);wn(()=>{let E=nt=>{var At;if(nt.key!=="Escape")return;let it=document.activeElement;it&&((At=l.current)!=null&&At.contains(it))||i()};return window.addEventListener("keydown",E),()=>window.removeEventListener("keydown",E)},[i]);let _=fn({top:0,left:0,maxHeight:400}),[,q]=Ge(0),et="devtools-panel-position",B=fn({x:0,y:0}),U=fn(null),tt=fn(!1);wn(()=>{try{let E=localStorage.getItem(et);if(E){let nt=JSON.parse(E);typeof nt.top=="number"&&typeof nt.left=="number"&&(tt.current=!0,_.current=b(h({},_.current),{top:nt.top,left:nt.left}))}}catch(E){}},[]),wn(()=>{let E=it=>{let At=U.current;if(!At)return;let bt=At.startOffsetX+(it.clientX-At.startX),Ct=At.startOffsetY+(it.clientY-At.startY),ht=280,Xt=16,oe=Math.max(Xt,Math.min(window.innerWidth-ht-Xt,_.current.left+bt)),be=Math.max(Xt,_.current.top+Ct);B.current={x:oe-_.current.left,y:be-_.current.top};let ae=l.current,Ne=ae==null?void 0:ae.parentElement;if(!Ne)return;Ne.style.top=`${be}px`,Ne.style.left=`${oe}px`;let re=document.getElementById("devtools-toolbar"),Fe=re==null?void 0:re.getBoundingClientRect(),$t=window.innerHeight-16;Fe&&oe+ht>Fe.left&&($t=Fe.top-8);let Sn=Math.max(0,be),Ie=Math.max(200,$t-Sn);ae&&(ae.style.maxHeight=`${Ie}px`)},nt=()=>{if(!U.current)return;let it=_.current.top+B.current.y,At=_.current.left+B.current.x;_.current=b(h({},_.current),{top:it,left:At}),B.current={x:0,y:0},tt.current=!0;try{localStorage.setItem(et,JSON.stringify({top:it,left:At}))}catch(bt){}U.current=null};return window.addEventListener("mousemove",E),window.addEventListener("mouseup",nt),()=>{window.removeEventListener("mousemove",E),window.removeEventListener("mouseup",nt)}},[]);let kt=Pn(E=>{E.button!==0||E.target.closest("button")||(E.preventDefault(),U.current={startX:E.clientX,startY:E.clientY,startOffsetX:B.current.x,startOffsetY:B.current.y})},[]);wn(()=>{B.current={x:0,y:0};let E=(At=!1)=>{let bt=l.current,Ct=280,ht=8,Xt,oe;if(tt.current)Xt=_.current.top,oe=_.current.left;else{let $t=t.getBoundingClientRect();oe=$t.right+ht,Xt=$t.top,oe+Ct>window.innerWidth-ht&&(oe=$t.left-Ct-ht),oe<ht&&(oe=Math.max(ht,(window.innerWidth-Ct)/2))}let be=document.getElementById("devtools-toolbar"),ae=be==null?void 0:be.getBoundingClientRect(),Ne=window.innerHeight-16;ae&&oe+Ct>ae.left&&(Ne=ae.top-ht);let re=Math.max(0,Xt),Fe=Math.max(200,Ne-re);if(_.current={top:Xt,left:oe,maxHeight:Fe},At&&bt){let $t=bt.parentElement;$t&&!tt.current&&($t.style.top=`${Xt+B.current.y}px`,$t.style.left=`${oe+B.current.x}px`),bt.style.maxHeight=`${Fe}px`}else q($t=>$t+1)};E(!1);let nt=()=>E(!0),it=()=>E(!1);return window.addEventListener("scroll",nt,{passive:!0}),window.addEventListener("resize",it,{passive:!0}),()=>{window.removeEventListener("scroll",nt),window.removeEventListener("resize",it)}},[t]),wn(()=>{let E=l.current;if(!E)return;let nt=it=>{let At=c.current;if(!At){it.preventDefault();return}let{scrollTop:bt,scrollHeight:Ct,clientHeight:ht}=At,Xt=bt<=0&&it.deltaY<0,oe=bt+ht>=Ct&&it.deltaY>0;(Xt||oe)&&it.preventDefault()};return E.addEventListener("wheel",nt,{passive:!1}),()=>E.removeEventListener("wheel",nt)},[]);let at=Mr(()=>n.find(E=>E.selector===o),[n,o]),Nt=Pn(E=>{let nt=at==null?void 0:at.changes.find(it=>it.property===E);if(nt)return nt.modified;if(E.includes("color")){let it=Vr(t,E);if(it&&it.includes("var("))return it}return Yo(t,E)},[t,at]),Et=Pn(E=>{if(M.current.has(E))return M.current.get(E);let nt=at==null?void 0:at.changes.find(At=>At.property===E);if(nt)return nt.original;let it=Yo(t,E);return M.current.set(E,it),it},[t,at]),Dt=Pn((E,nt)=>{let it=Et(E);Jt(t,E,nt),E==="backdrop-filter"&&Jt(t,"-webkit-backdrop-filter",nt),r({type:"MODIFY_STYLE",payload:{selector:o,element:e,property:E,original:it,modified:nt}})},[t,o,e,r,Et]),Ft=Pn(()=>{Zr(o,n);let E=n.find(nt=>nt.selector===o);if(E)for(let nt of E.changes)r({type:"CLEAR_STYLE",payload:{selector:o,property:nt.property}});M.current.clear()},[o,n,r]),G=Pn(E=>{let nt=n.find(At=>At.selector===o);nt!=null&&nt.changes.find(At=>At.property===E)&&t instanceof HTMLElement&&(t.style.removeProperty(E),r({type:"CLEAR_STYLE",payload:{selector:o,property:E}}),M.current.delete(E))},[t,o,n,r]),_t=Pn(()=>{let E=T.split(";").map(nt=>nt.trim()).filter(nt=>nt);for(let nt of E){let it=nt.indexOf(":");if(it>0){let At=nt.slice(0,it).trim(),bt=nt.slice(it+1).trim();At&&bt&&Dt(At,bt)}}H("")},[T,Dt]),St=Pn(E=>{var nt;return(nt=at==null?void 0:at.changes.some(it=>it.property===E))!=null?nt:!1},[at]),Vt=E=>{var Ct;let nt=Nt(E.property),it=St(E.property),At=!it&&du(E.property,nt),bt={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};if(At&&E.type!=="backdrop-filter")return ut(Fn,{modified:!1,children:ut("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:ht=>Dt(E.property,ht.target.value),style:b(h({},bt),{color:"#999"})})});switch(E.type){case"color":{let ht=Jo(t,nt),Xt=nt.includes("var(")?null:Vo(ht,L);return ut(Ri,{value:nt,resolvedValue:ht,colorVariables:L,matchingVariable:Xt,onChange:oe=>Dt(E.property,oe),accentColor:a,modified:it,panelContentRef:c,isDropdownOpen:f===E.property,onDropdownChange:oe=>m(oe?E.property:null)})}case"number":{if(!!wr[E.property])return ut(Fn,{modified:it,children:ut(Tn,{property:E.property,value:nt,onChange:oe=>Dt(E.property,oe),isModified:it,min:E.min,max:E.max,step:E.step||1,style:b(h({},bt),{paddingRight:32}),unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:y,onUnitCycle:C})});let{num:Xt}=Vn(nt);return ut(Fn,{modified:it,children:ut("input",{type:"number",value:Xt,min:E.min,max:E.max,step:E.step||1,onChange:oe=>Dt(E.property,oe.target.value),style:bt})})}case"select":return ut(Fn,{modified:it,children:Se("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[ut("select",{value:nt,onChange:ht=>Dt(E.property,ht.target.value),style:b(h({},bt),{cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"}),children:(Ct=E.options)==null?void 0:Ct.map(ht=>ut("option",{value:ht,children:ht},ht))}),ut("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:ut(Ai,{size:12})})]})});case"spacing":return ut(Fn,{modified:it,children:ut("input",{type:"text",value:nt,onChange:ht=>Dt(E.property,ht.target.value),placeholder:"e.g., 10px or 10px 20px",style:bt})});case"backdrop-filter":return ut($a,{value:nt,onChange:ht=>Dt(E.property,ht),accentColor:a,modified:it,panelContentRef:c});default:return ut(Fn,{modified:it,children:ut("input",{type:"text",value:nt,onChange:ht=>Dt(E.property,ht.target.value),style:bt})})}},qt=(Lt=at==null?void 0:at.changes.length)!=null?Lt:0,Ot=(ee=at==null?void 0:at.captured)!=null?ee:!1,mt=b(h({position:"fixed",top:_.current.top,left:_.current.left,width:280,maxHeight:_.current.maxHeight,backgroundColor:"rgba(255, 255, 255, 0.85)",backdropFilter:"blur(32px)",WebkitBackdropFilter:"blur(32px)"},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"}),se={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:U.current?"grabbing":"grab"},Q={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"},yt={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},K={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return ut("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:_.current.top+B.current.y,left:_.current.left+B.current.x,zIndex:1e4,pointerEvents:"none"},children:Se("div",{ref:l,"data-devtools":"panel",style:b(h({},mt),{position:"relative",top:0,left:0,zIndex:0,pointerEvents:"auto"}),onMouseEnter:()=>s==null?void 0:s("element"),onMouseLeave:()=>s==null?void 0:s(null),children:[Se("div",{style:se,onMouseDown:kt,children:[Se("div",{style:{display:"flex",alignItems:"center",gap:8,overflow:"hidden"},children:[ut("span",{style:{fontWeight:600,fontSize:11,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:e.tagName}),qt>0&&ut("span",{style:{backgroundColor:Ot?"#999999":a,color:"#fff",fontSize:9,padding:"1px 4px",borderRadius:2},children:qt})]}),Se("div",{style:{display:"flex",gap:4},children:[qt>0&&ut("button",{type:"button",onClick:Ft,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:ut(au,{size:14})}),ut("button",{type:"button",onClick:i,title:"Close",style:{display:"flex",alignItems:"center",justifyContent:"center",width:24,height:24,border:"none",background:"none",cursor:"pointer",color:"#64748b",borderRadius:2},children:ut(cu,{size:14})})]})]}),Se("div",{ref:c,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[ut("div",{style:{opacity:f?.3:1,transition:"opacity 150ms ease"},children:ut(Ga,{element:t,getValue:Nt,getOriginalValue:Et,handleChange:Dt,isModified:St,onResetProperty:G,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:Q,activeDropdown:u,onDropdownChange:g,panelContentRef:c,accentColor:a,onFieldHover:s,preferredUnit:y,onUnitCycle:C})}),ut("div",{style:{opacity:u?.3:1,transition:"opacity 150ms ease"},children:ut(Ua,{element:t,getValue:Nt,handleChange:Dt,isModified:St,onResetProperty:G,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:Q,accentColor:a,colorVariables:L,activeColorDropdown:f,onColorDropdownChange:m,panelContentRef:c,preferredUnit:y,onUnitCycle:C})}),Za.map((E,nt)=>{let it=nt===Za.length-1,At=f&&E.properties.some(Ct=>Ct.property===f);return Se("div",{style:{borderBottom:it?"none":"1px solid rgba(0,0,0,0.08)",opacity:x&&!At?.3:1,transition:"opacity 150ms ease"},children:[ut("div",{style:Q,children:ut("span",{children:E.name})}),ut("div",{style:{padding:"4px 0"},children:E.properties.map(Ct=>{let ht=St(Ct.property),Xt=At&&Ct.property!==f;return Se("div",{style:b(h({},yt),{opacity:Xt?.3:1,transition:"opacity 150ms ease"}),children:[ut("span",{onClick:ht?()=>G(Ct.property):void 0,title:ht?"Click to reset":void 0,style:b(h({},K),{color:ht?a:"#64748b",fontWeight:ht?600:400,cursor:ht?"pointer":"default"}),children:Ct.label}),ut("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:Vt(Ct)})]},Ct.property)})})]},E.name)}),Se("div",{style:{opacity:x?.3:1,transition:"opacity 150ms ease"},children:[ut("div",{style:Q,children:ut("span",{children:"Raw CSS"})}),Se("div",{style:{padding:"8px 12px"},children:[ut("textarea",{value:T,onChange:E=>H(E.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"}}),T.trim()&&ut("button",{type:"button",onClick:_t,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:a,color:"#fff",cursor:"pointer",opacity:T.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as pu,useLayoutEffect as fu,useState as gu}from"react";import{Fragment as bu,jsx as ao,jsxs as yu}from"react/jsx-runtime";var Pi=["flex-start","center","flex-end"],Bi=["flex-start","center","flex-end"];function mu(t){return t==="normal"||t==="flex-start"||t==="start"?"flex-start":t==="flex-end"||t==="end"?"flex-end":t==="center"?"center":null}function hu(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 Qa(t){let e=Array.from(t.children);if(e.length===0)return null;let o=1/0,n=1/0,r=-1/0,i=-1/0;for(let s of e){let a=s.getBoundingClientRect();a.width===0&&a.height===0||(a.top<o&&(o=a.top),a.left<n&&(n=a.left),a.bottom>r&&(r=a.bottom),a.right>i&&(i=a.right))}return o===1/0?null:new DOMRect(n,o,i-n,r-o)}function tl({element:t,modifier:e,accentColor:o,refreshKey:n=0}){let[r,i]=gu(null);if(pu(()=>{if(!t){i(null);return}let m=()=>i(Qa(t));return m(),window.addEventListener("scroll",m,{passive:!0}),window.addEventListener("resize",m,{passive:!0}),()=>{window.removeEventListener("scroll",m),window.removeEventListener("resize",m)}},[t]),fu(()=>{t&&i(Qa(t))},[t,n]),!r)return null;let s=r,a=window.getComputedStyle(t),l=a.display;if(l!=="flex"&&l!=="inline-flex")return null;let c=a.flexDirection,d=c==="column"||c==="column-reverse"?"vertical":"horizontal",p=d==="horizontal"?"vertical":"horizontal",u=[];if(e==="shift"){let m=mu(a.justifyContent);if(m){let x=Pi.indexOf(m);d==="horizontal"?(x>0&&u.push("left"),x<Pi.length-1&&u.push("right")):(x>0&&u.push("up"),x<Pi.length-1&&u.push("down"))}}else{let m=hu(a.alignItems);if(m){let x=Bi.indexOf(m);p==="horizontal"?(x>0&&u.push("left"),x<Bi.length-1&&u.push("right")):(x>0&&u.push("up"),x<Bi.length-1&&u.push("down"))}}if(u.length===0)return null;let g=14,f=7;return ao(bu,{children:u.map(m=>{let x,y;switch(m){case"right":x=s.right+g,y=s.top+s.height/2;break;case"left":x=s.left-g,y=s.top+s.height/2;break;case"down":x=s.left+s.width/2,y=s.bottom+g;break;case"up":x=s.left+s.width/2,y=s.top-g;break}let P=m==="right"?0:m==="left"?180:m==="down"?90:-90,C={position:"fixed",left:x-f,top:y-f,width:f*2,height:f*2,pointerEvents:"none",zIndex:9997};return ao("div",{"data-devtools":"swipe-hint",style:C,children:ao("svg",{width:f*2,height:f*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:yu("g",{transform:`rotate(${P})`,children:[ao("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),ao("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),ao("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:o,strokeWidth:"1.5",strokeLinecap:"round"}),ao("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:o,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},m)})})}import{useEffect as xu,useLayoutEffect as vu,useState as Su}from"react";import{jsx as Oi,jsxs as Di}from"react/jsx-runtime";function wu(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 el({element:t,fontSize:e,lineHeight:o,accentColor:n,hoveredProperty:r,draggingProperty:i,cursorViewport:s}){let[a,l]=Su(null);if(xu(()=>{if(!t){l(null);return}let y=()=>{l(Eo(t))};return y(),window.addEventListener("scroll",y,{passive:!0}),window.addEventListener("resize",y,{passive:!0}),()=>{window.removeEventListener("scroll",y),window.removeEventListener("resize",y)}},[t]),vu(()=>{t&&l(Eo(t))},[t,e,o]),!a)return null;let c=a.width,d=a.height,p=wu(n,.2),u=i!=null?i:r,g=8,f=2,m={position:"fixed",top:a.top,left:a.left,width:c,height:d,pointerEvents:"none",zIndex:9996,overflow:"visible"},x=y=>y==="font-size"?`${Math.round(e)}`:(e>0?o/e:1.2).toFixed(2).replace(/\.?0+$/,"");return Di("div",{"data-devtools":"text-handles",style:m,children:[Di("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${d}`,children:[Oi("rect",{x:"0.5",y:"0.5",width:Math.max(0,c-1),height:Math.max(0,d-1),fill:"none",stroke:p,strokeWidth:"1"}),(u==="font-size"||!u)&&Oi("rect",{x:c-f/2,y:d/2-g/2,width:f,height:g,fill:n,stroke:"#ffffff",strokeWidth:u==="font-size"?4:2,paintOrder:"stroke"}),(u==="line-height"||!u)&&Oi("rect",{x:c/2-g/2,y:d-f/2,width:g,height:f,fill:n,stroke:"#ffffff",strokeWidth:u==="line-height"?4:2,paintOrder:"stroke"})]}),s&&u&&(()=>{let y=u==="font-size"?"Aa":"Lh",P=x(u);return Di("div",{style:{position:"fixed",left:s.x+8,top:s.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:[y," ",P]})})()]})}import{Fragment as Bo,jsx as le,jsxs as Po}from"react/jsx-runtime";var nl=8,Fi=[0,1,2,4,8,12,16,20,24,28,32],Hi="devtools-active-text";function ol(t,e,o=0){let n=t.left+window.scrollX+4,r=e==="top-left"?t.top+window.scrollY-oo-o*oo+4:t.bottom+window.scrollY+4-1+o*oo,i=window.scrollY+4,s=window.scrollY+window.innerHeight-oo-4;return r<i?r=t.top+window.scrollY+4:r>s&&(r=Math.max(t.top+window.scrollY+4,s)),{x:n,y:r}}function rl({state:t,dispatch:e,onScreenshot:o,inFlightAnnotationIds:n,inFlightStyleSelectors:r,inFlightSelectorColors:i,onAttachImages:s,onReply:a,onViewThread:l,onCloseThread:c,activePlan:d,onModelComponentsAdd:p,onModelComponentFocus:u,onModelComponentHover:g,modelComponentNames:f,modelPanelHoveredComponent:m,modelSpacingTokenHover:x}){var hs,ys,bs,xs,vs,Ss,ws,ks,Es,Cs,Ts;let{canvasRef:y,redrawAll:P,resizeCanvas:C}=ma(),M=Le(!1);Ve(()=>{let w=y.current;if(!w)return;let k=()=>{M.current&&(M.current=!1,w.style.pointerEvents="")},Z=R=>{R.button===0&&M.current&&k()};return window.addEventListener("mousedown",Z),()=>window.removeEventListener("mousedown",Z)},[y]);let[T,H]=ue(!1),[L,_]=ue(()=>{if(typeof window=="undefined")return null;try{let w=localStorage.getItem(Hi);return w?JSON.parse(w):null}catch(w){return null}}),[q,et]=ue(null),[B,U]=ue(null),[tt,kt]=ue(null),at=Le(null),Nt=Le(null),Et=Le({x:0,y:0}),Dt=Le([]),Ft=Le(0),[G,_t]=ue(null),[St,Vt]=ue(new Map),qt=Le(0),Ot=Le(null),[mt,se]=ue(null),[Q,yt]=ue(null),K=Le({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,ee]=ue(null),[E,nt]=ue(null),[it,At]=ue(null),[bt,Ct]=ue(null),ht=Le({x:0,y:0}),[Xt,oe]=ue({x:0,y:0}),be=Le({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}),[ae,Ne]=ue(null),[re,Fe]=ue(null),[$t,Sn]=ue(null),[Ie,Ae]=ue(!1),[qe,rn]=ue(0),[sn,an]=ue(null),He=Le({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}),[j,Ht]=ue(null),[Wt,gn]=ue(null),[he,fe]=ue(null),ge=Le({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[xe,mn]=ue(null),[ln,Qe]=ue(null),[ie,X]=ue(null),ot=ha(),ft=Le(i);ft.current=i;let xt=We(w=>{let k=ft.current;if(!k||k.size===0)return!1;for(let Z of k.keys())try{if(w.matches(Z))return!0}catch(R){}return!1},[]),Pt=Le(t);Pt.current=t;let pt=Le(L);pt.current=L;let Ye=Le([]),cn=Le(o);cn.current=o;let[v,J]=ue(null),V=t.selectedAnnotationIds;Ye.current=V;let wt=We((w,k=!1)=>{e({type:"SELECT_ANNOTATION",payload:{id:w,addToSelection:k}})},[e]),ct=We(()=>{e({type:"SELECT_ANNOTATION",payload:{id:null}})},[e]),[Tt,gt]=ue(null),[Bt,Gt]=ue({x:window.scrollX,y:window.scrollY});Ve(()=>(C(),window.addEventListener("resize",C),()=>window.removeEventListener("resize",C)),[C]),Ve(()=>{let w=()=>{Gt({x:window.scrollX,y:window.scrollY})};return window.addEventListener("scroll",w,{passive:!0}),()=>window.removeEventListener("scroll",w)},[]),Ve(()=>{L?localStorage.setItem(Hi,JSON.stringify(L)):localStorage.removeItem(Hi)},[L]),ya(L,_,q,t.annotations,e);let Qt=Le(G);Qt.current=G,Ve(()=>{if(t.activeTool!=="model"||!t.isAnnotating)return;let w=k=>{if(!k.altKey||!Qt.current)return;k.preventDefault();let Z=k.deltaY>0?-1:1;qt.current=Math.max(0,qt.current+Z);let R=Ot.current;if(R){let O=dr(R,qt.current);_t(O)}};return window.addEventListener("wheel",w,{passive:!1}),()=>window.removeEventListener("wheel",w)},[t.activeTool,t.isAnnotating]),Ve(()=>{t.activeTool!=="model"&&(_t(null),Vt(new Map),qt.current=0,Ot.current=null)},[t.activeTool]),Ve(()=>{var Z;let w=(Z=G==null?void 0:G.name)!=null?Z:null,k=w&&(f!=null&&f.has(w))?w:null;g==null||g(k)},[G,f,g]);let[ce,pe]=ue(null);Ve(()=>{var Z;if(!m){pe(null);return}let w=So(m.name),k=m.instanceIndex;pe((Z=w[k%w.length])!=null?Z:null)},[m]);let[Ue,tn]=ue([]);Ve(()=>{var w,k;if(!x){tn([]);return}(k=(w=x.token)==null?void 0:w.bindings)!=null&&k.length?tn(Gr(x.token)):tn(Yr(x.px))},[x]);let Bn=Le(null),po=Le(null);Bn.current=ae,po.current=re,Ve(()=>{let w=["flex-start","center","flex-end"],k=["flex-start","center","flex-end"],R=null,O=!1,N=null,st=null,F=(dt,It)=>{let Zt=Yn(dt,It);for(;Zt&&Zt!==document.documentElement;){let de=window.getComputedStyle(Zt).display;if(de==="flex"||de==="inline-flex")return Zt;Zt=Zt.parentElement}return null},W=dt=>{let It=window.getComputedStyle(dt).flexDirection;return It==="column"||It==="column-reverse"?"vertical":"horizontal"},S=dt=>{let It=dt.getAttribute("data-pm");return It||(It=Math.random().toString(36).substring(2,8),dt.setAttribute("data-pm",It)),{selector:`[data-pm="${It}"]`,durableSelector:hn(dt)}},I=()=>{O=!0,R&&clearTimeout(R),R=setTimeout(()=>{O=!1,R=null},300)},Y=(dt,It,te)=>{let Zt=W(dt);if(It===Zt){let Yt=window.getComputedStyle(dt).justifyContent,ve=Yt==="normal"||Yt==="flex-start"||Yt==="start"?"flex-start":Yt==="flex-end"||Yt==="end"?"flex-end":Yt==="center"?"center":null;if(!ve)return;let _e=w.indexOf(ve)+te;if(_e<0||_e>=w.length)return;let Dn=w[_e],{selector:Kn,durableSelector:Dr}=S(dt);Jt(dt,"justify-content",Dn),e({type:"MODIFY_STYLES_BATCH",payload:{selector:Kn,durableSelector:Dr,element:Ze(dt),changes:[{property:"justify-content",original:Yt,modified:Dn}]}})}else{let Yt=window.getComputedStyle(dt).flexDirection,ve=Zt==="horizontal"?"column":"row",{selector:En,durableSelector:_e}=S(dt);Jt(dt,"flex-direction",ve),e({type:"MODIFY_STYLES_BATCH",payload:{selector:En,durableSelector:_e,element:Ze(dt),changes:[{property:"flex-direction",original:Yt,modified:ve}]}})}rn(de=>de+1)},A=(dt,It,te)=>{let de=W(dt)==="horizontal"?"vertical":"horizontal";if(It!==de)return;let ve=window.getComputedStyle(dt).alignItems,En=ve==="normal"||ve==="stretch"||ve==="flex-start"||ve==="start"?"flex-start":ve==="flex-end"||ve==="end"?"flex-end":ve==="center"?"center":null;if(!En)return;let Dn=k.indexOf(En)+te;if(Dn<0||Dn>=k.length)return;let Kn=k[Dn],{selector:Dr,durableSelector:Dl}=S(dt);Jt(dt,"align-items",Kn),e({type:"MODIFY_STYLES_BATCH",payload:{selector:Dr,durableSelector:Dl,element:Ze(dt),changes:[{property:"align-items",original:ve,modified:Kn}]}}),rn(Nl=>Nl+1)},D=20,z=null,$=null,lt=0,vt=(dt,It,te)=>{let Zt=F(It,te);an(Zt?{modifier:dt,target:Zt}:null)},ne=dt=>{if(!(t.activeTool!=="hand"||!t.isAnnotating)){if(dt.key==="Shift"&&!dt.altKey){let It=ht.current;vt("shift",It.x,It.y)}else if(dt.key==="Alt"&&!dt.shiftKey){let It=ht.current;vt("alt",It.x,It.y)}}},Kt=dt=>{if(t.activeTool!=="hand"||!t.isAnnotating)return;let It=dt.shiftKey&&!dt.altKey,te=dt.altKey&&!dt.shiftKey;if(!It&&!te||dt.buttons!==0){z=null,$=null,lt=0,N=null,st=null,an(null);return}if(N===null&&(N=dt.clientX,st=dt.clientY,vt(It?"shift":"alt",dt.clientX,dt.clientY)),O)return;z===null&&(z=dt.clientX,$=dt.clientY,lt=0);let Zt=dt.clientX-z,de=dt.clientY-$,Yt=Math.abs(Zt)>=Math.abs(de)?Zt:de;if(Math.abs(Yt)>3){let Kn=Yt>0?1:-1;if(lt!==0&&Kn!==lt){z=dt.clientX,$=dt.clientY,lt=0;return}lt=Kn}if(Math.abs(Zt)<D&&Math.abs(de)<D)return;let ve=F(N,st);if(!ve)return;let En=Math.abs(Zt)>=Math.abs(de)?"horizontal":"vertical",Dn=(En==="horizontal"?Zt:de)>0?1:-1;z=null,$=null,lt=0,It?Y(ve,En,Dn):A(ve,En,Dn),I()},Be=dt=>{(dt.key==="Shift"||dt.key==="Alt")&&(N=null,st=null,z=null,$=null,lt=0,an(null))},ye=()=>{an(null),z=null,$=null,lt=0};return window.addEventListener("keydown",ne),window.addEventListener("mousemove",Kt),window.addEventListener("mousedown",ye),window.addEventListener("keyup",Be),()=>{window.removeEventListener("keydown",ne),window.removeEventListener("mousemove",Kt),window.removeEventListener("mousedown",ye),window.removeEventListener("keyup",Be),R&&clearTimeout(R)}},[t.activeTool,t.isAnnotating,e]),Ve(()=>{let w=k=>{var O,N,st,F;if(k.key==="Escape"){if(pt.current)return;if(t.activeTool==="model"&&St.size>0){k.preventDefault(),Vt(new Map);return}if(Ye.current.length>0){k.preventDefault(),ct();return}}if(k.key==="Enter"&&t.activeTool==="model"&&St.size>0&&p){k.preventDefault();let W=[...St.keys()].filter(S=>!(f!=null&&f.has(S)));W.length>0&&p(W),Vt(new Map);return}if((k.metaKey||k.ctrlKey)&&k.key==="v"&&Dt.current.length>0&&!pt.current){k.preventDefault(),Ft.current++;let W=Ft.current*20,I=((O=Dt.current[0])==null?void 0:O.groupId)?Math.random().toString(36).substring(2,9):void 0,Y=Dt.current.map(D=>b(h({},D),{id:Math.random().toString(36).substring(2,9),groupId:D.groupId?I:void 0,timestamp:Date.now(),points:D.points.map(z=>({x:z.x+W,y:z.y+W}))}));e({type:"PASTE_ANNOTATIONS",payload:{annotations:Y}});let A=Y.find(D=>D.type!=="text")||Y[0];A&&wt(A.id);return}let Z=Ye.current;if(Z.length===0||pt.current)return;let R=(N=k.target)==null?void 0:N.tagName;if(!(R==="INPUT"||R==="TEXTAREA"||(st=k.target)!=null&&st.isContentEditable)&&(k.key==="Delete"||k.key==="Backspace")){if(k.preventDefault(),c){let W=Pt.current.annotations;for(let S of Z){let I=W.find(A=>A.id===S);if(!I)continue;let Y=I.threadId||I.groupId&&((F=W.find(A=>A.groupId===I.groupId&&A.threadId))==null?void 0:F.threadId);Y&&c(Y)}}for(let W of Z)e({type:"DELETE_ANNOTATION",payload:{id:W}});ct()}};return window.addEventListener("keydown",w),()=>window.removeEventListener("keydown",w)},[e,ct,wt,t.activeTool,St,f,p,c]);let Me=Ni(()=>vr(t.annotations),[t.annotations]),kn=Ni(()=>{let w=new Map,k=new Set,Z=1;for(let R of t.annotations)if(!Me.has(R))if(R.groupId){if(!k.has(R.groupId)){k.add(R.groupId);let O=t.annotations.filter(N=>N.groupId===R.groupId);for(let N of O)w.set(N.id,Z);Z++}}else w.set(R.id,Z),Z++;return w},[t.annotations,Me]),cs=Ni(()=>{if(V.length===0)return null;let w=new Map;for(let k of V){let Z=t.annotations.find(O=>O.id===k);if(!Z)continue;let R=Z.groupId?t.annotations.filter(O=>O.groupId===Z.groupId):[Z];for(let O of R)if(O.linkedSelector&&!(i!=null&&i.has(O.linkedSelector))){let N=O.color||t.activeColor;w.set(O.linkedSelector,N)}}return w.size>0?w:null},[V,t.annotations,t.activeColor,i]);Ve(()=>{let w=t.annotations.filter(k=>!(Me.has(k)||L&&!L.isNew&&k.id===L.id));P(w,t.currentPath,t.activeTool,t.activeColor,t.strokeWidth,V,nl,Bt.x,Bt.y,kn)},[t.annotations,t.currentPath,t.activeTool,t.activeColor,t.strokeWidth,P,L,V,Bt,kn,Me]),Ve(()=>{if(B){let w=Math.random().toString(36).substring(2,9);_({id:w,point:B.point,text:"",fontSize:12,isNew:!0,groupId:B.groupId}),U(null)}},[B]),Ve(()=>{tt&&(_({id:Math.random().toString(36).substring(2,9),point:tt.point,text:"",fontSize:12,isNew:!0,linkedSelector:tt.linkedSelector,linkedAnchor:tt.linkedAnchor,elements:tt.elements}),kt(null))},[tt]);let nr=Le(null),or=(hs=L==null?void 0:L.id)!=null?hs:null;Ve(()=>{or&&at.current?requestAnimationFrame(()=>{var Z;let w=at.current;if(!w||(w.focus(),Nt.current===or))return;Nt.current=or;let k=pt.current;if(k){if(nr.current!==null){let R=Math.min(nr.current,w.value.length);w.setSelectionRange(R,R);return}if(!k.isNew&&k.clickPoint){let R=y.current;if(!R)return;let O=R.getContext("2d");if(!O)return;O.font=`${k.fontSize}px ${Ce}`;let N=k.fontSize*1.4,st=k.text.split(`
|
|
8
|
+
`),F=k.clickPoint.y-k.point.y,W=Math.max(0,Math.min(st.length-1,Math.floor(F/N))),S=k.clickPoint.x-k.point.x,I=st[W]||"",Y=0;for(let D=0;D<=I.length;D++){let z=O.measureText(I.substring(0,D)).width;if(z>S){let $=D>0?O.measureText(I.substring(0,D-1)).width:0;Y=S-$<z-S?D-1:D;break}Y=D}let A=Y;for(let D=0;D<W;D++)A+=(((Z=st[D])==null?void 0:Z.length)||0)+1;w.setSelectionRange(A,A)}}}):(Nt.current=null,nr.current=null)},[or,y]);let fo=We(w=>{let k=y.current;if(!k)return{x:0,y:0};let Z=k.getBoundingClientRect(),R,O;if("touches"in w&&w.touches[0])R=w.touches[0].clientX,O=w.touches[0].clientY;else if("clientX"in w)R=w.clientX,O=w.clientY;else return{x:0,y:0};return{x:R-Z.left+window.scrollX,y:O-Z.top+window.scrollY}},[y]),Un=We((w,k,Z,R)=>{let O=Z.x-k.x,N=Z.y-k.y,st=O*O+N*N;if(st===0)return Math.sqrt((w.x-k.x)**2+(w.y-k.y)**2)<=R;let F=Math.max(0,Math.min(1,((w.x-k.x)*O+(w.y-k.y)*N)/st)),W=k.x+F*O,S=k.y+F*N;return Math.sqrt((w.x-W)**2+(w.y-S)**2)<=R},[]),rr=We(w=>{for(let Z=t.annotations.length-1;Z>=0;Z--){let R=t.annotations[Z];if(!R||Me.has(R))continue;let O=(R.strokeWidth||3)+4;switch(R.type){case"text":{if(!R.points[0]||!R.text)continue;let N=R.points[0],st=R.fontSize||12,F=y.current;if(F){let W=F.getContext("2d");if(W){W.font=`${st}px ${Ce}`;let S=R.text.split(`
|
|
9
|
+
`),I=N.x-Bt.x,Y=eo(I),A=Y!==void 0?Math.min(400,Y):void 0,D=A?jn(W,S,A):S,z=A?Math.min(A,Math.max(...D.map(ne=>W.measureText(ne).width))):Math.max(...S.map(ne=>W.measureText(ne).width)),$=D.length*(st*1.4),lt=S.length*(st*1.4),vt=$-lt;if(w.x>=N.x-4-4&&w.x<=N.x+z+4+4&&w.y>=N.y-4-4-vt&&w.y<=N.y+lt+4+4)return R}}break}case"rectangle":{if(R.points.length<2)continue;let N=R.points[0],st=R.points[R.points.length-1],F=Math.min(N.x,st.x),W=Math.max(N.x,st.x),S=Math.min(N.y,st.y),I=Math.max(N.y,st.y),Y=Un(w,{x:F,y:S},{x:W,y:S},O),A=Un(w,{x:F,y:I},{x:W,y:I},O),D=Un(w,{x:F,y:S},{x:F,y:I},O),z=Un(w,{x:W,y:S},{x:W,y:I},O);if(Y||A||D||z)return R;break}case"circle":{if(R.points.length<2)continue;let N=R.points[0],st=R.points[R.points.length-1],F=(N.x+st.x)/2,W=(N.y+st.y)/2,S=Math.abs(st.x-N.x)/2,I=Math.abs(st.y-N.y)/2,Y=w.x-F,A=w.y-W,D=Math.sqrt((Y/S)**2+(A/I)**2);if(Math.abs(D-1)*Math.max(S,I)<=O)return R;break}case"line":{if(R.points.length<2)continue;let N=R.points[0],st=R.points[R.points.length-1];if(Un(w,N,st,O))return R;break}case"freehand":{if(R.points.length<2)continue;for(let N=0;N<R.points.length-1;N++){let st=R.points[N],F=R.points[N+1];if(Un(w,st,F,O))return R}break}}}return null},[t.annotations,y,Un,Me,Bt.x]),ds=We(w=>{let k=rr(w);return(k==null?void 0:k.type)==="text"?k:null},[rr]),us=We(w=>{if(V.length===0)return null;let k=nl/2+4;for(let Z of V){let R=t.annotations.find(O=>O.id===Z);if(!(!R||R.points.length<2)){if(R.type==="line"){let O=R.points[0],N=R.points[R.points.length-1];if(Math.sqrt((w.x-O.x)**2+(w.y-O.y)**2)<=k)return{handle:"start",annotationId:Z};if(Math.sqrt((w.x-N.x)**2+(w.y-N.y)**2)<=k)return{handle:"end",annotationId:Z};continue}if(R.type==="circle"){let O=R.points[0],N=R.points[R.points.length-1],st=Math.min(O.x,N.x),F=Math.max(O.x,N.x),W=Math.min(O.y,N.y),S=Math.max(O.y,N.y),I=(st+F)/2,Y=(W+S)/2,A=[{handle:"top",x:I,y:W},{handle:"bottom",x:I,y:S},{handle:"left",x:st,y:Y},{handle:"right",x:F,y:Y}];for(let{handle:D,x:z,y:$}of A)if(Math.sqrt((w.x-z)**2+(w.y-$)**2)<=k)return{handle:D,annotationId:Z};continue}if(R.type==="rectangle"||R.type==="freehand"){let O=R.points[0],N=R.points[R.points.length-1],st,F,W,S;R.type==="freehand"?(st=Math.min(...R.points.map(Y=>Y.x)),F=Math.max(...R.points.map(Y=>Y.x)),W=Math.min(...R.points.map(Y=>Y.y)),S=Math.max(...R.points.map(Y=>Y.y))):(st=Math.min(O.x,N.x),F=Math.max(O.x,N.x),W=Math.min(O.y,N.y),S=Math.max(O.y,N.y));let I=[{corner:"topLeft",x:st,y:W},{corner:"topRight",x:F,y:W},{corner:"bottomLeft",x:st,y:S},{corner:"bottomRight",x:F,y:S}];for(let{corner:Y,x:A,y:D}of I)if(Math.sqrt((w.x-A)**2+(w.y-D)**2)<=k)return{handle:Y,annotationId:Z}}}}return null},[V,t.annotations]);Ve(()=>{let w=k=>{if(Et.current={x:k.clientX+window.scrollX,y:k.clientY+window.scrollY},!L){let Z=ds(Et.current);et((Z==null?void 0:Z.id)||null)}};return window.addEventListener("mousemove",w),()=>window.removeEventListener("mousemove",w)},[L,ds]);let go=We(()=>{var k;if(!L)return;let w=((k=L.images)==null?void 0:k.length)||0;if(L.text.trim()||w>0)if(L.isNew){let Z=vo();e({type:"ADD_TEXT",payload:h({point:L.point,text:L.text||(w>0?`[${w} image${w>1?"s":""}]`:""),fontSize:L.fontSize,id:Z,groupId:L.groupId,linkedSelector:L.linkedSelector,linkedAnchor:L.linkedAnchor,elements:L.elements},w>0?{imageCount:w}:{})}),w>0&&L.images&&s&&s(Z,L.images)}else e({type:"UPDATE_TEXT",payload:h({id:L.id,text:L.text||(w>0?`[${w} image${w>1?"s":""}]`:"")},w>0?{imageCount:w}:{})}),w>0&&L.images&&s&&s(L.id,L.images);else L.isNew||e({type:"DELETE_ANNOTATION",payload:{id:L.id}});_(null)},[L,e,s]),On=We(w=>{for(let k=0;k<Fi.length-1;k++){let Z=Fi[k],R=Fi[k+1];if(w<=(Z+R)/2)return Z;if(w<R)return R}return Math.round(w/8)*8},[]),ps=We((w,k,Z,R)=>{let O=Z.top+Math.max(R.top,4),N=Z.bottom-Math.max(R.bottom,4),st=Z.left+Math.max(R.left,4),F=Z.right-Math.max(R.right,4);if(w<Z.left||w>Z.right||k<Z.top||k>Z.bottom)return null;let W=k<O,S=k>N,I=w<st,Y=w>F;return W&&I?R.top>=R.left?"top":"left":W&&Y?R.top>=R.right?"top":"right":S&&I?R.bottom>=R.left?"bottom":"left":S&&Y?R.bottom>=R.right?"bottom":"right":W?"top":S?"bottom":I?"left":Y?"right":null},[]),fs=We(w=>{var N,st;if(!t.isAnnotating)return;if(t.inspectedElement&&t.activeTool==="hand"&&!("button"in w&&w.button===2)){w.preventDefault(),w.stopPropagation(),e({type:"SELECT_ELEMENT",payload:null});return}let k=fo(w),Z="shiftKey"in w&&w.shiftKey;if(t.activeTool==="inspector"){if("button"in w&&w.button===2)return;if(mt&&!xt(mt)){let F=Ze(mt),W=hn(mt),S=mt.getBoundingClientRect(),I=mt.getAttribute("data-pm");I||(I=Math.random().toString(36).substring(2,8),mt.setAttribute("data-pm",I));let Y=`[data-pm="${I}"]`,A=t.styleModifications.some(vt=>{try{return mt.matches(vt.selector)}catch(ne){return!1}}),D=t.annotations.filter(vt=>{if(!vt.linkedSelector)return!1;try{return mt.matches(vt.linkedSelector)}catch(ne){return!1}}).length,z=(A?1:0)+D,$=S.top>=oo*(1+z)?"top-left":"bottom-left",lt=ol(S,$,z);kt({point:lt,linkedSelector:Y,linkedAnchor:$,elements:[b(h({},F),{selector:W})]})}return}if(t.activeTool==="model"){if("button"in w&&w.button===2)return;if(G){let F=G.name;if(f!=null&&f.has(F)){u==null||u(F);return}"shiftKey"in w&&w.shiftKey?Vt(S=>{let I=new Map(S);return I.has(F)?I.delete(F):I.set(F,G),I}):St.size===1&&St.has(F)?(p&&p([F]),Vt(new Map)):Vt(new Map([[F,G]]))}return}if(t.activeTool==="hand"&&ae&&re){let F=ae,W=F.getAttribute("data-pm");W||(W=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",W));let S=hn(F),I=`[data-pm="${W}"]`,Y=Ze(F),A=jo(F),D=k.x-window.scrollX,z=k.y-window.scrollY,$=Ie,lt=window.getComputedStyle(F).justifyContent,vt=0;if($){let Kt=Qn(F).find(Be=>Be.axis===re);vt=Kt?re==="column"?Kt.w:Kt.h:0}Jt(F,"transition","none"),be.current={isDragging:!0,hasMoved:!1,axis:re,startX:D,startY:z,originalRow:$?vt:A.row,originalColumn:$?vt:A.column,element:F,elementInfo:b(h({},Y),{selector:I}),selector:I,durableSelector:S,isAuto:$,originalJustifyContent:lt,visualGap:vt},Sn({axis:re,row:$?vt:A.row,column:$?vt:A.column});return}if(t.activeTool==="hand"&&xe&&ln){let F=xe,W=F.getAttribute("data-pm");W||(W=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",W));let S=`[data-pm="${W}"]`,I=Ze(F),{fontSize:Y,lineHeight:A}=Go(F),D=Y>0?A/Y:1.2,z=k.x-window.scrollX,$=k.y-window.scrollY;Jt(F,"transition","none");let lt=hn(F);ge.current={isDragging:!0,property:ln,startX:z,startY:$,originalFontSize:Y,originalLineHeight:A,originalRatio:D,element:F,elementInfo:b(h({},I),{selector:S}),selector:S,durableSelector:lt},X({property:ln,fontSize:Y,lineHeight:A});return}if(t.activeTool==="hand"&&j&&Wt){let F=j,W=F.getAttribute("data-pm");W||(W=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",W));let S=`[data-pm="${W}"]`,I=hn(F),Y=Ze(F),A=to(F),D=F.getBoundingClientRect(),z=Math.floor(D.height/2),$=k.y-window.scrollY;Jt(F,"transition","none"),He.current={isDragging:!0,corner:Wt,startY:$,original:A,maxRadius:z,element:F,elementInfo:b(h({},Y),{selector:S}),selector:S,durableSelector:I},fe({corner:Wt,radius:h({},A)});return}if(t.activeTool==="hand"&&Lt&&E){let F=Lt,W=F.getAttribute("data-pm");W||(W=Math.random().toString(36).substring(2,8),F.setAttribute("data-pm",W));let S=`[data-pm="${W}"]`,I=hn(F),Y=Ze(F),A=ko(F),D=k.x-window.scrollX,z=k.y-window.scrollY;Jt(F,"transition","none"),K.current={isDragging:!0,side:E,startX:D,startY:z,original:A,element:F,elementInfo:b(h({},Y),{selector:S}),selector:S,durableSelector:I},Ct({side:E,padding:h({},A)});return}let R=us(k);if(R){let F=t.annotations.find(W=>W.id===R.annotationId);if(F&&F.type!=="text"&&((N=F.status)!=null?N:"pending")==="pending"){gt({annotationId:R.annotationId,handle:R.handle,startPoint:k,originalPoints:[...F.points],hasMoved:!1});return}}let O=rr(k);if(O&&O.points[0]){if(L&&go(),O.type!=="text"?(wt(O.id,Z),O.color&&e({type:"SET_COLOR",payload:O.color})):Z||ct(),l){let F=O.threadId||(O.groupId?(st=t.annotations.find(W=>W.groupId===O.groupId&&W.threadId))==null?void 0:st.threadId:void 0);F&&l(F)}J({annotation:O,startPoint:k,hasMoved:!1});return}if(Z||ct(),t.activeTool==="text"){L&&go();let F=Math.random().toString(36).substring(2,9);_({id:F,point:k,text:"",fontSize:12,isNew:!0});return}H(!0),e({type:"START_PATH",payload:k})},[t.isAnnotating,t.activeTool,t.inspectedElement,t.annotations,L,V,mt,Lt,E,j,Wt,ae,re,Ie,xe,ln,G,St,f,p,u,l,fo,rr,us,e,wt,ct,go]),gs=We(w=>{var Z,R;let k=fo(w);if(t.activeTool==="inspector"&&t.isAnnotating){let O=k.x-window.scrollX,N=k.y-window.scrollY,st=Yn(O,N),F=st&&xt(st)?null:st;F!==mt&&(se(F),yt(F?Ze(F):null));return}if(t.activeTool==="model"&&t.isAnnotating){let O=k.x-window.scrollX,N=k.y-window.scrollY,st=Yn(O,N);if(st!==Ot.current&&(Ot.current=st,qt.current=0),st){let F=dr(st,qt.current);_t(F)}else _t(null);return}if(t.activeTool==="hand"&&t.isAnnotating){let O=k.x-window.scrollX,N=k.y-window.scrollY;ht.current={x:O,y:N},oe({x:O,y:N});let st=ot.current.cmd,F=ot.current.shift;if(be.current.isDragging){let S=be.current,I=S.element;if(!I)return;if(!S.hasMoved){let z=Math.abs(O-S.startX),$=Math.abs(N-S.startY);if(z<=2&&$<=2)return;S.hasMoved=!0,S.isAuto&&(Jt(I,"justify-content","normal"),Jt(I,"row-gap",`${S.visualGap}px`),Jt(I,"column-gap",`${S.visualGap}px`),Ae(!1))}let Y=S.axis,A=S.originalRow,D=S.originalColumn;if(Y==="column"){let z=O-S.startX;D=S.originalColumn+z,st||(A=S.originalRow+z)}else{let z=N-S.startY;A=S.originalRow+z,st||(D=S.originalColumn+z)}A=Math.max(0,A),D=Math.max(0,D),F&&(A=On(A),D=On(D)),A=Math.round(A),D=Math.round(D),Jt(I,"row-gap",`${A}px`),Jt(I,"column-gap",`${D}px`),Sn({axis:Y,row:A,column:D});return}if(He.current.isDragging){let S=He.current,I=S.element;if(!I)return;let Y=N-S.startY,A=S.corner,D=S.original,z=h({},D);if(st){let $=D[A]+Y;$=Math.max(0,Math.min(S.maxRadius,$)),F&&($=On($)),$=Math.round($),z[A]=$}else{let $=D[A]+Y;$=Math.max(0,Math.min(S.maxRadius,$)),F&&($=On($)),$=Math.round($),z={"top-left":$,"top-right":$,"bottom-right":$,"bottom-left":$}}Jt(I,"border-top-left-radius",`${z["top-left"]}px`),Jt(I,"border-top-right-radius",`${z["top-right"]}px`),Jt(I,"border-bottom-right-radius",`${z["bottom-right"]}px`),Jt(I,"border-bottom-left-radius",`${z["bottom-left"]}px`),fe({corner:A,radius:z});return}if(ge.current.isDragging){let S=ge.current,I=S.element;if(!I)return;let Y=S.property,A=S.originalFontSize,D=S.originalLineHeight,z=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(Y==="font-size"){let lt=O-S.startX;A=S.originalFontSize+lt,A=Math.max(1,A)}else{let lt=N-S.startY;D=S.originalLineHeight+lt,D=Math.max(A,D)}if(F)if(Y==="font-size"){let lt=z[0],vt=Math.abs(A-lt);for(let ne of z){let Kt=Math.abs(A-ne);Kt<vt&&(lt=ne,vt=Kt)}A=lt}else{let lt=A>0?D/A:1.2,vt=Math.round(lt*2)/2;D=A*Math.max(1,vt)}A=Math.round(A),D=Math.round(D*10)/10,Jt(I,"font-size",`${A}px`);let $=A>0?Math.round(D/A*1e3)/1e3:1.2;Jt(I,"line-height",`${$}`),X({property:Y,fontSize:A,lineHeight:D});return}if(K.current.isDragging){let S=K.current,I=S.element;if(!I)return;let Y=S.side,A=S.original,D=A.top,z=A.right,$=A.bottom,lt=A.left;if(Y==="top"){let vt=S.startY-N;D=A.top+vt,st||($=A.bottom+vt)}else if(Y==="bottom"){let vt=N-S.startY;$=A.bottom+vt,st||(D=A.top+vt)}else if(Y==="left"){let vt=S.startX-O;lt=A.left+vt,st||(z=A.right+vt)}else if(Y==="right"){let vt=O-S.startX;z=A.right+vt,st||(lt=A.left+vt)}D=Math.max(0,D),z=Math.max(0,z),$=Math.max(0,$),lt=Math.max(0,lt),F&&(D=On(D),z=On(z),$=On($),lt=On(lt)),D=Math.round(D),z=Math.round(z),$=Math.round($),lt=Math.round(lt),Jt(I,"padding",`${D}px ${z}px ${$}px ${lt}px`),Ct({side:Y,padding:{top:D,right:z,bottom:$,left:lt}});return}let W=Yn(O,N);for(;W&&W.tagName==="A";)W=W.parentElement;{let I=[];W&&I.push(W),j&&j!==W&&I.push(j);let Y=null,A=16,D=null;for(let z of I){let $=z.getBoundingClientRect(),lt=to(z),vt=[["top-left",$.left,$.top+lt["top-left"]],["top-right",$.right,$.top+lt["top-right"]],["bottom-right",$.right,$.bottom-lt["bottom-right"]],["bottom-left",$.left,$.bottom-lt["bottom-left"]]];for(let[ne,Kt,Be]of vt){let ye=Math.hypot(O-Kt,N-Be);ye<A&&(A=ye,Y=ne,D=z)}}if(Y&&D){Ht(D),gn(Y),Lt&&ee(null),E&&nt(null),ae&&Ne(null),re&&Fe(null),Ae(!1),xe&&mn(null),ln&&Qe(null);return}}j&&Ht(null),Wt&&gn(null);{let S=[];W&&fr(W)&&S.push(W);let I=(Z=W==null?void 0:W.parentElement)!=null?Z:null;for(;I&&I!==document.body&&S.length<3;)fr(I)&&S.push(I),I=I.parentElement;for(let Y of S){let D=Qn(Y).find(z=>O>=z.x&&O<=z.x+z.w&&N>=z.y&&N<=z.y+z.h);if(D){Ne(Y),Fe(D.axis),Ae(Xr(Y,D.axis)),Lt&&ee(null),E&&nt(null),xe&&mn(null),ln&&Qe(null);return}}}ae&&Ne(null),re&&Fe(null),Ae(!1);{let I=[];W&&I.push(W),xe&&xe!==W&&I.push(xe);let Y=null,A=1/0,D=null;for(let z of I){if(!Ur(z))continue;let $=Eo(z);if(!$)continue;let lt=O>=$.left&&O<=$.right&&N>=$.top&&N<=$.bottom,vt=[["font-size",$.right,$.top+$.height/2],["line-height",$.left+$.width/2,$.bottom]];for(let[ne,Kt,Be]of vt){let ye=Math.hypot(O-Kt,N-Be);(lt||ye<12)&&ye<A&&(A=ye,Y=ne,D=z)}}Y&&D?(mn(D),Qe(Y)):(xe&&mn(null),ln&&Qe(null))}if(W!==Lt&&ee(W),W){let S=ko(W),I=W.getBoundingClientRect(),Y=ps(O,N,I,S);nt(Y)}else nt(null);return}if(Tt){let{handle:O,originalPoints:N,hasMoved:st}=Tt,F=t.annotations.find(A=>A.id===Tt.annotationId);if(!F)return;let W="metaKey"in w,S=W&&(w.metaKey||w.ctrlKey),I=W&&w.shiftKey,Y;if(F.type==="line"){let A=N[0],D=N[N.length-1];O==="start"?Y=[k,D]:Y=[A,k]}else if(F.type==="freehand"){let A=Math.min(...N.map(Yt=>Yt.x)),D=Math.max(...N.map(Yt=>Yt.x)),z=Math.min(...N.map(Yt=>Yt.y)),$=Math.max(...N.map(Yt=>Yt.y)),lt=(A+D)/2,vt=(z+$)/2,ne=D-A||1,Kt=$-z||1,Be=ne/Kt,ye=A,dt=D,It=z,te=$;switch(O){case"topLeft":ye=k.x,It=k.y;break;case"topRight":dt=k.x,It=k.y;break;case"bottomLeft":ye=k.x,te=k.y;break;case"bottomRight":dt=k.x,te=k.y;break}if(S)switch(O){case"topLeft":dt=D+(A-ye),te=$+(z-It);break;case"topRight":ye=A-(dt-D),te=$+(z-It);break;case"bottomLeft":dt=D+(A-ye),It=z-(te-$);break;case"bottomRight":ye=A-(dt-D),It=z-(te-$);break}if(I){let Yt=dt-ye,ve=te-It;if(Math.abs(Yt/ve)>Be){let _e=Math.abs(ve)*Be*Math.sign(Yt);O==="topLeft"||O==="bottomLeft"?ye=dt-_e:dt=ye+_e}else{let _e=Math.abs(Yt)/Be*Math.sign(ve);O==="topLeft"||O==="topRight"?It=te-_e:te=It+_e}}let Zt=dt-ye||1,de=te-It||1;Y=N.map(Yt=>({x:ye+(Yt.x-A)/ne*Zt,y:It+(Yt.y-z)/Kt*de}))}else if(F.type==="circle"){let A=N[0],D=N[N.length-1],z=Math.min(A.x,D.x),$=Math.max(A.x,D.x),lt=Math.min(A.y,D.y),vt=Math.max(A.y,D.y),ne=(z+$)/2,Kt=(lt+vt)/2,Be=$-z,ye=vt-lt,dt=z,It=$,te=lt,Zt=vt;switch(O){case"top":if(te=k.y,S&&(Zt=Kt+(Kt-k.y)),I){let Yt=(Zt-te)*(Be/ye)/2;dt=ne-Yt,It=ne+Yt}break;case"bottom":if(Zt=k.y,S&&(te=Kt-(k.y-Kt)),I){let Yt=(Zt-te)*(Be/ye)/2;dt=ne-Yt,It=ne+Yt}break;case"left":if(dt=k.x,S&&(It=ne+(ne-k.x)),I){let Yt=(It-dt)*(ye/Be)/2;te=Kt-Yt,Zt=Kt+Yt}break;case"right":if(It=k.x,S&&(dt=ne-(k.x-ne)),I){let Yt=(It-dt)*(ye/Be)/2;te=Kt-Yt,Zt=Kt+Yt}break}Y=[{x:dt,y:te},{x:It,y:Zt}]}else{let A=N[0],D=N[N.length-1],z=Math.min(A.x,D.x),$=Math.max(A.x,D.x),lt=Math.min(A.y,D.y),vt=Math.max(A.y,D.y),ne=(z+$)/2,Kt=(lt+vt)/2,Be=$-z||1,ye=vt-lt||1,dt=Be/ye,It=z,te=$,Zt=lt,de=vt;switch(O){case"topLeft":It=k.x,Zt=k.y;break;case"topRight":te=k.x,Zt=k.y;break;case"bottomLeft":It=k.x,de=k.y;break;case"bottomRight":te=k.x,de=k.y;break}if(S)switch(O){case"topLeft":te=$+(z-It),de=vt+(lt-Zt);break;case"topRight":It=z-(te-$),de=vt+(lt-Zt);break;case"bottomLeft":te=$+(z-It),Zt=lt-(de-vt);break;case"bottomRight":It=z-(te-$),Zt=lt-(de-vt);break}if(I){let Yt=te-It,ve=de-Zt;if(Math.abs(Yt/ve)>dt){let _e=Math.abs(ve)*dt*Math.sign(Yt);O==="topLeft"||O==="bottomLeft"?It=te-_e:te=It+_e}else{let _e=Math.abs(Yt)/dt*Math.sign(ve);O==="topLeft"||O==="topRight"?Zt=de-_e:de=Zt+_e}}Y=[{x:It,y:Zt},{x:te,y:de}]}e({type:"RESIZE_ANNOTATION",payload:{id:Tt.annotationId,points:Y,saveUndo:!st}}),st||gt(b(h({},Tt),{hasMoved:!0}));return}if(v&&((R=v.annotation.status)!=null?R:"pending")==="pending"){let O=k.x-v.startPoint.x,N=k.y-v.startPoint.y;if((Math.abs(O)>2||Math.abs(N)>2)&&!v.hasMoved)J(b(h({},v),{hasMoved:!0,startPoint:k})),e({type:"MOVE_ANNOTATION",payload:{id:v.annotation.id,delta:{x:O,y:N},saveUndo:!0}});else if(v.hasMoved){let F=k.x-v.startPoint.x,W=k.y-v.startPoint.y;J(b(h({},v),{startPoint:k})),e({type:"MOVE_ANNOTATION",payload:{id:v.annotation.id,delta:{x:F,y:W}}})}return}!T||!t.isAnnotating||e({type:"CONTINUE_PATH",payload:k})},[T,t.isAnnotating,t.activeTool,v,Tt,mt,Lt,E,j,Wt,ae,re,xe,ln,fo,e,On,ps]),Or=We(w=>{var R,O,N,st,F,W;if(ge.current.isDragging){let S=ge.current,I=S.element;if(I&&S.selector&&S.elementInfo&&ie){I instanceof HTMLElement&&(I.style.removeProperty("font-size"),I.style.removeProperty("line-height"),I.style.removeProperty("transition"));let Y=[];if(S.originalFontSize!==ie.fontSize&&(Jt(I,"font-size",`${ie.fontSize}px`),Y.push({property:"font-size",original:`${S.originalFontSize}px`,modified:`${ie.fontSize}px`})),S.originalLineHeight!==ie.lineHeight){let A=S.originalFontSize>0?Math.round(S.originalLineHeight/S.originalFontSize*1e3)/1e3:1.2,D=ie.fontSize>0?Math.round(ie.lineHeight/ie.fontSize*1e3)/1e3:1.2;Jt(I,"line-height",`${D}`),Y.push({property:"line-height",original:`${A}`,modified:`${D}`})}Y.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(R=S.durableSelector)!=null?R:void 0,element:S.elementInfo,changes:Y}})}ge.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},X(null);return}if(be.current.isDragging){let S=be.current,I=S.element,Y="button"in w&&w.button===2;if(!S.hasMoved&&!Y&&I&&S.selector&&S.elementInfo){I instanceof HTMLElement&&I.style.removeProperty("transition");let A=["space-between","space-around","stretch","normal"],D=S.originalJustifyContent||"normal",z=A.indexOf(D),$=A[(z+1)%A.length],lt=[];$==="normal"?(Jt(I,"justify-content","normal"),lt.push({property:"justify-content",original:S.originalJustifyContent,modified:"normal"})):$==="stretch"?(Jt(I,"justify-content",$),Jt(I,"row-gap","8px"),Jt(I,"column-gap","8px"),lt.push({property:"justify-content",original:S.originalJustifyContent||"normal",modified:$}),S.originalRow!==8&<.push({property:"row-gap",original:`${S.originalRow}px`,modified:"8px"}),S.originalColumn!==8&<.push({property:"column-gap",original:`${S.originalColumn}px`,modified:"8px"})):(I instanceof HTMLElement&&(I.style.removeProperty("row-gap"),I.style.removeProperty("column-gap")),Jt(I,"justify-content",$),lt.push({property:"justify-content",original:S.originalJustifyContent||"normal",modified:$}),S.originalRow>0&<.push({property:"row-gap",original:`${S.originalRow}px`,modified:"0px"}),S.originalColumn>0&<.push({property:"column-gap",original:`${S.originalColumn}px`,modified:"0px"})),lt.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(O=S.durableSelector)!=null?O:void 0,element:S.elementInfo,changes:lt}})}else if(S.hasMoved&&I&&S.selector&&S.elementInfo&&$t){I instanceof HTMLElement&&(I.style.removeProperty("row-gap"),I.style.removeProperty("column-gap"),I.style.removeProperty("transition"));let A=[];S.isAuto?(I instanceof HTMLElement&&I.style.removeProperty("justify-content"),Jt(I,"justify-content","normal"),Jt(I,"row-gap",`${$t.row}px`),Jt(I,"column-gap",`${$t.column}px`),A.push({property:"justify-content",original:S.originalJustifyContent,modified:"normal"}),A.push({property:"row-gap",original:"0px",modified:`${$t.row}px`}),A.push({property:"column-gap",original:"0px",modified:`${$t.column}px`})):(S.originalRow!==$t.row&&(Jt(I,"row-gap",`${$t.row}px`),A.push({property:"row-gap",original:`${S.originalRow}px`,modified:`${$t.row}px`})),S.originalColumn!==$t.column&&(Jt(I,"column-gap",`${$t.column}px`),A.push({property:"column-gap",original:`${S.originalColumn}px`,modified:`${$t.column}px`}))),A.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(N=S.durableSelector)!=null?N:void 0,element:S.elementInfo,changes:A}})}be.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},Sn(null);return}if(He.current.isDragging){let S=He.current,I=S.element;if(I&&S.selector&&S.elementInfo&&he){I instanceof HTMLElement&&(I.style.removeProperty("border-top-left-radius"),I.style.removeProperty("border-top-right-radius"),I.style.removeProperty("border-bottom-right-radius"),I.style.removeProperty("border-bottom-left-radius"),I.style.removeProperty("transition"));let Y=["top-left","top-right","bottom-right","bottom-left"],A={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},D=[];for(let z of Y)S.original[z]!==he.radius[z]&&(Jt(I,A[z],`${he.radius[z]}px`),D.push({property:A[z],original:`${S.original[z]}px`,modified:`${he.radius[z]}px`}));D.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:S.selector,durableSelector:(st=S.durableSelector)!=null?st:void 0,element:S.elementInfo,changes:D}})}He.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},fe(null);return}if(K.current.isDragging){let S=K.current,I=S.element,Y=S.selector,A=S.elementInfo;if(I&&Y&&A&&bt){let D=S.original,z=bt.padding;I instanceof HTMLElement&&(I.style.removeProperty("padding"),I.style.removeProperty("transition"));let $=[],lt=[{prop:"padding-top",origVal:D.top,newVal:z.top},{prop:"padding-right",origVal:D.right,newVal:z.right},{prop:"padding-bottom",origVal:D.bottom,newVal:z.bottom},{prop:"padding-left",origVal:D.left,newVal:z.left}];for(let{prop:vt,origVal:ne,newVal:Kt}of lt)ne!==Kt&&(Jt(I,vt,`${Kt}px`),$.push({property:vt,original:`${ne}px`,modified:`${Kt}px`}));$.length>0&&e({type:"MODIFY_STYLES_BATCH",payload:{selector:Y,durableSelector:(F=S.durableSelector)!=null?F:void 0,element:A,changes:$}})}K.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},Ct(null);return}if(Tt){gt(null);return}if(v){if(!v.hasMoved&&v.annotation.type==="text"&&((W=v.annotation.status)!=null?W:"pending")==="pending"){let S=fo(w);_({id:v.annotation.id,point:v.annotation.points[0],text:v.annotation.text||"",fontSize:v.annotation.fontSize||12,isNew:!1,clickPoint:S,groupId:v.annotation.groupId})}J(null);return}if(!T)return;let k=5;if(t.currentPath.length>=2){let S=t.currentPath[0],I=t.currentPath[t.currentPath.length-1],Y=Math.abs(I.x-S.x),A=Math.abs(I.y-S.y);if((t.activeTool==="line"?Math.sqrt(Y*Y+A*A)<k:Y<k&&A<k)&&["rectangle","circle","line"].includes(t.activeTool)){H(!1),e({type:"CANCEL_PATH"});return}}let Z=$r(t.currentPath);if(t.activeTool==="rectangle"&&t.currentPath.length>=2){let S=t.currentPath[0],I=t.currentPath[t.currentPath.length-1],Y=Math.min(S.x,I.x),A=Math.max(S.y,I.y),D=t.strokeWidth/2,z=Math.random().toString(36).substring(2,9);U({point:{x:Y-D+4,y:A+D+4},groupId:z}),H(!1),e({type:"FINISH_PATH",payload:{groupId:z,elements:Z}});return}H(!1),e({type:"FINISH_PATH",payload:{elements:Z}})},[T,v,Tt,bt,he,$t,ie,fo,e,t.activeTool,t.currentPath,t.strokeWidth]),Tl=We(w=>{let k=w.target.value;nr.current=w.target.selectionStart,_(Z=>Z&&b(h({},Z),{text:k}))},[]),Il=We(w=>{w.key==="Escape"?_(null):w.key==="Enter"&&!w.shiftKey&&(w.preventDefault(),go())},[go]),Ml=We(w=>{if(!L)return;let k=w.clipboardData.items,Z=[];for(let R=0;R<k.length;R++){let O=k[R];if(O.type.startsWith("image/")){let N=O.getAsFile();N&&Z.push(N)}}Z.length>0&&(w.preventDefault(),_(R=>R?b(h({},R),{images:[...R.images||[],...Z]}):null))},[L]),Ll=We(w=>{if(!t.isAnnotating)return;if(t.activeTool==="hand"){w.preventDefault();let Z=Lt||ae||j||xe;if(Z&&!xt(Z)){let R=Ze(Z),O=hn(Z);e({type:"SELECT_ELEMENT",payload:{el:Z,info:b(h({},R),{selector:O})}})}return}w.preventDefault();let k=y.current;k&&(M.current=!0,k.style.pointerEvents="none",setTimeout(()=>{M.current&&(M.current=!1,k.style.pointerEvents="")},4e3))},[t.activeTool,t.isAnnotating,Lt,ae,j,xe,e,xt,y]);Ve(()=>{let w=t.annotations.filter(N=>N.linkedSelector);if(w.length===0)return;let k=null,Z=()=>{var st,F,W;let N=[];for(let S of w){let I=document.querySelector(S.linkedSelector);if(!I&&((F=(st=S.elements)==null?void 0:st[0])!=null&&F.selector)&&S.linkedSelector.startsWith("[data-pm=")){try{I=document.querySelector(S.elements[0].selector)}catch(Kt){}if(I){let Kt=(W=S.linkedSelector.match(/data-pm="([^"]+)"/))==null?void 0:W[1];Kt&&I.setAttribute("data-pm",Kt)}}if(!I)continue;let Y=I.getBoundingClientRect(),A=t.styleModifications.some(Kt=>{try{return I.matches(Kt.selector)}catch(Be){return!1}}),D=w.filter(Kt=>Kt.id!==S.id&&Kt.timestamp<S.timestamp&&Kt.linkedSelector===S.linkedSelector).length,z=(A?1:0)+D,$=Y.top>=oo*(1+z)?"top-left":"bottom-left",lt=ol(Y,$,z),vt=S.points[0],ne=$!==S.linkedAnchor;vt&&(ne||Math.abs(lt.x-vt.x)>1||Math.abs(lt.y-vt.y)>1)&&N.push({id:S.id,point:lt,linkedAnchor:ne?$:void 0})}N.length>0&&e({type:"UPDATE_LINKED_POSITIONS",payload:{updates:N}})},R=()=>{k&&cancelAnimationFrame(k),k=requestAnimationFrame(Z)};Z(),window.addEventListener("scroll",R,!0),window.addEventListener("resize",R,!0),window.addEventListener("load",R),document.fonts.ready.then(R);let O=new MutationObserver(R);return O.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",R,!0),window.removeEventListener("resize",R,!0),window.removeEventListener("load",R),O.disconnect(),k&&cancelAnimationFrame(k)}},[t.annotations,e]);let Rl=()=>{var w,k,Z;if(!t.isAnnotating)return"default";if(Tt){let{handle:R}=Tt;return R==="start"||R==="end"?"move":R==="top"||R==="bottom"?"ns-resize":R==="left"||R==="right"?"ew-resize":R==="topLeft"||R==="bottomRight"?"nwse-resize":"nesw-resize"}if(t.activeTool==="text")return"text";if(t.activeTool==="hand"){let R=(w=$t==null?void 0:$t.axis)!=null?w:re;if(R==="row")return"ns-resize";if(R==="column")return"ew-resize";if(he||Wt)return"ns-resize";let O=(k=ie==null?void 0:ie.property)!=null?k:ln;if(O==="font-size")return"ew-resize";if(O==="line-height")return"ns-resize";let N=(Z=bt==null?void 0:bt.side)!=null?Z:E;return N==="top"||N==="bottom"?"ns-resize":N==="left"||N==="right"?"ew-resize":"default"}return"crosshair"},Al={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:t.isAnnotating?"auto":"none",visibility:t.isAnnotating?"visible":"hidden",cursor:Rl()},zo=We(()=>{let w=y.current;if(!w||!L)return{width:100,height:12*1.4,isWrapped:!1};let k=w.getContext("2d");if(!k)return{width:100,height:L.fontSize*1.4,isWrapped:!1};k.font=`${L.fontSize}px ${Ce}`;let R=k.measureText("Type here...").width,O=L.text.split(`
|
|
10
|
+
`),N=O.length>0?Math.max(R,...O.map(I=>k.measureText(I||" ").width)):R,st=L.point.x-Bt.x,F=eo(st);if(F!==void 0&&N>F){let I=jn(k,O,F),Y=Math.min(F,Math.max(R,...I.map(D=>k.measureText(D).width))),A=Math.max(1,I.length)*L.fontSize*1.4;return{width:Y,height:A,isWrapped:!0}}let S=Math.max(1,O.length)*L.fontSize*1.4;return{width:N,height:S,isWrapped:!1}},[L,y,Bt.x])(),Pl=L?Math.max(1,L.text.split(`
|
|
11
|
+
`).length)*L.fontSize*1.4+8:0,ms=zo.height+8,Bl=zo.isWrapped?ms-Pl:0,Ol=L?{position:"fixed",left:L.point.x-4-Bt.x,top:L.point.y-4-Bt.y-Bl,zIndex:9999,width:zo.width+8,height:ms,padding:4,fontSize:L.fontSize,fontFamily:Ce,color:"#ffffff",backgroundColor:t.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:zo.isWrapped?"pre-wrap":"pre",wordBreak:zo.isWrapped?"break-word":void 0}:{};return Po(Bo,{children:[le("canvas",{ref:y,id:"devtools-canvas",style:Al,onMouseDown:fs,onMouseMove:gs,onMouseUp:w=>Or(w),onMouseLeave:w=>Or(w),onTouchStart:fs,onTouchMove:gs,onTouchEnd:w=>Or(w),onContextMenu:Ll}),L&&Po(Bo,{children:[le("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),le("textarea",{id:"devtools-text-input",ref:at,value:L.text,onChange:Tl,onKeyDown:Il,onPaste:Ml,onBlur:go,placeholder:"Type here...",style:Ol}),L.images&&L.images.length>0&&Po("div",{"data-devtools":!0,style:{position:"fixed",left:L.point.x-4-Bt.x,top:L.point.y-4-Bt.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:[L.images.length," image",L.images.length>1?"s":""," attached"]})]}),t.isAnnotating&&t.activeTool!=="hand"&&t.styleModifications.length>0&&le(Oa,{styleModifications:t.styleModifications,isInspecting:!!t.inspectedElement,accentColor:t.activeColor,annotationGroupCount:new Set(t.annotations.map(w=>w.groupId||w.id)).size,dispatch:e,inFlightSelectors:r}),t.activeTool==="hand"&&t.isAnnotating&&t.styleModifications.length>0&&le(Na,{styleModifications:t.styleModifications,accentColor:t.activeColor}),t.isAnnotating&&le(ka,{annotations:t.annotations,supersededAnnotations:Me,inFlightIds:n,scrollX:Bt.x,scrollY:Bt.y,annotationGroupMap:kn,onViewThread:l,onSelectAnnotation:wt}),t.isAnnotating&&((d==null?void 0:d.status)==="awaiting_approval"||(d==null?void 0:d.status)==="planning")&&d.threadId&&l&&le(Ea,{annotations:t.annotations,supersededAnnotations:Me,scrollX:Bt.x,scrollY:Bt.y,annotationGroupMap:kn,planThreadId:d.threadId,taskCount:(bs=(ys=d.tasks)==null?void 0:ys.length)!=null?bs:0,planStatus:d.status,onViewThread:l,onSelectAnnotation:wt}),t.isAnnotating&&a&&le(Ca,{annotations:t.annotations,supersededAnnotations:Me,scrollX:Bt.x,scrollY:Bt.y,onReply:a,annotationGroupMap:kn}),t.isAnnotating&&i&&i.size>0&&le(pi,{inFlightSelectorColors:i}),t.isAnnotating&&cs&&le(pi,{inFlightSelectorColors:cs,animated:!1}),t.activeTool==="hand"&&t.isAnnotating&&($t?be.current.element:ae)&&le(yi,{element:$t?be.current.element:ae,gap:$t?{row:$t.row,column:$t.column}:jo(ae),accentColor:t.activeColor,hoveredAxis:re,draggingAxis:(xs=$t==null?void 0:$t.axis)!=null?xs:null,cursorViewport:Xt,isAutoGap:Ie,refreshKey:qe}),t.activeTool==="hand"&&t.isAnnotating&&sn&&le(tl,{element:sn.target,modifier:sn.modifier,accentColor:t.activeColor,refreshKey:qe}),t.activeTool==="hand"&&t.isAnnotating&&!sn&&(he?He.current.element:j)&&le(Ra,{element:he?He.current.element:j,radius:(vs=he==null?void 0:he.radius)!=null?vs:to(j),accentColor:t.activeColor,hoveredCorner:Wt,draggingCorner:(Ss=he==null?void 0:he.corner)!=null?Ss:null,cursorViewport:Xt}),t.activeTool==="hand"&&t.isAnnotating&&!sn&&(ie?ge.current.element:xe)&&le(el,{element:ie?ge.current.element:xe,fontSize:(ws=ie==null?void 0:ie.fontSize)!=null?ws:Go(xe).fontSize,lineHeight:(ks=ie==null?void 0:ie.lineHeight)!=null?ks:Go(xe).lineHeight,accentColor:t.activeColor,hoveredProperty:ln,draggingProperty:(Es=ie==null?void 0:ie.property)!=null?Es:null,cursorViewport:Xt}),t.activeTool==="hand"&&t.isAnnotating&&!sn&&(bt?K.current.element:Lt)&&le(ki,{element:bt?K.current.element:Lt,padding:(Cs=bt==null?void 0:bt.padding)!=null?Cs:ko(Lt),accentColor:t.activeColor,hoveredSide:E,draggingSide:(Ts=bt==null?void 0:bt.side)!=null?Ts:null,cursorViewport:Xt,refreshKey:ie?ie.fontSize+ie.lineHeight*1e3:0}),t.activeTool==="inspector"&&t.isAnnotating&&le(Bo,{children:mt&&!t.inspectedElement&&(()=>{let w=!!tt||!!(L!=null&&L.linkedSelector)||t.annotations.some(k=>{if(!k.linkedSelector)return!1;try{return mt.matches(k.linkedSelector)}catch(Z){return!1}});return le(To,{element:mt,isSelected:!1,elementInfo:Q,color:t.activeColor,hideTooltip:w})})()}),t.activeTool==="model"&&t.isAnnotating&&St.size>0&&[...St.entries()].map(([w,k])=>le(To,{element:k.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:k.rootElement.tagName.toLowerCase(),reactComponent:w},color:"#8b5cf6"},w)),t.activeTool==="model"&&t.isAnnotating&&ce&&le(To,{element:ce.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:ce.rootElement.tagName.toLowerCase(),reactComponent:ce.name},color:"#22c55e"}),t.activeTool==="model"&&t.isAnnotating&&Ue.length>0&&Ue.map((w,k)=>le("div",{style:{position:"absolute",left:w.x,top:w.y,width:w.width,height:w.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:w.direction==="vertical"?Po(Bo,{children:[le("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),le("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),le("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),le("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:w.height<16?-6:"50%",transform:w.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(w.height)})]}):Po(Bo,{children:[le("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),le("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),le("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),le("div",{style:{position:"absolute",left:w.width<30?0:"50%",top:(w.width<30,void 0),bottom:"calc(50% + 4px)",transform:w.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(w.width)})]})},k)),t.activeTool==="model"&&t.isAnnotating&&G&&le(To,{element:G.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:G.rootElement.tagName.toLowerCase(),reactComponent:G.name},color:f!=null&&f.has(G.name)?"#22c55e":"#8b5cf6"}),t.activeTool==="hand"&&t.isAnnotating&&t.inspectedElement&&Po(Bo,{children:[it&&it!=="padding"&&it!=="gap"&&(()=>{var F;let w=new Set(t.annotations.map(W=>W.groupId||W.id)).size,k=t.inspectedElement.info.selector,Z=t.styleModifications.findIndex(W=>W.selector===k),R=Z>=0?w+Z+1:w+t.styleModifications.length+1,O=t.styleModifications.find(W=>W.selector===k),N=(F=O==null?void 0:O.changes.length)!=null?F:0,st=!!(O!=null&&O.captured);return le(To,{element:t.inspectedElement.el,isSelected:!0,elementInfo:t.inspectedElement.info,color:st?"#999999":t.activeColor,annotationNumber:R,changeCount:N})})(),it==="padding"&&le(ki,{element:t.inspectedElement.el,padding:ko(t.inspectedElement.el),accentColor:t.activeColor,hoveredSide:null,draggingSide:null}),it==="gap"&&le(yi,{element:t.inspectedElement.el,gap:jo(t.inspectedElement.el),accentColor:t.activeColor,hoveredAxis:null,draggingAxis:null}),le(qa,{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:At,accentColor:t.activeColor})]})]})}import{useCallback as vn,useEffect as Ln,useMemo as Yi,useRef as De,useState as Zo}from"react";import{Circle as Xu,Component as Uu,Hand as Ku,MessageCircle as Zu,Pen as qu,Slash as Qu,Square as tp,Trash2 as ep,Type as np}from"lucide-react";import{useEffect as ku,useRef as Eu}from"react";function il(t,e,o,n,r){let i=Eu(0);ku(()=>{if(!o.current||(localStorage.setItem(r.expanded,String(t)),!t))return;let s=e.annotations.length;(s>=i.current||s===0||!n)&&(localStorage.setItem(r.annotations,JSON.stringify(e.annotations)),i.current=s),localStorage.setItem(r.styleMods,JSON.stringify(e.styleModifications)),localStorage.setItem(r.spacingChanges,JSON.stringify(e.spacingTokenChanges)),localStorage.setItem(r.tool,e.activeTool),localStorage.setItem(r.color,e.activeColor),localStorage.setItem(r.stroke,String(e.strokeWidth)),e.inspectedElement?localStorage.setItem(r.inspected,JSON.stringify({selector:e.inspectedElement.info.selector,info:e.inspectedElement.info})):localStorage.removeItem(r.inspected)},[t,e.annotations,e.styleModifications,e.spacingTokenChanges,e.activeTool,e.activeColor,e.strokeWidth,e.inspectedElement,n,o,r])}import{Component as Cu,createElement as Tu,useCallback as Rr,useEffect as Do,useRef as Oo,useState as Mn}from"react";import{Fragment as No,jsx as jt,jsxs as nn}from"react/jsx-runtime";var sl="popmelt-library-tab",Iu=/^#[0-9a-fA-F]{3,8}$/,Mu=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,Lu=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),Ru=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function al(t){let e=t.trim();return Iu.test(e)||Mu.test(e)||Lu.has(e.toLowerCase())}function Au(t){return Ru.test(t.trim())}function Pu(t){let e=t.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return e?parseFloat(e[1]):null}function zi(t,e=""){if(t==null)return[];if(typeof t!="object")return[[e,String(t)]];if(Array.isArray(t))return[[e,t.map(String).join(", ")]];let o=[];for(let[n,r]of Object.entries(t)){let i=e?`${e}.${n}`:n;if(r!==null&&typeof r=="object"&&!Array.isArray(r)){let s=r;typeof s.value=="string"?o.push([i,s.value]):o.push(...zi(r,i))}else o.push([i,Array.isArray(r)?r.map(String).join(", "):String(r!=null?r:"")])}return o}function Bu(t){return t.length===0?"generic":t.filter(([,n])=>al(n)).length>t.length/2?"colors":t.filter(([,n])=>Au(n)).length>t.length/2?"spacing":"generic"}var Ou=b(h({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"}),ll={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},Du=b(h({},ll),{color:"#1f2937",borderBottom:"1.5px solid #1f2937"});function Nu({entries:t}){let e=[],o=[];for(let n of t)al(n[1])?e.push(n):o.push(n);return nn(No,{children:[e.length>0&&jt("div",{style:{display:"flex",flexWrap:"wrap",gap:2,marginBottom:o.length>0?6:0},children:e.map(([n,r])=>jt("div",{title:`${n.split(".").pop()}: ${r}`,style:{width:28,height:28,backgroundColor:r,outline:"1px solid rgba(0,0,0,0.08)",outlineOffset:-1}},n))}),o.length>0&&jt($i,{entries:o})]})}var Lr=[0,1,2,4,8,12,16,20,24,28,32];function Fu(t){if(t<=32){let e=Lr[0],o=Math.abs(t-e);for(let n=1;n<Lr.length;n++){let r=Math.abs(t-Lr[n]);r<o&&(e=Lr[n],o=r)}return e}return Math.round(t/8)*8}function Hu({label:t,value:e,px:o,tokenPath:n,rawToken:r,onHover:i,onModify:s,onDelete:a}){let[l,c]=Mn(!1),[d,p]=Mn(null),u=Oo(!1),g=Oo(0),f=Oo(0),m=Oo([]),x=d!==null?d:o,y=d!==null?`${d}px`:e,P=d!==null,C=Rr(T=>{T.preventDefault(),u.current=!0,g.current=T.clientX,f.current=o;let H=ur(r);m.current=jr(H);let L=q=>{let et=q.clientX-g.current,B=Math.max(0,Math.round(f.current+et));q.shiftKey&&(B=Fu(B));for(let U of m.current)U.element.style.setProperty(U.property,B+"px","important");p(B),i==null||i({name:t,px:B,token:H})},_=()=>{window.removeEventListener("mousemove",L),window.removeEventListener("mouseup",_),document.body.style.cursor="",u.current=!1,p(q=>{if(q!==null&&q!==o&&s){let et=ur(r),B=et.bindings&&et.bindings.length>0,U;if(B){let Nt=Jr(et.bindings,f.current,q);U=JSON.stringify(b(h({},et),{value:`${q}px`,bindings:Nt}))}else{let Nt=oa(m.current,f.current),Et=ra(m.current);if(Nt.length>0){let Dt=Jr(Nt,f.current,q);U=JSON.stringify({value:`${q}px`,property:Et,bindings:Dt})}else U=`${q}px`}let tt=typeof r=="string"?r:JSON.stringify(r),kt=m.current.map(Nt=>({selector:hn(Nt.element),property:Nt.property})),at=sa(m.current,f.current,q);s({tokenPath:n,originalValue:tt,currentValue:U,targets:kt,originalPx:f.current,currentPx:q},{id:Math.random().toString(36).substring(2,9),tokenPath:n,tokenName:t,originalPx:f.current,newPx:q,affectedElements:at})}return q})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",L),window.addEventListener("mouseup",_)},[o,t,n,r,i,s]),M=ur(r);return nn("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",fontSize:11,padding:"1px 0",cursor:"ew-resize",userSelect:"none"},onMouseEnter:()=>{u.current||(c(!0),i==null||i({name:t,px:x,token:M}))},onMouseLeave:()=>{u.current||(c(!1),i==null||i(null))},onMouseDown:C,children:[jt("span",{style:{color:l||P?"#FF0000":"#9ca3af"},children:t}),nn("span",{style:{display:"flex",alignItems:"center",gap:4},children:[jt("span",{style:{color:l||P?"#FF0000":"#6b7280",fontWeight:600},children:y}),a&&l&&!P&&jt("button",{type:"button",title:"Remove token",onMouseDown:T=>{T.stopPropagation();let H=typeof r=="string"?r:JSON.stringify(r);a(n,H)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:T=>{T.currentTarget.style.color="#FF0000"},onMouseLeave:T=>{T.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function _u({entries:t,categoryKey:e,rawTokens:o,onHover:n,onModify:r,onDelete:i}){let s=[],a=[];for(let l of t){let c=Pu(l[1]);c!==null?s.push([l[0],l[1],c]):a.push(l)}return nn(No,{children:[s.length>0&&jt("div",{style:{display:"flex",flexDirection:"column",gap:2},children:s.map(([l,c,d])=>{let p=l.split(".").pop(),u=o?zu(o,l):c,g=u&&typeof u=="object"&&"value"in u?u:c;return jt(Hu,{label:p,value:c,px:d,tokenPath:`tokens.${e}.${l}`,rawToken:g,onHover:n,onModify:r,onDelete:i},l)})}),a.length>0&&jt($i,{entries:a})]})}function zu(t,e){let o=e.split("."),n=t;for(let r of o){if(n==null||typeof n!="object")return;n=n[r]}return n}function $i({entries:t}){return jt("div",{style:{display:"flex",flexDirection:"column",gap:3},children:t.map(([e,o])=>nn("div",{style:{fontSize:11},children:[jt("div",{style:{color:"#9ca3af",fontSize:10,marginBottom:1},children:e}),jt("div",{style:{color:"#1f2937",lineHeight:1.4,paddingLeft:8},children:o})]},e))})}function cl({entries:t,categoryKey:e,rawTokens:o,onSpacingHover:n,onModifyToken:r,onDeleteToken:i}){let s=Bu(t);return s==="colors"?jt(Nu,{entries:t}):s==="spacing"?jt(_u,{entries:t,categoryKey:e,rawTokens:o,onHover:n,onModify:r,onDelete:i}):jt($i,{entries:t})}function $u(t){let e=t.toLowerCase(),o=null,n=document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT,{acceptNode(i){return i.closest("#devtools-toolbar, #devtools-canvas, #devtools-scrim, [data-popmelt-panel]")?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}}),r=n.currentNode;for(;r=n.nextNode();){let i=r,s=Object.keys(i).find(l=>l.startsWith("__reactFiber$")||l.startsWith("__reactInternalInstance$"));if(!s)continue;let a=i[s];for(;a;){let l=a.type,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 p=h({},a.memoizedProps);return delete p.ref,{type:l,props:p}}if(!o){if(d.length>=4&&e.includes(d)){let p=h({},a.memoizedProps);delete p.ref,o={type:l,props:p}}else if(e.length>=4&&d.includes(e)){let p=h({},a.memoizedProps);delete p.ref,o={type:l,props:p}}}}a=a.return}}return o}var _i=class extends Cu{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 Wu({children:t}){return jt("div",{style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:6},children:t})}function Yu({tokens:t,onSpacingTokenHover:e,onModifyToken:o,onDeleteToken:n}){return!t||Object.keys(t).length===0?jt("div",{style:{color:"#9ca3af",fontSize:11},children:"No tokens defined yet."}):jt(No,{children:Object.entries(t).map(([r,i])=>nn("div",{style:{marginBottom:14},children:[jt(Wu,{children:r}),jt(cl,{entries:zi(i),categoryKey:r,rawTokens:i,onSpacingHover:e,onModifyToken:o,onDeleteToken:n})]},r))})}function ju({rules:t}){return!t||t.length===0?jt("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."}):jt(No,{children:t.map((e,o)=>nn("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[nn("span",{style:{color:"#9ca3af",flexShrink:0},children:[o+1,"."]}),jt("span",{children:e})]},o))})}function Gu({name:t,value:e,selected:o,highlighted:n,onRemove:r,onHover:i}){var q;let[s,a]=Mn(!1),[l,c]=Mn(!1),d=Oo(null),p=Oo(0),[u,g]=Mn(0),[f,m]=Mn(0),x=zi(e),y=(q=x.find(([et])=>et==="description"))==null?void 0:q[1];Do(()=>{if(!l&&!n){g(0),m(0),p.current=0;return}let et=So(t);g(et.length)},[l,n,t]),Do(()=>{o&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[o]);let P=o||n||l,C=o?"139,92,246":"34,197,94",M=o?"#8b5cf6":"#22c55e",T=P?`rgba(${C},0.06)`:void 0,H=P?`inset 0 0 0 1.5px rgba(${C},0.35)`:void 0,L=n||l,_=Rr(()=>{let et=So(t);if(et.length===0)return;let B=p.current%et.length;et[B].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),m(B),p.current=B+1,i==null||i({name:t,instanceIndex:B})},[t,i]);return nn("div",{ref:d,onClick:_,onMouseEnter:()=>{c(!0),i==null||i({name:t,instanceIndex:0})},onMouseLeave:()=>{c(!1),i==null||i(null)},style:{marginBottom:8,background:T,padding:6,boxShadow:H,cursor:"pointer"},children:[nn("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[nn("div",{style:{display:"flex",alignItems:"center",gap:6,marginBottom:6},children:[jt("div",{style:{fontWeight:700,fontSize:11,letterSpacing:"0.05em",padding:"2px 6px",backgroundColor:L?M:"transparent",color:L?"#fff":"#6b7280"},children:t}),L&&u>1&&nn("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[f+1,"/",u]})]}),r&&l&&jt("button",{type:"button",title:"Remove from model",onClick:et=>{et.stopPropagation(),r(t)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:et=>{et.currentTarget.style.color="#FF0000"},onMouseLeave:et=>{et.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),y&&jt("div",{style:{fontSize:11,color:L?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:y}),s?jt(cl,{entries:x.filter(([et])=>et!=="description"),categoryKey:""}):jt(Ju,{name:t,onNotFound:()=>a(!0),entries:x})]})}function Ju({name:t,onNotFound:e}){let[o,n]=Mn(null),[r,i]=Mn(!1);return Do(()=>{let s=$u(t);s||e(),n(s),i(!0)},[t,e]),!r||!o?null:jt(_i,{onError:e,children:jt("div",{"data-popmelt-panel":!0,onClick:s=>{s.preventDefault(),s.stopPropagation()},style:{width:"100%",overflowY:"auto",overflowX:"hidden",maxHeight:150,padding:"1rem",outline:"1px solid rgba(0,0,0,0.06)",backgroundColor:"rgb(250,250,250)",boxSizing:"border-box",marginBottom:4,display:"flex",flexDirection:"column",justifyContent:"stretch",alignItems:"center"},children:jt("div",{style:{zoom:.5},children:Tu(o.type,o.props)})})})}function Vu({components:t,selectedComponent:e,hoveredComponent:o,onRemove:n,onHover:r}){if(!t||Object.keys(t).length===0)return jt("div",{style:{color:"#9ca3af",fontSize:11},children:"No component patterns defined yet."});let i=new Set(Object.keys(t)),s=zr(i),a=Object.entries(t).sort(([l],[c])=>{var d,p;return((d=s.get(l))!=null?d:1/0)-((p=s.get(c))!=null?p:1/0)});return jt(No,{children:a.map(([l,c])=>jt(Gu,{name:l,value:c,selected:e===l,highlighted:o===l,onRemove:n,onHover:r},l))})}function dl({bridgeUrl:t,modelRefreshKey:e,onMouseEnter:o,onMouseLeave:n,selectedComponent:r,hoveredComponent:i,onComponentHover:s,onSpacingTokenHover:a,onModifySpacingToken:l,onDeleteSpacingToken:c,onComponentAdded:d,onComponentRemoved:p}){let[u,g]=Mn(void 0),[f,m]=Mn(!0),[x,y]=Mn(()=>{try{let B=localStorage.getItem(sl);if(B==="tokens"||B==="components"||B==="rules")return B}catch(B){}return"components"});Do(()=>{mo(t).then(B=>{g(B),m(!1)})},[t,e]),Do(()=>{try{localStorage.setItem(sl,x)}catch(B){}},[x]),Do(()=>{r&&(y("components"),mo(t).then(B=>{B&&g(B)}))},[r,t]);let P=Rr((B,U)=>{g(tt=>{if(!(tt!=null&&tt.tokens))return tt;let kt=JSON.parse(JSON.stringify(tt.tokens)),at=B.split("."),Nt=kt;for(let Et=1;Et<at.length-1;Et++)if(Nt=Nt[at[Et]],!Nt)return tt;return delete Nt[at[at.length-1]],b(h({},tt),{tokens:kt})}),c==null||c(B,U)},[c]),C=Rr(B=>{g(U=>{if(!(U!=null&&U.components))return U;let at=U.components,{[B]:tt}=at,kt=Wn(at,[sr(B)]);return b(h({},U),{components:kt})}),p==null||p(B)},[p]),M=u==null?void 0:u.tokens,T=u==null?void 0:u.components,H=u==null?void 0:u.rules,L=M&&Object.keys(M).length>0,_=T&&Object.keys(T).length>0,q=H&&H.length>0,et=!u||!L&&!_&&!q;return nn("div",{style:Ou,onMouseEnter:o,onMouseLeave:n,children:[nn("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[jt("span",{children:"Model"}),jt("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"M"})]}),jt("div",{style:{display:"flex",gap:12,marginBottom:10,borderBottom:"1px solid rgba(0,0,0,0.08)",paddingBottom:6},children:["components","rules"].map(B=>jt("button",{type:"button",style:x===B?Du:ll,onClick:()=>y(B),children:B.charAt(0).toUpperCase()+B.slice(1)},B))}),jt("div",{style:{flex:1,overflowY:"auto",minHeight:0},children:f?jt("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):et?jt("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):nn(No,{children:[x==="components"&&jt(Vu,{components:T,selectedComponent:r,hoveredComponent:i,onRemove:C,onHover:s}),x==="tokens"&&jt(Yu,{tokens:M,onSpacingTokenHover:a,onModifyToken:l,onDeleteToken:c?P:void 0}),x==="rules"&&jt(ju,{rules:H})]})})]})}import{jsx as ul}from"react/jsx-runtime";var _n={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#f3f4f6",bgHover:"#f9fafb",separator:"#e5e7eb"};function zn({children:t,active:e,siblingActive:o,disabled:n,onClick:r,title:i}){let s=()=>n?.4:o&&!e?.5:1,a={position:"relative",display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,borderRadius:0,border:"none",cursor:n?"default":"pointer",transition:"background-color 150ms ease, color 150ms ease, transform 100ms ease, opacity 150ms ease",backgroundColor:e?_n.bgActive:"transparent",color:e?_n.iconActive:_n.iconDefault,opacity:s()};return ul("button",{type:"button",onClick:n?void 0:r,title:i,disabled:n,style:a,onMouseEnter:l=>{n||(l.currentTarget.style.opacity="1",e||(l.currentTarget.style.backgroundColor=_n.bgHover))},onMouseLeave:l=>{n||(l.currentTarget.style.opacity=String(s()),e||(l.currentTarget.style.backgroundColor="transparent"))},onMouseDown:l=>{n||(l.currentTarget.style.transform="scale(0.95)")},onMouseUp:l=>{n||(l.currentTarget.style.transform="scale(1)")},children:t})}function Wi(){return ul("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as lo,jsx as rt,jsxs as we}from"react/jsx-runtime";var co=[{type:"rectangle",icon:tp,label:"Rectangle",shortcut:"R"},{type:"circle",icon:Xu,label:"Oval",shortcut:"O"},{type:"line",icon:Qu,label:"Line",shortcut:"L"},{type:"freehand",icon:qu,label:"Pen",shortcut:"P"}],op=new Set(co.map(t=>t.type));function rp(t,e,o,n,r,i,s,a){let l=(t-r)*(n-i)-(o-r)*(e-i),c=(t-s)*(i-a)-(r-s)*(e-a),d=(t-o)*(a-n)-(s-o)*(e-n),p=l<0||c<0||d<0,u=l>0||c>0||d>0;return!(p&&u)}function ip(){let t=window.innerWidth-16,e=t-326,o=window.innerHeight-80;return{left:e,right:t,y:o}}var sp=[{type:"text",icon:np,label:"Text",shortcut:"T"}],pl={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.
|
|
12
12
|
|
|
13
|
-
Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},ap=b(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)"}),ji="devtools-toolbar-expanded",Gi="devtools-annotations",Ji="devtools-style-modifications",Vi="devtools-active-tool",fl="devtools-active-color",gl="devtools-stroke-width",ml="devtools-inspected-element",Xi="devtools-spacing-changes",lp={expanded:ji,annotations:Gi,styleMods:Ji,spacingChanges:Xi,tool:Vi,color:fl,stroke:gl,inspected:ml};function cp(){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 dp(){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 hl({state:t,dispatch:e,onScreenshot:o,onSendToClaude:n,onPlanGoal:r,hasActiveJobs:i,activeJobColor:s,onCrosshairHover:a,onClear:l,provider:c="claude",onProviderChange:d,availableProviders:p,modelIndex:u=0,modelCount:g=2,modelLabel:f="Opus 4.6",onModelChange:h,onViewThread:x,isThreadPanelOpen:y,activePlan:P,mcpStatus:C,onInstallMcp:M,mcpJustInstalled:T,bridgeUrl:z,isBridgeConnected:R,modelSelectedComponent:H,modelCanvasHoveredComponent:q,onModelComponentHover:et,onSpacingTokenHover:B,onModifySpacingToken:U,onDeleteSpacingToken:tt,modelRefreshKey:kt,onModelComponentAdded:at,onModelComponentRemoved:Nt}){let[Et,Dt]=Zo(()=>typeof window=="undefined"?!1:localStorage.getItem(ji)==="true"),[Ft,G]=Zo(0),_t=De(0),St=De(0),Vt=De(t.isAnnotating),qt=De(!1),Ot=De(typeof window!="undefined"?localStorage.getItem(Vi):null),mt=De(typeof window!="undefined"?localStorage.getItem(fl):null),se=De(typeof window!="undefined"?localStorage.getItem(gl):null),{charIndex:Q}=Sr(!!i),[yt,Z]=Zo(null),Lt=De(!1),ee=De(null),E=De(null),nt=De({x:0,y:0}),it=De(null),At=De(null),bt=De(null),Ct=vn(()=>{it.current=null,At.current=null,bt.current&&(clearTimeout(bt.current),bt.current=null)},[]),ht=vn(X=>{E.current&&(clearTimeout(E.current),E.current=null),Lt.current?(it.current=X,At.current=m({},nt.current),bt.current&&clearTimeout(bt.current),bt.current=setTimeout(()=>{it.current&&(Z(it.current),Ct())},300)):(ee.current&&clearTimeout(ee.current),ee.current=setTimeout(()=>{Lt.current=!0,Z(X),ee.current=null},500))},[Ct]),Xt=vn(()=>{Ct(),ee.current&&(clearTimeout(ee.current),ee.current=null),E.current=setTimeout(()=>{Lt.current=!1,Z(null)},150)},[Ct]),oe=vn(X=>{if(nt.current={x:X.clientX,y:X.clientY},it.current&&At.current){let ot=At.current,ft=ip();rp(X.clientX,X.clientY,ot.x,ot.y,ft.left,ft.y,ft.right,ft.y)||(Z(it.current),Ct())}},[Ct]),be=Yi(()=>{let X=(p!=null?p:[]).map(ot=>ot==="claude"?"Claude":ot==="codex"?"Codex":ot);return{name:"AI Model",desc:X.length>1?`${X.join(" and ")} are available.`:X.length===1?`Connected to ${X[0]}.`:"No AI providers detected.",usage:X.length>1?["Click the logo to switch between providers","Click the model name to switch tiers"]:["Click the model name to switch tiers"],keys:X.length>1?[{key:"Click",desc:"Switch"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]:[{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]}},[p]);il(Et,t,qt,!!i,lp),Ln(()=>{if(localStorage.getItem(ji)==="true"&&!t.isAnnotating){if(Et||Dt(!0),e({type:"SET_TOOL",payload:Ot.current||"inspector"}),e({type:"SET_ANNOTATING",payload:!0}),mt.current&&e({type:"SET_COLOR",payload:mt.current}),se.current){let pt=parseFloat(se.current);isNaN(pt)||e({type:"SET_STROKE_WIDTH",payload:pt})}let ot=localStorage.getItem(Gi);if(ot)try{let pt=JSON.parse(ot);Array.isArray(pt)&&pt.length>0&&e({type:"RESTORE_ANNOTATIONS",payload:{annotations:pt}})}catch(pt){}let ft=localStorage.getItem(Ji);if(ft)try{let pt=JSON.parse(ft);Array.isArray(pt)&&pt.length>0&&(e({type:"RESTORE_STYLE_MODIFICATIONS",payload:pt}),gr(pt))}catch(pt){}let xt=localStorage.getItem(Xi);if(xt)try{let pt=JSON.parse(xt);Array.isArray(pt)&&pt.length>0&&e({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:pt})}catch(pt){}let Pt=localStorage.getItem(ml);if(Pt)try{let{selector:pt,info:Ye}=JSON.parse(Pt);if(pt){let cn=Ke(pt);if(cn){let v=Ye||b(m({},Ze(cn)),{selector:pt});e({type:"SELECT_ELEMENT",payload:{el:cn,info:v}})}}}catch(pt){}}return qt.current=!0,()=>{qt.current=!1}},[]);let ae=De(t.styleModifications);Ln(()=>{let X=ae.current,ot=t.styleModifications;X!==ot&&(mr(X),gr(ot),ae.current=ot)},[t.styleModifications]),Ln(()=>{let X=Vt.current;Vt.current=t.isAnnotating,X&&!t.isAnnotating&&Et&&Dt(!1)},[t.isAnnotating,Et]);let Ne=De(Et);Ne.current=Et,Ln(()=>{let X=ft=>{if(ft.key==="Meta"||ft.key==="Control"){let xt=Date.now();if(xt-_t.current<300){if(St.current++,St.current>=2){if(Ne.current)e({type:"SET_ANNOTATING",payload:!1}),Dt(!1);else{let Ye=localStorage.getItem(Vi);e({type:"SET_TOOL",payload:Ye||"inspector"}),e({type:"SET_ANNOTATING",payload:!0}),Dt(!0)}St.current=0}}else St.current=1;_t.current=xt}else St.current=0},ot=ft=>{ft.key!=="Meta"&&ft.key!=="Control"&&(St.current=0)};return window.addEventListener("keydown",X),window.addEventListener("keyup",ot),()=>{window.removeEventListener("keydown",X),window.removeEventListener("keyup",ot)}},[e]);let re=vn(X=>{Ct(),e({type:"SET_TOOL",payload:X}),t.isAnnotating||e({type:"SET_ANNOTATING",payload:!0}),Lt.current=!1,Z(null),ee.current&&(clearTimeout(ee.current),ee.current=null),E.current&&(clearTimeout(E.current),E.current=null)},[e,t.isAnnotating,Ct]),Fe=vn(async()=>{window.focus(),await o()},[o]),$t=vn(async()=>{let X=t.annotations.filter(xt=>{var Pt;return((Pt=xt.status)!=null?Pt:"pending")==="pending"}),ot=t.styleModifications.filter(xt=>!xt.captured),ft=X.some(xt=>xt.type!=="text");if(r){let xt=X.filter(pt=>pt.type==="text"&&pt.text),Pt=xt.find(pt=>pt.text.toLowerCase().startsWith("/plan "));if(Pt){let pt=Pt.text.replace(/^\/plan\s+/i,""),Ye=xt.filter(v=>v!==Pt&&v.text).map(v=>v.text),cn=[pt,...Ye].join(". ");await r(cn);return}}n&&await n()},[n,r,t.annotations,t.styleModifications,t.spacingTokenChanges]),Sn=vn(()=>{e({type:"SET_ANNOTATING",payload:!1}),Dt(!1)},[e]),Ie=vn(()=>{mr(t.styleModifications),document.querySelectorAll("[data-pm]").forEach(X=>X.removeAttribute("data-pm")),e({type:"CLEAR"}),e({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(Gi),localStorage.removeItem(Ji),localStorage.removeItem(Xi),xe(null),l==null||l()},[e,t.styleModifications,l]),[Ae,qe]=Zo(29),rn=De(null),sn=De(null),an=De(!1),He=vn(X=>{let ot=X.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return ot&&ot[1]?parseFloat(ot[1]):null},[]);Ln(()=>{an.current=!0;let X=`oklch(0.628 0.258 ${Ae})`;e({type:"SET_COLOR",payload:X}),requestAnimationFrame(()=>{an.current=!1})},[Ae,e]),Ln(()=>{if(an.current)return;let X=He(t.activeColor);X!==null&&Math.abs(X-Ae)>.5&&qe(X)},[t.activeColor,He,Ae]);let j=t.annotations.length>0;Ln(()=>{let X=sn.current;if(!X||!j)return;let ot=ft=>{ft.preventDefault(),ft.stopPropagation();let xt=ft.deltaY>0?-1:1,Pt=((Ae+xt)%360+360)%360,pt=`oklch(0.628 0.258 ${Pt})`;qe(Pt),t.selectedAnnotationIds.length>0&&e({type:"UPDATE_ANNOTATION_COLOR",payload:{id:t.lastSelectedId||t.selectedAnnotationIds[0],color:pt}})};return X.addEventListener("wheel",ot,{passive:!1}),()=>X.removeEventListener("wheel",ot)},[j,t.selectedAnnotationIds,t.lastSelectedId,Ae,e]);let Ht=De(!1),Wt=vn(()=>{Ht.current=!1,rn.current=setTimeout(()=>{Ht.current=!0,qe(29)},500)},[]),gn=vn(()=>{rn.current&&(clearTimeout(rn.current),rn.current=null)},[]);Ln(()=>()=>{rn.current&&clearTimeout(rn.current),bt.current&&clearTimeout(bt.current)},[]);let he=Yi(()=>vr(t.annotations),[t.annotations]),fe=Yi(()=>{let X=[],ot=new Set;for(let ft of t.annotations)if(!he.has(ft))if(ft.groupId){if(!ot.has(ft.groupId)){ot.add(ft.groupId);let xt=t.annotations.filter(pt=>pt.groupId===ft.groupId&&!he.has(pt)),Pt=xt.find(pt=>pt.type!=="text")||xt[0];X.push({id:Pt.id,annotations:xt})}}else X.push({id:ft.id,annotations:[ft]});return X},[t.annotations,he]),[ge,xe]=Zo(null),mn=fe.length+t.styleModifications.length;Ln(()=>{(mn===0||ge!==null&&ge>=mn)&&xe(null)},[mn,ge]),Ln(()=>{if(t.selectedAnnotationIds.length===0&&!t.inspectedElement){xe(null);return}if(t.selectedAnnotationIds.length>0){let X=t.selectedAnnotationIds[0],ot=fe.findIndex(ft=>ft.id===X||ft.annotations.some(xt=>xt.id===X));ot>=0&&ot!==ge&&xe(ot)}},[t.selectedAnnotationIds,t.inspectedElement,fe]);let ln=vn(()=>{var ot;if(mn===0)return;let X;if(ge===null?X=0:X=(ge+1)%mn,xe(X),X<fe.length){let ft=fe[X];if(!ft)return;e({type:"SELECT_ELEMENT",payload:null}),e({type:"SELECT_ANNOTATION",payload:{id:ft.id}});let xt=ft.annotations.find(ct=>ct.type!=="text")||ft.annotations[0];if(ft.annotations.some(ct=>ct.linkedSelector))e({type:"SET_TOOL",payload:"inspector"});else if(xt!=null&&xt.type&&xt.type!=="text"&&xt.type!=="inspector"){e({type:"SET_TOOL",payload:xt.type});let ct=co.findIndex(Tt=>Tt.type===xt.type);ct>=0&&G(ct)}if(xt!=null&&xt.color){e({type:"SET_COLOR",payload:xt.color});let ct=He(xt.color);ct!==null&&qe(ct)}let pt=ft.annotations.flatMap(ct=>ct.points);if(pt.length===0)return;let Ye=Math.min(...pt.map(ct=>ct.x)),cn=Math.max(...pt.map(ct=>ct.x)),v=Math.min(...pt.map(ct=>ct.y)),J=Math.max(...pt.map(ct=>ct.y)),V=(Ye+cn)/2,wt=(v+J)/2;if(window.scrollTo({left:V-window.innerWidth/2,top:wt-window.innerHeight/2,behavior:"smooth"}),y&&x){let ct=(ot=ft.annotations.find(Tt=>Tt.threadId))==null?void 0:ot.threadId;ct&&x(ct)}}else{let ft=X-fe.length,xt=t.styleModifications[ft];if(!xt)return;let Pt=Ke(xt.selector);if(!Pt)return;e({type:"SELECT_ANNOTATION",payload:{id:null}}),e({type:"SET_TOOL",payload:"inspector"}),e({type:"SELECT_ELEMENT",payload:{el:Pt,info:xt.element}});let pt=Pt.getBoundingClientRect(),Ye=pt.left+pt.width/2+window.scrollX,cn=pt.top+pt.height/2+window.scrollY;window.scrollTo({left:Ye-window.innerWidth/2,top:cn-window.innerHeight/2,behavior:"smooth"})}},[fe,t.styleModifications,mn,ge,e,He,y,x]);Ln(()=>{if(!Et)return;let X=ot=>{let ft=document.activeElement;if((ft==null?void 0:ft.tagName)==="INPUT"||(ft==null?void 0:ft.tagName)==="TEXTAREA")return;if((ot.metaKey||ot.ctrlKey)&&ot.key==="Enter"){(n||r)&&(t.annotations.length>0||t.styleModifications.length>0||t.spacingTokenChanges.filter(pt=>!pt.captured).length>0)&&(ot.preventDefault(),$t());return}if((ot.metaKey||ot.ctrlKey)&&(ot.key==="c"||ot.key==="C"||ot.code==="KeyC")){(t.annotations.length>0||t.styleModifications.length>0)&&(ot.preventDefault(),window.focus(),Fe());return}if((ot.metaKey||ot.ctrlKey)&&(ot.key==="Backspace"||ot.key==="Delete")){ot.preventDefault(),Ie();return}if(ot.metaKey||ot.ctrlKey||ot.altKey)return;let xt={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand"};if(ot.key.toLowerCase()==="m"){ot.preventDefault(),re("model");return}let Pt=xt[ot.key.toLowerCase()];if(Pt){ot.preventDefault();let pt=co.findIndex(Ye=>Ye.type===Pt);pt>=0&&G(pt),re(Pt)}};return window.addEventListener("keydown",X),()=>window.removeEventListener("keydown",X)},[Et,re,Fe,$t,n,r,Ie,t.annotations.length,t.styleModifications.length,t.spacingTokenChanges,yt]);let Qe=b(m({},ap),{borderRadius:0,padding:Et?"0 8px":"0",width:Et?"auto":48,height:48,gap:0,justifyContent:Et?"flex-start":"center"}),ie=R===!1?"rgba(239, 68, 68, 0.4)":i&&s?s:_n.iconActive;return Et?we(lo,{children:[rt("style",{children:`
|
|
13
|
+
Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},ap=b(h({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)"}),ji="devtools-toolbar-expanded",Gi="devtools-annotations",Ji="devtools-style-modifications",Vi="devtools-active-tool",fl="devtools-active-color",gl="devtools-stroke-width",ml="devtools-inspected-element",Xi="devtools-spacing-changes",lp={expanded:ji,annotations:Gi,styleMods:Ji,spacingChanges:Xi,tool:Vi,color:fl,stroke:gl,inspected:ml};function cp(){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 dp(){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 hl({state:t,dispatch:e,onScreenshot:o,onSendToClaude:n,onPlanGoal:r,hasActiveJobs:i,activeJobColor:s,onCrosshairHover:a,onClear:l,provider:c="claude",onProviderChange:d,availableProviders:p,modelIndex:u=0,modelCount:g=2,modelLabel:f="Opus 4.6",onModelChange:m,onViewThread:x,isThreadPanelOpen:y,activePlan:P,mcpStatus:C,onInstallMcp:M,mcpJustInstalled:T,bridgeUrl:H,isBridgeConnected:L,modelSelectedComponent:_,modelCanvasHoveredComponent:q,onModelComponentHover:et,onSpacingTokenHover:B,onModifySpacingToken:U,onDeleteSpacingToken:tt,modelRefreshKey:kt,onModelComponentAdded:at,onModelComponentRemoved:Nt}){let[Et,Dt]=Zo(()=>typeof window=="undefined"?!1:localStorage.getItem(ji)==="true"),[Ft,G]=Zo(0),_t=De(0),St=De(0),Vt=De(t.isAnnotating),qt=De(!1),Ot=De(typeof window!="undefined"?localStorage.getItem(Vi):null),mt=De(typeof window!="undefined"?localStorage.getItem(fl):null),se=De(typeof window!="undefined"?localStorage.getItem(gl):null),{charIndex:Q}=Sr(!!i),[yt,K]=Zo(null),Lt=De(!1),ee=De(null),E=De(null),nt=De({x:0,y:0}),it=De(null),At=De(null),bt=De(null),Ct=vn(()=>{it.current=null,At.current=null,bt.current&&(clearTimeout(bt.current),bt.current=null)},[]),ht=vn(X=>{E.current&&(clearTimeout(E.current),E.current=null),Lt.current?(it.current=X,At.current=h({},nt.current),bt.current&&clearTimeout(bt.current),bt.current=setTimeout(()=>{it.current&&(K(it.current),Ct())},300)):(ee.current&&clearTimeout(ee.current),ee.current=setTimeout(()=>{Lt.current=!0,K(X),ee.current=null},500))},[Ct]),Xt=vn(()=>{Ct(),ee.current&&(clearTimeout(ee.current),ee.current=null),E.current=setTimeout(()=>{Lt.current=!1,K(null)},150)},[Ct]),oe=vn(X=>{if(nt.current={x:X.clientX,y:X.clientY},it.current&&At.current){let ot=At.current,ft=ip();rp(X.clientX,X.clientY,ot.x,ot.y,ft.left,ft.y,ft.right,ft.y)||(K(it.current),Ct())}},[Ct]),be=Yi(()=>{let X=(p!=null?p:[]).map(ot=>ot==="claude"?"Claude":ot==="codex"?"Codex":ot);return{name:"AI Model",desc:X.length>1?`${X.join(" and ")} are available.`:X.length===1?`Connected to ${X[0]}.`:"No AI providers detected.",usage:X.length>1?["Click the logo to switch between providers","Click the model name to switch tiers"]:["Click the model name to switch tiers"],keys:X.length>1?[{key:"Click",desc:"Switch"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]:[{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]}},[p]);il(Et,t,qt,!!i,lp),Ln(()=>{if(localStorage.getItem(ji)==="true"&&!t.isAnnotating){if(Et||Dt(!0),e({type:"SET_TOOL",payload:Ot.current||"inspector"}),e({type:"SET_ANNOTATING",payload:!0}),mt.current&&e({type:"SET_COLOR",payload:mt.current}),se.current){let pt=parseFloat(se.current);isNaN(pt)||e({type:"SET_STROKE_WIDTH",payload:pt})}let ot=localStorage.getItem(Gi);if(ot)try{let pt=JSON.parse(ot);Array.isArray(pt)&&pt.length>0&&e({type:"RESTORE_ANNOTATIONS",payload:{annotations:pt}})}catch(pt){}let ft=localStorage.getItem(Ji);if(ft)try{let pt=JSON.parse(ft);Array.isArray(pt)&&pt.length>0&&(e({type:"RESTORE_STYLE_MODIFICATIONS",payload:pt}),gr(pt))}catch(pt){}let xt=localStorage.getItem(Xi);if(xt)try{let pt=JSON.parse(xt);Array.isArray(pt)&&pt.length>0&&e({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:pt})}catch(pt){}let Pt=localStorage.getItem(ml);if(Pt)try{let{selector:pt,info:Ye}=JSON.parse(Pt);if(pt){let cn=Ke(pt);if(cn){let v=Ye||b(h({},Ze(cn)),{selector:pt});e({type:"SELECT_ELEMENT",payload:{el:cn,info:v}})}}}catch(pt){}}return qt.current=!0,()=>{qt.current=!1}},[]);let ae=De(t.styleModifications);Ln(()=>{let X=ae.current,ot=t.styleModifications;X!==ot&&(mr(X),gr(ot),ae.current=ot)},[t.styleModifications]),Ln(()=>{let X=Vt.current;Vt.current=t.isAnnotating,X&&!t.isAnnotating&&Et&&Dt(!1)},[t.isAnnotating,Et]);let Ne=De(Et);Ne.current=Et,Ln(()=>{let X=ft=>{if(ft.key==="Meta"||ft.key==="Control"){let xt=Date.now();if(xt-_t.current<300){if(St.current++,St.current>=2){if(Ne.current)e({type:"SET_ANNOTATING",payload:!1}),Dt(!1);else{let Ye=localStorage.getItem(Vi);e({type:"SET_TOOL",payload:Ye||"inspector"}),e({type:"SET_ANNOTATING",payload:!0}),Dt(!0)}St.current=0}}else St.current=1;_t.current=xt}else St.current=0},ot=ft=>{ft.key!=="Meta"&&ft.key!=="Control"&&(St.current=0)};return window.addEventListener("keydown",X),window.addEventListener("keyup",ot),()=>{window.removeEventListener("keydown",X),window.removeEventListener("keyup",ot)}},[e]);let re=vn(X=>{Ct(),e({type:"SET_TOOL",payload:X}),t.isAnnotating||e({type:"SET_ANNOTATING",payload:!0}),Lt.current=!1,K(null),ee.current&&(clearTimeout(ee.current),ee.current=null),E.current&&(clearTimeout(E.current),E.current=null)},[e,t.isAnnotating,Ct]),Fe=vn(async()=>{window.focus(),await o()},[o]),$t=vn(async()=>{let X=t.annotations.filter(xt=>{var Pt;return((Pt=xt.status)!=null?Pt:"pending")==="pending"}),ot=t.styleModifications.filter(xt=>!xt.captured),ft=X.some(xt=>xt.type!=="text");if(r){let xt=X.filter(pt=>pt.type==="text"&&pt.text),Pt=xt.find(pt=>pt.text.toLowerCase().startsWith("/plan "));if(Pt){let pt=Pt.text.replace(/^\/plan\s+/i,""),Ye=xt.filter(v=>v!==Pt&&v.text).map(v=>v.text),cn=[pt,...Ye].join(". ");await r(cn);return}}n&&await n()},[n,r,t.annotations,t.styleModifications,t.spacingTokenChanges]),Sn=vn(()=>{e({type:"SET_ANNOTATING",payload:!1}),Dt(!1)},[e]),Ie=vn(()=>{mr(t.styleModifications),document.querySelectorAll("[data-pm]").forEach(X=>X.removeAttribute("data-pm")),e({type:"CLEAR"}),e({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(Gi),localStorage.removeItem(Ji),localStorage.removeItem(Xi),xe(null),l==null||l()},[e,t.styleModifications,l]),[Ae,qe]=Zo(29),rn=De(null),sn=De(null),an=De(!1),He=vn(X=>{let ot=X.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return ot&&ot[1]?parseFloat(ot[1]):null},[]);Ln(()=>{an.current=!0;let X=`oklch(0.628 0.258 ${Ae})`;e({type:"SET_COLOR",payload:X}),requestAnimationFrame(()=>{an.current=!1})},[Ae,e]),Ln(()=>{if(an.current)return;let X=He(t.activeColor);X!==null&&Math.abs(X-Ae)>.5&&qe(X)},[t.activeColor,He,Ae]);let j=t.annotations.length>0;Ln(()=>{let X=sn.current;if(!X||!j)return;let ot=ft=>{ft.preventDefault(),ft.stopPropagation();let xt=ft.deltaY>0?-1:1,Pt=((Ae+xt)%360+360)%360,pt=`oklch(0.628 0.258 ${Pt})`;qe(Pt),t.selectedAnnotationIds.length>0&&e({type:"UPDATE_ANNOTATION_COLOR",payload:{id:t.lastSelectedId||t.selectedAnnotationIds[0],color:pt}})};return X.addEventListener("wheel",ot,{passive:!1}),()=>X.removeEventListener("wheel",ot)},[j,t.selectedAnnotationIds,t.lastSelectedId,Ae,e]);let Ht=De(!1),Wt=vn(()=>{Ht.current=!1,rn.current=setTimeout(()=>{Ht.current=!0,qe(29)},500)},[]),gn=vn(()=>{rn.current&&(clearTimeout(rn.current),rn.current=null)},[]);Ln(()=>()=>{rn.current&&clearTimeout(rn.current),bt.current&&clearTimeout(bt.current)},[]);let he=Yi(()=>vr(t.annotations),[t.annotations]),fe=Yi(()=>{let X=[],ot=new Set;for(let ft of t.annotations)if(!he.has(ft))if(ft.groupId){if(!ot.has(ft.groupId)){ot.add(ft.groupId);let xt=t.annotations.filter(pt=>pt.groupId===ft.groupId&&!he.has(pt)),Pt=xt.find(pt=>pt.type!=="text")||xt[0];X.push({id:Pt.id,annotations:xt})}}else X.push({id:ft.id,annotations:[ft]});return X},[t.annotations,he]),[ge,xe]=Zo(null),mn=fe.length+t.styleModifications.length;Ln(()=>{(mn===0||ge!==null&&ge>=mn)&&xe(null)},[mn,ge]),Ln(()=>{if(t.selectedAnnotationIds.length===0&&!t.inspectedElement){xe(null);return}if(t.selectedAnnotationIds.length>0){let X=t.selectedAnnotationIds[0],ot=fe.findIndex(ft=>ft.id===X||ft.annotations.some(xt=>xt.id===X));ot>=0&&ot!==ge&&xe(ot)}},[t.selectedAnnotationIds,t.inspectedElement,fe]);let ln=vn(()=>{var ot;if(mn===0)return;let X;if(ge===null?X=0:X=(ge+1)%mn,xe(X),X<fe.length){let ft=fe[X];if(!ft)return;e({type:"SELECT_ELEMENT",payload:null}),e({type:"SELECT_ANNOTATION",payload:{id:ft.id}});let xt=ft.annotations.find(ct=>ct.type!=="text")||ft.annotations[0];if(ft.annotations.some(ct=>ct.linkedSelector))e({type:"SET_TOOL",payload:"inspector"});else if(xt!=null&&xt.type&&xt.type!=="text"&&xt.type!=="inspector"){e({type:"SET_TOOL",payload:xt.type});let ct=co.findIndex(Tt=>Tt.type===xt.type);ct>=0&&G(ct)}if(xt!=null&&xt.color){e({type:"SET_COLOR",payload:xt.color});let ct=He(xt.color);ct!==null&&qe(ct)}let pt=ft.annotations.flatMap(ct=>ct.points);if(pt.length===0)return;let Ye=Math.min(...pt.map(ct=>ct.x)),cn=Math.max(...pt.map(ct=>ct.x)),v=Math.min(...pt.map(ct=>ct.y)),J=Math.max(...pt.map(ct=>ct.y)),V=(Ye+cn)/2,wt=(v+J)/2;if(window.scrollTo({left:V-window.innerWidth/2,top:wt-window.innerHeight/2,behavior:"smooth"}),y&&x){let ct=(ot=ft.annotations.find(Tt=>Tt.threadId))==null?void 0:ot.threadId;ct&&x(ct)}}else{let ft=X-fe.length,xt=t.styleModifications[ft];if(!xt)return;let Pt=Ke(xt.selector);if(!Pt)return;e({type:"SELECT_ANNOTATION",payload:{id:null}}),e({type:"SET_TOOL",payload:"inspector"}),e({type:"SELECT_ELEMENT",payload:{el:Pt,info:xt.element}});let pt=Pt.getBoundingClientRect(),Ye=pt.left+pt.width/2+window.scrollX,cn=pt.top+pt.height/2+window.scrollY;window.scrollTo({left:Ye-window.innerWidth/2,top:cn-window.innerHeight/2,behavior:"smooth"})}},[fe,t.styleModifications,mn,ge,e,He,y,x]);Ln(()=>{if(!Et)return;let X=ot=>{let ft=document.activeElement;if((ft==null?void 0:ft.tagName)==="INPUT"||(ft==null?void 0:ft.tagName)==="TEXTAREA")return;if((ot.metaKey||ot.ctrlKey)&&ot.key==="Enter"){(n||r)&&(t.annotations.length>0||t.styleModifications.length>0||t.spacingTokenChanges.filter(pt=>!pt.captured).length>0)&&(ot.preventDefault(),$t());return}if((ot.metaKey||ot.ctrlKey)&&(ot.key==="c"||ot.key==="C"||ot.code==="KeyC")){(t.annotations.length>0||t.styleModifications.length>0)&&(ot.preventDefault(),window.focus(),Fe());return}if((ot.metaKey||ot.ctrlKey)&&(ot.key==="Backspace"||ot.key==="Delete")){ot.preventDefault(),Ie();return}if(ot.metaKey||ot.ctrlKey||ot.altKey)return;let xt={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand"};if(ot.key.toLowerCase()==="m"){ot.preventDefault(),re("model");return}let Pt=xt[ot.key.toLowerCase()];if(Pt){ot.preventDefault();let pt=co.findIndex(Ye=>Ye.type===Pt);pt>=0&&G(pt),re(Pt)}};return window.addEventListener("keydown",X),()=>window.removeEventListener("keydown",X)},[Et,re,Fe,$t,n,r,Ie,t.annotations.length,t.styleModifications.length,t.spacingTokenChanges,yt]);let Qe=b(h({},ap),{borderRadius:0,padding:Et?"0 8px":"0",width:Et?"auto":48,height:48,gap:0,justifyContent:Et?"flex-start":"center"}),ie=L===!1?"rgba(239, 68, 68, 0.4)":i&&s?s:_n.iconActive;return Et?we(lo,{children:[rt("style",{children:`
|
|
14
14
|
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
|
|
15
|
-
`}),rt("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),!y&&(yt==="model"||t.activeTool==="model")&&rt(dl,{bridgeUrl:
|
|
15
|
+
`}),rt("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),!y&&(yt==="model"||t.activeTool==="model")&&rt(dl,{bridgeUrl:H,selectedComponent:_,hoveredComponent:q,onComponentHover:et,onSpacingTokenHover:B,onModifySpacingToken:U,onDeleteSpacingToken:tt,modelRefreshKey:kt,onComponentAdded:at,onComponentRemoved:Nt,onMouseEnter:()=>{Ct(),E.current&&(clearTimeout(E.current),E.current=null)},onMouseLeave:t.activeTool==="model"?void 0:Xt}),yt&&yt!=="model"&&(yt==="provider"||pl[yt])&&(()=>{let X=yt==="provider"?be:pl[yt];return we("div",{onMouseEnter:yt==="collapse"?()=>{Ct(),E.current&&(clearTimeout(E.current),E.current=null)}:void 0,onMouseLeave:yt==="collapse"?Xt:void 0,style:h(b(h({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}),yt!=="collapse"?{pointerEvents:"none"}:{}),children:[yt==="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"})})}),we("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[rt("span",{children:X.name}),X.keys[0]&&rt("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:X.keys[0].key})]}),rt("div",{style:{color:"#6b7280",lineHeight:1.5,marginBottom:yt==="collapse"?0:10},children:X.desc.split(`
|
|
16
16
|
|
|
17
|
-
`).map((ot,ft)=>rt("p",{style:{margin:0,marginTop:ft>0?8:0},children:ot},ft))}),X.usage.map((ot,ft)=>we("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[rt("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),rt("span",{children:ot})]},ft)),yt==="collapse"&&C&&Object.keys(C).length>0&&(()=>{let ot=Object.entries(C).filter(([,Pt])=>Pt.found&&!Pt.disabled).map(([Pt])=>Pt.charAt(0).toUpperCase()+Pt.slice(1)),ft=Object.entries(C).filter(([,Pt])=>!Pt.found).map(([Pt])=>Pt);if(ot.length===0&&ft.length===0)return null;let xt=ft.map(Pt=>Pt.charAt(0).toUpperCase()+Pt.slice(1));return we("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:ot.length>0?"#22c55e":"rgba(0,0,0,0.2)",flexShrink:0}}),ot.length>0?we("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[we("span",{children:["Taste library ready in ",ot.join(", "),T&&" \u2014 restart CLI to activate"]}),ft.length>0&&M&&!T&&we("button",{type:"button",onClick:Pt=>{Pt.stopPropagation(),M()},style:{border:"none",background:"transparent",color:"#3b82f6",fontSize:10,fontWeight:500,fontFamily:"inherit",padding:0,cursor:"pointer",pointerEvents:"auto",textDecoration:"underline",textUnderlineOffset:2},children:["+ ",xt.join(", ")]})]}):ft.length>0&&M?we("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[rt("span",{children:"Connect Popmelt MCP"}),rt("button",{type:"button",onClick:Pt=>{Pt.stopPropagation(),M()},style:{border:"none",background:"#1f2937",color:"#fff",fontSize:10,fontWeight:600,fontFamily:"inherit",padding:"2px 8px",cursor:"pointer",pointerEvents:"auto"},children:"Connect"})]}):null]})})(),X.keys.length>1&&rt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8,display:"flex",flexDirection:"column",gap:4},children:X.keys.slice(1).map((ot,ft)=>we("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:ot.accent?"#fff":"#6b7280"},children:[rt("code",{style:{fontSize:10,backgroundColor:ot.accent?t.activeColor:"rgba(0,0,0,0.06)",color:ot.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:ot.key}),rt("span",{style:{color:ot.accent?t.activeColor:void 0,fontWeight:ot.accent?600:void 0},children:ot.desc})]},ft))})]})})(),we("div",{id:"devtools-toolbar",style:Qe,onMouseMove:oe,children:[(t.annotations.length>0||t.styleModifications.length>0)&&we(lo,{children:[rt("span",{onMouseEnter:()=>ht("clear"),onMouseLeave:Xt,children:rt(zn,{onClick:Ie,title:"Clear all (\u2318\u232B)",children:rt(ep,{size:17,strokeWidth:1.5})})}),rt(Wi,{})]}),we("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[rt("span",{onMouseEnter:()=>ht("inspector"),onMouseLeave:Xt,children:rt(zn,{active:t.isAnnotating&&t.activeTool==="inspector",siblingActive:t.isAnnotating,onClick:()=>re("inspector"),children:rt(Zu,{size:20,strokeWidth:1.5})})}),rt("span",{onMouseEnter:()=>ht("hand"),onMouseLeave:Xt,children:rt(zn,{active:t.isAnnotating&&t.activeTool==="hand",siblingActive:t.isAnnotating,onClick:()=>re("hand"),children:we("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[rt(Ku,{size:20,strokeWidth:1.5}),t.styleModifications.filter(X=>!X.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(X=>!X.captured).length})]})})}),(()=>{let X=co[Ft],ot=X.icon,ft=t.isAnnotating&&op.has(t.activeTool);return rt("span",{onMouseEnter:()=>ht(X.type),onMouseLeave:Xt,children:we("div",{style:{display:"flex",alignItems:"center",gap:0},children:[rt(zn,{active:ft,siblingActive:t.isAnnotating,onClick:()=>re(X.type),children:rt(ot,{size:20,strokeWidth:1.5})}),rt("button",{type:"button",onClick:()=>{let xt=(Ft+1)%co.length;G(xt),re(co[xt].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&&!ft?.5:1,transition:"opacity 150ms ease"},children:co.map((xt,Pt)=>rt("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:Pt===Ft?_n.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},Pt))})]})})})(),sp.map(({type:X,icon:ot,label:ft,shortcut:xt})=>rt("span",{onMouseEnter:()=>ht(X),onMouseLeave:Xt,children:rt(zn,{active:t.isAnnotating&&t.activeTool===X,siblingActive:t.isAnnotating,onClick:()=>re(X),children:rt(ot,{size:20,strokeWidth:1.5})})},X)),rt("span",{onMouseEnter:()=>ht("model"),onMouseLeave:Xt,children:rt(zn,{active:t.isAnnotating&&t.activeTool==="model",siblingActive:t.isAnnotating,onClick:()=>re("model"),children:rt(Uu,{size:17,strokeWidth:1.5})})})]}),rt(Wi,{}),we("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(fe.length>0||t.styleModifications.length>0||t.spacingTokenChanges.filter(X=>!X.captured).length>0)&&(()=>{var Pt;let X=ge!==null&&ge<fe.length?fe[ge]:null,ot=t.annotations.length>0&&t.annotations.every(pt=>pt.status&&pt.status!=="pending"),ft=ge!==null?(Pt=X==null?void 0:X.annotations.some(pt=>pt.status&&pt.status!=="pending"))!=null?Pt:!1:ot,xt=`oklch(0.628 0.258 ${Ae})`;return rt("span",{onMouseEnter:()=>ht("counter"),onMouseLeave:Xt,children:rt("button",{ref:sn,type:"button",onClick:()=>{if(Ht.current){Ht.current=!1;return}ln()},onMouseDown:Wt,onMouseUp:gn,onMouseLeave:gn,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:ft?"#999999":xt,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:ge!==null?ge+1:fe.length+t.styleModifications.length+t.spacingTokenChanges.filter(pt=>!pt.captured).length})})})(),d&&rt("span",{onMouseEnter:()=>ht("provider"),onMouseLeave:Xt,style:{display:"contents"},children:we("div",{style:{display:"flex",alignItems:"center",gap:0},children:[rt(zn,{onClick:()=>d(c==="claude"?"codex":"claude"),children:c==="claude"?rt(cp,{}):rt(dp,{})}),we("button",{type:"button",onClick:()=>{let X=(u+1)%g;h==null||h(X)},style:{display:"flex",alignItems:"center",gap:6,height:32,border:"none",background:"none",cursor:"pointer",padding:"0 4px 0 0",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:10,fontWeight:500,color:_n.iconDefault,whiteSpace:"nowrap"},children:[rt("span",{children:f}),rt("span",{style:{display:"flex",flexDirection:"column",gap:2},children:Array.from({length:g},(X,ot)=>rt("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:ot===u?_n.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},ot))})]})]})}),rt("div",{onMouseEnter:X=>{a==null||a(!0),X.currentTarget.style.opacity="1",ht("collapse")},onMouseLeave:X=>{a==null||a(!1),X.currentTarget.style.opacity=i?"1":"0.3",Xt()},style:{display:"inline-flex",opacity:i?1:.3,transition:"opacity 150ms ease"},children:rt(zn,{onClick:Sn,title:"Collapse (\u2318\u2318)",children:i?rt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:ie,children:Q===1?we(lo,{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"})]}):we(lo,{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"})]})}):we("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:ie,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"})]})})})]})]})]}):we(lo,{children:[rt("style",{children:"@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }"}),rt("div",{id:"devtools-toolbar",style:b(m({},Qe),{overflow:"visible",opacity:.5,transition:"opacity 150ms ease"}),onMouseEnter:X=>X.currentTarget.style.opacity="1",onMouseLeave:X=>X.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:()=>{Dt(!0),e({type:"SET_TOOL",payload:"inspector"}),e({type:"SET_ANNOTATING",payload:!0})},onMouseEnter:()=>a==null?void 0:a(!0),onMouseLeave:()=>a==null?void 0:a(!1),title:"Open annotation toolbar (\u2318\u2318)",children:i?rt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:ie,children:Q===1?we(lo,{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"})]}):we(lo,{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"})]})}):we("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:ie,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 Ui,useEffect as Fo,useRef as Ki,useState as Qo}from"react";import{Fragment as bl,jsx as Ce,jsxs as qo}from"react/jsx-runtime";var up={position:"fixed",bottom:86,right:16,zIndex:9999,display:"flex",flexDirection:"column"},pp=24,fp=6,gp=pp-fp,mp=8,yl=b(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 hp(t){var s;let e=t.filter(a=>a.type==="tool_use");if(e.length===0)return"Starting\u2026";let o=e[e.length-1],n=String(o.data.tool||""),r=o.data.file?String(o.data.file):null,i=r?(s=r.split("/").pop())!=null?s:r:null;switch(n){case"Read":return i?`Reading ${i}`:"Reading file";case"Edit":return i?`Editing ${i}`:"Editing file";case"Write":return i?`Writing ${i}`:"Writing file";case"Bash":return"Running command";case"Glob":return"Searching files";case"Grep":return"Searching code";default:return n?`Using ${n}`:"Working\u2026"}}function yp(t,e){if(t.some(r=>r.type==="question"&&r.data.jobId===e))return"Has a question";let n=t.find(r=>r.type==="done"&&r.data.jobId===e);if(n){let r=n.data.resolutions;if(Array.isArray(r)&&r.length>0)return"Applied changes"}return"Replied"}function bp({color:t}){let[e,o]=Qo(0);return Fo(()=>{let n=setInterval(()=>{o(r=>(r+1)%2)},250);return()=>clearInterval(n)},[]),Ce("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:t,style:{verticalAlign:"middle",flexShrink:0},children:e===1?qo(bl,{children:[Ce("circle",{cx:"7",cy:"7",r:"2"}),Ce("circle",{cx:"17",cy:"7",r:"2"}),Ce("circle",{cx:"7",cy:"17",r:"2"}),Ce("circle",{cx:"17",cy:"17",r:"2"})]}):qo(bl,{children:[Ce("circle",{cx:"12",cy:"6",r:"2"}),Ce("circle",{cx:"6",cy:"12",r:"2"}),Ce("circle",{cx:"18",cy:"12",r:"2"}),Ce("circle",{cx:"12",cy:"18",r:"2"})]})})}function xp({color:t}){return Ce("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:t,opacity:.6}})}function vp({color:t}){return Ce("span",{style:{color:t,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function Sp(){return Ce("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function wp({onDismiss:t,children:e}){let o=Ki(null),n=Ki(null),[r,i]=Qo(0),[s,a]=Qo(!1),l=60,c=Ui(u=>{var g;n.current={startX:u.clientX,startY:u.clientY,locked:!1},(g=o.current)==null||g.setPointerCapture(u.pointerId)},[]),d=Ui(u=>{let g=n.current;if(!g)return;let f=u.clientX-g.startX,h=u.clientY-g.startY;if(!g.locked){if(Math.abs(f)<4&&Math.abs(h)<4)return;if(g.locked=!0,Math.abs(h)>Math.abs(f)){n.current=null;return}}i(Math.max(0,f))},[]),p=Ui(()=>{n.current&&(n.current=null,r>=l?(a(!0),setTimeout(t,200)):i(0))},[r,t]);return Ce("div",{ref:o,onPointerDown:c,onPointerMove:d,onPointerUp:p,onPointerCancel:p,style:{transform:s?"translateX(120%)":`translateX(${r}px)`,opacity:s?0:1-r/(l*3),transition:n.current?"none":"transform 200ms ease, opacity 200ms ease",touchAction:"pan-y"},children:e})}function xl({bridge:t,inFlightJobs:e,isVisible:o,onHover:n,clearSignal:r,onViewThread:i,onCancel:s,isConnected:a,dismissedThreadIds:l}){let[c,d]=Qo([]),[p,u]=Qo(!1);Fo(()=>{r>0&&d([])},[r]),Fo(()=>{!l||l.size===0||d(h=>{let x=h.filter(y=>!y.threadId||!l.has(y.threadId));return x.length===h.length?h:x})},[l]),Fo(()=>{d(h=>{let x=new Set(h.map(C=>C.jobId)),y=!1,P=h.map(C=>{let M=e[C.jobId];return M&&(!C.threadId||C.color==="#888")?(y=!0,b(m({},C),{threadId:C.threadId||M.threadId,color:C.color==="#888"?M.color:C.color})):C});for(let[C,M]of Object.entries(e))x.has(C)||(P.push({jobId:C,color:M.color,status:"queued",threadId:M.threadId}),y=!0);for(let C of t.activeJobIds)!x.has(C)&&!P.some(M=>M.jobId===C)&&(P.push({jobId:C,color:"#888",status:"working"}),y=!0);return y?P:h})},[e,t.activeJobIds]),Fo(()=>{if(t.activeJobIds.length===0)return;let h=new Set(t.activeJobIds);d(x=>x.map(y=>h.has(y.jobId)&&y.status!=="done"&&y.status!=="error"?b(m({},y),{status:"working"}):y))},[t.activeJobIds]);let g=Ki(null);if(Fo(()=>{let h=t.lastCompletedJobId;if(!h||h===g.current)return;g.current=h;let x=t.events.find(T=>T.type==="error"&&(T.data.jobId===h||t.status==="error")),y=!!x,P=y?void 0:yp(t.events,h),C=x?String(x.data.message||""):void 0,M=x?!!x.data.cancelled:void 0;d(T=>T.map(z=>z.jobId===h?b(m({},z),{status:y?"error":"done",doneLabel:P,errorMessage:C,cancelled:M}):z))},[t.lastCompletedJobId,t.events,t.status]),!o||c.length===0&&a!==!1)return null;let f=!p&&c.length>1;return qo("div",{style:up,"data-devtools":!0,onMouseEnter:()=>{u(!0),n(!0)},onMouseLeave:()=>{u(!1),n(!1)},children:[c.map((h,x)=>{var M;let y=x===c.length-1,P=c.length-1-x,C=h.status==="working"?hp(t.events.filter(T=>T.data.jobId===h.jobId)):h.status==="queued"?"Queued":h.status==="done"?h.doneLabel||"Done":h.cancelled?"Cancelled":(M=h.errorMessage)!=null&&M.includes("Timed out")?"Timed out":"Error";return Ce("div",{style:{position:"relative",zIndex:x,marginBottom:f?y?0:-gp:y?0:mp,transform:f?`scale(${Math.max(.94,1-P*.02)})`:"scale(1)",opacity:f?Math.max(.5,1-P*.15):1,transformOrigin:"bottom right",transition:"margin-bottom 250ms ease, transform 250ms ease, opacity 250ms ease"},children:Ce(wp,{onDismiss:()=>d(T=>T.filter(z=>z.jobId!==h.jobId)),children:qo("div",{style:b(m({},yl),{cursor:h.threadId&&i?"pointer":void 0}),onClick:h.threadId&&i?()=>i(h.threadId):void 0,title:h.errorMessage||void 0,children:[h.status==="working"&&Ce(bp,{color:h.color}),h.status==="queued"&&Ce(xp,{color:h.color}),h.status==="done"&&Ce(vp,{color:h.color}),h.status==="error"&&Ce(Sp,{}),Ce("span",{style:{color:h.status==="queued"?"#9ca3af":"#1f2937"},children:C}),h.status==="working"&&s&&Ce("button",{onClick:T=>{T.stopPropagation(),s(h.jobId)},style:{background:"none",border:"none",cursor:"pointer",color:"#9ca3af",fontSize:14,padding:"0 4px",lineHeight:1},title:"Cancel",children:"\xD7"})]})})},h.jobId)}),a===!1&&c.length>0&&qo("div",{style:b(m({},yl),{color:"#9ca3af"}),children:[Ce("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#f59e0b"}}),Ce("span",{children:"Reconnecting\u2026"})]})]})}import{useCallback as Pr,useEffect as Xn,useRef as $n,useState as uo}from"react";import{Fragment as Ip,jsx as Te}from"react/jsx-runtime";var vl="ui-monospace, SFMono-Regular, Menlo, monospace",kp=/^#[0-9a-fA-F]{3,8}$/,Ep=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,Cp=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 Tp(t){let e=t.trim();return kp.test(e)||Ep.test(e)||Cp.has(e.toLowerCase())}function Zi(t,e){return Te("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 tr(t){let e=[],o=/(`[^`]+`)|(\*\*\*(.+?)\*\*\*)|(\*\*(.+?)\*\*)|(\*(.+?)\*)|(_([^_]+?)_)|(\[([^\]]+)\]\(([^)]+)\))|(#[0-9a-fA-F]{3,8})(?![0-9a-fA-F])|((?:rgba?|hsla?|oklch)\([^)]+\))/g,n=0,r;for(;(r=o.exec(t))!==null;){if(r.index>n&&e.push(t.slice(n,r.index)),r[1]){let i=r[1].slice(1,-1);Tp(i)&&e.push(Zi(i,`sw-${r.index}`)),e.push(Te("code",{style:{fontFamily:vl,fontSize:"0.9em",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2},children:i},r.index))}else r[3]!==void 0?e.push(Te("strong",{children:Te("em",{children:r[3]})},r.index)):r[5]!==void 0?e.push(Te("strong",{children:r[5]},r.index)):r[7]!==void 0?e.push(Te("em",{children:r[7]},r.index)):r[9]!==void 0?e.push(Te("em",{children:r[9]},r.index)):r[11]!==void 0&&r[12]!==void 0?e.push(Te("a",{href:r[12],target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline"},children:r[11]},r.index)):r[13]!==void 0?(e.push(Zi(r[13],`sw-${r.index}`)),e.push(r[13])):r[14]!==void 0&&(e.push(Zi(r[14],`sw-${r.index}`)),e.push(r[14]));n=r.index+r[0].length}return n<t.length&&e.push(t.slice(n)),e}function Ar(t){var r;let e=t.split(`
|
|
17
|
+
`).map((ot,ft)=>rt("p",{style:{margin:0,marginTop:ft>0?8:0},children:ot},ft))}),X.usage.map((ot,ft)=>we("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[rt("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),rt("span",{children:ot})]},ft)),yt==="collapse"&&C&&Object.keys(C).length>0&&(()=>{let ot=Object.entries(C).filter(([,Pt])=>Pt.found&&!Pt.disabled).map(([Pt])=>Pt.charAt(0).toUpperCase()+Pt.slice(1)),ft=Object.entries(C).filter(([,Pt])=>!Pt.found).map(([Pt])=>Pt);if(ot.length===0&&ft.length===0)return null;let xt=ft.map(Pt=>Pt.charAt(0).toUpperCase()+Pt.slice(1));return we("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:ot.length>0?"#22c55e":"rgba(0,0,0,0.2)",flexShrink:0}}),ot.length>0?we("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[we("span",{children:["Taste library ready in ",ot.join(", "),T&&" \u2014 restart CLI to activate"]}),ft.length>0&&M&&!T&&we("button",{type:"button",onClick:Pt=>{Pt.stopPropagation(),M()},style:{border:"none",background:"transparent",color:"#3b82f6",fontSize:10,fontWeight:500,fontFamily:"inherit",padding:0,cursor:"pointer",pointerEvents:"auto",textDecoration:"underline",textUnderlineOffset:2},children:["+ ",xt.join(", ")]})]}):ft.length>0&&M?we("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[rt("span",{children:"Connect Popmelt MCP"}),rt("button",{type:"button",onClick:Pt=>{Pt.stopPropagation(),M()},style:{border:"none",background:"#1f2937",color:"#fff",fontSize:10,fontWeight:600,fontFamily:"inherit",padding:"2px 8px",cursor:"pointer",pointerEvents:"auto"},children:"Connect"})]}):null]})})(),X.keys.length>1&&rt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8,display:"flex",flexDirection:"column",gap:4},children:X.keys.slice(1).map((ot,ft)=>we("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:ot.accent?"#fff":"#6b7280"},children:[rt("code",{style:{fontSize:10,backgroundColor:ot.accent?t.activeColor:"rgba(0,0,0,0.06)",color:ot.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:ot.key}),rt("span",{style:{color:ot.accent?t.activeColor:void 0,fontWeight:ot.accent?600:void 0},children:ot.desc})]},ft))})]})})(),we("div",{id:"devtools-toolbar",style:Qe,onMouseMove:oe,children:[(t.annotations.length>0||t.styleModifications.length>0)&&we(lo,{children:[rt("span",{onMouseEnter:()=>ht("clear"),onMouseLeave:Xt,children:rt(zn,{onClick:Ie,title:"Clear all (\u2318\u232B)",children:rt(ep,{size:17,strokeWidth:1.5})})}),rt(Wi,{})]}),we("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[rt("span",{onMouseEnter:()=>ht("inspector"),onMouseLeave:Xt,children:rt(zn,{active:t.isAnnotating&&t.activeTool==="inspector",siblingActive:t.isAnnotating,onClick:()=>re("inspector"),children:rt(Zu,{size:20,strokeWidth:1.5})})}),rt("span",{onMouseEnter:()=>ht("hand"),onMouseLeave:Xt,children:rt(zn,{active:t.isAnnotating&&t.activeTool==="hand",siblingActive:t.isAnnotating,onClick:()=>re("hand"),children:we("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[rt(Ku,{size:20,strokeWidth:1.5}),t.styleModifications.filter(X=>!X.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(X=>!X.captured).length})]})})}),(()=>{let X=co[Ft],ot=X.icon,ft=t.isAnnotating&&op.has(t.activeTool);return rt("span",{onMouseEnter:()=>ht(X.type),onMouseLeave:Xt,children:we("div",{style:{display:"flex",alignItems:"center",gap:0},children:[rt(zn,{active:ft,siblingActive:t.isAnnotating,onClick:()=>re(X.type),children:rt(ot,{size:20,strokeWidth:1.5})}),rt("button",{type:"button",onClick:()=>{let xt=(Ft+1)%co.length;G(xt),re(co[xt].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&&!ft?.5:1,transition:"opacity 150ms ease"},children:co.map((xt,Pt)=>rt("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:Pt===Ft?_n.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},Pt))})]})})})(),sp.map(({type:X,icon:ot,label:ft,shortcut:xt})=>rt("span",{onMouseEnter:()=>ht(X),onMouseLeave:Xt,children:rt(zn,{active:t.isAnnotating&&t.activeTool===X,siblingActive:t.isAnnotating,onClick:()=>re(X),children:rt(ot,{size:20,strokeWidth:1.5})})},X)),rt("span",{onMouseEnter:()=>ht("model"),onMouseLeave:Xt,children:rt(zn,{active:t.isAnnotating&&t.activeTool==="model",siblingActive:t.isAnnotating,onClick:()=>re("model"),children:rt(Uu,{size:17,strokeWidth:1.5})})})]}),rt(Wi,{}),we("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(fe.length>0||t.styleModifications.length>0||t.spacingTokenChanges.filter(X=>!X.captured).length>0)&&(()=>{var Pt;let X=ge!==null&&ge<fe.length?fe[ge]:null,ot=t.annotations.length>0&&t.annotations.every(pt=>pt.status&&pt.status!=="pending"),ft=ge!==null?(Pt=X==null?void 0:X.annotations.some(pt=>pt.status&&pt.status!=="pending"))!=null?Pt:!1:ot,xt=`oklch(0.628 0.258 ${Ae})`;return rt("span",{onMouseEnter:()=>ht("counter"),onMouseLeave:Xt,children:rt("button",{ref:sn,type:"button",onClick:()=>{if(Ht.current){Ht.current=!1;return}ln()},onMouseDown:Wt,onMouseUp:gn,onMouseLeave:gn,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:ft?"#999999":xt,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:ge!==null?ge+1:fe.length+t.styleModifications.length+t.spacingTokenChanges.filter(pt=>!pt.captured).length})})})(),d&&rt("span",{onMouseEnter:()=>ht("provider"),onMouseLeave:Xt,style:{display:"contents"},children:we("div",{style:{display:"flex",alignItems:"center",gap:0},children:[rt(zn,{onClick:()=>d(c==="claude"?"codex":"claude"),children:c==="claude"?rt(cp,{}):rt(dp,{})}),we("button",{type:"button",onClick:()=>{let X=(u+1)%g;m==null||m(X)},style:{display:"flex",alignItems:"center",gap:6,height:32,border:"none",background:"none",cursor:"pointer",padding:"0 4px 0 0",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:10,fontWeight:500,color:_n.iconDefault,whiteSpace:"nowrap"},children:[rt("span",{children:f}),rt("span",{style:{display:"flex",flexDirection:"column",gap:2},children:Array.from({length:g},(X,ot)=>rt("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:ot===u?_n.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},ot))})]})]})}),rt("div",{onMouseEnter:X=>{a==null||a(!0),X.currentTarget.style.opacity="1",ht("collapse")},onMouseLeave:X=>{a==null||a(!1),X.currentTarget.style.opacity=i?"1":"0.3",Xt()},style:{display:"inline-flex",opacity:i?1:.3,transition:"opacity 150ms ease"},children:rt(zn,{onClick:Sn,title:"Collapse (\u2318\u2318)",children:i?rt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:ie,children:Q===1?we(lo,{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"})]}):we(lo,{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"})]})}):we("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:ie,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"})]})})})]})]})]}):we(lo,{children:[rt("style",{children:"@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }"}),rt("div",{id:"devtools-toolbar",style:b(h({},Qe),{overflow:"visible",opacity:.5,transition:"opacity 150ms ease"}),onMouseEnter:X=>X.currentTarget.style.opacity="1",onMouseLeave:X=>X.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:()=>{Dt(!0),e({type:"SET_TOOL",payload:"inspector"}),e({type:"SET_ANNOTATING",payload:!0})},onMouseEnter:()=>a==null?void 0:a(!0),onMouseLeave:()=>a==null?void 0:a(!1),title:"Open annotation toolbar (\u2318\u2318)",children:i?rt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:ie,children:Q===1?we(lo,{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"})]}):we(lo,{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"})]})}):we("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:ie,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 Ui,useEffect as Fo,useRef as Ki,useState as Qo}from"react";import{Fragment as bl,jsx as ke,jsxs as qo}from"react/jsx-runtime";var up={position:"fixed",bottom:86,right:16,zIndex:9999,display:"flex",flexDirection:"column"},pp=24,fp=6,gp=pp-fp,mp=8,yl=b(h({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 hp(t){var s;let e=t.filter(a=>a.type==="tool_use");if(e.length===0)return"Starting\u2026";let o=e[e.length-1],n=String(o.data.tool||""),r=o.data.file?String(o.data.file):null,i=r?(s=r.split("/").pop())!=null?s:r:null;switch(n){case"Read":return i?`Reading ${i}`:"Reading file";case"Edit":return i?`Editing ${i}`:"Editing file";case"Write":return i?`Writing ${i}`:"Writing file";case"Bash":return"Running command";case"Glob":return"Searching files";case"Grep":return"Searching code";default:return n?`Using ${n}`:"Working\u2026"}}function yp(t,e){if(t.some(r=>r.type==="question"&&r.data.jobId===e))return"Has a question";let n=t.find(r=>r.type==="done"&&r.data.jobId===e);if(n){let r=n.data.resolutions;if(Array.isArray(r)&&r.length>0)return"Applied changes"}return"Replied"}function bp({color:t}){let[e,o]=Qo(0);return Fo(()=>{let n=setInterval(()=>{o(r=>(r+1)%2)},250);return()=>clearInterval(n)},[]),ke("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:t,style:{verticalAlign:"middle",flexShrink:0},children:e===1?qo(bl,{children:[ke("circle",{cx:"7",cy:"7",r:"2"}),ke("circle",{cx:"17",cy:"7",r:"2"}),ke("circle",{cx:"7",cy:"17",r:"2"}),ke("circle",{cx:"17",cy:"17",r:"2"})]}):qo(bl,{children:[ke("circle",{cx:"12",cy:"6",r:"2"}),ke("circle",{cx:"6",cy:"12",r:"2"}),ke("circle",{cx:"18",cy:"12",r:"2"}),ke("circle",{cx:"12",cy:"18",r:"2"})]})})}function xp({color:t}){return ke("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:t,opacity:.6}})}function vp({color:t}){return ke("span",{style:{color:t,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function Sp(){return ke("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function wp({onDismiss:t,children:e}){let o=Ki(null),n=Ki(null),[r,i]=Qo(0),[s,a]=Qo(!1),l=60,c=Ui(u=>{var g;n.current={startX:u.clientX,startY:u.clientY,locked:!1},(g=o.current)==null||g.setPointerCapture(u.pointerId)},[]),d=Ui(u=>{let g=n.current;if(!g)return;let f=u.clientX-g.startX,m=u.clientY-g.startY;if(!g.locked){if(Math.abs(f)<4&&Math.abs(m)<4)return;if(g.locked=!0,Math.abs(m)>Math.abs(f)){n.current=null;return}}i(Math.max(0,f))},[]),p=Ui(()=>{n.current&&(n.current=null,r>=l?(a(!0),setTimeout(t,200)):i(0))},[r,t]);return ke("div",{ref:o,onPointerDown:c,onPointerMove:d,onPointerUp:p,onPointerCancel:p,style:{transform:s?"translateX(120%)":`translateX(${r}px)`,opacity:s?0:1-r/(l*3),transition:n.current?"none":"transform 200ms ease, opacity 200ms ease",touchAction:"pan-y"},children:e})}function xl({bridge:t,inFlightJobs:e,isVisible:o,onHover:n,clearSignal:r,onViewThread:i,onCancel:s,isConnected:a,dismissedThreadIds:l}){let[c,d]=Qo([]),[p,u]=Qo(!1);Fo(()=>{r>0&&d([])},[r]),Fo(()=>{!l||l.size===0||d(m=>{let x=m.filter(y=>!y.threadId||!l.has(y.threadId));return x.length===m.length?m:x})},[l]),Fo(()=>{d(m=>{let x=new Set(m.map(C=>C.jobId)),y=!1,P=m.map(C=>{let M=e[C.jobId];return M&&(!C.threadId||C.color==="#888")?(y=!0,b(h({},C),{threadId:C.threadId||M.threadId,color:C.color==="#888"?M.color:C.color})):C});for(let[C,M]of Object.entries(e))x.has(C)||(P.push({jobId:C,color:M.color,status:"queued",threadId:M.threadId}),y=!0);for(let C of t.activeJobIds)!x.has(C)&&!P.some(M=>M.jobId===C)&&(P.push({jobId:C,color:"#888",status:"working"}),y=!0);return y?P:m})},[e,t.activeJobIds]),Fo(()=>{if(t.activeJobIds.length===0)return;let m=new Set(t.activeJobIds);d(x=>x.map(y=>m.has(y.jobId)&&y.status!=="done"&&y.status!=="error"?b(h({},y),{status:"working"}):y))},[t.activeJobIds]);let g=Ki(null);if(Fo(()=>{let m=t.lastCompletedJobId;if(!m||m===g.current)return;g.current=m;let x=t.events.find(T=>T.type==="error"&&(T.data.jobId===m||t.status==="error")),y=!!x,P=y?void 0:yp(t.events,m),C=x?String(x.data.message||""):void 0,M=x?!!x.data.cancelled:void 0;d(T=>T.map(H=>H.jobId===m?b(h({},H),{status:y?"error":"done",doneLabel:P,errorMessage:C,cancelled:M}):H))},[t.lastCompletedJobId,t.events,t.status]),!o||c.length===0&&a!==!1)return null;let f=!p&&c.length>1;return qo("div",{style:up,"data-devtools":!0,onMouseEnter:()=>{u(!0),n(!0)},onMouseLeave:()=>{u(!1),n(!1)},children:[c.map((m,x)=>{var M;let y=x===c.length-1,P=c.length-1-x,C=m.status==="working"?hp(t.events.filter(T=>T.data.jobId===m.jobId)):m.status==="queued"?"Queued":m.status==="done"?m.doneLabel||"Done":m.cancelled?"Cancelled":(M=m.errorMessage)!=null&&M.includes("Timed out")?"Timed out":"Error";return ke("div",{style:{position:"relative",zIndex:x,marginBottom:f?y?0:-gp:y?0:mp,transform:f?`scale(${Math.max(.94,1-P*.02)})`:"scale(1)",opacity:f?Math.max(.5,1-P*.15):1,transformOrigin:"bottom right",transition:"margin-bottom 250ms ease, transform 250ms ease, opacity 250ms ease"},children:ke(wp,{onDismiss:()=>d(T=>T.filter(H=>H.jobId!==m.jobId)),children:qo("div",{style:b(h({},yl),{cursor:m.threadId&&i?"pointer":void 0}),onClick:m.threadId&&i?()=>i(m.threadId):void 0,title:m.errorMessage||void 0,children:[m.status==="working"&&ke(bp,{color:m.color}),m.status==="queued"&&ke(xp,{color:m.color}),m.status==="done"&&ke(vp,{color:m.color}),m.status==="error"&&ke(Sp,{}),ke("span",{style:{color:m.status==="queued"?"#9ca3af":"#1f2937"},children:C}),m.status==="working"&&s&&ke("button",{onClick:T=>{T.stopPropagation(),s(m.jobId)},style:{background:"none",border:"none",cursor:"pointer",color:"#9ca3af",fontSize:14,padding:"0 4px",lineHeight:1},title:"Cancel",children:"\xD7"}),(m.status==="done"||m.status==="error")&&ke("button",{onClick:T=>{T.stopPropagation(),d(H=>H.filter(L=>L.jobId!==m.jobId))},style:{background:"none",border:"none",cursor:"pointer",color:"#9ca3af",fontSize:14,padding:"0 4px",lineHeight:1},title:"Dismiss",children:"\xD7"})]})})},m.jobId)}),a===!1&&c.length>0&&qo("div",{style:b(h({},yl),{color:"#9ca3af"}),children:[ke("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#f59e0b"}}),ke("span",{children:"Reconnecting\u2026"})]})]})}import{useCallback as Pr,useEffect as Xn,useRef as $n,useState as uo}from"react";import{Fragment as Ip,jsx as Te}from"react/jsx-runtime";var vl="ui-monospace, SFMono-Regular, Menlo, monospace",kp=/^#[0-9a-fA-F]{3,8}$/,Ep=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,Cp=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 Tp(t){let e=t.trim();return kp.test(e)||Ep.test(e)||Cp.has(e.toLowerCase())}function Zi(t,e){return Te("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 tr(t){let e=[],o=/(`[^`]+`)|(\*\*\*(.+?)\*\*\*)|(\*\*(.+?)\*\*)|(\*(.+?)\*)|(_([^_]+?)_)|(\[([^\]]+)\]\(([^)]+)\))|(#[0-9a-fA-F]{3,8})(?![0-9a-fA-F])|((?:rgba?|hsla?|oklch)\([^)]+\))/g,n=0,r;for(;(r=o.exec(t))!==null;){if(r.index>n&&e.push(t.slice(n,r.index)),r[1]){let i=r[1].slice(1,-1);Tp(i)&&e.push(Zi(i,`sw-${r.index}`)),e.push(Te("code",{style:{fontFamily:vl,fontSize:"0.9em",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2},children:i},r.index))}else r[3]!==void 0?e.push(Te("strong",{children:Te("em",{children:r[3]})},r.index)):r[5]!==void 0?e.push(Te("strong",{children:r[5]},r.index)):r[7]!==void 0?e.push(Te("em",{children:r[7]},r.index)):r[9]!==void 0?e.push(Te("em",{children:r[9]},r.index)):r[11]!==void 0&&r[12]!==void 0?e.push(Te("a",{href:r[12],target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline"},children:r[11]},r.index)):r[13]!==void 0?(e.push(Zi(r[13],`sw-${r.index}`)),e.push(r[13])):r[14]!==void 0&&(e.push(Zi(r[14],`sw-${r.index}`)),e.push(r[14]));n=r.index+r[0].length}return n<t.length&&e.push(t.slice(n)),e}function Ar(t){var r;let e=t.split(`
|
|
18
18
|
`),o=[],n=0;for(;n<e.length;){let i=e[n];if(i.trimStart().startsWith("```")){let c=[];for(n++;n<e.length&&!e[n].trimStart().startsWith("```");)c.push(e[n]),n++;n++,o.push(Te("pre",{style:{fontFamily:vl,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(`
|
|
19
|
-
`)},o.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(i)){o.push(Te("hr",{style:{border:"none",borderTop:"1px solid rgba(0,0,0,0.1)",margin:"6px 0"}},o.length)),n++;continue}let s=i.match(/^(#{1,4})\s+(.+)/);if(s){let c=s[1].length,d={1:16,2:14,3:13,4:12};o.push(Te("div",{style:{fontWeight:700,fontSize:(r=d[c])!=null?r:12,margin:"8px 0 2px"},children:tr(s[2])},o.length)),n++;continue}if(i.trimStart().startsWith("|")&&i.trimEnd().endsWith("|")){let c=[];for(;n<e.length&&e[n].trimStart().startsWith("|")&&e[n].trimEnd().endsWith("|");)c.push(e[n]),n++;let d=y=>/^\|[\s\-:|]+\|$/.test(y),p=c.filter(y=>!d(y)),u=y=>y.split("|").slice(1,-1).map(P=>P.trim()),g=y=>/^\*\*.+\*\*$/.test(y)||/^__.+__$/.test(y),f=p.map(u),
|
|
19
|
+
`)},o.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(i)){o.push(Te("hr",{style:{border:"none",borderTop:"1px solid rgba(0,0,0,0.1)",margin:"6px 0"}},o.length)),n++;continue}let s=i.match(/^(#{1,4})\s+(.+)/);if(s){let c=s[1].length,d={1:16,2:14,3:13,4:12};o.push(Te("div",{style:{fontWeight:700,fontSize:(r=d[c])!=null?r:12,margin:"8px 0 2px"},children:tr(s[2])},o.length)),n++;continue}if(i.trimStart().startsWith("|")&&i.trimEnd().endsWith("|")){let c=[];for(;n<e.length&&e[n].trimStart().startsWith("|")&&e[n].trimEnd().endsWith("|");)c.push(e[n]),n++;let d=y=>/^\|[\s\-:|]+\|$/.test(y),p=c.filter(y=>!d(y)),u=y=>y.split("|").slice(1,-1).map(P=>P.trim()),g=y=>/^\*\*.+\*\*$/.test(y)||/^__.+__$/.test(y),f=p.map(u),m=f.length>1&&f.slice(1).every(y=>y[0]&&g(y[0])),x=f.length>0&&f[0].every(y=>g(y));o.push(Te("div",{style:{overflowX:"auto",margin:"4px 0",paddingBottom:4},children:Te("table",{style:{borderCollapse:"separate",borderSpacing:0,fontSize:"0.95em",width:"max-content",minWidth:"100%"},children:Te("tbody",{children:p.map((y,P)=>Te("tr",{children:u(y).map((C,M)=>Te(P===0?"th":"td",{style:h({border:"1px solid rgba(0,0,0,0.1)",padding:"3px 6px",textAlign:"left",fontWeight:P===0?600:400,minWidth:60,whiteSpace:"nowrap"},M===0&&m||P===0&&x?b(h(h({position:"sticky"},M===0&&m?{left:0}:{}),P===0&&x?{top:0}:{}),{background:"#fff",zIndex:M===0&&m&&P===0&&x?2:1}):{}),children:tr(C)},M))},P))})})},o.length));continue}if(i.match(/^(\s*)([-*])\s+(.+)/)){let c=[];for(;n<e.length&&/^\s*[-*]\s+/.test(e[n]);){let d=e[n].match(/^\s*[-*]\s+(.+)/);d&&c.push(Te("li",{children:tr(d[1])},c.length)),n++}o.push(Te("ul",{style:{margin:"2px 0",paddingLeft:20},children:c},o.length));continue}if(i.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(Te("li",{children:tr(d[1])},c.length)),n++}o.push(Te("ol",{style:{margin:"2px 0",paddingLeft:20},children:c},o.length));continue}if(i.trim()===""){o.push(Te("div",{style:{height:4}},o.length)),n++;continue}o.push(Te("div",{style:{margin:"2px 0"},children:tr(i)},o.length)),n++}return Te(Ip,{children:o})}import{Fragment as es,jsx as zt,jsxs as Ee}from"react/jsx-runtime";var Br=400,Ho=16,ns=3,Mp=16,qi="devtools-thread-panel-position";function Qi(){return{top:Ho,left:window.innerWidth-Br-2*ns-Ho}}function Sl(t,e){let o=document.getElementById("devtools-toolbar"),n=o==null?void 0:o.getBoundingClientRect(),r=window.innerHeight-Ho;return n&&e+Br+2*ns>n.left&&(r=n.top-Mp),Math.max(200,r-Math.max(0,t))}var Lp=b(h({width:Br,backgroundColor:"#ffffff"},Cn),{boxSizing:"content-box",display:"flex",flexDirection:"column",overflow:"hidden",fontFamily:Ce,fontSize:12,color:"#1f2937",pointerEvents:"auto"}),Rp={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"4px 5px 4px 10px",margin:"3px 3px 0",fontWeight:600,fontSize:12},Ap={flex:1,overflowY:"auto",padding:"8px 0",scrollbarWidth:"none"},Pp=`
|
|
20
20
|
[data-devtools="thread-panel-messages"]:hover {
|
|
21
21
|
scrollbar-width: thin !important;
|
|
22
22
|
}
|
|
@@ -30,4 +30,4 @@ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{
|
|
|
30
30
|
background: rgba(0,0,0,0.15);
|
|
31
31
|
border-radius: 3px;
|
|
32
32
|
}
|
|
33
|
-
`,Bp={borderTop:"1px solid rgba(0, 0, 0, 0.08)",padding:12};function wl(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 Op(t){return new Date(t).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var ts=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Dp=3e3,Np=250;function kl({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 Fp({color:t}){let[e,o]=uo(0),[n,r]=uo(()=>Math.floor(Math.random()*ts.length));return Xn(()=>{let i=setInterval(()=>o(a=>(a+1)%2),Np),s=setInterval(()=>r(a=>(a+1)%ts.length),Dp);return()=>{clearInterval(i),clearInterval(s)}},[]),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(es,{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(es,{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:ts[n]})]})}function Hp(t){var r;let e=String(t.data.tool||""),o=t.data.file?String(t.data.file):null,n=o?(r=o.split("/").pop())!=null?r:o:null;switch(e){case"Read":return n?`Reading ${n}`:"Reading file";case"Edit":return n?`Editing ${n}`:"Editing file";case"Write":return n?`Writing ${n}`:"Writing file";case"Bash":return"Running command";case"Glob":return"Searching files";case"Grep":return"Searching code";case"WebFetch":return"Fetching page";case"WebSearch":return"Searching web";default:return e?`Using ${e}`:null}}var _p=new Set(["Read","Glob","Grep","WebFetch","WebSearch"]),zp=new Set(["Edit","Write","Bash"]);function $p(t){let e=0,o=!1;for(let n of t){if(n.type!=="tool_use")continue;let r=String(n.data.tool||"");zp.has(r)?o=!0:_p.has(r)&&e++}return!o&&e>=3?"researching":o?"applying changes":null}function Wp(t){let e=[];for(let o of t)if(o.type==="tool_use"){let n=Hp(o);n&&e.push({kind:"tool",label:n})}else if(o.type==="delta"){let n=String(o.data.text||"");if(!n)continue;let r=e[e.length-1];r&&r.kind==="text"?r.text+=n:e.push({kind:"text",text:n})}else if(o.type==="thinking"){let n=String(o.data.text||"");if(!n)continue;let r=e[e.length-1];r&&r.kind==="thinking"?r.text+=n:e.push({kind:"thinking",text:n})}return e}function El({threadId:t,bridgeUrl:e,accentColor:o,isStreaming:n,streamingEvents:r,onClose:i,onReply:s,onCancel:a,lastError:l,activePlan:c,planAnnotations:d,inFlightJobs:p,onViewThread:u,onApprovePlan:g,onDismissPlan:f}){var mt,se;let[h,x]=uo([]),[y,P]=uo(!0),[C,M]=uo(""),[T,z]=uo([]),R=$n(null),H=$n(null),q=$n(null),et=$n(n),B=$n(Qi()),U=$n({x:0,y:0}),tt=$n(!1),kt=$n({x:0,y:0,offsetX:0,offsetY:0}),at=$n(!1),[,Nt]=uo(0);Xn(()=>{try{let Q=localStorage.getItem(qi);if(Q){let yt=JSON.parse(Q);typeof yt.top=="number"&&typeof yt.left=="number"&&(at.current=!0,B.current={top:yt.top,left:yt.left},Nt(Z=>Z+1))}}catch(Q){}},[]),Xn(()=>{let Q=()=>{at.current||(B.current=Qi()),Nt(yt=>yt+1)};return window.addEventListener("resize",Q,{passive:!0}),()=>window.removeEventListener("resize",Q)},[]),Xn(()=>{let Q=q.current;if(!Q)return;let yt=E=>{E.button!==0||E.target.closest("button")||(E.preventDefault(),E.stopPropagation(),tt.current=!0,kt.current={x:E.clientX,y:E.clientY,offsetX:U.current.x,offsetY:U.current.y})},Z=E=>{if(!tt.current)return;let nt=kt.current,it=nt.offsetX+(E.clientX-nt.x),At=nt.offsetY+(E.clientY-nt.y),bt=Math.max(Ho,Math.min(window.innerWidth-Br-2*ns-Ho,B.current.left+it)),Ct=Math.max(Ho,B.current.top+At);U.current={x:bt-B.current.left,y:Ct-B.current.top};let ht=H.current;ht&&(ht.style.top=`${Ct}px`,ht.style.left=`${bt}px`,ht.style.height=`${Sl(Ct,bt)}px`)},Lt=()=>{if(!tt.current)return;let E=B.current.top+U.current.y,nt=B.current.left+U.current.x;B.current={top:E,left:nt},U.current={x:0,y:0},at.current=!0;try{localStorage.setItem(qi,JSON.stringify({top:E,left:nt}))}catch(it){}tt.current=!1},ee=()=>{B.current=Qi(),U.current={x:0,y:0},at.current=!1;try{localStorage.removeItem(qi)}catch(E){}Nt(E=>E+1)};return Q.addEventListener("mousedown",yt),window.addEventListener("mousemove",Z),window.addEventListener("mouseup",Lt),Q.addEventListener("dblclick",ee),()=>{Q.removeEventListener("mousedown",yt),window.removeEventListener("mousemove",Z),window.removeEventListener("mouseup",Lt),Q.removeEventListener("dblclick",ee)}},[]);let Et=Pr(()=>{fetch(`${e}/thread/${t}`).then(Q=>Q.json()).then(Q=>{var yt;x((yt=Q.messages)!=null?yt:[]),P(!1)}).catch(()=>P(!1))},[e,t]);Xn(()=>{P(!0),Et()},[Et]),Xn(()=>{et.current&&!n&&Et(),et.current=n},[n,Et]);let Dt=r?Wp(r):[],Ft=r?$p(r):null;Xn(()=>{R.current&&(R.current.scrollTop=R.current.scrollHeight)},[h,Dt.length,n]),Xn(()=>{let Q=yt=>{yt.key==="Escape"&&(yt.stopPropagation(),i())};return document.addEventListener("keydown",Q),()=>document.removeEventListener("keydown",Q)},[i]);let G=Pr(()=>{if(!C.trim()||!s)return;let Q=C.trim(),yt=T.length>0?T:void 0;x(Z=>[...Z,{role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:yt?`${Q} [${yt.length} image${yt.length>1?"s":""}]`:Q}]),s(t,Q,yt),M(""),z([])},[C,T,t,s]),_t=Pr(Q=>{let yt=Q.clipboardData.items,Z=[];for(let Lt=0;Lt<yt.length;Lt++){let ee=yt[Lt];if(ee.type.startsWith("image/")){let E=ee.getAsFile();E&&Z.push(E)}}Z.length>0&&(Q.preventDefault(),z(Lt=>[...Lt,...Z]))},[]),St=Pr(Q=>{Q.key==="Enter"&&(Q.metaKey||Q.ctrlKey)&&(Q.preventDefault(),G())},[G]),Vt=B.current.top+U.current.y,qt=B.current.left+U.current.x,Ot=Sl(Vt,qt);return ke(es,{children:[zt("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:Q=>{Q.target===Q.currentTarget&&i()},style:{position:"fixed",inset:0,zIndex:9999}}),ke("div",{ref:H,style:b(m({},Lp),{height:Ot,position:"fixed",top:Vt,left:qt,zIndex:1e4}),"data-devtools":"thread-panel",children:[ke("div",{ref:q,style:b(m({},Rp),{backgroundColor:o,color:"#ffffff",cursor:"grab",userSelect:"none",WebkitUserSelect:"none"}),children:[zt("span",{children:"Conversation"}),zt("button",{onClick:i,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),zt("style",{dangerouslySetInnerHTML:{__html:Pp}}),ke("div",{ref:R,style:Ap,"data-devtools":"thread-panel-messages",children:[y&&zt("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!y&&h.length===0&&!n&&zt("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),h.map((Q,yt)=>{let Z=Q.role==="human",Lt=Z?Q.replyToQuestion||Q.feedbackSummary||"(annotation)":wl(Q.responseText||""),ee=Z?void 0:Q.question,E=!Z&&Q.resolutions&&Q.resolutions.length>0,nt=!Z&&Q.toolsUsed&&Q.toolsUsed.length>0;if(!Lt&&!ee&&!E)return null;let it=yt===h.length-1;return ke("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:it?1:.5},children:[ke("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[!Z&&zt(kl,{size:11}),zt("span",{style:{fontWeight:600,fontSize:11,color:Z?o:"#6b7280"},children:Z?"You":"Claude Code"}),zt("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:Op(Q.timestamp)})]}),Lt&&zt("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:Z?Lt:Ar(Lt)}),ee&&zt("div",{style:{marginTop:Lt?4:0,lineHeight:1.5,wordBreak:"break-word"},children:Ar(ee)}),(nt||E)&&ke("div",{style:{marginTop:Lt||ee?6:0,padding:"4px 8px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#6b7280"},children:[nt&&zt("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:Q.toolsUsed.map((At,bt)=>zt("div",{children:At},bt))}),E&&Q.resolutions.map((At,bt)=>{var Xt;let Ct=(Xt=At.finalScope)!=null?Xt:At.inferredScope,ht=Ct?`${Ct.breadth} \xB7 ${Ct.target}`:null;return ke("div",{style:{marginTop:nt?4:0},children:[zt("span",{style:{color:At.status==="resolved"?"#10b981":"#f59e0b"},children:At.status==="resolved"?"Done":"Needs review"}),ht&&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:ht}),At.summary?` \u2014 ${At.summary}`:""]},bt)})]})]},`${Q.jobId}-${yt}`)}),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 E,nt;let yt=(E=c.tasks)==null?void 0:E.find(it=>it.id===Q.planTaskId),Lt=p&&Object.values(p).some(it=>it.annotationIds.includes(Q.id))?"running":(nt=Q.status)!=null?nt:"pending",ee=Lt==="resolved"?"#10b981":Lt==="running"?Q.color:Lt==="needs_review"?"#f59e0b":"#9ca3af";return ke("div",{style:{display:"flex",alignItems:"flex-start",gap:8,padding:"4px 0",cursor:Q.threadId&&u?"pointer":"default"},onClick:()=>{Q.threadId&&u&&u(Q.threadId)},children:[zt("div",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:ee,marginTop:4,flexShrink:0}}),ke("div",{style:{flex:1,fontSize:11,lineHeight:1.4},children:[zt("div",{children:(yt==null?void 0:yt.instruction)||Q.text||Q.planTaskId}),zt("div",{style:{color:"#9ca3af",fontSize:10},children:Lt})]})]},Q.id)})]}),(c==null?void 0:c.status)==="awaiting_approval"&&g&&f&&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",((se=d==null?void 0:d.length)!=null?se: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:g,style:{padding:"5px 14px",fontSize:11,fontWeight:600,fontFamily:Ee,backgroundColor:"#1f2937",color:"#ffffff",border:"none",cursor:"pointer"},children:"Approve"}),zt("button",{onClick:f,style:{padding:"5px 14px",fontSize:11,fontWeight:600,fontFamily:Ee,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(kl,{size:11}),zt("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:"Claude Code"}),Ft&&zt("span",{style:{fontSize:10,color:"#b0b7c3",fontStyle:"italic"},children:Ft}),ke("span",{style:{marginLeft:"auto",display:"flex",alignItems:"center",gap:6},children:[zt(Fp,{color:o}),a&&zt("button",{onClick:a,style:{background:"none",border:"1px solid rgba(0,0,0,0.1)",color:"#6b7280",fontSize:10,padding:"2px 8px",cursor:"pointer",fontFamily:"inherit"},children:"Cancel"})]})]}),Dt.map((Q,yt)=>{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},yt);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},yt);let Z=wl(Q.text);return Z?zt("div",{style:{paddingLeft:12,marginTop:2,marginBottom:2,lineHeight:1.5,wordBreak:"break-word"},children:Ar(Z)},yt):null})]})]}),!n&&l&&ke("div",{style:{padding:"8px 16px",backgroundColor:"rgba(239, 68, 68, 0.06)",borderBottom:"1px solid rgba(0,0,0,0.04)",fontSize:11,color:"#dc2626",lineHeight:1.4},children:[zt("span",{style:{fontWeight:600},children:"Error: "}),l]}),s&&ke("div",{style:Bp,children:[T.length>0&&ke("div",{style:{fontSize:11,color:"#6b7280",marginBottom:4,display:"flex",alignItems:"center",gap:4},children:[ke("span",{children:[T.length," image",T.length>1?"s":""," attached"]}),zt("button",{onClick:()=>z([]),style:{background:"none",border:"none",cursor:"pointer",fontSize:11,color:"#9ca3af",padding:"0 2px"},children:"\xD7"})]}),zt("textarea",{value:C,onChange:Q=>M(Q.target.value),onKeyDown:St,onPaste:_t,placeholder:"Reply... (Cmd+Enter to send)",style:{width:"100%",minHeight:60,padding:4,fontSize:12,fontFamily:Ee,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:G,disabled:!C.trim(),style:{padding:"5px 14px",fontSize:11,fontFamily:Ee,fontWeight:600,backgroundColor:C.trim()?o:"rgba(0,0,0,0.1)",color:C.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:C.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}import{Fragment as Xp,jsx as er,jsxs as Up}from"react/jsx-runtime";var Cl=Yp(null),os="devtools-provider",rs="devtools-model",is="devtools-open-thread-id",ss="devtools-active-plan",as=[{id:"claude-opus-4-6",label:"Opus 4.6"},{id:"claude-sonnet-4-6",label:"Sonn 4.6"}],ls=[{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 Gp(t,e,o){let n=t==="codex"?ls:as;return Math.min(o,(e==="codex"?ls:as).length-1)}function Jp({children:t,enabled:e=process.env.NODE_ENV==="development",bridgeUrl:o="http://localhost:1111"}){var ft,xt,Pt,pt,Ye,cn;let[n,r]=Zs(),i=Us(o),s=(ft=Vs())!=null?ft:o,a=on(new Map),[l,c]=Xe(()=>typeof window=="undefined"?"claude":localStorage.getItem(os)||"claude"),[d,p]=Xe(()=>{if(typeof window=="undefined")return 0;let v=localStorage.getItem(rs);return v&&parseInt(v,10)||0}),[u,g]=Xe(["claude","codex"]),[f,h]=Xe({}),[x,y]=Xe(!1);Re(()=>{i.isConnected&&As(s).then(v=>{if(!v)return;let J=Object.entries(v.providers).filter(([,ct])=>ct.available).map(([ct])=>ct);J.length>0&&g(J);let V={};for(let[ct,Tt]of Object.entries(v.providers))Tt.mcp&&(V[ct]=Tt.mcp);h(V),Object.values(V).every(ct=>ct.found)&&y(!1)})},[i.isConnected,s]),Re(()=>{if(u.length>0&&!u.includes(l)){let v=u[0];c(v),localStorage.setItem(os,v)}},[u,l]);let P=l==="codex"?ls:as,C=(xt=P[d])!=null?xt:P[0],M=Pe(v=>{let J=l;c(v),localStorage.setItem(os,v);let V=Gp(J,v,d);p(V),localStorage.setItem(rs,String(V))},[l,d]),T=Pe(v=>{p(v),localStorage.setItem(rs,String(v))},[]),z=Pe(async()=>{let v=await Hs(s);if(!v)return;let J={};for(let[V,wt]of Object.entries(v.capabilities.providers))wt.mcp&&(J[V]=wt.mcp);h(J),v.results.some(V=>V.installed)&&y(!0)},[s]),[R,H]=Xe(new Set),[q,et]=Xe(null),[B,U]=Xe(null),[tt,kt]=Xe(null),[at,Nt]=Xe(null);Re(()=>{i.isConnected&&mo(s).then(v=>{v!=null&&v.components&&H(new Set(Object.keys(v.components)))})},[i.isConnected,s]);let Et=Pe(async v=>{let J=[];for(let V of v)try{(await _s(V,s)).added&&J.push(V)}catch(wt){console.error("[Popmelt] Failed to add component to model:",V,wt)}J.length>0&&(H(V=>{let wt=new Set(V);for(let ct of J)wt.add(ct);return wt}),et(J[J.length-1]))},[s]),Dt=Pe(v=>{et(v)},[]),Ft=Pe(()=>{mo(s).then(v=>{v!=null&&v.components&&H(new Set(Object.keys(v.components)))})},[s]),G=Pe(async v=>{try{(await zs(v,s)).removed&&H(V=>{let wt=new Set(V);return wt.delete(v),wt})}catch(J){console.error("[Popmelt] Failed to remove component from model:",J)}},[s]),_t=Pe((v,J)=>{r({type:"MODIFY_SPACING_TOKEN",payload:v}),r({type:"ADD_SPACING_TOKEN_CHANGE",payload:J})},[r]),St=Pe((v,J)=>{r({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:v,originalValue:J}})},[r]),[Vt,qt]=Xe(0),Ot=on([]);Re(()=>{let v=Ot.current,J=n.spacingTokenMods;Ot.current=J;let V=new Map(v.map(Tt=>[Tt.tokenPath,Tt])),wt=new Map(J.map(Tt=>[Tt.tokenPath,Tt])),ct=!1;for(let[Tt,gt]of wt){let Bt=V.get(Tt);if(!(Bt&&Bt.currentValue===gt.currentValue)){ct=!0,gt.currentValue==="__deleted__"?$s(Tt,s).catch(Gt=>console.error("[Popmelt] Failed to sync token delete:",Gt)):Nr(Tt,gt.currentValue,s).catch(Gt=>console.error("[Popmelt] Failed to sync token update:",Gt));for(let Gt of gt.targets){let Qt=document.querySelector(Gt.selector);if(Qt)if(gt.currentValue==="__deleted__")Qt.style.removeProperty(Gt.property);else{let ce=gt.currentPx;ce>0&&Qt.style.setProperty(Gt.property,`${ce}px`,"important")}}}}for(let[Tt,gt]of V)if(!wt.has(Tt)){ct=!0,Nr(Tt,gt.originalValue,s).catch(Bt=>console.error("[Popmelt] Failed to restore token on undo:",Bt));for(let Bt of gt.targets){let Gt=document.querySelector(Bt.selector);Gt&&Gt.style.removeProperty(Bt.property)}}ct&&qt(Tt=>Tt+1)},[n.spacingTokenMods,s]);let[mt,se]=Xe(()=>typeof window=="undefined"?null:localStorage.getItem(is)||null),[Q,yt]=Xe(new Set),[Z,Lt]=Xe(()=>{if(typeof window=="undefined")return null;try{let v=localStorage.getItem(ss);return v?JSON.parse(v):null}catch(v){return null}});Re(()=>{mt?localStorage.setItem(is,mt):localStorage.removeItem(is)},[mt]),Re(()=>{Z?localStorage.setItem(ss,JSON.stringify(Z)):localStorage.removeItem(ss)},[Z]);let ee="popmelt-in-flight-jobs",[E,nt]=Xe(()=>{try{let v=sessionStorage.getItem(ee);return v?JSON.parse(v):{}}catch(v){return{}}});Re(()=>{try{Object.keys(E).length>0?sessionStorage.setItem(ee,JSON.stringify(E)):sessionStorage.removeItem(ee)}catch(v){}},[E]);let it=on(!1);Re(()=>{if(it.current||n.annotations.length===0)return;it.current=!0;let v=new Set;for(let V of Object.values(E))for(let wt of V.annotationIds)v.add(wt);let J=n.annotations.filter(V=>v.has(V.id)?!1:!!(V.status==="in_flight"||(V.status==="pending"||!V.status)&&(V.captured||V.threadId))).map(V=>V.id);J.length>0&&r({type:"SET_ANNOTATION_STATUS",payload:{ids:J,status:"dismissed"}}),Z&&(Z.status==="planning"||Z.status==="executing"||Z.status==="reviewing")&&Object.keys(E).length===0&&Lt(null)},[n.annotations,E,r,Z]);let At=_o(()=>{let v=new Set;for(let J of Object.values(E))for(let V of J.annotationIds)v.add(V);return v},[E]),bt=_o(()=>{let v=new Set;for(let J of Object.values(E))for(let V of J.styleSelectors)v.add(V);return v},[E]),Ct=_o(()=>{let v=new Map;for(let J of Object.values(E)){for(let V of J.styleSelectors)v.set(V,J.color);for(let V of J.annotationIds){let wt=n.annotations.find(ct=>ct.id===V);if(wt&&(wt.linkedSelector&&v.set(wt.linkedSelector,J.color),wt.groupId))for(let ct of n.annotations)ct.groupId===wt.groupId&&ct.linkedSelector&&v.set(ct.linkedSelector,J.color)}}return v},[E,n.annotations]),ht=on(n.annotations);ht.current=n.annotations;let Xt=on(n.styleModifications);Xt.current=n.styleModifications;let oe=on(E);oe.current=E,Re(()=>{let v=null,J=()=>{var Bt,Gt;if(Object.keys(oe.current).length>0)return;let wt=ht.current,ct=Xt.current,Tt=[],gt=[];for(let Qt of wt){if(!Qt.linkedSelector||!Qt.linkedSelector.startsWith("[data-pm=")||Qt.captured||Qt.status&&Qt.status!=="pending")continue;let ce=document.querySelector(Qt.linkedSelector);!ce&&((Gt=(Bt=Qt.elements)==null?void 0:Bt[0])!=null&&Gt.selector)&&(ce=document.querySelector(Qt.elements[0].selector)),ce||Tt.push(Qt.linkedSelector)}for(let Qt of ct)document.querySelector(Qt.selector)||gt.push(Qt.selector);(Tt.length>0||gt.length>0)&&r({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:Tt,styleSelectors:gt}})},V=new MutationObserver(wt=>{wt.some(ct=>ct.removedNodes.length>0)&&(v&&clearTimeout(v),v=setTimeout(J,3e3))});return V.observe(document.body,{childList:!0,subtree:!0}),()=>{V.disconnect(),v&&clearTimeout(v)}},[r]),Re(()=>{i.lastCompletedJobId&&i.lastCompletedJobId in E&&nt(v=>{var wt;let ct=v,{[wt=i.lastCompletedJobId]:J}=ct;return Wn(ct,[sr(wt)])})},[i.lastCompletedJobId]);let be=on(new Set);Re(()=>{let v=i.events.filter(J=>J.type==="done"&&J.data.resolutions);for(let J of v){let V=J.data.jobId;be.current.has(V)||(be.current.add(V),Array.isArray(J.data.resolutions)&&r({type:"APPLY_RESOLUTIONS",payload:{resolutions:J.data.resolutions,threadId:J.data.threadId}}))}},[i.events,r]);let ae=on(0);Re(()=>{let v=i.incrementalResolutions;if(v.length<=ae.current)return;let J=v.slice(ae.current);ae.current=v.length,r({type:"APPLY_RESOLUTIONS",payload:{resolutions:J}})},[i.incrementalResolutions,r]),Re(()=>{i.incrementalResolutions.length===0&&(ae.current=0)},[i.incrementalResolutions.length]);let Ne=on(i.status);Re(()=>{let v=Ne.current;Ne.current=i.status,v==="disconnected"&&i.status==="idle"&&nt({})},[i.status]);let re=Pe(async()=>{let v=document.getElementById("devtools-canvas");if(!v)return!1;let J=await ni(document.body,v,n.annotations);if(J.length===0)return!1;let V=await pa(J,n.annotations,n.styleModifications);return V&&r({type:"MARK_CAPTURED"}),V},[n.annotations,n.styleModifications,r]),Fe=Pe(async v=>{var J;try{let V=n.annotations.filter(pe=>{var Ue;return((Ue=pe.status)!=null?Ue:"pending")==="pending"}),wt=await xr(document.body,V);if(!wt)return!1;let ct=da(),Tt=n.styleModifications.filter(pe=>!pe.captured),gt=(J=n.inspectedElement)==null?void 0:J.info,Gt=V.length>0||Tt.length>0||!!gt?JSON.stringify(yr(V,Tt,gt)):void 0,{planId:Qt,threadId:ce}=await Os(wt,v,s,l,C.id,window.location.href,{width:window.innerWidth,height:window.innerHeight},ct,Gt,xo());if(Lt({planId:Qt,threadId:ce,goal:v,status:"planning"}),ce){let pe=n.annotations.filter(Ue=>{var tn;return Ue.type==="text"&&((tn=Ue.status)!=null?tn:"pending")==="pending"}).map(Ue=>Ue.id);pe.length>0&&r({type:"SET_ANNOTATION_THREAD",payload:{ids:pe,threadId:ce}})}return r({type:"MARK_CAPTURED"}),ce&&se(ce),!0}catch(V){return console.error("[Pare] Failed to send plan:",V),!1}},[s,l,C.id,n.annotations,n.styleModifications,n.inspectedElement,r]),$t=Pe(async v=>{let J=Z==null?void 0:Z.planId;if(!J)return;let V=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),wt=V!=null&&V[1]?parseFloat(V[1]):29,ct=v.length>1?360/v.length:0;for(let Tt=0;Tt<v.length;Tt++){let gt=v[Tt],Bt=(wt+Tt*ct)%360,Gt=`oklch(0.628 0.258 ${Math.round(Bt)})`,Qt=gt.region.y+gt.region.height/2,ce=window.innerHeight;(Qt<window.scrollY||Qt>window.scrollY+ce)&&(window.scrollTo({top:Math.max(0,Qt-ce/2),behavior:"instant"}),await new Promise(Bn=>requestAnimationFrame(()=>requestAnimationFrame(()=>Bn()))));let pe=Wr(gt.region),Ue=Math.random().toString(36).substring(2,9),tn=pe?{x:pe.rect.left+window.scrollX,y:pe.rect.top+window.scrollY,width:pe.rect.width,height:pe.rect.height}:gt.region;r({type:"ADD_PLAN_ANNOTATION",payload:{groupId:Ue,planId:J,planTaskId:gt.id,instruction:gt.instruction,region:tn,color:Gt,linkedSelector:pe==null?void 0:pe.selector,elements:pe?[pe.info]:void 0}}),Tt<v.length-1&&await new Promise(Bn=>setTimeout(Bn,200))}},[Z==null?void 0:Z.planId,n.activeColor,r]),Sn=Pe((v,J)=>{let V=a.current.get(v)||[];a.current.set(v,[...V,...J])},[]),Ie=Pe(async()=>{let v=document.getElementById("devtools-canvas");if(!v)return!1;let J=n.annotations.filter(Gt=>{var Qt;return((Qt=Gt.status)!=null?Qt:"pending")==="pending"}),V=n.spacingTokenChanges.filter(Gt=>!Gt.captured);if(J.length===0&&n.styleModifications.filter(Gt=>!Gt.captured).length===0&&V.length===0)return!1;let wt=await ni(document.body,v,n.annotations);if(wt.length===0)return!1;let ct=await br(wt);if(!ct)return!1;let Tt=yr(J,n.styleModifications,void 0,V.length>0?V:void 0),gt=JSON.stringify(Tt),Bt=new Map;for(let Gt of J){let Qt=a.current.get(Gt.id);if(Qt&&Qt.length>0&&Bt.set(Gt.id,Qt),Gt.groupId){for(let ce of J)if(ce.groupId===Gt.groupId&&ce.id!==Gt.id){let pe=a.current.get(ce.id);pe&&pe.length>0&&Bt.set(ce.id,pe)}}}try{let Gt=ei(n.activeColor),{jobId:Qt,threadId:ce}=await Bs(ct,gt,s,Gt,l,C.id,Bt.size>0?Bt:void 0,xo());for(let Me of Bt.keys())a.current.delete(Me);let pe=J.map(Me=>Me.id),Ue=n.styleModifications.filter(Me=>!Me.captured).map(Me=>Me.selector);nt(Me=>b(m({},Me),{[Qt]:{annotationIds:pe,styleSelectors:Ue,color:n.activeColor,threadId:ce}})),r({type:"MARK_CAPTURED"}),ce&&pe.length>0&&r({type:"SET_ANNOTATION_THREAD",payload:{ids:pe,threadId:ce}});let tn=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),po=((tn!=null&&tn[1]?parseFloat(tn[1]):29)+60)%360;return r({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${po})`}),!0}catch(Gt){return console.error("[Pare] Failed to send to bridge:",Gt),!1}},[n.annotations,n.styleModifications,n.spacingTokenChanges,n.activeColor,r,s,l,C.id]),Ae=Pe(async(v,J,V)=>{try{let wt=ei(n.activeColor),{jobId:ct}=await Ws(v,J,s,wt,l,C.id,V,xo());nt(gt=>b(m({},gt),{[ct]:{annotationIds:[],styleSelectors:[],color:n.activeColor,threadId:v}}));let Tt=n.annotations.filter(gt=>gt.threadId===v&&(gt.status==="waiting_input"||gt.status==="resolved"||gt.status==="needs_review"));Tt.length>0&&(r({type:"SET_ANNOTATION_STATUS",payload:{ids:Tt.map(gt=>gt.id),status:"in_flight"}}),nt(gt=>{let Bt=gt[ct];return Bt?b(m({},gt),{[ct]:b(m({},Bt),{annotationIds:[...Bt.annotationIds,...Tt.map(Gt=>Gt.id)]})}):gt})),i.dismissQuestion(v)}catch(wt){console.error("[Pare] Failed to send reply:",wt)}},[n.activeColor,n.annotations,s,i.dismissQuestion,r,l,C.id]),qe=Pe(async()=>{if(!(!Z||!Z.planId))try{await Ds(Z.planId,s),Lt(gt=>gt?b(m({},gt),{status:"executing"}):null);let v=await xr(document.body);if(!v)return;let J=n.annotations.filter(gt=>{var Bt;return gt.planId===Z.planId&>.type!=="text"&&((Bt=gt.status)!=null?Bt:"pending")==="pending"}),V=J.map(gt=>{var Bn,po,Me;let Bt=gt.groupId?n.annotations.find(kn=>kn.groupId===gt.groupId&&kn.type==="text"):void 0,Gt=(Bn=gt.points[0])!=null?Bn:{x:0,y:0},Qt=(po=gt.points[1])!=null?po:Gt,ce=Math.min(Gt.x,Qt.x),pe=Math.min(Gt.y,Qt.y),Ue=Math.abs(Qt.x-Gt.x)||100,tn=Math.abs(Qt.y-Gt.y)||100;return{planTaskId:gt.planTaskId||gt.id,annotationId:gt.id,instruction:(Bt==null?void 0:Bt.text)||gt.text||"No instruction",region:{x:ce,y:pe,width:Ue,height:tn},linkedSelector:gt.linkedSelector,elements:(Me=gt.elements)==null?void 0:Me.map(kn=>({selector:kn.selector,reactComponent:kn.reactComponent}))}});if(V.length===0)return;let{jobId:wt}=await Fs(v,Z.planId,V,s,l,C.id,xo()),ct=[],Tt=new Set;for(let gt of J)if(Tt.has(gt.id)||(Tt.add(gt.id),ct.push(gt.id)),gt.groupId)for(let Bt of n.annotations)Bt.groupId===gt.groupId&&!Tt.has(Bt.id)&&(Tt.add(Bt.id),ct.push(Bt.id));nt(gt=>b(m({},gt),{[wt]:{annotationIds:ct,styleSelectors:[],color:n.activeColor,planId:Z.planId}})),r({type:"SET_ANNOTATION_STATUS",payload:{ids:ct,status:"in_flight"}}),r({type:"MARK_CAPTURED"})}catch(v){console.error("[Pare] Failed to approve plan:",v)}},[Z,n.annotations,n.activeColor,s,l,C.id,r]),rn=Pe(()=>{if(Lt(null),Z!=null&&Z.planId){let v=n.annotations.filter(J=>J.planId===Z.planId);for(let J of v)r({type:"DELETE_ANNOTATION",payload:{id:J.id}})}},[Z,n.annotations,r]),sn=on(new Set);Re(()=>{for(let v of i.pendingQuestions){if(sn.current.has(v.jobId))continue;sn.current.add(v.jobId);let J=v.annotationIds&&v.annotationIds.length>0?v.annotationIds:void 0;!J&&v.threadId&&(J=n.annotations.filter(V=>V.threadId===v.threadId).map(V=>V.id)),J&&J.length>0&&r({type:"SET_ANNOTATION_QUESTION",payload:{ids:J,question:v.question,threadId:v.threadId}})}},[i.pendingQuestions,r,n.annotations]);let an=on(new Set),He=on(null);Re(()=>{for(let v of i.pendingPlans){if(an.current.has(v.planId))continue;an.current.add(v.planId);let J=v.tasks.length===1;Lt(V=>(V==null?void 0:V.planId)!==v.planId?V:b(m({},V),{tasks:v.tasks,threadId:v.threadId,status:J?"executing":"awaiting_approval"})),$t(v.tasks).then(()=>{J&&(He.current=v.planId)}),i.dismissPlan(v.planId)}},[i.pendingPlans]),Re(()=>{!He.current||!Z||Z.planId!==He.current||n.annotations.filter(J=>J.planId===Z.planId&&J.type!=="text").length===0||(He.current=null,qe())},[Z,n.annotations,qe]),Re(()=>{for(let v of i.planReviews)!Z||Z.planId!==v.planId||v.verdict==="pass"&&Lt(J=>J?b(m({},J),{status:"done"}):null)},[i.planReviews,Z]);let j=on(new Set);Re(()=>{!Z||Z.status!=="executing"||j.current.has(Z.planId)||Object.entries(E).filter(([V,wt])=>wt.planId===Z.planId).length>0||n.annotations.filter(V=>V.planId===Z.planId&&(V.status==="resolved"||V.status==="needs_review")).length===0||(j.current.add(Z.planId),(async()=>{try{Lt(wt=>wt?b(m({},wt),{status:"reviewing"}):null);let V=await xr(document.body);if(!V)return;await Ns(Z.planId,V,s,l,C.id,xo())}catch(V){console.error("[Pare] Failed to trigger review:",V)}})())},[Z,E,n.annotations,s,l,C.id]);let Ht=_o(()=>{if(i.activeJobId&&i.activeJobId in E)return E[i.activeJobId].color;let v=Object.values(E);return v.length>0?v[v.length-1].color:void 0},[i.activeJobId,E]),Wt=Pe(v=>{se(v)},[]),gn=Pe(async v=>{try{let J=v?`${s}/cancel?jobId=${v}`:`${s}/cancel`;await fetch(J,{method:"POST"})}catch(J){}},[s]);Re(()=>{n.activeTool==="model"&&mt&&se(null)},[n.activeTool]);let he=on(null);Re(()=>{n.isAnnotating?he.current&&(se(he.current),he.current=null):mt&&(he.current=mt,se(null))},[n.isAnnotating]);let fe=_o(()=>{if(!mt)return null;for(let[v,J]of Object.entries(E))if(J.threadId===mt)return v;return null},[mt,E]),[ge,xe]=Xe(!1),[mn,ln]=Xe(0),Qe=on(null),ie=Pe(v=>{v?(Qe.current&&(clearTimeout(Qe.current),Qe.current=null),xe(!0)):Qe.current=setTimeout(()=>{xe(!1),Qe.current=null},150)},[]),X=Pe(()=>{ln(v=>v+1),i.clearEvents(),se(null),yt(new Set)},[i.clearEvents]);Re(()=>()=>{Qe.current&&clearTimeout(Qe.current)},[]);let ot=_o(()=>({isEnabled:e}),[e]);return e?Up(Cl.Provider,{value:ot,children:[t,er(rl,{state:n,dispatch:r,onScreenshot:re,inFlightAnnotationIds:At,inFlightStyleSelectors:bt,inFlightSelectorColors:Ct,onAttachImages:Sn,onReply:i.isConnected?Ae:void 0,onViewThread:i.isConnected?Wt:void 0,onCloseThread:v=>{se(null),v&&yt(J=>new Set(J).add(v))},activePlan:Z,onModelComponentsAdd:i.isConnected?Et:void 0,onModelComponentFocus:i.isConnected?Dt:void 0,onModelComponentHover:U,modelComponentNames:R,modelPanelHoveredComponent:tt,modelSpacingTokenHover:at}),er(hl,{state:n,dispatch:r,onScreenshot:re,onSendToClaude:i.isConnected?Ie:void 0,onPlanGoal:i.isConnected?Fe:void 0,hasActiveJobs:Object.keys(E).length>0||i.activeJobIds.length>0,activeJobColor:Ht,onCrosshairHover:ie,onClear:X,provider:l,onProviderChange:i.isConnected&&u.length>1?M:void 0,availableProviders:u,modelIndex:d,modelCount:P.length,modelLabel:C.label,onModelChange:i.isConnected?T:void 0,onViewThread:i.isConnected?Wt:void 0,isThreadPanelOpen:mt!==null,activePlan:Z,mcpStatus:f,onInstallMcp:i.isConnected?z:void 0,mcpJustInstalled:x,bridgeUrl:s,isBridgeConnected:i.isConnected,modelSelectedComponent:q,modelCanvasHoveredComponent:B,onModelComponentHover:kt,onSpacingTokenHover:Nt,onModifySpacingToken:i.isConnected?_t:void 0,onDeleteSpacingToken:i.isConnected?St:void 0,modelRefreshKey:Vt,onModelComponentAdded:Ft,onModelComponentRemoved:G}),mt&&i.isConnected&&er(El,{threadId:mt,bridgeUrl:s,accentColor:(pt=(Pt=n.annotations.find(v=>v.threadId===mt))==null?void 0:Pt.color)!=null?pt:n.activeColor,isStreaming:fe!==null,streamingEvents:fe?i.events.filter(v=>v.data.jobId===fe):[],onClose:()=>se(null),onReply:Ae,onCancel:fe?()=>gn(fe):void 0,lastError:(cn=(Ye=i.lastErrorByJob)==null?void 0:Ye[fe!=null?fe:""])!=null?cn:void 0,activePlan:Z,planAnnotations:Z?n.annotations.filter(v=>v.planId===Z.planId&&v.type!=="text"):void 0,inFlightJobs:E,onViewThread:Wt,onApprovePlan:(Z==null?void 0:Z.status)==="awaiting_approval"?qe:void 0,onDismissPlan:(Z==null?void 0:Z.status)==="awaiting_approval"?rn:void 0}),er(xl,{bridge:i,bridgeUrl:s,inFlightJobs:E,isVisible:ge||i.lastResponseText!==null||i.activeJobIds.length>0,onHover:ie,clearSignal:mn,onReply:Ae,onViewThread:Wt,onCancel:gn,isConnected:i.isConnected,dismissedThreadIds:Q})]}):er(Xp,{children:t})}function Vp(){let t=jp(Cl);if(!t)throw new Error("usePopmelt must be used within PopmeltProvider");return t}export{Jp as PopmeltProvider,Vp as usePopmelt};
|
|
33
|
+
`,Bp={borderTop:"1px solid rgba(0, 0, 0, 0.08)",padding:12};function wl(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 Op(t){return new Date(t).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var ts=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Dp=3e3,Np=250;function kl({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 Fp({color:t}){let[e,o]=uo(0),[n,r]=uo(()=>Math.floor(Math.random()*ts.length));return Xn(()=>{let i=setInterval(()=>o(a=>(a+1)%2),Np),s=setInterval(()=>r(a=>(a+1)%ts.length),Dp);return()=>{clearInterval(i),clearInterval(s)}},[]),Ee("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?Ee(es,{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"})]}):Ee(es,{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:ts[n]})]})}function Hp(t){var r;let e=String(t.data.tool||""),o=t.data.file?String(t.data.file):null,n=o?(r=o.split("/").pop())!=null?r:o:null;switch(e){case"Read":return n?`Reading ${n}`:"Reading file";case"Edit":return n?`Editing ${n}`:"Editing file";case"Write":return n?`Writing ${n}`:"Writing file";case"Bash":return"Running command";case"Glob":return"Searching files";case"Grep":return"Searching code";case"WebFetch":return"Fetching page";case"WebSearch":return"Searching web";default:return e?`Using ${e}`:null}}var _p=new Set(["Read","Glob","Grep","WebFetch","WebSearch"]),zp=new Set(["Edit","Write","Bash"]);function $p(t){let e=0,o=!1;for(let n of t){if(n.type!=="tool_use")continue;let r=String(n.data.tool||"");zp.has(r)?o=!0:_p.has(r)&&e++}return!o&&e>=3?"researching":o?"applying changes":null}function Wp(t){let e=[];for(let o of t)if(o.type==="tool_use"){let n=Hp(o);n&&e.push({kind:"tool",label:n})}else if(o.type==="delta"){let n=String(o.data.text||"");if(!n)continue;let r=e[e.length-1];r&&r.kind==="text"?r.text+=n:e.push({kind:"text",text:n})}else if(o.type==="thinking"){let n=String(o.data.text||"");if(!n)continue;let r=e[e.length-1];r&&r.kind==="thinking"?r.text+=n:e.push({kind:"thinking",text:n})}return e}function El({threadId:t,bridgeUrl:e,accentColor:o,isStreaming:n,streamingEvents:r,onClose:i,onReply:s,onCancel:a,lastError:l,activePlan:c,planAnnotations:d,inFlightJobs:p,onViewThread:u,onApprovePlan:g,onDismissPlan:f}){var mt,se;let[m,x]=uo([]),[y,P]=uo(!0),[C,M]=uo(""),[T,H]=uo([]),L=$n(null),_=$n(null),q=$n(null),et=$n(n),B=$n(Qi()),U=$n({x:0,y:0}),tt=$n(!1),kt=$n({x:0,y:0,offsetX:0,offsetY:0}),at=$n(!1),[,Nt]=uo(0);Xn(()=>{try{let Q=localStorage.getItem(qi);if(Q){let yt=JSON.parse(Q);typeof yt.top=="number"&&typeof yt.left=="number"&&(at.current=!0,B.current={top:yt.top,left:yt.left},Nt(K=>K+1))}}catch(Q){}},[]),Xn(()=>{let Q=()=>{at.current||(B.current=Qi()),Nt(yt=>yt+1)};return window.addEventListener("resize",Q,{passive:!0}),()=>window.removeEventListener("resize",Q)},[]),Xn(()=>{let Q=q.current;if(!Q)return;let yt=E=>{E.button!==0||E.target.closest("button")||(E.preventDefault(),E.stopPropagation(),tt.current=!0,kt.current={x:E.clientX,y:E.clientY,offsetX:U.current.x,offsetY:U.current.y})},K=E=>{if(!tt.current)return;let nt=kt.current,it=nt.offsetX+(E.clientX-nt.x),At=nt.offsetY+(E.clientY-nt.y),bt=Math.max(Ho,Math.min(window.innerWidth-Br-2*ns-Ho,B.current.left+it)),Ct=Math.max(Ho,B.current.top+At);U.current={x:bt-B.current.left,y:Ct-B.current.top};let ht=_.current;ht&&(ht.style.top=`${Ct}px`,ht.style.left=`${bt}px`,ht.style.height=`${Sl(Ct,bt)}px`)},Lt=()=>{if(!tt.current)return;let E=B.current.top+U.current.y,nt=B.current.left+U.current.x;B.current={top:E,left:nt},U.current={x:0,y:0},at.current=!0;try{localStorage.setItem(qi,JSON.stringify({top:E,left:nt}))}catch(it){}tt.current=!1},ee=()=>{B.current=Qi(),U.current={x:0,y:0},at.current=!1;try{localStorage.removeItem(qi)}catch(E){}Nt(E=>E+1)};return Q.addEventListener("mousedown",yt),window.addEventListener("mousemove",K),window.addEventListener("mouseup",Lt),Q.addEventListener("dblclick",ee),()=>{Q.removeEventListener("mousedown",yt),window.removeEventListener("mousemove",K),window.removeEventListener("mouseup",Lt),Q.removeEventListener("dblclick",ee)}},[]);let Et=Pr(()=>{fetch(`${e}/thread/${t}`).then(Q=>Q.json()).then(Q=>{var yt;x((yt=Q.messages)!=null?yt:[]),P(!1)}).catch(()=>P(!1))},[e,t]);Xn(()=>{P(!0),Et()},[Et]),Xn(()=>{et.current&&!n&&Et(),et.current=n},[n,Et]);let Dt=r?Wp(r):[],Ft=r?$p(r):null;Xn(()=>{L.current&&(L.current.scrollTop=L.current.scrollHeight)},[m,Dt.length,n]),Xn(()=>{let Q=yt=>{yt.key==="Escape"&&(yt.stopPropagation(),i())};return document.addEventListener("keydown",Q),()=>document.removeEventListener("keydown",Q)},[i]);let G=Pr(()=>{if(!C.trim()||!s)return;let Q=C.trim(),yt=T.length>0?T:void 0;x(K=>[...K,{role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:yt?`${Q} [${yt.length} image${yt.length>1?"s":""}]`:Q}]),s(t,Q,yt),M(""),H([])},[C,T,t,s]),_t=Pr(Q=>{let yt=Q.clipboardData.items,K=[];for(let Lt=0;Lt<yt.length;Lt++){let ee=yt[Lt];if(ee.type.startsWith("image/")){let E=ee.getAsFile();E&&K.push(E)}}K.length>0&&(Q.preventDefault(),H(Lt=>[...Lt,...K]))},[]),St=Pr(Q=>{Q.key==="Enter"&&(Q.metaKey||Q.ctrlKey)&&(Q.preventDefault(),G())},[G]),Vt=B.current.top+U.current.y,qt=B.current.left+U.current.x,Ot=Sl(Vt,qt);return Ee(es,{children:[zt("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:Q=>{Q.target===Q.currentTarget&&i()},style:{position:"fixed",inset:0,zIndex:9999}}),Ee("div",{ref:_,style:b(h({},Lp),{height:Ot,position:"fixed",top:Vt,left:qt,zIndex:1e4}),"data-devtools":"thread-panel",children:[Ee("div",{ref:q,style:b(h({},Rp),{backgroundColor:o,color:"#ffffff",cursor:"grab",userSelect:"none",WebkitUserSelect:"none"}),children:[zt("span",{children:"Conversation"}),zt("button",{onClick:i,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),zt("style",{dangerouslySetInnerHTML:{__html:Pp}}),Ee("div",{ref:L,style:Ap,"data-devtools":"thread-panel-messages",children:[y&&zt("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!y&&m.length===0&&!n&&zt("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),m.map((Q,yt)=>{let K=Q.role==="human",Lt=K?Q.replyToQuestion||Q.feedbackSummary||"(annotation)":wl(Q.responseText||""),ee=K?void 0:Q.question,E=!K&&Q.resolutions&&Q.resolutions.length>0,nt=!K&&Q.toolsUsed&&Q.toolsUsed.length>0;if(!Lt&&!ee&&!E)return null;let it=yt===m.length-1;return Ee("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:it?1:.5},children:[Ee("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[!K&&zt(kl,{size:11}),zt("span",{style:{fontWeight:600,fontSize:11,color:K?o:"#6b7280"},children:K?"You":"Claude Code"}),zt("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:Op(Q.timestamp)})]}),Lt&&zt("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:K?Lt:Ar(Lt)}),ee&&zt("div",{style:{marginTop:Lt?4:0,lineHeight:1.5,wordBreak:"break-word"},children:Ar(ee)}),(nt||E)&&Ee("div",{style:{marginTop:Lt||ee?6:0,padding:"4px 8px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#6b7280"},children:[nt&&zt("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:Q.toolsUsed.map((At,bt)=>zt("div",{children:At},bt))}),E&&Q.resolutions.map((At,bt)=>{var Xt;let Ct=(Xt=At.finalScope)!=null?Xt:At.inferredScope,ht=Ct?`${Ct.breadth} \xB7 ${Ct.target}`:null;return Ee("div",{style:{marginTop:nt?4:0},children:[zt("span",{style:{color:At.status==="resolved"?"#10b981":"#f59e0b"},children:At.status==="resolved"?"Done":"Needs review"}),ht&&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:ht}),At.summary?` \u2014 ${At.summary}`:""]},bt)})]})]},`${Q.jobId}-${yt}`)}),c&&d&&d.length>0&&Ee("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 E,nt;let yt=(E=c.tasks)==null?void 0:E.find(it=>it.id===Q.planTaskId),Lt=p&&Object.values(p).some(it=>it.annotationIds.includes(Q.id))?"running":(nt=Q.status)!=null?nt:"pending",ee=Lt==="resolved"?"#10b981":Lt==="running"?Q.color:Lt==="needs_review"?"#f59e0b":"#9ca3af";return Ee("div",{style:{display:"flex",alignItems:"flex-start",gap:8,padding:"4px 0",cursor:Q.threadId&&u?"pointer":"default"},onClick:()=>{Q.threadId&&u&&u(Q.threadId)},children:[zt("div",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:ee,marginTop:4,flexShrink:0}}),Ee("div",{style:{flex:1,fontSize:11,lineHeight:1.4},children:[zt("div",{children:(yt==null?void 0:yt.instruction)||Q.text||Q.planTaskId}),zt("div",{style:{color:"#9ca3af",fontSize:10},children:Lt})]})]},Q.id)})]}),(c==null?void 0:c.status)==="awaiting_approval"&&g&&f&&Ee("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[Ee("div",{style:{fontWeight:600,fontSize:12},children:[(mt=d==null?void 0:d.length)!=null?mt:0," task",((se=d==null?void 0:d.length)!=null?se:0)!==1?"s":""," planned"]}),zt("div",{style:{color:"#6b7280",fontSize:11,marginTop:2,marginBottom:8},children:"Review annotations, then approve to start workers"}),Ee("div",{style:{display:"flex",gap:8},children:[zt("button",{onClick:g,style:{padding:"5px 14px",fontSize:11,fontWeight:600,fontFamily:Ce,backgroundColor:"#1f2937",color:"#ffffff",border:"none",cursor:"pointer"},children:"Approve"}),zt("button",{onClick:f,style:{padding:"5px 14px",fontSize:11,fontWeight:600,fontFamily:Ce,backgroundColor:"transparent",color:"#6b7280",border:"1px solid rgba(0, 0, 0, 0.1)",cursor:"pointer"},children:"Dismiss"})]})]}),n&&Ee("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[Ee("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[zt(kl,{size:11}),zt("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:"Claude Code"}),Ft&&zt("span",{style:{fontSize:10,color:"#b0b7c3",fontStyle:"italic"},children:Ft}),Ee("span",{style:{marginLeft:"auto",display:"flex",alignItems:"center",gap:6},children:[zt(Fp,{color:o}),a&&zt("button",{onClick:a,style:{background:"none",border:"1px solid rgba(0,0,0,0.1)",color:"#6b7280",fontSize:10,padding:"2px 8px",cursor:"pointer",fontFamily:"inherit"},children:"Cancel"})]})]}),Dt.map((Q,yt)=>{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},yt);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},yt);let K=wl(Q.text);return K?zt("div",{style:{paddingLeft:12,marginTop:2,marginBottom:2,lineHeight:1.5,wordBreak:"break-word"},children:Ar(K)},yt):null})]})]}),!n&&l&&Ee("div",{style:{padding:"8px 16px",backgroundColor:"rgba(239, 68, 68, 0.06)",borderBottom:"1px solid rgba(0,0,0,0.04)",fontSize:11,color:"#dc2626",lineHeight:1.4},children:[zt("span",{style:{fontWeight:600},children:"Error: "}),l]}),s&&Ee("div",{style:Bp,children:[T.length>0&&Ee("div",{style:{fontSize:11,color:"#6b7280",marginBottom:4,display:"flex",alignItems:"center",gap:4},children:[Ee("span",{children:[T.length," image",T.length>1?"s":""," attached"]}),zt("button",{onClick:()=>H([]),style:{background:"none",border:"none",cursor:"pointer",fontSize:11,color:"#9ca3af",padding:"0 2px"},children:"\xD7"})]}),zt("textarea",{value:C,onChange:Q=>M(Q.target.value),onKeyDown:St,onPaste:_t,placeholder:"Reply... (Cmd+Enter to send)",style:{width:"100%",minHeight:60,padding:4,fontSize:12,fontFamily:Ce,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:G,disabled:!C.trim(),style:{padding:"5px 14px",fontSize:11,fontFamily:Ce,fontWeight:600,backgroundColor:C.trim()?o:"rgba(0,0,0,0.1)",color:C.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:C.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}import{Fragment as Xp,jsx as er,jsxs as Up}from"react/jsx-runtime";var Cl=Yp(null),os="devtools-provider",rs="devtools-model",is="devtools-open-thread-id",ss="devtools-active-plan",as=[{id:"claude-opus-4-6",label:"Opus 4.6"},{id:"claude-sonnet-4-6",label:"Sonn 4.6"}],ls=[{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 Gp(t,e,o){let n=t==="codex"?ls:as;return Math.min(o,(e==="codex"?ls:as).length-1)}function Jp({children:t,enabled:e=process.env.NODE_ENV==="development",bridgeUrl:o="http://localhost:1111"}){var ft,xt,Pt,pt,Ye,cn;let[n,r]=Zs(),i=Us(o),s=(ft=Vs())!=null?ft:o,a=on(new Map),[l,c]=Xe(()=>typeof window=="undefined"?"claude":localStorage.getItem(os)||"claude"),[d,p]=Xe(()=>{if(typeof window=="undefined")return 0;let v=localStorage.getItem(rs);return v&&parseInt(v,10)||0}),[u,g]=Xe(["claude","codex"]),[f,m]=Xe({}),[x,y]=Xe(!1);Re(()=>{i.isConnected&&As(s).then(v=>{if(!v)return;let J=Object.entries(v.providers).filter(([,ct])=>ct.available).map(([ct])=>ct);J.length>0&&g(J);let V={};for(let[ct,Tt]of Object.entries(v.providers))Tt.mcp&&(V[ct]=Tt.mcp);m(V),Object.values(V).every(ct=>ct.found)&&y(!1)})},[i.isConnected,s]),Re(()=>{if(u.length>0&&!u.includes(l)){let v=u[0];c(v),localStorage.setItem(os,v)}},[u,l]);let P=l==="codex"?ls:as,C=(xt=P[d])!=null?xt:P[0],M=Pe(v=>{let J=l;c(v),localStorage.setItem(os,v);let V=Gp(J,v,d);p(V),localStorage.setItem(rs,String(V))},[l,d]),T=Pe(v=>{p(v),localStorage.setItem(rs,String(v))},[]),H=Pe(async()=>{let v=await Hs(s);if(!v)return;let J={};for(let[V,wt]of Object.entries(v.capabilities.providers))wt.mcp&&(J[V]=wt.mcp);m(J),v.results.some(V=>V.installed)&&y(!0)},[s]),[L,_]=Xe(new Set),[q,et]=Xe(null),[B,U]=Xe(null),[tt,kt]=Xe(null),[at,Nt]=Xe(null);Re(()=>{i.isConnected&&mo(s).then(v=>{v!=null&&v.components&&_(new Set(Object.keys(v.components)))})},[i.isConnected,s]);let Et=Pe(async v=>{let J=[];for(let V of v)try{(await _s(V,s)).added&&J.push(V)}catch(wt){console.error("[Popmelt] Failed to add component to model:",V,wt)}J.length>0&&(_(V=>{let wt=new Set(V);for(let ct of J)wt.add(ct);return wt}),et(J[J.length-1]))},[s]),Dt=Pe(v=>{et(v)},[]),Ft=Pe(()=>{mo(s).then(v=>{v!=null&&v.components&&_(new Set(Object.keys(v.components)))})},[s]),G=Pe(async v=>{try{(await zs(v,s)).removed&&_(V=>{let wt=new Set(V);return wt.delete(v),wt})}catch(J){console.error("[Popmelt] Failed to remove component from model:",J)}},[s]),_t=Pe((v,J)=>{r({type:"MODIFY_SPACING_TOKEN",payload:v}),r({type:"ADD_SPACING_TOKEN_CHANGE",payload:J})},[r]),St=Pe((v,J)=>{r({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:v,originalValue:J}})},[r]),[Vt,qt]=Xe(0),Ot=on([]);Re(()=>{let v=Ot.current,J=n.spacingTokenMods;Ot.current=J;let V=new Map(v.map(Tt=>[Tt.tokenPath,Tt])),wt=new Map(J.map(Tt=>[Tt.tokenPath,Tt])),ct=!1;for(let[Tt,gt]of wt){let Bt=V.get(Tt);if(!(Bt&&Bt.currentValue===gt.currentValue)){ct=!0,gt.currentValue==="__deleted__"?$s(Tt,s).catch(Gt=>console.error("[Popmelt] Failed to sync token delete:",Gt)):Nr(Tt,gt.currentValue,s).catch(Gt=>console.error("[Popmelt] Failed to sync token update:",Gt));for(let Gt of gt.targets){let Qt=document.querySelector(Gt.selector);if(Qt)if(gt.currentValue==="__deleted__")Qt.style.removeProperty(Gt.property);else{let ce=gt.currentPx;ce>0&&Qt.style.setProperty(Gt.property,`${ce}px`,"important")}}}}for(let[Tt,gt]of V)if(!wt.has(Tt)){ct=!0,Nr(Tt,gt.originalValue,s).catch(Bt=>console.error("[Popmelt] Failed to restore token on undo:",Bt));for(let Bt of gt.targets){let Gt=document.querySelector(Bt.selector);Gt&&Gt.style.removeProperty(Bt.property)}}ct&&qt(Tt=>Tt+1)},[n.spacingTokenMods,s]);let[mt,se]=Xe(()=>typeof window=="undefined"?null:localStorage.getItem(is)||null),[Q,yt]=Xe(new Set),[K,Lt]=Xe(()=>{if(typeof window=="undefined")return null;try{let v=localStorage.getItem(ss);return v?JSON.parse(v):null}catch(v){return null}});Re(()=>{mt?localStorage.setItem(is,mt):localStorage.removeItem(is)},[mt]),Re(()=>{K?localStorage.setItem(ss,JSON.stringify(K)):localStorage.removeItem(ss)},[K]);let ee="popmelt-in-flight-jobs",[E,nt]=Xe(()=>{try{let v=sessionStorage.getItem(ee);return v?JSON.parse(v):{}}catch(v){return{}}});Re(()=>{try{Object.keys(E).length>0?sessionStorage.setItem(ee,JSON.stringify(E)):sessionStorage.removeItem(ee)}catch(v){}},[E]);let it=on(!1);Re(()=>{if(it.current||n.annotations.length===0)return;it.current=!0;let v=new Set;for(let V of Object.values(E))for(let wt of V.annotationIds)v.add(wt);let J=n.annotations.filter(V=>v.has(V.id)?!1:!!(V.status==="in_flight"||(V.status==="pending"||!V.status)&&(V.captured||V.threadId))).map(V=>V.id);J.length>0&&r({type:"SET_ANNOTATION_STATUS",payload:{ids:J,status:"dismissed"}}),K&&(K.status==="planning"||K.status==="executing"||K.status==="reviewing")&&Object.keys(E).length===0&&Lt(null)},[n.annotations,E,r,K]);let At=_o(()=>{let v=new Set;for(let J of Object.values(E))for(let V of J.annotationIds)v.add(V);return v},[E]),bt=_o(()=>{let v=new Set;for(let J of Object.values(E))for(let V of J.styleSelectors)v.add(V);return v},[E]),Ct=_o(()=>{let v=new Map;for(let J of Object.values(E)){for(let V of J.styleSelectors)v.set(V,J.color);for(let V of J.annotationIds){let wt=n.annotations.find(ct=>ct.id===V);if(wt&&(wt.linkedSelector&&v.set(wt.linkedSelector,J.color),wt.groupId))for(let ct of n.annotations)ct.groupId===wt.groupId&&ct.linkedSelector&&v.set(ct.linkedSelector,J.color)}}return v},[E,n.annotations]),ht=on(n.annotations);ht.current=n.annotations;let Xt=on(n.styleModifications);Xt.current=n.styleModifications;let oe=on(E);oe.current=E,Re(()=>{let v=null,J=()=>{var Bt,Gt;if(Object.keys(oe.current).length>0)return;let wt=ht.current,ct=Xt.current,Tt=[],gt=[];for(let Qt of wt){if(!Qt.linkedSelector||!Qt.linkedSelector.startsWith("[data-pm=")||Qt.captured||Qt.status&&Qt.status!=="pending")continue;let ce=document.querySelector(Qt.linkedSelector);!ce&&((Gt=(Bt=Qt.elements)==null?void 0:Bt[0])!=null&&Gt.selector)&&(ce=document.querySelector(Qt.elements[0].selector)),ce||Tt.push(Qt.linkedSelector)}for(let Qt of ct)document.querySelector(Qt.selector)||gt.push(Qt.selector);(Tt.length>0||gt.length>0)&&r({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:Tt,styleSelectors:gt}})},V=new MutationObserver(wt=>{wt.some(ct=>ct.removedNodes.length>0)&&(v&&clearTimeout(v),v=setTimeout(J,3e3))});return V.observe(document.body,{childList:!0,subtree:!0}),()=>{V.disconnect(),v&&clearTimeout(v)}},[r]),Re(()=>{i.lastCompletedJobId&&i.lastCompletedJobId in E&&nt(v=>{var wt;let ct=v,{[wt=i.lastCompletedJobId]:J}=ct;return Wn(ct,[sr(wt)])})},[i.lastCompletedJobId]);let be=on(new Set);Re(()=>{let v=i.events.filter(J=>J.type==="done"&&J.data.resolutions);for(let J of v){let V=J.data.jobId;be.current.has(V)||(be.current.add(V),Array.isArray(J.data.resolutions)&&r({type:"APPLY_RESOLUTIONS",payload:{resolutions:J.data.resolutions,threadId:J.data.threadId}}))}},[i.events,r]);let ae=on(0);Re(()=>{let v=i.incrementalResolutions;if(v.length<=ae.current)return;let J=v.slice(ae.current);ae.current=v.length,r({type:"APPLY_RESOLUTIONS",payload:{resolutions:J}})},[i.incrementalResolutions,r]),Re(()=>{i.incrementalResolutions.length===0&&(ae.current=0)},[i.incrementalResolutions.length]);let Ne=on(i.status);Re(()=>{let v=Ne.current;Ne.current=i.status,v==="disconnected"&&i.status==="idle"&&nt({})},[i.status]);let re=Pe(async()=>{let v=document.getElementById("devtools-canvas");if(!v)return!1;let J=await ni(document.body,v,n.annotations);if(J.length===0)return!1;let V=await pa(J,n.annotations,n.styleModifications);return V&&r({type:"MARK_CAPTURED"}),V},[n.annotations,n.styleModifications,r]),Fe=Pe(async v=>{var J;try{let V=n.annotations.filter(pe=>{var Ue;return((Ue=pe.status)!=null?Ue:"pending")==="pending"}),wt=await xr(document.body,V);if(!wt)return!1;let ct=da(),Tt=n.styleModifications.filter(pe=>!pe.captured),gt=(J=n.inspectedElement)==null?void 0:J.info,Gt=V.length>0||Tt.length>0||!!gt?JSON.stringify(yr(V,Tt,gt)):void 0,{planId:Qt,threadId:ce}=await Os(wt,v,s,l,C.id,window.location.href,{width:window.innerWidth,height:window.innerHeight},ct,Gt,xo());if(Lt({planId:Qt,threadId:ce,goal:v,status:"planning"}),ce){let pe=n.annotations.filter(Ue=>{var tn;return Ue.type==="text"&&((tn=Ue.status)!=null?tn:"pending")==="pending"}).map(Ue=>Ue.id);pe.length>0&&r({type:"SET_ANNOTATION_THREAD",payload:{ids:pe,threadId:ce}})}return r({type:"MARK_CAPTURED"}),ce&&se(ce),!0}catch(V){return console.error("[Pare] Failed to send plan:",V),!1}},[s,l,C.id,n.annotations,n.styleModifications,n.inspectedElement,r]),$t=Pe(async v=>{let J=K==null?void 0:K.planId;if(!J)return;let V=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),wt=V!=null&&V[1]?parseFloat(V[1]):29,ct=v.length>1?360/v.length:0;for(let Tt=0;Tt<v.length;Tt++){let gt=v[Tt],Bt=(wt+Tt*ct)%360,Gt=`oklch(0.628 0.258 ${Math.round(Bt)})`,Qt=gt.region.y+gt.region.height/2,ce=window.innerHeight;(Qt<window.scrollY||Qt>window.scrollY+ce)&&(window.scrollTo({top:Math.max(0,Qt-ce/2),behavior:"instant"}),await new Promise(Bn=>requestAnimationFrame(()=>requestAnimationFrame(()=>Bn()))));let pe=Wr(gt.region),Ue=Math.random().toString(36).substring(2,9),tn=pe?{x:pe.rect.left+window.scrollX,y:pe.rect.top+window.scrollY,width:pe.rect.width,height:pe.rect.height}:gt.region;r({type:"ADD_PLAN_ANNOTATION",payload:{groupId:Ue,planId:J,planTaskId:gt.id,instruction:gt.instruction,region:tn,color:Gt,linkedSelector:pe==null?void 0:pe.selector,elements:pe?[pe.info]:void 0}}),Tt<v.length-1&&await new Promise(Bn=>setTimeout(Bn,200))}},[K==null?void 0:K.planId,n.activeColor,r]),Sn=Pe((v,J)=>{let V=a.current.get(v)||[];a.current.set(v,[...V,...J])},[]),Ie=Pe(async()=>{let v=document.getElementById("devtools-canvas");if(!v)return!1;let J=n.annotations.filter(Gt=>{var Qt;return((Qt=Gt.status)!=null?Qt:"pending")==="pending"}),V=n.spacingTokenChanges.filter(Gt=>!Gt.captured);if(J.length===0&&n.styleModifications.filter(Gt=>!Gt.captured).length===0&&V.length===0)return!1;let wt=await ni(document.body,v,n.annotations);if(wt.length===0)return!1;let ct=await br(wt);if(!ct)return!1;let Tt=yr(J,n.styleModifications,void 0,V.length>0?V:void 0),gt=JSON.stringify(Tt),Bt=new Map;for(let Gt of J){let Qt=a.current.get(Gt.id);if(Qt&&Qt.length>0&&Bt.set(Gt.id,Qt),Gt.groupId){for(let ce of J)if(ce.groupId===Gt.groupId&&ce.id!==Gt.id){let pe=a.current.get(ce.id);pe&&pe.length>0&&Bt.set(ce.id,pe)}}}try{let Gt=ei(n.activeColor),{jobId:Qt,threadId:ce}=await Bs(ct,gt,s,Gt,l,C.id,Bt.size>0?Bt:void 0,xo());for(let Me of Bt.keys())a.current.delete(Me);let pe=J.map(Me=>Me.id),Ue=n.styleModifications.filter(Me=>!Me.captured).map(Me=>Me.selector);nt(Me=>b(h({},Me),{[Qt]:{annotationIds:pe,styleSelectors:Ue,color:n.activeColor,threadId:ce}})),r({type:"MARK_CAPTURED"}),ce&&pe.length>0&&r({type:"SET_ANNOTATION_THREAD",payload:{ids:pe,threadId:ce}});let tn=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),po=((tn!=null&&tn[1]?parseFloat(tn[1]):29)+60)%360;return r({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${po})`}),!0}catch(Gt){return console.error("[Pare] Failed to send to bridge:",Gt),!1}},[n.annotations,n.styleModifications,n.spacingTokenChanges,n.activeColor,r,s,l,C.id]),Ae=Pe(async(v,J,V)=>{try{let wt=ei(n.activeColor),{jobId:ct}=await Ws(v,J,s,wt,l,C.id,V,xo());nt(gt=>b(h({},gt),{[ct]:{annotationIds:[],styleSelectors:[],color:n.activeColor,threadId:v}}));let Tt=n.annotations.filter(gt=>gt.threadId===v&&(gt.status==="waiting_input"||gt.status==="resolved"||gt.status==="needs_review"));Tt.length>0&&(r({type:"SET_ANNOTATION_STATUS",payload:{ids:Tt.map(gt=>gt.id),status:"in_flight"}}),nt(gt=>{let Bt=gt[ct];return Bt?b(h({},gt),{[ct]:b(h({},Bt),{annotationIds:[...Bt.annotationIds,...Tt.map(Gt=>Gt.id)]})}):gt})),i.dismissQuestion(v)}catch(wt){console.error("[Pare] Failed to send reply:",wt)}},[n.activeColor,n.annotations,s,i.dismissQuestion,r,l,C.id]),qe=Pe(async()=>{if(!(!K||!K.planId))try{await Ds(K.planId,s),Lt(gt=>gt?b(h({},gt),{status:"executing"}):null);let v=await xr(document.body);if(!v)return;let J=n.annotations.filter(gt=>{var Bt;return gt.planId===K.planId&>.type!=="text"&&((Bt=gt.status)!=null?Bt:"pending")==="pending"}),V=J.map(gt=>{var Bn,po,Me;let Bt=gt.groupId?n.annotations.find(kn=>kn.groupId===gt.groupId&&kn.type==="text"):void 0,Gt=(Bn=gt.points[0])!=null?Bn:{x:0,y:0},Qt=(po=gt.points[1])!=null?po:Gt,ce=Math.min(Gt.x,Qt.x),pe=Math.min(Gt.y,Qt.y),Ue=Math.abs(Qt.x-Gt.x)||100,tn=Math.abs(Qt.y-Gt.y)||100;return{planTaskId:gt.planTaskId||gt.id,annotationId:gt.id,instruction:(Bt==null?void 0:Bt.text)||gt.text||"No instruction",region:{x:ce,y:pe,width:Ue,height:tn},linkedSelector:gt.linkedSelector,elements:(Me=gt.elements)==null?void 0:Me.map(kn=>({selector:kn.selector,reactComponent:kn.reactComponent}))}});if(V.length===0)return;let{jobId:wt}=await Fs(v,K.planId,V,s,l,C.id,xo()),ct=[],Tt=new Set;for(let gt of J)if(Tt.has(gt.id)||(Tt.add(gt.id),ct.push(gt.id)),gt.groupId)for(let Bt of n.annotations)Bt.groupId===gt.groupId&&!Tt.has(Bt.id)&&(Tt.add(Bt.id),ct.push(Bt.id));nt(gt=>b(h({},gt),{[wt]:{annotationIds:ct,styleSelectors:[],color:n.activeColor,threadId:K.threadId,planId:K.planId}})),r({type:"SET_ANNOTATION_STATUS",payload:{ids:ct,status:"in_flight"}}),r({type:"MARK_CAPTURED"})}catch(v){console.error("[Pare] Failed to approve plan:",v)}},[K,n.annotations,n.activeColor,s,l,C.id,r]),rn=Pe(()=>{if(Lt(null),K!=null&&K.planId){let v=n.annotations.filter(J=>J.planId===K.planId);for(let J of v)r({type:"DELETE_ANNOTATION",payload:{id:J.id}})}},[K,n.annotations,r]),sn=on(new Set);Re(()=>{for(let v of i.pendingQuestions){if(sn.current.has(v.jobId))continue;sn.current.add(v.jobId);let J=v.annotationIds&&v.annotationIds.length>0?v.annotationIds:void 0;!J&&v.threadId&&(J=n.annotations.filter(V=>V.threadId===v.threadId).map(V=>V.id)),J&&J.length>0&&r({type:"SET_ANNOTATION_QUESTION",payload:{ids:J,question:v.question,threadId:v.threadId}})}},[i.pendingQuestions,r,n.annotations]);let an=on(new Set),He=on(null);Re(()=>{for(let v of i.pendingPlans){if(an.current.has(v.planId))continue;an.current.add(v.planId);let J=v.tasks.length===1;Lt(V=>(V==null?void 0:V.planId)!==v.planId?V:b(h({},V),{tasks:v.tasks,threadId:v.threadId,status:J?"executing":"awaiting_approval"})),$t(v.tasks).then(()=>{J&&(He.current=v.planId)}),i.dismissPlan(v.planId)}},[i.pendingPlans]),Re(()=>{!He.current||!K||K.planId!==He.current||n.annotations.filter(J=>J.planId===K.planId&&J.type!=="text").length===0||(He.current=null,qe())},[K,n.annotations,qe]),Re(()=>{for(let v of i.planReviews)!K||K.planId!==v.planId||v.verdict==="pass"&&Lt(J=>J?b(h({},J),{status:"done"}):null)},[i.planReviews,K]);let j=on(new Set);Re(()=>{!K||K.status!=="executing"||j.current.has(K.planId)||Object.entries(E).filter(([V,wt])=>wt.planId===K.planId).length>0||n.annotations.filter(V=>V.planId===K.planId&&(V.status==="resolved"||V.status==="needs_review")).length===0||(j.current.add(K.planId),(async()=>{try{Lt(wt=>wt?b(h({},wt),{status:"reviewing"}):null);let V=await xr(document.body);if(!V)return;await Ns(K.planId,V,s,l,C.id,xo())}catch(V){console.error("[Pare] Failed to trigger review:",V)}})())},[K,E,n.annotations,s,l,C.id]);let Ht=_o(()=>{if(i.activeJobId&&i.activeJobId in E)return E[i.activeJobId].color;let v=Object.values(E);return v.length>0?v[v.length-1].color:void 0},[i.activeJobId,E]),Wt=Pe(v=>{se(v)},[]),gn=Pe(async v=>{try{let J=v?`${s}/cancel?jobId=${v}`:`${s}/cancel`;await fetch(J,{method:"POST"})}catch(J){}},[s]);Re(()=>{n.activeTool==="model"&&mt&&se(null)},[n.activeTool]);let he=on(null);Re(()=>{n.isAnnotating?he.current&&(se(he.current),he.current=null):mt&&(he.current=mt,se(null))},[n.isAnnotating]);let fe=_o(()=>{if(!mt)return null;for(let[v,J]of Object.entries(E))if(J.threadId===mt)return v;return null},[mt,E]),[ge,xe]=Xe(!1),[mn,ln]=Xe(0),Qe=on(null),ie=Pe(v=>{v?(Qe.current&&(clearTimeout(Qe.current),Qe.current=null),xe(!0)):Qe.current=setTimeout(()=>{xe(!1),Qe.current=null},150)},[]),X=Pe(()=>{ln(v=>v+1),i.clearEvents(),se(null),yt(new Set)},[i.clearEvents]);Re(()=>()=>{Qe.current&&clearTimeout(Qe.current)},[]);let ot=_o(()=>({isEnabled:e}),[e]);return e?Up(Cl.Provider,{value:ot,children:[t,er(rl,{state:n,dispatch:r,onScreenshot:re,inFlightAnnotationIds:At,inFlightStyleSelectors:bt,inFlightSelectorColors:Ct,onAttachImages:Sn,onReply:i.isConnected?Ae:void 0,onViewThread:i.isConnected?Wt:void 0,onCloseThread:v=>{se(null),v&&yt(J=>new Set(J).add(v))},activePlan:K,onModelComponentsAdd:i.isConnected?Et:void 0,onModelComponentFocus:i.isConnected?Dt:void 0,onModelComponentHover:U,modelComponentNames:L,modelPanelHoveredComponent:tt,modelSpacingTokenHover:at}),er(hl,{state:n,dispatch:r,onScreenshot:re,onSendToClaude:i.isConnected?Ie:void 0,onPlanGoal:i.isConnected?Fe:void 0,hasActiveJobs:Object.keys(E).length>0||i.activeJobIds.length>0,activeJobColor:Ht,onCrosshairHover:ie,onClear:X,provider:l,onProviderChange:i.isConnected&&u.length>1?M:void 0,availableProviders:u,modelIndex:d,modelCount:P.length,modelLabel:C.label,onModelChange:i.isConnected?T:void 0,onViewThread:i.isConnected?Wt:void 0,isThreadPanelOpen:mt!==null,activePlan:K,mcpStatus:f,onInstallMcp:i.isConnected?H:void 0,mcpJustInstalled:x,bridgeUrl:s,isBridgeConnected:i.isConnected,modelSelectedComponent:q,modelCanvasHoveredComponent:B,onModelComponentHover:kt,onSpacingTokenHover:Nt,onModifySpacingToken:i.isConnected?_t:void 0,onDeleteSpacingToken:i.isConnected?St:void 0,modelRefreshKey:Vt,onModelComponentAdded:Ft,onModelComponentRemoved:G}),mt&&i.isConnected&&er(El,{threadId:mt,bridgeUrl:s,accentColor:(pt=(Pt=n.annotations.find(v=>v.threadId===mt))==null?void 0:Pt.color)!=null?pt:n.activeColor,isStreaming:fe!==null,streamingEvents:fe?i.events.filter(v=>v.data.jobId===fe):[],onClose:()=>se(null),onReply:Ae,onCancel:fe?()=>gn(fe):void 0,lastError:(cn=(Ye=i.lastErrorByJob)==null?void 0:Ye[fe!=null?fe:""])!=null?cn:void 0,activePlan:K,planAnnotations:K?n.annotations.filter(v=>v.planId===K.planId&&v.type!=="text"):void 0,inFlightJobs:E,onViewThread:Wt,onApprovePlan:(K==null?void 0:K.status)==="awaiting_approval"?qe:void 0,onDismissPlan:(K==null?void 0:K.status)==="awaiting_approval"?rn:void 0}),er(xl,{bridge:i,bridgeUrl:s,inFlightJobs:E,isVisible:ge||i.lastResponseText!==null||i.activeJobIds.length>0,onHover:ie,clearSignal:mn,onReply:Ae,onViewThread:Wt,onCancel:gn,isConnected:i.isConnected,dismissedThreadIds:Q})]}):er(Xp,{children:t})}function Vp(){let t=jp(Cl);if(!t)throw new Error("usePopmelt must be used within PopmeltProvider");return t}export{Jp as PopmeltProvider,Vp as usePopmelt};
|