@apipass/design-system 6.2.0 → 7.1.0

package/dist/lib/ui/components/DataTable/DataTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.js","sources":["../../../../../src/ui/components/DataTable/DataTable.tsx"],"sourcesContent":["import {\n  Pagination,\n  PermissionGate,\n  Search,\n  Table,\n  TableBody,\n  TableCell,\n  TableColumn,\n  TableHead,\n  TableRow,\n} from \"primitives\";\nimport { Flex } from \"layout\";\nimport { IconChevronDown, IconChevronRight } from \"icons\";\nimport type { ReactNode } from \"react\";\nimport { useMemo, useState } from \"react\";\nimport type { Selection, SortDescriptor } from \"react-aria-components\";\nimport \"./datatable.css\";\n\nexport interface Column<T> {\n  key: keyof T | string;\n  label: string;\n  align?: \"start\" | \"center\" | \"right\";\n  render?: (item: T) => ReactNode;\n  /** When true, the header becomes clickable and the rows can be sorted by this column. */\n  sortable?: boolean;\n  /** Value used to sort this column. Defaults to `item[key]`. */\n  sortValue?: (item: T) => SortableValue;\n}\n\ntype SortableValue = string | number | Date | null | undefined;\n\nconst sortCollator = new Intl.Collator(undefined, { numeric: true, sensitivity: \"base\" });\n\nfunction compareSortableValues(a: SortableValue, b: SortableValue): number {\n  if (a == null || b == null) return a == null ? (b == null ? 0 : 1) : -1;\n  if (a instanceof Date && b instanceof Date) return a.getTime() - b.getTime();\n  if (typeof a === \"number\" && typeof b === \"number\") return a - b;\n  return sortCollator.compare(String(a), String(b));\n}\n\nfunction sortRows<T>(rows: T[], column: Column<T>, direction: SortDescriptor[\"direction\"]): T[] {\n  const valueOf = column.sortValue ?? ((item: T) => (item as Record<string, unknown>)[column.key as string] as SortableValue);\n  const directionFactor = direction === \"descending\" ? -1 : 1;\n  return [...rows].sort((a, b) => compareSortableValues(valueOf(a), valueOf(b)) * directionFactor);\n}\n\nexport interface RowActionDef<T> {\n  /** Unique key for this action. */\n  key: string;\n  /** aria-label for the button. */\n  label: string;\n  /** Icon element rendered inside the button. */\n  icon: ReactNode;\n  /** When false, button is disabled and a tooltip with `noAccessLabel` is shown. Default: true. */\n  isAllowed?: boolean;\n  /** Tooltip text shown when `isAllowed` is false. */\n  noAccessLabel?: string;\n  /** Called with the row item when the button is pressed. */\n  onPress: (item: T) => void;\n}\n\nfunction RowActionButton<T>({\n  action,\n  item,\n}: {\n  action: RowActionDef<T>;\n  item: T;\n}) {\n  const allowed = action.isAllowed !== false;\n  const btn = (\n    <button\n      type=\"button\"\n      className=\"data-table-row-action-btn\"\n      aria-label={action.label}\n      disabled={!allowed}\n      onClick={allowed ? () => action.onPress(item) : undefined}\n    >\n      {action.icon}\n    </button>\n  );\n  if (allowed) return btn;\n  return (\n    <PermissionGate isAllowed={false} noAccessLabel={action.noAccessLabel ?? \"\"}>\n      {btn}\n    </PermissionGate>\n  );\n}\n\n// O tipo da linha aninhada é independente de T (não há relação genérica entre linha pai e linhas\n// filhas), então \"any\" é usado deliberadamente como fronteira de erasure de tipo.\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype NestedStatus = { status: \"loading\"; data: never[] } | { status: \"loaded\"; data: any[] };\n\nexport interface DataTableProps<T extends { id: string }> {\n  columns: Column<T>[];\n  data: T[];\n  actions?: ReactNode;\n  /** Per-row action buttons rendered in a dedicated last column. */\n  rowActions?: RowActionDef<T>[] | ((item: T) => RowActionDef<T>[]);\n  /** Label for the row actions column header. Defaults to empty string. */\n  rowActionsLabel?: string;\n  /**\n   * When true, renders a selection column before the first data column — a per-row control on\n   * every row (see `selectionType`), plus a \"select all\" checkbox in the header when\n   * `selectionType` is \"checkbox\". Off by default.\n   */\n  selectable?: boolean;\n  /**\n   * Visual style of the built-in selection control. \"checkbox\" (default) allows selecting\n   * multiple rows and shows a \"select all\" in the header. \"radio\" restricts selection to a\n   * single row (no \"select all\" — there is nothing to select all *to* with one choice) and\n   * renders a round control instead of a checkbox.\n   */\n  selectionType?: \"checkbox\" | \"radio\";\n  /** When true, draws vertical lines between columns. Off by default. */\n  grid?: boolean;\n  /** Controlled selection state. Omit to let the table manage its own selection internally. */\n  selectedKeys?: Selection;\n  onSelectionChange?: (keys: Selection) => void;\n  /** Initial sort when the table manages its own sorting. Only columns with `sortable` can be sorted. */\n  defaultSortDescriptor?: SortDescriptor;\n  /** Controlled sort state. Omit to let the table manage its own sorting internally. */\n  sortDescriptor?: SortDescriptor;\n  onSortChange?: (descriptor: SortDescriptor) => void;\n  searchPlaceholder?: string;\n  searchKeys?: (keyof T)[];\n  isLoading?: boolean;\n  loadingMessage?: string;\n  emptyMessage?: string;\n  previousLabel?: string;\n  nextLabel?: string;\n  pageSize?: number;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- linha aninhada é de tipo independente de T\n  nestedColumns?: Column<any>[];\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- linha aninhada é de tipo independente de T\n  getNestedData?: (item: T) => any[] | Promise<any[]>;\n  nestedLoadingMessage?: string;\n  nestedEmptyMessage?: string;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- linha aninhada é de tipo independente de T\n  nestedSearchKeys?: (keyof any)[];\n  nestedSearchPlaceholder?: string;\n  nestedActions?: (item: T) => ReactNode;\n  nestedPageSize?: number;\n}\n\nexport function DataTable<T extends { id: string }>({\n  columns,\n  data,\n  actions,\n  rowActions,\n  rowActionsLabel = \"\",\n  selectable = false,\n  selectionType = \"checkbox\",\n  grid = false,\n  selectedKeys,\n  onSelectionChange,\n  defaultSortDescriptor,\n  sortDescriptor: controlledSortDescriptor,\n  onSortChange,\n  searchPlaceholder = \"Search...\",\n  searchKeys = [],\n  isLoading = false,\n  loadingMessage = \"Loading...\",\n  emptyMessage = \"No records found\",\n  previousLabel = \"Previous\",\n  nextLabel = \"Next\",\n  pageSize = 10,\n  nestedColumns,\n  getNestedData,\n  nestedLoadingMessage = \"Loading...\",\n  nestedEmptyMessage = \"No records found\",\n  nestedSearchKeys,\n  nestedSearchPlaceholder,\n  nestedActions,\n  nestedPageSize,\n}: DataTableProps<T>) {\n  const [query, setQuery] = useState(\"\");\n  const [page, setPage] = useState(1);\n  const [internalSortDescriptor, setInternalSortDescriptor] = useState(defaultSortDescriptor);\n  const sortDescriptor = controlledSortDescriptor ?? internalSortDescriptor;\n  const [expanded, setExpanded] = useState<Set<string>>(new Set());\n  const [nestedCache, setNestedCache] = useState<Map<string, NestedStatus>>(new Map());\n\n  const hasNested = !!getNestedData && !!nestedColumns;\n  const hasRowActions = !!rowActions;\n\n  function setRowExpanded(id: string, isExpanded: boolean) {\n    setExpanded((prev) => {\n      const next = new Set(prev);\n      if (isExpanded) next.add(id);\n      else next.delete(id);\n      return next;\n    });\n  }\n\n  // A carga fica fora do updater do setExpanded: o React pode chamar updaters mais de uma\n  // vez (StrictMode), o que dispararia getNestedData em dobro.\n  function toggleRow(item: T) {\n    const id = item.id;\n    const willExpand = !expanded.has(id);\n    setRowExpanded(id, willExpand);\n    if (!willExpand || nestedCache.has(id)) return;\n\n    const result = getNestedData!(item);\n    if (result instanceof Promise) {\n      setNestedCache((c) => new Map(c).set(id, { status: \"loading\", data: [] }));\n      result.then(\n        (rows) => {\n          setNestedCache((c) => new Map(c).set(id, { status: \"loaded\", data: rows }));\n        },\n        () => {\n          // Na falha, descarta a entrada e recolhe a linha: expandir de novo refaz a carga,\n          // em vez de a linha ficar presa em \"loading\".\n          setNestedCache((c) => {\n            const next = new Map(c);\n            next.delete(id);\n            return next;\n          });\n          setRowExpanded(id, false);\n        },\n      );\n    } else {\n      setNestedCache((c) => new Map(c).set(id, { status: \"loaded\", data: result }));\n    }\n  }\n\n  const hasSearch = searchKeys.length > 0;\n  const hasToolbar = hasSearch || !!actions;\n\n  const filtered = useMemo(() => {\n    if (!query.trim() || !hasSearch) return data;\n    const lower = query.toLowerCase();\n    return data.filter((item) =>\n      searchKeys.some((k) =>\n        String(item[k] ?? \"\")\n          .toLowerCase()\n          .includes(lower),\n      ),\n    );\n  }, [data, query, searchKeys, hasSearch]);\n\n  const sortColumn = columns.find((col) => col.sortable && String(col.key) === String(sortDescriptor?.column));\n\n  const sorted = useMemo(\n    () => (sortColumn && sortDescriptor ? sortRows(filtered, sortColumn, sortDescriptor.direction) : filtered),\n    [filtered, sortColumn, sortDescriptor],\n  );\n\n  function handleSortChange(descriptor: SortDescriptor) {\n    setInternalSortDescriptor(descriptor);\n    setPage(1);\n    onSortChange?.(descriptor);\n  }\n\n  const totalPages = Math.max(1, Math.ceil(sorted.length / pageSize));\n  const currentPage = Math.min(page, totalPages);\n  const pageData = sorted.slice(\n    (currentPage - 1) * pageSize,\n    currentPage * pageSize,\n  );\n\n  function getCell(item: T, col: Column<T>): ReactNode {\n    if (col.render) return col.render(item);\n    return String((item as Record<string, unknown>)[col.key as string] ?? \"\");\n  }\n\n  return (\n    <Flex direction=\"column\" gap=\"300\" className=\"data-table\">\n      {hasToolbar && (\n        <div className=\"data-table-toolbar\">\n          {hasSearch && (\n            <Search\n              placeholder={searchPlaceholder}\n              onSearch={(v) => {\n                setQuery(v);\n                setPage(1);\n              }}\n              className=\"data-table-search\"\n            />\n          )}\n          {actions && <div className=\"data-table-actions\">{actions}</div>}\n        </div>\n      )}\n\n      {isLoading ? (\n        <div\n          role=\"status\"\n          aria-live=\"polite\"\n          aria-label={loadingMessage}\n          className=\"data-table-status\"\n        >\n          {loadingMessage}\n        </div>\n      ) : filtered.length === 0 ? (\n        <div role=\"status\" className=\"data-table-status data-table-empty\">\n          {emptyMessage}\n        </div>\n      ) : (\n        <Table\n          selectionMode={selectable ? (selectionType === \"radio\" ? \"single\" : \"multiple\") : \"none\"}\n          selectionType={selectionType}\n          grid={grid}\n          selectedKeys={selectedKeys}\n          onSelectionChange={onSelectionChange}\n          sortDescriptor={sortDescriptor}\n          onSortChange={handleSortChange}\n        >\n          <TableHead>\n            {hasNested && <TableColumn className=\"data-table-expand-col\" />}\n            {columns.map((col, idx) => (\n              <TableColumn\n                key={String(col.key)}\n                id={String(col.key)}\n                align={col.align}\n                allowsSorting={col.sortable}\n                isRowHeader={idx === 0}\n              >\n                {col.label}\n              </TableColumn>\n            ))}\n            {hasRowActions && (\n              <TableColumn align=\"right\" className=\"data-table-row-actions-col\">\n                {rowActionsLabel}\n              </TableColumn>\n            )}\n          </TableHead>\n          <TableBody>\n            {pageData.flatMap((item) => {\n              const isExpanded = expanded.has(item.id);\n              const cached = nestedCache.get(item.id);\n              const rows: ReactNode[] = [\n                <TableRow key={item.id} id={item.id}>\n                  {hasNested && (\n                    <TableCell className=\"data-table-expand-cell\">\n                      <button\n                        type=\"button\"\n                        className=\"data-table-expand-btn\"\n                        aria-label={isExpanded ? \"Collapse row\" : \"Expand row\"}\n                        aria-expanded={isExpanded}\n                        onClick={() => toggleRow(item)}\n                      >\n                        {isExpanded ? (\n                          <IconChevronDown size=\"16\" />\n                        ) : (\n                          <IconChevronRight size=\"16\" />\n                        )}\n                      </button>\n                    </TableCell>\n                  )}\n                  {columns.map((col) => (\n                    <TableCell key={String(col.key)} align={col.align}>\n                      {getCell(item, col)}\n                    </TableCell>\n                  ))}\n                  {hasRowActions && (\n                    <TableCell align=\"right\" className=\"data-table-row-actions-cell\">\n                      <div className=\"data-table-row-actions\">\n                        {(typeof rowActions === \"function\"\n                          ? rowActions(item)\n                          : rowActions!\n                        ).map((action) => (\n                          <RowActionButton key={action.key} action={action} item={item} />\n                        ))}\n                      </div>\n                    </TableCell>\n                  )}\n                </TableRow>,\n              ];\n              if (isExpanded) {\n                rows.push(\n                  <TableRow key={`${item.id}-nested`} id={`${item.id}-nested`} className=\"data-table-nested-row\">\n                    <TableCell\n                      colSpan={\n                        columns.length +\n                        (hasNested ? 1 : 0) +\n                        (selectable ? 1 : 0) +\n                        (hasRowActions ? 1 : 0)\n                      }\n                      className=\"data-table-nested-cell\"\n                    >\n                      <DataTable\n                        columns={nestedColumns!}\n                        data={cached?.data ?? []}\n                        isLoading={!cached || cached.status === \"loading\"}\n                        loadingMessage={nestedLoadingMessage}\n                        emptyMessage={nestedEmptyMessage}\n                        searchKeys={nestedSearchKeys}\n                        searchPlaceholder={nestedSearchPlaceholder}\n                        actions={nestedActions?.(item)}\n                        pageSize={nestedPageSize ?? pageSize}\n                      />\n                    </TableCell>\n                  </TableRow>,\n                );\n              }\n              return rows;\n            })}\n          </TableBody>\n        </Table>\n      )}\n\n      <Pagination\n        page={currentPage}\n        totalPages={totalPages}\n        onPageChange={setPage}\n        previousLabel={previousLabel}\n        nextLabel={nextLabel}\n      />\n    </Flex>\n  );\n}\n"],"names":["sortCollator","compareSortableValues","a","b","sortRows","rows","column","direction","valueOf","item","directionFactor","RowActionButton","action","allowed","btn","jsx","PermissionGate","DataTable","columns","data","actions","rowActions","rowActionsLabel","selectable","selectionType","grid","selectedKeys","onSelectionChange","defaultSortDescriptor","controlledSortDescriptor","onSortChange","searchPlaceholder","searchKeys","isLoading","loadingMessage","emptyMessage","previousLabel","nextLabel","pageSize","nestedColumns","getNestedData","nestedLoadingMessage","nestedEmptyMessage","nestedSearchKeys","nestedSearchPlaceholder","nestedActions","nestedPageSize","query","setQuery","useState","page","setPage","internalSortDescriptor","setInternalSortDescriptor","sortDescriptor","expanded","setExpanded","nestedCache","setNestedCache","hasNested","hasRowActions","setRowExpanded","id","isExpanded","prev","next","toggleRow","willExpand","result","c","hasSearch","hasToolbar","filtered","useMemo","lower","k","sortColumn","col","sorted","handleSortChange","descriptor","totalPages","currentPage","pageData","getCell","Flex","jsxs","Search","v","Table","TableHead","TableColumn","idx","TableBody","cached","TableRow","TableCell","IconChevronDown","IconChevronRight","Pagination"],"mappings":"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"}
+{"version":3,"file":"DataTable.js","sources":["../../../../../src/ui/components/DataTable/DataTable.tsx"],"sourcesContent":["import {\n  Pagination,\n  PermissionGate,\n  Search,\n  Table,\n  TableBody,\n  TableCell,\n  TableColumn,\n  TableHead,\n  TableRow,\n} from \"primitives\";\nimport { Flex } from \"layout\";\nimport { IconChevronDown, IconChevronRight } from \"icons\";\nimport type { ReactNode } from \"react\";\nimport clsx from \"clsx\";\nimport { useMemo, useState } from \"react\";\nimport type { Selection, SortDescriptor } from \"react-aria-components\";\nimport \"./datatable.css\";\n\nexport interface Column<T> {\n  key: keyof T | string;\n  label: string;\n  align?: \"start\" | \"center\" | \"right\";\n  render?: (item: T) => ReactNode;\n  /** Marks the column that names the row for assistive technology. Defaults to the first column when no column sets it. */\n  isRowHeader?: boolean;\n  /** When true, the header becomes clickable and the rows can be sorted by this column. */\n  sortable?: boolean;\n  /** Value used to sort this column. Defaults to `item[key]`. */\n  sortValue?: (item: T) => SortableValue;\n}\n\ntype SortableValue = string | number | Date | null | undefined;\n\nconst sortCollator = new Intl.Collator(undefined, { numeric: true, sensitivity: \"base\" });\n\nfunction compareSortableValues(a: SortableValue, b: SortableValue): number {\n  if (a == null || b == null) return a == null ? (b == null ? 0 : 1) : -1;\n  if (a instanceof Date && b instanceof Date) return a.getTime() - b.getTime();\n  if (typeof a === \"number\" && typeof b === \"number\") return a - b;\n  return sortCollator.compare(String(a), String(b));\n}\n\nfunction sortRows<T>(rows: T[], column: Column<T>, direction: SortDescriptor[\"direction\"]): T[] {\n  const valueOf = column.sortValue ?? ((item: T) => (item as Record<string, unknown>)[column.key as string] as SortableValue);\n  const directionFactor = direction === \"descending\" ? -1 : 1;\n  return [...rows].sort((a, b) => compareSortableValues(valueOf(a), valueOf(b)) * directionFactor);\n}\n\nexport interface RowActionDef<T> {\n  /** Unique key for this action. */\n  key: string;\n  /** aria-label for the button. */\n  label: string;\n  /** Icon element rendered inside the button. */\n  icon: ReactNode;\n  /** When false, button is disabled and a tooltip with `noAccessLabel` is shown. Default: true. */\n  isAllowed?: boolean;\n  /** Tooltip text shown when `isAllowed` is false. */\n  noAccessLabel?: string;\n  /** Called with the row item when the button is pressed. */\n  onPress: (item: T) => void;\n}\n\nfunction RowActionButton<T>({\n  action,\n  item,\n}: {\n  action: RowActionDef<T>;\n  item: T;\n}) {\n  const allowed = action.isAllowed !== false;\n  const btn = (\n    <button\n      type=\"button\"\n      className=\"data-table-row-action-btn\"\n      aria-label={action.label}\n      disabled={!allowed}\n      onClick={allowed ? () => action.onPress(item) : undefined}\n    >\n      {action.icon}\n    </button>\n  );\n  if (allowed) return btn;\n  return (\n    <PermissionGate isAllowed={false} noAccessLabel={action.noAccessLabel ?? \"\"}>\n      {btn}\n    </PermissionGate>\n  );\n}\n\n// O tipo da linha aninhada é independente de T (não há relação genérica entre linha pai e linhas\n// filhas), então \"any\" é usado deliberadamente como fronteira de erasure de tipo.\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype NestedStatus = { status: \"loading\"; data: never[] } | { status: \"loaded\"; data: any[] };\n\nexport interface DataTableProps<T extends { id: string }> {\n  columns: Column<T>[];\n  data: T[];\n  actions?: ReactNode;\n  /** Per-row action buttons rendered in a dedicated last column. */\n  rowActions?: RowActionDef<T>[] | ((item: T) => RowActionDef<T>[]);\n  /** Label for the row actions column header. Defaults to empty string. */\n  rowActionsLabel?: string;\n  /**\n   * When true, renders a selection column before the first data column — a per-row control on\n   * every row (see `selectionType`), plus a \"select all\" checkbox in the header when\n   * `selectionType` is \"checkbox\". Off by default.\n   */\n  selectable?: boolean;\n  /**\n   * Visual style of the built-in selection control. \"checkbox\" (default) allows selecting\n   * multiple rows and shows a \"select all\" in the header. \"radio\" restricts selection to a\n   * single row (no \"select all\" — there is nothing to select all *to* with one choice) and\n   * renders a round control instead of a checkbox.\n   */\n  selectionType?: \"checkbox\" | \"radio\";\n  /** Controlled selection state. Omit to let the table manage its own selection internally. */\n  selectedKeys?: Selection;\n  onSelectionChange?: (keys: Selection) => void;\n  /** Initial sort when the table manages its own sorting. Only columns with `sortable` can be sorted. */\n  defaultSortDescriptor?: SortDescriptor;\n  /** Controlled sort state. Omit to let the table manage its own sorting internally. */\n  sortDescriptor?: SortDescriptor;\n  onSortChange?: (descriptor: SortDescriptor) => void;\n  /** Accessible name of the table. */\n  ariaLabel?: string;\n  /** Compact row height. Off by default. */\n  dense?: boolean;\n  /** Alternating row background. Off by default. */\n  striped?: boolean;\n  /**\n   * Caps the height of the table so its rows scroll inside it with a sticky header, keeping the\n   * pagination in view. A percentage needs a parent with a defined height. Off by default.\n   */\n  maxHeight?: number | string;\n  searchPlaceholder?: string;\n  searchKeys?: (keyof T)[];\n  isLoading?: boolean;\n  loadingMessage?: string;\n  emptyMessage?: string;\n  previousLabel?: string;\n  nextLabel?: string;\n  pageSize?: number;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- linha aninhada é de tipo independente de T\n  nestedColumns?: Column<any>[];\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- linha aninhada é de tipo independente de T\n  getNestedData?: (item: T) => any[] | Promise<any[]>;\n  nestedLoadingMessage?: string;\n  nestedEmptyMessage?: string;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- linha aninhada é de tipo independente de T\n  nestedSearchKeys?: (keyof any)[];\n  nestedSearchPlaceholder?: string;\n  nestedActions?: (item: T) => ReactNode;\n  nestedPageSize?: number;\n}\n\nexport function DataTable<T extends { id: string }>({\n  columns,\n  data,\n  actions,\n  rowActions,\n  rowActionsLabel = \"\",\n  selectable = false,\n  selectionType = \"checkbox\",\n  selectedKeys,\n  onSelectionChange,\n  defaultSortDescriptor,\n  sortDescriptor: controlledSortDescriptor,\n  onSortChange,\n  ariaLabel,\n  dense,\n  striped,\n  maxHeight,\n  searchPlaceholder = \"Search...\",\n  searchKeys = [],\n  isLoading = false,\n  loadingMessage = \"Loading...\",\n  emptyMessage = \"No records found\",\n  previousLabel = \"Previous\",\n  nextLabel = \"Next\",\n  pageSize = 10,\n  nestedColumns,\n  getNestedData,\n  nestedLoadingMessage = \"Loading...\",\n  nestedEmptyMessage = \"No records found\",\n  nestedSearchKeys,\n  nestedSearchPlaceholder,\n  nestedActions,\n  nestedPageSize,\n}: DataTableProps<T>) {\n  const [query, setQuery] = useState(\"\");\n  const [page, setPage] = useState(1);\n  const [internalSortDescriptor, setInternalSortDescriptor] = useState(defaultSortDescriptor);\n  const sortDescriptor = controlledSortDescriptor ?? internalSortDescriptor;\n  const [expanded, setExpanded] = useState<Set<string>>(new Set());\n  const [nestedCache, setNestedCache] = useState<Map<string, NestedStatus>>(new Map());\n\n  const hasNested = !!getNestedData && !!nestedColumns;\n  const hasRowActions = !!rowActions;\n\n  function setRowExpanded(id: string, isExpanded: boolean) {\n    setExpanded((prev) => {\n      const next = new Set(prev);\n      if (isExpanded) next.add(id);\n      else next.delete(id);\n      return next;\n    });\n  }\n\n  // A carga fica fora do updater do setExpanded: o React pode chamar updaters mais de uma\n  // vez (StrictMode), o que dispararia getNestedData em dobro.\n  function toggleRow(item: T) {\n    const id = item.id;\n    const willExpand = !expanded.has(id);\n    setRowExpanded(id, willExpand);\n    if (!willExpand || nestedCache.has(id)) return;\n\n    const result = getNestedData!(item);\n    if (result instanceof Promise) {\n      setNestedCache((c) => new Map(c).set(id, { status: \"loading\", data: [] }));\n      result.then(\n        (rows) => {\n          setNestedCache((c) => new Map(c).set(id, { status: \"loaded\", data: rows }));\n        },\n        () => {\n          // Na falha, descarta a entrada e recolhe a linha: expandir de novo refaz a carga,\n          // em vez de a linha ficar presa em \"loading\".\n          setNestedCache((c) => {\n            const next = new Map(c);\n            next.delete(id);\n            return next;\n          });\n          setRowExpanded(id, false);\n        },\n      );\n    } else {\n      setNestedCache((c) => new Map(c).set(id, { status: \"loaded\", data: result }));\n    }\n  }\n\n  const hasSearch = searchKeys.length > 0;\n  const hasExplicitRowHeader = columns.some((col) => col.isRowHeader);\n  const hasToolbar = hasSearch || !!actions;\n\n  const filtered = useMemo(() => {\n    if (!query.trim() || !hasSearch) return data;\n    const lower = query.toLowerCase();\n    return data.filter((item) =>\n      searchKeys.some((k) =>\n        String(item[k] ?? \"\")\n          .toLowerCase()\n          .includes(lower),\n      ),\n    );\n  }, [data, query, searchKeys, hasSearch]);\n\n  const sortColumn = columns.find((col) => col.sortable && String(col.key) === String(sortDescriptor?.column));\n\n  const sorted = useMemo(\n    () => (sortColumn && sortDescriptor ? sortRows(filtered, sortColumn, sortDescriptor.direction) : filtered),\n    [filtered, sortColumn, sortDescriptor],\n  );\n\n  function handleSortChange(descriptor: SortDescriptor) {\n    setInternalSortDescriptor(descriptor);\n    setPage(1);\n    onSortChange?.(descriptor);\n  }\n\n  const totalPages = Math.max(1, Math.ceil(sorted.length / pageSize));\n  const currentPage = Math.min(page, totalPages);\n  const pageData = sorted.slice(\n    (currentPage - 1) * pageSize,\n    currentPage * pageSize,\n  );\n\n  function getCell(item: T, col: Column<T>): ReactNode {\n    if (col.render) return col.render(item);\n    return String((item as Record<string, unknown>)[col.key as string] ?? \"\");\n  }\n\n  return (\n    <Flex\n      direction=\"column\"\n      gap=\"300\"\n      className={clsx(\"data-table\", maxHeight !== undefined && \"data-table--fill\")}\n    >\n      {hasToolbar && (\n        <div className=\"data-table-toolbar\">\n          {hasSearch && (\n            <Search\n              placeholder={searchPlaceholder}\n              onSearch={(v) => {\n                setQuery(v);\n                setPage(1);\n              }}\n              className=\"data-table-search\"\n            />\n          )}\n          {actions && <div className=\"data-table-actions\">{actions}</div>}\n        </div>\n      )}\n\n      {isLoading ? (\n        <div\n          role=\"status\"\n          aria-live=\"polite\"\n          aria-label={loadingMessage}\n          className=\"data-table-status\"\n        >\n          {loadingMessage}\n        </div>\n      ) : filtered.length === 0 ? (\n        <div role=\"status\" className=\"data-table-status data-table-empty\">\n          {emptyMessage}\n        </div>\n      ) : (\n        <Table\n          aria-label={ariaLabel}\n          dense={dense}\n          striped={striped}\n          maxHeight={maxHeight}\n          selectionMode={selectable ? (selectionType === \"radio\" ? \"single\" : \"multiple\") : \"none\"}\n          selectionType={selectionType}\n          selectedKeys={selectedKeys}\n          onSelectionChange={onSelectionChange}\n          sortDescriptor={sortDescriptor}\n          onSortChange={handleSortChange}\n        >\n          <TableHead>\n            {hasNested && <TableColumn className=\"data-table-expand-col\" />}\n            {columns.map((col, idx) => (\n              <TableColumn\n                key={String(col.key)}\n                id={String(col.key)}\n                align={col.align}\n                allowsSorting={col.sortable}\n                isRowHeader={hasExplicitRowHeader ? col.isRowHeader : idx === 0}\n              >\n                {col.label}\n              </TableColumn>\n            ))}\n            {hasRowActions && (\n              <TableColumn align=\"right\" className=\"data-table-row-actions-col\">\n                {rowActionsLabel}\n              </TableColumn>\n            )}\n          </TableHead>\n          <TableBody>\n            {pageData.flatMap((item) => {\n              const isExpanded = expanded.has(item.id);\n              const cached = nestedCache.get(item.id);\n              const rows: ReactNode[] = [\n                <TableRow key={item.id} id={item.id}>\n                  {hasNested && (\n                    <TableCell className=\"data-table-expand-cell\">\n                      <button\n                        type=\"button\"\n                        className=\"data-table-expand-btn\"\n                        aria-label={isExpanded ? \"Collapse row\" : \"Expand row\"}\n                        aria-expanded={isExpanded}\n                        onClick={() => toggleRow(item)}\n                      >\n                        {isExpanded ? (\n                          <IconChevronDown size=\"16\" />\n                        ) : (\n                          <IconChevronRight size=\"16\" />\n                        )}\n                      </button>\n                    </TableCell>\n                  )}\n                  {columns.map((col) => (\n                    <TableCell key={String(col.key)} align={col.align}>\n                      {getCell(item, col)}\n                    </TableCell>\n                  ))}\n                  {hasRowActions && (\n                    <TableCell align=\"right\" className=\"data-table-row-actions-cell\">\n                      <div className=\"data-table-row-actions\">\n                        {(typeof rowActions === \"function\"\n                          ? rowActions(item)\n                          : rowActions!\n                        ).map((action) => (\n                          <RowActionButton key={action.key} action={action} item={item} />\n                        ))}\n                      </div>\n                    </TableCell>\n                  )}\n                </TableRow>,\n              ];\n              if (isExpanded) {\n                rows.push(\n                  <TableRow key={`${item.id}-nested`} id={`${item.id}-nested`} className=\"data-table-nested-row\">\n                    <TableCell\n                      colSpan={\n                        columns.length +\n                        (hasNested ? 1 : 0) +\n                        (selectable ? 1 : 0) +\n                        (hasRowActions ? 1 : 0)\n                      }\n                      className=\"data-table-nested-cell\"\n                    >\n                      <DataTable\n                        columns={nestedColumns!}\n                        data={cached?.data ?? []}\n                        isLoading={!cached || cached.status === \"loading\"}\n                        loadingMessage={nestedLoadingMessage}\n                        emptyMessage={nestedEmptyMessage}\n                        searchKeys={nestedSearchKeys}\n                        searchPlaceholder={nestedSearchPlaceholder}\n                        actions={nestedActions?.(item)}\n                        pageSize={nestedPageSize ?? pageSize}\n                      />\n                    </TableCell>\n                  </TableRow>,\n                );\n              }\n              return rows;\n            })}\n          </TableBody>\n        </Table>\n      )}\n\n      <Pagination\n        page={currentPage}\n        totalPages={totalPages}\n        onPageChange={setPage}\n        previousLabel={previousLabel}\n        nextLabel={nextLabel}\n      />\n    </Flex>\n  );\n}\n"],"names":["sortCollator","compareSortableValues","a","b","sortRows","rows","column","direction","valueOf","item","directionFactor","RowActionButton","action","allowed","btn","jsx","PermissionGate","DataTable","columns","data","actions","rowActions","rowActionsLabel","selectable","selectionType","selectedKeys","onSelectionChange","defaultSortDescriptor","controlledSortDescriptor","onSortChange","ariaLabel","dense","striped","maxHeight","searchPlaceholder","searchKeys","isLoading","loadingMessage","emptyMessage","previousLabel","nextLabel","pageSize","nestedColumns","getNestedData","nestedLoadingMessage","nestedEmptyMessage","nestedSearchKeys","nestedSearchPlaceholder","nestedActions","nestedPageSize","query","setQuery","useState","page","setPage","internalSortDescriptor","setInternalSortDescriptor","sortDescriptor","expanded","setExpanded","nestedCache","setNestedCache","hasNested","hasRowActions","setRowExpanded","id","isExpanded","prev","next","toggleRow","willExpand","result","c","hasSearch","hasExplicitRowHeader","col","hasToolbar","filtered","useMemo","lower","k","sortColumn","sorted","handleSortChange","descriptor","totalPages","currentPage","pageData","getCell","jsxs","Flex","clsx","Search","v","Table","TableHead","TableColumn","idx","TableBody","cached","TableRow","TableCell","IconChevronDown","IconChevronRight","Pagination"],"mappings":"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"}

