@smwb/ui-react 2.7.0 → 2.9.0

package/dist/headless/components/dataDisplay/swimlanes/swimlanes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"swimlanes.js","sources":["../../../../../src/components/dataDisplay/swimlanes/swimlanes.tsx"],"sourcesContent":["import React from \"react\";\nimport cn from \"clsx\";\nimport { useControllableState } from \"../../../hooks/useControllableState\";\nimport { useEventCallback } from \"../../../hooks/useEventCallback\";\nimport { useForkRef } from \"../../../hooks/useForkRef\";\nimport { useSafeLayoutEffect } from \"../../../hooks/useSafeLayoutEffect\";\nimport { useVirtualList } from \"../../../hooks/useVirtualList\";\nimport { isOwnClick } from \"../../../utils/ownClick\";\n\nexport interface SwimlanesLane {\n  /** Stable, unique id: keys the row, the selection and the Tab stop. */\n  id: string;\n  /** The lane's header (avatar, name, role); drawn in the fixed left column, role=\"rowheader\". */\n  header: React.ReactNode;\n  /** The lane's content (current item, progress, last signal, budget); role=\"gridcell\". */\n  content: React.ReactNode;\n  /** A disabled lane can be focused but not selected (aria-disabled). */\n  disabled?: boolean | undefined;\n}\n\nexport interface SwimlanesProps extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onSelect\" | \"role\" | \"children\"> {\n  /** The lanes, one row each, in the order they are drawn. */\n  lanes: readonly SwimlanesLane[];\n  /** Accessible name of the grid (aria-label); `aria-labelledby` wins when given. */\n  label?: string | undefined;\n  /** The selected lane's id (controlled); null selects nothing. */\n  selectedId?: string | null | undefined;\n  /** The lane selected at first (uncontrolled). */\n  defaultSelectedId?: string | null | undefined;\n  /** A lane was selected (its id) or the selection was cleared (null). */\n  onSelectedChange?: ((id: string | null) => void) | undefined;\n  /**\n   * Whether lanes can be selected; true by default. False: no aria-selected, no selected look,\n   * and Enter, Space, Escape and a click select nothing; a `selectedId` given anyway is ignored.\n   */\n  selectable?: boolean | undefined;\n  /** Row height in px (every lane is this tall; virtualisation needs a fixed height). 64 by default. */\n  rowHeight?: number | undefined;\n  /** Width of the fixed header column: px or any CSS length; 240px by default from the stylesheet. */\n  headerWidth?: number | string | undefined;\n  /** Narrowest width of the content column; when the grid is narrower, it scrolls sideways. 0 by default. */\n  contentMinWidth?: number | string | undefined;\n  /**\n   * The grid's height (the scroller): a number of pixels or any CSS length; 480\n   * by default, from the stylesheet, so a height in `style` works too.\n   */\n  height?: number | string | undefined;\n  /** Lanes rendered above and below the visible ones. 4 by default. */\n  overscan?: number | undefined;\n  /** Shown instead of the grid when `lanes` is empty. */\n  emptyLabel?: React.ReactNode;\n  /** Test id of the root `<div>`; `swimlanes` unless given. */\n  \"data-testid\"?: string | undefined;\n}\n\n/** Row height in px when `rowHeight` is not given. */\nexport const SWIMLANES_DEFAULT_ROW_HEIGHT = 64;\n/** Height in px the stylesheet gives the grid when neither `height` nor a style in the caller sets one. */\nexport const SWIMLANES_DEFAULT_HEIGHT = 480;\n/** Lanes rendered above and below the visible ones when `overscan` is not given. */\nexport const SWIMLANES_DEFAULT_OVERSCAN = 4;\n\n/** A cell of the grid: its lane and which of the lane's two columns it is. */\ninterface SwimlanesCell {\n  laneId: string;\n  /** 0 is the rowheader, 1 the gridcell. */\n  col: 0 | 1;\n}\n\n/** Where the focus is, or is about to go: a lane's index and column. */\ninterface SwimlanesPosition {\n  index: number;\n  /** 0 is the rowheader, 1 the gridcell. */\n  col: 0 | 1;\n}\n\n/** What can take focus inside a cell's own content. */\nconst INNER_FOCUSABLE =\n  'a[href], button, input, select, textarea, iframe, summary, audio[controls], video[controls], [tabindex], [contenteditable]:not([contenteditable=\"false\"])';\n\nconst cssLength = (value: number | string): string => (typeof value === \"number\" ? `${value}px` : value);\n\nconst sameList = (a: readonly string[], b: readonly string[]): boolean =>\n  a.length === b.length && a.every((value, i) => value === b[i]);\n\n/**\n * Where a key moves the focus, or null when the grid leaves the key alone.\n *\n * The arrows walk the lanes and the columns without wrapping, so at an edge\n * there is nothing to do and the key is not prevented; Home and End stay in the\n * row and Ctrl+Home and Ctrl+End go to the first and last lane (the APG grid\n * model); the page keys move by the rows that fit, less one so a row of context\n * stays on screen. Any other key, and any combination with Ctrl, Cmd or Alt\n * apart from those two, belongs to the browser or to the lane's own content.\n */\nfunction swimlanesKeyTarget(\n  key: string,\n  mods: { ctrlKey: boolean; metaKey: boolean; altKey: boolean },\n  from: SwimlanesPosition,\n  context: { count: number; pageSize: number }\n): SwimlanesPosition | null {\n  const last = context.count - 1;\n  if (last < 0) return null;\n  const clamp = (index: number): number => Math.min(last, Math.max(0, index));\n  // Nothing to do when the move lands where the focus already is.\n  const lane = (index: number): SwimlanesPosition | null => (index === from.index ? null : { index, col: from.col });\n  const column = (col: 0 | 1): SwimlanesPosition | null => (col === from.col ? null : { index: from.index, col });\n\n  if (mods.ctrlKey || mods.metaKey || mods.altKey) {\n    // Ctrl+Home and Ctrl+End are the grid's; the rest are the browser's.\n    if (!mods.ctrlKey || mods.metaKey || mods.altKey) return null;\n    if (key === \"Home\") return lane(0);\n    if (key === \"End\") return lane(last);\n    return null;\n  }\n\n  switch (key) {\n    case \"ArrowDown\":\n      return lane(clamp(from.index + 1));\n    case \"ArrowUp\":\n      return lane(clamp(from.index - 1));\n    case \"ArrowRight\":\n      return column(1);\n    case \"ArrowLeft\":\n      return column(0);\n    case \"Home\":\n      return column(0);\n    case \"End\":\n      return column(1);\n    case \"PageDown\":\n      return lane(clamp(from.index + context.pageSize));\n    case \"PageUp\":\n      return lane(clamp(from.index - context.pageSize));\n    default:\n      return null;\n  }\n}\n\ninterface SwimlanesRowHandlers {\n  onCellClick: (event: React.MouseEvent<HTMLDivElement>, laneId: string, col: 0 | 1) => void;\n  onCellFocus: (event: React.FocusEvent<HTMLDivElement>, laneId: string, col: 0 | 1) => void;\n  registerRow: (laneId: string, element: HTMLElement | null) => void;\n}\n\ninterface SwimlanesRowProps {\n  lane: SwimlanesLane;\n  /** The lane's index in `lanes`: its `aria-rowindex` is one more, and it places the row. */\n  index: number;\n  selected: boolean;\n  /** Whether the rows carry `aria-selected` at all. */\n  selectable: boolean;\n  /** The column of this row that is the grid's one Tab stop, or -1 for neither. */\n  tabCol: number;\n  rowHeight: number;\n  handlers: SwimlanesRowHandlers;\n}\n\n/**\n * One lane: the header cell that stays put and the content cell beside it.\n * Memoised, so a scroll that leaves the window alone costs the grid one shallow\n * render of its own and no row work at all.\n */\nconst SwimlanesRow = React.memo(function SwimlanesRow({\n  lane,\n  index,\n  selected,\n  selectable,\n  tabCol,\n  rowHeight,\n  handlers,\n}: SwimlanesRowProps): React.ReactElement {\n  const cell = (\n    role: \"rowheader\" | \"gridcell\",\n    className: string,\n    col: 0 | 1,\n    content: React.ReactNode\n  ): React.ReactElement => (\n    <div\n      className={className}\n      role={role}\n      tabIndex={tabCol === col ? 0 : -1}\n      onClick={(event) => handlers.onCellClick(event, lane.id, col)}\n      onFocus={(event) => handlers.onCellFocus(event, lane.id, col)}\n    >\n      {content}\n    </div>\n  );\n\n  return (\n    <div\n      className={cn(\"smwb-swimlanes__row\", {\n        \"smwb-swimlanes__row_selected\": selected,\n        \"smwb-swimlanes__row_disabled\": Boolean(lane.disabled),\n      })}\n      role=\"row\"\n      aria-rowindex={index + 1}\n      aria-selected={selectable ? selected : undefined}\n      aria-disabled={lane.disabled ? true : undefined}\n      data-lane-id={lane.id}\n      style={{ top: index * rowHeight }}\n      ref={(element) => {\n        handlers.registerRow(lane.id, element);\n      }}\n    >\n      {cell(\"rowheader\", \"smwb-swimlanes__header\", 0, lane.header)}\n      {cell(\"gridcell\", \"smwb-swimlanes__content\", 1, lane.content)}\n    </div>\n  );\n});\n\nexport const Swimlanes = React.forwardRef<HTMLDivElement, SwimlanesProps>(function Swimlanes(props, ref) {\n  const {\n    className,\n    style,\n    lanes,\n    label,\n    selectedId,\n    defaultSelectedId,\n    onSelectedChange,\n    selectable = true,\n    rowHeight = SWIMLANES_DEFAULT_ROW_HEIGHT,\n    headerWidth,\n    contentMinWidth,\n    height,\n    overscan = SWIMLANES_DEFAULT_OVERSCAN,\n    emptyLabel,\n    onScroll: onScrollProp,\n    onKeyDown: onKeyDownProp,\n    \"data-testid\": dataTestId = \"swimlanes\",\n    ...rest\n  } = props;\n\n  const rootRef = React.useRef<HTMLDivElement | null>(null);\n  const sizerRef = React.useRef<HTMLDivElement | null>(null);\n  const rowsRef = React.useRef(new Map<string, HTMLElement>());\n  const forkedRef = useForkRef(ref, rootRef);\n  const empty = lanes.length === 0;\n\n  // ---- Lanes ----\n\n  const indexById = React.useMemo(() => {\n    const map = new Map<string, number>();\n    lanes.forEach((lane, index) => {\n      if (!map.has(lane.id)) map.set(lane.id, index);\n    });\n    return map;\n  }, [lanes]);\n\n  // A stable identity for the id list, so the removal effect below runs when the\n  // lanes themselves change and not on every render of the caller.\n  const nextIds = React.useMemo(() => [...indexById.keys()], [indexById]);\n  const idsRef = React.useRef(nextIds);\n  if (!sameList(idsRef.current, nextIds)) idsRef.current = nextIds;\n  const ids = idsRef.current;\n\n  // ---- Selection ----\n\n  const [chosen, setSelected] = useControllableState<string | null>({\n    value: selectedId,\n    defaultValue: defaultSelectedId ?? null,\n    onChange: onSelectedChange,\n  });\n  // `selectable={false}` turns the selection off: a `selectedId` given anyway\n  // paints nothing, is not the Tab stop, and Escape has nothing to clear.\n  const selected = selectable ? chosen : null;\n\n  // ---- Focus: one Tab stop, on the last focused cell, else the selected lane, else the first ----\n\n  const [active, setActive] = React.useState<SwimlanesCell | null>(null);\n  const tabStop = React.useMemo<SwimlanesCell | null>(() => {\n    if (active !== null && indexById.has(active.laneId)) return active;\n    if (selected !== null && indexById.has(selected)) return { laneId: selected, col: 0 };\n    const first = ids[0];\n    return first === undefined ? null : { laneId: first, col: 0 };\n  }, [active, selected, indexById, ids]);\n  const tabStopRef = React.useRef(tabStop);\n  tabStopRef.current = tabStop;\n\n  // ---- The window ----\n\n  // The server and the first client render agree: the viewport is estimated\n  // from `height` until a ResizeObserver measures it after mount, and a\n  // measurement of 0 (jsdom, a hidden parent) keeps the estimate.\n  const estimate = typeof height === \"number\" ? height : SWIMLANES_DEFAULT_HEIGHT;\n  const [measured, setMeasured] = React.useState(0);\n  const viewportHeight = measured > 0 ? measured : estimate;\n\n  const virtual = useVirtualList({\n    itemCount: lanes.length,\n    itemHeight: rowHeight,\n    viewportHeight,\n    overscan,\n  });\n\n  // The window, plus the Tab-stop lane when it lies outside: the cell that holds\n  // or will receive focus always exists, so a lane focused and then scrolled\n  // away with the wheel stays mounted, and keeps focus, at its own place.\n  const rendered = React.useMemo(() => {\n    const indexes = new Set<number>();\n    for (let index = virtual.startIndex; index < virtual.endIndex; index++) indexes.add(index);\n    if (tabStop !== null) {\n      const stop = indexById.get(tabStop.laneId);\n      if (stop !== undefined) indexes.add(stop);\n    }\n    return [...indexes].sort((a, b) => a - b);\n  }, [virtual.startIndex, virtual.endIndex, tabStop, indexById]);\n\n  const renderedKey = React.useMemo(() => rendered.map((index) => lanes[index]?.id ?? \"\").join(\"|\"), [rendered, lanes]);\n\n  // ---- Current values for the stable callbacks and effects ----\n\n  const latest = React.useRef({\n    selectable,\n    selected,\n    setSelected,\n    active,\n    viewportHeight,\n    rowHeight,\n    lanes,\n    indexById,\n    onScroll: virtual.onScroll,\n  });\n  latest.current = {\n    selectable,\n    selected,\n    setSelected,\n    active,\n    viewportHeight,\n    rowHeight,\n    lanes,\n    indexById,\n    onScroll: virtual.onScroll,\n  };\n\n  /** The cell that holds or will receive focus. */\n  const cellElement = (laneId: string, col: 0 | 1): HTMLElement | null => {\n    const cell = rowsRef.current.get(laneId)?.children[col];\n    return cell instanceof HTMLElement ? cell : null;\n  };\n\n  /** The cell of this grid a key or a focus event landed in, or null. */\n  const cellOfEvent = (target: EventTarget | null): SwimlanesCell | null => {\n    const root = rootRef.current;\n    const sizer = sizerRef.current;\n    if (root === null || sizer === null || !(target instanceof Element)) return null;\n    const role = target.getAttribute(\"role\");\n    if (role !== \"rowheader\" && role !== \"gridcell\") return null;\n    const col = role === \"rowheader\" ? 0 : 1;\n    // The cell is the row's child, the row the sizer's and the sizer the root's,\n    // so a grid nested in a lane's own content is not this grid's cell. Keys\n    // inside a lane's content belong to that content.\n    const row = target.parentElement;\n    if (row === null || row.parentElement !== sizer || sizer.parentElement !== root) return null;\n    const laneId = row.dataset[\"laneId\"];\n    return laneId === undefined ? null : { laneId, col };\n  };\n\n  // ---- Moving ----\n\n  const pendingFocusRef = React.useRef<SwimlanesCell | null>(null);\n\n  /**\n   * Brings a lane into view and moves the window with it, as SelectField's\n   * virtual options do: the scroller is set and the virtual list is told in the\n   * same pass, so the lane exists by the time it is focused.\n   */\n  const scrollLaneIntoView = (index: number): void => {\n    const root = rootRef.current;\n    if (root === null) return;\n    const { rowHeight: itemHeight, viewportHeight: fallback } = latest.current;\n    // The measured height where the DOM has one; jsdom lays nothing out.\n    const viewport = root.clientHeight || fallback;\n    const top = index * itemHeight;\n    const scrollTop =\n      top < root.scrollTop\n        ? top\n        : top + itemHeight > root.scrollTop + viewport\n          ? top + itemHeight - viewport\n          : root.scrollTop;\n    if (scrollTop === root.scrollTop) return;\n    root.scrollTop = scrollTop;\n    latest.current.onScroll({ currentTarget: { scrollTop } });\n  };\n\n  const moveTo = (index: number, col: 0 | 1): void => {\n    const lane = latest.current.lanes[index];\n    if (lane === undefined) return;\n    scrollLaneIntoView(index);\n    setActive({ laneId: lane.id, col });\n    // After the commit that renders the lane, so the cell is there to focus.\n    pendingFocusRef.current = { laneId: lane.id, col };\n  };\n\n  /** How many lanes a page key moves: the rows that fit, less one for context. */\n  const pageSize = (): number => {\n    const { rowHeight: itemHeight, viewportHeight: fallback } = latest.current;\n    const viewport = rootRef.current?.clientHeight || fallback;\n    return Math.max(1, Math.floor(viewport / itemHeight) - 1);\n  };\n\n  const selectLane = (laneId: string): void => {\n    const { selectable: canSelect, selected: chosen, setSelected: set } = latest.current;\n    if (!canSelect) return;\n    const index = latest.current.indexById.get(laneId);\n    const lane = index === undefined ? undefined : latest.current.lanes[index];\n    if (lane === undefined || lane.disabled) return;\n    // An already selected lane stays selected: no toggle, and nothing is called.\n    if (chosen === laneId) return;\n    set(laneId);\n  };\n\n  const handleCellClick = useEventCallback(\n    (event: React.MouseEvent<HTMLDivElement>, laneId: string, col: 0 | 1): void => {\n      // A click on a control inside the lane (a button, a link) is that control's.\n      if (!isOwnClick(event, event.currentTarget)) return;\n      setActive({ laneId, col });\n      selectLane(laneId);\n    }\n  );\n\n  const handleCellFocus = useEventCallback(\n    (event: React.FocusEvent<HTMLDivElement>, laneId: string, col: 0 | 1): void => {\n      // Focus on the cell, or on a control inside it (a button the pointer\n      // focused), moves the Tab stop here: the lane is then kept in the DOM, and\n      // its controls get their Tab order back, wherever the window scrolls to.\n      // Portalled content bubbles through the React tree, but it is not inside.\n      if (!event.currentTarget.contains(event.target)) return;\n      setActive({ laneId, col });\n    }\n  );\n\n  const registerRow = useEventCallback((laneId: string, element: HTMLElement | null): void => {\n    if (element !== null) rowsRef.current.set(laneId, element);\n    else rowsRef.current.delete(laneId);\n  });\n\n  const rowHandlers = React.useMemo<SwimlanesRowHandlers>(\n    () => ({ onCellClick: handleCellClick, onCellFocus: handleCellFocus, registerRow }),\n    [handleCellClick, handleCellFocus, registerRow]\n  );\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>): void => {\n    onKeyDownProp?.(event);\n    const cell = cellOfEvent(event.target);\n    if (cell === null) return;\n    const { ctrlKey, metaKey, altKey } = event;\n\n    if (!ctrlKey && !metaKey && !altKey) {\n      if (event.key === \"Enter\" || event.key === \" \") {\n        event.preventDefault();\n        selectLane(cell.laneId);\n        return;\n      }\n      if (event.key === \"Escape\") {\n        // Handled only with a selection, so an enclosing dialog still gets it.\n        if (latest.current.selected === null) return;\n        event.preventDefault();\n        latest.current.setSelected(null);\n        return;\n      }\n    }\n\n    const index = latest.current.indexById.get(cell.laneId);\n    if (index === undefined) return;\n    const target = swimlanesKeyTarget(\n      event.key,\n      { ctrlKey, metaKey, altKey },\n      { index, col: cell.col },\n      { count: latest.current.lanes.length, pageSize: pageSize() }\n    );\n    if (target === null) return;\n    event.preventDefault();\n    moveTo(target.index, target.col);\n  };\n\n  const handleScroll = (event: React.UIEvent<HTMLDivElement>): void => {\n    onScrollProp?.(event);\n    virtual.onScroll(event);\n  };\n\n  // ---- Effects ----\n\n  // The measured height replaces the estimate after mount: a normal\n  // post-hydration update, so the server's window and the client's first agree.\n  useSafeLayoutEffect(() => {\n    const root = rootRef.current;\n    if (root === null || typeof ResizeObserver !== \"function\") return;\n    const observer = new ResizeObserver(() => {\n      setMeasured(root.clientHeight);\n    });\n    observer.observe(root);\n    return () => observer.disconnect();\n  }, []);\n\n  // Focus the cell a move asked for once the DOM has it. No dependency list: it\n  // runs after every commit, and there is nothing to do without a pending move.\n  useSafeLayoutEffect(() => {\n    const pending = pendingFocusRef.current;\n    if (pending === null) return;\n    pendingFocusRef.current = null;\n    // Always after the scroll position is set, or the focus scrolls it again.\n    cellElement(pending.laneId, pending.col)?.focus({ preventScroll: true });\n  });\n\n  // A lane that goes away takes its selection with it, and focus moves to the\n  // new Tab stop rather than dropping to the page. Only a lane that was there\n  // counts: a selection given before its lane loads is kept.\n  const previousIdsRef = React.useRef<readonly string[] | null>(null);\n  useSafeLayoutEffect(() => {\n    const before = previousIdsRef.current;\n    previousIdsRef.current = ids;\n    if (before === null || before === ids) return;\n    const present = new Set(ids);\n    const { selected: chosen, setSelected: set, active: had } = latest.current;\n    const cleared = chosen !== null && !present.has(chosen) && before.includes(chosen);\n    if (cleared) set(null);\n    if (had === null || present.has(had.laneId)) return;\n    setActive(null);\n    const doc = rootRef.current?.ownerDocument;\n    if (doc === undefined || (doc.activeElement !== null && doc.activeElement !== doc.body)) return;\n    // The selection is gone with its lane when it was cleared, so fall back to\n    // the first lane; otherwise the selected lane is the new Tab stop.\n    const stop = !cleared && chosen !== null && present.has(chosen) ? chosen : ids[0];\n    if (stop !== undefined) pendingFocusRef.current = { laneId: stop, col: 0 };\n    // The id list's identity changes only when the ids themselves do.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [ids]);\n\n  // ---- One Tab stop for the lanes' own controls ----\n\n  // Focusables inside the cells of every lane but the Tab stop leave the Tab\n  // order; their own tabindex comes back when their lane becomes it. Tab from\n  // the active cell then walks that lane's controls and leaves the grid.\n  const ownTabIndexRef = React.useRef(new WeakMap<Element, string | null>());\n  const appliedTabIndexRef = React.useRef(new WeakMap<Element, string | null>());\n  const syncInnerTabStops = React.useCallback((): void => {\n    const stop = tabStopRef.current?.laneId ?? null;\n    const own = ownTabIndexRef.current;\n    const applied = appliedTabIndexRef.current;\n    for (const [laneId, row] of rowsRef.current) {\n      for (const cell of Array.from(row.children)) {\n        for (const inner of cell.querySelectorAll(INNER_FOCUSABLE)) {\n          if (!own.has(inner)) own.set(inner, inner.getAttribute(\"tabindex\"));\n          // A tabindex that differs from what the component last applied is the\n          // caller's new own value: this sweep runs at commit, before the\n          // MutationObserver microtask sees the write, so adopt it here instead\n          // of writing the stale cached value back over it.\n          if (inner.getAttribute(\"tabindex\") !== (applied.get(inner) ?? null)) {\n            own.set(inner, inner.getAttribute(\"tabindex\"));\n          }\n          const next = laneId === stop ? (own.get(inner) ?? null) : \"-1\";\n          if (inner.getAttribute(\"tabindex\") === next) {\n            applied.set(inner, next);\n            continue;\n          }\n          if (next === null) inner.removeAttribute(\"tabindex\");\n          else inner.setAttribute(\"tabindex\", next);\n          applied.set(inner, next);\n        }\n      }\n    }\n  }, []);\n\n  // Keyed on the Tab stop and on the rendered lanes, so rows mounted later by\n  // scrolling are synced too. Content that changes between those is the\n  // observer's job below.\n  useSafeLayoutEffect(() => {\n    syncInnerTabStops();\n  }, [tabStop, renderedKey, syncInnerTabStops]);\n\n  // Content that changes later (a button that shows up with a status) is caught\n  // too, and a tabindex the app rewrites from its own render becomes the\n  // element's own value instead of being fought. The component's own writes are\n  // recognised by what it last applied. Set up once.\n  useSafeLayoutEffect(() => {\n    const sizer = sizerRef.current;\n    if (sizer === null || typeof MutationObserver !== \"function\") return;\n    const observer = new MutationObserver((mutations) => {\n      const own = ownTabIndexRef.current;\n      const applied = appliedTabIndexRef.current;\n      let sync = false;\n      for (const mutation of mutations) {\n        if (mutation.type !== \"attributes\") {\n          // Added or moved content may carry focusables the sweep has not seen.\n          sync = true;\n          continue;\n        }\n        const element = mutation.target as Element;\n        if (!applied.has(element)) continue;\n        const now = element.getAttribute(\"tabindex\");\n        if (now === (applied.get(element) ?? null)) continue;\n        own.set(element, now);\n        sync = true;\n      }\n      if (sync) syncInnerTabStops();\n    });\n    observer.observe(sizer, {\n      childList: true,\n      subtree: true,\n      attributes: true,\n      attributeFilter: [\"tabindex\"],\n    });\n    return () => observer.disconnect();\n  }, [syncInnerTabStops]);\n\n  // ---- Render ----\n\n  // The component's own attributes, after the caller's, so they win; a key that\n  // is not written at all leaves the caller's value in place.\n  const gridAttributes = empty\n    ? {}\n    : {\n        role: \"grid\" as const,\n        \"aria-rowcount\": lanes.length,\n        \"aria-colcount\": 2,\n        ...(label === undefined ? {} : { \"aria-label\": label }),\n      };\n\n  const rootStyle = React.useMemo((): React.CSSProperties => {\n    // A key is only written when it has a value: no `undefined` reaches the DOM.\n    const own: React.CSSProperties = {};\n    if (height !== undefined) own.height = cssLength(height);\n    const custom = own as Record<string, string>;\n    custom[\"--smwb-swimlanes-row-height\"] = `${rowHeight}px`;\n    if (headerWidth !== undefined) custom[\"--smwb-swimlanes-header-width\"] = cssLength(headerWidth);\n    if (contentMinWidth !== undefined) custom[\"--smwb-swimlanes-content-min-width\"] = cssLength(contentMinWidth);\n    return { ...own, ...style };\n  }, [height, rowHeight, headerWidth, contentMinWidth, style]);\n\n  return (\n    <div\n      {...rest}\n      ref={forkedRef}\n      data-testid={dataTestId}\n      className={cn(\"smwb-swimlanes\", { \"smwb-swimlanes_empty\": empty }, className)}\n      style={rootStyle}\n      {...gridAttributes}\n      onScroll={handleScroll}\n      onKeyDown={handleKeyDown}\n    >\n      {empty ? (\n        // No grid role and no row count: an empty grid has no rows, which fails\n        // the role's required children.\n        <div className=\"smwb-swimlanes__empty\">{emptyLabel}</div>\n      ) : (\n        <div\n          className=\"smwb-swimlanes__sizer\"\n          role=\"presentation\"\n          ref={sizerRef}\n          style={{ height: virtual.totalHeight }}\n        >\n          {rendered.map((index) => {\n            const lane = lanes[index];\n            if (lane === undefined) return null;\n            return (\n              <SwimlanesRow\n                key={lane.id}\n                lane={lane}\n                index={index}\n                selected={selected === lane.id}\n                selectable={selectable}\n                tabCol={tabStop !== null && tabStop.laneId === lane.id ? tabStop.col : -1}\n                rowHeight={rowHeight}\n                handlers={rowHandlers}\n              />\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n});\n\nexport default Swimlanes;\n"],"names":["SWIMLANES_DEFAULT_ROW_HEIGHT","SWIMLANES_DEFAULT_HEIGHT","SWIMLANES_DEFAULT_OVERSCAN","INNER_FOCUSABLE","cssLength","value","sameList","a","b","i","swimlanesKeyTarget","key","mods","from","context","last","clamp","index","lane","column","col","SwimlanesRow","React","selected","selectable","tabCol","rowHeight","handlers","cell","role","className","content","jsx","event","jsxs","cn","element","Swimlanes","props","ref","style","lanes","label","selectedId","defaultSelectedId","onSelectedChange","headerWidth","contentMinWidth","height","overscan","emptyLabel","onScrollProp","onKeyDownProp","dataTestId","rest","rootRef","sizerRef","rowsRef","forkedRef","useForkRef","empty","indexById","map","nextIds","idsRef","ids","chosen","setSelected","useControllableState","active","setActive","tabStop","first","tabStopRef","estimate","measured","setMeasured","viewportHeight","virtual","useVirtualList","rendered","indexes","stop","renderedKey","_b","_a","latest","cellElement","laneId","cellOfEvent","target","root","sizer","row","pendingFocusRef","scrollLaneIntoView","itemHeight","fallback","viewport","top","scrollTop","moveTo","pageSize","selectLane","canSelect","set","handleCellClick","useEventCallback","isOwnClick","handleCellFocus","registerRow","rowHandlers","handleKeyDown","ctrlKey","metaKey","altKey","handleScroll","useSafeLayoutEffect","observer","pending","previousIdsRef","before","present","had","cleared","doc","ownTabIndexRef","appliedTabIndexRef","syncInnerTabStops","own","applied","inner","_c","next","_d","mutations","sync","mutation","now","gridAttributes","rootStyle","custom"],"mappings":"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"}

