@smwb/ui-solid 0.12.1 → 0.14.0

package/dist/source/components/navigation/tabs/tabs.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/navigation/tabs/tabs.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/tokens.entry.less\";\nimport \"@smwb/ui-styles/less/components/tabs/tabs.entry.less\";\nimport { type JSX, type ParentProps, Show, createEffect, createSignal, mergeProps, on, onCleanup, onMount, splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { debounce } from \"../../../utils/debounce\";\nimport { animate } from \"../../../utils/animate\";\nimport { TabsContext, type TabsContextValue } from \"./tabsContext\";\nimport { Tab } from \"./tab/tab\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface TabsProps {\n  value: number;\n  onChange: (event: MouseEvent & { currentTarget: HTMLElement; target: Element }, index: number) => void;\n  indicatorContent?: boolean;\n  /**\n   * Let the tab row scroll sideways instead of clipping it. The edge beyond which\n   * more tabs are hidden fades out.\n   */\n  scrollable?: boolean;\n  /** With `scrollable`: buttons at both ends that scroll the row while it overflows. */\n  scrollButtons?: boolean;\n  /** Compact tabs: labels as written (no capitals, no letter spacing) and less padding. */\n  dense?: boolean;\n  /** Accessible label of the button that scrolls back. */\n  scrollBackAriaLabel?: string;\n  /** Accessible label of the button that scrolls forward. */\n  scrollForwardAriaLabel?: string;\n  class?: string;\n  children?: JSX.Element;\n  \"aria-label\"?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\ninterface IndicatorStyle {\n  root: { left?: number; width?: number };\n  content?: { width: number };\n}\n\nconst VIEW_NEXT_TAB_PX = 40;\n/** A scroll button moves the row by this share of its visible width. */\nconst SCROLL_PAGE = 0.8;\n\nexport function Tabs(props: ParentProps<TabsProps>): JSX.Element {\n  const merged = mergeProps(\n    {\n      indicatorContent: false,\n      scrollable: false,\n      scrollButtons: false,\n      dense: false,\n      scrollBackAriaLabel: \"Scroll tabs back\",\n      scrollForwardAriaLabel: \"Scroll tabs forward\",\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"children\",\n    \"onChange\",\n    \"value\",\n    \"indicatorContent\",\n    \"scrollable\",\n    \"scrollButtons\",\n    \"dense\",\n    \"scrollBackAriaLabel\",\n    \"scrollForwardAriaLabel\",\n    \"aria-label\",\n    \"ref\",\n  ]);\n\n  const [mounted, setMounted] = createSignal(false);\n  const [indicatorStyle, setIndicatorStyle] = createSignal<IndicatorStyle>({ root: {} });\n  // Whether tabs are hidden past the start / the end of a scrollable row. Only\n  // measured in the browser, so the server markup shows neither.\n  const [overflowStart, setOverflowStart] = createSignal(false);\n  const [overflowEnd, setOverflowEnd] = createSignal(false);\n\n  let tabsEl: HTMLDivElement | undefined;\n  let tabListEl: HTMLDivElement | undefined;\n  let tabCounter = 0;\n  const contentRefs: HTMLSpanElement[] = [];\n\n  const getTabsMeta = () => {\n    let tabsMeta: { clientWidth: number; scrollLeft: number; left: number; right: number } | undefined;\n    if (tabsEl) {\n      const rect = tabsEl.getBoundingClientRect();\n      tabsMeta = { clientWidth: tabsEl.clientWidth, scrollLeft: tabsEl.scrollLeft, left: rect.left, right: rect.right };\n    }\n    let tabMeta: DOMRect | null = null;\n    let tabContentMeta: DOMRect | null = null;\n    if (tabsEl && tabListEl && tabListEl.children.length > 0) {\n      const tab = tabListEl.children[local.value];\n      tabMeta = tab ? tab.getBoundingClientRect() : null;\n      if (local.indicatorContent) {\n        tabContentMeta = contentRefs[local.value]?.getBoundingClientRect() ?? null;\n      }\n    }\n    return { tabsMeta, tabMeta, tabContentMeta };\n  };\n\n  const updateIndicatorState = (): void => {\n    const { tabsMeta, tabMeta, tabContentMeta } = getTabsMeta();\n    let startValue = 0;\n    if (tabMeta && tabsMeta) {\n      startValue = tabMeta.left - tabsMeta.left + tabsMeta.scrollLeft;\n    }\n    const next: IndicatorStyle = { root: { left: startValue, width: tabMeta ? tabMeta.width : 0 } };\n    if (local.indicatorContent && tabContentMeta) {\n      next.content = { width: tabContentMeta.width };\n    }\n    const prev = indicatorStyle();\n    if (prev.root.left === undefined || prev.root.width === undefined) {\n      setIndicatorStyle(next);\n      return;\n    }\n    const dStart = Math.abs((prev.root.left ?? 0) - (next.root.left ?? 0));\n    const dSize = Math.abs((prev.root.width ?? 0) - (next.root.width ?? 0));\n    if (dStart >= 1 || dSize >= 1) {\n      setIndicatorStyle(next);\n    }\n  };\n\n  const updateOverflow = (): void => {\n    if (!tabsEl || !local.scrollable) {\n      setOverflowStart(false);\n      setOverflowEnd(false);\n      return;\n    }\n    const max = tabsEl.scrollWidth - tabsEl.clientWidth;\n    setOverflowStart(tabsEl.scrollLeft > 1);\n    setOverflowEnd(tabsEl.scrollLeft < max - 1);\n  };\n\n  const scroll = (scrollValue: number): void => {\n    if (!tabsEl) return;\n    animate(tabsEl, \"scrollLeft\", scrollValue, { duration: 300 });\n  };\n\n  const scrollByPage = (direction: -1 | 1): void => {\n    if (!tabsEl) return;\n    scroll(tabsEl.scrollLeft + direction * tabsEl.clientWidth * SCROLL_PAGE);\n  };\n\n  const scrollSelectedIntoView = (): void => {\n    const { tabsMeta, tabMeta } = getTabsMeta();\n    if (!tabMeta || !tabsMeta) return;\n    if (tabMeta.left < tabsMeta.left) {\n      scroll(tabsMeta.scrollLeft + (tabMeta.left - tabsMeta.left) - VIEW_NEXT_TAB_PX);\n    } else if (tabMeta.right > tabsMeta.right) {\n      scroll(tabsMeta.scrollLeft + (tabMeta.right - tabsMeta.right) + VIEW_NEXT_TAB_PX);\n    }\n  };\n\n  onMount(() => setMounted(true));\n\n  // Re-measure when the active value changes (and on mount).\n  createEffect(on(() => local.value, () => updateIndicatorState()));\n\n  // Keep the indicator and the overflow state in sync with resizes: of the\n  // window, of the row, and of each tab (a label can grow with its data).\n  onMount(() => {\n    const onResize = debounce(() => {\n      updateIndicatorState();\n      updateOverflow();\n    }, 166);\n    const view = tabsEl?.ownerDocument.defaultView;\n    view?.addEventListener(\"resize\", onResize);\n    tabsEl?.addEventListener(\"scroll\", updateOverflow, { passive: true });\n    let resizeObserver: ResizeObserver | undefined;\n    if (typeof ResizeObserver !== \"undefined\" && tabListEl) {\n      resizeObserver = new ResizeObserver(onResize);\n      if (tabsEl) resizeObserver.observe(tabsEl);\n      Array.from(tabListEl.children).forEach((child) => resizeObserver?.observe(child));\n    }\n    updateOverflow();\n    onCleanup(() => {\n      onResize.cancel();\n      view?.removeEventListener(\"resize\", onResize);\n      tabsEl?.removeEventListener(\"scroll\", updateOverflow);\n      resizeObserver?.disconnect();\n    });\n  });\n\n  // Scroll the selected tab into view when the indicator moves.\n  createEffect(() => {\n    indicatorStyle();\n    scrollSelectedIntoView();\n  });\n\n  const contextValue: TabsContextValue = {\n    value: () => local.value,\n    onChange: local.onChange,\n    indicatorContent: local.indicatorContent,\n    registerTab: () => tabCounter++,\n    setContentRef: (index, el) => {\n      contentRefs[index] = el;\n    },\n  };\n\n  const showScrollButtons = (): boolean => local.scrollable && local.scrollButtons && (overflowStart() || overflowEnd());\n\n  return (\n    <TabsContext.Provider value={contextValue}>\n      <div\n        {...rest}\n        class={cn(\n          \"smwb-tabs\",\n          {\n            \"smwb-tabs--dense\": local.dense,\n            \"smwb-tabs--overflow-start\": overflowStart(),\n            \"smwb-tabs--overflow-end\": overflowEnd(),\n          },\n          local.class\n        )}\n        role=\"tabpanel\"\n        ref={mergeRefs(local.ref)}\n      >\n        <Show when={showScrollButtons()}>\n          <button\n            type=\"button\"\n            class=\"smwb-tabs__scroll-button smwb-tabs__scroll-button--start\"\n            aria-label={local.scrollBackAriaLabel}\n            disabled={!overflowStart()}\n            onClick={() => scrollByPage(-1)}\n          >\n            <Icon name=\"chevron_left\" size={20} />\n          </button>\n        </Show>\n        {/* The scroller's class is static so it is on the element from the start:\n            a ref on Tabs can find the row by class right away. */}\n        <div\n          class=\"smwb-tabs__scroller\"\n          classList={{ \"smwb-tabs__scroller--scrollable\": local.scrollable }}\n          ref={(el) => (tabsEl = el)}\n        >\n          <div class=\"smwb-tabs__scroll-area\" ref={(el) => (tabListEl = el)} role=\"tablist\" aria-label={local[\"aria-label\"]}>\n            {local.children}\n          </div>\n          <Show when={mounted()}>\n            <span\n              class=\"smwb-tabs__indicator\"\n              style={{\n                left: `${indicatorStyle().root.left ?? 0}px`,\n                width: `${indicatorStyle().root.width ?? 0}px`,\n              }}\n            >\n              <span\n                class=\"smwb-tabs__indicator-content\"\n                style={indicatorStyle().content ? { width: `${indicatorStyle().content?.width ?? 0}px` } : {}}\n              />\n            </span>\n          </Show>\n        </div>\n        <Show when={showScrollButtons()}>\n          <button\n            type=\"button\"\n            class=\"smwb-tabs__scroll-button smwb-tabs__scroll-button--end\"\n            aria-label={local.scrollForwardAriaLabel}\n            disabled={!overflowEnd()}\n            onClick={() => scrollByPage(1)}\n          >\n            <Icon name=\"chevron_right\" size={20} />\n          </button>\n        </Show>\n      </div>\n    </TabsContext.Provider>\n  );\n}\n\nexport { Tab };\nexport type { TabProps } from \"./tab/tab\";\nexport default Tabs;\n"],"mappings":"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","names":[],"file":"tabs.jsx"}
+{"version":3,"sources":["../../../../../src/components/navigation/tabs/tabs.tsx"],"sourcesContent":["import \"@smwb/ui-styles/less/tokens.entry.less\";\nimport \"@smwb/ui-styles/less/components/tabs/tabs.entry.less\";\nimport {\n  type Accessor,\n  type JSX,\n  type ParentProps,\n  For,\n  Show,\n  children,\n  createComputed,\n  createEffect,\n  createMemo,\n  createSignal,\n  createUniqueId,\n  mergeProps,\n  on,\n  onCleanup,\n  onMount,\n  splitProps,\n} from \"solid-js\";\nimport { isServer } from \"solid-js/web\";\nimport cn from \"clsx\";\nimport { debounce } from \"../../../utils/debounce\";\nimport { animate } from \"../../../utils/animate\";\nimport { matchesKeyboardShortcut } from \"../../../utils/keyboardShortcut\";\nimport { TabsContext, type TabInfo, type TabsContextValue } from \"./tabsContext\";\nimport { Tab } from \"./tab/tab\";\nimport { getHiddenIndexes } from \"./tabs.utils\";\nimport { Menu } from \"../menu\";\nimport { MenuItem } from \"../menu/menuItem\";\nimport { Icon } from \"../../base/icon\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { createRovingTabIndex } from \"../../../primitives/createRovingTabIndex\";\n\n/**\n * Tabs follow the WAI-ARIA tabs pattern with manual activation. The selected tab is the row's one\n * tab stop (`tabindex` 0, the others -1). The arrow keys along the row's `orientation` move focus to\n * the next or the previous tab (wrapping at the ends), Home and End to the first and the last one;\n * disabled tabs are skipped. Enter or Space then selects the focused tab, as a click does:\n * `onChange` is called for it, with the key's click. Moving focus changes nothing by itself, so a\n * row of link tabs does not navigate as the arrows pass them. Tab leaves the row for what follows\n * it, the selected `TabPanel` first when `panels` are given.\n *\n * A `Tab` can be `closable` and take `actions`; they sit beside the tab and out of the Tab order.\n * Delete on the focused tab, its close button or its `actions` (through `close`) ask `onClose` to\n * close it, and when it goes, focus moves to the tab that takes its place instead of falling to the\n * page. A middle click on a closable tab closes it too.\n *\n * With `onReorder` the row's tabs drag onto one another to reorder: `onReorder(from, to)` reports\n * the drop and the owner moves the tabs; dropping the selected tab reports its new index through\n * `onChange` as well, so the selection follows the moved tab. With `overflowMenu` a scrollable\n * row that overflows gains\n * a trigger beside it listing the clipped tabs. The chords Mod+W (close the focused closable tab)\n * and Mod+Shift+[ / Mod+Shift+] (switch to the previous / next tab) are handled on the row, as\n * best-effort: a browser of its own tabs reserves them.\n */\nexport interface TabsProps {\n  /**\n   * Index of the selected tab: its position in the row. Tabs count in the order they\n   * render, so a tab behind a `<Show>` that is off takes no index, and tabs added,\n   * removed or reordered count by their new place.\n   */\n  value: number;\n  /**\n   * Called with the index of the clicked tab, counted as for `value`. A tab chosen from the keyboard\n   * (Enter or Space on the focused tab) calls it with that click too. A modified or non-primary\n   * click (Ctrl, Meta, Shift or Alt held, or a button other than the main one) on a link tab\n   * (`Tab` with `href`) is the browser's, as \"open in a new tab\": it does not call `onChange`.\n   */\n  onChange: (event: MouseEvent & { currentTarget: HTMLElement; target: Element }, index: number) => void;\n  /**\n   * Which way the tabs run. It sets `aria-orientation` on the tab list and picks the arrow keys that\n   * move between tabs: Left and Right when horizontal, Up and Down when vertical. The styles draw\n   * a horizontal row; a vertical list is yours to lay out.\n   */\n  orientation?: \"horizontal\" | \"vertical\";\n  /**\n   * The content of the tabs: `TabPanel`s, rendered after the tab row. With them each tab gets\n   * `aria-controls` its panel and each panel `aria-labelledby` its tab. Without them the tabs link\n   * to nothing, as before. Give a panel to every tab: a tab whose panel is left out still names it.\n   * A `TabPanel` placed anywhere else is not linked to the tabs and is always shown.\n   */\n  panels?: JSX.Element;\n  /**\n   * Base of the ids that link tabs and panels: tab `n` is `{id}-tab-{n}`, its panel `{id}-panel-{n}`.\n   * It is also the id of the root element. A generated one by default.\n   */\n  id?: string;\n  /** Draw the indicator as wide as the selected tab's label rather than the whole tab. */\n  indicatorContent?: boolean;\n  /**\n   * Let the tab row scroll sideways instead of clipping it. The edge beyond which\n   * more tabs are hidden fades out.\n   */\n  scrollable?: boolean;\n  /**\n   * With `scrollable`: buttons at both ends that scroll the row while it overflows. They are for\n   * the pointer and stay out of the Tab order: the arrow keys reach every tab and scroll it into\n   * view.\n   */\n  scrollButtons?: boolean;\n  /**\n   * Present ⇒ the row is reorderable by dragging a tab onto another (pointer-only; there is no\n   * keyboard reorder). `Tabs` does not move the tabs itself: it reports the drag with\n   * `onReorder(from, to)` — indexes counted as for `value` — and the owner reorders its state.\n   * The tabs keep their focus through a reorder; when the moved tab is the selected one,\n   * `onChange` reports its new index too, so a controlled owner keeps it selected. That `onChange`\n   * carries the drop's own event standing in for the click's: the index argument is authoritative —\n   * `currentTarget` is the scroll area the drop delegates to, not the tab.\n   */\n  onReorder?: (from: number, to: number) => void;\n  /**\n   * With `scrollable`: when the row overflows, a trigger button is rendered beside the scroller\n   * (in the scroll buttons' spot) that opens a menu of the tabs the viewport clips — any clipped\n   * part beyond a 1px tolerance counts. Each entry shows the tab's icon and label, the selected one is marked\n   * `aria-current=\"true\"`, and choosing one calls `onChange` for it and scrolls it into view.\n   * The trigger appears only after the browser has measured an overflow, so the server markup\n   * shows none.\n   */\n  overflowMenu?: boolean;\n  /** Accessible label of the overflow-menu trigger. English by default; set it to localise. */\n  overflowMenuAriaLabel?: string;\n  /** Compact tabs: labels as written (no capitals, no letter spacing) and less padding. */\n  dense?: boolean;\n  /** Accessible label of the button that scrolls back. */\n  scrollBackAriaLabel?: string;\n  /** Accessible label of the button that scrolls forward. */\n  scrollForwardAriaLabel?: string;\n  class?: string;\n  children?: JSX.Element;\n  \"aria-label\"?: string;\n  ref?: Ref<HTMLDivElement>;\n}\n\ninterface IndicatorStyle {\n  root: { left?: number; width?: number };\n  content?: { width: number };\n}\n\nconst VIEW_NEXT_TAB_PX = 40;\n/** A scroll button moves the row by this share of its visible width. */\nconst SCROLL_PAGE = 0.8;\n\n/** What Tabs knows of each of its tabs. */\ninterface Registration extends TabInfo {\n  index: Accessor<number>;\n}\n\n/**\n * The tab list's children, resolved once, with their elements reported in order\n * whenever they change. It renders inside the context provider, so the tabs it\n * creates find their Tabs.\n */\nfunction TabListItems(props: { children?: JSX.Element; onItems: (items: Element[]) => void }): JSX.Element {\n  const resolved = children(() => props.children);\n  if (!isServer) {\n    createComputed(() => props.onItems(resolved.toArray().filter((node) => node instanceof Element)));\n  }\n  return <>{resolved()}</>;\n}\n\n/**\n * The `panels`, resolved once, inside the context provider so that the panels find their Tabs, and\n * before the tab row renders so that the tabs know whether they control anything. It draws\n * nothing itself: Tabs places what it reports after the row.\n */\nfunction PanelsResolver(props: {\n  children?: JSX.Element;\n  onPanels: (panels: JSX.Element, has: boolean) => void;\n}): null {\n  const resolved = children(() => props.children);\n  createComputed(() =>\n    props.onPanels(\n      resolved(),\n      resolved.toArray().some((node) => node != null && node !== false && node !== \"\")\n    )\n  );\n  return null;\n}\n\nexport function Tabs(props: ParentProps<TabsProps>): JSX.Element {\n  const merged = mergeProps(\n    {\n      indicatorContent: false,\n      scrollable: false,\n      scrollButtons: false,\n      overflowMenu: false,\n      dense: false,\n      orientation: \"horizontal\" as const,\n      scrollBackAriaLabel: \"Scroll tabs back\",\n      scrollForwardAriaLabel: \"Scroll tabs forward\",\n      overflowMenuAriaLabel: \"More tabs\",\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"children\",\n    \"onChange\",\n    \"value\",\n    \"indicatorContent\",\n    \"scrollable\",\n    \"scrollButtons\",\n    \"onReorder\",\n    \"overflowMenu\",\n    \"overflowMenuAriaLabel\",\n    \"dense\",\n    \"orientation\",\n    \"panels\",\n    \"id\",\n    \"scrollBackAriaLabel\",\n    \"scrollForwardAriaLabel\",\n    \"aria-label\",\n    \"ref\",\n  ]);\n\n  const generatedId = createUniqueId();\n  const baseId = (): string => local.id ?? generatedId;\n  const [registrations, setRegistrations] = createSignal<Registration[]>([]);\n  // A tab's own id is the one its panel is labelled by.\n  const tabId = (index: number): string =>\n    registrations()\n      .find((registration) => registration.index() === index)\n      ?.id() ?? `${baseId()}-tab-${index}`;\n  const panelId = (index: number): string => `${baseId()}-panel-${index}`;\n  const [panels, setPanels] = createSignal<JSX.Element>();\n  const [hasPanels, setHasPanels] = createSignal(false);\n  // The tab that has focus while focus is in the tab list: it is the row's tab stop then, so\n  // Tab from there leaves the row instead of landing on the selected tab again.\n  const [focusedIndex, setFocusedIndex] = createSignal<number | null>(null);\n\n  const [mounted, setMounted] = createSignal(false);\n  const [indicatorStyle, setIndicatorStyle] = createSignal<IndicatorStyle>({ root: {} });\n  // Whether tabs are hidden past the start / the end of a scrollable row. Only\n  // measured in the browser, so the server markup shows neither.\n  const [overflowStart, setOverflowStart] = createSignal(false);\n  const [overflowEnd, setOverflowEnd] = createSignal(false);\n  // The indexes of the tabs the scroller's viewport clips: what the overflow menu lists.\n  // Empty on the server and until the first measurement, like the overflow state.\n  const [hiddenIndexes, setHiddenIndexes] = createSignal<number[]>([]);\n  // The overflow-menu trigger and its menu, composed here when `overflowMenu` is on.\n  const [overflowOpen, setOverflowOpen] = createSignal(false);\n  let overflowTriggerEl: HTMLButtonElement | undefined;\n\n  let tabsEl: HTMLDivElement | undefined;\n  let tabListEl: HTMLDivElement | undefined;\n  // The tab the user asked to close while it, or something beside it, had focus: its item, which\n  // goes with it, and its place. If it goes while focus is lost with it, focus moves on to a neighbour.\n  let closingTab: { item: Element; index: number } | null = null;\n  // The tab list's elements in order, known once its children have resolved in\n  // the browser. Before that, and on the server, a tab's index is the order it\n  // was created in, which is its order in the markup.\n  const [items, setItems] = createSignal<Element[]>();\n  let created = 0;\n\n  const getTabsMeta = () => {\n    let tabsMeta: { clientWidth: number; scrollLeft: number; left: number; right: number } | undefined;\n    if (tabsEl) {\n      const rect = tabsEl.getBoundingClientRect();\n      tabsMeta = { clientWidth: tabsEl.clientWidth, scrollLeft: tabsEl.scrollLeft, left: rect.left, right: rect.right };\n    }\n    let tabMeta: DOMRect | null = null;\n    let tabContentMeta: DOMRect | null = null;\n    if (tabsEl && tabListEl && tabListEl.children.length > 0) {\n      const tab = tabListEl.children[local.value];\n      tabMeta = tab ? tab.getBoundingClientRect() : null;\n      if (local.indicatorContent) {\n        tabContentMeta = tab?.querySelector(\".smwb-tab__content\")?.getBoundingClientRect() ?? null;\n      }\n    }\n    return { tabsMeta, tabMeta, tabContentMeta };\n  };\n\n  const updateIndicatorState = (): void => {\n    const { tabsMeta, tabMeta, tabContentMeta } = getTabsMeta();\n    let startValue = 0;\n    if (tabMeta && tabsMeta) {\n      startValue = tabMeta.left - tabsMeta.left + tabsMeta.scrollLeft;\n    }\n    const next: IndicatorStyle = { root: { left: startValue, width: tabMeta ? tabMeta.width : 0 } };\n    if (local.indicatorContent && tabContentMeta) {\n      next.content = { width: tabContentMeta.width };\n    }\n    const prev = indicatorStyle();\n    if (prev.root.left === undefined || prev.root.width === undefined) {\n      setIndicatorStyle(next);\n      return;\n    }\n    const dStart = Math.abs((prev.root.left ?? 0) - (next.root.left ?? 0));\n    const dSize = Math.abs((prev.root.width ?? 0) - (next.root.width ?? 0));\n    if (dStart >= 1 || dSize >= 1) {\n      setIndicatorStyle(next);\n    }\n  };\n\n  const updateOverflow = (): void => {\n    if (!tabsEl || !local.scrollable) {\n      setOverflowStart(false);\n      setOverflowEnd(false);\n      setHiddenIndexes((prev) => (prev.length === 0 ? prev : []));\n      return;\n    }\n    const max = tabsEl.scrollWidth - tabsEl.clientWidth;\n    setOverflowStart(tabsEl.scrollLeft > 1);\n    setOverflowEnd(tabsEl.scrollLeft < max - 1);\n    // Which tabs the viewport clips, measured the same way: the scroller is `position: relative`,\n    // so a tab's `offsetLeft` is its place in the row's content. Only the menu needs the list,\n    // so nothing is measured without it. Kept by identity when unchanged, because this runs on\n    // every scroll tick.\n    const hidden = local.overflowMenu\n      ? getHiddenIndexes(\n          tabListEl\n            ? Array.from(tabListEl.children).map((child) => {\n                const item = child as HTMLElement;\n                return { offsetLeft: item.offsetLeft, offsetWidth: item.offsetWidth };\n              })\n            : [],\n          tabsEl.scrollLeft,\n          tabsEl.clientWidth\n        )\n      : [];\n    setHiddenIndexes((prev) =>\n      prev.length === hidden.length && prev.every((index, at) => index === hidden[at]) ? prev : hidden\n    );\n  };\n\n  const scroll = (scrollValue: number): void => {\n    if (!tabsEl) return;\n    animate(tabsEl, \"scrollLeft\", scrollValue, { duration: 300 });\n  };\n\n  const scrollByPage = (direction: -1 | 1): void => {\n    if (!tabsEl) return;\n    scroll(tabsEl.scrollLeft + direction * tabsEl.clientWidth * SCROLL_PAGE);\n  };\n\n  const scrollIndexIntoView = (index: number): void => {\n    if (!tabsEl || !tabListEl) return;\n    const tab = tabListEl.children[index];\n    if (!tab) return;\n    const tabsRect = tabsEl.getBoundingClientRect();\n    const tabRect = tab.getBoundingClientRect();\n    if (tabRect.left < tabsRect.left) {\n      scroll(tabsEl.scrollLeft + (tabRect.left - tabsRect.left) - VIEW_NEXT_TAB_PX);\n    } else if (tabRect.right > tabsRect.right) {\n      scroll(tabsEl.scrollLeft + (tabRect.right - tabsRect.right) + VIEW_NEXT_TAB_PX);\n    }\n  };\n\n  const scrollSelectedIntoView = (): void => {\n    scrollIndexIntoView(local.value);\n  };\n\n  onMount(() => setMounted(true));\n\n  // Re-measure when the active value or the tabs change (and on mount).\n  createEffect(\n    on([() => local.value, items], () => {\n      updateIndicatorState();\n      updateOverflow();\n    })\n  );\n\n  // Keep the indicator and the overflow state in sync with resizes: of the\n  // window, of the row, and of each tab (a label can grow with its data).\n  onMount(() => {\n    const onResize = debounce(() => {\n      updateIndicatorState();\n      updateOverflow();\n    }, 166);\n    const view = tabsEl?.ownerDocument.defaultView;\n    view?.addEventListener(\"resize\", onResize);\n    tabsEl?.addEventListener(\"scroll\", updateOverflow, { passive: true });\n    let resizeObserver: ResizeObserver | undefined;\n    if (typeof ResizeObserver !== \"undefined\" && tabListEl) {\n      resizeObserver = new ResizeObserver(onResize);\n      if (tabsEl) resizeObserver.observe(tabsEl);\n      Array.from(tabListEl.children).forEach((child) => resizeObserver?.observe(child));\n    }\n    updateOverflow();\n    onCleanup(() => {\n      onResize.cancel();\n      view?.removeEventListener(\"resize\", onResize);\n      tabsEl?.removeEventListener(\"scroll\", updateOverflow);\n      resizeObserver?.disconnect();\n    });\n  });\n\n  // Scroll the selected tab into view when the indicator moves.\n  createEffect(() => {\n    indicatorStyle();\n    scrollSelectedIntoView();\n  });\n\n  // The tabs in the DOM, by what they are: their indexes are the ones `value` counts.\n  const getTabNodes = (): HTMLElement[] => Array.from(tabListEl?.querySelectorAll<HTMLElement>('[role=\"tab\"]') ?? []);\n  // A tab with a close button or actions sits in an item with them: focus on any of it is focus on the tab.\n  const itemOf = (tab: HTMLElement): HTMLElement => tab.closest<HTMLElement>(\".smwb-tab-item\") ?? tab;\n  const indexOfFocus = (target: Node | null | undefined): number =>\n    target ? getTabNodes().findIndex((node) => itemOf(node).contains(target)) : -1;\n  const isNodeDisabled = (node: HTMLElement | undefined): boolean =>\n    !node || node.getAttribute(\"aria-disabled\") === \"true\" || (node as HTMLButtonElement).disabled === true;\n\n  // The selected tab is the stop; a value that points at no tab leaves the first one, and a\n  // disabled one, which cannot take focus, leaves the first tab that can.\n  const selectedStop = (): number => {\n    const count = items()?.length;\n    const candidate = count === undefined || (local.value >= 0 && local.value < count) ? local.value : 0;\n    const list = registrations();\n    if (!list.some((registration) => registration.index() === candidate && registration.disabled())) return candidate;\n    const enabled = list\n      .filter((registration) => !registration.disabled())\n      .map((registration) => registration.index())\n      .filter((index) => index >= 0);\n    return enabled.length > 0 ? Math.min(...enabled) : candidate;\n  };\n  const stopIndex = (): number => focusedIndex() ?? selectedStop();\n\n  const onRovingKeyDown = createRovingTabIndex({\n    count: () => getTabNodes().length,\n    activeIndex: stopIndex,\n    get orientation() {\n      return local.orientation;\n    },\n    onMove: (next) => getTabNodes()[next]?.focus(),\n    isDisabled: (index) => isNodeDisabled(getTabNodes()[index]),\n  });\n\n  // Drag-to-reorder (with `onReorder`): the drag's source and drop target are the tab items,\n  // tracked here on the row; Tabs only reports `onReorder(from, to)` — and, when the moved tab\n  // is the selected one, its new index through `onChange` — and keeps the tabs' focus alone;\n  // the owner moves the tabs in its state.\n  // Only while `onReorder` is given do the items carry `draggable`, and a disabled tab\n  // never: the attribute is rendered declaratively by each `Tab` on its item (the wrapper,\n  // or the bare tab when there is none), so it is part of the server markup — as in React.\n  let dragSourceIndex: number | null = null;\n  let draggingItem: HTMLElement | null = null;\n  let dropTargetItem: HTMLElement | null = null;\n  const dragItemOf = (target: EventTarget | null): HTMLElement | null =>\n    target instanceof Element ? itemOf(target as HTMLElement) : null;\n  const clearDragMarks = (): void => {\n    draggingItem?.classList.remove(\"smwb-tab-item--dragging\");\n    dropTargetItem?.classList.remove(\"smwb-tab-item--drop-target\");\n    draggingItem = null;\n    dropTargetItem = null;\n  };\n\n  const onItemDragStart: JSX.EventHandler<HTMLDivElement, DragEvent> = (event) => {\n    if (!local.onReorder) return;\n    const item = dragItemOf(event.target);\n    if (!item) return;\n    const index = indexOfFocus(item);\n    if (index < 0 || isNodeDisabled(getTabNodes()[index])) return;\n    dragSourceIndex = index;\n    draggingItem = item;\n    item.classList.add(\"smwb-tab-item--dragging\");\n    // Firefox wants the drag given something to carry.\n    event.dataTransfer?.setData(\"text/plain\", String(index));\n    if (event.dataTransfer) {\n      event.dataTransfer.effectAllowed = \"move\";\n    }\n  };\n\n  const onItemDragOver: JSX.EventHandler<HTMLDivElement, DragEvent> = (event) => {\n    if (dragSourceIndex === null || !local.onReorder) return;\n    const item = dragItemOf(event.target);\n    if (!item) return;\n    // Without it the drop is not allowed here.\n    event.preventDefault();\n    if (item === dropTargetItem) return;\n    dropTargetItem?.classList.remove(\"smwb-tab-item--drop-target\");\n    dropTargetItem = item;\n    item.classList.add(\"smwb-tab-item--drop-target\");\n  };\n\n  const onItemDrop: JSX.EventHandler<HTMLDivElement, DragEvent> = (event) => {\n    if (dragSourceIndex === null) return;\n    const from = dragSourceIndex;\n    dragSourceIndex = null;\n    const to = indexOfFocus(dragItemOf(event.target));\n    // Read before the drop is reported: the owner may answer `onReorder` synchronously and move\n    // `value` with the tab, and moving a node in the DOM loses the focus in some environments.\n    const sourceItem = draggingItem;\n    const wasSelected = from === local.value;\n    const doc = sourceItem?.ownerDocument;\n    const hadFocus = Boolean(sourceItem && doc?.activeElement && sourceItem.contains(doc.activeElement));\n    clearDragMarks();\n    event.preventDefault();\n    if (to >= 0 && to !== from) {\n      local.onReorder?.(from, to);\n      // The selection belongs to the tab: when the moved tab is the selected one, report its\n      // new index as a click would, so a controlled owner moves the value with the tab. The\n      // drop's event stands in for the click's, as the overflow menu's choice does.\n      if (wasSelected) {\n        local.onChange(event as unknown as MouseEvent & { currentTarget: HTMLElement; target: Element }, to);\n      }\n      // The focus belongs to the tab too: put it back on the moved tab when it had it. The\n      // check that the node landed at `to` keeps this honest when the owner reorders later.\n      if (hadFocus) {\n        const moved = getTabNodes()[to];\n        if (moved && itemOf(moved) === sourceItem) moved.focus();\n      }\n    }\n  };\n\n  const onItemDragEnd: JSX.EventHandler<HTMLDivElement, DragEvent> = () => {\n    dragSourceIndex = null;\n    clearDragMarks();\n  };\n\n  // Select the enabled tab `delta` places from the focused one, wrapping at the ends and\n  // skipping disabled tabs: as Enter or Space would, through a synthesized click on the tab.\n  const switchByChord = (event: KeyboardEvent & { target: Element }, delta: -1 | 1): void => {\n    const nodes = getTabNodes();\n    const from = indexOfFocus(event.target);\n    if (from < 0 || nodes.length === 0) return;\n    for (let step = 1; step <= nodes.length; step += 1) {\n      const next = (from + delta * step + nodes.length) % nodes.length;\n      const node = nodes[next];\n      if (node && !isNodeDisabled(node)) {\n        node.focus();\n        node.click();\n        return;\n      }\n    }\n  };\n\n  const onTabListKeyDown = (event: KeyboardEvent & { currentTarget: HTMLElement; target: Element }): void => {\n    if (event.defaultPrevented) return;\n    // The tabs' chords, ahead of the \"chords belong to the browser\" guard below. They are\n    // best-effort: a browser of its own tabs reserves Mod+W and Mod+Shift+[/], and they\n    // bite only in an embedded webview.\n    if ((event.ctrlKey || event.metaKey) && !event.altKey && indexOfFocus(event.target) >= 0) {\n      const index = indexOfFocus(event.target);\n      const registration = registrations().find((candidate) => candidate.index() === index);\n      if (matchesKeyboardShortcut(event, [\"Mod\", \"W\"])) {\n        if (registration && !registration.disabled() && registration.closable()) {\n          event.preventDefault();\n          registration.requestClose(event);\n        }\n        return;\n      }\n      if (matchesKeyboardShortcut(event, [\"Mod\", \"Shift\", \"[\"])) {\n        event.preventDefault();\n        switchByChord(event, -1);\n        return;\n      }\n      if (matchesKeyboardShortcut(event, [\"Mod\", \"Shift\", \"]\"])) {\n        event.preventDefault();\n        switchByChord(event, 1);\n        return;\n      }\n    }\n    // Chords belong to the browser; a handler that took the key first keeps it.\n    if (event.ctrlKey || event.metaKey || event.altKey || event.shiftKey) return;\n    if (!event.target.closest('[role=\"tab\"]')) return;\n    onRovingKeyDown(event);\n  };\n\n  // Focus can leave the row without a focusout: the focused tab is removed, and the browser moves\n  // focus to the body. The row keeps the focused tab as its stop only while focus is in it, on\n  // the tab that has it now (tabs before it may have come or gone).\n  createEffect(\n    on(\n      items,\n      () => {\n        const doc = tabListEl?.ownerDocument;\n        const closing = closingTab;\n        if (doc && closing && !closing.item.isConnected) {\n          closingTab = null;\n          // A tab the user closed took the focus with it: the tab that takes its place gets it (the\n          // previous one if it was last), the nearest that is not disabled. Focus that went anywhere\n          // else meanwhile stays there.\n          if (!doc.activeElement || doc.activeElement === doc.body) {\n            const nodes = getTabNodes();\n            const from = Math.min(closing.index, nodes.length - 1);\n            const candidates = [...nodes.keys()].filter((index) => !isNodeDisabled(nodes[index]));\n            const target = candidates.find((index) => index >= from) ?? candidates[candidates.length - 1];\n            if (target !== undefined) {\n              nodes[target]?.focus();\n              setFocusedIndex(target);\n              return;\n            }\n          }\n        }\n        if (focusedIndex() === null) return;\n        const index = indexOfFocus(doc?.activeElement);\n        setFocusedIndex(index >= 0 ? index : null);\n      },\n      { defer: true }\n    )\n  );\n\n  const onTabListFocusIn = (event: FocusEvent): void => {\n    const index = indexOfFocus(event.target as Node);\n    if (index >= 0) setFocusedIndex(index);\n    if (closingTab && !closingTab.item.contains(event.target as Node)) closingTab = null;\n  };\n\n  const onTabListFocusOut = (event: FocusEvent & { currentTarget: HTMLElement }): void => {\n    if (!event.currentTarget.contains(event.relatedTarget as Node | null)) {\n      setFocusedIndex(null);\n      // Chromium fires this too as the focused tab is removed, just before it goes, and the removal\n      // is what the marker is for: it stays until the effect that follows the removal has used it.\n      // One still standing once the current task's microtasks run was a real blur: that close no\n      // longer takes the focus anywhere.\n      queueMicrotask(() => {\n        if (closingTab?.item.isConnected) closingTab = null;\n      });\n    }\n  };\n\n  const contextValue: TabsContextValue = {\n    value: () => local.value,\n    tabStop: (index) => stopIndex() === index,\n    tabId,\n    panelId,\n    hasPanels,\n    reorderable: () => local.onReorder !== undefined,\n    onChange: local.onChange,\n    closing: (index, reason) => {\n      const tab = getTabNodes()[index];\n      const active = tab?.ownerDocument.activeElement;\n      // Focus in the item is focus on the tab. A close from the tab's own `actions` is the user's\n      // wherever focus is: it is in the menu then, which is drawn outside the row.\n      const focused = reason === \"actions\" || Boolean(active && tab && itemOf(tab).contains(active));\n      closingTab = tab && focused ? { item: itemOf(tab), index } : null;\n    },\n    registerTab: (element, info) => {\n      const order = created++;\n      const index = createMemo(() => {\n        const list = items();\n        if (!list) return order;\n        const el = element();\n        return el ? list.findIndex((item) => item.contains(el)) : -1;\n      });\n      const registration: Registration = { ...info, index };\n      setRegistrations((list) => [...list, registration]);\n      onCleanup(() => setRegistrations((list) => list.filter((item) => item !== registration)));\n      return index;\n    },\n  };\n\n  const showScrollButtons = (): boolean =>\n    local.scrollable && local.scrollButtons && (overflowStart() || overflowEnd());\n\n  // The overflow menu's trigger appears only once the browser has measured a clipped tab,\n  // so the server markup — and the first client render — shows none.\n  const showOverflowTrigger = (): boolean =>\n    local.scrollable && local.overflowMenu && hiddenIndexes().length > 0;\n\n  // The menu lists what the viewport clips; each entry shows a copy of the tab's icon and\n  // label (the live nodes belong to the row, so they are cloned into the entry, not moved),\n  // kept in step with the tab while the menu is open.\n  const overflowItemIcon = (node: HTMLElement | undefined): Element | undefined =>\n    node?.querySelector(\".smwb-tab__icon\") ?? undefined;\n  const overflowItemLabel = (node: HTMLElement | undefined): string =>\n    node?.querySelector(\".smwb-tab__text-label\")?.textContent ?? \"\";\n  const cloneIconInto = (el: HTMLElement, node: HTMLElement | undefined): void => {\n    const source = overflowItemIcon(node);\n    if (!source) return;\n    Array.from(source.childNodes).forEach((child) => el.appendChild(child.cloneNode(true)));\n  };\n\n  const chooseOverflowItem = (\n    event: MouseEvent & { currentTarget: HTMLLIElement; target: Element },\n    index: number\n  ): void => {\n    setOverflowOpen(false);\n    local.onChange(event, index);\n    scrollIndexIntoView(index);\n  };\n\n  return (\n    <TabsContext.Provider value={contextValue}>\n      <PanelsResolver onPanels={(resolved, has) => (setPanels(() => resolved), setHasPanels(has))}>\n        {local.panels}\n      </PanelsResolver>\n      <div\n        {...rest}\n        id={local.id}\n        class={cn(\n          \"smwb-tabs\",\n          {\n            \"smwb-tabs--dense\": local.dense,\n            \"smwb-tabs--overflow-start\": overflowStart(),\n            \"smwb-tabs--overflow-end\": overflowEnd(),\n          },\n          local.class\n        )}\n        ref={mergeRefs(local.ref)}\n      >\n        <Show when={showScrollButtons()}>\n          <button\n            type=\"button\"\n            class=\"smwb-tabs__scroll-button smwb-tabs__scroll-button--start\"\n            aria-label={local.scrollBackAriaLabel}\n            disabled={!overflowStart()}\n            tabindex={-1}\n            onClick={() => scrollByPage(-1)}\n          >\n            <Icon name=\"chevron_left\" size={20} />\n          </button>\n        </Show>\n        {/* The scroller's class is static so it is on the element from the start:\n            a ref on Tabs can find the row by class right away. */}\n        <div\n          class=\"smwb-tabs__scroller\"\n          classList={{ \"smwb-tabs__scroller--scrollable\": local.scrollable }}\n          ref={(el) => (tabsEl = el)}\n        >\n          <div\n            class=\"smwb-tabs__scroll-area\"\n            ref={(el) => (tabListEl = el)}\n            role=\"tablist\"\n            aria-label={local[\"aria-label\"]}\n            aria-orientation={local.orientation}\n            onKeyDown={onTabListKeyDown}\n            onFocusIn={onTabListFocusIn}\n            onFocusOut={onTabListFocusOut}\n            onDragStart={onItemDragStart}\n            onDragOver={onItemDragOver}\n            onDrop={onItemDrop}\n            onDragEnd={onItemDragEnd}\n          >\n            <TabListItems onItems={setItems}>{local.children}</TabListItems>\n          </div>\n          <Show when={mounted()}>\n            <span\n              class=\"smwb-tabs__indicator\"\n              style={{\n                left: `${indicatorStyle().root.left ?? 0}px`,\n                width: `${indicatorStyle().root.width ?? 0}px`,\n              }}\n            >\n              <span\n                class=\"smwb-tabs__indicator-content\"\n                style={indicatorStyle().content ? { width: `${indicatorStyle().content?.width ?? 0}px` } : {}}\n              />\n            </span>\n          </Show>\n        </div>\n        <Show when={showScrollButtons()}>\n          <button\n            type=\"button\"\n            class=\"smwb-tabs__scroll-button smwb-tabs__scroll-button--end\"\n            aria-label={local.scrollForwardAriaLabel}\n            disabled={!overflowEnd()}\n            tabindex={-1}\n            onClick={() => scrollByPage(1)}\n          >\n            <Icon name=\"chevron_right\" size={20} />\n          </button>\n        </Show>\n        <Show when={showOverflowTrigger()}>\n          <button\n            type=\"button\"\n            class=\"smwb-tabs__overflow-trigger\"\n            aria-haspopup=\"menu\"\n            aria-expanded={overflowOpen()}\n            aria-label={local.overflowMenuAriaLabel}\n            tabindex={-1}\n            ref={(el) => (overflowTriggerEl = el)}\n            onClick={() => setOverflowOpen((open) => !open)}\n          >\n            <Icon name=\"more_horiz\" size={20} />\n          </button>\n          <Menu\n            anchorElement={overflowTriggerEl ?? null}\n            isOpen={overflowOpen()}\n            onClose={() => setOverflowOpen(false)}\n            placement=\"bottom-end\"\n          >\n            <For each={hiddenIndexes()}>\n              {(index) => {\n                // The entry mirrors the tab it stands for. Solid children resolve to DOM, not to\n                // prop objects, so the tab's own node is the source for the label and the icon;\n                // a MutationObserver keeps the entry in step with renames and re-icons while the\n                // menu is open. Disabled follows the tab's registration, as in the row's other\n                // disabled bookkeeping, so a tab that flips `disabled` in place greys its entry out.\n                //\n                // Which node that is cannot be settled once, when the entry is drawn: an owner that\n                // keys its list by value replaces the tab's node when its label changes, while the\n                // clipped set — and so this entry — keeps its identity. `items` and `registrations`\n                // are what announce the row moving, and the effect below reads the node from the row\n                // when it runs, which is after Solid has landed that move in the DOM; a node sampled\n                // earlier, into a memo or into a const, is the detached one by then.\n                const nodeNow = (): HTMLElement | undefined => getTabNodes()[index];\n                // What the row shows at this index as the entry is drawn, so its first paint is not\n                // an empty entry; the effect below keeps it current from then on.\n                const drawn = nodeNow();\n                const [label, setLabel] = createSignal(overflowItemLabel(drawn));\n                const [hasIcon, setHasIcon] = createSignal(Boolean(overflowItemIcon(drawn)));\n                const disabled = createMemo(() => {\n                  const registration = registrations().find((candidate) => candidate.index() === index);\n                  return registration ? registration.disabled() : isNodeDisabled(nodeNow());\n                });\n                let iconEl: HTMLSpanElement | undefined;\n                // The node the entry's content was last taken from: the icon span copies from it\n                // when it is drawn, which is after the sync that asked for it.\n                let shownNode = drawn;\n                const syncIcon = (node: HTMLElement | undefined): void => {\n                  shownNode = node;\n                  const source = overflowItemIcon(node);\n                  setHasIcon(Boolean(source));\n                  if (iconEl && source) {\n                    iconEl.textContent = \"\";\n                    cloneIconInto(iconEl, node);\n                  }\n                };\n                createEffect(\n                  on([items, registrations], () => {\n                    const node = nodeNow();\n                    setLabel(overflowItemLabel(node));\n                    syncIcon(node);\n                    const item = node ? itemOf(node) : null;\n                    const view = item?.ownerDocument.defaultView;\n                    if (!item || !view || typeof view.MutationObserver === \"undefined\") return;\n                    const observer = new view.MutationObserver(() => {\n                      setLabel(overflowItemLabel(node));\n                      syncIcon(node);\n                    });\n                    observer.observe(item, { subtree: true, childList: true, characterData: true });\n                    onCleanup(() => observer.disconnect());\n                  })\n                );\n                return (\n                  <MenuItem\n                    disabled={disabled()}\n                    aria-current={index === local.value ? \"true\" : undefined}\n                    onClick={(event) => chooseOverflowItem(event, index)}\n                  >\n                    <Show when={hasIcon()}>\n                      <span\n                        class=\"smwb-tab__icon\"\n                        aria-hidden=\"true\"\n                        ref={(el) => {\n                          iconEl = el;\n                          // The span is drawn by the flag the sync above sets, so it is born after\n                          // that sync: it copies the icon of the node the entry last followed.\n                          if (overflowItemIcon(shownNode)) cloneIconInto(el, shownNode);\n                        }}\n                      />\n                    </Show>\n                    <span class=\"smwb-tab__text-label\">{label()}</span>\n                  </MenuItem>\n                );\n              }}\n            </For>\n          </Menu>\n        </Show>\n      </div>\n      {panels()}\n    </TabsContext.Provider>\n  );\n}\n\nexport { Tab };\nexport type { TabProps, TabActionsApi, TabCloseReason } from \"./tab/tab\";\nexport default Tabs;\n"],"mappings":"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","names":["index"],"file":"tabs.jsx"}