package/dist/lib/ui/primitives/Table/Table.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("../../../vendor/clsx/dist/clsx.cjs"),m=require("react"),n=require("react-aria-components");;/* empty css            */const g=require("../../icons/IconChevronDown.cjs"),f=require("../../icons/IconChevronUp.cjs"),j=require("../Checkbox/Checkbox.cjs"),p=require("../Radio/Radio.cjs"),h=m.createContext("checkbox");function v(s){const l=Number(s);return`${s}`.trim()!==""&&Number.isFinite(l)?`${l}px`:`${s}`}function y({bleed:s=!1,dense:l=!1,grid:t=!1,striped:o=!1,selectionType:i="checkbox",maxHeight:a,className:d,...r}){const b=a!==void 0,C=c.clsx(d,"table-container",s&&"table-container-bleed",b&&"table-container-scrollable"),N=b?{"--table-max-height":v(a)}:void 0,T=c.clsx("sds-table",s&&"table-bleed",l&&"table-dense",t&&"table-grid",o&&"sds-table-striped");return e.jsx("div",{className:C,style:N,children:e.jsx(h.Provider,{value:i,children:e.jsx(n.Table,{className:T,...r})})})}function x({align:s="start",className:l,...t}){const o=c.clsx(l,"table-column",`table-align-${s}`);return e.jsx(n.Column,{className:o,...t,children:({allowsSorting:i,sortDirection:a})=>e.jsx("div",{className:c.clsx("table-column-inner"),children:e.jsxs(e.Fragment,{children:[t.children,i&&e.jsx("span",{"aria-hidden":"true",className:c.clsx("sort-indicator",!a&&"sort-indicator-unsorted"),children:a==="descending"?e.jsx(g.IconChevronDown,{}):e.jsx(f.IconChevronUp,{})})]})})})}function k({className:s,...l}){return e.jsx(n.TableBody,{...l})}function q({className:s,columns:l,children:t,...o}){const{selectionBehavior:i,selectionMode:a,allowsDragging:d}=n.useTableOptions(),r=m.useContext(h),b=c.clsx(s,"table-head");return e.jsxs(n.TableHeader,{className:b,...o,children:[d&&e.jsx(x,{}),i==="toggle"&&e.jsx(x,{className:c.clsx("table-selection-col",r==="radio"&&"table-selection-col--radio"),children:a==="multiple"&&e.jsx(n.Checkbox,{slot:"selection",className:"table-selection-checkbox",children:e.jsx(j.Checkbox,{})})}),e.jsx(n.Collection,{items:l,children:t})]})}function w({id:s,columns:l,children:t,className:o,...i}){const{selectionBehavior:a,allowsDragging:d}=n.useTableOptions(),r=m.useContext(h),b=c.clsx(o,"table-row");return e.jsxs(n.Row,{id:s,...i,className:b,children:[d&&e.jsx(u,{children:e.jsx(n.Button,{slot:"drag",children:"≡"})}),a==="toggle"&&e.jsx(u,{className:c.clsx("table-selection-cell",r==="radio"&&"table-selection-cell--radio"),children:e.jsx(n.Checkbox,{slot:"selection",className:"table-selection-checkbox",children:r==="radio"?e.jsx(p.Radio,{}):e.jsx(j.Checkbox,{})})}),e.jsx(n.Collection,{items:l,children:t})]})}function u({align:s="start",className:l,...t}){const o=c.clsx(l,"table-cell",`table-align-${s}`);return e.jsx(n.Cell,{className:o,...t})}exports.Table=y;exports.TableBody=k;exports.TableCell=u;exports.TableColumn=x;exports.TableHead=q;exports.TableRow=w;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("../../../vendor/clsx/dist/clsx.cjs"),m=require("react"),n=require("react-aria-components");;/* empty css            */const T=require("../../icons/IconChevronDown.cjs"),g=require("../../icons/IconChevronUp.cjs"),j=require("../Checkbox/Checkbox.cjs"),f=require("../Radio/Radio.cjs"),h=m.createContext("checkbox");function p(s){const l=Number(s);return`${s}`.trim()!==""&&Number.isFinite(l)?`${l}px`:`${s}`}function v({bleed:s=!1,dense:l=!1,striped:t=!1,selectionType:o="checkbox",maxHeight:a,className:i,...b}){const r=a!==void 0,x=c.clsx(i,"table-container",s&&"table-container-bleed",r&&"table-container-scrollable"),C=r?{"--table-max-height":p(a)}:void 0,N=c.clsx("sds-table",s&&"table-bleed",l&&"table-dense",t&&"sds-table-striped");return e.jsx("div",{className:x,style:C,children:e.jsx(h.Provider,{value:o,children:e.jsx(n.Table,{className:N,...b})})})}function d({align:s="start",className:l,...t}){const o=c.clsx(l,"table-column",`table-align-${s}`);return e.jsx(n.Column,{className:o,...t,children:({allowsSorting:a,sortDirection:i})=>e.jsx("div",{className:c.clsx("table-column-inner"),children:e.jsxs(e.Fragment,{children:[t.children,a&&e.jsx("span",{"aria-hidden":"true",className:c.clsx("sort-indicator",!i&&"sort-indicator-unsorted"),children:i==="descending"?e.jsx(T.IconChevronDown,{}):e.jsx(g.IconChevronUp,{})})]})})})}function y({className:s,...l}){return e.jsx(n.TableBody,{...l})}function k({className:s,columns:l,children:t,...o}){const{selectionBehavior:a,selectionMode:i,allowsDragging:b}=n.useTableOptions(),r=m.useContext(h),x=c.clsx(s,"table-head");return e.jsxs(n.TableHeader,{className:x,...o,children:[b&&e.jsx(d,{}),a==="toggle"&&e.jsx(d,{className:c.clsx("table-selection-col",r==="radio"&&"table-selection-col--radio"),children:i==="multiple"&&e.jsx(n.Checkbox,{slot:"selection",className:"table-selection-checkbox",children:e.jsx(j.Checkbox,{})})}),e.jsx(n.Collection,{items:l,children:t})]})}function q({id:s,columns:l,children:t,className:o,...a}){const{selectionBehavior:i,allowsDragging:b}=n.useTableOptions(),r=m.useContext(h),x=c.clsx(o,"table-row");return e.jsxs(n.Row,{id:s,...a,className:x,children:[b&&e.jsx(u,{children:e.jsx(n.Button,{slot:"drag",children:"≡"})}),i==="toggle"&&e.jsx(u,{className:c.clsx("table-selection-cell",r==="radio"&&"table-selection-cell--radio"),children:e.jsx(n.Checkbox,{slot:"selection",className:"table-selection-checkbox",children:r==="radio"?e.jsx(f.Radio,{}):e.jsx(j.Checkbox,{})})}),e.jsx(n.Collection,{items:l,children:t})]})}function u({align:s="start",className:l,...t}){const o=c.clsx(l,"table-cell",`table-align-${s}`);return e.jsx(n.Cell,{className:o,...t})}exports.Table=v;exports.TableBody=y;exports.TableCell=u;exports.TableColumn=d;exports.TableHead=k;exports.TableRow=q;
 //# sourceMappingURL=Table.cjs.map

