@k2b/ui 0.29.0 → 0.30.0

package/dist/browser/actions/SpotlightSearch.js

@@ -10,7 +10,7 @@ import { runHydrationEvents as _$runHydrationEvents } from "solid-js/web";
 import { getNextMarker as _$getNextMarker } from "solid-js/web";
 import { memo as _$memo } from "solid-js/web";
 import { insert as _$insert } from "solid-js/web";
-var _tmpl$ = /*#__PURE__*/_$template(`<button type=button><i aria-hidden=true></i><span class=k2b-spotlight-button__label></span><!$><!/>`),
+var _tmpl$ = /*#__PURE__*/_$template(`<button type=button><i aria-hidden=true></i><span></span><!$><!/>`),
   _tmpl$2 = /*#__PURE__*/_$template(`<kbd class=k2b-kbd><kbd class=k2b-kbd__key>`);
 import { Kbd } from "../content/Kbd";
 import { prompts } from "../feedback/prompts";
@@ -67,13 +67,15 @@ export function SpotlightButton(props) {
         _v$3 = props.disabled,
         _v$4 = props.ariaLabel ?? (["compact", "icon"].includes(variant()) ? label() : undefined),
         _v$5 = title(),
-        _v$6 = icon();
+        _v$6 = icon(),
+        _v$7 = variant() === "sidebar" ? "k2b-spotlight-button__label k2b-truncate-fade" : "k2b-spotlight-button__label";
       _v$ !== _p$.e && _$className(_el$, _p$.e = _v$);
       _v$2 !== _p$.t && _$setAttribute(_el$, "data-variant", _p$.t = _v$2);
       _v$3 !== _p$.a && _$setProperty(_el$, "disabled", _p$.a = _v$3);
       _v$4 !== _p$.o && _$setAttribute(_el$, "aria-label", _p$.o = _v$4);
       _v$5 !== _p$.i && _$setAttribute(_el$, "title", _p$.i = _v$5);
       _v$6 !== _p$.n && _$className(_el$2, _p$.n = _v$6);
+      _v$7 !== _p$.s && _$className(_el$3, _p$.s = _v$7);
       return _p$;
     }, {
       e: undefined,
@@ -81,7 +83,8 @@ export function SpotlightButton(props) {
       a: undefined,
       o: undefined,
       i: undefined,
-      n: undefined
+      n: undefined,
+      s: undefined
     });
     _$runHydrationEvents();
     return _el$;

