@hazem3500/palette 0.9.108 → 0.9.110

package/dist/setup.js

@@ -1 +1 @@
-import{a as n,d as o}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-DZRM3YUQ.js";import"./chunk-6HM4JQLV.js";import"./chunk-IQOPM3JF.js";function r(r){return(t={})=>o(n({...r,...t}))}var t=r;export{t as defineKomo,r as definePalette};
+import{a as n,d as o}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-J47R52WX.js";import"./chunk-VX6XCU4E.js";import"./chunk-4HBBEVFK.js";function r(r){return(t={})=>o(n({...r,...t}))}var t=r;export{t as defineKomo,r as definePalette};

package/dist/shell-mode-PLV6F474.js

@@ -0,0 +1 @@
+var e="palette-shell",t="palette:shell";function a(t,a){let o=new URL(t,location.href);return o.searchParams.delete("komo-shell"),a?o.searchParams.set(e,a):o.searchParams.delete(e),o.href}function o(e,o=""){try{sessionStorage.removeItem(t),sessionStorage.removeItem("komo:shell"),o&&sessionStorage.setItem("palette:shell-off",o)}catch{}location.replace(a(e,""))}function r(e,o,r,n){if(o&&!confirm(`Reload so the app runs once, in the frame?\n\nUnsaved changes in the app are lost${r?", and so are design changes you haven't posted":""}. Cancel keeps a second copy instead.`))return n();try{let o=Array.from(crypto.getRandomValues(new Uint8Array(16)),e=>e.toString(16).padStart(2,"0")).join("");sessionStorage.setItem(t,JSON.stringify({v:1,project:e,nonce:o,origin:location.origin})),location.replace(a(location.href,o))}catch{return n()}setTimeout(n,3e3)}function n(e,t){try{let o=e.location.href,r=a(o,t);o.startsWith(location.origin)&&r!==location.href&&history.replaceState(history.state,"",r)}catch{}}export{r as enterShell,o as leaveShellPage,a as shellUrl,n as syncShell};

package/dist/shell-session.d.ts

@@ -1,9 +1,11 @@
 /** The URL parameter that carries the shell's nonce. */
-export declare const SHELL_PARAM = "komo-shell";
+export declare const SHELL_PARAM = "palette-shell";
+/** Its name before the rename; still accepted. */
+export declare const LEGACY_SHELL_PARAM = "komo-shell";
 /** sessionStorage: the shell Palette started in this tab, `{ v, project, nonce, origin }`. */
-export declare const SHELL_KEY = "komo:shell";
+export declare const SHELL_KEY = "palette:shell";
 /** sessionStorage: why the last shell ended early. This tab then keeps two copies, without reloading. */
-export declare const SHELL_OFF_KEY = "komo:shell-off";
+export declare const SHELL_OFF_KEY = "palette:shell-off";
 /** The page's shell nonce, when Palette started a shell for `project` in this tab; else "". */
 export declare function shellNonce(project: string): string;
 /** Palette started in this shell, so the guard's fallback stands down. */

package/dist/shell.d.ts

@@ -7,7 +7,7 @@ export interface ShellOptions {
  * skip mounting the app, and start Palette with `frame: { mode: "iframe", shell: true }`.
  *
  * Only Palette makes a shell: it sets a random nonce in this tab's sessionStorage and
- * in the URL. A link with `?komo-shell=…` alone, or a flag left by another project
+ * in the URL. A link with `?palette-shell=…` (or the older `?komo-shell=…`) alone, or a flag left by another project
  * or origin, returns false. If Palette doesn't start within `timeout`, the shell is
  * cleared and the normal page loads, so a shell is never left blank.
  */

package/dist/shell.js

@@ -1 +1 @@
-var e="komo-shell";function o(o,t=""){try{sessionStorage.removeItem("komo:shell"),t&&sessionStorage.setItem("komo:shell-off",t)}catch{}location.replace(function(o,t){let r=new URL(o,location.href);return t?r.searchParams.set(e,t):r.searchParams.delete(e),r.href}(o,""))}function t(e,t={}){let r=function(e){try{if("komo-viewport"===window.name)return"";let o=new URL(location.href).searchParams.get("komo-shell"),t=JSON.parse(sessionStorage.getItem("komo:shell")??"null");return o&&1===t?.v&&t.nonce===o&&t.project===e&&t.origin===location.origin?o:""}catch{return""}}(e);return r&&setTimeout(()=>{(e=>window[Symbol.for("komo.shell")]===e)(r)||o(location.href,"Palette didn't start in the single-copy shell in time.")},t.timeout??4e3),!!r}export{t as isShell};
+var e="palette-shell";function t(t,o=""){try{sessionStorage.removeItem("palette:shell"),sessionStorage.removeItem("komo:shell"),o&&sessionStorage.setItem("palette:shell-off",o)}catch{}location.replace(function(t,o){let l=new URL(t,location.href);return l.searchParams.delete("komo-shell"),o?l.searchParams.set(e,o):l.searchParams.delete(e),l.href}(t,""))}var o=e=>[Symbol.for("palette.shell"),Symbol.for("komo.shell")].some(t=>window[t]===e);function l(e,l={}){let s=function(e){try{if(/^(palette|komo)-viewport$/.test(window.name))return"";let t=new URL(location.href).searchParams,o=t.get("palette-shell")??t.get("komo-shell"),l=JSON.parse(sessionStorage.getItem("palette:shell")??sessionStorage.getItem("komo:shell")??"null");return o&&1===l?.v&&l.nonce===o&&l.project===e&&l.origin===location.origin?o:""}catch{return""}}(e);return s&&setTimeout(()=>{o(s)||t(location.href,"Palette didn't start in the single-copy shell in time.")},l.timeout??4e3),!!s}export{l as isShell};

package/dist/shortcut-help-DIMOT2ZK.js

@@ -0,0 +1 @@
+import{a as t}from"./chunk-RBHY7UDS.js";import{a as e,b as o,c as r,d as a}from"./chunk-VX6XCU4E.js";import{E as n,G as i}from"./chunk-4HBBEVFK.js";var s=(t,e,o,r={})=>({label:t,group:o,shortcut:{key:e,label:e,alt:!1,shift:!1,ctrl:!1,meta:!1,...r}});function l(o=e(),r,a=t()){let n="Design canvas",i="Experimental geometry",l="Text editing",p="Compare",c=(t,e,o)=>({label:t,group:e,shortcut:o}),u="enter"!==a.child?.key||a.child.alt||a.child.shift||a.child.ctrl||a.child.meta?a.child:null;return[c("Next sibling",n,a.next),c("Previous sibling",n,a.prev),c("Parent element",n,a.parent),s("Post comment","Enter",n),...u?[c("First child",n,u)]:[],s(u?"First child (alternative)":"First child","ArrowDown",n,{alt:!0}),s("Parent element (alternative)","ArrowUp",n,{alt:!0}),s("Exit Design mode","Escape",n),s("Undo last preview","z",n,o?{meta:!0}:{ctrl:!0}),s("Redo last undo","z",n,o?{meta:!0,shift:!0}:{ctrl:!0,shift:!0}),...o?[]:[s("Redo last undo","y",n,{ctrl:!0})],s("Focus selection to move or resize","M",n),s("Move before previous sibling","ArrowUp",i,{alt:!0}),s("Move after next sibling","ArrowDown",i,{alt:!0}),s("Move out, after its parent","ArrowUp",i,{alt:!0,shift:!0}),s("Move into previous sibling","ArrowDown",i,{alt:!0,shift:!0}),s("Resize width","ArrowRight",i,o?{meta:!0}:{ctrl:!0}),s("Resize height","ArrowDown",i,o?{meta:!0}:{ctrl:!0}),s("Resize by 10px","ArrowRight",i,o?{meta:!0,shift:!0}:{ctrl:!0,shift:!0}),s("Back to the canvas","Escape",i),...r?[{label:"Hide or show selection · hold to peek",group:n,shortcut:r}]:[],s("Commit text","Enter",l),s("New line","Enter",l,{shift:!0}),s("Cancel text edit","Escape",l),s("Toggle before and after","B",p),c("Show before",p,a.before),c("Show after",p,a.after)]}function p(t=e()){let o="Design canvas";return[{label:"Inspect element",group:o,keys:[],gesture:"Click",aria:"Click"},{label:"Select inner element",group:o,keys:[t?"⌘":"Ctrl"],gesture:"Click",aria:(t?"Command":"Control")+" + Click"},{label:"Edit text",group:o,keys:[],gesture:"Double-click",aria:"Double-click"},{label:"Keyboard shortcuts",group:o,keys:["?"],aria:"?"}]}function c(t,e,c=!1,u,h,d=!1){let m=t.querySelector("dialog.palette-shortcuts");if(m)return m.querySelector("[autofocus]")?.focus();let g=t.activeElement??document.activeElement,b=g?.closest(".morphing-menu__panel")?t.querySelector('[data-menu-item="more"]'):g,x=n("dialog","palette-shortcuts");x.setAttribute("aria-modal","true"),x.setAttribute("aria-labelledby","palette-shortcuts-title");let f=n("h2","","Keyboard shortcuts");f.id="palette-shortcuts-title";let v=i("Close",()=>B(),"icon palette-shortcuts__close","close");v.removeAttribute("title");let k=n("span","morphing-menu__tooltip palette-shortcuts__tip","Close");k.setAttribute("aria-hidden","true"),k.append(a(["Esc"],"Escape"));let w=n("header");w.append(f,v,k);let y=n("input");y.type="search",y.placeholder="Filter shortcuts",y.setAttribute("aria-label","Filter shortcuts"),y.autocomplete="off",y.spellcheck=!1;let _=n("div","palette-shortcuts__body");_.tabIndex=0,_.setAttribute("autofocus",""),_.setAttribute("role","region"),_.setAttribute("aria-label","Shortcuts");let E=c?[...p(),...l(void 0,e.find(t=>/^(Hide|Show) comments$/.test(t.label))?.shortcut,h)]:[],C=[...e,s("Post comment","Enter","Comments"),s("New line","Enter","Comments",{shift:!0}),...d?[s("Zoom to fit","1","Frame",{shift:!0}),s("Zoom to 100%","0","Frame",{shift:!0})]:[]],A=("design"===u?[...E,...C]:[...C,...E]).filter(t=>t.shortcut||t.keys?.length||t.gesture),S=[...new Set(A.map(t=>t.group??"General"))].sort((t,e)=>+("comment"===u&&"Comments"===e)-+("comment"===u&&"Comments"===t)),D=[];for(let t of S){let e=n("section");e.append(n("h3","",t));for(let i of A.filter(e=>(e.group??"General")===t)){let t=n("div","palette-shortcuts__row"),s=i.shortcut?o(i.shortcut):void 0;s&&t.setAttribute("aria-keyshortcuts",s.aria);let l=i.shortcut?r(i.shortcut):a(i.keys,i.aria??i.keys.join(" + "));i.gesture&&l.append(n("span","",i.gesture)),t.append(n("span","",i.label),l),e.append(t),D.push([t,`${i.label} ${l.getAttribute("aria-label")} ${l.textContent}`.toLowerCase()])}_.append(e)}let z=n("p","","No matching shortcuts");z.setAttribute("role","status"),z.hidden=!0,_.append(z,n("p","","Shortcuts pause while typing in a text field.")),y.addEventListener("input",()=>{let t=y.value.toLowerCase().split(/\s+/).filter(Boolean);for(let[e,o]of D)e.hidden=!t.every(t=>o.includes(t));for(let t of _.querySelectorAll("section"))t.hidden=!t.querySelector(".palette-shortcuts__row:not([hidden])");z.hidden=D.some(([t])=>!t.hidden)}),x.append(Object.assign(n("style"),{textContent:'.palette-shortcuts{box-sizing:border-box;width:min(720px,calc(100vw - 32px));max-width:none;max-height:min(680px,calc(100dvh - 32px));margin:auto;padding:0;overflow:hidden;border:0;border-radius:16px;background:var(--mm-surface);color:var(--mm-ink);box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--mm-ink) 12%,transparent),0 24px 64px -16px rgb(0 0 0/55%);font:12px/1.4 -apple-system,BlinkMacSystemFont,"Inter","Segoe UI",sans-serif;pointer-events:auto;color-scheme:dark}\n.palette-shortcuts[open]{display:flex;flex-direction:column;animation:palette-help-in var(--duration-fast) var(--ease-smooth-out)}\n.palette-shortcuts::backdrop{background:rgb(0 0 0/40%);pointer-events:auto}\n@keyframes palette-help-in{from{opacity:0;scale:.98;translate:0 4px}}\n.palette-shortcuts header{flex:none;position:relative;display:flex;align-items:center;gap:8px;padding:10px 10px 4px 16px}\n.palette-shortcuts h2{flex:1;margin:0;font-size:14px;font-weight:600}\n.palette-shortcuts__close{width:28px;height:28px;border-radius:8px;color:color-mix(in oklab,var(--mm-ink) 60%,transparent)}\n.palette-shortcuts__close:hover{background:color-mix(in oklab,var(--mm-ink) 8%,transparent);color:var(--mm-ink)}\n.palette-shortcuts__close svg{width:16px;height:16px}\n.palette-shortcuts .palette-shortcuts__tip{top:50%;bottom:auto;right:44px;translate:0 -50%;opacity:0;transition:opacity var(--duration-quick) var(--ease-smooth-out)}\n.palette-shortcuts__close:hover+.palette-shortcuts__tip,.palette-shortcuts__close:focus-visible+.palette-shortcuts__tip{opacity:1;transition-delay:400ms}\n.palette-shortcuts input{flex:none;width:auto;height:30px;margin:6px 16px;padding:0 10px;border-radius:8px;background:color-mix(in oklab,var(--mm-ink) 7%,transparent);box-shadow:none}\n.palette-shortcuts input:focus{box-shadow:inset 0 0 0 1px var(--accent,#bda6ef)}\n.palette-shortcuts input::placeholder{color:color-mix(in oklab,var(--mm-ink) 50%,transparent)}\n.palette-shortcuts__close:focus-visible{outline:2px solid var(--accent,#bda6ef);outline-offset:-2px}\n.palette-shortcuts__body{min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:4px 16px 14px;columns:2 240px;column-gap:28px;outline:0}\n.palette-shortcuts section{break-inside:avoid;padding-bottom:10px}\n.palette-shortcuts h3{margin:0;padding:6px 0 2px;font-size:11px;font-weight:600;color:color-mix(in oklab,var(--mm-ink) 62%,transparent)}\n.palette-shortcuts__row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:28px}\n.palette-shortcuts [hidden]{display:none}\n.palette-shortcuts .palette-kbd{align-items:center;gap:4px}\n.palette-shortcuts__row kbd{box-sizing:border-box;display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:5px;font-size:11px;line-height:1}\n.palette-shortcuts .palette-kbd span,.palette-shortcuts p{color:color-mix(in oklab,var(--mm-ink) 55%,transparent)}\n.palette-shortcuts p{column-span:all;margin:4px 0 0;font-size:11px}\n@media (prefers-reduced-motion:reduce){.palette-shortcuts[open]{animation:none}}\n@media (pointer:coarse){.palette-shortcuts__close{width:44px;height:44px}}'}),w,y,_);let F=new AbortController,{signal:R}=F,B=()=>{R.aborted||(F.abort(),x.close(),x.remove(),b?.isConnected&&b.focus({preventScroll:!0}))};x.addEventListener("close",B,{signal:R}),window.addEventListener("keydown",e=>{let o=e.composedPath().find(t=>t instanceof HTMLDialogElement&&t.open);if(o&&o!==x||(e.stopImmediatePropagation(),e.isComposing))return;let r=t.activeElement===y;if("Escape"!==e.key&&("?"!==e.key||r||e.ctrlKey||e.metaKey||e.altKey)){if("Tab"===e.key){let o=[v,y,_],r=o.indexOf(t.activeElement);e.preventDefault(),o[r<0?e.shiftKey?2:0:(r+(e.shiftKey?2:1))%3].focus()}}else e.preventDefault(),B()},{capture:!0,signal:R});let K=!1,L=t=>{let e=x.getBoundingClientRect();return t.target===x&&(t.clientX<e.left||t.clientX>e.right||t.clientY<e.top||t.clientY>e.bottom)};x.addEventListener("pointerdown",t=>{K=L(t)},{signal:R}),x.addEventListener("click",t=>{K&&L(t)&&B()},{signal:R}),t.append(x),x.showModal()}export{c as showShortcutHelp};

package/dist/snapshot-3PSQKXUV.js

@@ -0,0 +1 @@
+var e="data-palette-no-snapshot",t=`[${e}],[data-komo-no-snapshot]`,a=e=>e.matches(t),n="[data-branch-comments],[data-palette-move-clone],[data-palette-viewport],[data-palette-snapshot-sandbox]",r="[redacted]",o=new Set(["script","noscript","template","style","link","meta","base","title"]),i=/^(?:href|src|action|formaction|xlink:href|poster|data|background)$/i,l=e=>"textarea"===e.localName||"input"===e.localName&&!/^(?:button|submit|reset|image|checkbox|radio|range|color)$/i.test(e.getAttribute("type")??""),s=2e4,c=200,h=500,d=(e,t)=>e.length>t?`${e.slice(0,t-1)}…`:e,u=e=>(new TextEncoder).encode(e).length,m=e=>!!e.closest(`${t},${n}`);function f(e,t=1/0){for(let{name:a,value:n}of[...e.attributes])/^on/i.test(a)||"srcdoc"===a||/^data-(palette|komo)-/.test(a)&&!/-no-snapshot$/.test(a)||i.test(a)&&/^\s*(?:javascript|vbscript):/i.test(n)?e.removeAttribute(a):n.length>t&&e.setAttribute(a,d(n,t))}function p(e,t,i=s){let c=e.ownerDocument,h=i,m=e=>{if(3===e.nodeType){let t=d(e.nodeValue??"",500);return h-=t.length,c.createTextNode(t)}if(1!==e.nodeType)return null;let i=e;if(o.has(i.localName)||i.matches(n))return null;let s=i.cloneNode(!1);if(f(s,200),l(i)&&function(e,t){let a=e.value??e.getAttribute("value")??"";"textarea"===e.localName?t.textContent=a?r:"":(a||t.hasAttribute("value"))&&t.setAttribute("value",r)}(i,s),h-=s.outerHTML.length,a(i))return s;if(t?.(i))return l(i)||(s.textContent=r),s;if("textarea"===i.localName)return s;for(let e of i.childNodes){if(h<=0){s.append(c.createComment(" trimmed "));break}let t=m(e);t&&s.append(t)}return s},p=m(e);if(!p)return"";let g=p.outerHTML;if(u(g)<=i)return g;let w=c.createComment(" trimmed ");p.append(w);for(let e=u(p.outerHTML)-i;e>0&&p.firstChild!==w;e=u(p.outerHTML)-i)for(;e>0&&p.firstChild!==w;){let t=w.previousSibling;for(;t.lastChild;)t=t.lastChild;e-=1===t.nodeType?t.outerHTML.length:(t.nodeValue?.length??0)+7,t.parentNode.removeChild(t)}return g=p.outerHTML,u(g)>i?"":g}var g=class extends Error{constructor(e){super(e),this.reason=e}reason},w=25e4,y=e=>new Promise((t,a)=>{let n=new FileReader;n.onload=()=>t(n.result),n.onerror=()=>a(n.error),n.readAsDataURL(e)});async function b(e,t){if(e.startsWith("data:"))return e;let a=new URL(e,t.document.baseURI);try{let e=await fetch(a,{mode:"cors",signal:AbortSignal.timeout(5e3)});return e.ok?await y(await e.blob()):""}catch{if(a.origin!==t.location.origin)throw new g("cross-origin");return""}}function x(e,t,a){let n="";for(let r=0;r<e.length;r++){let o=e[r];if(o.startsWith("--"))continue;let i=e.getPropertyValue(o);(i!==t.get(o)||a&&i!==a.getPropertyValue(o))&&(n+=`${o}:${i};`)}return n}var v=/url\((['"]?)(.*?)\1\)/g;async function $(e,t,i){let s=e.ownerDocument,c=s.defaultView,h=e.getBoundingClientRect(),d=e.offsetWidth??h.width,u=Math.min(e.offsetHeight??h.height,2e3);if(!d||!u)throw new g("failed");let m=function(){let e=document.createElement("iframe");e.setAttribute("data-palette-snapshot-sandbox",""),e.setAttribute("aria-hidden","true"),e.tabIndex=-1,e.style.cssText="position:fixed;left:-10px;top:0;width:1px;height:1px;border:0;opacity:0;pointer-events:none",document.documentElement.append(e);let t=e.contentDocument;try{t.open(),t.write("<!doctype html><html><head></head><body></body></html>"),t.close()}catch{}let a=new Map;return{of(e){let n=`${e.namespaceURI} ${e.localName}`,r=a.get(n);if(!r){let o=t.createElementNS(e.namespaceURI,e.localName);(t.body??t.documentElement).append(o);let i=t.defaultView.getComputedStyle(o);r=new Map;for(let e=0;e<i.length;e++)r.set(i[e],i.getPropertyValue(i[e]));o.remove(),a.set(n,r)}return r},dispose:()=>e.remove()}}(),p=[],w=new Set,y=new Map,$=[],M="",C=0,T=e=>(e.catch(()=>{}),e),A=e=>{for(let[,,t]of e.matchAll(v))t&&!t.startsWith("data:")&&!y.has(t)&&y.set(t,T(b(t,c)));return e},E=(e,h)=>{if(3===e.nodeType)return s.createTextNode(e.nodeValue??"");if(1!==e.nodeType)return null;let y=e,v=y.localName;if(o.has(v)||y.matches(n))return null;if(++C>3e3)throw new g("too-large");let I,L=c.getComputedStyle(y);if("none"===L.display)return null;if("canvas"===v||"video"===v){I=s.createElement("img");let e=document.createElement("canvas");e.width=y.width||y.videoWidth||1,e.height=y.height||y.videoHeight||1;try{e.getContext("2d").drawImage(y,0,0,e.width,e.height),I.setAttribute("src",e.toDataURL("image/png"))}catch{throw new g("cross-origin")}}else if("iframe"===v||"embed"===v||"object"===v)I=s.createElement("div");else{I=y.cloneNode(!1),f(I);for(let e of["id","class","srcset","sizes","loading","style"])I.removeAttribute(e)}l(y)&&(I.removeAttribute("value"),I.hasAttribute("placeholder")&&t?.(y)&&I.setAttribute("placeholder",r)),"img"===v&&p.push(T(async function(e,t,a){let n=e.currentSrc||e.src;if(!n||n.startsWith("data:"))return n;await e.decode().catch(()=>{});let r=Math.min(e.naturalWidth,Math.ceil(e.offsetWidth*t)||e.naturalWidth),o=Math.round(r*e.naturalHeight/(e.naturalWidth||1));if(r&&o){let t=document.createElement("canvas");t.width=r,t.height=o;try{return t.getContext("2d").drawImage(e,0,0,r,o),t.toDataURL("image/png")}catch{}}return b(n,a)}(y,i,c).then(e=>I.setAttribute("src",e)))),w.add(L.fontFamily.split(",")[0].replace(/["']/g,"").trim().toLowerCase());let R=x(L,m.of(y),h);h||(R+=`${"inline"===L.display?"display:inline-block;":""}margin:0;position:relative;inset:auto;float:none;transform:none;translate:none;rotate:none;scale:none;flex:none;box-sizing:border-box;width:${d}px;height:${u}px;max-width:none;max-height:none;min-width:0;min-height:0;`);let P=a(y)&&!!h;P&&(R+="color:transparent;background:#e5e5e5;background-image:none;"),$.push([I,A(R)]);for(let e of["::before","::after"]){let t=c.getComputedStyle(y,e);P||/^(?:none|normal)$/.test(t.content)||(I.setAttribute("data-snapshot",String(C)),M+=`[data-snapshot="${C}"]${e}{${A(x(t,m.of(y),L))}content:${t.content};}`)}if(P)return I;if(t?.(y))return l(y)||(I.textContent=r),I;if("textarea"===v)return I;for(let e of y.childNodes){if("picture"===v&&"img"!==e.localName)continue;let t=E(e,L);t&&I.append(t)}return I};try{await(s.fonts?.ready);let t=E(e),a=new Map(await Promise.all([...y].map(async([e,t])=>[e,await t]))),n=e=>e.replace(v,(e,t,n)=>a.has(n)?`url("${a.get(n)}")`:e);for(let[e,t]of $)e.setAttribute("style",n(t));M=n(M),await Promise.all(p);let r=s.createElement("div");r.setAttribute("style",`width:${d+32}px;height:${u+32}px;padding:16px;box-sizing:border-box;overflow:hidden;background:${function(e,t){for(let a=e.parentElement;a;a=a.parentElement){let e=t.getComputedStyle(a).backgroundColor;if(e&&!/^(?:transparent|rgba\(.*,\s*0\))$/.test(e))return e}return"#fff"}(e,c)}`);let o=s.createElement("style");o.textContent=await async function(e,t,a){let n=[],r=2e6,o=async(e,i)=>{for(let l of e){if(l.cssRules&&await o(l.cssRules,i),!l.cssText.startsWith("@font-face"))continue;let e=l.style,s=e.getPropertyValue("font-family").replace(/["']/g,"").trim().toLowerCase(),c=e.getPropertyValue("src").match(/url\((['"]?)(.*?)\1\)/)?.[2];if(!t.has(s)||!c||r<=0)continue;let h=await b(new URL(c,i).href,a).catch(()=>"");h&&(r-=h.length,n.push(`@font-face{font-family:"${s}";src:url("${h}");${["font-weight","font-style","font-stretch","unicode-range"].map(t=>e.getPropertyValue(t)?`${t}:${e.getPropertyValue(t)};`:"").join("")}}`))}};for(let t of e.styleSheets){let a;try{a=t.cssRules}catch{continue}await o(a,t.href??e.baseURI)}return n.join("")}(s,w,c)+M,r.append(o,t);let i={width:d+32,height:u+32},l=`<svg xmlns="http://www.w3.org/2000/svg" width="${i.width}" height="${i.height}"><foreignObject x="0" y="0" width="100%" height="100%">${(new XMLSerializer).serializeToString(r)}</foreignObject></svg>`,h=new Image;return h.src=`data:image/svg+xml;charset=utf-8,${encodeURIComponent(l)}`,await h.decode(),{image:h,...i}}finally{m.dispose()}}var M=(e,t)=>new Promise((a,n)=>{try{e.toBlob(a,"image/webp",t)}catch(e){n(e)}});async function C(e,t={}){let a=t.maxBytes??w,n=e.ownerDocument.defaultView??window,r=e.offsetWidth||e.getBoundingClientRect().width,o=Math.min(n.devicePixelRatio||1,2,1200/(r+32)),i=await $(e,t.redact,o),l=document.createElement("canvas"),s=.8;for(let e=0;e<12&&i.width*o>=48;e++){l.width=Math.max(1,Math.round(i.width*o)),l.height=Math.max(1,Math.round(i.height*o));let e,t=l.getContext("2d");if(!t)throw new g("unsupported");t.drawImage(i.image,0,0,l.width,l.height);try{e=await M(l,s)}catch{throw new g("cross-origin")}if(!e||"image/webp"!==e.type)throw new g("unsupported");if(e.size<=a)return y(e);s>.5?s=Math.round(100*(s-.15))/100:o*=Math.min(.85,Math.max(.3,.95*Math.sqrt(a/e.size)))}throw new g("too-large")}var T={"cross-origin":"the element shows images from another origin","too-large":"the element is too large to draw",unsupported:"this browser can't encode WebP",failed:"it couldn't be drawn"},A=e=>`\x3c!-- palette: no image snapshot, ${T[e]}. --\x3e`;async function E(e,t,a=s){if(!e?.isConnected||m(e))return null;let n={},r=()=>p(e,t.redact,a-120);if(t.html&&(n.html=r()),t.image){await new Promise(e=>"function"==typeof requestIdleCallback?requestIdleCallback(e,{timeout:500}):setTimeout(e));try{n.image=await C(e,t)}catch(e){n.note=e instanceof g?e.reason:"failed","cross-origin"===n.note&&(n.html??=r()),n.html&&(n.html=A(n.note)+n.html)}}return n.image||n.html?n:null}var I=e=>{let[t,a]=e.split(","),n=atob(a),r=new Uint8Array(n.length);for(let e=0;e<n.length;e++)r[e]=n.charCodeAt(e);return new Blob([r],{type:t.slice(5,t.indexOf(";"))})},L=new WeakMap;function R(e,t,a,n,r){let o=L.get(e);if(!o){let r={...a,maxBytes:Math.min(a.maxBytes??w,n.maxImageBytes||1/0)};o=a.image||a.html?E(t(e),r,Math.min(s,n.maxHtmlBytes||1/0)).catch(()=>null):Promise.resolve(null),L.set(e,o)}return r&&o.then(async e=>{for(let t of["image","html"])e?.[t]&&await r(t,"image"===t?I(e.image):new Blob([e.html],{type:"text/html;charset=utf-8"})).catch(e=>console.info(`Palette: the comment posted without its ${t} snapshot.`,e instanceof Error?e.message:e))}),o}export{c as ATTRIBUTE_LIMIT,s as HTML_LIMIT,w as IMAGE_BYTES,e as OPT_OUT,r as PLACEHOLDER,h as TEXT_LIMIT,E as captureSnapshot,A as noteComment,m as skipped,R as snapshotFor,p as snapshotHtml,C as snapshotImage};

