@popmelt.com/core 0.7.9 → 0.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bridge-entry.mjs +55 -54
- package/dist/cli.mjs +52 -51
- package/dist/index.mjs +24 -24
- package/dist/plugin-astro.mjs +1 -1
- package/dist/plugin-vite.mjs +1 -1
- package/dist/server-GDRYHJ4Q.mjs +417 -0
- package/dist/server.mjs +55 -54
- package/package.json +1 -1
- package/dist/server-WF6OWM5R.mjs +0 -416
package/dist/index.mjs
CHANGED
|
@@ -1,26 +1,26 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{createContext as ah,useCallback as Gt,useContext as lh,useEffect as At,useMemo as po,useRef as en,useState as wt}from"react";import{useCallback as Xa,useEffect as vd,useSyncExternalStore as xd}from"react";var yn="http://localhost:1111";function Ha(){return typeof window<"u"?window.__POPMELT_PROJECT_ID__??null:null}function hd(e={}){let t=Ha();if(!t)return e;let n=new Headers(e.headers);return n.set("X-Popmelt-Project-Id",t),{...e,headers:n}}function mo(e,t={}){return fetch(e,hd(t))}function Rn(e,t={},n=15e3){let o=new AbortController;t.signal&&t.signal.addEventListener("abort",()=>o.abort());let r=setTimeout(()=>o.abort(),n);return mo(e,{...t,signal:o.signal}).finally(()=>clearTimeout(r))}async function Na(e=yn){try{let t=await Rn(`${e}/capabilities`,{},5e3);return t.ok?await t.json():null}catch{return null}}async function go(e=yn){try{let t=new AbortController,n=setTimeout(()=>t.abort(),2e3),o=await mo(`${e}/status`,{signal:t.signal});return clearTimeout(n),o.ok?await o.json():null}catch{return null}}async function Oa(e){try{let t=new AbortController,n=setTimeout(()=>t.abort(),500),o=await mo(`http://localhost:${e}/status`,{signal:t.signal});return clearTimeout(n),o.ok?await o.json():null}catch{return null}}async function yd(e){return go(e)}async function gs(e,t){if(e&&e!=="http://localhost:1111")try{let c=new URL(e),u=await yd(e);if(!u&&!t)return null;if(!(!u&&t)){if(!(u&&t&&u.projectId!==t)){if(u?.projectId&&!t)return null;if(u)return{url:e,port:parseInt(c.port,10)||1111,projectId:u.projectId}}}}catch{if(!t)return null}let i=typeof window<"u"?window.location.origin:null,a=await Oa(1111);if(a){if(t&&a.projectId===t)return{url:"http://localhost:1111",port:1111,projectId:a.projectId};if(a.devOrigin&&i&&a.devOrigin===i&&(t||!a.projectId))return{url:"http://localhost:1111",port:1111,projectId:a.projectId}}let s=Array.from({length:8},(c,u)=>{let f=1112+u;return Oa(f).then(p=>p?{status:p,port:f}:null)}),l=(await Promise.all(s)).filter(c=>c!==null),d=[];a&&d.push({port:1111,devOrigin:a.devOrigin,projectId:a.projectId});for(let c of l)d.push({port:c.port,devOrigin:c.status.devOrigin,projectId:c.status.projectId});if(t){let c=d.find(u=>u.projectId===t);if(c)return{url:`http://localhost:${c.port}`,port:c.port,projectId:c.projectId}}if(i){let c=d.find(u=>u.devOrigin===i&&(t||!u.projectId));if(c)return{url:`http://localhost:${c.port}`,port:c.port,projectId:c.projectId}}return d.length===1&&!d[0].projectId?{url:`http://localhost:${d[0].port}`,port:d[0].port,projectId:d[0].projectId}:null}async function wi(e=yn,t,n=-1){try{let o=await Rn(`${e}/jobs/${t}/events?afterSeq=${n}`,{},5e3);return o.ok?await o.json():null}catch{return null}}async function za(e,t,n=yn,o,r,i,a,s){let l=new FormData;if(e instanceof Map){let c=!0;for(let[u,f]of e){let p=encodeURIComponent(u);l.append(`screenshot-${p}`,f,`screenshot-${p}.webp`),c&&(l.append("screenshot",f,"screenshot.webp"),c=!1)}c&&l.append("screenshot",new Blob([],{type:"image/webp"}),"screenshot.webp")}else l.append("screenshot",e,"screenshot.webp");if(l.append("feedback",t),o&&l.append("color",o),r&&l.append("provider",r),i&&l.append("model",i),s&&l.append("sourceId",s),a)for(let[c,u]of a)for(let f=0;f<u.length;f++)l.append(`image-${c}-${f}`,u[f],`image-${c}-${f}.webp`);let d=await Rn(`${n}/send`,{method:"POST",body:l},3e4);if(!d.ok){let c=await d.text();throw new Error(`Bridge returned ${d.status}: ${c}`)}return d.json()}async function Fa(e,t=yn){let n=await Rn(`${t}/model/component`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!n.ok){let o=await n.text();throw new Error(`Bridge returned ${n.status}: ${o}`)}return n.json()}async function $a(e,t=yn){let n=await Rn(`${t}/model/component`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!n.ok){let o=await n.text();throw new Error(`Bridge returned ${n.status}: ${o}`)}return n.json()}async function ms(e,t,n=yn){let o=await Rn(`${n}/model/token`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e,value:t})},1e4);if(!o.ok){let r=await o.text();throw new Error(`Bridge returned ${o.status}: ${r}`)}return o.json()}async function Wa(e,t=yn){let n=await Rn(`${t}/model/token`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e})},1e4);if(!n.ok){let o=await n.text();throw new Error(`Bridge returned ${n.status}: ${o}`)}return n.json()}async function Ir(e=yn){try{let t=await Rn(`${e}/model`,{},5e3);return t.ok?(await t.json()).model??null:null}catch{return null}}async function ja(e=yn){let t=await Rn(`${e}/evals`,{},5e3);return t.ok?t.json():{version:1,updatedAt:0,cases:[]}}async function Ci(e,t,n=yn){let o=await Rn(`${n}/evals/${encodeURIComponent(e)}`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify(t)},5e3);return o.ok?(await o.json()).eval??null:null}function Ga(e,t,n=yn){return Ci(e,{status:t},n)}async function Ja(e,t,n,o=yn,r,i,a){let s=new FormData;s.append("screenshot",t,"eval-run.webp"),s.append("feedback",JSON.stringify(n)),r&&s.append("provider",r),i&&s.append("model",i),a&&s.append("sourceId",a);let l=await Rn(`${o}/evals/${encodeURIComponent(e)}/run`,{method:"POST",body:s},3e4);if(!l.ok){let d=await l.text();throw new Error(`Bridge returned ${l.status}: ${d}`)}return l.json()}function bd(e){return new Promise(t=>setTimeout(t,e))}async function hs(e=yn,t,n=15e3){let o=Date.now();try{let l=await Rn(`${e}/restart`,{method:"POST"},5e3);if(!l.ok){let d=await l.text().catch(()=>"");return{ok:!1,error:d?`Bridge restart returned ${l.status}: ${d}`:`Bridge restart returned ${l.status}`,elapsedMs:Date.now()-o}}}catch(l){return{ok:!1,error:l instanceof Error?l.message:"Bridge restart request failed",elapsedMs:Date.now()-o}}let r=null,i=e,a=Ha();for(;Date.now()-o<n;){if(await bd(350),r=await go(i),!r?.ok&&a){let l=await gs(e,a);l?.url&&(i=l.url,r=await go(i))}if(r?.ok&&!(a&&r.projectId!==a)&&!(t&&r.version!==t))return{ok:!0,status:r,elapsedMs:Date.now()-o,bridgeUrl:i}}return{ok:!1,error:`Bridge did not come back${t?` with version ${t}`:""} within ${Math.round(n/1e3)}s`,status:r,elapsedMs:Date.now()-o}}async function Ya(e=yn){return(await hs(e)).ok}async function Va(e=yn,t,n){let o=await Rn(`${e}/model/synthesize`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({provider:t,model:n})},1e4);if(!o.ok){let r=await o.text();throw new Error(`Bridge returned ${o.status}: ${r}`)}return o.json()}async function Ua(e=yn,t,n){let o=await Rn(`${e}/evals/synthesize`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({provider:t,model:n})},1e4);if(!o.ok){let r=await o.text();throw new Error(`Bridge returned ${o.status}: ${r}`)}return o.json()}async function Ka(e,t,n=yn,o,r,i,a,s){let l;if(a&&a.length>0){let d=new FormData,c=new Blob([new Uint8Array([137,80,78,71,13,10,26,10,0,0,0,13,73,72,68,82,0,0,0,1,0,0,0,1,8,6,0,0,0,31,21,196,137,0,0,0,10,73,68,65,84,120,156,98,0,0,0,2,0,1,229,39,222,252,0,0,0,0,73,69,78,68,174,66,96,130])],{type:"image/png"});d.append("screenshot",c,"screenshot.png"),d.append("feedback",JSON.stringify({threadId:e,reply:t,color:o,provider:r,model:i,sourceId:s}));for(let u=0;u<a.length;u++)d.append(`image-reply-${u}`,a[u],`reply-image-${u}.webp`);l=await Rn(`${n}/reply`,{method:"POST",body:d},3e4)}else l=await Rn(`${n}/reply`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({threadId:e,reply:t,color:o,provider:r,model:i,sourceId:s})},3e4);if(!l.ok){let d=await l.text();throw new Error(`Bridge returned ${l.status}: ${d}`)}return l.json()}var kt=globalThis.__POPMELT_BRIDGE_CONNECTION__??(globalThis.__POPMELT_BRIDGE_CONNECTION__={}),ki=kt.sourceId??(typeof localStorage<"u"?localStorage.getItem("popmelt-source-id"):null)??(typeof crypto<"u"&&typeof crypto.randomUUID=="function"?crypto.randomUUID():Math.random().toString(36).slice(2));kt.sourceId=ki;try{typeof localStorage<"u"&&localStorage.setItem("popmelt-source-id",ki)}catch{}function Ii(){return ki}var Qa={isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],activeJobThreads:{},currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,lastErrorByJob:{},pendingQuestions:[],incrementalResolutions:[],capabilitiesVersion:0},ar=kt.store??{...Qa};kt.store=ar;var Ti=kt.listeners??new Set;kt.listeners=Ti;var ho=kt.activeEs??null,Ei=kt.activeBridgeUrl??null,yo=null,Rr=kt.connectionGeneration??0,qa=kt.expectedProjectId??null,ti=new Set,lr=new Map,bo={};function sr(e,t){if(!e)return!1;if(ti.has(e)){let o=lr.get(e);return o||(o=[],lr.set(e,o)),o.push({type:t.type??"",data:t}),!0}let n=bo[e];return n!==void 0&&typeof t.seq=="number"&&t.seq<=n}async function Sd(e,t,n){let o=()=>n!==Rr;for(let r of t){if(o())return;ti.add(r),lr.set(r,[])}await Promise.all(t.map(async r=>{try{let i=await wi(e,r);if(o())return;let a=lr.get(r)??[];if(i){if(on(s=>{let l={...s.jobResponses,[r]:i.accumulated.response},d={...s.jobThinking,[r]:i.accumulated.thinking},c=[...s.events];for(let u of i.events)u.type==="done"||u.type==="error"||c.push({type:u.type,data:u,timestamp:Date.now()});return{...s,jobResponses:l,jobThinking:d,currentResponse:r===s.activeJobId?i.accumulated.response:s.currentResponse,currentThinking:r===s.activeJobId?i.accumulated.thinking:s.currentThinking,events:c}}),bo[r]=i.currentSeq,!i.jobActive){let s=i.events.find(l=>l.type==="done"||l.type==="error");s&&ys(s.type,s,r)}for(let s of a)typeof s.data.seq=="number"&&s.data.seq<=i.currentSeq||ys(s.type,s.data,r)}else for(let s of a)ys(s.type,s.data,r)}finally{ti.delete(r),lr.delete(r)}}))}function ys(e,t,n){if(e==="delta"){let o=t.text||"";on(r=>({...r,jobResponses:{...r.jobResponses,[n]:(r.jobResponses[n]||"")+o},currentResponse:n===r.activeJobId?r.currentResponse+o:r.currentResponse,events:[...r.events,{type:"delta",data:t,timestamp:Date.now()}]}))}else if(e==="thinking"){let o=t.text||"";on(r=>({...r,jobThinking:{...r.jobThinking,[n]:(r.jobThinking[n]||"")+o},currentThinking:n===r.activeJobId?r.currentThinking+o:r.currentThinking,events:[...r.events,{type:"thinking",data:t,timestamp:Date.now()}]}))}else if(e==="done")delete bo[n],on(o=>{let r=o.activeJobIds.filter(d=>d!==n),i={...o.jobResponses},a={...o.jobThinking},s=i[n];delete i[n],delete a[n];let l=n===o.activeJobId?r.length>0?r[r.length-1]:null:o.activeJobId;return{...o,activeJobIds:r,activeJobId:l,jobResponses:i,jobThinking:a,lastCompletedJobId:n,lastResponseText:s||o.currentResponse||t.responseText||null,lastThreadId:t.threadId??null,...n===o.activeJobId?{currentResponse:l&&i[l]||"",currentThinking:l&&a[l]||""}:{},events:[...o.events,{type:"done",data:t,timestamp:Date.now()}]}});else if(e==="error"){delete bo[n];let o=t.message??"";on(r=>{let i=r.activeJobIds.filter(s=>s!==n),a=i.length>0?r.status:"error";return{...r,status:a,activeJobIds:i,lastCompletedJobId:n,lastErrorByJob:o?{...r.lastErrorByJob,[n]:o}:r.lastErrorByJob,events:[...r.events,{type:"error",data:t,timestamp:Date.now()}]}})}else on(o=>({...o,events:[...o.events,{type:e,data:t,timestamp:Date.now()}]}))}var Zn=kt.discoveredBridgeUrl??null,jn=kt.discoveredBridgeProjectId??null,Uo=null,Mr=null;function wd(e){let t=e??null;if(qa!==t){ho&&(ho.close(),ho=null,kt.activeEs=null),yo&&(clearTimeout(yo),yo=null),Ei=null,kt.activeBridgeUrl=null,Zn=null,jn=null,kt.discoveredBridgeUrl=null,kt.discoveredBridgeProjectId=null,Uo=null,Mr=null,ti.clear(),lr.clear();for(let n of Object.keys(bo))delete bo[n];qa=t,kt.expectedProjectId=t,Rr+=1,kt.connectionGeneration=Rr,on(()=>({...Qa}))}}async function el(e,t){return Zn&&(t?jn===t:!jn)?Zn:(!t&&jn&&(Zn=null,jn=null,kt.discoveredBridgeUrl=Zn,kt.discoveredBridgeProjectId=jn),t&&jn&&jn!==t&&(Zn=null,jn=null,kt.discoveredBridgeUrl=Zn,kt.discoveredBridgeProjectId=jn),Uo&&Mr===(t??null)||(Mr=t??null,Uo=gs(e,t).then(n=>(Zn=n?.url??null,jn=n?.projectId??t??null,kt.discoveredBridgeUrl=Zn,kt.discoveredBridgeProjectId=jn,Uo=null,Mr=null,Zn)).catch(()=>(Uo=null,Mr=null,null))),Uo)}function tl(){return Zn}async function nl(e,t){Zn=null,jn=null,kt.discoveredBridgeUrl=null,kt.discoveredBridgeProjectId=null,Uo=null,Mr=null;let n=await el(e,t);return n&&bs(n),n}function Za(){return ar}function Cd(e){return Ti.add(e),()=>{Ti.delete(e)}}function on(e){ar=e(ar),kt.store=ar;for(let t of Ti)t()}function Ed(){return typeof window<"u"?window.__POPMELT_PROJECT_ID__??null:null}function bs(e){if(ho&&ho.readyState!==EventSource.CLOSED&&Ei===e)return;ho&&(ho.close(),ho=null,kt.activeEs=null),yo&&(clearTimeout(yo),yo=null),Ei=e,kt.activeBridgeUrl=Ei;let t=++Rr;kt.connectionGeneration=Rr;let n=new URLSearchParams({sourceId:ki}),o=Ed();o&&n.set("projectId",o);let r=new EventSource(`${e}/events?${n.toString()}`);ho=r,kt.activeEs=ho;let i=()=>t!==Rr;r.addEventListener("connected",()=>{i()||go(e).then(a=>{if(i())return;let s=a?.activeJobs??(a?.activeJob?[a.activeJob]:[]),l=new Set(s.map(b=>b.id)),d=a?.recentJobs??[],c=new Map(d.map(b=>[b.id,b])),u=s.length>0;on(b=>{let S={...b.lastErrorByJob},C=b.activeJobIds.filter(I=>!l.has(I));for(let I of C){let M=c.get(I);M?.status==="error"&&M.error&&(S[I]=M.error)}let P=b.activeJobIds.filter(I=>l.has(I));for(let I of l)P.includes(I)||P.push(I);let H={};for(let I of s)I.threadId&&(H[I.id]=I.threadId);return{...b,isConnected:!0,status:u?"streaming":C.length>0||b.status==="disconnected"?"idle":b.status,activeJobId:u?s[s.length-1].id:P.length>0?P[P.length-1]:null,activeJobIds:P,activeJobThreads:H,lastErrorByJob:S,lastCompletedJobId:C.length>0?C[C.length-1]:b.lastCompletedJobId}});let f=ar.activeJobIds.filter(b=>!l.has(b)),p=[...Array.from(l),...f];p.length>0&&Sd(e,p,t).catch(()=>{})})}),r.addEventListener("job_started",a=>{if(i())return;let s=JSON.parse(a.data),l=s.jobId;if(sr(l,s))return;let d=s.threadId;on(c=>({...c,status:"streaming",activeJobId:l,activeJobIds:c.activeJobIds.includes(l)?c.activeJobIds:[...c.activeJobIds,l],activeJobThreads:d?{...c.activeJobThreads,[l]:d}:c.activeJobThreads,jobResponses:{...c.jobResponses,[l]:c.jobResponses[l]??""},jobThinking:{...c.jobThinking,[l]:c.jobThinking[l]??""},currentResponse:c.jobResponses[l]??"",currentThinking:c.jobThinking[l]??"",lastResponseText:null,lastThreadId:null,events:[...c.events,{type:"job_started",data:s,timestamp:Date.now()}]}))}),r.addEventListener("delta",a=>{if(i())return;let s=JSON.parse(a.data),l=s.jobId;if(sr(l,s))return;let d=s.text||"";on(c=>({...c,jobResponses:l?{...c.jobResponses,[l]:(c.jobResponses[l]||"")+d}:c.jobResponses,currentResponse:!l||l===c.activeJobId?c.currentResponse+d:c.currentResponse,events:[...c.events,{type:"delta",data:s,timestamp:Date.now()}]}))}),r.addEventListener("thinking",a=>{if(i())return;let s=JSON.parse(a.data),l=s.jobId;if(sr(l,s))return;let d=s.text||"";on(c=>({...c,jobThinking:l?{...c.jobThinking,[l]:(c.jobThinking[l]||"")+d}:c.jobThinking,currentThinking:!l||l===c.activeJobId?c.currentThinking+d:c.currentThinking,events:[...c.events,{type:"thinking",data:s,timestamp:Date.now()}]}))}),r.addEventListener("tool_use",a=>{if(i())return;let s=JSON.parse(a.data),l=s.jobId;sr(l,s)||on(d=>({...d,events:[...d.events,{type:"tool_use",data:s,timestamp:Date.now()}]}))}),r.addEventListener("done",a=>{if(i())return;let s=JSON.parse(a.data),l=s.jobId;sr(l,s)||(l&&delete bo[l],on(d=>{let c=l?d.activeJobIds.filter(C=>C!==l):d.activeJobIds,u={...d.jobResponses},f={...d.jobThinking},p={...d.activeJobThreads},b=l?u[l]:void 0;l&&(delete u[l],delete f[l],delete p[l]);let S=l===d.activeJobId?c.length>0?c[c.length-1]:null:d.activeJobId;return{...d,activeJobIds:c,activeJobId:S,jobResponses:u,jobThinking:f,lastCompletedJobId:l??d.activeJobId,lastResponseText:b||d.currentResponse||s.responseText||null,lastThreadId:s.threadId??null,...l===d.activeJobId?{currentResponse:S&&u[S]||"",currentThinking:S&&f[S]||""}:{},events:[...d.events,{type:"done",data:s,timestamp:Date.now()}]}}))}),r.addEventListener("question",a=>{if(i())return;let s=JSON.parse(a.data),l=s.jobId;sr(l,s)||on(d=>({...d,pendingQuestions:[...d.pendingQuestions,{jobId:s.jobId,threadId:s.threadId,question:s.question,annotationIds:s.annotationIds,timestamp:Date.now()}],events:[...d.events,{type:"question",data:s,timestamp:Date.now()}]}))}),r.addEventListener("capabilities_changed",()=>{i()||on(a=>({...a,capabilitiesVersion:a.capabilitiesVersion+1}))}),r.addEventListener("queue_drained",()=>{if(!i()){for(let a of Object.keys(bo))delete bo[a];ti.clear(),lr.clear(),on(a=>({...a,status:a.status==="error"?"error":"idle",activeJobId:null,activeJobIds:[],activeJobThreads:{},currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastErrorByJob:{},incrementalResolutions:[]}))}}),r.addEventListener("error",a=>{if(!i()){if(r.readyState===EventSource.CLOSED)on(s=>({...s,isConnected:!1,status:"disconnected"})),yo&&(clearTimeout(yo),yo=null),yo=setTimeout(()=>{go(e).then(s=>{s&&bs(e)})},5e3);else if(a instanceof MessageEvent){let s=JSON.parse(a.data),l=s.jobId??null;if(sr(l??void 0,s))return;l&&delete bo[l];let d=s.message??"";on(c=>{let u=l?c.activeJobIds.filter(p=>p!==l):c.activeJobIds,f=u.length>0?c.status:"error";return{...c,status:f,activeJobIds:u,lastCompletedJobId:l??c.activeJobId,lastErrorByJob:l&&d?{...c.lastErrorByJob,[l]:d}:c.lastErrorByJob,events:[...c.events,{type:"error",data:s,timestamp:Date.now()}]}})}}}),r.onerror=()=>{i()||r.readyState===EventSource.CLOSED&&on(a=>({...a,isConnected:!1,status:"disconnected"}))}}function ol(e="http://localhost:1111",t=!0,n){let o=xd(Cd,Za,Za);vd(()=>{wd(n),t&&el(e,n).then(a=>{a&&go(a).then(s=>{s&&(!n||s.projectId===n)&&bs(a)})})},[e,t,n]);let r=Xa(()=>{on(()=>({...ar,events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,lastErrorByJob:{},incrementalResolutions:[]}))},[]),i=Xa(a=>{on(s=>({...s,pendingQuestions:s.pendingQuestions.filter(l=>l.threadId!==a)}))},[]);return{...o,clearEvents:r,dismissQuestion:i}}import{useEffect as Td,useReducer as kd}from"react";var Id={isAnnotating:!1,activeTool:"inspector",activeColor:"oklch(0.628 0.258 29)",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function Mi(){return Math.random().toString(36).substring(2,9)}function rl(e){return e.status?e:e.captured?{...e,status:"in_flight"}:{...e,status:"pending"}}function Bn(e){return{...e,undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}],redoStack:[]}}function Md(e,t){return{...e,isAnnotating:t}}function Rd(e,t){return{...e,activeTool:t,inspectedElement:null}}function Ad(e,t){return{...e,activeColor:t}}function Ld(e,t){return{...e,strokeWidth:t}}function Pd(e,t){return{...e,currentPath:[t]}}function Bd(e,t){return{...e,currentPath:[...e.currentPath,t]}}function Dd(e){return{...e,currentPath:[]}}function _d(e,t){if(e.currentPath.length<2&&e.activeTool!=="text")return{...e,currentPath:[]};let n={id:Mi(),type:e.activeTool,points:e.currentPath,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",pathname:typeof window<"u"?window.location.pathname:"/",groupId:t?.groupId,elements:t?.elements};return{...Bn(e),annotations:[...e.annotations,n],currentPath:[]}}function Od(e,t){let n={id:t.id??Mi(),type:"text",points:[t.point],text:t.text,fontSize:t.fontSize||12,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",pathname:typeof window<"u"?window.location.pathname:"/",groupId:t.groupId,linkedSelector:t.linkedSelector,linkedAnchor:t.linkedAnchor,elements:t.elements,...t.imageCount?{imageCount:t.imageCount}:{}};return{...t.groupId?e:Bn(e),annotations:[...e.annotations,n]}}function Hd(e,t){return{...Bn(e),annotations:e.annotations.map(o=>o.id===t.id?{...o,text:t.text,...t.imageCount!=null?{imageCount:t.imageCount}:{}}:o)}}function Nd(e,t){return{...e,annotations:e.annotations.map(n=>n.id===t.id?{...n,fontSize:Math.max(12,Math.min(72,t.fontSize))}:n)}}function zd(e,t){let n=Bn(e),r=e.annotations.find(i=>i.id===t.id)?.groupId;return{...n,annotations:e.annotations.filter(i=>i.id!==t.id&&!(r&&i.groupId===r))}}function Fd(e,t){let n=t.saveUndo?Bn(e):e,r=e.annotations.find(i=>i.id===t.id)?.groupId;return{...n,annotations:e.annotations.map(i=>{if(!(i.id===t.id||r&&i.groupId===r))return i;let s=t.delta.x,l=t.delta.y;return{...i,points:i.points.map(d=>({x:d.x+s,y:d.y+l}))}})}}function $d(e,t){let n=t.saveUndo?Bn(e):e,o=e.annotations.find(a=>a.id===t.id);if(!o||o.type==="text"||o.points.length<2)return e;let r=0,i=0;if(o.type==="rectangle"&&o.groupId){let a=t.points,s=Math.min(a[0].x,a[1].x),l=Math.max(a[0].y,a[1].y),d=o.points[0],c=o.points[o.points.length-1],u=Math.min(d.x,c.x),f=Math.max(d.y,c.y);r=s-u,i=l-f}return{...n,annotations:e.annotations.map(a=>a.id===t.id?{...a,points:t.points}:o.groupId&&a.groupId===o.groupId&&a.type==="text"?{...a,points:a.points.map(s=>({x:s.x+r,y:s.y+i}))}:a)}}function Wd(e,t){return{...Bn(e),annotations:[...e.annotations,...t.annotations.map(rl)]}}function jd(e,t){let n=new Set,o=[];for(let r of t.annotations)n.has(r.id)||(n.add(r.id),o.push(rl(r)));return{...e,annotations:o}}function Gd(e){if(e.undoStack.length===0)return e;let t=e.undoStack[e.undoStack.length-1];return{...e,annotations:t?.annotations||[],styleModifications:t?.styleModifications||[],spacingTokenMods:t?.spacingTokenMods||[],undoStack:e.undoStack.slice(0,-1),redoStack:[...e.redoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}]}}function Jd(e){if(e.redoStack.length===0)return e;let t=e.redoStack[e.redoStack.length-1];return{...e,annotations:t?.annotations||[],styleModifications:t?.styleModifications||[],spacingTokenMods:t?.spacingTokenMods||[],redoStack:e.redoStack.slice(0,-1),undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}]}}function Yd(e,t){let{id:n,addToSelection:o}=t;if(n===null)return{...e,selectedAnnotationIds:[],lastSelectedId:null};if(o)if(e.selectedAnnotationIds.includes(n)){let i=e.selectedAnnotationIds.filter(a=>a!==n);return{...e,selectedAnnotationIds:i,lastSelectedId:i.length>0?i[i.length-1]:null}}else return{...e,selectedAnnotationIds:[...e.selectedAnnotationIds,n],lastSelectedId:n};return{...e,selectedAnnotationIds:[n],lastSelectedId:n}}function Vd(e,t){let n=new Set;for(let o of e.selectedAnnotationIds){let r=e.annotations.find(i=>i.id===o);r?.groupId&&n.add(r.groupId)}return{...e,annotations:e.annotations.map(o=>{let r=e.selectedAnnotationIds.includes(o.id),i=o.groupId&&n.has(o.groupId);return!r&&!i?o:{...o,color:t.color}})}}function Ud(e){let t=typeof window<"u"?window.location.pathname:"/";return{...e,annotations:e.annotations.map(n=>({...n,captured:!0,status:n.status==="pending"||!n.status?"in_flight":n.status})),styleModifications:e.styleModifications.map(n=>!n.pathname||n.pathname===t?{...n,captured:!0}:n),spacingTokenChanges:e.spacingTokenChanges.map(n=>({...n,captured:!0}))}}function Kd(e){return{...e,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]}}function Xd(e,t){return{...e,inspectedElement:t}}function qd(e,t){let{selector:n,element:o,property:r,original:i,modified:a}=t,s=typeof window<"u"?window.location.pathname:"/",l=e.styleModifications.findIndex(d=>d.selector===n&&(!d.pathname||d.pathname===s));if(i===a&&l<0)return e;if(l>=0){let d=e.styleModifications[l];if(d.captured){let b=Bn(e),S=b.styleModifications.map((C,P)=>P===l?{...C,changes:[{property:r,original:i,modified:a}],captured:!1,pathname:s}:C);return{...b,styleModifications:S}}let c=d.changes.findIndex(b=>b.property===r),u,f=e;if(c>=0){let b=d.changes[c];a===b.original?u=d.changes.filter((S,C)=>C!==c):u=d.changes.map((S,C)=>C===c?{...S,modified:a}:S)}else{if(i===a)return e;f=Bn(e),u=[...d.changes,{property:r,original:i,modified:a}]}if(u.length===0)return{...f,styleModifications:f.styleModifications.filter((b,S)=>S!==l)};let p=f.styleModifications.map((b,S)=>S===l?{...b,changes:u}:b);return{...f,styleModifications:p}}else{let d=Bn(e),c={selector:n,element:o,changes:[{property:r,original:i,modified:a}],pathname:s};return{...d,styleModifications:[...d.styleModifications,c]}}}function Zd(e,t){let{selector:n,durableSelector:o,element:r,changes:i}=t,a=typeof window<"u"?window.location.pathname:"/",s=i.filter(c=>c.original!==c.modified);if(s.length===0)return e;let l=Bn(e),d=l.styleModifications.findIndex(c=>c.selector===n&&(!c.pathname||c.pathname===a));if(d>=0){let c=l.styleModifications[d],u=c.captured?[]:[...c.changes];for(let f of s){let p=u.findIndex(b=>b.property===f.property);p>=0?f.modified===u[p].original?u=u.filter((b,S)=>S!==p):u=u.map((b,S)=>S===p?{...b,modified:f.modified}:b):u.push(f)}return u.length===0?{...l,styleModifications:l.styleModifications.filter((f,p)=>p!==d)}:{...l,styleModifications:l.styleModifications.map((f,p)=>p===d?{...f,changes:u,captured:!1,pathname:a}:f)}}else return{...l,styleModifications:[...l.styleModifications,{selector:n,durableSelector:o,element:r,changes:s,pathname:a}]}}function Qd(e,t){let{selector:n,property:o}=t,r=typeof window<"u"?window.location.pathname:"/",i=Bn(e),a=i.styleModifications.map(s=>s.selector!==n||s.pathname&&s.pathname!==r?s:{...s,changes:s.changes.filter(l=>l.property!==o)}).filter(s=>s.changes.length>0);return{...i,styleModifications:a}}function eu(e){return e.styleModifications.length===0?{...e,inspectedElement:null}:{...Bn(e),styleModifications:[],inspectedElement:null}}function tu(e,t){return{...e,styleModifications:t}}function nu(e,t){let{updates:n}=t,o=new Map(n.map(r=>[r.id,r]));return{...e,annotations:e.annotations.map(r=>{let i=o.get(r.id);return i?{...r,points:[i.point,...r.points.slice(1)],...i.linkedAnchor?{linkedAnchor:i.linkedAnchor}:{}}:r})}}function ou(e,t){let n=new Set(t.ids);return{...e,annotations:e.annotations.map(o=>n.has(o.id)?{...o,status:t.status}:o)}}function ru(e,t){let n=new Set(t.ids),o=new Set;for(let r of e.annotations)n.has(r.id)&&r.groupId&&o.add(r.groupId);return{...e,annotations:e.annotations.map(r=>n.has(r.id)||r.groupId&&o.has(r.groupId)?{...r,threadId:t.threadId}:r)}}function iu(e,t){let n=new Set(t.ids),o=new Set;for(let r of e.annotations)n.has(r.id)&&r.groupId&&o.add(r.groupId);return{...e,annotations:e.annotations.map(r=>n.has(r.id)||r.groupId&&o.has(r.groupId)?{...r,status:"waiting_input",question:t.question,threadId:t.threadId}:r)}}function su(e,t){let n=new Map(t.resolutions.map(r=>[r.annotationId,r])),o=new Map;for(let r of e.annotations){let i=n.get(r.id);i&&r.groupId&&o.set(r.groupId,i)}return{...e,annotations:e.annotations.map(r=>{let i=n.get(r.id)||(r.groupId?o.get(r.groupId):void 0);return i?{...r,status:i.status,resolutionSummary:i.summary,scope:i.finalScope??i.inferredScope??null,replyCount:(r.replyCount??0)+1,question:void 0,threadId:r.threadId||t.threadId}:r})}}function au(e,t){let{linkedSelectors:n,styleSelectors:o}=t,r=new Set(n),i=new Set(o),a=typeof window<"u"?window.location.pathname:"/",s=new Set,l=new Set;for(let p of e.annotations)p.linkedSelector&&r.has(p.linkedSelector)&&(s.add(p.id),p.groupId&&l.add(p.groupId));for(let p of e.annotations)p.groupId&&l.has(p.groupId)&&s.add(p.id);let d=e.annotations.filter(p=>!s.has(p.id)),c=e.styleModifications.filter(p=>!i.has(p.selector)||p.pathname&&p.pathname!==a);if(d.length===e.annotations.length&&c.length===e.styleModifications.length)return e;let u=e.selectedAnnotationIds.filter(p=>!s.has(p)),f=e.inspectedElement&&i.has(e.inspectedElement.info.selector)?null:e.inspectedElement;return{...e,annotations:d,styleModifications:c,selectedAnnotationIds:u,lastSelectedId:u.length>0?u[u.length-1]:null,inspectedElement:f}}function lu(e,t){let n=e.spacingTokenChanges.findIndex(o=>o.tokenPath===t.tokenPath);return n>=0?{...e,spacingTokenChanges:e.spacingTokenChanges.map((o,r)=>r===n?t:o)}:{...e,spacingTokenChanges:[...e.spacingTokenChanges,t]}}function cu(e,t){return{...e,spacingTokenChanges:t}}function du(e,t){let n=Bn(e),o=e.spacingTokenMods.findIndex(i=>i.tokenPath===t.tokenPath),r;if(o>=0){let i=e.spacingTokenMods[o],a={...t,originalValue:i.originalValue,originalPx:i.originalPx};r=e.spacingTokenMods.map((s,l)=>l===o?a:s)}else r=[...e.spacingTokenMods,t];return{...n,spacingTokenMods:r}}function uu(e,t){let n=Bn(e),o=e.spacingTokenMods.findIndex(l=>l.tokenPath===t.tokenPath),r=o>=0?e.spacingTokenMods[o].originalValue:t.originalValue,i=o>=0?e.spacingTokenMods[o].originalPx:parseFloat(t.originalValue)||0,a={tokenPath:t.tokenPath,originalValue:r,currentValue:"__deleted__",targets:o>=0?e.spacingTokenMods[o].targets:[],originalPx:i,currentPx:0},s;return o>=0?s=e.spacingTokenMods.map((l,d)=>d===o?a:l):s=[...e.spacingTokenMods,a],{...n,spacingTokenMods:s}}var pu={SET_ANNOTATING:Md,SET_TOOL:Rd,SET_COLOR:Ad,SET_STROKE_WIDTH:Ld,START_PATH:Pd,CONTINUE_PATH:Bd,CANCEL_PATH:Dd,FINISH_PATH:_d,ADD_TEXT:Od,UPDATE_TEXT:Hd,UPDATE_TEXT_SIZE:Nd,DELETE_ANNOTATION:zd,MOVE_ANNOTATION:Fd,RESIZE_ANNOTATION:$d,PASTE_ANNOTATIONS:Wd,RESTORE_ANNOTATIONS:jd,UNDO:Gd,REDO:Jd,SELECT_ANNOTATION:Yd,UPDATE_ANNOTATION_COLOR:Vd,MARK_CAPTURED:Ud,CLEAR:Kd,SELECT_ELEMENT:Xd,MODIFY_STYLE:qd,MODIFY_STYLES_BATCH:Zd,CLEAR_STYLE:Qd,CLEAR_ALL_STYLES:eu,RESTORE_STYLE_MODIFICATIONS:tu,UPDATE_LINKED_POSITIONS:nu,CLEANUP_ORPHANED:au,SET_ANNOTATION_STATUS:ou,SET_ANNOTATION_THREAD:ru,SET_ANNOTATION_QUESTION:iu,APPLY_RESOLUTIONS:su,ADD_SPACING_TOKEN_CHANGE:lu,RESTORE_SPACING_TOKEN_CHANGES:cu,MODIFY_SPACING_TOKEN:du,DELETE_SPACING_TOKEN:uu};function fu(e,t){let n=pu[t.type];return n?n(e,t.payload):e}function il(){let[e,t]=kd(fu,Id);return Td(()=>{let n=o=>{(o.metaKey||o.ctrlKey)&&o.key==="z"&&(o.preventDefault(),o.shiftKey?t({type:"REDO"}):t({type:"UNDO"}))};return window.addEventListener("keydown",n),()=>window.removeEventListener("keydown",n)},[]),[e,t]}import{useSyncExternalStore as gu}from"react";if(typeof window<"u"&&!window.__popmeltPathPatch){window.__popmeltPathPatch=!0;for(let e of["pushState","replaceState"]){let t=History.prototype[e];History.prototype[e]=function(...n){let o=window.location.pathname;t.apply(this,n),window.dispatchEvent(new CustomEvent("popmelt:locationchange",{detail:{prevPath:o}}))}}}function mu(e){return window.addEventListener("popstate",e),window.addEventListener("popmelt:locationchange",e),()=>{window.removeEventListener("popstate",e),window.removeEventListener("popmelt:locationchange",e)}}function hu(){return window.location.pathname}function Ar(){return gu(mu,hu,()=>"/")}var sl="popmelt-toolbar-snap-position";function cr(e){return e.startsWith("top-")}function dr(e){return e.endsWith("-right")}function ni(e){return e.endsWith("-center")}function al(){try{let e=localStorage.getItem(sl);if(e&&yu(e))return e}catch{}return"bottom-right"}function ll(e){try{localStorage.setItem(sl,e)}catch{}}function yu(e){return["bottom-right","bottom-center","bottom-left","top-right","top-center","top-left"].includes(e)}function cl(e,t,n){let o=cr(e)?16:n-16-54;return ni(e)?{position:"fixed",top:o,left:t/2,transform:"translateX(-50%)"}:dr(e)?{position:"fixed",top:o,right:16,left:"auto"}:{position:"fixed",top:o,left:16,right:"auto"}}function dl(e,t,n){let r=cr(e)?{top:82}:{bottom:82},i;return ni(e)?i={left:t/2,transform:"translateX(-50%)"}:dr(e)?i={right:16}:i={left:16},{position:"fixed",...r,...i}}function ul(e,t,n){let o=cr(e),r=o?{top:78}:{bottom:78},i,a;return ni(e)?(i={left:"50%",transform:"translateX(-50%)"},a="center"):dr(e)?(i={right:16},a="flex-end"):(i={left:16},a="flex-start"),{position:"fixed",...r,...i,zIndex:9999,display:"flex",flexDirection:"column",alignItems:a}}function Ri(e){let t=cr(e),n=dr(e)||ni(e);return{position:"fixed",top:t&&n?82:16,right:16,bottom:!t&&n?82:16}}function pl(e,t,n){let r=cr(e),i,a;dr(e)||ni(e)?(i=t-16,a=i-326):(a=16,i=a+326);let s=r?82:n-16-54-12;return{left:a,right:i,y:s}}var fl=["top-left","top-center","top-right","bottom-left","bottom-center","bottom-right"];function Ai(e){let t=Object.keys(e).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!t)return null;let n=e[t],o=[];for(;n;){let r=n.type,i=r?.displayName||r?.name;i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&o.unshift(i),n=n.return}return o.length>0?{name:o[o.length-1],path:o}:null}function vs(e){let t=Object.keys(e).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!t)return[];let n=e[t],o=[];for(;n;){let r=n.type,i=typeof r=="function"||typeof r=="object"?r?.displayName||r?.name:null;i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&o.push({name:i,fiber:n}),n=n.return}return o.reverse(),o}function Li(e){let t=e,n=new Set;for(;t&&!n.has(t);){if(n.add(t),t.stateNode instanceof Element)return t.stateNode;t.child?t=t.child:t=null}return null}function gl(e){if(e.id)return`#${e.id}`;let t=e.tagName.toLowerCase(),n=Array.from(e.classList).slice(0,3).join(".");return n?`${t}.${n}`:t}function Gn(e){if(e.id&&!e.id.startsWith("radix-")&&!e.id.startsWith(":"))return`#${CSS.escape(e.id)}`;let t=[],n=e;for(;n&&n!==document.documentElement;){let o=n.tagName.toLowerCase();if(n.id&&!n.id.startsWith("radix-")&&!n.id.startsWith(":")){t.unshift(`#${CSS.escape(n.id)}`);break}let r=Array.from(n.classList).filter(a=>!a.startsWith("_")&&a.length<30).slice(0,2);r.length>0&&(o+="."+r.map(a=>CSS.escape(a)).join("."));let i=n.parentElement;if(i){let a=Array.from(i.children).filter(s=>s.tagName===n.tagName);if(a.length>1){let s=a.indexOf(n)+1;o+=`:nth-of-type(${s})`}}t.unshift(o),n=i}return t.join(" > ")}function Tn(e){try{return document.querySelector(e)}catch{return null}}function Pi(e,t=0){let n=vs(e);if(n.length===0)return null;let o=n.map(l=>l.name),r=n.length-1,i=Math.max(0,Math.min(n.length-1,r-t)),a=n[i],s=Li(a.fiber)??e;return{name:a.name,path:o,depthIndex:i,rootElement:s}}function ml(e,t){let n=vs(e),o=t.toLowerCase(),r=-1;for(let i=n.length-1;i>=0;i--){let a=n[i].name;if(a===t){let s=Li(n[i].fiber)??e;return{name:t,path:n.map(l=>l.name),depthIndex:i,rootElement:s}}if(r===-1){let s=a.toLowerCase();(s.length>=4&&o.includes(s)||o.length>=4&&s.includes(o))&&(r=i)}}if(r>=0){let i=Li(n[r].fiber)??e;return{name:t,path:n.map(a=>a.name),depthIndex:r,rootElement:i}}return null}function Lr(e){let t=Pr(),n=[],o=new Set,r=t.currentNode;for(;r=t.nextNode();){let i=ml(r,e);i&&!o.has(i.rootElement)&&(o.add(i.rootElement),n.push(i))}return n}function xs(e){let t=new Map;if(e.size===0)return t;let n=new Set(e),o=Pr(),r=new Set,i=o.currentNode;for(;(i=o.nextNode())&&n.size>0;)for(let a of n){let s=ml(i,a);if(!s||r.has(s.rootElement))continue;r.add(s.rootElement);let l=s.rootElement.getBoundingClientRect();t.set(a,l.top+window.scrollY),n.delete(a);break}for(let a of n)t.set(a,1/0);return t}function Pr(){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 Dn(e){let t={selector:gl(e),tagName:e.tagName.toLowerCase()};e.id&&(t.id=e.id),e.classList.length>0&&(t.className=Array.from(e.classList).join(" "));let n=hl(e);n&&n.length>0&&n.length<200&&(t.textContent=n);let o={};for(let a of e.attributes)a.name.startsWith("data-")&&(o[a.name]=a.value);Object.keys(o).length>0&&(t.dataAttributes=o);let r=Ai(e);r&&(t.reactComponent=r.name);let i=bu(e);return i&&(t.context=i),t}function hl(e){let t="";for(let n of e.childNodes)n.nodeType===Node.TEXT_NODE&&(t+=n.textContent||"");return t.trim()}function ur(e,t){let n=document.elementsFromPoint(e,t);for(let o of n)if(o instanceof HTMLElement&&!(o.id==="devtools-canvas"||o.id==="devtools-toolbar"||o.id==="devtools-scrim")&&!o.closest("#devtools-toolbar")&&!(o.dataset.devtools||o.closest("[data-devtools]"))&&!["html","body"].includes(o.tagName.toLowerCase()))return o;return null}function bu(e){let t=e.parentElement,n=["section","article","nav","aside","header","footer","main"];for(;t&&t!==document.body;){let o=t.tagName.toLowerCase();if(n.includes(o)&&t.id)return`${o}#${t.id}`;if(t.id&&!t.id.startsWith("radix-")&&!t.id.startsWith(":"))return`${o}#${t.id}`;t=t.parentElement}return null}function yl(e){let t=new Set,n=[],o=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 a of i){let s=a.x-o,l=a.y-r;if(s<0||l<0||s>window.innerWidth||l>window.innerHeight)continue;let d=ur(s,l);d&&!t.has(d)&&(t.add(d),n.push(Dn(d)))}return n.slice(0,3)}function Ss(e){if(e.length===0)return[];let t=e.map(o=>o.x),n=e.map(o=>o.y);return yl({minX:Math.min(...t),minY:Math.min(...n),maxX:Math.max(...t),maxY:Math.max(...n)})}function cn(e,t){return e.style.getPropertyValue(t)!==""}function vu(e,t=30){if(e<=0)return[];let n=[],o=Pr(),r=.5,i=o.currentNode;for(;(i=o.nextNode())&&n.length<t;){let a=i,s=a.getBoundingClientRect();if(s.bottom<-50||s.top>window.innerHeight+50||s.right<-50||s.left>window.innerWidth+50||s.width<1||s.height<1)continue;let l=getComputedStyle(a);!cn(a,"padding-top")&&Math.abs((parseFloat(l.paddingTop)||0)-e)<r&&n.push({element:a,property:"padding-top"}),!cn(a,"padding-bottom")&&Math.abs((parseFloat(l.paddingBottom)||0)-e)<r&&n.length<t&&n.push({element:a,property:"padding-bottom"}),!cn(a,"padding-left")&&Math.abs((parseFloat(l.paddingLeft)||0)-e)<r&&n.length<t&&n.push({element:a,property:"padding-left"}),!cn(a,"padding-right")&&Math.abs((parseFloat(l.paddingRight)||0)-e)<r&&n.length<t&&n.push({element:a,property:"padding-right"}),!cn(a,"margin-top")&&Math.abs((parseFloat(l.marginTop)||0)-e)<r&&n.length<t&&n.push({element:a,property:"margin-top"}),!cn(a,"margin-bottom")&&Math.abs((parseFloat(l.marginBottom)||0)-e)<r&&n.length<t&&n.push({element:a,property:"margin-bottom"}),!cn(a,"margin-left")&&Math.abs((parseFloat(l.marginLeft)||0)-e)<r&&n.length<t&&n.push({element:a,property:"margin-left"}),!cn(a,"margin-right")&&Math.abs((parseFloat(l.marginRight)||0)-e)<r&&n.length<t&&n.push({element:a,property:"margin-right"});let d=l.display;if((d.includes("flex")||d.includes("grid"))&&n.length<t){let c=cn(a,"gap"),u=parseFloat(l.gap)||0,f=parseFloat(l.rowGap)||0,p=parseFloat(l.columnGap)||0;!c&&Math.abs(u-e)<r?n.push({element:a,property:"gap"}):!cn(a,"row-gap")&&Math.abs(f-e)<r?n.push({element:a,property:"row-gap"}):!cn(a,"column-gap")&&Math.abs(p-e)<r&&n.push({element:a,property:"column-gap"})}}return n}function ws(e,t=30){if(e<=0)return[];let n=[],o=Pr(),r=.5,i=o.currentNode;for(;(i=o.nextNode())&&n.length<t;){let a=i,s=a.getBoundingClientRect();if(s.bottom<-50||s.top>window.innerHeight+50||s.right<-50||s.left>window.innerWidth+50||s.width<1||s.height<1)continue;let l=getComputedStyle(a),d=parseFloat(l.borderTopWidth)||0,c=parseFloat(l.borderRightWidth)||0,u=parseFloat(l.borderBottomWidth)||0,f=parseFloat(l.borderLeftWidth)||0,p=a.clientWidth,b=a.clientHeight,S=parseFloat(l.paddingTop)||0;!cn(a,"padding-top")&&Math.abs(S-e)<r&&n.push({x:s.left+f,y:s.top+d,width:p,height:e,direction:"vertical",property:"padding-top"});let C=parseFloat(l.paddingBottom)||0;!cn(a,"padding-bottom")&&Math.abs(C-e)<r&&n.length<t&&n.push({x:s.left+f,y:s.top+d+b-e,width:p,height:e,direction:"vertical",property:"padding-bottom"});let P=parseFloat(l.paddingLeft)||0;!cn(a,"padding-left")&&Math.abs(P-e)<r&&n.length<t&&n.push({x:s.left+f,y:s.top+d,width:e,height:b,direction:"horizontal",property:"padding-left"});let H=parseFloat(l.paddingRight)||0;!cn(a,"padding-right")&&Math.abs(H-e)<r&&n.length<t&&n.push({x:s.left+f+p-e,y:s.top+d,width:e,height:b,direction:"horizontal",property:"padding-right"});let I=parseFloat(l.marginTop)||0;!cn(a,"margin-top")&&Math.abs(I-e)<r&&n.length<t&&n.push({x:s.left,y:s.top-e,width:s.width,height:e,direction:"vertical",property:"margin-top"});let M=parseFloat(l.marginBottom)||0;!cn(a,"margin-bottom")&&Math.abs(M-e)<r&&n.length<t&&n.push({x:s.left,y:s.bottom,width:s.width,height:e,direction:"vertical",property:"margin-bottom"});let w=parseFloat(l.marginLeft)||0;!cn(a,"margin-left")&&Math.abs(w-e)<r&&n.length<t&&n.push({x:s.left-e,y:s.top,width:e,height:s.height,direction:"horizontal",property:"margin-left"});let $=parseFloat(l.marginRight)||0;!cn(a,"margin-right")&&Math.abs($-e)<r&&n.length<t&&n.push({x:s.right,y:s.top,width:e,height:s.height,direction:"horizontal",property:"margin-right"});let Z=l.display;if((Z.includes("flex")||Z.includes("grid"))&&n.length<t&&!cn(a,"gap")){let k=Array.from(a.children).filter(O=>{let g=getComputedStyle(O);return g.display!=="none"&&g.position!=="absolute"&&g.position!=="fixed"});if(k.length>=2)for(let O=0;O<k.length-1&&n.length<t;O++){let g=k[O].getBoundingClientRect(),m=k[O+1].getBoundingClientRect(),j=m.top-g.bottom;Math.abs(j-e)<r&&j>.5&&n.push({x:Math.min(g.left,m.left),y:g.bottom,width:Math.max(g.right,m.right)-Math.min(g.left,m.left),height:j,direction:"vertical",property:"gap"});let ue=m.left-g.right;Math.abs(ue-e)<r&&ue>.5&&n.push({x:g.right,y:Math.min(g.top,m.top),width:ue,height:Math.max(g.bottom,m.bottom)-Math.min(g.top,m.top),direction:"horizontal",property:"gap"})}}}return n}function Bi(e){return typeof e=="string"?{value:e}:e}var vl={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 bl(e,t){let n=vl[t];return n?n.includes(e):!1}function xu(e,t){let n=e.split(/\s+/);for(let o of n){if(o===t)return!0;let r=o.lastIndexOf(":");if(r>=0&&o.slice(r+1)===t)return!0}return!1}function Su(e){let t=e.lastIndexOf(":"),n=t>=0?e.slice(t+1):e,o=n.indexOf("-");if(o<0)return null;let r=n.slice(0,o),i={gap:"gap","gap-x":"column-gap","gap-y":"row-gap",p:"padding",pt:"padding-top",pb:"padding-bottom",pl:"padding-left",pr:"padding-right",px:"padding-left",py:"padding-top",m:"margin",mt:"margin-top",mb:"margin-bottom",ml:"margin-left",mr:"margin-right",mx:"margin-left",my:"margin-top"},a=n.slice(0,n.indexOf("-",o+1)>0?n.indexOf("-",o+1):o);return i[a]??i[r]??null}function Cs(e,t=30){let n=parseFloat(e.value);if(isNaN(n)||n<=0)return[];if(e.bindings&&e.bindings.length>0){let r=[],i=Pr(),a=i.currentNode;for(;(a=i.nextNode())&&r.length<t;){let s=a,l=s.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let d=s.className;if(typeof d=="string")for(let c of e.bindings){if(!xu(d,c))continue;let u=Su(c);if(u&&!(e.property&&!bl(u,e.property))){r.push({element:s,property:u});break}}}return r}let o=vu(n,t*2);return e.property?o.filter(r=>bl(r.property,e.property)).slice(0,t):o.slice(0,t)}function Es(e,t=30){let n=Cs(e,t),o=[];for(let r of n){let i=r.element,a=i.getBoundingClientRect(),s=getComputedStyle(i),l=parseFloat(s.borderTopWidth)||0,d=parseFloat(s.borderRightWidth)||0,c=parseFloat(s.borderLeftWidth)||0,u=i.clientWidth,f=i.clientHeight;switch(r.property){case"padding-top":{let p=parseFloat(s.paddingTop)||0;o.push({x:a.left+c,y:a.top+l,width:u,height:p,direction:"vertical",property:r.property});break}case"padding-bottom":{let p=parseFloat(s.paddingBottom)||0;o.push({x:a.left+c,y:a.top+l+f-p,width:u,height:p,direction:"vertical",property:r.property});break}case"padding-left":{let p=parseFloat(s.paddingLeft)||0;o.push({x:a.left+c,y:a.top+l,width:p,height:f,direction:"horizontal",property:r.property});break}case"padding-right":{let p=parseFloat(s.paddingRight)||0;o.push({x:a.left+c+u-p,y:a.top+l,width:p,height:f,direction:"horizontal",property:r.property});break}case"margin-top":{let p=parseFloat(s.marginTop)||0;o.push({x:a.left,y:a.top-p,width:a.width,height:p,direction:"vertical",property:r.property});break}case"margin-bottom":{let p=parseFloat(s.marginBottom)||0;o.push({x:a.left,y:a.bottom,width:a.width,height:p,direction:"vertical",property:r.property});break}case"margin-left":{let p=parseFloat(s.marginLeft)||0;o.push({x:a.left-p,y:a.top,width:p,height:a.height,direction:"horizontal",property:r.property});break}case"margin-right":{let p=parseFloat(s.marginRight)||0;o.push({x:a.right,y:a.top,width:p,height:a.height,direction:"horizontal",property:r.property});break}case"gap":case"row-gap":case"column-gap":{let p=Array.from(i.children).filter(b=>{let S=getComputedStyle(b);return S.display!=="none"&&S.position!=="absolute"&&S.position!=="fixed"});for(let b=0;b<p.length-1&&o.length<t;b++){let S=p[b].getBoundingClientRect(),C=p[b+1].getBoundingClientRect(),P=C.top-S.bottom;P>.5&&o.push({x:Math.min(S.left,C.left),y:S.bottom,width:Math.max(S.right,C.right)-Math.min(S.left,C.left),height:P,direction:"vertical",property:"gap"});let H=C.left-S.right;H>.5&&o.push({x:S.right,y:Math.min(S.top,C.top),width:H,height:Math.max(S.bottom,C.bottom)-Math.min(S.top,C.top),direction:"horizontal",property:"gap"})}break}}}return o}function xl(e,t){let n=new Set,o=oi(t);for(let r of e){let i=wl[r.property];if(!i)continue;let a=r.element.className;if(typeof a=="string")for(let s of i){let l=`${s}-${o}`;for(let d of a.split(/\s+/)){let c=d.lastIndexOf(":"),u=c>=0?d.slice(c+1):d;if(u===l){n.add(u);break}}}}return[...n]}function Sl(e){let t=new Set;for(let n of e)for(let[o,r]of Object.entries(vl))if(r.includes(n.property)){t.add(o);break}if(t.size===1)return[...t][0]}function Ts(e,t,n){if(t===n)return e;let o=oi(t),r=oi(n);return e.map(i=>{let a=i.lastIndexOf("-");if(a<0)return i;let s=i.slice(0,a),l=i.slice(a+1);return l===o||l===`[${t}px]`?`${s}-${r}`:i})}var wu={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 oi(e){return wu[e]??`[${e}px]`}var wl={"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 Cu(e,t,n,o){let r=wl[t];if(!r)return null;let i=oi(n);for(let a of r){let s=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+a+"-(?:"+Eu(i)+"|\\["+n+"px\\]))(?:\\s|$)"),l=e.match(s);if(l?.[1]){let d=oi(o),c=l[1].lastIndexOf(":"),u=c>=0?l[1].slice(0,c+1):"";return{matched:l[1],suggested:`${u}${a}-${d}`}}}return null}function Eu(e){return e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function Cl(e,t,n){let o=new Set,r=[];for(let i of e){let a=Gn(i.element),s=`${a}::${i.property}`;if(o.has(s))continue;o.add(s);let l=Ai(i.element),d=i.element.className||"",c=Cu(d,i.property,t,n);r.push({selector:a,reactComponent:l?.name,className:d,property:i.property,matchedClass:c?.matched,suggestedClass:c?.suggested})}return r}function Di(e,t){return window.getComputedStyle(e).getPropertyValue(t)}function _i(e,t){if(e instanceof HTMLElement){let o=e.style.getPropertyValue(t);if(o)return o}let n=t.replace(/-([a-z])/g,(o,r)=>r.toUpperCase());try{for(let o of document.styleSheets)try{let r=o.cssRules||o.rules;for(let i of r)if(i instanceof CSSStyleRule&&e.matches(i.selectorText)){let a=i.style.getPropertyValue(t);if(a)return a;let s=i.style[n];if(s)return s}}catch{}}catch{}return null}function Oi(e){let t=window.getComputedStyle(e).display;return t==="flex"||t==="inline-flex"||t==="grid"||t==="inline-grid"}function pr(e){let t=window.getComputedStyle(e);return{row:parseFloat(t.rowGap)||0,column:parseFloat(t.columnGap)||0}}function Tu(e){let t=[];for(let n of e){let o=t.find(r=>r.axis!==n.axis?!1:n.axis==="row"?Math.abs(r.y-n.y)<2&&Math.abs(r.h-n.h)<2:Math.abs(r.x-n.x)<2&&Math.abs(r.w-n.w)<2);if(o)if(n.axis==="row"){let r=Math.min(o.x,n.x),i=Math.max(o.x+o.w,n.x+n.w);o.x=r,o.w=i-r}else{let r=Math.min(o.y,n.y),i=Math.max(o.y+o.h,n.y+n.h);o.y=r,o.h=i-r}else t.push({...n})}return t}function Bo(e){let t=Array.from(e.children).filter(l=>{if(!(l instanceof HTMLElement))return!1;let d=window.getComputedStyle(l);return d.display!=="none"&&d.position!=="absolute"&&d.position!=="fixed"});if(t.length<2)return[];let n=[],o=e.getBoundingClientRect(),i=window.getComputedStyle(e).flexDirection,a=i==="column"||i==="column-reverse",s=6;for(let l=0;l<t.length-1;l++){let d=t[l].getBoundingClientRect(),c=t[l+1].getBoundingClientRect();if(c.left>d.right+.5&&n.push({axis:"column",x:d.right,y:o.top,w:c.left-d.right,h:o.height}),c.top>d.bottom+.5&&n.push({axis:"row",x:o.left,y:d.bottom,w:o.width,h:c.top-d.bottom}),!(c.left>d.right+.5)&&!(c.top>d.bottom+.5))if(a){let u=(d.bottom+c.top)/2;n.push({axis:"row",x:o.left,y:u-s/2,w:o.width,h:s})}else{let u=(d.right+c.left)/2;n.push({axis:"column",x:u-s/2,y:o.top,w:s,h:o.height})}}return Tu(n)}function ks(e,t){let n=window.getComputedStyle(e),o=n.display;if(o!=="flex"&&o!=="inline-flex")return!1;let r=n.justifyContent;if(r!=="space-between"&&r!=="space-around"&&r!=="space-evenly"&&r!=="stretch")return!1;let i=n.flexDirection;return!(t!==(i==="column"||i==="column-reverse"?"row":"column")||parseFloat(t==="row"?n.rowGap:n.columnGap)>0)}function Br(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 fr(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 Is(e){for(let t of e.childNodes)if(t.nodeType===Node.TEXT_NODE&&(t.textContent||"").trim().length>0)return!0;return!1}function Dr(e){let t=document.createRange(),n=!1;for(let c of e.childNodes)c.nodeType===Node.TEXT_NODE&&(c.textContent||"").trim().length>0&&(n||(t.setStart(c,0),n=!0),t.setEnd(c,c.textContent?.length??0));if(!n)return null;let o=t.getBoundingClientRect(),r=window.getComputedStyle(e),i=parseFloat(r.fontSize)||16,a=parseFloat(r.lineHeight);isNaN(a)&&(a=i*1.2);let s=Math.max(1,t.getClientRects().length),l=Math.max(o.height,s*a),d=(l-o.height)/2;return new DOMRect(o.x,o.y-d,o.width,l)}function ri(e){let t=window.getComputedStyle(e),n=parseFloat(t.fontSize)||16,o=parseFloat(t.lineHeight);return isNaN(o)&&(o=n*1.2),{fontSize:n,lineHeight:o}}function tt(e,t,n){e instanceof HTMLElement&&e.style.setProperty(t,n,"important")}function El(e,t,n){e instanceof HTMLElement&&e.style.removeProperty(t)}function Hi(e){for(let t of e){let n=Tn(t.selector);if(!n&&t.durableSelector&&(n=Tn(t.durableSelector),n)){let o=t.selector.match(/\[data-pm="([^"]+)"\]/)?.[1];o&&n.setAttribute("data-pm",o)}if(n)for(let o of t.changes)tt(n,o.property,o.modified)}}function Ni(e){for(let t of e){let n=Tn(t.selector);if(n)for(let o of t.changes)El(n,o.property,o.original)}}function kl(e,t,n,o){if(e)for(let r of e){if(r instanceof CSSGroupingRule){kl(r.cssRules,t,n,o);continue}if(r instanceof CSSStyleRule){let i=r.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&ku(r.style,t,n,o)}}}function ku(e,t,n,o){for(let r=0;r<e.length;r++){let i=e[r];if(i?.startsWith("--")){if(n.has(i))continue;n.add(i);let a=t.getPropertyValue(i).trim();Il(a)&&o.push({name:i,value:a,usage:`var(${i})`})}}}var zi=null,Iu=5e3;function Ms(){if(zi&&Date.now()-zi.timestamp<Iu)return zi.variables;let e=[],t=new Set,n=getComputedStyle(document.documentElement);try{for(let i of document.styleSheets)try{kl(i.cssRules||i.rules,n,t,e)}catch{}}catch{}let o=document.documentElement.style;for(let i=0;i<o.length;i++){let a=o[i];if(a?.startsWith("--")&&!t.has(a)){t.add(a);let s=n.getPropertyValue(a).trim();Il(s)&&e.push({name:a,value:s,usage:`var(${a})`})}}let r=e.sort((i,a)=>i.name.localeCompare(a.name));return zi={variables:r,timestamp:Date.now()},r}function Il(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 _r(e,t){let n=t.match(/var\((--[^,)]+)(?:,\s*([^)]+))?\)/);if(n){let o=n[1],r=n[2];return getComputedStyle(document.documentElement).getPropertyValue(o).trim()||r||t}return t}function ii(e,t){if(!e)return null;let n=Tl(e);if(!n)return null;for(let o of t){let r=Tl(o.value);if(r&&n===r)return o}return null}function Tl(e){if(!e)return null;let t=e.trim().toLowerCase();if(t.startsWith("oklch(")){let n=t.match(/oklch\(\s*([\d.]+%?)\s+([\d.]+%?)\s+([\d.]+)/);if(n){let o=n[1].endsWith("%")?parseFloat(n[1])/100:parseFloat(n[1]),r=n[2].endsWith("%")?parseFloat(n[2])/100:parseFloat(n[2]),i=parseFloat(n[3]);o=Math.round(o*100)/100,r=Math.round(r*1e3)/1e3;let a=Math.round(i);return`oklch(${o} ${r} ${a})`}}if(t.startsWith("rgb")){let n=t.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(n)return`rgb(${n[1]},${n[2]},${n[3]})`}return t.startsWith("#")?t.length===4?`#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}`:t.slice(0,7):t}import{domToCanvas as Mu}from"modern-screenshot";var Ml="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";function Ru(e){if(typeof window>"u")return!1;try{let t=new URL(e,window.location.href);return t.protocol!=="http:"&&t.protocol!=="https:"?!1:t.origin!==window.location.origin}catch{return!1}}function Rs(e){let t=document.createElement("canvas").getContext("2d");return t?(t.fillStyle=e,t.fillStyle):"#888888"}function As(e,t=[],n,o){let r=new Map,i=[];for(let s of e)if(s.groupId){let l=r.get(s.groupId)||[];l.push(s),r.set(s.groupId,l)}else i.push(s);let a=[];for(let[s,l]of r){let d=l.find(u=>u.type!=="text"),c=l.find(u=>u.type==="text");if(d){let u=d.linkedSelector||c?.linkedSelector,f=c?.imageCount||d.imageCount,p=d.pathname||c?.pathname;a.push({id:d.id,type:d.type,instruction:c?.text,...u?{linkedSelector:u}:{},...p?{pathname:p}:{},elements:d.elements||[],...f?{imageCount:f}:{}})}}for(let s of i)a.push({id:s.id,type:s.type,instruction:s.type==="text"?s.text:void 0,...s.linkedSelector?{linkedSelector:s.linkedSelector}:{},...s.pathname?{pathname:s.pathname}:{},elements:s.elements||[],...s.imageCount?{imageCount:s.imageCount}:{}});return{timestamp:new Date().toISOString(),url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},scrollPosition:{x:window.scrollX,y:window.scrollY},annotations:a,styleModifications:t,...n?{inspectedElement:n}:{},...o&&o.length>0?{spacingTokenChanges:o}:{}}}function Au(e){if(!e.points||e.points.length===0)return null;let t=e.points.map(o=>o.x),n=e.points.map(o=>o.y);return{minX:Math.min(...t),minY:Math.min(...n),maxX:Math.max(...t),maxY:Math.max(...n)}}function Lu(e,t){if(e.length===0)return[];let n=e.map(c=>({annotation:c,bounds:Au(c)})).filter(c=>c.bounds!==null);if(n.length===0)return[];n.sort((c,u)=>c.bounds.minY-u.bounds.minY);let o=Math.min(...n.map(c=>c.bounds.minY)),r=Math.max(...n.map(c=>c.bounds.maxY));if(r-o<=t){let c=(o+r)/2,u=Math.max(0,c-t/2);return[{top:u,bottom:u+t,annotations:e}]}let i=[],a=50,s=Math.max(0,o-a),l=[],d=s;for(let{annotation:c,bounds:u}of n){let f=u.maxY+a;if(f-s<=t)l.push(c),d=Math.max(d,f);else{if(l.length>0){let p=(s+d)/2,b=Math.max(0,p-t/2);i.push({top:b,bottom:b+t,annotations:l})}s=Math.max(0,u.minY-a),l=[c],d=u.maxY+a}}if(l.length>0){let c=(s+d)/2,u=Math.max(0,c-t/2);i.push({top:u,bottom:u+t,annotations:l})}return i}function Pu(e){let t=new Map;for(let n of e)if(n.linkedSelector)try{let o=document.querySelector(n.linkedSelector);if(o){let r=o.getBoundingClientRect();t.set(n.id,{x:r.left+window.scrollX,y:r.top+window.scrollY,width:r.width,height:r.height})}}catch{}return t}function Bu(e,t,n,o,r){if(e.save(),e.scale(o,o),r)for(let i of t){let a=r.get(i.id);if(!a)continue;let s=a.y-n;e.fillStyle=i.color,e.globalAlpha=.05,e.fillRect(a.x,s,a.width,a.height),e.globalAlpha=1,e.strokeStyle=i.color,e.lineWidth=1,e.setLineDash([2,4]),e.strokeRect(a.x,s,a.width,a.height),e.setLineDash([])}for(let i of t){let a=i.points.map(s=>({x:s.x,y:s.y-n}));switch(e.strokeStyle=i.color,e.fillStyle=i.color,e.lineWidth=i.strokeWidth,e.lineCap="round",e.lineJoin="round",i.type){case"freehand":if(a.length<2)break;e.beginPath(),e.moveTo(a[0].x,a[0].y);for(let s=1;s<a.length;s++)e.lineTo(a[s].x,a[s].y);e.stroke();break;case"line":if(a.length<2)break;e.beginPath(),e.moveTo(a[0].x,a[0].y),e.lineTo(a[a.length-1].x,a[a.length-1].y),e.stroke();break;case"rectangle":{if(a.length<2)break;let s=a[0],l=a[a.length-1],d=Math.min(s.x,l.x),c=Math.min(s.y,l.y),u=Math.abs(l.x-s.x),f=Math.abs(l.y-s.y);e.strokeRect(d,c,u,f);break}case"circle":{if(a.length<2)break;let s=a[0],l=a[a.length-1],d=(s.x+l.x)/2,c=(s.y+l.y)/2,u=Math.abs(l.x-s.x)/2,f=Math.abs(l.y-s.y)/2;e.beginPath(),e.ellipse(d,c,u,f,0,0,Math.PI*2),e.stroke();break}case"text":{if(!i.text||a.length<1)break;let s=a[0],l=i.fontSize||16;e.font=`${l}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`,e.fillStyle=i.color;let c=(i.imageCount&&i.imageCount>0?`[${i.imageCount} image${i.imageCount>1?"s":""}] ${i.text}`:i.text).split(`
|
|
3
|
-
`),u=l*1.2,f=4,p=0;for(let b of c)p=Math.max(p,e.measureText(b).width);e.fillRect(s.x-f,s.y-f,p+f*2,c.length*u+f*2),e.fillStyle="#ffffff",c.forEach((b,S)=>{e.fillText(b,s.x,s.y+l+S*u)});break}}}e.restore()}async function Or(e,t,n=[],o){try{let r=o?.dpr??(window.devicePixelRatio||1),i=window.innerWidth,a=window.innerHeight,s=n.filter(u=>(u.status??"pending")==="pending");console.log("[Screenshot] Starting capture with",s.length,"active annotations (filtered",n.length-s.length,"captured)");let l=Pu(s),d=Lu(s,a);if(d.length===0){let u=await Rl(e,[],window.scrollY,i,a,r,l);return u?[u]:[]}let c=[];for(let u=0;u<d.length;u++){let f=d[u],p=await Rl(e,f.annotations,f.top,i,a,r,l);p?c.push(p):console.warn(`[Screenshot] Region ${u+1} failed to capture`)}return console.log("[Screenshot] Capture complete"),c}catch(r){return console.error("[Screenshot] Capture failed:",r),[]}}async function Rl(e,t,n,o,r,i,a){try{let s=getComputedStyle(document.documentElement).backgroundColor,d=await Mu(e,{filter:f=>!(f instanceof HTMLElement&&(f.id==="devtools-canvas"||f.id==="devtools-toolbar"||f.id==="devtools-scrim"||f.dataset.devtools!==void 0)),scale:i,backgroundColor:s&&s!=="rgba(0, 0, 0, 0)"&&s!=="transparent"?s:"#ffffff",width:o,height:r,style:{transform:`translate(${-window.scrollX}px, ${-n}px)`},fetchFn:async f=>Ru(f)?Ml:!1,fetch:{placeholderImage:Ml}}),c=document.createElement("canvas");c.width=o*i,c.height=r*i;let u=c.getContext("2d");return u?(u.drawImage(d,0,0,o*i,r*i,0,0,o*i,r*i),Bu(u,t,n,i,a),new Promise(f=>{c.toBlob(p=>f(p),"image/webp",.8)})):null}catch(s){return console.error("Region capture failed:",s),null}}async function si(e){if(e.length===0)return null;if(e.length===1)return e[0];let t=await Promise.all(e.map(s=>new Promise((l,d)=>{let c=new Image;c.onload=()=>l(c),c.onerror=d,c.src=URL.createObjectURL(s)}))),n=t[0].width,o=t.reduce((s,l)=>s+l.height,0),r=document.createElement("canvas");r.width=n,r.height=o;let i=r.getContext("2d");if(!i)return null;let a=0;for(let s of t)i.drawImage(s,0,a),a+=s.height,URL.revokeObjectURL(s.src);return new Promise(s=>{r.toBlob(l=>s(l),"image/webp",.8)})}async function Al(e,t,n){try{let o=Array.isArray(e)?e:[e];if(o.length===0)return!1;let r=await si(o);if(!r)return!1;let i=r;if(r.type!=="image/png"){let d=new Image,c=URL.createObjectURL(r);await new Promise(f=>{d.onload=()=>f(),d.src=c}),URL.revokeObjectURL(c);let u=document.createElement("canvas");u.width=d.naturalWidth,u.height=d.naturalHeight,u.getContext("2d").drawImage(d,0,0),i=await new Promise(f=>u.toBlob(p=>f(p),"image/png"))}let a={"image/png":i},s=t&&t.length>0,l=n&&n.length>0;if(s||l){let d=t?t.filter(c=>(c.status??"pending")==="pending"):[];if(d.length>0||l){let c=As(d,n||[]),u=new Blob([JSON.stringify(c,null,2)],{type:"text/plain"});a["text/plain"]=u}}return await navigator.clipboard.write([new ClipboardItem(a)]),!0}catch(o){return console.warn("Clipboard write failed:",o),!1}}var Fi="0.7.7";import{useCallback as rn,useEffect as kn,useMemo as Yr,useRef as jt,useState as xt}from"react";import{useCallback as Hr,useRef as Ou}from"react";function Ls(e,t,n,o){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!r||!i)return;let a=(r.x+i.x)/2,s=(r.y+i.y)/2,l=Math.abs(i.x-r.x)/2,d=Math.abs(i.y-r.y)/2;e.beginPath(),e.strokeStyle=n,e.lineWidth=o,e.ellipse(a,s,l,d,0,0,Math.PI*2),e.stroke()}function Ps(e,t,n,o){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!(!r||!i)){e.beginPath(),e.strokeStyle=n,e.lineWidth=o,e.lineCap="round",e.lineJoin="round",e.moveTo(r.x,r.y);for(let a=1;a<t.length-1;a++){let s=t[a],l=t[a+1];if(!s||!l)continue;let d=(s.x+l.x)/2,c=(s.y+l.y)/2;e.quadraticCurveTo(s.x,s.y,d,c)}e.lineTo(i.x,i.y),e.stroke()}}function Bs(e,t,n,o){if(t.length<2)return;let r=t[0],i=t[t.length-1];!r||!i||(e.beginPath(),e.strokeStyle=n,e.lineWidth=o,e.lineCap="round",e.moveTo(r.x,r.y),e.lineTo(i.x,i.y),e.stroke())}function Ds(e,t,n,o){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!r||!i)return;let a=Math.min(r.x,i.x),s=Math.min(r.y,i.y),l=Math.abs(i.x-r.x),d=Math.abs(i.y-r.y);e.beginPath(),e.strokeStyle=n,e.lineWidth=o,e.lineCap="round",e.lineJoin="round",e.strokeRect(a,s,l,d)}var dn='"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';function Du(e,t,n){if(!t||e.measureText(t).width<=n)return[t];let o=t.split(/\s+/),r=[],i="";for(let a of o){let s=i?i+" "+a:a;i&&e.measureText(s).width>n?(r.push(i),i=a):i=s}return i&&r.push(i),r.length>0?r:[t]}function ai(e){let t=window.innerWidth-e-16;return Math.max(60,Math.min(400,t))}function Ll(e,t,n){let o=[];for(let r of t)o.push(...Du(e,r,n));return o}function li(e,t,n){if(e.measureText(t).width<=n)return t;let o="\u2026";for(let r=t.length-1;r>0;r--){let i=t.slice(0,r)+o;if(e.measureText(i).width<=n)return i}return o}function _u(e,t,n){if(e===void 0||t===void 0||n.avoidLeft===void 0&&n.avoidRight===void 0)return!0;let o=typeof window<"u"?window.innerWidth:9999,r=n.avoidLeft??0,i=n.avoidRight??o;return e+t>r&&e<i}function _s(e,t,n,o,r){let i=typeof window<"u"?window.innerHeight:9999,a=0,s=i;n&&_u(o,r,n)&&(a=n.avoidTop??a,s=n.avoidBottom??s);let l=Math.max(a,s-t);return Math.max(a,Math.min(e,l))}function Os(e,t=12,n,o){let r=t*1.4+8,i=e.y-4,a=e.x-4,s=_s(i,r,n,a,o);return s===i?e:{...e,y:s+4}}function Pl(e,t,n,o,r=12,i,a,s){if(!n)return;let l=r*1.4,d=n.replace(/\n/g," "),c=i!==void 0?i+". "+d:d;e.font=`${r}px ${dn}`,e.textBaseline="middle";let u=a!==void 0?Math.min(400,Math.max(60,window.innerWidth-a-16)):400,f=li(e,c,u),p=e.measureText(f).width,b=Os(t,r,s,p+8);e.fillStyle=o,e.fillRect(b.x-4,b.y-4,p+8,l+8),e.fillStyle="#ffffff",e.fillText(f,b.x,b.y+l/2)}var Bl=11,Hs=4,Hu=`600 ${Bl}px system-ui, -apple-system, sans-serif`;function Ns(e,t,n){return e.map(o=>({x:o.x-t,y:o.y-n}))}function Nu(e,t,n,o,r,i){let a=String(o);e.font=Hu;let l=e.measureText(a).width+Hs*2,d=Bl+Hs*2,c=t-l/2,u=n+i/2+2;e.fillStyle=r,e.fillRect(c,u,l,d),e.fillStyle="#ffffff",e.textBaseline="middle",e.fillText(a,c+Hs,u+d/2)}function zu(e,t){if(e.points.length<2&&e.type!=="text")return null;switch(e.type){case"rectangle":case"freehand":{let n,o;if(e.type==="freehand")n=Math.min(...e.points.map(r=>r.x)),o=Math.max(...e.points.map(r=>r.y));else{let r=e.points[0],i=e.points[e.points.length-1];n=Math.min(r.x,i.x),o=Math.max(r.y,i.y)}return{x:n,y:o}}case"circle":{let n=e.points[0],o=e.points[e.points.length-1],r=Math.min(n.x,o.x),i=(Math.min(n.y,o.y)+Math.max(n.y,o.y))/2;return{x:r,y:i}}case"line":{let n=e.points[0],o=e.points[e.points.length-1],r=n.y>o.y?n:o;return{x:r.x,y:r.y}}default:return null}}function Dl(){let e=Ou(null),t=Hr(()=>{let s=e.current;if(!s)return;let l=s.getContext("2d");l&&l.clearRect(0,0,s.width,s.height)},[]),n=Hr((s,l,d,c)=>{let u=e.current;if(!u)return;let f=u.getContext("2d");if(!f)return;let b=(s.status??(s.captured?"in_flight":"pending"))==="pending"||d?s.color:"#999999";switch(s.type){case"freehand":Ps(f,s.points,b,s.strokeWidth);break;case"line":Bs(f,s.points,b,s.strokeWidth);break;case"rectangle":Ds(f,s.points,b,s.strokeWidth);break;case"circle":Ls(f,s.points,b,s.strokeWidth);break;case"text":s.text&&s.points[0]&&Pl(f,s.points[0],s.text,b,s.fontSize,l,s.points[0].x,c);break}},[]),o=Hr((s,l,d,c)=>{let u=e.current;if(!u||s.length<2)return;let f=u.getContext("2d");if(f)switch(l){case"freehand":Ps(f,s,d,c);break;case"line":Bs(f,s,d,c);break;case"rectangle":Ds(f,s,d,c);break;case"circle":Ls(f,s,d,c);break}},[]),r=Hr((s,l)=>{let d=e.current;if(!d||s.points.length<2)return;let c=d.getContext("2d");if(c){if(c.fillStyle="#ffffff",c.strokeStyle=s.color,c.lineWidth=1.5,s.type==="line"){let u=s.points[0],f=s.points[s.points.length-1];[u,f].forEach(p=>{c.beginPath(),c.arc(p.x,p.y,l/2,0,Math.PI*2),c.fill(),c.stroke()});return}if(s.type==="circle"){let u=s.points[0],f=s.points[s.points.length-1],p=Math.min(u.x,f.x),b=Math.max(u.x,f.x),S=Math.min(u.y,f.y),C=Math.max(u.y,f.y),P=(p+b)/2,H=(S+C)/2;[{x:P,y:S},{x:P,y:C},{x:p,y:H},{x:b,y:H}].forEach(M=>{c.beginPath(),c.rect(M.x-l/2,M.y-l/2,l,l),c.fill(),c.stroke()});return}if(s.type==="rectangle"||s.type==="freehand"){let u,f,p,b;if(s.type==="freehand")u=Math.min(...s.points.map(C=>C.x)),f=Math.max(...s.points.map(C=>C.x)),p=Math.min(...s.points.map(C=>C.y)),b=Math.max(...s.points.map(C=>C.y));else{let C=s.points[0],P=s.points[s.points.length-1];u=Math.min(C.x,P.x),f=Math.max(C.x,P.x),p=Math.min(C.y,P.y),b=Math.max(C.y,P.y)}[{x:u,y:p},{x:f,y:p},{x:u,y:b},{x:f,y:b}].forEach(C=>{c.beginPath(),c.rect(C.x-l/2,C.y-l/2,l,l),c.fill(),c.stroke()})}}},[]),i=Hr((s,l,d,c,u,f,p,b=0,S=0,C,P,H)=>{if(t(),s.forEach(I=>{let M={...I,points:Ns(I.points,b,S)},w=C?.get(I.id),$=P?.has(I.id)??!1;n(M,w,$,H)}),l.length>0){let I=Ns(l,b,S);o(I,d,c,u)}if(f&&f.length>0&&p){let M=e.current?.getContext("2d");for(let w of f){let $=s.find(Z=>Z.id===w);if($){let Z={...$,points:Ns($.points,b,S)};if(r(Z,p),M&&$.type!=="text"&&C&&!($.groupId&&s.some(k=>k.groupId===$.groupId&&k.type==="text"))){let k=C.get($.id);if(k!==void 0){let O=zu(Z,p);if(O){let m=($.status??($.captured?"in_flight":"pending"))==="pending"?$.color:"#999999";Nu(M,O.x,O.y,k,m,p)}}}}}}},[t,n,o,r]),a=Hr(()=>{let s=e.current;if(!s)return;let l=window.devicePixelRatio||1;s.width=window.innerWidth*l,s.height=window.innerHeight*l;let d=s.getContext("2d");d&&d.scale(l,l)},[]);return{canvasRef:e,clearCanvas:t,drawAnnotation:n,drawCurrentPath:o,redrawAll:i,resizeCanvas:a}}import{useEffect as Fu,useRef as $u}from"react";function _l(){let e=$u({shift:!1,cmd:!1});return Fu(()=>{let t=r=>{r.key==="Shift"&&(e.current.shift=!0),(r.key==="Meta"||r.key==="Control")&&(e.current.cmd=!0)},n=r=>{r.key==="Shift"&&(e.current.shift=!1),(r.key==="Meta"||r.key==="Control")&&(e.current.cmd=!1)},o=()=>{e.current={shift:!1,cmd:!1}};return window.addEventListener("keydown",t,!0),window.addEventListener("keyup",n,!0),window.addEventListener("blur",o),()=>{window.removeEventListener("keydown",t,!0),window.removeEventListener("keyup",n,!0),window.removeEventListener("blur",o)}},[]),e}import{useEffect as Wu}from"react";function Ol(e,t,n,o,r){Wu(()=>{let i=a=>{if(e){if(e.linkedSelector)return;a.preventDefault(),a.stopPropagation();let l=a.deltaY>0?-2:2;t(d=>d?{...d,fontSize:Math.max(12,Math.min(72,d.fontSize+l))}:null);return}if(!n)return;a.preventDefault();let s=o.find(l=>l.id===n);if(s&&s.type==="text"&&!s.linkedSelector){let l=s.fontSize||12,d=a.deltaY>0?-2:2;r({type:"UPDATE_TEXT_SIZE",payload:{id:n,fontSize:l+d}})}};return window.addEventListener("wheel",i,{passive:!1}),()=>{window.removeEventListener("wheel",i)}},[n,e,o,r,t])}import{useEffect as Fs,useRef as ju,useState as $s}from"react";import{Fragment as ci,jsx as Kt,jsxs as zr}from"react/jsx-runtime";var Ko=22,di=12,Nr=8,Gu=3,Ju=250,$i=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Yu=3e3;function Vu(e){let t=e?.current?.getBoundingClientRect();return!t||typeof window>"u"?{}:t.top<window.innerHeight/2?{avoidTop:t.bottom+Nr,avoidLeft:t.left-Nr,avoidRight:t.right+Nr}:{avoidBottom:t.top-Nr,avoidLeft:t.left-Nr,avoidRight:t.right+Nr}}function Uu(e,t,n){if(n.avoidLeft===void 0&&n.avoidRight===void 0)return!0;let o=typeof window<"u"?window.innerWidth:9999,r=n.avoidLeft??0,i=n.avoidRight??o;return e+t>r&&e<i}function zs(e,t,n){return Uu(t,n,e)?e:{}}function Ku(e,t,n){let o=n.avoidTop!==void 0?`${n.avoidTop}px`:"0px",r=n.avoidBottom!==void 0?`${n.avoidBottom}px`:"100vh";return`translate(min(0px, calc(100vw - ${e} - 100%)), min(max(0px, calc(${o} - ${t})), calc(${r} - ${t} - 100%)))`}function Hl(e,t,n){if(n.avoidTop===void 0&&n.avoidBottom===void 0)return e;let o=typeof window<"u"?window.innerHeight:9999,r=n.avoidTop??0,i=n.avoidBottom??o,a=Math.max(r,i-t);return Math.max(r,Math.min(e,a))}function Xu({left:e,top:t,scrollX:n,scrollY:o,avoidTop:r,avoidBottom:i,style:a,children:s,...l}){let d=`calc(${e}px - var(--popmelt-scroll-x, ${n}px))`,c=`calc(${t}px - var(--popmelt-scroll-y, ${o}px))`,u=`calc(${e+di}px - var(--popmelt-scroll-x, ${n}px))`,f=`calc(${t+di}px - var(--popmelt-scroll-y, ${o}px))`;return Kt("div",{"data-devtools":"badge-hit-area",...l,style:{position:"fixed",left:0,top:0,padding:di,...a,transform:`translate3d(${d}, ${c}, 0)`,willChange:"transform"},children:Kt("div",{style:{transform:Ku(u,f,{avoidTop:r,avoidBottom:i})},children:s})})}function Nl({annotations:e,supersededAnnotations:t,inFlightIds:n,activeIds:o,queuePositions:r,scrollX:i,scrollY:a,annotationGroupMap:s,onViewThread:l,onSelectAnnotation:d,onHoverAnnotation:c,canvasRef:u,toolbarRef:f}){let p=ju(null),[b,S]=$s(0),[C,P]=$s(()=>Math.floor(Math.random()*$i.length)),H=!!(n&&n.size>0);Fs(()=>{if(!H)return;let g=setInterval(()=>{S(j=>(j+1)%Gu)},Ju),m=setInterval(()=>{P(j=>(j+1)%$i.length)},Yu);return()=>{clearInterval(g),clearInterval(m)}},[H]),Fs(()=>{let g=p.current;if(!g)return;let m=null,j=()=>{m=null,g.style.setProperty("--popmelt-scroll-x",`${window.scrollX}px`),g.style.setProperty("--popmelt-scroll-y",`${window.scrollY}px`)},ue=()=>{m===null&&(m=window.requestAnimationFrame(j))};return j(),window.addEventListener("scroll",ue,{passive:!0}),window.addEventListener("resize",ue),()=>{window.removeEventListener("scroll",ue),window.removeEventListener("resize",ue),m!==null&&window.cancelAnimationFrame(m)}},[]);let I=[];for(let g of e){if(g.type!=="text"||!g.text||!g.points[0]||t.has(g))continue;let m=g.groupId?e.filter(ie=>ie.groupId===g.groupId):[g],j=g.status??"pending",ue=m.reduce((ie,Ne)=>ie+(Ne.replyCount??0),0),Re=!!(n&&(n.has(g.id)||m.some(ie=>n.has(ie.id))))||g.status==="in_flight"||m.some(ie=>ie.status==="in_flight"),de=m.some(ie=>ie.status==="resolved"&&(ie.replyCount??0)>0||ie.status==="needs_review"),we=m.some(ie=>ie.threadId);if(!Re&&j!=="resolved"&&j!=="needs_review"&&!de&&!we)continue;let Ee=g.threadId||m.find(ie=>ie.threadId)?.threadId,V=j==="needs_review"||m.some(ie=>ie.status==="needs_review"),B=j==="waiting_input"||m.some(ie=>ie.status==="waiting_input"),re=g.points[0],ge=g.fontSize||12,_e=ge*1.4,Ue=s.get(g.id),te=g.text.replace(/\n/g," "),ot=Ue!==void 0?Ue+". "+te:te,Ke=u?.current?.getContext("2d")??document.createElement("canvas").getContext("2d");if(!Ke)continue;Ke.font=`${ge}px ${dn}`;let xe=re.x-i,Le=ai(xe),ut=li(Ke,ot,Le),W=Ke.measureText(ut).width,ee=Re&&!!o&&!o.has(g.id)&&!m.some(ie=>o.has(ie.id));I.push({id:g.id,threadId:Ee,linkedSelector:g.linkedSelector||m.find(ie=>ie.linkedSelector)?.linkedSelector,x:re.x+W+4,y:re.y-4,size:_e+8,color:g.color,isInFlight:Re,isQueued:ee,queuePosition:void 0,isNeedsReview:V,isQuestion:B,replyCount:ue})}let M=I.filter(g=>g.isQueued);if(M.length>0&&M.forEach((g,m)=>{g.queuePosition=r?.get(g.id)??`(${m+1}/${M.length})`}),I.length===0)return null;let w=2,$=u?.current?.getContext("2d")??document.createElement("canvas").getContext("2d"),Z=I.map(g=>{let m;g.isQueued?m=g.queuePosition?`queued ${g.queuePosition}`:"queued":g.isInFlight?m=$i[C]??"thinking":g.isQuestion?m="? Question":g.replyCount>0?m=`${g.replyCount} ${g.replyCount===1?"reply":"replies"}`:m="View";let j=!g.isQueued,ue=j?11:0,Re=j?4:0,de=m.length*7.2;return $&&($.font=`12px ${dn}`,de=$.measureText(m).width),4+ue+Re+de+4}),q=Vu(f),k=[];for(let g=0;g<I.length;g++){let m=I[g].y-a,j=I[g].x-i,ue=zs(q,j,Z[g]),Re=Hl(m,I[g].size,ue),de=Re+I[g].size,we=j;for(let Ee=0;Ee<g;Ee++){let V=I[Ee].y-a,B=zs(q,k[Ee],Z[Ee]),re=Hl(V,I[Ee].size,B),ge=re+I[Ee].size;if(!(Re<ge&&de>re))continue;let Ue=k[Ee]+Z[Ee];we<Ue+w&&(we=Ue+w)}k.push(we)}let O={position:"fixed",inset:0,pointerEvents:"none",zIndex:9999,"--popmelt-scroll-x":`${i}px`,"--popmelt-scroll-y":`${a}px`};return Kt("div",{ref:p,"data-devtools":"annotation-badge-layer",style:O,children:I.map((g,m)=>{let j=!!g.threadId,ue=zs(q,k[m],Z[m]);return Kt(Xu,{left:k[m]+i-di,top:g.y-di,scrollX:i,scrollY:a,avoidTop:ue.avoidTop,avoidBottom:ue.avoidBottom,onMouseDown:j?Re=>Re.stopPropagation():void 0,onClick:j?Re=>{if(Re.stopPropagation(),d?.(g.id),l?.(g.threadId),g.linkedSelector)try{let de=document.querySelector(g.linkedSelector);if(de){let we=de.getBoundingClientRect();(we.bottom<0||we.top>window.innerHeight)&&de.scrollIntoView({behavior:"smooth",block:"center"})}}catch{}}:void 0,onMouseEnter:c?()=>c(g.id):void 0,onMouseLeave:c?()=>c(null):void 0,style:{pointerEvents:j?"auto":"none",cursor:j?"pointer":void 0,zIndex:9999},children:Kt("div",{"data-devtools":"annotation-badge",style:{height:g.size,display:"flex",alignItems:"center",backgroundColor:g.color,fontFamily:dn,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:g.isQueued?zr("span",{style:{opacity:.5,color:"inherit"},children:["queued",g.queuePosition?` ${g.queuePosition}`:""]}):g.isInFlight?zr(ci,{children:[Kt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:b===1?zr(ci,{children:[Kt("circle",{cx:"7",cy:"7",r:"2"}),Kt("circle",{cx:"17",cy:"7",r:"2"}),Kt("circle",{cx:"7",cy:"17",r:"2"}),Kt("circle",{cx:"17",cy:"17",r:"2"})]}):zr(ci,{children:[Kt("circle",{cx:"12",cy:"6",r:"2"}),Kt("circle",{cx:"6",cy:"12",r:"2"}),Kt("circle",{cx:"18",cy:"12",r:"2"}),Kt("circle",{cx:"12",cy:"18",r:"2"})]})}),Kt("span",{style:{opacity:.7,color:"inherit"},children:$i[C]})]}):zr(ci,{children:[g.isQuestion||g.isNeedsReview?Kt("span",{style:{fontWeight:700,color:"inherit"},children:"?"}):Kt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:Kt("polyline",{points:"4 12 10 18 20 6"})}),Kt("span",{style:{opacity:.7,color:"inherit"},children:g.isQuestion?"Question":g.replyCount>0?`${g.replyCount} ${g.replyCount===1?"reply":"replies"}`:"View"})]})})},g.id)})})}function Ws({inFlightSelectorColors:e,animated:t=!0}){let[n,o]=$s([]);return Fs(()=>{if(e.size===0){o([]);return}let r=null,i=()=>{let l=[];for(let[d,c]of e){let u=Tn(d);if(!u)continue;let f=u.getBoundingClientRect();l.push({selector:d,top:f.top,left:f.left,width:f.width,height:f.height,color:c})}o(l)},a=()=>{r&&cancelAnimationFrame(r),r=requestAnimationFrame(i)};i(),window.addEventListener("scroll",a,!0),window.addEventListener("resize",a,!0);let s=new MutationObserver(a);return s.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",a,!0),window.removeEventListener("resize",a,!0),s.disconnect(),r&&cancelAnimationFrame(r)}},[e]),n.length===0?null:zr(ci,{children:[t&&Kt("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),n.map(r=>Kt("div",{"data-devtools":"marching-ants",style:{position:"fixed",top:r.top,left:r.left,width:r.width,height:r.height,pointerEvents:"none",zIndex:9995,overflow:"visible"},children:Kt("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible"},children:Kt("rect",{x:"0.5",y:"0.5",width:Math.max(0,r.width-1),height:Math.max(0,r.height-1),fill:"none",stroke:r.color,strokeWidth:"1",strokeDasharray:"2 4",style:t?{animation:"popmelt-march 0.5s steps(2) infinite"}:void 0})})},r.selector))]})}function Wi(e){let t=new Set,n=new Map;for(let i of e){if(!i.linkedSelector)continue;let a=n.get(i.linkedSelector)||[];a.push(i),n.set(i.linkedSelector,a)}let o=new Set,r=new Set;for(let i of n.values()){if(i.length<=1){i[0]?.groupId&&r.add(i[0].groupId);continue}i.sort((s,l)=>l.timestamp-s.timestamp);let a=i[0];a.groupId&&r.add(a.groupId);for(let s=1;s<i.length;s++){let l=i[s];t.add(l),l.groupId&&o.add(l.groupId)}}for(let i of e)i.groupId&&o.has(i.groupId)&&!r.has(i.groupId)&&t.add(i);return t}import{useEffect as zl,useLayoutEffect as qu,useState as Fl}from"react";import{jsx as js,jsxs as Wl}from"react/jsx-runtime";function Zu(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var $l=["top-left","top-right","bottom-right","bottom-left"];function jl({element:e,radius:t,accentColor:n,hoveredCorner:o,draggingCorner:r,cursorViewport:i}){let[a,s]=Fl(null),[l,d]=Fl(!1);if(zl(()=>{let P=M=>{(M.key==="Meta"||M.key==="Control")&&d(!0)},H=M=>{(M.key==="Meta"||M.key==="Control")&&d(!1)},I=()=>d(!1);return window.addEventListener("keydown",P,!0),window.addEventListener("keyup",H,!0),window.addEventListener("blur",I),()=>{window.removeEventListener("keydown",P,!0),window.removeEventListener("keyup",H,!0),window.removeEventListener("blur",I)}},[]),zl(()=>{if(!e){s(null);return}let P=()=>{s(e.getBoundingClientRect())};return P(),window.addEventListener("scroll",P,{passive:!0}),window.addEventListener("resize",P,{passive:!0}),()=>{window.removeEventListener("scroll",P),window.removeEventListener("resize",P)}},[e]),qu(()=>{e&&s(e.getBoundingClientRect())},[e,t["top-left"],t["top-right"],t["bottom-right"],t["bottom-left"]]),!a)return null;let c=a.width,u=a.height,f=Zu(n,.2),p={"top-left":{x:0,y:t["top-left"]},"top-right":{x:c,y:t["top-right"]},"bottom-right":{x:c,y:u-t["bottom-right"]},"bottom-left":{x:0,y:u-t["bottom-left"]}},b=new Set,S=r??o;if(S)if(l)b.add(S);else for(let P of $l)b.add(P);let C={position:"fixed",top:a.top,left:a.left,width:c,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"};return Wl("div",{"data-devtools":"border-radius-handles",style:C,children:[Wl("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${u}`,children:[js("rect",{x:"0.5",y:"0.5",width:Math.max(0,c-1),height:Math.max(0,u-1),fill:"none",stroke:f,strokeWidth:"1"}),$l.map(P=>{let H=p[P],I=b.has(P);return js("circle",{cx:H.x,cy:H.y,r:P===(r??o)?3:2.5,fill:n,stroke:"#ffffff",strokeWidth:P===(r??o)?4:2,paintOrder:"stroke"},P)})]}),i&&S&&(()=>{let P=Math.round(t[S]);return js("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:P})})()]})}import{useEffect as Qu,useState as ep}from"react";function gr(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);if(n)return`oklch(${n[1]} / ${t})`;let o=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);if(o){let r=parseInt(o[1],16),i=parseInt(o[2],16),a=parseInt(o[3],16);return`rgba(${r}, ${i}, ${a}, ${t})`}return`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}import{Fragment as tp,jsx as Gs,jsxs as Fr}from"react/jsx-runtime";function xo({element:e,isSelected:t=!1,elementInfo:n,color:o="#3b82f6",annotationNumber:r,changeCount:i,hideTooltip:a=!1}){let[s,l]=ep(null);if(Qu(()=>{if(!e){l(null);return}let w=()=>{let $=e.getBoundingClientRect();l($)};return w(),window.addEventListener("scroll",w,{passive:!0}),window.addEventListener("resize",w,{passive:!0}),()=>{window.removeEventListener("scroll",w),window.removeEventListener("resize",w)}},[e]),!s||!e)return null;let d={position:"fixed",top:s.top,left:s.left,width:s.width,height:s.height,pointerEvents:"none",zIndex:9996,overflow:"visible"},c=e.tagName.toLowerCase(),u=e.id?`#${e.id}`:"",f=e.classList.length>0?"."+Array.from(e.classList).slice(0,2).join("."):"",p=n?.reactComponent,b=p?`<${p}> ${c}${u}${f}`:`${c}${u}${f}`,S=22,C=s.height>=window.innerHeight,P=C?0:s.top>=S?s.top-S:s.bottom,H=C?{position:"absolute",top:8,left:8,zIndex:9997,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,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400}:{position:"fixed",top:P,left:s.left,zIndex:9997,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,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400},M=!a&&Fr("div",{"data-devtools":"tooltip",style:H,children:[r!==void 0&&Fr("span",{children:[r,"."]}),Gs("span",{style:{overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0},children:b}),i!==void 0&&i>0&&Fr("span",{style:{opacity:.8},children:["(",i," ",i===1?"change":"changes",")"]})]});return Fr(tp,{children:[Fr("div",{"data-devtools":"highlight",style:d,children:[Fr("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:[Gs("rect",{x:"2.5",y:"2.5",width:Math.max(0,s.width-5),height:Math.max(0,s.height-5),fill:gr(o,.05),stroke:"none"}),Gs("rect",{x:"0.5",y:"0.5",width:Math.max(0,s.width-1),height:Math.max(0,s.height-1),fill:"none",stroke:o,strokeWidth:"1",...!t&&{strokeDasharray:"2 4"}})]}),C&&M]}),!C&&M]})}import{useEffect as Gl,useLayoutEffect as np,useState as Js}from"react";import{jsx as Do,jsxs as Vs}from"react/jsx-runtime";function Ys(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function Us({element:e,gap:t,accentColor:n,hoveredAxis:o,draggingAxis:r,cursorViewport:i,isAutoGap:a=!1,refreshKey:s=0}){let[l,d]=Js(null),[c,u]=Js([]),[f,p]=Js(!1);if(Gl(()=>{let q=g=>{(g.key==="Meta"||g.key==="Control")&&p(!0)},k=g=>{(g.key==="Meta"||g.key==="Control")&&p(!1)},O=()=>p(!1);return window.addEventListener("keydown",q,!0),window.addEventListener("keyup",k,!0),window.addEventListener("blur",O),()=>{window.removeEventListener("keydown",q,!0),window.removeEventListener("keyup",k,!0),window.removeEventListener("blur",O)}},[]),Gl(()=>{if(!e){d(null),u([]);return}let q=()=>{d(e.getBoundingClientRect()),u(Bo(e))};return q(),window.addEventListener("scroll",q,{passive:!0}),window.addEventListener("resize",q,{passive:!0}),()=>{window.removeEventListener("scroll",q),window.removeEventListener("resize",q)}},[e]),np(()=>{e&&(d(e.getBoundingClientRect()),u(Bo(e)))},[e,t.row,t.column,s]),!l||c.length===0)return null;let b=l.width,S=l.height,C="pm-gap-stripe-pattern",P=Ys(n,.25),H=Ys(n,.1),I=Ys(n,.2),M=8,w=2,$={position:"fixed",top:l.top,left:l.left,width:b,height:S,pointerEvents:"none",zIndex:9996,overflow:"visible"},Z=r??o;return Vs("div",{"data-devtools":"gap-handles",style:$,children:[Vs("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${b} ${S}`,children:[Do("defs",{children:Do("pattern",{id:C,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Do("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:P,strokeWidth:"1.5"})})}),Do("rect",{x:"0.5",y:"0.5",width:Math.max(0,b-1),height:Math.max(0,S-1),fill:"none",stroke:I,strokeWidth:"1"}),c.map((q,k)=>{let O=q.x-l.left,g=q.y-l.top,m=q.w,j=q.h,ue=f?q.axis===Z:!0;return(q.axis==="row"?t.row:t.column)===0?null:Vs("g",{opacity:ue?1:.6,children:[Do("rect",{x:O,y:g,width:m,height:j,fill:H}),Do("rect",{x:O,y:g,width:m,height:j,fill:`url(#${C})`})]},k)}),Z&&(()=>{let q=c.filter(re=>re.axis===Z);if(q.length===0)return null;let k=q[0];if(i&&q.length>1){let re=1/0;for(let ge of q){let _e=ge.x+ge.w/2,Ue=ge.y+ge.h/2,te=Math.abs(i.x-_e)+Math.abs(i.y-Ue);te<re&&(re=te,k=ge)}}let O=k.x-l.left,g=k.y-l.top,m=k.w,j=k.h,ue=O+m/2,Re=g+j/2;if(a)return Do("circle",{cx:ue,cy:Re,r:1.5,fill:n,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let de=Z==="column",we=de?w:M,Ee=de?M:w,V=ue-we/2,B=Re-Ee/2;return Do("rect",{x:V,y:B,width:we,height:Ee,fill:n,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),i&&Z&&(()=>{let q=a?"auto":String(Math.round(Z==="row"?t.row:t.column));return Do("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:q})})()]})}import{useCallback as ap,useEffect as lp,useState as cp}from"react";import{useEffect as op,useState as Jl}from"react";var rp=3,ip=250,Ks=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],sp=3e3;function Yl(e){let[t,n]=Jl(0),[o,r]=Jl(()=>Math.floor(Math.random()*Ks.length));return op(()=>{if(!e)return;let i=setInterval(()=>n(s=>(s+1)%rp),ip),a=setInterval(()=>r(s=>(s+1)%Ks.length),sp);return()=>{clearInterval(i),clearInterval(a)}},[e]),{charIndex:t,word:Ks[o]}}import{Fragment as Xs,jsx as Hn,jsxs as $r}from"react/jsx-runtime";function dp(e){let{element:t}=e,n=t.tagName,o=t.id?`#${t.id}`:"",r=t.className?"."+t.className.split(" ").slice(0,2).join("."):"",i=t.reactComponent;return i?`<${i}> ${n}${o}${r}`:`${n}${o}${r}`}var Vl=22,ui=12,ji=8;function up(e,t,n){if(n.avoidLeft===void 0&&n.avoidRight===void 0)return!0;let o=typeof window<"u"?window.innerWidth:9999,r=n.avoidLeft??0,i=n.avoidRight??o;return e+t>r&&e<i}function pp(e,t,n){return up(t,n,e)?e:{}}function fp(e){let t=`(${e.changeCount} ${e.changeCount===1?"change":"changes"})`;return Math.min(400,44+e.label.length*7.2+t.length*7.2)}function gp(e,t,n,o){let r=n!==void 0?`${n}px`:"0px",i=o!==void 0?`${o}px`:"100vh";return`translate(min(0px, calc(100vw - max(0px, ${e}px) - 100%)), min(max(0px, calc(${r} - max(0px, ${t}px))), calc(${i} - max(0px, ${t}px) - 100%)))`}function mp({left:e,top:t,avoidTop:n,avoidBottom:o,style:r,children:i,...a}){let s=e+ui,l=t+ui;return Hn("div",{"data-devtools":"badge-hit-area",...a,style:{position:"fixed",left:`max(0px, ${e}px)`,top:`max(0px, ${t}px)`,padding:ui,...r},children:Hn("div",{style:{transform:gp(s,l,n,o)},children:i})})}function Ul({styleModifications:e,isInspecting:t,accentColor:n,annotationGroupCount:o,dispatch:r,inFlightSelectors:i,toolbarRef:a,onHoverSelector:s}){let[l,d]=cp([]),c=i&&i.size>0,{charIndex:u,word:f}=Yl(!!c);lp(()=>{if(t){d([]);return}let I=null,M=()=>{let Z=[];e.forEach((q,k)=>{let O=Tn(q.selector);if(!O)return;let g=O.getBoundingClientRect();Z.push({selector:q.selector,modIndex:k,top:g.top>=Vl?g.top-Vl:g.bottom,left:g.left,label:dp(q),changeCount:q.changes.length,annotationNumber:o+k+1})}),d(Z)},w=()=>{I&&cancelAnimationFrame(I),I=requestAnimationFrame(M)};M(),window.addEventListener("scroll",w,!0),window.addEventListener("resize",w,!0);let $=new MutationObserver(w);return $.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),window.addEventListener("load",w),document.fonts.ready.then(w),()=>{window.removeEventListener("scroll",w,!0),window.removeEventListener("resize",w,!0),window.removeEventListener("load",w),$.disconnect(),I&&cancelAnimationFrame(I)}},[e,t,o]);let p=ap(I=>{let M=e[I];if(!M)return;let w=Tn(M.selector);w&&(r({type:"SELECT_ANNOTATION",payload:{id:null}}),r({type:"SET_TOOL",payload:"inspector"}),r({type:"SELECT_ELEMENT",payload:{el:w,info:M.element}}))},[e,r]);if(l.length===0)return null;let b=a?.current?.getBoundingClientRect(),S=b?b.top<window.innerHeight/2:!1,C=b?{avoidTop:S?b.bottom+ji:void 0,avoidBottom:S?void 0:b.top-ji,avoidLeft:b.left-ji,avoidRight:b.right+ji}:{},P={display:"flex",alignItems:"center",gap:6,backgroundColor:n,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,whiteSpace:"nowrap",maxWidth:400},H={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return Hn(Xs,{children:l.map(I=>{let M=i?.has(I.selector),w=pp(C,I.left,fp(I));return Hn(mp,{left:I.left-ui,top:I.top-ui,avoidTop:w.avoidTop,avoidBottom:w.avoidBottom,onClick:()=>p(I.modIndex),onMouseEnter:s?()=>s(I.selector):void 0,onMouseLeave:s?()=>s(null):void 0,style:{zIndex:1e4,cursor:"pointer",pointerEvents:"auto"},children:$r("div",{"data-devtools":"badge",style:{...P,backgroundColor:M?"#999999":n},children:[$r("span",{children:[I.annotationNumber,"."]}),Hn("span",{style:H,children:I.label}),$r("span",{style:{opacity:.8},children:["(",I.changeCount," ",I.changeCount===1?"change":"changes",")"]}),M&&$r("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[Hn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:u===1?$r(Xs,{children:[Hn("circle",{cx:"7",cy:"7",r:"2"}),Hn("circle",{cx:"17",cy:"7",r:"2"}),Hn("circle",{cx:"7",cy:"17",r:"2"}),Hn("circle",{cx:"17",cy:"17",r:"2"})]}):$r(Xs,{children:[Hn("circle",{cx:"12",cy:"6",r:"2"}),Hn("circle",{cx:"6",cy:"12",r:"2"}),Hn("circle",{cx:"18",cy:"12",r:"2"}),Hn("circle",{cx:"12",cy:"18",r:"2"})]})}),f]})]})},I.selector)})})}import{useEffect as hp,useState as yp}from"react";import{Fragment as vp,jsx as Kl}from"react/jsx-runtime";function bp(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function Xl({styleModifications:e,accentColor:t}){let[n,o]=yp([]);if(hp(()=>{let i=null,a=()=>{let d=[];for(let c of e){let u=Tn(c.selector);if(!u)continue;let f=u.getBoundingClientRect();if(f.width===0&&f.height===0)continue;let p=fr(u);d.push({selector:c.selector,top:f.top,left:f.left,width:f.width,height:f.height,borderRadius:`${p["top-left"]}px ${p["top-right"]}px ${p["bottom-right"]}px ${p["bottom-left"]}px`})}o(d)},s=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(a)};a(),window.addEventListener("scroll",s,{passive:!0}),window.addEventListener("resize",s,{passive:!0});let l=new MutationObserver(s);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",s),window.removeEventListener("resize",s),l.disconnect(),i&&cancelAnimationFrame(i)}},[e]),n.length===0)return null;let r=bp(t,.2);return Kl(vp,{children:n.map(i=>{let a={position:"fixed",top:i.top,left:i.left,width:i.width,height:i.height,pointerEvents:"none",zIndex:9995,border:`1px solid ${r}`,borderRadius:i.borderRadius,boxSizing:"border-box"};return Kl("div",{"data-devtools":"mod-border",style:a},i.selector)})})}import{useEffect as ql,useLayoutEffect as xp,useState as Zl}from"react";import{jsx as Xo,jsxs as Zs}from"react/jsx-runtime";function qs(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var Sp={top:"bottom",bottom:"top",left:"right",right:"left"};function Qs({element:e,padding:t,accentColor:n,hoveredSide:o,draggingSide:r,cursorViewport:i,refreshKey:a}){let[s,l]=Zl(null),[d,c]=Zl(!1);if(ql(()=>{let m=Re=>{(Re.key==="Meta"||Re.key==="Control")&&c(!0)},j=Re=>{(Re.key==="Meta"||Re.key==="Control")&&c(!1)},ue=()=>c(!1);return window.addEventListener("keydown",m,!0),window.addEventListener("keyup",j,!0),window.addEventListener("blur",ue),()=>{window.removeEventListener("keydown",m,!0),window.removeEventListener("keyup",j,!0),window.removeEventListener("blur",ue)}},[]),ql(()=>{if(!e){l(null);return}let m=()=>{l(e.getBoundingClientRect())};return m(),window.addEventListener("scroll",m,{passive:!0}),window.addEventListener("resize",m,{passive:!0}),()=>{window.removeEventListener("scroll",m),window.removeEventListener("resize",m)}},[e]),xp(()=>{e&&l(e.getBoundingClientRect())},[e,t.top,t.right,t.bottom,t.left,a]),!s)return null;let u=s.width,f=s.height,{top:p,right:b,bottom:S,left:C}=t,P="pm-stripe-pattern",H=qs(n,.25),I=qs(n,.1),M=qs(n,.2),w=8,$=2,Z={position:"fixed",top:s.top,left:s.left,width:u,height:f,pointerEvents:"none",zIndex:9996,overflow:"visible"},q=["top","right","bottom","left"],k={top:`0,0 ${u},0 ${u-b},${p} ${C},${p}`,right:`${u},0 ${u},${f} ${u-b},${f-S} ${u-b},${p}`,bottom:`0,${f} ${C},${f-S} ${u-b},${f-S} ${u},${f}`,left:`0,0 ${C},${p} ${C},${f-S} 0,${f}`},O={top:{x:u/2-w/2,y:p/2-$/2,w,h:$},bottom:{x:u/2-w/2,y:f-S/2-$/2,w,h:$},left:{x:C/2-$/2,y:f/2-w/2,w:$,h:w},right:{x:u-b/2-$/2,y:f/2-w/2,w:$,h:w}},g=new Set;return r?g.add(r):o&&(g.add(o),d||g.add(Sp[o])),Zs("div",{"data-devtools":"padding-handles",style:Z,children:[Zs("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${u} ${f}`,children:[Xo("defs",{children:Xo("pattern",{id:P,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Xo("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:H,strokeWidth:"1.5"})})}),Xo("rect",{x:"0.5",y:"0.5",width:Math.max(0,u-1),height:Math.max(0,f-1),fill:"none",stroke:M,strokeWidth:"1"}),q.map(m=>{if(t[m]<=0)return null;let ue=g.has(m);return Zs("g",{opacity:ue?1:.6,children:[Xo("polygon",{points:k[m],fill:I}),Xo("polygon",{points:k[m],fill:`url(#${P})`})]},m)}),q.map(m=>{let j=O[m],ue=g.has(m);return Xo("rect",{x:j.x,y:j.y,width:j.w,height:j.h,fill:n,stroke:"#ffffff",strokeWidth:ue?4:2,paintOrder:"stroke"},`handle-${m}`)})]}),i&&(o||r)&&(()=>{let j=Math.round(t[r??o]);return Xo("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:j})})()]})}import{useCallback as So,useEffect as eo,useMemo as qi,useRef as zn,useState as vn}from"react";import{Check as Xi,ChevronDown as aa,MoveHorizontal as dc,Shrink as Yp}from"lucide-react";var wp="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",Wr={borderWidth:3,borderStyle:"solid",borderImage:`url("${wp}") 4 / 1.9 / 0 round`};function Gi({color:e="rgb(0,0,0)",animated:t=!1}={}){let n=`<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='${e}' stroke-width='.75'/></svg>`;return{position:"absolute",inset:-3,padding:5,backgroundImage:`url("data:image/svg+xml,${encodeURIComponent(n)}")`,backgroundSize:"5px 5px",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",maskComposite:"exclude",pointerEvents:"none",...t?{animation:"popmelt-border-march 0.8s linear infinite"}:{}}}var Ji={"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 jr(e){return Ji[e]?.[0]??"px"}function qo(e){let t=e.match(/^([\d.-]+)(.*)$/);return t?{num:parseFloat(t[1]),unit:t[2]||""}:{num:0,unit:""}}function Yi(e,t,n,o){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 a=parseFloat(r);if(!isNaN(a)){if(o){let{unit:s}=qo(n);return`${a}${s||jr(t)}`}return`${a}${jr(t)}`}return r}function ea(e,t){if(!t||t==="px")return e;if(t==="rem"){let n=parseFloat(getComputedStyle(document.documentElement).fontSize)||16;return Math.round(e/n*1e3)/1e3}return e}import{useCallback as Cp,useEffect as Ep,useRef as Ql,useState as Tp}from"react";import{Plus as ec,X as kp}from"lucide-react";import{jsx as Nn,jsxs as mr}from"react/jsx-runtime";var Vi=[{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 Ip(e){if(!e||e==="none")return[];let t=[],n=/([\w-]+)\(([^)]+)\)/g,o;for(;(o=n.exec(e))!==null;){let r=o[1],i=o[2],a=parseFloat(i);isNaN(a)||t.push({name:r,value:a})}return t}function ta(e){return e.length===0?"none":e.map(t=>{let o=Vi.find(r=>r.name===t.name)?.unit??"";return`${t.name}(${t.value}${o})`}).join(" ")}function tc({value:e,onChange:t,accentColor:n,modified:o,panelContentRef:r}){let i=Ip(e),[a,s]=Tp(!1),l=Ql(null),d=Ql(null);Ep(()=>{if(!a)return;let I=M=>{l.current&&!M.composedPath().includes(l.current)&&s(!1)};return document.addEventListener("mousedown",I,!0),()=>document.removeEventListener("mousedown",I,!0)},[a]);let c=Vi.filter(I=>!i.some(M=>M.name===I.name)),u=I=>{let M=[...i,{name:I.name,value:I.defaultValue}];t(ta(M)),s(!1)},f=I=>{let M=i.filter((w,$)=>$!==I);t(ta(M))},p=(I,M)=>{let w=i.map(($,Z)=>Z===I?{...$,value:M}:$);t(ta(w))},b={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},S=Cp(I=>{if(!d.current)return{position:"fixed",top:0,left:0};let M=d.current.getBoundingClientRect(),w=r?.current?.getBoundingClientRect(),$=I*24+8;return{position:"fixed",...window.innerHeight-M.bottom<$?{bottom:window.innerHeight-M.top+2}:{top:M.bottom+2},left:w?w.left+4:M.left,width:w?w.width-8:140,zIndex:10001}},[r]),C={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)"},P={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"},H=I=>Nn("div",{ref:l,style:{...S(I.length),...C},children:I.map(M=>Nn("button",{type:"button",onClick:()=>u(M),style:P,onMouseEnter:w=>{w.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:w=>{w.currentTarget.style.backgroundColor="transparent"},children:M.label},M.name))});return i.length===0?mr("div",{children:[mr("div",{style:{display:"flex",alignItems:"center",gap:4},children:[Nn(_o,{modified:!1,children:Nn("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:{...b,color:"#999",cursor:"default"}})}),Nn("button",{ref:d,type:"button",onClick:()=>s(!a),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,padding:0,border:"none",borderRadius:2,backgroundColor:"transparent",color:"#94a3b8",cursor:"pointer",flexShrink:0},children:Nn(ec,{size:12})})]}),a&&H(Vi)]}):mr("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[i.map((I,M)=>{let w=Vi.find($=>$.name===I.name);return w?mr("div",{style:{display:"flex",alignItems:"center",gap:4},children:[Nn("span",{style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:o?n:"#94a3b8",fontWeight:o?600:400,width:56,flexShrink:0,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:w.label}),Nn(_o,{modified:o,children:mr("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[Nn("input",{type:"range",min:w.min,max:w.max,step:w.step,value:I.value,onChange:$=>p(M,parseFloat($.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${n} ${(I.value-w.min)/(w.max-w.min)*100}%, rgba(0,0,0,0.1) ${(I.value-w.min)/(w.max-w.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),Nn("input",{type:"number",min:w.min,max:w.max,step:w.step,value:w.unit==="px"||w.unit==="deg"?Math.round(I.value):Math.round(I.value*100)/100,onChange:$=>p(M,parseFloat($.target.value)||0),style:{...b,width:44,padding:"2px 4px",textAlign:"right",flexShrink:0}}),w.unit&&Nn("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:w.unit})]})}),Nn("button",{type:"button",onClick:()=>f(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:Nn(kp,{size:10})})]},I.name):null}),c.length>0&&mr("div",{children:[mr("button",{ref:d,type:"button",onClick:()=>s(!a),style:{display:"flex",alignItems:"center",gap:4,padding:"2px 4px",border:"none",borderRadius:2,backgroundColor:"transparent",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#94a3b8",cursor:"pointer"},children:[Nn(ec,{size:10}),"Add filter"]}),a&&H(c)]})]})}import{useCallback as ao,useEffect as Lp,useRef as Ui,useState as nc}from"react";import{AlignHorizontalSpaceAround as Pp,AlignVerticalSpaceAround as Bp,Columns3 as Dp,Grid2x2 as _p,RectangleHorizontal as Op,Rows3 as Hp,UnfoldHorizontal as oc,UnfoldVertical as rc}from"lucide-react";import{useCallback as Mp,useEffect as Rp,useRef as pi}from"react";import{jsx as Ap}from"react/jsx-runtime";var na=[0,1,2,4,8,12,16,20,24,28,32];function Gr({value:e,onChange:t,onPreview:n,onScrubEnd:o,onReset:r,isModified:i,accentColor:a,defaultUnit:s="rem",snapSteps:l,color:d,style:c,children:u}){let f=pi(null),p=pi(null),b=pi(r),S=pi(i),C=pi(!1);b.current=r,S.current=i,Rp(()=>{let H=M=>{let w=p.current;if(!w)return;w.hasMoved=!0,C.current=M.shiftKey;let $=w.unit==="rem"||w.unit==="em"?.1:1;w.accum+=M.movementX*$;let Z=Math.max(0,Math.round((w.startValue+w.accum)*10)/10);if(M.shiftKey&&l){let q=w.unit==="rem"||w.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,k=w.unit==="rem"||w.unit==="em"?Z*q:Z,O=l[l.length-1];for(let g=0;g<l.length-1;g++){let m=l[g],j=l[g+1];if(k<=(m+j)/2){O=m;break}if(k<j){O=j;break}}k>l[l.length-1]&&(O=Math.round(k/8)*8),Z=w.unit==="rem"||w.unit==="em"?Math.round(O/q*1e3)/1e3:O}n?.(`${Z}${w.unit}`)},I=()=>{let M=p.current;if(!M)return;let w=Math.max(0,Math.round((M.startValue+M.accum)*10)/10);if(C.current&&l){let Z=M.unit==="rem"||M.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,q=M.unit==="rem"||M.unit==="em"?w*Z:w,k=l[l.length-1];for(let O=0;O<l.length-1;O++){let g=l[O],m=l[O+1];if(q<=(g+m)/2){k=g;break}if(q<m){k=m;break}}q>l[l.length-1]&&(k=Math.round(q/8)*8),w=M.unit==="rem"||M.unit==="em"?Math.round(k/Z*1e3)/1e3:k}let $=M.hasMoved&&w!==M.startValue;p.current=null,document.exitPointerLock(),$?t(`${w}${M.unit}`):M.hasMoved?n?.(`${M.startValue}${M.unit}`):S.current&&b.current&&b.current(),o?.()};return document.addEventListener("mousemove",H),document.addEventListener("mouseup",I),()=>{document.removeEventListener("mousemove",H),document.removeEventListener("mouseup",I)}},[t,n,o]);let P=Mp(H=>{if(H.button!==0)return;H.preventDefault();let I=qo(e),M=I.unit&&I.unit!=="px"?I.unit:s;p.current={startValue:I.num,unit:M,accum:0,hasMoved:!1},f.current?.requestPointerLock()},[e,s]);return Ap("span",{ref:f,onMouseDown:P,title:i?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:{color:i?a||"#3b82f6":d||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize",...c},children:u})}import{Fragment as oa,jsx as Pe,jsxs as gn}from"react/jsx-runtime";function Np({gridCols:e,gridRows:t,gridModified:n,accentColor:o,onColsChange:r,onRowsChange:i}){return Pe(Jn,{style:{width:100},children:gn("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[Pe("input",{type:"number",min:1,max:12,value:e,onChange:a=>r(parseInt(a.target.value)||1),style:{...bn,width:32,textAlign:"center",padding:2}}),Pe("span",{style:{fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:n?o:"#999",fontWeight:n?600:400,fontSize:11,margin:"0 4px"},children:"\xD7"}),Pe("input",{type:"number",min:1,max:12,value:t,onChange:a=>i(parseInt(a.target.value)||1),style:{...bn,width:32,textAlign:"center",padding:2}})]})})}function ic({element:e,getValue:t,getOriginalValue:n,handleChange:o,isModified:r,onResetProperty:i,isCollapsed:a,onToggle:s,sectionHeaderStyle:l,activeDropdown:d,onDropdownChange:c,panelContentRef:u,accentColor:f,onFieldHover:p,preferredUnit:b,onUnitCycle:S}){let C=c,P=t("display"),H=t("flex-direction"),I=sc(P,H),M=P==="flex"||P==="inline-flex",w=P==="grid",$=M||w,Z=H==="column"||H==="column-reverse",q=t("width"),k=t("height"),O=r("width")?q:_i(e,"width"),g=r("height")?k:_i(e,"height"),m=ra(q,O),j=ra(k,g),ue=t("min-width"),Re=t("max-width"),de=t("min-height"),we=t("max-height"),Ee=Jr(t("padding")),V=t("gap"),B=t("row-gap"),re=t("column-gap"),ge=t("grid-template-columns"),_e=t("grid-template-rows"),Ue=t("overflow"),te=ge.split(/\s+/).filter(J=>J&&J!=="none").length||1,ot=_e.split(/\s+/).filter(J=>J&&J!=="none").length||1,[Ke,xe]=nc(!1),Le=d!==null,ut=Le||Ke,W=Le?.3:Ke?.65:1,ee=({mode:J,icon:ke,active:Ze})=>Pe("button",{type:"button",onClick:()=>ac(J,o),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:Ze?gr(f,.15):"transparent",color:Ze?f:"#64748b",cursor:"pointer",fontSize:14},children:ke}),ie=(J,ke,Ze)=>{Ze==="fixed"?o(J,ke):o(J,Ki(Ze,ke))},Ne=J=>{let ke=Jr(t("padding")),Ze=J||"0";o("padding",`${ke.top} ${Ze} ${ke.bottom} ${Ze}`)},pt=J=>{let ke=Jr(t("padding")),Ze=J||"0";o("padding",`${Ze} ${ke.right} ${Ze} ${ke.left}`)},[Te,rt]=nc({}),st=ao((J,ke)=>Ze=>{ke(Ze),rt(Ct=>({...Ct,[J]:Ze}))},[]),Ye=ao(J=>{rt(ke=>{let Ze={...ke};return delete Ze[J],Ze})},[]),It=ao(J=>{let ke=Jr(t("padding"));tt(e,"padding",`${ke.top} ${J} ${ke.bottom} ${J}`)},[e,t]),Xt=ao(J=>{let ke=Jr(t("padding"));tt(e,"padding",`${J} ${ke.right} ${J} ${ke.left}`)},[e,t]),Jt=ao(J=>ke=>{tt(e,J,ke)},[e]),Xe=Z?"row":"column",je=Xe==="row"?"row-gap":"column-gap",an=je==="row-gap"?B||V:re||V,nt=r(je)||r("gap"),Mt=ao(()=>{let ke=Bo(e).find(Ct=>Ct.axis===Xe);if(ke)return Xe==="row"?ke.h:ke.w;let Ze=pr(e);return Xe==="row"?Ze.row:Ze.column},[e,Xe]),oe=ao(()=>{let J=t("justify-content");return J==="space-between"?"between":J==="space-around"||J==="space-evenly"?"around":"fixed"},[t])(),Ce=ao((J,ke)=>{if(J==="fixed"){let Ze=Math.max(0,Math.round(Mt()*1e3)/1e3),Ct=ke||(Ze>0?`${Ze}px`:"8px");o("justify-content","normal"),o(je,Ct);return}o("justify-content",J==="between"?"space-between":"space-around"),o(je,"0px")},[je,Mt,o]),Be=ao(J=>{if(oe!=="fixed"){Ce("fixed",J);return}o(je,J)},[Ce,oe,je,o]),Ge=ao(J=>{tt(e,"justify-content","normal"),tt(e,je,J)},[e,je]),Pt=J=>J==="center"?1:J==="flex-end"||J==="end"?2:0,$e=Pt(t("justify-content")),lt=Pt(t("align-items")),qe=Z?lt:$e,Ot=Z?$e:lt,_n=Ui(null),Yt=Ui({x:0,y:0}),xn=Ui({col:qe,row:Ot});xn.current={col:qe,row:Ot};let no=ao((J,ke)=>{let Ze=["flex-start","center","flex-end"];Z?(o("justify-content",Ze[ke]),o("align-items",Ze[J])):(o("justify-content",Ze[J]),o("align-items",Ze[ke]))},[Z,o]),On=Ui(no);On.current=no,Lp(()=>{let ke=Ze=>{let Ct=_n.current;if(!Ct||!Ze.composedPath().includes(Ct))return;Ze.preventDefault(),Ze.stopPropagation(),Yt.current.x+=Ze.deltaX,Yt.current.y+=Ze.deltaY;let{col:ln,row:dt}=xn.current,Ie=!1;Math.abs(Yt.current.x)>=30&&(ln=Math.max(0,Math.min(2,ln+(Yt.current.x>0?1:-1))),Yt.current.x=0,Yt.current.y=0,Ie=!0),!Ie&&Math.abs(Yt.current.y)>=30&&(dt=Math.max(0,Math.min(2,dt+(Yt.current.y>0?1:-1))),Yt.current.x=0,Yt.current.y=0,Ie=!0),Ie&&(ln!==xn.current.col||dt!==xn.current.row)&&On.current(ln,dt)};return document.addEventListener("wheel",ke,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",ke,{capture:!0})},[]);let Kn=()=>Pe("div",{ref:_n,onMouseEnter:()=>{xe(!0),u.current&&(u.current.style.overflowY="hidden")},onMouseLeave:()=>{xe(!1),u.current&&(u.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:Qn,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(ke=>Pe("button",{type:"button",onClick:()=>no(ke,J),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:ke===qe&&J===Ot?Pe("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:ke===0?gn(oa,{children:[Pe("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:f}),Pe("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:f}),Pe("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:f})]}):ke===1?gn(oa,{children:[Pe("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:f}),Pe("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:f}),Pe("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:f})]}):gn(oa,{children:[Pe("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:f}),Pe("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:f}),Pe("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:f})]})}):Pe("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${J}-${ke}`)))}),We=r("grid-template-columns")||r("grid-template-rows");return gn("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Pe("div",{style:l,children:Pe("span",{children:$?"Auto layout":"Layout"})}),gn("div",{style:{padding:"8px 12px"},children:[gn("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:Qn,borderRadius:2,padding:2,opacity:W,transition:"opacity 150ms ease"},children:[Pe(ee,{mode:"block",icon:Pe(Op,{size:16}),active:I==="block"}),Pe(ee,{mode:"flex-col",icon:Pe(Hp,{size:16}),active:I==="flex-col"}),Pe(ee,{mode:"flex-row",icon:Pe(Dp,{size:16}),active:I==="flex-row"}),Pe(ee,{mode:"grid",icon:Pe(_p,{size:16}),active:I==="grid"})]}),gn("div",{style:{display:"flex",gap:4,marginBottom:8},children:[Pe(ia,{label:"W",property:"width",cssValue:m==="fixed"?q:`${Math.round(e.getBoundingClientRect().width)}px`,mode:m,onValueChange:J=>o("width",J),onModeChange:J=>{if(J==="fixed"){let ke=e.getBoundingClientRect();o("width",`${Math.round(ke.width)}px`)}else o("width",Ki(J,q))},modified:r("width"),dimmed:Le&&d!=="width",dropdownOpen:d==="width",onDropdownChange:J=>C(J?"width":null),panelContentRef:u,accentColor:f,onReset:()=>i("width"),minValue:ue!=="none"&&ue!=="0px"&&ue!=="auto"?ue:"",maxValue:Re!=="none"&&Re!=="auto"?Re:"",onMinChange:J=>o("min-width",J||"0"),onMaxChange:J=>o("max-width",J||"none"),onMinReset:()=>i("min-width"),onMaxReset:()=>i("max-width"),minModified:r("min-width"),maxModified:r("max-width")}),Pe(ia,{label:"H",property:"height",cssValue:j==="fixed"?k:`${Math.round(e.getBoundingClientRect().height)}px`,mode:j,onValueChange:J=>o("height",J),onModeChange:J=>{if(J==="fixed"){let ke=e.getBoundingClientRect();o("height",`${Math.round(ke.height)}px`)}else o("height",Ki(J,k))},modified:r("height"),dimmed:Le&&d!=="height",dropdownOpen:d==="height",onDropdownChange:J=>C(J?"height":null),panelContentRef:u,minValue:de!=="none"&&de!=="0px"&&de!=="auto"?de:"",maxValue:we!=="none"&&we!=="auto"?we:"",onMinChange:J=>o("min-height",J||"0"),onMaxChange:J=>o("max-height",J||"none"),onMinReset:()=>i("min-height"),onMaxReset:()=>i("max-height"),minModified:r("min-height"),maxModified:r("max-height"),accentColor:f,onReset:()=>i("height")})]}),M&&gn("div",{onMouseEnter:()=>p?.("gap"),onMouseLeave:()=>p?.("element"),style:{display:"flex",gap:8,marginBottom:8},children:[Pe("div",{style:{opacity:Le?.3:1,transition:"opacity 150ms ease"},children:Kn()}),gn("div",{style:{flex:1,opacity:W,transition:"opacity 150ms ease"},children:[Pe("div",{onClick:nt?()=>{i(je),i("gap")}:void 0,title:nt?"Click to reset":void 0,style:{fontSize:9,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:nt?f:"#999",fontWeight:nt?600:400,marginBottom:2,cursor:nt?"pointer":"default"},children:"Gap"}),Pe("div",{style:{display:"flex",gap:2,marginBottom:4,backgroundColor:Qn,borderRadius:2,padding:2},children:["fixed","between","around"].map(J=>{let ke=oe===J;return Pe("button",{type:"button",onClick:()=>Ce(J),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"4px 6px",border:"none",borderRadius:2,backgroundColor:ke?gr(f,.15):"transparent",color:ke?f:"#64748b",cursor:"pointer",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontWeight:ke?600:400,textTransform:"capitalize"},children:J},J)})}),Pe(Jn,{dimmed:Le,children:gn("div",{style:{display:"flex",alignItems:"center"},children:[Pe(Gr,{value:an,onChange:J=>{Ye("gap"),Be(J)},onPreview:st("gap",Ge),onScrubEnd:()=>Ye("gap"),onReset:()=>{i(je),i("gap")},isModified:nt,accentColor:f,defaultUnit:b,children:H==="column"||H==="column-reverse"?Pe(rc,{size:12,strokeWidth:nt?2.5:1.5}):Pe(oc,{size:12,strokeWidth:nt?2.5:1.5})}),Pe(lo,{property:je,value:Te.gap||(oe==="fixed"?an:`${Math.max(0,Math.round(Mt()*1e3)/1e3)}px`),onChange:J=>Be(J),isModified:nt||"gap"in Te,style:{...bn,flex:1,minWidth:0},unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:S})]})})]})]}),w&&gn("div",{onMouseEnter:()=>p?.("gap"),onMouseLeave:()=>p?.("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:W,transition:"opacity 150ms ease"},children:[Pe(Np,{gridCols:te,gridRows:ot,gridModified:We,accentColor:f,onColsChange:J=>o("grid-template-columns",`repeat(${J}, 1fr)`),onRowsChange:J=>o("grid-template-rows",`repeat(${J}, 1fr)`)}),gn("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[Pe(Jn,{dimmed:Le,children:gn("div",{style:{display:"flex",alignItems:"center"},children:[Pe(Gr,{value:re||V,onChange:J=>{Ye("column-gap"),o("column-gap",J)},onPreview:st("column-gap",Jt("column-gap")),onScrubEnd:()=>Ye("column-gap"),onReset:()=>i("column-gap"),isModified:r("column-gap"),accentColor:f,defaultUnit:b,children:Pe(oc,{size:12,strokeWidth:r("column-gap")?2.5:1.5})}),Pe(lo,{property:"column-gap",value:Te["column-gap"]||re||V,onChange:J=>o("column-gap",J),isModified:r("column-gap")||"column-gap"in Te,placeholder:"col",style:{...bn,flex:1,minWidth:0},unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:S})]})}),Pe(Jn,{dimmed:Le,children:gn("div",{style:{display:"flex",alignItems:"center"},children:[Pe(Gr,{value:B||V,onChange:J=>{Ye("row-gap"),o("row-gap",J)},onPreview:st("row-gap",Jt("row-gap")),onScrubEnd:()=>Ye("row-gap"),onReset:()=>i("row-gap"),isModified:r("row-gap"),accentColor:f,defaultUnit:b,children:Pe(rc,{size:12,strokeWidth:r("row-gap")?2.5:1.5})}),Pe(lo,{property:"row-gap",value:Te["row-gap"]||B||V,onChange:J=>o("row-gap",J),isModified:r("row-gap")||"row-gap"in Te,placeholder:"row",style:{...bn,flex:1,minWidth:0},unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:S})]})})]})]}),$&&gn("div",{onMouseEnter:()=>p?.("padding"),onMouseLeave:()=>p?.("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:W,transition:"opacity 150ms ease"},children:[Pe(Jn,{style:{flex:1},dimmed:Le,children:gn("div",{style:{display:"flex",alignItems:"center"},children:[Pe(Gr,{value:Ee.left,onChange:J=>{Ye("padding-h"),Ne(J)},onPreview:st("padding-h",It),onScrubEnd:()=>Ye("padding-h"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:f,defaultUnit:b,snapSteps:na,children:Pe(Pp,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Pe(lo,{property:"padding",value:Te["padding-h"]||Ee.left,onChange:J=>Ne(J),isModified:r("padding")||"padding-h"in Te,placeholder:"H pad",style:{...bn,flex:1,minWidth:0},unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:S})]})}),Pe(Jn,{style:{flex:1},dimmed:Le,children:gn("div",{style:{display:"flex",alignItems:"center"},children:[Pe(Gr,{value:Ee.top,onChange:J=>{Ye("padding-v"),pt(J)},onPreview:st("padding-v",Xt),onScrubEnd:()=>Ye("padding-v"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:f,defaultUnit:b,snapSteps:na,children:Pe(Bp,{size:12,strokeWidth:r("padding")?2.5:1.5})}),Pe(lo,{property:"padding",value:Te["padding-v"]||Ee.top,onChange:J=>pt(J),isModified:r("padding")||"padding-v"in Te,placeholder:"V pad",style:{...bn,flex:1,minWidth:0},unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:S})]})})]}),gn("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:W,transition:"opacity 150ms ease"},children:[Pe("input",{type:"checkbox",checked:Ue==="hidden",onChange:J=>o("overflow",J.target.checked?"hidden":"visible"),style:{margin:0,accentColor:f}}),"Clip content"]})]})]})}import{AlignCenter as zp,AlignJustify as Fp,AlignLeft as $p,AlignRight as Wp,Baseline as jp,ChevronDown as Gp,WholeWord as Jp}from"lucide-react";import{jsx as Lt,jsxs as Oo}from"react/jsx-runtime";var lc={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function cc({element:e,getValue:t,handleChange:n,isModified:o,onResetProperty:r,isCollapsed:i,onToggle:a,sectionHeaderStyle:s,accentColor:l,colorVariables:d,activeColorDropdown:c,onColorDropdownChange:u,panelContentRef:f,preferredUnit:p,onUnitCycle:b}){let S=t("font-family"),C=t("font-size"),P=t("font-weight"),H=t("line-height"),I=t("letter-spacing"),M=t("text-align"),w=t("color"),$=String(P),Z=lc[$]||$,q=_r(e,w),k=w.includes("var(")?null:ii(q,d),O=({align:m,icon:j})=>{let ue=M===m;return Lt("button",{type:"button",onClick:()=>n("text-align",m),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:ue?gr(l,.15):"transparent",color:ue?l:"#64748b",cursor:"pointer"},children:j})},g=S.split(",")[0]?.trim().replace(/^["']|["']$/g,"")||"System";return Oo("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Lt("div",{style:s,children:Lt("span",{children:"Typography"})}),Oo("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[Lt(Jn,{children:Oo("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[Lt("input",{type:"text",value:S,onChange:m=>n("font-family",m.target.value),style:{...bn,flex:1,minWidth:0,padding:0,fontWeight:o("font-family")?600:400,color:o("font-family")?l:"inherit"},title:S}),Lt(Gp,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),Oo("div",{style:{display:"flex",gap:4},children:[Lt(Jn,{style:{flex:1},children:Lt("select",{value:$,onChange:m=>n("font-weight",m.target.value),style:{...bn,padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:o("font-weight")?600:400,color:o("font-weight")?l:"inherit"},children:Object.entries(lc).map(([m,j])=>Lt("option",{value:m,children:j},m))})}),Lt(Jn,{style:{flex:1},children:Lt("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:Lt(lo,{property:"font-size",value:C,onChange:m=>n("font-size",m),isModified:o("font-size"),min:1,max:999,style:{...bn,padding:"6px 8px",paddingRight:24,fontWeight:o("font-size")?600:400,color:o("font-size")?l:"inherit"},unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:p,onUnitCycle:b})})})]}),Oo("div",{style:{display:"flex",gap:4},children:[Lt(Jn,{style:{flex:1},children:Oo("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[Lt(jp,{size:12,style:{color:o("line-height")?l:"#999",flexShrink:0}}),Lt(lo,{property:"line-height",value:H,onChange:m=>n("line-height",m),isModified:o("line-height"),step:.1,min:0,placeholder:"Auto",style:{...bn,flex:1,minWidth:0,padding:0,fontWeight:o("line-height")?600:400,color:o("line-height")?l:"inherit"},showUnit:!1})]})}),Lt(Jn,{style:{flex:1},children:Oo("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[Lt(Jp,{size:12,style:{color:o("letter-spacing")?l:"#999",flexShrink:0}}),Lt(lo,{property:"letter-spacing",value:I,onChange:m=>n("letter-spacing",m),isModified:o("letter-spacing"),step:.1,placeholder:"\u2014",style:{...bn,flex:1,minWidth:0,padding:0,fontWeight:o("letter-spacing")?600:400,color:o("letter-spacing")?l:"inherit"},showUnit:!1})]})})]}),Oo("div",{style:{display:"flex",gap:2,backgroundColor:Qn,borderRadius:2,padding:2},children:[Lt(O,{align:"left",icon:Lt($p,{size:14})}),Lt(O,{align:"center",icon:Lt(zp,{size:14})}),Lt(O,{align:"right",icon:Lt(Wp,{size:14})}),Lt(O,{align:"justify",icon:Lt(Fp,{size:14})})]}),Oo("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[Lt("span",{onClick:o("color")?()=>r("color"):void 0,title:o("color")?"Click to reset":void 0,style:{fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:o("color")?l:"#64748b",fontWeight:o("color")?600:400,cursor:o("color")?"pointer":"default",width:40,flexShrink:0},children:"Color"}),Lt("div",{style:{flex:1,minWidth:0},children:Lt(sa,{value:w,resolvedValue:q,colorVariables:d,matchingVariable:k,onChange:m=>n("color",m),accentColor:l,modified:o("color"),panelContentRef:f,isDropdownOpen:c==="color",onDropdownChange:m=>u(m?"color":null)})})]})]})]})}import{Fragment as Up,jsx as he,jsxs as Ut}from"react/jsx-runtime";var uc=[{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 Vp(e,t){let n=t.trim().toLowerCase();switch(e){case"opacity":return n==="1";case"border-width":return n==="0px"||n==="0"||n==="medium";case"border-radius":return n==="0px"||n==="0";case"border-style":return n==="none";case"box-shadow":return n==="none";case"backdrop-filter":return n==="none"||n==="";case"letter-spacing":return n==="normal"||n==="0px"||n==="0";case"background-color":return n==="rgba(0, 0, 0, 0)"||n==="transparent";default:return!1}}function ra(e,t){return!t||e==="auto"||e==="fit-content"||e==="max-content"||e==="min-content"?"hug":e==="100%"||t==="100%"?"fill":"fixed"}function Ki(e,t){switch(e){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let n=qo(t);if(typeof n.num=="number"&&!isNaN(n.num)){let o=n.unit==="%"?"px":n.unit||"px";return`${n.num}${o}`}return"auto"}}}function Jr(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 sc(e,t){return e==="grid"?"grid":e==="flex"||e==="inline-flex"?t==="column"||t==="column-reverse"?"flex-col":"flex-row":"block"}function ac(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 Qn="rgba(0, 0, 0, 0.04)",bn={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 ia({label:e,property:t,cssValue:n,mode:o,onValueChange:r,onModeChange:i,modified:a,dimmed:s,dropdownOpen:l,onDropdownChange:d,panelContentRef:c,accentColor:u="#3b82f6",onReset:f,minValue:p,maxValue:b,onMinChange:S,onMaxChange:C,onMinReset:P,onMaxReset:H,minModified:I,maxModified:M}){let w=qo(n),$=a?w.unit||jr(t):jr(t),Z=!a&&w.unit&&w.unit!==$?ea(w.num,$):w.num,[q,k]=vn(!1),[O,g]=vn(String(Z)),[m,j]=vn(!1),ue=zn(null),Re=zn(null),de=zn(null),we=zn(!1);eo(()=>{q||g(String(Z))},[Z,q]),eo(()=>{if(!l)return;let te=Ke=>{Re.current&&!Ke.composedPath().includes(Re.current)&&de.current&&!Ke.composedPath().includes(de.current)&&d?.(!1)},ot=Ke=>{Ke.key==="Escape"&&d?.(!1)};return document.addEventListener("mousedown",te),document.addEventListener("keydown",ot),()=>{document.removeEventListener("mousedown",te),document.removeEventListener("keydown",ot)}},[l,d]),eo(()=>{q&&ue.current&&(ue.current.focus(),ue.current.select())},[q]);let Ee=()=>{let te=Yi(O,t,n,a);r(te||`${Math.max(0,parseFloat(O)||0)}${$}`),k(!1)},V=()=>{if(we.current){we.current=!1;return}Ee()},B=te=>{if(te.key==="Enter"){Ee();return}if(te.key==="Escape"){we.current=!0,g(String(Z)),k(!1);return}if(te.key==="ArrowUp"||te.key==="ArrowDown"){te.preventDefault();let ot=te.key==="ArrowUp"?1:-1,Ke=te.shiftKey?8:te.altKey?.1:1,xe=parseFloat(O)||0,Le=Math.round(Math.max(0,xe+ot*Ke)*1e3)/1e3;g(String(Le)),r(`${Le}${$}`)}},re={fixed:"Fixed",hug:"Hug",fill:"Fill"},ge={fixed:he(dc,{size:12}),hug:he(Yp,{size:12}),fill:he(dc,{size:12})},_e=()=>{d?.(!l)},Ue=()=>{if(!de.current||!c?.current)return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let te=de.current.getBoundingClientRect(),ot=c.current.getBoundingClientRect();return{position:"fixed",top:te.bottom+4,left:ot.left+4,width:ot.width-8}};return Ut("div",{ref:de,onMouseEnter:()=>j(!0),onMouseLeave:()=>j(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:q?u:m?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Qn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:s?.3:1},children:[he("span",{onClick:a&&f?f:void 0,title:a?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:a?u:"#999",fontWeight:a?600:400,padding:"0 8px",flexShrink:0,cursor:a?"pointer":"default"},children:e}),o==="fixed"?q?he("input",{ref:ue,type:"text",inputMode:"numeric",value:O,onChange:te=>g(te.target.value),onKeyDown:B,onBlur:V,style:{...bn,flex:1,minWidth:0,padding:"4px 2px"}}):he("span",{onClick:()=>k(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:Z}):he("span",{style:{flex:1}}),Ut("button",{type:"button",onClick:_e,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:[re[o],he(aa,{size:12})]}),l&&Ut("div",{ref:Re,style:{...Ue(),backgroundColor:"#eaeaea",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:[Ut("button",{type:"button",onClick:()=>{i("fixed"),d?.(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:o==="fixed"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:o==="fixed"?600:400,cursor:"pointer",textAlign:"left"},children:[ge.fixed,Ut("span",{children:["Fixed ",t," (",n,")"]}),o==="fixed"&&he(Xi,{size:14,style:{marginLeft:"auto"}})]}),Ut("button",{type:"button",onClick:()=>{i("hug"),d?.(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:o==="hug"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:o==="hug"?600:400,cursor:"pointer",textAlign:"left"},children:[ge.hug,he("span",{children:"Hug contents"}),o==="hug"&&he(Xi,{size:14,style:{marginLeft:"auto"}})]}),Ut("button",{type:"button",onClick:()=>{i("fill"),d?.(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:o==="fill"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:o==="fill"?600:400,cursor:"pointer",textAlign:"left"},children:[ge.fill,he("span",{children:"Fill container"}),o==="fill"&&he(Xi,{size:14,style:{marginLeft:"auto"}})]}),he("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),Ut("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[Ut("div",{style:{display:"flex",alignItems:"center",backgroundColor:Qn,borderRadius:2,padding:"4px 8px"},children:[he("span",{onClick:I?te=>{te.stopPropagation(),P?.()}:void 0,title:I?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:I?u:"#999",fontWeight:I?600:400,marginRight:8,flexShrink:0,cursor:I?"pointer":"default"},children:"Min"}),he("input",{type:"text",value:p||"",placeholder:"\u2014",onChange:te=>S?.(te.target.value),onClick:te=>te.stopPropagation(),style:{...bn,flex:1,minWidth:0,padding:0,textAlign:"right",color:I?u:"inherit",fontWeight:I?600:400}})]}),Ut("div",{style:{display:"flex",alignItems:"center",backgroundColor:Qn,borderRadius:2,padding:"4px 8px"},children:[he("span",{onClick:M?te=>{te.stopPropagation(),H?.()}:void 0,title:M?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:M?u:"#999",fontWeight:M?600:400,marginRight:8,flexShrink:0,cursor:M?"pointer":"default"},children:"Max"}),he("input",{type:"text",value:b||"",placeholder:"\u2014",onChange:te=>C?.(te.target.value),onClick:te=>te.stopPropagation(),style:{...bn,flex:1,minWidth:0,padding:0,textAlign:"right",color:M?u:"inherit",fontWeight:M?600:400}})]})]})]})]})}function Jn({children:e,style:t,dimmed:n}){let[o,r]=vn(!1);return he("div",{onMouseEnter:()=>r(!0),onMouseLeave:()=>r(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:o?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Qn,transition:"border-color 100ms ease, opacity 150ms ease",opacity:n?.3:1,...t},children:e})}function _o({children:e}){let[t,n]=vn(!1);return he("div",{onMouseEnter:()=>n(!0),onMouseLeave:()=>n(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:t?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Qn,transition:"border-color 100ms ease"},children:e})}function lo({property:e,value:t,onChange:n,isModified:o=!1,step:r=1,min:i,max:a,style:s,placeholder:l,showUnit:d=!0,unitStyle:c,preferredUnit:u,onUnitCycle:f}){let p=qo(t),b=jr(e),S=Ji[e],P=u&&S&&S.includes(u)?u:b,H=o&&p.unit||P,I=!o&&p.unit&&p.unit!==H?ea(p.num,H):p.num,[M,w]=vn(!1),[$,Z]=vn(""),q=V=>{w(!0),Z(String(I||"")),requestAnimationFrame(()=>V.target.select())},k=()=>{if(w(!1),$.trim()){let V=Yi($,e,t,o);V&&n(V)}},O=V=>{let B=V.target.value;Z(B);let re=B.trim(),ge=re.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),_e=re.match(/^(-?[\d.]+)$/);if(ge){let Ue=parseFloat(ge[1]);isNaN(Ue)||n(`${Ue}${ge[2].toLowerCase()}`)}else if(_e){let Ue=parseFloat(_e[1]);isNaN(Ue)||n(`${Ue}${H}`)}},g=V=>{if(V.key==="Enter"){if($.trim()){let B=Yi($,e,t,o);B&&n(B)}V.target.blur();return}if(V.key==="ArrowUp"||V.key==="ArrowDown"){V.preventDefault();let B=V.shiftKey?10:V.altKey?.1:1,re=(V.key==="ArrowUp"?1:-1)*r*B,ge=parseFloat($)||I||0,_e=Math.round((ge+re)*1e3)/1e3;i!==void 0&&(_e=Math.max(i,_e)),a!==void 0&&(_e=Math.min(a,_e)),Z(String(_e)),n(`${_e}${H}`)}},m=/^-?[\d.]/.test(t.trim()),j=M?$:m?String(I):"",Re=M&&/\s*(rem|em|px|%)\s*$/i.test($)?"":H,de=f&&(Re==="rem"||Re==="px"),we={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},Ee={...c??we,pointerEvents:"auto",cursor:"pointer"};return Ut(Up,{children:[he("input",{type:"text",inputMode:"decimal",value:j,onFocus:q,onBlur:k,onChange:O,onKeyDown:g,placeholder:l,style:s}),d&&Re&&he("span",{style:de?Ee:c??we,onClick:de?f:void 0,title:de?"Click to switch units":void 0,children:Re})]})}function sa({value:e,resolvedValue:t,colorVariables:n,matchingVariable:o,onChange:r,accentColor:i="#3b82f6",modified:a,panelContentRef:s,isDropdownOpen:l,onDropdownChange:d}){let[c,u]=vn(!1),f=e,[p,b]=vn(f),[S,C]=vn(!1),[P,H]=vn(!1),[I,M]=vn(!1),w=zn(null),$=zn(null),Z=zn(null),q=l!==void 0?l:S,k=d||C,O=So(()=>{if(!Z.current)return{position:"fixed",top:0,left:0,width:200};let V=Z.current.getBoundingClientRect();if(s?.current){let B=s.current.getBoundingClientRect();return{position:"fixed",top:V.bottom+4,left:B.left+4,width:B.width-8}}return{position:"fixed",top:V.bottom+4,left:V.left,width:V.width}},[s]);eo(()=>{c||b(e)},[e,c]),eo(()=>{if(!q&&!P)return;let V=re=>{Z.current&&!re.composedPath().includes(Z.current)&&(k(!1),H(!1))},B=re=>{re.key==="Escape"&&(k(!1),H(!1))};return document.addEventListener("mousedown",V),document.addEventListener("keydown",B),()=>{document.removeEventListener("mousedown",V),document.removeEventListener("keydown",B)}},[q,P]),eo(()=>{c&&w.current&&(w.current.focus(),w.current.select())},[c]);let g=qi(()=>{if(!p||p.startsWith("#")||p.startsWith("rgb")||p.startsWith("hsl")||p.startsWith("oklch"))return[];let V=p.toLowerCase();return n.filter(B=>B.name.toLowerCase().includes(V)||B.usage.toLowerCase().includes(V)).slice(0,8)},[p,n]),m=()=>{r(p),u(!1),H(!1)},j=V=>{b(V),V.includes("var")||V.includes("--")||V.length>0&&!V.startsWith("#")?H(!0):H(!1)},ue=V=>{b(V.value),r(V.value),k(!1),H(!1),u(!1)},Re=()=>{setTimeout(()=>{!q&&!P&&m()},150)},de=V=>{V.key==="Enter"?m():V.key==="Escape"&&(b(e),u(!1),H(!1))},we=qi(()=>{let V=t.trim().toLowerCase();if(V.startsWith("#"))return V.length===4?`#${V[1]}${V[1]}${V[2]}${V[2]}${V[3]}${V[3]}`:V.slice(0,7);let B=V.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(B){let ge=parseInt(B[1],10).toString(16).padStart(2,"0"),_e=parseInt(B[2],10).toString(16).padStart(2,"0"),Ue=parseInt(B[3],10).toString(16).padStart(2,"0");return`#${ge}${_e}${Ue}`}let re=V.match(/oklch\(\s*([\d.]+)/);if(re){let ge=Math.max(0,Math.min(1,parseFloat(re[1]))),_e=Math.round(ge*255).toString(16).padStart(2,"0");return`#${_e}${_e}${_e}`}return"#000000"},[t]);return Ut("div",{ref:Z,onMouseEnter:()=>M(!0),onMouseLeave:()=>M(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:c?i:I?"rgba(0,0,0,0.15)":"transparent",backgroundColor:Qn,transition:"border-color 100ms ease",overflow:"hidden"},children:[Ut("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[Ut("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[he("input",{type:"color",value:we,onChange:V=>{let B=V.target.value;b(B),r(B)},style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),he("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:t,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),c?he("input",{ref:w,type:"text",value:p,onChange:V=>j(V.target.value),onKeyDown:de,onBlur:Re,style:{...bn,flex:1,minWidth:0}}):he("span",{onClick:()=>u(!0),style:{flex:1,minWidth:0,padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",color:a?i:"inherit"},title:f,children:f}),n.length>0&&he("button",{type:"button",onClick:()=>k(!q),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:he(aa,{size:12})})]}),P&&g.length>0&&he("div",{style:{...O(),backgroundColor:"#eaeaea",border:"1px solid rgba(0,0,0,0.1)",borderRadius:0,zIndex:10001,maxHeight:200,overflowY:"auto",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace'},children:g.map(V=>Ut("button",{type:"button",onClick:()=>ue(V),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:"transparent",color:"#1e293b",cursor:"pointer",textAlign:"left",fontSize:12},children:[he("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:V.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),he("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:V.name})]},V.name))}),q&&he("div",{ref:$,style:{...O(),backgroundColor:"#eaeaea",border:"1px solid rgba(0,0,0,0.1)",borderRadius:0,zIndex:10001,maxHeight:280,overflowY:"auto",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace'},children:n.map(V=>Ut("button",{type:"button",onClick:()=>ue(V),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:o?.usage===V.usage||e===V.value?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:o?.usage===V.usage||e===V.value?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[he("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:V.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),he("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:V.name}),(o?.usage===V.usage||e===V.value)&&he(Xi,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},V.name))})]})}function pc({element:e,elementInfo:t,selector:n,styleModifications:o,dispatch:r,onClose:i,onHover:a,accentColor:s="#3b82f6",toolbarRef:l}){let d=zn(null),c=zn(null),[u,f]=vn(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch{return!1}});eo(()=>{if(u)return;let W=setTimeout(()=>f(!0),50);return()=>clearTimeout(W)},[u]);let[p,b]=vn(null),[S,C]=vn(null),P=p!==null||S!==null,[H,I]=vn("rem"),M=So(()=>{I(W=>W==="rem"?"px":"rem")},[]),w=zn(new Map),[$,Z]=vn(""),q=qi(()=>Ms(),[]);eo(()=>{let W=ee=>{if(ee.key!=="Escape")return;let ie=document.activeElement;ie&&d.current?.contains(ie)||i()};return window.addEventListener("keydown",W),()=>window.removeEventListener("keydown",W)},[i]);let k=zn({top:0,left:0,maxHeight:400}),[,O]=vn(0),g="devtools-panel-position",m=zn({x:0,y:0}),j=zn(null),ue=zn(!1);eo(()=>{try{let W=localStorage.getItem(g);if(W){let ee=JSON.parse(W);typeof ee.top=="number"&&typeof ee.left=="number"&&(ue.current=!0,k.current={...k.current,top:ee.top,left:ee.left})}}catch{}},[]),eo(()=>{let W=ie=>{let Ne=j.current;if(!Ne)return;let pt=Ne.startOffsetX+(ie.clientX-Ne.startX),Te=Ne.startOffsetY+(ie.clientY-Ne.startY),rt=280,st=16,Ye=Math.max(st,Math.min(window.innerWidth-rt-st,k.current.left+pt)),It=Math.max(st,k.current.top+Te);m.current={x:Ye-k.current.left,y:It-k.current.top};let Xt=d.current,Jt=Xt?.parentElement;if(!Jt)return;Jt.style.top=`${It}px`,Jt.style.left=`${Ye}px`;let Xe=l?.current?.getBoundingClientRect(),je=window.innerHeight-16;Xe&&Ye+rt>Xe.left&&(je=Xe.top-8);let an=Math.max(0,It),nt=Math.max(200,je-an);Xt&&(Xt.style.maxHeight=`${nt}px`)},ee=()=>{if(!j.current)return;let ie=k.current.top+m.current.y,Ne=k.current.left+m.current.x;k.current={...k.current,top:ie,left:Ne},m.current={x:0,y:0},ue.current=!0;try{localStorage.setItem(g,JSON.stringify({top:ie,left:Ne}))}catch{}j.current=null};return window.addEventListener("mousemove",W),window.addEventListener("mouseup",ee),()=>{window.removeEventListener("mousemove",W),window.removeEventListener("mouseup",ee)}},[]);let Re=So(W=>{W.button!==0||W.target.closest("button")||(W.preventDefault(),j.current={startX:W.clientX,startY:W.clientY,startOffsetX:m.current.x,startOffsetY:m.current.y})},[]);eo(()=>{m.current={x:0,y:0};let W=(Ne=!1)=>{let pt=d.current,Te=280,rt=8,st,Ye;if(ue.current)st=k.current.top,Ye=k.current.left;else{let je=e.getBoundingClientRect();Ye=je.right+rt,st=je.top,Ye+Te>window.innerWidth-rt&&(Ye=je.left-Te-rt),Ye<rt&&(Ye=Math.max(rt,(window.innerWidth-Te)/2))}let It=l?.current?.getBoundingClientRect(),Xt=window.innerHeight-16;It&&Ye+Te>It.left&&(Xt=It.top-rt);let Jt=Math.max(0,st),Xe=Math.max(200,Xt-Jt);if(k.current={top:st,left:Ye,maxHeight:Xe},Ne&&pt){let je=pt.parentElement;je&&!ue.current&&(je.style.top=`${st+m.current.y}px`,je.style.left=`${Ye+m.current.x}px`),pt.style.maxHeight=`${Xe}px`}else O(je=>je+1)};W(!1);let ee=()=>W(!0),ie=()=>W(!1);return window.addEventListener("scroll",ee,{passive:!0}),window.addEventListener("resize",ie,{passive:!0}),()=>{window.removeEventListener("scroll",ee),window.removeEventListener("resize",ie)}},[e]),eo(()=>{let W=d.current;if(!W)return;let ee=ie=>{let Ne=c.current;if(!Ne){ie.preventDefault();return}let{scrollTop:pt,scrollHeight:Te,clientHeight:rt}=Ne,st=pt<=0&&ie.deltaY<0,Ye=pt+rt>=Te&&ie.deltaY>0;(st||Ye)&&ie.preventDefault()};return W.addEventListener("wheel",ee,{passive:!1}),()=>W.removeEventListener("wheel",ee)},[]);let de=qi(()=>o.find(W=>W.selector===n),[o,n]),we=So(W=>{let ee=de?.changes.find(ie=>ie.property===W);return ee?ee.modified:Di(e,W)},[e,de]),Ee=So((W,ee)=>{if(!W.includes("color"))return ee;let ie=ee.trim(),pt=q.find(Te=>Te.usage===ie||Te.name===ie)?.value||ie;return _r(e,pt)},[q,e]),V=So(W=>{if(w.current.has(W))return w.current.get(W);let ee=de?.changes.find(Ne=>Ne.property===W);if(ee)return ee.original;let ie=Di(e,W);return w.current.set(W,ie),ie},[e,de]),B=So((W,ee)=>{let ie=V(W),Ne=Ee(W,ee);tt(e,W,Ne),W==="backdrop-filter"&&tt(e,"-webkit-backdrop-filter",Ne),r({type:"MODIFY_STYLE",payload:{selector:n,element:t,property:W,original:ie,modified:Ne}})},[e,n,t,r,Ee,V]),re=So(W=>{o.find(Ne=>Ne.selector===n)?.changes.find(Ne=>Ne.property===W)&&e instanceof HTMLElement&&(e.style.removeProperty(W),r({type:"CLEAR_STYLE",payload:{selector:n,property:W}}),w.current.delete(W))},[e,n,o,r]),ge=So(()=>{let W=$.split(";").map(ee=>ee.trim()).filter(ee=>ee);for(let ee of W){let ie=ee.indexOf(":");if(ie>0){let Ne=ee.slice(0,ie).trim(),pt=ee.slice(ie+1).trim();Ne&&pt&&B(Ne,pt)}}Z("")},[$,B]),_e=So(W=>de?.changes.some(ee=>ee.property===W)??!1,[de]),Ue=W=>{let ee=we(W.property),ie=_e(W.property),Ne=!ie&&Vp(W.property,ee),pt={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(Ne&&W.type!=="backdrop-filter")return he(_o,{modified:!1,children:he("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:Te=>B(W.property,Te.target.value),style:{...pt,color:"#999"}})});switch(W.type){case"color":{let Te=_r(e,ee),rt=ee.includes("var(")?null:ii(Te,q);return he(sa,{value:ee,resolvedValue:Te,colorVariables:q,matchingVariable:rt,onChange:st=>B(W.property,st),accentColor:s,modified:ie,panelContentRef:c,isDropdownOpen:S===W.property,onDropdownChange:st=>C(st?W.property:null)})}case"number":{if(!!Ji[W.property])return he(_o,{modified:ie,children:he(lo,{property:W.property,value:ee,onChange:st=>B(W.property,st),isModified:ie,min:W.min,max:W.max,step:W.step||1,style:{...pt,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:H,onUnitCycle:M})});let{num:rt}=qo(ee);return he(_o,{modified:ie,children:he("input",{type:"number",value:rt,min:W.min,max:W.max,step:W.step||1,onChange:st=>B(W.property,st.target.value),style:pt})})}case"select":return he(_o,{modified:ie,children:Ut("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[he("select",{value:ee,onChange:Te=>B(W.property,Te.target.value),style:{...pt,cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"},children:W.options?.map(Te=>he("option",{value:Te,children:Te},Te))}),he("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:he(aa,{size:12})})]})});case"spacing":return he(_o,{modified:ie,children:he("input",{type:"text",value:ee,onChange:Te=>B(W.property,Te.target.value),placeholder:"e.g., 10px or 10px 20px",style:pt})});case"backdrop-filter":return he(tc,{value:ee,onChange:Te=>B(W.property,Te),accentColor:s,modified:ie,panelContentRef:c});default:return he(_o,{modified:ie,children:he("input",{type:"text",value:ee,onChange:Te=>B(W.property,Te.target.value),style:pt})})}},te=t.reactComponent||t.tagName,ot={position:"fixed",top:k.current.top,left:k.current.left,width:280,maxHeight:k.current.maxHeight,backgroundColor:"#eaeaea",borderWidth:3,borderStyle:"solid",borderColor:"transparent",boxSizing:"content-box",zIndex:10002,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontSize:12,overflow:"visible",display:"flex",flexDirection:"column",opacity:u?1:0,transition:"opacity 150ms ease"},Ke={display:"flex",alignItems:"center",justifyContent:"space-between",margin:4,padding:"4px 5px 4px 10px",backgroundColor:s,color:"#ffffff",cursor:j.current?"grabbing":"grab",userSelect:"none",WebkitUserSelect:"none"},xe={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"},Le={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},ut={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return he("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:k.current.top+m.current.y,left:k.current.left+m.current.x,zIndex:10002,pointerEvents:"none"},children:Ut("div",{ref:d,"data-devtools":"panel",style:{...ot,position:"relative",top:0,left:0,zIndex:0,pointerEvents:"auto"},onMouseEnter:()=>a?.("element"),onMouseLeave:()=>a?.(null),children:[he("div",{"aria-hidden":"true",style:Gi()}),Ut("div",{style:Ke,onMouseDown:Re,children:[he("div",{style:{display:"flex",alignItems:"center",gap:3,overflow:"hidden",minWidth:0},children:he("span",{style:{fontWeight:600,fontSize:12,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:te})}),he("button",{type:"button",onClick:i,title:"Close",style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1,flexShrink:0},children:"\xD7"})]}),Ut("div",{ref:c,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[he("div",{style:{opacity:S?.3:1,transition:"opacity 150ms ease"},children:he(ic,{element:e,getValue:we,getOriginalValue:V,handleChange:B,isModified:_e,onResetProperty:re,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:xe,activeDropdown:p,onDropdownChange:b,panelContentRef:c,accentColor:s,onFieldHover:a,preferredUnit:H,onUnitCycle:M})}),he("div",{style:{opacity:p?.3:1,transition:"opacity 150ms ease"},children:he(cc,{element:e,getValue:we,handleChange:B,isModified:_e,onResetProperty:re,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:xe,accentColor:s,colorVariables:q,activeColorDropdown:S,onColorDropdownChange:C,panelContentRef:c,preferredUnit:H,onUnitCycle:M})}),uc.map((W,ee)=>{let ie=ee===uc.length-1,Ne=S&&W.properties.some(Te=>Te.property===S);return Ut("div",{style:{borderBottom:ie?"none":"1px solid rgba(0,0,0,0.08)",opacity:P&&!Ne?.3:1,transition:"opacity 150ms ease"},children:[he("div",{style:xe,children:he("span",{children:W.name})}),he("div",{style:{padding:"4px 0"},children:W.properties.map(Te=>{let rt=_e(Te.property),st=Ne&&Te.property!==S;return Ut("div",{style:{...Le,opacity:st?.3:1,transition:"opacity 150ms ease"},children:[he("span",{onClick:rt?()=>re(Te.property):void 0,title:rt?"Click to reset":void 0,style:{...ut,color:rt?s:"#64748b",fontWeight:rt?600:400,cursor:rt?"pointer":"default"},children:Te.label}),he("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:Ue(Te)})]},Te.property)})})]},W.name)}),Ut("div",{style:{opacity:P?.3:1,transition:"opacity 150ms ease"},children:[he("div",{style:xe,children:he("span",{children:"Raw CSS"})}),Ut("div",{style:{padding:"8px 12px"},children:[he("textarea",{value:$,onChange:W=>Z(W.target.value),placeholder:"property: value; ...",style:{width:"100%",height:60,padding:8,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"1px solid rgba(0,0,0,0.1)",borderRadius:2,resize:"vertical",outline:"none"}}),$.trim()&&he("button",{type:"button",onClick:ge,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:s,color:"#fff",cursor:"pointer",opacity:$.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as Kp,useLayoutEffect as Xp,useState as qp}from"react";import{Fragment as tf,jsx as hr,jsxs as ef}from"react/jsx-runtime";var la=["flex-start","center","flex-end"],ca=["flex-start","center","flex-end"];function Zp(e){return e==="normal"||e==="flex-start"||e==="start"?"flex-start":e==="flex-end"||e==="end"?"flex-end":e==="center"?"center":null}function Qp(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 fc(e){let t=Array.from(e.children);if(t.length===0)return null;let n=1/0,o=1/0,r=-1/0,i=-1/0;for(let a of t){let s=a.getBoundingClientRect();s.width===0&&s.height===0||(s.top<n&&(n=s.top),s.left<o&&(o=s.left),s.bottom>r&&(r=s.bottom),s.right>i&&(i=s.right))}return n===1/0?null:new DOMRect(o,n,i-o,r-n)}function gc({element:e,modifier:t,accentColor:n,refreshKey:o=0}){let[r,i]=qp(null);if(Kp(()=>{if(!e){i(null);return}let S=()=>i(fc(e));return S(),window.addEventListener("scroll",S,{passive:!0}),window.addEventListener("resize",S,{passive:!0}),()=>{window.removeEventListener("scroll",S),window.removeEventListener("resize",S)}},[e]),Xp(()=>{e&&i(fc(e))},[e,o]),!r)return null;let a=r,s=window.getComputedStyle(e),l=s.display;if(l!=="flex"&&l!=="inline-flex")return null;let d=s.flexDirection,c=d==="column"||d==="column-reverse"?"vertical":"horizontal",u=c==="horizontal"?"vertical":"horizontal",f=[];if(t==="shift"){let S=Zp(s.justifyContent);if(S){let C=la.indexOf(S);c==="horizontal"?(C>0&&f.push("left"),C<la.length-1&&f.push("right")):(C>0&&f.push("up"),C<la.length-1&&f.push("down"))}}else{let S=Qp(s.alignItems);if(S){let C=ca.indexOf(S);u==="horizontal"?(C>0&&f.push("left"),C<ca.length-1&&f.push("right")):(C>0&&f.push("up"),C<ca.length-1&&f.push("down"))}}if(f.length===0)return null;let p=14,b=7;return hr(tf,{children:f.map(S=>{let C,P;switch(S){case"right":C=a.right+p,P=a.top+a.height/2;break;case"left":C=a.left-p,P=a.top+a.height/2;break;case"down":C=a.left+a.width/2,P=a.bottom+p;break;case"up":C=a.left+a.width/2,P=a.top-p;break}let H=S==="right"?0:S==="left"?180:S==="down"?90:-90,I={position:"fixed",left:C-b,top:P-b,width:b*2,height:b*2,pointerEvents:"none",zIndex:9997};return hr("div",{"data-devtools":"swipe-hint",style:I,children:hr("svg",{width:b*2,height:b*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:ef("g",{transform:`rotate(${H})`,children:[hr("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),hr("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),hr("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:n,strokeWidth:"1.5",strokeLinecap:"round"}),hr("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:n,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},S)})})}import{useEffect as nf,useLayoutEffect as of,useState as rf}from"react";import{jsx as da,jsxs as ua}from"react/jsx-runtime";function sf(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function mc({element:e,fontSize:t,lineHeight:n,accentColor:o,hoveredProperty:r,draggingProperty:i,cursorViewport:a}){let[s,l]=rf(null);if(nf(()=>{if(!e){l(null);return}let P=()=>{l(Dr(e))};return P(),window.addEventListener("scroll",P,{passive:!0}),window.addEventListener("resize",P,{passive:!0}),()=>{window.removeEventListener("scroll",P),window.removeEventListener("resize",P)}},[e]),of(()=>{e&&l(Dr(e))},[e,t,n]),!s)return null;let d=s.width,c=s.height,u=sf(o,.2),f=i??r,p=8,b=2,S={position:"fixed",top:s.top,left:s.left,width:d,height:c,pointerEvents:"none",zIndex:9996,overflow:"visible"},C=P=>P==="font-size"?`${Math.round(t)}`:(t>0?n/t:1.2).toFixed(2).replace(/\.?0+$/,"");return ua("div",{"data-devtools":"text-handles",style:S,children:[ua("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${c}`,children:[da("rect",{x:"0.5",y:"0.5",width:Math.max(0,d-1),height:Math.max(0,c-1),fill:"none",stroke:u,strokeWidth:"1"}),(f==="font-size"||!f)&&da("rect",{x:d-b/2,y:c/2-p/2,width:b,height:p,fill:o,stroke:"#ffffff",strokeWidth:f==="font-size"?4:2,paintOrder:"stroke"}),(f==="line-height"||!f)&&da("rect",{x:d/2-p/2,y:c-b/2,width:p,height:b,fill:o,stroke:"#ffffff",strokeWidth:f==="line-height"?4:2,paintOrder:"stroke"})]}),a&&f&&(()=>{let P=f==="font-size"?"Aa":"Lh",H=C(f);return ua("div",{style:{position:"fixed",left:a.x+8,top:a.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:[P," ",H]})})()]})}import{Fragment as Kr,jsx as mt,jsxs as Ur}from"react/jsx-runtime";var hc=8,pa=[0,1,2,4,8,12,16,20,24,28,32],Vr=8,fa="devtools-active-text";function af(e){let t=e?.getBoundingClientRect();return!t||typeof window>"u"?{}:t.top<window.innerHeight/2?{avoidTop:t.bottom+Vr,avoidLeft:t.left-Vr,avoidRight:t.right+Vr}:{avoidBottom:t.top-Vr,avoidLeft:t.left-Vr,avoidRight:t.right+Vr}}function yc(e,t,n=0,o,r,i=90){let a=e.left+window.scrollX+4,s=t==="top-left"?e.top+window.scrollY-Ko-n*Ko+4:e.bottom+window.scrollY+4-1+n*Ko,l=window.scrollY+4,d=window.scrollY+window.innerHeight-Ko-4,c=null;if(o&&r!==void 0){let u=o.getBoundingClientRect(),f=e.left+4;if(f+r+8+i>u.left&&f<u.right)if(u.top<window.innerHeight/2){let S=window.scrollY+u.bottom+4;S>l&&(l=S,c="top")}else{let S=window.scrollY+u.top-Ko-4;S<d&&(d=S,c="bottom")}}return l>d&&(d=l),s<l?s=c==="top"?l:e.top+window.scrollY+4:s>d&&(s=c==="bottom"?d:Math.max(e.top+window.scrollY+4,d)),{x:a,y:s}}function bc({state:e,dispatch:t,onScreenshot:n,inFlightAnnotationIds:o,activeAnnotationIds:r,queuePositionMap:i,inFlightStyleSelectors:a,inFlightSelectorColors:s,onAttachImages:l,onViewThread:d,onCloseThread:c,onModelComponentsAdd:u,onModelComponentFocus:f,onModelComponentHover:p,modelComponentNames:b,modelPanelHoveredComponent:S,modelSpacingTokenHover:C,highlightedAnnotationIds:P,focusedThreadAnnotationId:H,externalCanvasRef:I,toolbarRef:M}){let{canvasRef:w,redrawAll:$,resizeCanvas:Z}=Dl(),q=rn(y=>{w.current=y,I&&(I.current=y)},[I,w]),k=jt(!1);kn(()=>{let y=w.current;if(!y)return;let v=()=>{k.current&&(k.current=!1,y.style.pointerEvents="")},D=h=>{h.button===0&&k.current&&v()};return window.addEventListener("mousedown",D),()=>window.removeEventListener("mousedown",D)},[w]);let[O,g]=xt(!1),[m,j]=xt(()=>{if(typeof window>"u")return null;try{let y=localStorage.getItem(fa);return y?JSON.parse(y):null}catch{return null}}),[ue,Re]=xt(null),[de,we]=xt(null),[Ee,V]=xt(null),B=jt(null),re=jt(null),ge=jt({x:0,y:0}),_e=jt([]),Ue=jt(0),[te,ot]=xt(null),[Ke,xe]=xt(new Map),Le=jt(0),ut=jt(null),[W,ee]=xt(null),[ie,Ne]=xt(null),[pt,Te]=xt(null),[rt,st]=xt(null),Ye=jt({isDragging:!1,side:null,startX:0,startY:0,original:{top:0,right:0,bottom:0,left:0},element:null,elementInfo:null,selector:null,durableSelector:null}),[It,Xt]=xt(null),[Jt,Xe]=xt(null),[je,an]=xt(null),[nt,Mt]=xt(null),$n=jt({x:0,y:0}),[oe,Ce]=xt({x:0,y:0}),Be=jt({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}),[Ge,Pt]=xt(null),[$e,lt]=xt(null),[qe,Ot]=xt(null),[_n,Yt]=xt(!1),[xn,no]=xt(0),[On,Kn]=xt(null),We=jt({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}),[ht,J]=xt(null),[ke,Ze]=xt(null),[Ct,ln]=xt(null),dt=jt({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[Ie,tn]=xt(null),[qt,Wn]=xt(null),[zt,To]=xt(null),er=_l(),ko=jt(s);ko.current=s;let zo=rn(y=>{let v=ko.current;if(!v||v.size===0)return!1;for(let D of v.keys())try{if(y.matches(D))return!0}catch{}return!1},[]),tr=jt(e);tr.current=e;let hn=jt(m);hn.current=m;let Fo=jt([]),$o=jt(n);$o.current=n;let[Qe,fo]=xt(null),Et=e.selectedAnnotationIds;Fo.current=Et;let Sn=rn((y,v=!1)=>{t({type:"SELECT_ANNOTATION",payload:{id:y,addToSelection:v}})},[t]),In=rn(()=>{t({type:"SELECT_ANNOTATION",payload:{id:null}})},[t]),[wn,Wo]=xt(null),oo=jt({x:window.scrollX,y:window.scrollY}),ro=jt(null),Xn=jt(null),[Zt,Io]=xt(oo.current);kn(()=>(Z(),window.addEventListener("resize",Z),()=>window.removeEventListener("resize",Z)),[Z]),kn(()=>{m?localStorage.setItem(fa,JSON.stringify(m)):localStorage.removeItem(fa)},[m]),Ol(m,j,ue,e.annotations,t);let jo=jt(te);jo.current=te,kn(()=>{if(e.activeTool!=="model"||!e.isAnnotating)return;let y=v=>{if(!v.altKey||!jo.current)return;v.preventDefault();let D=v.deltaY>0?-1:1;Le.current=Math.max(0,Le.current+D);let h=ut.current;if(h){let E=Pi(h,Le.current);ot(E)}};return window.addEventListener("wheel",y,{passive:!1}),()=>window.removeEventListener("wheel",y)},[e.activeTool,e.isAnnotating]),kn(()=>{e.activeTool!=="model"&&(ot(null),xe(new Map),Le.current=0,ut.current=null)},[e.activeTool]),kn(()=>{let y=te?.name??null,v=y&&b?.has(y)?y:null;p?.(v)},[te,b,p]);let[Mo,Tr]=xt(null);kn(()=>{if(!S){Tr(null);return}let y=Lr(S.name),v=S.instanceIndex;Tr(y[v%y.length]??null)},[S]);let[Ro,Go]=xt([]);kn(()=>{if(!C){Go([]);return}C.token?.bindings?.length?Go(Es(C.token)):Go(ws(C.px))},[C]);let L=jt(null),F=jt(null);L.current=Ge,F.current=$e,kn(()=>{let y=["flex-start","center","flex-end"],v=["flex-start","center","flex-end"],h=null,E=!1,T=null,N=null,R=(ce,Ve)=>{let ze=ur(ce,Ve);for(;ze&&ze!==document.documentElement;){let Qt=window.getComputedStyle(ze).display;if(Qt==="flex"||Qt==="inline-flex")return ze;ze=ze.parentElement}return null},z=ce=>{let Ve=window.getComputedStyle(ce).flexDirection;return Ve==="column"||Ve==="column-reverse"?"vertical":"horizontal"},K=ce=>{let Ve=ce.getAttribute("data-pm");return Ve||(Ve=Math.random().toString(36).substring(2,8),ce.setAttribute("data-pm",Ve)),{selector:`[data-pm="${Ve}"]`,durableSelector:Gn(ce)}},_=()=>{E=!0,h&&clearTimeout(h),h=setTimeout(()=>{E=!1,h=null},300)},G=(ce,Ve,Wt)=>{let ze=z(ce);if(Ve===ze){let Pn=window.getComputedStyle(ce).justifyContent,Rt=Pn==="normal"||Pn==="flex-start"||Pn==="start"?"flex-start":Pn==="flex-end"||Pn==="end"?"flex-end":Pn==="center"?"center":null;if(!Rt)return;let rr=y.indexOf(Rt)+Wt;if(rr<0||rr>=y.length)return;let Po=y[rr],{selector:ir,durableSelector:fs}=K(ce);tt(ce,"justify-content",Po),t({type:"MODIFY_STYLES_BATCH",payload:{selector:ir,durableSelector:fs,element:Dn(ce),changes:[{property:"justify-content",original:Pn,modified:Po}]}})}else{let Pn=window.getComputedStyle(ce).flexDirection,Rt=ze==="horizontal"?"column":"row",{selector:Lo,durableSelector:rr}=K(ce);tt(ce,"flex-direction",Rt),t({type:"MODIFY_STYLES_BATCH",payload:{selector:Lo,durableSelector:rr,element:Dn(ce),changes:[{property:"flex-direction",original:Pn,modified:Rt}]}})}no(Qt=>Qt+1)},X=(ce,Ve,Wt)=>{let Qt=z(ce)==="horizontal"?"vertical":"horizontal";if(Ve!==Qt)return;let Rt=window.getComputedStyle(ce).alignItems,Lo=Rt==="normal"||Rt==="stretch"||Rt==="flex-start"||Rt==="start"?"flex-start":Rt==="flex-end"||Rt==="end"?"flex-end":Rt==="center"?"center":null;if(!Lo)return;let Po=v.indexOf(Lo)+Wt;if(Po<0||Po>=v.length)return;let ir=v[Po],{selector:fs,durableSelector:gd}=K(ce);tt(ce,"align-items",ir),t({type:"MODIFY_STYLES_BATCH",payload:{selector:fs,durableSelector:gd,element:Dn(ce),changes:[{property:"align-items",original:Rt,modified:ir}]}}),no(md=>md+1)},Y=20,ye=null,Ae=null,it=0,gt=(ce,Ve,Wt)=>{let ze=R(Ve,Wt);Kn(ze?{modifier:ce,target:ze}:null)},at=ce=>{if(!(e.activeTool!=="hand"||!e.isAnnotating)){if(ce.key==="Shift"&&!ce.altKey){let Ve=$n.current;gt("shift",Ve.x,Ve.y)}else if(ce.key==="Alt"&&!ce.shiftKey){let Ve=$n.current;gt("alt",Ve.x,Ve.y)}}},Tt=ce=>{if(e.activeTool!=="hand"||!e.isAnnotating)return;let Ve=ce.shiftKey&&!ce.altKey,Wt=ce.altKey&&!ce.shiftKey;if(!Ve&&!Wt||ce.buttons!==0){ye=null,Ae=null,it=0,T=null,N=null,Kn(null);return}if(T===null&&(T=ce.clientX,N=ce.clientY,gt(Ve?"shift":"alt",ce.clientX,ce.clientY)),E)return;ye===null&&(ye=ce.clientX,Ae=ce.clientY,it=0);let ze=ce.clientX-ye,Qt=ce.clientY-Ae,Pn=Math.abs(ze)>=Math.abs(Qt)?ze:Qt;if(Math.abs(Pn)>3){let ir=Pn>0?1:-1;if(it!==0&&ir!==it){ye=ce.clientX,Ae=ce.clientY,it=0;return}it=ir}if(Math.abs(ze)<Y&&Math.abs(Qt)<Y)return;let Rt=R(T,N);if(!Rt)return;let Lo=Math.abs(ze)>=Math.abs(Qt)?"horizontal":"vertical",Po=(Lo==="horizontal"?ze:Qt)>0?1:-1;ye=null,Ae=null,it=0,Ve?G(Rt,Lo,Po):X(Rt,Lo,Po),_()},$t=ce=>{(ce.key==="Shift"||ce.key==="Alt")&&(T=null,N=null,ye=null,Ae=null,it=0,Kn(null))},bt=()=>{Kn(null),ye=null,Ae=null,it=0};return window.addEventListener("keydown",at),window.addEventListener("mousemove",Tt),window.addEventListener("mousedown",bt),window.addEventListener("keyup",$t),()=>{window.removeEventListener("keydown",at),window.removeEventListener("mousemove",Tt),window.removeEventListener("mousedown",bt),window.removeEventListener("keyup",$t),h&&clearTimeout(h)}},[e.activeTool,e.isAnnotating,t]),kn(()=>{let y=v=>{if(v.key==="Escape"){if(hn.current)return;if(e.activeTool==="model"&&Ke.size>0){v.preventDefault(),xe(new Map);return}if(Fo.current.length>0){v.preventDefault(),In();return}}if(v.key==="Enter"&&e.activeTool==="model"&&Ke.size>0&&u){v.preventDefault();let T=[...Ke.keys()].filter(N=>!b?.has(N));T.length>0&&u(T),xe(new Map);return}if((v.metaKey||v.ctrlKey)&&v.key==="v"&&_e.current.length>0&&!hn.current){v.preventDefault(),Ue.current++;let T=Ue.current*20,R=_e.current[0]?.groupId?Math.random().toString(36).substring(2,9):void 0,z=_e.current.map(_=>({..._,id:Math.random().toString(36).substring(2,9),groupId:_.groupId?R:void 0,timestamp:Date.now(),points:_.points.map(G=>({x:G.x+T,y:G.y+T}))}));t({type:"PASTE_ANNOTATIONS",payload:{annotations:z}});let K=z.find(_=>_.type!=="text")||z[0];K&&Sn(K.id);return}let D=Fo.current;if(D.length===0||hn.current)return;let h=v.composedPath?.()[0]??v.target,E=h?.tagName;if(!(E==="INPUT"||E==="TEXTAREA"||h?.isContentEditable)&&(v.key==="Delete"||v.key==="Backspace")){if(v.preventDefault(),c){let T=tr.current.annotations;for(let N of D){let R=T.find(K=>K.id===N);if(!R)continue;let z=R.threadId||R.groupId&&T.find(K=>K.groupId===R.groupId&&K.threadId)?.threadId;z&&c(z)}}for(let T of D)t({type:"DELETE_ANNOTATION",payload:{id:T}});In()}};return window.addEventListener("keydown",y),()=>window.removeEventListener("keydown",y)},[t,In,Sn,e.activeTool,Ke,b,u,c]);let ne=Ar(),ae=Yr(()=>e.annotations.filter(y=>!y.pathname||y.pathname===ne),[e.annotations,ne]),le=Yr(()=>e.styleModifications.filter(y=>!y.pathname||y.pathname===ne),[e.styleModifications,ne]),fe=af(M?.current),Me=fe.avoidTop,be=fe.avoidBottom,Vt=fe.avoidLeft,_t=fe.avoidRight,yt=Yr(()=>Wi(e.annotations),[e.annotations]),Ft=Yr(()=>{let y=new Map,v=new Set,D=1,h=[...e.annotations].sort((E,T)=>E.timestamp-T.timestamp);for(let E of h)if(!yt.has(E))if(E.groupId){if(!v.has(E.groupId)){v.add(E.groupId);let T=e.annotations.filter(N=>N.groupId===E.groupId);for(let N of T)y.set(N.id,D);D++}}else y.set(E.id,D),D++;return y},[e.annotations,yt]),ct=Yr(()=>{if(Et.length===0)return null;let y=new Map;for(let v of Et){let D=e.annotations.find(E=>E.id===v);if(!D)continue;let h=D.groupId?e.annotations.filter(E=>E.groupId===D.groupId):[D];for(let E of h)if(E.linkedSelector&&!s?.has(E.linkedSelector)){let T=E.color||e.activeColor;y.set(E.linkedSelector,T)}}return y.size>0?y:null},[Et,e.annotations,e.activeColor,s]),Cn=Yr(()=>ae.filter(y=>!(yt.has(y)||m&&!m.isNew&&y.id===m.id)),[ae,yt,m]),Mn=rn((y=oo.current)=>{$(Cn,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,Et,hc,y.x,y.y,Ft,P,fe)},[Cn,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,Et,$,Ft,P,Me,be,Vt,_t]);kn(()=>{Mn(oo.current)},[Mn]),kn(()=>{let y=()=>{let v={x:window.scrollX,y:window.scrollY};oo.current=v,ro.current===null&&(ro.current=window.requestAnimationFrame(()=>{ro.current=null;let D=oo.current;if(Mn(D),hn.current){Io(h=>h.x===D.x&&h.y===D.y?h:D);return}Xn.current!==null&&window.clearTimeout(Xn.current),Xn.current=window.setTimeout(()=>{Xn.current=null;let h=oo.current;Io(E=>E.x===h.x&&E.y===h.y?E:h)},80)}))};return window.addEventListener("scroll",y,{passive:!0}),()=>{window.removeEventListener("scroll",y),ro.current!==null&&(window.cancelAnimationFrame(ro.current),ro.current=null),Xn.current!==null&&(window.clearTimeout(Xn.current),Xn.current=null)}},[Mn]),kn(()=>{if(de){let y=Math.random().toString(36).substring(2,9);j({id:y,point:de.point,text:"",fontSize:12,isNew:!0,groupId:de.groupId}),we(null)}},[de]),kn(()=>{Ee&&(j({id:Math.random().toString(36).substring(2,9),point:Ee.point,text:"",fontSize:12,isNew:!0,linkedSelector:Ee.linkedSelector,linkedAnchor:Ee.linkedAnchor,elements:Ee.elements}),V(null))},[Ee]);let un=jt(null),En=m?.id??null;kn(()=>{En&&B.current?requestAnimationFrame(()=>{let y=B.current;if(!y||(y.focus(),re.current===En))return;re.current=En;let v=hn.current;if(v){if(un.current!==null){let D=Math.min(un.current,y.value.length);y.setSelectionRange(D,D);return}if(!v.isNew&&v.clickPoint){let D=w.current;if(!D)return;let h=D.getContext("2d");if(!h)return;h.font=`${v.fontSize}px ${dn}`;let E=v.fontSize*1.4,T=v.text.split(`
|
|
4
|
-
`),N=v.clickPoint.y-v.point.y,R=Math.max(0,Math.min(T.length-1,Math.floor(N/E))),z=v.clickPoint.x-v.point.x,K=T[R]||"",_=0;for(let X=0;X<=K.length;X++){let Y=h.measureText(K.substring(0,X)).width;if(Y>z){let ye=X>0?h.measureText(K.substring(0,X-1)).width:0;_=z-ye<Y-z?X-1:X;break}_=X}let G=_;for(let X=0;X<R;X++)G+=(T[X]?.length||0)+1;y.setSelectionRange(G,G)}}}):(re.current=null,un.current=null)},[En,w]);let Jo=rn(y=>{let v=w.current;if(!v)return{x:0,y:0};let D=v.getBoundingClientRect(),h,E;if("touches"in y&&y.touches[0])h=y.touches[0].clientX,E=y.touches[0].clientY;else if("clientX"in y)h=y.clientX,E=y.clientY;else return{x:0,y:0};return{x:h-D.left+window.scrollX,y:E-D.top+window.scrollY}},[w]),Ao=rn((y,v,D,h)=>{let E=D.x-v.x,T=D.y-v.y,N=E*E+T*T;if(N===0)return Math.sqrt((y.x-v.x)**2+(y.y-v.y)**2)<=h;let R=Math.max(0,Math.min(1,((y.x-v.x)*E+(y.y-v.y)*T)/N)),z=v.x+R*E,K=v.y+R*T;return Math.sqrt((y.x-z)**2+(y.y-K)**2)<=h},[]),qn=rn(y=>{for(let D=ae.length-1;D>=0;D--){let h=ae[D];if(!h||yt.has(h))continue;let E=(h.strokeWidth||3)+4;switch(h.type){case"text":{if(!h.points[0]||!h.text)continue;let T=h.points[0],N=h.fontSize||12,R=w.current;if(R){let z=R.getContext("2d");if(z){z.font=`${N}px ${dn}`;let K=h.text.replace(/\n/g," "),_=T.x-Zt.x,G=ai(_),X=li(z,K,G),Y=z.measureText(X).width,ye=N*1.4,Ae={x:T.x-Zt.x,y:T.y-Zt.y},it=Os(Ae,N,fe,Y+8),gt={x:it.x+Zt.x,y:it.y+Zt.y};if(y.x>=gt.x-4-4&&y.x<=gt.x+Y+4+4&&y.y>=gt.y-4-4&&y.y<=gt.y+ye+4+4)return h}}break}case"rectangle":{if(h.points.length<2)continue;let T=h.points[0],N=h.points[h.points.length-1],R=Math.min(T.x,N.x),z=Math.max(T.x,N.x),K=Math.min(T.y,N.y),_=Math.max(T.y,N.y),G=Ao(y,{x:R,y:K},{x:z,y:K},E),X=Ao(y,{x:R,y:_},{x:z,y:_},E),Y=Ao(y,{x:R,y:K},{x:R,y:_},E),ye=Ao(y,{x:z,y:K},{x:z,y:_},E);if(G||X||Y||ye)return h;break}case"circle":{if(h.points.length<2)continue;let T=h.points[0],N=h.points[h.points.length-1],R=(T.x+N.x)/2,z=(T.y+N.y)/2,K=Math.abs(N.x-T.x)/2,_=Math.abs(N.y-T.y)/2,G=y.x-R,X=y.y-z,Y=Math.sqrt((G/K)**2+(X/_)**2);if(Math.abs(Y-1)*Math.max(K,_)<=E)return h;break}case"line":{if(h.points.length<2)continue;let T=h.points[0],N=h.points[h.points.length-1];if(Ao(y,T,N,E))return h;break}case"freehand":{if(h.points.length<2)continue;for(let T=0;T<h.points.length-1;T++){let N=h.points[T],R=h.points[T+1];if(Ao(y,N,R,E))return h}break}}}return null},[ae,w,Ao,yt,Zt.x,Zt.y,Me,be,Vt,_t]),Qr=rn(y=>{let v=qn(y);return v?.type==="text"?v:null},[qn]),vi=rn(y=>{if(Et.length===0)return null;let v=hc/2+4;for(let D of Et){let h=e.annotations.find(E=>E.id===D);if(!(!h||h.points.length<2)){if(h.type==="line"){let E=h.points[0],T=h.points[h.points.length-1];if(Math.sqrt((y.x-E.x)**2+(y.y-E.y)**2)<=v)return{handle:"start",annotationId:D};if(Math.sqrt((y.x-T.x)**2+(y.y-T.y)**2)<=v)return{handle:"end",annotationId:D};continue}if(h.type==="circle"){let E=h.points[0],T=h.points[h.points.length-1],N=Math.min(E.x,T.x),R=Math.max(E.x,T.x),z=Math.min(E.y,T.y),K=Math.max(E.y,T.y),_=(N+R)/2,G=(z+K)/2,X=[{handle:"top",x:_,y:z},{handle:"bottom",x:_,y:K},{handle:"left",x:N,y:G},{handle:"right",x:R,y:G}];for(let{handle:Y,x:ye,y:Ae}of X)if(Math.sqrt((y.x-ye)**2+(y.y-Ae)**2)<=v)return{handle:Y,annotationId:D};continue}if(h.type==="rectangle"||h.type==="freehand"){let E=h.points[0],T=h.points[h.points.length-1],N,R,z,K;h.type==="freehand"?(N=Math.min(...h.points.map(G=>G.x)),R=Math.max(...h.points.map(G=>G.x)),z=Math.min(...h.points.map(G=>G.y)),K=Math.max(...h.points.map(G=>G.y))):(N=Math.min(E.x,T.x),R=Math.max(E.x,T.x),z=Math.min(E.y,T.y),K=Math.max(E.y,T.y));let _=[{corner:"topLeft",x:N,y:z},{corner:"topRight",x:R,y:z},{corner:"bottomLeft",x:N,y:K},{corner:"bottomRight",x:R,y:K}];for(let{corner:G,x:X,y:Y}of _)if(Math.sqrt((y.x-X)**2+(y.y-Y)**2)<=v)return{handle:G,annotationId:D}}}}return null},[Et,e.annotations]);kn(()=>{let y=v=>{if(ge.current={x:v.clientX+window.scrollX,y:v.clientY+window.scrollY},!m){let D=Qr(ge.current);Re(D?.id||null)}};return window.addEventListener("mousemove",y),()=>window.removeEventListener("mousemove",y)},[m,Qr]);let Yo=rn(()=>{if(!m)return;let y=m.images?.length||0;if(m.text.trim()||y>0)if(m.isNew){let v=Mi();t({type:"ADD_TEXT",payload:{point:m.point,text:m.text||(y>0?`[${y} image${y>1?"s":""}]`:""),fontSize:m.fontSize,id:v,groupId:m.groupId,linkedSelector:m.linkedSelector,linkedAnchor:m.linkedAnchor,elements:m.elements,...y>0?{imageCount:y}:{}}}),y>0&&m.images&&l&&l(v,m.images)}else t({type:"UPDATE_TEXT",payload:{id:m.id,text:m.text||(y>0?`[${y} image${y>1?"s":""}]`:""),...y>0?{imageCount:y}:{}}}),y>0&&m.images&&l&&l(m.id,m.images);else m.isNew||t({type:"DELETE_ANNOTATION",payload:{id:m.id}});j(null)},[m,t,l]),io=rn(y=>{for(let v=0;v<pa.length-1;v++){let D=pa[v],h=pa[v+1];if(y<=(D+h)/2)return D;if(y<h)return h}return Math.round(y/8)*8},[]),ei=rn((y,v,D,h)=>{let E=D.top+Math.max(h.top,4),T=D.bottom-Math.max(h.bottom,4),N=D.left+Math.max(h.left,4),R=D.right-Math.max(h.right,4);if(y<D.left||y>D.right||v<D.top||v>D.bottom)return null;let z=v<E,K=v>T,_=y<N,G=y>R;return z&&_?h.top>=h.left?"top":"left":z&&G?h.top>=h.right?"top":"right":K&&_?h.bottom>=h.left?"bottom":"left":K&&G?h.bottom>=h.right?"bottom":"right":z?"top":K?"bottom":_?"left":G?"right":null},[]),x=rn(y=>{if(!e.isAnnotating)return;if(e.inspectedElement&&e.activeTool==="hand"&&!("button"in y&&y.button===2)){y.preventDefault(),y.stopPropagation(),t({type:"SELECT_ELEMENT",payload:null});return}let v=Jo(y),D="shiftKey"in y&&y.shiftKey;if(e.activeTool==="inspector"){if("button"in y&&y.button===2)return;if(W&&!zo(W)){let T=e.annotations.find(at=>{if(!at.linkedSelector||!at.threadId)return!1;try{return W.matches(at.linkedSelector)}catch{return!1}});if(T?.threadId&&d){d(T.threadId),requestAnimationFrame(()=>{document.querySelector("[data-popmelt-shadow-host]")?.shadowRoot?.querySelector("[data-popmelt-reply]")?.focus()});return}let N=Dn(W),R=Gn(W),z=W.getBoundingClientRect(),K=W.getAttribute("data-pm");K||(K=Math.random().toString(36).substring(2,8),W.setAttribute("data-pm",K));let _=`[data-pm="${K}"]`,G=le.some(at=>{try{return W.matches(at.selector)}catch{return!1}}),X=e.annotations.filter(at=>{if(!at.linkedSelector)return!1;try{return W.matches(at.linkedSelector)}catch{return!1}}).length,Y=(G?1:0)+X,ye=z.top>=Ko*(1+Y)?"top-left":"bottom-left",Ae=w.current?.getContext("2d")??document.createElement("canvas").getContext("2d"),it;Ae&&(Ae.font=`12px ${dn}`,it=Ae.measureText("Type here...").width);let gt=yc(z,ye,Y,M?.current,it,0);V({point:gt,linkedSelector:_,linkedAnchor:ye,elements:[{...N,selector:R}]})}return}if(e.activeTool==="model"){if("button"in y&&y.button===2)return;if(te){let T=te.name;if(b?.has(T)){f?.(T);return}"shiftKey"in y&&y.shiftKey?xe(R=>{let z=new Map(R);return z.has(T)?z.delete(T):z.set(T,te),z}):Ke.size===1&&Ke.has(T)?(u&&u([T]),xe(new Map)):xe(new Map([[T,te]]))}return}if(e.activeTool==="hand"&&Ge&&$e){let T=Ge,N=T.getAttribute("data-pm");N||(N=Math.random().toString(36).substring(2,8),T.setAttribute("data-pm",N));let R=Gn(T),z=`[data-pm="${N}"]`,K=Dn(T),_=pr(T),G=v.x-window.scrollX,X=v.y-window.scrollY,Y=_n,ye=window.getComputedStyle(T).justifyContent,Ae=0;if(Y){let gt=Bo(T).find(at=>at.axis===$e);Ae=gt?$e==="column"?gt.w:gt.h:0}tt(T,"transition","none"),Be.current={isDragging:!0,hasMoved:!1,axis:$e,startX:G,startY:X,originalRow:Y?Ae:_.row,originalColumn:Y?Ae:_.column,element:T,elementInfo:{...K,selector:z},selector:z,durableSelector:R,isAuto:Y,originalJustifyContent:ye,visualGap:Ae},Ot({axis:$e,row:Y?Ae:_.row,column:Y?Ae:_.column});return}if(e.activeTool==="hand"&&Ie&&qt){let T=Ie,N=T.getAttribute("data-pm");N||(N=Math.random().toString(36).substring(2,8),T.setAttribute("data-pm",N));let R=`[data-pm="${N}"]`,z=Dn(T),{fontSize:K,lineHeight:_}=ri(T),G=K>0?_/K:1.2,X=v.x-window.scrollX,Y=v.y-window.scrollY;tt(T,"transition","none");let ye=Gn(T);dt.current={isDragging:!0,property:qt,startX:X,startY:Y,originalFontSize:K,originalLineHeight:_,originalRatio:G,element:T,elementInfo:{...z,selector:R},selector:R,durableSelector:ye},To({property:qt,fontSize:K,lineHeight:_});return}if(e.activeTool==="hand"&&ht&&ke){let T=ht,N=T.getAttribute("data-pm");N||(N=Math.random().toString(36).substring(2,8),T.setAttribute("data-pm",N));let R=`[data-pm="${N}"]`,z=Gn(T),K=Dn(T),_=fr(T),G=T.getBoundingClientRect(),X=Math.floor(G.height/2),Y=v.y-window.scrollY;tt(T,"transition","none"),We.current={isDragging:!0,corner:ke,startY:Y,original:_,maxRadius:X,element:T,elementInfo:{...K,selector:R},selector:R,durableSelector:z},ln({corner:ke,radius:{..._}});return}if(e.activeTool==="hand"&&It&&Jt){let T=It,N=T.getAttribute("data-pm");N||(N=Math.random().toString(36).substring(2,8),T.setAttribute("data-pm",N));let R=`[data-pm="${N}"]`,z=Gn(T),K=Dn(T),_=Br(T),G=v.x-window.scrollX,X=v.y-window.scrollY;tt(T,"transition","none"),Ye.current={isDragging:!0,side:Jt,startX:G,startY:X,original:_,element:T,elementInfo:{...K,selector:R},selector:R,durableSelector:z},Mt({side:Jt,padding:{..._}});return}let h=vi(v);if(h){let T=e.annotations.find(N=>N.id===h.annotationId);if(T&&T.type!=="text"&&(T.status??"pending")==="pending"){Wo({annotationId:h.annotationId,handle:h.handle,startPoint:v,originalPoints:[...T.points],hasMoved:!1});return}}let E=qn(v);if(E&&E.points[0]){if(m&&Yo(),E.type!=="text"?(Sn(E.id,D),E.color&&t({type:"SET_COLOR",payload:E.color})):D||In(),d){let T=E.threadId||(E.groupId?e.annotations.find(N=>N.groupId===E.groupId&&N.threadId)?.threadId:void 0);T&&d(T)}fo({annotation:E,startPoint:v,hasMoved:!1});return}if(D||In(),e.activeTool==="text"){m&&Yo();let T=Math.random().toString(36).substring(2,9);j({id:T,point:v,text:"",fontSize:12,isNew:!0});return}g(!0),t({type:"START_PATH",payload:v})},[e.isAnnotating,e.activeTool,e.inspectedElement,e.annotations,m,Et,W,It,Jt,ht,ke,Ge,$e,_n,Ie,qt,te,Ke,b,u,f,d,Jo,qn,vi,t,Sn,In,Yo]),A=rn(y=>{let v=Jo(y);if(e.activeTool==="inspector"&&e.isAnnotating){let D=v.x-window.scrollX,h=v.y-window.scrollY,E=ur(D,h),T=E&&zo(E)?null:E;T!==W&&(ee(T),Ne(T?Dn(T):null));return}if(e.activeTool==="model"&&e.isAnnotating){let D=v.x-window.scrollX,h=v.y-window.scrollY,E=ur(D,h);if(E!==ut.current&&(ut.current=E,Le.current=0),E){let T=Pi(E,Le.current);ot(T)}else ot(null);return}if(e.activeTool==="hand"&&e.isAnnotating){let D=v.x-window.scrollX,h=v.y-window.scrollY;$n.current={x:D,y:h},Ce({x:D,y:h});let E=er.current.cmd,T=er.current.shift;if(Be.current.isDragging){let R=Be.current,z=R.element;if(!z)return;if(!R.hasMoved){let X=Math.abs(D-R.startX),Y=Math.abs(h-R.startY);if(X<=2&&Y<=2)return;R.hasMoved=!0,R.isAuto&&(tt(z,"justify-content","normal"),tt(z,"row-gap",`${R.visualGap}px`),tt(z,"column-gap",`${R.visualGap}px`),Yt(!1))}let K=R.axis,_=R.originalRow,G=R.originalColumn;if(K==="column"){let X=D-R.startX;G=R.originalColumn+X,E||(_=R.originalRow+X)}else{let X=h-R.startY;_=R.originalRow+X,E||(G=R.originalColumn+X)}_=Math.max(0,_),G=Math.max(0,G),T&&(_=io(_),G=io(G)),_=Math.round(_),G=Math.round(G),tt(z,"row-gap",`${_}px`),tt(z,"column-gap",`${G}px`),Ot({axis:K,row:_,column:G});return}if(We.current.isDragging){let R=We.current,z=R.element;if(!z)return;let K=h-R.startY,_=R.corner,G=R.original,X={...G};if(E){let Y=G[_]+K;Y=Math.max(0,Math.min(R.maxRadius,Y)),T&&(Y=io(Y)),Y=Math.round(Y),X[_]=Y}else{let Y=G[_]+K;Y=Math.max(0,Math.min(R.maxRadius,Y)),T&&(Y=io(Y)),Y=Math.round(Y),X={"top-left":Y,"top-right":Y,"bottom-right":Y,"bottom-left":Y}}tt(z,"border-top-left-radius",`${X["top-left"]}px`),tt(z,"border-top-right-radius",`${X["top-right"]}px`),tt(z,"border-bottom-right-radius",`${X["bottom-right"]}px`),tt(z,"border-bottom-left-radius",`${X["bottom-left"]}px`),ln({corner:_,radius:X});return}if(dt.current.isDragging){let R=dt.current,z=R.element;if(!z)return;let K=R.property,_=R.originalFontSize,G=R.originalLineHeight,X=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(K==="font-size"){let ye=D-R.startX;_=R.originalFontSize+ye,_=Math.max(1,_)}else{let ye=h-R.startY;G=R.originalLineHeight+ye,G=Math.max(_,G)}if(T)if(K==="font-size"){let ye=X[0],Ae=Math.abs(_-ye);for(let it of X){let gt=Math.abs(_-it);gt<Ae&&(ye=it,Ae=gt)}_=ye}else{let ye=_>0?G/_:1.2,Ae=Math.round(ye*2)/2;G=_*Math.max(1,Ae)}_=Math.round(_),G=Math.round(G*10)/10,tt(z,"font-size",`${_}px`);let Y=_>0?Math.round(G/_*1e3)/1e3:1.2;tt(z,"line-height",`${Y}`),To({property:K,fontSize:_,lineHeight:G});return}if(Ye.current.isDragging){let R=Ye.current,z=R.element;if(!z)return;let K=R.side,_=R.original,G=_.top,X=_.right,Y=_.bottom,ye=_.left;if(K==="top"){let Ae=R.startY-h;G=_.top+Ae,E||(Y=_.bottom+Ae)}else if(K==="bottom"){let Ae=h-R.startY;Y=_.bottom+Ae,E||(G=_.top+Ae)}else if(K==="left"){let Ae=R.startX-D;ye=_.left+Ae,E||(X=_.right+Ae)}else if(K==="right"){let Ae=D-R.startX;X=_.right+Ae,E||(ye=_.left+Ae)}G=Math.max(0,G),X=Math.max(0,X),Y=Math.max(0,Y),ye=Math.max(0,ye),T&&(G=io(G),X=io(X),Y=io(Y),ye=io(ye)),G=Math.round(G),X=Math.round(X),Y=Math.round(Y),ye=Math.round(ye),tt(z,"padding",`${G}px ${X}px ${Y}px ${ye}px`),Mt({side:K,padding:{top:G,right:X,bottom:Y,left:ye}});return}let N=ur(D,h);for(;N&&N.tagName==="A";)N=N.parentElement;{let z=[];N&&z.push(N),ht&&ht!==N&&z.push(ht);let K=null,_=16,G=null;for(let X of z){let Y=X.getBoundingClientRect(),ye=fr(X),Ae=[["top-left",Y.left,Y.top+ye["top-left"]],["top-right",Y.right,Y.top+ye["top-right"]],["bottom-right",Y.right,Y.bottom-ye["bottom-right"]],["bottom-left",Y.left,Y.bottom-ye["bottom-left"]]];for(let[it,gt,at]of Ae){let Tt=Math.hypot(D-gt,h-at);Tt<_&&(_=Tt,K=it,G=X)}}if(K&&G){J(G),Ze(K),It&&Xt(null),Jt&&Xe(null),Ge&&Pt(null),$e&<(null),Yt(!1),Ie&&tn(null),qt&&Wn(null);return}}ht&&J(null),ke&&Ze(null);{let R=[];N&&Oi(N)&&R.push(N);let z=N?.parentElement??null;for(;z&&z!==document.body&&R.length<3;)Oi(z)&&R.push(z),z=z.parentElement;for(let K of R){let G=Bo(K).find(X=>D>=X.x&&D<=X.x+X.w&&h>=X.y&&h<=X.y+X.h);if(G){Pt(K),lt(G.axis),Yt(ks(K,G.axis)),It&&Xt(null),Jt&&Xe(null),Ie&&tn(null),qt&&Wn(null);return}}}Ge&&Pt(null),$e&<(null),Yt(!1);{let z=[];N&&z.push(N),Ie&&Ie!==N&&z.push(Ie);let K=null,_=1/0,G=null;for(let X of z){if(!Is(X))continue;let Y=Dr(X);if(!Y)continue;let ye=D>=Y.left&&D<=Y.right&&h>=Y.top&&h<=Y.bottom,Ae=[["font-size",Y.right,Y.top+Y.height/2],["line-height",Y.left+Y.width/2,Y.bottom]];for(let[it,gt,at]of Ae){let Tt=Math.hypot(D-gt,h-at);(ye||Tt<12)&&Tt<_&&(_=Tt,K=it,G=X)}}K&&G?(tn(G),Wn(K)):(Ie&&tn(null),qt&&Wn(null))}if(N!==It&&Xt(N),N){let R=Br(N),z=N.getBoundingClientRect(),K=ei(D,h,z,R);Xe(K)}else Xe(null);return}if(wn){let{handle:D,originalPoints:h,hasMoved:E}=wn,T=e.annotations.find(_=>_.id===wn.annotationId);if(!T)return;let N="metaKey"in y,R=N&&(y.metaKey||y.ctrlKey),z=N&&y.shiftKey,K;if(T.type==="line"){let _=h[0],G=h[h.length-1];D==="start"?K=[v,G]:K=[_,v]}else if(T.type==="freehand"){let _=Math.min(...h.map(ze=>ze.x)),G=Math.max(...h.map(ze=>ze.x)),X=Math.min(...h.map(ze=>ze.y)),Y=Math.max(...h.map(ze=>ze.y)),ye=(_+G)/2,Ae=(X+Y)/2,it=G-_||1,gt=Y-X||1,at=it/gt,Tt=_,$t=G,bt=X,ce=Y;switch(D){case"topLeft":Tt=v.x,bt=v.y;break;case"topRight":$t=v.x,bt=v.y;break;case"bottomLeft":Tt=v.x,ce=v.y;break;case"bottomRight":$t=v.x,ce=v.y;break}if(R)switch(D){case"topLeft":$t=G+(_-Tt),ce=Y+(X-bt);break;case"topRight":Tt=_-($t-G),ce=Y+(X-bt);break;case"bottomLeft":$t=G+(_-Tt),bt=X-(ce-Y);break;case"bottomRight":Tt=_-($t-G),bt=X-(ce-Y);break}if(z){let ze=$t-Tt,Qt=ce-bt;if(Math.abs(ze/Qt)>at){let Rt=Math.abs(Qt)*at*Math.sign(ze);D==="topLeft"||D==="bottomLeft"?Tt=$t-Rt:$t=Tt+Rt}else{let Rt=Math.abs(ze)/at*Math.sign(Qt);D==="topLeft"||D==="topRight"?bt=ce-Rt:ce=bt+Rt}}let Ve=$t-Tt||1,Wt=ce-bt||1;K=h.map(ze=>({x:Tt+(ze.x-_)/it*Ve,y:bt+(ze.y-X)/gt*Wt}))}else if(T.type==="circle"){let _=h[0],G=h[h.length-1],X=Math.min(_.x,G.x),Y=Math.max(_.x,G.x),ye=Math.min(_.y,G.y),Ae=Math.max(_.y,G.y),it=(X+Y)/2,gt=(ye+Ae)/2,at=Y-X,Tt=Ae-ye,$t=X,bt=Y,ce=ye,Ve=Ae;switch(D){case"top":if(ce=v.y,R&&(Ve=gt+(gt-v.y)),z){let ze=(Ve-ce)*(at/Tt)/2;$t=it-ze,bt=it+ze}break;case"bottom":if(Ve=v.y,R&&(ce=gt-(v.y-gt)),z){let ze=(Ve-ce)*(at/Tt)/2;$t=it-ze,bt=it+ze}break;case"left":if($t=v.x,R&&(bt=it+(it-v.x)),z){let ze=(bt-$t)*(Tt/at)/2;ce=gt-ze,Ve=gt+ze}break;case"right":if(bt=v.x,R&&($t=it-(v.x-it)),z){let ze=(bt-$t)*(Tt/at)/2;ce=gt-ze,Ve=gt+ze}break}K=[{x:$t,y:ce},{x:bt,y:Ve}]}else{let _=h[0],G=h[h.length-1],X=Math.min(_.x,G.x),Y=Math.max(_.x,G.x),ye=Math.min(_.y,G.y),Ae=Math.max(_.y,G.y),it=(X+Y)/2,gt=(ye+Ae)/2,at=Y-X||1,Tt=Ae-ye||1,$t=at/Tt,bt=X,ce=Y,Ve=ye,Wt=Ae;switch(D){case"topLeft":bt=v.x,Ve=v.y;break;case"topRight":ce=v.x,Ve=v.y;break;case"bottomLeft":bt=v.x,Wt=v.y;break;case"bottomRight":ce=v.x,Wt=v.y;break}if(R)switch(D){case"topLeft":ce=Y+(X-bt),Wt=Ae+(ye-Ve);break;case"topRight":bt=X-(ce-Y),Wt=Ae+(ye-Ve);break;case"bottomLeft":ce=Y+(X-bt),Ve=ye-(Wt-Ae);break;case"bottomRight":bt=X-(ce-Y),Ve=ye-(Wt-Ae);break}if(z){let ze=ce-bt,Qt=Wt-Ve;if(Math.abs(ze/Qt)>$t){let Rt=Math.abs(Qt)*$t*Math.sign(ze);D==="topLeft"||D==="bottomLeft"?bt=ce-Rt:ce=bt+Rt}else{let Rt=Math.abs(ze)/$t*Math.sign(Qt);D==="topLeft"||D==="topRight"?Ve=Wt-Rt:Wt=Ve+Rt}}K=[{x:bt,y:Ve},{x:ce,y:Wt}]}t({type:"RESIZE_ANNOTATION",payload:{id:wn.annotationId,points:K,saveUndo:!E}}),E||Wo({...wn,hasMoved:!0});return}if(Qe&&(Qe.annotation.status??"pending")==="pending"){let D=v.x-Qe.startPoint.x,h=v.y-Qe.startPoint.y;if((Math.abs(D)>2||Math.abs(h)>2)&&!Qe.hasMoved)fo({...Qe,hasMoved:!0,startPoint:v}),t({type:"MOVE_ANNOTATION",payload:{id:Qe.annotation.id,delta:{x:D,y:h},saveUndo:!0}});else if(Qe.hasMoved){let T=v.x-Qe.startPoint.x,N=v.y-Qe.startPoint.y;fo({...Qe,startPoint:v}),t({type:"MOVE_ANNOTATION",payload:{id:Qe.annotation.id,delta:{x:T,y:N}}})}return}!O||!e.isAnnotating||t({type:"CONTINUE_PATH",payload:v})},[O,e.isAnnotating,e.activeTool,Qe,wn,W,It,Jt,ht,ke,Ge,$e,Ie,qt,Jo,t,io,ei]),Q=rn(y=>{if(dt.current.isDragging){let h=dt.current,E=h.element;if(E&&h.selector&&h.elementInfo&&zt){E instanceof HTMLElement&&(E.style.removeProperty("font-size"),E.style.removeProperty("line-height"),E.style.removeProperty("transition"));let T=[];if(h.originalFontSize!==zt.fontSize&&(tt(E,"font-size",`${zt.fontSize}px`),T.push({property:"font-size",original:`${h.originalFontSize}px`,modified:`${zt.fontSize}px`})),h.originalLineHeight!==zt.lineHeight){let N=h.originalFontSize>0?Math.round(h.originalLineHeight/h.originalFontSize*1e3)/1e3:1.2,R=zt.fontSize>0?Math.round(zt.lineHeight/zt.fontSize*1e3)/1e3:1.2;tt(E,"line-height",`${R}`),T.push({property:"line-height",original:`${N}`,modified:`${R}`})}T.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:h.selector,durableSelector:h.durableSelector??void 0,element:h.elementInfo,changes:T}})}dt.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},To(null);return}if(Be.current.isDragging){let h=Be.current,E=h.element,T="button"in y&&y.button===2;if(!h.hasMoved&&!T&&E&&h.selector&&h.elementInfo){E instanceof HTMLElement&&E.style.removeProperty("transition");let N=["space-between","space-around","stretch","normal"],R=h.originalJustifyContent||"normal",z=N.indexOf(R),K=N[(z+1)%N.length],_=[];K==="normal"?(tt(E,"justify-content","normal"),_.push({property:"justify-content",original:h.originalJustifyContent,modified:"normal"})):K==="stretch"?(tt(E,"justify-content",K),tt(E,"row-gap","8px"),tt(E,"column-gap","8px"),_.push({property:"justify-content",original:h.originalJustifyContent||"normal",modified:K}),h.originalRow!==8&&_.push({property:"row-gap",original:`${h.originalRow}px`,modified:"8px"}),h.originalColumn!==8&&_.push({property:"column-gap",original:`${h.originalColumn}px`,modified:"8px"})):(E instanceof HTMLElement&&(E.style.removeProperty("row-gap"),E.style.removeProperty("column-gap")),tt(E,"justify-content",K),_.push({property:"justify-content",original:h.originalJustifyContent||"normal",modified:K}),h.originalRow>0&&_.push({property:"row-gap",original:`${h.originalRow}px`,modified:"0px"}),h.originalColumn>0&&_.push({property:"column-gap",original:`${h.originalColumn}px`,modified:"0px"})),_.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:h.selector,durableSelector:h.durableSelector??void 0,element:h.elementInfo,changes:_}})}else if(h.hasMoved&&E&&h.selector&&h.elementInfo&&qe){E instanceof HTMLElement&&(E.style.removeProperty("row-gap"),E.style.removeProperty("column-gap"),E.style.removeProperty("transition"));let N=[];h.isAuto?(E instanceof HTMLElement&&E.style.removeProperty("justify-content"),tt(E,"justify-content","normal"),tt(E,"row-gap",`${qe.row}px`),tt(E,"column-gap",`${qe.column}px`),N.push({property:"justify-content",original:h.originalJustifyContent,modified:"normal"}),N.push({property:"row-gap",original:"0px",modified:`${qe.row}px`}),N.push({property:"column-gap",original:"0px",modified:`${qe.column}px`})):(h.originalRow!==qe.row&&(tt(E,"row-gap",`${qe.row}px`),N.push({property:"row-gap",original:`${h.originalRow}px`,modified:`${qe.row}px`})),h.originalColumn!==qe.column&&(tt(E,"column-gap",`${qe.column}px`),N.push({property:"column-gap",original:`${h.originalColumn}px`,modified:`${qe.column}px`}))),N.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:h.selector,durableSelector:h.durableSelector??void 0,element:h.elementInfo,changes:N}})}Be.current={isDragging:!1,hasMoved:!1,axis:null,startX:0,startY:0,originalRow:0,originalColumn:0,element:null,elementInfo:null,selector:null,durableSelector:null,isAuto:!1,originalJustifyContent:"",visualGap:0},Ot(null);return}if(We.current.isDragging){let h=We.current,E=h.element;if(E&&h.selector&&h.elementInfo&&Ct){E instanceof HTMLElement&&(E.style.removeProperty("border-top-left-radius"),E.style.removeProperty("border-top-right-radius"),E.style.removeProperty("border-bottom-right-radius"),E.style.removeProperty("border-bottom-left-radius"),E.style.removeProperty("transition"));let T=["top-left","top-right","bottom-right","bottom-left"],N={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},R=[];for(let z of T)h.original[z]!==Ct.radius[z]&&(tt(E,N[z],`${Ct.radius[z]}px`),R.push({property:N[z],original:`${h.original[z]}px`,modified:`${Ct.radius[z]}px`}));R.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:h.selector,durableSelector:h.durableSelector??void 0,element:h.elementInfo,changes:R}})}We.current={isDragging:!1,corner:null,startY:0,original:{"top-left":0,"top-right":0,"bottom-right":0,"bottom-left":0},maxRadius:0,element:null,elementInfo:null,selector:null,durableSelector:null},ln(null);return}if(Ye.current.isDragging){let h=Ye.current,E=h.element,T=h.selector,N=h.elementInfo;if(E&&T&&N&&nt){let R=h.original,z=nt.padding;E instanceof HTMLElement&&(E.style.removeProperty("padding"),E.style.removeProperty("transition"));let K=[],_=[{prop:"padding-top",origVal:R.top,newVal:z.top},{prop:"padding-right",origVal:R.right,newVal:z.right},{prop:"padding-bottom",origVal:R.bottom,newVal:z.bottom},{prop:"padding-left",origVal:R.left,newVal:z.left}];for(let{prop:G,origVal:X,newVal:Y}of _)X!==Y&&(tt(E,G,`${Y}px`),K.push({property:G,original:`${X}px`,modified:`${Y}px`}));K.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:T,durableSelector:h.durableSelector??void 0,element:N,changes:K}})}Ye.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},Mt(null);return}if(wn){Wo(null);return}if(Qe){if(!Qe.hasMoved&&Qe.annotation.type==="text"&&(Qe.annotation.status??"pending")==="pending"){let h=Jo(y);j({id:Qe.annotation.id,point:Qe.annotation.points[0],text:Qe.annotation.text||"",fontSize:Qe.annotation.fontSize||12,isNew:!1,clickPoint:h,groupId:Qe.annotation.groupId})}fo(null);return}if(!O)return;let v=5;if(e.currentPath.length>=2){let h=e.currentPath[0],E=e.currentPath[e.currentPath.length-1],T=Math.abs(E.x-h.x),N=Math.abs(E.y-h.y);if((e.activeTool==="line"?Math.sqrt(T*T+N*N)<v:T<v&&N<v)&&["rectangle","circle","line"].includes(e.activeTool)){g(!1),t({type:"CANCEL_PATH"});return}}let D=Ss(e.currentPath);if(e.activeTool==="rectangle"&&e.currentPath.length>=2){let h=e.currentPath[0],E=e.currentPath[e.currentPath.length-1],T=Math.min(h.x,E.x),N=Math.max(h.y,E.y),R=e.strokeWidth/2,z=Math.random().toString(36).substring(2,9);we({point:{x:T-R+4,y:N+R+4},groupId:z}),g(!1),t({type:"FINISH_PATH",payload:{groupId:z,elements:D}});return}g(!1),t({type:"FINISH_PATH",payload:{elements:D}})},[O,Qe,wn,nt,Ct,qe,zt,Jo,t,e.activeTool,e.currentPath,e.strokeWidth]),se=rn(y=>{let v=y.target.value;un.current=y.target.selectionStart,j(D=>D&&{...D,text:v})},[]),ve=rn(y=>{y.key==="Escape"?j(null):y.key==="Enter"&&!y.shiftKey&&(y.preventDefault(),Yo())},[Yo]),Se=rn(y=>{if(!m)return;let v=y.clipboardData.items,D=[];for(let h=0;h<v.length;h++){let E=v[h];if(E.type.startsWith("image/")){let T=E.getAsFile();T&&D.push(T)}}D.length>0&&(y.preventDefault(),j(h=>h?{...h,images:[...h.images||[],...D]}:null))},[m]),Oe=rn(y=>{if(!e.isAnnotating)return;if(e.activeTool==="hand"){y.preventDefault();let D=It||Ge||ht||Ie;if(D&&!zo(D)){let h=Dn(D),E=Gn(D);t({type:"SELECT_ELEMENT",payload:{el:D,info:{...h,selector:E}}})}return}y.preventDefault();let v=w.current;v&&(k.current=!0,v.style.pointerEvents="none",setTimeout(()=>{k.current&&(k.current=!1,v.style.pointerEvents="")},4e3))},[e.activeTool,e.isAnnotating,It,Ge,ht,Ie,t,zo,w]);kn(()=>{let y=ae.filter(N=>N.linkedSelector);if(y.length===0)return;let v=null,D=document.createElement("canvas").getContext("2d"),h=()=>{let N=[];for(let R of y){let z=document.querySelector(R.linkedSelector);if(!z&&R.elements?.[0]?.selector&&R.linkedSelector.startsWith("[data-pm=")){try{z=document.querySelector(R.elements[0].selector)}catch{}if(z){let at=R.linkedSelector.match(/data-pm="([^"]+)"/)?.[1];at&&z.setAttribute("data-pm",at)}}if(!z)continue;let K=z.getBoundingClientRect(),_=le.some(at=>{try{return z.matches(at.selector)}catch{return!1}}),G=y.filter(at=>at.id!==R.id&&at.timestamp<R.timestamp&&at.linkedSelector===R.linkedSelector).length,X=(_?1:0)+G,Y;if(R.text&&D){let at=R.fontSize||12;D.font=`${at}px ${dn}`,Y=Math.max(...R.text.split(`
|
|
5
|
-
`).map(
|
|
6
|
-
`),
|
|
7
|
-
`).length)*m.fontSize*1.4+8:0,so=ft.height+8,nr=ft.isWrapped?so-St:0,or=m?m.point.y-4-Zt.y-nr:0,xi=m?m.point.x-4-Zt.x:0,Si=ft.width+8,ps=m?_s(or,so,fe,xi,Si):0,Vo=m?{position:"fixed",left:xi,top:ps,zIndex:9999,width:Si,height:so,padding:4,fontSize:m.fontSize,fontFamily:dn,color:"#ffffff",backgroundColor:e.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:ft.isWrapped?"pre-wrap":"pre",wordBreak:ft.isWrapped?"break-word":void 0}:{},kr=y=>y?e.annotations.find(v=>v.id===y)?.linkedSelector??null:null,et=(y,v)=>{if(!v)return!1;try{return y.matches(v)}catch{return!1}},nn=[m?.linkedSelector,Ee?.linkedSelector,kr(H),kr(pt),rt].filter(Boolean),fn=y=>nn.some(v=>et(y,v));return Ur(Kr,{children:[mt("canvas",{ref:q,id:"devtools-canvas",style:De,onMouseDown:x,onMouseMove:A,onMouseUp:y=>Q(y),onMouseLeave:y=>{Q(y),ee(null),Ne(null)},onTouchStart:x,onTouchMove:A,onTouchEnd:y=>Q(y),onContextMenu:Oe}),m&&Ur(Kr,{children:[mt("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),mt("textarea",{id:"devtools-text-input",ref:B,value:m.text,onChange:se,onKeyDown:ve,onPaste:Se,onBlur:Yo,placeholder:"Type here...",style:Vo}),m.images&&m.images.length>0&&Ur("div",{"data-devtools":!0,style:{position:"fixed",left:m.point.x-4-Zt.x,top:m.point.y-4-Zt.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:[m.images.length," image",m.images.length>1?"s":""," attached"]})]}),e.isAnnotating&&e.activeTool!=="hand"&&le.length>0&&mt(Ul,{styleModifications:le,isInspecting:!!e.inspectedElement,accentColor:e.activeColor,annotationGroupCount:new Set(ae.map(y=>y.groupId||y.id)).size,dispatch:t,inFlightSelectors:a,toolbarRef:M,onHoverSelector:st}),e.activeTool==="hand"&&e.isAnnotating&&le.length>0&&mt(Xl,{styleModifications:le,accentColor:e.activeColor}),e.isAnnotating&&mt(Nl,{annotations:ae,supersededAnnotations:yt,inFlightIds:o,activeIds:r,queuePositions:i,scrollX:Zt.x,scrollY:Zt.y,annotationGroupMap:Ft,onViewThread:d,onSelectAnnotation:Sn,onHoverAnnotation:Te,canvasRef:w,toolbarRef:M}),e.isAnnotating&&s&&s.size>0&&mt(Ws,{inFlightSelectorColors:s}),e.isAnnotating&&ct&&mt(Ws,{inFlightSelectorColors:ct,animated:!1}),e.activeTool==="hand"&&e.isAnnotating&&(qe?Be.current.element:Ge)&&mt(Us,{element:qe?Be.current.element:Ge,gap:qe?{row:qe.row,column:qe.column}:pr(Ge),accentColor:e.activeColor,hoveredAxis:$e,draggingAxis:qe?.axis??null,cursorViewport:oe,isAutoGap:_n,refreshKey:xn}),e.activeTool==="hand"&&e.isAnnotating&&On&&mt(gc,{element:On.target,modifier:On.modifier,accentColor:e.activeColor,refreshKey:xn}),e.activeTool==="hand"&&e.isAnnotating&&!On&&(Ct?We.current.element:ht)&&mt(jl,{element:Ct?We.current.element:ht,radius:Ct?.radius??fr(ht),accentColor:e.activeColor,hoveredCorner:ke,draggingCorner:Ct?.corner??null,cursorViewport:oe}),e.activeTool==="hand"&&e.isAnnotating&&!On&&(zt?dt.current.element:Ie)&&mt(mc,{element:zt?dt.current.element:Ie,fontSize:zt?.fontSize??ri(Ie).fontSize,lineHeight:zt?.lineHeight??ri(Ie).lineHeight,accentColor:e.activeColor,hoveredProperty:qt,draggingProperty:zt?.property??null,cursorViewport:oe}),e.activeTool==="hand"&&e.isAnnotating&&!On&&(nt?Ye.current.element:It)&&mt(Qs,{element:nt?Ye.current.element:It,padding:nt?.padding??Br(It),accentColor:e.activeColor,hoveredSide:Jt,draggingSide:nt?.side??null,cursorViewport:oe,refreshKey:zt?zt.fontSize+zt.lineHeight*1e3:0}),e.activeTool==="inspector"&&e.isAnnotating&&mt(Kr,{children:W&&!e.inspectedElement&&(()=>{if(fn(W))return null;let y=!!Ee||!!m?.linkedSelector||ae.some(v=>{if(!v.linkedSelector)return!1;try{return W.matches(v.linkedSelector)}catch{return!1}});return mt(xo,{element:W,isSelected:!1,elementInfo:ie,color:e.activeColor,hideTooltip:y})})()}),(m?.linkedSelector||Ee?.linkedSelector)&&(()=>{let y=m?.linkedSelector||Ee?.linkedSelector;if(!y)return null;let v=null;try{v=document.querySelector(y)}catch{}return v?mt(xo,{element:v,isSelected:!0,color:e.activeColor,hideTooltip:!0}):null})(),H&&(()=>{let y=e.annotations.find(h=>h.id===H);if(!y?.linkedSelector)return null;let v=null;try{v=document.querySelector(y.linkedSelector)}catch{}if(!v)return null;let D=!!(o&&o.has(y.id));return mt(xo,{element:v,isSelected:!D,color:y.color,hideTooltip:!0})})(),pt&&(()=>{let y=e.annotations.find(E=>E.id===pt);if(!y?.linkedSelector)return null;let v=null;try{v=document.querySelector(y.linkedSelector)}catch{}if(!v)return null;let D=y.groupId?e.annotations.filter(E=>E.groupId===y.groupId):[y],h=!!(o&&D.some(E=>o.has(E.id)));return mt(xo,{element:v,isSelected:!h,color:y.color,hideTooltip:!0})})(),rt&&(()=>{let y=null;try{y=document.querySelector(rt)}catch{}if(!y)return null;let v=!!(a&&a.has(rt));return mt(xo,{element:y,isSelected:!v,color:e.activeColor,hideTooltip:!0})})(),e.activeTool==="model"&&e.isAnnotating&&Ke.size>0&&[...Ke.entries()].map(([y,v])=>mt(xo,{element:v.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:v.rootElement.tagName.toLowerCase(),reactComponent:y},color:"#8b5cf6"},y)),e.activeTool==="model"&&e.isAnnotating&&Mo&&mt(xo,{element:Mo.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:Mo.rootElement.tagName.toLowerCase(),reactComponent:Mo.name},color:"#22c55e"}),e.activeTool==="model"&&e.isAnnotating&&Ro.length>0&&Ro.map((y,v)=>mt("div",{style:{position:"absolute",left:y.x,top:y.y,width:y.width,height:y.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:y.direction==="vertical"?Ur(Kr,{children:[mt("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),mt("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),mt("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),mt("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:y.height<16?-6:"50%",transform:y.height<16?"none":"translateY(-50%)",fontSize:11,fontWeight:600,color:"#fff",backgroundColor:"#FF0000",padding:"2px 4px",whiteSpace:"nowrap",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1},children:Math.round(y.height)})]}):Ur(Kr,{children:[mt("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),mt("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),mt("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),mt("div",{style:{position:"absolute",left:y.width<30?0:"50%",top:(y.width<30,void 0),bottom:"calc(50% + 4px)",transform:y.width<30?"none":"translateX(-50%)",fontSize:11,fontWeight:600,color:"#fff",backgroundColor:"#FF0000",padding:"2px 4px",whiteSpace:"nowrap",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1},children:Math.round(y.width)})]})},v)),e.activeTool==="model"&&e.isAnnotating&&te&&mt(xo,{element:te.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:te.rootElement.tagName.toLowerCase(),reactComponent:te.name},color:b?.has(te.name)?"#22c55e":"#8b5cf6"}),e.activeTool==="hand"&&e.isAnnotating&&e.inspectedElement&&Ur(Kr,{children:[je&&je!=="padding"&&je!=="gap"&&(()=>{let y=new Set(ae.map(R=>R.groupId||R.id)).size,v=e.inspectedElement.info.selector,D=le.findIndex(R=>R.selector===v),h=D>=0?y+D+1:y+le.length+1,E=le.find(R=>R.selector===v),T=E?.changes.length??0,N=!!E?.captured;return mt(xo,{element:e.inspectedElement.el,isSelected:!0,elementInfo:e.inspectedElement.info,color:N?"#999999":e.activeColor,annotationNumber:h,changeCount:T})})(),je==="padding"&&mt(Qs,{element:e.inspectedElement.el,padding:Br(e.inspectedElement.el),accentColor:e.activeColor,hoveredSide:null,draggingSide:null}),je==="gap"&&mt(Us,{element:e.inspectedElement.el,gap:pr(e.inspectedElement.el),accentColor:e.activeColor,hoveredAxis:null,draggingAxis:null}),mt(pc,{element:e.inspectedElement.el,elementInfo:e.inspectedElement.info,selector:e.inspectedElement.info.selector,styleModifications:le,dispatch:t,onClose:()=>t({type:"SELECT_ELEMENT",payload:null}),onHover:an,accentColor:e.activeColor,toolbarRef:M})]})]})}import{useCallback as Vn,useEffect as mn,useMemo as xr,useRef as Ht,useState as Sr}from"react";import{Check as Ig,Circle as Mg,Component as Rg,Fingerprint as Ag,Hand as Lg,MessageCircle as Pg,Pen as Bg,RefreshCw as Dg,Slash as _g,Square as Og,Trash2 as Hg,Type as Ng}from"lucide-react";import{useEffect as vc,useRef as xc}from"react";function Sc(e,t,n,o,r){let i=xc(0),a=xc(t.annotations);vc(()=>{if(!n.current||!e)return;a.current=t.annotations;let s=t.annotations.length;s>0&&(s>=i.current||!o)&&(localStorage.setItem(r.annotations,JSON.stringify(t.annotations)),i.current=s)},[t.annotations,e,o,n,r]),vc(()=>{n.current&&(localStorage.setItem(r.expanded,String(e)),e&&(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.styleModifications,t.spacingTokenChanges,t.activeTool,t.activeColor,t.strokeWidth,t.inspectedElement,n,r])}import{useCallback as An,useEffect as yr,useMemo as ga,useRef as fi,useState as wo}from"react";import{Fragment as Mf,jsx as Bt,jsxs as co}from"react/jsx-runtime";var lf={width:340,backgroundColor:"#eaeaea",...Wr,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"},cf=(e,t)=>({width:"100%",border:"1px solid rgba(0,0,0,0.12)",background:t?"rgba(0,0,0,0.04)":"rgba(0,0,0,0.02)",cursor:e?"default":"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"5px 8px",color:e?"#9ca3af":"#6b7280"}),df=e=>({border:0,background:"transparent",color:e?"#111827":"#6b7280",cursor:"pointer",fontFamily:"inherit",fontSize:10,fontWeight:700,padding:0,textTransform:"uppercase"}),ma={border:"1px solid rgba(0,0,0,0.12)",background:"rgba(0,0,0,0.02)",cursor:"pointer",fontFamily:"inherit",fontSize:10,fontWeight:650,color:"#6b7280",padding:"6px 8px",flex:1},Zi={...ma,borderColor:"#111827",background:"#111827",color:"#ffffff"},uf={...Zi,cursor:"default",opacity:.55},ha={display:"block",width:"100%",border:0,background:"transparent",boxSizing:"border-box",color:"inherit",cursor:"text",font:"inherit",lineHeight:1.25,margin:0,padding:0,textAlign:"left"},pf={...ha,appearance:"none",resize:"none",overflow:"hidden",outline:"none"},Tc={...ha,fontWeight:700,fontSize:11,lineHeight:1.35},ff={...Tc,appearance:"none",resize:"none",overflow:"hidden",outline:"none"},wc={display:"grid",gridTemplateColumns:"12px minmax(0, 1fr)",columnGap:4,alignItems:"start",marginBottom:5},gf={pass:"#2f855a",fail:"#c53030",needs_review:"#6b7280"},mf={pass:"\u2611",fail:"\u2612",needs_review:"\u25A1"},hf=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"Eval",yf=[{id:"pending",label:"Pending"},{id:"approved",label:"Approved"},{id:"rejected",label:"Rejected"}],Cc="popmelt-eval-active-status",bf=e=>e==="pending"||e==="approved"||e==="rejected";function kc({bridgeUrl:e,refreshKey:t,onMouseEnter:n,onMouseLeave:o,onSynthesize:r,isSynthesizing:i,onRunEval:a,onViewRunThread:s,runningEvalIds:l=[],snapPosition:d="bottom-right"}){let c=fi(null),u=i||!r,[f,p]=wo({version:1,updatedAt:0,cases:[]}),[b,S]=wo(!0),[C,P]=wo(()=>{if(typeof window>"u")return"pending";try{let k=window.localStorage.getItem(Cc);return bf(k)?k:"pending"}catch{return"pending"}});yr(()=>{let k=c.current;if(!k)return;let O=n,g=o;return O&&k.addEventListener("mouseenter",O),g&&k.addEventListener("mouseleave",g),()=>{O&&k.removeEventListener("mouseenter",O),g&&k.removeEventListener("mouseleave",g)}},[n,o]);let H=An(()=>{e&&(S(!0),ja(e).then(k=>{p(k),S(!1)}).catch(()=>S(!1)))},[e]);yr(()=>{H()},[H,t]),yr(()=>{try{window.localStorage.setItem(Cc,C)}catch{}},[C]);let I=An((k,O)=>{e&&(p(g=>({...g,cases:g.cases.map(m=>m.id===k?{...m,status:O}:m)})),Ga(k,O,e).then(g=>{g||H()}).catch(H))},[e,H]),M=An((k,O)=>{if(!e)return;let g=O.map(m=>m.trim()).filter(Boolean);g.length!==0&&(p(m=>({...m,cases:m.cases.map(j=>j.id===k?{...j,assertions:g}:j)})),Ci(k,{assertions:g},e).then(m=>{m||H()}).catch(H))},[e,H]),w=An((k,O)=>{if(!e)return;let g=O.trim();g&&(p(m=>({...m,cases:m.cases.map(j=>j.id===k?{...j,title:g}:j)})),Ci(k,{title:g},e).then(m=>{m||H()}).catch(H))},[e,H]),$=ga(()=>{let k=f.cases.filter(m=>m.status==="pending"),O=f.cases.filter(m=>m.status==="approved"),g=f.cases.filter(m=>m.status==="rejected");return{pending:k,approved:O,rejected:g}},[f.cases]),Z=$[C],q=ga(()=>{let k=new Map,O=[...f.runs??[]].sort((g,m)=>m.completedAt-g.completedAt);for(let g of O)k.has(g.evalId)||k.set(g.evalId,g);return k},[f.runs]);return co("div",{ref:c,style:{...lf,...Ri(d)},children:[co("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[Bt("span",{children:"Evals"}),Bt("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"E"})]}),Bt("button",{type:"button",disabled:u,onClick:r,style:cf(u,i),children:i?"Synthesizing...":"Synthesize"}),Bt("div",{style:{display:"flex",gap:12,marginTop:8},children:yf.map(k=>Bt(wf,{active:C===k.id,label:`${k.label} ${$[k.id].length}`,onClick:()=>P(k.id)},k.id))}),Bt("div",{style:{marginTop:10,flex:1,minHeight:0,overflowY:"auto",display:"flex",flexDirection:"column",gap:10},children:b?Bt("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):f.cases.length===0?Bt("div",{style:{color:"#9ca3af",fontSize:11,lineHeight:1.5},children:"No inferred evals yet."}):Z.length===0?co("div",{style:{color:"#9ca3af",fontSize:11,lineHeight:1.5},children:["No ",C," evals."]}):Bt(vf,{cases:Z,latestRunsByEvalId:q,runningEvalIds:l,onStatus:I,onRun:a,onViewRunThread:s,onTitleChange:w,onAssertionsChange:M})})]})}function vf({cases:e,latestRunsByEvalId:t,runningEvalIds:n,onStatus:o,onRun:r,onViewRunThread:i,onTitleChange:a,onAssertionsChange:s}){return Bt("div",{style:{display:"flex",flexDirection:"column",gap:6},children:e.map(l=>{let d=new Set([...l.sourceDecisionIds,...l.sourceThreadIds]).size,c=d>0?`, ${d} ${d===1?"mention":"mentions"}`:"",u=t.get(l.id),f=n.includes(l.id);return co("div",{style:{border:"1px solid rgba(0,0,0,0.08)",background:"rgba(255,255,255,0.35)",padding:8},children:[co("div",{children:[Bt(Cf,{value:l.title,onCommit:p=>a(l.id,p)}),co("div",{style:{color:"#9ca3af",fontSize:10,marginTop:2},children:[hf(l.category),c]})]}),Bt("div",{style:{marginTop:6,color:"#374151",fontSize:11,lineHeight:1.25},children:Bt(If,{assertions:l.assertions,latestRun:u,onChange:p=>s(l.id,p)})}),Bt(Sf,{item:l,latestRun:u,isRunning:f,onStatus:o,onRun:r,onViewRunThread:i})]},l.id)})})}function xf(e){let t=e.assertionResults.length;if(t===0)return e.status==="pass"?"Pass":"Review";let n=e.assertionResults.reduce((r,i)=>(r[i.status]+=1,r),{pass:0,fail:0,needs_review:0}),o=n.fail+n.needs_review;return o===0?`${n.pass||t} Pass`:`Review ${o||t}`}function Sf({item:e,latestRun:t,isRunning:n,onStatus:o,onRun:r,onViewRunThread:i}){if(e.status==="pending")return co("div",{style:{display:"flex",gap:6,marginTop:8},children:[Bt("button",{type:"button",style:ma,onClick:()=>o(e.id,"rejected"),children:"Reject"}),Bt("button",{type:"button",style:Zi,onClick:()=>o(e.id,"approved"),children:"Accept"})]});if(e.status==="approved"){let a=n||!r;return co("div",{style:{display:"flex",gap:6,marginTop:8},children:[t?.threadId&&i&&Bt("button",{type:"button",style:ma,onClick:()=>i(t.threadId),children:xf(t)}),Bt("button",{type:"button",disabled:a,style:a?uf:Zi,onClick:()=>r?.(e),children:n?"Running...":"Run"})]})}return Bt("div",{style:{display:"flex",gap:6,marginTop:8},children:Bt("button",{type:"button",style:Zi,onClick:()=>o(e.id,"approved"),children:"Approve"})})}function wf({active:e,label:t,onClick:n}){let[o,r]=wo(!1);return Bt("button",{type:"button",style:df(e||o),onMouseEnter:()=>r(!0),onMouseLeave:()=>r(!1),onClick:n,children:t})}function Cf({value:e,onCommit:t}){let[n,o]=wo(!1),[r,i]=wo(e),a=fi(null);yr(()=>{n||i(e)},[n,e]),yr(()=>{if(!n)return;let c=a.current;c&&(c.focus(),c.select(),c.style.height="auto",c.style.height=`${c.scrollHeight}px`)},[n]);let s=An(()=>{let c=r.trim();o(!1),c&&c!==e?t(c):i(e)},[r,t,e]),l=An(()=>{i(e),o(!1)},[e]),d=An(c=>{c.key==="Enter"?(c.preventDefault(),s()):c.key==="Escape"&&(c.preventDefault(),l())},[l,s]);return n?Bt("textarea",{ref:a,rows:1,value:r,onChange:c=>{i(c.target.value),c.currentTarget.style.height="auto",c.currentTarget.style.height=`${c.currentTarget.scrollHeight}px`},onBlur:s,onKeyDown:d,style:ff}):Bt("button",{type:"button",onClick:()=>o(!0),style:Tc,children:e})}function Ef(e){return e.map(t=>t.trim()).filter(Boolean)}function Tf(e,t){return e.length===t.length&&e.every((n,o)=>n===t[o])}function Ec(e){e.style.height="auto",e.style.height=`${e.scrollHeight}px`}function kf(e){let t=window.getComputedStyle(e),n=Number.parseFloat(t.lineHeight)||Number.parseFloat(t.fontSize)*1.2||16,o=document.createElement("div"),r=document.createElement("span"),i=document.createElement("span");o.style.position="fixed",o.style.visibility="hidden",o.style.pointerEvents="none",o.style.left="-9999px",o.style.top="0",o.style.width=`${e.clientWidth}px`,o.style.boxSizing=t.boxSizing,o.style.font=t.font,o.style.letterSpacing=t.letterSpacing,o.style.lineHeight=t.lineHeight,o.style.padding=t.padding,o.style.border=t.border,o.style.whiteSpace="pre-wrap",o.style.overflowWrap="break-word",o.style.wordBreak=t.wordBreak;let a=e.selectionStart??0;o.textContent=e.value.slice(0,a),r.textContent="\u200B",o.appendChild(r),o.appendChild(document.createTextNode(e.value.slice(a)||"\u200B")),i.textContent="\u200B",o.appendChild(i),document.body.appendChild(o);let s=Math.max(0,Math.round(r.offsetTop/n)),l=Math.max(0,Math.round(i.offsetTop/n));return o.remove(),{lineIndex:s,lastLineIndex:l}}function If({assertions:e,latestRun:t,onChange:n}){let[o,r]=wo(null),[i,a]=wo(e),[s,l]=wo(null),[d,c]=wo(0),u=fi([]),f=fi(null),p=fi(!1),b=o!==null,S=b?i.length+1:i.length,C=ga(()=>{let O=new Map;for(let g of t?.assertionResults??[])O.set(g.assertion.trim(),g);return O},[t]);yr(()=>{b||a(e)},[e,b]),yr(()=>{if(s===null)return;let O=requestAnimationFrame(()=>{let g=u.current[s];if(g){if(g.focus(),f.current==="select"&&g.value)g.select();else if(f.current==="start")g.setSelectionRange(0,0);else if(f.current==="end"){let m=g.value.length;g.setSelectionRange(m,m)}f.current=null,Ec(g)}});return()=>cancelAnimationFrame(O)},[s,d,S]);let P=An((O,g=null)=>{f.current=g,r(O),l(O),c(m=>m+1)},[]),H=An(O=>{let g=Ef(O);return g.length===0?(a(e),e):(a(g),Tf(g,e)||n(g),g)},[e,n]),I=An(O=>{P(O,"select")},[P]),M=An((O,g)=>{a(m=>{let j=[...m];if(O>=j.length){if(g.length===0)return j;j.push(g)}else j[O]=g;return j})},[]),w=An((O,g)=>{let m=[...i],ue=(O<m.length?m[O]??"":"").trim();if(O>=m.length){let we=g?.focusPlaceholder?m.length:g?.focusIndex;we!==void 0?P(we,g?.focusMode):(r(null),l(null));return}if(!ue){if(g?.deleteEmpty){m.splice(O,1);let we=H(m),Ee=g.focusPlaceholder?we.length:g.focusIndex;if(Ee!==void 0){let V=Math.min(Ee,we.length);P(V)}else r(null),l(null)}else m[O]=e[O]??"",a(m),g?.focusIndex!==void 0?P(g.focusIndex,g.focusMode):(r(null),l(null));return}m[O]=ue;let Re=H(m),de=g?.focusPlaceholder?Re.length:g?.focusIndex;if(de!==void 0){let we=Math.min(de,Re.length);P(we,g?.focusMode)}else r(null),l(null)},[e,i,H,P]),$=An(()=>{a(e),r(null),l(null)},[e]),Z=An((O,g)=>{let m=g.currentTarget.value,j=g.currentTarget.selectionStart,ue=g.currentTarget.selectionEnd,Re=j===ue;if((g.key==="ArrowUp"||g.key==="ArrowDown")&&Re){let{lineIndex:de,lastLineIndex:we}=kf(g.currentTarget);if(g.key==="ArrowUp"&&de===0&&O>0){g.preventDefault(),p.current=!0,w(O,{focusIndex:O-1,focusMode:"end",deleteEmpty:!1});return}if(g.key==="ArrowDown"&&de===we&&O<S-1){g.preventDefault(),p.current=!0,w(O,{focusIndex:O+1,focusMode:"start",deleteEmpty:!1});return}}if(g.key==="Backspace"&&m.length===0){g.preventDefault(),p.current=!0;let de=[...i],we=O-1;if(O<de.length){de.splice(O,1);let Ee=H(de);if(we>=0){let V=Math.min(we,Ee.length-1);P(V,"end")}else r(null),l(null)}else we>=0&&P(we,"end");return}g.key==="Enter"?(g.preventDefault(),w(O,{focusPlaceholder:g.metaKey||g.ctrlKey,deleteEmpty:!0})):g.key==="Escape"&&(g.preventDefault(),$())},[$,w,i,H,P,S]),q=An((O,g)=>{if(p.current){p.current=!1;return}let m=u.current.findIndex(j=>j===g.relatedTarget);w(O,{deleteEmpty:!1,focusIndex:m>=0?m:void 0})},[w]),k=An((O,g)=>{g.preventDefault(),o!==null?(p.current=!0,w(o,{focusIndex:O,focusMode:"select",deleteEmpty:!1})):P(O,"select")},[w,o,P]);return co(Mf,{children:[Bt("style",{children:`
|
|
2
|
+
import{createContext as yh,useCallback as Gt,useContext as bh,useEffect as At,useMemo as mo,useRef as en,useState as Ct}from"react";import{useCallback as nl,useEffect as Md,useSyncExternalStore as Rd}from"react";var bn="http://localhost:1111";function ja(){return typeof window<"u"?window.__POPMELT_PROJECT_ID__??null:null}function kd(e={}){let t=ja();if(!t)return e;let n=new Headers(e.headers);return n.set("X-Popmelt-Project-Id",t),{...e,headers:n}}function Qn(e,t={}){return fetch(e,kd(t))}function Bn(e,t={},n=15e3){let o=new AbortController;t.signal&&t.signal.addEventListener("abort",()=>o.abort());let r=setTimeout(()=>o.abort(),n);return Qn(e,{...t,signal:o.signal}).finally(()=>clearTimeout(r))}async function Ga(e=bn){try{let t=await Bn(`${e}/capabilities`,{},5e3);return t.ok?await t.json():null}catch{return null}}async function yo(e=bn){try{let t=new AbortController,n=setTimeout(()=>t.abort(),2e3),o=await Qn(`${e}/status`,{signal:t.signal});return clearTimeout(n),o.ok?await o.json():null}catch{return null}}async function Wa(e){try{let t=new AbortController,n=setTimeout(()=>t.abort(),500),o=await Qn(`http://localhost:${e}/status`,{signal:t.signal});return clearTimeout(n),o.ok?await o.json():null}catch{return null}}async function Td(e){return yo(e)}async function vs(e,t){if(e&&e!=="http://localhost:1111")try{let d=new URL(e),u=await Td(e);if(!u&&!t)return null;if(!(!u&&t)){if(!(u&&t&&u.projectId!==t)){if(u?.projectId&&!t)return null;if(u)return{url:e,port:parseInt(d.port,10)||1111,projectId:u.projectId}}}}catch{if(!t)return null}let i=typeof window<"u"?window.location.origin:null,a=await Wa(1111);if(a){if(t&&a.projectId===t)return{url:"http://localhost:1111",port:1111,projectId:a.projectId};if(a.devOrigin&&i&&a.devOrigin===i&&(t||!a.projectId))return{url:"http://localhost:1111",port:1111,projectId:a.projectId}}let s=Array.from({length:8},(d,u)=>{let p=1112+u;return Wa(p).then(f=>f?{status:f,port:p}:null)}),l=(await Promise.all(s)).filter(d=>d!==null),c=[];a&&c.push({port:1111,devOrigin:a.devOrigin,projectId:a.projectId});for(let d of l)c.push({port:d.port,devOrigin:d.status.devOrigin,projectId:d.status.projectId});if(t){let d=c.find(u=>u.projectId===t);if(d)return{url:`http://localhost:${d.port}`,port:d.port,projectId:d.projectId}}if(i){let d=c.find(u=>u.devOrigin===i&&(t||!u.projectId));if(d)return{url:`http://localhost:${d.port}`,port:d.port,projectId:d.projectId}}return c.length===1&&!c[0].projectId?{url:`http://localhost:${c[0].port}`,port:c[0].port,projectId:c[0].projectId}:null}async function ki(e=bn,t,n=-1){try{let o=await Bn(`${e}/jobs/${t}/events?afterSeq=${n}`,{},5e3);return o.ok?await o.json():null}catch{return null}}async function Ja(e,t,n=bn,o,r,i,a,s){let l=new FormData;if(e instanceof Map){let d=!0;for(let[u,p]of e){let f=encodeURIComponent(u);l.append(`screenshot-${f}`,p,`screenshot-${f}.webp`),d&&(l.append("screenshot",p,"screenshot.webp"),d=!1)}d&&l.append("screenshot",new Blob([],{type:"image/webp"}),"screenshot.webp")}else l.append("screenshot",e,"screenshot.webp");if(l.append("feedback",t),o&&l.append("color",o),r&&l.append("provider",r),i&&l.append("model",i),s&&l.append("sourceId",s),a)for(let[d,u]of a)for(let p=0;p<u.length;p++)l.append(`image-${d}-${p}`,u[p],`image-${d}-${p}.webp`);let c=await Bn(`${n}/send`,{method:"POST",body:l},3e4);if(!c.ok){let d=await c.text();throw new Error(`Bridge returned ${c.status}: ${d}`)}return c.json()}async function Va(e,t=bn){let n=await Bn(`${t}/model/component`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!n.ok){let o=await n.text();throw new Error(`Bridge returned ${n.status}: ${o}`)}return n.json()}async function Ya(e,t=bn){let n=await Bn(`${t}/model/component`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:e})},1e4);if(!n.ok){let o=await n.text();throw new Error(`Bridge returned ${n.status}: ${o}`)}return n.json()}async function xs(e,t,n=bn){let o=await Bn(`${n}/model/token`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e,value:t})},1e4);if(!o.ok){let r=await o.text();throw new Error(`Bridge returned ${o.status}: ${r}`)}return o.json()}async function Ua(e,t=bn){let n=await Bn(`${t}/model/token`,{method:"DELETE",headers:{"Content-Type":"application/json"},body:JSON.stringify({path:e})},1e4);if(!n.ok){let o=await n.text();throw new Error(`Bridge returned ${n.status}: ${o}`)}return n.json()}async function Rr(e=bn){try{let t=await Bn(`${e}/model`,{},5e3);return t.ok?(await t.json()).model??null:null}catch{return null}}async function Ka(e=bn){let t=await Bn(`${e}/evals`,{},5e3);return t.ok?t.json():{version:1,updatedAt:0,cases:[]}}async function Ti(e,t,n=bn){let o=await Bn(`${n}/evals/${encodeURIComponent(e)}`,{method:"PATCH",headers:{"Content-Type":"application/json"},body:JSON.stringify(t)},5e3);return o.ok?(await o.json()).eval??null:null}function Xa(e,t,n=bn){return Ti(e,{status:t},n)}async function qa(e,t,n,o=bn,r,i,a){let s=new FormData;s.append("screenshot",t,"eval-run.webp"),s.append("feedback",JSON.stringify(n)),r&&s.append("provider",r),i&&s.append("model",i),a&&s.append("sourceId",a);let l=await Bn(`${o}/evals/${encodeURIComponent(e)}/run`,{method:"POST",body:s},3e4);if(!l.ok){let c=await l.text();throw new Error(`Bridge returned ${l.status}: ${c}`)}return l.json()}function Id(e){return new Promise(t=>setTimeout(t,e))}async function Ss(e=bn,t,n=15e3){let o=Date.now();try{let l=await Bn(`${e}/restart`,{method:"POST"},5e3);if(!l.ok){let c=await l.text().catch(()=>"");return{ok:!1,error:c?`Bridge restart returned ${l.status}: ${c}`:`Bridge restart returned ${l.status}`,elapsedMs:Date.now()-o}}}catch(l){return{ok:!1,error:l instanceof Error?l.message:"Bridge restart request failed",elapsedMs:Date.now()-o}}let r=null,i=e,a=ja();for(;Date.now()-o<n;){if(await Id(350),r=await yo(i),!r?.ok&&a){let l=await vs(e,a);l?.url&&(i=l.url,r=await yo(i))}if(r?.ok&&!(a&&r.projectId!==a)&&!(t&&r.version!==t))return{ok:!0,status:r,elapsedMs:Date.now()-o,bridgeUrl:i}}return{ok:!1,error:`Bridge did not come back${t?` with version ${t}`:""} within ${Math.round(n/1e3)}s`,status:r,elapsedMs:Date.now()-o}}async function Za(e=bn){return(await Ss(e)).ok}async function Qa(e=bn,t,n){let o=await Bn(`${e}/model/synthesize`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({provider:t,model:n})},1e4);if(!o.ok){let r=await o.text();throw new Error(`Bridge returned ${o.status}: ${r}`)}return o.json()}async function el(e=bn,t,n){let o=await Bn(`${e}/evals/synthesize`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({provider:t,model:n})},1e4);if(!o.ok){let r=await o.text();throw new Error(`Bridge returned ${o.status}: ${r}`)}return o.json()}async function tl(e,t,n=bn,o,r,i,a,s){let l;if(a&&a.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:o,provider:r,model:i,sourceId:s}));for(let u=0;u<a.length;u++)c.append(`image-reply-${u}`,a[u],`reply-image-${u}.webp`);l=await Bn(`${n}/reply`,{method:"POST",body:c},3e4)}else l=await Bn(`${n}/reply`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({threadId:e,reply:t,color:o,provider:r,model:i,sourceId:s})},3e4);if(!l.ok){let c=await l.text();throw new Error(`Bridge returned ${l.status}: ${c}`)}return l.json()}var Mt=globalThis.__POPMELT_BRIDGE_CONNECTION__??(globalThis.__POPMELT_BRIDGE_CONNECTION__={}),Ri=Mt.sourceId??(typeof localStorage<"u"?localStorage.getItem("popmelt-source-id"):null)??(typeof crypto<"u"&&typeof crypto.randomUUID=="function"?crypto.randomUUID():Math.random().toString(36).slice(2));Mt.sourceId=Ri;try{typeof localStorage<"u"&&localStorage.setItem("popmelt-source-id",Ri)}catch{}function Ai(){return Ri}var il={isConnected:!1,status:"disconnected",jobResponses:{},jobThinking:{},activeJobIds:[],activeJobThreads:{},currentResponse:"",currentThinking:"",events:[],activeJobId:null,lastCompletedJobId:null,lastResponseText:null,lastThreadId:null,lastErrorByJob:{},pendingQuestions:[],incrementalResolutions:[],capabilitiesVersion:0},cr=Mt.store??{...il};Mt.store=cr;var Mi=Mt.listeners??new Set;Mt.listeners=Mi;var bo=Mt.activeEs??null,Ii=Mt.activeBridgeUrl??null,vo=null,Lr=Mt.connectionGeneration??0,ol=Mt.expectedProjectId??null,oi=new Set,dr=new Map,xo={};function lr(e,t){if(!e)return!1;if(oi.has(e)){let o=dr.get(e);return o||(o=[],dr.set(e,o)),o.push({type:t.type??"",data:t}),!0}let n=xo[e];return n!==void 0&&typeof t.seq=="number"&&t.seq<=n}async function Ad(e,t,n){let o=()=>n!==Lr;for(let r of t){if(o())return;oi.add(r),dr.set(r,[])}await Promise.all(t.map(async r=>{try{let i=await ki(e,r);if(o())return;let a=dr.get(r)??[];if(i){if(on(s=>{let l={...s.jobResponses,[r]:i.accumulated.response},c={...s.jobThinking,[r]:i.accumulated.thinking},d=[...s.events];for(let u of i.events)u.type==="done"||u.type==="error"||d.push({type:u.type,data:u,timestamp:Date.now()});return{...s,jobResponses:l,jobThinking:c,currentResponse:r===s.activeJobId?i.accumulated.response:s.currentResponse,currentThinking:r===s.activeJobId?i.accumulated.thinking:s.currentThinking,events:d}}),xo[r]=i.currentSeq,!i.jobActive){let s=i.events.find(l=>l.type==="done"||l.type==="error");s&&ws(s.type,s,r)}for(let s of a)typeof s.data.seq=="number"&&s.data.seq<=i.currentSeq||ws(s.type,s.data,r)}else for(let s of a)ws(s.type,s.data,r)}finally{oi.delete(r),dr.delete(r)}}))}function ws(e,t,n){if(e==="delta"){let o=t.text||"";on(r=>({...r,jobResponses:{...r.jobResponses,[n]:(r.jobResponses[n]||"")+o},currentResponse:n===r.activeJobId?r.currentResponse+o:r.currentResponse,events:[...r.events,{type:"delta",data:t,timestamp:Date.now()}]}))}else if(e==="thinking"){let o=t.text||"";on(r=>({...r,jobThinking:{...r.jobThinking,[n]:(r.jobThinking[n]||"")+o},currentThinking:n===r.activeJobId?r.currentThinking+o:r.currentThinking,events:[...r.events,{type:"thinking",data:t,timestamp:Date.now()}]}))}else if(e==="done")delete xo[n],on(o=>{let r=o.activeJobIds.filter(c=>c!==n),i={...o.jobResponses},a={...o.jobThinking},s=i[n];delete i[n],delete a[n];let l=n===o.activeJobId?r.length>0?r[r.length-1]:null:o.activeJobId;return{...o,activeJobIds:r,activeJobId:l,jobResponses:i,jobThinking:a,lastCompletedJobId:n,lastResponseText:s||o.currentResponse||t.responseText||null,lastThreadId:t.threadId??null,...n===o.activeJobId?{currentResponse:l&&i[l]||"",currentThinking:l&&a[l]||""}:{},events:[...o.events,{type:"done",data:t,timestamp:Date.now()}]}});else if(e==="error"){delete xo[n];let o=t.message??"";on(r=>{let i=r.activeJobIds.filter(s=>s!==n),a=i.length>0?r.status:"error";return{...r,status:a,activeJobIds:i,lastCompletedJobId:n,lastErrorByJob:o?{...r.lastErrorByJob,[n]:o}:r.lastErrorByJob,events:[...r.events,{type:"error",data:t,timestamp:Date.now()}]}})}else on(o=>({...o,events:[...o.events,{type:e,data:t,timestamp:Date.now()}]}))}var eo=Mt.discoveredBridgeUrl??null,Jn=Mt.discoveredBridgeProjectId??null,qo=null,Ar=null;function Ld(e){let t=e??null;if(ol!==t){bo&&(bo.close(),bo=null,Mt.activeEs=null),vo&&(clearTimeout(vo),vo=null),Ii=null,Mt.activeBridgeUrl=null,eo=null,Jn=null,Mt.discoveredBridgeUrl=null,Mt.discoveredBridgeProjectId=null,qo=null,Ar=null,oi.clear(),dr.clear();for(let n of Object.keys(xo))delete xo[n];ol=t,Mt.expectedProjectId=t,Lr+=1,Mt.connectionGeneration=Lr,on(()=>({...il}))}}async function sl(e,t){return eo&&(t?Jn===t:!Jn)?eo:(!t&&Jn&&(eo=null,Jn=null,Mt.discoveredBridgeUrl=eo,Mt.discoveredBridgeProjectId=Jn),t&&Jn&&Jn!==t&&(eo=null,Jn=null,Mt.discoveredBridgeUrl=eo,Mt.discoveredBridgeProjectId=Jn),qo&&Ar===(t??null)||(Ar=t??null,qo=vs(e,t).then(n=>(eo=n?.url??null,Jn=n?.projectId??t??null,Mt.discoveredBridgeUrl=eo,Mt.discoveredBridgeProjectId=Jn,qo=null,Ar=null,eo)).catch(()=>(qo=null,Ar=null,null))),qo)}function al(){return eo}async function ll(e,t){eo=null,Jn=null,Mt.discoveredBridgeUrl=null,Mt.discoveredBridgeProjectId=null,qo=null,Ar=null;let n=await sl(e,t);return n&&Cs(n),n}function rl(){return cr}function Pd(e){return Mi.add(e),()=>{Mi.delete(e)}}function on(e){cr=e(cr),Mt.store=cr;for(let t of Mi)t()}function Bd(){return typeof window<"u"?window.__POPMELT_PROJECT_ID__??null:null}function Cs(e){if(bo&&bo.readyState!==EventSource.CLOSED&&Ii===e)return;bo&&(bo.close(),bo=null,Mt.activeEs=null),vo&&(clearTimeout(vo),vo=null),Ii=e,Mt.activeBridgeUrl=Ii;let t=++Lr;Mt.connectionGeneration=Lr;let n=new URLSearchParams({sourceId:Ri}),o=Bd();o&&n.set("projectId",o);let r=new EventSource(`${e}/events?${n.toString()}`);bo=r,Mt.activeEs=bo;let i=()=>t!==Lr;r.addEventListener("connected",()=>{i()||yo(e).then(a=>{if(i())return;let s=a?.activeJobs??(a?.activeJob?[a.activeJob]:[]),l=new Set(s.map(b=>b.id)),c=a?.recentJobs??[],d=new Map(c.map(b=>[b.id,b])),u=s.length>0;on(b=>{let C={...b.lastErrorByJob},w=b.activeJobIds.filter(E=>!l.has(E));for(let E of w){let R=d.get(E);R?.status==="error"&&R.error&&(C[E]=R.error)}let M=b.activeJobIds.filter(E=>l.has(E));for(let E of l)M.includes(E)||M.push(E);let L={};for(let E of s)E.threadId&&(L[E.id]=E.threadId);return{...b,isConnected:!0,status:u?"streaming":w.length>0||b.status==="disconnected"?"idle":b.status,activeJobId:u?s[s.length-1].id:M.length>0?M[M.length-1]:null,activeJobIds:M,activeJobThreads:L,lastErrorByJob:C,lastCompletedJobId:w.length>0?w[w.length-1]:b.lastCompletedJobId}});let p=cr.activeJobIds.filter(b=>!l.has(b)),f=[...Array.from(l),...p];f.length>0&&Ad(e,f,t).catch(()=>{})})}),r.addEventListener("job_started",a=>{if(i())return;let s=JSON.parse(a.data),l=s.jobId;if(lr(l,s))return;let c=s.threadId;on(d=>({...d,status:"streaming",activeJobId:l,activeJobIds:d.activeJobIds.includes(l)?d.activeJobIds:[...d.activeJobIds,l],activeJobThreads:c?{...d.activeJobThreads,[l]:c}:d.activeJobThreads,jobResponses:{...d.jobResponses,[l]:d.jobResponses[l]??""},jobThinking:{...d.jobThinking,[l]:d.jobThinking[l]??""},currentResponse:d.jobResponses[l]??"",currentThinking:d.jobThinking[l]??"",lastResponseText:null,lastThreadId:null,events:[...d.events,{type:"job_started",data:s,timestamp:Date.now()}]}))}),r.addEventListener("delta",a=>{if(i())return;let s=JSON.parse(a.data),l=s.jobId;if(lr(l,s))return;let c=s.text||"";on(d=>({...d,jobResponses:l?{...d.jobResponses,[l]:(d.jobResponses[l]||"")+c}:d.jobResponses,currentResponse:!l||l===d.activeJobId?d.currentResponse+c:d.currentResponse,events:[...d.events,{type:"delta",data:s,timestamp:Date.now()}]}))}),r.addEventListener("thinking",a=>{if(i())return;let s=JSON.parse(a.data),l=s.jobId;if(lr(l,s))return;let c=s.text||"";on(d=>({...d,jobThinking:l?{...d.jobThinking,[l]:(d.jobThinking[l]||"")+c}:d.jobThinking,currentThinking:!l||l===d.activeJobId?d.currentThinking+c:d.currentThinking,events:[...d.events,{type:"thinking",data:s,timestamp:Date.now()}]}))}),r.addEventListener("tool_use",a=>{if(i())return;let s=JSON.parse(a.data),l=s.jobId;lr(l,s)||on(c=>({...c,events:[...c.events,{type:"tool_use",data:s,timestamp:Date.now()}]}))}),r.addEventListener("done",a=>{if(i())return;let s=JSON.parse(a.data),l=s.jobId;lr(l,s)||(l&&delete xo[l],on(c=>{let d=l?c.activeJobIds.filter(w=>w!==l):c.activeJobIds,u={...c.jobResponses},p={...c.jobThinking},f={...c.activeJobThreads},b=l?u[l]:void 0;l&&(delete u[l],delete p[l],delete f[l]);let C=l===c.activeJobId?d.length>0?d[d.length-1]:null:c.activeJobId;return{...c,activeJobIds:d,activeJobId:C,jobResponses:u,jobThinking:p,lastCompletedJobId:l??c.activeJobId,lastResponseText:b||c.currentResponse||s.responseText||null,lastThreadId:s.threadId??null,...l===c.activeJobId?{currentResponse:C&&u[C]||"",currentThinking:C&&p[C]||""}:{},events:[...c.events,{type:"done",data:s,timestamp:Date.now()}]}}))}),r.addEventListener("question",a=>{if(i())return;let s=JSON.parse(a.data),l=s.jobId;lr(l,s)||on(c=>({...c,pendingQuestions:[...c.pendingQuestions,{jobId:s.jobId,threadId:s.threadId,question:s.question,annotationIds:s.annotationIds,timestamp:Date.now()}],events:[...c.events,{type:"question",data:s,timestamp:Date.now()}]}))}),r.addEventListener("capabilities_changed",()=>{i()||on(a=>({...a,capabilitiesVersion:a.capabilitiesVersion+1}))}),r.addEventListener("queue_drained",()=>{if(!i()){for(let a of Object.keys(xo))delete xo[a];oi.clear(),dr.clear(),on(a=>({...a,status:a.status==="error"?"error":"idle",activeJobId:null,activeJobIds:[],activeJobThreads:{},currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastErrorByJob:{},incrementalResolutions:[]}))}}),r.addEventListener("error",a=>{if(!i()){if(r.readyState===EventSource.CLOSED)on(s=>({...s,isConnected:!1,status:"disconnected"})),vo&&(clearTimeout(vo),vo=null),vo=setTimeout(()=>{yo(e).then(s=>{s&&Cs(e)})},5e3);else if(a instanceof MessageEvent){let s=JSON.parse(a.data),l=s.jobId??null;if(lr(l??void 0,s))return;l&&delete xo[l];let c=s.message??"";on(d=>{let u=l?d.activeJobIds.filter(f=>f!==l):d.activeJobIds,p=u.length>0?d.status:"error";return{...d,status:p,activeJobIds:u,lastCompletedJobId:l??d.activeJobId,lastErrorByJob:l&&c?{...d.lastErrorByJob,[l]:c}:d.lastErrorByJob,events:[...d.events,{type:"error",data:s,timestamp:Date.now()}]}})}}}),r.onerror=()=>{i()||r.readyState===EventSource.CLOSED&&on(a=>({...a,isConnected:!1,status:"disconnected"}))}}function cl(e="http://localhost:1111",t=!0,n){let o=Rd(Pd,rl,rl);Md(()=>{Ld(n),t&&sl(e,n).then(a=>{a&&yo(a).then(s=>{s&&(!n||s.projectId===n)&&Cs(a)})})},[e,t,n]);let r=nl(()=>{on(()=>({...cr,events:[],currentResponse:"",currentThinking:"",jobResponses:{},jobThinking:{},lastResponseText:null,lastThreadId:null,lastErrorByJob:{},incrementalResolutions:[]}))},[]),i=nl(a=>{on(s=>({...s,pendingQuestions:s.pendingQuestions.filter(l=>l.threadId!==a)}))},[]);return{...o,clearEvents:r,dismissQuestion:i}}import{useEffect as Dd,useReducer as _d}from"react";var Od={isAnnotating:!1,activeTool:"inspector",activeColor:"oklch(0.628 0.258 29)",strokeWidth:3,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,inspectedElement:null,styleModifications:[],spacingTokenChanges:[],spacingTokenMods:[]};function Li(){return Math.random().toString(36).substring(2,9)}function dl(e){return e.status?e:e.captured?{...e,status:"in_flight"}:{...e,status:"pending"}}function Hn(e){return{...e,undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}],redoStack:[]}}function Hd(e,t){return{...e,isAnnotating:t}}function Nd(e,t){return{...e,activeTool:t,inspectedElement:null}}function zd(e,t){return{...e,activeColor:t}}function Fd(e,t){return{...e,strokeWidth:t}}function $d(e,t){return{...e,currentPath:[t]}}function Wd(e,t){return{...e,currentPath:[...e.currentPath,t]}}function jd(e){return{...e,currentPath:[]}}function Gd(e,t){if(e.currentPath.length<2&&e.activeTool!=="text")return{...e,currentPath:[]};let n={id:Li(),type:e.activeTool,points:e.currentPath,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",pathname:typeof window<"u"?window.location.pathname:"/",groupId:t?.groupId,elements:t?.elements};return{...Hn(e),annotations:[...e.annotations,n],currentPath:[]}}function Jd(e,t){let n={id:t.id??Li(),type:"text",points:[t.point],text:t.text,fontSize:t.fontSize||12,color:e.activeColor,strokeWidth:e.strokeWidth,timestamp:Date.now(),status:"pending",pathname:typeof window<"u"?window.location.pathname:"/",groupId:t.groupId,linkedSelector:t.linkedSelector,linkedAnchor:t.linkedAnchor,elements:t.elements,...t.imageCount?{imageCount:t.imageCount}:{}};return{...t.groupId?e:Hn(e),annotations:[...e.annotations,n]}}function Vd(e,t){return{...Hn(e),annotations:e.annotations.map(o=>o.id===t.id?{...o,text:t.text,...t.imageCount!=null?{imageCount:t.imageCount}:{}}:o)}}function Yd(e,t){return{...e,annotations:e.annotations.map(n=>n.id===t.id?{...n,fontSize:Math.max(12,Math.min(72,t.fontSize))}:n)}}function Ud(e,t){let n=Hn(e),r=e.annotations.find(i=>i.id===t.id)?.groupId;return{...n,annotations:e.annotations.filter(i=>i.id!==t.id&&!(r&&i.groupId===r))}}function Kd(e,t){let n=t.saveUndo?Hn(e):e,r=e.annotations.find(i=>i.id===t.id)?.groupId;return{...n,annotations:e.annotations.map(i=>{if(!(i.id===t.id||r&&i.groupId===r))return i;let s=t.delta.x,l=t.delta.y;return{...i,points:i.points.map(c=>({x:c.x+s,y:c.y+l}))}})}}function Xd(e,t){let n=t.saveUndo?Hn(e):e,o=e.annotations.find(a=>a.id===t.id);if(!o||o.type==="text"||o.points.length<2)return e;let r=0,i=0;if(o.type==="rectangle"&&o.groupId){let a=t.points,s=Math.min(a[0].x,a[1].x),l=Math.max(a[0].y,a[1].y),c=o.points[0],d=o.points[o.points.length-1],u=Math.min(c.x,d.x),p=Math.max(c.y,d.y);r=s-u,i=l-p}return{...n,annotations:e.annotations.map(a=>a.id===t.id?{...a,points:t.points}:o.groupId&&a.groupId===o.groupId&&a.type==="text"?{...a,points:a.points.map(s=>({x:s.x+r,y:s.y+i}))}:a)}}function qd(e,t){return{...Hn(e),annotations:[...e.annotations,...t.annotations.map(dl)]}}function Zd(e,t){let n=new Set,o=[];for(let r of t.annotations)n.has(r.id)||(n.add(r.id),o.push(dl(r)));return{...e,annotations:o}}function Qd(e){if(e.undoStack.length===0)return e;let t=e.undoStack[e.undoStack.length-1];return{...e,annotations:t?.annotations||[],styleModifications:t?.styleModifications||[],spacingTokenMods:t?.spacingTokenMods||[],undoStack:e.undoStack.slice(0,-1),redoStack:[...e.redoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}]}}function eu(e){if(e.redoStack.length===0)return e;let t=e.redoStack[e.redoStack.length-1];return{...e,annotations:t?.annotations||[],styleModifications:t?.styleModifications||[],spacingTokenMods:t?.spacingTokenMods||[],redoStack:e.redoStack.slice(0,-1),undoStack:[...e.undoStack,{annotations:e.annotations,styleModifications:e.styleModifications,spacingTokenMods:e.spacingTokenMods}]}}function tu(e,t){let{id:n,addToSelection:o}=t;if(n===null)return{...e,selectedAnnotationIds:[],lastSelectedId:null};if(o)if(e.selectedAnnotationIds.includes(n)){let i=e.selectedAnnotationIds.filter(a=>a!==n);return{...e,selectedAnnotationIds:i,lastSelectedId:i.length>0?i[i.length-1]:null}}else return{...e,selectedAnnotationIds:[...e.selectedAnnotationIds,n],lastSelectedId:n};return{...e,selectedAnnotationIds:[n],lastSelectedId:n}}function nu(e,t){let n=new Set;for(let o of e.selectedAnnotationIds){let r=e.annotations.find(i=>i.id===o);r?.groupId&&n.add(r.groupId)}return{...e,annotations:e.annotations.map(o=>{let r=e.selectedAnnotationIds.includes(o.id),i=o.groupId&&n.has(o.groupId);return!r&&!i?o:{...o,color:t.color}})}}function ou(e){let t=typeof window<"u"?window.location.pathname:"/";return{...e,annotations:e.annotations.map(n=>({...n,captured:!0,status:n.status==="pending"||!n.status?"in_flight":n.status})),styleModifications:e.styleModifications.map(n=>!n.pathname||n.pathname===t?{...n,captured:!0}:n),spacingTokenChanges:e.spacingTokenChanges.map(n=>({...n,captured:!0}))}}function ru(e){return{...e,annotations:[],undoStack:[],redoStack:[],currentPath:[],selectedAnnotationIds:[],lastSelectedId:null,spacingTokenChanges:[],spacingTokenMods:[]}}function iu(e,t){return{...e,inspectedElement:t}}function su(e,t){let{selector:n,element:o,property:r,original:i,modified:a}=t,s=typeof window<"u"?window.location.pathname:"/",l=e.styleModifications.findIndex(c=>c.selector===n&&(!c.pathname||c.pathname===s));if(i===a&&l<0)return e;if(l>=0){let c=e.styleModifications[l];if(c.captured){let b=Hn(e),C=b.styleModifications.map((w,M)=>M===l?{...w,changes:[{property:r,original:i,modified:a}],captured:!1,pathname:s}:w);return{...b,styleModifications:C}}let d=c.changes.findIndex(b=>b.property===r),u,p=e;if(d>=0){let b=c.changes[d];a===b.original?u=c.changes.filter((C,w)=>w!==d):u=c.changes.map((C,w)=>w===d?{...C,modified:a}:C)}else{if(i===a)return e;p=Hn(e),u=[...c.changes,{property:r,original:i,modified:a}]}if(u.length===0)return{...p,styleModifications:p.styleModifications.filter((b,C)=>C!==l)};let f=p.styleModifications.map((b,C)=>C===l?{...b,changes:u}:b);return{...p,styleModifications:f}}else{let c=Hn(e),d={selector:n,element:o,changes:[{property:r,original:i,modified:a}],pathname:s};return{...c,styleModifications:[...c.styleModifications,d]}}}function au(e,t){let{selector:n,durableSelector:o,element:r,changes:i}=t,a=typeof window<"u"?window.location.pathname:"/",s=i.filter(d=>d.original!==d.modified);if(s.length===0)return e;let l=Hn(e),c=l.styleModifications.findIndex(d=>d.selector===n&&(!d.pathname||d.pathname===a));if(c>=0){let d=l.styleModifications[c],u=d.captured?[]:[...d.changes];for(let p of s){let f=u.findIndex(b=>b.property===p.property);f>=0?p.modified===u[f].original?u=u.filter((b,C)=>C!==f):u=u.map((b,C)=>C===f?{...b,modified:p.modified}:b):u.push(p)}return u.length===0?{...l,styleModifications:l.styleModifications.filter((p,f)=>f!==c)}:{...l,styleModifications:l.styleModifications.map((p,f)=>f===c?{...p,changes:u,captured:!1,pathname:a}:p)}}else return{...l,styleModifications:[...l.styleModifications,{selector:n,durableSelector:o,element:r,changes:s,pathname:a}]}}function lu(e,t){let{selector:n,property:o}=t,r=typeof window<"u"?window.location.pathname:"/",i=Hn(e),a=i.styleModifications.map(s=>s.selector!==n||s.pathname&&s.pathname!==r?s:{...s,changes:s.changes.filter(l=>l.property!==o)}).filter(s=>s.changes.length>0);return{...i,styleModifications:a}}function cu(e){return e.styleModifications.length===0?{...e,inspectedElement:null}:{...Hn(e),styleModifications:[],inspectedElement:null}}function du(e,t){return{...e,styleModifications:t}}function uu(e,t){let{updates:n}=t,o=new Map(n.map(r=>[r.id,r]));return{...e,annotations:e.annotations.map(r=>{let i=o.get(r.id);return i?{...r,points:[i.point,...r.points.slice(1)],...i.linkedAnchor?{linkedAnchor:i.linkedAnchor}:{}}:r})}}function pu(e,t){let n=new Set(t.ids);return{...e,annotations:e.annotations.map(o=>n.has(o.id)?{...o,status:t.status}:o)}}function fu(e,t){let n=new Set(t.ids),o=new Set;for(let r of e.annotations)n.has(r.id)&&r.groupId&&o.add(r.groupId);return{...e,annotations:e.annotations.map(r=>n.has(r.id)||r.groupId&&o.has(r.groupId)?{...r,threadId:t.threadId}:r)}}function gu(e,t){let n=new Set(t.ids),o=new Set;for(let r of e.annotations)n.has(r.id)&&r.groupId&&o.add(r.groupId);return{...e,annotations:e.annotations.map(r=>n.has(r.id)||r.groupId&&o.has(r.groupId)?{...r,status:"waiting_input",question:t.question,threadId:t.threadId}:r)}}function mu(e,t){let n=new Map(t.resolutions.map(r=>[r.annotationId,r])),o=new Map;for(let r of e.annotations){let i=n.get(r.id);i&&r.groupId&&o.set(r.groupId,i)}return{...e,annotations:e.annotations.map(r=>{let i=n.get(r.id)||(r.groupId?o.get(r.groupId):void 0);return i?{...r,status:i.status,resolutionSummary:i.summary,scope:i.finalScope??i.inferredScope??null,replyCount:(r.replyCount??0)+1,question:void 0,threadId:r.threadId||t.threadId}:r})}}function hu(e,t){let{linkedSelectors:n,styleSelectors:o}=t,r=new Set(n),i=new Set(o),a=typeof window<"u"?window.location.pathname:"/",s=new Set,l=new Set;for(let f of e.annotations)f.linkedSelector&&r.has(f.linkedSelector)&&(s.add(f.id),f.groupId&&l.add(f.groupId));for(let f of e.annotations)f.groupId&&l.has(f.groupId)&&s.add(f.id);let c=e.annotations.filter(f=>!s.has(f.id)),d=e.styleModifications.filter(f=>!i.has(f.selector)||f.pathname&&f.pathname!==a);if(c.length===e.annotations.length&&d.length===e.styleModifications.length)return e;let u=e.selectedAnnotationIds.filter(f=>!s.has(f)),p=e.inspectedElement&&i.has(e.inspectedElement.info.selector)?null:e.inspectedElement;return{...e,annotations:c,styleModifications:d,selectedAnnotationIds:u,lastSelectedId:u.length>0?u[u.length-1]:null,inspectedElement:p}}function yu(e,t){let n=e.spacingTokenChanges.findIndex(o=>o.tokenPath===t.tokenPath);return n>=0?{...e,spacingTokenChanges:e.spacingTokenChanges.map((o,r)=>r===n?t:o)}:{...e,spacingTokenChanges:[...e.spacingTokenChanges,t]}}function bu(e,t){return{...e,spacingTokenChanges:t}}function vu(e,t){let n=Hn(e),o=e.spacingTokenMods.findIndex(i=>i.tokenPath===t.tokenPath),r;if(o>=0){let i=e.spacingTokenMods[o],a={...t,originalValue:i.originalValue,originalPx:i.originalPx};r=e.spacingTokenMods.map((s,l)=>l===o?a:s)}else r=[...e.spacingTokenMods,t];return{...n,spacingTokenMods:r}}function xu(e,t){let n=Hn(e),o=e.spacingTokenMods.findIndex(l=>l.tokenPath===t.tokenPath),r=o>=0?e.spacingTokenMods[o].originalValue:t.originalValue,i=o>=0?e.spacingTokenMods[o].originalPx:parseFloat(t.originalValue)||0,a={tokenPath:t.tokenPath,originalValue:r,currentValue:"__deleted__",targets:o>=0?e.spacingTokenMods[o].targets:[],originalPx:i,currentPx:0},s;return o>=0?s=e.spacingTokenMods.map((l,c)=>c===o?a:l):s=[...e.spacingTokenMods,a],{...n,spacingTokenMods:s}}var Su={SET_ANNOTATING:Hd,SET_TOOL:Nd,SET_COLOR:zd,SET_STROKE_WIDTH:Fd,START_PATH:$d,CONTINUE_PATH:Wd,CANCEL_PATH:jd,FINISH_PATH:Gd,ADD_TEXT:Jd,UPDATE_TEXT:Vd,UPDATE_TEXT_SIZE:Yd,DELETE_ANNOTATION:Ud,MOVE_ANNOTATION:Kd,RESIZE_ANNOTATION:Xd,PASTE_ANNOTATIONS:qd,RESTORE_ANNOTATIONS:Zd,UNDO:Qd,REDO:eu,SELECT_ANNOTATION:tu,UPDATE_ANNOTATION_COLOR:nu,MARK_CAPTURED:ou,CLEAR:ru,SELECT_ELEMENT:iu,MODIFY_STYLE:su,MODIFY_STYLES_BATCH:au,CLEAR_STYLE:lu,CLEAR_ALL_STYLES:cu,RESTORE_STYLE_MODIFICATIONS:du,UPDATE_LINKED_POSITIONS:uu,CLEANUP_ORPHANED:hu,SET_ANNOTATION_STATUS:pu,SET_ANNOTATION_THREAD:fu,SET_ANNOTATION_QUESTION:gu,APPLY_RESOLUTIONS:mu,ADD_SPACING_TOKEN_CHANGE:yu,RESTORE_SPACING_TOKEN_CHANGES:bu,MODIFY_SPACING_TOKEN:vu,DELETE_SPACING_TOKEN:xu};function wu(e,t){let n=Su[t.type];return n?n(e,t.payload):e}function ul(){let[e,t]=_d(wu,Od);return Dd(()=>{let n=o=>{(o.metaKey||o.ctrlKey)&&o.key==="z"&&(o.preventDefault(),o.shiftKey?t({type:"REDO"}):t({type:"UNDO"}))};return window.addEventListener("keydown",n),()=>window.removeEventListener("keydown",n)},[]),[e,t]}import{useSyncExternalStore as Cu}from"react";if(typeof window<"u"&&!window.__popmeltPathPatch){window.__popmeltPathPatch=!0;for(let e of["pushState","replaceState"]){let t=History.prototype[e];History.prototype[e]=function(...n){let o=window.location.pathname;t.apply(this,n),window.dispatchEvent(new CustomEvent("popmelt:locationchange",{detail:{prevPath:o}}))}}}function Eu(e){return window.addEventListener("popstate",e),window.addEventListener("popmelt:locationchange",e),()=>{window.removeEventListener("popstate",e),window.removeEventListener("popmelt:locationchange",e)}}function ku(){return window.location.pathname}function Pr(){return Cu(Eu,ku,()=>"/")}var pl="popmelt-toolbar-snap-position";function ur(e){return e.startsWith("top-")}function pr(e){return e.endsWith("-right")}function ri(e){return e.endsWith("-center")}function fl(){try{let e=localStorage.getItem(pl);if(e&&Tu(e))return e}catch{}return"bottom-right"}function gl(e){try{localStorage.setItem(pl,e)}catch{}}function Tu(e){return["bottom-right","bottom-center","bottom-left","top-right","top-center","top-left"].includes(e)}function ml(e,t,n){let o=ur(e)?16:n-16-54;return ri(e)?{position:"fixed",top:o,left:t/2,transform:"translateX(-50%)"}:pr(e)?{position:"fixed",top:o,right:16,left:"auto"}:{position:"fixed",top:o,left:16,right:"auto"}}function hl(e,t,n){let r=ur(e)?{top:82}:{bottom:82},i;return ri(e)?i={left:t/2,transform:"translateX(-50%)"}:pr(e)?i={right:16}:i={left:16},{position:"fixed",...r,...i}}function yl(e,t,n){let o=ur(e),r=o?{top:78}:{bottom:78},i,a;return ri(e)?(i={left:"50%",transform:"translateX(-50%)"},a="center"):pr(e)?(i={right:16},a="flex-end"):(i={left:16},a="flex-start"),{position:"fixed",...r,...i,zIndex:9999,display:"flex",flexDirection:"column",alignItems:a}}function Pi(e){let t=ur(e),n=pr(e)||ri(e);return{position:"fixed",top:t&&n?82:16,right:16,bottom:!t&&n?82:16}}function bl(e,t,n){let r=ur(e),i,a;pr(e)||ri(e)?(i=t-16,a=i-326):(a=16,i=a+326);let s=r?82:n-16-54-12;return{left:a,right:i,y:s}}var vl=["top-left","top-center","top-right","bottom-left","bottom-center","bottom-right"];function Bi(e){let t=Object.keys(e).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!t)return null;let n=e[t],o=[];for(;n;){let r=n.type,i=r?.displayName||r?.name;i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&o.unshift(i),n=n.return}return o.length>0?{name:o[o.length-1],path:o}:null}function Es(e){let t=Object.keys(e).find(r=>r.startsWith("__reactFiber$")||r.startsWith("__reactInternalInstance$"));if(!t)return[];let n=e[t],o=[];for(;n;){let r=n.type,i=typeof r=="function"||typeof r=="object"?r?.displayName||r?.name:null;i&&typeof i=="string"&&/^[A-Z]/.test(i)&&!i.startsWith("_")&&i!=="Fragment"&&o.push({name:i,fiber:n}),n=n.return}return o.reverse(),o}function Di(e){let t=e,n=new Set;for(;t&&!n.has(t);){if(n.add(t),t.stateNode instanceof Element)return t.stateNode;t.child?t=t.child:t=null}return null}function xl(e){if(e.id)return`#${e.id}`;let t=e.tagName.toLowerCase(),n=Array.from(e.classList).slice(0,3).join(".");return n?`${t}.${n}`:t}function Vn(e){if(e.id&&!e.id.startsWith("radix-")&&!e.id.startsWith(":"))return`#${CSS.escape(e.id)}`;let t=[],n=e;for(;n&&n!==document.documentElement;){let o=n.tagName.toLowerCase();if(n.id&&!n.id.startsWith("radix-")&&!n.id.startsWith(":")){t.unshift(`#${CSS.escape(n.id)}`);break}let r=Array.from(n.classList).filter(a=>!a.startsWith("_")&&a.length<30).slice(0,2);r.length>0&&(o+="."+r.map(a=>CSS.escape(a)).join("."));let i=n.parentElement;if(i){let a=Array.from(i.children).filter(s=>s.tagName===n.tagName);if(a.length>1){let s=a.indexOf(n)+1;o+=`:nth-of-type(${s})`}}t.unshift(o),n=i}return t.join(" > ")}function Tn(e){try{return document.querySelector(e)}catch{return null}}function _i(e,t=0){let n=Es(e);if(n.length===0)return null;let o=n.map(l=>l.name),r=n.length-1,i=Math.max(0,Math.min(n.length-1,r-t)),a=n[i],s=Di(a.fiber)??e;return{name:a.name,path:o,depthIndex:i,rootElement:s}}function Sl(e,t){let n=Es(e),o=t.toLowerCase(),r=-1;for(let i=n.length-1;i>=0;i--){let a=n[i].name;if(a===t){let s=Di(n[i].fiber)??e;return{name:t,path:n.map(l=>l.name),depthIndex:i,rootElement:s}}if(r===-1){let s=a.toLowerCase();(s.length>=4&&o.includes(s)||o.length>=4&&s.includes(o))&&(r=i)}}if(r>=0){let i=Di(n[r].fiber)??e;return{name:t,path:n.map(a=>a.name),depthIndex:r,rootElement:i}}return null}function Br(e){let t=Dr(),n=[],o=new Set,r=t.currentNode;for(;r=t.nextNode();){let i=Sl(r,e);i&&!o.has(i.rootElement)&&(o.add(i.rootElement),n.push(i))}return n}function ks(e){let t=new Map;if(e.size===0)return t;let n=new Set(e),o=Dr(),r=new Set,i=o.currentNode;for(;(i=o.nextNode())&&n.size>0;)for(let a of n){let s=Sl(i,a);if(!s||r.has(s.rootElement))continue;r.add(s.rootElement);let l=s.rootElement.getBoundingClientRect();t.set(a,l.top+window.scrollY),n.delete(a);break}for(let a of n)t.set(a,1/0);return t}function Dr(){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 Nn(e){let t={selector:xl(e),tagName:e.tagName.toLowerCase()};e.id&&(t.id=e.id),e.classList.length>0&&(t.className=Array.from(e.classList).join(" "));let n=wl(e);n&&n.length>0&&n.length<200&&(t.textContent=n);let o={};for(let a of e.attributes)a.name.startsWith("data-")&&(o[a.name]=a.value);Object.keys(o).length>0&&(t.dataAttributes=o);let r=Bi(e);r&&(t.reactComponent=r.name);let i=Iu(e);return i&&(t.context=i),t}function wl(e){let t="";for(let n of e.childNodes)n.nodeType===Node.TEXT_NODE&&(t+=n.textContent||"");return t.trim()}function fr(e,t){let n=document.elementsFromPoint(e,t);for(let o of n)if(o instanceof HTMLElement&&!(o.id==="devtools-canvas"||o.id==="devtools-toolbar"||o.id==="devtools-scrim")&&!o.closest("#devtools-toolbar")&&!(o.dataset.devtools||o.closest("[data-devtools]"))&&!["html","body"].includes(o.tagName.toLowerCase()))return o;return null}function Iu(e){let t=e.parentElement,n=["section","article","nav","aside","header","footer","main"];for(;t&&t!==document.body;){let o=t.tagName.toLowerCase();if(n.includes(o)&&t.id)return`${o}#${t.id}`;if(t.id&&!t.id.startsWith("radix-")&&!t.id.startsWith(":"))return`${o}#${t.id}`;t=t.parentElement}return null}function Cl(e){let t=new Set,n=[],o=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 a of i){let s=a.x-o,l=a.y-r;if(s<0||l<0||s>window.innerWidth||l>window.innerHeight)continue;let c=fr(s,l);c&&!t.has(c)&&(t.add(c),n.push(Nn(c)))}return n.slice(0,3)}function Ts(e){if(e.length===0)return[];let t=e.map(o=>o.x),n=e.map(o=>o.y);return Cl({minX:Math.min(...t),minY:Math.min(...n),maxX:Math.max(...t),maxY:Math.max(...n)})}function un(e,t){return e.style.getPropertyValue(t)!==""}function Mu(e,t=30){if(e<=0)return[];let n=[],o=Dr(),r=.5,i=o.currentNode;for(;(i=o.nextNode())&&n.length<t;){let a=i,s=a.getBoundingClientRect();if(s.bottom<-50||s.top>window.innerHeight+50||s.right<-50||s.left>window.innerWidth+50||s.width<1||s.height<1)continue;let l=getComputedStyle(a);!un(a,"padding-top")&&Math.abs((parseFloat(l.paddingTop)||0)-e)<r&&n.push({element:a,property:"padding-top"}),!un(a,"padding-bottom")&&Math.abs((parseFloat(l.paddingBottom)||0)-e)<r&&n.length<t&&n.push({element:a,property:"padding-bottom"}),!un(a,"padding-left")&&Math.abs((parseFloat(l.paddingLeft)||0)-e)<r&&n.length<t&&n.push({element:a,property:"padding-left"}),!un(a,"padding-right")&&Math.abs((parseFloat(l.paddingRight)||0)-e)<r&&n.length<t&&n.push({element:a,property:"padding-right"}),!un(a,"margin-top")&&Math.abs((parseFloat(l.marginTop)||0)-e)<r&&n.length<t&&n.push({element:a,property:"margin-top"}),!un(a,"margin-bottom")&&Math.abs((parseFloat(l.marginBottom)||0)-e)<r&&n.length<t&&n.push({element:a,property:"margin-bottom"}),!un(a,"margin-left")&&Math.abs((parseFloat(l.marginLeft)||0)-e)<r&&n.length<t&&n.push({element:a,property:"margin-left"}),!un(a,"margin-right")&&Math.abs((parseFloat(l.marginRight)||0)-e)<r&&n.length<t&&n.push({element:a,property:"margin-right"});let c=l.display;if((c.includes("flex")||c.includes("grid"))&&n.length<t){let d=un(a,"gap"),u=parseFloat(l.gap)||0,p=parseFloat(l.rowGap)||0,f=parseFloat(l.columnGap)||0;!d&&Math.abs(u-e)<r?n.push({element:a,property:"gap"}):!un(a,"row-gap")&&Math.abs(p-e)<r?n.push({element:a,property:"row-gap"}):!un(a,"column-gap")&&Math.abs(f-e)<r&&n.push({element:a,property:"column-gap"})}}return n}function Is(e,t=30){if(e<=0)return[];let n=[],o=Dr(),r=.5,i=o.currentNode;for(;(i=o.nextNode())&&n.length<t;){let a=i,s=a.getBoundingClientRect();if(s.bottom<-50||s.top>window.innerHeight+50||s.right<-50||s.left>window.innerWidth+50||s.width<1||s.height<1)continue;let l=getComputedStyle(a),c=parseFloat(l.borderTopWidth)||0,d=parseFloat(l.borderRightWidth)||0,u=parseFloat(l.borderBottomWidth)||0,p=parseFloat(l.borderLeftWidth)||0,f=a.clientWidth,b=a.clientHeight,C=parseFloat(l.paddingTop)||0;!un(a,"padding-top")&&Math.abs(C-e)<r&&n.push({x:s.left+p,y:s.top+c,width:f,height:e,direction:"vertical",property:"padding-top"});let w=parseFloat(l.paddingBottom)||0;!un(a,"padding-bottom")&&Math.abs(w-e)<r&&n.length<t&&n.push({x:s.left+p,y:s.top+c+b-e,width:f,height:e,direction:"vertical",property:"padding-bottom"});let M=parseFloat(l.paddingLeft)||0;!un(a,"padding-left")&&Math.abs(M-e)<r&&n.length<t&&n.push({x:s.left+p,y:s.top+c,width:e,height:b,direction:"horizontal",property:"padding-left"});let L=parseFloat(l.paddingRight)||0;!un(a,"padding-right")&&Math.abs(L-e)<r&&n.length<t&&n.push({x:s.left+p+f-e,y:s.top+c,width:e,height:b,direction:"horizontal",property:"padding-right"});let E=parseFloat(l.marginTop)||0;!un(a,"margin-top")&&Math.abs(E-e)<r&&n.length<t&&n.push({x:s.left,y:s.top-e,width:s.width,height:e,direction:"vertical",property:"margin-top"});let R=parseFloat(l.marginBottom)||0;!un(a,"margin-bottom")&&Math.abs(R-e)<r&&n.length<t&&n.push({x:s.left,y:s.bottom,width:s.width,height:e,direction:"vertical",property:"margin-bottom"});let v=parseFloat(l.marginLeft)||0;!un(a,"margin-left")&&Math.abs(v-e)<r&&n.length<t&&n.push({x:s.left-e,y:s.top,width:e,height:s.height,direction:"horizontal",property:"margin-left"});let D=parseFloat(l.marginRight)||0;!un(a,"margin-right")&&Math.abs(D-e)<r&&n.length<t&&n.push({x:s.right,y:s.top,width:e,height:s.height,direction:"horizontal",property:"margin-right"});let j=l.display;if((j.includes("flex")||j.includes("grid"))&&n.length<t&&!un(a,"gap")){let T=Array.from(a.children).filter(N=>{let g=getComputedStyle(N);return g.display!=="none"&&g.position!=="absolute"&&g.position!=="fixed"});if(T.length>=2)for(let N=0;N<T.length-1&&n.length<t;N++){let g=T[N].getBoundingClientRect(),m=T[N+1].getBoundingClientRect(),$=m.top-g.bottom;Math.abs($-e)<r&&$>.5&&n.push({x:Math.min(g.left,m.left),y:g.bottom,width:Math.max(g.right,m.right)-Math.min(g.left,m.left),height:$,direction:"vertical",property:"gap"});let me=m.left-g.right;Math.abs(me-e)<r&&me>.5&&n.push({x:g.right,y:Math.min(g.top,m.top),width:me,height:Math.max(g.bottom,m.bottom)-Math.min(g.top,m.top),direction:"horizontal",property:"gap"})}}}return n}function Oi(e){return typeof e=="string"?{value:e}:e}var kl={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 El(e,t){let n=kl[t];return n?n.includes(e):!1}function Ru(e,t){let n=e.split(/\s+/);for(let o of n){if(o===t)return!0;let r=o.lastIndexOf(":");if(r>=0&&o.slice(r+1)===t)return!0}return!1}function Au(e){let t=e.lastIndexOf(":"),n=t>=0?e.slice(t+1):e,o=n.indexOf("-");if(o<0)return null;let r=n.slice(0,o),i={gap:"gap","gap-x":"column-gap","gap-y":"row-gap",p:"padding",pt:"padding-top",pb:"padding-bottom",pl:"padding-left",pr:"padding-right",px:"padding-left",py:"padding-top",m:"margin",mt:"margin-top",mb:"margin-bottom",ml:"margin-left",mr:"margin-right",mx:"margin-left",my:"margin-top"},a=n.slice(0,n.indexOf("-",o+1)>0?n.indexOf("-",o+1):o);return i[a]??i[r]??null}function Ms(e,t=30){let n=parseFloat(e.value);if(isNaN(n)||n<=0)return[];if(e.bindings&&e.bindings.length>0){let r=[],i=Dr(),a=i.currentNode;for(;(a=i.nextNode())&&r.length<t;){let s=a,l=s.getBoundingClientRect();if(l.bottom<-50||l.top>window.innerHeight+50||l.right<-50||l.left>window.innerWidth+50||l.width<1||l.height<1)continue;let c=s.className;if(typeof c=="string")for(let d of e.bindings){if(!Ru(c,d))continue;let u=Au(d);if(u&&!(e.property&&!El(u,e.property))){r.push({element:s,property:u});break}}}return r}let o=Mu(n,t*2);return e.property?o.filter(r=>El(r.property,e.property)).slice(0,t):o.slice(0,t)}function Rs(e,t=30){let n=Ms(e,t),o=[];for(let r of n){let i=r.element,a=i.getBoundingClientRect(),s=getComputedStyle(i),l=parseFloat(s.borderTopWidth)||0,c=parseFloat(s.borderRightWidth)||0,d=parseFloat(s.borderLeftWidth)||0,u=i.clientWidth,p=i.clientHeight;switch(r.property){case"padding-top":{let f=parseFloat(s.paddingTop)||0;o.push({x:a.left+d,y:a.top+l,width:u,height:f,direction:"vertical",property:r.property});break}case"padding-bottom":{let f=parseFloat(s.paddingBottom)||0;o.push({x:a.left+d,y:a.top+l+p-f,width:u,height:f,direction:"vertical",property:r.property});break}case"padding-left":{let f=parseFloat(s.paddingLeft)||0;o.push({x:a.left+d,y:a.top+l,width:f,height:p,direction:"horizontal",property:r.property});break}case"padding-right":{let f=parseFloat(s.paddingRight)||0;o.push({x:a.left+d+u-f,y:a.top+l,width:f,height:p,direction:"horizontal",property:r.property});break}case"margin-top":{let f=parseFloat(s.marginTop)||0;o.push({x:a.left,y:a.top-f,width:a.width,height:f,direction:"vertical",property:r.property});break}case"margin-bottom":{let f=parseFloat(s.marginBottom)||0;o.push({x:a.left,y:a.bottom,width:a.width,height:f,direction:"vertical",property:r.property});break}case"margin-left":{let f=parseFloat(s.marginLeft)||0;o.push({x:a.left-f,y:a.top,width:f,height:a.height,direction:"horizontal",property:r.property});break}case"margin-right":{let f=parseFloat(s.marginRight)||0;o.push({x:a.right,y:a.top,width:f,height:a.height,direction:"horizontal",property:r.property});break}case"gap":case"row-gap":case"column-gap":{let f=Array.from(i.children).filter(b=>{let C=getComputedStyle(b);return C.display!=="none"&&C.position!=="absolute"&&C.position!=="fixed"});for(let b=0;b<f.length-1&&o.length<t;b++){let C=f[b].getBoundingClientRect(),w=f[b+1].getBoundingClientRect(),M=w.top-C.bottom;M>.5&&o.push({x:Math.min(C.left,w.left),y:C.bottom,width:Math.max(C.right,w.right)-Math.min(C.left,w.left),height:M,direction:"vertical",property:"gap"});let L=w.left-C.right;L>.5&&o.push({x:C.right,y:Math.min(C.top,w.top),width:L,height:Math.max(C.bottom,w.bottom)-Math.min(C.top,w.top),direction:"horizontal",property:"gap"})}break}}}return o}function Tl(e,t){let n=new Set,o=ii(t);for(let r of e){let i=Ml[r.property];if(!i)continue;let a=r.element.className;if(typeof a=="string")for(let s of i){let l=`${s}-${o}`;for(let c of a.split(/\s+/)){let d=c.lastIndexOf(":"),u=d>=0?c.slice(d+1):c;if(u===l){n.add(u);break}}}}return[...n]}function Il(e){let t=new Set;for(let n of e)for(let[o,r]of Object.entries(kl))if(r.includes(n.property)){t.add(o);break}if(t.size===1)return[...t][0]}function As(e,t,n){if(t===n)return e;let o=ii(t),r=ii(n);return e.map(i=>{let a=i.lastIndexOf("-");if(a<0)return i;let s=i.slice(0,a),l=i.slice(a+1);return l===o||l===`[${t}px]`?`${s}-${r}`:i})}var Lu={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 ii(e){return Lu[e]??`[${e}px]`}var Ml={"padding-top":["pt","py","p"],"padding-bottom":["pb","py","p"],"padding-left":["pl","px","p"],"padding-right":["pr","px","p"],"margin-top":["mt","my","m"],"margin-bottom":["mb","my","m"],"margin-left":["ml","mx","m"],"margin-right":["mr","mx","m"],gap:["gap"],"row-gap":["gap-y","gap"],"column-gap":["gap-x","gap"]};function Pu(e,t,n,o){let r=Ml[t];if(!r)return null;let i=ii(n);for(let a of r){let s=new RegExp("(?:^|\\s)((?:[\\w-]+:)*"+a+"-(?:"+Bu(i)+"|\\["+n+"px\\]))(?:\\s|$)"),l=e.match(s);if(l?.[1]){let c=ii(o),d=l[1].lastIndexOf(":"),u=d>=0?l[1].slice(0,d+1):"";return{matched:l[1],suggested:`${u}${a}-${c}`}}}return null}function Bu(e){return e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")}function Rl(e,t,n){let o=new Set,r=[];for(let i of e){let a=Vn(i.element),s=`${a}::${i.property}`;if(o.has(s))continue;o.add(s);let l=Bi(i.element),c=i.element.className||"",d=Pu(c,i.property,t,n);r.push({selector:a,reactComponent:l?.name,className:c,property:i.property,matchedClass:d?.matched,suggestedClass:d?.suggested})}return r}function Hi(e,t){return window.getComputedStyle(e).getPropertyValue(t)}function Ni(e,t){if(e instanceof HTMLElement){let o=e.style.getPropertyValue(t);if(o)return o}let n=t.replace(/-([a-z])/g,(o,r)=>r.toUpperCase());try{for(let o of document.styleSheets)try{let r=o.cssRules||o.rules;for(let i of r)if(i instanceof CSSStyleRule&&e.matches(i.selectorText)){let a=i.style.getPropertyValue(t);if(a)return a;let s=i.style[n];if(s)return s}}catch{}}catch{}return null}function zi(e){let t=window.getComputedStyle(e).display;return t==="flex"||t==="inline-flex"||t==="grid"||t==="inline-grid"}function gr(e){let t=window.getComputedStyle(e);return{row:parseFloat(t.rowGap)||0,column:parseFloat(t.columnGap)||0}}function Du(e){let t=[];for(let n of e){let o=t.find(r=>r.axis!==n.axis?!1:n.axis==="row"?Math.abs(r.y-n.y)<2&&Math.abs(r.h-n.h)<2:Math.abs(r.x-n.x)<2&&Math.abs(r.w-n.w)<2);if(o)if(n.axis==="row"){let r=Math.min(o.x,n.x),i=Math.max(o.x+o.w,n.x+n.w);o.x=r,o.w=i-r}else{let r=Math.min(o.y,n.y),i=Math.max(o.y+o.h,n.y+n.h);o.y=r,o.h=i-r}else t.push({...n})}return t}function Oo(e){let t=Array.from(e.children).filter(l=>{if(!(l instanceof HTMLElement))return!1;let c=window.getComputedStyle(l);return c.display!=="none"&&c.position!=="absolute"&&c.position!=="fixed"});if(t.length<2)return[];let n=[],o=e.getBoundingClientRect(),i=window.getComputedStyle(e).flexDirection,a=i==="column"||i==="column-reverse",s=6;for(let l=0;l<t.length-1;l++){let c=t[l].getBoundingClientRect(),d=t[l+1].getBoundingClientRect();if(d.left>c.right+.5&&n.push({axis:"column",x:c.right,y:o.top,w:d.left-c.right,h:o.height}),d.top>c.bottom+.5&&n.push({axis:"row",x:o.left,y:c.bottom,w:o.width,h:d.top-c.bottom}),!(d.left>c.right+.5)&&!(d.top>c.bottom+.5))if(a){let u=(c.bottom+d.top)/2;n.push({axis:"row",x:o.left,y:u-s/2,w:o.width,h:s})}else{let u=(c.right+d.left)/2;n.push({axis:"column",x:u-s/2,y:o.top,w:s,h:o.height})}}return Du(n)}function Ls(e,t){let n=window.getComputedStyle(e),o=n.display;if(o!=="flex"&&o!=="inline-flex")return!1;let r=n.justifyContent;if(r!=="space-between"&&r!=="space-around"&&r!=="space-evenly"&&r!=="stretch")return!1;let i=n.flexDirection;return!(t!==(i==="column"||i==="column-reverse"?"row":"column")||parseFloat(t==="row"?n.rowGap:n.columnGap)>0)}function _r(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 mr(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 Ps(e){for(let t of e.childNodes)if(t.nodeType===Node.TEXT_NODE&&(t.textContent||"").trim().length>0)return!0;return!1}function Or(e){let t=document.createRange(),n=!1;for(let d of e.childNodes)d.nodeType===Node.TEXT_NODE&&(d.textContent||"").trim().length>0&&(n||(t.setStart(d,0),n=!0),t.setEnd(d,d.textContent?.length??0));if(!n)return null;let o=t.getBoundingClientRect(),r=window.getComputedStyle(e),i=parseFloat(r.fontSize)||16,a=parseFloat(r.lineHeight);isNaN(a)&&(a=i*1.2);let s=Math.max(1,t.getClientRects().length),l=Math.max(o.height,s*a),c=(l-o.height)/2;return new DOMRect(o.x,o.y-c,o.width,l)}function si(e){let t=window.getComputedStyle(e),n=parseFloat(t.fontSize)||16,o=parseFloat(t.lineHeight);return isNaN(o)&&(o=n*1.2),{fontSize:n,lineHeight:o}}function et(e,t,n){e instanceof HTMLElement&&e.style.setProperty(t,n,"important")}function Al(e,t,n){e instanceof HTMLElement&&e.style.removeProperty(t)}function Fi(e){for(let t of e){let n=Tn(t.selector);if(!n&&t.durableSelector&&(n=Tn(t.durableSelector),n)){let o=t.selector.match(/\[data-pm="([^"]+)"\]/)?.[1];o&&n.setAttribute("data-pm",o)}if(n)for(let o of t.changes)et(n,o.property,o.modified)}}function $i(e){for(let t of e){let n=Tn(t.selector);if(n)for(let o of t.changes)Al(n,o.property,o.original)}}function Pl(e,t,n,o){if(e)for(let r of e){if(r instanceof CSSGroupingRule){Pl(r.cssRules,t,n,o);continue}if(r instanceof CSSStyleRule){let i=r.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&_u(r.style,t,n,o)}}}function _u(e,t,n,o){for(let r=0;r<e.length;r++){let i=e[r];if(i?.startsWith("--")){if(n.has(i))continue;n.add(i);let a=t.getPropertyValue(i).trim();Bl(a)&&o.push({name:i,value:a,usage:`var(${i})`})}}}var Wi=null,Ou=5e3;function Bs(){if(Wi&&Date.now()-Wi.timestamp<Ou)return Wi.variables;let e=[],t=new Set,n=getComputedStyle(document.documentElement);try{for(let i of document.styleSheets)try{Pl(i.cssRules||i.rules,n,t,e)}catch{}}catch{}let o=document.documentElement.style;for(let i=0;i<o.length;i++){let a=o[i];if(a?.startsWith("--")&&!t.has(a)){t.add(a);let s=n.getPropertyValue(a).trim();Bl(s)&&e.push({name:a,value:s,usage:`var(${a})`})}}let r=e.sort((i,a)=>i.name.localeCompare(a.name));return Wi={variables:r,timestamp:Date.now()},r}function Bl(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 Hr(e,t){let n=t.match(/var\((--[^,)]+)(?:,\s*([^)]+))?\)/);if(n){let o=n[1],r=n[2];return getComputedStyle(document.documentElement).getPropertyValue(o).trim()||r||t}return t}function ai(e,t){if(!e)return null;let n=Ll(e);if(!n)return null;for(let o of t){let r=Ll(o.value);if(r&&n===r)return o}return null}function Ll(e){if(!e)return null;let t=e.trim().toLowerCase();if(t.startsWith("oklch(")){let n=t.match(/oklch\(\s*([\d.]+%?)\s+([\d.]+%?)\s+([\d.]+)/);if(n){let o=n[1].endsWith("%")?parseFloat(n[1])/100:parseFloat(n[1]),r=n[2].endsWith("%")?parseFloat(n[2])/100:parseFloat(n[2]),i=parseFloat(n[3]);o=Math.round(o*100)/100,r=Math.round(r*1e3)/1e3;let a=Math.round(i);return`oklch(${o} ${r} ${a})`}}if(t.startsWith("rgb")){let n=t.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(n)return`rgb(${n[1]},${n[2]},${n[3]})`}return t.startsWith("#")?t.length===4?`#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}`:t.slice(0,7):t}import{domToCanvas as Hu}from"modern-screenshot";var Dl="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";function Nu(e){if(typeof window>"u")return!1;try{let t=new URL(e,window.location.href);return t.protocol!=="http:"&&t.protocol!=="https:"?!1:t.origin!==window.location.origin}catch{return!1}}function Ds(e){let t=document.createElement("canvas").getContext("2d");return t?(t.fillStyle=e,t.fillStyle):"#888888"}function _s(e,t=[],n,o){let r=new Map,i=[];for(let s of e)if(s.groupId){let l=r.get(s.groupId)||[];l.push(s),r.set(s.groupId,l)}else i.push(s);let a=[];for(let[s,l]of r){let c=l.find(u=>u.type!=="text"),d=l.find(u=>u.type==="text");if(c){let u=c.linkedSelector||d?.linkedSelector,p=d?.imageCount||c.imageCount,f=c.pathname||d?.pathname;a.push({id:c.id,type:c.type,instruction:d?.text,...u?{linkedSelector:u}:{},...f?{pathname:f}:{},elements:c.elements||[],...p?{imageCount:p}:{}})}}for(let s of i)a.push({id:s.id,type:s.type,instruction:s.type==="text"?s.text:void 0,...s.linkedSelector?{linkedSelector:s.linkedSelector}:{},...s.pathname?{pathname:s.pathname}:{},elements:s.elements||[],...s.imageCount?{imageCount:s.imageCount}:{}});return{timestamp:new Date().toISOString(),url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},scrollPosition:{x:window.scrollX,y:window.scrollY},annotations:a,styleModifications:t,...n?{inspectedElement:n}:{},...o&&o.length>0?{spacingTokenChanges:o}:{}}}function zu(e){if(!e.points||e.points.length===0)return null;let t=e.points.map(o=>o.x),n=e.points.map(o=>o.y);return{minX:Math.min(...t),minY:Math.min(...n),maxX:Math.max(...t),maxY:Math.max(...n)}}function Fu(e,t){if(e.length===0)return[];let n=e.map(d=>({annotation:d,bounds:zu(d)})).filter(d=>d.bounds!==null);if(n.length===0)return[];n.sort((d,u)=>d.bounds.minY-u.bounds.minY);let o=Math.min(...n.map(d=>d.bounds.minY)),r=Math.max(...n.map(d=>d.bounds.maxY));if(r-o<=t){let d=(o+r)/2,u=Math.max(0,d-t/2);return[{top:u,bottom:u+t,annotations:e}]}let i=[],a=50,s=Math.max(0,o-a),l=[],c=s;for(let{annotation:d,bounds:u}of n){let p=u.maxY+a;if(p-s<=t)l.push(d),c=Math.max(c,p);else{if(l.length>0){let f=(s+c)/2,b=Math.max(0,f-t/2);i.push({top:b,bottom:b+t,annotations:l})}s=Math.max(0,u.minY-a),l=[d],c=u.maxY+a}}if(l.length>0){let d=(s+c)/2,u=Math.max(0,d-t/2);i.push({top:u,bottom:u+t,annotations:l})}return i}function $u(e){let t=new Map;for(let n of e)if(n.linkedSelector)try{let o=document.querySelector(n.linkedSelector);if(o){let r=o.getBoundingClientRect();t.set(n.id,{x:r.left+window.scrollX,y:r.top+window.scrollY,width:r.width,height:r.height})}}catch{}return t}function Wu(e,t,n,o,r){if(e.save(),e.scale(o,o),r)for(let i of t){let a=r.get(i.id);if(!a)continue;let s=a.y-n;e.fillStyle=i.color,e.globalAlpha=.05,e.fillRect(a.x,s,a.width,a.height),e.globalAlpha=1,e.strokeStyle=i.color,e.lineWidth=1,e.setLineDash([2,4]),e.strokeRect(a.x,s,a.width,a.height),e.setLineDash([])}for(let i of t){let a=i.points.map(s=>({x:s.x,y:s.y-n}));switch(e.strokeStyle=i.color,e.fillStyle=i.color,e.lineWidth=i.strokeWidth,e.lineCap="round",e.lineJoin="round",i.type){case"freehand":if(a.length<2)break;e.beginPath(),e.moveTo(a[0].x,a[0].y);for(let s=1;s<a.length;s++)e.lineTo(a[s].x,a[s].y);e.stroke();break;case"line":if(a.length<2)break;e.beginPath(),e.moveTo(a[0].x,a[0].y),e.lineTo(a[a.length-1].x,a[a.length-1].y),e.stroke();break;case"rectangle":{if(a.length<2)break;let s=a[0],l=a[a.length-1],c=Math.min(s.x,l.x),d=Math.min(s.y,l.y),u=Math.abs(l.x-s.x),p=Math.abs(l.y-s.y);e.strokeRect(c,d,u,p);break}case"circle":{if(a.length<2)break;let s=a[0],l=a[a.length-1],c=(s.x+l.x)/2,d=(s.y+l.y)/2,u=Math.abs(l.x-s.x)/2,p=Math.abs(l.y-s.y)/2;e.beginPath(),e.ellipse(c,d,u,p,0,0,Math.PI*2),e.stroke();break}case"text":{if(!i.text||a.length<1)break;let s=a[0],l=i.fontSize||16;e.font=`${l}px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`,e.fillStyle=i.color;let d=(i.imageCount&&i.imageCount>0?`[${i.imageCount} image${i.imageCount>1?"s":""}] ${i.text}`:i.text).split(`
|
|
3
|
+
`),u=l*1.2,p=4,f=0;for(let b of d)f=Math.max(f,e.measureText(b).width);e.fillRect(s.x-p,s.y-p,f+p*2,d.length*u+p*2),e.fillStyle="#ffffff",d.forEach((b,C)=>{e.fillText(b,s.x,s.y+l+C*u)});break}}}e.restore()}async function Nr(e,t,n=[],o){try{let r=o?.dpr??(window.devicePixelRatio||1),i=window.innerWidth,a=window.innerHeight,s=n.filter(u=>(u.status??"pending")==="pending");console.log("[Screenshot] Starting capture with",s.length,"active annotations (filtered",n.length-s.length,"captured)");let l=$u(s),c=Fu(s,a);if(c.length===0){let u=await _l(e,[],window.scrollY,i,a,r,l);return u?[u]:[]}let d=[];for(let u=0;u<c.length;u++){let p=c[u],f=await _l(e,p.annotations,p.top,i,a,r,l);f?d.push(f):console.warn(`[Screenshot] Region ${u+1} failed to capture`)}return console.log("[Screenshot] Capture complete"),d}catch(r){return console.error("[Screenshot] Capture failed:",r),[]}}async function _l(e,t,n,o,r,i,a){try{let s=getComputedStyle(document.documentElement).backgroundColor,c=await Hu(e,{filter:p=>!(p instanceof HTMLElement&&(p.id==="devtools-canvas"||p.id==="devtools-toolbar"||p.id==="devtools-scrim"||p.dataset.devtools!==void 0)),scale:i,backgroundColor:s&&s!=="rgba(0, 0, 0, 0)"&&s!=="transparent"?s:"#ffffff",width:o,height:r,style:{transform:`translate(${-window.scrollX}px, ${-n}px)`},fetchFn:async p=>Nu(p)?Dl:!1,fetch:{placeholderImage:Dl}}),d=document.createElement("canvas");d.width=o*i,d.height=r*i;let u=d.getContext("2d");return u?(u.drawImage(c,0,0,o*i,r*i,0,0,o*i,r*i),Wu(u,t,n,i,a),new Promise(p=>{d.toBlob(f=>p(f),"image/webp",.8)})):null}catch(s){return console.error("Region capture failed:",s),null}}async function li(e){if(e.length===0)return null;if(e.length===1)return e[0];let t=await Promise.all(e.map(s=>new Promise((l,c)=>{let d=new Image;d.onload=()=>l(d),d.onerror=c,d.src=URL.createObjectURL(s)}))),n=t[0].width,o=t.reduce((s,l)=>s+l.height,0),r=document.createElement("canvas");r.width=n,r.height=o;let i=r.getContext("2d");if(!i)return null;let a=0;for(let s of t)i.drawImage(s,0,a),a+=s.height,URL.revokeObjectURL(s.src);return new Promise(s=>{r.toBlob(l=>s(l),"image/webp",.8)})}async function Ol(e,t,n){try{let o=Array.isArray(e)?e:[e];if(o.length===0)return!1;let r=await li(o);if(!r)return!1;let i=r;if(r.type!=="image/png"){let c=new Image,d=URL.createObjectURL(r);await new Promise(p=>{c.onload=()=>p(),c.src=d}),URL.revokeObjectURL(d);let u=document.createElement("canvas");u.width=c.naturalWidth,u.height=c.naturalHeight,u.getContext("2d").drawImage(c,0,0),i=await new Promise(p=>u.toBlob(f=>p(f),"image/png"))}let a={"image/png":i},s=t&&t.length>0,l=n&&n.length>0;if(s||l){let c=t?t.filter(d=>(d.status??"pending")==="pending"):[];if(c.length>0||l){let d=_s(c,n||[]),u=new Blob([JSON.stringify(d,null,2)],{type:"text/plain"});a["text/plain"]=u}}return await navigator.clipboard.write([new ClipboardItem(a)]),!0}catch(o){return console.warn("Clipboard write failed:",o),!1}}var Hl={name:"@popmelt.com/core",version:"0.8.0",description:"The design collaboration layer for AI coding agents",license:"PolyForm-Shield-1.0.0",author:"Popmelt <reb@popmelt.com> (https://popmelt.com)",homepage:"https://github.com/popmelt/core",bugs:{url:"https://github.com/popmelt/core/issues"},repository:{type:"git",url:"git+https://github.com/popmelt/core.git"},keywords:["ai","annotations","collaboration","devtools","react","visual-feedback"],bin:{popmelt:"dist/cli.mjs"},sideEffects:!1,engines:{node:">=18.0.0"},scripts:{build:"tsup",clean:"git clean -xdf .turbo node_modules dist",format:'prettier --check "**/*.{ts,tsx}"',lint:"eslint .",prepublishOnly:"pnpm run build",typecheck:"tsc --noEmit"},exports:{".":{source:"./src/index.ts",types:"./dist/index.d.mts",import:"./dist/index.mjs"},"./provider":{source:"./src/components/PopmeltProvider.tsx",types:"./dist/index.d.mts",import:"./dist/index.mjs"},"./server":{source:"./src/server/index.ts",types:"./dist/server.d.mts",import:"./dist/server.mjs"},"./canvas":{source:"./src/canvas/index.ts",import:"./dist/canvas.mjs"},"./next":{source:"./src/plugins/next.ts",import:"./dist/plugin-next.mjs",default:"./dist/plugin-next.mjs"},"./vite":{source:"./src/plugins/vite.ts",types:"./dist/plugin-vite.d.mts",import:"./dist/plugin-vite.mjs",default:"./dist/plugin-vite.mjs"},"./astro":{source:"./src/plugins/astro.ts",types:"./dist/plugin-astro.d.mts",import:"./dist/plugin-astro.mjs",default:"./dist/plugin-astro.mjs"}},files:["dist","LICENSE","README.md"],dependencies:{"modern-screenshot":"4.4.39"},peerDependencies:{"lucide-react":">=0.400.0",react:">=18.0.0","react-dom":">=18.0.0"},peerDependenciesMeta:{},devDependencies:{"@types/react":"19.1.0","@types/react-dom":"19.1.2",eslint:"^9.24.0","lucide-react":"^0.487.0",prettier:"^3.5.3",react:"19.1.0","react-dom":"19.1.0",tsup:"^8.5.1",typescript:"^5.8.3"}};var ji=Hl.version;import{useCallback as sn,useEffect as In,useMemo as Ur,useRef as jt,useState as St}from"react";import{useCallback as zr,useRef as Vu}from"react";function Os(e,t,n,o){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!r||!i)return;let a=(r.x+i.x)/2,s=(r.y+i.y)/2,l=Math.abs(i.x-r.x)/2,c=Math.abs(i.y-r.y)/2;e.beginPath(),e.strokeStyle=n,e.lineWidth=o,e.ellipse(a,s,l,c,0,0,Math.PI*2),e.stroke()}function Hs(e,t,n,o){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!(!r||!i)){e.beginPath(),e.strokeStyle=n,e.lineWidth=o,e.lineCap="round",e.lineJoin="round",e.moveTo(r.x,r.y);for(let a=1;a<t.length-1;a++){let s=t[a],l=t[a+1];if(!s||!l)continue;let c=(s.x+l.x)/2,d=(s.y+l.y)/2;e.quadraticCurveTo(s.x,s.y,c,d)}e.lineTo(i.x,i.y),e.stroke()}}function Ns(e,t,n,o){if(t.length<2)return;let r=t[0],i=t[t.length-1];!r||!i||(e.beginPath(),e.strokeStyle=n,e.lineWidth=o,e.lineCap="round",e.moveTo(r.x,r.y),e.lineTo(i.x,i.y),e.stroke())}function zs(e,t,n,o){if(t.length<2)return;let r=t[0],i=t[t.length-1];if(!r||!i)return;let a=Math.min(r.x,i.x),s=Math.min(r.y,i.y),l=Math.abs(i.x-r.x),c=Math.abs(i.y-r.y);e.beginPath(),e.strokeStyle=n,e.lineWidth=o,e.lineCap="round",e.lineJoin="round",e.strokeRect(a,s,l,c)}var rn='"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace';function Gu(e,t,n){if(!t||e.measureText(t).width<=n)return[t];let o=t.split(/\s+/),r=[],i="";for(let a of o){let s=i?i+" "+a:a;i&&e.measureText(s).width>n?(r.push(i),i=a):i=s}return i&&r.push(i),r.length>0?r:[t]}function ci(e){let t=window.innerWidth-e-16;return Math.max(60,Math.min(400,t))}function Nl(e,t,n){let o=[];for(let r of t)o.push(...Gu(e,r,n));return o}function di(e,t,n){if(e.measureText(t).width<=n)return t;let o="\u2026";for(let r=t.length-1;r>0;r--){let i=t.slice(0,r)+o;if(e.measureText(i).width<=n)return i}return o}function Ju(e,t,n){if(e===void 0||t===void 0||n.avoidLeft===void 0&&n.avoidRight===void 0)return!0;let o=typeof window<"u"?window.innerWidth:9999,r=n.avoidLeft??0,i=n.avoidRight??o;return e+t>r&&e<i}function Fs(e,t,n,o,r){let i=typeof window<"u"?window.innerHeight:9999,a=0,s=i;n&&Ju(o,r,n)&&(a=n.avoidTop??a,s=n.avoidBottom??s);let l=Math.max(a,s-t);return Math.max(a,Math.min(e,l))}function $s(e,t=12,n,o){let r=t*1.4+8,i=e.y-4,a=e.x-4,s=Fs(i,r,n,a,o);return s===i?e:{...e,y:s+4}}function zl(e,t,n,o,r=12,i,a,s){if(!n)return;let l=r*1.4,c=n.replace(/\n/g," "),d=i!==void 0?i+". "+c:c;e.font=`${r}px ${rn}`,e.textBaseline="middle";let u=a!==void 0?Math.min(400,Math.max(60,window.innerWidth-a-16)):400,p=di(e,d,u),f=e.measureText(p).width,b=$s(t,r,s,f+8);e.fillStyle=o,e.fillRect(b.x-4,b.y-4,f+8,l+8),e.fillStyle="#ffffff",e.fillText(p,b.x,b.y+l/2)}var Fl=11,Ws=4,Yu=`600 ${Fl}px system-ui, -apple-system, sans-serif`;function js(e,t,n){return e.map(o=>({x:o.x-t,y:o.y-n}))}function Uu(e,t,n,o,r,i){let a=String(o);e.font=Yu;let l=e.measureText(a).width+Ws*2,c=Fl+Ws*2,d=t-l/2,u=n+i/2+2;e.fillStyle=r,e.fillRect(d,u,l,c),e.fillStyle="#ffffff",e.textBaseline="middle",e.fillText(a,d+Ws,u+c/2)}function Ku(e,t){if(e.points.length<2&&e.type!=="text")return null;switch(e.type){case"rectangle":case"freehand":{let n,o;if(e.type==="freehand")n=Math.min(...e.points.map(r=>r.x)),o=Math.max(...e.points.map(r=>r.y));else{let r=e.points[0],i=e.points[e.points.length-1];n=Math.min(r.x,i.x),o=Math.max(r.y,i.y)}return{x:n,y:o}}case"circle":{let n=e.points[0],o=e.points[e.points.length-1],r=Math.min(n.x,o.x),i=(Math.min(n.y,o.y)+Math.max(n.y,o.y))/2;return{x:r,y:i}}case"line":{let n=e.points[0],o=e.points[e.points.length-1],r=n.y>o.y?n:o;return{x:r.x,y:r.y}}default:return null}}function $l(){let e=Vu(null),t=zr(()=>{let s=e.current;if(!s)return;let l=s.getContext("2d");l&&l.clearRect(0,0,s.width,s.height)},[]),n=zr((s,l,c,d)=>{let u=e.current;if(!u)return;let p=u.getContext("2d");if(!p)return;let b=(s.status??(s.captured?"in_flight":"pending"))==="pending"||c?s.color:"#999999";switch(s.type){case"freehand":Hs(p,s.points,b,s.strokeWidth);break;case"line":Ns(p,s.points,b,s.strokeWidth);break;case"rectangle":zs(p,s.points,b,s.strokeWidth);break;case"circle":Os(p,s.points,b,s.strokeWidth);break;case"text":s.text&&s.points[0]&&zl(p,s.points[0],s.text,b,s.fontSize,l,s.points[0].x,d);break}},[]),o=zr((s,l,c,d)=>{let u=e.current;if(!u||s.length<2)return;let p=u.getContext("2d");if(p)switch(l){case"freehand":Hs(p,s,c,d);break;case"line":Ns(p,s,c,d);break;case"rectangle":zs(p,s,c,d);break;case"circle":Os(p,s,c,d);break}},[]),r=zr((s,l)=>{let c=e.current;if(!c||s.points.length<2)return;let d=c.getContext("2d");if(d){if(d.fillStyle="#ffffff",d.strokeStyle=s.color,d.lineWidth=1.5,s.type==="line"){let u=s.points[0],p=s.points[s.points.length-1];[u,p].forEach(f=>{d.beginPath(),d.arc(f.x,f.y,l/2,0,Math.PI*2),d.fill(),d.stroke()});return}if(s.type==="circle"){let u=s.points[0],p=s.points[s.points.length-1],f=Math.min(u.x,p.x),b=Math.max(u.x,p.x),C=Math.min(u.y,p.y),w=Math.max(u.y,p.y),M=(f+b)/2,L=(C+w)/2;[{x:M,y:C},{x:M,y:w},{x:f,y:L},{x:b,y:L}].forEach(R=>{d.beginPath(),d.rect(R.x-l/2,R.y-l/2,l,l),d.fill(),d.stroke()});return}if(s.type==="rectangle"||s.type==="freehand"){let u,p,f,b;if(s.type==="freehand")u=Math.min(...s.points.map(w=>w.x)),p=Math.max(...s.points.map(w=>w.x)),f=Math.min(...s.points.map(w=>w.y)),b=Math.max(...s.points.map(w=>w.y));else{let w=s.points[0],M=s.points[s.points.length-1];u=Math.min(w.x,M.x),p=Math.max(w.x,M.x),f=Math.min(w.y,M.y),b=Math.max(w.y,M.y)}[{x:u,y:f},{x:p,y:f},{x:u,y:b},{x:p,y:b}].forEach(w=>{d.beginPath(),d.rect(w.x-l/2,w.y-l/2,l,l),d.fill(),d.stroke()})}}},[]),i=zr((s,l,c,d,u,p,f,b=0,C=0,w,M,L)=>{if(t(),s.forEach(E=>{let R={...E,points:js(E.points,b,C)},v=w?.get(E.id),D=M?.has(E.id)??!1;n(R,v,D,L)}),l.length>0){let E=js(l,b,C);o(E,c,d,u)}if(p&&p.length>0&&f){let R=e.current?.getContext("2d");for(let v of p){let D=s.find(j=>j.id===v);if(D){let j={...D,points:js(D.points,b,C)};if(r(j,f),R&&D.type!=="text"&&w&&!(D.groupId&&s.some(T=>T.groupId===D.groupId&&T.type==="text"))){let T=w.get(D.id);if(T!==void 0){let N=Ku(j,f);if(N){let m=(D.status??(D.captured?"in_flight":"pending"))==="pending"?D.color:"#999999";Uu(R,N.x,N.y,T,m,f)}}}}}}},[t,n,o,r]),a=zr(()=>{let s=e.current;if(!s)return;let l=window.devicePixelRatio||1;s.width=window.innerWidth*l,s.height=window.innerHeight*l;let c=s.getContext("2d");c&&c.scale(l,l)},[]);return{canvasRef:e,clearCanvas:t,drawAnnotation:n,drawCurrentPath:o,redrawAll:i,resizeCanvas:a}}import{useEffect as Xu,useRef as qu}from"react";function Wl(){let e=qu({shift:!1,cmd:!1});return Xu(()=>{let t=r=>{r.key==="Shift"&&(e.current.shift=!0),(r.key==="Meta"||r.key==="Control")&&(e.current.cmd=!0)},n=r=>{r.key==="Shift"&&(e.current.shift=!1),(r.key==="Meta"||r.key==="Control")&&(e.current.cmd=!1)},o=()=>{e.current={shift:!1,cmd:!1}};return window.addEventListener("keydown",t,!0),window.addEventListener("keyup",n,!0),window.addEventListener("blur",o),()=>{window.removeEventListener("keydown",t,!0),window.removeEventListener("keyup",n,!0),window.removeEventListener("blur",o)}},[]),e}import{useEffect as Zu}from"react";function jl(e,t,n,o,r){Zu(()=>{let i=a=>{if(e){if(e.linkedSelector)return;a.preventDefault(),a.stopPropagation();let l=a.deltaY>0?-2:2;t(c=>c?{...c,fontSize:Math.max(12,Math.min(72,c.fontSize+l))}:null);return}if(!n)return;a.preventDefault();let s=o.find(l=>l.id===n);if(s&&s.type==="text"&&!s.linkedSelector){let l=s.fontSize||12,c=a.deltaY>0?-2:2;r({type:"UPDATE_TEXT_SIZE",payload:{id:n,fontSize:l+c}})}};return window.addEventListener("wheel",i,{passive:!1}),()=>{window.removeEventListener("wheel",i)}},[n,e,o,r,t])}import{useEffect as Js,useRef as Qu,useState as Vs}from"react";import{Fragment as ui,jsx as Kt,jsxs as $r}from"react/jsx-runtime";var Zo=22,pi=12,Fr=8,ep=3,tp=250,Gi=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],np=3e3;function op(e){let t=e?.current?.getBoundingClientRect();return!t||typeof window>"u"?{}:t.top<window.innerHeight/2?{avoidTop:t.bottom+Fr,avoidLeft:t.left-Fr,avoidRight:t.right+Fr}:{avoidBottom:t.top-Fr,avoidLeft:t.left-Fr,avoidRight:t.right+Fr}}function rp(e,t,n){if(n.avoidLeft===void 0&&n.avoidRight===void 0)return!0;let o=typeof window<"u"?window.innerWidth:9999,r=n.avoidLeft??0,i=n.avoidRight??o;return e+t>r&&e<i}function Gs(e,t,n){return rp(t,n,e)?e:{}}function ip(e,t,n){let o=n.avoidTop!==void 0?`${n.avoidTop}px`:"0px",r=n.avoidBottom!==void 0?`${n.avoidBottom}px`:"100vh";return`translate(min(0px, calc(100vw - ${e} - 100%)), min(max(0px, calc(${o} - ${t})), calc(${r} - ${t} - 100%)))`}function Gl(e,t,n){if(n.avoidTop===void 0&&n.avoidBottom===void 0)return e;let o=typeof window<"u"?window.innerHeight:9999,r=n.avoidTop??0,i=n.avoidBottom??o,a=Math.max(r,i-t);return Math.max(r,Math.min(e,a))}function sp({left:e,top:t,scrollX:n,scrollY:o,avoidTop:r,avoidBottom:i,style:a,children:s,...l}){let c=`calc(${e}px - var(--popmelt-scroll-x, ${n}px))`,d=`calc(${t}px - var(--popmelt-scroll-y, ${o}px))`,u=`calc(${e+pi}px - var(--popmelt-scroll-x, ${n}px))`,p=`calc(${t+pi}px - var(--popmelt-scroll-y, ${o}px))`;return Kt("div",{"data-devtools":"badge-hit-area",...l,style:{position:"fixed",left:0,top:0,padding:pi,...a,transform:`translate3d(${c}, ${d}, 0)`,willChange:"transform"},children:Kt("div",{style:{transform:ip(u,p,{avoidTop:r,avoidBottom:i})},children:s})})}function Jl({annotations:e,supersededAnnotations:t,inFlightIds:n,activeIds:o,queuePositions:r,scrollX:i,scrollY:a,annotationGroupMap:s,onViewThread:l,onSelectAnnotation:c,onHoverAnnotation:d,canvasRef:u,toolbarRef:p}){let f=Qu(null),[b,C]=Vs(0),[w,M]=Vs(()=>Math.floor(Math.random()*Gi.length)),L=!!(n&&n.size>0);Js(()=>{if(!L)return;let g=setInterval(()=>{C($=>($+1)%ep)},tp),m=setInterval(()=>{M($=>($+1)%Gi.length)},np);return()=>{clearInterval(g),clearInterval(m)}},[L]),Js(()=>{let g=f.current;if(!g)return;let m=null,$=()=>{m=null,g.style.setProperty("--popmelt-scroll-x",`${window.scrollX}px`),g.style.setProperty("--popmelt-scroll-y",`${window.scrollY}px`)},me=()=>{m===null&&(m=window.requestAnimationFrame($))};return $(),window.addEventListener("scroll",me,{passive:!0}),window.addEventListener("resize",me),()=>{window.removeEventListener("scroll",me),window.removeEventListener("resize",me),m!==null&&window.cancelAnimationFrame(m)}},[]);let E=[];for(let g of e){if(g.type!=="text"||!g.text||!g.points[0]||t.has(g))continue;let m=g.groupId?e.filter(te=>te.groupId===g.groupId):[g],$=g.status??"pending",me=m.reduce((te,Oe)=>te+(Oe.replyCount??0),0),ke=!!(n&&(n.has(g.id)||m.some(te=>n.has(te.id))))||g.status==="in_flight"||m.some(te=>te.status==="in_flight"),ue=m.some(te=>te.status==="resolved"&&(te.replyCount??0)>0||te.status==="needs_review"),Ee=m.some(te=>te.threadId);if(!ke&&$!=="resolved"&&$!=="needs_review"&&!ue&&!Ee)continue;let Te=g.threadId||m.find(te=>te.threadId)?.threadId,X=$==="needs_review"||m.some(te=>te.status==="needs_review"),_=$==="waiting_input"||m.some(te=>te.status==="waiting_input"),oe=g.points[0],ye=g.fontSize||12,ze=ye*1.4,Ye=s.get(g.id),re=g.text.replace(/\n/g," "),Ke=Ye!==void 0?Ye+". "+re:re,Ge=u?.current?.getContext("2d")??document.createElement("canvas").getContext("2d");if(!Ge)continue;Ge.font=`${ye}px ${rn}`;let we=oe.x-i,Be=ci(we),ut=di(Ge,Ke,Be),G=Ge.measureText(ut).width,ce=ke&&!!o&&!o.has(g.id)&&!m.some(te=>o.has(te.id));E.push({id:g.id,threadId:Te,linkedSelector:g.linkedSelector||m.find(te=>te.linkedSelector)?.linkedSelector,x:oe.x+G+4,y:oe.y-4,size:ze+8,color:g.color,isInFlight:ke,isQueued:ce,queuePosition:void 0,isNeedsReview:X,isQuestion:_,replyCount:me})}let R=E.filter(g=>g.isQueued);if(R.length>0&&R.forEach((g,m)=>{g.queuePosition=r?.get(g.id)??`(${m+1}/${R.length})`}),E.length===0)return null;let v=2,D=u?.current?.getContext("2d")??document.createElement("canvas").getContext("2d"),j=E.map(g=>{let m;g.isQueued?m=g.queuePosition?`queued ${g.queuePosition}`:"queued":g.isInFlight?m=Gi[w]??"thinking":g.isQuestion?m="? Question":g.replyCount>0?m=`${g.replyCount} ${g.replyCount===1?"reply":"replies"}`:m="View";let $=!g.isQueued,me=$?11:0,ke=$?4:0,ue=m.length*7.2;return D&&(D.font=`12px ${rn}`,ue=D.measureText(m).width),4+me+ke+ue+4}),J=op(p),T=[];for(let g=0;g<E.length;g++){let m=E[g].y-a,$=E[g].x-i,me=Gs(J,$,j[g]),ke=Gl(m,E[g].size,me),ue=ke+E[g].size,Ee=$;for(let Te=0;Te<g;Te++){let X=E[Te].y-a,_=Gs(J,T[Te],j[Te]),oe=Gl(X,E[Te].size,_),ye=oe+E[Te].size;if(!(ke<ye&&ue>oe))continue;let Ye=T[Te]+j[Te];Ee<Ye+v&&(Ee=Ye+v)}T.push(Ee)}let N={position:"fixed",inset:0,pointerEvents:"none",zIndex:9999,"--popmelt-scroll-x":`${i}px`,"--popmelt-scroll-y":`${a}px`};return Kt("div",{ref:f,"data-devtools":"annotation-badge-layer",style:N,children:E.map((g,m)=>{let $=!!g.threadId,me=Gs(J,T[m],j[m]);return Kt(sp,{left:T[m]+i-pi,top:g.y-pi,scrollX:i,scrollY:a,avoidTop:me.avoidTop,avoidBottom:me.avoidBottom,onMouseDown:$?ke=>ke.stopPropagation():void 0,onClick:$?ke=>{if(ke.stopPropagation(),c?.(g.id),l?.(g.threadId),g.linkedSelector)try{let ue=document.querySelector(g.linkedSelector);if(ue){let Ee=ue.getBoundingClientRect();(Ee.bottom<0||Ee.top>window.innerHeight)&&ue.scrollIntoView({behavior:"smooth",block:"center"})}}catch{}}:void 0,onMouseEnter:d?()=>d(g.id):void 0,onMouseLeave:d?()=>d(null):void 0,style:{pointerEvents:$?"auto":"none",cursor:$?"pointer":void 0,zIndex:9999},children:Kt("div",{"data-devtools":"annotation-badge",style:{height:g.size,display:"flex",alignItems:"center",backgroundColor:g.color,fontFamily:rn,fontSize:12,color:"#ffffff",userSelect:"none",padding:`0 ${4}px`,gap:4,whiteSpace:"nowrap"},children:g.isQueued?$r("span",{style:{opacity:.5,color:"inherit"},children:["queued",g.queuePosition?` ${g.queuePosition}`:""]}):g.isInFlight?$r(ui,{children:[Kt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:b===1?$r(ui,{children:[Kt("circle",{cx:"7",cy:"7",r:"2"}),Kt("circle",{cx:"17",cy:"7",r:"2"}),Kt("circle",{cx:"7",cy:"17",r:"2"}),Kt("circle",{cx:"17",cy:"17",r:"2"})]}):$r(ui,{children:[Kt("circle",{cx:"12",cy:"6",r:"2"}),Kt("circle",{cx:"6",cy:"12",r:"2"}),Kt("circle",{cx:"18",cy:"12",r:"2"}),Kt("circle",{cx:"12",cy:"18",r:"2"})]})}),Kt("span",{style:{opacity:.7,color:"inherit"},children:Gi[w]})]}):$r(ui,{children:[g.isQuestion||g.isNeedsReview?Kt("span",{style:{fontWeight:700,color:"inherit"},children:"?"}):Kt("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",strokeLinejoin:"round",children:Kt("polyline",{points:"4 12 10 18 20 6"})}),Kt("span",{style:{opacity:.7,color:"inherit"},children:g.isQuestion?"Question":g.replyCount>0?`${g.replyCount} ${g.replyCount===1?"reply":"replies"}`:"View"})]})})},g.id)})})}function Ys({inFlightSelectorColors:e,animated:t=!0}){let[n,o]=Vs([]);return Js(()=>{if(e.size===0){o([]);return}let r=null,i=()=>{let l=[];for(let[c,d]of e){let u=Tn(c);if(!u)continue;let p=u.getBoundingClientRect();l.push({selector:c,top:p.top,left:p.left,width:p.width,height:p.height,color:d})}o(l)},a=()=>{r&&cancelAnimationFrame(r),r=requestAnimationFrame(i)};i(),window.addEventListener("scroll",a,!0),window.addEventListener("resize",a,!0);let s=new MutationObserver(a);return s.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",a,!0),window.removeEventListener("resize",a,!0),s.disconnect(),r&&cancelAnimationFrame(r)}},[e]),n.length===0?null:$r(ui,{children:[t&&Kt("style",{children:"@keyframes popmelt-march { to { stroke-dashoffset: -6; } }"}),n.map(r=>Kt("div",{"data-devtools":"marching-ants",style:{position:"fixed",top:r.top,left:r.left,width:r.width,height:r.height,pointerEvents:"none",zIndex:9995,overflow:"visible"},children:Kt("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible"},children:Kt("rect",{x:"0.5",y:"0.5",width:Math.max(0,r.width-1),height:Math.max(0,r.height-1),fill:"none",stroke:r.color,strokeWidth:"1",strokeDasharray:"2 4",style:t?{animation:"popmelt-march 0.5s steps(2) infinite"}:void 0})})},r.selector))]})}function Ji(e){let t=new Set,n=new Map;for(let i of e){if(!i.linkedSelector)continue;let a=n.get(i.linkedSelector)||[];a.push(i),n.set(i.linkedSelector,a)}let o=new Set,r=new Set;for(let i of n.values()){if(i.length<=1){i[0]?.groupId&&r.add(i[0].groupId);continue}i.sort((s,l)=>l.timestamp-s.timestamp);let a=i[0];a.groupId&&r.add(a.groupId);for(let s=1;s<i.length;s++){let l=i[s];t.add(l),l.groupId&&o.add(l.groupId)}}for(let i of e)i.groupId&&o.has(i.groupId)&&!r.has(i.groupId)&&t.add(i);return t}import{useEffect as Vl,useLayoutEffect as ap,useState as Yl}from"react";import{jsx as Us,jsxs as Kl}from"react/jsx-runtime";function lp(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var Ul=["top-left","top-right","bottom-right","bottom-left"];function Xl({element:e,radius:t,accentColor:n,hoveredCorner:o,draggingCorner:r,cursorViewport:i}){let[a,s]=Yl(null),[l,c]=Yl(!1);if(Vl(()=>{let M=R=>{(R.key==="Meta"||R.key==="Control")&&c(!0)},L=R=>{(R.key==="Meta"||R.key==="Control")&&c(!1)},E=()=>c(!1);return window.addEventListener("keydown",M,!0),window.addEventListener("keyup",L,!0),window.addEventListener("blur",E),()=>{window.removeEventListener("keydown",M,!0),window.removeEventListener("keyup",L,!0),window.removeEventListener("blur",E)}},[]),Vl(()=>{if(!e){s(null);return}let M=()=>{s(e.getBoundingClientRect())};return M(),window.addEventListener("scroll",M,{passive:!0}),window.addEventListener("resize",M,{passive:!0}),()=>{window.removeEventListener("scroll",M),window.removeEventListener("resize",M)}},[e]),ap(()=>{e&&s(e.getBoundingClientRect())},[e,t["top-left"],t["top-right"],t["bottom-right"],t["bottom-left"]]),!a)return null;let d=a.width,u=a.height,p=lp(n,.2),f={"top-left":{x:0,y:t["top-left"]},"top-right":{x:d,y:t["top-right"]},"bottom-right":{x:d,y:u-t["bottom-right"]},"bottom-left":{x:0,y:u-t["bottom-left"]}},b=new Set,C=r??o;if(C)if(l)b.add(C);else for(let M of Ul)b.add(M);let w={position:"fixed",top:a.top,left:a.left,width:d,height:u,pointerEvents:"none",zIndex:9996,overflow:"visible"};return Kl("div",{"data-devtools":"border-radius-handles",style:w,children:[Kl("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${d} ${u}`,children:[Us("rect",{x:"0.5",y:"0.5",width:Math.max(0,d-1),height:Math.max(0,u-1),fill:"none",stroke:p,strokeWidth:"1"}),Ul.map(M=>{let L=f[M],E=b.has(M);return Us("circle",{cx:L.x,cy:L.y,r:M===(r??o)?3:2.5,fill:n,stroke:"#ffffff",strokeWidth:M===(r??o)?4:2,paintOrder:"stroke"},M)})]}),i&&C&&(()=>{let M=Math.round(t[C]);return Us("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:M})})()]})}import{useEffect as cp,useState as dp}from"react";function hr(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);if(n)return`oklch(${n[1]} / ${t})`;let o=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);if(o){let r=parseInt(o[1],16),i=parseInt(o[2],16),a=parseInt(o[3],16);return`rgba(${r}, ${i}, ${a}, ${t})`}return`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}import{Fragment as up,jsx as Ks,jsxs as Wr}from"react/jsx-runtime";function wo({element:e,isSelected:t=!1,elementInfo:n,color:o="#3b82f6",annotationNumber:r,changeCount:i,hideTooltip:a=!1}){let[s,l]=dp(null);if(cp(()=>{if(!e){l(null);return}let v=()=>{let D=e.getBoundingClientRect();l(D)};return v(),window.addEventListener("scroll",v,{passive:!0}),window.addEventListener("resize",v,{passive:!0}),()=>{window.removeEventListener("scroll",v),window.removeEventListener("resize",v)}},[e]),!s||!e)return null;let c={position:"fixed",top:s.top,left:s.left,width:s.width,height:s.height,pointerEvents:"none",zIndex:9996,overflow:"visible"},d=e.tagName.toLowerCase(),u=e.id?`#${e.id}`:"",p=e.classList.length>0?"."+Array.from(e.classList).slice(0,2).join("."):"",f=n?.reactComponent,b=f?`<${f}> ${d}${u}${p}`:`${d}${u}${p}`,C=22,w=s.height>=window.innerHeight,M=w?0:s.top>=C?s.top-C:s.bottom,L=w?{position:"absolute",top:8,left:8,zIndex:9997,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,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400}:{position:"fixed",top:M,left:s.left,zIndex:9997,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,pointerEvents:"none",whiteSpace:"nowrap",maxWidth:400},R=!a&&Wr("div",{"data-devtools":"tooltip",style:L,children:[r!==void 0&&Wr("span",{children:[r,"."]}),Ks("span",{style:{overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0},children:b}),i!==void 0&&i>0&&Wr("span",{style:{opacity:.8},children:["(",i," ",i===1?"change":"changes",")"]})]});return Wr(up,{children:[Wr("div",{"data-devtools":"highlight",style:c,children:[Wr("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},children:[Ks("rect",{x:"2.5",y:"2.5",width:Math.max(0,s.width-5),height:Math.max(0,s.height-5),fill:hr(o,.05),stroke:"none"}),Ks("rect",{x:"0.5",y:"0.5",width:Math.max(0,s.width-1),height:Math.max(0,s.height-1),fill:"none",stroke:o,strokeWidth:"1",...!t&&{strokeDasharray:"2 4"}})]}),w&&R]}),!w&&R]})}import{useEffect as ql,useLayoutEffect as pp,useState as Xs}from"react";import{jsx as Ho,jsxs as Zs}from"react/jsx-runtime";function qs(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function Qs({element:e,gap:t,accentColor:n,hoveredAxis:o,draggingAxis:r,cursorViewport:i,isAutoGap:a=!1,refreshKey:s=0}){let[l,c]=Xs(null),[d,u]=Xs([]),[p,f]=Xs(!1);if(ql(()=>{let J=g=>{(g.key==="Meta"||g.key==="Control")&&f(!0)},T=g=>{(g.key==="Meta"||g.key==="Control")&&f(!1)},N=()=>f(!1);return window.addEventListener("keydown",J,!0),window.addEventListener("keyup",T,!0),window.addEventListener("blur",N),()=>{window.removeEventListener("keydown",J,!0),window.removeEventListener("keyup",T,!0),window.removeEventListener("blur",N)}},[]),ql(()=>{if(!e){c(null),u([]);return}let J=()=>{c(e.getBoundingClientRect()),u(Oo(e))};return J(),window.addEventListener("scroll",J,{passive:!0}),window.addEventListener("resize",J,{passive:!0}),()=>{window.removeEventListener("scroll",J),window.removeEventListener("resize",J)}},[e]),pp(()=>{e&&(c(e.getBoundingClientRect()),u(Oo(e)))},[e,t.row,t.column,s]),!l||d.length===0)return null;let b=l.width,C=l.height,w="pm-gap-stripe-pattern",M=qs(n,.25),L=qs(n,.1),E=qs(n,.2),R=8,v=2,D={position:"fixed",top:l.top,left:l.left,width:b,height:C,pointerEvents:"none",zIndex:9996,overflow:"visible"},j=r??o;return Zs("div",{"data-devtools":"gap-handles",style:D,children:[Zs("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${b} ${C}`,children:[Ho("defs",{children:Ho("pattern",{id:w,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Ho("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:M,strokeWidth:"1.5"})})}),Ho("rect",{x:"0.5",y:"0.5",width:Math.max(0,b-1),height:Math.max(0,C-1),fill:"none",stroke:E,strokeWidth:"1"}),d.map((J,T)=>{let N=J.x-l.left,g=J.y-l.top,m=J.w,$=J.h,me=p?J.axis===j:!0;return(J.axis==="row"?t.row:t.column)===0?null:Zs("g",{opacity:me?1:.6,children:[Ho("rect",{x:N,y:g,width:m,height:$,fill:L}),Ho("rect",{x:N,y:g,width:m,height:$,fill:`url(#${w})`})]},T)}),j&&(()=>{let J=d.filter(oe=>oe.axis===j);if(J.length===0)return null;let T=J[0];if(i&&J.length>1){let oe=1/0;for(let ye of J){let ze=ye.x+ye.w/2,Ye=ye.y+ye.h/2,re=Math.abs(i.x-ze)+Math.abs(i.y-Ye);re<oe&&(oe=re,T=ye)}}let N=T.x-l.left,g=T.y-l.top,m=T.w,$=T.h,me=N+m/2,ke=g+$/2;if(a)return Ho("circle",{cx:me,cy:ke,r:1.5,fill:n,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"});let ue=j==="column",Ee=ue?v:R,Te=ue?R:v,X=me-Ee/2,_=ke-Te/2;return Ho("rect",{x:X,y:_,width:Ee,height:Te,fill:n,stroke:"#ffffff",strokeWidth:4,paintOrder:"stroke"})})()]}),i&&j&&(()=>{let J=a?"auto":String(Math.round(j==="row"?t.row:t.column));return Ho("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:J})})()]})}import{useCallback as yp,useEffect as bp,useState as vp}from"react";import{useEffect as fp,useState as Zl}from"react";var gp=3,mp=250,ea=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],hp=3e3;function Ql(e){let[t,n]=Zl(0),[o,r]=Zl(()=>Math.floor(Math.random()*ea.length));return fp(()=>{if(!e)return;let i=setInterval(()=>n(s=>(s+1)%gp),mp),a=setInterval(()=>r(s=>(s+1)%ea.length),hp);return()=>{clearInterval(i),clearInterval(a)}},[e]),{charIndex:t,word:ea[o]}}import{Fragment as ta,jsx as zn,jsxs as jr}from"react/jsx-runtime";function xp(e){let{element:t}=e,n=t.tagName,o=t.id?`#${t.id}`:"",r=t.className?"."+t.className.split(" ").slice(0,2).join("."):"",i=t.reactComponent;return i?`<${i}> ${n}${o}${r}`:`${n}${o}${r}`}var ec=22,fi=12,Vi=8;function Sp(e,t,n){if(n.avoidLeft===void 0&&n.avoidRight===void 0)return!0;let o=typeof window<"u"?window.innerWidth:9999,r=n.avoidLeft??0,i=n.avoidRight??o;return e+t>r&&e<i}function wp(e,t,n){return Sp(t,n,e)?e:{}}function Cp(e){let t=`(${e.changeCount} ${e.changeCount===1?"change":"changes"})`;return Math.min(400,44+e.label.length*7.2+t.length*7.2)}function Ep(e,t,n,o){let r=n!==void 0?`${n}px`:"0px",i=o!==void 0?`${o}px`:"100vh";return`translate(min(0px, calc(100vw - max(0px, ${e}px) - 100%)), min(max(0px, calc(${r} - max(0px, ${t}px))), calc(${i} - max(0px, ${t}px) - 100%)))`}function kp({left:e,top:t,avoidTop:n,avoidBottom:o,style:r,children:i,...a}){let s=e+fi,l=t+fi;return zn("div",{"data-devtools":"badge-hit-area",...a,style:{position:"fixed",left:`max(0px, ${e}px)`,top:`max(0px, ${t}px)`,padding:fi,...r},children:zn("div",{style:{transform:Ep(s,l,n,o)},children:i})})}function tc({styleModifications:e,isInspecting:t,accentColor:n,annotationGroupCount:o,dispatch:r,inFlightSelectors:i,toolbarRef:a,onHoverSelector:s}){let[l,c]=vp([]),d=i&&i.size>0,{charIndex:u,word:p}=Ql(!!d);bp(()=>{if(t){c([]);return}let E=null,R=()=>{let j=[];e.forEach((J,T)=>{let N=Tn(J.selector);if(!N)return;let g=N.getBoundingClientRect();j.push({selector:J.selector,modIndex:T,top:g.top>=ec?g.top-ec:g.bottom,left:g.left,label:xp(J),changeCount:J.changes.length,annotationNumber:o+T+1})}),c(j)},v=()=>{E&&cancelAnimationFrame(E),E=requestAnimationFrame(R)};R(),window.addEventListener("scroll",v,!0),window.addEventListener("resize",v,!0);let D=new MutationObserver(v);return D.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),window.addEventListener("load",v),document.fonts.ready.then(v),()=>{window.removeEventListener("scroll",v,!0),window.removeEventListener("resize",v,!0),window.removeEventListener("load",v),D.disconnect(),E&&cancelAnimationFrame(E)}},[e,t,o]);let f=yp(E=>{let R=e[E];if(!R)return;let v=Tn(R.selector);v&&(r({type:"SELECT_ANNOTATION",payload:{id:null}}),r({type:"SET_TOOL",payload:"inspector"}),r({type:"SELECT_ELEMENT",payload:{el:v,info:R.element}}))},[e,r]);if(l.length===0)return null;let b=a?.current?.getBoundingClientRect(),C=b?b.top<window.innerHeight/2:!1,w=b?{avoidTop:C?b.bottom+Vi:void 0,avoidBottom:C?void 0:b.top-Vi,avoidLeft:b.left-Vi,avoidRight:b.right+Vi}:{},M={display:"flex",alignItems:"center",gap:6,backgroundColor:n,color:"#fff",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',padding:"4px 8px",borderRadius:0,whiteSpace:"nowrap",maxWidth:400},L={overflow:"hidden",textOverflow:"ellipsis",flex:1,minWidth:0};return zn(ta,{children:l.map(E=>{let R=i?.has(E.selector),v=wp(w,E.left,Cp(E));return zn(kp,{left:E.left-fi,top:E.top-fi,avoidTop:v.avoidTop,avoidBottom:v.avoidBottom,onClick:()=>f(E.modIndex),onMouseEnter:s?()=>s(E.selector):void 0,onMouseLeave:s?()=>s(null):void 0,style:{zIndex:1e4,cursor:"pointer",pointerEvents:"auto"},children:jr("div",{"data-devtools":"badge",style:{...M,backgroundColor:R?"#999999":n},children:[jr("span",{children:[E.annotationNumber,"."]}),zn("span",{style:L,children:E.label}),jr("span",{style:{opacity:.8},children:["(",E.changeCount," ",E.changeCount===1?"change":"changes",")"]}),R&&jr("span",{style:{opacity:.8,marginLeft:4,display:"inline-flex",alignItems:"center",gap:4},children:[zn("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:"currentColor",style:{verticalAlign:"middle"},children:u===1?jr(ta,{children:[zn("circle",{cx:"7",cy:"7",r:"2"}),zn("circle",{cx:"17",cy:"7",r:"2"}),zn("circle",{cx:"7",cy:"17",r:"2"}),zn("circle",{cx:"17",cy:"17",r:"2"})]}):jr(ta,{children:[zn("circle",{cx:"12",cy:"6",r:"2"}),zn("circle",{cx:"6",cy:"12",r:"2"}),zn("circle",{cx:"18",cy:"12",r:"2"}),zn("circle",{cx:"12",cy:"18",r:"2"})]})}),p]})]})},E.selector)})})}import{useEffect as Tp,useState as Ip}from"react";import{Fragment as Rp,jsx as nc}from"react/jsx-runtime";function Mp(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function oc({styleModifications:e,accentColor:t}){let[n,o]=Ip([]);if(Tp(()=>{let i=null,a=()=>{let c=[];for(let d of e){let u=Tn(d.selector);if(!u)continue;let p=u.getBoundingClientRect();if(p.width===0&&p.height===0)continue;let f=mr(u);c.push({selector:d.selector,top:p.top,left:p.left,width:p.width,height:p.height,borderRadius:`${f["top-left"]}px ${f["top-right"]}px ${f["bottom-right"]}px ${f["bottom-left"]}px`})}o(c)},s=()=>{i&&cancelAnimationFrame(i),i=requestAnimationFrame(a)};a(),window.addEventListener("scroll",s,{passive:!0}),window.addEventListener("resize",s,{passive:!0});let l=new MutationObserver(s);return l.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",s),window.removeEventListener("resize",s),l.disconnect(),i&&cancelAnimationFrame(i)}},[e]),n.length===0)return null;let r=Mp(t,.2);return nc(Rp,{children:n.map(i=>{let a={position:"fixed",top:i.top,left:i.left,width:i.width,height:i.height,pointerEvents:"none",zIndex:9995,border:`1px solid ${r}`,borderRadius:i.borderRadius,boxSizing:"border-box"};return nc("div",{"data-devtools":"mod-border",style:a},i.selector)})})}import{useEffect as rc,useLayoutEffect as Ap,useState as ic}from"react";import{jsx as Qo,jsxs as oa}from"react/jsx-runtime";function na(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}var Lp={top:"bottom",bottom:"top",left:"right",right:"left"};function ra({element:e,padding:t,accentColor:n,hoveredSide:o,draggingSide:r,cursorViewport:i,refreshKey:a}){let[s,l]=ic(null),[c,d]=ic(!1);if(rc(()=>{let m=ke=>{(ke.key==="Meta"||ke.key==="Control")&&d(!0)},$=ke=>{(ke.key==="Meta"||ke.key==="Control")&&d(!1)},me=()=>d(!1);return window.addEventListener("keydown",m,!0),window.addEventListener("keyup",$,!0),window.addEventListener("blur",me),()=>{window.removeEventListener("keydown",m,!0),window.removeEventListener("keyup",$,!0),window.removeEventListener("blur",me)}},[]),rc(()=>{if(!e){l(null);return}let m=()=>{l(e.getBoundingClientRect())};return m(),window.addEventListener("scroll",m,{passive:!0}),window.addEventListener("resize",m,{passive:!0}),()=>{window.removeEventListener("scroll",m),window.removeEventListener("resize",m)}},[e]),Ap(()=>{e&&l(e.getBoundingClientRect())},[e,t.top,t.right,t.bottom,t.left,a]),!s)return null;let u=s.width,p=s.height,{top:f,right:b,bottom:C,left:w}=t,M="pm-stripe-pattern",L=na(n,.25),E=na(n,.1),R=na(n,.2),v=8,D=2,j={position:"fixed",top:s.top,left:s.left,width:u,height:p,pointerEvents:"none",zIndex:9996,overflow:"visible"},J=["top","right","bottom","left"],T={top:`0,0 ${u},0 ${u-b},${f} ${w},${f}`,right:`${u},0 ${u},${p} ${u-b},${p-C} ${u-b},${f}`,bottom:`0,${p} ${w},${p-C} ${u-b},${p-C} ${u},${p}`,left:`0,0 ${w},${f} ${w},${p-C} 0,${p}`},N={top:{x:u/2-v/2,y:f/2-D/2,w:v,h:D},bottom:{x:u/2-v/2,y:p-C/2-D/2,w:v,h:D},left:{x:w/2-D/2,y:p/2-v/2,w:D,h:v},right:{x:u-b/2-D/2,y:p/2-v/2,w:D,h:v}},g=new Set;return r?g.add(r):o&&(g.add(o),c||g.add(Lp[o])),oa("div",{"data-devtools":"padding-handles",style:j,children:[oa("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${u} ${p}`,children:[Qo("defs",{children:Qo("pattern",{id:M,patternUnits:"userSpaceOnUse",width:"4",height:"4",patternTransform:"rotate(45)",children:Qo("line",{x1:"0",y1:"0",x2:"0",y2:"4",stroke:L,strokeWidth:"1.5"})})}),Qo("rect",{x:"0.5",y:"0.5",width:Math.max(0,u-1),height:Math.max(0,p-1),fill:"none",stroke:R,strokeWidth:"1"}),J.map(m=>{if(t[m]<=0)return null;let me=g.has(m);return oa("g",{opacity:me?1:.6,children:[Qo("polygon",{points:T[m],fill:E}),Qo("polygon",{points:T[m],fill:`url(#${M})`})]},m)}),J.map(m=>{let $=N[m],me=g.has(m);return Qo("rect",{x:$.x,y:$.y,width:$.w,height:$.h,fill:n,stroke:"#ffffff",strokeWidth:me?4:2,paintOrder:"stroke"},`handle-${m}`)})]}),i&&(o||r)&&(()=>{let $=Math.round(t[r??o]);return Qo("div",{style:{position:"fixed",left:i.x+8,top:i.y-28,background:n,color:"#fff",fontSize:11,fontWeight:600,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1,padding:"4px 4px",borderRadius:0,whiteSpace:"nowrap",pointerEvents:"none",zIndex:9997},children:$})})()]})}import{useCallback as Co,useEffect as no,useMemo as es,useRef as $n,useState as xn}from"react";import{Check as Qi,ChevronDown as pa,MoveHorizontal as yc,Shrink as nf}from"lucide-react";var Pp="data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMic+PGRlZnM+PHBhdHRlcm4gaWQ9J2QnIHdpZHRoPSc0JyBoZWlnaHQ9JzQnIHBhdHRlcm5Vbml0cz0ndXNlclNwYWNlT25Vc2UnPjxwYXRoIGQ9J00tMSwxIGwyLC0yIE0wLDQgbDQsLTQgTTMsNSBsMiwtMicgc3Ryb2tlPSdibGFjaycgc3Ryb2tlLXdpZHRoPScuNScvPjwvcGF0dGVybj48L2RlZnM+PHJlY3Qgd2lkdGg9JzEyJyBoZWlnaHQ9JzEyJyBmaWxsPSd1cmwoI2QpJy8+PC9zdmc+",Gr={borderWidth:3,borderStyle:"solid",borderImage:`url("${Pp}") 4 / 1.9 / 0 round`};function Yi({color:e="rgb(0,0,0)",animated:t=!1}={}){let n=`<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='${e}' stroke-width='.75'/></svg>`;return{position:"absolute",inset:-3,padding:5,backgroundImage:`url("data:image/svg+xml,${encodeURIComponent(n)}")`,backgroundSize:"5px 5px",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",maskComposite:"exclude",pointerEvents:"none",...t?{animation:"popmelt-border-march 0.8s linear infinite"}:{}}}var Ui={"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 Jr(e){return Ui[e]?.[0]??"px"}function er(e){let t=e.match(/^([\d.-]+)(.*)$/);return t?{num:parseFloat(t[1]),unit:t[2]||""}:{num:0,unit:""}}function Ki(e,t,n,o){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 a=parseFloat(r);if(!isNaN(a)){if(o){let{unit:s}=er(n);return`${a}${s||Jr(t)}`}return`${a}${Jr(t)}`}return r}function ia(e,t){if(!t||t==="px")return e;if(t==="rem"){let n=parseFloat(getComputedStyle(document.documentElement).fontSize)||16;return Math.round(e/n*1e3)/1e3}return e}import{useCallback as Bp,useEffect as Dp,useRef as sc,useState as _p}from"react";import{Plus as ac,X as Op}from"lucide-react";import{jsx as Fn,jsxs as yr}from"react/jsx-runtime";var Xi=[{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 Hp(e){if(!e||e==="none")return[];let t=[],n=/([\w-]+)\(([^)]+)\)/g,o;for(;(o=n.exec(e))!==null;){let r=o[1],i=o[2],a=parseFloat(i);isNaN(a)||t.push({name:r,value:a})}return t}function sa(e){return e.length===0?"none":e.map(t=>{let o=Xi.find(r=>r.name===t.name)?.unit??"";return`${t.name}(${t.value}${o})`}).join(" ")}function lc({value:e,onChange:t,accentColor:n,modified:o,panelContentRef:r}){let i=Hp(e),[a,s]=_p(!1),l=sc(null),c=sc(null);Dp(()=>{if(!a)return;let E=R=>{l.current&&!R.composedPath().includes(l.current)&&s(!1)};return document.addEventListener("mousedown",E,!0),()=>document.removeEventListener("mousedown",E,!0)},[a]);let d=Xi.filter(E=>!i.some(R=>R.name===E.name)),u=E=>{let R=[...i,{name:E.name,value:E.defaultValue}];t(sa(R)),s(!1)},p=E=>{let R=i.filter((v,D)=>D!==E);t(sa(R))},f=(E,R)=>{let v=i.map((D,j)=>j===E?{...D,value:R}:D);t(sa(v))},b={width:"100%",padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"none",borderRadius:2,outline:"none",backgroundColor:"transparent"},C=Bp(E=>{if(!c.current)return{position:"fixed",top:0,left:0};let R=c.current.getBoundingClientRect(),v=r?.current?.getBoundingClientRect(),D=E*24+8;return{position:"fixed",...window.innerHeight-R.bottom<D?{bottom:window.innerHeight-R.top+2}:{top:R.bottom+2},left:v?v.left+4:R.left,width:v?v.width-8:140,zIndex:10001}},[r]),w={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)"},M={display:"block",width:"100%",padding:"4px 10px",border:"none",backgroundColor:"transparent",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#334155",cursor:"pointer",textAlign:"left"},L=E=>Fn("div",{ref:l,style:{...C(E.length),...w},children:E.map(R=>Fn("button",{type:"button",onClick:()=>u(R),style:M,onMouseEnter:v=>{v.currentTarget.style.backgroundColor="rgba(0,0,0,0.05)"},onMouseLeave:v=>{v.currentTarget.style.backgroundColor="transparent"},children:R.label},R.name))});return i.length===0?yr("div",{children:[yr("div",{style:{display:"flex",alignItems:"center",gap:4},children:[Fn(No,{modified:!1,children:Fn("input",{type:"text",value:"",placeholder:"\u2014",readOnly:!0,style:{...b,color:"#999",cursor:"default"}})}),Fn("button",{ref:c,type:"button",onClick:()=>s(!a),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:20,padding:0,border:"none",borderRadius:2,backgroundColor:"transparent",color:"#94a3b8",cursor:"pointer",flexShrink:0},children:Fn(ac,{size:12})})]}),a&&L(Xi)]}):yr("div",{style:{display:"flex",flexDirection:"column",gap:4,position:"relative"},children:[i.map((E,R)=>{let v=Xi.find(D=>D.name===E.name);return v?yr("div",{style:{display:"flex",alignItems:"center",gap:4},children:[Fn("span",{style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:o?n:"#94a3b8",fontWeight:o?600:400,width:56,flexShrink:0,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},children:v.label}),Fn(No,{modified:o,children:yr("div",{style:{display:"flex",alignItems:"center",gap:4,padding:"0 4px"},children:[Fn("input",{type:"range",min:v.min,max:v.max,step:v.step,value:E.value,onChange:D=>f(R,parseFloat(D.target.value)),style:{flex:1,height:2,appearance:"none",WebkitAppearance:"none",background:`linear-gradient(to right, ${n} ${(E.value-v.min)/(v.max-v.min)*100}%, rgba(0,0,0,0.1) ${(E.value-v.min)/(v.max-v.min)*100}%)`,borderRadius:1,outline:"none",cursor:"pointer"}}),Fn("input",{type:"number",min:v.min,max:v.max,step:v.step,value:v.unit==="px"||v.unit==="deg"?Math.round(E.value):Math.round(E.value*100)/100,onChange:D=>f(R,parseFloat(D.target.value)||0),style:{...b,width:44,padding:"2px 4px",textAlign:"right",flexShrink:0}}),v.unit&&Fn("span",{style:{fontSize:9,color:"#94a3b8",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',flexShrink:0,width:16},children:v.unit})]})}),Fn("button",{type:"button",onClick:()=>p(R),style:{display:"flex",alignItems:"center",justifyContent:"center",width:16,height:16,padding:0,border:"none",borderRadius:2,backgroundColor:"transparent",color:"#94a3b8",cursor:"pointer",flexShrink:0},children:Fn(Op,{size:10})})]},E.name):null}),d.length>0&&yr("div",{children:[yr("button",{ref:c,type:"button",onClick:()=>s(!a),style:{display:"flex",alignItems:"center",gap:4,padding:"2px 4px",border:"none",borderRadius:2,backgroundColor:"transparent",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#94a3b8",cursor:"pointer"},children:[Fn(ac,{size:10}),"Add filter"]}),a&&L(d)]})]})}import{useCallback as co,useEffect as $p,useRef as qi,useState as cc}from"react";import{AlignHorizontalSpaceAround as Wp,AlignVerticalSpaceAround as jp,Columns3 as Gp,Grid2x2 as Jp,RectangleHorizontal as Vp,Rows3 as Yp,UnfoldHorizontal as dc,UnfoldVertical as uc}from"lucide-react";import{useCallback as Np,useEffect as zp,useRef as gi}from"react";import{jsx as Fp}from"react/jsx-runtime";var aa=[0,1,2,4,8,12,16,20,24,28,32];function Vr({value:e,onChange:t,onPreview:n,onScrubEnd:o,onReset:r,isModified:i,accentColor:a,defaultUnit:s="rem",snapSteps:l,color:c,style:d,children:u}){let p=gi(null),f=gi(null),b=gi(r),C=gi(i),w=gi(!1);b.current=r,C.current=i,zp(()=>{let L=R=>{let v=f.current;if(!v)return;v.hasMoved=!0,w.current=R.shiftKey;let D=v.unit==="rem"||v.unit==="em"?.1:1;v.accum+=R.movementX*D;let j=Math.max(0,Math.round((v.startValue+v.accum)*10)/10);if(R.shiftKey&&l){let J=v.unit==="rem"||v.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,T=v.unit==="rem"||v.unit==="em"?j*J:j,N=l[l.length-1];for(let g=0;g<l.length-1;g++){let m=l[g],$=l[g+1];if(T<=(m+$)/2){N=m;break}if(T<$){N=$;break}}T>l[l.length-1]&&(N=Math.round(T/8)*8),j=v.unit==="rem"||v.unit==="em"?Math.round(N/J*1e3)/1e3:N}n?.(`${j}${v.unit}`)},E=()=>{let R=f.current;if(!R)return;let v=Math.max(0,Math.round((R.startValue+R.accum)*10)/10);if(w.current&&l){let j=R.unit==="rem"||R.unit==="em"?parseFloat(getComputedStyle(document.documentElement).fontSize)||16:1,J=R.unit==="rem"||R.unit==="em"?v*j:v,T=l[l.length-1];for(let N=0;N<l.length-1;N++){let g=l[N],m=l[N+1];if(J<=(g+m)/2){T=g;break}if(J<m){T=m;break}}J>l[l.length-1]&&(T=Math.round(J/8)*8),v=R.unit==="rem"||R.unit==="em"?Math.round(T/j*1e3)/1e3:T}let D=R.hasMoved&&v!==R.startValue;f.current=null,document.exitPointerLock(),D?t(`${v}${R.unit}`):R.hasMoved?n?.(`${R.startValue}${R.unit}`):C.current&&b.current&&b.current(),o?.()};return document.addEventListener("mousemove",L),document.addEventListener("mouseup",E),()=>{document.removeEventListener("mousemove",L),document.removeEventListener("mouseup",E)}},[t,n,o]);let M=Np(L=>{if(L.button!==0)return;L.preventDefault();let E=er(e),R=E.unit&&E.unit!=="px"?E.unit:s;f.current={startValue:E.num,unit:R,accum:0,hasMoved:!1},p.current?.requestPointerLock()},[e,s]);return Fp("span",{ref:p,onMouseDown:M,title:i?"Click to reset \xB7 Drag to scrub":"Drag to scrub",style:{color:i?a||"#3b82f6":c||"#999",padding:"0 4px",display:"flex",alignItems:"center",cursor:"ew-resize",...d},children:u})}import{Fragment as la,jsx as _e,jsxs as gn}from"react/jsx-runtime";function Up({gridCols:e,gridRows:t,gridModified:n,accentColor:o,onColsChange:r,onRowsChange:i}){return _e(Yn,{style:{width:100},children:gn("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",padding:"8px 4px"},children:[_e("input",{type:"number",min:1,max:12,value:e,onChange:a=>r(parseInt(a.target.value)||1),style:{...vn,width:32,textAlign:"center",padding:2}}),_e("span",{style:{fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:n?o:"#999",fontWeight:n?600:400,fontSize:11,margin:"0 4px"},children:"\xD7"}),_e("input",{type:"number",min:1,max:12,value:t,onChange:a=>i(parseInt(a.target.value)||1),style:{...vn,width:32,textAlign:"center",padding:2}})]})})}function pc({element:e,getValue:t,getOriginalValue:n,handleChange:o,isModified:r,onResetProperty:i,isCollapsed:a,onToggle:s,sectionHeaderStyle:l,activeDropdown:c,onDropdownChange:d,panelContentRef:u,accentColor:p,onFieldHover:f,preferredUnit:b,onUnitCycle:C}){let w=d,M=t("display"),L=t("flex-direction"),E=fc(M,L),R=M==="flex"||M==="inline-flex",v=M==="grid",D=R||v,j=L==="column"||L==="column-reverse",J=t("width"),T=t("height"),N=r("width")?J:Ni(e,"width"),g=r("height")?T:Ni(e,"height"),m=ca(J,N),$=ca(T,g),me=t("min-width"),ke=t("max-width"),ue=t("min-height"),Ee=t("max-height"),Te=Yr(t("padding")),X=t("gap"),_=t("row-gap"),oe=t("column-gap"),ye=t("grid-template-columns"),ze=t("grid-template-rows"),Ye=t("overflow"),re=ye.split(/\s+/).filter(Y=>Y&&Y!=="none").length||1,Ke=ze.split(/\s+/).filter(Y=>Y&&Y!=="none").length||1,[Ge,we]=cc(!1),Be=c!==null,ut=Be||Ge,G=Be?.3:Ge?.65:1,ce=({mode:Y,icon:Me,active:qe})=>_e("button",{type:"button",onClick:()=>gc(Y,o),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:qe?hr(p,.15):"transparent",color:qe?p:"#64748b",cursor:"pointer",fontSize:14},children:Me}),te=(Y,Me,qe)=>{qe==="fixed"?o(Y,Me):o(Y,Zi(qe,Me))},Oe=Y=>{let Me=Yr(t("padding")),qe=Y||"0";o("padding",`${Me.top} ${qe} ${Me.bottom} ${qe}`)},st=Y=>{let Me=Yr(t("padding")),qe=Y||"0";o("padding",`${qe} ${Me.right} ${qe} ${Me.left}`)},[Pe,nt]=cc({}),lt=co((Y,Me)=>qe=>{Me(qe),nt(kt=>({...kt,[Y]:qe}))},[]),Je=co(Y=>{nt(Me=>{let qe={...Me};return delete qe[Y],qe})},[]),yt=co(Y=>{let Me=Yr(t("padding"));et(e,"padding",`${Me.top} ${Y} ${Me.bottom} ${Y}`)},[e,t]),Xt=co(Y=>{let Me=Yr(t("padding"));et(e,"padding",`${Y} ${Me.right} ${Y} ${Me.left}`)},[e,t]),Ht=co(Y=>Me=>{et(e,Y,Me)},[e]),tt=j?"row":"column",Ve=tt==="row"?"row-gap":"column-gap",Yt=Ve==="row-gap"?_||X:oe||X,Xe=r(Ve)||r("gap"),Et=co(()=>{let Me=Oo(e).find(kt=>kt.axis===tt);if(Me)return tt==="row"?Me.h:Me.w;let qe=gr(e);return tt==="row"?qe.row:qe.column},[e,tt]),Sn=co(()=>{let Y=t("justify-content");return Y==="space-between"?"between":Y==="space-around"||Y==="space-evenly"?"around":"fixed"},[t])(),Rn=co((Y,Me)=>{if(Y==="fixed"){let qe=Math.max(0,Math.round(Et()*1e3)/1e3),kt=Me||(qe>0?`${qe}px`:"8px");o("justify-content","normal"),o(Ve,kt);return}o("justify-content",Y==="between"?"space-between":"space-around"),o(Ve,"0px")},[Ve,Et,o]),ln=co(Y=>{if(Sn!=="fixed"){Rn("fixed",Y);return}o(Ve,Y)},[Rn,Sn,Ve,o]),Nt=co(Y=>{et(e,"justify-content","normal"),et(e,Ve,Y)},[e,Ve]),q=Y=>Y==="center"?1:Y==="flex-end"||Y==="end"?2:0,se=q(t("justify-content")),fe=q(t("align-items")),Ie=j?fe:se,rt=j?se:fe,ct=qi(null),gt=qi({x:0,y:0}),Ut=qi({col:Ie,row:rt});Ut.current={col:Ie,row:rt};let jn=co((Y,Me)=>{let qe=["flex-start","center","flex-end"];j?(o("justify-content",qe[Me]),o("align-items",qe[Y])):(o("justify-content",qe[Y]),o("align-items",qe[Me]))},[j,o]),hn=qi(jn);hn.current=jn,$p(()=>{let Me=qe=>{let kt=ct.current;if(!kt||!qe.composedPath().includes(kt))return;qe.preventDefault(),qe.stopPropagation(),gt.current.x+=qe.deltaX,gt.current.y+=qe.deltaY;let{col:cn,row:dt}=Ut.current,Re=!1;Math.abs(gt.current.x)>=30&&(cn=Math.max(0,Math.min(2,cn+(gt.current.x>0?1:-1))),gt.current.x=0,gt.current.y=0,Re=!0),!Re&&Math.abs(gt.current.y)>=30&&(dt=Math.max(0,Math.min(2,dt+(gt.current.y>0?1:-1))),gt.current.x=0,gt.current.y=0,Re=!0),Re&&(cn!==Ut.current.col||dt!==Ut.current.row)&&hn.current(cn,dt)};return document.addEventListener("wheel",Me,{passive:!1,capture:!0}),()=>document.removeEventListener("wheel",Me,{capture:!0})},[]);let An=()=>_e("div",{ref:ct,onMouseEnter:()=>{we(!0),u.current&&(u.current.style.overflowY="hidden")},onMouseLeave:()=>{we(!1),u.current&&(u.current.style.overflowY="auto")},style:{width:56,height:56,backgroundColor:to,borderRadius:2,display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gridTemplateRows:"repeat(3, 1fr)",padding:6,gap:2,touchAction:"none"},children:[0,1,2].map(Y=>[0,1,2].map(Me=>_e("button",{type:"button",onClick:()=>jn(Me,Y),style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",border:"none",backgroundColor:"transparent",cursor:"pointer",padding:0},children:Me===Ie&&Y===rt?_e("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",style:{flexShrink:0},children:Me===0?gn(la,{children:[_e("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),_e("rect",{x:"1",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),_e("rect",{x:"1",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):Me===1?gn(la,{children:[_e("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),_e("rect",{x:"2.5",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),_e("rect",{x:"1.5",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]}):gn(la,{children:[_e("rect",{x:"1",y:"1.5",width:"8",height:"1.2",rx:"0.5",fill:p}),_e("rect",{x:"4",y:"4.4",width:"5",height:"1.2",rx:"0.5",fill:p}),_e("rect",{x:"2",y:"7.3",width:"7",height:"1.2",rx:"0.5",fill:p})]})}):_e("div",{style:{width:5,height:5,borderRadius:"50%",backgroundColor:"#aaa"}})},`${Y}-${Me}`)))}),He=r("grid-template-columns")||r("grid-template-rows");return gn("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[_e("div",{style:l,children:_e("span",{children:D?"Auto layout":"Layout"})}),gn("div",{style:{padding:"8px 12px"},children:[gn("div",{style:{display:"flex",gap:2,marginBottom:8,backgroundColor:to,borderRadius:2,padding:2,opacity:G,transition:"opacity 150ms ease"},children:[_e(ce,{mode:"block",icon:_e(Vp,{size:16}),active:E==="block"}),_e(ce,{mode:"flex-col",icon:_e(Yp,{size:16}),active:E==="flex-col"}),_e(ce,{mode:"flex-row",icon:_e(Gp,{size:16}),active:E==="flex-row"}),_e(ce,{mode:"grid",icon:_e(Jp,{size:16}),active:E==="grid"})]}),gn("div",{style:{display:"flex",gap:4,marginBottom:8},children:[_e(da,{label:"W",property:"width",cssValue:m==="fixed"?J:`${Math.round(e.getBoundingClientRect().width)}px`,mode:m,onValueChange:Y=>o("width",Y),onModeChange:Y=>{if(Y==="fixed"){let Me=e.getBoundingClientRect();o("width",`${Math.round(Me.width)}px`)}else o("width",Zi(Y,J))},modified:r("width"),dimmed:Be&&c!=="width",dropdownOpen:c==="width",onDropdownChange:Y=>w(Y?"width":null),panelContentRef:u,accentColor:p,onReset:()=>i("width"),minValue:me!=="none"&&me!=="0px"&&me!=="auto"?me:"",maxValue:ke!=="none"&&ke!=="auto"?ke:"",onMinChange:Y=>o("min-width",Y||"0"),onMaxChange:Y=>o("max-width",Y||"none"),onMinReset:()=>i("min-width"),onMaxReset:()=>i("max-width"),minModified:r("min-width"),maxModified:r("max-width")}),_e(da,{label:"H",property:"height",cssValue:$==="fixed"?T:`${Math.round(e.getBoundingClientRect().height)}px`,mode:$,onValueChange:Y=>o("height",Y),onModeChange:Y=>{if(Y==="fixed"){let Me=e.getBoundingClientRect();o("height",`${Math.round(Me.height)}px`)}else o("height",Zi(Y,T))},modified:r("height"),dimmed:Be&&c!=="height",dropdownOpen:c==="height",onDropdownChange:Y=>w(Y?"height":null),panelContentRef:u,minValue:ue!=="none"&&ue!=="0px"&&ue!=="auto"?ue:"",maxValue:Ee!=="none"&&Ee!=="auto"?Ee:"",onMinChange:Y=>o("min-height",Y||"0"),onMaxChange:Y=>o("max-height",Y||"none"),onMinReset:()=>i("min-height"),onMaxReset:()=>i("max-height"),minModified:r("min-height"),maxModified:r("max-height"),accentColor:p,onReset:()=>i("height")})]}),R&&gn("div",{onMouseEnter:()=>f?.("gap"),onMouseLeave:()=>f?.("element"),style:{display:"flex",gap:8,marginBottom:8},children:[_e("div",{style:{opacity:Be?.3:1,transition:"opacity 150ms ease"},children:An()}),gn("div",{style:{flex:1,opacity:G,transition:"opacity 150ms ease"},children:[_e("div",{onClick:Xe?()=>{i(Ve),i("gap")}:void 0,title:Xe?"Click to reset":void 0,style:{fontSize:9,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:Xe?p:"#999",fontWeight:Xe?600:400,marginBottom:2,cursor:Xe?"pointer":"default"},children:"Gap"}),_e("div",{style:{display:"flex",gap:2,marginBottom:4,backgroundColor:to,borderRadius:2,padding:2},children:["fixed","between","around"].map(Y=>{let Me=Sn===Y;return _e("button",{type:"button",onClick:()=>Rn(Y),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"4px 6px",border:"none",borderRadius:2,backgroundColor:Me?hr(p,.15):"transparent",color:Me?p:"#64748b",cursor:"pointer",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontWeight:Me?600:400,textTransform:"capitalize"},children:Y},Y)})}),_e(Yn,{dimmed:Be,children:gn("div",{style:{display:"flex",alignItems:"center"},children:[_e(Vr,{value:Yt,onChange:Y=>{Je("gap"),ln(Y)},onPreview:lt("gap",Nt),onScrubEnd:()=>Je("gap"),onReset:()=>{i(Ve),i("gap")},isModified:Xe,accentColor:p,defaultUnit:b,children:L==="column"||L==="column-reverse"?_e(uc,{size:12,strokeWidth:Xe?2.5:1.5}):_e(dc,{size:12,strokeWidth:Xe?2.5:1.5})}),_e(uo,{property:Ve,value:Pe.gap||(Sn==="fixed"?Yt:`${Math.max(0,Math.round(Et()*1e3)/1e3)}px`),onChange:Y=>ln(Y),isModified:Xe||"gap"in Pe,style:{...vn,flex:1,minWidth:0},unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:C})]})})]})]}),v&&gn("div",{onMouseEnter:()=>f?.("gap"),onMouseLeave:()=>f?.("element"),style:{display:"flex",gap:8,marginBottom:8,opacity:G,transition:"opacity 150ms ease"},children:[_e(Up,{gridCols:re,gridRows:Ke,gridModified:He,accentColor:p,onColsChange:Y=>o("grid-template-columns",`repeat(${Y}, 1fr)`),onRowsChange:Y=>o("grid-template-rows",`repeat(${Y}, 1fr)`)}),gn("div",{style:{flex:1,display:"flex",flexDirection:"column",gap:4},children:[_e(Yn,{dimmed:Be,children:gn("div",{style:{display:"flex",alignItems:"center"},children:[_e(Vr,{value:oe||X,onChange:Y=>{Je("column-gap"),o("column-gap",Y)},onPreview:lt("column-gap",Ht("column-gap")),onScrubEnd:()=>Je("column-gap"),onReset:()=>i("column-gap"),isModified:r("column-gap"),accentColor:p,defaultUnit:b,children:_e(dc,{size:12,strokeWidth:r("column-gap")?2.5:1.5})}),_e(uo,{property:"column-gap",value:Pe["column-gap"]||oe||X,onChange:Y=>o("column-gap",Y),isModified:r("column-gap")||"column-gap"in Pe,placeholder:"col",style:{...vn,flex:1,minWidth:0},unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:C})]})}),_e(Yn,{dimmed:Be,children:gn("div",{style:{display:"flex",alignItems:"center"},children:[_e(Vr,{value:_||X,onChange:Y=>{Je("row-gap"),o("row-gap",Y)},onPreview:lt("row-gap",Ht("row-gap")),onScrubEnd:()=>Je("row-gap"),onReset:()=>i("row-gap"),isModified:r("row-gap"),accentColor:p,defaultUnit:b,children:_e(uc,{size:12,strokeWidth:r("row-gap")?2.5:1.5})}),_e(uo,{property:"row-gap",value:Pe["row-gap"]||_||X,onChange:Y=>o("row-gap",Y),isModified:r("row-gap")||"row-gap"in Pe,placeholder:"row",style:{...vn,flex:1,minWidth:0},unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:C})]})})]})]}),D&&gn("div",{onMouseEnter:()=>f?.("padding"),onMouseLeave:()=>f?.("element"),style:{display:"flex",gap:4,marginBottom:8,opacity:G,transition:"opacity 150ms ease"},children:[_e(Yn,{style:{flex:1},dimmed:Be,children:gn("div",{style:{display:"flex",alignItems:"center"},children:[_e(Vr,{value:Te.left,onChange:Y=>{Je("padding-h"),Oe(Y)},onPreview:lt("padding-h",yt),onScrubEnd:()=>Je("padding-h"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:p,defaultUnit:b,snapSteps:aa,children:_e(Wp,{size:12,strokeWidth:r("padding")?2.5:1.5})}),_e(uo,{property:"padding",value:Pe["padding-h"]||Te.left,onChange:Y=>Oe(Y),isModified:r("padding")||"padding-h"in Pe,placeholder:"H pad",style:{...vn,flex:1,minWidth:0},unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:C})]})}),_e(Yn,{style:{flex:1},dimmed:Be,children:gn("div",{style:{display:"flex",alignItems:"center"},children:[_e(Vr,{value:Te.top,onChange:Y=>{Je("padding-v"),st(Y)},onPreview:lt("padding-v",Xt),onScrubEnd:()=>Je("padding-v"),onReset:()=>i("padding"),isModified:r("padding"),accentColor:p,defaultUnit:b,snapSteps:aa,children:_e(jp,{size:12,strokeWidth:r("padding")?2.5:1.5})}),_e(uo,{property:"padding",value:Pe["padding-v"]||Te.top,onChange:Y=>st(Y),isModified:r("padding")||"padding-v"in Pe,placeholder:"V pad",style:{...vn,flex:1,minWidth:0},unitStyle:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",padding:"0 8px"},preferredUnit:b,onUnitCycle:C})]})})]}),gn("label",{style:{display:"flex",alignItems:"center",gap:8,cursor:"pointer",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",opacity:G,transition:"opacity 150ms ease"},children:[_e("input",{type:"checkbox",checked:Ye==="hidden",onChange:Y=>o("overflow",Y.target.checked?"hidden":"visible"),style:{margin:0,accentColor:p}}),"Clip content"]})]})]})}import{AlignCenter as Kp,AlignJustify as Xp,AlignLeft as qp,AlignRight as Zp,Baseline as Qp,ChevronDown as ef,WholeWord as tf}from"lucide-react";import{jsx as Lt,jsxs as zo}from"react/jsx-runtime";var mc={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"};function hc({element:e,getValue:t,handleChange:n,isModified:o,onResetProperty:r,isCollapsed:i,onToggle:a,sectionHeaderStyle:s,accentColor:l,colorVariables:c,activeColorDropdown:d,onColorDropdownChange:u,panelContentRef:p,preferredUnit:f,onUnitCycle:b}){let C=t("font-family"),w=t("font-size"),M=t("font-weight"),L=t("line-height"),E=t("letter-spacing"),R=t("text-align"),v=t("color"),D=String(M),j=mc[D]||D,J=Hr(e,v),T=v.includes("var(")?null:ai(J,c),N=({align:m,icon:$})=>{let me=R===m;return Lt("button",{type:"button",onClick:()=>n("text-align",m),style:{flex:1,display:"flex",alignItems:"center",justifyContent:"center",padding:"6px 8px",border:"none",borderRadius:2,backgroundColor:me?hr(l,.15):"transparent",color:me?l:"#64748b",cursor:"pointer"},children:$})},g=C.split(",")[0]?.trim().replace(/^["']|["']$/g,"")||"System";return zo("div",{style:{borderBottom:"1px solid rgba(0,0,0,0.08)"},children:[Lt("div",{style:s,children:Lt("span",{children:"Typography"})}),zo("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[Lt(Yn,{children:zo("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px"},children:[Lt("input",{type:"text",value:C,onChange:m=>n("font-family",m.target.value),style:{...vn,flex:1,minWidth:0,padding:0,fontWeight:o("font-family")?600:400,color:o("font-family")?l:"inherit"},title:C}),Lt(ef,{size:12,style:{color:"#999",flexShrink:0,marginLeft:4}})]})}),zo("div",{style:{display:"flex",gap:4},children:[Lt(Yn,{style:{flex:1},children:Lt("select",{value:D,onChange:m=>n("font-weight",m.target.value),style:{...vn,padding:"6px 8px",paddingLeft:4,paddingRight:20,cursor:"pointer",fontWeight:o("font-weight")?600:400,color:o("font-weight")?l:"inherit"},children:Object.entries(mc).map(([m,$])=>Lt("option",{value:m,children:$},m))})}),Lt(Yn,{style:{flex:1},children:Lt("div",{style:{display:"flex",alignItems:"center",position:"relative"},children:Lt(uo,{property:"font-size",value:w,onChange:m=>n("font-size",m),isModified:o("font-size"),min:1,max:999,style:{...vn,padding:"6px 8px",paddingRight:24,fontWeight:o("font-size")?600:400,color:o("font-size")?l:"inherit"},unitStyle:{position:"absolute",right:8,top:"50%",transform:"translateY(-50%)",fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999"},preferredUnit:f,onUnitCycle:b})})})]}),zo("div",{style:{display:"flex",gap:4},children:[Lt(Yn,{style:{flex:1},children:zo("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[Lt(Qp,{size:12,style:{color:o("line-height")?l:"#999",flexShrink:0}}),Lt(uo,{property:"line-height",value:L,onChange:m=>n("line-height",m),isModified:o("line-height"),step:.1,min:0,placeholder:"Auto",style:{...vn,flex:1,minWidth:0,padding:0,fontWeight:o("line-height")?600:400,color:o("line-height")?l:"inherit"},showUnit:!1})]})}),Lt(Yn,{style:{flex:1},children:zo("div",{style:{display:"flex",alignItems:"center",padding:"6px 8px",gap:4},children:[Lt(tf,{size:12,style:{color:o("letter-spacing")?l:"#999",flexShrink:0}}),Lt(uo,{property:"letter-spacing",value:E,onChange:m=>n("letter-spacing",m),isModified:o("letter-spacing"),step:.1,placeholder:"\u2014",style:{...vn,flex:1,minWidth:0,padding:0,fontWeight:o("letter-spacing")?600:400,color:o("letter-spacing")?l:"inherit"},showUnit:!1})]})})]}),zo("div",{style:{display:"flex",gap:2,backgroundColor:to,borderRadius:2,padding:2},children:[Lt(N,{align:"left",icon:Lt(qp,{size:14})}),Lt(N,{align:"center",icon:Lt(Kp,{size:14})}),Lt(N,{align:"right",icon:Lt(Zp,{size:14})}),Lt(N,{align:"justify",icon:Lt(Xp,{size:14})})]}),zo("div",{style:{display:"flex",alignItems:"center",gap:8,padding:"4px 0"},children:[Lt("span",{onClick:o("color")?()=>r("color"):void 0,title:o("color")?"Click to reset":void 0,style:{fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:o("color")?l:"#64748b",fontWeight:o("color")?600:400,cursor:o("color")?"pointer":"default",width:40,flexShrink:0},children:"Color"}),Lt("div",{style:{flex:1,minWidth:0},children:Lt(ua,{value:v,resolvedValue:J,colorVariables:c,matchingVariable:T,onChange:m=>n("color",m),accentColor:l,modified:o("color"),panelContentRef:p,isDropdownOpen:d==="color",onDropdownChange:m=>u(m?"color":null)})})]})]})]})}import{Fragment as rf,jsx as be,jsxs as Vt}from"react/jsx-runtime";var bc=[{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 of(e,t){let n=t.trim().toLowerCase();switch(e){case"opacity":return n==="1";case"border-width":return n==="0px"||n==="0"||n==="medium";case"border-radius":return n==="0px"||n==="0";case"border-style":return n==="none";case"box-shadow":return n==="none";case"backdrop-filter":return n==="none"||n==="";case"letter-spacing":return n==="normal"||n==="0px"||n==="0";case"background-color":return n==="rgba(0, 0, 0, 0)"||n==="transparent";default:return!1}}function ca(e,t){return!t||e==="auto"||e==="fit-content"||e==="max-content"||e==="min-content"?"hug":e==="100%"||t==="100%"?"fill":"fixed"}function Zi(e,t){switch(e){case"hug":return"fit-content";case"fill":return"100%";case"fixed":{let n=er(t);if(typeof n.num=="number"&&!isNaN(n.num)){let o=n.unit==="%"?"px":n.unit||"px";return`${n.num}${o}`}return"auto"}}}function Yr(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 fc(e,t){return e==="grid"?"grid":e==="flex"||e==="inline-flex"?t==="column"||t==="column-reverse"?"flex-col":"flex-row":"block"}function gc(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 to="rgba(0, 0, 0, 0.04)",vn={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 da({label:e,property:t,cssValue:n,mode:o,onValueChange:r,onModeChange:i,modified:a,dimmed:s,dropdownOpen:l,onDropdownChange:c,panelContentRef:d,accentColor:u="#3b82f6",onReset:p,minValue:f,maxValue:b,onMinChange:C,onMaxChange:w,onMinReset:M,onMaxReset:L,minModified:E,maxModified:R}){let v=er(n),D=a?v.unit||Jr(t):Jr(t),j=!a&&v.unit&&v.unit!==D?ia(v.num,D):v.num,[J,T]=xn(!1),[N,g]=xn(String(j)),[m,$]=xn(!1),me=$n(null),ke=$n(null),ue=$n(null),Ee=$n(!1);no(()=>{J||g(String(j))},[j,J]),no(()=>{if(!l)return;let re=Ge=>{ke.current&&!Ge.composedPath().includes(ke.current)&&ue.current&&!Ge.composedPath().includes(ue.current)&&c?.(!1)},Ke=Ge=>{Ge.key==="Escape"&&c?.(!1)};return document.addEventListener("mousedown",re),document.addEventListener("keydown",Ke),()=>{document.removeEventListener("mousedown",re),document.removeEventListener("keydown",Ke)}},[l,c]),no(()=>{J&&me.current&&(me.current.focus(),me.current.select())},[J]);let Te=()=>{let re=Ki(N,t,n,a);r(re||`${Math.max(0,parseFloat(N)||0)}${D}`),T(!1)},X=()=>{if(Ee.current){Ee.current=!1;return}Te()},_=re=>{if(re.key==="Enter"){Te();return}if(re.key==="Escape"){Ee.current=!0,g(String(j)),T(!1);return}if(re.key==="ArrowUp"||re.key==="ArrowDown"){re.preventDefault();let Ke=re.key==="ArrowUp"?1:-1,Ge=re.shiftKey?8:re.altKey?.1:1,we=parseFloat(N)||0,Be=Math.round(Math.max(0,we+Ke*Ge)*1e3)/1e3;g(String(Be)),r(`${Be}${D}`)}},oe={fixed:"Fixed",hug:"Hug",fill:"Fill"},ye={fixed:be(yc,{size:12}),hug:be(nf,{size:12}),fill:be(yc,{size:12})},ze=()=>{c?.(!l)},Ye=()=>{if(!ue.current||!d?.current)return{position:"absolute",top:"100%",left:-4,right:-4,width:"calc(100% + 8px)",marginTop:4};let re=ue.current.getBoundingClientRect(),Ke=d.current.getBoundingClientRect();return{position:"fixed",top:re.bottom+4,left:Ke.left+4,width:Ke.width-8}};return Vt("div",{ref:ue,onMouseEnter:()=>$(!0),onMouseLeave:()=>$(!1),style:{flex:1,display:"flex",alignItems:"center",position:"relative",borderRadius:2,border:"1px solid",borderColor:J?u:m?"rgba(0,0,0,0.15)":"transparent",backgroundColor:to,transition:"border-color 100ms ease, opacity 150ms ease",opacity:s?.3:1},children:[be("span",{onClick:a&&p?p:void 0,title:a?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:a?u:"#999",fontWeight:a?600:400,padding:"0 8px",flexShrink:0,cursor:a?"pointer":"default"},children:e}),o==="fixed"?J?be("input",{ref:me,type:"text",inputMode:"numeric",value:N,onChange:re=>g(re.target.value),onKeyDown:_,onBlur:X,style:{...vn,flex:1,minWidth:0,padding:"4px 2px"}}):be("span",{onClick:()=>T(!0),style:{flex:1,padding:"4px 2px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text"},children:j}):be("span",{style:{flex:1}}),Vt("button",{type:"button",onClick:ze,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:[oe[o],be(pa,{size:12})]}),l&&Vt("div",{ref:ke,style:{...Ye(),backgroundColor:"#eaeaea",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:[Vt("button",{type:"button",onClick:()=>{i("fixed"),c?.(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:o==="fixed"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:o==="fixed"?600:400,cursor:"pointer",textAlign:"left"},children:[ye.fixed,Vt("span",{children:["Fixed ",t," (",n,")"]}),o==="fixed"&&be(Qi,{size:14,style:{marginLeft:"auto"}})]}),Vt("button",{type:"button",onClick:()=>{i("hug"),c?.(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:o==="hug"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:o==="hug"?600:400,cursor:"pointer",textAlign:"left"},children:[ye.hug,be("span",{children:"Hug contents"}),o==="hug"&&be(Qi,{size:14,style:{marginLeft:"auto"}})]}),Vt("button",{type:"button",onClick:()=>{i("fill"),c?.(!1)},style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",outline:"none",backgroundColor:o==="fill"?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:o==="fill"?600:400,cursor:"pointer",textAlign:"left"},children:[ye.fill,be("span",{children:"Fill container"}),o==="fill"&&be(Qi,{size:14,style:{marginLeft:"auto"}})]}),be("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",margin:"4px 0"}}),Vt("div",{style:{padding:"8px 12px",display:"flex",flexDirection:"column",gap:4},children:[Vt("div",{style:{display:"flex",alignItems:"center",backgroundColor:to,borderRadius:2,padding:"4px 8px"},children:[be("span",{onClick:E?re=>{re.stopPropagation(),M?.()}:void 0,title:E?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:E?u:"#999",fontWeight:E?600:400,marginRight:8,flexShrink:0,cursor:E?"pointer":"default"},children:"Min"}),be("input",{type:"text",value:f||"",placeholder:"\u2014",onChange:re=>C?.(re.target.value),onClick:re=>re.stopPropagation(),style:{...vn,flex:1,minWidth:0,padding:0,textAlign:"right",color:E?u:"inherit",fontWeight:E?600:400}})]}),Vt("div",{style:{display:"flex",alignItems:"center",backgroundColor:to,borderRadius:2,padding:"4px 8px"},children:[be("span",{onClick:R?re=>{re.stopPropagation(),L?.()}:void 0,title:R?"Click to reset":void 0,style:{fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:R?u:"#999",fontWeight:R?600:400,marginRight:8,flexShrink:0,cursor:R?"pointer":"default"},children:"Max"}),be("input",{type:"text",value:b||"",placeholder:"\u2014",onChange:re=>w?.(re.target.value),onClick:re=>re.stopPropagation(),style:{...vn,flex:1,minWidth:0,padding:0,textAlign:"right",color:R?u:"inherit",fontWeight:R?600:400}})]})]})]})]})}function Yn({children:e,style:t,dimmed:n}){let[o,r]=xn(!1);return be("div",{onMouseEnter:()=>r(!0),onMouseLeave:()=>r(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:o?"rgba(0,0,0,0.15)":"transparent",backgroundColor:to,transition:"border-color 100ms ease, opacity 150ms ease",opacity:n?.3:1,...t},children:e})}function No({children:e}){let[t,n]=xn(!1);return be("div",{onMouseEnter:()=>n(!0),onMouseLeave:()=>n(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:t?"rgba(0,0,0,0.15)":"transparent",backgroundColor:to,transition:"border-color 100ms ease"},children:e})}function uo({property:e,value:t,onChange:n,isModified:o=!1,step:r=1,min:i,max:a,style:s,placeholder:l,showUnit:c=!0,unitStyle:d,preferredUnit:u,onUnitCycle:p}){let f=er(t),b=Jr(e),C=Ui[e],M=u&&C&&C.includes(u)?u:b,L=o&&f.unit||M,E=!o&&f.unit&&f.unit!==L?ia(f.num,L):f.num,[R,v]=xn(!1),[D,j]=xn(""),J=X=>{v(!0),j(String(E||"")),requestAnimationFrame(()=>X.target.select())},T=()=>{if(v(!1),D.trim()){let X=Ki(D,e,t,o);X&&n(X)}},N=X=>{let _=X.target.value;j(_);let oe=_.trim(),ye=oe.match(/^(-?[\d.]+)\s*(rem|em|px|%)$/i),ze=oe.match(/^(-?[\d.]+)$/);if(ye){let Ye=parseFloat(ye[1]);isNaN(Ye)||n(`${Ye}${ye[2].toLowerCase()}`)}else if(ze){let Ye=parseFloat(ze[1]);isNaN(Ye)||n(`${Ye}${L}`)}},g=X=>{if(X.key==="Enter"){if(D.trim()){let _=Ki(D,e,t,o);_&&n(_)}X.target.blur();return}if(X.key==="ArrowUp"||X.key==="ArrowDown"){X.preventDefault();let _=X.shiftKey?10:X.altKey?.1:1,oe=(X.key==="ArrowUp"?1:-1)*r*_,ye=parseFloat(D)||E||0,ze=Math.round((ye+oe)*1e3)/1e3;i!==void 0&&(ze=Math.max(i,ze)),a!==void 0&&(ze=Math.min(a,ze)),j(String(ze)),n(`${ze}${L}`)}},m=/^-?[\d.]/.test(t.trim()),$=R?D:m?String(E):"",ke=R&&/\s*(rem|em|px|%)\s*$/i.test(D)?"":L,ue=p&&(ke==="rem"||ke==="px"),Ee={fontSize:10,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#999",pointerEvents:"none"},Te={...d??Ee,pointerEvents:"auto",cursor:"pointer"};return Vt(rf,{children:[be("input",{type:"text",inputMode:"decimal",value:$,onFocus:J,onBlur:T,onChange:N,onKeyDown:g,placeholder:l,style:s}),c&&ke&&be("span",{style:ue?Te:d??Ee,onClick:ue?p:void 0,title:ue?"Click to switch units":void 0,children:ke})]})}function ua({value:e,resolvedValue:t,colorVariables:n,matchingVariable:o,onChange:r,accentColor:i="#3b82f6",modified:a,panelContentRef:s,isDropdownOpen:l,onDropdownChange:c}){let[d,u]=xn(!1),p=e,[f,b]=xn(p),[C,w]=xn(!1),[M,L]=xn(!1),[E,R]=xn(!1),v=$n(null),D=$n(null),j=$n(null),J=l!==void 0?l:C,T=c||w,N=Co(()=>{if(!j.current)return{position:"fixed",top:0,left:0,width:200};let X=j.current.getBoundingClientRect();if(s?.current){let _=s.current.getBoundingClientRect();return{position:"fixed",top:X.bottom+4,left:_.left+4,width:_.width-8}}return{position:"fixed",top:X.bottom+4,left:X.left,width:X.width}},[s]);no(()=>{d||b(e)},[e,d]),no(()=>{if(!J&&!M)return;let X=oe=>{j.current&&!oe.composedPath().includes(j.current)&&(T(!1),L(!1))},_=oe=>{oe.key==="Escape"&&(T(!1),L(!1))};return document.addEventListener("mousedown",X),document.addEventListener("keydown",_),()=>{document.removeEventListener("mousedown",X),document.removeEventListener("keydown",_)}},[J,M]),no(()=>{d&&v.current&&(v.current.focus(),v.current.select())},[d]);let g=es(()=>{if(!f||f.startsWith("#")||f.startsWith("rgb")||f.startsWith("hsl")||f.startsWith("oklch"))return[];let X=f.toLowerCase();return n.filter(_=>_.name.toLowerCase().includes(X)||_.usage.toLowerCase().includes(X)).slice(0,8)},[f,n]),m=()=>{r(f),u(!1),L(!1)},$=X=>{b(X),X.includes("var")||X.includes("--")||X.length>0&&!X.startsWith("#")?L(!0):L(!1)},me=X=>{b(X.value),r(X.value),T(!1),L(!1),u(!1)},ke=()=>{setTimeout(()=>{!J&&!M&&m()},150)},ue=X=>{X.key==="Enter"?m():X.key==="Escape"&&(b(e),u(!1),L(!1))},Ee=es(()=>{let X=t.trim().toLowerCase();if(X.startsWith("#"))return X.length===4?`#${X[1]}${X[1]}${X[2]}${X[2]}${X[3]}${X[3]}`:X.slice(0,7);let _=X.match(/rgba?\((\d+),?\s*(\d+),?\s*(\d+)/);if(_){let ye=parseInt(_[1],10).toString(16).padStart(2,"0"),ze=parseInt(_[2],10).toString(16).padStart(2,"0"),Ye=parseInt(_[3],10).toString(16).padStart(2,"0");return`#${ye}${ze}${Ye}`}let oe=X.match(/oklch\(\s*([\d.]+)/);if(oe){let ye=Math.max(0,Math.min(1,parseFloat(oe[1]))),ze=Math.round(ye*255).toString(16).padStart(2,"0");return`#${ze}${ze}${ze}`}return"#000000"},[t]);return Vt("div",{ref:j,onMouseEnter:()=>R(!0),onMouseLeave:()=>R(!1),style:{position:"relative",borderRadius:2,border:"1px solid",borderColor:d?i:E?"rgba(0,0,0,0.15)":"transparent",backgroundColor:to,transition:"border-color 100ms ease",overflow:"hidden"},children:[Vt("div",{style:{display:"flex",alignItems:"center",minWidth:0},children:[Vt("div",{style:{position:"relative",marginLeft:8,flexShrink:0},children:[be("input",{type:"color",value:Ee,onChange:X=>{let _=X.target.value;b(_),r(_)},style:{width:12,height:12,padding:0,border:"none",cursor:"pointer",opacity:0,position:"absolute",top:0,left:0}}),be("div",{style:{width:12,height:12,borderRadius:2,backgroundColor:t,border:"1px solid rgba(0,0,0,0.1)",pointerEvents:"none"}})]}),d?be("input",{ref:v,type:"text",value:f,onChange:X=>$(X.target.value),onKeyDown:ue,onBlur:ke,style:{...vn,flex:1,minWidth:0}}):be("span",{onClick:()=>u(!0),style:{flex:1,minWidth:0,padding:"4px 8px",fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',cursor:"text",overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",color:a?i:"inherit"},title:p,children:p}),n.length>0&&be("button",{type:"button",onClick:()=>T(!J),style:{display:"flex",alignItems:"center",justifyContent:"center",width:20,height:24,border:"none",background:"none",cursor:"pointer",color:"#999",flexShrink:0},children:be(pa,{size:12})})]}),M&&g.length>0&&be("div",{style:{...N(),backgroundColor:"#eaeaea",border:"1px solid rgba(0,0,0,0.1)",borderRadius:0,zIndex:10001,maxHeight:200,overflowY:"auto",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace'},children:g.map(X=>Vt("button",{type:"button",onClick:()=>me(X),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:[be("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:X.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),be("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:X.name})]},X.name))}),J&&be("div",{ref:D,style:{...N(),backgroundColor:"#eaeaea",border:"1px solid rgba(0,0,0,0.1)",borderRadius:0,zIndex:10001,maxHeight:280,overflowY:"auto",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace'},children:n.map(X=>Vt("button",{type:"button",onClick:()=>me(X),style:{width:"100%",display:"flex",alignItems:"center",gap:8,padding:"10px 12px",border:"none",backgroundColor:o?.usage===X.usage||e===X.value?"#f1f5f9":"transparent",color:"#1e293b",fontWeight:o?.usage===X.usage||e===X.value?600:400,cursor:"pointer",textAlign:"left",fontSize:12},children:[be("div",{style:{width:14,height:14,borderRadius:2,backgroundColor:X.value,border:"1px solid rgba(0,0,0,0.1)",flexShrink:0}}),be("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis"},children:X.name}),(o?.usage===X.usage||e===X.value)&&be(Qi,{size:14,style:{marginLeft:"auto",flexShrink:0}})]},X.name))})]})}function vc({element:e,elementInfo:t,selector:n,styleModifications:o,dispatch:r,onClose:i,onHover:a,accentColor:s="#3b82f6",toolbarRef:l}){let c=$n(null),d=$n(null),[u,p]=xn(()=>{try{return!!localStorage.getItem("devtools-panel-position")}catch{return!1}});no(()=>{if(u)return;let G=setTimeout(()=>p(!0),50);return()=>clearTimeout(G)},[u]);let[f,b]=xn(null),[C,w]=xn(null),M=f!==null||C!==null,[L,E]=xn("rem"),R=Co(()=>{E(G=>G==="rem"?"px":"rem")},[]),v=$n(new Map),[D,j]=xn(""),J=es(()=>Bs(),[]);no(()=>{let G=ce=>{if(ce.key!=="Escape")return;let te=document.activeElement;te&&c.current?.contains(te)||i()};return window.addEventListener("keydown",G),()=>window.removeEventListener("keydown",G)},[i]);let T=$n({top:0,left:0,maxHeight:400}),[,N]=xn(0),g="devtools-panel-position",m=$n({x:0,y:0}),$=$n(null),me=$n(!1);no(()=>{try{let G=localStorage.getItem(g);if(G){let ce=JSON.parse(G);typeof ce.top=="number"&&typeof ce.left=="number"&&(me.current=!0,T.current={...T.current,top:ce.top,left:ce.left})}}catch{}},[]),no(()=>{let G=te=>{let Oe=$.current;if(!Oe)return;let st=Oe.startOffsetX+(te.clientX-Oe.startX),Pe=Oe.startOffsetY+(te.clientY-Oe.startY),nt=280,lt=16,Je=Math.max(lt,Math.min(window.innerWidth-nt-lt,T.current.left+st)),yt=Math.max(lt,T.current.top+Pe);m.current={x:Je-T.current.left,y:yt-T.current.top};let Xt=c.current,Ht=Xt?.parentElement;if(!Ht)return;Ht.style.top=`${yt}px`,Ht.style.left=`${Je}px`;let tt=l?.current?.getBoundingClientRect(),Ve=window.innerHeight-16;tt&&Je+nt>tt.left&&(Ve=tt.top-8);let Yt=Math.max(0,yt),Xe=Math.max(200,Ve-Yt);Xt&&(Xt.style.maxHeight=`${Xe}px`)},ce=()=>{if(!$.current)return;let te=T.current.top+m.current.y,Oe=T.current.left+m.current.x;T.current={...T.current,top:te,left:Oe},m.current={x:0,y:0},me.current=!0;try{localStorage.setItem(g,JSON.stringify({top:te,left:Oe}))}catch{}$.current=null};return window.addEventListener("mousemove",G),window.addEventListener("mouseup",ce),()=>{window.removeEventListener("mousemove",G),window.removeEventListener("mouseup",ce)}},[]);let ke=Co(G=>{G.button!==0||G.target.closest("button")||(G.preventDefault(),$.current={startX:G.clientX,startY:G.clientY,startOffsetX:m.current.x,startOffsetY:m.current.y})},[]);no(()=>{m.current={x:0,y:0};let G=(Oe=!1)=>{let st=c.current,Pe=280,nt=8,lt,Je;if(me.current)lt=T.current.top,Je=T.current.left;else{let Ve=e.getBoundingClientRect();Je=Ve.right+nt,lt=Ve.top,Je+Pe>window.innerWidth-nt&&(Je=Ve.left-Pe-nt),Je<nt&&(Je=Math.max(nt,(window.innerWidth-Pe)/2))}let yt=l?.current?.getBoundingClientRect(),Xt=window.innerHeight-16;yt&&Je+Pe>yt.left&&(Xt=yt.top-nt);let Ht=Math.max(0,lt),tt=Math.max(200,Xt-Ht);if(T.current={top:lt,left:Je,maxHeight:tt},Oe&&st){let Ve=st.parentElement;Ve&&!me.current&&(Ve.style.top=`${lt+m.current.y}px`,Ve.style.left=`${Je+m.current.x}px`),st.style.maxHeight=`${tt}px`}else N(Ve=>Ve+1)};G(!1);let ce=()=>G(!0),te=()=>G(!1);return window.addEventListener("scroll",ce,{passive:!0}),window.addEventListener("resize",te,{passive:!0}),()=>{window.removeEventListener("scroll",ce),window.removeEventListener("resize",te)}},[e]),no(()=>{let G=c.current;if(!G)return;let ce=te=>{let Oe=d.current;if(!Oe){te.preventDefault();return}let{scrollTop:st,scrollHeight:Pe,clientHeight:nt}=Oe,lt=st<=0&&te.deltaY<0,Je=st+nt>=Pe&&te.deltaY>0;(lt||Je)&&te.preventDefault()};return G.addEventListener("wheel",ce,{passive:!1}),()=>G.removeEventListener("wheel",ce)},[]);let ue=es(()=>o.find(G=>G.selector===n),[o,n]),Ee=Co(G=>{let ce=ue?.changes.find(te=>te.property===G);return ce?ce.modified:Hi(e,G)},[e,ue]),Te=Co((G,ce)=>{if(!G.includes("color"))return ce;let te=ce.trim(),st=J.find(Pe=>Pe.usage===te||Pe.name===te)?.value||te;return Hr(e,st)},[J,e]),X=Co(G=>{if(v.current.has(G))return v.current.get(G);let ce=ue?.changes.find(Oe=>Oe.property===G);if(ce)return ce.original;let te=Hi(e,G);return v.current.set(G,te),te},[e,ue]),_=Co((G,ce)=>{let te=X(G),Oe=Te(G,ce);et(e,G,Oe),G==="backdrop-filter"&&et(e,"-webkit-backdrop-filter",Oe),r({type:"MODIFY_STYLE",payload:{selector:n,element:t,property:G,original:te,modified:Oe}})},[e,n,t,r,Te,X]),oe=Co(G=>{o.find(Oe=>Oe.selector===n)?.changes.find(Oe=>Oe.property===G)&&e instanceof HTMLElement&&(e.style.removeProperty(G),r({type:"CLEAR_STYLE",payload:{selector:n,property:G}}),v.current.delete(G))},[e,n,o,r]),ye=Co(()=>{let G=D.split(";").map(ce=>ce.trim()).filter(ce=>ce);for(let ce of G){let te=ce.indexOf(":");if(te>0){let Oe=ce.slice(0,te).trim(),st=ce.slice(te+1).trim();Oe&&st&&_(Oe,st)}}j("")},[D,_]),ze=Co(G=>ue?.changes.some(ce=>ce.property===G)??!1,[ue]),Ye=G=>{let ce=Ee(G.property),te=ze(G.property),Oe=!te&&of(G.property,ce),st={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(Oe&&G.type!=="backdrop-filter")return be(No,{modified:!1,children:be("input",{type:"text",value:"",placeholder:"\u2014",onFocus:()=>{},onChange:Pe=>_(G.property,Pe.target.value),style:{...st,color:"#999"}})});switch(G.type){case"color":{let Pe=Hr(e,ce),nt=ce.includes("var(")?null:ai(Pe,J);return be(ua,{value:ce,resolvedValue:Pe,colorVariables:J,matchingVariable:nt,onChange:lt=>_(G.property,lt),accentColor:s,modified:te,panelContentRef:d,isDropdownOpen:C===G.property,onDropdownChange:lt=>w(lt?G.property:null)})}case"number":{if(!!Ui[G.property])return be(No,{modified:te,children:be(uo,{property:G.property,value:ce,onChange:lt=>_(G.property,lt),isModified:te,min:G.min,max:G.max,step:G.step||1,style:{...st,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:L,onUnitCycle:R})});let{num:nt}=er(ce);return be(No,{modified:te,children:be("input",{type:"number",value:nt,min:G.min,max:G.max,step:G.step||1,onChange:lt=>_(G.property,lt.target.value),style:st})})}case"select":return be(No,{modified:te,children:Vt("div",{style:{position:"relative",display:"flex",alignItems:"center"},children:[be("select",{value:ce,onChange:Pe=>_(G.property,Pe.target.value),style:{...st,cursor:"pointer",paddingLeft:4,paddingRight:24,appearance:"none",WebkitAppearance:"none"},children:G.options?.map(Pe=>be("option",{value:Pe,children:Pe},Pe))}),be("div",{style:{position:"absolute",right:4,top:"50%",transform:"translateY(-50%)",pointerEvents:"none",color:"#999",display:"flex",alignItems:"center"},children:be(pa,{size:12})})]})});case"spacing":return be(No,{modified:te,children:be("input",{type:"text",value:ce,onChange:Pe=>_(G.property,Pe.target.value),placeholder:"e.g., 10px or 10px 20px",style:st})});case"backdrop-filter":return be(lc,{value:ce,onChange:Pe=>_(G.property,Pe),accentColor:s,modified:te,panelContentRef:d});default:return be(No,{modified:te,children:be("input",{type:"text",value:ce,onChange:Pe=>_(G.property,Pe.target.value),style:st})})}},re=t.reactComponent||t.tagName,Ke={position:"fixed",top:T.current.top,left:T.current.left,width:280,maxHeight:T.current.maxHeight,backgroundColor:"#eaeaea",borderWidth:3,borderStyle:"solid",borderColor:"transparent",boxSizing:"content-box",zIndex:10002,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',fontSize:12,overflow:"visible",display:"flex",flexDirection:"column",opacity:u?1:0,transition:"opacity 150ms ease"},Ge={display:"flex",alignItems:"center",justifyContent:"space-between",margin:4,padding:"4px 5px 4px 10px",backgroundColor:s,color:"#ffffff",cursor:$.current?"grabbing":"grab",userSelect:"none",WebkitUserSelect:"none"},we={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"},Be={display:"flex",alignItems:"center",padding:"4px 12px",gap:8},ut={width:80,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',color:"#64748b",flexShrink:0};return be("div",{"data-devtools":"panel-wrapper",style:{position:"fixed",top:T.current.top+m.current.y,left:T.current.left+m.current.x,zIndex:10002,pointerEvents:"none"},children:Vt("div",{ref:c,"data-devtools":"panel",style:{...Ke,position:"relative",top:0,left:0,zIndex:0,pointerEvents:"auto"},onMouseEnter:()=>a?.("element"),onMouseLeave:()=>a?.(null),children:[be("div",{"aria-hidden":"true",style:Yi()}),Vt("div",{style:Ge,onMouseDown:ke,children:[be("div",{style:{display:"flex",alignItems:"center",gap:3,overflow:"hidden",minWidth:0},children:be("span",{style:{fontWeight:600,fontSize:12,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:re})}),be("button",{type:"button",onClick:i,title:"Close",style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1,flexShrink:0},children:"\xD7"})]}),Vt("div",{ref:d,style:{flex:1,overflowY:"auto",margin:"0 3px 3px"},children:[be("div",{style:{opacity:C?.3:1,transition:"opacity 150ms ease"},children:be(pc,{element:e,getValue:Ee,getOriginalValue:X,handleChange:_,isModified:ze,onResetProperty:oe,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:we,activeDropdown:f,onDropdownChange:b,panelContentRef:d,accentColor:s,onFieldHover:a,preferredUnit:L,onUnitCycle:R})}),be("div",{style:{opacity:f?.3:1,transition:"opacity 150ms ease"},children:be(hc,{element:e,getValue:Ee,handleChange:_,isModified:ze,onResetProperty:oe,isCollapsed:!1,onToggle:()=>{},sectionHeaderStyle:we,accentColor:s,colorVariables:J,activeColorDropdown:C,onColorDropdownChange:w,panelContentRef:d,preferredUnit:L,onUnitCycle:R})}),bc.map((G,ce)=>{let te=ce===bc.length-1,Oe=C&&G.properties.some(Pe=>Pe.property===C);return Vt("div",{style:{borderBottom:te?"none":"1px solid rgba(0,0,0,0.08)",opacity:M&&!Oe?.3:1,transition:"opacity 150ms ease"},children:[be("div",{style:we,children:be("span",{children:G.name})}),be("div",{style:{padding:"4px 0"},children:G.properties.map(Pe=>{let nt=ze(Pe.property),lt=Oe&&Pe.property!==C;return Vt("div",{style:{...Be,opacity:lt?.3:1,transition:"opacity 150ms ease"},children:[be("span",{onClick:nt?()=>oe(Pe.property):void 0,title:nt?"Click to reset":void 0,style:{...ut,color:nt?s:"#64748b",fontWeight:nt?600:400,cursor:nt?"pointer":"default"},children:Pe.label}),be("div",{style:{flex:1,minWidth:0,overflow:"hidden"},children:Ye(Pe)})]},Pe.property)})})]},G.name)}),Vt("div",{style:{opacity:M?.3:1,transition:"opacity 150ms ease"},children:[be("div",{style:we,children:be("span",{children:"Raw CSS"})}),Vt("div",{style:{padding:"8px 12px"},children:[be("textarea",{value:D,onChange:G=>j(G.target.value),placeholder:"property: value; ...",style:{width:"100%",height:60,padding:8,fontSize:11,fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',border:"1px solid rgba(0,0,0,0.1)",borderRadius:2,resize:"vertical",outline:"none"}}),D.trim()&&be("button",{type:"button",onClick:ye,style:{marginTop:4,padding:"4px 8px",width:"100%",fontSize:11,border:"none",borderRadius:2,backgroundColor:s,color:"#fff",cursor:"pointer",opacity:D.trim()?1:.5},children:"Apply"})]})]})]})]})})}import{useEffect as sf,useLayoutEffect as af,useState as lf}from"react";import{Fragment as pf,jsx as br,jsxs as uf}from"react/jsx-runtime";var fa=["flex-start","center","flex-end"],ga=["flex-start","center","flex-end"];function cf(e){return e==="normal"||e==="flex-start"||e==="start"?"flex-start":e==="flex-end"||e==="end"?"flex-end":e==="center"?"center":null}function df(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 xc(e){let t=Array.from(e.children);if(t.length===0)return null;let n=1/0,o=1/0,r=-1/0,i=-1/0;for(let a of t){let s=a.getBoundingClientRect();s.width===0&&s.height===0||(s.top<n&&(n=s.top),s.left<o&&(o=s.left),s.bottom>r&&(r=s.bottom),s.right>i&&(i=s.right))}return n===1/0?null:new DOMRect(o,n,i-o,r-n)}function Sc({element:e,modifier:t,accentColor:n,refreshKey:o=0}){let[r,i]=lf(null);if(sf(()=>{if(!e){i(null);return}let C=()=>i(xc(e));return C(),window.addEventListener("scroll",C,{passive:!0}),window.addEventListener("resize",C,{passive:!0}),()=>{window.removeEventListener("scroll",C),window.removeEventListener("resize",C)}},[e]),af(()=>{e&&i(xc(e))},[e,o]),!r)return null;let a=r,s=window.getComputedStyle(e),l=s.display;if(l!=="flex"&&l!=="inline-flex")return null;let c=s.flexDirection,d=c==="column"||c==="column-reverse"?"vertical":"horizontal",u=d==="horizontal"?"vertical":"horizontal",p=[];if(t==="shift"){let C=cf(s.justifyContent);if(C){let w=fa.indexOf(C);d==="horizontal"?(w>0&&p.push("left"),w<fa.length-1&&p.push("right")):(w>0&&p.push("up"),w<fa.length-1&&p.push("down"))}}else{let C=df(s.alignItems);if(C){let w=ga.indexOf(C);u==="horizontal"?(w>0&&p.push("left"),w<ga.length-1&&p.push("right")):(w>0&&p.push("up"),w<ga.length-1&&p.push("down"))}}if(p.length===0)return null;let f=14,b=7;return br(pf,{children:p.map(C=>{let w,M;switch(C){case"right":w=a.right+f,M=a.top+a.height/2;break;case"left":w=a.left-f,M=a.top+a.height/2;break;case"down":w=a.left+a.width/2,M=a.bottom+f;break;case"up":w=a.left+a.width/2,M=a.top-f;break}let L=C==="right"?0:C==="left"?180:C==="down"?90:-90,E={position:"fixed",left:w-b,top:M-b,width:b*2,height:b*2,pointerEvents:"none",zIndex:9997};return br("div",{"data-devtools":"swipe-hint",style:E,children:br("svg",{width:b*2,height:b*2,viewBox:"-7 -7 14 14",style:{overflow:"visible"},children:uf("g",{transform:`rotate(${L})`,children:[br("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round"}),br("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:"#fff",strokeWidth:"4",strokeLinecap:"round",strokeLinejoin:"round"}),br("line",{x1:"-5",y1:"0",x2:"3",y2:"0",stroke:n,strokeWidth:"1.5",strokeLinecap:"round"}),br("polyline",{points:"0,-4 5,0 0,4",fill:"none",stroke:n,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})})},C)})})}import{useEffect as ff,useLayoutEffect as gf,useState as mf}from"react";import{jsx as ma,jsxs as ha}from"react/jsx-runtime";function hf(e,t){let n=e.match(/^oklch\(([^)]+)\)$/i);return n?`oklch(${n[1]} / ${t})`:`color-mix(in srgb, ${e} ${Math.round(t*100)}%, transparent)`}function wc({element:e,fontSize:t,lineHeight:n,accentColor:o,hoveredProperty:r,draggingProperty:i,cursorViewport:a}){let[s,l]=mf(null);if(ff(()=>{if(!e){l(null);return}let M=()=>{l(Or(e))};return M(),window.addEventListener("scroll",M,{passive:!0}),window.addEventListener("resize",M,{passive:!0}),()=>{window.removeEventListener("scroll",M),window.removeEventListener("resize",M)}},[e]),gf(()=>{e&&l(Or(e))},[e,t,n]),!s)return null;let c=s.width,d=s.height,u=hf(o,.2),p=i??r,f=8,b=2,C={position:"fixed",top:s.top,left:s.left,width:c,height:d,pointerEvents:"none",zIndex:9996,overflow:"visible"},w=M=>M==="font-size"?`${Math.round(t)}`:(t>0?n/t:1.2).toFixed(2).replace(/\.?0+$/,"");return ha("div",{"data-devtools":"text-handles",style:C,children:[ha("svg",{style:{position:"absolute",inset:0,width:"100%",height:"100%",overflow:"visible",pointerEvents:"none"},viewBox:`0 0 ${c} ${d}`,children:[ma("rect",{x:"0.5",y:"0.5",width:Math.max(0,c-1),height:Math.max(0,d-1),fill:"none",stroke:u,strokeWidth:"1"}),(p==="font-size"||!p)&&ma("rect",{x:c-b/2,y:d/2-f/2,width:b,height:f,fill:o,stroke:"#ffffff",strokeWidth:p==="font-size"?4:2,paintOrder:"stroke"}),(p==="line-height"||!p)&&ma("rect",{x:c/2-f/2,y:d-b/2,width:f,height:b,fill:o,stroke:"#ffffff",strokeWidth:p==="line-height"?4:2,paintOrder:"stroke"})]}),a&&p&&(()=>{let M=p==="font-size"?"Aa":"Lh",L=w(p);return ha("div",{style:{position:"fixed",left:a.x+8,top:a.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:[M," ",L]})})()]})}import{Fragment as qr,jsx as ht,jsxs as Xr}from"react/jsx-runtime";var Cc=8,ya=[0,1,2,4,8,12,16,20,24,28,32],Kr=8,ba="devtools-active-text";function yf(e){let t=e?.getBoundingClientRect();return!t||typeof window>"u"?{}:t.top<window.innerHeight/2?{avoidTop:t.bottom+Kr,avoidLeft:t.left-Kr,avoidRight:t.right+Kr}:{avoidBottom:t.top-Kr,avoidLeft:t.left-Kr,avoidRight:t.right+Kr}}function Ec(e,t,n=0,o,r,i=90){let a=e.left+window.scrollX+4,s=t==="top-left"?e.top+window.scrollY-Zo-n*Zo+4:e.bottom+window.scrollY+4-1+n*Zo,l=window.scrollY+4,c=window.scrollY+window.innerHeight-Zo-4,d=null;if(o&&r!==void 0){let u=o.getBoundingClientRect(),p=e.left+4;if(p+r+8+i>u.left&&p<u.right)if(u.top<window.innerHeight/2){let C=window.scrollY+u.bottom+4;C>l&&(l=C,d="top")}else{let C=window.scrollY+u.top-Zo-4;C<c&&(c=C,d="bottom")}}return l>c&&(c=l),s<l?s=d==="top"?l:e.top+window.scrollY+4:s>c&&(s=d==="bottom"?c:Math.max(e.top+window.scrollY+4,c)),{x:a,y:s}}function kc({state:e,dispatch:t,onScreenshot:n,inFlightAnnotationIds:o,activeAnnotationIds:r,queuePositionMap:i,inFlightStyleSelectors:a,inFlightSelectorColors:s,onAttachImages:l,onViewThread:c,onCloseThread:d,onModelComponentsAdd:u,onModelComponentFocus:p,onModelComponentHover:f,modelComponentNames:b,modelPanelHoveredComponent:C,modelSpacingTokenHover:w,highlightedAnnotationIds:M,focusedThreadAnnotationId:L,externalCanvasRef:E,toolbarRef:R}){let{canvasRef:v,redrawAll:D,resizeCanvas:j}=$l(),J=sn(y=>{v.current=y,E&&(E.current=y)},[E,v]),T=jt(!1);In(()=>{let y=v.current;if(!y)return;let x=()=>{T.current&&(T.current=!1,y.style.pointerEvents="")},O=h=>{h.button===0&&T.current&&x()};return window.addEventListener("mousedown",O),()=>window.removeEventListener("mousedown",O)},[v]);let[N,g]=St(!1),[m,$]=St(()=>{if(typeof window>"u")return null;try{let y=localStorage.getItem(ba);return y?JSON.parse(y):null}catch{return null}}),[me,ke]=St(null),[ue,Ee]=St(null),[Te,X]=St(null),_=jt(null),oe=jt(null),ye=jt({x:0,y:0}),ze=jt([]),Ye=jt(0),[re,Ke]=St(null),[Ge,we]=St(new Map),Be=jt(0),ut=jt(null),[G,ce]=St(null),[te,Oe]=St(null),[st,Pe]=St(null),[nt,lt]=St(null),Je=jt({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}),[yt,Xt]=St(null),[Ht,tt]=St(null),[Ve,Yt]=St(null),[Xe,Et]=St(null),Wn=jt({x:0,y:0}),[Sn,Rn]=St({x:0,y:0}),ln=jt({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}),[Nt,q]=St(null),[se,fe]=St(null),[Ie,rt]=St(null),[ct,gt]=St(!1),[Ut,jn]=St(0),[hn,An]=St(null),He=jt({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}),[bt,Y]=St(null),[Me,qe]=St(null),[kt,cn]=St(null),dt=jt({isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null}),[Re,tn]=St(null),[qt,Gn]=St(null),[zt,Mo]=St(null),nr=Wl(),Ro=jt(s);Ro.current=s;let Wo=sn(y=>{let x=Ro.current;if(!x||x.size===0)return!1;for(let O of x.keys())try{if(y.matches(O))return!0}catch{}return!1},[]),or=jt(e);or.current=e;let yn=jt(m);yn.current=m;let jo=jt([]),Go=jt(n);Go.current=n;let[Ze,ho]=St(null),Tt=e.selectedAnnotationIds;jo.current=Tt;let wn=sn((y,x=!1)=>{t({type:"SELECT_ANNOTATION",payload:{id:y,addToSelection:x}})},[t]),Ln=sn(()=>{t({type:"SELECT_ANNOTATION",payload:{id:null}})},[t]),[Cn,Jo]=St(null),io=jt({x:window.scrollX,y:window.scrollY}),so=jt(null),qn=jt(null),[Zt,Ao]=St(io.current);In(()=>(j(),window.addEventListener("resize",j),()=>window.removeEventListener("resize",j)),[j]),In(()=>{m?localStorage.setItem(ba,JSON.stringify(m)):localStorage.removeItem(ba)},[m]),jl(m,$,me,e.annotations,t);let Vo=jt(re);Vo.current=re,In(()=>{if(e.activeTool!=="model"||!e.isAnnotating)return;let y=x=>{if(!x.altKey||!Vo.current)return;x.preventDefault();let O=x.deltaY>0?-1:1;Be.current=Math.max(0,Be.current+O);let h=ut.current;if(h){let k=_i(h,Be.current);Ke(k)}};return window.addEventListener("wheel",y,{passive:!1}),()=>window.removeEventListener("wheel",y)},[e.activeTool,e.isAnnotating]),In(()=>{e.activeTool!=="model"&&(Ke(null),we(new Map),Be.current=0,ut.current=null)},[e.activeTool]),In(()=>{let y=re?.name??null,x=y&&b?.has(y)?y:null;f?.(x)},[re,b,f]);let[Lo,Ir]=St(null);In(()=>{if(!C){Ir(null);return}let y=Br(C.name),x=C.instanceIndex;Ir(y[x%y.length]??null)},[C]);let[Po,Yo]=St([]);In(()=>{if(!w){Yo([]);return}w.token?.bindings?.length?Yo(Rs(w.token)):Yo(Is(w.px))},[w]);let B=jt(null),W=jt(null);B.current=Nt,W.current=se,In(()=>{let y=["flex-start","center","flex-end"],x=["flex-start","center","flex-end"],h=null,k=!1,I=null,z=null,A=(de,Ue)=>{let We=fr(de,Ue);for(;We&&We!==document.documentElement;){let Qt=window.getComputedStyle(We).display;if(Qt==="flex"||Qt==="inline-flex")return We;We=We.parentElement}return null},F=de=>{let Ue=window.getComputedStyle(de).flexDirection;return Ue==="column"||Ue==="column-reverse"?"vertical":"horizontal"},Z=de=>{let Ue=de.getAttribute("data-pm");return Ue||(Ue=Math.random().toString(36).substring(2,8),de.setAttribute("data-pm",Ue)),{selector:`[data-pm="${Ue}"]`,durableSelector:Vn(de)}},H=()=>{k=!0,h&&clearTimeout(h),h=setTimeout(()=>{k=!1,h=null},300)},V=(de,Ue,Wt)=>{let We=F(de);if(Ue===We){let On=window.getComputedStyle(de).justifyContent,Rt=On==="normal"||On==="flex-start"||On==="start"?"flex-start":On==="flex-end"||On==="end"?"flex-end":On==="center"?"center":null;if(!Rt)return;let sr=y.indexOf(Rt)+Wt;if(sr<0||sr>=y.length)return;let _o=y[sr],{selector:ar,durableSelector:bs}=Z(de);et(de,"justify-content",_o),t({type:"MODIFY_STYLES_BATCH",payload:{selector:ar,durableSelector:bs,element:Nn(de),changes:[{property:"justify-content",original:On,modified:_o}]}})}else{let On=window.getComputedStyle(de).flexDirection,Rt=We==="horizontal"?"column":"row",{selector:Do,durableSelector:sr}=Z(de);et(de,"flex-direction",Rt),t({type:"MODIFY_STYLES_BATCH",payload:{selector:Do,durableSelector:sr,element:Nn(de),changes:[{property:"flex-direction",original:On,modified:Rt}]}})}jn(Qt=>Qt+1)},Q=(de,Ue,Wt)=>{let Qt=F(de)==="horizontal"?"vertical":"horizontal";if(Ue!==Qt)return;let Rt=window.getComputedStyle(de).alignItems,Do=Rt==="normal"||Rt==="stretch"||Rt==="flex-start"||Rt==="start"?"flex-start":Rt==="flex-end"||Rt==="end"?"flex-end":Rt==="center"?"center":null;if(!Do)return;let _o=x.indexOf(Do)+Wt;if(_o<0||_o>=x.length)return;let ar=x[_o],{selector:bs,durableSelector:Cd}=Z(de);et(de,"align-items",ar),t({type:"MODIFY_STYLES_BATCH",payload:{selector:bs,durableSelector:Cd,element:Nn(de),changes:[{property:"align-items",original:Rt,modified:ar}]}}),jn(Ed=>Ed+1)},K=20,ve=null,Le=null,ot=0,ft=(de,Ue,Wt)=>{let We=A(Ue,Wt);An(We?{modifier:de,target:We}:null)},it=de=>{if(!(e.activeTool!=="hand"||!e.isAnnotating)){if(de.key==="Shift"&&!de.altKey){let Ue=Wn.current;ft("shift",Ue.x,Ue.y)}else if(de.key==="Alt"&&!de.shiftKey){let Ue=Wn.current;ft("alt",Ue.x,Ue.y)}}},It=de=>{if(e.activeTool!=="hand"||!e.isAnnotating)return;let Ue=de.shiftKey&&!de.altKey,Wt=de.altKey&&!de.shiftKey;if(!Ue&&!Wt||de.buttons!==0){ve=null,Le=null,ot=0,I=null,z=null,An(null);return}if(I===null&&(I=de.clientX,z=de.clientY,ft(Ue?"shift":"alt",de.clientX,de.clientY)),k)return;ve===null&&(ve=de.clientX,Le=de.clientY,ot=0);let We=de.clientX-ve,Qt=de.clientY-Le,On=Math.abs(We)>=Math.abs(Qt)?We:Qt;if(Math.abs(On)>3){let ar=On>0?1:-1;if(ot!==0&&ar!==ot){ve=de.clientX,Le=de.clientY,ot=0;return}ot=ar}if(Math.abs(We)<K&&Math.abs(Qt)<K)return;let Rt=A(I,z);if(!Rt)return;let Do=Math.abs(We)>=Math.abs(Qt)?"horizontal":"vertical",_o=(Do==="horizontal"?We:Qt)>0?1:-1;ve=null,Le=null,ot=0,Ue?V(Rt,Do,_o):Q(Rt,Do,_o),H()},$t=de=>{(de.key==="Shift"||de.key==="Alt")&&(I=null,z=null,ve=null,Le=null,ot=0,An(null))},vt=()=>{An(null),ve=null,Le=null,ot=0};return window.addEventListener("keydown",it),window.addEventListener("mousemove",It),window.addEventListener("mousedown",vt),window.addEventListener("keyup",$t),()=>{window.removeEventListener("keydown",it),window.removeEventListener("mousemove",It),window.removeEventListener("mousedown",vt),window.removeEventListener("keyup",$t),h&&clearTimeout(h)}},[e.activeTool,e.isAnnotating,t]),In(()=>{let y=x=>{if(x.key==="Escape"){if(yn.current)return;if(e.activeTool==="model"&&Ge.size>0){x.preventDefault(),we(new Map);return}if(jo.current.length>0){x.preventDefault(),Ln();return}}if(x.key==="Enter"&&e.activeTool==="model"&&Ge.size>0&&u){x.preventDefault();let I=[...Ge.keys()].filter(z=>!b?.has(z));I.length>0&&u(I),we(new Map);return}if((x.metaKey||x.ctrlKey)&&x.key==="v"&&ze.current.length>0&&!yn.current){x.preventDefault(),Ye.current++;let I=Ye.current*20,A=ze.current[0]?.groupId?Math.random().toString(36).substring(2,9):void 0,F=ze.current.map(H=>({...H,id:Math.random().toString(36).substring(2,9),groupId:H.groupId?A:void 0,timestamp:Date.now(),points:H.points.map(V=>({x:V.x+I,y:V.y+I}))}));t({type:"PASTE_ANNOTATIONS",payload:{annotations:F}});let Z=F.find(H=>H.type!=="text")||F[0];Z&&wn(Z.id);return}let O=jo.current;if(O.length===0||yn.current)return;let h=x.composedPath?.()[0]??x.target,k=h?.tagName;if(!(k==="INPUT"||k==="TEXTAREA"||h?.isContentEditable)&&(x.key==="Delete"||x.key==="Backspace")){if(x.preventDefault(),d){let I=or.current.annotations;for(let z of O){let A=I.find(Z=>Z.id===z);if(!A)continue;let F=A.threadId||A.groupId&&I.find(Z=>Z.groupId===A.groupId&&Z.threadId)?.threadId;F&&d(F)}}for(let I of O)t({type:"DELETE_ANNOTATION",payload:{id:I}});Ln()}};return window.addEventListener("keydown",y),()=>window.removeEventListener("keydown",y)},[t,Ln,wn,e.activeTool,Ge,b,u,d]);let ne=Pr(),ae=Ur(()=>e.annotations.filter(y=>!y.pathname||y.pathname===ne),[e.annotations,ne]),le=Ur(()=>e.styleModifications.filter(y=>!y.pathname||y.pathname===ne),[e.styleModifications,ne]),ge=yf(R?.current),Ae=ge.avoidTop,xe=ge.avoidBottom,Jt=ge.avoidLeft,Dt=ge.avoidRight,mt=Ur(()=>Ji(e.annotations),[e.annotations]),Ft=Ur(()=>{let y=new Map,x=new Set,O=1,h=[...e.annotations].sort((k,I)=>k.timestamp-I.timestamp);for(let k of h)if(!mt.has(k))if(k.groupId){if(!x.has(k.groupId)){x.add(k.groupId);let I=e.annotations.filter(z=>z.groupId===k.groupId);for(let z of I)y.set(z.id,O);O++}}else y.set(k.id,O),O++;return y},[e.annotations,mt]),at=Ur(()=>{if(Tt.length===0)return null;let y=new Map;for(let x of Tt){let O=e.annotations.find(k=>k.id===x);if(!O)continue;let h=O.groupId?e.annotations.filter(k=>k.groupId===O.groupId):[O];for(let k of h)if(k.linkedSelector&&!s?.has(k.linkedSelector)){let I=k.color||e.activeColor;y.set(k.linkedSelector,I)}}return y.size>0?y:null},[Tt,e.annotations,e.activeColor,s]),En=Ur(()=>ae.filter(y=>!(mt.has(y)||m&&!m.isNew&&y.id===m.id)),[ae,mt,m]),Pn=sn((y=io.current)=>{D(En,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,Tt,Cc,y.x,y.y,Ft,M,ge)},[En,e.currentPath,e.activeTool,e.activeColor,e.strokeWidth,Tt,D,Ft,M,Ae,xe,Jt,Dt]);In(()=>{Pn(io.current)},[Pn]),In(()=>{let y=()=>{let x={x:window.scrollX,y:window.scrollY};io.current=x,so.current===null&&(so.current=window.requestAnimationFrame(()=>{so.current=null;let O=io.current;if(Pn(O),yn.current){Ao(h=>h.x===O.x&&h.y===O.y?h:O);return}qn.current!==null&&window.clearTimeout(qn.current),qn.current=window.setTimeout(()=>{qn.current=null;let h=io.current;Ao(k=>k.x===h.x&&k.y===h.y?k:h)},80)}))};return window.addEventListener("scroll",y,{passive:!0}),()=>{window.removeEventListener("scroll",y),so.current!==null&&(window.cancelAnimationFrame(so.current),so.current=null),qn.current!==null&&(window.clearTimeout(qn.current),qn.current=null)}},[Pn]),In(()=>{if(ue){let y=Math.random().toString(36).substring(2,9);$({id:y,point:ue.point,text:"",fontSize:12,isNew:!0,groupId:ue.groupId}),Ee(null)}},[ue]),In(()=>{Te&&($({id:Math.random().toString(36).substring(2,9),point:Te.point,text:"",fontSize:12,isNew:!0,linkedSelector:Te.linkedSelector,linkedAnchor:Te.linkedAnchor,elements:Te.elements}),X(null))},[Te]);let pn=jt(null),kn=m?.id??null;In(()=>{kn&&_.current?requestAnimationFrame(()=>{let y=_.current;if(!y||(y.focus(),oe.current===kn))return;oe.current=kn;let x=yn.current;if(x){if(pn.current!==null){let O=Math.min(pn.current,y.value.length);y.setSelectionRange(O,O);return}if(!x.isNew&&x.clickPoint){let O=v.current;if(!O)return;let h=O.getContext("2d");if(!h)return;h.font=`${x.fontSize}px ${rn}`;let k=x.fontSize*1.4,I=x.text.split(`
|
|
4
|
+
`),z=x.clickPoint.y-x.point.y,A=Math.max(0,Math.min(I.length-1,Math.floor(z/k))),F=x.clickPoint.x-x.point.x,Z=I[A]||"",H=0;for(let Q=0;Q<=Z.length;Q++){let K=h.measureText(Z.substring(0,Q)).width;if(K>F){let ve=Q>0?h.measureText(Z.substring(0,Q-1)).width:0;H=F-ve<K-F?Q-1:Q;break}H=Q}let V=H;for(let Q=0;Q<A;Q++)V+=(I[Q]?.length||0)+1;y.setSelectionRange(V,V)}}}):(oe.current=null,pn.current=null)},[kn,v]);let Uo=sn(y=>{let x=v.current;if(!x)return{x:0,y:0};let O=x.getBoundingClientRect(),h,k;if("touches"in y&&y.touches[0])h=y.touches[0].clientX,k=y.touches[0].clientY;else if("clientX"in y)h=y.clientX,k=y.clientY;else return{x:0,y:0};return{x:h-O.left+window.scrollX,y:k-O.top+window.scrollY}},[v]),Bo=sn((y,x,O,h)=>{let k=O.x-x.x,I=O.y-x.y,z=k*k+I*I;if(z===0)return Math.sqrt((y.x-x.x)**2+(y.y-x.y)**2)<=h;let A=Math.max(0,Math.min(1,((y.x-x.x)*k+(y.y-x.y)*I)/z)),F=x.x+A*k,Z=x.y+A*I;return Math.sqrt((y.x-F)**2+(y.y-Z)**2)<=h},[]),Zn=sn(y=>{for(let O=ae.length-1;O>=0;O--){let h=ae[O];if(!h||mt.has(h))continue;let k=(h.strokeWidth||3)+4;switch(h.type){case"text":{if(!h.points[0]||!h.text)continue;let I=h.points[0],z=h.fontSize||12,A=v.current;if(A){let F=A.getContext("2d");if(F){F.font=`${z}px ${rn}`;let Z=h.text.replace(/\n/g," "),H=I.x-Zt.x,V=ci(H),Q=di(F,Z,V),K=F.measureText(Q).width,ve=z*1.4,Le={x:I.x-Zt.x,y:I.y-Zt.y},ot=$s(Le,z,ge,K+8),ft={x:ot.x+Zt.x,y:ot.y+Zt.y};if(y.x>=ft.x-4-4&&y.x<=ft.x+K+4+4&&y.y>=ft.y-4-4&&y.y<=ft.y+ve+4+4)return h}}break}case"rectangle":{if(h.points.length<2)continue;let I=h.points[0],z=h.points[h.points.length-1],A=Math.min(I.x,z.x),F=Math.max(I.x,z.x),Z=Math.min(I.y,z.y),H=Math.max(I.y,z.y),V=Bo(y,{x:A,y:Z},{x:F,y:Z},k),Q=Bo(y,{x:A,y:H},{x:F,y:H},k),K=Bo(y,{x:A,y:Z},{x:A,y:H},k),ve=Bo(y,{x:F,y:Z},{x:F,y:H},k);if(V||Q||K||ve)return h;break}case"circle":{if(h.points.length<2)continue;let I=h.points[0],z=h.points[h.points.length-1],A=(I.x+z.x)/2,F=(I.y+z.y)/2,Z=Math.abs(z.x-I.x)/2,H=Math.abs(z.y-I.y)/2,V=y.x-A,Q=y.y-F,K=Math.sqrt((V/Z)**2+(Q/H)**2);if(Math.abs(K-1)*Math.max(Z,H)<=k)return h;break}case"line":{if(h.points.length<2)continue;let I=h.points[0],z=h.points[h.points.length-1];if(Bo(y,I,z,k))return h;break}case"freehand":{if(h.points.length<2)continue;for(let I=0;I<h.points.length-1;I++){let z=h.points[I],A=h.points[I+1];if(Bo(y,z,A,k))return h}break}}}return null},[ae,v,Bo,mt,Zt.x,Zt.y,Ae,xe,Jt,Dt]),ti=sn(y=>{let x=Zn(y);return x?.type==="text"?x:null},[Zn]),wi=sn(y=>{if(Tt.length===0)return null;let x=Cc/2+4;for(let O of Tt){let h=e.annotations.find(k=>k.id===O);if(!(!h||h.points.length<2)){if(h.type==="line"){let k=h.points[0],I=h.points[h.points.length-1];if(Math.sqrt((y.x-k.x)**2+(y.y-k.y)**2)<=x)return{handle:"start",annotationId:O};if(Math.sqrt((y.x-I.x)**2+(y.y-I.y)**2)<=x)return{handle:"end",annotationId:O};continue}if(h.type==="circle"){let k=h.points[0],I=h.points[h.points.length-1],z=Math.min(k.x,I.x),A=Math.max(k.x,I.x),F=Math.min(k.y,I.y),Z=Math.max(k.y,I.y),H=(z+A)/2,V=(F+Z)/2,Q=[{handle:"top",x:H,y:F},{handle:"bottom",x:H,y:Z},{handle:"left",x:z,y:V},{handle:"right",x:A,y:V}];for(let{handle:K,x:ve,y:Le}of Q)if(Math.sqrt((y.x-ve)**2+(y.y-Le)**2)<=x)return{handle:K,annotationId:O};continue}if(h.type==="rectangle"||h.type==="freehand"){let k=h.points[0],I=h.points[h.points.length-1],z,A,F,Z;h.type==="freehand"?(z=Math.min(...h.points.map(V=>V.x)),A=Math.max(...h.points.map(V=>V.x)),F=Math.min(...h.points.map(V=>V.y)),Z=Math.max(...h.points.map(V=>V.y))):(z=Math.min(k.x,I.x),A=Math.max(k.x,I.x),F=Math.min(k.y,I.y),Z=Math.max(k.y,I.y));let H=[{corner:"topLeft",x:z,y:F},{corner:"topRight",x:A,y:F},{corner:"bottomLeft",x:z,y:Z},{corner:"bottomRight",x:A,y:Z}];for(let{corner:V,x:Q,y:K}of H)if(Math.sqrt((y.x-Q)**2+(y.y-K)**2)<=x)return{handle:V,annotationId:O}}}}return null},[Tt,e.annotations]);In(()=>{let y=x=>{if(ye.current={x:x.clientX+window.scrollX,y:x.clientY+window.scrollY},!m){let O=ti(ye.current);ke(O?.id||null)}};return window.addEventListener("mousemove",y),()=>window.removeEventListener("mousemove",y)},[m,ti]);let Ko=sn(()=>{if(!m)return;let y=m.images?.length||0;if(m.text.trim()||y>0)if(m.isNew){let x=Li();t({type:"ADD_TEXT",payload:{point:m.point,text:m.text||(y>0?`[${y} image${y>1?"s":""}]`:""),fontSize:m.fontSize,id:x,groupId:m.groupId,linkedSelector:m.linkedSelector,linkedAnchor:m.linkedAnchor,elements:m.elements,...y>0?{imageCount:y}:{}}}),y>0&&m.images&&l&&l(x,m.images)}else t({type:"UPDATE_TEXT",payload:{id:m.id,text:m.text||(y>0?`[${y} image${y>1?"s":""}]`:""),...y>0?{imageCount:y}:{}}}),y>0&&m.images&&l&&l(m.id,m.images);else m.isNew||t({type:"DELETE_ANNOTATION",payload:{id:m.id}});$(null)},[m,t,l]),ao=sn(y=>{for(let x=0;x<ya.length-1;x++){let O=ya[x],h=ya[x+1];if(y<=(O+h)/2)return O;if(y<h)return h}return Math.round(y/8)*8},[]),ni=sn((y,x,O,h)=>{let k=O.top+Math.max(h.top,4),I=O.bottom-Math.max(h.bottom,4),z=O.left+Math.max(h.left,4),A=O.right-Math.max(h.right,4);if(y<O.left||y>O.right||x<O.top||x>O.bottom)return null;let F=x<k,Z=x>I,H=y<z,V=y>A;return F&&H?h.top>=h.left?"top":"left":F&&V?h.top>=h.right?"top":"right":Z&&H?h.bottom>=h.left?"bottom":"left":Z&&V?h.bottom>=h.right?"bottom":"right":F?"top":Z?"bottom":H?"left":V?"right":null},[]),S=sn(y=>{if(!e.isAnnotating)return;if(e.inspectedElement&&e.activeTool==="hand"&&!("button"in y&&y.button===2)){y.preventDefault(),y.stopPropagation(),t({type:"SELECT_ELEMENT",payload:null});return}let x=Uo(y),O="shiftKey"in y&&y.shiftKey;if(e.activeTool==="inspector"){if("button"in y&&y.button===2)return;if(G&&!Wo(G)){let I=e.annotations.find(it=>{if(!it.linkedSelector||!it.threadId)return!1;try{return G.matches(it.linkedSelector)}catch{return!1}});if(I?.threadId&&c){c(I.threadId),requestAnimationFrame(()=>{document.querySelector("[data-popmelt-shadow-host]")?.shadowRoot?.querySelector("[data-popmelt-reply]")?.focus()});return}let z=Nn(G),A=Vn(G),F=G.getBoundingClientRect(),Z=G.getAttribute("data-pm");Z||(Z=Math.random().toString(36).substring(2,8),G.setAttribute("data-pm",Z));let H=`[data-pm="${Z}"]`,V=le.some(it=>{try{return G.matches(it.selector)}catch{return!1}}),Q=e.annotations.filter(it=>{if(!it.linkedSelector)return!1;try{return G.matches(it.linkedSelector)}catch{return!1}}).length,K=(V?1:0)+Q,ve=F.top>=Zo*(1+K)?"top-left":"bottom-left",Le=v.current?.getContext("2d")??document.createElement("canvas").getContext("2d"),ot;Le&&(Le.font=`12px ${rn}`,ot=Le.measureText("Type here...").width);let ft=Ec(F,ve,K,R?.current,ot,0);X({point:ft,linkedSelector:H,linkedAnchor:ve,elements:[{...z,selector:A}]})}return}if(e.activeTool==="model"){if("button"in y&&y.button===2)return;if(re){let I=re.name;if(b?.has(I)){p?.(I);return}"shiftKey"in y&&y.shiftKey?we(A=>{let F=new Map(A);return F.has(I)?F.delete(I):F.set(I,re),F}):Ge.size===1&&Ge.has(I)?(u&&u([I]),we(new Map)):we(new Map([[I,re]]))}return}if(e.activeTool==="hand"&&Nt&&se){let I=Nt,z=I.getAttribute("data-pm");z||(z=Math.random().toString(36).substring(2,8),I.setAttribute("data-pm",z));let A=Vn(I),F=`[data-pm="${z}"]`,Z=Nn(I),H=gr(I),V=x.x-window.scrollX,Q=x.y-window.scrollY,K=ct,ve=window.getComputedStyle(I).justifyContent,Le=0;if(K){let ft=Oo(I).find(it=>it.axis===se);Le=ft?se==="column"?ft.w:ft.h:0}et(I,"transition","none"),ln.current={isDragging:!0,hasMoved:!1,axis:se,startX:V,startY:Q,originalRow:K?Le:H.row,originalColumn:K?Le:H.column,element:I,elementInfo:{...Z,selector:F},selector:F,durableSelector:A,isAuto:K,originalJustifyContent:ve,visualGap:Le},rt({axis:se,row:K?Le:H.row,column:K?Le:H.column});return}if(e.activeTool==="hand"&&Re&&qt){let I=Re,z=I.getAttribute("data-pm");z||(z=Math.random().toString(36).substring(2,8),I.setAttribute("data-pm",z));let A=`[data-pm="${z}"]`,F=Nn(I),{fontSize:Z,lineHeight:H}=si(I),V=Z>0?H/Z:1.2,Q=x.x-window.scrollX,K=x.y-window.scrollY;et(I,"transition","none");let ve=Vn(I);dt.current={isDragging:!0,property:qt,startX:Q,startY:K,originalFontSize:Z,originalLineHeight:H,originalRatio:V,element:I,elementInfo:{...F,selector:A},selector:A,durableSelector:ve},Mo({property:qt,fontSize:Z,lineHeight:H});return}if(e.activeTool==="hand"&&bt&&Me){let I=bt,z=I.getAttribute("data-pm");z||(z=Math.random().toString(36).substring(2,8),I.setAttribute("data-pm",z));let A=`[data-pm="${z}"]`,F=Vn(I),Z=Nn(I),H=mr(I),V=I.getBoundingClientRect(),Q=Math.floor(V.height/2),K=x.y-window.scrollY;et(I,"transition","none"),He.current={isDragging:!0,corner:Me,startY:K,original:H,maxRadius:Q,element:I,elementInfo:{...Z,selector:A},selector:A,durableSelector:F},cn({corner:Me,radius:{...H}});return}if(e.activeTool==="hand"&&yt&&Ht){let I=yt,z=I.getAttribute("data-pm");z||(z=Math.random().toString(36).substring(2,8),I.setAttribute("data-pm",z));let A=`[data-pm="${z}"]`,F=Vn(I),Z=Nn(I),H=_r(I),V=x.x-window.scrollX,Q=x.y-window.scrollY;et(I,"transition","none"),Je.current={isDragging:!0,side:Ht,startX:V,startY:Q,original:H,element:I,elementInfo:{...Z,selector:A},selector:A,durableSelector:F},Et({side:Ht,padding:{...H}});return}let h=wi(x);if(h){let I=e.annotations.find(z=>z.id===h.annotationId);if(I&&I.type!=="text"&&(I.status??"pending")==="pending"){Jo({annotationId:h.annotationId,handle:h.handle,startPoint:x,originalPoints:[...I.points],hasMoved:!1});return}}let k=Zn(x);if(k&&k.points[0]){if(m&&Ko(),k.type!=="text"?(wn(k.id,O),k.color&&t({type:"SET_COLOR",payload:k.color})):O||Ln(),c){let I=k.threadId||(k.groupId?e.annotations.find(z=>z.groupId===k.groupId&&z.threadId)?.threadId:void 0);I&&c(I)}ho({annotation:k,startPoint:x,hasMoved:!1});return}if(O||Ln(),e.activeTool==="text"){m&&Ko();let I=Math.random().toString(36).substring(2,9);$({id:I,point:x,text:"",fontSize:12,isNew:!0});return}g(!0),t({type:"START_PATH",payload:x})},[e.isAnnotating,e.activeTool,e.inspectedElement,e.annotations,m,Tt,G,yt,Ht,bt,Me,Nt,se,ct,Re,qt,re,Ge,b,u,p,c,Uo,Zn,wi,t,wn,Ln,Ko]),P=sn(y=>{let x=Uo(y);if(e.activeTool==="inspector"&&e.isAnnotating){let O=x.x-window.scrollX,h=x.y-window.scrollY,k=fr(O,h),I=k&&Wo(k)?null:k;I!==G&&(ce(I),Oe(I?Nn(I):null));return}if(e.activeTool==="model"&&e.isAnnotating){let O=x.x-window.scrollX,h=x.y-window.scrollY,k=fr(O,h);if(k!==ut.current&&(ut.current=k,Be.current=0),k){let I=_i(k,Be.current);Ke(I)}else Ke(null);return}if(e.activeTool==="hand"&&e.isAnnotating){let O=x.x-window.scrollX,h=x.y-window.scrollY;Wn.current={x:O,y:h},Rn({x:O,y:h});let k=nr.current.cmd,I=nr.current.shift;if(ln.current.isDragging){let A=ln.current,F=A.element;if(!F)return;if(!A.hasMoved){let Q=Math.abs(O-A.startX),K=Math.abs(h-A.startY);if(Q<=2&&K<=2)return;A.hasMoved=!0,A.isAuto&&(et(F,"justify-content","normal"),et(F,"row-gap",`${A.visualGap}px`),et(F,"column-gap",`${A.visualGap}px`),gt(!1))}let Z=A.axis,H=A.originalRow,V=A.originalColumn;if(Z==="column"){let Q=O-A.startX;V=A.originalColumn+Q,k||(H=A.originalRow+Q)}else{let Q=h-A.startY;H=A.originalRow+Q,k||(V=A.originalColumn+Q)}H=Math.max(0,H),V=Math.max(0,V),I&&(H=ao(H),V=ao(V)),H=Math.round(H),V=Math.round(V),et(F,"row-gap",`${H}px`),et(F,"column-gap",`${V}px`),rt({axis:Z,row:H,column:V});return}if(He.current.isDragging){let A=He.current,F=A.element;if(!F)return;let Z=h-A.startY,H=A.corner,V=A.original,Q={...V};if(k){let K=V[H]+Z;K=Math.max(0,Math.min(A.maxRadius,K)),I&&(K=ao(K)),K=Math.round(K),Q[H]=K}else{let K=V[H]+Z;K=Math.max(0,Math.min(A.maxRadius,K)),I&&(K=ao(K)),K=Math.round(K),Q={"top-left":K,"top-right":K,"bottom-right":K,"bottom-left":K}}et(F,"border-top-left-radius",`${Q["top-left"]}px`),et(F,"border-top-right-radius",`${Q["top-right"]}px`),et(F,"border-bottom-right-radius",`${Q["bottom-right"]}px`),et(F,"border-bottom-left-radius",`${Q["bottom-left"]}px`),cn({corner:H,radius:Q});return}if(dt.current.isDragging){let A=dt.current,F=A.element;if(!F)return;let Z=A.property,H=A.originalFontSize,V=A.originalLineHeight,Q=[8,10,11,12,13,14,16,18,20,22,24,28,32,36,40,48,56,64,72,80,96];if(Z==="font-size"){let ve=O-A.startX;H=A.originalFontSize+ve,H=Math.max(1,H)}else{let ve=h-A.startY;V=A.originalLineHeight+ve,V=Math.max(H,V)}if(I)if(Z==="font-size"){let ve=Q[0],Le=Math.abs(H-ve);for(let ot of Q){let ft=Math.abs(H-ot);ft<Le&&(ve=ot,Le=ft)}H=ve}else{let ve=H>0?V/H:1.2,Le=Math.round(ve*2)/2;V=H*Math.max(1,Le)}H=Math.round(H),V=Math.round(V*10)/10,et(F,"font-size",`${H}px`);let K=H>0?Math.round(V/H*1e3)/1e3:1.2;et(F,"line-height",`${K}`),Mo({property:Z,fontSize:H,lineHeight:V});return}if(Je.current.isDragging){let A=Je.current,F=A.element;if(!F)return;let Z=A.side,H=A.original,V=H.top,Q=H.right,K=H.bottom,ve=H.left;if(Z==="top"){let Le=A.startY-h;V=H.top+Le,k||(K=H.bottom+Le)}else if(Z==="bottom"){let Le=h-A.startY;K=H.bottom+Le,k||(V=H.top+Le)}else if(Z==="left"){let Le=A.startX-O;ve=H.left+Le,k||(Q=H.right+Le)}else if(Z==="right"){let Le=O-A.startX;Q=H.right+Le,k||(ve=H.left+Le)}V=Math.max(0,V),Q=Math.max(0,Q),K=Math.max(0,K),ve=Math.max(0,ve),I&&(V=ao(V),Q=ao(Q),K=ao(K),ve=ao(ve)),V=Math.round(V),Q=Math.round(Q),K=Math.round(K),ve=Math.round(ve),et(F,"padding",`${V}px ${Q}px ${K}px ${ve}px`),Et({side:Z,padding:{top:V,right:Q,bottom:K,left:ve}});return}let z=fr(O,h);for(;z&&z.tagName==="A";)z=z.parentElement;{let F=[];z&&F.push(z),bt&&bt!==z&&F.push(bt);let Z=null,H=16,V=null;for(let Q of F){let K=Q.getBoundingClientRect(),ve=mr(Q),Le=[["top-left",K.left,K.top+ve["top-left"]],["top-right",K.right,K.top+ve["top-right"]],["bottom-right",K.right,K.bottom-ve["bottom-right"]],["bottom-left",K.left,K.bottom-ve["bottom-left"]]];for(let[ot,ft,it]of Le){let It=Math.hypot(O-ft,h-it);It<H&&(H=It,Z=ot,V=Q)}}if(Z&&V){Y(V),qe(Z),yt&&Xt(null),Ht&&tt(null),Nt&&q(null),se&&fe(null),gt(!1),Re&&tn(null),qt&&Gn(null);return}}bt&&Y(null),Me&&qe(null);{let A=[];z&&zi(z)&&A.push(z);let F=z?.parentElement??null;for(;F&&F!==document.body&&A.length<3;)zi(F)&&A.push(F),F=F.parentElement;for(let Z of A){let V=Oo(Z).find(Q=>O>=Q.x&&O<=Q.x+Q.w&&h>=Q.y&&h<=Q.y+Q.h);if(V){q(Z),fe(V.axis),gt(Ls(Z,V.axis)),yt&&Xt(null),Ht&&tt(null),Re&&tn(null),qt&&Gn(null);return}}}Nt&&q(null),se&&fe(null),gt(!1);{let F=[];z&&F.push(z),Re&&Re!==z&&F.push(Re);let Z=null,H=1/0,V=null;for(let Q of F){if(!Ps(Q))continue;let K=Or(Q);if(!K)continue;let ve=O>=K.left&&O<=K.right&&h>=K.top&&h<=K.bottom,Le=[["font-size",K.right,K.top+K.height/2],["line-height",K.left+K.width/2,K.bottom]];for(let[ot,ft,it]of Le){let It=Math.hypot(O-ft,h-it);(ve||It<12)&&It<H&&(H=It,Z=ot,V=Q)}}Z&&V?(tn(V),Gn(Z)):(Re&&tn(null),qt&&Gn(null))}if(z!==yt&&Xt(z),z){let A=_r(z),F=z.getBoundingClientRect(),Z=ni(O,h,F,A);tt(Z)}else tt(null);return}if(Cn){let{handle:O,originalPoints:h,hasMoved:k}=Cn,I=e.annotations.find(H=>H.id===Cn.annotationId);if(!I)return;let z="metaKey"in y,A=z&&(y.metaKey||y.ctrlKey),F=z&&y.shiftKey,Z;if(I.type==="line"){let H=h[0],V=h[h.length-1];O==="start"?Z=[x,V]:Z=[H,x]}else if(I.type==="freehand"){let H=Math.min(...h.map(We=>We.x)),V=Math.max(...h.map(We=>We.x)),Q=Math.min(...h.map(We=>We.y)),K=Math.max(...h.map(We=>We.y)),ve=(H+V)/2,Le=(Q+K)/2,ot=V-H||1,ft=K-Q||1,it=ot/ft,It=H,$t=V,vt=Q,de=K;switch(O){case"topLeft":It=x.x,vt=x.y;break;case"topRight":$t=x.x,vt=x.y;break;case"bottomLeft":It=x.x,de=x.y;break;case"bottomRight":$t=x.x,de=x.y;break}if(A)switch(O){case"topLeft":$t=V+(H-It),de=K+(Q-vt);break;case"topRight":It=H-($t-V),de=K+(Q-vt);break;case"bottomLeft":$t=V+(H-It),vt=Q-(de-K);break;case"bottomRight":It=H-($t-V),vt=Q-(de-K);break}if(F){let We=$t-It,Qt=de-vt;if(Math.abs(We/Qt)>it){let Rt=Math.abs(Qt)*it*Math.sign(We);O==="topLeft"||O==="bottomLeft"?It=$t-Rt:$t=It+Rt}else{let Rt=Math.abs(We)/it*Math.sign(Qt);O==="topLeft"||O==="topRight"?vt=de-Rt:de=vt+Rt}}let Ue=$t-It||1,Wt=de-vt||1;Z=h.map(We=>({x:It+(We.x-H)/ot*Ue,y:vt+(We.y-Q)/ft*Wt}))}else if(I.type==="circle"){let H=h[0],V=h[h.length-1],Q=Math.min(H.x,V.x),K=Math.max(H.x,V.x),ve=Math.min(H.y,V.y),Le=Math.max(H.y,V.y),ot=(Q+K)/2,ft=(ve+Le)/2,it=K-Q,It=Le-ve,$t=Q,vt=K,de=ve,Ue=Le;switch(O){case"top":if(de=x.y,A&&(Ue=ft+(ft-x.y)),F){let We=(Ue-de)*(it/It)/2;$t=ot-We,vt=ot+We}break;case"bottom":if(Ue=x.y,A&&(de=ft-(x.y-ft)),F){let We=(Ue-de)*(it/It)/2;$t=ot-We,vt=ot+We}break;case"left":if($t=x.x,A&&(vt=ot+(ot-x.x)),F){let We=(vt-$t)*(It/it)/2;de=ft-We,Ue=ft+We}break;case"right":if(vt=x.x,A&&($t=ot-(x.x-ot)),F){let We=(vt-$t)*(It/it)/2;de=ft-We,Ue=ft+We}break}Z=[{x:$t,y:de},{x:vt,y:Ue}]}else{let H=h[0],V=h[h.length-1],Q=Math.min(H.x,V.x),K=Math.max(H.x,V.x),ve=Math.min(H.y,V.y),Le=Math.max(H.y,V.y),ot=(Q+K)/2,ft=(ve+Le)/2,it=K-Q||1,It=Le-ve||1,$t=it/It,vt=Q,de=K,Ue=ve,Wt=Le;switch(O){case"topLeft":vt=x.x,Ue=x.y;break;case"topRight":de=x.x,Ue=x.y;break;case"bottomLeft":vt=x.x,Wt=x.y;break;case"bottomRight":de=x.x,Wt=x.y;break}if(A)switch(O){case"topLeft":de=K+(Q-vt),Wt=Le+(ve-Ue);break;case"topRight":vt=Q-(de-K),Wt=Le+(ve-Ue);break;case"bottomLeft":de=K+(Q-vt),Ue=ve-(Wt-Le);break;case"bottomRight":vt=Q-(de-K),Ue=ve-(Wt-Le);break}if(F){let We=de-vt,Qt=Wt-Ue;if(Math.abs(We/Qt)>$t){let Rt=Math.abs(Qt)*$t*Math.sign(We);O==="topLeft"||O==="bottomLeft"?vt=de-Rt:de=vt+Rt}else{let Rt=Math.abs(We)/$t*Math.sign(Qt);O==="topLeft"||O==="topRight"?Ue=Wt-Rt:Wt=Ue+Rt}}Z=[{x:vt,y:Ue},{x:de,y:Wt}]}t({type:"RESIZE_ANNOTATION",payload:{id:Cn.annotationId,points:Z,saveUndo:!k}}),k||Jo({...Cn,hasMoved:!0});return}if(Ze&&(Ze.annotation.status??"pending")==="pending"){let O=x.x-Ze.startPoint.x,h=x.y-Ze.startPoint.y;if((Math.abs(O)>2||Math.abs(h)>2)&&!Ze.hasMoved)ho({...Ze,hasMoved:!0,startPoint:x}),t({type:"MOVE_ANNOTATION",payload:{id:Ze.annotation.id,delta:{x:O,y:h},saveUndo:!0}});else if(Ze.hasMoved){let I=x.x-Ze.startPoint.x,z=x.y-Ze.startPoint.y;ho({...Ze,startPoint:x}),t({type:"MOVE_ANNOTATION",payload:{id:Ze.annotation.id,delta:{x:I,y:z}}})}return}!N||!e.isAnnotating||t({type:"CONTINUE_PATH",payload:x})},[N,e.isAnnotating,e.activeTool,Ze,Cn,G,yt,Ht,bt,Me,Nt,se,Re,qt,Uo,t,ao,ni]),ee=sn(y=>{if(dt.current.isDragging){let h=dt.current,k=h.element;if(k&&h.selector&&h.elementInfo&&zt){k instanceof HTMLElement&&(k.style.removeProperty("font-size"),k.style.removeProperty("line-height"),k.style.removeProperty("transition"));let I=[];if(h.originalFontSize!==zt.fontSize&&(et(k,"font-size",`${zt.fontSize}px`),I.push({property:"font-size",original:`${h.originalFontSize}px`,modified:`${zt.fontSize}px`})),h.originalLineHeight!==zt.lineHeight){let z=h.originalFontSize>0?Math.round(h.originalLineHeight/h.originalFontSize*1e3)/1e3:1.2,A=zt.fontSize>0?Math.round(zt.lineHeight/zt.fontSize*1e3)/1e3:1.2;et(k,"line-height",`${A}`),I.push({property:"line-height",original:`${z}`,modified:`${A}`})}I.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:h.selector,durableSelector:h.durableSelector??void 0,element:h.elementInfo,changes:I}})}dt.current={isDragging:!1,property:null,startX:0,startY:0,originalFontSize:0,originalLineHeight:0,originalRatio:1.2,element:null,elementInfo:null,selector:null,durableSelector:null},Mo(null);return}if(ln.current.isDragging){let h=ln.current,k=h.element,I="button"in y&&y.button===2;if(!h.hasMoved&&!I&&k&&h.selector&&h.elementInfo){k instanceof HTMLElement&&k.style.removeProperty("transition");let z=["space-between","space-around","stretch","normal"],A=h.originalJustifyContent||"normal",F=z.indexOf(A),Z=z[(F+1)%z.length],H=[];Z==="normal"?(et(k,"justify-content","normal"),H.push({property:"justify-content",original:h.originalJustifyContent,modified:"normal"})):Z==="stretch"?(et(k,"justify-content",Z),et(k,"row-gap","8px"),et(k,"column-gap","8px"),H.push({property:"justify-content",original:h.originalJustifyContent||"normal",modified:Z}),h.originalRow!==8&&H.push({property:"row-gap",original:`${h.originalRow}px`,modified:"8px"}),h.originalColumn!==8&&H.push({property:"column-gap",original:`${h.originalColumn}px`,modified:"8px"})):(k instanceof HTMLElement&&(k.style.removeProperty("row-gap"),k.style.removeProperty("column-gap")),et(k,"justify-content",Z),H.push({property:"justify-content",original:h.originalJustifyContent||"normal",modified:Z}),h.originalRow>0&&H.push({property:"row-gap",original:`${h.originalRow}px`,modified:"0px"}),h.originalColumn>0&&H.push({property:"column-gap",original:`${h.originalColumn}px`,modified:"0px"})),H.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:h.selector,durableSelector:h.durableSelector??void 0,element:h.elementInfo,changes:H}})}else if(h.hasMoved&&k&&h.selector&&h.elementInfo&&Ie){k instanceof HTMLElement&&(k.style.removeProperty("row-gap"),k.style.removeProperty("column-gap"),k.style.removeProperty("transition"));let z=[];h.isAuto?(k instanceof HTMLElement&&k.style.removeProperty("justify-content"),et(k,"justify-content","normal"),et(k,"row-gap",`${Ie.row}px`),et(k,"column-gap",`${Ie.column}px`),z.push({property:"justify-content",original:h.originalJustifyContent,modified:"normal"}),z.push({property:"row-gap",original:"0px",modified:`${Ie.row}px`}),z.push({property:"column-gap",original:"0px",modified:`${Ie.column}px`})):(h.originalRow!==Ie.row&&(et(k,"row-gap",`${Ie.row}px`),z.push({property:"row-gap",original:`${h.originalRow}px`,modified:`${Ie.row}px`})),h.originalColumn!==Ie.column&&(et(k,"column-gap",`${Ie.column}px`),z.push({property:"column-gap",original:`${h.originalColumn}px`,modified:`${Ie.column}px`}))),z.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:h.selector,durableSelector:h.durableSelector??void 0,element:h.elementInfo,changes:z}})}ln.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},rt(null);return}if(He.current.isDragging){let h=He.current,k=h.element;if(k&&h.selector&&h.elementInfo&&kt){k instanceof HTMLElement&&(k.style.removeProperty("border-top-left-radius"),k.style.removeProperty("border-top-right-radius"),k.style.removeProperty("border-bottom-right-radius"),k.style.removeProperty("border-bottom-left-radius"),k.style.removeProperty("transition"));let I=["top-left","top-right","bottom-right","bottom-left"],z={"top-left":"border-top-left-radius","top-right":"border-top-right-radius","bottom-right":"border-bottom-right-radius","bottom-left":"border-bottom-left-radius"},A=[];for(let F of I)h.original[F]!==kt.radius[F]&&(et(k,z[F],`${kt.radius[F]}px`),A.push({property:z[F],original:`${h.original[F]}px`,modified:`${kt.radius[F]}px`}));A.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:h.selector,durableSelector:h.durableSelector??void 0,element:h.elementInfo,changes:A}})}He.current={isDragging:!1,corner:null,startY:0,original:{"top-left":0,"top-right":0,"bottom-right":0,"bottom-left":0},maxRadius:0,element:null,elementInfo:null,selector:null,durableSelector:null},cn(null);return}if(Je.current.isDragging){let h=Je.current,k=h.element,I=h.selector,z=h.elementInfo;if(k&&I&&z&&Xe){let A=h.original,F=Xe.padding;k instanceof HTMLElement&&(k.style.removeProperty("padding"),k.style.removeProperty("transition"));let Z=[],H=[{prop:"padding-top",origVal:A.top,newVal:F.top},{prop:"padding-right",origVal:A.right,newVal:F.right},{prop:"padding-bottom",origVal:A.bottom,newVal:F.bottom},{prop:"padding-left",origVal:A.left,newVal:F.left}];for(let{prop:V,origVal:Q,newVal:K}of H)Q!==K&&(et(k,V,`${K}px`),Z.push({property:V,original:`${Q}px`,modified:`${K}px`}));Z.length>0&&t({type:"MODIFY_STYLES_BATCH",payload:{selector:I,durableSelector:h.durableSelector??void 0,element:z,changes:Z}})}Je.current={isDragging:!1,side:null,startX:0,startY:0,original:{top:0,right:0,bottom:0,left:0},element:null,elementInfo:null,selector:null,durableSelector:null},Et(null);return}if(Cn){Jo(null);return}if(Ze){if(!Ze.hasMoved&&Ze.annotation.type==="text"&&(Ze.annotation.status??"pending")==="pending"){let h=Uo(y);$({id:Ze.annotation.id,point:Ze.annotation.points[0],text:Ze.annotation.text||"",fontSize:Ze.annotation.fontSize||12,isNew:!1,clickPoint:h,groupId:Ze.annotation.groupId})}ho(null);return}if(!N)return;let x=5;if(e.currentPath.length>=2){let h=e.currentPath[0],k=e.currentPath[e.currentPath.length-1],I=Math.abs(k.x-h.x),z=Math.abs(k.y-h.y);if((e.activeTool==="line"?Math.sqrt(I*I+z*z)<x:I<x&&z<x)&&["rectangle","circle","line"].includes(e.activeTool)){g(!1),t({type:"CANCEL_PATH"});return}}let O=Ts(e.currentPath);if(e.activeTool==="rectangle"&&e.currentPath.length>=2){let h=e.currentPath[0],k=e.currentPath[e.currentPath.length-1],I=Math.min(h.x,k.x),z=Math.max(h.y,k.y),A=e.strokeWidth/2,F=Math.random().toString(36).substring(2,9);Ee({point:{x:I-A+4,y:z+A+4},groupId:F}),g(!1),t({type:"FINISH_PATH",payload:{groupId:F,elements:O}});return}g(!1),t({type:"FINISH_PATH",payload:{elements:O}})},[N,Ze,Cn,Xe,kt,Ie,zt,Uo,t,e.activeTool,e.currentPath,e.strokeWidth]),ie=sn(y=>{let x=y.target.value;pn.current=y.target.selectionStart,$(O=>O&&{...O,text:x})},[]),Se=sn(y=>{y.key==="Escape"?$(null):y.key==="Enter"&&!y.shiftKey&&(y.preventDefault(),Ko())},[Ko]),Ce=sn(y=>{if(!m)return;let x=y.clipboardData.items,O=[];for(let h=0;h<x.length;h++){let k=x[h];if(k.type.startsWith("image/")){let I=k.getAsFile();I&&O.push(I)}}O.length>0&&(y.preventDefault(),$(h=>h?{...h,images:[...h.images||[],...O]}:null))},[m]),Fe=sn(y=>{if(!e.isAnnotating)return;if(e.activeTool==="hand"){y.preventDefault();let O=yt||Nt||bt||Re;if(O&&!Wo(O)){let h=Nn(O),k=Vn(O);t({type:"SELECT_ELEMENT",payload:{el:O,info:{...h,selector:k}}})}return}y.preventDefault();let x=v.current;x&&(T.current=!0,x.style.pointerEvents="none",setTimeout(()=>{T.current&&(T.current=!1,x.style.pointerEvents="")},4e3))},[e.activeTool,e.isAnnotating,yt,Nt,bt,Re,t,Wo,v]);In(()=>{let y=ae.filter(z=>z.linkedSelector);if(y.length===0)return;let x=null,O=document.createElement("canvas").getContext("2d"),h=()=>{let z=[];for(let A of y){let F=document.querySelector(A.linkedSelector);if(!F&&A.elements?.[0]?.selector&&A.linkedSelector.startsWith("[data-pm=")){try{F=document.querySelector(A.elements[0].selector)}catch{}if(F){let it=A.linkedSelector.match(/data-pm="([^"]+)"/)?.[1];it&&F.setAttribute("data-pm",it)}}if(!F)continue;let Z=F.getBoundingClientRect(),H=le.some(it=>{try{return F.matches(it.selector)}catch{return!1}}),V=y.filter(it=>it.id!==A.id&&it.timestamp<A.timestamp&&it.linkedSelector===A.linkedSelector).length,Q=(H?1:0)+V,K;if(A.text&&O){let it=A.fontSize||12;O.font=`${it}px ${rn}`,K=Math.max(...A.text.split(`
|
|
5
|
+
`).map(It=>O.measureText(It).width))}let ve=Z.top>=Zo*(1+Q)?"top-left":"bottom-left",Le=Ec(Z,ve,Q,R?.current,K),ot=A.points[0],ft=ve!==A.linkedAnchor;ot&&(ft||Math.abs(Le.x-ot.x)>1||Math.abs(Le.y-ot.y)>1)&&z.push({id:A.id,point:Le,linkedAnchor:ft?ve:void 0})}z.length>0&&t({type:"UPDATE_LINKED_POSITIONS",payload:{updates:z}})},k=()=>{x&&cancelAnimationFrame(x),x=requestAnimationFrame(h)};h(),window.addEventListener("scroll",k,!0),window.addEventListener("resize",k,!0),window.addEventListener("load",k),document.fonts.ready.then(k);let I=new MutationObserver(k);return I.observe(document.body,{attributes:!0,childList:!0,subtree:!0,attributeFilter:["style","class"]}),()=>{window.removeEventListener("scroll",k,!0),window.removeEventListener("resize",k,!0),window.removeEventListener("load",k),I.disconnect(),x&&cancelAnimationFrame(x)}},[ae,t]);let he=()=>{if(!e.isAnnotating)return"default";if(Cn){let{handle:y}=Cn;return y==="start"||y==="end"?"move":y==="top"||y==="bottom"?"ns-resize":y==="left"||y==="right"?"ew-resize":y==="topLeft"||y==="bottomRight"?"nwse-resize":"nesw-resize"}if(e.activeTool==="text")return"text";if(e.activeTool==="hand"){let y=Ie?.axis??se;if(y==="row")return"ns-resize";if(y==="column")return"ew-resize";if(kt||Me)return"ns-resize";let x=zt?.property??qt;if(x==="font-size")return"ew-resize";if(x==="line-height")return"ns-resize";let O=Xe?.side??Ht;return O==="top"||O==="bottom"?"ns-resize":O==="left"||O==="right"?"ew-resize":"default"}return"crosshair"},Ne={position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:9998,pointerEvents:e.isAnnotating?"auto":"none",visibility:e.isAnnotating?"visible":"hidden",cursor:he()},pt=sn(()=>{let y=v.current;if(!y||!m)return{width:100,height:12*1.4,isWrapped:!1};let x=y.getContext("2d");if(!x)return{width:100,height:m.fontSize*1.4,isWrapped:!1};x.font=`${m.fontSize}px ${rn}`;let h=x.measureText("Type here...").width,k=m.text.split(`
|
|
6
|
+
`),I=k.length>0?Math.max(h,...k.map(H=>x.measureText(H||" ").width)):h,z=m.point.x-Zt.x,A=ci(z);if(I>A){let H=Nl(x,k,A),V=Math.min(A,Math.max(h,...H.map(K=>x.measureText(K).width))),Q=Math.max(1,H.length)*m.fontSize*1.4;return{width:V,height:Q,isWrapped:!0}}let Z=Math.max(1,k.length)*m.fontSize*1.4;return{width:I,height:Z,isWrapped:!1}},[m,v,Zt.x])(),wt=m?Math.max(1,m.text.split(`
|
|
7
|
+
`).length)*m.fontSize*1.4+8:0,lo=pt.height+8,rr=pt.isWrapped?lo-wt:0,ir=m?m.point.y-4-Zt.y-rr:0,Ci=m?m.point.x-4-Zt.x:0,Ei=pt.width+8,ys=m?Fs(ir,lo,ge,Ci,Ei):0,Xo=m?{position:"fixed",left:Ci,top:ys,zIndex:9999,width:Ei,height:lo,padding:4,fontSize:m.fontSize,fontFamily:rn,color:"#ffffff",backgroundColor:e.activeColor,border:"none",borderRadius:0,outline:"none",boxShadow:"none",lineHeight:1.4,resize:"none",overflow:"hidden",whiteSpace:pt.isWrapped?"pre-wrap":"pre",wordBreak:pt.isWrapped?"break-word":void 0}:{},Mr=y=>y?e.annotations.find(x=>x.id===y)?.linkedSelector??null:null,Qe=(y,x)=>{if(!x)return!1;try{return y.matches(x)}catch{return!1}},nn=[m?.linkedSelector,Te?.linkedSelector,Mr(L),Mr(st),nt].filter(Boolean),fn=y=>nn.some(x=>Qe(y,x));return Xr(qr,{children:[ht("canvas",{ref:J,id:"devtools-canvas",style:Ne,onMouseDown:S,onMouseMove:P,onMouseUp:y=>ee(y),onMouseLeave:y=>{ee(y),ce(null),Oe(null)},onTouchStart:S,onTouchMove:P,onTouchEnd:y=>ee(y),onContextMenu:Fe}),m&&Xr(qr,{children:[ht("style",{children:"#devtools-text-input::placeholder { color: rgba(255, 255, 255, 0.5); }"}),ht("textarea",{id:"devtools-text-input",ref:_,value:m.text,onChange:ie,onKeyDown:Se,onPaste:Ce,onBlur:Ko,placeholder:"Type here...",style:Xo}),m.images&&m.images.length>0&&Xr("div",{"data-devtools":!0,style:{position:"fixed",left:m.point.x-4-Zt.x,top:m.point.y-4-Zt.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:[m.images.length," image",m.images.length>1?"s":""," attached"]})]}),e.isAnnotating&&e.activeTool!=="hand"&&le.length>0&&ht(tc,{styleModifications:le,isInspecting:!!e.inspectedElement,accentColor:e.activeColor,annotationGroupCount:new Set(ae.map(y=>y.groupId||y.id)).size,dispatch:t,inFlightSelectors:a,toolbarRef:R,onHoverSelector:lt}),e.activeTool==="hand"&&e.isAnnotating&&le.length>0&&ht(oc,{styleModifications:le,accentColor:e.activeColor}),e.isAnnotating&&ht(Jl,{annotations:ae,supersededAnnotations:mt,inFlightIds:o,activeIds:r,queuePositions:i,scrollX:Zt.x,scrollY:Zt.y,annotationGroupMap:Ft,onViewThread:c,onSelectAnnotation:wn,onHoverAnnotation:Pe,canvasRef:v,toolbarRef:R}),e.isAnnotating&&s&&s.size>0&&ht(Ys,{inFlightSelectorColors:s}),e.isAnnotating&&at&&ht(Ys,{inFlightSelectorColors:at,animated:!1}),e.activeTool==="hand"&&e.isAnnotating&&(Ie?ln.current.element:Nt)&&ht(Qs,{element:Ie?ln.current.element:Nt,gap:Ie?{row:Ie.row,column:Ie.column}:gr(Nt),accentColor:e.activeColor,hoveredAxis:se,draggingAxis:Ie?.axis??null,cursorViewport:Sn,isAutoGap:ct,refreshKey:Ut}),e.activeTool==="hand"&&e.isAnnotating&&hn&&ht(Sc,{element:hn.target,modifier:hn.modifier,accentColor:e.activeColor,refreshKey:Ut}),e.activeTool==="hand"&&e.isAnnotating&&!hn&&(kt?He.current.element:bt)&&ht(Xl,{element:kt?He.current.element:bt,radius:kt?.radius??mr(bt),accentColor:e.activeColor,hoveredCorner:Me,draggingCorner:kt?.corner??null,cursorViewport:Sn}),e.activeTool==="hand"&&e.isAnnotating&&!hn&&(zt?dt.current.element:Re)&&ht(wc,{element:zt?dt.current.element:Re,fontSize:zt?.fontSize??si(Re).fontSize,lineHeight:zt?.lineHeight??si(Re).lineHeight,accentColor:e.activeColor,hoveredProperty:qt,draggingProperty:zt?.property??null,cursorViewport:Sn}),e.activeTool==="hand"&&e.isAnnotating&&!hn&&(Xe?Je.current.element:yt)&&ht(ra,{element:Xe?Je.current.element:yt,padding:Xe?.padding??_r(yt),accentColor:e.activeColor,hoveredSide:Ht,draggingSide:Xe?.side??null,cursorViewport:Sn,refreshKey:zt?zt.fontSize+zt.lineHeight*1e3:0}),e.activeTool==="inspector"&&e.isAnnotating&&ht(qr,{children:G&&!e.inspectedElement&&(()=>{if(fn(G))return null;let y=!!Te||!!m?.linkedSelector||ae.some(x=>{if(!x.linkedSelector)return!1;try{return G.matches(x.linkedSelector)}catch{return!1}});return ht(wo,{element:G,isSelected:!1,elementInfo:te,color:e.activeColor,hideTooltip:y})})()}),(m?.linkedSelector||Te?.linkedSelector)&&(()=>{let y=m?.linkedSelector||Te?.linkedSelector;if(!y)return null;let x=null;try{x=document.querySelector(y)}catch{}return x?ht(wo,{element:x,isSelected:!0,color:e.activeColor,hideTooltip:!0}):null})(),L&&(()=>{let y=e.annotations.find(h=>h.id===L);if(!y?.linkedSelector)return null;let x=null;try{x=document.querySelector(y.linkedSelector)}catch{}if(!x)return null;let O=!!(o&&o.has(y.id));return ht(wo,{element:x,isSelected:!O,color:y.color,hideTooltip:!0})})(),st&&(()=>{let y=e.annotations.find(k=>k.id===st);if(!y?.linkedSelector)return null;let x=null;try{x=document.querySelector(y.linkedSelector)}catch{}if(!x)return null;let O=y.groupId?e.annotations.filter(k=>k.groupId===y.groupId):[y],h=!!(o&&O.some(k=>o.has(k.id)));return ht(wo,{element:x,isSelected:!h,color:y.color,hideTooltip:!0})})(),nt&&(()=>{let y=null;try{y=document.querySelector(nt)}catch{}if(!y)return null;let x=!!(a&&a.has(nt));return ht(wo,{element:y,isSelected:!x,color:e.activeColor,hideTooltip:!0})})(),e.activeTool==="model"&&e.isAnnotating&&Ge.size>0&&[...Ge.entries()].map(([y,x])=>ht(wo,{element:x.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:x.rootElement.tagName.toLowerCase(),reactComponent:y},color:"#8b5cf6"},y)),e.activeTool==="model"&&e.isAnnotating&&Lo&&ht(wo,{element:Lo.rootElement,isSelected:!0,elementInfo:{selector:"",tagName:Lo.rootElement.tagName.toLowerCase(),reactComponent:Lo.name},color:"#22c55e"}),e.activeTool==="model"&&e.isAnnotating&&Po.length>0&&Po.map((y,x)=>ht("div",{style:{position:"absolute",left:y.x,top:y.y,width:y.width,height:y.height,backgroundColor:"rgba(255, 0, 0, 0.08)",pointerEvents:"none",zIndex:9998},children:y.direction==="vertical"?Xr(qr,{children:[ht("div",{style:{position:"absolute",left:"50%",top:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ht("div",{style:{position:"absolute",left:"50%",top:0,bottom:0,width:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ht("div",{style:{position:"absolute",left:"50%",bottom:0,width:6,height:1,backgroundColor:"#FF0000",transform:"translateX(-50%)"}}),ht("div",{style:{position:"absolute",left:"calc(50% + 6px)",top:y.height<16?-6:"50%",transform:y.height<16?"none":"translateY(-50%)",fontSize:11,fontWeight:600,color:"#fff",backgroundColor:"#FF0000",padding:"2px 4px",whiteSpace:"nowrap",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1},children:Math.round(y.height)})]}):Xr(qr,{children:[ht("div",{style:{position:"absolute",left:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ht("div",{style:{position:"absolute",left:0,right:0,top:"50%",height:1,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ht("div",{style:{position:"absolute",right:0,top:"50%",width:1,height:6,backgroundColor:"#FF0000",transform:"translateY(-50%)"}}),ht("div",{style:{position:"absolute",left:y.width<30?0:"50%",top:(y.width<30,void 0),bottom:"calc(50% + 4px)",transform:y.width<30?"none":"translateX(-50%)",fontSize:11,fontWeight:600,color:"#fff",backgroundColor:"#FF0000",padding:"2px 4px",whiteSpace:"nowrap",fontFamily:'ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace',lineHeight:1},children:Math.round(y.width)})]})},x)),e.activeTool==="model"&&e.isAnnotating&&re&&ht(wo,{element:re.rootElement,isSelected:!1,elementInfo:{selector:"",tagName:re.rootElement.tagName.toLowerCase(),reactComponent:re.name},color:b?.has(re.name)?"#22c55e":"#8b5cf6"}),e.activeTool==="hand"&&e.isAnnotating&&e.inspectedElement&&Xr(qr,{children:[Ve&&Ve!=="padding"&&Ve!=="gap"&&(()=>{let y=new Set(ae.map(A=>A.groupId||A.id)).size,x=e.inspectedElement.info.selector,O=le.findIndex(A=>A.selector===x),h=O>=0?y+O+1:y+le.length+1,k=le.find(A=>A.selector===x),I=k?.changes.length??0,z=!!k?.captured;return ht(wo,{element:e.inspectedElement.el,isSelected:!0,elementInfo:e.inspectedElement.info,color:z?"#999999":e.activeColor,annotationNumber:h,changeCount:I})})(),Ve==="padding"&&ht(ra,{element:e.inspectedElement.el,padding:_r(e.inspectedElement.el),accentColor:e.activeColor,hoveredSide:null,draggingSide:null}),Ve==="gap"&&ht(Qs,{element:e.inspectedElement.el,gap:gr(e.inspectedElement.el),accentColor:e.activeColor,hoveredAxis:null,draggingAxis:null}),ht(vc,{element:e.inspectedElement.el,elementInfo:e.inspectedElement.info,selector:e.inspectedElement.info.selector,styleModifications:le,dispatch:t,onClose:()=>t({type:"SELECT_ELEMENT",payload:null}),onHover:Yt,accentColor:e.activeColor,toolbarRef:R})]})]})}import{useCallback as Kn,useEffect as mn,useMemo as wr,useRef as _t,useState as Cr}from"react";import{Check as Hg,Circle as Ng,Component as zg,Fingerprint as Fg,Hand as $g,MessageCircle as Wg,Pen as jg,RefreshCw as Gg,Slash as Jg,Square as Vg,Trash2 as Yg,Type as Ug}from"lucide-react";import{useEffect as Tc,useRef as Ic}from"react";function Mc(e,t,n,o,r){let i=Ic(0),a=Ic(t.annotations);Tc(()=>{if(!n.current||!e)return;a.current=t.annotations;let s=t.annotations.length;s>0&&(s>=i.current||!o)&&(localStorage.setItem(r.annotations,JSON.stringify(t.annotations)),i.current=s)},[t.annotations,e,o,n,r]),Tc(()=>{n.current&&(localStorage.setItem(r.expanded,String(e)),e&&(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.styleModifications,t.spacingTokenChanges,t.activeTool,t.activeColor,t.strokeWidth,t.inspectedElement,n,r])}import{useCallback as Dn,useEffect as vr,useMemo as va,useRef as mi,useState as Eo}from"react";import{Fragment as Nf,jsx as Pt,jsxs as po}from"react/jsx-runtime";var bf={width:340,backgroundColor:"#eaeaea",...Gr,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"},vf=(e,t)=>({width:"100%",border:"1px solid rgba(0,0,0,0.12)",background:t?"rgba(0,0,0,0.04)":"rgba(0,0,0,0.02)",cursor:e?"default":"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"5px 8px",color:e?"#9ca3af":"#6b7280"}),xf=e=>({border:0,background:"transparent",color:e?"#111827":"#6b7280",cursor:"pointer",fontFamily:"inherit",fontSize:10,fontWeight:700,padding:0,textTransform:"uppercase"}),xa={border:"1px solid rgba(0,0,0,0.12)",background:"rgba(0,0,0,0.02)",cursor:"pointer",fontFamily:"inherit",fontSize:10,fontWeight:650,color:"#6b7280",padding:"6px 8px",flex:1},ts={...xa,borderColor:"#111827",background:"#111827",color:"#ffffff"},Sf={...ts,cursor:"default",opacity:.55},Sa={display:"block",width:"100%",border:0,background:"transparent",boxSizing:"border-box",color:"inherit",cursor:"text",font:"inherit",lineHeight:1.25,margin:0,padding:0,textAlign:"left"},wf={...Sa,appearance:"none",resize:"none",overflow:"hidden",outline:"none"},Pc={...Sa,fontWeight:700,fontSize:11,lineHeight:1.35},Cf={...Pc,appearance:"none",resize:"none",overflow:"hidden",outline:"none"},Rc={display:"grid",gridTemplateColumns:"12px minmax(0, 1fr)",columnGap:4,alignItems:"start",marginBottom:5},Ef={pass:"#2f855a",fail:"#c53030",needs_review:"#6b7280"},kf={pass:"\u2611",fail:"\u2612",needs_review:"\u25A1"},Tf=e=>e?e.charAt(0).toUpperCase()+e.slice(1):"Eval",If=[{id:"pending",label:"Pending"},{id:"approved",label:"Approved"},{id:"rejected",label:"Rejected"}],Ac="popmelt-eval-active-status",Mf=e=>e==="pending"||e==="approved"||e==="rejected";function Bc({bridgeUrl:e,refreshKey:t,onMouseEnter:n,onMouseLeave:o,onSynthesize:r,isSynthesizing:i,onRunEval:a,onViewRunThread:s,runningEvalIds:l=[],snapPosition:c="bottom-right"}){let d=mi(null),u=i||!r,[p,f]=Eo({version:1,updatedAt:0,cases:[]}),[b,C]=Eo(!0),[w,M]=Eo(()=>{if(typeof window>"u")return"pending";try{let T=window.localStorage.getItem(Ac);return Mf(T)?T:"pending"}catch{return"pending"}});vr(()=>{let T=d.current;if(!T)return;let N=n,g=o;return N&&T.addEventListener("mouseenter",N),g&&T.addEventListener("mouseleave",g),()=>{N&&T.removeEventListener("mouseenter",N),g&&T.removeEventListener("mouseleave",g)}},[n,o]);let L=Dn(()=>{e&&(C(!0),Ka(e).then(T=>{f(T),C(!1)}).catch(()=>C(!1)))},[e]);vr(()=>{L()},[L,t]),vr(()=>{try{window.localStorage.setItem(Ac,w)}catch{}},[w]);let E=Dn((T,N)=>{e&&(f(g=>({...g,cases:g.cases.map(m=>m.id===T?{...m,status:N}:m)})),Xa(T,N,e).then(g=>{g||L()}).catch(L))},[e,L]),R=Dn((T,N)=>{if(!e)return;let g=N.map(m=>m.trim()).filter(Boolean);g.length!==0&&(f(m=>({...m,cases:m.cases.map($=>$.id===T?{...$,assertions:g}:$)})),Ti(T,{assertions:g},e).then(m=>{m||L()}).catch(L))},[e,L]),v=Dn((T,N)=>{if(!e)return;let g=N.trim();g&&(f(m=>({...m,cases:m.cases.map($=>$.id===T?{...$,title:g}:$)})),Ti(T,{title:g},e).then(m=>{m||L()}).catch(L))},[e,L]),D=va(()=>{let T=p.cases.filter(m=>m.status==="pending"),N=p.cases.filter(m=>m.status==="approved"),g=p.cases.filter(m=>m.status==="rejected");return{pending:T,approved:N,rejected:g}},[p.cases]),j=D[w],J=va(()=>{let T=new Map,N=[...p.runs??[]].sort((g,m)=>m.completedAt-g.completedAt);for(let g of N)T.has(g.evalId)||T.set(g.evalId,g);return T},[p.runs]);return po("div",{ref:d,style:{...bf,...Pi(c)},children:[po("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[Pt("span",{children:"Evals"}),Pt("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"E"})]}),Pt("button",{type:"button",disabled:u,onClick:r,style:vf(u,i),children:i?"Synthesizing...":"Synthesize"}),Pt("div",{style:{display:"flex",gap:12,marginTop:8},children:If.map(T=>Pt(Pf,{active:w===T.id,label:`${T.label} ${D[T.id].length}`,onClick:()=>M(T.id)},T.id))}),Pt("div",{style:{marginTop:10,flex:1,minHeight:0,overflowY:"auto",display:"flex",flexDirection:"column",gap:10},children:b?Pt("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):p.cases.length===0?Pt("div",{style:{color:"#9ca3af",fontSize:11,lineHeight:1.5},children:"No inferred evals yet."}):j.length===0?po("div",{style:{color:"#9ca3af",fontSize:11,lineHeight:1.5},children:["No ",w," evals."]}):Pt(Rf,{cases:j,latestRunsByEvalId:J,runningEvalIds:l,onStatus:E,onRun:a,onViewRunThread:s,onTitleChange:v,onAssertionsChange:R})})]})}function Rf({cases:e,latestRunsByEvalId:t,runningEvalIds:n,onStatus:o,onRun:r,onViewRunThread:i,onTitleChange:a,onAssertionsChange:s}){return Pt("div",{style:{display:"flex",flexDirection:"column",gap:6},children:e.map(l=>{let c=new Set([...l.sourceDecisionIds,...l.sourceThreadIds]).size,d=c>0?`, ${c} ${c===1?"mention":"mentions"}`:"",u=t.get(l.id),p=n.includes(l.id);return po("div",{style:{border:"1px solid rgba(0,0,0,0.08)",background:"rgba(255,255,255,0.35)",padding:8},children:[po("div",{children:[Pt(Bf,{value:l.title,onCommit:f=>a(l.id,f)}),po("div",{style:{color:"#9ca3af",fontSize:10,marginTop:2},children:[Tf(l.category),d]})]}),Pt("div",{style:{marginTop:6,color:"#374151",fontSize:11,lineHeight:1.25},children:Pt(Hf,{assertions:l.assertions,latestRun:u,onChange:f=>s(l.id,f)})}),Pt(Lf,{item:l,latestRun:u,isRunning:p,onStatus:o,onRun:r,onViewRunThread:i})]},l.id)})})}function Af(e){let t=e.assertionResults.length;if(t===0)return e.status==="pass"?"Pass":"Review";let n=e.assertionResults.reduce((r,i)=>(r[i.status]+=1,r),{pass:0,fail:0,needs_review:0}),o=n.fail+n.needs_review;return o===0?`${n.pass||t} Pass`:`Review ${o||t}`}function Lf({item:e,latestRun:t,isRunning:n,onStatus:o,onRun:r,onViewRunThread:i}){if(e.status==="pending")return po("div",{style:{display:"flex",gap:6,marginTop:8},children:[Pt("button",{type:"button",style:xa,onClick:()=>o(e.id,"rejected"),children:"Reject"}),Pt("button",{type:"button",style:ts,onClick:()=>o(e.id,"approved"),children:"Accept"})]});if(e.status==="approved"){let a=n||!r;return po("div",{style:{display:"flex",gap:6,marginTop:8},children:[t?.threadId&&i&&Pt("button",{type:"button",style:xa,onClick:()=>i(t.threadId),children:Af(t)}),Pt("button",{type:"button",disabled:a,style:a?Sf:ts,onClick:()=>r?.(e),children:n?"Running...":"Run"})]})}return Pt("div",{style:{display:"flex",gap:6,marginTop:8},children:Pt("button",{type:"button",style:ts,onClick:()=>o(e.id,"approved"),children:"Approve"})})}function Pf({active:e,label:t,onClick:n}){let[o,r]=Eo(!1);return Pt("button",{type:"button",style:xf(e||o),onMouseEnter:()=>r(!0),onMouseLeave:()=>r(!1),onClick:n,children:t})}function Bf({value:e,onCommit:t}){let[n,o]=Eo(!1),[r,i]=Eo(e),a=mi(null);vr(()=>{n||i(e)},[n,e]),vr(()=>{if(!n)return;let d=a.current;d&&(d.focus(),d.select(),d.style.height="auto",d.style.height=`${d.scrollHeight}px`)},[n]);let s=Dn(()=>{let d=r.trim();o(!1),d&&d!==e?t(d):i(e)},[r,t,e]),l=Dn(()=>{i(e),o(!1)},[e]),c=Dn(d=>{d.key==="Enter"?(d.preventDefault(),s()):d.key==="Escape"&&(d.preventDefault(),l())},[l,s]);return n?Pt("textarea",{ref:a,rows:1,value:r,onChange:d=>{i(d.target.value),d.currentTarget.style.height="auto",d.currentTarget.style.height=`${d.currentTarget.scrollHeight}px`},onBlur:s,onKeyDown:c,style:Cf}):Pt("button",{type:"button",onClick:()=>o(!0),style:Pc,children:e})}function Df(e){return e.map(t=>t.trim()).filter(Boolean)}function _f(e,t){return e.length===t.length&&e.every((n,o)=>n===t[o])}function Lc(e){e.style.height="auto",e.style.height=`${e.scrollHeight}px`}function Of(e){let t=window.getComputedStyle(e),n=Number.parseFloat(t.lineHeight)||Number.parseFloat(t.fontSize)*1.2||16,o=document.createElement("div"),r=document.createElement("span"),i=document.createElement("span");o.style.position="fixed",o.style.visibility="hidden",o.style.pointerEvents="none",o.style.left="-9999px",o.style.top="0",o.style.width=`${e.clientWidth}px`,o.style.boxSizing=t.boxSizing,o.style.font=t.font,o.style.letterSpacing=t.letterSpacing,o.style.lineHeight=t.lineHeight,o.style.padding=t.padding,o.style.border=t.border,o.style.whiteSpace="pre-wrap",o.style.overflowWrap="break-word",o.style.wordBreak=t.wordBreak;let a=e.selectionStart??0;o.textContent=e.value.slice(0,a),r.textContent="\u200B",o.appendChild(r),o.appendChild(document.createTextNode(e.value.slice(a)||"\u200B")),i.textContent="\u200B",o.appendChild(i),document.body.appendChild(o);let s=Math.max(0,Math.round(r.offsetTop/n)),l=Math.max(0,Math.round(i.offsetTop/n));return o.remove(),{lineIndex:s,lastLineIndex:l}}function Hf({assertions:e,latestRun:t,onChange:n}){let[o,r]=Eo(null),[i,a]=Eo(e),[s,l]=Eo(null),[c,d]=Eo(0),u=mi([]),p=mi(null),f=mi(!1),b=o!==null,C=b?i.length+1:i.length,w=va(()=>{let N=new Map;for(let g of t?.assertionResults??[])N.set(g.assertion.trim(),g);return N},[t]);vr(()=>{b||a(e)},[e,b]),vr(()=>{if(s===null)return;let N=requestAnimationFrame(()=>{let g=u.current[s];if(g){if(g.focus(),p.current==="select"&&g.value)g.select();else if(p.current==="start")g.setSelectionRange(0,0);else if(p.current==="end"){let m=g.value.length;g.setSelectionRange(m,m)}p.current=null,Lc(g)}});return()=>cancelAnimationFrame(N)},[s,c,C]);let M=Dn((N,g=null)=>{p.current=g,r(N),l(N),d(m=>m+1)},[]),L=Dn(N=>{let g=Df(N);return g.length===0?(a(e),e):(a(g),_f(g,e)||n(g),g)},[e,n]),E=Dn(N=>{M(N,"select")},[M]),R=Dn((N,g)=>{a(m=>{let $=[...m];if(N>=$.length){if(g.length===0)return $;$.push(g)}else $[N]=g;return $})},[]),v=Dn((N,g)=>{let m=[...i],me=(N<m.length?m[N]??"":"").trim();if(N>=m.length){let Ee=g?.focusPlaceholder?m.length:g?.focusIndex;Ee!==void 0?M(Ee,g?.focusMode):(r(null),l(null));return}if(!me){if(g?.deleteEmpty){m.splice(N,1);let Ee=L(m),Te=g.focusPlaceholder?Ee.length:g.focusIndex;if(Te!==void 0){let X=Math.min(Te,Ee.length);M(X)}else r(null),l(null)}else m[N]=e[N]??"",a(m),g?.focusIndex!==void 0?M(g.focusIndex,g.focusMode):(r(null),l(null));return}m[N]=me;let ke=L(m),ue=g?.focusPlaceholder?ke.length:g?.focusIndex;if(ue!==void 0){let Ee=Math.min(ue,ke.length);M(Ee,g?.focusMode)}else r(null),l(null)},[e,i,L,M]),D=Dn(()=>{a(e),r(null),l(null)},[e]),j=Dn((N,g)=>{let m=g.currentTarget.value,$=g.currentTarget.selectionStart,me=g.currentTarget.selectionEnd,ke=$===me;if((g.key==="ArrowUp"||g.key==="ArrowDown")&&ke){let{lineIndex:ue,lastLineIndex:Ee}=Of(g.currentTarget);if(g.key==="ArrowUp"&&ue===0&&N>0){g.preventDefault(),f.current=!0,v(N,{focusIndex:N-1,focusMode:"end",deleteEmpty:!1});return}if(g.key==="ArrowDown"&&ue===Ee&&N<C-1){g.preventDefault(),f.current=!0,v(N,{focusIndex:N+1,focusMode:"start",deleteEmpty:!1});return}}if(g.key==="Backspace"&&m.length===0){g.preventDefault(),f.current=!0;let ue=[...i],Ee=N-1;if(N<ue.length){ue.splice(N,1);let Te=L(ue);if(Ee>=0){let X=Math.min(Ee,Te.length-1);M(X,"end")}else r(null),l(null)}else Ee>=0&&M(Ee,"end");return}g.key==="Enter"?(g.preventDefault(),v(N,{focusPlaceholder:g.metaKey||g.ctrlKey,deleteEmpty:!0})):g.key==="Escape"&&(g.preventDefault(),D())},[D,v,i,L,M,C]),J=Dn((N,g)=>{if(f.current){f.current=!1;return}let m=u.current.findIndex($=>$===g.relatedTarget);v(N,{deleteEmpty:!1,focusIndex:m>=0?m:void 0})},[v]),T=Dn((N,g)=>{g.preventDefault(),o!==null?(f.current=!0,v(o,{focusIndex:N,focusMode:"select",deleteEmpty:!1})):M(N,"select")},[v,o,M]);return po(Nf,{children:[Pt("style",{children:`
|
|
8
8
|
.popmelt-eval-assertion-input::placeholder {
|
|
9
9
|
color: #aaa;
|
|
10
10
|
opacity: 1;
|
|
11
11
|
}
|
|
12
|
-
`}),Array.from({length:
|
|
13
|
-
${t}`:`${e}: ${t}`,style:{width:28,height:28,backgroundColor:t,outline:"1px solid rgba(0,0,0,0.08)",outlineOffset:-1,position:"relative"},children:n&&He(Uf,{size:10,strokeWidth:2.5,style:{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",color:"white",filter:"drop-shadow(0 0 1px rgba(0,0,0,0.5))"}})})}function Fc({entries:e,references:t}){let n=[],o=[];for(let i of e)Hc(i[1])?n.push(i):o.push(i);let r=Bc(n);return sn(vr,{children:[r.map(([i,a])=>sn("div",{style:{marginBottom:4},children:[sn("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:2},children:[i,a.length>1?` (${a.length})`:""]}),He("div",{style:{display:"flex",flexWrap:"wrap",gap:2},children:a.map(([s,l])=>He(rg,{varName:s,value:l,reference:t[s]},s))})]},i)),o.length>0&&He(rs,{entries:o})]})}var ns=[0,1,2,4,8,12,16,20,24,28,32];function ig(e){if(e<=32){let t=ns[0],n=Math.abs(e-t);for(let o=1;o<ns.length;o++){let r=Math.abs(e-ns[o]);r<n&&(t=ns[o],n=r)}return t}return Math.round(e/8)*8}function sg({label:e,value:t,px:n,tokenPath:o,rawToken:r,onHover:i,onModify:a,onDelete:s}){let[l,d]=Yn(!1),[c,u]=Yn(null),f=br(!1),p=br(0),b=br(0),S=br([]),C=c!==null?c:n,P=c!==null?`${c}px`:t,H=c!==null,I=os(w=>{w.preventDefault(),f.current=!0,p.current=w.clientX,b.current=n;let $=Bi(r);S.current=Cs($);let Z=k=>{let O=k.clientX-p.current,g=Math.max(0,Math.round(b.current+O));k.shiftKey&&(g=ig(g));for(let m of S.current)m.element.style.setProperty(m.property,g+"px","important");u(g),i?.({name:e,px:g,token:$})},q=()=>{window.removeEventListener("mousemove",Z),window.removeEventListener("mouseup",q),document.body.style.cursor="",f.current=!1,u(k=>{if(k!==null&&k!==n&&a){let O=Bi(r),g=O.bindings&&O.bindings.length>0,m;if(g){let de=Ts(O.bindings,b.current,k);m=JSON.stringify({...O,value:`${k}px`,bindings:de})}else{let de=xl(S.current,b.current),we=Sl(S.current);if(de.length>0){let Ee=Ts(de,b.current,k);m=JSON.stringify({value:`${k}px`,property:we,bindings:Ee})}else m=`${k}px`}let j=typeof r=="string"?r:JSON.stringify(r),ue=S.current.map(de=>({selector:Gn(de.element),property:de.property})),Re=Cl(S.current,b.current,k);a({tokenPath:o,originalValue:j,currentValue:m,targets:ue,originalPx:b.current,currentPx:k},{id:Math.random().toString(36).substring(2,9),tokenPath:o,tokenName:e,originalPx:b.current,newPx:k,affectedElements:Re})}return k})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",Z),window.addEventListener("mouseup",q)},[n,e,o,r,i,a]),M=Bi(r);return sn("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",fontSize:11,padding:"1px 0",cursor:"ew-resize",userSelect:"none"},onMouseEnter:()=>{f.current||(d(!0),i?.({name:e,px:C,token:M}))},onMouseLeave:()=>{f.current||(d(!1),i?.(null))},onMouseDown:I,children:[He("span",{style:{color:l||H?"#FF0000":"#9ca3af"},children:e}),sn("span",{style:{display:"flex",alignItems:"center",gap:4},children:[He("span",{style:{color:l||H?"#FF0000":"#6b7280",fontWeight:600},children:P}),s&&l&&!H&&He("button",{type:"button",title:"Remove token",onMouseDown:w=>{w.stopPropagation();let $=typeof r=="string"?r:JSON.stringify(r);s(o,$)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:w=>{w.currentTarget.style.color="#FF0000"},onMouseLeave:w=>{w.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function ag({entries:e,categoryKey:t,rawTokens:n,onHover:o,onModify:r,onDelete:i}){let a=[],s=[];for(let l of e){let d=eg(l[1]);d!==null?a.push([l[0],l[1],d]):s.push(l)}return sn(vr,{children:[a.length>0&&He("div",{style:{display:"flex",flexDirection:"column",gap:2},children:a.map(([l,d,c])=>{let u=l.split(".").pop(),f=n?lg(n,l):d,p=f&&typeof f=="object"&&"value"in f?f:d;return He(sg,{label:u,value:d,px:c,tokenPath:`tokens.${t}.${l}`,rawToken:p,onHover:o,onModify:r,onDelete:i},l)})}),s.length>0&&He(rs,{entries:s})]})}function lg(e,t){let n=t.split("."),o=e;for(let r of n){if(o==null||typeof o!="object")return;o=o[r]}return o}function rs({entries:e}){return He("div",{style:{display:"flex",flexDirection:"column",gap:3},children:e.map(([t,n])=>sn("div",{style:{fontSize:11},children:[He("div",{style:{color:"#9ca3af",fontSize:10,marginBottom:1},children:t}),He("div",{style:{color:"#1f2937",lineHeight:1.4,paddingLeft:8},children:n})]},t))})}function cg({entries:e,categoryKey:t,rawTokens:n,onSpacingHover:o,onModifyToken:r,onDeleteToken:i}){let a=tg(e);return a==="colors"?He(Fc,{entries:e}):a==="spacing"?He(ag,{entries:e,categoryKey:t,rawTokens:n,onHover:o,onModify:r,onDelete:i}):He(rs,{entries:e})}function dg(e){let t=e.toLowerCase(),n=null,o=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=o.currentNode;for(;r=o.nextNode();){let i=r,a=Object.keys(i).find(l=>l.startsWith("__reactFiber$")||l.startsWith("__reactInternalInstance$"));if(!a)continue;let s=i[a];for(;s;){let l=s.type,d=typeof l=="function"||typeof l=="object"?l?.displayName||l?.name:null;if(typeof d=="string"){let c=d.toLowerCase();if(c===t){let u={...s.memoizedProps};return delete u.ref,{type:l,props:u}}if(!n){if(c.length>=4&&t.includes(c)){let u={...s.memoizedProps};delete u.ref,n={type:l,props:u}}else if(t.length>=4&&c.includes(t)){let u={...s.memoizedProps};delete u.ref,n={type:l,props:u}}}}s=s.return}}return n}var ba=class extends Yf{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}},$c="popmelt-principles-collapsed";function ug(){try{let e=localStorage.getItem($c);if(e)return new Set(JSON.parse(e))}catch{}return new Set}function pg(e){try{localStorage.setItem($c,JSON.stringify([...e]))}catch{}}function fg({id:e,label:t,count:n,children:o,collapsed:r,onToggle:i}){return sn("div",{style:{marginBottom:14},children:[sn("div",{onClick:()=>i(e),style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:r?0:6,cursor:"pointer",display:"flex",alignItems:"center",gap:4,userSelect:"none"},children:[He("span",{style:{display:"inline-flex",alignItems:"center",justifyContent:"center",width:10,fontSize:9,color:"#9ca3af",transform:r?"rotate(-90deg)":"rotate(0deg)"},children:"\u25BC"}),t,He("span",{style:{fontWeight:400,color:"#9ca3af"},children:n})]}),!r&&o]})}var gg={colors:"Colors",fonts:"Fonts",typeScale:"Type Scale",spacing:"Spacing",radii:"Radii",shadows:"Shadows",other:"Other"},Oc=["colors","fonts","typeScale","spacing","radii","shadows","other"];function mg(){let[e,t]=Yn(null),[n,o]=Yn(ug);Zo(()=>{t(Dc())},[]);let r=os(a=>{o(s=>{let l=new Set(s);return l.has(a)?l.delete(a):l.add(a),pg(l),l})},[]);return e?Oc.some(a=>e[a].length>0)?He(vr,{children:Oc.map(a=>{let s=e[a];return s.length===0?null:He(fg,{id:a,label:gg[a],count:s.length,collapsed:n.has(a),onToggle:r,children:a==="colors"?He(Fc,{entries:s,references:e.references}):He(rs,{entries:s})},a)})}):He("div",{style:{color:"#9ca3af",fontSize:11},children:"No :root tokens found."}):null}function hg({rules:e,onSynthesize:t,isSynthesizing:n}){if(!e||e.length===0)return He("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."});if(!e.some(i=>typeof i=="object"&&i!==null&&"scope"in i))return He(vr,{children:e.map((i,a)=>sn("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[sn("span",{style:{color:"#9ca3af",flexShrink:0},children:[a+1,"."]}),He("span",{children:typeof i=="string"?i:i.text})]},a))});let r=new Map;for(let i of e)if(typeof i=="string")r.has("general")||r.set("general",[]),r.get("general").push({id:"",text:i});else{let a=i.scope||"general";r.has(a)||r.set(a,[]),r.get(a).push({id:i.id,text:i.text})}return sn(vr,{children:[t&&He("button",{type:"button",disabled:n,onClick:t,style:{width:"100%",border:"1px solid rgba(0,0,0,0.12)",background:n?"rgba(0,0,0,0.04)":"rgba(0,0,0,0.02)",cursor:n?"default":"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"5px 8px",marginBottom:10,color:n?"#9ca3af":"#6b7280"},children:n?"Synthesizing\u2026":"Synthesize"}),Array.from(r.entries()).map(([i,a])=>sn("div",{style:{marginBottom:10},children:[He("div",{style:{fontWeight:700,fontSize:10,color:"#6b7280",letterSpacing:"0.05em",textTransform:"uppercase",marginBottom:4},children:i}),a.map((s,l)=>sn("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4,fontSize:11},children:[He("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2022"}),He("span",{children:s.text})]},s.id||l))]},i))]})}function yg({name:e,value:t,selected:n,highlighted:o,onRemove:r,onHover:i}){let[a,s]=Yn(!1),[l,d]=Yn(!1),c=br(null),u=br(0),[f,p]=Yn(0),[b,S]=Yn(0),C=Nc(t),P=C.find(([k])=>k==="description")?.[1];Zo(()=>{if(!l&&!o){p(0),S(0),u.current=0;return}let k=Lr(e);p(k.length)},[l,o,e]),Zo(()=>{n&&c.current&&c.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[n]);let H=n||o||l,I=n?"139,92,246":"34,197,94",M=n?"#8b5cf6":"#22c55e",w=H?`rgba(${I},0.06)`:void 0,$=H?`inset 0 0 0 1.5px rgba(${I},0.35)`:void 0,Z=o||l,q=os(()=>{let k=Lr(e);if(k.length===0)return;let O=u.current%k.length;k[O].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),S(O),u.current=O+1,i?.({name:e,instanceIndex:O})},[e,i]);return sn("div",{ref:c,onClick:q,onMouseEnter:()=>{d(!0),i?.({name:e,instanceIndex:0})},onMouseLeave:()=>{d(!1),i?.(null)},style:{marginBottom:8,background:w,padding:6,boxShadow:$,cursor:"pointer"},children:[sn("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[sn("div",{style:{display:"flex",alignItems:"center",gap:6,marginBottom:6},children:[He("div",{style:{fontWeight:700,fontSize:11,letterSpacing:"0.05em",padding:"2px 6px",backgroundColor:Z?M:"transparent",color:Z?"#fff":"#6b7280"},children:e}),Z&&f>1&&sn("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[b+1,"/",f]})]}),r&&l&&He("button",{type:"button",title:"Remove from model",onClick:k=>{k.stopPropagation(),r(e)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:k=>{k.currentTarget.style.color="#FF0000"},onMouseLeave:k=>{k.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),P&&He("div",{style:{fontSize:11,color:Z?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:P}),a?He(cg,{entries:C.filter(([k])=>k!=="description"),categoryKey:""}):He(bg,{name:e,onNotFound:()=>s(!0),entries:C})]})}function bg({name:e,onNotFound:t}){let[n,o]=Yn(null),[r,i]=Yn(!1);return Zo(()=>{let a=dg(e);a||t(),o(a),i(!0)},[e,t]),!r||!n?null:He(ba,{onError:t,children:He("div",{"data-popmelt-panel":!0,onClick:a=>{a.preventDefault(),a.stopPropagation()},style:{width:"100%",overflowY:"auto",overflowX:"hidden",maxHeight:150,padding:"1rem",outline:"1px solid rgba(0,0,0,0.06)",backgroundColor:"rgb(250,250,250)",boxSizing:"border-box",marginBottom:4,display:"flex",flexDirection:"column",justifyContent:"stretch",alignItems:"center",contain:"layout paint",position:"relative",isolation:"isolate"},children:He("div",{style:{zoom:.5,pointerEvents:"none"},children:Vf(n.type,n.props)})})})}function vg({components:e,selectedComponent:t,hoveredComponent:n,onRemove:o,onHover:r}){if(!e||Object.keys(e).length===0)return He("div",{style:{color:"#9ca3af",fontSize:11},children:"No component patterns defined yet."});let i=new Set(Object.keys(e)),a=xs(i),s=Object.entries(e).sort(([l],[d])=>(a.get(l)??1/0)-(a.get(d)??1/0));return He(vr,{children:s.map(([l,d])=>He(yg,{name:l,value:d,selected:t===l,highlighted:n===l,onRemove:o,onHover:r},l))})}function Wc({bridgeUrl:e,modelRefreshKey:t,onMouseEnter:n,onMouseLeave:o,selectedComponent:r,hoveredComponent:i,onComponentHover:a,onSpacingTokenHover:s,onModifySpacingToken:l,onDeleteSpacingToken:d,onComponentAdded:c,onComponentRemoved:u,onSynthesizeRules:f,isSynthesizing:p,snapPosition:b="bottom-right"}){let[S,C]=Yn(void 0),[P,H]=Yn(!0),[I,M]=Yn(()=>{try{let g=localStorage.getItem(_c);if(g==="patterns"||g==="principles"||g==="rules")return g}catch{}return"patterns"});Zo(()=>{Ir(e).then(g=>{C(g),H(!1)})},[e,t]),Zo(()=>{try{localStorage.setItem(_c,I)}catch{}},[I]),Zo(()=>{r&&(M("patterns"),Ir(e).then(g=>{g&&C(g)}))},[r,e]);let w=os(g=>{C(m=>{if(!m?.components)return m;let{[g]:j,...ue}=m.components;return{...m,components:ue}}),u?.(g)},[u]),$=S?.components,Z=S?.rules,q=$&&Object.keys($).length>0,k=Z&&Z.length>0,O=br(null);return Zo(()=>{let g=O.current;if(!g)return;let m=n,j=o;return m&&g.addEventListener("mouseenter",m),j&&g.addEventListener("mouseleave",j),()=>{m&&g.removeEventListener("mouseenter",m),j&&g.removeEventListener("mouseleave",j)}},[n,o]),sn("div",{ref:O,style:{...ng,...Ri(b)},children:[sn("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[He("span",{children:"Model"}),He("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"M"})]}),He("div",{style:{display:"flex",gap:12,marginBottom:10,borderBottom:"1px solid rgba(0,0,0,0.08)",paddingBottom:6},children:["patterns","principles","rules"].map(g=>He("button",{type:"button",style:I===g?og:zc,onClick:()=>M(g),children:g.charAt(0).toUpperCase()+g.slice(1)},g))}),He("div",{style:{flex:1,overflowY:"auto",minHeight:0},children:I==="principles"?He(mg,{}):P?He("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):!S||!q&&!k?He("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):sn(vr,{children:[I==="patterns"&&He(vg,{components:$,selectedComponent:r,hoveredComponent:i,onRemove:w,onHover:a}),I==="rules"&&He(hg,{rules:Z,onSynthesize:f,isSynthesizing:p})]})})]})}import{jsx as Ho}from"react/jsx-runtime";var xg="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",Sg="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",wg="M29.8768 25.3531C30.9809 25.3531 31.876 26.2481 31.876 27.3522V31.3505C31.876 32.4545 30.9809 33.3496 29.8768 33.3496C28.7727 33.3496 27.8777 32.4545 27.8777 31.3505V27.3522C27.8777 26.2481 28.7727 25.3531 29.8768 25.3531ZM19.8812 25.3531C20.9852 25.3531 21.8803 26.2481 21.8803 27.3522V31.3505C21.8803 32.4545 20.9852 33.3496 19.8812 33.3496C18.7771 33.3496 17.882 32.4545 17.882 31.3505V27.3522C17.882 26.2481 18.7771 25.3531 19.8812 25.3531ZM24.8601 40.8772C36.974 40.8772 46.9603 33.8278 48.6801 30.8403C48.8058 30.6218 48.8464 30.3723 48.8464 30.1202V24.8018C48.8464 24.5813 48.8124 24.3622 48.7308 24.1574C47.9871 22.2899 46.0394 19.5773 43.5257 18.8495C43.1925 17.994 42.6989 16.7433 42.2384 15.8201C42.3154 15.1138 42.3426 14.3853 42.3426 13.6492C42.3426 10.99 41.7789 8.65743 40.0805 6.92044C39.2872 6.10915 38.3028 5.48684 37.1355 5.01903C34.3398 2.74775 30.2723 0.837036 24.8169 0.837036C19.3616 0.837036 15.3805 2.74775 12.5847 5.01903C11.4174 5.48684 10.433 6.10915 9.63975 6.92044C7.9413 8.65743 7.37764 10.99 7.37764 13.6492C7.37764 14.3853 7.40477 15.1138 7.48186 15.8201C7.02133 16.7433 6.52774 17.994 6.19449 18.8495C3.68082 19.5773 1.73309 22.2899 0.989389 24.1574C0.907813 24.3622 0.873779 24.5813 0.873779 24.8018V30.1202C0.873779 30.3723 0.914376 30.6218 1.04014 30.8403C2.75994 33.8278 12.7462 40.8772 24.8601 40.8772ZM26.485 13.0046C26.4 12.3422 26.3595 11.749 26.3584 11.2191L26.3584 11.1772C26.361 9.63975 26.6971 8.63938 27.2339 8.02499C27.9156 7.2448 29.3246 6.64707 32.2941 6.96844C35.3026 7.29402 36.9842 8.04072 37.9376 9.01574C38.8606 9.95971 39.3455 11.372 39.3455 13.6492C39.3455 16.0687 38.9969 17.4982 38.2302 18.3678C37.5012 19.1946 36.0656 19.8674 32.9214 19.8674C30.5041 19.8674 29.1221 19.0812 28.2386 17.9939C27.2899 16.8264 26.7559 15.1161 26.485 13.0046ZM23.2353 13.0046C23.3203 12.3422 23.3607 11.749 23.3619 11.2191L23.3619 11.1772C23.3592 9.63974 23.0232 8.63937 22.4863 8.02498C21.8046 7.24479 20.3957 6.64707 17.4261 6.96843C14.4176 7.29402 12.736 8.04071 11.7826 9.01573C10.8596 9.9597 10.3747 11.372 10.3747 13.6492C10.3747 16.0687 10.7234 17.4982 11.49 18.3677C12.219 19.1946 13.6546 19.8674 16.7989 19.8674C19.2161 19.8674 20.5981 19.0812 21.4816 17.9939C22.4304 16.8264 22.9643 15.1161 23.2353 13.0046ZM25.2042 18.8676L25.0543 18.8676C24.8715 18.8678 24.6005 18.868 24.516 18.8676C24.3045 19.2218 24.0693 19.5618 23.8075 19.884C22.2697 21.7764 19.9741 22.8644 16.7988 22.8644C13.3524 22.8644 10.8266 22.1471 9.24196 20.3498C9.15187 20.2476 9.07125 20.1406 9.07125 20.1406L8.87613 20.3498V33.5049C11.7429 35.0628 17.8959 37.8586 24.8601 37.8586C31.8243 37.8586 37.9773 35.0628 40.8441 33.5049V20.3498L40.649 20.1406C40.649 20.1406 40.5829 20.231 40.4783 20.3498C38.8936 22.1471 36.3678 22.8644 32.9214 22.8644C29.7461 22.8644 27.4506 21.7764 25.9127 19.884C25.6509 19.5618 25.4157 19.2218 25.2042 18.8676Z";function Cg({size:e=16,style:t}){return Ho("svg",{width:e,height:e,viewBox:"0 0 1200 1200",fill:"currentColor",stroke:"none",style:{flexShrink:0,...t},children:Ho("path",{d:xg})})}function Eg({size:e=16,style:t}){return Ho("svg",{width:e,height:e,viewBox:"0 0 158.7128 157.296",fill:"currentColor",stroke:"none",style:{flexShrink:0,...t},children:Ho("path",{d:Sg})})}function Tg({size:e=16,style:t}){return Ho("svg",{width:e,height:e,viewBox:"0 0 49.7202 40.0402",fill:"currentColor",stroke:"none",style:{flexShrink:0,...t},children:Ho("path",{d:wg,fillRule:"evenodd",clipRule:"evenodd"})})}function gi({provider:e,size:t=16,style:n}){return e==="codex"?Ho(Eg,{size:t,style:n}):e==="copilot"?Ho(Tg,{size:t,style:n}):Ho(Cg,{size:t,style:n})}var is=[{id:"claude-opus-4-6",label:"Opus 4.6",source:"static"},{id:"claude-sonnet-4-6",label:"Sonn 4.6",source:"static"}],ss=[{id:"gpt-5.4",label:"GPT 5.4",source:"static"},{id:"gpt-5.3-codex",label:"Codex 5.3",source:"static"},{id:"gpt-5.3-codex-spark",label:"Spark 5.3",source:"static"}],va=[{id:"",label:"Default",source:"static"}];var kg=[...is,...ss,...va];function xa(e,t){if(t==="copilot"&&!e)return"Copilot";if(!e)return t==="codex"?"Codex":"Claude Code";let n=kg.find(o=>o.id===e);return n?n.label:e.replace(/-\d{8,}$/,"")}import{jsx as Gc}from"react/jsx-runtime";var to={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#dedede",bgHover:"#e2e2e2",separator:"#e5e7eb"};function No({children:e,active:t,siblingActive:n,disabled:o,onClick:r,title:i}){let a=()=>o?.4:n&&!t?.5:1,s={position:"relative",display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,borderRadius:0,border:"none",cursor:o?"default":"pointer",transition:"background-color 150ms ease, color 150ms ease, transform 100ms ease, opacity 150ms ease",backgroundColor:t?to.bgActive:"transparent",color:t?to.iconActive:to.iconDefault,opacity:a()};return Gc("button",{type:"button",onClick:o?void 0:r,title:i,disabled:o,style:s,onMouseEnter:l=>{o||(l.currentTarget.style.opacity="1",t||(l.currentTarget.style.backgroundColor=to.bgHover))},onMouseLeave:l=>{o||(l.currentTarget.style.opacity=String(a()),t||(l.currentTarget.style.backgroundColor="transparent"))},onMouseDown:l=>{o||(l.currentTarget.style.transform="scale(0.95)")},onMouseUp:l=>{o||(l.currentTarget.style.transform="scale(1)")},children:e})}function jc(){return Gc("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as mi,jsx as pe,jsxs as Dt}from"react/jsx-runtime";function zg(e,t){if(e<=0)return[];if(e<=4)return Array.from({length:e},(r,i)=>({key:`model-${i}`,index:i,active:i===t}));let n=e-1,o=r=>({key:`model-${r}`,index:r,active:r===t});return t===0?[o(0),o(1),o(2),{key:"overflow-after",overflow:!0}]:t===1?[{key:"overflow-before",overflow:!0},o(1),o(2),{key:"overflow-after",overflow:!0}]:t===n-1?[{key:"overflow-before",overflow:!0},o(n-2),o(n-1),o(n)]:t===n?[{key:"overflow-before",overflow:!0},o(n-2),o(n-1),o(n)]:t%2===0?[{key:"overflow-before",overflow:!0},o(t-1),o(t),{key:"overflow-after",overflow:!0}]:[{key:"overflow-before",overflow:!0},o(t),o(t+1),{key:"overflow-after",overflow:!0}]}var wr=[{type:"rectangle",icon:Og,label:"Rectangle",shortcut:"R"},{type:"circle",icon:Mg,label:"Oval",shortcut:"O"},{type:"line",icon:_g,label:"Line",shortcut:"L"},{type:"freehand",icon:Bg,label:"Pen",shortcut:"P"}],Fg=new Set(wr.map(e=>e.type));function $g(e,t,n,o,r,i,a,s){let l=(e-r)*(o-i)-(n-r)*(t-i),d=(e-a)*(i-s)-(r-a)*(t-s),c=(e-n)*(s-o)-(a-n)*(t-o),u=l<0||d<0||c<0,f=l>0||d>0||c>0;return!(u&&f)}function Wg(e="bottom-right"){return pl(e,window.innerWidth,window.innerHeight)}var jg=[{type:"text",icon:Ng,label:"Text",shortcut:"T"}],Jc={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"}]},eval:{name:"Evals",desc:"Synthesize inferred evals from design history.",usage:["Infer evals from annotations","Reject, refine, or approve proposals"],keys:[{key:"E",desc:"Select tool"},{key:"Esc",desc:"Deselect"}]},counter:{name:"Annotations",desc:"Click to cycle, scroll to change color, long press to reset.",usage:[],keys:[{key:"Click",desc:"Cycle annotations"},{key:"Scroll",desc:"Change color"},{key:"Hold",desc:"Reset to red"}]},clear:{name:"Clear",desc:"Remove all annotations and style changes.",usage:[],keys:[{key:"\u2318 \u232B",desc:"Clear all"},{key:"\u232B",desc:"Delete selected annotation"},{key:"\u2318 Z",desc:"Undo"},{key:"\u2318 \u21E7 Z",desc:"Redo"}]},collapse:{name:"Popmelt",desc:`Comment and zhuzh, then hand off.
|
|
12
|
+
`}),Array.from({length:C},(N,g)=>{let m=i[g]??"",$=b&&g>=i.length,me=o===g||$,ue=($?void 0:w.get(m.trim()))?.status,Ee=ue?Ef[ue]:"#374151",Te=ue?kf[ue]:"\u25A1",X=ue?{color:Ee}:{},_=ue?{color:Ee}:{};return me?po("div",{style:Rc,children:[Pt("span",{style:X,children:Te}),Pt("textarea",{className:"popmelt-eval-assertion-input",ref:oe=>{u.current[g]=oe},rows:1,value:m,placeholder:$?"cmd+enter to add new assertion":void 0,onFocus:()=>r(g),onChange:oe=>{R(g,oe.target.value),Lc(oe.currentTarget)},onBlur:oe=>J(g,oe),onKeyDown:oe=>j(g,oe),style:{...wf,..._}})]},`assertion-${g}`):po("div",{style:Rc,children:[Pt("span",{style:X,children:Te}),Pt("button",{type:"button",onMouseDown:oe=>T(g,oe),onClick:()=>E(g),style:{...Sa,..._},children:m})]},`assertion-${g}`)})]})}import{Component as ng,createElement as og,useCallback as ss,useEffect as tr,useRef as xr,useState as Un}from"react";import{Link2 as rg}from"lucide-react";var zf={colors:[],fonts:[],typeScale:[],spacing:[],radii:[],shadows:[],other:[],references:{}},Ff=/^#[0-9a-fA-F]{3,8}$/,$f=/^(?:rgba?|hsla?|oklch|oklab|lch|lab)\(/,Wf=new Set(["transparent","currentcolor","inherit","white","black","red","green","blue","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]);function _c(e){let t=e.trim().toLowerCase();return Ff.test(t)||$f.test(t)||Wf.has(t)}var jf=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function wa(e){return jf.test(e.trim())}var Dc=new Set(["serif","sans-serif","monospace","cursive","fantasy","system-ui","ui-serif","ui-sans-serif","ui-monospace","ui-rounded"]);function Gf(e){let t=e.trim().toLowerCase();return!!(Dc.has(t)||t.includes(",")&&t.split(",").some(n=>Dc.has(n.trim().replace(/['"]/g,""))))}function Jf(e){let t=e.trim().toLowerCase(),n=t.match(/\d+(\.\d+)?px/g);return!!(n&&n.length>=2&&(_c(t.replace(/[^#()\w,.\s/%]/g,"").split(/\s+/).pop()||"")||t.includes("rgb")||t.includes("hsl")||t.includes("#")))}var Vf=/(?:^--(color|bg|fg|accent|border-color|text-color|surface|background|foreground))|(?:-(color|bg|fg)$)/i,Yf=/^--(font-family|font|ff|family)/i,Uf=/^--(font-size|text-size|fs|text-(?:xs|sm|base|md|lg|xl|2xl|3xl|4xl|5xl))/i,Kf=/^--(space|gap|padding|margin|inset)/i,Xf=/^--(radius|rounded|br|border-radius)/i,qf=/^--(shadow|elevation|drop-shadow)/i;function Oc(e,t){let n=e.toLowerCase();return qf.test(n)?"shadows":Xf.test(n)?"radii":Yf.test(n)?"fonts":Uf.test(n)&&wa(t)?"typeScale":Vf.test(n)||_c(t)?"colors":Gf(t)?"fonts":Jf(t)?"shadows":Kf.test(n)&&wa(t)||wa(t)?"spacing":"other"}function Hc(e,t,n,o){if(e)for(let r of e){if(r instanceof CSSGroupingRule){Hc(r.cssRules,t,n,o);continue}if(r instanceof CSSStyleRule){let i=r.selectorText.toLowerCase();(i===":root"||i==="html"||i==="*"||i.includes(":root"))&&Zf(r.style,t,n,o)}}}var Nc=/var\((--[^,)]+)/;function Zf(e,t,n,o){for(let r=0;r<e.length;r++){let i=e[r];if(!i?.startsWith("--")||n.has(i))continue;n.add(i);let a=t.getPropertyValue(i).trim();if(!a)continue;let s=Oc(i,a);o[s].push([i,a]);let c=e.getPropertyValue(i).trim().match(Nc);c&&(o.references[i]=c[1])}}function ns(e){let t=e.trim().match(/^(-?\d+(?:\.\d+)?)/);return t?parseFloat(t[1]):null}function rs(e){let t=e.trim().toLowerCase(),n=t.match(/oklch\(\s*([\d.]+%?)/);if(n){let i=n[1];return i.endsWith("%")?parseFloat(i)/100:parseFloat(i)}let o=t.match(/rgba?\(\s*(\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(o){let[i,a,s]=[parseInt(o[1],10),parseInt(o[2],10),parseInt(o[3],10)];return(.2126*i+.7152*a+.0722*s)/255}let r=t.match(/hsla?\(\s*[\d.]+[,\s]+[\d.]+%?[,\s]+([\d.]+)%?/);if(r)return parseFloat(r[1])/100;if(t.startsWith("#")){let i=t.slice(1);(i.length===3||i.length===4)&&(i=i[0]+i[0]+i[1]+i[1]+i[2]+i[2]);let a=parseInt(i.slice(0,2),16),s=parseInt(i.slice(2,4),16),l=parseInt(i.slice(4,6),16);if(!isNaN(a))return(.2126*a+.7152*s+.0722*l)/255}return null}function zc(e){return e==="colors"?(t,n)=>{let o=rs(t[1]),r=rs(n[1]);return o!==null&&r!==null?o-r:t[0].localeCompare(n[0])}:e==="typeScale"||e==="spacing"||e==="radii"?(t,n)=>{let o=ns(t[1]),r=ns(n[1]);return o!==null&&r!==null?o-r:t[0].localeCompare(n[0])}:e==="other"?(t,n)=>{let o=ns(t[1]),r=ns(n[1]);return o!==null&&r!==null?o-r:t[0].localeCompare(n[0])}:(t,n)=>t[0].localeCompare(n[0])}function Qf(e){let t=e.replace(/^--/,"");t=t.replace(/^(?:color|clr)-/,"");let n=t.split("-");return n.length>1&&/^\d+$/.test(n[n.length-1])&&n.pop(),n.join("-")}function Fc(e){let t=new Map;for(let r of e){let i=Qf(r[0]),a=t.get(i);a||(a=[],t.set(i,a)),a.push(r)}let n=zc("colors");for(let r of t.values())r.sort(n);let o=[...t.entries()];return o.sort((r,i)=>{let a=rs(r[1][0][1])??0,s=rs(i[1][0][1])??0;return a-s}),o}var eg=["colors","fonts","typeScale","spacing","radii","shadows","other"],os=null,tg=5e3;function $c(){if(typeof document>"u")return zf;if(os&&Date.now()-os.timestamp<tg)return os.tokens;let e={colors:[],fonts:[],typeScale:[],spacing:[],radii:[],shadows:[],other:[],references:{}},t=new Set,n=getComputedStyle(document.documentElement);try{for(let r of document.styleSheets)try{Hc(r.cssRules||r.rules,n,t,e)}catch{}}catch{}let o=document.documentElement.style;for(let r=0;r<o.length;r++){let i=o[r];if(!i?.startsWith("--")||t.has(i))continue;t.add(i);let a=n.getPropertyValue(i).trim();if(!a)continue;let s=Oc(i,a);e[s].push([i,a]);let c=o.getPropertyValue(i).trim().match(Nc);c&&(e.references[i]=c[1])}for(let r of eg)e[r].sort(zc(r));return os={tokens:e,timestamp:Date.now()},e}import{Fragment as Sr,jsx as $e,jsxs as an}from"react/jsx-runtime";var Wc="popmelt-library-tab",ig=/^#[0-9a-fA-F]{3,8}$/,sg=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,ag=new Set(["black","white","red","blue","green","yellow","orange","purple","pink","gray","grey","cyan","magenta","brown","navy","teal","maroon","olive","silver","aqua","fuchsia","lime"]),lg=/^-?\d+(\.\d+)?(px|rem|em|%)$/;function Gc(e){let t=e.trim();return ig.test(t)||sg.test(t)||ag.has(t.toLowerCase())}function cg(e){return lg.test(e.trim())}function dg(e){let t=e.trim().match(/^(-?\d+(?:\.\d+)?)px$/);return t?parseFloat(t[1]):null}function Jc(e,t=""){if(e==null)return[];if(typeof e!="object")return[[t,String(e)]];if(Array.isArray(e))return[[t,e.map(String).join(", ")]];let n=[];for(let[o,r]of Object.entries(e)){let i=t?`${t}.${o}`:o;if(r!==null&&typeof r=="object"&&!Array.isArray(r)){let a=r;typeof a.value=="string"?n.push([i,a.value]):n.push(...Jc(r,i))}else n.push([i,Array.isArray(r)?r.map(String).join(", "):String(r??"")])}return n}function ug(e){return e.length===0?"generic":e.filter(([,o])=>Gc(o)).length>e.length/2?"colors":e.filter(([,o])=>cg(o)).length>e.length/2?"spacing":"generic"}var pg={width:300,backgroundColor:"#eaeaea",...Gr,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"},Vc={border:"none",background:"none",cursor:"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"2px 0",color:"#9ca3af"},fg={...Vc,color:"#1f2937",borderBottom:"1.5px solid #1f2937"};function gg({varName:e,value:t,reference:n}){return $e("div",{title:n?`${e} \u2192 ${n}
|
|
13
|
+
${t}`:`${e}: ${t}`,style:{width:28,height:28,backgroundColor:t,outline:"1px solid rgba(0,0,0,0.08)",outlineOffset:-1,position:"relative"},children:n&&$e(rg,{size:10,strokeWidth:2.5,style:{position:"absolute",top:"50%",left:"50%",transform:"translate(-50%, -50%)",color:"white",filter:"drop-shadow(0 0 1px rgba(0,0,0,0.5))"}})})}function Yc({entries:e,references:t}){let n=[],o=[];for(let i of e)Gc(i[1])?n.push(i):o.push(i);let r=Fc(n);return an(Sr,{children:[r.map(([i,a])=>an("div",{style:{marginBottom:4},children:[an("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:2},children:[i,a.length>1?` (${a.length})`:""]}),$e("div",{style:{display:"flex",flexWrap:"wrap",gap:2},children:a.map(([s,l])=>$e(gg,{varName:s,value:l,reference:t[s]},s))})]},i)),o.length>0&&$e(as,{entries:o})]})}var is=[0,1,2,4,8,12,16,20,24,28,32];function mg(e){if(e<=32){let t=is[0],n=Math.abs(e-t);for(let o=1;o<is.length;o++){let r=Math.abs(e-is[o]);r<n&&(t=is[o],n=r)}return t}return Math.round(e/8)*8}function hg({label:e,value:t,px:n,tokenPath:o,rawToken:r,onHover:i,onModify:a,onDelete:s}){let[l,c]=Un(!1),[d,u]=Un(null),p=xr(!1),f=xr(0),b=xr(0),C=xr([]),w=d!==null?d:n,M=d!==null?`${d}px`:t,L=d!==null,E=ss(v=>{v.preventDefault(),p.current=!0,f.current=v.clientX,b.current=n;let D=Oi(r);C.current=Ms(D);let j=T=>{let N=T.clientX-f.current,g=Math.max(0,Math.round(b.current+N));T.shiftKey&&(g=mg(g));for(let m of C.current)m.element.style.setProperty(m.property,g+"px","important");u(g),i?.({name:e,px:g,token:D})},J=()=>{window.removeEventListener("mousemove",j),window.removeEventListener("mouseup",J),document.body.style.cursor="",p.current=!1,u(T=>{if(T!==null&&T!==n&&a){let N=Oi(r),g=N.bindings&&N.bindings.length>0,m;if(g){let ue=As(N.bindings,b.current,T);m=JSON.stringify({...N,value:`${T}px`,bindings:ue})}else{let ue=Tl(C.current,b.current),Ee=Il(C.current);if(ue.length>0){let Te=As(ue,b.current,T);m=JSON.stringify({value:`${T}px`,property:Ee,bindings:Te})}else m=`${T}px`}let $=typeof r=="string"?r:JSON.stringify(r),me=C.current.map(ue=>({selector:Vn(ue.element),property:ue.property})),ke=Rl(C.current,b.current,T);a({tokenPath:o,originalValue:$,currentValue:m,targets:me,originalPx:b.current,currentPx:T},{id:Math.random().toString(36).substring(2,9),tokenPath:o,tokenName:e,originalPx:b.current,newPx:T,affectedElements:ke})}return T})};document.body.style.cursor="ew-resize",window.addEventListener("mousemove",j),window.addEventListener("mouseup",J)},[n,e,o,r,i,a]),R=Oi(r);return an("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",fontSize:11,padding:"1px 0",cursor:"ew-resize",userSelect:"none"},onMouseEnter:()=>{p.current||(c(!0),i?.({name:e,px:w,token:R}))},onMouseLeave:()=>{p.current||(c(!1),i?.(null))},onMouseDown:E,children:[$e("span",{style:{color:l||L?"#FF0000":"#9ca3af"},children:e}),an("span",{style:{display:"flex",alignItems:"center",gap:4},children:[$e("span",{style:{color:l||L?"#FF0000":"#6b7280",fontWeight:600},children:M}),s&&l&&!L&&$e("button",{type:"button",title:"Remove token",onMouseDown:v=>{v.stopPropagation();let D=typeof r=="string"?r:JSON.stringify(r);s(o,D)},style:{border:"none",background:"none",cursor:"pointer",padding:0,fontSize:10,lineHeight:1,color:"#9ca3af"},onMouseEnter:v=>{v.currentTarget.style.color="#FF0000"},onMouseLeave:v=>{v.currentTarget.style.color="#9ca3af"},children:"\u2715"})]})]})}function yg({entries:e,categoryKey:t,rawTokens:n,onHover:o,onModify:r,onDelete:i}){let a=[],s=[];for(let l of e){let c=dg(l[1]);c!==null?a.push([l[0],l[1],c]):s.push(l)}return an(Sr,{children:[a.length>0&&$e("div",{style:{display:"flex",flexDirection:"column",gap:2},children:a.map(([l,c,d])=>{let u=l.split(".").pop(),p=n?bg(n,l):c,f=p&&typeof p=="object"&&"value"in p?p:c;return $e(hg,{label:u,value:c,px:d,tokenPath:`tokens.${t}.${l}`,rawToken:f,onHover:o,onModify:r,onDelete:i},l)})}),s.length>0&&$e(as,{entries:s})]})}function bg(e,t){let n=t.split("."),o=e;for(let r of n){if(o==null||typeof o!="object")return;o=o[r]}return o}function as({entries:e}){return $e("div",{style:{display:"flex",flexDirection:"column",gap:3},children:e.map(([t,n])=>an("div",{style:{fontSize:11},children:[$e("div",{style:{color:"#9ca3af",fontSize:10,marginBottom:1},children:t}),$e("div",{style:{color:"#1f2937",lineHeight:1.4,paddingLeft:8},children:n})]},t))})}function vg({entries:e,categoryKey:t,rawTokens:n,onSpacingHover:o,onModifyToken:r,onDeleteToken:i}){let a=ug(e);return a==="colors"?$e(Yc,{entries:e}):a==="spacing"?$e(yg,{entries:e,categoryKey:t,rawTokens:n,onHover:o,onModify:r,onDelete:i}):$e(as,{entries:e})}function xg(e){let t=e.toLowerCase(),n=null,o=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=o.currentNode;for(;r=o.nextNode();){let i=r,a=Object.keys(i).find(l=>l.startsWith("__reactFiber$")||l.startsWith("__reactInternalInstance$"));if(!a)continue;let s=i[a];for(;s;){let l=s.type,c=typeof l=="function"||typeof l=="object"?l?.displayName||l?.name:null;if(typeof c=="string"){let d=c.toLowerCase();if(d===t){let u={...s.memoizedProps};return delete u.ref,{type:l,props:u}}if(!n){if(d.length>=4&&t.includes(d)){let u={...s.memoizedProps};delete u.ref,n={type:l,props:u}}else if(t.length>=4&&d.includes(t)){let u={...s.memoizedProps};delete u.ref,n={type:l,props:u}}}}s=s.return}}return n}var Ca=class extends ng{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}},Uc="popmelt-principles-collapsed";function Sg(){try{let e=localStorage.getItem(Uc);if(e)return new Set(JSON.parse(e))}catch{}return new Set}function wg(e){try{localStorage.setItem(Uc,JSON.stringify([...e]))}catch{}}function Cg({id:e,label:t,count:n,children:o,collapsed:r,onToggle:i}){return an("div",{style:{marginBottom:14},children:[an("div",{onClick:()=>i(e),style:{fontWeight:700,fontSize:11,color:"#6b7280",letterSpacing:"0.05em",marginBottom:r?0:6,cursor:"pointer",display:"flex",alignItems:"center",gap:4,userSelect:"none"},children:[$e("span",{style:{display:"inline-flex",alignItems:"center",justifyContent:"center",width:10,fontSize:9,color:"#9ca3af",transform:r?"rotate(-90deg)":"rotate(0deg)"},children:"\u25BC"}),t,$e("span",{style:{fontWeight:400,color:"#9ca3af"},children:n})]}),!r&&o]})}var Eg={colors:"Colors",fonts:"Fonts",typeScale:"Type Scale",spacing:"Spacing",radii:"Radii",shadows:"Shadows",other:"Other"},jc=["colors","fonts","typeScale","spacing","radii","shadows","other"];function kg(){let[e,t]=Un(null),[n,o]=Un(Sg);tr(()=>{t($c())},[]);let r=ss(a=>{o(s=>{let l=new Set(s);return l.has(a)?l.delete(a):l.add(a),wg(l),l})},[]);return e?jc.some(a=>e[a].length>0)?$e(Sr,{children:jc.map(a=>{let s=e[a];return s.length===0?null:$e(Cg,{id:a,label:Eg[a],count:s.length,collapsed:n.has(a),onToggle:r,children:a==="colors"?$e(Yc,{entries:s,references:e.references}):$e(as,{entries:s})},a)})}):$e("div",{style:{color:"#9ca3af",fontSize:11},children:"No :root tokens found."}):null}function Tg({rules:e,onSynthesize:t,isSynthesizing:n}){if(!e||e.length===0)return $e("div",{style:{color:"#9ca3af",fontSize:11},children:"No rules defined yet."});if(!e.some(i=>typeof i=="object"&&i!==null&&"scope"in i))return $e(Sr,{children:e.map((i,a)=>an("div",{style:{display:"flex",gap:6,marginBottom:4,lineHeight:1.4,fontSize:11},children:[an("span",{style:{color:"#9ca3af",flexShrink:0},children:[a+1,"."]}),$e("span",{children:typeof i=="string"?i:i.text})]},a))});let r=new Map;for(let i of e)if(typeof i=="string")r.has("general")||r.set("general",[]),r.get("general").push({id:"",text:i});else{let a=i.scope||"general";r.has(a)||r.set(a,[]),r.get(a).push({id:i.id,text:i.text})}return an(Sr,{children:[t&&$e("button",{type:"button",disabled:n,onClick:t,style:{width:"100%",border:"1px solid rgba(0,0,0,0.12)",background:n?"rgba(0,0,0,0.04)":"rgba(0,0,0,0.02)",cursor:n?"default":"pointer",fontFamily:"inherit",fontSize:11,fontWeight:600,padding:"5px 8px",marginBottom:10,color:n?"#9ca3af":"#6b7280"},children:n?"Synthesizing\u2026":"Synthesize"}),Array.from(r.entries()).map(([i,a])=>an("div",{style:{marginBottom:10},children:[$e("div",{style:{fontWeight:700,fontSize:10,color:"#6b7280",letterSpacing:"0.05em",textTransform:"uppercase",marginBottom:4},children:i}),a.map((s,l)=>an("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4,fontSize:11},children:[$e("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2022"}),$e("span",{children:s.text})]},s.id||l))]},i))]})}function Ig({name:e,value:t,selected:n,highlighted:o,onRemove:r,onHover:i}){let[a,s]=Un(!1),[l,c]=Un(!1),d=xr(null),u=xr(0),[p,f]=Un(0),[b,C]=Un(0),w=Jc(t),M=w.find(([T])=>T==="description")?.[1];tr(()=>{if(!l&&!o){f(0),C(0),u.current=0;return}let T=Br(e);f(T.length)},[l,o,e]),tr(()=>{n&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest"})},[n]);let L=n||o||l,E=n?"139,92,246":"34,197,94",R=n?"#8b5cf6":"#22c55e",v=L?`rgba(${E},0.06)`:void 0,D=L?`inset 0 0 0 1.5px rgba(${E},0.35)`:void 0,j=o||l,J=ss(()=>{let T=Br(e);if(T.length===0)return;let N=u.current%T.length;T[N].rootElement.scrollIntoView({behavior:"smooth",block:"center"}),C(N),u.current=N+1,i?.({name:e,instanceIndex:N})},[e,i]);return an("div",{ref:d,onClick:J,onMouseEnter:()=>{c(!0),i?.({name:e,instanceIndex:0})},onMouseLeave:()=>{c(!1),i?.(null)},style:{marginBottom:8,background:v,padding:6,boxShadow:D,cursor:"pointer"},children:[an("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[an("div",{style:{display:"flex",alignItems:"center",gap:6,marginBottom:6},children:[$e("div",{style:{fontWeight:700,fontSize:11,letterSpacing:"0.05em",padding:"2px 6px",backgroundColor:j?R:"transparent",color:j?"#fff":"#6b7280"},children:e}),j&&p>1&&an("span",{style:{fontSize:10,fontWeight:600,color:"#9ca3af"},children:[b+1,"/",p]})]}),r&&l&&$e("button",{type:"button",title:"Remove from model",onClick:T=>{T.stopPropagation(),r(e)},style:{border:"none",background:"none",cursor:"pointer",padding:"0 2px",fontSize:14,lineHeight:1,color:"#9ca3af",marginTop:-4},onMouseEnter:T=>{T.currentTarget.style.color="#FF0000"},onMouseLeave:T=>{T.currentTarget.style.color="#9ca3af"},children:"\u2715"})]}),M&&$e("div",{style:{fontSize:11,color:j?"#1f2937":"#9ca3af",marginBottom:6,lineHeight:1.4},children:M}),a?$e(vg,{entries:w.filter(([T])=>T!=="description"),categoryKey:""}):$e(Mg,{name:e,onNotFound:()=>s(!0),entries:w})]})}function Mg({name:e,onNotFound:t}){let[n,o]=Un(null),[r,i]=Un(!1);return tr(()=>{let a=xg(e);a||t(),o(a),i(!0)},[e,t]),!r||!n?null:$e(Ca,{onError:t,children:$e("div",{"data-popmelt-panel":!0,onClick:a=>{a.preventDefault(),a.stopPropagation()},style:{width:"100%",overflowY:"auto",overflowX:"hidden",maxHeight:150,padding:"1rem",outline:"1px solid rgba(0,0,0,0.06)",backgroundColor:"rgb(250,250,250)",boxSizing:"border-box",marginBottom:4,display:"flex",flexDirection:"column",justifyContent:"stretch",alignItems:"center",contain:"layout paint",position:"relative",isolation:"isolate"},children:$e("div",{style:{zoom:.5,pointerEvents:"none"},children:og(n.type,n.props)})})})}function Rg({components:e,selectedComponent:t,hoveredComponent:n,onRemove:o,onHover:r}){if(!e||Object.keys(e).length===0)return $e("div",{style:{color:"#9ca3af",fontSize:11},children:"No component patterns defined yet."});let i=new Set(Object.keys(e)),a=ks(i),s=Object.entries(e).sort(([l],[c])=>(a.get(l)??1/0)-(a.get(c)??1/0));return $e(Sr,{children:s.map(([l,c])=>$e(Ig,{name:l,value:c,selected:t===l,highlighted:n===l,onRemove:o,onHover:r},l))})}function Kc({bridgeUrl:e,modelRefreshKey:t,onMouseEnter:n,onMouseLeave:o,selectedComponent:r,hoveredComponent:i,onComponentHover:a,onSpacingTokenHover:s,onModifySpacingToken:l,onDeleteSpacingToken:c,onComponentAdded:d,onComponentRemoved:u,onSynthesizeRules:p,isSynthesizing:f,snapPosition:b="bottom-right"}){let[C,w]=Un(void 0),[M,L]=Un(!0),[E,R]=Un(()=>{try{let g=localStorage.getItem(Wc);if(g==="patterns"||g==="principles"||g==="rules")return g}catch{}return"patterns"});tr(()=>{Rr(e).then(g=>{w(g),L(!1)})},[e,t]),tr(()=>{try{localStorage.setItem(Wc,E)}catch{}},[E]),tr(()=>{r&&(R("patterns"),Rr(e).then(g=>{g&&w(g)}))},[r,e]);let v=ss(g=>{w(m=>{if(!m?.components)return m;let{[g]:$,...me}=m.components;return{...m,components:me}}),u?.(g)},[u]),D=C?.components,j=C?.rules,J=D&&Object.keys(D).length>0,T=j&&j.length>0,N=xr(null);return tr(()=>{let g=N.current;if(!g)return;let m=n,$=o;return m&&g.addEventListener("mouseenter",m),$&&g.addEventListener("mouseleave",$),()=>{m&&g.removeEventListener("mouseenter",m),$&&g.removeEventListener("mouseleave",$)}},[n,o]),an("div",{ref:N,style:{...pg,...Pi(b)},children:[an("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[$e("span",{children:"Model"}),$e("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:"M"})]}),$e("div",{style:{display:"flex",gap:12,marginBottom:10,borderBottom:"1px solid rgba(0,0,0,0.08)",paddingBottom:6},children:["patterns","principles","rules"].map(g=>$e("button",{type:"button",style:E===g?fg:Vc,onClick:()=>R(g),children:g.charAt(0).toUpperCase()+g.slice(1)},g))}),$e("div",{style:{flex:1,overflowY:"auto",minHeight:0},children:E==="principles"?$e(kg,{}):M?$e("div",{style:{color:"#9ca3af",fontSize:11},children:"Loading..."}):!C||!J&&!T?$e("div",{style:{color:"#9ca3af",lineHeight:1.5},children:"No design model yet. Pattern-scoped annotations will build one automatically."}):an(Sr,{children:[E==="patterns"&&$e(Rg,{components:D,selectedComponent:r,hoveredComponent:i,onRemove:v,onHover:a}),E==="rules"&&$e(Tg,{rules:j,onSynthesize:p,isSynthesizing:f})]})})]})}import{jsx as Fo}from"react/jsx-runtime";var Ag="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",Lg="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",Pg="M29.8768 25.3531C30.9809 25.3531 31.876 26.2481 31.876 27.3522V31.3505C31.876 32.4545 30.9809 33.3496 29.8768 33.3496C28.7727 33.3496 27.8777 32.4545 27.8777 31.3505V27.3522C27.8777 26.2481 28.7727 25.3531 29.8768 25.3531ZM19.8812 25.3531C20.9852 25.3531 21.8803 26.2481 21.8803 27.3522V31.3505C21.8803 32.4545 20.9852 33.3496 19.8812 33.3496C18.7771 33.3496 17.882 32.4545 17.882 31.3505V27.3522C17.882 26.2481 18.7771 25.3531 19.8812 25.3531ZM24.8601 40.8772C36.974 40.8772 46.9603 33.8278 48.6801 30.8403C48.8058 30.6218 48.8464 30.3723 48.8464 30.1202V24.8018C48.8464 24.5813 48.8124 24.3622 48.7308 24.1574C47.9871 22.2899 46.0394 19.5773 43.5257 18.8495C43.1925 17.994 42.6989 16.7433 42.2384 15.8201C42.3154 15.1138 42.3426 14.3853 42.3426 13.6492C42.3426 10.99 41.7789 8.65743 40.0805 6.92044C39.2872 6.10915 38.3028 5.48684 37.1355 5.01903C34.3398 2.74775 30.2723 0.837036 24.8169 0.837036C19.3616 0.837036 15.3805 2.74775 12.5847 5.01903C11.4174 5.48684 10.433 6.10915 9.63975 6.92044C7.9413 8.65743 7.37764 10.99 7.37764 13.6492C7.37764 14.3853 7.40477 15.1138 7.48186 15.8201C7.02133 16.7433 6.52774 17.994 6.19449 18.8495C3.68082 19.5773 1.73309 22.2899 0.989389 24.1574C0.907813 24.3622 0.873779 24.5813 0.873779 24.8018V30.1202C0.873779 30.3723 0.914376 30.6218 1.04014 30.8403C2.75994 33.8278 12.7462 40.8772 24.8601 40.8772ZM26.485 13.0046C26.4 12.3422 26.3595 11.749 26.3584 11.2191L26.3584 11.1772C26.361 9.63975 26.6971 8.63938 27.2339 8.02499C27.9156 7.2448 29.3246 6.64707 32.2941 6.96844C35.3026 7.29402 36.9842 8.04072 37.9376 9.01574C38.8606 9.95971 39.3455 11.372 39.3455 13.6492C39.3455 16.0687 38.9969 17.4982 38.2302 18.3678C37.5012 19.1946 36.0656 19.8674 32.9214 19.8674C30.5041 19.8674 29.1221 19.0812 28.2386 17.9939C27.2899 16.8264 26.7559 15.1161 26.485 13.0046ZM23.2353 13.0046C23.3203 12.3422 23.3607 11.749 23.3619 11.2191L23.3619 11.1772C23.3592 9.63974 23.0232 8.63937 22.4863 8.02498C21.8046 7.24479 20.3957 6.64707 17.4261 6.96843C14.4176 7.29402 12.736 8.04071 11.7826 9.01573C10.8596 9.9597 10.3747 11.372 10.3747 13.6492C10.3747 16.0687 10.7234 17.4982 11.49 18.3677C12.219 19.1946 13.6546 19.8674 16.7989 19.8674C19.2161 19.8674 20.5981 19.0812 21.4816 17.9939C22.4304 16.8264 22.9643 15.1161 23.2353 13.0046ZM25.2042 18.8676L25.0543 18.8676C24.8715 18.8678 24.6005 18.868 24.516 18.8676C24.3045 19.2218 24.0693 19.5618 23.8075 19.884C22.2697 21.7764 19.9741 22.8644 16.7988 22.8644C13.3524 22.8644 10.8266 22.1471 9.24196 20.3498C9.15187 20.2476 9.07125 20.1406 9.07125 20.1406L8.87613 20.3498V33.5049C11.7429 35.0628 17.8959 37.8586 24.8601 37.8586C31.8243 37.8586 37.9773 35.0628 40.8441 33.5049V20.3498L40.649 20.1406C40.649 20.1406 40.5829 20.231 40.4783 20.3498C38.8936 22.1471 36.3678 22.8644 32.9214 22.8644C29.7461 22.8644 27.4506 21.7764 25.9127 19.884C25.6509 19.5618 25.4157 19.2218 25.2042 18.8676Z";function Bg({size:e=16,style:t}){return Fo("svg",{width:e,height:e,viewBox:"0 0 1200 1200",fill:"currentColor",stroke:"none",style:{flexShrink:0,...t},children:Fo("path",{d:Ag})})}function Dg({size:e=16,style:t}){return Fo("svg",{width:e,height:e,viewBox:"0 0 158.7128 157.296",fill:"currentColor",stroke:"none",style:{flexShrink:0,...t},children:Fo("path",{d:Lg})})}function _g({size:e=16,style:t}){return Fo("svg",{width:e,height:e,viewBox:"0 0 49.7202 40.0402",fill:"currentColor",stroke:"none",style:{flexShrink:0,...t},children:Fo("path",{d:Pg,fillRule:"evenodd",clipRule:"evenodd"})})}function hi({provider:e,size:t=16,style:n}){return e==="codex"?Fo(Dg,{size:t,style:n}):e==="copilot"?Fo(_g,{size:t,style:n}):Fo(Bg,{size:t,style:n})}var ls=[{id:"claude-opus-4-6",label:"Opus 4.6",source:"static"},{id:"claude-sonnet-4-6",label:"Sonn 4.6",source:"static"}],cs=[{id:"gpt-5.4",label:"GPT 5.4",source:"static"},{id:"gpt-5.3-codex",label:"Codex 5.3",source:"static"},{id:"gpt-5.3-codex-spark",label:"Spark 5.3",source:"static"}],Ea=[{id:"",label:"Default",source:"static"}];var Og=[...ls,...cs,...Ea];function ka(e,t){if(t==="copilot"&&!e)return"Copilot";if(!e)return t==="codex"?"Codex":"Claude Code";let n=Og.find(o=>o.id===e);return n?n.label:e.replace(/-\d{8,}$/,"")}import{jsx as qc}from"react/jsx-runtime";var oo={iconDefault:"#1f2937",iconActive:"#1f2937",bgActive:"#dedede",bgHover:"#e2e2e2",separator:"#e5e7eb"};function $o({children:e,active:t,siblingActive:n,disabled:o,onClick:r,title:i}){let a=()=>o?.4:n&&!t?.5:1,s={position:"relative",display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,borderRadius:0,border:"none",cursor:o?"default":"pointer",transition:"background-color 150ms ease, color 150ms ease, transform 100ms ease, opacity 150ms ease",backgroundColor:t?oo.bgActive:"transparent",color:t?oo.iconActive:oo.iconDefault,opacity:a()};return qc("button",{type:"button",onClick:o?void 0:r,title:i,disabled:o,style:s,onMouseEnter:l=>{o||(l.currentTarget.style.opacity="1",t||(l.currentTarget.style.backgroundColor=oo.bgHover))},onMouseLeave:l=>{o||(l.currentTarget.style.opacity=String(a()),t||(l.currentTarget.style.backgroundColor="transparent"))},onMouseDown:l=>{o||(l.currentTarget.style.transform="scale(0.95)")},onMouseUp:l=>{o||(l.currentTarget.style.transform="scale(1)")},children:e})}function Xc(){return qc("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 8px"}})}import{Fragment as yi,jsx as pe,jsxs as Bt}from"react/jsx-runtime";function Kg(e,t){if(e<=0)return[];if(e<=4)return Array.from({length:e},(r,i)=>({key:`model-${i}`,index:i,active:i===t}));let n=e-1,o=r=>({key:`model-${r}`,index:r,active:r===t});return t===0?[o(0),o(1),o(2),{key:"overflow-after",overflow:!0}]:t===1?[{key:"overflow-before",overflow:!0},o(1),o(2),{key:"overflow-after",overflow:!0}]:t===n-1?[{key:"overflow-before",overflow:!0},o(n-2),o(n-1),o(n)]:t===n?[{key:"overflow-before",overflow:!0},o(n-2),o(n-1),o(n)]:t%2===0?[{key:"overflow-before",overflow:!0},o(t-1),o(t),{key:"overflow-after",overflow:!0}]:[{key:"overflow-before",overflow:!0},o(t),o(t+1),{key:"overflow-after",overflow:!0}]}var Er=[{type:"rectangle",icon:Vg,label:"Rectangle",shortcut:"R"},{type:"circle",icon:Ng,label:"Oval",shortcut:"O"},{type:"line",icon:Jg,label:"Line",shortcut:"L"},{type:"freehand",icon:jg,label:"Pen",shortcut:"P"}],Xg=new Set(Er.map(e=>e.type));function qg(e,t,n,o,r,i,a,s){let l=(e-r)*(o-i)-(n-r)*(t-i),c=(e-a)*(i-s)-(r-a)*(t-s),d=(e-n)*(s-o)-(a-n)*(t-o),u=l<0||c<0||d<0,p=l>0||c>0||d>0;return!(u&&p)}function Zg(e="bottom-right"){return bl(e,window.innerWidth,window.innerHeight)}var Qg=[{type:"text",icon:Ug,label:"Text",shortcut:"T"}],Zc={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"}]},eval:{name:"Evals",desc:"Synthesize inferred evals from design history.",usage:["Infer evals from annotations","Reject, refine, or approve proposals"],keys:[{key:"E",desc:"Select tool"},{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.
|
|
14
14
|
|
|
15
|
-
Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},Gg={zIndex:9999,display:"flex",alignItems:"center",backgroundColor:"#eaeaea",borderWidth:3,borderStyle:"solid",borderColor:"transparent",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",cursor:"pointer",overflow:"visible",boxSizing:"content-box",transition:"none"},Sa="devtools-toolbar-expanded",wa="devtools-annotations",Ca="devtools-style-modifications",Ea="devtools-active-tool",Yc="devtools-active-color",Vc="devtools-stroke-width",Uc="devtools-inspected-element",Ta="devtools-spacing-changes",Jg={expanded:Sa,annotations:wa,styleMods:Ca,spacingChanges:Ta,tool:Ea,color:Yc,stroke:Vc,inspected:Uc};function Kc({state:e,dispatch:t,onScreenshot:n,onSendToClaude:o,hasActiveJobs:r,activeJobColor:i,onCrosshairHover:a,onClear:s,provider:l="claude",onProviderChange:d,availableProviders:c,modelIndex:u=0,modelCount:f=2,modelLabel:p="Opus 4.6",onModelChange:b,onViewThread:S,isThreadPanelOpen:C,mcpStatus:P,bridgeUrl:H,isBridgeConnected:I,packageVersion:M,bridgeVersion:w,bridgeRestartState:$="idle",bridgeRestartMessage:Z,onBridgeRestart:q,modelSelectedComponent:k,modelCanvasHoveredComponent:O,onModelComponentHover:g,onSpacingTokenHover:m,onModifySpacingToken:j,onDeleteSpacingToken:ue,modelRefreshKey:Re,evalRefreshKey:de,onModelComponentAdded:we,onModelComponentRemoved:Ee,onSynthesizeRules:V,isSynthesizing:B,onSynthesizeEvals:re,isSynthesizingEvals:ge,onRunEval:_e,onViewEvalRunThread:Ue,runningEvalIds:te,onMouseEnter:ot,toolbarRef:Ke,snapPosition:xe="bottom-right",onSnapPositionChange:Le}){let[ut,W]=Sr(()=>typeof window<"u"?{w:window.innerWidth,h:window.innerHeight}:{w:1920,h:1080});mn(()=>{let L=()=>W({w:window.innerWidth,h:window.innerHeight});return window.addEventListener("resize",L),()=>window.removeEventListener("resize",L)},[]);let[ee,ie]=Sr(()=>typeof window>"u"?!1:localStorage.getItem(Sa)==="true"),[Ne,pt]=Sr(0),Te=Ht(0),rt=Ht(0),st=Ht(e.isAnnotating),Ye=Ht(!1),It=Ht(typeof window<"u"?localStorage.getItem(Ea):null),Xt=Ht(typeof window<"u"?localStorage.getItem(Yc):null),Jt=Ht(typeof window<"u"?localStorage.getItem(Vc):null),[Xe,je]=Sr(null),an=Ht(!1),nt=Ht(null),Mt=Ht(null),$n=Ht(null),[oe,Ce]=Sr([]),Be=Ht({x:0,y:0}),Ge=Ht(null),Pt=Ht(null),$e=Ht(null),lt=Vn(()=>{Ge.current=null,Pt.current=null,$e.current&&(clearTimeout($e.current),$e.current=null)},[]),qe=Vn(L=>{Mt.current&&(clearTimeout(Mt.current),Mt.current=null),an.current?(Ge.current=L,Pt.current={...Be.current},$e.current&&clearTimeout($e.current),$e.current=setTimeout(()=>{Ge.current&&(je(Ge.current),lt())},300)):(nt.current&&clearTimeout(nt.current),nt.current=setTimeout(()=>{an.current=!0,je(L),nt.current=null},500))},[lt]),Ot=Vn(()=>{lt(),nt.current&&(clearTimeout(nt.current),nt.current=null),Mt.current=setTimeout(()=>{an.current=!1,je(null)},150)},[lt]);mn(()=>{let L=$n.current;if(!L)return;let F=()=>{lt(),Mt.current&&(clearTimeout(Mt.current),Mt.current=null)},ne=()=>{Mt.current=setTimeout(()=>{an.current=!1,je(null)},150)};return L.addEventListener("mouseenter",F),L.addEventListener("mouseleave",ne),()=>{L.removeEventListener("mouseenter",F),L.removeEventListener("mouseleave",ne)}},[Xe,lt]),mn(()=>{if(Xe!=="counter"||!H)return;let L=!1;return mo(`${H}/threads/recent?limit=5`).then(F=>F.ok?F.json():[]).then(F=>{L||Ce(F)}).catch(()=>{}),()=>{L=!0}},[Xe,H]);let _n=Vn(L=>{if(Be.current={x:L.clientX,y:L.clientY},Ge.current&&Pt.current){let F=Pt.current,ne=Wg(xe);$g(L.clientX,L.clientY,F.x,F.y,ne.left,ne.y,ne.right,ne.y)||(je(Ge.current),lt())}},[lt,xe]),Yt=xr(()=>{let L=(c??[]).map(F=>F==="claude"?"Claude":F==="codex"?"Codex":F==="copilot"?"Copilot":F);return{name:"AI Model",desc:L.length>1?`${L.join(" and ")} are available.`:L.length===1?`Connected to ${L[0]}.`:"No AI providers detected.",usage:L.length>1?["Click the logo to switch between providers","Click the model name to switch tiers"]:["Click the model name to switch tiers"],keys:L.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}]}},[c]),xn=xr(()=>{let L=c&&c.length>0?c:["claude","codex","copilot"],F=L.indexOf(l);return L[(F>=0?F+1:0)%L.length]??l},[c,l]),no=xr(()=>zg(f,u),[f,u]);Sc(ee,e,Ye,!!r,Jg),mn(()=>{let L=new URLSearchParams(window.location.search);if(!L.has("popmelt"))return;let F=document.createElement("style");F.textContent="nextjs-portal, vite-error-overlay { display: none !important; }",document.head.appendChild(F);let ne=parseInt(L.get("popmelt")||"0",10)||0,ae=()=>{ie(!0),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SET_ANNOTATING",payload:!0})};if(ne>0){let le=setTimeout(ae,ne);return()=>clearTimeout(le)}ae()},[]),mn(()=>{if(localStorage.getItem(Sa)==="true"&&!e.isAnnotating){if(ee||ie(!0),t({type:"SET_TOOL",payload:It.current||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),Xt.current&&t({type:"SET_COLOR",payload:Xt.current}),Jt.current){let be=parseFloat(Jt.current);isNaN(be)||t({type:"SET_STROKE_WIDTH",payload:be})}let ne=localStorage.getItem(wa);if(ne)try{let be=JSON.parse(ne);if(Array.isArray(be)&&be.length>0){for(let Vt of be)(Vt.status==="waiting_input"||Vt.status==="in_flight")&&(Vt.status=Vt.threadId?"resolved":"pending");t({type:"RESTORE_ANNOTATIONS",payload:{annotations:be}})}}catch{}let ae=localStorage.getItem(Ca);if(ae)try{let be=JSON.parse(ae);Array.isArray(be)&&be.length>0&&(t({type:"RESTORE_STYLE_MODIFICATIONS",payload:be}),Hi(be))}catch{}let le=localStorage.getItem(Ta);if(le)try{let be=JSON.parse(le);Array.isArray(be)&&be.length>0&&t({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:be})}catch{}let fe=localStorage.getItem(Uc);if(fe)try{let{selector:be,info:Vt}=JSON.parse(fe);if(be){let _t=Tn(be);if(_t){let yt=Vt||{...Dn(_t),selector:be};t({type:"SELECT_ELEMENT",payload:{el:_t,info:yt}})}}}catch{}let Me=sessionStorage.getItem("popmelt-pending-focus");if(Me){sessionStorage.removeItem("popmelt-pending-focus");try{let{annotationId:be}=JSON.parse(Me);if(be){let Vt=ne?JSON.parse(ne)??[]:[];requestAnimationFrame(()=>{t({type:"SELECT_ANNOTATION",payload:{id:be}});let _t=Vt.find(yt=>yt.id===be);if(_t){let Ft=(_t.groupId?Vt.filter(ct=>ct.groupId===_t.groupId):[_t]).flatMap(ct=>ct.points);if(Ft.length>0){let ct=Math.min(...Ft.map(En=>En.x)),Cn=Math.max(...Ft.map(En=>En.x)),Mn=Math.min(...Ft.map(En=>En.y)),un=Math.max(...Ft.map(En=>En.y));window.scrollTo({left:(ct+Cn)/2-window.innerWidth/2,top:(Mn+un)/2-window.innerHeight/2,behavior:"smooth"})}}})}}catch{}}}let F=sessionStorage.getItem("popmelt-pending-thread");if(F){sessionStorage.removeItem("popmelt-pending-thread");try{let{threadId:ne,selector:ae,preview:le}=JSON.parse(F);ne&&requestAnimationFrame(()=>{if(ae)try{let fe=document.querySelector(ae);if(fe){let Me=fe.getBoundingClientRect(),be=Math.random().toString(36).slice(2,9);t({type:"ADD_TEXT",payload:{id:be,point:{x:Me.left+Me.width,y:Me.top},text:le||"[thread]",linkedSelector:ae,linkedAnchor:"top-left"}}),t({type:"SET_ANNOTATION_THREAD",payload:{ids:[be],threadId:ne}}),t({type:"SET_ANNOTATION_STATUS",payload:{ids:[be],status:"resolved"}})}}catch{}S&&S(ne)})}catch{}}return Ye.current=!0,()=>{Ye.current=!1}},[]);let On=Ht(e.styleModifications);mn(()=>{let L=On.current,F=e.styleModifications;L!==F&&(Ni(L),Hi(F),On.current=F)},[e.styleModifications]),mn(()=>{let L=st.current;st.current=e.isAnnotating,L&&!e.isAnnotating&&ee&&ie(!1)},[e.isAnnotating,ee]);let Kn=Ht(ee);Kn.current=ee,mn(()=>{let L=ne=>{if(ne.key==="Meta"||ne.key==="Control"){let ae=Date.now();if(ae-Te.current<300){if(rt.current++,rt.current>=2){if(Kn.current)t({type:"SET_ANNOTATING",payload:!1}),ie(!1);else{let Me=localStorage.getItem(Ea);t({type:"SET_TOOL",payload:Me||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),ie(!0)}rt.current=0}}else rt.current=1;Te.current=ae}else rt.current=0},F=ne=>{ne.key!=="Meta"&&ne.key!=="Control"&&(rt.current=0)};return window.addEventListener("keydown",L),window.addEventListener("keyup",F),()=>{window.removeEventListener("keydown",L),window.removeEventListener("keyup",F)}},[t]);let We=Vn(L=>{lt(),t({type:"SET_TOOL",payload:L}),e.isAnnotating||t({type:"SET_ANNOTATING",payload:!0}),an.current=!1,je(null),nt.current&&(clearTimeout(nt.current),nt.current=null),Mt.current&&(clearTimeout(Mt.current),Mt.current=null)},[t,e.isAnnotating,lt]),ht=Vn(async()=>{window.focus(),await n()},[n]),J=Vn(async()=>{o&&await o()},[o]),ke=Vn(()=>{t({type:"SET_ANNOTATING",payload:!1}),ie(!1)},[t]),Ze=Vn(()=>{Ni(e.styleModifications),document.querySelectorAll("[data-pm]").forEach(L=>L.removeAttribute("data-pm")),t({type:"CLEAR"}),t({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(wa),localStorage.removeItem(Ca),localStorage.removeItem(Ta),Sn(null),s?.()},[t,e.styleModifications,s]),[Ct,ln]=Sr(()=>{if(Xt.current){let L=Xt.current.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);if(L?.[1])return parseFloat(L[1])}return 29}),dt=Ht(null),Ie=Ht(null),tn=Ht(!1),qt=Vn(L=>{let F=L.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return F&&F[1]?parseFloat(F[1]):null},[]);mn(()=>{tn.current=!0;let L=`oklch(0.628 0.258 ${Ct})`;t({type:"SET_COLOR",payload:L}),requestAnimationFrame(()=>{tn.current=!1})},[Ct,t]),mn(()=>{if(tn.current)return;let L=qt(e.activeColor);L!==null&&Math.abs(L-Ct)>.5&&ln(L)},[e.activeColor,qt,Ct]);let Wn=Ht(null);mn(()=>{if(r&&i){let L=qt(i);L!==null&&Math.abs(L-Ct)>.5&&(Wn.current===null&&(Wn.current=Ct),ln(L))}else Wn.current!==null&&(ln(Wn.current),Wn.current=null)},[r,i,qt]);let zt=e.annotations.length>0;mn(()=>{let L=Ie.current;if(!L||!zt)return;let F=ne=>{ne.preventDefault(),ne.stopPropagation();let ae=ne.deltaY>0?-1:1,le=((Ct+ae)%360+360)%360,fe=`oklch(0.628 0.258 ${le})`;ln(le),e.selectedAnnotationIds.length>0&&t({type:"UPDATE_ANNOTATION_COLOR",payload:{id:e.lastSelectedId||e.selectedAnnotationIds[0],color:fe}})};return L.addEventListener("wheel",F,{passive:!1}),()=>L.removeEventListener("wheel",F)},[zt,e.selectedAnnotationIds,e.lastSelectedId,Ct,t]);let To=Ht(!1),er=Ht(0);mn(()=>{let L=e.annotations.some(ae=>!ae.status||ae.status==="pending"),F=To.current;To.current=L;let ne=er.current===0&&e.annotations.length>0;if(er.current=e.annotations.length,(F&&!L||ne&&!L)&&e.annotations.length>0){let ae=e.annotations.map(le=>qt(le.color)).filter(le=>le!==null);if(ae.length>0){let le=0,fe=-1;for(let Me=0;Me<360;Me++){let be=Math.min(...ae.map(Vt=>{let _t=Math.abs(Me-Vt);return Math.min(_t,360-_t)}));be>fe&&(fe=be,le=Me)}ln(le)}}},[e.annotations,qt]);let ko=Ht(!1),zo=Vn(()=>{ko.current=!1,dt.current=setTimeout(()=>{ko.current=!0,ln(29)},500)},[]),tr=Vn(()=>{dt.current&&(clearTimeout(dt.current),dt.current=null)},[]);mn(()=>()=>{dt.current&&clearTimeout(dt.current),$e.current&&clearTimeout($e.current)},[]);let hn=Ar(),Fo=xr(()=>e.annotations.filter(L=>!L.pathname||L.pathname===hn),[e.annotations,hn]),$o=xr(()=>Wi(e.annotations),[e.annotations]),Qe=xr(()=>{let L=[],F=new Set,ne=[...e.annotations].sort((ae,le)=>ae.timestamp-le.timestamp);for(let ae of ne)if(!$o.has(ae))if(ae.groupId){if(!F.has(ae.groupId)){F.add(ae.groupId);let le=e.annotations.filter(be=>be.groupId===ae.groupId&&!$o.has(be)),fe=le.find(be=>be.type!=="text")||le[0],Me=Math.min(...le.map(be=>be.timestamp));L.push({id:fe.id,pathname:ae.pathname,annotations:le,timestamp:Me})}}else L.push({id:ae.id,pathname:ae.pathname,annotations:[ae],timestamp:ae.timestamp});return L},[e.annotations,$o]),fo=xr(()=>Qe.filter(L=>!L.pathname||L.pathname===hn),[Qe,hn]),[Et,Sn]=Sr(null),In=Qe.length+e.styleModifications.length;mn(()=>{(In===0||Et!==null&&Et>=In)&&Sn(null)},[In,Et]),mn(()=>{if(e.selectedAnnotationIds.length===0&&!e.inspectedElement){Sn(null);return}if(e.selectedAnnotationIds.length>0){let L=e.selectedAnnotationIds[0],F=Qe.findIndex(ne=>ne.id===L||ne.annotations.some(ae=>ae.id===L));F>=0&&F!==Et&&Sn(F)}},[e.selectedAnnotationIds,e.inspectedElement,Qe]);let wn=Vn(()=>{if(In===0)return;let L;if(Et===null?L=0:Et+1>=In?L=null:L=Et+1,Sn(L),L===null){t({type:"SELECT_ANNOTATION",payload:{id:null}}),t({type:"SELECT_ELEMENT",payload:null});return}if(L<Qe.length){let F=Qe[L];if(!(!F.pathname||F.pathname===hn)){sessionStorage.setItem("popmelt-pending-focus",JSON.stringify({annotationId:F.id,pathname:F.pathname})),window.location.href=F.pathname;return}t({type:"SELECT_ELEMENT",payload:null}),t({type:"SELECT_ANNOTATION",payload:{id:F.id}});let ae=F.annotations.find(ct=>ct.type!=="text")||F.annotations[0];if(F.annotations.some(ct=>ct.linkedSelector))t({type:"SET_TOOL",payload:"inspector"});else if(ae?.type&&ae.type!=="text"&&ae.type!=="inspector"){t({type:"SET_TOOL",payload:ae.type});let ct=wr.findIndex(Cn=>Cn.type===ae.type);ct>=0&&pt(ct)}if(ae?.color){t({type:"SET_COLOR",payload:ae.color});let ct=qt(ae.color);ct!==null&&ln(ct)}let fe=F.annotations.flatMap(ct=>ct.points);if(fe.length===0)return;let Me=Math.min(...fe.map(ct=>ct.x)),be=Math.max(...fe.map(ct=>ct.x)),Vt=Math.min(...fe.map(ct=>ct.y)),_t=Math.max(...fe.map(ct=>ct.y)),yt=(Me+be)/2,Ft=(Vt+_t)/2;if(window.scrollTo({left:yt-window.innerWidth/2,top:Ft-window.innerHeight/2,behavior:"smooth"}),C&&S){let ct=F.annotations.find(Cn=>Cn.threadId)?.threadId;ct&&S(ct)}}else{let F=L-Qe.length,ne=e.styleModifications[F];if(!ne)return;let ae=Tn(ne.selector);if(!ae)return;t({type:"SELECT_ANNOTATION",payload:{id:null}}),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SELECT_ELEMENT",payload:{el:ae,info:ne.element}});let le=ae.getBoundingClientRect(),fe=le.left+le.width/2+window.scrollX,Me=le.top+le.height/2+window.scrollY;window.scrollTo({left:fe-window.innerWidth/2,top:Me-window.innerHeight/2,behavior:"smooth"})}},[Qe,hn,e.styleModifications,In,Et,t,qt,C,S]);mn(()=>{if(!ee)return;let L=F=>{let ne=document.activeElement;for(;ne?.shadowRoot?.activeElement;)ne=ne.shadowRoot.activeElement;if(ne?.tagName==="INPUT"||ne?.tagName==="TEXTAREA"||ne?.isContentEditable)return;if((F.metaKey||F.ctrlKey)&&F.key==="Enter"){o&&(e.annotations.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(fe=>!fe.captured).length>0)&&(F.preventDefault(),J());return}if((F.metaKey||F.ctrlKey)&&(F.key==="c"||F.key==="C"||F.code==="KeyC")){let fe=window.getSelection();if(fe&&fe.toString().length>0)return;(e.annotations.length>0||e.styleModifications.length>0)&&(F.preventDefault(),window.focus(),ht());return}if((F.metaKey||F.ctrlKey)&&(F.key==="Backspace"||F.key==="Delete")){F.preventDefault(),Ze();return}if(F.metaKey||F.ctrlKey||F.altKey)return;let ae={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand",e:"eval"};if(F.key.toLowerCase()==="m"){F.preventDefault(),We("model");return}let le=ae[F.key.toLowerCase()];if(le){F.preventDefault();let fe=wr.findIndex(Me=>Me.type===le);fe>=0&&pt(fe),We(le)}};return window.addEventListener("keydown",L),()=>window.removeEventListener("keydown",L)},[ee,We,ht,J,o,Ze,e.annotations.length,e.styleModifications.length,e.spacingTokenChanges,Xe]);let Wo=cl(xe,ut.w,ut.h),oo={...Gg,...Wo,borderRadius:0,padding:ee?"0 8px":"0",width:ee?"auto":48,height:48,gap:0,justifyContent:ee?"flex-start":"center"},ro=pe("div",{style:Gi({color:r&&i?i:"rgb(0,0,0)",animated:!!r})}),Xn=I===!1?"rgba(239, 68, 68, 0.4)":r&&i?i:to.iconActive,Zt=!!(M&&w&&M!==w),Io=$==="restarting"||!q&&!H,jo=$==="error"?"#dc2626":$==="ok"?to.iconDefault:Zt?"#b45309":to.iconDefault,Mo=$==="restarting"?"Restarting":$==="error"?"Restart failed":$==="ok"?"Restarted":Zt?"Update bridge":null,Tr=Z??(Zt?`Bridge ${w} is older than package ${M}. Restart bridge.`:w?`Bridge ${w}. Restart bridge.`:"Restart bridge"),Ro=Ht(null);mn(()=>{if(!ee)return;let L=Ro.current;if(!L)return;let F=()=>{a?.(!0),qe("collapse")},ne=()=>{a?.(!1),Ot()};return L.addEventListener("mouseenter",F),L.addEventListener("mouseleave",ne),()=>{L.removeEventListener("mouseenter",F),L.removeEventListener("mouseleave",ne)}},[ee,r,a,qe,Ot]);let Go=Ht(null);return mn(()=>{if(ee)return;let L=Go.current;if(!L)return;let F=L.querySelector("[data-popmelt-logo]"),ne=()=>{L.style.opacity="1",!r&&F&&(F.style.fill="#000"),ot?.()},ae=()=>{L.style.opacity=r?"1":"0.5",!r&&F&&(F.style.fill="none")};return L.addEventListener("mouseenter",ne),L.addEventListener("mouseleave",ae),()=>{L.removeEventListener("mouseenter",ne),L.removeEventListener("mouseleave",ae)}},[ee,r,ot]),ee?Dt(mi,{children:[pe("style",{children:`
|
|
15
|
+
Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{key:"\u2318\u2318",desc:"Toggle toolbar"}]}},em={zIndex:9999,display:"flex",alignItems:"center",backgroundColor:"#eaeaea",borderWidth:3,borderStyle:"solid",borderColor:"transparent",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",cursor:"pointer",overflow:"visible",boxSizing:"content-box",transition:"none"},Ta="devtools-toolbar-expanded",Ia="devtools-annotations",Ma="devtools-style-modifications",Ra="devtools-active-tool",Qc="devtools-active-color",ed="devtools-stroke-width",td="devtools-inspected-element",Aa="devtools-spacing-changes",tm={expanded:Ta,annotations:Ia,styleMods:Ma,spacingChanges:Aa,tool:Ra,color:Qc,stroke:ed,inspected:td};function nd({state:e,dispatch:t,onScreenshot:n,onSendToClaude:o,hasActiveJobs:r,activeJobColor:i,onCrosshairHover:a,onClear:s,provider:l="claude",onProviderChange:c,availableProviders:d,modelIndex:u=0,modelCount:p=2,modelLabel:f="Opus 4.6",onModelChange:b,onViewThread:C,isThreadPanelOpen:w,mcpStatus:M,bridgeUrl:L,isBridgeConnected:E,packageVersion:R,bridgeVersion:v,bridgeRestartState:D="idle",bridgeRestartMessage:j,onBridgeRestart:J,modelSelectedComponent:T,modelCanvasHoveredComponent:N,onModelComponentHover:g,onSpacingTokenHover:m,onModifySpacingToken:$,onDeleteSpacingToken:me,modelRefreshKey:ke,evalRefreshKey:ue,onModelComponentAdded:Ee,onModelComponentRemoved:Te,onSynthesizeRules:X,isSynthesizing:_,onSynthesizeEvals:oe,isSynthesizingEvals:ye,onRunEval:ze,onViewEvalRunThread:Ye,runningEvalIds:re,onMouseEnter:Ke,toolbarRef:Ge,snapPosition:we="bottom-right",onSnapPositionChange:Be}){let[ut,G]=Cr(()=>typeof window<"u"?{w:window.innerWidth,h:window.innerHeight}:{w:1920,h:1080});mn(()=>{let B=()=>G({w:window.innerWidth,h:window.innerHeight});return window.addEventListener("resize",B),()=>window.removeEventListener("resize",B)},[]);let[ce,te]=Cr(()=>typeof window>"u"?!1:localStorage.getItem(Ta)==="true"),[Oe,st]=Cr(0),Pe=_t(0),nt=_t(0),lt=_t(e.isAnnotating),Je=_t(!1),yt=_t(typeof window<"u"?localStorage.getItem(Ra):null),Xt=_t(typeof window<"u"?localStorage.getItem(Qc):null),Ht=_t(typeof window<"u"?localStorage.getItem(ed):null),[tt,Ve]=Cr(null),Yt=_t(!1),Xe=_t(null),Et=_t(null),Wn=_t(null),[Sn,Rn]=Cr([]),ln=_t({x:0,y:0}),Nt=_t(null),q=_t(null),se=_t(null),fe=Kn(()=>{Nt.current=null,q.current=null,se.current&&(clearTimeout(se.current),se.current=null)},[]),Ie=Kn(B=>{Et.current&&(clearTimeout(Et.current),Et.current=null),Yt.current?(Nt.current=B,q.current={...ln.current},se.current&&clearTimeout(se.current),se.current=setTimeout(()=>{Nt.current&&(Ve(Nt.current),fe())},300)):(Xe.current&&clearTimeout(Xe.current),Xe.current=setTimeout(()=>{Yt.current=!0,Ve(B),Xe.current=null},500))},[fe]),rt=Kn(()=>{fe(),Xe.current&&(clearTimeout(Xe.current),Xe.current=null),Et.current=setTimeout(()=>{Yt.current=!1,Ve(null)},150)},[fe]);mn(()=>{let B=Wn.current;if(!B)return;let W=()=>{fe(),Et.current&&(clearTimeout(Et.current),Et.current=null)},ne=()=>{Et.current=setTimeout(()=>{Yt.current=!1,Ve(null)},150)};return B.addEventListener("mouseenter",W),B.addEventListener("mouseleave",ne),()=>{B.removeEventListener("mouseenter",W),B.removeEventListener("mouseleave",ne)}},[tt,fe]),mn(()=>{if(tt!=="counter"||!L)return;let B=!1;return Qn(`${L}/threads/recent?limit=5`).then(W=>W.ok?W.json():[]).then(W=>{B||Rn(W)}).catch(()=>{}),()=>{B=!0}},[tt,L]);let ct=Kn(B=>{if(ln.current={x:B.clientX,y:B.clientY},Nt.current&&q.current){let W=q.current,ne=Zg(we);qg(B.clientX,B.clientY,W.x,W.y,ne.left,ne.y,ne.right,ne.y)||(Ve(Nt.current),fe())}},[fe,we]),gt=wr(()=>{let B=(d??[]).map(W=>W==="claude"?"Claude":W==="codex"?"Codex":W==="copilot"?"Copilot":W);return{name:"AI Model",desc:B.length>1?`${B.join(" and ")} are available.`:B.length===1?`Connected to ${B[0]}.`:"No AI providers detected.",usage:B.length>1?["Click the logo to switch between providers","Click the model name to switch tiers"]:["Click the model name to switch tiers"],keys:B.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]),Ut=wr(()=>{let B=d&&d.length>0?d:["claude","codex","copilot"],W=B.indexOf(l);return B[(W>=0?W+1:0)%B.length]??l},[d,l]),jn=wr(()=>Kg(p,u),[p,u]);Mc(ce,e,Je,!!r,tm),mn(()=>{let B=new URLSearchParams(window.location.search);if(!B.has("popmelt"))return;let W=document.createElement("style");W.textContent="nextjs-portal, vite-error-overlay { display: none !important; }",document.head.appendChild(W);let ne=parseInt(B.get("popmelt")||"0",10)||0,ae=()=>{te(!0),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SET_ANNOTATING",payload:!0})};if(ne>0){let le=setTimeout(ae,ne);return()=>clearTimeout(le)}ae()},[]),mn(()=>{if(localStorage.getItem(Ta)==="true"&&!e.isAnnotating){if(ce||te(!0),t({type:"SET_TOOL",payload:yt.current||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),Xt.current&&t({type:"SET_COLOR",payload:Xt.current}),Ht.current){let xe=parseFloat(Ht.current);isNaN(xe)||t({type:"SET_STROKE_WIDTH",payload:xe})}let ne=localStorage.getItem(Ia);if(ne)try{let xe=JSON.parse(ne);if(Array.isArray(xe)&&xe.length>0){for(let Jt of xe)(Jt.status==="waiting_input"||Jt.status==="in_flight")&&(Jt.status=Jt.threadId?"resolved":"pending");t({type:"RESTORE_ANNOTATIONS",payload:{annotations:xe}})}}catch{}let ae=localStorage.getItem(Ma);if(ae)try{let xe=JSON.parse(ae);Array.isArray(xe)&&xe.length>0&&(t({type:"RESTORE_STYLE_MODIFICATIONS",payload:xe}),Fi(xe))}catch{}let le=localStorage.getItem(Aa);if(le)try{let xe=JSON.parse(le);Array.isArray(xe)&&xe.length>0&&t({type:"RESTORE_SPACING_TOKEN_CHANGES",payload:xe})}catch{}let ge=localStorage.getItem(td);if(ge)try{let{selector:xe,info:Jt}=JSON.parse(ge);if(xe){let Dt=Tn(xe);if(Dt){let mt=Jt||{...Nn(Dt),selector:xe};t({type:"SELECT_ELEMENT",payload:{el:Dt,info:mt}})}}}catch{}let Ae=sessionStorage.getItem("popmelt-pending-focus");if(Ae){sessionStorage.removeItem("popmelt-pending-focus");try{let{annotationId:xe}=JSON.parse(Ae);if(xe){let Jt=ne?JSON.parse(ne)??[]:[];requestAnimationFrame(()=>{t({type:"SELECT_ANNOTATION",payload:{id:xe}});let Dt=Jt.find(mt=>mt.id===xe);if(Dt){let Ft=(Dt.groupId?Jt.filter(at=>at.groupId===Dt.groupId):[Dt]).flatMap(at=>at.points);if(Ft.length>0){let at=Math.min(...Ft.map(kn=>kn.x)),En=Math.max(...Ft.map(kn=>kn.x)),Pn=Math.min(...Ft.map(kn=>kn.y)),pn=Math.max(...Ft.map(kn=>kn.y));window.scrollTo({left:(at+En)/2-window.innerWidth/2,top:(Pn+pn)/2-window.innerHeight/2,behavior:"smooth"})}}})}}catch{}}}let W=sessionStorage.getItem("popmelt-pending-thread");if(W){sessionStorage.removeItem("popmelt-pending-thread");try{let{threadId:ne,selector:ae,preview:le}=JSON.parse(W);ne&&requestAnimationFrame(()=>{if(ae)try{let ge=document.querySelector(ae);if(ge){let Ae=ge.getBoundingClientRect(),xe=Math.random().toString(36).slice(2,9);t({type:"ADD_TEXT",payload:{id:xe,point:{x:Ae.left+Ae.width,y:Ae.top},text:le||"[thread]",linkedSelector:ae,linkedAnchor:"top-left"}}),t({type:"SET_ANNOTATION_THREAD",payload:{ids:[xe],threadId:ne}}),t({type:"SET_ANNOTATION_STATUS",payload:{ids:[xe],status:"resolved"}})}}catch{}C&&C(ne)})}catch{}}return Je.current=!0,()=>{Je.current=!1}},[]);let hn=_t(e.styleModifications);mn(()=>{let B=hn.current,W=e.styleModifications;B!==W&&($i(B),Fi(W),hn.current=W)},[e.styleModifications]),mn(()=>{let B=lt.current;lt.current=e.isAnnotating,B&&!e.isAnnotating&&ce&&te(!1)},[e.isAnnotating,ce]);let An=_t(ce);An.current=ce,mn(()=>{let B=ne=>{if(ne.key==="Meta"||ne.key==="Control"){let ae=Date.now();if(ae-Pe.current<300){if(nt.current++,nt.current>=2){if(An.current)t({type:"SET_ANNOTATING",payload:!1}),te(!1);else{let Ae=localStorage.getItem(Ra);t({type:"SET_TOOL",payload:Ae||"inspector"}),t({type:"SET_ANNOTATING",payload:!0}),te(!0)}nt.current=0}}else nt.current=1;Pe.current=ae}else nt.current=0},W=ne=>{ne.key!=="Meta"&&ne.key!=="Control"&&(nt.current=0)};return window.addEventListener("keydown",B),window.addEventListener("keyup",W),()=>{window.removeEventListener("keydown",B),window.removeEventListener("keyup",W)}},[t]);let He=Kn(B=>{fe(),t({type:"SET_TOOL",payload:B}),e.isAnnotating||t({type:"SET_ANNOTATING",payload:!0}),Yt.current=!1,Ve(null),Xe.current&&(clearTimeout(Xe.current),Xe.current=null),Et.current&&(clearTimeout(Et.current),Et.current=null)},[t,e.isAnnotating,fe]),bt=Kn(async()=>{window.focus(),await n()},[n]),Y=Kn(async()=>{o&&await o()},[o]),Me=Kn(()=>{t({type:"SET_ANNOTATING",payload:!1}),te(!1)},[t]),qe=Kn(()=>{$i(e.styleModifications),document.querySelectorAll("[data-pm]").forEach(B=>B.removeAttribute("data-pm")),t({type:"CLEAR"}),t({type:"CLEAR_ALL_STYLES"}),localStorage.removeItem(Ia),localStorage.removeItem(Ma),localStorage.removeItem(Aa),wn(null),s?.()},[t,e.styleModifications,s]),[kt,cn]=Cr(()=>{if(Xt.current){let B=Xt.current.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);if(B?.[1])return parseFloat(B[1])}return 29}),dt=_t(null),Re=_t(null),tn=_t(!1),qt=Kn(B=>{let W=B.match(/oklch\([^)]*\s+([\d.]+)\s*\)/);return W&&W[1]?parseFloat(W[1]):null},[]);mn(()=>{tn.current=!0;let B=`oklch(0.628 0.258 ${kt})`;t({type:"SET_COLOR",payload:B}),requestAnimationFrame(()=>{tn.current=!1})},[kt,t]),mn(()=>{if(tn.current)return;let B=qt(e.activeColor);B!==null&&Math.abs(B-kt)>.5&&cn(B)},[e.activeColor,qt,kt]);let Gn=_t(null);mn(()=>{if(r&&i){let B=qt(i);B!==null&&Math.abs(B-kt)>.5&&(Gn.current===null&&(Gn.current=kt),cn(B))}else Gn.current!==null&&(cn(Gn.current),Gn.current=null)},[r,i,qt]);let zt=e.annotations.length>0;mn(()=>{let B=Re.current;if(!B||!zt)return;let W=ne=>{ne.preventDefault(),ne.stopPropagation();let ae=ne.deltaY>0?-1:1,le=((kt+ae)%360+360)%360,ge=`oklch(0.628 0.258 ${le})`;cn(le),e.selectedAnnotationIds.length>0&&t({type:"UPDATE_ANNOTATION_COLOR",payload:{id:e.lastSelectedId||e.selectedAnnotationIds[0],color:ge}})};return B.addEventListener("wheel",W,{passive:!1}),()=>B.removeEventListener("wheel",W)},[zt,e.selectedAnnotationIds,e.lastSelectedId,kt,t]);let Mo=_t(!1),nr=_t(0);mn(()=>{let B=e.annotations.some(ae=>!ae.status||ae.status==="pending"),W=Mo.current;Mo.current=B;let ne=nr.current===0&&e.annotations.length>0;if(nr.current=e.annotations.length,(W&&!B||ne&&!B)&&e.annotations.length>0){let ae=e.annotations.map(le=>qt(le.color)).filter(le=>le!==null);if(ae.length>0){let le=0,ge=-1;for(let Ae=0;Ae<360;Ae++){let xe=Math.min(...ae.map(Jt=>{let Dt=Math.abs(Ae-Jt);return Math.min(Dt,360-Dt)}));xe>ge&&(ge=xe,le=Ae)}cn(le)}}},[e.annotations,qt]);let Ro=_t(!1),Wo=Kn(()=>{Ro.current=!1,dt.current=setTimeout(()=>{Ro.current=!0,cn(29)},500)},[]),or=Kn(()=>{dt.current&&(clearTimeout(dt.current),dt.current=null)},[]);mn(()=>()=>{dt.current&&clearTimeout(dt.current),se.current&&clearTimeout(se.current)},[]);let yn=Pr(),jo=wr(()=>e.annotations.filter(B=>!B.pathname||B.pathname===yn),[e.annotations,yn]),Go=wr(()=>Ji(e.annotations),[e.annotations]),Ze=wr(()=>{let B=[],W=new Set,ne=[...e.annotations].sort((ae,le)=>ae.timestamp-le.timestamp);for(let ae of ne)if(!Go.has(ae))if(ae.groupId){if(!W.has(ae.groupId)){W.add(ae.groupId);let le=e.annotations.filter(xe=>xe.groupId===ae.groupId&&!Go.has(xe)),ge=le.find(xe=>xe.type!=="text")||le[0],Ae=Math.min(...le.map(xe=>xe.timestamp));B.push({id:ge.id,pathname:ae.pathname,annotations:le,timestamp:Ae})}}else B.push({id:ae.id,pathname:ae.pathname,annotations:[ae],timestamp:ae.timestamp});return B},[e.annotations,Go]),ho=wr(()=>Ze.filter(B=>!B.pathname||B.pathname===yn),[Ze,yn]),[Tt,wn]=Cr(null),Ln=Ze.length+e.styleModifications.length;mn(()=>{(Ln===0||Tt!==null&&Tt>=Ln)&&wn(null)},[Ln,Tt]),mn(()=>{if(e.selectedAnnotationIds.length===0&&!e.inspectedElement){wn(null);return}if(e.selectedAnnotationIds.length>0){let B=e.selectedAnnotationIds[0],W=Ze.findIndex(ne=>ne.id===B||ne.annotations.some(ae=>ae.id===B));W>=0&&W!==Tt&&wn(W)}},[e.selectedAnnotationIds,e.inspectedElement,Ze]);let Cn=Kn(()=>{if(Ln===0)return;let B;if(Tt===null?B=0:Tt+1>=Ln?B=null:B=Tt+1,wn(B),B===null){t({type:"SELECT_ANNOTATION",payload:{id:null}}),t({type:"SELECT_ELEMENT",payload:null});return}if(B<Ze.length){let W=Ze[B];if(!(!W.pathname||W.pathname===yn)){sessionStorage.setItem("popmelt-pending-focus",JSON.stringify({annotationId:W.id,pathname:W.pathname})),window.location.href=W.pathname;return}t({type:"SELECT_ELEMENT",payload:null}),t({type:"SELECT_ANNOTATION",payload:{id:W.id}});let ae=W.annotations.find(at=>at.type!=="text")||W.annotations[0];if(W.annotations.some(at=>at.linkedSelector))t({type:"SET_TOOL",payload:"inspector"});else if(ae?.type&&ae.type!=="text"&&ae.type!=="inspector"){t({type:"SET_TOOL",payload:ae.type});let at=Er.findIndex(En=>En.type===ae.type);at>=0&&st(at)}if(ae?.color){t({type:"SET_COLOR",payload:ae.color});let at=qt(ae.color);at!==null&&cn(at)}let ge=W.annotations.flatMap(at=>at.points);if(ge.length===0)return;let Ae=Math.min(...ge.map(at=>at.x)),xe=Math.max(...ge.map(at=>at.x)),Jt=Math.min(...ge.map(at=>at.y)),Dt=Math.max(...ge.map(at=>at.y)),mt=(Ae+xe)/2,Ft=(Jt+Dt)/2;if(window.scrollTo({left:mt-window.innerWidth/2,top:Ft-window.innerHeight/2,behavior:"smooth"}),w&&C){let at=W.annotations.find(En=>En.threadId)?.threadId;at&&C(at)}}else{let W=B-Ze.length,ne=e.styleModifications[W];if(!ne)return;let ae=Tn(ne.selector);if(!ae)return;t({type:"SELECT_ANNOTATION",payload:{id:null}}),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SELECT_ELEMENT",payload:{el:ae,info:ne.element}});let le=ae.getBoundingClientRect(),ge=le.left+le.width/2+window.scrollX,Ae=le.top+le.height/2+window.scrollY;window.scrollTo({left:ge-window.innerWidth/2,top:Ae-window.innerHeight/2,behavior:"smooth"})}},[Ze,yn,e.styleModifications,Ln,Tt,t,qt,w,C]);mn(()=>{if(!ce)return;let B=W=>{let ne=document.activeElement;for(;ne?.shadowRoot?.activeElement;)ne=ne.shadowRoot.activeElement;if(ne?.tagName==="INPUT"||ne?.tagName==="TEXTAREA"||ne?.isContentEditable)return;if((W.metaKey||W.ctrlKey)&&W.key==="Enter"){o&&(e.annotations.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(ge=>!ge.captured).length>0)&&(W.preventDefault(),Y());return}if((W.metaKey||W.ctrlKey)&&(W.key==="c"||W.key==="C"||W.code==="KeyC")){let ge=window.getSelection();if(ge&&ge.toString().length>0)return;(e.annotations.length>0||e.styleModifications.length>0)&&(W.preventDefault(),window.focus(),bt());return}if((W.metaKey||W.ctrlKey)&&(W.key==="Backspace"||W.key==="Delete")){W.preventDefault(),qe();return}if(W.metaKey||W.ctrlKey||W.altKey)return;let ae={p:"freehand",l:"line",r:"rectangle",o:"circle",t:"text",c:"inspector",h:"hand",e:"eval"};if(W.key.toLowerCase()==="m"){W.preventDefault(),He("model");return}let le=ae[W.key.toLowerCase()];if(le){W.preventDefault();let ge=Er.findIndex(Ae=>Ae.type===le);ge>=0&&st(ge),He(le)}};return window.addEventListener("keydown",B),()=>window.removeEventListener("keydown",B)},[ce,He,bt,Y,o,qe,e.annotations.length,e.styleModifications.length,e.spacingTokenChanges,tt]);let Jo=ml(we,ut.w,ut.h),io={...em,...Jo,borderRadius:0,padding:ce?"0 8px":"0",width:ce?"auto":48,height:48,gap:0,justifyContent:ce?"flex-start":"center"},so=pe("div",{style:Yi({color:r&&i?i:"rgb(0,0,0)",animated:!!r})}),qn=E===!1?"rgba(239, 68, 68, 0.4)":r&&i?i:oo.iconActive,Zt=!!(R&&v&&R!==v),Ao=D==="restarting"||!J&&!L,Vo=D==="error"?"#dc2626":D==="ok"?oo.iconDefault:Zt?"#b45309":oo.iconDefault,Lo=D==="restarting"?"Restarting":D==="error"?"Restart failed":D==="ok"?"Restarted":Zt?"Update bridge":null,Ir=j??(Zt?`Bridge ${v} is older than package ${R}. Restart bridge.`:v?`Bridge ${v}. Restart bridge.`:"Restart bridge"),Po=_t(null);mn(()=>{if(!ce)return;let B=Po.current;if(!B)return;let W=()=>{a?.(!0),Ie("collapse")},ne=()=>{a?.(!1),rt()};return B.addEventListener("mouseenter",W),B.addEventListener("mouseleave",ne),()=>{B.removeEventListener("mouseenter",W),B.removeEventListener("mouseleave",ne)}},[ce,r,a,Ie,rt]);let Yo=_t(null);return mn(()=>{if(ce)return;let B=Yo.current;if(!B)return;let W=B.querySelector("[data-popmelt-logo]"),ne=()=>{B.style.opacity="1",!r&&W&&(W.style.fill="#000"),Ke?.()},ae=()=>{B.style.opacity=r?"1":"0.5",!r&&W&&(W.style.fill="none")};return B.addEventListener("mouseenter",ne),B.addEventListener("mouseleave",ae),()=>{B.removeEventListener("mouseenter",ne),B.removeEventListener("mouseleave",ae)}},[ce,r,Ke]),ce?Bt(yi,{children:[pe("style",{children:`
|
|
16
16
|
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
|
|
17
17
|
@keyframes popmelt-border-march { to { background-position: 0 -5px; } }
|
|
18
|
-
`}),pe("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),!
|
|
18
|
+
`}),pe("div",{id:"devtools-scrim",style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.06)",zIndex:9997,pointerEvents:"none"}}),!w&&(tt==="eval"||e.activeTool==="eval")&&pe(Bc,{bridgeUrl:L,refreshKey:ue,snapPosition:we,onSynthesize:oe,isSynthesizing:ye,onRunEval:ze,onViewRunThread:Ye,runningEvalIds:re,onMouseEnter:()=>{fe(),Et.current&&(clearTimeout(Et.current),Et.current=null)},onMouseLeave:e.activeTool==="eval"?void 0:rt}),!w&&(tt==="model"||e.activeTool==="model")&&pe(Kc,{bridgeUrl:L,selectedComponent:T,hoveredComponent:N,onComponentHover:g,onSpacingTokenHover:m,onModifySpacingToken:$,onDeleteSpacingToken:me,modelRefreshKey:ke,onComponentAdded:Ee,onComponentRemoved:Te,onSynthesizeRules:X,isSynthesizing:_,snapPosition:we,onMouseEnter:()=>{fe(),Et.current&&(clearTimeout(Et.current),Et.current=null)},onMouseLeave:e.activeTool==="model"?void 0:rt}),tt&&tt!=="model"&&tt!=="eval"&&(tt==="provider"||Zc[tt])&&(()=>{let B=tt==="provider"?gt:Zc[tt];return Bt("div",{ref:Wn,style:{...hl(we,ut.w,ut.h),width:300,backgroundColor:"#eaeaea",...Gr,boxSizing:"content-box",zIndex:10001,fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:12,color:"#1f2937",padding:12,...tt!=="collapse"&&tt!=="counter"?{pointerEvents:"none"}:{}},children:[tt==="collapse"&&pe("div",{style:{marginBottom:10,width:"fit-content",color:oo.iconDefault},children:pe("svg",{width:"48",height:"48",viewBox:"0 0 40 40",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:pe("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"})})}),Bt("div",{style:{display:"flex",alignItems:"center",gap:6,fontWeight:700,fontSize:13,marginBottom:6},children:[pe("span",{children:B.name}),B.keys[0]&&pe("code",{style:{fontSize:10,fontWeight:500,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",color:"#6b7280"},children:B.keys[0].key})]}),pe("div",{style:{color:"#6b7280",lineHeight:1.5,marginBottom:tt==="collapse"?0:10},children:B.desc.split(`
|
|
19
19
|
|
|
20
|
-
`).map((F,ne)=>pe("p",{style:{margin:0,marginTop:ne>0?8:0},children:F},ne))}),L.usage.map((F,ne)=>Dt("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[pe("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),pe("span",{children:F})]},ne)),Xe==="collapse"&&Le&&Dt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8},children:[pe("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:6,textTransform:"uppercase",letterSpacing:"0.05em"},children:"Position"}),pe("div",{style:{display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gap:3,width:"fit-content"},children:fl.map(F=>{let ne=F===xe;return pe("button",{type:"button",onClick:()=>{je(null),an.current=!1,lt(),Le(F)},title:F,style:{width:24,height:16,border:"none",cursor:"pointer",padding:0,backgroundColor:ne?"#1f2937":"rgba(0,0,0,0.08)",transition:"background-color 100ms ease"},onMouseEnter:ae=>{ne||(ae.currentTarget.style.backgroundColor="rgba(0,0,0,0.15)")},onMouseLeave:ae=>{ne||(ae.currentTarget.style.backgroundColor="rgba(0,0,0,0.08)")}},F)})})]}),Xe==="collapse"&&(()=>{let F=Object.entries(P??{}),ne=F.filter(([,Me])=>Me.found&&!Me.disabled).map(([Me])=>Me.charAt(0).toUpperCase()+Me.slice(1)),ae=F.filter(([,Me])=>!Me.found).map(([Me])=>Me);if(!H&&!q&&ne.length===0&&ae.length===0)return null;let le=ae.map(Me=>Me.charAt(0).toUpperCase()+Me.slice(1)),fe=[...ne,...le];return Dt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8,display:"flex",alignItems:"center",gap:6,fontSize:11},children:[(q||H)&&pe("button",{type:"button",onClick:()=>{Io||(q?q():Ya(H))},disabled:Io,title:Tr,"aria-label":Mo??"Restart bridge",style:{display:"flex",alignItems:"center",justifyContent:"center",width:22,height:22,border:"none",borderRadius:0,backgroundColor:Zt||$!=="idle"?"rgba(0,0,0,0.07)":"rgba(0,0,0,0.04)",color:jo,cursor:Io?"default":"pointer",padding:0,opacity:Io?.55:1,flexShrink:0},children:$==="ok"?pe(Ig,{size:14,strokeWidth:1.8}):pe(Dg,{size:13,strokeWidth:1.7,style:{animation:$==="restarting"?"spin 0.8s linear infinite":void 0}})}),ne.length>0?Dt("span",{style:{color:"#6b7280"},children:["Available in ",fe.join(", ")]}):ae.length>0?Dt("span",{style:{color:"#6b7280"},children:["Available in ",le.join(", ")]}):null]})})(),L.keys.length>1&&pe("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8,display:"flex",flexDirection:"column",gap:4},children:L.keys.slice(1).map((F,ne)=>Dt("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:F.accent?"#fff":"#6b7280"},children:[pe("code",{style:{fontSize:10,backgroundColor:F.accent?e.activeColor:"rgba(0,0,0,0.06)",color:F.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:F.key}),pe("span",{style:{color:F.accent?e.activeColor:void 0,fontWeight:F.accent?600:void 0},children:F.desc})]},ne))}),Xe==="counter"&&Qe.length>0&&(()=>{let F=pe("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8},children:pe("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:4,textTransform:"uppercase",letterSpacing:"0.05em"},children:"Active"})}),ne=new Map;for(let fe of Qe){let Me=fe.pathname||hn;ne.has(Me)||ne.set(Me,[]),ne.get(Me).push(fe)}let ae=[...ne.entries()],le=ae.length>1;return Dt("div",{children:[F,pe("div",{style:{maxHeight:200,overflowY:"auto",scrollbarWidth:"thin"},children:ae.map(([fe,Me])=>pe("div",{style:{marginBottom:le?4:0},children:Me.map(be=>{let _t=be.annotations.find(Mn=>Mn.type==="text"&&Mn.text)?.text||`[${be.annotations[0]?.type??"annotation"}]`,yt=e.selectedAnnotationIds.includes(be.id),Ft=Qe.indexOf(be),ct=Ft+1,Cn=be.annotations[0]?.color??e.activeColor;return Dt("div",{onClick:()=>{if(!(!be.pathname||be.pathname===hn)){sessionStorage.setItem("popmelt-pending-focus",JSON.stringify({annotationId:be.id,pathname:be.pathname})),window.location.href=be.pathname;return}if(Sn(Ft),t({type:"SELECT_ELEMENT",payload:null}),t({type:"SELECT_ANNOTATION",payload:{id:be.id}}),S){let un=be.annotations.find(En=>En.threadId)?.threadId;un&&S(un)}an.current=!1,je(null)},style:{display:"flex",alignItems:"baseline",gap:4,padding:"2px 0",cursor:"pointer"},onMouseEnter:Mn=>{let un=Mn.currentTarget.querySelector("[data-route-badge]");un&&(un.style.backgroundColor=Cn,un.style.color="#fff")},onMouseLeave:Mn=>{if(yt)return;let un=Mn.currentTarget.querySelector("[data-route-badge]");un&&(un.style.backgroundColor="rgba(0,0,0,0.06)",un.style.color="#6b7280")},children:[Dt("code",{"data-route-badge":!0,style:{fontSize:10,color:yt?"#fff":"#6b7280",backgroundColor:yt?Cn:"rgba(0,0,0,0.06)",padding:"1px 4px",flexShrink:0,whiteSpace:"nowrap"},children:[ct,". ",le?fe:""]}),pe("span",{style:{fontSize:11,color:yt?"#1f2937":"#6b7280",fontWeight:yt?600:400,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:_t})]},be.id)})},fe))})]})})(),Xe==="counter"&&(()=>{let F=new Set(Qe.flatMap(le=>le.annotations.map(fe=>fe.threadId).filter(Boolean))),ne=oe.filter(le=>!F.has(le.id));if(ne.length===0)return null;let ae=le=>{let fe=Math.floor((Date.now()-le)/1e3);if(fe<60)return"now";let Me=Math.floor(fe/60);if(Me<60)return`${Me}m`;let be=Math.floor(Me/60);return be<24?`${be}h`:`${Math.floor(be/24)}d`};return Dt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8},children:[pe("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:4,textTransform:"uppercase",letterSpacing:"0.05em"},children:"Recent"}),ne.map(le=>Dt("div",{onClick:()=>{let fe=le.elementIdentifiers[0];if(fe){let Me=fe.indexOf(":"),be=Me>0&&fe[0]==="/",Vt=be?fe.slice(0,Me):void 0,_t=be?fe.slice(Me+1):fe;if(!(!Vt||Vt===hn)){sessionStorage.setItem("popmelt-pending-thread",JSON.stringify({threadId:le.id,selector:_t,preview:le.preview})),window.location.href=Vt;return}try{let Ft=document.querySelector(_t);if(Ft){let ct=Ft.getBoundingClientRect(),Cn=Math.random().toString(36).slice(2,9);t({type:"ADD_TEXT",payload:{id:Cn,point:{x:ct.left+ct.width,y:ct.top},text:le.preview,linkedSelector:_t,linkedAnchor:"top-left"}}),t({type:"SET_ANNOTATION_THREAD",payload:{ids:[Cn],threadId:le.id}}),t({type:"SET_ANNOTATION_STATUS",payload:{ids:[Cn],status:"resolved"}})}}catch{}}S&&S(le.id),an.current=!1,je(null)},style:{display:"flex",alignItems:"baseline",justifyContent:"space-between",gap:8,padding:"2px 0",cursor:"pointer",color:"#6b7280",fontSize:11},onMouseEnter:fe=>{fe.currentTarget.style.color="#1f2937"},onMouseLeave:fe=>{fe.currentTarget.style.color="#6b7280"},children:[pe("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:le.preview}),pe("span",{style:{flexShrink:0,fontSize:10,color:"#9ca3af"},children:ae(le.createdAt)})]},le.id))]})})()]})})(),Dt("div",{ref:L=>{Ke&&(Ke.current=L)},id:"devtools-toolbar",style:oo,onMouseEnter:ot,onMouseMove:_n,children:[ro,Dt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[pe("span",{onMouseEnter:()=>qe("inspector"),onMouseLeave:Ot,children:pe(No,{active:e.isAnnotating&&e.activeTool==="inspector",siblingActive:e.isAnnotating,onClick:()=>We("inspector"),children:pe(Pg,{size:20,strokeWidth:1.5})})}),pe("span",{onMouseEnter:()=>qe("hand"),onMouseLeave:Ot,children:pe(No,{active:e.isAnnotating&&e.activeTool==="hand",siblingActive:e.isAnnotating,onClick:()=>We("hand"),children:Dt("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[pe(Lg,{size:20,strokeWidth:1.5}),e.styleModifications.filter(L=>!L.captured).length>0&&pe("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(L=>!L.captured).length})]})})}),(()=>{let L=wr[Ne],F=L.icon,ne=e.isAnnotating&&Fg.has(e.activeTool);return pe("span",{onMouseEnter:()=>qe(L.type),onMouseLeave:Ot,children:Dt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[pe(No,{active:ne,siblingActive:e.isAnnotating,onClick:()=>We(L.type),children:pe(F,{size:20,strokeWidth:1.5})}),pe("button",{type:"button",onClick:()=>{let ae=(Ne+1)%wr.length;pt(ae),We(wr[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&&!ne?.5:1,transition:"opacity 150ms ease"},children:wr.map((ae,le)=>pe("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:le===Ne?to.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},le))})]})})})(),jg.map(({type:L,icon:F,label:ne,shortcut:ae})=>pe("span",{onMouseEnter:()=>qe(L),onMouseLeave:Ot,children:pe(No,{active:e.isAnnotating&&e.activeTool===L,siblingActive:e.isAnnotating,onClick:()=>We(L),children:pe(F,{size:20,strokeWidth:1.5})})},L)),pe("span",{onMouseEnter:()=>qe("eval"),onMouseLeave:Ot,children:pe(No,{active:e.isAnnotating&&e.activeTool==="eval",siblingActive:e.isAnnotating,onClick:()=>We("eval"),children:pe(Ag,{size:18,strokeWidth:1.5})})}),pe("span",{onMouseEnter:()=>qe("model"),onMouseLeave:Ot,children:pe(No,{active:e.isAnnotating&&e.activeTool==="model",siblingActive:e.isAnnotating,onClick:()=>We("model"),children:pe(Rg,{size:17,strokeWidth:1.5})})})]}),pe(jc,{}),Dt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(Qe.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(L=>!L.captured).length>0)&&(()=>{let L=Et!==null&&Et<Qe.length?Qe[Et]:null,F=e.annotations.length>0&&e.annotations.every(le=>le.status&&le.status!=="pending"),ne=Et!==null?L?.annotations.some(le=>le.status&&le.status!=="pending")??!1:F,ae=`oklch(0.628 0.258 ${Ct})`;return pe("span",{onMouseEnter:()=>qe("counter"),onMouseLeave:Ot,children:pe("button",{ref:Ie,type:"button",onClick:()=>{if(ko.current){ko.current=!1;return}wn()},onMouseDown:zo,onMouseUp:tr,onMouseLeave:tr,title:"",style:{display:"flex",alignItems:"center",justifyContent:"center",gap:4,minWidth:20,height:20,padding:"0 8px",marginRight:4,border:"none",borderRadius:0,background:ne&&Et===null?"#999999":ae,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:(()=>{let le=Qe.length+e.styleModifications.length+e.spacingTokenChanges.filter(Me=>!Me.captured).length;if(Et!==null)return Dt(mi,{children:[Et+1,Dt("span",{style:{opacity:.4,display:"flex",gap:4},children:[pe("span",{children:"/"}),pe("span",{children:le})]})]});let fe=fo.length+e.styleModifications.length+e.spacingTokenChanges.filter(Me=>!Me.captured).length;return le>fe?Dt(mi,{children:[fe,Dt("span",{style:{opacity:.4,display:"flex",gap:4},children:[pe("span",{children:"/"}),pe("span",{children:le})]})]}):le})()})})})(),(e.annotations.length>0||e.styleModifications.length>0)&&pe("span",{onMouseEnter:()=>qe("clear"),onMouseLeave:Ot,children:pe(No,{siblingActive:e.isAnnotating,onClick:Ze,title:"Clear all (\u2318\u232B)",children:pe(Hg,{size:17,strokeWidth:1.5})})}),d&&Dt(mi,{children:[pe("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 2px"}}),pe("span",{onMouseEnter:()=>qe("provider"),onMouseLeave:Ot,style:{display:"contents"},children:Dt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[pe(No,{onClick:()=>d(xn),children:pe(gi,{provider:l})}),Dt("button",{type:"button",onClick:()=>{let L=(u+1)%f;b?.(L)},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:to.iconDefault,whiteSpace:"nowrap"},children:[pe("span",{children:p}),pe("span",{style:{display:"flex",flexDirection:"column",alignItems:"center",gap:2},children:no.map(L=>pe("div",{style:{width:L.overflow?2:3,height:L.overflow?2:3,borderRadius:"50%",backgroundColor:L.active?to.iconDefault:"rgba(0,0,0,0.2)",opacity:L.overflow?.65:1,transition:"background-color 150ms ease, opacity 150ms ease"}},L.key))})]})]})})]}),pe("div",{ref:Ro,style:{display:"inline-flex",cursor:"pointer"},children:pe("button",{type:"button",onClick:ke,title:"Collapse (\u2318\u2318)",style:{display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,border:"none",background:"none",padding:0,cursor:"inherit"},children:pe("svg",{"data-popmelt-logo":!0,width:"30",height:"30",viewBox:"0 0 40 40",fill:Xn,stroke:"none",xmlns:"http://www.w3.org/2000/svg",children:pe("path",{d:"M20.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.00293Z"})})})})]})]})]}):Dt(mi,{children:[pe("style",{children:`
|
|
20
|
+
`).map((W,ne)=>pe("p",{style:{margin:0,marginTop:ne>0?8:0},children:W},ne))}),B.usage.map((W,ne)=>Bt("div",{style:{display:"flex",gap:6,marginBottom:3,lineHeight:1.4},children:[pe("span",{style:{color:"#9ca3af",flexShrink:0},children:"\u2013"}),pe("span",{children:W})]},ne)),tt==="collapse"&&Be&&Bt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8},children:[pe("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:6,textTransform:"uppercase",letterSpacing:"0.05em"},children:"Position"}),pe("div",{style:{display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gap:3,width:"fit-content"},children:vl.map(W=>{let ne=W===we;return pe("button",{type:"button",onClick:()=>{Ve(null),Yt.current=!1,fe(),Be(W)},title:W,style:{width:24,height:16,border:"none",cursor:"pointer",padding:0,backgroundColor:ne?"#1f2937":"rgba(0,0,0,0.08)",transition:"background-color 100ms ease"},onMouseEnter:ae=>{ne||(ae.currentTarget.style.backgroundColor="rgba(0,0,0,0.15)")},onMouseLeave:ae=>{ne||(ae.currentTarget.style.backgroundColor="rgba(0,0,0,0.08)")}},W)})})]}),tt==="collapse"&&(()=>{let W=Object.entries(M??{}),ne=W.filter(([,Ae])=>Ae.found&&!Ae.disabled).map(([Ae])=>Ae.charAt(0).toUpperCase()+Ae.slice(1)),ae=W.filter(([,Ae])=>!Ae.found).map(([Ae])=>Ae);if(!L&&!J&&ne.length===0&&ae.length===0)return null;let le=ae.map(Ae=>Ae.charAt(0).toUpperCase()+Ae.slice(1)),ge=[...ne,...le];return Bt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:10,paddingTop:8,display:"flex",alignItems:"center",gap:6,fontSize:11},children:[(J||L)&&pe("button",{type:"button",onClick:()=>{Ao||(J?J():Za(L))},disabled:Ao,title:Ir,"aria-label":Lo??"Restart bridge",style:{display:"flex",alignItems:"center",justifyContent:"center",width:22,height:22,border:"none",borderRadius:0,backgroundColor:Zt||D!=="idle"?"rgba(0,0,0,0.07)":"rgba(0,0,0,0.04)",color:Vo,cursor:Ao?"default":"pointer",padding:0,opacity:Ao?.55:1,flexShrink:0},children:D==="ok"?pe(Hg,{size:14,strokeWidth:1.8}):pe(Gg,{size:13,strokeWidth:1.7,style:{animation:D==="restarting"?"spin 0.8s linear infinite":void 0}})}),ne.length>0?Bt("span",{style:{color:"#6b7280"},children:["Available in ",ge.join(", ")]}):ae.length>0?Bt("span",{style:{color:"#6b7280"},children:["Available in ",le.join(", ")]}):null]})})(),B.keys.length>1&&pe("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8,display:"flex",flexDirection:"column",gap:4},children:B.keys.slice(1).map((W,ne)=>Bt("div",{style:{display:"flex",alignItems:"center",gap:8,fontSize:11,color:W.accent?"#fff":"#6b7280"},children:[pe("code",{style:{fontSize:10,backgroundColor:W.accent?e.activeColor:"rgba(0,0,0,0.06)",color:W.accent?"#fff":void 0,padding:"1px 4px",whiteSpace:"nowrap"},children:W.key}),pe("span",{style:{color:W.accent?e.activeColor:void 0,fontWeight:W.accent?600:void 0},children:W.desc})]},ne))}),tt==="counter"&&Ze.length>0&&(()=>{let W=pe("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8},children:pe("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:4,textTransform:"uppercase",letterSpacing:"0.05em"},children:"Active"})}),ne=new Map;for(let ge of Ze){let Ae=ge.pathname||yn;ne.has(Ae)||ne.set(Ae,[]),ne.get(Ae).push(ge)}let ae=[...ne.entries()],le=ae.length>1;return Bt("div",{children:[W,pe("div",{style:{maxHeight:200,overflowY:"auto",scrollbarWidth:"thin"},children:ae.map(([ge,Ae])=>pe("div",{style:{marginBottom:le?4:0},children:Ae.map(xe=>{let Dt=xe.annotations.find(Pn=>Pn.type==="text"&&Pn.text)?.text||`[${xe.annotations[0]?.type??"annotation"}]`,mt=e.selectedAnnotationIds.includes(xe.id),Ft=Ze.indexOf(xe),at=Ft+1,En=xe.annotations[0]?.color??e.activeColor;return Bt("div",{onClick:()=>{if(!(!xe.pathname||xe.pathname===yn)){sessionStorage.setItem("popmelt-pending-focus",JSON.stringify({annotationId:xe.id,pathname:xe.pathname})),window.location.href=xe.pathname;return}if(wn(Ft),t({type:"SELECT_ELEMENT",payload:null}),t({type:"SELECT_ANNOTATION",payload:{id:xe.id}}),C){let pn=xe.annotations.find(kn=>kn.threadId)?.threadId;pn&&C(pn)}Yt.current=!1,Ve(null)},style:{display:"flex",alignItems:"baseline",gap:4,padding:"2px 0",cursor:"pointer"},onMouseEnter:Pn=>{let pn=Pn.currentTarget.querySelector("[data-route-badge]");pn&&(pn.style.backgroundColor=En,pn.style.color="#fff")},onMouseLeave:Pn=>{if(mt)return;let pn=Pn.currentTarget.querySelector("[data-route-badge]");pn&&(pn.style.backgroundColor="rgba(0,0,0,0.06)",pn.style.color="#6b7280")},children:[Bt("code",{"data-route-badge":!0,style:{fontSize:10,color:mt?"#fff":"#6b7280",backgroundColor:mt?En:"rgba(0,0,0,0.06)",padding:"1px 4px",flexShrink:0,whiteSpace:"nowrap"},children:[at,". ",le?ge:""]}),pe("span",{style:{fontSize:11,color:mt?"#1f2937":"#6b7280",fontWeight:mt?600:400,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:Dt})]},xe.id)})},ge))})]})})(),tt==="counter"&&(()=>{let W=new Set(Ze.flatMap(le=>le.annotations.map(ge=>ge.threadId).filter(Boolean))),ne=Sn.filter(le=>!W.has(le.id));if(ne.length===0)return null;let ae=le=>{let ge=Math.floor((Date.now()-le)/1e3);if(ge<60)return"now";let Ae=Math.floor(ge/60);if(Ae<60)return`${Ae}m`;let xe=Math.floor(Ae/60);return xe<24?`${xe}h`:`${Math.floor(xe/24)}d`};return Bt("div",{style:{borderTop:"1px solid rgba(0,0,0,0.08)",marginTop:8,paddingTop:8},children:[pe("div",{style:{fontSize:10,color:"#9ca3af",marginBottom:4,textTransform:"uppercase",letterSpacing:"0.05em"},children:"Recent"}),ne.map(le=>Bt("div",{onClick:()=>{let ge=le.elementIdentifiers[0];if(ge){let Ae=ge.indexOf(":"),xe=Ae>0&&ge[0]==="/",Jt=xe?ge.slice(0,Ae):void 0,Dt=xe?ge.slice(Ae+1):ge;if(!(!Jt||Jt===yn)){sessionStorage.setItem("popmelt-pending-thread",JSON.stringify({threadId:le.id,selector:Dt,preview:le.preview})),window.location.href=Jt;return}try{let Ft=document.querySelector(Dt);if(Ft){let at=Ft.getBoundingClientRect(),En=Math.random().toString(36).slice(2,9);t({type:"ADD_TEXT",payload:{id:En,point:{x:at.left+at.width,y:at.top},text:le.preview,linkedSelector:Dt,linkedAnchor:"top-left"}}),t({type:"SET_ANNOTATION_THREAD",payload:{ids:[En],threadId:le.id}}),t({type:"SET_ANNOTATION_STATUS",payload:{ids:[En],status:"resolved"}})}}catch{}}C&&C(le.id),Yt.current=!1,Ve(null)},style:{display:"flex",alignItems:"baseline",justifyContent:"space-between",gap:8,padding:"2px 0",cursor:"pointer",color:"#6b7280",fontSize:11},onMouseEnter:ge=>{ge.currentTarget.style.color="#1f2937"},onMouseLeave:ge=>{ge.currentTarget.style.color="#6b7280"},children:[pe("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:le.preview}),pe("span",{style:{flexShrink:0,fontSize:10,color:"#9ca3af"},children:ae(le.createdAt)})]},le.id))]})})()]})})(),Bt("div",{ref:B=>{Ge&&(Ge.current=B)},id:"devtools-toolbar",style:io,onMouseEnter:Ke,onMouseMove:ct,children:[so,Bt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[pe("span",{onMouseEnter:()=>Ie("inspector"),onMouseLeave:rt,children:pe($o,{active:e.isAnnotating&&e.activeTool==="inspector",siblingActive:e.isAnnotating,onClick:()=>He("inspector"),children:pe(Wg,{size:20,strokeWidth:1.5})})}),pe("span",{onMouseEnter:()=>Ie("hand"),onMouseLeave:rt,children:pe($o,{active:e.isAnnotating&&e.activeTool==="hand",siblingActive:e.isAnnotating,onClick:()=>He("hand"),children:Bt("div",{style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center"},children:[pe($g,{size:20,strokeWidth:1.5}),e.styleModifications.filter(B=>!B.captured).length>0&&pe("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(B=>!B.captured).length})]})})}),(()=>{let B=Er[Oe],W=B.icon,ne=e.isAnnotating&&Xg.has(e.activeTool);return pe("span",{onMouseEnter:()=>Ie(B.type),onMouseLeave:rt,children:Bt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[pe($o,{active:ne,siblingActive:e.isAnnotating,onClick:()=>He(B.type),children:pe(W,{size:20,strokeWidth:1.5})}),pe("button",{type:"button",onClick:()=>{let ae=(Oe+1)%Er.length;st(ae),He(Er[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&&!ne?.5:1,transition:"opacity 150ms ease"},children:Er.map((ae,le)=>pe("div",{style:{width:3,height:3,borderRadius:"50%",backgroundColor:le===Oe?oo.iconDefault:"rgba(0,0,0,0.2)",transition:"background-color 150ms ease"}},le))})]})})})(),Qg.map(({type:B,icon:W,label:ne,shortcut:ae})=>pe("span",{onMouseEnter:()=>Ie(B),onMouseLeave:rt,children:pe($o,{active:e.isAnnotating&&e.activeTool===B,siblingActive:e.isAnnotating,onClick:()=>He(B),children:pe(W,{size:20,strokeWidth:1.5})})},B)),pe("span",{onMouseEnter:()=>Ie("eval"),onMouseLeave:rt,children:pe($o,{active:e.isAnnotating&&e.activeTool==="eval",siblingActive:e.isAnnotating,onClick:()=>He("eval"),children:pe(Fg,{size:18,strokeWidth:1.5})})}),pe("span",{onMouseEnter:()=>Ie("model"),onMouseLeave:rt,children:pe($o,{active:e.isAnnotating&&e.activeTool==="model",siblingActive:e.isAnnotating,onClick:()=>He("model"),children:pe(zg,{size:17,strokeWidth:1.5})})})]}),pe(Xc,{}),Bt("div",{style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"},children:[(Ze.length>0||e.styleModifications.length>0||e.spacingTokenChanges.filter(B=>!B.captured).length>0)&&(()=>{let B=Tt!==null&&Tt<Ze.length?Ze[Tt]:null,W=e.annotations.length>0&&e.annotations.every(le=>le.status&&le.status!=="pending"),ne=Tt!==null?B?.annotations.some(le=>le.status&&le.status!=="pending")??!1:W,ae=`oklch(0.628 0.258 ${kt})`;return pe("span",{onMouseEnter:()=>Ie("counter"),onMouseLeave:rt,children:pe("button",{ref:Re,type:"button",onClick:()=>{if(Ro.current){Ro.current=!1;return}Cn()},onMouseDown:Wo,onMouseUp:or,onMouseLeave:or,title:"",style:{display:"flex",alignItems:"center",justifyContent:"center",gap:4,minWidth:20,height:20,padding:"0 8px",marginRight:4,border:"none",borderRadius:0,background:ne&&Tt===null?"#999999":ae,cursor:"pointer",fontFamily:"ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",fontSize:11,fontWeight:600,color:"#ffffff",transition:"background 150ms ease"},children:(()=>{let le=Ze.length+e.styleModifications.length+e.spacingTokenChanges.filter(Ae=>!Ae.captured).length;if(Tt!==null)return Bt(yi,{children:[Tt+1,Bt("span",{style:{opacity:.4,display:"flex",gap:4},children:[pe("span",{children:"/"}),pe("span",{children:le})]})]});let ge=ho.length+e.styleModifications.length+e.spacingTokenChanges.filter(Ae=>!Ae.captured).length;return le>ge?Bt(yi,{children:[ge,Bt("span",{style:{opacity:.4,display:"flex",gap:4},children:[pe("span",{children:"/"}),pe("span",{children:le})]})]}):le})()})})})(),(e.annotations.length>0||e.styleModifications.length>0)&&pe("span",{onMouseEnter:()=>Ie("clear"),onMouseLeave:rt,children:pe($o,{siblingActive:e.isAnnotating,onClick:qe,title:"Clear all (\u2318\u232B)",children:pe(Yg,{size:17,strokeWidth:1.5})})}),c&&Bt(yi,{children:[pe("div",{style:{width:1,height:20,backgroundColor:"rgba(0, 0, 0, 0.05)",margin:"0 2px"}}),pe("span",{onMouseEnter:()=>Ie("provider"),onMouseLeave:rt,style:{display:"contents"},children:Bt("div",{style:{display:"flex",alignItems:"center",gap:0},children:[pe($o,{onClick:()=>c(Ut),children:pe(hi,{provider:l})}),Bt("button",{type:"button",onClick:()=>{let B=(u+1)%p;b?.(B)},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:oo.iconDefault,whiteSpace:"nowrap"},children:[pe("span",{children:f}),pe("span",{style:{display:"flex",flexDirection:"column",alignItems:"center",gap:2},children:jn.map(B=>pe("div",{style:{width:B.overflow?2:3,height:B.overflow?2:3,borderRadius:"50%",backgroundColor:B.active?oo.iconDefault:"rgba(0,0,0,0.2)",opacity:B.overflow?.65:1,transition:"background-color 150ms ease, opacity 150ms ease"}},B.key))})]})]})})]}),pe("div",{ref:Po,style:{display:"inline-flex",cursor:"pointer"},children:pe("button",{type:"button",onClick:Me,title:"Collapse (\u2318\u2318)",style:{display:"flex",alignItems:"center",justifyContent:"center",width:32,height:32,border:"none",background:"none",padding:0,cursor:"inherit"},children:pe("svg",{"data-popmelt-logo":!0,width:"30",height:"30",viewBox:"0 0 40 40",fill:qn,stroke:"none",xmlns:"http://www.w3.org/2000/svg",children:pe("path",{d:"M20.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.00293Z"})})})})]})]})]}):Bt(yi,{children:[pe("style",{children:`
|
|
21
21
|
@keyframes popmelt-border-march { to { background-position: 0 -5px; } }
|
|
22
|
-
`}),
|
|
23
|
-
`)[0].trim();return
|
|
22
|
+
`}),Bt("div",{ref:B=>{Yo.current=B,Ge&&(Ge.current=B)},id:"devtools-toolbar",style:{...io,overflow:"visible",opacity:r?1:.5},children:[so,pe("button",{type:"button",style:{display:"flex",alignItems:"center",justifyContent:"center",width:48,height:48,border:"none",background:"none",cursor:"pointer",padding:0},onClick:()=>{te(!0),t({type:"SET_TOOL",payload:"inspector"}),t({type:"SET_ANNOTATING",payload:!0})},onMouseEnter:()=>a?.(!0),onMouseLeave:()=>a?.(!1),title:"Open annotation toolbar (\u2318\u2318)",children:pe("svg",{"data-popmelt-logo":!0,width:"30",height:"30",viewBox:"0 0 40 40",fill:"none",stroke:qn,strokeWidth:"1",strokeLinejoin:"round",xmlns:"http://www.w3.org/2000/svg",children:pe("path",{d:"M20.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.00293Z"})})})]})]})}import{useCallback as od,useEffect as fo,useMemo as nm,useRef as bi,useState as ds}from"react";import{Fragment as sd,jsx as Ot,jsxs as vi}from"react/jsx-runtime";function rd(e){return e.status==="done"||e.status==="error"}var om=20,rm=6,im=om-rm,sm=8,id={display:"flex",alignItems:"center",gap:3,padding:0,backgroundColor:"transparent",border:"none",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,whiteSpace:"nowrap",transition:"transform 200ms ease, opacity 200ms ease"};function am(e){let n=e.find(c=>c.type==="job_started")?.data.kind;if(n==="materialize_model")return"Materializing model";if(n==="synthesize_evals")return"Synthesizing evals";if(n==="run_eval")return"Running eval";let o=e.filter(c=>c.type==="tool_use");if(o.length===0)return"Starting\u2026";let r=o[o.length-1],i=String(r.data.tool||""),a=r.data.file?String(r.data.file):null,s=a?a.split("/").pop()??a:null,l=r.data.content?String(r.data.content):null;switch(i){case"Read":return s?`Reading ${s}`:"Reading file";case"Edit":return s?`Editing ${s}`:"Editing file";case"Write":return s?`Writing ${s}`:"Writing file";case"Bash":{if(!l)return"Running command";let c=l.split(`
|
|
23
|
+
`)[0].trim();return c.length<=40?c:c.slice(0,37)+"\u2026"}case"Glob":return"Searching files";case"Grep":return"Searching code";default:return i?`Using ${i}`:"Working\u2026"}}function lm(e){let t=e.replace(/^Error:\s*/i,"");return t.length>40?t.slice(0,37)+"...":t}function cm(e,t){let o=e.find(s=>s.type==="job_started"&&s.data.jobId===t)?.data.kind;if(o==="materialize_model")return"Model";if(o==="synthesize_evals")return"Evals";if(o==="run_eval")return"Reviewed";if(e.some(s=>s.type==="question"&&s.data.jobId===t))return"Has a question";let i=new Set(["Edit","Write"]);return e.some(s=>s.type==="tool_use"&&s.data.jobId===t&&i.has(String(s.data.tool||"")))?"Applied changes":"Replied"}function dm({color:e}){let[t,n]=ds(0);return fo(()=>{let o=setInterval(()=>{n(r=>(r+1)%2)},250);return()=>clearInterval(o)},[]),Ot("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?vi(sd,{children:[Ot("circle",{cx:"7",cy:"7",r:"2"}),Ot("circle",{cx:"17",cy:"7",r:"2"}),Ot("circle",{cx:"7",cy:"17",r:"2"}),Ot("circle",{cx:"17",cy:"17",r:"2"})]}):vi(sd,{children:[Ot("circle",{cx:"12",cy:"6",r:"2"}),Ot("circle",{cx:"6",cy:"12",r:"2"}),Ot("circle",{cx:"18",cy:"12",r:"2"}),Ot("circle",{cx:"12",cy:"18",r:"2"})]})})}function um({color:e}){return Ot("span",{style:{display:"inline-block",width:8,height:8,backgroundColor:e,opacity:.6}})}function pm({color:e}){return Ot("span",{style:{color:e,fontSize:12,lineHeight:1,width:10,display:"inline-block"},children:"\u2713"})}function fm(){return Ot("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ef4444"}})}function gm({onCancel:e}){let t=bi(null);return fo(()=>{let n=t.current;if(!n)return;let o=a=>{a.stopPropagation(),e()},r=()=>{n.style.opacity="0.5"},i=()=>{n.style.opacity="0.7"};return n.addEventListener("click",o),n.addEventListener("mouseenter",r),n.addEventListener("mouseleave",i),()=>{n.removeEventListener("click",o),n.removeEventListener("mouseenter",r),n.removeEventListener("mouseleave",i)}},[e]),Ot("button",{ref:t,style:{background:"none",border:"none",cursor:"pointer",color:"#ffffff",opacity:.7,fontSize:14,padding:"0 2px",lineHeight:1},title:"Cancel",children:"\xD7"})}function mm({onDismiss:e}){let t=bi(null);return fo(()=>{let n=t.current;if(!n)return;let o=a=>{a.stopPropagation(),e()},r=()=>{n.style.opacity="0.5"},i=()=>{n.style.opacity="0.7"};return n.addEventListener("click",o),n.addEventListener("mouseenter",r),n.addEventListener("mouseleave",i),()=>{n.removeEventListener("click",o),n.removeEventListener("mouseenter",r),n.removeEventListener("mouseleave",i)}},[e]),Ot("button",{ref:t,style:{background:"none",border:"none",cursor:"pointer",color:"#ffffff",opacity:.7,fontSize:14,padding:"0 2px",lineHeight:1},title:"Dismiss",children:"\xD7"})}function ad({bridge:e,inFlightJobs:t,isVisible:n,onHover:o,clearSignal:r,onViewThread:i,onClickJob:a,onCancel:s,onHoverJob:l,isConnected:c,dismissedThreadIds:d,snapPosition:u="bottom-right",currentPathname:p}){let[f,b]=ds([]),[C,w]=ds(!1),[M,L]=ds(()=>typeof window<"u"?{w:window.innerWidth,h:window.innerHeight}:{w:1920,h:1080});fo(()=>{let _=()=>L({w:window.innerWidth,h:window.innerHeight});return window.addEventListener("resize",_),()=>window.removeEventListener("resize",_)},[]);let E=yl(u,M.w,M.h);fo(()=>{r>0&&b([])},[r]),fo(()=>{!d||d.size===0||b(_=>{let oe=_.filter(ye=>!ye.threadId||!d.has(ye.threadId)||!rd(ye));return oe.length===_.length?_:oe})},[d]),fo(()=>{b(_=>{let oe=new Set(_.map(we=>we.jobId)),ye=!1,ze=_.map(we=>{let Be=t[we.jobId];return Be&&(!we.threadId||we.color==="#888"||!we.routePathnames&&Be.routePathnames||we.global==null&&Be.global!=null)?(ye=!0,{...we,threadId:we.threadId||Be.threadId,color:we.color==="#888"?Be.color:we.color,routePathnames:we.routePathnames??Be.routePathnames,global:we.global??Be.global}):we});for(let[we,Be]of Object.entries(t))oe.has(we)||(ze.push({jobId:we,color:Be.color,status:"queued",threadId:Be.threadId,routePathnames:Be.routePathnames,global:Be.global}),ye=!0);let Ye=new Set(Object.keys(t)),re=new Set(e.activeJobIds),Ke=ze.filter(we=>we.status!=="queued"?!0:Ye.has(we.jobId)||re.has(we.jobId));Ke.length!==ze.length&&(ye=!0);let Ge=new Set(Ke.map(we=>we.jobId));for(let we of e.activeJobIds)if(!Ge.has(we)){let Be=e.events.find(ce=>ce.type==="job_started"&&ce.data.jobId===we),ut=Be?.data.kind,G=typeof Be?.data.color=="string"?Be.data.color:ut==="synthesize"||ut==="synthesize_evals"||ut==="run_eval"||ut==="materialize_model"?"#000000":"#888";Ke.push({jobId:we,color:G,status:"working",threadId:Be?.data?.threadId,routePathnames:void 0,global:Be?.data.global===!0||ut==="synthesize"||ut==="synthesize_evals"||ut==="run_eval"||ut==="materialize_model"}),ye=!0}return ye?Ke:_})},[t,e.activeJobIds,e.events]),fo(()=>{if(e.activeJobIds.length===0)return;let _=new Set(e.activeJobIds);b(oe=>oe.map(ye=>_.has(ye.jobId)&&ye.status!=="done"&&ye.status!=="error"?{...ye,status:"working"}:ye))},[e.activeJobIds]);let R=bi(null);fo(()=>{let _=e.lastCompletedJobId;if(!_||_===R.current)return;R.current=_;let oe=e.events.find(Ge=>Ge.type==="error"&&(Ge.data.jobId===_||e.status==="error")),ye=!!oe,ze=ye?void 0:cm(e.events,_),Ye=oe?String(oe.data.message||""):void 0,re=oe?!!oe.data.cancelled:void 0,Ke=oe?.data.threadId;b(Ge=>{let we=Ge.map(ut=>ut.jobId===_?{...ut,status:ye?"error":"done",doneLabel:ze,errorMessage:Ye,cancelled:re,threadId:ut.threadId||Ke}:ut);if(!d||d.size===0)return we;let Be=we.filter(ut=>!ut.threadId||!d.has(ut.threadId)||!rd(ut));return Be.length===we.length?we:Be})},[e.lastCompletedJobId,e.events,e.status,d]);let v=od(_=>_.global||!p||!_.routePathnames||_.routePathnames.length===0?!0:_.routePathnames.includes(p),[p]),D=nm(()=>f.filter(v),[f,v]),j=n&&(D.length>0||c===!1),J=bi(null);fo(()=>{if(!j)return;let _=J.current;if(!_)return;let oe=()=>{w(!0),o(!0)},ye=()=>{w(!1),o(!1),l?.(null)};return _.addEventListener("mouseenter",oe),_.addEventListener("mouseleave",ye),()=>{_.removeEventListener("mouseenter",oe),_.removeEventListener("mouseleave",ye)}},[j,o,l]);let T=bi(new Map),N=od((_,oe)=>{oe?T.current.set(_,oe):T.current.delete(_)},[]);if(fo(()=>{if(!j)return;let _=[];for(let oe of D){let ye=T.current.get(oe.jobId);if(ye){if(a){let ze=oe.jobId,Ye=oe.threadId,re=()=>a(ze,Ye);ye.addEventListener("click",re),_.push(()=>ye.removeEventListener("click",re))}if(l){let ze=oe.jobId,Ye=()=>l(ze),re=()=>l(null);ye.addEventListener("mouseenter",Ye),ye.addEventListener("mouseleave",re),_.push(()=>{ye.removeEventListener("mouseenter",Ye),ye.removeEventListener("mouseleave",re)})}}}return()=>_.forEach(oe=>oe())},[j,D,a,l]),!j)return null;let g={working:3,queued:2,error:1,done:0},m=[],$=new Map;for(let _ of D){if(!_.threadId){m.push(_);continue}let oe=$.get(_.threadId);(!oe||g[_.status]>g[oe.status]||g[_.status]===g[oe.status])&&$.set(_.threadId,_)}for(let _ of $.values())m.push(_);let me=m.filter(_=>_.status==="queued"),ke=new Map;me.forEach((_,oe)=>{ke.set(_.jobId,`(${oe+1}/${me.length})`)});let ue=!C&&m.length>1,Ee=ur(u),Te=pr(u),X=Ee?m:[...m].reverse();return vi("div",{ref:J,style:E,"data-devtools":!0,children:[X.map((_,oe)=>{let ye=oe===m.length-1,ze=m.length-1-oe,Ye=_.status==="working"?am(e.events.filter(re=>re.data.jobId===_.jobId)):_.status==="queued"?`Queued ${ke.get(_.jobId)??""}`:_.status==="done"?_.doneLabel||"Done":_.cancelled?"Cancelled":_.errorMessage?lm(_.errorMessage):"Error";return Ot("div",{style:{position:"relative",zIndex:m.length-oe,marginBottom:ue?ye?0:-im:ye?0:sm,transform:ue?`scale(${Math.max(.94,1-ze*.02)})`:"scale(1)",opacity:1,transformOrigin:`${Ee?"top":"bottom"} ${Te?"right":"left"}`,transition:"margin-bottom 250ms ease, transform 250ms ease, opacity 250ms ease"},children:Ot("div",{ref:re=>N(_.jobId,re),style:{...id,position:"relative",overflow:"visible",cursor:a?"pointer":void 0},title:_.errorMessage||void 0,children:vi("div",{style:{display:"flex",alignItems:"center",gap:3,padding:"3px 5px 3px 8px",margin:0,backgroundColor:_.status==="error"?"#ef4444":_.color,color:"#ffffff"},children:[_.status==="working"&&Ot(dm,{color:"#ffffff"}),_.status==="queued"&&Ot(um,{color:"#ffffff"}),_.status==="done"&&Ot(pm,{color:"#ffffff"}),_.status==="error"&&Ot(fm,{}),Ot("span",{style:{opacity:_.status==="queued"?.6:1,maxWidth:160,overflow:"hidden",textOverflow:"ellipsis"},children:Ye}),_.status==="working"&&s&&Ot(gm,{onCancel:()=>s(_.jobId)}),(_.status==="done"||_.status==="error")&&Ot(mm,{onDismiss:()=>b(re=>re.filter(Ke=>_.threadId?Ke.threadId!==_.threadId:Ke.jobId!==_.jobId))})]})})},_.jobId)}),c===!1&&f.length>0&&Ot("div",{style:id,children:vi("div",{style:{display:"flex",alignItems:"center",gap:3,padding:"3px 5px 3px 8px",margin:0,backgroundColor:"#f59e0b",color:"#ffffff"},children:[Ot("span",{style:{display:"inline-block",width:8,height:8,borderRadius:"50%",backgroundColor:"#ffffff",opacity:.6}}),Ot("span",{children:"Reconnecting\u2026"})]})})]})}import{Fragment as bm,jsx as ym,jsxs as vm}from"react/jsx-runtime";var hm=`
|
|
24
24
|
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
|
25
25
|
:host {
|
|
26
26
|
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
|
|
@@ -49,9 +49,9 @@ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{
|
|
|
49
49
|
color: initial;
|
|
50
50
|
-webkit-font-smoothing: auto;
|
|
51
51
|
}
|
|
52
|
-
`;function
|
|
53
|
-
`),n=[],o=0;for(;o<t.length;){let r=t[o];if(r.trimStart().startsWith("```")){let l=[];for(o++;o<t.length&&!t[o].trimStart().startsWith("```");)l.push(t[o]),o++;o++,n.push(
|
|
54
|
-
`)},n.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(r)){n.push(
|
|
52
|
+
`;function ld({children:e}){return vm(bm,{children:[ym("style",{children:hm}),e]})}import{useEffect as xm,useLayoutEffect as Sm,useRef as wm,useState as cd}from"react";import{createPortal as Cm}from"react-dom";import{Fragment as Im,jsx as Tm,jsxs as Mm}from"react/jsx-runtime";function Em(e){return e.tagName==="STYLE"||e.tagName==="LINK"&&e.rel==="stylesheet"}function km(e){let t=new Map,n=e.firstChild;function o(a){if(t.has(a)||a.hasAttribute("data-pm-mirror"))return;let s=a.cloneNode(!0);s.setAttribute("data-pm-mirror",""),e.insertBefore(s,n),t.set(a,s)}function r(a){let s=t.get(a);s&&(s.remove(),t.delete(a))}for(let a of document.querySelectorAll('link[rel="stylesheet"], style'))a.getRootNode()===document&&o(a);try{document.adoptedStyleSheets.length>0&&(e.adoptedStyleSheets=[...document.adoptedStyleSheets,...e.adoptedStyleSheets])}catch{}let i=new MutationObserver(a=>{for(let s of a)if(s.type==="childList"){for(let l of s.addedNodes)l instanceof Element&&Em(l)&&o(l);for(let l of s.removedNodes)l instanceof Element&&r(l)}});return i.observe(document.head,{childList:!0}),document.body&&i.observe(document.body,{childList:!0}),()=>{i.disconnect();for(let a of t.values())a.remove();t.clear()}}function dd({children:e}){let t=wm(null),[n,o]=cd(null),[r,i]=cd(null);return Sm(()=>{let a=t.current;if(!a||a.shadowRoot)return;let s=a.attachShadow({mode:"open"}),l=document.createElement("div");l.setAttribute("data-popmelt-root",""),s.appendChild(l),o(s),i(l)},[]),xm(()=>{if(n)return km(n)},[n]),Mm(Im,{children:[Tm("div",{ref:t,"data-popmelt-shadow-host":!0,style:{position:"absolute",width:0,height:0,overflow:"visible",zIndex:1e4}}),r&&Cm(e,r)]})}import{memo as _m,useCallback as go,useEffect as ro,useMemo as Tr,useRef as Xn,useState as Mn}from"react";import{jsx as je,jsxs as kr}from"react/jsx-runtime";var Pa="ui-monospace, SFMono-Regular, Menlo, monospace",Rm=0;function Am({size:e=11}){let t=++Rm,n=`pm-vs-m${t}`,o=`pm-vs-f0-${t}`,r=`pm-vs-f1-${t}`,i=`pm-vs-g${t}`;return kr("svg",{width:e,height:e,viewBox:"0 0 100 100",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:{display:"inline",verticalAlign:"middle",marginLeft:3,flexShrink:0},children:[je("mask",{id:n,maskType:"alpha",maskUnits:"userSpaceOnUse",x:"0",y:"0",width:"100",height:"100",children:je("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M70.9119 99.3171C72.4869 99.9307 74.2828 99.8914 75.8725 99.1264L96.4608 89.2197C98.6242 88.1787 100 85.9892 100 83.5872V16.4133C100 14.0113 98.6243 11.8218 96.4609 10.7808L75.8725 0.873756C73.7862 -0.130129 71.3446 0.11576 69.5135 1.44695C69.252 1.63711 69.0028 1.84943 68.769 2.08341L29.3551 38.0415L12.1872 25.0096C10.589 23.7965 8.35363 23.8959 6.86933 25.2461L1.36303 30.2549C-0.452552 31.9064 -0.454633 34.7627 1.35853 36.417L16.2471 50.0001L1.35853 63.5832C-0.454633 65.2374 -0.452552 68.0938 1.36303 69.7453L6.86933 74.7541C8.35363 76.1043 10.589 76.2037 12.1872 74.9905L29.3551 61.9587L68.769 97.9167C69.3925 98.5406 70.1246 99.0104 70.9119 99.3171ZM75.0152 27.2989L45.1091 50.0001L75.0152 72.7012V27.2989Z",fill:"white"})}),kr("g",{mask:`url(#${n})`,children:[je("path",{d:"M96.4614 10.7962L75.8569 0.875542C73.4719 -0.272773 70.6217 0.211611 68.75 2.08333L1.29858 63.5832C-0.515693 65.2373 -0.513607 68.0937 1.30308 69.7452L6.81272 74.754C8.29793 76.1042 10.5347 76.2036 12.1338 74.9905L93.3609 13.3699C96.086 11.3026 100 13.2462 100 16.6667V16.4275C100 14.0265 98.6246 11.8378 96.4614 10.7962Z",fill:"#0065A9"}),je("g",{filter:`url(#${o})`,children:je("path",{d:"M96.4614 89.2038L75.8569 99.1245C73.4719 100.273 70.6217 99.7884 68.75 97.9167L1.29858 36.4169C-0.515693 34.7627 -0.513607 31.9063 1.30308 30.2548L6.81272 25.246C8.29793 23.8958 10.5347 23.7964 12.1338 25.0095L93.3609 86.6301C96.086 88.6974 100 86.7538 100 83.3334V83.5726C100 85.9735 98.6246 88.1622 96.4614 89.2038Z",fill:"#007ACC"})}),je("g",{filter:`url(#${r})`,children:je("path",{d:"M75.8578 99.1263C73.4721 100.274 70.6219 99.7885 68.75 97.9166C71.0564 100.223 75 98.5895 75 95.3278V4.67213C75 1.41039 71.0564 -0.223106 68.75 2.08329C70.6219 0.211402 73.4721 -0.273666 75.8578 0.873633L96.4587 10.7807C98.6234 11.8217 100 14.0112 100 16.4132V83.5871C100 85.9891 98.6234 88.1786 96.4586 89.2196L75.8578 99.1263Z",fill:"#1F9CF0"})}),je("g",{style:{mixBlendMode:"overlay"},opacity:"0.25",children:je("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M70.8511 99.3171C72.4261 99.9306 74.2221 99.8913 75.8117 99.1264L96.4 89.2197C98.5634 88.1787 99.9392 85.9892 99.9392 83.5871V16.4133C99.9392 14.0112 98.5635 11.8217 96.4001 10.7807L75.8117 0.873695C73.7255 -0.13019 71.2838 0.115699 69.4527 1.44688C69.1912 1.63705 68.942 1.84937 68.7082 2.08335L29.2943 38.0414L12.1264 25.0096C10.5283 23.7964 8.29285 23.8959 6.80855 25.246L1.30225 30.2548C-0.513334 31.9064 -0.515415 34.7627 1.29775 36.4169L16.1863 50L1.29775 63.5832C-0.515415 65.2374 -0.513334 68.0937 1.30225 69.7452L6.80855 74.754C8.29285 76.1042 10.5283 76.2036 12.1264 74.9905L29.2943 61.9586L68.7082 97.9167C69.3317 98.5405 70.0638 99.0104 70.8511 99.3171ZM74.9544 27.2989L45.0483 50L74.9544 72.7012V27.2989Z",fill:`url(#${i})`})})]}),kr("defs",{children:[kr("filter",{id:o,x:"-8.39411",y:"15.8291",width:"116.727",height:"92.2456",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB",children:[je("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),je("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"}),je("feOffset",{}),je("feGaussianBlur",{stdDeviation:"4.16667"}),je("feColorMatrix",{type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"}),je("feBlend",{mode:"overlay",in2:"BackgroundImageFix",result:"effect1_dropShadow"}),je("feBlend",{mode:"normal",in:"SourceGraphic",in2:"effect1_dropShadow",result:"shape"})]}),kr("filter",{id:r,x:"60.4167",y:"-8.07558",width:"47.9167",height:"116.151",filterUnits:"userSpaceOnUse",colorInterpolationFilters:"sRGB",children:[je("feFlood",{floodOpacity:"0",result:"BackgroundImageFix"}),je("feColorMatrix",{in:"SourceAlpha",type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"}),je("feOffset",{}),je("feGaussianBlur",{stdDeviation:"4.16667"}),je("feColorMatrix",{type:"matrix",values:"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"}),je("feBlend",{mode:"overlay",in2:"BackgroundImageFix",result:"effect1_dropShadow"}),je("feBlend",{mode:"normal",in:"SourceGraphic",in2:"effect1_dropShadow",result:"shape"})]}),kr("linearGradient",{id:i,x1:"49.9392",y1:"0.257812",x2:"49.9392",y2:"99.7423",gradientUnits:"userSpaceOnUse",children:[je("stop",{stopColor:"white"}),je("stop",{offset:"1",stopColor:"white",stopOpacity:"0"})]})]})]})}var Lm=/^#[0-9a-fA-F]{3,8}$/,Pm=/^(?:rgba?|hsla?|oklch)\([^)]+\)$/,Bm=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 Dm(e){let t=e.trim();return Lm.test(t)||Pm.test(t)||Bm.has(t.toLowerCase())}function La(e,t){return je("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 xi(e){let t=[],n=/(`[^`]+`)|(\*\*\*(.+?)\*\*\*)|(\*\*(.+?)\*\*)|(\*(.+?)\*)|(_([^_]+?)_)|(\[([^\]]+)\]\(([^)]+)\))|(#[0-9a-fA-F]{3,8})(?![0-9a-fA-F])|((?:rgba?|hsla?|oklch)\([^)]+\))/g,o=0,r;for(;(r=n.exec(e))!==null;){if(r.index>o&&t.push(e.slice(o,r.index)),r[1]){let i=r[1].slice(1,-1);Dm(i)&&t.push(La(i,`sw-${r.index}`)),t.push(je("code",{style:{fontFamily:Pa,fontSize:"0.9em",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2},children:i},r.index))}else if(r[3]!==void 0)t.push(je("strong",{children:je("em",{children:r[3]})},r.index));else if(r[5]!==void 0)t.push(je("strong",{children:r[5]},r.index));else if(r[7]!==void 0)t.push(je("em",{children:r[7]},r.index));else if(r[9]!==void 0)t.push(je("em",{children:r[9]},r.index));else if(r[11]!==void 0&&r[12]!==void 0){let i=r[12],a=!/^https?:\/\/|^mailto:/i.test(i),s=a?`vscode://file/${i}`:i;a?t.push(kr("a",{href:s,target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline",whiteSpace:"nowrap",backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px",borderRadius:2,fontFamily:Pa,fontSize:"0.9em"},children:[r[11],je(Am,{})]},r.index)):t.push(je("a",{href:s,target:"_blank",rel:"noopener noreferrer",style:{color:"inherit",textDecoration:"underline"},children:r[11]},r.index))}else r[13]!==void 0?(t.push(La(r[13],`sw-${r.index}`)),t.push(r[13])):r[14]!==void 0&&(t.push(La(r[14],`sw-${r.index}`)),t.push(r[14]));o=r.index+r[0].length}return o<e.length&&t.push(e.slice(o)),t}function ko(e){let t=e.split(`
|
|
53
|
+
`),n=[],o=0;for(;o<t.length;){let r=t[o];if(r.trimStart().startsWith("```")){let l=[];for(o++;o<t.length&&!t[o].trimStart().startsWith("```");)l.push(t[o]),o++;o++,n.push(je("pre",{style:{fontFamily:Pa,fontSize:"0.9em",lineHeight:1.4,backgroundColor:"rgba(0,0,0,0.04)",padding:"6px 8px",margin:"4px 0",overflowX:"auto",whiteSpace:"pre"},children:l.join(`
|
|
54
|
+
`)},n.length));continue}if(/^(-{3,}|\*{3,}|_{3,})\s*$/.test(r)){n.push(je("hr",{style:{border:"none",borderTop:"1px solid rgba(0,0,0,0.1)",margin:"6px 0"}},n.length)),o++;continue}let i=r.match(/^(#{1,4})\s+(.+)/);if(i){let l=i[1].length,c={1:16,2:14,3:13,4:12};n.push(je("div",{style:{fontWeight:700,fontSize:c[l]??12,margin:"8px 0 2px"},children:xi(i[2])},n.length)),o++;continue}if(r.trimStart().startsWith("|")&&r.trimEnd().endsWith("|")){let l=[];for(;o<t.length&&t[o].trimStart().startsWith("|")&&t[o].trimEnd().endsWith("|");)l.push(t[o]),o++;let c=w=>/^\|[\s\-:|]+\|$/.test(w),d=l.filter(w=>!c(w)),u=w=>w.split("|").slice(1,-1).map(M=>M.trim()),p=w=>/^\*\*.+\*\*$/.test(w)||/^__.+__$/.test(w),f=d.map(u),b=f.length>1&&f.slice(1).every(w=>w[0]&&p(w[0])),C=f.length>0&&f[0].every(w=>p(w));n.push(je("div",{style:{overflowX:"auto",margin:"4px 0",paddingBottom:4},children:je("table",{style:{borderCollapse:"separate",borderSpacing:0,fontSize:"0.95em",width:"max-content",minWidth:"100%"},children:je("tbody",{children:d.map((w,M)=>je("tr",{children:u(w).map((L,E)=>je(M===0?"th":"td",{style:{border:"1px solid rgba(0,0,0,0.1)",padding:"3px 6px",textAlign:"left",fontWeight:M===0?600:400,minWidth:60,whiteSpace:"nowrap",...E===0&&b||M===0&&C?{position:"sticky",...E===0&&b?{left:0}:{},...M===0&&C?{top:0}:{},background:"#fff",zIndex:E===0&&b&&M===0&&C?2:1}:{}},children:xi(L)},E))},M))})})},n.length));continue}if(r.match(/^(\s*)([-*])\s+(.+)/)){let l=[];for(;o<t.length;){let c=t[o].match(/^\s*[-*]\s+(.+)/);if(c)l.push(c[1]),o++;else if(l.length>0&&t[o].match(/^\s+\S/)&&!t[o].match(/^\s*\d+\.\s/)&&!t[o].match(/^\s*[-*]\s+/))l[l.length-1]+=" "+t[o].trim(),o++;else break}n.push(je("ul",{style:{margin:0,paddingLeft:20,listStyleType:"disc",display:"flex",flexDirection:"column",gap:8},children:l.map((c,d)=>je("li",{children:xi(c)},d))},n.length));continue}let s=r.match(/^(\s*)(\d+)\.\s+(.+)/);if(s){let l=s[1].length,c=parseInt(s[2],10)||1,d=[],u=null;for(;o<t.length;){let p=t[o],f=p.match(/^(\s*)(\d+)\.\s+(.+)/);if(f&&f[1].length===l)u=[f[3]],d.push(u),o++;else if(u&&p.trim()==="")o++;else if(d.length>0&&t[o].match(/^\s+\S/)&&!t[o].match(/^\s*\d+\.\s/)&&!t[o].match(/^\s*[-*]\s+/))u.push(t[o].trim()),o++;else if(u&&/^(Eval|Checks|Sources|Rationale|Prompt|Assertions?|Reason|Why|Expected|Notes?):/i.test(p.trim()))u.push(p.trim()),o++;else if(u&&u.length>1&&p.trim()&&!p.match(/^(#{1,4})\s+/)&&!p.trimStart().startsWith("|")&&!p.match(/^\s*[-*]\s+/)&&!p.match(/^\s*\d+\.\s+/)&&!/^(\*\*)?[A-Z][A-Za-z /&-]{2,40}(\*\*)?$/.test(p.trim()))u.push(p.trim()),o++;else break}n.push(je("ol",{start:c,style:{margin:0,paddingLeft:20,listStyleType:"decimal",display:"flex",flexDirection:"column",gap:8},children:d.map((p,f)=>je("li",{children:je("div",{style:{display:"flex",flexDirection:"column",gap:6},children:p.map((b,C)=>je("div",{children:xi(b)},C))})},f))},n.length));continue}if(r.trim()===""){o++;continue}n.push(je("div",{children:xi(r)},n.length)),o++}return je("div",{style:{display:"flex",flexDirection:"column",gap:8},children:n})}import{Fragment as Io,jsx as U,jsxs as De}from"react/jsx-runtime";var md=400,_n=16,hd=3,Om=3,yd=4,Hm=8,Nm="devtools-thread-panel-position",Zr=md+2*hd+2*yd,zm=Zr+2*Om;function Ba(e="right"){return{top:_n,left:e==="left"?_n:window.innerWidth-Zr-_n}}function ud(e,t,n){let o=n?.getBoundingClientRect(),r=2*hd+2*yd,i=window.innerHeight-_n-r;return o&&t+zm>o.left&&(i=o.top-Hm-r),Math.max(200,i-Math.max(0,e))}var Fm={width:md,backgroundColor:"#eaeaea",borderWidth:3,borderStyle:"solid",borderColor:"transparent",boxSizing:"content-box",display:"flex",flexDirection:"column",overflow:"visible",padding:4,fontFamily:rn,fontSize:12,color:"#1f2937",pointerEvents:"auto"},$m={display:"flex",alignItems:"center",justifyContent:"space-between",padding:"4px 5px 4px 10px",margin:0,fontWeight:600,fontSize:12,overflow:"hidden"},Wm={flex:1,overflowY:"auto",padding:0,scrollbarWidth:"none"},jm=`
|
|
55
55
|
[data-devtools="thread-panel-messages"]:hover {
|
|
56
56
|
scrollbar-width: thin !important;
|
|
57
57
|
}
|
|
@@ -65,15 +65,15 @@ Your AI gets the visual and technical context it needs to act.`,usage:[],keys:[{
|
|
|
65
65
|
background: rgba(0,0,0,0.15);
|
|
66
66
|
border-radius: 3px;
|
|
67
67
|
}
|
|
68
|
-
`,
|
|
68
|
+
`,Gm={borderTop:"1px solid rgba(0, 0, 0, 0.12)",display:"flex",alignItems:"center",gap:4,padding:"0 8px 0 10px"};function ps(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,"").replace(/<novel>[\s\S]*?<\/novel>/g,"").replace(/<eval_proposals>[\s\S]*?<\/eval_proposals>/g,"").replace(/<eval_run_result>[\s\S]*?<\/eval_run_result>/g,"").replace(/<evals>[\s\S]*?<\/evals>/g,"").trim()}function Jm(e){return e.split(`
|
|
69
69
|
`).filter(t=>!/^\s*[☑☒□]\s*(pass|fail|needs[_ ]review)\b/i.test(t)).join(`
|
|
70
70
|
`).replace(/\n{3,}/g,`
|
|
71
71
|
|
|
72
|
-
`).trim()}function
|
|
73
|
-
`)[0].trim();return t.length<=60?t:t.slice(0,57)+"\u2026"}var
|
|
74
|
-
`)?
|
|
75
|
-
`)?
|
|
76
|
-
`)?Co(l):l}),!a&&u&&t.segments.map((p,b)=>{if(p.kind==="tool_group")return U(dd,{tool:p.tool,items:p.items},b);let S=s?_m(cs(p.text)):cs(p.text);return S?U("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:Co(S)},b):null}),!a&&!u&&l&&U("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:Co(l)}),!a&&s&&U(zm,{result:s}),a&&t.replyToQuestion&&(()=>{let p=Gm(t,o);return p.length===0?null:U("div",{style:{display:"flex",gap:4,flexWrap:"wrap",marginTop:6},children:p.map((b,S)=>U("img",{src:b.url,title:b.label,style:ls,onClick:()=>i(b.url)},S))})})(),a&&!t.replyToQuestion&&(()=>{let p=Jm(t,o);return p.length===0?null:U("div",{style:{display:"flex",gap:4,flexWrap:"wrap",marginTop:6},children:p.map((b,S)=>U("img",{src:b.url,title:b.label,style:ls,onClick:()=>i(b.url)},S))})})(),d&&U("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:Co(d)}),(f||c)&&Je("div",{style:{padding:"8px 16px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#374151"},children:[f&&U("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:t.toolsUsed.map((p,b)=>U("div",{children:p},b))}),c&&t.resolutions.map((p,b)=>{let S=p.finalScope??p.inferredScope;return Je("div",{style:{marginTop:f?4:0},children:[U("span",{style:{color:p.status==="resolved"?"#10b981":"#f59e0b"},children:p.status==="resolved"?"Done":"Needs review"}),p.summary?` \u2014 ${p.summary}`:""]},b)})]}),!a&&t.responseText&&(()=>{let p=Om(t.responseText);return p.length===0?null:U("div",{style:{padding:"8px 16px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#374151",marginTop:2},children:p.map((b,S)=>Je("div",{style:{marginTop:S>0?6:0},children:[U("span",{style:{display:"inline-block",backgroundColor:"#8b5cf6",color:"#fff",fontSize:9,fontWeight:600,textTransform:"uppercase",padding:"1px 5px",borderRadius:3,marginRight:6,verticalAlign:"middle"},children:b.category}),U("strong",{children:b.element})," \u2014 ",b.decision,U("div",{style:{color:"#9ca3af",fontStyle:"italic",marginTop:1},children:b.reason})]},S))})})()]},`${t.jobId}-${n}`)});function ih({proposal:e,busy:t,onApply:n,onDismiss:o,onProjectEvals:r,onOpenEvals:i}){let a=(e.generatedEvalIds?.length??0)>0;return U("div",{style:{padding:"0 16px 12px"},children:Je("div",{style:{border:"1px solid rgba(0,0,0,0.12)",background:"rgba(255,255,255,0.28)",padding:10,display:"flex",flexDirection:"column",gap:8},children:[Je("div",{style:{display:"flex",alignItems:"baseline",gap:6},children:[U("span",{style:{fontWeight:700,fontSize:12,color:"#111827"},children:"Model suggestion"}),U("span",{style:{color:"#9ca3af",fontSize:10,textTransform:"uppercase"},children:e.status})]}),U("div",{style:{fontWeight:650,fontSize:12,color:"#1f2937",lineHeight:1.35},children:e.title}),U("div",{style:{color:"#6b7280",fontSize:11,lineHeight:1.45},children:e.summary}),Je("div",{style:{color:"#9ca3af",fontSize:10,lineHeight:1.2},children:[e.decisionIds.length," source decision",e.decisionIds.length===1?"":"s",a?`, ${e.generatedEvalIds.length} eval draft${e.generatedEvalIds.length===1?"":"s"}`:""]}),e.status==="pending"&&Je("div",{style:{display:"grid",gridTemplateColumns:"1fr 1fr",gap:8},children:[U("button",{type:"button",disabled:t,onClick:o,style:sh,children:"Dismiss"}),U("button",{type:"button",disabled:t,onClick:n,style:Aa,children:"Apply"})]}),e.status==="applied"&&!a&&U("button",{type:"button",disabled:t,onClick:r,style:Aa,children:"Create draft evals"}),e.status==="applied"&&a&&i&&U("button",{type:"button",disabled:t,onClick:i,style:Aa,children:"Review eval drafts"})]})})}var Aa={border:"1px solid #111827",background:"#111827",color:"#fff",cursor:"pointer",fontFamily:dn,fontSize:11,fontWeight:700,padding:"6px 8px"},sh={border:"1px solid rgba(0,0,0,0.12)",background:"rgba(0,0,0,0.02)",color:"#6b7280",cursor:"pointer",fontFamily:dn,fontSize:11,fontWeight:700,padding:"6px 8px"};function ud({threadId:e,bridgeUrl:t,accentColor:n,isStreaming:o,isQueued:r,queuePosition:i,streamingEvents:a,onClose:s,onReply:l,onCancel:d,lastError:c,onMouseEnter:u,toolbarRef:f,currentModel:p,currentProvider:b,annotationNumber:S,annotationText:C,onOpenEvals:P,preferredSide:H="right",modal:I=!0}){let[M,w]=Fn([]),[$,Z]=Fn(null),[q,k]=Fn(!1),[O,g]=Fn(!0),[m,j]=Fn(""),[ue,Re]=Fn([]),de=Un(!1),we=Un(null),[Ee,V]=Fn(!0),[B,re]=Fn(0),[ge,_e]=Fn(null),Ue=Er(oe=>_e(oe),[]),te=Un(null),ot=Un(null),Ke=Un(0),xe=Er((oe,Ce)=>{let Be=oe&&Ce.trim();te.current&&(te.current.style.opacity=Be?"0.65":"1"),we.current&&(we.current.style.borderTop=`1px solid ${Be?n:"rgba(0,0,0,0.12)"}`)},[n]),Le=Un(null),ut=Un(null),W=Un(o),ee=Un(Ma(H)),ie=Un({x:0,y:0}),Ne=Un(!1),pt=Un({x:0,y:0,offsetX:0,offsetY:0}),Te=Un(H==="right"),[,rt]=Fn(0),st=`${Mm}:${H}`;Eo(()=>{try{let oe=localStorage.getItem(st);if(oe){let Ce=JSON.parse(oe);if(typeof Ce.top=="number"&&typeof Ce.left=="number"){let Be=window.innerWidth-Xr-Ln,Ge={top:Math.max(Ln,Math.min(Ce.top,window.innerHeight-Ln-200)),left:Math.max(Ln,Math.min(Ce.left,Be))};Te.current=Ge.left>=Be-2,ee.current=Ge,rt(Pt=>Pt+1)}}}catch{}},[st]),Eo(()=>{let oe=()=>{if(Te.current)ee.current=Ma(H);else{let Ce=ee.current,Be=window.innerWidth-Xr-Ln;ee.current={top:Math.max(Ln,Math.min(Ce.top,window.innerHeight-Ln-200)),left:Math.max(Ln,Math.min(Ce.left,Be))}}rt(Ce=>Ce+1)};return window.addEventListener("resize",oe,{passive:!0}),()=>window.removeEventListener("resize",oe)},[H]),Eo(()=>{let oe=ut.current;if(!oe)return;let Ce=$e=>{$e.button!==0||$e.target.closest("button")||($e.preventDefault(),$e.stopPropagation(),Ne.current=!0,pt.current={x:$e.clientX,y:$e.clientY,offsetX:ie.current.x,offsetY:ie.current.y})},Be=$e=>{if(!Ne.current)return;let lt=pt.current,qe=lt.offsetX+($e.clientX-lt.x),Ot=lt.offsetY+($e.clientY-lt.y),_n=Math.max(Ln,Math.min(window.innerWidth-Xr-Ln,ee.current.left+qe)),Yt=Math.max(Ln,ee.current.top+Ot);ie.current={x:_n-ee.current.left,y:Yt-ee.current.top};let xn=Le.current;xn&&(xn.style.top=`${Yt}px`,xn.style.left=`${_n}px`,xn.style.height=`${id(Yt,_n,f?.current)}px`)},Ge=()=>{if(!Ne.current)return;let $e=ee.current.top+ie.current.y,lt=ee.current.left+ie.current.x;ee.current={top:$e,left:lt},ie.current={x:0,y:0};let qe=window.innerWidth-Xr-Ln;Te.current=lt>=qe-2;try{localStorage.setItem(st,JSON.stringify({top:$e,left:lt}))}catch{}Ne.current=!1},Pt=()=>{ee.current=Ma(H),ie.current={x:0,y:0},Te.current=H==="right";try{localStorage.removeItem(st)}catch{}rt($e=>$e+1)};return oe.addEventListener("mousedown",Ce),window.addEventListener("mousemove",Be),window.addEventListener("mouseup",Ge),oe.addEventListener("dblclick",Pt),()=>{oe.removeEventListener("mousedown",Ce),window.removeEventListener("mousemove",Be),window.removeEventListener("mouseup",Ge),oe.removeEventListener("dblclick",Pt)}},[st,H]);let Ye=Er(async()=>{try{let oe=await mo(`${t}/thread/${e}`);if(!oe.ok)throw new Error(`Thread fetch failed: ${oe.status}`);let Ce=await oe.json(),Be=Ce.messages??[];return w(Be),Z(Ce.modelProposal??null),g(!1),Be.length}catch{return g(!1),null}},[t,e]),It=Er(async oe=>{if(!(!$||q)){k(!0);try{let Ce=await mo(`${t}/model/proposals/${encodeURIComponent($.id)}/${oe}`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({provider:b,model:p})});if(Ce.ok){let Be=await Ce.json();Be.proposal&&Z(Be.proposal),await Ye()}}finally{k(!1)}}},[t,p,b,Ye,$,q]);Eo(()=>{let oe=!1;Ke.current=0,g(!0),ot.current&&(clearTimeout(ot.current),ot.current=null);let Ce=async()=>{let Be=await Ye();oe||Be!==0||Ke.current>=5||(Ke.current+=1,ot.current=setTimeout(Ce,200*Ke.current))};return Ce(),()=>{oe=!0,ot.current&&(clearTimeout(ot.current),ot.current=null)}},[Ye]),Eo(()=>{W.current&&!o&&Ye(),W.current=o},[o]);let Xt=rd(()=>a?Zm(a):[],[a]),Jt=rd(()=>a?qm(a):null,[a]);Eo(()=>{let oe=te.current;if(!oe)return;let Ce=()=>{V(oe.scrollHeight-oe.scrollTop-oe.clientHeight<40);let Ge=oe.scrollTop+oe.clientHeight,Pt=oe.querySelectorAll("[data-msg]"),$e=0;for(let lt=0;lt<Pt.length;lt++){let qe=Pt[lt];qe.offsetTop+qe.offsetHeight>Ge+20&&$e++}re($e)};return oe.addEventListener("scroll",Ce,{passive:!0}),()=>oe.removeEventListener("scroll",Ce)},[]),Eo(()=>{Ee&&te.current&&(te.current.scrollTop=te.current.scrollHeight)},[M,Xt.length,o,Ee]),Eo(()=>{let oe=Ce=>{Ce.key==="Escape"&&(Ce.stopPropagation(),s())};return document.addEventListener("keydown",oe),()=>document.removeEventListener("keydown",oe)},[s]);let Xe=Er(()=>{if(!m.trim()||!l)return;let oe=m.trim(),Ce=ue.length>0?ue:void 0,Be=Ce?Ce.map(Ge=>URL.createObjectURL(Ge)):void 0;w(Ge=>[...Ge,{role:"human",timestamp:Date.now(),jobId:"pending",replyToQuestion:oe,...Be?{replyImageUrls:Be}:{}}]),l(e,oe,Ce),j(""),Re([])},[m,ue,e,l]),je=Er(oe=>{let Ce=oe.clipboardData.items,Be=[];for(let Ge=0;Ge<Ce.length;Ge++){let Pt=Ce[Ge];if(Pt.type.startsWith("image/")){let $e=Pt.getAsFile();$e&&Be.push($e)}}Be.length>0&&(oe.preventDefault(),Re(Ge=>[...Ge,...Be]))},[]),an=Er(oe=>{oe.key==="Enter"&&(oe.metaKey||oe.ctrlKey)&&(oe.preventDefault(),Xe())},[Xe]),nt=ee.current.top+ie.current.y,Mt=ee.current.left+ie.current.x,$n=id(nt,Mt,f?.current);return Je(Qo,{children:[I&&U("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:oe=>{oe.target===oe.currentTarget&&s()},style:{position:"fixed",inset:0,zIndex:9999}}),Je("div",{ref:Le,style:{...Am,height:$n,position:"fixed",top:nt,left:Mt,zIndex:1e4},"data-devtools":"thread-panel",onMouseEnter:u,children:[(()=>{let Ce=`<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='${o?n:"rgb(0,0,0)"}' stroke-width='.75'/></svg>`,Be=`url("data:image/svg+xml,${encodeURIComponent(Ce)}")`;return Je(Qo,{children:[U("style",{children:`@keyframes popmelt-border-march { to { background-position: 0 -5px; } }
|
|
77
|
-
[data-popmelt-reply]::placeholder { opacity: 0.35; }`}),U("div",{style:{position:"absolute",inset:-3,padding:5,backgroundImage:
|
|
72
|
+
`).trim()}function Vm(e){let t=e.match(/<novel>\s*([\s\S]*?)\s*<\/novel>/);if(!t?.[1])return[];try{let n=JSON.parse(t[1]);return Array.isArray(n)?n.filter(o=>{if(typeof o!="object"||o===null)return!1;let r=o;return typeof r.category=="string"&&typeof r.element=="string"&&typeof r.decision=="string"&&typeof r.reason=="string"}):[]}catch{return[]}}function Ym(e){let t=e.match(/<eval_run_result>\s*([\s\S]*?)\s*<\/eval_run_result>/);if(!t?.[1])return null;try{let n=JSON.parse(t[1]);if(!n||typeof n!="object")return null;let o=n,r=o.status,i=r==="pass"||r==="fail"||r==="needs_review"?r:"needs_review",s=(Array.isArray(o.assertionResults)?o.assertionResults:[]).flatMap(l=>{if(!l||typeof l!="object")return[];let c=l,d=typeof c.assertion=="string"?c.assertion.trim():"";if(!d)return[];let u=c.status;return[{assertion:d,status:u==="pass"||u==="fail"||u==="needs_review"?u:"needs_review",summary:typeof c.summary=="string"?c.summary.trim():""}]});return{title:typeof o.title=="string"?o.title.trim():void 0,status:i,summary:typeof o.summary=="string"?o.summary.trim():"",assertionResults:s}}catch{return null}}function Um(e){return e?{title:e.title,status:e.status,summary:e.summary,assertionResults:e.assertionResults.map(t=>({assertion:t.assertion,status:t.status,summary:t.summary}))}:null}function Km({result:e}){let t=e.assertionResults;if(t.length===0)return null;let n=e.status==="pass"?"Pass":e.status==="fail"?"Fail":"Needs review",o=e.status==="pass"?"#047857":e.status==="fail"?"#b91c1c":"#6b7280";return De("div",{style:{padding:"8px 16px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.35,color:"#374151"},children:[De("div",{style:{display:"flex",alignItems:"baseline",gap:6,marginBottom:7},children:[U("span",{style:{fontWeight:700,color:"#111827"},children:e.title??"Eval result"}),U("span",{style:{color:o,fontWeight:700,marginLeft:"auto"},children:n})]}),e.summary&&U("div",{style:{color:"#6b7280",marginBottom:8},children:e.summary}),U("div",{style:{display:"flex",flexDirection:"column",gap:6},children:t.map((r,i)=>{let a=r.status==="pass"?"\u2611":r.status==="fail"?"\u2612":"\u25A1",s=r.status==="pass"?"Pass":r.status==="fail"?"Fail":"Needs review",l=r.status==="pass"?"#047857":r.status==="fail"?"#b91c1c":"#6b7280",c=r.status==="needs_review"?"inherit":l;return De("div",{style:{display:"grid",gridTemplateColumns:"18px minmax(0, 1fr)",columnGap:5,alignItems:"start"},children:[U("span",{style:{color:l,fontSize:15,lineHeight:1},children:a}),De("div",{style:{minWidth:0},children:[U("div",{style:{color:c},children:r.assertion}),r.status==="needs_review"?De("div",{style:{marginTop:1,color:"#6b7280"},children:[U("span",{style:{color:l,fontWeight:700},children:s}),r.summary?De("span",{children:[": ",r.summary]}):null]}):r.summary?U("div",{style:{marginTop:1,color:"#6b7280"},children:r.summary}):null]})]},`${r.assertion}-${i}`)})})]})}function pd(e){return new Date(e).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})}var Da=["reviewing","considering","thinking","zhuzhing","iterating","tweaking","reflecting","noodling","pondering","finessing","polishing","riffing"],Xm=3e3,qm=250;function Zm({color:e}){let[t,n]=Mn(0),[o,r]=Mn(()=>Math.floor(Math.random()*Da.length));return ro(()=>{let i=setInterval(()=>n(s=>(s+1)%2),qm),a=setInterval(()=>r(s=>(s+1)%Da.length),Xm);return()=>{clearInterval(i),clearInterval(a)}},[]),De("span",{style:{display:"inline-flex",alignItems:"center",gap:4},children:[U("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:e,style:{verticalAlign:"middle",flexShrink:0},children:t===1?De(Io,{children:[U("circle",{cx:"7",cy:"7",r:"2"}),U("circle",{cx:"17",cy:"7",r:"2"}),U("circle",{cx:"7",cy:"17",r:"2"}),U("circle",{cx:"17",cy:"17",r:"2"})]}):De(Io,{children:[U("circle",{cx:"12",cy:"6",r:"2"}),U("circle",{cx:"6",cy:"12",r:"2"}),U("circle",{cx:"18",cy:"12",r:"2"}),U("circle",{cx:"12",cy:"18",r:"2"})]})}),U("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:Da[o]})]})}var fs=32,us={width:fs,height:fs,objectFit:"cover",cursor:"pointer",border:"1px solid rgba(0,0,0,0.1)"};function Qm(e){let t=/^`(\/[^`]*)`$/gm,n=[...e.matchAll(t)];if(n.length===0)return null;let o=[];for(let r=0;r<n.length;r++){let i=n[r],a=i[1],s=i.index+i[0].length,l=r+1<n.length?n[r+1].index:e.length,c=e.slice(s,l).trim();o.push({route:a,text:c})}return o}function eh(e,t){let n=[];if(e.replyImageUrls)for(let o of e.replyImageUrls){let r=o.startsWith("blob:")||o.startsWith("http")?o:`${t}${o}`;n.push({url:r,label:"pasted image"})}return n}function th(e,t){let n=[];if(e.imageUrls)for(let[,o]of Object.entries(e.imageUrls))for(let r of o)n.push({url:`${t}${r}`,label:"pasted image"});return n}function nh({src:e,onClose:t}){return ro(()=>{let n=o=>{o.key==="Escape"&&(o.stopPropagation(),t())};return document.addEventListener("keydown",n),()=>document.removeEventListener("keydown",n)},[t]),U("div",{onClick:t,style:{position:"fixed",inset:0,zIndex:1e5,backgroundColor:"rgba(0,0,0,0.8)",display:"flex",alignItems:"center",justifyContent:"center",cursor:"zoom-out"},children:U("img",{src:e,onClick:n=>n.stopPropagation(),style:{maxWidth:"90vw",maxHeight:"90vh",objectFit:"contain",cursor:"default",boxShadow:"0 4px 24px rgba(0,0,0,0.4)"}})})}function oh(e){let t=String(e.data.tool||""),n=e.data.file?String(e.data.file):null,o=n?n.split("/").pop()??n:null,r=e.data.content?String(e.data.content):null;switch(t){case"Read":return o?`Reading ${o}`:"Reading file";case"Edit":return o?`Editing ${o}`:"Editing file";case"Write":return o?`Writing ${o}`:"Writing file";case"Bash":return r?rh(r):"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}}function rh(e){let t=e.split(`
|
|
73
|
+
`)[0].trim();return t.length<=60?t:t.slice(0,57)+"\u2026"}var ih=new Set(["Read","Glob","Grep","WebFetch","WebSearch"]),sh=new Set(["Edit","Write","Bash"]);function ah(e){let t=0,n=!1;for(let o of e){if(o.type!=="tool_use")continue;let r=String(o.data.tool||"");sh.has(r)?n=!0:ih.has(r)&&t++}return!n&&t>=3?"researching":n?"applying changes":null}function lh(e){let t=[];for(let n of e)if(n.type==="tool_use"){let o=oh(n),r=String(n.data.tool||""),i=n.data.file?String(n.data.file):null,a=n.data.content?String(n.data.content):null,s=i??a??void 0;if(o){let l=t[t.length-1];l&&l.kind==="tool_group"&&l.tool===r?l.items.push({label:o,detail:s}):t.push({kind:"tool_group",tool:r,items:[{label:o,detail:s}]})}if(a&&i){let l=i.includes(".")?`.${i.split(".").pop().toLowerCase()}`:"",c=i.includes(".claude/plans/");t.push({kind:"file_content",file:i,content:a,ext:l,isPlan:c})}}else if(n.type==="delta"){let o=String(n.data.text||"");if(!o)continue;let r=t[t.length-1];r&&r.kind==="text"?r.text+=o:t.push({kind:"text",text:o})}else if(n.type==="thinking"){let o=String(n.data.text||"");if(!o)continue;let r=t[t.length-1];r&&r.kind==="thinking"?r.text+=o:t.push({kind:"thinking",text:o})}return t}function ch({file:e,content:t,ext:n,isPlan:o,onAccept:r}){let[i,a]=Mn(o),s=e.split("/").pop()??e;return De("div",{style:{margin:"4px 0 4px 12px",border:"1px solid rgba(0,0,0,0.08)",backgroundColor:"rgba(255,255,255,0.6)",fontSize:11},children:[De("div",{onClick:()=>a(c=>!c),style:{display:"flex",alignItems:"center",gap:6,padding:"4px 8px",cursor:"pointer",userSelect:"none",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",color:"#374151"},children:[U("span",{style:{fontSize:9,color:"#9ca3af"},children:i?"\u25BC":"\u25B6"}),U("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:s}),o&&U("span",{style:{fontSize:9,color:"#6366f1",fontFamily:"inherit"},children:"plan"})]}),i&&De(Io,{children:[U("div",{style:{maxHeight:300,overflowY:"auto",padding:"6px 10px",borderTop:"1px solid rgba(0,0,0,0.06)",lineHeight:1.5,wordBreak:"break-word"},children:n===".md"?ko(t):U("pre",{style:{margin:0,fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:11,whiteSpace:"pre-wrap"},children:t})}),o&&r&&U("div",{style:{padding:"4px 8px",borderTop:"1px solid rgba(0,0,0,0.06)",display:"flex",justifyContent:"flex-end"},children:U("button",{onClick:c=>{c.stopPropagation(),r()},style:{background:"#111",color:"#fff",border:"none",padding:"4px 12px",fontSize:11,cursor:"pointer",fontFamily:"inherit"},children:"Accept"})})]})]})}function dh(e){let t=[];for(let n of e){let o=t[t.length-1];o&&o.val===n?o.count++:t.push({val:n,count:1})}return t.map(n=>n.count>1?`${n.val} (x${n.count})`:n.val)}function uh(e,t){switch(e){case"Bash":{let n=t.map(o=>(o.label||"").split(/\s/)[0]).filter(Boolean);return`Used Bash: ${dh(n).join(", ")}`}case"Read":return`Read: ${t.map(n=>n.label.replace(/^Reading /,"")).join(", ")}`;case"Edit":return`Edited: ${t.map(n=>n.label.replace(/^Editing /,"")).join(", ")}`;case"Write":return`Wrote: ${t.map(n=>n.label.replace(/^Writing /,"")).join(", ")}`;case"Grep":return t.length===1?"Searched code":`Searched code (${t.length})`;case"Glob":return t.length===1?"Searched files":`Searched files (${t.length})`;default:return`Used ${e}: ${t.map(n=>n.label).join(", ")}`}}var ph={fontSize:11,color:"#9ca3af",fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",lineHeight:1.6};function fh({label:e}){let t=e.indexOf(" ");return t===-1?U(Io,{children:e}):De(Io,{children:[U("b",{children:e.slice(0,t)}),e.slice(t)]})}function bd({tool:e,items:t}){let[n,o]=Mn(!1),r=t.length>1;return De("div",{style:ph,children:[De("div",{onClick:r?()=>o(i=>!i):void 0,style:{cursor:r?"pointer":"default",userSelect:"none",color:"#9ca3af"},children:[r&&U("span",{style:{fontSize:13,marginRight:4},children:n?"\u25BE":"\u25B8"}),uh(e,t)]}),n&&U("div",{style:{marginLeft:17},children:t.map((i,a)=>U("div",{children:U(fh,{label:i.detail??i.label})},a))})]})}var fd=_m(function({msg:t,index:n,bridgeUrl:o,accentColor:r,onLightbox:i,hideSender:a=!1,hideTimestamp:s=!1,compactSpacing:l=!1}){let c=t.role==="human";if(t.cancelled||t.error)return De("div",{"data-msg":!0,style:{padding:16,display:"flex",flexDirection:"column",gap:8},children:[De("div",{style:{display:"flex",alignItems:"center",gap:4},children:[U("span",{style:{fontSize:11,color:t.error?"#dc2626":"#9ca3af",fontStyle:"italic"},children:t.error?"Error":"Cancelled"}),U("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:pd(t.timestamp)})]}),t.error&&U("div",{style:{fontSize:12,color:"#6b7280",lineHeight:1.4},children:t.error})]},`${t.jobId}-${n}`);let d=c?null:Um(t.evalRun)??(t.responseText?Ym(t.responseText):null),u=c?t.replyToQuestion||t.feedbackSummary||"(annotation)":d?"":ps(t.responseText||""),p=c?void 0:t.question,f=!c&&t.resolutions&&t.resolutions.length>0,b=!c&&t.segments&&t.segments.length>0,C=!c&&!b&&t.toolsUsed&&t.toolsUsed.length>0,w=!a||!s;return!u&&!p&&!f&&!b&&!d?null:De("div",{"data-msg":!0,style:{padding:l?"8px 16px":16,display:"flex",flexDirection:"column",gap:8},children:[w&&De("div",{style:{display:"flex",alignItems:"center",gap:4},children:[!a&&!c&&U(hi,{provider:t.provider,size:11,style:{color:"#6b7280"}}),!a&&U("span",{style:{fontWeight:600,fontSize:11,color:c?r:"#6b7280"},children:c?"You":ka(t.model,t.provider)}),!s&&U("span",{style:{fontSize:10,color:"#9ca3af",marginLeft:"auto"},children:pd(t.timestamp)})]}),c&&!t.replyToQuestion&&(()=>{let M=u?Qm(u):null;if(M&&t.screenshotUrls)return U("div",{style:{display:"flex",flexDirection:"column",gap:4},children:M.map((E,R)=>{let v=t.screenshotUrls?.[E.route],D=v?`${o}${v}`:null;return De("div",{style:{display:"flex",gap:6,alignItems:"flex-start"},children:[D?U("img",{src:D,title:E.route,style:{...us,flexShrink:0,marginTop:1},onClick:()=>i(D)}):U("div",{style:{width:fs,height:fs,flexShrink:0}}),De("div",{style:{lineHeight:1.5,wordBreak:"break-word",minWidth:0},children:[U("code",{style:{fontSize:10,backgroundColor:"rgba(0,0,0,0.06)",padding:"1px 4px"},children:E.route}),E.text&&U("div",{style:{marginTop:2},children:ko(E.text)})]})]},R)})});let L=t.screenshotUrl?`${o}${t.screenshotUrl}`:null;return L&&u?De("div",{style:{display:"flex",gap:6,alignItems:"flex-start"},children:[U("img",{src:L,title:"screenshot",style:{...us,flexShrink:0,marginTop:1},onClick:()=>i(L)}),U("div",{style:{lineHeight:1.5,wordBreak:"break-word",minWidth:0},children:u.includes(`
|
|
74
|
+
`)?ko(u):u})]}):u?U("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:u.includes(`
|
|
75
|
+
`)?ko(u):u}):null})(),c&&t.replyToQuestion&&u&&U("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:u.includes(`
|
|
76
|
+
`)?ko(u):u}),!c&&b&&t.segments.map((M,L)=>{if(M.kind==="tool_group")return U(bd,{tool:M.tool,items:M.items},L);let E=d?Jm(ps(M.text)):ps(M.text);return E?U("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:ko(E)},L):null}),!c&&!b&&u&&U("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:ko(u)}),!c&&d&&U(Km,{result:d}),c&&t.replyToQuestion&&(()=>{let M=eh(t,o);return M.length===0?null:U("div",{style:{display:"flex",gap:4,flexWrap:"wrap",marginTop:6},children:M.map((L,E)=>U("img",{src:L.url,title:L.label,style:us,onClick:()=>i(L.url)},E))})})(),c&&!t.replyToQuestion&&(()=>{let M=th(t,o);return M.length===0?null:U("div",{style:{display:"flex",gap:4,flexWrap:"wrap",marginTop:6},children:M.map((L,E)=>U("img",{src:L.url,title:L.label,style:us,onClick:()=>i(L.url)},E))})})(),p&&U("div",{style:{lineHeight:1.5,wordBreak:"break-word"},children:ko(p)}),(C||f)&&De("div",{style:{padding:"8px 16px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#374151"},children:[C&&U("div",{style:{fontFamily:"ui-monospace, SFMono-Regular, Menlo, monospace",fontSize:10},children:t.toolsUsed.map((M,L)=>U("div",{children:M},L))}),f&&t.resolutions.map((M,L)=>{let E=M.finalScope??M.inferredScope;return De("div",{style:{marginTop:C?4:0},children:[U("span",{style:{color:M.status==="resolved"?"#10b981":"#f59e0b"},children:M.status==="resolved"?"Done":"Needs review"}),M.summary?` \u2014 ${M.summary}`:""]},L)})]}),!c&&t.responseText&&(()=>{let M=Vm(t.responseText);return M.length===0?null:U("div",{style:{padding:"8px 16px",backgroundColor:"rgba(0, 0, 0, 0.03)",fontSize:11,lineHeight:1.5,color:"#374151",marginTop:2},children:M.map((L,E)=>De("div",{style:{marginTop:E>0?6:0},children:[U("span",{style:{display:"inline-block",backgroundColor:"#8b5cf6",color:"#fff",fontSize:9,fontWeight:600,textTransform:"uppercase",padding:"1px 5px",borderRadius:3,marginRight:6,verticalAlign:"middle"},children:L.category}),U("strong",{children:L.element})," \u2014 ",L.decision,U("div",{style:{color:"#9ca3af",fontStyle:"italic",marginTop:1},children:L.reason})]},E))})})()]},`${t.jobId}-${n}`)});function gd(e,t){return!t||e.role!=="human"||t.role!=="human"||!e.replyToQuestion||!t.replyToQuestion?!1:e.jobId===t.jobId||e.timestamp-t.timestamp<6e4}function To(e){return!!(e&&typeof e=="object"&&!Array.isArray(e))}function gs(e){if(e===void 0)return"undefined";try{return JSON.stringify(e)}catch{return String(e)}}function ms(e,t){return gs(e)===gs(t)}function Si(e){if(typeof e=="string")return e;if(typeof e=="number"||typeof e=="boolean")return String(e);if(Array.isArray(e))return`${e.length} item${e.length===1?"":"s"}`;if(To(e)){let t=Object.keys(e);return typeof e.value=="string"||typeof e.value=="number"?String(e.value):`{ ${t.slice(0,4).join(", ")}${t.length>4?", ...":""} }`}return String(e)}function vd(e,t,n,o){if(!To(e)){ms(e,t)||o.push({id:`token:${n.join(".")}`,group:"tokens",label:n.join("."),detail:Si(e),path:n,value:e,currentValue:t});return}if("value"in e){ms(e,t)||o.push({id:`token:${n.join(".")}`,group:"tokens",label:n.join("."),detail:Si(e),path:n,value:e,currentValue:t});return}for(let r of Object.keys(e))vd(e[r],To(t)?t[r]:void 0,[...n,r],o)}function gh(e,t){let n=t.proposedModel;if(!n)return[];let o=[],r=Array.isArray(e?.rules)?e.rules:[],i=Array.isArray(n.rules)?n.rules:[];for(let l=0;l<i.length;l++){let c=i[l];if(!To(c))continue;let d=typeof c.id=="string"?c.id:`rule-${l}`,u=r.find(p=>To(p)&&(typeof p.id=="string"&&p.id===d||gs(p)===gs(c)));ms(u,c)||o.push({id:`rule:${d}`,group:"rules",label:typeof c.scope=="string"?c.scope:"rule",detail:typeof c.text=="string"?c.text:Si(c),path:["rules"],value:c,currentValue:u,ruleValue:c})}let a=To(n.components)?n.components:{},s=To(e?.components)?e.components:{};for(let l of Object.keys(a)){let c=a[l],d=s[l];ms(c,d)||o.push({id:`component:${l}`,group:"components",label:l,detail:Si(c),path:["components",l],value:c,currentValue:d})}return To(n.tokens)&&vd(n.tokens,e?.tokens,["tokens"],o),o}function mh(e,t,n){let o=t.filter(a=>n.has(a.id)),r=o.filter(a=>a.group==="rules"&&a.ruleValue),i=o.filter(a=>a.group!=="rules").map(a=>({path:a.path,value:a.value}));if(r.length>0){let a=Array.isArray(e?.rules)?[...e.rules]:[];for(let s of r){let l=s.ruleValue,c=To(l)&&typeof l.id=="string"?l.id:null,d=c?a.findIndex(u=>To(u)&&u.id===c):-1;d>=0?a[d]=l:a.push(l)}i.push({path:["rules"],value:a})}return i}function hh({proposal:e,bridgeUrl:t,busy:n,onApplySelected:o,onDismiss:r,onProjectEvals:i,onOpenEvals:a}){let s=(e.generatedEvalIds?.length??0)>0,[l,c]=Mn(!1),[d,u]=Mn(null),[p,f]=Mn(()=>new Set),b=Tr(()=>gh(d,e),[d,e]),C=Tr(()=>mh(d,b,p),[b,d,p]),w=Tr(()=>{let D={rules:[],components:[],tokens:[],model:[]};for(let j of b)D[j.group].push(j);return D},[b]);ro(()=>{let D=!1;return Qn(`${t}/model`).then(j=>j.ok?j.json():null).then(j=>{D||u(j?.model&&typeof j.model=="object"?j.model:null)}).catch(()=>{D||u(null)}),()=>{D=!0}},[t,e.id]),ro(()=>{f(new Set)},[e.id,b.map(D=>D.id).join("|")]);let M=go(D=>{f(j=>{let J=new Set(j);return J.has(D)?J.delete(D):J.add(D),J})},[]),L=go(()=>{f(new Set(b.map(D=>D.id)))},[b]),E=go(()=>{f(new Set)},[]),R=`${e.decisionIds.length} decision${e.decisionIds.length===1?"":"s"}`,v=`${b.length} proposed change${b.length===1?"":"s"}`;return U("div",{style:{padding:"0 16px 12px"},children:De("div",{style:{border:"1px solid rgba(0,0,0,0.12)",background:"rgba(255,255,255,0.28)",padding:10,display:"flex",flexDirection:"column",gap:8},children:[De("button",{type:"button",onClick:()=>c(D=>!D),style:{border:0,background:"transparent",color:"#111827",cursor:"pointer",fontFamily:rn,padding:0,textAlign:"left",display:"flex",alignItems:"baseline",gap:6},children:[U("span",{style:{fontSize:12},children:l?"\u25BE":"\u25B8"}),U("span",{style:{fontWeight:700,fontSize:12},children:"Model suggestion"}),U("span",{style:{color:"#9ca3af",fontSize:10,textTransform:"uppercase"},children:e.status})]}),De("div",{style:{color:"#6b7280",fontSize:11,lineHeight:1.35},children:[R,e.status==="pending"?`, ${v}`:"",s?`, ${e.generatedEvalIds.length} eval draft${e.generatedEvalIds.length===1?"":"s"}`:""]}),l&&e.status==="pending"&&U(Io,{children:b.length>0?De(Io,{children:[De("div",{style:{display:"flex",gap:8},children:[U("button",{type:"button",disabled:n,onClick:L,style:{...Oa,padding:"4px 7px"},children:"Select all"}),U("button",{type:"button",disabled:n,onClick:E,style:{...Oa,padding:"4px 7px"},children:"Clear"})]}),["rules","components","tokens"].map(D=>{let j=w[D];return j.length===0?null:De("div",{style:{display:"flex",flexDirection:"column",gap:5},children:[De("div",{style:{color:"#9ca3af",fontSize:10,textTransform:"uppercase"},children:[D," ",j.length]}),j.map(J=>{let T=p.has(J.id);return De("label",{style:{display:"grid",gridTemplateColumns:"14px minmax(0, 1fr)",columnGap:7,alignItems:"start",cursor:"pointer",color:T?"#111827":"#6b7280",fontSize:11,lineHeight:1.35},children:[U("input",{type:"checkbox",checked:T,disabled:n,onChange:()=>M(J.id),style:{margin:"1px 0 0",width:11,height:11}}),De("span",{style:{minWidth:0},children:[U("span",{style:{fontWeight:700},children:J.label}),De("span",{children:[" \u2014 ",J.detail]}),J.currentValue!==void 0&&De("span",{style:{display:"block",color:"#9ca3af",marginTop:2},children:["was ",Si(J.currentValue)]})]})]},J.id)})]},D)})]}):U("div",{style:{color:"#9ca3af",fontSize:11,lineHeight:1.4},children:"No concrete model diff could be derived from this proposal."})}),e.status==="pending"&&De("div",{style:{display:"grid",gridTemplateColumns:"1fr 1fr",gap:8},children:[U("button",{type:"button",disabled:n,onClick:r,style:Oa,children:"Dismiss"}),De("button",{type:"button",disabled:n||C.length===0,onClick:()=>o(C),style:{..._a,opacity:n||C.length===0?.45:1,cursor:n||C.length===0?"not-allowed":"pointer"},children:["Apply selected ",C.length||""]})]}),e.status==="applied"&&!s&&U("button",{type:"button",disabled:n,onClick:i,style:_a,children:"Create draft evals"}),e.status==="applied"&&s&&a&&U("button",{type:"button",disabled:n,onClick:a,style:_a,children:"Review eval drafts"})]})})}var _a={border:"1px solid #111827",background:"#111827",color:"#fff",cursor:"pointer",fontFamily:rn,fontSize:11,fontWeight:700,padding:"6px 8px"},Oa={border:"1px solid rgba(0,0,0,0.12)",background:"rgba(0,0,0,0.02)",color:"#6b7280",cursor:"pointer",fontFamily:rn,fontSize:11,fontWeight:700,padding:"6px 8px"};function xd({threadId:e,bridgeUrl:t,accentColor:n,isStreaming:o,isQueued:r,queuePosition:i,activeJobId:a,streamingEvents:s,onClose:l,onReply:c,onCancel:d,lastError:u,onMouseEnter:p,toolbarRef:f,currentModel:b,currentProvider:C,annotationNumber:w,annotationText:M,onOpenEvals:L,preferredSide:E="right",modal:R=!0}){let[v,D]=Mn([]),[j,J]=Mn(null),[T,N]=Mn(!1),[g,m]=Mn(!0),[$,me]=Mn(""),[ke,ue]=Mn([]),Ee=Xn(!1),Te=Xn(null),[X,_]=Mn(!0),[oe,ye]=Mn(0),[ze,Ye]=Mn(null),re=go(q=>Ye(q),[]),Ke=Xn(null),Ge=Xn(null),we=Xn(0),Be=go((q,se)=>{let fe=q&&se.trim();Ke.current&&(Ke.current.style.opacity=fe?"0.65":"1"),Te.current&&(Te.current.style.borderTop=`1px solid ${fe?n:"rgba(0,0,0,0.12)"}`)},[n]),ut=Xn(null),G=Xn(null),ce=Xn(o),te=Xn(Ba(E)),Oe=Xn({x:0,y:0}),st=Xn(!1),Pe=Xn({x:0,y:0,offsetX:0,offsetY:0}),nt=Xn(E==="right"),[,lt]=Mn(0),Je=`${Nm}:${E}`;ro(()=>{try{let q=localStorage.getItem(Je);if(q){let se=JSON.parse(q);if(typeof se.top=="number"&&typeof se.left=="number"){let fe=window.innerWidth-Zr-_n,Ie={top:Math.max(_n,Math.min(se.top,window.innerHeight-_n-200)),left:Math.max(_n,Math.min(se.left,fe))};nt.current=Ie.left>=fe-2,te.current=Ie,lt(rt=>rt+1)}}}catch{}},[Je]),ro(()=>{let q=()=>{if(nt.current)te.current=Ba(E);else{let se=te.current,fe=window.innerWidth-Zr-_n;te.current={top:Math.max(_n,Math.min(se.top,window.innerHeight-_n-200)),left:Math.max(_n,Math.min(se.left,fe))}}lt(se=>se+1)};return window.addEventListener("resize",q,{passive:!0}),()=>window.removeEventListener("resize",q)},[E]),ro(()=>{let q=G.current;if(!q)return;let se=ct=>{ct.button!==0||ct.target.closest("button")||(ct.preventDefault(),ct.stopPropagation(),st.current=!0,Pe.current={x:ct.clientX,y:ct.clientY,offsetX:Oe.current.x,offsetY:Oe.current.y})},fe=ct=>{if(!st.current)return;let gt=Pe.current,Ut=gt.offsetX+(ct.clientX-gt.x),jn=gt.offsetY+(ct.clientY-gt.y),hn=Math.max(_n,Math.min(window.innerWidth-Zr-_n,te.current.left+Ut)),An=Math.max(_n,te.current.top+jn);Oe.current={x:hn-te.current.left,y:An-te.current.top};let He=ut.current;He&&(He.style.top=`${An}px`,He.style.left=`${hn}px`,He.style.height=`${ud(An,hn,f?.current)}px`)},Ie=()=>{if(!st.current)return;let ct=te.current.top+Oe.current.y,gt=te.current.left+Oe.current.x;te.current={top:ct,left:gt},Oe.current={x:0,y:0};let Ut=window.innerWidth-Zr-_n;nt.current=gt>=Ut-2;try{localStorage.setItem(Je,JSON.stringify({top:ct,left:gt}))}catch{}st.current=!1},rt=()=>{te.current=Ba(E),Oe.current={x:0,y:0},nt.current=E==="right";try{localStorage.removeItem(Je)}catch{}lt(ct=>ct+1)};return q.addEventListener("mousedown",se),window.addEventListener("mousemove",fe),window.addEventListener("mouseup",Ie),q.addEventListener("dblclick",rt),()=>{q.removeEventListener("mousedown",se),window.removeEventListener("mousemove",fe),window.removeEventListener("mouseup",Ie),q.removeEventListener("dblclick",rt)}},[Je,E]);let yt=go(async()=>{try{let q=await Qn(`${t}/thread/${e}`);if(!q.ok)throw new Error(`Thread fetch failed: ${q.status}`);let se=await q.json(),fe=se.messages??[];return D(fe),J(se.modelProposal??null),m(!1),fe.length}catch{return m(!1),null}},[t,e]),Xt=go(async q=>{if(!(!j||T)){N(!0);try{let se=await Qn(`${t}/model/proposals/${encodeURIComponent(j.id)}/${q}`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({provider:C,model:b})});if(se.ok){let fe=await se.json();fe.proposal&&J(fe.proposal),await yt()}}finally{N(!1)}}},[t,b,C,yt,j,T]),Ht=go(async q=>{if(!(!j||T||q.length===0)){N(!0);try{let se=await Qn(`${t}/model/proposals/${encodeURIComponent(j.id)}/apply-selected`,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({changes:q,provider:C,model:b})});if(se.ok){let fe=await se.json();fe.proposal&&J(fe.proposal),await yt()}}finally{N(!1)}}},[t,b,C,yt,j,T]);ro(()=>{let q=!1;we.current=0,m(!0),Ge.current&&(clearTimeout(Ge.current),Ge.current=null);let se=async()=>{let fe=await yt();q||fe!==0||we.current>=5||(we.current+=1,Ge.current=setTimeout(se,200*we.current))};return se(),()=>{q=!0,Ge.current&&(clearTimeout(Ge.current),Ge.current=null)}},[yt]),ro(()=>{ce.current&&!o&&yt(),ce.current=o},[o]);let tt=Tr(()=>s?lh(s):[],[s]),Ve=Tr(()=>s?ah(s):null,[s]),Yt=Tr(()=>v.filter(q=>q.role==="human"&&q.replyToQuestion&&q.queued&&q.jobId!==a),[a,v]),Xe=Tr(()=>v.filter(q=>!(q.role==="human"&&q.replyToQuestion&&q.queued&&q.jobId!==a)),[a,v]);ro(()=>{let q=Ke.current;if(!q)return;let se=()=>{_(q.scrollHeight-q.scrollTop-q.clientHeight<40);let Ie=q.scrollTop+q.clientHeight,rt=q.querySelectorAll("[data-msg]"),ct=0;for(let gt=0;gt<rt.length;gt++){let Ut=rt[gt];Ut.offsetTop+Ut.offsetHeight>Ie+20&&ct++}ye(ct)};return q.addEventListener("scroll",se,{passive:!0}),()=>q.removeEventListener("scroll",se)},[]),ro(()=>{X&&Ke.current&&(Ke.current.scrollTop=Ke.current.scrollHeight)},[v,tt.length,o,X]),ro(()=>{let q=se=>{se.key==="Escape"&&(se.stopPropagation(),l())};return document.addEventListener("keydown",q),()=>document.removeEventListener("keydown",q)},[l]);let Et=go(()=>{if(!$.trim()||!c)return;let q=$.trim(),se=ke.length>0?ke:void 0,fe=`_pending_reply_${Date.now()}`,Ie=!!o,rt=se?se.map(ct=>URL.createObjectURL(ct)):void 0;D(ct=>[...ct,{role:"human",timestamp:Date.now(),jobId:fe,replyToQuestion:q,...Ie?{queued:!0}:{},...rt?{replyImageUrls:rt}:{}}]),Promise.resolve(c(e,q,se)).then(ct=>{ct?.jobId&&D(gt=>gt.map(Ut=>Ut.jobId===fe?{...Ut,jobId:ct.jobId}:Ut))}).catch(()=>{}),me(""),ue([])},[o,$,ke,e,c]),Wn=go(q=>{let se=q.clipboardData.items,fe=[];for(let Ie=0;Ie<se.length;Ie++){let rt=se[Ie];if(rt.type.startsWith("image/")){let ct=rt.getAsFile();ct&&fe.push(ct)}}fe.length>0&&(q.preventDefault(),ue(Ie=>[...Ie,...fe]))},[]),Sn=go(q=>{q.key==="Enter"&&(q.metaKey||q.ctrlKey)&&(q.preventDefault(),Et())},[Et]),Rn=te.current.top+Oe.current.y,ln=te.current.left+Oe.current.x,Nt=ud(Rn,ln,f?.current);return De(Io,{children:[R&&U("div",{"data-devtools":"thread-panel-backdrop",onMouseDown:q=>{q.target===q.currentTarget&&l()},style:{position:"fixed",inset:0,zIndex:9999}}),De("div",{ref:ut,style:{...Fm,height:Nt,position:"fixed",top:Rn,left:ln,zIndex:1e4},"data-devtools":"thread-panel",onMouseEnter:p,children:[(()=>{let se=`<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='${o?n:"rgb(0,0,0)"}' stroke-width='.75'/></svg>`,fe=`url("data:image/svg+xml,${encodeURIComponent(se)}")`;return De(Io,{children:[U("style",{children:`@keyframes popmelt-border-march { to { background-position: 0 -5px; } }
|
|
77
|
+
[data-popmelt-reply]::placeholder { opacity: 0.35; }`}),U("div",{style:{position:"absolute",inset:-3,padding:5,backgroundImage:fe,backgroundSize:"5px 5px",WebkitMask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",WebkitMaskComposite:"xor",mask:"linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) border-box",maskComposite:"exclude",pointerEvents:"none",...o&&{animation:"popmelt-border-march 0.8s linear infinite"}}})]})})(),De("div",{style:{display:"flex",flexDirection:"column",overflow:"hidden",flex:1,minHeight:0},children:[De("div",{ref:G,style:{...$m,backgroundColor:n,color:"#ffffff",cursor:"grab",userSelect:"none",WebkitUserSelect:"none"},children:[De("span",{style:{display:"flex",alignItems:"center",gap:3,minWidth:0},children:[U("span",{style:{flexShrink:0},children:w?`${w}.`:"Conversation"}),M&&U("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0},children:M})]}),U("button",{onClick:l,style:{background:"none",border:"none",cursor:"pointer",fontSize:16,color:"#ffffff",padding:"0 4px",lineHeight:1},children:"\xD7"})]}),U("style",{dangerouslySetInnerHTML:{__html:jm+`
|
|
78
78
|
[data-devtools="thread-panel"] ::selection { background: color-mix(in srgb, ${n} 15%, transparent); }
|
|
79
|
-
`}}),Je("div",{ref:te,style:{...Pm,transition:"opacity 150ms ease"},"data-devtools":"thread-panel-messages",children:[O&&U("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!O&&M.length===0&&!o&&U("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),M.map((oe,Ce)=>U(rh,{msg:oe,index:Ce,bridgeUrl:t,accentColor:n,onLightbox:Ue},`${oe.jobId}-${Ce}`)),!O&&$&&U(ih,{proposal:$,busy:q,onApply:()=>It("apply"),onDismiss:()=>It("dismiss"),onProjectEvals:()=>It("project-evals"),onOpenEvals:P}),!o&&P&&M.some(oe=>oe.role==="assistant"&&(oe.responseText?.includes("<eval_proposals>")||oe.responseText?.includes("<evals>")))&&U("div",{style:{padding:"0 16px 12px"},children:U("button",{type:"button",onClick:P,style:{width:"100%",border:"1px solid rgba(0,0,0,0.12)",background:"rgba(0,0,0,0.02)",color:"#6b7280",cursor:"pointer",fontFamily:dn,fontSize:11,fontWeight:650,padding:"5px 8px"},children:"Review proposals"})}),o&&U("div",{style:{padding:16,display:"flex",flexDirection:"column",gap:8},children:r?Je("div",{style:{display:"flex",alignItems:"center",gap:6},children:[Je("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:n,style:{verticalAlign:"middle",flexShrink:0,opacity:.5},children:[U("circle",{cx:"12",cy:"6",r:"2"}),U("circle",{cx:"6",cy:"12",r:"2"}),U("circle",{cx:"18",cy:"12",r:"2"}),U("circle",{cx:"12",cy:"18",r:"2"})]}),Je("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:["queued",i?` ${i}`:""]})]}):Je(Qo,{children:[Je("div",{style:{display:"flex",alignItems:"center",gap:4},children:[U(gi,{provider:b,size:11,style:{color:"#6b7280"}}),U("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:xa(p,b)})]}),Xt.map((oe,Ce)=>{if(oe.kind==="tool_group")return U(dd,{tool:oe.tool,items:oe.items},Ce);if(oe.kind==="file_content")return U(Qm,{file:oe.file,content:oe.content,ext:oe.ext,isPlan:oe.isPlan,onAccept:oe.isPlan&&l?()=>l(e,"Looks good, please proceed with implementation."):void 0},Ce);if(oe.kind==="thinking")return U("div",{style:{paddingLeft:12,fontSize:11,color:"#9ca3af",fontStyle:"italic",lineHeight:1.4,whiteSpace:"pre-wrap",wordBreak:"break-word",maxHeight:80,overflowY:"auto"},children:oe.text},Ce);let Be=cs(oe.text);return Be?U("div",{style:{paddingLeft:12,lineHeight:1.5,wordBreak:"break-word"},children:Co(Be)},Ce):null}),Je("div",{style:{display:"flex",alignItems:"center",gap:6},children:[U(Wm,{color:n}),d&&U("button",{onClick:d,style:{background:"none",border:"1px solid rgba(0,0,0,0.1)",color:"#6b7280",fontSize:10,padding:"2px 8px",cursor:"pointer",fontFamily:"inherit",marginLeft:"auto"},children:"Cancel"})]})]})}),!Ee&&M.length>0&&U("div",{style:{position:"sticky",bottom:5,display:"flex",justifyContent:"flex-end",paddingRight:3,pointerEvents:"none"},children:U("button",{onClick:()=>{te.current&&te.current.scrollTo({top:te.current.scrollHeight,behavior:"smooth"})},style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center",padding:4,fontSize:10,fontFamily:dn,color:"transparent",backgroundColor:"#eaeaea",backgroundImage:`url("data:image/svg+xml,${encodeURIComponent("<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='rgb(0,0,0)' stroke-width='.75'/></svg>")}")`,backgroundSize:"5px 5px",border:"none",borderRadius:0,cursor:"pointer",pointerEvents:"auto",userSelect:"none"},children:Je("span",{style:{position:"relative",backgroundColor:"#eaeaea",padding:"0 6px",color:"#374151",fontFamily:dn,lineHeight:1.4},children:[B," message",B!==1?"s":""," \u2193"]})})})]}),!o&&c&&Je("div",{style:{padding:"8px 16px",backgroundColor:"rgba(239, 68, 68, 0.06)",fontSize:11,color:"#dc2626",lineHeight:1.4},children:[U("span",{style:{fontWeight:600},children:"Error: "}),c]}),l&&Je("div",{style:{flexShrink:0,position:"relative"},children:[ue.length>0&&U("div",{style:{position:"absolute",bottom:"100%",display:"flex",gap:4,padding:"6px 5px 5px",flexWrap:"wrap"},children:ue.map((oe,Ce)=>Je("span",{onClick:()=>Re(Be=>Be.filter((Ge,Pt)=>Pt!==Ce)),onMouseEnter:Be=>{let Ge=Be.currentTarget.querySelector("[data-chip-x]");Ge&&(Ge.style.color="#fff")},onMouseLeave:Be=>{let Ge=Be.currentTarget.querySelector("[data-chip-x]");Ge&&(Ge.style.color="rgba(255,255,255,0.4)")},style:{display:"inline-flex",alignItems:"center",gap:4,fontSize:10,color:"#fff",backgroundColor:n,backdropFilter:"blur(4px)",padding:"2px 6px 2px 6px",cursor:"pointer"},children:["image ",Ce+1,U("span",{"data-chip-x":!0,style:{fontSize:12,lineHeight:1,color:"rgba(255,255,255,0.4)"},children:"\xD7"})]},Ce))}),Je("div",{ref:we,style:{...Dm,borderTop:"1px solid rgba(0,0,0,0.12)"},children:[U("input",{"data-popmelt-reply":!0,autoFocus:!0,value:m,onChange:oe=>{j(oe.target.value),xe(de.current,oe.target.value)},onFocus:()=>{de.current=!0,xe(!0,m)},onBlur:()=>{de.current=!1,xe(!1,m)},onKeyDown:an,onPaste:je,placeholder:"Reply here (cmd + enter to send)",style:{flex:1,minWidth:0,minHeight:44,padding:"0 4px",fontSize:12,fontFamily:dn,backgroundColor:"transparent",color:"#1f2937",border:"none",outline:"none",lineHeight:"40px",boxSizing:"border-box"}}),U("button",{onClick:Xe,disabled:!m.trim(),style:{display:"flex",alignItems:"center",justifyContent:"center",width:28,height:28,padding:0,background:"none",border:"none",cursor:m.trim()?"pointer":"default",color:m.trim()?n:"rgba(0,0,0,0.2)",flexShrink:0},children:Je("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round",children:[U("path",{d:"M3.714 3.048a.498.498 0 0 0-.683.627l2.843 7.627a2 2 0 0 1 0 1.396l-2.842 7.627a.498.498 0 0 0 .682.627l18-8.5a.5.5 0 0 0 0-.904z"}),U("path",{d:"M6 12h16"})]})})]})]})]})]}),ge&&U(Ym,{src:ge,onClose:()=>_e(null)})]})}import{jsx as Zr,jsxs as fd}from"react/jsx-runtime";var ch=[],_a=ah(null),La="devtools-provider",us="devtools-model",Pa="devtools-open-thread-id",Ba="popmelt-synthesize-thread",Da="popmelt-eval-synthesize-thread",qr="#000000";function dh(e){let t=e.getBoundingClientRect();return t.bottom<0||t.top>window.innerHeight||t.right<0||t.left>window.innerWidth}function uh(e){for(let t of e){let n=Tn(t);if(n){dh(n)&&n.scrollIntoView({behavior:"smooth",block:"center",inline:"nearest"});return}}}async function pd(e,t){t?await t(e):(window.history.pushState(window.history.state,"",e),window.dispatchEvent(new PopStateEvent("popstate",{state:window.history.state}))),await new Promise(n=>{requestAnimationFrame(()=>requestAnimationFrame(()=>{setTimeout(n,600)}))})}var ph={0:0,1:1},fh={0:0,1:1,2:1};function gh(e,t,n){if(t==="copilot")return 0;let o=t==="codex"?ss:is;return e==="copilot"?0:e==="claude"&&t==="codex"?ph[n]??Math.min(n,o.length-1):e==="codex"&&t==="claude"?fh[n]??Math.min(n,o.length-1):Math.min(n,o.length-1)}function mh({children:e,enabled:t=process.env.NODE_ENV==="development",bridgeUrl:n=typeof window<"u"?window.__POPMELT_BRIDGE_URL__??"http://localhost:1111":"http://localhost:1111",projectId:o,navigate:r}){let i=typeof window<"u"?o??window.__POPMELT_PROJECT_ID__??null:null,[a,s]=wt(i),[l,d]=wt(!!i),c=a,[u,f]=il(),p=ol(n,t&&!!c,c);At(()=>{i&&(typeof window<"u"&&(window.__POPMELT_PROJECT_ID__=i),s(i),d(!0))},[i]);let b=en(null),S=en(null),C=tl()??n,P=en(new Map),H=en(new Map),I=en(!1),M=Ar(),[w,$]=wt(()=>typeof window>"u"?"claude":localStorage.getItem(La)||"claude"),[Z,q]=wt(()=>{if(typeof window>"u")return 0;let x=localStorage.getItem(us);return x&&parseInt(x,10)||0}),[k,O]=wt([]),[g,m]=wt({}),[j,ue]=wt(0),[Re,de]=wt({}),[we,Ee]=wt(null),[V,B]=wt("idle"),[re,ge]=wt(null);At(()=>{p.isConnected&&Na(C).then(x=>{if(!x)return;let A=Object.entries(x.providers).filter(([,ve])=>ve.available).map(([ve])=>ve);A.length>0&&O(A);let Q={};for(let[ve,Se]of Object.entries(x.providers))Se.models&&Se.models.length>0&&(Q[ve]=Se.models);m(Q);let se={};for(let[ve,Se]of Object.entries(x.providers))Se.mcp&&(se[ve]=Se.mcp);de(se)})},[p.isConnected,p.capabilitiesVersion,j,C]),At(()=>{if(!p.isConnected){Ee(null);return}let x=!1;return go(C).then(A=>{x||Ee(A?.version??null)}),()=>{x=!0}},[p.isConnected,p.capabilitiesVersion,j,C]),At(()=>{if(V==="idle"||V==="restarting")return;let x=window.setTimeout(()=>{B("idle"),ge(null)},V==="ok"?4e3:8e3);return()=>window.clearTimeout(x)},[V]),At(()=>{if(k.length>0&&!k.includes(w)){let x=k[0];$(x),localStorage.setItem(La,x)}},[k,w]);let _e=w==="codex"?[...ss]:w==="copilot"?[...va]:[...is],Ue=g[w]&&g[w].length>0?g[w]:_e,te=Ue[Z]??Ue[0];At(()=>{if(!t||c||l)return;let x=!1;return fetch("/popmelt/status").then(A=>A.ok?A.json():null).then(A=>{if(x)return;let Q=typeof window<"u"&&A?.devOrigin===window.location.origin,se=A?.projectId&&(Q||A.projectIdVerified===!0)?A.projectId:null;se&&typeof window<"u"&&(window.__POPMELT_PROJECT_ID__=se),s(se),d(!0)}).catch(()=>{x||d(!0)}),()=>{x=!0}},[t,c,l]),At(()=>{Z>=Ue.length&&(q(0),localStorage.setItem(us,"0"))},[Z,Ue.length]);let ot=Gt(x=>{let A=w;$(x),localStorage.setItem(La,x);let Q=gh(A,x,Z);q(Q),localStorage.setItem(us,String(Q))},[w,Z]),Ke=Gt(x=>{q(x),localStorage.setItem(us,String(x))},[]),[xe,Le]=wt(new Set),[ut,W]=wt(null),[ee,ie]=wt(null),[Ne,pt]=wt(null),[Te,rt]=wt(null);At(()=>{p.isConnected&&Ir(C).then(x=>{x?.components&&Le(new Set(Object.keys(x.components)))})},[p.isConnected,C]);let st=Gt(async x=>{let A=[];for(let Q of x)try{(await Fa(Q,C)).added&&A.push(Q)}catch(se){console.error("[Popmelt] Failed to add component to model:",Q,se)}A.length>0&&(Le(Q=>{let se=new Set(Q);for(let ve of A)se.add(ve);return se}),W(A[A.length-1]))},[C]),Ye=Gt(x=>{W(x)},[]),It=Gt(()=>{Ir(C).then(x=>{x?.components&&Le(new Set(Object.keys(x.components)))})},[C]),Xt=Gt(async x=>{try{(await $a(x,C)).removed&&Le(Q=>{let se=new Set(Q);return se.delete(x),se})}catch(A){console.error("[Popmelt] Failed to remove component from model:",A)}},[C]),Jt=Gt((x,A)=>{f({type:"MODIFY_SPACING_TOKEN",payload:x}),f({type:"ADD_SPACING_TOKEN_CHANGE",payload:A})},[f]),Xe=Gt((x,A)=>{f({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:x,originalValue:A}})},[f]),[je,an]=wt(null),[nt,Mt]=wt(()=>typeof window>"u"?null:localStorage.getItem(Ba)||null),[$n,oe]=wt(null),[Ce,Be]=wt(()=>typeof window>"u"?null:localStorage.getItem(Da)||null),[Ge,Pt]=wt(0),[$e,lt]=wt({}),[qe,Ot]=wt(new Set);At(()=>{nt?localStorage.setItem(Ba,nt):localStorage.removeItem(Ba)},[nt]),At(()=>{Ce?localStorage.setItem(Da,Ce):localStorage.removeItem(Da)},[Ce]);let[_n,Yt]=wt(0),xn=en([]);At(()=>{let x=xn.current,A=u.spacingTokenMods;xn.current=A;let Q=new Map(x.map(Se=>[Se.tokenPath,Se])),se=new Map(A.map(Se=>[Se.tokenPath,Se])),ve=!1;for(let[Se,Oe]of se){let me=Q.get(Se);if(!(me&&me.currentValue===Oe.currentValue)){ve=!0,Oe.currentValue==="__deleted__"?Wa(Se,C).catch(De=>console.error("[Popmelt] Failed to sync token delete:",De)):ms(Se,Oe.currentValue,C).catch(De=>console.error("[Popmelt] Failed to sync token update:",De));for(let De of Oe.targets){let pn=document.querySelector(De.selector);if(pn)if(Oe.currentValue==="__deleted__")pn.style.removeProperty(De.property);else{let ft=Oe.currentPx;ft>0&&pn.style.setProperty(De.property,`${ft}px`,"important")}}}}for(let[Se,Oe]of Q)if(!se.has(Se)){ve=!0,ms(Se,Oe.originalValue,C).catch(me=>console.error("[Popmelt] Failed to restore token on undo:",me));for(let me of Oe.targets){let De=document.querySelector(me.selector);De&&De.style.removeProperty(me.property)}}ve&&Yt(Se=>Se+1)},[u.spacingTokenMods,C]);let[no,On]=wt(()=>al()),Kn=Gt(x=>{On(x),ll(x)},[]),[We,ht]=wt(()=>typeof window>"u"?null:localStorage.getItem(Pa)||null),J=en(null),[ke,Ze]=wt(new Set),[Ct,ln]=wt(null);At(()=>{We?localStorage.setItem(Pa,We):localStorage.removeItem(Pa)},[We]);let dt="popmelt-in-flight-jobs",[Ie,tn]=wt(()=>{try{let x=localStorage.getItem(dt);return x?JSON.parse(x):{}}catch{return{}}});At(()=>{try{Object.keys(Ie).length>0?localStorage.setItem(dt,JSON.stringify(Ie)):localStorage.removeItem(dt)}catch{}},[Ie]),At(()=>{let x=A=>{if(A.key===dt)try{let Q=A.newValue?JSON.parse(A.newValue):{};tn(Q)}catch{}};return window.addEventListener("storage",x),()=>window.removeEventListener("storage",x)},[]);let qt=en(new Map),Wn=en(new Map),zt=en(new Map);At(()=>{for(let[x,A]of Object.entries(Ie)){A.annotationIds.length>0&&qt.current.set(x,A.annotationIds);let Q=new Set(A.styleSelectors);for(let se of A.annotationIds){let ve=u.annotations.find(Se=>Se.id===se);if(ve&&(ve.linkedSelector&&Q.add(ve.linkedSelector),ve.groupId))for(let Se of u.annotations)Se.groupId===ve.groupId&&Se.linkedSelector&&Q.add(Se.linkedSelector)}Q.size>0&&Wn.current.set(x,Array.from(Q)),A.threadId&&zt.current.set(x,A.threadId)}},[Ie,u.annotations]);let To=en("");At(()=>{if(u.annotations.length===0)return;let x=Object.keys(Ie).sort().join(",");if(x===To.current)return;To.current=x;let A=new Set;for(let se of Object.values(Ie))for(let ve of se.annotationIds)A.add(ve);let Q=u.annotations.filter(se=>A.has(se.id)?!1:!!(se.status==="in_flight"||(se.status==="pending"||!se.status)&&(se.captured||se.threadId))).map(se=>se.id);Q.length>0&&f({type:"SET_ANNOTATION_STATUS",payload:{ids:Q,status:"dismissed"}})},[u.annotations,Ie,f]);let er=po(()=>{let x=new Set;for(let A of Object.values(Ie))for(let Q of A.annotationIds)x.add(Q);return x},[Ie]),ko=po(()=>{let x=new Set(p.activeJobIds),A=new Set;for(let[Q,se]of Object.entries(Ie))if(x.has(Q))for(let ve of se.annotationIds)A.add(ve);return A},[Ie,p.activeJobIds]),zo=po(()=>{let x=new Set(p.activeJobIds),A=Object.entries(Ie).filter(([ve])=>!x.has(ve)),Q=A.length,se=new Map;return A.forEach(([,ve],Se)=>{let Oe=`(${Se+1}/${Q})`;for(let me of ve.annotationIds)se.set(me,Oe)}),se},[Ie,p.activeJobIds]),tr=po(()=>{let x=new Set;for(let A of Object.values(Ie))if(!(!A.global&&A.routePathnames?.length&&!A.routePathnames.includes(M)))for(let Q of A.styleSelectors)x.add(Q);return x},[Ie,M]),hn=po(()=>{let x=new Map;for(let A of Object.values(Ie))if(!(!A.global&&A.routePathnames?.length&&!A.routePathnames.includes(M))){for(let Q of A.styleSelectors)x.set(Q,A.color);for(let Q of A.annotationIds){let se=u.annotations.find(ve=>ve.id===Q);if(se&&(se.linkedSelector&&x.set(se.linkedSelector,A.color),se.groupId))for(let ve of u.annotations)ve.groupId===se.groupId&&ve.linkedSelector&&x.set(ve.linkedSelector,A.color)}}return x},[Ie,u.annotations,M]),Fo=en(u.annotations);Fo.current=u.annotations;let $o=en(u.styleModifications);$o.current=u.styleModifications;let Qe=en(Ie);Qe.current=Ie,At(()=>{let x=null,A=()=>{if(Object.keys(Qe.current).length>0)return;let se=Fo.current,ve=$o.current,Se=[],Oe=[];for(let me of se){if(!me.linkedSelector||!me.linkedSelector.startsWith("[data-pm=")||me.pathname||me.captured||me.status&&me.status!=="pending")continue;let De=document.querySelector(me.linkedSelector);!De&&me.elements?.[0]?.selector&&(De=document.querySelector(me.elements[0].selector)),De||Se.push(me.linkedSelector)}for(let me of ve)me.pathname&&me.pathname!==window.location.pathname||document.querySelector(me.selector)||Oe.push(me.selector);(Se.length>0||Oe.length>0)&&f({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:Se,styleSelectors:Oe}})},Q=new MutationObserver(se=>{se.some(ve=>ve.removedNodes.length>0)&&(x&&clearTimeout(x),x=setTimeout(A,3e3))});return Q.observe(document.body,{childList:!0,subtree:!0}),()=>{Q.disconnect(),x&&clearTimeout(x)}},[f]);let fo=en(typeof window<"u"?window.location.pathname:"/");At(()=>{let x=se=>{if(I.current)return;let ve=window.location.pathname;if(se===ve)return;let Se=Fo.current.filter(me=>me.pathname===se&&(me.status??"pending")==="pending");if(console.log(`[Popmelt] Navigation from ${se} \u2192 ${ve}, ${Se.length} pending annotations on departing page`),Se.length===0)return;let Oe=b.current;if(!Oe){console.warn("[Popmelt] No canvas ref for capture-on-leave");return}if(Or(document.body,Oe,Se,{dpr:1}).then(me=>si(me)).then(me=>{me?(H.current.set(se,me),console.log(`[Popmelt] Cached screenshot for ${se} (${(me.size/1024).toFixed(0)}KB)`)):console.warn(`[Popmelt] Capture-on-leave produced no blob for ${se}`)}).catch(me=>{console.warn("[Popmelt] Capture-on-leave failed:",me)}),H.current.size>20){let me=[...H.current.entries()];H.current=new Map(me.slice(-10))}},A=se=>{let ve=se.detail?.prevPath;ve&&(x(ve),fo.current=window.location.pathname)},Q=()=>{let se=fo.current;x(se),fo.current=window.location.pathname};return window.addEventListener("popmelt:locationchange",A),window.addEventListener("popstate",Q),()=>{window.removeEventListener("popmelt:locationchange",A),window.removeEventListener("popstate",Q)}},[]),At(()=>{if(p.lastCompletedJobId&&p.lastCompletedJobId in Ie&&tn(x=>{let{[p.lastCompletedJobId]:A,...Q}=x;return Q}),p.lastCompletedJobId&&p.lastCompletedJobId===je&&(Yt(x=>x+1),an(null)),p.lastCompletedJobId&&p.lastCompletedJobId===$n&&(Pt(x=>x+1),oe(null)),p.lastCompletedJobId){let x=Object.entries($e).find(([,A])=>A===p.lastCompletedJobId)?.[0];x&&(lt(A=>{let{[x]:Q,...se}=A;return se}),Pt(A=>A+1))}},[p.lastCompletedJobId,je,$n,$e]);let Et=en(new Set),Sn=en(!1);At(()=>{if(!p.isConnected){Sn.current=!1;return}Sn.current||(Sn.current=!0,go(C).then(async x=>{if(!x)return;let A=x.activeJobs??[],Q=x.recentJobs??[],se=new Set(A.map(Oe=>Oe.id)),ve=JSON.parse(localStorage.getItem(dt)||"{}"),Se=new Set;for(let Oe of Object.values(ve))if(Oe.annotationIds)for(let me of Oe.annotationIds)Se.add(me);tn(Oe=>{let me={...Oe},De=Date.now();for(let ft of Object.keys(me)){if(ft.startsWith("_pending_")){let St=parseInt(ft.replace(/^_pending_(?:reply_)?/,""),10);!isNaN(St)&&De-St>3e4&&delete me[ft];continue}se.has(ft)||delete me[ft]}for(let ft of A)if(!me[ft.id]&&(ft.annotationIds?.length||ft.threadId)){let St=ft.kind,so=Array.from(new Set((ft.annotationIds??[]).map(nr=>u.annotations.find(or=>or.id===nr)?.pathname||M).filter(Boolean)));me[ft.id]={annotationIds:ft.annotationIds??[],styleSelectors:[],color:St==="synthesize_evals"||St==="run_eval"||St==="materialize_model"?qr:ft.color??"#888",threadId:ft.threadId,kind:St,routePathnames:so.length>0?so:void 0,global:St==="synthesize"||St==="synthesize_evals"||St==="run_eval"||St==="materialize_model"}}let pn=new Set;for(let ft of Q)if(ft.annotationIds)for(let St of ft.annotationIds)pn.add(St);for(let ft of Object.keys(me)){if(!ft.startsWith("_pending_"))continue;let St=me[ft];St&&St.annotationIds.some(so=>pn.has(so))&&delete me[ft]}return me});for(let Oe of Q)if(Oe.status==="done"&&Oe.annotationIds?.length&&Oe.annotationIds.some(me=>Se.has(me))&&!Et.current.has(Oe.id))try{let me=await wi(C,Oe.id);if(!me)continue;let De=me.events.find(pn=>pn.type==="done");De&&Array.isArray(De.resolutions)&&(Et.current.add(Oe.id),f({type:"APPLY_RESOLUTIONS",payload:{resolutions:De.resolutions,threadId:De.threadId??void 0}}))}catch{}}))},[p.isConnected,C,f,u.annotations,M]),At(()=>{let x=p.events.filter(A=>A.type==="done"&&A.data.resolutions);for(let A of x){let Q=A.data.jobId;Et.current.has(Q)||(Et.current.add(Q),Array.isArray(A.data.resolutions)&&f({type:"APPLY_RESOLUTIONS",payload:{resolutions:A.data.resolutions,threadId:A.data.threadId}}))}},[p.events,f]);let In=en(new Set);At(()=>{let x=p.events.filter(A=>A.type==="error"&&A.data.cancelled);for(let A of x){let Q=A.data.jobId;if(!Q||In.current.has(Q))continue;In.current.add(Q);let se=Ie[Q];se&&se.annotationIds.length>0&&f({type:"SET_ANNOTATION_STATUS",payload:{ids:se.annotationIds,status:"dismissed"}})}},[p.events,Ie,f]);let wn=en(0);At(()=>{let x=p.incrementalResolutions;if(x.length<=wn.current)return;let A=x.slice(wn.current);wn.current=x.length,f({type:"APPLY_RESOLUTIONS",payload:{resolutions:A}})},[p.incrementalResolutions,f]),At(()=>{p.incrementalResolutions.length===0&&(wn.current=0)},[p.incrementalResolutions.length]);let Wo=Gt(async()=>{let x=b.current;if(!x)return!1;let A=await Or(document.body,x,u.annotations);if(A.length===0)return!1;let Q=await Al(A,u.annotations,u.styleModifications);return Q&&f({type:"MARK_CAPTURED"}),Q},[u.annotations,u.styleModifications,f]),oo=Gt((x,A)=>{let Q=P.current.get(x)||[];P.current.set(x,[...Q,...A])},[]),ro=Gt(async()=>{let x=b.current;if(!x)return!1;let A=u.annotations.filter(et=>(et.status??"pending")==="pending"),Q=u.styleModifications.filter(et=>!et.captured&&(!et.pathname||et.pathname===M)),se=u.spacingTokenChanges.filter(et=>!et.captured);if(A.length===0&&Q.length===0&&se.length===0)return!1;let ve=new Map;for(let et of A){let nn=et.pathname||M;ve.has(nn)||ve.set(nn,[]),ve.get(nn).push(et)}let Se=new Map,Oe=[...ve.keys()].filter(et=>et!==M);if(Oe.length>0){let et=M,nn={x:window.scrollX,y:window.scrollY};I.current=!0;for(let fn of Oe)try{console.log(`[Popmelt] Navigating to ${fn} for screenshot capture`),await pd(fn,r),window.location.pathname!==fn&&console.warn(`[Popmelt] Navigation to ${fn} did not take effect (at ${window.location.pathname})`);let y=ve.get(fn)||[],v=await Or(document.body,x,y,{dpr:1}),D=await si(v);D&&(Se.set(fn,D),console.log(`[Popmelt] Captured ${fn} (${(D.size/1024).toFixed(0)}KB)`))}catch(y){console.warn(`[Popmelt] Failed to capture ${fn}:`,y)}await pd(et,r),window.scrollTo(nn.x,nn.y),I.current=!1}let me=A.filter(et=>(et.pathname||M)===M),De=await Or(document.body,x,me.length>0?u.annotations:[],{dpr:1});if(De.length>0){let et=await si(De);et&&Se.set(M,et)}if(Se.size===0)return!1;let pn=As(A,Q,void 0,se.length>0?se:void 0),ft=JSON.stringify(pn),St=new Map;for(let et of A){let nn=P.current.get(et.id);if(nn&&nn.length>0&&St.set(et.id,nn),et.groupId){for(let fn of A)if(fn.groupId===et.groupId&&fn.id!==et.id){let y=P.current.get(fn.id);y&&y.length>0&&St.set(fn.id,y)}}}let so=ve.size>1;console.log(`[Popmelt] Submit: ${ve.size} page(s), ${Se.size} screenshot(s), pages: [${[...ve.keys()].join(", ")}], cached: [${[...H.current.keys()].join(", ")}]`);let nr=so?Se:Se.get(M)??Se,or=A.map(et=>et.id),xi=Q.map(et=>et.selector),Si=Array.from(new Set([...A.map(et=>et.pathname||M),...Q.map(et=>et.pathname||M)])),ps=Rs(u.activeColor),Vo=`_pending_${Date.now()}`,kr={annotationIds:or,styleSelectors:xi,color:u.activeColor,threadId:void 0,routePathnames:Si};try{let et=JSON.parse(localStorage.getItem(dt)||"{}");et[Vo]=kr,localStorage.setItem(dt,JSON.stringify(et))}catch{}tn(et=>({...et,[Vo]:kr}));try{let{jobId:et,threadId:nn}=await za(nr,ft,C,ps,w,te.id,St.size>0?St:void 0,Ii());for(let h of St.keys())P.current.delete(h);for(let h of ve.keys())H.current.delete(h);let fn={...kr,threadId:nn};try{let h=JSON.parse(localStorage.getItem(dt)||"{}");delete h[Vo],h[et]=fn,localStorage.setItem(dt,JSON.stringify(h))}catch{}tn(h=>{let{[Vo]:E,...T}=h;return{...T,[et]:fn}}),f({type:"MARK_CAPTURED"}),nn&&or.length>0&&f({type:"SET_ANNOTATION_THREAD",payload:{ids:or,threadId:nn}});let y=u.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),D=((y?.[1]?parseFloat(y[1]):29)+60)%360;return f({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${D})`}),!0}catch(et){try{let nn=JSON.parse(localStorage.getItem(dt)||"{}");delete nn[Vo],localStorage.setItem(dt,JSON.stringify(nn))}catch{}return tn(nn=>{let{[Vo]:fn,...y}=nn;return y}),console.error("[Pare] Failed to send to bridge:",et),!1}},[u.annotations,u.styleModifications,u.spacingTokenChanges,u.activeColor,f,C,w,te.id,M,r]),Xn=Gt(async()=>{if(nt){ht(nt);return}try{let{jobId:x,threadId:A}=await Va(C,w,te.id);an(x),Mt(A);let Q={annotationIds:[],styleSelectors:[],color:"#6b7280",threadId:A,kind:"synthesize",global:!0};tn(se=>({...se,[x]:Q})),ht(A)}catch(x){console.error("[Popmelt] Failed to start synthesize:",x)}},[C,w,te.id,nt]),Zt=Gt(async()=>{oe(null),Be(null),ht(null);try{let{jobId:x,threadId:A}=await Ua(C,w,te.id);oe(x),Be(A);let Q={annotationIds:[],styleSelectors:[],color:qr,threadId:A,kind:"synthesize_evals",global:!0};tn(se=>({...se,[x]:Q})),ht(A)}catch(x){console.error("[Popmelt] Failed to start eval synthesis:",x)}},[C,w,te.id]),Io=Gt(async x=>{let A=b.current;if(A){lt(Q=>({...Q,[x.id]:"_pending_"}));try{let se=(await Or(document.body,A,[],{dpr:1}))[0];if(!se){lt(Oe=>{let{[x.id]:me,...De}=Oe;return De});return}let{jobId:ve,threadId:Se}=await Ja(x.id,se,{url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},scrollX:window.scrollX,scrollY:window.scrollY},C,w,te.id,Ii());if(lt(Oe=>({...Oe,[x.id]:ve})),Se){Ot(me=>new Set(me).add(Se));let Oe={annotationIds:[],styleSelectors:[],color:qr,threadId:Se,kind:"run_eval",global:!0};tn(me=>({...me,[ve]:Oe})),ht(Se)}}catch(Q){lt(se=>{let{[x.id]:ve,...Se}=se;return Se}),console.error("[Popmelt] Failed to run eval:",Q)}}},[C,w,te.id]),jo=Gt(async(x,A,Q)=>{let se=Object.values(Qe.current).find(De=>De.threadId===x)?.color??u.annotations.find(De=>De.threadId===x)?.color??u.activeColor,ve=u.annotations.filter(De=>De.threadId===x&&(De.status==="waiting_input"||De.status==="resolved"||De.status==="needs_review")),Se=ve.map(De=>De.id),Oe=`_pending_reply_${Date.now()}`,me={annotationIds:Se,styleSelectors:[],color:se,threadId:x};try{let De=JSON.parse(localStorage.getItem(dt)||"{}");De[Oe]=me,localStorage.setItem(dt,JSON.stringify(De))}catch{}tn(De=>({...De,[Oe]:me}));try{let De=Rs(u.activeColor),{jobId:pn}=await Ka(x,A,C,De,w,te.id,Q,Ii()),ft={...me};try{let St=JSON.parse(localStorage.getItem(dt)||"{}");delete St[Oe],St[pn]=ft,localStorage.setItem(dt,JSON.stringify(St))}catch{}tn(St=>{let{[Oe]:so,...nr}=St;return{...nr,[pn]:ft}}),ve.length>0&&f({type:"SET_ANNOTATION_STATUS",payload:{ids:Se,status:"in_flight"}}),p.dismissQuestion(x)}catch(De){try{let pn=JSON.parse(localStorage.getItem(dt)||"{}");delete pn[Oe],localStorage.setItem(dt,JSON.stringify(pn))}catch{}tn(pn=>{let{[Oe]:ft,...St}=pn;return St}),console.error("[Pare] Failed to send reply:",De)}},[u.activeColor,u.annotations,C,p.dismissQuestion,f,w,te.id]),Mo=en(new Set);At(()=>{for(let x of p.pendingQuestions){if(Mo.current.has(x.jobId))continue;Mo.current.add(x.jobId);let A=x.annotationIds&&x.annotationIds.length>0?x.annotationIds:void 0;!A&&x.threadId&&(A=u.annotations.filter(Q=>Q.threadId===x.threadId).map(Q=>Q.id)),A&&A.length>0&&f({type:"SET_ANNOTATION_QUESTION",payload:{ids:A,question:x.question,threadId:x.threadId}})}},[p.pendingQuestions,f,u.annotations]);let Tr=po(()=>{if(p.activeJobId&&p.activeJobId in Ie)return Ie[p.activeJobId].color;let x=Object.values(Ie);return x.length>0?x[x.length-1].color:void 0},[p.activeJobId,Ie]),Ro=Gt(x=>{ht(x)},[]),Go=Gt(x=>{Ot(A=>new Set(A).add(x)),J.current=qr,ht(x)},[]),L=Gt((x,A)=>{let Q=Ie[x],se=Wn.current.get(x);if(Q){let Se=new Set(Q.styleSelectors);for(let Oe of Q.annotationIds){let me=u.annotations.find(De=>De.id===Oe);if(me&&(me.linkedSelector&&Se.add(me.linkedSelector),me.groupId))for(let De of u.annotations)De.groupId===me.groupId&&De.linkedSelector&&Se.add(De.linkedSelector)}Se.size>0&&(se=Array.from(Se))}se?.length&&uh(se);let ve=Q?.threadId||A||zt.current.get(x);ve&&(J.current=Q?.kind==="synthesize_evals"||Q?.kind==="run_eval"||Q?.kind==="materialize_model"?qr:Q?.color??null,ht(ve))},[Ie,u.annotations]),F=Gt(x=>{if(!x){ln(null);return}let A=qt.current.get(x);A&&A.length>0?ln(new Set(A)):ln(null)},[]),ne=Gt(async x=>{try{let A=x?`${C}/cancel?jobId=${x}`:`${C}/cancel`;await mo(A,{method:"POST"})}catch{}},[C]),ae=Gt(async()=>{B("restarting"),ge("Restarting bridge");let x=await hs(C,Fi,2e4);if(x.ok){await nl(x.bridgeUrl??n,c),Ee(x.status.version??Fi),B("ok"),ge(x.status.version?`Bridge restarted on ${x.status.version}`:"Bridge restarted"),ue(A=>A+1);return}Ee(x.status?.version??we),B("error"),ge(x.error)},[we,n,c,C]),le=po(()=>{if(!We)return null;for(let x of Object.values(Ie))if(x.threadId===We&&x.kind)return x.kind;return We===nt?"synthesize":We===Ce?"synthesize_evals":qe.has(We)?"run_eval":null},[We,Ie,nt,Ce,qe]),fe=le==="synthesize_evals"||le==="run_eval",Me=le==="materialize_model",be=le==="synthesize";At(()=>{(u.activeTool==="model"&&We&&!be||u.activeTool==="eval"&&We&&!fe)&&ht(null)},[u.activeTool,We,be,fe]);let Vt=Gt(()=>{f({type:"SET_TOOL",payload:"eval"}),Pt(x=>x+1),ht(null)},[f]),_t=en(null);At(()=>{u.isAnnotating?_t.current&&(ht(_t.current),_t.current=null):We&&(_t.current=We,ht(null))},[u.isAnnotating]);let yt=po(()=>{if(!We)return null;for(let[x,A]of Object.entries(Ie))if(A.threadId===We)return x;for(let[x,A]of Object.entries(p.activeJobThreads))if(A===We)return x;return null},[We,Ie,p.activeJobThreads]),Ft=We?u.annotations.find(x=>x.threadId===We):void 0,ct=po(()=>yt?p.events.filter(x=>x.data.jobId===yt):ch,[yt,p.events.length]),Cn=po(()=>fe||Me?qr:Ft?.color??J.current??u.activeColor,[fe,Me,Ft?.color,u.activeColor]),Mn=Ft?u.annotations.indexOf(Ft)+1:void 0;At(()=>{if(fe)return;let x=Ft?.color??J.current;We&&x&&f({type:"SET_COLOR",payload:x})},[We,fe]);let[un,En]=wt(!1),[Jo,Ao]=wt(0),qn=en(null),Qr=Gt(x=>{x?(qn.current&&(clearTimeout(qn.current),qn.current=null),En(!0)):qn.current=setTimeout(()=>{En(!1),qn.current=null},150)},[]),vi=Gt(()=>{Ao(x=>x+1),p.clearEvents(),ht(null),Ze(new Set),ne()},[p.clearEvents,ne]);At(()=>()=>{qn.current&&clearTimeout(qn.current)},[]);let[Yo,io]=wt(!1);At(()=>{io(!0)},[]);let ei=po(()=>({isEnabled:t}),[t]);return!t||!Yo?Zr(_a.Provider,{value:ei,children:e}):fd(_a.Provider,{value:ei,children:[e,Zr(bc,{state:u,dispatch:f,onScreenshot:Wo,inFlightAnnotationIds:er,activeAnnotationIds:ko,queuePositionMap:zo,inFlightStyleSelectors:tr,inFlightSelectorColors:hn,onAttachImages:oo,onReply:p.isConnected?jo:void 0,onViewThread:p.isConnected?Ro:void 0,onCloseThread:x=>{ht(null),x&&Ze(A=>new Set(A).add(x))},onModelComponentsAdd:p.isConnected?st:void 0,onModelComponentFocus:p.isConnected?Ye:void 0,onModelComponentHover:ie,modelComponentNames:xe,modelPanelHoveredComponent:Ne,modelSpacingTokenHover:Te,highlightedAnnotationIds:Ct,focusedThreadAnnotationId:Ft?.id,externalCanvasRef:b,toolbarRef:S}),Zr(od,{children:fd(td,{children:[Zr(Kc,{state:u,dispatch:f,onScreenshot:Wo,onSendToClaude:p.isConnected?ro:void 0,hasActiveJobs:Object.keys(Ie).length>0||p.activeJobIds.length>0,activeJobColor:Tr,onCrosshairHover:Qr,onClear:vi,provider:w,onProviderChange:p.isConnected&&k.length>1?ot:void 0,availableProviders:k,modelIndex:Z,modelCount:Ue.length,modelLabel:te.label,onModelChange:p.isConnected?Ke:void 0,onViewThread:p.isConnected?Ro:void 0,isThreadPanelOpen:We!==null&&!be&&!fe,mcpStatus:Re,bridgeUrl:C,isBridgeConnected:p.isConnected,packageVersion:Fi,bridgeVersion:we,bridgeRestartState:V,bridgeRestartMessage:re,onBridgeRestart:ae,modelSelectedComponent:ut,modelCanvasHoveredComponent:ee,onModelComponentHover:pt,onSpacingTokenHover:rt,onModifySpacingToken:p.isConnected?Jt:void 0,onDeleteSpacingToken:p.isConnected?Xe:void 0,modelRefreshKey:_n,onModelComponentAdded:It,onModelComponentRemoved:Xt,onSynthesizeRules:p.isConnected&&w!=="copilot"?Xn:void 0,isSynthesizing:je!==null,onSynthesizeEvals:p.isConnected&&w!=="copilot"?Zt:void 0,isSynthesizingEvals:$n!==null,onRunEval:p.isConnected&&w!=="copilot"?Io:void 0,onViewEvalRunThread:Go,runningEvalIds:Object.keys($e),evalRefreshKey:Ge,toolbarRef:S,snapPosition:no,onSnapPositionChange:Kn}),We&&Zr(ud,{threadId:We,bridgeUrl:C,accentColor:Cn,isStreaming:yt!==null,isQueued:yt!==null&&!p.activeJobIds.includes(yt),queuePosition:yt&&!p.activeJobIds.includes(yt)?(()=>{let x=new Set(p.activeJobIds),A=Object.keys(Ie).filter(se=>!x.has(se)),Q=A.indexOf(yt);return Q>=0?`(${Q+1}/${A.length})`:void 0})():void 0,streamingEvents:ct,onClose:()=>ht(null),onReply:jo,onCancel:yt?()=>ne(yt):void 0,lastError:p.lastErrorByJob?.[yt??""]??(p.lastCompletedJobId&&zt.current.get(p.lastCompletedJobId)===We?p.lastErrorByJob?.[p.lastCompletedJobId]:void 0),toolbarRef:S,currentModel:te.id,currentProvider:w,annotationNumber:Mn,annotationText:Ft?.text,onOpenEvals:Vt,preferredSide:fe||Me?"left":"right",modal:!fe&&!Me},`${We}:${fe||Me?"workflow":"default"}`),Zr(ed,{bridge:p,bridgeUrl:C,inFlightJobs:Ie,isVisible:un||p.lastResponseText!==null||p.activeJobIds.length>0,onHover:Qr,clearSignal:Jo,onReply:jo,onViewThread:Ro,onClickJob:L,onCancel:ne,onHoverJob:F,isConnected:p.isConnected,dismissedThreadIds:ke,snapPosition:no,currentPathname:M})]})})]})}function hh(){let e=lh(_a);if(!e)throw new Error("usePopmelt must be used within PopmeltProvider");return e}export{mh as PopmeltProvider,hh as usePopmelt};
|
|
79
|
+
`}}),De("div",{ref:Ke,style:{...Wm,transition:"opacity 150ms ease"},"data-devtools":"thread-panel-messages",children:[g&&U("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"Loading..."}),!g&&Xe.length===0&&Yt.length===0&&!o&&U("div",{style:{padding:16,color:"#9ca3af",textAlign:"center"},children:"No messages yet."}),Xe.map((q,se)=>{let fe=gd(q,Xe[se-1]);return U(fd,{msg:q,index:se,bridgeUrl:t,accentColor:n,onLightbox:re,hideSender:fe,hideTimestamp:fe,compactSpacing:fe},`${q.jobId}-${se}`)}),!g&&j&&U(hh,{proposal:j,bridgeUrl:t,busy:T,onApplySelected:Ht,onDismiss:()=>Xt("dismiss"),onProjectEvals:()=>Xt("project-evals"),onOpenEvals:L}),!o&&L&&v.some(q=>q.role==="assistant"&&(q.responseText?.includes("<eval_proposals>")||q.responseText?.includes("<evals>")))&&U("div",{style:{padding:"0 16px 12px"},children:U("button",{type:"button",onClick:L,style:{width:"100%",border:"1px solid rgba(0,0,0,0.12)",background:"rgba(0,0,0,0.02)",color:"#6b7280",cursor:"pointer",fontFamily:rn,fontSize:11,fontWeight:650,padding:"5px 8px"},children:"Review proposals"})}),o&&U("div",{style:{padding:16,display:"flex",flexDirection:"column",gap:8},children:r?De("div",{style:{display:"flex",alignItems:"center",gap:6},children:[De("svg",{width:"11",height:"11",viewBox:"0 0 24 24",fill:n,style:{verticalAlign:"middle",flexShrink:0,opacity:.5},children:[U("circle",{cx:"12",cy:"6",r:"2"}),U("circle",{cx:"6",cy:"12",r:"2"}),U("circle",{cx:"18",cy:"12",r:"2"}),U("circle",{cx:"12",cy:"18",r:"2"})]}),De("span",{style:{fontSize:11,color:"#9ca3af",fontStyle:"italic"},children:["queued",i?` ${i}`:""]})]}):De(Io,{children:[De("div",{style:{display:"flex",alignItems:"center",gap:4},children:[U(hi,{provider:C,size:11,style:{color:"#6b7280"}}),U("span",{style:{fontWeight:600,fontSize:11,color:"#6b7280"},children:ka(b,C)})]}),tt.map((q,se)=>{if(q.kind==="tool_group")return U(bd,{tool:q.tool,items:q.items},se);if(q.kind==="file_content")return U(ch,{file:q.file,content:q.content,ext:q.ext,isPlan:q.isPlan,onAccept:q.isPlan&&c?()=>c(e,"Looks good, please proceed with implementation."):void 0},se);if(q.kind==="thinking")return U("div",{style:{paddingLeft:12,fontSize:11,color:"#9ca3af",fontStyle:"italic",lineHeight:1.4,whiteSpace:"pre-wrap",wordBreak:"break-word",maxHeight:80,overflowY:"auto"},children:q.text},se);let fe=ps(q.text);return fe?U("div",{style:{paddingLeft:12,lineHeight:1.5,wordBreak:"break-word"},children:ko(fe)},se):null}),De("div",{style:{display:"flex",alignItems:"center",gap:6},children:[U(Zm,{color:n}),d&&U("button",{onClick:d,style:{background:"none",border:"1px solid rgba(0,0,0,0.1)",color:"#6b7280",fontSize:10,padding:"2px 8px",cursor:"pointer",fontFamily:"inherit",marginLeft:"auto"},children:"Cancel"})]})]})}),Yt.length>0&&De("div",{style:{display:"flex",flexDirection:"column",borderTop:"1px solid rgba(0,0,0,0.08)"},children:[U("div",{style:{padding:"8px 16px 0",fontSize:10,color:"#9ca3af",fontStyle:"italic"},children:"queued"}),Yt.map((q,se)=>(()=>{let fe=gd(q,Yt[se-1]);return U(fd,{msg:q,index:Xe.length+se,bridgeUrl:t,accentColor:n,onLightbox:re,hideSender:fe,hideTimestamp:fe,compactSpacing:fe},`${q.jobId}-staged-${se}`)})())]}),!X&&v.length>0&&U("div",{style:{position:"sticky",bottom:5,display:"flex",justifyContent:"flex-end",paddingRight:3,pointerEvents:"none"},children:U("button",{onClick:()=>{Ke.current&&Ke.current.scrollTo({top:Ke.current.scrollHeight,behavior:"smooth"})},style:{position:"relative",display:"flex",alignItems:"center",justifyContent:"center",padding:4,fontSize:10,fontFamily:rn,color:"transparent",backgroundColor:"#eaeaea",backgroundImage:`url("data:image/svg+xml,${encodeURIComponent("<svg xmlns='http://www.w3.org/2000/svg' width='5' height='5'><path d='M-1,1 l2,-2 M0,5 l5,-5 M4,6 l2,-2' stroke='rgb(0,0,0)' stroke-width='.75'/></svg>")}")`,backgroundSize:"5px 5px",border:"none",borderRadius:0,cursor:"pointer",pointerEvents:"auto",userSelect:"none"},children:De("span",{style:{position:"relative",backgroundColor:"#eaeaea",padding:"0 6px",color:"#374151",fontFamily:rn,lineHeight:1.4},children:[oe," message",oe!==1?"s":""," \u2193"]})})})]}),!o&&u&&De("div",{style:{padding:"8px 16px",backgroundColor:"rgba(239, 68, 68, 0.06)",fontSize:11,color:"#dc2626",lineHeight:1.4},children:[U("span",{style:{fontWeight:600},children:"Error: "}),u]}),c&&De("div",{style:{flexShrink:0,position:"relative"},children:[ke.length>0&&U("div",{style:{position:"absolute",bottom:"100%",display:"flex",gap:4,padding:"6px 5px 5px",flexWrap:"wrap"},children:ke.map((q,se)=>De("span",{onClick:()=>ue(fe=>fe.filter((Ie,rt)=>rt!==se)),onMouseEnter:fe=>{let Ie=fe.currentTarget.querySelector("[data-chip-x]");Ie&&(Ie.style.color="#fff")},onMouseLeave:fe=>{let Ie=fe.currentTarget.querySelector("[data-chip-x]");Ie&&(Ie.style.color="rgba(255,255,255,0.4)")},style:{display:"inline-flex",alignItems:"center",gap:4,fontSize:10,color:"#fff",backgroundColor:n,backdropFilter:"blur(4px)",padding:"2px 6px 2px 6px",cursor:"pointer"},children:["image ",se+1,U("span",{"data-chip-x":!0,style:{fontSize:12,lineHeight:1,color:"rgba(255,255,255,0.4)"},children:"\xD7"})]},se))}),De("div",{ref:Te,style:{...Gm,borderTop:"1px solid rgba(0,0,0,0.12)"},children:[U("input",{"data-popmelt-reply":!0,autoFocus:!0,value:$,onChange:q=>{me(q.target.value),Be(Ee.current,q.target.value)},onFocus:()=>{Ee.current=!0,Be(!0,$)},onBlur:()=>{Ee.current=!1,Be(!1,$)},onKeyDown:Sn,onPaste:Wn,placeholder:"Reply here (cmd + enter to send)",style:{flex:1,minWidth:0,minHeight:44,padding:"0 4px",fontSize:12,fontFamily:rn,backgroundColor:"transparent",color:"#1f2937",border:"none",outline:"none",lineHeight:"40px",boxSizing:"border-box"}}),U("button",{onClick:Et,disabled:!$.trim(),style:{display:"flex",alignItems:"center",justifyContent:"center",width:28,height:28,padding:0,background:"none",border:"none",cursor:$.trim()?"pointer":"default",color:$.trim()?n:"rgba(0,0,0,0.2)",flexShrink:0},children:De("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round",children:[U("path",{d:"M3.714 3.048a.498.498 0 0 0-.683.627l2.843 7.627a2 2 0 0 1 0 1.396l-2.842 7.627a.498.498 0 0 0 .682.627l18-8.5a.5.5 0 0 0 0-.904z"}),U("path",{d:"M6 12h16"})]})})]})]})]})]}),ze&&U(nh,{src:ze,onClose:()=>Ye(null)})]})}import{jsx as ei,jsxs as wd}from"react/jsx-runtime";var vh=[],$a=yh(null),Ha="devtools-provider",hs="devtools-model",Na="devtools-open-thread-id",za="popmelt-synthesize-thread",Fa="popmelt-eval-synthesize-thread",Qr="#000000";function xh(e){let t=e.getBoundingClientRect();return t.bottom<0||t.top>window.innerHeight||t.right<0||t.left>window.innerWidth}function Sh(e){for(let t of e){let n=Tn(t);if(n){xh(n)&&n.scrollIntoView({behavior:"smooth",block:"center",inline:"nearest"});return}}}async function Sd(e,t){t?await t(e):(window.history.pushState(window.history.state,"",e),window.dispatchEvent(new PopStateEvent("popstate",{state:window.history.state}))),await new Promise(n=>{requestAnimationFrame(()=>requestAnimationFrame(()=>{setTimeout(n,600)}))})}var wh={0:0,1:1},Ch={0:0,1:1,2:1};function Eh(e,t,n){if(t==="copilot")return 0;let o=t==="codex"?cs:ls;return e==="copilot"?0:e==="claude"&&t==="codex"?wh[n]??Math.min(n,o.length-1):e==="codex"&&t==="claude"?Ch[n]??Math.min(n,o.length-1):Math.min(n,o.length-1)}function kh({children:e,enabled:t=process.env.NODE_ENV==="development",bridgeUrl:n=typeof window<"u"?window.__POPMELT_BRIDGE_URL__??"http://localhost:1111":"http://localhost:1111",projectId:o,navigate:r}){let i=typeof window<"u"?o??window.__POPMELT_PROJECT_ID__??null:null,[a,s]=Ct(i),[l,c]=Ct(!!i),d=a,[u,p]=ul(),f=cl(n,t&&!!d,d);At(()=>{i&&(typeof window<"u"&&(window.__POPMELT_PROJECT_ID__=i),s(i),c(!0))},[i]);let b=en(null),C=en(null),w=al()??n,M=en(new Map),L=en(new Map),E=en(!1),R=Pr(),[v,D]=Ct(()=>typeof window>"u"?"claude":localStorage.getItem(Ha)||"claude"),[j,J]=Ct(()=>{if(typeof window>"u")return 0;let S=localStorage.getItem(hs);return S&&parseInt(S,10)||0}),[T,N]=Ct([]),[g,m]=Ct({}),[$,me]=Ct(0),[ke,ue]=Ct({}),[Ee,Te]=Ct(null),[X,_]=Ct("idle"),[oe,ye]=Ct(null);At(()=>{f.isConnected&&Ga(w).then(S=>{if(!S)return;let P=Object.entries(S.providers).filter(([,Se])=>Se.available).map(([Se])=>Se);P.length>0&&N(P);let ee={};for(let[Se,Ce]of Object.entries(S.providers))Ce.models&&Ce.models.length>0&&(ee[Se]=Ce.models);m(ee);let ie={};for(let[Se,Ce]of Object.entries(S.providers))Ce.mcp&&(ie[Se]=Ce.mcp);ue(ie)})},[f.isConnected,f.capabilitiesVersion,$,w]),At(()=>{if(!f.isConnected){Te(null);return}let S=!1;return yo(w).then(P=>{S||Te(P?.version??null)}),()=>{S=!0}},[f.isConnected,f.capabilitiesVersion,$,w]),At(()=>{if(X==="idle"||X==="restarting")return;let S=window.setTimeout(()=>{_("idle"),ye(null)},X==="ok"?4e3:8e3);return()=>window.clearTimeout(S)},[X]),At(()=>{if(T.length>0&&!T.includes(v)){let S=T[0];D(S),localStorage.setItem(Ha,S)}},[T,v]);let ze=v==="codex"?[...cs]:v==="copilot"?[...Ea]:[...ls],Ye=g[v]&&g[v].length>0?g[v]:ze,re=Ye[j]??Ye[0];At(()=>{if(!t||d||l)return;let S=!1;return fetch("/popmelt/status").then(P=>P.ok?P.json():null).then(P=>{if(S)return;let ee=typeof window<"u"&&P?.devOrigin===window.location.origin,ie=P?.projectId&&(ee||P.projectIdVerified===!0)?P.projectId:null;ie&&typeof window<"u"&&(window.__POPMELT_PROJECT_ID__=ie),s(ie),c(!0)}).catch(()=>{S||c(!0)}),()=>{S=!0}},[t,d,l]),At(()=>{j>=Ye.length&&(J(0),localStorage.setItem(hs,"0"))},[j,Ye.length]);let Ke=Gt(S=>{let P=v;D(S),localStorage.setItem(Ha,S);let ee=Eh(P,S,j);J(ee),localStorage.setItem(hs,String(ee))},[v,j]),Ge=Gt(S=>{J(S),localStorage.setItem(hs,String(S))},[]),[we,Be]=Ct(new Set),[ut,G]=Ct(null),[ce,te]=Ct(null),[Oe,st]=Ct(null),[Pe,nt]=Ct(null);At(()=>{f.isConnected&&Rr(w).then(S=>{S?.components&&Be(new Set(Object.keys(S.components)))})},[f.isConnected,w]);let lt=Gt(async S=>{let P=[];for(let ee of S)try{(await Va(ee,w)).added&&P.push(ee)}catch(ie){console.error("[Popmelt] Failed to add component to model:",ee,ie)}P.length>0&&(Be(ee=>{let ie=new Set(ee);for(let Se of P)ie.add(Se);return ie}),G(P[P.length-1]))},[w]),Je=Gt(S=>{G(S)},[]),yt=Gt(()=>{Rr(w).then(S=>{S?.components&&Be(new Set(Object.keys(S.components)))})},[w]),Xt=Gt(async S=>{try{(await Ya(S,w)).removed&&Be(ee=>{let ie=new Set(ee);return ie.delete(S),ie})}catch(P){console.error("[Popmelt] Failed to remove component from model:",P)}},[w]),Ht=Gt((S,P)=>{p({type:"MODIFY_SPACING_TOKEN",payload:S}),p({type:"ADD_SPACING_TOKEN_CHANGE",payload:P})},[p]),tt=Gt((S,P)=>{p({type:"DELETE_SPACING_TOKEN",payload:{tokenPath:S,originalValue:P}})},[p]),[Ve,Yt]=Ct(null),[Xe,Et]=Ct(()=>typeof window>"u"?null:localStorage.getItem(za)||null),[Wn,Sn]=Ct(null),[Rn,ln]=Ct(()=>typeof window>"u"?null:localStorage.getItem(Fa)||null),[Nt,q]=Ct(0),[se,fe]=Ct({}),[Ie,rt]=Ct(new Set);At(()=>{Xe?localStorage.setItem(za,Xe):localStorage.removeItem(za)},[Xe]),At(()=>{Rn?localStorage.setItem(Fa,Rn):localStorage.removeItem(Fa)},[Rn]);let[ct,gt]=Ct(0),Ut=en([]);At(()=>{let S=Ut.current,P=u.spacingTokenMods;Ut.current=P;let ee=new Map(S.map(Ce=>[Ce.tokenPath,Ce])),ie=new Map(P.map(Ce=>[Ce.tokenPath,Ce])),Se=!1;for(let[Ce,Fe]of ie){let he=ee.get(Ce);if(!(he&&he.currentValue===Fe.currentValue)){Se=!0,Fe.currentValue==="__deleted__"?Ua(Ce,w).catch(Ne=>console.error("[Popmelt] Failed to sync token delete:",Ne)):xs(Ce,Fe.currentValue,w).catch(Ne=>console.error("[Popmelt] Failed to sync token update:",Ne));for(let Ne of Fe.targets){let dn=document.querySelector(Ne.selector);if(dn)if(Fe.currentValue==="__deleted__")dn.style.removeProperty(Ne.property);else{let pt=Fe.currentPx;pt>0&&dn.style.setProperty(Ne.property,`${pt}px`,"important")}}}}for(let[Ce,Fe]of ee)if(!ie.has(Ce)){Se=!0,xs(Ce,Fe.originalValue,w).catch(he=>console.error("[Popmelt] Failed to restore token on undo:",he));for(let he of Fe.targets){let Ne=document.querySelector(he.selector);Ne&&Ne.style.removeProperty(he.property)}}Se&>(Ce=>Ce+1)},[u.spacingTokenMods,w]);let[jn,hn]=Ct(()=>fl()),An=Gt(S=>{hn(S),gl(S)},[]),[He,bt]=Ct(()=>typeof window>"u"?null:localStorage.getItem(Na)||null),Y=en(null),[Me,qe]=Ct(new Set),[kt,cn]=Ct(null);At(()=>{He?localStorage.setItem(Na,He):localStorage.removeItem(Na)},[He]);let dt="popmelt-in-flight-jobs",[Re,tn]=Ct(()=>{try{let S=localStorage.getItem(dt);return S?JSON.parse(S):{}}catch{return{}}});At(()=>{try{Object.keys(Re).length>0?localStorage.setItem(dt,JSON.stringify(Re)):localStorage.removeItem(dt)}catch{}},[Re]),At(()=>{let S=P=>{if(P.key===dt)try{let ee=P.newValue?JSON.parse(P.newValue):{};tn(ee)}catch{}};return window.addEventListener("storage",S),()=>window.removeEventListener("storage",S)},[]);let qt=en(new Map),Gn=en(new Map),zt=en(new Map);At(()=>{for(let[S,P]of Object.entries(Re)){P.annotationIds.length>0&&qt.current.set(S,P.annotationIds);let ee=new Set(P.styleSelectors);for(let ie of P.annotationIds){let Se=u.annotations.find(Ce=>Ce.id===ie);if(Se&&(Se.linkedSelector&&ee.add(Se.linkedSelector),Se.groupId))for(let Ce of u.annotations)Ce.groupId===Se.groupId&&Ce.linkedSelector&&ee.add(Ce.linkedSelector)}ee.size>0&&Gn.current.set(S,Array.from(ee)),P.threadId&&zt.current.set(S,P.threadId)}},[Re,u.annotations]);let Mo=en("");At(()=>{if(u.annotations.length===0)return;let S=Object.keys(Re).sort().join(",");if(S===Mo.current)return;Mo.current=S;let P=new Set;for(let ie of Object.values(Re))for(let Se of ie.annotationIds)P.add(Se);let ee=u.annotations.filter(ie=>P.has(ie.id)?!1:!!(ie.status==="in_flight"||(ie.status==="pending"||!ie.status)&&(ie.captured||ie.threadId))).map(ie=>ie.id);ee.length>0&&p({type:"SET_ANNOTATION_STATUS",payload:{ids:ee,status:"dismissed"}})},[u.annotations,Re,p]);let nr=mo(()=>{let S=new Set;for(let P of Object.values(Re))for(let ee of P.annotationIds)S.add(ee);return S},[Re]),Ro=mo(()=>{let S=new Set(f.activeJobIds),P=new Set;for(let[ee,ie]of Object.entries(Re))if(S.has(ee))for(let Se of ie.annotationIds)P.add(Se);return P},[Re,f.activeJobIds]),Wo=mo(()=>{let S=new Set(f.activeJobIds),P=Object.entries(Re).filter(([Se])=>!S.has(Se)),ee=P.length,ie=new Map;return P.forEach(([,Se],Ce)=>{let Fe=`(${Ce+1}/${ee})`;for(let he of Se.annotationIds)ie.set(he,Fe)}),ie},[Re,f.activeJobIds]),or=mo(()=>{let S=new Set;for(let P of Object.values(Re))if(!(!P.global&&P.routePathnames?.length&&!P.routePathnames.includes(R)))for(let ee of P.styleSelectors)S.add(ee);return S},[Re,R]),yn=mo(()=>{let S=new Map;for(let P of Object.values(Re))if(!(!P.global&&P.routePathnames?.length&&!P.routePathnames.includes(R))){for(let ee of P.styleSelectors)S.set(ee,P.color);for(let ee of P.annotationIds){let ie=u.annotations.find(Se=>Se.id===ee);if(ie&&(ie.linkedSelector&&S.set(ie.linkedSelector,P.color),ie.groupId))for(let Se of u.annotations)Se.groupId===ie.groupId&&Se.linkedSelector&&S.set(Se.linkedSelector,P.color)}}return S},[Re,u.annotations,R]),jo=en(u.annotations);jo.current=u.annotations;let Go=en(u.styleModifications);Go.current=u.styleModifications;let Ze=en(Re);Ze.current=Re,At(()=>{let S=null,P=()=>{if(Object.keys(Ze.current).length>0)return;let ie=jo.current,Se=Go.current,Ce=[],Fe=[];for(let he of ie){if(!he.linkedSelector||!he.linkedSelector.startsWith("[data-pm=")||he.pathname||he.captured||he.status&&he.status!=="pending")continue;let Ne=document.querySelector(he.linkedSelector);!Ne&&he.elements?.[0]?.selector&&(Ne=document.querySelector(he.elements[0].selector)),Ne||Ce.push(he.linkedSelector)}for(let he of Se)he.pathname&&he.pathname!==window.location.pathname||document.querySelector(he.selector)||Fe.push(he.selector);(Ce.length>0||Fe.length>0)&&p({type:"CLEANUP_ORPHANED",payload:{linkedSelectors:Ce,styleSelectors:Fe}})},ee=new MutationObserver(ie=>{ie.some(Se=>Se.removedNodes.length>0)&&(S&&clearTimeout(S),S=setTimeout(P,3e3))});return ee.observe(document.body,{childList:!0,subtree:!0}),()=>{ee.disconnect(),S&&clearTimeout(S)}},[p]);let ho=en(typeof window<"u"?window.location.pathname:"/");At(()=>{let S=ie=>{if(E.current)return;let Se=window.location.pathname;if(ie===Se)return;let Ce=jo.current.filter(he=>he.pathname===ie&&(he.status??"pending")==="pending");if(console.log(`[Popmelt] Navigation from ${ie} \u2192 ${Se}, ${Ce.length} pending annotations on departing page`),Ce.length===0)return;let Fe=b.current;if(!Fe){console.warn("[Popmelt] No canvas ref for capture-on-leave");return}if(Nr(document.body,Fe,Ce,{dpr:1}).then(he=>li(he)).then(he=>{he?(L.current.set(ie,he),console.log(`[Popmelt] Cached screenshot for ${ie} (${(he.size/1024).toFixed(0)}KB)`)):console.warn(`[Popmelt] Capture-on-leave produced no blob for ${ie}`)}).catch(he=>{console.warn("[Popmelt] Capture-on-leave failed:",he)}),L.current.size>20){let he=[...L.current.entries()];L.current=new Map(he.slice(-10))}},P=ie=>{let Se=ie.detail?.prevPath;Se&&(S(Se),ho.current=window.location.pathname)},ee=()=>{let ie=ho.current;S(ie),ho.current=window.location.pathname};return window.addEventListener("popmelt:locationchange",P),window.addEventListener("popstate",ee),()=>{window.removeEventListener("popmelt:locationchange",P),window.removeEventListener("popstate",ee)}},[]),At(()=>{if(f.lastCompletedJobId&&f.lastCompletedJobId in Re&&tn(S=>{let{[f.lastCompletedJobId]:P,...ee}=S;return ee}),f.lastCompletedJobId&&f.lastCompletedJobId===Ve&&(gt(S=>S+1),Yt(null)),f.lastCompletedJobId&&f.lastCompletedJobId===Wn&&(q(S=>S+1),Sn(null)),f.lastCompletedJobId){let S=Object.entries(se).find(([,P])=>P===f.lastCompletedJobId)?.[0];S&&(fe(P=>{let{[S]:ee,...ie}=P;return ie}),q(P=>P+1))}},[f.lastCompletedJobId,Ve,Wn,se]);let Tt=en(new Set),wn=en(!1);At(()=>{if(!f.isConnected){wn.current=!1;return}wn.current||(wn.current=!0,yo(w).then(async S=>{if(!S)return;let P=S.activeJobs??[],ee=S.recentJobs??[],ie=new Set(P.map(Fe=>Fe.id)),Se=JSON.parse(localStorage.getItem(dt)||"{}"),Ce=new Set;for(let Fe of Object.values(Se))if(Fe.annotationIds)for(let he of Fe.annotationIds)Ce.add(he);tn(Fe=>{let he={...Fe},Ne=Date.now();for(let pt of Object.keys(he)){if(pt.startsWith("_pending_")){let wt=parseInt(pt.replace(/^_pending_(?:reply_)?/,""),10);!isNaN(wt)&&Ne-wt>3e4&&delete he[pt];continue}ie.has(pt)||delete he[pt]}for(let pt of P)if(!he[pt.id]&&(pt.annotationIds?.length||pt.threadId)){let wt=pt.kind,lo=Array.from(new Set((pt.annotationIds??[]).map(rr=>u.annotations.find(ir=>ir.id===rr)?.pathname||R).filter(Boolean)));he[pt.id]={annotationIds:pt.annotationIds??[],styleSelectors:[],color:wt==="synthesize_evals"||wt==="run_eval"||wt==="materialize_model"?Qr:pt.color??"#888",threadId:pt.threadId,kind:wt,routePathnames:lo.length>0?lo:void 0,global:wt==="synthesize"||wt==="synthesize_evals"||wt==="run_eval"||wt==="materialize_model"}}let dn=new Set;for(let pt of ee)if(pt.annotationIds)for(let wt of pt.annotationIds)dn.add(wt);for(let pt of Object.keys(he)){if(!pt.startsWith("_pending_"))continue;let wt=he[pt];wt&&wt.annotationIds.some(lo=>dn.has(lo))&&delete he[pt]}return he});for(let Fe of ee)if(Fe.status==="done"&&Fe.annotationIds?.length&&Fe.annotationIds.some(he=>Ce.has(he))&&!Tt.current.has(Fe.id))try{let he=await ki(w,Fe.id);if(!he)continue;let Ne=he.events.find(dn=>dn.type==="done");Ne&&Array.isArray(Ne.resolutions)&&(Tt.current.add(Fe.id),p({type:"APPLY_RESOLUTIONS",payload:{resolutions:Ne.resolutions,threadId:Ne.threadId??void 0}}))}catch{}}))},[f.isConnected,w,p,u.annotations,R]),At(()=>{let S=f.events.filter(P=>P.type==="done"&&P.data.resolutions);for(let P of S){let ee=P.data.jobId;Tt.current.has(ee)||(Tt.current.add(ee),Array.isArray(P.data.resolutions)&&p({type:"APPLY_RESOLUTIONS",payload:{resolutions:P.data.resolutions,threadId:P.data.threadId}}))}},[f.events,p]);let Ln=en(new Set);At(()=>{let S=f.events.filter(P=>P.type==="error"&&P.data.cancelled);for(let P of S){let ee=P.data.jobId;if(!ee||Ln.current.has(ee))continue;Ln.current.add(ee);let ie=Re[ee];ie&&ie.annotationIds.length>0&&p({type:"SET_ANNOTATION_STATUS",payload:{ids:ie.annotationIds,status:"dismissed"}})}},[f.events,Re,p]);let Cn=en(0);At(()=>{let S=f.incrementalResolutions;if(S.length<=Cn.current)return;let P=S.slice(Cn.current);Cn.current=S.length,p({type:"APPLY_RESOLUTIONS",payload:{resolutions:P}})},[f.incrementalResolutions,p]),At(()=>{f.incrementalResolutions.length===0&&(Cn.current=0)},[f.incrementalResolutions.length]);let Jo=Gt(async()=>{let S=b.current;if(!S)return!1;let P=await Nr(document.body,S,u.annotations);if(P.length===0)return!1;let ee=await Ol(P,u.annotations,u.styleModifications);return ee&&p({type:"MARK_CAPTURED"}),ee},[u.annotations,u.styleModifications,p]),io=Gt((S,P)=>{let ee=M.current.get(S)||[];M.current.set(S,[...ee,...P])},[]),so=Gt(async()=>{let S=b.current;if(!S)return!1;let P=u.annotations.filter(Qe=>(Qe.status??"pending")==="pending"),ee=u.styleModifications.filter(Qe=>!Qe.captured&&(!Qe.pathname||Qe.pathname===R)),ie=u.spacingTokenChanges.filter(Qe=>!Qe.captured);if(P.length===0&&ee.length===0&&ie.length===0)return!1;let Se=new Map;for(let Qe of P){let nn=Qe.pathname||R;Se.has(nn)||Se.set(nn,[]),Se.get(nn).push(Qe)}let Ce=new Map,Fe=[...Se.keys()].filter(Qe=>Qe!==R);if(Fe.length>0){let Qe=R,nn={x:window.scrollX,y:window.scrollY};E.current=!0;for(let fn of Fe)try{console.log(`[Popmelt] Navigating to ${fn} for screenshot capture`),await Sd(fn,r),window.location.pathname!==fn&&console.warn(`[Popmelt] Navigation to ${fn} did not take effect (at ${window.location.pathname})`);let y=Se.get(fn)||[],x=await Nr(document.body,S,y,{dpr:1}),O=await li(x);O&&(Ce.set(fn,O),console.log(`[Popmelt] Captured ${fn} (${(O.size/1024).toFixed(0)}KB)`))}catch(y){console.warn(`[Popmelt] Failed to capture ${fn}:`,y)}await Sd(Qe,r),window.scrollTo(nn.x,nn.y),E.current=!1}let he=P.filter(Qe=>(Qe.pathname||R)===R),Ne=await Nr(document.body,S,he.length>0?u.annotations:[],{dpr:1});if(Ne.length>0){let Qe=await li(Ne);Qe&&Ce.set(R,Qe)}if(Ce.size===0)return!1;let dn=_s(P,ee,void 0,ie.length>0?ie:void 0),pt=JSON.stringify(dn),wt=new Map;for(let Qe of P){let nn=M.current.get(Qe.id);if(nn&&nn.length>0&&wt.set(Qe.id,nn),Qe.groupId){for(let fn of P)if(fn.groupId===Qe.groupId&&fn.id!==Qe.id){let y=M.current.get(fn.id);y&&y.length>0&&wt.set(fn.id,y)}}}let lo=Se.size>1;console.log(`[Popmelt] Submit: ${Se.size} page(s), ${Ce.size} screenshot(s), pages: [${[...Se.keys()].join(", ")}], cached: [${[...L.current.keys()].join(", ")}]`);let rr=lo?Ce:Ce.get(R)??Ce,ir=P.map(Qe=>Qe.id),Ci=ee.map(Qe=>Qe.selector),Ei=Array.from(new Set([...P.map(Qe=>Qe.pathname||R),...ee.map(Qe=>Qe.pathname||R)])),ys=Ds(u.activeColor),Xo=`_pending_${Date.now()}`,Mr={annotationIds:ir,styleSelectors:Ci,color:u.activeColor,threadId:void 0,routePathnames:Ei};try{let Qe=JSON.parse(localStorage.getItem(dt)||"{}");Qe[Xo]=Mr,localStorage.setItem(dt,JSON.stringify(Qe))}catch{}tn(Qe=>({...Qe,[Xo]:Mr}));try{let{jobId:Qe,threadId:nn}=await Ja(rr,pt,w,ys,v,re.id,wt.size>0?wt:void 0,Ai());for(let h of wt.keys())M.current.delete(h);for(let h of Se.keys())L.current.delete(h);let fn={...Mr,threadId:nn};try{let h=JSON.parse(localStorage.getItem(dt)||"{}");delete h[Xo],h[Qe]=fn,localStorage.setItem(dt,JSON.stringify(h))}catch{}tn(h=>{let{[Xo]:k,...I}=h;return{...I,[Qe]:fn}}),p({type:"MARK_CAPTURED"}),nn&&ir.length>0&&p({type:"SET_ANNOTATION_THREAD",payload:{ids:ir,threadId:nn}});let y=u.activeColor.match(/oklch\([^)]*\s+([\d.]+)\s*\)/),O=((y?.[1]?parseFloat(y[1]):29)+60)%360;return p({type:"SET_COLOR",payload:`oklch(0.628 0.258 ${O})`}),!0}catch(Qe){try{let nn=JSON.parse(localStorage.getItem(dt)||"{}");delete nn[Xo],localStorage.setItem(dt,JSON.stringify(nn))}catch{}return tn(nn=>{let{[Xo]:fn,...y}=nn;return y}),console.error("[Pare] Failed to send to bridge:",Qe),!1}},[u.annotations,u.styleModifications,u.spacingTokenChanges,u.activeColor,p,w,v,re.id,R,r]),qn=Gt(async()=>{if(Xe){bt(Xe);return}try{let{jobId:S,threadId:P}=await Qa(w,v,re.id);Yt(S),Et(P);let ee={annotationIds:[],styleSelectors:[],color:"#6b7280",threadId:P,kind:"synthesize",global:!0};tn(ie=>({...ie,[S]:ee})),bt(P)}catch(S){console.error("[Popmelt] Failed to start synthesize:",S)}},[w,v,re.id,Xe]),Zt=Gt(async()=>{Sn(null),ln(null),bt(null);try{let{jobId:S,threadId:P}=await el(w,v,re.id);Sn(S),ln(P);let ee={annotationIds:[],styleSelectors:[],color:Qr,threadId:P,kind:"synthesize_evals",global:!0};tn(ie=>({...ie,[S]:ee})),bt(P)}catch(S){console.error("[Popmelt] Failed to start eval synthesis:",S)}},[w,v,re.id]),Ao=Gt(async S=>{let P=b.current;if(P){fe(ee=>({...ee,[S.id]:"_pending_"}));try{let ie=(await Nr(document.body,P,[],{dpr:1}))[0];if(!ie){fe(Fe=>{let{[S.id]:he,...Ne}=Fe;return Ne});return}let{jobId:Se,threadId:Ce}=await qa(S.id,ie,{url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},scrollX:window.scrollX,scrollY:window.scrollY},w,v,re.id,Ai());if(fe(Fe=>({...Fe,[S.id]:Se})),Ce){rt(he=>new Set(he).add(Ce));let Fe={annotationIds:[],styleSelectors:[],color:Qr,threadId:Ce,kind:"run_eval",global:!0};tn(he=>({...he,[Se]:Fe})),bt(Ce)}}catch(ee){fe(ie=>{let{[S.id]:Se,...Ce}=ie;return Ce}),console.error("[Popmelt] Failed to run eval:",ee)}}},[w,v,re.id]),Vo=Gt(async(S,P,ee)=>{let ie=Object.values(Ze.current).find(Ne=>Ne.threadId===S)?.color??u.annotations.find(Ne=>Ne.threadId===S)?.color??u.activeColor,Se=u.annotations.filter(Ne=>Ne.threadId===S&&(Ne.status==="waiting_input"||Ne.status==="resolved"||Ne.status==="needs_review")),Ce=Se.map(Ne=>Ne.id),Fe=`_pending_reply_${Date.now()}`,he={annotationIds:Ce,styleSelectors:[],color:ie,threadId:S};try{let Ne=JSON.parse(localStorage.getItem(dt)||"{}");Ne[Fe]=he,localStorage.setItem(dt,JSON.stringify(Ne))}catch{}tn(Ne=>({...Ne,[Fe]:he}));try{let Ne=Ds(u.activeColor),{jobId:dn}=await tl(S,P,w,Ne,v,re.id,ee,Ai()),pt={...he};try{let wt=JSON.parse(localStorage.getItem(dt)||"{}");delete wt[Fe],wt[dn]=pt,localStorage.setItem(dt,JSON.stringify(wt))}catch{}return tn(wt=>{let{[Fe]:lo,...rr}=wt;return{...rr,[dn]:pt}}),Se.length>0&&p({type:"SET_ANNOTATION_STATUS",payload:{ids:Ce,status:"in_flight"}}),f.dismissQuestion(S),{jobId:dn}}catch(Ne){try{let dn=JSON.parse(localStorage.getItem(dt)||"{}");delete dn[Fe],localStorage.setItem(dt,JSON.stringify(dn))}catch{}tn(dn=>{let{[Fe]:pt,...wt}=dn;return wt}),console.error("[Pare] Failed to send reply:",Ne)}},[u.activeColor,u.annotations,w,f.dismissQuestion,p,v,re.id]),Lo=en(new Set);At(()=>{for(let S of f.pendingQuestions){if(Lo.current.has(S.jobId))continue;Lo.current.add(S.jobId);let P=S.annotationIds&&S.annotationIds.length>0?S.annotationIds:void 0;!P&&S.threadId&&(P=u.annotations.filter(ee=>ee.threadId===S.threadId).map(ee=>ee.id)),P&&P.length>0&&p({type:"SET_ANNOTATION_QUESTION",payload:{ids:P,question:S.question,threadId:S.threadId}})}},[f.pendingQuestions,p,u.annotations]);let Ir=mo(()=>{if(f.activeJobId&&f.activeJobId in Re)return Re[f.activeJobId].color;let S=Object.values(Re);return S.length>0?S[S.length-1].color:void 0},[f.activeJobId,Re]),Po=Gt(S=>{bt(S)},[]),Yo=Gt(S=>{rt(P=>new Set(P).add(S)),Y.current=Qr,bt(S)},[]),B=Gt((S,P)=>{let ee=Re[S],ie=Gn.current.get(S);if(ee){let Ce=new Set(ee.styleSelectors);for(let Fe of ee.annotationIds){let he=u.annotations.find(Ne=>Ne.id===Fe);if(he&&(he.linkedSelector&&Ce.add(he.linkedSelector),he.groupId))for(let Ne of u.annotations)Ne.groupId===he.groupId&&Ne.linkedSelector&&Ce.add(Ne.linkedSelector)}Ce.size>0&&(ie=Array.from(Ce))}ie?.length&&Sh(ie);let Se=ee?.threadId||P||zt.current.get(S);Se&&(Y.current=ee?.kind==="synthesize_evals"||ee?.kind==="run_eval"||ee?.kind==="materialize_model"?Qr:ee?.color??null,bt(Se))},[Re,u.annotations]),W=Gt(S=>{if(!S){cn(null);return}let P=qt.current.get(S);P&&P.length>0?cn(new Set(P)):cn(null)},[]),ne=Gt(async S=>{try{let P=S?`${w}/cancel?jobId=${S}`:`${w}/cancel`;await Qn(P,{method:"POST"})}catch{}},[w]),ae=Gt(async()=>{_("restarting"),ye("Restarting bridge");let S=await Ss(w,ji,2e4);if(S.ok){await ll(S.bridgeUrl??n,d),Te(S.status.version??ji),_("ok"),ye(S.status.version?`Bridge restarted on ${S.status.version}`:"Bridge restarted"),me(P=>P+1);return}Te(S.status?.version??Ee),_("error"),ye(S.error)},[Ee,n,d,w]),le=mo(()=>{if(!He)return null;for(let S of Object.values(Re))if(S.threadId===He&&S.kind)return S.kind;return He===Xe?"synthesize":He===Rn?"synthesize_evals":Ie.has(He)?"run_eval":null},[He,Re,Xe,Rn,Ie]),ge=le==="synthesize_evals"||le==="run_eval",Ae=le==="materialize_model",xe=le==="synthesize";At(()=>{(u.activeTool==="model"&&He&&!xe||u.activeTool==="eval"&&He&&!ge)&&bt(null)},[u.activeTool,He,xe,ge]);let Jt=Gt(()=>{p({type:"SET_TOOL",payload:"eval"}),q(S=>S+1),bt(null)},[p]),Dt=en(null);At(()=>{u.isAnnotating?Dt.current&&(bt(Dt.current),Dt.current=null):He&&(Dt.current=He,bt(null))},[u.isAnnotating]);let mt=mo(()=>{if(!He)return null;for(let[S,P]of Object.entries(Re))if(P.threadId===He)return S;for(let[S,P]of Object.entries(f.activeJobThreads))if(P===He)return S;return null},[He,Re,f.activeJobThreads]),Ft=He?u.annotations.find(S=>S.threadId===He):void 0,at=mo(()=>mt?f.events.filter(S=>S.data.jobId===mt):vh,[mt,f.events.length]),En=mo(()=>ge||Ae?Qr:Ft?.color??Y.current??u.activeColor,[ge,Ae,Ft?.color,u.activeColor]),Pn=Ft?u.annotations.indexOf(Ft)+1:void 0;At(()=>{if(ge)return;let S=Ft?.color??Y.current;He&&S&&p({type:"SET_COLOR",payload:S})},[He,ge]);let[pn,kn]=Ct(!1),[Uo,Bo]=Ct(0),Zn=en(null),ti=Gt(S=>{S?(Zn.current&&(clearTimeout(Zn.current),Zn.current=null),kn(!0)):Zn.current=setTimeout(()=>{kn(!1),Zn.current=null},150)},[]),wi=Gt(()=>{Bo(S=>S+1),f.clearEvents(),bt(null),qe(new Set),ne()},[f.clearEvents,ne]);At(()=>()=>{Zn.current&&clearTimeout(Zn.current)},[]);let[Ko,ao]=Ct(!1);At(()=>{ao(!0)},[]);let ni=mo(()=>({isEnabled:t}),[t]);return!t||!Ko?ei($a.Provider,{value:ni,children:e}):wd($a.Provider,{value:ni,children:[e,ei(kc,{state:u,dispatch:p,onScreenshot:Jo,inFlightAnnotationIds:nr,activeAnnotationIds:Ro,queuePositionMap:Wo,inFlightStyleSelectors:or,inFlightSelectorColors:yn,onAttachImages:io,onReply:f.isConnected?Vo:void 0,onViewThread:f.isConnected?Po:void 0,onCloseThread:S=>{bt(null),S&&qe(P=>new Set(P).add(S))},onModelComponentsAdd:f.isConnected?lt:void 0,onModelComponentFocus:f.isConnected?Je:void 0,onModelComponentHover:te,modelComponentNames:we,modelPanelHoveredComponent:Oe,modelSpacingTokenHover:Pe,highlightedAnnotationIds:kt,focusedThreadAnnotationId:Ft?.id,externalCanvasRef:b,toolbarRef:C}),ei(dd,{children:wd(ld,{children:[ei(nd,{state:u,dispatch:p,onScreenshot:Jo,onSendToClaude:f.isConnected?so:void 0,hasActiveJobs:Object.keys(Re).length>0||f.activeJobIds.length>0,activeJobColor:Ir,onCrosshairHover:ti,onClear:wi,provider:v,onProviderChange:f.isConnected&&T.length>1?Ke:void 0,availableProviders:T,modelIndex:j,modelCount:Ye.length,modelLabel:re.label,onModelChange:f.isConnected?Ge:void 0,onViewThread:f.isConnected?Po:void 0,isThreadPanelOpen:He!==null&&!xe&&!ge,mcpStatus:ke,bridgeUrl:w,isBridgeConnected:f.isConnected,packageVersion:ji,bridgeVersion:Ee,bridgeRestartState:X,bridgeRestartMessage:oe,onBridgeRestart:ae,modelSelectedComponent:ut,modelCanvasHoveredComponent:ce,onModelComponentHover:st,onSpacingTokenHover:nt,onModifySpacingToken:f.isConnected?Ht:void 0,onDeleteSpacingToken:f.isConnected?tt:void 0,modelRefreshKey:ct,onModelComponentAdded:yt,onModelComponentRemoved:Xt,onSynthesizeRules:f.isConnected&&v!=="copilot"?qn:void 0,isSynthesizing:Ve!==null,onSynthesizeEvals:f.isConnected&&v!=="copilot"?Zt:void 0,isSynthesizingEvals:Wn!==null,onRunEval:f.isConnected&&v!=="copilot"?Ao:void 0,onViewEvalRunThread:Yo,runningEvalIds:Object.keys(se),evalRefreshKey:Nt,toolbarRef:C,snapPosition:jn,onSnapPositionChange:An}),He&&ei(xd,{threadId:He,bridgeUrl:w,accentColor:En,isStreaming:mt!==null,isQueued:mt!==null&&!f.activeJobIds.includes(mt),queuePosition:mt&&!f.activeJobIds.includes(mt)?(()=>{let S=new Set(f.activeJobIds),P=Object.keys(Re).filter(ie=>!S.has(ie)),ee=P.indexOf(mt);return ee>=0?`(${ee+1}/${P.length})`:void 0})():void 0,activeJobId:mt,streamingEvents:at,onClose:()=>bt(null),onReply:Vo,onCancel:mt?()=>ne(mt):void 0,lastError:f.lastErrorByJob?.[mt??""]??(f.lastCompletedJobId&&zt.current.get(f.lastCompletedJobId)===He?f.lastErrorByJob?.[f.lastCompletedJobId]:void 0),toolbarRef:C,currentModel:re.id,currentProvider:v,annotationNumber:Pn,annotationText:Ft?.text,onOpenEvals:Jt,preferredSide:ge||Ae?"left":"right",modal:!ge&&!Ae},`${He}:${ge||Ae?"workflow":"default"}`),ei(ad,{bridge:f,bridgeUrl:w,inFlightJobs:Re,isVisible:pn||f.lastResponseText!==null||f.activeJobIds.length>0,onHover:ti,clearSignal:Uo,onReply:Vo,onViewThread:Po,onClickJob:B,onCancel:ne,onHoverJob:W,isConnected:f.isConnected,dismissedThreadIds:Me,snapPosition:jn,currentPathname:R})]})})]})}function Th(){let e=bh($a);if(!e)throw new Error("usePopmelt must be used within PopmeltProvider");return e}export{kh as PopmeltProvider,Th as usePopmelt};
|