package/dist/browser/actions/SpotlightSearch.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["actions/SpotlightSearch.tsx"],"sourcesContent":["import type { JSX } from \"solid-js\";\nimport { Kbd } from \"../content/Kbd\";\nimport type { PromptSearchInput, PromptSearchItem, PromptSearchOptions } from \"../feedback/prompts\";\nimport { prompts } from \"../feedback/prompts\";\nimport { resolveUiMessages, useUiMessages } from \"../intl/messages\";\nimport { resolveSpotlightMessages } from \"./spotlight-messages\";\n\nexport type SpotlightSearchResolver<T = unknown> = (input: PromptSearchInput) => Promise<PromptSearchItem<T>[]> | PromptSearchItem<T>[];\n\nexport type SpotlightSearchOptions<T = unknown> = PromptSearchOptions & {\n  resolve: SpotlightSearchResolver<T>;\n};\n\nexport type SpotlightButtonVariant = \"default\" | \"compact\" | \"chip\" | \"sidebar\" | \"sidebar-mobile\" | \"icon\";\n\nexport type SpotlightButtonProps = {\n  variant?: SpotlightButtonVariant;\n  label?: string;\n  title?: string;\n  icon?: string;\n  /** Shortcut such as \"mod+k\"; takes precedence over shortcutLabel. */\n  shortcut?: string;\n  shortcutLabel?: string | false;\n  ariaLabel?: string;\n  disabled?: boolean;\n  class?: string;\n  onClick: () => void | Promise<void>;\n};\n\nexport const openSpotlightSearch = <T extends unknown = unknown>(\n  options: SpotlightSearchOptions<T>,\n): Promise<PromptSearchItem<T> | undefined> => {\n  const { resolve, ...promptOptions } = options;\n  const messages = resolveUiMessages();\n  const spotlightMessages = resolveSpotlightMessages();\n  return prompts.search(resolve, {\n    icon: \"ti ti-search\",\n    placeholder: messages.search,\n    minQueryLength: 0,\n    noResultsText: spotlightMessages.spotlightNoResults,\n    size: \"small\",\n    ...promptOptions,\n  });\n};\n\nexport function SpotlightButton(props: SpotlightButtonProps): JSX.Element {\n  const messages = useUiMessages();\n  const variant = () => props.variant ?? \"default\";\n  const label = () => props.label ?? messages().searchLabel;\n  const icon = () => props.icon ?? \"ti ti-search\";\n  const shortcut = () => props.shortcut ?? props.shortcutLabel;\n  const title = () => props.title ?? label();\n  const showsShortcut = () => Boolean(shortcut()) && [\"chip\", \"sidebar\"].includes(variant());\n\n  return (\n    <button\n      type=\"button\"\n      class={`k2b-spotlight-button ${props.class ?? \"\"}`}\n      data-variant={variant()}\n      disabled={props.disabled}\n      aria-label={props.ariaLabel ?? ([\"compact\", \"icon\"].includes(variant()) ? label() : undefined)}\n      title={title()}\n      onClick={() => void props.onClick()}\n    >\n      <i class={icon()} aria-hidden=\"true\" />\n      <span class=\"k2b-spotlight-button__label\">{label()}</span>\n      {showsShortcut() &&\n        (props.shortcut !== undefined ? (\n          <Kbd keys={props.shortcut} />\n        ) : (\n          <kbd class=\"k2b-kbd\">\n            <kbd class=\"k2b-kbd__key\">{props.shortcutLabel}</kbd>\n          </kbd>\n        ))}\n    </button>\n  );\n}\n\nexport default SpotlightButton;\n"],"mappings":";;;;;;;;;;;;;;AACA,SAAS,GAAG,QAAQ,gBAAgB;AAEpC,SAAS,OAAO,QAAQ,qBAAqB;AAC7C,SAAS,iBAAiB,EAAE,aAAa,QAAQ,kBAAkB;AACnE,SAAS,wBAAwB,QAAQ,sBAAsB;AAwB/D,OAAO,MAAM,mBAAmB,GAC9B,OAAkC,IACW;EAC7C,MAAM;IAAE,OAAO;IAAE,GAAG;EAAc,CAAC,GAAG,OAAO;EAC7C,MAAM,QAAQ,GAAG,iBAAiB,CAAC,CAAC;EACpC,MAAM,iBAAiB,GAAG,wBAAwB,CAAC,CAAC;EACpD,OAAO,OAAO,CAAC,MAAM,CAAC,OAAO,EAAE;IAC7B,IAAI,EAAE,cAAc;IACpB,WAAW,EAAE,QAAQ,CAAC,MAAM;IAC5B,cAAc,EAAE,CAAC;IACjB,aAAa,EAAE,iBAAiB,CAAC,kBAAkB;IACnD,IAAI,EAAE,OAAO;IACb,GAAG;EACL,CAAC,CAAC;AACJ,CAAC;AAED,OAAO,SAAS,eAAe,CAAC,KAA2B,EAAe;EACxE,MAAM,QAAQ,GAAG,aAAa,CAAC,CAAC;EAChC,MAAM,OAAO,GAAG,MAAM,KAAK,CAAC,OAAO,IAAI,SAAS;EAChD,MAAM,KAAK,GAAG,MAAM,KAAK,CAAC,KAAK,IAAI,QAAQ,CAAC,CAAC,CAAC,WAAW;EACzD,MAAM,IAAI,GAAG,MAAM,KAAK,CAAC,IAAI,IAAI,cAAc;EAC/C,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,aAAa;EAC5D,MAAM,KAAK,GAAG,MAAM,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,CAAC;EAC1C,MAAM,aAAa,GAAG,MAAM,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;EAE1F;IAAA;MAAA;MAAA;MAAA;MAAA;IAAA,eAQa,MAAM,KAAK,KAAK,CAAC,OAAO,CAAC,CAAC;IAAA,gBAGQ,KAAK;IAAA;MAAA,yBAC/C,aAAa,CAAC,CAAC;MAAA,aAAf,UACE,KAAK,CAAC,QAAQ,KAAK,SAAS,qBAC1B,GAAG;QAAA,IAAC,IAAI;UAAA,OAAE,KAAK,CAAC,QAAQ;QAAA;MAAA;QAAA;UAAA;QAAA,sBAGI,KAAK,CAAC,aAAa;QAAA;MAAA,IAEjD,CAAC;IAAA;IAAA;MAAA,UAhBG,wBAAwB,KAAK,CAAC,KAAK,IAAI,EAAE,EAAE;QAAA,OACpC,OAAO,CAAC,CAAC;QAAA,OACb,KAAK,CAAC,QAAQ;QAAA,OACZ,KAAK,CAAC,SAAS,KAAK,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,GAAG,SAAS,CAAC;QAAA,OACvF,KAAK,CAAC,CAAC;QAAA,OAGJ,IAAI,CAAC,CAAC;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;IAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;IAAA;IAAA;IAAA;EAAA;AAYtB;AAEA,eAAe,eAAe;AAAC","ignoreList":[]}
+{"version":3,"names":[],"sources":["actions/SpotlightSearch.tsx"],"sourcesContent":["import type { JSX } from \"solid-js\";\nimport { Kbd } from \"../content/Kbd\";\nimport type { PromptSearchInput, PromptSearchItem, PromptSearchOptions } from \"../feedback/prompts\";\nimport { prompts } from \"../feedback/prompts\";\nimport { resolveUiMessages, useUiMessages } from \"../intl/messages\";\nimport { resolveSpotlightMessages } from \"./spotlight-messages\";\n\nexport type SpotlightSearchResolver<T = unknown> = (input: PromptSearchInput) => Promise<PromptSearchItem<T>[]> | PromptSearchItem<T>[];\n\nexport type SpotlightSearchOptions<T = unknown> = PromptSearchOptions & {\n  resolve: SpotlightSearchResolver<T>;\n};\n\nexport type SpotlightButtonVariant = \"default\" | \"compact\" | \"chip\" | \"sidebar\" | \"sidebar-mobile\" | \"icon\";\n\nexport type SpotlightButtonProps = {\n  variant?: SpotlightButtonVariant;\n  label?: string;\n  title?: string;\n  icon?: string;\n  /** Shortcut such as \"mod+k\"; takes precedence over shortcutLabel. */\n  shortcut?: string;\n  shortcutLabel?: string | false;\n  ariaLabel?: string;\n  disabled?: boolean;\n  class?: string;\n  onClick: () => void | Promise<void>;\n};\n\nexport const openSpotlightSearch = <T extends unknown = unknown>(\n  options: SpotlightSearchOptions<T>,\n): Promise<PromptSearchItem<T> | undefined> => {\n  const { resolve, ...promptOptions } = options;\n  const messages = resolveUiMessages();\n  const spotlightMessages = resolveSpotlightMessages();\n  return prompts.search(resolve, {\n    icon: \"ti ti-search\",\n    placeholder: messages.search,\n    minQueryLength: 0,\n    noResultsText: spotlightMessages.spotlightNoResults,\n    size: \"small\",\n    ...promptOptions,\n  });\n};\n\nexport function SpotlightButton(props: SpotlightButtonProps): JSX.Element {\n  const messages = useUiMessages();\n  const variant = () => props.variant ?? \"default\";\n  const label = () => props.label ?? messages().searchLabel;\n  const icon = () => props.icon ?? \"ti ti-search\";\n  const shortcut = () => props.shortcut ?? props.shortcutLabel;\n  const title = () => props.title ?? label();\n  const showsShortcut = () => Boolean(shortcut()) && [\"chip\", \"sidebar\"].includes(variant());\n\n  return (\n    <button\n      type=\"button\"\n      class={`k2b-spotlight-button ${props.class ?? \"\"}`}\n      data-variant={variant()}\n      disabled={props.disabled}\n      aria-label={props.ariaLabel ?? ([\"compact\", \"icon\"].includes(variant()) ? label() : undefined)}\n      title={title()}\n      onClick={() => void props.onClick()}\n    >\n      <i class={icon()} aria-hidden=\"true\" />\n      <span class={variant() === \"sidebar\" ? \"k2b-spotlight-button__label k2b-truncate-fade\" : \"k2b-spotlight-button__label\"}>\n        {label()}\n      </span>\n      {showsShortcut() &&\n        (props.shortcut !== undefined ? (\n          <Kbd keys={props.shortcut} />\n        ) : (\n          <kbd class=\"k2b-kbd\">\n            <kbd class=\"k2b-kbd__key\">{props.shortcutLabel}</kbd>\n          </kbd>\n        ))}\n    </button>\n  );\n}\n\nexport default SpotlightButton;\n"],"mappings":";;;;;;;;;;;;;;AACA,SAAS,GAAG,QAAQ,gBAAgB;AAEpC,SAAS,OAAO,QAAQ,qBAAqB;AAC7C,SAAS,iBAAiB,EAAE,aAAa,QAAQ,kBAAkB;AACnE,SAAS,wBAAwB,QAAQ,sBAAsB;AAwB/D,OAAO,MAAM,mBAAmB,GAC9B,OAAkC,IACW;EAC7C,MAAM;IAAE,OAAO;IAAE,GAAG;EAAc,CAAC,GAAG,OAAO;EAC7C,MAAM,QAAQ,GAAG,iBAAiB,CAAC,CAAC;EACpC,MAAM,iBAAiB,GAAG,wBAAwB,CAAC,CAAC;EACpD,OAAO,OAAO,CAAC,MAAM,CAAC,OAAO,EAAE;IAC7B,IAAI,EAAE,cAAc;IACpB,WAAW,EAAE,QAAQ,CAAC,MAAM;IAC5B,cAAc,EAAE,CAAC;IACjB,aAAa,EAAE,iBAAiB,CAAC,kBAAkB;IACnD,IAAI,EAAE,OAAO;IACb,GAAG;EACL,CAAC,CAAC;AACJ,CAAC;AAED,OAAO,SAAS,eAAe,CAAC,KAA2B,EAAe;EACxE,MAAM,QAAQ,GAAG,aAAa,CAAC,CAAC;EAChC,MAAM,OAAO,GAAG,MAAM,KAAK,CAAC,OAAO,IAAI,SAAS;EAChD,MAAM,KAAK,GAAG,MAAM,KAAK,CAAC,KAAK,IAAI,QAAQ,CAAC,CAAC,CAAC,WAAW;EACzD,MAAM,IAAI,GAAG,MAAM,KAAK,CAAC,IAAI,IAAI,cAAc;EAC/C,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,aAAa;EAC5D,MAAM,KAAK,GAAG,MAAM,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,CAAC;EAC1C,MAAM,aAAa,GAAG,MAAM,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;EAE1F;IAAA;MAAA;MAAA;MAAA;MAAA;IAAA,eAQa,MAAM,KAAK,KAAK,CAAC,OAAO,CAAC,CAAC;IAAA,gBAIhC,KAAK;IAAA;MAAA,yBAEP,aAAa,CAAC,CAAC;MAAA,aAAf,UACE,KAAK,CAAC,QAAQ,KAAK,SAAS,qBAC1B,GAAG;QAAA,IAAC,IAAI;UAAA,OAAE,KAAK,CAAC,QAAQ;QAAA;MAAA;QAAA;UAAA;QAAA,sBAGI,KAAK,CAAC,aAAa;QAAA;MAAA,IAEjD,CAAC;IAAA;IAAA;MAAA,UAlBG,wBAAwB,KAAK,CAAC,KAAK,IAAI,EAAE,EAAE;QAAA,OACpC,OAAO,CAAC,CAAC;QAAA,OACb,KAAK,CAAC,QAAQ;QAAA,OACZ,KAAK,CAAC,SAAS,KAAK,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,GAAG,SAAS,CAAC;QAAA,OACvF,KAAK,CAAC,CAAC;QAAA,OAGJ,IAAI,CAAC,CAAC;QAAA,OACH,OAAO,CAAC,CAAC,KAAK,SAAS,GAAG,+CAA+C,GAAG,6BAA6B;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;IAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;MAAA;IAAA;IAAA;IAAA;EAAA;AAa5H;AAEA,eAAe,eAAe;AAAC","ignoreList":[]}

package/dist/browser/actions/Tabs.js

@@ -189,19 +189,22 @@ function TabsRoot(props) {
               _v$10 = current() === option.value,
               _v$11 = option.panel !== undefined ? panelId() : undefined,
               _v$12 = tabStopIndex() === index() ? 0 : -1,
-              _v$13 = option.disabled;
+              _v$13 = option.disabled,
+              _v$14 = props.variant === "pill" ? "k2b-truncate-fade" : undefined;
             _v$1 !== _p$.e && _$setAttribute(_el$1, "id", _p$.e = _v$1);
             _v$10 !== _p$.t && _$setAttribute(_el$1, "aria-selected", _p$.t = _v$10);
             _v$11 !== _p$.a && _$setAttribute(_el$1, "aria-controls", _p$.a = _v$11);
             _v$12 !== _p$.o && _$setAttribute(_el$1, "tabindex", _p$.o = _v$12);
             _v$13 !== _p$.i && _$setProperty(_el$1, "disabled", _p$.i = _v$13);
+            _v$14 !== _p$.n && _$className(_el$10, _p$.n = _v$14);
             return _p$;
           }, {
             e: undefined,
             t: undefined,
             a: undefined,
             o: undefined,
-            i: undefined
+            i: undefined,
+            n: undefined
           });
           _$runHydrationEvents();
           return _el$0;