package/dist/headless/components/dataDisplay/table/table.js

@@ -1,42 +1,46 @@
-import { jsxs as l, jsx as a } from "react/jsx-runtime";
-import { forwardRef as n } from "react";
+import { jsxs as b, jsx as e } from "react/jsx-runtime";
+import { forwardRef as _, useState as p } from "react";
 import r from "clsx";
-import p from "./tablePagination/tablePagination.js";
-const v = n(
-  ({ className: b, dense: t, hovered: o, children: w, paginationSettings: e, isLoading: c, stickyHeader: i, caption: s, stackBelow: m, ..._ }, d) => /* @__PURE__ */ l(
-    "div",
-    {
-      ref: d,
-      className: r(
-        "smwb-table__wrapper",
-        b,
-        {
-          "smwb-table__wrapper_loading": c
-        },
-        m && `smwb-table__wrapper_stack-${m}`
-      ),
-      ..._,
-      children: [
-        /* @__PURE__ */ a("div", { className: r("smwb-table__container", { "smwb-withPagination": !!e }), children: /* @__PURE__ */ l(
-          "table",
+import { ColumnLabels as v, TableLabelsContext as h, TableHeadContext as f, TableRowPlaceContext as x, TableColumnContext as P } from "./tableColumns.js";
+import C from "./tablePagination/tablePagination.js";
+const y = _(
+  ({ className: o, dense: t, hovered: m, children: n, paginationSettings: l, isLoading: i, stickyHeader: d, caption: s, stackBelow: a, ...c }, w) => {
+    const [u] = p(() => new v());
+    return /* @__PURE__ */ b(
+      "div",
+      {
+        ref: w,
+        className: r(
+          "smwb-table__wrapper",
+          o,
           {
-            className: r("smwb-table", {
-              "smwb-dense": t,
-              "smwb-hovered": o,
-              "smwb-table_sticky-header": i
-            }),
-            children: [
-              s != null && /* @__PURE__ */ a("caption", { className: "smwb-table__caption", children: s }),
-              w
-            ]
-          }
-        ) }),
-        !!e && /* @__PURE__ */ a(p, { ...e })
-      ]
-    }
-  )
+            "smwb-table__wrapper_loading": i
+          },
+          a && `smwb-table__wrapper_stack-${a}`
+        ),
+        ...c,
+        children: [
+          /* @__PURE__ */ e("div", { className: r("smwb-table__container", { "smwb-withPagination": !!l }), children: /* @__PURE__ */ b(
+            "table",
+            {
+              className: r("smwb-table", {
+                "smwb-dense": t,
+                "smwb-hovered": m,
+                "smwb-table_sticky-header": d
+              }),
+              children: [
+                s != null && /* @__PURE__ */ e("caption", { className: "smwb-table__caption", children: s }),
+                /* @__PURE__ */ e(h.Provider, { value: a ? u : null, children: /* @__PURE__ */ e(f.Provider, { value: !1, children: /* @__PURE__ */ e(x.Provider, { value: null, children: /* @__PURE__ */ e(P.Provider, { value: null, children: n }) }) }) })
+              ]
+            }
+          ) }),
+          !!l && /* @__PURE__ */ e(C, { ...l })
+        ]
+      }
+    );
+  }
 );
 export {
-  v as default
+  y as default
 };
 //# sourceMappingURL=table.js.map