package/dist/source/components/navigation/tabs/tabs.utils.js

@@ -0,0 +1,18 @@
+function getHiddenIndexes(entries, scrollLeft, clientWidth) {
+  const EPSILON = 1;
+  const start = scrollLeft;
+  const end = scrollLeft + clientWidth;
+  const hidden = [];
+  entries.forEach((entry, index) => {
+    const clippedBefore = entry.offsetLeft < start - EPSILON;
+    const clippedAfter = entry.offsetLeft + entry.offsetWidth > end + EPSILON;
+    if (clippedBefore || clippedAfter) {
+      hidden.push(index);
+    }
+  });
+  return hidden;
+}
+export {
+  getHiddenIndexes
+};
+//# sourceMappingURL=tabs.utils.js.map

package/dist/source/components/navigation/tabs/tabs.utils.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/components/navigation/tabs/tabs.utils.ts"],
+  "sourcesContent": ["/**\n * Pure geometry helpers for the tab row's overflow measurement. The hidden-tab math lives\n * here, without a DOM, so it is testable in jsdom, which has no layout: tests feed mocked\n * measurements straight in.\n */\n\n/** What `getHiddenIndexes` needs to know of one tab's place in the row. */\nexport interface TabMeasureEntry {\n  /** The tab's left edge in the row's content: where it sits when nothing is scrolled. */\n  offsetLeft: number;\n  /** The tab's width. */\n  offsetWidth: number;\n}\n\n/**\n * The indexes of the tabs that the scroller's viewport clips \u2014 *any* clipped part counts,\n * so a tab that is only half visible is listed too. `entries` are the tabs in row order,\n * each in content coordinates; the viewport is `[scrollLeft, scrollLeft + clientWidth]`.\n * A pixel of tolerance keeps a tab flush with the edge from flickering while the row\n * scrolls in fractional steps.\n */\nexport function getHiddenIndexes(entries: TabMeasureEntry[], scrollLeft: number, clientWidth: number): number[] {\n  const EPSILON = 1;\n  const start = scrollLeft;\n  const end = scrollLeft + clientWidth;\n  const hidden: number[] = [];\n  entries.forEach((entry, index) => {\n    const clippedBefore = entry.offsetLeft < start - EPSILON;\n    const clippedAfter = entry.offsetLeft + entry.offsetWidth > end + EPSILON;\n    if (clippedBefore || clippedAfter) {\n      hidden.push(index);\n    }\n  });\n  return hidden;\n}\n"],
+  "mappings": "AAqBO,SAAS,iBAAiB,SAA4B,YAAoB,aAA+B;AAC9G,QAAM,UAAU;AAChB,QAAM,QAAQ;AACd,QAAM,MAAM,aAAa;AACzB,QAAM,SAAmB,CAAC;AAC1B,UAAQ,QAAQ,CAAC,OAAO,UAAU;AAChC,UAAM,gBAAgB,MAAM,aAAa,QAAQ;AACjD,UAAM,eAAe,MAAM,aAAa,MAAM,cAAc,MAAM;AAClE,QAAI,iBAAiB,cAAc;AACjC,aAAO,KAAK,KAAK;AAAA,IACnB;AAAA,EACF,CAAC;AACD,SAAO;AACT;",
+  "names": []
+}