package/dist/browser/actions/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["actions/Tabs.tsx"],"sourcesContent":["import { children, createEffect, createMemo, createUniqueId, For, type JSX, Show } from \"solid-js\";\nimport type { MaybeAccessor } from \"../inputs/field-contract\";\nimport { resolveMaybeAccessor } from \"../inputs/field-contract\";\nimport { useUiMessages } from \"../intl/messages\";\nimport { createScrollFade } from \"../layout/scroll-fade\";\n\nexport type TabOption<T extends string = string> = {\n  value: T;\n  label: JSX.Element;\n  icon?: string;\n  disabled?: boolean;\n  panel?: JSX.Element;\n  onClose?: () => void;\n  closeLabel?: string;\n};\n\nexport type TabsItemProps<T extends string = string> = Omit<TabOption<T>, \"panel\"> & {\n  children?: JSX.Element;\n};\n\ntype TabsItemSlot<T extends string = string> = {\n  readonly kind: typeof TABS_ITEM;\n  readonly props: TabsItemProps<T>;\n};\n\nexport type TabsProps<T extends string = string> = {\n  value: MaybeAccessor<T>;\n  onValueChange: (value: T) => void;\n  ariaLabel: string;\n  orientation?: \"horizontal\" | \"vertical\";\n  class?: string;\n  variant?: \"line\" | \"pill\";\n  trailing?: JSX.Element;\n  /** Data-driven alternative to colocated `Tabs.Item` children. */\n  options?: readonly TabOption<T>[];\n  children?: JSX.Element;\n};\n\ntype TabsComponent = (<T extends string = string>(props: TabsProps<T>) => JSX.Element) & {\n  Item: <T extends string = string>(props: TabsItemProps<T>) => JSX.Element;\n};\n\nconst TABS_ITEM = Symbol(\"Tabs.Item\");\n\nconst isTabsItem = <T extends string>(value: unknown): value is TabsItemSlot<T> =>\n  !!value && typeof value === \"object\" && \"kind\" in value && value.kind === TABS_ITEM;\n\nconst collectTabsItems = <T extends string>(value: unknown): TabsItemSlot<T>[] => {\n  if (Array.isArray(value)) return value.flatMap(collectTabsItems<T>);\n  return isTabsItem<T>(value) ? [value] : [];\n};\n\nfunction TabsItem<T extends string = string>(props: TabsItemProps<T>): JSX.Element {\n  return { kind: TABS_ITEM, props } satisfies TabsItemSlot<T> as unknown as JSX.Element;\n}\n\n/** Controlled, keyboard-accessible tabs with compositional or data-driven items. */\nfunction TabsRoot<T extends string = string>(props: TabsProps<T>): JSX.Element {\n  const messages = useUiMessages();\n  let root: HTMLDivElement | undefined;\n  let list: HTMLDivElement | undefined;\n  createScrollFade(\n    () => list,\n    () => props.orientation !== \"vertical\",\n  );\n  const instanceId = `k2b-tabs-${createUniqueId()}`;\n  const resolvedChildren = children(() => props.children);\n  const trailing = children(() => props.trailing);\n  const items = createMemo<readonly TabOption<T>[]>(() => {\n    if (props.options) return props.options;\n    return collectTabsItems<T>(resolvedChildren.toArray()).map((item) => ({\n      value: item.props.value,\n      label: item.props.label,\n      icon: item.props.icon,\n      disabled: item.props.disabled,\n      panel: item.props.children,\n      onClose: item.props.onClose,\n      closeLabel: item.props.closeLabel,\n    }));\n  });\n  const buttons: HTMLButtonElement[] = [];\n  let closing: T | undefined;\n  const requestClose = (option: TabOption<T>) => {\n    closing = option.value;\n    option.onClose?.();\n  };\n  const current = () => resolveMaybeAccessor(props.value);\n  const active = createMemo(() => items().find((option) => option.value === current()));\n  const activeIndex = createMemo(() =>\n    Math.max(\n      0,\n      items().findIndex((option) => option.value === current()),\n    ),\n  );\n  const enabled = () =>\n    items()\n      .map((option, index) => ({ option, index }))\n      .filter(({ option }) => !option.disabled);\n  const tabStopIndex = createMemo(() => {\n    const selected = items().findIndex((option) => option.value === current() && !option.disabled);\n    return selected >= 0 ? selected : (enabled()[0]?.index ?? -1);\n  });\n  createEffect(() => {\n    const index = activeIndex();\n    const removed = closing !== undefined && !items().some((item) => item.value === closing);\n    if (removed) closing = undefined;\n    queueMicrotask(() => {\n      buttons[index]?.scrollIntoView?.({ block: \"nearest\", inline: \"nearest\" });\n      if (removed) {\n        const target = items().length ? buttons[index] : root?.querySelector<HTMLElement>(\".k2b-tabs__trailing button\");\n        target?.focus();\n      }\n    });\n  });\n  const select = (index: number) => {\n    const option = items()[index];\n    if (!option || option.disabled) return;\n    props.onValueChange(option.value);\n    queueMicrotask(() => buttons[index]?.focus());\n  };\n  const move = (index: number, delta: 1 | -1) => {\n    const available = enabled();\n    if (available.length === 0) return;\n    const currentIndex = available.findIndex((item) => item.index === index);\n    const next = available[(currentIndex + delta + available.length) % available.length] ?? available[0];\n    if (next) select(next.index);\n  };\n\n  return (\n    <div\n      ref={root}\n      class={`k2b-tabs ${props.class ?? \"\"}`}\n      data-orientation={props.orientation ?? \"horizontal\"}\n      data-variant={props.variant ?? \"line\"}\n    >\n      <div class=\"k2b-tabs__bar\">\n        <div\n          ref={list}\n          data-scroll-fade-mode={props.orientation !== \"vertical\" ? \"both\" : undefined}\n          data-scroll-fade-axis=\"horizontal\"\n          class=\"k2b-tabs__list\"\n          role=\"tablist\"\n          aria-label={props.ariaLabel}\n          aria-orientation={props.orientation ?? \"horizontal\"}\n        >\n          <For each={items()}>\n            {(option, index) => {\n              const id = () => `${instanceId}-tab-${index()}`;\n              const panelId = () => `${instanceId}-panel-${index()}`;\n              return (\n                <div class=\"k2b-tabs__item\" role=\"presentation\">\n                  <button\n                    ref={(element) => {\n                      buttons[index()] = element;\n                    }}\n                    id={id()}\n                    type=\"button\"\n                    role=\"tab\"\n                    aria-selected={current() === option.value}\n                    aria-controls={option.panel !== undefined ? panelId() : undefined}\n                    tabIndex={tabStopIndex() === index() ? 0 : -1}\n                    disabled={option.disabled}\n                    onClick={() => props.onValueChange(option.value)}\n                    onKeyDown={(event) => {\n                      if ((event.key === \"Delete\" || event.key === \"Backspace\") && option.onClose) {\n                        event.preventDefault();\n                        requestClose(option);\n                        return;\n                      }\n                      const previous = props.orientation === \"vertical\" ? \"ArrowUp\" : \"ArrowLeft\";\n                      const next = props.orientation === \"vertical\" ? \"ArrowDown\" : \"ArrowRight\";\n                      if (event.key === previous || event.key === next) {\n                        event.preventDefault();\n                        move(index(), event.key === next ? 1 : -1);\n                      } else if (event.key === \"Home\" || event.key === \"End\") {\n                        event.preventDefault();\n                        const available = enabled();\n                        const target = event.key === \"End\" ? available.at(-1) : available[0];\n                        if (target) select(target.index);\n                      }\n                    }}\n                  >\n                    <Show when={option.icon}>{(icon) => <i class={icon()} aria-hidden=\"true\" />}</Show>\n                    <span>{option.label}</span>\n                  </button>\n                  <Show when={option.onClose}>\n                    <button\n                      type=\"button\"\n                      class=\"k2b-tabs__close\"\n                      aria-label={\n                        option.closeLabel ??\n                        messages().closeNamed({ name: typeof option.label === \"string\" ? option.label : props.ariaLabel })\n                      }\n                      disabled={option.disabled}\n                      onClick={() => requestClose(option)}\n                    >\n                      <i class=\"ti ti-x\" aria-hidden=\"true\" />\n                    </button>\n                  </Show>\n                </div>\n              );\n            }}\n          </For>\n        </div>\n        <Show when={trailing()}>\n          <div class=\"k2b-tabs__trailing\">{trailing()}</div>\n        </Show>\n      </div>\n      <Show when={active()?.panel !== undefined}>\n        <div\n          id={`${instanceId}-panel-${activeIndex()}`}\n          class=\"k2b-tabs__panel\"\n          role=\"tabpanel\"\n          aria-labelledby={`${instanceId}-tab-${activeIndex()}`}\n          tabIndex={0}\n        >\n          {active()?.panel}\n        </div>\n      </Show>\n    </div>\n  );\n}\n\nexport const Tabs = TabsRoot as TabsComponent;\nTabs.Item = TabsItem;\n\nexport default Tabs;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":[],"sources":["actions/Tabs.tsx"],"sourcesContent":["import { children, createEffect, createMemo, createUniqueId, For, type JSX, Show } from \"solid-js\";\nimport type { MaybeAccessor } from \"../inputs/field-contract\";\nimport { resolveMaybeAccessor } from \"../inputs/field-contract\";\nimport { useUiMessages } from \"../intl/messages\";\nimport { createScrollFade } from \"../layout/scroll-fade\";\n\nexport type TabOption<T extends string = string> = {\n  value: T;\n  label: JSX.Element;\n  icon?: string;\n  disabled?: boolean;\n  panel?: JSX.Element;\n  onClose?: () => void;\n  closeLabel?: string;\n};\n\nexport type TabsItemProps<T extends string = string> = Omit<TabOption<T>, \"panel\"> & {\n  children?: JSX.Element;\n};\n\ntype TabsItemSlot<T extends string = string> = {\n  readonly kind: typeof TABS_ITEM;\n  readonly props: TabsItemProps<T>;\n};\n\nexport type TabsProps<T extends string = string> = {\n  value: MaybeAccessor<T>;\n  onValueChange: (value: T) => void;\n  ariaLabel: string;\n  orientation?: \"horizontal\" | \"vertical\";\n  class?: string;\n  variant?: \"line\" | \"pill\";\n  trailing?: JSX.Element;\n  /** Data-driven alternative to colocated `Tabs.Item` children. */\n  options?: readonly TabOption<T>[];\n  children?: JSX.Element;\n};\n\ntype TabsComponent = (<T extends string = string>(props: TabsProps<T>) => JSX.Element) & {\n  Item: <T extends string = string>(props: TabsItemProps<T>) => JSX.Element;\n};\n\nconst TABS_ITEM = Symbol(\"Tabs.Item\");\n\nconst isTabsItem = <T extends string>(value: unknown): value is TabsItemSlot<T> =>\n  !!value && typeof value === \"object\" && \"kind\" in value && value.kind === TABS_ITEM;\n\nconst collectTabsItems = <T extends string>(value: unknown): TabsItemSlot<T>[] => {\n  if (Array.isArray(value)) return value.flatMap(collectTabsItems<T>);\n  return isTabsItem<T>(value) ? [value] : [];\n};\n\nfunction TabsItem<T extends string = string>(props: TabsItemProps<T>): JSX.Element {\n  return { kind: TABS_ITEM, props } satisfies TabsItemSlot<T> as unknown as JSX.Element;\n}\n\n/** Controlled, keyboard-accessible tabs with compositional or data-driven items. */\nfunction TabsRoot<T extends string = string>(props: TabsProps<T>): JSX.Element {\n  const messages = useUiMessages();\n  let root: HTMLDivElement | undefined;\n  let list: HTMLDivElement | undefined;\n  createScrollFade(\n    () => list,\n    () => props.orientation !== \"vertical\",\n  );\n  const instanceId = `k2b-tabs-${createUniqueId()}`;\n  const resolvedChildren = children(() => props.children);\n  const trailing = children(() => props.trailing);\n  const items = createMemo<readonly TabOption<T>[]>(() => {\n    if (props.options) return props.options;\n    return collectTabsItems<T>(resolvedChildren.toArray()).map((item) => ({\n      value: item.props.value,\n      label: item.props.label,\n      icon: item.props.icon,\n      disabled: item.props.disabled,\n      panel: item.props.children,\n      onClose: item.props.onClose,\n      closeLabel: item.props.closeLabel,\n    }));\n  });\n  const buttons: HTMLButtonElement[] = [];\n  let closing: T | undefined;\n  const requestClose = (option: TabOption<T>) => {\n    closing = option.value;\n    option.onClose?.();\n  };\n  const current = () => resolveMaybeAccessor(props.value);\n  const active = createMemo(() => items().find((option) => option.value === current()));\n  const activeIndex = createMemo(() =>\n    Math.max(\n      0,\n      items().findIndex((option) => option.value === current()),\n    ),\n  );\n  const enabled = () =>\n    items()\n      .map((option, index) => ({ option, index }))\n      .filter(({ option }) => !option.disabled);\n  const tabStopIndex = createMemo(() => {\n    const selected = items().findIndex((option) => option.value === current() && !option.disabled);\n    return selected >= 0 ? selected : (enabled()[0]?.index ?? -1);\n  });\n  createEffect(() => {\n    const index = activeIndex();\n    const removed = closing !== undefined && !items().some((item) => item.value === closing);\n    if (removed) closing = undefined;\n    queueMicrotask(() => {\n      buttons[index]?.scrollIntoView?.({ block: \"nearest\", inline: \"nearest\" });\n      if (removed) {\n        const target = items().length ? buttons[index] : root?.querySelector<HTMLElement>(\".k2b-tabs__trailing button\");\n        target?.focus();\n      }\n    });\n  });\n  const select = (index: number) => {\n    const option = items()[index];\n    if (!option || option.disabled) return;\n    props.onValueChange(option.value);\n    queueMicrotask(() => buttons[index]?.focus());\n  };\n  const move = (index: number, delta: 1 | -1) => {\n    const available = enabled();\n    if (available.length === 0) return;\n    const currentIndex = available.findIndex((item) => item.index === index);\n    const next = available[(currentIndex + delta + available.length) % available.length] ?? available[0];\n    if (next) select(next.index);\n  };\n\n  return (\n    <div\n      ref={root}\n      class={`k2b-tabs ${props.class ?? \"\"}`}\n      data-orientation={props.orientation ?? \"horizontal\"}\n      data-variant={props.variant ?? \"line\"}\n    >\n      <div class=\"k2b-tabs__bar\">\n        <div\n          ref={list}\n          data-scroll-fade-mode={props.orientation !== \"vertical\" ? \"both\" : undefined}\n          data-scroll-fade-axis=\"horizontal\"\n          class=\"k2b-tabs__list\"\n          role=\"tablist\"\n          aria-label={props.ariaLabel}\n          aria-orientation={props.orientation ?? \"horizontal\"}\n        >\n          <For each={items()}>\n            {(option, index) => {\n              const id = () => `${instanceId}-tab-${index()}`;\n              const panelId = () => `${instanceId}-panel-${index()}`;\n              return (\n                <div class=\"k2b-tabs__item\" role=\"presentation\">\n                  <button\n                    ref={(element) => {\n                      buttons[index()] = element;\n                    }}\n                    id={id()}\n                    type=\"button\"\n                    role=\"tab\"\n                    aria-selected={current() === option.value}\n                    aria-controls={option.panel !== undefined ? panelId() : undefined}\n                    tabIndex={tabStopIndex() === index() ? 0 : -1}\n                    disabled={option.disabled}\n                    onClick={() => props.onValueChange(option.value)}\n                    onKeyDown={(event) => {\n                      if ((event.key === \"Delete\" || event.key === \"Backspace\") && option.onClose) {\n                        event.preventDefault();\n                        requestClose(option);\n                        return;\n                      }\n                      const previous = props.orientation === \"vertical\" ? \"ArrowUp\" : \"ArrowLeft\";\n                      const next = props.orientation === \"vertical\" ? \"ArrowDown\" : \"ArrowRight\";\n                      if (event.key === previous || event.key === next) {\n                        event.preventDefault();\n                        move(index(), event.key === next ? 1 : -1);\n                      } else if (event.key === \"Home\" || event.key === \"End\") {\n                        event.preventDefault();\n                        const available = enabled();\n                        const target = event.key === \"End\" ? available.at(-1) : available[0];\n                        if (target) select(target.index);\n                      }\n                    }}\n                  >\n                    <Show when={option.icon}>{(icon) => <i class={icon()} aria-hidden=\"true\" />}</Show>\n                    <span class={props.variant === \"pill\" ? \"k2b-truncate-fade\" : undefined}>{option.label}</span>\n                  </button>\n                  <Show when={option.onClose}>\n                    <button\n                      type=\"button\"\n                      class=\"k2b-tabs__close\"\n                      aria-label={\n                        option.closeLabel ??\n                        messages().closeNamed({ name: typeof option.label === \"string\" ? option.label : props.ariaLabel })\n                      }\n                      disabled={option.disabled}\n                      onClick={() => requestClose(option)}\n                    >\n                      <i class=\"ti ti-x\" aria-hidden=\"true\" />\n                    </button>\n                  </Show>\n                </div>\n              );\n            }}\n          </For>\n        </div>\n        <Show when={trailing()}>\n          <div class=\"k2b-tabs__trailing\">{trailing()}</div>\n        </Show>\n      </div>\n      <Show when={active()?.panel !== undefined}>\n        <div\n          id={`${instanceId}-panel-${activeIndex()}`}\n          class=\"k2b-tabs__panel\"\n          role=\"tabpanel\"\n          aria-labelledby={`${instanceId}-tab-${activeIndex()}`}\n          tabIndex={0}\n        >\n          {active()?.panel}\n        </div>\n      </Show>\n    </div>\n  );\n}\n\nexport const Tabs = TabsRoot as TabsComponent;\nTabs.Item = TabsItem;\n\nexport default Tabs;\n"],"mappings":"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","ignoreList":[]}

