use-chisel 0.1.2 → 0.1.4

package/README.md

@@ -44,8 +44,27 @@ Supports Next.js 14 through 16 with React 18 or 19, including both App Router an
 npm install use-chisel
 ```
 
-Run `npx chisel` to open the hosted Chisel sign-in page. Connecting your project
-to the hosted workspace is not available yet.
+Run `npx chisel` from a Next.js App Router project to sign in and connect it to
+hosted Chisel. The command adds a `/chisel` route and a preview component to the
+app layout, and saves the project's public ID in `.chisel.json`. It does not
+overwrite an existing `/chisel` route. Restart your development server and open
+`/chisel` to sign in and review the site. Shared comments are stored by Chisel's
+hosted service; project credentials and Supabase service keys are not required
+in the client project. The hosted workspace currently supports text comments,
+replies, resolution, and review links; rich text, attachments, presence, and
+unread indicators are not yet available there.
+
+The generated route defaults off in production. To use it on a deployed review
+site, set `CHISEL_ENABLED=1` for that deployment and redeploy. Hosted connections
+require HTTPS, except on localhost. Automatic setup currently requires an App
+Router layout containing a single `</body>` tag.
+
+Run `npx chisel enable` or `npx chisel disable` in your project to update its
+local `.env.local` settings. Restart the development server afterwards. These
+commands do not change deployed environments: configure the deployment and
+redeploy separately. Environment variables already set by the shell take precedence
+over `.env.local`. A host-provided workspace route must also check the
+server-side `CHISEL_ENABLED` setting, as the demo does.
 
 ## Use
 

package/bin/chisel.js

@@ -1,10 +1,110 @@
 #!/usr/bin/env node
 import { spawn } from "node:child_process";
+import { existsSync, mkdirSync, readFileSync, unlinkSync, writeFileSync } from "node:fs";
+import { randomBytes, randomUUID } from "node:crypto";
+import { createServer } from "node:http";
+import { join } from "node:path";
 
-const url = "https://chisel-review.vercel.app/chisel/start";
-console.log(`Open ${url} to sign in to Chisel.`);
-const command = process.platform === "darwin" ? "open" : process.platform === "win32" ? "rundll32" : "xdg-open";
-const args = process.platform === "win32" ? ["url.dll,FileProtocolHandler", url] : [url];
-const browser = spawn(command, args, { detached: true, stdio: "ignore" });
-browser.on("error", () => console.error("Could not open a browser. Open the link above instead."));
-browser.unref();
+function openBrowser(url) {
+  console.log(`Open ${url} to continue in your browser.`);
+  const command = process.platform === "darwin" ? "open" : process.platform === "win32" ? "rundll32" : "xdg-open";
+  const args = process.platform === "win32" ? ["url.dll,FileProtocolHandler", url] : [url];
+  const browser = spawn(command, args, { detached: true, stdio: "ignore" });
+  browser.on("error", () => console.error("Could not open a browser. Open the link above instead."));
+  browser.unref();
+}
+
+function scaffoldInfo() {
+  const app = ["app", "src/app"].find(dir => existsSync(dir));
+  const layout = app && ["layout.tsx", "layout.jsx", "layout.js"].map(file => join(app, file)).find(existsSync);
+  if (!layout) throw new Error("Chisel currently sets up Next.js App Router projects with an app/layout file.");
+  const source = readFileSync(layout, "utf8");
+  if ((source.match(/<\/body\s*>/g) || []).length !== 1 || source.includes("ChiselConnectedPreview")) throw new Error("Could not safely update the app layout. Add ChiselPreview to the layout and create the /chisel route manually.");
+  const directory = join(app, "chisel");
+  if (["page.tsx", "page.jsx", "page.js"].some(file => existsSync(join(directory, file)))) throw new Error("The /chisel route already exists. Chisel will not overwrite it.");
+  return { layout, source, directory, extension: layout.endsWith(".tsx") ? "tsx" : "jsx" };
+}
+
+function scaffoldProject(info, projectId, configFile) {
+  const closingBody = info.source.match(/<\/body\s*>/)[0];
+  const updated = info.source.replace(closingBody, `<ChiselConnectedPreview />\n      ${closingBody}`);
+  const directive = updated.match(/^\s*["']use client["'];?\s*/)?.[0] || "";
+  const layout = `${directive}import { ChiselPreview as ChiselConnectedPreview } from "use-chisel/workspace";\n${updated.slice(directive.length)}`;
+  const page = `import { notFound } from "next/navigation";\nimport { HostedChisel } from "use-chisel/hosted";\n\nexport default function ChiselPage() {\n  const enabled = process.env.CHISEL_ENABLED === undefined ? process.env.NODE_ENV !== "production" : process.env.CHISEL_ENABLED === "1";\n  if (!enabled) notFound();\n  return <HostedChisel projectId="${projectId}" />;\n}\n`;
+  const pageFile = join(info.directory, `page.${info.extension}`);
+  if (readFileSync(info.layout, "utf8") !== info.source) throw new Error("The layout changed during setup. Run npx chisel again.");
+  mkdirSync(info.directory, { recursive: true });
+  writeFileSync(pageFile, page, { flag: "wx" });
+  let layoutWritten = false;
+  try {
+    writeFileSync(info.layout, layout); layoutWritten = true;
+    writeFileSync(configFile, JSON.stringify({ projectId }, null, 2) + "\n", { flag: "wx", mode: 0o600 });
+  } catch (error) {
+    if (layoutWritten && existsSync(info.layout) && readFileSync(info.layout, "utf8") === layout) writeFileSync(info.layout, info.source);
+    if (existsSync(pageFile) && readFileSync(pageFile, "utf8") === page) unlinkSync(pageFile);
+    throw error;
+  }
+}
+
+const action = process.argv[2];
+if (action === "enable" || action === "disable") {
+  if (!existsSync("package.json")) {
+    console.error("Run this command from your project directory (where package.json is located).");
+    process.exit(1);
+  }
+  const file = join(process.cwd(), ".env.local");
+  try {
+    const content = existsSync(file) ? readFileSync(file, "utf8") : "";
+    const newline = content.includes("\r\n") ? "\r\n" : "\n";
+    const remaining = content.replace(/# Chisel local settings\r?\nCHISEL_ENABLED=[01]\r?\nNEXT_PUBLIC_CHISEL_ENABLED=[01]\r?\n?$/, "");
+    const value = action === "enable" ? "1" : "0";
+    const separator = remaining && !remaining.endsWith("\n") ? newline : "";
+    writeFileSync(file, `${remaining}${separator}# Chisel local settings${newline}CHISEL_ENABLED=${value}${newline}NEXT_PUBLIC_CHISEL_ENABLED=${value}${newline}`, { mode: 0o600 });
+    console.log(`Chisel ${action === "enable" ? "enabled" : "disabled"} in .env.local. Restart your development server to apply the change.`);
+    console.log("This only changes local settings; deployed sites require their own environment settings and redeployment.");
+  } catch (error) {
+    console.error(`Could not update .env.local: ${error.message}`);
+    process.exitCode = 1;
+  }
+} else if (action) {
+  console.error("Usage: npx chisel [enable|disable]");
+  process.exitCode = 1;
+} else {
+  const configFile = join(process.cwd(), ".chisel.json");
+  if (!existsSync("package.json")) {
+    openBrowser("https://chisel-review.vercel.app/chisel/start");
+  } else if (existsSync(configFile)) {
+    console.log("This project is already connected. Start your development server and open /chisel.");
+  } else {
+    let name, info;
+    try { name = JSON.parse(readFileSync("package.json", "utf8")).name || "My project"; }
+    catch { console.error("Could not read this project's package.json."); process.exit(1); }
+    try { info = scaffoldInfo(); }
+    catch (error) { console.error(error.message); process.exit(1); }
+    if (typeof name !== "string" || !name.trim()) name = "My project";
+    const state = randomBytes(32).toString("hex"), requestId = randomUUID();
+    const server = createServer((request, response) => {
+      let url;
+      try { url = new URL(request.url || "/", "http://127.0.0.1"); }
+      catch { response.writeHead(400).end("Invalid connection request."); return; }
+      const project = url.searchParams.get("project");
+      if (request.method !== "GET" || url.pathname !== "/" || url.searchParams.get("state") !== state || !project || !/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/.test(project)) {
+        response.writeHead(400).end("Invalid connection request."); return;
+      }
+      try { scaffoldProject(info, project, configFile); }
+      catch (error) { console.error(`Could not finish project setup: ${error.message}`); response.writeHead(500).end("Could not finish project setup. Return to your terminal."); return; }
+      response.writeHead(200, { "Content-Type": "text/plain", "Cache-Control": "no-store" }).end("Project connected. You can return to your terminal.");
+      console.log("Project connected. Start your development server and open /chisel.");
+      clearTimeout(timeout); server.close();
+    });
+    server.on("error", () => { console.error("Could not start the local connection listener."); process.exitCode = 1; });
+    server.listen(0, "127.0.0.1", () => {
+      const url = new URL("https://chisel-review.vercel.app/chisel/start");
+      url.search = new URLSearchParams({ state, port: String(server.address().port), request: requestId, name: name.trim().slice(0, 120) }).toString();
+      openBrowser(url.toString());
+      console.log("Waiting for project confirmation. Press Ctrl+C to cancel.");
+    });
+    const timeout = setTimeout(() => { console.error("Project connection timed out. Run npx chisel again to retry."); server.close(); process.exitCode = 1; }, 300000);
+    timeout.unref();
+  }
+}

package/dist/hosted-entry.d.ts

@@ -0,0 +1,3 @@
+export declare function HostedChisel({ projectId }: {
+    projectId: string;
+}): import("react").JSX.Element;

package/dist/hosted-entry.js

@@ -0,0 +1 @@
+"use client";import{jsx as i,jsxs as l,Fragment as L}from"react/jsx-runtime";import{useCallback as R,useEffect as b,useMemo as j,useRef as w,useState as f}from"react";import{ChiselWorkspace as I,ChiselWorkspaceStyles as E}from"use-chisel/workspace";var u="https://chisel-review.vercel.app";function N({projectId:h}){let a=`chisel:session:${h}`,r=w(""),[c,C]=f(null),[P,d]=f(!0),[v,p]=f(""),[x,y]=f(!1),S=w(null);S.current=c;let m=w(null),g=w(""),o=R(async(t,e)=>{let n=await fetch(`${u}/chisel/api/hosted/comments`,{method:t,headers:{Authorization:`Bearer ${r.current}`,...e?{"Content-Type":"application/json","X-Chisel-Protocol":"2"}:{}},...e?{body:JSON.stringify(e)}:{}}),s=await n.json();if(!n.ok)throw n.status===401&&S.current&&y(!0),Object.assign(new Error(s.error||"Chisel is unavailable. Please try again."),{status:n.status});if(s.siteId&&s.siteId!==h)throw new Error("This session belongs to another project.");return s},[h]),T=j(()=>({async list(){return(await o("GET")).comments},async mutate(t){return(await o("POST",t)).comment},async delete(t){await o("POST",{type:"delete",id:t})}}),[o]);b(()=>{if(r.current=sessionStorage.getItem(a)||"",!r.current){d(!1);return}let t=!0;return o("GET").then(e=>{t&&C(e)}).catch(()=>{t&&(r.current="",sessionStorage.removeItem(a))}).finally(()=>{t&&d(!1)}),()=>{t=!1}},[a,o]),b(()=>{let t=e=>{e.origin!==u||e.source!==m.current||e.data?.type!=="chisel:session"||e.data.state!==g.current||!/^[0-9a-f]{64}$/.test(e.data.token)||(r.current=e.data.token,sessionStorage.setItem(a,r.current),g.current="",m.current=null,S.current||d(!0),p(""),o("GET").then(n=>{C(n),y(!1);let s=new URL(window.location.href);s.searchParams.delete("invite"),window.history.replaceState(window.history.state,"",s)}).catch(n=>{r.current="",sessionStorage.removeItem(a),p(n instanceof Error?n.message:"Could not connect to Chisel.")}).finally(()=>d(!1)))};return window.addEventListener("message",t),()=>window.removeEventListener("message",t)},[a,o]);function k(){let t=crypto.getRandomValues(new Uint8Array(32));g.current=Array.from(t,s=>s.toString(16).padStart(2,"0")).join("");let e=new URL("/chisel/connect",u);e.searchParams.set("site",h),e.searchParams.set("origin",window.location.origin),e.searchParams.set("state",g.current);let n=new URLSearchParams(window.location.search).get("invite");n&&e.searchParams.set("invite",n),m.current=window.open(e.toString(),"chisel-sign-in","popup,width=520,height=700"),m.current||p("Allow pop-ups for this site, then try again.")}return P?l("main",{className:"chisel-sign-in",children:[i(E,{}),i("section",{children:i("p",{children:"Connecting to Chisel\u2026"})})]}):c?l(L,{children:[i(I,{user:c.user,commentStore:T,canManageComments:c.role==="owner",getReviewLink:c.role==="owner"?async(t=!1)=>{let e=await fetch(`${u}/chisel/api/hosted/invite`,{method:"POST",headers:{Authorization:`Bearer ${r.current}`,"Content-Type":"application/json","X-Chisel-Protocol":"2"},body:JSON.stringify({rotate:t})}),n=await e.json();if(e.status===401&&y(!0),!e.ok||typeof n.invite!="string")throw new Error(n.error||"Could not create a review link.");let s=new URL("/chisel",window.location.origin);return s.searchParams.set("mode","comment"),s.searchParams.set("invite",n.invite),s.toString()}:void 0,validateSession:async()=>!!r.current,signOut:async()=>{let t=await fetch(`${u}/chisel/api/hosted/logout`,{method:"DELETE",headers:{Authorization:`Bearer ${r.current}`,"X-Chisel-Protocol":"2"}});if(!t.ok&&t.status!==401)throw new Error("Sign out failed.");r.current="",sessionStorage.removeItem(a)}}),x&&l("div",{role:"alert",style:{position:"fixed",bottom:16,right:16,zIndex:999999,background:"white",color:"black",padding:12,borderRadius:8,boxShadow:"0 2px 12px #0003"},children:["Your Chisel session expired. ",i("button",{type:"button",onClick:k,children:"Sign in again"})]})]}):l("main",{className:"chisel-sign-in",children:[i(E,{}),l("section",{children:[i("strong",{className:"chisel-sign-in-brand",children:"chisel"}),i("h1",{children:"Sign in to review"}),i("p",{children:"Connect this website to your Chisel account."}),i("button",{onClick:k,children:"Continue with Chisel"}),v&&i("p",{role:"alert",children:v})]})]})}export{N as HostedChisel};

package/dist/index.js