package/dist/source/components/navigation/tabs/tabsContext.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/navigation/tabs/tabsContext.ts"],
-  "sourcesContent": ["import { type Accessor, createContext, useContext } from \"solid-js\";\n\nexport interface TabsContextValue {\n  value: Accessor<number>;\n  onChange: (event: MouseEvent & { currentTarget: HTMLElement; target: Element }, index: number) => void;\n  indicatorContent: boolean;\n  /** Each Tab registers on setup to learn its index (in DOM order). */\n  registerTab: () => number;\n  setContentRef: (index: number, el: HTMLSpanElement) => void;\n}\n\nexport const TabsContext = createContext<TabsContextValue>();\n\nexport const useTabsContext = (): TabsContextValue | undefined => useContext(TabsContext);\n"],
-  "mappings": "AAAA,SAAwB,eAAe,kBAAkB;AAWlD,MAAM,cAAc,cAAgC;AAEpD,MAAM,iBAAiB,MAAoC,WAAW,WAAW;",
+  "sourcesContent": ["import { type Accessor, createContext, useContext } from \"solid-js\";\n\n/** What asked for a tab to close: its close button, Delete or Backspace on it, its `actions`, or a middle click. */\nexport type TabCloseReason = \"button\" | \"key\" | \"actions\" | \"middleClick\";\n\n/** What a Tab tells its Tabs about itself, read when the Tabs needs it. */\nexport interface TabInfo {\n  /** The tab's own `id`, if the caller gave one: the panel is labelled by it. */\n  id: Accessor<string | undefined>;\n  /** Whether the tab is disabled, so it cannot be the row's tab stop. */\n  disabled: Accessor<boolean>;\n  /** Whether the tab is `closable`: Mod+W on the focused tab asks to close it. */\n  closable: Accessor<boolean>;\n  /** Ask the tab to close with this event and the reason \"key\", as its own Delete handling would. */\n  requestClose: (event: Event) => void;\n}\n\nexport interface TabsContextValue {\n  value: Accessor<number>;\n  onChange: (event: MouseEvent & { currentTarget: HTMLElement; target: Element }, index: number) => void;\n  /**\n   * Each Tab registers on setup with its root element (set once it renders) and\n   * gets back its index: its position in the tab list, which follows the tab when\n   * tabs are added, removed or reordered.\n   */\n  /** Whether the tab at `index` is the row's tab stop: the focused tab while focus is in the row, else the selected one. */\n  tabStop: (index: number) => boolean;\n  /** The id of the tab at `index`, its own if it has one: the one the panel at that index is labelled by. */\n  tabId: (index: number) => string;\n  /** The id of the panel at `index`: the one the tab at that index controls. */\n  panelId: (index: number) => string;\n  /** Whether the Tabs were given `panels`, so that its tabs control something. */\n  hasPanels: Accessor<boolean>;\n  /** Whether the row is reorderable (`onReorder` given): a tab's item is the drag surface then. */\n  reorderable: Accessor<boolean>;\n  registerTab: (element: Accessor<Element | undefined>, info: TabInfo) => Accessor<number>;\n  /**\n   * The tab at `index` is being closed by the user (its Delete key, its close button, its\n   * `actions` or a middle click):\n   * if focus is in it, or the close came from its actions, whose menu is drawn elsewhere, focus moves\n   * to a neighbour when it goes, instead of falling to the page.\n   */\n  closing: (index: number, reason: TabCloseReason) => void;\n}\n\nexport const TabsContext = createContext<TabsContextValue>();\n\nexport const useTabsContext = (): TabsContextValue | undefined => useContext(TabsContext);\n"],
+  "mappings": "AAAA,SAAwB,eAAe,kBAAkB;AA6ClD,MAAM,cAAc,cAAgC;AAEpD,MAAM,iBAAiB,MAAoC,WAAW,WAAW;",
   "names": []
 }