package/dist/snapshot.d.ts

@@ -9,7 +9,7 @@ export interface CapturedSnapshot {
     note?: SnapshotNote;
 }
 /** Hosts mark private regions with this attribute: a target inside one is never captured. */
-export declare const OPT_OUT = "data-komo-no-snapshot";
+export declare const OPT_OUT = "data-palette-no-snapshot";
 export declare const PLACEHOLDER = "[redacted]";
 export declare const HTML_LIMIT = 20000;
 export declare const ATTRIBUTE_LIMIT = 200;

package/dist/source-info.d.ts

@@ -1,7 +1,7 @@
 /** The app's link for a repository-relative source path, e.g. its `sourceUrl`. */
 export type SourceHref = (path: string, line?: number) => string | undefined;
 /** One ⓘ for every place a source path appears: Properties headings and change cards. */
-export declare const sourceInfoStyles = ".komo-source{position:relative;flex:none;display:flex}.komo-source>button{width:24px;height:24px;padding:0;border:0;border-radius:6px;background:none;color:#898680;cursor:pointer}.komo-source>button::before{content:\"i\";display:inline-grid;place-items:center;width:12px;height:12px;border:1.2px solid;border-radius:50%;font:italic 600 9px/1 Georgia,serif}.komo-source>button:is(:hover,[aria-expanded=true]){background:#ffffff12;color:#f1efeb}.komo-source>span{position:absolute;z-index:12;top:calc(100% + 4px);right:0;width:max-content;padding:10px;border-radius:10px;background:#191819;box-shadow:0 0 0 1px #ffffff1a,0 12px 40px #0008;color:#e9e6e1;font:11px/1.45 ui-monospace,Menlo,monospace;overflow-wrap:anywhere}.komo-source span button{margin:8px 6px 0 0;padding:4px 10px;border:0;border-radius:6px;background:#ffffff12;color:#f1efeb;font:12px system-ui,sans-serif;cursor:pointer}@media (max-width:520px){.komo-source>button{width:32px;height:32px}.komo-source span button{padding:9px 12px}}";
+export declare const sourceInfoStyles = ".palette-source{position:relative;flex:none;display:flex}.palette-source>button{width:24px;height:24px;padding:0;border:0;border-radius:6px;background:none;color:#898680;cursor:pointer}.palette-source>button::before{content:\"i\";display:inline-grid;place-items:center;width:12px;height:12px;border:1.2px solid;border-radius:50%;font:italic 600 9px/1 Georgia,serif}.palette-source>button:is(:hover,[aria-expanded=true]){background:#ffffff12;color:#f1efeb}.palette-source>span{position:absolute;z-index:12;top:calc(100% + 4px);right:0;width:max-content;padding:10px;border-radius:10px;background:#191819;box-shadow:0 0 0 1px #ffffff1a,0 12px 40px #0008;color:#e9e6e1;font:11px/1.45 ui-monospace,Menlo,monospace;overflow-wrap:anywhere}.palette-source span button{margin:8px 6px 0 0;padding:4px 10px;border:0;border-radius:6px;background:#ffffff12;color:#f1efeb;font:12px system-ui,sans-serif;cursor:pointer}@media (max-width:520px){.palette-source>button{width:32px;height:32px}.palette-source span button{padding:9px 12px}}";
 /**
  * An ⓘ button whose popover holds the full source path with Copy and, when the
  * app's sourceUrl gives an editor or repository link for a repository-relative

package/dist/storage-keys.d.ts

@@ -0,0 +1,5 @@
+/** The name a "palette:" key had before the rename, if Palette wrote it then. */
+export declare const legacyKey: (key: string) => string | undefined;
+export declare function migrateStorage(): void;
+/** Removes a key under its name and its older one, so the old value can't come back at the next mount. */
+export declare function forget(store: Storage, key: string): void;

package/dist/tag-editor-B3I7WD4N.js