package/dist/headless/components/dataDisplay/table/table.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.js","sources":["../../../../../src/components/dataDisplay/table/table.tsx"],"sourcesContent":["import { HTMLAttributes, PropsWithChildren, ReactNode, forwardRef } from \"react\";\nimport cn from \"clsx\";\nimport { TablePagination, TablePaginationProps } from \"./index\";\n\nexport interface TableProps extends HTMLAttributes<HTMLDivElement> {\n  className?: string;\n  dense?: boolean;\n  isLoading?: boolean;\n  hovered?: boolean;\n  /** Pins the table header while the body scrolls. */\n  stickyHeader?: boolean;\n  /** Optional accessible caption rendered for screen readers. */\n  caption?: ReactNode;\n  /**\n   * Show each row as a card — cells one under another, each with its column's\n   * label — while the table's container is narrower than this breakpoint:\n   * `sm` (420px), `md` (768px) or `lg` (1024px). A container query: the space\n   * the table has decides, not the window. Labels come from `TableCell label`.\n   */\n  stackBelow?: \"sm\" | \"md\" | \"lg\";\n  paginationSettings?: TablePaginationProps;\n}\n\nconst Table = forwardRef<HTMLDivElement, PropsWithChildren<TableProps>>(\n  (\n    { className, dense, hovered, children, paginationSettings, isLoading, stickyHeader, caption, stackBelow, ...props },\n    ref\n  ) => {\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          \"smwb-table__wrapper\",\n          className,\n          {\n            [\"smwb-table__wrapper_loading\"]: isLoading,\n          },\n          stackBelow && `smwb-table__wrapper_stack-${stackBelow}`\n        )}\n        {...props}\n      >\n        <div className={cn(\"smwb-table__container\", { \"smwb-withPagination\": !!paginationSettings })}>\n          <table\n            className={cn(\"smwb-table\", {\n              \"smwb-dense\": dense,\n              [\"smwb-hovered\"]: hovered,\n              \"smwb-table_sticky-header\": stickyHeader,\n            })}\n          >\n            {caption != null && <caption className=\"smwb-table__caption\">{caption}</caption>}\n            {children}\n          </table>\n        </div>\n        {!!paginationSettings && <TablePagination {...paginationSettings} />}\n      </div>\n    );\n  }\n);\n\nexport default Table;\n"],"names":["Table","forwardRef","className","dense","hovered","children","paginationSettings","isLoading","stickyHeader","caption","stackBelow","props","ref","jsxs","cn","jsx","TablePagination"],"mappings":";;;;AAuBA,MAAMA,IAAQC;AAAA,EACZ,CACE,EAAE,WAAAC,GAAW,OAAAC,GAAO,SAAAC,GAAS,UAAAC,GAAU,oBAAAC,GAAoB,WAAAC,GAAW,cAAAC,GAAc,SAAAC,GAAS,YAAAC,GAAY,GAAGC,EAAA,GAC5GC,MAGE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,WAAWE;AAAA,QACT;AAAA,QACAZ;AAAA,QACA;AAAA,UACG,+BAAgCK;AAAA,QAAA;AAAA,QAEnCG,KAAc,6BAA6BA,CAAU;AAAA,MAAA;AAAA,MAEtD,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAI,EAAC,OAAA,EAAI,WAAWD,EAAG,yBAAyB,EAAE,uBAAuB,CAAC,CAACR,GAAoB,GACzF,UAAA,gBAAAO;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWC,EAAG,cAAc;AAAA,cAC1B,cAAcX;AAAA,cACb,gBAAiBC;AAAA,cAClB,4BAA4BI;AAAA,YAAA,CAC7B;AAAA,YAEA,UAAA;AAAA,cAAAC,KAAW,QAAQ,gBAAAM,EAAC,WAAA,EAAQ,WAAU,uBAAuB,UAAAN,GAAQ;AAAA,cACrEJ;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA,GAEL;AAAA,QACC,CAAC,CAACC,KAAsB,gBAAAS,EAACC,GAAA,EAAiB,GAAGV,EAAA,CAAoB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAI1E;"}
+{"version":3,"file":"table.js","sources":["../../../../../src/components/dataDisplay/table/table.tsx"],"sourcesContent":["import { HTMLAttributes, PropsWithChildren, ReactNode, forwardRef, useState } from \"react\";\nimport cn from \"clsx\";\nimport { TablePagination, TablePaginationProps } from \"./index\";\nimport {\n  ColumnLabels,\n  TableColumnContext,\n  TableHeadContext,\n  TableLabelsContext,\n  TableRowPlaceContext,\n} from \"./tableColumns\";\n\nexport interface TableProps extends HTMLAttributes<HTMLDivElement> {\n  className?: string;\n  dense?: boolean;\n  isLoading?: boolean;\n  hovered?: boolean;\n  /** Pins the table header while the body scrolls. */\n  stickyHeader?: boolean;\n  /** Optional accessible caption rendered for screen readers. */\n  caption?: ReactNode;\n  /**\n   * Show each row as a card — cells one under another, each with its column's\n   * label — while the table's container is narrower than this breakpoint:\n   * `sm` (420px), `md` (768px) or `lg` (1024px). A container query: the space\n   * the table has decides, not the window.\n   *\n   * A cell's label is its `TableCell label`, or else the label of the head cell\n   * of its column: the head cell's `label`, or the text of its content. Columns\n   * count as in HTML: by position in the row, with `colSpan`, after the columns\n   * that `rowSpan` cells of the rows above take in the same head or body. A cell\n   * spanning several columns takes no label from the head and fills the card's\n   * width, and a head cell spanning several columns labels none of them. With\n   * several head rows, the lowest head cell over a column names it.\n   *\n   * The columns come from the elements written: rows written as `TableRow` in\n   * `TableHead` or `TableBody`, and cells in a row (arrays and fragments\n   * included). A component that renders a row counts as a row whose cells span\n   * no rows down, and a component that renders cells counts as one cell, with\n   * its own `colSpan` and `rowSpan`: give the cells after such a component, or\n   * the component's own cells, a `label`.\n   */\n  stackBelow?: \"sm\" | \"md\" | \"lg\";\n  paginationSettings?: TablePaginationProps;\n}\n\nconst Table = forwardRef<HTMLDivElement, PropsWithChildren<TableProps>>(\n  (\n    { className, dense, hovered, children, paginationSettings, isLoading, stickyHeader, caption, stackBelow, ...props },\n    ref\n  ) => {\n    const [labels] = useState(() => new ColumnLabels());\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          \"smwb-table__wrapper\",\n          className,\n          {\n            [\"smwb-table__wrapper_loading\"]: isLoading,\n          },\n          stackBelow && `smwb-table__wrapper_stack-${stackBelow}`\n        )}\n        {...props}\n      >\n        <div className={cn(\"smwb-table__container\", { \"smwb-withPagination\": !!paginationSettings })}>\n          <table\n            className={cn(\"smwb-table\", {\n              \"smwb-dense\": dense,\n              [\"smwb-hovered\"]: hovered,\n              \"smwb-table_sticky-header\": stickyHeader,\n            })}\n          >\n            {caption != null && <caption className=\"smwb-table__caption\">{caption}</caption>}\n            {/* A table inside a cell of another counts its own rows and cells. */}\n            <TableLabelsContext.Provider value={stackBelow ? labels : null}>\n              <TableHeadContext.Provider value={false}>\n                <TableRowPlaceContext.Provider value={null}>\n                  <TableColumnContext.Provider value={null}>{children}</TableColumnContext.Provider>\n                </TableRowPlaceContext.Provider>\n              </TableHeadContext.Provider>\n            </TableLabelsContext.Provider>\n          </table>\n        </div>\n        {!!paginationSettings && <TablePagination {...paginationSettings} />}\n      </div>\n    );\n  }\n);\n\nexport default Table;\n"],"names":["Table","forwardRef","className","dense","hovered","children","paginationSettings","isLoading","stickyHeader","caption","stackBelow","props","ref","labels","useState","ColumnLabels","jsxs","cn","jsx","TableLabelsContext","TableHeadContext","TableRowPlaceContext","TableColumnContext","TablePagination"],"mappings":";;;;;AA6CA,MAAMA,IAAQC;AAAA,EACZ,CACE,EAAE,WAAAC,GAAW,OAAAC,GAAO,SAAAC,GAAS,UAAAC,GAAU,oBAAAC,GAAoB,WAAAC,GAAW,cAAAC,GAAc,SAAAC,GAAS,YAAAC,GAAY,GAAGC,EAAA,GAC5GC,MACG;AACH,UAAM,CAACC,CAAM,IAAIC,EAAS,MAAM,IAAIC,GAAc;AAClD,WACE,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAJ;AAAA,QACA,WAAWK;AAAA,UACT;AAAA,UACAf;AAAA,UACA;AAAA,YACG,+BAAgCK;AAAA,UAAA;AAAA,UAEnCG,KAAc,6BAA6BA,CAAU;AAAA,QAAA;AAAA,QAEtD,GAAGC;AAAA,QAEJ,UAAA;AAAA,UAAA,gBAAAO,EAAC,OAAA,EAAI,WAAWD,EAAG,yBAAyB,EAAE,uBAAuB,CAAC,CAACX,GAAoB,GACzF,UAAA,gBAAAU;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWC,EAAG,cAAc;AAAA,gBAC1B,cAAcd;AAAA,gBACb,gBAAiBC;AAAA,gBAClB,4BAA4BI;AAAA,cAAA,CAC7B;AAAA,cAEA,UAAA;AAAA,gBAAAC,KAAW,QAAQ,gBAAAS,EAAC,WAAA,EAAQ,WAAU,uBAAuB,UAAAT,GAAQ;AAAA,gBAEtE,gBAAAS,EAACC,EAAmB,UAAnB,EAA4B,OAAOT,IAAaG,IAAS,MACxD,UAAA,gBAAAK,EAACE,EAAiB,UAAjB,EAA0B,OAAO,IAChC,UAAA,gBAAAF,EAACG,EAAqB,UAArB,EAA8B,OAAO,MACpC,UAAA,gBAAAH,EAACI,EAAmB,UAAnB,EAA4B,OAAO,MAAO,UAAAjB,EAAA,CAAS,EAAA,CACtD,GACF,EAAA,CACF;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA,GAEJ;AAAA,UACC,CAAC,CAACC,KAAsB,gBAAAY,EAACK,GAAA,EAAiB,GAAGjB,EAAA,CAAoB;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGxE;AACF;"}