package/dist/browser/actions/ViewTabs.js

@@ -0,0 +1,294 @@
+import { template as _$template } from "solid-js/web";
+import { setProperty as _$setProperty } from "solid-js/web";
+import { setAttribute as _$setAttribute } from "solid-js/web";
+import { getNextMarker as _$getNextMarker } from "solid-js/web";
+import { use as _$use } from "solid-js/web";
+import { className as _$className } from "solid-js/web";
+import { effect as _$effect } from "solid-js/web";
+import { createComponent as _$createComponent } from "solid-js/web";
+import { getNextElement as _$getNextElement } from "solid-js/web";
+import { insert as _$insert } from "solid-js/web";
+var _tmpl$ = /*#__PURE__*/_$template(`<span class=k2b-view-tabs__count>`),
+  _tmpl$2 = /*#__PURE__*/_$template(`<span class="k2b-view-tabs__label k2b-truncate-fade">`),
+  _tmpl$3 = /*#__PURE__*/_$template(`<i aria-hidden=true>`),
+  _tmpl$4 = /*#__PURE__*/_$template(`<span class=k2b-view-tabs__label>`),
+  _tmpl$5 = /*#__PURE__*/_$template(`<span class=k2b-view-tabs__more-count data-level=wide>+<!$><!/>`),
+  _tmpl$6 = /*#__PURE__*/_$template(`<span class=k2b-view-tabs__more-count data-level=compact>+<!$><!/>`),
+  _tmpl$7 = /*#__PURE__*/_$template(`<i class="ti ti-chevron-down"aria-hidden=true>`),
+  _tmpl$8 = /*#__PURE__*/_$template(`<li class=k2b-view-tabs__more>`),
+  _tmpl$9 = /*#__PURE__*/_$template(`<nav><ul class=k2b-view-tabs__list data-scroll-fade-mode=both data-scroll-fade-axis=horizontal><!$><!/><!$><!/></ul><script>`),
+  _tmpl$0 = /*#__PURE__*/_$template(`<li class=k2b-view-tabs__item><a class=k2b-view-tabs__tab>`);
+import { createEffect, createMemo, createSignal, For, on, onCleanup, onMount, Show } from "solid-js";
+import { useUiMessages } from "../intl/messages";
+import { createScrollFade, scrollFadeEdges } from "../layout/scroll-fade";
+import Dropdown from "./Dropdown";
+/** Two deterministic strip levels; only opening the menu reads CSS visibility. */
+export function viewTabsLayout(items, current, max = 5) {
+  // At least one slot keeps the current view visible, including for an invalid limit.
+  const limit = Number.isFinite(max) ? Math.max(1, Math.floor(max)) : 5;
+  const currentIndex = items.findIndex(item => item.id === current);
+  const visible = size => {
+    const indices = items.slice(0, size).map((_, index) => index);
+    if (currentIndex >= size) indices[indices.length - 1] = currentIndex;
+    return indices;
+  };
+  const wide = visible(limit);
+  const compact = visible(Math.min(limit, 3));
+  return {
+    wide,
+    compact,
+    wideHidden: items.length - wide.length,
+    compactHidden: items.length - compact.length
+  };
+}
+
+/** Self-contained: the server script embeds this before hydration. */
+function settleViewTabs(list, edges, focused) {
+  if (!(list instanceof HTMLElement)) return;
+  const current = focused ?? list.querySelector(".k2b-view-tabs__tab[aria-current=page]");
+  if (current && current.getClientRects().length > 0 && list.scrollWidth - list.clientWidth > 1) {
+    const bounds = list.getBoundingClientRect();
+    const item = current.getBoundingClientRect();
+    const fade = edges(list);
+    const style = getComputedStyle(list);
+    const left = fade === "top" || fade === "both" ? parseFloat(style.scrollPaddingLeft) || 0 : 0;
+    const right = fade === "bottom" || fade === "both" ? parseFloat(style.scrollPaddingRight) || 0 : 0;
+    if (item.left < bounds.left + left || item.right > bounds.right - right) {
+      let offset = item.left - bounds.left - (bounds.width - item.width) / 2;
+      if (focused) {
+        // Reserve padding at the destination edge; native clamping drops it when that end is reached.
+        offset = item.left < bounds.left + left ? item.left - bounds.left - (parseFloat(style.scrollPaddingLeft) || 0) : item.right - bounds.right + (parseFloat(style.scrollPaddingRight) || 0);
+      }
+      // Only the strip moves: scrollIntoView would also scroll the page. Instant keeps the first frame free of animation.
+      list.scrollTo({
+        left: list.scrollLeft + offset,
+        behavior: "instant"
+      });
+    }
+  }
+  const fade = edges(list);
+  if (fade) list.setAttribute("data-scroll-fade", fade);else list.removeAttribute("data-scroll-fade");
+}
+/** Also embedded, so it must not close over module state. */
+function watchViewTabs(list, settle, edges) {
+  if (!(list instanceof HTMLElement)) return;
+  // A DOM property survives hydration: one observer and focus listener per reused list.
+  let watch = list.__k2bViewTabsWatch;
+  if (!watch) {
+    const focus = event => {
+      // Pointer focus must not move the target under the pointer.
+      if (watch && event.target instanceof HTMLElement && event.target.matches(".k2b-view-tabs__tab:focus-visible")) {
+        watch.preferCurrent = false;
+        settle(list, edges, event.target);
+      }
+    };
+    watch = {
+      resize: new ResizeObserver(() => {
+        const focused = document.activeElement;
+        if (watch?.preferCurrent === false && focused instanceof HTMLElement && list.contains(focused) && focused.matches(".k2b-view-tabs__tab:focus-visible")) settle(list, edges, focused);else settle(list, edges);
+      }),
+      focus,
+      preferCurrent: true
+    };
+    Object.defineProperty(list, "__k2bViewTabsWatch", {
+      value: watch,
+      configurable: true
+    });
+    list.addEventListener("focusin", focus);
+  }
+  watch.preferCurrent = true;
+  const {
+    resize
+  } = watch;
+  resize.disconnect();
+  // Head actions parse after the views; settle again after their layout, before paint, and on later resizes.
+  resize.observe(list);
+  for (const child of Array.from(list.children)) resize.observe(child);
+  settle(list, edges);
+  return watch;
+}
+const VIEW_TABS_SCRIPT = `(${watchViewTabs})(document.currentScript&&document.currentScript.previousElementSibling,${settleViewTabs},${scrollFadeEdges})`;
+
+/**
+ * URL-backed object views. Every view is an ordinary document link, in the strip and under More, so reload, back,
+ * and forward keep the view the URL names.
+ */
+export function ViewTabs(props) {
+  const messages = useUiMessages();
+  const layout = createMemo(() => viewTabsLayout(props.items, props.current, props.max));
+  const stripItems = new Map();
+  let list;
+  createScrollFade(() => list, () => true);
+  onMount(() => {
+    const watch = watchViewTabs(list ?? null, settleViewTabs, scrollFadeEdges);
+    onCleanup(() => {
+      watch?.resize.disconnect();
+      if (list && watch) {
+        list.removeEventListener("focusin", watch.focus);
+        Reflect.deleteProperty(list, "__k2bViewTabsWatch");
+      }
+    });
+  });
+  // User effects run after Solid's render effects, including For and aria-current, in the same task.
+  createEffect(on(() => props.current, () => watchViewTabs(list ?? null, settleViewTabs, scrollFadeEdges), {
+    defer: true
+  }));
+  const [open, setOpen] = createSignal(false);
+  const [menuItems, setMenuItems] = createSignal([]);
+  const onOpenChange = next => {
+    if (next) {
+      setMenuItems(props.items.filter((item, index) => item.id !== props.current && (!layout().wide.includes(index) || stripItems.get(index)?.getClientRects().length === 0)).map(item => ({
+        href: item.href,
+        label: item.label,
+        icon: item.icon,
+        trailing: item.count !== undefined ? (() => {
+          var _el$ = _$getNextElement(_tmpl$);
+          _$insert(_el$, () => item.count);
+          return _el$;
+        })() : undefined
+      })));
+    }
+    setOpen(next);
+  };
+  const tabContent = item => [_$createComponent(Show, {
+    get when() {
+      return item.icon;
+    },
+    children: icon => (() => {
+      var _el$4 = _$getNextElement(_tmpl$3);
+      _$effect(() => _$className(_el$4, icon()));
+      return _el$4;
+    })()
+  }), (() => {
+    var _el$2 = _$getNextElement(_tmpl$2);
+    _$insert(_el$2, () => item.label);
+    return _el$2;
+  })(), _$createComponent(Show, {
+    get when() {
+      return item.count !== undefined;
+    },
+    get children() {
+      var _el$3 = _$getNextElement(_tmpl$);
+      _$insert(_el$3, () => item.count);
+      return _el$3;
+    }
+  })];
+  return (() => {
+    var _el$5 = _$getNextElement(_tmpl$9),
+      _el$6 = _el$5.firstChild,
+      _el$16 = _el$6.firstChild,
+      [_el$17, _co$3] = _$getNextMarker(_el$16.nextSibling),
+      _el$18 = _el$17.nextSibling,
+      [_el$19, _co$4] = _$getNextMarker(_el$18.nextSibling),
+      _el$20 = _el$6.nextSibling;
+    var _ref$ = list;
+    typeof _ref$ === "function" ? _$use(_ref$, _el$6) : list = _el$6;
+    _$insert(_el$6, _$createComponent(For, {
+      get each() {
+        return layout().wide;
+      },
+      children: index => {
+        const item = () => props.items[index];
+        onCleanup(() => stripItems.delete(index));
+        return (() => {
+          var _el$21 = _$getNextElement(_tmpl$0),
+            _el$22 = _el$21.firstChild;
+          _$use(element => stripItems.set(index, element), _el$21);
+          _$insert(_el$22, () => tabContent(item()));
+          _$effect(_p$ => {
+            var _v$3 = item().id,
+              _v$4 = !layout().compact.includes(index) ? "" : undefined,
+              _v$5 = item().href,
+              _v$6 = item().id === props.current ? "page" : undefined;
+            _v$3 !== _p$.e && _$setAttribute(_el$21, "data-view-tab", _p$.e = _v$3);
+            _v$4 !== _p$.t && _$setAttribute(_el$21, "data-compact-hidden", _p$.t = _v$4);
+            _v$5 !== _p$.a && _$setAttribute(_el$22, "href", _p$.a = _v$5);
+            _v$6 !== _p$.o && _$setAttribute(_el$22, "aria-current", _p$.o = _v$6);
+            return _p$;
+          }, {
+            e: undefined,
+            t: undefined,
+            a: undefined,
+            o: undefined
+          });
+          return _el$21;
+        })();
+      }
+    }), _el$17, _co$3);
+    _$insert(_el$6, _$createComponent(Show, {
+      get when() {
+        return layout().compactHidden + layout().wideHidden > 0;
+      },
+      get children() {
+        var _el$7 = _$getNextElement(_tmpl$8);
+        _$insert(_el$7, _$createComponent(Dropdown.Root, {
+          get items() {
+            return menuItems();
+          },
+          get open() {
+            return open();
+          },
+          onOpenChange: onOpenChange,
+          get label() {
+            return messages().moreViews;
+          },
+          get children() {
+            return _$createComponent(Dropdown.Trigger, {
+              appearance: "plain",
+              "class": "k2b-view-tabs__tab k2b-view-tabs__more-trigger",
+              get label() {
+                return messages().moreViews;
+              },
+              get children() {
+                return [(() => {
+                  var _el$8 = _$getNextElement(_tmpl$4);
+                  _$insert(_el$8, () => messages().more);
+                  return _el$8;
+                })(), _$createComponent(Show, {
+                  get when() {
+                    return layout().wideHidden > 0;
+                  },
+                  get children() {
+                    var _el$9 = _$getNextElement(_tmpl$5),
+                      _el$0 = _el$9.firstChild,
+                      _el$1 = _el$0.nextSibling,
+                      [_el$10, _co$] = _$getNextMarker(_el$1.nextSibling);
+                    _$insert(_el$9, () => layout().wideHidden, _el$10, _co$);
+                    return _el$9;
+                  }
+                }), _$createComponent(Show, {
+                  get when() {
+                    return layout().compactHidden > 0;
+                  },
+                  get children() {
+                    var _el$11 = _$getNextElement(_tmpl$6),
+                      _el$12 = _el$11.firstChild,
+                      _el$13 = _el$12.nextSibling,
+                      [_el$14, _co$2] = _$getNextMarker(_el$13.nextSibling);
+                    _$insert(_el$11, () => layout().compactHidden, _el$14, _co$2);
+                    return _el$11;
+                  }
+                }), _$getNextElement(_tmpl$7)];
+              }
+            });
+          }
+        }));
+        _$effect(() => _$setAttribute(_el$7, "data-wide", layout().wideHidden > 0 ? "" : undefined));
+        return _el$7;
+      }
+    }), _el$19, _co$4);
+    _$setProperty(_el$20, "innerHTML", VIEW_TABS_SCRIPT);
+    _$effect(_p$ => {
+      var _v$ = `k2b-view-tabs ${props.class ?? ""}`,
+        _v$2 = props.label;
+      _v$ !== _p$.e && _$className(_el$5, _p$.e = _v$);
+      _v$2 !== _p$.t && _$setAttribute(_el$5, "aria-label", _p$.t = _v$2);
+      return _p$;
+    }, {
+      e: undefined,
+      t: undefined
+    });
+    return _el$5;
+  })();
+}
+//# sourceMappingURL=ViewTabs.js.map

