@threadlabs/looma 0.6.5 → 0.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/components/ui-button/ui-button.html +103 -81
  2. package/components/ui-checkbox/ui-checkbox.html +4 -1
  3. package/components/ui-combobox/ui-combobox.html +40 -3
  4. package/components/ui-combobox/ui-combobox.js +27 -5
  5. package/components/ui-editor-table-context-menu/ui-editor-table-context-menu.html +2 -0
  6. package/components/ui-select/ui-select.html +3 -5
  7. package/dist/index.js +1 -1
  8. package/package.json +1 -1
  9. package/styles/ui-button.css +111 -79
  10. package/styles/ui-checkbox.css +4 -1
  11. package/styles/ui-combobox.css +37 -0
  12. package/styles/ui-editor-table-context-menu.css +2 -0
  13. package/styles/ui-select.css +3 -4
  14. package/theme-dark.css +6 -30
  15. package/theme-high-contrast.css +30 -20
  16. package/theme-light.css +2 -16
  17. package/tokens.css +33 -24
  18. package/vanilla/UiButton.d.ts +1 -1
  19. package/vanilla/UiButton.js +1 -1
  20. package/vanilla/UiCombobox.js +1 -1
  21. package/vanilla/UiSelect.d.ts +0 -1
  22. package/vanilla/UiSelect.js +3 -6
  23. package/vue/UiButton.d.ts +2 -2
  24. package/vue/UiButton.vue +103 -96
  25. package/vue/UiCheckbox.vue +4 -1
  26. package/vue/UiCombobox.vue +46 -4
  27. package/vue/UiEditorTableContextMenu.vue +2 -0
  28. package/vue/UiSelect.d.ts +0 -2
  29. package/vue/UiSelect.vue +2 -6
  30. package/vue/chunks/UiButton.js +3 -3
  31. package/vue/chunks/UiCheckbox.js +1 -1
  32. package/vue/chunks/UiCombobox.js +2 -2
  33. package/vue/chunks/UiEditorTableContextMenu.js +1 -1
  34. package/vue/chunks/UiSelect.js +1 -7
  35. package/vue/components.css +253 -204
  36. package/vue/editor/index.js +4 -4
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { getComponentHost, observeDocument, registerComponentDefinitions, setControllerModule } from "@nextwebwg/html-next/runtime";
2
2
 
3
- export const definitions = [{"source":{"file":"./components/ui-affordance-scope/ui-affordance-scope.html"},"contract":{"version":1,"name":"UiAffordanceScope","tag":"ui-affordance-scope","nativeElement":"span","props":{"nearRadius":{"type":"number","required":false,"target":{"attribute":"nearradius"},"description":"How close, in pixels, the pointer must come to reveal an affordance.","default":16}}},"template":{"kind":"element","name":"span","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n display: contents;\n --ui-affordance-scope-engaged: 0;\n }\n\n :host-state([engaged]) {\n --ui-affordance-scope-engaged: 1;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"engaged","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"span","choices":["span"]},"controller":"./components/ui-affordance-scope/ui-affordance-scope.js"},{"source":{"file":"./components/ui-avatar-group/ui-avatar-group.html"},"contract":{"version":1,"name":"UiAvatarGroup","tag":"ui-avatar-group","nativeElement":"div","props":{"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"label token.","default":"People"},"max":{"type":"number","required":false,"target":{"attribute":"max"},"description":"max token.","default":5}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"group"},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[{"kind":"slot"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"overflow"},{"kind":"literal","name":"role","value":"img"},{"kind":"attribute","name":"hidden","expression":"not overflowCount","expressionPlan":{"source":"not overflowCount","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"overflowCount"}},"dependencies":["overflowCount"]}},{"kind":"attribute","name":"aria-label","expression":"format('%s more', overflowCount)","expressionPlan":{"source":"format('%s more', overflowCount)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s more"},{"kind":"id","name":"overflowCount"}]},"dependencies":["overflowCount"]}}],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"format('+%s', overflowCount)","expressionPlan":{"source":"format('+%s', overflowCount)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"+%s"},{"kind":"id","name":"overflowCount"}]},"dependencies":["overflowCount"]}}],"children":[]}],"ref":"overflow"}]},"css":":host {\n /* Avatars separate with a tight, crisp edge, matching Looma's 1px borders rather than the\n * diffuse elevation overlays use. */\n --_overlap-shadow: -2px 0 2px -1px rgba(0, 0, 0, 0.22);\n --_edge-ring: 0 0 0 1px rgba(0, 0, 0, 0.08);\n\n display: flex;\n align-items: center;\n flex-direction: row;\n gap: 0;\n }\n\n /* Overlap and the separating shadow are applied by the controller: slotted avatars are nested\n * component roots outside this style scope. */\n :slotted(*) {\n margin-inline-start: -0.625rem;\n flex-shrink: 0;\n border-radius: 999px;\n }\n\n :slotted(*:first-child) {\n margin-inline-start: 0;\n }\n\n .overflow {\n margin-inline-start: -0.625rem;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n inline-size: 2.5rem;\n block-size: 2.5rem;\n border-radius: 999px;\n border: 1px solid var(--ui-border-strong);\n background: var(--ui-surface-elevated);\n color: var(--ui-text-primary);\n box-shadow:\n var(--ui-avatar-group-overlap-shadow, var(--_overlap-shadow)),\n var(--ui-avatar-group-edge-ring, var(--_edge-ring));\n font: inherit;\n font-size: 0.75rem;\n font-weight: 600;\n flex-shrink: 0;\n }\n\n .overflow[hidden] {\n display: none;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"overflowCount","expression":{"source":"0","ast":{"kind":"literal","value":0},"dependencies":[]}}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-avatar-group/ui-avatar-group.js"},{"source":{"file":"./components/ui-avatar/ui-avatar.html"},"contract":{"version":1,"name":"UiAvatar","tag":"ui-avatar","nativeElement":"span","props":{"alt":{"type":"string","required":false,"target":{"attribute":"alt"},"description":"alt token.","default":""},"fallback":{"type":"string","required":false,"target":{"attribute":"fallback"},"description":"fallback token.","default":""},"name":{"type":"string","required":false,"target":{"attribute":"name"},"description":"name token.","default":""},"src":{"type":"string","required":false,"target":{"attribute":"src"},"description":"Image URL."}}},"template":{"kind":"element","name":"span","attributes":[],"children":[{"kind":"slot"},{"kind":"element","name":"img","attributes":[{"kind":"literal","name":"class","value":"image"},{"kind":"attribute","name":"src","expression":"src","expressionPlan":{"source":"src","ast":{"kind":"id","name":"src"},"dependencies":["src"]}},{"kind":"literal","name":"alt","value":""},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"attribute","name":"hidden","expression":"hasAuthoredImage or not hasImage","expressionPlan":{"source":"hasAuthoredImage or not hasImage","ast":{"kind":"binary","op":"or","left":{"kind":"id","name":"hasAuthoredImage"},"right":{"kind":"unary","op":"not","operand":{"kind":"id","name":"hasImage"}}},"dependencies":["hasAuthoredImage","hasImage"]}}],"children":[],"ref":"image"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"fallback"},{"kind":"attribute","name":"aria-hidden","expression":"hasImage","expressionPlan":{"source":"hasImage","ast":{"kind":"id","name":"hasImage"},"dependencies":["hasImage"]}},{"kind":"attribute","name":"hidden","expression":"hasImage","expressionPlan":{"source":"hasImage","ast":{"kind":"id","name":"hasImage"},"dependencies":["hasImage"]}},{"kind":"directive","name":"value","expression":"initials","expressionPlan":{"source":"initials","ast":{"kind":"id","name":"initials"},"dependencies":["initials"]}}],"children":[]}]},"css":":host {\n display: inline-grid;\n place-items: center;\n overflow: hidden;\n inline-size: 2.5rem;\n block-size: 2.5rem;\n border-radius: 999px;\n border: 1px solid var(--ui-avatar-border, var(--ui-border-strong));\n background: var(--ui-avatar-surface, var(--ui-accent-soft));\n color: var(--ui-avatar-text, var(--ui-accent-solid));\n font: inherit;\n font-size: 0.875rem;\n font-weight: 600;\n text-transform: uppercase;\n }\n\n .image,\n :slotted(img) {\n grid-area: 1 / 1;\n inline-size: 100%;\n block-size: 100%;\n object-fit: cover;\n }\n\n .fallback {\n grid-area: 1 / 1;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n inline-size: 100%;\n block-size: 100%;\n }\n\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high. */\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high.\n * Trimming applies to block containers, so the box is a block with centred content. */\n @supports (text-box-trim: trim-both) {\n .fallback {\n display: block;\n text-align: center;\n align-content: center;\n text-box-trim: trim-both;\n text-box-edge: cap alphabetic;\n }\n }\n\n [hidden] {\n display: none;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"hasImage","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"hasAuthoredImage","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"initials","expression":{"source":"'?'","ast":{"kind":"literal","value":"?"},"dependencies":[]}}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"span","choices":["span"]},"controller":"./components/ui-avatar/ui-avatar.js"},{"source":{"file":"./components/ui-badge/ui-badge.html"},"contract":{"version":1,"name":"UiBadge","tag":"ui-badge","nativeElement":"span","props":{"tone":{"type":{"enum":["neutral","accent","info","success","warning","danger"]},"required":false,"target":{"attribute":"tone"},"description":"tone token.","default":"neutral"},"variant":{"type":{"enum":["solid","subtle"]},"required":false,"target":{"attribute":"variant"},"description":"variant token.","default":"subtle"}}},"template":{"kind":"element","name":"span","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n --_badge-surface: var(--ui-surface-subtle);\n --_badge-text: var(--ui-text-secondary);\n --_badge-border: color-mix(in srgb, var(--ui-text-secondary) 30%, transparent);\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n max-width: 100%;\n padding: var(--ui-badge-padding-block, var(--ui-space-0-5)) var(--ui-badge-padding-inline, var(--ui-space-2));\n border: 1px solid var(--ui-badge-border, var(--_badge-border));\n border-radius: var(--ui-radius-round);\n background: var(--ui-badge-surface, var(--_badge-surface));\n color: var(--ui-badge-text, var(--_badge-text));\n font-family: var(--ui-font-family-sans);\n font-size: var(--ui-badge-font-size, var(--ui-font-size-sm));\n font-weight: var(--ui-badge-font-weight, var(--ui-font-medium));\n line-height: var(--ui-badge-line-height, var(--ui-line-height-tight));\n white-space: nowrap;\n }\n\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high. */\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high.\n * Trimming applies to block containers, so the box is a block with centred content. */\n @supports (text-box-trim: trim-both) {\n :host {\n display: block;\n min-block-size: var(--ui-badge-min-block-size, 1.5rem);\n text-align: center;\n align-content: center;\n text-box-trim: trim-both;\n text-box-edge: cap alphabetic;\n }\n }\n\n :host-state([tone=\"accent\"]) {\n --_badge-surface: var(--ui-accent-strong-surface, var(--ui-accent-solid));\n --_badge-border: var(--ui-accent-strong-surface, var(--ui-accent-solid));\n --_badge-text: var(--ui-accent-on-strong, var(--ui-text-on-accent));\n }\n\n :host-state([tone=\"danger\"]) {\n --_badge-surface: var(--ui-danger-strong-surface, var(--ui-danger-solid));\n --_badge-border: var(--ui-danger-strong-surface, var(--ui-danger-solid));\n --_badge-text: var(--ui-danger-on-strong, var(--ui-text-on-accent));\n }\n\n :host-state([tone=\"success\"]) {\n --_badge-surface: var(--ui-success-strong-surface, var(--ui-success-solid));\n --_badge-border: var(--ui-success-strong-surface, var(--ui-success-solid));\n --_badge-text: var(--ui-success-on-strong, var(--ui-text-on-accent));\n }\n\n :host-state([tone=\"warning\"]) {\n --_badge-surface: var(--ui-warning-strong-surface, var(--ui-warning-solid));\n --_badge-border: var(--ui-warning-strong-surface, var(--ui-warning-solid));\n --_badge-text: var(--ui-warning-on-strong, var(--ui-text-on-accent));\n }\n\n :host-state([tone=\"info\"]) {\n --_badge-surface: var(--ui-info-strong-surface, var(--ui-info-solid));\n --_badge-border: var(--ui-info-strong-surface, var(--ui-info-solid));\n --_badge-text: var(--ui-info-on-strong, var(--ui-text-on-accent));\n }\n\n :host-state([variant=\"subtle\"][tone=\"accent\"]) {\n --_badge-surface: var(--ui-accent-soft);\n --_badge-border: var(--ui-accent-soft);\n --_badge-text: var(--ui-accent-subtle-text, var(--ui-accent-solid));\n }\n\n :host-state([variant=\"subtle\"][tone=\"danger\"]) {\n --_badge-surface: var(--ui-danger-soft);\n --_badge-border: var(--ui-danger-soft);\n --_badge-text: var(--ui-danger-subtle-text, var(--ui-danger-solid));\n }\n\n :host-state([variant=\"subtle\"][tone=\"success\"]) {\n --_badge-surface: var(--ui-success-soft);\n --_badge-border: var(--ui-success-soft);\n --_badge-text: var(--ui-success-subtle-text, var(--ui-success-solid));\n }\n\n :host-state([variant=\"subtle\"][tone=\"warning\"]) {\n --_badge-surface: var(--ui-warning-soft);\n --_badge-border: var(--ui-warning-soft);\n --_badge-text: var(--ui-warning-subtle-text, var(--ui-warning-solid));\n }\n\n :host-state([variant=\"subtle\"][tone=\"info\"]) {\n --_badge-surface: var(--ui-info-soft);\n --_badge-border: var(--ui-info-soft);\n --_badge-text: var(--ui-info-subtle-text, var(--ui-info-solid));\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"span","choices":["span"]}},{"source":{"file":"./components/ui-button/ui-button.html"},"contract":{"version":1,"name":"UiButton","tag":"ui-button","nativeElement":"button","props":{"align":{"type":{"enum":["center","start"]},"required":false,"target":{"attribute":"align"},"description":"Content alignment. start lays the content out like a list option: from the start edge, with start-aligned text.","default":"center"},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"size":{"type":{"enum":["sm","md","lg"]},"required":false,"target":{"attribute":"size"},"description":"Control size.","default":"md"},"stretch":{"type":"boolean","required":false,"target":{"attribute":"stretch"},"description":"Fills the inline size of its container.","default":false},"tone":{"type":{"enum":["neutral","accent"]},"required":false,"target":{"attribute":"tone"},"description":"Intent of an outline, ghost, or link button. accent tints it with the accent colour, for a secondary action that still reads as the primary path. For a\n product whose buttons are accent-tinted by default, point --ui-button-surface, --ui-button-border, and --ui-button-text at the accent values in your theme\n rather than annotating every call site, and keep them as var() references so they follow a later change of accent.","default":"neutral"},"variant":{"type":{"enum":["outline","solid","danger","ghost","link"]},"required":false,"target":{"attribute":"variant"},"description":"Visual emphasis and semantic intent. link is an inline text action that reads as a link.","default":"outline"}}},"template":{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"slot"}]},"css":":host {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n vertical-align: middle;\n color: var(--ui-action-secondary-text, var(--ui-text-primary));\n }\n\n :host-state([variant=\"solid\"]) {\n color: var(--ui-action-primary-text, var(--ui-text-on-accent));\n }\n\n :host-state([align=\"start\"]) {\n justify-content: flex-start;\n text-align: start;\n }\n\n :host-state([stretch]) {\n display: flex;\n inline-size: 100%;\n }\n\n :host {\n appearance: none;\n min-block-size: var(--ui-button-min-block-size, var(--ui-control-size-md));\n border: 1px solid var(--ui-button-border, var(--ui-border-strong));\n border-radius: var(--ui-button-radius, var(--ui-radius-md));\n background: var(--ui-button-surface, var(--ui-surface-elevated));\n color: var(--ui-button-text, var(--ui-action-secondary-text, var(--ui-text-primary)));\n font: inherit;\n font-weight: var(--ui-font-medium);\n line-height: var(--ui-line-height-tight);\n padding: var(--ui-space-2) var(--ui-space-3);\n background-image: var(--ui-raised-highlight);\n box-shadow: var(--ui-button-shadow, var(--ui-raised, var(--ui-shadow-xs)));\n cursor: pointer;\n transition:\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease);\n margin: 0;\n }\n\n @supports (text-box-trim: trim-both) {\n :host {\n text-box-trim: trim-both;\n text-box-edge: cap alphabetic;\n }\n }\n\n :host-state([size=\"sm\"]) {\n min-block-size: var(--ui-control-size-sm);\n padding: var(--ui-space-1) var(--ui-space-2);\n font-size: 0.875rem;\n }\n\n :host-state([size=\"lg\"]) {\n min-block-size: var(--ui-control-size-lg);\n padding: var(--ui-space-3) var(--ui-space-4);\n font-size: 1rem;\n }\n\n :host:hover:enabled {\n background: var(--ui-action-secondary-surface-hover, var(--ui-surface-muted));\n border-color: var(--ui-control-border-hover, var(--ui-border-strong));\n }\n\n :host:active:enabled {\n background: var(--ui-surface-subtle);\n }\n\n :host-state([variant=\"solid\"]) {\n border-color: var(--ui-action-primary-surface, var(--ui-accent-solid));\n background: var(--ui-action-primary-surface, var(--ui-accent-solid));\n color: var(--ui-action-primary-text, var(--ui-text-on-accent));\n box-shadow: var(--ui-button-solid-shadow, inset 0 1px rgb(255 255 255 / 0.16), var(--ui-shadow-xs));\n }\n\n :host-state([variant=\"solid\"]):hover:enabled {\n background: var(--ui-action-primary-surface-hover, var(--ui-accent-hover));\n border-color: var(--ui-action-primary-surface-hover, var(--ui-accent-hover));\n box-shadow: var(--ui-shadow-sm);\n transform: translateY(-1px);\n }\n\n :host-state([variant=\"solid\"]):active:enabled {\n background: var(--ui-action-primary-surface-active, var(--ui-accent-active));\n border-color: var(--ui-action-primary-surface-active, var(--ui-accent-active));\n box-shadow: none;\n transform: translateY(0);\n }\n\n :host-state([variant=\"danger\"]) {\n border-color: var(--ui-danger-solid);\n background: var(--ui-danger-solid);\n color: var(--ui-text-on-accent);\n box-shadow: var(--ui-button-danger-shadow, inset 0 1px rgb(255 255 255 / 0.14), var(--ui-shadow-xs));\n }\n\n :host-state([variant=\"danger\"]):hover:enabled {\n background: var(--ui-danger-hover);\n border-color: var(--ui-danger-hover);\n box-shadow: var(--ui-shadow-sm);\n transform: translateY(-1px);\n }\n\n :host-state([variant=\"danger\"]):active:enabled {\n box-shadow: none;\n transform: translateY(0);\n }\n\n /* An accent-tinted secondary action: the outline, ghost, and link variants in the accent colour.\n Solid and danger already carry their own intent. */\n :host-state([tone=\"accent\"]):host-state([variant=\"outline\"]) {\n border-color: var(--ui-button-accent-border, var(--ui-accent));\n background: var(--ui-button-accent-surface, var(--ui-accent-subtle));\n color: var(--ui-button-accent-text, var(--ui-accent-active));\n }\n\n :host-state([tone=\"accent\"]):host-state([variant=\"outline\"]):hover:enabled {\n border-color: var(--ui-button-accent-hover-border, var(--ui-accent-hover));\n background: var(--ui-button-accent-hover-surface, color-mix(in srgb, var(--ui-accent) 16%, var(--ui-surface)));\n }\n\n :host-state([tone=\"accent\"]):is(:host-state([variant=\"ghost\"]), :host-state([variant=\"link\"])) {\n color: var(--ui-button-accent-text, var(--ui-accent-active));\n }\n\n :host-state([variant=\"ghost\"]) {\n border-color: transparent;\n background: transparent;\n box-shadow: none;\n color: var(--ui-button-ghost-text, var(--ui-action-secondary-text, var(--ui-text-primary)));\n }\n\n /* Tints derive from the text colour, not a surface token, so hover and press show on any background. */\n :host-state([variant=\"ghost\"]):hover:enabled {\n background: var(--ui-button-ghost-hover-surface, color-mix(in srgb, currentColor 8%, transparent));\n border-color: transparent;\n }\n\n :host-state([variant=\"ghost\"]):active:enabled {\n background: var(--ui-button-ghost-active-surface, color-mix(in srgb, currentColor 14%, transparent));\n border-color: transparent;\n }\n\n /* A soft halo that transitions in with the other box-shadow changes, layered on the raised shadow. */\n :host:focus-visible {\n outline: none;\n box-shadow:\n var(--ui-button-shadow, var(--ui-raised, var(--ui-shadow-xs))),\n var(--ui-focus-halo);\n }\n\n :host-state([variant=\"solid\"]):focus-visible {\n box-shadow:\n var(--ui-button-solid-shadow, inset 0 1px rgb(255 255 255 / 0.16), var(--ui-shadow-xs)),\n var(--ui-focus-halo);\n }\n\n /* Disabled colours fall back to each variant's own; ghost and link take only the text colour. */\n :host:disabled {\n opacity: var(--ui-button-disabled-opacity, 1);\n cursor: not-allowed;\n border-color: var(--ui-button-disabled-border, var(--ui-border));\n background-color: var(--ui-button-disabled-surface, var(--ui-disabled-surface));\n color: var(--ui-button-disabled-text, var(--ui-disabled-text));\n }\n\n :host-state([variant=\"solid\"]):disabled {\n border-color: var(--ui-button-disabled-border, var(--ui-border));\n background-color: var(--ui-button-disabled-surface, var(--ui-disabled-surface));\n color: var(--ui-button-disabled-text, var(--ui-disabled-text));\n }\n\n :host-state([variant=\"danger\"]):disabled {\n border-color: var(--ui-button-disabled-border, var(--ui-border));\n background-color: var(--ui-button-disabled-surface, var(--ui-disabled-surface));\n color: var(--ui-button-disabled-text, var(--ui-disabled-text));\n }\n\n :host-state([variant=\"ghost\"]):disabled {\n background: none;\n border-color: transparent;\n color: var(--ui-button-disabled-text, var(--ui-disabled-text));\n }\n\n @media (pointer: coarse) {\n :host {\n min-block-size: var(--ui-control-min-block-size);\n }\n }\n\n /* Link: an inline text action. No box, padding, or minimum height (inline targets are exempt under\n WCAG 2.5.8); the inherited font; an underline that strengthens on hover; a visible focus ring. */\n :host-state([variant=\"link\"]) {\n display: inline;\n min-block-size: 0;\n padding: 0;\n border: 0;\n border-radius: var(--ui-radius-sm);\n background: none;\n box-shadow: none;\n font: inherit;\n color: var(--ui-button-link-text, var(--ui-text-secondary));\n text-decoration-line: underline;\n text-decoration-thickness: 1px;\n text-decoration-color: color-mix(in srgb, currentColor 40%, transparent);\n text-underline-offset: 0.2em;\n transition: color var(--ui-motion-fast) var(--ui-motion-ease), text-decoration-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n :host-state([variant=\"link\"]):hover:enabled {\n color: var(--ui-button-link-hover-text, var(--ui-text-primary));\n text-decoration-color: currentColor;\n background: none;\n transform: none;\n }\n\n :host-state([variant=\"link\"]):active:enabled {\n background: none;\n transform: none;\n }\n\n :host-state([variant=\"link\"]):disabled {\n background: none;\n border-color: transparent;\n color: var(--ui-button-disabled-text, var(--ui-disabled-text));\n }\n\n :host-state([variant=\"link\"]):focus-visible {\n box-shadow: none;\n /* Fallback keeps the ring if the token is missing: an unresolved var() would void the outline. */\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: 2px;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"button","choices":["button"]}},{"source":{"file":"./components/ui-callout/ui-callout.html"},"contract":{"version":1,"name":"UiCallout","tag":"ui-callout","nativeElement":"div","props":{"tone":{"type":{"enum":["info","note","warning","success","danger"]},"required":false,"target":{"attribute":"tone"},"description":"Semantic message tone.","default":"info"}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"note"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"icon"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"12"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"10"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M12 16v-4"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M12 8h.01"}],"children":[]}],"flow":{"kind":"if","test":"tone = 'info'","testPlan":{"source":"tone = 'info'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"tone"},"right":{"kind":"literal","value":"info"}},"dependencies":["tone"]}}},{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M13.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8.5L13.5 2Z"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M13 2v7h7"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m9.5 17.5 4-4 2 2-4 4H9.5v-2Z"}],"children":[]}],"flow":{"kind":"if","test":"tone = 'note'","testPlan":{"source":"tone = 'note'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"tone"},"right":{"kind":"literal","value":"note"}},"dependencies":["tone"]}}},{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m21.73 18-8-14a2 2 0 0 0-3.46 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M12 9v4"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M12 17h.01"}],"children":[]}],"flow":{"kind":"if","test":"tone = 'warning'","testPlan":{"source":"tone = 'warning'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"tone"},"right":{"kind":"literal","value":"warning"}},"dependencies":["tone"]}}},{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"12"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"10"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m9 12 2 2 4-4"}],"children":[]}],"flow":{"kind":"if","test":"tone = 'success'","testPlan":{"source":"tone = 'success'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"tone"},"right":{"kind":"literal","value":"success"}},"dependencies":["tone"]}}},{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"12"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"10"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m15 9-6 6"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m9 9 6 6"}],"children":[]}],"flow":{"kind":"if","test":"tone = 'danger'","testPlan":{"source":"tone = 'danger'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"tone"},"right":{"kind":"literal","value":"danger"}},"dependencies":["tone"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"content"}],"children":[{"kind":"slot"}]}]},"css":":host {\n --_callout-surface: var(--ui-info-soft);\n --_callout-border: var(--ui-info-solid);\n --_callout-icon: var(--ui-info-solid);\n\n display: grid;\n grid-template-columns: var(--ui-callout-icon-column, 1.125rem) minmax(0, 1fr);\n gap: var(--ui-callout-gap, calc(var(--ui-space-2) * 0.75));\n align-items: start;\n max-width: 100%;\n padding: var(--ui-callout-padding-block, var(--ui-space-2)) var(--ui-callout-padding-inline, var(--ui-space-3));\n border: var(--ui-callout-border-width, 1px) solid color-mix(in srgb, var(--ui-callout-border, var(--_callout-border)) 35%, transparent);\n border-inline-start: var(--ui-callout-leading-border-width, 4px) solid var(--ui-callout-border, var(--_callout-border));\n border-radius: var(--ui-radius-md);\n background: var(--ui-callout-surface, var(--_callout-surface));\n color: var(--ui-callout-text, var(--ui-text-primary));\n font-family: var(--ui-font-family-sans);\n font-size: var(--ui-font-size-sm);\n font-weight: var(--ui-font-normal);\n line-height: var(--ui-line-height-md);\n }\n\n /* One line box tall, so the icon centres on the first line of text. */\n .icon {\n display: grid;\n place-items: center;\n inline-size: var(--ui-callout-icon-column, 1.125rem);\n block-size: 1lh;\n color: var(--ui-callout-icon, var(--_callout-icon));\n }\n\n .icon svg {\n inline-size: var(--ui-callout-icon-size, 1.125rem);\n block-size: var(--ui-callout-icon-size, 1.125rem);\n }\n\n .content {\n min-inline-size: 0;\n }\n\n :host-state([tone=\"note\"]) {\n --_callout-surface: var(--ui-surface-muted);\n --_callout-border: var(--ui-border-strong);\n --_callout-icon: var(--ui-text-secondary);\n }\n\n :host-state([tone=\"warning\"]) {\n --_callout-surface: var(--ui-warning-soft);\n --_callout-border: var(--ui-warning-solid);\n --_callout-icon: var(--ui-warning-solid);\n }\n\n :host-state([tone=\"success\"]) {\n --_callout-surface: var(--ui-success-soft);\n --_callout-border: var(--ui-success-solid);\n --_callout-icon: var(--ui-success-solid);\n }\n\n :host-state([tone=\"danger\"]) {\n --_callout-surface: var(--ui-danger-soft);\n --_callout-border: var(--ui-danger-solid);\n --_callout-icon: var(--ui-danger-solid);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-checkbox/ui-checkbox.html"},"contract":{"version":1,"name":"UiCheckbox","tag":"ui-checkbox","nativeElement":"label","props":{"checked":{"type":"boolean","required":false,"target":{"attribute":"checked"},"description":"Whether the checkbox is checked initially or when set externally.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"indeterminate":{"type":"boolean","required":false,"target":{"property":"indeterminate"},"description":"indeterminate token.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"required token.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"value token.","default":"on"}}},"template":{"kind":"element","name":"label","attributes":[],"children":[{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"checkbox"},{"kind":"property","key":"checked","name":"checked","expression":"internalChecked","expressionPlan":{"source":"internalChecked","ast":{"kind":"id","name":"internalChecked"},"dependencies":["internalChecked"]}},{"kind":"property","key":"indeterminate","name":"indeterminate","expression":"indeterminate","expressionPlan":{"source":"indeterminate","ast":{"kind":"id","name":"indeterminate"},"dependencies":["indeterminate"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}}],"children":[],"ref":"input"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot"}]}]},"css":":host {\n display: inline-flex;\n align-items: flex-start;\n gap: var(--ui-checkbox-gap, var(--ui-space-2));\n max-inline-size: 100%;\n color: var(--ui-text-primary);\n cursor: pointer;\n }\n\n .label {\n min-inline-size: 0;\n line-height: var(--ui-line-height-md);\n }\n\n input {\n appearance: none;\n -webkit-appearance: none;\n position: relative;\n flex: 0 0 auto;\n inline-size: var(--ui-checkbox-size, 1.125rem);\n block-size: var(--ui-checkbox-size, 1.125rem);\n margin: 0.125em 0 0;\n border: 1px solid var(--ui-control-border-hover, var(--ui-border-strong));\n border-radius: var(--ui-radius-sm);\n background: var(--ui-control-surface, var(--ui-surface-default));\n box-shadow: inset 0 1px 2px color-mix(in srgb, var(--ui-text-primary) 8%, transparent);\n cursor: pointer;\n transition:\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n input::after {\n content: \"\";\n position: absolute;\n opacity: 0;\n }\n\n input:checked,\n input:indeterminate {\n border-color: var(--ui-accent-solid);\n background: var(--ui-accent-solid);\n box-shadow: inset 0 1px 2px color-mix(in srgb, #000 16%, transparent);\n }\n\n /* Centre the tick's box, then lift it: a rotated L's ink sits ~0.11rem below its box centre. */\n input:checked::after {\n inset: 0;\n margin: auto;\n inline-size: 0.32rem;\n block-size: 0.58rem;\n border: solid var(--ui-text-on-accent);\n border-width: 0 0.125rem 0.125rem 0;\n opacity: 1;\n transform: translateY(-0.11rem) rotate(45deg);\n }\n\n input:indeterminate::after {\n inset: 50% 0.23rem auto;\n block-size: 0.125rem;\n border-radius: var(--ui-radius-round);\n background: var(--ui-text-on-accent);\n opacity: 1;\n transform: translateY(-50%);\n }\n\n input:hover:enabled {\n border-color: var(--ui-accent-solid);\n }\n\n input:focus-visible {\n outline: 2px solid var(--ui-focus-ring, var(--ui-accent-solid));\n outline-offset: 2px;\n }\n\n :host-state([disabled]) {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n :host-state([disabled]) input {\n border-color: var(--ui-border-default);\n background: var(--ui-control-surface-disabled, var(--ui-surface-muted));\n cursor: not-allowed;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalChecked","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"change","type":"object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"label","choices":["label"]},"controller":"./components/ui-checkbox/ui-checkbox.js"},{"source":{"file":"./components/ui-cluster/ui-cluster.html"},"contract":{"version":1,"name":"UiCluster","tag":"ui-cluster","nativeElement":"div","props":{"align":{"type":{"enum":["start","center","end","stretch"]},"required":false,"target":{"attribute":"align"},"description":"align token."},"gap":{"type":{"enum":["xs","s","m","l","xl"]},"required":false,"target":{"attribute":"gap"},"description":"gap token."}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n --_layout-gap: var(--ui-space-3);\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: var(--ui-cluster-gap, var(--_layout-gap));\n min-inline-size: 0;\n max-inline-size: 100%;\n margin: 0;\n }\n\n :host-state([gap=\"xs\"]) {\n --_layout-gap: var(--ui-space-2);\n }\n :host-state([gap=\"s\"]) {\n --_layout-gap: var(--ui-space-3);\n }\n :host-state([gap=\"m\"]) {\n --_layout-gap: var(--ui-space-4);\n }\n :host-state([gap=\"l\"]) {\n --_layout-gap: var(--ui-space-5);\n }\n :host-state([gap=\"xl\"]) {\n --_layout-gap: var(--ui-space-6);\n }\n :host-state([align=\"start\"]) {\n align-items: flex-start;\n }\n :host-state([align=\"end\"]) {\n align-items: flex-end;\n }\n :host-state([align=\"stretch\"]) {\n align-items: stretch;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-combobox/ui-combobox.html"},"contract":{"version":1,"name":"UiCombobox","tag":"ui-combobox","nativeElement":"div","props":{"allowCreate":{"type":"boolean","required":false,"target":{"attribute":"allowcreate"},"description":"Offers the current query as a new option.","default":false},"allowFreeText":{"type":"boolean","required":false,"target":{"attribute":"allowfreetext"},"description":"Allows values that do not match an authored option.","default":false},"clearable":{"type":"boolean","required":false,"target":{"attribute":"clearable"},"description":"clearable token.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"disclosure":{"type":"boolean","required":false,"target":{"attribute":"disclosure"},"description":"disclosure token.","default":false},"help":{"type":"string","required":false,"target":{"attribute":"help"},"description":"help token.","default":""},"items":{"type":{"kind":"list","item":{"kind":"object","fields":[{"name":"id","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"value","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"label","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"group","type":{"kind":"terminal","name":"string"},"optional":true},{"name":"disabled","type":{"kind":"terminal","name":"boolean"},"optional":true}],"open":false}},"required":false,"target":{"attribute":"items"},"description":"The selected items in multiple mode, as JSON."},"label":{"type":"string","required":false,"target":{"attribute":"label"},"description":"label token.","default":""},"labelVisibility":{"type":{"enum":["visible","sr-only"]},"required":false,"target":{"attribute":"labelvisibility"},"description":"labelVisibility token.","default":"visible"},"multiple":{"type":"boolean","required":false,"target":{"attribute":"multiple"},"description":"multiple token.","default":false},"name":{"type":"string","required":false,"target":{"attribute":"name"},"description":"name token.","default":""},"placeholder":{"type":"string","required":false,"target":{"attribute":"placeholder"},"description":"placeholder token.","default":""},"query":{"type":"string","required":false,"target":{"attribute":"query"},"description":"query token."},"readonly":{"type":"boolean","required":false,"target":{"attribute":"readonly"},"description":"Whether the current value may be selected but not edited.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"required token.","default":false},"size":{"type":{"enum":["sm","md"]},"required":false,"target":{"attribute":"size"},"description":"size token.","default":"md"},"tokenSeparators":{"type":{"kind":"list","item":{"kind":"terminal","name":"string"}},"required":false,"target":{"attribute":"tokenseparators"},"description":"tokenSeparators token."},"value":{"type":{"kind":"union","members":[{"kind":"terminal","name":"string"},{"kind":"terminal","name":"null"}]},"required":false,"target":{"attribute":"value"},"description":"The selected value in single mode."}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"label","attributes":[{"kind":"attribute","name":"for","expression":"format('%s-input', uid)","expressionPlan":{"source":"format('%s-input', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-input"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"sr-only","expression":"labelVisibility = 'sr-only'","expressionPlan":{"source":"labelVisibility = 'sr-only'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"labelVisibility"},"right":{"kind":"literal","value":"sr-only"}},"dependencies":["labelVisibility"]},"target":"class"}],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[]},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"text","value":"\n *"}],"flow":{"kind":"if","test":"required","testPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"control"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"field"}],"children":[{"kind":"slot","fallback":[],"name":"start"},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"item"},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"tabindex","value":"-1"},{"kind":"attribute","name":"data-index","expression":"index","expressionPlan":{"source":"index","ast":{"kind":"id","name":"index"},"dependencies":["index"]}},{"kind":"attribute","name":"disabled","expression":"disabled or readonly or item.disabled","expressionPlan":{"source":"disabled or readonly or item.disabled","ast":{"kind":"binary","op":"or","left":{"kind":"binary","op":"or","left":{"kind":"id","name":"disabled"},"right":{"kind":"id","name":"readonly"}},"right":{"kind":"member","object":{"kind":"id","name":"item"},"key":"disabled"}},"dependencies":["disabled","item.disabled","readonly"]}},{"kind":"attribute","name":"aria-label","expression":"format('%s, press Delete or Backspace to remove', item.label)","expressionPlan":{"source":"format('%s, press Delete or Backspace to remove', item.label)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s, press Delete or Backspace to remove"},{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"}]},"dependencies":["item.label"]}}],"children":[{"kind":"slot","fallback":[{"kind":"element","name":"ui-badge","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"nameExpression":{"source":"format('item-%s', item.id)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"item-%s"},{"kind":"member","object":{"kind":"id","name":"item"},"key":"id"}]},"dependencies":["item.id"]}}],"flow":{"kind":"each","item":"item","list":"internalItems","listPlan":{"source":"internalItems","ast":{"kind":"id","name":"internalItems"},"dependencies":["internalItems"]},"index":"index","key":"item.id","keyPlan":{"source":"item.id","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"id"},"dependencies":["item.id"]}}}],"flow":{"kind":"if","test":"multiple","testPlan":{"source":"multiple","ast":{"kind":"id","name":"multiple"},"dependencies":["multiple"]}}},{"kind":"element","name":"input","attributes":[{"kind":"attribute","name":"id","expression":"format('%s-input', uid)","expressionPlan":{"source":"format('%s-input', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-input"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"literal","name":"role","value":"combobox"},{"kind":"literal","name":"aria-autocomplete","value":"list"},{"kind":"literal","name":"autocomplete","value":"off"},{"kind":"attribute","name":"aria-controls","expression":"format('%s-listbox', uid)","expressionPlan":{"source":"format('%s-listbox', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-listbox"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"aria-expanded","expression":"expanded","expressionPlan":{"source":"expanded","ast":{"kind":"id","name":"expanded"},"dependencies":["expanded"]}},{"kind":"attribute","name":"aria-invalid","expression":"validationStatus = 'error'","expressionPlan":{"source":"validationStatus = 'error'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"validationStatus"},"right":{"kind":"literal","value":"error"}},"dependencies":["validationStatus"]}},{"kind":"attribute","name":"aria-busy","expression":"validationStatus = 'pending'","expressionPlan":{"source":"validationStatus = 'pending'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"validationStatus"},"right":{"kind":"literal","value":"pending"}},"dependencies":["validationStatus"]}},{"kind":"property","key":"value","name":"value","expression":"display","expressionPlan":{"source":"display","ast":{"kind":"id","name":"display"},"dependencies":["display"]}},{"kind":"attribute","name":"placeholder","expression":"placeholder","expressionPlan":{"source":"placeholder","ast":{"kind":"id","name":"placeholder"},"dependencies":["placeholder"]}},{"kind":"attribute","name":"name","expression":"name","expressionPlan":{"source":"name","ast":{"kind":"id","name":"name"},"dependencies":["name"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"readonly","expression":"readonly","expressionPlan":{"source":"readonly","ast":{"kind":"id","name":"readonly"},"dependencies":["readonly"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}}],"children":[],"ref":"input"},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"data-combobox-action","value":"clear"},{"kind":"literal","name":"aria-label","value":"Clear"}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"class","value":"affordance-icon"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M7 7l10 10M17 7 7 17"}],"children":[]}]}],"flow":{"kind":"if","test":"clearable","testPlan":{"source":"clearable","ast":{"kind":"id","name":"clearable"},"dependencies":["clearable"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"data-combobox-action","value":"disclosure"},{"kind":"literal","name":"tabindex","value":"-1"},{"kind":"literal","name":"aria-label","value":"Show suggestions"},{"kind":"attribute","name":"aria-controls","expression":"format('%s-listbox', uid)","expressionPlan":{"source":"format('%s-listbox', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-listbox"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"class","value":"affordance-icon"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2.25"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m6 9 6 6 6-6"}],"children":[]}]}],"flow":{"kind":"if","test":"disclosure","testPlan":{"source":"disclosure","ast":{"kind":"id","name":"disclosure"},"dependencies":["disclosure"]}}}],"ref":"field"},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"help"},{"kind":"attribute","name":"id","expression":"format('%s-help', uid)","expressionPlan":{"source":"format('%s-help', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-help"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"aria-label","value":"Help"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"class","value":"help-icon"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"12"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"10"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M12 17h.01"}],"children":[]}]}],"flow":{"kind":"if","test":"help","testPlan":{"source":"help","ast":{"kind":"id","name":"help"},"dependencies":["help"]}}}]},{"kind":"element","name":"ui-tooltip","attributes":[{"kind":"literal","name":"trigger","value":"click"},{"kind":"attribute","name":"id","expression":"format('%s-help-text', uid)","expressionPlan":{"source":"format('%s-help-text', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-help-text"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"for","expression":"format('%s-help', uid)","expressionPlan":{"source":"format('%s-help', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-help"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}}],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"help","expressionPlan":{"source":"help","ast":{"kind":"id","name":"help"},"dependencies":["help"]}}],"children":[]}],"flow":{"kind":"if","test":"help","testPlan":{"source":"help","ast":{"kind":"id","name":"help"},"dependencies":["help"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"popup"},{"kind":"attribute","name":"hidden","expression":"not expanded","expressionPlan":{"source":"not expanded","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"expanded"}},"dependencies":["expanded"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"listbox"},{"kind":"attribute","name":"id","expression":"format('%s-listbox', uid)","expressionPlan":{"source":"format('%s-listbox', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-listbox"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"aria-label","expression":"format('%s suggestions', label)","expressionPlan":{"source":"format('%s suggestions', label)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s suggestions"},{"kind":"id","name":"label"}]},"dependencies":["label"]}},{"kind":"attribute","name":"aria-busy","expression":"loading","expressionPlan":{"source":"loading","ast":{"kind":"id","name":"loading"},"dependencies":["loading"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"attribute","name":"role","expression":"group.role","expressionPlan":{"source":"group.role","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"role"},"dependencies":["group.role"]}},{"kind":"attribute","name":"aria-label","expression":"group.label","expressionPlan":{"source":"group.label","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"label"},"dependencies":["group.label"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"group"},{"kind":"directive","name":"value","expression":"group.name","expressionPlan":{"source":"group.name","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"name"},"dependencies":["group.name"]}}],"children":[],"flow":{"kind":"if","test":"group.name","testPlan":{"source":"group.name","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"name"},"dependencies":["group.name"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"option"},{"kind":"attribute","name":"active","expression":"row.index = active","expressionPlan":{"source":"row.index = active","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"},"right":{"kind":"id","name":"active"}},"dependencies":["active","row.index"]},"target":"class"},{"kind":"literal","name":"role","value":"option"},{"kind":"attribute","name":"id","expression":"format('%s-option-%s', uid, row.index)","expressionPlan":{"source":"format('%s-option-%s', uid, row.index)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s"},{"kind":"id","name":"uid"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"}]},"dependencies":["row.index","uid"]}},{"kind":"attribute","name":"aria-selected","expression":"row.value = selected","expressionPlan":{"source":"row.value = selected","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"row"},"key":"value"},"right":{"kind":"id","name":"selected"}},"dependencies":["row.value","selected"]}},{"kind":"attribute","name":"aria-disabled","expression":"row.disabled","expressionPlan":{"source":"row.disabled","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"disabled"},"dependencies":["row.disabled"]}},{"kind":"attribute","name":"data-index","expression":"row.index","expressionPlan":{"source":"row.index","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"},"dependencies":["row.index"]}}],"children":[{"kind":"slot","fallback":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"primary"},{"kind":"directive","name":"value","expression":"row.label","expressionPlan":{"source":"row.label","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"label"},"dependencies":["row.label"]}}],"children":[]}],"nameExpression":{"source":"format('option-%s', row.id)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"option-%s"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"id"}]},"dependencies":["row.id"]}}],"flow":{"kind":"each","item":"row","list":"group.rows","listPlan":{"source":"group.rows","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"rows"},"dependencies":["group.rows"]},"key":"row.id","keyPlan":{"source":"row.id","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"id"},"dependencies":["row.id"]}}}],"flow":{"kind":"each","item":"group","list":"groups","listPlan":{"source":"groups","ast":{"kind":"id","name":"groups"},"dependencies":["groups"]},"key":"group.name","keyPlan":{"source":"group.name","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"name"},"dependencies":["group.name"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"option"},{"kind":"attribute","name":"active","expression":"createIndex = active","expressionPlan":{"source":"createIndex = active","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"createIndex"},"right":{"kind":"id","name":"active"}},"dependencies":["active","createIndex"]},"target":"class"},{"kind":"literal","name":"role","value":"option"},{"kind":"literal","name":"aria-selected","value":"false"},{"kind":"attribute","name":"id","expression":"format('%s-option-%s', uid, createIndex)","expressionPlan":{"source":"format('%s-option-%s', uid, createIndex)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s"},{"kind":"id","name":"uid"},{"kind":"id","name":"createIndex"}]},"dependencies":["createIndex","uid"]}},{"kind":"attribute","name":"data-index","expression":"createIndex","expressionPlan":{"source":"createIndex","ast":{"kind":"id","name":"createIndex"},"dependencies":["createIndex"]}},{"kind":"directive","name":"value","expression":"format('Create “%s”', raw)","expressionPlan":{"source":"format('Create “%s”', raw)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"Create “%s”"},{"kind":"id","name":"raw"}]},"dependencies":["raw"]}}],"children":[],"flow":{"kind":"if","test":"creatable","testPlan":{"source":"creatable","ast":{"kind":"id","name":"creatable"},"dependencies":["creatable"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"message"},{"kind":"directive","name":"value","expression":"message","expressionPlan":{"source":"message","ast":{"kind":"id","name":"message"},"dependencies":["message"]}}],"children":[],"flow":{"kind":"if","test":"message","testPlan":{"source":"message","ast":{"kind":"id","name":"message"},"dependencies":["message"]}}}],"ref":"listbox"},{"kind":"slot","fallback":[],"name":"footer"}],"ref":"popup"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"message"},{"kind":"attribute","name":"id","expression":"format('%s-validation', uid)","expressionPlan":{"source":"format('%s-validation', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-validation"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"hidden","expression":"not validation.issues.length","expressionPlan":{"source":"not validation.issues.length","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"member","object":{"kind":"id","name":"validation"},"key":"issues"},"key":"length"}},"dependencies":["validation.issues.length"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"directive","name":"value","expression":"issue.message","expressionPlan":{"source":"issue.message","ast":{"kind":"member","object":{"kind":"id","name":"issue"},"key":"message"},"dependencies":["issue.message"]}}],"children":[],"flow":{"kind":"each","item":"issue","list":"validation.issues","listPlan":{"source":"validation.issues","ast":{"kind":"member","object":{"kind":"id","name":"validation"},"key":"issues"},"dependencies":["validation.issues"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sr-only"},{"kind":"literal","name":"role","value":"status"},{"kind":"literal","name":"aria-live","value":"polite"},{"kind":"literal","name":"aria-atomic","value":"true"},{"kind":"directive","name":"value","expression":"statusText","expressionPlan":{"source":"statusText","ast":{"kind":"id","name":"statusText"},"dependencies":["statusText"]}}],"children":[]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"authored-options"},{"kind":"literal","name":"hidden","value":""},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"slot"}],"ref":"options"}]},"css":":host {\n display: grid;\n gap: var(--ui-space-1);\n min-inline-size: 0;\n color: var(--ui-text-primary);\n font: inherit;\n }\n label {\n color: var(--ui-combobox-label-text, var(--ui-text-primary));\n font-size: var(--ui-combobox-label-font-size, 0.875rem);\n font-weight: 500;\n }\n /* The field and anything that annotates it sit on one row; the help button is beside the box,\n not inside it, because a control's box holds its value. */\n .control {\n display: flex;\n align-items: center;\n gap: var(--ui-space-2);\n min-inline-size: 0;\n }\n\n .field {\n flex: 1 1 auto;\n display: flex;\n min-inline-size: 0;\n border: 1px solid var(--ui-control-border, var(--ui-border-default));\n border-radius: var(--ui-radius-md);\n background: var(--ui-control-surface, var(--ui-surface-default));\n box-shadow: var(--ui-control-inset);\n transition: border-color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease);\n }\n .field:focus-within {\n border-color: var(--ui-control-focus, var(--ui-accent-solid));\n box-shadow:\n var(--ui-control-inset),\n var(--ui-control-focus-halo-shadow);\n }\n /* A ghost icon button: the affordance is the mark, not a box around it. */\n .help {\n flex: none;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n inline-size: var(--ui-control-size-sm);\n block-size: var(--ui-control-size-sm);\n padding: 0;\n border: 0;\n border-radius: var(--ui-radius-round);\n background: transparent;\n color: var(--ui-text-secondary);\n cursor: pointer;\n transition: background-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .help:hover:enabled,\n .help[aria-expanded=\"true\"] {\n background: color-mix(in srgb, currentColor 8%, transparent);\n color: var(--ui-text-primary);\n }\n\n .help:focus-visible {\n outline: none;\n box-shadow: var(--ui-focus-halo);\n }\n\n .help:disabled {\n color: var(--ui-disabled-text);\n cursor: not-allowed;\n }\n\n .help-icon {\n inline-size: var(--ui-icon-size-sm);\n block-size: var(--ui-icon-size-sm);\n }\n\n input::selection {\n background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);\n color: inherit;\n }\n input {\n appearance: none;\n width: 100%;\n min-inline-size: 0;\n min-block-size: calc(var(--ui-control-size-md) - 2px);\n box-sizing: border-box;\n border: 0;\n border-radius: inherit;\n background: transparent;\n color: inherit;\n font: inherit;\n line-height: var(--ui-line-height-md);\n padding: var(--ui-space-2) var(--ui-space-3);\n margin: 0;\n outline: none;\n }\n :host-state([size=\"sm\"]) input {\n min-block-size: calc(var(--ui-control-size-sm) - 2px);\n padding: var(--ui-space-1) var(--ui-space-2);\n }\n button {\n appearance: none;\n display: inline-grid;\n place-items: center;\n align-self: stretch;\n border: 0;\n border-radius: var(--ui-radius-md);\n background: transparent;\n color: var(--ui-combobox-affordance-text, var(--ui-text-secondary));\n font: inherit;\n font-weight: 400;\n min-inline-size: 2rem;\n padding: 0 var(--ui-space-1);\n cursor: pointer;\n }\n .affordance-icon {\n display: block;\n inline-size: var(--ui-icon-size-sm);\n block-size: var(--ui-icon-size-sm);\n }\n button:hover:enabled {\n background: var(--ui-surface-muted);\n color: var(--ui-text-primary);\n }\n button:focus-visible {\n outline: none;\n background: var(--ui-surface-muted);\n box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--ui-focus-ring) 45%, transparent);\n }\n input:disabled, button:disabled {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n .field:has(input:disabled) {\n background: var(--ui-control-surface-disabled, var(--ui-surface-muted));\n }\n :host-state([validationStatus=\"error\"]) .field {\n border-color: var(--ui-danger-solid, var(--ui-accent-active));\n }\n .popup {\n box-sizing: border-box;\n min-inline-size: 12rem;\n max-inline-size: calc(100vw - 1rem);\n max-block-size: var(--ui-combobox-max-block-size, 18rem);\n overflow: auto;\n margin: 0;\n padding: var(--ui-space-1);\n border: 1px solid var(--ui-border-default);\n border-radius: var(--ui-radius-md);\n background: var(--ui-surface-elevated);\n color: var(--ui-text-primary);\n box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));\n }\n [hidden] {\n display: none;\n }\n .option {\n padding: var(--ui-space-2) var(--ui-space-3);\n border-radius: var(--ui-radius-sm);\n cursor: pointer;\n overflow-wrap: anywhere;\n }\n .option:hover, .option.active {\n background: var(--ui-surface-muted);\n outline: 1px solid var(--ui-focus-ring);\n outline-offset: -1px;\n }\n .option[aria-disabled=\"true\"] {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n .primary {\n display: block;\n color: var(--ui-combobox-option-text, var(--ui-text-primary));\n font-weight: 500;\n }\n .message, .group {\n color: var(--ui-combobox-message-text, var(--ui-text-secondary));\n font-weight: 400;\n font-size: var(--ui-font-size-sm);\n line-height: var(--ui-line-height-md);\n overflow-wrap: anywhere;\n }\n .group, .popup .message {\n padding: var(--ui-space-2) var(--ui-space-3);\n }\n .sr-only {\n position: absolute;\n inline-size: 1px;\n block-size: 1px;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n }\n @media (pointer: coarse) {\n button {\n min-inline-size: 2.75rem;\n min-block-size: 2.75rem;\n }\n }\n @media (forced-colors: active) {\n .field, .popup {\n border-color: CanvasText;\n }\n .option.active {\n outline-color: Highlight;\n }\n }\n\n /* Multiple mode: chips wrap before the cursor on one flexible field line. */\n :host-state([multiple]) .field {\n flex-wrap: wrap;\n align-items: center;\n gap: var(--ui-space-1);\n min-block-size: var(--ui-combobox-item-min-block-size, 2.5rem);\n padding: var(--ui-space-1);\n }\n :host-state([multiple]) input {\n flex: 1 0 var(--ui-combobox-item-input-min-inline-size, 5rem);\n width: auto;\n min-block-size: 1.75rem;\n padding: var(--ui-space-0-5) var(--ui-space-1);\n }\n .item {\n appearance: none;\n display: inline-flex;\n min-inline-size: 0;\n max-inline-size: min(100%, var(--ui-combobox-item-item-max-inline-size, 12rem));\n overflow: hidden;\n padding: 0;\n border: 0;\n border-radius: var(--ui-radius-sm);\n background: transparent;\n color: inherit;\n font: inherit;\n cursor: default;\n }\n .item:focus-visible {\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: 1px;\n }\n .item:disabled {\n opacity: 0.6;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalItems","type":"list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"raw","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"display","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"selected","type":"string | null","expression":{"source":"null","ast":{"kind":"literal","value":null},"dependencies":[]}},{"kind":"state","name":"expanded","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"rows","type":"list(object({ id: string, value: string, label: string, group?: string, disabled: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"active","expression":{"source":"-1","ast":{"kind":"unary","op":"-","operand":{"kind":"literal","value":1}},"dependencies":[]}},{"kind":"state","name":"loading","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"helpOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"lookupError","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"validation","type":"object({ status: pristine | pending | valid | warning | error, touched: boolean, dirty: boolean, issues: list(object({ message: string })), ... })","expression":{"source":"{ status: 'pristine', touched: false, dirty: false, issues: [] }","ast":{"kind":"object","pairs":[{"key":"status","value":{"kind":"literal","value":"pristine"}},{"key":"touched","value":{"kind":"literal","value":false}},{"key":"dirty","value":{"kind":"literal","value":false}},{"key":"issues","value":{"kind":"array","items":[]}}]},"dependencies":[]}},{"kind":"state","name":"uid","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"groups","type":"list(object({ name: string, role: group | presentation, label: string | null, rows: list(object({ id: string, value: string, label: string, group?: string, disabled: boolean, index: integer })) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"creatable","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"createIndex","expression":{"source":"0","ast":{"kind":"literal","value":0},"dependencies":[]}},{"kind":"state","name":"message","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"statusText","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"validationStatus","expression":{"source":"'pristine'","ast":{"kind":"literal","value":"pristine"},"dependencies":[]}},{"kind":"event","name":"query-change","type":"object({ query: string, display: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"value-change","type":"object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic }) | list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean }))","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"free-entry","type":"object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"create-entry","type":"object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"validation-change","type":"object({ status: pristine | pending | valid | warning | error, touched: boolean, dirty: boolean, issues: list(object({ message: string, path?: list(unknown), severity?: error | warning })), output?: unknown })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"options-change","type":"list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean }))","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"add-item","type":"object({ item: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }), index: integer, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"remove-item","type":"object({ item: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }), index: integer, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"create-item","type":"object({ query: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"method","name":"validate","exportName":"validate","returns":"promise(unknown)"},{"kind":"method","name":"focusInput","exportName":"focusInput","returns":"promise(undefined)"}],"slots":[{"dynamic":false,"required":true,"name":"start"},{"dynamic":true,"required":false},{"dynamic":true,"required":false},{"dynamic":false,"required":true,"name":"footer"},{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-combobox/ui-combobox.js"},{"source":{"file":"./components/ui-container/ui-container.html"},"contract":{"version":1,"name":"UiContainer","tag":"ui-container","nativeElement":"div","props":{"gutters":{"type":{"enum":["s","m","l"]},"required":false,"target":{"attribute":"gutters"},"description":"gutters token."},"measure":{"type":{"enum":["narrow","wide"]},"required":false,"target":{"attribute":"measure"},"description":"measure token."}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n --_container-measure: 65ch;\n --_container-gutters: var(--ui-space-4);\n display: block;\n inline-size: 100%;\n max-inline-size: var(--ui-container-measure, var(--_container-measure));\n margin-inline: auto;\n padding-inline: var(--ui-container-gutters, var(--_container-gutters));\n }\n\n :host-state([measure=\"narrow\"]) {\n --_container-measure: 45ch;\n }\n :host-state([measure=\"wide\"]) {\n --_container-measure: 80ch;\n }\n :host-state([gutters=\"s\"]) {\n --_container-gutters: var(--ui-space-3);\n }\n :host-state([gutters=\"m\"]) {\n --_container-gutters: var(--ui-space-4);\n }\n :host-state([gutters=\"l\"]) {\n --_container-gutters: var(--ui-space-5);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-context-menu/ui-context-menu.html"},"contract":{"version":1,"name":"UiContextMenu","tag":"ui-context-menu","nativeElement":"span","props":{"for":{"type":"string","required":false,"target":{"attribute":"for"},"description":"ID of the control that opens the menu by click, keyboard activation, or context click.","default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the context menu is open initially or when set externally.","default":false}}},"template":{"kind":"element","name":"span","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu"},{"kind":"literal","name":"role","value":"menu"},{"kind":"literal","name":"aria-orientation","value":"vertical"}],"children":[{"kind":"slot"}],"ref":"menu"}]},"css":":host {\n display: contents;\n }\n\n .menu {\n position: fixed;\n inset: auto;\n margin: 0;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n padding: var(--ui-space-1);\n background: var(--ui-surface-elevated);\n border: 1px solid var(--ui-border-default);\n border-radius: var(--ui-radius-lg);\n box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));\n outline: 0;\n overflow: auto;\n z-index: var(--ui-context-menu-z-index, 1000);\n min-width: 12rem;\n opacity: 0;\n transform: translateY(-4px) scale(0.99);\n transition:\n opacity var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease),\n display var(--ui-motion-fast) allow-discrete,\n overlay var(--ui-motion-fast) allow-discrete;\n }\n\n .menu:popover-open {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n @starting-style {\n .menu:popover-open {\n opacity: 0;\n transform: translateY(-4px) scale(0.99);\n }\n }\n\n .menu[hidden],\n .menu[popover]:not(:popover-open) {\n display: none;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .menu {\n transition: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"open","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"select","type":"object({ value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"span","choices":["span"]},"controller":"./components/ui-context-menu/ui-context-menu.js"},{"source":{"file":"./components/ui-dialog/ui-dialog.html"},"contract":{"version":1,"name":"UiDialog","tag":"ui-dialog","nativeElement":"dialog","props":{"dismissible":{"type":"boolean","required":false,"target":{"attribute":"dismissible"},"description":"Also close on Escape and on a pointer press outside the dialog. The header close button and actions always close it.","default":false},"for":{"type":"string","required":false,"target":{"attribute":"for"},"description":"ID of the control that opens the dialog.","default":""},"label":{"type":"string","required":false,"target":{"attribute":"label"},"description":"Visible title in the dialog header; also its accessible name."},"modal":{"type":"boolean","required":false,"target":{"attribute":"modal"},"description":"Open in the top layer with a backdrop and make the rest of the page inert.","default":false},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the dialog is open initially or when set externally.","default":false}}},"template":{"kind":"element","name":"dialog","attributes":[{"kind":"attribute","name":"aria-label","expression":"accessibleLabel","expressionPlan":{"source":"accessibleLabel","ast":{"kind":"id","name":"accessibleLabel"},"dependencies":["accessibleLabel"]}}],"children":[{"kind":"element","name":"header","attributes":[],"children":[{"kind":"element","name":"h2","attributes":[{"kind":"literal","name":"class","value":"title"},{"kind":"directive","name":"value","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[],"flow":{"kind":"if","test":"label","testPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"close"},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"aria-label","value":"Close"}],"children":[],"ref":"close"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"body"}],"children":[{"kind":"slot"}]},{"kind":"element","name":"footer","attributes":[],"children":[{"kind":"slot","fallback":[],"name":"actions"}]}]},"css":":host {\n position: fixed;\n inset: 0;\n box-sizing: border-box;\n inline-size: min(\n calc(100% - var(--ui-dialog-viewport-gap, var(--ui-space-4)) * 2),\n var(--ui-dialog-max-width, 440px)\n );\n max-inline-size: none;\n max-block-size: calc(100dvh - var(--ui-dialog-viewport-gap, var(--ui-space-4)) * 2);\n margin: auto;\n padding: 0;\n overflow: hidden;\n flex-direction: column;\n background: var(--ui-surface-elevated);\n border: 1px solid var(--ui-border-default);\n border-radius: var(--ui-radius-dialog);\n box-shadow: var(--ui-elevation-dialog, var(--ui-shadow-xl));\n visibility: hidden;\n pointer-events: none;\n opacity: 0;\n transform: scale(0.96);\n transition:\n opacity var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease),\n transform var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease),\n visibility var(--ui-dialog-duration, var(--ui-motion-base)),\n display var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease) allow-discrete,\n overlay var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease) allow-discrete;\n }\n\n :host[open] {\n display: flex;\n visibility: visible;\n pointer-events: auto;\n opacity: 1;\n transform: scale(1);\n animation: ui-dialog-enter var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease);\n }\n\n /* Header and actions stay pinned; only the body scrolls when content is long. */\n header {\n display: flex;\n align-items: center;\n gap: var(--ui-space-3);\n flex: none;\n padding: var(--ui-space-3) var(--ui-space-3) var(--ui-space-3) var(--ui-space-5);\n border-block-end: 1px solid var(--ui-border-default);\n }\n\n /* :host-qualified so page heading rules that reach in cannot outrank the dialog chrome. */\n :host .title {\n flex: 1;\n min-inline-size: 0;\n margin: 0;\n padding: 0;\n border: 0;\n color: var(--ui-text-primary);\n letter-spacing: normal;\n font-size: var(--ui-font-size-lg);\n font-weight: var(--ui-font-semibold);\n line-height: var(--ui-line-height-tight);\n }\n\n .close {\n display: inline-grid;\n place-items: center;\n flex: none;\n margin-inline-start: auto;\n inline-size: var(--ui-control-size-sm);\n block-size: var(--ui-control-size-sm);\n padding: 0;\n border: 0;\n border-radius: var(--ui-radius-round);\n background: transparent;\n color: var(--ui-text-secondary);\n cursor: pointer;\n transition: background-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* A CSS-drawn X. */\n .close::before,\n .close::after {\n content: \"\";\n grid-area: 1 / 1;\n inline-size: 0.875rem;\n block-size: 1.5px;\n border-radius: 1px;\n background: currentColor;\n transform: rotate(45deg);\n }\n\n .close::after {\n transform: rotate(-45deg);\n }\n\n .close:hover {\n background: var(--ui-surface-muted);\n color: var(--ui-text-primary);\n }\n\n .close:focus-visible {\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: 2px;\n }\n\n /* A touch target, like Button on coarse pointers. */\n @media (pointer: coarse) {\n .close {\n inline-size: var(--ui-control-min-block-size);\n block-size: var(--ui-control-min-block-size);\n }\n }\n\n html[data-ui-input-modality=\"touch\"] :host .close {\n inline-size: var(--ui-control-min-block-size);\n block-size: var(--ui-control-min-block-size);\n }\n\n .body {\n flex: 1 1 auto;\n min-block-size: 0;\n overflow: auto;\n overscroll-behavior: contain;\n padding: var(--ui-space-5);\n }\n\n footer {\n display: flex;\n flex: none;\n flex-wrap: wrap;\n justify-content: flex-end;\n gap: var(--ui-space-2);\n padding: var(--ui-space-3) var(--ui-space-5);\n border-block-start: 1px solid var(--ui-border-default);\n }\n\n footer:empty {\n display: none;\n }\n\n @keyframes ui-dialog-enter {\n from {\n opacity: 0;\n transform: scale(0.96);\n }\n }\n\n :host::backdrop {\n background-color: transparent;\n transition:\n background-color var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease),\n display var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease) allow-discrete,\n overlay var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease) allow-discrete;\n }\n\n :host[open]::backdrop {\n background-color: var(--ui-overlay-backdrop);\n animation: ui-dialog-backdrop-enter var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease);\n }\n\n @keyframes ui-dialog-backdrop-enter {\n from {\n background-color: transparent;\n }\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"accessibleLabel","expression":{"source":"'Dialog'","ast":{"kind":"literal","value":"Dialog"},"dependencies":[]}},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true},{"dynamic":false,"required":true,"name":"actions"}],"root":{"kind":"native","element":"dialog","choices":["dialog"]},"controller":"./components/ui-dialog/ui-dialog.js"},{"source":{"file":"./components/ui-disclosure/ui-disclosure.html"},"contract":{"version":1,"name":"UiDisclosure","tag":"ui-disclosure","nativeElement":"div","props":{"density":{"type":{"enum":["comfortable","compact"]},"required":false,"target":{"attribute":"density"},"description":"Compact trades padding and type size for rows that fit more on screen.","default":"comfortable"},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"open token.","default":false},"summary":{"type":"string","required":false,"target":{"attribute":"summary"},"description":"summary token.","default":"Details"}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"trigger"},{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"aria-controls","expression":"contentId","expressionPlan":{"source":"contentId","ast":{"kind":"id","name":"contentId"},"dependencies":["contentId"]}},{"kind":"attribute","name":"aria-expanded","expression":"internalOpen","expressionPlan":{"source":"internalOpen","ast":{"kind":"id","name":"internalOpen"},"dependencies":["internalOpen"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"summary","expressionPlan":{"source":"summary","ast":{"kind":"id","name":"summary"},"dependencies":["summary"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"chevron"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]}],"ref":"trigger"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"panel"},{"kind":"attribute","name":"id","expression":"contentId","expressionPlan":{"source":"contentId","ast":{"kind":"id","name":"contentId"},"dependencies":["contentId"]}},{"kind":"attribute","name":"inert","expression":"not internalOpen","expressionPlan":{"source":"not internalOpen","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"internalOpen"}},"dependencies":["internalOpen"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"panel-inner"}],"children":[{"kind":"slot"}]}]}]},"css":"/* Density resolves into the summary row's own values; the public tokens still override them. */\n :host {\n --_trigger-min-block-size: var(--ui-control-size);\n --_trigger-padding-block: var(--ui-space-2);\n --_trigger-padding-inline: var(--ui-space-3);\n }\n\n :host-state([density=\"compact\"]) {\n --_trigger-min-block-size: var(--ui-control-size-sm);\n --_trigger-padding-block: var(--ui-space-1);\n --_trigger-padding-inline: var(--ui-space-2);\n }\n\n /* An accordion row, not a field: no enclosing box, just a divider, so it never reads as a\n * select or combobox. Stacked disclosures share their dividers. */\n :host {\n display: block;\n inline-size: 100%;\n overflow: clip;\n border-block-end: 1px solid var(--ui-border-default);\n color: var(--ui-text-primary);\n }\n\n .trigger {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n gap: var(--ui-space-3);\n align-items: center;\n inline-size: 100%;\n min-block-size: var(--ui-disclosure-trigger-min-block-size, var(--_trigger-min-block-size));\n padding: var(--ui-disclosure-trigger-padding-block, var(--_trigger-padding-block))\n var(--ui-disclosure-trigger-padding-inline, var(--_trigger-padding-inline));\n border: 0;\n background: transparent;\n color: inherit;\n font: inherit;\n font-weight: var(--ui-font-semibold);\n text-align: start;\n cursor: pointer;\n border-radius: var(--ui-radius-sm);\n transition: background-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .trigger:hover:not(:disabled) {\n background: var(--ui-surface-muted);\n }\n .trigger:focus-visible {\n outline: none;\n box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--ui-focus-ring) 45%, transparent);\n }\n .trigger:disabled {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n\n .chevron {\n inline-size: 0.5rem;\n block-size: 0.5rem;\n border-inline-end: 2px solid currentColor;\n border-block-end: 2px solid currentColor;\n transform: rotate(45deg) translate(-1px, -1px);\n transition: transform var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .panel {\n display: grid;\n grid-template-rows: 0fr;\n transition: grid-template-rows var(--ui-motion-fast) var(--ui-motion-ease-out, var(--ui-motion-ease));\n }\n\n .panel-inner {\n min-block-size: 0;\n overflow: hidden;\n padding-inline: var(--ui-space-3);\n }\n\n :host-state([internalOpen]) .panel {\n grid-template-rows: 1fr;\n }\n :host-state([internalOpen]) .panel-inner {\n padding-block: 0 var(--ui-space-3);\n }\n :host-state([internalOpen]) .chevron {\n transform: rotate(225deg) translate(-1px, -1px);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .panel,\n .chevron {\n transition: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"contentId","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"event","name":"open","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-disclosure/ui-disclosure.js"},{"source":{"file":"./components/ui-editable/ui-editable.html"},"contract":{"version":1,"name":"UiEditable","tag":"ui-editable","nativeElement":"div","props":{"actions":{"type":"boolean","required":false,"target":{"attribute":"actions"},"description":"Show explicit Save and Cancel buttons while editing. Without them, Enter or leaving the field saves and Escape cancels.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"Prevents entering or changing edit mode.","default":false},"edit":{"type":"boolean","required":false,"target":{"attribute":"edit"},"description":"Whether edit mode is active initially or when set externally.","default":false},"hint":{"type":"string","required":false,"target":{"attribute":"hint"},"description":"Optional text shown beside the value to signal it is editable (for example \"Edit\").","default":""},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"Accessible name for the editor.","default":"Edit value"},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"The displayed and initial editable value.","default":""}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"field"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"preview"},{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"text"},{"kind":"directive","name":"value","expression":"internalValue","expressionPlan":{"source":"internalValue","ast":{"kind":"id","name":"internalValue"},"dependencies":["internalValue"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"hint"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"directive","name":"value","expression":"hint","expressionPlan":{"source":"hint","ast":{"kind":"id","name":"hint"},"dependencies":["hint"]}}],"children":[],"flow":{"kind":"if","test":"hint","testPlan":{"source":"hint","ast":{"kind":"id","name":"hint"},"dependencies":["hint"]}}}],"ref":"preview"},{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"class","value":"input"},{"kind":"literal","name":"type","value":"text"},{"kind":"property","key":"value","name":"value","expression":"draft","expressionPlan":{"source":"draft","ast":{"kind":"id","name":"draft"},"dependencies":["draft"]}},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}},{"kind":"attribute","name":"disabled","expression":"disabled or not internalEdit","expressionPlan":{"source":"disabled or not internalEdit","ast":{"kind":"binary","op":"or","left":{"kind":"id","name":"disabled"},"right":{"kind":"unary","op":"not","operand":{"kind":"id","name":"internalEdit"}}},"dependencies":["disabled","internalEdit"]}}],"children":[],"ref":"input"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"actions"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"save"},{"kind":"literal","name":"type","value":"button"}],"children":[{"kind":"text","value":"Save"}]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"cancel"},{"kind":"literal","name":"type","value":"button"}],"children":[{"kind":"text","value":"Cancel"}]}],"flow":{"kind":"if","test":"actions","testPlan":{"source":"actions","ast":{"kind":"id","name":"actions"},"dependencies":["actions"]}}}]},"css":":host {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: var(--ui-space-2);\n min-inline-size: 0;\n color: var(--ui-text-primary);\n }\n\n /* The value and the input share one grid cell with identical box metrics, so switching between\n * display and edit never changes the control's size or moves the text. */\n .field {\n display: inline-grid;\n min-inline-size: 8rem;\n max-inline-size: 100%;\n }\n\n .preview,\n .input {\n grid-area: 1 / 1;\n box-sizing: border-box;\n min-block-size: var(--ui-control-size-sm);\n margin: 0;\n padding: var(--ui-space-1) var(--ui-space-2);\n border: 1px solid transparent;\n border-radius: var(--ui-radius-md);\n font: inherit;\n line-height: var(--ui-line-height-md);\n color: inherit;\n transition:\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .preview {\n display: inline-flex;\n gap: var(--ui-space-2);\n align-items: center;\n background: transparent;\n text-align: start;\n cursor: pointer;\n }\n\n .preview:hover:not(:disabled) {\n background: var(--ui-surface-muted);\n }\n\n .preview:focus-visible {\n outline: none;\n box-shadow: var(--ui-focus-halo);\n }\n\n .hint {\n color: var(--ui-text-secondary);\n font-size: var(--ui-font-size-sm);\n }\n\n /* Contained so it takes the value's width instead of its own default input width. */\n .input {\n contain: inline-size;\n inline-size: 100%;\n min-inline-size: 0;\n visibility: hidden;\n background: var(--ui-control-surface, var(--ui-surface-elevated));\n }\n\n .input:focus {\n outline: none;\n border-color: var(--ui-control-focus, var(--ui-accent-solid));\n box-shadow:\n var(--ui-control-inset),\n var(--ui-control-focus-halo-shadow);\n }\n\n .input::selection {\n background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);\n }\n\n :host-state([internalEdit]) .preview {\n visibility: hidden;\n }\n :host-state([internalEdit]) .input {\n visibility: visible;\n }\n\n .actions {\n display: none;\n gap: var(--ui-space-1);\n }\n :host-state([internalEdit]) .actions {\n display: inline-flex;\n }\n\n .actions button {\n min-block-size: var(--ui-control-size-sm);\n padding: 0 var(--ui-space-3);\n border: 1px solid var(--ui-border-strong);\n border-radius: var(--ui-radius-md);\n background: var(--ui-surface-elevated);\n background-image: var(--ui-raised-highlight);\n box-shadow: var(--ui-raised);\n color: inherit;\n font: inherit;\n font-size: var(--ui-font-size-sm);\n cursor: pointer;\n }\n\n .actions .save {\n border-color: var(--ui-accent-solid);\n background: var(--ui-accent-solid);\n color: var(--ui-text-on-accent);\n }\n\n .actions button:focus-visible {\n outline: none;\n box-shadow: var(--ui-focus-halo);\n }\n\n :host-state([disabled]) .preview {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalEdit","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"internalValue","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"draft","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"event","name":"input","type":"object({ value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"change","type":"object({ value: string, previousValue: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"edit-change","type":"object({ edit: boolean, reason: activate | commit | cancel | light-dismiss | escape | programmatic, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editable/ui-editable.js"},{"source":{"file":"./components/ui-editor-insert-table-grid/ui-editor-insert-table-grid.html"},"contract":{"version":1,"name":"UiEditorInsertTableGrid","tag":"ui-editor-insert-table-grid","nativeElement":"div","props":{"headerRow":{"type":"boolean","required":false,"target":{"attribute":"headerrow"},"description":"Whether table insertion initially includes a header row.","default":false},"maxCols":{"type":{"kind":"terminal","name":"integer"},"required":false,"target":{"attribute":"maxcols"},"description":"The most columns the grid offers (at most 10).","default":8},"maxRows":{"type":{"kind":"terminal","name":"integer"},"required":false,"target":{"attribute":"maxrows"},"description":"The most rows the grid offers (at most 10).","default":8},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the grid is shown.","default":false}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"p","attributes":[{"kind":"literal","name":"class","value":"hint"},{"kind":"directive","name":"value","expression":"hint","expressionPlan":{"source":"hint","ast":{"kind":"id","name":"hint"},"dependencies":["hint"]}}],"children":[]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"grid"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Table dimensions"},{"kind":"attribute","name":"--_rows","expression":"rows","expressionPlan":{"source":"rows","ast":{"kind":"id","name":"rows"},"dependencies":["rows"]},"target":"style"},{"kind":"attribute","name":"--_cols","expression":"cols","expressionPlan":{"source":"cols","ast":{"kind":"id","name":"cols"},"dependencies":["cols"]},"target":"style"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"cell"},{"kind":"attribute","name":"selected","expression":"cell.selected","expressionPlan":{"source":"cell.selected","ast":{"kind":"member","object":{"kind":"id","name":"cell"},"key":"selected"},"dependencies":["cell.selected"]},"target":"class"},{"kind":"attribute","name":"data-row","expression":"cell.row","expressionPlan":{"source":"cell.row","ast":{"kind":"member","object":{"kind":"id","name":"cell"},"key":"row"},"dependencies":["cell.row"]}},{"kind":"attribute","name":"data-col","expression":"cell.col","expressionPlan":{"source":"cell.col","ast":{"kind":"member","object":{"kind":"id","name":"cell"},"key":"col"},"dependencies":["cell.col"]}},{"kind":"attribute","name":"aria-label","expression":"cell.label","expressionPlan":{"source":"cell.label","ast":{"kind":"member","object":{"kind":"id","name":"cell"},"key":"label"},"dependencies":["cell.label"]}},{"kind":"attribute","name":"aria-pressed","expression":"cell.selected","expressionPlan":{"source":"cell.selected","ast":{"kind":"member","object":{"kind":"id","name":"cell"},"key":"selected"},"dependencies":["cell.selected"]}}],"children":[],"flow":{"kind":"each","item":"cell","list":"cells","listPlan":{"source":"cells","ast":{"kind":"id","name":"cells"},"dependencies":["cells"]},"key":"cell.key","keyPlan":{"source":"cell.key","ast":{"kind":"member","object":{"kind":"id","name":"cell"},"key":"key"},"dependencies":["cell.key"]}}}]},{"kind":"element","name":"label","attributes":[{"kind":"literal","name":"class","value":"header"}],"children":[{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"checkbox"},{"kind":"property","key":"checked","name":"checked","expression":"withHeaderRow","expressionPlan":{"source":"withHeaderRow","ast":{"kind":"id","name":"withHeaderRow"},"dependencies":["withHeaderRow"]}}],"children":[],"ref":"header"},{"kind":"text","value":" Header row"}]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"insert"}],"children":[{"kind":"text","value":"Insert table"}],"ref":"insert"}]},"css":":host {\n padding: var(--ui-space-3);\n background: var(--ui-surface);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-md);\n box-shadow: var(--ui-shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));\n }\n\n .hint {\n margin: 0 0 var(--ui-space-2);\n font-size: var(--ui-font-size-sm);\n color: var(--ui-text-muted);\n }\n\n .grid {\n display: grid;\n grid-template-columns: repeat(var(--_cols, 8), 1.25rem);\n grid-template-rows: repeat(var(--_rows, 8), 1.25rem);\n gap: 2px;\n margin-bottom: var(--ui-space-2);\n }\n\n .cell {\n width: 1.25rem;\n height: 1.25rem;\n padding: 0;\n border: 1px solid var(--ui-border);\n border-radius: 2px;\n background: var(--ui-surface);\n cursor: pointer;\n }\n\n .cell.selected {\n background: var(--ui-accent-solid, var(--ui-accent));\n border-color: var(--ui-accent-solid, var(--ui-accent));\n }\n\n .header {\n display: block;\n margin-bottom: var(--ui-space-2);\n font-size: var(--ui-font-size-sm);\n cursor: pointer;\n }\n\n :host .insert {\n width: 100%;\n padding: var(--ui-space-2) var(--ui-space-3);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-sm);\n background: var(--ui-accent-solid, var(--ui-accent));\n color: var(--ui-accent-contrast);\n font-size: var(--ui-font-size-sm);\n cursor: pointer;\n }\n\n :host .insert:hover {\n filter: brightness(1.05);\n }\n\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"cells","type":"list(object({ key: string, row: integer, col: integer, label: string, selected: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"rows","expression":{"source":"8","ast":{"kind":"literal","value":8},"dependencies":[]}},{"kind":"state","name":"cols","expression":{"source":"8","ast":{"kind":"literal","value":8},"dependencies":[]}},{"kind":"state","name":"hint","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"withHeaderRow","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"insert","type":"object({ rows: integer, cols: integer, withHeaderRow: boolean })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editor-insert-table-grid/ui-editor-insert-table-grid.js"},{"source":{"file":"./components/ui-editor-mention-menu/ui-editor-mention-menu.html"},"contract":{"version":1,"name":"UiEditorMentionMenu","tag":"ui-editor-mention-menu","nativeElement":"div","props":{"anchorRect":{"type":{"kind":"union","members":[{"kind":"object","fields":[{"name":"left","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"top","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"right","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"bottom","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"x","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"y","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"width","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"height","type":{"kind":"terminal","name":"number"},"optional":true}],"open":false},{"kind":"terminal","name":"null"}]},"required":false,"target":{"attribute":"anchorrect"},"description":"Where the @ was typed, in viewport coordinates."},"items":{"type":{"kind":"list","item":{"kind":"object","fields":[{"name":"id","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"label","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"detail","type":{"kind":"terminal","name":"string"},"optional":true},{"name":"initials","type":{"kind":"terminal","name":"string"},"optional":true}],"open":false}},"required":false,"target":{"attribute":"items"},"description":"The people the menu offers."},"loading":{"type":"boolean","required":false,"target":{"attribute":"aria-busy"},"description":"Whether a search is in progress.","default":false},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the menu is open.","default":false},"query":{"type":"string","required":false,"target":{"attribute":"query"},"description":"The text typed after the @.","default":""},"selectedIndex":{"type":{"kind":"terminal","name":"integer"},"required":false,"target":{"attribute":"selectedindex"},"description":"The highlighted person.","default":0}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"listbox"},{"kind":"literal","name":"aria-label","value":"Mention a person"},{"kind":"attribute","name":"aria-busy","expression":"loading","expressionPlan":{"source":"loading","ast":{"kind":"id","name":"loading"},"dependencies":["loading"]}},{"kind":"attribute","name":"hidden","expression":"not visible","expressionPlan":{"source":"not visible","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"visible"}},"dependencies":["visible"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"header"}],"children":[{"kind":"element","name":"span","attributes":[],"children":[{"kind":"text","value":"People"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"hint"}],"children":[{"kind":"text","value":"Type after @ to search"}]}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"loading"},{"kind":"literal","name":"role","value":"status"}],"children":[{"kind":"text","value":"Searching…"}],"flow":{"kind":"if","test":"searching","testPlan":{"source":"searching","ast":{"kind":"id","name":"searching"},"dependencies":["searching"]}}},{"kind":"element","name":"ul","attributes":[{"kind":"literal","name":"class","value":"list"},{"kind":"literal","name":"role","value":"presentation"}],"children":[{"kind":"element","name":"li","attributes":[{"kind":"attribute","name":"id","expression":"format('%s-option-%s', prefix, index)","expressionPlan":{"source":"format('%s-option-%s', prefix, index)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s"},{"kind":"id","name":"prefix"},{"kind":"id","name":"index"}]},"dependencies":["index","prefix"]}},{"kind":"literal","name":"class","value":"item"},{"kind":"attribute","name":"active","expression":"index = active","expressionPlan":{"source":"index = active","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"index"},"right":{"kind":"id","name":"active"}},"dependencies":["active","index"]},"target":"class"},{"kind":"literal","name":"role","value":"option"},{"kind":"attribute","name":"aria-selected","expression":"index = active","expressionPlan":{"source":"index = active","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"index"},"right":{"kind":"id","name":"active"}},"dependencies":["active","index"]}},{"kind":"attribute","name":"data-index","expression":"index","expressionPlan":{"source":"index","ast":{"kind":"id","name":"index"},"dependencies":["index"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"avatar"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"directive","name":"value","expression":"row.initials","expressionPlan":{"source":"row.initials","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"initials"},"dependencies":["row.initials"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"body"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"label"},{"kind":"directive","name":"value","expression":"row.label","expressionPlan":{"source":"row.label","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"label"},"dependencies":["row.label"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"detail"},{"kind":"directive","name":"value","expression":"row.detail","expressionPlan":{"source":"row.detail","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"detail"},"dependencies":["row.detail"]}}],"children":[],"flow":{"kind":"if","test":"row.detail","testPlan":{"source":"row.detail","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"detail"},"dependencies":["row.detail"]}}}]}],"flow":{"kind":"each","item":"row","list":"rows","listPlan":{"source":"rows","ast":{"kind":"id","name":"rows"},"dependencies":["rows"]},"index":"index"}}],"flow":{"kind":"if","test":"not searching","testPlan":{"source":"not searching","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"searching"}},"dependencies":["searching"]}}}]},"css":":host {\n user-select: none;\n }\n\n :host {\n display: flex;\n overflow: hidden;\n flex-direction: column;\n background: var(--ui-surface);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-dialog);\n box-shadow: var(--ui-shadow-lg, 0 8px 24px rgb(0 0 0 / 0.12));\n }\n\n .header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--ui-space-3);\n padding: var(--ui-space-2) var(--ui-space-3);\n color: var(--ui-text-secondary);\n border-bottom: 1px solid var(--ui-border);\n font-size: var(--ui-font-size-xs);\n font-weight: var(--ui-font-semibold);\n }\n\n .hint {\n overflow: hidden;\n color: var(--ui-text-muted);\n font-weight: var(--ui-font-normal);\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .list {\n max-height: 280px;\n padding: var(--ui-space-1) 0;\n margin: 0;\n overflow-y: auto;\n overscroll-behavior: contain;\n list-style: none;\n }\n\n .item {\n display: flex;\n align-items: center;\n min-height: 44px;\n padding: var(--ui-space-2) var(--ui-space-3);\n gap: var(--ui-space-3);\n cursor: pointer;\n }\n\n .item.active {\n background: var(--ui-accent-subtle, rgb(59 130 246 / 0.1));\n }\n\n .avatar {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n flex: 0 0 auto;\n color: var(--ui-accent-active, var(--ui-accent-solid));\n background: var(--ui-accent-soft, var(--ui-accent-subtle));\n border-radius: 999px;\n font-size: var(--ui-font-size-xs);\n font-weight: var(--ui-font-semibold);\n }\n\n .body {\n display: flex;\n min-width: 0;\n flex-direction: column;\n }\n\n .label,\n .detail {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .label {\n color: var(--ui-text-primary);\n font-size: var(--ui-font-size-sm);\n font-weight: var(--ui-font-medium);\n }\n\n .detail,\n .loading {\n color: var(--ui-text-muted);\n font-size: var(--ui-font-size-xs);\n }\n\n .loading {\n min-height: 44px;\n padding: var(--ui-space-3);\n }\n\n @media (max-width: 767px) {\n :host {\n border-bottom: 0;\n border-radius: var(--ui-radius-dialog) var(--ui-radius-dialog) 0 0;\n }\n\n .list {\n max-height: calc(60dvh - 48px);\n }\n }\n\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"visible","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"rows","type":"list(object({ id: string, label: string, detail?: string, initials: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"searching","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"active","expression":{"source":"0","ast":{"kind":"literal","value":0},"dependencies":[]}},{"kind":"state","name":"prefix","expression":{"source":"'ui-editor-mention-menu'","ast":{"kind":"literal","value":"ui-editor-mention-menu"},"dependencies":[]}},{"kind":"event","name":"highlight","type":"object({ index: integer })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"select","type":"object({ index: integer })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editor-mention-menu/ui-editor-mention-menu.js"},{"source":{"file":"./components/ui-editor-slash-menu/ui-editor-slash-menu.html"},"contract":{"version":1,"name":"UiEditorSlashMenu","tag":"ui-editor-slash-menu","nativeElement":"div","props":{"anchorRect":{"type":{"kind":"union","members":[{"kind":"object","fields":[{"name":"left","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"top","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"right","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"bottom","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"x","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"y","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"width","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"height","type":{"kind":"terminal","name":"number"},"optional":true}],"open":false},{"kind":"terminal","name":"null"}]},"required":false,"target":{"attribute":"anchorrect"},"description":"Where the slash was typed, in viewport coordinates."},"items":{"type":{"kind":"list","item":{"kind":"object","fields":[{"name":"title","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"description","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"icon","type":{"kind":"terminal","name":"string"},"optional":false}],"open":false}},"required":false,"target":{"attribute":"items"},"description":"The blocks the menu offers."},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the menu is open.","default":false},"query":{"type":"string","required":false,"target":{"attribute":"query"},"description":"The text typed after the slash.","default":""},"selectedIndex":{"type":{"kind":"terminal","name":"integer"},"required":false,"target":{"attribute":"selectedindex"},"description":"The highlighted item.","default":0}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"listbox"},{"kind":"literal","name":"aria-label","value":"Insert block"},{"kind":"attribute","name":"hidden","expression":"not visible","expressionPlan":{"source":"not visible","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"visible"}},"dependencies":["visible"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"header"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"header-label"}],"children":[{"kind":"text","value":"Insert"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"header-query"},{"kind":"directive","name":"value","expression":"query","expressionPlan":{"source":"query","ast":{"kind":"id","name":"query"},"dependencies":["query"]}}],"children":[],"flow":{"kind":"if","test":"query","testPlan":{"source":"query","ast":{"kind":"id","name":"query"},"dependencies":["query"]}}}]},{"kind":"element","name":"ul","attributes":[{"kind":"literal","name":"class","value":"list"},{"kind":"literal","name":"role","value":"presentation"}],"children":[{"kind":"element","name":"li","attributes":[{"kind":"literal","name":"class","value":"item"},{"kind":"attribute","name":"active","expression":"index = active","expressionPlan":{"source":"index = active","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"index"},"right":{"kind":"id","name":"active"}},"dependencies":["active","index"]},"target":"class"},{"kind":"literal","name":"role","value":"option"},{"kind":"attribute","name":"aria-selected","expression":"index = active","expressionPlan":{"source":"index = active","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"index"},"right":{"kind":"id","name":"active"}},"dependencies":["active","index"]}},{"kind":"attribute","name":"data-index","expression":"index","expressionPlan":{"source":"index","ast":{"kind":"id","name":"index"},"dependencies":["index"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"icon"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"body"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"title"},{"kind":"directive","name":"value","expression":"item.title","expressionPlan":{"source":"item.title","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"title"},"dependencies":["item.title"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"description"},{"kind":"directive","name":"value","expression":"item.description","expressionPlan":{"source":"item.description","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"description"},"dependencies":["item.description"]}}],"children":[]}]}],"flow":{"kind":"each","item":"item","list":"items","listPlan":{"source":"items","ast":{"kind":"id","name":"items"},"dependencies":["items"]},"index":"index"}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"footer"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"kbd","attributes":[],"children":[{"kind":"text","value":"↑↓"}]},{"kind":"text","value":" navigate · "},{"kind":"element","name":"kbd","attributes":[],"children":[{"kind":"text","value":"↵"}]},{"kind":"text","value":" insert · "},{"kind":"element","name":"kbd","attributes":[],"children":[{"kind":"text","value":"Esc"}]},{"kind":"text","value":" close\n "}]}]},"css":":host {\n user-select: none;\n }\n\n :host {\n background: var(--ui-surface);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-dialog);\n box-shadow: var(--ui-shadow-lg, 0 8px 24px rgb(0 0 0 / 0.12));\n overflow: hidden;\n display: flex;\n flex-direction: column;\n }\n\n @media (max-width: 767px) {\n :host {\n border-radius: var(--ui-radius-dialog) var(--ui-radius-dialog) 0 0;\n border-bottom: none;\n }\n }\n\n .header {\n display: none;\n align-items: center;\n gap: var(--ui-space-2);\n padding: var(--ui-space-3) var(--ui-space-4);\n border-bottom: 1px solid var(--ui-border);\n font-size: var(--ui-font-size-xs);\n color: var(--ui-text-muted);\n font-weight: var(--ui-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.05em;\n }\n\n @media (max-width: 767px) {\n .header {\n display: flex;\n }\n }\n\n .header-query {\n background: var(--ui-surface-hover);\n border-radius: var(--ui-radius-sm);\n padding: 0.1em 0.4em;\n font-family: var(--ui-font-family-mono, ui-monospace, monospace);\n font-size: var(--ui-font-size-xs);\n color: var(--ui-accent);\n text-transform: none;\n letter-spacing: 0;\n }\n\n .list {\n list-style: none;\n margin: 0;\n padding: var(--ui-space-1) 0;\n overflow-y: auto;\n max-height: 280px;\n overscroll-behavior: contain;\n }\n\n @media (max-width: 767px) {\n .list {\n max-height: calc(60dvh - 80px);\n padding: var(--ui-space-1) 0 var(--ui-space-2);\n }\n }\n\n .item {\n display: flex;\n align-items: center;\n gap: var(--ui-space-3);\n padding: var(--ui-space-2) var(--ui-space-3);\n min-height: 44px;\n cursor: pointer;\n transition: background-color 120ms ease;\n }\n\n .item.active {\n background: var(--ui-accent-subtle, rgb(59 130 246 / 0.1));\n }\n\n .icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n background: var(--ui-surface-hover);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-md);\n font-size: var(--ui-font-size-sm);\n font-weight: var(--ui-font-bold);\n color: var(--ui-text-secondary);\n font-family: var(--ui-font-family-mono, ui-monospace, monospace);\n flex-shrink: 0;\n line-height: 1;\n }\n\n .item.active .icon {\n background: var(--ui-accent);\n border-color: var(--ui-accent);\n color: var(--ui-accent-contrast);\n }\n\n .icon {\n --ui-icon-size: 1rem;\n --ui-icon-stroke-width: var(--ui-editor-toolbar-icon-stroke-width, 1.75);\n }\n\n .body {\n display: flex;\n min-width: 0;\n flex-direction: column;\n gap: 1px;\n }\n\n .title {\n font-size: var(--ui-font-size-sm);\n font-weight: var(--ui-font-medium);\n color: var(--ui-text);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .description {\n font-size: var(--ui-font-size-xs);\n color: var(--ui-text-muted);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .footer {\n display: none;\n padding: var(--ui-space-2) var(--ui-space-3);\n border-top: 1px solid var(--ui-border);\n font-size: var(--ui-font-size-xs);\n color: var(--ui-text-muted);\n }\n\n @media (min-width: 768px) {\n .footer {\n display: block;\n }\n }\n\n :host kbd {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-family: var(--ui-font-family-mono, ui-monospace, monospace);\n font-size: 10px;\n background: var(--ui-surface-hover);\n border: 1px solid var(--ui-border);\n border-radius: 3px;\n padding: 0 3px;\n color: var(--ui-text-secondary);\n }\n\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"visible","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"active","expression":{"source":"0","ast":{"kind":"literal","value":0},"dependencies":[]}},{"kind":"event","name":"highlight","type":"object({ index: integer })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"select","type":"object({ index: integer })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editor-slash-menu/ui-editor-slash-menu.js"},{"source":{"file":"./components/ui-editor-table-context-menu/ui-editor-table-context-menu.html"},"contract":{"version":1,"name":"UiEditorTableContextMenu","tag":"ui-editor-table-context-menu","nativeElement":"div","props":{"actions":{"type":{"kind":"list","item":{"kind":"union","members":[{"kind":"keyword","value":"align-left"},{"kind":"keyword","value":"align-center"},{"kind":"keyword","value":"align-right"},{"kind":"keyword","value":"background-none"},{"kind":"keyword","value":"background-gray"},{"kind":"keyword","value":"background-yellow"},{"kind":"keyword","value":"background-blue"},{"kind":"keyword","value":"background-green"},{"kind":"keyword","value":"background-red"},{"kind":"keyword","value":"add-row-before"},{"kind":"keyword","value":"add-row-after"},{"kind":"keyword","value":"add-column-before"},{"kind":"keyword","value":"add-column-after"},{"kind":"keyword","value":"clear-cells"},{"kind":"keyword","value":"merge-cells"},{"kind":"keyword","value":"split-cell"},{"kind":"keyword","value":"delete-row"},{"kind":"keyword","value":"delete-column"},{"kind":"keyword","value":"delete-table"}]}},"required":false,"target":{"attribute":"actions"},"description":"The complete set of commands the current selection permits."},"cellBackground":{"type":"string","required":false,"target":{"attribute":"cellbackground"},"description":"Identifies the background choice that is active for the current cell.","default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Shows the menu at the position owned by the editor integration.","default":false}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"menu"},{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"section"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"heading"},{"kind":"literal","name":"role","value":"presentation"}],"children":[{"kind":"text","value":"Cell background"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"swatches"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Cell background"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"swatch-button"},{"kind":"attribute","name":"selected","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]},"target":"class"},{"kind":"literal","name":"role","value":"menuitemradio"},{"kind":"attribute","name":"aria-checked","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]}},{"kind":"attribute","name":"data-action","expression":"swatch.action","expressionPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"swatch"},{"kind":"attribute","name":"default","expression":"not swatch.color","expressionPlan":{"source":"not swatch.color","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"}},"dependencies":["swatch.color"]},"target":"class"},{"kind":"attribute","name":"--_swatch","expression":"swatch.color","expressionPlan":{"source":"swatch.color","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"},"dependencies":["swatch.color"]},"target":"style"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"swatch-label"},{"kind":"directive","name":"value","expression":"swatch.label","expressionPlan":{"source":"swatch.label","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"label"},"dependencies":["swatch.label"]}}],"children":[]}],"flow":{"kind":"each","item":"swatch","list":"swatches","listPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]},"key":"swatch.action","keyPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}}]}],"flow":{"kind":"if","test":"swatches","testPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]}}},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sep"}],"children":[]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"section"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"heading"},{"kind":"literal","name":"role","value":"presentation"},{"kind":"directive","name":"value","expression":"section.heading","expressionPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"role","value":"menuitem"},{"kind":"attribute","name":"danger","expression":"item.danger","expressionPlan":{"source":"item.danger","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"danger"},"dependencies":["item.danger"]},"target":"class"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"section.items","listPlan":{"source":"section.items","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"items"},"dependencies":["section.items"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}]}],"flow":{"kind":"each","item":"section","list":"sections","listPlan":{"source":"sections","ast":{"kind":"id","name":"sections"},"dependencies":["sections"]},"key":"section.heading","keyPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}}]},"css":":host {\n min-width: 14rem;\n max-width: min(17rem, calc(100vw - 24px));\n max-height: min(28rem, calc(100vh - 24px));\n padding: var(--ui-space-2);\n background: var(--ui-surface);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-lg);\n box-shadow: var(--ui-shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));\n display: flex;\n flex-direction: column;\n gap: 2px;\n overflow-y: auto;\n overscroll-behavior: contain;\n scrollbar-width: thin;\n }\n\n .section {\n display: flex;\n flex-direction: column;\n gap: 3px;\n }\n\n :host button {\n display: flex;\n align-items: center;\n gap: var(--ui-space-2);\n width: 100%;\n text-align: left;\n min-height: 32px;\n padding: var(--ui-space-2) var(--ui-space-2);\n border: none;\n border-radius: var(--ui-radius-sm);\n background: none;\n font-size: var(--ui-font-size-sm);\n cursor: pointer;\n color: var(--ui-text);\n }\n\n :host button {\n --ui-icon-size: 1rem;\n --ui-icon-stroke-width: var(--ui-editor-toolbar-icon-stroke-width, 1.75);\n }\n\n :host button:hover:not(:disabled) {\n background: var(--ui-surface-hover);\n }\n\n :host button.selected {\n background: var(--ui-accent-subtle, rgb(59 130 246 / 0.1));\n }\n\n :host button.danger {\n color: var(--ui-danger);\n }\n\n .swatches {\n display: grid;\n grid-template-columns: repeat(3, minmax(0, 1fr));\n gap: 3px;\n }\n\n .swatch-button {\n display: inline-flex;\n align-items: center;\n gap: var(--ui-space-2);\n }\n\n .swatch {\n display: inline-flex;\n width: 1rem;\n height: 1rem;\n border-radius: 999px;\n border: 1px solid var(--ui-border);\n background: var(--_swatch, #fff);\n box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.35);\n flex-shrink: 0;\n }\n\n .swatch.default {\n position: relative;\n background:\n linear-gradient(\n 135deg,\n transparent calc(50% - 1px),\n var(--ui-text-muted) calc(50% - 1px),\n var(--ui-text-muted) calc(50% + 1px),\n transparent calc(50% + 1px)\n ),\n var(--ui-surface);\n }\n\n .swatch-label {\n min-width: 0;\n white-space: nowrap;\n }\n\n .heading {\n padding: var(--ui-space-1) var(--ui-space-2);\n font-size: 0.6875rem;\n font-weight: 700;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--ui-text-muted);\n }\n\n .sep {\n height: 1px;\n background: var(--ui-border);\n margin: var(--ui-space-1) 0;\n }\n\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"swatches","type":"list(object({ action: string, label: string, color: string, selected: boolean })) | null","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"sections","type":"list(object({ heading: string, items: list(object({ action: string, label: string, icon: string, danger: boolean })) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"event","name":"action","type":"object({ action: align-left | align-center | align-right | background-none | background-gray | background-yellow | background-blue | background-green | background-red | add-row-before | add-row-after | add-column-before | add-column-after | clear-cells | merge-cells | split-cell | delete-row | delete-column | delete-table })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editor-table-context-menu/ui-editor-table-context-menu.js"},{"source":{"file":"./components/ui-editor-table-overlay/ui-editor-table-overlay.html"},"contract":{"version":1,"name":"UiEditorTableOverlay","tag":"ui-editor-table-overlay","nativeElement":"div","props":{"geometry":{"type":{"kind":"union","members":[{"kind":"object","fields":[{"name":"rowBoundaries","type":{"kind":"list","item":{"kind":"terminal","name":"number"}},"optional":false},{"name":"columnBoundaries","type":{"kind":"list","item":{"kind":"terminal","name":"number"}},"optional":false},{"name":"activeCell","type":{"kind":"union","members":[{"kind":"object","fields":[{"name":"left","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"top","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"width","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"height","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"rowIndex","type":{"kind":"terminal","name":"integer"},"optional":false},{"name":"columnIndex","type":{"kind":"terminal","name":"integer"},"optional":false}],"open":false},{"kind":"terminal","name":"null"}]},"optional":false},{"name":"hoveredCell","type":{"kind":"union","members":[{"kind":"object","fields":[{"name":"left","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"top","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"width","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"height","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"rowIndex","type":{"kind":"terminal","name":"integer"},"optional":false},{"name":"columnIndex","type":{"kind":"terminal","name":"integer"},"optional":false}],"open":false},{"kind":"terminal","name":"null"}]},"optional":true}],"open":false},{"kind":"terminal","name":"null"}]},"required":false,"target":{"attribute":"geometry"},"description":"The authoritative editor-measured table boundaries and active or hovered cell rectangles."},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Shows the controls after the editor has supplied current geometry.","default":false}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"aria-label","value":"Table controls"},{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"rows"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"control row"},{"kind":"attribute","name":"active","expression":"control.key = activeKey","expressionPlan":{"source":"control.key = activeKey","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"right":{"kind":"id","name":"activeKey"}},"dependencies":["activeKey","control.key"]},"target":"class"},{"kind":"attribute","name":"top","expression":"control.offset","expressionPlan":{"source":"control.offset","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"offset"},"dependencies":["control.offset"]},"target":"style"},{"kind":"attribute","name":"data-control-key","expression":"control.key","expressionPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"line"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"guide"},{"kind":"literal","name":"data-ui-guide","value":""},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"handle"},{"kind":"attribute","name":"data-ui-affordance","expression":"control.affordance","expressionPlan":{"source":"control.affordance","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"affordance"},"dependencies":["control.affordance"]}},{"kind":"attribute","name":"data-action","expression":"control.action","expressionPlan":{"source":"control.action","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"action"},"dependencies":["control.action"]}},{"kind":"attribute","name":"data-boundary-index","expression":"control.index","expressionPlan":{"source":"control.index","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"index"},"dependencies":["control.index"]}},{"kind":"attribute","name":"aria-label","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"plus"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"tooltip"},{"kind":"literal","name":"role","value":"tooltip"},{"kind":"directive","name":"value","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[]}]}],"flow":{"kind":"each","item":"control","list":"rows","listPlan":{"source":"rows","ast":{"kind":"id","name":"rows"},"dependencies":["rows"]},"key":"control.key","keyPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"cols"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"control col"},{"kind":"attribute","name":"active","expression":"control.key = activeKey","expressionPlan":{"source":"control.key = activeKey","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"right":{"kind":"id","name":"activeKey"}},"dependencies":["activeKey","control.key"]},"target":"class"},{"kind":"attribute","name":"left","expression":"control.offset","expressionPlan":{"source":"control.offset","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"offset"},"dependencies":["control.offset"]},"target":"style"},{"kind":"attribute","name":"data-control-key","expression":"control.key","expressionPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"line"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"guide"},{"kind":"literal","name":"data-ui-guide","value":""},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"handle"},{"kind":"attribute","name":"data-ui-affordance","expression":"control.affordance","expressionPlan":{"source":"control.affordance","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"affordance"},"dependencies":["control.affordance"]}},{"kind":"attribute","name":"data-action","expression":"control.action","expressionPlan":{"source":"control.action","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"action"},"dependencies":["control.action"]}},{"kind":"attribute","name":"data-boundary-index","expression":"control.index","expressionPlan":{"source":"control.index","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"index"},"dependencies":["control.index"]}},{"kind":"attribute","name":"aria-label","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"plus"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"tooltip"},{"kind":"literal","name":"role","value":"tooltip"},{"kind":"directive","name":"value","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[]}]}],"flow":{"kind":"each","item":"control","list":"cols","listPlan":{"source":"cols","ast":{"kind":"id","name":"cols"},"dependencies":["cols"]},"key":"control.key","keyPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}}]},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"selector row"},{"kind":"attribute","name":"top","expression":"hovered.rowOffset","expressionPlan":{"source":"hovered.rowOffset","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"rowOffset"},"dependencies":["hovered.rowOffset"]},"target":"style"},{"kind":"literal","name":"data-action","value":"select-row"},{"kind":"attribute","name":"data-row-index","expression":"hovered.rowIndex","expressionPlan":{"source":"hovered.rowIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"rowIndex"},"dependencies":["hovered.rowIndex"]}},{"kind":"attribute","name":"data-column-index","expression":"hovered.columnIndex","expressionPlan":{"source":"hovered.columnIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"columnIndex"},"dependencies":["hovered.columnIndex"]}},{"kind":"literal","name":"title","value":"Select row"},{"kind":"literal","name":"aria-label","value":"Select row"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"glyph"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"grip-vertical"}],"children":[]}]}]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"selector column"},{"kind":"attribute","name":"left","expression":"hovered.columnOffset","expressionPlan":{"source":"hovered.columnOffset","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"columnOffset"},"dependencies":["hovered.columnOffset"]},"target":"style"},{"kind":"literal","name":"data-action","value":"select-column"},{"kind":"attribute","name":"data-row-index","expression":"hovered.rowIndex","expressionPlan":{"source":"hovered.rowIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"rowIndex"},"dependencies":["hovered.rowIndex"]}},{"kind":"attribute","name":"data-column-index","expression":"hovered.columnIndex","expressionPlan":{"source":"hovered.columnIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"columnIndex"},"dependencies":["hovered.columnIndex"]}},{"kind":"literal","name":"title","value":"Select column"},{"kind":"literal","name":"aria-label","value":"Select column"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"glyph"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"grip-horizontal"}],"children":[]}]}]}],"flow":{"kind":"if","test":"hovered","testPlan":{"source":"hovered","ast":{"kind":"id","name":"hovered"},"dependencies":["hovered"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"cell-menu"},{"kind":"attribute","name":"left","expression":"active.menuLeft","expressionPlan":{"source":"active.menuLeft","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"menuLeft"},"dependencies":["active.menuLeft"]},"target":"style"},{"kind":"attribute","name":"top","expression":"active.menuTop","expressionPlan":{"source":"active.menuTop","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"menuTop"},"dependencies":["active.menuTop"]},"target":"style"},{"kind":"literal","name":"data-action","value":"open-cell-menu"},{"kind":"attribute","name":"data-row-index","expression":"active.rowIndex","expressionPlan":{"source":"active.rowIndex","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"rowIndex"},"dependencies":["active.rowIndex"]}},{"kind":"attribute","name":"data-column-index","expression":"active.columnIndex","expressionPlan":{"source":"active.columnIndex","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"columnIndex"},"dependencies":["active.columnIndex"]}},{"kind":"literal","name":"title","value":"Cell actions"},{"kind":"literal","name":"aria-label","value":"Cell actions"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"chevron-down"}],"children":[]}],"flow":{"kind":"if","test":"active","testPlan":{"source":"active","ast":{"kind":"id","name":"active"},"dependencies":["active"]}}}]},"css":":host {\n display: block;\n width: 100%;\n height: 100%;\n overflow: visible;\n pointer-events: none;\n }\n\n :host {\n position: relative;\n width: 100%;\n height: 100%;\n overflow: visible;\n pointer-events: none;\n }\n\n .rows,\n .cols {\n pointer-events: none;\n position: absolute;\n }\n\n .rows {\n inset: 0;\n width: 100%;\n }\n\n .cols {\n inset: 0;\n height: 100%;\n }\n\n .control {\n position: absolute;\n z-index: 1;\n pointer-events: none;\n }\n\n .handle {\n position: absolute;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 24px;\n height: 24px;\n padding: 0;\n border: 1px solid var(--ui-affordance-near-color, var(--ui-border-strong));\n border-radius: var(--ui-radius-round);\n background: color-mix(in srgb, var(--ui-surface-elevated) 96%, transparent);\n color: var(--ui-affordance-near-color, var(--ui-text-secondary));\n font: inherit;\n font-size: 16px;\n line-height: 1;\n box-shadow: var(--ui-shadow-xs, 0 1px 2px rgb(0 0 0 / 0.05));\n opacity: 0;\n scale: 0.72;\n transition:\n opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n scale var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n background-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n border-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n pointer-events: auto;\n cursor: pointer;\n }\n\n .handle {\n --ui-icon-size: 14px;\n --ui-icon-stroke-width: 2;\n }\n\n .handle[data-ui-proximity=\"near\"],\n .control.active .handle,\n .handle:focus-visible {\n opacity: 1;\n scale: 1;\n }\n\n .control.active .handle,\n .handle:focus-visible {\n border-color: var(--ui-affordance-direct-color, var(--ui-accent-solid));\n background: var(--ui-affordance-direct-color, var(--ui-accent-solid));\n color: var(--ui-text-on-accent);\n box-shadow: var(--ui-shadow-sm, 0 1px 3px rgb(0 0 0 / 0.1));\n }\n\n .handle:focus-visible,\n .selector:focus-visible,\n .cell-menu:focus-visible {\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: 2px;\n }\n\n .control.row {\n left: 0;\n width: 100%;\n height: 0;\n }\n\n .control.row .handle {\n top: -12px;\n left: -30px;\n }\n\n .control.col {\n top: 0;\n width: 0;\n height: 100%;\n }\n\n .control.col .handle {\n top: -30px;\n left: -12px;\n }\n\n .line {\n position: absolute;\n background: var(--ui-affordance-direct-color, var(--ui-accent-solid));\n opacity: 0;\n transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n }\n\n .control.row .line {\n inset: -1px 0 auto;\n height: 2px;\n }\n\n .control.col .line {\n inset: 0 auto 0 -1px;\n width: 2px;\n }\n\n .control.active .line {\n opacity: 0.8;\n }\n\n .guide {\n position: absolute;\n width: var(--ui-affordance-guide-size);\n height: var(--ui-affordance-guide-size);\n border-radius: var(--ui-radius-round);\n background: var(--ui-affordance-guide-color, var(--ui-border-strong));\n opacity: var(--ui-affordance-guide-opacity);\n transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n }\n\n .control.row .guide {\n left: -10px;\n top: -2px;\n }\n\n .control.col .guide {\n left: -2px;\n top: -10px;\n }\n\n .control:has(.handle[data-ui-proximity=\"near\"]) .guide,\n .control.active .guide {\n opacity: 0;\n }\n\n .tooltip {\n position: absolute;\n z-index: 2;\n top: calc(100% + 6px);\n left: 50%;\n width: max-content;\n max-width: 14rem;\n padding: var(--ui-space-1) var(--ui-space-2);\n border-radius: var(--ui-radius-sm);\n background: var(--ui-text-primary);\n color: var(--ui-surface-elevated);\n font-size: var(--ui-font-size-xs);\n font-weight: var(--ui-font-medium);\n line-height: var(--ui-line-height-md);\n opacity: 0;\n transform: translateX(-50%);\n transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n pointer-events: none;\n }\n\n .control.row .tooltip {\n top: 50%;\n left: auto;\n right: calc(100% + 8px);\n transform: translateY(-50%);\n }\n\n .control.active .tooltip,\n .handle:focus-visible .tooltip {\n opacity: 1;\n }\n\n .selector,\n .cell-menu {\n position: absolute;\n z-index: 2;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n border: 1px solid transparent;\n background: transparent;\n color: var(--ui-text-secondary);\n box-shadow: none;\n pointer-events: auto;\n cursor: pointer;\n transition:\n color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n background-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n border-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n box-shadow var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n }\n\n .selector:hover,\n .cell-menu:hover {\n background: var(--ui-icon-button-hover-surface, var(--ui-surface-muted));\n color: var(--ui-icon-button-hover-text, var(--ui-text-primary));\n box-shadow: var(--ui-shadow-xs, 0 1px 2px rgb(0 0 0 / 0.05));\n }\n\n .selector {\n border-radius: var(--ui-radius-round);\n }\n\n .selector::before {\n content: \"\";\n position: absolute;\n inset: 50% auto auto 50%;\n border-radius: var(--ui-radius-round);\n background: var(--ui-affordance-guide-color, var(--ui-border-strong));\n opacity: var(--ui-affordance-guide-opacity);\n transform: translate(-50%, -50%);\n transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n pointer-events: none;\n }\n\n .selector .glyph {\n display: block;\n width: 14px;\n height: 14px;\n --ui-icon-size: 14px;\n --ui-icon-stroke-width: 2;\n opacity: 0;\n transform: scale(0.72);\n transition:\n opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n transform var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n }\n\n .selector:hover::before,\n .selector:focus-visible::before {\n opacity: 0;\n }\n\n .selector:hover .glyph,\n .selector:focus-visible .glyph {\n opacity: 1;\n transform: scale(1);\n }\n\n .selector.row {\n left: -9px;\n width: 18px;\n height: 32px;\n transform: translateY(-50%);\n }\n\n .selector.row::before {\n width: 2px;\n height: 16px;\n }\n\n .selector.column {\n top: -9px;\n width: 32px;\n height: 18px;\n transform: translateX(-50%);\n }\n\n .selector.column::before {\n width: 16px;\n height: 2px;\n }\n\n @media (hover: none), (pointer: coarse) {\n .selector::before {\n opacity: 0;\n }\n\n .selector .glyph {\n opacity: 1;\n transform: none;\n }\n }\n\n .cell-menu {\n width: 24px;\n height: 24px;\n border-radius: var(--ui-radius-sm);\n background: color-mix(in srgb, var(--ui-surface-muted) 78%, transparent);\n }\n\n .cell-menu {\n --ui-icon-size: 15px;\n --ui-icon-stroke-width: 2;\n }\n\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"rows","type":"list(object({ key: string, index: integer, offset: string, affordance: insert-row | insert-column, action: add-row-before | add-row-after | add-column-before | add-column-after, label: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"cols","type":"list(object({ key: string, index: integer, offset: string, affordance: insert-row | insert-column, action: add-row-before | add-row-after | add-column-before | add-column-after, label: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"hovered","type":"object({ left: number, top: number, width: number, height: number, rowIndex: integer, columnIndex: integer, rowOffset: string, columnOffset: string }) | null","expression":{"source":"null","ast":{"kind":"literal","value":null},"dependencies":[]}},{"kind":"state","name":"active","type":"object({ left: number, top: number, width: number, height: number, rowIndex: integer, columnIndex: integer, menuLeft: string, menuTop: string }) | null","expression":{"source":"null","ast":{"kind":"literal","value":null},"dependencies":[]}},{"kind":"state","name":"activeKey","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"event","name":"action","type":"object({ action: add-row-before | add-row-after | add-column-before | add-column-after, boundaryIndex: integer }) | object({ action: select-row | select-column, rowIndex: integer, columnIndex: integer }) | object({ action: open-cell-menu, rowIndex: integer, columnIndex: integer, anchor: object({ left: number, top: number, right: number, bottom: number }) })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editor-table-overlay/ui-editor-table-overlay.js"},{"source":{"file":"./components/ui-editor-table-toolbar/ui-editor-table-toolbar.html"},"contract":{"version":1,"name":"UiEditorTableToolbar","tag":"ui-editor-table-toolbar","nativeElement":"div","props":{"actions":{"type":{"kind":"list","item":{"kind":"union","members":[{"kind":"keyword","value":"align-left"},{"kind":"keyword","value":"align-center"},{"kind":"keyword","value":"align-right"},{"kind":"keyword","value":"background-none"},{"kind":"keyword","value":"background-gray"},{"kind":"keyword","value":"background-yellow"},{"kind":"keyword","value":"background-blue"},{"kind":"keyword","value":"background-green"},{"kind":"keyword","value":"background-red"},{"kind":"keyword","value":"add-row-before"},{"kind":"keyword","value":"add-row-after"},{"kind":"keyword","value":"add-column-before"},{"kind":"keyword","value":"add-column-after"},{"kind":"keyword","value":"clear-cells"},{"kind":"keyword","value":"merge-cells"},{"kind":"keyword","value":"split-cell"},{"kind":"keyword","value":"delete-row"},{"kind":"keyword","value":"delete-column"},{"kind":"keyword","value":"delete-table"}]}},"required":false,"target":{"attribute":"actions"},"description":"The complete set of commands the current selection permits."},"cellAlignment":{"type":{"enum":["left","center","right"]},"required":false,"target":{"attribute":"cellalignment"},"description":"Marks the alignment command that is active for the current cell.","default":"left"},"cellBackground":{"type":"string","required":false,"target":{"attribute":"cellbackground"},"description":"Identifies the background choice that is active for the current cell.","default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Shows the toolbar while a table selection is active.","default":false}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"toolbar"},{"kind":"literal","name":"aria-label","value":"Table actions"},{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"group"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Cell alignment"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"icon-button"},{"kind":"attribute","name":"active","expression":"item.active","expressionPlan":{"source":"item.active","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"active"},"dependencies":["item.active"]},"target":"class"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}},{"kind":"attribute","name":"aria-label","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}},{"kind":"attribute","name":"title","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}},{"kind":"attribute","name":"aria-pressed","expression":"item.active","expressionPlan":{"source":"item.active","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"active"},"dependencies":["item.active"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"alignments","listPlan":{"source":"alignments","ast":{"kind":"id","name":"alignments"},"dependencies":["alignments"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}],"flow":{"kind":"if","test":"alignments","testPlan":{"source":"alignments","ast":{"kind":"id","name":"alignments"},"dependencies":["alignments"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sep"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[],"flow":{"kind":"if","test":"alignments and structure","testPlan":{"source":"alignments and structure","ast":{"kind":"binary","op":"and","left":{"kind":"id","name":"alignments"},"right":{"kind":"id","name":"structure"}},"dependencies":["alignments","structure"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"group"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Table structure"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"structure","listPlan":{"source":"structure","ast":{"kind":"id","name":"structure"},"dependencies":["structure"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}],"flow":{"kind":"if","test":"structure","testPlan":{"source":"structure","ast":{"kind":"id","name":"structure"},"dependencies":["structure"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sep"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[],"flow":{"kind":"if","test":"(alignments or structure) and hasOverflow","testPlan":{"source":"(alignments or structure) and hasOverflow","ast":{"kind":"binary","op":"and","left":{"kind":"binary","op":"or","left":{"kind":"id","name":"alignments"},"right":{"kind":"id","name":"structure"}},"right":{"kind":"id","name":"hasOverflow"}},"dependencies":["alignments","hasOverflow","structure"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"overflow"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"more"},{"kind":"literal","name":"data-action","value":"toggle-overflow"},{"kind":"literal","name":"aria-haspopup","value":"menu"},{"kind":"attribute","name":"aria-expanded","expression":"overflowOpen","expressionPlan":{"source":"overflowOpen","ast":{"kind":"id","name":"overflowOpen"},"dependencies":["overflowOpen"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"table"}],"children":[]},{"kind":"element","name":"span","attributes":[],"children":[{"kind":"text","value":"Table options"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"chevron"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"chevron-down"}],"children":[]}]}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu"},{"kind":"literal","name":"role","value":"menu"},{"kind":"literal","name":"aria-label","value":"More table actions"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-section"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-heading"},{"kind":"literal","name":"role","value":"presentation"}],"children":[{"kind":"text","value":"Background"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"swatches"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Cell background"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"swatch-button"},{"kind":"attribute","name":"selected","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]},"target":"class"},{"kind":"literal","name":"role","value":"menuitemradio"},{"kind":"attribute","name":"aria-checked","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]}},{"kind":"attribute","name":"data-action","expression":"swatch.action","expressionPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"swatch"},{"kind":"attribute","name":"default","expression":"not swatch.color","expressionPlan":{"source":"not swatch.color","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"}},"dependencies":["swatch.color"]},"target":"class"},{"kind":"attribute","name":"--_swatch","expression":"swatch.color","expressionPlan":{"source":"swatch.color","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"},"dependencies":["swatch.color"]},"target":"style"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"swatch.label","expressionPlan":{"source":"swatch.label","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"label"},"dependencies":["swatch.label"]}}],"children":[]}],"flow":{"kind":"each","item":"swatch","list":"swatches","listPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]},"key":"swatch.action","keyPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}}]}],"flow":{"kind":"if","test":"swatches","testPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-section divided"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-heading"},{"kind":"literal","name":"role","value":"presentation"},{"kind":"directive","name":"value","expression":"section.heading","expressionPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"role","value":"menuitem"},{"kind":"attribute","name":"danger","expression":"item.danger","expressionPlan":{"source":"item.danger","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"danger"},"dependencies":["item.danger"]},"target":"class"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"section.items","listPlan":{"source":"section.items","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"items"},"dependencies":["section.items"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}],"flow":{"kind":"each","item":"section","list":"sections","listPlan":{"source":"sections","ast":{"kind":"id","name":"sections"},"dependencies":["sections"]},"key":"section.heading","keyPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}}],"flow":{"kind":"if","test":"overflowOpen","testPlan":{"source":"overflowOpen","ast":{"kind":"id","name":"overflowOpen"},"dependencies":["overflowOpen"]}}}],"flow":{"kind":"if","test":"hasOverflow","testPlan":{"source":"hasOverflow","ast":{"kind":"id","name":"hasOverflow"},"dependencies":["hasOverflow"]}}}]},"css":".looma-editor__mobile-toolbar-shell :host {\n min-width: max-content;\n min-height: 100%;\n padding: 0;\n background: transparent;\n border: 0;\n border-radius: 0;\n box-shadow: none;\n backdrop-filter: none;\n }\n\n .looma-editor__mobile-toolbar-shell :host button {\n min-height: 44px;\n background: transparent;\n }\n\n .looma-editor__mobile-toolbar-shell :host button.active,\n .looma-editor__mobile-toolbar-shell :host button.selected {\n background: var(--ui-accent-soft, var(--ui-accent-subtle));\n }\n\n .looma-editor__mobile-toolbar-shell :host .menu {\n top: auto;\n right: 0;\n bottom: calc(100% + var(--ui-space-2));\n max-height: min(50dvh, 22rem);\n overflow-y: auto;\n overscroll-behavior: contain;\n }\n :host {\n display: inline-flex;\n align-items: center;\n gap: var(--ui-space-1);\n padding: var(--ui-space-1);\n background: color-mix(in srgb, var(--ui-surface) 94%, transparent);\n border: 1px solid var(--ui-border);\n border-radius: calc(var(--ui-radius-md) + 2px);\n box-shadow: var(--ui-shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));\n backdrop-filter: blur(10px);\n }\n\n .group {\n display: inline-flex;\n align-items: center;\n gap: 2px;\n overflow: hidden;\n }\n\n .sep {\n width: 1px;\n align-self: stretch;\n background: var(--ui-border);\n }\n\n .overflow {\n position: relative;\n }\n\n :host button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--ui-space-2);\n min-height: 32px;\n border: 0;\n border-radius: var(--ui-radius-sm);\n background: transparent;\n color: var(--ui-text-primary);\n cursor: pointer;\n font-size: var(--ui-font-size-sm);\n font-weight: 500;\n line-height: 1;\n padding: var(--ui-space-2) var(--ui-space-2);\n white-space: nowrap;\n }\n\n :host button:hover {\n background: var(--ui-surface-hover);\n }\n\n :host button.active {\n background: var(--ui-accent-soft, var(--ui-accent-subtle));\n color: var(--ui-accent-active);\n }\n\n .group button {\n border-radius: var(--ui-radius-sm);\n }\n\n .group button + button {\n border-left: 0;\n }\n\n :host .more {\n border: 0;\n border-radius: var(--ui-radius-sm);\n }\n\n :host button.danger {\n color: var(--ui-danger);\n }\n\n :host {\n --ui-icon-size: var(--ui-editor-toolbar-icon-size, 1rem);\n --ui-icon-stroke-width: var(--ui-editor-toolbar-icon-stroke-width, 1.75);\n }\n\n .chevron {\n display: inline-flex;\n --ui-icon-size: 0.875rem;\n }\n\n :host .icon-button {\n width: 32px;\n padding-inline: 0;\n }\n\n .menu {\n position: absolute;\n top: calc(100% + var(--ui-space-2));\n right: 0;\n min-width: 12rem;\n padding: var(--ui-space-1);\n background: var(--ui-surface);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-md);\n box-shadow: var(--ui-shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));\n display: flex;\n flex-direction: column;\n gap: 2px;\n z-index: 2;\n }\n\n .menu-section + .menu-section {\n margin-top: var(--ui-space-1);\n padding-top: var(--ui-space-1);\n border-top: 1px solid color-mix(in srgb, var(--ui-border) 80%, transparent);\n }\n\n .menu-heading {\n padding: var(--ui-space-1) var(--ui-space-2);\n font-size: 0.6875rem;\n font-weight: 700;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--ui-text-muted);\n }\n\n .menu button {\n display: flex;\n justify-content: flex-start;\n width: 100%;\n text-align: left;\n }\n\n .swatches {\n display: grid;\n grid-template-columns: repeat(3, minmax(0, 1fr));\n gap: 2px;\n }\n\n :host .swatch-button {\n gap: var(--ui-space-1);\n justify-content: flex-start;\n }\n\n .swatch {\n width: 14px;\n height: 14px;\n flex: 0 0 14px;\n border: 1px solid color-mix(in srgb, var(--ui-border) 80%, #000);\n border-radius: 3px;\n background: var(--_swatch);\n }\n\n .swatch.default {\n background:\n linear-gradient(135deg, transparent 44%, var(--ui-danger) 46% 54%, transparent 56%),\n var(--ui-surface);\n }\n\n .swatch-button.selected {\n background: var(--ui-accent-soft, var(--ui-accent-subtle));\n }\n\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"alignments","type":"list(object({ action: align-left | align-center | align-right, label: string, active: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"structure","type":"list(object({ action: add-row-after | add-column-after, label: string, icon: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"swatches","type":"list(object({ action: string, label: string, color: string, selected: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"sections","type":"list(object({ heading: string, items: list(object({ action: string, label: string, icon: string, danger: boolean })) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"hasOverflow","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"overflowOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"action","type":"object({ action: align-left | align-center | align-right | background-none | background-gray | background-yellow | background-blue | background-green | background-red | add-row-before | add-row-after | add-column-before | add-column-after | clear-cells | merge-cells | split-cell | delete-row | delete-column | delete-table })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editor-table-toolbar/ui-editor-table-toolbar.js"},{"source":{"file":"./components/ui-editor-toolbar/ui-editor-toolbar.html"},"contract":{"version":1,"name":"UiEditorToolbar","tag":"ui-editor-toolbar","nativeElement":"div","props":{"floating":{"type":"boolean","required":false,"target":{"attribute":"floating"},"description":"Shows the toolbar as a floating bar beside the selection rather than pinned to the editor.","default":false}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"toolbar"},{"kind":"literal","name":"aria-label","value":"Editor toolbar"}],"children":[{"kind":"slot"}]},"css":":host {\n position: sticky;\n top: 0;\n z-index: var(--ui-editor-toolbar-z-index, 10);\n display: flex;\n align-items: center;\n justify-content: flex-start;\n gap: var(--ui-editor-toolbar-gap, 2px);\n padding: var(--ui-editor-toolbar-padding-block, 6px) var(--ui-editor-toolbar-padding-inline, 12px);\n min-height: var(--ui-editor-toolbar-min-height, 48px);\n /* More controls than the column is wide is normal at a readable measure, so the row wraps.\n Scrolling hid the tail behind an invisible scrollbar. */\n flex-wrap: wrap;\n row-gap: var(--ui-editor-toolbar-row-gap, var(--ui-editor-toolbar-gap, 2px));\n background: var(--ui-editor-toolbar-surface, var(--ui-surface));\n border-bottom: 1px solid var(--ui-editor-toolbar-border, var(--ui-border));\n }\n\n :host::-webkit-scrollbar {\n display: none;\n }\n\n :host > :slotted(*) {\n flex: 0 0 auto;\n }\n\n :slotted(.divider) {\n width: 1px;\n height: 20px;\n background: var(--ui-editor-toolbar-divider, var(--ui-border));\n flex-shrink: 0;\n margin: 0 var(--ui-editor-toolbar-divider-margin, 4px);\n }\n\n :host-state([floating]) {\n flex-wrap: nowrap;\n position: static;\n top: auto;\n width: max-content;\n max-width: min(calc(100vw - 24px), 100%);\n min-height: auto;\n padding: var(--ui-editor-toolbar-floating-padding, 4px);\n overflow-x: visible;\n background: color-mix(in srgb, var(--ui-editor-toolbar-surface, var(--ui-surface)) 96%, transparent);\n border: 1px solid var(--ui-editor-toolbar-border, var(--ui-border));\n border-radius: var(--ui-editor-toolbar-floating-radius, var(--ui-radius-lg));\n box-shadow: var(--ui-editor-toolbar-floating-shadow, var(--ui-shadow-lg, 0 10px 24px rgb(0 0 0 / 0.12)));\n backdrop-filter: blur(10px);\n }\n\n @media (max-width: 767px) {\n :host {\n position: fixed;\n top: auto;\n bottom: env(safe-area-inset-bottom);\n left: 0;\n right: 0;\n min-height: var(--ui-editor-toolbar-mobile-min-height, 56px);\n border-top: 1px solid var(--ui-editor-toolbar-border, var(--ui-border));\n border-bottom: none;\n box-shadow: var(--ui-editor-toolbar-mobile-shadow, 0 -2px 8px rgb(0 0 0 / 0.06));\n }\n\n :host-state([floating]) {\n position: static;\n inset: auto;\n min-height: auto;\n border: 1px solid var(--ui-editor-toolbar-border, var(--ui-border));\n border-radius: var(--ui-editor-toolbar-floating-radius, var(--ui-radius-lg));\n box-shadow: var(--ui-editor-toolbar-floating-shadow, var(--ui-shadow-lg, 0 10px 24px rgb(0 0 0 / 0.12)));\n }\n }\n\n /* Inside LoomaEditor's sticky shell, the shell is the sticky surface. */\n .looma-editor__sticky-toolbar-shell :host {\n position: static;\n min-height: var(--ui-editor-toolbar-min-height, 48px);\n overscroll-behavior-inline: contain;\n background: transparent;\n border: 0;\n box-shadow: none;\n }\n\n /* Inside LoomaEditor's mobile shell, the toolbar is a scroll-snapping strip. */\n .looma-editor__mobile-toolbar-shell :host-state([floating]) {\n width: 100%;\n max-width: none;\n min-height: 100%;\n padding: 0;\n overflow-x: auto;\n overflow-y: hidden;\n overscroll-behavior-inline: contain;\n scroll-snap-type: x mandatory;\n background: transparent;\n border: 0;\n border-radius: 0;\n box-shadow: none;\n backdrop-filter: none;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-floating-action-button/ui-floating-action-button.html"},"contract":{"version":1,"name":"UiFloatingActionButton","tag":"ui-floating-action-button","nativeElement":"button","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"label token.","default":""},"mobileOnly":{"type":"boolean","required":false,"target":{"attribute":"mobileonly"},"description":"mobileOnly token.","default":false}}},"template":{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"slot"}]},"css":":host {\n position: fixed;\n inset-block-end: calc(var(--ui-floating-action-button-inset-block-end, var(--ui-space-6)) + env(safe-area-inset-bottom));\n inset-inline-end: max(\n var(--ui-floating-action-button-inset-inline-end, var(--ui-space-5)),\n env(safe-area-inset-right)\n );\n inline-size: var(--ui-control-min-block-size);\n block-size: var(--ui-control-min-block-size);\n display: inline-flex;\n z-index: var(--ui-floating-action-button-z-index, 100);\n }\n\n :host {\n appearance: none;\n border: none;\n border-radius: 999px;\n margin: 0;\n padding: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n background: var(--ui-accent);\n color: var(--ui-on-accent);\n box-shadow: 0 4px 12px color-mix(in srgb, var(--ui-accent) 40%, transparent);\n cursor: pointer;\n transition:\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n :host:hover:enabled {\n background: var(--ui-accent-hover);\n box-shadow: 0 6px 16px color-mix(in srgb, var(--ui-accent) 50%, transparent);\n }\n\n :host:active:enabled {\n transform: scale(0.94);\n }\n\n :host:focus-visible {\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: 2px;\n }\n\n :host:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n :slotted(svg) {\n inline-size: var(--ui-icon-size-lg);\n block-size: var(--ui-icon-size-lg);\n flex-shrink: 0;\n }\n\n @media (min-width: 768px) {\n :host-state([mobileOnly]) {\n display: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"button","choices":["button"]}},{"source":{"file":"./components/ui-form-field/ui-form-field.html"},"contract":{"version":1,"name":"UiFormField","tag":"ui-form-field","nativeElement":"div","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"invalid":{"type":"boolean","required":false,"target":{"attribute":"invalid"},"description":"invalid token.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"required token.","default":false}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot","fallback":[],"name":"label"}]},{"kind":"slot"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"help"}],"children":[{"kind":"slot","fallback":[],"name":"help"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"error"}],"children":[{"kind":"slot","fallback":[],"name":"error"}]}]},"css":":host {\n display: grid;\n gap: var(--ui-space-2);\n min-inline-size: 0;\n align-content: start;\n color: var(--ui-text-primary);\n }\n\n /* Each named region styles whatever fills it, however it was slotted (slot=\"…\" in HTML, #label\n in Vue), and generates no box of its own, so an empty region adds no gap. */\n .label,\n .help,\n .error {\n display: contents;\n }\n\n .label {\n color: var(--ui-text-secondary);\n font-size: 0.95rem;\n }\n\n .help {\n color: var(--ui-text-muted);\n font-size: 0.875rem;\n line-height: var(--ui-line-height-md);\n }\n\n .help > :slotted(*) {\n min-block-size: var(--ui-form-field-help-min-block-size, 0);\n }\n\n .error,\n :slotted([role=\"alert\"]) {\n color: var(--ui-accent-active);\n font-size: 0.875rem;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true,"name":"label"},{"dynamic":false,"required":true},{"dynamic":false,"required":true,"name":"help"},{"dynamic":false,"required":true,"name":"error"}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-form-field/ui-form-field.js"},{"source":{"file":"./components/ui-grid/ui-grid.html"},"contract":{"version":1,"name":"UiGrid","tag":"ui-grid","nativeElement":"div","props":{"gap":{"type":{"enum":["xs","s","m","l","xl"]},"required":false,"target":{"attribute":"gap"},"description":"gap token."},"min":{"type":{"enum":["sm","md","lg"]},"required":false,"target":{"attribute":"min"},"description":"min token."}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n --_grid-gap: var(--ui-space-4);\n --_grid-min: 12rem;\n display: grid;\n gap: var(--ui-grid-gap, var(--_grid-gap));\n grid-template-columns: repeat(auto-fit, minmax(min(var(--ui-grid-min, var(--_grid-min)), 100%), 1fr));\n min-inline-size: 0;\n max-inline-size: 100%;\n margin: 0;\n }\n\n :host-state([gap=\"xs\"]) {\n --_grid-gap: var(--ui-space-2);\n }\n :host-state([gap=\"s\"]) {\n --_grid-gap: var(--ui-space-3);\n }\n :host-state([gap=\"m\"]) {\n --_grid-gap: var(--ui-space-4);\n }\n :host-state([gap=\"l\"]) {\n --_grid-gap: var(--ui-space-5);\n }\n :host-state([gap=\"xl\"]) {\n --_grid-gap: var(--ui-space-6);\n }\n :host-state([min=\"md\"]) {\n --_grid-min: 16rem;\n }\n :host-state([min=\"lg\"]) {\n --_grid-min: 20rem;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-icon-button/ui-icon-button.html"},"contract":{"version":1,"name":"UiIconButton","tag":"ui-icon-button","nativeElement":"button","props":{"anticipatory":{"type":"boolean","required":false,"target":{"attribute":"anticipatory"},"description":"anticipatory token.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"Accessible name for the icon."},"round":{"type":"boolean","required":false,"target":{"attribute":"round"},"description":"Use a fully circular shape.","default":false},"size":{"type":{"enum":["sm","md","lg"]},"required":false,"target":{"attribute":"size"},"description":"size token.","default":"md"},"variant":{"type":{"enum":["ghost","outline","solid"]},"required":false,"target":{"attribute":"variant"},"description":"variant token.","default":"ghost"}}},"template":{"kind":"element","name":"button","attributes":[{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[{"kind":"slot"}]},"css":":host {\n display: inline-flex;\n color: var(--ui-text-secondary);\n }\n\n :host-state([anticipatory]) {\n position: relative;\n }\n\n :host-state([anticipatory])::before {\n content: \"\";\n position: absolute;\n inset: 50% auto auto 50%;\n z-index: 1;\n inline-size: var(--ui-affordance-guide-size);\n block-size: var(--ui-affordance-guide-size);\n border-radius: var(--ui-radius-round);\n background: var(--ui-affordance-guide-color, var(--ui-border-strong));\n opacity: var(--ui-affordance-guide-opacity);\n transform: translate(-50%, -50%);\n transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n pointer-events: none;\n }\n\n /* At rest an anticipatory button shows only its guide dot; proximity, hover, or focus reveals the\n * surface and icon. The root is the native button, so hiding it outright would hide the dot\n * too, and slotted icons sit outside this scope; `color: transparent` hides currentColor icons. */\n @media (hover: hover) and (pointer: fine) {\n :host-state([anticipatory]):not(:host-state([variant=\"solid\"]), [data-ui-proximity=\"near\"], :hover, :focus-visible) {\n border-color: transparent;\n background: transparent;\n box-shadow: none;\n color: transparent;\n }\n }\n\n :host-state([anticipatory]):is(:host-state([variant=\"solid\"]), [data-ui-proximity=\"near\"], :hover, :focus-visible)::before {\n opacity: 0;\n }\n\n :host {\n /* The size prop resolves here; --ui-icon-button-size overrides it on an element. */\n --_size: 2rem;\n appearance: none;\n inline-size: var(--ui-icon-button-size, var(--_size));\n block-size: var(--ui-icon-button-size, var(--_size));\n min-inline-size: var(--ui-icon-button-size, var(--_size));\n min-block-size: var(--ui-icon-button-size, var(--_size));\n padding: 0;\n margin: 0;\n border: 1px solid transparent;\n border-radius: var(--ui-icon-button-radius, var(--ui-radius-md));\n background: var(--ui-icon-button-surface, transparent);\n color: inherit;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition:\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n @media (hover: none), (pointer: coarse) {\n :host-state([anticipatory])::before {\n opacity: 0;\n }\n }\n\n /* A touch target without a bigger button: an invisible hit area, at least the control\n minimum, centred on the button (::before is the anticipatory guide). */\n @media (pointer: coarse) {\n :host {\n position: relative;\n }\n\n :host::after {\n content: \"\";\n position: absolute;\n inset: 50% auto auto 50%;\n inline-size: max(100%, var(--ui-control-min-block-size));\n block-size: max(100%, var(--ui-control-min-block-size));\n transform: translate(-50%, -50%);\n }\n }\n\n html[data-ui-input-modality=\"touch\"] :host {\n position: relative;\n }\n\n html[data-ui-input-modality=\"touch\"] :host::after {\n content: \"\";\n position: absolute;\n inset: 50% auto auto 50%;\n inline-size: max(100%, var(--ui-control-min-block-size));\n block-size: max(100%, var(--ui-control-min-block-size));\n transform: translate(-50%, -50%);\n }\n\n :host-state([size=\"sm\"]) {\n --_size: 1.75rem;\n inline-size: var(--ui-icon-button-size, var(--_size));\n block-size: var(--ui-icon-button-size, var(--_size));\n min-inline-size: var(--ui-icon-button-size, var(--_size));\n min-block-size: var(--ui-icon-button-size, var(--_size));\n }\n\n :host-state([size=\"lg\"]) {\n --_size: 2.5rem;\n inline-size: var(--ui-icon-button-size, var(--_size));\n block-size: var(--ui-icon-button-size, var(--_size));\n min-inline-size: var(--ui-icon-button-size, var(--_size));\n min-block-size: var(--ui-icon-button-size, var(--_size));\n }\n\n :host-state([round]) {\n border-radius: var(--ui-radius-round);\n }\n\n :host-state([variant=\"outline\"]) {\n border-color: var(--ui-icon-button-border, var(--ui-border-default));\n background: var(--ui-icon-button-outline-surface, var(--ui-surface-default));\n color: var(--ui-icon-button-outline-text, var(--ui-text-primary));\n }\n\n :host-state([variant=\"solid\"]) {\n background: var(--ui-icon-button-solid-surface, var(--ui-accent-solid));\n color: var(--ui-icon-button-solid-text, var(--ui-text-on-accent));\n box-shadow: var(\n --ui-icon-button-solid-shadow,\n 0 1px 2px color-mix(in srgb, var(--ui-accent-solid) 18%, transparent)\n );\n }\n\n :host:hover:enabled {\n /* Derived from the text colour so the ghost hover shows on any background. */\n background: var(--ui-icon-button-hover-surface, color-mix(in srgb, currentColor 8%, transparent));\n color: var(--ui-icon-button-hover-text, var(--ui-text-primary));\n }\n\n :host-state([variant=\"outline\"]):hover:enabled {\n border-color: var(--ui-icon-button-hover-border, var(--ui-border-strong));\n }\n\n :host-state([variant=\"solid\"]):hover:enabled {\n background: var(--ui-icon-button-solid-hover-surface, var(--ui-accent-hover));\n }\n\n :host:active:enabled {\n transform: scale(var(--ui-icon-button-active-scale, 0.96));\n }\n\n :host:focus-visible {\n outline: none;\n box-shadow: var(--ui-focus-halo);\n }\n\n /* Disabled colours fall back to each variant's own; ghost takes only the icon colour. */\n :host:disabled {\n opacity: var(--ui-icon-button-disabled-opacity, 1);\n color: var(--ui-icon-button-disabled-text, var(--ui-disabled-text));\n cursor: not-allowed;\n }\n\n :host-state([variant=\"outline\"]):disabled {\n border-color: var(--ui-icon-button-disabled-border, var(--ui-border));\n background-color: var(--ui-icon-button-disabled-surface, var(--ui-disabled-surface));\n color: var(--ui-icon-button-disabled-text, var(--ui-disabled-text));\n }\n\n :host-state([variant=\"solid\"]):disabled {\n border-color: var(--ui-icon-button-disabled-border, var(--ui-border));\n background-color: var(--ui-icon-button-disabled-surface, var(--ui-disabled-surface));\n color: var(--ui-icon-button-disabled-text, var(--ui-disabled-text));\n }\n\n :host {\n --_icon-button-icon-default: var(--ui-icon-size-md);\n }\n\n :host-state([size=\"sm\"]) {\n --_icon-button-icon-default: var(--ui-icon-size-sm);\n }\n\n :host-state([size=\"lg\"]) {\n --_icon-button-icon-default: var(--ui-icon-size-lg);\n }\n\n :slotted(svg) {\n inline-size: var(--ui-icon-button-icon-size, var(--_icon-button-icon-default));\n block-size: var(--ui-icon-button-icon-size, var(--_icon-button-icon-default));\n flex-shrink: 0;\n stroke-width: var(--ui-icon-button-icon-stroke-width, 1.75);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"button","choices":["button"]},"controller":"./components/ui-icon-button/ui-icon-button.js"},{"source":{"file":"./components/ui-icon/ui-icon.html"},"contract":{"version":1,"name":"UiIcon","tag":"ui-icon","nativeElement":"span","props":{"name":{"type":"string","required":false,"target":{"attribute":"name"},"description":"The icon's name.","default":""}}},"template":{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"},{"kind":"literal","name":"focusable","value":"false"}],"children":[{"kind":"element","name":"g","attributes":[],"children":[{"kind":"element","name":"path","attributes":[{"kind":"attribute","name":"d","expression":"shape.d","expressionPlan":{"source":"shape.d","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"d"},"dependencies":["shape.d"]}}],"children":[],"flow":{"kind":"if","test":"shape.tag = 'path'","testPlan":{"source":"shape.tag = 'path'","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"tag"},"right":{"kind":"literal","value":"path"}},"dependencies":["shape.tag"]}}},{"kind":"element","name":"circle","attributes":[{"kind":"attribute","name":"cx","expression":"shape.cx","expressionPlan":{"source":"shape.cx","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"cx"},"dependencies":["shape.cx"]}},{"kind":"attribute","name":"cy","expression":"shape.cy","expressionPlan":{"source":"shape.cy","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"cy"},"dependencies":["shape.cy"]}},{"kind":"attribute","name":"r","expression":"shape.r","expressionPlan":{"source":"shape.r","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"r"},"dependencies":["shape.r"]}}],"children":[],"flow":{"kind":"if","test":"shape.tag = 'circle'","testPlan":{"source":"shape.tag = 'circle'","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"tag"},"right":{"kind":"literal","value":"circle"}},"dependencies":["shape.tag"]}}},{"kind":"element","name":"rect","attributes":[{"kind":"attribute","name":"x","expression":"shape.x","expressionPlan":{"source":"shape.x","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"x"},"dependencies":["shape.x"]}},{"kind":"attribute","name":"y","expression":"shape.y","expressionPlan":{"source":"shape.y","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"y"},"dependencies":["shape.y"]}},{"kind":"attribute","name":"width","expression":"shape.width","expressionPlan":{"source":"shape.width","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"width"},"dependencies":["shape.width"]}},{"kind":"attribute","name":"height","expression":"shape.height","expressionPlan":{"source":"shape.height","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"height"},"dependencies":["shape.height"]}},{"kind":"attribute","name":"rx","expression":"shape.rx","expressionPlan":{"source":"shape.rx","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"rx"},"dependencies":["shape.rx"]}}],"children":[],"flow":{"kind":"if","test":"shape.tag = 'rect'","testPlan":{"source":"shape.tag = 'rect'","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"tag"},"right":{"kind":"literal","value":"rect"}},"dependencies":["shape.tag"]}}}],"flow":{"kind":"each","item":"shape","list":"shapes","listPlan":{"source":"shapes","ast":{"kind":"id","name":"shapes"},"dependencies":["shapes"]}}}]}]},"css":":host {\n display: inline-flex;\n flex: none;\n inline-size: var(--ui-icon-size, 1em);\n block-size: var(--ui-icon-size, 1em);\n }\n\n svg {\n inline-size: 100%;\n block-size: 100%;\n stroke-width: var(--ui-icon-stroke-width, 2);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"shapes","type":"list(object({ tag: path | circle | rect, d?: string, cx?: string, cy?: string, r?: string, x?: string, y?: string, width?: string, height?: string, rx?: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}}],"slots":[],"root":{"kind":"native","element":"span","choices":["span"]},"controller":"./components/ui-icon/ui-icon.js"},{"source":{"file":"./components/ui-input/ui-input.html"},"contract":{"version":1,"name":"UiInput","tag":"ui-input","nativeElement":"input","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"Prevents editing and form submission.","default":false},"invalid":{"type":"boolean","required":false,"target":{"attribute":"aria-invalid"},"description":"Exposes invalid state to assistive technology and styling.","default":false},"readonly":{"type":"boolean","required":false,"target":{"attribute":"readonly"},"description":"Allows selection without allowing edits.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"Marks the control as required for form validation.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"Current text value."}}},"template":{"kind":"element","name":"input","attributes":[{"kind":"attribute","name":"value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"readonly","expression":"readonly","expressionPlan":{"source":"readonly","ast":{"kind":"id","name":"readonly"},"dependencies":["readonly"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"aria-invalid","expression":"invalid","expressionPlan":{"source":"invalid","ast":{"kind":"id","name":"invalid"},"dependencies":["invalid"]}}],"children":[]},"css":":host {\n box-sizing: border-box;\n display: inline-block;\n inline-size: 100%;\n min-inline-size: 0;\n min-block-size: var(--ui-control-size-md);\n margin: 0;\n padding: var(--ui-space-2) var(--ui-space-3);\n appearance: none;\n border: 1px solid var(--ui-control-border, var(--ui-border-strong));\n border-radius: var(--ui-input-radius, var(--ui-radius-md));\n background: var(--ui-control-surface, var(--ui-surface-elevated));\n color: var(--ui-text-primary);\n font: inherit;\n line-height: var(--ui-line-height-md);\n box-shadow: var(--ui-input-shadow, var(--ui-control-inset));\n transition:\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease),\n background-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* Tabbing into a field selects its text; tint that selection softly instead of the page highlight. */\n :host::selection {\n background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);\n color: inherit;\n }\n\n :host::placeholder {\n color: var(--ui-control-placeholder, var(--ui-text-secondary));\n opacity: 1;\n }\n\n :host:hover:not(:focus):not(:disabled) {\n border-color: var(--ui-control-border-hover, var(--ui-text-secondary));\n }\n\n :host:focus-visible {\n border-color: var(--ui-control-focus, var(--ui-accent-solid));\n outline: none;\n box-shadow: var(--ui-input-focus-shadow, var(--ui-control-inset), var(--ui-control-focus-halo-shadow));\n }\n\n /* The app's invalid flag, or the browser's own verdict once the user has left an invalid field. */\n :host[aria-invalid=\"true\"],\n :host:user-invalid {\n border-color: var(--ui-danger-solid);\n }\n\n :host:is([aria-invalid=\"true\"], :user-invalid):focus-visible {\n box-shadow:\n var(--ui-control-inset),\n 0 0 0 3px color-mix(in srgb, var(--ui-danger-solid) 22%, transparent);\n }\n\n :host:disabled {\n background: var(--ui-control-surface-disabled, var(--ui-surface-muted));\n color: var(--ui-text-muted);\n box-shadow: none;\n cursor: not-allowed;\n }\n\n /* No text-box-trim here: trimming a native input's line box below its line height lets the text\n * scroll vertically inside the field. Native inputs already center their single line. */\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[],"root":{"kind":"native","element":"input","choices":["input"]},"controller":"./components/ui-input/ui-input.js"},{"source":{"file":"./components/ui-menu-item/ui-menu-item.html"},"contract":{"version":1,"name":"UiMenuItem","tag":"ui-menu-item","nativeElement":"div","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"aria-disabled"},"description":"disabled token.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"data-value"},"description":"value token.","default":""}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"menuitem"},{"kind":"literal","name":"tabindex","value":"-1"},{"kind":"attribute","name":"aria-disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"data-value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}}],"children":[{"kind":"slot"}]},"css":":host {\n display: block;\n box-sizing: border-box;\n width: 100%;\n padding: var(--ui-menu-item-padding-block, var(--ui-space-2)) var(--ui-menu-item-padding-inline, var(--ui-space-3));\n text-align: left;\n border-radius: var(--ui-menu-item-radius, var(--ui-radius-md));\n color: var(--ui-text-primary);\n font-size: var(--ui-menu-item-font-size, var(--ui-font-size-md));\n font-weight: var(--ui-font-medium);\n cursor: pointer;\n outline: none;\n transition: background-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high. */\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high.\n * Trimming applies to block containers, so the box is a block with centred content. */\n @supports (text-box-trim: trim-both) {\n :host {\n display: block;\n min-block-size: var(--ui-menu-item-min-block-size, var(--ui-control-size-md, 2.5rem));\n align-content: center;\n text-box-trim: trim-both;\n text-box-edge: cap alphabetic;\n }\n }\n\n :host:is(:hover, :focus-visible):not([aria-disabled=\"true\"]) {\n background: var(--ui-menu-item-hover-surface, var(--ui-surface-subtle));\n }\n\n :host[aria-disabled=\"true\"] {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-menu/ui-menu.html"},"contract":{"version":1,"name":"UiMenu","tag":"ui-menu","nativeElement":"div","props":{"density":{"type":{"enum":["comfortable","compact"]},"required":false,"target":{"attribute":"density"},"description":"Compact trades padding and type size for rows that fit more on screen.","default":"comfortable"},"for":{"type":"string","required":false,"target":{"attribute":"for"},"description":"ID of the control that toggles and anchors the menu.","default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the menu is open initially or when set externally.","default":false},"placement":{"type":"string","required":false,"target":{"attribute":"placement"},"description":"Positions an associated menu relative to its trigger.","default":"bottom-start"}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"menu"},{"kind":"literal","name":"aria-orientation","value":"vertical"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"surface"}],"children":[{"kind":"slot"}]}]},"css":"/* Compact sets the part tokens its items read, so nothing has to rescale a global. */\n :host-state([density=\"compact\"]) {\n --ui-menu-item-padding-block: var(--ui-space-1);\n --ui-menu-item-padding-inline: var(--ui-space-2);\n --ui-menu-item-font-size: var(--ui-font-size-sm);\n --ui-menu-item-radius: var(--ui-radius-sm);\n padding: var(--ui-space-1);\n gap: 0;\n }\n\n :host {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n inline-size: max-content;\n min-inline-size: min(12rem, calc(100vw - var(--ui-menu-viewport-gap, var(--ui-space-2)) * 2));\n max-inline-size: calc(100vw - var(--ui-menu-viewport-gap, var(--ui-space-2)) * 2);\n padding: 0;\n border: 0;\n outline: 0;\n border-radius: 0;\n background: transparent;\n box-shadow: none;\n overflow: visible;\n }\n\n .surface {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n max-inline-size: inherit;\n padding: var(--ui-space-1);\n background: var(--ui-surface-elevated);\n border: 1px solid var(--ui-border-default);\n border-radius: var(--ui-radius-lg);\n box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));\n max-block-size: inherit;\n overflow: auto;\n }\n\n :host:not(:host-state([internalOpen])) {\n display: none;\n }\n\n :host[popover] {\n position: fixed;\n inset: auto;\n margin: 0;\n overflow: visible;\n max-block-size: calc(100dvh - var(--ui-menu-viewport-gap, var(--ui-space-2)) * 2);\n opacity: 0;\n transform: translateY(-4px) scale(0.99);\n transition:\n opacity var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease),\n display var(--ui-motion-fast) allow-discrete,\n overlay var(--ui-motion-fast) allow-discrete;\n }\n\n :host[popover]:popover-open {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n @starting-style {\n :host[popover]:popover-open {\n opacity: 0;\n transform: translateY(-4px) scale(0.99);\n }\n }\n\n :host[hidden] {\n display: none;\n }\n\n @media (prefers-reduced-motion: reduce) {\n :host[popover] {\n transition: none;\n }\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"select","type":"object({ value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"open","type":"object({ open: boolean, reason: action | programmatic, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-menu/ui-menu.js"},{"source":{"file":"./components/ui-popover/ui-popover.html"},"contract":{"version":1,"name":"UiPopover","tag":"ui-popover","nativeElement":"span","props":{"for":{"type":"string","required":false,"target":{"attribute":"for"},"description":"ID of the control that toggles and anchors the popover.","default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the popover is open initially or when set externally.","default":false},"placement":{"type":"string","required":false,"target":{"attribute":"placement"},"description":"Positions the surface relative to its trigger.","default":"bottom-start"}}},"template":{"kind":"element","name":"span","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"surface"}],"children":[{"kind":"slot"}]}]},"css":":host {\n box-sizing: border-box;\n max-inline-size: min(\n 20rem,\n calc(100vw - var(--ui-popover-viewport-gap, var(--ui-space-2)) * 2)\n );\n max-block-size: calc(100dvh - var(--ui-popover-viewport-gap, var(--ui-space-2)) * 2);\n overflow: visible;\n padding: 0;\n border: 0;\n outline: 0;\n border-radius: 0;\n background: transparent;\n box-shadow: none;\n }\n\n .surface {\n box-sizing: border-box;\n max-inline-size: inherit;\n max-block-size: inherit;\n overflow: auto;\n padding: var(--ui-space-3);\n background: var(--ui-surface-elevated);\n border: 1px solid var(--ui-border-default);\n border-radius: var(--ui-radius-lg);\n box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));\n }\n\n :host:not(:host-state([internalOpen])) {\n display: none;\n }\n\n :host[popover] {\n position: fixed;\n inset: auto;\n margin: 0;\n opacity: 0;\n transform: translateY(-4px) scale(0.99);\n transition:\n opacity var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease),\n display var(--ui-motion-fast) allow-discrete,\n overlay var(--ui-motion-fast) allow-discrete;\n }\n\n :host[popover]:popover-open {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n @starting-style {\n :host[popover]:popover-open {\n opacity: 0;\n transform: translateY(-4px) scale(0.99);\n }\n }\n\n :host[hidden] {\n display: none;\n }\n\n @media (prefers-reduced-motion: reduce) {\n :host[popover] {\n transition: none;\n }\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"open","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"span","choices":["span"]},"controller":"./components/ui-popover/ui-popover.js"},{"source":{"file":"./components/ui-radio-group/ui-radio-group.html"},"contract":{"version":1,"name":"UiRadioGroup","tag":"ui-radio-group","nativeElement":"fieldset","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"label":{"type":"string","required":false,"target":{"attribute":"label"},"description":"label token.","default":"Options"},"name":{"type":"string","required":false,"target":{"attribute":"name"},"description":"name token.","default":""},"orientation":{"type":{"enum":["horizontal","vertical"]},"required":false,"target":{"attribute":"orientation"},"description":"orientation token.","default":"horizontal"},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"required token.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"value token.","default":""}}},"template":{"kind":"element","name":"fieldset","attributes":[{"kind":"literal","name":"role","value":"radiogroup"}],"children":[{"kind":"element","name":"legend","attributes":[],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[]}]},{"kind":"slot"}]},"css":":host {\n display: inline-flex;\n align-items: center;\n gap: var(--ui-space-2);\n min-inline-size: 0;\n margin: 0;\n padding: 0;\n border: 0;\n }\n\n legend {\n float: inline-start;\n inline-size: 100%;\n margin: 0 0 var(--ui-space-2);\n padding: 0;\n color: var(--ui-text-primary);\n font-weight: var(--ui-font-medium);\n }\n\n legend + * {\n clear: both;\n }\n\n :host-state([orientation=\"vertical\"]) {\n display: inline-grid;\n justify-items: start;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalValue","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"event","name":"select","type":"object({ value: string, previousValue: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"change","type":"object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"fieldset","choices":["fieldset"]},"controller":"./components/ui-radio-group/ui-radio-group.js"},{"source":{"file":"./components/ui-radio/ui-radio.html"},"contract":{"version":1,"name":"UiRadio","tag":"ui-radio","nativeElement":"label","props":{"checked":{"type":"boolean","required":false,"target":{"attribute":"checked"},"description":"Whether the radio is checked initially or when set externally.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"name":{"type":"string","required":false,"target":{"attribute":"name"},"description":"name token.","default":""},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"required token.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"value token.","default":"on"}}},"template":{"kind":"element","name":"label","attributes":[],"children":[{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"radio"},{"kind":"property","key":"checked","name":"checked","expression":"internalChecked","expressionPlan":{"source":"internalChecked","ast":{"kind":"id","name":"internalChecked"},"dependencies":["internalChecked"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}},{"kind":"attribute","name":"name","expression":"name","expressionPlan":{"source":"name","ast":{"kind":"id","name":"name"},"dependencies":["name"]}}],"children":[],"ref":"input"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot"}]}]},"css":":host {\n display: inline-flex;\n align-items: flex-start;\n gap: var(--ui-radio-gap, var(--ui-space-2));\n max-inline-size: 100%;\n color: var(--ui-text-primary);\n cursor: pointer;\n }\n\n .label {\n min-inline-size: 0;\n line-height: var(--ui-line-height-md);\n }\n\n input {\n flex: 0 0 auto;\n inline-size: var(--ui-radio-size, 1.125rem);\n block-size: var(--ui-radio-size, 1.125rem);\n margin: 0.125em 0 0;\n accent-color: var(--ui-accent-solid);\n cursor: pointer;\n }\n\n input:focus-visible {\n outline: 2px solid var(--ui-focus-ring, var(--ui-accent-solid));\n outline-offset: 2px;\n }\n\n :host-state([disabled]) {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n :host-state([disabled]) input {\n cursor: not-allowed;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalChecked","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"change","type":"object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"label","choices":["label"]},"controller":"./components/ui-radio/ui-radio.js"},{"source":{"file":"./components/ui-reel/ui-reel.html"},"contract":{"version":1,"name":"UiReel","tag":"ui-reel","nativeElement":"div","props":{"gap":{"type":{"enum":["xs","s","m","l","xl"]},"required":false,"target":{"attribute":"gap"},"description":"gap token."},"itemWidth":{"type":{"enum":["sm","md","lg"]},"required":false,"target":{"attribute":"itemwidth"},"description":"itemWidth token."},"snap":{"type":{"enum":["start","center"]},"required":false,"target":{"attribute":"snap"},"description":"snap token."}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"region"},{"kind":"literal","name":"tabindex","value":"0"}],"children":[{"kind":"slot"}]},"css":":host {\n --_reel-gap: var(--ui-space-4);\n --_reel-item-width: auto;\n display: flex;\n inline-size: 100%;\n gap: var(--ui-reel-gap, var(--_reel-gap));\n min-inline-size: 0;\n max-inline-size: 100%;\n margin: 0;\n overflow-x: auto;\n overflow-y: hidden;\n overscroll-behavior-inline: contain;\n }\n\n :host > :slotted(*) {\n min-inline-size: 0;\n flex: 0 0 var(--ui-reel-item-width, var(--_reel-item-width));\n }\n\n :host-state([gap=\"xs\"]) {\n --_reel-gap: var(--ui-space-2);\n }\n :host-state([gap=\"s\"]) {\n --_reel-gap: var(--ui-space-3);\n }\n :host-state([gap=\"m\"]) {\n --_reel-gap: var(--ui-space-4);\n }\n :host-state([gap=\"l\"]) {\n --_reel-gap: var(--ui-space-5);\n }\n :host-state([gap=\"xl\"]) {\n --_reel-gap: var(--ui-space-6);\n }\n :host-state([itemWidth=\"sm\"]) {\n --_reel-item-width: 12rem;\n }\n :host-state([itemWidth=\"md\"]) {\n --_reel-item-width: 16rem;\n }\n :host-state([itemWidth=\"lg\"]) {\n --_reel-item-width: 20rem;\n }\n :host-state([snap]) {\n scroll-snap-type: inline mandatory;\n }\n :host-state([snap=\"start\"]) > :slotted(*) {\n scroll-snap-align: start;\n }\n :host-state([snap=\"center\"]) > :slotted(*) {\n scroll-snap-align: center;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-search-result-row/ui-search-result-row.html"},"contract":{"version":1,"name":"UiSearchResultRow","tag":"ui-search-result-row","nativeElement":"button","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"selected":{"type":"boolean","required":false,"target":{"attribute":"selected"},"description":"selected token.","default":false}}},"template":{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"leading"}],"children":[{"kind":"slot","fallback":[],"name":"leading"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"content"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"title"}],"children":[{"kind":"slot","fallback":[],"name":"title"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"meta"}],"children":[{"kind":"slot","fallback":[],"name":"meta"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"excerpt"}],"children":[{"kind":"slot","fallback":[],"name":"excerpt"}]}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"trailing"}],"children":[{"kind":"slot","fallback":[],"name":"trailing"}]}]},"css":":host {\n appearance: none;\n inline-size: 100%;\n min-block-size: var(--ui-search-result-row-min-height, 56px);\n margin: 0;\n padding-block: var(--ui-search-result-row-padding-block, var(--ui-space-3));\n padding-inline: var(--ui-search-result-row-padding-inline, var(--ui-space-4));\n display: flex;\n align-items: flex-start;\n gap: var(--ui-search-result-row-gap, var(--ui-space-3));\n background: var(--ui-search-result-row-surface, transparent);\n border: none;\n border-block-end: 1px solid var(--ui-search-result-row-border, var(--ui-border));\n color: inherit;\n cursor: pointer;\n text-align: left;\n transition: background-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n :host:last-child {\n border-block-end: none;\n }\n\n :host:hover:enabled {\n background: var(--ui-search-result-row-hover-surface, color-mix(in srgb, var(--ui-surface) 85%, black 3%));\n }\n\n :host-state([selected]) {\n background: var(\n --ui-search-result-row-selected-bg,\n var(--ui-search-result-row-hover-surface, color-mix(in srgb, var(--ui-surface) 85%, black 3%))\n );\n }\n\n :host:focus-visible {\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: -2px;\n }\n\n :host:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n .leading,\n .trailing {\n display: inline-flex;\n align-items: flex-start;\n flex-shrink: 0;\n }\n\n .content {\n min-inline-size: 0;\n flex: 1;\n display: flex;\n flex-direction: column;\n }\n\n .title,\n .meta,\n .excerpt {\n display: block;\n min-inline-size: 0;\n }\n\n /* An unused region takes no space. */\n .leading:empty,\n .meta:empty,\n .excerpt:empty,\n .trailing:empty {\n display: none;\n }\n\n :slotted([slot=\"title\"]),\n :slotted([slot=\"meta\"]),\n :slotted([slot=\"excerpt\"]) {\n display: block;\n margin: 0;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true,"name":"leading"},{"dynamic":false,"required":true,"name":"title"},{"dynamic":false,"required":true,"name":"meta"},{"dynamic":false,"required":true,"name":"excerpt"},{"dynamic":false,"required":true,"name":"trailing"}],"root":{"kind":"native","element":"button","choices":["button"]}},{"source":{"file":"./components/ui-search-shell/ui-search-shell.html"},"contract":{"version":1,"name":"UiSearchShell","tag":"ui-search-shell","nativeElement":"div","props":{"dismissible":{"type":"boolean","required":false,"target":{"attribute":"dismissible"},"description":"Allows Escape and backdrop activation to close the search surface.","default":false},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"Provides the native dialog's accessible name.","default":"Search"},"modal":{"type":"boolean","required":false,"target":{"attribute":"modal"},"description":"Makes the rest of the page inert while the search surface is open.","default":false},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Shows the search surface.","default":false}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"dialog","attributes":[{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"panel"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"search"}],"children":[{"kind":"slot","fallback":[],"name":"search"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"status"}],"children":[{"kind":"slot","fallback":[],"name":"status"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"body"}],"children":[{"kind":"slot","fallback":[],"name":"body"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"footer"}],"children":[{"kind":"slot","fallback":[],"name":"footer"}]}]}],"ref":"dialog"}]},"css":":host {\n display: contents;\n }\n\n dialog {\n position: fixed;\n inset: 0;\n z-index: var(--ui-search-shell-z-index, 400);\n box-sizing: border-box;\n inline-size: 100%;\n max-inline-size: none;\n block-size: 100%;\n max-block-size: none;\n margin: 0;\n padding: var(--ui-search-shell-padding-top, 10vh) var(--ui-search-shell-viewport-gap, var(--ui-space-4))\n var(--ui-search-shell-viewport-gap, var(--ui-space-4));\n overflow: auto;\n border: 0;\n background: var(--ui-overlay-backdrop);\n color: var(--ui-text-primary);\n }\n\n dialog::backdrop {\n background: var(--ui-overlay-backdrop);\n }\n\n .panel {\n position: relative;\n display: flex;\n flex-direction: column;\n inline-size: min(100%, var(--ui-search-shell-max-width, 40rem));\n max-block-size: var(--ui-search-shell-max-height, 80vh);\n margin-inline: auto;\n overflow: hidden;\n background: var(--ui-search-shell-surface, var(--ui-surface-elevated));\n border: 1px solid var(--ui-search-shell-border, var(--ui-border-default));\n border-radius: var(--ui-search-shell-radius, var(--ui-radius-dialog));\n box-shadow: var(--ui-search-shell-shadow, var(--ui-elevation-dialog, var(--ui-shadow-xl)));\n }\n\n .search {\n padding: var(--ui-space-3);\n border-block-end: 1px solid var(--ui-border-default);\n transition: border-color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* The search region shows where typing goes, whatever the author put in it. */\n .search:focus-within {\n border-block-end-color: var(--ui-search-shell-focus-color, var(--ui-control-focus));\n box-shadow: inset 0 -1px 0 var(--ui-search-shell-focus-color, var(--ui-control-focus));\n }\n\n :slotted(input[slot=\"search\"]) {\n box-sizing: border-box;\n inline-size: 100%;\n min-block-size: var(--ui-control-min-block-size);\n padding: var(--ui-space-2) var(--ui-space-3);\n border: 1px solid var(--ui-control-border);\n border-radius: var(--ui-radius-md);\n background: var(--ui-control-surface);\n color: var(--ui-text-primary);\n font: inherit;\n box-shadow: var(--ui-shadow-xs);\n }\n\n :slotted(input[slot=\"search\"]:focus-visible) {\n border-color: var(--ui-control-focus);\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: 2px;\n }\n\n .status,\n .footer {\n flex-shrink: 0;\n padding: var(--ui-space-2) var(--ui-space-4);\n color: var(--ui-text-secondary);\n font-size: var(--ui-font-size-sm);\n }\n\n .status {\n border-block-end: 1px solid var(--ui-border-default);\n }\n\n /* Laid out like the dialog's action row: actions right-aligned, spaced as buttons, no fill. */\n .footer {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: flex-end;\n gap: var(--ui-space-2);\n padding: var(--ui-space-3) var(--ui-space-4);\n border-block-start: 1px solid var(--ui-border-default);\n }\n\n .status:empty,\n .footer:empty {\n display: none;\n }\n\n .body {\n flex: 1;\n min-block-size: 0;\n overflow: auto;\n padding: var(--ui-space-2);\n }\n\n @media (max-width: 47.9375rem) {\n dialog {\n padding: 0;\n }\n\n .panel {\n inline-size: 100%;\n min-block-size: 100dvh;\n max-block-size: none;\n border: 0;\n border-radius: 0;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true,"name":"search"},{"dynamic":false,"required":true,"name":"status"},{"dynamic":false,"required":true,"name":"body"},{"dynamic":false,"required":true,"name":"footer"}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-search-shell/ui-search-shell.js"},{"source":{"file":"./components/ui-select/ui-select.html"},"contract":{"version":1,"name":"UiSelect","tag":"ui-select","nativeElement":"select","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"Prevents selection and form submission.","default":false},"invalid":{"type":"boolean","required":false,"target":{"attribute":"aria-invalid"},"description":"Exposes invalid state to assistive technology and styling.","default":false},"multiple":{"type":"boolean","required":false,"target":{"attribute":"multiple"},"description":"Allows more than one option to be selected.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"Requires a non-empty option for form validation.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"Currently selected option value."}}},"template":{"kind":"element","name":"select","attributes":[{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"multiple","expression":"multiple","expressionPlan":{"source":"multiple","ast":{"kind":"id","name":"multiple"},"dependencies":["multiple"]}},{"kind":"attribute","name":"aria-invalid","expression":"invalid","expressionPlan":{"source":"invalid","ast":{"kind":"id","name":"invalid"},"dependencies":["invalid"]}}],"children":[{"kind":"slot"}]},"css":":host {\n box-sizing: border-box;\n display: inline-block;\n inline-size: 100%;\n min-inline-size: 0;\n min-block-size: var(--ui-control-size-md);\n margin: 0;\n padding: var(--ui-space-2) var(--ui-space-3);\n border: 1px solid var(--ui-control-border, var(--ui-border-strong));\n border-radius: var(--ui-select-radius, var(--ui-radius-md));\n background-color: var(--ui-control-surface, var(--ui-surface-elevated));\n color: var(--ui-text-primary);\n color-scheme: light dark;\n font: inherit;\n line-height: var(--ui-line-height-md);\n box-shadow: var(--ui-select-shadow, var(--ui-control-inset));\n transition:\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease),\n background-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* Single selects draw their own chevron: the native caret cannot be inset or sized consistently.\n * The root stays a native <s-lect>, so the icon is a background image rather than an element. */\n :host:not([multiple]) {\n appearance: none;\n padding-inline-end: calc(var(--ui-space-3) + 1.5rem);\n background-image: var(\n --ui-select-chevron,\n url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235c5c58' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\")\n );\n background-repeat: no-repeat;\n background-position: right var(--ui-space-3) center;\n background-size: 1.125rem 1.125rem;\n }\n\n :host:hover:not(:focus):not(:disabled) {\n border-color: var(--ui-control-border-hover, var(--ui-text-secondary));\n }\n\n :host:focus-visible {\n border-color: var(--ui-control-focus, var(--ui-accent-solid));\n outline: none;\n box-shadow: var(--ui-select-focus-shadow, var(--ui-control-inset), var(--ui-control-focus-halo-shadow));\n }\n\n /* The app's invalid flag, or the browser's own verdict once the user has left an invalid field. */\n :host[aria-invalid=\"true\"],\n :host:user-invalid {\n border-color: var(--ui-danger-solid);\n }\n\n :host:is([aria-invalid=\"true\"], :user-invalid):focus-visible {\n box-shadow:\n var(--ui-control-inset),\n 0 0 0 3px color-mix(in srgb, var(--ui-danger-solid) 22%, transparent);\n }\n\n :host:disabled {\n background-color: var(--ui-control-surface-disabled, var(--ui-surface-muted));\n color: var(--ui-text-muted);\n box-shadow: none;\n cursor: not-allowed;\n }\n\n :host[multiple],\n :host[size]:not([size=\"1\"]) {\n min-block-size: 7rem;\n padding: var(--ui-space-2);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"select","choices":["select"]},"controller":"./components/ui-select/ui-select.js"},{"source":{"file":"./components/ui-separator/ui-separator.html"},"contract":{"version":1,"name":"UiSeparator","tag":"ui-separator","nativeElement":"hr","props":{"orientation":{"type":{"enum":["horizontal","vertical"]},"required":false,"target":{"attribute":"aria-orientation"},"description":"Whether the separator divides stacked content (horizontal) or inline content (vertical).","default":"horizontal"}}},"template":{"kind":"element","name":"hr","attributes":[{"kind":"attribute","name":"aria-orientation","expression":"orientation","expressionPlan":{"source":"orientation","ast":{"kind":"id","name":"orientation"},"dependencies":["orientation"]}}],"children":[]},"css":"hr {\n box-sizing: border-box;\n align-self: stretch;\n margin: 0;\n border: 0;\n border-block-start: 1px solid var(--ui-separator-color, var(--ui-border-default));\n }\n\n hr[aria-orientation=\"vertical\"] {\n block-size: auto;\n border-block-start: 0;\n border-inline-start: 1px solid var(--ui-separator-color, var(--ui-border-default));\n }","declarations":[],"slots":[],"root":{"kind":"native","element":"hr","choices":["hr"]}},{"source":{"file":"./components/ui-sidebar/ui-sidebar.html"},"contract":{"version":1,"name":"UiSidebar","tag":"ui-sidebar","nativeElement":"aside","props":{"breakpoint":{"type":{"enum":["sm","md","lg"]},"required":false,"target":{"attribute":"breakpoint"},"description":"Below this viewport width (40rem, 48rem, 64rem) the sidebar becomes an off-canvas drawer, closed until toggled.","default":"md"},"collapsed":{"type":"boolean","required":false,"target":{"attribute":"collapsed"},"description":"Whether the docked sidebar is collapsed.","default":false},"maxWidth":{"type":"number","required":false,"target":{"attribute":"maxwidth"},"description":"The widest width the resize handle allows, in pixels.","default":480},"minWidth":{"type":"number","required":false,"target":{"attribute":"minwidth"},"description":"The narrowest width the resize handle allows, in pixels.","default":200},"resizable":{"type":"boolean","required":false,"target":{"attribute":"resizable"},"description":"Adds a resize handle on the inner edge (drag, or arrow keys, Home, and End).","default":false},"resizeLabel":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"Accessible name of the resize handle.","default":"Resize sidebar"},"resizeStep":{"type":"number","required":false,"target":{"attribute":"resizestep"},"description":"Arrow-key resize step in pixels.","default":16},"side":{"type":{"enum":["start","end"]},"required":false,"target":{"attribute":"side"},"description":"The edge the sidebar sits on. The page places it beside its main content.","default":"start"},"width":{"type":"number","required":false,"target":{"attribute":"width"},"description":"Docked width in pixels. 0 uses --ui-sidebar-width (280px by default); dragging the handle updates it.","default":0}}},"template":{"kind":"element","name":"aside","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"content"}],"children":[{"kind":"slot"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"resizer"},{"kind":"literal","name":"role","value":"separator"},{"kind":"literal","name":"aria-orientation","value":"vertical"},{"kind":"literal","name":"tabindex","value":"0"},{"kind":"literal","name":"data-ui-affordance","value":"resize"},{"kind":"attribute","name":"aria-label","expression":"resizeLabel","expressionPlan":{"source":"resizeLabel","ast":{"kind":"id","name":"resizeLabel"},"dependencies":["resizeLabel"]}},{"kind":"attribute","name":"hidden","expression":"not resizable or drawer or internalCollapsed","expressionPlan":{"source":"not resizable or drawer or internalCollapsed","ast":{"kind":"binary","op":"or","left":{"kind":"binary","op":"or","left":{"kind":"unary","op":"not","operand":{"kind":"id","name":"resizable"}},"right":{"kind":"id","name":"drawer"}},"right":{"kind":"id","name":"internalCollapsed"}},"dependencies":["drawer","internalCollapsed","resizable"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"guide"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]}],"ref":"resizer"}]},"css":":host {\n position: relative;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n flex: none;\n inline-size: var(--_sidebar-width, var(--ui-sidebar-width, 280px));\n max-inline-size: 100%;\n min-block-size: 0;\n background: var(--ui-sidebar-surface, var(--ui-surface-default));\n border-inline-end: 1px solid var(--ui-sidebar-border, var(--ui-border-default));\n }\n\n :host-state([side=\"end\"]) {\n border-inline-end: 0;\n border-inline-start: 1px solid var(--ui-sidebar-border, var(--ui-border-default));\n }\n\n .content {\n flex: 1;\n min-block-size: 0;\n overflow: auto;\n }\n\n /* Collapsed while docked. */\n :host-state([internalCollapsed]):not([popover]) {\n display: none;\n }\n\n .resizer {\n position: absolute;\n z-index: 1;\n inset-block: 0;\n /* On the panel's inner edge: the end edge of a start sidebar. */\n inset-inline-end: 0;\n inline-size: 8px;\n min-inline-size: 8px;\n transform: translateX(50%);\n cursor: col-resize;\n touch-action: none;\n outline: none;\n }\n\n .resizer[hidden] {\n display: none;\n }\n\n :host-state([side=\"end\"]) .resizer {\n inset-inline-end: auto;\n inset-inline-start: 0;\n transform: translateX(-50%);\n }\n\n .resizer::after {\n content: \"\";\n position: absolute;\n inset-block: 0;\n inset-inline-start: 3px;\n inline-size: 2px;\n background: color-mix(in srgb, var(--ui-affordance-guide-color, var(--ui-border-strong)) 45%, transparent);\n opacity: var(--ui-affordance-guide-opacity);\n transition:\n background-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n }\n\n .guide {\n position: absolute;\n inset-block-start: 50%;\n inset-inline-start: 50%;\n inline-size: 6px;\n block-size: 22px;\n border: 1px solid var(--ui-border-strong);\n border-radius: var(--ui-radius-round);\n background: var(--ui-surface-elevated);\n opacity: 0;\n transform: translate(-50%, -50%);\n transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n pointer-events: none;\n }\n\n .resizer:is(:hover, :focus-visible)::after {\n background: var(--ui-affordance-direct-color, var(--ui-accent-solid, var(--ui-focus-ring)));\n opacity: 1;\n }\n\n .resizer:is(:hover, :focus-visible) > .guide {\n opacity: 1;\n }\n\n /* Drawer: a popover in the top layer, sliding in from its edge. Closed popovers are hidden by the UA. */\n :host[popover] {\n position: fixed;\n inset-block: 0;\n inset-inline-start: 0;\n inset-inline-end: auto;\n margin: 0;\n padding: 0;\n inline-size: min(var(--_sidebar-width, var(--ui-sidebar-width, 280px)), 85vw);\n max-block-size: none;\n block-size: 100dvh;\n border-block: 0;\n box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));\n transform: translateX(0);\n transition:\n transform var(--ui-motion-base) var(--ui-motion-ease-out),\n display var(--ui-motion-base) allow-discrete,\n overlay var(--ui-motion-base) allow-discrete;\n }\n\n /* The author display above would otherwise override the UA rule that hides a closed popover. */\n :host[popover]:not(:popover-open) {\n display: none;\n transform: translateX(-100%);\n }\n\n :host-state([side=\"end\"])[popover] {\n inset-inline-start: auto;\n inset-inline-end: 0;\n }\n\n :host-state([side=\"end\"])[popover]:not(:popover-open) {\n transform: translateX(100%);\n }\n\n @starting-style {\n :host[popover]:popover-open {\n transform: translateX(-100%);\n }\n :host-state([side=\"end\"])[popover]:popover-open {\n transform: translateX(100%);\n }\n }\n\n :host[popover]::backdrop {\n background: var(--ui-sidebar-backdrop, rgb(0 0 0 / 0.32));\n }\n\n @media (prefers-reduced-motion: reduce) {\n :host[popover] {\n transition: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalCollapsed","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"drawer","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"resize","type":"object({ width: number, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"toggle","type":"object({ open: boolean, mode: docked | drawer, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"aside","choices":["aside"]},"controller":"./components/ui-sidebar/ui-sidebar.js"},{"source":{"file":"./components/ui-stack/ui-stack.html"},"contract":{"version":1,"name":"UiStack","tag":"ui-stack","nativeElement":"div","props":{"align":{"type":{"enum":["start","center","end","stretch"]},"required":false,"target":{"attribute":"align"},"description":"align token."},"gap":{"type":{"enum":["xs","s","m","l","xl"]},"required":false,"target":{"attribute":"gap"},"description":"gap token."},"justify":{"type":{"enum":["start","center","end","between"]},"required":false,"target":{"attribute":"justify"},"description":"justify token."}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n --_layout-gap: var(--ui-space-4);\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: var(--ui-stack-gap, var(--_layout-gap));\n min-inline-size: 0;\n max-inline-size: 100%;\n margin: 0;\n }\n\n :host-state([gap=\"xs\"]) {\n --_layout-gap: var(--ui-space-2);\n }\n :host-state([gap=\"s\"]) {\n --_layout-gap: var(--ui-space-3);\n }\n :host-state([gap=\"m\"]) {\n --_layout-gap: var(--ui-space-4);\n }\n :host-state([gap=\"l\"]) {\n --_layout-gap: var(--ui-space-5);\n }\n :host-state([gap=\"xl\"]) {\n --_layout-gap: var(--ui-space-6);\n }\n :host-state([align=\"start\"]) {\n align-items: flex-start;\n }\n :host-state([align=\"center\"]) {\n align-items: center;\n }\n :host-state([align=\"end\"]) {\n align-items: flex-end;\n }\n :host-state([justify=\"center\"]) {\n justify-content: center;\n }\n :host-state([justify=\"end\"]) {\n justify-content: flex-end;\n }\n :host-state([justify=\"between\"]) {\n justify-content: space-between;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-switch/ui-switch.html"},"contract":{"version":1,"name":"UiSwitch","tag":"ui-switch","nativeElement":"label","props":{"checked":{"type":"boolean","required":false,"target":{"attribute":"checked"},"description":"Whether the switch is checked initially or when set externally.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"required token.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"value token.","default":"on"}}},"template":{"kind":"element","name":"label","attributes":[],"children":[{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"checkbox"},{"kind":"literal","name":"role","value":"switch"},{"kind":"property","key":"checked","name":"checked","expression":"internalChecked","expressionPlan":{"source":"internalChecked","ast":{"kind":"id","name":"internalChecked"},"dependencies":["internalChecked"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}}],"children":[],"ref":"input"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot"}]}]},"css":":host {\n display: inline-flex;\n align-items: flex-start;\n gap: var(--ui-switch-gap, var(--ui-space-2));\n max-inline-size: 100%;\n color: var(--ui-text-primary);\n cursor: pointer;\n }\n\n .label {\n min-inline-size: 0;\n line-height: var(--ui-line-height-md);\n }\n\n input {\n appearance: none;\n -webkit-appearance: none;\n position: relative;\n flex: 0 0 auto;\n width: var(--ui-switch-track-width, 2.5rem);\n height: var(--ui-switch-track-height, 1.5rem);\n padding: 0;\n border: 1px solid var(--ui-control-border-hover, var(--ui-border-strong));\n border-radius: 999px;\n background: var(--ui-control-surface, var(--ui-surface-default));\n box-shadow: inset 0 1px 2px color-mix(in srgb, var(--ui-text-primary) 10%, transparent);\n cursor: pointer;\n transition: background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease);\n margin: 0;\n }\n\n input::after {\n content: \"\";\n position: absolute;\n top: 3px;\n left: 3px;\n width: 1rem;\n height: 1rem;\n border-radius: 999px;\n background: var(--ui-text-secondary);\n box-shadow: var(--ui-shadow-xs);\n transition: transform var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n input:checked {\n background: var(--ui-accent-solid);\n border-color: var(--ui-accent-solid);\n }\n\n input:checked::after {\n transform: translateX(1rem);\n background: var(--ui-text-on-accent);\n }\n\n input:focus-visible {\n outline: 2px solid var(--ui-focus-ring, var(--ui-accent-solid));\n outline-offset: 2px;\n }\n\n :host-state([disabled]) {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n :host-state([disabled]) input {\n border-color: var(--ui-border-default);\n background: var(--ui-control-surface-disabled, var(--ui-surface-muted));\n cursor: not-allowed;\n }\n\n @media (prefers-reduced-motion: reduce) {\n input, input::after {\n transition: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalChecked","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"change","type":"object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"label","choices":["label"]},"controller":"./components/ui-switch/ui-switch.js"},{"source":{"file":"./components/ui-switcher/ui-switcher.html"},"contract":{"version":1,"name":"UiSwitcher","tag":"ui-switcher","nativeElement":"div","props":{"align":{"type":{"enum":["start","center","end","stretch"]},"required":false,"target":{"attribute":"align"},"description":"align token."},"gap":{"type":{"enum":["xs","s","m","l","xl"]},"required":false,"target":{"attribute":"gap"},"description":"gap token."},"threshold":{"type":{"enum":["xs","sm","md","lg"]},"required":false,"target":{"attribute":"threshold"},"description":"threshold token."}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n --_switcher-gap: var(--ui-space-4);\n display: flex;\n flex-wrap: wrap;\n gap: var(--ui-switcher-gap, var(--_switcher-gap));\n min-inline-size: 0;\n max-inline-size: 100%;\n margin: 0;\n }\n\n :host > :slotted(*) {\n min-inline-size: 0;\n flex-grow: 1;\n /* The large multiplier makes the basis flip as a group at the intrinsic threshold. */\n flex-basis: calc((var(--ui-switcher-threshold, 30rem) - 100%) * 999);\n }\n\n :host-state([gap=\"xs\"]) {\n --_switcher-gap: var(--ui-space-2);\n }\n :host-state([gap=\"s\"]) {\n --_switcher-gap: var(--ui-space-3);\n }\n :host-state([gap=\"m\"]) {\n --_switcher-gap: var(--ui-space-4);\n }\n :host-state([gap=\"l\"]) {\n --_switcher-gap: var(--ui-space-5);\n }\n :host-state([gap=\"xl\"]) {\n --_switcher-gap: var(--ui-space-6);\n }\n :host-state([threshold=\"xs\"]) > :slotted(*) {\n flex-basis: calc((var(--ui-switcher-threshold, 20rem) - 100%) * 999);\n }\n :host-state([threshold=\"md\"]) > :slotted(*) {\n flex-basis: calc((var(--ui-switcher-threshold, 45rem) - 100%) * 999);\n }\n :host-state([threshold=\"lg\"]) > :slotted(*) {\n flex-basis: calc((var(--ui-switcher-threshold, 60rem) - 100%) * 999);\n }\n :host-state([align=\"start\"]) {\n align-items: flex-start;\n }\n :host-state([align=\"center\"]) {\n align-items: center;\n }\n :host-state([align=\"end\"]) {\n align-items: flex-end;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-tabs/ui-tabs.html"},"contract":{"version":1,"name":"UiTabs","tag":"ui-tabs","nativeElement":"div","props":{"density":{"type":{"enum":["comfortable","compact"]},"required":false,"target":{"attribute":"density"},"description":"Compact trades padding and type size for rows that fit more on screen.","default":"comfortable"},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"label token.","default":"Tabs"},"orientation":{"type":{"enum":["horizontal","vertical"]},"required":false,"target":{"attribute":"aria-orientation"},"description":"orientation token.","default":"horizontal"},"stretch":{"type":"boolean","required":false,"target":{"attribute":"stretch"},"description":"Share the full width of the tab list equally between tabs instead of sizing each to its label.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"value token.","default":""}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"list"},{"kind":"literal","name":"role","value":"tablist"},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}},{"kind":"attribute","name":"aria-orientation","expression":"orientation","expressionPlan":{"source":"orientation","ast":{"kind":"id","name":"orientation"},"dependencies":["orientation"]}}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"role","value":"tab"},{"kind":"attribute","name":"id","expression":"format('%s-tab', tab.id)","expressionPlan":{"source":"format('%s-tab', tab.id)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-tab"},{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"}]},"dependencies":["tab.id"]}},{"kind":"attribute","name":"value","expression":"tab.id","expressionPlan":{"source":"tab.id","ast":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},"dependencies":["tab.id"]}},{"kind":"attribute","name":"aria-controls","expression":"tab.id","expressionPlan":{"source":"tab.id","ast":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},"dependencies":["tab.id"]}},{"kind":"attribute","name":"aria-selected","expression":"tab.id = internalValue","expressionPlan":{"source":"tab.id = internalValue","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},"right":{"kind":"id","name":"internalValue"}},"dependencies":["internalValue","tab.id"]}},{"kind":"directive","name":"value","expression":"tab.label","expressionPlan":{"source":"tab.label","ast":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"label"},"dependencies":["tab.label"]}}],"children":[],"flow":{"kind":"each","item":"tab","list":"tabs","listPlan":{"source":"tabs","ast":{"kind":"id","name":"tabs"},"dependencies":["tabs"]},"key":"tab.id","keyPlan":{"source":"tab.id","ast":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},"dependencies":["tab.id"]}}}],"ref":"list"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"panels"}],"children":[{"kind":"slot"}],"ref":"panels"}]},"css":"/* Density resolves into the tab row's own values; the public tokens still override them. */\n :host {\n --_tab-min-block-size: var(--ui-control-size);\n --_tab-padding-block: var(--ui-space-2);\n --_tab-padding-inline: var(--ui-space-3);\n }\n\n :host-state([density=\"compact\"]) {\n --_tab-min-block-size: var(--ui-control-size-sm);\n --_tab-padding-block: var(--ui-space-1);\n --_tab-padding-inline: var(--ui-space-2);\n }\n\n :host {\n display: grid;\n inline-size: 100%;\n min-inline-size: 0;\n }\n\n .list {\n display: grid;\n grid-auto-flow: column;\n grid-auto-columns: max-content;\n justify-content: start;\n inline-size: 100%;\n max-inline-size: 100%;\n /* Tabs that do not fit scroll sideways rather than wrapping or squeezing. */\n overflow-x: auto;\n /* overflow-x: auto would make the block axis scrollable too; a sideways swipe must not scroll the\n strip or the page vertically. */\n overflow-y: hidden;\n overscroll-behavior: contain;\n scrollbar-width: thin;\n border-block-end: 1px solid var(--ui-border-default);\n }\n\n .list button {\n min-block-size: var(--ui-tabs-tab-min-block-size, var(--_tab-min-block-size));\n margin: 0 0 -1px;\n padding: var(--ui-tabs-tab-padding-block, var(--_tab-padding-block)) var(--ui-tabs-tab-padding-inline, var(--_tab-padding-inline));\n border: 0;\n border-block-end: 2px solid transparent;\n background: transparent;\n color: var(--ui-text-secondary);\n font: inherit;\n font-size: var(--ui-font-size-sm);\n font-weight: var(--ui-font-medium);\n cursor: pointer;\n transition:\n color var(--ui-motion-fast) var(--ui-motion-ease),\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n border-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high. */\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high.\n * Trimming applies to block containers, so the box is a block with centred content. */\n @supports (text-box-trim: trim-both) {\n .list button {\n display: block;\n text-align: center;\n align-content: center;\n text-box-trim: trim-both;\n text-box-edge: cap alphabetic;\n }\n }\n\n :host-state([stretch]) .list {\n grid-auto-columns: minmax(max-content, 1fr);\n }\n\n .list button {\n white-space: nowrap;\n }\n\n .list button:hover {\n color: var(--ui-text-primary);\n background: var(--ui-surface-muted);\n }\n .list button[aria-selected=\"true\"] {\n color: var(--ui-accent-solid);\n border-block-end-color: var(--ui-accent-solid);\n }\n .list button:focus-visible {\n position: relative;\n outline: none;\n box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--ui-focus-ring) 45%, transparent);\n border-radius: var(--ui-radius-sm);\n }\n\n .panels {\n min-inline-size: 0;\n }\n :slotted(*) {\n padding: var(--ui-space-4);\n }\n\n :host-state([orientation=\"vertical\"]) {\n grid-template-columns: max-content minmax(0, 1fr);\n align-items: start;\n }\n\n :host-state([orientation=\"vertical\"]) .list {\n grid-auto-flow: row;\n grid-auto-columns: auto;\n border-block-end: 0;\n border-inline-end: 1px solid var(--ui-border-default);\n }\n\n :host-state([orientation=\"vertical\"]) .list button {\n margin: 0 -1px 0 0;\n border-block-end: 0;\n border-inline-end: 2px solid transparent;\n text-align: start;\n }\n\n :host-state([orientation=\"vertical\"]) .list button[aria-selected=\"true\"] {\n border-inline-end-color: var(--ui-accent-solid);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .list button {\n transition: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalValue","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"tabs","type":"list(object({ id: string, label: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"event","name":"select","type":"object({ value: string, previousValue: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-tabs/ui-tabs.js"},{"source":{"file":"./components/ui-textarea/ui-textarea.html"},"contract":{"version":1,"name":"UiTextarea","tag":"ui-textarea","nativeElement":"textarea","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"Prevents editing and form submission.","default":false},"invalid":{"type":"boolean","required":false,"target":{"attribute":"aria-invalid"},"description":"Exposes invalid state to assistive technology and styling.","default":false},"readonly":{"type":"boolean","required":false,"target":{"attribute":"readonly"},"description":"Allows selection without allowing edits.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"Marks the control as required for form validation.","default":false},"rows":{"type":{"kind":"terminal","name":"integer"},"required":false,"target":{"attribute":"rows"},"description":"Initial number of visible text rows.","default":4},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"Current text value."}}},"template":{"kind":"element","name":"textarea","attributes":[{"kind":"attribute","name":"value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"readonly","expression":"readonly","expressionPlan":{"source":"readonly","ast":{"kind":"id","name":"readonly"},"dependencies":["readonly"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"aria-invalid","expression":"invalid","expressionPlan":{"source":"invalid","ast":{"kind":"id","name":"invalid"},"dependencies":["invalid"]}},{"kind":"attribute","name":"rows","expression":"rows","expressionPlan":{"source":"rows","ast":{"kind":"id","name":"rows"},"dependencies":["rows"]}}],"children":[]},"css":":host {\n box-sizing: border-box;\n display: inline-block;\n inline-size: 100%;\n min-inline-size: 0;\n min-block-size: calc(3rem * 2);\n margin: 0;\n padding: var(--ui-space-2) var(--ui-space-3);\n appearance: none;\n resize: vertical;\n border: 1px solid var(--ui-control-border, var(--ui-border-strong));\n border-radius: var(--ui-textarea-radius, var(--ui-radius-md));\n background: var(--ui-control-surface, var(--ui-surface-elevated));\n color: var(--ui-text-primary);\n font: inherit;\n line-height: var(--ui-line-height-md);\n box-shadow: var(--ui-textarea-shadow, var(--ui-control-inset));\n transition:\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease),\n background-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* Tabbing into a field selects its text; tint that selection softly instead of the page highlight. */\n :host::selection {\n background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);\n color: inherit;\n }\n\n :host::placeholder {\n color: var(--ui-control-placeholder, var(--ui-text-secondary));\n opacity: 1;\n }\n\n :host:hover:not(:focus):not(:disabled) {\n border-color: var(--ui-control-border-hover, var(--ui-text-secondary));\n }\n\n :host:focus-visible {\n border-color: var(--ui-control-focus, var(--ui-accent-solid));\n outline: none;\n box-shadow: var(--ui-textarea-focus-shadow, var(--ui-control-inset), var(--ui-control-focus-halo-shadow));\n }\n\n /* The app's invalid flag, or the browser's own verdict once the user has left an invalid field. */\n :host[aria-invalid=\"true\"],\n :host:user-invalid {\n border-color: var(--ui-danger-solid);\n }\n\n :host:is([aria-invalid=\"true\"], :user-invalid):focus-visible {\n box-shadow:\n var(--ui-control-inset),\n 0 0 0 3px color-mix(in srgb, var(--ui-danger-solid) 22%, transparent);\n }\n\n :host:disabled {\n background: var(--ui-control-surface-disabled, var(--ui-surface-muted));\n color: var(--ui-text-muted);\n box-shadow: none;\n cursor: not-allowed;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[],"root":{"kind":"native","element":"textarea","choices":["textarea"]},"controller":"./components/ui-textarea/ui-textarea.js"},{"source":{"file":"./components/ui-toast-region/ui-toast-region.html"},"contract":{"version":1,"name":"UiToastRegion","tag":"ui-toast-region","nativeElement":"div","props":{"auto":{"type":"boolean","required":false,"target":{"attribute":"auto"},"description":"Dismiss each message automatically after its duration. Timers pause while the pointer or focus is on a message.","default":false},"duration":{"type":"number","required":false,"target":{"attribute":"duration"},"description":"Milliseconds an automatically dismissed message stays visible.","default":5000},"message":{"type":"string","required":false,"target":{"attribute":"message"},"description":"Fallback message used by the declarative show command.","default":"Notification"},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the messages authored inside the region are visible.","default":false}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"region"},{"kind":"literal","name":"aria-label","value":"Notifications"},{"kind":"literal","name":"aria-live","value":"polite"},{"kind":"literal","name":"popover","value":"manual"}],"children":[{"kind":"slot"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"toast"},{"kind":"attribute","name":"closing","expression":"toast.closing","expressionPlan":{"source":"toast.closing","ast":{"kind":"member","object":{"kind":"id","name":"toast"},"key":"closing"},"dependencies":["toast.closing"]},"target":"class"},{"kind":"attribute","name":"id","expression":"toast.id","expressionPlan":{"source":"toast.id","ast":{"kind":"member","object":{"kind":"id","name":"toast"},"key":"id"},"dependencies":["toast.id"]}},{"kind":"attribute","name":"role","expression":"toast.role","expressionPlan":{"source":"toast.role","ast":{"kind":"member","object":{"kind":"id","name":"toast"},"key":"role"},"dependencies":["toast.role"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"message"},{"kind":"directive","name":"value","expression":"toast.message","expressionPlan":{"source":"toast.message","ast":{"kind":"member","object":{"kind":"id","name":"toast"},"key":"message"},"dependencies":["toast.message"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"dismiss"},{"kind":"attribute","name":"data-toast","expression":"toast.id","expressionPlan":{"source":"toast.id","ast":{"kind":"member","object":{"kind":"id","name":"toast"},"key":"id"},"dependencies":["toast.id"]}}],"children":[{"kind":"element","name":"ui-icon-button","attributes":[{"kind":"literal","name":"size","value":"sm"},{"kind":"literal","name":"variant","value":"ghost"},{"kind":"attribute","name":"round","expression":"true","expressionPlan":{"source":"true","ast":{"kind":"literal","value":true},"dependencies":[]}},{"kind":"attribute","name":"label","expression":"format('Dismiss %s', toast.message)","expressionPlan":{"source":"format('Dismiss %s', toast.message)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"Dismiss %s"},{"kind":"member","object":{"kind":"id","name":"toast"},"key":"message"}]},"dependencies":["toast.message"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M18 6 6 18M6 6l12 12"}],"children":[]}]}]}]}],"flow":{"kind":"each","item":"toast","list":"toasts","listPlan":{"source":"toasts","ast":{"kind":"id","name":"toasts"},"dependencies":["toasts"]},"key":"toast.id","keyPlan":{"source":"toast.id","ast":{"kind":"member","object":{"kind":"id","name":"toast"},"key":"id"},"dependencies":["toast.id"]}}}]},"css":":host {\n position: fixed;\n top: calc(var(--ui-space-4) + env(safe-area-inset-top));\n right: auto;\n bottom: auto;\n left: 50%;\n transform: translateX(-50%);\n z-index: 9999;\n display: grid;\n gap: var(--ui-space-2);\n inline-size: min(24rem, calc(100vw - var(--ui-space-4) * 2));\n max-inline-size: 100%;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n overflow: visible;\n border: 0;\n outline: 0;\n background: transparent;\n box-shadow: none;\n pointer-events: none;\n }\n\n :host:not(:popover-open) {\n display: none;\n }\n\n :host > .toast,\n :host > :slotted(*) {\n pointer-events: auto;\n }\n\n .toast {\n display: grid;\n grid-template-columns: 1fr auto;\n gap: var(--ui-space-2);\n align-items: start;\n border: 1px solid var(--ui-border-default);\n border-radius: var(--ui-radius-lg);\n padding: var(--ui-space-3) var(--ui-space-4);\n background: var(--ui-surface-elevated);\n color: var(--ui-text-primary);\n box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));\n animation: ui-toast-enter var(--ui-toast-region-enter-duration, 0.32s) var(--ui-motion-ease-out, cubic-bezier(0.16, 1, 0.3, 1)) both;\n }\n\n /* Leaving slides on down and fades; the controller removes the toast when this ends. */\n .toast.closing {\n animation: ui-toast-exit var(--ui-toast-region-exit-duration, 0.22s) var(--ui-motion-ease) both;\n pointer-events: none;\n }\n\n @keyframes ui-toast-enter {\n from {\n opacity: 0;\n transform: translateY(-1rem);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n @keyframes ui-toast-exit {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n to {\n opacity: 0;\n transform: translateY(0.75rem);\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n .toast, .toast.closing {\n animation: none;\n }\n }\n\n .message {\n min-inline-size: 0;\n align-self: center;\n }\n\n .dismiss {\n align-self: center;\n margin-inline-end: calc(var(--ui-space-2) * -1);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"toasts","type":"list(object({ id: string, message: string, role: alert | status, closing: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | timeout | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"dismiss","type":"object({ id: string, reason: action | timeout, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"method","name":"show","exportName":"show","returns":"promise(string)"}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-toast-region/ui-toast-region.js"},{"source":{"file":"./components/ui-tooltip/ui-tooltip.html"},"contract":{"version":1,"name":"UiTooltip","tag":"ui-tooltip","nativeElement":"span","props":{"for":{"type":"string","required":false,"target":{"attribute":"for"},"description":"ID of the control described and visually anchored by the tooltip.","default":""},"hideDelay":{"type":"number","required":false,"target":{"attribute":"hidedelay"},"description":"Waits this many milliseconds before hiding after pointer exit.","default":100},"inverse":{"type":"boolean","required":false,"target":{"attribute":"inverse"},"description":"Use the high-contrast inverse surface (dark on light themes, light on dark themes).","default":false},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the tooltip is open initially or when set externally.","default":false},"placement":{"type":"string","required":false,"target":{"attribute":"placement"},"description":"Positions the description relative to its trigger.","default":"top-start"},"showDelay":{"type":"number","required":false,"target":{"attribute":"showdelay"},"description":"Waits this many milliseconds before showing after pointer entry.","default":500},"trigger":{"type":{"enum":["hover","click","focus"]},"required":false,"target":{"attribute":"trigger"},"description":"How the trigger opens it. hover also opens on keyboard focus; click toggles it and suits a help button, where hovering a question mark says nothing; focus\n opens only while the trigger holds focus.","default":"hover"}}},"template":{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"role","value":"tooltip"},{"kind":"attribute","name":"hidden","expression":"not internalOpen","expressionPlan":{"source":"not internalOpen","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"internalOpen"}},"dependencies":["internalOpen"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"surface"}],"children":[{"kind":"slot"}]}]},"css":":host {\n position: fixed;\n inset: auto;\n margin: 0;\n display: inline-block;\n box-sizing: border-box;\n padding: 0;\n border: 0;\n outline: 0;\n border-radius: 0;\n background: transparent;\n /* The UA popover default (overflow: auto) would clip the arrow. */\n overflow: visible;\n opacity: 0;\n transform: translateY(4px);\n transition:\n opacity var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease),\n display var(--ui-motion-fast) allow-discrete,\n overlay var(--ui-motion-fast) allow-discrete;\n }\n\n .surface {\n --_tooltip-line: var(--ui-tooltip-border, var(--ui-border-default));\n position: relative;\n box-sizing: border-box;\n max-inline-size: var(--ui-tooltip-max-inline-size, 18rem);\n border: 1px solid var(--_tooltip-line);\n border-radius: var(--ui-tooltip-radius, var(--ui-radius-sm));\n background: var(--ui-tooltip-surface, var(--ui-surface-elevated));\n color: var(--ui-tooltip-text, var(--ui-text-primary));\n padding: var(--ui-space-1) var(--ui-space-2);\n font-family: var(--ui-font-family-sans);\n font-size: var(--ui-font-size-sm);\n line-height: var(--ui-line-height-tight);\n box-shadow: var(--ui-tooltip-shadow, var(--ui-elevation-tooltip, var(--ui-shadow-md)));\n }\n\n :host-state([inverse]) .surface {\n --_tooltip-line: var(--ui-tooltip-inverse-surface, var(--ui-text-primary));\n background: var(--ui-tooltip-inverse-surface, var(--ui-text-primary));\n color: var(--ui-tooltip-inverse-text, var(--ui-surface-default));\n }\n\n /* A rotated square shares the surface fill and draws the two outward border edges. Its centre sits on\n * the surface border line, so the fill covers that stretch of border and the outline runs unbroken. */\n .surface::after {\n content: \"\";\n position: absolute;\n z-index: 1;\n inset-inline-start: var(--ui-space-3);\n inset-block-end: calc(var(--ui-tooltip-arrow-size, 0.5rem) / -2 - 0.5px);\n inline-size: var(--ui-tooltip-arrow-size, 0.5rem);\n block-size: var(--ui-tooltip-arrow-size, 0.5rem);\n box-sizing: border-box;\n background: inherit;\n border: 0 solid var(--_tooltip-line);\n border-inline-end-width: 1px;\n border-block-end-width: 1px;\n border-end-end-radius: 1px;\n transform: rotate(45deg);\n }\n\n :is(:host-state([placement=\"bottom\"]), :host-state([placement=\"bottom-start\"]), :host-state([placement=\"bottom-end\"])) .surface::after {\n inset-block-start: calc(var(--ui-tooltip-arrow-size, 0.5rem) / -2 - 0.5px);\n inset-block-end: auto;\n border-inline-end-width: 0;\n border-block-end-width: 0;\n border-inline-start-width: 1px;\n border-block-start-width: 1px;\n border-end-end-radius: 0;\n border-start-start-radius: 1px;\n }\n\n :is(:host-state([placement=\"top-end\"]), :host-state([placement=\"bottom-end\"])) .surface::after {\n inset-inline-start: auto;\n inset-inline-end: var(--ui-space-3);\n }\n\n :host:popover-open {\n opacity: 1;\n transform: translateY(0);\n }\n\n @starting-style {\n :host:popover-open {\n opacity: 0;\n transform: translateY(4px);\n }\n }\n\n :host[hidden] {\n display: none;\n }\n\n @media (prefers-reduced-motion: reduce) {\n :host {\n transition: none;\n }\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"open","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"span","choices":["span"]},"controller":"./components/ui-tooltip/ui-tooltip.js"},{"source":{"file":"./components/ui-top-bar/ui-top-bar.html"},"contract":{"version":1,"name":"UiTopBar","tag":"ui-top-bar","nativeElement":"header","props":{}},"template":{"kind":"element","name":"header","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"leading"}],"children":[{"kind":"slot","fallback":[],"name":"leading"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"title"}],"children":[{"kind":"slot"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"search"}],"children":[{"kind":"slot","fallback":[],"name":"search"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"actions"}],"children":[{"kind":"slot","fallback":[],"name":"actions"}]}]},"css":":host {\n position: sticky;\n inset-block-start: 0;\n z-index: var(--ui-top-bar-z-index, 100);\n min-block-size: calc(var(--ui-top-bar-height, 56px) + env(safe-area-inset-top));\n display: flex;\n align-items: center;\n gap: var(--ui-top-bar-gap, var(--ui-space-3));\n padding-block-start: env(safe-area-inset-top);\n padding-inline-start: max(var(--ui-top-bar-padding-inline, var(--ui-space-4)), env(safe-area-inset-left));\n padding-inline-end: max(var(--ui-top-bar-padding-inline, var(--ui-space-4)), env(safe-area-inset-right));\n background: var(--ui-top-bar-surface, var(--ui-surface-elevated));\n border-block-end: 1px solid var(--ui-top-bar-border, var(--ui-border-default));\n }\n\n .leading,\n .search,\n .actions {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n }\n\n .actions {\n gap: var(--ui-top-bar-actions-gap, var(--ui-space-1));\n }\n\n .title {\n min-inline-size: 0;\n flex: 1;\n }\n\n /* An unused region takes no space, so it adds no gap. */\n .leading:empty,\n .search:empty,\n .actions:empty {\n display: none;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true,"name":"leading"},{"dynamic":false,"required":true},{"dynamic":false,"required":true,"name":"search"},{"dynamic":false,"required":true,"name":"actions"}],"root":{"kind":"native","element":"header","choices":["header"]}},{"source":{"file":"./components/ui-tree-item/ui-tree-item.html"},"contract":{"version":1,"name":"UiTreeItem","tag":"ui-tree-item","nativeElement":"div","props":{"accepts":{"type":"string","required":false,"target":{"attribute":"data-accepts"},"description":"accepts token.","default":""},"container":{"type":"boolean","required":false,"target":{"attribute":"container"},"description":"container token.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"aria-disabled"},"description":"disabled token.","default":false},"dragType":{"type":"string","required":false,"target":{"attribute":"data-drag-type"},"description":"dragType token.","default":"item"},"dropDepth":{"type":"number","required":false,"target":{"attribute":"data-drop-depth"},"description":"dropDepth token."},"dropScope":{"type":"string","required":false,"target":{"attribute":"data-drop-scope"},"description":"dropScope token.","default":""},"expanded":{"type":"boolean","required":false,"target":{"attribute":"expanded"},"description":"expanded token.","default":false},"itemId":{"type":"string","required":false,"target":{"attribute":"data-item-id"},"description":"itemId token.","default":""},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"The item's accessible name, also shown as the row text unless the label slot supplies content.","default":""},"selected":{"type":"boolean","required":false,"target":{"attribute":"aria-selected"},"description":"selected token.","default":false},"sortable":{"type":"boolean","required":false,"target":{"attribute":"sortable"},"description":"sortable token.","default":false},"subtreeDepth":{"type":"number","required":false,"target":{"attribute":"data-subtree-depth"},"description":"subtreeDepth token."}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"treeitem"},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}},{"kind":"attribute","name":"aria-level","expression":"structuralLevel","expressionPlan":{"source":"structuralLevel","ast":{"kind":"id","name":"structuralLevel"},"dependencies":["structuralLevel"]}},{"kind":"attribute","name":"aria-selected","expression":"selected","expressionPlan":{"source":"selected","ast":{"kind":"id","name":"selected"},"dependencies":["selected"]}},{"kind":"attribute","name":"aria-disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"data-item-id","expression":"itemId","expressionPlan":{"source":"itemId","ast":{"kind":"id","name":"itemId"},"dependencies":["itemId"]}},{"kind":"attribute","name":"data-drag-type","expression":"dragType","expressionPlan":{"source":"dragType","ast":{"kind":"id","name":"dragType"},"dependencies":["dragType"]}},{"kind":"attribute","name":"data-drop-scope","expression":"dropScope","expressionPlan":{"source":"dropScope","ast":{"kind":"id","name":"dropScope"},"dependencies":["dropScope"]}},{"kind":"attribute","name":"data-accepts","expression":"accepts","expressionPlan":{"source":"accepts","ast":{"kind":"id","name":"accepts"},"dependencies":["accepts"]}},{"kind":"attribute","name":"data-drop-depth","expression":"dropDepth","expressionPlan":{"source":"dropDepth","ast":{"kind":"id","name":"dropDepth"},"dependencies":["dropDepth"]}},{"kind":"attribute","name":"data-subtree-depth","expression":"subtreeDepth","expressionPlan":{"source":"subtreeDepth","ast":{"kind":"id","name":"subtreeDepth"},"dependencies":["subtreeDepth"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"row"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"drag-handle"},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"draggable","value":"true"},{"kind":"attribute","name":"aria-label","expression":"format('Drag %s to reorder', label)","expressionPlan":{"source":"format('Drag %s to reorder', label)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"Drag %s to reorder"},{"kind":"id","name":"label"}]},"dependencies":["label"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"focusable","value":"false"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"9"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"1"}],"children":[]},{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"9"},{"kind":"literal","name":"cy","value":"5"},{"kind":"literal","name":"r","value":"1"}],"children":[]},{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"9"},{"kind":"literal","name":"cy","value":"19"},{"kind":"literal","name":"r","value":"1"}],"children":[]},{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"15"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"1"}],"children":[]},{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"15"},{"kind":"literal","name":"cy","value":"5"},{"kind":"literal","name":"r","value":"1"}],"children":[]},{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"15"},{"kind":"literal","name":"cy","value":"19"},{"kind":"literal","name":"r","value":"1"}],"children":[]}]}],"flow":{"kind":"if","test":"sortable and not disabled","testPlan":{"source":"sortable and not disabled","ast":{"kind":"binary","op":"and","left":{"kind":"id","name":"sortable"},"right":{"kind":"unary","op":"not","operand":{"kind":"id","name":"disabled"}}},"dependencies":["disabled","sortable"]}},"ref":"dragHandle"},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"disclosure"},{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"hidden","expression":"not isContainer","expressionPlan":{"source":"not isContainer","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"isContainer"}},"dependencies":["isContainer"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"disclosure-icon"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]}],"ref":"disclosure"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"leading"}],"children":[{"kind":"slot","fallback":[],"name":"leading"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot","fallback":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[]}],"name":"label"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"actions"}],"children":[{"kind":"slot","fallback":[],"name":"actions"}],"ref":"actions"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"drop-indicator row-drop-indicator"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]}],"ref":"row"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"children"},{"kind":"literal","name":"role","value":"group"},{"kind":"attribute","name":"hidden","expression":"not (isContainer and internalExpanded)","expressionPlan":{"source":"not (isContainer and internalExpanded)","ast":{"kind":"unary","op":"not","operand":{"kind":"binary","op":"and","left":{"kind":"id","name":"isContainer"},"right":{"kind":"id","name":"internalExpanded"}}},"dependencies":["internalExpanded","isContainer"]}}],"children":[{"kind":"slot"}],"ref":"children"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"drop-indicator subtree-drop-indicator"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]}]},"css":":host {\n --_tree-row-min-height: 32px;\n --_tree-disclosure-size: 16px;\n\n position: relative;\n display: block;\n min-inline-size: 0;\n margin-inline-start: calc(var(--ui-tree-item-depth, 0) * var(--ui-tree-indent, 16px));\n }\n\n .row {\n position: relative;\n display: grid;\n grid-template-columns: var(--_tree-disclosure-size) auto minmax(0, 1fr);\n align-items: center;\n min-block-size: var(--ui-tree-item-min-block-size, var(--_tree-row-min-height));\n min-inline-size: 0;\n font-size: var(--ui-tree-item-font-size, var(--ui-font-size-ui));\n border-radius: var(--ui-radius-md);\n color: var(--ui-text-secondary);\n transition:\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n color var(--ui-motion-fast) var(--ui-motion-ease),\n opacity var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease),\n min-block-size var(--ui-motion-base) var(--ui-motion-ease);\n }\n\n .row:hover,\n :host-state([selected]) .row,\n .row:focus-within {\n color: var(--ui-text-primary);\n background: var(--ui-surface-muted);\n }\n\n :host-state([disabled]) .row {\n opacity: 0.55;\n }\n\n :host[data-dragging] .row {\n opacity: 0.42;\n }\n\n :host:focus {\n outline: none;\n }\n\n :host:focus-visible .row {\n box-shadow: 0 0 0 2px var(--ui-focus-ring);\n }\n\n /* Child combinators: drop feedback belongs to this item's own row, not the rows nested in it. */\n :host[data-drop-position=\"inside\"] > .row {\n background: var(--ui-accent-subtle);\n box-shadow: inset 0 0 0 1px var(--ui-tree-drop-color, var(--ui-accent-solid));\n }\n\n .disclosure,\n .disclosure-spacer {\n grid-column: 1;\n grid-row: 1;\n inline-size: var(--_tree-disclosure-size);\n block-size: 28px;\n }\n\n .disclosure {\n display: grid;\n /* Start-aligned: the chevron's ink, not its hit area, aligns with the content above it. */\n place-items: center start;\n padding: 0;\n color: var(--ui-text-muted);\n background: transparent;\n border: 0;\n border-radius: var(--ui-radius-sm);\n cursor: pointer;\n }\n\n .disclosure[hidden] {\n display: none;\n }\n\n .disclosure:hover {\n color: var(--ui-text-primary);\n background: var(--ui-surface-elevated);\n }\n\n .disclosure-icon {\n display: grid;\n place-items: center;\n inline-size: 12px;\n block-size: 12px;\n transform: rotate(-90deg);\n transition: transform var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .disclosure-icon::before {\n display: block;\n inline-size: 0.375rem;\n block-size: 0.375rem;\n border-inline-end: 1.5px solid currentColor;\n border-block-end: 1.5px solid currentColor;\n content: \"\";\n /* A chevron's ink sits below its box centre; lift it so it centres optically (in either rotation). */\n transform: translateY(-20%) rotate(45deg);\n }\n\n :host[aria-expanded=\"true\"] .disclosure-icon {\n transform: rotate(0deg);\n }\n\n /* Lucide grip-vertical, filling the handle as in Looma 0.2. */\n .drag-handle svg {\n display: block;\n inline-size: 100%;\n block-size: 100%;\n }\n\n /* Slotted content is outside this scope, so :has() cannot see it; hide only a truly empty slot. */\n .leading {\n display: inline-grid;\n place-items: center;\n grid-column: 2;\n grid-row: 1;\n inline-size: 1em;\n block-size: 1em;\n margin-inline-start: var(--ui-space-1);\n color: var(--ui-text-muted);\n }\n\n .leading:empty {\n display: none;\n }\n\n /* Icons match the label's size (as in Knit's tree): an unsized SVG would otherwise render 300×150. */\n :slotted(svg),\n :slotted(img) {\n display: block;\n inline-size: 1em;\n block-size: 1em;\n flex: none;\n }\n\n /* The label spans the row's height and centres its content, so slotted content (a link) can\n stretch to fill the row as its own hit area; the padding tokens remove the inset. */\n .label {\n grid-column: 3;\n grid-row: 1;\n align-self: stretch;\n display: flex;\n align-items: center;\n min-inline-size: 0;\n padding: var(--ui-tree-item-label-padding-block, var(--ui-space-1)) var(--ui-tree-item-label-padding-inline, var(--ui-space-2));\n }\n\n /* Slotted label content fills the cell, so a link is the row's hit area rather than sizing to\n its own text and reading as overflow. */\n .label > :slotted(*) {\n flex: 1 1 auto;\n min-inline-size: 0;\n }\n\n /* The controls sit over the label's end, so the text fades out where they begin. The fade is\n the truncation mark while it shows: an ellipsis under it would read as a second one. */\n .row:hover > .label,\n .row:focus-within > .label {\n text-overflow: clip;\n mask-image: linear-gradient(\n to right,\n #000 calc(100% - var(--_tree-actions-width, 1.75rem) - var(--ui-space-3)),\n transparent calc(100% - var(--_tree-actions-width, 1.75rem))\n );\n }\n\n .row:hover > .label:dir(rtl),\n .row:focus-within > .label:dir(rtl) {\n mask-image: linear-gradient(\n to left,\n #000 calc(100% - var(--_tree-actions-width, 1.75rem) - var(--ui-space-3)),\n transparent calc(100% - var(--_tree-actions-width, 1.75rem))\n );\n }\n\n .row:hover > .label > :slotted(*),\n .row:focus-within > .label > :slotted(*) {\n text-overflow: clip;\n }\n\n .actions {\n position: absolute;\n z-index: 1;\n inset-block: 0;\n inset-inline-end: 0;\n display: inline-flex;\n align-items: center;\n min-inline-size: 0;\n opacity: 0;\n pointer-events: none;\n transition: opacity var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .row:hover > .actions,\n .row:focus-within > .actions {\n opacity: 1;\n pointer-events: auto;\n }\n\n /* Without hover there is no reveal, so the controls keep their own column. */\n @media (hover: none) {\n .row {\n grid-template-columns: var(--_tree-disclosure-size) auto minmax(0, 1fr) auto;\n }\n\n .actions {\n position: static;\n grid-column: 4;\n grid-row: 1;\n padding-inline-start: 0;\n background: none;\n opacity: 1;\n pointer-events: auto;\n }\n }\n\n .drag-handle {\n position: absolute;\n z-index: 2;\n inset-block-start: 50%;\n inset-inline-start: -22px;\n inline-size: 20px;\n block-size: 32px;\n display: grid;\n place-items: center;\n padding: 7px 3px;\n color: var(--ui-text-muted);\n background: var(--ui-surface-elevated);\n border: 1px solid transparent;\n border-radius: var(--ui-radius-sm);\n cursor: grab;\n /* Hidden until the row is hovered, but always hittable: the handle sits outside the row, and moving\n the pointer onto it must not hide it on the way. */\n opacity: 0;\n transform: translateY(-50%);\n transition: opacity var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .row:hover .drag-handle,\n .drag-handle:hover,\n .drag-handle:focus-visible,\n :host[data-dragging] > .row > .drag-handle {\n opacity: 1;\n }\n\n .drag-handle:active {\n cursor: grabbing;\n }\n\n .drop-indicator {\n position: absolute;\n z-index: 3;\n inset-inline: 1px;\n display: none;\n block-size: 2px;\n border-radius: 999px;\n background: var(--ui-tree-drop-color, var(--ui-accent-solid));\n pointer-events: none;\n }\n\n .drop-indicator::before,\n .drop-indicator::after {\n content: \"\";\n position: absolute;\n inset-block-start: 50%;\n inline-size: 7px;\n block-size: 7px;\n border: 2px solid var(--ui-tree-drop-color, var(--ui-accent-solid));\n border-radius: 999px;\n background: var(--ui-surface-elevated);\n transform: translateY(-50%);\n }\n\n .drop-indicator::before {\n inset-inline-start: -1px;\n }\n .drop-indicator::after {\n inset-inline-end: -1px;\n }\n\n :host[data-drop-position=\"before\"] > .row > .row-drop-indicator {\n display: block;\n inset-block-start: -1px;\n }\n\n :host[data-drop-position=\"after\"] > .subtree-drop-indicator {\n display: block;\n inset-block-end: -1px;\n }\n\n .children[hidden] {\n display: none;\n }\n\n html[data-ui-input-modality=\"touch\"] :host {\n --_tree-row-min-height: 44px;\n }\n\n html[data-ui-input-modality=\"touch\"] :host .drag-handle {\n display: none;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .row,\n .disclosure-icon,\n .drag-handle {\n transition: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalExpanded","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"structuralLevel","expression":{"source":"1","ast":{"kind":"literal","value":1},"dependencies":[]}},{"kind":"state","name":"tabStop","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"isContainer","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"expand","type":"object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })","bubbles":false,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true,"name":"leading"},{"dynamic":false,"required":false,"name":"label"},{"dynamic":false,"required":true,"name":"actions"},{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-tree-item/ui-tree-item.js"},{"source":{"file":"./components/ui-tree/ui-tree.html"},"contract":{"version":1,"name":"UiTree","tag":"ui-tree","nativeElement":"div","props":{"density":{"type":{"enum":["comfortable","compact"]},"required":false,"target":{"attribute":"density"},"description":"Compact trades padding and type size for rows that fit more on screen.","default":"comfortable"},"hoverExpandDelay":{"type":"number","required":false,"target":{"attribute":"hoverexpanddelay"},"description":"hoverExpandDelay token.","default":700},"label":{"type":"string","required":false,"target":{"attribute":"label"},"description":"label token.","default":"Tree"},"maxDepth":{"type":"number","required":false,"target":{"attribute":"maxdepth"},"description":"maxDepth token.","default":0}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"tree"}],"children":[{"kind":"slot"}]},"css":":host-state([density=\"compact\"]) {\n --ui-tree-item-min-block-size: var(--ui-control-size-sm);\n --ui-tree-item-font-size: var(--ui-font-size-sm);\n --ui-tree-item-label-padding-block: 0;\n }\n\n :host {\n display: block;\n min-inline-size: 0;\n padding-inline-start: var(--ui-tree-gutter, 0px);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"event","name":"reorder","type":"object({ sourceId: string, targetId: string, position: before | inside | after, sourceType: string, targetType: string, sourceScope: string, targetScope: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"reorder-rejected","type":"object({ sourceId: string, targetId: string, position: before | inside | after, reason: max-depth, maxDepth: integer, resultingDepth: integer, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-tree/ui-tree.js"}];
3
+ export const definitions = [{"source":{"file":"./components/ui-affordance-scope/ui-affordance-scope.html"},"contract":{"version":1,"name":"UiAffordanceScope","tag":"ui-affordance-scope","nativeElement":"span","props":{"nearRadius":{"type":"number","required":false,"target":{"attribute":"nearradius"},"description":"How close, in pixels, the pointer must come to reveal an affordance.","default":16}}},"template":{"kind":"element","name":"span","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n display: contents;\n --ui-affordance-scope-engaged: 0;\n }\n\n :host-state([engaged]) {\n --ui-affordance-scope-engaged: 1;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"engaged","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"span","choices":["span"]},"controller":"./components/ui-affordance-scope/ui-affordance-scope.js"},{"source":{"file":"./components/ui-avatar-group/ui-avatar-group.html"},"contract":{"version":1,"name":"UiAvatarGroup","tag":"ui-avatar-group","nativeElement":"div","props":{"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"label token.","default":"People"},"max":{"type":"number","required":false,"target":{"attribute":"max"},"description":"max token.","default":5}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"group"},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[{"kind":"slot"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"overflow"},{"kind":"literal","name":"role","value":"img"},{"kind":"attribute","name":"hidden","expression":"not overflowCount","expressionPlan":{"source":"not overflowCount","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"overflowCount"}},"dependencies":["overflowCount"]}},{"kind":"attribute","name":"aria-label","expression":"format('%s more', overflowCount)","expressionPlan":{"source":"format('%s more', overflowCount)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s more"},{"kind":"id","name":"overflowCount"}]},"dependencies":["overflowCount"]}}],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"format('+%s', overflowCount)","expressionPlan":{"source":"format('+%s', overflowCount)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"+%s"},{"kind":"id","name":"overflowCount"}]},"dependencies":["overflowCount"]}}],"children":[]}],"ref":"overflow"}]},"css":":host {\n /* Avatars separate with a tight, crisp edge, matching Looma's 1px borders rather than the\n * diffuse elevation overlays use. */\n --_overlap-shadow: -2px 0 2px -1px rgba(0, 0, 0, 0.22);\n --_edge-ring: 0 0 0 1px rgba(0, 0, 0, 0.08);\n\n display: flex;\n align-items: center;\n flex-direction: row;\n gap: 0;\n }\n\n /* Overlap and the separating shadow are applied by the controller: slotted avatars are nested\n * component roots outside this style scope. */\n :slotted(*) {\n margin-inline-start: -0.625rem;\n flex-shrink: 0;\n border-radius: 999px;\n }\n\n :slotted(*:first-child) {\n margin-inline-start: 0;\n }\n\n .overflow {\n margin-inline-start: -0.625rem;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n inline-size: 2.5rem;\n block-size: 2.5rem;\n border-radius: 999px;\n border: 1px solid var(--ui-border-strong);\n background: var(--ui-surface-elevated);\n color: var(--ui-text-primary);\n box-shadow:\n var(--ui-avatar-group-overlap-shadow, var(--_overlap-shadow)),\n var(--ui-avatar-group-edge-ring, var(--_edge-ring));\n font: inherit;\n font-size: 0.75rem;\n font-weight: 600;\n flex-shrink: 0;\n }\n\n .overflow[hidden] {\n display: none;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"overflowCount","expression":{"source":"0","ast":{"kind":"literal","value":0},"dependencies":[]}}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-avatar-group/ui-avatar-group.js"},{"source":{"file":"./components/ui-avatar/ui-avatar.html"},"contract":{"version":1,"name":"UiAvatar","tag":"ui-avatar","nativeElement":"span","props":{"alt":{"type":"string","required":false,"target":{"attribute":"alt"},"description":"alt token.","default":""},"fallback":{"type":"string","required":false,"target":{"attribute":"fallback"},"description":"fallback token.","default":""},"name":{"type":"string","required":false,"target":{"attribute":"name"},"description":"name token.","default":""},"src":{"type":"string","required":false,"target":{"attribute":"src"},"description":"Image URL."}}},"template":{"kind":"element","name":"span","attributes":[],"children":[{"kind":"slot"},{"kind":"element","name":"img","attributes":[{"kind":"literal","name":"class","value":"image"},{"kind":"attribute","name":"src","expression":"src","expressionPlan":{"source":"src","ast":{"kind":"id","name":"src"},"dependencies":["src"]}},{"kind":"literal","name":"alt","value":""},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"attribute","name":"hidden","expression":"hasAuthoredImage or not hasImage","expressionPlan":{"source":"hasAuthoredImage or not hasImage","ast":{"kind":"binary","op":"or","left":{"kind":"id","name":"hasAuthoredImage"},"right":{"kind":"unary","op":"not","operand":{"kind":"id","name":"hasImage"}}},"dependencies":["hasAuthoredImage","hasImage"]}}],"children":[],"ref":"image"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"fallback"},{"kind":"attribute","name":"aria-hidden","expression":"hasImage","expressionPlan":{"source":"hasImage","ast":{"kind":"id","name":"hasImage"},"dependencies":["hasImage"]}},{"kind":"attribute","name":"hidden","expression":"hasImage","expressionPlan":{"source":"hasImage","ast":{"kind":"id","name":"hasImage"},"dependencies":["hasImage"]}},{"kind":"directive","name":"value","expression":"initials","expressionPlan":{"source":"initials","ast":{"kind":"id","name":"initials"},"dependencies":["initials"]}}],"children":[]}]},"css":":host {\n display: inline-grid;\n place-items: center;\n overflow: hidden;\n inline-size: 2.5rem;\n block-size: 2.5rem;\n border-radius: 999px;\n border: 1px solid var(--ui-avatar-border, var(--ui-border-strong));\n background: var(--ui-avatar-surface, var(--ui-accent-soft));\n color: var(--ui-avatar-text, var(--ui-accent-solid));\n font: inherit;\n font-size: 0.875rem;\n font-weight: 600;\n text-transform: uppercase;\n }\n\n .image,\n :slotted(img) {\n grid-area: 1 / 1;\n inline-size: 100%;\n block-size: 100%;\n object-fit: cover;\n }\n\n .fallback {\n grid-area: 1 / 1;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n inline-size: 100%;\n block-size: 100%;\n }\n\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high. */\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high.\n * Trimming applies to block containers, so the box is a block with centred content. */\n @supports (text-box-trim: trim-both) {\n .fallback {\n display: block;\n text-align: center;\n align-content: center;\n text-box-trim: trim-both;\n text-box-edge: cap alphabetic;\n }\n }\n\n [hidden] {\n display: none;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"hasImage","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"hasAuthoredImage","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"initials","expression":{"source":"'?'","ast":{"kind":"literal","value":"?"},"dependencies":[]}}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"span","choices":["span"]},"controller":"./components/ui-avatar/ui-avatar.js"},{"source":{"file":"./components/ui-badge/ui-badge.html"},"contract":{"version":1,"name":"UiBadge","tag":"ui-badge","nativeElement":"span","props":{"tone":{"type":{"enum":["neutral","accent","info","success","warning","danger"]},"required":false,"target":{"attribute":"tone"},"description":"tone token.","default":"neutral"},"variant":{"type":{"enum":["solid","subtle"]},"required":false,"target":{"attribute":"variant"},"description":"variant token.","default":"subtle"}}},"template":{"kind":"element","name":"span","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n --_badge-surface: var(--ui-surface-subtle);\n --_badge-text: var(--ui-text-secondary);\n --_badge-border: color-mix(in srgb, var(--ui-text-secondary) 30%, transparent);\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n max-width: 100%;\n padding: var(--ui-badge-padding-block, var(--ui-space-0-5)) var(--ui-badge-padding-inline, var(--ui-space-2));\n border: 1px solid var(--ui-badge-border, var(--_badge-border));\n border-radius: var(--ui-radius-round);\n background: var(--ui-badge-surface, var(--_badge-surface));\n color: var(--ui-badge-text, var(--_badge-text));\n font-family: var(--ui-font-family-sans);\n font-size: var(--ui-badge-font-size, var(--ui-font-size-sm));\n font-weight: var(--ui-badge-font-weight, var(--ui-font-medium));\n line-height: var(--ui-badge-line-height, var(--ui-line-height-tight));\n white-space: nowrap;\n }\n\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high. */\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high.\n * Trimming applies to block containers, so the box is a block with centred content. */\n @supports (text-box-trim: trim-both) {\n :host {\n display: block;\n min-block-size: var(--ui-badge-min-block-size, 1.5rem);\n text-align: center;\n align-content: center;\n text-box-trim: trim-both;\n text-box-edge: cap alphabetic;\n }\n }\n\n :host-state([tone=\"accent\"]) {\n --_badge-surface: var(--ui-accent-strong-surface, var(--ui-accent-solid));\n --_badge-border: var(--ui-accent-strong-surface, var(--ui-accent-solid));\n --_badge-text: var(--ui-accent-on-strong, var(--ui-text-on-accent));\n }\n\n :host-state([tone=\"danger\"]) {\n --_badge-surface: var(--ui-danger-strong-surface, var(--ui-danger-solid));\n --_badge-border: var(--ui-danger-strong-surface, var(--ui-danger-solid));\n --_badge-text: var(--ui-danger-on-strong, var(--ui-text-on-accent));\n }\n\n :host-state([tone=\"success\"]) {\n --_badge-surface: var(--ui-success-strong-surface, var(--ui-success-solid));\n --_badge-border: var(--ui-success-strong-surface, var(--ui-success-solid));\n --_badge-text: var(--ui-success-on-strong, var(--ui-text-on-accent));\n }\n\n :host-state([tone=\"warning\"]) {\n --_badge-surface: var(--ui-warning-strong-surface, var(--ui-warning-solid));\n --_badge-border: var(--ui-warning-strong-surface, var(--ui-warning-solid));\n --_badge-text: var(--ui-warning-on-strong, var(--ui-text-on-accent));\n }\n\n :host-state([tone=\"info\"]) {\n --_badge-surface: var(--ui-info-strong-surface, var(--ui-info-solid));\n --_badge-border: var(--ui-info-strong-surface, var(--ui-info-solid));\n --_badge-text: var(--ui-info-on-strong, var(--ui-text-on-accent));\n }\n\n :host-state([variant=\"subtle\"][tone=\"accent\"]) {\n --_badge-surface: var(--ui-accent-soft);\n --_badge-border: var(--ui-accent-soft);\n --_badge-text: var(--ui-accent-subtle-text, var(--ui-accent-solid));\n }\n\n :host-state([variant=\"subtle\"][tone=\"danger\"]) {\n --_badge-surface: var(--ui-danger-soft);\n --_badge-border: var(--ui-danger-soft);\n --_badge-text: var(--ui-danger-subtle-text, var(--ui-danger-solid));\n }\n\n :host-state([variant=\"subtle\"][tone=\"success\"]) {\n --_badge-surface: var(--ui-success-soft);\n --_badge-border: var(--ui-success-soft);\n --_badge-text: var(--ui-success-subtle-text, var(--ui-success-solid));\n }\n\n :host-state([variant=\"subtle\"][tone=\"warning\"]) {\n --_badge-surface: var(--ui-warning-soft);\n --_badge-border: var(--ui-warning-soft);\n --_badge-text: var(--ui-warning-subtle-text, var(--ui-warning-solid));\n }\n\n :host-state([variant=\"subtle\"][tone=\"info\"]) {\n --_badge-surface: var(--ui-info-soft);\n --_badge-border: var(--ui-info-soft);\n --_badge-text: var(--ui-info-subtle-text, var(--ui-info-solid));\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"span","choices":["span"]}},{"source":{"file":"./components/ui-button/ui-button.html"},"contract":{"version":1,"name":"UiButton","tag":"ui-button","nativeElement":"button","props":{"align":{"type":{"enum":["center","start"]},"required":false,"target":{"attribute":"align"},"description":"Content alignment. start lays the content out like a list option: from the start edge, with start-aligned text.","default":"center"},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"size":{"type":{"enum":["sm","md","lg"]},"required":false,"target":{"attribute":"size"},"description":"Control size.","default":"md"},"stretch":{"type":"boolean","required":false,"target":{"attribute":"stretch"},"description":"Fills the inline size of its container.","default":false},"tone":{"type":{"enum":["accent","neutral","danger","success","warning","info"]},"required":false,"target":{"attribute":"tone"},"description":"Which colour the button speaks in. It applies to every variant, so an outline, a ghost, and a solid in the same tone are the same action at three volumes:\n tone=\"danger\" variant=\"outline\" is a destructive secondary action. neutral is the quiet one, for a button that should not claim a colour.","default":"accent"},"variant":{"type":{"enum":["outline","solid","danger","ghost","link"]},"required":false,"target":{"attribute":"variant"},"description":"Emphasis: how loudly the button asks. solid fills with its tone, outline draws its tone at the edge over a wash of it, ghost carries only text until it is\n hovered, and link is an inline text action that reads as a link. danger is solid in the danger tone, kept for the call sites that name it.","default":"outline"}}},"template":{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"slot"}]},"css":":host {\n --_hue: var(--ui-accent);\n --_hue-hover: var(--ui-accent-hover);\n --_hue-active: var(--ui-accent-active);\n --_hue-text: var(--ui-accent-active);\n --_on-hue: var(--ui-on-accent);\n\n --_tone: var(--_hue);\n --_tone-hover: var(--_hue-hover);\n --_tone-active: var(--_hue-active);\n --_tone-text: var(--_hue-text);\n --_on-tone: var(--_on-hue);\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n vertical-align: middle;\n color: var(--_tone-text);\n }\n\n :host-state([align=\"start\"]) {\n justify-content: flex-start;\n text-align: start;\n }\n\n :host-state([stretch]) {\n display: flex;\n inline-size: 100%;\n }\n\n :host {\n appearance: none;\n min-block-size: var(--ui-button-min-block-size, var(--ui-control-size-md));\n border-style: solid;\n border-width: 1px;\n border-color: var(--ui-button-border, var(--_tone));\n border-radius: var(--ui-button-radius, var(--ui-radius-md));\n background-color: var(--ui-button-surface, oklch(from var(--_tone) l c h / 5%));\n color: var(--ui-button-text, var(--_tone-text));\n font: inherit;\n font-weight: var(--ui-font-medium);\n line-height: var(--ui-line-height-tight);\n padding: var(--ui-space-2) var(--ui-space-3);\n background-image: var(--ui-raised-highlight);\n box-shadow: var(--ui-button-shadow, var(--ui-raised));\n cursor: pointer;\n transition:\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease);\n margin: 0;\n }\n\n @supports (text-box-trim: trim-both) {\n :host {\n text-box-trim: trim-both;\n text-box-edge: cap alphabetic;\n }\n }\n\n :host-state([size=\"sm\"]) {\n min-block-size: var(--ui-control-size-sm);\n padding: var(--ui-space-1) var(--ui-space-2);\n font-size: 0.875rem;\n }\n\n :host-state([size=\"lg\"]) {\n min-block-size: var(--ui-control-size-lg);\n padding: var(--ui-space-3) var(--ui-space-4);\n font-size: 1rem;\n }\n\n :host:hover:enabled {\n border-color: var(--ui-button-hover-border, var(--_tone-hover));\n background-color: var(--ui-button-hover-surface, oklch(from var(--_tone) l c h / 12%));\n }\n\n /* Pressed reads as pressed in: the highlight goes, and the shadow moves inside. */\n :host:active:enabled {\n background-color: var(--ui-button-active-surface, oklch(from var(--_tone) l c h / 18%));\n background-image: none;\n box-shadow: var(--ui-pressed);\n }\n\n :host-state([variant=\"solid\"]), :host-state([variant=\"danger\"]) {\n border-color: var(--_tone);\n background-color: var(--_tone);\n color: var(--_on-tone);\n box-shadow: var(--ui-button-solid-shadow, var(--ui-raised));\n }\n\n :is(:host-state([variant=\"solid\"]), :host-state([variant=\"danger\"])):hover:enabled {\n background-color: var(--_tone-hover);\n border-color: var(--_tone-hover);\n }\n\n :is(:host-state([variant=\"solid\"]), :host-state([variant=\"danger\"])):active:enabled {\n background-color: var(--_tone-active);\n border-color: var(--_tone-active);\n background-image: none;\n box-shadow: var(--ui-pressed);\n }\n\n /* Tone is the colour, variant is the volume. Every pairing works: a danger outline is a\n destructive secondary action, not a special case. */\n :host-state([tone=\"neutral\"]) {\n --_hue: var(--ui-text);\n --_hue-hover: var(--ui-text);\n --_hue-active: var(--ui-text);\n --_hue-text: var(--ui-text);\n --_on-hue: var(--ui-surface);\n }\n\n :host-state([tone=\"danger\"]), :host-state([variant=\"danger\"]) {\n --_hue: var(--ui-danger);\n --_hue-hover: var(--ui-danger-hover);\n --_hue-active: var(--ui-danger-hover);\n --_hue-text: var(--ui-danger-hover);\n --_on-hue: var(--ui-on-danger);\n }\n\n :host-state([tone=\"success\"]) {\n --_hue: var(--ui-success);\n --_hue-hover: color-mix(in srgb, var(--ui-success) 85%, #000);\n --_hue-active: color-mix(in srgb, var(--ui-success) 75%, #000);\n --_hue-text: color-mix(in srgb, var(--ui-success) 85%, #000);\n --_on-hue: var(--ui-surface);\n }\n\n :host-state([tone=\"warning\"]) {\n --_hue: var(--ui-warning);\n --_hue-hover: color-mix(in srgb, var(--ui-warning) 85%, #000);\n --_hue-active: color-mix(in srgb, var(--ui-warning) 75%, #000);\n --_hue-text: color-mix(in srgb, var(--ui-warning) 85%, #000);\n --_on-hue: var(--ui-surface);\n }\n\n :host-state([tone=\"info\"]) {\n --_hue: var(--ui-info);\n --_hue-hover: color-mix(in srgb, var(--ui-info) 85%, #000);\n --_hue-active: color-mix(in srgb, var(--ui-info) 75%, #000);\n --_hue-text: color-mix(in srgb, var(--ui-info) 85%, #000);\n --_on-hue: var(--ui-surface);\n }\n\n :host-state([variant=\"ghost\"]) {\n border-color: transparent;\n background: transparent;\n box-shadow: none;\n color: var(--ui-button-ghost-text, var(--_tone-text));\n }\n\n /* Tints derive from the text colour, not a surface token, so hover and press show on any background. */\n :host-state([variant=\"ghost\"]):hover:enabled {\n background-color: var(--ui-button-ghost-hover-surface, oklch(from var(--_tone) l c h / 10%));\n border-color: transparent;\n }\n\n :host-state([variant=\"ghost\"]):active:enabled {\n background-color: var(--ui-button-ghost-active-surface, oklch(from var(--_tone) l c h / 16%));\n border-color: transparent;\n box-shadow: var(--ui-pressed);\n }\n\n /* A soft halo that transitions in with the other box-shadow changes, layered on the raised shadow. */\n :host:focus-visible {\n outline: none;\n box-shadow:\n var(--ui-button-shadow, var(--ui-raised)),\n var(--ui-focus-halo);\n }\n\n :host-state([variant=\"solid\"]):focus-visible {\n box-shadow:\n var(--ui-button-solid-shadow, var(--ui-raised)),\n var(--ui-focus-halo);\n }\n\n /* Disabled drops the tone rather than the shape: every variant keeps its own structure, so a\n disabled outline is still an outline and a disabled ghost is still text. Intent goes — an\n unavailable action says \"unavailable\", not \"unavailable, and destructive\" — and so do the\n highlight and shadow, because nothing that cannot be pressed should look raised. */\n :host:disabled {\n /* Derived from the tone itself, not from a separate disabled palette: faded toward the\n page, which desaturates it at the same time. Toward the page rather than toward white,\n so a dark theme dims where a light one lightens — the same rule, both schemes. */\n --_tone: color-mix(in oklab, var(--_hue) 58%, var(--ui-surface));\n --_tone-hover: var(--_tone);\n --_tone-active: var(--_tone);\n --_tone-text: color-mix(in oklab, var(--_hue-text) 72%, var(--ui-surface));\n --_on-tone: var(--_tone-text);\n\n opacity: var(--ui-button-disabled-opacity, 1);\n cursor: not-allowed;\n background-image: none;\n box-shadow: none;\n }\n\n /* A filled button keeps its fill, faded further so its text stays legible on it. */\n :is(:host-state([variant=\"solid\"]), :host-state([variant=\"danger\"])):disabled {\n --_tone: color-mix(in oklab, var(--_hue) 34%, var(--ui-surface));\n }\n\n /* Ghost has no hover to fall back on, so disabled is the one state it has to state outright:\n it takes a surface, light and tinted, rather than reading as plain text. */\n :host-state([variant=\"ghost\"]):disabled {\n background-color: color-mix(in oklab, var(--_hue) 28%, var(--ui-surface));\n border-color: transparent;\n }\n\n @media (pointer: coarse) {\n :host {\n min-block-size: var(--ui-control-min-block-size);\n }\n }\n\n /* Link: an inline text action. No box, padding, or minimum height (inline targets are exempt under\n WCAG 2.5.8); the inherited font; an underline that strengthens on hover; a visible focus ring. */\n :host-state([variant=\"link\"]) {\n display: inline;\n min-block-size: 0;\n padding: 0;\n border: 0;\n border-radius: var(--ui-radius-sm);\n background: none;\n box-shadow: none;\n font: inherit;\n color: var(--ui-button-link-text, var(--ui-text-secondary));\n text-decoration-line: underline;\n text-decoration-thickness: 1px;\n text-decoration-color: color-mix(in srgb, currentColor 40%, transparent);\n text-underline-offset: 0.2em;\n transition: color var(--ui-motion-fast) var(--ui-motion-ease), text-decoration-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n :host-state([variant=\"link\"]):hover:enabled {\n color: var(--ui-button-link-hover-text, var(--ui-text-primary));\n text-decoration-color: currentColor;\n background: none;\n transform: none;\n }\n\n :host-state([variant=\"link\"]):active:enabled {\n background: none;\n transform: none;\n }\n\n :host-state([variant=\"link\"]):disabled {\n background: none;\n border-color: transparent;\n color: var(--ui-button-disabled-text, var(--ui-disabled-text));\n }\n\n :host-state([variant=\"link\"]):focus-visible {\n box-shadow: none;\n /* Fallback keeps the ring if the token is missing: an unresolved var() would void the outline. */\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: 2px;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"button","choices":["button"]}},{"source":{"file":"./components/ui-callout/ui-callout.html"},"contract":{"version":1,"name":"UiCallout","tag":"ui-callout","nativeElement":"div","props":{"tone":{"type":{"enum":["info","note","warning","success","danger"]},"required":false,"target":{"attribute":"tone"},"description":"Semantic message tone.","default":"info"}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"note"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"icon"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"12"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"10"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M12 16v-4"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M12 8h.01"}],"children":[]}],"flow":{"kind":"if","test":"tone = 'info'","testPlan":{"source":"tone = 'info'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"tone"},"right":{"kind":"literal","value":"info"}},"dependencies":["tone"]}}},{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M13.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8.5L13.5 2Z"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M13 2v7h7"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m9.5 17.5 4-4 2 2-4 4H9.5v-2Z"}],"children":[]}],"flow":{"kind":"if","test":"tone = 'note'","testPlan":{"source":"tone = 'note'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"tone"},"right":{"kind":"literal","value":"note"}},"dependencies":["tone"]}}},{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m21.73 18-8-14a2 2 0 0 0-3.46 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M12 9v4"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M12 17h.01"}],"children":[]}],"flow":{"kind":"if","test":"tone = 'warning'","testPlan":{"source":"tone = 'warning'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"tone"},"right":{"kind":"literal","value":"warning"}},"dependencies":["tone"]}}},{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"12"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"10"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m9 12 2 2 4-4"}],"children":[]}],"flow":{"kind":"if","test":"tone = 'success'","testPlan":{"source":"tone = 'success'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"tone"},"right":{"kind":"literal","value":"success"}},"dependencies":["tone"]}}},{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"12"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"10"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m15 9-6 6"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m9 9 6 6"}],"children":[]}],"flow":{"kind":"if","test":"tone = 'danger'","testPlan":{"source":"tone = 'danger'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"tone"},"right":{"kind":"literal","value":"danger"}},"dependencies":["tone"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"content"}],"children":[{"kind":"slot"}]}]},"css":":host {\n --_callout-surface: var(--ui-info-soft);\n --_callout-border: var(--ui-info-solid);\n --_callout-icon: var(--ui-info-solid);\n\n display: grid;\n grid-template-columns: var(--ui-callout-icon-column, 1.125rem) minmax(0, 1fr);\n gap: var(--ui-callout-gap, calc(var(--ui-space-2) * 0.75));\n align-items: start;\n max-width: 100%;\n padding: var(--ui-callout-padding-block, var(--ui-space-2)) var(--ui-callout-padding-inline, var(--ui-space-3));\n border: var(--ui-callout-border-width, 1px) solid color-mix(in srgb, var(--ui-callout-border, var(--_callout-border)) 35%, transparent);\n border-inline-start: var(--ui-callout-leading-border-width, 4px) solid var(--ui-callout-border, var(--_callout-border));\n border-radius: var(--ui-radius-md);\n background: var(--ui-callout-surface, var(--_callout-surface));\n color: var(--ui-callout-text, var(--ui-text-primary));\n font-family: var(--ui-font-family-sans);\n font-size: var(--ui-font-size-sm);\n font-weight: var(--ui-font-normal);\n line-height: var(--ui-line-height-md);\n }\n\n /* One line box tall, so the icon centres on the first line of text. */\n .icon {\n display: grid;\n place-items: center;\n inline-size: var(--ui-callout-icon-column, 1.125rem);\n block-size: 1lh;\n color: var(--ui-callout-icon, var(--_callout-icon));\n }\n\n .icon svg {\n inline-size: var(--ui-callout-icon-size, 1.125rem);\n block-size: var(--ui-callout-icon-size, 1.125rem);\n }\n\n .content {\n min-inline-size: 0;\n }\n\n :host-state([tone=\"note\"]) {\n --_callout-surface: var(--ui-surface-muted);\n --_callout-border: var(--ui-border-strong);\n --_callout-icon: var(--ui-text-secondary);\n }\n\n :host-state([tone=\"warning\"]) {\n --_callout-surface: var(--ui-warning-soft);\n --_callout-border: var(--ui-warning-solid);\n --_callout-icon: var(--ui-warning-solid);\n }\n\n :host-state([tone=\"success\"]) {\n --_callout-surface: var(--ui-success-soft);\n --_callout-border: var(--ui-success-solid);\n --_callout-icon: var(--ui-success-solid);\n }\n\n :host-state([tone=\"danger\"]) {\n --_callout-surface: var(--ui-danger-soft);\n --_callout-border: var(--ui-danger-solid);\n --_callout-icon: var(--ui-danger-solid);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-checkbox/ui-checkbox.html"},"contract":{"version":1,"name":"UiCheckbox","tag":"ui-checkbox","nativeElement":"label","props":{"checked":{"type":"boolean","required":false,"target":{"attribute":"checked"},"description":"Whether the checkbox is checked initially or when set externally.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"indeterminate":{"type":"boolean","required":false,"target":{"property":"indeterminate"},"description":"indeterminate token.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"required token.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"value token.","default":"on"}}},"template":{"kind":"element","name":"label","attributes":[],"children":[{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"checkbox"},{"kind":"property","key":"checked","name":"checked","expression":"internalChecked","expressionPlan":{"source":"internalChecked","ast":{"kind":"id","name":"internalChecked"},"dependencies":["internalChecked"]}},{"kind":"property","key":"indeterminate","name":"indeterminate","expression":"indeterminate","expressionPlan":{"source":"indeterminate","ast":{"kind":"id","name":"indeterminate"},"dependencies":["indeterminate"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}}],"children":[],"ref":"input"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot"}]}]},"css":":host {\n display: inline-flex;\n align-items: flex-start;\n gap: var(--ui-checkbox-gap, var(--ui-space-2));\n max-inline-size: 100%;\n color: var(--ui-text-primary);\n cursor: pointer;\n }\n\n .label {\n min-inline-size: 0;\n line-height: var(--ui-line-height-md);\n }\n\n input {\n appearance: none;\n -webkit-appearance: none;\n position: relative;\n flex: 0 0 auto;\n inline-size: var(--ui-checkbox-size, 1.125rem);\n block-size: var(--ui-checkbox-size, 1.125rem);\n margin: 0.125em 0 0;\n border: 1px solid var(--ui-control-border-hover, var(--ui-border-strong));\n border-radius: var(--ui-radius-sm);\n background: var(--ui-control-surface, var(--ui-surface-default));\n box-shadow: inset 0 1px 2px color-mix(in srgb, var(--ui-text-primary) 8%, transparent);\n cursor: pointer;\n transition:\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n input::after {\n content: \"\";\n position: absolute;\n opacity: 0;\n }\n\n input:checked,\n input:indeterminate {\n border-color: var(--ui-accent-solid);\n background: var(--ui-accent-solid);\n box-shadow: inset 0 1px 2px color-mix(in srgb, #000 16%, transparent);\n }\n\n /* Centre the tick's box, then lift it: a rotated L's ink sits ~0.11rem below its box centre. */\n input:checked::after {\n inset: 0;\n margin: auto;\n inline-size: 0.32rem;\n block-size: 0.58rem;\n /* Longhands, not `border: solid var(...)`: lowering drops a shorthand that omits a\n component, which left the tick with no style and no colour. */\n border-style: solid;\n border-color: var(--ui-text-on-accent);\n border-width: 0 0.125rem 0.125rem 0;\n opacity: 1;\n transform: translateY(-0.11rem) rotate(45deg);\n }\n\n input:indeterminate::after {\n inset: 50% 0.23rem auto;\n block-size: 0.125rem;\n border-radius: var(--ui-radius-round);\n background: var(--ui-text-on-accent);\n opacity: 1;\n transform: translateY(-50%);\n }\n\n input:hover:enabled {\n border-color: var(--ui-accent-solid);\n }\n\n input:focus-visible {\n outline: 2px solid var(--ui-focus-ring, var(--ui-accent-solid));\n outline-offset: 2px;\n }\n\n :host-state([disabled]) {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n :host-state([disabled]) input {\n border-color: var(--ui-border-default);\n background: var(--ui-control-surface-disabled, var(--ui-surface-muted));\n cursor: not-allowed;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalChecked","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"change","type":"object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"label","choices":["label"]},"controller":"./components/ui-checkbox/ui-checkbox.js"},{"source":{"file":"./components/ui-cluster/ui-cluster.html"},"contract":{"version":1,"name":"UiCluster","tag":"ui-cluster","nativeElement":"div","props":{"align":{"type":{"enum":["start","center","end","stretch"]},"required":false,"target":{"attribute":"align"},"description":"align token."},"gap":{"type":{"enum":["xs","s","m","l","xl"]},"required":false,"target":{"attribute":"gap"},"description":"gap token."}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n --_layout-gap: var(--ui-space-3);\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: var(--ui-cluster-gap, var(--_layout-gap));\n min-inline-size: 0;\n max-inline-size: 100%;\n margin: 0;\n }\n\n :host-state([gap=\"xs\"]) {\n --_layout-gap: var(--ui-space-2);\n }\n :host-state([gap=\"s\"]) {\n --_layout-gap: var(--ui-space-3);\n }\n :host-state([gap=\"m\"]) {\n --_layout-gap: var(--ui-space-4);\n }\n :host-state([gap=\"l\"]) {\n --_layout-gap: var(--ui-space-5);\n }\n :host-state([gap=\"xl\"]) {\n --_layout-gap: var(--ui-space-6);\n }\n :host-state([align=\"start\"]) {\n align-items: flex-start;\n }\n :host-state([align=\"end\"]) {\n align-items: flex-end;\n }\n :host-state([align=\"stretch\"]) {\n align-items: stretch;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-combobox/ui-combobox.html"},"contract":{"version":1,"name":"UiCombobox","tag":"ui-combobox","nativeElement":"div","props":{"allowCreate":{"type":"boolean","required":false,"target":{"attribute":"allowcreate"},"description":"Offers the current query as a new option.","default":false},"allowFreeText":{"type":"boolean","required":false,"target":{"attribute":"allowfreetext"},"description":"Allows values that do not match an authored option.","default":false},"clearable":{"type":"boolean","required":false,"target":{"attribute":"clearable"},"description":"clearable token.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"disclosure":{"type":"boolean","required":false,"target":{"attribute":"disclosure"},"description":"disclosure token.","default":false},"help":{"type":"string","required":false,"target":{"attribute":"help"},"description":"help token.","default":""},"items":{"type":{"kind":"list","item":{"kind":"object","fields":[{"name":"id","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"value","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"label","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"group","type":{"kind":"terminal","name":"string"},"optional":true},{"name":"disabled","type":{"kind":"terminal","name":"boolean"},"optional":true}],"open":false}},"required":false,"target":{"attribute":"items"},"description":"The selected items in multiple mode, as JSON."},"label":{"type":"string","required":false,"target":{"attribute":"label"},"description":"label token.","default":""},"labelVisibility":{"type":{"enum":["visible","sr-only"]},"required":false,"target":{"attribute":"labelvisibility"},"description":"labelVisibility token.","default":"visible"},"multiple":{"type":"boolean","required":false,"target":{"attribute":"multiple"},"description":"multiple token.","default":false},"name":{"type":"string","required":false,"target":{"attribute":"name"},"description":"name token.","default":""},"placeholder":{"type":"string","required":false,"target":{"attribute":"placeholder"},"description":"placeholder token.","default":""},"query":{"type":"string","required":false,"target":{"attribute":"query"},"description":"query token."},"readonly":{"type":"boolean","required":false,"target":{"attribute":"readonly"},"description":"Whether the current value may be selected but not edited.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"required token.","default":false},"size":{"type":{"enum":["sm","md"]},"required":false,"target":{"attribute":"size"},"description":"size token.","default":"md"},"tokenSeparators":{"type":{"kind":"list","item":{"kind":"terminal","name":"string"}},"required":false,"target":{"attribute":"tokenseparators"},"description":"tokenSeparators token."},"value":{"type":{"kind":"union","members":[{"kind":"terminal","name":"string"},{"kind":"terminal","name":"null"}]},"required":false,"target":{"attribute":"value"},"description":"The selected value in single mode."}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"label","attributes":[{"kind":"attribute","name":"for","expression":"format('%s-input', uid)","expressionPlan":{"source":"format('%s-input', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-input"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"sr-only","expression":"labelVisibility = 'sr-only'","expressionPlan":{"source":"labelVisibility = 'sr-only'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"labelVisibility"},"right":{"kind":"literal","value":"sr-only"}},"dependencies":["labelVisibility"]},"target":"class"}],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[]},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"text","value":"\n *"}],"flow":{"kind":"if","test":"required","testPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"control"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"field"}],"children":[{"kind":"slot","fallback":[],"name":"start"},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"item"},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"tabindex","value":"-1"},{"kind":"attribute","name":"data-index","expression":"index","expressionPlan":{"source":"index","ast":{"kind":"id","name":"index"},"dependencies":["index"]}},{"kind":"attribute","name":"disabled","expression":"disabled or readonly or item.disabled","expressionPlan":{"source":"disabled or readonly or item.disabled","ast":{"kind":"binary","op":"or","left":{"kind":"binary","op":"or","left":{"kind":"id","name":"disabled"},"right":{"kind":"id","name":"readonly"}},"right":{"kind":"member","object":{"kind":"id","name":"item"},"key":"disabled"}},"dependencies":["disabled","item.disabled","readonly"]}},{"kind":"attribute","name":"aria-label","expression":"format('%s, press Delete or Backspace to remove', item.label)","expressionPlan":{"source":"format('%s, press Delete or Backspace to remove', item.label)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s, press Delete or Backspace to remove"},{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"}]},"dependencies":["item.label"]}}],"children":[{"kind":"slot","fallback":[{"kind":"element","name":"ui-badge","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"nameExpression":{"source":"format('item-%s', item.id)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"item-%s"},{"kind":"member","object":{"kind":"id","name":"item"},"key":"id"}]},"dependencies":["item.id"]}}],"flow":{"kind":"each","item":"item","list":"internalItems","listPlan":{"source":"internalItems","ast":{"kind":"id","name":"internalItems"},"dependencies":["internalItems"]},"index":"index","key":"item.id","keyPlan":{"source":"item.id","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"id"},"dependencies":["item.id"]}}}],"flow":{"kind":"if","test":"multiple","testPlan":{"source":"multiple","ast":{"kind":"id","name":"multiple"},"dependencies":["multiple"]}}},{"kind":"element","name":"input","attributes":[{"kind":"attribute","name":"id","expression":"format('%s-input', uid)","expressionPlan":{"source":"format('%s-input', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-input"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"literal","name":"role","value":"combobox"},{"kind":"literal","name":"aria-autocomplete","value":"list"},{"kind":"literal","name":"autocomplete","value":"off"},{"kind":"attribute","name":"aria-controls","expression":"format('%s-listbox', uid)","expressionPlan":{"source":"format('%s-listbox', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-listbox"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"aria-expanded","expression":"expanded","expressionPlan":{"source":"expanded","ast":{"kind":"id","name":"expanded"},"dependencies":["expanded"]}},{"kind":"attribute","name":"aria-invalid","expression":"validationStatus = 'error'","expressionPlan":{"source":"validationStatus = 'error'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"validationStatus"},"right":{"kind":"literal","value":"error"}},"dependencies":["validationStatus"]}},{"kind":"attribute","name":"aria-busy","expression":"validationStatus = 'pending'","expressionPlan":{"source":"validationStatus = 'pending'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"validationStatus"},"right":{"kind":"literal","value":"pending"}},"dependencies":["validationStatus"]}},{"kind":"property","key":"value","name":"value","expression":"display","expressionPlan":{"source":"display","ast":{"kind":"id","name":"display"},"dependencies":["display"]}},{"kind":"attribute","name":"placeholder","expression":"placeholder","expressionPlan":{"source":"placeholder","ast":{"kind":"id","name":"placeholder"},"dependencies":["placeholder"]}},{"kind":"attribute","name":"name","expression":"name","expressionPlan":{"source":"name","ast":{"kind":"id","name":"name"},"dependencies":["name"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"readonly","expression":"readonly","expressionPlan":{"source":"readonly","ast":{"kind":"id","name":"readonly"},"dependencies":["readonly"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}}],"children":[],"ref":"input"},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"data-combobox-action","value":"clear"},{"kind":"literal","name":"aria-label","value":"Clear"}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"class","value":"affordance-icon"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M7 7l10 10M17 7 7 17"}],"children":[]}]}],"flow":{"kind":"if","test":"clearable","testPlan":{"source":"clearable","ast":{"kind":"id","name":"clearable"},"dependencies":["clearable"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"data-combobox-action","value":"disclosure"},{"kind":"literal","name":"tabindex","value":"-1"},{"kind":"literal","name":"aria-label","value":"Show suggestions"},{"kind":"attribute","name":"aria-controls","expression":"format('%s-listbox', uid)","expressionPlan":{"source":"format('%s-listbox', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-listbox"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"class","value":"affordance-icon"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2.25"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"m6 9 6 6 6-6"}],"children":[]}]}],"flow":{"kind":"if","test":"disclosure","testPlan":{"source":"disclosure","ast":{"kind":"id","name":"disclosure"},"dependencies":["disclosure"]}}}],"ref":"field"},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"help"},{"kind":"attribute","name":"id","expression":"format('%s-help', uid)","expressionPlan":{"source":"format('%s-help', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-help"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"aria-label","value":"Help"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"class","value":"help-icon"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"12"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"10"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3"}],"children":[]},{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M12 17h.01"}],"children":[]}]}],"flow":{"kind":"if","test":"help","testPlan":{"source":"help","ast":{"kind":"id","name":"help"},"dependencies":["help"]}}}]},{"kind":"element","name":"ui-tooltip","attributes":[{"kind":"literal","name":"trigger","value":"click"},{"kind":"attribute","name":"id","expression":"format('%s-help-text', uid)","expressionPlan":{"source":"format('%s-help-text', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-help-text"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"for","expression":"format('%s-help', uid)","expressionPlan":{"source":"format('%s-help', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-help"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}}],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"help","expressionPlan":{"source":"help","ast":{"kind":"id","name":"help"},"dependencies":["help"]}}],"children":[]}],"flow":{"kind":"if","test":"help","testPlan":{"source":"help","ast":{"kind":"id","name":"help"},"dependencies":["help"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"popup"},{"kind":"attribute","name":"hidden","expression":"not expanded","expressionPlan":{"source":"not expanded","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"expanded"}},"dependencies":["expanded"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"listbox"},{"kind":"attribute","name":"id","expression":"format('%s-listbox', uid)","expressionPlan":{"source":"format('%s-listbox', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-listbox"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"aria-label","expression":"format('%s suggestions', label)","expressionPlan":{"source":"format('%s suggestions', label)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s suggestions"},{"kind":"id","name":"label"}]},"dependencies":["label"]}},{"kind":"attribute","name":"aria-busy","expression":"loading","expressionPlan":{"source":"loading","ast":{"kind":"id","name":"loading"},"dependencies":["loading"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"attribute","name":"role","expression":"group.role","expressionPlan":{"source":"group.role","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"role"},"dependencies":["group.role"]}},{"kind":"attribute","name":"aria-label","expression":"group.label","expressionPlan":{"source":"group.label","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"label"},"dependencies":["group.label"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"group"},{"kind":"directive","name":"value","expression":"group.name","expressionPlan":{"source":"group.name","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"name"},"dependencies":["group.name"]}}],"children":[],"flow":{"kind":"if","test":"group.name","testPlan":{"source":"group.name","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"name"},"dependencies":["group.name"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"option"},{"kind":"attribute","name":"active","expression":"row.index = active","expressionPlan":{"source":"row.index = active","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"},"right":{"kind":"id","name":"active"}},"dependencies":["active","row.index"]},"target":"class"},{"kind":"literal","name":"role","value":"option"},{"kind":"attribute","name":"id","expression":"format('%s-option-%s', uid, row.index)","expressionPlan":{"source":"format('%s-option-%s', uid, row.index)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s"},{"kind":"id","name":"uid"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"}]},"dependencies":["row.index","uid"]}},{"kind":"attribute","name":"aria-selected","expression":"row.selected","expressionPlan":{"source":"row.selected","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"selected"},"dependencies":["row.selected"]}},{"kind":"attribute","name":"aria-disabled","expression":"row.disabled","expressionPlan":{"source":"row.disabled","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"disabled"},"dependencies":["row.disabled"]}},{"kind":"attribute","name":"data-index","expression":"row.index","expressionPlan":{"source":"row.index","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"index"},"dependencies":["row.index"]}}],"children":[{"kind":"slot","fallback":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"primary"},{"kind":"directive","name":"value","expression":"row.label","expressionPlan":{"source":"row.label","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"label"},"dependencies":["row.label"]}}],"children":[]}],"nameExpression":{"source":"format('option-%s', row.id)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"option-%s"},{"kind":"member","object":{"kind":"id","name":"row"},"key":"id"}]},"dependencies":["row.id"]}}],"flow":{"kind":"each","item":"row","list":"group.rows","listPlan":{"source":"group.rows","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"rows"},"dependencies":["group.rows"]},"key":"row.id","keyPlan":{"source":"row.id","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"id"},"dependencies":["row.id"]}}}],"flow":{"kind":"each","item":"group","list":"groups","listPlan":{"source":"groups","ast":{"kind":"id","name":"groups"},"dependencies":["groups"]},"key":"group.name","keyPlan":{"source":"group.name","ast":{"kind":"member","object":{"kind":"id","name":"group"},"key":"name"},"dependencies":["group.name"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"option"},{"kind":"attribute","name":"active","expression":"createIndex = active","expressionPlan":{"source":"createIndex = active","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"createIndex"},"right":{"kind":"id","name":"active"}},"dependencies":["active","createIndex"]},"target":"class"},{"kind":"literal","name":"role","value":"option"},{"kind":"literal","name":"aria-selected","value":"false"},{"kind":"attribute","name":"id","expression":"format('%s-option-%s', uid, createIndex)","expressionPlan":{"source":"format('%s-option-%s', uid, createIndex)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s"},{"kind":"id","name":"uid"},{"kind":"id","name":"createIndex"}]},"dependencies":["createIndex","uid"]}},{"kind":"attribute","name":"data-index","expression":"createIndex","expressionPlan":{"source":"createIndex","ast":{"kind":"id","name":"createIndex"},"dependencies":["createIndex"]}},{"kind":"directive","name":"value","expression":"format('Create “%s”', raw)","expressionPlan":{"source":"format('Create “%s”', raw)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"Create “%s”"},{"kind":"id","name":"raw"}]},"dependencies":["raw"]}}],"children":[],"flow":{"kind":"if","test":"creatable","testPlan":{"source":"creatable","ast":{"kind":"id","name":"creatable"},"dependencies":["creatable"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"message"},{"kind":"directive","name":"value","expression":"message","expressionPlan":{"source":"message","ast":{"kind":"id","name":"message"},"dependencies":["message"]}}],"children":[],"flow":{"kind":"if","test":"message","testPlan":{"source":"message","ast":{"kind":"id","name":"message"},"dependencies":["message"]}}}],"ref":"listbox"},{"kind":"slot","fallback":[],"name":"footer"}],"ref":"popup"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"message"},{"kind":"attribute","name":"id","expression":"format('%s-validation', uid)","expressionPlan":{"source":"format('%s-validation', uid)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-validation"},{"kind":"id","name":"uid"}]},"dependencies":["uid"]}},{"kind":"attribute","name":"hidden","expression":"not validation.issues.length","expressionPlan":{"source":"not validation.issues.length","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"member","object":{"kind":"id","name":"validation"},"key":"issues"},"key":"length"}},"dependencies":["validation.issues.length"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"directive","name":"value","expression":"issue.message","expressionPlan":{"source":"issue.message","ast":{"kind":"member","object":{"kind":"id","name":"issue"},"key":"message"},"dependencies":["issue.message"]}}],"children":[],"flow":{"kind":"each","item":"issue","list":"validation.issues","listPlan":{"source":"validation.issues","ast":{"kind":"member","object":{"kind":"id","name":"validation"},"key":"issues"},"dependencies":["validation.issues"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sr-only"},{"kind":"literal","name":"role","value":"status"},{"kind":"literal","name":"aria-live","value":"polite"},{"kind":"literal","name":"aria-atomic","value":"true"},{"kind":"directive","name":"value","expression":"statusText","expressionPlan":{"source":"statusText","ast":{"kind":"id","name":"statusText"},"dependencies":["statusText"]}}],"children":[]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"authored-options"},{"kind":"literal","name":"hidden","value":""},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"slot"}],"ref":"options"}]},"css":":host {\n display: grid;\n gap: var(--ui-space-1);\n min-inline-size: 0;\n color: var(--ui-text-primary);\n font: inherit;\n }\n label {\n color: var(--ui-combobox-label-text, var(--ui-text-primary));\n font-size: var(--ui-combobox-label-font-size, 0.875rem);\n font-weight: 500;\n }\n /* The field and anything that annotates it sit on one row; the help button is beside the box,\n not inside it, because a control's box holds its value. */\n .control {\n display: flex;\n align-items: center;\n gap: var(--ui-space-2);\n min-inline-size: 0;\n }\n\n .field {\n flex: 1 1 auto;\n display: flex;\n min-inline-size: 0;\n border: 1px solid var(--ui-control-border, var(--ui-border-default));\n border-radius: var(--ui-radius-md);\n background: var(--ui-control-surface, var(--ui-surface-default));\n box-shadow: var(--ui-control-inset);\n transition: border-color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease);\n }\n .field:focus-within {\n border-color: var(--ui-control-focus, var(--ui-accent-solid));\n box-shadow:\n var(--ui-control-inset),\n var(--ui-control-focus-halo-shadow);\n }\n /* A ghost icon button: the affordance is the mark, not a box around it. */\n .help {\n flex: none;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n inline-size: var(--ui-control-size-sm);\n block-size: var(--ui-control-size-sm);\n padding: 0;\n border: 0;\n border-radius: var(--ui-radius-round);\n background: transparent;\n color: var(--ui-text-secondary);\n cursor: pointer;\n transition: background-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .help:hover:enabled,\n .help[aria-expanded=\"true\"] {\n background: color-mix(in srgb, currentColor 8%, transparent);\n color: var(--ui-text-primary);\n }\n\n .help:focus-visible {\n outline: none;\n box-shadow: var(--ui-focus-halo);\n }\n\n .help:disabled {\n color: var(--ui-disabled-text);\n cursor: not-allowed;\n }\n\n .help-icon {\n inline-size: var(--ui-icon-size-sm);\n block-size: var(--ui-icon-size-sm);\n }\n\n input::selection {\n background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);\n color: inherit;\n }\n input {\n appearance: none;\n width: 100%;\n min-inline-size: 0;\n min-block-size: calc(var(--ui-control-size-md) - 2px);\n box-sizing: border-box;\n border: 0;\n border-radius: inherit;\n background: transparent;\n color: inherit;\n font: inherit;\n line-height: var(--ui-line-height-md);\n padding: var(--ui-space-2) var(--ui-space-3);\n margin: 0;\n outline: none;\n }\n :host-state([size=\"sm\"]) input {\n min-block-size: calc(var(--ui-control-size-sm) - 2px);\n padding: var(--ui-space-1) var(--ui-space-2);\n }\n button {\n appearance: none;\n display: inline-grid;\n place-items: center;\n align-self: stretch;\n border: 0;\n border-radius: var(--ui-radius-md);\n background: transparent;\n color: var(--ui-combobox-affordance-text, var(--ui-text-secondary));\n font: inherit;\n font-weight: 400;\n min-inline-size: 2rem;\n padding: 0 var(--ui-space-1);\n cursor: pointer;\n }\n .affordance-icon {\n display: block;\n inline-size: var(--ui-icon-size-sm);\n block-size: var(--ui-icon-size-sm);\n }\n button:hover:enabled {\n background: var(--ui-surface-muted);\n color: var(--ui-text-primary);\n }\n button:focus-visible {\n outline: none;\n background: var(--ui-surface-muted);\n box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--ui-focus-ring) 45%, transparent);\n }\n input:disabled, button:disabled {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n .field:has(input:disabled) {\n background: var(--ui-control-surface-disabled, var(--ui-surface-muted));\n }\n :host-state([validationStatus=\"error\"]) .field {\n border-color: var(--ui-danger-solid, var(--ui-accent-active));\n }\n .popup {\n box-sizing: border-box;\n min-inline-size: 12rem;\n max-inline-size: calc(100vw - 1rem);\n max-block-size: var(--ui-combobox-max-block-size, 18rem);\n overflow: auto;\n margin: 0;\n padding: var(--ui-space-1);\n border: 1px solid var(--ui-border-default);\n border-radius: var(--ui-radius-md);\n background: var(--ui-surface-elevated);\n color: var(--ui-text-primary);\n box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));\n }\n [hidden] {\n display: none;\n }\n .option {\n padding: var(--ui-space-2) var(--ui-space-3);\n border-radius: var(--ui-radius-sm);\n cursor: pointer;\n overflow-wrap: anywhere;\n }\n .option:hover, .option.active {\n background: var(--ui-surface-muted);\n outline: 1px solid var(--ui-focus-ring);\n outline-offset: -1px;\n }\n .option[aria-disabled=\"true\"] {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n .primary {\n display: block;\n color: var(--ui-combobox-option-text, var(--ui-text-primary));\n font-weight: 500;\n }\n .message, .group {\n color: var(--ui-combobox-message-text, var(--ui-text-secondary));\n font-weight: 400;\n font-size: var(--ui-font-size-sm);\n line-height: var(--ui-line-height-md);\n overflow-wrap: anywhere;\n }\n .group, .popup .message {\n padding: var(--ui-space-2) var(--ui-space-3);\n }\n .sr-only {\n position: absolute;\n inline-size: 1px;\n block-size: 1px;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n }\n @media (pointer: coarse) {\n button {\n min-inline-size: 2.75rem;\n min-block-size: 2.75rem;\n }\n }\n @media (forced-colors: active) {\n .field, .popup {\n border-color: CanvasText;\n }\n .option.active {\n outline-color: Highlight;\n }\n }\n\n /* Multiple mode: every option carries a checkbox, so a list that takes several answers says so\n before anything is picked. aria-selected is the state; this draws it.\n Longhands, not shorthands: lowering drops a shorthand that omits a component. */\n :host-state([multiple]) .option {\n display: flex;\n gap: var(--ui-space-2);\n align-items: center;\n }\n\n :host-state([multiple]) .option::before {\n content: \"\";\n flex: none;\n inline-size: 1.125rem;\n block-size: 1.125rem;\n border-style: solid;\n border-width: 1px;\n border-color: var(--ui-control-border-hover, var(--ui-border-strong));\n border-radius: var(--ui-radius-sm);\n background-color: var(--ui-control-surface, var(--ui-surface-default));\n background-repeat: no-repeat;\n background-position: center;\n background-size: 0.7rem;\n }\n\n :host-state([multiple]) .option[aria-selected=\"true\"]::before {\n border-color: var(--ui-accent-solid);\n background-color: var(--ui-accent-solid);\n background-image: var(\n --ui-combobox-option-check,\n url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-9'/%3E%3C/svg%3E\")\n );\n }\n\n /* Multiple mode: chips wrap before the cursor on one flexible field line. */\n :host-state([multiple]) .field {\n flex-wrap: wrap;\n align-items: center;\n gap: var(--ui-space-1);\n min-block-size: var(--ui-combobox-item-min-block-size, 2.5rem);\n padding: var(--ui-space-1);\n }\n :host-state([multiple]) input {\n flex: 1 0 var(--ui-combobox-item-input-min-inline-size, 5rem);\n width: auto;\n min-block-size: 1.75rem;\n padding: var(--ui-space-0-5) var(--ui-space-1);\n }\n .item {\n appearance: none;\n display: inline-flex;\n min-inline-size: 0;\n max-inline-size: min(100%, var(--ui-combobox-item-item-max-inline-size, 12rem));\n overflow: hidden;\n padding: 0;\n border: 0;\n border-radius: var(--ui-radius-sm);\n background: transparent;\n color: inherit;\n font: inherit;\n cursor: default;\n }\n .item:focus-visible {\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: 1px;\n }\n .item:disabled {\n opacity: 0.6;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalItems","type":"list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"raw","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"display","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"selected","type":"string | null","expression":{"source":"null","ast":{"kind":"literal","value":null},"dependencies":[]}},{"kind":"state","name":"expanded","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"rows","type":"list(object({ id: string, value: string, label: string, group?: string, disabled: boolean, selected: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"active","expression":{"source":"-1","ast":{"kind":"unary","op":"-","operand":{"kind":"literal","value":1}},"dependencies":[]}},{"kind":"state","name":"loading","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"helpOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"lookupError","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"validation","type":"object({ status: pristine | pending | valid | warning | error, touched: boolean, dirty: boolean, issues: list(object({ message: string })), ... })","expression":{"source":"{ status: 'pristine', touched: false, dirty: false, issues: [] }","ast":{"kind":"object","pairs":[{"key":"status","value":{"kind":"literal","value":"pristine"}},{"key":"touched","value":{"kind":"literal","value":false}},{"key":"dirty","value":{"kind":"literal","value":false}},{"key":"issues","value":{"kind":"array","items":[]}}]},"dependencies":[]}},{"kind":"state","name":"uid","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"groups","type":"list(object({ name: string, role: group | presentation, label: string | null, rows: list(object({ id: string, value: string, label: string, group?: string, disabled: boolean, selected: boolean, index: integer })) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"creatable","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"createIndex","expression":{"source":"0","ast":{"kind":"literal","value":0},"dependencies":[]}},{"kind":"state","name":"message","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"statusText","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"validationStatus","expression":{"source":"'pristine'","ast":{"kind":"literal","value":"pristine"},"dependencies":[]}},{"kind":"event","name":"query-change","type":"object({ query: string, display: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"value-change","type":"object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic }) | list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean }))","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"free-entry","type":"object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"create-entry","type":"object({ value: string | null, query: string, option: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }) | null, kind: selection | clear | free-entry | create, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"validation-change","type":"object({ status: pristine | pending | valid | warning | error, touched: boolean, dirty: boolean, issues: list(object({ message: string, path?: list(unknown), severity?: error | warning })), output?: unknown })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"options-change","type":"list(object({ id: string, value: string, label: string, group?: string, disabled?: boolean }))","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"add-item","type":"object({ item: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }), index: integer, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"remove-item","type":"object({ item: object({ id: string, value: string, label: string, group?: string, disabled?: boolean }), index: integer, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"create-item","type":"object({ query: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"method","name":"validate","exportName":"validate","returns":"promise(unknown)"},{"kind":"method","name":"focusInput","exportName":"focusInput","returns":"promise(undefined)"}],"slots":[{"dynamic":false,"required":true,"name":"start"},{"dynamic":true,"required":false},{"dynamic":true,"required":false},{"dynamic":false,"required":true,"name":"footer"},{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-combobox/ui-combobox.js"},{"source":{"file":"./components/ui-container/ui-container.html"},"contract":{"version":1,"name":"UiContainer","tag":"ui-container","nativeElement":"div","props":{"gutters":{"type":{"enum":["s","m","l"]},"required":false,"target":{"attribute":"gutters"},"description":"gutters token."},"measure":{"type":{"enum":["narrow","wide"]},"required":false,"target":{"attribute":"measure"},"description":"measure token."}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n --_container-measure: 65ch;\n --_container-gutters: var(--ui-space-4);\n display: block;\n inline-size: 100%;\n max-inline-size: var(--ui-container-measure, var(--_container-measure));\n margin-inline: auto;\n padding-inline: var(--ui-container-gutters, var(--_container-gutters));\n }\n\n :host-state([measure=\"narrow\"]) {\n --_container-measure: 45ch;\n }\n :host-state([measure=\"wide\"]) {\n --_container-measure: 80ch;\n }\n :host-state([gutters=\"s\"]) {\n --_container-gutters: var(--ui-space-3);\n }\n :host-state([gutters=\"m\"]) {\n --_container-gutters: var(--ui-space-4);\n }\n :host-state([gutters=\"l\"]) {\n --_container-gutters: var(--ui-space-5);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-context-menu/ui-context-menu.html"},"contract":{"version":1,"name":"UiContextMenu","tag":"ui-context-menu","nativeElement":"span","props":{"for":{"type":"string","required":false,"target":{"attribute":"for"},"description":"ID of the control that opens the menu by click, keyboard activation, or context click.","default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the context menu is open initially or when set externally.","default":false}}},"template":{"kind":"element","name":"span","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu"},{"kind":"literal","name":"role","value":"menu"},{"kind":"literal","name":"aria-orientation","value":"vertical"}],"children":[{"kind":"slot"}],"ref":"menu"}]},"css":":host {\n display: contents;\n }\n\n .menu {\n position: fixed;\n inset: auto;\n margin: 0;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n padding: var(--ui-space-1);\n background: var(--ui-surface-elevated);\n border: 1px solid var(--ui-border-default);\n border-radius: var(--ui-radius-lg);\n box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));\n outline: 0;\n overflow: auto;\n z-index: var(--ui-context-menu-z-index, 1000);\n min-width: 12rem;\n opacity: 0;\n transform: translateY(-4px) scale(0.99);\n transition:\n opacity var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease),\n display var(--ui-motion-fast) allow-discrete,\n overlay var(--ui-motion-fast) allow-discrete;\n }\n\n .menu:popover-open {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n @starting-style {\n .menu:popover-open {\n opacity: 0;\n transform: translateY(-4px) scale(0.99);\n }\n }\n\n .menu[hidden],\n .menu[popover]:not(:popover-open) {\n display: none;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .menu {\n transition: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"open","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"select","type":"object({ value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"span","choices":["span"]},"controller":"./components/ui-context-menu/ui-context-menu.js"},{"source":{"file":"./components/ui-dialog/ui-dialog.html"},"contract":{"version":1,"name":"UiDialog","tag":"ui-dialog","nativeElement":"dialog","props":{"dismissible":{"type":"boolean","required":false,"target":{"attribute":"dismissible"},"description":"Also close on Escape and on a pointer press outside the dialog. The header close button and actions always close it.","default":false},"for":{"type":"string","required":false,"target":{"attribute":"for"},"description":"ID of the control that opens the dialog.","default":""},"label":{"type":"string","required":false,"target":{"attribute":"label"},"description":"Visible title in the dialog header; also its accessible name."},"modal":{"type":"boolean","required":false,"target":{"attribute":"modal"},"description":"Open in the top layer with a backdrop and make the rest of the page inert.","default":false},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the dialog is open initially or when set externally.","default":false}}},"template":{"kind":"element","name":"dialog","attributes":[{"kind":"attribute","name":"aria-label","expression":"accessibleLabel","expressionPlan":{"source":"accessibleLabel","ast":{"kind":"id","name":"accessibleLabel"},"dependencies":["accessibleLabel"]}}],"children":[{"kind":"element","name":"header","attributes":[],"children":[{"kind":"element","name":"h2","attributes":[{"kind":"literal","name":"class","value":"title"},{"kind":"directive","name":"value","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[],"flow":{"kind":"if","test":"label","testPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"close"},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"aria-label","value":"Close"}],"children":[],"ref":"close"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"body"}],"children":[{"kind":"slot"}]},{"kind":"element","name":"footer","attributes":[],"children":[{"kind":"slot","fallback":[],"name":"actions"}]}]},"css":":host {\n position: fixed;\n inset: 0;\n box-sizing: border-box;\n inline-size: min(\n calc(100% - var(--ui-dialog-viewport-gap, var(--ui-space-4)) * 2),\n var(--ui-dialog-max-width, 440px)\n );\n max-inline-size: none;\n max-block-size: calc(100dvh - var(--ui-dialog-viewport-gap, var(--ui-space-4)) * 2);\n margin: auto;\n padding: 0;\n overflow: hidden;\n flex-direction: column;\n background: var(--ui-surface-elevated);\n border: 1px solid var(--ui-border-default);\n border-radius: var(--ui-radius-dialog);\n box-shadow: var(--ui-elevation-dialog, var(--ui-shadow-xl));\n visibility: hidden;\n pointer-events: none;\n opacity: 0;\n transform: scale(0.96);\n transition:\n opacity var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease),\n transform var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease),\n visibility var(--ui-dialog-duration, var(--ui-motion-base)),\n display var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease) allow-discrete,\n overlay var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease) allow-discrete;\n }\n\n :host[open] {\n display: flex;\n visibility: visible;\n pointer-events: auto;\n opacity: 1;\n transform: scale(1);\n animation: ui-dialog-enter var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease);\n }\n\n /* Header and actions stay pinned; only the body scrolls when content is long. */\n header {\n display: flex;\n align-items: center;\n gap: var(--ui-space-3);\n flex: none;\n padding: var(--ui-space-3) var(--ui-space-3) var(--ui-space-3) var(--ui-space-5);\n border-block-end: 1px solid var(--ui-border-default);\n }\n\n /* :host-qualified so page heading rules that reach in cannot outrank the dialog chrome. */\n :host .title {\n flex: 1;\n min-inline-size: 0;\n margin: 0;\n padding: 0;\n border: 0;\n color: var(--ui-text-primary);\n letter-spacing: normal;\n font-size: var(--ui-font-size-lg);\n font-weight: var(--ui-font-semibold);\n line-height: var(--ui-line-height-tight);\n }\n\n .close {\n display: inline-grid;\n place-items: center;\n flex: none;\n margin-inline-start: auto;\n inline-size: var(--ui-control-size-sm);\n block-size: var(--ui-control-size-sm);\n padding: 0;\n border: 0;\n border-radius: var(--ui-radius-round);\n background: transparent;\n color: var(--ui-text-secondary);\n cursor: pointer;\n transition: background-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* A CSS-drawn X. */\n .close::before,\n .close::after {\n content: \"\";\n grid-area: 1 / 1;\n inline-size: 0.875rem;\n block-size: 1.5px;\n border-radius: 1px;\n background: currentColor;\n transform: rotate(45deg);\n }\n\n .close::after {\n transform: rotate(-45deg);\n }\n\n .close:hover {\n background: var(--ui-surface-muted);\n color: var(--ui-text-primary);\n }\n\n .close:focus-visible {\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: 2px;\n }\n\n /* A touch target, like Button on coarse pointers. */\n @media (pointer: coarse) {\n .close {\n inline-size: var(--ui-control-min-block-size);\n block-size: var(--ui-control-min-block-size);\n }\n }\n\n html[data-ui-input-modality=\"touch\"] :host .close {\n inline-size: var(--ui-control-min-block-size);\n block-size: var(--ui-control-min-block-size);\n }\n\n .body {\n flex: 1 1 auto;\n min-block-size: 0;\n overflow: auto;\n overscroll-behavior: contain;\n padding: var(--ui-space-5);\n }\n\n footer {\n display: flex;\n flex: none;\n flex-wrap: wrap;\n justify-content: flex-end;\n gap: var(--ui-space-2);\n padding: var(--ui-space-3) var(--ui-space-5);\n border-block-start: 1px solid var(--ui-border-default);\n }\n\n footer:empty {\n display: none;\n }\n\n @keyframes ui-dialog-enter {\n from {\n opacity: 0;\n transform: scale(0.96);\n }\n }\n\n :host::backdrop {\n background-color: transparent;\n transition:\n background-color var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease),\n display var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease) allow-discrete,\n overlay var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease) allow-discrete;\n }\n\n :host[open]::backdrop {\n background-color: var(--ui-overlay-backdrop);\n animation: ui-dialog-backdrop-enter var(--ui-dialog-duration, var(--ui-motion-base)) var(--ui-motion-ease);\n }\n\n @keyframes ui-dialog-backdrop-enter {\n from {\n background-color: transparent;\n }\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"accessibleLabel","expression":{"source":"'Dialog'","ast":{"kind":"literal","value":"Dialog"},"dependencies":[]}},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true},{"dynamic":false,"required":true,"name":"actions"}],"root":{"kind":"native","element":"dialog","choices":["dialog"]},"controller":"./components/ui-dialog/ui-dialog.js"},{"source":{"file":"./components/ui-disclosure/ui-disclosure.html"},"contract":{"version":1,"name":"UiDisclosure","tag":"ui-disclosure","nativeElement":"div","props":{"density":{"type":{"enum":["comfortable","compact"]},"required":false,"target":{"attribute":"density"},"description":"Compact trades padding and type size for rows that fit more on screen.","default":"comfortable"},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"open token.","default":false},"summary":{"type":"string","required":false,"target":{"attribute":"summary"},"description":"summary token.","default":"Details"}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"trigger"},{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"aria-controls","expression":"contentId","expressionPlan":{"source":"contentId","ast":{"kind":"id","name":"contentId"},"dependencies":["contentId"]}},{"kind":"attribute","name":"aria-expanded","expression":"internalOpen","expressionPlan":{"source":"internalOpen","ast":{"kind":"id","name":"internalOpen"},"dependencies":["internalOpen"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"summary","expressionPlan":{"source":"summary","ast":{"kind":"id","name":"summary"},"dependencies":["summary"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"chevron"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]}],"ref":"trigger"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"panel"},{"kind":"attribute","name":"id","expression":"contentId","expressionPlan":{"source":"contentId","ast":{"kind":"id","name":"contentId"},"dependencies":["contentId"]}},{"kind":"attribute","name":"inert","expression":"not internalOpen","expressionPlan":{"source":"not internalOpen","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"internalOpen"}},"dependencies":["internalOpen"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"panel-inner"}],"children":[{"kind":"slot"}]}]}]},"css":"/* Density resolves into the summary row's own values; the public tokens still override them. */\n :host {\n --_trigger-min-block-size: var(--ui-control-size);\n --_trigger-padding-block: var(--ui-space-2);\n --_trigger-padding-inline: var(--ui-space-3);\n }\n\n :host-state([density=\"compact\"]) {\n --_trigger-min-block-size: var(--ui-control-size-sm);\n --_trigger-padding-block: var(--ui-space-1);\n --_trigger-padding-inline: var(--ui-space-2);\n }\n\n /* An accordion row, not a field: no enclosing box, just a divider, so it never reads as a\n * select or combobox. Stacked disclosures share their dividers. */\n :host {\n display: block;\n inline-size: 100%;\n overflow: clip;\n border-block-end: 1px solid var(--ui-border-default);\n color: var(--ui-text-primary);\n }\n\n .trigger {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n gap: var(--ui-space-3);\n align-items: center;\n inline-size: 100%;\n min-block-size: var(--ui-disclosure-trigger-min-block-size, var(--_trigger-min-block-size));\n padding: var(--ui-disclosure-trigger-padding-block, var(--_trigger-padding-block))\n var(--ui-disclosure-trigger-padding-inline, var(--_trigger-padding-inline));\n border: 0;\n background: transparent;\n color: inherit;\n font: inherit;\n font-weight: var(--ui-font-semibold);\n text-align: start;\n cursor: pointer;\n border-radius: var(--ui-radius-sm);\n transition: background-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .trigger:hover:not(:disabled) {\n background: var(--ui-surface-muted);\n }\n .trigger:focus-visible {\n outline: none;\n box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--ui-focus-ring) 45%, transparent);\n }\n .trigger:disabled {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n\n .chevron {\n inline-size: 0.5rem;\n block-size: 0.5rem;\n border-inline-end: 2px solid currentColor;\n border-block-end: 2px solid currentColor;\n transform: rotate(45deg) translate(-1px, -1px);\n transition: transform var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .panel {\n display: grid;\n grid-template-rows: 0fr;\n transition: grid-template-rows var(--ui-motion-fast) var(--ui-motion-ease-out, var(--ui-motion-ease));\n }\n\n .panel-inner {\n min-block-size: 0;\n overflow: hidden;\n padding-inline: var(--ui-space-3);\n }\n\n :host-state([internalOpen]) .panel {\n grid-template-rows: 1fr;\n }\n :host-state([internalOpen]) .panel-inner {\n padding-block: 0 var(--ui-space-3);\n }\n :host-state([internalOpen]) .chevron {\n transform: rotate(225deg) translate(-1px, -1px);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .panel,\n .chevron {\n transition: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"contentId","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"event","name":"open","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-disclosure/ui-disclosure.js"},{"source":{"file":"./components/ui-editable/ui-editable.html"},"contract":{"version":1,"name":"UiEditable","tag":"ui-editable","nativeElement":"div","props":{"actions":{"type":"boolean","required":false,"target":{"attribute":"actions"},"description":"Show explicit Save and Cancel buttons while editing. Without them, Enter or leaving the field saves and Escape cancels.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"Prevents entering or changing edit mode.","default":false},"edit":{"type":"boolean","required":false,"target":{"attribute":"edit"},"description":"Whether edit mode is active initially or when set externally.","default":false},"hint":{"type":"string","required":false,"target":{"attribute":"hint"},"description":"Optional text shown beside the value to signal it is editable (for example \"Edit\").","default":""},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"Accessible name for the editor.","default":"Edit value"},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"The displayed and initial editable value.","default":""}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"field"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"preview"},{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"text"},{"kind":"directive","name":"value","expression":"internalValue","expressionPlan":{"source":"internalValue","ast":{"kind":"id","name":"internalValue"},"dependencies":["internalValue"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"hint"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"directive","name":"value","expression":"hint","expressionPlan":{"source":"hint","ast":{"kind":"id","name":"hint"},"dependencies":["hint"]}}],"children":[],"flow":{"kind":"if","test":"hint","testPlan":{"source":"hint","ast":{"kind":"id","name":"hint"},"dependencies":["hint"]}}}],"ref":"preview"},{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"class","value":"input"},{"kind":"literal","name":"type","value":"text"},{"kind":"property","key":"value","name":"value","expression":"draft","expressionPlan":{"source":"draft","ast":{"kind":"id","name":"draft"},"dependencies":["draft"]}},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}},{"kind":"attribute","name":"disabled","expression":"disabled or not internalEdit","expressionPlan":{"source":"disabled or not internalEdit","ast":{"kind":"binary","op":"or","left":{"kind":"id","name":"disabled"},"right":{"kind":"unary","op":"not","operand":{"kind":"id","name":"internalEdit"}}},"dependencies":["disabled","internalEdit"]}}],"children":[],"ref":"input"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"actions"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"save"},{"kind":"literal","name":"type","value":"button"}],"children":[{"kind":"text","value":"Save"}]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"cancel"},{"kind":"literal","name":"type","value":"button"}],"children":[{"kind":"text","value":"Cancel"}]}],"flow":{"kind":"if","test":"actions","testPlan":{"source":"actions","ast":{"kind":"id","name":"actions"},"dependencies":["actions"]}}}]},"css":":host {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: var(--ui-space-2);\n min-inline-size: 0;\n color: var(--ui-text-primary);\n }\n\n /* The value and the input share one grid cell with identical box metrics, so switching between\n * display and edit never changes the control's size or moves the text. */\n .field {\n display: inline-grid;\n min-inline-size: 8rem;\n max-inline-size: 100%;\n }\n\n .preview,\n .input {\n grid-area: 1 / 1;\n box-sizing: border-box;\n min-block-size: var(--ui-control-size-sm);\n margin: 0;\n padding: var(--ui-space-1) var(--ui-space-2);\n border: 1px solid transparent;\n border-radius: var(--ui-radius-md);\n font: inherit;\n line-height: var(--ui-line-height-md);\n color: inherit;\n transition:\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .preview {\n display: inline-flex;\n gap: var(--ui-space-2);\n align-items: center;\n background: transparent;\n text-align: start;\n cursor: pointer;\n }\n\n .preview:hover:not(:disabled) {\n background: var(--ui-surface-muted);\n }\n\n .preview:focus-visible {\n outline: none;\n box-shadow: var(--ui-focus-halo);\n }\n\n .hint {\n color: var(--ui-text-secondary);\n font-size: var(--ui-font-size-sm);\n }\n\n /* Contained so it takes the value's width instead of its own default input width. */\n .input {\n contain: inline-size;\n inline-size: 100%;\n min-inline-size: 0;\n visibility: hidden;\n background: var(--ui-control-surface, var(--ui-surface-elevated));\n }\n\n .input:focus {\n outline: none;\n border-color: var(--ui-control-focus, var(--ui-accent-solid));\n box-shadow:\n var(--ui-control-inset),\n var(--ui-control-focus-halo-shadow);\n }\n\n .input::selection {\n background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);\n }\n\n :host-state([internalEdit]) .preview {\n visibility: hidden;\n }\n :host-state([internalEdit]) .input {\n visibility: visible;\n }\n\n .actions {\n display: none;\n gap: var(--ui-space-1);\n }\n :host-state([internalEdit]) .actions {\n display: inline-flex;\n }\n\n .actions button {\n min-block-size: var(--ui-control-size-sm);\n padding: 0 var(--ui-space-3);\n border: 1px solid var(--ui-border-strong);\n border-radius: var(--ui-radius-md);\n background: var(--ui-surface-elevated);\n background-image: var(--ui-raised-highlight);\n box-shadow: var(--ui-raised);\n color: inherit;\n font: inherit;\n font-size: var(--ui-font-size-sm);\n cursor: pointer;\n }\n\n .actions .save {\n border-color: var(--ui-accent-solid);\n background: var(--ui-accent-solid);\n color: var(--ui-text-on-accent);\n }\n\n .actions button:focus-visible {\n outline: none;\n box-shadow: var(--ui-focus-halo);\n }\n\n :host-state([disabled]) .preview {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalEdit","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"internalValue","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"draft","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"event","name":"input","type":"object({ value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"change","type":"object({ value: string, previousValue: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"edit-change","type":"object({ edit: boolean, reason: activate | commit | cancel | light-dismiss | escape | programmatic, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editable/ui-editable.js"},{"source":{"file":"./components/ui-editor-insert-table-grid/ui-editor-insert-table-grid.html"},"contract":{"version":1,"name":"UiEditorInsertTableGrid","tag":"ui-editor-insert-table-grid","nativeElement":"div","props":{"headerRow":{"type":"boolean","required":false,"target":{"attribute":"headerrow"},"description":"Whether table insertion initially includes a header row.","default":false},"maxCols":{"type":{"kind":"terminal","name":"integer"},"required":false,"target":{"attribute":"maxcols"},"description":"The most columns the grid offers (at most 10).","default":8},"maxRows":{"type":{"kind":"terminal","name":"integer"},"required":false,"target":{"attribute":"maxrows"},"description":"The most rows the grid offers (at most 10).","default":8},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the grid is shown.","default":false}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"p","attributes":[{"kind":"literal","name":"class","value":"hint"},{"kind":"directive","name":"value","expression":"hint","expressionPlan":{"source":"hint","ast":{"kind":"id","name":"hint"},"dependencies":["hint"]}}],"children":[]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"grid"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Table dimensions"},{"kind":"attribute","name":"--_rows","expression":"rows","expressionPlan":{"source":"rows","ast":{"kind":"id","name":"rows"},"dependencies":["rows"]},"target":"style"},{"kind":"attribute","name":"--_cols","expression":"cols","expressionPlan":{"source":"cols","ast":{"kind":"id","name":"cols"},"dependencies":["cols"]},"target":"style"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"cell"},{"kind":"attribute","name":"selected","expression":"cell.selected","expressionPlan":{"source":"cell.selected","ast":{"kind":"member","object":{"kind":"id","name":"cell"},"key":"selected"},"dependencies":["cell.selected"]},"target":"class"},{"kind":"attribute","name":"data-row","expression":"cell.row","expressionPlan":{"source":"cell.row","ast":{"kind":"member","object":{"kind":"id","name":"cell"},"key":"row"},"dependencies":["cell.row"]}},{"kind":"attribute","name":"data-col","expression":"cell.col","expressionPlan":{"source":"cell.col","ast":{"kind":"member","object":{"kind":"id","name":"cell"},"key":"col"},"dependencies":["cell.col"]}},{"kind":"attribute","name":"aria-label","expression":"cell.label","expressionPlan":{"source":"cell.label","ast":{"kind":"member","object":{"kind":"id","name":"cell"},"key":"label"},"dependencies":["cell.label"]}},{"kind":"attribute","name":"aria-pressed","expression":"cell.selected","expressionPlan":{"source":"cell.selected","ast":{"kind":"member","object":{"kind":"id","name":"cell"},"key":"selected"},"dependencies":["cell.selected"]}}],"children":[],"flow":{"kind":"each","item":"cell","list":"cells","listPlan":{"source":"cells","ast":{"kind":"id","name":"cells"},"dependencies":["cells"]},"key":"cell.key","keyPlan":{"source":"cell.key","ast":{"kind":"member","object":{"kind":"id","name":"cell"},"key":"key"},"dependencies":["cell.key"]}}}]},{"kind":"element","name":"label","attributes":[{"kind":"literal","name":"class","value":"header"}],"children":[{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"checkbox"},{"kind":"property","key":"checked","name":"checked","expression":"withHeaderRow","expressionPlan":{"source":"withHeaderRow","ast":{"kind":"id","name":"withHeaderRow"},"dependencies":["withHeaderRow"]}}],"children":[],"ref":"header"},{"kind":"text","value":" Header row"}]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"insert"}],"children":[{"kind":"text","value":"Insert table"}],"ref":"insert"}]},"css":":host {\n padding: var(--ui-space-3);\n background: var(--ui-surface);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-md);\n box-shadow: var(--ui-shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));\n }\n\n .hint {\n margin: 0 0 var(--ui-space-2);\n font-size: var(--ui-font-size-sm);\n color: var(--ui-text-muted);\n }\n\n .grid {\n display: grid;\n grid-template-columns: repeat(var(--_cols, 8), 1.25rem);\n grid-template-rows: repeat(var(--_rows, 8), 1.25rem);\n gap: 2px;\n margin-bottom: var(--ui-space-2);\n }\n\n .cell {\n width: 1.25rem;\n height: 1.25rem;\n padding: 0;\n border: 1px solid var(--ui-border);\n border-radius: 2px;\n background: var(--ui-surface);\n cursor: pointer;\n }\n\n .cell.selected {\n background: var(--ui-accent-solid, var(--ui-accent));\n border-color: var(--ui-accent-solid, var(--ui-accent));\n }\n\n .header {\n display: block;\n margin-bottom: var(--ui-space-2);\n font-size: var(--ui-font-size-sm);\n cursor: pointer;\n }\n\n :host .insert {\n width: 100%;\n padding: var(--ui-space-2) var(--ui-space-3);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-sm);\n background: var(--ui-accent-solid, var(--ui-accent));\n color: var(--ui-accent-contrast);\n font-size: var(--ui-font-size-sm);\n cursor: pointer;\n }\n\n :host .insert:hover {\n filter: brightness(1.05);\n }\n\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"cells","type":"list(object({ key: string, row: integer, col: integer, label: string, selected: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"rows","expression":{"source":"8","ast":{"kind":"literal","value":8},"dependencies":[]}},{"kind":"state","name":"cols","expression":{"source":"8","ast":{"kind":"literal","value":8},"dependencies":[]}},{"kind":"state","name":"hint","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"withHeaderRow","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"insert","type":"object({ rows: integer, cols: integer, withHeaderRow: boolean })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editor-insert-table-grid/ui-editor-insert-table-grid.js"},{"source":{"file":"./components/ui-editor-mention-menu/ui-editor-mention-menu.html"},"contract":{"version":1,"name":"UiEditorMentionMenu","tag":"ui-editor-mention-menu","nativeElement":"div","props":{"anchorRect":{"type":{"kind":"union","members":[{"kind":"object","fields":[{"name":"left","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"top","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"right","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"bottom","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"x","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"y","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"width","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"height","type":{"kind":"terminal","name":"number"},"optional":true}],"open":false},{"kind":"terminal","name":"null"}]},"required":false,"target":{"attribute":"anchorrect"},"description":"Where the @ was typed, in viewport coordinates."},"items":{"type":{"kind":"list","item":{"kind":"object","fields":[{"name":"id","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"label","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"detail","type":{"kind":"terminal","name":"string"},"optional":true},{"name":"initials","type":{"kind":"terminal","name":"string"},"optional":true}],"open":false}},"required":false,"target":{"attribute":"items"},"description":"The people the menu offers."},"loading":{"type":"boolean","required":false,"target":{"attribute":"aria-busy"},"description":"Whether a search is in progress.","default":false},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the menu is open.","default":false},"query":{"type":"string","required":false,"target":{"attribute":"query"},"description":"The text typed after the @.","default":""},"selectedIndex":{"type":{"kind":"terminal","name":"integer"},"required":false,"target":{"attribute":"selectedindex"},"description":"The highlighted person.","default":0}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"listbox"},{"kind":"literal","name":"aria-label","value":"Mention a person"},{"kind":"attribute","name":"aria-busy","expression":"loading","expressionPlan":{"source":"loading","ast":{"kind":"id","name":"loading"},"dependencies":["loading"]}},{"kind":"attribute","name":"hidden","expression":"not visible","expressionPlan":{"source":"not visible","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"visible"}},"dependencies":["visible"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"header"}],"children":[{"kind":"element","name":"span","attributes":[],"children":[{"kind":"text","value":"People"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"hint"}],"children":[{"kind":"text","value":"Type after @ to search"}]}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"loading"},{"kind":"literal","name":"role","value":"status"}],"children":[{"kind":"text","value":"Searching…"}],"flow":{"kind":"if","test":"searching","testPlan":{"source":"searching","ast":{"kind":"id","name":"searching"},"dependencies":["searching"]}}},{"kind":"element","name":"ul","attributes":[{"kind":"literal","name":"class","value":"list"},{"kind":"literal","name":"role","value":"presentation"}],"children":[{"kind":"element","name":"li","attributes":[{"kind":"attribute","name":"id","expression":"format('%s-option-%s', prefix, index)","expressionPlan":{"source":"format('%s-option-%s', prefix, index)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-option-%s"},{"kind":"id","name":"prefix"},{"kind":"id","name":"index"}]},"dependencies":["index","prefix"]}},{"kind":"literal","name":"class","value":"item"},{"kind":"attribute","name":"active","expression":"index = active","expressionPlan":{"source":"index = active","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"index"},"right":{"kind":"id","name":"active"}},"dependencies":["active","index"]},"target":"class"},{"kind":"literal","name":"role","value":"option"},{"kind":"attribute","name":"aria-selected","expression":"index = active","expressionPlan":{"source":"index = active","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"index"},"right":{"kind":"id","name":"active"}},"dependencies":["active","index"]}},{"kind":"attribute","name":"data-index","expression":"index","expressionPlan":{"source":"index","ast":{"kind":"id","name":"index"},"dependencies":["index"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"avatar"},{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"directive","name":"value","expression":"row.initials","expressionPlan":{"source":"row.initials","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"initials"},"dependencies":["row.initials"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"body"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"label"},{"kind":"directive","name":"value","expression":"row.label","expressionPlan":{"source":"row.label","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"label"},"dependencies":["row.label"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"detail"},{"kind":"directive","name":"value","expression":"row.detail","expressionPlan":{"source":"row.detail","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"detail"},"dependencies":["row.detail"]}}],"children":[],"flow":{"kind":"if","test":"row.detail","testPlan":{"source":"row.detail","ast":{"kind":"member","object":{"kind":"id","name":"row"},"key":"detail"},"dependencies":["row.detail"]}}}]}],"flow":{"kind":"each","item":"row","list":"rows","listPlan":{"source":"rows","ast":{"kind":"id","name":"rows"},"dependencies":["rows"]},"index":"index"}}],"flow":{"kind":"if","test":"not searching","testPlan":{"source":"not searching","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"searching"}},"dependencies":["searching"]}}}]},"css":":host {\n user-select: none;\n }\n\n :host {\n display: flex;\n overflow: hidden;\n flex-direction: column;\n background: var(--ui-surface);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-dialog);\n box-shadow: var(--ui-shadow-lg, 0 8px 24px rgb(0 0 0 / 0.12));\n }\n\n .header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--ui-space-3);\n padding: var(--ui-space-2) var(--ui-space-3);\n color: var(--ui-text-secondary);\n border-bottom: 1px solid var(--ui-border);\n font-size: var(--ui-font-size-xs);\n font-weight: var(--ui-font-semibold);\n }\n\n .hint {\n overflow: hidden;\n color: var(--ui-text-muted);\n font-weight: var(--ui-font-normal);\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .list {\n max-height: 280px;\n padding: var(--ui-space-1) 0;\n margin: 0;\n overflow-y: auto;\n overscroll-behavior: contain;\n list-style: none;\n }\n\n .item {\n display: flex;\n align-items: center;\n min-height: 44px;\n padding: var(--ui-space-2) var(--ui-space-3);\n gap: var(--ui-space-3);\n cursor: pointer;\n }\n\n .item.active {\n background: var(--ui-accent-subtle, rgb(59 130 246 / 0.1));\n }\n\n .avatar {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n flex: 0 0 auto;\n color: var(--ui-accent-active, var(--ui-accent-solid));\n background: var(--ui-accent-soft, var(--ui-accent-subtle));\n border-radius: 999px;\n font-size: var(--ui-font-size-xs);\n font-weight: var(--ui-font-semibold);\n }\n\n .body {\n display: flex;\n min-width: 0;\n flex-direction: column;\n }\n\n .label,\n .detail {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .label {\n color: var(--ui-text-primary);\n font-size: var(--ui-font-size-sm);\n font-weight: var(--ui-font-medium);\n }\n\n .detail,\n .loading {\n color: var(--ui-text-muted);\n font-size: var(--ui-font-size-xs);\n }\n\n .loading {\n min-height: 44px;\n padding: var(--ui-space-3);\n }\n\n @media (max-width: 767px) {\n :host {\n border-bottom: 0;\n border-radius: var(--ui-radius-dialog) var(--ui-radius-dialog) 0 0;\n }\n\n .list {\n max-height: calc(60dvh - 48px);\n }\n }\n\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"visible","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"rows","type":"list(object({ id: string, label: string, detail?: string, initials: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"searching","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"active","expression":{"source":"0","ast":{"kind":"literal","value":0},"dependencies":[]}},{"kind":"state","name":"prefix","expression":{"source":"'ui-editor-mention-menu'","ast":{"kind":"literal","value":"ui-editor-mention-menu"},"dependencies":[]}},{"kind":"event","name":"highlight","type":"object({ index: integer })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"select","type":"object({ index: integer })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editor-mention-menu/ui-editor-mention-menu.js"},{"source":{"file":"./components/ui-editor-slash-menu/ui-editor-slash-menu.html"},"contract":{"version":1,"name":"UiEditorSlashMenu","tag":"ui-editor-slash-menu","nativeElement":"div","props":{"anchorRect":{"type":{"kind":"union","members":[{"kind":"object","fields":[{"name":"left","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"top","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"right","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"bottom","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"x","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"y","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"width","type":{"kind":"terminal","name":"number"},"optional":true},{"name":"height","type":{"kind":"terminal","name":"number"},"optional":true}],"open":false},{"kind":"terminal","name":"null"}]},"required":false,"target":{"attribute":"anchorrect"},"description":"Where the slash was typed, in viewport coordinates."},"items":{"type":{"kind":"list","item":{"kind":"object","fields":[{"name":"title","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"description","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"icon","type":{"kind":"terminal","name":"string"},"optional":false}],"open":false}},"required":false,"target":{"attribute":"items"},"description":"The blocks the menu offers."},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the menu is open.","default":false},"query":{"type":"string","required":false,"target":{"attribute":"query"},"description":"The text typed after the slash.","default":""},"selectedIndex":{"type":{"kind":"terminal","name":"integer"},"required":false,"target":{"attribute":"selectedindex"},"description":"The highlighted item.","default":0}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"listbox"},{"kind":"literal","name":"aria-label","value":"Insert block"},{"kind":"attribute","name":"hidden","expression":"not visible","expressionPlan":{"source":"not visible","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"visible"}},"dependencies":["visible"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"header"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"header-label"}],"children":[{"kind":"text","value":"Insert"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"header-query"},{"kind":"directive","name":"value","expression":"query","expressionPlan":{"source":"query","ast":{"kind":"id","name":"query"},"dependencies":["query"]}}],"children":[],"flow":{"kind":"if","test":"query","testPlan":{"source":"query","ast":{"kind":"id","name":"query"},"dependencies":["query"]}}}]},{"kind":"element","name":"ul","attributes":[{"kind":"literal","name":"class","value":"list"},{"kind":"literal","name":"role","value":"presentation"}],"children":[{"kind":"element","name":"li","attributes":[{"kind":"literal","name":"class","value":"item"},{"kind":"attribute","name":"active","expression":"index = active","expressionPlan":{"source":"index = active","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"index"},"right":{"kind":"id","name":"active"}},"dependencies":["active","index"]},"target":"class"},{"kind":"literal","name":"role","value":"option"},{"kind":"attribute","name":"aria-selected","expression":"index = active","expressionPlan":{"source":"index = active","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"index"},"right":{"kind":"id","name":"active"}},"dependencies":["active","index"]}},{"kind":"attribute","name":"data-index","expression":"index","expressionPlan":{"source":"index","ast":{"kind":"id","name":"index"},"dependencies":["index"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"icon"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"body"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"title"},{"kind":"directive","name":"value","expression":"item.title","expressionPlan":{"source":"item.title","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"title"},"dependencies":["item.title"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"description"},{"kind":"directive","name":"value","expression":"item.description","expressionPlan":{"source":"item.description","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"description"},"dependencies":["item.description"]}}],"children":[]}]}],"flow":{"kind":"each","item":"item","list":"items","listPlan":{"source":"items","ast":{"kind":"id","name":"items"},"dependencies":["items"]},"index":"index"}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"footer"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"kbd","attributes":[],"children":[{"kind":"text","value":"↑↓"}]},{"kind":"text","value":" navigate · "},{"kind":"element","name":"kbd","attributes":[],"children":[{"kind":"text","value":"↵"}]},{"kind":"text","value":" insert · "},{"kind":"element","name":"kbd","attributes":[],"children":[{"kind":"text","value":"Esc"}]},{"kind":"text","value":" close\n "}]}]},"css":":host {\n user-select: none;\n }\n\n :host {\n background: var(--ui-surface);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-dialog);\n box-shadow: var(--ui-shadow-lg, 0 8px 24px rgb(0 0 0 / 0.12));\n overflow: hidden;\n display: flex;\n flex-direction: column;\n }\n\n @media (max-width: 767px) {\n :host {\n border-radius: var(--ui-radius-dialog) var(--ui-radius-dialog) 0 0;\n border-bottom: none;\n }\n }\n\n .header {\n display: none;\n align-items: center;\n gap: var(--ui-space-2);\n padding: var(--ui-space-3) var(--ui-space-4);\n border-bottom: 1px solid var(--ui-border);\n font-size: var(--ui-font-size-xs);\n color: var(--ui-text-muted);\n font-weight: var(--ui-font-semibold);\n text-transform: uppercase;\n letter-spacing: 0.05em;\n }\n\n @media (max-width: 767px) {\n .header {\n display: flex;\n }\n }\n\n .header-query {\n background: var(--ui-surface-hover);\n border-radius: var(--ui-radius-sm);\n padding: 0.1em 0.4em;\n font-family: var(--ui-font-family-mono, ui-monospace, monospace);\n font-size: var(--ui-font-size-xs);\n color: var(--ui-accent);\n text-transform: none;\n letter-spacing: 0;\n }\n\n .list {\n list-style: none;\n margin: 0;\n padding: var(--ui-space-1) 0;\n overflow-y: auto;\n max-height: 280px;\n overscroll-behavior: contain;\n }\n\n @media (max-width: 767px) {\n .list {\n max-height: calc(60dvh - 80px);\n padding: var(--ui-space-1) 0 var(--ui-space-2);\n }\n }\n\n .item {\n display: flex;\n align-items: center;\n gap: var(--ui-space-3);\n padding: var(--ui-space-2) var(--ui-space-3);\n min-height: 44px;\n cursor: pointer;\n transition: background-color 120ms ease;\n }\n\n .item.active {\n background: var(--ui-accent-subtle, rgb(59 130 246 / 0.1));\n }\n\n .icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n background: var(--ui-surface-hover);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-md);\n font-size: var(--ui-font-size-sm);\n font-weight: var(--ui-font-bold);\n color: var(--ui-text-secondary);\n font-family: var(--ui-font-family-mono, ui-monospace, monospace);\n flex-shrink: 0;\n line-height: 1;\n }\n\n .item.active .icon {\n background: var(--ui-accent);\n border-color: var(--ui-accent);\n color: var(--ui-accent-contrast);\n }\n\n .icon {\n --ui-icon-size: 1rem;\n --ui-icon-stroke-width: var(--ui-editor-toolbar-icon-stroke-width, 1.75);\n }\n\n .body {\n display: flex;\n min-width: 0;\n flex-direction: column;\n gap: 1px;\n }\n\n .title {\n font-size: var(--ui-font-size-sm);\n font-weight: var(--ui-font-medium);\n color: var(--ui-text);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .description {\n font-size: var(--ui-font-size-xs);\n color: var(--ui-text-muted);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .footer {\n display: none;\n padding: var(--ui-space-2) var(--ui-space-3);\n border-top: 1px solid var(--ui-border);\n font-size: var(--ui-font-size-xs);\n color: var(--ui-text-muted);\n }\n\n @media (min-width: 768px) {\n .footer {\n display: block;\n }\n }\n\n :host kbd {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-family: var(--ui-font-family-mono, ui-monospace, monospace);\n font-size: 10px;\n background: var(--ui-surface-hover);\n border: 1px solid var(--ui-border);\n border-radius: 3px;\n padding: 0 3px;\n color: var(--ui-text-secondary);\n }\n\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"visible","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"active","expression":{"source":"0","ast":{"kind":"literal","value":0},"dependencies":[]}},{"kind":"event","name":"highlight","type":"object({ index: integer })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"select","type":"object({ index: integer })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editor-slash-menu/ui-editor-slash-menu.js"},{"source":{"file":"./components/ui-editor-table-context-menu/ui-editor-table-context-menu.html"},"contract":{"version":1,"name":"UiEditorTableContextMenu","tag":"ui-editor-table-context-menu","nativeElement":"div","props":{"actions":{"type":{"kind":"list","item":{"kind":"union","members":[{"kind":"keyword","value":"align-left"},{"kind":"keyword","value":"align-center"},{"kind":"keyword","value":"align-right"},{"kind":"keyword","value":"background-none"},{"kind":"keyword","value":"background-gray"},{"kind":"keyword","value":"background-yellow"},{"kind":"keyword","value":"background-blue"},{"kind":"keyword","value":"background-green"},{"kind":"keyword","value":"background-red"},{"kind":"keyword","value":"add-row-before"},{"kind":"keyword","value":"add-row-after"},{"kind":"keyword","value":"add-column-before"},{"kind":"keyword","value":"add-column-after"},{"kind":"keyword","value":"clear-cells"},{"kind":"keyword","value":"merge-cells"},{"kind":"keyword","value":"split-cell"},{"kind":"keyword","value":"delete-row"},{"kind":"keyword","value":"delete-column"},{"kind":"keyword","value":"delete-table"}]}},"required":false,"target":{"attribute":"actions"},"description":"The complete set of commands the current selection permits."},"cellBackground":{"type":"string","required":false,"target":{"attribute":"cellbackground"},"description":"Identifies the background choice that is active for the current cell.","default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Shows the menu at the position owned by the editor integration.","default":false}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"menu"},{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"section"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"heading"},{"kind":"literal","name":"role","value":"presentation"}],"children":[{"kind":"text","value":"Cell background"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"swatches"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Cell background"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"swatch-button"},{"kind":"attribute","name":"selected","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]},"target":"class"},{"kind":"literal","name":"role","value":"menuitemradio"},{"kind":"attribute","name":"aria-checked","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]}},{"kind":"attribute","name":"data-action","expression":"swatch.action","expressionPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"swatch"},{"kind":"attribute","name":"default","expression":"not swatch.color","expressionPlan":{"source":"not swatch.color","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"}},"dependencies":["swatch.color"]},"target":"class"},{"kind":"attribute","name":"--_swatch","expression":"swatch.color","expressionPlan":{"source":"swatch.color","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"},"dependencies":["swatch.color"]},"target":"style"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"swatch-label"},{"kind":"directive","name":"value","expression":"swatch.label","expressionPlan":{"source":"swatch.label","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"label"},"dependencies":["swatch.label"]}}],"children":[]}],"flow":{"kind":"each","item":"swatch","list":"swatches","listPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]},"key":"swatch.action","keyPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}}]}],"flow":{"kind":"if","test":"swatches","testPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]}}},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sep"}],"children":[]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"section"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"heading"},{"kind":"literal","name":"role","value":"presentation"},{"kind":"directive","name":"value","expression":"section.heading","expressionPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"role","value":"menuitem"},{"kind":"attribute","name":"danger","expression":"item.danger","expressionPlan":{"source":"item.danger","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"danger"},"dependencies":["item.danger"]},"target":"class"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"section.items","listPlan":{"source":"section.items","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"items"},"dependencies":["section.items"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}]}],"flow":{"kind":"each","item":"section","list":"sections","listPlan":{"source":"sections","ast":{"kind":"id","name":"sections"},"dependencies":["sections"]},"key":"section.heading","keyPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}}]},"css":":host {\n /* The max-width is a promise about the menu's footprint, so it counts padding and border. */\n box-sizing: border-box;\n min-width: 14rem;\n max-width: min(17rem, calc(100vw - 24px));\n max-height: min(28rem, calc(100vh - 24px));\n padding: var(--ui-space-2);\n background: var(--ui-surface);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-lg);\n box-shadow: var(--ui-shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));\n display: flex;\n flex-direction: column;\n gap: 2px;\n overflow-y: auto;\n overscroll-behavior: contain;\n scrollbar-width: thin;\n }\n\n .section {\n display: flex;\n flex-direction: column;\n gap: 3px;\n }\n\n :host button {\n display: flex;\n align-items: center;\n gap: var(--ui-space-2);\n width: 100%;\n text-align: left;\n min-height: 32px;\n padding: var(--ui-space-2) var(--ui-space-2);\n border: none;\n border-radius: var(--ui-radius-sm);\n background: none;\n font-size: var(--ui-font-size-sm);\n cursor: pointer;\n color: var(--ui-text);\n }\n\n :host button {\n --ui-icon-size: 1rem;\n --ui-icon-stroke-width: var(--ui-editor-toolbar-icon-stroke-width, 1.75);\n }\n\n :host button:hover:not(:disabled) {\n background: var(--ui-surface-hover);\n }\n\n :host button.selected {\n background: var(--ui-accent-subtle, rgb(59 130 246 / 0.1));\n }\n\n :host button.danger {\n color: var(--ui-danger);\n }\n\n .swatches {\n display: grid;\n grid-template-columns: repeat(3, minmax(0, 1fr));\n gap: 3px;\n }\n\n .swatch-button {\n display: inline-flex;\n align-items: center;\n gap: var(--ui-space-2);\n }\n\n .swatch {\n display: inline-flex;\n width: 1rem;\n height: 1rem;\n border-radius: 999px;\n border: 1px solid var(--ui-border);\n background: var(--_swatch, #fff);\n box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.35);\n flex-shrink: 0;\n }\n\n .swatch.default {\n position: relative;\n background:\n linear-gradient(\n 135deg,\n transparent calc(50% - 1px),\n var(--ui-text-muted) calc(50% - 1px),\n var(--ui-text-muted) calc(50% + 1px),\n transparent calc(50% + 1px)\n ),\n var(--ui-surface);\n }\n\n .swatch-label {\n min-width: 0;\n white-space: nowrap;\n }\n\n .heading {\n padding: var(--ui-space-1) var(--ui-space-2);\n font-size: 0.6875rem;\n font-weight: 700;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--ui-text-muted);\n }\n\n .sep {\n height: 1px;\n background: var(--ui-border);\n margin: var(--ui-space-1) 0;\n }\n\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"swatches","type":"list(object({ action: string, label: string, color: string, selected: boolean })) | null","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"sections","type":"list(object({ heading: string, items: list(object({ action: string, label: string, icon: string, danger: boolean })) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"event","name":"action","type":"object({ action: align-left | align-center | align-right | background-none | background-gray | background-yellow | background-blue | background-green | background-red | add-row-before | add-row-after | add-column-before | add-column-after | clear-cells | merge-cells | split-cell | delete-row | delete-column | delete-table })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editor-table-context-menu/ui-editor-table-context-menu.js"},{"source":{"file":"./components/ui-editor-table-overlay/ui-editor-table-overlay.html"},"contract":{"version":1,"name":"UiEditorTableOverlay","tag":"ui-editor-table-overlay","nativeElement":"div","props":{"geometry":{"type":{"kind":"union","members":[{"kind":"object","fields":[{"name":"rowBoundaries","type":{"kind":"list","item":{"kind":"terminal","name":"number"}},"optional":false},{"name":"columnBoundaries","type":{"kind":"list","item":{"kind":"terminal","name":"number"}},"optional":false},{"name":"activeCell","type":{"kind":"union","members":[{"kind":"object","fields":[{"name":"left","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"top","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"width","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"height","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"rowIndex","type":{"kind":"terminal","name":"integer"},"optional":false},{"name":"columnIndex","type":{"kind":"terminal","name":"integer"},"optional":false}],"open":false},{"kind":"terminal","name":"null"}]},"optional":false},{"name":"hoveredCell","type":{"kind":"union","members":[{"kind":"object","fields":[{"name":"left","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"top","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"width","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"height","type":{"kind":"terminal","name":"number"},"optional":false},{"name":"rowIndex","type":{"kind":"terminal","name":"integer"},"optional":false},{"name":"columnIndex","type":{"kind":"terminal","name":"integer"},"optional":false}],"open":false},{"kind":"terminal","name":"null"}]},"optional":true}],"open":false},{"kind":"terminal","name":"null"}]},"required":false,"target":{"attribute":"geometry"},"description":"The authoritative editor-measured table boundaries and active or hovered cell rectangles."},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Shows the controls after the editor has supplied current geometry.","default":false}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"aria-label","value":"Table controls"},{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"rows"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"control row"},{"kind":"attribute","name":"active","expression":"control.key = activeKey","expressionPlan":{"source":"control.key = activeKey","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"right":{"kind":"id","name":"activeKey"}},"dependencies":["activeKey","control.key"]},"target":"class"},{"kind":"attribute","name":"top","expression":"control.offset","expressionPlan":{"source":"control.offset","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"offset"},"dependencies":["control.offset"]},"target":"style"},{"kind":"attribute","name":"data-control-key","expression":"control.key","expressionPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"line"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"guide"},{"kind":"literal","name":"data-ui-guide","value":""},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"handle"},{"kind":"attribute","name":"data-ui-affordance","expression":"control.affordance","expressionPlan":{"source":"control.affordance","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"affordance"},"dependencies":["control.affordance"]}},{"kind":"attribute","name":"data-action","expression":"control.action","expressionPlan":{"source":"control.action","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"action"},"dependencies":["control.action"]}},{"kind":"attribute","name":"data-boundary-index","expression":"control.index","expressionPlan":{"source":"control.index","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"index"},"dependencies":["control.index"]}},{"kind":"attribute","name":"aria-label","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"plus"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"tooltip"},{"kind":"literal","name":"role","value":"tooltip"},{"kind":"directive","name":"value","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[]}]}],"flow":{"kind":"each","item":"control","list":"rows","listPlan":{"source":"rows","ast":{"kind":"id","name":"rows"},"dependencies":["rows"]},"key":"control.key","keyPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"cols"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"control col"},{"kind":"attribute","name":"active","expression":"control.key = activeKey","expressionPlan":{"source":"control.key = activeKey","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"right":{"kind":"id","name":"activeKey"}},"dependencies":["activeKey","control.key"]},"target":"class"},{"kind":"attribute","name":"left","expression":"control.offset","expressionPlan":{"source":"control.offset","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"offset"},"dependencies":["control.offset"]},"target":"style"},{"kind":"attribute","name":"data-control-key","expression":"control.key","expressionPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"line"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"guide"},{"kind":"literal","name":"data-ui-guide","value":""},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"handle"},{"kind":"attribute","name":"data-ui-affordance","expression":"control.affordance","expressionPlan":{"source":"control.affordance","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"affordance"},"dependencies":["control.affordance"]}},{"kind":"attribute","name":"data-action","expression":"control.action","expressionPlan":{"source":"control.action","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"action"},"dependencies":["control.action"]}},{"kind":"attribute","name":"data-boundary-index","expression":"control.index","expressionPlan":{"source":"control.index","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"index"},"dependencies":["control.index"]}},{"kind":"attribute","name":"aria-label","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"plus"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"tooltip"},{"kind":"literal","name":"role","value":"tooltip"},{"kind":"directive","name":"value","expression":"control.label","expressionPlan":{"source":"control.label","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"label"},"dependencies":["control.label"]}}],"children":[]}]}],"flow":{"kind":"each","item":"control","list":"cols","listPlan":{"source":"cols","ast":{"kind":"id","name":"cols"},"dependencies":["cols"]},"key":"control.key","keyPlan":{"source":"control.key","ast":{"kind":"member","object":{"kind":"id","name":"control"},"key":"key"},"dependencies":["control.key"]}}}]},{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"selector row"},{"kind":"attribute","name":"top","expression":"hovered.rowOffset","expressionPlan":{"source":"hovered.rowOffset","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"rowOffset"},"dependencies":["hovered.rowOffset"]},"target":"style"},{"kind":"literal","name":"data-action","value":"select-row"},{"kind":"attribute","name":"data-row-index","expression":"hovered.rowIndex","expressionPlan":{"source":"hovered.rowIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"rowIndex"},"dependencies":["hovered.rowIndex"]}},{"kind":"attribute","name":"data-column-index","expression":"hovered.columnIndex","expressionPlan":{"source":"hovered.columnIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"columnIndex"},"dependencies":["hovered.columnIndex"]}},{"kind":"literal","name":"title","value":"Select row"},{"kind":"literal","name":"aria-label","value":"Select row"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"glyph"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"grip-vertical"}],"children":[]}]}]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"selector column"},{"kind":"attribute","name":"left","expression":"hovered.columnOffset","expressionPlan":{"source":"hovered.columnOffset","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"columnOffset"},"dependencies":["hovered.columnOffset"]},"target":"style"},{"kind":"literal","name":"data-action","value":"select-column"},{"kind":"attribute","name":"data-row-index","expression":"hovered.rowIndex","expressionPlan":{"source":"hovered.rowIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"rowIndex"},"dependencies":["hovered.rowIndex"]}},{"kind":"attribute","name":"data-column-index","expression":"hovered.columnIndex","expressionPlan":{"source":"hovered.columnIndex","ast":{"kind":"member","object":{"kind":"id","name":"hovered"},"key":"columnIndex"},"dependencies":["hovered.columnIndex"]}},{"kind":"literal","name":"title","value":"Select column"},{"kind":"literal","name":"aria-label","value":"Select column"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"glyph"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"grip-horizontal"}],"children":[]}]}]}],"flow":{"kind":"if","test":"hovered","testPlan":{"source":"hovered","ast":{"kind":"id","name":"hovered"},"dependencies":["hovered"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"cell-menu"},{"kind":"attribute","name":"left","expression":"active.menuLeft","expressionPlan":{"source":"active.menuLeft","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"menuLeft"},"dependencies":["active.menuLeft"]},"target":"style"},{"kind":"attribute","name":"top","expression":"active.menuTop","expressionPlan":{"source":"active.menuTop","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"menuTop"},"dependencies":["active.menuTop"]},"target":"style"},{"kind":"literal","name":"data-action","value":"open-cell-menu"},{"kind":"attribute","name":"data-row-index","expression":"active.rowIndex","expressionPlan":{"source":"active.rowIndex","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"rowIndex"},"dependencies":["active.rowIndex"]}},{"kind":"attribute","name":"data-column-index","expression":"active.columnIndex","expressionPlan":{"source":"active.columnIndex","ast":{"kind":"member","object":{"kind":"id","name":"active"},"key":"columnIndex"},"dependencies":["active.columnIndex"]}},{"kind":"literal","name":"title","value":"Cell actions"},{"kind":"literal","name":"aria-label","value":"Cell actions"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"chevron-down"}],"children":[]}],"flow":{"kind":"if","test":"active","testPlan":{"source":"active","ast":{"kind":"id","name":"active"},"dependencies":["active"]}}}]},"css":":host {\n display: block;\n width: 100%;\n height: 100%;\n overflow: visible;\n pointer-events: none;\n }\n\n :host {\n position: relative;\n width: 100%;\n height: 100%;\n overflow: visible;\n pointer-events: none;\n }\n\n .rows,\n .cols {\n pointer-events: none;\n position: absolute;\n }\n\n .rows {\n inset: 0;\n width: 100%;\n }\n\n .cols {\n inset: 0;\n height: 100%;\n }\n\n .control {\n position: absolute;\n z-index: 1;\n pointer-events: none;\n }\n\n .handle {\n position: absolute;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 24px;\n height: 24px;\n padding: 0;\n border: 1px solid var(--ui-affordance-near-color, var(--ui-border-strong));\n border-radius: var(--ui-radius-round);\n background: color-mix(in srgb, var(--ui-surface-elevated) 96%, transparent);\n color: var(--ui-affordance-near-color, var(--ui-text-secondary));\n font: inherit;\n font-size: 16px;\n line-height: 1;\n box-shadow: var(--ui-shadow-xs, 0 1px 2px rgb(0 0 0 / 0.05));\n opacity: 0;\n scale: 0.72;\n transition:\n opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n scale var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n background-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n border-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n pointer-events: auto;\n cursor: pointer;\n }\n\n .handle {\n --ui-icon-size: 14px;\n --ui-icon-stroke-width: 2;\n }\n\n .handle[data-ui-proximity=\"near\"],\n .control.active .handle,\n .handle:focus-visible {\n opacity: 1;\n scale: 1;\n }\n\n .control.active .handle,\n .handle:focus-visible {\n border-color: var(--ui-affordance-direct-color, var(--ui-accent-solid));\n background: var(--ui-affordance-direct-color, var(--ui-accent-solid));\n color: var(--ui-text-on-accent);\n box-shadow: var(--ui-shadow-sm, 0 1px 3px rgb(0 0 0 / 0.1));\n }\n\n .handle:focus-visible,\n .selector:focus-visible,\n .cell-menu:focus-visible {\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: 2px;\n }\n\n .control.row {\n left: 0;\n width: 100%;\n height: 0;\n }\n\n .control.row .handle {\n top: -12px;\n left: -30px;\n }\n\n .control.col {\n top: 0;\n width: 0;\n height: 100%;\n }\n\n .control.col .handle {\n top: -30px;\n left: -12px;\n }\n\n .line {\n position: absolute;\n background: var(--ui-affordance-direct-color, var(--ui-accent-solid));\n opacity: 0;\n transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n }\n\n .control.row .line {\n inset: -1px 0 auto;\n height: 2px;\n }\n\n .control.col .line {\n inset: 0 auto 0 -1px;\n width: 2px;\n }\n\n .control.active .line {\n opacity: 0.8;\n }\n\n .guide {\n position: absolute;\n width: var(--ui-affordance-guide-size);\n height: var(--ui-affordance-guide-size);\n border-radius: var(--ui-radius-round);\n background: var(--ui-affordance-guide-color, var(--ui-border-strong));\n opacity: var(--ui-affordance-guide-opacity);\n transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n }\n\n .control.row .guide {\n left: -10px;\n top: -2px;\n }\n\n .control.col .guide {\n left: -2px;\n top: -10px;\n }\n\n .control:has(.handle[data-ui-proximity=\"near\"]) .guide,\n .control.active .guide {\n opacity: 0;\n }\n\n .tooltip {\n position: absolute;\n z-index: 2;\n top: calc(100% + 6px);\n left: 50%;\n width: max-content;\n max-width: 14rem;\n padding: var(--ui-space-1) var(--ui-space-2);\n border-radius: var(--ui-radius-sm);\n background: var(--ui-text-primary);\n color: var(--ui-surface-elevated);\n font-size: var(--ui-font-size-xs);\n font-weight: var(--ui-font-medium);\n line-height: var(--ui-line-height-md);\n opacity: 0;\n transform: translateX(-50%);\n transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n pointer-events: none;\n }\n\n .control.row .tooltip {\n top: 50%;\n left: auto;\n right: calc(100% + 8px);\n transform: translateY(-50%);\n }\n\n .control.active .tooltip,\n .handle:focus-visible .tooltip {\n opacity: 1;\n }\n\n .selector,\n .cell-menu {\n position: absolute;\n z-index: 2;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n border: 1px solid transparent;\n background: transparent;\n color: var(--ui-text-secondary);\n box-shadow: none;\n pointer-events: auto;\n cursor: pointer;\n transition:\n color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n background-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n border-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n box-shadow var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n }\n\n .selector:hover,\n .cell-menu:hover {\n background: var(--ui-icon-button-hover-surface, var(--ui-surface-muted));\n color: var(--ui-icon-button-hover-text, var(--ui-text-primary));\n box-shadow: var(--ui-shadow-xs, 0 1px 2px rgb(0 0 0 / 0.05));\n }\n\n .selector {\n border-radius: var(--ui-radius-round);\n }\n\n .selector::before {\n content: \"\";\n position: absolute;\n inset: 50% auto auto 50%;\n border-radius: var(--ui-radius-round);\n background: var(--ui-affordance-guide-color, var(--ui-border-strong));\n opacity: var(--ui-affordance-guide-opacity);\n transform: translate(-50%, -50%);\n transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n pointer-events: none;\n }\n\n .selector .glyph {\n display: block;\n width: 14px;\n height: 14px;\n --ui-icon-size: 14px;\n --ui-icon-stroke-width: 2;\n opacity: 0;\n transform: scale(0.72);\n transition:\n opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n transform var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n }\n\n .selector:hover::before,\n .selector:focus-visible::before {\n opacity: 0;\n }\n\n .selector:hover .glyph,\n .selector:focus-visible .glyph {\n opacity: 1;\n transform: scale(1);\n }\n\n .selector.row {\n left: -9px;\n width: 18px;\n height: 32px;\n transform: translateY(-50%);\n }\n\n .selector.row::before {\n width: 2px;\n height: 16px;\n }\n\n .selector.column {\n top: -9px;\n width: 32px;\n height: 18px;\n transform: translateX(-50%);\n }\n\n .selector.column::before {\n width: 16px;\n height: 2px;\n }\n\n @media (hover: none), (pointer: coarse) {\n .selector::before {\n opacity: 0;\n }\n\n .selector .glyph {\n opacity: 1;\n transform: none;\n }\n }\n\n .cell-menu {\n width: 24px;\n height: 24px;\n border-radius: var(--ui-radius-sm);\n background: color-mix(in srgb, var(--ui-surface-muted) 78%, transparent);\n }\n\n .cell-menu {\n --ui-icon-size: 15px;\n --ui-icon-stroke-width: 2;\n }\n\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"rows","type":"list(object({ key: string, index: integer, offset: string, affordance: insert-row | insert-column, action: add-row-before | add-row-after | add-column-before | add-column-after, label: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"cols","type":"list(object({ key: string, index: integer, offset: string, affordance: insert-row | insert-column, action: add-row-before | add-row-after | add-column-before | add-column-after, label: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"hovered","type":"object({ left: number, top: number, width: number, height: number, rowIndex: integer, columnIndex: integer, rowOffset: string, columnOffset: string }) | null","expression":{"source":"null","ast":{"kind":"literal","value":null},"dependencies":[]}},{"kind":"state","name":"active","type":"object({ left: number, top: number, width: number, height: number, rowIndex: integer, columnIndex: integer, menuLeft: string, menuTop: string }) | null","expression":{"source":"null","ast":{"kind":"literal","value":null},"dependencies":[]}},{"kind":"state","name":"activeKey","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"event","name":"action","type":"object({ action: add-row-before | add-row-after | add-column-before | add-column-after, boundaryIndex: integer }) | object({ action: select-row | select-column, rowIndex: integer, columnIndex: integer }) | object({ action: open-cell-menu, rowIndex: integer, columnIndex: integer, anchor: object({ left: number, top: number, right: number, bottom: number }) })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editor-table-overlay/ui-editor-table-overlay.js"},{"source":{"file":"./components/ui-editor-table-toolbar/ui-editor-table-toolbar.html"},"contract":{"version":1,"name":"UiEditorTableToolbar","tag":"ui-editor-table-toolbar","nativeElement":"div","props":{"actions":{"type":{"kind":"list","item":{"kind":"union","members":[{"kind":"keyword","value":"align-left"},{"kind":"keyword","value":"align-center"},{"kind":"keyword","value":"align-right"},{"kind":"keyword","value":"background-none"},{"kind":"keyword","value":"background-gray"},{"kind":"keyword","value":"background-yellow"},{"kind":"keyword","value":"background-blue"},{"kind":"keyword","value":"background-green"},{"kind":"keyword","value":"background-red"},{"kind":"keyword","value":"add-row-before"},{"kind":"keyword","value":"add-row-after"},{"kind":"keyword","value":"add-column-before"},{"kind":"keyword","value":"add-column-after"},{"kind":"keyword","value":"clear-cells"},{"kind":"keyword","value":"merge-cells"},{"kind":"keyword","value":"split-cell"},{"kind":"keyword","value":"delete-row"},{"kind":"keyword","value":"delete-column"},{"kind":"keyword","value":"delete-table"}]}},"required":false,"target":{"attribute":"actions"},"description":"The complete set of commands the current selection permits."},"cellAlignment":{"type":{"enum":["left","center","right"]},"required":false,"target":{"attribute":"cellalignment"},"description":"Marks the alignment command that is active for the current cell.","default":"left"},"cellBackground":{"type":"string","required":false,"target":{"attribute":"cellbackground"},"description":"Identifies the background choice that is active for the current cell.","default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Shows the toolbar while a table selection is active.","default":false}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"toolbar"},{"kind":"literal","name":"aria-label","value":"Table actions"},{"kind":"attribute","name":"hidden","expression":"not open","expressionPlan":{"source":"not open","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"open"}},"dependencies":["open"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"group"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Cell alignment"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"icon-button"},{"kind":"attribute","name":"active","expression":"item.active","expressionPlan":{"source":"item.active","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"active"},"dependencies":["item.active"]},"target":"class"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}},{"kind":"attribute","name":"aria-label","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}},{"kind":"attribute","name":"title","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}},{"kind":"attribute","name":"aria-pressed","expression":"item.active","expressionPlan":{"source":"item.active","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"active"},"dependencies":["item.active"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"alignments","listPlan":{"source":"alignments","ast":{"kind":"id","name":"alignments"},"dependencies":["alignments"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}],"flow":{"kind":"if","test":"alignments","testPlan":{"source":"alignments","ast":{"kind":"id","name":"alignments"},"dependencies":["alignments"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sep"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[],"flow":{"kind":"if","test":"alignments and structure","testPlan":{"source":"alignments and structure","ast":{"kind":"binary","op":"and","left":{"kind":"id","name":"alignments"},"right":{"kind":"id","name":"structure"}},"dependencies":["alignments","structure"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"group"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Table structure"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"structure","listPlan":{"source":"structure","ast":{"kind":"id","name":"structure"},"dependencies":["structure"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}],"flow":{"kind":"if","test":"structure","testPlan":{"source":"structure","ast":{"kind":"id","name":"structure"},"dependencies":["structure"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"sep"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[],"flow":{"kind":"if","test":"(alignments or structure) and hasOverflow","testPlan":{"source":"(alignments or structure) and hasOverflow","ast":{"kind":"binary","op":"and","left":{"kind":"binary","op":"or","left":{"kind":"id","name":"alignments"},"right":{"kind":"id","name":"structure"}},"right":{"kind":"id","name":"hasOverflow"}},"dependencies":["alignments","hasOverflow","structure"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"overflow"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"more"},{"kind":"literal","name":"data-action","value":"toggle-overflow"},{"kind":"literal","name":"aria-haspopup","value":"menu"},{"kind":"attribute","name":"aria-expanded","expression":"overflowOpen","expressionPlan":{"source":"overflowOpen","ast":{"kind":"id","name":"overflowOpen"},"dependencies":["overflowOpen"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"table"}],"children":[]},{"kind":"element","name":"span","attributes":[],"children":[{"kind":"text","value":"Table options"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"chevron"}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"literal","name":"name","value":"chevron-down"}],"children":[]}]}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu"},{"kind":"literal","name":"role","value":"menu"},{"kind":"literal","name":"aria-label","value":"More table actions"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-section"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-heading"},{"kind":"literal","name":"role","value":"presentation"}],"children":[{"kind":"text","value":"Background"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"swatches"},{"kind":"literal","name":"role","value":"group"},{"kind":"literal","name":"aria-label","value":"Cell background"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"class","value":"swatch-button"},{"kind":"attribute","name":"selected","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]},"target":"class"},{"kind":"literal","name":"role","value":"menuitemradio"},{"kind":"attribute","name":"aria-checked","expression":"swatch.selected","expressionPlan":{"source":"swatch.selected","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"selected"},"dependencies":["swatch.selected"]}},{"kind":"attribute","name":"data-action","expression":"swatch.action","expressionPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"swatch"},{"kind":"attribute","name":"default","expression":"not swatch.color","expressionPlan":{"source":"not swatch.color","ast":{"kind":"unary","op":"not","operand":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"}},"dependencies":["swatch.color"]},"target":"class"},{"kind":"attribute","name":"--_swatch","expression":"swatch.color","expressionPlan":{"source":"swatch.color","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"color"},"dependencies":["swatch.color"]},"target":"style"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"swatch.label","expressionPlan":{"source":"swatch.label","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"label"},"dependencies":["swatch.label"]}}],"children":[]}],"flow":{"kind":"each","item":"swatch","list":"swatches","listPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]},"key":"swatch.action","keyPlan":{"source":"swatch.action","ast":{"kind":"member","object":{"kind":"id","name":"swatch"},"key":"action"},"dependencies":["swatch.action"]}}}]}],"flow":{"kind":"if","test":"swatches","testPlan":{"source":"swatches","ast":{"kind":"id","name":"swatches"},"dependencies":["swatches"]}}},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-section divided"},{"kind":"literal","name":"role","value":"none"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu-heading"},{"kind":"literal","name":"role","value":"presentation"},{"kind":"directive","name":"value","expression":"section.heading","expressionPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}],"children":[]},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"role","value":"menuitem"},{"kind":"attribute","name":"danger","expression":"item.danger","expressionPlan":{"source":"item.danger","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"danger"},"dependencies":["item.danger"]},"target":"class"},{"kind":"attribute","name":"data-action","expression":"item.action","expressionPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}],"children":[{"kind":"element","name":"ui-icon","attributes":[{"kind":"attribute","name":"name","expression":"item.icon","expressionPlan":{"source":"item.icon","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"icon"},"dependencies":["item.icon"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"directive","name":"value","expression":"item.label","expressionPlan":{"source":"item.label","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"label"},"dependencies":["item.label"]}}],"children":[]}],"flow":{"kind":"each","item":"item","list":"section.items","listPlan":{"source":"section.items","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"items"},"dependencies":["section.items"]},"key":"item.action","keyPlan":{"source":"item.action","ast":{"kind":"member","object":{"kind":"id","name":"item"},"key":"action"},"dependencies":["item.action"]}}}],"flow":{"kind":"each","item":"section","list":"sections","listPlan":{"source":"sections","ast":{"kind":"id","name":"sections"},"dependencies":["sections"]},"key":"section.heading","keyPlan":{"source":"section.heading","ast":{"kind":"member","object":{"kind":"id","name":"section"},"key":"heading"},"dependencies":["section.heading"]}}}],"flow":{"kind":"if","test":"overflowOpen","testPlan":{"source":"overflowOpen","ast":{"kind":"id","name":"overflowOpen"},"dependencies":["overflowOpen"]}}}],"flow":{"kind":"if","test":"hasOverflow","testPlan":{"source":"hasOverflow","ast":{"kind":"id","name":"hasOverflow"},"dependencies":["hasOverflow"]}}}]},"css":".looma-editor__mobile-toolbar-shell :host {\n min-width: max-content;\n min-height: 100%;\n padding: 0;\n background: transparent;\n border: 0;\n border-radius: 0;\n box-shadow: none;\n backdrop-filter: none;\n }\n\n .looma-editor__mobile-toolbar-shell :host button {\n min-height: 44px;\n background: transparent;\n }\n\n .looma-editor__mobile-toolbar-shell :host button.active,\n .looma-editor__mobile-toolbar-shell :host button.selected {\n background: var(--ui-accent-soft, var(--ui-accent-subtle));\n }\n\n .looma-editor__mobile-toolbar-shell :host .menu {\n top: auto;\n right: 0;\n bottom: calc(100% + var(--ui-space-2));\n max-height: min(50dvh, 22rem);\n overflow-y: auto;\n overscroll-behavior: contain;\n }\n :host {\n display: inline-flex;\n align-items: center;\n gap: var(--ui-space-1);\n padding: var(--ui-space-1);\n background: color-mix(in srgb, var(--ui-surface) 94%, transparent);\n border: 1px solid var(--ui-border);\n border-radius: calc(var(--ui-radius-md) + 2px);\n box-shadow: var(--ui-shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));\n backdrop-filter: blur(10px);\n }\n\n .group {\n display: inline-flex;\n align-items: center;\n gap: 2px;\n overflow: hidden;\n }\n\n .sep {\n width: 1px;\n align-self: stretch;\n background: var(--ui-border);\n }\n\n .overflow {\n position: relative;\n }\n\n :host button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--ui-space-2);\n min-height: 32px;\n border: 0;\n border-radius: var(--ui-radius-sm);\n background: transparent;\n color: var(--ui-text-primary);\n cursor: pointer;\n font-size: var(--ui-font-size-sm);\n font-weight: 500;\n line-height: 1;\n padding: var(--ui-space-2) var(--ui-space-2);\n white-space: nowrap;\n }\n\n :host button:hover {\n background: var(--ui-surface-hover);\n }\n\n :host button.active {\n background: var(--ui-accent-soft, var(--ui-accent-subtle));\n color: var(--ui-accent-active);\n }\n\n .group button {\n border-radius: var(--ui-radius-sm);\n }\n\n .group button + button {\n border-left: 0;\n }\n\n :host .more {\n border: 0;\n border-radius: var(--ui-radius-sm);\n }\n\n :host button.danger {\n color: var(--ui-danger);\n }\n\n :host {\n --ui-icon-size: var(--ui-editor-toolbar-icon-size, 1rem);\n --ui-icon-stroke-width: var(--ui-editor-toolbar-icon-stroke-width, 1.75);\n }\n\n .chevron {\n display: inline-flex;\n --ui-icon-size: 0.875rem;\n }\n\n :host .icon-button {\n width: 32px;\n padding-inline: 0;\n }\n\n .menu {\n position: absolute;\n top: calc(100% + var(--ui-space-2));\n right: 0;\n min-width: 12rem;\n padding: var(--ui-space-1);\n background: var(--ui-surface);\n border: 1px solid var(--ui-border);\n border-radius: var(--ui-radius-md);\n box-shadow: var(--ui-shadow-lg, 0 10px 15px -3px rgb(0 0 0 / 0.1));\n display: flex;\n flex-direction: column;\n gap: 2px;\n z-index: 2;\n }\n\n .menu-section + .menu-section {\n margin-top: var(--ui-space-1);\n padding-top: var(--ui-space-1);\n border-top: 1px solid color-mix(in srgb, var(--ui-border) 80%, transparent);\n }\n\n .menu-heading {\n padding: var(--ui-space-1) var(--ui-space-2);\n font-size: 0.6875rem;\n font-weight: 700;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--ui-text-muted);\n }\n\n .menu button {\n display: flex;\n justify-content: flex-start;\n width: 100%;\n text-align: left;\n }\n\n .swatches {\n display: grid;\n grid-template-columns: repeat(3, minmax(0, 1fr));\n gap: 2px;\n }\n\n :host .swatch-button {\n gap: var(--ui-space-1);\n justify-content: flex-start;\n }\n\n .swatch {\n width: 14px;\n height: 14px;\n flex: 0 0 14px;\n border: 1px solid color-mix(in srgb, var(--ui-border) 80%, #000);\n border-radius: 3px;\n background: var(--_swatch);\n }\n\n .swatch.default {\n background:\n linear-gradient(135deg, transparent 44%, var(--ui-danger) 46% 54%, transparent 56%),\n var(--ui-surface);\n }\n\n .swatch-button.selected {\n background: var(--ui-accent-soft, var(--ui-accent-subtle));\n }\n\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"alignments","type":"list(object({ action: align-left | align-center | align-right, label: string, active: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"structure","type":"list(object({ action: add-row-after | add-column-after, label: string, icon: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"swatches","type":"list(object({ action: string, label: string, color: string, selected: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"sections","type":"list(object({ heading: string, items: list(object({ action: string, label: string, icon: string, danger: boolean })) }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"state","name":"hasOverflow","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"overflowOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"action","type":"object({ action: align-left | align-center | align-right | background-none | background-gray | background-yellow | background-blue | background-green | background-red | add-row-before | add-row-after | add-column-before | add-column-after | clear-cells | merge-cells | split-cell | delete-row | delete-column | delete-table })","bubbles":true,"composed":true,"cancelable":false}],"slots":[],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-editor-table-toolbar/ui-editor-table-toolbar.js"},{"source":{"file":"./components/ui-editor-toolbar/ui-editor-toolbar.html"},"contract":{"version":1,"name":"UiEditorToolbar","tag":"ui-editor-toolbar","nativeElement":"div","props":{"floating":{"type":"boolean","required":false,"target":{"attribute":"floating"},"description":"Shows the toolbar as a floating bar beside the selection rather than pinned to the editor.","default":false}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"toolbar"},{"kind":"literal","name":"aria-label","value":"Editor toolbar"}],"children":[{"kind":"slot"}]},"css":":host {\n position: sticky;\n top: 0;\n z-index: var(--ui-editor-toolbar-z-index, 10);\n display: flex;\n align-items: center;\n justify-content: flex-start;\n gap: var(--ui-editor-toolbar-gap, 2px);\n padding: var(--ui-editor-toolbar-padding-block, 6px) var(--ui-editor-toolbar-padding-inline, 12px);\n min-height: var(--ui-editor-toolbar-min-height, 48px);\n /* More controls than the column is wide is normal at a readable measure, so the row wraps.\n Scrolling hid the tail behind an invisible scrollbar. */\n flex-wrap: wrap;\n row-gap: var(--ui-editor-toolbar-row-gap, var(--ui-editor-toolbar-gap, 2px));\n background: var(--ui-editor-toolbar-surface, var(--ui-surface));\n border-bottom: 1px solid var(--ui-editor-toolbar-border, var(--ui-border));\n }\n\n :host::-webkit-scrollbar {\n display: none;\n }\n\n :host > :slotted(*) {\n flex: 0 0 auto;\n }\n\n :slotted(.divider) {\n width: 1px;\n height: 20px;\n background: var(--ui-editor-toolbar-divider, var(--ui-border));\n flex-shrink: 0;\n margin: 0 var(--ui-editor-toolbar-divider-margin, 4px);\n }\n\n :host-state([floating]) {\n flex-wrap: nowrap;\n position: static;\n top: auto;\n width: max-content;\n max-width: min(calc(100vw - 24px), 100%);\n min-height: auto;\n padding: var(--ui-editor-toolbar-floating-padding, 4px);\n overflow-x: visible;\n background: color-mix(in srgb, var(--ui-editor-toolbar-surface, var(--ui-surface)) 96%, transparent);\n border: 1px solid var(--ui-editor-toolbar-border, var(--ui-border));\n border-radius: var(--ui-editor-toolbar-floating-radius, var(--ui-radius-lg));\n box-shadow: var(--ui-editor-toolbar-floating-shadow, var(--ui-shadow-lg, 0 10px 24px rgb(0 0 0 / 0.12)));\n backdrop-filter: blur(10px);\n }\n\n @media (max-width: 767px) {\n :host {\n position: fixed;\n top: auto;\n bottom: env(safe-area-inset-bottom);\n left: 0;\n right: 0;\n min-height: var(--ui-editor-toolbar-mobile-min-height, 56px);\n border-top: 1px solid var(--ui-editor-toolbar-border, var(--ui-border));\n border-bottom: none;\n box-shadow: var(--ui-editor-toolbar-mobile-shadow, 0 -2px 8px rgb(0 0 0 / 0.06));\n }\n\n :host-state([floating]) {\n position: static;\n inset: auto;\n min-height: auto;\n border: 1px solid var(--ui-editor-toolbar-border, var(--ui-border));\n border-radius: var(--ui-editor-toolbar-floating-radius, var(--ui-radius-lg));\n box-shadow: var(--ui-editor-toolbar-floating-shadow, var(--ui-shadow-lg, 0 10px 24px rgb(0 0 0 / 0.12)));\n }\n }\n\n /* Inside LoomaEditor's sticky shell, the shell is the sticky surface. */\n .looma-editor__sticky-toolbar-shell :host {\n position: static;\n min-height: var(--ui-editor-toolbar-min-height, 48px);\n overscroll-behavior-inline: contain;\n background: transparent;\n border: 0;\n box-shadow: none;\n }\n\n /* Inside LoomaEditor's mobile shell, the toolbar is a scroll-snapping strip. */\n .looma-editor__mobile-toolbar-shell :host-state([floating]) {\n width: 100%;\n max-width: none;\n min-height: 100%;\n padding: 0;\n overflow-x: auto;\n overflow-y: hidden;\n overscroll-behavior-inline: contain;\n scroll-snap-type: x mandatory;\n background: transparent;\n border: 0;\n border-radius: 0;\n box-shadow: none;\n backdrop-filter: none;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-floating-action-button/ui-floating-action-button.html"},"contract":{"version":1,"name":"UiFloatingActionButton","tag":"ui-floating-action-button","nativeElement":"button","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"label token.","default":""},"mobileOnly":{"type":"boolean","required":false,"target":{"attribute":"mobileonly"},"description":"mobileOnly token.","default":false}}},"template":{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"slot"}]},"css":":host {\n position: fixed;\n inset-block-end: calc(var(--ui-floating-action-button-inset-block-end, var(--ui-space-6)) + env(safe-area-inset-bottom));\n inset-inline-end: max(\n var(--ui-floating-action-button-inset-inline-end, var(--ui-space-5)),\n env(safe-area-inset-right)\n );\n inline-size: var(--ui-control-min-block-size);\n block-size: var(--ui-control-min-block-size);\n display: inline-flex;\n z-index: var(--ui-floating-action-button-z-index, 100);\n }\n\n :host {\n appearance: none;\n border: none;\n border-radius: 999px;\n margin: 0;\n padding: 0;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n background: var(--ui-accent);\n color: var(--ui-on-accent);\n box-shadow: 0 4px 12px color-mix(in srgb, var(--ui-accent) 40%, transparent);\n cursor: pointer;\n transition:\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n :host:hover:enabled {\n background: var(--ui-accent-hover);\n box-shadow: 0 6px 16px color-mix(in srgb, var(--ui-accent) 50%, transparent);\n }\n\n :host:active:enabled {\n transform: scale(0.94);\n }\n\n :host:focus-visible {\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: 2px;\n }\n\n :host:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n :slotted(svg) {\n inline-size: var(--ui-icon-size-lg);\n block-size: var(--ui-icon-size-lg);\n flex-shrink: 0;\n }\n\n @media (min-width: 768px) {\n :host-state([mobileOnly]) {\n display: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"button","choices":["button"]}},{"source":{"file":"./components/ui-form-field/ui-form-field.html"},"contract":{"version":1,"name":"UiFormField","tag":"ui-form-field","nativeElement":"div","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"invalid":{"type":"boolean","required":false,"target":{"attribute":"invalid"},"description":"invalid token.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"required token.","default":false}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot","fallback":[],"name":"label"}]},{"kind":"slot"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"help"}],"children":[{"kind":"slot","fallback":[],"name":"help"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"error"}],"children":[{"kind":"slot","fallback":[],"name":"error"}]}]},"css":":host {\n display: grid;\n gap: var(--ui-space-2);\n min-inline-size: 0;\n align-content: start;\n color: var(--ui-text-primary);\n }\n\n /* Each named region styles whatever fills it, however it was slotted (slot=\"…\" in HTML, #label\n in Vue), and generates no box of its own, so an empty region adds no gap. */\n .label,\n .help,\n .error {\n display: contents;\n }\n\n .label {\n color: var(--ui-text-secondary);\n font-size: 0.95rem;\n }\n\n .help {\n color: var(--ui-text-muted);\n font-size: 0.875rem;\n line-height: var(--ui-line-height-md);\n }\n\n .help > :slotted(*) {\n min-block-size: var(--ui-form-field-help-min-block-size, 0);\n }\n\n .error,\n :slotted([role=\"alert\"]) {\n color: var(--ui-accent-active);\n font-size: 0.875rem;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true,"name":"label"},{"dynamic":false,"required":true},{"dynamic":false,"required":true,"name":"help"},{"dynamic":false,"required":true,"name":"error"}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-form-field/ui-form-field.js"},{"source":{"file":"./components/ui-grid/ui-grid.html"},"contract":{"version":1,"name":"UiGrid","tag":"ui-grid","nativeElement":"div","props":{"gap":{"type":{"enum":["xs","s","m","l","xl"]},"required":false,"target":{"attribute":"gap"},"description":"gap token."},"min":{"type":{"enum":["sm","md","lg"]},"required":false,"target":{"attribute":"min"},"description":"min token."}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n --_grid-gap: var(--ui-space-4);\n --_grid-min: 12rem;\n display: grid;\n gap: var(--ui-grid-gap, var(--_grid-gap));\n grid-template-columns: repeat(auto-fit, minmax(min(var(--ui-grid-min, var(--_grid-min)), 100%), 1fr));\n min-inline-size: 0;\n max-inline-size: 100%;\n margin: 0;\n }\n\n :host-state([gap=\"xs\"]) {\n --_grid-gap: var(--ui-space-2);\n }\n :host-state([gap=\"s\"]) {\n --_grid-gap: var(--ui-space-3);\n }\n :host-state([gap=\"m\"]) {\n --_grid-gap: var(--ui-space-4);\n }\n :host-state([gap=\"l\"]) {\n --_grid-gap: var(--ui-space-5);\n }\n :host-state([gap=\"xl\"]) {\n --_grid-gap: var(--ui-space-6);\n }\n :host-state([min=\"md\"]) {\n --_grid-min: 16rem;\n }\n :host-state([min=\"lg\"]) {\n --_grid-min: 20rem;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-icon-button/ui-icon-button.html"},"contract":{"version":1,"name":"UiIconButton","tag":"ui-icon-button","nativeElement":"button","props":{"anticipatory":{"type":"boolean","required":false,"target":{"attribute":"anticipatory"},"description":"anticipatory token.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"Accessible name for the icon."},"round":{"type":"boolean","required":false,"target":{"attribute":"round"},"description":"Use a fully circular shape.","default":false},"size":{"type":{"enum":["sm","md","lg"]},"required":false,"target":{"attribute":"size"},"description":"size token.","default":"md"},"variant":{"type":{"enum":["ghost","outline","solid"]},"required":false,"target":{"attribute":"variant"},"description":"variant token.","default":"ghost"}}},"template":{"kind":"element","name":"button","attributes":[{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[{"kind":"slot"}]},"css":":host {\n display: inline-flex;\n color: var(--ui-text-secondary);\n }\n\n :host-state([anticipatory]) {\n position: relative;\n }\n\n :host-state([anticipatory])::before {\n content: \"\";\n position: absolute;\n inset: 50% auto auto 50%;\n z-index: 1;\n inline-size: var(--ui-affordance-guide-size);\n block-size: var(--ui-affordance-guide-size);\n border-radius: var(--ui-radius-round);\n background: var(--ui-affordance-guide-color, var(--ui-border-strong));\n opacity: var(--ui-affordance-guide-opacity);\n transform: translate(-50%, -50%);\n transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n pointer-events: none;\n }\n\n /* At rest an anticipatory button shows only its guide dot; proximity, hover, or focus reveals the\n * surface and icon. The root is the native button, so hiding it outright would hide the dot\n * too, and slotted icons sit outside this scope; `color: transparent` hides currentColor icons. */\n @media (hover: hover) and (pointer: fine) {\n :host-state([anticipatory]):not(:host-state([variant=\"solid\"]), [data-ui-proximity=\"near\"], :hover, :focus-visible) {\n border-color: transparent;\n background: transparent;\n box-shadow: none;\n color: transparent;\n }\n }\n\n :host-state([anticipatory]):is(:host-state([variant=\"solid\"]), [data-ui-proximity=\"near\"], :hover, :focus-visible)::before {\n opacity: 0;\n }\n\n :host {\n /* The size prop resolves here; --ui-icon-button-size overrides it on an element. */\n --_size: 2rem;\n appearance: none;\n inline-size: var(--ui-icon-button-size, var(--_size));\n block-size: var(--ui-icon-button-size, var(--_size));\n min-inline-size: var(--ui-icon-button-size, var(--_size));\n min-block-size: var(--ui-icon-button-size, var(--_size));\n padding: 0;\n margin: 0;\n border: 1px solid transparent;\n border-radius: var(--ui-icon-button-radius, var(--ui-radius-md));\n background: var(--ui-icon-button-surface, transparent);\n color: inherit;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition:\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n @media (hover: none), (pointer: coarse) {\n :host-state([anticipatory])::before {\n opacity: 0;\n }\n }\n\n /* A touch target without a bigger button: an invisible hit area, at least the control\n minimum, centred on the button (::before is the anticipatory guide). */\n @media (pointer: coarse) {\n :host {\n position: relative;\n }\n\n :host::after {\n content: \"\";\n position: absolute;\n inset: 50% auto auto 50%;\n inline-size: max(100%, var(--ui-control-min-block-size));\n block-size: max(100%, var(--ui-control-min-block-size));\n transform: translate(-50%, -50%);\n }\n }\n\n html[data-ui-input-modality=\"touch\"] :host {\n position: relative;\n }\n\n html[data-ui-input-modality=\"touch\"] :host::after {\n content: \"\";\n position: absolute;\n inset: 50% auto auto 50%;\n inline-size: max(100%, var(--ui-control-min-block-size));\n block-size: max(100%, var(--ui-control-min-block-size));\n transform: translate(-50%, -50%);\n }\n\n :host-state([size=\"sm\"]) {\n --_size: 1.75rem;\n inline-size: var(--ui-icon-button-size, var(--_size));\n block-size: var(--ui-icon-button-size, var(--_size));\n min-inline-size: var(--ui-icon-button-size, var(--_size));\n min-block-size: var(--ui-icon-button-size, var(--_size));\n }\n\n :host-state([size=\"lg\"]) {\n --_size: 2.5rem;\n inline-size: var(--ui-icon-button-size, var(--_size));\n block-size: var(--ui-icon-button-size, var(--_size));\n min-inline-size: var(--ui-icon-button-size, var(--_size));\n min-block-size: var(--ui-icon-button-size, var(--_size));\n }\n\n :host-state([round]) {\n border-radius: var(--ui-radius-round);\n }\n\n :host-state([variant=\"outline\"]) {\n border-color: var(--ui-icon-button-border, var(--ui-border-default));\n background: var(--ui-icon-button-outline-surface, var(--ui-surface-default));\n color: var(--ui-icon-button-outline-text, var(--ui-text-primary));\n }\n\n :host-state([variant=\"solid\"]) {\n background: var(--ui-icon-button-solid-surface, var(--ui-accent-solid));\n color: var(--ui-icon-button-solid-text, var(--ui-text-on-accent));\n box-shadow: var(\n --ui-icon-button-solid-shadow,\n 0 1px 2px color-mix(in srgb, var(--ui-accent-solid) 18%, transparent)\n );\n }\n\n :host:hover:enabled {\n /* Derived from the text colour so the ghost hover shows on any background. */\n background: var(--ui-icon-button-hover-surface, color-mix(in srgb, currentColor 8%, transparent));\n color: var(--ui-icon-button-hover-text, var(--ui-text-primary));\n }\n\n :host-state([variant=\"outline\"]):hover:enabled {\n border-color: var(--ui-icon-button-hover-border, var(--ui-border-strong));\n }\n\n :host-state([variant=\"solid\"]):hover:enabled {\n background: var(--ui-icon-button-solid-hover-surface, var(--ui-accent-hover));\n }\n\n :host:active:enabled {\n transform: scale(var(--ui-icon-button-active-scale, 0.96));\n }\n\n :host:focus-visible {\n outline: none;\n box-shadow: var(--ui-focus-halo);\n }\n\n /* Disabled colours fall back to each variant's own; ghost takes only the icon colour. */\n :host:disabled {\n opacity: var(--ui-icon-button-disabled-opacity, 1);\n color: var(--ui-icon-button-disabled-text, var(--ui-disabled-text));\n cursor: not-allowed;\n }\n\n :host-state([variant=\"outline\"]):disabled {\n border-color: var(--ui-icon-button-disabled-border, var(--ui-border));\n background-color: var(--ui-icon-button-disabled-surface, var(--ui-disabled-surface));\n color: var(--ui-icon-button-disabled-text, var(--ui-disabled-text));\n }\n\n :host-state([variant=\"solid\"]):disabled {\n border-color: var(--ui-icon-button-disabled-border, var(--ui-border));\n background-color: var(--ui-icon-button-disabled-surface, var(--ui-disabled-surface));\n color: var(--ui-icon-button-disabled-text, var(--ui-disabled-text));\n }\n\n :host {\n --_icon-button-icon-default: var(--ui-icon-size-md);\n }\n\n :host-state([size=\"sm\"]) {\n --_icon-button-icon-default: var(--ui-icon-size-sm);\n }\n\n :host-state([size=\"lg\"]) {\n --_icon-button-icon-default: var(--ui-icon-size-lg);\n }\n\n :slotted(svg) {\n inline-size: var(--ui-icon-button-icon-size, var(--_icon-button-icon-default));\n block-size: var(--ui-icon-button-icon-size, var(--_icon-button-icon-default));\n flex-shrink: 0;\n stroke-width: var(--ui-icon-button-icon-stroke-width, 1.75);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"button","choices":["button"]},"controller":"./components/ui-icon-button/ui-icon-button.js"},{"source":{"file":"./components/ui-icon/ui-icon.html"},"contract":{"version":1,"name":"UiIcon","tag":"ui-icon","nativeElement":"span","props":{"name":{"type":"string","required":false,"target":{"attribute":"name"},"description":"The icon's name.","default":""}}},"template":{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"},{"kind":"literal","name":"focusable","value":"false"}],"children":[{"kind":"element","name":"g","attributes":[],"children":[{"kind":"element","name":"path","attributes":[{"kind":"attribute","name":"d","expression":"shape.d","expressionPlan":{"source":"shape.d","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"d"},"dependencies":["shape.d"]}}],"children":[],"flow":{"kind":"if","test":"shape.tag = 'path'","testPlan":{"source":"shape.tag = 'path'","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"tag"},"right":{"kind":"literal","value":"path"}},"dependencies":["shape.tag"]}}},{"kind":"element","name":"circle","attributes":[{"kind":"attribute","name":"cx","expression":"shape.cx","expressionPlan":{"source":"shape.cx","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"cx"},"dependencies":["shape.cx"]}},{"kind":"attribute","name":"cy","expression":"shape.cy","expressionPlan":{"source":"shape.cy","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"cy"},"dependencies":["shape.cy"]}},{"kind":"attribute","name":"r","expression":"shape.r","expressionPlan":{"source":"shape.r","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"r"},"dependencies":["shape.r"]}}],"children":[],"flow":{"kind":"if","test":"shape.tag = 'circle'","testPlan":{"source":"shape.tag = 'circle'","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"tag"},"right":{"kind":"literal","value":"circle"}},"dependencies":["shape.tag"]}}},{"kind":"element","name":"rect","attributes":[{"kind":"attribute","name":"x","expression":"shape.x","expressionPlan":{"source":"shape.x","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"x"},"dependencies":["shape.x"]}},{"kind":"attribute","name":"y","expression":"shape.y","expressionPlan":{"source":"shape.y","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"y"},"dependencies":["shape.y"]}},{"kind":"attribute","name":"width","expression":"shape.width","expressionPlan":{"source":"shape.width","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"width"},"dependencies":["shape.width"]}},{"kind":"attribute","name":"height","expression":"shape.height","expressionPlan":{"source":"shape.height","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"height"},"dependencies":["shape.height"]}},{"kind":"attribute","name":"rx","expression":"shape.rx","expressionPlan":{"source":"shape.rx","ast":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"rx"},"dependencies":["shape.rx"]}}],"children":[],"flow":{"kind":"if","test":"shape.tag = 'rect'","testPlan":{"source":"shape.tag = 'rect'","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"shape"},"key":"tag"},"right":{"kind":"literal","value":"rect"}},"dependencies":["shape.tag"]}}}],"flow":{"kind":"each","item":"shape","list":"shapes","listPlan":{"source":"shapes","ast":{"kind":"id","name":"shapes"},"dependencies":["shapes"]}}}]}]},"css":":host {\n display: inline-flex;\n flex: none;\n inline-size: var(--ui-icon-size, 1em);\n block-size: var(--ui-icon-size, 1em);\n }\n\n svg {\n inline-size: 100%;\n block-size: 100%;\n stroke-width: var(--ui-icon-stroke-width, 2);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"shapes","type":"list(object({ tag: path | circle | rect, d?: string, cx?: string, cy?: string, r?: string, x?: string, y?: string, width?: string, height?: string, rx?: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}}],"slots":[],"root":{"kind":"native","element":"span","choices":["span"]},"controller":"./components/ui-icon/ui-icon.js"},{"source":{"file":"./components/ui-input/ui-input.html"},"contract":{"version":1,"name":"UiInput","tag":"ui-input","nativeElement":"input","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"Prevents editing and form submission.","default":false},"invalid":{"type":"boolean","required":false,"target":{"attribute":"aria-invalid"},"description":"Exposes invalid state to assistive technology and styling.","default":false},"readonly":{"type":"boolean","required":false,"target":{"attribute":"readonly"},"description":"Allows selection without allowing edits.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"Marks the control as required for form validation.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"Current text value."}}},"template":{"kind":"element","name":"input","attributes":[{"kind":"attribute","name":"value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"readonly","expression":"readonly","expressionPlan":{"source":"readonly","ast":{"kind":"id","name":"readonly"},"dependencies":["readonly"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"aria-invalid","expression":"invalid","expressionPlan":{"source":"invalid","ast":{"kind":"id","name":"invalid"},"dependencies":["invalid"]}}],"children":[]},"css":":host {\n box-sizing: border-box;\n display: inline-block;\n inline-size: 100%;\n min-inline-size: 0;\n min-block-size: var(--ui-control-size-md);\n margin: 0;\n padding: var(--ui-space-2) var(--ui-space-3);\n appearance: none;\n border: 1px solid var(--ui-control-border, var(--ui-border-strong));\n border-radius: var(--ui-input-radius, var(--ui-radius-md));\n background: var(--ui-control-surface, var(--ui-surface-elevated));\n color: var(--ui-text-primary);\n font: inherit;\n line-height: var(--ui-line-height-md);\n box-shadow: var(--ui-input-shadow, var(--ui-control-inset));\n transition:\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease),\n background-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* Tabbing into a field selects its text; tint that selection softly instead of the page highlight. */\n :host::selection {\n background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);\n color: inherit;\n }\n\n :host::placeholder {\n color: var(--ui-control-placeholder, var(--ui-text-secondary));\n opacity: 1;\n }\n\n :host:hover:not(:focus):not(:disabled) {\n border-color: var(--ui-control-border-hover, var(--ui-text-secondary));\n }\n\n :host:focus-visible {\n border-color: var(--ui-control-focus, var(--ui-accent-solid));\n outline: none;\n box-shadow: var(--ui-input-focus-shadow, var(--ui-control-inset), var(--ui-control-focus-halo-shadow));\n }\n\n /* The app's invalid flag, or the browser's own verdict once the user has left an invalid field. */\n :host[aria-invalid=\"true\"],\n :host:user-invalid {\n border-color: var(--ui-danger-solid);\n }\n\n :host:is([aria-invalid=\"true\"], :user-invalid):focus-visible {\n box-shadow:\n var(--ui-control-inset),\n 0 0 0 3px color-mix(in srgb, var(--ui-danger-solid) 22%, transparent);\n }\n\n :host:disabled {\n background: var(--ui-control-surface-disabled, var(--ui-surface-muted));\n color: var(--ui-text-muted);\n box-shadow: none;\n cursor: not-allowed;\n }\n\n /* No text-box-trim here: trimming a native input's line box below its line height lets the text\n * scroll vertically inside the field. Native inputs already center their single line. */\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[],"root":{"kind":"native","element":"input","choices":["input"]},"controller":"./components/ui-input/ui-input.js"},{"source":{"file":"./components/ui-menu-item/ui-menu-item.html"},"contract":{"version":1,"name":"UiMenuItem","tag":"ui-menu-item","nativeElement":"div","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"aria-disabled"},"description":"disabled token.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"data-value"},"description":"value token.","default":""}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"menuitem"},{"kind":"literal","name":"tabindex","value":"-1"},{"kind":"attribute","name":"aria-disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"data-value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}}],"children":[{"kind":"slot"}]},"css":":host {\n display: block;\n box-sizing: border-box;\n width: 100%;\n padding: var(--ui-menu-item-padding-block, var(--ui-space-2)) var(--ui-menu-item-padding-inline, var(--ui-space-3));\n text-align: left;\n border-radius: var(--ui-menu-item-radius, var(--ui-radius-md));\n color: var(--ui-text-primary);\n font-size: var(--ui-menu-item-font-size, var(--ui-font-size-md));\n font-weight: var(--ui-font-medium);\n cursor: pointer;\n outline: none;\n transition: background-color var(--ui-motion-fast) var(--ui-motion-ease), color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high. */\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high.\n * Trimming applies to block containers, so the box is a block with centred content. */\n @supports (text-box-trim: trim-both) {\n :host {\n display: block;\n min-block-size: var(--ui-menu-item-min-block-size, var(--ui-control-size-md, 2.5rem));\n align-content: center;\n text-box-trim: trim-both;\n text-box-edge: cap alphabetic;\n }\n }\n\n :host:is(:hover, :focus-visible):not([aria-disabled=\"true\"]) {\n background: var(--ui-menu-item-hover-surface, var(--ui-surface-subtle));\n }\n\n :host[aria-disabled=\"true\"] {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-menu/ui-menu.html"},"contract":{"version":1,"name":"UiMenu","tag":"ui-menu","nativeElement":"div","props":{"density":{"type":{"enum":["comfortable","compact"]},"required":false,"target":{"attribute":"density"},"description":"Compact trades padding and type size for rows that fit more on screen.","default":"comfortable"},"for":{"type":"string","required":false,"target":{"attribute":"for"},"description":"ID of the control that toggles and anchors the menu.","default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the menu is open initially or when set externally.","default":false},"placement":{"type":"string","required":false,"target":{"attribute":"placement"},"description":"Positions an associated menu relative to its trigger.","default":"bottom-start"}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"menu"},{"kind":"literal","name":"aria-orientation","value":"vertical"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"surface"}],"children":[{"kind":"slot"}]}]},"css":"/* Compact sets the part tokens its items read, so nothing has to rescale a global. */\n :host-state([density=\"compact\"]) {\n --ui-menu-item-padding-block: var(--ui-space-1);\n --ui-menu-item-padding-inline: var(--ui-space-2);\n --ui-menu-item-font-size: var(--ui-font-size-sm);\n --ui-menu-item-radius: var(--ui-radius-sm);\n padding: var(--ui-space-1);\n gap: 0;\n }\n\n :host {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n inline-size: max-content;\n min-inline-size: min(12rem, calc(100vw - var(--ui-menu-viewport-gap, var(--ui-space-2)) * 2));\n max-inline-size: calc(100vw - var(--ui-menu-viewport-gap, var(--ui-space-2)) * 2);\n padding: 0;\n border: 0;\n outline: 0;\n border-radius: 0;\n background: transparent;\n box-shadow: none;\n overflow: visible;\n }\n\n .surface {\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n max-inline-size: inherit;\n padding: var(--ui-space-1);\n background: var(--ui-surface-elevated);\n border: 1px solid var(--ui-border-default);\n border-radius: var(--ui-radius-lg);\n box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));\n max-block-size: inherit;\n overflow: auto;\n }\n\n :host:not(:host-state([internalOpen])) {\n display: none;\n }\n\n :host[popover] {\n position: fixed;\n inset: auto;\n margin: 0;\n overflow: visible;\n max-block-size: calc(100dvh - var(--ui-menu-viewport-gap, var(--ui-space-2)) * 2);\n opacity: 0;\n transform: translateY(-4px) scale(0.99);\n transition:\n opacity var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease),\n display var(--ui-motion-fast) allow-discrete,\n overlay var(--ui-motion-fast) allow-discrete;\n }\n\n :host[popover]:popover-open {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n @starting-style {\n :host[popover]:popover-open {\n opacity: 0;\n transform: translateY(-4px) scale(0.99);\n }\n }\n\n :host[hidden] {\n display: none;\n }\n\n @media (prefers-reduced-motion: reduce) {\n :host[popover] {\n transition: none;\n }\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"select","type":"object({ value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"open","type":"object({ open: boolean, reason: action | programmatic, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-menu/ui-menu.js"},{"source":{"file":"./components/ui-popover/ui-popover.html"},"contract":{"version":1,"name":"UiPopover","tag":"ui-popover","nativeElement":"span","props":{"for":{"type":"string","required":false,"target":{"attribute":"for"},"description":"ID of the control that toggles and anchors the popover.","default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the popover is open initially or when set externally.","default":false},"placement":{"type":"string","required":false,"target":{"attribute":"placement"},"description":"Positions the surface relative to its trigger.","default":"bottom-start"}}},"template":{"kind":"element","name":"span","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"surface"}],"children":[{"kind":"slot"}]}]},"css":":host {\n box-sizing: border-box;\n max-inline-size: min(\n 20rem,\n calc(100vw - var(--ui-popover-viewport-gap, var(--ui-space-2)) * 2)\n );\n max-block-size: calc(100dvh - var(--ui-popover-viewport-gap, var(--ui-space-2)) * 2);\n overflow: visible;\n padding: 0;\n border: 0;\n outline: 0;\n border-radius: 0;\n background: transparent;\n box-shadow: none;\n }\n\n .surface {\n box-sizing: border-box;\n max-inline-size: inherit;\n max-block-size: inherit;\n overflow: auto;\n padding: var(--ui-space-3);\n background: var(--ui-surface-elevated);\n border: 1px solid var(--ui-border-default);\n border-radius: var(--ui-radius-lg);\n box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));\n }\n\n :host:not(:host-state([internalOpen])) {\n display: none;\n }\n\n :host[popover] {\n position: fixed;\n inset: auto;\n margin: 0;\n opacity: 0;\n transform: translateY(-4px) scale(0.99);\n transition:\n opacity var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease),\n display var(--ui-motion-fast) allow-discrete,\n overlay var(--ui-motion-fast) allow-discrete;\n }\n\n :host[popover]:popover-open {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n\n @starting-style {\n :host[popover]:popover-open {\n opacity: 0;\n transform: translateY(-4px) scale(0.99);\n }\n }\n\n :host[hidden] {\n display: none;\n }\n\n @media (prefers-reduced-motion: reduce) {\n :host[popover] {\n transition: none;\n }\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"open","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"span","choices":["span"]},"controller":"./components/ui-popover/ui-popover.js"},{"source":{"file":"./components/ui-radio-group/ui-radio-group.html"},"contract":{"version":1,"name":"UiRadioGroup","tag":"ui-radio-group","nativeElement":"fieldset","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"label":{"type":"string","required":false,"target":{"attribute":"label"},"description":"label token.","default":"Options"},"name":{"type":"string","required":false,"target":{"attribute":"name"},"description":"name token.","default":""},"orientation":{"type":{"enum":["horizontal","vertical"]},"required":false,"target":{"attribute":"orientation"},"description":"orientation token.","default":"horizontal"},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"required token.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"value token.","default":""}}},"template":{"kind":"element","name":"fieldset","attributes":[{"kind":"literal","name":"role","value":"radiogroup"}],"children":[{"kind":"element","name":"legend","attributes":[],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[]}]},{"kind":"slot"}]},"css":":host {\n display: inline-flex;\n align-items: center;\n gap: var(--ui-space-2);\n min-inline-size: 0;\n margin: 0;\n padding: 0;\n border: 0;\n }\n\n legend {\n float: inline-start;\n inline-size: 100%;\n margin: 0 0 var(--ui-space-2);\n padding: 0;\n color: var(--ui-text-primary);\n font-weight: var(--ui-font-medium);\n }\n\n legend + * {\n clear: both;\n }\n\n :host-state([orientation=\"vertical\"]) {\n display: inline-grid;\n justify-items: start;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalValue","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"event","name":"select","type":"object({ value: string, previousValue: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"change","type":"object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"fieldset","choices":["fieldset"]},"controller":"./components/ui-radio-group/ui-radio-group.js"},{"source":{"file":"./components/ui-radio/ui-radio.html"},"contract":{"version":1,"name":"UiRadio","tag":"ui-radio","nativeElement":"label","props":{"checked":{"type":"boolean","required":false,"target":{"attribute":"checked"},"description":"Whether the radio is checked initially or when set externally.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"name":{"type":"string","required":false,"target":{"attribute":"name"},"description":"name token.","default":""},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"required token.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"value token.","default":"on"}}},"template":{"kind":"element","name":"label","attributes":[],"children":[{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"radio"},{"kind":"property","key":"checked","name":"checked","expression":"internalChecked","expressionPlan":{"source":"internalChecked","ast":{"kind":"id","name":"internalChecked"},"dependencies":["internalChecked"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}},{"kind":"attribute","name":"name","expression":"name","expressionPlan":{"source":"name","ast":{"kind":"id","name":"name"},"dependencies":["name"]}}],"children":[],"ref":"input"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot"}]}]},"css":":host {\n display: inline-flex;\n align-items: flex-start;\n gap: var(--ui-radio-gap, var(--ui-space-2));\n max-inline-size: 100%;\n color: var(--ui-text-primary);\n cursor: pointer;\n }\n\n .label {\n min-inline-size: 0;\n line-height: var(--ui-line-height-md);\n }\n\n input {\n flex: 0 0 auto;\n inline-size: var(--ui-radio-size, 1.125rem);\n block-size: var(--ui-radio-size, 1.125rem);\n margin: 0.125em 0 0;\n accent-color: var(--ui-accent-solid);\n cursor: pointer;\n }\n\n input:focus-visible {\n outline: 2px solid var(--ui-focus-ring, var(--ui-accent-solid));\n outline-offset: 2px;\n }\n\n :host-state([disabled]) {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n :host-state([disabled]) input {\n cursor: not-allowed;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalChecked","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"change","type":"object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"label","choices":["label"]},"controller":"./components/ui-radio/ui-radio.js"},{"source":{"file":"./components/ui-reel/ui-reel.html"},"contract":{"version":1,"name":"UiReel","tag":"ui-reel","nativeElement":"div","props":{"gap":{"type":{"enum":["xs","s","m","l","xl"]},"required":false,"target":{"attribute":"gap"},"description":"gap token."},"itemWidth":{"type":{"enum":["sm","md","lg"]},"required":false,"target":{"attribute":"itemwidth"},"description":"itemWidth token."},"snap":{"type":{"enum":["start","center"]},"required":false,"target":{"attribute":"snap"},"description":"snap token."}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"region"},{"kind":"literal","name":"tabindex","value":"0"}],"children":[{"kind":"slot"}]},"css":":host {\n --_reel-gap: var(--ui-space-4);\n --_reel-item-width: auto;\n display: flex;\n inline-size: 100%;\n gap: var(--ui-reel-gap, var(--_reel-gap));\n min-inline-size: 0;\n max-inline-size: 100%;\n margin: 0;\n overflow-x: auto;\n overflow-y: hidden;\n overscroll-behavior-inline: contain;\n }\n\n :host > :slotted(*) {\n min-inline-size: 0;\n flex: 0 0 var(--ui-reel-item-width, var(--_reel-item-width));\n }\n\n :host-state([gap=\"xs\"]) {\n --_reel-gap: var(--ui-space-2);\n }\n :host-state([gap=\"s\"]) {\n --_reel-gap: var(--ui-space-3);\n }\n :host-state([gap=\"m\"]) {\n --_reel-gap: var(--ui-space-4);\n }\n :host-state([gap=\"l\"]) {\n --_reel-gap: var(--ui-space-5);\n }\n :host-state([gap=\"xl\"]) {\n --_reel-gap: var(--ui-space-6);\n }\n :host-state([itemWidth=\"sm\"]) {\n --_reel-item-width: 12rem;\n }\n :host-state([itemWidth=\"md\"]) {\n --_reel-item-width: 16rem;\n }\n :host-state([itemWidth=\"lg\"]) {\n --_reel-item-width: 20rem;\n }\n :host-state([snap]) {\n scroll-snap-type: inline mandatory;\n }\n :host-state([snap=\"start\"]) > :slotted(*) {\n scroll-snap-align: start;\n }\n :host-state([snap=\"center\"]) > :slotted(*) {\n scroll-snap-align: center;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-search-result-row/ui-search-result-row.html"},"contract":{"version":1,"name":"UiSearchResultRow","tag":"ui-search-result-row","nativeElement":"button","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"selected":{"type":"boolean","required":false,"target":{"attribute":"selected"},"description":"selected token.","default":false}}},"template":{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"leading"}],"children":[{"kind":"slot","fallback":[],"name":"leading"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"content"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"title"}],"children":[{"kind":"slot","fallback":[],"name":"title"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"meta"}],"children":[{"kind":"slot","fallback":[],"name":"meta"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"excerpt"}],"children":[{"kind":"slot","fallback":[],"name":"excerpt"}]}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"trailing"}],"children":[{"kind":"slot","fallback":[],"name":"trailing"}]}]},"css":":host {\n appearance: none;\n inline-size: 100%;\n min-block-size: var(--ui-search-result-row-min-height, 56px);\n margin: 0;\n padding-block: var(--ui-search-result-row-padding-block, var(--ui-space-3));\n padding-inline: var(--ui-search-result-row-padding-inline, var(--ui-space-4));\n display: flex;\n align-items: flex-start;\n gap: var(--ui-search-result-row-gap, var(--ui-space-3));\n background: var(--ui-search-result-row-surface, transparent);\n border: none;\n border-block-end: 1px solid var(--ui-search-result-row-border, var(--ui-border));\n color: inherit;\n cursor: pointer;\n text-align: left;\n transition: background-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n :host:last-child {\n border-block-end: none;\n }\n\n :host:hover:enabled {\n background: var(--ui-search-result-row-hover-surface, color-mix(in srgb, var(--ui-surface) 85%, black 3%));\n }\n\n :host-state([selected]) {\n background: var(\n --ui-search-result-row-selected-bg,\n var(--ui-search-result-row-hover-surface, color-mix(in srgb, var(--ui-surface) 85%, black 3%))\n );\n }\n\n :host:focus-visible {\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: -2px;\n }\n\n :host:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n .leading,\n .trailing {\n display: inline-flex;\n align-items: flex-start;\n flex-shrink: 0;\n }\n\n .content {\n min-inline-size: 0;\n flex: 1;\n display: flex;\n flex-direction: column;\n }\n\n .title,\n .meta,\n .excerpt {\n display: block;\n min-inline-size: 0;\n }\n\n /* An unused region takes no space. */\n .leading:empty,\n .meta:empty,\n .excerpt:empty,\n .trailing:empty {\n display: none;\n }\n\n :slotted([slot=\"title\"]),\n :slotted([slot=\"meta\"]),\n :slotted([slot=\"excerpt\"]) {\n display: block;\n margin: 0;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true,"name":"leading"},{"dynamic":false,"required":true,"name":"title"},{"dynamic":false,"required":true,"name":"meta"},{"dynamic":false,"required":true,"name":"excerpt"},{"dynamic":false,"required":true,"name":"trailing"}],"root":{"kind":"native","element":"button","choices":["button"]}},{"source":{"file":"./components/ui-search-shell/ui-search-shell.html"},"contract":{"version":1,"name":"UiSearchShell","tag":"ui-search-shell","nativeElement":"div","props":{"dismissible":{"type":"boolean","required":false,"target":{"attribute":"dismissible"},"description":"Allows Escape and backdrop activation to close the search surface.","default":false},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"Provides the native dialog's accessible name.","default":"Search"},"modal":{"type":"boolean","required":false,"target":{"attribute":"modal"},"description":"Makes the rest of the page inert while the search surface is open.","default":false},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Shows the search surface.","default":false}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"dialog","attributes":[{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"panel"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"search"}],"children":[{"kind":"slot","fallback":[],"name":"search"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"status"}],"children":[{"kind":"slot","fallback":[],"name":"status"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"body"}],"children":[{"kind":"slot","fallback":[],"name":"body"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"footer"}],"children":[{"kind":"slot","fallback":[],"name":"footer"}]}]}],"ref":"dialog"}]},"css":":host {\n display: contents;\n }\n\n dialog {\n position: fixed;\n inset: 0;\n z-index: var(--ui-search-shell-z-index, 400);\n box-sizing: border-box;\n inline-size: 100%;\n max-inline-size: none;\n block-size: 100%;\n max-block-size: none;\n margin: 0;\n padding: var(--ui-search-shell-padding-top, 10vh) var(--ui-search-shell-viewport-gap, var(--ui-space-4))\n var(--ui-search-shell-viewport-gap, var(--ui-space-4));\n overflow: auto;\n border: 0;\n background: var(--ui-overlay-backdrop);\n color: var(--ui-text-primary);\n }\n\n dialog::backdrop {\n background: var(--ui-overlay-backdrop);\n }\n\n .panel {\n position: relative;\n display: flex;\n flex-direction: column;\n inline-size: min(100%, var(--ui-search-shell-max-width, 40rem));\n max-block-size: var(--ui-search-shell-max-height, 80vh);\n margin-inline: auto;\n overflow: hidden;\n background: var(--ui-search-shell-surface, var(--ui-surface-elevated));\n border: 1px solid var(--ui-search-shell-border, var(--ui-border-default));\n border-radius: var(--ui-search-shell-radius, var(--ui-radius-dialog));\n box-shadow: var(--ui-search-shell-shadow, var(--ui-elevation-dialog, var(--ui-shadow-xl)));\n }\n\n .search {\n padding: var(--ui-space-3);\n border-block-end: 1px solid var(--ui-border-default);\n transition: border-color var(--ui-motion-fast) var(--ui-motion-ease), box-shadow var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* The search region shows where typing goes, whatever the author put in it. */\n .search:focus-within {\n border-block-end-color: var(--ui-search-shell-focus-color, var(--ui-control-focus));\n box-shadow: inset 0 -1px 0 var(--ui-search-shell-focus-color, var(--ui-control-focus));\n }\n\n :slotted(input[slot=\"search\"]) {\n box-sizing: border-box;\n inline-size: 100%;\n min-block-size: var(--ui-control-min-block-size);\n padding: var(--ui-space-2) var(--ui-space-3);\n border: 1px solid var(--ui-control-border);\n border-radius: var(--ui-radius-md);\n background: var(--ui-control-surface);\n color: var(--ui-text-primary);\n font: inherit;\n box-shadow: var(--ui-shadow-xs);\n }\n\n :slotted(input[slot=\"search\"]:focus-visible) {\n border-color: var(--ui-control-focus);\n outline: 2px solid var(--ui-focus-ring);\n outline-offset: 2px;\n }\n\n .status,\n .footer {\n flex-shrink: 0;\n padding: var(--ui-space-2) var(--ui-space-4);\n color: var(--ui-text-secondary);\n font-size: var(--ui-font-size-sm);\n }\n\n .status {\n border-block-end: 1px solid var(--ui-border-default);\n }\n\n /* Laid out like the dialog's action row: actions right-aligned, spaced as buttons, no fill. */\n .footer {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: flex-end;\n gap: var(--ui-space-2);\n padding: var(--ui-space-3) var(--ui-space-4);\n border-block-start: 1px solid var(--ui-border-default);\n }\n\n .status:empty,\n .footer:empty {\n display: none;\n }\n\n .body {\n flex: 1;\n min-block-size: 0;\n overflow: auto;\n padding: var(--ui-space-2);\n }\n\n @media (max-width: 47.9375rem) {\n dialog {\n padding: 0;\n }\n\n .panel {\n inline-size: 100%;\n min-block-size: 100dvh;\n max-block-size: none;\n border: 0;\n border-radius: 0;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true,"name":"search"},{"dynamic":false,"required":true,"name":"status"},{"dynamic":false,"required":true,"name":"body"},{"dynamic":false,"required":true,"name":"footer"}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-search-shell/ui-search-shell.js"},{"source":{"file":"./components/ui-select/ui-select.html"},"contract":{"version":1,"name":"UiSelect","tag":"ui-select","nativeElement":"select","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"Prevents selection and form submission.","default":false},"invalid":{"type":"boolean","required":false,"target":{"attribute":"aria-invalid"},"description":"Exposes invalid state to assistive technology and styling.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"Requires a non-empty option for form validation.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"Currently selected option value."}}},"template":{"kind":"element","name":"select","attributes":[{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"aria-invalid","expression":"invalid","expressionPlan":{"source":"invalid","ast":{"kind":"id","name":"invalid"},"dependencies":["invalid"]}}],"children":[{"kind":"slot"}]},"css":":host {\n box-sizing: border-box;\n display: inline-block;\n inline-size: 100%;\n min-inline-size: 0;\n min-block-size: var(--ui-control-size-md);\n margin: 0;\n padding: var(--ui-space-2) var(--ui-space-3);\n border: 1px solid var(--ui-control-border, var(--ui-border-strong));\n border-radius: var(--ui-select-radius, var(--ui-radius-md));\n background-color: var(--ui-control-surface, var(--ui-surface-elevated));\n color: var(--ui-text-primary);\n color-scheme: light dark;\n font: inherit;\n line-height: var(--ui-line-height-md);\n box-shadow: var(--ui-select-shadow, var(--ui-control-inset));\n transition:\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease),\n background-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* The select draws its own chevron: the native caret cannot be inset or sized consistently.\n * The root stays a native <s-lect>, so the icon is a background image rather than an element. */\n :host {\n appearance: none;\n padding-inline-end: calc(var(--ui-space-3) + 1.5rem);\n background-image: var(\n --ui-select-chevron,\n url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235c5c58' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\")\n );\n background-repeat: no-repeat;\n background-position: right var(--ui-space-3) center;\n background-size: 1.125rem 1.125rem;\n }\n\n :host:hover:not(:focus):not(:disabled) {\n border-color: var(--ui-control-border-hover, var(--ui-text-secondary));\n }\n\n :host:focus-visible {\n border-color: var(--ui-control-focus, var(--ui-accent-solid));\n outline: none;\n box-shadow: var(--ui-select-focus-shadow, var(--ui-control-inset), var(--ui-control-focus-halo-shadow));\n }\n\n /* The app's invalid flag, or the browser's own verdict once the user has left an invalid field. */\n :host[aria-invalid=\"true\"],\n :host:user-invalid {\n border-color: var(--ui-danger-solid);\n }\n\n :host:is([aria-invalid=\"true\"], :user-invalid):focus-visible {\n box-shadow:\n var(--ui-control-inset),\n 0 0 0 3px color-mix(in srgb, var(--ui-danger-solid) 22%, transparent);\n }\n\n :host:disabled {\n background-color: var(--ui-control-surface-disabled, var(--ui-surface-muted));\n color: var(--ui-text-muted);\n box-shadow: none;\n cursor: not-allowed;\n }\n\n :host[size]:not([size=\"1\"]) {\n min-block-size: 7rem;\n padding: var(--ui-space-2);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"select","choices":["select"]},"controller":"./components/ui-select/ui-select.js"},{"source":{"file":"./components/ui-separator/ui-separator.html"},"contract":{"version":1,"name":"UiSeparator","tag":"ui-separator","nativeElement":"hr","props":{"orientation":{"type":{"enum":["horizontal","vertical"]},"required":false,"target":{"attribute":"aria-orientation"},"description":"Whether the separator divides stacked content (horizontal) or inline content (vertical).","default":"horizontal"}}},"template":{"kind":"element","name":"hr","attributes":[{"kind":"attribute","name":"aria-orientation","expression":"orientation","expressionPlan":{"source":"orientation","ast":{"kind":"id","name":"orientation"},"dependencies":["orientation"]}}],"children":[]},"css":"hr {\n box-sizing: border-box;\n align-self: stretch;\n margin: 0;\n border: 0;\n border-block-start: 1px solid var(--ui-separator-color, var(--ui-border-default));\n }\n\n hr[aria-orientation=\"vertical\"] {\n block-size: auto;\n border-block-start: 0;\n border-inline-start: 1px solid var(--ui-separator-color, var(--ui-border-default));\n }","declarations":[],"slots":[],"root":{"kind":"native","element":"hr","choices":["hr"]}},{"source":{"file":"./components/ui-sidebar/ui-sidebar.html"},"contract":{"version":1,"name":"UiSidebar","tag":"ui-sidebar","nativeElement":"aside","props":{"breakpoint":{"type":{"enum":["sm","md","lg"]},"required":false,"target":{"attribute":"breakpoint"},"description":"Below this viewport width (40rem, 48rem, 64rem) the sidebar becomes an off-canvas drawer, closed until toggled.","default":"md"},"collapsed":{"type":"boolean","required":false,"target":{"attribute":"collapsed"},"description":"Whether the docked sidebar is collapsed.","default":false},"maxWidth":{"type":"number","required":false,"target":{"attribute":"maxwidth"},"description":"The widest width the resize handle allows, in pixels.","default":480},"minWidth":{"type":"number","required":false,"target":{"attribute":"minwidth"},"description":"The narrowest width the resize handle allows, in pixels.","default":200},"resizable":{"type":"boolean","required":false,"target":{"attribute":"resizable"},"description":"Adds a resize handle on the inner edge (drag, or arrow keys, Home, and End).","default":false},"resizeLabel":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"Accessible name of the resize handle.","default":"Resize sidebar"},"resizeStep":{"type":"number","required":false,"target":{"attribute":"resizestep"},"description":"Arrow-key resize step in pixels.","default":16},"side":{"type":{"enum":["start","end"]},"required":false,"target":{"attribute":"side"},"description":"The edge the sidebar sits on. The page places it beside its main content.","default":"start"},"width":{"type":"number","required":false,"target":{"attribute":"width"},"description":"Docked width in pixels. 0 uses --ui-sidebar-width (280px by default); dragging the handle updates it.","default":0}}},"template":{"kind":"element","name":"aside","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"content"}],"children":[{"kind":"slot"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"resizer"},{"kind":"literal","name":"role","value":"separator"},{"kind":"literal","name":"aria-orientation","value":"vertical"},{"kind":"literal","name":"tabindex","value":"0"},{"kind":"literal","name":"data-ui-affordance","value":"resize"},{"kind":"attribute","name":"aria-label","expression":"resizeLabel","expressionPlan":{"source":"resizeLabel","ast":{"kind":"id","name":"resizeLabel"},"dependencies":["resizeLabel"]}},{"kind":"attribute","name":"hidden","expression":"not resizable or drawer or internalCollapsed","expressionPlan":{"source":"not resizable or drawer or internalCollapsed","ast":{"kind":"binary","op":"or","left":{"kind":"binary","op":"or","left":{"kind":"unary","op":"not","operand":{"kind":"id","name":"resizable"}},"right":{"kind":"id","name":"drawer"}},"right":{"kind":"id","name":"internalCollapsed"}},"dependencies":["drawer","internalCollapsed","resizable"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"guide"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]}],"ref":"resizer"}]},"css":":host {\n position: relative;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n flex: none;\n inline-size: var(--_sidebar-width, var(--ui-sidebar-width, 280px));\n max-inline-size: 100%;\n min-block-size: 0;\n background: var(--ui-sidebar-surface, var(--ui-surface-default));\n border-inline-end: 1px solid var(--ui-sidebar-border, var(--ui-border-default));\n }\n\n :host-state([side=\"end\"]) {\n border-inline-end: 0;\n border-inline-start: 1px solid var(--ui-sidebar-border, var(--ui-border-default));\n }\n\n .content {\n flex: 1;\n min-block-size: 0;\n overflow: auto;\n }\n\n /* Collapsed while docked. */\n :host-state([internalCollapsed]):not([popover]) {\n display: none;\n }\n\n .resizer {\n position: absolute;\n z-index: 1;\n inset-block: 0;\n /* On the panel's inner edge: the end edge of a start sidebar. */\n inset-inline-end: 0;\n inline-size: 8px;\n min-inline-size: 8px;\n transform: translateX(50%);\n cursor: col-resize;\n touch-action: none;\n outline: none;\n }\n\n .resizer[hidden] {\n display: none;\n }\n\n :host-state([side=\"end\"]) .resizer {\n inset-inline-end: auto;\n inset-inline-start: 0;\n transform: translateX(-50%);\n }\n\n .resizer::after {\n content: \"\";\n position: absolute;\n inset-block: 0;\n inset-inline-start: 3px;\n inline-size: 2px;\n background: color-mix(in srgb, var(--ui-affordance-guide-color, var(--ui-border-strong)) 45%, transparent);\n opacity: var(--ui-affordance-guide-opacity);\n transition:\n background-color var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease),\n opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n }\n\n .guide {\n position: absolute;\n inset-block-start: 50%;\n inset-inline-start: 50%;\n inline-size: 6px;\n block-size: 22px;\n border: 1px solid var(--ui-border-strong);\n border-radius: var(--ui-radius-round);\n background: var(--ui-surface-elevated);\n opacity: 0;\n transform: translate(-50%, -50%);\n transition: opacity var(--ui-affordance-motion, var(--ui-motion-fast)) var(--ui-motion-ease);\n pointer-events: none;\n }\n\n .resizer:is(:hover, :focus-visible)::after {\n background: var(--ui-affordance-direct-color, var(--ui-accent-solid, var(--ui-focus-ring)));\n opacity: 1;\n }\n\n .resizer:is(:hover, :focus-visible) > .guide {\n opacity: 1;\n }\n\n /* Drawer: a popover in the top layer, sliding in from its edge. Closed popovers are hidden by the UA. */\n :host[popover] {\n position: fixed;\n inset-block: 0;\n inset-inline-start: 0;\n inset-inline-end: auto;\n margin: 0;\n padding: 0;\n inline-size: min(var(--_sidebar-width, var(--ui-sidebar-width, 280px)), 85vw);\n max-block-size: none;\n block-size: 100dvh;\n border-block: 0;\n box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));\n transform: translateX(0);\n transition:\n transform var(--ui-motion-base) var(--ui-motion-ease-out),\n display var(--ui-motion-base) allow-discrete,\n overlay var(--ui-motion-base) allow-discrete;\n }\n\n /* The author display above would otherwise override the UA rule that hides a closed popover. */\n :host[popover]:not(:popover-open) {\n display: none;\n transform: translateX(-100%);\n }\n\n :host-state([side=\"end\"])[popover] {\n inset-inline-start: auto;\n inset-inline-end: 0;\n }\n\n :host-state([side=\"end\"])[popover]:not(:popover-open) {\n transform: translateX(100%);\n }\n\n @starting-style {\n :host[popover]:popover-open {\n transform: translateX(-100%);\n }\n :host-state([side=\"end\"])[popover]:popover-open {\n transform: translateX(100%);\n }\n }\n\n :host[popover]::backdrop {\n background: var(--ui-sidebar-backdrop, rgb(0 0 0 / 0.32));\n }\n\n @media (prefers-reduced-motion: reduce) {\n :host[popover] {\n transition: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalCollapsed","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"drawer","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"resize","type":"object({ width: number, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"toggle","type":"object({ open: boolean, mode: docked | drawer, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"aside","choices":["aside"]},"controller":"./components/ui-sidebar/ui-sidebar.js"},{"source":{"file":"./components/ui-stack/ui-stack.html"},"contract":{"version":1,"name":"UiStack","tag":"ui-stack","nativeElement":"div","props":{"align":{"type":{"enum":["start","center","end","stretch"]},"required":false,"target":{"attribute":"align"},"description":"align token."},"gap":{"type":{"enum":["xs","s","m","l","xl"]},"required":false,"target":{"attribute":"gap"},"description":"gap token."},"justify":{"type":{"enum":["start","center","end","between"]},"required":false,"target":{"attribute":"justify"},"description":"justify token."}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n --_layout-gap: var(--ui-space-4);\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: var(--ui-stack-gap, var(--_layout-gap));\n min-inline-size: 0;\n max-inline-size: 100%;\n margin: 0;\n }\n\n :host-state([gap=\"xs\"]) {\n --_layout-gap: var(--ui-space-2);\n }\n :host-state([gap=\"s\"]) {\n --_layout-gap: var(--ui-space-3);\n }\n :host-state([gap=\"m\"]) {\n --_layout-gap: var(--ui-space-4);\n }\n :host-state([gap=\"l\"]) {\n --_layout-gap: var(--ui-space-5);\n }\n :host-state([gap=\"xl\"]) {\n --_layout-gap: var(--ui-space-6);\n }\n :host-state([align=\"start\"]) {\n align-items: flex-start;\n }\n :host-state([align=\"center\"]) {\n align-items: center;\n }\n :host-state([align=\"end\"]) {\n align-items: flex-end;\n }\n :host-state([justify=\"center\"]) {\n justify-content: center;\n }\n :host-state([justify=\"end\"]) {\n justify-content: flex-end;\n }\n :host-state([justify=\"between\"]) {\n justify-content: space-between;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-switch/ui-switch.html"},"contract":{"version":1,"name":"UiSwitch","tag":"ui-switch","nativeElement":"label","props":{"checked":{"type":"boolean","required":false,"target":{"attribute":"checked"},"description":"Whether the switch is checked initially or when set externally.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"disabled token.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"required token.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"value token.","default":"on"}}},"template":{"kind":"element","name":"label","attributes":[],"children":[{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"checkbox"},{"kind":"literal","name":"role","value":"switch"},{"kind":"property","key":"checked","name":"checked","expression":"internalChecked","expressionPlan":{"source":"internalChecked","ast":{"kind":"id","name":"internalChecked"},"dependencies":["internalChecked"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}}],"children":[],"ref":"input"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot"}]}]},"css":":host {\n display: inline-flex;\n align-items: flex-start;\n gap: var(--ui-switch-gap, var(--ui-space-2));\n max-inline-size: 100%;\n color: var(--ui-text-primary);\n cursor: pointer;\n }\n\n .label {\n min-inline-size: 0;\n line-height: var(--ui-line-height-md);\n }\n\n input {\n appearance: none;\n -webkit-appearance: none;\n position: relative;\n flex: 0 0 auto;\n width: var(--ui-switch-track-width, 2.5rem);\n height: var(--ui-switch-track-height, 1.5rem);\n padding: 0;\n border: 1px solid var(--ui-control-border-hover, var(--ui-border-strong));\n border-radius: 999px;\n background: var(--ui-control-surface, var(--ui-surface-default));\n box-shadow: inset 0 1px 2px color-mix(in srgb, var(--ui-text-primary) 10%, transparent);\n cursor: pointer;\n transition: background-color var(--ui-motion-fast) var(--ui-motion-ease), border-color var(--ui-motion-fast) var(--ui-motion-ease);\n margin: 0;\n }\n\n input::after {\n content: \"\";\n position: absolute;\n top: 3px;\n left: 3px;\n width: 1rem;\n height: 1rem;\n border-radius: 999px;\n background: var(--ui-text-secondary);\n box-shadow: var(--ui-shadow-xs);\n transition: transform var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n input:checked {\n background: var(--ui-accent-solid);\n border-color: var(--ui-accent-solid);\n }\n\n input:checked::after {\n transform: translateX(1rem);\n background: var(--ui-text-on-accent);\n }\n\n input:focus-visible {\n outline: 2px solid var(--ui-focus-ring, var(--ui-accent-solid));\n outline-offset: 2px;\n }\n\n :host-state([disabled]) {\n color: var(--ui-text-muted);\n cursor: not-allowed;\n }\n :host-state([disabled]) input {\n border-color: var(--ui-border-default);\n background: var(--ui-control-surface-disabled, var(--ui-surface-muted));\n cursor: not-allowed;\n }\n\n @media (prefers-reduced-motion: reduce) {\n input, input::after {\n transition: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalChecked","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"change","type":"object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"label","choices":["label"]},"controller":"./components/ui-switch/ui-switch.js"},{"source":{"file":"./components/ui-switcher/ui-switcher.html"},"contract":{"version":1,"name":"UiSwitcher","tag":"ui-switcher","nativeElement":"div","props":{"align":{"type":{"enum":["start","center","end","stretch"]},"required":false,"target":{"attribute":"align"},"description":"align token."},"gap":{"type":{"enum":["xs","s","m","l","xl"]},"required":false,"target":{"attribute":"gap"},"description":"gap token."},"threshold":{"type":{"enum":["xs","sm","md","lg"]},"required":false,"target":{"attribute":"threshold"},"description":"threshold token."}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"slot"}]},"css":":host {\n --_switcher-gap: var(--ui-space-4);\n display: flex;\n flex-wrap: wrap;\n gap: var(--ui-switcher-gap, var(--_switcher-gap));\n min-inline-size: 0;\n max-inline-size: 100%;\n margin: 0;\n }\n\n :host > :slotted(*) {\n min-inline-size: 0;\n flex-grow: 1;\n /* The large multiplier makes the basis flip as a group at the intrinsic threshold. */\n flex-basis: calc((var(--ui-switcher-threshold, 30rem) - 100%) * 999);\n }\n\n :host-state([gap=\"xs\"]) {\n --_switcher-gap: var(--ui-space-2);\n }\n :host-state([gap=\"s\"]) {\n --_switcher-gap: var(--ui-space-3);\n }\n :host-state([gap=\"m\"]) {\n --_switcher-gap: var(--ui-space-4);\n }\n :host-state([gap=\"l\"]) {\n --_switcher-gap: var(--ui-space-5);\n }\n :host-state([gap=\"xl\"]) {\n --_switcher-gap: var(--ui-space-6);\n }\n :host-state([threshold=\"xs\"]) > :slotted(*) {\n flex-basis: calc((var(--ui-switcher-threshold, 20rem) - 100%) * 999);\n }\n :host-state([threshold=\"md\"]) > :slotted(*) {\n flex-basis: calc((var(--ui-switcher-threshold, 45rem) - 100%) * 999);\n }\n :host-state([threshold=\"lg\"]) > :slotted(*) {\n flex-basis: calc((var(--ui-switcher-threshold, 60rem) - 100%) * 999);\n }\n :host-state([align=\"start\"]) {\n align-items: flex-start;\n }\n :host-state([align=\"center\"]) {\n align-items: center;\n }\n :host-state([align=\"end\"]) {\n align-items: flex-end;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]}},{"source":{"file":"./components/ui-tabs/ui-tabs.html"},"contract":{"version":1,"name":"UiTabs","tag":"ui-tabs","nativeElement":"div","props":{"density":{"type":{"enum":["comfortable","compact"]},"required":false,"target":{"attribute":"density"},"description":"Compact trades padding and type size for rows that fit more on screen.","default":"comfortable"},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"label token.","default":"Tabs"},"orientation":{"type":{"enum":["horizontal","vertical"]},"required":false,"target":{"attribute":"aria-orientation"},"description":"orientation token.","default":"horizontal"},"stretch":{"type":"boolean","required":false,"target":{"attribute":"stretch"},"description":"Share the full width of the tab list equally between tabs instead of sizing each to its label.","default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"value token.","default":""}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"list"},{"kind":"literal","name":"role","value":"tablist"},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}},{"kind":"attribute","name":"aria-orientation","expression":"orientation","expressionPlan":{"source":"orientation","ast":{"kind":"id","name":"orientation"},"dependencies":["orientation"]}}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"role","value":"tab"},{"kind":"attribute","name":"id","expression":"format('%s-tab', tab.id)","expressionPlan":{"source":"format('%s-tab', tab.id)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s-tab"},{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"}]},"dependencies":["tab.id"]}},{"kind":"attribute","name":"value","expression":"tab.id","expressionPlan":{"source":"tab.id","ast":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},"dependencies":["tab.id"]}},{"kind":"attribute","name":"aria-controls","expression":"tab.id","expressionPlan":{"source":"tab.id","ast":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},"dependencies":["tab.id"]}},{"kind":"attribute","name":"aria-selected","expression":"tab.id = internalValue","expressionPlan":{"source":"tab.id = internalValue","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},"right":{"kind":"id","name":"internalValue"}},"dependencies":["internalValue","tab.id"]}},{"kind":"directive","name":"value","expression":"tab.label","expressionPlan":{"source":"tab.label","ast":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"label"},"dependencies":["tab.label"]}}],"children":[],"flow":{"kind":"each","item":"tab","list":"tabs","listPlan":{"source":"tabs","ast":{"kind":"id","name":"tabs"},"dependencies":["tabs"]},"key":"tab.id","keyPlan":{"source":"tab.id","ast":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},"dependencies":["tab.id"]}}}],"ref":"list"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"panels"}],"children":[{"kind":"slot"}],"ref":"panels"}]},"css":"/* Density resolves into the tab row's own values; the public tokens still override them. */\n :host {\n --_tab-min-block-size: var(--ui-control-size);\n --_tab-padding-block: var(--ui-space-2);\n --_tab-padding-inline: var(--ui-space-3);\n }\n\n :host-state([density=\"compact\"]) {\n --_tab-min-block-size: var(--ui-control-size-sm);\n --_tab-padding-block: var(--ui-space-1);\n --_tab-padding-inline: var(--ui-space-2);\n }\n\n :host {\n display: grid;\n inline-size: 100%;\n min-inline-size: 0;\n }\n\n .list {\n display: grid;\n grid-auto-flow: column;\n grid-auto-columns: max-content;\n justify-content: start;\n inline-size: 100%;\n max-inline-size: 100%;\n /* Tabs that do not fit scroll sideways rather than wrapping or squeezing. */\n overflow-x: auto;\n /* overflow-x: auto would make the block axis scrollable too; a sideways swipe must not scroll the\n strip or the page vertically. */\n overflow-y: hidden;\n overscroll-behavior: contain;\n scrollbar-width: thin;\n border-block-end: 1px solid var(--ui-border-default);\n }\n\n .list button {\n min-block-size: var(--ui-tabs-tab-min-block-size, var(--_tab-min-block-size));\n margin: 0 0 -1px;\n padding: var(--ui-tabs-tab-padding-block, var(--_tab-padding-block)) var(--ui-tabs-tab-padding-inline, var(--_tab-padding-inline));\n border: 0;\n border-block-end: 2px solid transparent;\n background: transparent;\n color: var(--ui-text-secondary);\n font: inherit;\n font-size: var(--ui-font-size-sm);\n font-weight: var(--ui-font-medium);\n cursor: pointer;\n transition:\n color var(--ui-motion-fast) var(--ui-motion-ease),\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n border-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high. */\n /* Centre the glyphs, not the line box: a label without descenders otherwise reads high.\n * Trimming applies to block containers, so the box is a block with centred content. */\n @supports (text-box-trim: trim-both) {\n .list button {\n display: block;\n text-align: center;\n align-content: center;\n text-box-trim: trim-both;\n text-box-edge: cap alphabetic;\n }\n }\n\n :host-state([stretch]) .list {\n grid-auto-columns: minmax(max-content, 1fr);\n }\n\n .list button {\n white-space: nowrap;\n }\n\n .list button:hover {\n color: var(--ui-text-primary);\n background: var(--ui-surface-muted);\n }\n .list button[aria-selected=\"true\"] {\n color: var(--ui-accent-solid);\n border-block-end-color: var(--ui-accent-solid);\n }\n .list button:focus-visible {\n position: relative;\n outline: none;\n box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--ui-focus-ring) 45%, transparent);\n border-radius: var(--ui-radius-sm);\n }\n\n .panels {\n min-inline-size: 0;\n }\n :slotted(*) {\n padding: var(--ui-space-4);\n }\n\n :host-state([orientation=\"vertical\"]) {\n grid-template-columns: max-content minmax(0, 1fr);\n align-items: start;\n }\n\n :host-state([orientation=\"vertical\"]) .list {\n grid-auto-flow: row;\n grid-auto-columns: auto;\n border-block-end: 0;\n border-inline-end: 1px solid var(--ui-border-default);\n }\n\n :host-state([orientation=\"vertical\"]) .list button {\n margin: 0 -1px 0 0;\n border-block-end: 0;\n border-inline-end: 2px solid transparent;\n text-align: start;\n }\n\n :host-state([orientation=\"vertical\"]) .list button[aria-selected=\"true\"] {\n border-inline-end-color: var(--ui-accent-solid);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .list button {\n transition: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalValue","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"tabs","type":"list(object({ id: string, label: string }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"event","name":"select","type":"object({ value: string, previousValue: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-tabs/ui-tabs.js"},{"source":{"file":"./components/ui-textarea/ui-textarea.html"},"contract":{"version":1,"name":"UiTextarea","tag":"ui-textarea","nativeElement":"textarea","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"description":"Prevents editing and form submission.","default":false},"invalid":{"type":"boolean","required":false,"target":{"attribute":"aria-invalid"},"description":"Exposes invalid state to assistive technology and styling.","default":false},"readonly":{"type":"boolean","required":false,"target":{"attribute":"readonly"},"description":"Allows selection without allowing edits.","default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"description":"Marks the control as required for form validation.","default":false},"rows":{"type":{"kind":"terminal","name":"integer"},"required":false,"target":{"attribute":"rows"},"description":"Initial number of visible text rows.","default":4},"value":{"type":"string","required":false,"target":{"attribute":"value"},"description":"Current text value."}}},"template":{"kind":"element","name":"textarea","attributes":[{"kind":"attribute","name":"value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"readonly","expression":"readonly","expressionPlan":{"source":"readonly","ast":{"kind":"id","name":"readonly"},"dependencies":["readonly"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"aria-invalid","expression":"invalid","expressionPlan":{"source":"invalid","ast":{"kind":"id","name":"invalid"},"dependencies":["invalid"]}},{"kind":"attribute","name":"rows","expression":"rows","expressionPlan":{"source":"rows","ast":{"kind":"id","name":"rows"},"dependencies":["rows"]}}],"children":[]},"css":":host {\n box-sizing: border-box;\n display: inline-block;\n inline-size: 100%;\n min-inline-size: 0;\n min-block-size: calc(3rem * 2);\n margin: 0;\n padding: var(--ui-space-2) var(--ui-space-3);\n appearance: none;\n resize: vertical;\n border: 1px solid var(--ui-control-border, var(--ui-border-strong));\n border-radius: var(--ui-textarea-radius, var(--ui-radius-md));\n background: var(--ui-control-surface, var(--ui-surface-elevated));\n color: var(--ui-text-primary);\n font: inherit;\n line-height: var(--ui-line-height-md);\n box-shadow: var(--ui-textarea-shadow, var(--ui-control-inset));\n transition:\n border-color var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease),\n background-color var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n /* Tabbing into a field selects its text; tint that selection softly instead of the page highlight. */\n :host::selection {\n background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);\n color: inherit;\n }\n\n :host::placeholder {\n color: var(--ui-control-placeholder, var(--ui-text-secondary));\n opacity: 1;\n }\n\n :host:hover:not(:focus):not(:disabled) {\n border-color: var(--ui-control-border-hover, var(--ui-text-secondary));\n }\n\n :host:focus-visible {\n border-color: var(--ui-control-focus, var(--ui-accent-solid));\n outline: none;\n box-shadow: var(--ui-textarea-focus-shadow, var(--ui-control-inset), var(--ui-control-focus-halo-shadow));\n }\n\n /* The app's invalid flag, or the browser's own verdict once the user has left an invalid field. */\n :host[aria-invalid=\"true\"],\n :host:user-invalid {\n border-color: var(--ui-danger-solid);\n }\n\n :host:is([aria-invalid=\"true\"], :user-invalid):focus-visible {\n box-shadow:\n var(--ui-control-inset),\n 0 0 0 3px color-mix(in srgb, var(--ui-danger-solid) 22%, transparent);\n }\n\n :host:disabled {\n background: var(--ui-control-surface-disabled, var(--ui-surface-muted));\n color: var(--ui-text-muted);\n box-shadow: none;\n cursor: not-allowed;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[],"root":{"kind":"native","element":"textarea","choices":["textarea"]},"controller":"./components/ui-textarea/ui-textarea.js"},{"source":{"file":"./components/ui-toast-region/ui-toast-region.html"},"contract":{"version":1,"name":"UiToastRegion","tag":"ui-toast-region","nativeElement":"div","props":{"auto":{"type":"boolean","required":false,"target":{"attribute":"auto"},"description":"Dismiss each message automatically after its duration. Timers pause while the pointer or focus is on a message.","default":false},"duration":{"type":"number","required":false,"target":{"attribute":"duration"},"description":"Milliseconds an automatically dismissed message stays visible.","default":5000},"message":{"type":"string","required":false,"target":{"attribute":"message"},"description":"Fallback message used by the declarative show command.","default":"Notification"},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the messages authored inside the region are visible.","default":false}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"region"},{"kind":"literal","name":"aria-label","value":"Notifications"},{"kind":"literal","name":"aria-live","value":"polite"},{"kind":"literal","name":"popover","value":"manual"}],"children":[{"kind":"slot"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"toast"},{"kind":"attribute","name":"closing","expression":"toast.closing","expressionPlan":{"source":"toast.closing","ast":{"kind":"member","object":{"kind":"id","name":"toast"},"key":"closing"},"dependencies":["toast.closing"]},"target":"class"},{"kind":"attribute","name":"id","expression":"toast.id","expressionPlan":{"source":"toast.id","ast":{"kind":"member","object":{"kind":"id","name":"toast"},"key":"id"},"dependencies":["toast.id"]}},{"kind":"attribute","name":"role","expression":"toast.role","expressionPlan":{"source":"toast.role","ast":{"kind":"member","object":{"kind":"id","name":"toast"},"key":"role"},"dependencies":["toast.role"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"message"},{"kind":"directive","name":"value","expression":"toast.message","expressionPlan":{"source":"toast.message","ast":{"kind":"member","object":{"kind":"id","name":"toast"},"key":"message"},"dependencies":["toast.message"]}}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"dismiss"},{"kind":"attribute","name":"data-toast","expression":"toast.id","expressionPlan":{"source":"toast.id","ast":{"kind":"member","object":{"kind":"id","name":"toast"},"key":"id"},"dependencies":["toast.id"]}}],"children":[{"kind":"element","name":"ui-icon-button","attributes":[{"kind":"literal","name":"size","value":"sm"},{"kind":"literal","name":"variant","value":"ghost"},{"kind":"attribute","name":"round","expression":"true","expressionPlan":{"source":"true","ast":{"kind":"literal","value":true},"dependencies":[]}},{"kind":"attribute","name":"label","expression":"format('Dismiss %s', toast.message)","expressionPlan":{"source":"format('Dismiss %s', toast.message)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"Dismiss %s"},{"kind":"member","object":{"kind":"id","name":"toast"},"key":"message"}]},"dependencies":["toast.message"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"element","name":"path","attributes":[{"kind":"literal","name":"d","value":"M18 6 6 18M6 6l12 12"}],"children":[]}]}]}]}],"flow":{"kind":"each","item":"toast","list":"toasts","listPlan":{"source":"toasts","ast":{"kind":"id","name":"toasts"},"dependencies":["toasts"]},"key":"toast.id","keyPlan":{"source":"toast.id","ast":{"kind":"member","object":{"kind":"id","name":"toast"},"key":"id"},"dependencies":["toast.id"]}}}]},"css":":host {\n position: fixed;\n top: calc(var(--ui-space-4) + env(safe-area-inset-top));\n right: auto;\n bottom: auto;\n left: 50%;\n transform: translateX(-50%);\n z-index: 9999;\n display: grid;\n gap: var(--ui-space-2);\n inline-size: min(24rem, calc(100vw - var(--ui-space-4) * 2));\n max-inline-size: 100%;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n overflow: visible;\n border: 0;\n outline: 0;\n background: transparent;\n box-shadow: none;\n pointer-events: none;\n }\n\n :host:not(:popover-open) {\n display: none;\n }\n\n :host > .toast,\n :host > :slotted(*) {\n pointer-events: auto;\n }\n\n .toast {\n display: grid;\n grid-template-columns: 1fr auto;\n gap: var(--ui-space-2);\n align-items: start;\n border: 1px solid var(--ui-border-default);\n border-radius: var(--ui-radius-lg);\n padding: var(--ui-space-3) var(--ui-space-4);\n background: var(--ui-surface-elevated);\n color: var(--ui-text-primary);\n box-shadow: var(--ui-elevation-overlay, var(--ui-shadow-lg));\n animation: ui-toast-enter var(--ui-toast-region-enter-duration, 0.32s) var(--ui-motion-ease-out, cubic-bezier(0.16, 1, 0.3, 1)) both;\n }\n\n /* Leaving slides on down and fades; the controller removes the toast when this ends. */\n .toast.closing {\n animation: ui-toast-exit var(--ui-toast-region-exit-duration, 0.22s) var(--ui-motion-ease) both;\n pointer-events: none;\n }\n\n @keyframes ui-toast-enter {\n from {\n opacity: 0;\n transform: translateY(-1rem);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n @keyframes ui-toast-exit {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n to {\n opacity: 0;\n transform: translateY(0.75rem);\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n .toast, .toast.closing {\n animation: none;\n }\n }\n\n .message {\n min-inline-size: 0;\n align-self: center;\n }\n\n .dismiss {\n align-self: center;\n margin-inline-end: calc(var(--ui-space-2) * -1);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"toasts","type":"list(object({ id: string, message: string, role: alert | status, closing: boolean }))","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | timeout | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"dismiss","type":"object({ id: string, reason: action | timeout, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"method","name":"show","exportName":"show","returns":"promise(string)"}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-toast-region/ui-toast-region.js"},{"source":{"file":"./components/ui-tooltip/ui-tooltip.html"},"contract":{"version":1,"name":"UiTooltip","tag":"ui-tooltip","nativeElement":"span","props":{"for":{"type":"string","required":false,"target":{"attribute":"for"},"description":"ID of the control described and visually anchored by the tooltip.","default":""},"hideDelay":{"type":"number","required":false,"target":{"attribute":"hidedelay"},"description":"Waits this many milliseconds before hiding after pointer exit.","default":100},"inverse":{"type":"boolean","required":false,"target":{"attribute":"inverse"},"description":"Use the high-contrast inverse surface (dark on light themes, light on dark themes).","default":false},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"description":"Whether the tooltip is open initially or when set externally.","default":false},"placement":{"type":"string","required":false,"target":{"attribute":"placement"},"description":"Positions the description relative to its trigger.","default":"top-start"},"showDelay":{"type":"number","required":false,"target":{"attribute":"showdelay"},"description":"Waits this many milliseconds before showing after pointer entry.","default":500},"trigger":{"type":{"enum":["hover","click","focus"]},"required":false,"target":{"attribute":"trigger"},"description":"How the trigger opens it. hover also opens on keyboard focus; click toggles it and suits a help button, where hovering a question mark says nothing; focus\n opens only while the trigger holds focus.","default":"hover"}}},"template":{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"role","value":"tooltip"},{"kind":"attribute","name":"hidden","expression":"not internalOpen","expressionPlan":{"source":"not internalOpen","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"internalOpen"}},"dependencies":["internalOpen"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"surface"}],"children":[{"kind":"slot"}]}]},"css":":host {\n position: fixed;\n inset: auto;\n margin: 0;\n display: inline-block;\n box-sizing: border-box;\n padding: 0;\n border: 0;\n outline: 0;\n border-radius: 0;\n background: transparent;\n /* The UA popover default (overflow: auto) would clip the arrow. */\n overflow: visible;\n opacity: 0;\n transform: translateY(4px);\n transition:\n opacity var(--ui-motion-fast) var(--ui-motion-ease),\n transform var(--ui-motion-fast) var(--ui-motion-ease),\n display var(--ui-motion-fast) allow-discrete,\n overlay var(--ui-motion-fast) allow-discrete;\n }\n\n .surface {\n --_tooltip-line: var(--ui-tooltip-border, var(--ui-border-default));\n position: relative;\n box-sizing: border-box;\n max-inline-size: var(--ui-tooltip-max-inline-size, 18rem);\n border: 1px solid var(--_tooltip-line);\n border-radius: var(--ui-tooltip-radius, var(--ui-radius-sm));\n background: var(--ui-tooltip-surface, var(--ui-surface-elevated));\n color: var(--ui-tooltip-text, var(--ui-text-primary));\n padding: var(--ui-space-1) var(--ui-space-2);\n font-family: var(--ui-font-family-sans);\n font-size: var(--ui-font-size-sm);\n line-height: var(--ui-line-height-tight);\n box-shadow: var(--ui-tooltip-shadow, var(--ui-elevation-tooltip, var(--ui-shadow-md)));\n }\n\n :host-state([inverse]) .surface {\n --_tooltip-line: var(--ui-tooltip-inverse-surface, var(--ui-text-primary));\n background: var(--ui-tooltip-inverse-surface, var(--ui-text-primary));\n color: var(--ui-tooltip-inverse-text, var(--ui-surface-default));\n }\n\n /* A rotated square shares the surface fill and draws the two outward border edges. Its centre sits on\n * the surface border line, so the fill covers that stretch of border and the outline runs unbroken. */\n .surface::after {\n content: \"\";\n position: absolute;\n z-index: 1;\n inset-inline-start: var(--ui-space-3);\n inset-block-end: calc(var(--ui-tooltip-arrow-size, 0.5rem) / -2 - 0.5px);\n inline-size: var(--ui-tooltip-arrow-size, 0.5rem);\n block-size: var(--ui-tooltip-arrow-size, 0.5rem);\n box-sizing: border-box;\n background: inherit;\n border: 0 solid var(--_tooltip-line);\n border-inline-end-width: 1px;\n border-block-end-width: 1px;\n border-end-end-radius: 1px;\n transform: rotate(45deg);\n }\n\n :is(:host-state([placement=\"bottom\"]), :host-state([placement=\"bottom-start\"]), :host-state([placement=\"bottom-end\"])) .surface::after {\n inset-block-start: calc(var(--ui-tooltip-arrow-size, 0.5rem) / -2 - 0.5px);\n inset-block-end: auto;\n border-inline-end-width: 0;\n border-block-end-width: 0;\n border-inline-start-width: 1px;\n border-block-start-width: 1px;\n border-end-end-radius: 0;\n border-start-start-radius: 1px;\n }\n\n :is(:host-state([placement=\"top-end\"]), :host-state([placement=\"bottom-end\"])) .surface::after {\n inset-inline-start: auto;\n inset-inline-end: var(--ui-space-3);\n }\n\n :host:popover-open {\n opacity: 1;\n transform: translateY(0);\n }\n\n @starting-style {\n :host:popover-open {\n opacity: 0;\n transform: translateY(4px);\n }\n }\n\n :host[hidden] {\n display: none;\n }\n\n @media (prefers-reduced-motion: reduce) {\n :host {\n transition: none;\n }\n }","declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"open","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"span","choices":["span"]},"controller":"./components/ui-tooltip/ui-tooltip.js"},{"source":{"file":"./components/ui-top-bar/ui-top-bar.html"},"contract":{"version":1,"name":"UiTopBar","tag":"ui-top-bar","nativeElement":"header","props":{}},"template":{"kind":"element","name":"header","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"leading"}],"children":[{"kind":"slot","fallback":[],"name":"leading"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"title"}],"children":[{"kind":"slot"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"search"}],"children":[{"kind":"slot","fallback":[],"name":"search"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"actions"}],"children":[{"kind":"slot","fallback":[],"name":"actions"}]}]},"css":":host {\n position: sticky;\n inset-block-start: 0;\n z-index: var(--ui-top-bar-z-index, 100);\n min-block-size: calc(var(--ui-top-bar-height, 56px) + env(safe-area-inset-top));\n display: flex;\n align-items: center;\n gap: var(--ui-top-bar-gap, var(--ui-space-3));\n padding-block-start: env(safe-area-inset-top);\n padding-inline-start: max(var(--ui-top-bar-padding-inline, var(--ui-space-4)), env(safe-area-inset-left));\n padding-inline-end: max(var(--ui-top-bar-padding-inline, var(--ui-space-4)), env(safe-area-inset-right));\n background: var(--ui-top-bar-surface, var(--ui-surface-elevated));\n border-block-end: 1px solid var(--ui-top-bar-border, var(--ui-border-default));\n }\n\n .leading,\n .search,\n .actions {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n }\n\n .actions {\n gap: var(--ui-top-bar-actions-gap, var(--ui-space-1));\n }\n\n .title {\n min-inline-size: 0;\n flex: 1;\n }\n\n /* An unused region takes no space, so it adds no gap. */\n .leading:empty,\n .search:empty,\n .actions:empty {\n display: none;\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[],"slots":[{"dynamic":false,"required":true,"name":"leading"},{"dynamic":false,"required":true},{"dynamic":false,"required":true,"name":"search"},{"dynamic":false,"required":true,"name":"actions"}],"root":{"kind":"native","element":"header","choices":["header"]}},{"source":{"file":"./components/ui-tree-item/ui-tree-item.html"},"contract":{"version":1,"name":"UiTreeItem","tag":"ui-tree-item","nativeElement":"div","props":{"accepts":{"type":"string","required":false,"target":{"attribute":"data-accepts"},"description":"accepts token.","default":""},"container":{"type":"boolean","required":false,"target":{"attribute":"container"},"description":"container token.","default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"aria-disabled"},"description":"disabled token.","default":false},"dragType":{"type":"string","required":false,"target":{"attribute":"data-drag-type"},"description":"dragType token.","default":"item"},"dropDepth":{"type":"number","required":false,"target":{"attribute":"data-drop-depth"},"description":"dropDepth token."},"dropScope":{"type":"string","required":false,"target":{"attribute":"data-drop-scope"},"description":"dropScope token.","default":""},"expanded":{"type":"boolean","required":false,"target":{"attribute":"expanded"},"description":"expanded token.","default":false},"itemId":{"type":"string","required":false,"target":{"attribute":"data-item-id"},"description":"itemId token.","default":""},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"description":"The item's accessible name, also shown as the row text unless the label slot supplies content.","default":""},"selected":{"type":"boolean","required":false,"target":{"attribute":"aria-selected"},"description":"selected token.","default":false},"sortable":{"type":"boolean","required":false,"target":{"attribute":"sortable"},"description":"sortable token.","default":false},"subtreeDepth":{"type":"number","required":false,"target":{"attribute":"data-subtree-depth"},"description":"subtreeDepth token."}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"treeitem"},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}},{"kind":"attribute","name":"aria-level","expression":"structuralLevel","expressionPlan":{"source":"structuralLevel","ast":{"kind":"id","name":"structuralLevel"},"dependencies":["structuralLevel"]}},{"kind":"attribute","name":"aria-selected","expression":"selected","expressionPlan":{"source":"selected","ast":{"kind":"id","name":"selected"},"dependencies":["selected"]}},{"kind":"attribute","name":"aria-disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"data-item-id","expression":"itemId","expressionPlan":{"source":"itemId","ast":{"kind":"id","name":"itemId"},"dependencies":["itemId"]}},{"kind":"attribute","name":"data-drag-type","expression":"dragType","expressionPlan":{"source":"dragType","ast":{"kind":"id","name":"dragType"},"dependencies":["dragType"]}},{"kind":"attribute","name":"data-drop-scope","expression":"dropScope","expressionPlan":{"source":"dropScope","ast":{"kind":"id","name":"dropScope"},"dependencies":["dropScope"]}},{"kind":"attribute","name":"data-accepts","expression":"accepts","expressionPlan":{"source":"accepts","ast":{"kind":"id","name":"accepts"},"dependencies":["accepts"]}},{"kind":"attribute","name":"data-drop-depth","expression":"dropDepth","expressionPlan":{"source":"dropDepth","ast":{"kind":"id","name":"dropDepth"},"dependencies":["dropDepth"]}},{"kind":"attribute","name":"data-subtree-depth","expression":"subtreeDepth","expressionPlan":{"source":"subtreeDepth","ast":{"kind":"id","name":"subtreeDepth"},"dependencies":["subtreeDepth"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"row"}],"children":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"drag-handle"},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"draggable","value":"true"},{"kind":"attribute","name":"aria-label","expression":"format('Drag %s to reorder', label)","expressionPlan":{"source":"format('Drag %s to reorder', label)","ast":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"Drag %s to reorder"},{"kind":"id","name":"label"}]},"dependencies":["label"]}}],"children":[{"kind":"element","name":"svg","attributes":[{"kind":"literal","name":"aria-hidden","value":"true"},{"kind":"literal","name":"focusable","value":"false"},{"kind":"literal","name":"viewBox","value":"0 0 24 24"},{"kind":"literal","name":"fill","value":"none"},{"kind":"literal","name":"stroke","value":"currentColor"},{"kind":"literal","name":"stroke-width","value":"2"},{"kind":"literal","name":"stroke-linecap","value":"round"},{"kind":"literal","name":"stroke-linejoin","value":"round"}],"children":[{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"9"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"1"}],"children":[]},{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"9"},{"kind":"literal","name":"cy","value":"5"},{"kind":"literal","name":"r","value":"1"}],"children":[]},{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"9"},{"kind":"literal","name":"cy","value":"19"},{"kind":"literal","name":"r","value":"1"}],"children":[]},{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"15"},{"kind":"literal","name":"cy","value":"12"},{"kind":"literal","name":"r","value":"1"}],"children":[]},{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"15"},{"kind":"literal","name":"cy","value":"5"},{"kind":"literal","name":"r","value":"1"}],"children":[]},{"kind":"element","name":"circle","attributes":[{"kind":"literal","name":"cx","value":"15"},{"kind":"literal","name":"cy","value":"19"},{"kind":"literal","name":"r","value":"1"}],"children":[]}]}],"flow":{"kind":"if","test":"sortable and not disabled","testPlan":{"source":"sortable and not disabled","ast":{"kind":"binary","op":"and","left":{"kind":"id","name":"sortable"},"right":{"kind":"unary","op":"not","operand":{"kind":"id","name":"disabled"}}},"dependencies":["disabled","sortable"]}},"ref":"dragHandle"},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"disclosure"},{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"hidden","expression":"not isContainer","expressionPlan":{"source":"not isContainer","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"isContainer"}},"dependencies":["isContainer"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"disclosure-icon"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]}],"ref":"disclosure"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"leading"}],"children":[{"kind":"slot","fallback":[],"name":"leading"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot","fallback":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[]}],"name":"label"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"actions"}],"children":[{"kind":"slot","fallback":[],"name":"actions"}],"ref":"actions"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"drop-indicator row-drop-indicator"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]}],"ref":"row"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"children"},{"kind":"literal","name":"role","value":"group"},{"kind":"attribute","name":"hidden","expression":"not (isContainer and internalExpanded)","expressionPlan":{"source":"not (isContainer and internalExpanded)","ast":{"kind":"unary","op":"not","operand":{"kind":"binary","op":"and","left":{"kind":"id","name":"isContainer"},"right":{"kind":"id","name":"internalExpanded"}}},"dependencies":["internalExpanded","isContainer"]}}],"children":[{"kind":"slot"}],"ref":"children"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"drop-indicator subtree-drop-indicator"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]}]},"css":":host {\n --_tree-row-min-height: 32px;\n --_tree-disclosure-size: 16px;\n\n position: relative;\n display: block;\n min-inline-size: 0;\n margin-inline-start: calc(var(--ui-tree-item-depth, 0) * var(--ui-tree-indent, 16px));\n }\n\n .row {\n position: relative;\n display: grid;\n grid-template-columns: var(--_tree-disclosure-size) auto minmax(0, 1fr);\n align-items: center;\n min-block-size: var(--ui-tree-item-min-block-size, var(--_tree-row-min-height));\n min-inline-size: 0;\n font-size: var(--ui-tree-item-font-size, var(--ui-font-size-ui));\n border-radius: var(--ui-radius-md);\n color: var(--ui-text-secondary);\n transition:\n background-color var(--ui-motion-fast) var(--ui-motion-ease),\n color var(--ui-motion-fast) var(--ui-motion-ease),\n opacity var(--ui-motion-fast) var(--ui-motion-ease),\n box-shadow var(--ui-motion-fast) var(--ui-motion-ease),\n min-block-size var(--ui-motion-base) var(--ui-motion-ease);\n }\n\n .row:hover,\n :host-state([selected]) .row,\n .row:focus-within {\n color: var(--ui-text-primary);\n background: var(--ui-surface-muted);\n }\n\n :host-state([disabled]) .row {\n opacity: 0.55;\n }\n\n :host[data-dragging] .row {\n opacity: 0.42;\n }\n\n :host:focus {\n outline: none;\n }\n\n :host:focus-visible .row {\n box-shadow: 0 0 0 2px var(--ui-focus-ring);\n }\n\n /* Child combinators: drop feedback belongs to this item's own row, not the rows nested in it. */\n :host[data-drop-position=\"inside\"] > .row {\n background: var(--ui-accent-subtle);\n box-shadow: inset 0 0 0 1px var(--ui-tree-drop-color, var(--ui-accent-solid));\n }\n\n .disclosure,\n .disclosure-spacer {\n grid-column: 1;\n grid-row: 1;\n inline-size: var(--_tree-disclosure-size);\n block-size: 28px;\n }\n\n .disclosure {\n display: grid;\n /* Start-aligned: the chevron's ink, not its hit area, aligns with the content above it. */\n place-items: center start;\n padding: 0;\n color: var(--ui-text-muted);\n background: transparent;\n border: 0;\n border-radius: var(--ui-radius-sm);\n cursor: pointer;\n }\n\n .disclosure[hidden] {\n display: none;\n }\n\n .disclosure:hover {\n color: var(--ui-text-primary);\n background: var(--ui-surface-elevated);\n }\n\n .disclosure-icon {\n display: grid;\n place-items: center;\n inline-size: 12px;\n block-size: 12px;\n transform: rotate(-90deg);\n transition: transform var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .disclosure-icon::before {\n display: block;\n inline-size: 0.375rem;\n block-size: 0.375rem;\n border-inline-end: 1.5px solid currentColor;\n border-block-end: 1.5px solid currentColor;\n content: \"\";\n /* A chevron's ink sits below its box centre; lift it so it centres optically (in either rotation). */\n transform: translateY(-20%) rotate(45deg);\n }\n\n :host[aria-expanded=\"true\"] .disclosure-icon {\n transform: rotate(0deg);\n }\n\n /* Lucide grip-vertical, filling the handle as in Looma 0.2. */\n .drag-handle svg {\n display: block;\n inline-size: 100%;\n block-size: 100%;\n }\n\n /* Slotted content is outside this scope, so :has() cannot see it; hide only a truly empty slot. */\n .leading {\n display: inline-grid;\n place-items: center;\n grid-column: 2;\n grid-row: 1;\n inline-size: 1em;\n block-size: 1em;\n margin-inline-start: var(--ui-space-1);\n color: var(--ui-text-muted);\n }\n\n .leading:empty {\n display: none;\n }\n\n /* Icons match the label's size (as in Knit's tree): an unsized SVG would otherwise render 300×150. */\n :slotted(svg),\n :slotted(img) {\n display: block;\n inline-size: 1em;\n block-size: 1em;\n flex: none;\n }\n\n /* The label spans the row's height and centres its content, so slotted content (a link) can\n stretch to fill the row as its own hit area; the padding tokens remove the inset. */\n .label {\n grid-column: 3;\n grid-row: 1;\n align-self: stretch;\n display: flex;\n align-items: center;\n min-inline-size: 0;\n padding: var(--ui-tree-item-label-padding-block, var(--ui-space-1)) var(--ui-tree-item-label-padding-inline, var(--ui-space-2));\n }\n\n /* Slotted label content fills the cell, so a link is the row's hit area rather than sizing to\n its own text and reading as overflow. */\n .label > :slotted(*) {\n flex: 1 1 auto;\n min-inline-size: 0;\n }\n\n /* The controls sit over the label's end, so the text fades out where they begin. The fade is\n the truncation mark while it shows: an ellipsis under it would read as a second one. */\n .row:hover > .label,\n .row:focus-within > .label {\n text-overflow: clip;\n mask-image: linear-gradient(\n to right,\n #000 calc(100% - var(--_tree-actions-width, 1.75rem) - var(--ui-space-3)),\n transparent calc(100% - var(--_tree-actions-width, 1.75rem))\n );\n }\n\n .row:hover > .label:dir(rtl),\n .row:focus-within > .label:dir(rtl) {\n mask-image: linear-gradient(\n to left,\n #000 calc(100% - var(--_tree-actions-width, 1.75rem) - var(--ui-space-3)),\n transparent calc(100% - var(--_tree-actions-width, 1.75rem))\n );\n }\n\n .row:hover > .label > :slotted(*),\n .row:focus-within > .label > :slotted(*) {\n text-overflow: clip;\n }\n\n .actions {\n position: absolute;\n z-index: 1;\n inset-block: 0;\n inset-inline-end: 0;\n display: inline-flex;\n align-items: center;\n min-inline-size: 0;\n opacity: 0;\n pointer-events: none;\n transition: opacity var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .row:hover > .actions,\n .row:focus-within > .actions {\n opacity: 1;\n pointer-events: auto;\n }\n\n /* Without hover there is no reveal, so the controls keep their own column. */\n @media (hover: none) {\n .row {\n grid-template-columns: var(--_tree-disclosure-size) auto minmax(0, 1fr) auto;\n }\n\n .actions {\n position: static;\n grid-column: 4;\n grid-row: 1;\n padding-inline-start: 0;\n background: none;\n opacity: 1;\n pointer-events: auto;\n }\n }\n\n .drag-handle {\n position: absolute;\n z-index: 2;\n inset-block-start: 50%;\n inset-inline-start: -22px;\n inline-size: 20px;\n block-size: 32px;\n display: grid;\n place-items: center;\n padding: 7px 3px;\n color: var(--ui-text-muted);\n background: var(--ui-surface-elevated);\n border: 1px solid transparent;\n border-radius: var(--ui-radius-sm);\n cursor: grab;\n /* Hidden until the row is hovered, but always hittable: the handle sits outside the row, and moving\n the pointer onto it must not hide it on the way. */\n opacity: 0;\n transform: translateY(-50%);\n transition: opacity var(--ui-motion-fast) var(--ui-motion-ease);\n }\n\n .row:hover .drag-handle,\n .drag-handle:hover,\n .drag-handle:focus-visible,\n :host[data-dragging] > .row > .drag-handle {\n opacity: 1;\n }\n\n .drag-handle:active {\n cursor: grabbing;\n }\n\n .drop-indicator {\n position: absolute;\n z-index: 3;\n inset-inline: 1px;\n display: none;\n block-size: 2px;\n border-radius: 999px;\n background: var(--ui-tree-drop-color, var(--ui-accent-solid));\n pointer-events: none;\n }\n\n .drop-indicator::before,\n .drop-indicator::after {\n content: \"\";\n position: absolute;\n inset-block-start: 50%;\n inline-size: 7px;\n block-size: 7px;\n border: 2px solid var(--ui-tree-drop-color, var(--ui-accent-solid));\n border-radius: 999px;\n background: var(--ui-surface-elevated);\n transform: translateY(-50%);\n }\n\n .drop-indicator::before {\n inset-inline-start: -1px;\n }\n .drop-indicator::after {\n inset-inline-end: -1px;\n }\n\n :host[data-drop-position=\"before\"] > .row > .row-drop-indicator {\n display: block;\n inset-block-start: -1px;\n }\n\n :host[data-drop-position=\"after\"] > .subtree-drop-indicator {\n display: block;\n inset-block-end: -1px;\n }\n\n .children[hidden] {\n display: none;\n }\n\n html[data-ui-input-modality=\"touch\"] :host {\n --_tree-row-min-height: 44px;\n }\n\n html[data-ui-input-modality=\"touch\"] :host .drag-handle {\n display: none;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .row,\n .disclosure-icon,\n .drag-handle {\n transition: none;\n }\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"state","name":"internalExpanded","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"structuralLevel","expression":{"source":"1","ast":{"kind":"literal","value":1},"dependencies":[]}},{"kind":"state","name":"tabStop","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"isContainer","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"expand","type":"object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })","bubbles":false,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true,"name":"leading"},{"dynamic":false,"required":false,"name":"label"},{"dynamic":false,"required":true,"name":"actions"},{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-tree-item/ui-tree-item.js"},{"source":{"file":"./components/ui-tree/ui-tree.html"},"contract":{"version":1,"name":"UiTree","tag":"ui-tree","nativeElement":"div","props":{"density":{"type":{"enum":["comfortable","compact"]},"required":false,"target":{"attribute":"density"},"description":"Compact trades padding and type size for rows that fit more on screen.","default":"comfortable"},"hoverExpandDelay":{"type":"number","required":false,"target":{"attribute":"hoverexpanddelay"},"description":"hoverExpandDelay token.","default":700},"label":{"type":"string","required":false,"target":{"attribute":"label"},"description":"label token.","default":"Tree"},"maxDepth":{"type":"number","required":false,"target":{"attribute":"maxdepth"},"description":"maxDepth token.","default":0}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"tree"}],"children":[{"kind":"slot"}]},"css":":host-state([density=\"compact\"]) {\n --ui-tree-item-min-block-size: var(--ui-control-size-sm);\n --ui-tree-item-font-size: var(--ui-font-size-sm);\n --ui-tree-item-label-padding-block: 0;\n }\n\n :host {\n display: block;\n min-inline-size: 0;\n padding-inline-start: var(--ui-tree-gutter, 0px);\n }\n\n /* A component that sets its display still honours the hidden attribute on its root. */\n :host[hidden] {\n display: none;\n }","declarations":[{"kind":"event","name":"reorder","type":"object({ sourceId: string, targetId: string, position: before | inside | after, sourceType: string, targetType: string, sourceScope: string, targetScope: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"reorder-rejected","type":"object({ sourceId: string, targetId: string, position: before | inside | after, reason: max-depth, maxDepth: integer, resultingDepth: integer, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"slots":[{"dynamic":false,"required":true}],"root":{"kind":"native","element":"div","choices":["div"]},"controller":"./components/ui-tree/ui-tree.js"}];
4
4
  const controllerImports = {
5
5
  "ui-affordance-scope": () => import("../components/ui-affordance-scope/ui-affordance-scope.js"), // controller 1
6
6
  "ui-avatar-group": () => import("../components/ui-avatar-group/ui-avatar-group.js"), // controller 2