package/dist/headless/components/dataDisplay/table/tableBody.js

@@ -1,7 +1,13 @@
-import { jsx as a } from "react/jsx-runtime";
-import e from "clsx";
-const b = ({ children: o, className: t, ...r }) => /* @__PURE__ */ a("tbody", { ...r, className: e("smwb-table__body", t), children: o });
+import { jsx as m } from "react/jsx-runtime";
+import { useContext as a } from "react";
+import l from "clsx";
+import { TableLabelsContext as n, useRowPlaces as b, withRows as c } from "./tableColumns.js";
+import i from "./tableRow.js";
+const x = ({ children: o, className: t, ...e }) => {
+  const r = a(n) != null, s = b();
+  return /* @__PURE__ */ m("tbody", { ...e, className: l("smwb-table__body", t), children: c(o, r, i, s) });
+};
 export {
-  b as default
+  x as default
 };
 //# sourceMappingURL=tableBody.js.map

package/dist/headless/components/dataDisplay/table/tableBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"tableBody.js","sources":["../../../../../src/components/dataDisplay/table/tableBody.tsx"],"sourcesContent":["import React, { HTMLAttributes, PropsWithChildren } from \"react\";\nimport cn from \"clsx\";\n\nexport interface TableBodyProps extends HTMLAttributes<HTMLTableSectionElement> {\n  className?: string;\n}\n\nconst TableBody = ({ children, className, ...props }: PropsWithChildren<TableBodyProps>) => {\n  return (\n    <tbody {...props} className={cn(\"smwb-table__body\", className)}>\n      {children}\n    </tbody>\n  );\n};\n\nexport default TableBody;\n"],"names":["TableBody","children","className","props","jsx","cn"],"mappings":";;AAOA,MAAMA,IAAY,CAAC,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,QAEzC,gBAAAC,EAAC,WAAO,GAAGD,GAAO,WAAWE,EAAG,oBAAoBH,CAAS,GAC1D,UAAAD,GACH;"}
+{"version":3,"file":"tableBody.js","sources":["../../../../../src/components/dataDisplay/table/tableBody.tsx"],"sourcesContent":["import React, { HTMLAttributes, PropsWithChildren, useContext } from \"react\";\nimport cn from \"clsx\";\nimport { TableLabelsContext, useRowPlaces, withRows } from \"./tableColumns\";\nimport TableRow from \"./tableRow\";\n\nexport interface TableBodyProps extends HTMLAttributes<HTMLTableSectionElement> {\n  className?: string;\n}\n\nconst TableBody = ({ children, className, ...props }: PropsWithChildren<TableBodyProps>) => {\n  // In a stacked table each row learns the columns that `rowSpan` cells above\n  // it take, so its cells find their columns' labels.\n  const stacked = useContext(TableLabelsContext) != null;\n  const keep = useRowPlaces();\n  return (\n    <tbody {...props} className={cn(\"smwb-table__body\", className)}>\n      {withRows(children, stacked, TableRow, keep)}\n    </tbody>\n  );\n};\n\nexport default TableBody;\n"],"names":["TableBody","children","className","props","stacked","useContext","TableLabelsContext","keep","useRowPlaces","jsx","cn","withRows","TableRow"],"mappings":";;;;;AASA,MAAMA,IAAY,CAAC,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,QAA+C;AAG1F,QAAMC,IAAUC,EAAWC,CAAkB,KAAK,MAC5CC,IAAOC,EAAA;AACb,SACE,gBAAAC,EAAC,SAAA,EAAO,GAAGN,GAAO,WAAWO,EAAG,oBAAoBR,CAAS,GAC1D,UAAAS,EAASV,GAAUG,GAASQ,GAAUL,CAAI,GAC7C;AAEJ;"}