package/dist/lib/ui/primitives/Table/Table.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Table.cjs","sources":["../../../../../src/ui/primitives/Table/Table.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { IconChevronDown, IconChevronUp } from \"icons\";\nimport { Checkbox, Radio } from \"primitives\";\nimport { createContext, useContext, type CSSProperties } from \"react\";\nimport {\n  Button as RACButton,\n  Cell as RACCell,\n  Checkbox as RACSelectionCheckbox,\n  Collection as RACCollection,\n  Column as RACColumn,\n  Row as RACRow,\n  Table as RACTable,\n  TableBody as RACTableBody,\n  TableHeader as RACTableHeader,\n  useTableOptions,\n  type CellProps as RACCellProps,\n  type ColumnProps as RACColumnProps,\n  type RowProps as RACRowProps,\n  type TableBodyProps as RACTableBodyProps,\n  type TableHeaderProps as RACTableHeaderProps,\n  type TableProps as RACTableProps,\n} from \"react-aria-components\";\nimport \"./table.css\";\n\ntype TableAlign = \"start\" | \"center\" | \"right\";\n\n/**\n * Visual style of the built-in selection control rendered in the selection\n * column (header \"select all\" + per-row toggle). \"radio\" is for\n * `selectionMode=\"single\"` tables where a round, single-choice control reads\n * better than a checkbox — the header never renders a control either way\n * (there is no \"select all\" for a single choice).\n */\ntype SelectionType = \"checkbox\" | \"radio\";\nconst SelectionTypeContext = createContext<SelectionType>(\"checkbox\");\n\nfunction toCssLength(value: number | string): string {\n  const numericValue = Number(value);\n  const isUnitlessNumber =\n    `${value}`.trim() !== \"\" && Number.isFinite(numericValue);\n  return isUnitlessNumber ? `${numericValue}px` : `${value}`;\n}\n\nexport type TableProps = RACTableProps & {\n  bleed?: boolean;\n  dense?: boolean;\n  grid?: boolean;\n  striped?: boolean;\n  selectionType?: SelectionType;\n  maxHeight?: number | string;\n};\nexport function Table({\n  bleed = false,\n  dense = false,\n  grid = false,\n  striped = false,\n  selectionType = \"checkbox\",\n  maxHeight,\n  className,\n  ...props\n}: TableProps) {\n  const scrollsVertically = maxHeight !== undefined;\n  const containerClassNames = clsx(\n    className,\n    \"table-container\",\n    bleed && \"table-container-bleed\",\n    scrollsVertically && \"table-container-scrollable\",\n  );\n  const containerStyle = scrollsVertically\n    ? ({ \"--table-max-height\": toCssLength(maxHeight) } as CSSProperties)\n    : undefined;\n  const tableClassNames = clsx(\n    \"sds-table\",\n    bleed && \"table-bleed\",\n    dense && \"table-dense\",\n    grid && \"table-grid\",\n    striped && \"sds-table-striped\",\n  );\n  return (\n    <div className={containerClassNames} style={containerStyle}>\n      <SelectionTypeContext.Provider value={selectionType}>\n        <RACTable className={tableClassNames} {...props} />\n      </SelectionTypeContext.Provider>\n    </div>\n  );\n}\n\nexport type TableColumnProps = RACColumnProps & {\n  align?: TableAlign;\n};\nexport function TableColumn({\n  align = \"start\",\n  className,\n  ...props\n}: TableColumnProps) {\n  const classNames = clsx(className, \"table-column\", `table-align-${align}`);\n  return (\n    <RACColumn className={classNames} {...props}>\n      {({ allowsSorting, sortDirection }) => (\n        <div className={clsx(\"table-column-inner\")}>\n          <>\n            {props.children}\n            {allowsSorting && (\n              <span\n                aria-hidden=\"true\"\n                className={clsx(\n                  \"sort-indicator\",\n                  !sortDirection && \"sort-indicator-unsorted\",\n                )}\n              >\n                {sortDirection === \"descending\" ? (\n                  <IconChevronDown />\n                ) : (\n                  <IconChevronUp />\n                )}\n              </span>\n            )}\n          </>\n        </div>\n      )}\n    </RACColumn>\n  );\n}\n\nexport type TableBodyProps<T> = RACTableBodyProps<T>;\nexport function TableBody<T extends object>({\n  className,\n  ...props\n}: TableBodyProps<T>) {\n  return <RACTableBody {...props} />;\n}\n\nexport type TableHeadProps<T> = RACTableHeaderProps<T>;\nexport function TableHead<T extends object>({\n  className,\n  columns,\n  children,\n  ...props\n}: TableHeadProps<T>) {\n  const { selectionBehavior, selectionMode, allowsDragging } =\n    useTableOptions();\n  const selectionType = useContext(SelectionTypeContext);\n  const classNames = clsx(className, \"table-head\");\n  return (\n    <RACTableHeader className={classNames} {...props}>\n      {/* Add extra columns for drag and drop and selection. */}\n      {allowsDragging && <TableColumn />}\n      {selectionBehavior === \"toggle\" && (\n        <TableColumn\n          className={clsx(\n            \"table-selection-col\",\n            selectionType === \"radio\" && \"table-selection-col--radio\",\n          )}\n        >\n          {selectionMode === \"multiple\" && (\n            <RACSelectionCheckbox slot=\"selection\" className=\"table-selection-checkbox\">\n              <Checkbox />\n            </RACSelectionCheckbox>\n          )}\n        </TableColumn>\n      )}\n      <RACCollection items={columns}>{children}</RACCollection>\n    </RACTableHeader>\n  );\n}\n\nexport type TableRowProps<T> = RACRowProps<T>;\nexport function TableRow<T extends object>({\n  id,\n  columns,\n  children,\n  className,\n  ...otherProps\n}: TableRowProps<T>) {\n  const { selectionBehavior, allowsDragging } = useTableOptions();\n  const selectionType = useContext(SelectionTypeContext);\n  const classNames = clsx(className, \"table-row\");\n  return (\n    <RACRow id={id} {...otherProps} className={classNames}>\n      {allowsDragging && (\n        <TableCell>\n          <RACButton slot=\"drag\">≡</RACButton>\n        </TableCell>\n      )}\n      {selectionBehavior === \"toggle\" && (\n        <TableCell\n          className={clsx(\n            \"table-selection-cell\",\n            selectionType === \"radio\" && \"table-selection-cell--radio\",\n          )}\n        >\n          <RACSelectionCheckbox slot=\"selection\" className=\"table-selection-checkbox\">\n            {selectionType === \"radio\" ? <Radio /> : <Checkbox />}\n          </RACSelectionCheckbox>\n        </TableCell>\n      )}\n      <RACCollection items={columns}>{children}</RACCollection>\n    </RACRow>\n  );\n}\n\nexport type TableCellProps = RACCellProps & { align?: TableAlign };\nexport function TableCell({\n  align = \"start\",\n  className,\n  ...props\n}: TableCellProps) {\n  const classNames = clsx(className, \"table-cell\", `table-align-${align}`);\n  return <RACCell className={classNames} {...props} />;\n}\n"],"names":["SelectionTypeContext","createContext","toCssLength","value","numericValue","Table","bleed","dense","grid","striped","selectionType","maxHeight","className","props","scrollsVertically","containerClassNames","clsx","containerStyle","tableClassNames","RACTable","TableColumn","align","classNames","RACColumn","allowsSorting","sortDirection","jsx","jsxs","Fragment","IconChevronDown","IconChevronUp","TableBody","RACTableBody","TableHead","columns","children","selectionBehavior","selectionMode","allowsDragging","useTableOptions","useContext","RACTableHeader","RACSelectionCheckbox","Checkbox","RACCollection","TableRow","id","otherProps","RACRow","TableCell","RACButton","Radio","RACCell"],"mappings":"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"}
+{"version":3,"file":"Table.cjs","sources":["../../../../../src/ui/primitives/Table/Table.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { IconChevronDown, IconChevronUp } from \"icons\";\nimport { Checkbox, Radio } from \"primitives\";\nimport { createContext, useContext, type CSSProperties } from \"react\";\nimport {\n  Button as RACButton,\n  Cell as RACCell,\n  Checkbox as RACSelectionCheckbox,\n  Collection as RACCollection,\n  Column as RACColumn,\n  Row as RACRow,\n  Table as RACTable,\n  TableBody as RACTableBody,\n  TableHeader as RACTableHeader,\n  useTableOptions,\n  type CellProps as RACCellProps,\n  type ColumnProps as RACColumnProps,\n  type RowProps as RACRowProps,\n  type TableBodyProps as RACTableBodyProps,\n  type TableHeaderProps as RACTableHeaderProps,\n  type TableProps as RACTableProps,\n} from \"react-aria-components\";\nimport \"./table.css\";\n\ntype TableAlign = \"start\" | \"center\" | \"right\";\n\n/**\n * Visual style of the built-in selection control rendered in the selection\n * column (header \"select all\" + per-row toggle). \"radio\" is for\n * `selectionMode=\"single\"` tables where a round, single-choice control reads\n * better than a checkbox — the header never renders a control either way\n * (there is no \"select all\" for a single choice).\n */\ntype SelectionType = \"checkbox\" | \"radio\";\nconst SelectionTypeContext = createContext<SelectionType>(\"checkbox\");\n\nfunction toCssLength(value: number | string): string {\n  const numericValue = Number(value);\n  const isUnitlessNumber =\n    `${value}`.trim() !== \"\" && Number.isFinite(numericValue);\n  return isUnitlessNumber ? `${numericValue}px` : `${value}`;\n}\n\nexport type TableProps = RACTableProps & {\n  bleed?: boolean;\n  dense?: boolean;\n  striped?: boolean;\n  selectionType?: SelectionType;\n  maxHeight?: number | string;\n};\nexport function Table({\n  bleed = false,\n  dense = false,\n  striped = false,\n  selectionType = \"checkbox\",\n  maxHeight,\n  className,\n  ...props\n}: TableProps) {\n  const scrollsVertically = maxHeight !== undefined;\n  const containerClassNames = clsx(\n    className,\n    \"table-container\",\n    bleed && \"table-container-bleed\",\n    scrollsVertically && \"table-container-scrollable\",\n  );\n  const containerStyle = scrollsVertically\n    ? ({ \"--table-max-height\": toCssLength(maxHeight) } as CSSProperties)\n    : undefined;\n  const tableClassNames = clsx(\n    \"sds-table\",\n    bleed && \"table-bleed\",\n    dense && \"table-dense\",\n    striped && \"sds-table-striped\",\n  );\n  return (\n    <div className={containerClassNames} style={containerStyle}>\n      <SelectionTypeContext.Provider value={selectionType}>\n        <RACTable className={tableClassNames} {...props} />\n      </SelectionTypeContext.Provider>\n    </div>\n  );\n}\n\nexport type TableColumnProps = RACColumnProps & {\n  align?: TableAlign;\n};\nexport function TableColumn({\n  align = \"start\",\n  className,\n  ...props\n}: TableColumnProps) {\n  const classNames = clsx(className, \"table-column\", `table-align-${align}`);\n  return (\n    <RACColumn className={classNames} {...props}>\n      {({ allowsSorting, sortDirection }) => (\n        <div className={clsx(\"table-column-inner\")}>\n          <>\n            {props.children}\n            {allowsSorting && (\n              <span\n                aria-hidden=\"true\"\n                className={clsx(\n                  \"sort-indicator\",\n                  !sortDirection && \"sort-indicator-unsorted\",\n                )}\n              >\n                {sortDirection === \"descending\" ? (\n                  <IconChevronDown />\n                ) : (\n                  <IconChevronUp />\n                )}\n              </span>\n            )}\n          </>\n        </div>\n      )}\n    </RACColumn>\n  );\n}\n\nexport type TableBodyProps<T> = RACTableBodyProps<T>;\nexport function TableBody<T extends object>({\n  className,\n  ...props\n}: TableBodyProps<T>) {\n  return <RACTableBody {...props} />;\n}\n\nexport type TableHeadProps<T> = RACTableHeaderProps<T>;\nexport function TableHead<T extends object>({\n  className,\n  columns,\n  children,\n  ...props\n}: TableHeadProps<T>) {\n  const { selectionBehavior, selectionMode, allowsDragging } =\n    useTableOptions();\n  const selectionType = useContext(SelectionTypeContext);\n  const classNames = clsx(className, \"table-head\");\n  return (\n    <RACTableHeader className={classNames} {...props}>\n      {/* Add extra columns for drag and drop and selection. */}\n      {allowsDragging && <TableColumn />}\n      {selectionBehavior === \"toggle\" && (\n        <TableColumn\n          className={clsx(\n            \"table-selection-col\",\n            selectionType === \"radio\" && \"table-selection-col--radio\",\n          )}\n        >\n          {selectionMode === \"multiple\" && (\n            <RACSelectionCheckbox slot=\"selection\" className=\"table-selection-checkbox\">\n              <Checkbox />\n            </RACSelectionCheckbox>\n          )}\n        </TableColumn>\n      )}\n      <RACCollection items={columns}>{children}</RACCollection>\n    </RACTableHeader>\n  );\n}\n\nexport type TableRowProps<T> = RACRowProps<T>;\nexport function TableRow<T extends object>({\n  id,\n  columns,\n  children,\n  className,\n  ...otherProps\n}: TableRowProps<T>) {\n  const { selectionBehavior, allowsDragging } = useTableOptions();\n  const selectionType = useContext(SelectionTypeContext);\n  const classNames = clsx(className, \"table-row\");\n  return (\n    <RACRow id={id} {...otherProps} className={classNames}>\n      {allowsDragging && (\n        <TableCell>\n          <RACButton slot=\"drag\">≡</RACButton>\n        </TableCell>\n      )}\n      {selectionBehavior === \"toggle\" && (\n        <TableCell\n          className={clsx(\n            \"table-selection-cell\",\n            selectionType === \"radio\" && \"table-selection-cell--radio\",\n          )}\n        >\n          <RACSelectionCheckbox slot=\"selection\" className=\"table-selection-checkbox\">\n            {selectionType === \"radio\" ? <Radio /> : <Checkbox />}\n          </RACSelectionCheckbox>\n        </TableCell>\n      )}\n      <RACCollection items={columns}>{children}</RACCollection>\n    </RACRow>\n  );\n}\n\nexport type TableCellProps = RACCellProps & { align?: TableAlign };\nexport function TableCell({\n  align = \"start\",\n  className,\n  ...props\n}: TableCellProps) {\n  const classNames = clsx(className, \"table-cell\", `table-align-${align}`);\n  return <RACCell className={classNames} {...props} />;\n}\n"],"names":["SelectionTypeContext","createContext","toCssLength","value","numericValue","Table","bleed","dense","striped","selectionType","maxHeight","className","props","scrollsVertically","containerClassNames","clsx","containerStyle","tableClassNames","RACTable","TableColumn","align","classNames","RACColumn","allowsSorting","sortDirection","jsx","jsxs","Fragment","IconChevronDown","IconChevronUp","TableBody","RACTableBody","TableHead","columns","children","selectionBehavior","selectionMode","allowsDragging","useTableOptions","useContext","RACTableHeader","RACSelectionCheckbox","Checkbox","RACCollection","TableRow","id","otherProps","RACRow","TableCell","RACButton","Radio","RACCell"],"mappings":"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"}