@@ -6,7 +6,7 @@
 
 .chisel-root,.feedback-shell,.chisel-sign-in,.chisel-color-picker,.comment-box{--chisel-ui-font:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--chisel-ui-space:4px;--chisel-ui-control:40px;--chisel-ui-radius:8px;--chisel-ui-text-size:13px;--chisel-ui-small:12px;--chisel-ui-motion:120ms cubic-bezier(.2,0,0,1);--chisel-ui-popover-shadow:0 2px 6px #0000000f,0 12px 36px #0000001f;}
 @media(prefers-color-scheme:dark){.chisel-root,.feedback-shell,.chisel-sign-in,.chisel-color-picker,.comment-box{--chisel-ui-popover-shadow:0 0 0 1px #ffffff0d,0 4px 12px #0003,0 16px 40px #0004;}}
-`;function ca(e,a){return{schemaVersion:1,activeVersionId:e.some(o=>o.id===a)?a:e[0]?.id??a,versions:e}}function Xa(e){if(e===null)return{migrated:!1};let a;try{a=JSON.parse(e)}catch{return{migrated:!1,warning:"Saved edits could not be read. Edits will be kept for this session."}}if(Array.isArray(a)){let t=a.filter(Ka);return a.length>0&&t.length===0?{migrated:!1,warning:"Saved edits are malformed. Edits will be kept for this session."}:{envelope:ca(t,t[0]?.id??"version-1"),migrated:t.length===a.length,warning:t.length<a.length?"Some malformed saved versions were skipped. Recovered edits will be kept for this session until you make a change.":void 0}}return Mt(a)?{envelope:a,migrated:!1}:{migrated:!1,warning:"Saved edits use an unsupported or malformed format. Edits will be kept for this session."}}function Mt(e){return!ve(e)||e.schemaVersion!==1||typeof e.activeVersionId!="string"||!Array.isArray(e.versions)||!e.versions.every(Ka)?!1:e.versions.length===0||e.versions.some(a=>a.id===e.activeVersionId)}function Ka(e){return!ve(e)||typeof e.id!="string"||typeof e.name!="string"||!ve(e.elements)?!1:Object.values(e.elements).every(Dt)}function Dt(e){return!(!ve(e)||typeof e.selector!="string"||!ve(e.styles)||e.sourceHint!==void 0&&typeof e.sourceHint!="string"||e.text!==void 0&&typeof e.text!="string"||!Object.values(e.styles).every(a=>typeof a=="string")||e.asset!==void 0&&!Tt(e.asset))}function Tt(e){return ve(e)&&typeof e.fileName=="string"&&typeof e.mimeType=="string"&&typeof e.size=="number"&&Number.isFinite(e.size)&&e.size>=0}function ve(e){return!!e&&typeof e=="object"&&!Array.isArray(e)}var qt=["px","rem","em"],Ut=[{label:"Inter",value:'Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif'},{label:"System",value:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif'},{label:"Arial",value:"Arial, Helvetica, sans-serif"},{label:"Georgia",value:'Georgia, "Times New Roman", serif'},{label:"Mono",value:"ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace"}],Ot=["Hex","RGB","RGBA","HSL"],Ht=["Solid","Gradient","Image"],Et=[{label:"Font Size",property:"fontSize",cssProperty:"font-size",min:8,max:96,step:1,unit:"px"},{label:"Line",property:"lineHeight",cssProperty:"line-height",min:8,max:120,step:1,unit:"px"},{label:"Tracking",property:"letterSpacing",cssProperty:"letter-spacing",min:-2,max:12,step:.25,unit:"px"},{label:"Padding X",property:"paddingInline",cssProperty:"padding-inline",min:0,max:120,step:1,unit:"px"},{label:"Padding Y",property:"paddingBlock",cssProperty:"padding-block",min:0,max:120,step:1,unit:"px"},{label:"Margin X",property:"marginInline",cssProperty:"margin-inline",min:-80,max:160,step:1,unit:"px"},{label:"Margin Y",property:"marginBlock",cssProperty:"margin-block",min:-80,max:160,step:1,unit:"px"},{label:"Radius",property:"borderRadius",cssProperty:"border-radius",min:0,max:80,step:1,unit:"px"},{label:"Opacity",property:"opacity",cssProperty:"opacity",min:0,max:1,step:.01,unit:""},{label:"Width",property:"width",cssProperty:"width",min:0,max:1200,step:1,unit:"px"},{label:"Height",property:"height",cssProperty:"height",min:0,max:1200,step:1,unit:"px"}],Sa=["color","backgroundColor","backgroundImage","backgroundPosition","backgroundSize","fontFamily","fontSize","lineHeight","letterSpacing","paddingInline","paddingBlock","marginInline","marginBlock","borderRadius","opacity","width","height"],Nt=new Set(["area","audio","base","br","button","canvas","col","embed","hr","iframe","img","input","link","meta","object","param","picture","portal","select","source","textarea","track","video","wbr"]),La="chisel:locationchange",ea=0,la,Ke=!1,$a=0,xa=new Map,Xe=new WeakMap;function Sr({id:e,as:a,children:t,...o}){return u(a??"span",{"data-chisel-id":e,...o,children:t})}function wr({enabled:e=process.env.NODE_ENV!=="production",position:a="right",projectName:t="Next.js app",embedded:o=!1}){let[r,n]=p.useState(null),[i,c]=p.useState(null),[f,g]=p.useState(null),[S,A]=p.useState([]),[M,F]=p.useState(null),[k,P]=p.useState([]),[T,q]=p.useState(!1),[H,ae]=p.useState(""),[v,U]=p.useState(()=>[pa(1)]),[B,W]=p.useState("version-1"),[G,K]=p.useState(!1),[te,E]=p.useState(""),[fe,oe]=p.useState(""),[re,le]=p.useState(!1),[$,ee]=p.useState([]),[m,I]=p.useState(0),[Z,j]=p.useState(""),se=p.useRef(new WeakMap),O=p.useRef(new Map),N=p.useRef(new Map),xe=p.useRef(""),V=p.useRef(null),ne=p.useRef(null),X=p.useRef([]),Je=p.useRef(null),Qe=p.useRef([]),me=p.useRef(null),Ie=p.useRef(null),ye=p.useRef(null),Ue=p.useRef(!1),ge=p.useRef(null),s=p.useRef(null),L=p.useRef(null),b=p.useRef(!0),D=r?new URLSearchParams(r.search).has("editor"):!1,Q=e&&(o||D),ya=r?ut(r.pathname,r.search):"";if(p.useEffect(()=>()=>ha(N.current),[]),p.useEffect(()=>{let l=()=>n(Kt());return l(),$t(l)},[]),p.useEffect(()=>{if(Q){Ue.current=!0;return}if(!Ue.current||(Ue.current=!1,o))return;let l=v.find(d=>d.id===B)??v[0];l&&Qa(l,O.current,N.current),ha(N.current),V.current=null,ne.current=null,X.current=[],c(null),g(null),A([]),F(null),P([]),q(!1)},[B,Q,o,v]),p.useEffect(()=>{if(!Q||!o)return;let l=()=>{let d=document.documentElement?.dataset.chiselSelection,x=d?document.querySelector(d):null;x instanceof HTMLElement&&!Be(x)&&Ye([x])};return window.addEventListener("chisel:select",l),()=>window.removeEventListener("chisel:select",l)},[Q,o]),p.useEffect(()=>{if(!Q){Ke=!1;return}let l=()=>{ge.current===null&&(ge.current=window.requestAnimationFrame(()=>{ge.current=null;let x=V.current,h=X.current;F(C=>x?ie(x.getBoundingClientRect()):C),P(h.map(C=>ie(C.getBoundingClientRect())))}))},d=x=>{let h=x.target;h instanceof HTMLElement&&Be(h)||x.key==="Escape"&&(ne.current=null,X.current=[],g(null),A([]),P([]))};return document.addEventListener("keydown",d),window.addEventListener("resize",l),window.addEventListener("scroll",l,!0),()=>{ge.current!==null&&window.cancelAnimationFrame(ge.current),s.current!==null&&window.cancelAnimationFrame(s.current),document.removeEventListener("keydown",d),window.removeEventListener("resize",l),window.removeEventListener("scroll",l,!0)}},[Q]),p.useEffect(()=>{ne.current=f},[f]),p.useEffect(()=>{X.current=S},[S]),p.useEffect(()=>{if(!S.length)return;let l=null,d=()=>{l===null&&(l=window.requestAnimationFrame(()=>{l=null,P(S.map(h=>ie(h.getBoundingClientRect())))}))};if(typeof ResizeObserver>"u"){let h=window.setInterval(d,750);return()=>{l!==null&&window.cancelAnimationFrame(l),window.clearInterval(h)}}let x=new ResizeObserver(d);for(let h of S)x.observe(h);return()=>{l!==null&&window.cancelAnimationFrame(l),x.disconnect()}},[f,S]),p.useEffect(()=>{if(!Q)return;let l=jt(ya);xe.current=l,oe(""),V.current=null,ne.current=null,X.current=[],c(null),g(null),A([]),F(null),P([]);let d=v.find(_=>_.id===B)??v[0];d&&Qa(d,O.current,N.current),O.current.clear(),ha(N.current);let x=Jt(r?.pathname??window.location.pathname,r?.search??window.location.search),h=Qt(l,x);b.current=!h.warning,E(h.warning??"");let C=h.envelope?.versions.length?h.envelope.versions:[pa(1)],y=h.envelope?.activeVersionId??C[0].id;U(C),W(y),oe(l);let R=C.find(_=>_.id===y)??C[0],z=window.setTimeout(()=>aa(R,C,O.current,N.current),0);if(h.migrated&&h.envelope){let _=Ja(l,C,y);_&&E(_)}return Ke=!1,()=>window.clearTimeout(z)},[ya,Q]),p.useEffect(()=>{if(!Q||!b.current||!xe.current||fe!==xe.current)return;let l=Ja(xe.current,v,B);l&&E(l)},[B,Q,fe,v]),p.useEffect(()=>{if(!Q||typeof MutationObserver>"u"||!document.body)return;let l=null,d=()=>{l=null;let h=v.find(y=>y.id===B)??v[0];h&&aa(h,v,O.current,N.current,!1),V.current&&!V.current.isConnected&&(V.current=null,c(null),F(null));let C=X.current.filter(y=>y.isConnected);if(C.length!==X.current.length){let y=C[C.length-1]??null;X.current=C,ne.current=y,A(C),g(y),P(C.map(R=>ie(R.getBoundingClientRect())))}},x=new MutationObserver(h=>{if(Ke)return;let C=h.some(R=>{let z=R.target instanceof HTMLElement?R.target:R.target.parentElement;return z&&Xe.has(z)?!1:z&&!Be(z)?!0:Array.from(R.addedNodes).some(_=>{let Ba=_ instanceof HTMLElement?_:_.parentElement;return!!(Ba&&!Be(Ba))})}),y=h.some(R=>Array.from(R.removedNodes).some(z=>z instanceof HTMLElement&&((V.current?z===V.current||z.contains(V.current):!1)||X.current.some(_=>z===_||z.contains(_)))));!C&&!y||l===null&&(l=window.requestAnimationFrame(d))});return x.observe(document.body,{attributes:!0,attributeFilter:["style"],characterData:!0,childList:!0,subtree:!0}),()=>{x.disconnect(),l!==null&&window.cancelAnimationFrame(l)}},[B,Q,v]),p.useEffect(()=>{if(!re)return;let l=h=>{let C=Y(h,0,Math.max(0,$.length-1)),y=$[C];I(C),y&&(V.current=y,c(y),F(ie(y.getBoundingClientRect())),j(at(y)))},d=()=>{Ye(Qe.current.filter(h=>h.isConnected)),le(!1),window.requestAnimationFrame(()=>Je.current?.focus())},x=h=>{let C=$[m],y=m;if(h.key==="ArrowDown")y=m+1;else if(h.key==="ArrowUp")y=m-1;else if(h.key==="Home")y=0;else if(h.key==="End")y=$.length-1;else if(h.key==="ArrowRight"&&C){let R=$.find(z=>z.parentElement===C);R&&(y=$.indexOf(R))}else if(h.key==="ArrowLeft"&&C){let R=C.parentElement;for(;R&&!$.includes(R);)R=R.parentElement;R&&(y=$.indexOf(R))}else if(h.key==="Enter"&&C){Ye(h.shiftKey?Ya(X.current,C):[C]),h.shiftKey||le(!1),h.preventDefault();return}else if(h.key==="Escape"){d(),h.preventDefault();return}else return;l(y),h.preventDefault()};return document.addEventListener("keydown",x),()=>document.removeEventListener("keydown",x)},[re,$,m]),p.useEffect(()=>{H&&(me.current?.focus(),me.current?.select())},[H]),p.useEffect(()=>{if(!G)return;let l=h=>{K(!1),h&&window.requestAnimationFrame(()=>ye.current?.focus())},d=h=>{h.target instanceof Node&&Ie.current?.contains(h.target)||l(!0)},x=h=>{h.key==="Escape"&&(l(!0),h.preventDefault())};return document.addEventListener("pointerdown",d,!0),document.addEventListener("keydown",x),()=>{document.removeEventListener("pointerdown",d,!0),document.removeEventListener("keydown",x)}},[G]),!Q)return null;let he=S.length,Oe=f?se.current.get(f):void 0,fa=!!(he<=1&&f&&tt(f)),He=f?De(f):void 0,Pa=f?$e(f):"",ue=v.find(l=>l.id===B)??v[0]??pa(1),_e=he>1?S.flatMap(l=>ao(ue.elements[de(l)])):f&&Oe?eo(f,Oe):[],Ce=f?getComputedStyle(f):null,Ee=l=>he>1&&new Set(S.map(d=>getComputedStyle(d)[l])).size>1,Ne=()=>S.length?S:f?[f]:[];function Ye(l){for(let x of l)Wt(x,se.current);let d=l[l.length-1]??null;if(X.current=l,ne.current=d,A(l),g(d),P(l.map(x=>ie(x.getBoundingClientRect()))),o&&d){let x=d.getBoundingClientRect();window.dispatchEvent(new CustomEvent("chisel:selection",{detail:{selector:$e(d),tag:d.tagName.toLowerCase(),x:x.left+x.width/2+window.scrollX,y:x.top+x.height/2+window.scrollY,offsetX:.5,offsetY:.5}}))}}let Se=()=>{P(S.map(l=>ie(l.getBoundingClientRect())))},Aa=(l,d)=>{let x=document.elementsFromPoint(l,d).find(h=>h instanceof HTMLElement&&!Be(h));return x instanceof HTMLElement?lo(x):null},mt=l=>{L.current={x:l.clientX,y:l.clientY},s.current===null&&(s.current=window.requestAnimationFrame(()=>{s.current=null;let d=L.current;if(!d)return;let x=Aa(d.x,d.y);if(!x){V.current=null,c(null),F(null);return}x!==V.current&&(V.current=x,c(x),F(ie(x.getBoundingClientRect())))}))},ht=l=>{l.preventDefault(),l.stopPropagation();let d=Aa(l.clientX,l.clientY);d&&(le(!1),Ye(l.shiftKey?Ya(X.current,d):[d]))},Lt=()=>{let l=so();Qe.current=X.current,ee(l),I(0),le(!0);let d=l[0];d?(V.current=d,c(d),F(ie(d.getBoundingClientRect())),j(at(d))):j("No visible elements available")},xt=()=>{let l={id:`version-${Date.now()}`,name:`Version ${v.length+1}`,elements:Xt(ue.elements)};ia(d=>[...d,l]),W(l.id),K(!1);for(let[d,x]of Object.entries(ue.elements)){if(!x.asset)continue;let h=N.current.get(be(ue.id,d));h&&N.current.set(be(l.id,d),h)}aa(l,[...v,l],O.current,N.current),Se()},It=l=>{W(l.id),K(!1),aa(l,v,O.current,N.current),Se(),window.requestAnimationFrame(()=>ye.current?.focus())},gt=(l,d)=>{let x=l.unit==="px"?`${d}px`:String(d);va(l,x)},va=(l,d)=>{let x=Ne();if(x.length){for(let h of x)ke(h,de(h),O.current),ce(h),h.style[l.property]=d,we(h,{styles:{[l.property]:d}});Se()}},Fa=(l,d,x)=>{let h=Ne();if(h.length){for(let C of h){let y=de(C);if(ke(C,de(C),O.current),ce(C),l==="backgroundColor"&&ho(d)){if(C.style.backgroundImage=d,d.startsWith("url(")){let R=ga(d),z=be(B,y);x&&R?_t(N.current,z,R):ma(N.current,z),C.style.backgroundPosition="center",C.style.backgroundSize="cover",we(C,{styles:{backgroundImage:x?"":d,backgroundPosition:"center",backgroundSize:"cover"},asset:x??null})}else we(C,{styles:{backgroundImage:d},asset:null});continue}if(C.style[l]=d,l==="backgroundColor"){ma(N.current,be(B,y)),C.style.backgroundImage="",C.style.backgroundPosition="",C.style.backgroundSize="",we(C,{styles:{backgroundColor:d,backgroundImage:"",backgroundPosition:"",backgroundSize:""},asset:null});continue}we(C,{styles:{[l]:d}})}Se()}},Ct=l=>{let d=Ne();if(d.length){for(let x of d)ke(x,de(x),O.current),ce(x),x.style.fontFamily=l,we(x,{styles:{fontFamily:l}});Se()}},St=l=>{let d=Ne();if(d.length)for(let x of d)ke(x,de(x),O.current),ce(x),x.style.fontFamily=l},wt=l=>{!f||!fa||(ke(f,de(f),O.current),ce(f),f.textContent=l,we(f,{text:l}),Se())},kt=()=>{let l=Ne();if(l.length){for(let d of l){let x=se.current.get(d),h=de(d),C=O.current.get(h),y=ue.elements[h];if(y){ce(d);for(let R of Object.keys(y.styles))d.style[R]=C?.styles[R]??"";typeof y.text=="string"&&tt(d)&&(d.textContent=C?.text??x?.text??""),bt(d),y.asset&&ma(N.current,be(B,h))}}Se()}};function we(l,d){let x=de(l);ke(l,x,O.current),ia(h=>h.map(C=>{if(C.id!==B)return C;let y=C.elements[x];return{...C,elements:{...C.elements,[x]:{selector:$e(l),sourceHint:De(l),text:d.text??y?.text,asset:d.asset===null?void 0:d.asset??y?.asset,styles:{...y?.styles??{},...d.styles??{}}}}}}))}function bt(l){let d=de(l),x=v.some(h=>h.id!==B&&!!h.elements[d]);ia(h=>h.map(C=>{if(C.id!==B)return C;let{[d]:y,...R}=C.elements;return{...C,elements:R}})),x||O.current.delete(d)}function ia(l){b.current=!0,U(l)}let yt=async()=>{let l=f?ie(f.getBoundingClientRect()):void 0,d=Object.keys(ue.elements).length?oo({projectName:t,version:ue,baselines:O.current}):f&&Oe&&l?to({projectName:t,element:f,snapshot:Oe,rect:l,selector:Pa,sourceHint:He,changes:_e}):void 0;if(d)try{if(!navigator.clipboard?.writeText)throw new Error("Clipboard unavailable");await navigator.clipboard.writeText(d),ae(""),q(!0),window.setTimeout(()=>q(!1),1600)}catch{q(!1),ae(d)}};return w("div",{"data-chisel-root":"true",className:"chisel-root",children:[u(zt,{}),u("div",{className:"chisel-visually-hidden","aria-live":"polite",children:Z}),u("div",{className:"chisel-inspection-layer","aria-hidden":"true",onPointerMove:mt,onPointerLeave:()=>{L.current=null,s.current!==null&&window.cancelAnimationFrame(s.current),s.current=null,V.current=null,c(null),F(null)},onClick:ht}),M&&i&&!S.includes(i)?u(Za,{rect:M,tone:"hover"}):null,k.map((l,d)=>u(Za,{rect:l,tone:"selected"},`${l.left}-${l.top}-${d}`)),u("aside",{className:`chisel-panel chisel-panel-${a}`,"aria-label":"Chisel editor",children:u("div",{className:"chisel-panel-wrapper",children:u("div",{className:"chisel-panel-inner",children:w("div",{className:"chisel-folder chisel-folder-root",children:[u("header",{className:"chisel-folder-header chisel-panel-header",children:w("div",{className:"chisel-panel-toolbar",children:[u("button",{className:"chisel-toolbar-add",type:"button","aria-label":"Add version",onClick:xt,children:u(Ve,{size:16,strokeWidth:1.75,"aria-hidden":"true"})}),w("div",{className:"chisel-preset-manager",ref:Ie,children:[w("button",{className:"chisel-preset-trigger",type:"button","aria-expanded":G,"aria-haspopup":"listbox",ref:ye,onClick:()=>K(l=>{let d=!l;return d&&window.requestAnimationFrame(()=>Ie.current?.querySelector('[role="option"][aria-selected="true"]')?.focus()),d}),children:[u("span",{className:"chisel-preset-trigger-label",children:ue.name}),u(Ae,{className:"chisel-chevron",size:16,strokeWidth:1.75,"aria-hidden":"true"})]}),G?u("div",{className:"chisel-preset-dropdown",role:"listbox","aria-label":"Page versions",onKeyDown:ka,children:u("div",{className:"chisel-preset-list",children:v.map(l=>w("button",{className:"chisel-preset-item",type:"button",role:"option","aria-selected":l.id===ue.id,"data-active":l.id===ue.id,onClick:()=>It(l),children:[u("span",{className:"chisel-preset-name",children:l.name}),u("span",{className:"chisel-preset-count",children:Object.keys(l.elements).length})]},l.id))})}):null]}),u("button",{className:"chisel-toolbar-add",type:"button",onClick:()=>{ne.current=null,X.current=[],g(null),A([]),P([])},"aria-label":"Clear selection",children:u(ze,{size:16,strokeWidth:1.75,"aria-hidden":"true"})})]})}),te?u("div",{className:"chisel-note-row chisel-warning",role:"alert",children:te}):null,f&&Oe?w("div",{className:"chisel-content",children:[w("div",{className:"chisel-text-control chisel-context-row",children:[u("span",{className:"chisel-text-label",children:he>1?"Selection":"Element"}),u("code",{className:"chisel-text-code",children:he>1?`${he} elements`:f.tagName.toLowerCase()})]}),he===1?w(We,{children:[w("div",{className:"chisel-text-control chisel-context-row chisel-selector-row",children:[u("span",{className:"chisel-text-label",children:"Selector"}),u("code",{className:"chisel-selector",children:Pa})]}),w("div",{className:He?"chisel-text-control chisel-context-row":"chisel-text-control chisel-context-row chisel-warning-row",children:[u("span",{className:"chisel-text-label",children:"Source"}),u("span",{className:He?"chisel-text-value":"chisel-warning",children:He?`Source hint: ${He}`:"Low-confidence source mapping"})]})]}):null,w("div",{className:"chisel-folder",children:[u("div",{className:"chisel-folder-header",children:u("div",{className:"chisel-folder-header-top",children:u("div",{className:"chisel-folder-title-row",children:u("span",{className:"chisel-folder-title",children:"Content"})})})}),u("div",{className:"chisel-folder-content",children:w("div",{className:"chisel-folder-inner",children:[w("label",{className:"chisel-text-control chisel-textarea-control",children:[u("span",{className:"chisel-text-label",children:"Text"}),u("textarea",{className:"chisel-text-input",value:f.textContent??"",onChange:l=>wt(l.target.value),disabled:!fa,rows:3})]}),fa?null:u("div",{className:"chisel-note-row",children:he>1?"Text editing is enabled for one element at a time.":"Text editing is enabled for simple text elements."})]})})]}),w("div",{className:"chisel-folder",children:[u("div",{className:"chisel-folder-header",children:u("div",{className:"chisel-folder-header-top",children:u("div",{className:"chisel-folder-title-row",children:u("span",{className:"chisel-folder-title",children:"Color"})})})}),u("div",{className:"chisel-folder-content",children:w("div",{className:"chisel-folder-inner",children:[u(ja,{label:"Text",value:f.style.color||Me(Ce?.color??"#000000"),onChange:l=>Fa("color",l),mixed:Ee("color")}),u(ja,{label:"Fill",value:f.style.backgroundImage||(Ce?.backgroundImage&&Ce.backgroundImage!=="none"?Ce.backgroundImage:f.style.backgroundColor||Me(Ce?.backgroundColor??"#ffffff")),onChange:(l,d)=>Fa("backgroundColor",l,d),supportsBackgroundImages:!0,unavailableAsset:ue.elements[de(f)]?.asset,mixed:Ee("backgroundColor")||Ee("backgroundImage")})]})})]}),w("div",{className:"chisel-folder",children:[u("div",{className:"chisel-folder-header",children:u("div",{className:"chisel-folder-header-top",children:u("div",{className:"chisel-folder-title-row",children:u("span",{className:"chisel-folder-title",children:"Style"})})})}),u("div",{className:"chisel-folder-content",children:w("div",{className:"chisel-folder-inner",children:[u(Gt,{value:Ce?.fontFamily??"",onChange:Ct,onPreview:St,mixed:Ee("fontFamily")}),Et.map(l=>u(Vt,{control:l,computedStyle:Ce,element:f,mixed:Ee(l.property),onSlide:d=>gt(l,d),onValueChange:d=>va(l,d)},l.cssProperty))]})})]}),w("div",{className:"chisel-folder",children:[u("div",{className:"chisel-folder-header",children:w("div",{className:"chisel-folder-header-top",children:[u("div",{className:"chisel-folder-title-row",children:u("span",{className:"chisel-folder-title",children:"Changes"})}),u("span",{className:"chisel-folder-count",children:_e.length})]})}),u("div",{className:"chisel-folder-content",children:u("div",{className:"chisel-folder-inner",children:_e.length?_e.map((l,d)=>w("div",{className:"chisel-text-control",children:[u("span",{className:"chisel-text-label",children:l.property}),u("strong",{className:"chisel-text-value",children:String(l.after)})]},`${l.property}-${d}`)):u("div",{className:"chisel-note-row",children:"No preview changes yet."})})})]}),w("div",{className:"chisel-actions",children:[u("button",{className:"chisel-button",type:"button",onClick:kt,children:"Reset"}),u("button",{className:"chisel-button chisel-button-primary",type:"button",onClick:yt,children:T?"Copied":"Copy agent prompt"})]}),T?u("div",{className:"chisel-note-row",role:"status",children:"Prompt copied"}):null,H?w("div",{className:"chisel-note-row",role:"alert",children:["Press Cmd+C/Ctrl+C",u("textarea",{ref:me,readOnly:!0,value:H,"aria-label":"Agent prompt copy fallback"})]}):null]}):w("div",{className:"chisel-empty",children:[u("div",{className:"chisel-note-row",children:"Select any visible element to edit its text and style preview."}),u("button",{className:"chisel-button",type:"button",ref:Je,onClick:Lt,"aria-pressed":re,children:"Pick element"})]})]})})})})]})}function Za({rect:e,tone:a}){return u("div",{className:`chisel-box chisel-box-${a}`,style:{transform:`translate3d(${e.left}px, ${e.top}px, 0)`,width:e.width,height:e.height}})}function Gt({value:e,onChange:a,onPreview:t,mixed:o=!1}){let[r,n]=p.useState(!1),i=p.useRef(null),c=p.useRef(null),f=p.useRef(e),g=p.useMemo(()=>io(e),[e]),S=no(e,g),A=o?"Mixed":S?.label??Ze(e)??"Font";p.useEffect(()=>{r||(f.current=e)},[r,e]),p.useEffect(()=>{if(!r)return;let k=T=>{let q=T.target;q instanceof Node&&i.current?.contains(q)||(t(f.current),n(!1),window.requestAnimationFrame(()=>c.current?.focus()))},P=T=>{T.key==="Escape"&&(t(f.current),n(!1),window.requestAnimationFrame(()=>c.current?.focus()))};return document.addEventListener("pointerdown",k,!0),document.addEventListener("keydown",P),()=>{document.removeEventListener("pointerdown",k,!0),document.removeEventListener("keydown",P)}},[r,t]);let M=()=>{if(r){t(f.current),n(!1);return}f.current=e,n(!0),window.requestAnimationFrame(()=>i.current?.querySelector('[role="option"][aria-selected="true"]')?.focus())},F=k=>{f.current=k.value,a(k.value),n(!1),window.requestAnimationFrame(()=>c.current?.focus())};return w("div",{className:"chisel-font-control",ref:i,children:[u("span",{className:"chisel-font-label",children:"Font"}),w("div",{className:"chisel-font-picker",children:[w("button",{className:"chisel-font-trigger",ref:c,type:"button","aria-expanded":r,"aria-haspopup":"listbox",onClick:M,children:[u("span",{className:"chisel-font-trigger-label",children:A}),u(Ae,{className:"chisel-chevron",size:16,strokeWidth:1.75,"aria-hidden":"true"})]}),r?u("div",{className:"chisel-preset-dropdown chisel-font-dropdown",role:"listbox","aria-label":"Font family",onKeyDown:ka,children:u("div",{className:"chisel-preset-list chisel-font-list",children:g.map(k=>u("button",{className:"chisel-preset-item chisel-font-item","data-active":ua(e,k.value),"aria-selected":ua(e,k.value),onClick:()=>F(k),onFocus:()=>t(k.value),onPointerEnter:()=>t(k.value),role:"option",style:{fontFamily:k.value},type:"button",children:u("span",{className:"chisel-preset-name",children:k.label})},k.value))})}):null]})]})}function ja({label:e,value:a,onChange:t,supportsBackgroundImages:o=!1,unavailableAsset:r,mixed:n=!1}){let i=lt(a),c=ga(a),f=o&&i?"Gradient":o&&(c!==void 0||r)?"Image":"Solid",g=i?.start??(c!==void 0?"#FFFFFF":rt(a)),[S,A]=p.useState(f),[M,F]=p.useState(()=>Fe(g)),[k,P]=p.useState(g),[T,q]=p.useState(i?.start??g),[H,ae]=p.useState(i?.end??"#FFFFFF"),[v,U]=p.useState("start"),[B,W]=p.useState(c??""),[G,K]=p.useState(""),[te,E]=p.useState(!1),[fe,oe]=p.useState(!1),re=p.useRef(null),le=p.useRef(null),$=S==="Gradient"?v==="start"?T:H:k,ee=Me($).toUpperCase(),m=mo($),I=p.useMemo(()=>uo(ba(ee)),[ee]),Z=n?"Mixed":S==="Gradient"?"Gradient":S==="Image"?"Image":k;p.useEffect(()=>{let s=lt(a),L=ga(a);if(o&&s){let D=v==="end"?s.end:s.start;A("Gradient"),q(s.start),ae(s.end),P(D),F(Fe(D)),E(!1);return}if(o&&L!==void 0){A("Image"),W(L),P("#FFFFFF"),E(!1);return}if(o&&r){A("Image"),W(""),K(""),E(!1);return}let b=rt(a);A("Solid"),P(D=>D&&Me(D)===Me(b)?D:b),F(Fe(b)),E(!1)},[v,o,r,a]),p.useEffect(()=>{if(!fe)return;let s=b=>{let D=b.target;D instanceof Node&&re.current?.contains(D)||(oe(!1),window.requestAnimationFrame(()=>le.current?.focus()))},L=b=>{b.key==="Escape"&&(oe(!1),window.requestAnimationFrame(()=>le.current?.focus()),b.preventDefault())};return document.addEventListener("pointerdown",s,!0),document.addEventListener("keydown",L),()=>{document.removeEventListener("pointerdown",s,!0),document.removeEventListener("keydown",L)}},[fe]);let j=s=>{let L=ot(s);if(!L){E(s.trim().length>0);return}let b=Te(L)??L;if(F(Fe(b)),P(b),E(!1),S==="Gradient"){Ie(v,b);return}t(b)},se=(s,L=m,b=M)=>{let D=po(s,L,b);if(P(D),E(!1),S==="Gradient"){Ie(v,D);return}t(D)},O=(s,L)=>{let b=Y((s.clientX-L.left)/L.width*100,0,100),D=Y((1-(s.clientY-L.top)/L.height)*100,0,100);se(ta(I.h,b,D))},N=(s,L)=>{let b=Y((s.clientX-L.left)/L.width*360,0,360);se(ta(b,I.s,I.v))},xe=(s,L)=>{let b=Y((s.clientX-L.left)/L.width,0,1);se(ee,b)},V=s=>{if(!ra(s.key))return;let L=s.shiftKey?10:1,b=Y(I.s+(s.key==="ArrowRight"?L:s.key==="ArrowLeft"?-L:0),0,100),D=Y(I.v+(s.key==="ArrowUp"?L:s.key==="ArrowDown"?-L:0),0,100);se(ta(I.h,b,D)),s.preventDefault()},ne=s=>{if(!ra(s.key))return;let L=s.shiftKey?10:1,b=Y(I.h+(Ca(s.key)?L:-L),0,360);se(ta(b,I.s,I.v)),s.preventDefault()},X=s=>{if(!ra(s.key))return;let L=s.shiftKey?.1:.01;se(ee,Y(m+(Ca(s.key)?L:-L),0,1)),s.preventDefault()},Je=s=>{F(s),se(ee,m,s)},Qe=s=>{if(!(s!=="Solid"&&!o)){if(A(s),s==="Solid"&&t(k),s==="Gradient"){let L=T||k;q(L),U("start"),P(L),t(oa(L,H))}s==="Image"&&B.trim()&&t(Re(B))}},me=s=>{let L=s==="start"?T:H;U(s),P(L),F(Fe(L)),E(!1)},Ie=(s,L)=>{let b=s==="start"?L:T,D=s==="end"?L:H;q(b),ae(D),t(oa(b,D))},ye=(s,L)=>{let b=ot(L);if(s==="start"?q(L):ae(L),U(s),P(L),!b){E(L.trim().length>0);return}let D=Te(b)??b;F(Fe(D)),P(D),E(!1),Ie(s,D)},Ue=s=>{W(s),K(""),t(s.trim()?Re(s):"")},ge=s=>{let L=s.currentTarget.files?.[0];if(!L)return;let b=URL.createObjectURL(L);K(L.name),W(b),t(Re(b),{fileName:L.name,mimeType:L.type,size:L.size})};return w("div",{className:"chisel-color-control","data-picker-open":fe,ref:re,children:[u("span",{className:"chisel-color-label",children:e}),w("span",{className:"chisel-color-inputs",children:[u("button",{className:"chisel-color-swatch",ref:le,"aria-expanded":fe,"aria-label":`${e} color picker`,onClick:()=>oe(s=>!s),style:{background:S==="Gradient"?oa(T,H):S==="Image"&&B?Re(B):k},type:"button"}),u("input",{className:"chisel-color-value-input","aria-label":`${e} color value`,autoCapitalize:"off",autoComplete:"off",autoCorrect:"off","data-invalid":te,readOnly:S!=="Solid",spellCheck:!1,style:{width:`${Math.max(7.5,Math.min(Z.length+.5,18))}ch`},value:Z,onBlur:()=>{S==="Solid"&&j(k)},onChange:s=>{if(S!=="Solid")return;let L=s.target.value;P(L),j(L)},onKeyDown:s=>{s.key==="Enter"&&(s.preventDefault(),j(k),s.currentTarget.blur()),s.key==="Escape"&&(s.preventDefault(),P(g),E(!1),oe(!1),s.currentTarget.blur())}})]}),fe?w("div",{className:"chisel-color-popover",role:"dialog","aria-label":`${e} custom color picker`,children:[w("div",{className:"chisel-color-tabs",children:[Ht.map(s=>u("button",{className:"chisel-color-tab","data-active":S===s,"aria-disabled":s!=="Solid"&&!o,onClick:()=>Qe(s),type:"button",children:s},s)),u("button",{className:"chisel-color-close","aria-label":"Close color picker",onClick:()=>oe(!1),type:"button",children:"\xD7"})]}),S!=="Image"?w(We,{children:[S==="Gradient"?w(We,{children:[u("div",{className:"chisel-color-gradient-preview",style:{backgroundImage:oa(T,H)}}),w("div",{className:"chisel-color-stop-buttons",role:"group","aria-label":`${e} gradient endpoints`,children:[w("button",{className:"chisel-color-stop-button","data-active":v==="start","aria-label":`${e} gradient From`,onClick:()=>me("start"),type:"button",children:[u("span",{className:"chisel-color-stop-swatch",style:{background:T}}),u("span",{children:"From"})]}),w("button",{className:"chisel-color-stop-button","data-active":v==="end","aria-label":`${e} gradient To`,onClick:()=>me("end"),type:"button",children:[u("span",{className:"chisel-color-stop-swatch",style:{background:H}}),u("span",{children:"To"})]})]})]}):null,u("div",{className:"chisel-color-field",role:"slider",tabIndex:0,"aria-label":`${e} saturation and brightness`,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":I.s,"aria-valuetext":`Saturation ${I.s}%, brightness ${I.v}%`,onKeyDown:V,onPointerDown:s=>{let L=s.currentTarget.getBoundingClientRect();O(s,L),s.currentTarget.setPointerCapture(s.pointerId)},onPointerMove:s=>{s.buttons&1&&O(s,s.currentTarget.getBoundingClientRect())},style:{backgroundColor:`hsl(${I.h} 100% 50%)`},children:u("span",{className:"chisel-color-field-cursor",style:{left:`clamp(10px, ${I.s}%, calc(100% - 10px))`,top:`clamp(10px, ${100-I.v}%, calc(100% - 10px))`,backgroundColor:ee}})}),u("div",{className:"chisel-color-hue",role:"slider",tabIndex:0,"aria-label":`${e} hue`,"aria-valuemin":0,"aria-valuemax":360,"aria-valuenow":I.h,onKeyDown:ne,onPointerDown:s=>{let L=s.currentTarget.getBoundingClientRect();N(s,L),s.currentTarget.setPointerCapture(s.pointerId)},onPointerMove:s=>{s.buttons&1&&N(s,s.currentTarget.getBoundingClientRect())},children:u("span",{className:"chisel-color-hue-cursor",style:{left:`clamp(8px, ${I.h/360*100}%, calc(100% - 8px))`}})}),w("div",{className:"chisel-color-alpha",role:"slider",tabIndex:0,"aria-label":`${e} alpha`,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":Math.round(m*100),"aria-valuetext":`${Math.round(m*100)}%`,onKeyDown:X,onPointerDown:s=>{let L=s.currentTarget.getBoundingClientRect();xe(s,L),s.currentTarget.setPointerCapture(s.pointerId)},onPointerMove:s=>{s.buttons&1&&xe(s,s.currentTarget.getBoundingClientRect())},style:{"--chisel-alpha-color":ee},children:[u("span",{className:"chisel-color-alpha-fill",style:{width:`${m*100}%`}}),u("span",{className:"chisel-color-alpha-cursor",style:{left:`clamp(12px, ${m*100}%, calc(100% - 12px))`,backgroundColor:ct(ee,m)}})]}),w("div",{className:"chisel-color-format-row",children:[u("select",{className:"chisel-color-format-select","aria-label":`${e} color format`,value:M,onChange:s=>Je(s.target.value),children:Ot.map(s=>u("option",{value:s,children:s},s))}),u("input",{className:"chisel-color-format-input","aria-label":`${e} formatted color value`,autoCapitalize:"off",autoComplete:"off",autoCorrect:"off","data-invalid":te,spellCheck:!1,value:k,onBlur:()=>j(k),onChange:s=>{let L=s.target.value;P(L),j(L)}})]})]}):null,S==="Gradient"?w(We,{children:[w("label",{className:"chisel-color-extra-row",children:[u("span",{children:"From"}),u("input",{"aria-label":`${e} gradient From value`,value:T,onFocus:()=>me("start"),onChange:s=>ye("start",s.target.value)})]}),w("label",{className:"chisel-color-extra-row",children:[u("span",{children:"To"}),u("input",{"aria-label":`${e} gradient To value`,value:H,onFocus:()=>me("end"),onChange:s=>ye("end",s.target.value)})]})]}):null,S==="Image"?w(We,{children:[w("label",{className:"chisel-color-extra-row",children:[u("span",{children:"URL"}),u("input",{"aria-label":`${e} image URL`,value:B,onChange:s=>Ue(s.target.value),placeholder:"https://..."})]}),w("label",{className:"chisel-color-upload-row",children:[u("span",{children:"Upload"}),u("span",{className:"chisel-color-upload-name",children:G||"Choose image"}),u("input",{"aria-label":`${e} image upload`,accept:"image/*",type:"file",onChange:ge})]}),r&&!B.startsWith("blob:")?w("div",{className:"chisel-note-row",role:"status",children:["Re-select this asset: ",r.fileName]}):null]}):null]}):null]})}function Vt({control:e,computedStyle:a,element:t,onSlide:o,onValueChange:r,mixed:n=!1}){let c=(a??getComputedStyle(t))[e.property],f=parseFloat(c),g=e.property==="width"?t.getBoundingClientRect().width:e.property==="height"?t.getBoundingClientRect().height:e.min,S=Number.isFinite(f)?f:g,A=Y(S,e.min,e.max),M=Ao(A,e.min,e.max),F=t.style[e.property],k=n?"Mixed":F||`${pe(S)}${e.unit}`,P=yo(k,e),[T,q]=p.useState(k),[H,ae]=p.useState(!1),[v,U]=p.useState(!1),[B,W]=p.useState(!1),G=p.useRef(null),K=p.useRef(null),te=p.useRef(!1),E=p.useMemo(()=>xo(e),[e]),fe={left:`max(5px, ${M}% - 9px)`,"--chisel-handle-opacity":M<18?"0.18":"1","--chisel-handle-scale":M<18?"0.25":"1"};p.useEffect(()=>{H||(q(k),U(!1))},[k,H]),p.useEffect(()=>{if(!B)return;let m=()=>{W(!1),window.requestAnimationFrame(()=>G.current?.focus())},I=j=>{j.target instanceof Node&&G.current?.parentElement?.contains(j.target)||m()},Z=j=>{j.key==="Escape"&&(m(),j.preventDefault())};return document.addEventListener("pointerdown",I,!0),document.addEventListener("keydown",Z),()=>{document.removeEventListener("pointerdown",I,!0),document.removeEventListener("keydown",Z)}},[B]);let oe=(m=T)=>{let I=da(m,e,t,P);if(!I){U(!0);return}q(I),U(!1),r(I)},re=()=>{G.current?.focus(),G.current?.select()},le=(m,I)=>{let Z=vo(m,I,e);q(`${pe(Z)}${e.unit}`),U(!1),o(Z)},$=()=>{E.length<=1||(W(!0),window.requestAnimationFrame(()=>G.current?.parentElement?.querySelector('[role="option"][aria-selected="true"]')?.focus()))},ee=m=>{let I=Io(T,m,e,t,P);if(!I){U(!0);return}q(I),U(!1),r(I),W(!1),G.current?.focus()};return w("div",{className:"chisel-slider","data-units-open":B,onDoubleClick:m=>{m.preventDefault(),m.stopPropagation(),$()},onClick:()=>{if(te.current){te.current=!1;return}window.setTimeout(re,0)},onMouseUp:()=>{te.current||window.setTimeout(re,0)},onPointerCancel:m=>{K.current?.pointerId===m.pointerId&&(K.current=null)},onPointerDown:m=>{m.preventDefault(),K.current={pointerId:m.pointerId,startX:m.clientX,rect:m.currentTarget.getBoundingClientRect(),dragging:!1},m.currentTarget.setPointerCapture(m.pointerId),window.setTimeout(re,0)},onPointerMove:m=>{let I=K.current;!I||I.pointerId!==m.pointerId||!I.dragging&&Math.abs(m.clientX-I.startX)<4||(I.dragging=!0,G.current?.blur(),m.preventDefault(),le(m.clientX,I.rect))},onPointerUp:m=>{let I=K.current;!I||I.pointerId!==m.pointerId||(I.dragging&&(te.current=!0,window.setTimeout(()=>{te.current=!1},250),le(m.clientX,I.rect)),I.dragging||window.setTimeout(re,0),K.current=null)},children:[u("span",{className:"chisel-slider-label",children:e.label}),u("span",{className:"chisel-slider-hashmarks","aria-hidden":"true",children:Array.from({length:9},(m,I)=>u("span",{className:"chisel-slider-hashmark",style:{left:`${(I+1)*10}%`}},I))}),u("span",{className:"chisel-slider-fill",style:{width:`${M}%`}}),u("span",{className:"chisel-slider-handle",style:fe}),u("input",{type:"range",tabIndex:-1,"aria-hidden":"true",min:e.min,max:e.max,step:e.step,value:A,onChange:m=>o(Number(m.target.value))}),u("input",{ref:G,className:"chisel-slider-value-input","aria-label":`${e.label} value`,autoCapitalize:"off",autoComplete:"off",autoCorrect:"off","data-invalid":v,spellCheck:!1,value:T,onBlur:m=>{oe(),ae(!1),m.relatedTarget instanceof HTMLElement&&m.currentTarget.parentElement?.contains(m.relatedTarget)||W(!1)},onChange:m=>{let I=m.target.value;q(I);let Z=da(I,e,t,P);if(!Z){U(I.trim().length>0);return}U(!1),r(Z),Z!==I&&Lo(I)&&q(Z)},onFocus:m=>{ae(!0),m.currentTarget.select()},onMouseDown:m=>{window.setTimeout(()=>{m.currentTarget.focus(),m.currentTarget.select()},0)},onMouseUp:m=>{window.setTimeout(()=>{m.currentTarget.focus(),m.currentTarget.select()},0)},onDoubleClick:m=>{m.preventDefault(),m.stopPropagation(),$()},onKeyDown:m=>{if(m.key==="Enter"&&(m.preventDefault(),oe(),m.currentTarget.blur()),ra(m.key)){let I=Po(T,e,t,P,m.shiftKey?10:1,Ca(m.key));if(!I)return;m.preventDefault(),q(I),U(!1),r(I)}m.key==="Escape"&&(m.preventDefault(),q(k),U(!1),W(!1),m.currentTarget.blur())}}),B?u("div",{className:"chisel-unit-menu",role:"listbox","aria-label":`${e.label} units`,onKeyDown:ka,children:E.map(m=>u("button",{className:"chisel-unit-option","data-active":m===P,"aria-selected":m===P,onClick:I=>{I.preventDefault(),ee(m)},onPointerDown:I=>{I.preventDefault(),I.stopPropagation()},role:"option",type:"button",children:m||"unitless"},m||"unitless"))}):null]})}function zt(){return u("style",{children:`
+`;function ca(e,a){return{schemaVersion:1,activeVersionId:e.some(o=>o.id===a)?a:e[0]?.id??a,versions:e}}function Xa(e){if(e===null)return{migrated:!1};let a;try{a=JSON.parse(e)}catch{return{migrated:!1,warning:"Saved edits could not be read. Edits will be kept for this session."}}if(Array.isArray(a)){let t=a.filter(Ka);return a.length>0&&t.length===0?{migrated:!1,warning:"Saved edits are malformed. Edits will be kept for this session."}:{envelope:ca(t,t[0]?.id??"version-1"),migrated:t.length===a.length,warning:t.length<a.length?"Some malformed saved versions were skipped. Recovered edits will be kept for this session until you make a change.":void 0}}return Mt(a)?{envelope:a,migrated:!1}:{migrated:!1,warning:"Saved edits use an unsupported or malformed format. Edits will be kept for this session."}}function Mt(e){return!ve(e)||e.schemaVersion!==1||typeof e.activeVersionId!="string"||!Array.isArray(e.versions)||!e.versions.every(Ka)?!1:e.versions.length===0||e.versions.some(a=>a.id===e.activeVersionId)}function Ka(e){return!ve(e)||typeof e.id!="string"||typeof e.name!="string"||!ve(e.elements)?!1:Object.values(e.elements).every(Dt)}function Dt(e){return!(!ve(e)||typeof e.selector!="string"||!ve(e.styles)||e.sourceHint!==void 0&&typeof e.sourceHint!="string"||e.text!==void 0&&typeof e.text!="string"||!Object.values(e.styles).every(a=>typeof a=="string")||e.asset!==void 0&&!Tt(e.asset))}function Tt(e){return ve(e)&&typeof e.fileName=="string"&&typeof e.mimeType=="string"&&typeof e.size=="number"&&Number.isFinite(e.size)&&e.size>=0}function ve(e){return!!e&&typeof e=="object"&&!Array.isArray(e)}var qt=["px","rem","em"],Ut=[{label:"Inter",value:'Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif'},{label:"System",value:'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif'},{label:"Arial",value:"Arial, Helvetica, sans-serif"},{label:"Georgia",value:'Georgia, "Times New Roman", serif'},{label:"Mono",value:"ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace"}],Ot=["Hex","RGB","RGBA","HSL"],Ht=["Solid","Gradient","Image"],Et=[{label:"Font Size",property:"fontSize",cssProperty:"font-size",min:8,max:96,step:1,unit:"px"},{label:"Line",property:"lineHeight",cssProperty:"line-height",min:8,max:120,step:1,unit:"px"},{label:"Tracking",property:"letterSpacing",cssProperty:"letter-spacing",min:-2,max:12,step:.25,unit:"px"},{label:"Padding X",property:"paddingInline",cssProperty:"padding-inline",min:0,max:120,step:1,unit:"px"},{label:"Padding Y",property:"paddingBlock",cssProperty:"padding-block",min:0,max:120,step:1,unit:"px"},{label:"Margin X",property:"marginInline",cssProperty:"margin-inline",min:-80,max:160,step:1,unit:"px"},{label:"Margin Y",property:"marginBlock",cssProperty:"margin-block",min:-80,max:160,step:1,unit:"px"},{label:"Radius",property:"borderRadius",cssProperty:"border-radius",min:0,max:80,step:1,unit:"px"},{label:"Opacity",property:"opacity",cssProperty:"opacity",min:0,max:1,step:.01,unit:""},{label:"Width",property:"width",cssProperty:"width",min:0,max:1200,step:1,unit:"px"},{label:"Height",property:"height",cssProperty:"height",min:0,max:1200,step:1,unit:"px"}],Sa=["color","backgroundColor","backgroundImage","backgroundPosition","backgroundSize","fontFamily","fontSize","lineHeight","letterSpacing","paddingInline","paddingBlock","marginInline","marginBlock","borderRadius","opacity","width","height"],Nt=new Set(["area","audio","base","br","button","canvas","col","embed","hr","iframe","img","input","link","meta","object","param","picture","portal","select","source","textarea","track","video","wbr"]),La="chisel:locationchange",ea=0,la,Ke=!1,$a=0,xa=new Map,Xe=new WeakMap;function Sr({id:e,as:a,children:t,...o}){return u(a??"span",{"data-chisel-id":e,...o,children:t})}function wr({enabled:e=process.env.NODE_ENV!=="production",position:a="right",projectName:t="Next.js app",embedded:o=!1}){let[r,n]=p.useState(null),[i,c]=p.useState(null),[f,g]=p.useState(null),[S,A]=p.useState([]),[M,F]=p.useState(null),[k,P]=p.useState([]),[T,q]=p.useState(!1),[H,ae]=p.useState(""),[v,U]=p.useState(()=>[pa(1)]),[B,W]=p.useState("version-1"),[G,K]=p.useState(!1),[te,E]=p.useState(""),[fe,oe]=p.useState(""),[re,le]=p.useState(!1),[$,ee]=p.useState([]),[m,I]=p.useState(0),[Z,j]=p.useState(""),se=p.useRef(new WeakMap),O=p.useRef(new Map),N=p.useRef(new Map),xe=p.useRef(""),V=p.useRef(null),ne=p.useRef(null),X=p.useRef([]),Je=p.useRef(null),Qe=p.useRef([]),me=p.useRef(null),Ie=p.useRef(null),ye=p.useRef(null),Ue=p.useRef(!1),ge=p.useRef(null),s=p.useRef(null),L=p.useRef(null),b=p.useRef(!0),D=r?new URLSearchParams(r.search).has("editor"):!1,Q=e&&process.env.NEXT_PUBLIC_CHISEL_ENABLED!=="0"&&(o||D),ya=r?ut(r.pathname,r.search):"";if(p.useEffect(()=>()=>ha(N.current),[]),p.useEffect(()=>{let l=()=>n(Kt());return l(),$t(l)},[]),p.useEffect(()=>{if(Q){Ue.current=!0;return}if(!Ue.current||(Ue.current=!1,o))return;let l=v.find(d=>d.id===B)??v[0];l&&Qa(l,O.current,N.current),ha(N.current),V.current=null,ne.current=null,X.current=[],c(null),g(null),A([]),F(null),P([]),q(!1)},[B,Q,o,v]),p.useEffect(()=>{if(!Q||!o)return;let l=()=>{let d=document.documentElement?.dataset.chiselSelection,x=d?document.querySelector(d):null;x instanceof HTMLElement&&!Be(x)&&Ye([x])};return window.addEventListener("chisel:select",l),()=>window.removeEventListener("chisel:select",l)},[Q,o]),p.useEffect(()=>{if(!Q){Ke=!1;return}let l=()=>{ge.current===null&&(ge.current=window.requestAnimationFrame(()=>{ge.current=null;let x=V.current,h=X.current;F(C=>x?ie(x.getBoundingClientRect()):C),P(h.map(C=>ie(C.getBoundingClientRect())))}))},d=x=>{let h=x.target;h instanceof HTMLElement&&Be(h)||x.key==="Escape"&&(ne.current=null,X.current=[],g(null),A([]),P([]))};return document.addEventListener("keydown",d),window.addEventListener("resize",l),window.addEventListener("scroll",l,!0),()=>{ge.current!==null&&window.cancelAnimationFrame(ge.current),s.current!==null&&window.cancelAnimationFrame(s.current),document.removeEventListener("keydown",d),window.removeEventListener("resize",l),window.removeEventListener("scroll",l,!0)}},[Q]),p.useEffect(()=>{ne.current=f},[f]),p.useEffect(()=>{X.current=S},[S]),p.useEffect(()=>{if(!S.length)return;let l=null,d=()=>{l===null&&(l=window.requestAnimationFrame(()=>{l=null,P(S.map(h=>ie(h.getBoundingClientRect())))}))};if(typeof ResizeObserver>"u"){let h=window.setInterval(d,750);return()=>{l!==null&&window.cancelAnimationFrame(l),window.clearInterval(h)}}let x=new ResizeObserver(d);for(let h of S)x.observe(h);return()=>{l!==null&&window.cancelAnimationFrame(l),x.disconnect()}},[f,S]),p.useEffect(()=>{if(!Q)return;let l=jt(ya);xe.current=l,oe(""),V.current=null,ne.current=null,X.current=[],c(null),g(null),A([]),F(null),P([]);let d=v.find(_=>_.id===B)??v[0];d&&Qa(d,O.current,N.current),O.current.clear(),ha(N.current);let x=Jt(r?.pathname??window.location.pathname,r?.search??window.location.search),h=Qt(l,x);b.current=!h.warning,E(h.warning??"");let C=h.envelope?.versions.length?h.envelope.versions:[pa(1)],y=h.envelope?.activeVersionId??C[0].id;U(C),W(y),oe(l);let R=C.find(_=>_.id===y)??C[0],z=window.setTimeout(()=>aa(R,C,O.current,N.current),0);if(h.migrated&&h.envelope){let _=Ja(l,C,y);_&&E(_)}return Ke=!1,()=>window.clearTimeout(z)},[ya,Q]),p.useEffect(()=>{if(!Q||!b.current||!xe.current||fe!==xe.current)return;let l=Ja(xe.current,v,B);l&&E(l)},[B,Q,fe,v]),p.useEffect(()=>{if(!Q||typeof MutationObserver>"u"||!document.body)return;let l=null,d=()=>{l=null;let h=v.find(y=>y.id===B)??v[0];h&&aa(h,v,O.current,N.current,!1),V.current&&!V.current.isConnected&&(V.current=null,c(null),F(null));let C=X.current.filter(y=>y.isConnected);if(C.length!==X.current.length){let y=C[C.length-1]??null;X.current=C,ne.current=y,A(C),g(y),P(C.map(R=>ie(R.getBoundingClientRect())))}},x=new MutationObserver(h=>{if(Ke)return;let C=h.some(R=>{let z=R.target instanceof HTMLElement?R.target:R.target.parentElement;return z&&Xe.has(z)?!1:z&&!Be(z)?!0:Array.from(R.addedNodes).some(_=>{let Ba=_ instanceof HTMLElement?_:_.parentElement;return!!(Ba&&!Be(Ba))})}),y=h.some(R=>Array.from(R.removedNodes).some(z=>z instanceof HTMLElement&&((V.current?z===V.current||z.contains(V.current):!1)||X.current.some(_=>z===_||z.contains(_)))));!C&&!y||l===null&&(l=window.requestAnimationFrame(d))});return x.observe(document.body,{attributes:!0,attributeFilter:["style"],characterData:!0,childList:!0,subtree:!0}),()=>{x.disconnect(),l!==null&&window.cancelAnimationFrame(l)}},[B,Q,v]),p.useEffect(()=>{if(!re)return;let l=h=>{let C=Y(h,0,Math.max(0,$.length-1)),y=$[C];I(C),y&&(V.current=y,c(y),F(ie(y.getBoundingClientRect())),j(at(y)))},d=()=>{Ye(Qe.current.filter(h=>h.isConnected)),le(!1),window.requestAnimationFrame(()=>Je.current?.focus())},x=h=>{let C=$[m],y=m;if(h.key==="ArrowDown")y=m+1;else if(h.key==="ArrowUp")y=m-1;else if(h.key==="Home")y=0;else if(h.key==="End")y=$.length-1;else if(h.key==="ArrowRight"&&C){let R=$.find(z=>z.parentElement===C);R&&(y=$.indexOf(R))}else if(h.key==="ArrowLeft"&&C){let R=C.parentElement;for(;R&&!$.includes(R);)R=R.parentElement;R&&(y=$.indexOf(R))}else if(h.key==="Enter"&&C){Ye(h.shiftKey?Ya(X.current,C):[C]),h.shiftKey||le(!1),h.preventDefault();return}else if(h.key==="Escape"){d(),h.preventDefault();return}else return;l(y),h.preventDefault()};return document.addEventListener("keydown",x),()=>document.removeEventListener("keydown",x)},[re,$,m]),p.useEffect(()=>{H&&(me.current?.focus(),me.current?.select())},[H]),p.useEffect(()=>{if(!G)return;let l=h=>{K(!1),h&&window.requestAnimationFrame(()=>ye.current?.focus())},d=h=>{h.target instanceof Node&&Ie.current?.contains(h.target)||l(!0)},x=h=>{h.key==="Escape"&&(l(!0),h.preventDefault())};return document.addEventListener("pointerdown",d,!0),document.addEventListener("keydown",x),()=>{document.removeEventListener("pointerdown",d,!0),document.removeEventListener("keydown",x)}},[G]),!Q)return null;let he=S.length,Oe=f?se.current.get(f):void 0,fa=!!(he<=1&&f&&tt(f)),He=f?De(f):void 0,Pa=f?$e(f):"",ue=v.find(l=>l.id===B)??v[0]??pa(1),_e=he>1?S.flatMap(l=>ao(ue.elements[de(l)])):f&&Oe?eo(f,Oe):[],Ce=f?getComputedStyle(f):null,Ee=l=>he>1&&new Set(S.map(d=>getComputedStyle(d)[l])).size>1,Ne=()=>S.length?S:f?[f]:[];function Ye(l){for(let x of l)Wt(x,se.current);let d=l[l.length-1]??null;if(X.current=l,ne.current=d,A(l),g(d),P(l.map(x=>ie(x.getBoundingClientRect()))),o&&d){let x=d.getBoundingClientRect();window.dispatchEvent(new CustomEvent("chisel:selection",{detail:{selector:$e(d),tag:d.tagName.toLowerCase(),x:x.left+x.width/2+window.scrollX,y:x.top+x.height/2+window.scrollY,offsetX:.5,offsetY:.5}}))}}let Se=()=>{P(S.map(l=>ie(l.getBoundingClientRect())))},Aa=(l,d)=>{let x=document.elementsFromPoint(l,d).find(h=>h instanceof HTMLElement&&!Be(h));return x instanceof HTMLElement?lo(x):null},mt=l=>{L.current={x:l.clientX,y:l.clientY},s.current===null&&(s.current=window.requestAnimationFrame(()=>{s.current=null;let d=L.current;if(!d)return;let x=Aa(d.x,d.y);if(!x){V.current=null,c(null),F(null);return}x!==V.current&&(V.current=x,c(x),F(ie(x.getBoundingClientRect())))}))},ht=l=>{l.preventDefault(),l.stopPropagation();let d=Aa(l.clientX,l.clientY);d&&(le(!1),Ye(l.shiftKey?Ya(X.current,d):[d]))},Lt=()=>{let l=so();Qe.current=X.current,ee(l),I(0),le(!0);let d=l[0];d?(V.current=d,c(d),F(ie(d.getBoundingClientRect())),j(at(d))):j("No visible elements available")},xt=()=>{let l={id:`version-${Date.now()}`,name:`Version ${v.length+1}`,elements:Xt(ue.elements)};ia(d=>[...d,l]),W(l.id),K(!1);for(let[d,x]of Object.entries(ue.elements)){if(!x.asset)continue;let h=N.current.get(be(ue.id,d));h&&N.current.set(be(l.id,d),h)}aa(l,[...v,l],O.current,N.current),Se()},It=l=>{W(l.id),K(!1),aa(l,v,O.current,N.current),Se(),window.requestAnimationFrame(()=>ye.current?.focus())},gt=(l,d)=>{let x=l.unit==="px"?`${d}px`:String(d);va(l,x)},va=(l,d)=>{let x=Ne();if(x.length){for(let h of x)ke(h,de(h),O.current),ce(h),h.style[l.property]=d,we(h,{styles:{[l.property]:d}});Se()}},Fa=(l,d,x)=>{let h=Ne();if(h.length){for(let C of h){let y=de(C);if(ke(C,de(C),O.current),ce(C),l==="backgroundColor"&&ho(d)){if(C.style.backgroundImage=d,d.startsWith("url(")){let R=ga(d),z=be(B,y);x&&R?_t(N.current,z,R):ma(N.current,z),C.style.backgroundPosition="center",C.style.backgroundSize="cover",we(C,{styles:{backgroundImage:x?"":d,backgroundPosition:"center",backgroundSize:"cover"},asset:x??null})}else we(C,{styles:{backgroundImage:d},asset:null});continue}if(C.style[l]=d,l==="backgroundColor"){ma(N.current,be(B,y)),C.style.backgroundImage="",C.style.backgroundPosition="",C.style.backgroundSize="",we(C,{styles:{backgroundColor:d,backgroundImage:"",backgroundPosition:"",backgroundSize:""},asset:null});continue}we(C,{styles:{[l]:d}})}Se()}},Ct=l=>{let d=Ne();if(d.length){for(let x of d)ke(x,de(x),O.current),ce(x),x.style.fontFamily=l,we(x,{styles:{fontFamily:l}});Se()}},St=l=>{let d=Ne();if(d.length)for(let x of d)ke(x,de(x),O.current),ce(x),x.style.fontFamily=l},wt=l=>{!f||!fa||(ke(f,de(f),O.current),ce(f),f.textContent=l,we(f,{text:l}),Se())},kt=()=>{let l=Ne();if(l.length){for(let d of l){let x=se.current.get(d),h=de(d),C=O.current.get(h),y=ue.elements[h];if(y){ce(d);for(let R of Object.keys(y.styles))d.style[R]=C?.styles[R]??"";typeof y.text=="string"&&tt(d)&&(d.textContent=C?.text??x?.text??""),bt(d),y.asset&&ma(N.current,be(B,h))}}Se()}};function we(l,d){let x=de(l);ke(l,x,O.current),ia(h=>h.map(C=>{if(C.id!==B)return C;let y=C.elements[x];return{...C,elements:{...C.elements,[x]:{selector:$e(l),sourceHint:De(l),text:d.text??y?.text,asset:d.asset===null?void 0:d.asset??y?.asset,styles:{...y?.styles??{},...d.styles??{}}}}}}))}function bt(l){let d=de(l),x=v.some(h=>h.id!==B&&!!h.elements[d]);ia(h=>h.map(C=>{if(C.id!==B)return C;let{[d]:y,...R}=C.elements;return{...C,elements:R}})),x||O.current.delete(d)}function ia(l){b.current=!0,U(l)}let yt=async()=>{let l=f?ie(f.getBoundingClientRect()):void 0,d=Object.keys(ue.elements).length?oo({projectName:t,version:ue,baselines:O.current}):f&&Oe&&l?to({projectName:t,element:f,snapshot:Oe,rect:l,selector:Pa,sourceHint:He,changes:_e}):void 0;if(d)try{if(!navigator.clipboard?.writeText)throw new Error("Clipboard unavailable");await navigator.clipboard.writeText(d),ae(""),q(!0),window.setTimeout(()=>q(!1),1600)}catch{q(!1),ae(d)}};return w("div",{"data-chisel-root":"true",className:"chisel-root",children:[u(zt,{}),u("div",{className:"chisel-visually-hidden","aria-live":"polite",children:Z}),u("div",{className:"chisel-inspection-layer","aria-hidden":"true",onPointerMove:mt,onPointerLeave:()=>{L.current=null,s.current!==null&&window.cancelAnimationFrame(s.current),s.current=null,V.current=null,c(null),F(null)},onClick:ht}),M&&i&&!S.includes(i)?u(Za,{rect:M,tone:"hover"}):null,k.map((l,d)=>u(Za,{rect:l,tone:"selected"},`${l.left}-${l.top}-${d}`)),u("aside",{className:`chisel-panel chisel-panel-${a}`,"aria-label":"Chisel editor",children:u("div",{className:"chisel-panel-wrapper",children:u("div",{className:"chisel-panel-inner",children:w("div",{className:"chisel-folder chisel-folder-root",children:[u("header",{className:"chisel-folder-header chisel-panel-header",children:w("div",{className:"chisel-panel-toolbar",children:[u("button",{className:"chisel-toolbar-add",type:"button","aria-label":"Add version",onClick:xt,children:u(Ve,{size:16,strokeWidth:1.75,"aria-hidden":"true"})}),w("div",{className:"chisel-preset-manager",ref:Ie,children:[w("button",{className:"chisel-preset-trigger",type:"button","aria-expanded":G,"aria-haspopup":"listbox",ref:ye,onClick:()=>K(l=>{let d=!l;return d&&window.requestAnimationFrame(()=>Ie.current?.querySelector('[role="option"][aria-selected="true"]')?.focus()),d}),children:[u("span",{className:"chisel-preset-trigger-label",children:ue.name}),u(Ae,{className:"chisel-chevron",size:16,strokeWidth:1.75,"aria-hidden":"true"})]}),G?u("div",{className:"chisel-preset-dropdown",role:"listbox","aria-label":"Page versions",onKeyDown:ka,children:u("div",{className:"chisel-preset-list",children:v.map(l=>w("button",{className:"chisel-preset-item",type:"button",role:"option","aria-selected":l.id===ue.id,"data-active":l.id===ue.id,onClick:()=>It(l),children:[u("span",{className:"chisel-preset-name",children:l.name}),u("span",{className:"chisel-preset-count",children:Object.keys(l.elements).length})]},l.id))})}):null]}),u("button",{className:"chisel-toolbar-add",type:"button",onClick:()=>{ne.current=null,X.current=[],g(null),A([]),P([])},"aria-label":"Clear selection",children:u(ze,{size:16,strokeWidth:1.75,"aria-hidden":"true"})})]})}),te?u("div",{className:"chisel-note-row chisel-warning",role:"alert",children:te}):null,f&&Oe?w("div",{className:"chisel-content",children:[w("div",{className:"chisel-text-control chisel-context-row",children:[u("span",{className:"chisel-text-label",children:he>1?"Selection":"Element"}),u("code",{className:"chisel-text-code",children:he>1?`${he} elements`:f.tagName.toLowerCase()})]}),he===1?w(We,{children:[w("div",{className:"chisel-text-control chisel-context-row chisel-selector-row",children:[u("span",{className:"chisel-text-label",children:"Selector"}),u("code",{className:"chisel-selector",children:Pa})]}),w("div",{className:He?"chisel-text-control chisel-context-row":"chisel-text-control chisel-context-row chisel-warning-row",children:[u("span",{className:"chisel-text-label",children:"Source"}),u("span",{className:He?"chisel-text-value":"chisel-warning",children:He?`Source hint: ${He}`:"Low-confidence source mapping"})]})]}):null,w("div",{className:"chisel-folder",children:[u("div",{className:"chisel-folder-header",children:u("div",{className:"chisel-folder-header-top",children:u("div",{className:"chisel-folder-title-row",children:u("span",{className:"chisel-folder-title",children:"Content"})})})}),u("div",{className:"chisel-folder-content",children:w("div",{className:"chisel-folder-inner",children:[w("label",{className:"chisel-text-control chisel-textarea-control",children:[u("span",{className:"chisel-text-label",children:"Text"}),u("textarea",{className:"chisel-text-input",value:f.textContent??"",onChange:l=>wt(l.target.value),disabled:!fa,rows:3})]}),fa?null:u("div",{className:"chisel-note-row",children:he>1?"Text editing is enabled for one element at a time.":"Text editing is enabled for simple text elements."})]})})]}),w("div",{className:"chisel-folder",children:[u("div",{className:"chisel-folder-header",children:u("div",{className:"chisel-folder-header-top",children:u("div",{className:"chisel-folder-title-row",children:u("span",{className:"chisel-folder-title",children:"Color"})})})}),u("div",{className:"chisel-folder-content",children:w("div",{className:"chisel-folder-inner",children:[u(ja,{label:"Text",value:f.style.color||Me(Ce?.color??"#000000"),onChange:l=>Fa("color",l),mixed:Ee("color")}),u(ja,{label:"Fill",value:f.style.backgroundImage||(Ce?.backgroundImage&&Ce.backgroundImage!=="none"?Ce.backgroundImage:f.style.backgroundColor||Me(Ce?.backgroundColor??"#ffffff")),onChange:(l,d)=>Fa("backgroundColor",l,d),supportsBackgroundImages:!0,unavailableAsset:ue.elements[de(f)]?.asset,mixed:Ee("backgroundColor")||Ee("backgroundImage")})]})})]}),w("div",{className:"chisel-folder",children:[u("div",{className:"chisel-folder-header",children:u("div",{className:"chisel-folder-header-top",children:u("div",{className:"chisel-folder-title-row",children:u("span",{className:"chisel-folder-title",children:"Style"})})})}),u("div",{className:"chisel-folder-content",children:w("div",{className:"chisel-folder-inner",children:[u(Gt,{value:Ce?.fontFamily??"",onChange:Ct,onPreview:St,mixed:Ee("fontFamily")}),Et.map(l=>u(Vt,{control:l,computedStyle:Ce,element:f,mixed:Ee(l.property),onSlide:d=>gt(l,d),onValueChange:d=>va(l,d)},l.cssProperty))]})})]}),w("div",{className:"chisel-folder",children:[u("div",{className:"chisel-folder-header",children:w("div",{className:"chisel-folder-header-top",children:[u("div",{className:"chisel-folder-title-row",children:u("span",{className:"chisel-folder-title",children:"Changes"})}),u("span",{className:"chisel-folder-count",children:_e.length})]})}),u("div",{className:"chisel-folder-content",children:u("div",{className:"chisel-folder-inner",children:_e.length?_e.map((l,d)=>w("div",{className:"chisel-text-control",children:[u("span",{className:"chisel-text-label",children:l.property}),u("strong",{className:"chisel-text-value",children:String(l.after)})]},`${l.property}-${d}`)):u("div",{className:"chisel-note-row",children:"No preview changes yet."})})})]}),w("div",{className:"chisel-actions",children:[u("button",{className:"chisel-button",type:"button",onClick:kt,children:"Reset"}),u("button",{className:"chisel-button chisel-button-primary",type:"button",onClick:yt,children:T?"Copied":"Copy agent prompt"})]}),T?u("div",{className:"chisel-note-row",role:"status",children:"Prompt copied"}):null,H?w("div",{className:"chisel-note-row",role:"alert",children:["Press Cmd+C/Ctrl+C",u("textarea",{ref:me,readOnly:!0,value:H,"aria-label":"Agent prompt copy fallback"})]}):null]}):w("div",{className:"chisel-empty",children:[u("div",{className:"chisel-note-row",children:"Select any visible element to edit its text and style preview."}),u("button",{className:"chisel-button",type:"button",ref:Je,onClick:Lt,"aria-pressed":re,children:"Pick element"})]})]})})})})]})}function Za({rect:e,tone:a}){return u("div",{className:`chisel-box chisel-box-${a}`,style:{transform:`translate3d(${e.left}px, ${e.top}px, 0)`,width:e.width,height:e.height}})}function Gt({value:e,onChange:a,onPreview:t,mixed:o=!1}){let[r,n]=p.useState(!1),i=p.useRef(null),c=p.useRef(null),f=p.useRef(e),g=p.useMemo(()=>io(e),[e]),S=no(e,g),A=o?"Mixed":S?.label??Ze(e)??"Font";p.useEffect(()=>{r||(f.current=e)},[r,e]),p.useEffect(()=>{if(!r)return;let k=T=>{let q=T.target;q instanceof Node&&i.current?.contains(q)||(t(f.current),n(!1),window.requestAnimationFrame(()=>c.current?.focus()))},P=T=>{T.key==="Escape"&&(t(f.current),n(!1),window.requestAnimationFrame(()=>c.current?.focus()))};return document.addEventListener("pointerdown",k,!0),document.addEventListener("keydown",P),()=>{document.removeEventListener("pointerdown",k,!0),document.removeEventListener("keydown",P)}},[r,t]);let M=()=>{if(r){t(f.current),n(!1);return}f.current=e,n(!0),window.requestAnimationFrame(()=>i.current?.querySelector('[role="option"][aria-selected="true"]')?.focus())},F=k=>{f.current=k.value,a(k.value),n(!1),window.requestAnimationFrame(()=>c.current?.focus())};return w("div",{className:"chisel-font-control",ref:i,children:[u("span",{className:"chisel-font-label",children:"Font"}),w("div",{className:"chisel-font-picker",children:[w("button",{className:"chisel-font-trigger",ref:c,type:"button","aria-expanded":r,"aria-haspopup":"listbox",onClick:M,children:[u("span",{className:"chisel-font-trigger-label",children:A}),u(Ae,{className:"chisel-chevron",size:16,strokeWidth:1.75,"aria-hidden":"true"})]}),r?u("div",{className:"chisel-preset-dropdown chisel-font-dropdown",role:"listbox","aria-label":"Font family",onKeyDown:ka,children:u("div",{className:"chisel-preset-list chisel-font-list",children:g.map(k=>u("button",{className:"chisel-preset-item chisel-font-item","data-active":ua(e,k.value),"aria-selected":ua(e,k.value),onClick:()=>F(k),onFocus:()=>t(k.value),onPointerEnter:()=>t(k.value),role:"option",style:{fontFamily:k.value},type:"button",children:u("span",{className:"chisel-preset-name",children:k.label})},k.value))})}):null]})]})}function ja({label:e,value:a,onChange:t,supportsBackgroundImages:o=!1,unavailableAsset:r,mixed:n=!1}){let i=lt(a),c=ga(a),f=o&&i?"Gradient":o&&(c!==void 0||r)?"Image":"Solid",g=i?.start??(c!==void 0?"#FFFFFF":rt(a)),[S,A]=p.useState(f),[M,F]=p.useState(()=>Fe(g)),[k,P]=p.useState(g),[T,q]=p.useState(i?.start??g),[H,ae]=p.useState(i?.end??"#FFFFFF"),[v,U]=p.useState("start"),[B,W]=p.useState(c??""),[G,K]=p.useState(""),[te,E]=p.useState(!1),[fe,oe]=p.useState(!1),re=p.useRef(null),le=p.useRef(null),$=S==="Gradient"?v==="start"?T:H:k,ee=Me($).toUpperCase(),m=mo($),I=p.useMemo(()=>uo(ba(ee)),[ee]),Z=n?"Mixed":S==="Gradient"?"Gradient":S==="Image"?"Image":k;p.useEffect(()=>{let s=lt(a),L=ga(a);if(o&&s){let D=v==="end"?s.end:s.start;A("Gradient"),q(s.start),ae(s.end),P(D),F(Fe(D)),E(!1);return}if(o&&L!==void 0){A("Image"),W(L),P("#FFFFFF"),E(!1);return}if(o&&r){A("Image"),W(""),K(""),E(!1);return}let b=rt(a);A("Solid"),P(D=>D&&Me(D)===Me(b)?D:b),F(Fe(b)),E(!1)},[v,o,r,a]),p.useEffect(()=>{if(!fe)return;let s=b=>{let D=b.target;D instanceof Node&&re.current?.contains(D)||(oe(!1),window.requestAnimationFrame(()=>le.current?.focus()))},L=b=>{b.key==="Escape"&&(oe(!1),window.requestAnimationFrame(()=>le.current?.focus()),b.preventDefault())};return document.addEventListener("pointerdown",s,!0),document.addEventListener("keydown",L),()=>{document.removeEventListener("pointerdown",s,!0),document.removeEventListener("keydown",L)}},[fe]);let j=s=>{let L=ot(s);if(!L){E(s.trim().length>0);return}let b=Te(L)??L;if(F(Fe(b)),P(b),E(!1),S==="Gradient"){Ie(v,b);return}t(b)},se=(s,L=m,b=M)=>{let D=po(s,L,b);if(P(D),E(!1),S==="Gradient"){Ie(v,D);return}t(D)},O=(s,L)=>{let b=Y((s.clientX-L.left)/L.width*100,0,100),D=Y((1-(s.clientY-L.top)/L.height)*100,0,100);se(ta(I.h,b,D))},N=(s,L)=>{let b=Y((s.clientX-L.left)/L.width*360,0,360);se(ta(b,I.s,I.v))},xe=(s,L)=>{let b=Y((s.clientX-L.left)/L.width,0,1);se(ee,b)},V=s=>{if(!ra(s.key))return;let L=s.shiftKey?10:1,b=Y(I.s+(s.key==="ArrowRight"?L:s.key==="ArrowLeft"?-L:0),0,100),D=Y(I.v+(s.key==="ArrowUp"?L:s.key==="ArrowDown"?-L:0),0,100);se(ta(I.h,b,D)),s.preventDefault()},ne=s=>{if(!ra(s.key))return;let L=s.shiftKey?10:1,b=Y(I.h+(Ca(s.key)?L:-L),0,360);se(ta(b,I.s,I.v)),s.preventDefault()},X=s=>{if(!ra(s.key))return;let L=s.shiftKey?.1:.01;se(ee,Y(m+(Ca(s.key)?L:-L),0,1)),s.preventDefault()},Je=s=>{F(s),se(ee,m,s)},Qe=s=>{if(!(s!=="Solid"&&!o)){if(A(s),s==="Solid"&&t(k),s==="Gradient"){let L=T||k;q(L),U("start"),P(L),t(oa(L,H))}s==="Image"&&B.trim()&&t(Re(B))}},me=s=>{let L=s==="start"?T:H;U(s),P(L),F(Fe(L)),E(!1)},Ie=(s,L)=>{let b=s==="start"?L:T,D=s==="end"?L:H;q(b),ae(D),t(oa(b,D))},ye=(s,L)=>{let b=ot(L);if(s==="start"?q(L):ae(L),U(s),P(L),!b){E(L.trim().length>0);return}let D=Te(b)??b;F(Fe(D)),P(D),E(!1),Ie(s,D)},Ue=s=>{W(s),K(""),t(s.trim()?Re(s):"")},ge=s=>{let L=s.currentTarget.files?.[0];if(!L)return;let b=URL.createObjectURL(L);K(L.name),W(b),t(Re(b),{fileName:L.name,mimeType:L.type,size:L.size})};return w("div",{className:"chisel-color-control","data-picker-open":fe,ref:re,children:[u("span",{className:"chisel-color-label",children:e}),w("span",{className:"chisel-color-inputs",children:[u("button",{className:"chisel-color-swatch",ref:le,"aria-expanded":fe,"aria-label":`${e} color picker`,onClick:()=>oe(s=>!s),style:{background:S==="Gradient"?oa(T,H):S==="Image"&&B?Re(B):k},type:"button"}),u("input",{className:"chisel-color-value-input","aria-label":`${e} color value`,autoCapitalize:"off",autoComplete:"off",autoCorrect:"off","data-invalid":te,readOnly:S!=="Solid",spellCheck:!1,style:{width:`${Math.max(7.5,Math.min(Z.length+.5,18))}ch`},value:Z,onBlur:()=>{S==="Solid"&&j(k)},onChange:s=>{if(S!=="Solid")return;let L=s.target.value;P(L),j(L)},onKeyDown:s=>{s.key==="Enter"&&(s.preventDefault(),j(k),s.currentTarget.blur()),s.key==="Escape"&&(s.preventDefault(),P(g),E(!1),oe(!1),s.currentTarget.blur())}})]}),fe?w("div",{className:"chisel-color-popover",role:"dialog","aria-label":`${e} custom color picker`,children:[w("div",{className:"chisel-color-tabs",children:[Ht.map(s=>u("button",{className:"chisel-color-tab","data-active":S===s,"aria-disabled":s!=="Solid"&&!o,onClick:()=>Qe(s),type:"button",children:s},s)),u("button",{className:"chisel-color-close","aria-label":"Close color picker",onClick:()=>oe(!1),type:"button",children:"\xD7"})]}),S!=="Image"?w(We,{children:[S==="Gradient"?w(We,{children:[u("div",{className:"chisel-color-gradient-preview",style:{backgroundImage:oa(T,H)}}),w("div",{className:"chisel-color-stop-buttons",role:"group","aria-label":`${e} gradient endpoints`,children:[w("button",{className:"chisel-color-stop-button","data-active":v==="start","aria-label":`${e} gradient From`,onClick:()=>me("start"),type:"button",children:[u("span",{className:"chisel-color-stop-swatch",style:{background:T}}),u("span",{children:"From"})]}),w("button",{className:"chisel-color-stop-button","data-active":v==="end","aria-label":`${e} gradient To`,onClick:()=>me("end"),type:"button",children:[u("span",{className:"chisel-color-stop-swatch",style:{background:H}}),u("span",{children:"To"})]})]})]}):null,u("div",{className:"chisel-color-field",role:"slider",tabIndex:0,"aria-label":`${e} saturation and brightness`,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":I.s,"aria-valuetext":`Saturation ${I.s}%, brightness ${I.v}%`,onKeyDown:V,onPointerDown:s=>{let L=s.currentTarget.getBoundingClientRect();O(s,L),s.currentTarget.setPointerCapture(s.pointerId)},onPointerMove:s=>{s.buttons&1&&O(s,s.currentTarget.getBoundingClientRect())},style:{backgroundColor:`hsl(${I.h} 100% 50%)`},children:u("span",{className:"chisel-color-field-cursor",style:{left:`clamp(10px, ${I.s}%, calc(100% - 10px))`,top:`clamp(10px, ${100-I.v}%, calc(100% - 10px))`,backgroundColor:ee}})}),u("div",{className:"chisel-color-hue",role:"slider",tabIndex:0,"aria-label":`${e} hue`,"aria-valuemin":0,"aria-valuemax":360,"aria-valuenow":I.h,onKeyDown:ne,onPointerDown:s=>{let L=s.currentTarget.getBoundingClientRect();N(s,L),s.currentTarget.setPointerCapture(s.pointerId)},onPointerMove:s=>{s.buttons&1&&N(s,s.currentTarget.getBoundingClientRect())},children:u("span",{className:"chisel-color-hue-cursor",style:{left:`clamp(8px, ${I.h/360*100}%, calc(100% - 8px))`}})}),w("div",{className:"chisel-color-alpha",role:"slider",tabIndex:0,"aria-label":`${e} alpha`,"aria-valuemin":0,"aria-valuemax":100,"aria-valuenow":Math.round(m*100),"aria-valuetext":`${Math.round(m*100)}%`,onKeyDown:X,onPointerDown:s=>{let L=s.currentTarget.getBoundingClientRect();xe(s,L),s.currentTarget.setPointerCapture(s.pointerId)},onPointerMove:s=>{s.buttons&1&&xe(s,s.currentTarget.getBoundingClientRect())},style:{"--chisel-alpha-color":ee},children:[u("span",{className:"chisel-color-alpha-fill",style:{width:`${m*100}%`}}),u("span",{className:"chisel-color-alpha-cursor",style:{left:`clamp(12px, ${m*100}%, calc(100% - 12px))`,backgroundColor:ct(ee,m)}})]}),w("div",{className:"chisel-color-format-row",children:[u("select",{className:"chisel-color-format-select","aria-label":`${e} color format`,value:M,onChange:s=>Je(s.target.value),children:Ot.map(s=>u("option",{value:s,children:s},s))}),u("input",{className:"chisel-color-format-input","aria-label":`${e} formatted color value`,autoCapitalize:"off",autoComplete:"off",autoCorrect:"off","data-invalid":te,spellCheck:!1,value:k,onBlur:()=>j(k),onChange:s=>{let L=s.target.value;P(L),j(L)}})]})]}):null,S==="Gradient"?w(We,{children:[w("label",{className:"chisel-color-extra-row",children:[u("span",{children:"From"}),u("input",{"aria-label":`${e} gradient From value`,value:T,onFocus:()=>me("start"),onChange:s=>ye("start",s.target.value)})]}),w("label",{className:"chisel-color-extra-row",children:[u("span",{children:"To"}),u("input",{"aria-label":`${e} gradient To value`,value:H,onFocus:()=>me("end"),onChange:s=>ye("end",s.target.value)})]})]}):null,S==="Image"?w(We,{children:[w("label",{className:"chisel-color-extra-row",children:[u("span",{children:"URL"}),u("input",{"aria-label":`${e} image URL`,value:B,onChange:s=>Ue(s.target.value),placeholder:"https://..."})]}),w("label",{className:"chisel-color-upload-row",children:[u("span",{children:"Upload"}),u("span",{className:"chisel-color-upload-name",children:G||"Choose image"}),u("input",{"aria-label":`${e} image upload`,accept:"image/*",type:"file",onChange:ge})]}),r&&!B.startsWith("blob:")?w("div",{className:"chisel-note-row",role:"status",children:["Re-select this asset: ",r.fileName]}):null]}):null]}):null]})}function Vt({control:e,computedStyle:a,element:t,onSlide:o,onValueChange:r,mixed:n=!1}){let c=(a??getComputedStyle(t))[e.property],f=parseFloat(c),g=e.property==="width"?t.getBoundingClientRect().width:e.property==="height"?t.getBoundingClientRect().height:e.min,S=Number.isFinite(f)?f:g,A=Y(S,e.min,e.max),M=Ao(A,e.min,e.max),F=t.style[e.property],k=n?"Mixed":F||`${pe(S)}${e.unit}`,P=yo(k,e),[T,q]=p.useState(k),[H,ae]=p.useState(!1),[v,U]=p.useState(!1),[B,W]=p.useState(!1),G=p.useRef(null),K=p.useRef(null),te=p.useRef(!1),E=p.useMemo(()=>xo(e),[e]),fe={left:`max(5px, ${M}% - 9px)`,"--chisel-handle-opacity":M<18?"0.18":"1","--chisel-handle-scale":M<18?"0.25":"1"};p.useEffect(()=>{H||(q(k),U(!1))},[k,H]),p.useEffect(()=>{if(!B)return;let m=()=>{W(!1),window.requestAnimationFrame(()=>G.current?.focus())},I=j=>{j.target instanceof Node&&G.current?.parentElement?.contains(j.target)||m()},Z=j=>{j.key==="Escape"&&(m(),j.preventDefault())};return document.addEventListener("pointerdown",I,!0),document.addEventListener("keydown",Z),()=>{document.removeEventListener("pointerdown",I,!0),document.removeEventListener("keydown",Z)}},[B]);let oe=(m=T)=>{let I=da(m,e,t,P);if(!I){U(!0);return}q(I),U(!1),r(I)},re=()=>{G.current?.focus(),G.current?.select()},le=(m,I)=>{let Z=vo(m,I,e);q(`${pe(Z)}${e.unit}`),U(!1),o(Z)},$=()=>{E.length<=1||(W(!0),window.requestAnimationFrame(()=>G.current?.parentElement?.querySelector('[role="option"][aria-selected="true"]')?.focus()))},ee=m=>{let I=Io(T,m,e,t,P);if(!I){U(!0);return}q(I),U(!1),r(I),W(!1),G.current?.focus()};return w("div",{className:"chisel-slider","data-units-open":B,onDoubleClick:m=>{m.preventDefault(),m.stopPropagation(),$()},onClick:()=>{if(te.current){te.current=!1;return}window.setTimeout(re,0)},onMouseUp:()=>{te.current||window.setTimeout(re,0)},onPointerCancel:m=>{K.current?.pointerId===m.pointerId&&(K.current=null)},onPointerDown:m=>{m.preventDefault(),K.current={pointerId:m.pointerId,startX:m.clientX,rect:m.currentTarget.getBoundingClientRect(),dragging:!1},m.currentTarget.setPointerCapture(m.pointerId),window.setTimeout(re,0)},onPointerMove:m=>{let I=K.current;!I||I.pointerId!==m.pointerId||!I.dragging&&Math.abs(m.clientX-I.startX)<4||(I.dragging=!0,G.current?.blur(),m.preventDefault(),le(m.clientX,I.rect))},onPointerUp:m=>{let I=K.current;!I||I.pointerId!==m.pointerId||(I.dragging&&(te.current=!0,window.setTimeout(()=>{te.current=!1},250),le(m.clientX,I.rect)),I.dragging||window.setTimeout(re,0),K.current=null)},children:[u("span",{className:"chisel-slider-label",children:e.label}),u("span",{className:"chisel-slider-hashmarks","aria-hidden":"true",children:Array.from({length:9},(m,I)=>u("span",{className:"chisel-slider-hashmark",style:{left:`${(I+1)*10}%`}},I))}),u("span",{className:"chisel-slider-fill",style:{width:`${M}%`}}),u("span",{className:"chisel-slider-handle",style:fe}),u("input",{type:"range",tabIndex:-1,"aria-hidden":"true",min:e.min,max:e.max,step:e.step,value:A,onChange:m=>o(Number(m.target.value))}),u("input",{ref:G,className:"chisel-slider-value-input","aria-label":`${e.label} value`,autoCapitalize:"off",autoComplete:"off",autoCorrect:"off","data-invalid":v,spellCheck:!1,value:T,onBlur:m=>{oe(),ae(!1),m.relatedTarget instanceof HTMLElement&&m.currentTarget.parentElement?.contains(m.relatedTarget)||W(!1)},onChange:m=>{let I=m.target.value;q(I);let Z=da(I,e,t,P);if(!Z){U(I.trim().length>0);return}U(!1),r(Z),Z!==I&&Lo(I)&&q(Z)},onFocus:m=>{ae(!0),m.currentTarget.select()},onMouseDown:m=>{window.setTimeout(()=>{m.currentTarget.focus(),m.currentTarget.select()},0)},onMouseUp:m=>{window.setTimeout(()=>{m.currentTarget.focus(),m.currentTarget.select()},0)},onDoubleClick:m=>{m.preventDefault(),m.stopPropagation(),$()},onKeyDown:m=>{if(m.key==="Enter"&&(m.preventDefault(),oe(),m.currentTarget.blur()),ra(m.key)){let I=Po(T,e,t,P,m.shiftKey?10:1,Ca(m.key));if(!I)return;m.preventDefault(),q(I),U(!1),r(I)}m.key==="Escape"&&(m.preventDefault(),q(k),U(!1),W(!1),m.currentTarget.blur())}}),B?u("div",{className:"chisel-unit-menu",role:"listbox","aria-label":`${e.label} units`,onKeyDown:ka,children:E.map(m=>u("button",{className:"chisel-unit-option","data-active":m===P,"aria-selected":m===P,onClick:I=>{I.preventDefault(),ee(m)},onPointerDown:I=>{I.preventDefault(),I.stopPropagation()},role:"option",type:"button",children:m||"unitless"},m||"unitless"))}):null]})}function zt(){return u("style",{children:`
       ${Wa}
       .chisel-root, .chisel-root * { box-sizing: border-box; }
       .chisel-root :where(button, input, textarea, select) { margin: 0; font: inherit; color: inherit; text-transform: none; }

package/dist/workspace-entry.js

@@ -348,7 +348,7 @@ ${Yt}
       @media(max-width:760px) {
         html[data-chisel-mode="edit"] .chisel-panel { left:0;right:0;bottom:0; }
       }
-    `,e.head.append(E),C.dataset.chiselMode=i.current,C.dataset.chiselCommentsHidden=String(ye.current),d.dispatchEvent(new Event("chisel:mode")),d.addEventListener("chisel:selection",A=>{let U=A.detail;Fe(U),U.selector&&(C.dataset.chiselSelection=U.selector)});let $=()=>Ya({x:d.scrollX,y:d.scrollY});$(),d.addEventListener("scroll",$),d.addEventListener("resize",()=>{ue(null),$()}),e.addEventListener("scroll",()=>{ue(null),$()},!0),e.addEventListener("mousemove",A=>{let U=A.target;ue(i.current==="comment"&&!ye.current&&U?.nodeType===1?U.getBoundingClientRect():null)},!0),e.addEventListener("mouseleave",()=>ue(null)),e.addEventListener("keydown",A=>{A.key==="Escape"&&!ie.current&&(y(null),re(null),ue(null),Fe(null),delete C.dataset.chiselSelection)}),e.addEventListener("click",async A=>{let U=A.target;if(!U||U.nodeType!==1||U.closest("[data-chisel-root]")||i.current==="view"||i.current==="comment"&&ye.current||i.current==="comment"&&(A.preventDefault(),A.stopImmediatePropagation(),!await Te()))return;ge();let me=U.getBoundingClientRect(),oe={x:A.clientX+d.scrollX,y:A.clientY+d.scrollY,selector:oo(U),tag:U.tagName.toLowerCase(),offsetX:me.width?(A.clientX-me.left)/me.width:0,offsetY:me.height?(A.clientY-me.top)/me.height:0};Fe(oe),C.dataset.chiselSelection=oe.selector,i.current!=="edit"&&(A.preventDefault(),A.stopImmediatePropagation(),re(null),ze(""),ue(null),j(null),ha.current=crypto.randomUUID(),y(oe))},!0)}Se(()=>{let e=K?.defaultView;if(e)return Kt(e,d=>{if(!Be(d,window.location.origin))return;M(d),G(C=>C.includes(d)?C:[...C,d]);let c=new URL(window.location.href);d==="/"?c.searchParams.delete("path"):c.searchParams.set("path",d),window.history.replaceState(window.history.state,"",c)})},[K]),Se(()=>{K&&(K.documentElement.dataset.chiselCommentsHidden=String(Q))},[Q,K]),Se(()=>()=>N.current?.cancel(),[]),Se(()=>{if(!o)return;let e=!1,d,c=()=>{clearTimeout(d),d=setTimeout(()=>{d=void 0,C()},1e4)},C=async()=>{if(e||document.visibilityState==="hidden")return;if(ie.current){c();return}clearTimeout(d),d=void 0;let A=++ve.current;try{let U=await o.list();!e&&A===ve.current&&(clearTimeout(d),d=void 0,b(U),na(!1),Y(""))}catch{!e&&A===ve.current&&(na(!1),Y("Shared comments could not be loaded. Check your connection; retrying automatically."),c())}};C();let E=o.subscribe?.(()=>{C()}),$=o.subscribe?void 0:window.setInterval(()=>{C()},1e4);return window.addEventListener("focus",C),document.addEventListener("visibilitychange",C),()=>{e=!0,clearTimeout(d),E?.(),window.clearInterval($),window.removeEventListener("focus",C),document.removeEventListener("visibilitychange",C)}},[o]);let rt=s?.setPage;Se(()=>{rt?.(g)},[g,rt]),Da(()=>{let e=W.current;e&&(e.style.height="auto",e.style.height=`${e.scrollHeight+e.offsetHeight-e.clientHeight}px`)},[Le,Z,n?.id,Q,D,g]),Da(()=>{let e=k.current?.parentElement,d=e?.querySelector(".comment-box");if(!h||!e||!d||Q)return;let c=()=>{let E=Qt(de(h),{width:d.offsetWidth,height:d.offsetHeight},{width:e.clientWidth,height:e.clientHeight});d.style.left=`${E.left}px`,d.style.top=`${E.top}px`,d.style.maxHeight=`${E.maxHeight}px`};c();let C=new ResizeObserver(c);return C.observe(d),C.observe(e),()=>C.disconnect()}),Da(()=>{let e=m.current;if(!e||Q||q.current?.playState==="running")return;let d=e.parentElement?.parentElement,c=d?.clientHeight??356,C=d?.clientWidth??416,E=Number(e.dataset.pinX),$=Number(e.dataset.pinY),A=Z?Math.max(8,Math.min($-40,c-Math.min(340,c-16)-8)):Math.max(8,Math.min($+32-e.offsetHeight,c-e.offsetHeight-8)),U=Z?E+44:E;e.style.left=`${Math.max(8,Math.min(U,C-e.offsetWidth-8))}px`,e.style.top=`${A}px`,e.style.maxHeight=`${c-A-8}px`}),Da(()=>(ee.current=!1,q.current=m.current&&!Q?va(m.current):null,()=>{ee.current=!1,q.current?.cancel()}),[n?.id,!!h,D,Q,g]),Se(()=>{k.current?.contentDocument?.readyState==="complete"&&Ta()},[]),Se(()=>{let e=d=>{if(document.querySelector('dialog[open], [aria-modal="true"]'))return;let c=_t(d);if(!(!c||c===i.current||c==="edit"&&!Ba)){if(d.preventDefault(),d.stopPropagation(),c==="toggle-comments"){N.current?.cancel(),ge(),Ee(C=>!C);return}ga(c)}};return document.addEventListener("keydown",e,!0),K?.addEventListener("keydown",e,!0),()=>{document.removeEventListener("keydown",e,!0),K?.removeEventListener("keydown",e,!0)}},[K]),Se(()=>{if(!n||le!==n.id||h||D==="edit"||n.path!==g||!n.selector||!K)return;let e;try{e=K.querySelector(n.selector)}catch{e=null}if(!e){Me(null),Y("This element is no longer on the page. Its saved changes cannot be previewed.");return}let d=ka(e,n.changes??[]);return we.current=d,Ya({x:e.ownerDocument.defaultView.scrollX,y:e.ownerDocument.defaultView.scrollY}),d},[le,n,h,D,g,K]);let dt=eo(w,Ne,fa);return x("main",{"aria-label":"Chisel workspace",className:`feedback-shell ${p?.className??""} ${D==="edit"?"is-editing":""} ${Q?"comments-hidden":""}`,children:[u(Wa,{}),S,x("div",{className:"feedback-workspace",children:[x("section",{className:"feedback-canvas","aria-label":"Website preview",children:[x("div",{className:"feedback-viewport",children:[u("iframe",{ref:k,src:"/",title:"Website for feedback",onLoad:Ta}),x("div",{className:"feedback-comment-layer","data-hover-preview":!!(n&&!Z&&!h),hidden:Q,children:[h&&pe?.type!=="create"&&u("span",{className:"feedback-pin comment-box-draft-pin","aria-hidden":"true",style:{left:de(h).x,top:de(h).y}}),n&&!h&&D!=="edit"&&n.path===g&&x("section",{ref:m,"data-pin-x":de(n).x,"data-pin-y":de(n).y,"data-pin-width":40+(Math.min(Aa(n).length,4)-1)*20,"data-expanded":Z,onPointerEnter:()=>{ee.current||N.current?.cancel()},onPointerMove:Ra,onPointerLeave:()=>N.current?.schedule(),onFocus:Ra,onBlur:e=>{e.currentTarget.contains(e.relatedTarget)||N.current?.schedule()},"data-native-ui":!!p,className:"feedback-composer feedback-thread-popup comment-thread",role:"dialog","aria-label":"Comment thread",style:{left:`clamp(8px, ${de(n).x-4}px, calc(100% - 408px))`,top:`clamp(8px, ${de(n).y-4}px, calc(100% - ${Z?340:128}px))`},children:[!Z&&x("button",{type:"button",className:"feedback-hover-preview","aria-label":`Expand comment: ${n.text||n.attachments?.map(e=>e.name).join(", ")}`,onClick:()=>{Ia(n)},children:[u("span",{className:"feedback-avatar",children:n.authorImage?u("img",{src:n.authorImage,alt:"",width:24,height:24}):n.author.slice(0,1).toUpperCase()}),x("span",{className:"feedback-hover-copy",children:[x("span",{className:"feedback-hover-byline",children:[u("strong",{children:n.author}),u("time",{dateTime:n.date,children:ao(n.date)})]}),u("span",{className:"feedback-hover-message",children:n.text||n.attachments?.map(e=>e.name).join(", ")})]})]}),x("div",{className:"feedback-thread-content",hidden:!Z,children:[x("header",{className:"feedback-thread-header",children:[u(ra,{onMoveStart:()=>{O.current=null,N.current?.cancel(),La()}}),x("div",{className:"feedback-thread-header-actions",children:[n.authorId===a.id&&u("button",{className:"feedback-thread-close",type:"button",title:"Edit comment","aria-label":"Edit comment",disabled:!n.selector,onClick:()=>{po(n)},children:u(Qe,{size:16})}),u("button",{className:"feedback-thread-close",type:"button",title:et,"aria-label":et,"aria-busy":!!xa,disabled:Re||!!o&&!l&&n.authorId!==a.id,onClick:()=>{qe({type:"resolve",id:n.id,resolved:!n.resolved})},children:xa?u(be,{size:18,className:"chisel-spin"}):n.resolved?u(ea,{size:18}):u(Ce,{size:18})}),(!o||o.delete)&&(!o||n.authorId===a.id||l)&&u("button",{className:"feedback-thread-close feedback-thread-delete",type:"button",title:"Delete comment","aria-label":"Delete comment",disabled:Re,onClick:()=>{xo(n)},children:u(ke,{size:16})}),u("button",{className:"feedback-thread-close",type:"button",title:"Close thread","aria-label":"Close thread",onClick:tt,children:u(ta,{size:18})})]})]}),u("div",{className:"feedback-thread-summary",children:!p&&x("button",{type:"button",className:"feedback-thread-summary-button","aria-label":`Expand comment: ${n.text}`,"aria-expanded":Z,onClick:La,children:[u("span",{className:"feedback-avatar",children:n.authorImage?u("img",{src:n.authorImage,alt:"",width:27,height:27}):n.author.slice(0,1).toUpperCase()}),x("span",{className:"feedback-thread-summary-copy",children:[x("span",{className:"feedback-thread-byline",children:[u("strong",{children:n.author}),u("time",{dateTime:n.date,children:new Date(n.date).toLocaleDateString(void 0,{month:"short",day:"numeric"})})]}),u("span",{className:"feedback-thread-message",children:n.text}),!Z&&u("span",{className:"feedback-thread-reply-count",children:n.replies.length?`${n.replies.length} ${n.replies.length===1?"reply":"replies"}`:"Reply\u2026"})]})]})}),!!n.changes?.length&&u("div",{className:"feedback-proposal-actions",children:x("button",{type:"button",className:"feedback-preview","aria-pressed":le===n.id,disabled:!n.selector,onClick:()=>{Y(""),Me(le===n.id?null:n.id)},children:[u(Ke,{size:16}),le===n.id?"Exit preview":"Preview changes"]})}),(Z||p)&&u(sa,{children:p?p.renderThread({comment:n,expanded:Z,reply:Le,saving:Re,submittingReply:pe?.type==="reply"&&pe.id===n.id,canResolve:!o||l||n.authorId===a.id,replyAuthor:a,onAttachmentDraftChange:e=>{xe.current=e},onReplyText:e=>{ce(e),te.current=null},onReply:async(e,d,c,C)=>{if(!e.trim()&&!c?.length)return!1;let E=await qe({type:"reply",id:n.id,body:d,attachmentTokens:c,reply:{id:te.current??(te.current=crypto.randomUUID()),text:e.trimEnd(),author:a.name,authorId:a.id,authorImage:a.image}},C);return E&&(ce(""),te.current=null),E},onResolve:()=>{qe({type:"resolve",id:n.id,resolved:!n.resolved})},onExpand:La}):x(sa,{children:[u("div",{className:"feedback-thread-replies",children:n.replies.map((e,d)=>x("div",{className:"feedback-thread-reply",children:[u("span",{className:"feedback-avatar","aria-hidden":"true",children:(typeof e=="string"?"?":e.author.slice(0,1)).toUpperCase()}),x("div",{children:[typeof e!="string"&&u("strong",{children:e.author}),u("p",{children:typeof e=="string"?e:e.text})]})]},d))}),x("form",{hidden:pe?.type==="reply"&&pe.id===n.id,onSubmit:async e=>{e.preventDefault(),Le.trim()&&await qe({type:"reply",id:n.id,reply:{id:te.current??(te.current=crypto.randomUUID()),text:Le.trimEnd(),author:a.name,authorId:a.id,authorImage:a.image}})&&(ce(""),te.current=null)},children:[u("textarea",{ref:W,"aria-label":"Reply",rows:1,placeholder:"Write a reply\u2026",value:Le,maxLength:4e3,onChange:e=>{ce(e.target.value),te.current=null},disabled:Re,required:!0}),u("div",{className:"feedback-thread-actions",children:x("button",{type:"submit",className:"feedback-primary",disabled:Re||!Le.trim(),"aria-label":"Reply",children:["Reply ",u(Ve,{})]})})]})]})})]})]},n.id),D==="comment"&&[ia,de(h??n??so??{x:0,y:0}).rect].map((e,d)=>e&&u("div",{"data-testid":d===0?"element-hover":"element-selection",className:`feedback-element-box ${d===1?"is-selected":""}`,style:{left:e.left,top:e.top,width:e.width,height:e.height}},d)),D!=="edit"&&w.filter(e=>e.path===g&&!e.resolved).map(e=>{let d=Aa(e);return x("button",{"aria-label":`Open comment: ${e.text}`,title:d.map(c=>c.author).join(", "),className:`feedback-pin ${d.length>1?"feedback-pin-group":""} ${X===e.id?"selected":""}`,onPointerEnter:c=>{c.pointerType!=="touch"&&ot(e)},onPointerLeave:()=>N.current?.schedule(),style:{left:de(e).x,top:de(e).y},onClick:()=>Ia(e),children:[d.slice(0,3).map((c,C)=>u("span",{className:"feedback-avatar","aria-hidden":"true",children:c.authorImage?u("img",{src:c.authorImage,alt:"",width:24,height:24}):c.author.slice(0,1).toUpperCase()},C)),d.length>3&&x("span",{className:"feedback-avatar feedback-pin-more","aria-hidden":"true",children:["+",d.length-3]})]},e.id)}),h?.selector&&K?.querySelector(h.selector)&&u(Oa,{target:K.querySelector(h.selector),text:io,onText:ze,onDraftChange:e=>{P.current=e},hidden:pe?.type==="create",editing:!!R,commentId:R??void 0,renderComposer:p?.renderComposer,changes:w.find(e=>e.id===R)?.changes,hasExistingAttachments:!!w.find(e=>e.id===R)?.attachments?.length,onCancel:()=>{y(null),ze(""),j(null)},onPost:(e,d,c,C,E)=>R?qe({type:"edit",id:R,text:d,changes:e,body:c,attachmentTokens:C}):qe({type:"create",body:c,attachmentTokens:C,comment:{id:ha.current??(ha.current=crypto.randomUUID()),path:g,...h,text:d,author:a.name,authorId:a.id,authorImage:a.image,date:new Date().toISOString(),resolved:!1,replies:[],changes:e}},E),style:{left:de(h).x+44,top:de(h).y}},`${h.selector}:${h.x}:${h.y}`)]})]}),x("div",{className:"feedback-toolbar","aria-label":"Preview mode",children:[Ba&&x("button",{title:"Edit styles","aria-keyshortcuts":"E","aria-pressed":D==="edit",onClick:()=>ga("edit"),children:[u(De,{}),u("span",{children:"Edit"})]}),x("button",{title:"Add comments","aria-keyshortcuts":"C","aria-pressed":D==="comment",onClick:()=>ga("comment"),children:[u(Ue,{}),u("span",{children:"Comment"})]}),x("button",{title:"View website","aria-keyshortcuts":"V","aria-pressed":D==="view",onClick:()=>ga("view"),children:[u(Je,{}),u("span",{children:"View"})]})]})]}),u("aside",{className:"feedback-sidebar",hidden:D==="edit"||Q,children:x("div",{className:"feedback-sidebar-panel",children:[x("div",{className:"feedback-sidebar-title",children:[x("h1",{children:["Comments ",u("span",{children:w.length})]}),x("details",{className:"feedback-account",children:[u("summary",{title:`Signed in as ${a.name}`,"aria-label":`Account: ${a.name}`,children:u("span",{className:"feedback-avatar",children:a.image?u("img",{src:a.image,alt:"",width:27,height:27}):a.name.slice(0,1).toUpperCase()})}),x("div",{children:[u("strong",{children:a.name}),u("span",{children:a.email}),x("button",{onClick:async()=>{try{await r(),window.location.reload()}catch{Y("Sign out failed. Please try again.")}},children:[u(_e,{}),"Sign out"]})]})]})]}),x("label",{className:"feedback-search",children:[u(aa,{"aria-hidden":"true",size:18}),u("input",{type:"search","aria-label":"Search comments",placeholder:"Search",value:fa,onChange:e=>no(e.target.value)})]}),s&&(s.status!=="connected"||s.participants.length>0||s.unreadThreadIds.length>0)&&x("div",{className:"feedback-collaboration","aria-label":"Review activity",children:[s.status!=="connected"&&u("span",{role:"status",children:s.status==="connecting"||s.status==="initial"?"Connecting\u2026":"Reconnecting\u2026"}),u("div",{className:"feedback-reviewers",children:s.participants.map(e=>u("span",{className:"feedback-avatar",title:`${e.name} \xB7 ${e.path}`,"aria-label":`${e.name} is reviewing ${e.path}`,children:e.image?u("img",{src:e.image,alt:"",width:24,height:24}):e.name.slice(0,1).toUpperCase()},e.id))}),s.unreadThreadIds.length>0&&x("span",{className:"feedback-unread-count",children:[s.unreadThreadIds.length," unread"]})]}),u("div",{className:"feedback-tabs",role:"group","aria-label":"Filter comments",children:["open","resolved","all"].map(e=>u("button",{"aria-pressed":Ne===e,onClick:()=>fo(e),children:e[0].toUpperCase()+e.slice(1)},e))}),Ka&&u("p",{role:"alert",className:"feedback-error",children:Ka}),x("div",{className:"feedback-comment-list",children:[dt.map(e=>u("article",{onPointerEnter:d=>{d.pointerType!=="touch"&&ot(e)},onPointerLeave:()=>N.current?.schedule(),className:`feedback-comment ${X===e.id?"active":""}`,children:x("button",{className:"feedback-comment-main","aria-pressed":X===e.id,onClick:()=>Ia(e),children:[x("span",{className:"feedback-comment-heading",children:[u("span",{className:"feedback-avatar",children:e.authorImage?u("img",{src:e.authorImage,alt:"",width:28,height:28}):e.author.slice(0,1).toUpperCase()}),x("span",{className:"feedback-comment-identity",children:[x("span",{className:"feedback-comment-meta",children:[u("strong",{children:e.author}),e.pending?u("span",{role:"status",children:"Sending\u2026"}):u("time",{dateTime:e.date,children:new Date(e.date).toLocaleDateString(void 0,{month:"short",day:"numeric"})})]}),x("span",{className:"feedback-comment-status",children:[Ne==="all"&&x(sa,{children:[e.resolved?"Resolved":"Open",u("span",{"aria-hidden":"true",children:" \xB7 "})]}),u("span",{className:"feedback-comment-path",title:e.path,children:e.path})]})]}),s?.unreadThreadIds.includes(e.id)&&u("span",{className:"feedback-comment-unread-dot","aria-hidden":"true"})]}),u("span",{className:"feedback-comment-body",children:e.text||e.attachments?.map(d=>d.name).join(", ")}),(e.replies.length>0||s?.unreadThreadIds.includes(e.id))&&x("span",{className:"feedback-comment-activity",children:[e.replies.length>0&&x(sa,{children:[u("span",{className:"feedback-comment-avatars",children:Aa(e).slice(1,4).map((d,c)=>u("span",{className:"feedback-avatar",title:d.author,children:d.authorImage?u("img",{src:d.authorImage,alt:"",width:20,height:20}):d.author.slice(0,1).toUpperCase()},c))}),x("span",{className:"feedback-comment-reply-count",children:[e.replies.length," ",e.replies.length===1?"reply":"replies"]})]}),s?.unreadThreadIds.includes(e.id)&&u("span",{className:"feedback-unread-label",children:e.replies.length?"New replies":"Unread"})]})]})},e.id)),$a&&u("p",{role:"status",children:"Loading shared comments\u2026"}),!$a&&!dt.length&&x("div",{className:"feedback-empty",children:[u("span",{children:u(Ue,{size:30})}),u("h2",{children:fa.trim()?"No matching comments":Ne==="resolved"?"Nothing resolved yet":"No comments yet"}),u("p",{children:fa.trim()?"Try another name, phrase, or page.":Ne==="resolved"?"Resolved threads will appear here.":"Click anywhere on the page to leave your first comment."})]})]}),u(Na,{path:g,disabled:Re||!K,onNavigate:ho,onOpen:mo,routes:[...new Set([g,...F,...V,...w.map(e=>e.path)])].filter(e=>K&&Be(e,window.location.origin)).sort((e,d)=>e.localeCompare(d))}),f&&l&&x("details",{className:"feedback-review-invite",children:[x("summary",{children:[u(Ae,{"aria-hidden":"true"}),"Share review link"]}),x("form",{onSubmit:e=>{e.preventDefault(),at()},children:[u("p",{children:"Anyone with this link can sign in and review this website."}),u("button",{type:"submit",className:"feedback-primary",disabled:pa,children:pa?"Preparing link\u2026":"Copy review link"}),ja&&x(sa,{children:[u("input",{"aria-label":"Review link",value:ja,readOnly:!0,onFocus:e=>e.currentTarget.select()}),u("button",{type:"button",onClick:()=>{at(!0)},disabled:pa,children:"Replace invitation link"}),u("p",{children:"Replacing the link blocks new joins through the old link. Existing reviewers keep access."})]}),Ja&&u("p",{role:"status",children:Ja})]})]})]})})]})]})}import{jsx as Uo}from"react/jsx-runtime";import{useEffect as lo,useSyncExternalStore as Ho}from"react";import{Chisel as Oo}from"use-chisel";function Eo(a){return window.addEventListener("chisel:mode",a),()=>window.removeEventListener("chisel:mode",a)}function zo(){try{return window.self!==window.top&&window.parent.location.origin===window.location.origin&&window.parent.location.pathname==="/chisel"?document.documentElement.dataset.chiselMode??"view":"site"}catch{return"site"}}function No({projectName:a="Chisel"}){let t=Ho(Eo,zo,()=>"site");return lo(()=>{window.chiselReady=!0,document.dispatchEvent(new Event("chisel:ready"))},[]),lo(()=>{if(t!=="edit")return;let r=window.setTimeout(()=>window.dispatchEvent(new Event("chisel:select")),50);return()=>window.clearTimeout(r)},[t]),t==="site"||process.env.NODE_ENV==="production"?null:Uo(Oo,{embedded:!0,enabled:t==="edit",projectName:a})}export{No as ChiselPreview,ro as ChiselWorkspace,Wa as ChiselWorkspaceStyles};
+    `,e.head.append(E),C.dataset.chiselMode=i.current,C.dataset.chiselCommentsHidden=String(ye.current),d.dispatchEvent(new Event("chisel:mode")),d.addEventListener("chisel:selection",A=>{let U=A.detail;Fe(U),U.selector&&(C.dataset.chiselSelection=U.selector)});let $=()=>Ya({x:d.scrollX,y:d.scrollY});$(),d.addEventListener("scroll",$),d.addEventListener("resize",()=>{ue(null),$()}),e.addEventListener("scroll",()=>{ue(null),$()},!0),e.addEventListener("mousemove",A=>{let U=A.target;ue(i.current==="comment"&&!ye.current&&U?.nodeType===1?U.getBoundingClientRect():null)},!0),e.addEventListener("mouseleave",()=>ue(null)),e.addEventListener("keydown",A=>{A.key==="Escape"&&!ie.current&&(y(null),re(null),ue(null),Fe(null),delete C.dataset.chiselSelection)}),e.addEventListener("click",async A=>{let U=A.target;if(!U||U.nodeType!==1||U.closest("[data-chisel-root]")||i.current==="view"||i.current==="comment"&&ye.current||i.current==="comment"&&(A.preventDefault(),A.stopImmediatePropagation(),!await Te()))return;ge();let me=U.getBoundingClientRect(),oe={x:A.clientX+d.scrollX,y:A.clientY+d.scrollY,selector:oo(U),tag:U.tagName.toLowerCase(),offsetX:me.width?(A.clientX-me.left)/me.width:0,offsetY:me.height?(A.clientY-me.top)/me.height:0};Fe(oe),C.dataset.chiselSelection=oe.selector,i.current!=="edit"&&(A.preventDefault(),A.stopImmediatePropagation(),re(null),ze(""),ue(null),j(null),ha.current=crypto.randomUUID(),y(oe))},!0)}Se(()=>{let e=K?.defaultView;if(e)return Kt(e,d=>{if(!Be(d,window.location.origin))return;M(d),G(C=>C.includes(d)?C:[...C,d]);let c=new URL(window.location.href);d==="/"?c.searchParams.delete("path"):c.searchParams.set("path",d),window.history.replaceState(window.history.state,"",c)})},[K]),Se(()=>{K&&(K.documentElement.dataset.chiselCommentsHidden=String(Q))},[Q,K]),Se(()=>()=>N.current?.cancel(),[]),Se(()=>{if(!o)return;let e=!1,d,c=()=>{clearTimeout(d),d=setTimeout(()=>{d=void 0,C()},1e4)},C=async()=>{if(e||document.visibilityState==="hidden")return;if(ie.current){c();return}clearTimeout(d),d=void 0;let A=++ve.current;try{let U=await o.list();!e&&A===ve.current&&(clearTimeout(d),d=void 0,b(U),na(!1),Y(""))}catch{!e&&A===ve.current&&(na(!1),Y("Shared comments could not be loaded. Check your connection; retrying automatically."),c())}};C();let E=o.subscribe?.(()=>{C()}),$=o.subscribe?void 0:window.setInterval(()=>{C()},1e4);return window.addEventListener("focus",C),document.addEventListener("visibilitychange",C),()=>{e=!0,clearTimeout(d),E?.(),window.clearInterval($),window.removeEventListener("focus",C),document.removeEventListener("visibilitychange",C)}},[o]);let rt=s?.setPage;Se(()=>{rt?.(g)},[g,rt]),Da(()=>{let e=W.current;e&&(e.style.height="auto",e.style.height=`${e.scrollHeight+e.offsetHeight-e.clientHeight}px`)},[Le,Z,n?.id,Q,D,g]),Da(()=>{let e=k.current?.parentElement,d=e?.querySelector(".comment-box");if(!h||!e||!d||Q)return;let c=()=>{let E=Qt(de(h),{width:d.offsetWidth,height:d.offsetHeight},{width:e.clientWidth,height:e.clientHeight});d.style.left=`${E.left}px`,d.style.top=`${E.top}px`,d.style.maxHeight=`${E.maxHeight}px`};c();let C=new ResizeObserver(c);return C.observe(d),C.observe(e),()=>C.disconnect()}),Da(()=>{let e=m.current;if(!e||Q||q.current?.playState==="running")return;let d=e.parentElement?.parentElement,c=d?.clientHeight??356,C=d?.clientWidth??416,E=Number(e.dataset.pinX),$=Number(e.dataset.pinY),A=Z?Math.max(8,Math.min($-40,c-Math.min(340,c-16)-8)):Math.max(8,Math.min($+32-e.offsetHeight,c-e.offsetHeight-8)),U=Z?E+44:E;e.style.left=`${Math.max(8,Math.min(U,C-e.offsetWidth-8))}px`,e.style.top=`${A}px`,e.style.maxHeight=`${c-A-8}px`}),Da(()=>(ee.current=!1,q.current=m.current&&!Q?va(m.current):null,()=>{ee.current=!1,q.current?.cancel()}),[n?.id,!!h,D,Q,g]),Se(()=>{k.current?.contentDocument?.readyState==="complete"&&Ta()},[]),Se(()=>{let e=d=>{if(document.querySelector('dialog[open], [aria-modal="true"]'))return;let c=_t(d);if(!(!c||c===i.current||c==="edit"&&!Ba)){if(d.preventDefault(),d.stopPropagation(),c==="toggle-comments"){N.current?.cancel(),ge(),Ee(C=>!C);return}ga(c)}};return document.addEventListener("keydown",e,!0),K?.addEventListener("keydown",e,!0),()=>{document.removeEventListener("keydown",e,!0),K?.removeEventListener("keydown",e,!0)}},[K]),Se(()=>{if(!n||le!==n.id||h||D==="edit"||n.path!==g||!n.selector||!K)return;let e;try{e=K.querySelector(n.selector)}catch{e=null}if(!e){Me(null),Y("This element is no longer on the page. Its saved changes cannot be previewed.");return}let d=ka(e,n.changes??[]);return we.current=d,Ya({x:e.ownerDocument.defaultView.scrollX,y:e.ownerDocument.defaultView.scrollY}),d},[le,n,h,D,g,K]);let dt=eo(w,Ne,fa);return x("main",{"aria-label":"Chisel workspace",className:`feedback-shell ${p?.className??""} ${D==="edit"?"is-editing":""} ${Q?"comments-hidden":""}`,children:[u(Wa,{}),S,x("div",{className:"feedback-workspace",children:[x("section",{className:"feedback-canvas","aria-label":"Website preview",children:[x("div",{className:"feedback-viewport",children:[u("iframe",{ref:k,src:"/",title:"Website for feedback",onLoad:Ta}),x("div",{className:"feedback-comment-layer","data-hover-preview":!!(n&&!Z&&!h),hidden:Q,children:[h&&pe?.type!=="create"&&u("span",{className:"feedback-pin comment-box-draft-pin","aria-hidden":"true",style:{left:de(h).x,top:de(h).y}}),n&&!h&&D!=="edit"&&n.path===g&&x("section",{ref:m,"data-pin-x":de(n).x,"data-pin-y":de(n).y,"data-pin-width":40+(Math.min(Aa(n).length,4)-1)*20,"data-expanded":Z,onPointerEnter:()=>{ee.current||N.current?.cancel()},onPointerMove:Ra,onPointerLeave:()=>N.current?.schedule(),onFocus:Ra,onBlur:e=>{e.currentTarget.contains(e.relatedTarget)||N.current?.schedule()},"data-native-ui":!!p,className:"feedback-composer feedback-thread-popup comment-thread",role:"dialog","aria-label":"Comment thread",style:{left:`clamp(8px, ${de(n).x-4}px, calc(100% - 408px))`,top:`clamp(8px, ${de(n).y-4}px, calc(100% - ${Z?340:128}px))`},children:[!Z&&x("button",{type:"button",className:"feedback-hover-preview","aria-label":`Expand comment: ${n.text||n.attachments?.map(e=>e.name).join(", ")}`,onClick:()=>{Ia(n)},children:[u("span",{className:"feedback-avatar",children:n.authorImage?u("img",{src:n.authorImage,alt:"",width:24,height:24}):n.author.slice(0,1).toUpperCase()}),x("span",{className:"feedback-hover-copy",children:[x("span",{className:"feedback-hover-byline",children:[u("strong",{children:n.author}),u("time",{dateTime:n.date,children:ao(n.date)})]}),u("span",{className:"feedback-hover-message",children:n.text||n.attachments?.map(e=>e.name).join(", ")})]})]}),x("div",{className:"feedback-thread-content",hidden:!Z,children:[x("header",{className:"feedback-thread-header",children:[u(ra,{onMoveStart:()=>{O.current=null,N.current?.cancel(),La()}}),x("div",{className:"feedback-thread-header-actions",children:[n.authorId===a.id&&u("button",{className:"feedback-thread-close",type:"button",title:"Edit comment","aria-label":"Edit comment",disabled:!n.selector,onClick:()=>{po(n)},children:u(Qe,{size:16})}),u("button",{className:"feedback-thread-close",type:"button",title:et,"aria-label":et,"aria-busy":!!xa,disabled:Re||!!o&&!l&&n.authorId!==a.id,onClick:()=>{qe({type:"resolve",id:n.id,resolved:!n.resolved})},children:xa?u(be,{size:18,className:"chisel-spin"}):n.resolved?u(ea,{size:18}):u(Ce,{size:18})}),(!o||o.delete)&&(!o||n.authorId===a.id||l)&&u("button",{className:"feedback-thread-close feedback-thread-delete",type:"button",title:"Delete comment","aria-label":"Delete comment",disabled:Re,onClick:()=>{xo(n)},children:u(ke,{size:16})}),u("button",{className:"feedback-thread-close",type:"button",title:"Close thread","aria-label":"Close thread",onClick:tt,children:u(ta,{size:18})})]})]}),u("div",{className:"feedback-thread-summary",children:!p&&x("button",{type:"button",className:"feedback-thread-summary-button","aria-label":`Expand comment: ${n.text}`,"aria-expanded":Z,onClick:La,children:[u("span",{className:"feedback-avatar",children:n.authorImage?u("img",{src:n.authorImage,alt:"",width:27,height:27}):n.author.slice(0,1).toUpperCase()}),x("span",{className:"feedback-thread-summary-copy",children:[x("span",{className:"feedback-thread-byline",children:[u("strong",{children:n.author}),u("time",{dateTime:n.date,children:new Date(n.date).toLocaleDateString(void 0,{month:"short",day:"numeric"})})]}),u("span",{className:"feedback-thread-message",children:n.text}),!Z&&u("span",{className:"feedback-thread-reply-count",children:n.replies.length?`${n.replies.length} ${n.replies.length===1?"reply":"replies"}`:"Reply\u2026"})]})]})}),!!n.changes?.length&&u("div",{className:"feedback-proposal-actions",children:x("button",{type:"button",className:"feedback-preview","aria-pressed":le===n.id,disabled:!n.selector,onClick:()=>{Y(""),Me(le===n.id?null:n.id)},children:[u(Ke,{size:16}),le===n.id?"Exit preview":"Preview changes"]})}),(Z||p)&&u(sa,{children:p?p.renderThread({comment:n,expanded:Z,reply:Le,saving:Re,submittingReply:pe?.type==="reply"&&pe.id===n.id,canResolve:!o||l||n.authorId===a.id,replyAuthor:a,onAttachmentDraftChange:e=>{xe.current=e},onReplyText:e=>{ce(e),te.current=null},onReply:async(e,d,c,C)=>{if(!e.trim()&&!c?.length)return!1;let E=await qe({type:"reply",id:n.id,body:d,attachmentTokens:c,reply:{id:te.current??(te.current=crypto.randomUUID()),text:e.trimEnd(),author:a.name,authorId:a.id,authorImage:a.image}},C);return E&&(ce(""),te.current=null),E},onResolve:()=>{qe({type:"resolve",id:n.id,resolved:!n.resolved})},onExpand:La}):x(sa,{children:[u("div",{className:"feedback-thread-replies",children:n.replies.map((e,d)=>x("div",{className:"feedback-thread-reply",children:[u("span",{className:"feedback-avatar","aria-hidden":"true",children:(typeof e=="string"?"?":e.author.slice(0,1)).toUpperCase()}),x("div",{children:[typeof e!="string"&&u("strong",{children:e.author}),u("p",{children:typeof e=="string"?e:e.text})]})]},d))}),x("form",{hidden:pe?.type==="reply"&&pe.id===n.id,onSubmit:async e=>{e.preventDefault(),Le.trim()&&await qe({type:"reply",id:n.id,reply:{id:te.current??(te.current=crypto.randomUUID()),text:Le.trimEnd(),author:a.name,authorId:a.id,authorImage:a.image}})&&(ce(""),te.current=null)},children:[u("textarea",{ref:W,"aria-label":"Reply",rows:1,placeholder:"Write a reply\u2026",value:Le,maxLength:4e3,onChange:e=>{ce(e.target.value),te.current=null},disabled:Re,required:!0}),u("div",{className:"feedback-thread-actions",children:x("button",{type:"submit",className:"feedback-primary",disabled:Re||!Le.trim(),"aria-label":"Reply",children:["Reply ",u(Ve,{})]})})]})]})})]})]},n.id),D==="comment"&&[ia,de(h??n??so??{x:0,y:0}).rect].map((e,d)=>e&&u("div",{"data-testid":d===0?"element-hover":"element-selection",className:`feedback-element-box ${d===1?"is-selected":""}`,style:{left:e.left,top:e.top,width:e.width,height:e.height}},d)),D!=="edit"&&w.filter(e=>e.path===g&&!e.resolved).map(e=>{let d=Aa(e);return x("button",{"aria-label":`Open comment: ${e.text}`,title:d.map(c=>c.author).join(", "),className:`feedback-pin ${d.length>1?"feedback-pin-group":""} ${X===e.id?"selected":""}`,onPointerEnter:c=>{c.pointerType!=="touch"&&ot(e)},onPointerLeave:()=>N.current?.schedule(),style:{left:de(e).x,top:de(e).y},onClick:()=>Ia(e),children:[d.slice(0,3).map((c,C)=>u("span",{className:"feedback-avatar","aria-hidden":"true",children:c.authorImage?u("img",{src:c.authorImage,alt:"",width:24,height:24}):c.author.slice(0,1).toUpperCase()},C)),d.length>3&&x("span",{className:"feedback-avatar feedback-pin-more","aria-hidden":"true",children:["+",d.length-3]})]},e.id)}),h?.selector&&K?.querySelector(h.selector)&&u(Oa,{target:K.querySelector(h.selector),text:io,onText:ze,onDraftChange:e=>{P.current=e},hidden:pe?.type==="create",editing:!!R,commentId:R??void 0,renderComposer:p?.renderComposer,changes:w.find(e=>e.id===R)?.changes,hasExistingAttachments:!!w.find(e=>e.id===R)?.attachments?.length,onCancel:()=>{y(null),ze(""),j(null)},onPost:(e,d,c,C,E)=>R?qe({type:"edit",id:R,text:d,changes:e,body:c,attachmentTokens:C}):qe({type:"create",body:c,attachmentTokens:C,comment:{id:ha.current??(ha.current=crypto.randomUUID()),path:g,...h,text:d,author:a.name,authorId:a.id,authorImage:a.image,date:new Date().toISOString(),resolved:!1,replies:[],changes:e}},E),style:{left:de(h).x+44,top:de(h).y}},`${h.selector}:${h.x}:${h.y}`)]})]}),x("div",{className:"feedback-toolbar","aria-label":"Preview mode",children:[Ba&&x("button",{title:"Edit styles","aria-keyshortcuts":"E","aria-pressed":D==="edit",onClick:()=>ga("edit"),children:[u(De,{}),u("span",{children:"Edit"})]}),x("button",{title:"Add comments","aria-keyshortcuts":"C","aria-pressed":D==="comment",onClick:()=>ga("comment"),children:[u(Ue,{}),u("span",{children:"Comment"})]}),x("button",{title:"View website","aria-keyshortcuts":"V","aria-pressed":D==="view",onClick:()=>ga("view"),children:[u(Je,{}),u("span",{children:"View"})]})]})]}),u("aside",{className:"feedback-sidebar",hidden:D==="edit"||Q,children:x("div",{className:"feedback-sidebar-panel",children:[x("div",{className:"feedback-sidebar-title",children:[x("h1",{children:["Comments ",u("span",{children:w.length})]}),x("details",{className:"feedback-account",children:[u("summary",{title:`Signed in as ${a.name}`,"aria-label":`Account: ${a.name}`,children:u("span",{className:"feedback-avatar",children:a.image?u("img",{src:a.image,alt:"",width:27,height:27}):a.name.slice(0,1).toUpperCase()})}),x("div",{children:[u("strong",{children:a.name}),u("span",{children:a.email}),x("button",{onClick:async()=>{try{await r(),window.location.reload()}catch{Y("Sign out failed. Please try again.")}},children:[u(_e,{}),"Sign out"]})]})]})]}),x("label",{className:"feedback-search",children:[u(aa,{"aria-hidden":"true",size:18}),u("input",{type:"search","aria-label":"Search comments",placeholder:"Search",value:fa,onChange:e=>no(e.target.value)})]}),s&&(s.status!=="connected"||s.participants.length>0||s.unreadThreadIds.length>0)&&x("div",{className:"feedback-collaboration","aria-label":"Review activity",children:[s.status!=="connected"&&u("span",{role:"status",children:s.status==="connecting"||s.status==="initial"?"Connecting\u2026":"Reconnecting\u2026"}),u("div",{className:"feedback-reviewers",children:s.participants.map(e=>u("span",{className:"feedback-avatar",title:`${e.name} \xB7 ${e.path}`,"aria-label":`${e.name} is reviewing ${e.path}`,children:e.image?u("img",{src:e.image,alt:"",width:24,height:24}):e.name.slice(0,1).toUpperCase()},e.id))}),s.unreadThreadIds.length>0&&x("span",{className:"feedback-unread-count",children:[s.unreadThreadIds.length," unread"]})]}),u("div",{className:"feedback-tabs",role:"group","aria-label":"Filter comments",children:["open","resolved","all"].map(e=>u("button",{"aria-pressed":Ne===e,onClick:()=>fo(e),children:e[0].toUpperCase()+e.slice(1)},e))}),Ka&&u("p",{role:"alert",className:"feedback-error",children:Ka}),x("div",{className:"feedback-comment-list",children:[dt.map(e=>u("article",{onPointerEnter:d=>{d.pointerType!=="touch"&&ot(e)},onPointerLeave:()=>N.current?.schedule(),className:`feedback-comment ${X===e.id?"active":""}`,children:x("button",{className:"feedback-comment-main","aria-pressed":X===e.id,onClick:()=>Ia(e),children:[x("span",{className:"feedback-comment-heading",children:[u("span",{className:"feedback-avatar",children:e.authorImage?u("img",{src:e.authorImage,alt:"",width:28,height:28}):e.author.slice(0,1).toUpperCase()}),x("span",{className:"feedback-comment-identity",children:[x("span",{className:"feedback-comment-meta",children:[u("strong",{children:e.author}),e.pending?u("span",{role:"status",children:"Sending\u2026"}):u("time",{dateTime:e.date,children:new Date(e.date).toLocaleDateString(void 0,{month:"short",day:"numeric"})})]}),x("span",{className:"feedback-comment-status",children:[Ne==="all"&&x(sa,{children:[e.resolved?"Resolved":"Open",u("span",{"aria-hidden":"true",children:" \xB7 "})]}),u("span",{className:"feedback-comment-path",title:e.path,children:e.path})]})]}),s?.unreadThreadIds.includes(e.id)&&u("span",{className:"feedback-comment-unread-dot","aria-hidden":"true"})]}),u("span",{className:"feedback-comment-body",children:e.text||e.attachments?.map(d=>d.name).join(", ")}),(e.replies.length>0||s?.unreadThreadIds.includes(e.id))&&x("span",{className:"feedback-comment-activity",children:[e.replies.length>0&&x(sa,{children:[u("span",{className:"feedback-comment-avatars",children:Aa(e).slice(1,4).map((d,c)=>u("span",{className:"feedback-avatar",title:d.author,children:d.authorImage?u("img",{src:d.authorImage,alt:"",width:20,height:20}):d.author.slice(0,1).toUpperCase()},c))}),x("span",{className:"feedback-comment-reply-count",children:[e.replies.length," ",e.replies.length===1?"reply":"replies"]})]}),s?.unreadThreadIds.includes(e.id)&&u("span",{className:"feedback-unread-label",children:e.replies.length?"New replies":"Unread"})]})]})},e.id)),$a&&u("p",{role:"status",children:"Loading shared comments\u2026"}),!$a&&!dt.length&&x("div",{className:"feedback-empty",children:[u("span",{children:u(Ue,{size:30})}),u("h2",{children:fa.trim()?"No matching comments":Ne==="resolved"?"Nothing resolved yet":"No comments yet"}),u("p",{children:fa.trim()?"Try another name, phrase, or page.":Ne==="resolved"?"Resolved threads will appear here.":"Click anywhere on the page to leave your first comment."})]})]}),u(Na,{path:g,disabled:Re||!K,onNavigate:ho,onOpen:mo,routes:[...new Set([g,...F,...V,...w.map(e=>e.path)])].filter(e=>K&&Be(e,window.location.origin)).sort((e,d)=>e.localeCompare(d))}),f&&l&&x("details",{className:"feedback-review-invite",children:[x("summary",{children:[u(Ae,{"aria-hidden":"true"}),"Share review link"]}),x("form",{onSubmit:e=>{e.preventDefault(),at()},children:[u("p",{children:"Anyone with this link can sign in and review this website."}),u("button",{type:"submit",className:"feedback-primary",disabled:pa,children:pa?"Preparing link\u2026":"Copy review link"}),ja&&x(sa,{children:[u("input",{"aria-label":"Review link",value:ja,readOnly:!0,onFocus:e=>e.currentTarget.select()}),u("button",{type:"button",onClick:()=>{at(!0)},disabled:pa,children:"Replace invitation link"}),u("p",{children:"Replacing the link blocks new joins through the old link. Existing reviewers keep access."})]}),Ja&&u("p",{role:"status",children:Ja})]})]})]})})]})]})}import{jsx as Uo}from"react/jsx-runtime";import{useEffect as lo,useSyncExternalStore as Ho}from"react";import{Chisel as Oo}from"use-chisel";function Eo(a){return window.addEventListener("chisel:mode",a),()=>window.removeEventListener("chisel:mode",a)}function zo(){try{return window.self!==window.top&&window.parent.location.origin===window.location.origin&&window.parent.location.pathname==="/chisel"?document.documentElement.dataset.chiselMode??"view":"site"}catch{return"site"}}function No({projectName:a="Chisel"}){let t=Ho(Eo,zo,()=>"site");return lo(()=>{process.env.NEXT_PUBLIC_CHISEL_ENABLED!=="0"&&(window.chiselReady=!0,document.dispatchEvent(new Event("chisel:ready")))},[]),lo(()=>{if(t!=="edit")return;let r=window.setTimeout(()=>window.dispatchEvent(new Event("chisel:select")),50);return()=>window.clearTimeout(r)},[t]),t==="site"||process.env.NODE_ENV==="production"||process.env.NEXT_PUBLIC_CHISEL_ENABLED==="0"?null:Uo(Oo,{embedded:!0,enabled:t==="edit",projectName:a})}export{No as ChiselPreview,ro as ChiselWorkspace,Wa as ChiselWorkspaceStyles};
 /*! Bundled license information:
 
 lucide-react/dist/esm/shared/src/utils/toKebabCase.mjs:

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "use-chisel",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "Dev-only visual editing layer for Next.js apps.",
   "type": "module",
   "keywords": [
@@ -25,6 +25,10 @@
     "chisel": "./bin/chisel.js"
   },
   "exports": {
+    "./hosted": {
+      "types": "./dist/hosted-entry.d.ts",
+      "import": "./dist/hosted-entry.js"
+    },
     "./workspace": {
       "types": "./dist/workspace-entry.d.ts",
       "import": "./dist/workspace-entry.js"
@@ -38,6 +42,7 @@
     "bin/chisel.js",
     "dist/index.js",
     "dist/workspace-entry.js",
+    "dist/hosted-entry.js",
     "dist/**/*.d.ts",
     "README.md"
   ],
@@ -45,7 +50,7 @@
     "access": "public"
   },
   "scripts": {
-    "build": "tsc -p tsconfig.json && esbuild dist/index.js dist/workspace-entry.js --bundle --minify --format=esm --platform=browser --external:react --external:react/jsx-runtime --external:react-dom --external:use-chisel --define:process.env.NODE_ENV=process.env.NODE_ENV --outdir=dist --allow-overwrite",
+    "build": "tsc -p tsconfig.json && esbuild dist/index.js dist/workspace-entry.js dist/hosted-entry.js --bundle --minify --format=esm --platform=browser --external:react --external:react/jsx-runtime --external:react-dom --external:use-chisel --define:process.env.NODE_ENV=process.env.NODE_ENV --outdir=dist --allow-overwrite",
     "prepack": "npm run build",
     "test": "vitest run",
     "typecheck": "tsc -p tsconfig.json --noEmit"