package/dist/headless/components/dataDisplay/table/tableCell.js

@@ -1,16 +1,23 @@
-import { jsx as r } from "react/jsx-runtime";
-import m from "clsx";
-const c = ({ children: t, cellAlign: e = "left", className: a, label: l, ...o }) => /* @__PURE__ */ r(
-  "td",
-  {
-    ...o,
-    className: m("smwb-table__cell", a),
-    align: e || "left",
-    ...l !== void 0 && { "data-label": l },
-    children: t
-  }
-);
+import { jsx as x } from "react/jsx-runtime";
+import { useContext as n, useSyncExternalStore as C } from "react";
+import S from "clsx";
+import { TableLabelsContext as p, TableColumnContext as v, TableHeadContext as L, cellSpan as T } from "./tableColumns.js";
+const H = () => () => {
+}, j = ({ children: m, cellAlign: i = "left", className: b, label: t, ...e }) => {
+  var d;
+  const o = e["data-label"], a = n(p), l = n(v), u = n(L), s = a != null && l != null && !u && t === void 0 && o === void 0 && T(e.colSpan) === 1, c = () => s ? a.get(l.column) : void 0, f = C(s ? a.subscribe : H, c, c), r = t === !1 ? o : (d = t != null ? t : o) != null ? d : f;
+  return /* @__PURE__ */ x(
+    "td",
+    {
+      ...e,
+      className: S("smwb-table__cell", b),
+      align: i || "left",
+      ...r !== void 0 && { "data-label": r },
+      children: m
+    }
+  );
+};
 export {
-  c as default
+  j as default
 };
 //# sourceMappingURL=tableCell.js.map

