@hazem3500/palette 0.9.108 → 0.9.110

package/dist/onboarding-6OSADOWE.js

@@ -0,0 +1 @@
+import{b as e}from"./chunk-KLPQTFVH.js";import{a as t}from"./chunk-DU7H4TEX.js";import"./chunk-5HZI7HRR.js";import{E as a,F as n,G as s}from"./chunk-4HBBEVFK.js";async function r(e,t=""){let r;try{let a=await e.request(`project/sites${t}`);r=[...a.fixed,...a.sites]}catch{return null}let i=a("div","approved-sites-editor");i.dataset.open="false";let o=a("span","approved-sites-count"),l=s("Sites with comments",()=>{let e="true"!==i.dataset.open;i.dataset.open=String(e),l.setAttribute("aria-expanded",String(e)),c.inert=!e},"approved-sites-toggle");l.replaceChildren(a("span","","Sites with comments"),o,n("chevron")),l.setAttribute("aria-expanded","false");let c=a("div","approved-sites-reveal");c.id=`approved-sites-${crypto.randomUUID()}`,c.inert=!0,l.setAttribute("aria-controls",c.id);let p=a("div","approved-sites-body"),d=a("ul","approved-site-list"),u=a("p","account-usage-status");u.setAttribute("role","status");let v=a("div","approved-site-add"),m=a("input");m.type="text",m.inputMode="url",m.spellcheck=!1,m.placeholder="your-site.com",m.setAttribute("aria-label","Site to approve"),m.setAttribute("autocomplete","off");let b=a("div","account-usage-note account-sites-note");b.append(n("info"),a("span","","Only these sites can show comments. Add * to cover preview links."));let h=async a=>{let n=r;r=a,f(),u.textContent="";try{let n=await e.request(`project/sites${t}`,"PATCH",{sites:a});return r=[...n.fixed,...n.sites],f(),!0}catch(e){return r=n,f(),u.textContent=e instanceof Error?e.message:"Try again.",!1}},y=s("Add",async()=>{let e;try{e=function(e){let t=e.trim().replace(/\/$/,"").toLowerCase();if(/^http:\/\/(localhost|127\.0\.0\.1)(:(\d+|\*))?$/.test(t))return t;let a=/^https:\/\/([^/?#@\s:]+)(:(\d+|\*))?$/.exec(t.includes("://")?t:`https://${t}`),[n="",...s]=(a?.[1]??"").split(".");if(!a||s.length<1||s.join(".").includes("*")||n.split("*").length>2||n.includes("*")&&s.length<2)throw new Error("That doesn’t look like a site. Try your-site.com or *-preview.your-site.com.");return`https://${a[1]}${a[2]??""}`}(m.value)}catch(e){return void(u.textContent=e.message)}if(r.includes(e))return m.value="",void(u.textContent="Already on the list.");let t=m.value;m.value="",y.disabled=!0,await h([...r,e])||(m.value||=t),y.disabled=!1,m.focus()},"secondary");m.addEventListener("keydown",e=>{"Enter"===e.key&&(e.preventDefault(),y.click())}),v.append(m,y);let g=e=>{let t=a("li","approved-site"),n=a("span","",e.replace(/^https:\/\//,""));return n.title=e,t.append(n,s(`Remove ${e}`,()=>{h(r.filter(t=>t!==e))},"icon","close")),t},f=()=>{o.textContent=String(r.length),d.replaceChildren(...r.map(g))};return f(),p.append(d,v,b,u),c.append(p),i.append(l,c),i}var i=new WeakMap;function o(e,n="usage",o=!0,l=!1){let c=a("section","account-usage");c.setAttribute("aria-label","Account usage");let p=(e="")=>{let t=a("span",`usage-skeleton ${e}`);return t.setAttribute("aria-hidden","true"),t},d=e.user?.id,u=e.token,v=()=>e.user?.id===d&&e.token===u,m=i.get(e);m||i.set(e,m=new Map);let b=JSON.stringify([d,u,n]),h=m.get(b);h||m.set(b,h={});let y=e=>{c.setAttribute("aria-busy","false"),c.replaceChildren(a("h3","",`${e.hosted?"Starter plan":"Self-hosted"}${l?" · Local":""}`));let{used:t,limit:n}=e.comments,s=a("div","account-usage-label account-comments"),r=a("span","account-comment-count");if(r.append(a("span","",null===n?`${t.toLocaleString()} / Unlimited`:`${t.toLocaleString()} / ${n.toLocaleString()}`)),s.title="Includes replies and deleted comments.",null!==n){let e=a("span","account-usage-ring");e.setAttribute("role","meter"),e.setAttribute("aria-label","Project comments"),e.setAttribute("aria-valuemin","0"),e.setAttribute("aria-valuemax",String(n)),e.setAttribute("aria-valuenow",String(Math.min(t,n))),e.setAttribute("aria-valuetext",`${t} of ${n} comments used, including replies and deleted comments`),e.style.setProperty("--usage",(n>0?100*Math.min(t/n,1):0)+"%"),e.dataset.full=String(t>=n),r.append(e)}if(s.append(a("span","","Project comments"),r),c.append(s),e.projects){let{used:t,limit:n}=e.projects;if(null===n){let e=a("div","account-usage-label");return e.append(a("span","","Projects"),a("span","",`${t.toLocaleString()} / Unlimited`)),void c.append(e)}let s=a("div","account-projects"),r=a("div","account-usage-label"),i=a("span","account-project-count");i.append(a("strong","",String(t)),a("span","",`of ${n}`)),r.append(a("span","","Projects"),i);let o=a("div","account-project-slots");o.setAttribute("role","meter"),o.setAttribute("aria-label","Projects"),o.setAttribute("aria-valuemin","0"),o.setAttribute("aria-valuemax",String(n)),o.setAttribute("aria-valuenow",String(t)),o.setAttribute("aria-valuetext",`${t} of ${n} projects used`);for(let e=0;e<n;e++){let n=a("span");n.dataset.used=String(e<t),o.append(n)}s.append(r,o),c.append(s)}},g=async()=>{if(!v())return c.replaceChildren(),void c.setAttribute("aria-busy","false");h.value?y(h.value):(()=>{let e=a("div","usage-skeleton-heading");e.append(p("usage-skeleton-title"));let t=a("div","account-usage-label account-comments"),n=a("span","account-comment-count");n.append(p("usage-skeleton-count"),p("usage-skeleton-ring")),t.append(p("usage-skeleton-label"),n);let s=a("div","account-projects"),r=a("div","account-usage-label");r.append(p("usage-skeleton-label"),p("usage-skeleton-count"));let i=a("div","account-project-slots");i.setAttribute("aria-hidden","true"),i.append(a("span"),a("span"),a("span")),s.append(r,i);let o=a("span","sr-only","Loading account usage");o.setAttribute("role","status"),c.setAttribute("aria-busy","true"),c.replaceChildren(e,t,s,o)})(),c.setAttribute("aria-busy","true");try{let t,a=h.pending??=e.request(n);try{t=await a}finally{h.pending===a&&(h.pending=void 0)}if(!v())return delete h.value,c.replaceChildren(),void c.setAttribute("aria-busy","false");if(h.value=t,!c.isConnected)return;y(t),o&&e.user?.verified&&(async()=>{let t=n.includes("?")?n.slice(n.indexOf("?")):"",a=await r(e,t);a&&h.value&&c.isConnected&&v()&&c.append(a)})().catch(()=>{})}catch(e){if(e instanceof t&&(401===e.status||403===e.status)&&delete h.value,!v())return delete h.value,c.replaceChildren(),void c.setAttribute("aria-busy","false");if(!c.isConnected)return;h.value?y(h.value):c.replaceChildren(),c.setAttribute("aria-busy","false");let n=a("span","account-usage-status",h.value?"Couldn’t refresh usage":"Usage unavailable");n.setAttribute("role","status"),c.append(n,s("Retry",()=>{g()},"secondary"))}};return g(),c}function l(t,r,i){let o=a("section","account-sites project-management");o.dataset.open="false";let l=s("Project settings",()=>{let e="true"!==o.dataset.open;o.dataset.open=String(e),l.setAttribute("aria-expanded",String(e)),c.inert=!e,c.setAttribute("aria-hidden",String(!e))},"account-sites-summary");l.append(n("chevron")),l.setAttribute("aria-expanded","false");let c=a("div","account-sites-reveal");c.id=`project-settings-${crypto.randomUUID()}`,l.setAttribute("aria-controls",c.id),c.inert=!0,c.setAttribute("aria-hidden","true");let p=a("div","account-sites-clip");c.append(p);let d=a("div","account-sites-content"),u=a("p","account-usage-status");u.setAttribute("role","status");let v=r?`?workspace=${encodeURIComponent(r)}`:"",m=(e,a="GET",n)=>t.request(`project${e}${v}`,a,n);o.hidden=!0,p.append(d,u),o.append(l,c);let b,h=async e=>{let t=Array.from(o.querySelectorAll("button"));t.forEach(e=>e.disabled=!0),u.textContent="";try{await e()}catch(e){u.textContent=e instanceof Error?e.message:"Try again."}finally{t.forEach(e=>e.disabled=!1)}},y=async()=>{let e,n={format:"komo-export",version:1,project:b.project,exportedAt:(new Date).toISOString(),tables:{}};for(let a of["threads","comments","reactions","users","snapshots"]){n.tables[a]=[];let s=0;for(;null!==s;){let i=await t.request(`project/export?table=${a}&offset=${s}${void 0===e?"":`&revision=${e}`}${r?`&workspace=${encodeURIComponent(r)}`:""}`).catch(e=>{if("snapshots"===a&&!s&&400===e.status)return null;throw e});if(!i){delete n.tables[a];break}e=i.revision,n.tables[a].push(...i.rows),s=i.next}}let s=URL.createObjectURL(new Blob([JSON.stringify(n,null,2)],{type:"application/json"})),i=a("a");i.href=s,i.download=`${b.project}-comments.json`,i.click(),setTimeout(()=>URL.revokeObjectURL(s),1e3),u.textContent="Export downloaded."},g=async()=>{b=await m(""),o.hidden=!1,d.replaceChildren();let t=a("div","account-name-label");t.append(a("span","","Access"));let n,r=[["public","Anyone with the link"],["private","Invited Google accounts"]],l=()=>{let a=e("Project access",r,b.access,e=>{h(async()=>{let t=b.access;b.access=e,l();try{await m("","PATCH",{access:e}),u.textContent="Access updated."}catch(e){throw b.access=t,l(),e}})});n?n.replaceWith(a):t.append(a),n=a};l(),d.append(t);let c=await m("/webhook"),p=a("details","project-webhook");p.append(a("summary","","Comment webhooks"));let v=a("p","project-help","Send signed events to your HTTPS endpoint. Signing secrets are encrypted and shown only when entered.");p.append(v),c.deliveryAvailable||(v.textContent="Secure webhook delivery is not available on this server yet.");let f=a("label","account-name-label","HTTPS endpoint"),w=a("input");w.type="url",w.autocomplete="off",w.placeholder="https://example.com/palette-webhook",w.value=c.url,f.append(w),p.append(f);let A=a("label","account-name-label",c.secretConfigured?"Replace signing secret":"Signing secret"),k=a("input");k.type="password",k.autocomplete="new-password",k.minLength=32,k.maxLength=256,A.append(k),p.append(A);let C=new Map;for(let e of c.supportedEvents){let t=a("label","account-name-label",e),n=a("input");n.type="checkbox",n.checked=c.events.includes(e),C.set(e,n),t.prepend(n),p.append(t)}let x=a("label","account-name-label","Enable delivery"),j=a("input");j.type="checkbox",j.checked=c.enabled,j.disabled=!c.deliveryAvailable&&!c.enabled,x.prepend(j),p.append(x),p.append(s("Save webhook settings",()=>{h(async()=>{await m("/webhook","PATCH",{url:w.value,secret:k.value,events:[...C].filter(([,e])=>e.checked).map(([e])=>e),enabled:j.checked}),k.value="",u.textContent="Webhook settings saved."})},"secondary")),d.append(p);let S=a("label","account-name-label","Invite someone"),$=a("input");$.type="email",$.placeholder="name@example.com",$.autocomplete="email",S.append($);let E=a("input");E.readOnly=!0,E.hidden=!0,E.setAttribute("aria-label","Invitation link");let T=s("Create invitation",()=>{h(async()=>{if(!$.checkValidity()||!$.value)throw Error("Enter an email address.");let e=await m("/invites","POST",{email:$.value});E.value=e.url,E.hidden=!1,P.hidden=!1,u.textContent="Share this link. It expires in 7 days."})},"secondary"),P=s("Copy invitation",()=>{h(async()=>{await navigator.clipboard.writeText(E.value),u.textContent="Invitation copied."})},"secondary");P.hidden=!0,d.append(S,T,E,P);for(let e of b.members){let t=a("div","project-member");t.append(a("span","",e.name),s(`Remove ${e.name}`,()=>{h(async()=>{await m("/members","DELETE",{user:e.id}),await g(),u.textContent="Member removed."})},"secondary")),d.append(t)}for(let e of b.invites){let t=a("div","project-member");t.append(a("span","",e.email),s("Revoke invitation",()=>{h(async()=>{await m("/invites","DELETE",{email:e.email}),await g(),u.textContent="Invitation revoked."})},"secondary")),d.append(t)}d.append(s("Download comments",()=>{h(y)},"secondary"));let L=a("a","project-help","Move to self-hosting");L.href="https://github.com/hazem3500/palette#quota-recovery-and-migration",L.target="_blank",L.rel="noopener noreferrer",d.append(L);let R=a("details","project-danger");R.append(a("summary","","Free space or delete project")),R.append(a("p","",`Export first. These actions permanently remove comments. Type ${b.project} to confirm.`));let U=a("input");U.placeholder=b.project,U.setAttribute("aria-label","Confirm project key"),R.append(U),R.append(s("Delete resolved threads",()=>{h(async()=>{await m("/clear-resolved","POST",{confirm:U.value}),i?.(!1),u.textContent="Resolved threads deleted.",U.value=""})},"secondary destructive")),b.hosted&&R.append(s("Delete project",()=>{h(async()=>{await m("","DELETE",{confirm:U.value}),i?.(!0),d.replaceChildren(),u.textContent="Project deleted. Its project slot is available again."})},"secondary destructive")),d.append(R)};return g().catch(e=>{403!==e?.status&&(o.hidden=!1,u.textContent="Project settings unavailable.",d.append(s("Retry",()=>{h(g)},"secondary")))}),o}function c(e,t){let r=a("section","onboarding-panel"),i=a("p","account-usage-status");i.setAttribute("role","status");let l=e=>{i.textContent=e instanceof Error?e.message:"Try again."},c=async()=>{let p=encodeURIComponent(t.workspace),d=a("div","account-sites"),u=a("div","account-sites-summary");u.append(a("span","","Approved sites"),n("chevron")),d.append(u),d.setAttribute("aria-busy","true"),i.textContent="",r.replaceChildren(o(e,`usage?workspace=${p}`,!1),d,i);try{let o=await e.request(`workspace?workspace=${p}`);if(!r.isConnected)return;i.textContent="";let c=a("section","account-sites");c.dataset.open="false";let u=s("",()=>{let e="true"!==c.dataset.open;c.dataset.open=String(e),u.setAttribute("aria-expanded",String(e)),v.inert=!e,v.setAttribute("aria-hidden",String(!e))},"account-sites-summary");u.setAttribute("aria-expanded","false");let v=a("div","account-sites-reveal");v.id=`approved-sites-${crypto.randomUUID()}`,v.inert=!0,v.setAttribute("aria-hidden","true"),u.setAttribute("aria-controls",v.id);let m=a("div","account-sites-clip"),b=a("span","account-sites-count");u.append(a("span","","Approved sites"),b,n("chevron"));let h=a("div","account-sites-content"),y=a("div","approved-sites"),g=()=>{b.textContent=String(o.sites.length),y.replaceChildren(...o.sites.map(e=>a("span","",new URL(e).host)))};g();let f=a("label","account-name-label","Website"),w=a("input");w.type="url",w.placeholder="https://your-site.com",w.setAttribute("autocomplete","url"),w.value=t.site||o.suggested.find(e=>!o.sites.includes(e))||"",f.append(w);let A=s("Approve site",async()=>{let a;try{let e=new URL(w.value.trim());if("https:"!==e.protocol||e.username||e.password)throw Error("Enter an HTTPS website address.");a=e.origin}catch(e){return void l(e)}let n=[...o.sites],s=w.value;o.sites.includes(a)||o.sites.push(a),g(),w.value="",A.disabled=!0;try{await e.request("workspace/sites","POST",{project:t.workspace,origin:a}),t.site=void 0,i.textContent="Site approved"}catch(e){o.sites=n,g(),w.value||(w.value=s),l(e)}finally{A.disabled=!1}},"secondary");w.addEventListener("keydown",e=>{"Enter"===e.key&&(e.preventDefault(),A.click())});let k=a("div","account-usage-note account-sites-note");k.append(n("info"),a("span","","Approved sites can show and share comments. Localhost comments are visible by default.")),h.append(y,f,A,k),m.append(h),v.append(m),c.append(u,v),d.replaceWith(c)}catch(e){l(e),r.append(s("Retry",()=>{c()},"secondary"))}};if(t.invite){let n=s("Accept invitation",async()=>{n.disabled=!0;try{await e.request("project/join","POST",{invite:t.invite}),t.invite=void 0,r.replaceChildren(a("p","","You’re in. Return to the website to leave comments."))}catch(e){l(e),n.disabled=!1}},"primary");r.append(n,i)}else if(t.workspace)c();else if(t.code||t.claimKey){let a=s(t.code?"Create project":"Enable comments",async()=>{a.disabled=!0;let n=a.textContent;a.textContent=t.code?"Creating project…":"Enabling comments…";try{if(t.code){let a=await e.request("setup/complete","POST",{code:t.code});t.workspace=a.project,t.code=void 0,history.replaceState(null,"",`?workspace=${encodeURIComponent(a.project)}`),await c(),i.textContent="Project ready. Return to your terminal."}else await e.request("owner/claim","POST",{key:t.claimKey}),t.claimKey=void 0,r.replaceChildren(o(e),i),i.textContent="Comments are ready."}catch(e){l(e),a.disabled=!1,a.textContent=n}},"primary");r.append(a,i)}else r.append(o(e));return r}export{o as accountUsage,c as onboardingPanel,l as projectManagement};

package/dist/{pin-groups-YAYFPJYA.js → pin-groups-GF53RTHP.js}

@@ -1 +1 @@
-import{E as t,L as e}from"./chunk-IQOPM3JF.js";var n=new WeakSet;function o(t){if(!n.has(t)){n.add(t);for(let e of[document,t])e.addEventListener("pointerdown",e=>{for(let n of t.querySelectorAll(".pin-stack[data-open]"))e.composedPath().includes(n)||n.removeAttribute("data-open")},!0)}}function a({threads:e,rect:n,right:a,owner:l},r){o(r.root);let i=t("div","pin-stack"),s=i.dataset.pointer=a?"right":"left",c=(l.getAttribute("aria-label")||l.textContent||"").trim().replace(/\s+/g," ").slice(0,40);i.setAttribute("role","group"),i.setAttribute("aria-label",`${e.length} comments on ${c||"this element"}`),e.length>3&&(i.dataset.more="+"+(e.length-1));let p=n.y-6-38*Math.ceil(e.length/6)<r.bounds.top;i.toggleAttribute("data-below",p),Object.assign(i.style,{left:`${a?n.x+9:n.x-9}px`,top:`${p?n.y-18:n.y+6}px`,translate:`${a?"-100%":"0"} ${p?"0":"-100%"}`});let m=!1;return i.addEventListener("pointerdown",t=>{m="mouse"!==t.pointerType&&!i.matches(".pin-stack:is([data-open],:hover,:focus-within,:has(.active,.hot))")},!0),i.addEventListener("click",t=>{m&&(m=!1,t.stopPropagation(),i.toggleAttribute("data-open",!0))},!0),e.forEach((t,n)=>{let o=r.pin(t);o.dataset.pointer=s,o.style.zIndex=String(e.length-n),i.append(o)}),i}function l(t,n,a){o(a.root);let l=a.menu(`${n.length} comments nearby`,n.map(t=>({label:`${t.comments[0]?.author.name}: ${a.summary(t)}`,icon:"comment",onSelect:()=>a.open(t)})));l.className+=" pin-cluster",l.dataset.cluster=n.map(t=>t.id).join(" ");let r=l.firstElementChild;r.className="",r.textContent=String(n.length),l.querySelectorAll(".menu-action svg").forEach((t,o)=>{let a=n[o].comments[0]?.author;a&&t.replaceWith(e(a))});let i=0,s=0;for(let{box:e}of t)i+=(e.left+e.right)/2/t.length,s+=(e.top+e.bottom)/2/t.length;let{left:c,top:p,right:m,bottom:h}=a.bounds;return Object.assign(l.style,{left:`${Math.max(c+14,Math.min(i,m-14))}px`,top:`${Math.max(p+14,Math.min(s,h-14))}px`}),l}export{l as bubble,a as stack};
+import{E as t,L as e}from"./chunk-4HBBEVFK.js";var n=new WeakSet;function o(t){if(!n.has(t)){n.add(t);for(let e of[document,t])e.addEventListener("pointerdown",e=>{for(let n of t.querySelectorAll(".pin-stack[data-open]"))e.composedPath().includes(n)||n.removeAttribute("data-open")},!0)}}function a({threads:e,rect:n,right:a,owner:l},r){o(r.root);let i=t("div","pin-stack"),s=i.dataset.pointer=a?"right":"left",c=(l.getAttribute("aria-label")||l.textContent||"").trim().replace(/\s+/g," ").slice(0,40);i.setAttribute("role","group"),i.setAttribute("aria-label",`${e.length} comments on ${c||"this element"}`),e.length>3&&(i.dataset.more="+"+(e.length-1));let p=n.y-6-38*Math.ceil(e.length/6)<r.bounds.top;i.toggleAttribute("data-below",p),Object.assign(i.style,{left:`${a?n.x+9:n.x-9}px`,top:`${p?n.y-18:n.y+6}px`,translate:`${a?"-100%":"0"} ${p?"0":"-100%"}`});let m=!1;return i.addEventListener("pointerdown",t=>{m="mouse"!==t.pointerType&&!i.matches(".pin-stack:is([data-open],:hover,:focus-within,:has(.active,.hot))")},!0),i.addEventListener("click",t=>{m&&(m=!1,t.stopPropagation(),i.toggleAttribute("data-open",!0))},!0),e.forEach((t,n)=>{let o=r.pin(t);o.dataset.pointer=s,o.style.zIndex=String(e.length-n),i.append(o)}),i}function l(t,n,a){o(a.root);let l=a.menu(`${n.length} comments nearby`,n.map(t=>({label:`${t.comments[0]?.author.name}: ${a.summary(t)}`,icon:"comment",onSelect:()=>a.open(t)})));l.className+=" pin-cluster",l.dataset.cluster=n.map(t=>t.id).join(" ");let r=l.firstElementChild;r.className="",r.textContent=String(n.length),l.querySelectorAll(".menu-action svg").forEach((t,o)=>{let a=n[o].comments[0]?.author;a&&t.replaceWith(e(a))});let i=0,s=0;for(let{box:e}of t)i+=(e.left+e.right)/2/t.length,s+=(e.top+e.bottom)/2/t.length;let{left:c,top:p,right:m,bottom:h}=a.bounds;return Object.assign(l.style,{left:`${Math.max(c+14,Math.min(i,m-14))}px`,top:`${Math.max(p+14,Math.min(s,h-14))}px`}),l}export{l as bubble,a as stack};

package/dist/{pin-move-PG54WWPU.js → pin-move-G6EWHLDO.js}

@@ -1 +1 @@
-import{E as e,G as t}from"./chunk-IQOPM3JF.js";function n(n){let{pin:r,root:i}=n,o=r.ownerDocument.defaultView,a=new AbortController,p=a.signal,s={...n.point},l=null,d=!1,u=!1,y=e("section","pin-move");y.setAttribute("role","group"),y.setAttribute("aria-label","Move pin");let c=e("p","","Drag this pin. Arrow keys move it; Shift moves farther. Enter saves; Escape cancels.");c.id=`pin-move-${Math.random().toString(36).slice(2,8)}`;let v=e("span","pin-move-status");v.setAttribute("role","status");let m=e=>{if(u)return;u=!0,a.abort(),l&&r.hasPointerCapture?.(l.pointer)&&r.releasePointerCapture(l.pointer),l=null,y.remove(),delete r.dataset.moving,delete r.dataset.dragging,r.removeAttribute("aria-describedby");let t=s.x!==n.point.x||s.y!==n.point.y;n.finish(e&&t?s:null)},g=(e,t=!1)=>{let r=n.bounds();s={x:Math.max(r.left,Math.min(r.right,e.x)),y:Math.max(r.top,Math.min(r.bottom,e.y))},n.preview(s),t&&(v.textContent=`Pin moved ${Math.round(s.x-n.point.x)} pixels horizontally, ${Math.round(s.y-n.point.y)} vertically. Enter saves.`)};y.append(c,t("Save position",()=>m(!0),"primary"),t("Cancel move",()=>m(!1),"secondary"),v),i.append(y),r.dataset.moving="true",r.dataset.dragging="true",r.setAttribute("aria-describedby",c.id),r.addEventListener("pointerdown",e=>{0!==e.button||l||(e.preventDefault(),e.stopPropagation(),l={pointer:e.pointerId,x:e.clientX,y:e.clientY,point:s},d=!1,r.setPointerCapture(e.pointerId))},{signal:p}),r.addEventListener("pointermove",e=>{if(!l||e.pointerId!==l.pointer)return;let t=e.clientX-l.x,n=e.clientY-l.y;!d&&Math.hypot(t,n)<4||(d=!0,e.preventDefault(),g({x:l.point.x+t,y:l.point.y+n}))},{signal:p}),r.addEventListener("pointerup",e=>{if(!l||e.pointerId!==l.pointer)return;let t=l.pointer;d&&g({x:l.point.x+e.clientX-l.x,y:l.point.y+e.clientY-l.y}),l=null,r.hasPointerCapture?.(t)&&r.releasePointerCapture(t),d&&m(!0)},{signal:p});for(let e of["pointercancel","lostpointercapture"])r.addEventListener(e,()=>{l&&m(!1)},{signal:p});return r.addEventListener("click",e=>{e.preventDefault(),e.stopImmediatePropagation()},{capture:!0,signal:p}),o.addEventListener("keydown",e=>{if("Escape"===e.key)return e.preventDefault(),e.stopImmediatePropagation(),void m(!1);if(!e.composedPath().includes(r)||e.altKey||e.ctrlKey||e.metaKey||e.isComposing)return;let t=e.shiftKey?10:1,n={ArrowLeft:{x:-t,y:0},ArrowRight:{x:t,y:0},ArrowUp:{x:0,y:-t},ArrowDown:{x:0,y:t}}[e.key];!n&&"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),e.stopImmediatePropagation(),n?g({x:s.x+n.x,y:s.y+n.y},!0):m(!0))},{capture:!0,signal:p}),o.addEventListener("resize",()=>m(!1),{signal:p}),r.focus({preventScroll:!0}),{cancel:()=>m(!1)}}export{n as startPinMove};
+import{E as e,G as t}from"./chunk-4HBBEVFK.js";function n(n){let{pin:r,root:i}=n,o=r.ownerDocument.defaultView,a=new AbortController,p=a.signal,s={...n.point},l=null,d=!1,u=!1,y=e("section","pin-move");y.setAttribute("role","group"),y.setAttribute("aria-label","Move pin");let c=e("p","","Drag this pin. Arrow keys move it; Shift moves farther. Enter saves; Escape cancels.");c.id=`pin-move-${Math.random().toString(36).slice(2,8)}`;let v=e("span","pin-move-status");v.setAttribute("role","status");let m=e=>{if(u)return;u=!0,a.abort(),l&&r.hasPointerCapture?.(l.pointer)&&r.releasePointerCapture(l.pointer),l=null,y.remove(),delete r.dataset.moving,delete r.dataset.dragging,r.removeAttribute("aria-describedby");let t=s.x!==n.point.x||s.y!==n.point.y;n.finish(e&&t?s:null)},g=(e,t=!1)=>{let r=n.bounds();s={x:Math.max(r.left,Math.min(r.right,e.x)),y:Math.max(r.top,Math.min(r.bottom,e.y))},n.preview(s),t&&(v.textContent=`Pin moved ${Math.round(s.x-n.point.x)} pixels horizontally, ${Math.round(s.y-n.point.y)} vertically. Enter saves.`)};y.append(c,t("Save position",()=>m(!0),"primary"),t("Cancel move",()=>m(!1),"secondary"),v),i.append(y),r.dataset.moving="true",r.dataset.dragging="true",r.setAttribute("aria-describedby",c.id),r.addEventListener("pointerdown",e=>{0!==e.button||l||(e.preventDefault(),e.stopPropagation(),l={pointer:e.pointerId,x:e.clientX,y:e.clientY,point:s},d=!1,r.setPointerCapture(e.pointerId))},{signal:p}),r.addEventListener("pointermove",e=>{if(!l||e.pointerId!==l.pointer)return;let t=e.clientX-l.x,n=e.clientY-l.y;!d&&Math.hypot(t,n)<4||(d=!0,e.preventDefault(),g({x:l.point.x+t,y:l.point.y+n}))},{signal:p}),r.addEventListener("pointerup",e=>{if(!l||e.pointerId!==l.pointer)return;let t=l.pointer;d&&g({x:l.point.x+e.clientX-l.x,y:l.point.y+e.clientY-l.y}),l=null,r.hasPointerCapture?.(t)&&r.releasePointerCapture(t),d&&m(!0)},{signal:p});for(let e of["pointercancel","lostpointercapture"])r.addEventListener(e,()=>{l&&m(!1)},{signal:p});return r.addEventListener("click",e=>{e.preventDefault(),e.stopImmediatePropagation()},{capture:!0,signal:p}),o.addEventListener("keydown",e=>{if("Escape"===e.key)return e.preventDefault(),e.stopImmediatePropagation(),void m(!1);if(!e.composedPath().includes(r)||e.altKey||e.ctrlKey||e.metaKey||e.isComposing)return;let t=e.shiftKey?10:1,n={ArrowLeft:{x:-t,y:0},ArrowRight:{x:t,y:0},ArrowUp:{x:0,y:-t},ArrowDown:{x:0,y:t}}[e.key];!n&&"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),e.stopImmediatePropagation(),n?g({x:s.x+n.x,y:s.y+n.y},!0):m(!0))},{capture:!0,signal:p}),o.addEventListener("resize",()=>m(!1),{signal:p}),r.focus({preventScroll:!0}),{cancel:()=>m(!1)}}export{n as startPinMove};

package/dist/public-env.d.ts

@@ -6,32 +6,70 @@ export interface ServerEnv {
     GITHUB_CLIENT_ID: string;
     GITHUB_CLIENT_SECRET: string;
     GOOGLE_CLIENT_SECRET: string;
+    EDGE_LIMIT?: RateLimit;
+    PALETTE_WEBHOOK_KEYS?: string;
+    PALETTE_WEBHOOK_SEND?: (url: string, body: string, headers: Record<string, string>) => Promise<void>;
+    /** Optional server secret mixed into access token hashes. Changing it revokes every token. */
+    PALETTE_TOKEN_PEPPER?: string;
+    PALETTE_HOSTED?: string;
+    PALETTE_PAUSED?: string;
+    /** Trusted identity proxy that signs reviewers in, e.g. "gcp-iap". Off unless set. */
+    PALETTE_PROXY_AUTH?: string;
+    /** The audience the proxy signs its assertions for. */
+    PALETTE_PROXY_AUDIENCE?: string;
+    /** Older name: setting it alone turns on "gcp-iap" with this audience. */
+    PALETTE_IAP_AUDIENCE?: string;
+    /** Path the proxy protects for the sign-in handlers, e.g. "/backoffice". */
+    PALETTE_AUTH_PATH_PREFIX?: string;
+    /** Older name for PALETTE_AUTH_PATH_PREFIX. */
+    PALETTE_AUTH_PREFIX?: string;
+    /** "true" makes reading comments need a session. Always on with a proxy. */
+    PALETTE_REQUIRE_SESSION_FOR_READS?: string;
+    /** "false" refuses guest sign-in on every project. Always off with a proxy. */
+    PALETTE_ALLOW_GUESTS?: string;
+    /** Caps session age in days. Unset keeps sessions until sign-out. */
+    PALETTE_SESSION_MAX_AGE_DAYS?: string;
+    /** Path the app is served under behind a proxy that strips it, e.g. "/palette". */
+    PALETTE_PUBLIC_PATH?: string;
+    PALETTE_VERSION?: {
+        id: string;
+    };
+    /** @deprecated Read when PALETTE_WEBHOOK_KEYS is unset. */
     KOMO_WEBHOOK_KEYS?: string;
+    /** @deprecated Read when PALETTE_WEBHOOK_SEND is unset. */
     KOMO_WEBHOOK_SEND?: (url: string, body: string, headers: Record<string, string>) => Promise<void>;
-    /** Optional server secret mixed into access token hashes. Changing it revokes every token. */
+    /** @deprecated Read when PALETTE_TOKEN_PEPPER is unset. */
     KOMO_TOKEN_PEPPER?: string;
+    /** @deprecated Read when PALETTE_HOSTED is unset. */
     KOMO_HOSTED?: string;
+    /** @deprecated Read when PALETTE_PAUSED is unset. */
     KOMO_PAUSED?: string;
-    /** Trusted identity proxy that signs reviewers in, e.g. "gcp-iap". Off unless set. */
+    /** @deprecated Read when PALETTE_PROXY_AUTH is unset. */
     KOMO_PROXY_AUTH?: string;
-    /** The audience the proxy signs its assertions for. */
+    /** @deprecated Read when PALETTE_PROXY_AUDIENCE is unset. */
     KOMO_PROXY_AUDIENCE?: string;
-    /** Older name: setting it alone turns on "gcp-iap" with this audience. */
+    /** @deprecated Read when PALETTE_IAP_AUDIENCE is unset. */
     KOMO_IAP_AUDIENCE?: string;
-    /** Path the proxy protects for the sign-in handlers, e.g. "/backoffice". */
+    /** @deprecated Read when PALETTE_AUTH_PATH_PREFIX is unset. */
     KOMO_AUTH_PATH_PREFIX?: string;
-    /** Older name for KOMO_AUTH_PATH_PREFIX. */
+    /** @deprecated Read when PALETTE_AUTH_PREFIX is unset. */
     KOMO_AUTH_PREFIX?: string;
-    /** "true" makes reading comments need a session. Always on with a proxy. */
+    /** @deprecated Read when PALETTE_REQUIRE_SESSION_FOR_READS is unset. */
     KOMO_REQUIRE_SESSION_FOR_READS?: string;
-    /** "false" refuses guest sign-in on every project. Always off with a proxy. */
+    /** @deprecated Read when PALETTE_ALLOW_GUESTS is unset. */
     KOMO_ALLOW_GUESTS?: string;
-    /** Caps session age in days. Unset keeps sessions until sign-out. */
+    /** @deprecated Read when PALETTE_SESSION_MAX_AGE_DAYS is unset. */
     KOMO_SESSION_MAX_AGE_DAYS?: string;
-    /** Path the app is served under behind a proxy that strips it, e.g. "/komo". */
+    /** @deprecated Read when PALETTE_PUBLIC_PATH is unset. */
     KOMO_PUBLIC_PATH?: string;
-    EDGE_LIMIT?: RateLimit;
+    /** @deprecated Read when PALETTE_VERSION is unset. */
     KOMO_VERSION?: {
         id: string;
     };
 }
+/**
+ * `env` with each PALETTE_ setting filled from its older KOMO_ name when unset
+ * (missing, null or ""), so deployments configured before the rename keep working
+ * unchanged and an empty PALETTE_ value never hides a KOMO_ one.
+ */
+export declare function paletteEnv<T extends object>(env: T): T;

package/dist/react-props-panel-ZSKQ44GS.js

@@ -0,0 +1 @@
+import{c as e}from"./chunk-ONUORDYE.js";import"./chunk-3BVM3I52.js";import{b as t,c as n}from"./chunk-KELFDOEC.js";import{a as i,b as o}from"./chunk-S6NEYT36.js";import{A as r,a,c as s,d,e as l,f as p,g as c,h as u,i as g,j as f,k as m,l as h,m as b,n as v,o as x,p as k,q as y,r as w,s as E,t as C,u as S,v as $,w as A,x as L,y as P,z as M}from"./chunk-HLXSRXTK.js";import{c as N}from"./chunk-PF4NYFZK.js";import{A as T,B as q,a as j,b as D,c as z,f as R,g as O,i as V,j as B,k as H,l as U,m as F,n as I,o as _,p as K,q as X,r as W,s as Y,t as Z,u as J,v as G,w as Q,x as ee,y as te,z as ne}from"./chunk-FGZXQUAD.js";import{a as ie}from"./chunk-XP22SMEQ.js";import{h as oe}from"./chunk-4FX5IS2U.js";import{a as re}from"./chunk-XOMOONGK.js";import{E as ae,e as se,j as de}from"./chunk-4HBBEVFK.js";var le=new Map,pe=new Map,ce=new Map;function ue(e){let t=D(e);if(!re(t))return null;if(t!==e)for(let n of[le,pe,ke])n.has(e)&&(n.set(t,n.get(e)),n.delete(e));return t}function ge(e,t,n,i,o,r){if(de(e)&&(o?.element===e||o?.hasChanges(e)))return!1;let a=ue(e);if(!a||a===e||n.host.contains(a))return!1;let s=t.querySelector(".design-react-group:not(.design-react-discovered)")??void 0,d=n.root.activeElement;for(let t of i)!t.kind&&t.props&&t.element===e&&(t.element=a);return r(a,s),d instanceof HTMLElement&&s?.contains(d)&&d.focus({preventScroll:!0}),!0}function fe(e,t,n,i,o){let{root:r,design:a}=i,{retainedProps:s,syncStyles:d,updateActions:l}=o;if(!s&&t.querySelector(".design-react-group, .design-theme-group"))return;let p=(t,n=!1)=>{t&&o.history.push({element:n?ue(e)??e:e,props:n,undo:()=>{t(),d()}}),d(),l()};ft(t,a,()=>o.select(e),r,o.signal);let c=s??kt(e,e=>p(e,!0),r,o.select,a,o.refresh,i.sourceHref);c&&!s&&t.prepend(c),We(e,n.fields,t,o.onStyleEdit,r,n.valueFor,n.toHex,a,p,o.isFieldDirty);let u=Je(e,n,o.updateActions,r);u&&t.append(u)}var me=new WeakSet,he=new WeakMap,be=".design-react-source{display:block;padding:0 0 8px;color:#77736f;font-size:10px;overflow-wrap:anywhere}.design-react-inside{padding:10px 12px}.design-react-inside button{padding:0;border:0;background:none;color:#bda6ef;font:inherit;cursor:pointer}.design-react-inside button:hover{text-decoration:underline}.design-react-field.design-field{display:grid;grid-template-columns:clamp(56px,24%,80px) minmax(0,1fr);align-items:center;gap:0 8px;height:auto;min-height:28px;margin-top:4px;background:none;box-shadow:none;color:#898680;font-size:11px}.design-react-field>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.design-react-scrub{cursor:ew-resize;user-select:none;touch-action:none}.design-react-scrub:hover{color:#e9e6e1}.design-react-field.design-field>:is(input,select){box-sizing:border-box;width:100%;min-width:0;height:28px;padding:0 8px;border:0;border-radius:6px;background-color:#ffffff0a;color:#f1efeb;font:inherit;font-size:11px}.design-react-field.design-field>:is(input,select):focus-visible{outline:1px solid #bda6ef;outline-offset:-1px}.design-react-field.design-field>select{padding-right:20px}.design-react-field.design-field>.design-react-switch{position:relative;justify-self:start;appearance:none;width:28px;min-width:0;height:16px;margin:0;padding:0;border-radius:8px;background:#ffffff29;cursor:pointer;transition:background-color .12s}.design-react-switch::before{content:\"\";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #0006;transition:translate .12s var(--ease-smooth-out,ease)}.design-react-field.design-field>.design-react-switch:checked{background:#8b6ff0}.design-react-switch:checked::before{translate:12px}.design-react-field.design-field>.design-react-switch[data-unset]{border:1px dashed #ffffff4d;background:none}.design-react-switch[data-unset]::before{display:none}.design-react-switch[data-unset]::after{content:\"unset\";position:absolute;top:-1px;left:34px;color:#77736f;font-size:10px;line-height:16px;white-space:nowrap}.design-react-field.design-field>.design-react-switch:focus-visible{outline:2px solid #bda6ef;outline-offset:2px}@media (prefers-reduced-motion:reduce){.design-react-field.design-field>.design-react-switch,.design-react-switch::before{transition:none}}.design-react-field input:disabled{opacity:.55;cursor:not-allowed}.design-react-type{display:none}.design-react-field.design-field>.design-token-binding{display:grid}.design-react-field.design-field>.design-token-binding select{position:static;width:auto;height:24px;padding:0 18px 0 6px;box-shadow:none;opacity:1}.design-react-field .design-token-binding{grid-column:2;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:6px;margin-top:4px;color:#77736f;font-size:10px}.design-react-field .design-token-binding select{min-width:0;height:24px;border:0;border-radius:6px;appearance:none;background:#ffffff0a url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M1.5 3 4 5.5 6.5 3' fill='none' stroke='%23898680' stroke-width='1.2'/%3E%3C/svg%3E\") right 6px center/8px no-repeat;color:#e9e6e1;padding:0 18px 0 6px;font:inherit;font-size:10px;cursor:pointer}.design-react-field .design-token-binding[data-mode=token] select{background-color:#bda6ef24;color:#e6dcfb}.design-token-binding__state{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.design-field>.design-token-binding{display:contents}.design-field:has(>.design-token-binding)>input[data-property]{padding-right:28px}.design-token-icon,.design-token-detach,.design-field>.design-token-binding select{position:absolute;top:4px;right:4px;width:20px;height:20px;box-sizing:border-box;border-radius:5px}.design-token-icon{display:grid;place-items:center;color:#77736f;opacity:0;pointer-events:none;transition:opacity .12s}.design-token-icon::before{content:'';width:6px;height:6px;border:1.2px solid currentColor;border-radius:1.5px;rotate:45deg}.design-field:is(:hover,:focus-within) .design-token-icon{opacity:1}.design-field>.design-token-binding select{margin:0;padding:0;border:0;opacity:0;cursor:pointer;appearance:none}.design-field>.design-token-binding select:hover+.design-token-icon,.design-field:has(.design-token-binding select:hover) .design-token-icon{background:#ffffff14;color:#e9e6e1}.design-field:has(.design-token-binding select:focus-visible) :is(.design-token-icon,.design-token-chip){outline:2px solid #bda6ef;outline-offset:1px;opacity:1}.design-field[data-token-mode=override] .design-token-icon{opacity:1;color:#e7c27d}.design-token-chip,.design-token-detach{display:none}.design-field:is([data-token-mode=token],[data-token-mode=connected])>[data-property]{visibility:hidden}.design-field:is([data-token-mode=token],[data-token-mode=connected]) .design-token-chip{position:absolute;inset:4px 28px 4px var(--lead,4px);display:flex;align-items:center;gap:5px;padding:0 18px 0 6px;border-radius:4px;background:#bda6ef1f url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M1.5 3 4 5.5 6.5 3' fill='none' stroke='%23c8b5f4' stroke-width='1.2'/%3E%3C/svg%3E\") right 6px center/8px no-repeat;color:#e6dcfb;font-size:11px;white-space:nowrap;overflow:hidden;pointer-events:none}.design-token-chip::before{content:'';flex:none;width:5px;height:5px;border:1.2px solid #c8b5f4;border-radius:1px;rotate:45deg}.design-field:is([data-token-mode=token],[data-token-mode=connected]) .design-token-binding select{left:var(--lead,4px);right:28px;width:auto}.design-field:is([data-token-mode=token],[data-token-mode=connected]) .design-token-icon{display:none}.design-field:is([data-token-mode=token],[data-token-mode=connected]) .design-token-detach{display:grid;place-items:center;color:#898680}.design-token-detach:hover{background:#ffffff14;color:#f1efeb}.design-token-detach svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round}.design-theme-group .design-react-source{padding:0 0 6px}.design-theme-heading{display:block;padding:8px 0 2px;color:#77736f;font-size:10px;text-transform:capitalize}.design-theme-token{position:relative;display:grid;grid-template-columns:96px minmax(0,1fr) 20px;align-items:center;gap:6px;margin-top:4px}.design-theme-token>span{overflow:hidden;color:#898680;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.design-theme-token[data-changed]>span{color:#e6dcfb}.design-theme-token[data-changed]::before{content:'';position:absolute;top:calc(50% - 2px);left:-8px;width:4px;height:4px;border-radius:50%;background:#bda6ef}.design-theme-reset{display:grid;place-items:center;width:20px;height:20px;padding:0;border:0;border-radius:5px;background:none;color:#77736f;cursor:pointer}.design-theme-reset:disabled{visibility:hidden}.design-theme-reset:hover{background:#ffffff14;color:#f1efeb}.design-theme-reset svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.design-token-off{position:absolute;top:8px;right:24px;display:grid;place-items:center;width:12px;height:12px}.design-token-off::before{content:'';width:4px;height:4px;border-radius:50%;background:#e7c27d;opacity:.7}.design-token-off[hidden]{display:none}.design-field:has(>.design-token-binding>.design-token-off:not([hidden]))>input[data-property]{padding-right:38px}.design-theme-switch{padding:6px 12px 8px}.design-theme-switch .design-react-field>span{text-transform:capitalize}.design-theme-options{display:flex;min-width:0;padding:2px;border-radius:6px;background:#ffffff0a}.design-theme-options button{flex:1;min-width:0;height:24px;padding:0 6px;border:0;border-radius:4px;background:none;color:#898680;font:inherit;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.design-theme-options button:hover{color:#f1efeb}.design-theme-options button[aria-pressed=true]{background:#ffffff1a;color:#f1efeb}.design-theme-options button:focus-visible{outline:1px solid #bda6ef;outline-offset:-1px}@media (max-width:520px){.design-theme-options button{height:30px}.design-react-field.design-field>:is(input,select){height:34px}.design-token-icon,.design-token-detach,.design-field>.design-token-binding select{top:7px}.design-token-off{top:11px}}.design-react-row{display:grid;grid-template-columns:minmax(0,1fr) 28px;align-items:center;gap:4px}.design-react-row>.design-react-field{min-width:0;margin-top:4px}.design-react-row>.design-theme-reset{flex:none;width:28px;height:28px;margin-top:4px}.design-react-row>.design-theme-reset[hidden]{display:none}.design-react-group{position:relative}.design-react-group>summary{padding-right:32px}.design-react-group[data-empty]{padding-bottom:0}.design-react-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.design-react-status{flex:none;margin-left:4px;padding:1px 5px;border-radius:4px;background:#ffffff0f;color:#898680;font-size:10px;font-weight:500}.design-react-group>.palette-source{position:absolute;z-index:3;top:6px;right:8px}.design-react-advanced{margin-top:10px}.design-react-advanced>summary{color:#898680;font-size:11px;cursor:pointer}.design-react-field.design-field>input[readonly]{width:100%;min-width:0;padding:0;background:none;color:#c9c5bf;cursor:text}@media(max-width:520px){.design-react-row .design-react-field>:is(input,select){height:36px}.design-react-row>.design-theme-reset{width:32px;height:32px}.design-react-group>.palette-source{top:2px}}.design-theme-switch{position:relative;flex:none;padding:0}.design-theme-switch>summary{display:flex;align-items:center;gap:5px;max-width:90px;min-height:28px;padding:0 8px;border-radius:7px;background:#ffffff08;color:#b7b1c2;font-size:11px;list-style:none;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.design-theme-switch>summary::-webkit-details-marker{display:none}.design-theme-switch>summary::after{content:\"⌄\";color:#77736f}.design-theme-switch[open]>summary,.design-theme-switch>summary:hover{background:#ffffff14;color:#f1efeb}.design-theme-popup{position:absolute;z-index:12;top:calc(100% + 6px);right:0;box-sizing:border-box;width:min(280px,calc(100vw - 48px));max-height:50dvh;overflow:auto;padding:10px 12px;border:1px solid #ffffff1a;border-radius:10px;background:#191819;box-shadow:0 12px 40px #0008}.design-theme-popup .design-react-field{grid-template-columns:68px minmax(0,1fr)}.design-theme-popup .design-react-field+ .design-react-field{margin-top:8px}.design-theme-toggle{flex:none;display:flex;align-items:center;min-width:28px;height:28px;padding:0;border:0;border-radius:7px;background:none;color:#909090;font:inherit;font-size:11px}.design-theme-toggle:hover{background:#161616;color:#eee}.design-theme-toggle>svg{width:16px;height:16px;margin:auto;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.design-theme-toggle:has(span){padding:2px;background:#ffffff0a}.design-theme-toggle span{max-width:72px;padding:0 6px;border-radius:5px;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.design-theme-toggle[data-on=\"0\"] span:first-child,.design-theme-toggle[data-on=\"1\"] span:last-child{background:#ffffff1a;color:#f1efeb}",ve=".design-token-match{grid-column:1/-1;display:flex;align-items:center;gap:6px;min-width:0;margin-top:-2px;padding:0 4px;color:#77736f;font-size:10px}.design-token-match[hidden]{display:none}.design-token-match>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.design-token-match button{flex:none;padding:0;border:0;background:none;color:#bda6ef;font:inherit;cursor:pointer}.design-token-match button:hover{text-decoration:underline}.design-token-match button:focus-visible{outline:1px solid #bda6ef;outline-offset:2px;border-radius:2px}@media (pointer:coarse){.design-token-match button{min-height:32px}}";function xe(e){return void 0===e?"unset":JSON.stringify(e)??"unset"}var ke=new Map,ye=e=>e.definition.source?`${e.definition.source}${e.definition.line?`:${e.definition.line}`:""}`:"";function we(e){let n=t(se().root);try{if(e)for(let[e,t]of le){let n=R(e);n&&(ke.set(e,n.props),n.setProps({...n.props,...Object.fromEntries(t)}))}else for(let[e,t]of ke)R(e)?.setProps(t);e||ke.clear(),F(e),P(e)}finally{n()}}function Ee(e){return!!le.get(e)?.size}function Ce(e){let t=R(e),n=t?.definition.textProp,i=t?.definition.props.find(e=>e.name===n);if(!t||!n||"string"!==i?.kind)return null;let o=t.props[n];if("string"!=typeof o||o.length>500)return null;let r=le.get(e);return r||le.set(e,r=new Map),r.has(n)||r.set(n,o),{propName:n,before:o}}function Se(e,t,n){let i=R(e),o=i?.definition.props.find(e=>e.name===t);return!(!i||i.definition.textProp!==t||"string"!==o?.kind||n.length>500||!z(o,n))&&(i.setProps({...i.props,[t]:n}),!0)}function $e(e,t,n,i){if(n===i){let i=le.get(e);return void(i?.get(t)===n&&!(pe.get(e)??[]).some(e=>e.propName===t)&&(i.delete(t),i.size||le.delete(e)))}let o=pe.get(e);o||pe.set(e,o=[]),o.push({propName:t,before:n,after:i})}function Ae(e,t,n){Se(e,t,n);let i=le.get(e);i?.get(t)===n&&!(pe.get(e)??[]).some(e=>e.propName===t)&&(i.delete(t),i.size||le.delete(e))}function Le(e){return!!e&&!!pe.get(e)?.length}function Pe(e){let t=le.get(e),n=R(e);if(!t?.size||!n)return;let i=V(e),o=[...t].map(([e,t])=>{let o=n.definition.props.find(t=>t.name===e)?.styleProperty,r=n.props[e],a=o&&"string"==typeof r?i?.tokens.find(e=>e.properties.includes(o)&&r===`var(${e.cssVariable})`):void 0;return`- ${e}: ${xe(t)} → ${xe(r)}${a?` [${a.path}]`:" [custom value]"}`});return["Proposed React prop changes (preview only)",`Component: ${n.definition.name}`,...ye(n)?[`Source: ${ye(n)}`]:[],...o,"Runtime preview only; inline feedback does not write source files."].join("\n")}function Me(e,t){if(R(e))return null;let n;try{n=ie(e,t)?.identify(e)}catch{}let i=O(e);return n?.name&&(!i||i.root!==n.element&&i.root.contains(n.element))?n:null}var Ne=e=>String(e).replace(/\s+/g," ").trim();function Te(e,t){let n=Object.entries(c(t)).map(([e,t])=>`${Ne(e)}=${Ne(t)}`).join(", "),i=Me(e,t),o=R(e),r=o?{root:e,component:o}:i?void 0:O(e);if(r){let{definition:e,props:t}=r.component;i={name:e.name,source:ye(r.component),props:{...t,...Object.fromEntries(le.get(r.root)??[])}}}let a=Object.entries(i?.props??{}).filter(([,e])=>null===e||["boolean","number"].includes(typeof e)||"string"==typeof e&&e.length<=80).slice(0,12).map(([e,t])=>`${Ne(e)}=${JSON.stringify(t).replace(/→/g,"\\u2192")}`);return[n&&`Theme: ${n}`,i?.name&&`Component: ${Ne(i.name)}${i.source?` (${Ne(i.source)})`:""}`,a.length&&`Props: ${a.join(", ")}`].filter(e=>!!e)}function qe(e){return[Pe(e),T(e),r(e)].filter(e=>!!e).join("\n\n")||void 0}function je(e,t,n){he.get(e)?.abort();let i=new AbortController;he.set(e,i),e.addEventListener("click",e=>{let i=t();if(!i)return;let o=T(i)||C(i);!R(i)&&!o||(e.stopImmediatePropagation(),n(i,qe(i)))},{capture:!0,signal:i.signal})}function De(e){return Q(e)}function ze(e){return G(e)||C(e)||S(e)}function Re(e){ee(e)}function Oe(e){te(e),$(e)}function Ve(e){if(!e||me.has(e))return;let t=document.createElement("style");t.textContent=be+ve+i,e.append(t),me.add(e)}function Be(e,t){e.dataset.picker="token",e.setAttribute("aria-haspopup","dialog"),e.setAttribute("aria-expanded","false");let n,i,o=i=>import("./token-picker-AJ5E5IN5.js").then(o=>{n=o,e.isConnected&&!e.disabled&&(i||"true"!==e.getAttribute("aria-expanded"))&&o.openTokenPicker({trigger:e,...t()},i)},()=>{});e.addEventListener("pointerdown",t=>{t.button||(t.preventDefault(),i="mouse"===t.pointerType?void 0:t,!i&&(e.focus(),o(!0)))}),e.addEventListener("pointerup",e=>{i&&Math.abs(e.clientY-i.clientY)<=10&&o(!0),i=void 0});for(let t of["mousedown","touchend"])e.addEventListener(t,e=>{e.cancelable&&e.preventDefault()});return e.addEventListener("keydown",e=>{e.ctrlKey||e.metaKey||!["Enter"," ","ArrowDown","ArrowUp"].includes(e.key)||(e.preventDefault(),o(!1))}),{prepare:()=>n?.refreshTokenPicker(e),refresh:()=>n?.refreshTokenPicker(e,{trigger:e,...t()})}}function He(e,t,n,i,o){let r=e.getRootNode(),a=new AbortController,s=new MutationObserver(()=>{n.isConnected||a.abort()});s.observe(r instanceof ShadowRoot?r:document,{childList:!0,subtree:!0}),r.addEventListener("palette-theme-change",()=>{o?.(n)||function(e,t,n){if(n.aborted)return;let i=e.ownerDocument.defaultView;if(!i)return;t();let o=0,r=0,a=()=>{n.aborted||(t(),!(++r>120)&&(o=i.requestAnimationFrame(()=>{o=0;for(let t=e;t;t=t.parentElement)if(t.getAnimations?.().some(e=>"running"===e.playState))return void a()})))};a(),i.setTimeout(()=>{n.aborted||t()},320)}(t,i,a.signal)},{signal:a.signal}),a.signal.addEventListener("abort",()=>s.disconnect(),{once:!0})}function Ue(e,t){let n=document.createElement("div");n.className="design-token-match",n.hidden=!0;let i=document.createElement("span"),o=document.createElement("button");o.type="button",o.textContent="Use token",n.append(i,o);let r=()=>{};return o.addEventListener("click",e=>{e.preventDefault(),r()}),{show(a,s){n.isConnected||(e??t.parentElement)?.after(n),n.hidden=!a,r=s;let d=(e??t.parentElement)?.dataset.fieldLabel;i.textContent=a?`${d?`${d} · `:""}Same ${"color"===a.type?"color":"value"} as ${a.label||a.path}`:"",i.title=a?`${a.path}${a.ref?` · ${a.ref}`:""} · ${a.value}`:"",o.setAttribute("aria-label",a?`Use token ${a.label||a.path}`:"Use token")}}}function Fe(e,t){let n=e?.getAttribute("aria-describedby")?.split(" ")??[];e&&!n.includes(t)&&e.setAttribute("aria-describedby",[...n,t].join(" "))}function Ie(e,t){let n=document.createElement("small");return n.className="design-token-binding__state",n.id=`palette-token-${t}-${Math.random().toString(36).slice(2,8)}`,Fe(e,n.id),n}function _e(e,t){e.dispatchEvent(new CustomEvent("palette-announce",{detail:t,bubbles:!0,composed:!0}))}function Ke(t,i,o,r){let a=V(t);if(!a)return null;let s=J(a,i);if(!s.length)return null;Ve(r);let d=document.createElement("span");d.className="design-token-binding",d.setAttribute("data-mode","custom");let l=document.createElement("span");l.className="design-token-icon",l.setAttribute("aria-hidden","true");let p=document.createElement("span");p.className="design-token-chip",p.setAttribute("aria-hidden","true");let c=document.createElement("button");c.type="button",c.className="design-token-detach",c.title="Detach token",c.setAttribute("aria-label",`Detach token from ${i}`),c.innerHTML='<svg viewBox="0 0 12 12"><path d="M5 3.5 6.5 2a2.1 2.1 0 0 1 3 3L8 6.5M7 8.5 5.5 10a2.1 2.1 0 0 1-3-3L4 5.5M2 2l8 8"/></svg>';let u=document.createElement("select");u.setAttribute("aria-label",`Style token for ${i}`);let g=Ie(u,i),f=document.createElement("option");f.value="custom",f.textContent="Custom value",u.append(f);for(let e of s){let t=document.createElement("option"),n=B(a,e);t.value=e.path,t.textContent=n?`${e.path} · ${n}`:e.path,u.append(t)}let m=x(),b=e=>({path:e.path,type:e.type,value:B(a,e),properties:e.properties,group:e.path.split(".")[0],ref:e.cssVariable}),v=Ue(null,d),y=e=>{u.value=e,u.dispatchEvent(new Event("change"))};Be(u,()=>({tokens:s.map(b),property:i,current:u.value,custom:e(t,i,d.parentElement?.querySelector("[data-property]")),onPreview:e=>{let o=s.find(t=>t.path===e.path);return n(t,()=>oe(t,i,`var(${o.cssVariable})`))},onSelect:e=>y(e.path)}));let w=()=>{let e=W(a,t,i),n=e?null:Y(a,t,i),o="token"===e?.mode?s.find(t=>t.path===e.tokenPath):void 0,r=o??n?.token;u.value=r?.path??"custom",p.textContent=r?`Uses ${r.path}`:"";let l=e?.declaredPath,c=o?"token":n?"connected":l?"override":"custom";d.dataset.mode=c,d.parentElement?.setAttribute("data-token-mode",c),g.textContent="token"===c?l&&l!==o?.path?`Rebound from ${l} · preview`:`Linked to ${o?.path} · preview`:"connected"===c?"Connected "+("inline"===n?.origin?"inline":"from stylesheet"):"override"===c?`Custom override · was ${l}`:"",u.title=g.textContent||"Choose a token",Fe(d.parentElement?.querySelector("[data-property]"),g.id),m.hidden="custom"!==c;let f="custom"===c?getComputedStyle(t).getPropertyValue(i).trim():"",x="custom"===c?h(s.map(b),f):void 0;"custom"===c&&k(m,f,x),v.show(x,()=>x&&y(x.path))},E=new MutationObserver(w);E.observe(t,{attributes:!0,attributeFilter:["style"]});let C=new MutationObserver(()=>{d.isConnected||(E.disconnect(),C.disconnect())});return C.observe(d.ownerDocument,{childList:!0,subtree:!0}),u.addEventListener("change",()=>{let e=t.style.getPropertyValue(i),n=s.find(e=>e.path===u.value),r=W(a,t,i);if(n&&r&&n.path===r.declaredPath)Z(a,t,i),o(e,t.style.getPropertyValue(i),n.path);else if(n)(n.path!==Y(a,t,i)?.token.path||r)&&_(a,t,n,i,{recordHistory:!1})&&o(e,t.style.getPropertyValue(i),n.path),_e(d,`${i} uses ${n.path}`);else{let n=d.parentElement?.querySelector("[data-property]")?.value??getComputedStyle(t).getPropertyValue(i).trim(),r=/^-?[\d.]+$/.test(n.trim())&&!/weight|line/.test(i)?`${n.trim()}px`:n;K(a,t,i,r),t.style.setProperty(i,r),o(e,r)}w()}),c.addEventListener("click",()=>{let e=s.find(e=>e.path===u.value),t=d.parentElement?.querySelector("input[data-property]"),n=e&&B(a,e);t&&n&&(t.value="number"===t.type?String(parseFloat(n)):n),u.value="custom",u.dispatchEvent(new Event("change")),d.parentElement?.querySelector("[data-property]")?.focus()}),d.append(p,u,l,c,m,g),queueMicrotask(w),w(),d}function Xe(e){let t=V(e);return new Set([...t?.elementBindings.get(e)?.keys()??[],...L(e)])}function We(e,t,n,i,o,r,a,s,d,l){let p=t.flatMap(e=>{let t=[...n.querySelectorAll("[data-field-property]")].find(t=>t.dataset.fieldProperty===e.property),i=t?.querySelector("[data-property]");return t&&i?[{field:e,label:t,input:i}]:[]}),u=t=>{for(let{field:i,label:o,input:s}of p){if(o.querySelector(".design-token-binding")||!n.contains(o))continue;let d=()=>{r&&(s.value=r(i,e,o.querySelector(".design-token-binding")?.dataset.value));let t=o.querySelector('input[type="range"],input[type="color"]');t&&(t.value="color"===i.kind&&a?a(s.value):s.value)},p=t(i,o,s,d);if(p){o.append(p),d();let e=o.querySelector('input[type="color"]'),t=p.querySelector("select"),n=e=>{e.preventDefault(),t?.focus(),t&&(t.dataset.start="custom"),t?.dispatchEvent(new KeyboardEvent("keydown",{key:"Enter",bubbles:!0,cancelable:!0}))};e?.addEventListener("click",n),e?.addEventListener("keydown",e=>{("Enter"===e.key||" "===e.key)&&n(e)})}He(o,e,s,d,l)}},m=s?.tokens;if(!m)return void u((t,n,r,a)=>Ke(e,t.property,e=>{i(t,r,e),a()},o));Ve(o);let h=function(e,t){let n=(Array.isArray(t?.themes)?t.themes:[]).find(e=>Array.isArray(e?.options)&&e.options.length>1&&e.options.length<4);if(n)return()=>Promise.all(n.options.map(i=>g(e,{...c(t),[n.id]:i.id}).then(e=>({label:ct(i.label,i.id),values:new Map(e.map(e=>[e.path,e.value]))})))).catch(()=>[])}(m,s);return Promise.all([g(m,c(s)),f(m,e)]).then(([t,n])=>{u((i,o,r,a)=>Ye(m,e,i.property,t,n[i.property],e=>{d?.(e),a()},o,r,h,a,()=>g(m,c(s))))},()=>{})}function Ye(t,i,o,r,l,p,c,u,g,f,C){let S=m(r,o),$=e(i,o,u);if(!S.length&&!l&&!$)return null;let A=a(i,o,l,t,r),L=l&&"offToken"in l?l.offToken:void 0,P=void 0===L?void 0:h(S,L),M=document.createElement("span");M.className="design-token-binding";let N=document.createElement("span");N.className="design-token-chip",N.setAttribute("aria-hidden","true");let T=document.createElement("span");T.className="design-token-icon",T.setAttribute("aria-hidden","true");let q=document.createElement("button");q.type="button",q.className="design-token-detach",q.title="Edit the value",q.setAttribute("aria-label",`Edit ${o} value`),q.innerHTML='<svg viewBox="0 0 12 12"><path d="M5 3.5 6.5 2a2.1 2.1 0 0 1 3 3L8 6.5M7 8.5 5.5 10a2.1 2.1 0 0 1-3-3L4 5.5M2 2l8 8"/></svg>';let j=document.createElement("select");j.setAttribute("aria-label",`Style token for ${o}`),j.disabled=!S.length&&!$;let D=document.createElement("option");D.value="",D.textContent="Choose a token",j.append(D);let z=()=>{j.replaceChildren(D),j.disabled=!S.length&&!$;let e=new Map([["",j]]);for(let t of S){let n=t.group??"",i=e.get(n);i||(i=document.createElement("optgroup"),i.label=n,e.set(n,i));let o=document.createElement("option");o.value=t.path,o.textContent=`${b(t)}${t.ref?` · ${t.ref}`:""}${t===P?" · same value":""}`,o.title=v(t),i.append(o)}for(let[t,n]of e)t&&j.append(n)};z();let R=x();void 0!==L&&k(R,L,P);let O=Ie(j,o);Fe(u,O.id);let V=!1,B=Ue(c,M),H=()=>{let e=d(i,o,l);return V?void 0:e&&"path"in e?e.path:void 0},U=Be(j,()=>({tokens:r,property:o,current:H(),themes:g,custom:e(i,o,u),onPreview:e=>n(i,()=>{let n=y(t,i,o,e);return f?.(),()=>{n(),f?.()}}),onSelect:I})),F=()=>{let e=w(i,o),t=H(),n=t?r.find(e=>e.path===t):void 0;j.value=t&&S.some(e=>e.path===t)?t:"";let a=n?b(n):t;N.replaceChildren(...a?[ae("span","design-token-chip__verb","Uses"),` ${a}`]:[]);let s=t?e?"token":"connected":"custom";M.dataset.mode=s;let p=document.createElement("i").style;n&&/color|fill|stroke/.test(o)&&(p.color=n.value);let u=/^rgba?\(/.test(p.color)?p.color:"";M.dataset.value!==u&&(M.dataset.value=u,M.isConnected&&f?.()),(c??M.parentElement)?.setAttribute("data-token-mode",s),R.hidden=!!t;let g=d(i,o,l),m=g&&"offToken"in g?g.offToken:getComputedStyle(i).getPropertyValue(o).trim()||L||"",x=t?void 0:h(S,m);t||k(R,m,x),O.textContent=n?`${e?"Preview":"Uses"} ${v(n)}`:t?`Uses ${t}`:R.hidden?"":R.title,j.title=O.textContent||"Choose a token",B.show(R.hidden?void 0:x,()=>x&&I(x))};function I(e){V=!1;let n=A??{offToken:getComputedStyle(i).getPropertyValue(o).trim()},a="path"in n?r.find(e=>e.path===n.path):void 0;p(E(t,i,o,e,n,a)),F(),_e(M,`${o} uses ${b(e)}`)}j.addEventListener("change",()=>{let e=S.find(e=>e.path===j.value);e?I(e):F()}),q.addEventListener("click",()=>{V=!0,F(),u?.focus()}),M.append(N,j,T,q,R,O);let _=new MutationObserver(F);_.observe(i,{attributes:!0,attributeFilter:["style","class"]});let K=new AbortController,X=new MutationObserver(()=>{M.isConnected||(_.disconnect(),X.disconnect(),K.abort())});X.observe(document,{childList:!0,subtree:!0});let W=c?.getRootNode();W instanceof ShadowRoot&&X.observe(W,{childList:!0,subtree:!0}),W?.addEventListener("palette-theme-changing",U.prepare,{signal:K.signal});let Y=0;return W?.addEventListener("palette-theme-change",()=>{let e=++Y;(C?.()??Promise.resolve([...r])).then(n=>{K.signal.aborted||e!==Y||(s(i,t,r=n),S=m(r,o),z(),F(),U.refresh())},()=>{})},{signal:K.signal}),F(),M}var Ze=!1;function Je(e,t,n,i){let o=V(e);if(!o||!o.tokens.length)return null;Ve(i);let r=document.createElement("details");r.className="design-group design-theme-group",r.open=Ze,r.addEventListener("toggle",()=>{r.isConnected&&(Ze=r.open)});let a=document.createElement("summary");a.textContent="Shared theme";let s=document.createElement("small");s.className="design-react-source",s.textContent="Changes every element using these tokens",r.append(a,s);let d=new Map;for(let e of o.tokens){let t=e.path.split(".")[0];d.set(t,[...d.get(t)??[],e])}let l=o.tokens.length>6&&d.size>1;for(let[e,i]of l?d:new Map([["",o.tokens]])){if(e){let t=document.createElement("small");t.className="design-theme-heading",t.textContent=e,r.append(t)}for(let a of i)r.append(Ge(o,a,t,n,e))}return r}function Ge(e,t,n,i,o){let r=document.createElement("div");r.className="design-theme-token";let a=document.createElement("span");a.textContent=o&&t.path.slice(o.length+1)||t.path,a.title=`${t.path} · ${H(e,t)} matching · ${t.impactSelector}`;let s=n.fields.find(e=>t.properties.includes(e.property)),d={property:t.cssVariable,label:`Shared theme value for ${t.path}`,kind:"dimension"===t.type?"size":s?.kind??"text",glyph:"color"===t.type?void 0:s?.glyph,values:s?.values},l=!1,p=n.fieldControl(d,{element:e.root,begin:()=>{l=!1},apply:(n,o,r)=>{let a=null!==r&&U(e,t,r.trim(),l);n.setAttribute("aria-invalid",String(!a)),a&&(l=!0,f(),i())},commit:(e,t,n)=>{!1!==n&&(l=!1,"true"===e.getAttribute("aria-invalid")&&g())}}),c=p.querySelector("[data-property]"),u=p.querySelector('input[type="color"]'),g=()=>{let i=B(e,t);c.value=i,u&&(u.value=n.toHex(i)),c.removeAttribute("aria-invalid"),f()},f=()=>{m.disabled=!r.toggleAttribute("data-changed",e.themeEdits.has(t.path)),"fontFamily"===t.type&&(c.title=c.value)},m=document.createElement("button");return m.type="button",m.className="design-theme-reset",m.title="Reset to page value",m.setAttribute("aria-label",`Reset ${t.path}`),m.innerHTML='<svg viewBox="0 0 16 16"><path d="M2.5 2.5v3h3M3 5.5a5.5 5.5 0 1 1-.5 2.5"/></svg>',m.addEventListener("click",()=>{I(e,t),g(),i()}),g(),r.append(a,p,m),r}function Qe(e,t,n){let i=V(e);return i&&K(i,e,t,n),l(e,t)}function et(e,t){let n=V(e);n&&X(n,e,t)}function tt(e){e=ue(e)??e;let t=pe.get(e),n=t?.at(-1),i=R(e);if(!n||!i)return;let o=t.find(e=>e.propName===n.propName).before;t.pop(),ce.set(e,[...ce.get(e)??[],n]),i.setProps({...i.props,[n.propName]:n.before});let r=le.get(e);r||le.set(e,r=new Map),Object.is(o,n.before)?(r.delete(n.propName),i.releaseProps?.([n.propName])):r.set(n.propName,o),r.size||le.delete(e)}function nt(e){e=ue(e)??e;let t=ce.get(e)?.pop(),n=R(e);if(!t||!n)return;n.setProps({...n.props,[t.propName]:t.after});let i=le.get(e);i||le.set(e,i=new Map);let o=i.has(t.propName)?i.get(t.propName):t.before;Object.is(o,t.after)?(i.delete(t.propName),n.releaseProps?.([t.propName])):i.set(t.propName,o),i.size||le.delete(e),pe.has(e)||pe.set(e,[]),pe.get(e).push(t)}function it(){for(let e of[...le.keys()])mt(e);le.clear(),pe.clear(),ne(),A(),pt()}var ot,rt=new Map,at=new WeakMap,st=new WeakSet,dt=".design-theme-switch,.design-theme-toggle";function lt(e){try{return String(e.current(se()))}catch{return}}function pt(e){for(let[e,t]of rt)try{lt(e)!==t&&e.apply(t,se())}catch{}rt.clear();let t=e?.querySelector(dt);t&&(at.get(t)?.(),t.remove())}var ct=(e,t)=>e||t.charAt(0).toUpperCase()+t.slice(1),ut='<svg viewBox="0 0 16 16" aria-hidden="true"><circle cx="8" cy="8" r="2.75"/><path d="M8 1.75v1.5m0 9.5v1.5M1.75 8h1.5m9.5 0h1.5M3.6 3.6l1 1m6.8 6.8 1 1m-8.8 0 1-1m6.8-6.8 1-1"/></svg>',gt='<svg viewBox="0 0 16 16" aria-hidden="true"><path d="M13.25 9.6A5.5 5.5 0 1 1 6.4 2.75a4.4 4.4 0 0 0 6.85 6.85Z"/></svg>';function ft(e,t,n,i,o){i&&o&&!st.has(o)&&(st.add(o),function(e,t,n){let i=0;u(e,t.ownerDocument,()=>{let o=++i,r=e?.tokens;t.dispatchEvent(new Event("palette-theme-changing")),(r?g(r,c(e)):Promise.resolve([])).then(e=>{n.aborted||o!==i||(t.dispatchEvent(new Event("palette-theme-changing")),r&&M(r,e),t.dispatchEvent(new Event("palette-theme-change")))},()=>{})},n)}(t,i,o));let r=e.closest(".design-inspector")?.querySelector(".design-inspector__heading"),a=(r??e).querySelector(dt),s=a instanceof HTMLDetailsElement&&a.open;a&&at.get(a)?.(),a?.remove();let d=t?.themes,l=(Array.isArray(d)?d:[]).flatMap(e=>{let t=lt(e),n=Array.isArray(e?.options)?e.options.filter(e=>"string"==typeof e?.id):[];return void 0===t||n.length<2?[]:[{axis:e,current:t,options:n,names:n.map(e=>ct(e.label,e.id))}]}),p=ot;if(ot=void 0,!l.length)return;let f,m,h,b=(e,t,i)=>{let o=lt(e);if(i===o)return;rt.has(e)||rt.set(e,o??t);let r=f.getRootNode().activeElement;(!r||f.contains(r))&&(ot=e);try{e.apply(i,se())}catch{}n(),m()},v=new AbortController,x=v.signal,k=()=>{};if(1===l.length&&2===l[0].options.length){let{axis:e,current:t,options:n,names:o}=l[0],r=n.map(e=>[e.id,e.label].map(e=>String(e??"").toLowerCase()).find(e=>"light"===e||"dark"===e)),a=r.includes("light")&&r.includes("dark"),s=f=ae("button","design-theme-toggle");s.type="button",s.setAttribute("role","switch"),a||s.append(...o.map(e=>ae("span","",e)));let d=function(e,t,n){let i=ae("div","morphing-menu__tooltip sidebar-tooltip");i.setAttribute("aria-hidden","true");let o=0,r=()=>{clearTimeout(o),delete i.dataset.open},a=()=>{if(!e.isConnected)return r();i.textContent=e.dataset.tip??"";let t=e.getBoundingClientRect(),n=i.offsetWidth/2;i.style.left=`${Math.max(8+n,Math.min(innerWidth-8-n,t.left+t.width/2))}px`,i.style.top=`${t.bottom+8}px`,i.dataset.open=""},s=t=>{"focusin"===t.type&&!e.matches(":focus-visible")||(clearTimeout(o),o=window.setTimeout(a,"focusin"===t.type?0:400))};(t??e.ownerDocument.body).append(i),e.addEventListener("pointerenter",s,{signal:n}),e.addEventListener("focusin",s,{signal:n});for(let t of["pointerleave","pointerdown","focusout"])e.addEventListener(t,r,{signal:n});return n.addEventListener("abort",()=>{r(),i.remove()}),()=>{void 0!==i.dataset.open&&a()}}(s,i,x),c=0;m=()=>{c=Math.max(0,n.findIndex(n=>n.id===(lt(e)??t))),s.setAttribute("aria-checked",String(1===c)),s.setAttribute("aria-label",`Theme: ${o[c]}`),s.dataset.tip=`Switch to ${o[1-c]}`,a?s.innerHTML="dark"===r[c]?gt:ut:s.dataset.on=String(c),d()},s.addEventListener("click",()=>b(e,t,n[1-c].id)),p===e&&(h=s)}else{let e=f=ae("details","design-theme-switch"),t=ae("summary");t.setAttribute("aria-label","Preview theme");let n=ae("div","design-theme-popup");n.setAttribute("role","group"),n.setAttribute("aria-label","Theme preview options"),e.append(t,n);let i=[];for(let{axis:e,current:t,options:o,names:r}of l){let a,s=ct(e.label,String(e.id)),d=ae(o.length>3?"label":"div","design-field design-react-field");if(o.length>3){let i=a=ae("select");o.forEach((e,t)=>i.append(new Option(r[t],e.id))),i.value=t,i.addEventListener("change",()=>b(e,t,i.value)),import("./select-menu-OZVNHZ73.js").then(e=>e.attach(n),()=>{})}else a=ae("div","design-theme-options"),a.setAttribute("role","group"),o.forEach((n,i)=>{let o=ae("button","",r[i]);o.type="button",o.setAttribute("aria-pressed",String(n.id===t)),o.addEventListener("click",()=>b(e,t,n.id)),a.append(o)});a.setAttribute("aria-label",`${s} theme`),p===e&&(h=a.querySelector("[aria-pressed=true]")??a),i.push(()=>{let n=lt(e)??t;a instanceof HTMLSelectElement?a.value=n:a.querySelectorAll("button").forEach((e,t)=>e.setAttribute("aria-pressed",String(o[t].id===n)));let i=o.findIndex(e=>e.id===n);return`${s}: ${i<0?ct(void 0,n):r[i]}`}),d.append(ae("span","",s),a),n.append(d)}m=()=>{let e=i.map(e=>e());t.textContent=e[0].split(": ").slice(1).join(": ")+(e.length>1?" +"+(e.length-1):""),t.title=`Preview theme · ${e.join(" · ")}`},e.open=s||!!h,k=()=>{e.open=!1},e.addEventListener("keydown",i=>{"ArrowDown"===i.key&&i.target===t&&(i.preventDefault(),e.open=!0,n.querySelector("button,select")?.focus())}),e.addEventListener("focusout",t=>{t.relatedTarget instanceof Node&&!e.contains(t.relatedTarget)&&k()}),e.ownerDocument.defaultView?.addEventListener("keydown",n=>{!e.open||"Escape"!==n.key||!n.composedPath().includes(e)||e.querySelector("select[aria-expanded=true]")||(n.preventDefault(),n.stopImmediatePropagation(),k(),t.focus())},{capture:!0,signal:x})}m(),at.set(f,()=>{k(),v.abort()}),Ve(i),r?r.insertBefore(f,r.querySelector(".design-inspector__close")):e.prepend(f);let y=f.getRootNode();y.addEventListener("palette-theme-change",m,{signal:x}),y.addEventListener("pointerdown",e=>{e.composedPath().includes(f)||k()},{capture:!0,signal:x}),N(f,()=>{k(),f.isConnected||v.abort()},x),h?.focus({preventScroll:!0})}function mt(e){e=ue(e)??e;let t=le.get(e),n=R(e);!t?.size||!n||(n.setProps({...n.props,...Object.fromEntries(t)}),n.releaseProps?.([...t.keys()]),le.delete(e),pe.delete(e))}function ht(e,t){if(e.title=void 0===t?"unset":""===t?"Empty string":"",e instanceof HTMLInputElement&&"checkbox"===e.type)return e.checked=!0===t,void e.toggleAttribute("data-unset",void 0===t);e.value=void 0===t?"":String(t),e instanceof HTMLInputElement&&(e.placeholder=void 0===t?"unset":'""')}function bt(e,t){e.className="design-react-scrub";let n=()=>Number(t.value)||0,i=e=>{t.value=String(Math.round(100*e)/100)};e.addEventListener("pointerdown",o=>{if(o.button||t.disabled)return;o.preventDefault(),e.setPointerCapture?.(o.pointerId);let r=o.clientX,a=!1,s=n();e.onpointermove=e=>{let o=Math.trunc((e.clientX-r)/2);o&&(r+=2*o,a=!0,i(n()+o*(e.shiftKey?10:1)),t.dispatchEvent(new CustomEvent("palette-preview",{detail:t.value})))},e.onpointerup=e.onpointercancel=()=>{if(e.onpointermove=e.onpointerup=e.onpointercancel=null,!a)return t.focus();t.dispatchEvent(new CustomEvent("palette-preview",{detail:null})),n()!==s&&t.dispatchEvent(new Event("change",{bubbles:!0}))}}),t.addEventListener("keydown",e=>{"ArrowUp"!==e.key&&"ArrowDown"!==e.key||(e.preventDefault(),i(n()+("ArrowUp"===e.key?1:-1)*(e.shiftKey?10:1)),t.dispatchEvent(new Event("change",{bubbles:!0})))})}function vt(e,t,n,i,r){if(!r){r=ae("summary");let n=ae("span","design-react-name",t);n.title=t,r.append(n),e.append(r)}n&&r.after(o(t,n,i))}function xt(e,t,n,i,o,r){e=ue(e)??e;let a,s=t.definition.props.find(e=>e.name===n);if(!s||!z(s,i))return o.setAttribute("aria-invalid","true"),!1;o.removeAttribute("aria-invalid");try{let e=t.props;if(a=e[n],Object.is(a,i))return!0;t.setProps({...e,[n]:i})}catch{return o.setAttribute("aria-invalid","true"),o.title="Runtime preview is unavailable. The component kept its current props.",!1}let d=le.get(e);d||le.set(e,d=new Map);let l=d.has(n)?d.get(n):(pe.get(e)?.find(e=>e.propName===n)??{before:a}).before;Object.is(l,i)?(d.delete(n),t.releaseProps?.([n])):d.set(n,l),d.size||le.delete(e);let p=pe.get(e);return p||pe.set(e,p=[]),p.push({propName:n,before:a,after:i}),ce.delete(e),r(()=>tt(e)),!0}function kt(e,t,n,i,o,r,a){let s=R(e);if(!s){let t,r=Me(e,o);try{t=r&&ie(e,o)?.editor?.(r)}catch{}if(t&&r&&re(r.element)){if(r.element!==e){Ve(n);let e=document.createElement("small");if(e.className="design-react-source design-react-group design-react-inside",e.append(`Inside ${r.name}`),i){let t=document.createElement("button");t.type="button",t.textContent="Select component",t.addEventListener("click",()=>i(r.element)),e.append(" · ",t)}return e}s=j(r,t)}if(!s){let t=null;try{t=r&&ie(e,o)?.panel?.(r)||null}catch{}if(t){Ve(n);let e=t.querySelector("summary");e&&r&&vt(t,r.name,r.source??"",a,e)}return t??function(e,t,n){let i=O(e);if(!i)return null;Ve(n);let o=document.createElement("small");if(o.className="design-react-source design-react-group design-react-inside",o.append(`Inside ${i.component.definition.name}`),t){let e=document.createElement("button");e.type="button",e.textContent="Select component",e.addEventListener("click",()=>t(i.root)),o.append(" · ",e)}return o}(e,i,n)}}Ve(n);let d=document.createElement("details");d.className="design-group design-react-group",d.open=!0,vt(d,s.definition.name,ye(s),a);let l=s,p=[];if(r&&s.subscribe){let t=0,i=!1,o=new AbortController,a=d.getRootNode(),l=()=>{t||!d.isConnected||(t=requestAnimationFrame(()=>{if(t=0,!d.isConnected)return;let n=d.getRootNode(),o=n.activeElement;p.forEach(e=>e()),!o?.closest(".design-inspector,.palette-tokens,.palette-select")&&!n.querySelector(".palette-tokens,.palette-select")&&(i=!1,r(e.isConnected?d:void 0))}))},c=s.subscribe(()=>{e=ue(e)??e,i=!0,l()});(n??a).addEventListener("focusout",()=>{queueMicrotask(()=>{i&&l()})},{signal:o.signal});let u=()=>{c(),cancelAnimationFrame(t),o.abort()};queueMicrotask(()=>{d.isConnected?N(d,()=>{d.isConnected||u()},o.signal):u()})}for(let n of s.definition.props.filter(e=>"unsupported"!==e.kind)){let i=n.styleProperty,o=document.createElement("label");o.className="design-field design-react-field";let r=document.createElement("span");r.textContent=n.name;let a,c=s.props[n.name];if("enum"===n.kind){let e=document.createElement("select");for(let t of n.values??[]){let n=document.createElement("option");n.value=String(t),n.textContent=String(t),e.append(n)}if(void 0===c&&!n.required){let t=document.createElement("option");t.value="",t.textContent="unset",e.prepend(t)}a=e}else{let e=document.createElement("input");"boolean"===n.kind?(e.type="checkbox",e.setAttribute("role","switch"),e.className="design-react-switch"):"number"===n.kind?(e.type="number",e.step="any",bt(r,e)):(e.type="text",e.maxLength=500,e.autocomplete="off"),a=e}if(ht(a,c),a.setAttribute("aria-label",`${s.definition.name} ${n.name}`),"unsupported"===n.kind)a=document.createElement("input"),a.disabled=!0,a.value=`Read only · ${n.typeLabel}`,a.setAttribute("aria-label",`${s.definition.name} ${n.name}, read only`),o.title=`Inline feedback does not edit ${n.typeLabel} props.`;else{let i,o=()=>{let i=a instanceof HTMLInputElement&&"checkbox"===a.type?a.checked:a.value,o=i;"number"===n.kind?o=""===String(i).trim()?void 0:Number(i):"enum"===n.kind?o=r(String(i)):"boolean"===n.kind&&(o=!0===i),xt(e,l,n.name,o,a,t)&&"boolean"===n.kind&&ht(a,o)},r=e=>""!==e||n.required?(n.values??[]).find(t=>String(t)===e):void 0;a.addEventListener("change",o),("enum"===n.kind||"number"===n.kind)&&a.addEventListener("palette-preview",t=>{e=ue(e)??e;let o=t.detail,a=l.props,s=a[n.name];try{null!==o?(i??={opening:s},i.shown="number"===n.kind?Number(o):r(o),l.setProps({...a,[n.name]:i.shown})):i&&(Object.is(s,i.shown)||Object.is(s,i.opening))&&(l.setProps({...a,[n.name]:i.opening}),le.get(e)?.has(n.name)||l.releaseProps?.([n.name]))}catch{}null===o&&(i=void 0)})}r.title=n.name,o.append(r,a);let u=document.createElement("div");u.className="design-react-row";let g=document.createElement("button");g.type="button",g.className="design-theme-reset",g.setAttribute("aria-label",`Reset ${s.definition.name} ${n.name}`),g.title="Restore the value before editing",g.innerHTML='<svg viewBox="0 0 16 16"><path d="M2.5 2.5v3h3M3 5.5a5.5 5.5 0 1 1-.5 2.5"/></svg>';let f=()=>{g.hidden=!le.get(e)?.has(n.name)};p.push(()=>{a===a.getRootNode().activeElement||"true"===a.getAttribute("aria-expanded")||(ht(a,l.props[n.name]),f())}),a.addEventListener("change",f),g.addEventListener("click",()=>{let i=le.get(e);i?.has(n.name)&&(xt(e,l,n.name,i.get(n.name),a,t),ht(a,l.props[n.name]),f(),a.focus())}),f(),u.append(o,g);let m=document.createElement("small");if(m.className="design-react-type",m.textContent=`${n.typeLabel}${n.required?" · required":" · optional"}`,o.append(m),o.title||=m.textContent,"string"===n.kind&&i){let r=V(e),d=r?J(r,i):[];if(d.length){let r=document.createElement("span");r.className="design-token-binding";let l=document.createElement("span");l.textContent="Style token";let p=document.createElement("select");p.setAttribute("aria-label",`Style token for ${n.name}`);let c=document.createElement("option");c.value="custom",c.textContent="Custom value",p.append(c);for(let e of d){let t=document.createElement("option");t.value=e.path,t.textContent=e.path,p.append(t)}let u=()=>{let e=d.find(e=>s.props[n.name]===`var(${e.cssVariable})`);p.value=e?.path??"custom",r.dataset.mode=e?"token":"custom"};p.addEventListener("change",()=>{let o=d.find(e=>e.path===p.value),r=o?`var(${o.cssVariable})`:"string"==typeof s.props[n.name]&&String(s.props[n.name]).startsWith("var(")?e.ownerDocument.defaultView?.getComputedStyle(e).getPropertyValue(i).trim()??"":"string"==typeof s.props[n.name]?s.props[n.name]:"";xt(e,s,n.name,r,a,t)&&u()}),r.append(l,p),o.append(r),u()}}d.append(u)}return d.toggleAttribute("data-empty",!d.querySelector(".design-react-row")),d}export{fe as attachDesignSystemControls,We as attachStyleTokenControls,ft as attachThemeSwitcher,Ce as beginReactTextEdit,De as canUndoDesignTokenEdit,Le as canUndoReactProp,Ae as cancelReactTextEdit,Ye as createAdapterTokenControl,Je as createDesignThemePanel,Ke as createElementTokenControl,kt as createReactPropsPanel,q as cssVariableTokens,Te as designContext,$e as finishReactTextEdit,ze as hasDesignTokenEdit,Ee as hasReactPropChanges,je as installCommentCapture,g as listTokens,Qe as noteDesignTokenOverride,p as originalDesignTokenStyle,Se as previewReactTextEdit,qe as proposedDesignChanges,Pe as proposedReactChanges,nt as redoReactProp,Oe as resetDesignTokenEdits,it as resetPreviews,mt as resetReactProps,pt as restoreThemes,ge as retainReactPropSelection,ue as retainReactPropTarget,we as showDesignBefore,et as syncDesignTokenBinding,c as themeState,Xe as tokenBoundProperties,Re as undoDesignTokenEdit,tt as undoReactProp};

package/dist/react.d.ts

@@ -26,6 +26,8 @@ export interface UsePaletteInspectableOptions {
  */
 export declare function usePaletteInspectable(options: UsePaletteInspectableOptions): {
     ref: RefCallback<HTMLElement>;
+    "data-palette-inspectable": string;
+    /** @deprecated Kept for hosts that select it; use `data-palette-inspectable`. */
     "data-komo-inspectable": string;
 };
 export interface UsePaletteDesignTokensOptions {

package/dist/react.js

@@ -1 +1 @@
-"use client";import{B as e,d as n,e as t,h as r}from"./chunk-DVYSFT6O.js";import{b as s}from"./chunk-5OVDW2RU.js";import"./chunk-2J3IID4N.js";import"./chunk-RBHY7UDS.js";import"./chunk-LMXFSXO6.js";import"./chunk-57MG3M5P.js";import"./chunk-2BS2OWWH.js";import"./chunk-XOMOONGK.js";import"./chunk-DZRM3YUQ.js";import"./chunk-6HM4JQLV.js";import"./chunk-IQOPM3JF.js";import{useEffect as o,useRef as i}from"react";function u(e){let n=i(null);o(()=>{if(n.current&&function(e,n){return[...new Set([...Object.keys(e),...Object.keys(n)])].every(t=>{if("shortcuts"===t||"features"===t||"frame"===t||"pins"===t){let r=e[t]??{},s=n[t]??{};return Object.keys({...r,...s}).every(e=>Object.is(r[e],s[e]))}if("design"===t){let t=e.design,r=n.design;if(!t||!r)return t===r;let s=t.themes??[],o=r.themes??[];return t.tokens===r.tokens&&t.components===r.components&&s.length===o.length&&s.every((e,n)=>e===o[n])}if("persistentRegions"===t)return e[t]?.length===n[t]?.length&&(e[t]??[]).every((e,r)=>e===n[t]?.[r]);if("onboarding"!==t)return Object.is(e[t],n[t]);let r=e.onboarding,s=n.onboarding;return r&&s?Object.keys({...r,...s}).every(e=>"sites"===e?r.sites?.length===s.sites?.length&&(r.sites??[]).every((e,n)=>e===s.sites?.[n]):Object.is(r[e],s[e])):r===s})}(n.current.config,e)||(n.current?.controller.destroy(),n.current=null,!1===e.enabled))return;let t={...e,...e.persistentRegions?{persistentRegions:[...e.persistentRegions]}:{},...e.onboarding?{onboarding:{...e.onboarding,...e.onboarding.sites?{sites:[...e.onboarding.sites]}:{}}}:{}};n.current={config:t,controller:s(t)}}),o(()=>()=>{n.current?.controller.destroy(),n.current=null},[])}function c(e){let r=i(null),s=i(null);return s.current||(s.current=e=>{r.current=e}),o(()=>{if(!0===e.enabled&&r.current)return n(r.current,e.component,e.props,e.onChange)},[e.enabled,e.component]),o(()=>{!0===e.enabled&&t(r.current,e.component,e.props,e.onChange)},[e.enabled,e.component,e.props,e.onChange]),{ref:s.current,"data-komo-inspectable":e.component.id}}function a(e){o(()=>{if(!0!==e.enabled)return;let n=e.root??document.documentElement;return r(n,e.tokens)},[e.root,e.tokens,e.enabled])}var l=u,p=c,m=a;export{e as cssVariableTokens,l as useKomo,m as useKomoDesignTokens,p as useKomoInspectable,u as usePalette,a as usePaletteDesignTokens,c as usePaletteInspectable};
+"use client";import{B as e,d as n,e as t,h as r}from"./chunk-FGZXQUAD.js";import{b as s}from"./chunk-U55ASP2Y.js";import"./chunk-KLPQTFVH.js";import"./chunk-RBHY7UDS.js";import"./chunk-LMXFSXO6.js";import"./chunk-DU7H4TEX.js";import"./chunk-5HZI7HRR.js";import"./chunk-2BS2OWWH.js";import"./chunk-XOMOONGK.js";import"./chunk-J47R52WX.js";import"./chunk-VX6XCU4E.js";import"./chunk-4HBBEVFK.js";import{useEffect as o,useRef as i}from"react";function c(e){let n=i(null);o(()=>{if(n.current&&function(e,n){return[...new Set([...Object.keys(e),...Object.keys(n)])].every(t=>{if("shortcuts"===t||"features"===t||"frame"===t||"pins"===t){let r=e[t]??{},s=n[t]??{};return Object.keys({...r,...s}).every(e=>Object.is(r[e],s[e]))}if("design"===t){let t=e.design,r=n.design;if(!t||!r)return t===r;let s=t.themes??[],o=r.themes??[];return t.tokens===r.tokens&&t.components===r.components&&s.length===o.length&&s.every((e,n)=>e===o[n])}if("persistentRegions"===t)return e[t]?.length===n[t]?.length&&(e[t]??[]).every((e,r)=>e===n[t]?.[r]);if("onboarding"!==t)return Object.is(e[t],n[t]);let r=e.onboarding,s=n.onboarding;return r&&s?Object.keys({...r,...s}).every(e=>"sites"===e?r.sites?.length===s.sites?.length&&(r.sites??[]).every((e,n)=>e===s.sites?.[n]):Object.is(r[e],s[e])):r===s})}(n.current.config,e)||(n.current?.controller.destroy(),n.current=null,!1===e.enabled))return;let t={...e,...e.persistentRegions?{persistentRegions:[...e.persistentRegions]}:{},...e.onboarding?{onboarding:{...e.onboarding,...e.onboarding.sites?{sites:[...e.onboarding.sites]}:{}}}:{}};n.current={config:t,controller:s(t)}}),o(()=>()=>{n.current?.controller.destroy(),n.current=null},[])}function u(e){let r=i(null),s=i(null);return s.current||(s.current=e=>{r.current=e}),o(()=>{if(!0===e.enabled&&r.current)return n(r.current,e.component,e.props,e.onChange)},[e.enabled,e.component]),o(()=>{!0===e.enabled&&t(r.current,e.component,e.props,e.onChange)},[e.enabled,e.component,e.props,e.onChange]),{ref:s.current,"data-palette-inspectable":e.component.id,"data-komo-inspectable":e.component.id}}function a(e){o(()=>{if(!0!==e.enabled)return;let n=e.root??document.documentElement;return r(n,e.tokens)},[e.root,e.tokens,e.enabled])}var l=c,p=u,m=a;export{e as cssVariableTokens,l as useKomo,m as useKomoDesignTokens,p as useKomoInspectable,c as usePalette,a as usePaletteDesignTokens,u as usePaletteInspectable};

package/dist/select-menu-OZVNHZ73.js

@@ -0,0 +1 @@
+import{c as e}from"./chunk-KELFDOEC.js";import{a as t,c as o}from"./chunk-PF4NYFZK.js";import{h as n}from"./chunk-4FX5IS2U.js";import"./chunk-XOMOONGK.js";var l,i=new WeakSet,a=new WeakMap,r=new WeakMap,s=new WeakSet,d=0;function p(e,o,n){o&&a.set(e,o),n&&r.set(e,n),l&&!l.select.isConnected&&l.close();let d=e.getRootNode();if((d instanceof ShadowRoot||d===document)&&!s.has(d)){s.add(d);let e=document.createElement("style");e.textContent=t+".design-field>select{appearance:none;padding-right:20px;cursor:pointer;background:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M1.5 3 4 5.5 6.5 3' fill='none' stroke='%23898680' stroke-width='1.2'/%3E%3C/svg%3E\") right 7px center/8px no-repeat}.palette-select{width:max-content;max-height:240px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:4px;line-height:1.2}.palette-select[popover]{position:fixed;inset:auto;margin:0;border:0}.palette-select [role=option]{display:flex;align-items:center;gap:8px;box-sizing:border-box;min-height:28px;padding:0 8px;border-radius:6px;white-space:nowrap;cursor:pointer}.palette-select [role=option] span{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}.palette-select [role=option]::after{content:'';flex:none;width:7px;height:3.5px;margin:-3px 1px 0 0;border:solid transparent;border-width:0 0 1.5px 1.5px;rotate:-45deg}.palette-select [data-active]{background:#ffffff14;color:#f1efeb}.palette-select [aria-selected=true]{color:#f1efeb}.palette-select [aria-selected=true]::after{border-color:#bda6ef}.palette-select [aria-disabled=true]{opacity:.4;cursor:default}.palette-select small{display:block;padding:8px 8px 4px;color:#77736f;font-size:10px;font-weight:500}.palette-select [role=group]+[role=group],.palette-select [role=option]+[role=group]{margin-top:4px;border-top:1px solid #ffffff0d}@media (pointer:coarse){.palette-select{font-size:13px}.palette-select [role=option]{min-height:40px}}",(d instanceof ShadowRoot?d:document.head).append(e)}if(i.has(e))return;i.add(e);let p=e=>{let t=e.composedPath()[0];return t instanceof HTMLSelectElement&&!t.disabled&&!t.multiple&&!t.dataset.picker?t:null};e.addEventListener("focusin",e=>{let t=p(e);t&&!t.hasAttribute("aria-haspopup")&&(t.setAttribute("aria-haspopup","listbox"),t.setAttribute("aria-expanded","false"))}),e.addEventListener("pointerdown",t=>{c="mouse"===t.pointerType?void 0:t;let o=p(t);!o||t.button||(t.preventDefault(),c||f(o,a.get(e)))},!0),e.addEventListener("pointerup",t=>{let o=p(t);o&&c&&!u(t)&&f(o,a.get(e))},!0);for(let t of["mousedown","touchend"])e.addEventListener(t,e=>{p(e)&&e.cancelable&&e.preventDefault()},!0);e.addEventListener("keydown",t=>{let o=p(t);if(!o||l?.select===o||t.ctrlKey||t.metaKey)return;let n=1===t.key.length&&" "!==t.key&&!t.altKey;n&&(/^[b?]$/i.test(t.key)||r.get(e)?.(t))||!n&&!["Enter"," ","ArrowDown","ArrowUp"].includes(t.key)||(t.preventDefault(),h(o,a.get(e),n?t.key:""))},!0)}var c,u=e=>c&&Math.abs(e.clientY-c.clientY)>10;function f(e,t){if(l?.select===e)return l.close();c||e.focus(),h(e,t)}function h(t,i,a=""){l?.close(),c=void 0;let r="palette-select-"+ ++d,s=document.createElement("div");s.className="palette-select",s.id=r,s.setAttribute("role","listbox"),s.setAttribute("aria-label",t.getAttribute("aria-label")??t.title);let p=[],f=(e,t)=>{let o=document.createElement("div");o.id=`${r}-${p.length}`,o.setAttribute("role","option"),o.setAttribute("aria-selected",String(e.selected)),e.disabled&&o.setAttribute("aria-disabled","true"),e.title&&(o.title=e.title);let n=document.createElement("span");n.textContent=e.label,n.style.cssText=e.style.cssText,o.append(n),t.append(o),p.push({node:o,option:e})};for(let e of t.children)if(e instanceof HTMLOptionElement)f(e,s);else if(e instanceof HTMLOptGroupElement){let t=document.createElement("div");t.setAttribute("role","group"),t.setAttribute("aria-labelledby",`${r}-g${p.length}`);let o=document.createElement("small");o.id=`${r}-g${p.length}`,o.textContent=e.label,t.append(o);for(let o of e.querySelectorAll("option"))f(o,t);s.append(t)}let h,g=-1,m=t.dataset.property,b=()=>{let e=h;h=void 0,e?.()},v=p.flatMap((e,t)=>e.option.disabled?[]:[t]),x=(o,l=!0)=>{if(!(o>=0))return;if(o!==g&&l){b();let{value:l,selected:a}=p[o].option;if(!a){let o=e=>t.dispatchEvent(new CustomEvent("palette-preview",{detail:e}));h=e(i,()=>i&&m?n(i,m,l):(o(l),()=>o(null)))}}p[g]?.node.removeAttribute("data-active"),g=o;let a=p[o].node;a.toggleAttribute("data-active",!0),t.setAttribute("aria-activedescendant",a.id);let r=a.offsetTop,d=r+a.offsetHeight;r<s.scrollTop?s.scrollTop=r-4:d>s.scrollTop+s.clientHeight&&(s.scrollTop=d-s.clientHeight+4)},w=e=>{let t=v.indexOf(g);x(v[t<0?0:Math.max(0,Math.min(v.length-1,t+e))])},E=e=>{let o=p[e]?.option;k(),o&&!o.disabled&&!o.selected&&(o.selected=!0,t.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),t.dispatchEvent(new Event("change",{bubbles:!0})))},A=new AbortController,{signal:y}=A;function k(){l?.close===k&&(l=void 0,b(),A.abort(),s.remove(),t.setAttribute("aria-expanded","false"),t.removeAttribute("aria-activedescendant"),t.removeAttribute("aria-controls"))}l={select:t,close:k};let L="",M=0,C=(e,t)=>{L=t-M<1e3?L+e.toLowerCase():e.toLowerCase(),M=t;let o=Math.max(0,v.indexOf(g)+(L[1]?0:1)),n=[...v.slice(o),...v.slice(0,o)].find(e=>p[e].option.label.toLowerCase().startsWith(L));void 0!==n&&x(n)};addEventListener("keydown",e=>{if(!t.isConnected||e.composedPath()[0]!==t)return k();let o=e.key;if(!(e.ctrlKey||e.metaKey||e.altKey&&!o.startsWith("Arrow"))){if("Tab"===o)return k();if("ArrowDown"===o||"ArrowUp"===o)w("ArrowDown"===o?1:-1);else if("Home"===o||"PageUp"===o)x(v[0]);else if("End"===o||"PageDown"===o)x(v[v.length-1]);else if("Escape"===o)k();else if("Enter"===o||" "===o&&!L)E(g);else if(1===o.length)C(o,e.timeStamp);else if("ArrowLeft"!==o&&"ArrowRight"!==o)return;e.preventDefault(),e.stopImmediatePropagation()}},{capture:!0,signal:y}),addEventListener("pointerdown",e=>{let o=e.composedPath();!o.includes(s)&&!o.includes(t)&&k()},{capture:!0,signal:y});let T,W=e=>{let o=t.getBoundingClientRect();e.target!==s&&(!T||Math.abs(o.top-T.top)+Math.abs(o.left-T.left)>1)&&k()};addEventListener("scroll",W,{capture:!0,signal:y}),t.getRootNode().addEventListener("scroll",W,{capture:!0,signal:y}),addEventListener("resize",k,{signal:y}),o(t,k,y),t.addEventListener("blur",k,{signal:y}),s.addEventListener("mousedown",e=>e.preventDefault(),{signal:y}),s.addEventListener("pointerleave",()=>{b(),p[g]?.node.removeAttribute("data-active"),t.removeAttribute("aria-activedescendant"),g=-1},{signal:y}),s.addEventListener("pointermove",e=>{let t=e.target.closest?.("[role=option]"),o=p.findIndex(e=>e.node===t);v.includes(o)&&o!==g&&x(o)},{signal:y}),s.addEventListener("click",e=>{if(e.preventDefault(),u(e))return;let t=e.target.closest?.("[role=option]"),o=p.findIndex(e=>e.node===t);v.includes(o)&&E(o)},{signal:y});let D=t.closest(".design-field")??t.parentElement;s.popover="manual",(t.closest(".palette-tokens")??D).append(s),s.showPopover?.(),t.setAttribute("aria-haspopup","listbox"),t.setAttribute("aria-expanded","true"),t.setAttribute("aria-controls",r),T=t.getBoundingClientRect();let $=(t.offsetWidth<60?D:t).getBoundingClientRect(),H=Math.min(Math.max($.width,s.offsetWidth+2,120),innerWidth-16),K=innerHeight-$.bottom-8,S=$.top-8,O=s.scrollHeight,P=O>K&&S>K,R=Math.max(P?S:K,60),I=Math.min(O,240,R);s.style.width=`${H}px`,s.style.maxHeight=`${Math.min(240,R)}px`,s.style.left=`${Math.max(8,Math.min($.left,innerWidth-H-8))}px`,s.style.top=`${P?$.top-I-4:$.bottom+4}px`,s.toggleAttribute("data-up",P);for(let{node:e,option:t}of p)!e.title&&e.firstElementChild.scrollWidth>e.firstElementChild.clientWidth&&(e.title=t.label);x(p.findIndex(e=>e.option.selected&&!e.option.disabled),!1),g<0&&w(0),a&&C(a,performance.now())}export{p as attach};