package/dist/source/connects/rt/table/table.jsx

@@ -99,15 +99,19 @@ function Table(props) {
     return settings ? { paginationSettings: settings } : {};
   });
   const align = () => local.cellAlign ?? "left";
+  const headerActions = (header) => {
+    const actions = header.isPlaceholder ? void 0 : header.column.columnDef.meta?.headerActions;
+    return actions ? flexRender(actions, header.getContext()) : void 0;
+  };
   const cellLabel = (column) => {
     const label = column.meta?.label ?? (typeof column.header === "string" ? column.header : void 0);
-    return label ? { label } : {};
+    return { label: label || false };
   };
   return <SmwbTable
     {...rest}
     {...paginationProp()}
     isLoading={local.isLoading ?? false}
-    hovered={!!local.onBodyRowClick}
+    hovered={rest.hovered ?? !!local.onBodyRowClick}
   >
       <TableHead>
         <For each={table.getHeaderGroups()}>
@@ -125,6 +129,7 @@ function Table(props) {
       onClick={() => {
         local.onHeadCellClick?.(header.column.columnDef);
       }}
+      actions={headerActions(header)}
       {...header.getSize() ? { style: { width: `${header.getSize()}px` } } : {}}
     >
                       <Show when={!header.isPlaceholder}>

package/dist/source/connects/rt/table/table.jsx.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/connects/rt/table/table.tsx"],"sourcesContent":["import { For, Show, createMemo, createSignal, splitProps, type JSX } from \"solid-js\";\nimport {\n  createSolidTable,\n  flexRender,\n  getCoreRowModel,\n  getExpandedRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  type ColumnDef,\n  type Row,\n  type RowData,\n  type SortingState,\n  type TableOptions,\n} from \"@tanstack/solid-table\";\n\nimport {\n  Table as SmwbTable,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeadCell,\n  TableRow,\n  type SortDirection,\n  type TableProps as SmwbTableProps,\n  type TablePaginationProps,\n} from \"../../../components/dataDisplay/table\";\nimport { ProgressIndicator } from \"../../../components/feedBack/progressIndicator\";\nimport { Message } from \"../../../components/feedBack/message\";\n\ndeclare module \"@tanstack/table-core\" {\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  interface ColumnMeta<TData extends RowData, TValue> {\n    /** Extra attributes for every body cell of the column. */\n    cellProps?: JSX.ThHTMLAttributes<HTMLTableCellElement>;\n    /** The column's name on each cell when rows stack as cards (`stackBelow`); a string `header` is used by default. */\n    label?: string;\n  }\n}\n\nexport interface RtTableProps<TData extends RowData, TValue = unknown> extends SmwbTableProps {\n  data: TData[];\n  columns: ColumnDef<TData, TValue>[];\n  /** Enables the sort affordance in head cells and the sorted row model. */\n  sortable?: boolean;\n  /** Initial sorting, e.g. `[{ id: \"name\", desc: false }]`. */\n  defaultSorting?: SortingState;\n  onSortingChange?: (sorting: SortingState) => void;\n  withPagination?: boolean;\n  /** Rows come from the outside page by page; the total is unknown. */\n  isInfinite?: boolean;\n  limit?: number;\n  limitOptions?: number[];\n  onNextPage?: () => void;\n  onPrevPage?: () => void;\n  expandable?: boolean;\n  getRowCanExpand?: (row: Row<TData>) => boolean;\n  renderSubComponent?: (props: { row: Row<TData> }) => JSX.Element;\n  cellAlign?: \"left\" | \"right\" | \"center\";\n  error?: string;\n  onHeadCellClick?: (column: ColumnDef<TData, TValue>) => void;\n  onBodyRowClick?: (row: Row<TData>, event: MouseEvent) => void;\n}\n\n/**\n * TanStack Table bound to the smwb table components.\n *\n * The connector owns only what the two sides must agree on — row models, the\n * sort affordance in the head cell, the pagination footer, and the loading /\n * error / empty rows. Everything else stays TanStack's: columns are plain\n * `ColumnDef`s and cells are rendered through `flexRender`, so any column\n * definition written against the React connector works here unchanged.\n *\n * `@tanstack/solid-table` is an optional peer: it ships with the connector's\n * subpath only, and a consumer that never imports the subpath never installs it.\n */\nexport function Table<TData extends RowData, TValue = unknown>(\n  props: RtTableProps<TData, TValue>\n): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"data\",\n    \"columns\",\n    \"sortable\",\n    \"defaultSorting\",\n    \"onSortingChange\",\n    \"withPagination\",\n    \"isInfinite\",\n    \"limit\",\n    \"limitOptions\",\n    \"onNextPage\",\n    \"onPrevPage\",\n    \"expandable\",\n    \"getRowCanExpand\",\n    \"renderSubComponent\",\n    \"cellAlign\",\n    \"error\",\n    \"onHeadCellClick\",\n    \"onBodyRowClick\",\n    \"isLoading\",\n  ]);\n\n  const limit = (): number => local.limit ?? 5;\n  const [sorting, setSorting] = createSignal<SortingState>(local.defaultSorting ?? []);\n\n  // Options are a getter object: Solid has no render pass to rebuild them on,\n  // so the table reads current data, columns and sorting on every access.\n  const table = createSolidTable({\n    get data() {\n      return local.data;\n    },\n    get columns() {\n      return local.columns;\n    },\n    state: {\n      get sorting() {\n        return sorting();\n      },\n    },\n    initialState: { pagination: { pageIndex: 0, pageSize: limit() } },\n    manualPagination: local.isInfinite,\n    getCoreRowModel: getCoreRowModel(),\n    onSortingChange: (updater) => {\n      const next = typeof updater === \"function\" ? updater(sorting()) : updater;\n      setSorting(next);\n      local.onSortingChange?.(next);\n    },\n    get getSortedRowModel() {\n      return local.sortable ? getSortedRowModel() : undefined;\n    },\n    get getPaginationRowModel() {\n      return local.withPagination ? getPaginationRowModel() : undefined;\n    },\n    get getExpandedRowModel() {\n      return local.expandable ? getExpandedRowModel() : undefined;\n    },\n    get getRowCanExpand() {\n      return local.expandable ? local.getRowCanExpand : undefined;\n    },\n  } as TableOptions<TData>);\n\n  const pagination = createMemo<TablePaginationProps | undefined>(() => {\n    if (!local.withPagination) return undefined;\n    const state = table.getState().pagination;\n    const base = {\n      limit: state.pageSize,\n      page: state.pageIndex + 1,\n      limitOptions: local.limitOptions ?? [5, 10, 15],\n      onNext: () => {\n        table.nextPage();\n        local.onNextPage?.();\n      },\n      onPrev: () => {\n        table.previousPage();\n        local.onPrevPage?.();\n      },\n      onLimitChange: (value: number) => table.setPageSize(value),\n    };\n    return local.isInfinite\n      ? { ...base, hasNextPage: local.data.length >= state.pageSize }\n      : { ...base, totalCount: table.getFilteredRowModel().rows.length };\n  });\n\n  const columnCount = (): number => table.getVisibleFlatColumns().length || 1;\n\n  // Spread instead of a prop: with exactOptionalPropertyTypes an explicit\n  // `undefined` is not the same as an absent prop, and the footer is absent\n  // whenever pagination is off.\n  const paginationProp = createMemo(() => {\n    const settings = pagination();\n    return settings ? { paginationSettings: settings } : {};\n  });\n\n  const align = (): \"left\" | \"right\" | \"center\" => local.cellAlign ?? \"left\";\n  // A body cell's label for the stacked layout: the column's meta.label, or its\n  // header when that is plain text.\n  const cellLabel = (column: ColumnDef<TData, TValue>): { label?: string } => {\n    const label = column.meta?.label ?? (typeof column.header === \"string\" ? column.header : undefined);\n    return label ? { label } : {};\n  };\n\n  return (\n    <SmwbTable\n      {...rest}\n      {...paginationProp()}\n      isLoading={local.isLoading ?? false}\n      hovered={!!local.onBodyRowClick}\n    >\n      <TableHead>\n        <For each={table.getHeaderGroups()}>\n          {(headerGroup) => (\n            <TableRow>\n              <For each={headerGroup.headers}>\n                {(header) => {\n                  const canSort = (): boolean => !!local.sortable && header.column.getCanSort();\n                  return (\n                    <TableHeadCell\n                      cellAlign={align()}\n                      sortable={canSort()}\n                      sortDirection={(header.column.getIsSorted() || false) as SortDirection}\n                      onSort={() => {\n                        if (canSort()) header.column.toggleSorting();\n                      }}\n                      onClick={() => {\n                        local.onHeadCellClick?.(header.column.columnDef);\n                      }}\n                      {...(header.getSize() ? { style: { width: `${header.getSize()}px` } } : {})}\n                    >\n                      <Show when={!header.isPlaceholder}>\n                        {flexRender(header.column.columnDef.header, header.getContext())}\n                      </Show>\n                    </TableHeadCell>\n                  );\n                }}\n              </For>\n            </TableRow>\n          )}\n        </For>\n      </TableHead>\n\n      <TableBody>\n        <Show\n          when={!local.isLoading}\n          fallback={\n            <TableRow class=\"smwb-table__loader__row\">\n              <TableCell class=\"smwb-table__loader\" colSpan={columnCount()}>\n                <ProgressIndicator variant=\"circular\" type=\"indeterminate\" />\n              </TableCell>\n            </TableRow>\n          }\n        >\n          <Show\n            when={!local.error}\n            fallback={\n              <TableRow class=\"smwb-table__loader__row\">\n                <TableCell class=\"smwb-table__loader\" colSpan={columnCount()}>\n                  <Message variant=\"filled\" type=\"error\">\n                    {local.error}\n                  </Message>\n                </TableCell>\n              </TableRow>\n            }\n          >\n            <For each={table.getRowModel().rows}>\n              {(row) => (\n                <>\n                  <TableRow onClick={(event: MouseEvent) => local.onBodyRowClick?.(row, event)}>\n                    <For each={row.getVisibleCells()}>\n                      {(cell) => (\n                        <TableCell\n                          cellAlign={align()}\n                          {...cellLabel(cell.column.columnDef as ColumnDef<TData, TValue>)}\n                          {...cell.column.columnDef.meta?.cellProps}\n                        >\n                          {flexRender(cell.column.columnDef.cell, cell.getContext())}\n                        </TableCell>\n                      )}\n                    </For>\n                  </TableRow>\n                  <Show when={row.getIsExpanded() && local.renderSubComponent}>\n                    <TableRow>\n                      <TableCell colSpan={row.getVisibleCells().length}>\n                        {local.renderSubComponent?.({ row })}\n                      </TableCell>\n                    </TableRow>\n                  </Show>\n                </>\n              )}\n            </For>\n          </Show>\n        </Show>\n      </TableBody>\n    </SmwbTable>\n  );\n}\n\nexport default Table;\n"],"mappings":"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","names":[],"file":"table.jsx"}
+{"version":3,"sources":["../../../../../src/connects/rt/table/table.tsx"],"sourcesContent":["import { For, Show, createMemo, createSignal, splitProps, type JSX } from \"solid-js\";\nimport {\n  createSolidTable,\n  flexRender,\n  getCoreRowModel,\n  getExpandedRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  type ColumnDef,\n  type Header,\n  type HeaderContext,\n  type Row,\n  type RowData,\n  type SortingState,\n  type TableOptions,\n} from \"@tanstack/solid-table\";\n\nimport {\n  Table as SmwbTable,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableHeadCell,\n  TableRow,\n  type SortDirection,\n  type TableProps as SmwbTableProps,\n  type TablePaginationProps,\n} from \"../../../components/dataDisplay/table\";\nimport { ProgressIndicator } from \"../../../components/feedBack/progressIndicator\";\nimport { Message } from \"../../../components/feedBack/message\";\n\ndeclare module \"@tanstack/table-core\" {\n  interface ColumnMeta<TData extends RowData, TValue> {\n    /** Extra attributes for every body cell of the column. */\n    cellProps?: JSX.ThHTMLAttributes<HTMLTableCellElement>;\n    /** The column's name on each cell when rows stack as cards (`stackBelow`); a string `header` is used by default. */\n    label?: string;\n    /**\n     * The column's controls in its head cell, such as a filter field or a menu\n     * button. They go to the cell's `actions`, after the sort control and\n     * outside it, so they stay out of its accessible name, while `header` is\n     * drawn inside it. Whatever `flexRender` takes: a component that gets the\n     * header context (`{ column, header, table }`), as `header` does, or\n     * markup. Markup is made once, with the column definitions, so it is drawn\n     * in one head cell at a time; a component draws the controls anew in each.\n     */\n    headerActions?: JSX.Element | ((context: HeaderContext<TData, TValue>) => JSX.Element);\n  }\n}\n\nexport interface RtTableProps<TData extends RowData, TValue = unknown> extends SmwbTableProps {\n  data: TData[];\n  /**\n   * TanStack column definitions. A column's `meta` may add `headerActions`\n   * (controls drawn beside the sort control in its head cell), `label` (its\n   * name on stacked rows) and `cellProps` (attributes of its body cells).\n   */\n  columns: ColumnDef<TData, TValue>[];\n  /** Enables the sort affordance in head cells and the sorted row model. */\n  sortable?: boolean;\n  /** Initial sorting, e.g. `[{ id: \"name\", desc: false }]`. */\n  defaultSorting?: SortingState;\n  onSortingChange?: (sorting: SortingState) => void;\n  withPagination?: boolean;\n  /** Rows come from the outside page by page; the total is unknown. */\n  isInfinite?: boolean;\n  limit?: number;\n  limitOptions?: number[];\n  onNextPage?: () => void;\n  onPrevPage?: () => void;\n  expandable?: boolean;\n  getRowCanExpand?: (row: Row<TData>) => boolean;\n  renderSubComponent?: (props: { row: Row<TData> }) => JSX.Element;\n  cellAlign?: \"left\" | \"right\" | \"center\";\n  error?: string;\n  onHeadCellClick?: (column: ColumnDef<TData, TValue>) => void;\n  onBodyRowClick?: (row: Row<TData>, event: MouseEvent) => void;\n}\n\n/**\n * TanStack Table bound to the smwb table components.\n *\n * The connector owns only what the two sides must agree on — row models, the\n * sort affordance in the head cell, the pagination footer, and the loading /\n * error / empty rows. Everything else stays TanStack's: columns are plain\n * `ColumnDef`s and cells are rendered through `flexRender`, so any column\n * definition written against the React connector works here unchanged.\n *\n * `@tanstack/solid-table` is an optional peer: it ships with the connector's\n * subpath only, and a consumer that never imports the subpath never installs it.\n */\nexport function Table<TData extends RowData, TValue = unknown>(\n  props: RtTableProps<TData, TValue>\n): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"data\",\n    \"columns\",\n    \"sortable\",\n    \"defaultSorting\",\n    \"onSortingChange\",\n    \"withPagination\",\n    \"isInfinite\",\n    \"limit\",\n    \"limitOptions\",\n    \"onNextPage\",\n    \"onPrevPage\",\n    \"expandable\",\n    \"getRowCanExpand\",\n    \"renderSubComponent\",\n    \"cellAlign\",\n    \"error\",\n    \"onHeadCellClick\",\n    \"onBodyRowClick\",\n    \"isLoading\",\n  ]);\n\n  const limit = (): number => local.limit ?? 5;\n  const [sorting, setSorting] = createSignal<SortingState>(local.defaultSorting ?? []);\n\n  // Options are a getter object: Solid has no render pass to rebuild them on,\n  // so the table reads current data, columns and sorting on every access.\n  const table = createSolidTable({\n    get data() {\n      return local.data;\n    },\n    get columns() {\n      return local.columns;\n    },\n    state: {\n      get sorting() {\n        return sorting();\n      },\n    },\n    initialState: { pagination: { pageIndex: 0, pageSize: limit() } },\n    manualPagination: local.isInfinite,\n    getCoreRowModel: getCoreRowModel(),\n    onSortingChange: (updater) => {\n      const next = typeof updater === \"function\" ? updater(sorting()) : updater;\n      setSorting(next);\n      local.onSortingChange?.(next);\n    },\n    get getSortedRowModel() {\n      return local.sortable ? getSortedRowModel() : undefined;\n    },\n    get getPaginationRowModel() {\n      return local.withPagination ? getPaginationRowModel() : undefined;\n    },\n    get getExpandedRowModel() {\n      return local.expandable ? getExpandedRowModel() : undefined;\n    },\n    get getRowCanExpand() {\n      return local.expandable ? local.getRowCanExpand : undefined;\n    },\n  } as TableOptions<TData>);\n\n  const pagination = createMemo<TablePaginationProps | undefined>(() => {\n    if (!local.withPagination) return undefined;\n    const state = table.getState().pagination;\n    const base = {\n      limit: state.pageSize,\n      page: state.pageIndex + 1,\n      limitOptions: local.limitOptions ?? [5, 10, 15],\n      onNext: () => {\n        table.nextPage();\n        local.onNextPage?.();\n      },\n      onPrev: () => {\n        table.previousPage();\n        local.onPrevPage?.();\n      },\n      onLimitChange: (value: number) => table.setPageSize(value),\n    };\n    return local.isInfinite\n      ? { ...base, hasNextPage: local.data.length >= state.pageSize }\n      : { ...base, totalCount: table.getFilteredRowModel().rows.length };\n  });\n\n  const columnCount = (): number => table.getVisibleFlatColumns().length || 1;\n\n  // Spread instead of a prop: with exactOptionalPropertyTypes an explicit\n  // `undefined` is not the same as an absent prop, and the footer is absent\n  // whenever pagination is off.\n  const paginationProp = createMemo(() => {\n    const settings = pagination();\n    return settings ? { paginationSettings: settings } : {};\n  });\n\n  const align = (): \"left\" | \"right\" | \"center\" => local.cellAlign ?? \"left\";\n  // A column's controls for its head cell, drawn beside the sort control.\n  const headerActions = (header: Header<TData, unknown>): JSX.Element => {\n    const actions = header.isPlaceholder ? undefined : header.column.columnDef.meta?.headerActions;\n    return actions ? flexRender(actions, header.getContext()) : undefined;\n  };\n  // A body cell's label for the stacked layout: the column's meta.label, or its\n  // header when that is plain text. Without either the cell stays unlabelled: it\n  // takes no label from the head cell's content, which may be a control.\n  const cellLabel = (column: ColumnDef<TData, TValue>): { label: string | false } => {\n    const label = column.meta?.label ?? (typeof column.header === \"string\" ? column.header : undefined);\n    return { label: label || false };\n  };\n\n  return (\n    <SmwbTable\n      {...rest}\n      {...paginationProp()}\n      isLoading={local.isLoading ?? false}\n      // `hovered` is a default: the caller's own wins, and an explicit\n      // undefined keeps it.\n      hovered={rest.hovered ?? !!local.onBodyRowClick}\n    >\n      <TableHead>\n        <For each={table.getHeaderGroups()}>\n          {(headerGroup) => (\n            <TableRow>\n              <For each={headerGroup.headers}>\n                {(header) => {\n                  const canSort = (): boolean => !!local.sortable && header.column.getCanSort();\n                  return (\n                    <TableHeadCell\n                      cellAlign={align()}\n                      sortable={canSort()}\n                      sortDirection={(header.column.getIsSorted() || false) as SortDirection}\n                      onSort={() => {\n                        if (canSort()) header.column.toggleSorting();\n                      }}\n                      onClick={() => {\n                        local.onHeadCellClick?.(header.column.columnDef);\n                      }}\n                      actions={headerActions(header)}\n                      {...(header.getSize() ? { style: { width: `${header.getSize()}px` } } : {})}\n                    >\n                      <Show when={!header.isPlaceholder}>\n                        {flexRender(header.column.columnDef.header, header.getContext())}\n                      </Show>\n                    </TableHeadCell>\n                  );\n                }}\n              </For>\n            </TableRow>\n          )}\n        </For>\n      </TableHead>\n\n      <TableBody>\n        <Show\n          when={!local.isLoading}\n          fallback={\n            <TableRow class=\"smwb-table__loader__row\">\n              <TableCell class=\"smwb-table__loader\" colSpan={columnCount()}>\n                <ProgressIndicator variant=\"circular\" type=\"indeterminate\" />\n              </TableCell>\n            </TableRow>\n          }\n        >\n          <Show\n            when={!local.error}\n            fallback={\n              <TableRow class=\"smwb-table__loader__row\">\n                <TableCell class=\"smwb-table__loader\" colSpan={columnCount()}>\n                  <Message variant=\"filled\" type=\"error\">\n                    {local.error}\n                  </Message>\n                </TableCell>\n              </TableRow>\n            }\n          >\n            <For each={table.getRowModel().rows}>\n              {(row) => (\n                <>\n                  <TableRow onClick={(event: MouseEvent) => local.onBodyRowClick?.(row, event)}>\n                    <For each={row.getVisibleCells()}>\n                      {(cell) => (\n                        <TableCell\n                          cellAlign={align()}\n                          {...cellLabel(cell.column.columnDef as ColumnDef<TData, TValue>)}\n                          {...cell.column.columnDef.meta?.cellProps}\n                        >\n                          {flexRender(cell.column.columnDef.cell, cell.getContext())}\n                        </TableCell>\n                      )}\n                    </For>\n                  </TableRow>\n                  <Show when={row.getIsExpanded() && local.renderSubComponent}>\n                    <TableRow>\n                      <TableCell colSpan={row.getVisibleCells().length}>\n                        {local.renderSubComponent?.({ row })}\n                      </TableCell>\n                    </TableRow>\n                  </Show>\n                </>\n              )}\n            </For>\n          </Show>\n        </Show>\n      </TableBody>\n    </SmwbTable>\n  );\n}\n\nexport default Table;\n"],"mappings":"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","names":[],"file":"table.jsx"}

