@popmelt.com/core 0.5.11 → 0.5.12

package/dist/index.mjs

@@ -1,21 +1,21 @@
 "use client";
-var ba=Object.defineProperty,xa=Object.defineProperties;var va=Object.getOwnPropertyDescriptors;var Xo=Object.getOwnPropertySymbols;var fs=Object.prototype.hasOwnProperty,gs=Object.prototype.propertyIsEnumerable;var ps=(e,t,o)=>t in e?ba(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,f=(e,t)=>{for(var o in t||(t={}))fs.call(t,o)&&ps(e,o,t[o]);if(Xo)for(var o of Xo(t))gs.call(t,o)&&ps(e,o,t[o]);return e},m=(e,t)=>xa(e,va(t));var Ko=e=>typeof e=="symbol"?e:e+"",Bn=(e,t)=>{var o={};for(var n in e)fs.call(e,n)&&t.indexOf(n)<0&&(o[n]=e[n]);if(e!=null&&Xo)for(var n of Xo(e))t.indexOf(n)<0&&gs.call(e,n)&&(o[n]=e[n]);return o};import{createContext as mp,useCallback as Ot,useContext as hp,useEffect as Ht,useMemo as Io,useRef as ln,useState as $t}from"react";import{useCallback as Es,useEffect as Sa,useSyncExternalStore as wa}from"react";var Sn="http://localhost:1111";function vn(e,t={},o=15e3){let n=new AbortController;t.signal&&t.signal.addEventListener("abort",()=>n.abort());let r=setTimeout(()=>n.abort(),o);return fetch(e,m(f({},t),{signal:n.signal})).finally(()=>clearTimeout(r))}async function hs(e=Sn){try{let t=await vn(`${e}/capabilities`,{},5e3);return t.ok?await t.json():null}catch(t){return null}}async function Zo(e=Sn){try{let t=new AbortController,o=setTimeout(()=>t.abort(),2e3),n=await fetch(`${e}/status`,{signal:t.signal});return clearTimeout(o),n.ok?await n.json():null}catch(t){return null}}async function ms(e){try{let t=new AbortController,o=setTimeout(()=>t.abort(),500),n=await fetch(`http://localhost:${e}/status`,{signal:t.signal});return clearTimeout(o),n.ok?await n.json():null}catch(t){return null}}async function ys(e){if(e&&e!=="http://localhost:1111")try{let c=new URL(e);return{url:e,port:parseInt(c.port,10)||1111}}catch(c){return null}let r=typeof window!="undefined"?window.location.origin:null,i=await ms(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 ms(p).then(u=>u?{status:u,port:p}:null)}),l=(await Promise.all(s)).filter(c=>c!==null),a=[];i&&a.push({port:1111,devOrigin:i.devOrigin});for(let c of l)a.push({port:c.port,devOrigin:c.status.devOrigin});if(r){let c=a.find(d=>d.devOrigin===r);if(c)return{url:`http://localhost:${c.port}`,port:c.port}}return a.length===1?{url:`http://localhost:${a[0].port}`,port:a[0].port}:i?{url:"http://localhost:1111",port:1111}:a.length>0?{url:`http://localhost:${a[0].port}`,port:a[0].port}:null}async function bs(e,t,o=Sn,n,r,i,s,l){let a=new FormData;if(a.append("screenshot",e,"screenshot.png"),a.append("feedback",t),n&&a.append("color",n),r&&a.append("provider",r),i&&a.append("model",i),l&&a.append("sourceId",l),s)for(let[d,p]of s)for(let u=0;u<p.length;u++)a.append(`image-${d}-${u}`,p[u],`image-${d}-${u}.png`);let c=await vn(`${o}/send`,{method:"POST",body:a},3e4);if(!c.ok){let d=await c.text();throw new Error(`Bridge returned ${c.status}: ${d}`)}return c.json()}async function xs(e=Sn,t){try{let o=await vn(`${e}/mcp/install`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(t?{serverUrl:t}:{})},15e3);return o.ok?await o.json():null}catch(o){return null}}async function vs(e,t=Sn){let o=await vn(`${t}/model/component`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function Ss(e,t=Sn){let o=await vn(`${t}/model/component`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function Ir(e,t,o=Sn){let n=await vn(`${o}/model/token`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e,value:t})},1e4);if(!n.ok){let r=await n.text();throw new Error(`Bridge returned ${n.status}: ${r}`)}return n.json()}async function ws(e,t=Sn){let o=await vn(`${t}/model/token`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e})},1e4);if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function no(e=Sn){var t;try{let o=await vn(`${e}/model`,{},5e3);return o.ok&&(t=(await o.json()).model)!=null?t:null}catch(o){return null}}async function ks(e,t,o=Sn,n,r,i,s,l){let a;if(s&&s.length>0){let c=new FormData,d=new Blob([new Uint8Array([137,80,78,71,13,10,26,10,0,0,0,13,73,72,68,82,0,0,0,1,0,0,0,1,8,6,0,0,0,31,21,196,137,0,0,0,10,73,68,65,84,120,156,98,0,0,0,2,0,1,229,39,222,252,0,0,0,0,73,69,78,68,174,66,96,130])],{type:"image/png"});c.append("screenshot",d,"screenshot.png"),c.append("feedback",JSON.stringify({threadId:e,reply:t,color:n,provider:r,model:i,sourceId:l}));for(let p=0;p<s.length;p++)c.append(`image-reply-${p}`,s[p],`reply-image-${p}.png`);a=await vn(`${o}/reply`,{method:"POST",body:c},3e4)}else a=await vn(`${o}/reply`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({threadId:e,reply:t,color:n,provider:r,model:i,sourceId:l})},3e4);if(!a.ok){let c=await a.text();throw new Error(`Bridge returned ${a.status}: ${c}`)}return a.json()}var Is=typeof crypto!="undefined"&&typeof crypto.randomUUID=="function"?crypto.randomUUID():Math.random().toString(36).slice(2);function Rr(){return Is}var ka={isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,lastErrorByJob:{},pendingQuestions:[],incrementalResolutions:[],capabilitiesVersion:0},qo=f({},ka),Lr=new Set,oo=null,Cs=null,_n=null,Ms=0,io=null,ro=null;async function Ea(e){return e&&e!=="http://localhost:1111"?(io=e,e):io||ro||(ro=ys(e).then(o=>{var n;return io=(n=o==null?void 0:o.url)!=null?n:null,ro=null,io}).catch(()=>(ro=null,null)),ro)}function Ls(){return io}function Ts(){return qo}function Ca(e){return Lr.add(e),()=>{Lr.delete(e)}}function Qt(e){qo=e(qo);for(let t of Lr)t()}function Rs(e){if(oo&&oo.readyState!==EventSource.CLOSED&&Cs===e)return;oo&&(oo.close(),oo=null),_n&&(clearTimeout(_n),_n=null),Cs=e;let t=++Ms,o=new EventSource(`${e}/events?sourceId=${Is}`);oo=o;let n=()=>t!==Ms;o.addEventListener("connected",()=>{n()||Zo(e).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)),l=(p=r==null?void 0:r.recentJobs)!=null?p:[],a=new Map(l.map(u=>[u.id,u])),c=i.length>0;Qt(u=>{let g=f({},u.lastErrorByJob),x=u.activeJobIds.filter(h=>!s.has(h));for(let h of x){let w=a.get(h);(w==null?void 0:w.status)==="error"&&w.error&&(g[h]=w.error)}let E=u.activeJobIds.filter(h=>s.has(h));for(let h of s)E.includes(h)||E.push(h);return m(f({},u),{isConnected:!0,status:c?"streaming":x.length>0||u.status==="disconnected"?"idle":u.status,activeJobId:c?i[i.length-1].id:E.length>0?E[E.length-1]:null,activeJobIds:E,lastErrorByJob:g,lastCompletedJobId:x.length>0?x[x.length-1]:u.lastCompletedJobId})})})}),o.addEventListener("job_started",r=>{if(n())return;let i=JSON.parse(r.data),s=i.jobId;Qt(l=>m(f({},l),{status:"streaming",activeJobId:s,activeJobIds:[...l.activeJobIds,s],jobResponses:m(f({},l.jobResponses),{[s]:""}),jobThinking:m(f({},l.jobThinking),{[s]:""}),currentResponse:"",currentThinking:"",lastResponseText:null,lastThreadId:null,events:[...l.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,l=i.text||"";Qt(a=>m(f({},a),{jobResponses:s?m(f({},a.jobResponses),{[s]:(a.jobResponses[s]||"")+l}):a.jobResponses,currentResponse:!s||s===a.activeJobId?a.currentResponse+l:a.currentResponse,events:[...a.events,{type:"delta",data:i,timestamp:Date.now()}]}))}),o.addEventListener("thinking",r=>{if(n())return;let i=JSON.parse(r.data),s=i.jobId,l=i.text||"";Qt(a=>m(f({},a),{jobThinking:s?m(f({},a.jobThinking),{[s]:(a.jobThinking[s]||"")+l}):a.jobThinking,currentThinking:!s||s===a.activeJobId?a.currentThinking+l:a.currentThinking,events:[...a.events,{type:"thinking",data:i,timestamp:Date.now()}]}))}),o.addEventListener("tool_use",r=>{if(n())return;let i=JSON.parse(r.data);Qt(s=>m(f({},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;Qt(l=>{var g;let a=s?l.activeJobIds.filter(x=>x!==s):l.activeJobIds,c=f({},l.jobResponses),d=f({},l.jobThinking),p=s?c[s]:void 0;s&&(delete c[s],delete d[s]);let u=s===l.activeJobId?a.length>0?a[a.length-1]:null:l.activeJobId;return m(f(m(f({},l),{activeJobIds:a,activeJobId:u,jobResponses:c,jobThinking:d,lastCompletedJobId:s!=null?s:l.activeJobId,lastResponseText:p||l.currentResponse||i.responseText||null,lastThreadId:(g=i.threadId)!=null?g:null}),s===l.activeJobId?{currentResponse:u&&c[u]||"",currentThinking:u&&d[u]||""}:{}),{events:[...l.events,{type:"done",data:i,timestamp:Date.now()}]})})}),o.addEventListener("question",r=>{if(n())return;let i=JSON.parse(r.data);Qt(s=>m(f({},s),{pendingQuestions:[...s.pendingQuestions,{jobId:i.jobId,threadId:i.threadId,question:i.question,annotationIds:i.annotationIds,timestamp:Date.now()}],events:[...s.events,{type:"question",data:i,timestamp:Date.now()}]}))}),o.addEventListener("capabilities_changed",()=>{n()||Qt(r=>m(f({},r),{capabilitiesVersion:r.capabilitiesVersion+1}))}),o.addEventListener("queue_drained",()=>{n()||Qt(r=>m(f({},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)Qt(l=>m(f({},l),{isConnected:!1,status:"disconnected"})),_n&&(clearTimeout(_n),_n=null),_n=setTimeout(()=>{Zo(e).then(l=>{l&&Rs(e)})},5e3);else if(r instanceof MessageEvent){let l=JSON.parse(r.data),a=(i=l.jobId)!=null?i:null,c=(s=l.message)!=null?s:"";Qt(d=>{let p=a?d.activeJobIds.filter(g=>g!==a):d.activeJobIds,u=p.length>0?d.status:"error";return m(f({},d),{status:u,activeJobIds:p,lastCompletedJobId:a!=null?a:d.activeJobId,lastErrorByJob:a&&c?m(f({},d.lastErrorByJob),{[a]:c}):d.lastErrorByJob,events:[...d.events,{type:"error",data:l,timestamp:Date.now()}]})})}}}),o.onerror=()=>{n()||o.readyState===EventSource.CLOSED&&Qt(r=>m(f({},r),{isConnected:!1,status:"disconnected"}))}}function As(e="http://localhost:1111"){let t=wa(Ca,Ts,Ts);Sa(()=>{Ea(e).then(r=>{r&&Zo(r).then(i=>{i&&Rs(r)})})},[e]);let o=Es(()=>{Qt(()=>m(f({},qo),{events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,lastErrorByJob:{},incrementalResolutions:[]}))},[]),n=Es(r=>{Qt(i=>m(f({},i),{pendingQuestions:i.pendingQuestions.filter(s=>s.threadId!==r)}))},[]);return m(f({},t),{clearEvents:o,dismissQuestion:n})}import{useEffect as Ma,useReducer as Ta}from"react";var Ia={isAnnotating:!1,activeTool:"inspector",activeColor:"#ff0000",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function Qo(){return Math.random().toString(36).substring(2,9)}function Ps(e){return e.status?e:e.captured?m(f({},e),{status:"in_flight"}):m(f({},e),{status:"pending"})}function Ut(e){return m(f({},e),{undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}],redoStack:[]})}function La(e,t){return m(f({},e),{isAnnotating:t})}function Ra(e,t){return m(f({},e),{activeTool:t,inspectedElement:null})}function Aa(e,t){return m(f({},e),{activeColor:t})}function Pa(e,t){return m(f({},e),{strokeWidth:t})}function Ba(e,t){return m(f({},e),{currentPath:[t]})}function Oa(e,t){return m(f({},e),{currentPath:[...e.currentPath,t]})}function Da(e){return m(f({},e),{currentPath:[]})}function Fa(e,t){if(e.currentPath.length<2&&e.activeTool!=="text")return m(f({},e),{currentPath:[]});let o={id:Qo(),type:e.activeTool,points:e.currentPath,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",groupId:t==null?void 0:t.groupId,elements:t==null?void 0:t.elements},n=Ut(e);return m(f({},n),{annotations:[...e.annotations,o],currentPath:[]})}function Na(e,t){var r;let o=f({id:(r=t.id)!=null?r:Qo(),type:"text",points:[t.point],text:t.text,fontSize:t.fontSize||12,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",groupId:t.groupId,linkedSelector:t.linkedSelector,linkedAnchor:t.linkedAnchor,elements:t.elements},t.imageCount?{imageCount:t.imageCount}:{}),n=t.groupId?e:Ut(e);return m(f({},n),{annotations:[...e.annotations,o]})}function Ha(e,t){let o=Ut(e);return m(f({},o),{annotations:e.annotations.map(n=>n.id===t.id?f(m(f({},n),{text:t.text}),t.imageCount!=null?{imageCount:t.imageCount}:{}):n)})}function za(e,t){return m(f({},e),{annotations:e.annotations.map(o=>o.id===t.id?m(f({},o),{fontSize:Math.max(12,Math.min(72,t.fontSize))}):o)})}function _a(e,t){let o=Ut(e),n=e.annotations.find(i=>i.id===t.id),r=n==null?void 0:n.groupId;return m(f({},o),{annotations:e.annotations.filter(i=>i.id!==t.id&&!(r&&i.groupId===r))})}function $a(e,t){let o=t.saveUndo?Ut(e):e,n=e.annotations.find(i=>i.id===t.id),r=n==null?void 0:n.groupId;return m(f({},o),{annotations:e.annotations.map(i=>{if(!(i.id===t.id||r&&i.groupId===r))return i;let l=t.delta.x,a=t.delta.y;return m(f({},i),{points:i.points.map(c=>({x:c.x+l,y:c.y+a}))})})})}function Wa(e,t){let o=t.saveUndo?Ut(e):e,n=e.annotations.find(s=>s.id===t.id);if(!n||n.type==="text"||n.points.length<2)return e;let r=0,i=0;if(n.type==="rectangle"&&n.groupId){let s=t.points,l=Math.min(s[0].x,s[1].x),a=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=l-p,i=a-u}return m(f({},o),{annotations:e.annotations.map(s=>s.id===t.id?m(f({},s),{points:t.points}):n.groupId&&s.groupId===n.groupId&&s.type==="text"?m(f({},s),{points:s.points.map(l=>({x:l.x+r,y:l.y+i}))}):s)})}function Ya(e,t){let o=Ut(e);return m(f({},o),{annotations:[...e.annotations,...t.annotations.map(Ps)]})}function ja(e,t){let o=new Set,n=[];for(let r of t.annotations)o.has(r.id)||(o.add(r.id),n.push(Ps(r)));return m(f({},e),{annotations:n})}function Ga(e){if(e.undoStack.length===0)return e;let t=e.undoStack[e.undoStack.length-1];return m(f({},e),{annotations:(t==null?void 0:t.annotations)||[],styleModifications:(t==null?void 0:t.styleModifications)||[],spacingTokenMods:(t==null?void 0:t.spacingTokenMods)||[],undoStack:e.undoStack.slice(0,-1),redoStack:[...e.redoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}]})}function Va(e){if(e.redoStack.length===0)return e;let t=e.redoStack[e.redoStack.length-1];return m(f({},e),{annotations:(t==null?void 0:t.annotations)||[],styleModifications:(t==null?void 0:t.styleModifications)||[],spacingTokenMods:(t==null?void 0:t.spacingTokenMods)||[],redoStack:e.redoStack.slice(0,-1),undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}]})}function Ua(e,t){let{id:o,addToSelection:n}=t;if(o===null)return m(f({},e),{selectedAnnotationIds:[],lastSelectedId:null});if(n)if(e.selectedAnnotationIds.includes(o)){let i=e.selectedAnnotationIds.filter(s=>s!==o);return m(f({},e),{selectedAnnotationIds:i,lastSelectedId:i.length>0?i[i.length-1]:null})}else return m(f({},e),{selectedAnnotationIds:[...e.selectedAnnotationIds,o],lastSelectedId:o});return m(f({},e),{selectedAnnotationIds:[o],lastSelectedId:o})}function Ja(e,t){let o=new Set;for(let n of e.selectedAnnotationIds){let r=e.annotations.find(i=>i.id===n);r!=null&&r.groupId&&o.add(r.groupId)}return m(f({},e),{annotations:e.annotations.map(n=>{let r=e.selectedAnnotationIds.includes(n.id),i=n.groupId&&o.has(n.groupId);return!r&&!i?n:m(f({},n),{color:t.color})})})}function Xa(e){return m(f({},e),{annotations:e.annotations.map(t=>m(f({},t),{captured:!0,status:t.status==="pending"||!t.status?"in_flight":t.status})),styleModifications:e.styleModifications.map(t=>m(f({},t),{captured:!0})),spacingTokenChanges:e.spacingTokenChanges.map(t=>m(f({},t),{captured:!0}))})}function Ka(e){return m(f({},e),{annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]})}function Za(e,t){return m(f({},e),{inspectedElement:t})}function qa(e,t){let{selector:o,element:n,property:r,original:i,modified:s}=t,l=e.styleModifications.findIndex(a=>a.selector===o);if(i===s&&l<0)return e;if(l>=0){let a=e.styleModifications[l];if(a.captured){let g=Ut(e),x=g.styleModifications.map((E,h)=>h===l?m(f({},E),{changes:[{property:r,original:i,modified:s}],captured:!1}):E);return m(f({},g),{styleModifications:x})}let c=a.changes.findIndex(g=>g.property===r),d,p=e;if(c>=0){let g=a.changes[c];s===g.original?d=a.changes.filter((x,E)=>E!==c):d=a.changes.map((x,E)=>E===c?m(f({},x),{modified:s}):x)}else{if(i===s)return e;p=Ut(e),d=[...a.changes,{property:r,original:i,modified:s}]}if(d.length===0)return m(f({},p),{styleModifications:p.styleModifications.filter((g,x)=>x!==l)});let u=p.styleModifications.map((g,x)=>x===l?m(f({},g),{changes:d}):g);return m(f({},p),{styleModifications:u})}else{let a=Ut(e),c={selector:o,element:n,changes:[{property:r,original:i,modified:s}]};return m(f({},a),{styleModifications:[...a.styleModifications,c]})}}function Qa(e,t){let{selector:o,durableSelector:n,element:r,changes:i}=t,s=i.filter(c=>c.original!==c.modified);if(s.length===0)return e;let l=Ut(e),a=l.styleModifications.findIndex(c=>c.selector===o);if(a>=0){let c=l.styleModifications[a],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,x)=>x!==u):d=d.map((g,x)=>x===u?m(f({},g),{modified:p.modified}):g):d.push(p)}return d.length===0?m(f({},l),{styleModifications:l.styleModifications.filter((p,u)=>u!==a)}):m(f({},l),{styleModifications:l.styleModifications.map((p,u)=>u===a?m(f({},p),{changes:d,captured:!1}):p)})}else return m(f({},l),{styleModifications:[...l.styleModifications,{selector:o,durableSelector:n,element:r,changes:s}]})}function ec(e,t){let{selector:o,property:n}=t,r=Ut(e),i=r.styleModifications.map(s=>s.selector!==o?s:m(f({},s),{changes:s.changes.filter(l=>l.property!==n)})).filter(s=>s.changes.length>0);return m(f({},r),{styleModifications:i})}function tc(e){if(e.styleModifications.length===0)return m(f({},e),{inspectedElement:null});let t=Ut(e);return m(f({},t),{styleModifications:[],inspectedElement:null})}function nc(e,t){return m(f({},e),{styleModifications:t})}function oc(e,t){let{updates:o}=t,n=new Map(o.map(r=>[r.id,r]));return m(f({},e),{annotations:e.annotations.map(r=>{let i=n.get(r.id);return i?f(m(f({},r),{points:[i.point,...r.points.slice(1)]}),i.linkedAnchor?{linkedAnchor:i.linkedAnchor}:{}):r})})}function rc(e,t){let o=new Set(t.ids);return m(f({},e),{annotations:e.annotations.map(n=>o.has(n.id)?m(f({},n),{status:t.status}):n)})}function ic(e,t){let o=new Set(t.ids),n=new Set;for(let r of e.annotations)o.has(r.id)&&r.groupId&&n.add(r.groupId);return m(f({},e),{annotations:e.annotations.map(r=>o.has(r.id)||r.groupId&&n.has(r.groupId)?m(f({},r),{threadId:t.threadId}):r)})}function sc(e,t){let o=new Set(t.ids),n=new Set;for(let r of e.annotations)o.has(r.id)&&r.groupId&&n.add(r.groupId);return m(f({},e),{annotations:e.annotations.map(r=>o.has(r.id)||r.groupId&&n.has(r.groupId)?m(f({},r),{status:"waiting_input",question:t.question,threadId:t.threadId}):r)})}function lc(e,t){let o=new Map(t.resolutions.map(r=>[r.annotationId,r])),n=new Map;for(let r of e.annotations){let i=o.get(r.id);i&&r.groupId&&n.set(r.groupId,i)}return m(f({},e),{annotations:e.annotations.map(r=>{var s,l,a;let i=o.get(r.id)||(r.groupId?n.get(r.groupId):void 0);return i?m(f({},r),{status:i.status,resolutionSummary:i.summary,scope:(l=(s=i.finalScope)!=null?s:i.inferredScope)!=null?l:null,replyCount:((a=r.replyCount)!=null?a:0)+1,question:void 0,threadId:r.threadId||t.threadId}):r})})}function ac(e,t){let{linkedSelectors:o,styleSelectors:n}=t,r=new Set(o),i=new Set(n),s=new Set,l=new Set;for(let u of e.annotations)u.linkedSelector&&r.has(u.linkedSelector)&&(s.add(u.id),u.groupId&&l.add(u.groupId));for(let u of e.annotations)u.groupId&&l.has(u.groupId)&&s.add(u.id);let a=e.annotations.filter(u=>!s.has(u.id)),c=e.styleModifications.filter(u=>!i.has(u.selector));if(a.length===e.annotations.length&&c.length===e.styleModifications.length)return e;let d=e.selectedAnnotationIds.filter(u=>!s.has(u)),p=e.inspectedElement&&i.has(e.inspectedElement.info.selector)?null:e.inspectedElement;return m(f({},e),{annotations:a,styleModifications:c,selectedAnnotationIds:d,lastSelectedId:d.length>0?d[d.length-1]:null,inspectedElement:p})}function cc(e,t){let o=e.spacingTokenChanges.findIndex(n=>n.tokenPath===t.tokenPath);return o>=0?m(f({},e),{spacingTokenChanges:e.spacingTokenChanges.map((n,r)=>r===o?t:n)}):m(f({},e),{spacingTokenChanges:[...e.spacingTokenChanges,t]})}function dc(e,t){return m(f({},e),{spacingTokenChanges:t})}function uc(e,t){let o=Ut(e),n=e.spacingTokenMods.findIndex(i=>i.tokenPath===t.tokenPath),r;if(n>=0){let i=e.spacingTokenMods[n],s=m(f({},t),{originalValue:i.originalValue,originalPx:i.originalPx});r=e.spacingTokenMods.map((l,a)=>a===n?s:l)}else r=[...e.spacingTokenMods,t];return m(f({},o),{spacingTokenMods:r})}function pc(e,t){let o=Ut(e),n=e.spacingTokenMods.findIndex(a=>a.tokenPath===t.tokenPath),r=n>=0?e.spacingTokenMods[n].originalValue:t.originalValue,i=n>=0?e.spacingTokenMods[n].originalPx:parseFloat(t.originalValue)||0,s={tokenPath:t.tokenPath,originalValue:r,currentValue:"__deleted__",targets:n>=0?e.spacingTokenMods[n].targets:[],originalPx:i,currentPx:0},l;return n>=0?l=e.spacingTokenMods.map((a,c)=>c===n?s:a):l=[...e.spacingTokenMods,s],m(f({},o),{spacingTokenMods:l})}var fc={SET_ANNOTATING:La,SET_TOOL:Ra,SET_COLOR:Aa,SET_STROKE_WIDTH:Pa,START_PATH:Ba,CONTINUE_PATH:Oa,CANCEL_PATH:Da,FINISH_PATH:Fa,ADD_TEXT:Na,UPDATE_TEXT:Ha,UPDATE_TEXT_SIZE:za,DELETE_ANNOTATION:_a,MOVE_ANNOTATION:$a,RESIZE_ANNOTATION:Wa,PASTE_ANNOTATIONS:Ya,RESTORE_ANNOTATIONS:ja,UNDO:Ga,REDO:Va,SELECT_ANNOTATION:Ua,UPDATE_ANNOTATION_COLOR:Ja,MARK_CAPTURED:Xa,CLEAR:Ka,SELECT_ELEMENT:Za,MODIFY_STYLE:qa,MODIFY_STYLES_BATCH:Qa,CLEAR_STYLE:ec,CLEAR_ALL_STYLES:tc,RESTORE_STYLE_MODIFICATIONS:nc,UPDATE_LINKED_POSITIONS:oc,CLEANUP_ORPHANED:ac,SET_ANNOTATION_STATUS:rc,SET_ANNOTATION_THREAD:ic,SET_ANNOTATION_QUESTION:sc,APPLY_RESOLUTIONS:lc,ADD_SPACING_TOKEN_CHANGE:cc,RESTORE_SPACING_TOKEN_CHANGES:dc,MODIFY_SPACING_TOKEN:uc,DELETE_SPACING_TOKEN:pc};function gc(e,t){let o=fc[t.type];return o?o(e,t.payload):e}function Bs(){let[e,t]=Ta(gc,Ia);return Ma(()=>{let o=n=>{(n.metaKey||n.ctrlKey)&&n.key==="z"&&(n.preventDefault(),n.shiftKey?t({type:"REDO"}):t({type:"UNDO"}))};return window.addEventListener("keydown",o),()=>window.removeEventListener("keydown",o)},[]),[e,t]}import{domToCanvas as mc}from"modern-screenshot";function Ar(e){let t=document.createElement("canvas").getContext("2d");return t?(t.fillStyle=e,t.fillStyle):"#888888"}function Pr(e,t=[],o,n){let r=new Map,i=[];for(let l of e)if(l.groupId){let a=r.get(l.groupId)||[];a.push(l),r.set(l.groupId,a)}else i.push(l);let s=[];for(let[l,a]of r){let c=a.find(p=>p.type!=="text"),d=a.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(f(m(f({id:c.id,type:c.type,instruction:d==null?void 0:d.text},p?{linkedSelector:p}:{}),{elements:c.elements||[]}),u?{imageCount:u}:{}))}}for(let l of i)s.push(f(m(f({id:l.id,type:l.type,instruction:l.type==="text"?l.text:void 0},l.linkedSelector?{linkedSelector:l.linkedSelector}:{}),{elements:l.elements||[]}),l.imageCount?{imageCount:l.imageCount}:{}));return f(f({timestamp:new Date().toISOString(),url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},scrollPosition:{x:window.scrollX,y:window.scrollY},annotations:s,styleModifications:t},o?{inspectedElement:o}:{}),n&&n.length>0?{spacingTokenChanges:n}:{})}function hc(e){if(!e.points||e.points.length===0)return null;let t=e.points.map(n=>n.x),o=e.points.map(n=>n.y);return{minX:Math.min(...t),minY:Math.min(...o),maxX:Math.max(...t),maxY:Math.max(...o)}}function yc(e,t){if(e.length===0)return[];let o=e.map(d=>({annotation:d,bounds:hc(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<=t){let d=(n+r)/2,p=Math.max(0,d-t/2);return[{top:p,bottom:p+t,annotations:e}]}let i=[],s=50,l=Math.max(0,n-s),a=[],c=l;for(let{annotation:d,bounds:p}of o){let u=p.maxY+s;if(u-l<=t)a.push(d),c=Math.max(c,u);else{if(a.length>0){let g=(l+c)/2,x=Math.max(0,g-t/2);i.push({top:x,bottom:x+t,annotations:a})}l=Math.max(0,p.minY-s),a=[d],c=p.maxY+s}}if(a.length>0){let d=(l+c)/2,p=Math.max(0,d-t/2);i.push({top:p,bottom:p+t,annotations:a})}return i}function bc(e,t,o,n){e.save(),e.scale(n,n);for(let r of t){let i=r.points.map(s=>({x:s.x,y:s.y-o}));switch(e.strokeStyle=r.color,e.fillStyle=r.color,e.lineWidth=r.strokeWidth,e.lineCap="round",e.lineJoin="round",r.type){case"freehand":if(i.length<2)break;e.beginPath(),e.moveTo(i[0].x,i[0].y);for(let s=1;s<i.length;s++)e.lineTo(i[s].x,i[s].y);e.stroke();break;case"line":if(i.length<2)break;e.beginPath(),e.moveTo(i[0].x,i[0].y),e.lineTo(i[i.length-1].x,i[i.length-1].y),e.stroke();break;case"rectangle":{if(i.length<2)break;let s=i[0],l=i[i.length-1],a=Math.min(s.x,l.x),c=Math.min(s.y,l.y),d=Math.abs(l.x-s.x),p=Math.abs(l.y-s.y);e.strokeRect(a,c,d,p);break}case"circle":{if(i.length<2)break;let s=i[0],l=i[i.length-1],a=(s.x+l.x)/2,c=(s.y+l.y)/2,d=Math.abs(l.x-s.x)/2,p=Math.abs(l.y-s.y)/2;e.beginPath(),e.ellipse(a,c,d,p,0,0,Math.PI*2),e.stroke();break}case"text":{if(!r.text||i.length<1)break;let s=i[0],l=r.fontSize||16;e.font=`${l}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`,e.fillStyle=r.color;let c=(r.imageCount&&r.imageCount>0?`[${r.imageCount} image${r.imageCount>1?"s":""}] ${r.text}`:r.text).split(`
-`),d=l*1.2,p=4,u=0;for(let g of c)u=Math.max(u,e.measureText(g).width);e.fillRect(s.x-p,s.y-p,u+p*2,c.length*d+p*2),e.fillStyle="#ffffff",c.forEach((g,x)=>{e.fillText(g,s.x,s.y+l+x*d)});break}}}e.restore()}async function Br(e,t,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 l=yc(s,i);if(l.length===0){let c=await Os(e,[],window.scrollY,r,i,n);return c?[c]:[]}let a=[];for(let c=0;c<l.length;c++){let d=l[c],p=await Os(e,d.annotations,d.top,r,i,n);p?a.push(p):console.warn(`[Screenshot] Region ${c+1} failed to capture`)}return console.log("[Screenshot] Capture complete"),a}catch(n){return console.error("[Screenshot] Capture failed:",n),[]}}async function Os(e,t,o,n,r,i){try{let s=await mc(e,{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)`}}),l=document.createElement("canvas");l.width=n*i,l.height=r*i;let a=l.getContext("2d");return a?(a.drawImage(s,0,0,n*i,r*i,0,0,n*i,r*i),bc(a,t,o,i),new Promise(c=>{l.toBlob(d=>c(d),"image/png")})):null}catch(s){return console.error("Region capture failed:",s),null}}async function Or(e){if(e.length===0)return null;if(e.length===1)return e[0];let t=await Promise.all(e.map(l=>new Promise((a,c)=>{let d=new Image;d.onload=()=>a(d),d.onerror=c,d.src=URL.createObjectURL(l)}))),o=t[0].width,n=t.reduce((l,a)=>l+a.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 l of t)i.drawImage(l,0,s),s+=l.height,URL.revokeObjectURL(l.src);return new Promise(l=>{r.toBlob(a=>l(a),"image/png")})}async function Ds(e,t,o){try{let n=Array.isArray(e)?e:[e];if(n.length===0)return!1;let r=await Or(n);if(!r)return!1;let i={"image/png":r},s=t&&t.length>0,l=o&&o.length>0;if(s||l){let a=t?t.filter(c=>{var d;return((d=c.status)!=null?d:"pending")==="pending"}):[];if(a.length>0||l){let c=Pr(a,o||[]),d=new Blob([JSON.stringify(c,null,2)],{type:"text/plain"});i["text/plain"]=d}}return await navigator.clipboard.write([new ClipboardItem(i)]),!0}catch(n){return console.warn("Clipboard write failed:",n),!1}}import{useCallback as Pt,useEffect as _t,useMemo as Ci,useRef as kt,useState as st}from"react";import{useCallback as lo,useRef as vc}from"react";function Dr(e,t,o,n){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!r||!i)return;let s=(r.x+i.x)/2,l=(r.y+i.y)/2,a=Math.abs(i.x-r.x)/2,c=Math.abs(i.y-r.y)/2;e.beginPath(),e.strokeStyle=o,e.lineWidth=n,e.ellipse(s,l,a,c,0,0,Math.PI*2),e.stroke()}function Fr(e,t,o,n){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!(!r||!i)){e.beginPath(),e.strokeStyle=o,e.lineWidth=n,e.lineCap="round",e.lineJoin="round",e.moveTo(r.x,r.y);for(let s=1;s<t.length-1;s++){let l=t[s],a=t[s+1];if(!l||!a)continue;let c=(l.x+a.x)/2,d=(l.y+a.y)/2;e.quadraticCurveTo(l.x,l.y,c,d)}e.lineTo(i.x,i.y),e.stroke()}}function Nr(e,t,o,n){if(t.length<2)return;let r=t[0],i=t[t.length-1];!r||!i||(e.beginPath(),e.strokeStyle=o,e.lineWidth=n,e.lineCap="round",e.moveTo(r.x,r.y),e.lineTo(i.x,i.y),e.stroke())}function Hr(e,t,o,n){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!r||!i)return;let s=Math.min(r.x,i.x),l=Math.min(r.y,i.y),a=Math.abs(i.x-r.x),c=Math.abs(i.y-r.y);e.beginPath(),e.strokeStyle=o,e.lineWidth=n,e.lineCap="round",e.lineJoin="round",e.strokeRect(s,l,a,c)}var Dt='"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';function xc(e,t,o){if(!t||e.measureText(t).width<=o)return[t];let n=t.split(/\s+/),r=[],i="";for(let s of n){let l=i?i+" "+s:s;i&&e.measureText(l).width>o?(r.push(i),i=s):i=l}return i&&r.push(i),r.length>0?r:[t]}function so(e){let t=window.innerWidth-e-16;if(t<400)return Math.max(60,t)}function $n(e,t,o){let n=[];for(let r of t)n.push(...xc(e,r,o));return n}function Fs(e,t,o,n,r=12,i,s){if(!o)return;let l=r*1.4,a=o.split(`
-`),c=i!==void 0?[i+". "+(a[0]||""),...a.slice(1)]:a;e.font=`${r}px ${Dt}`,e.textBaseline="middle";let d=s!==void 0?Math.min(400,Math.max(60,window.innerWidth-s-16)):400,p=$n(e,c,d),u=Math.min(d,Math.max(...p.map(w=>e.measureText(w).width))),g=p.length*l,x=c.length*l,E=g-x,h=t.y-E;e.fillStyle=n,e.fillRect(t.x-4,h-4,u+8,g+8),e.fillStyle="#ffffff",p.forEach((w,D)=>{e.fillText(w,t.x,h+D*l+l/2)})}var Ns=11,zr=4,Sc=`600 ${Ns}px system-ui, -apple-system, sans-serif`;function _r(e,t,o){return e.map(n=>({x:n.x-t,y:n.y-o}))}function wc(e,t,o,n,r,i){let s=String(n);e.font=Sc;let a=e.measureText(s).width+zr*2,c=Ns+zr*2,d=t-a/2,p=o+i/2+2;e.fillStyle=r,e.fillRect(d,p,a,c),e.fillStyle="#ffffff",e.textBaseline="middle",e.fillText(s,d+zr,p+c/2)}function kc(e,t){if(e.points.length<2&&e.type!=="text")return null;switch(e.type){case"rectangle":case"freehand":{let o,n;if(e.type==="freehand")o=Math.min(...e.points.map(r=>r.x)),n=Math.max(...e.points.map(r=>r.y));else{let r=e.points[0],i=e.points[e.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=e.points[0],n=e.points[e.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=e.points[0],n=e.points[e.points.length-1],r=o.y>n.y?o:n;return{x:r.x,y:r.y}}default:return null}}function Hs(){let e=vc(null),t=lo(()=>{let l=e.current;if(!l)return;let a=l.getContext("2d");a&&a.clearRect(0,0,l.width,l.height)},[]),o=lo((l,a,c)=>{var x;let d=e.current;if(!d)return;let p=d.getContext("2d");if(!p)return;let g=((x=l.status)!=null?x:l.captured?"in_flight":"pending")==="pending"||c?l.color:"#999999";switch(l.type){case"freehand":Fr(p,l.points,g,l.strokeWidth);break;case"line":Nr(p,l.points,g,l.strokeWidth);break;case"rectangle":Hr(p,l.points,g,l.strokeWidth);break;case"circle":Dr(p,l.points,g,l.strokeWidth);break;case"text":l.text&&l.points[0]&&Fs(p,l.points[0],l.text,g,l.fontSize,a,l.points[0].x);break}},[]),n=lo((l,a,c,d)=>{let p=e.current;if(!p||l.length<2)return;let u=p.getContext("2d");if(u)switch(a){case"freehand":Fr(u,l,c,d);break;case"line":Nr(u,l,c,d);break;case"rectangle":Hr(u,l,c,d);break;case"circle":Dr(u,l,c,d);break}},[]),r=lo((l,a)=>{let c=e.current;if(!c||l.points.length<2)return;let d=c.getContext("2d");if(d){if(d.fillStyle="#ffffff",d.strokeStyle=l.color,d.lineWidth=1.5,l.type==="line"){let p=l.points[0],u=l.points[l.points.length-1];[p,u].forEach(g=>{d.beginPath(),d.arc(g.x,g.y,a/2,0,Math.PI*2),d.fill(),d.stroke()});return}if(l.type==="circle"){let p=l.points[0],u=l.points[l.points.length-1],g=Math.min(p.x,u.x),x=Math.max(p.x,u.x),E=Math.min(p.y,u.y),h=Math.max(p.y,u.y),w=(g+x)/2,D=(E+h)/2;[{x:w,y:E},{x:w,y:h},{x:g,y:D},{x,y:D}].forEach(M=>{d.beginPath(),d.rect(M.x-a/2,M.y-a/2,a,a),d.fill(),d.stroke()});return}if(l.type==="rectangle"||l.type==="freehand"){let p,u,g,x;if(l.type==="freehand")p=Math.min(...l.points.map(h=>h.x)),u=Math.max(...l.points.map(h=>h.x)),g=Math.min(...l.points.map(h=>h.y)),x=Math.max(...l.points.map(h=>h.y));else{let h=l.points[0],w=l.points[l.points.length-1];p=Math.min(h.x,w.x),u=Math.max(h.x,w.x),g=Math.min(h.y,w.y),x=Math.max(h.y,w.y)}[{x:p,y:g},{x:u,y:g},{x:p,y:x},{x:u,y:x}].forEach(h=>{d.beginPath(),d.rect(h.x-a/2,h.y-a/2,a,a),d.fill(),d.stroke()})}}},[]),i=lo((l,a,c,d,p,u,g,x=0,E=0,h,w)=>{var D;if(t(),l.forEach(B=>{var k;let M=m(f({},B),{points:_r(B.points,x,E)}),C=h==null?void 0:h.get(B.id),L=(k=w==null?void 0:w.has(B.id))!=null?k:!1;o(M,C,L)}),a.length>0){let B=_r(a,x,E);n(B,c,d,p)}if(u&&u.length>0&&g){let B=e.current,M=B==null?void 0:B.getContext("2d");for(let C of u){let L=l.find(k=>k.id===C);if(L){let k=m(f({},L),{points:_r(L.points,x,E)});if(r(k,g),M&&L.type!=="text"&&h&&!(L.groupId&&l.some(ee=>ee.groupId===L.groupId&&ee.type==="text"))){let ee=h.get(L.id);if(ee!==void 0){let Z=kc(k,g);if(Z){let K=((D=L.status)!=null?D:L.captured?"in_flight":"pending")==="pending"?L.color:"#999999";wc(M,Z.x,Z.y,ee,K,g)}}}}}}},[t,o,n,r]),s=lo(()=>{let l=e.current;if(!l)return;let a=window.devicePixelRatio||1;l.width=window.innerWidth*a,l.height=window.innerHeight*a;let c=l.getContext("2d");c&&c.scale(a,a)},[]);return{canvasRef:e,clearCanvas:t,drawAnnotation:o,drawCurrentPath:n,redrawAll:i,resizeCanvas:s}}import{useEffect as Ec,useRef as Cc}from"react";function zs(){let e=Cc({shift:!1,cmd:!1});return Ec(()=>{let t=r=>{r.key==="Shift"&&(e.current.shift=!0),(r.key==="Meta"||r.key==="Control")&&(e.current.cmd=!0)},o=r=>{r.key==="Shift"&&(e.current.shift=!1),(r.key==="Meta"||r.key==="Control")&&(e.current.cmd=!1)},n=()=>{e.current={shift:!1,cmd:!1}};return window.addEventListener("keydown",t,!0),window.addEventListener("keyup",o,!0),window.addEventListener("blur",n),()=>{window.removeEventListener("keydown",t,!0),window.removeEventListener("keyup",o,!0),window.removeEventListener("blur",n)}},[]),e}import{useEffect as Mc}from"react";function _s(e,t,o,n,r){Mc(()=>{let i=s=>{if(e){if(e.linkedSelector)return;s.preventDefault(),s.stopPropagation();let a=s.deltaY>0?-2:2;t(c=>c?m(f({},c),{fontSize:Math.max(12,Math.min(72,c.fontSize+a))}):null);return}if(!o)return;s.preventDefault();let l=n.find(a=>a.id===o);if(l&&l.type==="text"&&!l.linkedSelector){let a=l.fontSize||12,c=s.deltaY>0?-2:2;r({type:"UPDATE_TEXT_SIZE",payload:{id:o,fontSize:a+c}})}};return window.addEventListener("wheel",i,{passive:!1}),()=>{window.removeEventListener("wheel",i)}},[o,e,n,r,t])}import{useCallback as el,useEffect as cr,useRef as tl,useState as No}from"react";function er(e){let t=Object.keys(e).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!t)return null;let o=e[t],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(e){let t=Object.keys(e).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!t)return[];let o=e[t],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 tr(e){let t=e,o=new Set;for(;t&&!o.has(t);){if(o.add(t),t.stateNode instanceof Element)return t.stateNode;t.child?t=t.child:t=null}return null}function $s(e){if(e.id)return`#${e.id}`;let t=e.tagName.toLowerCase(),o=Array.from(e.classList).slice(0,3).join(".");return o?`${t}.${o}`:t}function nn(e){if(e.id&&!e.id.startsWith("radix-")&&!e.id.startsWith(":"))return`#${CSS.escape(e.id)}`;let t=[],o=e;for(;o&&o!==document.documentElement;){let n=o.tagName.toLowerCase();if(o.id&&!o.id.startsWith("radix-")&&!o.id.startsWith(":")){t.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(l=>l.tagName===o.tagName);if(s.length>1){let l=s.indexOf(o)+1;n+=`:nth-of-type(${l})`}}t.unshift(n),o=i}return t.join(" > ")}function Wt(e){try{return document.querySelector(e)}catch(t){return null}}function nr(e,t=0){var a;let o=$r(e);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-t)),s=o[i],l=(a=tr(s.fiber))!=null?a:e;return{name:s.name,path:n,depthIndex:i,rootElement:l}}function Ws(e,t){var i,s;let o=$r(e),n=t.toLowerCase(),r=-1;for(let l=o.length-1;l>=0;l--){let a=o[l].name;if(a===t){let c=(i=tr(o[l].fiber))!=null?i:e;return{name:t,path:o.map(d=>d.name),depthIndex:l,rootElement:c}}if(r===-1){let c=a.toLowerCase();(c.length>=4&&n.includes(c)||n.length>=4&&c.includes(n))&&(r=l)}}if(r>=0){let l=(s=tr(o[r].fiber))!=null?s:e;return{name:t,path:o.map(a=>a.name),depthIndex:r,rootElement:l}}return null}function ao(e){let t=co(),o=[],n=new Set,r=t.currentNode;for(;r=t.nextNode();){let i=Ws(r,e);i&&!n.has(i.rootElement)&&(n.add(i.rootElement),o.push(i))}return o}function Wr(e){let t=new Map;if(e.size===0)return t;let o=new Set(e),n=co(),r=new Set,i=n.currentNode;for(;(i=n.nextNode())&&o.size>0;)for(let s of o){let l=Ws(i,s);if(!l||r.has(l.rootElement))continue;r.add(l.rootElement);let a=l.rootElement.getBoundingClientRect();t.set(s,a.top+window.scrollY),o.delete(s);break}for(let s of o)t.set(s,1/0);return t}function co(){return document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT,{acceptNode(e){return e.closest("#devtools-toolbar, #devtools-canvas, #devtools-scrim, [data-popmelt-panel]")?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}})}function Jt(e){let t={selector:$s(e),tagName:e.tagName.toLowerCase()};e.id&&(t.id=e.id),e.classList.length>0&&(t.className=Array.from(e.classList).join(" "));let o=Ys(e);o&&o.length>0&&o.length<200&&(t.textContent=o);let n={};for(let s of e.attributes)s.name.startsWith("data-")&&(n[s.name]=s.value);Object.keys(n).length>0&&(t.dataAttributes=n);let r=er(e);r&&(t.reactComponent=r.name);let i=Tc(e);return i&&(t.context=i),t}function Ys(e){let t="";for(let o of e.childNodes)o.nodeType===Node.TEXT_NODE&&(t+=o.textContent||"");return t.trim()}function Wn(e,t){let o=document.elementsFromPoint(e,t);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 Tc(e){let t=e.parentElement,o=["section","article","nav","aside","header","footer","main"];for(;t&&t!==document.body;){let n=t.tagName.toLowerCase();if(o.includes(n)&&t.id)return`${n}#${t.id}`;if(t.id&&!t.id.startsWith("radix-")&&!t.id.startsWith(":"))return`${n}#${t.id}`;t=t.parentElement}return null}function js(e){let t=new Set,o=[],n=window.scrollX,r=window.scrollY,i=[{x:(e.minX+e.maxX)/2,y:(e.minY+e.maxY)/2},{x:e.minX,y:e.minY},{x:e.maxX,y:e.minY},{x:e.minX,y:e.maxY},{x:e.maxX,y:e.maxY}];for(let s of i){let l=s.x-n,a=s.y-r;if(l<0||a<0||l>window.innerWidth||a>window.innerHeight)continue;let c=Wn(l,a);c&&!t.has(c)&&(t.add(c),o.push(Jt(c)))}return o.slice(0,3)}function Yr(e){if(e.length===0)return[];let t=e.map(n=>n.x),o=e.map(n=>n.y);return js({minX:Math.min(...t),minY:Math.min(...o),maxX:Math.max(...t),maxY:Math.max(...o)})}function Tt(e,t){return e.style.getPropertyValue(t)!==""}function Ic(e,t=30){if(e<=0)return[];let o=[],n=co(),r=.5,i=n.currentNode;for(;(i=n.nextNode())&&o.length<t;){let s=i,l=s.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let a=getComputedStyle(s);!Tt(s,"padding-top")&&Math.abs((parseFloat(a.paddingTop)||0)-e)<r&&o.push({element:s,property:"padding-top"}),!Tt(s,"padding-bottom")&&Math.abs((parseFloat(a.paddingBottom)||0)-e)<r&&o.length<t&&o.push({element:s,property:"padding-bottom"}),!Tt(s,"padding-left")&&Math.abs((parseFloat(a.paddingLeft)||0)-e)<r&&o.length<t&&o.push({element:s,property:"padding-left"}),!Tt(s,"padding-right")&&Math.abs((parseFloat(a.paddingRight)||0)-e)<r&&o.length<t&&o.push({element:s,property:"padding-right"}),!Tt(s,"margin-top")&&Math.abs((parseFloat(a.marginTop)||0)-e)<r&&o.length<t&&o.push({element:s,property:"margin-top"}),!Tt(s,"margin-bottom")&&Math.abs((parseFloat(a.marginBottom)||0)-e)<r&&o.length<t&&o.push({element:s,property:"margin-bottom"}),!Tt(s,"margin-left")&&Math.abs((parseFloat(a.marginLeft)||0)-e)<r&&o.length<t&&o.push({element:s,property:"margin-left"}),!Tt(s,"margin-right")&&Math.abs((parseFloat(a.marginRight)||0)-e)<r&&o.length<t&&o.push({element:s,property:"margin-right"});let c=a.display;if((c.includes("flex")||c.includes("grid"))&&o.length<t){let d=Tt(s,"gap"),p=parseFloat(a.gap)||0,u=parseFloat(a.rowGap)||0,g=parseFloat(a.columnGap)||0;!d&&Math.abs(p-e)<r?o.push({element:s,property:"gap"}):!Tt(s,"row-gap")&&Math.abs(u-e)<r?o.push({element:s,property:"row-gap"}):!Tt(s,"column-gap")&&Math.abs(g-e)<r&&o.push({element:s,property:"column-gap"})}}return o}function jr(e,t=30){if(e<=0)return[];let o=[],n=co(),r=.5,i=n.currentNode;for(;(i=n.nextNode())&&o.length<t;){let s=i,l=s.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let a=getComputedStyle(s),c=parseFloat(a.borderTopWidth)||0,d=parseFloat(a.borderRightWidth)||0,p=parseFloat(a.borderBottomWidth)||0,u=parseFloat(a.borderLeftWidth)||0,g=s.clientWidth,x=s.clientHeight,E=parseFloat(a.paddingTop)||0;!Tt(s,"padding-top")&&Math.abs(E-e)<r&&o.push({x:l.left+u,y:l.top+c,width:g,height:e,direction:"vertical",property:"padding-top"});let h=parseFloat(a.paddingBottom)||0;!Tt(s,"padding-bottom")&&Math.abs(h-e)<r&&o.length<t&&o.push({x:l.left+u,y:l.top+c+x-e,width:g,height:e,direction:"vertical",property:"padding-bottom"});let w=parseFloat(a.paddingLeft)||0;!Tt(s,"padding-left")&&Math.abs(w-e)<r&&o.length<t&&o.push({x:l.left+u,y:l.top+c,width:e,height:x,direction:"horizontal",property:"padding-left"});let D=parseFloat(a.paddingRight)||0;!Tt(s,"padding-right")&&Math.abs(D-e)<r&&o.length<t&&o.push({x:l.left+u+g-e,y:l.top+c,width:e,height:x,direction:"horizontal",property:"padding-right"});let B=parseFloat(a.marginTop)||0;!Tt(s,"margin-top")&&Math.abs(B-e)<r&&o.length<t&&o.push({x:l.left,y:l.top-e,width:l.width,height:e,direction:"vertical",property:"margin-top"});let M=parseFloat(a.marginBottom)||0;!Tt(s,"margin-bottom")&&Math.abs(M-e)<r&&o.length<t&&o.push({x:l.left,y:l.bottom,width:l.width,height:e,direction:"vertical",property:"margin-bottom"});let C=parseFloat(a.marginLeft)||0;!Tt(s,"margin-left")&&Math.abs(C-e)<r&&o.length<t&&o.push({x:l.left-e,y:l.top,width:e,height:l.height,direction:"horizontal",property:"margin-left"});let L=parseFloat(a.marginRight)||0;!Tt(s,"margin-right")&&Math.abs(L-e)<r&&o.length<t&&o.push({x:l.right,y:l.top,width:e,height:l.height,direction:"horizontal",property:"margin-right"});let k=a.display;if((k.includes("flex")||k.includes("grid"))&&o.length<t&&!Tt(s,"gap")){let ee=Array.from(s.children).filter(Z=>{let F=getComputedStyle(Z);return F.display!=="none"&&F.position!=="absolute"&&F.position!=="fixed"});if(ee.length>=2)for(let Z=0;Z<ee.length-1&&o.length<t;Z++){let F=ee[Z].getBoundingClientRect(),K=ee[Z+1].getBoundingClientRect(),q=K.top-F.bottom;Math.abs(q-e)<r&&q>.5&&o.push({x:Math.min(F.left,K.left),y:F.bottom,width:Math.max(F.right,K.right)-Math.min(F.left,K.left),height:q,direction:"vertical",property:"gap"});let we=K.left-F.right;Math.abs(we-e)<r&&we>.5&&o.push({x:F.right,y:Math.min(F.top,K.top),width:we,height:Math.max(F.bottom,K.bottom)-Math.min(F.top,K.top),direction:"horizontal",property:"gap"})}}}return o}function or(e){return typeof e=="string"?{value:e}:e}var Vs={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 Gs(e,t){let o=Vs[t];return o?o.includes(e):!1}function Lc(e,t){let o=e.split(/\s+/);for(let n of o){if(n===t)return!0;let r=n.lastIndexOf(":");if(r>=0&&n.slice(r+1)===t)return!0}return!1}function Rc(e){var l,a;let t=e.lastIndexOf(":"),o=t>=0?e.slice(t+1):e,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(a=(l=i[s])!=null?l:i[r])!=null?a:null}function Gr(e,t=30){let o=parseFloat(e.value);if(isNaN(o)||o<=0)return[];if(e.bindings&&e.bindings.length>0){let r=[],i=co(),s=i.currentNode;for(;(s=i.nextNode())&&r.length<t;){let l=s,a=l.getBoundingClientRect();if(a.bottom<-50||a.top>window.innerHeight+50||a.right<-50||a.left>window.innerWidth+50||a.width<1||a.height<1)continue;let c=l.className;if(typeof c=="string")for(let d of e.bindings){if(!Lc(c,d))continue;let p=Rc(d);if(p&&!(e.property&&!Gs(p,e.property))){r.push({element:l,property:p});break}}}return r}let n=Ic(o,t*2);return e.property?n.filter(r=>Gs(r.property,e.property)).slice(0,t):n.slice(0,t)}function Vr(e,t=30){let o=Gr(e,t),n=[];for(let r of o){let i=r.element,s=i.getBoundingClientRect(),l=getComputedStyle(i),a=parseFloat(l.borderTopWidth)||0,c=parseFloat(l.borderRightWidth)||0,d=parseFloat(l.borderLeftWidth)||0,p=i.clientWidth,u=i.clientHeight;switch(r.property){case"padding-top":{let g=parseFloat(l.paddingTop)||0;n.push({x:s.left+d,y:s.top+a,width:p,height:g,direction:"vertical",property:r.property});break}case"padding-bottom":{let g=parseFloat(l.paddingBottom)||0;n.push({x:s.left+d,y:s.top+a+u-g,width:p,height:g,direction:"vertical",property:r.property});break}case"padding-left":{let g=parseFloat(l.paddingLeft)||0;n.push({x:s.left+d,y:s.top+a,width:g,height:u,direction:"horizontal",property:r.property});break}case"padding-right":{let g=parseFloat(l.paddingRight)||0;n.push({x:s.left+d+p-g,y:s.top+a,width:g,height:u,direction:"horizontal",property:r.property});break}case"margin-top":{let g=parseFloat(l.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(l.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(l.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(l.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(x=>{let E=getComputedStyle(x);return E.display!=="none"&&E.position!=="absolute"&&E.position!=="fixed"});for(let x=0;x<g.length-1&&n.length<t;x++){let E=g[x].getBoundingClientRect(),h=g[x+1].getBoundingClientRect(),w=h.top-E.bottom;w>.5&&n.push({x:Math.min(E.left,h.left),y:E.bottom,width:Math.max(E.right,h.right)-Math.min(E.left,h.left),height:w,direction:"vertical",property:"gap"});let D=h.left-E.right;D>.5&&n.push({x:E.right,y:Math.min(E.top,h.top),width:D,height:Math.max(E.bottom,h.bottom)-Math.min(E.top,h.top),direction:"horizontal",property:"gap"})}break}}}return n}function Us(e,t){let o=new Set,n=Ao(t);for(let r of e){let i=Xs[r.property];if(!i)continue;let s=r.element.className;if(typeof s=="string")for(let l of i){let a=`${l}-${n}`;for(let c of s.split(/\s+/)){let d=c.lastIndexOf(":"),p=d>=0?c.slice(d+1):c;if(p===a){o.add(p);break}}}}return[...o]}function Js(e){let t=new Set;for(let o of e)for(let[n,r]of Object.entries(Vs))if(r.includes(o.property)){t.add(n);break}if(t.size===1)return[...t][0]}function Ur(e,t,o){if(t===o)return e;let n=Ao(t),r=Ao(o);return e.map(i=>{let s=i.lastIndexOf("-");if(s<0)return i;let l=i.slice(0,s),a=i.slice(s+1);return a===n||a===`[${t}px]`?`${l}-${r}`:i})}var Ac={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 Ao(e){var t;return(t=Ac[e])!=null?t:`[${e}px]`}var Xs={"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 Pc(e,t,o,n){let r=Xs[t];if(!r)return null;let i=Ao(o);for(let s of r){let l=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+s+"-(?:"+Bc(i)+"|\\["+o+"px\\]))(?:\\s|$)"),a=e.match(l);if(a!=null&&a[1]){let c=Ao(n),d=a[1].lastIndexOf(":"),p=d>=0?a[1].slice(0,d+1):"";return{matched:a[1],suggested:`${p}${s}-${c}`}}}return null}function Bc(e){return e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function Ks(e,t,o){let n=new Set,r=[];for(let i of e){let s=nn(i.element),l=`${s}::${i.property}`;if(n.has(l))continue;n.add(l);let a=er(i.element),c=i.element.className||"",d=Pc(c,i.property,t,o);r.push({selector:s,reactComponent:a==null?void 0:a.name,className:c,property:i.property,matchedClass:d==null?void 0:d.matched,suggestedClass:d==null?void 0:d.suggested})}return r}function Po(e,t){return window.getComputedStyle(e).getPropertyValue(t)}function Jr(e,t){if(e instanceof HTMLElement){let n=e.style.getPropertyValue(t);if(n)return n}let o=Oc(e,t);return o&&o.includes("var(")?o:Po(e,t)}function Oc(e,t){let o=t.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&&e.matches(i.selectorText)){let s=i.style.getPropertyValue(t);if(s&&s.includes("var("))return s;let l=i.style[o];if(l&&l.includes("var("))return l}}catch(r){}}catch(n){}return null}function rr(e,t){if(e instanceof HTMLElement){let n=e.style.getPropertyValue(t);if(n)return n}let o=t.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&&e.matches(i.selectorText)){let s=i.style.getPropertyValue(t);if(s)return s;let l=i.style[o];if(l)return l}}catch(r){}}catch(n){}return null}function ir(e){let t=window.getComputedStyle(e).display;return t==="flex"||t==="inline-flex"||t==="grid"||t==="inline-grid"}function Bo(e){let t=window.getComputedStyle(e);return{row:parseFloat(t.rowGap)||0,column:parseFloat(t.columnGap)||0}}function Dc(e){let t=[];for(let o of e){let n=t.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 t.push(f({},o))}return t}function Yn(e){let t=Array.from(e.children).filter(a=>{if(!(a instanceof HTMLElement))return!1;let c=window.getComputedStyle(a);return c.display!=="none"&&c.position!=="absolute"&&c.position!=="fixed"});if(t.length<2)return[];let o=[],n=e.getBoundingClientRect(),i=window.getComputedStyle(e).flexDirection,s=i==="column"||i==="column-reverse",l=6;for(let a=0;a<t.length-1;a++){let c=t[a].getBoundingClientRect(),d=t[a+1].getBoundingClientRect();if(d.left>c.right+.5&&o.push({axis:"column",x:c.right,y: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-l/2,w:n.width,h:l})}else{let p=(c.right+d.left)/2;o.push({axis:"column",x:p-l/2,y:n.top,w:l,h:n.height})}}return Dc(o)}function Xr(e,t){let o=window.getComputedStyle(e),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!(t!==(i==="column"||i==="column-reverse"?"row":"column")||parseFloat(t==="row"?o.rowGap:o.columnGap)>0)}function uo(e){let t=window.getComputedStyle(e);return{top:parseFloat(t.paddingTop)||0,right:parseFloat(t.paddingRight)||0,bottom:parseFloat(t.paddingBottom)||0,left:parseFloat(t.paddingLeft)||0}}function jn(e){let t=window.getComputedStyle(e);return{"top-left":parseFloat(t.borderTopLeftRadius)||0,"top-right":parseFloat(t.borderTopRightRadius)||0,"bottom-right":parseFloat(t.borderBottomRightRadius)||0,"bottom-left":parseFloat(t.borderBottomLeftRadius)||0}}function Kr(e){for(let t of e.childNodes)if(t.nodeType===Node.TEXT_NODE&&(t.textContent||"").trim().length>0)return!0;return!1}function po(e){var d,p;let t=document.createRange(),o=!1;for(let u of e.childNodes)u.nodeType===Node.TEXT_NODE&&(u.textContent||"").trim().length>0&&(o||(t.setStart(u,0),o=!0),t.setEnd(u,(p=(d=u.textContent)==null?void 0:d.length)!=null?p:0));if(!o)return null;let n=t.getBoundingClientRect(),r=window.getComputedStyle(e),i=parseFloat(r.fontSize)||16,s=parseFloat(r.lineHeight);isNaN(s)&&(s=i*1.2);let l=Math.max(1,t.getClientRects().length),a=Math.max(n.height,l*s),c=(a-n.height)/2;return new DOMRect(n.x,n.y-c,n.width,a)}function Oo(e){let t=window.getComputedStyle(e),o=parseFloat(t.fontSize)||16,n=parseFloat(t.lineHeight);return isNaN(n)&&(n=o*1.2),{fontSize:o,lineHeight:n}}function ze(e,t,o){e instanceof HTMLElement&&e.style.setProperty(t,o,"important")}function Zr(e,t,o){e instanceof HTMLElement&&e.style.removeProperty(t)}function sr(e){var t;for(let o of e){let n=Wt(o.selector);if(!n&&o.durableSelector&&(n=Wt(o.durableSelector),n)){let r=(t=o.selector.match(/\[data-pm="([^"]+)"\]/))==null?void 0:t[1];r&&n.setAttribute("data-pm",r)}if(n)for(let r of o.changes)ze(n,r.property,r.modified)}}function qr(e,t){let o=Wt(e);if(!o)return;let n=t.find(r=>r.selector===e);if(n)for(let r of n.changes)Zr(o,r.property,r.original)}function lr(e){for(let t of e){let o=Wt(t.selector);if(o)for(let n of t.changes)Zr(o,n.property,n.original)}}function qs(e,t,o,n){if(e)for(let r of e){if(r instanceof CSSGroupingRule){qs(r.cssRules,t,o,n);continue}if(r instanceof CSSStyleRule){let i=r.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&Fc(r.style,t,o,n)}}}function Fc(e,t,o,n){for(let r=0;r<e.length;r++){let i=e[r];if(i!=null&&i.startsWith("--")){if(o.has(i))continue;o.add(i);let s=t.getPropertyValue(i).trim();Qs(s)&&n.push({name:i,value:s,usage:`var(${i})`})}}}var ar=null,Nc=5e3;function Qr(){if(ar&&Date.now()-ar.timestamp<Nc)return ar.variables;let e=[],t=new Set,o=getComputedStyle(document.documentElement);try{for(let i of document.styleSheets)try{qs(i.cssRules||i.rules,o,t,e)}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("--")&&!t.has(s)){t.add(s);let l=o.getPropertyValue(s).trim();Qs(l)&&e.push({name:s,value:l,usage:`var(${s})`})}}let r=e.sort((i,s)=>i.name.localeCompare(s.name));return ar={variables:r,timestamp:Date.now()},r}function Qs(e){if(!e)return!1;let t=e.toLowerCase().trim();return!!(/^#([0-9a-f]{3}|[0-9a-f]{4}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)||t.startsWith("rgb")||t.startsWith("hsl")||t.startsWith("oklch")||t.startsWith("oklab")||t.startsWith("lch")||t.startsWith("lab")||["transparent","currentcolor","inherit","white","black","red","green","blue","yellow","orange","purple","pink","gray","grey"].includes(t))}function Do(e,t){let o=t.match(/var\((--[^,)]+)(?:,\s*([^)]+))?\)/);if(o){let n=o[1],r=o[2];return getComputedStyle(document.documentElement).getPropertyValue(n).trim()||r||t}return t}function Fo(e,t){if(!e)return null;let o=Zs(e);if(!o)return null;for(let n of t){let r=Zs(n.value);if(r&&o===r)return n}return null}function Zs(e){if(!e)return null;let t=e.trim().toLowerCase();if(t.startsWith("oklch(")){let o=t.match(/oklch\(\s*([\d.]+%?)\s+([\d.]+%?)\s+([\d.]+)/);if(o){let 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(t.startsWith("rgb")){let o=t.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(o)return`rgb(${o[1]},${o[2]},${o[3]})`}return t.startsWith("#")?t.length===4?`#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}`:t.slice(0,7):t}import{Fragment as Gn,jsx as Je,jsxs as un}from"react/jsx-runtime";var Vn=22,fo=12,Hc=3,zc=250,ei=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],_c=3e3;function $c(i){var s=i,{left:e,top:t,style:o,children:n}=s,r=Bn(s,["left","top","style","children"]);return Je("div",m(f({"data-devtools":"badge-hit-area"},r),{style:f({position:"fixed",left:`max(0px, ${e}px)`,top:`max(0px, ${t}px)`,padding:fo,transform:`translate(min(0px, calc(100vw - max(0px, ${e}px) - 100%)), min(0px, calc(100vh - max(0px, ${t}px) - 100%)))`},o),children:n}))}function nl({annotations:e,supersededAnnotations:t,inFlightIds:o,scrollX:n,scrollY:r,annotationGroupMap:i,onViewThread:s,onSelectAnnotation:l,canvasRef:a}){var h,w,D,B;let[c,d]=No(0),[p,u]=No(()=>Math.floor(Math.random()*ei.length)),g=!!(o&&o.size>0);cr(()=>{if(!g)return;let M=setInterval(()=>{d(L=>(L+1)%Hc)},zc),C=setInterval(()=>{u(L=>(L+1)%ei.length)},_c);return()=>{clearInterval(M),clearInterval(C)}},[g]);let x=[];for(let M of e){if(M.type!=="text"||!M.text||!M.points[0]||t.has(M))continue;let C=M.groupId?e.filter(me=>me.groupId===M.groupId):[M],L=!!(o&&(o.has(M.id)||C.some(me=>o.has(me.id)))),k=(h=M.status)!=null?h:"pending",W=C.some(me=>me.status==="resolved"||me.status==="needs_review"),ee=C.some(me=>me.threadId);if(!L&&k!=="resolved"&&k!=="needs_review"&&!W&&!ee)continue;let Z=M.threadId||((w=C.find(me=>me.threadId))==null?void 0:w.threadId),F=k==="needs_review"||C.some(me=>me.status==="needs_review"),K=C.reduce((me,lt)=>{var qe;return me+((qe=lt.replyCount)!=null?qe:0)},0),q=M.points[0],we=M.fontSize||12,le=we*1.4,he=M.text.split(`
-`),Ne=i.get(M.id),Ie=Ne!==void 0?[Ne+". "+(he[0]||""),...he.slice(1)]:he,$e=(B=(D=a==null?void 0:a.current)==null?void 0:D.getContext("2d"))!=null?B:document.createElement("canvas").getContext("2d");if(!$e)continue;$e.font=`${we}px ${Dt}`;let U=q.x-n,V=so(U),te=V!==void 0?Math.min(400,V):400,fe=$n($e,Ie,te),Ce=Math.min(te,Math.max(...fe.map(me=>$e.measureText(me).width))),ge=fe.length*le,ue=Ie.length*le,We=ge-ue;x.push({id:M.id,threadId:Z,x:q.x+Ce+4,y:q.y-4-We,size:ge+8,color:M.color,isInFlight:L,isNeedsReview:F,replyCount:K})}if(x.length===0)return null;let E=!!s;return Je(Gn,{children:x.map(M=>Je($c,{left:M.x-n-fo,top:M.y-r-fo,onClick:E&&M.threadId?()=>{l==null||l(M.id),s(M.threadId)}:void 0,style:{pointerEvents:E?"auto":"none",cursor:E&&M.threadId?"pointer":void 0,zIndex:9999},children:Je("div",{"data-devtools":"annotation-badge",style:{height:M.size,display:"flex",alignItems:"center",backgroundColor:M.color,fontFamily:Dt,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:M.isInFlight?un(Gn,{children:[Je("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?un(Gn,{children:[Je("circle",{cx:"7",cy:"7",r:"2"}),Je("circle",{cx:"17",cy:"7",r:"2"}),Je("circle",{cx:"7",cy:"17",r:"2"}),Je("circle",{cx:"17",cy:"17",r:"2"})]}):un(Gn,{children:[Je("circle",{cx:"12",cy:"6",r:"2"}),Je("circle",{cx:"6",cy:"12",r:"2"}),Je("circle",{cx:"18",cy:"12",r:"2"}),Je("circle",{cx:"12",cy:"18",r:"2"})]})}),Je("span",{style:{opacity:.7},children:ei[p]})]}):un(Gn,{children:[M.isNeedsReview?Je("span",{style:{fontWeight:700},children:"?"}):un("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[Je("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),Je("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),Je("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),Je("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),Je("span",{style:{opacity:.7},children:M.replyCount>0?`${M.replyCount} ${M.replyCount===1?"reply":"replies"}`:"Cancelled"})]})})},M.id))})}function ti({inFlightSelectorColors:e,animated:t=!0}){let[o,n]=No([]);if(cr(()=>{if(e.size===0){n([]);return}let i=null,s=()=>{let c=[];for(let[d,p]of e){let u=Wt(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)},l=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(s)};s(),window.addEventListener("scroll",l,!0),window.addEventListener("resize",l,!0);let a=new MutationObserver(l);return a.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",l,!0),window.removeEventListener("resize",l,!0),a.disconnect(),i&&cancelAnimationFrame(i)}},[e]),o.length===0)return null;let r={position:"absolute",width:2,height:2,pointerEvents:"none"};return un(Gn,{children:[t&&Je("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),o.map(i=>un("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:[Je("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible"},children:Je("rect",{x:"0.5",y:"0.5",width:Math.max(0,i.width-1),height:Math.max(0,i.height-1),fill:"none",stroke:i.color,strokeWidth:"1",strokeDasharray:"2 4",style:t?{animation:"popmelt-march 0.5s steps(2) infinite"}:void 0})}),Je("div",{style:m(f({},r),{top:-1,left:-1,backgroundColor:i.color})}),Je("div",{style:m(f({},r),{top:-1,right:-1,backgroundColor:i.color})}),Je("div",{style:m(f({},r),{bottom:-1,left:-1,backgroundColor:i.color})}),Je("div",{style:m(f({},r),{bottom:-1,right:-1,backgroundColor:i.color})})]},i.selector))]})}function ol({annotations:e,supersededAnnotations:t,scrollX:o,scrollY:n,onReply:r,annotationGroupMap:i,canvasRef:s}){let l=e.filter(d=>t.has(d)?!1:d.status==="waiting_input"&&d.question&&d.threadId);if(l.length===0)return null;let a=new Set,c=[];for(let d of l){if(!d.threadId||a.has(d.threadId))continue;a.add(d.threadId);let p=d.type==="text"?d:e.find(u=>u.groupId&&u.groupId===d.groupId&&u.type==="text")||d;if(p.type==="text"&&p.text&&p.points[0]){let u=p.points[0],g=p.fontSize||12,x=g*1.4,E=p.text.split(`
-`),h=i.get(p.id),w=h!==void 0?[h+". "+(E[0]||""),...E.slice(1)]:E,B=document.createElement("canvas").getContext("2d");if(!B)continue;B.font=`${g}px ${Dt}`;let M=u.x-o,C=so(M),L=C!==void 0?Math.min(400,C):400,k=$n(B,w,L),W=Math.min(L,Math.max(...k.map(q=>B.measureText(q).width))),ee=k.length*x,Z=w.length*x,F=ee-Z,K=ee+8;c.push({annotation:d,x:u.x+W+4,y:u.y-4-F,size:K})}}return c.length===0?null:Je(Gn,{children:c.map(({annotation:d,x:p,y:u,size:g})=>Je(Wc,{annotation:d,x:p-o,y:u-n,size:g,onReply:r},`question-${d.threadId}`))})}function Wc({annotation:e,x:t,y:o,size:n,onReply:r}){let[i,s]=No(!1),[l,a]=No(""),c=tl(null),d=tl(null);cr(()=>{i&&c.current&&c.current.focus()},[i]),cr(()=>{if(!i)return;let E=w=>{d.current&&!d.current.contains(w.target)&&s(!1)},h=w=>{w.key==="Escape"&&s(!1)};return document.addEventListener("mousedown",E),document.addEventListener("keydown",h),()=>{document.removeEventListener("mousedown",E),document.removeEventListener("keydown",h)}},[i]);let p=el(()=>{!l.trim()||!e.threadId||(r(e.threadId,l.trim()),a(""),s(!1))},[l,e.threadId,r]),u=el(E=>{E.key==="Enter"&&(E.metaKey||E.ctrlKey)&&(E.preventDefault(),p())},[p]),g=i?t:t-fo,x=i?o:o-fo;return un("div",{ref:d,"data-devtools":"question-badge",style:{position:"fixed",left:`max(0px, ${g}px)`,top:`max(0px, ${x}px)`,padding:i?0:fo,transform:`translate(min(0px, calc(100vw - max(0px, ${g}px) - 100%)), min(0px, calc(100vh - max(0px, ${x}px) - 100%)))`,zIndex:i?10002:9999,pointerEvents:"auto",cursor:i?void 0:"pointer"},children:[!i&&un("div",{onClick:()=>s(!0),style:{height:n,display:"flex",alignItems:"center",backgroundColor:e.color,padding:`0 ${4}px`,gap:4,fontFamily:Dt,fontSize:12,color:"#ffffff",whiteSpace:"nowrap"},children:[un("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[Je("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),Je("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),Je("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),Je("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),Je("span",{style:{opacity:.7},children:"reply?"})]}),i&&un("div",{style:{minWidth:260,maxWidth:360,backgroundColor:"#ffffff",fontFamily:Dt,fontSize:12,color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)"},children:[Je("div",{style:{padding:`${6}px ${8}px`,lineHeight:1.4},children:e.question}),un("div",{style:{padding:`0 ${4}px ${4}px`},children:[Je("textarea",{ref:c,value:l,onChange:E=>a(E.target.value),onKeyDown:u,placeholder:"Type your reply...",style:{width:"100%",minHeight:40,padding:4,fontSize:12,fontFamily:Dt,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"}}),Je("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:4},children:Je("button",{onClick:p,disabled:!l.trim(),style:{padding:"4px 12px",fontSize:11,fontFamily:Dt,fontWeight:600,backgroundColor:l.trim()?e.color:"rgba(0,0,0,0.1)",color:l.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:l.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}function dr(e){var i;let t=new Set,o=new Map;for(let s of e){if(!s.linkedSelector)continue;let l=o.get(s.linkedSelector)||[];l.push(s),o.set(s.linkedSelector,l)}let 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((a,c)=>c.timestamp-a.timestamp);let l=s[0];l.groupId&&r.add(l.groupId);for(let a=1;a<s.length;a++){let c=s[a];t.add(c),c.groupId&&n.add(c.groupId)}}for(let s of e)s.groupId&&n.has(s.groupId)&&!r.has(s.groupId)&&t.add(s);return t}import{useEffect as rl,useLayoutEffect as Yc,useState as il}from"react";import{jsx as ni,jsxs as ll}from"react/jsx-runtime";function jc(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var sl=["top-left","top-right","bottom-right","bottom-left"];function al({element:e,radius:t,accentColor:o,hoveredCorner:n,draggingCorner:r,cursorViewport:i}){let[s,l]=il(null),[a,c]=il(!1);if(rl(()=>{let w=M=>{(M.key==="Meta"||M.key==="Control")&&c(!0)},D=M=>{(M.key==="Meta"||M.key==="Control")&&c(!1)},B=()=>c(!1);return window.addEventListener("keydown",w,!0),window.addEventListener("keyup",D,!0),window.addEventListener("blur",B),()=>{window.removeEventListener("keydown",w,!0),window.removeEventListener("keyup",D,!0),window.removeEventListener("blur",B)}},[]),rl(()=>{if(!e){l(null);return}let w=()=>{l(e.getBoundingClientRect())};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[e]),Yc(()=>{e&&l(e.getBoundingClientRect())},[e,t["top-left"],t["top-right"],t["bottom-right"],t["bottom-left"]]),!s)return null;let d=s.width,p=s.height,u=jc(o,.2),g={"top-left":{x:0,y:t["top-left"]},"top-right":{x:d,y:t["top-right"]},"bottom-right":{x:d,y:p-t["bottom-right"]},"bottom-left":{x:0,y:p-t["bottom-left"]}},x=new Set,E=r!=null?r:n;if(E)if(a)x.add(E);else for(let w of sl)x.add(w);let h={position:"fixed",top:s.top,left:s.left,width:d,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"};return ll("div",{"data-devtools":"border-radius-handles",style:h,children:[ll("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${p}`,children:[ni("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"}),sl.map(w=>{let D=g[w],B=x.has(w);return ni("circle",{cx:D.x,cy:D.y,r:w===(r!=null?r:n)?3:2.5,fill:o,stroke:"#ffffff",strokeWidth:w===(r!=null?r:n)?4:2,paintOrder:"stroke"},w)})]}),i&&E&&(()=>{let w=Math.round(t[E]);return ni("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:w})})()]})}import{useEffect as Gc,useState as Vc}from"react";function Un(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);if(o)return`oklch(${o[1]} / ${t})`;let n=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);if(n){let r=parseInt(n[1],16),i=parseInt(n[2],16),s=parseInt(n[3],16);return`rgba(${r}, ${i}, ${s}, ${t})`}return`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}import{Fragment as Uc,jsx as Jn,jsxs as Ho}from"react/jsx-runtime";function mo({element:e,isSelected:t=!1,elementInfo:o,color:n="#3b82f6",annotationNumber:r,changeCount:i,hideTooltip:s=!1}){let[l,a]=Vc(null);if(Gc(()=>{if(!e){a(null);return}let L=()=>{let k=e.getBoundingClientRect();a(k)};return L(),window.addEventListener("scroll",L,{passive:!0}),window.addEventListener("resize",L,{passive:!0}),()=>{window.removeEventListener("scroll",L),window.removeEventListener("resize",L)}},[e]),!l||!e)return null;let c={position:"fixed",top:l.top,left:l.left,width:l.width,height:l.height,pointerEvents:"none",zIndex:9996,backgroundColor:t?Un(n,.1):Un(n,.05),overflow:"visible"},d={position:"absolute",width:2,height:2,backgroundColor:n,pointerEvents:"none"},p=e.tagName.toLowerCase(),u=e.id?`#${e.id}`:"",g=e.classList.length>0?"."+Array.from(e.classList).slice(0,2).join("."):"",x=o==null?void 0:o.reactComponent,E=x?`<${x}> ${p}${u}${g}`:`${p}${u}${g}`,h=22,w=l.height>=window.innerHeight,D=w?0:l.top>=h?l.top-h:l.bottom,B=w?{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:D,left:l.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},C=!s&&Ho("div",{"data-devtools":"tooltip",style:B,children:[r!==void 0&&Ho("span",{children:[r,"."]}),Jn("span",{style:{overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0},children:E}),i!==void 0&&i>0&&Ho("span",{style:{opacity:.8},children:["(",i," ",i===1?"change":"changes",")"]})]});return Ho(Uc,{children:[Ho("div",{"data-devtools":"highlight",style:c,children:[Jn("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:Jn("rect",f({x:"0.5",y:"0.5",width:Math.max(0,l.width-1),height:Math.max(0,l.height-1),fill:"none",stroke:n,strokeWidth:"1"},!t&&{strokeDasharray:"2 4"}))}),Jn("div",{style:m(f({},d),{top:-1,left:-1})}),Jn("div",{style:m(f({},d),{top:-1,right:-1})}),Jn("div",{style:m(f({},d),{bottom:-1,left:-1})}),Jn("div",{style:m(f({},d),{bottom:-1,right:-1})}),w&&C]}),!w&&C]})}import{useEffect as cl,useLayoutEffect as Jc,useState as oi}from"react";import{jsx as Cn,jsxs as ii}from"react/jsx-runtime";function ri(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function si({element:e,gap:t,accentColor:o,hoveredAxis:n,draggingAxis:r,cursorViewport:i,isAutoGap:s=!1,refreshKey:l=0}){let[a,c]=oi(null),[d,p]=oi([]),[u,g]=oi(!1);if(cl(()=>{let W=F=>{(F.key==="Meta"||F.key==="Control")&&g(!0)},ee=F=>{(F.key==="Meta"||F.key==="Control")&&g(!1)},Z=()=>g(!1);return window.addEventListener("keydown",W,!0),window.addEventListener("keyup",ee,!0),window.addEventListener("blur",Z),()=>{window.removeEventListener("keydown",W,!0),window.removeEventListener("keyup",ee,!0),window.removeEventListener("blur",Z)}},[]),cl(()=>{if(!e){c(null),p([]);return}let W=()=>{c(e.getBoundingClientRect()),p(Yn(e))};return W(),window.addEventListener("scroll",W,{passive:!0}),window.addEventListener("resize",W,{passive:!0}),()=>{window.removeEventListener("scroll",W),window.removeEventListener("resize",W)}},[e]),Jc(()=>{e&&(c(e.getBoundingClientRect()),p(Yn(e)))},[e,t.row,t.column,l]),!a||d.length===0)return null;let x=a.width,E=a.height,h="pm-gap-stripe-pattern",w=ri(o,.25),D=ri(o,.1),B=ri(o,.2),M=8,C=2,L={position:"fixed",top:a.top,left:a.left,width:x,height:E,pointerEvents:"none",zIndex:9996,overflow:"visible"},k=r!=null?r:n;return ii("div",{"data-devtools":"gap-handles",style:L,children:[ii("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${x} ${E}`,children:[Cn("defs",{children:Cn("pattern",{id:h,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Cn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:w,strokeWidth:"1.5"})})}),Cn("rect",{x:"0.5",y:"0.5",width:Math.max(0,x-1),height:Math.max(0,E-1),fill:"none",stroke:B,strokeWidth:"1"}),d.map((W,ee)=>{let Z=W.x-a.left,F=W.y-a.top,K=W.w,q=W.h,we=u?W.axis===k:!0;return(W.axis==="row"?t.row:t.column)===0?null:ii("g",{opacity:we?1:.6,children:[Cn("rect",{x:Z,y:F,width:K,height:q,fill:D}),Cn("rect",{x:Z,y:F,width:K,height:q,fill:`url(#${h})`})]},ee)}),k&&(()=>{let W=d.filter(V=>V.axis===k);if(W.length===0)return null;let ee=W[0];if(i&&W.length>1){let V=1/0;for(let te of W){let fe=te.x+te.w/2,Ce=te.y+te.h/2,ge=Math.abs(i.x-fe)+Math.abs(i.y-Ce);ge<V&&(V=ge,ee=te)}}let Z=ee.x-a.left,F=ee.y-a.top,K=ee.w,q=ee.h,we=Z+K/2,le=F+q/2;if(s)return Cn("circle",{cx:we,cy:le,r:1.5,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let he=k==="column",Ne=he?C:M,Ie=he?M:C,$e=we-Ne/2,U=le-Ie/2;return Cn("rect",{x:$e,y:U,width:Ne,height:Ie,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),i&&k&&(()=>{let W=s?"auto":String(Math.round(k==="row"?t.row:t.column));return Cn("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:W})})()]})}import{useCallback as Qc,useEffect as ed,useState as td}from"react";import{useEffect as Xc,useState as dl}from"react";var Kc=3,Zc=250,li=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],qc=3e3;function ur(e){let[t,o]=dl(0),[n,r]=dl(()=>Math.floor(Math.random()*li.length));return Xc(()=>{if(!e)return;let i=setInterval(()=>o(l=>(l+1)%Kc),Zc),s=setInterval(()=>r(l=>(l+1)%li.length),qc);return()=>{clearInterval(i),clearInterval(s)}},[e]),{charIndex:t,word:li[n]}}import{Fragment as ai,jsx as on,jsxs as ho}from"react/jsx-runtime";function nd(e){let{element:t}=e,o=t.tagName,n=t.id?`#${t.id}`:"",r=t.className?"."+t.className.split(" ").slice(0,2).join("."):"",i=t.reactComponent;return i?`<${i}> ${o}${n}${r}`:`${o}${n}${r}`}var ul=22,ci=12;function od(i){var s=i,{left:e,top:t,style:o,children:n}=s,r=Bn(s,["left","top","style","children"]);return on("div",m(f({"data-devtools":"badge-hit-area"},r),{style:f({position:"fixed",left:`max(0px, ${e}px)`,top:`max(0px, ${t}px)`,padding:ci,transform:`translate(min(0px, calc(100vw - max(0px, ${e}px) - 100%)), min(0px, calc(100vh - max(0px, ${t}px) - 100%)))`},o),children:n}))}function pl({styleModifications:e,isInspecting:t,accentColor:o,annotationGroupCount:n,dispatch:r,inFlightSelectors:i}){let[s,l]=td([]),a=i&&i.size>0,{charIndex:c,word:d}=ur(!!a);ed(()=>{if(t){l([]);return}let x=null,E=()=>{let D=[];e.forEach((B,M)=>{let C=Wt(B.selector);if(!C)return;let L=C.getBoundingClientRect();D.push({selector:B.selector,modIndex:M,top:L.top>=ul?L.top-ul:L.bottom,left:L.left,label:nd(B),changeCount:B.changes.length,annotationNumber:n+M+1})}),l(D)},h=()=>{x&&cancelAnimationFrame(x),x=requestAnimationFrame(E)};E(),window.addEventListener("scroll",h,!0),window.addEventListener("resize",h,!0);let w=new MutationObserver(h);return w.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),window.addEventListener("load",h),document.fonts.ready.then(h),()=>{window.removeEventListener("scroll",h,!0),window.removeEventListener("resize",h,!0),window.removeEventListener("load",h),w.disconnect(),x&&cancelAnimationFrame(x)}},[e,t,n]);let p=Qc(x=>{let E=e[x];if(!E)return;let h=Wt(E.selector);h&&(r({type:"SELECT_ANNOTATION",payload:{id:null}}),r({type:"SET_TOOL",payload:"inspector"}),r({type:"SELECT_ELEMENT",payload:{el:h,info:E.element}}))},[e,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 on(ai,{children:s.map(x=>{let E=i==null?void 0:i.has(x.selector);return on(od,{left:x.left-ci,top:x.top-ci,onClick:()=>p(x.modIndex),style:{zIndex:1e4,cursor:"pointer",pointerEvents:"auto"},children:ho("div",{"data-devtools":"badge",style:m(f({},u),{backgroundColor:E?"#999999":o}),children:[ho("span",{children:[x.annotationNumber,"."]}),on("span",{style:g,children:x.label}),ho("span",{style:{opacity:.8},children:["(",x.changeCount," ",x.changeCount===1?"change":"changes",")"]}),E&&ho("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[on("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?ho(ai,{children:[on("circle",{cx:"7",cy:"7",r:"2"}),on("circle",{cx:"17",cy:"7",r:"2"}),on("circle",{cx:"7",cy:"17",r:"2"}),on("circle",{cx:"17",cy:"17",r:"2"})]}):ho(ai,{children:[on("circle",{cx:"12",cy:"6",r:"2"}),on("circle",{cx:"6",cy:"12",r:"2"}),on("circle",{cx:"18",cy:"12",r:"2"}),on("circle",{cx:"12",cy:"18",r:"2"})]})}),d]})]})},x.selector)})})}import{useEffect as rd,useState as id}from"react";import{Fragment as ld,jsx as fl}from"react/jsx-runtime";function sd(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function gl({styleModifications:e,accentColor:t}){let[o,n]=id([]);if(rd(()=>{let i=null,s=()=>{let c=[];for(let d of e){let p=Wt(d.selector);if(!p)continue;let u=p.getBoundingClientRect();if(u.width===0&&u.height===0)continue;let g=jn(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)},l=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(s)};s(),window.addEventListener("scroll",l,{passive:!0}),window.addEventListener("resize",l,{passive:!0});let a=new MutationObserver(l);return a.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",l),window.removeEventListener("resize",l),a.disconnect(),i&&cancelAnimationFrame(i)}},[e]),o.length===0)return null;let r=sd(t,.2);return fl(ld,{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 fl("div",{"data-devtools":"mod-border",style:s},i.selector)})})}import{useEffect as ml,useLayoutEffect as ad,useState as hl}from"react";import{jsx as On,jsxs as ui}from"react/jsx-runtime";function di(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var cd={top:"bottom",bottom:"top",left:"right",right:"left"};function pi({element:e,padding:t,accentColor:o,hoveredSide:n,draggingSide:r,cursorViewport:i,refreshKey:s}){let[l,a]=hl(null),[c,d]=hl(!1);if(ml(()=>{let K=le=>{(le.key==="Meta"||le.key==="Control")&&d(!0)},q=le=>{(le.key==="Meta"||le.key==="Control")&&d(!1)},we=()=>d(!1);return window.addEventListener("keydown",K,!0),window.addEventListener("keyup",q,!0),window.addEventListener("blur",we),()=>{window.removeEventListener("keydown",K,!0),window.removeEventListener("keyup",q,!0),window.removeEventListener("blur",we)}},[]),ml(()=>{if(!e){a(null);return}let K=()=>{a(e.getBoundingClientRect())};return K(),window.addEventListener("scroll",K,{passive:!0}),window.addEventListener("resize",K,{passive:!0}),()=>{window.removeEventListener("scroll",K),window.removeEventListener("resize",K)}},[e]),ad(()=>{e&&a(e.getBoundingClientRect())},[e,t.top,t.right,t.bottom,t.left,s]),!l)return null;let p=l.width,u=l.height,{top:g,right:x,bottom:E,left:h}=t,w="pm-stripe-pattern",D=di(o,.25),B=di(o,.1),M=di(o,.2),C=8,L=2,k={position:"fixed",top:l.top,left:l.left,width:p,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"},W=["top","right","bottom","left"],ee={top:`0,0 ${p},0 ${p-x},${g} ${h},${g}`,right:`${p},0 ${p},${u} ${p-x},${u-E} ${p-x},${g}`,bottom:`0,${u} ${h},${u-E} ${p-x},${u-E} ${p},${u}`,left:`0,0 ${h},${g} ${h},${u-E} 0,${u}`},Z={top:{x:p/2-C/2,y:g/2-L/2,w:C,h:L},bottom:{x:p/2-C/2,y:u-E/2-L/2,w:C,h:L},left:{x:h/2-L/2,y:u/2-C/2,w:L,h:C},right:{x:p-x/2-L/2,y:u/2-C/2,w:L,h:C}},F=new Set;return r?F.add(r):n&&(F.add(n),c||F.add(cd[n])),ui("div",{"data-devtools":"padding-handles",style:k,children:[ui("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${p} ${u}`,children:[On("defs",{children:On("pattern",{id:w,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:On("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:D,strokeWidth:"1.5"})})}),On("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"}),W.map(K=>{if(t[K]<=0)return null;let we=F.has(K);return ui("g",{opacity:we?1:.6,children:[On("polygon",{points:ee[K],fill:B}),On("polygon",{points:ee[K],fill:`url(#${w})`})]},K)}),W.map(K=>{let q=Z[K],we=F.has(K);return On("rect",{x:q.x,y:q.y,width:q.w,height:q.h,fill:o,stroke:"#ffffff",strokeWidth:we?4:2,paintOrder:"stroke"},`handle-${K}`)})]}),i&&(n||r)&&(()=>{let K=r!=null?r:n,q=Math.round(t[K]);return On("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:q})})()]})}import{useCallback as wn,useEffect as fn,useMemo as br,useRef as tn,useState as Nt}from"react";import{Check as yr,ChevronDown as vi,MoveHorizontal as Il,RotateCcw as Od,Shrink as Dd,X as Fd}from"lucide-react";var dd="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",mn={borderWidth:3,borderStyle:"solid",borderImage:`url("${dd}") 4 / 1.9 / 0 round`};var pr={"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 yo(e){var t,o;return(o=(t=pr[e])==null?void 0:t[0])!=null?o:"px"}function Dn(e){let t=e.match(/^([\d.-]+)(.*)$/);return t?{num:parseFloat(t[1]),unit:t[2]||""}:{num:0,unit:""}}function fr(e,t,o,n){let r=e.trim();if(!r)return"";let i=r.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i);if(i)return`${parseFloat(i[1])}${i[2].toLowerCase()}`;let s=parseFloat(r);if(!isNaN(s)){if(n){let{unit:l}=Dn(o);return`${s}${l||yo(t)}`}return`${s}${yo(t)}`}return r}function fi(e,t){if(!t||t==="px")return e;if(t==="rem"){let o=parseFloat(getComputedStyle(document.documentElement).fontSize)||16;return Math.round(e/o*1e3)/1e3}return e}import{useCallback as ud,useEffect as pd,useRef as yl,useState as fd}from"react";import{Plus as bl,X as gd}from"lucide-react";import{jsx as en,jsxs as Xn}from"react/jsx-runtime";var gr=[{name:"blur",label:"Blur",unit:"px",defaultValue:10,min:0,max:100,step:1},{name:"brightness",label:"Brightness",unit:"",defaultValue:1,min:0,max:3,step:.05},{name:"contrast",label:"Contrast",unit:"",defaultValue:1,min:0,max:3,step:.05},{name:"saturate",label:"Saturate",unit:"",defaultValue:1,min:0,max:3,step:.05},{name:"grayscale",label:"Grayscale",unit:"",defaultValue:0,min:0,max:1,step:.05},{name:"sepia",label:"Sepia",unit:"",defaultValue:0,min:0,max:1,step:.05},{name:"invert",label:"Invert",unit:"",defaultValue:0,min:0,max:1,step:.05},{name:"hue-rotate",label:"Hue Rotate",unit:"deg",defaultValue:0,min:0,max:360,step:1},{name:"opacity",label:"Opacity",unit:"",defaultValue:1,min:0,max:1,step:.05}];function md(e){if(!e||e==="none")return[];let t=[],o=/([\w-]+)\(([^)]+)\)/g,n;for(;(n=o.exec(e))!==null;){let r=n[1],i=n[2],s=parseFloat(i);isNaN(s)||t.push({name:r,value:s})}return t}function gi(e){return e.length===0?"none":e.map(t=>{var r;let o=gr.find(i=>i.name===t.name),n=(r=o==null?void 0:o.unit)!=null?r:"";return`${t.name}(${t.value}${n})`}).join(" ")}function xl({value:e,onChange:t,accentColor:o,modified:n,panelContentRef:r}){let i=md(e),[s,l]=fd(!1),a=yl(null),c=yl(null);pd(()=>{if(!s)return;let B=M=>{a.current&&!a.current.contains(M.target)&&l(!1)};return document.addEventListener("mousedown",B,!0),()=>document.removeEventListener("mousedown",B,!0)},[s]);let d=gr.filter(B=>!i.some(M=>M.name===B.name)),p=B=>{let M=[...i,{name:B.name,value:B.defaultValue}];t(gi(M)),l(!1)},u=B=>{let M=i.filter((C,L)=>L!==B);t(gi(M))},g=(B,M)=>{let C=i.map((L,k)=>k===B?m(f({},L),{value:M}):L);t(gi(C))},x={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},E=ud(B=>{var F;if(!c.current)return{position:"fixed",top:0,left:0};let M=c.current.getBoundingClientRect(),C=c.current.closest('[data-devtools="panel"]'),L=C?C.getBoundingClientRect():{top:0,left:0,bottom:9999},k=(F=r==null?void 0:r.current)==null?void 0:F.getBoundingClientRect(),W=B*24+8,Z=L.bottom-M.bottom<W;return m(f({position:"fixed"},Z?{bottom:L.bottom-M.top+2-L.top}:{top:M.bottom+2-L.top}),{left:k?k.left+4-L.left:M.left-L.left,width:k?k.width-8:140,zIndex:10001})},[r]),h={backgroundColor:"rgba(255, 255, 255, 0.95)",backdropFilter:"blur(16px)",WebkitBackdropFilter:"blur(16px)",border:"1px solid rgba(0,0,0,0.1)",borderRadius:4,padding:"4px 0",boxShadow:"0 4px 12px rgba(0,0,0,0.1)"},w={display:"block",width:"100%",padding:"4px 10px",border:"none",backgroundColor:"transparent",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#334155",cursor:"pointer",textAlign:"left"},D=B=>en("div",{ref:a,style:f(f({},E(B.length)),h),children:B.map(M=>en("button",{type:"button",onClick:()=>p(M),style:w,onMouseEnter:C=>{C.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:C=>{C.currentTarget.style.backgroundColor="transparent"},children:M.label},M.name))});return i.length===0?Xn("div",{children:[Xn("div",{style:{display:"flex",alignItems:"center",gap:4},children:[en(Mn,{modified:!1,children:en("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:m(f({},x),{color:"#999",cursor:"default"})})}),en("button",{ref:c,type:"button",onClick:()=>l(!s),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,padding:0,border:"none",borderRadius:2,backgroundColor:"transparent",color:"#94a3b8",cursor:"pointer",flexShrink:0},children:en(bl,{size:12})})]}),s&&D(gr)]}):Xn("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[i.map((B,M)=>{let C=gr.find(L=>L.name===B.name);return C?Xn("div",{style:{display:"flex",alignItems:"center",gap:4},children:[en("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:C.label}),en(Mn,{modified:n,children:Xn("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[en("input",{type:"range",min:C.min,max:C.max,step:C.step,value:B.value,onChange:L=>g(M,parseFloat(L.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${o} ${(B.value-C.min)/(C.max-C.min)*100}%, rgba(0,0,0,0.1) ${(B.value-C.min)/(C.max-C.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),en("input",{type:"number",min:C.min,max:C.max,step:C.step,value:C.unit==="px"||C.unit==="deg"?Math.round(B.value):Math.round(B.value*100)/100,onChange:L=>g(M,parseFloat(L.target.value)||0),style:m(f({},x),{width:44,padding:"2px 4px",textAlign:"right",flexShrink:0})}),C.unit&&en("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:C.unit})]})}),en("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:en(gd,{size:10})})]},B.name):null}),d.length>0&&Xn("div",{children:[Xn("button",{ref:c,type:"button",onClick:()=>l(!s),style:{display:"flex",alignItems:"center",gap:4,padding:"2px 4px",border:"none",borderRadius:2,backgroundColor:"transparent",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#94a3b8",cursor:"pointer"},children:[en(bl,{size:10}),"Add filter"]}),s&&D(d)]})]})}import{useCallback as xo,useEffect as xd,useRef as mr,useState as vl}from"react";import{AlignHorizontalSpaceAround as vd,AlignVerticalSpaceAround as Sd,Columns3 as wd,Grid2x2 as kd,RectangleHorizontal as Ed,Rows3 as Cd,UnfoldHorizontal as Sl,UnfoldVertical as wl}from"lucide-react";import{useCallback as hd,useEffect as yd,useRef as zo}from"react";import{jsx as bd}from"react/jsx-runtime";var mi=[0,1,2,4,8,12,16,20,24,28,32];function bo({value:e,onChange:t,onPreview:o,onScrubEnd:n,onReset:r,isModified:i,accentColor:s,defaultUnit:l="rem",snapSteps:a,color:c,style:d,children:p}){let u=zo(null),g=zo(null),x=zo(r),E=zo(i),h=zo(!1);x.current=r,E.current=i,yd(()=>{let D=M=>{let C=g.current;if(!C)return;C.hasMoved=!0,h.current=M.shiftKey;let L=C.unit==="rem"||C.unit==="em"?.1:1;C.accum+=M.movementX*L;let k=Math.max(0,Math.round((C.startValue+C.accum)*10)/10);if(M.shiftKey&&a){let W=C.unit==="rem"||C.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,ee=C.unit==="rem"||C.unit==="em"?k*W:k,Z=a[a.length-1];for(let F=0;F<a.length-1;F++){let K=a[F],q=a[F+1];if(ee<=(K+q)/2){Z=K;break}if(ee<q){Z=q;break}}ee>a[a.length-1]&&(Z=Math.round(ee/8)*8),k=C.unit==="rem"||C.unit==="em"?Math.round(Z/W*1e3)/1e3:Z}o==null||o(`${k}${C.unit}`)},B=()=>{let M=g.current;if(!M)return;let C=Math.max(0,Math.round((M.startValue+M.accum)*10)/10);if(h.current&&a){let k=M.unit==="rem"||M.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,W=M.unit==="rem"||M.unit==="em"?C*k:C,ee=a[a.length-1];for(let Z=0;Z<a.length-1;Z++){let F=a[Z],K=a[Z+1];if(W<=(F+K)/2){ee=F;break}if(W<K){ee=K;break}}W>a[a.length-1]&&(ee=Math.round(W/8)*8),C=M.unit==="rem"||M.unit==="em"?Math.round(ee/k*1e3)/1e3:ee}let L=M.hasMoved&&C!==M.startValue;g.current=null,document.exitPointerLock(),L?t(`${C}${M.unit}`):M.hasMoved?o==null||o(`${M.startValue}${M.unit}`):E.current&&x.current&&x.current(),n==null||n()};return document.addEventListener("mousemove",D),document.addEventListener("mouseup",B),()=>{document.removeEventListener("mousemove",D),document.removeEventListener("mouseup",B)}},[t,o,n]);let w=hd(D=>{var C;if(D.button!==0)return;D.preventDefault();let B=Dn(e),M=B.unit&&B.unit!=="px"?B.unit:l;g.current={startValue:B.num,unit:M,accum:0,hasMoved:!1},(C=u.current)==null||C.requestPointerLock()},[e,l]);return bd("span",{ref:u,onMouseDown:w,title:i?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:f({color:i?s||"#3b82f6":c||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize"},d),children:p})}import{Fragment as hi,jsx as Se,jsxs as At}from"react/jsx-runtime";function Md({gridCols:e,gridRows:t,gridModified:o,accentColor:n,onColsChange:r,onRowsChange:i}){return Se(rn,{style:{width:100},children:At("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[Se("input",{type:"number",min:1,max:12,value:e,onChange:s=>r(parseInt(s.target.value)||1),style:m(f({},Ft),{width:32,textAlign:"center",padding:2})}),Se("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"}),Se("input",{type:"number",min:1,max:12,value:t,onChange:s=>i(parseInt(s.target.value)||1),style:m(f({},Ft),{width:32,textAlign:"center",padding:2})})]})})}function kl({element:e,getValue:t,getOriginalValue:o,handleChange:n,isModified:r,onResetProperty:i,isCollapsed:s,onToggle:l,sectionHeaderStyle:a,activeDropdown:c,onDropdownChange:d,panelContentRef:p,accentColor:u,onFieldHover:g,preferredUnit:x,onUnitCycle:E}){let h=d,w=t("display"),D=t("flex-direction"),B=El(w,D),M=w==="flex"||w==="inline-flex",C=w==="grid",L=M||C,k=t("width"),W=t("height"),ee=r("width")?k:rr(e,"width"),Z=r("height")?W:rr(e,"height"),F=yi(k,ee),K=yi(W,Z),q=t("min-width"),we=t("max-width"),le=t("min-height"),he=t("max-height"),Ne=vo(t("padding")),Ie=t("gap"),$e=t("row-gap"),U=t("column-gap"),V=t("grid-template-columns"),te=t("grid-template-rows"),fe=t("overflow"),Ce=V.split(/\s+/).filter(j=>j&&j!=="none").length||1,ge=te.split(/\s+/).filter(j=>j&&j!=="none").length||1,[ue,We]=vl(!1),me=c!==null,lt=me||ue,qe=me?.3:ue?.65:1,Oe=({mode:j,icon:Ee,active:He})=>Se("button",{type:"button",onClick:()=>Cl(j,n),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:He?Un(u,.15):"transparent",color:He?u:"#64748b",cursor:"pointer",fontSize:14},children:Ee}),tt=(j,Ee,He)=>{He==="fixed"?n(j,Ee):n(j,hr(He,Ee))},A=j=>{let Ee=vo(t("padding")),He=j||"0";n("padding",`${Ee.top} ${He} ${Ee.bottom} ${He}`)},re=j=>{let Ee=vo(t("padding")),He=j||"0";n("padding",`${He} ${Ee.right} ${He} ${Ee.left}`)},[de,Ae]=vl({}),ke=xo((j,Ee)=>He=>{Ee(He),Ae(qt=>m(f({},qt),{[j]:He}))},[]),Le=xo(j=>{Ae(Ee=>{let He=f({},Ee);return delete He[j],He})},[]),xe=xo(j=>{let Ee=vo(t("padding"));ze(e,"padding",`${Ee.top} ${j} ${Ee.bottom} ${j}`)},[e,t]),at=xo(j=>{let Ee=vo(t("padding"));ze(e,"padding",`${j} ${Ee.right} ${j} ${Ee.left}`)},[e,t]),Qe=xo(j=>Ee=>{ze(e,j,Ee)},[e]),gt=D==="column"||D==="column-reverse",rt=j=>j==="center"?1:j==="flex-end"||j==="end"?2:0,dt=rt(t("justify-content")),mt=rt(t("align-items")),Ct=gt?mt:dt,Be=gt?dt:mt,Kt=mr(null),ut=mr({x:0,y:0}),zt=mr({col:Ct,row:Be});zt.current={col:Ct,row:Be};let Yt=xo((j,Ee)=>{let He=["flex-start","center","flex-end"];gt?(n("justify-content",He[Ee]),n("align-items",He[j])):(n("justify-content",He[j]),n("align-items",He[Ee]))},[gt,n]),an=mr(Yt);an.current=Yt,xd(()=>{let Ee=He=>{let qt=Kt.current;if(!qt||!qt.contains(He.target))return;He.preventDefault(),He.stopPropagation(),ut.current.x+=He.deltaX,ut.current.y+=He.deltaY;let{col:nt,row:vt}=zt.current,pt=!1;Math.abs(ut.current.x)>=30&&(nt=Math.max(0,Math.min(2,nt+(ut.current.x>0?1:-1))),ut.current.x=0,ut.current.y=0,pt=!0),!pt&&Math.abs(ut.current.y)>=30&&(vt=Math.max(0,Math.min(2,vt+(ut.current.y>0?1:-1))),ut.current.x=0,ut.current.y=0,pt=!0),pt&&(nt!==zt.current.col||vt!==zt.current.row)&&an.current(nt,vt)};return document.addEventListener("wheel",Ee,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",Ee,{capture:!0})},[]);let jt=()=>Se("div",{ref:Kt,onMouseEnter:()=>{We(!0),p.current&&(p.current.style.overflowY="hidden")},onMouseLeave:()=>{We(!1),p.current&&(p.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:yn,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(Ee=>Se("button",{type:"button",onClick:()=>Yt(Ee,j),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:Ee===Ct&&j===Be?Se("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:Ee===0?At(hi,{children:[Se("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Se("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Se("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]}):Ee===1?At(hi,{children:[Se("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Se("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Se("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]}):At(hi,{children:[Se("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Se("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Se("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]})}):Se("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${j}-${Ee}`)))}),Zt=r("grid-template-columns")||r("grid-template-rows");return At("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Se("div",{style:a,children:Se("span",{children:L?"Auto layout":"Layout"})}),At("div",{style:{padding:"8px 12px"},children:[At("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:yn,borderRadius:2,padding:2,opacity:qe,transition:"opacity 150ms ease"},children:[Se(Oe,{mode:"block",icon:Se(Ed,{size:16}),active:B==="block"}),Se(Oe,{mode:"flex-col",icon:Se(Cd,{size:16}),active:B==="flex-col"}),Se(Oe,{mode:"flex-row",icon:Se(wd,{size:16}),active:B==="flex-row"}),Se(Oe,{mode:"grid",icon:Se(kd,{size:16}),active:B==="grid"})]}),At("div",{style:{display:"flex",gap:4,marginBottom:8},children:[Se(bi,{label:"W",property:"width",cssValue:F==="fixed"?k:`${Math.round(e.getBoundingClientRect().width)}px`,mode:F,onValueChange:j=>n("width",j),onModeChange:j=>{if(j==="fixed"){let Ee=e.getBoundingClientRect();n("width",`${Math.round(Ee.width)}px`)}else n("width",hr(j,k))},modified:r("width"),dimmed:me&&c!=="width",dropdownOpen:c==="width",onDropdownChange:j=>h(j?"width":null),panelContentRef:p,accentColor:u,onReset:()=>i("width"),minValue:q!=="none"&&q!=="0px"&&q!=="auto"?q:"",maxValue:we!=="none"&&we!=="auto"?we:"",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")}),Se(bi,{label:"H",property:"height",cssValue:K==="fixed"?W:`${Math.round(e.getBoundingClientRect().height)}px`,mode:K,onValueChange:j=>n("height",j),onModeChange:j=>{if(j==="fixed"){let Ee=e.getBoundingClientRect();n("height",`${Math.round(Ee.height)}px`)}else n("height",hr(j,W))},modified:r("height"),dimmed:me&&c!=="height",dropdownOpen:c==="height",onDropdownChange:j=>h(j?"height":null),panelContentRef:p,minValue:le!=="none"&&le!=="0px"&&le!=="auto"?le:"",maxValue:he!=="none"&&he!=="auto"?he:"",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&&At("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8},children:[Se("div",{style:{opacity:me?.3:1,transition:"opacity 150ms ease"},children:jt()}),At("div",{style:{flex:1,opacity:qe,transition:"opacity 150ms ease"},children:[Se("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"}),Se(rn,{dimmed:me,children:At("div",{style:{display:"flex",alignItems:"center"},children:[Se(bo,{value:Ie,onChange:j=>{Le("gap"),n("gap",j)},onPreview:ke("gap",Qe("gap")),onScrubEnd:()=>Le("gap"),onReset:()=>i("gap"),isModified:r("gap"),accentColor:u,defaultUnit:x,children:D==="column"||D==="column-reverse"?Se(wl,{size:12,strokeWidth:r("gap")?2.5:1.5}):Se(Sl,{size:12,strokeWidth:r("gap")?2.5:1.5})}),Se(hn,{property:"gap",value:de.gap||Ie,onChange:j=>n("gap",j),isModified:r("gap")||"gap"in de,style:m(f({},Ft),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:x,onUnitCycle:E})]})})]})]}),C&&At("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:qe,transition:"opacity 150ms ease"},children:[Se(Md,{gridCols:Ce,gridRows:ge,gridModified:Zt,accentColor:u,onColsChange:j=>n("grid-template-columns",`repeat(${j}, 1fr)`),onRowsChange:j=>n("grid-template-rows",`repeat(${j}, 1fr)`)}),At("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[Se(rn,{dimmed:me,children:At("div",{style:{display:"flex",alignItems:"center"},children:[Se(bo,{value:U||Ie,onChange:j=>{Le("column-gap"),n("column-gap",j)},onPreview:ke("column-gap",Qe("column-gap")),onScrubEnd:()=>Le("column-gap"),onReset:()=>i("column-gap"),isModified:r("column-gap"),accentColor:u,defaultUnit:x,children:Se(Sl,{size:12,strokeWidth:r("column-gap")?2.5:1.5})}),Se(hn,{property:"column-gap",value:de["column-gap"]||U||Ie,onChange:j=>n("column-gap",j),isModified:r("column-gap")||"column-gap"in de,placeholder:"col",style:m(f({},Ft),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:x,onUnitCycle:E})]})}),Se(rn,{dimmed:me,children:At("div",{style:{display:"flex",alignItems:"center"},children:[Se(bo,{value:$e||Ie,onChange:j=>{Le("row-gap"),n("row-gap",j)},onPreview:ke("row-gap",Qe("row-gap")),onScrubEnd:()=>Le("row-gap"),onReset:()=>i("row-gap"),isModified:r("row-gap"),accentColor:u,defaultUnit:x,children:Se(wl,{size:12,strokeWidth:r("row-gap")?2.5:1.5})}),Se(hn,{property:"row-gap",value:de["row-gap"]||$e||Ie,onChange:j=>n("row-gap",j),isModified:r("row-gap")||"row-gap"in de,placeholder:"row",style:m(f({},Ft),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:x,onUnitCycle:E})]})})]})]}),L&&At("div",{onMouseEnter:()=>g==null?void 0:g("padding"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:qe,transition:"opacity 150ms ease"},children:[Se(rn,{style:{flex:1},dimmed:me,children:At("div",{style:{display:"flex",alignItems:"center"},children:[Se(bo,{value:Ne.left,onChange:j=>{Le("padding-h"),A(j)},onPreview:ke("padding-h",xe),onScrubEnd:()=>Le("padding-h"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:u,defaultUnit:x,snapSteps:mi,children:Se(vd,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Se(hn,{property:"padding",value:de["padding-h"]||Ne.left,onChange:j=>A(j),isModified:r("padding")||"padding-h"in de,placeholder:"H pad",style:m(f({},Ft),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:x,onUnitCycle:E})]})}),Se(rn,{style:{flex:1},dimmed:me,children:At("div",{style:{display:"flex",alignItems:"center"},children:[Se(bo,{value:Ne.top,onChange:j=>{Le("padding-v"),re(j)},onPreview:ke("padding-v",at),onScrubEnd:()=>Le("padding-v"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:u,defaultUnit:x,snapSteps:mi,children:Se(Sd,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Se(hn,{property:"padding",value:de["padding-v"]||Ne.top,onChange:j=>re(j),isModified:r("padding")||"padding-v"in de,placeholder:"V pad",style:m(f({},Ft),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:x,onUnitCycle:E})]})})]}),At("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:qe,transition:"opacity 150ms ease"},children:[Se("input",{type:"checkbox",checked:fe==="hidden",onChange:j=>n("overflow",j.target.checked?"hidden":"visible"),style:{margin:0,accentColor:u}}),"Clip content"]})]})]})}import{AlignCenter as Td,AlignJustify as Id,AlignLeft as Ld,AlignRight as Rd,Baseline as Ad,ChevronDown as Pd,WholeWord as Bd}from"lucide-react";import{jsx as ct,jsxs as Tn}from"react/jsx-runtime";var Ml={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function Tl({element:e,getValue:t,handleChange:o,isModified:n,onResetProperty:r,isCollapsed:i,onToggle:s,sectionHeaderStyle:l,accentColor:a,colorVariables:c,activeColorDropdown:d,onColorDropdownChange:p,panelContentRef:u,preferredUnit:g,onUnitCycle:x}){var K;let E=t("font-family"),h=t("font-size"),w=t("font-weight"),D=t("line-height"),B=t("letter-spacing"),M=t("text-align"),C=t("color"),L=String(w),k=Ml[L]||L,W=Do(e,C),ee=C.includes("var(")?null:Fo(W,c),Z=({align:q,icon:we})=>{let le=M===q;return ct("button",{type:"button",onClick:()=>o("text-align",q),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:le?Un(a,.15):"transparent",color:le?a:"#64748b",cursor:"pointer"},children:we})},F=((K=E.split(",")[0])==null?void 0:K.trim().replace(/^["']|["']$/g,""))||"System";return Tn("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[ct("div",{style:l,children:ct("span",{children:"Typography"})}),Tn("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[ct(rn,{children:Tn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[ct("input",{type:"text",value:E,onChange:q=>o("font-family",q.target.value),style:m(f({},Ft),{flex:1,minWidth:0,padding:0,fontWeight:n("font-family")?600:400,color:n("font-family")?a:"inherit"}),title:E}),ct(Pd,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),Tn("div",{style:{display:"flex",gap:4},children:[ct(rn,{style:{flex:1},children:ct("select",{value:L,onChange:q=>o("font-weight",q.target.value),style:m(f({},Ft),{padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:n("font-weight")?600:400,color:n("font-weight")?a:"inherit"}),children:Object.entries(Ml).map(([q,we])=>ct("option",{value:q,children:we},q))})}),ct(rn,{style:{flex:1},children:ct("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:ct(hn,{property:"font-size",value:h,onChange:q=>o("font-size",q),isModified:n("font-size"),min:1,max:999,style:m(f({},Ft),{padding:"6px 8px",paddingRight:24,fontWeight:n("font-size")?600:400,color:n("font-size")?a:"inherit"}),unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:g,onUnitCycle:x})})})]}),Tn("div",{style:{display:"flex",gap:4},children:[ct(rn,{style:{flex:1},children:Tn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[ct(Ad,{size:12,style:{color:n("line-height")?a:"#999",flexShrink:0}}),ct(hn,{property:"line-height",value:D,onChange:q=>o("line-height",q),isModified:n("line-height"),step:.1,min:0,placeholder:"Auto",style:m(f({},Ft),{flex:1,minWidth:0,padding:0,fontWeight:n("line-height")?600:400,color:n("line-height")?a:"inherit"}),showUnit:!1})]})}),ct(rn,{style:{flex:1},children:Tn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[ct(Bd,{size:12,style:{color:n("letter-spacing")?a:"#999",flexShrink:0}}),ct(hn,{property:"letter-spacing",value:B,onChange:q=>o("letter-spacing",q),isModified:n("letter-spacing"),step:.1,placeholder:"\u2014",style:m(f({},Ft),{flex:1,minWidth:0,padding:0,fontWeight:n("letter-spacing")?600:400,color:n("letter-spacing")?a:"inherit"}),showUnit:!1})]})})]}),Tn("div",{style:{display:"flex",gap:2,backgroundColor:yn,borderRadius:2,padding:2},children:[ct(Z,{align:"left",icon:ct(Ld,{size:14})}),ct(Z,{align:"center",icon:ct(Td,{size:14})}),ct(Z,{align:"right",icon:ct(Rd,{size:14})}),ct(Z,{align:"justify",icon:ct(Id,{size:14})})]}),Tn("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[ct("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")?a:"#64748b",fontWeight:n("color")?600:400,cursor:n("color")?"pointer":"default",width:40,flexShrink:0},children:"Color"}),ct("div",{style:{flex:1,minWidth:0},children:ct(xi,{value:C,resolvedValue:W,colorVariables:c,matchingVariable:ee,onChange:q=>o("color",q),accentColor:a,modified:n("color"),panelContentRef:u,isDropdownOpen:d==="color",onDropdownChange:q=>p(q?"color":null)})})]})]})]})}import{Fragment as Hd,jsx as ce,jsxs as bt}from"react/jsx-runtime";var Ll=[{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 Nd(e,t){let o=t.trim().toLowerCase();switch(e){case"opacity":return o==="1";case"border-width":return o==="0px"||o==="0"||o==="medium";case"border-radius":return o==="0px"||o==="0";case"border-style":return o==="none";case"box-shadow":return o==="none";case"backdrop-filter":return o==="none"||o==="";case"letter-spacing":return o==="normal"||o==="0px"||o==="0";case"background-color":return o==="rgba(0, 0, 0, 0)"||o==="transparent";default:return!1}}function yi(e,t){return!t||e==="auto"||e==="fit-content"||e==="max-content"||e==="min-content"?"hug":e==="100%"||t==="100%"?"fill":"fixed"}function hr(e,t){switch(e){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let o=Dn(t);if(typeof o.num=="number"&&!isNaN(o.num)){let n=o.unit==="%"?"px":o.unit||"px";return`${o.num}${n}`}return"auto"}}}function vo(e){let t=e.split(/\s+/).filter(Boolean);return t.length===1?{top:t[0],right:t[0],bottom:t[0],left:t[0]}:t.length===2?{top:t[0],right:t[1],bottom:t[0],left:t[1]}:t.length===3?{top:t[0],right:t[1],bottom:t[2],left:t[1]}:t.length>=4?{top:t[0],right:t[1],bottom:t[2],left:t[3]}:{top:"0px",right:"0px",bottom:"0px",left:"0px"}}function El(e,t){return e==="grid"?"grid":e==="flex"||e==="inline-flex"?t==="column"||t==="column-reverse"?"flex-col":"flex-row":"block"}function Cl(e,t){switch(e){case"block":t("display","block");break;case"flex-row":t("display","flex"),t("flex-direction","row");break;case"flex-col":t("display","flex"),t("flex-direction","column");break;case"grid":t("display","grid");break}}var yn="rgba(0, 0, 0, 0.04)",Ft={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 bi({label:e,property:t,cssValue:o,mode:n,onValueChange:r,onModeChange:i,modified:s,dimmed:l,dropdownOpen:a,onDropdownChange:c,panelContentRef:d,accentColor:p="#3b82f6",onReset:u,minValue:g,maxValue:x,onMinChange:E,onMaxChange:h,onMinReset:w,onMaxReset:D,minModified:B,maxModified:M}){let C=Dn(o),L=s?C.unit||yo(t):yo(t),k=!s&&C.unit&&C.unit!==L?fi(C.num,L):C.num,[W,ee]=Nt(!1),[Z,F]=Nt(String(k)),[K,q]=Nt(!1),we=tn(null),le=tn(null),he=tn(null),Ne=tn(!1);fn(()=>{W||F(String(k))},[k,W]),fn(()=>{if(!a)return;let ge=We=>{le.current&&!le.current.contains(We.target)&&he.current&&!he.current.contains(We.target)&&(c==null||c(!1))},ue=We=>{We.key==="Escape"&&(c==null||c(!1))};return document.addEventListener("mousedown",ge),document.addEventListener("keydown",ue),()=>{document.removeEventListener("mousedown",ge),document.removeEventListener("keydown",ue)}},[a,c]),fn(()=>{W&&we.current&&(we.current.focus(),we.current.select())},[W]);let Ie=()=>{let ge=fr(Z,t,o,s);r(ge||`${Math.max(0,parseFloat(Z)||0)}${L}`),ee(!1)},$e=()=>{if(Ne.current){Ne.current=!1;return}Ie()},U=ge=>{if(ge.key==="Enter"){Ie();return}if(ge.key==="Escape"){Ne.current=!0,F(String(k)),ee(!1);return}if(ge.key==="ArrowUp"||ge.key==="ArrowDown"){ge.preventDefault();let ue=ge.key==="ArrowUp"?1:-1,We=ge.shiftKey?8:ge.altKey?.1:1,me=parseFloat(Z)||0,lt=Math.round(Math.max(0,me+ue*We)*1e3)/1e3;F(String(lt)),r(`${lt}${L}`)}},V={fixed:"Fixed",hug:"Hug",fill:"Fill"},te={fixed:ce(Il,{size:12}),hug:ce(Dd,{size:12}),fill:ce(Il,{size:12})},fe=()=>{c==null||c(!a)},Ce=()=>{if(!he.current||!(d!=null&&d.current))return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let ge=he.current.getBoundingClientRect(),ue=d.current.getBoundingClientRect(),We=d.current.closest('[data-devtools="panel"]'),me=We?We.getBoundingClientRect():{top:0,left:0};return{position:"fixed",top:ge.bottom+4-me.top,left:ue.left+4-me.left,width:ue.width-8}};return bt("div",{ref:he,onMouseEnter:()=>q(!0),onMouseLeave:()=>q(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:W?p:K?"rgba(0,0,0,0.15)":"transparent",backgroundColor:yn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:l?.3:1},children:[ce("span",{onClick:s&&u?u:void 0,title:s?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:s?p:"#999",fontWeight:s?600:400,padding:"0 8px",flexShrink:0,cursor:s?"pointer":"default"},children:e}),n==="fixed"?W?ce("input",{ref:we,type:"text",inputMode:"numeric",value:Z,onChange:ge=>F(ge.target.value),onKeyDown:U,onBlur:$e,style:m(f({},Ft),{flex:1,minWidth:0,padding:"4px 2px"})}):ce("span",{onClick:()=>ee(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:k}):ce("span",{style:{flex:1}}),bt("button",{type:"button",onClick:fe,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:[V[n],ce(vi,{size:12})]}),a&&bt("div",{ref:le,style:m(f({},Ce()),{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:[bt("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:[te.fixed,bt("span",{children:["Fixed ",t," (",o,")"]}),n==="fixed"&&ce(yr,{size:14,style:{marginLeft:"auto"}})]}),bt("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:[te.hug,ce("span",{children:"Hug contents"}),n==="hug"&&ce(yr,{size:14,style:{marginLeft:"auto"}})]}),bt("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:[te.fill,ce("span",{children:"Fill container"}),n==="fill"&&ce(yr,{size:14,style:{marginLeft:"auto"}})]}),ce("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),bt("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[bt("div",{style:{display:"flex",alignItems:"center",backgroundColor:yn,borderRadius:2,padding:"4px 8px"},children:[ce("span",{onClick:B?ge=>{ge.stopPropagation(),w==null||w()}:void 0,title:B?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:B?p:"#999",fontWeight:B?600:400,marginRight:8,flexShrink:0,cursor:B?"pointer":"default"},children:"Min"}),ce("input",{type:"text",value:g||"",placeholder:"\u2014",onChange:ge=>E==null?void 0:E(ge.target.value),onClick:ge=>ge.stopPropagation(),style:m(f({},Ft),{flex:1,minWidth:0,padding:0,textAlign:"right",color:B?p:"inherit",fontWeight:B?600:400})})]}),bt("div",{style:{display:"flex",alignItems:"center",backgroundColor:yn,borderRadius:2,padding:"4px 8px"},children:[ce("span",{onClick:M?ge=>{ge.stopPropagation(),D==null||D()}: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"}),ce("input",{type:"text",value:x||"",placeholder:"\u2014",onChange:ge=>h==null?void 0:h(ge.target.value),onClick:ge=>ge.stopPropagation(),style:m(f({},Ft),{flex:1,minWidth:0,padding:0,textAlign:"right",color:M?p:"inherit",fontWeight:M?600:400})})]})]})]})]})}function rn({children:e,style:t,dimmed:o}){let[n,r]=Nt(!1);return ce("div",{onMouseEnter:()=>r(!0),onMouseLeave:()=>r(!1),style:f({position:"relative",borderRadius:2,border:"1px solid",borderColor:n?"rgba(0,0,0,0.15)":"transparent",backgroundColor:yn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:o?.3:1},t),children:e})}function Mn({children:e}){let[t,o]=Nt(!1);return ce("div",{onMouseEnter:()=>o(!0),onMouseLeave:()=>o(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:t?"rgba(0,0,0,0.15)":"transparent",backgroundColor:yn,transition:"border-color 100ms ease"},children:e})}function hn({property:e,value:t,onChange:o,isModified:n=!1,step:r=1,min:i,max:s,style:l,placeholder:a,showUnit:c=!0,unitStyle:d,preferredUnit:p,onUnitCycle:u}){let g=Dn(t),x=yo(e),E=pr[e],w=p&&E&&E.includes(p)?p:x,D=n&&g.unit||w,B=!n&&g.unit&&g.unit!==D?fi(g.num,D):g.num,[M,C]=Nt(!1),[L,k]=Nt(""),W=$e=>{C(!0),k(String(B||"")),requestAnimationFrame(()=>$e.target.select())},ee=()=>{if(C(!1),L.trim()){let $e=fr(L,e,t,n);$e&&o($e)}},Z=$e=>{let U=$e.target.value;k(U);let V=U.trim(),te=V.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),fe=V.match(/^(-?[\d.]+)$/);if(te){let Ce=parseFloat(te[1]);isNaN(Ce)||o(`${Ce}${te[2].toLowerCase()}`)}else if(fe){let Ce=parseFloat(fe[1]);isNaN(Ce)||o(`${Ce}${D}`)}},F=$e=>{if($e.key==="Enter"){if(L.trim()){let U=fr(L,e,t,n);U&&o(U)}$e.target.blur();return}if($e.key==="ArrowUp"||$e.key==="ArrowDown"){$e.preventDefault();let U=$e.shiftKey?10:$e.altKey?.1:1,V=($e.key==="ArrowUp"?1:-1)*r*U,te=parseFloat(L)||B||0,fe=Math.round((te+V)*1e3)/1e3;i!==void 0&&(fe=Math.max(i,fe)),s!==void 0&&(fe=Math.min(s,fe)),k(String(fe)),o(`${fe}${D}`)}},K=/^-?[\d.]/.test(t.trim()),q=M?L:K?String(B):"",le=M&&/\s*(rem|em|px|%)\s*$/i.test(L)?"":D,he=u&&(le==="rem"||le==="px"),Ne={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},Ie=m(f({},d!=null?d:Ne),{pointerEvents:"auto",cursor:"pointer"});return bt(Hd,{children:[ce("input",{type:"text",inputMode:"decimal",value:q,onFocus:W,onBlur:ee,onChange:Z,onKeyDown:F,placeholder:a,style:l}),c&&le&&ce("span",{style:he?Ie:d!=null?d:Ne,onClick:he?u:void 0,title:he?"Click to switch units":void 0,children:le})]})}function xi({value:e,resolvedValue:t,colorVariables:o,matchingVariable:n,onChange:r,accentColor:i="#3b82f6",modified:s,panelContentRef:l,isDropdownOpen:a,onDropdownChange:c}){let[d,p]=Nt(!1),u=!e.includes("var(")&&n?n.usage:e,[g,x]=Nt(u),[E,h]=Nt(!1),[w,D]=Nt(!1),[B,M]=Nt(!1),C=tn(null),L=tn(null),k=tn(null),W=a!==void 0?a:E,ee=c||h,Z=wn(()=>{if(!k.current)return{position:"fixed",top:0,left:0,width:200};let U=k.current.getBoundingClientRect(),V=k.current.closest('[data-devtools="panel"]'),te=V?V.getBoundingClientRect():{top:0,left:0};if(l!=null&&l.current){let fe=l.current.getBoundingClientRect();return{position:"fixed",top:U.bottom+4-te.top,left:fe.left+4-te.left,width:fe.width-8}}return{position:"fixed",top:U.bottom+4-te.top,left:U.left-te.left,width:U.width}},[l]);fn(()=>{if(!d){let U=!e.includes("var(")&&n?n.usage:e;x(U)}},[e,d,n]),fn(()=>{if(!W&&!w)return;let U=te=>{k.current&&!k.current.contains(te.target)&&(ee(!1),D(!1))},V=te=>{te.key==="Escape"&&(ee(!1),D(!1))};return document.addEventListener("mousedown",U),document.addEventListener("keydown",V),()=>{document.removeEventListener("mousedown",U),document.removeEventListener("keydown",V)}},[W,w]),fn(()=>{d&&C.current&&(C.current.focus(),C.current.select())},[d]);let F=br(()=>{if(!g||g.startsWith("#")||g.startsWith("rgb")||g.startsWith("hsl")||g.startsWith("oklch"))return[];let U=g.toLowerCase();return o.filter(V=>V.name.toLowerCase().includes(U)||V.usage.toLowerCase().includes(U)).slice(0,8)},[g,o]),K=()=>{r(g),p(!1),D(!1)},q=U=>{x(U),U.includes("var")||U.includes("--")||U.length>0&&!U.startsWith("#")?D(!0):D(!1)},we=U=>{x(U.usage),r(U.usage),ee(!1),D(!1),p(!1)},le=()=>{setTimeout(()=>{!W&&!w&&K()},150)},he=U=>{U.key==="Enter"?K():U.key==="Escape"&&(x(e),p(!1),D(!1))},Ne=br(()=>{let U=t.trim().toLowerCase();if(U.startsWith("#"))return U.length===4?`#${U[1]}${U[1]}${U[2]}${U[2]}${U[3]}${U[3]}`:U.slice(0,7);let V=U.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(V){let fe=parseInt(V[1],10).toString(16).padStart(2,"0"),Ce=parseInt(V[2],10).toString(16).padStart(2,"0"),ge=parseInt(V[3],10).toString(16).padStart(2,"0");return`#${fe}${Ce}${ge}`}let te=U.match(/oklch\(\s*([\d.]+)/);if(te){let fe=Math.max(0,Math.min(1,parseFloat(te[1]))),Ce=Math.round(fe*255).toString(16).padStart(2,"0");return`#${Ce}${Ce}${Ce}`}return"#000000"},[t]),Ie=U=>{let V=U.target.value;x(V),r(V)},$e=e.includes("var(");return bt("div",{ref:k,onMouseEnter:()=>M(!0),onMouseLeave:()=>M(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:d?i:B?"rgba(0,0,0,0.15)":"transparent",backgroundColor:yn,transition:"border-color 100ms ease",overflow:"hidden"},children:[bt("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[bt("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[ce("input",{type:"color",value:Ne,onChange:Ie,style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),ce("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:t,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),d?ce("input",{ref:C,type:"text",value:g,onChange:U=>q(U.target.value),onKeyDown:he,onBlur:le,style:m(f({},Ft),{flex:1,minWidth:0})}):ce("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&&ce("button",{type:"button",onClick:()=>ee(!W),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:ce(vi,{size:12})})]}),w&&F.length>0&&ce("div",{style:m(f({},Z()),{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:F.map(U=>bt("button",{type:"button",onClick:()=>we(U),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:[ce("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:U.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ce("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:U.name})]},U.name))}),W&&ce("div",{ref:L,style:m(f({},Z()),{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(U=>bt("button",{type:"button",onClick:()=>we(U),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:u===U.usage||e===U.usage?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:u===U.usage||e===U.usage?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[ce("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:U.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ce("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:U.name}),(u===U.usage||e===U.usage)&&ce(yr,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},U.name))})]})}function Rl({element:e,elementInfo:t,selector:o,styleModifications:n,dispatch:r,onClose:i,onHover:s,accentColor:l="#3b82f6"}){var Oe,tt;let a=tn(null),c=tn(null),[d,p]=Nt(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch(A){return!1}});fn(()=>{if(d)return;let A=setTimeout(()=>p(!0),50);return()=>clearTimeout(A)},[d]);let[u,g]=Nt(null),[x,E]=Nt(null),h=u!==null||x!==null,[w,D]=Nt("rem"),B=wn(()=>{D(A=>A==="rem"?"px":"rem")},[]),M=tn(new Map),[C,L]=Nt(""),k=br(()=>Qr(),[]);fn(()=>{let A=re=>{var Ae;if(re.key!=="Escape")return;let de=document.activeElement;de&&((Ae=a.current)!=null&&Ae.contains(de))||i()};return window.addEventListener("keydown",A),()=>window.removeEventListener("keydown",A)},[i]);let W=tn({top:0,left:0,maxHeight:400}),[,ee]=Nt(0),Z="devtools-panel-position",F=tn({x:0,y:0}),K=tn(null),q=tn(!1);fn(()=>{try{let A=localStorage.getItem(Z);if(A){let re=JSON.parse(A);typeof re.top=="number"&&typeof re.left=="number"&&(q.current=!0,W.current=m(f({},W.current),{top:re.top,left:re.left}))}}catch(A){}},[]),fn(()=>{let A=de=>{let Ae=K.current;if(!Ae)return;let ke=Ae.startOffsetX+(de.clientX-Ae.startX),Le=Ae.startOffsetY+(de.clientY-Ae.startY),xe=280,at=16,Qe=Math.max(at,Math.min(window.innerWidth-xe-at,W.current.left+ke)),gt=Math.max(at,W.current.top+Le);F.current={x:Qe-W.current.left,y:gt-W.current.top};let rt=a.current,dt=rt==null?void 0:rt.parentElement;if(!dt)return;dt.style.top=`${gt}px`,dt.style.left=`${Qe}px`;let mt=document.getElementById("devtools-toolbar"),Ct=mt==null?void 0:mt.getBoundingClientRect(),Be=window.innerHeight-16;Ct&&Qe+xe>Ct.left&&(Be=Ct.top-8);let Kt=Math.max(0,gt),ut=Math.max(200,Be-Kt);rt&&(rt.style.maxHeight=`${ut}px`)},re=()=>{if(!K.current)return;let de=W.current.top+F.current.y,Ae=W.current.left+F.current.x;W.current=m(f({},W.current),{top:de,left:Ae}),F.current={x:0,y:0},q.current=!0;try{localStorage.setItem(Z,JSON.stringify({top:de,left:Ae}))}catch(ke){}K.current=null};return window.addEventListener("mousemove",A),window.addEventListener("mouseup",re),()=>{window.removeEventListener("mousemove",A),window.removeEventListener("mouseup",re)}},[]);let we=wn(A=>{A.button!==0||A.target.closest("button")||(A.preventDefault(),K.current={startX:A.clientX,startY:A.clientY,startOffsetX:F.current.x,startOffsetY:F.current.y})},[]);fn(()=>{F.current={x:0,y:0};let A=(Ae=!1)=>{let ke=a.current,Le=280,xe=8,at,Qe;if(q.current)at=W.current.top,Qe=W.current.left;else{let Be=e.getBoundingClientRect();Qe=Be.right+xe,at=Be.top,Qe+Le>window.innerWidth-xe&&(Qe=Be.left-Le-xe),Qe<xe&&(Qe=Math.max(xe,(window.innerWidth-Le)/2))}let gt=document.getElementById("devtools-toolbar"),rt=gt==null?void 0:gt.getBoundingClientRect(),dt=window.innerHeight-16;rt&&Qe+Le>rt.left&&(dt=rt.top-xe);let mt=Math.max(0,at),Ct=Math.max(200,dt-mt);if(W.current={top:at,left:Qe,maxHeight:Ct},Ae&&ke){let Be=ke.parentElement;Be&&!q.current&&(Be.style.top=`${at+F.current.y}px`,Be.style.left=`${Qe+F.current.x}px`),ke.style.maxHeight=`${Ct}px`}else ee(Be=>Be+1)};A(!1);let re=()=>A(!0),de=()=>A(!1);return window.addEventListener("scroll",re,{passive:!0}),window.addEventListener("resize",de,{passive:!0}),()=>{window.removeEventListener("scroll",re),window.removeEventListener("resize",de)}},[e]),fn(()=>{let A=a.current;if(!A)return;let re=de=>{let Ae=c.current;if(!Ae){de.preventDefault();return}let{scrollTop:ke,scrollHeight:Le,clientHeight:xe}=Ae,at=ke<=0&&de.deltaY<0,Qe=ke+xe>=Le&&de.deltaY>0;(at||Qe)&&de.preventDefault()};return A.addEventListener("wheel",re,{passive:!1}),()=>A.removeEventListener("wheel",re)},[]);let le=br(()=>n.find(A=>A.selector===o),[n,o]),he=wn(A=>{let re=le==null?void 0:le.changes.find(de=>de.property===A);if(re)return re.modified;if(A.includes("color")){let de=Jr(e,A);if(de&&de.includes("var("))return de}return Po(e,A)},[e,le]),Ne=wn(A=>{if(M.current.has(A))return M.current.get(A);let re=le==null?void 0:le.changes.find(Ae=>Ae.property===A);if(re)return re.original;let de=Po(e,A);return M.current.set(A,de),de},[e,le]),Ie=wn((A,re)=>{let de=Ne(A);ze(e,A,re),A==="backdrop-filter"&&ze(e,"-webkit-backdrop-filter",re),r({type:"MODIFY_STYLE",payload:{selector:o,element:t,property:A,original:de,modified:re}})},[e,o,t,r,Ne]),$e=wn(()=>{qr(o,n);let A=n.find(re=>re.selector===o);if(A)for(let re of A.changes)r({type:"CLEAR_STYLE",payload:{selector:o,property:re.property}});M.current.clear()},[o,n,r]),U=wn(A=>{let re=n.find(Ae=>Ae.selector===o);re!=null&&re.changes.find(Ae=>Ae.property===A)&&e instanceof HTMLElement&&(e.style.removeProperty(A),r({type:"CLEAR_STYLE",payload:{selector:o,property:A}}),M.current.delete(A))},[e,o,n,r]),V=wn(()=>{let A=C.split(";").map(re=>re.trim()).filter(re=>re);for(let re of A){let de=re.indexOf(":");if(de>0){let Ae=re.slice(0,de).trim(),ke=re.slice(de+1).trim();Ae&&ke&&Ie(Ae,ke)}}L("")},[C,Ie]),te=wn(A=>{var re;return(re=le==null?void 0:le.changes.some(de=>de.property===A))!=null?re:!1},[le]),fe=A=>{var Le;let re=he(A.property),de=te(A.property),Ae=!de&&Nd(A.property,re),ke={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};if(Ae&&A.type!=="backdrop-filter")return ce(Mn,{modified:!1,children:ce("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:xe=>Ie(A.property,xe.target.value),style:m(f({},ke),{color:"#999"})})});switch(A.type){case"color":{let xe=Do(e,re),at=re.includes("var(")?null:Fo(xe,k);return ce(xi,{value:re,resolvedValue:xe,colorVariables:k,matchingVariable:at,onChange:Qe=>Ie(A.property,Qe),accentColor:l,modified:de,panelContentRef:c,isDropdownOpen:x===A.property,onDropdownChange:Qe=>E(Qe?A.property:null)})}case"number":{if(!!pr[A.property])return ce(Mn,{modified:de,children:ce(hn,{property:A.property,value:re,onChange:Qe=>Ie(A.property,Qe),isModified:de,min:A.min,max:A.max,step:A.step||1,style:m(f({},ke),{paddingRight:32}),unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:w,onUnitCycle:B})});let{num:at}=Dn(re);return ce(Mn,{modified:de,children:ce("input",{type:"number",value:at,min:A.min,max:A.max,step:A.step||1,onChange:Qe=>Ie(A.property,Qe.target.value),style:ke})})}case"select":return ce(Mn,{modified:de,children:bt("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[ce("select",{value:re,onChange:xe=>Ie(A.property,xe.target.value),style:m(f({},ke),{cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"}),children:(Le=A.options)==null?void 0:Le.map(xe=>ce("option",{value:xe,children:xe},xe))}),ce("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:ce(vi,{size:12})})]})});case"spacing":return ce(Mn,{modified:de,children:ce("input",{type:"text",value:re,onChange:xe=>Ie(A.property,xe.target.value),placeholder:"e.g., 10px or 10px 20px",style:ke})});case"backdrop-filter":return ce(xl,{value:re,onChange:xe=>Ie(A.property,xe),accentColor:l,modified:de,panelContentRef:c});default:return ce(Mn,{modified:de,children:ce("input",{type:"text",value:re,onChange:xe=>Ie(A.property,xe.target.value),style:ke})})}},Ce=(Oe=le==null?void 0:le.changes.length)!=null?Oe:0,ge=(tt=le==null?void 0:le.captured)!=null?tt:!1,ue=m(f({position:"fixed",top:W.current.top,left:W.current.left,width:280,maxHeight:W.current.maxHeight,backgroundColor:"rgba(255, 255, 255, 0.85)",backdropFilter:"blur(32px)",WebkitBackdropFilter:"blur(32px)"},mn),{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"}),We={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:K.current?"grabbing":"grab"},me={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"12px 12px 6px",userSelect:"none",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontWeight:600,color:"#475569"},lt={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},qe={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return ce("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:W.current.top+F.current.y,left:W.current.left+F.current.x,zIndex:1e4,pointerEvents:"none"},children:bt("div",{ref:a,"data-devtools":"panel",style:m(f({},ue),{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:[bt("div",{style:We,onMouseDown:we,children:[bt("div",{style:{display:"flex",alignItems:"center",gap:8,overflow:"hidden"},children:[ce("span",{style:{fontWeight:600,fontSize:11,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:t.tagName}),Ce>0&&ce("span",{style:{backgroundColor:ge?"#999999":l,color:"#fff",fontSize:9,padding:"1px 4px",borderRadius:2},children:Ce})]}),bt("div",{style:{display:"flex",gap:4},children:[Ce>0&&ce("button",{type:"button",onClick:$e,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:ce(Od,{size:14})}),ce("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:ce(Fd,{size:14})})]})]}),bt("div",{ref:c,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[ce("div",{style:{opacity:x?.3:1,transition:"opacity 150ms ease"},children:ce(kl,{element:e,getValue:he,getOriginalValue:Ne,handleChange:Ie,isModified:te,onResetProperty:U,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:me,activeDropdown:u,onDropdownChange:g,panelContentRef:c,accentColor:l,onFieldHover:s,preferredUnit:w,onUnitCycle:B})}),ce("div",{style:{opacity:u?.3:1,transition:"opacity 150ms ease"},children:ce(Tl,{element:e,getValue:he,handleChange:Ie,isModified:te,onResetProperty:U,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:me,accentColor:l,colorVariables:k,activeColorDropdown:x,onColorDropdownChange:E,panelContentRef:c,preferredUnit:w,onUnitCycle:B})}),Ll.map((A,re)=>{let de=re===Ll.length-1,Ae=x&&A.properties.some(Le=>Le.property===x);return bt("div",{style:{borderBottom:de?"none":"1px solid rgba(0,0,0,0.08)",opacity:h&&!Ae?.3:1,transition:"opacity 150ms ease"},children:[ce("div",{style:me,children:ce("span",{children:A.name})}),ce("div",{style:{padding:"4px 0"},children:A.properties.map(Le=>{let xe=te(Le.property),at=Ae&&Le.property!==x;return bt("div",{style:m(f({},lt),{opacity:at?.3:1,transition:"opacity 150ms ease"}),children:[ce("span",{onClick:xe?()=>U(Le.property):void 0,title:xe?"Click to reset":void 0,style:m(f({},qe),{color:xe?l:"#64748b",fontWeight:xe?600:400,cursor:xe?"pointer":"default"}),children:Le.label}),ce("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:fe(Le)})]},Le.property)})})]},A.name)}),bt("div",{style:{opacity:h?.3:1,transition:"opacity 150ms ease"},children:[ce("div",{style:me,children:ce("span",{children:"Raw CSS"})}),bt("div",{style:{padding:"8px 12px"},children:[ce("textarea",{value:C,onChange:A=>L(A.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"}}),C.trim()&&ce("button",{type:"button",onClick:V,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:l,color:"#fff",cursor:"pointer",opacity:C.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as zd,useLayoutEffect as _d,useState as $d}from"react";import{Fragment as Gd,jsx as Kn,jsxs as jd}from"react/jsx-runtime";var Si=["flex-start","center","flex-end"],wi=["flex-start","center","flex-end"];function Wd(e){return e==="normal"||e==="flex-start"||e==="start"?"flex-start":e==="flex-end"||e==="end"?"flex-end":e==="center"?"center":null}function Yd(e){return e==="normal"||e==="stretch"||e==="flex-start"||e==="start"?"flex-start":e==="flex-end"||e==="end"?"flex-end":e==="center"?"center":null}function Al(e){let t=Array.from(e.children);if(t.length===0)return null;let o=1/0,n=1/0,r=-1/0,i=-1/0;for(let s of t){let l=s.getBoundingClientRect();l.width===0&&l.height===0||(l.top<o&&(o=l.top),l.left<n&&(n=l.left),l.bottom>r&&(r=l.bottom),l.right>i&&(i=l.right))}return o===1/0?null:new DOMRect(n,o,i-n,r-o)}function Pl({element:e,modifier:t,accentColor:o,refreshKey:n=0}){let[r,i]=$d(null);if(zd(()=>{if(!e){i(null);return}let E=()=>i(Al(e));return E(),window.addEventListener("scroll",E,{passive:!0}),window.addEventListener("resize",E,{passive:!0}),()=>{window.removeEventListener("scroll",E),window.removeEventListener("resize",E)}},[e]),_d(()=>{e&&i(Al(e))},[e,n]),!r)return null;let s=r,l=window.getComputedStyle(e),a=l.display;if(a!=="flex"&&a!=="inline-flex")return null;let c=l.flexDirection,d=c==="column"||c==="column-reverse"?"vertical":"horizontal",p=d==="horizontal"?"vertical":"horizontal",u=[];if(t==="shift"){let E=Wd(l.justifyContent);if(E){let h=Si.indexOf(E);d==="horizontal"?(h>0&&u.push("left"),h<Si.length-1&&u.push("right")):(h>0&&u.push("up"),h<Si.length-1&&u.push("down"))}}else{let E=Yd(l.alignItems);if(E){let h=wi.indexOf(E);p==="horizontal"?(h>0&&u.push("left"),h<wi.length-1&&u.push("right")):(h>0&&u.push("up"),h<wi.length-1&&u.push("down"))}}if(u.length===0)return null;let g=14,x=7;return Kn(Gd,{children:u.map(E=>{let h,w;switch(E){case"right":h=s.right+g,w=s.top+s.height/2;break;case"left":h=s.left-g,w=s.top+s.height/2;break;case"down":h=s.left+s.width/2,w=s.bottom+g;break;case"up":h=s.left+s.width/2,w=s.top-g;break}let D=E==="right"?0:E==="left"?180:E==="down"?90:-90,B={position:"fixed",left:h-x,top:w-x,width:x*2,height:x*2,pointerEvents:"none",zIndex:9997};return Kn("div",{"data-devtools":"swipe-hint",style:B,children:Kn("svg",{width:x*2,height:x*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:jd("g",{transform:`rotate(${D})`,children:[Kn("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),Kn("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),Kn("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:o,strokeWidth:"1.5",strokeLinecap:"round"}),Kn("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:o,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},E)})})}import{useEffect as Vd,useLayoutEffect as Ud,useState as Jd}from"react";import{jsx as ki,jsxs as Ei}from"react/jsx-runtime";function Xd(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function Bl({element:e,fontSize:t,lineHeight:o,accentColor:n,hoveredProperty:r,draggingProperty:i,cursorViewport:s}){let[l,a]=Jd(null);if(Vd(()=>{if(!e){a(null);return}let w=()=>{a(po(e))};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[e]),Ud(()=>{e&&a(po(e))},[e,t,o]),!l)return null;let c=l.width,d=l.height,p=Xd(n,.2),u=i!=null?i:r,g=8,x=2,E={position:"fixed",top:l.top,left:l.left,width:c,height:d,pointerEvents:"none",zIndex:9996,overflow:"visible"},h=w=>w==="font-size"?`${Math.round(t)}`:(t>0?o/t:1.2).toFixed(2).replace(/\.?0+$/,"");return Ei("div",{"data-devtools":"text-handles",style:E,children:[Ei("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${d}`,children:[ki("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)&&ki("rect",{x:c-x/2,y:d/2-g/2,width:x,height:g,fill:n,stroke:"#ffffff",strokeWidth:u==="font-size"?4:2,paintOrder:"stroke"}),(u==="line-height"||!u)&&ki("rect",{x:c/2-g/2,y:d-x/2,width:g,height:x,fill:n,stroke:"#ffffff",strokeWidth:u==="line-height"?4:2,paintOrder:"stroke"})]}),s&&u&&(()=>{let w=u==="font-size"?"Aa":"Lh",D=h(u);return Ei("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:[w," ",D]})})()]})}import{Fragment as wo,jsx as ot,jsxs as So}from"react/jsx-runtime";var Ol=8,Mi=[0,1,2,4,8,12,16,20,24,28,32],Ti="devtools-active-text";function Dl(e,t,o=0){let n=e.left+window.scrollX+4,r=t==="top-left"?e.top+window.scrollY-Vn-o*Vn+4:e.bottom+window.scrollY+4-1+o*Vn,i=window.scrollY+4,s=window.scrollY+window.innerHeight-Vn-4;return r<i?r=e.top+window.scrollY+4:r>s&&(r=Math.max(e.top+window.scrollY+4,s)),{x:n,y:r}}function Fl({state:e,dispatch:t,onScreenshot:o,inFlightAnnotationIds:n,inFlightStyleSelectors:r,inFlightSelectorColors:i,onAttachImages:s,onReply:l,onViewThread:a,onCloseThread:c,onModelComponentsAdd:d,onModelComponentFocus:p,onModelComponentHover:u,modelComponentNames:g,modelPanelHoveredComponent:x,modelSpacingTokenHover:E,highlightedAnnotationIds:h}){var os,rs,is,ss,ls,as,cs,ds,us;let{canvasRef:w,redrawAll:D,resizeCanvas:B}=Hs(),M=kt(!1);_t(()=>{let b=w.current;if(!b)return;let v=()=>{M.current&&(M.current=!1,b.style.pointerEvents="")},X=I=>{I.button===0&&M.current&&v()};return window.addEventListener("mousedown",X),()=>window.removeEventListener("mousedown",X)},[w]);let[C,L]=st(!1),[k,W]=st(()=>{if(typeof window=="undefined")return null;try{let b=localStorage.getItem(Ti);return b?JSON.parse(b):null}catch(b){return null}}),[ee,Z]=st(null),[F,K]=st(null),[q,we]=st(null),le=kt(null),he=kt(null),Ne=kt({x:0,y:0}),Ie=kt([]),$e=kt(0),[U,V]=st(null),[te,fe]=st(new Map),Ce=kt(0),ge=kt(null),[ue,We]=st(null),[me,lt]=st(null),qe=kt({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}),[Oe,tt]=st(null),[A,re]=st(null),[de,Ae]=st(null),[ke,Le]=st(null),xe=kt({x:0,y:0}),[at,Qe]=st({x:0,y:0}),gt=kt({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}),[rt,dt]=st(null),[mt,Ct]=st(null),[Be,Kt]=st(null),[ut,zt]=st(!1),[Yt,an]=st(0),[jt,Zt]=st(null),Gt=kt({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,Ee]=st(null),[He,qt]=st(null),[nt,vt]=st(null),pt=kt({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[ht,An]=st(null),[Vt,cn]=st(null),[N,Q]=st(null),pe=zs(),Re=kt(i);Re.current=i;let Te=Pt(b=>{let v=Re.current;if(!v||v.size===0)return!1;for(let X of v.keys())try{if(b.matches(X))return!0}catch(I){}return!1},[]),S=kt(e);S.current=e;let J=kt(k);J.current=k;let oe=kt([]),Pe=kt(o);Pe.current=o;let[ye,et]=st(null),je=e.selectedAnnotationIds;oe.current=je;let Me=Pt((b,v=!1)=>{t({type:"SELECT_ANNOTATION",payload:{id:b,addToSelection:v}})},[t]),Ye=Pt(()=>{t({type:"SELECT_ANNOTATION",payload:{id:null}})},[t]),[Ke,Lt]=st(null),[St,Er]=st({x:window.scrollX,y:window.scrollY});_t(()=>(B(),window.addEventListener("resize",B),()=>window.removeEventListener("resize",B)),[B]),_t(()=>{let b=()=>{Er({x:window.scrollX,y:window.scrollY})};return window.addEventListener("scroll",b,{passive:!0}),()=>window.removeEventListener("scroll",b)},[]),_t(()=>{k?localStorage.setItem(Ti,JSON.stringify(k)):localStorage.removeItem(Ti)},[k]),_s(k,W,ee,e.annotations,t);let Nn=kt(U);Nn.current=U,_t(()=>{if(e.activeTool!=="model"||!e.isAnnotating)return;let b=v=>{if(!v.altKey||!Nn.current)return;v.preventDefault();let X=v.deltaY>0?-1:1;Ce.current=Math.max(0,Ce.current+X);let I=ge.current;if(I){let P=nr(I,Ce.current);V(P)}};return window.addEventListener("wheel",b,{passive:!1}),()=>window.removeEventListener("wheel",b)},[e.activeTool,e.isAnnotating]),_t(()=>{e.activeTool!=="model"&&(V(null),fe(new Map),Ce.current=0,ge.current=null)},[e.activeTool]),_t(()=>{var X;let b=(X=U==null?void 0:U.name)!=null?X:null,v=b&&(g!=null&&g.has(b))?b:null;u==null||u(v)},[U,g,u]);let[Lo,jo]=st(null);_t(()=>{var X;if(!x){jo(null);return}let b=ao(x.name),v=x.instanceIndex;jo((X=b[v%b.length])!=null?X:null)},[x]);let[dn,Cr]=st([]);_t(()=>{var b,v;if(!E){Cr([]);return}(v=(b=E.token)==null?void 0:b.bindings)!=null&&v.length?Cr(Vr(E.token)):Cr(jr(E.px))},[E]);let ia=kt(null),sa=kt(null);ia.current=rt,sa.current=mt,_t(()=>{let b=["flex-start","center","flex-end"],v=["flex-start","center","flex-end"],I=null,P=!1,H=null,ie=null,z=(ae,ve)=>{let Ve=Wn(ae,ve);for(;Ve&&Ve!==document.documentElement;){let it=window.getComputedStyle(Ve).display;if(it==="flex"||it==="inline-flex")return Ve;Ve=Ve.parentElement}return null},Y=ae=>{let ve=window.getComputedStyle(ae).flexDirection;return ve==="column"||ve==="column-reverse"?"vertical":"horizontal"},y=ae=>{let ve=ae.getAttribute("data-pm");return ve||(ve=Math.random().toString(36).substring(2,8),ae.setAttribute("data-pm",ve)),{selector:`[data-pm="${ve}"]`,durableSelector:nn(ae)}},T=()=>{P=!0,I&&clearTimeout(I),I=setTimeout(()=>{P=!1,I=null},300)},G=(ae,ve,Ue)=>{let Ve=Y(ae);if(ve===Ve){let De=window.getComputedStyle(ae).justifyContent,yt=De==="normal"||De==="flex-start"||De==="start"?"flex-start":De==="flex-end"||De==="end"?"flex-end":De==="center"?"center":null;if(!yt)return;let Rt=b.indexOf(yt)+Ue;if(Rt<0||Rt>=b.length)return;let En=b[Rt],{selector:zn,durableSelector:Tr}=y(ae);ze(ae,"justify-content",En),t({type:"MODIFY_STYLES_BATCH",payload:{selector:zn,durableSelector:Tr,element:Jt(ae),changes:[{property:"justify-content",original:De,modified:En}]}})}else{let De=window.getComputedStyle(ae).flexDirection,yt=Ve==="horizontal"?"column":"row",{selector:gn,durableSelector:Rt}=y(ae);ze(ae,"flex-direction",yt),t({type:"MODIFY_STYLES_BATCH",payload:{selector:gn,durableSelector:Rt,element:Jt(ae),changes:[{property:"flex-direction",original:De,modified:yt}]}})}an(it=>it+1)},R=(ae,ve,Ue)=>{let it=Y(ae)==="horizontal"?"vertical":"horizontal";if(ve!==it)return;let yt=window.getComputedStyle(ae).alignItems,gn=yt==="normal"||yt==="stretch"||yt==="flex-start"||yt==="start"?"flex-start":yt==="flex-end"||yt==="end"?"flex-end":yt==="center"?"center":null;if(!gn)return;let En=v.indexOf(gn)+Ue;if(En<0||En>=v.length)return;let zn=v[En],{selector:Tr,durableSelector:ha}=y(ae);ze(ae,"align-items",zn),t({type:"MODIFY_STYLES_BATCH",payload:{selector:Tr,durableSelector:ha,element:Jt(ae),changes:[{property:"align-items",original:yt,modified:zn}]}}),an(ya=>ya+1)},O=20,_=null,$=null,se=0,be=(ae,ve,Ue)=>{let Ve=z(ve,Ue);Zt(Ve?{modifier:ae,target:Ve}:null)},Ze=ae=>{if(!(e.activeTool!=="hand"||!e.isAnnotating)){if(ae.key==="Shift"&&!ae.altKey){let ve=xe.current;be("shift",ve.x,ve.y)}else if(ae.key==="Alt"&&!ae.shiftKey){let ve=xe.current;be("alt",ve.x,ve.y)}}},Ge=ae=>{if(e.activeTool!=="hand"||!e.isAnnotating)return;let ve=ae.shiftKey&&!ae.altKey,Ue=ae.altKey&&!ae.shiftKey;if(!ve&&!Ue||ae.buttons!==0){_=null,$=null,se=0,H=null,ie=null,Zt(null);return}if(H===null&&(H=ae.clientX,ie=ae.clientY,be(ve?"shift":"alt",ae.clientX,ae.clientY)),P)return;_===null&&(_=ae.clientX,$=ae.clientY,se=0);let Ve=ae.clientX-_,it=ae.clientY-$,De=Math.abs(Ve)>=Math.abs(it)?Ve:it;if(Math.abs(De)>3){let zn=De>0?1:-1;if(se!==0&&zn!==se){_=ae.clientX,$=ae.clientY,se=0;return}se=zn}if(Math.abs(Ve)<O&&Math.abs(it)<O)return;let yt=z(H,ie);if(!yt)return;let gn=Math.abs(Ve)>=Math.abs(it)?"horizontal":"vertical",En=(gn==="horizontal"?Ve:it)>0?1:-1;_=null,$=null,se=0,ve?G(yt,gn,En):R(yt,gn,En),T()},Mt=ae=>{(ae.key==="Shift"||ae.key==="Alt")&&(H=null,ie=null,_=null,$=null,se=0,Zt(null))},ft=()=>{Zt(null),_=null,$=null,se=0};return window.addEventListener("keydown",Ze),window.addEventListener("mousemove",Ge),window.addEventListener("mousedown",ft),window.addEventListener("keyup",Mt),()=>{window.removeEventListener("keydown",Ze),window.removeEventListener("mousemove",Ge),window.removeEventListener("mousedown",ft),window.removeEventListener("keyup",Mt),I&&clearTimeout(I)}},[e.activeTool,e.isAnnotating,t]),_t(()=>{let b=v=>{var P,H,ie,z;if(v.key==="Escape"){if(J.current)return;if(e.activeTool==="model"&&te.size>0){v.preventDefault(),fe(new Map);return}if(oe.current.length>0){v.preventDefault(),Ye();return}}if(v.key==="Enter"&&e.activeTool==="model"&&te.size>0&&d){v.preventDefault();let Y=[...te.keys()].filter(y=>!(g!=null&&g.has(y)));Y.length>0&&d(Y),fe(new Map);return}if((v.metaKey||v.ctrlKey)&&v.key==="v"&&Ie.current.length>0&&!J.current){v.preventDefault(),$e.current++;let Y=$e.current*20,T=((P=Ie.current[0])==null?void 0:P.groupId)?Math.random().toString(36).substring(2,9):void 0,G=Ie.current.map(O=>m(f({},O),{id:Math.random().toString(36).substring(2,9),groupId:O.groupId?T:void 0,timestamp:Date.now(),points:O.points.map(_=>({x:_.x+Y,y:_.y+Y}))}));t({type:"PASTE_ANNOTATIONS",payload:{annotations:G}});let R=G.find(O=>O.type!=="text")||G[0];R&&Me(R.id);return}let X=oe.current;if(X.length===0||J.current)return;let I=(H=v.target)==null?void 0:H.tagName;if(!(I==="INPUT"||I==="TEXTAREA"||(ie=v.target)!=null&&ie.isContentEditable)&&(v.key==="Delete"||v.key==="Backspace")){if(v.preventDefault(),c){let Y=S.current.annotations;for(let y of X){let T=Y.find(R=>R.id===y);if(!T)continue;let G=T.threadId||T.groupId&&((z=Y.find(R=>R.groupId===T.groupId&&R.threadId))==null?void 0:z.threadId);G&&c(G)}}for(let Y of X)t({type:"DELETE_ANNOTATION",payload:{id:Y}});Ye()}};return window.addEventListener("keydown",b),()=>window.removeEventListener("keydown",b)},[t,Ye,Me,e.activeTool,te,g,d,c]);let Pn=Ci(()=>dr(e.annotations),[e.annotations]),Go=Ci(()=>{let b=new Map,v=new Set,X=1;for(let I of e.annotations)if(!Pn.has(I))if(I.groupId){if(!v.has(I.groupId)){v.add(I.groupId);let P=e.annotations.filter(H=>H.groupId===I.groupId);for(let H of P)b.set(H.id,X);X++}}else b.set(I.id,X),X++;return b},[e.annotations,Pn]),Ki=Ci(()=>{if(je.length===0)return null;let b=new Map;for(let v of je){let X=e.annotations.find(P=>P.id===v);if(!X)continue;let I=X.groupId?e.annotations.filter(P=>P.groupId===X.groupId):[X];for(let P of I)if(P.linkedSelector&&!(i!=null&&i.has(P.linkedSelector))){let H=P.color||e.activeColor;b.set(P.linkedSelector,H)}}return b.size>0?b:null},[je,e.annotations,e.activeColor,i]);_t(()=>{let b=e.annotations.filter(v=>!(Pn.has(v)||k&&!k.isNew&&v.id===k.id));D(b,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,je,Ol,St.x,St.y,Go,h)},[e.annotations,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,D,k,je,St,Go,Pn,h]),_t(()=>{if(F){let b=Math.random().toString(36).substring(2,9);W({id:b,point:F.point,text:"",fontSize:12,isNew:!0,groupId:F.groupId}),K(null)}},[F]),_t(()=>{q&&(W({id:Math.random().toString(36).substring(2,9),point:q.point,text:"",fontSize:12,isNew:!0,linkedSelector:q.linkedSelector,linkedAnchor:q.linkedAnchor,elements:q.elements}),we(null))},[q]);let Vo=kt(null),Uo=(os=k==null?void 0:k.id)!=null?os:null;_t(()=>{Uo&&le.current?requestAnimationFrame(()=>{var X;let b=le.current;if(!b||(b.focus(),he.current===Uo))return;he.current=Uo;let v=J.current;if(v){if(Vo.current!==null){let I=Math.min(Vo.current,b.value.length);b.setSelectionRange(I,I);return}if(!v.isNew&&v.clickPoint){let I=w.current;if(!I)return;let P=I.getContext("2d");if(!P)return;P.font=`${v.fontSize}px ${Dt}`;let H=v.fontSize*1.4,ie=v.text.split(`
-`),z=v.clickPoint.y-v.point.y,Y=Math.max(0,Math.min(ie.length-1,Math.floor(z/H))),y=v.clickPoint.x-v.point.x,T=ie[Y]||"",G=0;for(let O=0;O<=T.length;O++){let _=P.measureText(T.substring(0,O)).width;if(_>y){let $=O>0?P.measureText(T.substring(0,O-1)).width:0;G=y-$<_-y?O-1:O;break}G=O}let R=G;for(let O=0;O<Y;O++)R+=(((X=ie[O])==null?void 0:X.length)||0)+1;b.setSelectionRange(R,R)}}}):(he.current=null,Vo.current=null)},[Uo,w]);let eo=Pt(b=>{let v=w.current;if(!v)return{x:0,y:0};let X=v.getBoundingClientRect(),I,P;if("touches"in b&&b.touches[0])I=b.touches[0].clientX,P=b.touches[0].clientY;else if("clientX"in b)I=b.clientX,P=b.clientY;else return{x:0,y:0};return{x:I-X.left+window.scrollX,y:P-X.top+window.scrollY}},[w]),Hn=Pt((b,v,X,I)=>{let P=X.x-v.x,H=X.y-v.y,ie=P*P+H*H;if(ie===0)return Math.sqrt((b.x-v.x)**2+(b.y-v.y)**2)<=I;let z=Math.max(0,Math.min(1,((b.x-v.x)*P+(b.y-v.y)*H)/ie)),Y=v.x+z*P,y=v.y+z*H;return Math.sqrt((b.x-Y)**2+(b.y-y)**2)<=I},[]),Jo=Pt(b=>{for(let X=e.annotations.length-1;X>=0;X--){let I=e.annotations[X];if(!I||Pn.has(I))continue;let P=(I.strokeWidth||3)+4;switch(I.type){case"text":{if(!I.points[0]||!I.text)continue;let H=I.points[0],ie=I.fontSize||12,z=w.current;if(z){let Y=z.getContext("2d");if(Y){Y.font=`${ie}px ${Dt}`;let y=I.text.split(`
-`),T=H.x-St.x,G=so(T),R=G!==void 0?Math.min(400,G):void 0,O=R?$n(Y,y,R):y,_=R?Math.min(R,Math.max(...O.map(Ze=>Y.measureText(Ze).width))):Math.max(...y.map(Ze=>Y.measureText(Ze).width)),$=O.length*(ie*1.4),se=y.length*(ie*1.4),be=$-se;if(b.x>=H.x-4-4&&b.x<=H.x+_+4+4&&b.y>=H.y-4-4-be&&b.y<=H.y+se+4+4)return I}}break}case"rectangle":{if(I.points.length<2)continue;let H=I.points[0],ie=I.points[I.points.length-1],z=Math.min(H.x,ie.x),Y=Math.max(H.x,ie.x),y=Math.min(H.y,ie.y),T=Math.max(H.y,ie.y),G=Hn(b,{x:z,y},{x:Y,y},P),R=Hn(b,{x:z,y:T},{x:Y,y:T},P),O=Hn(b,{x:z,y},{x:z,y:T},P),_=Hn(b,{x:Y,y},{x:Y,y:T},P);if(G||R||O||_)return I;break}case"circle":{if(I.points.length<2)continue;let H=I.points[0],ie=I.points[I.points.length-1],z=(H.x+ie.x)/2,Y=(H.y+ie.y)/2,y=Math.abs(ie.x-H.x)/2,T=Math.abs(ie.y-H.y)/2,G=b.x-z,R=b.y-Y,O=Math.sqrt((G/y)**2+(R/T)**2);if(Math.abs(O-1)*Math.max(y,T)<=P)return I;break}case"line":{if(I.points.length<2)continue;let H=I.points[0],ie=I.points[I.points.length-1];if(Hn(b,H,ie,P))return I;break}case"freehand":{if(I.points.length<2)continue;for(let H=0;H<I.points.length-1;H++){let ie=I.points[H],z=I.points[H+1];if(Hn(b,ie,z,P))return I}break}}}return null},[e.annotations,w,Hn,Pn,St.x]),Zi=Pt(b=>{let v=Jo(b);return(v==null?void 0:v.type)==="text"?v:null},[Jo]),qi=Pt(b=>{if(je.length===0)return null;let v=Ol/2+4;for(let X of je){let I=e.annotations.find(P=>P.id===X);if(!(!I||I.points.length<2)){if(I.type==="line"){let P=I.points[0],H=I.points[I.points.length-1];if(Math.sqrt((b.x-P.x)**2+(b.y-P.y)**2)<=v)return{handle:"start",annotationId:X};if(Math.sqrt((b.x-H.x)**2+(b.y-H.y)**2)<=v)return{handle:"end",annotationId:X};continue}if(I.type==="circle"){let P=I.points[0],H=I.points[I.points.length-1],ie=Math.min(P.x,H.x),z=Math.max(P.x,H.x),Y=Math.min(P.y,H.y),y=Math.max(P.y,H.y),T=(ie+z)/2,G=(Y+y)/2,R=[{handle:"top",x:T,y:Y},{handle:"bottom",x:T,y},{handle:"left",x:ie,y:G},{handle:"right",x:z,y:G}];for(let{handle:O,x:_,y:$}of R)if(Math.sqrt((b.x-_)**2+(b.y-$)**2)<=v)return{handle:O,annotationId:X};continue}if(I.type==="rectangle"||I.type==="freehand"){let P=I.points[0],H=I.points[I.points.length-1],ie,z,Y,y;I.type==="freehand"?(ie=Math.min(...I.points.map(G=>G.x)),z=Math.max(...I.points.map(G=>G.x)),Y=Math.min(...I.points.map(G=>G.y)),y=Math.max(...I.points.map(G=>G.y))):(ie=Math.min(P.x,H.x),z=Math.max(P.x,H.x),Y=Math.min(P.y,H.y),y=Math.max(P.y,H.y));let T=[{corner:"topLeft",x:ie,y:Y},{corner:"topRight",x:z,y:Y},{corner:"bottomLeft",x:ie,y},{corner:"bottomRight",x:z,y}];for(let{corner:G,x:R,y:O}of T)if(Math.sqrt((b.x-R)**2+(b.y-O)**2)<=v)return{handle:G,annotationId:X}}}}return null},[je,e.annotations]);_t(()=>{let b=v=>{if(Ne.current={x:v.clientX+window.scrollX,y:v.clientY+window.scrollY},!k){let X=Zi(Ne.current);Z((X==null?void 0:X.id)||null)}};return window.addEventListener("mousemove",b),()=>window.removeEventListener("mousemove",b)},[k,Zi]);let to=Pt(()=>{var v;if(!k)return;let b=((v=k.images)==null?void 0:v.length)||0;if(k.text.trim()||b>0)if(k.isNew){let X=Qo();t({type:"ADD_TEXT",payload:f({point:k.point,text:k.text||(b>0?`[${b} image${b>1?"s":""}]`:""),fontSize:k.fontSize,id:X,groupId:k.groupId,linkedSelector:k.linkedSelector,linkedAnchor:k.linkedAnchor,elements:k.elements},b>0?{imageCount:b}:{})}),b>0&&k.images&&s&&s(X,k.images)}else t({type:"UPDATE_TEXT",payload:f({id:k.id,text:k.text||(b>0?`[${b} image${b>1?"s":""}]`:"")},b>0?{imageCount:b}:{})}),b>0&&k.images&&s&&s(k.id,k.images);else k.isNew||t({type:"DELETE_ANNOTATION",payload:{id:k.id}});W(null)},[k,t,s]),kn=Pt(b=>{for(let v=0;v<Mi.length-1;v++){let X=Mi[v],I=Mi[v+1];if(b<=(X+I)/2)return X;if(b<I)return I}return Math.round(b/8)*8},[]),Qi=Pt((b,v,X,I)=>{let P=X.top+Math.max(I.top,4),H=X.bottom-Math.max(I.bottom,4),ie=X.left+Math.max(I.left,4),z=X.right-Math.max(I.right,4);if(b<X.left||b>X.right||v<X.top||v>X.bottom)return null;let Y=v<P,y=v>H,T=b<ie,G=b>z;return Y&&T?I.top>=I.left?"top":"left":Y&&G?I.top>=I.right?"top":"right":y&&T?I.bottom>=I.left?"bottom":"left":y&&G?I.bottom>=I.right?"bottom":"right":Y?"top":y?"bottom":T?"left":G?"right":null},[]),es=Pt(b=>{var H,ie;if(!e.isAnnotating)return;if(e.inspectedElement&&e.activeTool==="hand"&&!("button"in b&&b.button===2)){b.preventDefault(),b.stopPropagation(),t({type:"SELECT_ELEMENT",payload:null});return}let v=eo(b),X="shiftKey"in b&&b.shiftKey;if(e.activeTool==="inspector"){if("button"in b&&b.button===2)return;if(ue&&!Te(ue)){let z=Jt(ue),Y=nn(ue),y=ue.getBoundingClientRect(),T=ue.getAttribute("data-pm");T||(T=Math.random().toString(36).substring(2,8),ue.setAttribute("data-pm",T));let G=`[data-pm="${T}"]`,R=e.styleModifications.some(be=>{try{return ue.matches(be.selector)}catch(Ze){return!1}}),O=e.annotations.filter(be=>{if(!be.linkedSelector)return!1;try{return ue.matches(be.linkedSelector)}catch(Ze){return!1}}).length,_=(R?1:0)+O,$=y.top>=Vn*(1+_)?"top-left":"bottom-left",se=Dl(y,$,_);we({point:se,linkedSelector:G,linkedAnchor:$,elements:[m(f({},z),{selector:Y})]})}return}if(e.activeTool==="model"){if("button"in b&&b.button===2)return;if(U){let z=U.name;if(g!=null&&g.has(z)){p==null||p(z);return}"shiftKey"in b&&b.shiftKey?fe(y=>{let T=new Map(y);return T.has(z)?T.delete(z):T.set(z,U),T}):te.size===1&&te.has(z)?(d&&d([z]),fe(new Map)):fe(new Map([[z,U]]))}return}if(e.activeTool==="hand"&&rt&&mt){let z=rt,Y=z.getAttribute("data-pm");Y||(Y=Math.random().toString(36).substring(2,8),z.setAttribute("data-pm",Y));let y=nn(z),T=`[data-pm="${Y}"]`,G=Jt(z),R=Bo(z),O=v.x-window.scrollX,_=v.y-window.scrollY,$=ut,se=window.getComputedStyle(z).justifyContent,be=0;if($){let Ge=Yn(z).find(Mt=>Mt.axis===mt);be=Ge?mt==="column"?Ge.w:Ge.h:0}ze(z,"transition","none"),gt.current={isDragging:!0,hasMoved:!1,axis:mt,startX:O,startY:_,originalRow:$?be:R.row,originalColumn:$?be:R.column,element:z,elementInfo:m(f({},G),{selector:T}),selector:T,durableSelector:y,isAuto:$,originalJustifyContent:se,visualGap:be},Kt({axis:mt,row:$?be:R.row,column:$?be:R.column});return}if(e.activeTool==="hand"&&ht&&Vt){let z=ht,Y=z.getAttribute("data-pm");Y||(Y=Math.random().toString(36).substring(2,8),z.setAttribute("data-pm",Y));let y=`[data-pm="${Y}"]`,T=Jt(z),{fontSize:G,lineHeight:R}=Oo(z),O=G>0?R/G:1.2,_=v.x-window.scrollX,$=v.y-window.scrollY;ze(z,"transition","none");let se=nn(z);pt.current={isDragging:!0,property:Vt,startX:_,startY:$,originalFontSize:G,originalLineHeight:R,originalRatio:O,element:z,elementInfo:m(f({},T),{selector:y}),selector:y,durableSelector:se},Q({property:Vt,fontSize:G,lineHeight:R});return}if(e.activeTool==="hand"&&j&&He){let z=j,Y=z.getAttribute("data-pm");Y||(Y=Math.random().toString(36).substring(2,8),z.setAttribute("data-pm",Y));let y=`[data-pm="${Y}"]`,T=nn(z),G=Jt(z),R=jn(z),O=z.getBoundingClientRect(),_=Math.floor(O.height/2),$=v.y-window.scrollY;ze(z,"transition","none"),Gt.current={isDragging:!0,corner:He,startY:$,original:R,maxRadius:_,element:z,elementInfo:m(f({},G),{selector:y}),selector:y,durableSelector:T},vt({corner:He,radius:f({},R)});return}if(e.activeTool==="hand"&&Oe&&A){let z=Oe,Y=z.getAttribute("data-pm");Y||(Y=Math.random().toString(36).substring(2,8),z.setAttribute("data-pm",Y));let y=`[data-pm="${Y}"]`,T=nn(z),G=Jt(z),R=uo(z),O=v.x-window.scrollX,_=v.y-window.scrollY;ze(z,"transition","none"),qe.current={isDragging:!0,side:A,startX:O,startY:_,original:R,element:z,elementInfo:m(f({},G),{selector:y}),selector:y,durableSelector:T},Le({side:A,padding:f({},R)});return}let I=qi(v);if(I){let z=e.annotations.find(Y=>Y.id===I.annotationId);if(z&&z.type!=="text"&&((H=z.status)!=null?H:"pending")==="pending"){Lt({annotationId:I.annotationId,handle:I.handle,startPoint:v,originalPoints:[...z.points],hasMoved:!1});return}}let P=Jo(v);if(P&&P.points[0]){if(k&&to(),P.type!=="text"?(Me(P.id,X),P.color&&t({type:"SET_COLOR",payload:P.color})):X||Ye(),a){let z=P.threadId||(P.groupId?(ie=e.annotations.find(Y=>Y.groupId===P.groupId&&Y.threadId))==null?void 0:ie.threadId:void 0);z&&a(z)}et({annotation:P,startPoint:v,hasMoved:!1});return}if(X||Ye(),e.activeTool==="text"){k&&to();let z=Math.random().toString(36).substring(2,9);W({id:z,point:v,text:"",fontSize:12,isNew:!0});return}L(!0),t({type:"START_PATH",payload:v})},[e.isAnnotating,e.activeTool,e.inspectedElement,e.annotations,k,je,ue,Oe,A,j,He,rt,mt,ut,ht,Vt,U,te,g,d,p,a,eo,Jo,qi,t,Me,Ye,to]),ts=Pt(b=>{var X,I;let v=eo(b);if(e.activeTool==="inspector"&&e.isAnnotating){let P=v.x-window.scrollX,H=v.y-window.scrollY,ie=Wn(P,H),z=ie&&Te(ie)?null:ie;z!==ue&&(We(z),lt(z?Jt(z):null));return}if(e.activeTool==="model"&&e.isAnnotating){let P=v.x-window.scrollX,H=v.y-window.scrollY,ie=Wn(P,H);if(ie!==ge.current&&(ge.current=ie,Ce.current=0),ie){let z=nr(ie,Ce.current);V(z)}else V(null);return}if(e.activeTool==="hand"&&e.isAnnotating){let P=v.x-window.scrollX,H=v.y-window.scrollY;xe.current={x:P,y:H},Qe({x:P,y:H});let ie=pe.current.cmd,z=pe.current.shift;if(gt.current.isDragging){let y=gt.current,T=y.element;if(!T)return;if(!y.hasMoved){let _=Math.abs(P-y.startX),$=Math.abs(H-y.startY);if(_<=2&&$<=2)return;y.hasMoved=!0,y.isAuto&&(ze(T,"justify-content","normal"),ze(T,"row-gap",`${y.visualGap}px`),ze(T,"column-gap",`${y.visualGap}px`),zt(!1))}let G=y.axis,R=y.originalRow,O=y.originalColumn;if(G==="column"){let _=P-y.startX;O=y.originalColumn+_,ie||(R=y.originalRow+_)}else{let _=H-y.startY;R=y.originalRow+_,ie||(O=y.originalColumn+_)}R=Math.max(0,R),O=Math.max(0,O),z&&(R=kn(R),O=kn(O)),R=Math.round(R),O=Math.round(O),ze(T,"row-gap",`${R}px`),ze(T,"column-gap",`${O}px`),Kt({axis:G,row:R,column:O});return}if(Gt.current.isDragging){let y=Gt.current,T=y.element;if(!T)return;let G=H-y.startY,R=y.corner,O=y.original,_=f({},O);if(ie){let $=O[R]+G;$=Math.max(0,Math.min(y.maxRadius,$)),z&&($=kn($)),$=Math.round($),_[R]=$}else{let $=O[R]+G;$=Math.max(0,Math.min(y.maxRadius,$)),z&&($=kn($)),$=Math.round($),_={"top-left":$,"top-right":$,"bottom-right":$,"bottom-left":$}}ze(T,"border-top-left-radius",`${_["top-left"]}px`),ze(T,"border-top-right-radius",`${_["top-right"]}px`),ze(T,"border-bottom-right-radius",`${_["bottom-right"]}px`),ze(T,"border-bottom-left-radius",`${_["bottom-left"]}px`),vt({corner:R,radius:_});return}if(pt.current.isDragging){let y=pt.current,T=y.element;if(!T)return;let G=y.property,R=y.originalFontSize,O=y.originalLineHeight,_=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(G==="font-size"){let se=P-y.startX;R=y.originalFontSize+se,R=Math.max(1,R)}else{let se=H-y.startY;O=y.originalLineHeight+se,O=Math.max(R,O)}if(z)if(G==="font-size"){let se=_[0],be=Math.abs(R-se);for(let Ze of _){let Ge=Math.abs(R-Ze);Ge<be&&(se=Ze,be=Ge)}R=se}else{let se=R>0?O/R:1.2,be=Math.round(se*2)/2;O=R*Math.max(1,be)}R=Math.round(R),O=Math.round(O*10)/10,ze(T,"font-size",`${R}px`);let $=R>0?Math.round(O/R*1e3)/1e3:1.2;ze(T,"line-height",`${$}`),Q({property:G,fontSize:R,lineHeight:O});return}if(qe.current.isDragging){let y=qe.current,T=y.element;if(!T)return;let G=y.side,R=y.original,O=R.top,_=R.right,$=R.bottom,se=R.left;if(G==="top"){let be=y.startY-H;O=R.top+be,ie||($=R.bottom+be)}else if(G==="bottom"){let be=H-y.startY;$=R.bottom+be,ie||(O=R.top+be)}else if(G==="left"){let be=y.startX-P;se=R.left+be,ie||(_=R.right+be)}else if(G==="right"){let be=P-y.startX;_=R.right+be,ie||(se=R.left+be)}O=Math.max(0,O),_=Math.max(0,_),$=Math.max(0,$),se=Math.max(0,se),z&&(O=kn(O),_=kn(_),$=kn($),se=kn(se)),O=Math.round(O),_=Math.round(_),$=Math.round($),se=Math.round(se),ze(T,"padding",`${O}px ${_}px ${$}px ${se}px`),Le({side:G,padding:{top:O,right:_,bottom:$,left:se}});return}let Y=Wn(P,H);for(;Y&&Y.tagName==="A";)Y=Y.parentElement;{let T=[];Y&&T.push(Y),j&&j!==Y&&T.push(j);let G=null,R=16,O=null;for(let _ of T){let $=_.getBoundingClientRect(),se=jn(_),be=[["top-left",$.left,$.top+se["top-left"]],["top-right",$.right,$.top+se["top-right"]],["bottom-right",$.right,$.bottom-se["bottom-right"]],["bottom-left",$.left,$.bottom-se["bottom-left"]]];for(let[Ze,Ge,Mt]of be){let ft=Math.hypot(P-Ge,H-Mt);ft<R&&(R=ft,G=Ze,O=_)}}if(G&&O){Ee(O),qt(G),Oe&&tt(null),A&&re(null),rt&&dt(null),mt&&Ct(null),zt(!1),ht&&An(null),Vt&&cn(null);return}}j&&Ee(null),He&&qt(null);{let y=[];Y&&ir(Y)&&y.push(Y);let T=(X=Y==null?void 0:Y.parentElement)!=null?X:null;for(;T&&T!==document.body&&y.length<3;)ir(T)&&y.push(T),T=T.parentElement;for(let G of y){let O=Yn(G).find(_=>P>=_.x&&P<=_.x+_.w&&H>=_.y&&H<=_.y+_.h);if(O){dt(G),Ct(O.axis),zt(Xr(G,O.axis)),Oe&&tt(null),A&&re(null),ht&&An(null),Vt&&cn(null);return}}}rt&&dt(null),mt&&Ct(null),zt(!1);{let T=[];Y&&T.push(Y),ht&&ht!==Y&&T.push(ht);let G=null,R=1/0,O=null;for(let _ of T){if(!Kr(_))continue;let $=po(_);if(!$)continue;let se=P>=$.left&&P<=$.right&&H>=$.top&&H<=$.bottom,be=[["font-size",$.right,$.top+$.height/2],["line-height",$.left+$.width/2,$.bottom]];for(let[Ze,Ge,Mt]of be){let ft=Math.hypot(P-Ge,H-Mt);(se||ft<12)&&ft<R&&(R=ft,G=Ze,O=_)}}G&&O?(An(O),cn(G)):(ht&&An(null),Vt&&cn(null))}if(Y!==Oe&&tt(Y),Y){let y=uo(Y),T=Y.getBoundingClientRect(),G=Qi(P,H,T,y);re(G)}else re(null);return}if(Ke){let{handle:P,originalPoints:H,hasMoved:ie}=Ke,z=e.annotations.find(R=>R.id===Ke.annotationId);if(!z)return;let Y="metaKey"in b,y=Y&&(b.metaKey||b.ctrlKey),T=Y&&b.shiftKey,G;if(z.type==="line"){let R=H[0],O=H[H.length-1];P==="start"?G=[v,O]:G=[R,v]}else if(z.type==="freehand"){let R=Math.min(...H.map(De=>De.x)),O=Math.max(...H.map(De=>De.x)),_=Math.min(...H.map(De=>De.y)),$=Math.max(...H.map(De=>De.y)),se=(R+O)/2,be=(_+$)/2,Ze=O-R||1,Ge=$-_||1,Mt=Ze/Ge,ft=R,ae=O,ve=_,Ue=$;switch(P){case"topLeft":ft=v.x,ve=v.y;break;case"topRight":ae=v.x,ve=v.y;break;case"bottomLeft":ft=v.x,Ue=v.y;break;case"bottomRight":ae=v.x,Ue=v.y;break}if(y)switch(P){case"topLeft":ae=O+(R-ft),Ue=$+(_-ve);break;case"topRight":ft=R-(ae-O),Ue=$+(_-ve);break;case"bottomLeft":ae=O+(R-ft),ve=_-(Ue-$);break;case"bottomRight":ft=R-(ae-O),ve=_-(Ue-$);break}if(T){let De=ae-ft,yt=Ue-ve;if(Math.abs(De/yt)>Mt){let Rt=Math.abs(yt)*Mt*Math.sign(De);P==="topLeft"||P==="bottomLeft"?ft=ae-Rt:ae=ft+Rt}else{let Rt=Math.abs(De)/Mt*Math.sign(yt);P==="topLeft"||P==="topRight"?ve=Ue-Rt:Ue=ve+Rt}}let Ve=ae-ft||1,it=Ue-ve||1;G=H.map(De=>({x:ft+(De.x-R)/Ze*Ve,y:ve+(De.y-_)/Ge*it}))}else if(z.type==="circle"){let R=H[0],O=H[H.length-1],_=Math.min(R.x,O.x),$=Math.max(R.x,O.x),se=Math.min(R.y,O.y),be=Math.max(R.y,O.y),Ze=(_+$)/2,Ge=(se+be)/2,Mt=$-_,ft=be-se,ae=_,ve=$,Ue=se,Ve=be;switch(P){case"top":if(Ue=v.y,y&&(Ve=Ge+(Ge-v.y)),T){let De=(Ve-Ue)*(Mt/ft)/2;ae=Ze-De,ve=Ze+De}break;case"bottom":if(Ve=v.y,y&&(Ue=Ge-(v.y-Ge)),T){let De=(Ve-Ue)*(Mt/ft)/2;ae=Ze-De,ve=Ze+De}break;case"left":if(ae=v.x,y&&(ve=Ze+(Ze-v.x)),T){let De=(ve-ae)*(ft/Mt)/2;Ue=Ge-De,Ve=Ge+De}break;case"right":if(ve=v.x,y&&(ae=Ze-(v.x-Ze)),T){let De=(ve-ae)*(ft/Mt)/2;Ue=Ge-De,Ve=Ge+De}break}G=[{x:ae,y:Ue},{x:ve,y:Ve}]}else{let R=H[0],O=H[H.length-1],_=Math.min(R.x,O.x),$=Math.max(R.x,O.x),se=Math.min(R.y,O.y),be=Math.max(R.y,O.y),Ze=(_+$)/2,Ge=(se+be)/2,Mt=$-_||1,ft=be-se||1,ae=Mt/ft,ve=_,Ue=$,Ve=se,it=be;switch(P){case"topLeft":ve=v.x,Ve=v.y;break;case"topRight":Ue=v.x,Ve=v.y;break;case"bottomLeft":ve=v.x,it=v.y;break;case"bottomRight":Ue=v.x,it=v.y;break}if(y)switch(P){case"topLeft":Ue=$+(_-ve),it=be+(se-Ve);break;case"topRight":ve=_-(Ue-$),it=be+(se-Ve);break;case"bottomLeft":Ue=$+(_-ve),Ve=se-(it-be);break;case"bottomRight":ve=_-(Ue-$),Ve=se-(it-be);break}if(T){let De=Ue-ve,yt=it-Ve;if(Math.abs(De/yt)>ae){let Rt=Math.abs(yt)*ae*Math.sign(De);P==="topLeft"||P==="bottomLeft"?ve=Ue-Rt:Ue=ve+Rt}else{let Rt=Math.abs(De)/ae*Math.sign(yt);P==="topLeft"||P==="topRight"?Ve=it-Rt:it=Ve+Rt}}G=[{x:ve,y:Ve},{x:Ue,y:it}]}t({type:"RESIZE_ANNOTATION",payload:{id:Ke.annotationId,points:G,saveUndo:!ie}}),ie||Lt(m(f({},Ke),{hasMoved:!0}));return}if(ye&&((I=ye.annotation.status)!=null?I:"pending")==="pending"){let P=v.x-ye.startPoint.x,H=v.y-ye.startPoint.y;if((Math.abs(P)>2||Math.abs(H)>2)&&!ye.hasMoved)et(m(f({},ye),{hasMoved:!0,startPoint:v})),t({type:"MOVE_ANNOTATION",payload:{id:ye.annotation.id,delta:{x:P,y:H},saveUndo:!0}});else if(ye.hasMoved){let z=v.x-ye.startPoint.x,Y=v.y-ye.startPoint.y;et(m(f({},ye),{startPoint:v})),t({type:"MOVE_ANNOTATION",payload:{id:ye.annotation.id,delta:{x:z,y:Y}}})}return}!C||!e.isAnnotating||t({type:"CONTINUE_PATH",payload:v})},[C,e.isAnnotating,e.activeTool,ye,Ke,ue,Oe,A,j,He,rt,mt,ht,Vt,eo,t,kn,Qi]),Mr=Pt(b=>{var I,P,H,ie,z,Y;if(pt.current.isDragging){let y=pt.current,T=y.element;if(T&&y.selector&&y.elementInfo&&N){T instanceof HTMLElement&&(T.style.removeProperty("font-size"),T.style.removeProperty("line-height"),T.style.removeProperty("transition"));let G=[];if(y.originalFontSize!==N.fontSize&&(ze(T,"font-size",`${N.fontSize}px`),G.push({property:"font-size",original:`${y.originalFontSize}px`,modified:`${N.fontSize}px`})),y.originalLineHeight!==N.lineHeight){let R=y.originalFontSize>0?Math.round(y.originalLineHeight/y.originalFontSize*1e3)/1e3:1.2,O=N.fontSize>0?Math.round(N.lineHeight/N.fontSize*1e3)/1e3:1.2;ze(T,"line-height",`${O}`),G.push({property:"line-height",original:`${R}`,modified:`${O}`})}G.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:y.selector,durableSelector:(I=y.durableSelector)!=null?I:void 0,element:y.elementInfo,changes:G}})}pt.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},Q(null);return}if(gt.current.isDragging){let y=gt.current,T=y.element,G="button"in b&&b.button===2;if(!y.hasMoved&&!G&&T&&y.selector&&y.elementInfo){T instanceof HTMLElement&&T.style.removeProperty("transition");let R=["space-between","space-around","stretch","normal"],O=y.originalJustifyContent||"normal",_=R.indexOf(O),$=R[(_+1)%R.length],se=[];$==="normal"?(ze(T,"justify-content","normal"),se.push({property:"justify-content",original:y.originalJustifyContent,modified:"normal"})):$==="stretch"?(ze(T,"justify-content",$),ze(T,"row-gap","8px"),ze(T,"column-gap","8px"),se.push({property:"justify-content",original:y.originalJustifyContent||"normal",modified:$}),y.originalRow!==8&&se.push({property:"row-gap",original:`${y.originalRow}px`,modified:"8px"}),y.originalColumn!==8&&se.push({property:"column-gap",original:`${y.originalColumn}px`,modified:"8px"})):(T instanceof HTMLElement&&(T.style.removeProperty("row-gap"),T.style.removeProperty("column-gap")),ze(T,"justify-content",$),se.push({property:"justify-content",original:y.originalJustifyContent||"normal",modified:$}),y.originalRow>0&&se.push({property:"row-gap",original:`${y.originalRow}px`,modified:"0px"}),y.originalColumn>0&&se.push({property:"column-gap",original:`${y.originalColumn}px`,modified:"0px"})),se.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:y.selector,durableSelector:(P=y.durableSelector)!=null?P:void 0,element:y.elementInfo,changes:se}})}else if(y.hasMoved&&T&&y.selector&&y.elementInfo&&Be){T instanceof HTMLElement&&(T.style.removeProperty("row-gap"),T.style.removeProperty("column-gap"),T.style.removeProperty("transition"));let R=[];y.isAuto?(T instanceof HTMLElement&&T.style.removeProperty("justify-content"),ze(T,"justify-content","normal"),ze(T,"row-gap",`${Be.row}px`),ze(T,"column-gap",`${Be.column}px`),R.push({property:"justify-content",original:y.originalJustifyContent,modified:"normal"}),R.push({property:"row-gap",original:"0px",modified:`${Be.row}px`}),R.push({property:"column-gap",original:"0px",modified:`${Be.column}px`})):(y.originalRow!==Be.row&&(ze(T,"row-gap",`${Be.row}px`),R.push({property:"row-gap",original:`${y.originalRow}px`,modified:`${Be.row}px`})),y.originalColumn!==Be.column&&(ze(T,"column-gap",`${Be.column}px`),R.push({property:"column-gap",original:`${y.originalColumn}px`,modified:`${Be.column}px`}))),R.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:y.selector,durableSelector:(H=y.durableSelector)!=null?H:void 0,element:y.elementInfo,changes:R}})}gt.current={isDragging:!1,hasMoved:!1,axis:null,startX:0,startY:0,originalRow:0,originalColumn:0,element:null,elementInfo:null,selector:null,durableSelector:null,isAuto:!1,originalJustifyContent:"",visualGap:0},Kt(null);return}if(Gt.current.isDragging){let y=Gt.current,T=y.element;if(T&&y.selector&&y.elementInfo&&nt){T instanceof HTMLElement&&(T.style.removeProperty("border-top-left-radius"),T.style.removeProperty("border-top-right-radius"),T.style.removeProperty("border-bottom-right-radius"),T.style.removeProperty("border-bottom-left-radius"),T.style.removeProperty("transition"));let G=["top-left","top-right","bottom-right","bottom-left"],R={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},O=[];for(let _ of G)y.original[_]!==nt.radius[_]&&(ze(T,R[_],`${nt.radius[_]}px`),O.push({property:R[_],original:`${y.original[_]}px`,modified:`${nt.radius[_]}px`}));O.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:y.selector,durableSelector:(ie=y.durableSelector)!=null?ie:void 0,element:y.elementInfo,changes:O}})}Gt.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},vt(null);return}if(qe.current.isDragging){let y=qe.current,T=y.element,G=y.selector,R=y.elementInfo;if(T&&G&&R&&ke){let O=y.original,_=ke.padding;T instanceof HTMLElement&&(T.style.removeProperty("padding"),T.style.removeProperty("transition"));let $=[],se=[{prop:"padding-top",origVal:O.top,newVal:_.top},{prop:"padding-right",origVal:O.right,newVal:_.right},{prop:"padding-bottom",origVal:O.bottom,newVal:_.bottom},{prop:"padding-left",origVal:O.left,newVal:_.left}];for(let{prop:be,origVal:Ze,newVal:Ge}of se)Ze!==Ge&&(ze(T,be,`${Ge}px`),$.push({property:be,original:`${Ze}px`,modified:`${Ge}px`}));$.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:G,durableSelector:(z=y.durableSelector)!=null?z:void 0,element:R,changes:$}})}qe.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},Le(null);return}if(Ke){Lt(null);return}if(ye){if(!ye.hasMoved&&ye.annotation.type==="text"&&((Y=ye.annotation.status)!=null?Y:"pending")==="pending"){let y=eo(b);W({id:ye.annotation.id,point:ye.annotation.points[0],text:ye.annotation.text||"",fontSize:ye.annotation.fontSize||12,isNew:!1,clickPoint:y,groupId:ye.annotation.groupId})}et(null);return}if(!C)return;let v=5;if(e.currentPath.length>=2){let y=e.currentPath[0],T=e.currentPath[e.currentPath.length-1],G=Math.abs(T.x-y.x),R=Math.abs(T.y-y.y);if((e.activeTool==="line"?Math.sqrt(G*G+R*R)<v:G<v&&R<v)&&["rectangle","circle","line"].includes(e.activeTool)){L(!1),t({type:"CANCEL_PATH"});return}}let X=Yr(e.currentPath);if(e.activeTool==="rectangle"&&e.currentPath.length>=2){let y=e.currentPath[0],T=e.currentPath[e.currentPath.length-1],G=Math.min(y.x,T.x),R=Math.max(y.y,T.y),O=e.strokeWidth/2,_=Math.random().toString(36).substring(2,9);K({point:{x:G-O+4,y:R+O+4},groupId:_}),L(!1),t({type:"FINISH_PATH",payload:{groupId:_,elements:X}});return}L(!1),t({type:"FINISH_PATH",payload:{elements:X}})},[C,ye,Ke,ke,nt,Be,N,eo,t,e.activeTool,e.currentPath,e.strokeWidth]),la=Pt(b=>{let v=b.target.value;Vo.current=b.target.selectionStart,W(X=>X&&m(f({},X),{text:v}))},[]),aa=Pt(b=>{b.key==="Escape"?W(null):b.key==="Enter"&&!b.shiftKey&&(b.preventDefault(),to())},[to]),ca=Pt(b=>{if(!k)return;let v=b.clipboardData.items,X=[];for(let I=0;I<v.length;I++){let P=v[I];if(P.type.startsWith("image/")){let H=P.getAsFile();H&&X.push(H)}}X.length>0&&(b.preventDefault(),W(I=>I?m(f({},I),{images:[...I.images||[],...X]}):null))},[k]),da=Pt(b=>{if(!e.isAnnotating)return;if(e.activeTool==="hand"){b.preventDefault();let X=Oe||rt||j||ht;if(X&&!Te(X)){let I=Jt(X),P=nn(X);t({type:"SELECT_ELEMENT",payload:{el:X,info:m(f({},I),{selector:P})}})}return}b.preventDefault();let v=w.current;v&&(M.current=!0,v.style.pointerEvents="none",setTimeout(()=>{M.current&&(M.current=!1,v.style.pointerEvents="")},4e3))},[e.activeTool,e.isAnnotating,Oe,rt,j,ht,t,Te,w]);_t(()=>{let b=e.annotations.filter(H=>H.linkedSelector);if(b.length===0)return;let v=null,X=()=>{var ie,z,Y;let H=[];for(let y of b){let T=document.querySelector(y.linkedSelector);if(!T&&((z=(ie=y.elements)==null?void 0:ie[0])!=null&&z.selector)&&y.linkedSelector.startsWith("[data-pm=")){try{T=document.querySelector(y.elements[0].selector)}catch(Ge){}if(T){let Ge=(Y=y.linkedSelector.match(/data-pm="([^"]+)"/))==null?void 0:Y[1];Ge&&T.setAttribute("data-pm",Ge)}}if(!T)continue;let G=T.getBoundingClientRect(),R=e.styleModifications.some(Ge=>{try{return T.matches(Ge.selector)}catch(Mt){return!1}}),O=b.filter(Ge=>Ge.id!==y.id&&Ge.timestamp<y.timestamp&&Ge.linkedSelector===y.linkedSelector).length,_=(R?1:0)+O,$=G.top>=Vn*(1+_)?"top-left":"bottom-left",se=Dl(G,$,_),be=y.points[0],Ze=$!==y.linkedAnchor;be&&(Ze||Math.abs(se.x-be.x)>1||Math.abs(se.y-be.y)>1)&&H.push({id:y.id,point:se,linkedAnchor:Ze?$:void 0})}H.length>0&&t({type:"UPDATE_LINKED_POSITIONS",payload:{updates:H}})},I=()=>{v&&cancelAnimationFrame(v),v=requestAnimationFrame(X)};X(),window.addEventListener("scroll",I,!0),window.addEventListener("resize",I,!0),window.addEventListener("load",I),document.fonts.ready.then(I);let P=new MutationObserver(I);return P.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",I,!0),window.removeEventListener("resize",I,!0),window.removeEventListener("load",I),P.disconnect(),v&&cancelAnimationFrame(v)}},[e.annotations,t]);let ua=()=>{var b,v,X;if(!e.isAnnotating)return"default";if(Ke){let{handle:I}=Ke;return I==="start"||I==="end"?"move":I==="top"||I==="bottom"?"ns-resize":I==="left"||I==="right"?"ew-resize":I==="topLeft"||I==="bottomRight"?"nwse-resize":"nesw-resize"}if(e.activeTool==="text")return"text";if(e.activeTool==="hand"){let I=(b=Be==null?void 0:Be.axis)!=null?b:mt;if(I==="row")return"ns-resize";if(I==="column")return"ew-resize";if(nt||He)return"ns-resize";let P=(v=N==null?void 0:N.property)!=null?v:Vt;if(P==="font-size")return"ew-resize";if(P==="line-height")return"ns-resize";let H=(X=ke==null?void 0:ke.side)!=null?X:A;return H==="top"||H==="bottom"?"ns-resize":H==="left"||H==="right"?"ew-resize":"default"}return"crosshair"},pa={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:e.isAnnotating?"auto":"none",visibility:e.isAnnotating?"visible":"hidden",cursor:ua()},Ro=Pt(()=>{let b=w.current;if(!b||!k)return{width:100,height:12*1.4,isWrapped:!1};let v=b.getContext("2d");if(!v)return{width:100,height:k.fontSize*1.4,isWrapped:!1};v.font=`${k.fontSize}px ${Dt}`;let I=v.measureText("Type here...").width,P=k.text.split(`
-`),H=P.length>0?Math.max(I,...P.map(T=>v.measureText(T||" ").width)):I,ie=k.point.x-St.x,z=so(ie);if(z!==void 0&&H>z){let T=$n(v,P,z),G=Math.min(z,Math.max(I,...T.map(O=>v.measureText(O).width))),R=Math.max(1,T.length)*k.fontSize*1.4;return{width:G,height:R,isWrapped:!0}}let y=Math.max(1,P.length)*k.fontSize*1.4;return{width:H,height:y,isWrapped:!1}},[k,w,St.x])(),fa=k?Math.max(1,k.text.split(`
-`).length)*k.fontSize*1.4+8:0,ns=Ro.height+8,ga=Ro.isWrapped?ns-fa:0,ma=k?{position:"fixed",left:k.point.x-4-St.x,top:k.point.y-4-St.y-ga,zIndex:9999,width:Ro.width+8,height:ns,padding:4,fontSize:k.fontSize,fontFamily:Dt,color:"#ffffff",backgroundColor:e.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:Ro.isWrapped?"pre-wrap":"pre",wordBreak:Ro.isWrapped?"break-word":void 0}:{};return So(wo,{children:[ot("canvas",{ref:w,id:"devtools-canvas",style:pa,onMouseDown:es,onMouseMove:ts,onMouseUp:b=>Mr(b),onMouseLeave:b=>{Mr(b),We(null),lt(null)},onTouchStart:es,onTouchMove:ts,onTouchEnd:b=>Mr(b),onContextMenu:da}),k&&So(wo,{children:[ot("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),ot("textarea",{id:"devtools-text-input",ref:le,value:k.text,onChange:la,onKeyDown:aa,onPaste:ca,onBlur:to,placeholder:"Type here...",style:ma}),k.images&&k.images.length>0&&So("div",{"data-devtools":!0,style:{position:"fixed",left:k.point.x-4-St.x,top:k.point.y-4-St.y-20,zIndex:1e4,fontSize:11,fontFamily:"system-ui, sans-serif",color:"#fff",backgroundColor:"rgba(0,0,0,0.7)",padding:"2px 6px",borderRadius:3,whiteSpace:"nowrap"},children:[k.images.length," image",k.images.length>1?"s":""," attached"]})]}),e.isAnnotating&&e.activeTool!=="hand"&&e.styleModifications.length>0&&ot(pl,{styleModifications:e.styleModifications,isInspecting:!!e.inspectedElement,accentColor:e.activeColor,annotationGroupCount:new Set(e.annotations.map(b=>b.groupId||b.id)).size,dispatch:t,inFlightSelectors:r}),e.activeTool==="hand"&&e.isAnnotating&&e.styleModifications.length>0&&ot(gl,{styleModifications:e.styleModifications,accentColor:e.activeColor}),e.isAnnotating&&ot(nl,{annotations:e.annotations,supersededAnnotations:Pn,inFlightIds:n,scrollX:St.x,scrollY:St.y,annotationGroupMap:Go,onViewThread:a,onSelectAnnotation:Me,canvasRef:w}),e.isAnnotating&&l&&ot(ol,{annotations:e.annotations,supersededAnnotations:Pn,scrollX:St.x,scrollY:St.y,onReply:l,annotationGroupMap:Go,canvasRef:w}),e.isAnnotating&&i&&i.size>0&&ot(ti,{inFlightSelectorColors:i}),e.isAnnotating&&Ki&&ot(ti,{inFlightSelectorColors:Ki,animated:!1}),e.activeTool==="hand"&&e.isAnnotating&&(Be?gt.current.element:rt)&&ot(si,{element:Be?gt.current.element:rt,gap:Be?{row:Be.row,column:Be.column}:Bo(rt),accentColor:e.activeColor,hoveredAxis:mt,draggingAxis:(rs=Be==null?void 0:Be.axis)!=null?rs:null,cursorViewport:at,isAutoGap:ut,refreshKey:Yt}),e.activeTool==="hand"&&e.isAnnotating&&jt&&ot(Pl,{element:jt.target,modifier:jt.modifier,accentColor:e.activeColor,refreshKey:Yt}),e.activeTool==="hand"&&e.isAnnotating&&!jt&&(nt?Gt.current.element:j)&&ot(al,{element:nt?Gt.current.element:j,radius:(is=nt==null?void 0:nt.radius)!=null?is:jn(j),accentColor:e.activeColor,hoveredCorner:He,draggingCorner:(ss=nt==null?void 0:nt.corner)!=null?ss:null,cursorViewport:at}),e.activeTool==="hand"&&e.isAnnotating&&!jt&&(N?pt.current.element:ht)&&ot(Bl,{element:N?pt.current.element:ht,fontSize:(ls=N==null?void 0:N.fontSize)!=null?ls:Oo(ht).fontSize,lineHeight:(as=N==null?void 0:N.lineHeight)!=null?as:Oo(ht).lineHeight,accentColor:e.activeColor,hoveredProperty:Vt,draggingProperty:(cs=N==null?void 0:N.property)!=null?cs:null,cursorViewport:at}),e.activeTool==="hand"&&e.isAnnotating&&!jt&&(ke?qe.current.element:Oe)&&ot(pi,{element:ke?qe.current.element:Oe,padding:(ds=ke==null?void 0:ke.padding)!=null?ds:uo(Oe),accentColor:e.activeColor,hoveredSide:A,draggingSide:(us=ke==null?void 0:ke.side)!=null?us:null,cursorViewport:at,refreshKey:N?N.fontSize+N.lineHeight*1e3:0}),e.activeTool==="inspector"&&e.isAnnotating&&ot(wo,{children:ue&&!e.inspectedElement&&(()=>{let b=!!q||!!(k!=null&&k.linkedSelector)||e.annotations.some(v=>{if(!v.linkedSelector)return!1;try{return ue.matches(v.linkedSelector)}catch(X){return!1}});return ot(mo,{element:ue,isSelected:!1,elementInfo:me,color:e.activeColor,hideTooltip:b})})()}),e.activeTool==="model"&&e.isAnnotating&&te.size>0&&[...te.entries()].map(([b,v])=>ot(mo,{element:v.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:v.rootElement.tagName.toLowerCase(),reactComponent:b},color:"#8b5cf6"},b)),e.activeTool==="model"&&e.isAnnotating&&Lo&&ot(mo,{element:Lo.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:Lo.rootElement.tagName.toLowerCase(),reactComponent:Lo.name},color:"#22c55e"}),e.activeTool==="model"&&e.isAnnotating&&dn.length>0&&dn.map((b,v)=>ot("div",{style:{position:"absolute",left:b.x,top:b.y,width:b.width,height:b.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:b.direction==="vertical"?So(wo,{children:[ot("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ot("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ot("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ot("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:b.height<16?-6:"50%",transform:b.height<16?"none":"translateY(-50%)",fontSize:11,fontWeight:600,color:"#fff",backgroundColor:"#FF0000",padding:"2px 4px",whiteSpace:"nowrap",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1},children:Math.round(b.height)})]}):So(wo,{children:[ot("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ot("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ot("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ot("div",{style:{position:"absolute",left:b.width<30?0:"50%",top:(b.width<30,void 0),bottom:"calc(50% + 4px)",transform:b.width<30?"none":"translateX(-50%)",fontSize:11,fontWeight:600,color:"#fff",backgroundColor:"#FF0000",padding:"2px 4px",whiteSpace:"nowrap",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1},children:Math.round(b.width)})]})},v)),e.activeTool==="model"&&e.isAnnotating&&U&&ot(mo,{element:U.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:U.rootElement.tagName.toLowerCase(),reactComponent:U.name},color:g!=null&&g.has(U.name)?"#22c55e":"#8b5cf6"}),e.activeTool==="hand"&&e.isAnnotating&&e.inspectedElement&&So(wo,{children:[de&&de!=="padding"&&de!=="gap"&&(()=>{var z;let b=new Set(e.annotations.map(Y=>Y.groupId||Y.id)).size,v=e.inspectedElement.info.selector,X=e.styleModifications.findIndex(Y=>Y.selector===v),I=X>=0?b+X+1:b+e.styleModifications.length+1,P=e.styleModifications.find(Y=>Y.selector===v),H=(z=P==null?void 0:P.changes.length)!=null?z:0,ie=!!(P!=null&&P.captured);return ot(mo,{element:e.inspectedElement.el,isSelected:!0,elementInfo:e.inspectedElement.info,color:ie?"#999999":e.activeColor,annotationNumber:I,changeCount:H})})(),de==="padding"&&ot(pi,{element:e.inspectedElement.el,padding:uo(e.inspectedElement.el),accentColor:e.activeColor,hoveredSide:null,draggingSide:null}),de==="gap"&&ot(si,{element:e.inspectedElement.el,gap:Bo(e.inspectedElement.el),accentColor:e.activeColor,hoveredAxis:null,draggingAxis:null}),ot(Rl,{element:e.inspectedElement.el,elementInfo:e.inspectedElement.info,selector:e.inspectedElement.info.selector,styleModifications:e.styleModifications,dispatch:t,onClose:()=>t({type:"SELECT_ELEMENT",payload:null}),onHover:Ae,accentColor:e.activeColor})]})]})}import{useCallback as sn,useEffect as xn,useMemo as Pi,useRef as It,useState as _o}from"react";import{Circle as Su,Component as wu,Hand as ku,MessageCircle as Eu,Pen as Cu,Slash as Mu,Square as Tu,Trash2 as Iu,Type as Lu}from"lucide-react";import{useEffect as Kd,useRef as Zd}from"react";function Nl(e,t,o,n,r){let i=Zd(0);Kd(()=>{if(!o.current||(localStorage.setItem(r.expanded,String(e)),!e))return;let s=t.annotations.length;(s>=i.current||s===0||!n)&&(localStorage.setItem(r.annotations,JSON.stringify(t.annotations)),i.current=s),localStorage.setItem(r.styleMods,JSON.stringify(t.styleModifications)),localStorage.setItem(r.spacingChanges,JSON.stringify(t.spacingTokenChanges)),localStorage.setItem(r.tool,t.activeTool),localStorage.setItem(r.color,t.activeColor),localStorage.setItem(r.stroke,String(t.strokeWidth)),t.inspectedElement?localStorage.setItem(r.inspected,JSON.stringify({selector:t.inspectedElement.info.selector,info:t.inspectedElement.info})):localStorage.removeItem(r.inspected)},[e,t.annotations,t.styleModifications,t.spacingTokenChanges,t.activeTool,t.activeColor,t.strokeWidth,t.inspectedElement,n,o,r])}import{Component as qd,createElement as Qd,useCallback as vr,useEffect as Eo,useRef as ko,useState as bn}from"react";import{Fragment as Co,jsx as Fe,jsxs as Xt}from"react/jsx-runtime";var Hl="popmelt-library-tab",eu=/^#[0-9a-fA-F]{3,8}$/,tu=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,nu=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),ou=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function zl(e){let t=e.trim();return eu.test(t)||tu.test(t)||nu.has(t.toLowerCase())}function ru(e){return ou.test(e.trim())}function iu(e){let t=e.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return t?parseFloat(t[1]):null}function Li(e,t=""){if(e==null)return[];if(typeof e!="object")return[[t,String(e)]];if(Array.isArray(e))return[[t,e.map(String).join(", ")]];let o=[];for(let[n,r]of Object.entries(e)){let i=t?`${t}.${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(...Li(r,i))}else o.push([i,Array.isArray(r)?r.map(String).join(", "):String(r!=null?r:"")])}return o}function su(e){return e.length===0?"generic":e.filter(([,n])=>zl(n)).length>e.length/2?"colors":e.filter(([,n])=>ru(n)).length>e.length/2?"spacing":"generic"}var lu=m(f({position:"fixed",top:16,right:16,bottom:80,width:300,backgroundColor:"#ffffff"},mn),{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"}),_l={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},au=m(f({},_l),{color:"#1f2937",borderBottom:"1.5px solid #1f2937"});function cu({entries:e}){let t=[],o=[];for(let n of e)zl(n[1])?t.push(n):o.push(n);return Xt(Co,{children:[t.length>0&&Fe("div",{style:{display:"flex",flexWrap:"wrap",gap:2,marginBottom:o.length>0?6:0},children:t.map(([n,r])=>Fe("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&&Fe(Ri,{entries:o})]})}var xr=[0,1,2,4,8,12,16,20,24,28,32];function du(e){if(e<=32){let t=xr[0],o=Math.abs(e-t);for(let n=1;n<xr.length;n++){let r=Math.abs(e-xr[n]);r<o&&(t=xr[n],o=r)}return t}return Math.round(e/8)*8}function uu({label:e,value:t,px:o,tokenPath:n,rawToken:r,onHover:i,onModify:s,onDelete:l}){let[a,c]=bn(!1),[d,p]=bn(null),u=ko(!1),g=ko(0),x=ko(0),E=ko([]),h=d!==null?d:o,w=d!==null?`${d}px`:t,D=d!==null,B=vr(C=>{C.preventDefault(),u.current=!0,g.current=C.clientX,x.current=o;let L=or(r);E.current=Gr(L);let k=ee=>{let Z=ee.clientX-g.current,F=Math.max(0,Math.round(x.current+Z));ee.shiftKey&&(F=du(F));for(let K of E.current)K.element.style.setProperty(K.property,F+"px","important");p(F),i==null||i({name:e,px:F,token:L})},W=()=>{window.removeEventListener("mousemove",k),window.removeEventListener("mouseup",W),document.body.style.cursor="",u.current=!1,p(ee=>{if(ee!==null&&ee!==o&&s){let Z=or(r),F=Z.bindings&&Z.bindings.length>0,K;if(F){let he=Ur(Z.bindings,x.current,ee);K=JSON.stringify(m(f({},Z),{value:`${ee}px`,bindings:he}))}else{let he=Us(E.current,x.current),Ne=Js(E.current);if(he.length>0){let Ie=Ur(he,x.current,ee);K=JSON.stringify({value:`${ee}px`,property:Ne,bindings:Ie})}else K=`${ee}px`}let q=typeof r=="string"?r:JSON.stringify(r),we=E.current.map(he=>({selector:nn(he.element),property:he.property})),le=Ks(E.current,x.current,ee);s({tokenPath:n,originalValue:q,currentValue:K,targets:we,originalPx:x.current,currentPx:ee},{id:Math.random().toString(36).substring(2,9),tokenPath:n,tokenName:e,originalPx:x.current,newPx:ee,affectedElements:le})}return ee})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",k),window.addEventListener("mouseup",W)},[o,e,n,r,i,s]),M=or(r);return Xt("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:e,px:h,token:M}))},onMouseLeave:()=>{u.current||(c(!1),i==null||i(null))},onMouseDown:B,children:[Fe("span",{style:{color:a||D?"#FF0000":"#9ca3af"},children:e}),Xt("span",{style:{display:"flex",alignItems:"center",gap:4},children:[Fe("span",{style:{color:a||D?"#FF0000":"#6b7280",fontWeight:600},children:w}),l&&a&&!D&&Fe("button",{type:"button",title:"Remove token",onMouseDown:C=>{C.stopPropagation();let L=typeof r=="string"?r:JSON.stringify(r);l(n,L)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:C=>{C.currentTarget.style.color="#FF0000"},onMouseLeave:C=>{C.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function pu({entries:e,categoryKey:t,rawTokens:o,onHover:n,onModify:r,onDelete:i}){let s=[],l=[];for(let a of e){let c=iu(a[1]);c!==null?s.push([a[0],a[1],c]):l.push(a)}return Xt(Co,{children:[s.length>0&&Fe("div",{style:{display:"flex",flexDirection:"column",gap:2},children:s.map(([a,c,d])=>{let p=a.split(".").pop(),u=o?fu(o,a):c,g=u&&typeof u=="object"&&"value"in u?u:c;return Fe(uu,{label:p,value:c,px:d,tokenPath:`tokens.${t}.${a}`,rawToken:g,onHover:n,onModify:r,onDelete:i},a)})}),l.length>0&&Fe(Ri,{entries:l})]})}function fu(e,t){let o=t.split("."),n=e;for(let r of o){if(n==null||typeof n!="object")return;n=n[r]}return n}function Ri({entries:e}){return Fe("div",{style:{display:"flex",flexDirection:"column",gap:3},children:e.map(([t,o])=>Xt("div",{style:{fontSize:11},children:[Fe("div",{style:{color:"#9ca3af",fontSize:10,marginBottom:1},children:t}),Fe("div",{style:{color:"#1f2937",lineHeight:1.4,paddingLeft:8},children:o})]},t))})}function $l({entries:e,categoryKey:t,rawTokens:o,onSpacingHover:n,onModifyToken:r,onDeleteToken:i}){let s=su(e);return s==="colors"?Fe(cu,{entries:e}):s==="spacing"?Fe(pu,{entries:e,categoryKey:t,rawTokens:o,onHover:n,onModify:r,onDelete:i}):Fe(Ri,{entries:e})}function gu(e){let t=e.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(a=>a.startsWith("__reactFiber$")||a.startsWith("__reactInternalInstance$"));if(!s)continue;let l=i[s];for(;l;){let a=l.type,c=typeof a=="function"||typeof a=="object"?(a==null?void 0:a.displayName)||(a==null?void 0:a.name):null;if(typeof c=="string"){let d=c.toLowerCase();if(d===t){let p=f({},l.memoizedProps);return delete p.ref,{type:a,props:p}}if(!o){if(d.length>=4&&t.includes(d)){let p=f({},l.memoizedProps);delete p.ref,o={type:a,props:p}}else if(t.length>=4&&d.includes(t)){let p=f({},l.memoizedProps);delete p.ref,o={type:a,props:p}}}}l=l.return}}return o}var Ii=class extends qd{constructor(){super(...arguments);this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(){this.props.onError()}render(){return this.state.hasError?null:this.props.children}};function mu({children:e}){return Fe("div",{style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:6},children:e})}function hu({tokens:e,onSpacingTokenHover:t,onModifyToken:o,onDeleteToken:n}){return!e||Object.keys(e).length===0?Fe("div",{style:{color:"#9ca3af",fontSize:11},children:"No tokens defined yet."}):Fe(Co,{children:Object.entries(e).map(([r,i])=>Xt("div",{style:{marginBottom:14},children:[Fe(mu,{children:r}),Fe($l,{entries:Li(i),categoryKey:r,rawTokens:i,onSpacingHover:t,onModifyToken:o,onDeleteToken:n})]},r))})}function yu({rules:e}){return!e||e.length===0?Fe("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."}):Fe(Co,{children:e.map((t,o)=>Xt("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[Xt("span",{style:{color:"#9ca3af",flexShrink:0},children:[o+1,"."]}),Fe("span",{children:t})]},o))})}function bu({name:e,value:t,selected:o,highlighted:n,onRemove:r,onHover:i}){var ee;let[s,l]=bn(!1),[a,c]=bn(!1),d=ko(null),p=ko(0),[u,g]=bn(0),[x,E]=bn(0),h=Li(t),w=(ee=h.find(([Z])=>Z==="description"))==null?void 0:ee[1];Eo(()=>{if(!a&&!n){g(0),E(0),p.current=0;return}let Z=ao(e);g(Z.length)},[a,n,e]),Eo(()=>{o&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[o]);let D=o||n||a,B=o?"139,92,246":"34,197,94",M=o?"#8b5cf6":"#22c55e",C=D?`rgba(${B},0.06)`:void 0,L=D?`inset 0 0 0 1.5px rgba(${B},0.35)`:void 0,k=n||a,W=vr(()=>{let Z=ao(e);if(Z.length===0)return;let F=p.current%Z.length;Z[F].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),E(F),p.current=F+1,i==null||i({name:e,instanceIndex:F})},[e,i]);return Xt("div",{ref:d,onClick:W,onMouseEnter:()=>{c(!0),i==null||i({name:e,instanceIndex:0})},onMouseLeave:()=>{c(!1),i==null||i(null)},style:{marginBottom:8,background:C,padding:6,boxShadow:L,cursor:"pointer"},children:[Xt("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[Xt("div",{style:{display:"flex",alignItems:"center",gap:6,marginBottom:6},children:[Fe("div",{style:{fontWeight:700,fontSize:11,letterSpacing:"0.05em",padding:"2px 6px",backgroundColor:k?M:"transparent",color:k?"#fff":"#6b7280"},children:e}),k&&u>1&&Xt("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[x+1,"/",u]})]}),r&&a&&Fe("button",{type:"button",title:"Remove from model",onClick:Z=>{Z.stopPropagation(),r(e)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:Z=>{Z.currentTarget.style.color="#FF0000"},onMouseLeave:Z=>{Z.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),w&&Fe("div",{style:{fontSize:11,color:k?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:w}),s?Fe($l,{entries:h.filter(([Z])=>Z!=="description"),categoryKey:""}):Fe(xu,{name:e,onNotFound:()=>l(!0),entries:h})]})}function xu({name:e,onNotFound:t}){let[o,n]=bn(null),[r,i]=bn(!1);return Eo(()=>{let s=gu(e);s||t(),n(s),i(!0)},[e,t]),!r||!o?null:Fe(Ii,{onError:t,children:Fe("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:Fe("div",{style:{zoom:.5},children:Qd(o.type,o.props)})})})}function vu({components:e,selectedComponent:t,hoveredComponent:o,onRemove:n,onHover:r}){if(!e||Object.keys(e).length===0)return Fe("div",{style:{color:"#9ca3af",fontSize:11},children:"No component patterns defined yet."});let i=new Set(Object.keys(e)),s=Wr(i),l=Object.entries(e).sort(([a],[c])=>{var d,p;return((d=s.get(a))!=null?d:1/0)-((p=s.get(c))!=null?p:1/0)});return Fe(Co,{children:l.map(([a,c])=>Fe(bu,{name:a,value:c,selected:t===a,highlighted:o===a,onRemove:n,onHover:r},a))})}function Wl({bridgeUrl:e,modelRefreshKey:t,onMouseEnter:o,onMouseLeave:n,selectedComponent:r,hoveredComponent:i,onComponentHover:s,onSpacingTokenHover:l,onModifySpacingToken:a,onDeleteSpacingToken:c,onComponentAdded:d,onComponentRemoved:p}){let[u,g]=bn(void 0),[x,E]=bn(!0),[h,w]=bn(()=>{try{let F=localStorage.getItem(Hl);if(F==="tokens"||F==="components"||F==="rules")return F}catch(F){}return"components"});Eo(()=>{no(e).then(F=>{g(F),E(!1)})},[e,t]),Eo(()=>{try{localStorage.setItem(Hl,h)}catch(F){}},[h]),Eo(()=>{r&&(w("components"),no(e).then(F=>{F&&g(F)}))},[r,e]);let D=vr((F,K)=>{g(q=>{if(!(q!=null&&q.tokens))return q;let we=JSON.parse(JSON.stringify(q.tokens)),le=F.split("."),he=we;for(let Ne=1;Ne<le.length-1;Ne++)if(he=he[le[Ne]],!he)return q;return delete he[le[le.length-1]],m(f({},q),{tokens:we})}),c==null||c(F,K)},[c]),B=vr(F=>{g(K=>{if(!(K!=null&&K.components))return K;let le=K.components,{[F]:q}=le,we=Bn(le,[Ko(F)]);return m(f({},K),{components:we})}),p==null||p(F)},[p]),M=u==null?void 0:u.tokens,C=u==null?void 0:u.components,L=u==null?void 0:u.rules,k=M&&Object.keys(M).length>0,W=C&&Object.keys(C).length>0,ee=L&&L.length>0,Z=!u||!k&&!W&&!ee;return Xt("div",{style:lu,onMouseEnter:o,onMouseLeave:n,children:[Xt("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[Fe("span",{children:"Model"}),Fe("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"M"})]}),Fe("div",{style:{display:"flex",gap:12,marginBottom:10,borderBottom:"1px solid rgba(0,0,0,0.08)",paddingBottom:6},children:["components","rules"].map(F=>Fe("button",{type:"button",style:h===F?au:_l,onClick:()=>w(F),children:F.charAt(0).toUpperCase()+F.slice(1)},F))}),Fe("div",{style:{flex:1,overflowY:"auto",minHeight:0},children:x?Fe("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):Z?Fe("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):Xt(Co,{children:[h==="components"&&Fe(vu,{components:C,selectedComponent:r,hoveredComponent:i,onRemove:B,onHover:s}),h==="tokens"&&Fe(hu,{tokens:M,onSpacingTokenHover:l,onModifyToken:a,onDeleteToken:c?D:void 0}),h==="rules"&&Fe(yu,{rules:L})]})})]})}import{jsx as Yl}from"react/jsx-runtime";var In={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#f3f4f6",bgHover:"#f9fafb",separator:"#e5e7eb"};function Ln({children:e,active:t,siblingActive:o,disabled:n,onClick:r,title:i}){let s=()=>n?.4:o&&!t?.5:1,l={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:t?In.bgActive:"transparent",color:t?In.iconActive:In.iconDefault,opacity:s()};return Yl("button",{type:"button",onClick:n?void 0:r,title:i,disabled:n,style:l,onMouseEnter:a=>{n||(a.currentTarget.style.opacity="1",t||(a.currentTarget.style.backgroundColor=In.bgHover))},onMouseLeave:a=>{n||(a.currentTarget.style.opacity=String(s()),t||(a.currentTarget.style.backgroundColor="transparent"))},onMouseDown:a=>{n||(a.currentTarget.style.transform="scale(0.95)")},onMouseUp:a=>{n||(a.currentTarget.style.transform="scale(1)")},children:e})}function Ai(){return Yl("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as Zn,jsx as ne,jsxs as xt}from"react/jsx-runtime";var qn=[{type:"rectangle",icon:Tu,label:"Rectangle",shortcut:"R"},{type:"circle",icon:Su,label:"Oval",shortcut:"O"},{type:"line",icon:Mu,label:"Line",shortcut:"L"},{type:"freehand",icon:Cu,label:"Pen",shortcut:"P"}],Ru=new Set(qn.map(e=>e.type));function Au(e,t,o,n,r,i,s,l){let a=(e-r)*(n-i)-(o-r)*(t-i),c=(e-s)*(i-l)-(r-s)*(t-l),d=(e-o)*(l-n)-(s-o)*(t-n),p=a<0||c<0||d<0,u=a>0||c>0||d>0;return!(p&&u)}function Pu(){let e=window.innerWidth-16,t=e-326,o=window.innerHeight-80;return{left:t,right:e,y:o}}var Bu=[{type:"text",icon:Lu,label:"Text",shortcut:"T"}],jl={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.
+var ba=Object.defineProperty,xa=Object.defineProperties;var va=Object.getOwnPropertyDescriptors;var Xo=Object.getOwnPropertySymbols;var fs=Object.prototype.hasOwnProperty,gs=Object.prototype.propertyIsEnumerable;var ps=(e,t,o)=>t in e?ba(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,f=(e,t)=>{for(var o in t||(t={}))fs.call(t,o)&&ps(e,o,t[o]);if(Xo)for(var o of Xo(t))gs.call(t,o)&&ps(e,o,t[o]);return e},m=(e,t)=>xa(e,va(t));var Ko=e=>typeof e=="symbol"?e:e+"",Bn=(e,t)=>{var o={};for(var n in e)fs.call(e,n)&&t.indexOf(n)<0&&(o[n]=e[n]);if(e!=null&&Xo)for(var n of Xo(e))t.indexOf(n)<0&&gs.call(e,n)&&(o[n]=e[n]);return o};import{createContext as mp,useCallback as zt,useContext as hp,useEffect as Ot,useMemo as Io,useRef as nn,useState as $t}from"react";import{useCallback as Es,useEffect as Sa,useSyncExternalStore as wa}from"react";var Sn="http://localhost:1111";function vn(e,t={},o=15e3){let n=new AbortController;t.signal&&t.signal.addEventListener("abort",()=>n.abort());let r=setTimeout(()=>n.abort(),o);return fetch(e,m(f({},t),{signal:n.signal})).finally(()=>clearTimeout(r))}async function hs(e=Sn){try{let t=await vn(`${e}/capabilities`,{},5e3);return t.ok?await t.json():null}catch(t){return null}}async function Zo(e=Sn){try{let t=new AbortController,o=setTimeout(()=>t.abort(),2e3),n=await fetch(`${e}/status`,{signal:t.signal});return clearTimeout(o),n.ok?await n.json():null}catch(t){return null}}async function ms(e){try{let t=new AbortController,o=setTimeout(()=>t.abort(),500),n=await fetch(`http://localhost:${e}/status`,{signal:t.signal});return clearTimeout(o),n.ok?await n.json():null}catch(t){return null}}async function ys(e){if(e&&e!=="http://localhost:1111")try{let c=new URL(e);return{url:e,port:parseInt(c.port,10)||1111}}catch(c){return null}let r=typeof window!="undefined"?window.location.origin:null,i=await ms(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 ms(p).then(u=>u?{status:u,port:p}:null)}),l=(await Promise.all(s)).filter(c=>c!==null),a=[];i&&a.push({port:1111,devOrigin:i.devOrigin});for(let c of l)a.push({port:c.port,devOrigin:c.status.devOrigin});if(r){let c=a.find(d=>d.devOrigin===r);if(c)return{url:`http://localhost:${c.port}`,port:c.port}}return a.length===1?{url:`http://localhost:${a[0].port}`,port:a[0].port}:i?{url:"http://localhost:1111",port:1111}:a.length>0?{url:`http://localhost:${a[0].port}`,port:a[0].port}:null}async function bs(e,t,o=Sn,n,r,i,s,l){let a=new FormData;if(a.append("screenshot",e,"screenshot.png"),a.append("feedback",t),n&&a.append("color",n),r&&a.append("provider",r),i&&a.append("model",i),l&&a.append("sourceId",l),s)for(let[d,p]of s)for(let u=0;u<p.length;u++)a.append(`image-${d}-${u}`,p[u],`image-${d}-${u}.png`);let c=await vn(`${o}/send`,{method:"POST",body:a},3e4);if(!c.ok){let d=await c.text();throw new Error(`Bridge returned ${c.status}: ${d}`)}return c.json()}async function xs(e=Sn,t){try{let o=await vn(`${e}/mcp/install`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(t?{serverUrl:t}:{})},15e3);return o.ok?await o.json():null}catch(o){return null}}async function vs(e,t=Sn){let o=await vn(`${t}/model/component`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function Ss(e,t=Sn){let o=await vn(`${t}/model/component`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function Ir(e,t,o=Sn){let n=await vn(`${o}/model/token`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e,value:t})},1e4);if(!n.ok){let r=await n.text();throw new Error(`Bridge returned ${n.status}: ${r}`)}return n.json()}async function ws(e,t=Sn){let o=await vn(`${t}/model/token`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e})},1e4);if(!o.ok){let n=await o.text();throw new Error(`Bridge returned ${o.status}: ${n}`)}return o.json()}async function no(e=Sn){var t;try{let o=await vn(`${e}/model`,{},5e3);return o.ok&&(t=(await o.json()).model)!=null?t:null}catch(o){return null}}async function ks(e,t,o=Sn,n,r,i,s,l){let a;if(s&&s.length>0){let c=new FormData,d=new Blob([new Uint8Array([137,80,78,71,13,10,26,10,0,0,0,13,73,72,68,82,0,0,0,1,0,0,0,1,8,6,0,0,0,31,21,196,137,0,0,0,10,73,68,65,84,120,156,98,0,0,0,2,0,1,229,39,222,252,0,0,0,0,73,69,78,68,174,66,96,130])],{type:"image/png"});c.append("screenshot",d,"screenshot.png"),c.append("feedback",JSON.stringify({threadId:e,reply:t,color:n,provider:r,model:i,sourceId:l}));for(let p=0;p<s.length;p++)c.append(`image-reply-${p}`,s[p],`reply-image-${p}.png`);a=await vn(`${o}/reply`,{method:"POST",body:c},3e4)}else a=await vn(`${o}/reply`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({threadId:e,reply:t,color:n,provider:r,model:i,sourceId:l})},3e4);if(!a.ok){let c=await a.text();throw new Error(`Bridge returned ${a.status}: ${c}`)}return a.json()}var Is=typeof crypto!="undefined"&&typeof crypto.randomUUID=="function"?crypto.randomUUID():Math.random().toString(36).slice(2);function Rr(){return Is}var ka={isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,lastErrorByJob:{},pendingQuestions:[],incrementalResolutions:[],capabilitiesVersion:0},qo=f({},ka),Lr=new Set,oo=null,Cs=null,_n=null,Ms=0,io=null,ro=null;async function Ea(e){return e&&e!=="http://localhost:1111"?(io=e,e):io||ro||(ro=ys(e).then(o=>{var n;return io=(n=o==null?void 0:o.url)!=null?n:null,ro=null,io}).catch(()=>(ro=null,null)),ro)}function Ls(){return io}function Ts(){return qo}function Ca(e){return Lr.add(e),()=>{Lr.delete(e)}}function Qt(e){qo=e(qo);for(let t of Lr)t()}function Rs(e){if(oo&&oo.readyState!==EventSource.CLOSED&&Cs===e)return;oo&&(oo.close(),oo=null),_n&&(clearTimeout(_n),_n=null),Cs=e;let t=++Ms,o=new EventSource(`${e}/events?sourceId=${Is}`);oo=o;let n=()=>t!==Ms;o.addEventListener("connected",()=>{n()||Zo(e).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)),l=(p=r==null?void 0:r.recentJobs)!=null?p:[],a=new Map(l.map(u=>[u.id,u])),c=i.length>0;Qt(u=>{let g=f({},u.lastErrorByJob),x=u.activeJobIds.filter(h=>!s.has(h));for(let h of x){let w=a.get(h);(w==null?void 0:w.status)==="error"&&w.error&&(g[h]=w.error)}let E=u.activeJobIds.filter(h=>s.has(h));for(let h of s)E.includes(h)||E.push(h);return m(f({},u),{isConnected:!0,status:c?"streaming":x.length>0||u.status==="disconnected"?"idle":u.status,activeJobId:c?i[i.length-1].id:E.length>0?E[E.length-1]:null,activeJobIds:E,lastErrorByJob:g,lastCompletedJobId:x.length>0?x[x.length-1]:u.lastCompletedJobId})})})}),o.addEventListener("job_started",r=>{if(n())return;let i=JSON.parse(r.data),s=i.jobId;Qt(l=>m(f({},l),{status:"streaming",activeJobId:s,activeJobIds:[...l.activeJobIds,s],jobResponses:m(f({},l.jobResponses),{[s]:""}),jobThinking:m(f({},l.jobThinking),{[s]:""}),currentResponse:"",currentThinking:"",lastResponseText:null,lastThreadId:null,events:[...l.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,l=i.text||"";Qt(a=>m(f({},a),{jobResponses:s?m(f({},a.jobResponses),{[s]:(a.jobResponses[s]||"")+l}):a.jobResponses,currentResponse:!s||s===a.activeJobId?a.currentResponse+l:a.currentResponse,events:[...a.events,{type:"delta",data:i,timestamp:Date.now()}]}))}),o.addEventListener("thinking",r=>{if(n())return;let i=JSON.parse(r.data),s=i.jobId,l=i.text||"";Qt(a=>m(f({},a),{jobThinking:s?m(f({},a.jobThinking),{[s]:(a.jobThinking[s]||"")+l}):a.jobThinking,currentThinking:!s||s===a.activeJobId?a.currentThinking+l:a.currentThinking,events:[...a.events,{type:"thinking",data:i,timestamp:Date.now()}]}))}),o.addEventListener("tool_use",r=>{if(n())return;let i=JSON.parse(r.data);Qt(s=>m(f({},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;Qt(l=>{var g;let a=s?l.activeJobIds.filter(x=>x!==s):l.activeJobIds,c=f({},l.jobResponses),d=f({},l.jobThinking),p=s?c[s]:void 0;s&&(delete c[s],delete d[s]);let u=s===l.activeJobId?a.length>0?a[a.length-1]:null:l.activeJobId;return m(f(m(f({},l),{activeJobIds:a,activeJobId:u,jobResponses:c,jobThinking:d,lastCompletedJobId:s!=null?s:l.activeJobId,lastResponseText:p||l.currentResponse||i.responseText||null,lastThreadId:(g=i.threadId)!=null?g:null}),s===l.activeJobId?{currentResponse:u&&c[u]||"",currentThinking:u&&d[u]||""}:{}),{events:[...l.events,{type:"done",data:i,timestamp:Date.now()}]})})}),o.addEventListener("question",r=>{if(n())return;let i=JSON.parse(r.data);Qt(s=>m(f({},s),{pendingQuestions:[...s.pendingQuestions,{jobId:i.jobId,threadId:i.threadId,question:i.question,annotationIds:i.annotationIds,timestamp:Date.now()}],events:[...s.events,{type:"question",data:i,timestamp:Date.now()}]}))}),o.addEventListener("capabilities_changed",()=>{n()||Qt(r=>m(f({},r),{capabilitiesVersion:r.capabilitiesVersion+1}))}),o.addEventListener("queue_drained",()=>{n()||Qt(r=>m(f({},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)Qt(l=>m(f({},l),{isConnected:!1,status:"disconnected"})),_n&&(clearTimeout(_n),_n=null),_n=setTimeout(()=>{Zo(e).then(l=>{l&&Rs(e)})},5e3);else if(r instanceof MessageEvent){let l=JSON.parse(r.data),a=(i=l.jobId)!=null?i:null,c=(s=l.message)!=null?s:"";Qt(d=>{let p=a?d.activeJobIds.filter(g=>g!==a):d.activeJobIds,u=p.length>0?d.status:"error";return m(f({},d),{status:u,activeJobIds:p,lastCompletedJobId:a!=null?a:d.activeJobId,lastErrorByJob:a&&c?m(f({},d.lastErrorByJob),{[a]:c}):d.lastErrorByJob,events:[...d.events,{type:"error",data:l,timestamp:Date.now()}]})})}}}),o.onerror=()=>{n()||o.readyState===EventSource.CLOSED&&Qt(r=>m(f({},r),{isConnected:!1,status:"disconnected"}))}}function As(e="http://localhost:1111"){let t=wa(Ca,Ts,Ts);Sa(()=>{Ea(e).then(r=>{r&&Zo(r).then(i=>{i&&Rs(r)})})},[e]);let o=Es(()=>{Qt(()=>m(f({},qo),{events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,lastErrorByJob:{},incrementalResolutions:[]}))},[]),n=Es(r=>{Qt(i=>m(f({},i),{pendingQuestions:i.pendingQuestions.filter(s=>s.threadId!==r)}))},[]);return m(f({},t),{clearEvents:o,dismissQuestion:n})}import{useEffect as Ma,useReducer as Ta}from"react";var Ia={isAnnotating:!1,activeTool:"inspector",activeColor:"#ff0000",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function Qo(){return Math.random().toString(36).substring(2,9)}function Ps(e){return e.status?e:e.captured?m(f({},e),{status:"in_flight"}):m(f({},e),{status:"pending"})}function Ut(e){return m(f({},e),{undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}],redoStack:[]})}function La(e,t){return m(f({},e),{isAnnotating:t})}function Ra(e,t){return m(f({},e),{activeTool:t,inspectedElement:null})}function Aa(e,t){return m(f({},e),{activeColor:t})}function Pa(e,t){return m(f({},e),{strokeWidth:t})}function Ba(e,t){return m(f({},e),{currentPath:[t]})}function Oa(e,t){return m(f({},e),{currentPath:[...e.currentPath,t]})}function Da(e){return m(f({},e),{currentPath:[]})}function Fa(e,t){if(e.currentPath.length<2&&e.activeTool!=="text")return m(f({},e),{currentPath:[]});let o={id:Qo(),type:e.activeTool,points:e.currentPath,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",groupId:t==null?void 0:t.groupId,elements:t==null?void 0:t.elements},n=Ut(e);return m(f({},n),{annotations:[...e.annotations,o],currentPath:[]})}function Na(e,t){var r;let o=f({id:(r=t.id)!=null?r:Qo(),type:"text",points:[t.point],text:t.text,fontSize:t.fontSize||12,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",groupId:t.groupId,linkedSelector:t.linkedSelector,linkedAnchor:t.linkedAnchor,elements:t.elements},t.imageCount?{imageCount:t.imageCount}:{}),n=t.groupId?e:Ut(e);return m(f({},n),{annotations:[...e.annotations,o]})}function Ha(e,t){let o=Ut(e);return m(f({},o),{annotations:e.annotations.map(n=>n.id===t.id?f(m(f({},n),{text:t.text}),t.imageCount!=null?{imageCount:t.imageCount}:{}):n)})}function za(e,t){return m(f({},e),{annotations:e.annotations.map(o=>o.id===t.id?m(f({},o),{fontSize:Math.max(12,Math.min(72,t.fontSize))}):o)})}function _a(e,t){let o=Ut(e),n=e.annotations.find(i=>i.id===t.id),r=n==null?void 0:n.groupId;return m(f({},o),{annotations:e.annotations.filter(i=>i.id!==t.id&&!(r&&i.groupId===r))})}function $a(e,t){let o=t.saveUndo?Ut(e):e,n=e.annotations.find(i=>i.id===t.id),r=n==null?void 0:n.groupId;return m(f({},o),{annotations:e.annotations.map(i=>{if(!(i.id===t.id||r&&i.groupId===r))return i;let l=t.delta.x,a=t.delta.y;return m(f({},i),{points:i.points.map(c=>({x:c.x+l,y:c.y+a}))})})})}function Wa(e,t){let o=t.saveUndo?Ut(e):e,n=e.annotations.find(s=>s.id===t.id);if(!n||n.type==="text"||n.points.length<2)return e;let r=0,i=0;if(n.type==="rectangle"&&n.groupId){let s=t.points,l=Math.min(s[0].x,s[1].x),a=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=l-p,i=a-u}return m(f({},o),{annotations:e.annotations.map(s=>s.id===t.id?m(f({},s),{points:t.points}):n.groupId&&s.groupId===n.groupId&&s.type==="text"?m(f({},s),{points:s.points.map(l=>({x:l.x+r,y:l.y+i}))}):s)})}function Ya(e,t){let o=Ut(e);return m(f({},o),{annotations:[...e.annotations,...t.annotations.map(Ps)]})}function ja(e,t){let o=new Set,n=[];for(let r of t.annotations)o.has(r.id)||(o.add(r.id),n.push(Ps(r)));return m(f({},e),{annotations:n})}function Ga(e){if(e.undoStack.length===0)return e;let t=e.undoStack[e.undoStack.length-1];return m(f({},e),{annotations:(t==null?void 0:t.annotations)||[],styleModifications:(t==null?void 0:t.styleModifications)||[],spacingTokenMods:(t==null?void 0:t.spacingTokenMods)||[],undoStack:e.undoStack.slice(0,-1),redoStack:[...e.redoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}]})}function Va(e){if(e.redoStack.length===0)return e;let t=e.redoStack[e.redoStack.length-1];return m(f({},e),{annotations:(t==null?void 0:t.annotations)||[],styleModifications:(t==null?void 0:t.styleModifications)||[],spacingTokenMods:(t==null?void 0:t.spacingTokenMods)||[],redoStack:e.redoStack.slice(0,-1),undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}]})}function Ua(e,t){let{id:o,addToSelection:n}=t;if(o===null)return m(f({},e),{selectedAnnotationIds:[],lastSelectedId:null});if(n)if(e.selectedAnnotationIds.includes(o)){let i=e.selectedAnnotationIds.filter(s=>s!==o);return m(f({},e),{selectedAnnotationIds:i,lastSelectedId:i.length>0?i[i.length-1]:null})}else return m(f({},e),{selectedAnnotationIds:[...e.selectedAnnotationIds,o],lastSelectedId:o});return m(f({},e),{selectedAnnotationIds:[o],lastSelectedId:o})}function Ja(e,t){let o=new Set;for(let n of e.selectedAnnotationIds){let r=e.annotations.find(i=>i.id===n);r!=null&&r.groupId&&o.add(r.groupId)}return m(f({},e),{annotations:e.annotations.map(n=>{let r=e.selectedAnnotationIds.includes(n.id),i=n.groupId&&o.has(n.groupId);return!r&&!i?n:m(f({},n),{color:t.color})})})}function Xa(e){return m(f({},e),{annotations:e.annotations.map(t=>m(f({},t),{captured:!0,status:t.status==="pending"||!t.status?"in_flight":t.status})),styleModifications:e.styleModifications.map(t=>m(f({},t),{captured:!0})),spacingTokenChanges:e.spacingTokenChanges.map(t=>m(f({},t),{captured:!0}))})}function Ka(e){return m(f({},e),{annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]})}function Za(e,t){return m(f({},e),{inspectedElement:t})}function qa(e,t){let{selector:o,element:n,property:r,original:i,modified:s}=t,l=e.styleModifications.findIndex(a=>a.selector===o);if(i===s&&l<0)return e;if(l>=0){let a=e.styleModifications[l];if(a.captured){let g=Ut(e),x=g.styleModifications.map((E,h)=>h===l?m(f({},E),{changes:[{property:r,original:i,modified:s}],captured:!1}):E);return m(f({},g),{styleModifications:x})}let c=a.changes.findIndex(g=>g.property===r),d,p=e;if(c>=0){let g=a.changes[c];s===g.original?d=a.changes.filter((x,E)=>E!==c):d=a.changes.map((x,E)=>E===c?m(f({},x),{modified:s}):x)}else{if(i===s)return e;p=Ut(e),d=[...a.changes,{property:r,original:i,modified:s}]}if(d.length===0)return m(f({},p),{styleModifications:p.styleModifications.filter((g,x)=>x!==l)});let u=p.styleModifications.map((g,x)=>x===l?m(f({},g),{changes:d}):g);return m(f({},p),{styleModifications:u})}else{let a=Ut(e),c={selector:o,element:n,changes:[{property:r,original:i,modified:s}]};return m(f({},a),{styleModifications:[...a.styleModifications,c]})}}function Qa(e,t){let{selector:o,durableSelector:n,element:r,changes:i}=t,s=i.filter(c=>c.original!==c.modified);if(s.length===0)return e;let l=Ut(e),a=l.styleModifications.findIndex(c=>c.selector===o);if(a>=0){let c=l.styleModifications[a],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,x)=>x!==u):d=d.map((g,x)=>x===u?m(f({},g),{modified:p.modified}):g):d.push(p)}return d.length===0?m(f({},l),{styleModifications:l.styleModifications.filter((p,u)=>u!==a)}):m(f({},l),{styleModifications:l.styleModifications.map((p,u)=>u===a?m(f({},p),{changes:d,captured:!1}):p)})}else return m(f({},l),{styleModifications:[...l.styleModifications,{selector:o,durableSelector:n,element:r,changes:s}]})}function ec(e,t){let{selector:o,property:n}=t,r=Ut(e),i=r.styleModifications.map(s=>s.selector!==o?s:m(f({},s),{changes:s.changes.filter(l=>l.property!==n)})).filter(s=>s.changes.length>0);return m(f({},r),{styleModifications:i})}function tc(e){if(e.styleModifications.length===0)return m(f({},e),{inspectedElement:null});let t=Ut(e);return m(f({},t),{styleModifications:[],inspectedElement:null})}function nc(e,t){return m(f({},e),{styleModifications:t})}function oc(e,t){let{updates:o}=t,n=new Map(o.map(r=>[r.id,r]));return m(f({},e),{annotations:e.annotations.map(r=>{let i=n.get(r.id);return i?f(m(f({},r),{points:[i.point,...r.points.slice(1)]}),i.linkedAnchor?{linkedAnchor:i.linkedAnchor}:{}):r})})}function rc(e,t){let o=new Set(t.ids);return m(f({},e),{annotations:e.annotations.map(n=>o.has(n.id)?m(f({},n),{status:t.status}):n)})}function ic(e,t){let o=new Set(t.ids),n=new Set;for(let r of e.annotations)o.has(r.id)&&r.groupId&&n.add(r.groupId);return m(f({},e),{annotations:e.annotations.map(r=>o.has(r.id)||r.groupId&&n.has(r.groupId)?m(f({},r),{threadId:t.threadId}):r)})}function sc(e,t){let o=new Set(t.ids),n=new Set;for(let r of e.annotations)o.has(r.id)&&r.groupId&&n.add(r.groupId);return m(f({},e),{annotations:e.annotations.map(r=>o.has(r.id)||r.groupId&&n.has(r.groupId)?m(f({},r),{status:"waiting_input",question:t.question,threadId:t.threadId}):r)})}function lc(e,t){let o=new Map(t.resolutions.map(r=>[r.annotationId,r])),n=new Map;for(let r of e.annotations){let i=o.get(r.id);i&&r.groupId&&n.set(r.groupId,i)}return m(f({},e),{annotations:e.annotations.map(r=>{var s,l,a;let i=o.get(r.id)||(r.groupId?n.get(r.groupId):void 0);return i?m(f({},r),{status:i.status,resolutionSummary:i.summary,scope:(l=(s=i.finalScope)!=null?s:i.inferredScope)!=null?l:null,replyCount:((a=r.replyCount)!=null?a:0)+1,question:void 0,threadId:r.threadId||t.threadId}):r})})}function ac(e,t){let{linkedSelectors:o,styleSelectors:n}=t,r=new Set(o),i=new Set(n),s=new Set,l=new Set;for(let u of e.annotations)u.linkedSelector&&r.has(u.linkedSelector)&&(s.add(u.id),u.groupId&&l.add(u.groupId));for(let u of e.annotations)u.groupId&&l.has(u.groupId)&&s.add(u.id);let a=e.annotations.filter(u=>!s.has(u.id)),c=e.styleModifications.filter(u=>!i.has(u.selector));if(a.length===e.annotations.length&&c.length===e.styleModifications.length)return e;let d=e.selectedAnnotationIds.filter(u=>!s.has(u)),p=e.inspectedElement&&i.has(e.inspectedElement.info.selector)?null:e.inspectedElement;return m(f({},e),{annotations:a,styleModifications:c,selectedAnnotationIds:d,lastSelectedId:d.length>0?d[d.length-1]:null,inspectedElement:p})}function cc(e,t){let o=e.spacingTokenChanges.findIndex(n=>n.tokenPath===t.tokenPath);return o>=0?m(f({},e),{spacingTokenChanges:e.spacingTokenChanges.map((n,r)=>r===o?t:n)}):m(f({},e),{spacingTokenChanges:[...e.spacingTokenChanges,t]})}function dc(e,t){return m(f({},e),{spacingTokenChanges:t})}function uc(e,t){let o=Ut(e),n=e.spacingTokenMods.findIndex(i=>i.tokenPath===t.tokenPath),r;if(n>=0){let i=e.spacingTokenMods[n],s=m(f({},t),{originalValue:i.originalValue,originalPx:i.originalPx});r=e.spacingTokenMods.map((l,a)=>a===n?s:l)}else r=[...e.spacingTokenMods,t];return m(f({},o),{spacingTokenMods:r})}function pc(e,t){let o=Ut(e),n=e.spacingTokenMods.findIndex(a=>a.tokenPath===t.tokenPath),r=n>=0?e.spacingTokenMods[n].originalValue:t.originalValue,i=n>=0?e.spacingTokenMods[n].originalPx:parseFloat(t.originalValue)||0,s={tokenPath:t.tokenPath,originalValue:r,currentValue:"__deleted__",targets:n>=0?e.spacingTokenMods[n].targets:[],originalPx:i,currentPx:0},l;return n>=0?l=e.spacingTokenMods.map((a,c)=>c===n?s:a):l=[...e.spacingTokenMods,s],m(f({},o),{spacingTokenMods:l})}var fc={SET_ANNOTATING:La,SET_TOOL:Ra,SET_COLOR:Aa,SET_STROKE_WIDTH:Pa,START_PATH:Ba,CONTINUE_PATH:Oa,CANCEL_PATH:Da,FINISH_PATH:Fa,ADD_TEXT:Na,UPDATE_TEXT:Ha,UPDATE_TEXT_SIZE:za,DELETE_ANNOTATION:_a,MOVE_ANNOTATION:$a,RESIZE_ANNOTATION:Wa,PASTE_ANNOTATIONS:Ya,RESTORE_ANNOTATIONS:ja,UNDO:Ga,REDO:Va,SELECT_ANNOTATION:Ua,UPDATE_ANNOTATION_COLOR:Ja,MARK_CAPTURED:Xa,CLEAR:Ka,SELECT_ELEMENT:Za,MODIFY_STYLE:qa,MODIFY_STYLES_BATCH:Qa,CLEAR_STYLE:ec,CLEAR_ALL_STYLES:tc,RESTORE_STYLE_MODIFICATIONS:nc,UPDATE_LINKED_POSITIONS:oc,CLEANUP_ORPHANED:ac,SET_ANNOTATION_STATUS:rc,SET_ANNOTATION_THREAD:ic,SET_ANNOTATION_QUESTION:sc,APPLY_RESOLUTIONS:lc,ADD_SPACING_TOKEN_CHANGE:cc,RESTORE_SPACING_TOKEN_CHANGES:dc,MODIFY_SPACING_TOKEN:uc,DELETE_SPACING_TOKEN:pc};function gc(e,t){let o=fc[t.type];return o?o(e,t.payload):e}function Bs(){let[e,t]=Ta(gc,Ia);return Ma(()=>{let o=n=>{(n.metaKey||n.ctrlKey)&&n.key==="z"&&(n.preventDefault(),n.shiftKey?t({type:"REDO"}):t({type:"UNDO"}))};return window.addEventListener("keydown",o),()=>window.removeEventListener("keydown",o)},[]),[e,t]}import{domToCanvas as mc}from"modern-screenshot";function Ar(e){let t=document.createElement("canvas").getContext("2d");return t?(t.fillStyle=e,t.fillStyle):"#888888"}function Pr(e,t=[],o,n){let r=new Map,i=[];for(let l of e)if(l.groupId){let a=r.get(l.groupId)||[];a.push(l),r.set(l.groupId,a)}else i.push(l);let s=[];for(let[l,a]of r){let c=a.find(p=>p.type!=="text"),d=a.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(f(m(f({id:c.id,type:c.type,instruction:d==null?void 0:d.text},p?{linkedSelector:p}:{}),{elements:c.elements||[]}),u?{imageCount:u}:{}))}}for(let l of i)s.push(f(m(f({id:l.id,type:l.type,instruction:l.type==="text"?l.text:void 0},l.linkedSelector?{linkedSelector:l.linkedSelector}:{}),{elements:l.elements||[]}),l.imageCount?{imageCount:l.imageCount}:{}));return f(f({timestamp:new Date().toISOString(),url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},scrollPosition:{x:window.scrollX,y:window.scrollY},annotations:s,styleModifications:t},o?{inspectedElement:o}:{}),n&&n.length>0?{spacingTokenChanges:n}:{})}function hc(e){if(!e.points||e.points.length===0)return null;let t=e.points.map(n=>n.x),o=e.points.map(n=>n.y);return{minX:Math.min(...t),minY:Math.min(...o),maxX:Math.max(...t),maxY:Math.max(...o)}}function yc(e,t){if(e.length===0)return[];let o=e.map(d=>({annotation:d,bounds:hc(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<=t){let d=(n+r)/2,p=Math.max(0,d-t/2);return[{top:p,bottom:p+t,annotations:e}]}let i=[],s=50,l=Math.max(0,n-s),a=[],c=l;for(let{annotation:d,bounds:p}of o){let u=p.maxY+s;if(u-l<=t)a.push(d),c=Math.max(c,u);else{if(a.length>0){let g=(l+c)/2,x=Math.max(0,g-t/2);i.push({top:x,bottom:x+t,annotations:a})}l=Math.max(0,p.minY-s),a=[d],c=p.maxY+s}}if(a.length>0){let d=(l+c)/2,p=Math.max(0,d-t/2);i.push({top:p,bottom:p+t,annotations:a})}return i}function bc(e,t,o,n){e.save(),e.scale(n,n);for(let r of t){let i=r.points.map(s=>({x:s.x,y:s.y-o}));switch(e.strokeStyle=r.color,e.fillStyle=r.color,e.lineWidth=r.strokeWidth,e.lineCap="round",e.lineJoin="round",r.type){case"freehand":if(i.length<2)break;e.beginPath(),e.moveTo(i[0].x,i[0].y);for(let s=1;s<i.length;s++)e.lineTo(i[s].x,i[s].y);e.stroke();break;case"line":if(i.length<2)break;e.beginPath(),e.moveTo(i[0].x,i[0].y),e.lineTo(i[i.length-1].x,i[i.length-1].y),e.stroke();break;case"rectangle":{if(i.length<2)break;let s=i[0],l=i[i.length-1],a=Math.min(s.x,l.x),c=Math.min(s.y,l.y),d=Math.abs(l.x-s.x),p=Math.abs(l.y-s.y);e.strokeRect(a,c,d,p);break}case"circle":{if(i.length<2)break;let s=i[0],l=i[i.length-1],a=(s.x+l.x)/2,c=(s.y+l.y)/2,d=Math.abs(l.x-s.x)/2,p=Math.abs(l.y-s.y)/2;e.beginPath(),e.ellipse(a,c,d,p,0,0,Math.PI*2),e.stroke();break}case"text":{if(!r.text||i.length<1)break;let s=i[0],l=r.fontSize||16;e.font=`${l}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`,e.fillStyle=r.color;let c=(r.imageCount&&r.imageCount>0?`[${r.imageCount} image${r.imageCount>1?"s":""}] ${r.text}`:r.text).split(`
+`),d=l*1.2,p=4,u=0;for(let g of c)u=Math.max(u,e.measureText(g).width);e.fillRect(s.x-p,s.y-p,u+p*2,c.length*d+p*2),e.fillStyle="#ffffff",c.forEach((g,x)=>{e.fillText(g,s.x,s.y+l+x*d)});break}}}e.restore()}async function Br(e,t,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 l=yc(s,i);if(l.length===0){let c=await Os(e,[],window.scrollY,r,i,n);return c?[c]:[]}let a=[];for(let c=0;c<l.length;c++){let d=l[c],p=await Os(e,d.annotations,d.top,r,i,n);p?a.push(p):console.warn(`[Screenshot] Region ${c+1} failed to capture`)}return console.log("[Screenshot] Capture complete"),a}catch(n){return console.error("[Screenshot] Capture failed:",n),[]}}async function Os(e,t,o,n,r,i){try{let s=await mc(e,{filter:c=>!(c instanceof HTMLElement&&(c.id==="devtools-canvas"||c.id==="devtools-toolbar"||c.id==="devtools-scrim"||c.dataset.devtools!==void 0)),scale:i,backgroundColor:"#ffffff",width:n,height:r,style:{transform:`translate(${-window.scrollX}px, ${-o}px)`}}),l=document.createElement("canvas");l.width=n*i,l.height=r*i;let a=l.getContext("2d");return a?(a.drawImage(s,0,0,n*i,r*i,0,0,n*i,r*i),bc(a,t,o,i),new Promise(c=>{l.toBlob(d=>c(d),"image/png")})):null}catch(s){return console.error("Region capture failed:",s),null}}async function Or(e){if(e.length===0)return null;if(e.length===1)return e[0];let t=await Promise.all(e.map(l=>new Promise((a,c)=>{let d=new Image;d.onload=()=>a(d),d.onerror=c,d.src=URL.createObjectURL(l)}))),o=t[0].width,n=t.reduce((l,a)=>l+a.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 l of t)i.drawImage(l,0,s),s+=l.height,URL.revokeObjectURL(l.src);return new Promise(l=>{r.toBlob(a=>l(a),"image/png")})}async function Ds(e,t,o){try{let n=Array.isArray(e)?e:[e];if(n.length===0)return!1;let r=await Or(n);if(!r)return!1;let i={"image/png":r},s=t&&t.length>0,l=o&&o.length>0;if(s||l){let a=t?t.filter(c=>{var d;return((d=c.status)!=null?d:"pending")==="pending"}):[];if(a.length>0||l){let c=Pr(a,o||[]),d=new Blob([JSON.stringify(c,null,2)],{type:"text/plain"});i["text/plain"]=d}}return await navigator.clipboard.write([new ClipboardItem(i)]),!0}catch(n){return console.warn("Clipboard write failed:",n),!1}}import{useCallback as Pt,useEffect as _t,useMemo as Ci,useRef as kt,useState as st}from"react";import{useCallback as lo,useRef as vc}from"react";function Dr(e,t,o,n){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!r||!i)return;let s=(r.x+i.x)/2,l=(r.y+i.y)/2,a=Math.abs(i.x-r.x)/2,c=Math.abs(i.y-r.y)/2;e.beginPath(),e.strokeStyle=o,e.lineWidth=n,e.ellipse(s,l,a,c,0,0,Math.PI*2),e.stroke()}function Fr(e,t,o,n){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!(!r||!i)){e.beginPath(),e.strokeStyle=o,e.lineWidth=n,e.lineCap="round",e.lineJoin="round",e.moveTo(r.x,r.y);for(let s=1;s<t.length-1;s++){let l=t[s],a=t[s+1];if(!l||!a)continue;let c=(l.x+a.x)/2,d=(l.y+a.y)/2;e.quadraticCurveTo(l.x,l.y,c,d)}e.lineTo(i.x,i.y),e.stroke()}}function Nr(e,t,o,n){if(t.length<2)return;let r=t[0],i=t[t.length-1];!r||!i||(e.beginPath(),e.strokeStyle=o,e.lineWidth=n,e.lineCap="round",e.moveTo(r.x,r.y),e.lineTo(i.x,i.y),e.stroke())}function Hr(e,t,o,n){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!r||!i)return;let s=Math.min(r.x,i.x),l=Math.min(r.y,i.y),a=Math.abs(i.x-r.x),c=Math.abs(i.y-r.y);e.beginPath(),e.strokeStyle=o,e.lineWidth=n,e.lineCap="round",e.lineJoin="round",e.strokeRect(s,l,a,c)}var Ft='"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';function xc(e,t,o){if(!t||e.measureText(t).width<=o)return[t];let n=t.split(/\s+/),r=[],i="";for(let s of n){let l=i?i+" "+s:s;i&&e.measureText(l).width>o?(r.push(i),i=s):i=l}return i&&r.push(i),r.length>0?r:[t]}function so(e){let t=window.innerWidth-e-16;if(t<400)return Math.max(60,t)}function $n(e,t,o){let n=[];for(let r of t)n.push(...xc(e,r,o));return n}function Fs(e,t,o,n,r=12,i,s){if(!o)return;let l=r*1.4,a=o.split(`
+`),c=i!==void 0?[i+". "+(a[0]||""),...a.slice(1)]:a;e.font=`${r}px ${Ft}`,e.textBaseline="middle";let d=s!==void 0?Math.min(400,Math.max(60,window.innerWidth-s-16)):400,p=$n(e,c,d),u=Math.min(d,Math.max(...p.map(w=>e.measureText(w).width))),g=p.length*l,x=c.length*l,E=g-x,h=t.y-E;e.fillStyle=n,e.fillRect(t.x-4,h-4,u+8,g+8),e.fillStyle="#ffffff",p.forEach((w,D)=>{e.fillText(w,t.x,h+D*l+l/2)})}var Ns=11,zr=4,Sc=`600 ${Ns}px system-ui, -apple-system, sans-serif`;function _r(e,t,o){return e.map(n=>({x:n.x-t,y:n.y-o}))}function wc(e,t,o,n,r,i){let s=String(n);e.font=Sc;let a=e.measureText(s).width+zr*2,c=Ns+zr*2,d=t-a/2,p=o+i/2+2;e.fillStyle=r,e.fillRect(d,p,a,c),e.fillStyle="#ffffff",e.textBaseline="middle",e.fillText(s,d+zr,p+c/2)}function kc(e,t){if(e.points.length<2&&e.type!=="text")return null;switch(e.type){case"rectangle":case"freehand":{let o,n;if(e.type==="freehand")o=Math.min(...e.points.map(r=>r.x)),n=Math.max(...e.points.map(r=>r.y));else{let r=e.points[0],i=e.points[e.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=e.points[0],n=e.points[e.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=e.points[0],n=e.points[e.points.length-1],r=o.y>n.y?o:n;return{x:r.x,y:r.y}}default:return null}}function Hs(){let e=vc(null),t=lo(()=>{let l=e.current;if(!l)return;let a=l.getContext("2d");a&&a.clearRect(0,0,l.width,l.height)},[]),o=lo((l,a,c)=>{var x;let d=e.current;if(!d)return;let p=d.getContext("2d");if(!p)return;let g=((x=l.status)!=null?x:l.captured?"in_flight":"pending")==="pending"||c?l.color:"#999999";switch(l.type){case"freehand":Fr(p,l.points,g,l.strokeWidth);break;case"line":Nr(p,l.points,g,l.strokeWidth);break;case"rectangle":Hr(p,l.points,g,l.strokeWidth);break;case"circle":Dr(p,l.points,g,l.strokeWidth);break;case"text":l.text&&l.points[0]&&Fs(p,l.points[0],l.text,g,l.fontSize,a,l.points[0].x);break}},[]),n=lo((l,a,c,d)=>{let p=e.current;if(!p||l.length<2)return;let u=p.getContext("2d");if(u)switch(a){case"freehand":Fr(u,l,c,d);break;case"line":Nr(u,l,c,d);break;case"rectangle":Hr(u,l,c,d);break;case"circle":Dr(u,l,c,d);break}},[]),r=lo((l,a)=>{let c=e.current;if(!c||l.points.length<2)return;let d=c.getContext("2d");if(d){if(d.fillStyle="#ffffff",d.strokeStyle=l.color,d.lineWidth=1.5,l.type==="line"){let p=l.points[0],u=l.points[l.points.length-1];[p,u].forEach(g=>{d.beginPath(),d.arc(g.x,g.y,a/2,0,Math.PI*2),d.fill(),d.stroke()});return}if(l.type==="circle"){let p=l.points[0],u=l.points[l.points.length-1],g=Math.min(p.x,u.x),x=Math.max(p.x,u.x),E=Math.min(p.y,u.y),h=Math.max(p.y,u.y),w=(g+x)/2,D=(E+h)/2;[{x:w,y:E},{x:w,y:h},{x:g,y:D},{x,y:D}].forEach(M=>{d.beginPath(),d.rect(M.x-a/2,M.y-a/2,a,a),d.fill(),d.stroke()});return}if(l.type==="rectangle"||l.type==="freehand"){let p,u,g,x;if(l.type==="freehand")p=Math.min(...l.points.map(h=>h.x)),u=Math.max(...l.points.map(h=>h.x)),g=Math.min(...l.points.map(h=>h.y)),x=Math.max(...l.points.map(h=>h.y));else{let h=l.points[0],w=l.points[l.points.length-1];p=Math.min(h.x,w.x),u=Math.max(h.x,w.x),g=Math.min(h.y,w.y),x=Math.max(h.y,w.y)}[{x:p,y:g},{x:u,y:g},{x:p,y:x},{x:u,y:x}].forEach(h=>{d.beginPath(),d.rect(h.x-a/2,h.y-a/2,a,a),d.fill(),d.stroke()})}}},[]),i=lo((l,a,c,d,p,u,g,x=0,E=0,h,w)=>{var D;if(t(),l.forEach(B=>{var k;let M=m(f({},B),{points:_r(B.points,x,E)}),C=h==null?void 0:h.get(B.id),L=(k=w==null?void 0:w.has(B.id))!=null?k:!1;o(M,C,L)}),a.length>0){let B=_r(a,x,E);n(B,c,d,p)}if(u&&u.length>0&&g){let B=e.current,M=B==null?void 0:B.getContext("2d");for(let C of u){let L=l.find(k=>k.id===C);if(L){let k=m(f({},L),{points:_r(L.points,x,E)});if(r(k,g),M&&L.type!=="text"&&h&&!(L.groupId&&l.some(ee=>ee.groupId===L.groupId&&ee.type==="text"))){let ee=h.get(L.id);if(ee!==void 0){let Z=kc(k,g);if(Z){let K=((D=L.status)!=null?D:L.captured?"in_flight":"pending")==="pending"?L.color:"#999999";wc(M,Z.x,Z.y,ee,K,g)}}}}}}},[t,o,n,r]),s=lo(()=>{let l=e.current;if(!l)return;let a=window.devicePixelRatio||1;l.width=window.innerWidth*a,l.height=window.innerHeight*a;let c=l.getContext("2d");c&&c.scale(a,a)},[]);return{canvasRef:e,clearCanvas:t,drawAnnotation:o,drawCurrentPath:n,redrawAll:i,resizeCanvas:s}}import{useEffect as Ec,useRef as Cc}from"react";function zs(){let e=Cc({shift:!1,cmd:!1});return Ec(()=>{let t=r=>{r.key==="Shift"&&(e.current.shift=!0),(r.key==="Meta"||r.key==="Control")&&(e.current.cmd=!0)},o=r=>{r.key==="Shift"&&(e.current.shift=!1),(r.key==="Meta"||r.key==="Control")&&(e.current.cmd=!1)},n=()=>{e.current={shift:!1,cmd:!1}};return window.addEventListener("keydown",t,!0),window.addEventListener("keyup",o,!0),window.addEventListener("blur",n),()=>{window.removeEventListener("keydown",t,!0),window.removeEventListener("keyup",o,!0),window.removeEventListener("blur",n)}},[]),e}import{useEffect as Mc}from"react";function _s(e,t,o,n,r){Mc(()=>{let i=s=>{if(e){if(e.linkedSelector)return;s.preventDefault(),s.stopPropagation();let a=s.deltaY>0?-2:2;t(c=>c?m(f({},c),{fontSize:Math.max(12,Math.min(72,c.fontSize+a))}):null);return}if(!o)return;s.preventDefault();let l=n.find(a=>a.id===o);if(l&&l.type==="text"&&!l.linkedSelector){let a=l.fontSize||12,c=s.deltaY>0?-2:2;r({type:"UPDATE_TEXT_SIZE",payload:{id:o,fontSize:a+c}})}};return window.addEventListener("wheel",i,{passive:!1}),()=>{window.removeEventListener("wheel",i)}},[o,e,n,r,t])}import{useCallback as el,useEffect as cr,useRef as tl,useState as No}from"react";function er(e){let t=Object.keys(e).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!t)return null;let o=e[t],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(e){let t=Object.keys(e).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!t)return[];let o=e[t],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 tr(e){let t=e,o=new Set;for(;t&&!o.has(t);){if(o.add(t),t.stateNode instanceof Element)return t.stateNode;t.child?t=t.child:t=null}return null}function $s(e){if(e.id)return`#${e.id}`;let t=e.tagName.toLowerCase(),o=Array.from(e.classList).slice(0,3).join(".");return o?`${t}.${o}`:t}function on(e){if(e.id&&!e.id.startsWith("radix-")&&!e.id.startsWith(":"))return`#${CSS.escape(e.id)}`;let t=[],o=e;for(;o&&o!==document.documentElement;){let n=o.tagName.toLowerCase();if(o.id&&!o.id.startsWith("radix-")&&!o.id.startsWith(":")){t.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(l=>l.tagName===o.tagName);if(s.length>1){let l=s.indexOf(o)+1;n+=`:nth-of-type(${l})`}}t.unshift(n),o=i}return t.join(" > ")}function jt(e){try{return document.querySelector(e)}catch(t){return null}}function nr(e,t=0){var a;let o=$r(e);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-t)),s=o[i],l=(a=tr(s.fiber))!=null?a:e;return{name:s.name,path:n,depthIndex:i,rootElement:l}}function Ws(e,t){var i,s;let o=$r(e),n=t.toLowerCase(),r=-1;for(let l=o.length-1;l>=0;l--){let a=o[l].name;if(a===t){let c=(i=tr(o[l].fiber))!=null?i:e;return{name:t,path:o.map(d=>d.name),depthIndex:l,rootElement:c}}if(r===-1){let c=a.toLowerCase();(c.length>=4&&n.includes(c)||n.length>=4&&c.includes(n))&&(r=l)}}if(r>=0){let l=(s=tr(o[r].fiber))!=null?s:e;return{name:t,path:o.map(a=>a.name),depthIndex:r,rootElement:l}}return null}function ao(e){let t=co(),o=[],n=new Set,r=t.currentNode;for(;r=t.nextNode();){let i=Ws(r,e);i&&!n.has(i.rootElement)&&(n.add(i.rootElement),o.push(i))}return o}function Wr(e){let t=new Map;if(e.size===0)return t;let o=new Set(e),n=co(),r=new Set,i=n.currentNode;for(;(i=n.nextNode())&&o.size>0;)for(let s of o){let l=Ws(i,s);if(!l||r.has(l.rootElement))continue;r.add(l.rootElement);let a=l.rootElement.getBoundingClientRect();t.set(s,a.top+window.scrollY),o.delete(s);break}for(let s of o)t.set(s,1/0);return t}function co(){return document.createTreeWalker(document.body,NodeFilter.SHOW_ELEMENT,{acceptNode(e){return e.closest("#devtools-toolbar, #devtools-canvas, #devtools-scrim, [data-popmelt-panel]")?NodeFilter.FILTER_REJECT:NodeFilter.FILTER_ACCEPT}})}function Jt(e){let t={selector:$s(e),tagName:e.tagName.toLowerCase()};e.id&&(t.id=e.id),e.classList.length>0&&(t.className=Array.from(e.classList).join(" "));let o=Ys(e);o&&o.length>0&&o.length<200&&(t.textContent=o);let n={};for(let s of e.attributes)s.name.startsWith("data-")&&(n[s.name]=s.value);Object.keys(n).length>0&&(t.dataAttributes=n);let r=er(e);r&&(t.reactComponent=r.name);let i=Tc(e);return i&&(t.context=i),t}function Ys(e){let t="";for(let o of e.childNodes)o.nodeType===Node.TEXT_NODE&&(t+=o.textContent||"");return t.trim()}function Wn(e,t){let o=document.elementsFromPoint(e,t);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 Tc(e){let t=e.parentElement,o=["section","article","nav","aside","header","footer","main"];for(;t&&t!==document.body;){let n=t.tagName.toLowerCase();if(o.includes(n)&&t.id)return`${n}#${t.id}`;if(t.id&&!t.id.startsWith("radix-")&&!t.id.startsWith(":"))return`${n}#${t.id}`;t=t.parentElement}return null}function js(e){let t=new Set,o=[],n=window.scrollX,r=window.scrollY,i=[{x:(e.minX+e.maxX)/2,y:(e.minY+e.maxY)/2},{x:e.minX,y:e.minY},{x:e.maxX,y:e.minY},{x:e.minX,y:e.maxY},{x:e.maxX,y:e.maxY}];for(let s of i){let l=s.x-n,a=s.y-r;if(l<0||a<0||l>window.innerWidth||a>window.innerHeight)continue;let c=Wn(l,a);c&&!t.has(c)&&(t.add(c),o.push(Jt(c)))}return o.slice(0,3)}function Yr(e){if(e.length===0)return[];let t=e.map(n=>n.x),o=e.map(n=>n.y);return js({minX:Math.min(...t),minY:Math.min(...o),maxX:Math.max(...t),maxY:Math.max(...o)})}function Tt(e,t){return e.style.getPropertyValue(t)!==""}function Ic(e,t=30){if(e<=0)return[];let o=[],n=co(),r=.5,i=n.currentNode;for(;(i=n.nextNode())&&o.length<t;){let s=i,l=s.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let a=getComputedStyle(s);!Tt(s,"padding-top")&&Math.abs((parseFloat(a.paddingTop)||0)-e)<r&&o.push({element:s,property:"padding-top"}),!Tt(s,"padding-bottom")&&Math.abs((parseFloat(a.paddingBottom)||0)-e)<r&&o.length<t&&o.push({element:s,property:"padding-bottom"}),!Tt(s,"padding-left")&&Math.abs((parseFloat(a.paddingLeft)||0)-e)<r&&o.length<t&&o.push({element:s,property:"padding-left"}),!Tt(s,"padding-right")&&Math.abs((parseFloat(a.paddingRight)||0)-e)<r&&o.length<t&&o.push({element:s,property:"padding-right"}),!Tt(s,"margin-top")&&Math.abs((parseFloat(a.marginTop)||0)-e)<r&&o.length<t&&o.push({element:s,property:"margin-top"}),!Tt(s,"margin-bottom")&&Math.abs((parseFloat(a.marginBottom)||0)-e)<r&&o.length<t&&o.push({element:s,property:"margin-bottom"}),!Tt(s,"margin-left")&&Math.abs((parseFloat(a.marginLeft)||0)-e)<r&&o.length<t&&o.push({element:s,property:"margin-left"}),!Tt(s,"margin-right")&&Math.abs((parseFloat(a.marginRight)||0)-e)<r&&o.length<t&&o.push({element:s,property:"margin-right"});let c=a.display;if((c.includes("flex")||c.includes("grid"))&&o.length<t){let d=Tt(s,"gap"),p=parseFloat(a.gap)||0,u=parseFloat(a.rowGap)||0,g=parseFloat(a.columnGap)||0;!d&&Math.abs(p-e)<r?o.push({element:s,property:"gap"}):!Tt(s,"row-gap")&&Math.abs(u-e)<r?o.push({element:s,property:"row-gap"}):!Tt(s,"column-gap")&&Math.abs(g-e)<r&&o.push({element:s,property:"column-gap"})}}return o}function jr(e,t=30){if(e<=0)return[];let o=[],n=co(),r=.5,i=n.currentNode;for(;(i=n.nextNode())&&o.length<t;){let s=i,l=s.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let a=getComputedStyle(s),c=parseFloat(a.borderTopWidth)||0,d=parseFloat(a.borderRightWidth)||0,p=parseFloat(a.borderBottomWidth)||0,u=parseFloat(a.borderLeftWidth)||0,g=s.clientWidth,x=s.clientHeight,E=parseFloat(a.paddingTop)||0;!Tt(s,"padding-top")&&Math.abs(E-e)<r&&o.push({x:l.left+u,y:l.top+c,width:g,height:e,direction:"vertical",property:"padding-top"});let h=parseFloat(a.paddingBottom)||0;!Tt(s,"padding-bottom")&&Math.abs(h-e)<r&&o.length<t&&o.push({x:l.left+u,y:l.top+c+x-e,width:g,height:e,direction:"vertical",property:"padding-bottom"});let w=parseFloat(a.paddingLeft)||0;!Tt(s,"padding-left")&&Math.abs(w-e)<r&&o.length<t&&o.push({x:l.left+u,y:l.top+c,width:e,height:x,direction:"horizontal",property:"padding-left"});let D=parseFloat(a.paddingRight)||0;!Tt(s,"padding-right")&&Math.abs(D-e)<r&&o.length<t&&o.push({x:l.left+u+g-e,y:l.top+c,width:e,height:x,direction:"horizontal",property:"padding-right"});let B=parseFloat(a.marginTop)||0;!Tt(s,"margin-top")&&Math.abs(B-e)<r&&o.length<t&&o.push({x:l.left,y:l.top-e,width:l.width,height:e,direction:"vertical",property:"margin-top"});let M=parseFloat(a.marginBottom)||0;!Tt(s,"margin-bottom")&&Math.abs(M-e)<r&&o.length<t&&o.push({x:l.left,y:l.bottom,width:l.width,height:e,direction:"vertical",property:"margin-bottom"});let C=parseFloat(a.marginLeft)||0;!Tt(s,"margin-left")&&Math.abs(C-e)<r&&o.length<t&&o.push({x:l.left-e,y:l.top,width:e,height:l.height,direction:"horizontal",property:"margin-left"});let L=parseFloat(a.marginRight)||0;!Tt(s,"margin-right")&&Math.abs(L-e)<r&&o.length<t&&o.push({x:l.right,y:l.top,width:e,height:l.height,direction:"horizontal",property:"margin-right"});let k=a.display;if((k.includes("flex")||k.includes("grid"))&&o.length<t&&!Tt(s,"gap")){let ee=Array.from(s.children).filter(Z=>{let F=getComputedStyle(Z);return F.display!=="none"&&F.position!=="absolute"&&F.position!=="fixed"});if(ee.length>=2)for(let Z=0;Z<ee.length-1&&o.length<t;Z++){let F=ee[Z].getBoundingClientRect(),K=ee[Z+1].getBoundingClientRect(),q=K.top-F.bottom;Math.abs(q-e)<r&&q>.5&&o.push({x:Math.min(F.left,K.left),y:F.bottom,width:Math.max(F.right,K.right)-Math.min(F.left,K.left),height:q,direction:"vertical",property:"gap"});let we=K.left-F.right;Math.abs(we-e)<r&&we>.5&&o.push({x:F.right,y:Math.min(F.top,K.top),width:we,height:Math.max(F.bottom,K.bottom)-Math.min(F.top,K.top),direction:"horizontal",property:"gap"})}}}return o}function or(e){return typeof e=="string"?{value:e}:e}var Vs={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 Gs(e,t){let o=Vs[t];return o?o.includes(e):!1}function Lc(e,t){let o=e.split(/\s+/);for(let n of o){if(n===t)return!0;let r=n.lastIndexOf(":");if(r>=0&&n.slice(r+1)===t)return!0}return!1}function Rc(e){var l,a;let t=e.lastIndexOf(":"),o=t>=0?e.slice(t+1):e,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(a=(l=i[s])!=null?l:i[r])!=null?a:null}function Gr(e,t=30){let o=parseFloat(e.value);if(isNaN(o)||o<=0)return[];if(e.bindings&&e.bindings.length>0){let r=[],i=co(),s=i.currentNode;for(;(s=i.nextNode())&&r.length<t;){let l=s,a=l.getBoundingClientRect();if(a.bottom<-50||a.top>window.innerHeight+50||a.right<-50||a.left>window.innerWidth+50||a.width<1||a.height<1)continue;let c=l.className;if(typeof c=="string")for(let d of e.bindings){if(!Lc(c,d))continue;let p=Rc(d);if(p&&!(e.property&&!Gs(p,e.property))){r.push({element:l,property:p});break}}}return r}let n=Ic(o,t*2);return e.property?n.filter(r=>Gs(r.property,e.property)).slice(0,t):n.slice(0,t)}function Vr(e,t=30){let o=Gr(e,t),n=[];for(let r of o){let i=r.element,s=i.getBoundingClientRect(),l=getComputedStyle(i),a=parseFloat(l.borderTopWidth)||0,c=parseFloat(l.borderRightWidth)||0,d=parseFloat(l.borderLeftWidth)||0,p=i.clientWidth,u=i.clientHeight;switch(r.property){case"padding-top":{let g=parseFloat(l.paddingTop)||0;n.push({x:s.left+d,y:s.top+a,width:p,height:g,direction:"vertical",property:r.property});break}case"padding-bottom":{let g=parseFloat(l.paddingBottom)||0;n.push({x:s.left+d,y:s.top+a+u-g,width:p,height:g,direction:"vertical",property:r.property});break}case"padding-left":{let g=parseFloat(l.paddingLeft)||0;n.push({x:s.left+d,y:s.top+a,width:g,height:u,direction:"horizontal",property:r.property});break}case"padding-right":{let g=parseFloat(l.paddingRight)||0;n.push({x:s.left+d+p-g,y:s.top+a,width:g,height:u,direction:"horizontal",property:r.property});break}case"margin-top":{let g=parseFloat(l.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(l.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(l.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(l.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(x=>{let E=getComputedStyle(x);return E.display!=="none"&&E.position!=="absolute"&&E.position!=="fixed"});for(let x=0;x<g.length-1&&n.length<t;x++){let E=g[x].getBoundingClientRect(),h=g[x+1].getBoundingClientRect(),w=h.top-E.bottom;w>.5&&n.push({x:Math.min(E.left,h.left),y:E.bottom,width:Math.max(E.right,h.right)-Math.min(E.left,h.left),height:w,direction:"vertical",property:"gap"});let D=h.left-E.right;D>.5&&n.push({x:E.right,y:Math.min(E.top,h.top),width:D,height:Math.max(E.bottom,h.bottom)-Math.min(E.top,h.top),direction:"horizontal",property:"gap"})}break}}}return n}function Us(e,t){let o=new Set,n=Ao(t);for(let r of e){let i=Xs[r.property];if(!i)continue;let s=r.element.className;if(typeof s=="string")for(let l of i){let a=`${l}-${n}`;for(let c of s.split(/\s+/)){let d=c.lastIndexOf(":"),p=d>=0?c.slice(d+1):c;if(p===a){o.add(p);break}}}}return[...o]}function Js(e){let t=new Set;for(let o of e)for(let[n,r]of Object.entries(Vs))if(r.includes(o.property)){t.add(n);break}if(t.size===1)return[...t][0]}function Ur(e,t,o){if(t===o)return e;let n=Ao(t),r=Ao(o);return e.map(i=>{let s=i.lastIndexOf("-");if(s<0)return i;let l=i.slice(0,s),a=i.slice(s+1);return a===n||a===`[${t}px]`?`${l}-${r}`:i})}var Ac={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 Ao(e){var t;return(t=Ac[e])!=null?t:`[${e}px]`}var Xs={"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 Pc(e,t,o,n){let r=Xs[t];if(!r)return null;let i=Ao(o);for(let s of r){let l=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+s+"-(?:"+Bc(i)+"|\\["+o+"px\\]))(?:\\s|$)"),a=e.match(l);if(a!=null&&a[1]){let c=Ao(n),d=a[1].lastIndexOf(":"),p=d>=0?a[1].slice(0,d+1):"";return{matched:a[1],suggested:`${p}${s}-${c}`}}}return null}function Bc(e){return e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function Ks(e,t,o){let n=new Set,r=[];for(let i of e){let s=on(i.element),l=`${s}::${i.property}`;if(n.has(l))continue;n.add(l);let a=er(i.element),c=i.element.className||"",d=Pc(c,i.property,t,o);r.push({selector:s,reactComponent:a==null?void 0:a.name,className:c,property:i.property,matchedClass:d==null?void 0:d.matched,suggestedClass:d==null?void 0:d.suggested})}return r}function Po(e,t){return window.getComputedStyle(e).getPropertyValue(t)}function Jr(e,t){if(e instanceof HTMLElement){let n=e.style.getPropertyValue(t);if(n)return n}let o=Oc(e,t);return o&&o.includes("var(")?o:Po(e,t)}function Oc(e,t){let o=t.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&&e.matches(i.selectorText)){let s=i.style.getPropertyValue(t);if(s&&s.includes("var("))return s;let l=i.style[o];if(l&&l.includes("var("))return l}}catch(r){}}catch(n){}return null}function rr(e,t){if(e instanceof HTMLElement){let n=e.style.getPropertyValue(t);if(n)return n}let o=t.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&&e.matches(i.selectorText)){let s=i.style.getPropertyValue(t);if(s)return s;let l=i.style[o];if(l)return l}}catch(r){}}catch(n){}return null}function ir(e){let t=window.getComputedStyle(e).display;return t==="flex"||t==="inline-flex"||t==="grid"||t==="inline-grid"}function Bo(e){let t=window.getComputedStyle(e);return{row:parseFloat(t.rowGap)||0,column:parseFloat(t.columnGap)||0}}function Dc(e){let t=[];for(let o of e){let n=t.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 t.push(f({},o))}return t}function Yn(e){let t=Array.from(e.children).filter(a=>{if(!(a instanceof HTMLElement))return!1;let c=window.getComputedStyle(a);return c.display!=="none"&&c.position!=="absolute"&&c.position!=="fixed"});if(t.length<2)return[];let o=[],n=e.getBoundingClientRect(),i=window.getComputedStyle(e).flexDirection,s=i==="column"||i==="column-reverse",l=6;for(let a=0;a<t.length-1;a++){let c=t[a].getBoundingClientRect(),d=t[a+1].getBoundingClientRect();if(d.left>c.right+.5&&o.push({axis:"column",x:c.right,y: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-l/2,w:n.width,h:l})}else{let p=(c.right+d.left)/2;o.push({axis:"column",x:p-l/2,y:n.top,w:l,h:n.height})}}return Dc(o)}function Xr(e,t){let o=window.getComputedStyle(e),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!(t!==(i==="column"||i==="column-reverse"?"row":"column")||parseFloat(t==="row"?o.rowGap:o.columnGap)>0)}function uo(e){let t=window.getComputedStyle(e);return{top:parseFloat(t.paddingTop)||0,right:parseFloat(t.paddingRight)||0,bottom:parseFloat(t.paddingBottom)||0,left:parseFloat(t.paddingLeft)||0}}function jn(e){let t=window.getComputedStyle(e);return{"top-left":parseFloat(t.borderTopLeftRadius)||0,"top-right":parseFloat(t.borderTopRightRadius)||0,"bottom-right":parseFloat(t.borderBottomRightRadius)||0,"bottom-left":parseFloat(t.borderBottomLeftRadius)||0}}function Kr(e){for(let t of e.childNodes)if(t.nodeType===Node.TEXT_NODE&&(t.textContent||"").trim().length>0)return!0;return!1}function po(e){var d,p;let t=document.createRange(),o=!1;for(let u of e.childNodes)u.nodeType===Node.TEXT_NODE&&(u.textContent||"").trim().length>0&&(o||(t.setStart(u,0),o=!0),t.setEnd(u,(p=(d=u.textContent)==null?void 0:d.length)!=null?p:0));if(!o)return null;let n=t.getBoundingClientRect(),r=window.getComputedStyle(e),i=parseFloat(r.fontSize)||16,s=parseFloat(r.lineHeight);isNaN(s)&&(s=i*1.2);let l=Math.max(1,t.getClientRects().length),a=Math.max(n.height,l*s),c=(a-n.height)/2;return new DOMRect(n.x,n.y-c,n.width,a)}function Oo(e){let t=window.getComputedStyle(e),o=parseFloat(t.fontSize)||16,n=parseFloat(t.lineHeight);return isNaN(n)&&(n=o*1.2),{fontSize:o,lineHeight:n}}function ze(e,t,o){e instanceof HTMLElement&&e.style.setProperty(t,o,"important")}function Zr(e,t,o){e instanceof HTMLElement&&e.style.removeProperty(t)}function sr(e){var t;for(let o of e){let n=jt(o.selector);if(!n&&o.durableSelector&&(n=jt(o.durableSelector),n)){let r=(t=o.selector.match(/\[data-pm="([^"]+)"\]/))==null?void 0:t[1];r&&n.setAttribute("data-pm",r)}if(n)for(let r of o.changes)ze(n,r.property,r.modified)}}function qr(e,t){let o=jt(e);if(!o)return;let n=t.find(r=>r.selector===e);if(n)for(let r of n.changes)Zr(o,r.property,r.original)}function lr(e){for(let t of e){let o=jt(t.selector);if(o)for(let n of t.changes)Zr(o,n.property,n.original)}}function qs(e,t,o,n){if(e)for(let r of e){if(r instanceof CSSGroupingRule){qs(r.cssRules,t,o,n);continue}if(r instanceof CSSStyleRule){let i=r.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&Fc(r.style,t,o,n)}}}function Fc(e,t,o,n){for(let r=0;r<e.length;r++){let i=e[r];if(i!=null&&i.startsWith("--")){if(o.has(i))continue;o.add(i);let s=t.getPropertyValue(i).trim();Qs(s)&&n.push({name:i,value:s,usage:`var(${i})`})}}}var ar=null,Nc=5e3;function Qr(){if(ar&&Date.now()-ar.timestamp<Nc)return ar.variables;let e=[],t=new Set,o=getComputedStyle(document.documentElement);try{for(let i of document.styleSheets)try{qs(i.cssRules||i.rules,o,t,e)}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("--")&&!t.has(s)){t.add(s);let l=o.getPropertyValue(s).trim();Qs(l)&&e.push({name:s,value:l,usage:`var(${s})`})}}let r=e.sort((i,s)=>i.name.localeCompare(s.name));return ar={variables:r,timestamp:Date.now()},r}function Qs(e){if(!e)return!1;let t=e.toLowerCase().trim();return!!(/^#([0-9a-f]{3}|[0-9a-f]{4}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(t)||t.startsWith("rgb")||t.startsWith("hsl")||t.startsWith("oklch")||t.startsWith("oklab")||t.startsWith("lch")||t.startsWith("lab")||["transparent","currentcolor","inherit","white","black","red","green","blue","yellow","orange","purple","pink","gray","grey"].includes(t))}function Do(e,t){let o=t.match(/var\((--[^,)]+)(?:,\s*([^)]+))?\)/);if(o){let n=o[1],r=o[2];return getComputedStyle(document.documentElement).getPropertyValue(n).trim()||r||t}return t}function Fo(e,t){if(!e)return null;let o=Zs(e);if(!o)return null;for(let n of t){let r=Zs(n.value);if(r&&o===r)return n}return null}function Zs(e){if(!e)return null;let t=e.trim().toLowerCase();if(t.startsWith("oklch(")){let o=t.match(/oklch\(\s*([\d.]+%?)\s+([\d.]+%?)\s+([\d.]+)/);if(o){let 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(t.startsWith("rgb")){let o=t.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(o)return`rgb(${o[1]},${o[2]},${o[3]})`}return t.startsWith("#")?t.length===4?`#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}`:t.slice(0,7):t}import{Fragment as Gn,jsx as Je,jsxs as dn}from"react/jsx-runtime";var Vn=22,fo=12,Hc=3,zc=250,ei=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],_c=3e3;function $c(i){var s=i,{left:e,top:t,style:o,children:n}=s,r=Bn(s,["left","top","style","children"]);return Je("div",m(f({"data-devtools":"badge-hit-area"},r),{style:f({position:"fixed",left:`max(0px, ${e}px)`,top:`max(0px, ${t}px)`,padding:fo,transform:`translate(min(0px, calc(100vw - max(0px, ${e}px) - 100%)), min(0px, calc(100vh - max(0px, ${t}px) - 100%)))`},o),children:n}))}function nl({annotations:e,supersededAnnotations:t,inFlightIds:o,scrollX:n,scrollY:r,annotationGroupMap:i,onViewThread:s,onSelectAnnotation:l,canvasRef:a}){var h,w,D,B;let[c,d]=No(0),[p,u]=No(()=>Math.floor(Math.random()*ei.length)),g=!!(o&&o.size>0);cr(()=>{if(!g)return;let M=setInterval(()=>{d(L=>(L+1)%Hc)},zc),C=setInterval(()=>{u(L=>(L+1)%ei.length)},_c);return()=>{clearInterval(M),clearInterval(C)}},[g]);let x=[];for(let M of e){if(M.type!=="text"||!M.text||!M.points[0]||t.has(M))continue;let C=M.groupId?e.filter(me=>me.groupId===M.groupId):[M],L=!!(o&&(o.has(M.id)||C.some(me=>o.has(me.id)))),k=(h=M.status)!=null?h:"pending",W=C.some(me=>me.status==="resolved"||me.status==="needs_review"),ee=C.some(me=>me.threadId);if(!L&&k!=="resolved"&&k!=="needs_review"&&!W&&!ee)continue;let Z=M.threadId||((w=C.find(me=>me.threadId))==null?void 0:w.threadId),F=k==="needs_review"||C.some(me=>me.status==="needs_review"),K=C.reduce((me,lt)=>{var qe;return me+((qe=lt.replyCount)!=null?qe:0)},0),q=M.points[0],we=M.fontSize||12,le=we*1.4,he=M.text.split(`
+`),Fe=i.get(M.id),Ie=Fe!==void 0?[Fe+". "+(he[0]||""),...he.slice(1)]:he,$e=(B=(D=a==null?void 0:a.current)==null?void 0:D.getContext("2d"))!=null?B:document.createElement("canvas").getContext("2d");if(!$e)continue;$e.font=`${we}px ${Ft}`;let J=q.x-n,V=so(J),te=V!==void 0?Math.min(400,V):400,fe=$n($e,Ie,te),Ce=Math.min(te,Math.max(...fe.map(me=>$e.measureText(me).width))),ge=fe.length*le,ue=Ie.length*le,We=ge-ue;x.push({id:M.id,threadId:Z,x:q.x+Ce+4,y:q.y-4-We,size:ge+8,color:M.color,isInFlight:L,isNeedsReview:F,replyCount:K})}if(x.length===0)return null;let E=!!s;return Je(Gn,{children:x.map(M=>Je($c,{left:M.x-n-fo,top:M.y-r-fo,onClick:E&&M.threadId?()=>{l==null||l(M.id),s(M.threadId)}:void 0,style:{pointerEvents:E?"auto":"none",cursor:E&&M.threadId?"pointer":void 0,zIndex:9999},children:Je("div",{"data-devtools":"annotation-badge",style:{height:M.size,display:"flex",alignItems:"center",backgroundColor:M.color,fontFamily:Ft,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:M.isInFlight?dn(Gn,{children:[Je("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?dn(Gn,{children:[Je("circle",{cx:"7",cy:"7",r:"2"}),Je("circle",{cx:"17",cy:"7",r:"2"}),Je("circle",{cx:"7",cy:"17",r:"2"}),Je("circle",{cx:"17",cy:"17",r:"2"})]}):dn(Gn,{children:[Je("circle",{cx:"12",cy:"6",r:"2"}),Je("circle",{cx:"6",cy:"12",r:"2"}),Je("circle",{cx:"18",cy:"12",r:"2"}),Je("circle",{cx:"12",cy:"18",r:"2"})]})}),Je("span",{style:{opacity:.7},children:ei[p]})]}):dn(Gn,{children:[M.isNeedsReview?Je("span",{style:{fontWeight:700},children:"?"}):dn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[Je("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),Je("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),Je("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),Je("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),Je("span",{style:{opacity:.7},children:M.replyCount>0?`${M.replyCount} ${M.replyCount===1?"reply":"replies"}`:"Cancelled"})]})})},M.id))})}function ti({inFlightSelectorColors:e,animated:t=!0}){let[o,n]=No([]);if(cr(()=>{if(e.size===0){n([]);return}let i=null,s=()=>{let c=[];for(let[d,p]of e){let u=jt(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)},l=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(s)};s(),window.addEventListener("scroll",l,!0),window.addEventListener("resize",l,!0);let a=new MutationObserver(l);return a.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",l,!0),window.removeEventListener("resize",l,!0),a.disconnect(),i&&cancelAnimationFrame(i)}},[e]),o.length===0)return null;let r={position:"absolute",width:2,height:2,pointerEvents:"none"};return dn(Gn,{children:[t&&Je("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),o.map(i=>dn("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:[Je("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible"},children:Je("rect",{x:"0.5",y:"0.5",width:Math.max(0,i.width-1),height:Math.max(0,i.height-1),fill:"none",stroke:i.color,strokeWidth:"1",strokeDasharray:"2 4",style:t?{animation:"popmelt-march 0.5s steps(2) infinite"}:void 0})}),Je("div",{style:m(f({},r),{top:-1,left:-1,backgroundColor:i.color})}),Je("div",{style:m(f({},r),{top:-1,right:-1,backgroundColor:i.color})}),Je("div",{style:m(f({},r),{bottom:-1,left:-1,backgroundColor:i.color})}),Je("div",{style:m(f({},r),{bottom:-1,right:-1,backgroundColor:i.color})})]},i.selector))]})}function ol({annotations:e,supersededAnnotations:t,scrollX:o,scrollY:n,onReply:r,annotationGroupMap:i,canvasRef:s}){let l=e.filter(d=>t.has(d)?!1:d.status==="waiting_input"&&d.question&&d.threadId);if(l.length===0)return null;let a=new Set,c=[];for(let d of l){if(!d.threadId||a.has(d.threadId))continue;a.add(d.threadId);let p=d.type==="text"?d:e.find(u=>u.groupId&&u.groupId===d.groupId&&u.type==="text")||d;if(p.type==="text"&&p.text&&p.points[0]){let u=p.points[0],g=p.fontSize||12,x=g*1.4,E=p.text.split(`
+`),h=i.get(p.id),w=h!==void 0?[h+". "+(E[0]||""),...E.slice(1)]:E,B=document.createElement("canvas").getContext("2d");if(!B)continue;B.font=`${g}px ${Ft}`;let M=u.x-o,C=so(M),L=C!==void 0?Math.min(400,C):400,k=$n(B,w,L),W=Math.min(L,Math.max(...k.map(q=>B.measureText(q).width))),ee=k.length*x,Z=w.length*x,F=ee-Z,K=ee+8;c.push({annotation:d,x:u.x+W+4,y:u.y-4-F,size:K})}}return c.length===0?null:Je(Gn,{children:c.map(({annotation:d,x:p,y:u,size:g})=>Je(Wc,{annotation:d,x:p-o,y:u-n,size:g,onReply:r},`question-${d.threadId}`))})}function Wc({annotation:e,x:t,y:o,size:n,onReply:r}){let[i,s]=No(!1),[l,a]=No(""),c=tl(null),d=tl(null);cr(()=>{i&&c.current&&c.current.focus()},[i]),cr(()=>{if(!i)return;let E=w=>{d.current&&!d.current.contains(w.target)&&s(!1)},h=w=>{w.key==="Escape"&&s(!1)};return document.addEventListener("mousedown",E),document.addEventListener("keydown",h),()=>{document.removeEventListener("mousedown",E),document.removeEventListener("keydown",h)}},[i]);let p=el(()=>{!l.trim()||!e.threadId||(r(e.threadId,l.trim()),a(""),s(!1))},[l,e.threadId,r]),u=el(E=>{E.key==="Enter"&&(E.metaKey||E.ctrlKey)&&(E.preventDefault(),p())},[p]),g=i?t:t-fo,x=i?o:o-fo;return dn("div",{ref:d,"data-devtools":"question-badge",style:{position:"fixed",left:`max(0px, ${g}px)`,top:`max(0px, ${x}px)`,padding:i?0:fo,transform:`translate(min(0px, calc(100vw - max(0px, ${g}px) - 100%)), min(0px, calc(100vh - max(0px, ${x}px) - 100%)))`,zIndex:i?10002:9999,pointerEvents:"auto",cursor:i?void 0:"pointer"},children:[!i&&dn("div",{onClick:()=>s(!0),style:{height:n,display:"flex",alignItems:"center",backgroundColor:e.color,padding:`0 ${4}px`,gap:4,fontFamily:Ft,fontSize:12,color:"#ffffff",whiteSpace:"nowrap"},children:[dn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[Je("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),Je("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),Je("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),Je("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]}),Je("span",{style:{opacity:.7},children:"reply?"})]}),i&&dn("div",{style:{minWidth:260,maxWidth:360,backgroundColor:"#ffffff",fontFamily:Ft,fontSize:12,color:"#1f2937",border:"1px solid rgba(0, 0, 0, 0.1)"},children:[Je("div",{style:{padding:`${6}px ${8}px`,lineHeight:1.4},children:e.question}),dn("div",{style:{padding:`0 ${4}px ${4}px`},children:[Je("textarea",{ref:c,value:l,onChange:E=>a(E.target.value),onKeyDown:u,placeholder:"Type your reply...",style:{width:"100%",minHeight:40,padding:4,fontSize:12,fontFamily:Ft,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"}}),Je("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:4},children:Je("button",{onClick:p,disabled:!l.trim(),style:{padding:"4px 12px",fontSize:11,fontFamily:Ft,fontWeight:600,backgroundColor:l.trim()?e.color:"rgba(0,0,0,0.1)",color:l.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:l.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}function dr(e){var i;let t=new Set,o=new Map;for(let s of e){if(!s.linkedSelector)continue;let l=o.get(s.linkedSelector)||[];l.push(s),o.set(s.linkedSelector,l)}let 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((a,c)=>c.timestamp-a.timestamp);let l=s[0];l.groupId&&r.add(l.groupId);for(let a=1;a<s.length;a++){let c=s[a];t.add(c),c.groupId&&n.add(c.groupId)}}for(let s of e)s.groupId&&n.has(s.groupId)&&!r.has(s.groupId)&&t.add(s);return t}import{useEffect as rl,useLayoutEffect as Yc,useState as il}from"react";import{jsx as ni,jsxs as ll}from"react/jsx-runtime";function jc(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var sl=["top-left","top-right","bottom-right","bottom-left"];function al({element:e,radius:t,accentColor:o,hoveredCorner:n,draggingCorner:r,cursorViewport:i}){let[s,l]=il(null),[a,c]=il(!1);if(rl(()=>{let w=M=>{(M.key==="Meta"||M.key==="Control")&&c(!0)},D=M=>{(M.key==="Meta"||M.key==="Control")&&c(!1)},B=()=>c(!1);return window.addEventListener("keydown",w,!0),window.addEventListener("keyup",D,!0),window.addEventListener("blur",B),()=>{window.removeEventListener("keydown",w,!0),window.removeEventListener("keyup",D,!0),window.removeEventListener("blur",B)}},[]),rl(()=>{if(!e){l(null);return}let w=()=>{l(e.getBoundingClientRect())};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[e]),Yc(()=>{e&&l(e.getBoundingClientRect())},[e,t["top-left"],t["top-right"],t["bottom-right"],t["bottom-left"]]),!s)return null;let d=s.width,p=s.height,u=jc(o,.2),g={"top-left":{x:0,y:t["top-left"]},"top-right":{x:d,y:t["top-right"]},"bottom-right":{x:d,y:p-t["bottom-right"]},"bottom-left":{x:0,y:p-t["bottom-left"]}},x=new Set,E=r!=null?r:n;if(E)if(a)x.add(E);else for(let w of sl)x.add(w);let h={position:"fixed",top:s.top,left:s.left,width:d,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"};return ll("div",{"data-devtools":"border-radius-handles",style:h,children:[ll("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${p}`,children:[ni("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"}),sl.map(w=>{let D=g[w],B=x.has(w);return ni("circle",{cx:D.x,cy:D.y,r:w===(r!=null?r:n)?3:2.5,fill:o,stroke:"#ffffff",strokeWidth:w===(r!=null?r:n)?4:2,paintOrder:"stroke"},w)})]}),i&&E&&(()=>{let w=Math.round(t[E]);return ni("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:w})})()]})}import{useEffect as Gc,useState as Vc}from"react";function Un(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);if(o)return`oklch(${o[1]} / ${t})`;let n=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);if(n){let r=parseInt(n[1],16),i=parseInt(n[2],16),s=parseInt(n[3],16);return`rgba(${r}, ${i}, ${s}, ${t})`}return`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}import{Fragment as Uc,jsx as Jn,jsxs as Ho}from"react/jsx-runtime";function mo({element:e,isSelected:t=!1,elementInfo:o,color:n="#3b82f6",annotationNumber:r,changeCount:i,hideTooltip:s=!1}){let[l,a]=Vc(null);if(Gc(()=>{if(!e){a(null);return}let L=()=>{let k=e.getBoundingClientRect();a(k)};return L(),window.addEventListener("scroll",L,{passive:!0}),window.addEventListener("resize",L,{passive:!0}),()=>{window.removeEventListener("scroll",L),window.removeEventListener("resize",L)}},[e]),!l||!e)return null;let c={position:"fixed",top:l.top,left:l.left,width:l.width,height:l.height,pointerEvents:"none",zIndex:9996,backgroundColor:t?Un(n,.1):Un(n,.05),overflow:"visible"},d={position:"absolute",width:2,height:2,backgroundColor:n,pointerEvents:"none"},p=e.tagName.toLowerCase(),u=e.id?`#${e.id}`:"",g=e.classList.length>0?"."+Array.from(e.classList).slice(0,2).join("."):"",x=o==null?void 0:o.reactComponent,E=x?`<${x}> ${p}${u}${g}`:`${p}${u}${g}`,h=22,w=l.height>=window.innerHeight,D=w?0:l.top>=h?l.top-h:l.bottom,B=w?{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:D,left:l.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},C=!s&&Ho("div",{"data-devtools":"tooltip",style:B,children:[r!==void 0&&Ho("span",{children:[r,"."]}),Jn("span",{style:{overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0},children:E}),i!==void 0&&i>0&&Ho("span",{style:{opacity:.8},children:["(",i," ",i===1?"change":"changes",")"]})]});return Ho(Uc,{children:[Ho("div",{"data-devtools":"highlight",style:c,children:[Jn("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:Jn("rect",f({x:"0.5",y:"0.5",width:Math.max(0,l.width-1),height:Math.max(0,l.height-1),fill:"none",stroke:n,strokeWidth:"1"},!t&&{strokeDasharray:"2 4"}))}),Jn("div",{style:m(f({},d),{top:-1,left:-1})}),Jn("div",{style:m(f({},d),{top:-1,right:-1})}),Jn("div",{style:m(f({},d),{bottom:-1,left:-1})}),Jn("div",{style:m(f({},d),{bottom:-1,right:-1})}),w&&C]}),!w&&C]})}import{useEffect as cl,useLayoutEffect as Jc,useState as oi}from"react";import{jsx as Cn,jsxs as ii}from"react/jsx-runtime";function ri(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function si({element:e,gap:t,accentColor:o,hoveredAxis:n,draggingAxis:r,cursorViewport:i,isAutoGap:s=!1,refreshKey:l=0}){let[a,c]=oi(null),[d,p]=oi([]),[u,g]=oi(!1);if(cl(()=>{let W=F=>{(F.key==="Meta"||F.key==="Control")&&g(!0)},ee=F=>{(F.key==="Meta"||F.key==="Control")&&g(!1)},Z=()=>g(!1);return window.addEventListener("keydown",W,!0),window.addEventListener("keyup",ee,!0),window.addEventListener("blur",Z),()=>{window.removeEventListener("keydown",W,!0),window.removeEventListener("keyup",ee,!0),window.removeEventListener("blur",Z)}},[]),cl(()=>{if(!e){c(null),p([]);return}let W=()=>{c(e.getBoundingClientRect()),p(Yn(e))};return W(),window.addEventListener("scroll",W,{passive:!0}),window.addEventListener("resize",W,{passive:!0}),()=>{window.removeEventListener("scroll",W),window.removeEventListener("resize",W)}},[e]),Jc(()=>{e&&(c(e.getBoundingClientRect()),p(Yn(e)))},[e,t.row,t.column,l]),!a||d.length===0)return null;let x=a.width,E=a.height,h="pm-gap-stripe-pattern",w=ri(o,.25),D=ri(o,.1),B=ri(o,.2),M=8,C=2,L={position:"fixed",top:a.top,left:a.left,width:x,height:E,pointerEvents:"none",zIndex:9996,overflow:"visible"},k=r!=null?r:n;return ii("div",{"data-devtools":"gap-handles",style:L,children:[ii("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${x} ${E}`,children:[Cn("defs",{children:Cn("pattern",{id:h,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Cn("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:w,strokeWidth:"1.5"})})}),Cn("rect",{x:"0.5",y:"0.5",width:Math.max(0,x-1),height:Math.max(0,E-1),fill:"none",stroke:B,strokeWidth:"1"}),d.map((W,ee)=>{let Z=W.x-a.left,F=W.y-a.top,K=W.w,q=W.h,we=u?W.axis===k:!0;return(W.axis==="row"?t.row:t.column)===0?null:ii("g",{opacity:we?1:.6,children:[Cn("rect",{x:Z,y:F,width:K,height:q,fill:D}),Cn("rect",{x:Z,y:F,width:K,height:q,fill:`url(#${h})`})]},ee)}),k&&(()=>{let W=d.filter(V=>V.axis===k);if(W.length===0)return null;let ee=W[0];if(i&&W.length>1){let V=1/0;for(let te of W){let fe=te.x+te.w/2,Ce=te.y+te.h/2,ge=Math.abs(i.x-fe)+Math.abs(i.y-Ce);ge<V&&(V=ge,ee=te)}}let Z=ee.x-a.left,F=ee.y-a.top,K=ee.w,q=ee.h,we=Z+K/2,le=F+q/2;if(s)return Cn("circle",{cx:we,cy:le,r:1.5,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let he=k==="column",Fe=he?C:M,Ie=he?M:C,$e=we-Fe/2,J=le-Ie/2;return Cn("rect",{x:$e,y:J,width:Fe,height:Ie,fill:o,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),i&&k&&(()=>{let W=s?"auto":String(Math.round(k==="row"?t.row:t.column));return Cn("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:W})})()]})}import{useCallback as Qc,useEffect as ed,useState as td}from"react";import{useEffect as Xc,useState as dl}from"react";var Kc=3,Zc=250,li=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],qc=3e3;function ur(e){let[t,o]=dl(0),[n,r]=dl(()=>Math.floor(Math.random()*li.length));return Xc(()=>{if(!e)return;let i=setInterval(()=>o(l=>(l+1)%Kc),Zc),s=setInterval(()=>r(l=>(l+1)%li.length),qc);return()=>{clearInterval(i),clearInterval(s)}},[e]),{charIndex:t,word:li[n]}}import{Fragment as ai,jsx as rn,jsxs as ho}from"react/jsx-runtime";function nd(e){let{element:t}=e,o=t.tagName,n=t.id?`#${t.id}`:"",r=t.className?"."+t.className.split(" ").slice(0,2).join("."):"",i=t.reactComponent;return i?`<${i}> ${o}${n}${r}`:`${o}${n}${r}`}var ul=22,ci=12;function od(i){var s=i,{left:e,top:t,style:o,children:n}=s,r=Bn(s,["left","top","style","children"]);return rn("div",m(f({"data-devtools":"badge-hit-area"},r),{style:f({position:"fixed",left:`max(0px, ${e}px)`,top:`max(0px, ${t}px)`,padding:ci,transform:`translate(min(0px, calc(100vw - max(0px, ${e}px) - 100%)), min(0px, calc(100vh - max(0px, ${t}px) - 100%)))`},o),children:n}))}function pl({styleModifications:e,isInspecting:t,accentColor:o,annotationGroupCount:n,dispatch:r,inFlightSelectors:i}){let[s,l]=td([]),a=i&&i.size>0,{charIndex:c,word:d}=ur(!!a);ed(()=>{if(t){l([]);return}let x=null,E=()=>{let D=[];e.forEach((B,M)=>{let C=jt(B.selector);if(!C)return;let L=C.getBoundingClientRect();D.push({selector:B.selector,modIndex:M,top:L.top>=ul?L.top-ul:L.bottom,left:L.left,label:nd(B),changeCount:B.changes.length,annotationNumber:n+M+1})}),l(D)},h=()=>{x&&cancelAnimationFrame(x),x=requestAnimationFrame(E)};E(),window.addEventListener("scroll",h,!0),window.addEventListener("resize",h,!0);let w=new MutationObserver(h);return w.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),window.addEventListener("load",h),document.fonts.ready.then(h),()=>{window.removeEventListener("scroll",h,!0),window.removeEventListener("resize",h,!0),window.removeEventListener("load",h),w.disconnect(),x&&cancelAnimationFrame(x)}},[e,t,n]);let p=Qc(x=>{let E=e[x];if(!E)return;let h=jt(E.selector);h&&(r({type:"SELECT_ANNOTATION",payload:{id:null}}),r({type:"SET_TOOL",payload:"inspector"}),r({type:"SELECT_ELEMENT",payload:{el:h,info:E.element}}))},[e,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 rn(ai,{children:s.map(x=>{let E=i==null?void 0:i.has(x.selector);return rn(od,{left:x.left-ci,top:x.top-ci,onClick:()=>p(x.modIndex),style:{zIndex:1e4,cursor:"pointer",pointerEvents:"auto"},children:ho("div",{"data-devtools":"badge",style:m(f({},u),{backgroundColor:E?"#999999":o}),children:[ho("span",{children:[x.annotationNumber,"."]}),rn("span",{style:g,children:x.label}),ho("span",{style:{opacity:.8},children:["(",x.changeCount," ",x.changeCount===1?"change":"changes",")"]}),E&&ho("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[rn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:c===1?ho(ai,{children:[rn("circle",{cx:"7",cy:"7",r:"2"}),rn("circle",{cx:"17",cy:"7",r:"2"}),rn("circle",{cx:"7",cy:"17",r:"2"}),rn("circle",{cx:"17",cy:"17",r:"2"})]}):ho(ai,{children:[rn("circle",{cx:"12",cy:"6",r:"2"}),rn("circle",{cx:"6",cy:"12",r:"2"}),rn("circle",{cx:"18",cy:"12",r:"2"}),rn("circle",{cx:"12",cy:"18",r:"2"})]})}),d]})]})},x.selector)})})}import{useEffect as rd,useState as id}from"react";import{Fragment as ld,jsx as fl}from"react/jsx-runtime";function sd(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function gl({styleModifications:e,accentColor:t}){let[o,n]=id([]);if(rd(()=>{let i=null,s=()=>{let c=[];for(let d of e){let p=jt(d.selector);if(!p)continue;let u=p.getBoundingClientRect();if(u.width===0&&u.height===0)continue;let g=jn(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)},l=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(s)};s(),window.addEventListener("scroll",l,{passive:!0}),window.addEventListener("resize",l,{passive:!0});let a=new MutationObserver(l);return a.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",l),window.removeEventListener("resize",l),a.disconnect(),i&&cancelAnimationFrame(i)}},[e]),o.length===0)return null;let r=sd(t,.2);return fl(ld,{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 fl("div",{"data-devtools":"mod-border",style:s},i.selector)})})}import{useEffect as ml,useLayoutEffect as ad,useState as hl}from"react";import{jsx as On,jsxs as ui}from"react/jsx-runtime";function di(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var cd={top:"bottom",bottom:"top",left:"right",right:"left"};function pi({element:e,padding:t,accentColor:o,hoveredSide:n,draggingSide:r,cursorViewport:i,refreshKey:s}){let[l,a]=hl(null),[c,d]=hl(!1);if(ml(()=>{let K=le=>{(le.key==="Meta"||le.key==="Control")&&d(!0)},q=le=>{(le.key==="Meta"||le.key==="Control")&&d(!1)},we=()=>d(!1);return window.addEventListener("keydown",K,!0),window.addEventListener("keyup",q,!0),window.addEventListener("blur",we),()=>{window.removeEventListener("keydown",K,!0),window.removeEventListener("keyup",q,!0),window.removeEventListener("blur",we)}},[]),ml(()=>{if(!e){a(null);return}let K=()=>{a(e.getBoundingClientRect())};return K(),window.addEventListener("scroll",K,{passive:!0}),window.addEventListener("resize",K,{passive:!0}),()=>{window.removeEventListener("scroll",K),window.removeEventListener("resize",K)}},[e]),ad(()=>{e&&a(e.getBoundingClientRect())},[e,t.top,t.right,t.bottom,t.left,s]),!l)return null;let p=l.width,u=l.height,{top:g,right:x,bottom:E,left:h}=t,w="pm-stripe-pattern",D=di(o,.25),B=di(o,.1),M=di(o,.2),C=8,L=2,k={position:"fixed",top:l.top,left:l.left,width:p,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"},W=["top","right","bottom","left"],ee={top:`0,0 ${p},0 ${p-x},${g} ${h},${g}`,right:`${p},0 ${p},${u} ${p-x},${u-E} ${p-x},${g}`,bottom:`0,${u} ${h},${u-E} ${p-x},${u-E} ${p},${u}`,left:`0,0 ${h},${g} ${h},${u-E} 0,${u}`},Z={top:{x:p/2-C/2,y:g/2-L/2,w:C,h:L},bottom:{x:p/2-C/2,y:u-E/2-L/2,w:C,h:L},left:{x:h/2-L/2,y:u/2-C/2,w:L,h:C},right:{x:p-x/2-L/2,y:u/2-C/2,w:L,h:C}},F=new Set;return r?F.add(r):n&&(F.add(n),c||F.add(cd[n])),ui("div",{"data-devtools":"padding-handles",style:k,children:[ui("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${p} ${u}`,children:[On("defs",{children:On("pattern",{id:w,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:On("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:D,strokeWidth:"1.5"})})}),On("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"}),W.map(K=>{if(t[K]<=0)return null;let we=F.has(K);return ui("g",{opacity:we?1:.6,children:[On("polygon",{points:ee[K],fill:B}),On("polygon",{points:ee[K],fill:`url(#${w})`})]},K)}),W.map(K=>{let q=Z[K],we=F.has(K);return On("rect",{x:q.x,y:q.y,width:q.w,height:q.h,fill:o,stroke:"#ffffff",strokeWidth:we?4:2,paintOrder:"stroke"},`handle-${K}`)})]}),i&&(n||r)&&(()=>{let K=r!=null?r:n,q=Math.round(t[K]);return On("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:o,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:q})})()]})}import{useCallback as wn,useEffect as pn,useMemo as br,useRef as tn,useState as Ht}from"react";import{Check as yr,ChevronDown as vi,MoveHorizontal as Il,RotateCcw as Od,Shrink as Dd,X as Fd}from"lucide-react";var dd="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",gn={borderWidth:3,borderStyle:"solid",borderImage:`url("${dd}") 4 / 1.9 / 0 round`};var pr={"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 yo(e){var t,o;return(o=(t=pr[e])==null?void 0:t[0])!=null?o:"px"}function Dn(e){let t=e.match(/^([\d.-]+)(.*)$/);return t?{num:parseFloat(t[1]),unit:t[2]||""}:{num:0,unit:""}}function fr(e,t,o,n){let r=e.trim();if(!r)return"";let i=r.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i);if(i)return`${parseFloat(i[1])}${i[2].toLowerCase()}`;let s=parseFloat(r);if(!isNaN(s)){if(n){let{unit:l}=Dn(o);return`${s}${l||yo(t)}`}return`${s}${yo(t)}`}return r}function fi(e,t){if(!t||t==="px")return e;if(t==="rem"){let o=parseFloat(getComputedStyle(document.documentElement).fontSize)||16;return Math.round(e/o*1e3)/1e3}return e}import{useCallback as ud,useEffect as pd,useRef as yl,useState as fd}from"react";import{Plus as bl,X as gd}from"lucide-react";import{jsx as en,jsxs as Xn}from"react/jsx-runtime";var gr=[{name:"blur",label:"Blur",unit:"px",defaultValue:10,min:0,max:100,step:1},{name:"brightness",label:"Brightness",unit:"",defaultValue:1,min:0,max:3,step:.05},{name:"contrast",label:"Contrast",unit:"",defaultValue:1,min:0,max:3,step:.05},{name:"saturate",label:"Saturate",unit:"",defaultValue:1,min:0,max:3,step:.05},{name:"grayscale",label:"Grayscale",unit:"",defaultValue:0,min:0,max:1,step:.05},{name:"sepia",label:"Sepia",unit:"",defaultValue:0,min:0,max:1,step:.05},{name:"invert",label:"Invert",unit:"",defaultValue:0,min:0,max:1,step:.05},{name:"hue-rotate",label:"Hue Rotate",unit:"deg",defaultValue:0,min:0,max:360,step:1},{name:"opacity",label:"Opacity",unit:"",defaultValue:1,min:0,max:1,step:.05}];function md(e){if(!e||e==="none")return[];let t=[],o=/([\w-]+)\(([^)]+)\)/g,n;for(;(n=o.exec(e))!==null;){let r=n[1],i=n[2],s=parseFloat(i);isNaN(s)||t.push({name:r,value:s})}return t}function gi(e){return e.length===0?"none":e.map(t=>{var r;let o=gr.find(i=>i.name===t.name),n=(r=o==null?void 0:o.unit)!=null?r:"";return`${t.name}(${t.value}${n})`}).join(" ")}function xl({value:e,onChange:t,accentColor:o,modified:n,panelContentRef:r}){let i=md(e),[s,l]=fd(!1),a=yl(null),c=yl(null);pd(()=>{if(!s)return;let B=M=>{a.current&&!a.current.contains(M.target)&&l(!1)};return document.addEventListener("mousedown",B,!0),()=>document.removeEventListener("mousedown",B,!0)},[s]);let d=gr.filter(B=>!i.some(M=>M.name===B.name)),p=B=>{let M=[...i,{name:B.name,value:B.defaultValue}];t(gi(M)),l(!1)},u=B=>{let M=i.filter((C,L)=>L!==B);t(gi(M))},g=(B,M)=>{let C=i.map((L,k)=>k===B?m(f({},L),{value:M}):L);t(gi(C))},x={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},E=ud(B=>{var F;if(!c.current)return{position:"fixed",top:0,left:0};let M=c.current.getBoundingClientRect(),C=c.current.closest('[data-devtools="panel"]'),L=C?C.getBoundingClientRect():{top:0,left:0,bottom:9999},k=(F=r==null?void 0:r.current)==null?void 0:F.getBoundingClientRect(),W=B*24+8,Z=L.bottom-M.bottom<W;return m(f({position:"fixed"},Z?{bottom:L.bottom-M.top+2-L.top}:{top:M.bottom+2-L.top}),{left:k?k.left+4-L.left:M.left-L.left,width:k?k.width-8:140,zIndex:10001})},[r]),h={backgroundColor:"rgba(255, 255, 255, 0.95)",backdropFilter:"blur(16px)",WebkitBackdropFilter:"blur(16px)",border:"1px solid rgba(0,0,0,0.1)",borderRadius:4,padding:"4px 0",boxShadow:"0 4px 12px rgba(0,0,0,0.1)"},w={display:"block",width:"100%",padding:"4px 10px",border:"none",backgroundColor:"transparent",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#334155",cursor:"pointer",textAlign:"left"},D=B=>en("div",{ref:a,style:f(f({},E(B.length)),h),children:B.map(M=>en("button",{type:"button",onClick:()=>p(M),style:w,onMouseEnter:C=>{C.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:C=>{C.currentTarget.style.backgroundColor="transparent"},children:M.label},M.name))});return i.length===0?Xn("div",{children:[Xn("div",{style:{display:"flex",alignItems:"center",gap:4},children:[en(Mn,{modified:!1,children:en("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:m(f({},x),{color:"#999",cursor:"default"})})}),en("button",{ref:c,type:"button",onClick:()=>l(!s),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,padding:0,border:"none",borderRadius:2,backgroundColor:"transparent",color:"#94a3b8",cursor:"pointer",flexShrink:0},children:en(bl,{size:12})})]}),s&&D(gr)]}):Xn("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[i.map((B,M)=>{let C=gr.find(L=>L.name===B.name);return C?Xn("div",{style:{display:"flex",alignItems:"center",gap:4},children:[en("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:C.label}),en(Mn,{modified:n,children:Xn("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[en("input",{type:"range",min:C.min,max:C.max,step:C.step,value:B.value,onChange:L=>g(M,parseFloat(L.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${o} ${(B.value-C.min)/(C.max-C.min)*100}%, rgba(0,0,0,0.1) ${(B.value-C.min)/(C.max-C.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),en("input",{type:"number",min:C.min,max:C.max,step:C.step,value:C.unit==="px"||C.unit==="deg"?Math.round(B.value):Math.round(B.value*100)/100,onChange:L=>g(M,parseFloat(L.target.value)||0),style:m(f({},x),{width:44,padding:"2px 4px",textAlign:"right",flexShrink:0})}),C.unit&&en("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:C.unit})]})}),en("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:en(gd,{size:10})})]},B.name):null}),d.length>0&&Xn("div",{children:[Xn("button",{ref:c,type:"button",onClick:()=>l(!s),style:{display:"flex",alignItems:"center",gap:4,padding:"2px 4px",border:"none",borderRadius:2,backgroundColor:"transparent",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#94a3b8",cursor:"pointer"},children:[en(bl,{size:10}),"Add filter"]}),s&&D(d)]})]})}import{useCallback as xo,useEffect as xd,useRef as mr,useState as vl}from"react";import{AlignHorizontalSpaceAround as vd,AlignVerticalSpaceAround as Sd,Columns3 as wd,Grid2x2 as kd,RectangleHorizontal as Ed,Rows3 as Cd,UnfoldHorizontal as Sl,UnfoldVertical as wl}from"lucide-react";import{useCallback as hd,useEffect as yd,useRef as zo}from"react";import{jsx as bd}from"react/jsx-runtime";var mi=[0,1,2,4,8,12,16,20,24,28,32];function bo({value:e,onChange:t,onPreview:o,onScrubEnd:n,onReset:r,isModified:i,accentColor:s,defaultUnit:l="rem",snapSteps:a,color:c,style:d,children:p}){let u=zo(null),g=zo(null),x=zo(r),E=zo(i),h=zo(!1);x.current=r,E.current=i,yd(()=>{let D=M=>{let C=g.current;if(!C)return;C.hasMoved=!0,h.current=M.shiftKey;let L=C.unit==="rem"||C.unit==="em"?.1:1;C.accum+=M.movementX*L;let k=Math.max(0,Math.round((C.startValue+C.accum)*10)/10);if(M.shiftKey&&a){let W=C.unit==="rem"||C.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,ee=C.unit==="rem"||C.unit==="em"?k*W:k,Z=a[a.length-1];for(let F=0;F<a.length-1;F++){let K=a[F],q=a[F+1];if(ee<=(K+q)/2){Z=K;break}if(ee<q){Z=q;break}}ee>a[a.length-1]&&(Z=Math.round(ee/8)*8),k=C.unit==="rem"||C.unit==="em"?Math.round(Z/W*1e3)/1e3:Z}o==null||o(`${k}${C.unit}`)},B=()=>{let M=g.current;if(!M)return;let C=Math.max(0,Math.round((M.startValue+M.accum)*10)/10);if(h.current&&a){let k=M.unit==="rem"||M.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,W=M.unit==="rem"||M.unit==="em"?C*k:C,ee=a[a.length-1];for(let Z=0;Z<a.length-1;Z++){let F=a[Z],K=a[Z+1];if(W<=(F+K)/2){ee=F;break}if(W<K){ee=K;break}}W>a[a.length-1]&&(ee=Math.round(W/8)*8),C=M.unit==="rem"||M.unit==="em"?Math.round(ee/k*1e3)/1e3:ee}let L=M.hasMoved&&C!==M.startValue;g.current=null,document.exitPointerLock(),L?t(`${C}${M.unit}`):M.hasMoved?o==null||o(`${M.startValue}${M.unit}`):E.current&&x.current&&x.current(),n==null||n()};return document.addEventListener("mousemove",D),document.addEventListener("mouseup",B),()=>{document.removeEventListener("mousemove",D),document.removeEventListener("mouseup",B)}},[t,o,n]);let w=hd(D=>{var C;if(D.button!==0)return;D.preventDefault();let B=Dn(e),M=B.unit&&B.unit!=="px"?B.unit:l;g.current={startValue:B.num,unit:M,accum:0,hasMoved:!1},(C=u.current)==null||C.requestPointerLock()},[e,l]);return bd("span",{ref:u,onMouseDown:w,title:i?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:f({color:i?s||"#3b82f6":c||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize"},d),children:p})}import{Fragment as hi,jsx as Se,jsxs as At}from"react/jsx-runtime";function Md({gridCols:e,gridRows:t,gridModified:o,accentColor:n,onColsChange:r,onRowsChange:i}){return Se(sn,{style:{width:100},children:At("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[Se("input",{type:"number",min:1,max:12,value:e,onChange:s=>r(parseInt(s.target.value)||1),style:m(f({},Nt),{width:32,textAlign:"center",padding:2})}),Se("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"}),Se("input",{type:"number",min:1,max:12,value:t,onChange:s=>i(parseInt(s.target.value)||1),style:m(f({},Nt),{width:32,textAlign:"center",padding:2})})]})})}function kl({element:e,getValue:t,getOriginalValue:o,handleChange:n,isModified:r,onResetProperty:i,isCollapsed:s,onToggle:l,sectionHeaderStyle:a,activeDropdown:c,onDropdownChange:d,panelContentRef:p,accentColor:u,onFieldHover:g,preferredUnit:x,onUnitCycle:E}){let h=d,w=t("display"),D=t("flex-direction"),B=El(w,D),M=w==="flex"||w==="inline-flex",C=w==="grid",L=M||C,k=t("width"),W=t("height"),ee=r("width")?k:rr(e,"width"),Z=r("height")?W:rr(e,"height"),F=yi(k,ee),K=yi(W,Z),q=t("min-width"),we=t("max-width"),le=t("min-height"),he=t("max-height"),Fe=vo(t("padding")),Ie=t("gap"),$e=t("row-gap"),J=t("column-gap"),V=t("grid-template-columns"),te=t("grid-template-rows"),fe=t("overflow"),Ce=V.split(/\s+/).filter(j=>j&&j!=="none").length||1,ge=te.split(/\s+/).filter(j=>j&&j!=="none").length||1,[ue,We]=vl(!1),me=c!==null,lt=me||ue,qe=me?.3:ue?.65:1,Ne=({mode:j,icon:Ee,active:He})=>Se("button",{type:"button",onClick:()=>Cl(j,n),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:He?Un(u,.15):"transparent",color:He?u:"#64748b",cursor:"pointer",fontSize:14},children:Ee}),tt=(j,Ee,He)=>{He==="fixed"?n(j,Ee):n(j,hr(He,Ee))},A=j=>{let Ee=vo(t("padding")),He=j||"0";n("padding",`${Ee.top} ${He} ${Ee.bottom} ${He}`)},re=j=>{let Ee=vo(t("padding")),He=j||"0";n("padding",`${He} ${Ee.right} ${He} ${Ee.left}`)},[de,Le]=vl({}),ke=xo((j,Ee)=>He=>{Ee(He),Le(qt=>m(f({},qt),{[j]:He}))},[]),Re=xo(j=>{Le(Ee=>{let He=f({},Ee);return delete He[j],He})},[]),ve=xo(j=>{let Ee=vo(t("padding"));ze(e,"padding",`${Ee.top} ${j} ${Ee.bottom} ${j}`)},[e,t]),at=xo(j=>{let Ee=vo(t("padding"));ze(e,"padding",`${j} ${Ee.right} ${j} ${Ee.left}`)},[e,t]),Qe=xo(j=>Ee=>{ze(e,j,Ee)},[e]),ft=D==="column"||D==="column-reverse",rt=j=>j==="center"?1:j==="flex-end"||j==="end"?2:0,gt=rt(t("justify-content")),ct=rt(t("align-items")),Ct=ft?ct:gt,Pe=ft?gt:ct,Kt=mr(null),mt=mr({x:0,y:0}),Dt=mr({col:Ct,row:Pe});Dt.current={col:Ct,row:Pe};let Wt=xo((j,Ee)=>{let He=["flex-start","center","flex-end"];ft?(n("justify-content",He[Ee]),n("align-items",He[j])):(n("justify-content",He[j]),n("align-items",He[Ee]))},[ft,n]),xn=mr(Wt);xn.current=Wt,xd(()=>{let Ee=He=>{let qt=Kt.current;if(!qt||!qt.contains(He.target))return;He.preventDefault(),He.stopPropagation(),mt.current.x+=He.deltaX,mt.current.y+=He.deltaY;let{col:nt,row:vt}=Dt.current,ut=!1;Math.abs(mt.current.x)>=30&&(nt=Math.max(0,Math.min(2,nt+(mt.current.x>0?1:-1))),mt.current.x=0,mt.current.y=0,ut=!0),!ut&&Math.abs(mt.current.y)>=30&&(vt=Math.max(0,Math.min(2,vt+(mt.current.y>0?1:-1))),mt.current.x=0,mt.current.y=0,ut=!0),ut&&(nt!==Dt.current.col||vt!==Dt.current.row)&&xn.current(nt,vt)};return document.addEventListener("wheel",Ee,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",Ee,{capture:!0})},[]);let Yt=()=>Se("div",{ref:Kt,onMouseEnter:()=>{We(!0),p.current&&(p.current.style.overflowY="hidden")},onMouseLeave:()=>{We(!1),p.current&&(p.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:hn,borderRadius:2,display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gridTemplateRows:"repeat(3, 1fr)",padding:6,gap:2,touchAction:"none"},children:[0,1,2].map(j=>[0,1,2].map(Ee=>Se("button",{type:"button",onClick:()=>Wt(Ee,j),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:Ee===Ct&&j===Pe?Se("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:Ee===0?At(hi,{children:[Se("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Se("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Se("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]}):Ee===1?At(hi,{children:[Se("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Se("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Se("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]}):At(hi,{children:[Se("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:u}),Se("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:u}),Se("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:u})]})}):Se("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${j}-${Ee}`)))}),Zt=r("grid-template-columns")||r("grid-template-rows");return At("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Se("div",{style:a,children:Se("span",{children:L?"Auto layout":"Layout"})}),At("div",{style:{padding:"8px 12px"},children:[At("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:hn,borderRadius:2,padding:2,opacity:qe,transition:"opacity 150ms ease"},children:[Se(Ne,{mode:"block",icon:Se(Ed,{size:16}),active:B==="block"}),Se(Ne,{mode:"flex-col",icon:Se(Cd,{size:16}),active:B==="flex-col"}),Se(Ne,{mode:"flex-row",icon:Se(wd,{size:16}),active:B==="flex-row"}),Se(Ne,{mode:"grid",icon:Se(kd,{size:16}),active:B==="grid"})]}),At("div",{style:{display:"flex",gap:4,marginBottom:8},children:[Se(bi,{label:"W",property:"width",cssValue:F==="fixed"?k:`${Math.round(e.getBoundingClientRect().width)}px`,mode:F,onValueChange:j=>n("width",j),onModeChange:j=>{if(j==="fixed"){let Ee=e.getBoundingClientRect();n("width",`${Math.round(Ee.width)}px`)}else n("width",hr(j,k))},modified:r("width"),dimmed:me&&c!=="width",dropdownOpen:c==="width",onDropdownChange:j=>h(j?"width":null),panelContentRef:p,accentColor:u,onReset:()=>i("width"),minValue:q!=="none"&&q!=="0px"&&q!=="auto"?q:"",maxValue:we!=="none"&&we!=="auto"?we:"",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")}),Se(bi,{label:"H",property:"height",cssValue:K==="fixed"?W:`${Math.round(e.getBoundingClientRect().height)}px`,mode:K,onValueChange:j=>n("height",j),onModeChange:j=>{if(j==="fixed"){let Ee=e.getBoundingClientRect();n("height",`${Math.round(Ee.height)}px`)}else n("height",hr(j,W))},modified:r("height"),dimmed:me&&c!=="height",dropdownOpen:c==="height",onDropdownChange:j=>h(j?"height":null),panelContentRef:p,minValue:le!=="none"&&le!=="0px"&&le!=="auto"?le:"",maxValue:he!=="none"&&he!=="auto"?he:"",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&&At("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8},children:[Se("div",{style:{opacity:me?.3:1,transition:"opacity 150ms ease"},children:Yt()}),At("div",{style:{flex:1,opacity:qe,transition:"opacity 150ms ease"},children:[Se("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"}),Se(sn,{dimmed:me,children:At("div",{style:{display:"flex",alignItems:"center"},children:[Se(bo,{value:Ie,onChange:j=>{Re("gap"),n("gap",j)},onPreview:ke("gap",Qe("gap")),onScrubEnd:()=>Re("gap"),onReset:()=>i("gap"),isModified:r("gap"),accentColor:u,defaultUnit:x,children:D==="column"||D==="column-reverse"?Se(wl,{size:12,strokeWidth:r("gap")?2.5:1.5}):Se(Sl,{size:12,strokeWidth:r("gap")?2.5:1.5})}),Se(mn,{property:"gap",value:de.gap||Ie,onChange:j=>n("gap",j),isModified:r("gap")||"gap"in de,style:m(f({},Nt),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:x,onUnitCycle:E})]})})]})]}),C&&At("div",{onMouseEnter:()=>g==null?void 0:g("gap"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:qe,transition:"opacity 150ms ease"},children:[Se(Md,{gridCols:Ce,gridRows:ge,gridModified:Zt,accentColor:u,onColsChange:j=>n("grid-template-columns",`repeat(${j}, 1fr)`),onRowsChange:j=>n("grid-template-rows",`repeat(${j}, 1fr)`)}),At("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[Se(sn,{dimmed:me,children:At("div",{style:{display:"flex",alignItems:"center"},children:[Se(bo,{value:J||Ie,onChange:j=>{Re("column-gap"),n("column-gap",j)},onPreview:ke("column-gap",Qe("column-gap")),onScrubEnd:()=>Re("column-gap"),onReset:()=>i("column-gap"),isModified:r("column-gap"),accentColor:u,defaultUnit:x,children:Se(Sl,{size:12,strokeWidth:r("column-gap")?2.5:1.5})}),Se(mn,{property:"column-gap",value:de["column-gap"]||J||Ie,onChange:j=>n("column-gap",j),isModified:r("column-gap")||"column-gap"in de,placeholder:"col",style:m(f({},Nt),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:x,onUnitCycle:E})]})}),Se(sn,{dimmed:me,children:At("div",{style:{display:"flex",alignItems:"center"},children:[Se(bo,{value:$e||Ie,onChange:j=>{Re("row-gap"),n("row-gap",j)},onPreview:ke("row-gap",Qe("row-gap")),onScrubEnd:()=>Re("row-gap"),onReset:()=>i("row-gap"),isModified:r("row-gap"),accentColor:u,defaultUnit:x,children:Se(wl,{size:12,strokeWidth:r("row-gap")?2.5:1.5})}),Se(mn,{property:"row-gap",value:de["row-gap"]||$e||Ie,onChange:j=>n("row-gap",j),isModified:r("row-gap")||"row-gap"in de,placeholder:"row",style:m(f({},Nt),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:x,onUnitCycle:E})]})})]})]}),L&&At("div",{onMouseEnter:()=>g==null?void 0:g("padding"),onMouseLeave:()=>g==null?void 0:g("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:qe,transition:"opacity 150ms ease"},children:[Se(sn,{style:{flex:1},dimmed:me,children:At("div",{style:{display:"flex",alignItems:"center"},children:[Se(bo,{value:Fe.left,onChange:j=>{Re("padding-h"),A(j)},onPreview:ke("padding-h",ve),onScrubEnd:()=>Re("padding-h"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:u,defaultUnit:x,snapSteps:mi,children:Se(vd,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Se(mn,{property:"padding",value:de["padding-h"]||Fe.left,onChange:j=>A(j),isModified:r("padding")||"padding-h"in de,placeholder:"H pad",style:m(f({},Nt),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:x,onUnitCycle:E})]})}),Se(sn,{style:{flex:1},dimmed:me,children:At("div",{style:{display:"flex",alignItems:"center"},children:[Se(bo,{value:Fe.top,onChange:j=>{Re("padding-v"),re(j)},onPreview:ke("padding-v",at),onScrubEnd:()=>Re("padding-v"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:u,defaultUnit:x,snapSteps:mi,children:Se(Sd,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Se(mn,{property:"padding",value:de["padding-v"]||Fe.top,onChange:j=>re(j),isModified:r("padding")||"padding-v"in de,placeholder:"V pad",style:m(f({},Nt),{flex:1,minWidth:0}),unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:x,onUnitCycle:E})]})})]}),At("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:qe,transition:"opacity 150ms ease"},children:[Se("input",{type:"checkbox",checked:fe==="hidden",onChange:j=>n("overflow",j.target.checked?"hidden":"visible"),style:{margin:0,accentColor:u}}),"Clip content"]})]})]})}import{AlignCenter as Td,AlignJustify as Id,AlignLeft as Ld,AlignRight as Rd,Baseline as Ad,ChevronDown as Pd,WholeWord as Bd}from"lucide-react";import{jsx as dt,jsxs as Tn}from"react/jsx-runtime";var Ml={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function Tl({element:e,getValue:t,handleChange:o,isModified:n,onResetProperty:r,isCollapsed:i,onToggle:s,sectionHeaderStyle:l,accentColor:a,colorVariables:c,activeColorDropdown:d,onColorDropdownChange:p,panelContentRef:u,preferredUnit:g,onUnitCycle:x}){var K;let E=t("font-family"),h=t("font-size"),w=t("font-weight"),D=t("line-height"),B=t("letter-spacing"),M=t("text-align"),C=t("color"),L=String(w),k=Ml[L]||L,W=Do(e,C),ee=C.includes("var(")?null:Fo(W,c),Z=({align:q,icon:we})=>{let le=M===q;return dt("button",{type:"button",onClick:()=>o("text-align",q),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:le?Un(a,.15):"transparent",color:le?a:"#64748b",cursor:"pointer"},children:we})},F=((K=E.split(",")[0])==null?void 0:K.trim().replace(/^["']|["']$/g,""))||"System";return Tn("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[dt("div",{style:l,children:dt("span",{children:"Typography"})}),Tn("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[dt(sn,{children:Tn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[dt("input",{type:"text",value:E,onChange:q=>o("font-family",q.target.value),style:m(f({},Nt),{flex:1,minWidth:0,padding:0,fontWeight:n("font-family")?600:400,color:n("font-family")?a:"inherit"}),title:E}),dt(Pd,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),Tn("div",{style:{display:"flex",gap:4},children:[dt(sn,{style:{flex:1},children:dt("select",{value:L,onChange:q=>o("font-weight",q.target.value),style:m(f({},Nt),{padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:n("font-weight")?600:400,color:n("font-weight")?a:"inherit"}),children:Object.entries(Ml).map(([q,we])=>dt("option",{value:q,children:we},q))})}),dt(sn,{style:{flex:1},children:dt("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:dt(mn,{property:"font-size",value:h,onChange:q=>o("font-size",q),isModified:n("font-size"),min:1,max:999,style:m(f({},Nt),{padding:"6px 8px",paddingRight:24,fontWeight:n("font-size")?600:400,color:n("font-size")?a:"inherit"}),unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:g,onUnitCycle:x})})})]}),Tn("div",{style:{display:"flex",gap:4},children:[dt(sn,{style:{flex:1},children:Tn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[dt(Ad,{size:12,style:{color:n("line-height")?a:"#999",flexShrink:0}}),dt(mn,{property:"line-height",value:D,onChange:q=>o("line-height",q),isModified:n("line-height"),step:.1,min:0,placeholder:"Auto",style:m(f({},Nt),{flex:1,minWidth:0,padding:0,fontWeight:n("line-height")?600:400,color:n("line-height")?a:"inherit"}),showUnit:!1})]})}),dt(sn,{style:{flex:1},children:Tn("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[dt(Bd,{size:12,style:{color:n("letter-spacing")?a:"#999",flexShrink:0}}),dt(mn,{property:"letter-spacing",value:B,onChange:q=>o("letter-spacing",q),isModified:n("letter-spacing"),step:.1,placeholder:"\u2014",style:m(f({},Nt),{flex:1,minWidth:0,padding:0,fontWeight:n("letter-spacing")?600:400,color:n("letter-spacing")?a:"inherit"}),showUnit:!1})]})})]}),Tn("div",{style:{display:"flex",gap:2,backgroundColor:hn,borderRadius:2,padding:2},children:[dt(Z,{align:"left",icon:dt(Ld,{size:14})}),dt(Z,{align:"center",icon:dt(Td,{size:14})}),dt(Z,{align:"right",icon:dt(Rd,{size:14})}),dt(Z,{align:"justify",icon:dt(Id,{size:14})})]}),Tn("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[dt("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")?a:"#64748b",fontWeight:n("color")?600:400,cursor:n("color")?"pointer":"default",width:40,flexShrink:0},children:"Color"}),dt("div",{style:{flex:1,minWidth:0},children:dt(xi,{value:C,resolvedValue:W,colorVariables:c,matchingVariable:ee,onChange:q=>o("color",q),accentColor:a,modified:n("color"),panelContentRef:u,isDropdownOpen:d==="color",onDropdownChange:q=>p(q?"color":null)})})]})]})]})}import{Fragment as Hd,jsx as ce,jsxs as bt}from"react/jsx-runtime";var Ll=[{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 Nd(e,t){let o=t.trim().toLowerCase();switch(e){case"opacity":return o==="1";case"border-width":return o==="0px"||o==="0"||o==="medium";case"border-radius":return o==="0px"||o==="0";case"border-style":return o==="none";case"box-shadow":return o==="none";case"backdrop-filter":return o==="none"||o==="";case"letter-spacing":return o==="normal"||o==="0px"||o==="0";case"background-color":return o==="rgba(0, 0, 0, 0)"||o==="transparent";default:return!1}}function yi(e,t){return!t||e==="auto"||e==="fit-content"||e==="max-content"||e==="min-content"?"hug":e==="100%"||t==="100%"?"fill":"fixed"}function hr(e,t){switch(e){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let o=Dn(t);if(typeof o.num=="number"&&!isNaN(o.num)){let n=o.unit==="%"?"px":o.unit||"px";return`${o.num}${n}`}return"auto"}}}function vo(e){let t=e.split(/\s+/).filter(Boolean);return t.length===1?{top:t[0],right:t[0],bottom:t[0],left:t[0]}:t.length===2?{top:t[0],right:t[1],bottom:t[0],left:t[1]}:t.length===3?{top:t[0],right:t[1],bottom:t[2],left:t[1]}:t.length>=4?{top:t[0],right:t[1],bottom:t[2],left:t[3]}:{top:"0px",right:"0px",bottom:"0px",left:"0px"}}function El(e,t){return e==="grid"?"grid":e==="flex"||e==="inline-flex"?t==="column"||t==="column-reverse"?"flex-col":"flex-row":"block"}function Cl(e,t){switch(e){case"block":t("display","block");break;case"flex-row":t("display","flex"),t("flex-direction","row");break;case"flex-col":t("display","flex"),t("flex-direction","column");break;case"grid":t("display","grid");break}}var hn="rgba(0, 0, 0, 0.04)",Nt={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};function bi({label:e,property:t,cssValue:o,mode:n,onValueChange:r,onModeChange:i,modified:s,dimmed:l,dropdownOpen:a,onDropdownChange:c,panelContentRef:d,accentColor:p="#3b82f6",onReset:u,minValue:g,maxValue:x,onMinChange:E,onMaxChange:h,onMinReset:w,onMaxReset:D,minModified:B,maxModified:M}){let C=Dn(o),L=s?C.unit||yo(t):yo(t),k=!s&&C.unit&&C.unit!==L?fi(C.num,L):C.num,[W,ee]=Ht(!1),[Z,F]=Ht(String(k)),[K,q]=Ht(!1),we=tn(null),le=tn(null),he=tn(null),Fe=tn(!1);pn(()=>{W||F(String(k))},[k,W]),pn(()=>{if(!a)return;let ge=We=>{le.current&&!le.current.contains(We.target)&&he.current&&!he.current.contains(We.target)&&(c==null||c(!1))},ue=We=>{We.key==="Escape"&&(c==null||c(!1))};return document.addEventListener("mousedown",ge),document.addEventListener("keydown",ue),()=>{document.removeEventListener("mousedown",ge),document.removeEventListener("keydown",ue)}},[a,c]),pn(()=>{W&&we.current&&(we.current.focus(),we.current.select())},[W]);let Ie=()=>{let ge=fr(Z,t,o,s);r(ge||`${Math.max(0,parseFloat(Z)||0)}${L}`),ee(!1)},$e=()=>{if(Fe.current){Fe.current=!1;return}Ie()},J=ge=>{if(ge.key==="Enter"){Ie();return}if(ge.key==="Escape"){Fe.current=!0,F(String(k)),ee(!1);return}if(ge.key==="ArrowUp"||ge.key==="ArrowDown"){ge.preventDefault();let ue=ge.key==="ArrowUp"?1:-1,We=ge.shiftKey?8:ge.altKey?.1:1,me=parseFloat(Z)||0,lt=Math.round(Math.max(0,me+ue*We)*1e3)/1e3;F(String(lt)),r(`${lt}${L}`)}},V={fixed:"Fixed",hug:"Hug",fill:"Fill"},te={fixed:ce(Il,{size:12}),hug:ce(Dd,{size:12}),fill:ce(Il,{size:12})},fe=()=>{c==null||c(!a)},Ce=()=>{if(!he.current||!(d!=null&&d.current))return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let ge=he.current.getBoundingClientRect(),ue=d.current.getBoundingClientRect(),We=d.current.closest('[data-devtools="panel"]'),me=We?We.getBoundingClientRect():{top:0,left:0};return{position:"fixed",top:ge.bottom+4-me.top,left:ue.left+4-me.left,width:ue.width-8}};return bt("div",{ref:he,onMouseEnter:()=>q(!0),onMouseLeave:()=>q(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:W?p:K?"rgba(0,0,0,0.15)":"transparent",backgroundColor:hn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:l?.3:1},children:[ce("span",{onClick:s&&u?u:void 0,title:s?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:s?p:"#999",fontWeight:s?600:400,padding:"0 8px",flexShrink:0,cursor:s?"pointer":"default"},children:e}),n==="fixed"?W?ce("input",{ref:we,type:"text",inputMode:"numeric",value:Z,onChange:ge=>F(ge.target.value),onKeyDown:J,onBlur:$e,style:m(f({},Nt),{flex:1,minWidth:0,padding:"4px 2px"})}):ce("span",{onClick:()=>ee(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:k}):ce("span",{style:{flex:1}}),bt("button",{type:"button",onClick:fe,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:[V[n],ce(vi,{size:12})]}),a&&bt("div",{ref:le,style:m(f({},Ce()),{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:[bt("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:[te.fixed,bt("span",{children:["Fixed ",t," (",o,")"]}),n==="fixed"&&ce(yr,{size:14,style:{marginLeft:"auto"}})]}),bt("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:[te.hug,ce("span",{children:"Hug contents"}),n==="hug"&&ce(yr,{size:14,style:{marginLeft:"auto"}})]}),bt("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:[te.fill,ce("span",{children:"Fill container"}),n==="fill"&&ce(yr,{size:14,style:{marginLeft:"auto"}})]}),ce("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),bt("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[bt("div",{style:{display:"flex",alignItems:"center",backgroundColor:hn,borderRadius:2,padding:"4px 8px"},children:[ce("span",{onClick:B?ge=>{ge.stopPropagation(),w==null||w()}:void 0,title:B?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:B?p:"#999",fontWeight:B?600:400,marginRight:8,flexShrink:0,cursor:B?"pointer":"default"},children:"Min"}),ce("input",{type:"text",value:g||"",placeholder:"\u2014",onChange:ge=>E==null?void 0:E(ge.target.value),onClick:ge=>ge.stopPropagation(),style:m(f({},Nt),{flex:1,minWidth:0,padding:0,textAlign:"right",color:B?p:"inherit",fontWeight:B?600:400})})]}),bt("div",{style:{display:"flex",alignItems:"center",backgroundColor:hn,borderRadius:2,padding:"4px 8px"},children:[ce("span",{onClick:M?ge=>{ge.stopPropagation(),D==null||D()}: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"}),ce("input",{type:"text",value:x||"",placeholder:"\u2014",onChange:ge=>h==null?void 0:h(ge.target.value),onClick:ge=>ge.stopPropagation(),style:m(f({},Nt),{flex:1,minWidth:0,padding:0,textAlign:"right",color:M?p:"inherit",fontWeight:M?600:400})})]})]})]})]})}function sn({children:e,style:t,dimmed:o}){let[n,r]=Ht(!1);return ce("div",{onMouseEnter:()=>r(!0),onMouseLeave:()=>r(!1),style:f({position:"relative",borderRadius:2,border:"1px solid",borderColor:n?"rgba(0,0,0,0.15)":"transparent",backgroundColor:hn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:o?.3:1},t),children:e})}function Mn({children:e}){let[t,o]=Ht(!1);return ce("div",{onMouseEnter:()=>o(!0),onMouseLeave:()=>o(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:t?"rgba(0,0,0,0.15)":"transparent",backgroundColor:hn,transition:"border-color 100ms ease"},children:e})}function mn({property:e,value:t,onChange:o,isModified:n=!1,step:r=1,min:i,max:s,style:l,placeholder:a,showUnit:c=!0,unitStyle:d,preferredUnit:p,onUnitCycle:u}){let g=Dn(t),x=yo(e),E=pr[e],w=p&&E&&E.includes(p)?p:x,D=n&&g.unit||w,B=!n&&g.unit&&g.unit!==D?fi(g.num,D):g.num,[M,C]=Ht(!1),[L,k]=Ht(""),W=$e=>{C(!0),k(String(B||"")),requestAnimationFrame(()=>$e.target.select())},ee=()=>{if(C(!1),L.trim()){let $e=fr(L,e,t,n);$e&&o($e)}},Z=$e=>{let J=$e.target.value;k(J);let V=J.trim(),te=V.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),fe=V.match(/^(-?[\d.]+)$/);if(te){let Ce=parseFloat(te[1]);isNaN(Ce)||o(`${Ce}${te[2].toLowerCase()}`)}else if(fe){let Ce=parseFloat(fe[1]);isNaN(Ce)||o(`${Ce}${D}`)}},F=$e=>{if($e.key==="Enter"){if(L.trim()){let J=fr(L,e,t,n);J&&o(J)}$e.target.blur();return}if($e.key==="ArrowUp"||$e.key==="ArrowDown"){$e.preventDefault();let J=$e.shiftKey?10:$e.altKey?.1:1,V=($e.key==="ArrowUp"?1:-1)*r*J,te=parseFloat(L)||B||0,fe=Math.round((te+V)*1e3)/1e3;i!==void 0&&(fe=Math.max(i,fe)),s!==void 0&&(fe=Math.min(s,fe)),k(String(fe)),o(`${fe}${D}`)}},K=/^-?[\d.]/.test(t.trim()),q=M?L:K?String(B):"",le=M&&/\s*(rem|em|px|%)\s*$/i.test(L)?"":D,he=u&&(le==="rem"||le==="px"),Fe={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},Ie=m(f({},d!=null?d:Fe),{pointerEvents:"auto",cursor:"pointer"});return bt(Hd,{children:[ce("input",{type:"text",inputMode:"decimal",value:q,onFocus:W,onBlur:ee,onChange:Z,onKeyDown:F,placeholder:a,style:l}),c&&le&&ce("span",{style:he?Ie:d!=null?d:Fe,onClick:he?u:void 0,title:he?"Click to switch units":void 0,children:le})]})}function xi({value:e,resolvedValue:t,colorVariables:o,matchingVariable:n,onChange:r,accentColor:i="#3b82f6",modified:s,panelContentRef:l,isDropdownOpen:a,onDropdownChange:c}){let[d,p]=Ht(!1),u=!e.includes("var(")&&n?n.usage:e,[g,x]=Ht(u),[E,h]=Ht(!1),[w,D]=Ht(!1),[B,M]=Ht(!1),C=tn(null),L=tn(null),k=tn(null),W=a!==void 0?a:E,ee=c||h,Z=wn(()=>{if(!k.current)return{position:"fixed",top:0,left:0,width:200};let J=k.current.getBoundingClientRect(),V=k.current.closest('[data-devtools="panel"]'),te=V?V.getBoundingClientRect():{top:0,left:0};if(l!=null&&l.current){let fe=l.current.getBoundingClientRect();return{position:"fixed",top:J.bottom+4-te.top,left:fe.left+4-te.left,width:fe.width-8}}return{position:"fixed",top:J.bottom+4-te.top,left:J.left-te.left,width:J.width}},[l]);pn(()=>{if(!d){let J=!e.includes("var(")&&n?n.usage:e;x(J)}},[e,d,n]),pn(()=>{if(!W&&!w)return;let J=te=>{k.current&&!k.current.contains(te.target)&&(ee(!1),D(!1))},V=te=>{te.key==="Escape"&&(ee(!1),D(!1))};return document.addEventListener("mousedown",J),document.addEventListener("keydown",V),()=>{document.removeEventListener("mousedown",J),document.removeEventListener("keydown",V)}},[W,w]),pn(()=>{d&&C.current&&(C.current.focus(),C.current.select())},[d]);let F=br(()=>{if(!g||g.startsWith("#")||g.startsWith("rgb")||g.startsWith("hsl")||g.startsWith("oklch"))return[];let J=g.toLowerCase();return o.filter(V=>V.name.toLowerCase().includes(J)||V.usage.toLowerCase().includes(J)).slice(0,8)},[g,o]),K=()=>{r(g),p(!1),D(!1)},q=J=>{x(J),J.includes("var")||J.includes("--")||J.length>0&&!J.startsWith("#")?D(!0):D(!1)},we=J=>{x(J.usage),r(J.usage),ee(!1),D(!1),p(!1)},le=()=>{setTimeout(()=>{!W&&!w&&K()},150)},he=J=>{J.key==="Enter"?K():J.key==="Escape"&&(x(e),p(!1),D(!1))},Fe=br(()=>{let J=t.trim().toLowerCase();if(J.startsWith("#"))return J.length===4?`#${J[1]}${J[1]}${J[2]}${J[2]}${J[3]}${J[3]}`:J.slice(0,7);let V=J.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(V){let fe=parseInt(V[1],10).toString(16).padStart(2,"0"),Ce=parseInt(V[2],10).toString(16).padStart(2,"0"),ge=parseInt(V[3],10).toString(16).padStart(2,"0");return`#${fe}${Ce}${ge}`}let te=J.match(/oklch\(\s*([\d.]+)/);if(te){let fe=Math.max(0,Math.min(1,parseFloat(te[1]))),Ce=Math.round(fe*255).toString(16).padStart(2,"0");return`#${Ce}${Ce}${Ce}`}return"#000000"},[t]),Ie=J=>{let V=J.target.value;x(V),r(V)},$e=e.includes("var(");return bt("div",{ref:k,onMouseEnter:()=>M(!0),onMouseLeave:()=>M(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:d?i:B?"rgba(0,0,0,0.15)":"transparent",backgroundColor:hn,transition:"border-color 100ms ease",overflow:"hidden"},children:[bt("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[bt("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[ce("input",{type:"color",value:Fe,onChange:Ie,style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),ce("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:t,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),d?ce("input",{ref:C,type:"text",value:g,onChange:J=>q(J.target.value),onKeyDown:he,onBlur:le,style:m(f({},Nt),{flex:1,minWidth:0})}):ce("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&&ce("button",{type:"button",onClick:()=>ee(!W),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:ce(vi,{size:12})})]}),w&&F.length>0&&ce("div",{style:m(f({},Z()),{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:F.map(J=>bt("button",{type:"button",onClick:()=>we(J),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:[ce("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:J.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ce("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:J.name})]},J.name))}),W&&ce("div",{ref:L,style:m(f({},Z()),{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(J=>bt("button",{type:"button",onClick:()=>we(J),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:u===J.usage||e===J.usage?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:u===J.usage||e===J.usage?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[ce("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:J.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),ce("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:J.name}),(u===J.usage||e===J.usage)&&ce(yr,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},J.name))})]})}function Rl({element:e,elementInfo:t,selector:o,styleModifications:n,dispatch:r,onClose:i,onHover:s,accentColor:l="#3b82f6"}){var Ne,tt;let a=tn(null),c=tn(null),[d,p]=Ht(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch(A){return!1}});pn(()=>{if(d)return;let A=setTimeout(()=>p(!0),50);return()=>clearTimeout(A)},[d]);let[u,g]=Ht(null),[x,E]=Ht(null),h=u!==null||x!==null,[w,D]=Ht("rem"),B=wn(()=>{D(A=>A==="rem"?"px":"rem")},[]),M=tn(new Map),[C,L]=Ht(""),k=br(()=>Qr(),[]);pn(()=>{let A=re=>{var Le;if(re.key!=="Escape")return;let de=document.activeElement;de&&((Le=a.current)!=null&&Le.contains(de))||i()};return window.addEventListener("keydown",A),()=>window.removeEventListener("keydown",A)},[i]);let W=tn({top:0,left:0,maxHeight:400}),[,ee]=Ht(0),Z="devtools-panel-position",F=tn({x:0,y:0}),K=tn(null),q=tn(!1);pn(()=>{try{let A=localStorage.getItem(Z);if(A){let re=JSON.parse(A);typeof re.top=="number"&&typeof re.left=="number"&&(q.current=!0,W.current=m(f({},W.current),{top:re.top,left:re.left}))}}catch(A){}},[]),pn(()=>{let A=de=>{let Le=K.current;if(!Le)return;let ke=Le.startOffsetX+(de.clientX-Le.startX),Re=Le.startOffsetY+(de.clientY-Le.startY),ve=280,at=16,Qe=Math.max(at,Math.min(window.innerWidth-ve-at,W.current.left+ke)),ft=Math.max(at,W.current.top+Re);F.current={x:Qe-W.current.left,y:ft-W.current.top};let rt=a.current,gt=rt==null?void 0:rt.parentElement;if(!gt)return;gt.style.top=`${ft}px`,gt.style.left=`${Qe}px`;let ct=document.getElementById("devtools-toolbar"),Ct=ct==null?void 0:ct.getBoundingClientRect(),Pe=window.innerHeight-16;Ct&&Qe+ve>Ct.left&&(Pe=Ct.top-8);let Kt=Math.max(0,ft),mt=Math.max(200,Pe-Kt);rt&&(rt.style.maxHeight=`${mt}px`)},re=()=>{if(!K.current)return;let de=W.current.top+F.current.y,Le=W.current.left+F.current.x;W.current=m(f({},W.current),{top:de,left:Le}),F.current={x:0,y:0},q.current=!0;try{localStorage.setItem(Z,JSON.stringify({top:de,left:Le}))}catch(ke){}K.current=null};return window.addEventListener("mousemove",A),window.addEventListener("mouseup",re),()=>{window.removeEventListener("mousemove",A),window.removeEventListener("mouseup",re)}},[]);let we=wn(A=>{A.button!==0||A.target.closest("button")||(A.preventDefault(),K.current={startX:A.clientX,startY:A.clientY,startOffsetX:F.current.x,startOffsetY:F.current.y})},[]);pn(()=>{F.current={x:0,y:0};let A=(Le=!1)=>{let ke=a.current,Re=280,ve=8,at,Qe;if(q.current)at=W.current.top,Qe=W.current.left;else{let Pe=e.getBoundingClientRect();Qe=Pe.right+ve,at=Pe.top,Qe+Re>window.innerWidth-ve&&(Qe=Pe.left-Re-ve),Qe<ve&&(Qe=Math.max(ve,(window.innerWidth-Re)/2))}let ft=document.getElementById("devtools-toolbar"),rt=ft==null?void 0:ft.getBoundingClientRect(),gt=window.innerHeight-16;rt&&Qe+Re>rt.left&&(gt=rt.top-ve);let ct=Math.max(0,at),Ct=Math.max(200,gt-ct);if(W.current={top:at,left:Qe,maxHeight:Ct},Le&&ke){let Pe=ke.parentElement;Pe&&!q.current&&(Pe.style.top=`${at+F.current.y}px`,Pe.style.left=`${Qe+F.current.x}px`),ke.style.maxHeight=`${Ct}px`}else ee(Pe=>Pe+1)};A(!1);let re=()=>A(!0),de=()=>A(!1);return window.addEventListener("scroll",re,{passive:!0}),window.addEventListener("resize",de,{passive:!0}),()=>{window.removeEventListener("scroll",re),window.removeEventListener("resize",de)}},[e]),pn(()=>{let A=a.current;if(!A)return;let re=de=>{let Le=c.current;if(!Le){de.preventDefault();return}let{scrollTop:ke,scrollHeight:Re,clientHeight:ve}=Le,at=ke<=0&&de.deltaY<0,Qe=ke+ve>=Re&&de.deltaY>0;(at||Qe)&&de.preventDefault()};return A.addEventListener("wheel",re,{passive:!1}),()=>A.removeEventListener("wheel",re)},[]);let le=br(()=>n.find(A=>A.selector===o),[n,o]),he=wn(A=>{let re=le==null?void 0:le.changes.find(de=>de.property===A);if(re)return re.modified;if(A.includes("color")){let de=Jr(e,A);if(de&&de.includes("var("))return de}return Po(e,A)},[e,le]),Fe=wn(A=>{if(M.current.has(A))return M.current.get(A);let re=le==null?void 0:le.changes.find(Le=>Le.property===A);if(re)return re.original;let de=Po(e,A);return M.current.set(A,de),de},[e,le]),Ie=wn((A,re)=>{let de=Fe(A);ze(e,A,re),A==="backdrop-filter"&&ze(e,"-webkit-backdrop-filter",re),r({type:"MODIFY_STYLE",payload:{selector:o,element:t,property:A,original:de,modified:re}})},[e,o,t,r,Fe]),$e=wn(()=>{qr(o,n);let A=n.find(re=>re.selector===o);if(A)for(let re of A.changes)r({type:"CLEAR_STYLE",payload:{selector:o,property:re.property}});M.current.clear()},[o,n,r]),J=wn(A=>{let re=n.find(Le=>Le.selector===o);re!=null&&re.changes.find(Le=>Le.property===A)&&e instanceof HTMLElement&&(e.style.removeProperty(A),r({type:"CLEAR_STYLE",payload:{selector:o,property:A}}),M.current.delete(A))},[e,o,n,r]),V=wn(()=>{let A=C.split(";").map(re=>re.trim()).filter(re=>re);for(let re of A){let de=re.indexOf(":");if(de>0){let Le=re.slice(0,de).trim(),ke=re.slice(de+1).trim();Le&&ke&&Ie(Le,ke)}}L("")},[C,Ie]),te=wn(A=>{var re;return(re=le==null?void 0:le.changes.some(de=>de.property===A))!=null?re:!1},[le]),fe=A=>{var Re;let re=he(A.property),de=te(A.property),Le=!de&&Nd(A.property,re),ke={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"};if(Le&&A.type!=="backdrop-filter")return ce(Mn,{modified:!1,children:ce("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:ve=>Ie(A.property,ve.target.value),style:m(f({},ke),{color:"#999"})})});switch(A.type){case"color":{let ve=Do(e,re),at=re.includes("var(")?null:Fo(ve,k);return ce(xi,{value:re,resolvedValue:ve,colorVariables:k,matchingVariable:at,onChange:Qe=>Ie(A.property,Qe),accentColor:l,modified:de,panelContentRef:c,isDropdownOpen:x===A.property,onDropdownChange:Qe=>E(Qe?A.property:null)})}case"number":{if(!!pr[A.property])return ce(Mn,{modified:de,children:ce(mn,{property:A.property,value:re,onChange:Qe=>Ie(A.property,Qe),isModified:de,min:A.min,max:A.max,step:A.step||1,style:m(f({},ke),{paddingRight:32}),unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:w,onUnitCycle:B})});let{num:at}=Dn(re);return ce(Mn,{modified:de,children:ce("input",{type:"number",value:at,min:A.min,max:A.max,step:A.step||1,onChange:Qe=>Ie(A.property,Qe.target.value),style:ke})})}case"select":return ce(Mn,{modified:de,children:bt("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[ce("select",{value:re,onChange:ve=>Ie(A.property,ve.target.value),style:m(f({},ke),{cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"}),children:(Re=A.options)==null?void 0:Re.map(ve=>ce("option",{value:ve,children:ve},ve))}),ce("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:ce(vi,{size:12})})]})});case"spacing":return ce(Mn,{modified:de,children:ce("input",{type:"text",value:re,onChange:ve=>Ie(A.property,ve.target.value),placeholder:"e.g., 10px or 10px 20px",style:ke})});case"backdrop-filter":return ce(xl,{value:re,onChange:ve=>Ie(A.property,ve),accentColor:l,modified:de,panelContentRef:c});default:return ce(Mn,{modified:de,children:ce("input",{type:"text",value:re,onChange:ve=>Ie(A.property,ve.target.value),style:ke})})}},Ce=(Ne=le==null?void 0:le.changes.length)!=null?Ne:0,ge=(tt=le==null?void 0:le.captured)!=null?tt:!1,ue=m(f({position:"fixed",top:W.current.top,left:W.current.left,width:280,maxHeight:W.current.maxHeight,backgroundColor:"rgba(255, 255, 255, 0.85)",backdropFilter:"blur(32px)",WebkitBackdropFilter:"blur(32px)"},gn),{zIndex:1e4,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontSize:12,overflow:"hidden",display:"flex",flexDirection:"column",opacity:d?1:0,transition:"opacity 150ms ease"}),We={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:K.current?"grabbing":"grab"},me={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"12px 12px 6px",userSelect:"none",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontWeight:600,color:"#475569"},lt={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},qe={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return ce("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:W.current.top+F.current.y,left:W.current.left+F.current.x,zIndex:1e4,pointerEvents:"none"},children:bt("div",{ref:a,"data-devtools":"panel",style:m(f({},ue),{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:[bt("div",{style:We,onMouseDown:we,children:[bt("div",{style:{display:"flex",alignItems:"center",gap:8,overflow:"hidden"},children:[ce("span",{style:{fontWeight:600,fontSize:11,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:t.tagName}),Ce>0&&ce("span",{style:{backgroundColor:ge?"#999999":l,color:"#fff",fontSize:9,padding:"1px 4px",borderRadius:2},children:Ce})]}),bt("div",{style:{display:"flex",gap:4},children:[Ce>0&&ce("button",{type:"button",onClick:$e,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:ce(Od,{size:14})}),ce("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:ce(Fd,{size:14})})]})]}),bt("div",{ref:c,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[ce("div",{style:{opacity:x?.3:1,transition:"opacity 150ms ease"},children:ce(kl,{element:e,getValue:he,getOriginalValue:Fe,handleChange:Ie,isModified:te,onResetProperty:J,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:me,activeDropdown:u,onDropdownChange:g,panelContentRef:c,accentColor:l,onFieldHover:s,preferredUnit:w,onUnitCycle:B})}),ce("div",{style:{opacity:u?.3:1,transition:"opacity 150ms ease"},children:ce(Tl,{element:e,getValue:he,handleChange:Ie,isModified:te,onResetProperty:J,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:me,accentColor:l,colorVariables:k,activeColorDropdown:x,onColorDropdownChange:E,panelContentRef:c,preferredUnit:w,onUnitCycle:B})}),Ll.map((A,re)=>{let de=re===Ll.length-1,Le=x&&A.properties.some(Re=>Re.property===x);return bt("div",{style:{borderBottom:de?"none":"1px solid rgba(0,0,0,0.08)",opacity:h&&!Le?.3:1,transition:"opacity 150ms ease"},children:[ce("div",{style:me,children:ce("span",{children:A.name})}),ce("div",{style:{padding:"4px 0"},children:A.properties.map(Re=>{let ve=te(Re.property),at=Le&&Re.property!==x;return bt("div",{style:m(f({},lt),{opacity:at?.3:1,transition:"opacity 150ms ease"}),children:[ce("span",{onClick:ve?()=>J(Re.property):void 0,title:ve?"Click to reset":void 0,style:m(f({},qe),{color:ve?l:"#64748b",fontWeight:ve?600:400,cursor:ve?"pointer":"default"}),children:Re.label}),ce("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:fe(Re)})]},Re.property)})})]},A.name)}),bt("div",{style:{opacity:h?.3:1,transition:"opacity 150ms ease"},children:[ce("div",{style:me,children:ce("span",{children:"Raw CSS"})}),bt("div",{style:{padding:"8px 12px"},children:[ce("textarea",{value:C,onChange:A=>L(A.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"}}),C.trim()&&ce("button",{type:"button",onClick:V,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:l,color:"#fff",cursor:"pointer",opacity:C.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as zd,useLayoutEffect as _d,useState as $d}from"react";import{Fragment as Gd,jsx as Kn,jsxs as jd}from"react/jsx-runtime";var Si=["flex-start","center","flex-end"],wi=["flex-start","center","flex-end"];function Wd(e){return e==="normal"||e==="flex-start"||e==="start"?"flex-start":e==="flex-end"||e==="end"?"flex-end":e==="center"?"center":null}function Yd(e){return e==="normal"||e==="stretch"||e==="flex-start"||e==="start"?"flex-start":e==="flex-end"||e==="end"?"flex-end":e==="center"?"center":null}function Al(e){let t=Array.from(e.children);if(t.length===0)return null;let o=1/0,n=1/0,r=-1/0,i=-1/0;for(let s of t){let l=s.getBoundingClientRect();l.width===0&&l.height===0||(l.top<o&&(o=l.top),l.left<n&&(n=l.left),l.bottom>r&&(r=l.bottom),l.right>i&&(i=l.right))}return o===1/0?null:new DOMRect(n,o,i-n,r-o)}function Pl({element:e,modifier:t,accentColor:o,refreshKey:n=0}){let[r,i]=$d(null);if(zd(()=>{if(!e){i(null);return}let E=()=>i(Al(e));return E(),window.addEventListener("scroll",E,{passive:!0}),window.addEventListener("resize",E,{passive:!0}),()=>{window.removeEventListener("scroll",E),window.removeEventListener("resize",E)}},[e]),_d(()=>{e&&i(Al(e))},[e,n]),!r)return null;let s=r,l=window.getComputedStyle(e),a=l.display;if(a!=="flex"&&a!=="inline-flex")return null;let c=l.flexDirection,d=c==="column"||c==="column-reverse"?"vertical":"horizontal",p=d==="horizontal"?"vertical":"horizontal",u=[];if(t==="shift"){let E=Wd(l.justifyContent);if(E){let h=Si.indexOf(E);d==="horizontal"?(h>0&&u.push("left"),h<Si.length-1&&u.push("right")):(h>0&&u.push("up"),h<Si.length-1&&u.push("down"))}}else{let E=Yd(l.alignItems);if(E){let h=wi.indexOf(E);p==="horizontal"?(h>0&&u.push("left"),h<wi.length-1&&u.push("right")):(h>0&&u.push("up"),h<wi.length-1&&u.push("down"))}}if(u.length===0)return null;let g=14,x=7;return Kn(Gd,{children:u.map(E=>{let h,w;switch(E){case"right":h=s.right+g,w=s.top+s.height/2;break;case"left":h=s.left-g,w=s.top+s.height/2;break;case"down":h=s.left+s.width/2,w=s.bottom+g;break;case"up":h=s.left+s.width/2,w=s.top-g;break}let D=E==="right"?0:E==="left"?180:E==="down"?90:-90,B={position:"fixed",left:h-x,top:w-x,width:x*2,height:x*2,pointerEvents:"none",zIndex:9997};return Kn("div",{"data-devtools":"swipe-hint",style:B,children:Kn("svg",{width:x*2,height:x*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:jd("g",{transform:`rotate(${D})`,children:[Kn("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),Kn("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),Kn("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:o,strokeWidth:"1.5",strokeLinecap:"round"}),Kn("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:o,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},E)})})}import{useEffect as Vd,useLayoutEffect as Ud,useState as Jd}from"react";import{jsx as ki,jsxs as Ei}from"react/jsx-runtime";function Xd(e,t){let o=e.match(/^oklch\(([^)]+)\)$/i);return o?`oklch(${o[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function Bl({element:e,fontSize:t,lineHeight:o,accentColor:n,hoveredProperty:r,draggingProperty:i,cursorViewport:s}){let[l,a]=Jd(null);if(Vd(()=>{if(!e){a(null);return}let w=()=>{a(po(e))};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[e]),Ud(()=>{e&&a(po(e))},[e,t,o]),!l)return null;let c=l.width,d=l.height,p=Xd(n,.2),u=i!=null?i:r,g=8,x=2,E={position:"fixed",top:l.top,left:l.left,width:c,height:d,pointerEvents:"none",zIndex:9996,overflow:"visible"},h=w=>w==="font-size"?`${Math.round(t)}`:(t>0?o/t:1.2).toFixed(2).replace(/\.?0+$/,"");return Ei("div",{"data-devtools":"text-handles",style:E,children:[Ei("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${d}`,children:[ki("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)&&ki("rect",{x:c-x/2,y:d/2-g/2,width:x,height:g,fill:n,stroke:"#ffffff",strokeWidth:u==="font-size"?4:2,paintOrder:"stroke"}),(u==="line-height"||!u)&&ki("rect",{x:c/2-g/2,y:d-x/2,width:g,height:x,fill:n,stroke:"#ffffff",strokeWidth:u==="line-height"?4:2,paintOrder:"stroke"})]}),s&&u&&(()=>{let w=u==="font-size"?"Aa":"Lh",D=h(u);return Ei("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:[w," ",D]})})()]})}import{Fragment as wo,jsx as ot,jsxs as So}from"react/jsx-runtime";var Ol=8,Mi=[0,1,2,4,8,12,16,20,24,28,32],Ti="devtools-active-text";function Dl(e,t,o=0){let n=e.left+window.scrollX+4,r=t==="top-left"?e.top+window.scrollY-Vn-o*Vn+4:e.bottom+window.scrollY+4-1+o*Vn,i=window.scrollY+4,s=window.scrollY+window.innerHeight-Vn-4;return r<i?r=e.top+window.scrollY+4:r>s&&(r=Math.max(e.top+window.scrollY+4,s)),{x:n,y:r}}function Fl({state:e,dispatch:t,onScreenshot:o,inFlightAnnotationIds:n,inFlightStyleSelectors:r,inFlightSelectorColors:i,onAttachImages:s,onReply:l,onViewThread:a,onCloseThread:c,onModelComponentsAdd:d,onModelComponentFocus:p,onModelComponentHover:u,modelComponentNames:g,modelPanelHoveredComponent:x,modelSpacingTokenHover:E,highlightedAnnotationIds:h}){var os,rs,is,ss,ls,as,cs,ds,us;let{canvasRef:w,redrawAll:D,resizeCanvas:B}=Hs(),M=kt(!1);_t(()=>{let b=w.current;if(!b)return;let S=()=>{M.current&&(M.current=!1,b.style.pointerEvents="")},X=I=>{I.button===0&&M.current&&S()};return window.addEventListener("mousedown",X),()=>window.removeEventListener("mousedown",X)},[w]);let[C,L]=st(!1),[k,W]=st(()=>{if(typeof window=="undefined")return null;try{let b=localStorage.getItem(Ti);return b?JSON.parse(b):null}catch(b){return null}}),[ee,Z]=st(null),[F,K]=st(null),[q,we]=st(null),le=kt(null),he=kt(null),Fe=kt({x:0,y:0}),Ie=kt([]),$e=kt(0),[J,V]=st(null),[te,fe]=st(new Map),Ce=kt(0),ge=kt(null),[ue,We]=st(null),[me,lt]=st(null),qe=kt({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}),[Ne,tt]=st(null),[A,re]=st(null),[de,Le]=st(null),[ke,Re]=st(null),ve=kt({x:0,y:0}),[at,Qe]=st({x:0,y:0}),ft=kt({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}),[rt,gt]=st(null),[ct,Ct]=st(null),[Pe,Kt]=st(null),[mt,Dt]=st(!1),[Wt,xn]=st(0),[Yt,Zt]=st(null),Gt=kt({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,Ee]=st(null),[He,qt]=st(null),[nt,vt]=st(null),ut=kt({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[ht,An]=st(null),[Vt,an]=st(null),[N,Q]=st(null),pe=zs(),Ae=kt(i);Ae.current=i;let Te=Pt(b=>{let S=Ae.current;if(!S||S.size===0)return!1;for(let X of S.keys())try{if(b.matches(X))return!0}catch(I){}return!1},[]),v=kt(e);v.current=e;let U=kt(k);U.current=k;let oe=kt([]),Be=kt(o);Be.current=o;let[ye,et]=st(null),je=e.selectedAnnotationIds;oe.current=je;let Me=Pt((b,S=!1)=>{t({type:"SELECT_ANNOTATION",payload:{id:b,addToSelection:S}})},[t]),Ye=Pt(()=>{t({type:"SELECT_ANNOTATION",payload:{id:null}})},[t]),[Ke,Lt]=st(null),[St,Er]=st({x:window.scrollX,y:window.scrollY});_t(()=>(B(),window.addEventListener("resize",B),()=>window.removeEventListener("resize",B)),[B]),_t(()=>{let b=()=>{Er({x:window.scrollX,y:window.scrollY})};return window.addEventListener("scroll",b,{passive:!0}),()=>window.removeEventListener("scroll",b)},[]),_t(()=>{k?localStorage.setItem(Ti,JSON.stringify(k)):localStorage.removeItem(Ti)},[k]),_s(k,W,ee,e.annotations,t);let Nn=kt(J);Nn.current=J,_t(()=>{if(e.activeTool!=="model"||!e.isAnnotating)return;let b=S=>{if(!S.altKey||!Nn.current)return;S.preventDefault();let X=S.deltaY>0?-1:1;Ce.current=Math.max(0,Ce.current+X);let I=ge.current;if(I){let P=nr(I,Ce.current);V(P)}};return window.addEventListener("wheel",b,{passive:!1}),()=>window.removeEventListener("wheel",b)},[e.activeTool,e.isAnnotating]),_t(()=>{e.activeTool!=="model"&&(V(null),fe(new Map),Ce.current=0,ge.current=null)},[e.activeTool]),_t(()=>{var X;let b=(X=J==null?void 0:J.name)!=null?X:null,S=b&&(g!=null&&g.has(b))?b:null;u==null||u(S)},[J,g,u]);let[Lo,jo]=st(null);_t(()=>{var X;if(!x){jo(null);return}let b=ao(x.name),S=x.instanceIndex;jo((X=b[S%b.length])!=null?X:null)},[x]);let[cn,Cr]=st([]);_t(()=>{var b,S;if(!E){Cr([]);return}(S=(b=E.token)==null?void 0:b.bindings)!=null&&S.length?Cr(Vr(E.token)):Cr(jr(E.px))},[E]);let ia=kt(null),sa=kt(null);ia.current=rt,sa.current=ct,_t(()=>{let b=["flex-start","center","flex-end"],S=["flex-start","center","flex-end"],I=null,P=!1,H=null,ie=null,z=(ae,xe)=>{let Ve=Wn(ae,xe);for(;Ve&&Ve!==document.documentElement;){let it=window.getComputedStyle(Ve).display;if(it==="flex"||it==="inline-flex")return Ve;Ve=Ve.parentElement}return null},Y=ae=>{let xe=window.getComputedStyle(ae).flexDirection;return xe==="column"||xe==="column-reverse"?"vertical":"horizontal"},y=ae=>{let xe=ae.getAttribute("data-pm");return xe||(xe=Math.random().toString(36).substring(2,8),ae.setAttribute("data-pm",xe)),{selector:`[data-pm="${xe}"]`,durableSelector:on(ae)}},T=()=>{P=!0,I&&clearTimeout(I),I=setTimeout(()=>{P=!1,I=null},300)},G=(ae,xe,Ue)=>{let Ve=Y(ae);if(xe===Ve){let Oe=window.getComputedStyle(ae).justifyContent,yt=Oe==="normal"||Oe==="flex-start"||Oe==="start"?"flex-start":Oe==="flex-end"||Oe==="end"?"flex-end":Oe==="center"?"center":null;if(!yt)return;let Rt=b.indexOf(yt)+Ue;if(Rt<0||Rt>=b.length)return;let En=b[Rt],{selector:zn,durableSelector:Tr}=y(ae);ze(ae,"justify-content",En),t({type:"MODIFY_STYLES_BATCH",payload:{selector:zn,durableSelector:Tr,element:Jt(ae),changes:[{property:"justify-content",original:Oe,modified:En}]}})}else{let Oe=window.getComputedStyle(ae).flexDirection,yt=Ve==="horizontal"?"column":"row",{selector:fn,durableSelector:Rt}=y(ae);ze(ae,"flex-direction",yt),t({type:"MODIFY_STYLES_BATCH",payload:{selector:fn,durableSelector:Rt,element:Jt(ae),changes:[{property:"flex-direction",original:Oe,modified:yt}]}})}xn(it=>it+1)},R=(ae,xe,Ue)=>{let it=Y(ae)==="horizontal"?"vertical":"horizontal";if(xe!==it)return;let yt=window.getComputedStyle(ae).alignItems,fn=yt==="normal"||yt==="stretch"||yt==="flex-start"||yt==="start"?"flex-start":yt==="flex-end"||yt==="end"?"flex-end":yt==="center"?"center":null;if(!fn)return;let En=S.indexOf(fn)+Ue;if(En<0||En>=S.length)return;let zn=S[En],{selector:Tr,durableSelector:ha}=y(ae);ze(ae,"align-items",zn),t({type:"MODIFY_STYLES_BATCH",payload:{selector:Tr,durableSelector:ha,element:Jt(ae),changes:[{property:"align-items",original:yt,modified:zn}]}}),xn(ya=>ya+1)},O=20,_=null,$=null,se=0,be=(ae,xe,Ue)=>{let Ve=z(xe,Ue);Zt(Ve?{modifier:ae,target:Ve}:null)},Ze=ae=>{if(!(e.activeTool!=="hand"||!e.isAnnotating)){if(ae.key==="Shift"&&!ae.altKey){let xe=ve.current;be("shift",xe.x,xe.y)}else if(ae.key==="Alt"&&!ae.shiftKey){let xe=ve.current;be("alt",xe.x,xe.y)}}},Ge=ae=>{if(e.activeTool!=="hand"||!e.isAnnotating)return;let xe=ae.shiftKey&&!ae.altKey,Ue=ae.altKey&&!ae.shiftKey;if(!xe&&!Ue||ae.buttons!==0){_=null,$=null,se=0,H=null,ie=null,Zt(null);return}if(H===null&&(H=ae.clientX,ie=ae.clientY,be(xe?"shift":"alt",ae.clientX,ae.clientY)),P)return;_===null&&(_=ae.clientX,$=ae.clientY,se=0);let Ve=ae.clientX-_,it=ae.clientY-$,Oe=Math.abs(Ve)>=Math.abs(it)?Ve:it;if(Math.abs(Oe)>3){let zn=Oe>0?1:-1;if(se!==0&&zn!==se){_=ae.clientX,$=ae.clientY,se=0;return}se=zn}if(Math.abs(Ve)<O&&Math.abs(it)<O)return;let yt=z(H,ie);if(!yt)return;let fn=Math.abs(Ve)>=Math.abs(it)?"horizontal":"vertical",En=(fn==="horizontal"?Ve:it)>0?1:-1;_=null,$=null,se=0,xe?G(yt,fn,En):R(yt,fn,En),T()},Mt=ae=>{(ae.key==="Shift"||ae.key==="Alt")&&(H=null,ie=null,_=null,$=null,se=0,Zt(null))},pt=()=>{Zt(null),_=null,$=null,se=0};return window.addEventListener("keydown",Ze),window.addEventListener("mousemove",Ge),window.addEventListener("mousedown",pt),window.addEventListener("keyup",Mt),()=>{window.removeEventListener("keydown",Ze),window.removeEventListener("mousemove",Ge),window.removeEventListener("mousedown",pt),window.removeEventListener("keyup",Mt),I&&clearTimeout(I)}},[e.activeTool,e.isAnnotating,t]),_t(()=>{let b=S=>{var P,H,ie,z;if(S.key==="Escape"){if(U.current)return;if(e.activeTool==="model"&&te.size>0){S.preventDefault(),fe(new Map);return}if(oe.current.length>0){S.preventDefault(),Ye();return}}if(S.key==="Enter"&&e.activeTool==="model"&&te.size>0&&d){S.preventDefault();let Y=[...te.keys()].filter(y=>!(g!=null&&g.has(y)));Y.length>0&&d(Y),fe(new Map);return}if((S.metaKey||S.ctrlKey)&&S.key==="v"&&Ie.current.length>0&&!U.current){S.preventDefault(),$e.current++;let Y=$e.current*20,T=((P=Ie.current[0])==null?void 0:P.groupId)?Math.random().toString(36).substring(2,9):void 0,G=Ie.current.map(O=>m(f({},O),{id:Math.random().toString(36).substring(2,9),groupId:O.groupId?T:void 0,timestamp:Date.now(),points:O.points.map(_=>({x:_.x+Y,y:_.y+Y}))}));t({type:"PASTE_ANNOTATIONS",payload:{annotations:G}});let R=G.find(O=>O.type!=="text")||G[0];R&&Me(R.id);return}let X=oe.current;if(X.length===0||U.current)return;let I=(H=S.target)==null?void 0:H.tagName;if(!(I==="INPUT"||I==="TEXTAREA"||(ie=S.target)!=null&&ie.isContentEditable)&&(S.key==="Delete"||S.key==="Backspace")){if(S.preventDefault(),c){let Y=v.current.annotations;for(let y of X){let T=Y.find(R=>R.id===y);if(!T)continue;let G=T.threadId||T.groupId&&((z=Y.find(R=>R.groupId===T.groupId&&R.threadId))==null?void 0:z.threadId);G&&c(G)}}for(let Y of X)t({type:"DELETE_ANNOTATION",payload:{id:Y}});Ye()}};return window.addEventListener("keydown",b),()=>window.removeEventListener("keydown",b)},[t,Ye,Me,e.activeTool,te,g,d,c]);let Pn=Ci(()=>dr(e.annotations),[e.annotations]),Go=Ci(()=>{let b=new Map,S=new Set,X=1;for(let I of e.annotations)if(!Pn.has(I))if(I.groupId){if(!S.has(I.groupId)){S.add(I.groupId);let P=e.annotations.filter(H=>H.groupId===I.groupId);for(let H of P)b.set(H.id,X);X++}}else b.set(I.id,X),X++;return b},[e.annotations,Pn]),Ki=Ci(()=>{if(je.length===0)return null;let b=new Map;for(let S of je){let X=e.annotations.find(P=>P.id===S);if(!X)continue;let I=X.groupId?e.annotations.filter(P=>P.groupId===X.groupId):[X];for(let P of I)if(P.linkedSelector&&!(i!=null&&i.has(P.linkedSelector))){let H=P.color||e.activeColor;b.set(P.linkedSelector,H)}}return b.size>0?b:null},[je,e.annotations,e.activeColor,i]);_t(()=>{let b=e.annotations.filter(S=>!(Pn.has(S)||k&&!k.isNew&&S.id===k.id));D(b,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,je,Ol,St.x,St.y,Go,h)},[e.annotations,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,D,k,je,St,Go,Pn,h]),_t(()=>{if(F){let b=Math.random().toString(36).substring(2,9);W({id:b,point:F.point,text:"",fontSize:12,isNew:!0,groupId:F.groupId}),K(null)}},[F]),_t(()=>{q&&(W({id:Math.random().toString(36).substring(2,9),point:q.point,text:"",fontSize:12,isNew:!0,linkedSelector:q.linkedSelector,linkedAnchor:q.linkedAnchor,elements:q.elements}),we(null))},[q]);let Vo=kt(null),Uo=(os=k==null?void 0:k.id)!=null?os:null;_t(()=>{Uo&&le.current?requestAnimationFrame(()=>{var X;let b=le.current;if(!b||(b.focus(),he.current===Uo))return;he.current=Uo;let S=U.current;if(S){if(Vo.current!==null){let I=Math.min(Vo.current,b.value.length);b.setSelectionRange(I,I);return}if(!S.isNew&&S.clickPoint){let I=w.current;if(!I)return;let P=I.getContext("2d");if(!P)return;P.font=`${S.fontSize}px ${Ft}`;let H=S.fontSize*1.4,ie=S.text.split(`
+`),z=S.clickPoint.y-S.point.y,Y=Math.max(0,Math.min(ie.length-1,Math.floor(z/H))),y=S.clickPoint.x-S.point.x,T=ie[Y]||"",G=0;for(let O=0;O<=T.length;O++){let _=P.measureText(T.substring(0,O)).width;if(_>y){let $=O>0?P.measureText(T.substring(0,O-1)).width:0;G=y-$<_-y?O-1:O;break}G=O}let R=G;for(let O=0;O<Y;O++)R+=(((X=ie[O])==null?void 0:X.length)||0)+1;b.setSelectionRange(R,R)}}}):(he.current=null,Vo.current=null)},[Uo,w]);let eo=Pt(b=>{let S=w.current;if(!S)return{x:0,y:0};let X=S.getBoundingClientRect(),I,P;if("touches"in b&&b.touches[0])I=b.touches[0].clientX,P=b.touches[0].clientY;else if("clientX"in b)I=b.clientX,P=b.clientY;else return{x:0,y:0};return{x:I-X.left+window.scrollX,y:P-X.top+window.scrollY}},[w]),Hn=Pt((b,S,X,I)=>{let P=X.x-S.x,H=X.y-S.y,ie=P*P+H*H;if(ie===0)return Math.sqrt((b.x-S.x)**2+(b.y-S.y)**2)<=I;let z=Math.max(0,Math.min(1,((b.x-S.x)*P+(b.y-S.y)*H)/ie)),Y=S.x+z*P,y=S.y+z*H;return Math.sqrt((b.x-Y)**2+(b.y-y)**2)<=I},[]),Jo=Pt(b=>{for(let X=e.annotations.length-1;X>=0;X--){let I=e.annotations[X];if(!I||Pn.has(I))continue;let P=(I.strokeWidth||3)+4;switch(I.type){case"text":{if(!I.points[0]||!I.text)continue;let H=I.points[0],ie=I.fontSize||12,z=w.current;if(z){let Y=z.getContext("2d");if(Y){Y.font=`${ie}px ${Ft}`;let y=I.text.split(`
+`),T=H.x-St.x,G=so(T),R=G!==void 0?Math.min(400,G):void 0,O=R?$n(Y,y,R):y,_=R?Math.min(R,Math.max(...O.map(Ze=>Y.measureText(Ze).width))):Math.max(...y.map(Ze=>Y.measureText(Ze).width)),$=O.length*(ie*1.4),se=y.length*(ie*1.4),be=$-se;if(b.x>=H.x-4-4&&b.x<=H.x+_+4+4&&b.y>=H.y-4-4-be&&b.y<=H.y+se+4+4)return I}}break}case"rectangle":{if(I.points.length<2)continue;let H=I.points[0],ie=I.points[I.points.length-1],z=Math.min(H.x,ie.x),Y=Math.max(H.x,ie.x),y=Math.min(H.y,ie.y),T=Math.max(H.y,ie.y),G=Hn(b,{x:z,y},{x:Y,y},P),R=Hn(b,{x:z,y:T},{x:Y,y:T},P),O=Hn(b,{x:z,y},{x:z,y:T},P),_=Hn(b,{x:Y,y},{x:Y,y:T},P);if(G||R||O||_)return I;break}case"circle":{if(I.points.length<2)continue;let H=I.points[0],ie=I.points[I.points.length-1],z=(H.x+ie.x)/2,Y=(H.y+ie.y)/2,y=Math.abs(ie.x-H.x)/2,T=Math.abs(ie.y-H.y)/2,G=b.x-z,R=b.y-Y,O=Math.sqrt((G/y)**2+(R/T)**2);if(Math.abs(O-1)*Math.max(y,T)<=P)return I;break}case"line":{if(I.points.length<2)continue;let H=I.points[0],ie=I.points[I.points.length-1];if(Hn(b,H,ie,P))return I;break}case"freehand":{if(I.points.length<2)continue;for(let H=0;H<I.points.length-1;H++){let ie=I.points[H],z=I.points[H+1];if(Hn(b,ie,z,P))return I}break}}}return null},[e.annotations,w,Hn,Pn,St.x]),Zi=Pt(b=>{let S=Jo(b);return(S==null?void 0:S.type)==="text"?S:null},[Jo]),qi=Pt(b=>{if(je.length===0)return null;let S=Ol/2+4;for(let X of je){let I=e.annotations.find(P=>P.id===X);if(!(!I||I.points.length<2)){if(I.type==="line"){let P=I.points[0],H=I.points[I.points.length-1];if(Math.sqrt((b.x-P.x)**2+(b.y-P.y)**2)<=S)return{handle:"start",annotationId:X};if(Math.sqrt((b.x-H.x)**2+(b.y-H.y)**2)<=S)return{handle:"end",annotationId:X};continue}if(I.type==="circle"){let P=I.points[0],H=I.points[I.points.length-1],ie=Math.min(P.x,H.x),z=Math.max(P.x,H.x),Y=Math.min(P.y,H.y),y=Math.max(P.y,H.y),T=(ie+z)/2,G=(Y+y)/2,R=[{handle:"top",x:T,y:Y},{handle:"bottom",x:T,y},{handle:"left",x:ie,y:G},{handle:"right",x:z,y:G}];for(let{handle:O,x:_,y:$}of R)if(Math.sqrt((b.x-_)**2+(b.y-$)**2)<=S)return{handle:O,annotationId:X};continue}if(I.type==="rectangle"||I.type==="freehand"){let P=I.points[0],H=I.points[I.points.length-1],ie,z,Y,y;I.type==="freehand"?(ie=Math.min(...I.points.map(G=>G.x)),z=Math.max(...I.points.map(G=>G.x)),Y=Math.min(...I.points.map(G=>G.y)),y=Math.max(...I.points.map(G=>G.y))):(ie=Math.min(P.x,H.x),z=Math.max(P.x,H.x),Y=Math.min(P.y,H.y),y=Math.max(P.y,H.y));let T=[{corner:"topLeft",x:ie,y:Y},{corner:"topRight",x:z,y:Y},{corner:"bottomLeft",x:ie,y},{corner:"bottomRight",x:z,y}];for(let{corner:G,x:R,y:O}of T)if(Math.sqrt((b.x-R)**2+(b.y-O)**2)<=S)return{handle:G,annotationId:X}}}}return null},[je,e.annotations]);_t(()=>{let b=S=>{if(Fe.current={x:S.clientX+window.scrollX,y:S.clientY+window.scrollY},!k){let X=Zi(Fe.current);Z((X==null?void 0:X.id)||null)}};return window.addEventListener("mousemove",b),()=>window.removeEventListener("mousemove",b)},[k,Zi]);let to=Pt(()=>{var S;if(!k)return;let b=((S=k.images)==null?void 0:S.length)||0;if(k.text.trim()||b>0)if(k.isNew){let X=Qo();t({type:"ADD_TEXT",payload:f({point:k.point,text:k.text||(b>0?`[${b} image${b>1?"s":""}]`:""),fontSize:k.fontSize,id:X,groupId:k.groupId,linkedSelector:k.linkedSelector,linkedAnchor:k.linkedAnchor,elements:k.elements},b>0?{imageCount:b}:{})}),b>0&&k.images&&s&&s(X,k.images)}else t({type:"UPDATE_TEXT",payload:f({id:k.id,text:k.text||(b>0?`[${b} image${b>1?"s":""}]`:"")},b>0?{imageCount:b}:{})}),b>0&&k.images&&s&&s(k.id,k.images);else k.isNew||t({type:"DELETE_ANNOTATION",payload:{id:k.id}});W(null)},[k,t,s]),kn=Pt(b=>{for(let S=0;S<Mi.length-1;S++){let X=Mi[S],I=Mi[S+1];if(b<=(X+I)/2)return X;if(b<I)return I}return Math.round(b/8)*8},[]),Qi=Pt((b,S,X,I)=>{let P=X.top+Math.max(I.top,4),H=X.bottom-Math.max(I.bottom,4),ie=X.left+Math.max(I.left,4),z=X.right-Math.max(I.right,4);if(b<X.left||b>X.right||S<X.top||S>X.bottom)return null;let Y=S<P,y=S>H,T=b<ie,G=b>z;return Y&&T?I.top>=I.left?"top":"left":Y&&G?I.top>=I.right?"top":"right":y&&T?I.bottom>=I.left?"bottom":"left":y&&G?I.bottom>=I.right?"bottom":"right":Y?"top":y?"bottom":T?"left":G?"right":null},[]),es=Pt(b=>{var H,ie;if(!e.isAnnotating)return;if(e.inspectedElement&&e.activeTool==="hand"&&!("button"in b&&b.button===2)){b.preventDefault(),b.stopPropagation(),t({type:"SELECT_ELEMENT",payload:null});return}let S=eo(b),X="shiftKey"in b&&b.shiftKey;if(e.activeTool==="inspector"){if("button"in b&&b.button===2)return;if(ue&&!Te(ue)){let z=Jt(ue),Y=on(ue),y=ue.getBoundingClientRect(),T=ue.getAttribute("data-pm");T||(T=Math.random().toString(36).substring(2,8),ue.setAttribute("data-pm",T));let G=`[data-pm="${T}"]`,R=e.styleModifications.some(be=>{try{return ue.matches(be.selector)}catch(Ze){return!1}}),O=e.annotations.filter(be=>{if(!be.linkedSelector)return!1;try{return ue.matches(be.linkedSelector)}catch(Ze){return!1}}).length,_=(R?1:0)+O,$=y.top>=Vn*(1+_)?"top-left":"bottom-left",se=Dl(y,$,_);we({point:se,linkedSelector:G,linkedAnchor:$,elements:[m(f({},z),{selector:Y})]})}return}if(e.activeTool==="model"){if("button"in b&&b.button===2)return;if(J){let z=J.name;if(g!=null&&g.has(z)){p==null||p(z);return}"shiftKey"in b&&b.shiftKey?fe(y=>{let T=new Map(y);return T.has(z)?T.delete(z):T.set(z,J),T}):te.size===1&&te.has(z)?(d&&d([z]),fe(new Map)):fe(new Map([[z,J]]))}return}if(e.activeTool==="hand"&&rt&&ct){let z=rt,Y=z.getAttribute("data-pm");Y||(Y=Math.random().toString(36).substring(2,8),z.setAttribute("data-pm",Y));let y=on(z),T=`[data-pm="${Y}"]`,G=Jt(z),R=Bo(z),O=S.x-window.scrollX,_=S.y-window.scrollY,$=mt,se=window.getComputedStyle(z).justifyContent,be=0;if($){let Ge=Yn(z).find(Mt=>Mt.axis===ct);be=Ge?ct==="column"?Ge.w:Ge.h:0}ze(z,"transition","none"),ft.current={isDragging:!0,hasMoved:!1,axis:ct,startX:O,startY:_,originalRow:$?be:R.row,originalColumn:$?be:R.column,element:z,elementInfo:m(f({},G),{selector:T}),selector:T,durableSelector:y,isAuto:$,originalJustifyContent:se,visualGap:be},Kt({axis:ct,row:$?be:R.row,column:$?be:R.column});return}if(e.activeTool==="hand"&&ht&&Vt){let z=ht,Y=z.getAttribute("data-pm");Y||(Y=Math.random().toString(36).substring(2,8),z.setAttribute("data-pm",Y));let y=`[data-pm="${Y}"]`,T=Jt(z),{fontSize:G,lineHeight:R}=Oo(z),O=G>0?R/G:1.2,_=S.x-window.scrollX,$=S.y-window.scrollY;ze(z,"transition","none");let se=on(z);ut.current={isDragging:!0,property:Vt,startX:_,startY:$,originalFontSize:G,originalLineHeight:R,originalRatio:O,element:z,elementInfo:m(f({},T),{selector:y}),selector:y,durableSelector:se},Q({property:Vt,fontSize:G,lineHeight:R});return}if(e.activeTool==="hand"&&j&&He){let z=j,Y=z.getAttribute("data-pm");Y||(Y=Math.random().toString(36).substring(2,8),z.setAttribute("data-pm",Y));let y=`[data-pm="${Y}"]`,T=on(z),G=Jt(z),R=jn(z),O=z.getBoundingClientRect(),_=Math.floor(O.height/2),$=S.y-window.scrollY;ze(z,"transition","none"),Gt.current={isDragging:!0,corner:He,startY:$,original:R,maxRadius:_,element:z,elementInfo:m(f({},G),{selector:y}),selector:y,durableSelector:T},vt({corner:He,radius:f({},R)});return}if(e.activeTool==="hand"&&Ne&&A){let z=Ne,Y=z.getAttribute("data-pm");Y||(Y=Math.random().toString(36).substring(2,8),z.setAttribute("data-pm",Y));let y=`[data-pm="${Y}"]`,T=on(z),G=Jt(z),R=uo(z),O=S.x-window.scrollX,_=S.y-window.scrollY;ze(z,"transition","none"),qe.current={isDragging:!0,side:A,startX:O,startY:_,original:R,element:z,elementInfo:m(f({},G),{selector:y}),selector:y,durableSelector:T},Re({side:A,padding:f({},R)});return}let I=qi(S);if(I){let z=e.annotations.find(Y=>Y.id===I.annotationId);if(z&&z.type!=="text"&&((H=z.status)!=null?H:"pending")==="pending"){Lt({annotationId:I.annotationId,handle:I.handle,startPoint:S,originalPoints:[...z.points],hasMoved:!1});return}}let P=Jo(S);if(P&&P.points[0]){if(k&&to(),P.type!=="text"?(Me(P.id,X),P.color&&t({type:"SET_COLOR",payload:P.color})):X||Ye(),a){let z=P.threadId||(P.groupId?(ie=e.annotations.find(Y=>Y.groupId===P.groupId&&Y.threadId))==null?void 0:ie.threadId:void 0);z&&a(z)}et({annotation:P,startPoint:S,hasMoved:!1});return}if(X||Ye(),e.activeTool==="text"){k&&to();let z=Math.random().toString(36).substring(2,9);W({id:z,point:S,text:"",fontSize:12,isNew:!0});return}L(!0),t({type:"START_PATH",payload:S})},[e.isAnnotating,e.activeTool,e.inspectedElement,e.annotations,k,je,ue,Ne,A,j,He,rt,ct,mt,ht,Vt,J,te,g,d,p,a,eo,Jo,qi,t,Me,Ye,to]),ts=Pt(b=>{var X,I;let S=eo(b);if(e.activeTool==="inspector"&&e.isAnnotating){let P=S.x-window.scrollX,H=S.y-window.scrollY,ie=Wn(P,H),z=ie&&Te(ie)?null:ie;z!==ue&&(We(z),lt(z?Jt(z):null));return}if(e.activeTool==="model"&&e.isAnnotating){let P=S.x-window.scrollX,H=S.y-window.scrollY,ie=Wn(P,H);if(ie!==ge.current&&(ge.current=ie,Ce.current=0),ie){let z=nr(ie,Ce.current);V(z)}else V(null);return}if(e.activeTool==="hand"&&e.isAnnotating){let P=S.x-window.scrollX,H=S.y-window.scrollY;ve.current={x:P,y:H},Qe({x:P,y:H});let ie=pe.current.cmd,z=pe.current.shift;if(ft.current.isDragging){let y=ft.current,T=y.element;if(!T)return;if(!y.hasMoved){let _=Math.abs(P-y.startX),$=Math.abs(H-y.startY);if(_<=2&&$<=2)return;y.hasMoved=!0,y.isAuto&&(ze(T,"justify-content","normal"),ze(T,"row-gap",`${y.visualGap}px`),ze(T,"column-gap",`${y.visualGap}px`),Dt(!1))}let G=y.axis,R=y.originalRow,O=y.originalColumn;if(G==="column"){let _=P-y.startX;O=y.originalColumn+_,ie||(R=y.originalRow+_)}else{let _=H-y.startY;R=y.originalRow+_,ie||(O=y.originalColumn+_)}R=Math.max(0,R),O=Math.max(0,O),z&&(R=kn(R),O=kn(O)),R=Math.round(R),O=Math.round(O),ze(T,"row-gap",`${R}px`),ze(T,"column-gap",`${O}px`),Kt({axis:G,row:R,column:O});return}if(Gt.current.isDragging){let y=Gt.current,T=y.element;if(!T)return;let G=H-y.startY,R=y.corner,O=y.original,_=f({},O);if(ie){let $=O[R]+G;$=Math.max(0,Math.min(y.maxRadius,$)),z&&($=kn($)),$=Math.round($),_[R]=$}else{let $=O[R]+G;$=Math.max(0,Math.min(y.maxRadius,$)),z&&($=kn($)),$=Math.round($),_={"top-left":$,"top-right":$,"bottom-right":$,"bottom-left":$}}ze(T,"border-top-left-radius",`${_["top-left"]}px`),ze(T,"border-top-right-radius",`${_["top-right"]}px`),ze(T,"border-bottom-right-radius",`${_["bottom-right"]}px`),ze(T,"border-bottom-left-radius",`${_["bottom-left"]}px`),vt({corner:R,radius:_});return}if(ut.current.isDragging){let y=ut.current,T=y.element;if(!T)return;let G=y.property,R=y.originalFontSize,O=y.originalLineHeight,_=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(G==="font-size"){let se=P-y.startX;R=y.originalFontSize+se,R=Math.max(1,R)}else{let se=H-y.startY;O=y.originalLineHeight+se,O=Math.max(R,O)}if(z)if(G==="font-size"){let se=_[0],be=Math.abs(R-se);for(let Ze of _){let Ge=Math.abs(R-Ze);Ge<be&&(se=Ze,be=Ge)}R=se}else{let se=R>0?O/R:1.2,be=Math.round(se*2)/2;O=R*Math.max(1,be)}R=Math.round(R),O=Math.round(O*10)/10,ze(T,"font-size",`${R}px`);let $=R>0?Math.round(O/R*1e3)/1e3:1.2;ze(T,"line-height",`${$}`),Q({property:G,fontSize:R,lineHeight:O});return}if(qe.current.isDragging){let y=qe.current,T=y.element;if(!T)return;let G=y.side,R=y.original,O=R.top,_=R.right,$=R.bottom,se=R.left;if(G==="top"){let be=y.startY-H;O=R.top+be,ie||($=R.bottom+be)}else if(G==="bottom"){let be=H-y.startY;$=R.bottom+be,ie||(O=R.top+be)}else if(G==="left"){let be=y.startX-P;se=R.left+be,ie||(_=R.right+be)}else if(G==="right"){let be=P-y.startX;_=R.right+be,ie||(se=R.left+be)}O=Math.max(0,O),_=Math.max(0,_),$=Math.max(0,$),se=Math.max(0,se),z&&(O=kn(O),_=kn(_),$=kn($),se=kn(se)),O=Math.round(O),_=Math.round(_),$=Math.round($),se=Math.round(se),ze(T,"padding",`${O}px ${_}px ${$}px ${se}px`),Re({side:G,padding:{top:O,right:_,bottom:$,left:se}});return}let Y=Wn(P,H);for(;Y&&Y.tagName==="A";)Y=Y.parentElement;{let T=[];Y&&T.push(Y),j&&j!==Y&&T.push(j);let G=null,R=16,O=null;for(let _ of T){let $=_.getBoundingClientRect(),se=jn(_),be=[["top-left",$.left,$.top+se["top-left"]],["top-right",$.right,$.top+se["top-right"]],["bottom-right",$.right,$.bottom-se["bottom-right"]],["bottom-left",$.left,$.bottom-se["bottom-left"]]];for(let[Ze,Ge,Mt]of be){let pt=Math.hypot(P-Ge,H-Mt);pt<R&&(R=pt,G=Ze,O=_)}}if(G&&O){Ee(O),qt(G),Ne&&tt(null),A&&re(null),rt&&gt(null),ct&&Ct(null),Dt(!1),ht&&An(null),Vt&&an(null);return}}j&&Ee(null),He&&qt(null);{let y=[];Y&&ir(Y)&&y.push(Y);let T=(X=Y==null?void 0:Y.parentElement)!=null?X:null;for(;T&&T!==document.body&&y.length<3;)ir(T)&&y.push(T),T=T.parentElement;for(let G of y){let O=Yn(G).find(_=>P>=_.x&&P<=_.x+_.w&&H>=_.y&&H<=_.y+_.h);if(O){gt(G),Ct(O.axis),Dt(Xr(G,O.axis)),Ne&&tt(null),A&&re(null),ht&&An(null),Vt&&an(null);return}}}rt&&gt(null),ct&&Ct(null),Dt(!1);{let T=[];Y&&T.push(Y),ht&&ht!==Y&&T.push(ht);let G=null,R=1/0,O=null;for(let _ of T){if(!Kr(_))continue;let $=po(_);if(!$)continue;let se=P>=$.left&&P<=$.right&&H>=$.top&&H<=$.bottom,be=[["font-size",$.right,$.top+$.height/2],["line-height",$.left+$.width/2,$.bottom]];for(let[Ze,Ge,Mt]of be){let pt=Math.hypot(P-Ge,H-Mt);(se||pt<12)&&pt<R&&(R=pt,G=Ze,O=_)}}G&&O?(An(O),an(G)):(ht&&An(null),Vt&&an(null))}if(Y!==Ne&&tt(Y),Y){let y=uo(Y),T=Y.getBoundingClientRect(),G=Qi(P,H,T,y);re(G)}else re(null);return}if(Ke){let{handle:P,originalPoints:H,hasMoved:ie}=Ke,z=e.annotations.find(R=>R.id===Ke.annotationId);if(!z)return;let Y="metaKey"in b,y=Y&&(b.metaKey||b.ctrlKey),T=Y&&b.shiftKey,G;if(z.type==="line"){let R=H[0],O=H[H.length-1];P==="start"?G=[S,O]:G=[R,S]}else if(z.type==="freehand"){let R=Math.min(...H.map(Oe=>Oe.x)),O=Math.max(...H.map(Oe=>Oe.x)),_=Math.min(...H.map(Oe=>Oe.y)),$=Math.max(...H.map(Oe=>Oe.y)),se=(R+O)/2,be=(_+$)/2,Ze=O-R||1,Ge=$-_||1,Mt=Ze/Ge,pt=R,ae=O,xe=_,Ue=$;switch(P){case"topLeft":pt=S.x,xe=S.y;break;case"topRight":ae=S.x,xe=S.y;break;case"bottomLeft":pt=S.x,Ue=S.y;break;case"bottomRight":ae=S.x,Ue=S.y;break}if(y)switch(P){case"topLeft":ae=O+(R-pt),Ue=$+(_-xe);break;case"topRight":pt=R-(ae-O),Ue=$+(_-xe);break;case"bottomLeft":ae=O+(R-pt),xe=_-(Ue-$);break;case"bottomRight":pt=R-(ae-O),xe=_-(Ue-$);break}if(T){let Oe=ae-pt,yt=Ue-xe;if(Math.abs(Oe/yt)>Mt){let Rt=Math.abs(yt)*Mt*Math.sign(Oe);P==="topLeft"||P==="bottomLeft"?pt=ae-Rt:ae=pt+Rt}else{let Rt=Math.abs(Oe)/Mt*Math.sign(yt);P==="topLeft"||P==="topRight"?xe=Ue-Rt:Ue=xe+Rt}}let Ve=ae-pt||1,it=Ue-xe||1;G=H.map(Oe=>({x:pt+(Oe.x-R)/Ze*Ve,y:xe+(Oe.y-_)/Ge*it}))}else if(z.type==="circle"){let R=H[0],O=H[H.length-1],_=Math.min(R.x,O.x),$=Math.max(R.x,O.x),se=Math.min(R.y,O.y),be=Math.max(R.y,O.y),Ze=(_+$)/2,Ge=(se+be)/2,Mt=$-_,pt=be-se,ae=_,xe=$,Ue=se,Ve=be;switch(P){case"top":if(Ue=S.y,y&&(Ve=Ge+(Ge-S.y)),T){let Oe=(Ve-Ue)*(Mt/pt)/2;ae=Ze-Oe,xe=Ze+Oe}break;case"bottom":if(Ve=S.y,y&&(Ue=Ge-(S.y-Ge)),T){let Oe=(Ve-Ue)*(Mt/pt)/2;ae=Ze-Oe,xe=Ze+Oe}break;case"left":if(ae=S.x,y&&(xe=Ze+(Ze-S.x)),T){let Oe=(xe-ae)*(pt/Mt)/2;Ue=Ge-Oe,Ve=Ge+Oe}break;case"right":if(xe=S.x,y&&(ae=Ze-(S.x-Ze)),T){let Oe=(xe-ae)*(pt/Mt)/2;Ue=Ge-Oe,Ve=Ge+Oe}break}G=[{x:ae,y:Ue},{x:xe,y:Ve}]}else{let R=H[0],O=H[H.length-1],_=Math.min(R.x,O.x),$=Math.max(R.x,O.x),se=Math.min(R.y,O.y),be=Math.max(R.y,O.y),Ze=(_+$)/2,Ge=(se+be)/2,Mt=$-_||1,pt=be-se||1,ae=Mt/pt,xe=_,Ue=$,Ve=se,it=be;switch(P){case"topLeft":xe=S.x,Ve=S.y;break;case"topRight":Ue=S.x,Ve=S.y;break;case"bottomLeft":xe=S.x,it=S.y;break;case"bottomRight":Ue=S.x,it=S.y;break}if(y)switch(P){case"topLeft":Ue=$+(_-xe),it=be+(se-Ve);break;case"topRight":xe=_-(Ue-$),it=be+(se-Ve);break;case"bottomLeft":Ue=$+(_-xe),Ve=se-(it-be);break;case"bottomRight":xe=_-(Ue-$),Ve=se-(it-be);break}if(T){let Oe=Ue-xe,yt=it-Ve;if(Math.abs(Oe/yt)>ae){let Rt=Math.abs(yt)*ae*Math.sign(Oe);P==="topLeft"||P==="bottomLeft"?xe=Ue-Rt:Ue=xe+Rt}else{let Rt=Math.abs(Oe)/ae*Math.sign(yt);P==="topLeft"||P==="topRight"?Ve=it-Rt:it=Ve+Rt}}G=[{x:xe,y:Ve},{x:Ue,y:it}]}t({type:"RESIZE_ANNOTATION",payload:{id:Ke.annotationId,points:G,saveUndo:!ie}}),ie||Lt(m(f({},Ke),{hasMoved:!0}));return}if(ye&&((I=ye.annotation.status)!=null?I:"pending")==="pending"){let P=S.x-ye.startPoint.x,H=S.y-ye.startPoint.y;if((Math.abs(P)>2||Math.abs(H)>2)&&!ye.hasMoved)et(m(f({},ye),{hasMoved:!0,startPoint:S})),t({type:"MOVE_ANNOTATION",payload:{id:ye.annotation.id,delta:{x:P,y:H},saveUndo:!0}});else if(ye.hasMoved){let z=S.x-ye.startPoint.x,Y=S.y-ye.startPoint.y;et(m(f({},ye),{startPoint:S})),t({type:"MOVE_ANNOTATION",payload:{id:ye.annotation.id,delta:{x:z,y:Y}}})}return}!C||!e.isAnnotating||t({type:"CONTINUE_PATH",payload:S})},[C,e.isAnnotating,e.activeTool,ye,Ke,ue,Ne,A,j,He,rt,ct,ht,Vt,eo,t,kn,Qi]),Mr=Pt(b=>{var I,P,H,ie,z,Y;if(ut.current.isDragging){let y=ut.current,T=y.element;if(T&&y.selector&&y.elementInfo&&N){T instanceof HTMLElement&&(T.style.removeProperty("font-size"),T.style.removeProperty("line-height"),T.style.removeProperty("transition"));let G=[];if(y.originalFontSize!==N.fontSize&&(ze(T,"font-size",`${N.fontSize}px`),G.push({property:"font-size",original:`${y.originalFontSize}px`,modified:`${N.fontSize}px`})),y.originalLineHeight!==N.lineHeight){let R=y.originalFontSize>0?Math.round(y.originalLineHeight/y.originalFontSize*1e3)/1e3:1.2,O=N.fontSize>0?Math.round(N.lineHeight/N.fontSize*1e3)/1e3:1.2;ze(T,"line-height",`${O}`),G.push({property:"line-height",original:`${R}`,modified:`${O}`})}G.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:y.selector,durableSelector:(I=y.durableSelector)!=null?I:void 0,element:y.elementInfo,changes:G}})}ut.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},Q(null);return}if(ft.current.isDragging){let y=ft.current,T=y.element,G="button"in b&&b.button===2;if(!y.hasMoved&&!G&&T&&y.selector&&y.elementInfo){T instanceof HTMLElement&&T.style.removeProperty("transition");let R=["space-between","space-around","stretch","normal"],O=y.originalJustifyContent||"normal",_=R.indexOf(O),$=R[(_+1)%R.length],se=[];$==="normal"?(ze(T,"justify-content","normal"),se.push({property:"justify-content",original:y.originalJustifyContent,modified:"normal"})):$==="stretch"?(ze(T,"justify-content",$),ze(T,"row-gap","8px"),ze(T,"column-gap","8px"),se.push({property:"justify-content",original:y.originalJustifyContent||"normal",modified:$}),y.originalRow!==8&&se.push({property:"row-gap",original:`${y.originalRow}px`,modified:"8px"}),y.originalColumn!==8&&se.push({property:"column-gap",original:`${y.originalColumn}px`,modified:"8px"})):(T instanceof HTMLElement&&(T.style.removeProperty("row-gap"),T.style.removeProperty("column-gap")),ze(T,"justify-content",$),se.push({property:"justify-content",original:y.originalJustifyContent||"normal",modified:$}),y.originalRow>0&&se.push({property:"row-gap",original:`${y.originalRow}px`,modified:"0px"}),y.originalColumn>0&&se.push({property:"column-gap",original:`${y.originalColumn}px`,modified:"0px"})),se.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:y.selector,durableSelector:(P=y.durableSelector)!=null?P:void 0,element:y.elementInfo,changes:se}})}else if(y.hasMoved&&T&&y.selector&&y.elementInfo&&Pe){T instanceof HTMLElement&&(T.style.removeProperty("row-gap"),T.style.removeProperty("column-gap"),T.style.removeProperty("transition"));let R=[];y.isAuto?(T instanceof HTMLElement&&T.style.removeProperty("justify-content"),ze(T,"justify-content","normal"),ze(T,"row-gap",`${Pe.row}px`),ze(T,"column-gap",`${Pe.column}px`),R.push({property:"justify-content",original:y.originalJustifyContent,modified:"normal"}),R.push({property:"row-gap",original:"0px",modified:`${Pe.row}px`}),R.push({property:"column-gap",original:"0px",modified:`${Pe.column}px`})):(y.originalRow!==Pe.row&&(ze(T,"row-gap",`${Pe.row}px`),R.push({property:"row-gap",original:`${y.originalRow}px`,modified:`${Pe.row}px`})),y.originalColumn!==Pe.column&&(ze(T,"column-gap",`${Pe.column}px`),R.push({property:"column-gap",original:`${y.originalColumn}px`,modified:`${Pe.column}px`}))),R.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:y.selector,durableSelector:(H=y.durableSelector)!=null?H:void 0,element:y.elementInfo,changes:R}})}ft.current={isDragging:!1,hasMoved:!1,axis:null,startX:0,startY:0,originalRow:0,originalColumn:0,element:null,elementInfo:null,selector:null,durableSelector:null,isAuto:!1,originalJustifyContent:"",visualGap:0},Kt(null);return}if(Gt.current.isDragging){let y=Gt.current,T=y.element;if(T&&y.selector&&y.elementInfo&&nt){T instanceof HTMLElement&&(T.style.removeProperty("border-top-left-radius"),T.style.removeProperty("border-top-right-radius"),T.style.removeProperty("border-bottom-right-radius"),T.style.removeProperty("border-bottom-left-radius"),T.style.removeProperty("transition"));let G=["top-left","top-right","bottom-right","bottom-left"],R={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},O=[];for(let _ of G)y.original[_]!==nt.radius[_]&&(ze(T,R[_],`${nt.radius[_]}px`),O.push({property:R[_],original:`${y.original[_]}px`,modified:`${nt.radius[_]}px`}));O.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:y.selector,durableSelector:(ie=y.durableSelector)!=null?ie:void 0,element:y.elementInfo,changes:O}})}Gt.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},vt(null);return}if(qe.current.isDragging){let y=qe.current,T=y.element,G=y.selector,R=y.elementInfo;if(T&&G&&R&&ke){let O=y.original,_=ke.padding;T instanceof HTMLElement&&(T.style.removeProperty("padding"),T.style.removeProperty("transition"));let $=[],se=[{prop:"padding-top",origVal:O.top,newVal:_.top},{prop:"padding-right",origVal:O.right,newVal:_.right},{prop:"padding-bottom",origVal:O.bottom,newVal:_.bottom},{prop:"padding-left",origVal:O.left,newVal:_.left}];for(let{prop:be,origVal:Ze,newVal:Ge}of se)Ze!==Ge&&(ze(T,be,`${Ge}px`),$.push({property:be,original:`${Ze}px`,modified:`${Ge}px`}));$.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:G,durableSelector:(z=y.durableSelector)!=null?z:void 0,element:R,changes:$}})}qe.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},Re(null);return}if(Ke){Lt(null);return}if(ye){if(!ye.hasMoved&&ye.annotation.type==="text"&&((Y=ye.annotation.status)!=null?Y:"pending")==="pending"){let y=eo(b);W({id:ye.annotation.id,point:ye.annotation.points[0],text:ye.annotation.text||"",fontSize:ye.annotation.fontSize||12,isNew:!1,clickPoint:y,groupId:ye.annotation.groupId})}et(null);return}if(!C)return;let S=5;if(e.currentPath.length>=2){let y=e.currentPath[0],T=e.currentPath[e.currentPath.length-1],G=Math.abs(T.x-y.x),R=Math.abs(T.y-y.y);if((e.activeTool==="line"?Math.sqrt(G*G+R*R)<S:G<S&&R<S)&&["rectangle","circle","line"].includes(e.activeTool)){L(!1),t({type:"CANCEL_PATH"});return}}let X=Yr(e.currentPath);if(e.activeTool==="rectangle"&&e.currentPath.length>=2){let y=e.currentPath[0],T=e.currentPath[e.currentPath.length-1],G=Math.min(y.x,T.x),R=Math.max(y.y,T.y),O=e.strokeWidth/2,_=Math.random().toString(36).substring(2,9);K({point:{x:G-O+4,y:R+O+4},groupId:_}),L(!1),t({type:"FINISH_PATH",payload:{groupId:_,elements:X}});return}L(!1),t({type:"FINISH_PATH",payload:{elements:X}})},[C,ye,Ke,ke,nt,Pe,N,eo,t,e.activeTool,e.currentPath,e.strokeWidth]),la=Pt(b=>{let S=b.target.value;Vo.current=b.target.selectionStart,W(X=>X&&m(f({},X),{text:S}))},[]),aa=Pt(b=>{b.key==="Escape"?W(null):b.key==="Enter"&&!b.shiftKey&&(b.preventDefault(),to())},[to]),ca=Pt(b=>{if(!k)return;let S=b.clipboardData.items,X=[];for(let I=0;I<S.length;I++){let P=S[I];if(P.type.startsWith("image/")){let H=P.getAsFile();H&&X.push(H)}}X.length>0&&(b.preventDefault(),W(I=>I?m(f({},I),{images:[...I.images||[],...X]}):null))},[k]),da=Pt(b=>{if(!e.isAnnotating)return;if(e.activeTool==="hand"){b.preventDefault();let X=Ne||rt||j||ht;if(X&&!Te(X)){let I=Jt(X),P=on(X);t({type:"SELECT_ELEMENT",payload:{el:X,info:m(f({},I),{selector:P})}})}return}b.preventDefault();let S=w.current;S&&(M.current=!0,S.style.pointerEvents="none",setTimeout(()=>{M.current&&(M.current=!1,S.style.pointerEvents="")},4e3))},[e.activeTool,e.isAnnotating,Ne,rt,j,ht,t,Te,w]);_t(()=>{let b=e.annotations.filter(H=>H.linkedSelector);if(b.length===0)return;let S=null,X=()=>{var ie,z,Y;let H=[];for(let y of b){let T=document.querySelector(y.linkedSelector);if(!T&&((z=(ie=y.elements)==null?void 0:ie[0])!=null&&z.selector)&&y.linkedSelector.startsWith("[data-pm=")){try{T=document.querySelector(y.elements[0].selector)}catch(Ge){}if(T){let Ge=(Y=y.linkedSelector.match(/data-pm="([^"]+)"/))==null?void 0:Y[1];Ge&&T.setAttribute("data-pm",Ge)}}if(!T)continue;let G=T.getBoundingClientRect(),R=e.styleModifications.some(Ge=>{try{return T.matches(Ge.selector)}catch(Mt){return!1}}),O=b.filter(Ge=>Ge.id!==y.id&&Ge.timestamp<y.timestamp&&Ge.linkedSelector===y.linkedSelector).length,_=(R?1:0)+O,$=G.top>=Vn*(1+_)?"top-left":"bottom-left",se=Dl(G,$,_),be=y.points[0],Ze=$!==y.linkedAnchor;be&&(Ze||Math.abs(se.x-be.x)>1||Math.abs(se.y-be.y)>1)&&H.push({id:y.id,point:se,linkedAnchor:Ze?$:void 0})}H.length>0&&t({type:"UPDATE_LINKED_POSITIONS",payload:{updates:H}})},I=()=>{S&&cancelAnimationFrame(S),S=requestAnimationFrame(X)};X(),window.addEventListener("scroll",I,!0),window.addEventListener("resize",I,!0),window.addEventListener("load",I),document.fonts.ready.then(I);let P=new MutationObserver(I);return P.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",I,!0),window.removeEventListener("resize",I,!0),window.removeEventListener("load",I),P.disconnect(),S&&cancelAnimationFrame(S)}},[e.annotations,t]);let ua=()=>{var b,S,X;if(!e.isAnnotating)return"default";if(Ke){let{handle:I}=Ke;return I==="start"||I==="end"?"move":I==="top"||I==="bottom"?"ns-resize":I==="left"||I==="right"?"ew-resize":I==="topLeft"||I==="bottomRight"?"nwse-resize":"nesw-resize"}if(e.activeTool==="text")return"text";if(e.activeTool==="hand"){let I=(b=Pe==null?void 0:Pe.axis)!=null?b:ct;if(I==="row")return"ns-resize";if(I==="column")return"ew-resize";if(nt||He)return"ns-resize";let P=(S=N==null?void 0:N.property)!=null?S:Vt;if(P==="font-size")return"ew-resize";if(P==="line-height")return"ns-resize";let H=(X=ke==null?void 0:ke.side)!=null?X:A;return H==="top"||H==="bottom"?"ns-resize":H==="left"||H==="right"?"ew-resize":"default"}return"crosshair"},pa={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:e.isAnnotating?"auto":"none",visibility:e.isAnnotating?"visible":"hidden",cursor:ua()},Ro=Pt(()=>{let b=w.current;if(!b||!k)return{width:100,height:12*1.4,isWrapped:!1};let S=b.getContext("2d");if(!S)return{width:100,height:k.fontSize*1.4,isWrapped:!1};S.font=`${k.fontSize}px ${Ft}`;let I=S.measureText("Type here...").width,P=k.text.split(`
+`),H=P.length>0?Math.max(I,...P.map(T=>S.measureText(T||" ").width)):I,ie=k.point.x-St.x,z=so(ie);if(z!==void 0&&H>z){let T=$n(S,P,z),G=Math.min(z,Math.max(I,...T.map(O=>S.measureText(O).width))),R=Math.max(1,T.length)*k.fontSize*1.4;return{width:G,height:R,isWrapped:!0}}let y=Math.max(1,P.length)*k.fontSize*1.4;return{width:H,height:y,isWrapped:!1}},[k,w,St.x])(),fa=k?Math.max(1,k.text.split(`
+`).length)*k.fontSize*1.4+8:0,ns=Ro.height+8,ga=Ro.isWrapped?ns-fa:0,ma=k?{position:"fixed",left:k.point.x-4-St.x,top:k.point.y-4-St.y-ga,zIndex:9999,width:Ro.width+8,height:ns,padding:4,fontSize:k.fontSize,fontFamily:Ft,color:"#ffffff",backgroundColor:e.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:Ro.isWrapped?"pre-wrap":"pre",wordBreak:Ro.isWrapped?"break-word":void 0}:{};return So(wo,{children:[ot("canvas",{ref:w,id:"devtools-canvas",style:pa,onMouseDown:es,onMouseMove:ts,onMouseUp:b=>Mr(b),onMouseLeave:b=>{Mr(b),We(null),lt(null)},onTouchStart:es,onTouchMove:ts,onTouchEnd:b=>Mr(b),onContextMenu:da}),k&&So(wo,{children:[ot("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),ot("textarea",{id:"devtools-text-input",ref:le,value:k.text,onChange:la,onKeyDown:aa,onPaste:ca,onBlur:to,placeholder:"Type here...",style:ma}),k.images&&k.images.length>0&&So("div",{"data-devtools":!0,style:{position:"fixed",left:k.point.x-4-St.x,top:k.point.y-4-St.y-20,zIndex:1e4,fontSize:11,fontFamily:"system-ui, sans-serif",color:"#fff",backgroundColor:"rgba(0,0,0,0.7)",padding:"2px 6px",borderRadius:3,whiteSpace:"nowrap"},children:[k.images.length," image",k.images.length>1?"s":""," attached"]})]}),e.isAnnotating&&e.activeTool!=="hand"&&e.styleModifications.length>0&&ot(pl,{styleModifications:e.styleModifications,isInspecting:!!e.inspectedElement,accentColor:e.activeColor,annotationGroupCount:new Set(e.annotations.map(b=>b.groupId||b.id)).size,dispatch:t,inFlightSelectors:r}),e.activeTool==="hand"&&e.isAnnotating&&e.styleModifications.length>0&&ot(gl,{styleModifications:e.styleModifications,accentColor:e.activeColor}),e.isAnnotating&&ot(nl,{annotations:e.annotations,supersededAnnotations:Pn,inFlightIds:n,scrollX:St.x,scrollY:St.y,annotationGroupMap:Go,onViewThread:a,onSelectAnnotation:Me,canvasRef:w}),e.isAnnotating&&l&&ot(ol,{annotations:e.annotations,supersededAnnotations:Pn,scrollX:St.x,scrollY:St.y,onReply:l,annotationGroupMap:Go,canvasRef:w}),e.isAnnotating&&i&&i.size>0&&ot(ti,{inFlightSelectorColors:i}),e.isAnnotating&&Ki&&ot(ti,{inFlightSelectorColors:Ki,animated:!1}),e.activeTool==="hand"&&e.isAnnotating&&(Pe?ft.current.element:rt)&&ot(si,{element:Pe?ft.current.element:rt,gap:Pe?{row:Pe.row,column:Pe.column}:Bo(rt),accentColor:e.activeColor,hoveredAxis:ct,draggingAxis:(rs=Pe==null?void 0:Pe.axis)!=null?rs:null,cursorViewport:at,isAutoGap:mt,refreshKey:Wt}),e.activeTool==="hand"&&e.isAnnotating&&Yt&&ot(Pl,{element:Yt.target,modifier:Yt.modifier,accentColor:e.activeColor,refreshKey:Wt}),e.activeTool==="hand"&&e.isAnnotating&&!Yt&&(nt?Gt.current.element:j)&&ot(al,{element:nt?Gt.current.element:j,radius:(is=nt==null?void 0:nt.radius)!=null?is:jn(j),accentColor:e.activeColor,hoveredCorner:He,draggingCorner:(ss=nt==null?void 0:nt.corner)!=null?ss:null,cursorViewport:at}),e.activeTool==="hand"&&e.isAnnotating&&!Yt&&(N?ut.current.element:ht)&&ot(Bl,{element:N?ut.current.element:ht,fontSize:(ls=N==null?void 0:N.fontSize)!=null?ls:Oo(ht).fontSize,lineHeight:(as=N==null?void 0:N.lineHeight)!=null?as:Oo(ht).lineHeight,accentColor:e.activeColor,hoveredProperty:Vt,draggingProperty:(cs=N==null?void 0:N.property)!=null?cs:null,cursorViewport:at}),e.activeTool==="hand"&&e.isAnnotating&&!Yt&&(ke?qe.current.element:Ne)&&ot(pi,{element:ke?qe.current.element:Ne,padding:(ds=ke==null?void 0:ke.padding)!=null?ds:uo(Ne),accentColor:e.activeColor,hoveredSide:A,draggingSide:(us=ke==null?void 0:ke.side)!=null?us:null,cursorViewport:at,refreshKey:N?N.fontSize+N.lineHeight*1e3:0}),e.activeTool==="inspector"&&e.isAnnotating&&ot(wo,{children:ue&&!e.inspectedElement&&(()=>{let b=!!q||!!(k!=null&&k.linkedSelector)||e.annotations.some(S=>{if(!S.linkedSelector)return!1;try{return ue.matches(S.linkedSelector)}catch(X){return!1}});return ot(mo,{element:ue,isSelected:!1,elementInfo:me,color:e.activeColor,hideTooltip:b})})()}),e.activeTool==="model"&&e.isAnnotating&&te.size>0&&[...te.entries()].map(([b,S])=>ot(mo,{element:S.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:S.rootElement.tagName.toLowerCase(),reactComponent:b},color:"#8b5cf6"},b)),e.activeTool==="model"&&e.isAnnotating&&Lo&&ot(mo,{element:Lo.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:Lo.rootElement.tagName.toLowerCase(),reactComponent:Lo.name},color:"#22c55e"}),e.activeTool==="model"&&e.isAnnotating&&cn.length>0&&cn.map((b,S)=>ot("div",{style:{position:"absolute",left:b.x,top:b.y,width:b.width,height:b.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:b.direction==="vertical"?So(wo,{children:[ot("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ot("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ot("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ot("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:b.height<16?-6:"50%",transform:b.height<16?"none":"translateY(-50%)",fontSize:11,fontWeight:600,color:"#fff",backgroundColor:"#FF0000",padding:"2px 4px",whiteSpace:"nowrap",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1},children:Math.round(b.height)})]}):So(wo,{children:[ot("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ot("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ot("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ot("div",{style:{position:"absolute",left:b.width<30?0:"50%",top:(b.width<30,void 0),bottom:"calc(50% + 4px)",transform:b.width<30?"none":"translateX(-50%)",fontSize:11,fontWeight:600,color:"#fff",backgroundColor:"#FF0000",padding:"2px 4px",whiteSpace:"nowrap",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1},children:Math.round(b.width)})]})},S)),e.activeTool==="model"&&e.isAnnotating&&J&&ot(mo,{element:J.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:J.rootElement.tagName.toLowerCase(),reactComponent:J.name},color:g!=null&&g.has(J.name)?"#22c55e":"#8b5cf6"}),e.activeTool==="hand"&&e.isAnnotating&&e.inspectedElement&&So(wo,{children:[de&&de!=="padding"&&de!=="gap"&&(()=>{var z;let b=new Set(e.annotations.map(Y=>Y.groupId||Y.id)).size,S=e.inspectedElement.info.selector,X=e.styleModifications.findIndex(Y=>Y.selector===S),I=X>=0?b+X+1:b+e.styleModifications.length+1,P=e.styleModifications.find(Y=>Y.selector===S),H=(z=P==null?void 0:P.changes.length)!=null?z:0,ie=!!(P!=null&&P.captured);return ot(mo,{element:e.inspectedElement.el,isSelected:!0,elementInfo:e.inspectedElement.info,color:ie?"#999999":e.activeColor,annotationNumber:I,changeCount:H})})(),de==="padding"&&ot(pi,{element:e.inspectedElement.el,padding:uo(e.inspectedElement.el),accentColor:e.activeColor,hoveredSide:null,draggingSide:null}),de==="gap"&&ot(si,{element:e.inspectedElement.el,gap:Bo(e.inspectedElement.el),accentColor:e.activeColor,hoveredAxis:null,draggingAxis:null}),ot(Rl,{element:e.inspectedElement.el,elementInfo:e.inspectedElement.info,selector:e.inspectedElement.info.selector,styleModifications:e.styleModifications,dispatch:t,onClose:()=>t({type:"SELECT_ELEMENT",payload:null}),onHover:Le,accentColor:e.activeColor})]})]})}import{useCallback as ln,useEffect as bn,useMemo as Pi,useRef as It,useState as _o}from"react";import{Circle as Su,Component as wu,Hand as ku,MessageCircle as Eu,Pen as Cu,Slash as Mu,Square as Tu,Trash2 as Iu,Type as Lu}from"lucide-react";import{useEffect as Kd,useRef as Zd}from"react";function Nl(e,t,o,n,r){let i=Zd(0);Kd(()=>{if(!o.current||(localStorage.setItem(r.expanded,String(e)),!e))return;let s=t.annotations.length;(s>=i.current||s===0||!n)&&(localStorage.setItem(r.annotations,JSON.stringify(t.annotations)),i.current=s),localStorage.setItem(r.styleMods,JSON.stringify(t.styleModifications)),localStorage.setItem(r.spacingChanges,JSON.stringify(t.spacingTokenChanges)),localStorage.setItem(r.tool,t.activeTool),localStorage.setItem(r.color,t.activeColor),localStorage.setItem(r.stroke,String(t.strokeWidth)),t.inspectedElement?localStorage.setItem(r.inspected,JSON.stringify({selector:t.inspectedElement.info.selector,info:t.inspectedElement.info})):localStorage.removeItem(r.inspected)},[e,t.annotations,t.styleModifications,t.spacingTokenChanges,t.activeTool,t.activeColor,t.strokeWidth,t.inspectedElement,n,o,r])}import{Component as qd,createElement as Qd,useCallback as vr,useEffect as Eo,useRef as ko,useState as yn}from"react";import{Fragment as Co,jsx as De,jsxs as Xt}from"react/jsx-runtime";var Hl="popmelt-library-tab",eu=/^#[0-9a-fA-F]{3,8}$/,tu=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,nu=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),ou=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function zl(e){let t=e.trim();return eu.test(t)||tu.test(t)||nu.has(t.toLowerCase())}function ru(e){return ou.test(e.trim())}function iu(e){let t=e.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return t?parseFloat(t[1]):null}function Li(e,t=""){if(e==null)return[];if(typeof e!="object")return[[t,String(e)]];if(Array.isArray(e))return[[t,e.map(String).join(", ")]];let o=[];for(let[n,r]of Object.entries(e)){let i=t?`${t}.${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(...Li(r,i))}else o.push([i,Array.isArray(r)?r.map(String).join(", "):String(r!=null?r:"")])}return o}function su(e){return e.length===0?"generic":e.filter(([,n])=>zl(n)).length>e.length/2?"colors":e.filter(([,n])=>ru(n)).length>e.length/2?"spacing":"generic"}var lu=m(f({position:"fixed",top:16,right:16,bottom:80,width:300,backgroundColor:"#ffffff"},gn),{boxSizing:"content-box",zIndex:10001,display:"flex",flexDirection:"column",overflow:"hidden",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12,pointerEvents:"auto"}),_l={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},au=m(f({},_l),{color:"#1f2937",borderBottom:"1.5px solid #1f2937"});function cu({entries:e}){let t=[],o=[];for(let n of e)zl(n[1])?t.push(n):o.push(n);return Xt(Co,{children:[t.length>0&&De("div",{style:{display:"flex",flexWrap:"wrap",gap:2,marginBottom:o.length>0?6:0},children:t.map(([n,r])=>De("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&&De(Ri,{entries:o})]})}var xr=[0,1,2,4,8,12,16,20,24,28,32];function du(e){if(e<=32){let t=xr[0],o=Math.abs(e-t);for(let n=1;n<xr.length;n++){let r=Math.abs(e-xr[n]);r<o&&(t=xr[n],o=r)}return t}return Math.round(e/8)*8}function uu({label:e,value:t,px:o,tokenPath:n,rawToken:r,onHover:i,onModify:s,onDelete:l}){let[a,c]=yn(!1),[d,p]=yn(null),u=ko(!1),g=ko(0),x=ko(0),E=ko([]),h=d!==null?d:o,w=d!==null?`${d}px`:t,D=d!==null,B=vr(C=>{C.preventDefault(),u.current=!0,g.current=C.clientX,x.current=o;let L=or(r);E.current=Gr(L);let k=ee=>{let Z=ee.clientX-g.current,F=Math.max(0,Math.round(x.current+Z));ee.shiftKey&&(F=du(F));for(let K of E.current)K.element.style.setProperty(K.property,F+"px","important");p(F),i==null||i({name:e,px:F,token:L})},W=()=>{window.removeEventListener("mousemove",k),window.removeEventListener("mouseup",W),document.body.style.cursor="",u.current=!1,p(ee=>{if(ee!==null&&ee!==o&&s){let Z=or(r),F=Z.bindings&&Z.bindings.length>0,K;if(F){let he=Ur(Z.bindings,x.current,ee);K=JSON.stringify(m(f({},Z),{value:`${ee}px`,bindings:he}))}else{let he=Us(E.current,x.current),Fe=Js(E.current);if(he.length>0){let Ie=Ur(he,x.current,ee);K=JSON.stringify({value:`${ee}px`,property:Fe,bindings:Ie})}else K=`${ee}px`}let q=typeof r=="string"?r:JSON.stringify(r),we=E.current.map(he=>({selector:on(he.element),property:he.property})),le=Ks(E.current,x.current,ee);s({tokenPath:n,originalValue:q,currentValue:K,targets:we,originalPx:x.current,currentPx:ee},{id:Math.random().toString(36).substring(2,9),tokenPath:n,tokenName:e,originalPx:x.current,newPx:ee,affectedElements:le})}return ee})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",k),window.addEventListener("mouseup",W)},[o,e,n,r,i,s]),M=or(r);return Xt("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:e,px:h,token:M}))},onMouseLeave:()=>{u.current||(c(!1),i==null||i(null))},onMouseDown:B,children:[De("span",{style:{color:a||D?"#FF0000":"#9ca3af"},children:e}),Xt("span",{style:{display:"flex",alignItems:"center",gap:4},children:[De("span",{style:{color:a||D?"#FF0000":"#6b7280",fontWeight:600},children:w}),l&&a&&!D&&De("button",{type:"button",title:"Remove token",onMouseDown:C=>{C.stopPropagation();let L=typeof r=="string"?r:JSON.stringify(r);l(n,L)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:C=>{C.currentTarget.style.color="#FF0000"},onMouseLeave:C=>{C.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function pu({entries:e,categoryKey:t,rawTokens:o,onHover:n,onModify:r,onDelete:i}){let s=[],l=[];for(let a of e){let c=iu(a[1]);c!==null?s.push([a[0],a[1],c]):l.push(a)}return Xt(Co,{children:[s.length>0&&De("div",{style:{display:"flex",flexDirection:"column",gap:2},children:s.map(([a,c,d])=>{let p=a.split(".").pop(),u=o?fu(o,a):c,g=u&&typeof u=="object"&&"value"in u?u:c;return De(uu,{label:p,value:c,px:d,tokenPath:`tokens.${t}.${a}`,rawToken:g,onHover:n,onModify:r,onDelete:i},a)})}),l.length>0&&De(Ri,{entries:l})]})}function fu(e,t){let o=t.split("."),n=e;for(let r of o){if(n==null||typeof n!="object")return;n=n[r]}return n}function Ri({entries:e}){return De("div",{style:{display:"flex",flexDirection:"column",gap:3},children:e.map(([t,o])=>Xt("div",{style:{fontSize:11},children:[De("div",{style:{color:"#9ca3af",fontSize:10,marginBottom:1},children:t}),De("div",{style:{color:"#1f2937",lineHeight:1.4,paddingLeft:8},children:o})]},t))})}function $l({entries:e,categoryKey:t,rawTokens:o,onSpacingHover:n,onModifyToken:r,onDeleteToken:i}){let s=su(e);return s==="colors"?De(cu,{entries:e}):s==="spacing"?De(pu,{entries:e,categoryKey:t,rawTokens:o,onHover:n,onModify:r,onDelete:i}):De(Ri,{entries:e})}function gu(e){let t=e.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(a=>a.startsWith("__reactFiber$")||a.startsWith("__reactInternalInstance$"));if(!s)continue;let l=i[s];for(;l;){let a=l.type,c=typeof a=="function"||typeof a=="object"?(a==null?void 0:a.displayName)||(a==null?void 0:a.name):null;if(typeof c=="string"){let d=c.toLowerCase();if(d===t){let p=f({},l.memoizedProps);return delete p.ref,{type:a,props:p}}if(!o){if(d.length>=4&&t.includes(d)){let p=f({},l.memoizedProps);delete p.ref,o={type:a,props:p}}else if(t.length>=4&&d.includes(t)){let p=f({},l.memoizedProps);delete p.ref,o={type:a,props:p}}}}l=l.return}}return o}var Ii=class extends qd{constructor(){super(...arguments);this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(){this.props.onError()}render(){return this.state.hasError?null:this.props.children}};function mu({children:e}){return De("div",{style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:6},children:e})}function hu({tokens:e,onSpacingTokenHover:t,onModifyToken:o,onDeleteToken:n}){return!e||Object.keys(e).length===0?De("div",{style:{color:"#9ca3af",fontSize:11},children:"No tokens defined yet."}):De(Co,{children:Object.entries(e).map(([r,i])=>Xt("div",{style:{marginBottom:14},children:[De(mu,{children:r}),De($l,{entries:Li(i),categoryKey:r,rawTokens:i,onSpacingHover:t,onModifyToken:o,onDeleteToken:n})]},r))})}function yu({rules:e}){return!e||e.length===0?De("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."}):De(Co,{children:e.map((t,o)=>Xt("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[Xt("span",{style:{color:"#9ca3af",flexShrink:0},children:[o+1,"."]}),De("span",{children:t})]},o))})}function bu({name:e,value:t,selected:o,highlighted:n,onRemove:r,onHover:i}){var ee;let[s,l]=yn(!1),[a,c]=yn(!1),d=ko(null),p=ko(0),[u,g]=yn(0),[x,E]=yn(0),h=Li(t),w=(ee=h.find(([Z])=>Z==="description"))==null?void 0:ee[1];Eo(()=>{if(!a&&!n){g(0),E(0),p.current=0;return}let Z=ao(e);g(Z.length)},[a,n,e]),Eo(()=>{o&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[o]);let D=o||n||a,B=o?"139,92,246":"34,197,94",M=o?"#8b5cf6":"#22c55e",C=D?`rgba(${B},0.06)`:void 0,L=D?`inset 0 0 0 1.5px rgba(${B},0.35)`:void 0,k=n||a,W=vr(()=>{let Z=ao(e);if(Z.length===0)return;let F=p.current%Z.length;Z[F].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),E(F),p.current=F+1,i==null||i({name:e,instanceIndex:F})},[e,i]);return Xt("div",{ref:d,onClick:W,onMouseEnter:()=>{c(!0),i==null||i({name:e,instanceIndex:0})},onMouseLeave:()=>{c(!1),i==null||i(null)},style:{marginBottom:8,background:C,padding:6,boxShadow:L,cursor:"pointer"},children:[Xt("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[Xt("div",{style:{display:"flex",alignItems:"center",gap:6,marginBottom:6},children:[De("div",{style:{fontWeight:700,fontSize:11,letterSpacing:"0.05em",padding:"2px 6px",backgroundColor:k?M:"transparent",color:k?"#fff":"#6b7280"},children:e}),k&&u>1&&Xt("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[x+1,"/",u]})]}),r&&a&&De("button",{type:"button",title:"Remove from model",onClick:Z=>{Z.stopPropagation(),r(e)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:Z=>{Z.currentTarget.style.color="#FF0000"},onMouseLeave:Z=>{Z.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),w&&De("div",{style:{fontSize:11,color:k?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:w}),s?De($l,{entries:h.filter(([Z])=>Z!=="description"),categoryKey:""}):De(xu,{name:e,onNotFound:()=>l(!0),entries:h})]})}function xu({name:e,onNotFound:t}){let[o,n]=yn(null),[r,i]=yn(!1);return Eo(()=>{let s=gu(e);s||t(),n(s),i(!0)},[e,t]),!r||!o?null:De(Ii,{onError:t,children:De("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:De("div",{style:{zoom:.5},children:Qd(o.type,o.props)})})})}function vu({components:e,selectedComponent:t,hoveredComponent:o,onRemove:n,onHover:r}){if(!e||Object.keys(e).length===0)return De("div",{style:{color:"#9ca3af",fontSize:11},children:"No component patterns defined yet."});let i=new Set(Object.keys(e)),s=Wr(i),l=Object.entries(e).sort(([a],[c])=>{var d,p;return((d=s.get(a))!=null?d:1/0)-((p=s.get(c))!=null?p:1/0)});return De(Co,{children:l.map(([a,c])=>De(bu,{name:a,value:c,selected:t===a,highlighted:o===a,onRemove:n,onHover:r},a))})}function Wl({bridgeUrl:e,modelRefreshKey:t,onMouseEnter:o,onMouseLeave:n,selectedComponent:r,hoveredComponent:i,onComponentHover:s,onSpacingTokenHover:l,onModifySpacingToken:a,onDeleteSpacingToken:c,onComponentAdded:d,onComponentRemoved:p}){let[u,g]=yn(void 0),[x,E]=yn(!0),[h,w]=yn(()=>{try{let F=localStorage.getItem(Hl);if(F==="tokens"||F==="components"||F==="rules")return F}catch(F){}return"components"});Eo(()=>{no(e).then(F=>{g(F),E(!1)})},[e,t]),Eo(()=>{try{localStorage.setItem(Hl,h)}catch(F){}},[h]),Eo(()=>{r&&(w("components"),no(e).then(F=>{F&&g(F)}))},[r,e]);let D=vr((F,K)=>{g(q=>{if(!(q!=null&&q.tokens))return q;let we=JSON.parse(JSON.stringify(q.tokens)),le=F.split("."),he=we;for(let Fe=1;Fe<le.length-1;Fe++)if(he=he[le[Fe]],!he)return q;return delete he[le[le.length-1]],m(f({},q),{tokens:we})}),c==null||c(F,K)},[c]),B=vr(F=>{g(K=>{if(!(K!=null&&K.components))return K;let le=K.components,{[F]:q}=le,we=Bn(le,[Ko(F)]);return m(f({},K),{components:we})}),p==null||p(F)},[p]),M=u==null?void 0:u.tokens,C=u==null?void 0:u.components,L=u==null?void 0:u.rules,k=M&&Object.keys(M).length>0,W=C&&Object.keys(C).length>0,ee=L&&L.length>0,Z=!u||!k&&!W&&!ee;return Xt("div",{style:lu,onMouseEnter:o,onMouseLeave:n,children:[Xt("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[De("span",{children:"Model"}),De("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"M"})]}),De("div",{style:{display:"flex",gap:12,marginBottom:10,borderBottom:"1px solid rgba(0,0,0,0.08)",paddingBottom:6},children:["components","rules"].map(F=>De("button",{type:"button",style:h===F?au:_l,onClick:()=>w(F),children:F.charAt(0).toUpperCase()+F.slice(1)},F))}),De("div",{style:{flex:1,overflowY:"auto",minHeight:0},children:x?De("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):Z?De("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):Xt(Co,{children:[h==="components"&&De(vu,{components:C,selectedComponent:r,hoveredComponent:i,onRemove:B,onHover:s}),h==="tokens"&&De(hu,{tokens:M,onSpacingTokenHover:l,onModifyToken:a,onDeleteToken:c?D:void 0}),h==="rules"&&De(yu,{rules:L})]})})]})}import{jsx as Yl}from"react/jsx-runtime";var In={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#f3f4f6",bgHover:"#f9fafb",separator:"#e5e7eb"};function Ln({children:e,active:t,siblingActive:o,disabled:n,onClick:r,title:i}){let s=()=>n?.4:o&&!t?.5:1,l={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:t?In.bgActive:"transparent",color:t?In.iconActive:In.iconDefault,opacity:s()};return Yl("button",{type:"button",onClick:n?void 0:r,title:i,disabled:n,style:l,onMouseEnter:a=>{n||(a.currentTarget.style.opacity="1",t||(a.currentTarget.style.backgroundColor=In.bgHover))},onMouseLeave:a=>{n||(a.currentTarget.style.opacity=String(s()),t||(a.currentTarget.style.backgroundColor="transparent"))},onMouseDown:a=>{n||(a.currentTarget.style.transform="scale(0.95)")},onMouseUp:a=>{n||(a.currentTarget.style.transform="scale(1)")},children:e})}function Ai(){return Yl("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as Zn,jsx as ne,jsxs as xt}from"react/jsx-runtime";var qn=[{type:"rectangle",icon:Tu,label:"Rectangle",shortcut:"R"},{type:"circle",icon:Su,label:"Oval",shortcut:"O"},{type:"line",icon:Mu,label:"Line",shortcut:"L"},{type:"freehand",icon:Cu,label:"Pen",shortcut:"P"}],Ru=new Set(qn.map(e=>e.type));function Au(e,t,o,n,r,i,s,l){let a=(e-r)*(n-i)-(o-r)*(t-i),c=(e-s)*(i-l)-(r-s)*(t-l),d=(e-o)*(l-n)-(s-o)*(t-n),p=a<0||c<0||d<0,u=a>0||c>0||d>0;return!(p&&u)}function Pu(){let e=window.innerWidth-16,t=e-326,o=window.innerHeight-80;return{left:t,right:e,y:o}}var Bu=[{type:"text",icon:Lu,label:"Text",shortcut:"T"}],jl={inspector:{name:"Comment",desc:"Pin feedback to specific elements on the page.",usage:["Click any element to attach a comment","Type your note, then hand off to your AI","Your AI may ask clarifying questions","Replies get threaded"],keys:[{key:"C",desc:"Select tool"},{key:"Click",desc:"Pin comment to element"},{key:"Esc",desc:"Deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},hand:{name:"Handle",desc:"Quickly finetune layout and typescale.",usage:["Edges \u2192 padding","Between items \u2192 spacing","Corners \u2192 rounding","Right of text \u2192 font size","Below text \u2192 line height","Click a spacing handle to cycle distribution","Right-click \u2192 inspect element styles"],keys:[{key:"H",desc:"Select tool"},{key:"Shift",desc:"Snap to scale"},{key:"\u2325 + swipe",desc:"Cycle justify / flip direction"},{key:"\u21E7 + swipe",desc:"Cycle align-items"},{key:"Right-click",desc:"Inspect styles"},{key:"Esc",desc:"Deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},rectangle:{name:"Rectangle",desc:"Draw rectangular highlights to mark areas of interest.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"R",desc:"Rectangle"},{key:"O",desc:"Oval"},{key:"L",desc:"Line"},{key:"P",desc:"Pen"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},circle:{name:"Oval",desc:"Draw oval highlights to mark areas of interest.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"O",desc:"Oval"},{key:"R",desc:"Rectangle"},{key:"L",desc:"Line"},{key:"P",desc:"Pen"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},line:{name:"Line",desc:"Draw line annotations to point at or connect elements.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"L",desc:"Line"},{key:"R",desc:"Rectangle"},{key:"O",desc:"Oval"},{key:"P",desc:"Pen"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},freehand:{name:"Pen",desc:"Draw freehand paths to annotate freely.",usage:["Click and drag to draw","Cycle between shapes with the dot selector"],keys:[{key:"P",desc:"Pen"},{key:"R",desc:"Rectangle"},{key:"O",desc:"Oval"},{key:"L",desc:"Line"},{key:"Esc",desc:"Cancel or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},text:{name:"Text",desc:"Place text labels anywhere on the page.",usage:["Click to place, then start typing","Click away or press Enter to finish","Scroll while hovering a label to resize it"],keys:[{key:"T",desc:"Select tool"},{key:"Esc",desc:"Cancel text or deselect"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]},model:{name:"Model",desc:"Promote components into the local design model.",usage:["Hover to highlight component boundaries","Scroll to walk up/down the component tree","Click to add to model.json","Green = already in model"],keys:[{key:"M",desc:"Select tool"},{key:"Scroll",desc:"Walk tree depth"},{key:"Click",desc:"Promote component"},{key:"Esc",desc:"Deselect"}]},counter:{name:"Annotations",desc:"Click to cycle, scroll to change color, long press to reset.",usage:[],keys:[{key:"Click",desc:"Cycle annotations"},{key:"Scroll",desc:"Change color"},{key:"Hold",desc:"Reset to red"}]},clear:{name:"Clear",desc:"Remove all annotations and style changes.",usage:[],keys:[{key:"\u2318 \u232B",desc:"Clear all"},{key:"\u232B",desc:"Delete selected annotation"},{key:"\u2318 Z",desc:"Undo"},{key:"\u2318 \u21E7 Z",desc:"Redo"}]},collapse:{name:"Popmelt",desc:`Comment and zhuzh, then hand off.
 
-Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},Ou=m(f({position:"fixed",bottom:16,right:16,zIndex:9999,display:"flex",alignItems:"center",backgroundColor:"#ffffff"},mn),{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)"}),Bi="devtools-toolbar-expanded",Oi="devtools-annotations",Di="devtools-style-modifications",Fi="devtools-active-tool",Gl="devtools-active-color",Vl="devtools-stroke-width",Ul="devtools-inspected-element",Ni="devtools-spacing-changes",Du={expanded:Bi,annotations:Oi,styleMods:Di,spacingChanges:Ni,tool:Fi,color:Gl,stroke:Vl,inspected:Ul};function Fu(){return ne("svg",{width:"16",height:"16",viewBox:"0 0 1200 1200",fill:"currentColor",stroke:"none",children:ne("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 Nu(){return ne("svg",{width:"16",height:"16",viewBox:"0 0 158.7128 157.296",fill:"currentColor",stroke:"none",children:ne("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 Jl({state:e,dispatch:t,onScreenshot:o,onSendToClaude:n,hasActiveJobs:r,activeJobColor:i,onCrosshairHover:s,onClear:l,provider:a="claude",onProviderChange:c,availableProviders:d,modelIndex:p=0,modelCount:u=2,modelLabel:g="Opus 4.6",onModelChange:x,onViewThread:E,isThreadPanelOpen:h,mcpStatus:w,onInstallMcp:D,mcpJustInstalled:B,bridgeUrl:M,isBridgeConnected:C,modelSelectedComponent:L,modelCanvasHoveredComponent:k,onModelComponentHover:W,onSpacingTokenHover:ee,onModifySpacingToken:Z,onDeleteSpacingToken:F,modelRefreshKey:K,onModelComponentAdded:q,onModelComponentRemoved:we,onMouseEnter:le}){let[he,Ne]=_o(()=>typeof window=="undefined"?!1:localStorage.getItem(Bi)==="true"),[Ie,$e]=_o(0),U=It(0),V=It(0),te=It(e.isAnnotating),fe=It(!1),Ce=It(typeof window!="undefined"?localStorage.getItem(Fi):null),ge=It(typeof window!="undefined"?localStorage.getItem(Gl):null),ue=It(typeof window!="undefined"?localStorage.getItem(Vl):null),{charIndex:We}=ur(!!r),[me,lt]=_o(null),qe=It(!1),Oe=It(null),tt=It(null),A=It({x:0,y:0}),re=It(null),de=It(null),Ae=It(null),ke=sn(()=>{re.current=null,de.current=null,Ae.current&&(clearTimeout(Ae.current),Ae.current=null)},[]),Le=sn(N=>{tt.current&&(clearTimeout(tt.current),tt.current=null),qe.current?(re.current=N,de.current=f({},A.current),Ae.current&&clearTimeout(Ae.current),Ae.current=setTimeout(()=>{re.current&&(lt(re.current),ke())},300)):(Oe.current&&clearTimeout(Oe.current),Oe.current=setTimeout(()=>{qe.current=!0,lt(N),Oe.current=null},500))},[ke]),xe=sn(()=>{ke(),Oe.current&&(clearTimeout(Oe.current),Oe.current=null),tt.current=setTimeout(()=>{qe.current=!1,lt(null)},150)},[ke]),at=sn(N=>{if(A.current={x:N.clientX,y:N.clientY},re.current&&de.current){let Q=de.current,pe=Pu();Au(N.clientX,N.clientY,Q.x,Q.y,pe.left,pe.y,pe.right,pe.y)||(lt(re.current),ke())}},[ke]),Qe=Pi(()=>{let N=(d!=null?d:[]).map(Q=>Q==="claude"?"Claude":Q==="codex"?"Codex":Q);return{name:"AI Model",desc:N.length>1?`${N.join(" and ")} are available.`:N.length===1?`Connected to ${N[0]}.`:"No AI providers detected.",usage:N.length>1?["Click the logo to switch between providers","Click the model name to switch tiers"]:["Click the model name to switch tiers"],keys:N.length>1?[{key:"Click",desc:"Switch"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]:[{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]}},[d]);Nl(he,e,fe,!!r,Du),xn(()=>{if(localStorage.getItem(Bi)==="true"&&!e.isAnnotating){if(he||Ne(!0),t({type:"SET_TOOL",payload:Ce.current||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),ge.current&&t({type:"SET_COLOR",payload:ge.current}),ue.current){let S=parseFloat(ue.current);isNaN(S)||t({type:"SET_STROKE_WIDTH",payload:S})}let Q=localStorage.getItem(Oi);if(Q)try{let S=JSON.parse(Q);Array.isArray(S)&&S.length>0&&t({type:"RESTORE_ANNOTATIONS",payload:{annotations:S}})}catch(S){}let pe=localStorage.getItem(Di);if(pe)try{let S=JSON.parse(pe);Array.isArray(S)&&S.length>0&&(t({type:"RESTORE_STYLE_MODIFICATIONS",payload:S}),sr(S))}catch(S){}let Re=localStorage.getItem(Ni);if(Re)try{let S=JSON.parse(Re);Array.isArray(S)&&S.length>0&&t({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:S})}catch(S){}let Te=localStorage.getItem(Ul);if(Te)try{let{selector:S,info:J}=JSON.parse(Te);if(S){let oe=Wt(S);if(oe){let Pe=J||m(f({},Jt(oe)),{selector:S});t({type:"SELECT_ELEMENT",payload:{el:oe,info:Pe}})}}}catch(S){}}return fe.current=!0,()=>{fe.current=!1}},[]);let gt=It(e.styleModifications);xn(()=>{let N=gt.current,Q=e.styleModifications;N!==Q&&(lr(N),sr(Q),gt.current=Q)},[e.styleModifications]),xn(()=>{let N=te.current;te.current=e.isAnnotating,N&&!e.isAnnotating&&he&&Ne(!1)},[e.isAnnotating,he]);let rt=It(he);rt.current=he,xn(()=>{let N=pe=>{if(pe.key==="Meta"||pe.key==="Control"){let Re=Date.now();if(Re-U.current<300){if(V.current++,V.current>=2){if(rt.current)t({type:"SET_ANNOTATING",payload:!1}),Ne(!1);else{let J=localStorage.getItem(Fi);t({type:"SET_TOOL",payload:J||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),Ne(!0)}V.current=0}}else V.current=1;U.current=Re}else V.current=0},Q=pe=>{pe.key!=="Meta"&&pe.key!=="Control"&&(V.current=0)};return window.addEventListener("keydown",N),window.addEventListener("keyup",Q),()=>{window.removeEventListener("keydown",N),window.removeEventListener("keyup",Q)}},[t]);let dt=sn(N=>{ke(),t({type:"SET_TOOL",payload:N}),e.isAnnotating||t({type:"SET_ANNOTATING",payload:!0}),qe.current=!1,lt(null),Oe.current&&(clearTimeout(Oe.current),Oe.current=null),tt.current&&(clearTimeout(tt.current),tt.current=null)},[t,e.isAnnotating,ke]),mt=sn(async()=>{window.focus(),await o()},[o]),Ct=sn(async()=>{n&&await n()},[n]),Be=sn(()=>{t({type:"SET_ANNOTATING",payload:!1}),Ne(!1)},[t]),Kt=sn(()=>{lr(e.styleModifications),document.querySelectorAll("[data-pm]").forEach(N=>N.removeAttribute("data-pm")),t({type:"CLEAR"}),t({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(Oi),localStorage.removeItem(Di),localStorage.removeItem(Ni),pt(null),l==null||l()},[t,e.styleModifications,l]),[ut,zt]=_o(29),Yt=It(null),an=It(null),jt=It(!1),Zt=sn(N=>{let Q=N.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return Q&&Q[1]?parseFloat(Q[1]):null},[]);xn(()=>{jt.current=!0;let N=`oklch(0.628 0.258 ${ut})`;t({type:"SET_COLOR",payload:N}),requestAnimationFrame(()=>{jt.current=!1})},[ut,t]),xn(()=>{if(jt.current)return;let N=Zt(e.activeColor);N!==null&&Math.abs(N-ut)>.5&&zt(N)},[e.activeColor,Zt,ut]);let Gt=e.annotations.length>0;xn(()=>{let N=an.current;if(!N||!Gt)return;let Q=pe=>{pe.preventDefault(),pe.stopPropagation();let Re=pe.deltaY>0?-1:1,Te=((ut+Re)%360+360)%360,S=`oklch(0.628 0.258 ${Te})`;zt(Te),e.selectedAnnotationIds.length>0&&t({type:"UPDATE_ANNOTATION_COLOR",payload:{id:e.lastSelectedId||e.selectedAnnotationIds[0],color:S}})};return N.addEventListener("wheel",Q,{passive:!1}),()=>N.removeEventListener("wheel",Q)},[Gt,e.selectedAnnotationIds,e.lastSelectedId,ut,t]);let j=It(!1),Ee=sn(()=>{j.current=!1,Yt.current=setTimeout(()=>{j.current=!0,zt(29)},500)},[]),He=sn(()=>{Yt.current&&(clearTimeout(Yt.current),Yt.current=null)},[]);xn(()=>()=>{Yt.current&&clearTimeout(Yt.current),Ae.current&&clearTimeout(Ae.current)},[]);let qt=Pi(()=>dr(e.annotations),[e.annotations]),nt=Pi(()=>{let N=[],Q=new Set;for(let pe of e.annotations)if(!qt.has(pe))if(pe.groupId){if(!Q.has(pe.groupId)){Q.add(pe.groupId);let Re=e.annotations.filter(S=>S.groupId===pe.groupId&&!qt.has(S)),Te=Re.find(S=>S.type!=="text")||Re[0];N.push({id:Te.id,annotations:Re})}}else N.push({id:pe.id,annotations:[pe]});return N},[e.annotations,qt]),[vt,pt]=_o(null),ht=nt.length+e.styleModifications.length;xn(()=>{(ht===0||vt!==null&&vt>=ht)&&pt(null)},[ht,vt]),xn(()=>{if(e.selectedAnnotationIds.length===0&&!e.inspectedElement){pt(null);return}if(e.selectedAnnotationIds.length>0){let N=e.selectedAnnotationIds[0],Q=nt.findIndex(pe=>pe.id===N||pe.annotations.some(Re=>Re.id===N));Q>=0&&Q!==vt&&pt(Q)}},[e.selectedAnnotationIds,e.inspectedElement,nt]);let An=sn(()=>{var Q;if(ht===0)return;let N;if(vt===null?N=0:N=(vt+1)%ht,pt(N),N<nt.length){let pe=nt[N];if(!pe)return;t({type:"SELECT_ELEMENT",payload:null}),t({type:"SELECT_ANNOTATION",payload:{id:pe.id}});let Re=pe.annotations.find(Me=>Me.type!=="text")||pe.annotations[0];if(pe.annotations.some(Me=>Me.linkedSelector))t({type:"SET_TOOL",payload:"inspector"});else if(Re!=null&&Re.type&&Re.type!=="text"&&Re.type!=="inspector"){t({type:"SET_TOOL",payload:Re.type});let Me=qn.findIndex(Ye=>Ye.type===Re.type);Me>=0&&$e(Me)}if(Re!=null&&Re.color){t({type:"SET_COLOR",payload:Re.color});let Me=Zt(Re.color);Me!==null&&zt(Me)}let S=pe.annotations.flatMap(Me=>Me.points);if(S.length===0)return;let J=Math.min(...S.map(Me=>Me.x)),oe=Math.max(...S.map(Me=>Me.x)),Pe=Math.min(...S.map(Me=>Me.y)),ye=Math.max(...S.map(Me=>Me.y)),et=(J+oe)/2,je=(Pe+ye)/2;if(window.scrollTo({left:et-window.innerWidth/2,top:je-window.innerHeight/2,behavior:"smooth"}),h&&E){let Me=(Q=pe.annotations.find(Ye=>Ye.threadId))==null?void 0:Q.threadId;Me&&E(Me)}}else{let pe=N-nt.length,Re=e.styleModifications[pe];if(!Re)return;let Te=Wt(Re.selector);if(!Te)return;t({type:"SELECT_ANNOTATION",payload:{id:null}}),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SELECT_ELEMENT",payload:{el:Te,info:Re.element}});let S=Te.getBoundingClientRect(),J=S.left+S.width/2+window.scrollX,oe=S.top+S.height/2+window.scrollY;window.scrollTo({left:J-window.innerWidth/2,top:oe-window.innerHeight/2,behavior:"smooth"})}},[nt,e.styleModifications,ht,vt,t,Zt,h,E]);xn(()=>{if(!he)return;let N=Q=>{let pe=document.activeElement;if((pe==null?void 0:pe.tagName)==="INPUT"||(pe==null?void 0:pe.tagName)==="TEXTAREA")return;if((Q.metaKey||Q.ctrlKey)&&Q.key==="Enter"){n&&(e.annotations.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(S=>!S.captured).length>0)&&(Q.preventDefault(),Ct());return}if((Q.metaKey||Q.ctrlKey)&&(Q.key==="c"||Q.key==="C"||Q.code==="KeyC")){(e.annotations.length>0||e.styleModifications.length>0)&&(Q.preventDefault(),window.focus(),mt());return}if((Q.metaKey||Q.ctrlKey)&&(Q.key==="Backspace"||Q.key==="Delete")){Q.preventDefault(),Kt();return}if(Q.metaKey||Q.ctrlKey||Q.altKey)return;let Re={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand"};if(Q.key.toLowerCase()==="m"){Q.preventDefault(),dt("model");return}let Te=Re[Q.key.toLowerCase()];if(Te){Q.preventDefault();let S=qn.findIndex(J=>J.type===Te);S>=0&&$e(S),dt(Te)}};return window.addEventListener("keydown",N),()=>window.removeEventListener("keydown",N)},[he,dt,mt,Ct,n,Kt,e.annotations.length,e.styleModifications.length,e.spacingTokenChanges,me]);let Vt=m(f({},Ou),{borderRadius:0,padding:he?"0 8px":"0",width:he?"auto":48,height:48,gap:0,justifyContent:he?"flex-start":"center"}),cn=C===!1?"rgba(239, 68, 68, 0.4)":r&&i?i:In.iconActive;return he?xt(Zn,{children:[ne("style",{children:`
+Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},Ou=m(f({position:"fixed",bottom:16,right:16,zIndex:9999,display:"flex",alignItems:"center",backgroundColor:"#ffffff"},gn),{fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",cursor:"pointer",overflow:"visible",boxSizing:"content-box",transition:"all 0ms cubic-bezier(0.4, 0, 0.2, 1)"}),Bi="devtools-toolbar-expanded",Oi="devtools-annotations",Di="devtools-style-modifications",Fi="devtools-active-tool",Gl="devtools-active-color",Vl="devtools-stroke-width",Ul="devtools-inspected-element",Ni="devtools-spacing-changes",Du={expanded:Bi,annotations:Oi,styleMods:Di,spacingChanges:Ni,tool:Fi,color:Gl,stroke:Vl,inspected:Ul};function Fu(){return ne("svg",{width:"16",height:"16",viewBox:"0 0 1200 1200",fill:"currentColor",stroke:"none",children:ne("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 Nu(){return ne("svg",{width:"16",height:"16",viewBox:"0 0 158.7128 157.296",fill:"currentColor",stroke:"none",children:ne("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 Jl({state:e,dispatch:t,onScreenshot:o,onSendToClaude:n,hasActiveJobs:r,activeJobColor:i,onCrosshairHover:s,onClear:l,provider:a="claude",onProviderChange:c,availableProviders:d,modelIndex:p=0,modelCount:u=2,modelLabel:g="Opus 4.6",onModelChange:x,onViewThread:E,isThreadPanelOpen:h,mcpStatus:w,onInstallMcp:D,mcpJustInstalled:B,bridgeUrl:M,isBridgeConnected:C,modelSelectedComponent:L,modelCanvasHoveredComponent:k,onModelComponentHover:W,onSpacingTokenHover:ee,onModifySpacingToken:Z,onDeleteSpacingToken:F,modelRefreshKey:K,onModelComponentAdded:q,onModelComponentRemoved:we,onMouseEnter:le}){let[he,Fe]=_o(()=>typeof window=="undefined"?!1:localStorage.getItem(Bi)==="true"),[Ie,$e]=_o(0),J=It(0),V=It(0),te=It(e.isAnnotating),fe=It(!1),Ce=It(typeof window!="undefined"?localStorage.getItem(Fi):null),ge=It(typeof window!="undefined"?localStorage.getItem(Gl):null),ue=It(typeof window!="undefined"?localStorage.getItem(Vl):null),{charIndex:We}=ur(!!r),[me,lt]=_o(null),qe=It(!1),Ne=It(null),tt=It(null),A=It({x:0,y:0}),re=It(null),de=It(null),Le=It(null),ke=ln(()=>{re.current=null,de.current=null,Le.current&&(clearTimeout(Le.current),Le.current=null)},[]),Re=ln(N=>{tt.current&&(clearTimeout(tt.current),tt.current=null),qe.current?(re.current=N,de.current=f({},A.current),Le.current&&clearTimeout(Le.current),Le.current=setTimeout(()=>{re.current&&(lt(re.current),ke())},300)):(Ne.current&&clearTimeout(Ne.current),Ne.current=setTimeout(()=>{qe.current=!0,lt(N),Ne.current=null},500))},[ke]),ve=ln(()=>{ke(),Ne.current&&(clearTimeout(Ne.current),Ne.current=null),tt.current=setTimeout(()=>{qe.current=!1,lt(null)},150)},[ke]),at=ln(N=>{if(A.current={x:N.clientX,y:N.clientY},re.current&&de.current){let Q=de.current,pe=Pu();Au(N.clientX,N.clientY,Q.x,Q.y,pe.left,pe.y,pe.right,pe.y)||(lt(re.current),ke())}},[ke]),Qe=Pi(()=>{let N=(d!=null?d:[]).map(Q=>Q==="claude"?"Claude":Q==="codex"?"Codex":Q);return{name:"AI Model",desc:N.length>1?`${N.join(" and ")} are available.`:N.length===1?`Connected to ${N[0]}.`:"No AI providers detected.",usage:N.length>1?["Click the logo to switch between providers","Click the model name to switch tiers"]:["Click the model name to switch tiers"],keys:N.length>1?[{key:"Click",desc:"Switch"},{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]:[{key:"\u2318 Enter",desc:"Hand off to your AI",accent:!0}]}},[d]);Nl(he,e,fe,!!r,Du),bn(()=>{if(localStorage.getItem(Bi)==="true"&&!e.isAnnotating){if(he||Fe(!0),t({type:"SET_TOOL",payload:Ce.current||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),ge.current&&t({type:"SET_COLOR",payload:ge.current}),ue.current){let v=parseFloat(ue.current);isNaN(v)||t({type:"SET_STROKE_WIDTH",payload:v})}let Q=localStorage.getItem(Oi);if(Q)try{let v=JSON.parse(Q);Array.isArray(v)&&v.length>0&&t({type:"RESTORE_ANNOTATIONS",payload:{annotations:v}})}catch(v){}let pe=localStorage.getItem(Di);if(pe)try{let v=JSON.parse(pe);Array.isArray(v)&&v.length>0&&(t({type:"RESTORE_STYLE_MODIFICATIONS",payload:v}),sr(v))}catch(v){}let Ae=localStorage.getItem(Ni);if(Ae)try{let v=JSON.parse(Ae);Array.isArray(v)&&v.length>0&&t({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:v})}catch(v){}let Te=localStorage.getItem(Ul);if(Te)try{let{selector:v,info:U}=JSON.parse(Te);if(v){let oe=jt(v);if(oe){let Be=U||m(f({},Jt(oe)),{selector:v});t({type:"SELECT_ELEMENT",payload:{el:oe,info:Be}})}}}catch(v){}}return fe.current=!0,()=>{fe.current=!1}},[]);let ft=It(e.styleModifications);bn(()=>{let N=ft.current,Q=e.styleModifications;N!==Q&&(lr(N),sr(Q),ft.current=Q)},[e.styleModifications]),bn(()=>{let N=te.current;te.current=e.isAnnotating,N&&!e.isAnnotating&&he&&Fe(!1)},[e.isAnnotating,he]);let rt=It(he);rt.current=he,bn(()=>{let N=pe=>{if(pe.key==="Meta"||pe.key==="Control"){let Ae=Date.now();if(Ae-J.current<300){if(V.current++,V.current>=2){if(rt.current)t({type:"SET_ANNOTATING",payload:!1}),Fe(!1);else{let U=localStorage.getItem(Fi);t({type:"SET_TOOL",payload:U||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),Fe(!0)}V.current=0}}else V.current=1;J.current=Ae}else V.current=0},Q=pe=>{pe.key!=="Meta"&&pe.key!=="Control"&&(V.current=0)};return window.addEventListener("keydown",N),window.addEventListener("keyup",Q),()=>{window.removeEventListener("keydown",N),window.removeEventListener("keyup",Q)}},[t]);let gt=ln(N=>{ke(),t({type:"SET_TOOL",payload:N}),e.isAnnotating||t({type:"SET_ANNOTATING",payload:!0}),qe.current=!1,lt(null),Ne.current&&(clearTimeout(Ne.current),Ne.current=null),tt.current&&(clearTimeout(tt.current),tt.current=null)},[t,e.isAnnotating,ke]),ct=ln(async()=>{window.focus(),await o()},[o]),Ct=ln(async()=>{n&&await n()},[n]),Pe=ln(()=>{t({type:"SET_ANNOTATING",payload:!1}),Fe(!1)},[t]),Kt=ln(()=>{lr(e.styleModifications),document.querySelectorAll("[data-pm]").forEach(N=>N.removeAttribute("data-pm")),t({type:"CLEAR"}),t({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(Oi),localStorage.removeItem(Di),localStorage.removeItem(Ni),ut(null),l==null||l()},[t,e.styleModifications,l]),[mt,Dt]=_o(29),Wt=It(null),xn=It(null),Yt=It(!1),Zt=ln(N=>{let Q=N.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return Q&&Q[1]?parseFloat(Q[1]):null},[]);bn(()=>{Yt.current=!0;let N=`oklch(0.628 0.258 ${mt})`;t({type:"SET_COLOR",payload:N}),requestAnimationFrame(()=>{Yt.current=!1})},[mt,t]),bn(()=>{if(Yt.current)return;let N=Zt(e.activeColor);N!==null&&Math.abs(N-mt)>.5&&Dt(N)},[e.activeColor,Zt,mt]);let Gt=e.annotations.length>0;bn(()=>{let N=xn.current;if(!N||!Gt)return;let Q=pe=>{pe.preventDefault(),pe.stopPropagation();let Ae=pe.deltaY>0?-1:1,Te=((mt+Ae)%360+360)%360,v=`oklch(0.628 0.258 ${Te})`;Dt(Te),e.selectedAnnotationIds.length>0&&t({type:"UPDATE_ANNOTATION_COLOR",payload:{id:e.lastSelectedId||e.selectedAnnotationIds[0],color:v}})};return N.addEventListener("wheel",Q,{passive:!1}),()=>N.removeEventListener("wheel",Q)},[Gt,e.selectedAnnotationIds,e.lastSelectedId,mt,t]);let j=It(!1),Ee=ln(()=>{j.current=!1,Wt.current=setTimeout(()=>{j.current=!0,Dt(29)},500)},[]),He=ln(()=>{Wt.current&&(clearTimeout(Wt.current),Wt.current=null)},[]);bn(()=>()=>{Wt.current&&clearTimeout(Wt.current),Le.current&&clearTimeout(Le.current)},[]);let qt=Pi(()=>dr(e.annotations),[e.annotations]),nt=Pi(()=>{let N=[],Q=new Set;for(let pe of e.annotations)if(!qt.has(pe))if(pe.groupId){if(!Q.has(pe.groupId)){Q.add(pe.groupId);let Ae=e.annotations.filter(v=>v.groupId===pe.groupId&&!qt.has(v)),Te=Ae.find(v=>v.type!=="text")||Ae[0];N.push({id:Te.id,annotations:Ae})}}else N.push({id:pe.id,annotations:[pe]});return N},[e.annotations,qt]),[vt,ut]=_o(null),ht=nt.length+e.styleModifications.length;bn(()=>{(ht===0||vt!==null&&vt>=ht)&&ut(null)},[ht,vt]),bn(()=>{if(e.selectedAnnotationIds.length===0&&!e.inspectedElement){ut(null);return}if(e.selectedAnnotationIds.length>0){let N=e.selectedAnnotationIds[0],Q=nt.findIndex(pe=>pe.id===N||pe.annotations.some(Ae=>Ae.id===N));Q>=0&&Q!==vt&&ut(Q)}},[e.selectedAnnotationIds,e.inspectedElement,nt]);let An=ln(()=>{var Q;if(ht===0)return;let N;if(vt===null?N=0:N=(vt+1)%ht,ut(N),N<nt.length){let pe=nt[N];if(!pe)return;t({type:"SELECT_ELEMENT",payload:null}),t({type:"SELECT_ANNOTATION",payload:{id:pe.id}});let Ae=pe.annotations.find(Me=>Me.type!=="text")||pe.annotations[0];if(pe.annotations.some(Me=>Me.linkedSelector))t({type:"SET_TOOL",payload:"inspector"});else if(Ae!=null&&Ae.type&&Ae.type!=="text"&&Ae.type!=="inspector"){t({type:"SET_TOOL",payload:Ae.type});let Me=qn.findIndex(Ye=>Ye.type===Ae.type);Me>=0&&$e(Me)}if(Ae!=null&&Ae.color){t({type:"SET_COLOR",payload:Ae.color});let Me=Zt(Ae.color);Me!==null&&Dt(Me)}let v=pe.annotations.flatMap(Me=>Me.points);if(v.length===0)return;let U=Math.min(...v.map(Me=>Me.x)),oe=Math.max(...v.map(Me=>Me.x)),Be=Math.min(...v.map(Me=>Me.y)),ye=Math.max(...v.map(Me=>Me.y)),et=(U+oe)/2,je=(Be+ye)/2;if(window.scrollTo({left:et-window.innerWidth/2,top:je-window.innerHeight/2,behavior:"smooth"}),h&&E){let Me=(Q=pe.annotations.find(Ye=>Ye.threadId))==null?void 0:Q.threadId;Me&&E(Me)}}else{let pe=N-nt.length,Ae=e.styleModifications[pe];if(!Ae)return;let Te=jt(Ae.selector);if(!Te)return;t({type:"SELECT_ANNOTATION",payload:{id:null}}),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SELECT_ELEMENT",payload:{el:Te,info:Ae.element}});let v=Te.getBoundingClientRect(),U=v.left+v.width/2+window.scrollX,oe=v.top+v.height/2+window.scrollY;window.scrollTo({left:U-window.innerWidth/2,top:oe-window.innerHeight/2,behavior:"smooth"})}},[nt,e.styleModifications,ht,vt,t,Zt,h,E]);bn(()=>{if(!he)return;let N=Q=>{let pe=document.activeElement;if((pe==null?void 0:pe.tagName)==="INPUT"||(pe==null?void 0:pe.tagName)==="TEXTAREA")return;if((Q.metaKey||Q.ctrlKey)&&Q.key==="Enter"){n&&(e.annotations.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(v=>!v.captured).length>0)&&(Q.preventDefault(),Ct());return}if((Q.metaKey||Q.ctrlKey)&&(Q.key==="c"||Q.key==="C"||Q.code==="KeyC")){(e.annotations.length>0||e.styleModifications.length>0)&&(Q.preventDefault(),window.focus(),ct());return}if((Q.metaKey||Q.ctrlKey)&&(Q.key==="Backspace"||Q.key==="Delete")){Q.preventDefault(),Kt();return}if(Q.metaKey||Q.ctrlKey||Q.altKey)return;let Ae={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand"};if(Q.key.toLowerCase()==="m"){Q.preventDefault(),gt("model");return}let Te=Ae[Q.key.toLowerCase()];if(Te){Q.preventDefault();let v=qn.findIndex(U=>U.type===Te);v>=0&&$e(v),gt(Te)}};return window.addEventListener("keydown",N),()=>window.removeEventListener("keydown",N)},[he,gt,ct,Ct,n,Kt,e.annotations.length,e.styleModifications.length,e.spacingTokenChanges,me]);let Vt=m(f({},Ou),{borderRadius:0,padding:he?"0 8px":"0",width:he?"auto":48,height:48,gap:0,justifyContent:he?"flex-start":"center"}),an=C===!1?"rgba(239, 68, 68, 0.4)":r&&i?i:In.iconActive;return he?xt(Zn,{children:[ne("style",{children:`
         @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
-      `}),ne("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),!h&&(me==="model"||e.activeTool==="model")&&ne(Wl,{bridgeUrl:M,selectedComponent:L,hoveredComponent:k,onComponentHover:W,onSpacingTokenHover:ee,onModifySpacingToken:Z,onDeleteSpacingToken:F,modelRefreshKey:K,onComponentAdded:q,onComponentRemoved:we,onMouseEnter:()=>{ke(),tt.current&&(clearTimeout(tt.current),tt.current=null)},onMouseLeave:e.activeTool==="model"?void 0:xe}),me&&me!=="model"&&(me==="provider"||jl[me])&&(()=>{let N=me==="provider"?Qe:jl[me];return xt("div",{onMouseEnter:me==="collapse"?()=>{ke(),tt.current&&(clearTimeout(tt.current),tt.current=null)}:void 0,onMouseLeave:me==="collapse"?xe:void 0,style:f(m(f({position:"fixed",bottom:80,right:16,width:300,backgroundColor:"#ffffff"},mn),{boxSizing:"content-box",zIndex:10001,fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12}),me!=="collapse"?{pointerEvents:"none"}:{}),children:[me==="collapse"&&ne("div",{style:{marginBottom:10},children:ne("svg",{width:"48",height:"48",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:ne("path",{d:"M11.1406 31.2559C11.2407 31.3875 11.351 31.5132 11.4697 31.6338L3.10449 40H2.39746L11.1406 31.2559ZM8.05371 40H7.34668L14.5498 32.7959C14.8554 32.7706 15.1541 32.7063 15.4414 32.6113L8.05371 40ZM18.2197 34.0762C18.3788 34.1569 18.5445 34.2272 18.7168 34.2861L13.0039 40H12.2969L18.2197 34.0762ZM17.9531 40H17.2461L26.1338 31.1113C26.438 31.0829 26.7427 31.0148 27.0439 30.9082L17.9531 40ZM40 22.9023L22.9033 40H22.1963L40 22.1953V22.9023ZM40 27.8525L27.8525 40H27.1455L40 27.1455V27.8525ZM40 32.8027L32.8027 40H32.0957L40 32.0957V32.8027ZM40 37.752L37.752 40H37.0449L40 37.0449V37.752ZM9.06543 28.3809C9.25255 28.4332 9.45183 28.4715 9.66504 28.4883L0 38.1543V37.4473L9.06543 28.3809ZM6.59375 25.9023C6.65822 26.0626 6.73171 26.2263 6.81445 26.3896L0 33.2041V32.4971L6.59375 25.9023ZM20.25 8.00293H20.249C21.5098 8.0286 22.7219 8.25094 23.8584 8.63672L23.8604 8.63574C23.8961 8.64787 23.9312 8.66145 23.9668 8.67383C24.0611 8.70686 24.1548 8.74106 24.248 8.77637C24.2915 8.79273 24.3357 8.80727 24.3789 8.82422L24.376 8.82617C27.6145 10.0955 30.1646 12.7301 31.3213 16.0234L31.3232 16.0225C31.3327 16.0493 31.3404 16.0766 31.3496 16.1035C31.7691 17.3256 32 18.6356 32 20C32 20.8726 31.9366 21.6706 31.7598 22.4902L31.7197 22.6328C31.6412 23.0066 31.5136 23.6108 31.3408 24.2217L31.3398 24.2246C31.2967 24.377 31.251 24.5299 31.2021 24.6797C30.9215 25.5403 30.5473 26.2998 30.0879 26.2998C29.7613 26.2996 29.5995 25.9674 29.4316 25.6221C29.2501 25.2487 29.0614 24.8605 28.6484 24.8604C27.8532 24.8604 27.2081 25.5046 27.208 26.2998V27.0771C27.2079 27.6079 26.9661 28.112 26.5205 28.4004C25.9146 28.7925 25.2357 28.6462 24.7959 28.2061L24.7949 28.208C24.7897 28.2028 24.7854 28.1967 24.7803 28.1914C24.7654 28.1761 24.7507 28.1606 24.7363 28.1445C24.7105 28.1156 24.6858 28.0857 24.6621 28.0547C24.6461 28.0339 24.6302 28.013 24.6152 27.9912C24.5931 27.9591 24.5726 27.9257 24.5527 27.8916C24.5392 27.8685 24.5261 27.8452 24.5137 27.8213C24.5093 27.8128 24.5043 27.8045 24.5 27.7959L24.501 27.7939C24.3932 27.5763 24.3282 27.3276 24.3281 27.0576V26.2998C24.328 25.5993 23.8278 25.0158 23.165 24.8867V24.8877C23.0752 24.8702 22.9826 24.8604 22.8877 24.8604C22.8446 24.8604 22.8019 24.8624 22.7598 24.8662C22.0247 24.9312 21.4483 25.5479 21.4482 26.2998C21.4482 26.9127 21.4608 27.5305 21.4736 28.1494L21.4951 29.3135C21.5 29.7013 21.5015 30.089 21.4971 30.4756C21.4874 31.3103 20.8426 32 20.0078 32C19.1732 31.9998 18.5292 31.3102 18.5195 30.4756C18.5159 30.1613 18.5176 29.8464 18.5205 29.5312V29.5322C18.5212 29.4593 18.5206 29.3864 18.5215 29.3135L18.5303 28.8154V28.8145C18.5343 28.5927 18.5384 28.371 18.543 28.1494C18.5558 27.5305 18.5684 28.1129 18.5684 27.5C18.5684 26.7047 17.9232 26.0596 17.1279 26.0596C16.907 26.0596 16.6978 26.1103 16.5107 26.1992C16.2161 26.3393 15.9767 26.5769 15.834 26.8701C15.8269 26.8846 15.8201 26.8993 15.8135 26.9141C15.7821 26.9845 15.7562 27.0579 15.7363 27.1338C15.7243 27.1798 15.7155 27.2267 15.708 27.2744C15.7012 27.3175 15.6953 27.361 15.6924 27.4053C15.6903 27.4366 15.6885 27.4681 15.6885 27.5V28.7383C15.6883 29.9234 14.4911 30.7248 13.4961 30.0811C13.0505 29.7926 12.8086 29.2886 12.8086 28.7578V26.2998C12.8086 25.9737 12.6984 25.674 12.5156 25.4326C12.4437 25.3381 12.3612 25.2521 12.2686 25.1777V25.1768C12.0219 24.9788 11.709 24.8604 11.3682 24.8604C10.9892 24.8604 10.8622 24.8872 10.7295 25.2295C10.5837 25.6055 10.4302 26 9.92773 26C9.33081 25.9996 8.95963 25.2403 8.71484 24.3799C8.5591 23.8325 8.45907 23.571 8.3623 23.0107C8.3501 22.9401 8.33284 22.8403 8.31738 22.7529C8.12812 21.9466 8.02043 21.1089 8.00293 20.249V20.25L8 20C8 19.8617 8.00317 19.724 8.00781 19.5869C8.00837 19.5703 8.00816 19.5537 8.00879 19.5371L8.00977 19.5352C8.0998 17.1716 8.87444 14.9844 10.1396 13.1631C10.1488 13.1499 10.1587 13.1372 10.168 13.124C12.255 10.1453 15.6582 8.15745 19.5352 8.00977L19.5371 8.00879C19.5537 8.00816 19.5703 8.00837 19.5869 8.00781C19.724 8.00317 19.8617 8 20 8L20.25 8.00293ZM5.72266 22.5303L0 28.2539V27.5469L5.62793 21.918C5.6553 22.1234 5.6868 22.3275 5.72266 22.5303ZM16.2637 26.8398L16.2617 26.8408C16.2784 26.8013 16.2954 26.7627 16.3135 26.7256C16.3203 26.7116 16.3275 26.6982 16.334 26.6855C16.3125 26.7277 16.289 26.7808 16.2637 26.8398ZM40 17.9531L33.9854 23.9668C34.051 23.6832 34.1043 23.4321 34.1445 23.2412L34.1641 23.1748L34.1865 23.0967L34.1963 23.0488L40 17.2461V17.9531ZM5.87012 16.7266C5.80321 17.0165 5.74649 17.3101 5.69727 17.6064L0 23.3047V22.5977L5.87012 16.7266ZM40 13.0039L34.4297 18.5732C34.409 18.3615 34.3832 18.1513 34.3535 17.9424L40 12.2969V13.0039ZM0 18.3555V17.6484L17.6484 0H18.3555L0 18.3555ZM40 8.05371L33.458 14.5947C33.3909 14.4277 33.3202 14.2625 33.2471 14.0986L40 7.34668V8.05371ZM0 13.4053V12.6982L12.6992 0H13.4062L0 13.4053ZM40 3.10352L31.6865 11.416C31.5868 11.2805 31.4851 11.1465 31.3809 11.0146L40 2.39648V3.10352ZM29.2881 8.86523C29.1595 8.75783 29.0288 8.65278 28.8965 8.5498L37.4473 0H38.1543L29.2881 8.86523ZM0 8.45508V7.74805L7.74805 0H8.45508L0 8.45508ZM26.2783 6.92578C26.1183 6.84878 25.9562 6.77534 25.793 6.7041L32.498 0H33.2051L26.2783 6.92578ZM17.6064 5.69727C17.3101 5.74649 17.0165 5.80321 16.7266 5.87012L22.5977 0H23.3047L17.6064 5.69727ZM22.5322 5.7207C22.3295 5.685 22.1254 5.65316 21.9199 5.62598L27.5469 0H28.2539L22.5322 5.7207ZM0 3.50586V2.79883L2.79883 0H3.50586L0 3.50586Z",fill:"currentColor"})})}),xt("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[ne("span",{children:N.name}),N.keys[0]&&ne("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:N.keys[0].key})]}),ne("div",{style:{color:"#6b7280",lineHeight:1.5,marginBottom:me==="collapse"?0:10},children:N.desc.split(`
+      `}),ne("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),!h&&(me==="model"||e.activeTool==="model")&&ne(Wl,{bridgeUrl:M,selectedComponent:L,hoveredComponent:k,onComponentHover:W,onSpacingTokenHover:ee,onModifySpacingToken:Z,onDeleteSpacingToken:F,modelRefreshKey:K,onComponentAdded:q,onComponentRemoved:we,onMouseEnter:()=>{ke(),tt.current&&(clearTimeout(tt.current),tt.current=null)},onMouseLeave:e.activeTool==="model"?void 0:ve}),me&&me!=="model"&&(me==="provider"||jl[me])&&(()=>{let N=me==="provider"?Qe:jl[me];return xt("div",{onMouseEnter:me==="collapse"?()=>{ke(),tt.current&&(clearTimeout(tt.current),tt.current=null)}:void 0,onMouseLeave:me==="collapse"?ve:void 0,style:f(m(f({position:"fixed",bottom:80,right:16,width:300,backgroundColor:"#ffffff"},gn),{boxSizing:"content-box",zIndex:10001,fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12}),me!=="collapse"?{pointerEvents:"none"}:{}),children:[me==="collapse"&&ne("div",{style:{marginBottom:10},children:ne("svg",{width:"48",height:"48",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:ne("path",{d:"M11.1406 31.2559C11.2407 31.3875 11.351 31.5132 11.4697 31.6338L3.10449 40H2.39746L11.1406 31.2559ZM8.05371 40H7.34668L14.5498 32.7959C14.8554 32.7706 15.1541 32.7063 15.4414 32.6113L8.05371 40ZM18.2197 34.0762C18.3788 34.1569 18.5445 34.2272 18.7168 34.2861L13.0039 40H12.2969L18.2197 34.0762ZM17.9531 40H17.2461L26.1338 31.1113C26.438 31.0829 26.7427 31.0148 27.0439 30.9082L17.9531 40ZM40 22.9023L22.9033 40H22.1963L40 22.1953V22.9023ZM40 27.8525L27.8525 40H27.1455L40 27.1455V27.8525ZM40 32.8027L32.8027 40H32.0957L40 32.0957V32.8027ZM40 37.752L37.752 40H37.0449L40 37.0449V37.752ZM9.06543 28.3809C9.25255 28.4332 9.45183 28.4715 9.66504 28.4883L0 38.1543V37.4473L9.06543 28.3809ZM6.59375 25.9023C6.65822 26.0626 6.73171 26.2263 6.81445 26.3896L0 33.2041V32.4971L6.59375 25.9023ZM20.25 8.00293H20.249C21.5098 8.0286 22.7219 8.25094 23.8584 8.63672L23.8604 8.63574C23.8961 8.64787 23.9312 8.66145 23.9668 8.67383C24.0611 8.70686 24.1548 8.74106 24.248 8.77637C24.2915 8.79273 24.3357 8.80727 24.3789 8.82422L24.376 8.82617C27.6145 10.0955 30.1646 12.7301 31.3213 16.0234L31.3232 16.0225C31.3327 16.0493 31.3404 16.0766 31.3496 16.1035C31.7691 17.3256 32 18.6356 32 20C32 20.8726 31.9366 21.6706 31.7598 22.4902L31.7197 22.6328C31.6412 23.0066 31.5136 23.6108 31.3408 24.2217L31.3398 24.2246C31.2967 24.377 31.251 24.5299 31.2021 24.6797C30.9215 25.5403 30.5473 26.2998 30.0879 26.2998C29.7613 26.2996 29.5995 25.9674 29.4316 25.6221C29.2501 25.2487 29.0614 24.8605 28.6484 24.8604C27.8532 24.8604 27.2081 25.5046 27.208 26.2998V27.0771C27.2079 27.6079 26.9661 28.112 26.5205 28.4004C25.9146 28.7925 25.2357 28.6462 24.7959 28.2061L24.7949 28.208C24.7897 28.2028 24.7854 28.1967 24.7803 28.1914C24.7654 28.1761 24.7507 28.1606 24.7363 28.1445C24.7105 28.1156 24.6858 28.0857 24.6621 28.0547C24.6461 28.0339 24.6302 28.013 24.6152 27.9912C24.5931 27.9591 24.5726 27.9257 24.5527 27.8916C24.5392 27.8685 24.5261 27.8452 24.5137 27.8213C24.5093 27.8128 24.5043 27.8045 24.5 27.7959L24.501 27.7939C24.3932 27.5763 24.3282 27.3276 24.3281 27.0576V26.2998C24.328 25.5993 23.8278 25.0158 23.165 24.8867V24.8877C23.0752 24.8702 22.9826 24.8604 22.8877 24.8604C22.8446 24.8604 22.8019 24.8624 22.7598 24.8662C22.0247 24.9312 21.4483 25.5479 21.4482 26.2998C21.4482 26.9127 21.4608 27.5305 21.4736 28.1494L21.4951 29.3135C21.5 29.7013 21.5015 30.089 21.4971 30.4756C21.4874 31.3103 20.8426 32 20.0078 32C19.1732 31.9998 18.5292 31.3102 18.5195 30.4756C18.5159 30.1613 18.5176 29.8464 18.5205 29.5312V29.5322C18.5212 29.4593 18.5206 29.3864 18.5215 29.3135L18.5303 28.8154V28.8145C18.5343 28.5927 18.5384 28.371 18.543 28.1494C18.5558 27.5305 18.5684 28.1129 18.5684 27.5C18.5684 26.7047 17.9232 26.0596 17.1279 26.0596C16.907 26.0596 16.6978 26.1103 16.5107 26.1992C16.2161 26.3393 15.9767 26.5769 15.834 26.8701C15.8269 26.8846 15.8201 26.8993 15.8135 26.9141C15.7821 26.9845 15.7562 27.0579 15.7363 27.1338C15.7243 27.1798 15.7155 27.2267 15.708 27.2744C15.7012 27.3175 15.6953 27.361 15.6924 27.4053C15.6903 27.4366 15.6885 27.4681 15.6885 27.5V28.7383C15.6883 29.9234 14.4911 30.7248 13.4961 30.0811C13.0505 29.7926 12.8086 29.2886 12.8086 28.7578V26.2998C12.8086 25.9737 12.6984 25.674 12.5156 25.4326C12.4437 25.3381 12.3612 25.2521 12.2686 25.1777V25.1768C12.0219 24.9788 11.709 24.8604 11.3682 24.8604C10.9892 24.8604 10.8622 24.8872 10.7295 25.2295C10.5837 25.6055 10.4302 26 9.92773 26C9.33081 25.9996 8.95963 25.2403 8.71484 24.3799C8.5591 23.8325 8.45907 23.571 8.3623 23.0107C8.3501 22.9401 8.33284 22.8403 8.31738 22.7529C8.12812 21.9466 8.02043 21.1089 8.00293 20.249V20.25L8 20C8 19.8617 8.00317 19.724 8.00781 19.5869C8.00837 19.5703 8.00816 19.5537 8.00879 19.5371L8.00977 19.5352C8.0998 17.1716 8.87444 14.9844 10.1396 13.1631C10.1488 13.1499 10.1587 13.1372 10.168 13.124C12.255 10.1453 15.6582 8.15745 19.5352 8.00977L19.5371 8.00879C19.5537 8.00816 19.5703 8.00837 19.5869 8.00781C19.724 8.00317 19.8617 8 20 8L20.25 8.00293ZM5.72266 22.5303L0 28.2539V27.5469L5.62793 21.918C5.6553 22.1234 5.6868 22.3275 5.72266 22.5303ZM16.2637 26.8398L16.2617 26.8408C16.2784 26.8013 16.2954 26.7627 16.3135 26.7256C16.3203 26.7116 16.3275 26.6982 16.334 26.6855C16.3125 26.7277 16.289 26.7808 16.2637 26.8398ZM40 17.9531L33.9854 23.9668C34.051 23.6832 34.1043 23.4321 34.1445 23.2412L34.1641 23.1748L34.1865 23.0967L34.1963 23.0488L40 17.2461V17.9531ZM5.87012 16.7266C5.80321 17.0165 5.74649 17.3101 5.69727 17.6064L0 23.3047V22.5977L5.87012 16.7266ZM40 13.0039L34.4297 18.5732C34.409 18.3615 34.3832 18.1513 34.3535 17.9424L40 12.2969V13.0039ZM0 18.3555V17.6484L17.6484 0H18.3555L0 18.3555ZM40 8.05371L33.458 14.5947C33.3909 14.4277 33.3202 14.2625 33.2471 14.0986L40 7.34668V8.05371ZM0 13.4053V12.6982L12.6992 0H13.4062L0 13.4053ZM40 3.10352L31.6865 11.416C31.5868 11.2805 31.4851 11.1465 31.3809 11.0146L40 2.39648V3.10352ZM29.2881 8.86523C29.1595 8.75783 29.0288 8.65278 28.8965 8.5498L37.4473 0H38.1543L29.2881 8.86523ZM0 8.45508V7.74805L7.74805 0H8.45508L0 8.45508ZM26.2783 6.92578C26.1183 6.84878 25.9562 6.77534 25.793 6.7041L32.498 0H33.2051L26.2783 6.92578ZM17.6064 5.69727C17.3101 5.74649 17.0165 5.80321 16.7266 5.87012L22.5977 0H23.3047L17.6064 5.69727ZM22.5322 5.7207C22.3295 5.685 22.1254 5.65316 21.9199 5.62598L27.5469 0H28.2539L22.5322 5.7207ZM0 3.50586V2.79883L2.79883 0H3.50586L0 3.50586Z",fill:"currentColor"})})}),xt("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[ne("span",{children:N.name}),N.keys[0]&&ne("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:N.keys[0].key})]}),ne("div",{style:{color:"#6b7280",lineHeight:1.5,marginBottom:me==="collapse"?0:10},children:N.desc.split(`
 
-`).map((Q,pe)=>ne("p",{style:{margin:0,marginTop:pe>0?8:0},children:Q},pe))}),N.usage.map((Q,pe)=>xt("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[ne("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),ne("span",{children:Q})]},pe)),me==="collapse"&&w&&Object.keys(w).length>0&&(()=>{let Q=Object.entries(w).filter(([,Te])=>Te.found&&!Te.disabled).map(([Te])=>Te.charAt(0).toUpperCase()+Te.slice(1)),pe=Object.entries(w).filter(([,Te])=>!Te.found).map(([Te])=>Te);if(Q.length===0&&pe.length===0)return null;let Re=pe.map(Te=>Te.charAt(0).toUpperCase()+Te.slice(1));return xt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8,display:"flex",alignItems:"center",gap:6,fontSize:11},children:[ne("span",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:Q.length>0?"#22c55e":"rgba(0,0,0,0.2)",flexShrink:0}}),Q.length>0?xt("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[xt("span",{children:["Taste library ready in ",Q.join(", "),B&&" \u2014 restart CLI to activate"]}),pe.length>0&&D&&!B&&xt("button",{type:"button",onClick:Te=>{Te.stopPropagation(),D()},style:{border:"none",background:"transparent",color:"#3b82f6",fontSize:10,fontWeight:500,fontFamily:"inherit",padding:0,cursor:"pointer",pointerEvents:"auto",textDecoration:"underline",textUnderlineOffset:2},children:["+ ",Re.join(", ")]})]}):pe.length>0&&D?xt("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[ne("span",{children:"Connect Popmelt MCP"}),ne("button",{type:"button",onClick:Te=>{Te.stopPropagation(),D()},style:{border:"none",background:"#1f2937",color:"#fff",fontSize:10,fontWeight:600,fontFamily:"inherit",padding:"2px 8px",cursor:"pointer",pointerEvents:"auto"},children:"Connect"})]}):null]})})(),N.keys.length>1&&ne("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8,display:"flex",flexDirection:"column",gap:4},children:N.keys.slice(1).map((Q,pe)=>xt("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:Q.accent?"#fff":"#6b7280"},children:[ne("code",{style:{fontSize:10,backgroundColor:Q.accent?e.activeColor:"rgba(0,0,0,0.06)",color:Q.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:Q.key}),ne("span",{style:{color:Q.accent?e.activeColor:void 0,fontWeight:Q.accent?600:void 0},children:Q.desc})]},pe))})]})})(),xt("div",{id:"devtools-toolbar",style:Vt,onMouseEnter:le,onMouseMove:at,children:[(e.annotations.length>0||e.styleModifications.length>0)&&xt(Zn,{children:[ne("span",{onMouseEnter:()=>Le("clear"),onMouseLeave:xe,children:ne(Ln,{onClick:Kt,title:"Clear all (\u2318\u232B)",children:ne(Iu,{size:17,strokeWidth:1.5})})}),ne(Ai,{})]}),xt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[ne("span",{onMouseEnter:()=>Le("inspector"),onMouseLeave:xe,children:ne(Ln,{active:e.isAnnotating&&e.activeTool==="inspector",siblingActive:e.isAnnotating,onClick:()=>dt("inspector"),children:ne(Eu,{size:20,strokeWidth:1.5})})}),ne("span",{onMouseEnter:()=>Le("hand"),onMouseLeave:xe,children:ne(Ln,{active:e.isAnnotating&&e.activeTool==="hand",siblingActive:e.isAnnotating,onClick:()=>dt("hand"),children:xt("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[ne(ku,{size:20,strokeWidth:1.5}),e.styleModifications.filter(N=>!N.captured).length>0&&ne("div",{style:{position:"absolute",top:-7,right:-9,minWidth:14,height:14,borderRadius:0,backgroundColor:e.activeColor,color:"#fff",fontSize:9,fontWeight:700,display:"flex",alignItems:"center",justifyContent:"center",padding:"0 2px",lineHeight:1},children:e.styleModifications.filter(N=>!N.captured).length})]})})}),(()=>{let N=qn[Ie],Q=N.icon,pe=e.isAnnotating&&Ru.has(e.activeTool);return ne("span",{onMouseEnter:()=>Le(N.type),onMouseLeave:xe,children:xt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[ne(Ln,{active:pe,siblingActive:e.isAnnotating,onClick:()=>dt(N.type),children:ne(Q,{size:20,strokeWidth:1.5})}),ne("button",{type:"button",onClick:()=>{let Re=(Ie+1)%qn.length;$e(Re),dt(qn[Re].type)},title:"Cycle shape tool",style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:2,width:12,height:32,border:"none",background:"none",cursor:"pointer",padding:"0 2px",opacity:e.isAnnotating&&!pe?.5:1,transition:"opacity 150ms ease"},children:qn.map((Re,Te)=>ne("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:Te===Ie?In.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},Te))})]})})})(),Bu.map(({type:N,icon:Q,label:pe,shortcut:Re})=>ne("span",{onMouseEnter:()=>Le(N),onMouseLeave:xe,children:ne(Ln,{active:e.isAnnotating&&e.activeTool===N,siblingActive:e.isAnnotating,onClick:()=>dt(N),children:ne(Q,{size:20,strokeWidth:1.5})})},N)),ne("span",{onMouseEnter:()=>Le("model"),onMouseLeave:xe,children:ne(Ln,{active:e.isAnnotating&&e.activeTool==="model",siblingActive:e.isAnnotating,onClick:()=>dt("model"),children:ne(wu,{size:17,strokeWidth:1.5})})})]}),ne(Ai,{}),xt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(nt.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(N=>!N.captured).length>0)&&(()=>{var Te;let N=vt!==null&&vt<nt.length?nt[vt]:null,Q=e.annotations.length>0&&e.annotations.every(S=>S.status&&S.status!=="pending"),pe=vt!==null?(Te=N==null?void 0:N.annotations.some(S=>S.status&&S.status!=="pending"))!=null?Te:!1:Q,Re=`oklch(0.628 0.258 ${ut})`;return ne("span",{onMouseEnter:()=>Le("counter"),onMouseLeave:xe,children:ne("button",{ref:an,type:"button",onClick:()=>{if(j.current){j.current=!1;return}An()},onMouseDown:Ee,onMouseUp:He,onMouseLeave:He,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:pe?"#999999":Re,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:vt!==null?vt+1:nt.length+e.styleModifications.length+e.spacingTokenChanges.filter(S=>!S.captured).length})})})(),c&&ne("span",{onMouseEnter:()=>Le("provider"),onMouseLeave:xe,style:{display:"contents"},children:xt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[ne(Ln,{onClick:()=>c(a==="claude"?"codex":"claude"),children:a==="claude"?ne(Fu,{}):ne(Nu,{})}),xt("button",{type:"button",onClick:()=>{let N=(p+1)%u;x==null||x(N)},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:In.iconDefault,whiteSpace:"nowrap"},children:[ne("span",{children:g}),ne("span",{style:{display:"flex",flexDirection:"column",gap:2},children:Array.from({length:u},(N,Q)=>ne("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:Q===p?In.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},Q))})]})]})}),ne("div",{onMouseEnter:N=>{s==null||s(!0),N.currentTarget.style.opacity="1",Le("collapse")},onMouseLeave:N=>{s==null||s(!1),N.currentTarget.style.opacity=r?"1":"0.3",xe()},style:{display:"inline-flex",opacity:r?1:.3,transition:"opacity 150ms ease"},children:ne(Ln,{onClick:Be,title:"Collapse (\u2318\u2318)",children:r?ne("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:cn,children:We===1?xt(Zn,{children:[ne("circle",{cx:"7",cy:"7",r:"2"}),ne("circle",{cx:"17",cy:"7",r:"2"}),ne("circle",{cx:"7",cy:"17",r:"2"}),ne("circle",{cx:"17",cy:"17",r:"2"})]}):xt(Zn,{children:[ne("circle",{cx:"12",cy:"6",r:"2"}),ne("circle",{cx:"6",cy:"12",r:"2"}),ne("circle",{cx:"18",cy:"12",r:"2"}),ne("circle",{cx:"12",cy:"18",r:"2"})]})}):xt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:cn,strokeWidth:"1.5",strokeLinecap:"round",style:{transform:"rotate(45deg)"},children:[ne("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),ne("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),ne("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),ne("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})]})]}):xt(Zn,{children:[ne("style",{children:"@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }"}),ne("div",{id:"devtools-toolbar",style:m(f({},Vt),{overflow:"visible",opacity:.5,transition:"opacity 150ms ease"}),onMouseEnter:N=>{N.currentTarget.style.opacity="1",le==null||le()},onMouseLeave:N=>N.currentTarget.style.opacity="0.5",children:ne("button",{type:"button",style:{display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,border:"none",background:"none",cursor:"pointer",padding:0},onClick:()=>{Ne(!0),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SET_ANNOTATING",payload:!0})},onMouseEnter:()=>s==null?void 0:s(!0),onMouseLeave:()=>s==null?void 0:s(!1),title:"Open annotation toolbar (\u2318\u2318)",children:r?ne("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:cn,children:We===1?xt(Zn,{children:[ne("circle",{cx:"7",cy:"7",r:"2"}),ne("circle",{cx:"17",cy:"7",r:"2"}),ne("circle",{cx:"7",cy:"17",r:"2"}),ne("circle",{cx:"17",cy:"17",r:"2"})]}):xt(Zn,{children:[ne("circle",{cx:"12",cy:"6",r:"2"}),ne("circle",{cx:"6",cy:"12",r:"2"}),ne("circle",{cx:"18",cy:"12",r:"2"}),ne("circle",{cx:"12",cy:"18",r:"2"})]})}):xt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:cn,strokeWidth:"1.5",strokeLinecap:"round",children:[ne("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),ne("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),ne("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),ne("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})}import{useEffect as Mo,useRef as Hu,useState as Hi}from"react";import{Fragment as Kl,jsx as Et,jsxs as $o}from"react/jsx-runtime";var zu={position:"fixed",bottom:86,right:16,zIndex:9999,display:"flex",flexDirection:"column"},_u=24,$u=6,Wu=_u-$u,Yu=8,Xl=m(f({display:"flex",alignItems:"center",gap:6,padding:"4px 10px",backgroundColor:"rgba(255, 255, 255, 0.85)"},mn),{backdropFilter:"blur(32px)",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,color:"#1f2937",whiteSpace:"nowrap",transition:"transform 200ms ease, opacity 200ms ease"});function ju(e){var s;let t=e.filter(l=>l.type==="tool_use");if(t.length===0)return"Starting\u2026";let o=t[t.length-1],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 Gu(e,t){if(e.some(r=>r.type==="question"&&r.data.jobId===t))return"Has a question";let n=e.find(r=>r.type==="done"&&r.data.jobId===t);if(n){let r=n.data.resolutions;if(Array.isArray(r)&&r.length>0)return"Applied changes"}return"Replied"}function Vu({color:e}){let[t,o]=Hi(0);return Mo(()=>{let n=setInterval(()=>{o(r=>(r+1)%2)},250);return()=>clearInterval(n)},[]),Et("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?$o(Kl,{children:[Et("circle",{cx:"7",cy:"7",r:"2"}),Et("circle",{cx:"17",cy:"7",r:"2"}),Et("circle",{cx:"7",cy:"17",r:"2"}),Et("circle",{cx:"17",cy:"17",r:"2"})]}):$o(Kl,{children:[Et("circle",{cx:"12",cy:"6",r:"2"}),Et("circle",{cx:"6",cy:"12",r:"2"}),Et("circle",{cx:"18",cy:"12",r:"2"}),Et("circle",{cx:"12",cy:"18",r:"2"})]})})}function Uu({color:e}){return Et("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:e,opacity:.6}})}function Ju({color:e}){return Et("span",{style:{color:e,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function Xu(){return Et("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function Zl({bridge:e,inFlightJobs:t,isVisible:o,onHover:n,clearSignal:r,onViewThread:i,onCancel:s,onHoverJob:l,isConnected:a,dismissedThreadIds:c}){let[d,p]=Hi([]),[u,g]=Hi(!1);Mo(()=>{r>0&&p([])},[r]),Mo(()=>{!c||c.size===0||p(h=>{let w=h.filter(D=>!D.threadId||!c.has(D.threadId));return w.length===h.length?h:w})},[c]),Mo(()=>{p(h=>{var M;let w=new Set(h.map(C=>C.jobId)),D=!1,B=h.map(C=>{let L=t[C.jobId];return L&&(!C.threadId||C.color==="#888")?(D=!0,m(f({},C),{threadId:C.threadId||L.threadId,color:C.color==="#888"?L.color:C.color})):C});for(let[C,L]of Object.entries(t))w.has(C)||(B.push({jobId:C,color:L.color,status:"queued",threadId:L.threadId}),D=!0);for(let C of e.activeJobIds)if(!w.has(C)&&!B.some(L=>L.jobId===C)){let L=e.events.find(k=>k.type==="job_started"&&k.data.jobId===C);B.push({jobId:C,color:"#888",status:"working",threadId:(M=L==null?void 0:L.data)==null?void 0:M.threadId}),D=!0}return D?B:h})},[t,e.activeJobIds]),Mo(()=>{if(e.activeJobIds.length===0)return;let h=new Set(e.activeJobIds);p(w=>w.map(D=>h.has(D.jobId)&&D.status!=="done"&&D.status!=="error"?m(f({},D),{status:"working"}):D))},[e.activeJobIds]);let x=Hu(null);if(Mo(()=>{let h=e.lastCompletedJobId;if(!h||h===x.current)return;x.current=h;let w=e.events.find(L=>L.type==="error"&&(L.data.jobId===h||e.status==="error")),D=!!w,B=D?void 0:Gu(e.events,h),M=w?String(w.data.message||""):void 0,C=w?!!w.data.cancelled:void 0;p(L=>L.map(k=>k.jobId===h?m(f({},k),{status:D?"error":"done",doneLabel:B,errorMessage:M,cancelled:C}):k))},[e.lastCompletedJobId,e.events,e.status]),!o||d.length===0&&a!==!1)return null;let E=!u&&d.length>1;return $o("div",{style:zu,"data-devtools":!0,onMouseEnter:()=>{g(!0),n(!0)},onMouseLeave:()=>{g(!1),n(!1),l==null||l(null)},children:[[...d].reverse().map((h,w)=>{var C;let D=w===d.length-1,B=d.length-1-w,M=h.status==="working"?ju(e.events.filter(L=>L.data.jobId===h.jobId)):h.status==="queued"?"Queued":h.status==="done"?h.doneLabel||"Done":h.cancelled?"Cancelled":(C=h.errorMessage)!=null&&C.includes("Timed out")?"Timed out":"Error";return Et("div",{style:{position:"relative",zIndex:w,marginBottom:E?D?0:-Wu:D?0:Yu,transform:E?`scale(${Math.max(.94,1-B*.02)})`:"scale(1)",opacity:E?Math.max(.5,1-B*.15):1,transformOrigin:"bottom right",transition:"margin-bottom 250ms ease, transform 250ms ease, opacity 250ms ease"},children:$o("div",{style:m(f({},Xl),{cursor:h.threadId&&i?"pointer":void 0}),onClick:h.threadId&&i?()=>i(h.threadId):void 0,onMouseEnter:l?()=>l(h.jobId):void 0,onMouseLeave:l?()=>l(null):void 0,title:h.errorMessage||void 0,children:[h.status==="working"&&Et(Vu,{color:h.color}),h.status==="queued"&&Et(Uu,{color:h.color}),h.status==="done"&&Et(Ju,{color:h.color}),h.status==="error"&&Et(Xu,{}),Et("span",{style:{color:h.status==="queued"?"#9ca3af":"#1f2937"},children:M}),h.status==="working"&&s&&Et("button",{onClick:L=>{L.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.status==="done"||h.status==="error")&&Et("button",{onClick:L=>{L.stopPropagation(),p(k=>k.filter(W=>W.jobId!==h.jobId))},style:{background:"none",border:"none",cursor:"pointer",color:"#9ca3af",fontSize:14,padding:"0 4px",lineHeight:1},title:"Dismiss",children:"\xD7"})]})},h.jobId)}),a===!1&&d.length>0&&$o("div",{style:m(f({},Xl),{color:"#9ca3af"}),children:[Et("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#f59e0b"}}),Et("span",{children:"Reconnecting\u2026"})]})]})}import{useCallback as wr,useEffect as Fn,useRef as Rn,useState as Qn}from"react";import{Fragment as ep,jsx as wt}from"react/jsx-runtime";var ql="ui-monospace, SFMono-Regular, Menlo, monospace",Ku=/^#[0-9a-fA-F]{3,8}$/,Zu=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,qu=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 Qu(e){let t=e.trim();return Ku.test(t)||Zu.test(t)||qu.has(t.toLowerCase())}function zi(e,t){return wt("span",{style:{display:"inline-block",width:10,height:10,backgroundColor:e,border:"1px solid rgba(0,0,0,0.15)",borderRadius:2,verticalAlign:"middle",marginRight:3}},t)}function Wo(e){let t=[],o=/(`[^`]+`)|(\*\*\*(.+?)\*\*\*)|(\*\*(.+?)\*\*)|(\*(.+?)\*)|(_([^_]+?)_)|(\[([^\]]+)\]\(([^)]+)\))|(#[0-9a-fA-F]{3,8})(?![0-9a-fA-F])|((?:rgba?|hsla?|oklch)\([^)]+\))/g,n=0,r;for(;(r=o.exec(e))!==null;){if(r.index>n&&t.push(e.slice(n,r.index)),r[1]){let i=r[1].slice(1,-1);Qu(i)&&t.push(zi(i,`sw-${r.index}`)),t.push(wt("code",{style:{fontFamily:ql,fontSize:"0.9em",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2},children:i},r.index))}else r[3]!==void 0?t.push(wt("strong",{children:wt("em",{children:r[3]})},r.index)):r[5]!==void 0?t.push(wt("strong",{children:r[5]},r.index)):r[7]!==void 0?t.push(wt("em",{children:r[7]},r.index)):r[9]!==void 0?t.push(wt("em",{children:r[9]},r.index)):r[11]!==void 0&&r[12]!==void 0?t.push(wt("a",{href:r[12],target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline"},children:r[11]},r.index)):r[13]!==void 0?(t.push(zi(r[13],`sw-${r.index}`)),t.push(r[13])):r[14]!==void 0&&(t.push(zi(r[14],`sw-${r.index}`)),t.push(r[14]));n=r.index+r[0].length}return n<e.length&&t.push(e.slice(n)),t}function Sr(e){var r;let t=e.split(`
+`).map((Q,pe)=>ne("p",{style:{margin:0,marginTop:pe>0?8:0},children:Q},pe))}),N.usage.map((Q,pe)=>xt("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[ne("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),ne("span",{children:Q})]},pe)),me==="collapse"&&w&&Object.keys(w).length>0&&(()=>{let Q=Object.entries(w).filter(([,Te])=>Te.found&&!Te.disabled).map(([Te])=>Te.charAt(0).toUpperCase()+Te.slice(1)),pe=Object.entries(w).filter(([,Te])=>!Te.found).map(([Te])=>Te);if(Q.length===0&&pe.length===0)return null;let Ae=pe.map(Te=>Te.charAt(0).toUpperCase()+Te.slice(1));return xt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8,display:"flex",alignItems:"center",gap:6,fontSize:11},children:[ne("span",{style:{width:6,height:6,borderRadius:"50%",backgroundColor:Q.length>0?"#22c55e":"rgba(0,0,0,0.2)",flexShrink:0}}),Q.length>0?xt("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[xt("span",{children:["Taste library ready in ",Q.join(", "),B&&" \u2014 restart CLI to activate"]}),pe.length>0&&D&&!B&&xt("button",{type:"button",onClick:Te=>{Te.stopPropagation(),D()},style:{border:"none",background:"transparent",color:"#3b82f6",fontSize:10,fontWeight:500,fontFamily:"inherit",padding:0,cursor:"pointer",pointerEvents:"auto",textDecoration:"underline",textUnderlineOffset:2},children:["+ ",Ae.join(", ")]})]}):pe.length>0&&D?xt("span",{style:{color:"#6b7280",display:"flex",alignItems:"center",gap:6},children:[ne("span",{children:"Connect Popmelt MCP"}),ne("button",{type:"button",onClick:Te=>{Te.stopPropagation(),D()},style:{border:"none",background:"#1f2937",color:"#fff",fontSize:10,fontWeight:600,fontFamily:"inherit",padding:"2px 8px",cursor:"pointer",pointerEvents:"auto"},children:"Connect"})]}):null]})})(),N.keys.length>1&&ne("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8,display:"flex",flexDirection:"column",gap:4},children:N.keys.slice(1).map((Q,pe)=>xt("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:Q.accent?"#fff":"#6b7280"},children:[ne("code",{style:{fontSize:10,backgroundColor:Q.accent?e.activeColor:"rgba(0,0,0,0.06)",color:Q.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:Q.key}),ne("span",{style:{color:Q.accent?e.activeColor:void 0,fontWeight:Q.accent?600:void 0},children:Q.desc})]},pe))})]})})(),xt("div",{id:"devtools-toolbar",style:Vt,onMouseEnter:le,onMouseMove:at,children:[(e.annotations.length>0||e.styleModifications.length>0)&&xt(Zn,{children:[ne("span",{onMouseEnter:()=>Re("clear"),onMouseLeave:ve,children:ne(Ln,{onClick:Kt,title:"Clear all (\u2318\u232B)",children:ne(Iu,{size:17,strokeWidth:1.5})})}),ne(Ai,{})]}),xt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[ne("span",{onMouseEnter:()=>Re("inspector"),onMouseLeave:ve,children:ne(Ln,{active:e.isAnnotating&&e.activeTool==="inspector",siblingActive:e.isAnnotating,onClick:()=>gt("inspector"),children:ne(Eu,{size:20,strokeWidth:1.5})})}),ne("span",{onMouseEnter:()=>Re("hand"),onMouseLeave:ve,children:ne(Ln,{active:e.isAnnotating&&e.activeTool==="hand",siblingActive:e.isAnnotating,onClick:()=>gt("hand"),children:xt("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[ne(ku,{size:20,strokeWidth:1.5}),e.styleModifications.filter(N=>!N.captured).length>0&&ne("div",{style:{position:"absolute",top:-7,right:-9,minWidth:14,height:14,borderRadius:0,backgroundColor:e.activeColor,color:"#fff",fontSize:9,fontWeight:700,display:"flex",alignItems:"center",justifyContent:"center",padding:"0 2px",lineHeight:1},children:e.styleModifications.filter(N=>!N.captured).length})]})})}),(()=>{let N=qn[Ie],Q=N.icon,pe=e.isAnnotating&&Ru.has(e.activeTool);return ne("span",{onMouseEnter:()=>Re(N.type),onMouseLeave:ve,children:xt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[ne(Ln,{active:pe,siblingActive:e.isAnnotating,onClick:()=>gt(N.type),children:ne(Q,{size:20,strokeWidth:1.5})}),ne("button",{type:"button",onClick:()=>{let Ae=(Ie+1)%qn.length;$e(Ae),gt(qn[Ae].type)},title:"Cycle shape tool",style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:2,width:12,height:32,border:"none",background:"none",cursor:"pointer",padding:"0 2px",opacity:e.isAnnotating&&!pe?.5:1,transition:"opacity 150ms ease"},children:qn.map((Ae,Te)=>ne("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:Te===Ie?In.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},Te))})]})})})(),Bu.map(({type:N,icon:Q,label:pe,shortcut:Ae})=>ne("span",{onMouseEnter:()=>Re(N),onMouseLeave:ve,children:ne(Ln,{active:e.isAnnotating&&e.activeTool===N,siblingActive:e.isAnnotating,onClick:()=>gt(N),children:ne(Q,{size:20,strokeWidth:1.5})})},N)),ne("span",{onMouseEnter:()=>Re("model"),onMouseLeave:ve,children:ne(Ln,{active:e.isAnnotating&&e.activeTool==="model",siblingActive:e.isAnnotating,onClick:()=>gt("model"),children:ne(wu,{size:17,strokeWidth:1.5})})})]}),ne(Ai,{}),xt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(nt.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(N=>!N.captured).length>0)&&(()=>{var Te;let N=vt!==null&&vt<nt.length?nt[vt]:null,Q=e.annotations.length>0&&e.annotations.every(v=>v.status&&v.status!=="pending"),pe=vt!==null?(Te=N==null?void 0:N.annotations.some(v=>v.status&&v.status!=="pending"))!=null?Te:!1:Q,Ae=`oklch(0.628 0.258 ${mt})`;return ne("span",{onMouseEnter:()=>Re("counter"),onMouseLeave:ve,children:ne("button",{ref:xn,type:"button",onClick:()=>{if(j.current){j.current=!1;return}An()},onMouseDown:Ee,onMouseUp:He,onMouseLeave:He,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:pe?"#999999":Ae,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:vt!==null?vt+1:nt.length+e.styleModifications.length+e.spacingTokenChanges.filter(v=>!v.captured).length})})})(),c&&ne("span",{onMouseEnter:()=>Re("provider"),onMouseLeave:ve,style:{display:"contents"},children:xt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[ne(Ln,{onClick:()=>c(a==="claude"?"codex":"claude"),children:a==="claude"?ne(Fu,{}):ne(Nu,{})}),xt("button",{type:"button",onClick:()=>{let N=(p+1)%u;x==null||x(N)},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:In.iconDefault,whiteSpace:"nowrap"},children:[ne("span",{children:g}),ne("span",{style:{display:"flex",flexDirection:"column",gap:2},children:Array.from({length:u},(N,Q)=>ne("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:Q===p?In.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},Q))})]})]})}),ne("div",{onMouseEnter:N=>{s==null||s(!0),N.currentTarget.style.opacity="1",Re("collapse")},onMouseLeave:N=>{s==null||s(!1),N.currentTarget.style.opacity=r?"1":"0.3",ve()},style:{display:"inline-flex",opacity:r?1:.3,transition:"opacity 150ms ease"},children:ne(Ln,{onClick:Pe,title:"Collapse (\u2318\u2318)",children:r?ne("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:an,children:We===1?xt(Zn,{children:[ne("circle",{cx:"7",cy:"7",r:"2"}),ne("circle",{cx:"17",cy:"7",r:"2"}),ne("circle",{cx:"7",cy:"17",r:"2"}),ne("circle",{cx:"17",cy:"17",r:"2"})]}):xt(Zn,{children:[ne("circle",{cx:"12",cy:"6",r:"2"}),ne("circle",{cx:"6",cy:"12",r:"2"}),ne("circle",{cx:"18",cy:"12",r:"2"}),ne("circle",{cx:"12",cy:"18",r:"2"})]})}):xt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:an,strokeWidth:"1.5",strokeLinecap:"round",style:{transform:"rotate(45deg)"},children:[ne("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),ne("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),ne("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),ne("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})]})]}):xt(Zn,{children:[ne("style",{children:"@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }"}),ne("div",{id:"devtools-toolbar",style:m(f({},Vt),{overflow:"visible",opacity:.5,transition:"opacity 150ms ease"}),onMouseEnter:N=>{N.currentTarget.style.opacity="1",le==null||le()},onMouseLeave:N=>N.currentTarget.style.opacity="0.5",children:ne("button",{type:"button",style:{display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,border:"none",background:"none",cursor:"pointer",padding:0},onClick:()=>{Fe(!0),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SET_ANNOTATING",payload:!0})},onMouseEnter:()=>s==null?void 0:s(!0),onMouseLeave:()=>s==null?void 0:s(!1),title:"Open annotation toolbar (\u2318\u2318)",children:r?ne("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:an,children:We===1?xt(Zn,{children:[ne("circle",{cx:"7",cy:"7",r:"2"}),ne("circle",{cx:"17",cy:"7",r:"2"}),ne("circle",{cx:"7",cy:"17",r:"2"}),ne("circle",{cx:"17",cy:"17",r:"2"})]}):xt(Zn,{children:[ne("circle",{cx:"12",cy:"6",r:"2"}),ne("circle",{cx:"6",cy:"12",r:"2"}),ne("circle",{cx:"18",cy:"12",r:"2"}),ne("circle",{cx:"12",cy:"18",r:"2"})]})}):xt("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:an,strokeWidth:"1.5",strokeLinecap:"round",children:[ne("line",{x1:"12",y1:"3",x2:"12",y2:"9"}),ne("line",{x1:"12",y1:"15",x2:"12",y2:"21"}),ne("line",{x1:"3",y1:"12",x2:"9",y2:"12"}),ne("line",{x1:"15",y1:"12",x2:"21",y2:"12"})]})})})]})}import{useEffect as Mo,useRef as Hu,useState as Hi}from"react";import{Fragment as Kl,jsx as Et,jsxs as $o}from"react/jsx-runtime";var zu={position:"fixed",bottom:86,right:16,zIndex:9999,display:"flex",flexDirection:"column"},_u=24,$u=6,Wu=_u-$u,Yu=8,Xl=m(f({display:"flex",alignItems:"center",gap:6,padding:"4px 10px",backgroundColor:"rgba(255, 255, 255, 0.85)"},gn),{backdropFilter:"blur(32px)",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,color:"#1f2937",whiteSpace:"nowrap",transition:"transform 200ms ease, opacity 200ms ease"});function ju(e){var s;let t=e.filter(l=>l.type==="tool_use");if(t.length===0)return"Starting\u2026";let o=t[t.length-1],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 Gu(e,t){if(e.some(r=>r.type==="question"&&r.data.jobId===t))return"Has a question";let n=e.find(r=>r.type==="done"&&r.data.jobId===t);if(n){let r=n.data.resolutions;if(Array.isArray(r)&&r.length>0)return"Applied changes"}return"Replied"}function Vu({color:e}){let[t,o]=Hi(0);return Mo(()=>{let n=setInterval(()=>{o(r=>(r+1)%2)},250);return()=>clearInterval(n)},[]),Et("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?$o(Kl,{children:[Et("circle",{cx:"7",cy:"7",r:"2"}),Et("circle",{cx:"17",cy:"7",r:"2"}),Et("circle",{cx:"7",cy:"17",r:"2"}),Et("circle",{cx:"17",cy:"17",r:"2"})]}):$o(Kl,{children:[Et("circle",{cx:"12",cy:"6",r:"2"}),Et("circle",{cx:"6",cy:"12",r:"2"}),Et("circle",{cx:"18",cy:"12",r:"2"}),Et("circle",{cx:"12",cy:"18",r:"2"})]})})}function Uu({color:e}){return Et("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:e,opacity:.6}})}function Ju({color:e}){return Et("span",{style:{color:e,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function Xu(){return Et("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function Zl({bridge:e,inFlightJobs:t,isVisible:o,onHover:n,clearSignal:r,onViewThread:i,onCancel:s,onHoverJob:l,isConnected:a,dismissedThreadIds:c}){let[d,p]=Hi([]),[u,g]=Hi(!1);Mo(()=>{r>0&&p([])},[r]),Mo(()=>{!c||c.size===0||p(h=>{let w=h.filter(D=>!D.threadId||!c.has(D.threadId));return w.length===h.length?h:w})},[c]),Mo(()=>{p(h=>{var M;let w=new Set(h.map(C=>C.jobId)),D=!1,B=h.map(C=>{let L=t[C.jobId];return L&&(!C.threadId||C.color==="#888")?(D=!0,m(f({},C),{threadId:C.threadId||L.threadId,color:C.color==="#888"?L.color:C.color})):C});for(let[C,L]of Object.entries(t))w.has(C)||(B.push({jobId:C,color:L.color,status:"queued",threadId:L.threadId}),D=!0);for(let C of e.activeJobIds)if(!w.has(C)&&!B.some(L=>L.jobId===C)){let L=e.events.find(k=>k.type==="job_started"&&k.data.jobId===C);B.push({jobId:C,color:"#888",status:"working",threadId:(M=L==null?void 0:L.data)==null?void 0:M.threadId}),D=!0}return D?B:h})},[t,e.activeJobIds]),Mo(()=>{if(e.activeJobIds.length===0)return;let h=new Set(e.activeJobIds);p(w=>w.map(D=>h.has(D.jobId)&&D.status!=="done"&&D.status!=="error"?m(f({},D),{status:"working"}):D))},[e.activeJobIds]);let x=Hu(null);if(Mo(()=>{let h=e.lastCompletedJobId;if(!h||h===x.current)return;x.current=h;let w=e.events.find(L=>L.type==="error"&&(L.data.jobId===h||e.status==="error")),D=!!w,B=D?void 0:Gu(e.events,h),M=w?String(w.data.message||""):void 0,C=w?!!w.data.cancelled:void 0;p(L=>L.map(k=>k.jobId===h?m(f({},k),{status:D?"error":"done",doneLabel:B,errorMessage:M,cancelled:C}):k))},[e.lastCompletedJobId,e.events,e.status]),!o||d.length===0&&a!==!1)return null;let E=!u&&d.length>1;return $o("div",{style:zu,"data-devtools":!0,onMouseEnter:()=>{g(!0),n(!0)},onMouseLeave:()=>{g(!1),n(!1),l==null||l(null)},children:[[...d].reverse().map((h,w)=>{var C;let D=w===d.length-1,B=d.length-1-w,M=h.status==="working"?ju(e.events.filter(L=>L.data.jobId===h.jobId)):h.status==="queued"?"Queued":h.status==="done"?h.doneLabel||"Done":h.cancelled?"Cancelled":(C=h.errorMessage)!=null&&C.includes("Timed out")?"Timed out":"Error";return Et("div",{style:{position:"relative",zIndex:w,marginBottom:E?D?0:-Wu:D?0:Yu,transform:E?`scale(${Math.max(.94,1-B*.02)})`:"scale(1)",opacity:E?Math.max(.5,1-B*.15):1,transformOrigin:"bottom right",transition:"margin-bottom 250ms ease, transform 250ms ease, opacity 250ms ease"},children:$o("div",{style:m(f({},Xl),{cursor:h.threadId&&i?"pointer":void 0}),onClick:h.threadId&&i?()=>i(h.threadId):void 0,onMouseEnter:l?()=>l(h.jobId):void 0,onMouseLeave:l?()=>l(null):void 0,title:h.errorMessage||void 0,children:[h.status==="working"&&Et(Vu,{color:h.color}),h.status==="queued"&&Et(Uu,{color:h.color}),h.status==="done"&&Et(Ju,{color:h.color}),h.status==="error"&&Et(Xu,{}),Et("span",{style:{color:h.status==="queued"?"#9ca3af":"#1f2937"},children:M}),h.status==="working"&&s&&Et("button",{onClick:L=>{L.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.status==="done"||h.status==="error")&&Et("button",{onClick:L=>{L.stopPropagation(),p(k=>k.filter(W=>W.jobId!==h.jobId))},style:{background:"none",border:"none",cursor:"pointer",color:"#9ca3af",fontSize:14,padding:"0 4px",lineHeight:1},title:"Dismiss",children:"\xD7"})]})},h.jobId)}),a===!1&&d.length>0&&$o("div",{style:m(f({},Xl),{color:"#9ca3af"}),children:[Et("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#f59e0b"}}),Et("span",{children:"Reconnecting\u2026"})]})]})}import{useCallback as wr,useEffect as Fn,useRef as Rn,useState as Qn}from"react";import{Fragment as ep,jsx as wt}from"react/jsx-runtime";var ql="ui-monospace, SFMono-Regular, Menlo, monospace",Ku=/^#[0-9a-fA-F]{3,8}$/,Zu=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,qu=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 Qu(e){let t=e.trim();return Ku.test(t)||Zu.test(t)||qu.has(t.toLowerCase())}function zi(e,t){return wt("span",{style:{display:"inline-block",width:10,height:10,backgroundColor:e,border:"1px solid rgba(0,0,0,0.15)",borderRadius:2,verticalAlign:"middle",marginRight:3}},t)}function Wo(e){let t=[],o=/(`[^`]+`)|(\*\*\*(.+?)\*\*\*)|(\*\*(.+?)\*\*)|(\*(.+?)\*)|(_([^_]+?)_)|(\[([^\]]+)\]\(([^)]+)\))|(#[0-9a-fA-F]{3,8})(?![0-9a-fA-F])|((?:rgba?|hsla?|oklch)\([^)]+\))/g,n=0,r;for(;(r=o.exec(e))!==null;){if(r.index>n&&t.push(e.slice(n,r.index)),r[1]){let i=r[1].slice(1,-1);Qu(i)&&t.push(zi(i,`sw-${r.index}`)),t.push(wt("code",{style:{fontFamily:ql,fontSize:"0.9em",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2},children:i},r.index))}else r[3]!==void 0?t.push(wt("strong",{children:wt("em",{children:r[3]})},r.index)):r[5]!==void 0?t.push(wt("strong",{children:r[5]},r.index)):r[7]!==void 0?t.push(wt("em",{children:r[7]},r.index)):r[9]!==void 0?t.push(wt("em",{children:r[9]},r.index)):r[11]!==void 0&&r[12]!==void 0?t.push(wt("a",{href:r[12],target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline"},children:r[11]},r.index)):r[13]!==void 0?(t.push(zi(r[13],`sw-${r.index}`)),t.push(r[13])):r[14]!==void 0&&(t.push(zi(r[14],`sw-${r.index}`)),t.push(r[14]));n=r.index+r[0].length}return n<e.length&&t.push(e.slice(n)),t}function Sr(e){var r;let t=e.split(`
 `),o=[],n=0;for(;n<t.length;){let i=t[n];if(i.trimStart().startsWith("```")){let c=[];for(n++;n<t.length&&!t[n].trimStart().startsWith("```");)c.push(t[n]),n++;n++,o.push(wt("pre",{style:{fontFamily:ql,fontSize:"0.9em",lineHeight:1.4,backgroundColor:"rgba(0,0,0,0.04)",padding:"6px 8px",margin:"4px 0",overflowX:"auto",whiteSpace:"pre"},children:c.join(`
-`)},o.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(i)){o.push(wt("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(wt("div",{style:{fontWeight:700,fontSize:(r=d[c])!=null?r:12,margin:"8px 0 2px"},children:Wo(s[2])},o.length)),n++;continue}if(i.trimStart().startsWith("|")&&i.trimEnd().endsWith("|")){let c=[];for(;n<t.length&&t[n].trimStart().startsWith("|")&&t[n].trimEnd().endsWith("|");)c.push(t[n]),n++;let d=w=>/^\|[\s\-:|]+\|$/.test(w),p=c.filter(w=>!d(w)),u=w=>w.split("|").slice(1,-1).map(D=>D.trim()),g=w=>/^\*\*.+\*\*$/.test(w)||/^__.+__$/.test(w),x=p.map(u),E=x.length>1&&x.slice(1).every(w=>w[0]&&g(w[0])),h=x.length>0&&x[0].every(w=>g(w));o.push(wt("div",{style:{overflowX:"auto",margin:"4px 0",paddingBottom:4},children:wt("table",{style:{borderCollapse:"separate",borderSpacing:0,fontSize:"0.95em",width:"max-content",minWidth:"100%"},children:wt("tbody",{children:p.map((w,D)=>wt("tr",{children:u(w).map((B,M)=>wt(D===0?"th":"td",{style:f({border:"1px solid rgba(0,0,0,0.1)",padding:"3px 6px",textAlign:"left",fontWeight:D===0?600:400,minWidth:60,whiteSpace:"nowrap"},M===0&&E||D===0&&h?m(f(f({position:"sticky"},M===0&&E?{left:0}:{}),D===0&&h?{top:0}:{}),{background:"#fff",zIndex:M===0&&E&&D===0&&h?2:1}):{}),children:Wo(B)},M))},D))})})},o.length));continue}if(i.match(/^(\s*)([-*])\s+(.+)/)){let c=[];for(;n<t.length&&/^\s*[-*]\s+/.test(t[n]);){let d=t[n].match(/^\s*[-*]\s+(.+)/);d&&c.push(wt("li",{children:Wo(d[1])},c.length)),n++}o.push(wt("ul",{style:{margin:"2px 0",paddingLeft:20},children:c},o.length));continue}if(i.match(/^(\s*)\d+\.\s+(.+)/)){let c=[];for(;n<t.length&&/^\s*\d+\.\s+/.test(t[n]);){let d=t[n].match(/^\s*\d+\.\s+(.+)/);d&&c.push(wt("li",{children:Wo(d[1])},c.length)),n++}o.push(wt("ol",{style:{margin:"2px 0",paddingLeft:20},children:c},o.length));continue}if(i.trim()===""){o.push(wt("div",{style:{height:4}},o.length)),n++;continue}o.push(wt("div",{style:{margin:"2px 0"},children:Wo(i)},o.length)),n++}return wt(ep,{children:o})}import{Fragment as Yi,jsx as _e,jsxs as Bt}from"react/jsx-runtime";var kr=400,To=16,ji=3,tp=16,_i="devtools-thread-panel-position";function $i(){return{top:To,left:window.innerWidth-kr-2*ji-To}}function Ql(e,t){let o=document.getElementById("devtools-toolbar"),n=o==null?void 0:o.getBoundingClientRect(),r=window.innerHeight-To;return n&&t+kr+2*ji>n.left&&(r=n.top-tp),Math.max(200,r-Math.max(0,e))}var np=m(f({width:kr,backgroundColor:"#ffffff"},mn),{boxSizing:"content-box",display:"flex",flexDirection:"column",overflow:"hidden",fontFamily:Dt,fontSize:12,color:"#1f2937",pointerEvents:"auto"}),op={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"4px 5px 4px 10px",margin:"3px 3px 0",fontWeight:600,fontSize:12},rp={flex:1,overflowY:"auto",padding:"8px 0",scrollbarWidth:"none"},ip=`
+`)},o.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(i)){o.push(wt("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(wt("div",{style:{fontWeight:700,fontSize:(r=d[c])!=null?r:12,margin:"8px 0 2px"},children:Wo(s[2])},o.length)),n++;continue}if(i.trimStart().startsWith("|")&&i.trimEnd().endsWith("|")){let c=[];for(;n<t.length&&t[n].trimStart().startsWith("|")&&t[n].trimEnd().endsWith("|");)c.push(t[n]),n++;let d=w=>/^\|[\s\-:|]+\|$/.test(w),p=c.filter(w=>!d(w)),u=w=>w.split("|").slice(1,-1).map(D=>D.trim()),g=w=>/^\*\*.+\*\*$/.test(w)||/^__.+__$/.test(w),x=p.map(u),E=x.length>1&&x.slice(1).every(w=>w[0]&&g(w[0])),h=x.length>0&&x[0].every(w=>g(w));o.push(wt("div",{style:{overflowX:"auto",margin:"4px 0",paddingBottom:4},children:wt("table",{style:{borderCollapse:"separate",borderSpacing:0,fontSize:"0.95em",width:"max-content",minWidth:"100%"},children:wt("tbody",{children:p.map((w,D)=>wt("tr",{children:u(w).map((B,M)=>wt(D===0?"th":"td",{style:f({border:"1px solid rgba(0,0,0,0.1)",padding:"3px 6px",textAlign:"left",fontWeight:D===0?600:400,minWidth:60,whiteSpace:"nowrap"},M===0&&E||D===0&&h?m(f(f({position:"sticky"},M===0&&E?{left:0}:{}),D===0&&h?{top:0}:{}),{background:"#fff",zIndex:M===0&&E&&D===0&&h?2:1}):{}),children:Wo(B)},M))},D))})})},o.length));continue}if(i.match(/^(\s*)([-*])\s+(.+)/)){let c=[];for(;n<t.length&&/^\s*[-*]\s+/.test(t[n]);){let d=t[n].match(/^\s*[-*]\s+(.+)/);d&&c.push(wt("li",{children:Wo(d[1])},c.length)),n++}o.push(wt("ul",{style:{margin:"2px 0",paddingLeft:20},children:c},o.length));continue}if(i.match(/^(\s*)\d+\.\s+(.+)/)){let c=[];for(;n<t.length&&/^\s*\d+\.\s+/.test(t[n]);){let d=t[n].match(/^\s*\d+\.\s+(.+)/);d&&c.push(wt("li",{children:Wo(d[1])},c.length)),n++}o.push(wt("ol",{style:{margin:"2px 0",paddingLeft:20},children:c},o.length));continue}if(i.trim()===""){o.push(wt("div",{style:{height:4}},o.length)),n++;continue}o.push(wt("div",{style:{margin:"2px 0"},children:Wo(i)},o.length)),n++}return wt(ep,{children:o})}import{Fragment as Yi,jsx as _e,jsxs as Bt}from"react/jsx-runtime";var kr=400,To=16,ji=3,tp=16,_i="devtools-thread-panel-position";function $i(){return{top:To,left:window.innerWidth-kr-2*ji-To}}function Ql(e,t){let o=document.getElementById("devtools-toolbar"),n=o==null?void 0:o.getBoundingClientRect(),r=window.innerHeight-To;return n&&t+kr+2*ji>n.left&&(r=n.top-tp),Math.max(200,r-Math.max(0,e))}var np=m(f({width:kr,backgroundColor:"#ffffff"},gn),{boxSizing:"content-box",display:"flex",flexDirection:"column",overflow:"hidden",fontFamily:Ft,fontSize:12,color:"#1f2937",pointerEvents:"auto"}),op={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"4px 5px 4px 10px",margin:"3px 3px 0",fontWeight:600,fontSize:12},rp={flex:1,overflowY:"auto",padding:"8px 0",scrollbarWidth:"none"},ip=`
 [data-devtools="thread-panel-messages"]:hover {
   scrollbar-width: thin !important;
 }
@@ -29,4 +29,4 @@ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{
   background: rgba(0,0,0,0.15);
   border-radius: 3px;
 }
-`,sp={borderTop:"1px solid rgba(0, 0, 0, 0.08)",padding:12};function ea(e){return e.replace(/<resolution>[\s\S]*?<\/resolution>/g,"").replace(/<question>[\s\S]*?<\/question>/g,"").replace(/<plan>[\s\S]*?<\/plan>/g,"").replace(/<review>[\s\S]*?<\/review>/g,"").trim()}function ta(e){return new Date(e).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var Wi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],lp=3e3,ap=250;function na({size:e=14}){return _e("svg",{width:e,height:e,viewBox:"0 0 1200 1200",fill:"#6b7280",stroke:"none",style:{flexShrink:0},children:_e("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 cp({color:e}){let[t,o]=Qn(0),[n,r]=Qn(()=>Math.floor(Math.random()*Wi.length));return Fn(()=>{let i=setInterval(()=>o(l=>(l+1)%2),ap),s=setInterval(()=>r(l=>(l+1)%Wi.length),lp);return()=>{clearInterval(i),clearInterval(s)}},[]),Bt("span",{style:{display:"inline-flex",alignItems:"center",gap:4},children:[_e("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?Bt(Yi,{children:[_e("circle",{cx:"7",cy:"7",r:"2"}),_e("circle",{cx:"17",cy:"7",r:"2"}),_e("circle",{cx:"7",cy:"17",r:"2"}),_e("circle",{cx:"17",cy:"17",r:"2"})]}):Bt(Yi,{children:[_e("circle",{cx:"12",cy:"6",r:"2"}),_e("circle",{cx:"6",cy:"12",r:"2"}),_e("circle",{cx:"18",cy:"12",r:"2"}),_e("circle",{cx:"12",cy:"18",r:"2"})]})}),_e("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:Wi[n]})]})}function dp(e){var r;let t=String(e.data.tool||""),o=e.data.file?String(e.data.file):null,n=o?(r=o.split("/").pop())!=null?r:o:null;switch(t){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 t?`Using ${t}`:null}}var up=new Set(["Read","Glob","Grep","WebFetch","WebSearch"]),pp=new Set(["Edit","Write","Bash"]);function fp(e){let t=0,o=!1;for(let n of e){if(n.type!=="tool_use")continue;let r=String(n.data.tool||"");pp.has(r)?o=!0:up.has(r)&&t++}return!o&&t>=3?"researching":o?"applying changes":null}function gp(e){let t=[];for(let o of e)if(o.type==="tool_use"){let n=dp(o);n&&t.push({kind:"tool",label:n})}else if(o.type==="delta"){let n=String(o.data.text||"");if(!n)continue;let r=t[t.length-1];r&&r.kind==="text"?r.text+=n:t.push({kind:"text",text:n})}else if(o.type==="thinking"){let n=String(o.data.text||"");if(!n)continue;let r=t[t.length-1];r&&r.kind==="thinking"?r.text+=n:t.push({kind:"thinking",text:n})}return t}function oa({threadId:e,bridgeUrl:t,accentColor:o,isStreaming:n,streamingEvents:r,onClose:i,onReply:s,onCancel:l,lastError:a,onMouseEnter:c}){let[d,p]=Qn([]),[u,g]=Qn(!0),[x,E]=Qn(""),[h,w]=Qn([]),D=Rn(null),B=Rn(null),M=Rn(null),C=Rn(n),L=Rn($i()),k=Rn({x:0,y:0}),W=Rn(!1),ee=Rn({x:0,y:0,offsetX:0,offsetY:0}),Z=Rn(!1),[,F]=Qn(0);Fn(()=>{try{let V=localStorage.getItem(_i);if(V){let te=JSON.parse(V);typeof te.top=="number"&&typeof te.left=="number"&&(Z.current=!0,L.current={top:te.top,left:te.left},F(fe=>fe+1))}}catch(V){}},[]),Fn(()=>{let V=()=>{Z.current||(L.current=$i()),F(te=>te+1)};return window.addEventListener("resize",V,{passive:!0}),()=>window.removeEventListener("resize",V)},[]),Fn(()=>{let V=M.current;if(!V)return;let te=ue=>{ue.button!==0||ue.target.closest("button")||(ue.preventDefault(),ue.stopPropagation(),W.current=!0,ee.current={x:ue.clientX,y:ue.clientY,offsetX:k.current.x,offsetY:k.current.y})},fe=ue=>{if(!W.current)return;let We=ee.current,me=We.offsetX+(ue.clientX-We.x),lt=We.offsetY+(ue.clientY-We.y),qe=Math.max(To,Math.min(window.innerWidth-kr-2*ji-To,L.current.left+me)),Oe=Math.max(To,L.current.top+lt);k.current={x:qe-L.current.left,y:Oe-L.current.top};let tt=B.current;tt&&(tt.style.top=`${Oe}px`,tt.style.left=`${qe}px`,tt.style.height=`${Ql(Oe,qe)}px`)},Ce=()=>{if(!W.current)return;let ue=L.current.top+k.current.y,We=L.current.left+k.current.x;L.current={top:ue,left:We},k.current={x:0,y:0},Z.current=!0;try{localStorage.setItem(_i,JSON.stringify({top:ue,left:We}))}catch(me){}W.current=!1},ge=()=>{L.current=$i(),k.current={x:0,y:0},Z.current=!1;try{localStorage.removeItem(_i)}catch(ue){}F(ue=>ue+1)};return V.addEventListener("mousedown",te),window.addEventListener("mousemove",fe),window.addEventListener("mouseup",Ce),V.addEventListener("dblclick",ge),()=>{V.removeEventListener("mousedown",te),window.removeEventListener("mousemove",fe),window.removeEventListener("mouseup",Ce),V.removeEventListener("dblclick",ge)}},[]);let K=wr(()=>{fetch(`${t}/thread/${e}`).then(V=>V.json()).then(V=>{var te;p((te=V.messages)!=null?te:[]),g(!1)}).catch(()=>g(!1))},[t,e]);Fn(()=>{g(!0),K()},[K]),Fn(()=>{C.current&&!n&&K(),C.current=n},[n,K]);let q=r?gp(r):[],we=r?fp(r):null;Fn(()=>{D.current&&(D.current.scrollTop=D.current.scrollHeight)},[d,q.length,n]),Fn(()=>{let V=te=>{te.key==="Escape"&&(te.stopPropagation(),i())};return document.addEventListener("keydown",V),()=>document.removeEventListener("keydown",V)},[i]);let le=wr(()=>{if(!x.trim()||!s)return;let V=x.trim(),te=h.length>0?h:void 0;p(fe=>[...fe,{role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:te?`${V} [${te.length} image${te.length>1?"s":""}]`:V}]),s(e,V,te),E(""),w([])},[x,h,e,s]),he=wr(V=>{let te=V.clipboardData.items,fe=[];for(let Ce=0;Ce<te.length;Ce++){let ge=te[Ce];if(ge.type.startsWith("image/")){let ue=ge.getAsFile();ue&&fe.push(ue)}}fe.length>0&&(V.preventDefault(),w(Ce=>[...Ce,...fe]))},[]),Ne=wr(V=>{V.key==="Enter"&&(V.metaKey||V.ctrlKey)&&(V.preventDefault(),le())},[le]),Ie=L.current.top+k.current.y,$e=L.current.left+k.current.x,U=Ql(Ie,$e);return Bt(Yi,{children:[_e("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:V=>{V.target===V.currentTarget&&i()},style:{position:"fixed",inset:0,zIndex:9999}}),Bt("div",{ref:B,style:m(f({},np),{height:U,position:"fixed",top:Ie,left:$e,zIndex:1e4}),"data-devtools":"thread-panel",onMouseEnter:c,children:[Bt("div",{ref:M,style:m(f({},op),{backgroundColor:o,color:"#ffffff",cursor:"grab",userSelect:"none",WebkitUserSelect:"none"}),children:[_e("span",{children:"Conversation"}),_e("button",{onClick:i,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),_e("style",{dangerouslySetInnerHTML:{__html:ip}}),Bt("div",{ref:D,style:rp,"data-devtools":"thread-panel-messages",children:[u&&_e("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!u&&d.length===0&&!n&&_e("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),d.map((V,te)=>{let fe=V.role==="human";if(V.cancelled)return _e("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:te===d.length-1?1:.5},children:Bt("div",{style:{display:"flex",alignItems:"center",gap:4},children:[_e("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:"Cancelled"}),_e("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:ta(V.timestamp)})]})},`${V.jobId}-${te}`);let Ce=fe?V.replyToQuestion||V.feedbackSummary||"(annotation)":ea(V.responseText||""),ge=fe?void 0:V.question,ue=!fe&&V.resolutions&&V.resolutions.length>0,We=!fe&&V.toolsUsed&&V.toolsUsed.length>0;if(!Ce&&!ge&&!ue)return null;let me=te===d.length-1;return Bt("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:me?1:.5},children:[Bt("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[!fe&&_e(na,{size:11}),_e("span",{style:{fontWeight:600,fontSize:11,color:fe?o:"#6b7280"},children:fe?"You":"Claude Code"}),_e("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:ta(V.timestamp)})]}),Ce&&_e("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:fe?Ce:Sr(Ce)}),ge&&_e("div",{style:{marginTop:Ce?4:0,lineHeight:1.5,wordBreak:"break-word"},children:Sr(ge)}),(We||ue)&&Bt("div",{style:{marginTop:Ce||ge?6:0,padding:"4px 8px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#6b7280"},children:[We&&_e("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:V.toolsUsed.map((lt,qe)=>_e("div",{children:lt},qe))}),ue&&V.resolutions.map((lt,qe)=>{var A;let Oe=(A=lt.finalScope)!=null?A:lt.inferredScope,tt=Oe?`${Oe.breadth} \xB7 ${Oe.target}`:null;return Bt("div",{style:{marginTop:We?4:0},children:[_e("span",{style:{color:lt.status==="resolved"?"#10b981":"#f59e0b"},children:lt.status==="resolved"?"Done":"Needs review"}),tt&&_e("span",{style:{marginLeft:6,padding:"1px 5px",backgroundColor:"rgba(0, 0, 0, 0.06)",fontSize:10,fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace"},children:tt}),lt.summary?` \u2014 ${lt.summary}`:""]},qe)})]})]},`${V.jobId}-${te}`)}),n&&Bt("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[Bt("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[_e(na,{size:11}),_e("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:"Claude Code"}),we&&_e("span",{style:{fontSize:10,color:"#b0b7c3",fontStyle:"italic"},children:we}),Bt("span",{style:{marginLeft:"auto",display:"flex",alignItems:"center",gap:6},children:[_e(cp,{color:o}),l&&_e("button",{onClick:l,style:{background:"none",border:"1px solid rgba(0,0,0,0.1)",color:"#6b7280",fontSize:10,padding:"2px 8px",cursor:"pointer",fontFamily:"inherit"},children:"Cancel"})]})]}),q.map((V,te)=>{if(V.kind==="tool")return _e("div",{style:{paddingLeft:12,fontSize:11,color:"#9ca3af",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",lineHeight:1.6},children:V.label},te);if(V.kind==="thinking")return _e("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:V.text},te);let fe=ea(V.text);return fe?_e("div",{style:{paddingLeft:12,marginTop:2,marginBottom:2,lineHeight:1.5,wordBreak:"break-word"},children:Sr(fe)},te):null})]})]}),!n&&a&&Bt("div",{style:{padding:"8px 16px",backgroundColor:"rgba(239, 68, 68, 0.06)",borderBottom:"1px solid rgba(0,0,0,0.04)",fontSize:11,color:"#dc2626",lineHeight:1.4},children:[_e("span",{style:{fontWeight:600},children:"Error: "}),a]}),s&&Bt("div",{style:sp,children:[h.length>0&&Bt("div",{style:{fontSize:11,color:"#6b7280",marginBottom:4,display:"flex",alignItems:"center",gap:4},children:[Bt("span",{children:[h.length," image",h.length>1?"s":""," attached"]}),_e("button",{onClick:()=>w([]),style:{background:"none",border:"none",cursor:"pointer",fontSize:11,color:"#9ca3af",padding:"0 2px"},children:"\xD7"})]}),_e("textarea",{value:x,onChange:V=>E(V.target.value),onKeyDown:Ne,onPaste:he,placeholder:"Reply... (Cmd+Enter to send)",style:{width:"100%",minHeight:60,padding:4,fontSize:12,fontFamily:Dt,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"}}),_e("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:6},children:_e("button",{onClick:le,disabled:!x.trim(),style:{padding:"5px 14px",fontSize:11,fontFamily:Dt,fontWeight:600,backgroundColor:x.trim()?o:"rgba(0,0,0,0.1)",color:x.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:x.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}import{Fragment as vp,jsx as Yo,jsxs as Sp}from"react/jsx-runtime";var ra=mp(null),Gi="devtools-provider",Vi="devtools-model",Ui="devtools-open-thread-id",Ji=[{id:"claude-opus-4-6",label:"Opus 4.6"},{id:"claude-sonnet-4-6",label:"Sonn 4.6"}],Xi=[{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 yp(e,t,o){let n=e==="codex"?Xi:Ji;return Math.min(o,(t==="codex"?Xi:Ji).length-1)}function bp({children:e,enabled:t=process.env.NODE_ENV==="development",bridgeUrl:o="http://localhost:1111"}){var cn,N,Q,pe,Re,Te;let[n,r]=Bs(),i=As(o),s=(cn=Ls())!=null?cn:o,l=ln(new Map),[a,c]=$t(()=>typeof window=="undefined"?"claude":localStorage.getItem(Gi)||"claude"),[d,p]=$t(()=>{if(typeof window=="undefined")return 0;let S=localStorage.getItem(Vi);return S&&parseInt(S,10)||0}),[u,g]=$t(["claude","codex"]),[x,E]=$t({}),[h,w]=$t(!1);Ht(()=>{i.isConnected&&hs(s).then(S=>{if(!S)return;let J=Object.entries(S.providers).filter(([,ye])=>ye.available).map(([ye])=>ye);J.length>0&&g(J);let oe={};for(let[ye,et]of Object.entries(S.providers))et.mcp&&(oe[ye]=et.mcp);E(oe),Object.values(oe).every(ye=>ye.found)&&w(!1)})},[i.isConnected,i.capabilitiesVersion,s]),Ht(()=>{if(u.length>0&&!u.includes(a)){let S=u[0];c(S),localStorage.setItem(Gi,S)}},[u,a]);let D=a==="codex"?Xi:Ji,B=(N=D[d])!=null?N:D[0],M=Ot(S=>{let J=a;c(S),localStorage.setItem(Gi,S);let oe=yp(J,S,d);p(oe),localStorage.setItem(Vi,String(oe))},[a,d]),C=Ot(S=>{p(S),localStorage.setItem(Vi,String(S))},[]),L=Ot(async()=>{let S=await xs(s);if(!S)return;let J={};for(let[oe,Pe]of Object.entries(S.capabilities.providers))Pe.mcp&&(J[oe]=Pe.mcp);E(J),S.results.some(oe=>oe.installed)&&w(!0)},[s]),[k,W]=$t(new Set),[ee,Z]=$t(null),[F,K]=$t(null),[q,we]=$t(null),[le,he]=$t(null);Ht(()=>{i.isConnected&&no(s).then(S=>{S!=null&&S.components&&W(new Set(Object.keys(S.components)))})},[i.isConnected,s]);let Ne=Ot(async S=>{let J=[];for(let oe of S)try{(await vs(oe,s)).added&&J.push(oe)}catch(Pe){console.error("[Popmelt] Failed to add component to model:",oe,Pe)}J.length>0&&(W(oe=>{let Pe=new Set(oe);for(let ye of J)Pe.add(ye);return Pe}),Z(J[J.length-1]))},[s]),Ie=Ot(S=>{Z(S)},[]),$e=Ot(()=>{no(s).then(S=>{S!=null&&S.components&&W(new Set(Object.keys(S.components)))})},[s]),U=Ot(async S=>{try{(await Ss(S,s)).removed&&W(oe=>{let Pe=new Set(oe);return Pe.delete(S),Pe})}catch(J){console.error("[Popmelt] Failed to remove component from model:",J)}},[s]),V=Ot((S,J)=>{r({type:"MODIFY_SPACING_TOKEN",payload:S}),r({type:"ADD_SPACING_TOKEN_CHANGE",payload:J})},[r]),te=Ot((S,J)=>{r({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:S,originalValue:J}})},[r]),[fe,Ce]=$t(0),ge=ln([]);Ht(()=>{let S=ge.current,J=n.spacingTokenMods;ge.current=J;let oe=new Map(S.map(et=>[et.tokenPath,et])),Pe=new Map(J.map(et=>[et.tokenPath,et])),ye=!1;for(let[et,je]of Pe){let Me=oe.get(et);if(!(Me&&Me.currentValue===je.currentValue)){ye=!0,je.currentValue==="__deleted__"?ws(et,s).catch(Ye=>console.error("[Popmelt] Failed to sync token delete:",Ye)):Ir(et,je.currentValue,s).catch(Ye=>console.error("[Popmelt] Failed to sync token update:",Ye));for(let Ye of je.targets){let Ke=document.querySelector(Ye.selector);if(Ke)if(je.currentValue==="__deleted__")Ke.style.removeProperty(Ye.property);else{let Lt=je.currentPx;Lt>0&&Ke.style.setProperty(Ye.property,`${Lt}px`,"important")}}}}for(let[et,je]of oe)if(!Pe.has(et)){ye=!0,Ir(et,je.originalValue,s).catch(Me=>console.error("[Popmelt] Failed to restore token on undo:",Me));for(let Me of je.targets){let Ye=document.querySelector(Me.selector);Ye&&Ye.style.removeProperty(Me.property)}}ye&&Ce(et=>et+1)},[n.spacingTokenMods,s]);let[ue,We]=$t(()=>typeof window=="undefined"?null:localStorage.getItem(Ui)||null),[me,lt]=$t(new Set),[qe,Oe]=$t(null);Ht(()=>{ue?localStorage.setItem(Ui,ue):localStorage.removeItem(Ui)},[ue]);let tt="popmelt-in-flight-jobs",[A,re]=$t(()=>{try{let S=sessionStorage.getItem(tt);return S?JSON.parse(S):{}}catch(S){return{}}});Ht(()=>{try{Object.keys(A).length>0?sessionStorage.setItem(tt,JSON.stringify(A)):sessionStorage.removeItem(tt)}catch(S){}},[A]);let de=ln(!1);Ht(()=>{if(de.current||n.annotations.length===0)return;de.current=!0;let S=new Set;for(let oe of Object.values(A))for(let Pe of oe.annotationIds)S.add(Pe);let J=n.annotations.filter(oe=>S.has(oe.id)?!1:!!(oe.status==="in_flight"||(oe.status==="pending"||!oe.status)&&(oe.captured||oe.threadId))).map(oe=>oe.id);J.length>0&&r({type:"SET_ANNOTATION_STATUS",payload:{ids:J,status:"dismissed"}})},[n.annotations,A,r]);let Ae=Io(()=>{let S=new Set;for(let J of Object.values(A))for(let oe of J.annotationIds)S.add(oe);return S},[A]),ke=Io(()=>{let S=new Set;for(let J of Object.values(A))for(let oe of J.styleSelectors)S.add(oe);return S},[A]),Le=Io(()=>{let S=new Map;for(let J of Object.values(A)){for(let oe of J.styleSelectors)S.set(oe,J.color);for(let oe of J.annotationIds){let Pe=n.annotations.find(ye=>ye.id===oe);if(Pe&&(Pe.linkedSelector&&S.set(Pe.linkedSelector,J.color),Pe.groupId))for(let ye of n.annotations)ye.groupId===Pe.groupId&&ye.linkedSelector&&S.set(ye.linkedSelector,J.color)}}return S},[A,n.annotations]),xe=ln(n.annotations);xe.current=n.annotations;let at=ln(n.styleModifications);at.current=n.styleModifications;let Qe=ln(A);Qe.current=A,Ht(()=>{let S=null,J=()=>{var Me,Ye;if(Object.keys(Qe.current).length>0)return;let Pe=xe.current,ye=at.current,et=[],je=[];for(let Ke of Pe){if(!Ke.linkedSelector||!Ke.linkedSelector.startsWith("[data-pm=")||Ke.captured||Ke.status&&Ke.status!=="pending")continue;let Lt=document.querySelector(Ke.linkedSelector);!Lt&&((Ye=(Me=Ke.elements)==null?void 0:Me[0])!=null&&Ye.selector)&&(Lt=document.querySelector(Ke.elements[0].selector)),Lt||et.push(Ke.linkedSelector)}for(let Ke of ye)document.querySelector(Ke.selector)||je.push(Ke.selector);(et.length>0||je.length>0)&&r({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:et,styleSelectors:je}})},oe=new MutationObserver(Pe=>{Pe.some(ye=>ye.removedNodes.length>0)&&(S&&clearTimeout(S),S=setTimeout(J,3e3))});return oe.observe(document.body,{childList:!0,subtree:!0}),()=>{oe.disconnect(),S&&clearTimeout(S)}},[r]),Ht(()=>{i.lastCompletedJobId&&i.lastCompletedJobId in A&&re(S=>{var Pe;let ye=S,{[Pe=i.lastCompletedJobId]:J}=ye;return Bn(ye,[Ko(Pe)])})},[i.lastCompletedJobId]);let gt=ln(new Set);Ht(()=>{let S=i.events.filter(J=>J.type==="done"&&J.data.resolutions);for(let J of S){let oe=J.data.jobId;gt.current.has(oe)||(gt.current.add(oe),Array.isArray(J.data.resolutions)&&r({type:"APPLY_RESOLUTIONS",payload:{resolutions:J.data.resolutions,threadId:J.data.threadId}}))}},[i.events,r]);let rt=ln(new Set);Ht(()=>{let S=i.events.filter(J=>J.type==="error"&&J.data.cancelled);for(let J of S){let oe=J.data.jobId;if(!oe||rt.current.has(oe))continue;rt.current.add(oe);let Pe=A[oe];Pe&&Pe.annotationIds.length>0&&r({type:"SET_ANNOTATION_STATUS",payload:{ids:Pe.annotationIds,status:"dismissed"}})}},[i.events,A,r]);let dt=ln(0);Ht(()=>{let S=i.incrementalResolutions;if(S.length<=dt.current)return;let J=S.slice(dt.current);dt.current=S.length,r({type:"APPLY_RESOLUTIONS",payload:{resolutions:J}})},[i.incrementalResolutions,r]),Ht(()=>{i.incrementalResolutions.length===0&&(dt.current=0)},[i.incrementalResolutions.length]);let mt=ln(i.status);Ht(()=>{let S=mt.current;mt.current=i.status,S==="disconnected"&&i.status==="idle"&&re({})},[i.status]);let Ct=Ot(async()=>{let S=document.getElementById("devtools-canvas");if(!S)return!1;let J=await Br(document.body,S,n.annotations);if(J.length===0)return!1;let oe=await Ds(J,n.annotations,n.styleModifications);return oe&&r({type:"MARK_CAPTURED"}),oe},[n.annotations,n.styleModifications,r]),Be=Ot((S,J)=>{let oe=l.current.get(S)||[];l.current.set(S,[...oe,...J])},[]),Kt=Ot(async()=>{let S=document.getElementById("devtools-canvas");if(!S)return!1;let J=n.annotations.filter(Ye=>{var Ke;return((Ke=Ye.status)!=null?Ke:"pending")==="pending"}),oe=n.spacingTokenChanges.filter(Ye=>!Ye.captured);if(J.length===0&&n.styleModifications.filter(Ye=>!Ye.captured).length===0&&oe.length===0)return!1;let Pe=await Br(document.body,S,n.annotations);if(Pe.length===0)return!1;let ye=await Or(Pe);if(!ye)return!1;let et=Pr(J,n.styleModifications,void 0,oe.length>0?oe:void 0),je=JSON.stringify(et),Me=new Map;for(let Ye of J){let Ke=l.current.get(Ye.id);if(Ke&&Ke.length>0&&Me.set(Ye.id,Ke),Ye.groupId){for(let Lt of J)if(Lt.groupId===Ye.groupId&&Lt.id!==Ye.id){let St=l.current.get(Lt.id);St&&St.length>0&&Me.set(Lt.id,St)}}}try{let Ye=Ar(n.activeColor),{jobId:Ke,threadId:Lt}=await bs(ye,je,s,Ye,a,B.id,Me.size>0?Me:void 0,Rr());for(let dn of Me.keys())l.current.delete(dn);let St=J.map(dn=>dn.id),Er=n.styleModifications.filter(dn=>!dn.captured).map(dn=>dn.selector);re(dn=>m(f({},dn),{[Ke]:{annotationIds:St,styleSelectors:Er,color:n.activeColor,threadId:Lt}})),r({type:"MARK_CAPTURED"}),Lt&&St.length>0&&r({type:"SET_ANNOTATION_THREAD",payload:{ids:St,threadId:Lt}});let Nn=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),jo=((Nn!=null&&Nn[1]?parseFloat(Nn[1]):29)+60)%360;return r({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${jo})`}),!0}catch(Ye){return console.error("[Pare] Failed to send to bridge:",Ye),!1}},[n.annotations,n.styleModifications,n.spacingTokenChanges,n.activeColor,r,s,a,B.id]),ut=Ot(async(S,J,oe)=>{try{let Pe=Ar(n.activeColor),{jobId:ye}=await ks(S,J,s,Pe,a,B.id,oe,Rr());re(je=>m(f({},je),{[ye]:{annotationIds:[],styleSelectors:[],color:n.activeColor,threadId:S}}));let et=n.annotations.filter(je=>je.threadId===S&&(je.status==="waiting_input"||je.status==="resolved"||je.status==="needs_review"));et.length>0&&(r({type:"SET_ANNOTATION_STATUS",payload:{ids:et.map(je=>je.id),status:"in_flight"}}),re(je=>{let Me=je[ye];return Me?m(f({},je),{[ye]:m(f({},Me),{annotationIds:[...Me.annotationIds,...et.map(Ye=>Ye.id)]})}):je})),i.dismissQuestion(S)}catch(Pe){console.error("[Pare] Failed to send reply:",Pe)}},[n.activeColor,n.annotations,s,i.dismissQuestion,r,a,B.id]),zt=ln(new Set);Ht(()=>{for(let S of i.pendingQuestions){if(zt.current.has(S.jobId))continue;zt.current.add(S.jobId);let J=S.annotationIds&&S.annotationIds.length>0?S.annotationIds:void 0;!J&&S.threadId&&(J=n.annotations.filter(oe=>oe.threadId===S.threadId).map(oe=>oe.id)),J&&J.length>0&&r({type:"SET_ANNOTATION_QUESTION",payload:{ids:J,question:S.question,threadId:S.threadId}})}},[i.pendingQuestions,r,n.annotations]);let Yt=Io(()=>{if(i.activeJobId&&i.activeJobId in A)return A[i.activeJobId].color;let S=Object.values(A);return S.length>0?S[S.length-1].color:void 0},[i.activeJobId,A]),an=Ot(S=>{We(S)},[]),jt=Ot(()=>Oe(null),[]),Zt=Ot(S=>{if(!S){Oe(null);return}let J=A[S];J&&J.annotationIds.length>0?Oe(new Set(J.annotationIds)):Oe(null)},[A]),Gt=Ot(async S=>{try{let J=S?`${s}/cancel?jobId=${S}`:`${s}/cancel`;await fetch(J,{method:"POST"})}catch(J){}},[s]);Ht(()=>{n.activeTool==="model"&&ue&&We(null)},[n.activeTool]);let j=ln(null);Ht(()=>{n.isAnnotating?j.current&&(We(j.current),j.current=null):ue&&(j.current=ue,We(null))},[n.isAnnotating]);let Ee=Io(()=>{if(!ue)return null;for(let[S,J]of Object.entries(A))if(J.threadId===ue)return S;return null},[ue,A]),[He,qt]=$t(!1),[nt,vt]=$t(0),pt=ln(null),ht=Ot(S=>{S?(pt.current&&(clearTimeout(pt.current),pt.current=null),qt(!0)):pt.current=setTimeout(()=>{qt(!1),pt.current=null},150)},[]),An=Ot(()=>{vt(S=>S+1),i.clearEvents(),We(null),lt(new Set)},[i.clearEvents]);Ht(()=>()=>{pt.current&&clearTimeout(pt.current)},[]);let Vt=Io(()=>({isEnabled:t}),[t]);return t?Sp(ra.Provider,{value:Vt,children:[e,Yo(Fl,{state:n,dispatch:r,onScreenshot:Ct,inFlightAnnotationIds:Ae,inFlightStyleSelectors:ke,inFlightSelectorColors:Le,onAttachImages:Be,onReply:i.isConnected?ut:void 0,onViewThread:i.isConnected?an:void 0,onCloseThread:S=>{We(null),S&&lt(J=>new Set(J).add(S))},onModelComponentsAdd:i.isConnected?Ne:void 0,onModelComponentFocus:i.isConnected?Ie:void 0,onModelComponentHover:K,modelComponentNames:k,modelPanelHoveredComponent:q,modelSpacingTokenHover:le,highlightedAnnotationIds:qe}),Yo(Jl,{state:n,dispatch:r,onScreenshot:Ct,onSendToClaude:i.isConnected?Kt:void 0,hasActiveJobs:Object.keys(A).length>0||i.activeJobIds.length>0,activeJobColor:Yt,onCrosshairHover:ht,onClear:An,provider:a,onProviderChange:i.isConnected&&u.length>1?M:void 0,availableProviders:u,modelIndex:d,modelCount:D.length,modelLabel:B.label,onModelChange:i.isConnected?C:void 0,onViewThread:i.isConnected?an:void 0,isThreadPanelOpen:ue!==null,mcpStatus:x,onInstallMcp:i.isConnected?L:void 0,mcpJustInstalled:h,bridgeUrl:s,isBridgeConnected:i.isConnected,modelSelectedComponent:ee,modelCanvasHoveredComponent:F,onModelComponentHover:we,onSpacingTokenHover:he,onModifySpacingToken:i.isConnected?V:void 0,onDeleteSpacingToken:i.isConnected?te:void 0,modelRefreshKey:fe,onModelComponentAdded:$e,onModelComponentRemoved:U,onMouseEnter:jt}),ue&&i.isConnected&&Yo(oa,{threadId:ue,bridgeUrl:s,accentColor:(pe=(Q=n.annotations.find(S=>S.threadId===ue))==null?void 0:Q.color)!=null?pe:n.activeColor,isStreaming:Ee!==null,streamingEvents:Ee?i.events.filter(S=>S.data.jobId===Ee):[],onClose:()=>We(null),onReply:ut,onCancel:Ee?()=>Gt(Ee):void 0,lastError:(Te=(Re=i.lastErrorByJob)==null?void 0:Re[Ee!=null?Ee:""])!=null?Te:void 0,onMouseEnter:jt}),Yo(Zl,{bridge:i,bridgeUrl:s,inFlightJobs:A,isVisible:He||i.lastResponseText!==null||i.activeJobIds.length>0,onHover:ht,clearSignal:nt,onReply:ut,onViewThread:an,onCancel:Gt,onHoverJob:Zt,isConnected:i.isConnected,dismissedThreadIds:me})]}):Yo(vp,{children:e})}function xp(){let e=hp(ra);if(!e)throw new Error("usePopmelt must be used within PopmeltProvider");return e}export{bp as PopmeltProvider,xp as usePopmelt};
+`,sp={borderTop:"1px solid rgba(0, 0, 0, 0.08)",padding:12};function ea(e){return e.replace(/<resolution>[\s\S]*?<\/resolution>/g,"").replace(/<question>[\s\S]*?<\/question>/g,"").replace(/<plan>[\s\S]*?<\/plan>/g,"").replace(/<review>[\s\S]*?<\/review>/g,"").trim()}function ta(e){return new Date(e).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var Wi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],lp=3e3,ap=250;function na({size:e=14}){return _e("svg",{width:e,height:e,viewBox:"0 0 1200 1200",fill:"#6b7280",stroke:"none",style:{flexShrink:0},children:_e("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 cp({color:e}){let[t,o]=Qn(0),[n,r]=Qn(()=>Math.floor(Math.random()*Wi.length));return Fn(()=>{let i=setInterval(()=>o(l=>(l+1)%2),ap),s=setInterval(()=>r(l=>(l+1)%Wi.length),lp);return()=>{clearInterval(i),clearInterval(s)}},[]),Bt("span",{style:{display:"inline-flex",alignItems:"center",gap:4},children:[_e("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?Bt(Yi,{children:[_e("circle",{cx:"7",cy:"7",r:"2"}),_e("circle",{cx:"17",cy:"7",r:"2"}),_e("circle",{cx:"7",cy:"17",r:"2"}),_e("circle",{cx:"17",cy:"17",r:"2"})]}):Bt(Yi,{children:[_e("circle",{cx:"12",cy:"6",r:"2"}),_e("circle",{cx:"6",cy:"12",r:"2"}),_e("circle",{cx:"18",cy:"12",r:"2"}),_e("circle",{cx:"12",cy:"18",r:"2"})]})}),_e("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:Wi[n]})]})}function dp(e){var r;let t=String(e.data.tool||""),o=e.data.file?String(e.data.file):null,n=o?(r=o.split("/").pop())!=null?r:o:null;switch(t){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 t?`Using ${t}`:null}}var up=new Set(["Read","Glob","Grep","WebFetch","WebSearch"]),pp=new Set(["Edit","Write","Bash"]);function fp(e){let t=0,o=!1;for(let n of e){if(n.type!=="tool_use")continue;let r=String(n.data.tool||"");pp.has(r)?o=!0:up.has(r)&&t++}return!o&&t>=3?"researching":o?"applying changes":null}function gp(e){let t=[];for(let o of e)if(o.type==="tool_use"){let n=dp(o);n&&t.push({kind:"tool",label:n})}else if(o.type==="delta"){let n=String(o.data.text||"");if(!n)continue;let r=t[t.length-1];r&&r.kind==="text"?r.text+=n:t.push({kind:"text",text:n})}else if(o.type==="thinking"){let n=String(o.data.text||"");if(!n)continue;let r=t[t.length-1];r&&r.kind==="thinking"?r.text+=n:t.push({kind:"thinking",text:n})}return t}function oa({threadId:e,bridgeUrl:t,accentColor:o,isStreaming:n,streamingEvents:r,onClose:i,onReply:s,onCancel:l,lastError:a,onMouseEnter:c}){let[d,p]=Qn([]),[u,g]=Qn(!0),[x,E]=Qn(""),[h,w]=Qn([]),D=Rn(null),B=Rn(null),M=Rn(null),C=Rn(n),L=Rn($i()),k=Rn({x:0,y:0}),W=Rn(!1),ee=Rn({x:0,y:0,offsetX:0,offsetY:0}),Z=Rn(!1),[,F]=Qn(0);Fn(()=>{try{let V=localStorage.getItem(_i);if(V){let te=JSON.parse(V);typeof te.top=="number"&&typeof te.left=="number"&&(Z.current=!0,L.current={top:te.top,left:te.left},F(fe=>fe+1))}}catch(V){}},[]),Fn(()=>{let V=()=>{Z.current||(L.current=$i()),F(te=>te+1)};return window.addEventListener("resize",V,{passive:!0}),()=>window.removeEventListener("resize",V)},[]),Fn(()=>{let V=M.current;if(!V)return;let te=ue=>{ue.button!==0||ue.target.closest("button")||(ue.preventDefault(),ue.stopPropagation(),W.current=!0,ee.current={x:ue.clientX,y:ue.clientY,offsetX:k.current.x,offsetY:k.current.y})},fe=ue=>{if(!W.current)return;let We=ee.current,me=We.offsetX+(ue.clientX-We.x),lt=We.offsetY+(ue.clientY-We.y),qe=Math.max(To,Math.min(window.innerWidth-kr-2*ji-To,L.current.left+me)),Ne=Math.max(To,L.current.top+lt);k.current={x:qe-L.current.left,y:Ne-L.current.top};let tt=B.current;tt&&(tt.style.top=`${Ne}px`,tt.style.left=`${qe}px`,tt.style.height=`${Ql(Ne,qe)}px`)},Ce=()=>{if(!W.current)return;let ue=L.current.top+k.current.y,We=L.current.left+k.current.x;L.current={top:ue,left:We},k.current={x:0,y:0},Z.current=!0;try{localStorage.setItem(_i,JSON.stringify({top:ue,left:We}))}catch(me){}W.current=!1},ge=()=>{L.current=$i(),k.current={x:0,y:0},Z.current=!1;try{localStorage.removeItem(_i)}catch(ue){}F(ue=>ue+1)};return V.addEventListener("mousedown",te),window.addEventListener("mousemove",fe),window.addEventListener("mouseup",Ce),V.addEventListener("dblclick",ge),()=>{V.removeEventListener("mousedown",te),window.removeEventListener("mousemove",fe),window.removeEventListener("mouseup",Ce),V.removeEventListener("dblclick",ge)}},[]);let K=wr(()=>{fetch(`${t}/thread/${e}`).then(V=>V.json()).then(V=>{var te;p((te=V.messages)!=null?te:[]),g(!1)}).catch(()=>g(!1))},[t,e]);Fn(()=>{g(!0),K()},[K]),Fn(()=>{C.current&&!n&&K(),C.current=n},[n,K]);let q=r?gp(r):[],we=r?fp(r):null;Fn(()=>{D.current&&(D.current.scrollTop=D.current.scrollHeight)},[d,q.length,n]),Fn(()=>{let V=te=>{te.key==="Escape"&&(te.stopPropagation(),i())};return document.addEventListener("keydown",V),()=>document.removeEventListener("keydown",V)},[i]);let le=wr(()=>{if(!x.trim()||!s)return;let V=x.trim(),te=h.length>0?h:void 0;p(fe=>[...fe,{role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:te?`${V} [${te.length} image${te.length>1?"s":""}]`:V}]),s(e,V,te),E(""),w([])},[x,h,e,s]),he=wr(V=>{let te=V.clipboardData.items,fe=[];for(let Ce=0;Ce<te.length;Ce++){let ge=te[Ce];if(ge.type.startsWith("image/")){let ue=ge.getAsFile();ue&&fe.push(ue)}}fe.length>0&&(V.preventDefault(),w(Ce=>[...Ce,...fe]))},[]),Fe=wr(V=>{V.key==="Enter"&&(V.metaKey||V.ctrlKey)&&(V.preventDefault(),le())},[le]),Ie=L.current.top+k.current.y,$e=L.current.left+k.current.x,J=Ql(Ie,$e);return Bt(Yi,{children:[_e("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:V=>{V.target===V.currentTarget&&i()},style:{position:"fixed",inset:0,zIndex:9999}}),Bt("div",{ref:B,style:m(f({},np),{height:J,position:"fixed",top:Ie,left:$e,zIndex:1e4}),"data-devtools":"thread-panel",onMouseEnter:c,children:[Bt("div",{ref:M,style:m(f({},op),{backgroundColor:o,color:"#ffffff",cursor:"grab",userSelect:"none",WebkitUserSelect:"none"}),children:[_e("span",{children:"Conversation"}),_e("button",{onClick:i,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),_e("style",{dangerouslySetInnerHTML:{__html:ip}}),Bt("div",{ref:D,style:rp,"data-devtools":"thread-panel-messages",children:[u&&_e("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!u&&d.length===0&&!n&&_e("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),d.map((V,te)=>{let fe=V.role==="human";if(V.cancelled)return _e("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:te===d.length-1?1:.5},children:Bt("div",{style:{display:"flex",alignItems:"center",gap:4},children:[_e("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:"Cancelled"}),_e("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:ta(V.timestamp)})]})},`${V.jobId}-${te}`);let Ce=fe?V.replyToQuestion||V.feedbackSummary||"(annotation)":ea(V.responseText||""),ge=fe?void 0:V.question,ue=!fe&&V.resolutions&&V.resolutions.length>0,We=!fe&&V.toolsUsed&&V.toolsUsed.length>0;if(!Ce&&!ge&&!ue)return null;let me=te===d.length-1;return Bt("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)",opacity:me?1:.5},children:[Bt("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[!fe&&_e(na,{size:11}),_e("span",{style:{fontWeight:600,fontSize:11,color:fe?o:"#6b7280"},children:fe?"You":"Claude Code"}),_e("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:ta(V.timestamp)})]}),Ce&&_e("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:fe?Ce:Sr(Ce)}),ge&&_e("div",{style:{marginTop:Ce?4:0,lineHeight:1.5,wordBreak:"break-word"},children:Sr(ge)}),(We||ue)&&Bt("div",{style:{marginTop:Ce||ge?6:0,padding:"4px 8px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#6b7280"},children:[We&&_e("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:V.toolsUsed.map((lt,qe)=>_e("div",{children:lt},qe))}),ue&&V.resolutions.map((lt,qe)=>{var A;let Ne=(A=lt.finalScope)!=null?A:lt.inferredScope,tt=Ne?`${Ne.breadth} \xB7 ${Ne.target}`:null;return Bt("div",{style:{marginTop:We?4:0},children:[_e("span",{style:{color:lt.status==="resolved"?"#10b981":"#f59e0b"},children:lt.status==="resolved"?"Done":"Needs review"}),tt&&_e("span",{style:{marginLeft:6,padding:"1px 5px",backgroundColor:"rgba(0, 0, 0, 0.06)",fontSize:10,fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace"},children:tt}),lt.summary?` \u2014 ${lt.summary}`:""]},qe)})]})]},`${V.jobId}-${te}`)}),n&&Bt("div",{style:{padding:"8px 16px",borderBottom:"1px solid rgba(0, 0, 0, 0.04)"},children:[Bt("div",{style:{display:"flex",alignItems:"center",gap:4,marginBottom:4},children:[_e(na,{size:11}),_e("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:"Claude Code"}),we&&_e("span",{style:{fontSize:10,color:"#b0b7c3",fontStyle:"italic"},children:we}),Bt("span",{style:{marginLeft:"auto",display:"flex",alignItems:"center",gap:6},children:[_e(cp,{color:o}),l&&_e("button",{onClick:l,style:{background:"none",border:"1px solid rgba(0,0,0,0.1)",color:"#6b7280",fontSize:10,padding:"2px 8px",cursor:"pointer",fontFamily:"inherit"},children:"Cancel"})]})]}),q.map((V,te)=>{if(V.kind==="tool")return _e("div",{style:{paddingLeft:12,fontSize:11,color:"#9ca3af",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",lineHeight:1.6},children:V.label},te);if(V.kind==="thinking")return _e("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:V.text},te);let fe=ea(V.text);return fe?_e("div",{style:{paddingLeft:12,marginTop:2,marginBottom:2,lineHeight:1.5,wordBreak:"break-word"},children:Sr(fe)},te):null})]})]}),!n&&a&&Bt("div",{style:{padding:"8px 16px",backgroundColor:"rgba(239, 68, 68, 0.06)",borderBottom:"1px solid rgba(0,0,0,0.04)",fontSize:11,color:"#dc2626",lineHeight:1.4},children:[_e("span",{style:{fontWeight:600},children:"Error: "}),a]}),s&&Bt("div",{style:sp,children:[h.length>0&&Bt("div",{style:{fontSize:11,color:"#6b7280",marginBottom:4,display:"flex",alignItems:"center",gap:4},children:[Bt("span",{children:[h.length," image",h.length>1?"s":""," attached"]}),_e("button",{onClick:()=>w([]),style:{background:"none",border:"none",cursor:"pointer",fontSize:11,color:"#9ca3af",padding:"0 2px"},children:"\xD7"})]}),_e("textarea",{value:x,onChange:V=>E(V.target.value),onKeyDown:Fe,onPaste:he,placeholder:"Reply... (Cmd+Enter to send)",style:{width:"100%",minHeight:60,padding:4,fontSize:12,fontFamily:Ft,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"}}),_e("div",{style:{display:"flex",justifyContent:"flex-end",marginTop:6},children:_e("button",{onClick:le,disabled:!x.trim(),style:{padding:"5px 14px",fontSize:11,fontFamily:Ft,fontWeight:600,backgroundColor:x.trim()?o:"rgba(0,0,0,0.1)",color:x.trim()?"#ffffff":"rgba(0,0,0,0.3)",border:"none",cursor:x.trim()?"pointer":"default"},children:"Send \u2318\u23CE"})})]})]})]})}import{Fragment as vp,jsx as Yo,jsxs as Sp}from"react/jsx-runtime";var ra=mp(null),Gi="devtools-provider",Vi="devtools-model",Ui="devtools-open-thread-id",Ji=[{id:"claude-opus-4-6",label:"Opus 4.6"},{id:"claude-sonnet-4-6",label:"Sonn 4.6"}],Xi=[{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 yp(e,t,o){let n=e==="codex"?Xi:Ji;return Math.min(o,(t==="codex"?Xi:Ji).length-1)}function bp({children:e,enabled:t=process.env.NODE_ENV==="development",bridgeUrl:o="http://localhost:1111"}){var an,N,Q,pe,Ae,Te;let[n,r]=Bs(),i=As(o),s=(an=Ls())!=null?an:o,l=nn(new Map),[a,c]=$t(()=>typeof window=="undefined"?"claude":localStorage.getItem(Gi)||"claude"),[d,p]=$t(()=>{if(typeof window=="undefined")return 0;let v=localStorage.getItem(Vi);return v&&parseInt(v,10)||0}),[u,g]=$t(["claude","codex"]),[x,E]=$t({}),[h,w]=$t(!1);Ot(()=>{i.isConnected&&hs(s).then(v=>{if(!v)return;let U=Object.entries(v.providers).filter(([,ye])=>ye.available).map(([ye])=>ye);U.length>0&&g(U);let oe={};for(let[ye,et]of Object.entries(v.providers))et.mcp&&(oe[ye]=et.mcp);E(oe),Object.values(oe).every(ye=>ye.found)&&w(!1)})},[i.isConnected,i.capabilitiesVersion,s]),Ot(()=>{if(u.length>0&&!u.includes(a)){let v=u[0];c(v),localStorage.setItem(Gi,v)}},[u,a]);let D=a==="codex"?Xi:Ji,B=(N=D[d])!=null?N:D[0],M=zt(v=>{let U=a;c(v),localStorage.setItem(Gi,v);let oe=yp(U,v,d);p(oe),localStorage.setItem(Vi,String(oe))},[a,d]),C=zt(v=>{p(v),localStorage.setItem(Vi,String(v))},[]),L=zt(async()=>{let v=await xs(s);if(!v)return;let U={};for(let[oe,Be]of Object.entries(v.capabilities.providers))Be.mcp&&(U[oe]=Be.mcp);E(U),v.results.some(oe=>oe.installed)&&w(!0)},[s]),[k,W]=$t(new Set),[ee,Z]=$t(null),[F,K]=$t(null),[q,we]=$t(null),[le,he]=$t(null);Ot(()=>{i.isConnected&&no(s).then(v=>{v!=null&&v.components&&W(new Set(Object.keys(v.components)))})},[i.isConnected,s]);let Fe=zt(async v=>{let U=[];for(let oe of v)try{(await vs(oe,s)).added&&U.push(oe)}catch(Be){console.error("[Popmelt] Failed to add component to model:",oe,Be)}U.length>0&&(W(oe=>{let Be=new Set(oe);for(let ye of U)Be.add(ye);return Be}),Z(U[U.length-1]))},[s]),Ie=zt(v=>{Z(v)},[]),$e=zt(()=>{no(s).then(v=>{v!=null&&v.components&&W(new Set(Object.keys(v.components)))})},[s]),J=zt(async v=>{try{(await Ss(v,s)).removed&&W(oe=>{let Be=new Set(oe);return Be.delete(v),Be})}catch(U){console.error("[Popmelt] Failed to remove component from model:",U)}},[s]),V=zt((v,U)=>{r({type:"MODIFY_SPACING_TOKEN",payload:v}),r({type:"ADD_SPACING_TOKEN_CHANGE",payload:U})},[r]),te=zt((v,U)=>{r({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:v,originalValue:U}})},[r]),[fe,Ce]=$t(0),ge=nn([]);Ot(()=>{let v=ge.current,U=n.spacingTokenMods;ge.current=U;let oe=new Map(v.map(et=>[et.tokenPath,et])),Be=new Map(U.map(et=>[et.tokenPath,et])),ye=!1;for(let[et,je]of Be){let Me=oe.get(et);if(!(Me&&Me.currentValue===je.currentValue)){ye=!0,je.currentValue==="__deleted__"?ws(et,s).catch(Ye=>console.error("[Popmelt] Failed to sync token delete:",Ye)):Ir(et,je.currentValue,s).catch(Ye=>console.error("[Popmelt] Failed to sync token update:",Ye));for(let Ye of je.targets){let Ke=document.querySelector(Ye.selector);if(Ke)if(je.currentValue==="__deleted__")Ke.style.removeProperty(Ye.property);else{let Lt=je.currentPx;Lt>0&&Ke.style.setProperty(Ye.property,`${Lt}px`,"important")}}}}for(let[et,je]of oe)if(!Be.has(et)){ye=!0,Ir(et,je.originalValue,s).catch(Me=>console.error("[Popmelt] Failed to restore token on undo:",Me));for(let Me of je.targets){let Ye=document.querySelector(Me.selector);Ye&&Ye.style.removeProperty(Me.property)}}ye&&Ce(et=>et+1)},[n.spacingTokenMods,s]);let[ue,We]=$t(()=>typeof window=="undefined"?null:localStorage.getItem(Ui)||null),[me,lt]=$t(new Set),[qe,Ne]=$t(null);Ot(()=>{ue?localStorage.setItem(Ui,ue):localStorage.removeItem(Ui)},[ue]);let tt="popmelt-in-flight-jobs",[A,re]=$t(()=>{try{let v=sessionStorage.getItem(tt);return v?JSON.parse(v):{}}catch(v){return{}}});Ot(()=>{try{Object.keys(A).length>0?sessionStorage.setItem(tt,JSON.stringify(A)):sessionStorage.removeItem(tt)}catch(v){}},[A]);let de=nn(new Map);Ot(()=>{for(let[v,U]of Object.entries(A))U.annotationIds.length>0&&de.current.set(v,U.annotationIds)},[A]);let Le=nn(!1);Ot(()=>{if(Le.current||n.annotations.length===0)return;Le.current=!0;let v=new Set;for(let oe of Object.values(A))for(let Be of oe.annotationIds)v.add(Be);let U=n.annotations.filter(oe=>v.has(oe.id)?!1:!!(oe.status==="in_flight"||(oe.status==="pending"||!oe.status)&&(oe.captured||oe.threadId))).map(oe=>oe.id);U.length>0&&r({type:"SET_ANNOTATION_STATUS",payload:{ids:U,status:"dismissed"}})},[n.annotations,A,r]);let ke=Io(()=>{let v=new Set;for(let U of Object.values(A))for(let oe of U.annotationIds)v.add(oe);return v},[A]),Re=Io(()=>{let v=new Set;for(let U of Object.values(A))for(let oe of U.styleSelectors)v.add(oe);return v},[A]),ve=Io(()=>{let v=new Map;for(let U of Object.values(A)){for(let oe of U.styleSelectors)v.set(oe,U.color);for(let oe of U.annotationIds){let Be=n.annotations.find(ye=>ye.id===oe);if(Be&&(Be.linkedSelector&&v.set(Be.linkedSelector,U.color),Be.groupId))for(let ye of n.annotations)ye.groupId===Be.groupId&&ye.linkedSelector&&v.set(ye.linkedSelector,U.color)}}return v},[A,n.annotations]),at=nn(n.annotations);at.current=n.annotations;let Qe=nn(n.styleModifications);Qe.current=n.styleModifications;let ft=nn(A);ft.current=A,Ot(()=>{let v=null,U=()=>{var Me,Ye;if(Object.keys(ft.current).length>0)return;let Be=at.current,ye=Qe.current,et=[],je=[];for(let Ke of Be){if(!Ke.linkedSelector||!Ke.linkedSelector.startsWith("[data-pm=")||Ke.captured||Ke.status&&Ke.status!=="pending")continue;let Lt=document.querySelector(Ke.linkedSelector);!Lt&&((Ye=(Me=Ke.elements)==null?void 0:Me[0])!=null&&Ye.selector)&&(Lt=document.querySelector(Ke.elements[0].selector)),Lt||et.push(Ke.linkedSelector)}for(let Ke of ye)document.querySelector(Ke.selector)||je.push(Ke.selector);(et.length>0||je.length>0)&&r({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:et,styleSelectors:je}})},oe=new MutationObserver(Be=>{Be.some(ye=>ye.removedNodes.length>0)&&(v&&clearTimeout(v),v=setTimeout(U,3e3))});return oe.observe(document.body,{childList:!0,subtree:!0}),()=>{oe.disconnect(),v&&clearTimeout(v)}},[r]),Ot(()=>{i.lastCompletedJobId&&i.lastCompletedJobId in A&&re(v=>{var Be;let ye=v,{[Be=i.lastCompletedJobId]:U}=ye;return Bn(ye,[Ko(Be)])})},[i.lastCompletedJobId]);let rt=nn(new Set);Ot(()=>{let v=i.events.filter(U=>U.type==="done"&&U.data.resolutions);for(let U of v){let oe=U.data.jobId;rt.current.has(oe)||(rt.current.add(oe),Array.isArray(U.data.resolutions)&&r({type:"APPLY_RESOLUTIONS",payload:{resolutions:U.data.resolutions,threadId:U.data.threadId}}))}},[i.events,r]);let gt=nn(new Set);Ot(()=>{let v=i.events.filter(U=>U.type==="error"&&U.data.cancelled);for(let U of v){let oe=U.data.jobId;if(!oe||gt.current.has(oe))continue;gt.current.add(oe);let Be=A[oe];Be&&Be.annotationIds.length>0&&r({type:"SET_ANNOTATION_STATUS",payload:{ids:Be.annotationIds,status:"dismissed"}})}},[i.events,A,r]);let ct=nn(0);Ot(()=>{let v=i.incrementalResolutions;if(v.length<=ct.current)return;let U=v.slice(ct.current);ct.current=v.length,r({type:"APPLY_RESOLUTIONS",payload:{resolutions:U}})},[i.incrementalResolutions,r]),Ot(()=>{i.incrementalResolutions.length===0&&(ct.current=0)},[i.incrementalResolutions.length]);let Ct=nn(i.status);Ot(()=>{let v=Ct.current;Ct.current=i.status,v==="disconnected"&&i.status==="idle"&&re({})},[i.status]);let Pe=zt(async()=>{let v=document.getElementById("devtools-canvas");if(!v)return!1;let U=await Br(document.body,v,n.annotations);if(U.length===0)return!1;let oe=await Ds(U,n.annotations,n.styleModifications);return oe&&r({type:"MARK_CAPTURED"}),oe},[n.annotations,n.styleModifications,r]),Kt=zt((v,U)=>{let oe=l.current.get(v)||[];l.current.set(v,[...oe,...U])},[]),mt=zt(async()=>{let v=document.getElementById("devtools-canvas");if(!v)return!1;let U=n.annotations.filter(Ye=>{var Ke;return((Ke=Ye.status)!=null?Ke:"pending")==="pending"}),oe=n.spacingTokenChanges.filter(Ye=>!Ye.captured);if(U.length===0&&n.styleModifications.filter(Ye=>!Ye.captured).length===0&&oe.length===0)return!1;let Be=await Br(document.body,v,n.annotations);if(Be.length===0)return!1;let ye=await Or(Be);if(!ye)return!1;let et=Pr(U,n.styleModifications,void 0,oe.length>0?oe:void 0),je=JSON.stringify(et),Me=new Map;for(let Ye of U){let Ke=l.current.get(Ye.id);if(Ke&&Ke.length>0&&Me.set(Ye.id,Ke),Ye.groupId){for(let Lt of U)if(Lt.groupId===Ye.groupId&&Lt.id!==Ye.id){let St=l.current.get(Lt.id);St&&St.length>0&&Me.set(Lt.id,St)}}}try{let Ye=Ar(n.activeColor),{jobId:Ke,threadId:Lt}=await bs(ye,je,s,Ye,a,B.id,Me.size>0?Me:void 0,Rr());for(let cn of Me.keys())l.current.delete(cn);let St=U.map(cn=>cn.id),Er=n.styleModifications.filter(cn=>!cn.captured).map(cn=>cn.selector);re(cn=>m(f({},cn),{[Ke]:{annotationIds:St,styleSelectors:Er,color:n.activeColor,threadId:Lt}})),r({type:"MARK_CAPTURED"}),Lt&&St.length>0&&r({type:"SET_ANNOTATION_THREAD",payload:{ids:St,threadId:Lt}});let Nn=n.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),jo=((Nn!=null&&Nn[1]?parseFloat(Nn[1]):29)+60)%360;return r({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${jo})`}),!0}catch(Ye){return console.error("[Pare] Failed to send to bridge:",Ye),!1}},[n.annotations,n.styleModifications,n.spacingTokenChanges,n.activeColor,r,s,a,B.id]),Dt=zt(async(v,U,oe)=>{try{let Be=Ar(n.activeColor),{jobId:ye}=await ks(v,U,s,Be,a,B.id,oe,Rr());re(je=>m(f({},je),{[ye]:{annotationIds:[],styleSelectors:[],color:n.activeColor,threadId:v}}));let et=n.annotations.filter(je=>je.threadId===v&&(je.status==="waiting_input"||je.status==="resolved"||je.status==="needs_review"));et.length>0&&(r({type:"SET_ANNOTATION_STATUS",payload:{ids:et.map(je=>je.id),status:"in_flight"}}),re(je=>{let Me=je[ye];return Me?m(f({},je),{[ye]:m(f({},Me),{annotationIds:[...Me.annotationIds,...et.map(Ye=>Ye.id)]})}):je})),i.dismissQuestion(v)}catch(Be){console.error("[Pare] Failed to send reply:",Be)}},[n.activeColor,n.annotations,s,i.dismissQuestion,r,a,B.id]),Wt=nn(new Set);Ot(()=>{for(let v of i.pendingQuestions){if(Wt.current.has(v.jobId))continue;Wt.current.add(v.jobId);let U=v.annotationIds&&v.annotationIds.length>0?v.annotationIds:void 0;!U&&v.threadId&&(U=n.annotations.filter(oe=>oe.threadId===v.threadId).map(oe=>oe.id)),U&&U.length>0&&r({type:"SET_ANNOTATION_QUESTION",payload:{ids:U,question:v.question,threadId:v.threadId}})}},[i.pendingQuestions,r,n.annotations]);let xn=Io(()=>{if(i.activeJobId&&i.activeJobId in A)return A[i.activeJobId].color;let v=Object.values(A);return v.length>0?v[v.length-1].color:void 0},[i.activeJobId,A]),Yt=zt(v=>{We(v)},[]),Zt=zt(v=>{if(!v){Ne(null);return}let U=de.current.get(v);U&&U.length>0?Ne(new Set(U)):Ne(null)},[]),Gt=zt(async v=>{try{let U=v?`${s}/cancel?jobId=${v}`:`${s}/cancel`;await fetch(U,{method:"POST"})}catch(U){}},[s]);Ot(()=>{n.activeTool==="model"&&ue&&We(null)},[n.activeTool]);let j=nn(null);Ot(()=>{n.isAnnotating?j.current&&(We(j.current),j.current=null):ue&&(j.current=ue,We(null))},[n.isAnnotating]);let Ee=Io(()=>{if(!ue)return null;for(let[v,U]of Object.entries(A))if(U.threadId===ue)return v;return null},[ue,A]),[He,qt]=$t(!1),[nt,vt]=$t(0),ut=nn(null),ht=zt(v=>{v?(ut.current&&(clearTimeout(ut.current),ut.current=null),qt(!0)):ut.current=setTimeout(()=>{qt(!1),ut.current=null},150)},[]),An=zt(()=>{vt(v=>v+1),i.clearEvents(),We(null),lt(new Set)},[i.clearEvents]);Ot(()=>()=>{ut.current&&clearTimeout(ut.current)},[]);let Vt=Io(()=>({isEnabled:t}),[t]);return t?Sp(ra.Provider,{value:Vt,children:[e,Yo(Fl,{state:n,dispatch:r,onScreenshot:Pe,inFlightAnnotationIds:ke,inFlightStyleSelectors:Re,inFlightSelectorColors:ve,onAttachImages:Kt,onReply:i.isConnected?Dt:void 0,onViewThread:i.isConnected?Yt:void 0,onCloseThread:v=>{We(null),v&&lt(U=>new Set(U).add(v))},onModelComponentsAdd:i.isConnected?Fe:void 0,onModelComponentFocus:i.isConnected?Ie:void 0,onModelComponentHover:K,modelComponentNames:k,modelPanelHoveredComponent:q,modelSpacingTokenHover:le,highlightedAnnotationIds:qe}),Yo(Jl,{state:n,dispatch:r,onScreenshot:Pe,onSendToClaude:i.isConnected?mt:void 0,hasActiveJobs:Object.keys(A).length>0||i.activeJobIds.length>0,activeJobColor:xn,onCrosshairHover:ht,onClear:An,provider:a,onProviderChange:i.isConnected&&u.length>1?M:void 0,availableProviders:u,modelIndex:d,modelCount:D.length,modelLabel:B.label,onModelChange:i.isConnected?C:void 0,onViewThread:i.isConnected?Yt:void 0,isThreadPanelOpen:ue!==null,mcpStatus:x,onInstallMcp:i.isConnected?L:void 0,mcpJustInstalled:h,bridgeUrl:s,isBridgeConnected:i.isConnected,modelSelectedComponent:ee,modelCanvasHoveredComponent:F,onModelComponentHover:we,onSpacingTokenHover:he,onModifySpacingToken:i.isConnected?V:void 0,onDeleteSpacingToken:i.isConnected?te:void 0,modelRefreshKey:fe,onModelComponentAdded:$e,onModelComponentRemoved:J}),ue&&i.isConnected&&Yo(oa,{threadId:ue,bridgeUrl:s,accentColor:(pe=(Q=n.annotations.find(v=>v.threadId===ue))==null?void 0:Q.color)!=null?pe:n.activeColor,isStreaming:Ee!==null,streamingEvents:Ee?i.events.filter(v=>v.data.jobId===Ee):[],onClose:()=>We(null),onReply:Dt,onCancel:Ee?()=>Gt(Ee):void 0,lastError:(Te=(Ae=i.lastErrorByJob)==null?void 0:Ae[Ee!=null?Ee:""])!=null?Te:void 0}),Yo(Zl,{bridge:i,bridgeUrl:s,inFlightJobs:A,isVisible:He||i.lastResponseText!==null||i.activeJobIds.length>0,onHover:ht,clearSignal:nt,onReply:Dt,onViewThread:Yt,onCancel:Gt,onHoverJob:Zt,isConnected:i.isConnected,dismissedThreadIds:me})]}):Yo(vp,{children:e})}function xp(){let e=hp(ra);if(!e)throw new Error("usePopmelt must be used within PopmeltProvider");return e}export{bp as PopmeltProvider,xp as usePopmelt};