package/dist/headless/components/dataDisplay/table/tableCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"tableCell.js","sources":["../../../../../src/components/dataDisplay/table/tableCell.tsx"],"sourcesContent":["import React, { PropsWithChildren, TdHTMLAttributes } from \"react\";\nimport cn from \"clsx\";\n\nexport interface TableCellProps extends TdHTMLAttributes<HTMLTableCellElement> {\n  className?: string;\n  cellAlign?: \"left\" | \"right\" | \"center\";\n  /** The column's name, shown next to the value when the table stacks rows as cards (`Table stackBelow`). */\n  label?: string;\n}\n\nconst TableCell = ({ children, cellAlign = \"left\", className, label, ...props }: PropsWithChildren<TableCellProps>) => {\n  return (\n    <td\n      {...props}\n      className={cn(\"smwb-table__cell\", className)}\n      align={cellAlign || \"left\"}\n      // Only a given label sets data-label: without one, a caller's own\n      // data-label (the way to label cells by hand) must survive, as in Solid.\n      {...(label !== undefined && { \"data-label\": label })}\n    >\n      {children}\n    </td>\n  );\n};\n\nexport default TableCell;\n"],"names":["TableCell","children","cellAlign","className","label","props","jsx","cn"],"mappings":";;AAUA,MAAMA,IAAY,CAAC,EAAE,UAAAC,GAAU,WAAAC,IAAY,QAAQ,WAAAC,GAAW,OAAAC,GAAO,GAAGC,QAEpE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACE,GAAGD;AAAA,IACJ,WAAWE,EAAG,oBAAoBJ,CAAS;AAAA,IAC3C,OAAOD,KAAa;AAAA,IAGnB,GAAIE,MAAU,UAAa,EAAE,cAAcA,EAAA;AAAA,IAE3C,UAAAH;AAAA,EAAA;AAAA;"}
+{"version":3,"file":"tableCell.js","sources":["../../../../../src/components/dataDisplay/table/tableCell.tsx"],"sourcesContent":["import React, { PropsWithChildren, TdHTMLAttributes, useContext, useSyncExternalStore } from \"react\";\nimport cn from \"clsx\";\nimport { TableColumnContext, TableHeadContext, TableLabelsContext, cellSpan } from \"./tableColumns\";\n\nexport interface TableCellProps extends TdHTMLAttributes<HTMLTableCellElement> {\n  className?: string;\n  cellAlign?: \"left\" | \"right\" | \"center\";\n  /**\n   * The column's name, shown next to the value when the table stacks rows as\n   * cards (`Table stackBelow`). Without it, the cell takes the label of its\n   * column's head cell; `false` keeps the cell unlabelled, so it fills the\n   * card's width (an action, a sub-row). A caller's own `data-label` counts as a\n   * given label too.\n   */\n  label?: string | false;\n  /** The cell's label written by hand, as the attribute the stacked layout shows; `label` replaces it. */\n  \"data-label\"?: string;\n}\n\nconst noSubscribe = () => () => {};\n\nconst TableCell = ({ children, cellAlign = \"left\", className, label, ...props }: PropsWithChildren<TableCellProps>) => {\n  const ownDataLabel = props[\"data-label\"];\n  const labels = useContext(TableLabelsContext);\n  const place = useContext(TableColumnContext);\n  const inHead = useContext(TableHeadContext);\n  // Only a body cell of a stacked table, with no label of its own and one column\n  // wide, looks its label up in the head.\n  const fromHead =\n    labels != null &&\n    place != null &&\n    !inHead &&\n    label === undefined &&\n    ownDataLabel === undefined &&\n    cellSpan(props.colSpan) === 1;\n  const read = () => (fromHead ? labels.get(place.column) : undefined);\n  const headLabel = useSyncExternalStore(fromHead ? labels.subscribe : noSubscribe, read, read);\n  const dataLabel = label === false ? ownDataLabel : (label ?? ownDataLabel ?? headLabel);\n\n  return (\n    <td\n      {...props}\n      className={cn(\"smwb-table__cell\", className)}\n      align={cellAlign || \"left\"}\n      // A caller's own data-label (the way to label cells by hand) survives\n      // unless a label replaces it, as in Solid.\n      {...(dataLabel !== undefined && { \"data-label\": dataLabel })}\n    >\n      {children}\n    </td>\n  );\n};\n\nexport default TableCell;\n"],"names":["noSubscribe","TableCell","children","cellAlign","className","label","props","ownDataLabel","labels","useContext","TableLabelsContext","place","TableColumnContext","inHead","TableHeadContext","fromHead","cellSpan","read","headLabel","useSyncExternalStore","dataLabel","_a","jsx","cn"],"mappings":";;;;AAmBA,MAAMA,IAAc,MAAM,MAAM;AAAC,GAE3BC,IAAY,CAAC,EAAE,UAAAC,GAAU,WAAAC,IAAY,QAAQ,WAAAC,GAAW,OAAAC,GAAO,GAAGC,QAA+C;;AACrH,QAAMC,IAAeD,EAAM,YAAY,GACjCE,IAASC,EAAWC,CAAkB,GACtCC,IAAQF,EAAWG,CAAkB,GACrCC,IAASJ,EAAWK,CAAgB,GAGpCC,IACJP,KAAU,QACVG,KAAS,QACT,CAACE,KACDR,MAAU,UACVE,MAAiB,UACjBS,EAASV,EAAM,OAAO,MAAM,GACxBW,IAAO,MAAOF,IAAWP,EAAO,IAAIG,EAAM,MAAM,IAAI,QACpDO,IAAYC,EAAqBJ,IAAWP,EAAO,YAAYR,GAAaiB,GAAMA,CAAI,GACtFG,IAAYf,MAAU,KAAQE,KAAgBc,IAAAhB,KAAA,OAAAA,IAASE,MAAT,OAAAc,IAAyBH;AAE7E,SACE,gBAAAI;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGhB;AAAA,MACJ,WAAWiB,EAAG,oBAAoBnB,CAAS;AAAA,MAC3C,OAAOD,KAAa;AAAA,MAGnB,GAAIiB,MAAc,UAAa,EAAE,cAAcA,EAAA;AAAA,MAE/C,UAAAlB;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/headless/components/dataDisplay/table/tableColumns.js

@@ -0,0 +1,112 @@
+import { jsx as m } from "react/jsx-runtime";
+import { createContext as u, useRef as b, Children as x, isValidElement as p, Fragment as C, cloneElement as y } from "react";
+class j {
+  constructor() {
+    this.labels = /* @__PURE__ */ new Map(), this.listeners = /* @__PURE__ */ new Set(), this.changed = !1, this.subscribe = (t) => (this.listeners.add(t), () => {
+      this.listeners.delete(t);
+    });
+  }
+  get(t) {
+    var r;
+    const e = this.labels.get(t);
+    if (!e) return;
+    let o = -1;
+    for (const s of e.keys()) s > o && (o = s);
+    return (r = e.get(o)) == null ? void 0 : r.label;
+  }
+  set(t, e, o, r) {
+    let s = this.labels.get(t);
+    s || (s = /* @__PURE__ */ new Map(), this.labels.set(t, s));
+    const l = s.get(e);
+    (l == null ? void 0 : l.owner) === o && l.label === r || (s.set(e, { owner: o, label: r }), this.changed = !0);
+  }
+  /** Drops the label of the column's head cell in `row`, unless another head cell has taken that place since. */
+  remove(t, e, o) {
+    var s;
+    const r = this.labels.get(t);
+    ((s = r == null ? void 0 : r.get(e)) == null ? void 0 : s.owner) === o && (r.delete(e), r.size || this.labels.delete(t), this.changed = !0);
+  }
+  notify() {
+    this.changed && (this.changed = !1, this.listeners.forEach((t) => t()));
+  }
+}
+const A = u(null), L = u(!1), k = u(null), P = u(null), M = (n) => Math.max(1, Math.floor(Number(n)) || 1), R = (n) => {
+  if (n === void 0 || n === "") return 1;
+  const t = Math.floor(Number(n));
+  return t === 0 ? 1 / 0 : Math.max(1, t) || 1;
+};
+function w(n, t, e) {
+  let o = 0;
+  return n.map((r) => {
+    var i;
+    for (; ((i = e[o]) != null ? i : 0) > t; ) o++;
+    const s = o, l = M(r.colSpan), c = t + R(r.rowSpan);
+    for (let a = 0; a < l; a++) e[s + a] = c;
+    return o += l, s;
+  });
+}
+const E = (n, t) => n.row === t.row && n.taken.size === t.taken.size && [...n.taken].every((e) => t.taken.has(e)), S = (n, t) => n.column === t.column && n.row === t.row;
+function d(n) {
+  const t = b([]), e = t.current, o = [];
+  return t.current = o, (r, s) => {
+    const l = e[r], c = l !== void 0 && n(l, s) ? l : s;
+    return o[r] = c, c;
+  };
+}
+const N = () => d(E), O = () => d(S);
+function f(n, t) {
+  return x.map(n, (e) => p(e) ? e.type === C ? y(
+    e,
+    void 0,
+    f(e.props.children, t)
+  ) : t(e) : e);
+}
+function v(n) {
+  const t = [];
+  return f(n, (e) => (t.push(e), null)), t;
+}
+function F(n, t, e, o) {
+  const r = [];
+  let s = 0;
+  return f(n, (l) => {
+    let c = null;
+    if (t) {
+      const i = s++;
+      c = o(i, { row: i, taken: new Set(r.flatMap((h, g) => h > i ? [g] : [])) });
+      const a = l.type === e ? v(l.props.children).map(
+        (h) => h.props
+      ) : [];
+      w(a, i, r);
+    }
+    return /* @__PURE__ */ m(P.Provider, { value: c, children: l });
+  });
+}
+function H(n, t, e, o) {
+  var c;
+  const r = (c = e == null ? void 0 : e.row) != null ? c : 0, s = [];
+  e == null || e.taken.forEach((i) => s[i] = r + 1);
+  let l = 0;
+  return f(n, (i) => {
+    const a = t ? o(l++, { column: w([i.props], r, s)[0], row: r }) : null;
+    return /* @__PURE__ */ m(k.Provider, { value: a, children: i });
+  });
+}
+function I(n) {
+  const t = (e) => typeof e == "string" || typeof e == "number" ? String(e) : Array.isArray(e) ? e.map(t).join("") : p(e) ? t(e.props.children) : "";
+  return t(n).replace(/\s+/g, " ").trim();
+}
+export {
+  j as ColumnLabels,
+  k as TableColumnContext,
+  L as TableHeadContext,
+  A as TableLabelsContext,
+  P as TableRowPlaceContext,
+  R as cellRowSpan,
+  M as cellSpan,
+  I as textOf,
+  O as useCellPlaces,
+  N as useRowPlaces,
+  H as withColumns,
+  F as withRows
+};
+//# sourceMappingURL=tableColumns.js.map

package/dist/headless/components/dataDisplay/table/tableColumns.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tableColumns.js","sources":["../../../../../src/components/dataDisplay/table/tableColumns.tsx"],"sourcesContent":["import {\n  Children,\n  ComponentType,\n  Fragment,\n  ReactElement,\n  ReactNode,\n  cloneElement,\n  createContext,\n  isValidElement,\n  useRef,\n} from \"react\";\n\n/**\n * The column labels of a stacked table (`Table stackBelow`): its head cells\n * publish them by column position, and the body cells of each column read them.\n * A column may have a head cell in several head rows; the lowest row's wins,\n * whatever order the cells wrote in, so each label is kept by its head row.\n *\n * Head cells write while they render, so cells rendered after them — the body\n * follows the head in the markup — read the labels in the same pass: on the\n * server too, and while hydrating, so the server markup has them and the client\n * makes the same. A change after that reaches the body cells through `notify`,\n * which head cells call from an effect.\n *\n * A render that never commits (an interrupted transition) leaves what it wrote\n * until the head cell of that row and column writes again. That is the price of\n * labels in the server markup. The next committed render of the head puts the\n * committed labels back in the store, but notifies only if the committed label\n * changed since its last commit: otherwise the body cells show it once they\n * render on their own.\n */\nexport class ColumnLabels {\n  private readonly labels = new Map<number, Map<number, { owner: string; label: string | undefined }>>();\n  private readonly listeners = new Set<() => void>();\n  private changed = false;\n\n  get(column: number): string | undefined {\n    const rows = this.labels.get(column);\n    if (!rows) return undefined;\n    let row = -1;\n    for (const at of rows.keys()) if (at > row) row = at;\n    return rows.get(row)?.label;\n  }\n\n  set(column: number, row: number, owner: string, label: string | undefined): void {\n    let rows = this.labels.get(column);\n    if (!rows) {\n      rows = new Map<number, { owner: string; label: string | undefined }>();\n      this.labels.set(column, rows);\n    }\n    const prev = rows.get(row);\n    if (prev?.owner === owner && prev.label === label) return;\n    rows.set(row, { owner, label });\n    this.changed = true;\n  }\n\n  /** Drops the label of the column's head cell in `row`, unless another head cell has taken that place since. */\n  remove(column: number, row: number, owner: string): void {\n    const rows = this.labels.get(column);\n    if (rows?.get(row)?.owner !== owner) return;\n    rows.delete(row);\n    if (!rows.size) this.labels.delete(column);\n    this.changed = true;\n  }\n\n  notify(): void {\n    if (!this.changed) return;\n    this.changed = false;\n    this.listeners.forEach((listener) => listener());\n  }\n\n  subscribe = (listener: () => void): (() => void) => {\n    this.listeners.add(listener);\n    return () => {\n      this.listeners.delete(listener);\n    };\n  };\n}\n\n/** The column labels of the table around, while it stacks rows (`stackBelow`); null otherwise. */\nexport const TableLabelsContext = createContext<ColumnLabels | null>(null);\n\n/** Whether the cells around are in the table's head. */\nexport const TableHeadContext = createContext(false);\n\n/** Where a cell sits: the column it starts at and its row within the head or body, both from 0. */\nexport interface CellPlace {\n  column: number;\n  row: number;\n}\n\n/** A row's place in its head or body: its index, and the columns that cells of the rows above span into. */\nexport interface RowPlace {\n  row: number;\n  taken: ReadonlySet<number>;\n}\n\n/** The cell's place in a stacked table; null in a table that doesn't stack. */\nexport const TableColumnContext = createContext<CellPlace | null>(null);\n\n/** The row's place in its head or body, in a stacked table; null otherwise or outside a head or body. */\nexport const TableRowPlaceContext = createContext<RowPlace | null>(null);\n\n/** How many columns a cell spans, from its `colSpan`. */\nexport const cellSpan = (colSpan: number | string | undefined): number => Math.max(1, Math.floor(Number(colSpan)) || 1);\n\n/** How many rows a cell spans, from its `rowSpan`: `0` spans the rest of its head or body, as in HTML. */\nexport const cellRowSpan = (rowSpan: number | string | undefined): number => {\n  if (rowSpan === undefined || rowSpan === \"\") return 1;\n  const rows = Math.floor(Number(rowSpan));\n  return rows === 0 ? Infinity : Math.max(1, rows) || 1;\n};\n\ntype SpanProps = { colSpan?: number | string; rowSpan?: number | string };\n\n/**\n * Places a row's cells on the grid of its head or body: each starts at the first\n * column from the left not taken by an earlier cell of the row or by a cell of\n * a row above that spans down into it. `taken[column]` is the row the column is\n * taken until (exclusive); the row's cells are added to it.\n */\nfunction placeRow(cells: SpanProps[], row: number, taken: number[]): number[] {\n  let column = 0;\n  return cells.map((cell) => {\n    while ((taken[column] ?? 0) > row) column++;\n    const at = column;\n    const span = cellSpan(cell.colSpan);\n    const until = row + cellRowSpan(cell.rowSpan);\n    for (let i = 0; i < span; i++) taken[at + i] = until;\n    column += span;\n    return at;\n  });\n}\n\n/** Keeps a place object of the last render while it is equal to this render's. */\nexport type KeepPlace<T> = (index: number, place: T) => T;\n\nconst sameRowPlace = (a: RowPlace, b: RowPlace): boolean =>\n  a.row === b.row && a.taken.size === b.taken.size && [...a.taken].every((column) => b.taken.has(column));\n\nconst sameCellPlace = (a: CellPlace, b: CellPlace): boolean => a.column === b.column && a.row === b.row;\n\n/**\n * The place objects of the last render, kept while equal, so that a row or\n * cell under a memoized parent doesn't render again because its head or body\n * did. The cache holds values only: a render that never commits leaves equal\n * objects, which are as good.\n */\nfunction usePlaces<T>(same: (a: T, b: T) => boolean): KeepPlace<T> {\n  const cache = useRef<T[]>([]);\n  const last = cache.current;\n  const next: T[] = [];\n  cache.current = next;\n  return (index, place) => {\n    const prev = last[index];\n    const kept = prev !== undefined && same(prev, place) ? prev : place;\n    next[index] = kept;\n    return kept;\n  };\n}\n\nexport const useRowPlaces = (): KeepPlace<RowPlace> => usePlaces(sameRowPlace);\nexport const useCellPlaces = (): KeepPlace<CellPlace> => usePlaces(sameCellPlace);\n\n/** Maps a list's elements, the ones in arrays and fragments included, keeping its shape. */\nfunction mapElements(nodes: ReactNode, map: (element: ReactElement) => ReactNode): ReactNode {\n  return Children.map(nodes, (child) => {\n    if (!isValidElement(child)) return child;\n    if (child.type === Fragment) {\n      return cloneElement(\n        child,\n        undefined,\n        mapElements((child as ReactElement<{ children?: ReactNode }>).props.children, map)\n      );\n    }\n    return map(child);\n  });\n}\n\n/** A list's elements, the ones in arrays and fragments included, in order. */\nfunction elementsOf(nodes: ReactNode): ReactElement[] {\n  const list: ReactElement[] = [];\n  mapElements(nodes, (element) => {\n    list.push(element);\n    return null;\n  });\n  return list;\n}\n\n/**\n * Gives each row of a head or body its place, so that its cells start after\n * the columns that `rowSpan` cells of the rows above take. Rows count in the\n * order they are written, the ones in arrays and fragments included. Only the\n * cells of a `rowType` element written there are seen: a component that renders\n * a row counts as a row whose cells span no further down.\n *\n * Every row is wrapped whether or not the table stacks, so a change of\n * `stackBelow` keeps the rows and their state.\n */\nexport function withRows(\n  children: ReactNode,\n  stacked: boolean,\n  rowType: ComponentType<never>,\n  keep: KeepPlace<RowPlace>\n): ReactNode {\n  const taken: number[] = [];\n  let row = 0;\n  return mapElements(children, (element) => {\n    let place: RowPlace | null = null;\n    if (stacked) {\n      const at = row++;\n      place = keep(at, { row: at, taken: new Set(taken.flatMap((until, column) => (until > at ? [column] : []))) });\n      const cells =\n        element.type === rowType\n          ? elementsOf((element as ReactElement<{ children?: ReactNode }>).props.children).map(\n              (cell) => cell.props as SpanProps\n            )\n          : [];\n      placeRow(cells, at, taken);\n    }\n    return <TableRowPlaceContext.Provider value={place}>{element}</TableRowPlaceContext.Provider>;\n  });\n}\n\n/**\n * Gives each cell of a row its place. Cells count in the order they are written,\n * the ones in arrays and fragments included; any other element — a component\n * that renders a cell — counts as one cell, with its own `colSpan` and `rowSpan`.\n * Each cell is wrapped whether or not the table stacks, so a change of\n * `stackBelow` keeps the cells' content and its state.\n */\nexport function withColumns(\n  children: ReactNode,\n  stacked: boolean,\n  place: RowPlace | null,\n  keep: KeepPlace<CellPlace>\n): ReactNode {\n  const row = place?.row ?? 0;\n  const taken: number[] = [];\n  place?.taken.forEach((column) => (taken[column] = row + 1));\n  let index = 0;\n  return mapElements(children, (element) => {\n    const at = stacked ? keep(index++, { column: placeRow([element.props as SpanProps], row, taken)[0], row }) : null;\n    return <TableColumnContext.Provider value={at}>{element}</TableColumnContext.Provider>;\n  });\n}\n\n/**\n * The text of a header's content: its strings and numbers, those inside elements\n * included, with white space collapsed. A component that makes its text itself\n * (a translated message, an icon) gives none: name such a column by\n * `TableHeadCell label`.\n */\nexport function textOf(node: ReactNode): string {\n  const collect = (value: ReactNode): string => {\n    if (typeof value === \"string\" || typeof value === \"number\") return String(value);\n    if (Array.isArray(value)) return value.map(collect).join(\"\");\n    if (isValidElement(value)) return collect((value as ReactElement<{ children?: ReactNode }>).props.children);\n    return \"\";\n  };\n  return collect(node).replace(/\\s+/g, \" \").trim();\n}\n"],"names":["ColumnLabels","listener","column","rows","row","at","_a","owner","label","prev","TableLabelsContext","createContext","TableHeadContext","TableColumnContext","TableRowPlaceContext","cellSpan","colSpan","cellRowSpan","rowSpan","placeRow","cells","taken","cell","span","until","i","sameRowPlace","a","b","sameCellPlace","usePlaces","same","cache","useRef","last","next","index","place","kept","useRowPlaces","useCellPlaces","mapElements","nodes","map","Children","child","isValidElement","Fragment","cloneElement","elementsOf","list","element","withRows","children","stacked","rowType","keep","withColumns","textOf","node","collect","value"],"mappings":"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"}

