staffa 0.8.1 → 0.9.0

package/dist/staffa.esm.js

@@ -1 +1 @@
-import S from"aberdeen";var ce="staffa:darkMode",xe=S.proxy({value:Re()});function Re(){try{let e=localStorage.getItem(ce);if(e==="dark")return!0;if(e==="light")return!1}catch{}}function ze(e){xe.value=e;try{e===void 0?localStorage.removeItem(ce):localStorage.setItem(ce,e?"dark":"light")}catch{}}function we(e=!1){let t=xe.value;return t===void 0&&!e?S.darkMode():t}S(()=>{we()?S.insertGlobalCss({":root, .s-s.neutral":"--s-bg:#0e0f12 --s-text:#e9eaec",".s-s.neutral":"--s-bg:#191b1f --s-text:#e9eaec",".s-s.neutral .s-s.neutral":"--s-bg:#23262b"}):S.insertGlobalCss({":root, .s-s.neutral":"--s-bg:#eef0f3 --s-text:#1d1f24",".s-s.neutral, .s-s.neutral":"--s-bg:#ffffff --s-text:#1d1f24",".s-s.neutral .s-s.neutral":"--s-bg:#f6f7f9"})});S.setSpacingCssVars(1.1);S.insertGlobalCss({"*, *::before, *::after":"box-sizing:border-box",html:"text-size-adjust:100%",body:"m:0 p:$3 line-height:1.5 font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; -webkit-font-smoothing:antialiased background-color:$s-bg text:$s-text",a:"color: $s-link-fg; text-decoration:underline text-underline-offset:2px; transition: color 0.12s, filter 0.12s;","a:hover":"filter: brightness(1.15)","input, button, textarea, select, optgroup":"font:inherit color:inherit","input:where(:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=image],[type=submit],[type=button],[type=reset],[type=hidden])), textarea, select":"background:$s-bg border: 1px solid $s-faint; r:$s-radius-sm padding: 0.45em 0.65em; max-width:100%","input:where([type=checkbox],[type=radio])":"width:1.15em height:1.15em cursor:pointer","input[type=range]":"appearance:none background:transparent cursor:pointer vertical-align:middle","input[type=range]::-webkit-slider-runnable-track":"height:4px r:99px background:$s-faint","input[type=range]::-moz-range-track":"height:4px r:99px background:$s-faint","input[type=range]::-moz-range-progress":"height:4px r:99px background:$s-accent","input[type=range]::-webkit-slider-thumb":"appearance:none width:16px height:16px margin-top:-6px r:50% background:$s-accent","input[type=range]::-moz-range-thumb":"width:16px height:16px border:0 r:50% background:$s-accent","input[type=file]":"cursor:pointer",progress:"appearance:none border:0 height:6px r:99px background:$s-faint overflow:hidden vertical-align:middle","progress::-webkit-progress-bar":"background:$s-faint r:99px","progress::-webkit-progress-value":"background:$s-accent r:99px","progress::-moz-progress-bar":"background:$s-accent r:99px",meter:"vertical-align:middle",fieldset:"border: 1px solid $s-faint; r:$s-radius-sm padding:$2 min-width:0",legend:"padding: 0 $1; font-weight:600","code, kbd, samp, pre":"font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;",code:"background: color-mix(in oklab, $s-text, $s-bg 86%); padding: 0.12em 0.34em; r:4px font-size:0.9em",pre:"background: color-mix(in oklab, $s-text, $s-bg 92%); p:$3 r: $s-radius; overflow:auto","pre code":"background:transparent p:0","img, svg, video, canvas":"max-width:100% h:auto",hr:"border:0 border-top: 1px solid $s-faint;","::placeholder":"color: $s-muted; opacity:1",":focus-visible":"outline: 2px solid $s-focus; outline-offset:2px",small:"color:$s-muted font-size:0.9em","@media (prefers-reduced-motion: reduce)":{"*, *::before, *::after":"transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; scroll-behavior: auto !important;"},":root":"--s-primary:#00a884 --s-danger:#dc5b41 --s-success:#00a884 --s-warning:#ef6b00 --s-link:#3f8cd8 --s-radius-sm:6px --s-radius:12px --s-radius-lg:18px --s-focus: color-mix(in srgb, $s-primary 38%, transparent); --s-gradient: linear-gradient(135deg, color-mix(in oklab, $s-primary, white 16%), color-mix(in oklab, $s-primary, black 14%));",":root, .s-s.neutral":"--s-accent:$s-primary --s-link-fg:$s-link",".s-s:not(.neutral)":"--s-bg:$s-primary border:0 --s-text:#eee --s-accent:#fff --s-link-fg:#eef --s-muted: color-mix(in srgb, #fff 70%, transparent); --s-faint: color-mix(in srgb, #fff 30%, transparent);",".s-s.danger":"--s-bg:$s-danger",".s-s.success":"--s-bg:$s-success",".s-s.warning":"--s-bg:$s-warning",".s-s.link":"--s-bg:$s-link",".s-s.primary":"--s-bg:$s-primary",":root, .s-s":"--s-muted: color-mix(in oklab, $s-text, $s-bg 42%); --s-faint: color-mix(in oklab, $s-text, $s-bg 80%); color:$s-text accent-color:$s-accent scrollbar-width:thin scrollbar-color: $s-faint transparent;",".s-s, body":"background: linear-gradient(170deg, color-mix(in oklab, $s-bg, white 9%), color-mix(in oklab, $s-bg, black 9%));",".s-s":"r:$s-radius",":where(.s-s.neutral)":"border: 1px solid $s-faint;",".s-s::-webkit-scrollbar, .s-s ::-webkit-scrollbar":"width:10px height:10px",".s-s::-webkit-scrollbar-track, .s-s ::-webkit-scrollbar-track":"background:transparent",".s-s::-webkit-scrollbar-thumb, .s-s ::-webkit-scrollbar-thumb":"background:$s-faint border-radius:99px border: 2px solid transparent; background-clip:padding-box",".s-s.shadow.neutral:not(.s-btn)":"box-shadow: 0 4px 14px rgba(0,0,0,0.13);",".s-s.extra-shadow.neutral:not(.s-btn)":"box-shadow: 0 18px 50px rgba(0,0,0,0.28);",".s-s.shadow:not(.neutral):not(.tonal):not(.outlined)":"box-shadow: 0 4px 14px color-mix(in srgb, $s-bg 30%, transparent);",".s-s.extra-shadow:not(.neutral):not(.tonal):not(.outlined)":"box-shadow: 0 14px 40px color-mix(in srgb, $s-bg 40%, transparent);",".s-s.no-shadow":"box-shadow: none !important;",".s-s:not(.neutral).tonal, .s-s:not(.neutral).outlined":"--s-text:$s-bg --s-accent:$s-bg --s-link-fg:$s-bg --s-faint: color-mix(in srgb, $s-bg 30%, transparent); --s-muted: color-mix(in srgb, $s-bg 70%, transparent);",".s-s:not(.neutral).tonal":"background: color-mix(in srgb, $s-bg 15%, transparent); border: 1px solid $s-faint;",".s-s:not(.neutral).outlined":"background: transparent; border: 1px solid color-mix(in srgb, $s-bg 45%, transparent);",".s-s:not(.neutral) .s-s.tonal, .s-s:not(.neutral) .s-s.outlined":"--s-text:#fff --s-accent:#fff --s-link-fg:#fff background: linear-gradient(170deg, color-mix(in oklab, $s-bg, white 9%), color-mix(in oklab, $s-bg, black 9%)); border-color: transparent;"});S.insertGlobalCss({".s-preload, .s-preload *, .s-preload *::before, .s-preload *::after":"transition: none !important; animation: none !important;"});if(typeof document<"u"&&typeof requestAnimationFrame=="function"){let e=document.documentElement;e.classList.add("s-preload"),requestAnimationFrame(()=>requestAnimationFrame(()=>e.classList.remove("s-preload")))}S.insertGlobalCss({":disabled, [aria-disabled=true]":"opacity:0.45 filter:saturate(0.6) user-select:none",":disabled, [aria-disabled=true], :disabled *, [aria-disabled=true] *":"pointer-events:none cursor:not-allowed"});var Fe="p, ul, ol, dl, blockquote, pre, table, figure, hr, h1, h2, h3, h4, h5, h6";S.insertGlobalCss({[`${Fe}`]:{"&":"margin:0","&:not(:first-child)":"margin-top:$3"},"h1, h2, h3, h4, h5, h6":{"&":"line-height:1.15 font-weight:700 text-wrap:balance","&:not(:first-child)":"margin-top:1.4em"},h1:"font-size:2em font-weight:800 letter-spacing:-0.022em",h2:"font-size:1.55em letter-spacing:-0.018em",h3:"font-size:1.3em letter-spacing:-0.011em",h4:"font-size:1.1em",h5:"font-size:0.95em letter-spacing:0.005em",h6:"font-size:0.8em fg:$s-muted text-transform:uppercase letter-spacing:0.07em","ul, ol":{"&":"padding-left:1.5em","> li:not(:first-child), li > &:not(:first-child)":"margin-top:$1"},blockquote:"border-left: 3px solid $s-faint; padding-left: $3; fg: $s-muted",table:"border-collapse:collapse","th, td":"text-align:left padding: $1 $2; border-bottom: 1px solid $s-faint; vertical-align:top",th:"font-weight:600","thead th":"border-bottom: 2px solid $s-faint;",dt:"font-weight:600",dd:"margin-left: 1.5em",figcaption:"fg:$s-muted font-size:0.9em margin-top:$1 text-align:center"});import l from"aberdeen";import $e from"aberdeen";var X=640,Ie=0;function F(e="s"){return`${e}-${++Ie}`}function f(e,...t){e!=null&&(typeof e=="function"?e(...t):$e("rich=",e))}var qe="a[href], button, input, select, textarea, [tabindex]";function U(e,t){let n=o=>o instanceof HTMLElement&&!o.hasAttribute("disabled")&&o.getAttribute("aria-disabled")!=="true"&&o.tabIndex>=0&&o.getClientRects().length>0,i=(t?[...e.querySelectorAll(t)].find(n):void 0)??[...e.querySelectorAll(qe)].find(n);return i?.focus(),i!=null}function I(e){queueMicrotask(()=>$e(e))}import E from"aberdeen";E.insertGlobalCss({".s-field":{"&":"display:flex flex-direction:column gap:$1","> label":"font-weight:600 font-size:0.9em fg:$s-text user-select:none"},".s-req":"fg:$s-danger margin-left:2px",".s-help":"font-size:0.82em fg:$s-muted",".s-error":"font-size:0.82em fg:$s-danger",".s-input":{"&":"w:100% background: color-mix(in oklab, $s-bg, $s-text 4%); color:$s-text border: 1px solid $s-faint; r:$s-radius padding: 0.55em 0.7em; transition: border-color 0.15s, box-shadow 0.15s;","&:hover:not(:disabled)":"border-color: color-mix(in oklab, $s-text, $s-bg 55%);","&:focus-visible":"border-color:$s-accent box-shadow: 0 0 0 3px $s-focus; outline:none","&[aria-invalid=true]":"border-color:$s-danger"}});function q(e,t){let n=e.id??F("field"),i=()=>!!e.error;E("div.s-field",e.attrs,()=>{E(()=>{e.label!=null&&E(`label for=${n}`,()=>{f(e.label),e.required&&E("span.s-req aria-hidden=true #*")})}),t(n,i),E(()=>{e.help!=null&&!e.error&&E("div.s-help",()=>f(e.help))}),E(()=>{e.error&&E("div.s-error role=alert #",e.error)})})}function V(e,t,n,i){E(`id=${t}`),e.name&&E(`name=${e.name}`),E(()=>{e.disabled&&E("disabled=true")}),E(()=>{e.required&&E("aria-required=true")}),E(()=>E("aria-invalid=",n()?"true":"false")),i&&E("bind=",i)}l.insertGlobalCss({".s-ac":{"&":"position:relative","> .s-control":"display:flex flex-wrap:wrap align-items:center gap:$1 background: color-mix(in oklab, $s-bg, $s-text 4%); color:$s-text border: 1px solid $s-faint; r:$s-radius padding: 0.3em 0.4em; cursor:text; transition: border-color 0.15s, box-shadow 0.15s;","> .s-control:hover":"border-color: color-mix(in oklab, $s-text, $s-bg 55%);","> .s-control:focus-within":"border-color:$s-accent box-shadow: 0 0 0 3px $s-focus;","&[aria-invalid=true] > .s-control":"border-color:$s-danger",".s-chip":"display:inline-flex align-items:center gap:$1 font-size:0.85em background: color-mix(in oklab, $s-bg, $s-text 10%); border: 1px solid $s-faint; r:$s-radius padding: 0.1em 0.2em 0.1em 0.5em;",".s-chip > button":"cursor:pointer border:0 background:transparent fg:$s-muted font-size:1.1em line-height:1 padding: 0 0.2em; r:4px",".s-chip > button:hover":"fg:$s-text background:$s-faint",input:"flex:1 min-width:6ch border:0 background:transparent color:inherit outline:none padding:0.25em","> .s-menu":"position:absolute top:100% left:0 right:0 z-index:20 margin-top:4px max-height:15rem overflow-y:auto list-style:none p:$1 margin-bottom:0","> .s-menu li":"margin:0",".s-option":"padding: 0.45em 0.6em; r:6px cursor:pointer transition: background 0.1s;",".s-option[aria-selected=true]":"background: color-mix(in srgb, $s-text 10%, transparent);",".s-add":"fg:$s-accent font-style:italic",".s-empty":"padding: 0.45em 0.6em; fg:$s-muted"}});function Be(e){return typeof e=="string"?{value:e,label:e}:{value:e.value,label:e.label??e.value}}function De(e){let t=F("ac-menu"),n=l.proxy({query:"",open:!1,active:0}),i=()=>(typeof e.options=="function"?e.options():e.options).map(Be),o=()=>{let p=e.bind?.value;return p==null||p===""?[]:Array.isArray(p)?p:[p]},r=p=>i().find(v=>v.value===p)?.label??p;if(!e.multi){let p=e.bind?l.peek(e.bind,"value"):void 0;typeof p=="string"&&p&&(n.query=l.peek(()=>r(p)))}let s=()=>{let p=new Set(o()),v=i();e.multi&&(v=v.filter(m=>!p.has(m.value)));let c=n.query.trim().toLowerCase();return c&&(v=v.filter(m=>m.label.toLowerCase().includes(c))),v},a=(p,v)=>{if(e.multi){let c=Array.isArray(e.bind?.value)?[...e.bind.value]:[];c.includes(p)||c.push(p),e.bind&&(e.bind.value=c),n.query=""}else e.bind&&(e.bind.value=p),n.query=r(p),n.open=!1;n.active=0,v?.focus()},d=p=>{if(!e.bind)return;let v=e.bind.value??[];e.bind.value=v.filter(c=>c!==p)};q(e,(p,v)=>{l("div.s-ac",e.inputAttrs,()=>{l(()=>l("aria-invalid=",v()?"true":"false"));let c;l("div.s-control",()=>{l("click=",()=>c?.focus()),l(()=>{if(e.multi)for(let m of o())l("span.s-chip",()=>{l("span #",l.peek(()=>r(m))),l("button type=button aria-label=",`Remove ${m}`,()=>{l("#\xD7"),l("click=",y=>{y.stopPropagation(),d(m),c?.focus()})})})}),c=l("input type=text role=combobox autocomplete=off",()=>{l(`id=${p} aria-controls=${t} aria-autocomplete=list`),e.placeholder!=null&&l("placeholder=",e.placeholder),e.disabled&&l("disabled=true"),e.required&&l("aria-required=true"),l("bind=",l.ref(n,"query")),l(()=>l("aria-expanded=",n.open?"true":"false")),l(()=>{let y=s()[n.active];l("aria-activedescendant=",n.open&&y?`${t}-opt-${n.active}`:"")}),l("input=",()=>{n.open=!0,n.active=0}),l("focus=",()=>{n.open=!0}),l("blur=",()=>{setTimeout(()=>T(),150)}),l("keydown=",m=>g(m,c))})}),l(()=>{if(!n.open)return;let m=s(),y=n.query.trim(),z=e.allowCustom!==!1&&y!==""&&!m.some(_=>_.label.toLowerCase()===y.toLowerCase());l("ul.s-menu.s-s.neutral.shadow role=listbox",`id=${t}`,()=>{m.forEach((_,de)=>{l("li.s-option role=option",`id=${t}-opt-${de}`,()=>{l(()=>l("aria-selected=",n.active===de?"true":"false")),l("#",_.label),l("mousedown=",He=>He.preventDefault()),l("click=",()=>a(_.value,c)),l("mousemove=",()=>{n.active=de})})}),z&&l("li.s-option.s-add role=option",()=>{l("#",`Add "${y}"`),l("mousedown=",_=>_.preventDefault()),l("click=",()=>a(y,c))}),m.length===0&&!z&&l("li.s-empty #No matches")})}),l(()=>{if(e.name)if(e.multi)for(let m of o())l("input type=hidden",()=>{l("name=",e.name),l("value=",m)});else l("input type=hidden",()=>{l("name=",e.name),l("value=",o()[0]??"")})})})});function g(p,v){let c=s(),m=c.length-1;if(p.key==="ArrowDown")p.preventDefault(),n.open=!0,n.active=Math.min(m,n.active+1);else if(p.key==="ArrowUp")p.preventDefault(),n.active=Math.max(0,n.active-1);else if(p.key==="Enter"){p.preventDefault();let y=c[n.active];y?a(y.value,v):e.allowCustom!==!1&&n.query.trim()?a(n.query.trim(),v):n.open&&(n.open=!1)}else if(p.key==="Escape")n.open&&(p.preventDefault(),n.open=!1,e.multi||(n.query=r(o()[0]??"")));else if(p.key==="Backspace"&&e.multi&&n.query===""){let y=o();y.length&&d(y[y.length-1])}}function T(){n.open=!1,e.multi?n.query="":e.allowCustom!==!1&&n.query.trim()?a(n.query.trim()):n.query=r(o()[0]??"")}}import C from"aberdeen";import h from"aberdeen";import*as $ from"aberdeen/route";var pe={integer(e){if(!/^(0|-?[1-9]\d*)$/.test(e))return;let t=Number(e);return Number.isSafeInteger(t)?t:void 0}};function J(e){let t=String(e).replace(/\/+$/,"");return t.startsWith("/")||(t=`/${t}`),t}function oe(e){let t=J(e);return t==="/"?[]:t.slice(1).split("/")}function Ge(e,t){let n=oe(e),i=n.map((o,r)=>{if(!o.startsWith("[")||!o.endsWith("]"))return{kind:"lit",value:o};let s=/^\[\.\.\.([A-Za-z_$][\w$]*)\]$/.exec(o);if(s){if(r!==n.length-1)throw new Error(`Staffa: "${o}" must be the last segment of route "${e}"`);return{kind:"rest",name:s[1]}}let a=/^\[([A-Za-z_$][\w$]*)(?:=([A-Za-z_$][\w$]*))?\]$/.exec(o);if(!a)throw new Error(`Staffa: malformed param "${o}" in route "${e}"`);let[,d,g]=a;if(g&&!(g in pe))throw new Error(`Staffa: unknown matcher "${g}" in route "${e}" (known: ${Object.keys(pe).join(", ")})`);return{kind:"param",name:d,matcher:g}});return{key:e,segs:i,draw:t}}function je(e){try{return decodeURIComponent(e)}catch{return e}}function ke(e,t){let n={};for(let i=0;i<e.segs.length;i++){let o=e.segs[i];if(o.kind==="rest")return i>=t.length?null:(n[o.name]=t.slice(i).join("/"),n);if(i>=t.length)return null;let r=t[i];if(o.kind==="lit"){if(r!==o.value)return null}else if(o.matcher){let s=pe[o.matcher](r);if(s===void 0)return null;n[o.name]=s}else n[o.name]=je(r)}return e.segs.length===t.length?n:null}var Ae=450,We=300,Ke=1280,ie=24,Ne=360,Ee=2;h.insertGlobalCss({":root":`--s-panel-ms:${Ae}ms`,".s-panels":"flex:1 min-width:0 min-height:0 position:relative overflow:hidden isolation:isolate",".s-panel":{"&":"position:absolute top:0 bottom:0 left:0 display:flex flex-direction:column visibility:visible transition: left var(--s-panel-ms) ease, transform var(--s-panel-ms) ease-out, opacity var(--s-panel-ms) linear, visibility 0s;","> .s-content":"flex:1 min-height:0 overflow-y:auto overflow-x:hidden p:$3","> .s-content.s-scroll-y":"margin-right:$3","&.s-panel-sep::before":`content:'' position:absolute left:-${ie/2}px top:0.6rem bottom:0.6rem width:1px background: linear-gradient(to bottom, transparent, $s-faint 18%, $s-faint 82%, transparent);`,"&.s-panel-enter":"opacity:0 transition:none transform: translateX(8cqw);","&.s-panel-closing":"opacity:0 pointer-events:none transform: translateX(8cqw);","&.s-panel-hidden":"opacity:0 visibility:hidden transform: translateX(-8cqw); transition: left var(--s-panel-ms) ease, transform var(--s-panel-ms) ease-out, opacity var(--s-panel-ms) linear, visibility var(--s-panel-ms);"},".s-main.s-shell-snap .s-panel":"transition:none",[`@container (max-width: ${X}px)`]:{".s-panel > .s-content.s-scroll-y":"margin-right:0"},".s-panel-loading":{"&":"position:absolute inset:0 display:flex align-items:center justify-content:center gap:$1 pointer-events:none",i:"width:0.5rem height:0.5rem r:50% background:$s-muted opacity:0.45 animation: s-panel-pulse 1s ease-in-out infinite;","i:nth-child(2)":"animation-delay:0.15s","i:nth-child(3)":"animation-delay:0.3s"},"@keyframes s-panel-pulse":{"0%, 100%":"opacity:0.25 transform:scale(0.8)","50%":"opacity:0.7 transform:scale(1)"}});var L=null,re=class{compiled;opts;live=[];byId=new Map;nextId=1;$ids=h.proxy({});$state=h.proxy({paths:[],topId:0});containerEl;geom;lastBodyW=-1;layoutQueued=!1;timers=new Set;constructor(t){if(L)throw new Error("Staffa: only one routed S.main() (one with `routes`) can be active at a time");L=this,this.opts=t,this.compiled=Object.entries(t.routes).map(([i,o])=>Ge(i,o));let n=$.setGuard((i,o)=>{let r=n?n(i,o):!0;return r===!1?!1:r===!0?this.checkChange(i):r.then(s=>s===!1?!1:this.checkChange(i))});h(()=>{let i=this.computeTarget();h.peek(()=>this.propose(i))}),this.interceptLinks(),this.watchTitle(),h.clean(()=>{for(let i of this.timers)clearTimeout(i);this.timers.clear(),$.setGuard(n),L===this&&(L=null)})}resolve(t){let n=oe(t);for(let i of this.compiled){let o=ke(i,n);if(o)return{draw:i.draw,params:o}}return{draw:this.opts.notFound??Ve,params:{}}}matches(t){let n=oe(t);return this.compiled.some(i=>ke(i,n)!=null)}deriveStack(t){let n=oe(t),i=[];for(let o=1;o<n.length;o++){let r="/"+n.slice(0,o).join("/");this.matches(r)&&i.push(r)}return i.push(J(t)),i}targetFor(t,n){return Array.isArray(n)?n.map(String).concat(J(t)):this.deriveStack(t)}computeTarget(){return this.targetFor($.current.path,$.current.state.panels)}checkChange(t){let n=this.removedBy(this.targetFor(t.path,t.state.panels));return n.length?Xe(n):!0}paths(){return this.live.map(t=>t.path)}removedBy(t){return this.live.filter(n=>!t.includes(n.path))}propose(t){Ue(this.paths(),t)||this.commit(t,h.peek($.current,"nav"))}commit(t,n){this.geom=void 0;let i=new Map(this.live.map(r=>[r.path,r])),o=[];for(let r of t){let s=i.get(r);if(s){i.delete(r),o.push(s);continue}let a=this.createEntry(r,o.length);n!=="load"&&n!=="back"&&(a.enter=!0),o.push(a),this.byId.set(a.id,a)}for(let r of i.values())this.beginClose(r);this.live=o,h.merge(this.$state,{paths:this.paths(),topId:this.live.length?this.live[this.live.length-1].id:0});for(let r of this.live)this.$ids[String(r.id)]=r.order;this.scheduleLayout()}createEntry(t,n){let{draw:i,params:o}=this.resolve(t),r={id:this.nextId++,order:n,path:t,draw:i,$ui:h.proxy({holding:!1}),layout:"medium",width:0};return r.$page=h.proxy({params:o,path:t,close:()=>this.closePanelAt(this.live.indexOf(r))}),r}beginClose(t){t.closing=!0,t.el&&(t.el.style.zIndex=String(Ee*this.live.indexOf(t))),this.byId.delete(t.id),delete this.$ids[String(t.id)]}playExit(t,n){if(!t.closing){n.remove();return}n.classList.add("s-panel-closing"),n.setAttribute("inert","");let i=()=>{clearTimeout(o),this.timers.delete(o),n.remove()};n.addEventListener("transitionend",r=>{r.target===n&&r.propertyName==="opacity"&&i()});let o=setTimeout(i,Ae+80);this.timers.add(o)}goBackTo(t){return $.back({path:t[t.length-1]},{state:{panels:t.slice(0,-1)}})}closeDownTo(t){return t<0||t>=this.live.length-1?Promise.resolve(!1):this.goBackTo(this.paths().slice(0,t+1))}closeTop(){return this.closeDownTo(this.live.length-2)}closePanelAt(t){if(t<0||t>=this.live.length)return Promise.resolve(!1);if(t===this.live.length-1)return this.closeTop();let n=this.paths().filter((i,o)=>o!==t);return Promise.resolve($.go({path:n[n.length-1],search:h.peek(()=>({...$.current.search})),hash:h.peek($.current,"hash"),state:{panels:n.slice(0,-1)}}))}closeByPath(t){let n=J(t);return this.closePanelAt(this.live.findIndex(i=>i.path===n))}closePanelEl(t){return this.closePanelAt(this.live.findIndex(n=>n.el===t))}navigate(t,n,i=!1){let o;try{o=new URL(t,location.href)}catch{return}let r=J(o.pathname),s=Object.fromEntries(new URLSearchParams(o.search)),a=o.hash,d=this.live.findIndex(T=>T.path===r);if(d>=0&&d<this.live.length-1){this.closeDownTo(d);return}if(d>=0){if(o.search===location.search&&(o.hash||"")===(location.hash||""))return;$.go({path:r,search:s,hash:a,state:{panels:this.paths().slice(0,-1)}});return}let g=n<0?this.deriveStack(r).slice(0,-1):this.paths().slice(0,i?n:n+1);$.go({path:r,search:s,hash:a,state:{panels:g}})}pushPath(t,n){this.navigate(t,this.live.length-1,n)}interceptLinks(){$.interceptLinks((t,n)=>{let i=n.closest(".s-panel"),o=i?this.live.findIndex(r=>r.el===i):-1;return this.navigate(t.href,o,n.getAttribute("data-panel")==="replace"),!0})}watchTitle(){let t=document.title;h(()=>{let i=this.byId.get(this.$state.topId)?.$page.title,o=typeof this.opts.title=="string"?this.opts.title:void 0,r=i&&o?`${i} \xB7 ${o}`:i||o;r&&(document.title=r)}),h.clean(()=>{document.title=t})}drawStack(){let t=h("div.s-panels role=main",()=>{this.containerEl=h(),h.onEach(this.$ids,(n,i)=>this.drawPanel(Number(i)),(n,i)=>[n,Number(i)])});if(typeof ResizeObserver<"u"){let n=new ResizeObserver(()=>this.layout());n.observe(t);let i=t.parentElement?.parentElement;i&&n.observe(i),h.clean(()=>n.disconnect())}h.clean(()=>{this.containerEl===t&&(this.containerEl=void 0)}),this.scheduleLayout()}drawPanel(t){let n=this.byId.get(t);if(!n)return;let i;h(()=>{let o=n.$page.layout;n.layout=o==="small"||o==="large"?o:"medium";let r=this.roomFor(n.layout);r&&(n.width=r,i&&(i.style.width=`${r}px`,this.scheduleLayout()))}),i=h(`section.s-panel${n.width?` w:${n.width}px`:""}`,"destroy=",o=>this.playExit(n,o),()=>{let o=h("div.s-content",()=>{n.draw(n.$page),$.persistScroll(n.path)});Ye(o),h(()=>{!n.$page.loading||n.$ui.holding||h("div.s-panel-loading aria-hidden=true",()=>{h("i"),h("i"),h("i")})})}),n.el=i,n.placed=!1,i.style.transition="none",h.clean(()=>{n.el===i&&(n.el=void 0)}),h(()=>{n.$page.loading,this.scheduleLayout()}),this.scheduleLayout()}scheduleLayout(){this.layoutQueued||(this.layoutQueued=!0,requestAnimationFrame(()=>{this.layoutQueued=!1,this.layout()}))}measure(){let t=this.containerEl,n=t?.parentElement,i=n?.parentElement;if(!t||!n||!i)return;let o=i.getBoundingClientRect().width;if(!o)return;let r=0;for(let d of n.children)d!==t&&(r+=d.getBoundingClientRect().width);let s=Math.max(0,Math.min(Ke,o)-r),a=(s-ie)/2;return{total:o,chrome:r,small:a>=Ne?a:s,medium:s,large:Math.max(0,o-r)}}geometry(){return this.geom??=this.measure()}roomFor(t){return this.geometry()?.[t]??0}layout(){let t=this.containerEl,n=t?.closest(".s-main");if(!t||!n)return;let i=this.live.length;if(!i||this.live.some(c=>!c.el))return;this.geom=void 0;let o=this.geometry();if(!o)return;let r=this.opts.stacking!==!1,s=this.lastBodyW!==o.total;s&&(this.lastBodyW=o.total,n.classList.add("s-shell-snap"));let a=c=>o[c.layout],d=i-1,g=a(this.live[d]);if(r)for(let c=i-2;c>=0;c--){let m=g+ie+a(this.live[c]);if(m>o.large)break;g=m,d=c}let T=Math.min(o.large,Math.max(o.medium,g));for(let c=d;c<i;c++)this.live[c].width=a(this.live[c]);for(let c of this.live)c.width||(c.width=a(c));n.style.setProperty("--s-shell-w",`${o.chrome+T}px`);let p=[],v=0;for(let c=0;c<i;c++){let m=this.live[c],y=m.el,z=c>=d;_e(y,z?v:0,m.width,Ee*c+1),z&&(v+=m.width+ie),y.classList.toggle("s-panel-sep",z&&c>d),y.classList.toggle("s-panel-hidden",!z),y.toggleAttribute("inert",!z),!m.placed&&(p.push(m),!h.peek(m.$page,"loading")||m.holdDone?m.$ui.holding=!1:m.$ui.holding||(m.$ui.holding=!0,this.holdEnter(m)),m.enter&&z&&y.classList.add("s-panel-enter"))}(p.length||s)&&t.offsetWidth,s&&n.classList.remove("s-shell-snap");for(let c of p)c.$ui.holding||(c.el.style.transition="",c.el.classList.remove("s-panel-enter"),c.enter=!1,c.placed=!0)}holdEnter(t){let n=setTimeout(()=>{this.timers.delete(n),t.holdDone=!0,t.$ui.holding&&(t.$ui.holding=!1,this.scheduleLayout())},We);this.timers.add(n)}};function _e(e,t,n,i){e.style.left=`${t}px`,e.style.width=`${n}px`,e.style.zIndex=String(i)}function Xe(e){let t=[...e].reverse(),n=0,i=()=>{for(;n<t.length;){let o=h.peek(t[n++].$page,"requestClose");if(!o)continue;let r;try{r=o()}catch(s){return console.error(s),!1}if(r===!1)return!1;if(r!==!0)return Promise.resolve(r).then(s=>s===!1?!1:i())}return!0};return i()}function Ue(e,t){return e.length===t.length&&e.every((n,i)=>n===t[i])}function Ve(e){h("p fg:$s-muted",()=>h("#",`No page at ${e.path}`))}function Ye(e){if(typeof ResizeObserver>"u")return;let t=()=>e.classList.toggle("s-scroll-y",e.offsetWidth>e.clientWidth),n=new ResizeObserver(t);n.observe(e),e.firstElementChild&&n.observe(e.firstElementChild),t(),h.clean(()=>n.disconnect())}var Qe={push(e){ue().pushPath(e,!1)},replace(e){ue().pushPath(e,!0)},close(e){let t=ue();return e==null?t.closeTop():t.closeByPath(e)},get stack(){return L?L.$state.paths:[]}};function ue(){if(!L)throw new Error("Staffa: S.panels needs a routed S.main() (one with `routes`) to be mounted");return L}function Te(e){let t=e?.closest(".s-panel");return!L||!t?(console.warn("Staffa: `close: true` needs to be drawn inside a panel of a routed S.main()"),Promise.resolve(!1)):L.closePanelEl(t)}C.insertGlobalCss({".s-box":{"&":"display:flex flex-direction:column overflow:hidden r: $s-radius-lg; position:relative","&:not(:first-child)":"margin-top: $3","> header":"display:flex align-items:center gap:$2 padding: $2 $3; border:0 border-bottom: 1px solid $s-faint; r:0 font-weight:600","> footer":"display:flex align-items:center justify-content:flex-end gap:$2 padding: $2 $3; border:0 border-top: 1px solid $s-faint; r:0","> div":"p:$3 gap:$3",".s-box-close":"flex-shrink:0 margin-left:auto display:flex align-items:center justify-content:center width:1.6rem height:1.6rem p:0 border:0 background:transparent cursor:pointer fg:$s-muted font-size:0.95rem line-height:1 r:$s-radius-sm transition: color 0.12s, background 0.12s;",".s-box-close:hover":"fg:$s-text background: color-mix(in srgb, $s-text 8%, transparent);","> .s-box-close":"position:absolute top:$2 right:$2 z-index:1"}});function Je(e={}){let t=typeof e=="string"||typeof e=="function"?{content:e}:e;C("section.s-box.s-s.neutral.shadow",t.attrs,()=>{C(()=>{t.header!=null?C("header.s-s.neutral",t.headerAttrs,()=>{f(t.header),t.close&&Oe(t.close)}):t.close&&Oe(t.close)}),C("div",t.contentAttrs,()=>{f(t.content)}),C(()=>{t.footer!=null&&C("footer.s-s.neutral",t.footerAttrs,()=>f(t.footer))})})}function Oe(e){C("button.s-box-close type=button aria-label=Close",()=>{C("click=",t=>{typeof e=="function"?e():Te(t.currentTarget)}),C("span aria-hidden=true #\u2715")})}import B from"aberdeen";B.insertGlobalCss({".s-btn":{"&":"display:inline-flex align-items:center justify-content:center gap:$2 font-weight:450 line-height:1.1 white-space:nowrap cursor:pointer text-decoration:none padding: $m2 $m3; transition: background 0.15s, border-color 0.15s, color 0.15s, filter 0.15s, box-shadow 0.15s, transform 0.08s;","&:focus-visible":"outline: 3px solid $s-focus; outline-offset: 1px;","&:hover":"filter: brightness(1.06)","&.tonal:hover, &.outlined:hover":"background: color-mix(in srgb, $s-bg 24%, transparent);","&.neutral:hover":"filter:none background: color-mix(in srgb, $s-text 8%, $s-bg);","&:active:not(:disabled)":"transform: translateY(1px)","&.small, .small > &":"padding: $m1 $m2; font-size:0.85em border-radius:$s-radius-sm","&.large, .large > &":"font-size:1.4em border-radius:$s-radius-lg"}});function O(e={}){let t=typeof e=="string"||typeof e=="function"?{content:e}:e,n=t.href!=null?"a":"button";B(`${n}.s-btn.s-s.shadow`,t.attrs,()=>{t.href!=null?(B(`href=${t.href} role=button`),t.disabled&&B("aria-disabled=true")):(B("type=",t.type??"button"),t.disabled&&B("disabled=true")),t.ariaLabel&&B("aria-label=",t.ariaLabel),t.click&&B("click=",t.click),f(t.icon),f(t.content)})}import fe from"aberdeen";import Me from"aberdeen";Me.insertGlobalCss({".s-bgroup":{"&":"display:inline-flex align-items:stretch","&.s-spaced":"gap:$2 flex-wrap:wrap","&.s-vertical":"flex-direction:column","&.s-attached":"gap:0","&.s-attached:not(.s-vertical) > .s-btn:not(:first-child)":"margin-left:-1px","&.s-attached:not(.s-vertical) > .s-btn:not(:first-child):not(:last-child)":"r:0","&.s-attached:not(.s-vertical) > .s-btn:first-child:not(:last-child)":"border-top-right-radius:0 border-bottom-right-radius:0","&.s-attached:not(.s-vertical) > .s-btn:last-child:not(:first-child)":"border-top-left-radius:0 border-bottom-left-radius:0","&.s-attached.s-vertical > .s-btn:not(:first-child)":"margin-top:-1px","&.s-attached.s-vertical > .s-btn:not(:first-child):not(:last-child)":"r:0","&.s-attached.s-vertical > .s-btn:first-child:not(:last-child)":"border-bottom-left-radius:0 border-bottom-right-radius:0","&.s-attached.s-vertical > .s-btn:last-child:not(:first-child)":"border-top-left-radius:0 border-top-right-radius:0","&.s-attached > .s-btn:hover, &.s-attached > .s-btn:focus-visible":"z-index:1"}});function j(e={}){let n=`.s-${e.layout??"attached"}${e.vertical?".s-vertical":""}`;Me(`div.s-bgroup${n} role=group`,e.attrs,()=>{if(e.buttons)for(let i of e.buttons)O(i);f(e.content)})}function Ze(e){fe(()=>{let t=e.bind.value;j({attrs:e.attrs,buttons:Object.entries(e.options).map(([n,i])=>({content:i,ariaLabel:typeof i=="function"?n:void 0,attrs:t===n?".primary":".neutral",click:()=>{e.bind.value=e.allowDeselect&&t===n?void 0:n}}))})}),e.name&&fe(()=>fe(`input type=hidden name=${e.name} value=`,e.bind.value??""))}import k from"aberdeen";k.insertGlobalCss({".s-check":{"&":"display:flex flex-direction:column gap:$1","> label":"display:flex align-items:center gap:$2 cursor:pointer user-select:none","> label:has(input:disabled)":"cursor:not-allowed opacity:0.45 filter:saturate(0.6)",input:"cursor:inherit m:0"}});function et(e={}){let t=e.id??F("check");k("div.s-check",e.attrs,()=>{k(`label for=${t}`,()=>{k("input type=checkbox",e.inputAttrs,()=>{k(`id=${t}`),e.name&&k(`name=${e.name}`),e.checked&&!e.bind&&k("checked=true"),e.change&&k("change=",e.change),k(()=>{e.disabled&&k("disabled=true")}),k(()=>{e.required&&k("aria-required=true")}),e.bind&&k("bind=",e.bind)}),k(()=>{e.label!=null&&f(e.label),e.required&&k("span.s-req aria-hidden=true #*")})}),k(()=>{e.help!=null&&!e.error&&k("div.s-help",()=>f(e.help))}),k(()=>{e.error&&k("div.s-error role=alert #",e.error)})})}import W from"aberdeen";W.insertGlobalCss({".s-form":{"&":"display:flex flex-direction:column gap:$3","&.grid":"display:grid grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap:$3","&.grid > .s-wide, &.grid > footer":"grid-column: 1 / -1;","> footer":"display:flex align-items:center justify-content:flex-end gap:$2 flex-wrap:wrap margin-top:$1"}});function tt(e={}){let t=typeof e=="string"||typeof e=="function"?{content:e}:e;W("form.s-form",t.attrs,()=>{W(()=>{W(".grid=",t.layout==="grid")}),W("submit=",n=>{if(n.preventDefault(),t.submit){let i=new FormData(n.target),o={};for(let r of new Set(i.keys())){let s=i.getAll(r);o[r]=s.length===1?s[0]:s}t.submit(o,n)}}),f(t.content),W(()=>{t.actions&&W("footer",t.actionsAttrs,()=>f(t.actions))})})}import u from"aberdeen";import A from"aberdeen";import{matchCurrent as it}from"aberdeen/route";import nt from"aberdeen";var Z={size:24,color:"currentColor",strokeWidth:2,cap:"round",join:"round"};function ot(e,t){let n=t.size??Z.size,i=nt('svg.s-icon aria-hidden=true viewBox="0 0 24 24" fill=none',"width=",n,"height=",n,"stroke=",t.color??Z.color,"stroke-width=",t.strokeWidth??Z.strokeWidth,"stroke-linecap=",t.cap??Z.cap,"stroke-linejoin=",t.join??Z.join,t.attrs);i.innerHTML=e}function Y(e){return(t={})=>ot(e,t)}var me=Y('<path d="M4 6h16"/><path d="M4 12h16"/><path d="M4 18h16"/>'),Se=Y('<path d="M18 6 6 18"/><path d="m6 6 12 12"/>');A.insertGlobalCss({".s-menu-list":"position:fixed z-index:350 min-width:10rem display:flex flex-direction:column p:$1 r:$s-radius-lg overflow-y:auto max-height:min(80vh,28rem) transition: opacity 0.15s, transform 0.15s;",".s-menu-list.hidden":"opacity:0 pointer-events:none transform:translateY(-6px)",".s-menu-item":"display:flex align-items:center gap:$2 w:100% outline:0 padding: $m2 0; line-height:1.1 r:$s-radius cursor:pointer text-align:left font-weight:450 font-size:0.9em border:0 background:transparent fg:$s-text text-decoration:none transition: color 0.12s, transform 0.12s, text-shadow 0.12s;",".s-menu-item:focus-visible:not([aria-current=page]), .s-menu-item:hover:not([aria-disabled=true]):not([aria-current=page])":"filter:none color: color-mix(in lab, $s-primary 33%, $s-text);",".s-menu-item[aria-current=page]":"color:$s-accent filter:none",".s-menu-item[aria-disabled=true]":"opacity:0.45 cursor:not-allowed pointer-events:none",".s-menu-icon":"flex-shrink:0","hr.s-menu-sep":"border:0 height:1px margin: $1 0.6rem; background: linear-gradient(to right, transparent, $s-faint 18%, $s-faint 82%, transparent);"});function se(e,t){A("keydown=",n=>{if(n.key==="Enter"&&n.target.tagName==="A"){queueMicrotask(()=>t?.());return}if(n.key!=="ArrowDown"&&n.key!=="ArrowUp"&&n.key!=="Home"&&n.key!=="End")return;n.preventDefault();let o=[...n.currentTarget.querySelectorAll(".s-menu-item")].filter(d=>d.getAttribute("aria-disabled")!=="true");if(!o.length)return;let r=o.indexOf(document.activeElement),s=n.key==="ArrowUp"?-1:1,a=n.key==="Home"?0:n.key==="End"?o.length-1:r<0?s>0?0:o.length-1:(r+s+o.length)%o.length;o[a].focus()});for(let n of e){if(typeof n=="string"||typeof n=="function"){f(n);continue}if("separator"in n){A("hr.s-menu-sep");continue}A(n.href?"a.s-menu-item":"button.s-menu-item type=button",n.attrs,()=>{n.href&&(A("href=",n.href),n.target&&A("target=",n.target),A(()=>{it(n.href)&&A("aria-current=page")})),n.disabled&&A("aria-disabled=true"),A("click=",i=>{if(n.disabled){i.preventDefault();return}t?.(),n.click?.(i)}),n.icon&&A("span.s-menu-icon",()=>f(n.icon)),f(n.label)})}}var G=A.proxy({opts:null});function D(){let e=G.opts?.anchor;G.opts=null,e?.focus()}function ee(e){let t=G.opts;return t!=null&&(e==null||t.anchor===e)}function ae(e){ee(e)&&D()}function rt(e,t){let n=e.offsetWidth,i=e.offsetHeight,o=window.innerWidth,r=window.innerHeight,s=4,a=t.left;a+n>o-8&&(a=Math.max(8,t.right-n));let d=t.bottom+s;d+i>r-8&&t.top-i-s>=8&&(d=t.top-i-s),e.style.left=Math.max(8,a)+"px",e.style.top=Math.max(8,d)+"px"}I(()=>{let e=G.opts;if(!e)return;let t=A("div.s-menu-list.s-s.neutral.shadow create=hidden destroy=hidden",e.dropdownAttrs,()=>{se(e.items,D)}),n=o=>{let r=o.target;!t.contains(r)&&(e.closeOnAnchorClick||!e.anchor.contains(r))&&D()},i=o=>{(o.key==="Escape"||o.key==="Tab")&&(o.preventDefault(),D())};document.addEventListener("click",n,!0),document.addEventListener("keydown",i,!0),A.clean(()=>{document.removeEventListener("click",n,!0),document.removeEventListener("keydown",i,!0)}),requestAnimationFrame(()=>{if(!document.body.contains(t))return;let o=e.at?{left:e.at.x,right:e.at.x,top:e.at.y,bottom:e.at.y}:e.anchor.getBoundingClientRect();rt(t,o),U(t,".s-menu-item[aria-current=page]")})});function te(e){return G.opts=e,D}function st(e){let t=null;A.clean(()=>{G.opts?.anchor===t&&D()}),A("contextmenu=",n=>{n.preventDefault(),t=n.currentTarget,te({items:e.items,anchor:t,at:{x:n.clientX,y:n.clientY},closeOnAnchorClick:!0,dropdownAttrs:e.dropdownAttrs})})}function at(e){let t=null;A.clean(()=>{G.opts?.anchor===t&&D()}),O({icon:()=>me({size:"1.4em"}),...e.button?.content==null?{ariaLabel:"Open menu"}:null,attrs:".neutral",...e.button,click:n=>{if(t=n.currentTarget,G.opts?.anchor===t){D();return}te({items:e.items,anchor:t,dropdownAttrs:e.dropdownAttrs})}})}import b from"aberdeen";import K from"aberdeen";function he(e={}){q(e,(t,n)=>{K("input.s-input",e.inputAttrs,()=>{K("type=",e.type??"text"),e.placeholder!=null&&K("placeholder=",e.placeholder),e.autocomplete!=null&&K("autocomplete=",e.autocomplete),e.value!=null&&!e.bind&&K("value=",e.value),e.input&&K("input=",e.input),e.change&&K("change=",e.change),V(e,t,n,e.bind)})})}b.insertGlobalCss({".s-backdrop":{"&":"position:fixed inset:0 z-index:200 display:block background: rgba(0,0,0,0.55); transition: opacity 0.4s ease-in-out;","&.hidden":"opacity:0 pointer-events:none"},".s-dialog":{"&":"position:fixed z-index:200 top:50% left:50% display:flex flex-direction:column transform:translate(-50%,-50%) min-width:20rem max-width:min(90vw,44rem) max-height:min(88vh,800px) r: $s-radius-lg; overflow:hidden transition: opacity 0.2s ease-out, transform 0.2s ease-out;","> header":"display:flex align-items:center gap:$2 padding: $2 $3; border:0 border-bottom: 1px solid $s-faint; r:0 font-weight:600 flex-shrink:0","> footer":"display:flex align-items:center justify-content:flex-end gap:$2 padding: $2 $3; border:0 border-top: 1px solid $s-faint; r:0 flex-shrink:0","> div":"p:$3 gap:$3 display:flex flex-direction:column overflow-y:auto flex:1 min-height:0","&.hidden":"opacity:0 pointer-events:none transform: translate(-50%, calc(-50% + 20px)); pointer-events:none"}});var N=b.proxy({}),ge=0,Le=b.derive(()=>{let e=Object.keys(N);if(e.length)return e[e.length-1]});function be(){return Le.value!=null}I(()=>{b.onEach(N,({resolve:e,opts:t},n)=>{let i=()=>{delete N[n]};b.clean(()=>{t.onClose?.(),e()});let o=b.derive(()=>Le.value!=n);b("div.s-backdrop create=hidden destroy=hidden .hidden=",o,"click=",()=>{t.allowCancel!==!1&&i()});let r=b("div.s-dialog.neutral.s-s.extra-shadow create=hidden destroy=hidden",t.attrs,()=>{b(()=>{t.header!=null&&b("header.s-s.neutral",t.headerAttrs,()=>f(t.header))}),b("div",t.contentAttrs,()=>{f(t.content,i)}),b(()=>{t.footer!=null&&b("footer.s-s.neutral",t.footerAttrs,()=>f(t.footer))})});requestAnimationFrame(()=>{document.body.contains(r)&&U(r)})})});function le(e){ge||document.addEventListener("keydown",n=>{if(n.key!=="Escape"||n.defaultPrevented)return;let i=b.unproxy(N);for(let o=ge;o>0;o--)if(i[o]){n.preventDefault(),i[o].opts.allowCancel!==!1&&delete N[o];break}});let t=++ge;return e.cancelWithScope!==!1&&b.clean(()=>{delete N[t]}),new Promise(n=>{N[t]={resolve:n,opts:e}})}function lt(e,t={}){return le({header:"Alert",allowCancel:!0,content:n=>{b("p",()=>{b("#",e)}),j({layout:"spaced",attrs:"align-self:flex-end",content:()=>{O({content:"OK",click:n})}})},...t})}function dt(e,t={}){return new Promise(n=>{let i=!1;le({header:"Confirm",allowCancel:!0,content:o=>{b("p",()=>{b("#",e)}),j({layout:"spaced",attrs:"align-self:flex-end",content:()=>{O({content:"Cancel",attrs:".neutral",click:o}),O({content:"OK",click:()=>{i=!0,o()}})}})},...t,onClose:()=>{n(i),t.onClose?.()}})})}function ct(e,t="",n={}){return new Promise(i=>{let o=null;le({header:"Input",allowCancel:!0,content:r=>{b("p",()=>{b("#",e)});let s=b.proxy({value:t});b("form display:contents",()=>{b("submit=",a=>{a.preventDefault(),o=s.value,r()}),he({bind:b.ref(s,"value")}),j({layout:"spaced",attrs:"align-self:flex-end",content:()=>{O({content:"Cancel",attrs:".neutral",type:"button",click:r}),O({content:"OK",type:"submit"})}})})},...n,onClose:()=>{i(o),n.onClose?.()}})})}u.insertGlobalCss({".s-main":{"&":"display:flex flex-direction:column min-height:100vh max-height:100vh container-type:inline-size","body > &":"margin: calc(-1 * $3)","> header":"border:0 border-bottom: 1px solid $s-faint; r:0 position:sticky top:0 z-index:10","> footer":"border-top: 1px solid $s-faint; fg:$s-muted","> header > .s-bar, > footer > .s-bar":"display:flex align-items:center width:100% margin-inline:auto gap:$3 padding: $2 $3;","> header .s-header-icon":"display:flex align-items:center font-size:1.4em background: $s-gradient; -webkit-background-clip:text; background-clip:text; color:transparent;","> header .s-titles":"display:flex flex-direction:column min-width:0 flex:1","> header .s-title":"font-weight:800 font-size:1.1em line-height:1.2 overflow:hidden text-overflow:ellipsis white-space:nowrap letter-spacing:-0.01em background: $s-gradient; -webkit-background-clip:text; background-clip:text; color:transparent; width:fit-content max-width:100%","> header .s-subtitle":"fg:$s-muted font-size:0.85em overflow:hidden text-overflow:ellipsis white-space:nowrap","> header .s-menu":"display:flex align-items:center gap:$2",".s-body":"flex:1 overflow:hidden display:flex flex-direction:row min-height:0 justify-content:center position:relative",".s-body-inner":"flex:1 min-width:0 display:flex flex-direction:row min-height:0","&.s-nav-right .s-body-inner":"flex-direction:row-reverse",".s-nav-sep":"width:1px flex-shrink:0 align-self:stretch margin: 0.6rem 0; border:0 background: linear-gradient(to bottom, transparent, $s-faint 18%, $s-faint 82%, transparent);",".s-body main":"flex:1 min-width:0 min-height:0 overflow-x:hidden overflow-y:auto display:flex flex-direction:column transition: transform 0.3s ease;",".s-body main.s-slide-in":"transform: translateX(100%); transition:none",".s-body main > .s-content":"width:100% flex:1 p:$3",".s-body main.s-scroll-y":"margin-right:$3","&.s-routed > .s-body > .s-body-inner":"max-width: var(--s-shell-w, 100%);","&.s-routed > header > .s-bar":"max-width: var(--s-shell-w, 100%);","&.s-routed > footer > .s-bar":"max-width: var(--s-shell-w, 100%);","&.s-routed > .s-body > .s-body-inner, &.s-routed > header > .s-bar, &.s-routed > footer > .s-bar":"transition: max-width var(--s-panel-ms) ease;","&.s-routed.s-shell-snap > .s-body > .s-body-inner, &.s-routed.s-shell-snap > header > .s-bar, &.s-routed.s-shell-snap > footer > .s-bar":"transition:none"},".s-nav-panel":{"&":"display:flex flex-direction:column overflow-y:auto flex-shrink:0 max-width:228px padding:$3 gap:$1"},".s-nav-page":{"&":"position:absolute inset:0 z-index:5 display:flex flex-direction:column overflow-y:auto overscroll-behavior:contain border:0 r:0 padding:$2 gap:$1 transition: transform 0.3s ease;","&.s-nav-page-off":"transform:translateX(-100%) pointer-events:none",".s-menu-item":"padding: $2 $3; min-height:3rem font-size:1.05em gap:$3"},".s-main.s-nav-left .s-nav-trigger, .s-main.s-nav-right .s-nav-trigger":"display:none",".s-main.s-nav-btn-only .s-nav-panel":"display:none",".s-main.s-nav-btn-only .s-nav-trigger":"display:flex",[`@container (max-width: ${X}px)`]:{".s-main.s-nav-left .s-nav-panel, .s-main.s-nav-right .s-nav-panel, .s-main .s-nav-sep":"display:none",".s-main.s-nav-left .s-nav-trigger, .s-main.s-nav-right .s-nav-trigger":"display:flex",".s-content > .s-box":"margin-inline: calc(-1 * $3); r:0 border-inline:0",".s-main .s-body main.s-scroll-y":"margin-right:0"}});function ut(e={}){let t=e.nav,n=e.navPosition??"left",i=u.proxy({open:!1}),o=e.routes;if(o!=null&&e.content!=null)throw new Error("Staffa: S.main() takes either `content` or `routes`, not both");let r=o?new re({routes:o,notFound:e.notFound,stacking:e.stacking,title:e.title}):null,s=r?null:e.maxWidth,a=u(`div.s-main${r?".s-routed":""}`,e.attrs,()=>{u(()=>{t==null||!t.items.length||u(n==="button"?".s-nav-btn-only":`.s-nav-${n}`)}),u(()=>{(e.title!=null||e.subtitle!=null||e.icon!=null||e.menu!=null||t!=null&&t.items.length>0)&&u("header.s-s.neutral",e.topbarAttrs,()=>{u("div.s-bar",()=>{u(()=>{s!=null&&u("max-width:",s)}),u(()=>{t==null||!t.items.length||u("div.s-nav-trigger",()=>pt(t,i))}),u(()=>{e.icon!=null&&u("div.s-header-icon",()=>f(e.icon))}),u("div.s-titles",()=>{u(()=>{e.title!=null&&u("div.s-title",()=>f(e.title))}),u(()=>{e.subtitle!=null&&u("div.s-subtitle",()=>f(e.subtitle))})}),u(()=>{e.menu&&u("div.s-menu",()=>f(e.menu))})})})}),u("div.s-body",()=>{u("div.s-body-inner",()=>{u(()=>{s!=null&&u("max-width:",s)}),u(()=>{t==null||!t.items.length||n==="button"||(u(`nav.s-nav-panel.s-nav-${n}`,e.navAttrs,()=>{se(t.items)}),u("div.s-nav-sep aria-hidden=true"))}),ht(e,r)}),u(()=>{t!=null&&t.items.length&&i.open&&ft(t,e.navPageAttrs,i)})}),u(()=>{e.footer!=null&&u("footer",()=>{u("div.s-bar",()=>{u(()=>{s!=null&&u("max-width:",s)}),f(e.footer)})})})});if(t!=null||r){let d=g=>{if(g.key!=="Escape"||g.defaultPrevented||be()||ee())return;let T=a.querySelector(".s-nav-trigger button");if(i.open){g.preventDefault(),i.open=!1,T?.focus();return}if(r&&r.$state.paths.length>1){g.preventDefault(),r.closeTop();return}let p=a.querySelector(".s-nav-panel");if(p?.offsetParent!=null){let v=p.querySelector("[aria-current=page]")??p.querySelector(".s-menu-item:not([aria-disabled=true])");v&&(g.preventDefault(),v.focus());return}T&&(g.preventDefault(),T.click())};document.addEventListener("keydown",d),u.clean(()=>document.removeEventListener("keydown",d))}}function pt(e,t){let n=null;u.clean(()=>{n&&ae(n)}),O({icon:()=>u(()=>(t.open?Se:me)({size:"1.5em"})),ariaLabel:"Open navigation",attrs:".neutral .small",...e.button,click:i=>{n=i.currentTarget;let o=n.closest(".s-main");if(o!=null&&o.clientWidth<=X){t.open=!t.open;return}ee(n)?ae(n):te({items:e.items,anchor:n,dropdownAttrs:e.dropdownAttrs})}})}function ft(e,t,n){let i=!1,o=u("nav.s-nav-page.s-s.neutral aria-label=Navigation create=s-nav-page-off destroy=s-nav-page-off",t,()=>se(e.items,()=>{i=!0,n.open=!1})),r=o.closest(".s-main"),s=o.parentElement?.querySelector(":scope > .s-body-inner"),a=s?.querySelector(":scope > main");if(s?.setAttribute("inert",""),r!=null&&typeof ResizeObserver<"u"){let d=new ResizeObserver(()=>{r.clientWidth>X&&(n.open=!1)});d.observe(r),u.clean(()=>d.disconnect())}u.clean(()=>{s?.removeAttribute("inert"),i&&(a&&mt(a),r?.querySelector(".s-nav-trigger button")?.focus())}),requestAnimationFrame(()=>{document.body.contains(o)&&U(o,".s-menu-item[aria-current=page]")})}function mt(e){e.classList.add("s-slide-in"),e.offsetWidth,e.classList.remove("s-slide-in")}function ht(e,t){if(t){t.drawStack();return}let n=u("main",()=>{u("div.s-content",e.contentAttrs,()=>{f(e.content)})});gt(n)}function gt(e){if(typeof ResizeObserver>"u")return;let t=()=>e.classList.toggle("s-scroll-y",e.offsetWidth>e.clientWidth),n=new ResizeObserver(t);n.observe(e),e.firstElementChild&&n.observe(e.firstElementChild),t(),u.clean(()=>n.disconnect())}import M from"aberdeen";M.insertGlobalCss({".s-select_wrap":{"&":"position:relative display:block",select:"w:100% cursor:pointer padding-right:2.2em; appearance:none","&::after":"content: '\u25BE'; position:absolute right:0.7em top:50%; transform: translateY(-50%); pointer-events:none fg:$s-muted font-size:0.85em"}});function bt(e){q(e,(t,n)=>{M("div.s-select_wrap",e.inputAttrs,()=>{M("select.s-input",()=>{V(e,t,n),M("change=",i=>{e.bind&&(e.bind.value=i.target.value)}),M(()=>{let i=typeof e.options=="function"?e.options():e.options,o=e.bind?.value??"";e.placeholder!=null&&M("option",()=>{M("value= disabled=true hidden=true"),o||M("selected=true"),M("#",e.placeholder)});for(let r of i){let s=typeof r=="string"?{value:r,label:r}:{value:r.value,label:r.label??r.value};M("option",()=>{M("value=",s.value),s.value===o&&M("selected=true"),M("#",s.label)})}})})})})}import x from"aberdeen";var vt=Y('<path d="m15 18-6-6 6-6"/>'),yt=Y('<path d="m9 18 6-6-6-6"/>');x.insertGlobalCss({".s-tabs":{"&":"display:flex flex-direction:column gap:$3",".s-tabbar":"position:relative display:flex border-bottom: 1px solid $s-faint;",".s-tablist":"display:flex gap:$1 align-items:stretch flex:1 min-width:0 overflow-x:auto overflow-y:hidden scrollbar-width:none scroll-behavior:smooth margin-bottom:-1px",".s-tablist::-webkit-scrollbar":"display:none",".s-tab":"display:inline-flex align-items:center gap:$2 cursor:pointer background:transparent border:0 color: $s-muted; font-weight:600 padding: 0.6em 0.9em; white-space:nowrap border-bottom: 3px solid transparent; transition: color 0.15s, background 0.15s, border-color 0.15s;",".s-tab:hover:not(:disabled), .s-tab[aria-selected=true]":"color: $s-text;",".s-tab:focus-visible":"outline:none box-shadow: inset 0 0 0 2px $s-focus; r: $s-radius;",".s-tab[aria-selected=true]":"border-image: $s-gradient 1;",".s-tabscroll":"position:absolute top:0 bottom:0 z-index:1 display:none align-items:center justify-content:center width:2.4em border:0 padding:0 cursor:pointer fg:$s-muted transition: color 0.15s;",".s-tabscroll:hover":"fg:$s-text",".s-tabscroll-left":"left:0 justify-content:flex-start background: linear-gradient(to right, $s-bg 45%, transparent)",".s-tabscroll-right":"right:0 justify-content:flex-end background: linear-gradient(to left, $s-bg 45%, transparent)",".s-tabbar.s-can-left > .s-tabscroll-left, .s-tabbar.s-can-right > .s-tabscroll-right":"display:flex",".s-tabpanel":"display:block"}});function xt(e){let t=F("tabs"),n=(r,s)=>r.id??String(s),i=e.bind??x.proxy(n(e.tabs[0]??{label:""},0));e.tabs.length>0&&!e.tabs.some((r,s)=>n(r,s)===x.peek(()=>i.value))&&(i.value=n(e.tabs[0],0));let o=(r,s)=>{r.disabled||(i.value=n(r,s))};x("div.s-tabs",e.attrs,()=>{x("div.s-tabbar",()=>{let r=x("div.s-tablist role=tablist",()=>{e.tabs.forEach((s,a)=>{let d=n(s,a),g=x("button.s-tab type=button role=tab",()=>{x(`id=${t}-tab-${d} aria-controls=${t}-panel-${d}`),x(()=>{let T=i.value===d;x("aria-selected=",T?"true":"false"),x("tabindex=",T?"0":"-1"),T&&requestAnimationFrame(()=>$t(g))}),s.disabled&&x("disabled=true"),x("click=",()=>o(s,a)),x("keydown=",T=>kt(T,e.tabs,a,o)),f(s.icon),f(s.label)})})});Ce(r,-1),Ce(r,1),wt(r)}),x("div.s-tabpanel role=tabpanel",e.contentAttrs,()=>{x(()=>{let r=i.value,s=e.tabs.findIndex((d,g)=>n(d,g)===r),a=e.tabs[s]??e.tabs[0];a&&(x(`id=${t}-panel-${n(a,s)} aria-labelledby=${t}-tab-${n(a,s)}`),f(a.content))})})})}function Ce(e,t){x(`button.s-tabscroll.s-tabscroll-${t<0?"left":"right"} type=button`,()=>{x("tabindex=-1 aria-hidden=true"),x("click=",()=>e.scrollBy({left:t*e.clientWidth*.8,behavior:"smooth"})),(t<0?vt:yt)({size:"1.1em"})})}function wt(e){let t=e.parentElement;if(!t||typeof ResizeObserver>"u")return;let n=()=>{let o=e.scrollWidth-e.clientWidth;t.classList.toggle("s-can-left",e.scrollLeft>1),t.classList.toggle("s-can-right",e.scrollLeft<o-1)};e.addEventListener("scroll",n,{passive:!0});let i=new ResizeObserver(n);i.observe(e);for(let o of Array.from(e.children))i.observe(o);n(),x.clean(()=>{e.removeEventListener("scroll",n),i.disconnect()})}function $t(e){let t=e.parentElement;if(!t||!e.isConnected)return;let n=parseFloat(getComputedStyle(t).fontSize)*2.6,i=e.getBoundingClientRect(),o=t.getBoundingClientRect();i.left<o.left+n?t.scrollBy({left:i.left-o.left-n,behavior:"smooth"}):i.right>o.right-n&&t.scrollBy({left:i.right-o.right+n,behavior:"smooth"})}function kt(e,t,n,i){let o=n;if(e.key==="ArrowRight"||e.key==="ArrowDown")o=(n+1)%t.length;else if(e.key==="ArrowLeft"||e.key==="ArrowUp")o=(n-1+t.length)%t.length;else if(e.key==="Home")o=0;else if(e.key==="End")o=t.length-1;else return;e.preventDefault();let r=o>=n?1:-1;for(let s=0;s<t.length;s++){let a=t[o];if(a&&!a.disabled){i(a,o),e.currentTarget?.parentElement?.children[o]?.focus();return}o=(o+r+t.length)%t.length}}import P from"aberdeen";P.insertGlobalCss({"textarea.s-input":"resize:vertical min-height:3em line-height:1.45","textarea.s-input.s-autoGrow":"resize:none min-height:2.5em overflow-y:hidden"});function Et(e={}){let t=e.autoGrow!==!1;q(e,(n,i)=>{let o=P("textarea.s-input",e.inputAttrs,()=>{t?(P(".s-autoGrow"),P("input=",r=>{Pe(r.currentTarget),e.input&&e.input(r)})):(P("rows=",e.rows??4),P("resize:",e.resize??"vertical"),e.input&&P("input=",e.input)),e.placeholder!=null&&P("placeholder=",e.placeholder),e.value!=null&&!e.bind&&P("value=",e.value),e.change&&P("change=",e.change),V(e,n,i,e.bind)});t&&requestAnimationFrame(()=>Pe(o))})}function Pe(e){e.style.height="auto",e.style.height=`${e.scrollHeight}px`}import w from"aberdeen";import{grow as At,shrink as Tt}from"aberdeen/transitions";w.insertGlobalCss({".s-toasts":"position:fixed bottom:$3 right:$3 z-index:400 display:flex flex-direction:column gap:$2 pointer-events:none max-width:min(90vw,24rem) w:24rem",".s-toast":{"&":"display:flex align-items:flex-start gap:$2 padding: $3; pointer-events:auto position:relative overflow:hidden",".s-toast-body":"display:flex flex-direction:column gap:$1 flex:1 min-width:0",".s-toast-title":"font-weight:700 line-height:1.3",".s-toast-close":"cursor:pointer border:0 background:transparent fg:$s-muted font-size:1.1em line-height:1 padding: 0 0.15em; r:4px flex-shrink:0 align-self:flex-start",".s-toast-close:hover":"fg:$s-text",".s-toast-close:focus-visible":"outline:none box-shadow: 0 0 0 3px $s-focus; fg:$s-text",".s-toast-progress":"position:absolute bottom:0 left:0 right:0 height:2px background:$s-accent width:100%"}});var Ot=0,ne=w.proxy({});I(()=>{w.peek(()=>w.isEmpty(ne))&&w.isEmpty(ne)||w("div.s-toasts",()=>{w.onEach(ne,e=>{let{opts:t,id:n}=e,i=t.type==="danger"||t.type==="warning"?"alert":"status",o=t.type==null||t.type==="neutral"?"neutral":t.type,r=t.duration??6e3,s,a=null,d=()=>{clearTimeout(s),a&&(a.style.transition="none",a.style.width="100%",a.offsetWidth,a.style.transition=`width ${r}ms linear`,a.style.width="0%"),s=setTimeout(()=>ve(n),r)},g=()=>{clearTimeout(s),s=void 0,a&&(a.style.transition="none",a.style.width="100%")};w.clean(()=>clearTimeout(s)),w(`div.s-toast.s-s.${o}.extra-shadow aria-live=polite role=${i}`,"create=",At,"destroy=",Tt,t.attrs,()=>{r>0&&(w("mouseenter=",g),w("mouseleave=",d)),w("div.s-toast-body",()=>{w(()=>{t.title!=null&&w("div.s-toast-title",()=>f(t.title))}),w("div.s-toast-msg",()=>f(t.message))}),w(()=>{t.dismissible!==!1&&w("button.s-toast-close type=button aria-label=Dismiss",()=>{w("#\xD7"),w("click=",()=>ve(n))})}),r>0&&(a=w("div.s-toast-progress"))}),r>0&&requestAnimationFrame(d)})})});function ve(e){delete ne[e]}function Mt(e){let t=++Ot;return ne[t]={id:t,opts:e},()=>ve(t)}import H from"aberdeen";H.insertGlobalCss({".s-tt-tip":{"&":"position:fixed z-index:500 max-width:20rem w:max-content padding: 0.3em 0.65em; font-size:0.85em line-height:1.4 pointer-events:none"}});var Q=H.proxy(void 0),R=null;typeof window<"u"&&window.addEventListener("scroll",()=>{Q.value=void 0},{capture:!0,passive:!0});function St(e,t,n,i){let r=window.innerWidth,s=window.innerHeight,a=0,d=0;return i==="bottom"?(a=e.left+(e.width-t)/2,d=e.bottom+7,d+n>s-8&&(d=e.top-n-7)):i==="left"?(a=e.left-t-7,d=e.top+(e.height-n)/2,a<8&&(a=e.right+7)):i==="right"?(a=e.right+7,d=e.top+(e.height-n)/2,a+t>r-8&&(a=e.left-t-7)):(a=e.left+(e.width-t)/2,d=e.top-n-7,d<8&&(d=e.bottom+7)),{x:Math.max(8,Math.min(a,r-t-8)),y:Math.max(8,Math.min(d,s-n-8))}}function ye(){R&&clearTimeout(R),R=setTimeout(()=>{Q.value=void 0,R=null},100)}I(()=>{let e=Q.value;if(!e)return;let{opts:t,anchor:n}=e,i=t.placement??"top",o=H("div.s-tt-tip.s-s.neutral.shadow role=tooltip visibility:hidden",t.attrs,()=>{H("mouseenter=",()=>{R&&(clearTimeout(R),R=null)}),H("mouseleave=",ye),f(t.tip)});requestAnimationFrame(()=>{if(!document.body.contains(o))return;let{x:r,y:s}=St(n.getBoundingClientRect(),o.offsetWidth,o.offsetHeight,i);o.style.left=r+"px",o.style.top=s+"px",o.style.visibility=""})});function Lt(e){let t=n=>{R&&(clearTimeout(R),R=null),Q.value={opts:e,anchor:n.currentTarget}};H("mouseenter=",t),H("mouseleave=",ye),H("focusin=",t),H("focusout=",ye),H.clean(()=>{Q.value?.opts===e&&(Q.value=void 0)})}export{st as addContextMenu,Lt as addTooltip,lt as alert,De as autocomplete,Je as box,O as button,Ze as buttonChooser,j as buttonGroup,et as checkbox,ae as closeFloatingMenu,dt as confirm,le as dialog,tt as form,we as getDarkMode,be as isDialogOpen,ee as isFloatingMenuOpen,ut as main,at as menuButton,Qe as panels,ct as prompt,bt as select,ze as setDarkMode,te as showFloatingMenu,xt as tabs,Et as textarea,he as textline,Mt as toast};
+import S from"aberdeen";var pe="staffa:darkMode",$e=S.proxy({value:Ie()});function Ie(){try{let e=localStorage.getItem(pe);if(e==="dark")return!0;if(e==="light")return!1}catch{}}function Be(e){$e.value=e;try{e===void 0?localStorage.removeItem(pe):localStorage.setItem(pe,e?"dark":"light")}catch{}}function ke(e=!1){let t=$e.value;return t===void 0&&!e?S.darkMode():t}S(()=>{ke()?S.insertGlobalCss({":root, .s-s.neutral":"--s-bg:#0e0f12 --s-text:#e9eaec",".s-s.neutral":"--s-bg:#191b1f --s-text:#e9eaec",".s-s.neutral .s-s.neutral":"--s-bg:#23262b"}):S.insertGlobalCss({":root, .s-s.neutral":"--s-bg:#eef0f3 --s-text:#1d1f24",".s-s.neutral, .s-s.neutral":"--s-bg:#ffffff --s-text:#1d1f24",".s-s.neutral .s-s.neutral":"--s-bg:#f6f7f9"})});S.setSpacingCssVars(1.1);S.insertGlobalCss({"*, *::before, *::after":"box-sizing:border-box",html:"text-size-adjust:100%",body:"m:0 p:$3 line-height:1.5 font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; -webkit-font-smoothing:antialiased background-color:$s-bg text:$s-text",a:"color: $s-link-fg; text-decoration:underline text-underline-offset:2px; transition: color 0.12s, filter 0.12s;","a:hover":"filter: brightness(1.15)","input, button, textarea, select, optgroup":"font:inherit color:inherit","input:where(:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=image],[type=submit],[type=button],[type=reset],[type=hidden])), textarea, select":"background:$s-bg border: 1px solid $s-faint; r:$s-radius-sm padding: 0.45em 0.65em; max-width:100%","input:where([type=checkbox],[type=radio])":"width:1.15em height:1.15em cursor:pointer","input[type=range]":"appearance:none background:transparent cursor:pointer vertical-align:middle","input[type=range]::-webkit-slider-runnable-track":"height:4px r:99px background:$s-faint","input[type=range]::-moz-range-track":"height:4px r:99px background:$s-faint","input[type=range]::-moz-range-progress":"height:4px r:99px background:$s-accent","input[type=range]::-webkit-slider-thumb":"appearance:none width:16px height:16px margin-top:-6px r:50% background:$s-accent","input[type=range]::-moz-range-thumb":"width:16px height:16px border:0 r:50% background:$s-accent","input[type=file]":"cursor:pointer",progress:"appearance:none border:0 height:6px r:99px background:$s-faint overflow:hidden vertical-align:middle","progress::-webkit-progress-bar":"background:$s-faint r:99px","progress::-webkit-progress-value":"background:$s-accent r:99px","progress::-moz-progress-bar":"background:$s-accent r:99px",meter:"vertical-align:middle",fieldset:"border: 1px solid $s-faint; r:$s-radius-sm padding:$2 min-width:0",legend:"padding: 0 $1; font-weight:600","code, kbd, samp, pre":"font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;",code:"background: color-mix(in oklab, $s-text, $s-bg 86%); padding: 0.12em 0.34em; r:4px font-size:0.9em",pre:"background: color-mix(in oklab, $s-text, $s-bg 92%); p:$3 r: $s-radius; overflow:auto","pre code":"background:transparent p:0","img, svg, video, canvas":"max-width:100% h:auto",hr:"border:0 border-top: 1px solid $s-faint;","::placeholder":"color: $s-muted; opacity:1",":focus-visible":"outline: 2px solid $s-focus; outline-offset:2px",small:"color:$s-muted font-size:0.9em","@media (prefers-reduced-motion: reduce)":{"*, *::before, *::after":"transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; scroll-behavior: auto !important;"},":root":"--s-primary:#00a884 --s-danger:#dc5b41 --s-success:#00a884 --s-warning:#ef6b00 --s-link:#3f8cd8 --s-radius-sm:6px --s-radius:12px --s-radius-lg:18px --s-focus: color-mix(in srgb, $s-primary 38%, transparent); --s-gradient: linear-gradient(135deg, color-mix(in oklab, $s-primary, white 16%), color-mix(in oklab, $s-primary, black 14%));",":root, .s-s.neutral":"--s-accent:$s-primary --s-link-fg:$s-link",".s-s:not(.neutral)":"--s-bg:$s-primary border:0 --s-text:#eee --s-accent:#fff --s-link-fg:#eef --s-muted: color-mix(in srgb, #fff 70%, transparent); --s-faint: color-mix(in srgb, #fff 30%, transparent);",".s-s.danger":"--s-bg:$s-danger",".s-s.success":"--s-bg:$s-success",".s-s.warning":"--s-bg:$s-warning",".s-s.link":"--s-bg:$s-link",".s-s.primary":"--s-bg:$s-primary",":root, .s-s":"--s-muted: color-mix(in oklab, $s-text, $s-bg 42%); --s-faint: color-mix(in oklab, $s-text, $s-bg 80%); color:$s-text accent-color:$s-accent scrollbar-width:thin scrollbar-color: $s-faint transparent;",".s-s, body":"background: linear-gradient(170deg, color-mix(in oklab, $s-bg, white 9%), color-mix(in oklab, $s-bg, black 9%));",".s-s":"r:$s-radius",":where(.s-s.neutral)":"border: 1px solid $s-faint;",".s-s::-webkit-scrollbar, .s-s ::-webkit-scrollbar":"width:10px height:10px",".s-s::-webkit-scrollbar-track, .s-s ::-webkit-scrollbar-track":"background:transparent",".s-s::-webkit-scrollbar-thumb, .s-s ::-webkit-scrollbar-thumb":"background:$s-faint border-radius:99px border: 2px solid transparent; background-clip:padding-box",".s-s.shadow.neutral:not(.s-btn)":"box-shadow: 0 4px 14px rgba(0,0,0,0.13);",".s-s.extra-shadow.neutral:not(.s-btn)":"box-shadow: 0 18px 50px rgba(0,0,0,0.28);",".s-s.shadow:not(.neutral):not(.tonal):not(.outlined)":"box-shadow: 0 4px 14px color-mix(in srgb, $s-bg 30%, transparent);",".s-s.extra-shadow:not(.neutral):not(.tonal):not(.outlined)":"box-shadow: 0 14px 40px color-mix(in srgb, $s-bg 40%, transparent);",".s-s.no-shadow":"box-shadow: none !important;",".s-s:not(.neutral).tonal, .s-s:not(.neutral).outlined":"--s-text:$s-bg --s-accent:$s-bg --s-link-fg:$s-bg --s-faint: color-mix(in srgb, $s-bg 30%, transparent); --s-muted: color-mix(in srgb, $s-bg 70%, transparent);",".s-s:not(.neutral).tonal":"background: color-mix(in srgb, $s-bg 15%, transparent); border: 1px solid $s-faint;",".s-s:not(.neutral).outlined":"background: transparent; border: 1px solid color-mix(in srgb, $s-bg 45%, transparent);",".s-s:not(.neutral) .s-s.tonal, .s-s:not(.neutral) .s-s.outlined":"--s-text:#fff --s-accent:#fff --s-link-fg:#fff background: linear-gradient(170deg, color-mix(in oklab, $s-bg, white 9%), color-mix(in oklab, $s-bg, black 9%)); border-color: transparent;"});S.insertGlobalCss({".s-preload, .s-preload *, .s-preload *::before, .s-preload *::after":"transition: none !important; animation: none !important;"});if(typeof document<"u"&&typeof requestAnimationFrame=="function"){let e=document.documentElement;e.classList.add("s-preload"),requestAnimationFrame(()=>requestAnimationFrame(()=>e.classList.remove("s-preload")))}S.insertGlobalCss({":disabled, [aria-disabled=true]":"opacity:0.45 filter:saturate(0.6) user-select:none",":disabled, [aria-disabled=true], :disabled *, [aria-disabled=true] *":"pointer-events:none cursor:not-allowed"});var De="p, ul, ol, dl, blockquote, pre, table, figure, hr, h1, h2, h3, h4, h5, h6";S.insertGlobalCss({[`${De}`]:{"&":"margin:0","&:not(:first-child)":"margin-top:$3"},"h1, h2, h3, h4, h5, h6":{"&":"line-height:1.15 font-weight:700 text-wrap:balance","&:not(:first-child)":"margin-top:1.4em"},h1:"font-size:2em font-weight:800 letter-spacing:-0.022em",h2:"font-size:1.55em letter-spacing:-0.018em",h3:"font-size:1.3em letter-spacing:-0.011em",h4:"font-size:1.1em",h5:"font-size:0.95em letter-spacing:0.005em",h6:"font-size:0.8em fg:$s-muted text-transform:uppercase letter-spacing:0.07em","ul, ol":{"&":"padding-left:1.5em","> li:not(:first-child), li > &:not(:first-child)":"margin-top:$1"},blockquote:"border-left: 3px solid $s-faint; padding-left: $3; fg: $s-muted",table:"border-collapse:collapse","th, td":"text-align:left padding: $1 $2; border-bottom: 1px solid $s-faint; vertical-align:top",th:"font-weight:600","thead th":"border-bottom: 2px solid $s-faint;",dt:"font-weight:600",dd:"margin-left: 1.5em",figcaption:"fg:$s-muted font-size:0.9em margin-top:$1 text-align:center"});import d from"aberdeen";import Ee from"aberdeen";var U=640,Ge=0;function F(e="s"){return`${e}-${++Ge}`}function f(e,...t){e!=null&&(typeof e=="function"?e(...t):Ee("rich=",e))}var je="a[href], button, input, select, textarea, [tabindex]";function V(e,t){let n=i=>i instanceof HTMLElement&&!i.hasAttribute("disabled")&&i.getAttribute("aria-disabled")!=="true"&&i.tabIndex>=0&&i.getClientRects().length>0,o=(t?[...e.querySelectorAll(t)].find(n):void 0)??[...e.querySelectorAll(je)].find(n);return o?.focus(),o!=null}function I(e){queueMicrotask(()=>Ee(e))}import T from"aberdeen";T.insertGlobalCss({".s-field":{"&":"display:flex flex-direction:column gap:$1","> label":"font-weight:600 font-size:0.9em fg:$s-text user-select:none"},".s-req":"fg:$s-danger margin-left:2px",".s-help":"font-size:0.82em fg:$s-muted",".s-error":"font-size:0.82em fg:$s-danger",".s-input":{"&":"w:100% background: color-mix(in oklab, $s-bg, $s-text 4%); color:$s-text border: 1px solid $s-faint; r:$s-radius padding: 0.55em 0.7em; transition: border-color 0.15s, box-shadow 0.15s;","&:hover:not(:disabled)":"border-color: color-mix(in oklab, $s-text, $s-bg 55%);","&:focus-visible":"border-color:$s-accent box-shadow: 0 0 0 3px $s-focus; outline:none","&[aria-invalid=true]":"border-color:$s-danger"}});function B(e,t){let n=e.id??F("field"),o=()=>!!e.error;T("div.s-field",e.attrs,()=>{T(()=>{e.label!=null&&T(`label for=${n}`,()=>{f(e.label),e.required&&T("span.s-req aria-hidden=true #*")})}),t(n,o),T(()=>{e.help!=null&&!e.error&&T("div.s-help",()=>f(e.help))}),T(()=>{e.error&&T("div.s-error role=alert #",e.error)})})}function Y(e,t,n,o){T(`id=${t}`),e.name&&T(`name=${e.name}`),T(()=>{e.disabled&&T("disabled=true")}),T(()=>{e.required&&T("aria-required=true")}),T(()=>T("aria-invalid=",n()?"true":"false")),o&&T("bind=",o)}d.insertGlobalCss({".s-ac":{"&":"position:relative","> .s-control":"display:flex flex-wrap:wrap align-items:center gap:$1 background: color-mix(in oklab, $s-bg, $s-text 4%); color:$s-text border: 1px solid $s-faint; r:$s-radius padding: 0.3em 0.4em; cursor:text; transition: border-color 0.15s, box-shadow 0.15s;","> .s-control:hover":"border-color: color-mix(in oklab, $s-text, $s-bg 55%);","> .s-control:focus-within":"border-color:$s-accent box-shadow: 0 0 0 3px $s-focus;","&[aria-invalid=true] > .s-control":"border-color:$s-danger",".s-chip":"display:inline-flex align-items:center gap:$1 font-size:0.85em background: color-mix(in oklab, $s-bg, $s-text 10%); border: 1px solid $s-faint; r:$s-radius padding: 0.1em 0.2em 0.1em 0.5em;",".s-chip > button":"cursor:pointer border:0 background:transparent fg:$s-muted font-size:1.1em line-height:1 padding: 0 0.2em; r:4px",".s-chip > button:hover":"fg:$s-text background:$s-faint",input:"flex:1 min-width:6ch border:0 background:transparent color:inherit outline:none padding:0.25em","> .s-menu":"position:absolute top:100% left:0 right:0 z-index:20 margin-top:4px max-height:15rem overflow-y:auto list-style:none p:$1 margin-bottom:0","> .s-menu li":"margin:0",".s-option":"padding: 0.45em 0.6em; r:6px cursor:pointer transition: background 0.1s;",".s-option[aria-selected=true]":"background: color-mix(in srgb, $s-text 10%, transparent);",".s-add":"fg:$s-accent font-style:italic",".s-empty":"padding: 0.45em 0.6em; fg:$s-muted"}});function We(e){return typeof e=="string"?{value:e,label:e}:{value:e.value,label:e.label??e.value}}function Ne(e){let t=F("ac-menu"),n=d.proxy({query:"",open:!1,active:0}),o=()=>(typeof e.options=="function"?e.options():e.options).map(We),i=()=>{let u=e.bind?.value;return u==null||u===""?[]:Array.isArray(u)?u:[u]},r=u=>o().find(b=>b.value===u)?.label??u;if(!e.multi){let u=e.bind?d.peek(e.bind,"value"):void 0;typeof u=="string"&&u&&(n.query=d.peek(()=>r(u)))}let s=()=>{let u=new Set(i()),b=o();e.multi&&(b=b.filter(m=>!u.has(m.value)));let c=n.query.trim().toLowerCase();return c&&(b=b.filter(m=>m.label.toLowerCase().includes(c))),b},a=(u,b)=>{if(e.multi){let c=Array.isArray(e.bind?.value)?[...e.bind.value]:[];c.includes(u)||c.push(u),e.bind&&(e.bind.value=c),n.query=""}else e.bind&&(e.bind.value=u),n.query=r(u),n.open=!1;n.active=0,b?.focus()},l=u=>{if(!e.bind)return;let b=e.bind.value??[];e.bind.value=b.filter(c=>c!==u)};B(e,(u,b)=>{d("div.s-ac",e.inputAttrs,()=>{d(()=>d("aria-invalid=",b()?"true":"false"));let c;d("div.s-control",()=>{d("click=",()=>c?.focus()),d(()=>{if(e.multi)for(let m of i())d("span.s-chip",()=>{d("span #",d.peek(()=>r(m))),d("button type=button aria-label=",`Remove ${m}`,()=>{d("#\xD7"),d("click=",x=>{x.stopPropagation(),l(m),c?.focus()})})})}),c=d("input type=text role=combobox autocomplete=off",()=>{d(`id=${u} aria-controls=${t} aria-autocomplete=list`),e.placeholder!=null&&d("placeholder=",e.placeholder),e.disabled&&d("disabled=true"),e.required&&d("aria-required=true"),d("bind=",d.ref(n,"query")),d(()=>d("aria-expanded=",n.open?"true":"false")),d(()=>{let x=s()[n.active];d("aria-activedescendant=",n.open&&x?`${t}-opt-${n.active}`:"")}),d("input=",()=>{n.open=!0,n.active=0}),d("focus=",()=>{n.open=!0}),d("blur=",()=>{setTimeout(()=>y(),150)}),d("keydown=",m=>g(m,c))})}),d(()=>{if(!n.open)return;let m=s(),x=n.query.trim(),z=e.allowCustom!==!1&&x!==""&&!m.some(X=>X.label.toLowerCase()===x.toLowerCase());d("ul.s-menu.s-s.neutral.shadow role=listbox",`id=${t}`,()=>{m.forEach((X,ue)=>{d("li.s-option role=option",`id=${t}-opt-${ue}`,()=>{d(()=>d("aria-selected=",n.active===ue?"true":"false")),d("#",X.label),d("mousedown=",Fe=>Fe.preventDefault()),d("click=",()=>a(X.value,c)),d("mousemove=",()=>{n.active=ue})})}),z&&d("li.s-option.s-add role=option",()=>{d("#",`Add "${x}"`),d("mousedown=",X=>X.preventDefault()),d("click=",()=>a(x,c))}),m.length===0&&!z&&d("li.s-empty #No matches")})}),d(()=>{if(e.name)if(e.multi)for(let m of i())d("input type=hidden",()=>{d("name=",e.name),d("value=",m)});else d("input type=hidden",()=>{d("name=",e.name),d("value=",i()[0]??"")})})})});function g(u,b){let c=s(),m=c.length-1;if(u.key==="ArrowDown")u.preventDefault(),n.open=!0,n.active=Math.min(m,n.active+1);else if(u.key==="ArrowUp")u.preventDefault(),n.active=Math.max(0,n.active-1);else if(u.key==="Enter"){u.preventDefault();let x=c[n.active];x?a(x.value,b):e.allowCustom!==!1&&n.query.trim()?a(n.query.trim(),b):n.open&&(n.open=!1)}else if(u.key==="Escape")n.open&&(u.preventDefault(),n.open=!1,e.multi||(n.query=r(i()[0]??"")));else if(u.key==="Backspace"&&e.multi&&n.query===""){let x=i();x.length&&l(x[x.length-1])}}function y(){n.open=!1,e.multi?n.query="":e.allowCustom!==!1&&n.query.trim()?a(n.query.trim()):n.query=r(i()[0]??"")}}import L from"aberdeen";import h from"aberdeen";import*as k from"aberdeen/route";var me={integer(e){if(!/^(0|-?[1-9]\d*)$/.test(e))return;let t=Number(e);return Number.isSafeInteger(t)?t:void 0}};function j(e){let t=String(e).replace(/\/+$/,"");return t.startsWith("/")||(t=`/${t}`),t}function Z(e){let t=j(e);return t==="/"?[]:t.slice(1).split("/")}function Ae(e){let t=Z(e),n=t.map((o,i)=>{if(!o.startsWith("[")||!o.endsWith("]"))return{kind:"lit",value:o};let r=/^\[\.\.\.([A-Za-z_$][\w$]*)\]$/.exec(o);if(r){if(i!==t.length-1)throw new Error(`Staffa: "${o}" must be the last segment of route "${e}"`);return{kind:"rest",name:r[1]}}let s=/^\[([A-Za-z_$][\w$]*)(?:=([A-Za-z_$][\w$]*))?\]$/.exec(o);if(!s)throw new Error(`Staffa: malformed param "${o}" in route "${e}"`);let[,a,l]=s;if(l&&!(l in me))throw new Error(`Staffa: unknown matcher "${l}" in route "${e}" (known: ${Object.keys(me).join(", ")})`);return{kind:"param",name:a,matcher:l}});return{key:e,segs:n}}function Ke(e){try{return decodeURIComponent(e)}catch{return e}}function fe(e,t){let n={};for(let o=0;o<e.segs.length;o++){let i=e.segs[o];if(i.kind==="rest")return o>=t.length?null:(n[i.name]=t.slice(o).join("/"),n);if(o>=t.length)return null;let r=t[o];if(i.kind==="lit"){if(r!==i.value)return null}else if(i.matcher){let s=me[i.matcher](r);if(s===void 0)return null;n[i.name]=s}else n[i.name]=Ke(r)}return e.segs.length===t.length?n:null}var Oe=450,_e=300,Xe=1280,ae=24,Ue=360,Te=2;h.insertGlobalCss({":root":`--s-panel-ms:${Oe}ms`,".s-panels":"flex:1 min-width:0 min-height:0 position:relative overflow:hidden isolation:isolate",".s-panel":{"&":"position:absolute top:0 bottom:0 left:0 display:flex flex-direction:column visibility:visible transition: left var(--s-panel-ms) ease, transform var(--s-panel-ms) ease-out, opacity var(--s-panel-ms) linear, visibility 0s;","> .s-content":"flex:1 min-height:0 overflow-y:auto overflow-x:hidden p:$3","> .s-content.s-scroll-y":"margin-right:$3","&.s-panel-sep::before":`content:'' position:absolute left:-${ae/2}px top:0.6rem bottom:0.6rem width:1px background: linear-gradient(to bottom, transparent, $s-faint 18%, $s-faint 82%, transparent);`,"&.s-panel-enter":"opacity:0 transition:none transform: translateX(8cqw);","&.s-panel-closing":"opacity:0 pointer-events:none transform: translateX(8cqw);","&.s-panel-hidden":"opacity:0 visibility:hidden transform: translateX(-8cqw); transition: left var(--s-panel-ms) ease, transform var(--s-panel-ms) ease-out, opacity var(--s-panel-ms) linear, visibility var(--s-panel-ms);"},".s-main.s-shell-snap .s-panel":"transition:none",[`@container (max-width: ${U}px)`]:{".s-panel > .s-content.s-scroll-y":"margin-right:0"},".s-panel-loading":{"&":"position:absolute inset:0 display:flex align-items:center justify-content:center gap:$1 pointer-events:none",i:"width:0.5rem height:0.5rem r:50% background:$s-muted opacity:0.45 animation: s-panel-pulse 1s ease-in-out infinite;","i:nth-child(2)":"animation-delay:0.15s","i:nth-child(3)":"animation-delay:0.3s"},"@keyframes s-panel-pulse":{"0%, 100%":"opacity:0.25 transform:scale(0.8)","50%":"opacity:0.7 transform:scale(1)"}});var P=null,le=class{compiled;ancestors;opts;live=[];byId=new Map;nextId=1;$ids=h.proxy({});$state=h.proxy({paths:[],topId:0});containerEl;geom;lastBodyW=-1;layoutQueued=!1;timers=new Set;intent=null;settling=null;queued=null;constructor(t){if(P)throw new Error("Staffa: only one routed S.main() (one with `routes`) can be active at a time");P=this,this.opts=t,this.compiled=Object.entries(t.routes).map(([o,i])=>({...Ae(o),draw:i})),this.ancestors=Object.entries(t.ancestors??{}).filter(o=>o[1]!=null).map(([o,i])=>({...Ae(o),fn:i}));let n=k.setGuard((o,i)=>{let r=n?n(o,i):!0;return r===!1?!1:r===!0?this.checkChange(o):r.then(s=>s===!1?!1:this.checkChange(o))});h(()=>{let o=this.computeTarget();h.peek(()=>this.propose(o))}),this.interceptLinks(),this.watchTitle(),h.clean(()=>{for(let o of this.timers)clearTimeout(o);this.timers.clear(),this.queued?.settle(!1),this.queued=null,k.setGuard(n),P===this&&(P=null)})}resolve(t){let n=Z(t);for(let o of this.compiled){let i=fe(o,n);if(i)return{draw:o.draw,params:i}}return{draw:this.opts.notFound??Je,params:{}}}matches(t){let n=Z(t);return this.compiled.some(o=>fe(o,n)!=null)}deriveStack(t){let n=j(t),o=this.askAncestors(n),i=o?o.map(j):this.prefixesOf(n),r=[];for(let s of i)s!==n&&!r.includes(s)&&this.matches(s)&&r.push(s);return r.push(n),r}askAncestors(t){let n=Z(t);for(let o of this.ancestors){let i=fe(o,n);if(i)return o.fn(i,t)??void 0}}prefixesOf(t){let n=Z(t),o=[];for(let i=1;i<n.length;i++)o.push("/"+n.slice(0,i).join("/"));return o}targetFor(t,n){return Array.isArray(n)?n.map(String).concat(j(t)):this.deriveStack(t)}computeTarget(){return this.targetFor(k.current.path,k.current.state.panels)}checkChange(t){let n=this.removedBy(this.targetFor(t.path,t.state.panels));return n.length?Ye(n):!0}paths(){return this.live.map(t=>t.path)}removedBy(t){return this.live.filter(n=>!t.includes(n.path))}propose(t){Qe(this.paths(),t)||this.commit(t,h.peek(k.current,"nav"))}commit(t,n){this.geom=void 0;let o=new Map(this.live.map(r=>[r.path,r])),i=[];for(let r of t){let s=o.get(r);if(s){o.delete(r),i.push(s);continue}let a=this.createEntry(r,i.length);n!=="load"&&n!=="back"&&(a.enter=!0),i.push(a),this.byId.set(a.id,a)}for(let r of o.values())this.beginClose(r);this.live=i,h.merge(this.$state,{paths:this.paths(),topId:this.live.length?this.live[this.live.length-1].id:0});for(let r of this.live)this.$ids[String(r.id)]=r.order;this.scheduleLayout()}createEntry(t,n){let{draw:o,params:i}=this.resolve(t),r={id:this.nextId++,order:n,path:t,draw:o,$ui:h.proxy({holding:!1}),layout:"medium",width:0};return r.$page=h.proxy({params:i,path:t,close:()=>this.closePath(r.path)}),r}beginClose(t){t.closing=!0,t.el&&(t.el.style.zIndex=String(Te*this.live.indexOf(t))),this.byId.delete(t.id),delete this.$ids[String(t.id)]}playExit(t,n){if(!t.closing){n.remove();return}n.classList.add("s-panel-closing"),n.setAttribute("inert","");let o=()=>{clearTimeout(i),this.timers.delete(i),n.remove()};n.addEventListener("transitionend",r=>{r.target===n&&r.propertyName==="opacity"&&o()});let i=setTimeout(o,Oe+80);this.timers.add(i)}intended(){return this.intent??this.paths()}issue(t,n){return this.intent=t,this.settling?(this.queued?.settle(!1),new Promise(o=>{this.queued={run:n,settle:o}})):this.start(n)}start(t){let n=i=>{this.settling=null;let r=this.queued;return this.queued=null,i&&r?this.start(r.run).then(r.settle,()=>r.settle(!1)):(this.intent=null,r?.settle(!1)),i},o=Promise.resolve(t()).then(n,i=>(console.error(i),n(!1)));return this.settling=o,o}goBackTo(t){return this.issue(t,()=>k.back({path:t[t.length-1]},{state:{panels:t.slice(0,-1)}}))}closeDownTo(t){let n=this.intended();return t<0||t>=n.length-1?Promise.resolve(!1):this.goBackTo(n.slice(0,t+1))}closeTop(){return this.closeDownTo(this.intended().length-2)}closePath(t){let n=this.intended(),o=n.indexOf(j(t));if(o<0)return Promise.resolve(!1);if(o===n.length-1)return this.closeDownTo(o-1);let i=n.filter((r,s)=>s!==o);return this.issue(i,()=>k.go({path:i[i.length-1],search:h.peek(()=>({...k.current.search})),hash:h.peek(k.current,"hash"),state:{panels:i.slice(0,-1)}}))}closePanelEl(t){let n=this.live.find(o=>o.el===t);return n?this.closePath(n.path):Promise.resolve(!1)}navigate(t,n,o=!1,i){let r;try{r=new URL(t,location.href)}catch{return}let s=j(r.pathname),a=Object.fromEntries(new URLSearchParams(r.search)),l=r.hash,g=this.intended(),y=g.indexOf(s);if(y>=0&&y<g.length-1&&!i){this.closeDownTo(y);return}if(y>=0&&!i){if(r.search===location.search&&(r.hash||"")===(location.hash||""))return;this.issue(g,()=>k.go({path:s,search:a,hash:l,state:{panels:g.slice(0,-1)}}));return}let u=n==null?-1:g.indexOf(n),b=i?i.map(j).filter(c=>c!==s):u<0?this.deriveStack(s).slice(0,-1):g.slice(0,o?u:u+1);this.issue([...b,s],()=>k.go({path:s,search:a,hash:l,state:{panels:b}}))}pushPath(t,n){let o=this.intended();this.navigate(t,o[o.length-1]??null,n)}openPath(t,n){this.navigate(t,null,!1,n)}interceptLinks(){k.interceptLinks((t,n)=>{let o=n.closest(".s-panel"),i=o?this.live.find(r=>r.el===o):void 0;return this.navigate(t.href,i?.path??null,n.getAttribute("data-panel")==="replace"),!0})}watchTitle(){let t=document.title;h(()=>{let o=this.byId.get(this.$state.topId)?.$page.title,i=typeof this.opts.title=="string"?this.opts.title:void 0,r=o&&i?`${o} \xB7 ${i}`:o||i;r&&(document.title=r)}),h.clean(()=>{document.title=t})}drawStack(){let t=h("div.s-panels role=main",()=>{this.containerEl=h(),h.onEach(this.$ids,(n,o)=>this.drawPanel(Number(o)),(n,o)=>[n,Number(o)])});if(typeof ResizeObserver<"u"){let n=new ResizeObserver(()=>this.layout());n.observe(t);let o=t.parentElement?.parentElement;o&&n.observe(o),h.clean(()=>n.disconnect())}h.clean(()=>{this.containerEl===t&&(this.containerEl=void 0)}),this.scheduleLayout()}drawPanel(t){let n=this.byId.get(t);if(!n)return;let o;h(()=>{let i=n.$page.layout;n.layout=i==="small"||i==="large"?i:"medium";let r=this.roomFor(n.layout);r&&(n.width=r,o&&(o.style.width=`${r}px`,this.scheduleLayout()))}),o=h(`section.s-panel${n.width?` w:${n.width}px`:""}`,"destroy=",i=>this.playExit(n,i),()=>{let i=h("div.s-content",()=>{n.draw(n.$page),k.persistScroll(n.path)});Ze(i),h(()=>{!n.$page.loading||n.$ui.holding||h("div.s-panel-loading aria-hidden=true",()=>{h("i"),h("i"),h("i")})})}),n.el=o,n.placed=!1,o.style.transition="none",h.clean(()=>{n.el===o&&(n.el=void 0)}),h(()=>{n.$page.loading,this.scheduleLayout()}),this.scheduleLayout()}scheduleLayout(){this.layoutQueued||(this.layoutQueued=!0,requestAnimationFrame(()=>{this.layoutQueued=!1,this.layout()}))}measure(){let t=this.containerEl,n=t?.parentElement,o=n?.parentElement;if(!t||!n||!o)return;let i=o.getBoundingClientRect().width;if(!i)return;let r=0;for(let l of n.children)l!==t&&(r+=l.getBoundingClientRect().width);let s=Math.max(0,Math.min(Xe,i)-r),a=(s-ae)/2;return{total:i,chrome:r,small:a>=Ue?a:s,medium:s,large:Math.max(0,i-r)}}geometry(){return this.geom??=this.measure()}roomFor(t){return this.geometry()?.[t]??0}layout(){let t=this.containerEl,n=t?.closest(".s-main");if(!t||!n)return;let o=this.live.length;if(!o||this.live.some(c=>!c.el))return;this.geom=void 0;let i=this.geometry();if(!i)return;let r=this.opts.stacking!==!1,s=this.lastBodyW!==i.total;s&&(this.lastBodyW=i.total,n.classList.add("s-shell-snap"));let a=c=>i[c.layout],l=o-1,g=a(this.live[l]);if(r)for(let c=o-2;c>=0;c--){let m=g+ae+a(this.live[c]);if(m>i.large)break;g=m,l=c}let y=Math.min(i.large,Math.max(i.medium,g));for(let c=l;c<o;c++)this.live[c].width=a(this.live[c]);for(let c of this.live)c.width||(c.width=a(c));n.style.setProperty("--s-shell-w",`${i.chrome+y}px`);let u=[],b=0;for(let c=0;c<o;c++){let m=this.live[c],x=m.el,z=c>=l;Ve(x,z?b:0,m.width,Te*c+1),z&&(b+=m.width+ae),x.classList.toggle("s-panel-sep",z&&c>l),x.classList.toggle("s-panel-hidden",!z),x.toggleAttribute("inert",!z),!m.placed&&(u.push(m),!h.peek(m.$page,"loading")||m.holdDone?m.$ui.holding=!1:m.$ui.holding||(m.$ui.holding=!0,this.holdEnter(m)),m.enter&&z&&x.classList.add("s-panel-enter"))}(u.length||s)&&t.offsetWidth,s&&n.classList.remove("s-shell-snap");for(let c of u)c.$ui.holding||(c.el.style.transition="",c.el.classList.remove("s-panel-enter"),c.enter=!1,c.placed=!0)}holdEnter(t){let n=setTimeout(()=>{this.timers.delete(n),t.holdDone=!0,t.$ui.holding&&(t.$ui.holding=!1,this.scheduleLayout())},_e);this.timers.add(n)}};function Ve(e,t,n,o){e.style.left=`${t}px`,e.style.width=`${n}px`,e.style.zIndex=String(o)}function Ye(e){let t=[...e].reverse(),n=0,o=()=>{for(;n<t.length;){let i=h.peek(t[n++].$page,"requestClose");if(!i)continue;let r;try{r=i()}catch(s){return console.error(s),!1}if(r===!1)return!1;if(r!==!0)return Promise.resolve(r).then(s=>s===!1?!1:o())}return!0};return o()}function Qe(e,t){return e.length===t.length&&e.every((n,o)=>n===t[o])}function Je(e){h("p fg:$s-muted",()=>h("#",`No page at ${e.path}`))}function Ze(e){if(typeof ResizeObserver>"u")return;let t=()=>e.classList.toggle("s-scroll-y",e.offsetWidth>e.clientWidth),n=new ResizeObserver(t);n.observe(e),e.firstElementChild&&n.observe(e.firstElementChild),t(),h.clean(()=>n.disconnect())}var et={push(e){se().pushPath(e,!1)},replace(e){se().pushPath(e,!0)},open(e,t){se().openPath(e,t)},close(e){let t=se();return e==null?t.closeTop():t.closePath(e)},get stack(){return P?P.$state.paths:[]}};function se(){if(!P)throw new Error("Staffa: S.panels needs a routed S.main() (one with `routes`) to be mounted");return P}function Me(e){let t=e?.closest(".s-panel");return!P||!t?(console.warn("Staffa: `close: true` needs to be drawn inside a panel of a routed S.main()"),Promise.resolve(!1)):P.closePanelEl(t)}L.insertGlobalCss({".s-box":{"&":"display:flex flex-direction:column overflow:hidden r: $s-radius-lg; position:relative","&:not(:first-child)":"margin-top: $3","> header":"display:flex align-items:center gap:$2 padding: $2 $3; border:0 border-bottom: 1px solid $s-faint; r:0 font-weight:600","> footer":"display:flex align-items:center justify-content:flex-end gap:$2 padding: $2 $3; border:0 border-top: 1px solid $s-faint; r:0","> div":"p:$3 gap:$3",".s-box-close":"flex-shrink:0 margin-left:auto display:flex align-items:center justify-content:center width:1.6rem height:1.6rem p:0 border:0 background:transparent cursor:pointer fg:$s-muted font-size:0.95rem line-height:1 r:$s-radius-sm transition: color 0.12s, background 0.12s;",".s-box-close:hover":"fg:$s-text background: color-mix(in srgb, $s-text 8%, transparent);","> .s-box-close":"position:absolute top:$2 right:$2 z-index:1"}});function tt(e={}){let t=typeof e=="string"||typeof e=="function"?{content:e}:e;L("section.s-box.s-s.neutral.shadow",t.attrs,()=>{L(()=>{t.header!=null?L("header.s-s.neutral",t.headerAttrs,()=>{f(t.header),t.close&&Se(t.close)}):t.close&&Se(t.close)}),L("div",t.contentAttrs,()=>{f(t.content)}),L(()=>{t.footer!=null&&L("footer.s-s.neutral",t.footerAttrs,()=>f(t.footer))})})}function Se(e){L("button.s-box-close type=button aria-label=Close",()=>{L("click=",t=>{typeof e=="function"?e():Me(t.currentTarget)}),L("span aria-hidden=true #\u2715")})}import D from"aberdeen";D.insertGlobalCss({".s-btn":{"&":"display:inline-flex align-items:center justify-content:center gap:$2 font-weight:450 line-height:1.1 white-space:nowrap cursor:pointer text-decoration:none padding: $m2 $m3; transition: background 0.15s, border-color 0.15s, color 0.15s, filter 0.15s, box-shadow 0.15s, transform 0.08s;","&:focus-visible":"outline: 3px solid $s-focus; outline-offset: 1px;","&:hover":"filter: brightness(1.06)","&.tonal:hover, &.outlined:hover":"background: color-mix(in srgb, $s-bg 24%, transparent);","&.neutral:hover":"filter:none background: color-mix(in srgb, $s-text 8%, $s-bg);","&:active:not(:disabled)":"transform: translateY(1px)","&.small, .small > &":"padding: $m1 $m2; font-size:0.85em border-radius:$s-radius-sm","&.large, .large > &":"font-size:1.4em border-radius:$s-radius-lg"}});function O(e={}){let t=typeof e=="string"||typeof e=="function"?{content:e}:e,n=t.href!=null?"a":"button";D(`${n}.s-btn.s-s.shadow`,t.attrs,()=>{t.href!=null?(D(`href=${t.href} role=button`),t.disabled&&D("aria-disabled=true")):(D("type=",t.type??"button"),t.disabled&&D("disabled=true")),t.ariaLabel&&D("aria-label=",t.ariaLabel),t.click&&D("click=",t.click),f(t.icon),f(t.content)})}import he from"aberdeen";import Pe from"aberdeen";Pe.insertGlobalCss({".s-bgroup":{"&":"display:inline-flex align-items:stretch","&.s-spaced":"gap:$2 flex-wrap:wrap","&.s-vertical":"flex-direction:column","&.s-attached":"gap:0","&.s-attached:not(.s-vertical) > .s-btn:not(:first-child)":"margin-left:-1px","&.s-attached:not(.s-vertical) > .s-btn:not(:first-child):not(:last-child)":"r:0","&.s-attached:not(.s-vertical) > .s-btn:first-child:not(:last-child)":"border-top-right-radius:0 border-bottom-right-radius:0","&.s-attached:not(.s-vertical) > .s-btn:last-child:not(:first-child)":"border-top-left-radius:0 border-bottom-left-radius:0","&.s-attached.s-vertical > .s-btn:not(:first-child)":"margin-top:-1px","&.s-attached.s-vertical > .s-btn:not(:first-child):not(:last-child)":"r:0","&.s-attached.s-vertical > .s-btn:first-child:not(:last-child)":"border-bottom-left-radius:0 border-bottom-right-radius:0","&.s-attached.s-vertical > .s-btn:last-child:not(:first-child)":"border-top-left-radius:0 border-top-right-radius:0","&.s-attached > .s-btn:hover, &.s-attached > .s-btn:focus-visible":"z-index:1"}});function W(e={}){let n=`.s-${e.layout??"attached"}${e.vertical?".s-vertical":""}`;Pe(`div.s-bgroup${n} role=group`,e.attrs,()=>{if(e.buttons)for(let o of e.buttons)O(o);f(e.content)})}function nt(e){he(()=>{let t=e.bind.value;W({attrs:e.attrs,buttons:Object.entries(e.options).map(([n,o])=>({content:o,ariaLabel:typeof o=="function"?n:void 0,attrs:t===n?".primary":".neutral",click:()=>{e.bind.value=e.allowDeselect&&t===n?void 0:n}}))})}),e.name&&he(()=>he(`input type=hidden name=${e.name} value=`,e.bind.value??""))}import E from"aberdeen";E.insertGlobalCss({".s-check":{"&":"display:flex flex-direction:column gap:$1","> label":"display:flex align-items:center gap:$2 cursor:pointer user-select:none","> label:has(input:disabled)":"cursor:not-allowed opacity:0.45 filter:saturate(0.6)",input:"cursor:inherit m:0"}});function ot(e={}){let t=e.id??F("check");E("div.s-check",e.attrs,()=>{E(`label for=${t}`,()=>{E("input type=checkbox",e.inputAttrs,()=>{E(`id=${t}`),e.name&&E(`name=${e.name}`),e.checked&&!e.bind&&E("checked=true"),e.change&&E("change=",e.change),E(()=>{e.disabled&&E("disabled=true")}),E(()=>{e.required&&E("aria-required=true")}),e.bind&&E("bind=",e.bind)}),E(()=>{e.label!=null&&f(e.label),e.required&&E("span.s-req aria-hidden=true #*")})}),E(()=>{e.help!=null&&!e.error&&E("div.s-help",()=>f(e.help))}),E(()=>{e.error&&E("div.s-error role=alert #",e.error)})})}import N from"aberdeen";N.insertGlobalCss({".s-form":{"&":"display:flex flex-direction:column gap:$3","&.grid":"display:grid grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap:$3","&.grid > .s-wide, &.grid > footer":"grid-column: 1 / -1;","> footer":"display:flex align-items:center justify-content:flex-end gap:$2 flex-wrap:wrap margin-top:$1"}});function it(e={}){let t=typeof e=="string"||typeof e=="function"?{content:e}:e;N("form.s-form",t.attrs,()=>{N(()=>{N(".grid=",t.layout==="grid")}),N("submit=",n=>{if(n.preventDefault(),t.submit){let o=new FormData(n.target),i={};for(let r of new Set(o.keys())){let s=o.getAll(r);i[r]=s.length===1?s[0]:s}t.submit(i,n)}}),f(t.content),N(()=>{t.actions&&N("footer",t.actionsAttrs,()=>f(t.actions))})})}import p from"aberdeen";import{current as Re}from"aberdeen/route";import A from"aberdeen";import{matchCurrent as at,current as Le}from"aberdeen/route";import rt from"aberdeen";var ee={size:24,color:"currentColor",strokeWidth:2,cap:"round",join:"round"};function st(e,t){let n=t.size??ee.size,o=rt('svg.s-icon aria-hidden=true viewBox="0 0 24 24" fill=none',"width=",n,"height=",n,"stroke=",t.color??ee.color,"stroke-width=",t.strokeWidth??ee.strokeWidth,"stroke-linecap=",t.cap??ee.cap,"stroke-linejoin=",t.join??ee.join,t.attrs);o.innerHTML=e}function Q(e){return(t={})=>st(e,t)}var ge=Q('<path d="M4 6h16"/><path d="M4 12h16"/><path d="M4 18h16"/>'),Ce=Q('<path d="M18 6 6 18"/><path d="m6 6 12 12"/>');A.insertGlobalCss({".s-menu-list":"position:fixed z-index:350 min-width:10rem display:flex flex-direction:column p:$1 r:$s-radius-lg overflow-y:auto max-height:min(80vh,28rem) transition: opacity 0.15s, transform 0.15s;",".s-menu-list.hidden":"opacity:0 pointer-events:none transform:translateY(-6px)",".s-menu-item":"display:flex align-items:center gap:$2 w:100% outline:0 padding: $m2 0; line-height:1.1 r:$s-radius cursor:pointer text-align:left font-weight:450 font-size:0.9em border:0 background:transparent fg:$s-text text-decoration:none transition: color 0.12s, transform 0.12s, text-shadow 0.12s;",".s-menu-item:focus-visible:not([aria-current=page]), .s-menu-item:hover:not([aria-disabled=true]):not([aria-current=page])":"filter:none color: color-mix(in lab, $s-primary 33%, $s-text);",".s-menu-item[aria-current=page]":"color:$s-accent filter:none",".s-menu-item[aria-disabled=true]":"opacity:0.45 cursor:not-allowed pointer-events:none",".s-menu-icon":"flex-shrink:0","hr.s-menu-sep":"border:0 height:1px margin: $1 0.6rem; background: linear-gradient(to right, transparent, $s-faint 18%, $s-faint 82%, transparent);"});function de(e,t){A("keydown=",n=>{if(n.key==="Enter"&&n.target.tagName==="A"){queueMicrotask(()=>t?.());return}if(n.key!=="ArrowDown"&&n.key!=="ArrowUp"&&n.key!=="Home"&&n.key!=="End")return;n.preventDefault();let i=[...n.currentTarget.querySelectorAll(".s-menu-item")].filter(l=>l.getAttribute("aria-disabled")!=="true");if(!i.length)return;let r=i.indexOf(document.activeElement),s=n.key==="ArrowUp"?-1:1,a=n.key==="Home"?0:n.key==="End"?i.length-1:r<0?s>0?0:i.length-1:(r+s+i.length)%i.length;i[a].focus()});for(let n of e){if(typeof n=="string"||typeof n=="function"){f(n);continue}if("separator"in n){A("hr.s-menu-sep");continue}A(n.href?"a.s-menu-item":"button.s-menu-item type=button",n.attrs,()=>{n.href&&(A("href=",n.href),n.target&&A("target=",n.target),A(()=>{at(n.href)&&A("aria-current=page")})),n.disabled&&A("aria-disabled=true"),A("click=",o=>{if(n.disabled){o.preventDefault();return}t?.(),n.click?.(o)}),n.icon&&A("span.s-menu-icon",()=>f(n.icon)),f(n.label)})}}var G=A.proxy({opts:null});function q(){let e=G.opts?.anchor;G.opts=null,e?.focus()}function te(e){let t=G.opts;return t!=null&&(e==null||t.anchor===e)}function ne(e){te(e)&&q()}function lt(e,t){let n=e.offsetWidth,o=e.offsetHeight,i=window.innerWidth,r=window.innerHeight,s=4,a=t.left;a+n>i-8&&(a=Math.max(8,t.right-n));let l=t.bottom+s;l+o>r-8&&t.top-o-s>=8&&(l=t.top-o-s),e.style.left=Math.max(8,a)+"px",e.style.top=Math.max(8,l)+"px"}I(()=>{let e=G.opts;if(!e)return;let t=A("div.s-menu-list.s-s.neutral.shadow create=hidden destroy=hidden",e.dropdownAttrs,()=>{de(e.items,q)}),n=r=>{let s=r.target;!t.contains(s)&&(e.closeOnAnchorClick||!e.anchor.contains(s))&&q()},o=r=>{(r.key==="Escape"||r.key==="Tab")&&(r.preventDefault(),q())},i=A.peek(Le,"path");A(()=>{Le.path!==i&&q()}),document.addEventListener("click",n,!0),document.addEventListener("keydown",o,!0),A.clean(()=>{document.removeEventListener("click",n,!0),document.removeEventListener("keydown",o,!0)}),requestAnimationFrame(()=>{if(!document.body.contains(t))return;let r=e.at?{left:e.at.x,right:e.at.x,top:e.at.y,bottom:e.at.y}:e.anchor.getBoundingClientRect();lt(t,r),V(t,".s-menu-item[aria-current=page]")})});function oe(e){return G.opts=e,q}function dt(e){let t=null;A.clean(()=>{G.opts?.anchor===t&&q()}),A("contextmenu=",n=>{n.preventDefault(),t=n.currentTarget,oe({items:e.items,anchor:t,at:{x:n.clientX,y:n.clientY},closeOnAnchorClick:!0,dropdownAttrs:e.dropdownAttrs})})}function ct(e){let t=null;A.clean(()=>{G.opts?.anchor===t&&q()}),O({icon:()=>ge({size:"1.4em"}),...e.button?.content==null?{ariaLabel:"Open menu"}:null,attrs:".neutral",...e.button,click:n=>{if(t=n.currentTarget,G.opts?.anchor===t){q();return}oe({items:e.items,anchor:t,dropdownAttrs:e.dropdownAttrs})}})}import v from"aberdeen";import K from"aberdeen";function be(e={}){B(e,(t,n)=>{K("input.s-input",e.inputAttrs,()=>{K("type=",e.type??"text"),e.placeholder!=null&&K("placeholder=",e.placeholder),e.autocomplete!=null&&K("autocomplete=",e.autocomplete),e.value!=null&&!e.bind&&K("value=",e.value),e.input&&K("input=",e.input),e.change&&K("change=",e.change),Y(e,t,n,e.bind)})})}v.insertGlobalCss({".s-backdrop":{"&":"position:fixed inset:0 z-index:200 display:block background: rgba(0,0,0,0.55); transition: opacity 0.4s ease-in-out;","&.hidden":"opacity:0 pointer-events:none"},".s-dialog":{"&":"position:fixed z-index:200 top:50% left:50% display:flex flex-direction:column transform:translate(-50%,-50%) min-width:20rem max-width:min(90vw,44rem) max-height:min(88vh,800px) r: $s-radius-lg; overflow:hidden transition: opacity 0.2s ease-out, transform 0.2s ease-out;","> header":"display:flex align-items:center gap:$2 padding: $2 $3; border:0 border-bottom: 1px solid $s-faint; r:0 font-weight:600 flex-shrink:0","> footer":"display:flex align-items:center justify-content:flex-end gap:$2 padding: $2 $3; border:0 border-top: 1px solid $s-faint; r:0 flex-shrink:0","> div":"p:$3 gap:$3 display:flex flex-direction:column overflow-y:auto flex:1 min-height:0","&.hidden":"opacity:0 pointer-events:none transform: translate(-50%, calc(-50% + 20px)); pointer-events:none"}});var _=v.proxy({}),ve=0,He=v.derive(()=>{let e=Object.keys(_);if(e.length)return e[e.length-1]});function ye(){return He.value!=null}I(()=>{v.onEach(_,({resolve:e,opts:t},n)=>{let o=()=>{delete _[n]};v.clean(()=>{t.onClose?.(),e()});let i=v.derive(()=>He.value!=n);v("div.s-backdrop create=hidden destroy=hidden .hidden=",i,"click=",()=>{t.allowCancel!==!1&&o()});let r=v("div.s-dialog.neutral.s-s.extra-shadow create=hidden destroy=hidden",t.attrs,()=>{v(()=>{t.header!=null&&v("header.s-s.neutral",t.headerAttrs,()=>f(t.header))}),v("div",t.contentAttrs,()=>{f(t.content,o)}),v(()=>{t.footer!=null&&v("footer.s-s.neutral",t.footerAttrs,()=>f(t.footer))})});requestAnimationFrame(()=>{document.body.contains(r)&&V(r)})})});function ce(e){ve||document.addEventListener("keydown",n=>{if(n.key!=="Escape"||n.defaultPrevented)return;let o=v.unproxy(_);for(let i=ve;i>0;i--)if(o[i]){n.preventDefault(),o[i].opts.allowCancel!==!1&&delete _[i];break}});let t=++ve;return e.cancelWithScope!==!1&&v.clean(()=>{delete _[t]}),new Promise(n=>{_[t]={resolve:n,opts:e}})}function ut(e,t={}){return ce({header:"Alert",allowCancel:!0,content:n=>{v("p",()=>{v("#",e)}),W({layout:"spaced",attrs:"align-self:flex-end",content:()=>{O({content:"OK",click:n})}})},...t})}function pt(e,t={}){return new Promise(n=>{let o=!1;ce({header:"Confirm",allowCancel:!0,content:i=>{v("p",()=>{v("#",e)}),W({layout:"spaced",attrs:"align-self:flex-end",content:()=>{O({content:"Cancel",attrs:".neutral",click:i}),O({content:"OK",click:()=>{o=!0,i()}})}})},...t,onClose:()=>{n(o),t.onClose?.()}})})}function ft(e,t="",n={}){return new Promise(o=>{let i=null;ce({header:"Input",allowCancel:!0,content:r=>{v("p",()=>{v("#",e)});let s=v.proxy({value:t});v("form display:contents",()=>{v("submit=",a=>{a.preventDefault(),i=s.value,r()}),be({bind:v.ref(s,"value")}),W({layout:"spaced",attrs:"align-self:flex-end",content:()=>{O({content:"Cancel",attrs:".neutral",type:"button",click:r}),O({content:"OK",type:"submit"})}})})},...n,onClose:()=>{o(i),n.onClose?.()}})})}p.insertGlobalCss({".s-main":{"&":"display:flex flex-direction:column min-height:100vh max-height:100vh container-type:inline-size","body > &":"margin: calc(-1 * $3)","> header":"border:0 border-bottom: 1px solid $s-faint; r:0 position:sticky top:0 z-index:10","> footer":"border-top: 1px solid $s-faint; fg:$s-muted","> header > .s-bar, > footer > .s-bar":"display:flex align-items:center width:100% margin-inline:auto gap:$3 padding: $2 $3;","> header .s-header-icon":"display:flex align-items:center font-size:1.4em background: $s-gradient; -webkit-background-clip:text; background-clip:text; color:transparent;","> header .s-titles":"display:flex flex-direction:column min-width:0 flex:1","> header .s-title":"font-weight:800 font-size:1.1em line-height:1.2 overflow:hidden text-overflow:ellipsis white-space:nowrap letter-spacing:-0.01em background: $s-gradient; -webkit-background-clip:text; background-clip:text; color:transparent; width:fit-content max-width:100%","> header .s-subtitle":"fg:$s-muted font-size:0.85em overflow:hidden text-overflow:ellipsis white-space:nowrap","> header .s-menu":"display:flex align-items:center gap:$2",".s-body":"flex:1 overflow:hidden display:flex flex-direction:row min-height:0 justify-content:center position:relative",".s-body-inner":"flex:1 min-width:0 display:flex flex-direction:row min-height:0","&.s-nav-right .s-body-inner":"flex-direction:row-reverse",".s-nav-sep":"width:1px flex-shrink:0 align-self:stretch margin: 0.6rem 0; border:0 background: linear-gradient(to bottom, transparent, $s-faint 18%, $s-faint 82%, transparent);",".s-body main":"flex:1 min-width:0 min-height:0 overflow-x:hidden overflow-y:auto display:flex flex-direction:column transition: transform 0.3s ease;",".s-body main.s-slide-in":"transform: translateX(100%); transition:none",".s-body main > .s-content":"width:100% flex:1 p:$3",".s-body main.s-scroll-y":"margin-right:$3","&.s-routed > .s-body > .s-body-inner":"max-width: var(--s-shell-w, 100%);","&.s-routed > header > .s-bar":"max-width: var(--s-shell-w, 100%);","&.s-routed > footer > .s-bar":"max-width: var(--s-shell-w, 100%);","&.s-routed > .s-body > .s-body-inner, &.s-routed > header > .s-bar, &.s-routed > footer > .s-bar":"transition: max-width var(--s-panel-ms) ease;","&.s-routed.s-shell-snap > .s-body > .s-body-inner, &.s-routed.s-shell-snap > header > .s-bar, &.s-routed.s-shell-snap > footer > .s-bar":"transition:none"},".s-nav-panel":{"&":"display:flex flex-direction:column overflow-y:auto flex-shrink:0 max-width:228px padding:$3 gap:$1"},".s-nav-page":{"&":"position:absolute inset:0 z-index:5 display:flex flex-direction:column overflow-y:auto overscroll-behavior:contain border:0 r:0 padding:$2 gap:$1 transition: transform 0.3s ease;","&.s-nav-page-off":"transform:translateX(-100%) pointer-events:none",".s-menu-item":"padding: $2 $3; min-height:3rem font-size:1.05em gap:$3"},".s-main.s-nav-left .s-nav-trigger, .s-main.s-nav-right .s-nav-trigger":"display:none",".s-main.s-nav-btn-only .s-nav-panel":"display:none",".s-main.s-nav-btn-only .s-nav-trigger":"display:flex",[`@container (max-width: ${U}px)`]:{".s-main.s-nav-left .s-nav-panel, .s-main.s-nav-right .s-nav-panel, .s-main .s-nav-sep":"display:none",".s-main.s-nav-left .s-nav-trigger, .s-main.s-nav-right .s-nav-trigger":"display:flex",".s-content > .s-box":"margin-inline: calc(-1 * $3); r:0 border-inline:0",".s-main .s-body main.s-scroll-y":"margin-right:0"}});function mt(e={}){let t=e.nav,n=e.navPosition??"left",o=p.proxy({open:!1}),i=e.routes;if(i!=null&&e.content!=null)throw new Error("Staffa: S.main() takes either `content` or `routes`, not both");let r=i?new le({routes:i,notFound:e.notFound,ancestors:e.ancestors,stacking:e.stacking,title:e.title}):null,s=r?null:e.maxWidth,a=p(`div.s-main${r?".s-routed":""}`,e.attrs,()=>{p(()=>{t==null||!t.items.length||p(n==="button"?".s-nav-btn-only":`.s-nav-${n}`)}),p(()=>{(e.title!=null||e.subtitle!=null||e.icon!=null||e.menu!=null||t!=null&&t.items.length>0)&&p("header.s-s.neutral",e.topbarAttrs,()=>{p("div.s-bar",()=>{p(()=>{s!=null&&p("max-width:",s)}),p(()=>{t==null||!t.items.length||p("div.s-nav-trigger",()=>gt(t,o))}),p(()=>{e.icon!=null&&p("div.s-header-icon",()=>f(e.icon))}),p("div.s-titles",()=>{p(()=>{e.title!=null&&p("div.s-title",()=>f(e.title))}),p(()=>{e.subtitle!=null&&p("div.s-subtitle",()=>f(e.subtitle))})}),p(()=>{e.menu&&p("div.s-menu",()=>f(e.menu))})})})}),p("div.s-body",()=>{p("div.s-body-inner",()=>{p(()=>{s!=null&&p("max-width:",s)}),p(()=>{t==null||!t.items.length||n==="button"||(p(`nav.s-nav-panel.s-nav-${n}`,e.navAttrs,()=>{de(t.items)}),p("div.s-nav-sep aria-hidden=true"))}),yt(e,r)}),p(()=>{t!=null&&t.items.length&&o.open&&bt(t,e.navPageAttrs,o)})}),p(()=>{e.footer!=null&&p("footer",()=>{p("div.s-bar",()=>{p(()=>{s!=null&&p("max-width:",s)}),f(e.footer)})})})});if(t!=null||r){let l=g=>{if(g.key!=="Escape"||g.defaultPrevented||ye()||te())return;let y=a.querySelector(".s-nav-trigger button");if(o.open){g.preventDefault(),o.open=!1,y?.focus();return}if(r&&r.$state.paths.length>1){g.preventDefault(),r.closeTop();return}let u=a.querySelector(".s-nav-panel");if(u?.offsetParent!=null){let b=u.querySelector("[aria-current=page]")??u.querySelector(".s-menu-item:not([aria-disabled=true])");b&&(g.preventDefault(),b.focus());return}y&&(g.preventDefault(),y.click())};document.addEventListener("keydown",l),p.clean(()=>document.removeEventListener("keydown",l))}}var ie=null;function ht(){ie?.()}function gt(e,t){let n=null;p.clean(()=>{n&&ne(n)});let o=()=>{n&&ne(n)};O({icon:()=>p(()=>(t.open?Ce:ge)({size:"1.5em"})),ariaLabel:"Open navigation",attrs:".neutral .small",...e.button,click:i=>{n=i.currentTarget;let r=n.closest(".s-main");if(r!=null&&r.clientWidth<=U){t.open=!t.open;return}te(n)?ne(n):(ie=o,oe({items:e.items,anchor:n,dropdownAttrs:e.dropdownAttrs}))}})}function bt(e,t,n){let o=!1,i=()=>{o=!0,n.open=!1},r=p("nav.s-nav-page.s-s.neutral aria-label=Navigation create=s-nav-page-off destroy=s-nav-page-off",t,()=>de(e.items,i));ie=i,p.clean(()=>{ie===i&&(ie=null)});let s=p.peek(Re,"path");p(()=>{Re.path!==s&&i()});let a=r.closest(".s-main"),l=r.parentElement?.querySelector(":scope > .s-body-inner"),g=l?.querySelector(":scope > main");if(l?.setAttribute("inert",""),a!=null&&typeof ResizeObserver<"u"){let y=new ResizeObserver(()=>{a.clientWidth>U&&(n.open=!1)});y.observe(a),p.clean(()=>y.disconnect())}p.clean(()=>{l?.removeAttribute("inert"),o&&(g&&vt(g),a?.querySelector(".s-nav-trigger button")?.focus())}),requestAnimationFrame(()=>{document.body.contains(r)&&V(r,".s-menu-item[aria-current=page]")})}function vt(e){e.classList.add("s-slide-in"),e.offsetWidth,e.classList.remove("s-slide-in")}function yt(e,t){if(t){t.drawStack();return}let n=p("main",()=>{p("div.s-content",e.contentAttrs,()=>{f(e.content)})});xt(n)}function xt(e){if(typeof ResizeObserver>"u")return;let t=()=>e.classList.toggle("s-scroll-y",e.offsetWidth>e.clientWidth),n=new ResizeObserver(t);n.observe(e),e.firstElementChild&&n.observe(e.firstElementChild),t(),p.clean(()=>n.disconnect())}import M from"aberdeen";M.insertGlobalCss({".s-select_wrap":{"&":"position:relative display:block",select:"w:100% cursor:pointer padding-right:2.2em; appearance:none","&::after":"content: '\u25BE'; position:absolute right:0.7em top:50%; transform: translateY(-50%); pointer-events:none fg:$s-muted font-size:0.85em"}});function wt(e){B(e,(t,n)=>{M("div.s-select_wrap",e.inputAttrs,()=>{M("select.s-input",()=>{Y(e,t,n),M("change=",o=>{e.bind&&(e.bind.value=o.target.value)}),M(()=>{let o=typeof e.options=="function"?e.options():e.options,i=e.bind?.value??"";e.placeholder!=null&&M("option",()=>{M("value= disabled=true hidden=true"),i||M("selected=true"),M("#",e.placeholder)});for(let r of o){let s=typeof r=="string"?{value:r,label:r}:{value:r.value,label:r.label??r.value};M("option",()=>{M("value=",s.value),s.value===i&&M("selected=true"),M("#",s.label)})}})})})})}import w from"aberdeen";var $t=Q('<path d="m15 18-6-6 6-6"/>'),kt=Q('<path d="m9 18 6-6-6-6"/>');w.insertGlobalCss({".s-tabs":{"&":"display:flex flex-direction:column gap:$3",".s-tabbar":"position:relative display:flex border-bottom: 1px solid $s-faint;",".s-tablist":"display:flex gap:$1 align-items:stretch flex:1 min-width:0 overflow-x:auto overflow-y:hidden scrollbar-width:none scroll-behavior:smooth margin-bottom:-1px",".s-tablist::-webkit-scrollbar":"display:none",".s-tab":"display:inline-flex align-items:center gap:$2 cursor:pointer background:transparent border:0 color: $s-muted; font-weight:600 padding: 0.6em 0.9em; white-space:nowrap border-bottom: 3px solid transparent; transition: color 0.15s, background 0.15s, border-color 0.15s;",".s-tab:hover:not(:disabled), .s-tab[aria-selected=true]":"color: $s-text;",".s-tab:focus-visible":"outline:none box-shadow: inset 0 0 0 2px $s-focus; r: $s-radius;",".s-tab[aria-selected=true]":"border-image: $s-gradient 1;",".s-tabscroll":"position:absolute top:0 bottom:0 z-index:1 display:none align-items:center justify-content:center width:2.4em border:0 padding:0 cursor:pointer fg:$s-muted transition: color 0.15s;",".s-tabscroll:hover":"fg:$s-text",".s-tabscroll-left":"left:0 justify-content:flex-start background: linear-gradient(to right, $s-bg 45%, transparent)",".s-tabscroll-right":"right:0 justify-content:flex-end background: linear-gradient(to left, $s-bg 45%, transparent)",".s-tabbar.s-can-left > .s-tabscroll-left, .s-tabbar.s-can-right > .s-tabscroll-right":"display:flex",".s-tabpanel":"display:block"}});function Et(e){let t=F("tabs"),n=(r,s)=>r.id??String(s),o=e.bind??w.proxy(n(e.tabs[0]??{label:""},0));e.tabs.length>0&&!e.tabs.some((r,s)=>n(r,s)===w.peek(()=>o.value))&&(o.value=n(e.tabs[0],0));let i=(r,s)=>{r.disabled||(o.value=n(r,s))};w("div.s-tabs",e.attrs,()=>{w("div.s-tabbar",()=>{let r=w("div.s-tablist role=tablist",()=>{e.tabs.forEach((s,a)=>{let l=n(s,a),g=w("button.s-tab type=button role=tab",()=>{w(`id=${t}-tab-${l} aria-controls=${t}-panel-${l}`),w(()=>{let y=o.value===l;w("aria-selected=",y?"true":"false"),w("tabindex=",y?"0":"-1"),y&&requestAnimationFrame(()=>Tt(g))}),s.disabled&&w("disabled=true"),w("click=",()=>i(s,a)),w("keydown=",y=>Ot(y,e.tabs,a,i)),f(s.icon),f(s.label)})})});ze(r,-1),ze(r,1),At(r)}),w("div.s-tabpanel role=tabpanel",e.contentAttrs,()=>{w(()=>{let r=o.value,s=e.tabs.findIndex((l,g)=>n(l,g)===r),a=e.tabs[s]??e.tabs[0];a&&(w(`id=${t}-panel-${n(a,s)} aria-labelledby=${t}-tab-${n(a,s)}`),f(a.content))})})})}function ze(e,t){w(`button.s-tabscroll.s-tabscroll-${t<0?"left":"right"} type=button`,()=>{w("tabindex=-1 aria-hidden=true"),w("click=",()=>e.scrollBy({left:t*e.clientWidth*.8,behavior:"smooth"})),(t<0?$t:kt)({size:"1.1em"})})}function At(e){let t=e.parentElement;if(!t||typeof ResizeObserver>"u")return;let n=()=>{let i=e.scrollWidth-e.clientWidth;t.classList.toggle("s-can-left",e.scrollLeft>1),t.classList.toggle("s-can-right",e.scrollLeft<i-1)};e.addEventListener("scroll",n,{passive:!0});let o=new ResizeObserver(n);o.observe(e);for(let i of Array.from(e.children))o.observe(i);n(),w.clean(()=>{e.removeEventListener("scroll",n),o.disconnect()})}function Tt(e){let t=e.parentElement;if(!t||!e.isConnected)return;let n=parseFloat(getComputedStyle(t).fontSize)*2.6,o=e.getBoundingClientRect(),i=t.getBoundingClientRect();o.left<i.left+n?t.scrollBy({left:o.left-i.left-n,behavior:"smooth"}):o.right>i.right-n&&t.scrollBy({left:o.right-i.right+n,behavior:"smooth"})}function Ot(e,t,n,o){let i=n;if(e.key==="ArrowRight"||e.key==="ArrowDown")i=(n+1)%t.length;else if(e.key==="ArrowLeft"||e.key==="ArrowUp")i=(n-1+t.length)%t.length;else if(e.key==="Home")i=0;else if(e.key==="End")i=t.length-1;else return;e.preventDefault();let r=i>=n?1:-1;for(let s=0;s<t.length;s++){let a=t[i];if(a&&!a.disabled){o(a,i),e.currentTarget?.parentElement?.children[i]?.focus();return}i=(i+r+t.length)%t.length}}import C from"aberdeen";C.insertGlobalCss({"textarea.s-input":"resize:vertical min-height:3em line-height:1.45","textarea.s-input.s-autoGrow":"resize:none min-height:2.5em overflow-y:hidden"});function Mt(e={}){let t=e.autoGrow!==!1;B(e,(n,o)=>{let i=C("textarea.s-input",e.inputAttrs,()=>{t?(C(".s-autoGrow"),C("input=",r=>{qe(r.currentTarget),e.input&&e.input(r)})):(C("rows=",e.rows??4),C("resize:",e.resize??"vertical"),e.input&&C("input=",e.input)),e.placeholder!=null&&C("placeholder=",e.placeholder),e.value!=null&&!e.bind&&C("value=",e.value),e.change&&C("change=",e.change),Y(e,n,o,e.bind)});t&&requestAnimationFrame(()=>qe(i))})}function qe(e){e.style.height="auto",e.style.height=`${e.scrollHeight}px`}import $ from"aberdeen";import{grow as St,shrink as Pt}from"aberdeen/transitions";$.insertGlobalCss({".s-toasts":"position:fixed bottom:$3 right:$3 z-index:400 display:flex flex-direction:column gap:$2 pointer-events:none max-width:min(90vw,24rem) w:24rem",".s-toast":{"&":"display:flex align-items:flex-start gap:$2 padding: $3; pointer-events:auto position:relative overflow:hidden",".s-toast-body":"display:flex flex-direction:column gap:$1 flex:1 min-width:0",".s-toast-title":"font-weight:700 line-height:1.3",".s-toast-close":"cursor:pointer border:0 background:transparent fg:$s-muted font-size:1.1em line-height:1 padding: 0 0.15em; r:4px flex-shrink:0 align-self:flex-start",".s-toast-close:hover":"fg:$s-text",".s-toast-close:focus-visible":"outline:none box-shadow: 0 0 0 3px $s-focus; fg:$s-text",".s-toast-progress":"position:absolute bottom:0 left:0 right:0 height:2px background:$s-accent width:100%"}});var Lt=0,re=$.proxy({});I(()=>{$.peek(()=>$.isEmpty(re))&&$.isEmpty(re)||$("div.s-toasts",()=>{$.onEach(re,e=>{let{opts:t,id:n}=e,o=t.type==="danger"||t.type==="warning"?"alert":"status",i=t.type==null||t.type==="neutral"?"neutral":t.type,r=t.duration??6e3,s,a=null,l=()=>{clearTimeout(s),a&&(a.style.transition="none",a.style.width="100%",a.offsetWidth,a.style.transition=`width ${r}ms linear`,a.style.width="0%"),s=setTimeout(()=>xe(n),r)},g=()=>{clearTimeout(s),s=void 0,a&&(a.style.transition="none",a.style.width="100%")};$.clean(()=>clearTimeout(s)),$(`div.s-toast.s-s.${i}.extra-shadow aria-live=polite role=${o}`,"create=",St,"destroy=",Pt,t.attrs,()=>{r>0&&($("mouseenter=",g),$("mouseleave=",l)),$("div.s-toast-body",()=>{$(()=>{t.title!=null&&$("div.s-toast-title",()=>f(t.title))}),$("div.s-toast-msg",()=>f(t.message))}),$(()=>{t.dismissible!==!1&&$("button.s-toast-close type=button aria-label=Dismiss",()=>{$("#\xD7"),$("click=",()=>xe(n))})}),r>0&&(a=$("div.s-toast-progress"))}),r>0&&requestAnimationFrame(l)})})});function xe(e){delete re[e]}function Ct(e){let t=++Lt;return re[t]={id:t,opts:e},()=>xe(t)}import H from"aberdeen";H.insertGlobalCss({".s-tt-tip":{"&":"position:fixed z-index:500 max-width:20rem w:max-content padding: 0.3em 0.65em; font-size:0.85em line-height:1.4 pointer-events:none"}});var J=H.proxy(void 0),R=null;typeof window<"u"&&window.addEventListener("scroll",()=>{J.value=void 0},{capture:!0,passive:!0});function Ht(e,t,n,o){let r=window.innerWidth,s=window.innerHeight,a=0,l=0;return o==="bottom"?(a=e.left+(e.width-t)/2,l=e.bottom+7,l+n>s-8&&(l=e.top-n-7)):o==="left"?(a=e.left-t-7,l=e.top+(e.height-n)/2,a<8&&(a=e.right+7)):o==="right"?(a=e.right+7,l=e.top+(e.height-n)/2,a+t>r-8&&(a=e.left-t-7)):(a=e.left+(e.width-t)/2,l=e.top-n-7,l<8&&(l=e.bottom+7)),{x:Math.max(8,Math.min(a,r-t-8)),y:Math.max(8,Math.min(l,s-n-8))}}function we(){R&&clearTimeout(R),R=setTimeout(()=>{J.value=void 0,R=null},100)}I(()=>{let e=J.value;if(!e)return;let{opts:t,anchor:n}=e,o=t.placement??"top",i=H("div.s-tt-tip.s-s.neutral.shadow role=tooltip visibility:hidden",t.attrs,()=>{H("mouseenter=",()=>{R&&(clearTimeout(R),R=null)}),H("mouseleave=",we),f(t.tip)});requestAnimationFrame(()=>{if(!document.body.contains(i))return;let{x:r,y:s}=Ht(n.getBoundingClientRect(),i.offsetWidth,i.offsetHeight,o);i.style.left=r+"px",i.style.top=s+"px",i.style.visibility=""})});function Rt(e){let t=n=>{R&&(clearTimeout(R),R=null),J.value={opts:e,anchor:n.currentTarget}};H("mouseenter=",t),H("mouseleave=",we),H("focusin=",t),H("focusout=",we),H.clean(()=>{J.value?.opts===e&&(J.value=void 0)})}export{dt as addContextMenu,Rt as addTooltip,ut as alert,Ne as autocomplete,tt as box,O as button,nt as buttonChooser,W as buttonGroup,ot as checkbox,ne as closeFloatingMenu,ht as closeNav,pt as confirm,ce as dialog,it as form,ke as getDarkMode,ye as isDialogOpen,te as isFloatingMenuOpen,mt as main,ct as menuButton,et as panels,ft as prompt,wt as select,Be as setDarkMode,oe as showFloatingMenu,Et as tabs,Mt as textarea,be as textline,Ct as toast};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "staffa",
-  "version": "0.8.1",
+  "version": "0.9.0",
   "description": "An opinionated component library for the Aberdeen reactive UI library.",
   "license": "ISC",
   "author": "",