package/dist/source/index.js

@@ -12,7 +12,9 @@ import { createMediaQuery } from "./primitives/createMediaQuery";
 import { createPersistedJson } from "./primitives/createPersistedJson";
 import { createRovingTabIndex } from "./primitives/createRovingTabIndex";
 import { createHoverPopover } from "./primitives/createHoverPopover";
+import { createKeyboardShortcut } from "./primitives/createKeyboardShortcut";
 import { resolvePlacement, buildFloatingMiddleware, placements } from "./utils/floating";
+import { matchesKeyboardShortcut } from "./utils/keyboardShortcut";
 import { Icon, IconProvider, IconContext, useIconSource, createIconVersion } from "./components/base/icon";
 import {
   registerIcons,
@@ -35,6 +37,10 @@ import { Chip } from "./components/dataDisplay/chip";
 import { LazyImage } from "./components/dataDisplay/lazyImage";
 import { ChipGroup } from "./components/dataDisplay/chipGroup";
 import { Meter, meterColor, DEFAULT_METER_THRESHOLDS } from "./components/dataDisplay/meter";
+import { Kbd, detectKbdPlatform, kbdKeyLabel } from "./components/dataDisplay/kbd";
+import { DiffStat, diffStatCells, diffStatCount, groupDiffStatCount, DEFAULT_DIFF_STAT_FORMAT, DIFF_STAT_CELLS } from "./components/dataDisplay/diffStat";
+import { StatusDot } from "./components/dataDisplay/statusDot";
+import { QrCode } from "./components/dataDisplay/qrCode";
 import { ThumbCard } from "./components/dataDisplay/thumbCard";
 import { AssetGrid } from "./components/dataDisplay/assetGrid";
 import { Avatar, AvatarGroup } from "./components/dataDisplay/avatar";
@@ -57,6 +63,13 @@ import { Timeline, TimelineGroup, TimelineItem } from "./components/dataDisplay/
 import { Carousel } from "./components/dataDisplay/carousel";
 import { ImagesList, ImagesListItem, ImagesListItemModal } from "./components/dataDisplay/imagesList";
 import { Kanban, KanbanColumn, KanbanCard } from "./components/dataDisplay/kanban";
+import { DagView, dagLayout } from "./components/dataDisplay/dagView";
+import {
+  Swimlanes,
+  SWIMLANES_DEFAULT_ROW_HEIGHT,
+  SWIMLANES_DEFAULT_HEIGHT,
+  SWIMLANES_DEFAULT_OVERSCAN
+} from "./components/dataDisplay/swimlanes";
 import {
   Chat,
   ChatLayout,
@@ -117,12 +130,15 @@ import { AppLayout } from "./components/layout/appLayout";
 import { ScreenDivider } from "./components/layout/screenDivider";
 import { Sheet } from "./components/layout/sheet";
 import { FloatingWindow } from "./components/layout/floatingWindow";
+import { TabGroups, tabGroupsLayout } from "./components/layout/tabGroups";
 import { AppBar } from "./components/navigation/appBar";
 import { Breadcrumbs } from "./components/navigation/breadcrumbs";
+import { CommandPalette } from "./components/navigation/commandPalette";
+import { commandPaletteFilter, normalizeSearchText } from "./components/navigation/commandPalette";
 import { Pagination } from "./components/navigation/pagination";
 import { Stepper } from "./components/navigation/stepper";
 import { Sidebar } from "./components/navigation/sidebar";
-import { Tabs, Tab, TabsContext, useTabsContext } from "./components/navigation/tabs";
+import { Tabs, Tab, TabPanel, TabsContext, useTabsContext } from "./components/navigation/tabs";
 import { BottomBar } from "./components/navigation/bottomBar";
 import {
   Menu,
@@ -141,6 +157,7 @@ import { OverflowMenu } from "./components/navigation/overflowMenu";
 import { Button } from "./components/inputs/button";
 import { ButtonGroup } from "./components/inputs/buttonGroups";
 import { Checkbox } from "./components/inputs/checkbox";
+import { Composer } from "./components/inputs/composer";
 import { RadioButton } from "./components/inputs/radioButton";
 import { Toggle } from "./components/inputs/toggle";
 import { Rating } from "./components/inputs/rating";
@@ -224,11 +241,16 @@ export {
   CircularProgress,
   ClickAwayListener,
   Column,
+  CommandPalette,
+  Composer,
   ConfirmDialog,
   Container,
   CountPreview,
+  DEFAULT_DIFF_STAT_FORMAT,
   DEFAULT_METER_THRESHOLDS,
   DEFAULT_TIME_FORMAT,
+  DIFF_STAT_CELLS,
+  DagView,
   DataPickerDays,
   DataPickerHeader,
   DataPickerInput,
@@ -241,6 +263,7 @@ export {
   DateTimePickerInput,
   DescriptionItem,
   DescriptionList,
+  DiffStat,
   Divider,
   DropdownMenu,
   EmptyState,
@@ -259,6 +282,7 @@ export {
   Kanban,
   KanbanCard,
   KanbanColumn,
+  Kbd,
   LazyImage,
   List,
   ListItem,
@@ -284,10 +308,14 @@ export {
   Preview,
   PreviewWrapper,
   ProgressIndicator,
+  QrCode,
   RadioButton,
   Rating,
   Ripple,
   Row,
+  SWIMLANES_DEFAULT_HEIGHT,
+  SWIMLANES_DEFAULT_OVERSCAN,
+  SWIMLANES_DEFAULT_ROW_HEIGHT,
   SaveAssetDialog,
   ScreenDivider,
   SectionHeader,
@@ -301,8 +329,12 @@ export {
   Stack,
   Stat,
   StatGroup,
+  StatusDot,
   Stepper,
+  Swimlanes,
   Tab,
+  TabGroups,
+  TabPanel,
   Table,
   TableBody,
   TableCell,
@@ -332,6 +364,7 @@ export {
   buildFloatingMiddleware,
   buildMenuFloatingMiddleware,
   clearIcons,
+  commandPaletteFilter,
   configureIcons,
   createChatFileUpload,
   createChatInfiniteScroll,
@@ -346,6 +379,7 @@ export {
   createHoverPopover,
   createIconVersion,
   createId,
+  createKeyboardShortcut,
   createMaskedInput,
   createMediaQuery,
   createPersistedJson,
@@ -353,6 +387,10 @@ export {
   createTheme,
   createTimeInput,
   createVirtualList,
+  dagLayout,
+  detectKbdPlatform,
+  diffStatCells,
+  diffStatCount,
   formatChatTimestamp,
   formatDateTimeByPattern,
   getChatLayoutActions,
@@ -361,6 +399,7 @@ export {
   getIcon,
   getIconConfig,
   getIconVersion,
+  groupDiffStatCount,
   hasIcon,
   initialsOf,
   isChatMessageDeliveryStatus,
@@ -368,10 +407,13 @@ export {
   isImageAttachment,
   isImageFile,
   isScrolledToBottom,
+  kbdKeyLabel,
   listIcons,
+  matchesKeyboardShortcut,
   mergeRefs,
   meterColor,
   normalizeIconName,
+  normalizeSearchText,
   parseDateTimeByPattern,
   placements,
   registerIcons,
@@ -385,6 +427,7 @@ export {
   shouldComposerNewlineOnEnter,
   shouldShowChatCloseButton,
   subscribeIcons,
+  tabGroupsLayout,
   unregisterIcons,
   useIconSource,
   useMenuContext,