package/dist/browser/actions/ViewTabs.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["actions/ViewTabs.tsx"],"sourcesContent":["import { createEffect, createMemo, createSignal, For, type JSX, on, onCleanup, onMount, Show } from \"solid-js\";\nimport { useUiMessages } from \"../intl/messages\";\nimport { createScrollFade, scrollFadeEdges } from \"../layout/scroll-fade\";\nimport Dropdown, { type DropdownItem } from \"./Dropdown\";\n\nexport type ViewTab = { id: string; label: string; href: string; icon?: string; count?: number | string };\nexport type ViewTabsProps = {\n  /** Accessible name of the navigation landmark, e.g. \"Views\". */\n  label: string;\n  items: readonly ViewTab[];\n  /** Id of the open view; the server reads it from `?view=`. Unknown ids select nothing. */\n  current: string | undefined;\n  /** Tabs shown before More (default 5). */\n  max?: number;\n  class?: string;\n};\n\n/** Two deterministic strip levels; only opening the menu reads CSS visibility. */\nexport function viewTabsLayout(items: readonly ViewTab[], current: string | undefined, max = 5) {\n  // At least one slot keeps the current view visible, including for an invalid limit.\n  const limit = Number.isFinite(max) ? Math.max(1, Math.floor(max)) : 5;\n  const currentIndex = items.findIndex((item) => item.id === current);\n  const visible = (size: number) => {\n    const indices = items.slice(0, size).map((_, index) => index);\n    if (currentIndex >= size) indices[indices.length - 1] = currentIndex;\n    return indices;\n  };\n  const wide = visible(limit);\n  const compact = visible(Math.min(limit, 3));\n  return { wide, compact, wideHidden: items.length - wide.length, compactHidden: items.length - compact.length };\n}\n\n/** Self-contained: the server script embeds this before hydration. */\nfunction settleViewTabs(list: Element | null, edges: (element: HTMLElement) => string | undefined, focused?: HTMLElement) {\n  if (!(list instanceof HTMLElement)) return;\n  const current = focused ?? list.querySelector(\".k2b-view-tabs__tab[aria-current=page]\");\n  if (current && current.getClientRects().length > 0 && list.scrollWidth - list.clientWidth > 1) {\n    const bounds = list.getBoundingClientRect();\n    const item = current.getBoundingClientRect();\n    const fade = edges(list);\n    const style = getComputedStyle(list);\n    const left = fade === \"top\" || fade === \"both\" ? parseFloat(style.scrollPaddingLeft) || 0 : 0;\n    const right = fade === \"bottom\" || fade === \"both\" ? parseFloat(style.scrollPaddingRight) || 0 : 0;\n    if (item.left < bounds.left + left || item.right > bounds.right - right) {\n      let offset = item.left - bounds.left - (bounds.width - item.width) / 2;\n      if (focused) {\n        // Reserve padding at the destination edge; native clamping drops it when that end is reached.\n        offset =\n          item.left < bounds.left + left\n            ? item.left - bounds.left - (parseFloat(style.scrollPaddingLeft) || 0)\n            : item.right - bounds.right + (parseFloat(style.scrollPaddingRight) || 0);\n      }\n      // Only the strip moves: scrollIntoView would also scroll the page. Instant keeps the first frame free of animation.\n      list.scrollTo({ left: list.scrollLeft + offset, behavior: \"instant\" });\n    }\n  }\n  const fade = edges(list);\n  if (fade) list.setAttribute(\"data-scroll-fade\", fade);\n  else list.removeAttribute(\"data-scroll-fade\");\n}\n\ntype WatchedViewTabs = HTMLElement & {\n  __k2bViewTabsWatch?: { resize: ResizeObserver; focus: (event: FocusEvent) => void; preferCurrent: boolean };\n};\n\n/** Also embedded, so it must not close over module state. */\nfunction watchViewTabs(list: WatchedViewTabs | null, settle: typeof settleViewTabs, edges: (element: HTMLElement) => string | undefined) {\n  if (!(list instanceof HTMLElement)) return;\n  // A DOM property survives hydration: one observer and focus listener per reused list.\n  let watch = list.__k2bViewTabsWatch;\n  if (!watch) {\n    const focus = (event: FocusEvent) => {\n      // Pointer focus must not move the target under the pointer.\n      if (watch && event.target instanceof HTMLElement && event.target.matches(\".k2b-view-tabs__tab:focus-visible\")) {\n        watch.preferCurrent = false;\n        settle(list, edges, event.target);\n      }\n    };\n    watch = {\n      resize: new ResizeObserver(() => {\n        const focused = document.activeElement;\n        if (\n          watch?.preferCurrent === false &&\n          focused instanceof HTMLElement &&\n          list.contains(focused) &&\n          focused.matches(\".k2b-view-tabs__tab:focus-visible\")\n        )\n          settle(list, edges, focused);\n        else settle(list, edges);\n      }),\n      focus,\n      preferCurrent: true,\n    };\n    Object.defineProperty(list, \"__k2bViewTabsWatch\", { value: watch, configurable: true });\n    list.addEventListener(\"focusin\", focus);\n  }\n  watch.preferCurrent = true;\n  const { resize } = watch;\n  resize.disconnect();\n  // Head actions parse after the views; settle again after their layout, before paint, and on later resizes.\n  resize.observe(list);\n  for (const child of Array.from(list.children)) resize.observe(child);\n  settle(list, edges);\n  return watch;\n}\nconst VIEW_TABS_SCRIPT = `(${watchViewTabs})(document.currentScript&&document.currentScript.previousElementSibling,${settleViewTabs},${scrollFadeEdges})`;\n\n/**\n * URL-backed object views. Every view is an ordinary document link, in the strip and under More, so reload, back,\n * and forward keep the view the URL names.\n */\nexport function ViewTabs(props: ViewTabsProps): JSX.Element {\n  const messages = useUiMessages();\n  const layout = createMemo(() => viewTabsLayout(props.items, props.current, props.max));\n  const stripItems = new Map<number, HTMLLIElement>();\n  let list: HTMLUListElement | undefined;\n  createScrollFade(\n    () => list,\n    () => true,\n  );\n  onMount(() => {\n    const watch = watchViewTabs(list ?? null, settleViewTabs, scrollFadeEdges);\n    onCleanup(() => {\n      watch?.resize.disconnect();\n      if (list && watch) {\n        list.removeEventListener(\"focusin\", watch.focus);\n        Reflect.deleteProperty(list, \"__k2bViewTabsWatch\");\n      }\n    });\n  });\n  // User effects run after Solid's render effects, including For and aria-current, in the same task.\n  createEffect(\n    on(\n      () => props.current,\n      () => watchViewTabs(list ?? null, settleViewTabs, scrollFadeEdges),\n      { defer: true },\n    ),\n  );\n  const [open, setOpen] = createSignal(false);\n  const [menuItems, setMenuItems] = createSignal<DropdownItem[]>([]);\n  const onOpenChange = (next: boolean) => {\n    if (next) {\n      setMenuItems(\n        props.items\n          .filter(\n            (item, index) =>\n              item.id !== props.current && (!layout().wide.includes(index) || stripItems.get(index)?.getClientRects().length === 0),\n          )\n          .map((item) => ({\n            href: item.href,\n            label: item.label,\n            icon: item.icon,\n            trailing: item.count !== undefined ? <span class=\"k2b-view-tabs__count\">{item.count}</span> : undefined,\n          })),\n      );\n    }\n    setOpen(next);\n  };\n  const tabContent = (item: ViewTab) => (\n    <>\n      <Show when={item.icon}>{(icon) => <i class={icon()} aria-hidden=\"true\" />}</Show>\n      <span class=\"k2b-view-tabs__label k2b-truncate-fade\">{item.label}</span>\n      <Show when={item.count !== undefined}>\n        <span class=\"k2b-view-tabs__count\">{item.count}</span>\n      </Show>\n    </>\n  );\n  return (\n    <nav class={`k2b-view-tabs ${props.class ?? \"\"}`} aria-label={props.label}>\n      <ul ref={list} class=\"k2b-view-tabs__list\" data-scroll-fade-mode=\"both\" data-scroll-fade-axis=\"horizontal\">\n        <For each={layout().wide}>\n          {(index) => {\n            const item = () => props.items[index]!;\n            onCleanup(() => stripItems.delete(index));\n            return (\n              <li\n                ref={(element) => stripItems.set(index, element)}\n                class=\"k2b-view-tabs__item\"\n                data-view-tab={item().id}\n                data-compact-hidden={!layout().compact.includes(index) ? \"\" : undefined}\n              >\n                <a class=\"k2b-view-tabs__tab\" href={item().href} aria-current={item().id === props.current ? \"page\" : undefined}>\n                  {tabContent(item())}\n                </a>\n              </li>\n            );\n          }}\n        </For>\n        <Show when={layout().compactHidden + layout().wideHidden > 0}>\n          <li class=\"k2b-view-tabs__more\" data-wide={layout().wideHidden > 0 ? \"\" : undefined}>\n            <Dropdown.Root items={menuItems()} open={open()} onOpenChange={onOpenChange} label={messages().moreViews}>\n              <Dropdown.Trigger appearance=\"plain\" class=\"k2b-view-tabs__tab k2b-view-tabs__more-trigger\" label={messages().moreViews}>\n                <span class=\"k2b-view-tabs__label\">{messages().more}</span>\n                <Show when={layout().wideHidden > 0}>\n                  <span class=\"k2b-view-tabs__more-count\" data-level=\"wide\">\n                    +{layout().wideHidden}\n                  </span>\n                </Show>\n                <Show when={layout().compactHidden > 0}>\n                  <span class=\"k2b-view-tabs__more-count\" data-level=\"compact\">\n                    +{layout().compactHidden}\n                  </span>\n                </Show>\n                <i class=\"ti ti-chevron-down\" aria-hidden=\"true\" />\n              </Dropdown.Trigger>\n            </Dropdown.Root>\n          </li>\n        </Show>\n      </ul>\n      <script innerHTML={VIEW_TABS_SCRIPT} />\n    </nav>\n  );\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/browser/actions/filter-messages.js

@@ -4,10 +4,14 @@ const filterMessages = i18n.define({
   baseLocale: "en",
   messages: {
     en: {
-      filterActions: "Filter actions"
+      filterActions: "Filter actions",
+      filters: "Filters",
+      reset: "Reset"
     },
     de: {
-      filterActions: "Filteraktionen"
+      filterActions: "Filteraktionen",
+      filters: "Filter",
+      reset: "Zurücksetzen"
     }
   }
 });

package/dist/browser/actions/filter-messages.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["actions/filter-messages.ts"],"sourcesContent":["import { i18n } from \"@k2b/stdlib\";\nimport { useLocale } from \"../intl/locale\";\n\nconst filterMessages = i18n.define({\n  baseLocale: \"en\",\n  messages: {\n    en: {\n      filterActions: \"Filter actions\",\n    },\n    de: {\n      filterActions: \"Filteraktionen\",\n    },\n  },\n});\n\nexport type FilterMessages = ReturnType<(typeof filterMessages)[\"resolve\"]>[\"t\"];\n\n/** Resolved from the inherited render locale. */\nexport const useFilterMessages = (): (() => FilterMessages) => {\n  const locale = useLocale();\n  return () => filterMessages.resolve([locale()]).t;\n};\n\nexport const checkFilterMessages = () => filterMessages.check();\n"],"mappings":"AAAA,SAAS,IAAI,QAAQ,aAAa;AAClC,SAAS,SAAS,QAAQ,gBAAgB;AAE1C,MAAM,cAAc,GAAG,IAAI,CAAC,MAAM,CAAC;EACjC,UAAU,EAAE,IAAI;EAChB,QAAQ,EAAE;IACR,EAAE,EAAE;MACF,aAAa,EAAE;IACjB,CAAC;IACD,EAAE,EAAE;MACF,aAAa,EAAE;IACjB;EACF;AACF,CAAC,CAAC;AAIF;AACA,OAAO,MAAM,iBAAiB,GAAG,MAA8B;EAC7D,MAAM,MAAM,GAAG,SAAS,CAAC,CAAC;EAC1B,OAAO,MAAM,cAAc,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACnD,CAAC;AAED,OAAO,MAAM,mBAAmB,GAAG,MAAM,cAAc,CAAC,KAAK,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":[],"sources":["actions/filter-messages.ts"],"sourcesContent":["import { i18n } from \"@k2b/stdlib\";\nimport { useLocale } from \"../intl/locale\";\n\nconst filterMessages = i18n.define({\n  baseLocale: \"en\",\n  messages: {\n    en: {\n      filterActions: \"Filter actions\",\n      filters: \"Filters\",\n      reset: \"Reset\",\n    },\n    de: {\n      filterActions: \"Filteraktionen\",\n      filters: \"Filter\",\n      reset: \"Zurücksetzen\",\n    },\n  },\n});\n\nexport type FilterMessages = ReturnType<(typeof filterMessages)[\"resolve\"]>[\"t\"];\n\n/** Resolved from the inherited render locale. */\nexport const useFilterMessages = (): (() => FilterMessages) => {\n  const locale = useLocale();\n  return () => filterMessages.resolve([locale()]).t;\n};\n\nexport const checkFilterMessages = () => filterMessages.check();\n"],"mappings":"AAAA,SAAS,IAAI,QAAQ,aAAa;AAClC,SAAS,SAAS,QAAQ,gBAAgB;AAE1C,MAAM,cAAc,GAAG,IAAI,CAAC,MAAM,CAAC;EACjC,UAAU,EAAE,IAAI;EAChB,QAAQ,EAAE;IACR,EAAE,EAAE;MACF,aAAa,EAAE,gBAAgB;MAC/B,OAAO,EAAE,SAAS;MAClB,KAAK,EAAE;IACT,CAAC;IACD,EAAE,EAAE;MACF,aAAa,EAAE,gBAAgB;MAC/B,OAAO,EAAE,QAAQ;MACjB,KAAK,EAAE;IACT;EACF;AACF,CAAC,CAAC;AAIF;AACA,OAAO,MAAM,iBAAiB,GAAG,MAA8B;EAC7D,MAAM,MAAM,GAAG,SAAS,CAAC,CAAC;EAC1B,OAAO,MAAM,cAAc,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AACnD,CAAC;AAED,OAAO,MAAM,mBAAmB,GAAG,MAAM,cAAc,CAAC,KAAK,CAAC,CAAC","ignoreList":[]}