@@ -41,7 +41,7 @@
     "jsdom": "^29.1.1",
     "lucide-static": "^1.17.0",
     "readme-tsdoc": "^1.2.1",
-    "shotest": "^1.8.2",
+    "shotest": "^1.8.3",
     "typescript": "^5.9.3"
   },
   "allowScripts": {

package/skill/AncestorTable.md

@@ -0,0 +1,10 @@
+## AncestorTable · type
+
+A table of `AncestorsHandler`s keyed by path template, the same way
+`routes` is — so each one's `params` are matched and typed from its own key
+rather than parsed out of the path a second time. The keys are checked
+against the route table, so a stale one is a type error.
+
+**Type:** `{
+	[K in keyof R & string]?: (params: Prettify<PathParams<K>>, path: string) => readonly string[] | undefined | void;
+}`

package/skill/MainOptions.md

@@ -110,6 +110,47 @@ to go with it, so `$page.params` is empty; the path itself is in
 
 **Type:** `RouteHandler<{}>`
 
+### mainOptions.ancestors · member
+
+What to open **beneath** a path that arrives cold — a shared link, a
+bookmark, a push notification, a nav item — with no stack of its own to
+restore. Keyed by path template exactly like `MainOptions.routes`, so
+each entry gets that key's params, matched and typed, rather than taking
+the path apart a second time.
+
+Without this, the stack is derived from the path: every prefix that has a
+route becomes a column, so `/projects/7/tasks/42` opens three deep. That
+only works for URLs that spell their own context out. A flat one —
+`/thread/[id]`, where a notification lands — has no prefix to walk, so it
+opens as a single column with nothing under it and nothing to close back
+to. This is where you say what that context is:
+
+```ts
+S.main({
+  routes: {
+    "/mailbox/[id]": drawMailbox,
+    "/thread/[id=integer]": drawThread,
+  },
+  ancestors: {
+    "/thread/[id=integer]": ({ id }) => [`/mailbox/${mailboxOf(id)}`],  // id: number
+  },
+});
+```
+
+Return the paths shallowest first; the path itself goes on top. Return
+nothing to leave a path to the prefix derivation, which is also what an
+unlisted one gets — so you only list the routes whose URL doesn't say where
+it belongs. Paths you have no route for are skipped, as they are there.
+
+This is asked for every origin-less navigation, so a nav item and a fresh
+tab still land on the same columns; a link *inside* a panel builds on that
+panel instead and never asks. It has to answer without drawing anything,
+since the panels being replaced are asked their `Page.requestClose`
+before the navigation is applied — before any handler could run. From code,
+`panels`.`open()` takes the same list directly.
+
+**Type:** `AncestorTable<NoInfer<R>>`
+
 ### mainOptions.stacking · member
 
 Set `false` to show only the top panel, however wide the screen (the nav

package/skill/SKILL.md

@@ -163,7 +163,9 @@ The first key that matches wins, and a segment a param refuses simply doesn't ma
 - A link to something that's already open goes back to it instead of opening it twice. The same path is never in the stack twice.
 - A link that isn't inside a panel (a nav item, or one in a dialog) has no panel to build on, so it replaces the stack as a whole: the page you asked for, with its ancestor pages opened beneath it (see [below](#ancestors)). Panels that the new stack also contains stay as they are, so clicking the nav item for the section you're already in won't reset it. Clicking a nav item and opening that same URL in a fresh tab therefore give you the same columns.
 
-From code, `S.panels.push(path)` opens a panel on top of the top one, `.replace(path)` opens one in place of the top one, and `.close(path?)` closes the top panel (or a named one). `S.panels.stack` is the list of open paths.
+From code, `S.panels.push(path)` opens a panel on top of the top one, `.replace(path)` opens one in place of the top one, `.open(path, beneath?)` opens a whole arrangement at once (the way a nav item does — see [below](#ancestors)), and `.close(path?)` closes the top panel (or a named one). `S.panels.stack` is the list of open paths.
+
+Navigating faster than the shell can settle is fine: closing travels through the browser's history, so it takes a moment to land, and anything asked for in the meantime waits for it rather than being dropped. Two quick Escapes (or back gestures) peel two panels, each aimed at the stack the one before it was heading for. A `requestClose` that says no clears what was queued behind it, so an Escape can't sail past the panel that just refused to close.
 
 **How much room a panel takes** is up to `$page.layout`. The content area is the page, at most 1280px wide, minus the nav sidebar:
 
@@ -215,6 +217,26 @@ Staffa itself contributes two things: the Escape key, which closes the top panel
 
 A URL that arrives without any of that (a shared link, a bookmark, a new tab) has nothing to restore, so Staffa builds the stack from the path: it walks the parent paths and opens each one you have a route for. With the routes above, `/projects/7/tasks/42` opens as three panels: the project list, project 7, and task 42. A parent path you have no route for is skipped, so if you don't want one screen appearing under another, just don't give it a route.
 
+That only works for URLs that spell their own context out. A flat one — `/thread/[id]`, where a push notification lands — has no parent path to walk, so it would open as a lone column with nothing beneath it and nothing for Escape to do. `ancestors` is where you say what belongs under it. It's keyed by the same path templates as `routes`, so each entry gets that key's params, matched and typed:
+
+```ts
+S.main({
+  routes: {
+    "/mailbox/[id]": drawMailbox,
+    "/thread/[id=integer]": drawThread,
+  },
+  ancestors: {
+    "/thread/[id=integer]": ({ id }) => [`/mailbox/${mailboxOf(id)}`],   // id is a number
+  },
+});
+```
+
+Return the paths shallowest first, or nothing to leave that path to the parent-path walk — which is also what a route you don't list gets, so you only name the ones whose URL doesn't say where they belong. It's asked for every navigation that has no panel to build on, so a nav item and a fresh tab still agree.
+
+It has to answer without drawing anything, which is why it lives here rather than on `$page`: the panels being replaced are asked their `requestClose` *before* the navigation is applied, and that is before any route handler could have run.
+
+From code, `S.panels.open(path, beneath?)` opens the same kind of arrangement, either asking `ancestors` for the stack or taking the one you hand it.
+
 Search params and the `#hash` belong to the top panel only. Anything a panel deeper in the stack needs in order to redraw itself has to live in its path.
 
 **A few more things.**
@@ -276,7 +298,7 @@ Components share naming conventions for options: `attrs` (outermost element), `c
 
 ### Layout & containers
 
-- **`S.main(opts)`**: app shell, a sticky header with `icon`, `title`, `subtitle`, `menu`; scrollable content area; footer. Set `maxWidth` to center the content. Give it a `nav` for a sidebar that collapses to a hamburger below 640 px — where the nav becomes a full page sliding in from the left, handing over to the chosen screen with a matching slide in from the right. Its `items` may be a reactive array; adding or removing one redraws just the sidebar, never the content beside it. Instead of a single `content` slot it can take a `routes` table — see [Panel-stack navigation](#panel-stack-navigation).
+- **`S.main(opts)`**: app shell, a sticky header with `icon`, `title`, `subtitle`, `menu`; scrollable content area; footer. Set `maxWidth` to center the content. Give it a `nav` for a sidebar that collapses to a hamburger below 640 px — where the nav becomes a full page sliding in from the left, handing over to the chosen screen with a matching slide in from the right. Its `items` may be a reactive array; adding or removing one redraws just the sidebar, never the content beside it. A navigation dismisses the collapsed nav by itself, links in your own custom rows included; `S.closeNav()` does it for the rows that *don't* navigate. Instead of a single `content` slot it can take a `routes` table — see [Panel-stack navigation](#panel-stack-navigation).
 - **`S.box(opts | content)`**: surface with optional `header`/`footer` and padded body. Pass a function for shorthand `{ content }`. `close: true` adds a ✕ that closes the panel the box is in (see [Panel-stack navigation](#panel-stack-navigation)); `close: fn` runs your own dismissal.
 - **`S.tabs(opts)`**: tablist with live panels and keyboard navigation. More tabs than fit make the strip scroll, with a ‹ / › button appearing at whichever end still has something to reach — so it's not just a swipe target. Selecting a tab any other way (the arrow keys, a `bind` written from elsewhere) scrolls it into view.
 - **`S.form(opts | content)`**: form aligning fields in a column or responsive grid, with an `actions` bar. Prevents the default page reload.
@@ -318,7 +340,8 @@ Options: `size`, `color` (defaults to `currentColor`), `strokeWidth`, `cap`, `jo
 
 ### Other
 
-- **`S.menuButton(opts)` / `S.addContextMenu(opts)` / `S.showFloatingMenu(opts)`**: dropdown menus from a button, right-click/long-press context menus, and the underlying floating menu primitive — with keyboard navigation.
+- **`S.menuButton(opts)` / `S.addContextMenu(opts)` / `S.showFloatingMenu(opts)`**: dropdown menus from a button, right-click/long-press context menus, and the underlying floating menu primitive — with keyboard navigation. A menu closes itself when the page navigates.
+- **`S.closeNav()`**: dismisses `S.main`'s navigation when it's showing as an overlay (the full page on a phone, the dropdown on a wider screen). For custom nav rows that act without navigating.
 - **`S.toast(opts)`**: transient notification at the bottom of the viewport.
 - **`S.addTooltip(el, opts)`**: tooltip on hover, attached to an existing element.
 
@@ -410,26 +433,11 @@ mkdir -p .claude/skills
 ln -s ../../node_modules/staffa/skill .claude/skills/staffa
 ```
 
-## Breaking changes
-
-- **0.7** — the surface model was reduced to two families: **neutral** (`.neutral`) and **accent** (`.primary`/`.danger`/`.success`/`.warning`/`.link`). Apps that only use the high-level `S.*` components need no changes. Code that uses surface classes or tokens directly must update:
-  - **Surface levels gone.** Replace `.base`/`.panel`/`.raised`/`.neutral`/`.nest` with the single `.neutral` class.
-  - **`.secondary` and `.gradient` gone.** Drop any `s-secondary` colour override; there's no `s-secondary` anymore. The default button is now `.primary`.
-  - **Tokens renamed.** `--s-fg`→`--s-text`, `--s-fg-muted`→`--s-muted`, `--s-border`→`--s-faint`. Removed: `--s-fg-faint`, `--s-border-strong`, `--s-ink`, `--s-on-accent`, `--s-page`/`--s-panel`/`--s-raised`, `--s-neutral`, `--s-tint`, `--s-glow`, `--s-shadow`, `--s-gradient-surface`. A custom surface now sets `--s-bg`/`--s-text` (was the `--s-a`/`--s-b` anchors).
-  - **Borders/shadows moved onto surfaces.** Components no longer draw their own border/shadow. If you relied on `S.box`/`S.dialog`/etc. elevation, it now comes from the surface; pass `.no-shadow` to drop it, or `.shadow`/`.extra-shadow` to add it on any surface.
+## Changelog
 
-- **0.6**: None.
+What changed in each release, and what to do about the breaking ones, is in [CHANGELOG.md](CHANGELOG.md).
 
-- **0.5**
-  - Surfaces (`.s-s`) now apply `border-radius` and — for `.tonal` and `.outlined` variants — `border` automatically. Custom surfaces or components that previously set these manually may see doubled or conflicting styles; remove the manual declarations.
-  - `border:0` is now applied to `.s-btn` by default (overriding the browser's 2px button border). Custom button-like components built on `.s-btn` that relied on the browser default border should add an explicit border.
-
-- **0.4**
-  - There is no default export anymore: replace `import S from "staffa"` with `import * as S from "staffa"`.
-  - `S.button` no longer has a `text` option: use `content` instead (it accepts a string or a draw function).
-  - The `Content` type is gone: use `Slot` instead. The `Styling` type alias is now exported as `Attributes`.
-  - `S.buttonChooser` uses `undefined` instead of `null` for "nothing selected" (in `bind` and with `allowDeselect`).
-  
+*Hint:* the recommended update strategy for a library this young is: don't. Pin it, and read the changelog before you move.
 
 # API Reference
 
@@ -532,6 +540,12 @@ Below 640 px that button opens the nav as a full page sliding in from the
 left; picking an item slides it away as the chosen screen enters from the
 right.
 
+## [closeNav](closeNav.md) · function
+
+Close the navigation, if it's showing as an overlay: the full page it becomes
+on a narrow shell, or the dropdown its button opens on a wider one. A sidebar
+isn't an overlay and has nothing to dismiss, so there it does nothing.
+
 ## [MainOptions](MainOptions.md) · interface
 
 Options for `main`.
@@ -570,6 +584,21 @@ is what makes `$page.params` infer from the route key.
 
 **Type:** `{ [K in keyof R & string]: (page: Page<Prettify<PathParams<K>>>) => void }`
 
+## AncestorsHandler · type
+
+What belongs beneath a path that arrives cold, worked out from the params of
+the path itself. Return the paths shallowest first, or nothing to leave this
+one to the parent-path derivation.
+
+**Type:** `(params: P, path: string) => readonly string[] | undefined | void`
+
+## [AncestorTable](AncestorTable.md) · type
+
+A table of `AncestorsHandler`s keyed by path template, the same way
+`routes` is — so each one's `params` are matched and typed from its own key
+rather than parsed out of the path a second time. The keys are checked
+against the route table, so a stale one is a type error.
+
 ## [PathParams](PathParams.md) · type
 
 The params object described by a path template, e.g.

package/skill/closeNav.md

@@ -0,0 +1,23 @@
+## closeNav · function
+
+Close the navigation, if it's showing as an overlay: the full page it becomes
+on a narrow shell, or the dropdown its button opens on a wider one. A sidebar
+isn't an overlay and has nothing to dismiss, so there it does nothing.
+
+A navigation closes the nav by itself, links in your own custom rows included,
+so this is for the items that *don't* navigate — one that opens a dialog, or
+flips a setting, and should still get the nav out of the way.
+
+**Signature:** `() => void`
+
+**Examples:**
+
+```ts
+S.main({
+  nav: { items: [
+    { label: "Inbox", href: "/inbox" },
+    () => S.button({ content: "New message", click: () => { S.closeNav(); compose(); } }),
+  ]},
+  routes: { ... },
+});
+```

package/skill/panels.md

@@ -7,4 +7,4 @@ The same rules as a link click apply: pushing a path that is already open
 goes back to it rather than opening it twice, and anything that would close a
 panel asks its `Page.requestClose` first.
 
-**Value:** `{ push(path: string): void; replace(path: string): void; close(path?: string): Promise<boolean>; readonly stack: readonly string[]; }`
+**Value:** `{ push(path: string): void; replace(path: string): void; open(path: string, beneath?: readonly string[]): void; close(path?: string): Promise<boolean>; readonly stack: readonly string[]; }`