package/dist/headless/components/dataDisplay/table/tableHead.js

@@ -1,7 +1,13 @@
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as e } from "react/jsx-runtime";
+import { useContext as s } from "react";
 import m from "clsx";
-const d = ({ children: a, className: e, ...t }) => /* @__PURE__ */ r("thead", { ...t, className: m("smwb-table__head", e), children: a });
+import { TableLabelsContext as n, useRowPlaces as c, TableHeadContext as d, withRows as i } from "./tableColumns.js";
+import b from "./tableRow.js";
+const x = ({ children: t, className: o, ...r }) => {
+  const a = s(n) != null, l = c();
+  return /* @__PURE__ */ e("thead", { ...r, className: m("smwb-table__head", o), children: /* @__PURE__ */ e(d.Provider, { value: !0, children: i(t, a, b, l) }) });
+};
 export {
-  d as default
+  x as default
 };
 //# sourceMappingURL=tableHead.js.map

package/dist/headless/components/dataDisplay/table/tableHead.js.map

@@ -1 +1 @@
-{"version":3,"file":"tableHead.js","sources":["../../../../../src/components/dataDisplay/table/tableHead.tsx"],"sourcesContent":["import { HTMLAttributes, PropsWithChildren } from \"react\";\nimport cn from \"clsx\";\n\nexport interface TableHeadProps extends HTMLAttributes<HTMLTableSectionElement> {\n  className?: string;\n}\n\nconst TableHead = ({ children, className, ...props }: PropsWithChildren<TableHeadProps>) => {\n  return (\n    <thead {...props} className={cn(\"smwb-table__head\", className)}>\n      {children}\n    </thead>\n  );\n};\n\nexport default TableHead;\n"],"names":["TableHead","children","className","props","jsx","cn"],"mappings":";;AAOA,MAAMA,IAAY,CAAC,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,QAEzC,gBAAAC,EAAC,WAAO,GAAGD,GAAO,WAAWE,EAAG,oBAAoBH,CAAS,GAC1D,UAAAD,GACH;"}
+{"version":3,"file":"tableHead.js","sources":["../../../../../src/components/dataDisplay/table/tableHead.tsx"],"sourcesContent":["import { HTMLAttributes, PropsWithChildren, useContext } from \"react\";\nimport cn from \"clsx\";\nimport { TableHeadContext, TableLabelsContext, useRowPlaces, withRows } from \"./tableColumns\";\nimport TableRow from \"./tableRow\";\n\nexport interface TableHeadProps extends HTMLAttributes<HTMLTableSectionElement> {\n  className?: string;\n}\n\nconst TableHead = ({ children, className, ...props }: PropsWithChildren<TableHeadProps>) => {\n  // In a stacked table each row learns the columns that `rowSpan` cells above\n  // it take, so its head cells label the columns they stand over.\n  const stacked = useContext(TableLabelsContext) != null;\n  const keep = useRowPlaces();\n  return (\n    <thead {...props} className={cn(\"smwb-table__head\", className)}>\n      <TableHeadContext.Provider value={true}>{withRows(children, stacked, TableRow, keep)}</TableHeadContext.Provider>\n    </thead>\n  );\n};\n\nexport default TableHead;\n"],"names":["TableHead","children","className","props","stacked","useContext","TableLabelsContext","keep","useRowPlaces","jsx","cn","TableHeadContext","withRows","TableRow"],"mappings":";;;;;AASA,MAAMA,IAAY,CAAC,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,QAA+C;AAG1F,QAAMC,IAAUC,EAAWC,CAAkB,KAAK,MAC5CC,IAAOC,EAAA;AACb,SACE,gBAAAC,EAAC,WAAO,GAAGN,GAAO,WAAWO,EAAG,oBAAoBR,CAAS,GAC3D,UAAA,gBAAAO,EAACE,EAAiB,UAAjB,EAA0B,OAAO,IAAO,UAAAC,EAASX,GAAUG,GAASS,GAAUN,CAAI,EAAA,CAAE,EAAA,CACvF;AAEJ;"}