package/dist/lib/ui/primitives/Table/Table.js

@@ -1,111 +1,109 @@
-import { jsx as e, jsxs as b, Fragment as v } from "react/jsx-runtime";
-import { clsx as a } from "../../../vendor/clsx/dist/clsx.js";
-import { createContext as $, useContext as N } from "react";
-import { Table as k, Column as w, TableBody as B, useTableOptions as f, TableHeader as R, Checkbox as g, Collection as p, Row as U, Button as j, Cell as D } from "react-aria-components";
+import { jsx as e, jsxs as b, Fragment as y } from "react/jsx-runtime";
+import { clsx as o } from "../../../vendor/clsx/dist/clsx.js";
+import { createContext as v, useContext as N } from "react";
+import { Table as $, Column as k, TableBody as w, useTableOptions as f, TableHeader as B, Checkbox as p, Collection as g, Row as R, Button as U, Cell as j } from "react-aria-components";
 /* empty css          */
-import { IconChevronDown as F } from "../../icons/IconChevronDown.js";
-import { IconChevronUp as I } from "../../icons/IconChevronUp.js";
+import { IconChevronDown as D } from "../../icons/IconChevronDown.js";
+import { IconChevronUp as F } from "../../icons/IconChevronUp.js";
 import { Checkbox as C } from "../Checkbox/Checkbox.js";