package/dist/browser/actions/index.js

@@ -4,7 +4,7 @@ export { CopyButton } from "./CopyButton";
 export { Disclosure } from "./Disclosure";
 export { activeDrag, DragSource, DropTarget, useKeyboardDrag } from "./DragAndDrop";
 export { Dropdown, DropdownItem, dropdownPosition } from "./Dropdown";
-export { FilterChip } from "./FilterChip";
+export { FilterChip, FilterToggle } from "./FilterChip";
 export { GestureMenu } from "./GestureMenu";
 export { RemoveButton } from "./RemoveButton";
 export { SegmentedControl } from "./SegmentedControl";
@@ -12,4 +12,5 @@ export { SplitButton } from "./SplitButton";
 export { openSpotlightSearch, SpotlightButton } from "./SpotlightSearch";
 export { Tabs } from "./Tabs";
 export { Toolbar } from "./Toolbar";
+export { ViewTabs } from "./ViewTabs";
 //# sourceMappingURL=index.js.map

package/dist/browser/actions/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["actions/index.ts"],"sourcesContent":["export type { ButtonAlign, ButtonLinkProps, ButtonProps, ButtonSize, ButtonVariant, IconButtonLinkProps, IconButtonProps } from \"./Button\";\nexport { Button, ButtonLink, IconButton, IconButtonLink } from \"./Button\";\nexport type { ContextMenuProps } from \"./ContextMenu\";\nexport { ContextMenu } from \"./ContextMenu\";\nexport type { CopyButtonProps, CopyButtonValue } from \"./CopyButton\";\nexport { CopyButton } from \"./CopyButton\";\nexport type { DisclosureProps } from \"./Disclosure\";\nexport { Disclosure } from \"./Disclosure\";\nexport type { DragPayload, DragSourceProps, DropTargetProps } from \"./DragAndDrop\";\nexport { activeDrag, DragSource, DropTarget, useKeyboardDrag } from \"./DragAndDrop\";\nexport type {\n  DropdownAction,\n  DropdownActionBase,\n  DropdownChoice,\n  DropdownItemProps,\n  DropdownPosition,\n  DropdownProps,\n  DropdownSection,\n  DropdownTriggerProps,\n} from \"./Dropdown\";\nexport { Dropdown, DropdownItem, dropdownPosition } from \"./Dropdown\";\nexport type { FilterChipOption, FilterChipProps, FilterChipSection } from \"./FilterChip\";\nexport { FilterChip } from \"./FilterChip\";\nexport type { GestureKind, GestureMenuAction, GestureMenuItem, GestureMenuProps, GestureMenuSection } from \"./GestureMenu\";\nexport { GestureMenu } from \"./GestureMenu\";\nexport type { RemoveButtonProps } from \"./RemoveButton\";\nexport { RemoveButton } from \"./RemoveButton\";\nexport type { SegmentedControlProps, SegmentOption } from \"./SegmentedControl\";\nexport { SegmentedControl } from \"./SegmentedControl\";\nexport type { SplitButtonProps } from \"./SplitButton\";\nexport { SplitButton } from \"./SplitButton\";\nexport type {\n  SpotlightButtonProps,\n  SpotlightButtonVariant,\n  SpotlightSearchOptions,\n  SpotlightSearchResolver,\n} from \"./SpotlightSearch\";\nexport {\n  openSpotlightSearch,\n  SpotlightButton,\n} from \"./SpotlightSearch\";\nexport type { TabOption, TabsItemProps, TabsProps } from \"./Tabs\";\nexport { Tabs } from \"./Tabs\";\nexport type { ToolbarActionProps, ToolbarGroupProps, ToolbarLabelProps, ToolbarProps, ToolbarSeparatorProps } from \"./Toolbar\";\nexport { Toolbar } from \"./Toolbar\";\n"],"mappings":"AACA,SAAS,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,QAAQ,UAAU;AAEzE,SAAS,WAAW,QAAQ,eAAe;AAE3C,SAAS,UAAU,QAAQ,cAAc;AAEzC,SAAS,UAAU,QAAQ,cAAc;AAEzC,SAAS,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,eAAe,QAAQ,eAAe;AAWnF,SAAS,QAAQ,EAAE,YAAY,EAAE,gBAAgB,QAAQ,YAAY;AAErE,SAAS,UAAU,QAAQ,cAAc;AAEzC,SAAS,WAAW,QAAQ,eAAe;AAE3C,SAAS,YAAY,QAAQ,gBAAgB;AAE7C,SAAS,gBAAgB,QAAQ,oBAAoB;AAErD,SAAS,WAAW,QAAQ,eAAe;AAO3C,SACE,mBAAmB,EACnB,eAAe,QACV,mBAAmB;AAE1B,SAAS,IAAI,QAAQ,QAAQ;AAE7B,SAAS,OAAO,QAAQ,WAAW","ignoreList":[]}
+{"version":3,"names":[],"sources":["actions/index.ts"],"sourcesContent":["export type { ButtonAlign, ButtonLinkProps, ButtonProps, ButtonSize, ButtonVariant, IconButtonLinkProps, IconButtonProps } from \"./Button\";\nexport { Button, ButtonLink, IconButton, IconButtonLink } from \"./Button\";\nexport type { ContextMenuProps } from \"./ContextMenu\";\nexport { ContextMenu } from \"./ContextMenu\";\nexport type { CopyButtonProps, CopyButtonValue } from \"./CopyButton\";\nexport { CopyButton } from \"./CopyButton\";\nexport type { DisclosureProps } from \"./Disclosure\";\nexport { Disclosure } from \"./Disclosure\";\nexport type { DragPayload, DragSourceProps, DropTargetProps } from \"./DragAndDrop\";\nexport { activeDrag, DragSource, DropTarget, useKeyboardDrag } from \"./DragAndDrop\";\nexport type {\n  DropdownAction,\n  DropdownActionBase,\n  DropdownChoice,\n  DropdownItemProps,\n  DropdownPosition,\n  DropdownProps,\n  DropdownSection,\n  DropdownTriggerProps,\n} from \"./Dropdown\";\nexport { Dropdown, DropdownItem, dropdownPosition } from \"./Dropdown\";\nexport type { FilterChipOption, FilterChipProps, FilterChipSection, FilterToggleProps } from \"./FilterChip\";\nexport { FilterChip, FilterToggle } from \"./FilterChip\";\nexport type { GestureKind, GestureMenuAction, GestureMenuItem, GestureMenuProps, GestureMenuSection } from \"./GestureMenu\";\nexport { GestureMenu } from \"./GestureMenu\";\nexport type { RemoveButtonProps } from \"./RemoveButton\";\nexport { RemoveButton } from \"./RemoveButton\";\nexport type { SegmentedControlProps, SegmentOption } from \"./SegmentedControl\";\nexport { SegmentedControl } from \"./SegmentedControl\";\nexport type { SplitButtonProps } from \"./SplitButton\";\nexport { SplitButton } from \"./SplitButton\";\nexport type {\n  SpotlightButtonProps,\n  SpotlightButtonVariant,\n  SpotlightSearchOptions,\n  SpotlightSearchResolver,\n} from \"./SpotlightSearch\";\nexport {\n  openSpotlightSearch,\n  SpotlightButton,\n} from \"./SpotlightSearch\";\nexport type { TabOption, TabsItemProps, TabsProps } from \"./Tabs\";\nexport { Tabs } from \"./Tabs\";\nexport type { ToolbarActionProps, ToolbarGroupProps, ToolbarLabelProps, ToolbarProps, ToolbarSeparatorProps } from \"./Toolbar\";\nexport { Toolbar } from \"./Toolbar\";\nexport type { ViewTab, ViewTabsProps } from \"./ViewTabs\";\nexport { ViewTabs } from \"./ViewTabs\";\n"],"mappings":"AACA,SAAS,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,QAAQ,UAAU;AAEzE,SAAS,WAAW,QAAQ,eAAe;AAE3C,SAAS,UAAU,QAAQ,cAAc;AAEzC,SAAS,UAAU,QAAQ,cAAc;AAEzC,SAAS,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,eAAe,QAAQ,eAAe;AAWnF,SAAS,QAAQ,EAAE,YAAY,EAAE,gBAAgB,QAAQ,YAAY;AAErE,SAAS,UAAU,EAAE,YAAY,QAAQ,cAAc;AAEvD,SAAS,WAAW,QAAQ,eAAe;AAE3C,SAAS,YAAY,QAAQ,gBAAgB;AAE7C,SAAS,gBAAgB,QAAQ,oBAAoB;AAErD,SAAS,WAAW,QAAQ,eAAe;AAO3C,SACE,mBAAmB,EACnB,eAAe,QACV,mBAAmB;AAE1B,SAAS,IAAI,QAAQ,QAAQ;AAE7B,SAAS,OAAO,QAAQ,WAAW;AAEnC,SAAS,QAAQ,QAAQ,YAAY","ignoreList":[]}