@accelint/design-toolkit 9.13.0 → 10.1.0

package/dist/components/table/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["actionColumn: NonNullable<typeof columnsProp>[number]","Pin"],"sources":["../../../src/components/table/index.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport Kebab from '@accelint/icons/kebab';\nimport Pin from '@accelint/icons/pin';\nimport { useListData } from 'react-stately/useListData';\nimport { useControlledState } from 'react-stately/useControlledState';\nimport {\n  getCoreRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  type OnChangeFn,\n  type PaginationState,\n  type Row,\n  type RowPinningState,\n  type RowSelectionState,\n  useReactTable,\n} from '@tanstack/react-table';\nimport { useCallback, useContext, useMemo, useState } from 'react';\nimport { Button } from '../button';\nimport { Checkbox } from '../checkbox';\nimport { Icon } from '../icon';\nimport { Menu } from '../menu';\nimport { MenuItem } from '../menu/item';\nimport { MenuSeparator } from '../menu/separator';\nimport { MenuTrigger } from '../menu/trigger';\nimport { TableBody } from './body';\nimport { TableContext } from './context';\nimport { TableHeader } from './header';\nimport styles from './styles.module.css';\nimport type { Key } from '@react-types/shared';\nimport type { TableProps } from './types';\n\n// This width is for columns in the table that provide features:\n// - Row count\n// - Row actions kebab\n// - Row selection (checkbox)\n// These columns should not need to grow with table width\nconst META_COLUMN_WIDTH = 32;\n\ntype RowActionsMenuProps<T> = {\n  row: Row<T>;\n  rows: Row<T>[];\n  moveRowsDown: (row: Row<T>, rows: Row<T>[]) => void;\n  moveRowsUp: (row: Row<T>, rows: Row<T>[]) => void;\n};\n\nfunction RowActionsMenu<T>({\n  moveRowsDown,\n  moveRowsUp,\n  row,\n  rows,\n}: RowActionsMenuProps<T>) {\n  const { enableRowActions, persistRowKebabMenu } = useContext(TableContext);\n  const isPinned = !!row.getIsPinned();\n  const hideRowKebab = !persistRowKebabMenu;\n\n  return (\n    enableRowActions && (\n      <div className={clsx(hideRowKebab && styles.hideInRow)}>\n        <MenuTrigger>\n          <Button variant='icon' aria-label={`row ${row.index + 1} actions`}>\n            <Icon>\n              <Kebab />\n            </Icon>\n          </Button>\n          <Menu>\n            <MenuItem onAction={() => row.pin(isPinned ? false : 'top')}>\n              {isPinned ? 'Unpin' : 'Pin'}\n            </MenuItem>\n            <MenuSeparator />\n            <MenuItem\n              onAction={() => moveRowsUp(row, rows)}\n              isDisabled={isPinned || row.index === 0}\n            >\n              Move Up\n            </MenuItem>\n            <MenuItem\n              onAction={() => moveRowsDown(row, rows)}\n              isDisabled={isPinned || row.index === rows.length - 1}\n            >\n              Move Down\n            </MenuItem>\n          </Menu>\n        </MenuTrigger>\n      </div>\n    )\n  );\n}\n\n/**\n * Table - Configurable data table with sorting, selection, and row actions\n *\n * Supports data-driven mode with TanStack column definitions or static mode with subcomponents.\n *\n * @param props - {@link TableProps}\n * @param props.children - Custom children for static mode.\n * @param props.columns - Column definitions for data-driven mode.\n * @param props.data - Data array for data-driven mode.\n * @param props.showCheckbox - Whether to show selection checkboxes.\n * @param props.rowSelection - Initial row selection state.\n * @param props.kebabPosition - Position of row action menu.\n * @param props.persistRowKebabMenu - Keep row kebab menu visible.\n * @param props.persistHeaderKebabMenu - Keep header kebab menu visible.\n * @param props.persistNumerals - Keep row numerals visible.\n * @param props.enableSorting - Enable column sorting.\n * @param props.enableColumnReordering - Enable column reordering.\n * @param props.enableRowActions - Enable row action menu.\n * @param props.manualSorting - Use server-side sorting.\n * @param props.onSortChange - Callback when sort changes.\n * @param props.onColumnReorderChange - Callback when column order changes.\n * @param props.onRowSelectionChange - Callback when row selection changes.\n * @param props.fullWidth - Whether table uses full width.\n * @returns The rendered Table component.\n *\n * @example\n * ```tsx\n * <Table columns={columns} data={rows} enableSorting showCheckbox />\n * ```\n */\nexport function Table<T extends { id: Key }>({\n  children,\n  columns: columnsProp,\n  data: dataProp,\n  showCheckbox,\n  rowSelection: rowSelectionProp,\n  kebabPosition = 'right',\n  persistRowKebabMenu = true,\n  persistHeaderKebabMenu = true,\n  persistNumerals = false,\n  enableSorting = true,\n  enableColumnReordering = true,\n  enableRowActions = true,\n  manualSorting = false,\n  onSortChange,\n  onColumnReorderChange,\n  onRowSelectionChange,\n  fullWidth = false,\n  pageSize,\n  page: pageProp,\n  defaultPage = 1,\n  onPageChange,\n  ...rest\n}: TableProps<T>) {\n  const {\n    items: data,\n    moveAfter,\n    moveBefore,\n  } = useListData({\n    initialItems: dataProp,\n  });\n  const [rowSelection, setRowSelection] = useState<RowSelectionState>(\n    rowSelectionProp ?? {},\n  );\n  const [columnSelection, setColumnSelection] = useState<string | null>(null);\n  const [rowPinning, setRowPinning] = useState<RowPinningState>({\n    top: [],\n    bottom: [],\n  });\n\n  const [currentPage, setCurrentPage] = useControlledState(\n    pageProp,\n    defaultPage,\n    onPageChange,\n  );\n\n  const pagination = useMemo(\n    () =>\n      pageSize != null ? { pageIndex: currentPage - 1, pageSize } : undefined,\n    [currentPage, pageSize],\n  );\n\n  const handlePaginationChange = useCallback<OnChangeFn<PaginationState>>(\n    (updater) => {\n      if (pagination == null) {\n        return;\n      }\n      const next =\n        typeof updater === 'function' ? updater(pagination) : updater;\n      setCurrentPage(next.pageIndex + 1);\n    },\n    [pagination, setCurrentPage],\n  );\n\n  /**\n   * moveUpSelectedRows moves the selected rows up in the table.\n   * It finds the first selected row, determines its index,\n   * and moves it before the previous row if it exists.\n   */\n  const moveRowsUp = useCallback(\n    (row: Row<T>, rows: Row<T>[]) => {\n      const isSelected = rowSelection[row.id];\n      const rowsToMove = isSelected\n        ? rows.filter(({ id }) => rowSelection[id])\n        : [row];\n      const firstRowToMove = rowsToMove[0];\n\n      if (!firstRowToMove || firstRowToMove.index === 0) {\n        return;\n      }\n\n      const prevRowId = rows[firstRowToMove.index - 1]?.id;\n\n      if (!prevRowId) {\n        return;\n      }\n\n      moveBefore(\n        prevRowId,\n        rowsToMove.map(({ id }) => id),\n      );\n    },\n    [rowSelection, moveBefore],\n  );\n\n  /**\n   * moveDownRows moves the selected or active rows down in the table.\n   * It finds the last selected row, determines its index,\n   * and moves it after the next row if it exists.\n   */\n  const moveRowsDown = useCallback(\n    (row: Row<T>, rows: Row<T>[]) => {\n      const isSelected = rowSelection[row.id];\n      const rowsToMove = isSelected\n        ? rows.filter(({ id }) => rowSelection[id])\n        : [row];\n      const lastRowToMove = rowsToMove[rowsToMove.length - 1];\n\n      if (!lastRowToMove || lastRowToMove.index === rows.length - 1) {\n        return;\n      }\n\n      const nextRowId = rows[lastRowToMove.index + 1]?.id;\n\n      if (!nextRowId) {\n        return;\n      }\n\n      moveAfter(\n        nextRowId,\n        rowsToMove.map(({ id }) => id),\n      );\n    },\n    [rowSelection, moveAfter],\n  );\n\n  /**\n   * actionColumn defines the actions available in the kebab menu for each row.\n   * It includes options to move the row up or down in the table.\n   */\n  // biome-ignore lint/correctness/useExhaustiveDependencies: can of worms to fix ticket added\n  const actionColumn: NonNullable<typeof columnsProp>[number] = useMemo(\n    () => ({\n      id: 'kebab',\n      cell: ({ row }) => (\n        <RowActionsMenu\n          moveRowsUp={moveRowsUp}\n          moveRowsDown={moveRowsDown}\n          row={row}\n          rows={getRowModel().rows}\n        />\n      ),\n      size: META_COLUMN_WIDTH,\n    }),\n    [moveRowsUp, moveRowsDown],\n  );\n\n  /**\n   * columns defines the structure of the table.\n   * It includes the action column and optionally a checkbox column.\n   * The kebab menu position can be set to 'left' or 'right'.\n   * If showCheckbox is true, a checkbox column is added.\n   */\n  const columns = useMemo<NonNullable<typeof columnsProp>>(\n    () => [\n      {\n        id: 'numeral',\n        cell: ({ row }) =>\n          row.getIsPinned() ? (\n            <Icon size='small'>\n              <Pin />\n            </Icon>\n          ) : (\n            <span data-testid='numeral'>{row.index + 1}</span>\n          ),\n        size: META_COLUMN_WIDTH,\n      },\n      ...(showCheckbox\n        ? ([\n            {\n              id: 'selection',\n              header: ({ table }) => (\n                <Checkbox\n                  isSelected={table.getIsAllRowsSelected()}\n                  isIndeterminate={table.getIsSomeRowsSelected()}\n                  onChange={table.toggleAllRowsSelected}\n                />\n              ),\n              cell: ({ row }) => (\n                <Checkbox\n                  isSelected={row.getIsSelected()}\n                  isIndeterminate={row.getIsSomeSelected()}\n                  onChange={row.toggleSelected}\n                />\n              ),\n              size: META_COLUMN_WIDTH,\n            },\n          ] satisfies NonNullable<typeof columnsProp>)\n        : []),\n      ...(kebabPosition === 'left' ? [actionColumn] : []),\n      ...(columnsProp ?? []),\n      ...(kebabPosition === 'right' ? [actionColumn] : []),\n    ],\n    [showCheckbox, columnsProp, kebabPosition, actionColumn],\n  );\n\n  const handleSortChange = (\n    columnId: string,\n    sortDirection: 'asc' | 'desc' | null,\n  ) => {\n    onSortChange?.(columnId, sortDirection);\n  };\n\n  const handleColumnReordering = (index: number) => {\n    onColumnReorderChange?.(index);\n  };\n\n  const handleRowSelectionChange = useCallback(\n    (\n      updaterOrValue:\n        | RowSelectionState\n        | ((old: RowSelectionState) => RowSelectionState),\n    ) => {\n      setRowSelection(updaterOrValue);\n      onRowSelectionChange?.(updaterOrValue);\n    },\n    [onRowSelectionChange],\n  );\n\n  const {\n    getHeaderGroups,\n    getTopRows,\n    getCenterRows,\n    getBottomRows,\n    getRowModel,\n    setColumnOrder,\n  } = useReactTable<T>({\n    data,\n    columns,\n    enableSorting,\n    initialState: {\n      columnOrder: columns.map(({ id }) => id ?? ''),\n      rowSelection: rowSelectionProp ?? {},\n    },\n    state: {\n      rowSelection,\n      rowPinning,\n      ...(pagination != null && { pagination }),\n    },\n    getRowId: (row, index) => {\n      // Use the index as the row ID if no unique identifier is available\n      return row.id ? row.id.toString() : index.toString();\n    },\n    enableRowSelection: true,\n    enableRowPinning: true,\n    manualSorting: manualSorting,\n    onRowSelectionChange: handleRowSelectionChange,\n    onRowPinningChange: setRowPinning,\n    onPaginationChange: handlePaginationChange,\n    getCoreRowModel: getCoreRowModel<T>(),\n    getSortedRowModel: getSortedRowModel<T>(),\n    ...(pageSize != null && {\n      getPaginationRowModel: getPaginationRowModel<T>(),\n    }),\n  });\n\n  const moveColumnLeft = useCallback(\n    (oldIndex: number) => {\n      setColumnOrder((order) => {\n        const newColumnOrder = [...order];\n        const newIndex = oldIndex - 1;\n\n        if (newIndex < 0) {\n          return order;\n        }\n\n        [newColumnOrder[oldIndex], newColumnOrder[newIndex]] = [\n          newColumnOrder[newIndex] as string,\n          newColumnOrder[oldIndex] as string,\n        ];\n\n        return newColumnOrder;\n      });\n    },\n    [setColumnOrder],\n  );\n\n  const moveColumnRight = useCallback(\n    (oldIndex: number) => {\n      setColumnOrder((order) => {\n        const newColumnOrder = [...order];\n        const newIndex = oldIndex + 1;\n\n        if (newIndex >= order.length) {\n          return order;\n        }\n\n        [newColumnOrder[oldIndex], newColumnOrder[newIndex]] = [\n          newColumnOrder[newIndex] as string,\n          newColumnOrder[oldIndex] as string,\n        ];\n\n        return newColumnOrder;\n      });\n    },\n    [setColumnOrder],\n  );\n\n  const className = clsx(fullWidth && 'w-full table-fixed', rest.className);\n\n  if (children) {\n    return (\n      <table {...rest} className={className}>\n        {children}\n      </table>\n    );\n  }\n\n  return (\n    <TableContext.Provider\n      value={{\n        persistRowKebabMenu,\n        persistHeaderKebabMenu,\n        persistNumerals,\n        enableSorting,\n        enableColumnReordering,\n        enableRowActions,\n        columnSelection,\n        setColumnSelection,\n        moveColumnLeft,\n        moveColumnRight,\n        manualSorting,\n        handleSortChange,\n        handleColumnReordering,\n      }}\n    >\n      <table {...rest} className={className}>\n        <TableHeader\n          headerGroups={getHeaderGroups()}\n          columnSelection={columnSelection}\n        />\n        <TableBody\n          rows={[...getTopRows(), ...getCenterRows(), ...getBottomRows()]}\n        />\n      </table>\n    </TableContext.Provider>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["unranked: T[]","ordered: T[]","actionColumn: ColumnDef<TableFeatures, T, unknown>","Pin","tableFeatures"],"sources":["../../../src/components/table/index.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport Kebab from '@accelint/icons/kebab';\nimport Pin from '@accelint/icons/pin';\nimport {\n  type ColumnDef,\n  type OnChangeFn,\n  type PaginationState,\n  type Row,\n  type RowData,\n  type RowPinningState,\n  type RowSelectionState,\n  useTable,\n} from '@tanstack/react-table';\nimport { useCallback, useContext, useMemo, useState } from 'react';\nimport { useControlledState } from 'react-stately/useControlledState';\nimport { Button } from '../button';\nimport { Checkbox } from '../checkbox';\nimport { Icon } from '../icon';\nimport { Menu } from '../menu';\nimport { MenuItem } from '../menu/item';\nimport { MenuSeparator } from '../menu/separator';\nimport { MenuTrigger } from '../menu/trigger';\nimport { TableBody } from './body';\nimport { TableContext } from './context';\nimport { tableFeatures } from './features';\nimport { TableHeader } from './header';\nimport styles from './styles.module.css';\nimport type { Key } from '@react-types/shared';\nimport type { TableFeatures } from './features';\nimport type { RowOrderingState } from './row-ordering-feature';\nimport type { TableProps } from './types';\n\n// This width is for columns in the table that provide features:\n// - Row count\n// - Row actions kebab\n// - Row selection (checkbox)\n// These columns should not need to grow with table width\nconst META_COLUMN_WIDTH = 32;\n\ntype RowActionsMenuProps<T extends RowData> = {\n  row: Row<TableFeatures, T>;\n};\n\nfunction RowActionsMenu<T extends RowData>({ row }: RowActionsMenuProps<T>) {\n  const { enableRowActions, persistRowKebabMenu } = useContext(TableContext);\n  const isPinned = !!row.getIsPinned();\n  const hideRowKebab = !persistRowKebabMenu;\n\n  return (\n    enableRowActions && (\n      <div className={clsx(hideRowKebab && styles.hideInRow)}>\n        <MenuTrigger>\n          <Button variant='icon' aria-label={`row ${row.index + 1} actions`}>\n            <Icon>\n              <Kebab />\n            </Icon>\n          </Button>\n          <Menu>\n            <MenuItem onAction={() => row.pin(isPinned ? false : 'top')}>\n              {isPinned ? 'Unpin' : 'Pin'}\n            </MenuItem>\n            <MenuSeparator />\n            <MenuItem\n              onAction={() => row.moveUp()}\n              isDisabled={!row.getCanMoveUp()}\n            >\n              Move Up\n            </MenuItem>\n            <MenuItem\n              onAction={() => row.moveDown()}\n              isDisabled={!row.getCanMoveDown()}\n            >\n              Move Down\n            </MenuItem>\n          </Menu>\n        </MenuTrigger>\n      </div>\n    )\n  );\n}\n\n/**\n * Table - Configurable data table with sorting, selection, and row actions\n *\n * Supports data-driven mode with TanStack column definitions or static mode with subcomponents.\n *\n * @param props - {@link TableProps}\n * @param props.children - Custom children for static mode.\n * @param props.columns - Column definitions for data-driven mode.\n * @param props.data - Data array for data-driven mode.\n * @param props.showCheckbox - Whether to show selection checkboxes.\n * @param props.rowSelection - Initial row selection state.\n * @param props.kebabPosition - Position of row action menu.\n * @param props.persistRowKebabMenu - Keep row kebab menu visible.\n * @param props.persistHeaderKebabMenu - Keep header kebab menu visible.\n * @param props.persistNumerals - Keep row numerals visible.\n * @param props.enableSorting - Enable column sorting.\n * @param props.enableColumnReordering - Enable column reordering.\n * @param props.enableRowActions - Enable row action menu.\n * @param props.manualSorting - Use server-side sorting.\n * @param props.onSortChange - Callback when sort changes.\n * @param props.onColumnReorderChange - Callback when column order changes.\n * @param props.onRowSelectionChange - Callback when row selection changes.\n * @param props.fullWidth - Whether table uses full width.\n * @returns The rendered Table component.\n *\n * @example\n * ```tsx\n * <Table columns={columns} data={rows} enableSorting showCheckbox />\n * ```\n */\nexport function Table<T extends { id: Key }>({\n  children,\n  columns: columnsProp,\n  data: dataProp,\n  showCheckbox,\n  rowSelection: rowSelectionProp,\n  kebabPosition = 'right',\n  persistRowKebabMenu = true,\n  persistHeaderKebabMenu = true,\n  persistNumerals = false,\n  enableSorting = true,\n  enableColumnReordering = true,\n  enableRowActions = true,\n  manualSorting = false,\n  onSortChange,\n  onColumnReorderChange,\n  onRowSelectionChange,\n  fullWidth = false,\n  pageSize,\n  page: pageProp,\n  defaultPage = 1,\n  onPageChange,\n  ...rest\n}: TableProps<T>) {\n  // Only the manual row order is state (owned by the table's\n  // rowOrderingFeature, mirrored here); row content stays owned by the data\n  // prop so external updates (polling, refetch) flow through without remount.\n  const [rowOrdering, setRowOrdering] = useState<RowOrderingState>([]);\n\n  const data = useMemo(() => {\n    const items = dataProp ?? [];\n\n    if (!rowOrdering.length) {\n      return items;\n    }\n\n    // rowOrdering holds positions, not sort keys: place ranked rows straight\n    // into their slot and append the rest in natural order — O(n), no sort\n    const rank = new Map<string, number>();\n    rowOrdering.forEach((id, index) => {\n      rank.set(id, index);\n    });\n\n    const slots = new Array<T | undefined>(rowOrdering.length);\n    const unranked: T[] = [];\n\n    for (const item of items) {\n      const slot = rank.get(String(item.id));\n\n      // duplicate ids fall through to unranked\n      if (slot === undefined || slots[slot] !== undefined) {\n        unranked.push(item);\n      } else {\n        slots[slot] = item;\n      }\n    }\n\n    const ordered: T[] = [];\n\n    // stale ids (rows no longer in data) leave holes; skip them\n    for (const slot of slots) {\n      if (slot !== undefined) {\n        ordered.push(slot);\n      }\n    }\n\n    for (const item of unranked) {\n      ordered.push(item);\n    }\n\n    return ordered;\n  }, [dataProp, rowOrdering]);\n\n  const [rowSelection, setRowSelection] = useState<RowSelectionState>(\n    rowSelectionProp ?? {},\n  );\n  const [columnSelection, setColumnSelection] = useState<string | null>(null);\n  const [rowPinning, setRowPinning] = useState<RowPinningState>({\n    top: [],\n    bottom: [],\n  });\n\n  const [currentPage, setCurrentPage] = useControlledState(\n    pageProp,\n    defaultPage,\n    onPageChange,\n  );\n\n  const pagination = useMemo(\n    () =>\n      pageSize != null ? { pageIndex: currentPage - 1, pageSize } : undefined,\n    [currentPage, pageSize],\n  );\n\n  const handlePaginationChange = useCallback<OnChangeFn<PaginationState>>(\n    (updater) => {\n      if (pagination == null) {\n        return;\n      }\n      const next =\n        typeof updater === 'function' ? updater(pagination) : updater;\n      setCurrentPage(next.pageIndex + 1);\n    },\n    [pagination, setCurrentPage],\n  );\n\n  /**\n   * actionColumn defines the actions available in the kebab menu for each row.\n   * It includes options to move the row up or down in the table. Moves go\n   * through the table's rowOrderingFeature APIs, which are identity-stable, so\n   * this column def never has to be recreated.\n   */\n  const actionColumn: ColumnDef<TableFeatures, T, unknown> = useMemo(\n    () => ({\n      id: 'kebab',\n      cell: ({ row }) => <RowActionsMenu row={row} />,\n      size: META_COLUMN_WIDTH,\n    }),\n    [],\n  );\n\n  /**\n   * columns defines the structure of the table.\n   * It includes the action column and optionally a checkbox column.\n   * The kebab menu position can be set to 'left' or 'right'.\n   * If showCheckbox is true, a checkbox column is added.\n   */\n  const columns = useMemo<ColumnDef<TableFeatures, T, unknown>[]>(\n    () => [\n      {\n        id: 'numeral',\n        cell: ({ row }) =>\n          row.getIsPinned() ? (\n            <Icon size='small'>\n              <Pin />\n            </Icon>\n          ) : (\n            <span data-testid='numeral'>{row.index + 1}</span>\n          ),\n        size: META_COLUMN_WIDTH,\n      },\n      ...(showCheckbox\n        ? ([\n            {\n              id: 'selection',\n              header: ({ table }) => (\n                <Checkbox\n                  isSelected={table.getIsAllRowsSelected()}\n                  // v9: getIsSomeRowsSelected stays true at full selection\n                  isIndeterminate={\n                    table.getIsSomeRowsSelected() &&\n                    !table.getIsAllRowsSelected()\n                  }\n                  onChange={table.toggleAllRowsSelected}\n                />\n              ),\n              cell: ({ row }) => (\n                <Checkbox\n                  isSelected={row.getIsSelected()}\n                  isIndeterminate={row.getIsSomeSelected()}\n                  // v9 row methods are prototype-shared; keep the receiver\n                  onChange={(isSelected) => row.toggleSelected(isSelected)}\n                />\n              ),\n              size: META_COLUMN_WIDTH,\n            },\n          ] satisfies ColumnDef<TableFeatures, T, unknown>[])\n        : []),\n      ...(kebabPosition === 'left' ? [actionColumn] : []),\n      ...(columnsProp ?? []),\n      ...(kebabPosition === 'right' ? [actionColumn] : []),\n    ],\n    [showCheckbox, columnsProp, kebabPosition, actionColumn],\n  );\n\n  const handleSortChange = (\n    columnId: string,\n    sortDirection: 'asc' | 'desc' | null,\n  ) => {\n    onSortChange?.(columnId, sortDirection);\n  };\n\n  const handleColumnReordering = (index: number) => {\n    onColumnReorderChange?.(index);\n  };\n\n  const handleRowSelectionChange = useCallback(\n    (\n      updaterOrValue:\n        | RowSelectionState\n        | ((old: RowSelectionState) => RowSelectionState),\n    ) => {\n      setRowSelection(updaterOrValue);\n      onRowSelectionChange?.(updaterOrValue);\n    },\n    [onRowSelectionChange],\n  );\n\n  const {\n    getHeaderGroups,\n    getTopRows,\n    getCenterRows,\n    getBottomRows,\n    setColumnOrder,\n  } = useTable({\n    features: tableFeatures,\n    data,\n    columns,\n    enableSorting,\n    initialState: {\n      columnOrder: columns.map(({ id }) => id ?? ''),\n      rowSelection: rowSelectionProp ?? {},\n    },\n    state: {\n      rowSelection,\n      rowPinning,\n      rowOrdering,\n      ...(pagination != null && { pagination }),\n    },\n    getRowId: (row, index) => {\n      // Use the index as the row ID if no unique identifier is available\n      return row.id ? row.id.toString() : index.toString();\n    },\n    enableRowSelection: true,\n    enableRowPinning: true,\n    manualSorting: manualSorting,\n    // no pageSize → paginated row model passes rows through untouched\n    manualPagination: pagination == null,\n    onRowSelectionChange: handleRowSelectionChange,\n    onRowPinningChange: setRowPinning,\n    onRowOrderingChange: setRowOrdering,\n    onPaginationChange: handlePaginationChange,\n  });\n\n  const moveColumnLeft = useCallback(\n    (oldIndex: number) => {\n      setColumnOrder((order) => {\n        const newColumnOrder = [...order];\n        const newIndex = oldIndex - 1;\n\n        if (newIndex < 0) {\n          return order;\n        }\n\n        [newColumnOrder[oldIndex], newColumnOrder[newIndex]] = [\n          newColumnOrder[newIndex] as string,\n          newColumnOrder[oldIndex] as string,\n        ];\n\n        return newColumnOrder;\n      });\n    },\n    [setColumnOrder],\n  );\n\n  const moveColumnRight = useCallback(\n    (oldIndex: number) => {\n      setColumnOrder((order) => {\n        const newColumnOrder = [...order];\n        const newIndex = oldIndex + 1;\n\n        if (newIndex >= order.length) {\n          return order;\n        }\n\n        [newColumnOrder[oldIndex], newColumnOrder[newIndex]] = [\n          newColumnOrder[newIndex] as string,\n          newColumnOrder[oldIndex] as string,\n        ];\n\n        return newColumnOrder;\n      });\n    },\n    [setColumnOrder],\n  );\n\n  const className = clsx(fullWidth && 'w-full table-fixed', rest.className);\n\n  if (children) {\n    return (\n      <table {...rest} className={className}>\n        {children}\n      </table>\n    );\n  }\n\n  return (\n    <TableContext.Provider\n      value={{\n        persistRowKebabMenu,\n        persistHeaderKebabMenu,\n        persistNumerals,\n        enableSorting,\n        enableColumnReordering,\n        enableRowActions,\n        columnSelection,\n        setColumnSelection,\n        moveColumnLeft,\n        moveColumnRight,\n        manualSorting,\n        handleSortChange,\n        handleColumnReordering,\n      }}\n    >\n      <table {...rest} className={className}>\n        <TableHeader\n          headerGroups={getHeaderGroups()}\n          columnSelection={columnSelection}\n        />\n        <TableBody\n          rows={[...getTopRows(), ...getCenterRows(), ...getBottomRows()]}\n        />\n      </table>\n    </TableContext.Provider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDA,MAAM,oBAAoB;AAM1B,SAAS,eAAkC,EAAE,OAA+B;CAC1E,MAAM,EAAE,kBAAkB,wBAAwB,WAAW,aAAa;CAC1E,MAAM,WAAW,CAAC,CAAC,IAAI,aAAa;AAGpC,QACE,oBACE,oBAAC;EAAI,WAAW,KAJC,CAAC,uBAImB,OAAO,UAAU;YACpD,qBAAC,0BACC,oBAAC;GAAO,SAAQ;GAAO,cAAY,OAAO,IAAI,QAAQ,EAAE;aACtD,oBAAC,kBACC,oBAAC,UAAQ,GACJ;IACA,EACT,qBAAC;GACC,oBAAC;IAAS,gBAAgB,IAAI,IAAI,WAAW,QAAQ,MAAM;cACxD,WAAW,UAAU;KACb;GACX,oBAAC,kBAAgB;GACjB,oBAAC;IACC,gBAAgB,IAAI,QAAQ;IAC5B,YAAY,CAAC,IAAI,cAAc;cAChC;KAEU;GACX,oBAAC;IACC,gBAAgB,IAAI,UAAU;IAC9B,YAAY,CAAC,IAAI,gBAAgB;cAClC;KAEU;MACN,IACK;GACV;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCZ,SAAgB,MAA6B,EAC3C,UACA,SAAS,aACT,MAAM,UACN,cACA,cAAc,kBACd,gBAAgB,SAChB,sBAAsB,MACtB,yBAAyB,MACzB,kBAAkB,OAClB,gBAAgB,MAChB,yBAAyB,MACzB,mBAAmB,MACnB,gBAAgB,OAChB,cACA,uBACA,sBACA,YAAY,OACZ,UACA,MAAM,UACN,cAAc,GACd,cACA,GAAG,QACa;CAIhB,MAAM,CAAC,aAAa,kBAAkB,SAA2B,EAAE,CAAC;CAEpE,MAAM,OAAO,cAAc;EACzB,MAAM,QAAQ,YAAY,EAAE;AAE5B,MAAI,CAAC,YAAY,OACf,QAAO;EAKT,MAAM,uBAAO,IAAI,KAAqB;AACtC,cAAY,SAAS,IAAI,UAAU;AACjC,QAAK,IAAI,IAAI,MAAM;IACnB;EAEF,MAAM,QAAQ,IAAI,MAAqB,YAAY,OAAO;EAC1D,MAAMA,WAAgB,EAAE;AAExB,OAAK,MAAM,QAAQ,OAAO;GACxB,MAAM,OAAO,KAAK,IAAI,OAAO,KAAK,GAAG,CAAC;AAGtC,OAAI,SAAS,UAAa,MAAM,UAAU,OACxC,UAAS,KAAK,KAAK;OAEnB,OAAM,QAAQ;;EAIlB,MAAMC,UAAe,EAAE;AAGvB,OAAK,MAAM,QAAQ,MACjB,KAAI,SAAS,OACX,SAAQ,KAAK,KAAK;AAItB,OAAK,MAAM,QAAQ,SACjB,SAAQ,KAAK,KAAK;AAGpB,SAAO;IACN,CAAC,UAAU,YAAY,CAAC;CAE3B,MAAM,CAAC,cAAc,mBAAmB,SACtC,oBAAoB,EAAE,CACvB;CACD,MAAM,CAAC,iBAAiB,sBAAsB,SAAwB,KAAK;CAC3E,MAAM,CAAC,YAAY,iBAAiB,SAA0B;EAC5D,KAAK,EAAE;EACP,QAAQ,EAAE;EACX,CAAC;CAEF,MAAM,CAAC,aAAa,kBAAkB,mBACpC,UACA,aACA,aACD;CAED,MAAM,aAAa,cAEf,YAAY,OAAO;EAAE,WAAW,cAAc;EAAG;EAAU,GAAG,QAChE,CAAC,aAAa,SAAS,CACxB;CAED,MAAM,yBAAyB,aAC5B,YAAY;AACX,MAAI,cAAc,KAChB;AAIF,kBADE,OAAO,YAAY,aAAa,QAAQ,WAAW,GAAG,SACpC,YAAY,EAAE;IAEpC,CAAC,YAAY,eAAe,CAC7B;;;;;;;CAQD,MAAMC,eAAqD,eAClD;EACL,IAAI;EACJ,OAAO,EAAE,UAAU,oBAAC,kBAAoB,MAAO;EAC/C,MAAM;EACP,GACD,EAAE,CACH;;;;;;;CAQD,MAAM,UAAU,cACR;EACJ;GACE,IAAI;GACJ,OAAO,EAAE,UACP,IAAI,aAAa,GACf,oBAAC;IAAK,MAAK;cACT,oBAACC,YAAM;KACF,GAEP,oBAAC;IAAK,eAAY;cAAW,IAAI,QAAQ;KAAS;GAEtD,MAAM;GACP;EACD,GAAI,eACC,CACC;GACE,IAAI;GACJ,SAAS,EAAE,YACT,oBAAC;IACC,YAAY,MAAM,sBAAsB;IAExC,iBACE,MAAM,uBAAuB,IAC7B,CAAC,MAAM,sBAAsB;IAE/B,UAAU,MAAM;KAChB;GAEJ,OAAO,EAAE,UACP,oBAAC;IACC,YAAY,IAAI,eAAe;IAC/B,iBAAiB,IAAI,mBAAmB;IAExC,WAAW,eAAe,IAAI,eAAe,WAAW;KACxD;GAEJ,MAAM;GACP,CACF,GACD,EAAE;EACN,GAAI,kBAAkB,SAAS,CAAC,aAAa,GAAG,EAAE;EAClD,GAAI,eAAe,EAAE;EACrB,GAAI,kBAAkB,UAAU,CAAC,aAAa,GAAG,EAAE;EACpD,EACD;EAAC;EAAc;EAAa;EAAe;EAAa,CACzD;CAED,MAAM,oBACJ,UACA,kBACG;AACH,iBAAe,UAAU,cAAc;;CAGzC,MAAM,0BAA0B,UAAkB;AAChD,0BAAwB,MAAM;;CAGhC,MAAM,2BAA2B,aAE7B,mBAGG;AACH,kBAAgB,eAAe;AAC/B,yBAAuB,eAAe;IAExC,CAAC,qBAAqB,CACvB;CAED,MAAM,EACJ,iBACA,YACA,eACA,eACA,mBACE,SAAS;EACX,UAAUC;EACV;EACA;EACA;EACA,cAAc;GACZ,aAAa,QAAQ,KAAK,EAAE,SAAS,MAAM,GAAG;GAC9C,cAAc,oBAAoB,EAAE;GACrC;EACD,OAAO;GACL;GACA;GACA;GACA,GAAI,cAAc,QAAQ,EAAE,YAAY;GACzC;EACD,WAAW,KAAK,UAAU;AAExB,UAAO,IAAI,KAAK,IAAI,GAAG,UAAU,GAAG,MAAM,UAAU;;EAEtD,oBAAoB;EACpB,kBAAkB;EACH;EAEf,kBAAkB,cAAc;EAChC,sBAAsB;EACtB,oBAAoB;EACpB,qBAAqB;EACrB,oBAAoB;EACrB,CAAC;CAEF,MAAM,iBAAiB,aACpB,aAAqB;AACpB,kBAAgB,UAAU;GACxB,MAAM,iBAAiB,CAAC,GAAG,MAAM;GACjC,MAAM,WAAW,WAAW;AAE5B,OAAI,WAAW,EACb,QAAO;AAGT,IAAC,eAAe,WAAW,eAAe,aAAa,CACrD,eAAe,WACf,eAAe,UAChB;AAED,UAAO;IACP;IAEJ,CAAC,eAAe,CACjB;CAED,MAAM,kBAAkB,aACrB,aAAqB;AACpB,kBAAgB,UAAU;GACxB,MAAM,iBAAiB,CAAC,GAAG,MAAM;GACjC,MAAM,WAAW,WAAW;AAE5B,OAAI,YAAY,MAAM,OACpB,QAAO;AAGT,IAAC,eAAe,WAAW,eAAe,aAAa,CACrD,eAAe,WACf,eAAe,UAChB;AAED,UAAO;IACP;IAEJ,CAAC,eAAe,CACjB;CAED,MAAM,YAAY,KAAK,aAAa,sBAAsB,KAAK,UAAU;AAEzE,KAAI,SACF,QACE,oBAAC;EAAM,GAAI;EAAiB;EACzB;GACK;AAIZ,QACE,oBAAC,aAAa;EACZ,OAAO;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD;YAED,qBAAC;GAAM,GAAI;GAAiB;cAC1B,oBAAC;IACC,cAAc,iBAAiB;IACd;KACjB,EACF,oBAAC,aACC,MAAM;IAAC,GAAG,YAAY;IAAE,GAAG,eAAe;IAAE,GAAG,eAAe;IAAC,GAC/D;IACI;GACc"}

package/dist/components/table/row-ordering-feature.d.ts

@@ -0,0 +1,88 @@
+/*
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+import { OnChangeFn, RowData, TableFeature, TableFeatures, Updater } from "@tanstack/react-table";
+
+//#region src/components/table/row-ordering-feature.d.ts
+/**
+ * Manual row order as row ids in display order. Empty means natural
+ * (data-prop) order. Consumers own applying the order to their data; the
+ * feature owns the state and the move semantics.
+ */
+type RowOrderingState = string[];
+interface RowOrderingTableState {
+  rowOrdering: RowOrderingState;
+}
+interface RowOrderingTableOptions {
+  /**
+   * Callback fired when the manual row order changes.
+   */
+  onRowOrderingChange?: OnChangeFn<RowOrderingState>;
+}
+interface RowOrderingTableApis {
+  /**
+   * Updates the manual row order state. The absolute write door: resets
+   * (`setRowOrdering([])`) and bulk reorders (drag and drop) go through here.
+   */
+  setRowOrdering: (updater: Updater<RowOrderingState>) => void;
+}
+interface RowOrderingRowApis {
+  /**
+   * Moves this row — or every selected row when this row is selected — up one
+   * place in display order, past the nearest unpinned row.
+   */
+  moveUp: () => void;
+  /**
+   * Moves this row — or every selected row when this row is selected — down
+   * one place in display order, past the nearest unpinned row.
+   */
+  moveDown: () => void;
+  /**
+   * Whether an unpinned row exists above to move past. False when this row is
+   * pinned.
+   */
+  getCanMoveUp: () => boolean;
+  /**
+   * Whether an unpinned row exists below to move past. False when this row is
+   * pinned.
+   */
+  getCanMoveDown: () => boolean;
+}
+declare module '@tanstack/react-table' {
+  interface Plugins {
+    rowOrderingFeature?: TableFeature;
+  }
+  interface TableState_FeatureMap {
+    rowOrderingFeature: RowOrderingTableState;
+  }
+  interface TableOptions_FeatureMap<TFeatures extends TableFeatures, TData extends RowData> {
+    rowOrderingFeature: RowOrderingTableOptions;
+  }
+  interface Table_FeatureMap<TFeatures extends TableFeatures, TData extends RowData> {
+    rowOrderingFeature: RowOrderingTableApis;
+  }
+  interface Row_FeatureMap<TFeatures extends TableFeatures, TData extends RowData> {
+    rowOrderingFeature: RowOrderingRowApis;
+  }
+}
+/**
+ * TanStack Table custom feature adding manual row ordering: a `rowOrdering`
+ * state slice (row ids in display order), a `table.setRowOrdering` state
+ * setter, and `row.moveUp()` / `row.moveDown()` row APIs.
+ *
+ * Feature APIs have stable identities, so column defs can call them without
+ * capturing component-scope callbacks.
+ */
+declare const rowOrderingFeature: TableFeature;
+//#endregion
+export { RowOrderingRowApis, RowOrderingState, RowOrderingTableApis, RowOrderingTableOptions, RowOrderingTableState, rowOrderingFeature };
+//# sourceMappingURL=row-ordering-feature.d.ts.map

package/dist/components/table/row-ordering-feature.js

@@ -0,0 +1,115 @@
+/*
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+
+import { assignPrototypeAPIs, assignTableAPIs, makeStateUpdater } from "@tanstack/react-table";
+
+//#region src/components/table/row-ordering-feature.ts
+function tableSetRowOrdering(table, updater) {
+	table.options.onRowOrderingChange?.(updater);
+}
+/**
+* Captures the current base order by id, extracts the moving rows, and
+* reinserts them next to the target row.
+*/
+function tableMoveRows(table, ids, targetId, position) {
+	const moving = new Set(ids);
+	const remaining = table.getCoreRowModel().rows.reduce((acc, row) => {
+		if (!moving.has(row.id)) acc.push(row.id);
+		return acc;
+	}, []);
+	const targetIndex = remaining.indexOf(targetId);
+	if (targetIndex === -1) return;
+	const insertAt = position === "before" ? targetIndex : targetIndex + 1;
+	remaining.splice(insertAt, 0, ...ids);
+	tableSetRowOrdering(table, remaining);
+}
+function isPinnedRow(row) {
+	return Boolean(row.getIsPinned?.());
+}
+/**
+* Nearest unpinned row scanning outward from fromIndex. Pinned rows render in
+* their own regions, so they are not part of the orderable sequence — moving
+* relative to one has no visible effect.
+*/
+function findUnpinnedNeighbor(rows, fromIndex, direction) {
+	for (let index = fromIndex + direction; index >= 0 && index < rows.length; index += direction) {
+		const candidate = rows[index];
+		if (candidate && !isPinnedRow(candidate)) return candidate;
+	}
+}
+function rowGetCanMoveUp(table, row) {
+	return !isPinnedRow(row) && findUnpinnedNeighbor(table.getRowModel().rows, row.index, -1) !== void 0;
+}
+function rowGetCanMoveDown(table, row) {
+	return !isPinnedRow(row) && findUnpinnedNeighbor(table.getRowModel().rows, row.index, 1) !== void 0;
+}
+/**
+* Gathers the rows a move applies to: every selected row when the acted-on
+* row is selected, otherwise just the acted-on row.
+*/
+function getRowsToMove(table, row) {
+	const rows = table.getRowModel().rows;
+	const selection = table.atoms.rowSelection?.get() ?? {};
+	return {
+		rows,
+		rowsToMove: selection[row.id] ? rows.filter(({ id }) => selection[id]) : [row]
+	};
+}
+function tableMoveRowsUp(table, row) {
+	if (isPinnedRow(row)) return;
+	const { rows, rowsToMove } = getRowsToMove(table, row);
+	const firstRowToMove = rowsToMove[0];
+	if (!firstRowToMove) return;
+	const target = findUnpinnedNeighbor(rows, firstRowToMove.index, -1);
+	if (!target) return;
+	tableMoveRows(table, rowsToMove.map(({ id }) => id), target.id, "before");
+}
+function tableMoveRowsDown(table, row) {
+	if (isPinnedRow(row)) return;
+	const { rows, rowsToMove } = getRowsToMove(table, row);
+	const lastRowToMove = rowsToMove[rowsToMove.length - 1];
+	if (!lastRowToMove) return;
+	const target = findUnpinnedNeighbor(rows, lastRowToMove.index, 1);
+	if (!target) return;
+	tableMoveRows(table, rowsToMove.map(({ id }) => id), target.id, "after");
+}
+/**
+* TanStack Table custom feature adding manual row ordering: a `rowOrdering`
+* state slice (row ids in display order), a `table.setRowOrdering` state
+* setter, and `row.moveUp()` / `row.moveDown()` row APIs.
+*
+* Feature APIs have stable identities, so column defs can call them without
+* capturing component-scope callbacks.
+*/
+const rowOrderingFeature = {
+	getInitialState: (initialState) => ({
+		...initialState,
+		rowOrdering: initialState.rowOrdering ?? []
+	}),
+	getDefaultTableOptions: (table) => ({ onRowOrderingChange: makeStateUpdater("rowOrdering", table) }),
+	constructTableAPIs: (table) => {
+		assignTableAPIs("rowOrderingFeature", table, { table_setRowOrdering: { fn: (updater) => tableSetRowOrdering(table, updater) } });
+	},
+	assignRowPrototype: (prototype, table) => {
+		assignPrototypeAPIs("rowOrderingFeature", prototype, table, {
+			row_moveUp: { fn: (row) => tableMoveRowsUp(table, row) },
+			row_moveDown: { fn: (row) => tableMoveRowsDown(table, row) },
+			row_getCanMoveUp: { fn: (row) => rowGetCanMoveUp(table, row) },
+			row_getCanMoveDown: { fn: (row) => rowGetCanMoveDown(table, row) }
+		});
+	}
+};
+
+//#endregion
+export { rowOrderingFeature };
+//# sourceMappingURL=row-ordering-feature.js.map

package/dist/components/table/row-ordering-feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"row-ordering-feature.js","names":["rowOrderingFeature: TableFeature"],"sources":["../../../src/components/table/row-ordering-feature.ts"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  assignPrototypeAPIs,\n  assignTableAPIs,\n  makeStateUpdater,\n} from '@tanstack/react-table';\nimport type {\n  OnChangeFn,\n  Row,\n  RowData,\n  RowSelectionState,\n  Table,\n  TableFeature,\n  TableFeatures,\n  Updater,\n} from '@tanstack/react-table';\n\n/**\n * Manual row order as row ids in display order. Empty means natural\n * (data-prop) order. Consumers own applying the order to their data; the\n * feature owns the state and the move semantics.\n */\nexport type RowOrderingState = string[];\n\nexport interface RowOrderingTableState {\n  rowOrdering: RowOrderingState;\n}\n\nexport interface RowOrderingTableOptions {\n  /**\n   * Callback fired when the manual row order changes.\n   */\n  onRowOrderingChange?: OnChangeFn<RowOrderingState>;\n}\n\nexport interface RowOrderingTableApis {\n  /**\n   * Updates the manual row order state. The absolute write door: resets\n   * (`setRowOrdering([])`) and bulk reorders (drag and drop) go through here.\n   */\n  setRowOrdering: (updater: Updater<RowOrderingState>) => void;\n}\n\nexport interface RowOrderingRowApis {\n  /**\n   * Moves this row — or every selected row when this row is selected — up one\n   * place in display order, past the nearest unpinned row.\n   */\n  moveUp: () => void;\n  /**\n   * Moves this row — or every selected row when this row is selected — down\n   * one place in display order, past the nearest unpinned row.\n   */\n  moveDown: () => void;\n  /**\n   * Whether an unpinned row exists above to move past. False when this row is\n   * pinned.\n   */\n  getCanMoveUp: () => boolean;\n  /**\n   * Whether an unpinned row exists below to move past. False when this row is\n   * pinned.\n   */\n  getCanMoveDown: () => boolean;\n}\n\ndeclare module '@tanstack/react-table' {\n  interface Plugins {\n    rowOrderingFeature?: TableFeature;\n  }\n\n  interface TableState_FeatureMap {\n    rowOrderingFeature: RowOrderingTableState;\n  }\n\n  interface TableOptions_FeatureMap<\n    // biome-ignore lint/correctness/noUnusedVariables: merged declarations must repeat the original type parameters\n    TFeatures extends TableFeatures,\n    // biome-ignore lint/correctness/noUnusedVariables: merged declarations must repeat the original type parameters\n    TData extends RowData,\n  > {\n    rowOrderingFeature: RowOrderingTableOptions;\n  }\n\n  interface Table_FeatureMap<\n    // biome-ignore lint/correctness/noUnusedVariables: merged declarations must repeat the original type parameters\n    TFeatures extends TableFeatures,\n    // biome-ignore lint/correctness/noUnusedVariables: merged declarations must repeat the original type parameters\n    TData extends RowData,\n  > {\n    rowOrderingFeature: RowOrderingTableApis;\n  }\n\n  interface Row_FeatureMap<\n    // biome-ignore lint/correctness/noUnusedVariables: merged declarations must repeat the original type parameters\n    TFeatures extends TableFeatures,\n    // biome-ignore lint/correctness/noUnusedVariables: merged declarations must repeat the original type parameters\n    TData extends RowData,\n  > {\n    rowOrderingFeature: RowOrderingRowApis;\n  }\n}\n\nfunction tableSetRowOrdering<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>(table: Table<TFeatures, TData>, updater: Updater<RowOrderingState>) {\n  (table.options as RowOrderingTableOptions).onRowOrderingChange?.(updater);\n}\n\n/**\n * Captures the current base order by id, extracts the moving rows, and\n * reinserts them next to the target row.\n */\nfunction tableMoveRows<TFeatures extends TableFeatures, TData extends RowData>(\n  table: Table<TFeatures, TData>,\n  ids: string[],\n  targetId: string,\n  position: 'before' | 'after',\n) {\n  const moving = new Set(ids);\n  const remaining = table\n    .getCoreRowModel()\n    .rows.reduce<string[]>((acc, row) => {\n      if (!moving.has(row.id)) {\n        acc.push(row.id);\n      }\n\n      return acc;\n    }, []);\n  const targetIndex = remaining.indexOf(targetId);\n\n  if (targetIndex === -1) {\n    return;\n  }\n\n  const insertAt = position === 'before' ? targetIndex : targetIndex + 1;\n\n  remaining.splice(insertAt, 0, ...ids);\n  tableSetRowOrdering(table, remaining);\n}\n\n// structural read: getIsPinned only exists when rowPinningFeature is on\nfunction isPinnedRow<TFeatures extends TableFeatures, TData extends RowData>(\n  row: Row<TFeatures, TData>,\n) {\n  return Boolean(\n    (row as { getIsPinned?: () => false | 'top' | 'bottom' }).getIsPinned?.(),\n  );\n}\n\n/**\n * Nearest unpinned row scanning outward from fromIndex. Pinned rows render in\n * their own regions, so they are not part of the orderable sequence — moving\n * relative to one has no visible effect.\n */\nfunction findUnpinnedNeighbor<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>(rows: Row<TFeatures, TData>[], fromIndex: number, direction: -1 | 1) {\n  for (\n    let index = fromIndex + direction;\n    index >= 0 && index < rows.length;\n    index += direction\n  ) {\n    const candidate = rows[index];\n\n    if (candidate && !isPinnedRow(candidate)) {\n      return candidate;\n    }\n  }\n\n  return undefined;\n}\n\nfunction rowGetCanMoveUp<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>(table: Table<TFeatures, TData>, row: Row<TFeatures, TData>) {\n  return (\n    !isPinnedRow(row) &&\n    findUnpinnedNeighbor(table.getRowModel().rows, row.index, -1) !== undefined\n  );\n}\n\nfunction rowGetCanMoveDown<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>(table: Table<TFeatures, TData>, row: Row<TFeatures, TData>) {\n  return (\n    !isPinnedRow(row) &&\n    findUnpinnedNeighbor(table.getRowModel().rows, row.index, 1) !== undefined\n  );\n}\n\n/**\n * Gathers the rows a move applies to: every selected row when the acted-on\n * row is selected, otherwise just the acted-on row.\n */\nfunction getRowsToMove<TFeatures extends TableFeatures, TData extends RowData>(\n  table: Table<TFeatures, TData>,\n  row: Row<TFeatures, TData>,\n) {\n  const rows = table.getRowModel().rows;\n  // structural read: rowSelection only exists when rowSelectionFeature is on\n  const selection =\n    (\n      table.atoms as { rowSelection?: { get: () => RowSelectionState } }\n    ).rowSelection?.get() ?? {};\n  const rowsToMove = selection[row.id]\n    ? rows.filter(({ id }) => selection[id])\n    : [row];\n\n  return { rows, rowsToMove };\n}\n\nfunction tableMoveRowsUp<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>(table: Table<TFeatures, TData>, row: Row<TFeatures, TData>) {\n  // pinned rows render in their own region; moving one is visually inert\n  if (isPinnedRow(row)) {\n    return;\n  }\n\n  const { rows, rowsToMove } = getRowsToMove(table, row);\n  const firstRowToMove = rowsToMove[0];\n\n  if (!firstRowToMove) {\n    return;\n  }\n\n  const target = findUnpinnedNeighbor(rows, firstRowToMove.index, -1);\n\n  if (!target) {\n    return;\n  }\n\n  tableMoveRows(\n    table,\n    rowsToMove.map(({ id }) => id),\n    target.id,\n    'before',\n  );\n}\n\nfunction tableMoveRowsDown<\n  TFeatures extends TableFeatures,\n  TData extends RowData,\n>(table: Table<TFeatures, TData>, row: Row<TFeatures, TData>) {\n  // pinned rows render in their own region; moving one is visually inert\n  if (isPinnedRow(row)) {\n    return;\n  }\n\n  const { rows, rowsToMove } = getRowsToMove(table, row);\n  const lastRowToMove = rowsToMove[rowsToMove.length - 1];\n\n  if (!lastRowToMove) {\n    return;\n  }\n\n  const target = findUnpinnedNeighbor(rows, lastRowToMove.index, 1);\n\n  if (!target) {\n    return;\n  }\n\n  tableMoveRows(\n    table,\n    rowsToMove.map(({ id }) => id),\n    target.id,\n    'after',\n  );\n}\n\n/**\n * TanStack Table custom feature adding manual row ordering: a `rowOrdering`\n * state slice (row ids in display order), a `table.setRowOrdering` state\n * setter, and `row.moveUp()` / `row.moveDown()` row APIs.\n *\n * Feature APIs have stable identities, so column defs can call them without\n * capturing component-scope callbacks.\n */\nexport const rowOrderingFeature: TableFeature = {\n  getInitialState: (initialState) => ({\n    ...initialState,\n    rowOrdering:\n      (initialState as Partial<RowOrderingTableState>).rowOrdering ?? [],\n  }),\n  getDefaultTableOptions: (table) => ({\n    onRowOrderingChange: makeStateUpdater('rowOrdering', table),\n  }),\n  constructTableAPIs: <TFeatures extends TableFeatures, TData extends RowData>(\n    table: Table<TFeatures, TData>,\n  ) => {\n    assignTableAPIs('rowOrderingFeature', table, {\n      // biome-ignore lint/style/useNamingConvention: assignTableAPIs derives the instance method name from the table_ prefix\n      table_setRowOrdering: {\n        fn: (updater: Updater<RowOrderingState>) =>\n          tableSetRowOrdering(table, updater),\n      },\n    });\n  },\n  assignRowPrototype: <TFeatures extends TableFeatures, TData extends RowData>(\n    prototype: Record<string, unknown>,\n    table: Table<TFeatures, TData>,\n  ) => {\n    assignPrototypeAPIs('rowOrderingFeature', prototype, table, {\n      // biome-ignore lint/style/useNamingConvention: assignPrototypeAPIs derives the method name from the row_ prefix\n      row_moveUp: {\n        fn: (row: Row<TFeatures, TData>) => tableMoveRowsUp(table, row),\n      },\n      // biome-ignore lint/style/useNamingConvention: assignPrototypeAPIs derives the method name from the row_ prefix\n      row_moveDown: {\n        fn: (row: Row<TFeatures, TData>) => tableMoveRowsDown(table, row),\n      },\n      // biome-ignore lint/style/useNamingConvention: assignPrototypeAPIs derives the method name from the row_ prefix\n      row_getCanMoveUp: {\n        fn: (row: Row<TFeatures, TData>) => rowGetCanMoveUp(table, row),\n      },\n      // biome-ignore lint/style/useNamingConvention: assignPrototypeAPIs derives the method name from the row_ prefix\n      row_getCanMoveDown: {\n        fn: (row: Row<TFeatures, TData>) => rowGetCanMoveDown(table, row),\n      },\n    });\n  },\n};\n"],"mappings":"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"}

package/dist/components/table/row.d.ts

@@ -11,7 +11,8 @@
  */
 
 import { TableRowProps } from "./types.js";
-import * as react_jsx_runtime107 from "react/jsx-runtime";
+import * as react_jsx_runtime197 from "react/jsx-runtime";
+import { RowData } from "@tanstack/react-table";
 
 //#region src/components/table/row.d.ts
 
@@ -38,13 +39,13 @@ import * as react_jsx_runtime107 from "react/jsx-runtime";
  * @param props.row - TanStack table row object.
  * @returns The rendered TableRow component.
  */
-declare function TableRow<T>({
+declare function TableRow<T extends RowData>({
   ref,
   children,
   className,
   row,
   ...rest
-}: TableRowProps<T>): react_jsx_runtime107.JSX.Element;
+}: TableRowProps<T>): react_jsx_runtime197.JSX.Element;
 //#endregion
 export { TableRow };
 //# sourceMappingURL=row.d.ts.map

package/dist/components/table/row.js.map

@@ -1 +1 @@
-{"version":3,"file":"row.js","names":[],"sources":["../../../src/components/table/row.tsx"],"sourcesContent":["// __private-exports\n/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { TableCell } from './cell';\nimport styles from './styles.module.css';\nimport type { TableRowProps } from './types';\n\n/**\n * TableRow - Table row (`<tr>`) with selection and pinning state.\n *\n * @example\n * ```tsx\n * <TableBody rows={rows}>\n *   {rows.map(row => (\n *     <TableRow key={row.id} row={row}>\n *       {row.getAllCells().map(cell => (\n *         <TableCell key={cell.id} cell={cell} />\n *       ))}\n *     </TableRow>\n *   ))}\n * </TableBody>\n * ```\n *\n * @param props - {@link TableRowProps}\n * @param props.ref - Ref to the tr element.\n * @param props.children - Custom children content.\n * @param props.className - CSS class for the tr element.\n * @param props.row - TanStack table row object.\n * @returns The rendered TableRow component.\n */\nexport function TableRow<T>({\n  ref,\n  children,\n  className,\n  row,\n  ...rest\n}: TableRowProps<T>) {\n  const cells = row?.getAllCells();\n\n  return (\n    <tr\n      {...rest}\n      ref={ref}\n      className={clsx('group/row', styles.row, className)}\n      data-pinned={row?.getIsPinned() || null}\n      data-selected={row?.getIsSelected() || null}\n    >\n      {children ||\n        cells?.map((cell) => <TableCell key={cell.id} cell={cell} />)}\n    </tr>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCA,SAAgB,SAAY,EAC1B,KACA,UACA,WACA,KACA,GAAG,QACgB;CACnB,MAAM,QAAQ,KAAK,aAAa;AAEhC,QACE,oBAAC;EACC,GAAI;EACC;EACL,WAAW,KAAK,aAAa,OAAO,KAAK,UAAU;EACnD,eAAa,KAAK,aAAa,IAAI;EACnC,iBAAe,KAAK,eAAe,IAAI;YAEtC,YACC,OAAO,KAAK,SAAS,oBAAC,aAA8B,QAAf,KAAK,GAAkB,CAAC;GAC5D"}
+{"version":3,"file":"row.js","names":[],"sources":["../../../src/components/table/row.tsx"],"sourcesContent":["// __private-exports\n/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { TableCell } from './cell';\nimport styles from './styles.module.css';\nimport type { RowData } from '@tanstack/react-table';\nimport type { TableRowProps } from './types';\n\n/**\n * TableRow - Table row (`<tr>`) with selection and pinning state.\n *\n * @example\n * ```tsx\n * <TableBody rows={rows}>\n *   {rows.map(row => (\n *     <TableRow key={row.id} row={row}>\n *       {row.getAllCells().map(cell => (\n *         <TableCell key={cell.id} cell={cell} />\n *       ))}\n *     </TableRow>\n *   ))}\n * </TableBody>\n * ```\n *\n * @param props - {@link TableRowProps}\n * @param props.ref - Ref to the tr element.\n * @param props.children - Custom children content.\n * @param props.className - CSS class for the tr element.\n * @param props.row - TanStack table row object.\n * @returns The rendered TableRow component.\n */\nexport function TableRow<T extends RowData>({\n  ref,\n  children,\n  className,\n  row,\n  ...rest\n}: TableRowProps<T>) {\n  const cells = row?.getAllCells();\n\n  return (\n    <tr\n      {...rest}\n      ref={ref}\n      className={clsx('group/row', styles.row, className)}\n      data-pinned={row?.getIsPinned() || null}\n      data-selected={row?.getIsSelected() || null}\n    >\n      {children ||\n        cells?.map((cell) => <TableCell key={cell.id} cell={cell} />)}\n    </tr>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,SAAgB,SAA4B,EAC1C,KACA,UACA,WACA,KACA,GAAG,QACgB;CACnB,MAAM,QAAQ,KAAK,aAAa;AAEhC,QACE,oBAAC;EACC,GAAI;EACC;EACL,WAAW,KAAK,aAAa,OAAO,KAAK,UAAU;EACnD,eAAa,KAAK,aAAa,IAAI;EACnC,iBAAe,KAAK,eAAe,IAAI;YAEtC,YACC,OAAO,KAAK,SAAS,oBAAC,aAA8B,QAAf,KAAK,GAAkB,CAAC;GAC5D"}

package/dist/components/table/types.d.ts

@@ -10,8 +10,9 @@
  * governing permissions and limitations under the License.
  */
 
+import { TableFeatures as TableFeatures$1 } from "./features.js";
 import { ComponentPropsWithRef, Dispatch, PropsWithChildren, SetStateAction } from "react";
-import { Cell, ColumnDef, Header, HeaderGroup, Row, RowSelectionState } from "@tanstack/react-table";
+import { Cell, ColumnDef, Header, HeaderGroup, Row, RowData, RowSelectionState } from "@tanstack/react-table";
 import { Key } from "@react-types/shared";
 
 //#region src/components/table/types.d.ts
@@ -20,9 +21,10 @@ type ExtendedTableProps<T extends {
   id: Key;
 }> = {
   /**
-   * An array of column definitions, one for each key in `T`.
+   * An array of column definitions. Build them with
+   * `createTableColumnHelper<T>()`.
    */
-  columns: { [K in keyof Required<T>]: ColumnDef<T, T[K]> }[keyof T][];
+  columns: ColumnDef<TableFeatures$1, T, any>[];
   /**
    * An array of data objects of type `T`.
    * Each object must have a unique `id` property.
@@ -177,8 +179,8 @@ type TableProps<T extends {
  * @see {@link HTMLAttributes}
  * @see {@link RefAttributes}
  */
-type TableBodyProps<T> = ComponentPropsWithRef<'tbody'> & {
-  rows?: Row<T>[];
+type TableBodyProps<T extends RowData> = ComponentPropsWithRef<'tbody'> & {
+  rows?: Row<TableFeatures$1, T>[];
 };
 /**
  * Props for a table row (`<tr>`) component.
@@ -189,8 +191,8 @@ type TableBodyProps<T> = ComponentPropsWithRef<'tbody'> & {
  * @see {@link HTMLAttributes}
  * @see {@link RefAttributes}
  */
-type TableRowProps<T> = ComponentPropsWithRef<'tr'> & {
-  row?: Row<T>;
+type TableRowProps<T extends RowData> = ComponentPropsWithRef<'tr'> & {
+  row?: Row<TableFeatures$1, T>;
 };
 /**
  * Props for a table cell component.
@@ -204,8 +206,8 @@ type TableRowProps<T> = ComponentPropsWithRef<'tr'> & {
  * @property ref - Optional React ref for the table cell element.
  * @property className - Optional class name for custom styling.
  */
-type TableCellProps<T> = ComponentPropsWithRef<'td'> & {
-  cell?: Cell<T, unknown>;
+type TableCellProps<T extends RowData> = ComponentPropsWithRef<'td'> & {
+  cell?: Cell<TableFeatures$1, T, unknown>;
 };
 /**
  * Props for a table header cell component.
@@ -215,8 +217,8 @@ type TableCellProps<T> = ComponentPropsWithRef<'td'> & {
  *
  * @see {@link RefAttributes}
  */
-type TableHeaderCellProps<T> = ComponentPropsWithRef<'th'> & {
-  header?: Header<T, unknown>;
+type TableHeaderCellProps<T extends RowData> = ComponentPropsWithRef<'th'> & {
+  header?: Header<TableFeatures$1, T, unknown>;
 };
 /**
  * Props for the table header (`<thead>`) component.
@@ -226,11 +228,11 @@ type TableHeaderCellProps<T> = ComponentPropsWithRef<'th'> & {
  * @see {@link HTMLAttributes}
  * @see {@link RefAttributes}
  */
-type TableHeaderProps<T> = ComponentPropsWithRef<'thead'> & {
+type TableHeaderProps<T extends RowData> = ComponentPropsWithRef<'thead'> & {
   /**
    * Array of header groups of the table
    */
-  headerGroups?: HeaderGroup<T>[];
+  headerGroups?: HeaderGroup<TableFeatures$1, T>[];
   /**
    * The currently selected column ID
    */

package/dist/components/tabs/context.d.ts

@@ -13,13 +13,13 @@
 import { ProviderProps } from "../../lib/types.js";
 import { TabProps, TabsProps } from "./types.js";
 import "client-only";
-import * as react43 from "react";
-import * as react_jsx_runtime175 from "react/jsx-runtime";
+import * as react46 from "react";
+import * as react_jsx_runtime200 from "react/jsx-runtime";
 import { ContextValue } from "react-aria-components/slots";
 
 //#region src/components/tabs/context.d.ts
 /** Context for sharing props across Tabs components */
-declare const TabsContext: react43.Context<ContextValue<TabsProps, HTMLDivElement>>;
+declare const TabsContext: react46.Context<ContextValue<TabsProps, HTMLDivElement>>;
 /**
  * Sets default props for all Tabs components within.
  *
@@ -42,12 +42,12 @@ declare const TabsContext: react43.Context<ContextValue<TabsProps, HTMLDivElemen
 declare function TabsProvider({
   children,
   ...props
-}: ProviderProps<TabsProps>): react_jsx_runtime175.JSX.Element;
-declare const TabContext: react43.Context<ContextValue<TabProps, Element>>;
+}: ProviderProps<TabsProps>): react_jsx_runtime200.JSX.Element;
+declare const TabContext: react46.Context<ContextValue<TabProps, Element>>;
 declare function TabProvider({
   children,
   ...props
-}: ProviderProps<TabProps>): react_jsx_runtime175.JSX.Element;
+}: ProviderProps<TabProps>): react_jsx_runtime200.JSX.Element;
 //#endregion
 export { TabContext, TabProvider, TabsContext, TabsProvider };
 //# sourceMappingURL=context.d.ts.map

package/dist/components/tabs/index.d.ts

@@ -12,7 +12,7 @@
 
 import { TabsProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime8 from "react/jsx-runtime";
+import * as react_jsx_runtime202 from "react/jsx-runtime";
 
 //#region src/components/tabs/index.d.ts
 
@@ -44,7 +44,7 @@ import * as react_jsx_runtime8 from "react/jsx-runtime";
 declare function Tabs({
   ref,
   ...props
-}: TabsProps): react_jsx_runtime8.JSX.Element;
+}: TabsProps): react_jsx_runtime202.JSX.Element;
 //#endregion
 export { Tabs };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/tabs/list.d.ts

@@ -11,7 +11,7 @@
  */
 
 import "client-only";
-import * as react_jsx_runtime109 from "react/jsx-runtime";
+import * as react_jsx_runtime204 from "react/jsx-runtime";
 import { TabListProps } from "react-aria-components/Tabs";
 
 //#region src/components/tabs/list.d.ts
@@ -40,7 +40,7 @@ declare function TabList<T extends object>({
   children,
   className,
   ...rest
-}: TabListProps<T>): react_jsx_runtime109.JSX.Element;
+}: TabListProps<T>): react_jsx_runtime204.JSX.Element;
 //#endregion
 export { TabList };
 //# sourceMappingURL=list.d.ts.map

package/dist/components/tabs/panel.d.ts

@@ -11,7 +11,7 @@
  */
 
 import "client-only";
-import * as react_jsx_runtime117 from "react/jsx-runtime";
+import * as react_jsx_runtime203 from "react/jsx-runtime";
 import { TabPanelProps } from "react-aria-components/Tabs";
 
 //#region src/components/tabs/panel.d.ts
@@ -41,7 +41,7 @@ declare function TabPanel({
   children,
   className,
   ...rest
-}: TabPanelProps): react_jsx_runtime117.JSX.Element;
+}: TabPanelProps): react_jsx_runtime203.JSX.Element;
 //#endregion
 export { TabPanel };
 //# sourceMappingURL=panel.d.ts.map

package/dist/components/tabs/tab.d.ts

@@ -12,7 +12,7 @@
 
 import { TabProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime118 from "react/jsx-runtime";
+import * as react_jsx_runtime205 from "react/jsx-runtime";
 
 //#region src/components/tabs/tab.d.ts
 
@@ -38,7 +38,7 @@ import * as react_jsx_runtime118 from "react/jsx-runtime";
 declare function Tab({
   ref,
   ...props
-}: TabProps): react_jsx_runtime118.JSX.Element;
+}: TabProps): react_jsx_runtime205.JSX.Element;
 //#endregion
 export { Tab };
 //# sourceMappingURL=tab.d.ts.map

package/dist/components/text-area-field/context.d.ts

@@ -13,13 +13,13 @@
 import { ProviderProps } from "../../lib/types.js";
 import { TextAreaFieldProps } from "./types.js";
 import "client-only";
-import * as react34 from "react";
-import * as react_jsx_runtime119 from "react/jsx-runtime";
+import * as react48 from "react";
+import * as react_jsx_runtime209 from "react/jsx-runtime";
 import { ContextValue } from "react-aria-components/slots";
 
 //#region src/components/text-area-field/context.d.ts
 /** Context for sharing props across TextAreaField components */
-declare const TextAreaFieldContext: react34.Context<ContextValue<TextAreaFieldProps, HTMLDivElement>>;
+declare const TextAreaFieldContext: react48.Context<ContextValue<TextAreaFieldProps, HTMLDivElement>>;
 /**
  * Sets default props for all TextAreaField components within.
  *
@@ -42,7 +42,7 @@ declare const TextAreaFieldContext: react34.Context<ContextValue<TextAreaFieldPr
 declare function TextAreaFieldProvider({
   children,
   ...props
-}: ProviderProps<TextAreaFieldProps>): react_jsx_runtime119.JSX.Element;
+}: ProviderProps<TextAreaFieldProps>): react_jsx_runtime209.JSX.Element;
 //#endregion
 export { TextAreaFieldContext, TextAreaFieldProvider };
 //# sourceMappingURL=context.d.ts.map

package/dist/components/text-area-field/index.d.ts

@@ -12,7 +12,7 @@
 
 import { TextAreaFieldProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime120 from "react/jsx-runtime";
+import * as react_jsx_runtime210 from "react/jsx-runtime";
 
 //#region src/components/text-area-field/index.d.ts
 
@@ -44,7 +44,7 @@ import * as react_jsx_runtime120 from "react/jsx-runtime";
 declare function TextAreaField({
   ref,
   ...props
-}: TextAreaFieldProps): react_jsx_runtime120.JSX.Element;
+}: TextAreaFieldProps): react_jsx_runtime210.JSX.Element;
 //#endregion
 export { TextAreaField };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/text-field/context.d.ts

@@ -13,13 +13,13 @@
 import { ProviderProps } from "../../lib/types.js";
 import { TextFieldProps } from "./types.js";
 import "client-only";
-import * as react33 from "react";
-import * as react_jsx_runtime116 from "react/jsx-runtime";
+import * as react49 from "react";
+import * as react_jsx_runtime211 from "react/jsx-runtime";
 import { ContextValue } from "react-aria-components/slots";
 
 //#region src/components/text-field/context.d.ts
 /** Context for sharing props across TextField components */
-declare const TextFieldContext: react33.Context<ContextValue<TextFieldProps, HTMLDivElement>>;
+declare const TextFieldContext: react49.Context<ContextValue<TextFieldProps, HTMLDivElement>>;
 /**
  * Sets default props for all TextField components within.
  *
@@ -42,7 +42,7 @@ declare const TextFieldContext: react33.Context<ContextValue<TextFieldProps, HTM
 declare function TextFieldProvider({
   children,
   ...props
-}: ProviderProps<TextFieldProps>): react_jsx_runtime116.JSX.Element;
+}: ProviderProps<TextFieldProps>): react_jsx_runtime211.JSX.Element;
 //#endregion
 export { TextFieldContext, TextFieldProvider };
 //# sourceMappingURL=context.d.ts.map