-import { Radio as S } from "../Radio/Radio.js";
-const d = $("checkbox");
-function V(l) {
+import { Radio as I } from "../Radio/Radio.js";
+const d = v("checkbox");
+function S(l) {
   const t = Number(l);
   return `${l}`.trim() !== "" && Number.isFinite(t) ? `${t}px` : `${l}`;
 }
-function G({
+function E({
   bleed: l = !1,
   dense: t = !1,
-  grid: s = !1,
-  striped: o = !1,
-  selectionType: c = "checkbox",
+  striped: s = !1,
+  selectionType: a = "checkbox",
   maxHeight: n,
-  className: m,
-  ...i
+  className: c,
+  ...r
 }) {
-  const r = n !== void 0, x = a(
-    m,
+  const i = n !== void 0, m = o(
+    c,
     "table-container",
     l && "table-container-bleed",
-    r && "table-container-scrollable"
-  ), T = r ? { "--table-max-height": V(n) } : void 0, y = a(
+    i && "table-container-scrollable"
+  ), x = i ? { "--table-max-height": S(n) } : void 0, T = o(
     "sds-table",
     l && "table-bleed",
     t && "table-dense",
-    s && "table-grid",
-    o && "sds-table-striped"
+    s && "sds-table-striped"
   );
-  return /* @__PURE__ */ e("div", { className: x, style: T, children: /* @__PURE__ */ e(d.Provider, { value: c, children: /* @__PURE__ */ e(k, { className: y, ...i }) }) });
+  return /* @__PURE__ */ e("div", { className: m, style: x, children: /* @__PURE__ */ e(d.Provider, { value: a, children: /* @__PURE__ */ e($, { className: T, ...r }) }) });
 }
 function h({
   align: l = "start",
   className: t,
   ...s
 }) {
-  const o = a(t, "table-column", `table-align-${l}`);
-  return /* @__PURE__ */ e(w, { className: o, ...s, children: ({ allowsSorting: c, sortDirection: n }) => /* @__PURE__ */ e("div", { className: a("table-column-inner"), children: /* @__PURE__ */ b(v, { children: [
+  const a = o(t, "table-column", `table-align-${l}`);
+  return /* @__PURE__ */ e(k, { className: a, ...s, children: ({ allowsSorting: n, sortDirection: c }) => /* @__PURE__ */ e("div", { className: o("table-column-inner"), children: /* @__PURE__ */ b(y, { children: [
     s.children,
-    c && /* @__PURE__ */ e(
+    n && /* @__PURE__ */ e(
       "span",
       {
         "aria-hidden": "true",
-        className: a(
+        className: o(
           "sort-indicator",
-          !n && "sort-indicator-unsorted"
+          !c && "sort-indicator-unsorted"
         ),
-        children: n === "descending" ? /* @__PURE__ */ e(F, {}) : /* @__PURE__ */ e(I, {})
+        children: c === "descending" ? /* @__PURE__ */ e(D, {}) : /* @__PURE__ */ e(F, {})
       }
     )
   ] }) }) });
 }
-function J({
+function G({
   className: l,
   ...t
 }) {
-  return /* @__PURE__ */ e(B, { ...t });
+  return /* @__PURE__ */ e(w, { ...t });
 }
-function K({
+function J({
   className: l,
   columns: t,
   children: s,
-  ...o
+  ...a
 }) {
-  const { selectionBehavior: c, selectionMode: n, allowsDragging: m } = f(), i = N(d), r = a(l, "table-head");
-  return /* @__PURE__ */ b(R, { className: r, ...o, children: [
-    m && /* @__PURE__ */ e(h, {}),
-    c === "toggle" && /* @__PURE__ */ e(
+  const { selectionBehavior: n, selectionMode: c, allowsDragging: r } = f(), i = N(d), m = o(l, "table-head");
+  return /* @__PURE__ */ b(B, { className: m, ...a, children: [
+    r && /* @__PURE__ */ e(h, {}),
+    n === "toggle" && /* @__PURE__ */ e(
       h,
       {
-        className: a(
+        className: o(
           "table-selection-col",
           i === "radio" && "table-selection-col--radio"
         ),
-        children: n === "multiple" && /* @__PURE__ */ e(g, { slot: "selection", className: "table-selection-checkbox", children: /* @__PURE__ */ e(C, {}) })
+        children: c === "multiple" && /* @__PURE__ */ e(p, { slot: "selection", className: "table-selection-checkbox", children: /* @__PURE__ */ e(C, {}) })
       }
     ),
-    /* @__PURE__ */ e(p, { items: t, children: s })
+    /* @__PURE__ */ e(g, { items: t, children: s })
   ] });
 }
-function Q({
+function K({
   id: l,
   columns: t,
   children: s,
-  className: o,
-  ...c
+  className: a,
+  ...n
 }) {
-  const { selectionBehavior: n, allowsDragging: m } = f(), i = N(d), r = a(o, "table-row");
-  return /* @__PURE__ */ b(U, { id: l, ...c, className: r, children: [
-    m && /* @__PURE__ */ e(u, { children: /* @__PURE__ */ e(j, { slot: "drag", children: "≡" }) }),
-    n === "toggle" && /* @__PURE__ */ e(
+  const { selectionBehavior: c, allowsDragging: r } = f(), i = N(d), m = o(a, "table-row");
+  return /* @__PURE__ */ b(R, { id: l, ...n, className: m, children: [
+    r && /* @__PURE__ */ e(u, { children: /* @__PURE__ */ e(U, { slot: "drag", children: "≡" }) }),
+    c === "toggle" && /* @__PURE__ */ e(
       u,
       {
-        className: a(
+        className: o(
           "table-selection-cell",
           i === "radio" && "table-selection-cell--radio"
         ),
-        children: /* @__PURE__ */ e(g, { slot: "selection", className: "table-selection-checkbox", children: i === "radio" ? /* @__PURE__ */ e(S, {}) : /* @__PURE__ */ e(C, {}) })
+        children: /* @__PURE__ */ e(p, { slot: "selection", className: "table-selection-checkbox", children: i === "radio" ? /* @__PURE__ */ e(I, {}) : /* @__PURE__ */ e(C, {}) })
       }
     ),
-    /* @__PURE__ */ e(p, { items: t, children: s })
+    /* @__PURE__ */ e(g, { items: t, children: s })
   ] });
 }
 function u({
@@ -113,15 +111,15 @@ function u({
   className: t,
   ...s
 }) {
-  const o = a(t, "table-cell", `table-align-${l}`);
-  return /* @__PURE__ */ e(D, { className: o, ...s });
+  const a = o(t, "table-cell", `table-align-${l}`);
+  return /* @__PURE__ */ e(j, { className: a, ...s });
 }
 export {
-  G as Table,
-  J as TableBody,
+  E as Table,
+  G as TableBody,
   u as TableCell,
   h as TableColumn,
-  K as TableHead,
-  Q as TableRow
+  J as TableHead,
+  K as TableRow
 };
 //# sourceMappingURL=Table.js.map

package/dist/lib/ui/primitives/Table/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sources":["../../../../../src/ui/primitives/Table/Table.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { IconChevronDown, IconChevronUp } from \"icons\";\nimport { Checkbox, Radio } from \"primitives\";\nimport { createContext, useContext, type CSSProperties } from \"react\";\nimport {\n  Button as RACButton,\n  Cell as RACCell,\n  Checkbox as RACSelectionCheckbox,\n  Collection as RACCollection,\n  Column as RACColumn,\n  Row as RACRow,\n  Table as RACTable,\n  TableBody as RACTableBody,\n  TableHeader as RACTableHeader,\n  useTableOptions,\n  type CellProps as RACCellProps,\n  type ColumnProps as RACColumnProps,\n  type RowProps as RACRowProps,\n  type TableBodyProps as RACTableBodyProps,\n  type TableHeaderProps as RACTableHeaderProps,\n  type TableProps as RACTableProps,\n} from \"react-aria-components\";\nimport \"./table.css\";\n\ntype TableAlign = \"start\" | \"center\" | \"right\";\n\n/**\n * Visual style of the built-in selection control rendered in the selection\n * column (header \"select all\" + per-row toggle). \"radio\" is for\n * `selectionMode=\"single\"` tables where a round, single-choice control reads\n * better than a checkbox — the header never renders a control either way\n * (there is no \"select all\" for a single choice).\n */\ntype SelectionType = \"checkbox\" | \"radio\";\nconst SelectionTypeContext = createContext<SelectionType>(\"checkbox\");\n\nfunction toCssLength(value: number | string): string {\n  const numericValue = Number(value);\n  const isUnitlessNumber =\n    `${value}`.trim() !== \"\" && Number.isFinite(numericValue);\n  return isUnitlessNumber ? `${numericValue}px` : `${value}`;\n}\n\nexport type TableProps = RACTableProps & {\n  bleed?: boolean;\n  dense?: boolean;\n  grid?: boolean;\n  striped?: boolean;\n  selectionType?: SelectionType;\n  maxHeight?: number | string;\n};\nexport function Table({\n  bleed = false,\n  dense = false,\n  grid = false,\n  striped = false,\n  selectionType = \"checkbox\",\n  maxHeight,\n  className,\n  ...props\n}: TableProps) {\n  const scrollsVertically = maxHeight !== undefined;\n  const containerClassNames = clsx(\n    className,\n    \"table-container\",\n    bleed && \"table-container-bleed\",\n    scrollsVertically && \"table-container-scrollable\",\n  );\n  const containerStyle = scrollsVertically\n    ? ({ \"--table-max-height\": toCssLength(maxHeight) } as CSSProperties)\n    : undefined;\n  const tableClassNames = clsx(\n    \"sds-table\",\n    bleed && \"table-bleed\",\n    dense && \"table-dense\",\n    grid && \"table-grid\",\n    striped && \"sds-table-striped\",\n  );\n  return (\n    <div className={containerClassNames} style={containerStyle}>\n      <SelectionTypeContext.Provider value={selectionType}>\n        <RACTable className={tableClassNames} {...props} />\n      </SelectionTypeContext.Provider>\n    </div>\n  );\n}\n\nexport type TableColumnProps = RACColumnProps & {\n  align?: TableAlign;\n};\nexport function TableColumn({\n  align = \"start\",\n  className,\n  ...props\n}: TableColumnProps) {\n  const classNames = clsx(className, \"table-column\", `table-align-${align}`);\n  return (\n    <RACColumn className={classNames} {...props}>\n      {({ allowsSorting, sortDirection }) => (\n        <div className={clsx(\"table-column-inner\")}>\n          <>\n            {props.children}\n            {allowsSorting && (\n              <span\n                aria-hidden=\"true\"\n                className={clsx(\n                  \"sort-indicator\",\n                  !sortDirection && \"sort-indicator-unsorted\",\n                )}\n              >\n                {sortDirection === \"descending\" ? (\n                  <IconChevronDown />\n                ) : (\n                  <IconChevronUp />\n                )}\n              </span>\n            )}\n          </>\n        </div>\n      )}\n    </RACColumn>\n  );\n}\n\nexport type TableBodyProps<T> = RACTableBodyProps<T>;\nexport function TableBody<T extends object>({\n  className,\n  ...props\n}: TableBodyProps<T>) {\n  return <RACTableBody {...props} />;\n}\n\nexport type TableHeadProps<T> = RACTableHeaderProps<T>;\nexport function TableHead<T extends object>({\n  className,\n  columns,\n  children,\n  ...props\n}: TableHeadProps<T>) {\n  const { selectionBehavior, selectionMode, allowsDragging } =\n    useTableOptions();\n  const selectionType = useContext(SelectionTypeContext);\n  const classNames = clsx(className, \"table-head\");\n  return (\n    <RACTableHeader className={classNames} {...props}>\n      {/* Add extra columns for drag and drop and selection. */}\n      {allowsDragging && <TableColumn />}\n      {selectionBehavior === \"toggle\" && (\n        <TableColumn\n          className={clsx(\n            \"table-selection-col\",\n            selectionType === \"radio\" && \"table-selection-col--radio\",\n          )}\n        >\n          {selectionMode === \"multiple\" && (\n            <RACSelectionCheckbox slot=\"selection\" className=\"table-selection-checkbox\">\n              <Checkbox />\n            </RACSelectionCheckbox>\n          )}\n        </TableColumn>\n      )}\n      <RACCollection items={columns}>{children}</RACCollection>\n    </RACTableHeader>\n  );\n}\n\nexport type TableRowProps<T> = RACRowProps<T>;\nexport function TableRow<T extends object>({\n  id,\n  columns,\n  children,\n  className,\n  ...otherProps\n}: TableRowProps<T>) {\n  const { selectionBehavior, allowsDragging } = useTableOptions();\n  const selectionType = useContext(SelectionTypeContext);\n  const classNames = clsx(className, \"table-row\");\n  return (\n    <RACRow id={id} {...otherProps} className={classNames}>\n      {allowsDragging && (\n        <TableCell>\n          <RACButton slot=\"drag\">≡</RACButton>\n        </TableCell>\n      )}\n      {selectionBehavior === \"toggle\" && (\n        <TableCell\n          className={clsx(\n            \"table-selection-cell\",\n            selectionType === \"radio\" && \"table-selection-cell--radio\",\n          )}\n        >\n          <RACSelectionCheckbox slot=\"selection\" className=\"table-selection-checkbox\">\n            {selectionType === \"radio\" ? <Radio /> : <Checkbox />}\n          </RACSelectionCheckbox>\n        </TableCell>\n      )}\n      <RACCollection items={columns}>{children}</RACCollection>\n    </RACRow>\n  );\n}\n\nexport type TableCellProps = RACCellProps & { align?: TableAlign };\nexport function TableCell({\n  align = \"start\",\n  className,\n  ...props\n}: TableCellProps) {\n  const classNames = clsx(className, \"table-cell\", `table-align-${align}`);\n  return <RACCell className={classNames} {...props} />;\n}\n"],"names":["SelectionTypeContext","createContext","toCssLength","value","numericValue","Table","bleed","dense","grid","striped","selectionType","maxHeight","className","props","scrollsVertically","containerClassNames","clsx","containerStyle","tableClassNames","RACTable","TableColumn","align","classNames","RACColumn","allowsSorting","sortDirection","jsx","jsxs","Fragment","IconChevronDown","IconChevronUp","TableBody","RACTableBody","TableHead","columns","children","selectionBehavior","selectionMode","allowsDragging","useTableOptions","useContext","RACTableHeader","RACSelectionCheckbox","Checkbox","RACCollection","TableRow","id","otherProps","RACRow","TableCell","RACButton","Radio","RACCell"],"mappings":"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"}
+{"version":3,"file":"Table.js","sources":["../../../../../src/ui/primitives/Table/Table.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { IconChevronDown, IconChevronUp } from \"icons\";\nimport { Checkbox, Radio } from \"primitives\";\nimport { createContext, useContext, type CSSProperties } from \"react\";\nimport {\n  Button as RACButton,\n  Cell as RACCell,\n  Checkbox as RACSelectionCheckbox,\n  Collection as RACCollection,\n  Column as RACColumn,\n  Row as RACRow,\n  Table as RACTable,\n  TableBody as RACTableBody,\n  TableHeader as RACTableHeader,\n  useTableOptions,\n  type CellProps as RACCellProps,\n  type ColumnProps as RACColumnProps,\n  type RowProps as RACRowProps,\n  type TableBodyProps as RACTableBodyProps,\n  type TableHeaderProps as RACTableHeaderProps,\n  type TableProps as RACTableProps,\n} from \"react-aria-components\";\nimport \"./table.css\";\n\ntype TableAlign = \"start\" | \"center\" | \"right\";\n\n/**\n * Visual style of the built-in selection control rendered in the selection\n * column (header \"select all\" + per-row toggle). \"radio\" is for\n * `selectionMode=\"single\"` tables where a round, single-choice control reads\n * better than a checkbox — the header never renders a control either way\n * (there is no \"select all\" for a single choice).\n */\ntype SelectionType = \"checkbox\" | \"radio\";\nconst SelectionTypeContext = createContext<SelectionType>(\"checkbox\");\n\nfunction toCssLength(value: number | string): string {\n  const numericValue = Number(value);\n  const isUnitlessNumber =\n    `${value}`.trim() !== \"\" && Number.isFinite(numericValue);\n  return isUnitlessNumber ? `${numericValue}px` : `${value}`;\n}\n\nexport type TableProps = RACTableProps & {\n  bleed?: boolean;\n  dense?: boolean;\n  striped?: boolean;\n  selectionType?: SelectionType;\n  maxHeight?: number | string;\n};\nexport function Table({\n  bleed = false,\n  dense = false,\n  striped = false,\n  selectionType = \"checkbox\",\n  maxHeight,\n  className,\n  ...props\n}: TableProps) {\n  const scrollsVertically = maxHeight !== undefined;\n  const containerClassNames = clsx(\n    className,\n    \"table-container\",\n    bleed && \"table-container-bleed\",\n    scrollsVertically && \"table-container-scrollable\",\n  );\n  const containerStyle = scrollsVertically\n    ? ({ \"--table-max-height\": toCssLength(maxHeight) } as CSSProperties)\n    : undefined;\n  const tableClassNames = clsx(\n    \"sds-table\",\n    bleed && \"table-bleed\",\n    dense && \"table-dense\",\n    striped && \"sds-table-striped\",\n  );\n  return (\n    <div className={containerClassNames} style={containerStyle}>\n      <SelectionTypeContext.Provider value={selectionType}>\n        <RACTable className={tableClassNames} {...props} />\n      </SelectionTypeContext.Provider>\n    </div>\n  );\n}\n\nexport type TableColumnProps = RACColumnProps & {\n  align?: TableAlign;\n};\nexport function TableColumn({\n  align = \"start\",\n  className,\n  ...props\n}: TableColumnProps) {\n  const classNames = clsx(className, \"table-column\", `table-align-${align}`);\n  return (\n    <RACColumn className={classNames} {...props}>\n      {({ allowsSorting, sortDirection }) => (\n        <div className={clsx(\"table-column-inner\")}>\n          <>\n            {props.children}\n            {allowsSorting && (\n              <span\n                aria-hidden=\"true\"\n                className={clsx(\n                  \"sort-indicator\",\n                  !sortDirection && \"sort-indicator-unsorted\",\n                )}\n              >\n                {sortDirection === \"descending\" ? (\n                  <IconChevronDown />\n                ) : (\n                  <IconChevronUp />\n                )}\n              </span>\n            )}\n          </>\n        </div>\n      )}\n    </RACColumn>\n  );\n}\n\nexport type TableBodyProps<T> = RACTableBodyProps<T>;\nexport function TableBody<T extends object>({\n  className,\n  ...props\n}: TableBodyProps<T>) {\n  return <RACTableBody {...props} />;\n}\n\nexport type TableHeadProps<T> = RACTableHeaderProps<T>;\nexport function TableHead<T extends object>({\n  className,\n  columns,\n  children,\n  ...props\n}: TableHeadProps<T>) {\n  const { selectionBehavior, selectionMode, allowsDragging } =\n    useTableOptions();\n  const selectionType = useContext(SelectionTypeContext);\n  const classNames = clsx(className, \"table-head\");\n  return (\n    <RACTableHeader className={classNames} {...props}>\n      {/* Add extra columns for drag and drop and selection. */}\n      {allowsDragging && <TableColumn />}\n      {selectionBehavior === \"toggle\" && (\n        <TableColumn\n          className={clsx(\n            \"table-selection-col\",\n            selectionType === \"radio\" && \"table-selection-col--radio\",\n          )}\n        >\n          {selectionMode === \"multiple\" && (\n            <RACSelectionCheckbox slot=\"selection\" className=\"table-selection-checkbox\">\n              <Checkbox />\n            </RACSelectionCheckbox>\n          )}\n        </TableColumn>\n      )}\n      <RACCollection items={columns}>{children}</RACCollection>\n    </RACTableHeader>\n  );\n}\n\nexport type TableRowProps<T> = RACRowProps<T>;\nexport function TableRow<T extends object>({\n  id,\n  columns,\n  children,\n  className,\n  ...otherProps\n}: TableRowProps<T>) {\n  const { selectionBehavior, allowsDragging } = useTableOptions();\n  const selectionType = useContext(SelectionTypeContext);\n  const classNames = clsx(className, \"table-row\");\n  return (\n    <RACRow id={id} {...otherProps} className={classNames}>\n      {allowsDragging && (\n        <TableCell>\n          <RACButton slot=\"drag\">≡</RACButton>\n        </TableCell>\n      )}\n      {selectionBehavior === \"toggle\" && (\n        <TableCell\n          className={clsx(\n            \"table-selection-cell\",\n            selectionType === \"radio\" && \"table-selection-cell--radio\",\n          )}\n        >\n          <RACSelectionCheckbox slot=\"selection\" className=\"table-selection-checkbox\">\n            {selectionType === \"radio\" ? <Radio /> : <Checkbox />}\n          </RACSelectionCheckbox>\n        </TableCell>\n      )}\n      <RACCollection items={columns}>{children}</RACCollection>\n    </RACRow>\n  );\n}\n\nexport type TableCellProps = RACCellProps & { align?: TableAlign };\nexport function TableCell({\n  align = \"start\",\n  className,\n  ...props\n}: TableCellProps) {\n  const classNames = clsx(className, \"table-cell\", `table-align-${align}`);\n  return <RACCell className={classNames} {...props} />;\n}\n"],"names":["SelectionTypeContext","createContext","toCssLength","value","numericValue","Table","bleed","dense","striped","selectionType","maxHeight","className","props","scrollsVertically","containerClassNames","clsx","containerStyle","tableClassNames","RACTable","TableColumn","align","classNames","RACColumn","allowsSorting","sortDirection","jsx","jsxs","Fragment","IconChevronDown","IconChevronUp","TableBody","RACTableBody","TableHead","columns","children","selectionBehavior","selectionMode","allowsDragging","useTableOptions","useContext","RACTableHeader","RACSelectionCheckbox","Checkbox","RACCollection","TableRow","id","otherProps","RACRow","TableCell","RACButton","Radio","RACCell"],"mappings":"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"}

package/dist/types/ui/components/DataTable/DataTable.d.ts

@@ -6,6 +6,8 @@ export interface Column<T> {
     label: string;
     align?: "start" | "center" | "right";
     render?: (item: T) => ReactNode;
+    /** Marks the column that names the row for assistive technology. Defaults to the first column when no column sets it. */
+    isRowHeader?: boolean;
     /** When true, the header becomes clickable and the rows can be sorted by this column. */
     sortable?: boolean;
     /** Value used to sort this column. Defaults to `item[key]`. */
@@ -49,8 +51,6 @@ export interface DataTableProps<T extends {
      * renders a round control instead of a checkbox.
      */
     selectionType?: "checkbox" | "radio";
-    /** When true, draws vertical lines between columns. Off by default. */
-    grid?: boolean;
     /** Controlled selection state. Omit to let the table manage its own selection internally. */
     selectedKeys?: Selection;
     onSelectionChange?: (keys: Selection) => void;
@@ -59,6 +59,17 @@ export interface DataTableProps<T extends {
     /** Controlled sort state. Omit to let the table manage its own sorting internally. */
     sortDescriptor?: SortDescriptor;
     onSortChange?: (descriptor: SortDescriptor) => void;
+    /** Accessible name of the table. */
+    ariaLabel?: string;
+    /** Compact row height. Off by default. */
+    dense?: boolean;
+    /** Alternating row background. Off by default. */
+    striped?: boolean;
+    /**
+     * Caps the height of the table so its rows scroll inside it with a sticky header, keeping the
+     * pagination in view. A percentage needs a parent with a defined height. Off by default.
+     */
+    maxHeight?: number | string;
     searchPlaceholder?: string;
     searchKeys?: (keyof T)[];
     isLoading?: boolean;
@@ -78,5 +89,5 @@ export interface DataTableProps<T extends {
 }
 export declare function DataTable<T extends {
     id: string;
-}>({ columns, data, actions, rowActions, rowActionsLabel, selectable, selectionType, grid, selectedKeys, onSelectionChange, defaultSortDescriptor, sortDescriptor: controlledSortDescriptor, onSortChange, searchPlaceholder, searchKeys, isLoading, loadingMessage, emptyMessage, previousLabel, nextLabel, pageSize, nestedColumns, getNestedData, nestedLoadingMessage, nestedEmptyMessage, nestedSearchKeys, nestedSearchPlaceholder, nestedActions, nestedPageSize, }: DataTableProps<T>): import("react/jsx-runtime").JSX.Element;
+}>({ columns, data, actions, rowActions, rowActionsLabel, selectable, selectionType, selectedKeys, onSelectionChange, defaultSortDescriptor, sortDescriptor: controlledSortDescriptor, onSortChange, ariaLabel, dense, striped, maxHeight, searchPlaceholder, searchKeys, isLoading, loadingMessage, emptyMessage, previousLabel, nextLabel, pageSize, nestedColumns, getNestedData, nestedLoadingMessage, nestedEmptyMessage, nestedSearchKeys, nestedSearchPlaceholder, nestedActions, nestedPageSize, }: DataTableProps<T>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/types/ui/primitives/Table/Table.d.ts

@@ -12,12 +12,11 @@ type SelectionType = "checkbox" | "radio";
 export type TableProps = RACTableProps & {
     bleed?: boolean;
     dense?: boolean;
-    grid?: boolean;
     striped?: boolean;
     selectionType?: SelectionType;
     maxHeight?: number | string;
 };
-export declare function Table({ bleed, dense, grid, striped, selectionType, maxHeight, className, ...props }: TableProps): import("react/jsx-runtime").JSX.Element;
+export declare function Table({ bleed, dense, striped, selectionType, maxHeight, className, ...props }: TableProps): import("react/jsx-runtime").JSX.Element;
 export type TableColumnProps = RACColumnProps & {
     align?: TableAlign;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apipass/design-system",
-  "version": "6.2.0",
+  "version": "7.1.0",
   "type": "module",
   "description": "APIPass React Design System",
   "sideEffects": [