package/dist/headless/components/dataDisplay/table/tableHeadCell.js

@@ -1,78 +1,73 @@
-import { jsx as d, jsxs as p } from "react/jsx-runtime";
-import _ from "clsx";
-import { Icon as w } from "../../base/icon/icon.js";
-const g = [
-  "a[href]",
-  "button",
-  "input",
-  "select",
-  "textarea",
-  "label",
-  "summary",
-  "[tabindex]",
-  "[contenteditable]:not([contenteditable='false'])",
-  ...[
-    "button",
-    "link",
-    "checkbox",
-    "radio",
-    "switch",
-    "textbox",
-    "searchbox",
-    "combobox",
-    "spinbutton",
-    "slider",
-    "menuitem",
-    "menuitemcheckbox",
-    "menuitemradio",
-    "option",
-    "tab"
-  ].map((c) => `[role='${c}']`)
-].join(","), T = ({
-  children: c,
-  className: l,
-  cellAlign: s = "left",
-  isSortedByAsc: m,
-  isSortedByDesc: r,
+import { jsxs as x, jsx as h } from "react/jsx-runtime";
+import { useContext as b, useEffect as k } from "react";
+import N from "clsx";
+import { isOwnClick as T } from "../../../utils/ownClick.js";
+import { Icon as I } from "../../base/icon/icon.js";
+import { useId as H } from "../../../hooks/useId.js";
+import { TableLabelsContext as j, TableColumnContext as D, TableHeadContext as E, cellSpan as K, textOf as L } from "./tableColumns.js";
+function O(t, u, f) {
+  var s, m;
+  const n = b(j), a = b(D), e = b(E), i = n != null && a != null && e && K(u) === 1, l = (s = a == null ? void 0 : a.column) != null ? s : -1, c = (m = a == null ? void 0 : a.row) != null ? m : -1, o = i && f() || void 0;
+  i && n.set(l, c, t, o), k(() => {
+    if (i)
+      return n.set(l, c, t, o), n.notify(), () => {
+        n.remove(l, c, t), n.notify();
+      };
+  }, [n, l, c, t, i, o]);
+}
+const J = ({
+  children: t,
+  className: u,
+  cellAlign: f = "left",
+  isSortedByAsc: n,
+  isSortedByDesc: a,
   sortable: e,
   sortDirection: i,
-  onSort: t,
-  ...u
+  onSort: l,
+  actions: c,
+  label: o,
+  ...s
 }) => {
-  const a = i !== void 0 ? i : m ? "asc" : r ? "desc" : !1, b = e ? a === "asc" ? "ascending" : a === "desc" ? "descending" : "none" : void 0, f = a === "asc" ? "expand_more" : a === "desc" ? "expand_less" : "unfold_more", h = (n) => {
-    n.target === n.currentTarget && e && t && (n.key === "Enter" || n.key === " ") && (n.preventDefault(), t());
-  }, x = (n) => {
-    var o;
-    n.defaultPrevented || ((o = n.target) == null ? void 0 : o.closest(g)) === n.currentTarget && (t == null || t());
-  };
-  return /* @__PURE__ */ d(
+  const m = H();
+  O(m, s.colSpan, () => o != null ? o : L(t));
+  const r = i !== void 0 ? i : n ? "asc" : a ? "desc" : !1, C = e ? r === "asc" ? "ascending" : r === "desc" ? "descending" : "none" : s["aria-sort"], y = r === "asc" ? "expand_more" : r === "desc" ? "expand_less" : "unfold_more", v = (d) => {
+    d.target === d.currentTarget && e && l && (d.key === "Enter" || d.key === " ") && (d.preventDefault(), l());
+  }, g = (d) => {
+    T(d) && (l == null || l());
+  }, _ = `${m}-label`, w = !!c && s["aria-label"] == null && s["aria-labelledby"] == null;
+  return /* @__PURE__ */ x(
     "th",
     {
-      ...u,
-      "aria-sort": b,
-      className: _("smwb-table__cell", "smwb-head-cell", l, {
-        [`smwb-align_${s}`]: !!s,
+      ...s,
+      "aria-labelledby": w ? _ : s["aria-labelledby"],
+      "aria-sort": C,
+      className: N("smwb-table__cell", "smwb-head-cell", u, {
+        [`smwb-align_${f}`]: !!f,
         "smwb-head-cell_sortable": e,
-        "smwb-head-cell_sorted": !!e && a !== !1
+        "smwb-head-cell_sorted": !!e && r !== !1
       }),
-      children: /* @__PURE__ */ p(
-        "span",
-        {
-          className: "smwb-head-cell__content",
-          onClick: e ? x : void 0,
-          onKeyDown: e ? h : void 0,
-          role: e ? "button" : void 0,
-          tabIndex: e ? 0 : void 0,
-          children: [
-            c,
-            e && /* @__PURE__ */ d(w, { className: "smwb-head-cell__icon", name: f, size: 18, weight: 800 })
-          ]
-        }
-      )
+      children: [
+        /* @__PURE__ */ x(
+          "span",
+          {
+            id: w ? _ : void 0,
+            className: "smwb-head-cell__content",
+            onClick: e ? g : void 0,
+            onKeyDown: e ? v : void 0,
+            role: e ? "button" : void 0,
+            tabIndex: e ? 0 : void 0,
+            children: [
+              t,
+              e && /* @__PURE__ */ h(I, { className: "smwb-head-cell__icon", name: y, size: 18, weight: 800 })
+            ]
+          }
+        ),
+        c ? /* @__PURE__ */ h("div", { className: "smwb-head-cell__actions", children: c }) : null
+      ]
     }
   );
 };
 export {
-  T as default
+  J as default
 };
 //# sourceMappingURL=tableHeadCell.js.map