@@ -0,0 +1 @@
+var e,t=12,n=/^[\p{L}\p{N}][\p{L}\p{N} ._-]{0,31}$/u,a='\n.tag-row { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; min-width: 0; min-height: 24px; font-size: 12px; }\n.tag-row .tag-chip {\n  display: inline-flex; align-items: center; gap: 2px; max-width: 160px; height: 22px; padding: 0 2px 0 7px;\n  border-radius: 6px; font-weight: 500; line-height: 1; color: var(--accent, #bda6ef);\n  background: color-mix(in srgb, var(--accent, #bda6ef) 14%, transparent);\n}\n.tag-row .tag-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.tag-row .tag-chip button, .tag-row .tag-add {\n  display: inline-flex; align-items: center; border: 0; padding: 0; color: inherit; background: none; cursor: pointer; font-family: inherit;\n}\n.tag-row .tag-chip button { justify-content: center; width: 18px; height: 18px; border-radius: 4px; opacity: .6; }\n.tag-row .tag-chip button:hover, .tag-row .tag-chip button:focus-visible { opacity: 1; background: color-mix(in srgb, currentColor 16%, transparent); }\n.tag-row .tag-add {\n  gap: 4px; height: 22px; padding: 0 6px; border-radius: 6px; font-size: 12px; color: #858585;\n  transition: color var(--duration-quick, 150ms), background var(--duration-quick, 150ms);\n}\n.tag-row .tag-add:hover, .tag-row .tag-add:focus-visible { color: #eee; background: #ffffff0d; }\n.tag-row .tag-input {\n  width: 96px; height: 24px; padding: 0 8px; border: 0; border-radius: 6px; outline: none;\n  font-family: inherit; font-size: 12px; color: #eee; background: #ffffff07; box-shadow: inset 0 0 0 1px #ffffff05;\n}\n.tag-row .tag-input::placeholder { color: #858585; }\n.tag-row .tag-input:focus { box-shadow: inset 0 0 0 1px #ffffff20; }\n.tag-row .tag-input[aria-invalid="true"] { box-shadow: inset 0 0 0 1px #f28b8299; }\n.tag-options {\n  position: fixed; z-index: 40; pointer-events: auto; display: grid; gap: 1px; width: 220px; max-height: 220px; overflow: auto;\n  padding: 4px; border-radius: 10px; background: #2a2a2a; box-shadow: 0 0 0 1px #ffffff14, 0 12px 32px #0007;\n  font-size: 12px;\n}\n.tag-options:empty { display: none; }\n.tag-option {\n  display: flex; align-items: center; gap: 6px; min-height: 28px; padding: 0 8px; border-radius: 6px;\n  color: #ddd; cursor: pointer; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;\n}\n.tag-option[aria-selected="true"] { background: #ffffff14; color: #fff; }\n.tag-option-hint, .tag-option-empty { color: #858585; }\n.tag-option-empty { padding: 6px 8px; }\n.tag-popover { position: fixed; z-index: 40; pointer-events: auto; width: 252px; box-sizing: border-box; padding: 8px; border-radius: 12px; background: #292929; color: #ddd; box-shadow: 0 0 0 1px #ffffff18, 0 12px 32px #0007; font-family: inherit; font-size: 12px; line-height: 1.4; overflow: auto; }\n.tag-popover .tag-input { box-sizing: border-box; width: 100%; height: 32px; padding: 0 9px; border: 1px solid #ffffff18; border-radius: 7px; outline: none; background: #ffffff07; color: #eee; font: inherit; }\n.tag-popover .tag-input:focus { border-color: #ffffff50; }\n.tag-popover .tag-input:focus-visible { outline: 2px solid var(--accent, #bda6ef); outline-offset: 1px; }\n.tag-popover .tag-input[aria-invalid=true] { border-color: #f28b82; }\n.tag-popover-choices { display: grid; gap: 2px; max-height: 200px; overflow: auto; margin-top: 6px; }\n.tag-popover-choice { display: flex; align-items: center; justify-content: flex-start; gap: 8px; min-height: 32px; width: 100%; box-sizing: border-box; border: 0; padding: 6px 8px; border-radius: 7px; background: none; color: #ddd; font: inherit; text-align: left; cursor: pointer; }\n.tag-popover-choice:hover,.tag-popover-choice:focus-visible { background: #ffffff0d; outline: 1px solid #ffffff40; outline-offset: -1px; }\n.tag-popover-choice[aria-pressed=true] { color: var(--accent, #bda6ef); }\n.tag-popover-choice:disabled { opacity: .4; cursor: default; }\n.tag-popover-check { width: 14px; flex: none; }\n.tag-popover-label { min-width: 0; overflow-wrap: anywhere; }\n.tag-popover-note { color: #aaa; padding: 8px; font-size: 11px; }\n.new-comment-composer .draft-body:has(.tag-slot) { grid-template-rows: minmax(28px, auto) minmax(28px, auto); }\n.new-comment-composer .draft-body .tag-slot { grid-row: 2; grid-column: 2; align-self: start; min-width: 0; padding-top: 2px; }\n.new-comment-composer .draft-body:has(.tag-slot) .send { align-self: start; }\n.new-comment-composer .draft-body:not(:has(.avatar)) .tag-slot { grid-column: 1; }\n';function o(e){let t=e.trim().replace(/^#/,"").toLocaleLowerCase("en-US");return n.test(t)?t:null}function r(t,n){if(n.trigger)return function(t,n,r){let i,l,d=[...n.tags],s=0,p=`palette-tag-popover-${Math.random().toString(36).slice(2)}`,c=(t=!1)=>{cancelAnimationFrame(s),l?.abort(),i?.remove(),i=void 0,r.setAttribute("aria-expanded","false"),e===g&&(e=void 0),t&&r.isConnected&&r.focus({preventScroll:!0})},g=()=>c(),u=()=>{let e=document.createElement("style");e.textContent=a;let n=document.createElement("div");n.className="tag-row",n.setAttribute("role","group"),n.setAttribute("aria-label","Tags");for(let e of d){let t=document.createElement("span");t.className="tag-chip",t.title=e,t.append(Object.assign(document.createElement("span"),{textContent:`#${e}`})),n.append(t)}t.replaceChildren(e,n),t.hidden=!d.length;let o=d.length?"Manage tags":"Add tag";r.title=o,r.setAttribute("aria-label",o)};r.setAttribute("aria-haspopup","dialog"),r.setAttribute("aria-controls",p),r.setAttribute("aria-expanded","false"),r.onclick=()=>{if(i)return c(!0);let a=t.getRootNode(),f=a instanceof ShadowRoot?a:document.body;e?.(),e=g,l=new AbortController;let m=l.signal;i=document.createElement("div"),i.className="tag-popover",i.id=p,i.setAttribute("role","dialog"),i.setAttribute("aria-label","Manage tags");let h=document.createElement("input");h.className="tag-input",h.type="search",h.placeholder="Search or create tag…",h.maxLength=33,h.autocomplete="off",h.setAttribute("aria-label","Search or create tag");let b=document.createElement("div");b.className="tag-popover-choices",b.setAttribute("role","group"),b.setAttribute("aria-label","Tag choices");let x=document.createElement("div");x.className="tag-popover-note",x.setAttribute("role","status"),i.append(h,b,x),f.append(i),r.setAttribute("aria-expanded","true");let v=(e,t=!1)=>{if(d.includes(e))d=d.filter(t=>t!==e),n.onRemove(e);else{if(!(d.length<12))return;d=[...d,e].sort(),n.onAdd(e)}t&&(h.value=""),u(),w(e),t&&h.focus({preventScroll:!0})},w=e=>{let t=h.value.trim().replace(/^#/,"").toLocaleLowerCase("en-US"),a=o(h.value),r=[...new Set([...d,...n.suggestions])],i=r.filter(e=>e.includes(t)).sort((e,n)=>Number(d.includes(n))-Number(d.includes(e))||Number(n.startsWith(t))-Number(e.startsWith(t))||e.localeCompare(n));b.replaceChildren();let l=(t,n)=>{let a=document.createElement("button");a.type="button",a.className="tag-popover-choice",a.dataset.tag=t,a.setAttribute("aria-pressed",String(d.includes(t))),a.disabled=!d.includes(t)&&d.length>=12,a.append(Object.assign(document.createElement("span"),{className:"tag-popover-check",textContent:d.includes(t)?"✓":n?"+":""}),Object.assign(document.createElement("span"),{className:"tag-popover-label",textContent:`${n?"Create ":""}#${t}`})),a.addEventListener("click",()=>v(t,n)),b.append(a),e===t&&a.focus({preventScroll:!0})};i.forEach(e=>l(e,!1)),a&&!r.includes(a)&&l(a,!0),x.textContent=d.length>=12?"Maximum 12 tags. Remove one to add another.":b.children.length?`${d.length} of 12 tags selected`:t?"Use letters, numbers, spaces, . _ or -":"Type to create a tag"};h.addEventListener("input",()=>{h.removeAttribute("aria-invalid"),w()}),i.addEventListener("keydown",e=>{if(e.stopPropagation(),e.isComposing)return;let t=[...b.querySelectorAll("button:not(:disabled)")],n=a instanceof ShadowRoot?a.activeElement:document.activeElement;if("Escape"===e.key)e.preventDefault(),c(!0);else if("ArrowDown"===e.key||"ArrowUp"===e.key){e.preventDefault();let a=t.indexOf(n);("ArrowDown"===e.key?t[a+1]??h:a>0?t[a-1]:h)?.focus({preventScroll:!0})}else if("Enter"===e.key&&e.target===h){e.preventDefault();let t=o(h.value);t&&!d.includes(t)?v(t,!0):h.value.trim()&&!t&&h.setAttribute("aria-invalid","true")}});let y=e=>{let t=e.composedPath();!t.includes(i)&&!t.includes(r)&&c()};document.addEventListener("pointerdown",y,{capture:!0,signal:m}),document.addEventListener("focusin",y,{signal:m}),document.addEventListener("keydown",e=>{"Escape"===e.key&&(e.preventDefault(),e.stopPropagation(),c(!0))},{capture:!0,signal:m});let A=()=>{if(!r.isConnected||!t.isConnected)return c();let e=r.getBoundingClientRect();if(e.bottom<0||e.top>innerHeight)return c();let n=r.closest(".dialog")?.getBoundingClientRect(),a=Math.max(8,(n?.left??0)+8),o=Math.min(innerWidth-8,(n?.right??innerWidth)-8),l=Math.max(0,Math.min(252,o-a));i.style.width=`${l}px`,i.style.maxHeight=`${Math.max(80,innerHeight-16)}px`;let d=i.offsetHeight,p=innerHeight-e.bottom-8,g=d+6<=p||e.top<p?e.bottom+6:e.top-d-6;i.style.left=`${Math.max(a,Math.min(e.right-l,o-l))}px`,i.style.top=`${Math.max(8,Math.min(g,innerHeight-d-8))}px`,s=requestAnimationFrame(A)};w(),A(),h.focus({preventScroll:!0})},u()}(t,n,n.trigger);let r=[...n.tags],i=!1,l=!1,d=(...e)=>{l=!0,t.replaceChildren(...e),l=!1},s=`palette-tags-${Math.random().toString(36).slice(2)}`,p=null,c=0,g=()=>{cancelAnimationFrame(c),p?.remove(),p=null};!function e(u=!1){if(g(),t.hidden=!!n.trigger&&!r.length&&!i,n.trigger){let e=r.length?"Manage tags":"Add tag";n.trigger.title=e,n.trigger.setAttribute("aria-label",e),n.trigger.setAttribute("aria-expanded",String(i))}let f=document.createElement("style");f.textContent=a;let m=document.createElement("div");m.className="tag-row",m.setAttribute("role","group"),m.setAttribute("aria-label","Tags");for(let a of r){let o=document.createElement("span");o.className="tag-chip";let l=document.createElement("span");l.textContent=`#${a}`;let d=document.createElement("button");d.type="button",d.textContent="×",d.setAttribute("aria-label",`Remove tag ${a}`),d.addEventListener("pointerdown",e=>e.preventDefault()),d.addEventListener("click",()=>{let o=t.getRootNode()instanceof ShadowRoot?t.getRootNode().activeElement===d:document.activeElement===d,l=r.indexOf(a);r=r.filter(e=>e!==a),n.onRemove(a),e(i),o&&!i&&(t.querySelectorAll(".tag-chip button")[Math.min(l,r.length-1)]??n.trigger??t.querySelector(".tag-add"))?.focus()}),o.append(l,d),m.append(o)}if(i){let a=document.createElement("input");a.className="tag-input",a.placeholder="Add tag…",a.maxLength=33,a.autocomplete="off",a.setAttribute("role","combobox"),a.setAttribute("aria-label","Add tag"),a.setAttribute("aria-autocomplete","list"),a.setAttribute("aria-controls",s);let h=document.createElement("div");h.className="tag-options",h.id=s,h.setAttribute("role","listbox"),h.setAttribute("aria-label","Tags");let b=[],x=-1,v=t=>{!r.includes(t)&&r.length<12&&(r=[...r,t].sort(),n.onAdd(t)),i=r.length<12,e(i),i||n.trigger?.focus({preventScroll:!0})},w=e=>{x=e,h.querySelectorAll("[role=option]").forEach((t,n)=>{t.setAttribute("aria-selected",String(n===e)),n===e&&t.scrollIntoView?.({block:"nearest"})}),e>=0?a.setAttribute("aria-activedescendant",`${s}-${e}`):a.removeAttribute("aria-activedescendant")},y=()=>{let e=a.value.trim().replace(/^#/,"").toLocaleLowerCase("en-US"),t=o(a.value),i=n.suggestions.filter(e=>!r.includes(e));b=(e?[...i.filter(t=>t.startsWith(e)),...i.filter(t=>!t.startsWith(e)&&t.includes(e))]:i).map(e=>({tag:e,create:!1})),t&&!r.includes(t)&&!i.includes(t)&&b.push({tag:t,create:!0}),h.replaceChildren(...b.map(({tag:e,create:t},n)=>{let a=document.createElement("div");return a.id=`${s}-${n}`,a.className="tag-option",a.setAttribute("role","option"),t&&a.append(Object.assign(document.createElement("span"),{className:"tag-option-hint",textContent:"Create"})),a.append(Object.assign(document.createElement("span"),{textContent:`#${e}`})),a.addEventListener("click",()=>v(e)),a.addEventListener("pointermove",()=>w(n)),a})),b.length||h.append(Object.assign(document.createElement("div"),{className:"tag-option-empty",textContent:e?r.includes(t??"")?"Already added":"Use letters, numbers, spaces, . _ or -":"Type to create a tag"})),a.setAttribute("aria-expanded",String(b.length>0)),w(e&&b.length?0:-1)};a.addEventListener("input",y),a.addEventListener("keydown",t=>{if(t.stopPropagation(),!t.isComposing)if("ArrowDown"===t.key||"ArrowUp"===t.key){if(t.preventDefault(),!b.length)return;let e=b.length-1;w("ArrowDown"===t.key?x>=e?0:x+1:x<=0?e:x-1)}else if("Enter"===t.key||","===t.key)if(t.preventDefault(),x>=0&&b[x])v(b[x].tag);else if(a.value.trim()){let e=o(a.value);e?v(e):a.setAttribute("aria-invalid","true")}else i=!1,e(),n.trigger?.focus({preventScroll:!0});else if("Escape"===t.key)t.preventDefault(),i=!1,e(),n.trigger?.focus({preventScroll:!0});else if("Backspace"===t.key&&!a.value&&r.length){let t=r.at(-1);r=r.slice(0,-1),n.onRemove(t),e(!0)}}),a.addEventListener("input",()=>a.removeAttribute("aria-invalid"));let A=!1;h.addEventListener("pointerdown",e=>{e.preventDefault(),A=!0}),a.addEventListener("blur",()=>{if(A)return A=!1,void requestAnimationFrame(()=>a.isConnected&&a.focus({preventScroll:!0}));l||!a.isConnected||!i||(i=!1,e())}),m.append(a),d(f,m);let E=t.getRootNode();(E instanceof ShadowRoot?E:document.body).append(h),p=h;let k=()=>{if(!a.isConnected)return g();let e=a.getBoundingClientRect(),t=h.offsetHeight,n=window.innerHeight-e.bottom-8,o=t+4<=n||e.top-8<n?e.bottom+4:e.top-4-t;h.style.top=`${Math.max(8,o)}px`,h.style.left=`${Math.max(8,Math.min(e.left,window.innerWidth-h.offsetWidth-8))}px`,c=requestAnimationFrame(k)};return y(),k(),void((u||i)&&a.focus({preventScroll:!0}))}if(!n.trigger&&r.length<12){let t=document.createElement("button");t.type="button",t.className="tag-add",t.textContent=r.length?"+":"+ Add tag",t.setAttribute("aria-label","Add tag"),t.addEventListener("click",()=>{i=!0,e(!0)}),m.append(t)}d(f,m)}()}export{t as MAX_TAGS,o as normalizeTag,r as tagEditor};

package/dist/thread-snapshot-ML2RZVID.js

@@ -0,0 +1 @@
+import{E as e,G as t}from"./chunk-4HBBEVFK.js";var n=new WeakMap;function a(t){let a=n.get(t);a?.isConnected||(a=e("style","",'.palette-snapshot{display:block;width:fit-content;margin-top:8px;padding:0;border:0;border-radius:6px;background:none;color:inherit;font:inherit;cursor:zoom-in;line-height:0}\n.palette-snapshot img{display:block;width:72px;height:48px;border-radius:6px;object-fit:cover;object-position:left top;background:color-mix(in oklab,currentColor 8%,transparent);outline:1px solid color-mix(in oklab,currentColor 16%,transparent);outline-offset:-1px}\n.palette-snapshot:not([data-ready]){background:color-mix(in oklab,currentColor 8%,transparent)}\n.palette-snapshot:not([data-ready]) img{visibility:hidden}\n.palette-snapshot[hidden]{display:none}\n.palette-snapshot:focus-visible{outline:2px solid var(--accent,#bda6ef);outline-offset:2px}\n.palette-snapshot[data-large]{width:auto;max-width:100%}\n.palette-snapshot[data-large] img{width:auto;height:auto;min-width:72px;min-height:48px;max-width:100%;max-height:180px;object-fit:contain}\n.thread-item>.palette-snapshot{margin:6px 12px 0 calc(12px + var(--palette-avatar,20px) + var(--palette-gutter,8px))}\n.dialog:has(.thread-navigation:not([hidden]) .palette-snapshot-view) .message .palette-snapshot{display:none}\n.palette-snapshot-view{margin-top:8px}\n.palette-snapshot-view p{margin:0 0 6px}\n.palette-snapshot-code{box-sizing:border-box;max-height:160px;margin:0;padding:8px;overflow:auto;border-radius:6px;background:color-mix(in oklab,currentColor 8%,transparent);font:11px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;overflow-wrap:anywhere;scrollbar-width:thin}\n.palette-snapshot-code:focus-visible{outline:2px solid var(--accent,#bda6ef);outline-offset:2px}\n.palette-snapshot-text{justify-self:start;margin-top:8px;padding:4px 8px;border:0;border-radius:6px;background:color-mix(in oklab,currentColor 8%,transparent);color:inherit;font-family:inherit;font-size:11px;line-height:1.4;cursor:pointer}\n.palette-snapshot-draft{display:flex;align-items:center;gap:8px;margin-top:8px;font-size:12px;color:#999}\n.palette-snapshot-draft .palette-snapshot{margin:0}\n.palette-snapshot-draft span{flex:1;min-width:0}\n.palette-snapshot-draft .icon{width:28px;height:28px}\n.palette-snapshot-viewer{box-sizing:border-box;max-width:min(1200px,calc(100vw - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:12px;overflow:hidden;border:0;border-radius:16px;background:#242424;color:#eee;box-shadow:inset 0 0 0 1px #ffffff1f,0 24px 64px -16px rgb(0 0 0/55%);font:12px/1.4 -apple-system,BlinkMacSystemFont,"Inter","Segoe UI",sans-serif;pointer-events:auto;color-scheme:dark}\n.palette-snapshot-viewer[open]{display:flex;flex-direction:column;gap:8px;animation:palette-snapshot-in var(--duration-fast,250ms) var(--ease-smooth-out,cubic-bezier(.22,1,.36,1))}\n.palette-snapshot-viewer::backdrop{background:rgb(0 0 0/40%);pointer-events:auto}\n.palette-snapshot-viewer header{display:flex;align-items:center;gap:8px}\n.palette-snapshot-viewer h2{flex:1;margin:0;padding-left:4px;font-size:13px;font-weight:600}\n.palette-snapshot-viewer .icon{width:28px;height:28px;border-radius:8px;color:#bbb}\n.palette-snapshot-viewer .icon:hover{background:#ffffff14;color:#eee}\n.palette-snapshot-viewer .icon:focus-visible{outline:2px solid var(--accent,#bda6ef);outline-offset:-2px}\n.palette-snapshot-viewer img{display:block;min-height:0;max-width:100%;max-height:calc(100dvh - 104px);margin:auto;border-radius:8px;object-fit:contain}\n.palette-snapshot-viewer .palette-snapshot-code{max-height:calc(100dvh - 104px);width:min(720px,calc(100vw - 56px))}\n@keyframes palette-snapshot-in{from{opacity:0;scale:.98;translate:0 4px}}\n@media (prefers-reduced-motion:reduce){.palette-snapshot-viewer[open]{animation:none}}\n@media (pointer:coarse){.palette-snapshot-viewer .icon,.palette-snapshot-draft .icon{width:44px;height:44px}}'),n.set(t,a),t.append(a))}var o=20,r=[],i=0,s=[],p=0;function l(){let e=performance.now();for(;s.length&&e-s[0]>=6e4;)s.shift();for(;r.length&&i<2&&s.length<20;)i++,s.push(e),r.shift()();r.length&&!p&&s.length>=20&&(p=window.setTimeout(()=>(p=0,l()),6e4-(e-s[0])))}var d=new Map;function c(e,t){let n,a=t.token();try{n=new URL(e)}catch{return Promise.resolve(null)}if(!a||n.origin!==t.origin())return Promise.resolve(null);let o=`${a} ${e}`,s=d.get(o);if(s)return s;s=new Promise(e=>{r.push(()=>e(()=>(i--,l()))),l()}).then(async e=>{try{let e=await fetch(n,{headers:{Authorization:`Bearer ${a}`},credentials:"omit",signal:AbortSignal.timeout(15e3)});if(404===e.status)return null;if(!e.ok)throw new Error(String(e.status));return await e.blob()}finally{e()}}),d.set(o,s),s.catch(()=>d.get(o)===s&&d.delete(o));for(let e of d.keys())d.size>40&&d.delete(e);return s}var h,f=new WeakMap,u=new Map,m=new WeakSet,g="img[data-palette-snapshot]";function x(e){let t=f.get(e);!t||u.has(e)||!e.isConnected||c(t.url,t.context).then(n=>{if(!e.isConnected||u.has(e))return;if(!n)return t.done?.(!1);let a=URL.createObjectURL(n);u.set(e,a),e.src=a,t.done?.(!0)},()=>t.done?.(!1))}function b(e){h?h.observe(e):x(e)}function v(e){m.has(e)||(m.add(e),"function"==typeof IntersectionObserver&&(h??=new IntersectionObserver(e=>{for(let t of e)t.isIntersecting&&x(t.target)})),new MutationObserver(e=>{for(let t of e){for(let e of t.removedNodes)if(e instanceof Element)for(let t of e.matches(g)?[e]:e.querySelectorAll(g))t.isConnected||h?.unobserve(t);for(let e of t.addedNodes)if(e instanceof Element&&e.isConnected)for(let t of e.matches(g)?[e]:e.querySelectorAll(g))b(t)}!function(){for(let[e,t]of u)e.isConnected||(URL.revokeObjectURL(t),u.delete(e),e.removeAttribute("src"))}()}).observe(e,{childList:!0,subtree:!0}))}function w(e){for(let t of[...C.get(e)??[]])t();for(let[t,n]of u)t.getRootNode()===e&&(URL.revokeObjectURL(n),u.delete(t),t.removeAttribute("src"),h?.unobserve(t))}function y(e){let{context:t,text:n}=e.anchor,a=(t?.label||n||"").replace(/\s+/g," ").trim();return`Snapshot of ${a?`“${a.length>60?`${a.slice(0,59)}…`:a}”`:t?.tag?`the ${t.tag} element`:"the commented element"} when the comment was left`}var k=/^<!-- (?:palette|komo): (no image snapshot, [^>]*?)\.? -->\s*/;function L(e){let t=k.exec(e);return t?{note:`${t[1][0].toUpperCase()}${t[1].slice(1)}.`,code:e.slice(t[0].length)}:{note:"",code:e}}function S(t){let n=e("pre","palette-snapshot-code");return n.textContent=t,n.tabIndex=0,n.setAttribute("role","region"),n.setAttribute("aria-label","HTML snapshot"),n}var C=new Map;async function R(n,o,r){a(n);let i=n.activeElement,s=e("dialog","palette-snapshot-viewer");s.setAttribute("aria-modal","true"),s.setAttribute("aria-label",o.alt);let p=e("header"),l=t("Close snapshot",()=>h(),"icon","close");if(l.removeAttribute("title"),p.append(e("h2","",o.src?"Snapshot":"HTML snapshot"),l),s.append(p),o.src){let t=e("img");t.alt=o.alt,t.src=o.src,s.append(t),await t.decode().catch(()=>{})}else{let{note:t,code:n}=L(o.html??"");t&&s.append(e("p","",t)),s.append(S(n))}if(!n.host.isConnected)return r?.();let d=new AbortController,{signal:c}=d,h=()=>{c.aborted||(d.abort(),C.get(n)?.delete(h),s.close(),s.remove(),r?.(),i?.isConnected&&i.focus({preventScroll:!0}))};s.addEventListener("close",h,{signal:c}),C.set(n,(C.get(n)??new Set).add(h)),window.addEventListener("keydown",e=>{e.stopImmediatePropagation(),"Escape"===e.key&&(e.preventDefault(),h())},{capture:!0,signal:c});let f=!1,u=e=>{let t=s.getBoundingClientRect();return e.target===s&&(e.clientX<t.left||e.clientX>t.right||e.clientY<t.top||e.clientY>t.bottom)};return s.addEventListener("pointerdown",e=>f=u(e),{signal:c}),s.addEventListener("click",e=>f&&u(e)&&h(),{signal:c}),n.append(s),s.showModal(),l.focus(),s}function A(t,n,a,o=!1,r){let i=y(n),s=e("img");s.alt=i,s.dataset.paletteSnapshot="",s.decoding="async";let p=e("button","palette-snapshot");return p.type="button",p.setAttribute("aria-haspopup","dialog"),o&&(p.dataset.large=""),p.append(s),f.set(s,{url:t,context:a,done:e=>{e?p.dataset.ready="":p.dataset.ready||(r?r():p.hidden=!0)}}),p.addEventListener("click",()=>{c(t,a).then(e=>{if(!e)return;let t=URL.createObjectURL(e);R(a.root,{src:t,alt:i},()=>URL.revokeObjectURL(t))})}),p}function E(e,t,n){v(n),e.replaceWith(t);let a=t.querySelector(g);a?.isConnected&&b(a)}function M(n,o,r,i,s){let{image:p,html:l}=i.snapshot??{};if(a(o.root),3===r)return void s?.then(a=>{a&&(a.image||a.html)&&n.isConnected&&!o.dropped.has(i.anchor)&&E(n,function(n,a,o){let r=e("div","palette-snapshot-draft"),i=y({anchor:a});if(n.image){let t=e("button","palette-snapshot");t.type="button",t.dataset.ready="",t.setAttribute("aria-haspopup","dialog");let a=e("img");a.alt=i,a.src=n.image,t.append(a),t.addEventListener("click",()=>{R(o.root,{src:n.image,alt:i})}),r.append(t)}r.append(e("span","",n.image?n.html?"Snapshot and HTML attached":"Snapshot attached":"HTML snapshot attached"));let s=t("Remove snapshot",()=>{o.dropped.add(a),r.closest("form")?.querySelector("textarea")?.focus(),r.remove()},"icon","trash");return r.append(s),r}(a,i.anchor,o),o.root)});let d=r>1?(p||l)&&function(t,n){let{image:a,html:o}=t.snapshot,r=e("div","palette-snapshot-view"),i=()=>{if(!o)return r.remove();c(o,n).then(async t=>{if(!t)return r.remove();let{note:n,code:a}=L(await t.text());r.replaceChildren(e("p","",n||"How it looked, as HTML:"),S(a))},()=>r.remove())};return r.append(e("p","","How it looked:")),a?r.append(A(a,t,n,!0,i)):i(),r}(i,o):p?A(p,i,o):r&&l&&function(e,n,a){let o=t("HTML snapshot",()=>{c(e,a).then(async e=>{e&&R(a.root,{html:await e.text(),alt:y(n)})})},"palette-snapshot-text");return o.removeAttribute("title"),o.setAttribute("aria-haspopup","dialog"),o}(l,i,o);if(4===r){let t=e("div");t.append(function(t,n){let a=new URL(t.page,location.origin);a.searchParams.set("comment",t.id);let o=e("a","thread-route",t.page);o.href=a.href,o.addEventListener("click",e=>{e.preventDefault(),n.go(a)});let r=e("p","","Left on ");return r.append(o),r}(i,o),...d?[d]:[]),d=t}d&&E(n,d,o.root)}function U(e,t){t.notify("Remove this comment’s snapshot?",{label:"Remove",run:()=>{t.remove(e),t.notify("Snapshot removed")}})}export{o as READS_PER_MINUTE,U as confirmRemove,w as disposeSnapshots,M as mountSnapshot,R as openSnapshotViewer,c as readSnapshot,y as snapshotAlt,L as splitNote};

package/dist/token-custom-CASAQWYW.js

@@ -0,0 +1 @@
+import{a as e,b as t}from"./chunk-3BVM3I52.js";import{E as l}from"./chunk-4HBBEVFK.js";var i=/^([+-]?(?:\d*\.)?\d+)([a-z%]*)$/i;function o(e){return e.filter(e=>!e.hidden).map(e=>[...e.inset?["inset"]:[],...e.lengths,e.color].filter(Boolean).join(" ")).join(", ")||"none"}var a=/^\s*((?:(?:italic|oblique|normal|small-caps|bold|bolder|lighter|[1-9]00)\s+)*)([+-]?(?:\d*\.)?\d+[a-z%]*)(?:\s*\/\s*((?:\d*\.)?\d+[a-z%]*|normal))?(?:\s+([\s\S]+?))?\s*$/i;function n(e){let t=a.exec(e);if(!t)return;let l=t[1].trim().split(/\s+/).filter(Boolean);return{style:l.filter(e=>/^(italic|oblique|small-caps)$/i.test(e)).join(" "),weight:l.find(e=>/^(bold|bolder|lighter|[1-9]00)$/i.test(e))??"",size:t[2],lineHeight:t[3]??"",family:t[4]??""}}function p(e){return[e.style,e.weight,e.size+(e.lineHeight?`/${e.lineHeight}`:""),e.family].filter(Boolean).join(" ")}var r=["px","%","rem","em","vw","vh","ch","vmin","vmax","dvh"];function d(e,t,i,o){let a=l("button","palette-typed__icon");return a.type="button",a.innerHTML=t,a.title=e,a.setAttribute("aria-label",e),void 0!==o&&a.setAttribute("aria-pressed",String(o)),a.onclick=i,a}function s(e,t,o,a,n,{unitless:p=!1,optional:d=!1}={}){let s=l("div","palette-typed__field"),f=l("span");t?f.textContent=t:f.innerHTML='<svg viewBox="0 0 12 12" aria-hidden="true"><path d="M1 6h10M3 4 1 6l2 2M9 4l2 2-2 2"/></svg>',f.title=`${e} · drag to adjust`;let u=l("input");u.setAttribute("aria-label",e),u.inputMode="decimal",u.autocomplete="off",u.spellcheck=!1;let c=l("select");c.setAttribute("aria-label",`${e} unit`);let h=i.exec(o)??["","",""];u.value=h[1];let y=h[2]||(p||!h[1]&&d?"":"px");for(let e of new Set([y,...r,...p?[""]:[]])){let t=l("option","",e||"—");t.value=e,e||(t.title="No unit"),c.append(t)}c.value=y;let g=!1,_=e=>{let t=d&&!u.value.trim(),l=t||i.test(u.value.trim()+c.value);l?n.delete(u):n.add(u);let o=l&&a(t?"":u.value.trim()+c.value,e);return u.setAttribute("aria-invalid",String(!l)),e&&(g=!1),o},m=(e,t)=>{let l=i.exec(function(e,t){let l=i.exec(e.trim());if(!l)return e;let o=!l[2]||/^r?em$/i.test(l[2]);return`${Math.round(1e3*(parseFloat(l[1])+t*(o?.1:1)))/1e3}${l[2]}`}(u.value.trim()+c.value,e));l&&(u.value=l[1],_(t))};return u.oninput=()=>{g=!0,_(!1)},u.onkeydown=e=>{"Enter"===e.key?(e.preventDefault(),e.stopPropagation(),_(!0)):("ArrowUp"===e.key||"ArrowDown"===e.key)&&(e.preventDefault(),m(("ArrowUp"===e.key?1:-1)*(e.shiftKey?10:1),!0))},u.onblur=()=>{g&&_(!0)},c.onchange=()=>_(!0),f.onpointerdown=e=>{if(e.button)return;e.preventDefault(),f.setPointerCapture?.(e.pointerId);let t=e.clientX,l=!1;f.onpointermove=e=>{let i=Math.trunc((e.clientX-t)/2);i&&(t+=2*i,l=!0,m(i*(e.shiftKey?10:1),!1))},f.onpointerup=f.onpointercancel=()=>{f.onpointermove=f.onpointerup=f.onpointercancel=null,l?_(!0):u.focus()}},s.append(f,u,c),s}function f(a,r,f,u,c,h,y=[],g=()=>{}){let _=l("div","palette-typed"),m=l("details","palette-typed palette-typed__advanced"),x=l("summary","","Edit as CSS");x.onclick=e=>{e.preventDefault(),e.stopPropagation(),m.open=!m.open};let v=l("div","palette-typed__field");u.title=r,u.autocomplete="off",u.spellcheck=!1,v.append(l("span","","CSS"),u),m.append(x,v),a.append(_,m);let b=!1,w=new Set;u.oninput=()=>{b=!0,c(u.value,!1)&&S(u.value,!0)},u.onkeydown=e=>{"Enter"===e.key&&(e.preventDefault(),e.stopPropagation(),b=!1,c(u.value,!0))},u.onblur=()=>{b&&(b=!1,c(u.value,!0))};let k=(e,t,i,o,a,n)=>{let p=l("select","palette-typed__menu");p.setAttribute("aria-label",e);for(let[e,i]of t){let t=l("option","",i);t.value=e,t.title=e,n&&e&&(t.style[n]=e),p.append(t)}return p.value=i,p.onchange=()=>o(p.value),a&&p.addEventListener("palette-preview",e=>{let t=e.detail;g(null===t?void 0:a(t))}),p};function S(a,f=!1){if(f||(u.value=a),w.clear(),_.replaceChildren(),"font-family"===r){let e=l("div","palette-typed__sample"),i=l("b","","Aa"),o=l("span","",t(a));e.title=a,i.style.fontFamily=a,e.append(i,o),_.append(e);let n=y.filter(e=>"fontFamily"===e.type&&e.value&&CSS.supports(r,e.value));n.length?_.append(k("Font family choices",[[a,`Custom · ${t(a)}`],...n.map(e=>[e.value,e.label||t(e.value)])],a,e=>{c(e,!0)&&S(e)},e=>e,"fontFamily")):m.open=!0}else if(/^(box|text)-shadow$/.test(r)){let t=function(t,l="box-shadow"){if("none"===t)return[];let o=[];for(let a of e(t,!0)){let t=e(a),n=[],p="",r=!1,d=!1;for(let e of t)if("inset"!==e||"box-shadow"!==l||r)if(i.test(e)){if(d)return;n.push(e)}else{if(p||/var\(/i.test(e)||!CSS.supports("color",e))return;p=e,d=n.length>0}else r=!0;if(n.length<2||n.length>("box-shadow"===l?4:3))return;o.push({lengths:n,color:p,inset:r})}return o.length?o:void 0}(a,r);if(!t)return _.append(l("span","palette-typed__hint","Complex shadow · edit it as CSS below.")),void(m.open=!0);let n="box-shadow"===r,p=l("div","palette-typed__tile"),f=l("i","",n?"":"Ag");p.setAttribute("aria-hidden","true"),p.append(f);let u=e=>(f.style.setProperty(r,o(t)),c(o(t),e));f.style.setProperty(r,o(t));let h=l("div","palette-typed__head");h.append(l("b","","Layers"),d("Add shadow layer",'<svg viewBox="0 0 16 16" aria-hidden="true"><path d="M8 3.5v9M3.5 8h9"/></svg>',()=>{t.push({lengths:["0px","2px","4px","0px"].slice(0,n?4:3),color:"#00000040",inset:!1}),u(!0)&&S(o(t))})),_.append(p,h),t.forEach((e,i)=>{let a=`Layer ${i+1}`,p=l("div","palette-typed__layer");p.setAttribute("role","group"),p.setAttribute("aria-label",`Shadow layer ${i+1}`),p.toggleAttribute("data-hidden",!!e.hidden);let r=l("div","palette-typed__row");n&&r.append(k(`${a} type`,[["drop","Drop"],["inner","Inner"]],e.inset?"inner":"drop",t=>{e.inset="inner"===t,u(!0)}));let f=l("button","palette-typed__color");f.type="button",f.setAttribute("aria-label",`${a} color`),f.setAttribute("aria-expanded","false");let c=l("i"),h=l("span"),g=l("span","palette-typed__alpha");f.append(c,h,g);let m,x=()=>{let[t,l="100%"]=function(e){let t=document.createElement("i").style;t.color=e.trim(),t.color&&(e=t.color);let l=/^rgba?\(\s*([\d.]+)[\s,]+([\d.]+)[\s,]+([\d.]+)(?:\s*[,/]\s*([\d.]+)(%?))?\s*\)$/i.exec(e.trim());if(!l)return e||"currentColor";let i=`#${l.slice(1,4).map(e=>Math.round(Number(e)).toString(16).padStart(2,"0")).join("")}`,o=void 0===l[4]?1:Number(l[4])/(l[5]?100:1);return o<1?`${i} · ${Math.round(100*o)}%`:i}(e.color).split(" · ");c.style.setProperty("--c",e.color||"currentColor"),h.textContent=t.replace(/^#/,"").toUpperCase(),g.textContent=e.color?l:"",f.title=e.color||"currentColor"};x(),f.onclick=async()=>{if(m)return m.remove(),m=void 0,void f.setAttribute("aria-expanded","false");f.setAttribute("aria-expanded","true");let{pickerEditor:t}=await import("./color-editor-QPJQD36F.js");!f.isConnected||m||(m=t({trigger:f,tokens:y,property:"color",onSelect(){},custom:{value:e.color||"#000000",onPreview:()=>()=>{},onSelect(){}}},{preview(t){e.color=t,x(),u(!1)},commit(t){e.color=t,x(),u(!0)},token(t){e.color=t.value,x(),u(!0)}}),p.append(m))};let v=d(`${a} visible`,'<svg viewBox="0 0 16 16" aria-hidden="true"><path d="M1.5 8s2.4-4.5 6.5-4.5S14.5 8 14.5 8 12.1 12.5 8 12.5 1.5 8 1.5 8Z"/><circle cx="8" cy="8" r="2"/></svg>',()=>{e.hidden=!e.hidden,v.setAttribute("aria-pressed",String(!e.hidden)),p.toggleAttribute("data-hidden",!!e.hidden),u(!0)},!e.hidden);r.append(f,v,d(`Remove layer ${i+1}`,'<svg viewBox="0 0 16 16" aria-hidden="true"><path d="M3.5 8h9"/></svg>',()=>{t.splice(i,1),u(!0)&&S(o(t))}));let b=l("div","palette-typed__grid");[["X offset","X"],["Y offset","Y"],["Blur","Blur"],["Spread","Spread"]].slice(0,n?4:3).forEach(([t,l],i)=>b.append(s(`${a} ${t.toLowerCase()}`,l,e.lengths[i]||"0px",(t,l)=>{for(;e.lengths.length<=i;)e.lengths.push("0px");return e.lengths[i]=t,!w.size&&u(l)},w))),p.append(r,b),_.append(p)})}else if("font"===r){let e=n(a);if(!e)return _.append(l("span","palette-typed__hint","Custom expression · edit it as CSS below.")),void(m.open=!0);let i=l("div","palette-typed__sample"),o=l("b","","Aa"),r=l("span");i.setAttribute("aria-hidden","true"),i.append(o,r);let d=()=>{Object.assign(o.style,{fontStyle:e.style,fontWeight:e.weight,fontFamily:e.family}),r.textContent=[e.family?t(e.family):"Inherited family",e.weight,e.size+(e.lineHeight?`/${e.lineHeight}`:"")].filter(Boolean).join(" · ")},f=t=>(d(),c(p(e),t));d();let u=y.filter(t=>"fontFamily"===t.type&&t.value&&CSS.supports("font-family",t.value)&&t.value!==e.family),h=l("div","palette-typed__grid palette-typed__font");h.append(k("Font weight",[...new Set([e.weight||"400","100","200","300","400","500","600","700","800","900"])].map(e=>[e,e]),e.weight||"400",t=>{e.weight=t,f(!0)},t=>p({...e,weight:t}),"fontWeight"),s("Font size","Size",e.size,(t,l)=>(e.size=t,!w.size&&f(l)),w),s("Line height","LH",e.lineHeight,(t,l)=>(e.lineHeight=t,!w.size&&f(l)),w,{unitless:!0,optional:!0})),_.append(i,k("Font family",[[e.family,e.family?t(e.family):"Inherited family"],...u.map(e=>[e.value,e.label||t(e.value)])],e.family,t=>{e.family=t,f(!0)},t=>p({...e,family:t}),"fontFamily"),h)}else if(h?.values?.length)_.append(k(h.label,[...new Set([a,...h.values])].map(e=>[e,e]),a,e=>c(e,!0),e=>e));else{let t=e(a),o=/^(padding|margin|border-(width|radius)|gap)$/.test(r);if(t.length&&t.every(e=>i.test(e))&&(1===t.length||o&&t.length<=4)){let e=h?.label||r,i=1===t.length?[[e,""]]:"gap"===r?[["Row gap","Row"],["Column gap","Col"]]:"border-radius"===r?[["Top left","TL"],["Top right","TR"],["Bottom right","BR"],["Bottom left","BL"]]:[["Top","T"],["Right","R"],["Bottom","B"],["Left","L"]];if(t.length>1&&"gap"!==r){let[e,l=e,i=e,o=l]=t;t.splice(0,t.length,e,l,i,o)}let o=t.map((e,l)=>s(i[l][0],i[l][1],e,(e,i)=>(t[l]=e,!w.size&&c(t.join(" "),i)),w));if(o.length>1){let e=l("div","palette-typed__grid");e.append(...o),_.append(e)}else _.append(...o)}else _.append(l("span","palette-typed__hint","Custom expression · preserved exactly below.")),m.open=!0}}return S(f),S}function u(e,t){let{property:i}=e,o=e.custom.value,a=l("div","palette-custom"),p=l("div","palette-custom__body"),r=l("input");r.value=o,r.setAttribute("aria-label","CSS value");let d=!1,s=!1;a.append(l("style","",".palette-custom{display:flex;flex:1;flex-direction:column;min-height:0}.palette-custom__body{display:grid;gap:8px;padding:8px;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}.palette-typed{display:grid;gap:6px;min-width:0}.palette-typed__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.palette-typed__field,.palette-typed__color,.palette-typed__menu{display:flex;align-items:center;box-sizing:border-box;width:100%;min-width:0;height:28px;border-radius:6px;background:#ffffff0a;box-shadow:none;color:#f1efeb;font:inherit;font-size:11px}.palette-typed__field:hover,.palette-typed__color:hover,.palette-typed__menu:hover{box-shadow:inset 0 0 0 1px #ffffff1c}.palette-typed__field:focus-within,.palette-typed__color:focus-visible,.palette-typed__menu:focus-visible{outline:0;box-shadow:inset 0 0 0 1px #bda6ef}.palette-typed__field>span{flex:none;display:grid;place-items:center;min-width:24px;height:100%;padding:0 2px 0 6px;color:#77736f;font-size:10px;font-weight:500;cursor:ew-resize;user-select:none;touch-action:none}.palette-typed__field>span:hover{color:#e9e6e1}.palette-typed__field>span svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.1}.palette-typed__field input{flex:1;width:100%;min-width:0;height:100%;margin:0;padding:0 2px;border:0;border-radius:0;outline:0;box-shadow:none;background:none;color:inherit;font:inherit;font-variant-numeric:tabular-nums}.palette-typed__field input:focus,.palette-typed__field input:focus-visible,.palette-typed__field select:focus,.palette-typed__field select:focus-visible{outline:0;box-shadow:none}.palette-typed__field select{flex:none;width:auto;max-width:44px;height:100%;margin:0;padding:0 8px 0 2px;border:0;border-radius:0 6px 6px 0;box-shadow:none;appearance:none;background:none;color:#77736f;font:inherit;font-size:10px;text-align:right;cursor:pointer}.palette-typed__field select:hover{color:#f1efeb}.palette-typed__menu{padding:0 20px 0 8px;border:0;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 7px center/8px no-repeat;cursor:pointer}.palette-typed [aria-invalid=true]{color:#f8a898}.palette-typed__layer{display:grid;gap:6px}.palette-typed__layer[data-hidden] .palette-typed__grid{opacity:.45}.palette-typed__row{display:flex;align-items:center;gap:4px;min-width:0}.palette-typed__row>.palette-typed__menu{flex:none;width:64px}.palette-typed__row>.palette-typed__color{flex:1;gap:6px;padding:0 6px}.palette-typed__color .palette-typed__alpha{flex:none;margin-left:auto;color:#898680;font-size:10px}.palette-typed button.palette-typed__icon{display:grid;place-items:center;flex:none;width:24px;padding:0}.palette-typed__icon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.palette-typed__tile{display:grid;place-items:center;height:56px;border-radius:6px;background:repeating-conic-gradient(#ffffff0a 0 25%,#ffffff04 0 50%) 0 0/12px 12px}.palette-typed__tile i{display:grid;place-items:center;width:32px;height:32px;border-radius:6px;background:#f1efeb;color:#f1efeb;font-style:normal;font-size:20px;font-weight:600}.palette-typed__tile i:not(:empty){width:auto;height:auto;background:none}.palette-typed__layer+.palette-typed__layer{padding-top:8px;border-top:1px solid #ffffff0d}.palette-typed__head{display:flex;align-items:center;gap:2px;min-height:24px}.palette-typed__head b{flex:1;color:#b5b1ab;font-size:10px;font-weight:500}.palette-typed button:not(.palette-typed__color,.palette-color *){height:24px;padding:0 8px;border:0;border-radius:5px;background:none;color:#898680;font:inherit;font-size:10px;cursor:pointer}.palette-typed button:not(.palette-typed__color,.palette-color *):hover{background:#ffffff14;color:#f1efeb}.palette-typed button[aria-pressed=true]{background:#bda6ef24;color:#e6dcfb}.palette-typed button:focus-visible{outline:1px solid #bda6ef;outline-offset:-1px}.palette-typed__color{gap:8px;padding:0 8px;border:0;justify-content:flex-start;text-align:left;font-variant-numeric:tabular-nums;cursor:pointer}.palette-typed__color i{flex:none;width:14px;height:14px;border-radius:3px;box-shadow:inset 0 0 0 1px #ffffff26;background:linear-gradient(var(--c),var(--c)),repeating-conic-gradient(#ffffff40 0 25%,#ffffff12 0 50%) 0 0/8px 8px}.palette-typed__color span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.palette-typed .palette-color{padding:0}.palette-typed__sample{display:flex;align-items:center;gap:8px;min-width:0;height:36px;padding:0 8px;border-radius:6px;background:#ffffff08}.palette-typed__sample b{flex:none;font-size:20px;font-weight:400}.palette-typed__sample span{overflow:hidden;color:#b5b1ab;text-overflow:ellipsis;white-space:nowrap}.palette-typed__hint{color:#898680;font-size:10px;line-height:1.5}.palette-custom .palette-typed__advanced>summary{display:flex;align-items:center;height:auto;min-height:24px;color:#77736f;font-size:10px;font-weight:500;list-style:none;cursor:pointer}.palette-typed__advanced>summary::-webkit-details-marker{display:none}.palette-custom .palette-typed__advanced>summary:hover{color:#e9e6e1}.palette-typed__advanced>summary:focus-visible{outline:1px solid #bda6ef;outline-offset:-1px;border-radius:4px}@media (max-width:520px){.palette-typed__font{grid-template-columns:minmax(0,1fr)}}@media (pointer:coarse){.palette-typed__field,.palette-typed__color,.palette-typed__menu{height:36px}.palette-typed button:not(.palette-typed__color,.palette-color *){height:32px}}"),p);let u=f(p,i,o,r,(e,l)=>{if(s)return!1;d=!0;let o=!!e.trim()&&(CSS.supports(i,e)||"font"===i&&!!n(e))&&!/[{};]/.test(e);return r.setAttribute("aria-invalid",String(!o)),!!o&&(r!==r.getRootNode().activeElement&&(r.value=e),l?t.commit(e):t.preview(e),!0)},e.custom?.field,e.tokens,e=>{s||t.hover?.(e)});return Object.assign(a,{live:!0,destroy(){s=!0},refresh(e){if(d)return;let{selectionStart:t,selectionEnd:l}=r;u(e),null!==t&&null!==l&&r.setSelectionRange(t,l)}})}export{u as pickerEditor};

package/dist/token-page-NIB5HAVS.js

@@ -0,0 +1 @@
+import{e,t,z as n}from"./chunk-4HBBEVFK.js";var o=(e,t)=>`${t??""} ${e}`,i=e=>e.replace(/→/g,"->").replace(/\s+/g," ").trim()||"(unset)";function r(t){let n=[];for(let o of Array.isArray(t?.themes)?t.themes:[])if(Array.isArray(o?.options)&&!(o.options.length<2))try{n.push(String(o.current(e())))}catch{}return n.length?n.join("+"):void 0}function a(t,n={}){let i,r=()=>!!n.before?.(),a=new Map,s=[],l=[],d="",p=o=>{let r=o.map(({path:e,value:t,theme:n,alias:o})=>({path:e,value:t,...n?{theme:n}:{},...o?{alias:o}:{}})),a=n.theme?.(),s=r.length?JSON.stringify([a,r]):"";if(s===d)return;let l=i;i=void 0,d=s;try{l?.()}catch{}if(r.length&&t.previewValues)try{i=t.previewValues(r,a,e())}catch{}},c=()=>p(r()?[]:[...a.values()]),g=e=>[...a].filter(([t])=>t!==e).map(([,e])=>e);return{get size(){return a.size},get canUndo(){return s.length>0},get steps(){return s},list:()=>[...a.values()],get:(e,t)=>a.get(o(e,t)),set(e){let t=o(e.path,e.theme),n=a.get(t);return(n?.to??e.from)!==e.to&&(s.push({key:t,edit:n}),l.length=0,e.to===e.from?a.delete(t):a.set(t,e),c(),!0)},preview:e=>(p(r()?[]:[...g(o(e.path,e.theme)),...e.to===e.from?[]:[e]]),c),undo(){let e=s.pop();e&&(l.push({key:e.key,edit:a.get(e.key)}),e.edit?a.set(e.key,e.edit):a.delete(e.key),c())},redo(){let e=l.pop();e&&(s.push({key:e.key,edit:a.get(e.key)}),e.edit?a.set(e.key,e.edit):a.delete(e.key),c())},reset(e,t){let n=o(e,t);a.delete(n);for(let e=s.length;e--;)s[e].key===n&&s.splice(e,1);c()},resetAll(){a.clear(),s.length=0,c()},sync:c,stop(){a.clear(),s.length=0,p([])}}}function s(e,t){if(e.length)return["Proposed token changes (preview only)",...e.map(e=>`Token: ${e.path}${e.theme?` (${e.theme})`:""} ${i(e.from)} → ${i(e.to)}`),`Token adapter: ${t}`].join("\n")}function l(e){return e.map(({path:e,theme:t,from:n,to:o})=>({kind:"token-value",path:e,...t?{theme:t}:{},from:n,to:o}))}var d={color:"color",dimension:"width",fontFamily:"font-family",fontWeight:"font-weight",lineHeight:"line-height",letterSpacing:"letter-spacing",shadow:"box-shadow",typography:"font",duration:"transition-duration"},p=e=>e.properties?.[0]??d[e.type]??"--token",c=".design-inspector[data-tokens] .design-inspector__identity{visibility:visible}.design-inspector[data-tokens] .design-inspector__controls{display:flex;flex-direction:column;place-items:stretch;overflow:hidden}.design-inspector[data-tokens] .design-inspector__parent{display:none}.design-inspector[data-tokens]>.design-inspector__bar:not(.design-token-bar),.design-inspector[data-tokens] .design-inspector__pending,.design-inspector:not([data-tokens])>.design-token-bar{display:none}.design-token-page{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;height:min(520px,calc(100dvh - 190px))}:host([data-sidebar=background]) .design-token-page{height:auto}.design-token-page>.palette-tokens__bar{flex:none;padding:0 12px 8px;background:none;border:0}.design-token-page>p{margin:0 12px 8px;color:#e7c27d;font-size:11px}.design-token-page>p[hidden]{display:none}.design-token-page__list{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 8px 8px}.design-token-page__list small{position:sticky;top:0;z-index:1;display:block;padding:8px 8px 4px;background:#0d0d0d;color:#77736f;font-size:10px;font-weight:500}.design-token-page__list>p{margin:0;padding:12px 8px;color:#77736f}.design-token-row{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 24px;align-items:center;gap:2px;border-radius:7px}.design-token-row:hover{background:#ffffff0a}.design-token-row>button{border:0;background:none;color:inherit;font:inherit}.design-token-row>button:first-child{display:grid;grid-template-columns:20px minmax(0,1fr) auto;align-items:center;gap:8px;min-width:0;min-height:32px;padding:6px 8px;border-radius:7px;color:#d9d6d1;text-align:left}.design-token-row b{overflow:hidden;font-weight:500;text-overflow:ellipsis;white-space:nowrap}.design-token-row i{max-width:110px;overflow:hidden;color:#77736f;font-style:normal;font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap}.design-token-row[data-changed] b{color:#e6dcfb}.design-token-row[data-changed]::before{content:'';position:absolute;top:calc(50% - 2px);left:-2px;width:4px;height:4px;border-radius:50%;background:#bda6ef}.design-token-row>button+button{display:grid;place-items:center;width:24px;height:24px;padding:0;border-radius:5px;color:#77736f}.design-token-row>button+button:disabled{visibility:hidden}.design-token-row>button+button:hover{background:#ffffff14;color:#f1efeb}.design-token-row svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.design-token-row .palette-tokens{font-size:11px}@media (pointer:coarse){.design-token-row>button:first-child{min-height:44px}.design-token-row>button+button{width:32px;height:32px}}",g=e=>`<svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><path d="${e}"/></svg>`,u=g("M2.5 2.5v3h3M3 5.5a5.5 5.5 0 1 1-.5 2.5"),h=g("M5.5 3.5 2.5 6.5l3 3m-3-3h7a4 4 0 0 1 0 8h-2"),f=new WeakMap;async function b(o,i){let l=await Promise.all([import("./token-picker-AJ5E5IN5.js"),import("./react-props-panel-ZSKQ44GS.js"),import("./design-export-Y2GU3KER.js")]),d=f.get(o);d||f.set(o,d=function(o,i,[l,d,g]){let b=i.design?.tokens??d.cssVariableTokens(),m="function"==typeof b.previewValues,v=()=>o.hasAttribute("data-before"),y=a(b,{before:v,theme:()=>r(i.design)}),w=k("style");w.textContent=c,i.root.append(w),l.stylePicker(o);let x=k("section","design-token-page");x.setAttribute("aria-label","Tokens");let _=k("p","","No live preview · edits are recorded as proposals");_.hidden=m;let A=k("div","palette-tokens__bar"),C=k("input");C.type="search",C.placeholder="Search tokens",C.autocomplete="off",C.spellcheck=!1,C.setAttribute("aria-label","Search tokens"),A.append(C);let $=k("div","design-token-page__list");x.append(_,A,$);let L=(e,t)=>{let n=t.getBoundingClientRect(),i=o.getBoundingClientRect();i.left-16>e.offsetWidth?(e.style.left=i.left-8-e.offsetWidth/2+"px",e.style.top=`${n.top+(n.height-e.offsetHeight)/2}px`):i.top-16>e.offsetHeight&&(e.style.top=i.top-8-e.offsetHeight+"px")},E=k("div","design-inspector__bar design-token-bar"),S=k("span","design-inspector__count"),T=k("div","design-inspector__compare");T.setAttribute("role","group"),T.setAttribute("aria-label","Compare with the page");let M=["Before","After"].map((e,t)=>{let n=k("button","",e);return n.type="button",n.dataset.tip=`${e} · ${t?"→":"←"} or B`,n.addEventListener("click",()=>W(!t)),T.append(n),n}),z=k("p","design-inspector__status");z.setAttribute("role","status");let P=k("div","design-inspector__actions"),j=(e,t,n)=>{let o=k("button","design-inspector__tool");return o.type="button",o.dataset.tip=e,o.setAttribute("aria-label",e),o.innerHTML=t,o.addEventListener("click",()=>{W(!1),n(),J()}),o},B=j("Undo",h,()=>y.undo()),H=j("Reset all",u,()=>y.resetAll()),K=k("button","","Comment");K.type="button";let N=()=>s(y.list(),b.id),R=()=>{y.resetAll(),J()};K.addEventListener("click",()=>{let t=N();t&&(R(),i.onComment(e().document.body,t))}),P.append(B,H,K),E.append(S,T,z,P);let V,U=[],q=0,O=new Map;function W(e){e!==v()&&o.querySelectorAll(".design-inspector__bar:not(.design-token-bar) .design-inspector__compare button")[e?0:1]?.click(),y.sync(),F()}function F(){let e=y.size;S.textContent=e?`${e} change${e>1?"s":""}`:"",E.toggleAttribute("data-changes",e>0||y.canUndo),B.disabled=!y.canUndo,H.disabled=K.disabled=!e,T.hidden=!m||!e&&!v(),M.forEach((e,t)=>e.setAttribute("aria-pressed",String(!t===v()))),e?o.dataset.tokenEdits=String(e):delete o.dataset.tokenEdits,oe?.()}function J(){for(let e of O.values())e();F()}let G=e=>{let t=U.find(t=>t.path===e);return t?l.tokenLabel(t):e};function I(e,t){let n=r(i.design),o=y.get(e.path,n),a=e.alias?`{${e.alias}}`:e.value,s=(t,o)=>({path:e.path,value:t,from:a,to:o?`{${o}}`:t,...n?{theme:n}:{},...o?{alias:o}:{}}),d=e=>{y.set(e)&&J()},c=e.alias?U.filter(t=>t.type===e.type&&t.path!==e.path&&t.alias!==e.path):[];l.openTokenPicker({trigger:t,tokens:c,property:p(e),title:l.tokenLabel(e),current:o?o.alias:e.alias,onPreview:e=>y.preview(s(e.value,e.path)),onSelect:e=>d(s(e.value,e.path)),custom:{value:o?.value??e.value,onPreview:e=>y.preview(s(e)),onSelect:e=>d(s(e))}},!0)}let D=new Map;function Q(e){let t=()=>D.get(e.path)??e,n=k("div","design-token-row"),o=k("button");o.type="button",o.setAttribute("aria-haspopup","dialog");let a=k("b","",l.tokenLabel(e)),s=k("i"),d=k("button");d.type="button",d.title="Reset to page value",d.setAttribute("aria-label",`Reset ${e.path}`),d.innerHTML=u,n.append(o,d);let p=()=>{let e=t();a.textContent=l.tokenLabel(e);let p=y.get(e.path,r(i.design)),c=p?p.alias:e.alias,g=p?.value??e.value;s.textContent=c?G(c):g,o.replaceChildren(l.tokenPreview({...e,value:g}),a,s),o.dataset.tip=[e.path,e.ref,c?`${c} · ${g}`:g,e.description].filter(Boolean).join(" · "),o.setAttribute("aria-label",`${a.textContent}, ${s.textContent}${p?", edited":""}`),n.toggleAttribute("data-changed",!!p),d.disabled=!p};return o.addEventListener("click",()=>I(t(),o)),d.addEventListener("click",()=>{W(!1),y.reset(e.path,r(i.design)),J(),o.focus({preventScroll:!0})}),O.set(e.path,p),p(),n}let Y="";function Z(){for(let e of U)D.set(e.path,e);let e=C.value.toLowerCase().split(/\s+/).filter(Boolean),t=new Map([["",[]]]);for(let n of U){let o=y.get(n.path,r(i.design))?.to??n.value,a=`${l.tokenLabel(n)} ${n.path} ${n.ref??""} ${o}`.toLowerCase();if(!e.every(e=>a.includes(e)))continue;let s=n.group??"";t.set(s,[...t.get(s)??[],n])}let n=JSON.stringify([...t].map(([e,t])=>[e,t.map(e=>e.path)]));if(n===Y&&O.size)return J();Y=n,O.clear(),$.replaceChildren();let a=0;for(let[e,n]of t){if(!n.length)continue;let t=$;if(e){t=k("div"),t.setAttribute("role","group");let n=k("small","",e);n.id="design-token-group-"+ ++a,t.setAttribute("aria-labelledby",n.id),t.append(n),$.append(t)}for(let e of n)t.append(Q(e))}O.size||$.append(k("p","",e.length?"No matching tokens":"No tokens"));let s=o.querySelector(".design-inspector__identity small");s&&(s.textContent=`${U.length} token${1===U.length?"":"s"}`),F()}async function X(){let e=++q,t=[];try{t=await d.listTokens(b,d.themeState(i.design))}catch{z.textContent="Tokens unavailable · try again"}y.sync(),e===q&&x.isConnected&&(U=t,Z())}function ee(){V?.abort(),V=void 0,o.removeAttribute("data-tokens"),E.remove()}let te=new AbortController;new MutationObserver((e,t)=>{if("true"===o.getAttribute("aria-hidden")&&d.restoreThemes(o),o.isConnected)return y.sync(),F();t.disconnect(),te.abort(),ee(),y.stop(),oe?.(),w.remove(),f.delete(o)}).observe(o,{attributes:!0,attributeFilter:["data-before","aria-hidden"]}),i.root.addEventListener("palette-theme-change",()=>y.sync(),{signal:te.signal}),C.addEventListener("input",Z);let ne={open(){let e=o.querySelector(".design-inspector__controls");if(e){if(!x.isConnected){V=new AbortController;let{signal:r}=V;o.toggleAttribute("data-tokens",!0),e.replaceChildren(x),o.append(E);let a=o.querySelector(".design-inspector__target");a&&(a.textContent="Tokens");let s=new MutationObserver(()=>{x.isConnected||ee()});s.observe(e,{childList:!0}),r.addEventListener("abort",()=>s.disconnect(),{once:!0}),d.attachThemeSwitcher(x,i.design,()=>{X()},i.root,r),i.root.addEventListener("palette-theme-change",()=>{X()},{signal:r});let l=!1,p=e=>{l||g.footerTips(E,i.root,r,e),l=!0};E.addEventListener("pointerover",p,{signal:r}),E.addEventListener("focusin",p,{signal:r});let c=!1,u=e=>{c||g.footerTips($,i.root,r,e,L),c=!0};$.addEventListener("pointerover",u,{signal:r}),$.addEventListener("focusin",u,{signal:r});let h=e=>{let t=e.key.toLowerCase(),o=e.composedPath()[0];T.hidden||e.metaKey||e.ctrlKey||e.altKey||!["b","arrowleft","arrowright"].includes(t)||n(o)||"b"!==t&&o.matches?.("input,select,[role=slider],[role=radio]")||(e.preventDefault(),e.stopImmediatePropagation(),W("b"===t?!v():"arrowleft"===t))};document.addEventListener("keydown",h,{capture:!0,signal:r}),t("keydown",h,{capture:!0,signal:r}),Z(),X()}globalThis.matchMedia?.("(pointer:coarse)")?.matches||C.focus({preventScroll:!0})}}},oe=i.link?.({get size(){return y.size},get steps(){return y.steps},undo(){y.undo(),J()},redo(){y.redo(),J()},reset:R,proposal:N,open:ne.open});return ne}(o,i,l)),d.open()}function k(e,t="",n){let o=document.createElement(e);return o.className=t,void 0!==n&&(o.textContent=n),o}export{b as openTokenPage,r as themeKey,a as tokenEdits,s as tokenProposal,l as tokenValueChanges};

package/dist/token-picker-AJ5E5IN5.js

@@ -0,0 +1 @@
+import{k as e,n as t}from"./chunk-HLXSRXTK.js";import{a as o,b as n,c as i}from"./chunk-PF4NYFZK.js";import"./chunk-4FX5IS2U.js";import"./chunk-XOMOONGK.js";import{E as l}from"./chunk-4HBBEVFK.js";var r,a={font:"Typography","box-shadow":"Shadow","text-shadow":"Text shadow"},s=new WeakSet,p=0;function d(e){return e.label||e.path.slice(e.path.lastIndexOf(".")+1)||e.path}var c=(e,t,o)=>Math.min(o,Math.max(t,e));function f(e){let t=l("span","palette-tokens__pv");t.setAttribute("aria-hidden","true");let o=e=>{let o=l("span",`palette-tokens__${e}`);return t.append(o),o},n=e.value??"",{type:i}=e;if("color"===i){let e=o("sw"),t=l("span");u(n)?t.style.background=n:(t.dataset.unresolved="",t.textContent="?"),e.append(t)}else if("dimension"===i||"letterSpacing"===i){let i=function(e){let t=/^(-?[\d.]+)(px|r?em)?$/.exec(e.trim());return t?parseFloat(t[1])*(t[2]?"px"===t[2]?1:16:1):void 0}(n);if(void 0===i)return t;let l=/radius/.test(`${e.path} ${e.properties?.join(" ")}`),r=o(l?"corner":"dim");l?r.style.borderTopLeftRadius=`${c(i,0,12)}px`:r.style.width=`${c(i/2,2,24)}px`}else if("shadow"===i)o("shadow").style.boxShadow=n;else if("typography"===i||"fontWeight"===i||"fontFamily"===i){let e=o("ag");e.textContent="Ag","typography"===i?(e.style.font=n,e.style.fontSize="13px",e.style.lineHeight="1"):"fontWeight"===i?e.style.fontWeight=n:e.style.fontFamily=n}return t}function u(e){if(!e||/var\(/i.test(e))return!1;let t=l("span").style;return t.color=e,!!t.color}function h(e,o,n,i){let r=l("div");r.id=o,r.setAttribute("role","option"),r.setAttribute("aria-selected",String(n));let a=l("span","palette-tokens__name"),s=l("span","",d(e));a.append(s);let p=l("span","palette-tokens__check");p.setAttribute("aria-hidden","true");let c="color"===e.type&&!u(e.value),h=i.flatMap(t=>{let o=t.values.get(e.path);return o&&"color"===e.type?[`${t.label} ${o}`]:[]}),g=h.length>1?h.join(", "):e.value??"",m=l("span","palette-tokens__sub",[e.path,g].filter(Boolean).join(" · "));return m.setAttribute("aria-hidden","true"),r.append(f(e),a,p,m),r.setAttribute("aria-label",[e.label,t(e,g,c?"Unresolved; no swatch available":"")].filter(Boolean).join(" · ")),r}function g(e){let t=e.getRootNode();if((t instanceof ShadowRoot||t===document)&&!s.has(t)){s.add(t);let e=l("style");e.textContent=o+".palette-tokens{display:flex;flex-direction:column;overflow:hidden}.palette-tokens__head{flex:none;display:flex;align-items:center;gap:4px;min-height:36px;padding:0 12px;color:#f1efeb;font-weight:500}.palette-tokens__back{display:grid;place-items:center;width:20px;height:20px;margin-left:-6px;padding:0;border:0;border-radius:5px;background:none;color:#898680;cursor:pointer}.palette-tokens__back:hover{background:#ffffff14;color:#f1efeb}.palette-tokens__back svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.palette-tokens__bar{flex:none;display:flex;gap:4px;padding:0 8px 8px;background:#232323;border-bottom:1px solid #ffffff0d}.palette-tokens__bar input{flex:1;min-width:0;height:28px;box-sizing:border-box;margin:0;padding:0 8px;border:0;border-radius:6px;outline:0;box-shadow:none;background:#ffffff0a;color:#f1efeb;font:inherit}.palette-tokens__bar input:focus{outline:0;box-shadow:inset 0 0 0 1px #bda6ef}.palette-tokens__widen{flex:none;height:28px;margin:0 4px 4px;padding:0 8px;border:0;border-radius:6px;background:none;color:#898680;font:inherit;text-align:left;cursor:pointer}.palette-tokens__widen:hover,.palette-tokens__more:hover{background:#ffffff0f;color:#f1efeb}.palette-tokens__more{flex:none;display:flex;align-items:center;gap:8px;min-height:36px;padding:0 12px;border:0;border-top:1px solid #ffffff0d;background:none;color:#d9d6d1;font:inherit;text-align:left;cursor:pointer}.palette-tokens__more b{margin-right:auto;font-weight:500}.palette-tokens__more i{flex:none;width:14px;height:14px;border-radius:3px;box-shadow:inset 0 0 0 1px #ffffff26;background:linear-gradient(var(--c),var(--c)),repeating-conic-gradient(#ffffff40 0 25%,#ffffff12 0 50%) 0 0/8px 8px}.palette-tokens__more span{max-width:50%;overflow:hidden;color:#898680;font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap}.palette-tokens [role=listbox]{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 4px 4px}.palette-tokens small:not(.palette-select *){position:sticky;top:0;z-index:1;display:block;padding:8px 8px 4px;background:#232323;color:#77736f;font-size:10px;font-weight:500}.palette-tokens [role=option]:not(.palette-select *){display:grid;grid-template-columns:20px minmax(0,1fr) 14px;align-items:center;gap:4px 8px;box-sizing:border-box;min-height:32px;padding:6px 8px;border-radius:7px;cursor:pointer}.palette-tokens [data-active]{background:#ffffff14;color:#f1efeb}.palette-tokens [aria-selected=true] .palette-tokens__name{color:#e6dcfb}.palette-tokens__name{grid-column:2;min-width:0;font-weight:500}.palette-tokens__name>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.palette-tokens__sub{grid-column:2/4;display:none;min-width:0;overflow:hidden;color:#77736f;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.palette-tokens [data-active] .palette-tokens__sub{display:block}.palette-tokens__check{grid-column:3;justify-self:center}.palette-tokens [aria-selected=true] .palette-tokens__check{width:7px;height:3.5px;margin-top:-3px;border:solid #bda6ef;border-width:0 0 1.5px 1.5px;rotate:-45deg}.palette-tokens__pv{display:flex;align-items:center;height:16px;overflow:hidden}.palette-tokens__sw{display:flex;width:16px;height:16px;border-radius:4px;overflow:hidden;background:repeating-conic-gradient(#ffffff40 0 25%,#ffffff0d 0 50%) 0 0/8px 8px;outline:1px solid #ffffff1f;outline-offset:-1px}.palette-tokens__sw>span{flex:1}.palette-tokens__sw>[data-unresolved]{display:grid;place-items:center;background:#393939;color:#b6b1aa;font-size:10px}.palette-tokens__dim{height:4px;min-width:2px;border-radius:2px;background:#bda6ef}.palette-tokens__corner{width:12px;height:12px;box-sizing:border-box;border:solid #bda6ef;border-width:1.5px 0 0 1.5px}.palette-tokens__shadow{width:16px;height:12px;margin-left:2px;border-radius:3px;background:#f1efeb}.palette-tokens__ag{color:#f1efeb;font-size:13px;line-height:1;white-space:nowrap}.palette-tokens__empty{padding:12px 8px;color:#77736f}@media (pointer:coarse){.palette-tokens{font-size:13px}.palette-tokens [role=option]:not(.palette-select *){min-height:44px}.palette-tokens__bar input,.palette-tokens__bar button{height:36px}}.palette-tokens__custom{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}.palette-tokens__custom>.palette-custom{flex:none}.palette-tokens__custom .palette-custom__body{overflow:visible}.palette-tokens [hidden]{display:none!important}.palette-tokens button:focus-visible,.palette-tokens [role=listbox]:focus-visible{outline:1px solid #bda6ef;outline-offset:-2px}.palette-tokens[popover]{position:fixed;inset:auto;margin:0;border:0;padding:0}",(t instanceof ShadowRoot?t:document.head).append(e)}return t}function m(e,t){r?.trigger===e&&r.refresh(t)}function b(t,o=!1){let s=t.trigger.dataset.start;if(delete t.trigger.dataset.start,o&&r?.trigger===t.trigger)return r.close(!0);r?.close();let{trigger:f,property:u}=t,m=t.tokens,b=g(f),x="palette-tokens-"+ ++p,k=/color|^(fill|stroke)$/.test(u),v=l("div","palette-tokens");v.id=`${x}-popup`,v.setAttribute("role","dialog"),v.setAttribute("aria-label",`Edit ${u}`);let _=l("div","palette-tokens__head"),w=l("button","palette-tokens__back");w.type="button",w.setAttribute("aria-label","Back to tokens"),w.innerHTML='<svg viewBox="0 0 12 12" aria-hidden="true"><path d="M7.5 2.5 4 6l3.5 3.5"/></svg>';let y=l("span","",t.title||t.custom?.field?.label||a[u]||u);_.append(w,y);let A=l("div","palette-tokens__bar"),E=l("input");E.type="text",E.placeholder="Search tokens",E.autocomplete="off",E.spellcheck=!1,E.setAttribute("role","combobox"),E.setAttribute("aria-expanded","true"),E.setAttribute("aria-controls",x),E.setAttribute("aria-autocomplete","list"),E.setAttribute("aria-label",`Search tokens for ${u}`);let $=l("div","palette-tokens__list");$.id=x,$.tabIndex=0,$.setAttribute("role","listbox"),$.setAttribute("aria-label",`Tokens for ${u}`);let S=e(m,u),C=!S.length,L=l("button","palette-tokens__widen");L.type="button",A.append(E);let H=l("button","palette-tokens__more");H.type="button";let M=l("i"),T=l("span");H.append(l("b","","Custom…"),M,T);let P=l("div","palette-tokens__custom");v.append(_,A,$,L,H),t.custom&&v.append(P);let j,z,B,K,R=()=>new Map(m.map(e=>[e,`${d(e)} ${e.path} ${e.ref??""} ${e.value??""}`.toLowerCase()])),F=R(),I=[],N=[],D=0,U=-1,W=$,O=-1,X=!1,q=!1,Q=!1,V=()=>{let e=z;z=void 0,O=-1,e?.()},Y=e=>{V(),B=e,z=t.custom?.onPreview(e)},G=()=>{O<0||(V(),void 0!==B&&Y(B))},J=()=>!t.custom||!!S.length,Z=()=>{let e=J()&&!Q,o=C||E.value?m:S;$.hidden=A.hidden=!e,E.hidden=!e||!q&&o.length<=8&&!E.value,A.hidden||=E.hidden,L.hidden=!e||!!E.value||!S.length||S.length===m.length,L.textContent=C?"Show relevant tokens":`Show all ${m.length} tokens`,L.setAttribute("aria-pressed",String(C)),H.hidden=!e||!t.custom,P.hidden=e,w.hidden=!Q||!J(),y.textContent=Q&&J()?k?"Custom colour":"Custom value":t.title||t.custom?.field?.label||a[u]||u,v.toggleAttribute("data-custom",!e);let n=t.custom?.value??"",i=/^rgba?\((\d+)[ ,]+(\d+)[ ,]+(\d+)(?:[ ,/]+([\d.]+))?/.exec(n);T.textContent=k?i?i.slice(1,4).map(e=>Number(e).toString(16).padStart(2,"0")).join("").toUpperCase()+(i[4]&&+i[4]<1?` ${Math.round(100*+i[4])}%`:""):n.replace(/^#/,"").toUpperCase():n,M.hidden=!k||!n,M.style.setProperty("--c",n),H.title=n},ee=e=>{for(;D<Math.min(e,N.length);D++){let{token:e,group:o}=N[D];if(o!==j&&(j=o,W=$,o)){W=l("div"),W.setAttribute("role","group");let e=l("small");e.id=`${x}-g${D}`,e.textContent=o,W.setAttribute("aria-labelledby",e.id),W.append(e),$.append(W)}W.append(h(e,`${x}-${D}`,e.path===t.current,I))}},te=e=>$.querySelector(`#${x}-${e}`),oe=(e,o=!0,n=!0)=>{if(e<0||e>=N.length)return;if(e!==O&&n){V(),O=e;let o=N[e].token;o.path!==t.current&&(z=t.onPreview?.(o))}ee(e+60),te(U)?.removeAttribute("data-active"),U=e;let i=te(e);if(i.toggleAttribute("data-active",!0),E.setAttribute("aria-activedescendant",i.id),$.setAttribute("aria-activedescendant",i.id),!o)return;let l=i.offsetTop-(i.parentElement===$?0:i.parentElement.firstElementChild.offsetHeight),r=i.offsetTop+i.offsetHeight;l<$.scrollTop?$.scrollTop=l-4:r>$.scrollTop+$.clientHeight&&($.scrollTop=r-$.clientHeight+4)},ne=(e=!1,t=!1)=>{let o=t?N[U]?.token.path:void 0,n=$.scrollTop,i=t?D:60;O>=0&&V();let r=E.value.toLowerCase().split(/\s+/).filter(Boolean),a=C||r.length?m:S,s=r.length?a.filter(e=>r.every(t=>F.get(e).includes(t))):a,p=C?s:[...s.filter(e=>S.includes(e)),...s.filter(e=>!S.includes(e))],d=new Map([["",[]]]);for(let e of p){let t=e.group??"";d.set(t,[...d.get(t)??[],e])}if(N=[...[...d].flatMap(([e,t])=>t.map(t=>({token:t,group:e})))],$.replaceChildren(),$.scrollTop=0,D=0,U=-1,j=void 0,E.removeAttribute("aria-activedescendant"),$.removeAttribute("aria-activedescendant"),Z(),!N.length){let e=l("div","palette-tokens__empty",r.length?"No matching tokens":"No tokens");return void $.append(e)}ee(i),oe(Math.max(0,N.findIndex(e=>e.token.path===o)),!1,e),t&&($.scrollTop=n)},ie=new AbortController,{signal:le}=ie,re=!!globalThis.matchMedia?.("(pointer:coarse)")?.matches;function ae(e=!1,o=!1){if(r?.close!==ae)return;r=void 0;let n=K?.live&&B;V(),n&&!o&&(t.custom?.onCommit??t.custom?.onSelect)?.(n),t.custom?.[o?"onCancel":"onDone"]?.(),ie.abort(),K?.destroy(),v.remove(),f.setAttribute("aria-expanded","false"),f.removeAttribute("aria-controls"),e&&f.isConnected&&f.focus({preventScroll:!0})}r={trigger:f,close:ae,refresh(o){if(!o)return X||=O>=0,V();let n=X||O>=0;X=!1,t=o,m=o.tokens,S=e(m,u),F=R(),I=[],ne(n&&!Q,!0),t.current&&t.custom&&K?.refresh(t.custom.value),O<0&&!z&&void 0!==B&&Y(B),ve()}};let se=e=>{V(),B=void 0,t.custom?.onCancel?.(),ae(!0),e.path!==t.current&&t.onSelect(e)},pe=t.custom?k?import("./color-editor-QPJQD36F.js"):import("./token-custom-CASAQWYW.js"):void 0;function de(e,o=!re){G(),Q=e,Z(),ge="",me(),Q?async function(e){let o=await pe;if(r?.close!==ae)return;K||(K=o.pickerEditor(t,{preview:Y,commit(e){if(!t.custom?.onCommit)return Y(e);V(),B=void 0,t.custom.onCommit(e)},token:se,hover(e){V(),void 0!==e?z=t.custom?.onPreview(e):void 0!==B&&Y(B)}}),P.append(K)),ge="",me();let n=!!v.getClientRects().length,i=[...v.querySelectorAll("input,select,summary,button")].filter(e=>(!n||e.getClientRects().length)&&!e.closest("[hidden]")&&!e.matches("details:not([open]) :not(summary)"));e&&(i.find(e=>e instanceof HTMLInputElement&&P.contains(e))??i[0])?.focus({preventScroll:!0})}(o):o&&(E.hidden?H:E).focus({preventScroll:!0})}let ce=e=>{let t=N[e]?.token;t&&se(t)};H.addEventListener("click",()=>de(!0),{signal:le}),w.addEventListener("click",()=>de(!1),{signal:le}),E.addEventListener("input",()=>ne(!0),{signal:le}),L.addEventListener("click",()=>{C=!C,ne(!0),re||(E.hidden?$:E).focus({preventScroll:!0})},{signal:le}),addEventListener("keydown",e=>{if(!f.isConnected)return ae();let t=e.composedPath();if(!t.includes(v)&&!t.includes(f))return;let{key:o}=e,n={ArrowDown:1,ArrowUp:-1,PageDown:8,PageUp:-8}[o];if(!(e.ctrlKey||e.metaKey||e.altKey||"Escape"===o&&t[0]instanceof HTMLSelectElement&&t[0]!==f&&"true"===t[0].getAttribute("aria-expanded"))){if("Escape"===o)ae(!0,!0);else if("Tab"===o){let o=[...v.querySelectorAll("button,input,select,summary,[tabindex='0']")].filter(e=>!e.closest("[hidden]")&&!e.matches("details:not([open]) :not(summary)")&&e.getClientRects().length);if(t[0]!==o[e.shiftKey?0:o.length-1])return;o[e.shiftKey?o.length-1:0]?.focus()}else if(t[0]===H&&"ArrowUp"===o&&N.length)$.focus({preventScroll:!0}),oe(N.length-1);else{if($.hidden||t[0]!==E&&t[0]!==f&&t[0]!==$)return;if(n>0&&t[0]===$&&U===N.length-1&&!H.hidden)G(),H.focus({preventScroll:!0});else if(n)oe(c(U+n,0,N.length-1));else if("Home"!==o&&"End"!==o||t[0]===E)if("Enter"===o)ce(U);else{if(t[0]!==$||1!==o.length||" "===o)return;q=!0,E.value+=o,ne(!0),E.focus({preventScroll:!0})}else oe("Home"===o?0:N.length-1)}e.preventDefault(),e.stopImmediatePropagation()}},{capture:!0,signal:le}),addEventListener("pointerdown",e=>{let t=e.composedPath();!t.includes(v)&&!t.includes(f)&&ae()},{capture:!0,signal:le}),addEventListener("focusin",e=>{let t=e.composedPath();!t.includes(v)&&!t.includes(f)&&ae()},{capture:!0,signal:le});let fe=e=>{e.target===$?$.scrollTop+$.clientHeight>$.scrollHeight-200&&ee(D+60):e.target instanceof Node&&v.contains(e.target)||ae()};addEventListener("scroll",fe,{capture:!0,signal:le}),b.addEventListener("scroll",fe,{capture:!0,signal:le}),addEventListener("resize",()=>ae(),{signal:le}),i(f,()=>ae(),le),$.addEventListener("mousedown",e=>e.preventDefault(),{signal:le});let ue=e=>{let t=e.target.closest?.("[role=option]");return t&&$.contains(t)?Number(t.id.slice(x.length+1)):-1};$.addEventListener("pointermove",e=>{let t=ue(e);t>=0&&oe(t,!1)},{signal:le}),$.addEventListener("pointerleave",G,{signal:le}),H.addEventListener("focusin",G,{signal:le}),P.addEventListener("focusin",G,{signal:le}),v.addEventListener("click",e=>{e.target instanceof HTMLInputElement||e.target instanceof HTMLSelectElement||e.target instanceof HTMLButtonElement||e.preventDefault();let t=ue(e);t>=0&&ce(t)},{signal:le}),ne();let he=f.closest(".design-field")??f.parentElement;v.popover="manual",he.append(v),v.showPopover?.(),he.addEventListener("palette-field-sync",()=>{z||!t.custom||(K?.refresh(t.custom.value),Z())},{signal:le}),f.setAttribute("aria-expanded","true"),f.setAttribute("aria-controls",v.id);let ge="",me=()=>{let e=he.getBoundingClientRect();if(ge===`${e.left} ${e.top}`)return;ge=`${e.left} ${e.top}`;let t=n(he),o=c(t.right-t.left-8,120,256),i=innerHeight-e.bottom-12,l=e.top-12;v.style.maxHeight="";let r=i<Math.min(460,Math.max(v.scrollHeight,200))&&l>i,a=Math.min(460,innerHeight-16,Math.max(r?l:i,200));v.style.width=`${o}px`,v.style.maxHeight=`${a}px`,v.style.left=`${c(e.left,t.left+4,t.right-o-4)}px`,v.style.top=r?"":`${Math.min(e.bottom+4,innerHeight-8-a)}px`,v.style.bottom=r?`${Math.min(innerHeight-e.top+4,innerHeight-8-a)}px`:"",v.toggleAttribute("data-up",r)};me();let be=new MutationObserver(me);be.observe(b,{attributes:!0,childList:!0,subtree:!0}),le.addEventListener("abort",()=>be.disconnect());let xe=N.findIndex(e=>e.token.path===t.current);xe>=0&&oe(xe,!0,!1),!J()||"custom"===s&&t.custom?de(!0):re||(E.hidden?$:E).focus({preventScroll:!0,focusVisible:!1});let ke=0;function ve(){let e=++ke;Promise.resolve(t.themes?.()).then(t=>{!t||t.length<2||r?.close!==ae||e!==ke||(I=t,$.hidden||ne(O>=0,!0))},()=>{})}return ve(),()=>ae()}export{b as openTokenPicker,m as refreshTokenPicker,g as stylePicker,d as tokenLabel,f as tokenPreview};

package/dist/{toolbar-runtime-QCZONSWE.js → toolbar-runtime-TZWY2KH3.js}

@@ -1 +1 @@
-import{a as e,b as t,c as r,m as n,n as i,o}from"./chunk-LMXFSXO6.js";import{b as a,c as l}from"./chunk-6HM4JQLV.js";import{D as c,H as u,K as d,x as s}from"./chunk-IQOPM3JF.js";import{a as m,b as p,c as h,d as f}from"./chunk-GGU2XLWE.js";import{createRoot as g}from"react-dom/client";import{flushSync as y}from"react-dom";import{createElement as b}from"react";import*as v from"react";var k=({size:e=24,color:t="currentColor",...r})=>v.createElement("svg",{viewBox:"0 0 24 24",width:e,height:e,stroke:t,strokeWidth:"2",fill:"none",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",...r},v.createElement("path",{d:"M12 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2Zm7 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2ZM5 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"}));k.displayName="DotsHorizontal";import*as _ from"react";var w=({size:e=24,color:t="currentColor",...r})=>_.createElement("svg",{viewBox:"0 0 24 24",width:e,height:e,stroke:t,strokeWidth:"2",fill:"none",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",...r},_.createElement("path",{d:"M18 6 6 18M6 6l12 12"}));w.displayName="XClose";import*as x from"react";var N=({size:e=24,color:t="currentColor",...r})=>x.createElement("svg",{viewBox:"0 0 24 24",width:e,height:e,stroke:t,strokeWidth:"2",fill:"none",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",...r},x.createElement("path",{d:"M19 12H5m0 0 7 7m-7-7 7-7"}));N.displayName="ArrowLeft";import*as T from"react";var E=({size:e=24,color:t="currentColor",...r})=>T.createElement("svg",{viewBox:"0 0 24 24",width:e,height:e,stroke:t,strokeWidth:"2",fill:"none",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",...r},T.createElement("path",{d:"m9 18 6-6-6-6"}));E.displayName="ChevronRight";import{useEffect as M,useId as L,useLayoutEffect as C,useRef as S,useState as A}from"react";import{useState as $}from"react";import{Fragment as j,jsx as B,jsxs as P}from"react/jsx-runtime";function I({items:l,bar:u,defaultActiveId:d,activeId:s,edge:g="bottom",alignEnd:y=!1,onActiveChange:b,label:v="App navigation",moreLabel:_="More",backLabel:x="Back",className:T="",style:E}){let I=L(),[D,R]=A({kind:"collapsed"}),[z,K]=A(d??l[0]?.id),[X,q]=A(null),F=S(null),Y=S(null),Z=S(g),G="left"===g||"right"===g;C(()=>{let e=Y.current;if(!e||!X)return;let t=0,r=0,n=document.documentElement.clientWidth,i=window.innerHeight;for(let o=e.parentNode;o instanceof Element&&o!==document.body;o=o.parentNode instanceof ShadowRoot?o.parentNode.host:o.parentNode){let e=getComputedStyle(o),a=o.getBoundingClientRect();"visible"!==e.overflowX&&(t=Math.max(t,a.left),n=Math.min(n,a.right)),"visible"!==e.overflowY&&(r=Math.max(r,a.top),i=Math.min(i,a.bottom))}e.style.maxWidth=`${Math.max(0,n-t-16)}px`,e.style.left=`${X.x}px`,e.style.top=`${X.y}px`;let o=e.getBoundingClientRect(),a=Math.max(t+8-o.left,Math.min(0,n-8-o.right)),l=Math.max(r+8-o.top,Math.min(0,i-8-o.bottom));e.style.left=`${X.x+a}px`,e.style.top=`${X.y+l}px`},[X]);let J=S(null),Q=S(null),U=S(D),V=S("more"),ee=S(!1),te=S(!1),re=S(!1),ne=S(null),ie=S(void 0),oe=S(void 0),ae=S(!1),le=S(!1),ce=function(){!p.current&&h();let[e]=$(m.current);return e}(),ue=s??z,de="collapsed"!==D.kind,se=n(l,u).filter(e=>"|"===e||"more"===e||l.some(t=>t.id===e)),me=se.filter(e=>"|"!==e).length,pe=l.filter(e=>e.children?.length),he=S(new Map),fe=S(new Map),ge=se.join(" ");function ye(){clearTimeout(ie.current),q(null)}function be(){ye(),clearTimeout(oe.current),ae.current=!1}function ve(e,t,r=!1){clearTimeout(ie.current);let n=F.current,i=Q.current;if(!n||!i||de||te.current||re.current&&!r)return;let o=n.getBoundingClientRect(),a=e.getBoundingClientRect(),l={label:t?t.count?`${t.label} · ${t.count} open`:t.label:_,shortcut:t?.shortcut,x:"left"===g?o.width+8:"right"===g?-8:a.left-o.left+a.width/2,y:"top"===g?o.height+8:"bottom"===g?-8:a.top-o.top+a.height/2};clearTimeout(oe.current);let c=()=>{ae.current=!0,q(l)};r||ae.current?c():ie.current=setTimeout(c,400)}function ke(e,t,r){be(),de||(V.current=t,ee.current=r),ne.current="first",R(e)}function _e(e=!0,t=V.current){be(),re.current=!0,ne.current=e&&ee.current?t:null,R({kind:"collapsed"})}function we(){"group"===D.kind&&(ne.current=D.id,R({kind:"main"}))}function xe(e,t){let r=!!e.children?.length,n=ue===e.id||!!e.children?.some(e=>e.id===ue),l=!t&&e.keepOpenOnSelect,c=(t,r=!1)=>B(O,{label:e.label,icon:r,reduced:!!ce,children:t}),u=n&&e.activeIcon?e.activeIcon:e.icon,d=P(j,{children:[B("span",{className:"morphing-menu__icon","aria-hidden":"true",style:l?{display:"grid"}:void 0,children:l?c(u,!0):u}),!t&&B("span",{className:"morphing-menu__label",style:l?{display:"grid"}:void 0,children:l?c(e.label):e.label}),t&&!!e.count&&B("span",{className:"morphing-menu__badge","aria-hidden":"true",children:i(e.count)}),!t&&P("span",{className:"morphing-menu__trailing",children:[!!e.count&&B("span",{className:"morphing-menu__count","aria-hidden":"true",children:e.count}),e.shortcut&&B(W,{shortcut:e.shortcut})]}),!t&&r&&B(H,{})]}),s={className:t?"morphing-menu__shortcut":"morphing-menu__row","data-menu-item":e.id,"aria-label":o(e.label,e.count),"aria-keyshortcuts":e.shortcut?a(e.shortcut).aria:void 0,"aria-pressed":e.checked,"aria-current":n?r?"true":"page":void 0,"aria-expanded":r?"group"===D.kind&&D.id===e.id:void 0,"aria-controls":r?`${I}-group-${e.id}`:void 0,onClick:t=>r?ke({kind:"group",id:e.id},e.id,0===t.detail):function(e){K(e.id),b?.(e.id),de&&!e.keepOpenOnSelect?_e(!0,"group"===D.kind?D.id:e.id):be(),e.onSelect?.()}(e),onPointerEnter:r=>{t&&"mouse"===r.pointerType&&ve(r.currentTarget,e)},onPointerLeave:ye,onPointerDown:be,onFocus:r=>{t&&r.currentTarget.matches(":focus-visible")&&ve(r.currentTarget,e,!0)},onBlur:ye};return e.href&&!r?B("a",{href:e.href,...s,children:d},e.id):B("button",{type:"button",...s,children:d},e.id)}C(()=>{let t=new Map,r=[...Q.current?.querySelectorAll("[data-menu-item]")??[]].map(e=>{let r=e.dataset.menuItem,n=[e.offsetLeft,e.offsetTop];return t.set(r,n),{node:e,id:r,position:n,before:he.current.get(r)}});for(let{node:t,id:n,position:i,before:o}of r)ce||ee.current?(fe.current.get(n)?.complete(),fe.current.delete(n)):o&&(o[0]!==i[0]||o[1]!==i[1])&&(fe.current.get(n)?.complete(),fe.current.set(n,f(t,{x:[o[0]-i[0],0],y:[o[1]-i[1],0]},e)));for(let[e,r]of fe.current)t.has(e)||(r.stop(),fe.current.delete(e));he.current=t},[ge,g,D,ce]),M(()=>()=>{for(let e of fe.current.values())e.stop()},[]),C(()=>{let n=F.current,i=J.current,o=Q.current;if(!n||!i||!o)return;let a=Z.current!==g;Z.current=g;let l=U.current;U.current=D;let c=[...n.querySelectorAll(".morphing-menu__panel")],u=c.find(e=>"false"===e.getAttribute("aria-hidden")),d=[],s=!1,m=e=>(d.push(e),e),p=()=>({width:u?.offsetWidth??o.offsetWidth,height:u?.offsetHeight??o.offsetHeight}),h=a||l.kind!==D.kind||"group"===l.kind&&"group"===D.kind&&l.id!==D.id,y="collapsed"===l.kind!=("collapsed"===D.kind),b=ce||!h;if(b)(()=>{let e=p();i.style.width=`${e.width}px`,i.style.height=`${e.height}px`})();else if(y&&!de)m(f(i,p(),r));else if(y){let r=Math.min(o.offsetWidth,o.offsetWidth>250?280:200);m(f(i,{width:r,height:o.offsetHeight>52?32:28},t)).finished.then(()=>{s||m(f(i,p(),{...e,bounce:de?.24:.15}))}).catch(()=>{})}else m(f(i,p(),{...e,duration:.25,bounce:.1}));m(f(o,{opacity:de?0:1,scale:de&&!ce?.8:1,filter:de&&!ce?"blur(8px)":"blur(0px)"},{duration:b?0:de?.15:.22,delay:b||de?0:.08,...de?{}:{ease:"easeOut"}}));for(let t of c){let r=t===u;for(let[n,i]of[...t.querySelectorAll(".morphing-menu__row")].entries())r&&y&&!b&&Object.assign(i.style,{opacity:"0",transform:"translateY(48px)",filter:"blur(4px)"}),m(f(i,{opacity:r?1:0,y:r||ce?0:16,filter:r||ce?"blur(0px)":"blur(2px)"},{...e,duration:b?0:r?y?.4:.25:.12,bounce:y?.3:0,delay:!b&&r?(y?.2:0)+.02*n:0}))}let v=[...(de?u:o)?.querySelectorAll("[data-menu-item]")??[]],k=ne.current;ne.current=null,k&&(te.current=!0,(("first"===k?v[0]:v.find(e=>e.dataset.menuItem===k))??(de?void 0:v.find(e=>"more"===e.dataset.menuItem)))?.focus({preventScroll:!0}),te.current=!1);let _=()=>R(e=>({...e}));return window.addEventListener("resize",_),()=>{s=!0,d.forEach(e=>e.stop()),window.removeEventListener("resize",_)}},[D,ce,g,l.length,ge]),M(()=>{if(!de)return;let e=new AbortController;return c(F.current,"pointerdown",e=>{e.target instanceof Node&&!e.composedPath().includes(F.current)&&_e(!1)},{signal:e.signal}),()=>e.abort()},[de]),M(()=>()=>{clearTimeout(ie.current),clearTimeout(oe.current)},[]);let Ne=P("button",{type:"button",className:"morphing-menu__row","data-menu-item":"close",onClick:()=>_e(!0,"more"),children:[B(w,{"aria-hidden":"true"}),B("span",{className:"morphing-menu__label",children:"Close menu"})]});return P("nav",{ref:F,"aria-label":v,className:["morphing-menu",T].filter(Boolean).join(" "),"data-view":D.kind,"data-edge":g,"data-vertical":G,"data-align-end":y,style:{"--mm-count":me,"--mm-gaps":se.length-me,...E},onPointerMove:e=>{if(!re.current||"mouse"!==e.pointerType||!e.movementX&&!e.movementY)return;re.current=!1;let t=e.target instanceof Element?e.target.closest(".morphing-menu__shortcut"):null;t&&ve(t,l.find(e=>e.id===t.dataset.menuItem)??null)},onKeyDown:e=>{"Escape"===e.key&&(re.current=!0,be(),de&&(e.preventDefault(),e.stopPropagation(),"group"===D.kind?we():_e()))},onBlur:e=>{e.relatedTarget instanceof Node&&e.currentTarget.contains(e.relatedTarget)||(de?e.relatedTarget instanceof Node&&_e(!1):le.current||be())},children:[P("div",{ref:J,className:"morphing-menu__shell",children:[B("div",{ref:Q,className:"morphing-menu__bar","aria-hidden":de,inert:de,onPointerEnter:e=>{"mouse"===e.pointerType&&(le.current=!0,clearTimeout(oe.current))},onPointerLeave:e=>{"mouse"===e.pointerType&&(le.current=!1,ye(),clearTimeout(oe.current),oe.current=setTimeout(()=>{ae.current=!1},300))},onKeyDown:e=>{let t={ArrowLeft:-1,ArrowUp:-1,ArrowRight:1,ArrowDown:1}[e.key],r=[...e.currentTarget.querySelectorAll("[data-menu-item]")],n=r.indexOf(e.target);n<0||e.altKey||e.ctrlKey||e.metaKey||e.shiftKey||!t&&"Home"!==e.key&&"End"!==e.key||(e.preventDefault(),r["Home"===e.key?0:"End"===e.key?r.length-1:(n+t+r.length)%r.length].focus({preventScroll:!0}))},children:se.map((e,t)=>"|"===e?B("span",{className:"morphing-menu__separator","aria-hidden":"true"},`separator-${t}`):"more"!==e?xe(l.find(t=>t.id===e),!0):B("button",{type:"button",className:"morphing-menu__shortcut","data-menu-item":"more","aria-label":_,"aria-expanded":de,"aria-controls":`${I}-main`,onClick:e=>ke({kind:"main"},"more",0===e.detail),onPointerEnter:e=>{"mouse"===e.pointerType&&ve(e.currentTarget,null)},onPointerLeave:ye,onPointerDown:be,onBlur:ye,onFocus:e=>{e.currentTarget.matches(":focus-visible")&&ve(e.currentTarget,null,!0)},children:B(k,{"aria-hidden":"true"})},"more"))}),P("div",{id:`${I}-main`,className:"morphing-menu__panel","aria-hidden":"main"!==D.kind,inert:"main"!==D.kind,children:[Ne,[...new Set(l.map(e=>e.group??""))].map(e=>P("section",{"aria-label":e||void 0,className:"morphing-menu__section",children:[e&&B("h3",{children:e}),[...l].filter(t=>(t.group??"")===e).sort((e,t)=>(e.expandedOrder??0)-(t.expandedOrder??0)).map(e=>xe(e,!1))]},e))]}),pe.map(e=>{let t="group"===D.kind&&D.id===e.id;return P("div",{id:`${I}-group-${e.id}`,className:"morphing-menu__panel","aria-label":e.label,"aria-hidden":!t,inert:!t,children:[P("button",{type:"button",className:"morphing-menu__row","data-menu-item":"back",onClick:we,children:[B(N,{"aria-hidden":"true"}),B("span",{children:x})]}),e.children.map(e=>xe(e,!1)),Ne]},e.id)})]}),X&&!de&&P("div",{ref:Y,className:"morphing-menu__tooltip","aria-hidden":"true",style:{left:X.x,top:X.y},children:[X.label,X.shortcut&&B(W,{shortcut:X.shortcut})]})]})}function H(){return B(E,{className:"morphing-menu__chevron","aria-hidden":"true"})}function O({label:e,icon:t,reduced:r,children:n}){let i=S(null),o=S(null);return C(()=>{let n=i.current,a=o.current;if(o.current={label:e,node:n.cloneNode(!0)},!a||a.label===e||r)return;let l=a.node;l.setAttribute("aria-hidden","true"),n.parentElement.append(l);let c={duration:200,easing:"cubic-bezier(.22,1,.36,1)"},u=n.animate([{opacity:0,transform:t?"scale(.7)":"translateY(4px)",filter:"blur(2px)"},{opacity:1,transform:"none",filter:"blur(0px)"}],c),d=l.animate([{opacity:1,transform:"none",filter:"blur(0px)"},{opacity:0,transform:t?"scale(.7)":"translateY(-4px)",filter:"blur(2px)"}],c);return d.finished.then(()=>l.remove()).catch(()=>{}),()=>{u.cancel(),d.cancel(),l.remove()}},[e,t,r]),B("span",{ref:i,style:{gridArea:"1 / 1",display:"flex",alignItems:"center"},children:n})}function W({shortcut:e}){let t=S(null);return C(()=>{t.current?.replaceChildren(l(e))},[e.label]),B("span",{ref:t})}function D(e){if("glyph"in e)return b("span",{style:{display:"contents"},dangerouslySetInnerHTML:{__html:s[e.glyph]}});let{user:t}=e,r=t&&d(t);return b("span",{className:"review-avatar"},t?u(t.name):D({glyph:"person"}),r&&b("img",{key:r,src:r,alt:"",referrerPolicy:"no-referrer",decoding:"async",onError:e=>{e.currentTarget.hidden=!0}}))}var R=e=>b(I,{...e,items:e.items.map(e=>({...e,icon:D(e.icon),children:e.children?.map(e=>({...e,icon:D(e.icon)}))}))});function z(e,t){e.replaceChildren();let r=g(e);return y(()=>r.render(R(t))),{render:e=>r.render(R(e)),unmount:()=>r.unmount()}}export{z as mountToolbar};
+import{a as e,b as t,c as r,m as n,n as i,o}from"./chunk-LMXFSXO6.js";import{b as a,c as l}from"./chunk-VX6XCU4E.js";import{D as c,H as u,K as d,x as s}from"./chunk-4HBBEVFK.js";import{a as m,b as p,c as h,d as f}from"./chunk-GGU2XLWE.js";import{createRoot as g}from"react-dom/client";import{flushSync as y}from"react-dom";import{createElement as b}from"react";import*as v from"react";var k=({size:e=24,color:t="currentColor",...r})=>v.createElement("svg",{viewBox:"0 0 24 24",width:e,height:e,stroke:t,strokeWidth:"2",fill:"none",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",...r},v.createElement("path",{d:"M12 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2Zm7 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2ZM5 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"}));k.displayName="DotsHorizontal";import*as _ from"react";var w=({size:e=24,color:t="currentColor",...r})=>_.createElement("svg",{viewBox:"0 0 24 24",width:e,height:e,stroke:t,strokeWidth:"2",fill:"none",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",...r},_.createElement("path",{d:"M18 6 6 18M6 6l12 12"}));w.displayName="XClose";import*as x from"react";var N=({size:e=24,color:t="currentColor",...r})=>x.createElement("svg",{viewBox:"0 0 24 24",width:e,height:e,stroke:t,strokeWidth:"2",fill:"none",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",...r},x.createElement("path",{d:"M19 12H5m0 0 7 7m-7-7 7-7"}));N.displayName="ArrowLeft";import*as T from"react";var E=({size:e=24,color:t="currentColor",...r})=>T.createElement("svg",{viewBox:"0 0 24 24",width:e,height:e,stroke:t,strokeWidth:"2",fill:"none",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",...r},T.createElement("path",{d:"m9 18 6-6-6-6"}));E.displayName="ChevronRight";import{useEffect as L,useId as M,useLayoutEffect as C,useRef as S,useState as A}from"react";import{useState as $}from"react";import{Fragment as B,jsx as j,jsxs as P}from"react/jsx-runtime";function H({items:l,bar:u,defaultActiveId:d,activeId:s,edge:g="bottom",alignEnd:y=!1,onActiveChange:b,label:v="App navigation",moreLabel:_="More",backLabel:x="Back",className:T="",style:E}){let H=M(),[D,R]=A({kind:"collapsed"}),[z,K]=A(d??l[0]?.id),[X,q]=A(null),F=S(null),Y=S(null),U=S(g),Z="left"===g||"right"===g;C(()=>{let e=Y.current;if(!e||!X)return;let t=0,r=0,n=document.documentElement.clientWidth,i=window.innerHeight;for(let o=e.parentNode;o instanceof Element&&o!==document.body;o=o.parentNode instanceof ShadowRoot?o.parentNode.host:o.parentNode){let e=getComputedStyle(o),a=o.getBoundingClientRect();"visible"!==e.overflowX&&(t=Math.max(t,a.left),n=Math.min(n,a.right)),"visible"!==e.overflowY&&(r=Math.max(r,a.top),i=Math.min(i,a.bottom))}e.style.maxWidth=`${Math.max(0,n-t-16)}px`,e.style.left=`${X.x}px`,e.style.top=`${X.y}px`;let o=e.getBoundingClientRect(),a=Math.max(t+8-o.left,Math.min(0,n-8-o.right)),l=Math.max(r+8-o.top,Math.min(0,i-8-o.bottom));e.style.left=`${X.x+a}px`,e.style.top=`${X.y+l}px`},[X]);let G=S(null),V=S(null),J=S(D),Q=S("more"),ee=S(!1),te=S(!1),re=S(!1),ne=S(null),ie=S(void 0),oe=S(void 0),ae=S(!1),le=S(!1),ce=function(){!p.current&&h();let[e]=$(m.current);return e}(),ue=s??z,de="collapsed"!==D.kind,se=n(l,u).filter(e=>"|"===e||"more"===e||l.some(t=>t.id===e)),me=se.filter(e=>"|"!==e).length,pe=l.filter(e=>e.children?.length),he=S(new Map),fe=S(new Map),ge=se.join(" ");function ye(){clearTimeout(ie.current),q(null)}function be(){ye(),clearTimeout(oe.current),ae.current=!1}function ve(e,t,r=!1){clearTimeout(ie.current);let n=F.current,i=V.current;if(!n||!i||de||te.current||re.current&&!r)return;let o=n.getBoundingClientRect(),a=e.getBoundingClientRect(),l={label:t?t.count?`${t.label} · ${t.count} open`:t.label:_,shortcut:t?.shortcut,x:"left"===g?o.width+8:"right"===g?-8:a.left-o.left+a.width/2,y:"top"===g?o.height+8:"bottom"===g?-8:a.top-o.top+a.height/2};clearTimeout(oe.current);let c=()=>{ae.current=!0,q(l)};r||ae.current?c():ie.current=setTimeout(c,400)}function ke(e,t,r){be(),de||(Q.current=t,ee.current=r),ne.current="first",R(e)}function _e(e=!0,t=Q.current){be(),re.current=!0,ne.current=e&&ee.current?t:null,R({kind:"collapsed"})}function we(){"group"===D.kind&&(ne.current=D.id,R({kind:"main"}))}function xe(e,t){let r=!!e.children?.length,n=ue===e.id||!!e.children?.some(e=>e.id===ue),l=!t&&e.keepOpenOnSelect,c=(t,r=!1)=>j(W,{label:e.label,icon:r,reduced:!!ce,children:t}),u=n&&e.activeIcon?e.activeIcon:e.icon,d=P(B,{children:[j("span",{className:"morphing-menu__icon","aria-hidden":"true",style:l?{display:"grid"}:void 0,children:l?c(u,!0):u}),!t&&j("span",{className:"morphing-menu__label",style:l?{display:"grid"}:void 0,children:l?c(e.label):e.label}),t&&!!e.count&&j("span",{className:"morphing-menu__badge","aria-hidden":"true",children:i(e.count)}),!t&&P("span",{className:"morphing-menu__trailing",children:[!!e.count&&j("span",{className:"morphing-menu__count","aria-hidden":"true",children:e.count}),e.shortcut&&j(O,{shortcut:e.shortcut})]}),!t&&r&&j(I,{})]}),s={className:t?"morphing-menu__shortcut":"morphing-menu__row","data-menu-item":e.id,"aria-label":o(e.label,e.count),"aria-keyshortcuts":e.shortcut?a(e.shortcut).aria:void 0,"aria-pressed":e.checked,"aria-current":n?r?"true":"page":void 0,"aria-expanded":r?"group"===D.kind&&D.id===e.id:void 0,"aria-controls":r?`${H}-group-${e.id}`:void 0,onClick:t=>r?ke({kind:"group",id:e.id},e.id,0===t.detail):function(e){K(e.id),b?.(e.id),de&&!e.keepOpenOnSelect?_e(!0,"group"===D.kind?D.id:e.id):be(),e.onSelect?.()}(e),onPointerEnter:r=>{t&&"mouse"===r.pointerType&&ve(r.currentTarget,e)},onPointerLeave:ye,onPointerDown:be,onFocus:r=>{t&&r.currentTarget.matches(":focus-visible")&&ve(r.currentTarget,e,!0)},onBlur:ye};return e.href&&!r?j("a",{href:e.href,...s,children:d},e.id):j("button",{type:"button",...s,children:d},e.id)}C(()=>{let t=new Map,r=[...V.current?.querySelectorAll("[data-menu-item]")??[]].map(e=>{let r=e.dataset.menuItem,n=[e.offsetLeft,e.offsetTop];return t.set(r,n),{node:e,id:r,position:n,before:he.current.get(r)}});for(let{node:t,id:n,position:i,before:o}of r)ce||ee.current?(fe.current.get(n)?.complete(),fe.current.delete(n)):o&&(o[0]!==i[0]||o[1]!==i[1])&&(fe.current.get(n)?.complete(),fe.current.set(n,f(t,{x:[o[0]-i[0],0],y:[o[1]-i[1],0]},e)));for(let[e,r]of fe.current)t.has(e)||(r.stop(),fe.current.delete(e));he.current=t},[ge,g,D,ce]),L(()=>()=>{for(let e of fe.current.values())e.stop()},[]),C(()=>{let n=F.current,i=G.current,o=V.current;if(!n||!i||!o)return;let a=U.current!==g;U.current=g;let l=J.current;J.current=D;let c=[...n.querySelectorAll(".morphing-menu__panel")],u=c.find(e=>"false"===e.getAttribute("aria-hidden")),d=[],s=!1,m=e=>(d.push(e),e),p=()=>({width:u?.offsetWidth??o.offsetWidth,height:u?.offsetHeight??o.offsetHeight}),h=a||l.kind!==D.kind||"group"===l.kind&&"group"===D.kind&&l.id!==D.id,y="collapsed"===l.kind!=("collapsed"===D.kind),b=ce||!h;if(b)(()=>{let e=p();i.style.width=`${e.width}px`,i.style.height=`${e.height}px`})();else if(y&&!de)m(f(i,p(),r));else if(y){let r=Math.min(o.offsetWidth,o.offsetWidth>250?280:200);m(f(i,{width:r,height:o.offsetHeight>52?32:28},t)).finished.then(()=>{s||m(f(i,p(),{...e,bounce:de?.24:.15}))}).catch(()=>{})}else m(f(i,p(),{...e,duration:.25,bounce:.1}));m(f(o,{opacity:de?0:1,scale:de&&!ce?.8:1,filter:de&&!ce?"blur(8px)":"blur(0px)"},{duration:b?0:de?.15:.22,delay:b||de?0:.08,...de?{}:{ease:"easeOut"}}));for(let t of c){let r=t===u;for(let[n,i]of[...t.querySelectorAll(".morphing-menu__row")].entries())r&&y&&!b&&Object.assign(i.style,{opacity:"0",transform:"translateY(48px)",filter:"blur(4px)"}),m(f(i,{opacity:r?1:0,y:r||ce?0:16,filter:r||ce?"blur(0px)":"blur(2px)"},{...e,duration:b?0:r?y?.4:.25:.12,bounce:y?.3:0,delay:!b&&r?(y?.2:0)+.02*n:0}))}let v=[...(de?u:o)?.querySelectorAll("[data-menu-item]")??[]],k=ne.current;ne.current=null,k&&(te.current=!0,(("first"===k?v[0]:v.find(e=>e.dataset.menuItem===k))??(de?void 0:v.find(e=>"more"===e.dataset.menuItem)))?.focus({preventScroll:!0}),te.current=!1);let _=()=>R(e=>({...e}));return window.addEventListener("resize",_),()=>{s=!0,d.forEach(e=>e.stop()),window.removeEventListener("resize",_)}},[D,ce,g,l.length,ge]),L(()=>{if(!de)return;let e=new AbortController;return c(F.current,"pointerdown",e=>{e.target instanceof Node&&!e.composedPath().includes(F.current)&&_e(!1)},{signal:e.signal}),()=>e.abort()},[de]),L(()=>()=>{clearTimeout(ie.current),clearTimeout(oe.current)},[]);let Ne=P("button",{type:"button",className:"morphing-menu__row","data-menu-item":"close",onClick:()=>_e(!0,"more"),children:[j(w,{"aria-hidden":"true"}),j("span",{className:"morphing-menu__label",children:"Close menu"})]});return P("nav",{ref:F,"aria-label":v,className:["morphing-menu",T].filter(Boolean).join(" "),"data-view":D.kind,"data-edge":g,"data-vertical":Z,"data-align-end":y,style:{"--mm-count":me,"--mm-gaps":se.length-me,...E},onPointerMove:e=>{if(!re.current||"mouse"!==e.pointerType||!e.movementX&&!e.movementY)return;re.current=!1;let t=e.target instanceof Element?e.target.closest(".morphing-menu__shortcut"):null;t&&ve(t,l.find(e=>e.id===t.dataset.menuItem)??null)},onKeyDown:e=>{"Escape"===e.key&&(re.current=!0,be(),de&&(e.preventDefault(),e.stopPropagation(),"group"===D.kind?we():_e()))},onBlur:e=>{e.relatedTarget instanceof Node&&e.currentTarget.contains(e.relatedTarget)||(de?e.relatedTarget instanceof Node&&_e(!1):le.current||be())},children:[P("div",{ref:G,className:"morphing-menu__shell",children:[j("div",{ref:V,className:"morphing-menu__bar","aria-hidden":de,inert:de,onPointerEnter:e=>{"mouse"===e.pointerType&&(le.current=!0,clearTimeout(oe.current))},onPointerLeave:e=>{"mouse"===e.pointerType&&(le.current=!1,ye(),clearTimeout(oe.current),oe.current=setTimeout(()=>{ae.current=!1},300))},onKeyDown:e=>{let t={ArrowLeft:-1,ArrowUp:-1,ArrowRight:1,ArrowDown:1}[e.key],r=[...e.currentTarget.querySelectorAll("[data-menu-item]")],n=r.indexOf(e.target);n<0||e.altKey||e.ctrlKey||e.metaKey||e.shiftKey||!t&&"Home"!==e.key&&"End"!==e.key||(e.preventDefault(),r["Home"===e.key?0:"End"===e.key?r.length-1:(n+t+r.length)%r.length].focus({preventScroll:!0}))},children:se.map((e,t)=>"|"===e?j("span",{className:"morphing-menu__separator","aria-hidden":"true"},`separator-${t}`):"more"!==e?xe(l.find(t=>t.id===e),!0):j("button",{type:"button",className:"morphing-menu__shortcut","data-menu-item":"more","aria-label":_,"aria-expanded":de,"aria-controls":`${H}-main`,onClick:e=>ke({kind:"main"},"more",0===e.detail),onPointerEnter:e=>{"mouse"===e.pointerType&&ve(e.currentTarget,null)},onPointerLeave:ye,onPointerDown:be,onBlur:ye,onFocus:e=>{e.currentTarget.matches(":focus-visible")&&ve(e.currentTarget,null,!0)},children:j(k,{"aria-hidden":"true"})},"more"))}),P("div",{id:`${H}-main`,className:"morphing-menu__panel","aria-hidden":"main"!==D.kind,inert:"main"!==D.kind,children:[Ne,[...new Set(l.map(e=>e.group??""))].map(e=>P("section",{"aria-label":e||void 0,className:"morphing-menu__section",children:[e&&j("h3",{children:e}),[...l].filter(t=>(t.group??"")===e).sort((e,t)=>(e.expandedOrder??0)-(t.expandedOrder??0)).map(e=>xe(e,!1))]},e))]}),pe.map(e=>{let t="group"===D.kind&&D.id===e.id;return P("div",{id:`${H}-group-${e.id}`,className:"morphing-menu__panel","aria-label":e.label,"aria-hidden":!t,inert:!t,children:[P("button",{type:"button",className:"morphing-menu__row","data-menu-item":"back",onClick:we,children:[j(N,{"aria-hidden":"true"}),j("span",{children:x})]}),e.children.map(e=>xe(e,!1)),Ne]},e.id)})]}),X&&!de&&P("div",{ref:Y,className:"morphing-menu__tooltip","aria-hidden":"true",style:{left:X.x,top:X.y},children:[X.label,X.shortcut&&j(O,{shortcut:X.shortcut})]})]})}function I(){return j(E,{className:"morphing-menu__chevron","aria-hidden":"true"})}function W({label:e,icon:t,reduced:r,children:n}){let i=S(null),o=S(null);return C(()=>{let n=i.current,a=o.current;if(o.current={label:e,node:n.cloneNode(!0)},!a||a.label===e||r)return;let l=a.node;l.setAttribute("aria-hidden","true"),n.parentElement.append(l);let c={duration:200,easing:"cubic-bezier(.22,1,.36,1)"},u=n.animate([{opacity:0,transform:t?"scale(.7)":"translateY(4px)",filter:"blur(2px)"},{opacity:1,transform:"none",filter:"blur(0px)"}],c),d=l.animate([{opacity:1,transform:"none",filter:"blur(0px)"},{opacity:0,transform:t?"scale(.7)":"translateY(-4px)",filter:"blur(2px)"}],c);return d.finished.then(()=>l.remove()).catch(()=>{}),()=>{u.cancel(),d.cancel(),l.remove()}},[e,t,r]),j("span",{ref:i,style:{gridArea:"1 / 1",display:"flex",alignItems:"center"},children:n})}function O({shortcut:e}){let t=S(null);return C(()=>{t.current?.replaceChildren(l(e))},[e.label]),j("span",{ref:t})}function D(e){if("glyph"in e)return b("span",{style:{display:"contents"},dangerouslySetInnerHTML:{__html:s[e.glyph]}});let{user:t}=e,r=t&&d(t);return b("span",{className:"review-avatar"},t?u(t.name):D({glyph:"person"}),r&&b("img",{key:r,src:r,alt:"",referrerPolicy:"no-referrer",decoding:"async",onError:e=>{e.currentTarget.hidden=!0}}))}var R=e=>b(H,{...e,items:e.items.map(e=>({...e,icon:D(e.icon),children:e.children?.map(e=>({...e,icon:D(e.icon)}))}))});function z(e,t){e.replaceChildren();let r=g(e);return y(()=>r.render(R(t))),{render:e=>r.render(R(e)),unmount:()=>r.unmount()}}export{z as mountToolbar};

package/dist/typed-custom.d.ts

@@ -24,5 +24,5 @@ export declare function fontParts(value: string): FontParts | undefined;
 export declare function fontValue(font: FontParts): string;
 /** One step of a nudge: tenths for unitless numbers and font-relative units, else whole units. */
 export declare function nudged(value: string, steps: number): string;
-export declare const css = ".komo-custom{display:flex;flex:1;flex-direction:column;min-height:0}.komo-custom__body{display:grid;gap:8px;padding:8px;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}.komo-typed{display:grid;gap:6px;min-width:0}.komo-typed__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.komo-typed__field,.komo-typed__color,.komo-typed__menu{display:flex;align-items:center;box-sizing:border-box;width:100%;min-width:0;height:28px;border-radius:6px;background:#ffffff0a;box-shadow:none;color:#f1efeb;font:inherit;font-size:11px}.komo-typed__field:hover,.komo-typed__color:hover,.komo-typed__menu:hover{box-shadow:inset 0 0 0 1px #ffffff1c}.komo-typed__field:focus-within,.komo-typed__color:focus-visible,.komo-typed__menu:focus-visible{outline:0;box-shadow:inset 0 0 0 1px #bda6ef}.komo-typed__field>span{flex:none;display:grid;place-items:center;min-width:24px;height:100%;padding:0 2px 0 6px;color:#77736f;font-size:10px;font-weight:500;cursor:ew-resize;user-select:none;touch-action:none}.komo-typed__field>span:hover{color:#e9e6e1}.komo-typed__field>span svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.1}.komo-typed__field input{flex:1;width:100%;min-width:0;height:100%;margin:0;padding:0 2px;border:0;border-radius:0;outline:0;box-shadow:none;background:none;color:inherit;font:inherit;font-variant-numeric:tabular-nums}.komo-typed__field input:focus,.komo-typed__field input:focus-visible,.komo-typed__field select:focus,.komo-typed__field select:focus-visible{outline:0;box-shadow:none}.komo-typed__field select{flex:none;width:auto;max-width:44px;height:100%;margin:0;padding:0 8px 0 2px;border:0;border-radius:0 6px 6px 0;box-shadow:none;appearance:none;background:none;color:#77736f;font:inherit;font-size:10px;text-align:right;cursor:pointer}.komo-typed__field select:hover{color:#f1efeb}.komo-typed__menu{padding:0 20px 0 8px;border:0;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 7px center/8px no-repeat;cursor:pointer}.komo-typed [aria-invalid=true]{color:#f8a898}.komo-typed__layer{display:grid;gap:6px}.komo-typed__layer[data-hidden] .komo-typed__grid{opacity:.45}.komo-typed__row{display:flex;align-items:center;gap:4px;min-width:0}.komo-typed__row>.komo-typed__menu{flex:none;width:64px}.komo-typed__row>.komo-typed__color{flex:1;gap:6px;padding:0 6px}.komo-typed__color .komo-typed__alpha{flex:none;margin-left:auto;color:#898680;font-size:10px}.komo-typed button.komo-typed__icon{display:grid;place-items:center;flex:none;width:24px;padding:0}.komo-typed__icon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.komo-typed__tile{display:grid;place-items:center;height:56px;border-radius:6px;background:repeating-conic-gradient(#ffffff0a 0 25%,#ffffff04 0 50%) 0 0/12px 12px}.komo-typed__tile i{display:grid;place-items:center;width:32px;height:32px;border-radius:6px;background:#f1efeb;color:#f1efeb;font-style:normal;font-size:20px;font-weight:600}.komo-typed__tile i:not(:empty){width:auto;height:auto;background:none}.komo-typed__layer+.komo-typed__layer{padding-top:8px;border-top:1px solid #ffffff0d}.komo-typed__head{display:flex;align-items:center;gap:2px;min-height:24px}.komo-typed__head b{flex:1;color:#b5b1ab;font-size:10px;font-weight:500}.komo-typed button:not(.komo-typed__color,.komo-color *){height:24px;padding:0 8px;border:0;border-radius:5px;background:none;color:#898680;font:inherit;font-size:10px;cursor:pointer}.komo-typed button:not(.komo-typed__color,.komo-color *):hover{background:#ffffff14;color:#f1efeb}.komo-typed button[aria-pressed=true]{background:#bda6ef24;color:#e6dcfb}.komo-typed button:focus-visible{outline:1px solid #bda6ef;outline-offset:-1px}.komo-typed__color{gap:8px;padding:0 8px;border:0;justify-content:flex-start;text-align:left;font-variant-numeric:tabular-nums;cursor:pointer}.komo-typed__color i{flex:none;width:14px;height:14px;border-radius:3px;box-shadow:inset 0 0 0 1px #ffffff26;background:linear-gradient(var(--c),var(--c)),repeating-conic-gradient(#ffffff40 0 25%,#ffffff12 0 50%) 0 0/8px 8px}.komo-typed__color span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.komo-typed .komo-color{padding:0}.komo-typed__sample{display:flex;align-items:center;gap:8px;min-width:0;height:36px;padding:0 8px;border-radius:6px;background:#ffffff08}.komo-typed__sample b{flex:none;font-size:20px;font-weight:400}.komo-typed__sample span{overflow:hidden;color:#b5b1ab;text-overflow:ellipsis;white-space:nowrap}.komo-typed__hint{color:#898680;font-size:10px;line-height:1.5}.komo-custom .komo-typed__advanced>summary{display:flex;align-items:center;height:auto;min-height:24px;color:#77736f;font-size:10px;font-weight:500;list-style:none;cursor:pointer}.komo-typed__advanced>summary::-webkit-details-marker{display:none}.komo-custom .komo-typed__advanced>summary:hover{color:#e9e6e1}.komo-typed__advanced>summary:focus-visible{outline:1px solid #bda6ef;outline-offset:-1px;border-radius:4px}@media (max-width:520px){.komo-typed__font{grid-template-columns:minmax(0,1fr)}}@media (pointer:coarse){.komo-typed__field,.komo-typed__color,.komo-typed__menu{height:36px}.komo-typed button:not(.komo-typed__color,.komo-color *){height:32px}}";
+export declare const css = ".palette-custom{display:flex;flex:1;flex-direction:column;min-height:0}.palette-custom__body{display:grid;gap:8px;padding:8px;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}.palette-typed{display:grid;gap:6px;min-width:0}.palette-typed__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.palette-typed__field,.palette-typed__color,.palette-typed__menu{display:flex;align-items:center;box-sizing:border-box;width:100%;min-width:0;height:28px;border-radius:6px;background:#ffffff0a;box-shadow:none;color:#f1efeb;font:inherit;font-size:11px}.palette-typed__field:hover,.palette-typed__color:hover,.palette-typed__menu:hover{box-shadow:inset 0 0 0 1px #ffffff1c}.palette-typed__field:focus-within,.palette-typed__color:focus-visible,.palette-typed__menu:focus-visible{outline:0;box-shadow:inset 0 0 0 1px #bda6ef}.palette-typed__field>span{flex:none;display:grid;place-items:center;min-width:24px;height:100%;padding:0 2px 0 6px;color:#77736f;font-size:10px;font-weight:500;cursor:ew-resize;user-select:none;touch-action:none}.palette-typed__field>span:hover{color:#e9e6e1}.palette-typed__field>span svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.1}.palette-typed__field input{flex:1;width:100%;min-width:0;height:100%;margin:0;padding:0 2px;border:0;border-radius:0;outline:0;box-shadow:none;background:none;color:inherit;font:inherit;font-variant-numeric:tabular-nums}.palette-typed__field input:focus,.palette-typed__field input:focus-visible,.palette-typed__field select:focus,.palette-typed__field select:focus-visible{outline:0;box-shadow:none}.palette-typed__field select{flex:none;width:auto;max-width:44px;height:100%;margin:0;padding:0 8px 0 2px;border:0;border-radius:0 6px 6px 0;box-shadow:none;appearance:none;background:none;color:#77736f;font:inherit;font-size:10px;text-align:right;cursor:pointer}.palette-typed__field select:hover{color:#f1efeb}.palette-typed__menu{padding:0 20px 0 8px;border:0;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 7px center/8px no-repeat;cursor:pointer}.palette-typed [aria-invalid=true]{color:#f8a898}.palette-typed__layer{display:grid;gap:6px}.palette-typed__layer[data-hidden] .palette-typed__grid{opacity:.45}.palette-typed__row{display:flex;align-items:center;gap:4px;min-width:0}.palette-typed__row>.palette-typed__menu{flex:none;width:64px}.palette-typed__row>.palette-typed__color{flex:1;gap:6px;padding:0 6px}.palette-typed__color .palette-typed__alpha{flex:none;margin-left:auto;color:#898680;font-size:10px}.palette-typed button.palette-typed__icon{display:grid;place-items:center;flex:none;width:24px;padding:0}.palette-typed__icon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.palette-typed__tile{display:grid;place-items:center;height:56px;border-radius:6px;background:repeating-conic-gradient(#ffffff0a 0 25%,#ffffff04 0 50%) 0 0/12px 12px}.palette-typed__tile i{display:grid;place-items:center;width:32px;height:32px;border-radius:6px;background:#f1efeb;color:#f1efeb;font-style:normal;font-size:20px;font-weight:600}.palette-typed__tile i:not(:empty){width:auto;height:auto;background:none}.palette-typed__layer+.palette-typed__layer{padding-top:8px;border-top:1px solid #ffffff0d}.palette-typed__head{display:flex;align-items:center;gap:2px;min-height:24px}.palette-typed__head b{flex:1;color:#b5b1ab;font-size:10px;font-weight:500}.palette-typed button:not(.palette-typed__color,.palette-color *){height:24px;padding:0 8px;border:0;border-radius:5px;background:none;color:#898680;font:inherit;font-size:10px;cursor:pointer}.palette-typed button:not(.palette-typed__color,.palette-color *):hover{background:#ffffff14;color:#f1efeb}.palette-typed button[aria-pressed=true]{background:#bda6ef24;color:#e6dcfb}.palette-typed button:focus-visible{outline:1px solid #bda6ef;outline-offset:-1px}.palette-typed__color{gap:8px;padding:0 8px;border:0;justify-content:flex-start;text-align:left;font-variant-numeric:tabular-nums;cursor:pointer}.palette-typed__color i{flex:none;width:14px;height:14px;border-radius:3px;box-shadow:inset 0 0 0 1px #ffffff26;background:linear-gradient(var(--c),var(--c)),repeating-conic-gradient(#ffffff40 0 25%,#ffffff12 0 50%) 0 0/8px 8px}.palette-typed__color span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.palette-typed .palette-color{padding:0}.palette-typed__sample{display:flex;align-items:center;gap:8px;min-width:0;height:36px;padding:0 8px;border-radius:6px;background:#ffffff08}.palette-typed__sample b{flex:none;font-size:20px;font-weight:400}.palette-typed__sample span{overflow:hidden;color:#b5b1ab;text-overflow:ellipsis;white-space:nowrap}.palette-typed__hint{color:#898680;font-size:10px;line-height:1.5}.palette-custom .palette-typed__advanced>summary{display:flex;align-items:center;height:auto;min-height:24px;color:#77736f;font-size:10px;font-weight:500;list-style:none;cursor:pointer}.palette-typed__advanced>summary::-webkit-details-marker{display:none}.palette-custom .palette-typed__advanced>summary:hover{color:#e9e6e1}.palette-typed__advanced>summary:focus-visible{outline:1px solid #bda6ef;outline-offset:-1px;border-radius:4px}@media (max-width:520px){.palette-typed__font{grid-template-columns:minmax(0,1fr)}}@media (pointer:coarse){.palette-typed__field,.palette-typed__color,.palette-typed__menu{height:36px}.palette-typed button:not(.palette-typed__color,.palette-color *){height:32px}}";
 export declare function typedCustom(body: HTMLElement, property: string, initial: string, exact: HTMLInputElement, send: (value: string, keep: boolean) => boolean, field?: Field, tokens?: readonly DesignToken[], hover?: (value?: string) => void): (next: string, quiet?: boolean) => void;

package/dist/types.d.ts

@@ -340,7 +340,7 @@ export interface CommentsOptions {
     /**
      * Save an image and/or trimmed HTML of the commented element with each new
      * thread, e.g. { image: true, html: true }. Off by default. Palette's own UI is
-     * never captured, nor is anything inside an element with data-komo-no-snapshot.
+     * never captured, nor is anything inside an element with data-palette-no-snapshot (or the older data-komo-no-snapshot).
      */
     snapshots?: PaletteSnapshots;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hazem3500/palette",
-  "version": "0.9.108",
+  "version": "0.9.110",
   "description": "Point, area, and threaded comments for website branches.",
   "type": "module",
   "license": "MIT",

package/server/account-page.ts

@@ -72,7 +72,7 @@ input[type=text],select{min-height:44px;padding:0 12px;border-radius:10px;border
 const script = `
 const cfg=JSON.parse(document.getElementById("cfg").textContent);
 const $=(s)=>document.querySelector(s);
-const KEY="komo-account-session";
+const KEY="palette-account-session",OLD="komo-account-session";
 let session=null,user=null,data=null;
 const el=(tag,props,...kids)=>{const n=document.createElement(tag);for(const k in props||{}){if(k==="class")n.className=props[k];else if(k.startsWith("on"))n.addEventListener(k.slice(2),props[k]);else if(props[k]===true)n.setAttribute(k,"");else if(props[k]!==false&&props[k]!=null)n.setAttribute(k,props[k])}n.append(...kids.flat().filter((x)=>x!=null));return n};
 const live=(t)=>{$("#live").textContent="";setTimeout(()=>{$("#live").textContent=t},30)};
@@ -109,13 +109,13 @@ async function load(){
   try{data=await api("/account/tokens");list()}
   catch(e){if(e.status===403)view("guest");else if(e.status!==401){$("#list").replaceChildren(el("li",{class:"panel notice error"},e.message))}}}
 async function boot(){
-  session=sessionStorage.getItem(KEY);
+  session=sessionStorage.getItem(KEY)??sessionStorage.getItem(OLD);if(session)sessionStorage.setItem(KEY,session);sessionStorage.removeItem(OLD);
   if(!session){render();return}
   view("loading");
   try{user=(await api("/me")).user;render();await load()}catch(e){if(e.status!==401){view("signin");$("#signin-error").textContent=e.message}}}
 async function signIn(){
   const btn=$("#signin");btn.disabled=true;$("#signin-error").textContent="";
-  const popup=window.open("about:blank","komo-account-auth","width=500,height=700");
+  const popup=window.open("about:blank","palette-account-auth","width=500,height=700");
   try{
     const {url}=await api("/auth/google/start","POST");
     if(!popup){throw new Error("Allow pop-ups to sign in with Google.")}
@@ -183,13 +183,13 @@ export function accountPage(env: Env, url: URL) {
   const requested = url.searchParams.get("project");
   // Hosted sign-in uses the management project; self-hosted servers use one of their own.
   const project =
-    env.KOMO_HOSTED === "true"
+    env.PALETTE_HOSTED === "true"
       ? "_komo"
       : requested && configured.includes(requested)
         ? requested
         : (configured[0] ?? "_komo");
   const config = JSON.stringify({
-    base: env.KOMO_PUBLIC_PATH ?? "",
+    base: env.PALETTE_PUBLIC_PATH ?? "",
     project,
   }).replace(/</g, "\\u003c");
   return new Response(
@@ -201,7 +201,7 @@ export function accountPage(env: Env, url: URL) {
 <section id="v-signin" hidden><h1>Access tokens</h1><p class="lede">Sign in with Google to create tokens that let bots and CI use the palette CLI as you.</p><p><button class="btn primary" id="signin" type="button">Continue with Google</button></p><p class="error-text" id="signin-error" role="alert"></p></section>
 <section id="v-guest" hidden><h1>Access tokens</h1><div class="panel notice"><strong>Sign in with Google to manage tokens</strong><span>Guest sessions can’t create access tokens, because a token would carry an identity that can’t be verified.</span></div><p><button class="btn" id="guest-out" type="button">Sign out</button></p></section>
 <section id="v-tokens" hidden>
-<div class="bar"><div><h1>Access tokens</h1><p class="lede">Use a token as <code class="mono">KOMO_TOKEN</code> so bots and CI can read or write comments as you. Treat tokens like passwords.</p></div><button class="btn primary" id="new" type="button">New token</button></div>
+<div class="bar"><div><h1>Access tokens</h1><p class="lede">Use a token as <code class="mono">PALETTE_TOKEN</code> so bots and CI can read or write comments as you. Treat tokens like passwords.</p></div><button class="btn primary" id="new" type="button">New token</button></div>
 <ul class="tokens" id="list" aria-label="Your access tokens"></ul>
 <div class="panel notice" id="empty" hidden><strong>No tokens yet</strong>Create one for a bot, a script, or a CI job.</div>
 </section>

package/server/iap.ts

@@ -1,4 +1,4 @@
-// Google Cloud Identity-Aware Proxy (KOMO_PROXY_AUTH=gcp-iap). IAP signs every
+// Google Cloud Identity-Aware Proxy (PALETTE_PROXY_AUTH=gcp-iap). IAP signs every
 // request it forwards with an ES256 JWT in x-goog-iap-jwt-assertion; its
 // subject is the numeric Google account id that Google OAuth also uses.
 import type { ProxyAuthProvider, ProxyIdentity } from "./proxy-auth";
@@ -155,7 +155,7 @@ export async function iapIdentity(
 export function gcpIap(audience: string): ProxyAuthProvider {
   if (!/^\/projects\/\d+\/[A-Za-z0-9/_-]+$/.test(audience))
     throw new ConfigError(
-      "KOMO_PROXY_AUDIENCE must be the IAP audience, such as /projects/PROJECT_NUMBER/global/backendServices/SERVICE_ID.",
+      "PALETTE_PROXY_AUDIENCE must be the IAP audience, such as /projects/PROJECT_NUMBER/global/backendServices/SERVICE_ID.",
     );
   return {
     name: "gcp-iap",