@12-apps/ui 6.11.0 → 6.11.1

package/dist/chunk-Q56BXYKT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/DataGrid/DataGrid.cells.tsx"],"sourcesContent":["/**\n * The DataGrid's cell and row renderers.\n *\n * Components rather than closures over the grid's scope: as inline `render*`\n * functions they could reach every piece of the component's state, which is how\n * the body grew past 700 lines. Each one now states exactly what it needs.\n */\nimport ArrowDownward from '@mui/icons-material/ArrowDownward';\nimport ArrowUpward from '@mui/icons-material/ArrowUpward';\nimport ExpandLess from '@mui/icons-material/ExpandLess';\nimport ExpandMore from '@mui/icons-material/ExpandMore';\nimport UnfoldMore from '@mui/icons-material/UnfoldMore';\nimport { Button, Checkbox, IconButton, TableCell, TableRow, Typography, useTheme } from '@mui/material';\nimport React from 'react';\n\nimport { cellValue } from './DataGrid.rows';\nimport type { DataGridModel } from './DataGrid.model';\nimport type { DataGridProps, GridColumn, GridSort } from './DataGrid.types';\n\n/** The glyph for a column's current sort state — unsorted included. */\nfunction SortIcon({ dir }: { dir: GridSort['dir'] | undefined }): React.JSX.Element {\n  if (!dir) return <UnfoldMore fontSize=\"small\" sx={{ opacity: 0.5 }} />;\n  return dir === 'asc' ? <ArrowUpward fontSize=\"small\" /> : <ArrowDownward fontSize=\"small\" />;\n}\n\n/** `aria-sort`'s three values, which are not the same words as `SortDirection`. */\nfunction ariaSort(dir: GridSort['dir'] | undefined): 'none' | 'ascending' | 'descending' {\n  if (!dir) return 'none';\n  return dir === 'asc' ? 'ascending' : 'descending';\n}\n\nexport interface HeaderCellProps<T extends Record<string, unknown>> {\n  column: GridColumn<T>;\n  sort: GridSort | undefined;\n  sortable: boolean;\n  stickyHeader: boolean;\n  headerHeight: number;\n  onSort: (columnId: string) => void;\n}\n\nexport function HeaderCell<T extends Record<string, unknown>>({\n  column,\n  sort,\n  sortable,\n  stickyHeader,\n  headerHeight,\n  onSort,\n}: HeaderCellProps<T>): React.JSX.Element {\n  const theme = useTheme();\n  const content = column.headerCell ? column.headerCell(column) : column.header;\n  return (\n    <TableCell\n      data-slot=\"header-cell\"\n      data-sort={sort?.dir ?? 'none'}\n      sx={{\n        position: stickyHeader ? 'sticky' : 'static',\n        top: 0,\n        zIndex: 1,\n        backgroundColor: theme.palette.background.paper,\n        borderBottom: `1px solid ${theme.palette.divider}`,\n        height: headerHeight,\n        minWidth: column.minWidth,\n        maxWidth: column.maxWidth,\n        width: column.width,\n      }}\n      role=\"columnheader\"\n      aria-sort={ariaSort(sort?.dir)}\n    >\n      {sortable ? (\n        <Button\n          onClick={() => onSort(column.id)}\n          sx={{\n            justifyContent: 'flex-start',\n            textTransform: 'none',\n            fontWeight: 500,\n            color: 'inherit',\n            p: 0,\n            minWidth: 0,\n            '&:hover': { backgroundColor: 'transparent', opacity: 0.8 },\n          }}\n          endIcon={<SortIcon dir={sort?.dir} />}\n          aria-label={column.ariaLabel ?? `Sort by ${String(column.header)}`}\n        >\n          {content}\n        </Button>\n      ) : (\n        <Typography variant=\"subtitle2\" fontWeight={500}>\n          {content}\n        </Typography>\n      )}\n    </TableCell>\n  );\n}\n\nexport interface DataCellProps<T extends Record<string, unknown>> {\n  row: T;\n  rowIndex: number;\n  rowId: string | number;\n  column: GridColumn<T>;\n  rowHeight: number;\n  editing: NonNullable<DataGridProps<T>['editing']>;\n  model: Pick<DataGridModel<T>, 'editingCell' | 'setEditingCell'>;\n}\n\nexport function DataCell<T extends Record<string, unknown>>({\n  row,\n  rowIndex,\n  rowId,\n  column,\n  rowHeight,\n  editing,\n  model,\n}: DataCellProps<T>): React.JSX.Element {\n  const value = cellValue(row, column);\n  const isEditing =\n    model.editingCell?.rowId === rowId && model.editingCell?.colId === column.id;\n  const content = column.cell\n    ? column.cell({ value, row, rowIndex, col: column })\n    : String(value ?? '');\n  return (\n    <TableCell\n      data-slot=\"cell\"\n      data-col-id={column.id}\n      data-editing={isEditing}\n      sx={{\n        minWidth: column.minWidth,\n        maxWidth: column.maxWidth,\n        width: column.width,\n        height: rowHeight,\n      }}\n      role=\"gridcell\"\n      tabIndex={-1}\n    >\n      {isEditing && column.editor\n        ? column.editor({\n            value,\n            row,\n            onChange: () => undefined,\n            commit: () => {\n              editing.onEditCommit?.({ rowId, colId: column.id, value, row });\n              model.setEditingCell(null);\n            },\n            cancel: () => model.setEditingCell(null),\n          })\n        : content}\n    </TableCell>\n  );\n}\n\nexport interface GridRowProps<T extends Record<string, unknown>> {\n  row: T;\n  index: number;\n  rowId: string | number;\n  isSelected: boolean;\n  isExpanded: boolean;\n  totalColumns: number;\n  model: DataGridModel<T>;\n  props: DataGridProps<T>;\n}\n\n/** The leading checkbox / chevron cells, which exist only for enabled features. */\nfunction RowControls<T extends Record<string, unknown>>({\n  index,\n  rowId,\n  isSelected,\n  isExpanded,\n  model,\n  props,\n}: GridRowProps<T>): React.JSX.Element {\n  const { selection = { mode: 'none' }, expansion } = props;\n  return (\n    <>\n      {selection.mode !== 'none' && (\n        <TableCell padding=\"checkbox\">\n          <Checkbox\n            checked={isSelected}\n            onChange={(event) => model.onToggleRow(rowId, event.target.checked)}\n            inputProps={{ 'aria-label': `Select row ${index + 1}` }}\n          />\n        </TableCell>\n      )}\n      {expansion && (\n        <TableCell padding=\"checkbox\">\n          <IconButton\n            size=\"small\"\n            onClick={() => model.onToggleExpansion(rowId)}\n            aria-label={isExpanded ? 'Collapse row' : 'Expand row'}\n          >\n            {isExpanded ? <ExpandLess /> : <ExpandMore />}\n          </IconButton>\n        </TableCell>\n      )}\n    </>\n  );\n}\n\nexport function GridRow<T extends Record<string, unknown>>(\n  rowProps: GridRowProps<T>,\n): React.JSX.Element {\n  const { row, index, rowId, isSelected, isExpanded, totalColumns, model, props } = rowProps;\n  const theme = useTheme();\n  const expansion = props.expansion;\n  return (\n    <React.Fragment>\n      <TableRow\n        data-slot=\"row\"\n        data-selected={isSelected}\n        data-expanded={isExpanded}\n        sx={{\n          '&:hover': { backgroundColor: theme.palette.action.hover },\n          ...(isSelected && { backgroundColor: theme.palette.action.selected }),\n          height: model.rowHeight,\n        }}\n        role=\"row\"\n        aria-selected={isSelected}\n      >\n        <RowControls {...rowProps} />\n        {model.visibleColumns.map((column) => (\n          <DataCell\n            key={column.id}\n            row={row}\n            rowIndex={index}\n            rowId={rowId}\n            column={column}\n            rowHeight={model.rowHeight}\n            editing={props.editing ?? { mode: 'none' }}\n            model={model}\n          />\n        ))}\n      </TableRow>\n      {expansion && isExpanded && (\n        <TableRow>\n          <TableCell colSpan={totalColumns}>{expansion.render(row, index)}</TableCell>\n        </TableRow>\n      )}\n    </React.Fragment>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-Q72ZRUOB.js

@@ -0,0 +1,308 @@
+import {
+  useVirtualScrolling
+} from "./chunk-UUXNFPCP.js";
+
+// src/components/data-display/Table/TableParts.hooks.tsx
+import { useCallback as useCallback2 } from "react";
+
+// src/components/data-display/Table/TableParts.tsx
+import {
+  Box,
+  Checkbox,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableRow,
+  TableSortLabel
+} from "@mui/material";
+import React, { useCallback } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var ariaSortFor = (canSort, isSorted, direction) => {
+  if (!canSort || !isSorted) return void 0;
+  return direction === "asc" ? "ascending" : "descending";
+};
+var HeaderCell = ({ column, sortable, sortConfig, onSort }) => {
+  const canSort = Boolean(sortable) && column.sortable !== false;
+  const isSorted = sortConfig?.key === column.key;
+  return /* @__PURE__ */ jsx(
+    TableCell,
+    {
+      align: column.align || "left",
+      style: { minWidth: column.minWidth, width: column.width },
+      "aria-sort": ariaSortFor(canSort, isSorted, sortConfig?.direction),
+      children: canSort ? /* @__PURE__ */ jsx(
+        TableSortLabel,
+        {
+          active: isSorted,
+          direction: isSorted ? sortConfig?.direction : "asc",
+          onClick: () => onSort(column.key),
+          "data-testid": "sort-indicator",
+          "aria-label": `Sort by ${column.label}`,
+          children: column.label
+        }
+      ) : column.label
+    }
+  );
+};
+var EnhancedTableHeader = React.memo(({
+  columns,
+  data,
+  sortable,
+  sortConfig,
+  onSortChange,
+  selectable,
+  selectedRows = [],
+  onSelectAll
+}) => {
+  const handleSort = useCallback(
+    (columnKey) => {
+      if (!sortable || !onSortChange) return;
+      const direction = sortConfig?.key === columnKey && sortConfig.direction === "asc" ? "desc" : "asc";
+      onSortChange(columnKey, direction);
+    },
+    [sortable, onSortChange, sortConfig]
+  );
+  const handleSelectAll = useCallback(
+    (event) => {
+      if (!onSelectAll) return;
+      onSelectAll(event.target.checked);
+    },
+    [onSelectAll]
+  );
+  return /* @__PURE__ */ jsx(TableHead, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
+    selectable && /* @__PURE__ */ jsx(TableCell, { padding: "checkbox", children: /* @__PURE__ */ jsx(
+      Checkbox,
+      {
+        indeterminate: selectedRows.length > 0 && selectedRows.length < data.length,
+        checked: selectedRows.length === data.length && data.length > 0,
+        onChange: handleSelectAll,
+        inputProps: { "aria-label": "select all" }
+      }
+    ) }),
+    columns.map((column) => /* @__PURE__ */ jsx(
+      HeaderCell,
+      {
+        column,
+        sortable,
+        sortConfig,
+        onSort: handleSort
+      },
+      column.key
+    ))
+  ] }) });
+});
+EnhancedTableHeader.displayName = "EnhancedTableHeader";
+var TableDataRow = ({
+  rowData,
+  rowKey,
+  index,
+  offsetY,
+  columns,
+  selected,
+  selectable,
+  rowHeight,
+  onRowClick,
+  onRowFocus,
+  onRowBlur,
+  onSelect,
+  virtualScrolling,
+  renderCell
+}) => /* @__PURE__ */ jsxs(
+  TableRow,
+  {
+    selected,
+    className: selected ? "selected" : "",
+    onClick: (event) => onRowClick?.(event, rowData),
+    onFocus: (event) => onRowFocus?.(event, rowData),
+    onBlur: (event) => onRowBlur?.(event, rowData),
+    style: virtualScrolling ? {
+      transform: `translateY(${offsetY}px)`,
+      position: "absolute",
+      top: 0,
+      left: 0,
+      right: 0,
+      height: rowHeight
+    } : void 0,
+    children: [
+      selectable && /* @__PURE__ */ jsx(TableCell, { padding: "checkbox", children: /* @__PURE__ */ jsx(
+        Checkbox,
+        {
+          checked: selected,
+          onChange: (event) => onSelect(event, rowKey),
+          onClick: (event) => event.stopPropagation(),
+          inputProps: { "aria-label": `select row ${index + 1}` }
+        }
+      ) }),
+      columns.map((column) => {
+        const value = rowData[column.key];
+        return /* @__PURE__ */ jsx(TableCell, { align: column.align || "left", children: renderCell ? renderCell(value, column, rowData, index) : column.render ? column.render(value, rowData) : value }, column.key);
+      })
+    ]
+  },
+  String(rowKey)
+);
+var VirtualisedBody = ({ visibleItems, rowHeight, containerHeight, onScroll, renderTableRow }) => /* @__PURE__ */ jsx(
+  Box,
+  {
+    onScroll,
+    style: {
+      height: containerHeight,
+      overflow: "auto",
+      position: "relative"
+    },
+    children: /* @__PURE__ */ jsx(
+      TableBody,
+      {
+        style: {
+          height: visibleItems.totalHeight,
+          position: "relative"
+        },
+        children: visibleItems.items.map(
+          (rowData, index) => renderTableRow(rowData, visibleItems.startIndex + index, visibleItems.offsetY + index * rowHeight)
+        )
+      }
+    )
+  }
+);
+var PlainBody = ({ data, renderTableRow }) => /* @__PURE__ */ jsx(TableBody, { children: data.map((rowData, index) => renderTableRow(rowData, index)) });
+var EnhancedTableBody = React.memo(({
+  data,
+  columns,
+  selectedRows = [],
+  onRowClick,
+  onRowFocus,
+  onRowBlur,
+  onSelectionChange,
+  rowKeyExtractor,
+  selectable,
+  renderRow,
+  renderCell,
+  virtualScrolling,
+  containerHeight,
+  rowHeight,
+  overscan = 5
+}) => {
+  const renderTableRow = useTableRowRenderer({
+    columns,
+    selectedRows,
+    onRowClick,
+    onRowFocus,
+    onRowBlur,
+    onSelectionChange,
+    rowKeyExtractor,
+    selectable,
+    renderRow,
+    renderCell,
+    virtualScrolling,
+    rowHeight
+  });
+  const { visibleItems, handleScroll } = useVirtualScrolling(
+    data,
+    rowHeight || 40,
+    typeof containerHeight === "number" ? containerHeight : 400,
+    overscan
+  );
+  if (virtualScrolling && containerHeight && rowHeight) {
+    return /* @__PURE__ */ jsx(
+      VirtualisedBody,
+      {
+        visibleItems,
+        rowHeight,
+        containerHeight,
+        onScroll: handleScroll,
+        renderTableRow
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(PlainBody, { data, renderTableRow });
+});
+EnhancedTableBody.displayName = "EnhancedTableBody";
+
+// src/components/data-display/Table/TableParts.hooks.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var useRowKey = (rowKeyExtractor) => useCallback2(
+  (rowData, index) => rowKeyExtractor ? rowKeyExtractor(rowData, index) : rowData.id || index,
+  [rowKeyExtractor]
+);
+var useRowSelection = ({
+  selectedRows,
+  onSelectionChange
+}) => useCallback2(
+  (event, rowKey) => {
+    event.stopPropagation();
+    if (!onSelectionChange) return;
+    onSelectionChange(rowKey, !selectedRows.includes(rowKey));
+  },
+  [onSelectionChange, selectedRows]
+);
+var useTableRowRenderer = ({
+  columns,
+  selectedRows,
+  onRowClick,
+  onRowFocus,
+  onRowBlur,
+  onSelectionChange,
+  rowKeyExtractor,
+  selectable,
+  renderRow,
+  renderCell,
+  virtualScrolling,
+  rowHeight
+}) => {
+  const getRowKey = useRowKey(rowKeyExtractor);
+  const isRowSelected = useCallback2(
+    (rowKey) => selectedRows.includes(rowKey),
+    [selectedRows]
+  );
+  const handleRowSelection = useRowSelection({ selectedRows, onSelectionChange });
+  const renderTableRow = useCallback2(
+    (rowData, index, offsetY = 0) => {
+      const rowKey = getRowKey(rowData, index);
+      const selected = isRowSelected(rowKey);
+      if (renderRow) return renderRow(rowData, index, selected);
+      return /* @__PURE__ */ jsx2(
+        TableDataRow,
+        {
+          rowData,
+          rowKey,
+          index,
+          offsetY,
+          columns,
+          selected,
+          selectable,
+          rowHeight,
+          onRowClick,
+          onRowFocus,
+          onRowBlur,
+          onSelect: handleRowSelection,
+          virtualScrolling,
+          renderCell
+        },
+        rowKey
+      );
+    },
+    [
+      columns,
+      getRowKey,
+      isRowSelected,
+      handleRowSelection,
+      onRowClick,
+      onRowFocus,
+      onRowBlur,
+      renderRow,
+      renderCell,
+      rowHeight,
+      selectable,
+      virtualScrolling
+    ]
+  );
+  return renderTableRow;
+};
+
+export {
+  useTableRowRenderer,
+  EnhancedTableHeader,
+  TableDataRow,
+  EnhancedTableBody
+};
+//# sourceMappingURL=chunk-Q72ZRUOB.js.map

package/dist/chunk-Q72ZRUOB.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Table/TableParts.hooks.tsx","../src/components/data-display/Table/TableParts.tsx"],"sourcesContent":["import type React from 'react';\nimport { useCallback } from 'react';\n\nimport { TableDataRow } from './TableParts';\nimport type { TableBodyProps } from './Table.types';\n\n// Row identity, selection and the row element itself. Split out of\n// EnhancedTableBody so that component is just the virtualised/plain choice.\n// A row's identity: the caller's extractor, else its id, else its position.\nconst useRowKey = (rowKeyExtractor: TableBodyProps['rowKeyExtractor']) =>\n  useCallback(\n    (rowData: Record<string, unknown>, index: number): string | number =>\n      rowKeyExtractor ? rowKeyExtractor(rowData, index) : (rowData.id as string | number) || index,\n    [rowKeyExtractor],\n  );\n\nconst useRowSelection = ({\n  selectedRows,\n  onSelectionChange,\n}: {\n  selectedRows: Array<string | number>;\n  onSelectionChange: TableBodyProps['onSelectionChange'];\n}) =>\n  useCallback(\n    (event: React.MouseEvent | React.ChangeEvent, rowKey: string | number) => {\n      // Stop propagation so selecting does not also fire the row click.\n      event.stopPropagation();\n      if (!onSelectionChange) return;\n      onSelectionChange(rowKey, !selectedRows.includes(rowKey));\n    },\n    [onSelectionChange, selectedRows],\n  );\n\nexport const useTableRowRenderer = ({\n  columns,\n  selectedRows,\n  onRowClick,\n  onRowFocus,\n  onRowBlur,\n  onSelectionChange,\n  rowKeyExtractor,\n  selectable,\n  renderRow,\n  renderCell,\n  virtualScrolling,\n  rowHeight,\n}: Pick<\n  TableBodyProps,\n  | 'columns'\n  | 'onRowClick'\n  | 'onRowFocus'\n  | 'onRowBlur'\n  | 'onSelectionChange'\n  | 'rowKeyExtractor'\n  | 'selectable'\n  | 'renderRow'\n  | 'renderCell'\n  | 'virtualScrolling'\n  | 'rowHeight'\n> & { selectedRows: Array<string | number> }) => {\n  const getRowKey = useRowKey(rowKeyExtractor);\n  const isRowSelected = useCallback(\n    (rowKey: string | number) => selectedRows.includes(rowKey),\n    [selectedRows],\n  );\n  const handleRowSelection = useRowSelection({ selectedRows, onSelectionChange });\n\n  const renderTableRow = useCallback(\n    (rowData: Record<string, unknown>, index: number, offsetY: number = 0) => {\n      const rowKey = getRowKey(rowData, index);\n      const selected = isRowSelected(rowKey);\n\n      if (renderRow) return renderRow(rowData, index, selected);\n\n      return (\n        <TableDataRow\n          key={rowKey}\n          rowData={rowData}\n          rowKey={rowKey}\n          index={index}\n          offsetY={offsetY}\n          columns={columns}\n          selected={selected}\n          selectable={selectable}\n          rowHeight={rowHeight}\n          onRowClick={onRowClick}\n          onRowFocus={onRowFocus}\n          onRowBlur={onRowBlur}\n          onSelect={handleRowSelection}\n          virtualScrolling={virtualScrolling}\n          renderCell={renderCell}\n        />\n      );\n    },\n    [\n      columns,\n      getRowKey,\n      isRowSelected,\n      handleRowSelection,\n      onRowClick,\n      onRowFocus,\n      onRowBlur,\n      renderRow,\n      renderCell,\n      rowHeight,\n      selectable,\n      virtualScrolling,\n    ],\n  );\n\n  return renderTableRow;\n};\n","import {\n  Box,\n  Checkbox,\n  TableBody,\n  TableCell,\n  TableHead,\n  TableRow,\n  TableSortLabel } from '@mui/material';\nimport React, { useCallback } from 'react';\n\nimport { useVirtualScrolling } from './Table.hooks';\nimport { useTableRowRenderer } from './TableParts.hooks';\nimport type { ColumnConfig, TableBodyProps, TableHeaderProps } from './Table.types';\n\n// Mirrors the visible sort indicator for assistive technology; undefined when\n// the column is not sorted, which is what removes the attribute entirely.\nconst ariaSortFor = (\n  canSort: boolean,\n  isSorted: boolean,\n  direction?: 'asc' | 'desc',\n): 'ascending' | 'descending' | undefined => {\n  if (!canSort || !isSorted) return undefined;\n\n  return direction === 'asc' ? 'ascending' : 'descending';\n};\n\n// One header cell. Sorting is offered when the table is sortable and the column\n// has not opted out; aria-sort mirrors the visible indicator.\nconst HeaderCell: React.FC<{\n  column: ColumnConfig;\n  sortable?: boolean;\n  sortConfig?: { key: string; direction: 'asc' | 'desc' };\n  onSort: (columnKey: string) => void;\n}> = ({ column, sortable, sortConfig, onSort }) => {\n  const canSort = Boolean(sortable) && column.sortable !== false;\n  const isSorted = sortConfig?.key === column.key;\n\n  return (\n    <TableCell\n      align={column.align || 'left'}\n      style={{ minWidth: column.minWidth, width: column.width }}\n      aria-sort={ariaSortFor(canSort, isSorted, sortConfig?.direction)}\n    >\n      {canSort ? (\n        <TableSortLabel\n          active={isSorted}\n          direction={isSorted ? sortConfig?.direction : 'asc'}\n          onClick={() => onSort(column.key)}\n          data-testid=\"sort-indicator\"\n          aria-label={`Sort by ${column.label}`}\n        >\n          {column.label}\n        </TableSortLabel>\n      ) : (\n        column.label\n      )}\n    </TableCell>\n  );\n};\n\nexport const EnhancedTableHeader: React.FC<TableHeaderProps> = React.memo(({\n  columns,\n  data,\n  sortable,\n  sortConfig,\n  onSortChange,\n  selectable,\n  selectedRows = [],\n  onSelectAll }) => {\n  const handleSort = useCallback(\n    (columnKey: string) => {\n      if (!sortable || !onSortChange) return;\n      \n      const direction = \n        sortConfig?.key === columnKey && sortConfig.direction === 'asc' ? 'desc' : 'asc';\n      onSortChange(columnKey, direction);\n    },\n    [sortable, onSortChange, sortConfig]\n  );\n\n  const handleSelectAll = useCallback(\n    (event: React.ChangeEvent<globalThis.HTMLInputElement>) => {\n      if (!onSelectAll) return;\n      onSelectAll(event.target.checked);\n    },\n    [onSelectAll]\n  );\n\n  return (\n    <TableHead>\n      <TableRow>\n        {selectable && (\n          <TableCell padding=\"checkbox\">\n            <Checkbox\n              indeterminate={selectedRows.length > 0 && selectedRows.length < data.length}\n              checked={selectedRows.length === data.length && data.length > 0}\n              onChange={handleSelectAll}\n              inputProps={{ 'aria-label': 'select all' }}\n            />\n          </TableCell>\n        )}\n        {columns.map((column) => (\n          <HeaderCell\n            key={column.key}\n            column={column}\n            sortable={sortable}\n            sortConfig={sortConfig}\n            onSort={handleSort}\n          />\n        ))}\n      </TableRow>\n    </TableHead>\n  );\n});\n\nEnhancedTableHeader.displayName = 'EnhancedTableHeader';\n\n// One data row. Split out of the memoised renderTableRow callback so the\n// callback stays a short dispatch and the row markup is readable on its own.\nexport const TableDataRow: React.FC<{\n  rowData: Record<string, unknown>;\n  rowKey: string | number;\n  index: number;\n  offsetY: number;\n  columns: ColumnConfig[];\n  selected: boolean;\n  selectable?: boolean;\n  rowHeight?: number;\n  onRowClick?: TableBodyProps['onRowClick'];\n  onRowFocus?: TableBodyProps['onRowFocus'];\n  onRowBlur?: TableBodyProps['onRowBlur'];\n  onSelect: (event: React.MouseEvent | React.ChangeEvent, rowKey: string | number) => void;\n  virtualScrolling?: boolean;\n  renderCell?: TableBodyProps['renderCell'];\n}> = ({\n  rowData,\n  rowKey,\n  index,\n  offsetY,\n  columns,\n  selected,\n  selectable,\n  rowHeight,\n  onRowClick,\n  onRowFocus,\n  onRowBlur,\n  onSelect,\n  virtualScrolling,\n  renderCell }) => (\n\n      <TableRow\n        key={String(rowKey)}\n        selected={selected}\n        className={selected ? 'selected' : ''}\n        onClick={(event: React.MouseEvent<globalThis.HTMLTableRowElement>) => onRowClick?.(event, rowData)}\n        onFocus={(event: React.FocusEvent<globalThis.HTMLTableRowElement>) => onRowFocus?.(event, rowData)}\n        onBlur={(event: React.FocusEvent<globalThis.HTMLTableRowElement>) => onRowBlur?.(event, rowData)}\n        style={virtualScrolling ? { \n          transform: `translateY(${offsetY}px)`,\n          position: 'absolute',\n          top: 0,\n          left: 0,\n          right: 0,\n          height: rowHeight } : undefined}\n      >\n        {selectable && (\n          <TableCell padding=\"checkbox\">\n            <Checkbox\n              checked={selected}\n              onChange={(event) => onSelect(event, rowKey)}\n              onClick={(event) => event.stopPropagation()}\n              inputProps={{ 'aria-label': `select row ${index + 1}` }}\n            />\n          </TableCell>\n        )}\n        {columns.map((column) => {\n          const value = rowData[column.key];\n          return (\n            <TableCell key={column.key} align={column.align || 'left'}>\n              {renderCell \n                ? renderCell(value, column, rowData, index)\n                : column.render \n                ? column.render(value, rowData) \n                : (value as React.ReactNode)\n              }\n            </TableCell>\n          );\n        })}\n      </TableRow>\n);\n\n// Only the rows in view are rendered, positioned by absolute offset inside a\n// spacer sized to the full data set.\nconst VirtualisedBody: React.FC<{\n  visibleItems: {\n    items: Record<string, unknown>[];\n    startIndex: number;\n    offsetY: number;\n    totalHeight: number;\n  };\n  rowHeight: number;\n  containerHeight: number;\n  onScroll: (event: React.UIEvent<HTMLDivElement>) => void;\n  renderTableRow: (\n    rowData: Record<string, unknown>,\n    index: number,\n    offsetY?: number,\n  ) => React.ReactNode;\n}> = ({ visibleItems, rowHeight, containerHeight, onScroll, renderTableRow }) => (\n\n    <Box\n      onScroll={onScroll}\n      style={{\n        height: containerHeight,\n        overflow: 'auto',\n        position: 'relative' }}\n    >\n      <TableBody\n        style={{\n          height: visibleItems.totalHeight,\n          position: 'relative' }}\n      >\n        {visibleItems.items.map((rowData, index) => \n          renderTableRow(rowData, visibleItems.startIndex + index, visibleItems.offsetY + index * rowHeight)\n        )}\n      </TableBody>\n    </Box>\n  \n);\n\nconst PlainBody: React.FC<{\n  data: TableBodyProps['data'];\n  renderTableRow: (rowData: Record<string, unknown>, index: number) => React.ReactNode;\n}> = ({ data, renderTableRow }) => (\n\n    <TableBody>\n      {data.map((rowData, index) => renderTableRow(rowData, index))}\n    </TableBody>\n);\n\n// Enhanced Table Body Component  \nexport const EnhancedTableBody: React.FC<TableBodyProps> = React.memo(({\n  data,\n  columns,\n  selectedRows = [],\n  onRowClick,\n  onRowFocus,\n  onRowBlur,\n  onSelectionChange,\n  rowKeyExtractor,\n  selectable,\n  renderRow,\n  renderCell,\n  virtualScrolling,\n  containerHeight,\n  rowHeight,\n  overscan = 5 }) => {\n  const renderTableRow = useTableRowRenderer({\n    columns,\n    selectedRows,\n    onRowClick,\n    onRowFocus,\n    onRowBlur,\n    onSelectionChange,\n    rowKeyExtractor,\n    selectable,\n    renderRow,\n    renderCell,\n    virtualScrolling,\n    rowHeight });\n\n  const { visibleItems, handleScroll } = useVirtualScrolling(\n    data, \n    rowHeight || 40, \n    typeof containerHeight === 'number' ? containerHeight : 400, \n    overscan\n  );\n\n  if (virtualScrolling && containerHeight && rowHeight) {\n    return (\n      <VirtualisedBody\n        visibleItems={visibleItems}\n        rowHeight={rowHeight}\n        containerHeight={containerHeight}\n        onScroll={handleScroll}\n        renderTableRow={renderTableRow}\n      />\n    );\n  }\n\n  return (\n    <PlainBody data={data} renderTableRow={renderTableRow} />\n  );\n});\n\nEnhancedTableBody.displayName = 'EnhancedTableBody';\n\n// Main Table Component\n"],"mappings":"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","names":["useCallback","jsx","useCallback"]}

package/dist/chunk-QBJVRPTF.js

@@ -0,0 +1,55 @@
+import {
+  handleCategoryKeyDown
+} from "./chunk-GCC66ZSD.js";
+
+// src/components/form/CategorySelect/useCategoryKeyHandler.ts
+import { useCallback } from "react";
+function useCategoryKeyHandler({
+  state,
+  single,
+  allowParentSelection,
+  actions
+}) {
+  const { isExpanded, toggleExpanded } = state;
+  const expand = useCallback(
+    (id) => {
+      if (!isExpanded(id)) toggleExpanded(id);
+    },
+    [isExpanded, toggleExpanded]
+  );
+  const collapse = useCallback(
+    (id) => {
+      if (isExpanded(id)) toggleExpanded(id);
+    },
+    [isExpanded, toggleExpanded]
+  );
+  return useCallback(
+    (event) => {
+      const inSearchField = event.target?.tagName === "INPUT";
+      const editingText = inSearchField && state.query.length > 0;
+      const consumed = handleCategoryKeyDown(event.key, editingText, {
+        rows: state.rows,
+        activeIndex: state.activeIndex,
+        groups: state.visibleGroups,
+        single,
+        allowParentSelection,
+        setActiveIndex: state.setActiveIndex,
+        toggleExpanded,
+        expand,
+        collapse,
+        toggleCategory: state.toggleCategory,
+        toggleSubcategory: state.toggleSubcategory,
+        commit: actions.commit,
+        cancel: actions.cancel,
+        pick: actions.pick
+      });
+      if (consumed) event.preventDefault();
+    },
+    [state, single, allowParentSelection, toggleExpanded, expand, collapse, actions]
+  );
+}
+
+export {
+  useCategoryKeyHandler
+};
+//# sourceMappingURL=chunk-QBJVRPTF.js.map

package/dist/chunk-QBJVRPTF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/CategorySelect/useCategoryKeyHandler.ts"],"sourcesContent":["import { useCallback } from 'react';\n\nimport { handleCategoryKeyDown } from './category-keyboard';\nimport type { CategoryActions } from './useCategoryCommit';\nimport type { CategorySelectState } from './useCategorySelect';\n\ninterface UseCategoryKeyHandlerArgs {\n  state: CategorySelectState;\n  single: boolean;\n  allowParentSelection: boolean;\n  actions: CategoryActions;\n}\n\n/**\n * Bind the panel's keydown to the tree navigator.\n *\n * `preventDefault` fires only for keys the navigator actually consumed, so an\n * unhandled key still reaches the search box — otherwise typing would be dead.\n */\nexport function useCategoryKeyHandler({\n  state,\n  single,\n  allowParentSelection,\n  actions,\n}: UseCategoryKeyHandlerArgs): (event: React.KeyboardEvent) => void {\n  const { isExpanded, toggleExpanded } = state;\n\n  const expand = useCallback(\n    (id: string) => {\n      if (!isExpanded(id)) toggleExpanded(id);\n    },\n    [isExpanded, toggleExpanded],\n  );\n\n  const collapse = useCallback(\n    (id: string) => {\n      if (isExpanded(id)) toggleExpanded(id);\n    },\n    [isExpanded, toggleExpanded],\n  );\n\n  return useCallback(\n    (event: React.KeyboardEvent) => {\n      const inSearchField = (event.target as HTMLElement | null)?.tagName === 'INPUT';\n      const editingText = inSearchField && state.query.length > 0;\n      const consumed = handleCategoryKeyDown(event.key, editingText, {\n        rows: state.rows,\n        activeIndex: state.activeIndex,\n        groups: state.visibleGroups,\n        single,\n        allowParentSelection,\n        setActiveIndex: state.setActiveIndex,\n        toggleExpanded,\n        expand,\n        collapse,\n        toggleCategory: state.toggleCategory,\n        toggleSubcategory: state.toggleSubcategory,\n        commit: actions.commit,\n        cancel: actions.cancel,\n        pick: actions.pick,\n      });\n      if (consumed) event.preventDefault();\n    },\n    [state, single, allowParentSelection, toggleExpanded, expand, collapse, actions],\n  );\n}\n"],"mappings":";;;;;AAAA,SAAS,mBAAmB;AAmBrB,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAoE;AAClE,QAAM,EAAE,YAAY,eAAe,IAAI;AAEvC,QAAM,SAAS;AAAA,IACb,CAAC,OAAe;AACd,UAAI,CAAC,WAAW,EAAE,EAAG,gBAAe,EAAE;AAAA,IACxC;AAAA,IACA,CAAC,YAAY,cAAc;AAAA,EAC7B;AAEA,QAAM,WAAW;AAAA,IACf,CAAC,OAAe;AACd,UAAI,WAAW,EAAE,EAAG,gBAAe,EAAE;AAAA,IACvC;AAAA,IACA,CAAC,YAAY,cAAc;AAAA,EAC7B;AAEA,SAAO;AAAA,IACL,CAAC,UAA+B;AAC9B,YAAM,gBAAiB,MAAM,QAA+B,YAAY;AACxE,YAAM,cAAc,iBAAiB,MAAM,MAAM,SAAS;AAC1D,YAAM,WAAW,sBAAsB,MAAM,KAAK,aAAa;AAAA,QAC7D,MAAM,MAAM;AAAA,QACZ,aAAa,MAAM;AAAA,QACnB,QAAQ,MAAM;AAAA,QACd;AAAA,QACA;AAAA,QACA,gBAAgB,MAAM;AAAA,QACtB;AAAA,QACA;AAAA,QACA;AAAA,QACA,gBAAgB,MAAM;AAAA,QACtB,mBAAmB,MAAM;AAAA,QACzB,QAAQ,QAAQ;AAAA,QAChB,QAAQ,QAAQ;AAAA,QAChB,MAAM,QAAQ;AAAA,MAChB,CAAC;AACD,UAAI,SAAU,OAAM,eAAe;AAAA,IACrC;AAAA,IACA,CAAC,OAAO,QAAQ,sBAAsB,gBAAgB,QAAQ,UAAU,OAAO;AAAA,EACjF;AACF;","names":[]}

package/dist/chunk-QDNQGWEW.js

@@ -0,0 +1,67 @@
+// src/components/data-display/Chart/ChartComposables.tsx
+import { Box, Paper, Typography, useTheme } from "@mui/material";
+import { Legend, ResponsiveContainer, Tooltip } from "recharts";
+import { jsx, jsxs } from "react/jsx-runtime";
+var ChartTooltip = Tooltip;
+var ChartLegend = Legend;
+var ChartContainer = ({
+  height,
+  width = "100%",
+  responsive = true,
+  children,
+  "data-testid": dataTestId
+}) => {
+  if (!responsive) {
+    return /* @__PURE__ */ jsx(Box, { sx: { width, height }, "data-testid": dataTestId, children });
+  }
+  return /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height, "data-testid": dataTestId, children });
+};
+var ChartTooltipContent = ({
+  active,
+  label,
+  payload,
+  valueFormatter
+}) => {
+  const theme = useTheme();
+  if (!active || !payload || payload.length === 0) return null;
+  const formatValue = (value) => {
+    if (typeof value === "number" && valueFormatter) return valueFormatter(value);
+    return value ?? "";
+  };
+  return /* @__PURE__ */ jsxs(Paper, { elevation: 4, sx: { px: 1.5, py: 1, border: `1px solid ${theme.palette.divider}` }, children: [
+    label !== void 0 && label !== "" && /* @__PURE__ */ jsx(Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mb: 0.5 }, children: label }),
+    payload.map((entry, index) => /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+      /* @__PURE__ */ jsx(
+        Box,
+        {
+          component: "span",
+          sx: { width: 10, height: 10, borderRadius: "2px", backgroundColor: entry.color, flexShrink: 0 }
+        }
+      ),
+      /* @__PURE__ */ jsx(Typography, { variant: "body2", sx: { color: "text.secondary" }, children: entry.name }),
+      /* @__PURE__ */ jsx(Typography, { variant: "body2", sx: { ml: "auto", fontWeight: 600 }, children: formatValue(entry.value) })
+    ] }, index))
+  ] });
+};
+var ChartLegendContent = ({ payload }) => {
+  if (!payload || payload.length === 0) return null;
+  return /* @__PURE__ */ jsx(Box, { sx: { display: "flex", flexWrap: "wrap", justifyContent: "center", gap: 2, pt: 1 }, children: payload.map((entry, index) => /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center", gap: 0.75 }, children: [
+    /* @__PURE__ */ jsx(
+      Box,
+      {
+        component: "span",
+        sx: { width: 10, height: 10, borderRadius: "2px", backgroundColor: entry.color, flexShrink: 0 }
+      }
+    ),
+    /* @__PURE__ */ jsx(Typography, { variant: "caption", sx: { color: "text.secondary" }, children: entry.value })
+  ] }, index)) });
+};
+
+export {
+  ChartTooltip,
+  ChartLegend,
+  ChartContainer,
+  ChartTooltipContent,
+  ChartLegendContent
+};
+//# sourceMappingURL=chunk-QDNQGWEW.js.map

package/dist/chunk-QDNQGWEW.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Chart/ChartComposables.tsx"],"sourcesContent":["import { Box, Paper, Typography, useTheme } from '@mui/material';\nimport React from 'react';\nimport { Legend, ResponsiveContainer, Tooltip } from 'recharts';\n\n/**\n * Raw chart composables (Squire's ChartConfig pattern, MUI-themed): a\n * responsive container plus themed tooltip/legend content renderers. The\n * prop-driven `Chart` uses these internally; consumers building bespoke\n * Recharts compositions can reuse them directly.\n */\n\n/** Recharts' Tooltip/Legend re-exported so bespoke compositions can pair them\n * with the themed content renderers below. */\nexport const ChartTooltip = Tooltip;\nexport const ChartLegend = Legend;\n\nexport interface ChartContainerProps {\n  /**\n   * A number of pixels, or a PERCENTAGE of the box this container is given.\n   *\n   * The difference is not cosmetic: Recharts sizes the chart from the number\n   * when it is one and only MEASURES its own box when it is a percentage\n   * (`calculateChartDimensions`). So a container stretched by its parent's\n   * layout goes on drawing a 300px chart inside a 600px box — visibly, as\n   * blank space under the plot — until the height is handed over as a percent.\n   */\n  height: number | `${number}%`;\n  width?: number | string;\n  responsive?: boolean;\n  children: React.ReactElement;\n  'data-testid'?: string;\n}\n\n/** Responsive wrapper for a Recharts chart element. */\nexport const ChartContainer: React.FC<ChartContainerProps> = ({\n  height,\n  width = '100%',\n  responsive = true,\n  children,\n  'data-testid': dataTestId,\n}) => {\n  if (!responsive) {\n    return (\n      <Box sx={{ width, height }} data-testid={dataTestId}>\n        {children}\n      </Box>\n    );\n  }\n  return (\n    <ResponsiveContainer width=\"100%\" height={height} data-testid={dataTestId}>\n      {children}\n    </ResponsiveContainer>\n  );\n};\n\ninterface TooltipEntry {\n  name?: string | number;\n  value?: string | number;\n  color?: string;\n}\n\nexport interface ChartTooltipContentProps {\n  active?: boolean;\n  label?: string | number;\n  payload?: TooltipEntry[];\n  /** Formats numeric values (e.g. centavos → BRL). */\n  valueFormatter?: (value: number) => string;\n}\n\n/** Theme-aware tooltip content (light/dark correct, semantic colors only). */\nexport const ChartTooltipContent: React.FC<ChartTooltipContentProps> = ({\n  active,\n  label,\n  payload,\n  valueFormatter,\n}) => {\n  const theme = useTheme();\n  if (!active || !payload || payload.length === 0) return null;\n  const formatValue = (value: TooltipEntry['value']): string | number => {\n    if (typeof value === 'number' && valueFormatter) return valueFormatter(value);\n    return value ?? '';\n  };\n  return (\n    <Paper elevation={4} sx={{ px: 1.5, py: 1, border: `1px solid ${theme.palette.divider}` }}>\n      {label !== undefined && label !== '' && (\n        <Typography variant=\"caption\" sx={{ color: 'text.secondary', display: 'block', mb: 0.5 }}>\n          {label}\n        </Typography>\n      )}\n      {payload.map((entry, index) => (\n        <Box key={index} sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>\n          <Box\n            component=\"span\"\n            sx={{ width: 10, height: 10, borderRadius: '2px', backgroundColor: entry.color, flexShrink: 0 }}\n          />\n          <Typography variant=\"body2\" sx={{ color: 'text.secondary' }}>\n            {entry.name}\n          </Typography>\n          <Typography variant=\"body2\" sx={{ ml: 'auto', fontWeight: 600 }}>\n            {formatValue(entry.value)}\n          </Typography>\n        </Box>\n      ))}\n    </Paper>\n  );\n};\n\nexport interface ChartLegendContentProps {\n  payload?: Array<{ value?: string | number; color?: string }>;\n}\n\n/** Theme-aware legend content matching the tooltip's swatch styling. */\nexport const ChartLegendContent: React.FC<ChartLegendContentProps> = ({ payload }) => {\n  if (!payload || payload.length === 0) return null;\n  return (\n    <Box sx={{ display: 'flex', flexWrap: 'wrap', justifyContent: 'center', gap: 2, pt: 1 }}>\n      {payload.map((entry, index) => (\n        <Box key={index} sx={{ display: 'flex', alignItems: 'center', gap: 0.75 }}>\n          <Box\n            component=\"span\"\n            sx={{ width: 10, height: 10, borderRadius: '2px', backgroundColor: entry.color, flexShrink: 0 }}\n          />\n          <Typography variant=\"caption\" sx={{ color: 'text.secondary' }}>\n            {entry.value}\n          </Typography>\n        </Box>\n      ))}\n    </Box>\n  );\n};\n"],"mappings":";AAAA,SAAS,KAAK,OAAO,YAAY,gBAAgB;AAEjD,SAAS,QAAQ,qBAAqB,eAAe;AAyC/C,cA+CE,YA/CF;AA9BC,IAAM,eAAe;AACrB,IAAM,cAAc;AAoBpB,IAAM,iBAAgD,CAAC;AAAA,EAC5D;AAAA,EACA,QAAQ;AAAA,EACR,aAAa;AAAA,EACb;AAAA,EACA,eAAe;AACjB,MAAM;AACJ,MAAI,CAAC,YAAY;AACf,WACE,oBAAC,OAAI,IAAI,EAAE,OAAO,OAAO,GAAG,eAAa,YACtC,UACH;AAAA,EAEJ;AACA,SACE,oBAAC,uBAAoB,OAAM,QAAO,QAAgB,eAAa,YAC5D,UACH;AAEJ;AAiBO,IAAM,sBAA0D,CAAC;AAAA,EACtE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,QAAQ,SAAS;AACvB,MAAI,CAAC,UAAU,CAAC,WAAW,QAAQ,WAAW,EAAG,QAAO;AACxD,QAAM,cAAc,CAAC,UAAkD;AACrE,QAAI,OAAO,UAAU,YAAY,eAAgB,QAAO,eAAe,KAAK;AAC5E,WAAO,SAAS;AAAA,EAClB;AACA,SACE,qBAAC,SAAM,WAAW,GAAG,IAAI,EAAE,IAAI,KAAK,IAAI,GAAG,QAAQ,aAAa,MAAM,QAAQ,OAAO,GAAG,GACrF;AAAA,cAAU,UAAa,UAAU,MAChC,oBAAC,cAAW,SAAQ,WAAU,IAAI,EAAE,OAAO,kBAAkB,SAAS,SAAS,IAAI,IAAI,GACpF,iBACH;AAAA,IAED,QAAQ,IAAI,CAAC,OAAO,UACnB,qBAAC,OAAgB,IAAI,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,EAAE,GACnE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,IAAI,EAAE,OAAO,IAAI,QAAQ,IAAI,cAAc,OAAO,iBAAiB,MAAM,OAAO,YAAY,EAAE;AAAA;AAAA,MAChG;AAAA,MACA,oBAAC,cAAW,SAAQ,SAAQ,IAAI,EAAE,OAAO,iBAAiB,GACvD,gBAAM,MACT;AAAA,MACA,oBAAC,cAAW,SAAQ,SAAQ,IAAI,EAAE,IAAI,QAAQ,YAAY,IAAI,GAC3D,sBAAY,MAAM,KAAK,GAC1B;AAAA,SAVQ,KAWV,CACD;AAAA,KACH;AAEJ;AAOO,IAAM,qBAAwD,CAAC,EAAE,QAAQ,MAAM;AACpF,MAAI,CAAC,WAAW,QAAQ,WAAW,EAAG,QAAO;AAC7C,SACE,oBAAC,OAAI,IAAI,EAAE,SAAS,QAAQ,UAAU,QAAQ,gBAAgB,UAAU,KAAK,GAAG,IAAI,EAAE,GACnF,kBAAQ,IAAI,CAAC,OAAO,UACnB,qBAAC,OAAgB,IAAI,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,KAAK,GACtE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,IAAI,EAAE,OAAO,IAAI,QAAQ,IAAI,cAAc,OAAO,iBAAiB,MAAM,OAAO,YAAY,EAAE;AAAA;AAAA,IAChG;AAAA,IACA,oBAAC,cAAW,SAAQ,WAAU,IAAI,EAAE,OAAO,iBAAiB,GACzD,gBAAM,OACT;AAAA,OAPQ,KAQV,CACD,GACH;AAEJ;","names":[]}

package/dist/chunk-QF6LTUCE.js

@@ -0,0 +1,78 @@
+// src/components/utility/InfiniteScroll/InfiniteScroll.hooks.ts
+import { useCallback, useEffect, useRef, useState } from "react";
+var resolveScrollable = (scrollableTarget) => {
+  if (!scrollableTarget) return null;
+  if (typeof scrollableTarget === "string") {
+    return document.getElementById(scrollableTarget) || document.querySelector(scrollableTarget);
+  }
+  return scrollableTarget;
+};
+var useSentinel = ({ testMode, threshold, scrollableTarget }) => {
+  const sentinelRef = useRef(null);
+  const [isIntersecting, setIsIntersecting] = useState(false);
+  useEffect(() => {
+    if (testMode || !sentinelRef.current) return;
+    const observer = new window.IntersectionObserver(
+      ([entry]) => {
+        if (entry) {
+          setIsIntersecting(entry.isIntersecting);
+        }
+      },
+      {
+        root: resolveScrollable(scrollableTarget) || void 0,
+        rootMargin: `${threshold}px`,
+        threshold: 0
+      }
+    );
+    observer.observe(sentinelRef.current);
+    return () => observer.disconnect();
+  }, [testMode, threshold, scrollableTarget]);
+  return { sentinelRef, isIntersecting };
+};
+var useLoadMore = ({
+  hasMore,
+  loading,
+  error,
+  loadMore,
+  onError,
+  isIntersecting,
+  testMode,
+  testTriggerRef
+}) => {
+  const loadingRef = useRef(false);
+  const handleLoadMore = useCallback(async () => {
+    if (loadingRef.current || !hasMore || error) {
+      return;
+    }
+    loadingRef.current = true;
+    try {
+      await loadMore();
+    } catch (err) {
+      const errorObj = err instanceof Error ? err : new Error("Unknown error");
+      onError?.(errorObj);
+    } finally {
+      loadingRef.current = false;
+    }
+  }, [hasMore, error, loadMore, onError]);
+  useEffect(() => {
+    if (testMode && testTriggerRef) {
+      testTriggerRef.current = handleLoadMore;
+    }
+    return () => {
+      if (testMode && testTriggerRef) {
+        testTriggerRef.current = void 0;
+      }
+    };
+  }, [testMode, testTriggerRef, handleLoadMore]);
+  useEffect(() => {
+    if (isIntersecting && hasMore && !loading && !error) {
+      handleLoadMore();
+    }
+  }, [isIntersecting, hasMore, loading, error, handleLoadMore]);
+};
+
+export {
+  useSentinel,
+  useLoadMore
+};
+//# sourceMappingURL=chunk-QF6LTUCE.js.map

package/dist/chunk-QF6LTUCE.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/utility/InfiniteScroll/InfiniteScroll.hooks.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\n\nimport type { InfiniteScrollProps } from './InfiniteScroll.types';\n\ntype ScrollableTarget = InfiniteScrollProps['scrollableTarget'];\n\n/** A string target is looked up by id first, then as a selector. */\nconst resolveScrollable = (scrollableTarget: ScrollableTarget): Element | null => {\n  if (!scrollableTarget) return null;\n\n  if (typeof scrollableTarget === 'string') {\n    return (\n      document.getElementById(scrollableTarget) || document.querySelector(scrollableTarget)\n    );\n  }\n\n  return scrollableTarget;\n};\n\ninterface ObserverArgs {\n  testMode: boolean;\n  threshold: number;\n  scrollableTarget: ScrollableTarget;\n}\n\n/**\n * Watches a zero-size sentinel at the end of the list. `rootMargin` is what makes\n * it fire before the sentinel is actually on screen, so the next page is already\n * loading by the time the user reaches the bottom.\n */\nexport const useSentinel = ({ testMode, threshold, scrollableTarget }: ObserverArgs) => {\n  const sentinelRef = useRef<HTMLDivElement>(null);\n  const [isIntersecting, setIsIntersecting] = useState(false);\n\n  useEffect(() => {\n    if (testMode || !sentinelRef.current) return;\n\n    const observer = new window.IntersectionObserver(\n      ([entry]) => {\n        if (entry) {\n          setIsIntersecting(entry.isIntersecting);\n        }\n      },\n      {\n        root: resolveScrollable(scrollableTarget) || undefined,\n        rootMargin: `${threshold}px`,\n        threshold: 0,\n      },\n    );\n\n    observer.observe(sentinelRef.current);\n\n    return () => observer.disconnect();\n  }, [testMode, threshold, scrollableTarget]);\n\n  return { sentinelRef, isIntersecting };\n};\n\ntype LoadArgs = Pick<\n  InfiniteScrollProps,\n  'hasMore' | 'loading' | 'error' | 'loadMore' | 'onError' | 'testTriggerRef'\n> & {\n  isIntersecting: boolean;\n  testMode: boolean;\n};\n\n/**\n * A ref rather than state guards re-entry, so a second intersection landing while\n * the first `loadMore` is still in flight is dropped rather than queued.\n */\nexport const useLoadMore = ({\n  hasMore,\n  loading,\n  error,\n  loadMore,\n  onError,\n  isIntersecting,\n  testMode,\n  testTriggerRef,\n}: LoadArgs) => {\n  const loadingRef = useRef(false);\n\n  const handleLoadMore = useCallback(async () => {\n    if (loadingRef.current || !hasMore || error) {\n      return;\n    }\n\n    loadingRef.current = true;\n\n    try {\n      await loadMore();\n    } catch (err) {\n      const errorObj = err instanceof Error ? err : new Error('Unknown error');\n      onError?.(errorObj);\n    } finally {\n      loadingRef.current = false;\n    }\n  }, [hasMore, error, loadMore, onError]);\n\n  // Expose test trigger for test mode\n  useEffect(() => {\n    if (testMode && testTriggerRef) {\n      testTriggerRef.current = handleLoadMore;\n    }\n\n    return () => {\n      if (testMode && testTriggerRef) {\n        testTriggerRef.current = undefined;\n      }\n    };\n  }, [testMode, testTriggerRef, handleLoadMore]);\n\n  useEffect(() => {\n    if (isIntersecting && hasMore && !loading && !error) {\n      handleLoadMore();\n    }\n  }, [isIntersecting, hasMore, loading, error, handleLoadMore]);\n};\n"],"mappings":";AAAA,SAAS,aAAa,WAAW,QAAQ,gBAAgB;AAOzD,IAAM,oBAAoB,CAAC,qBAAuD;AAChF,MAAI,CAAC,iBAAkB,QAAO;AAE9B,MAAI,OAAO,qBAAqB,UAAU;AACxC,WACE,SAAS,eAAe,gBAAgB,KAAK,SAAS,cAAc,gBAAgB;AAAA,EAExF;AAEA,SAAO;AACT;AAaO,IAAM,cAAc,CAAC,EAAE,UAAU,WAAW,iBAAiB,MAAoB;AACtF,QAAM,cAAc,OAAuB,IAAI;AAC/C,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,KAAK;AAE1D,YAAU,MAAM;AACd,QAAI,YAAY,CAAC,YAAY,QAAS;AAEtC,UAAM,WAAW,IAAI,OAAO;AAAA,MAC1B,CAAC,CAAC,KAAK,MAAM;AACX,YAAI,OAAO;AACT,4BAAkB,MAAM,cAAc;AAAA,QACxC;AAAA,MACF;AAAA,MACA;AAAA,QACE,MAAM,kBAAkB,gBAAgB,KAAK;AAAA,QAC7C,YAAY,GAAG,SAAS;AAAA,QACxB,WAAW;AAAA,MACb;AAAA,IACF;AAEA,aAAS,QAAQ,YAAY,OAAO;AAEpC,WAAO,MAAM,SAAS,WAAW;AAAA,EACnC,GAAG,CAAC,UAAU,WAAW,gBAAgB,CAAC;AAE1C,SAAO,EAAE,aAAa,eAAe;AACvC;AAcO,IAAM,cAAc,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAgB;AACd,QAAM,aAAa,OAAO,KAAK;AAE/B,QAAM,iBAAiB,YAAY,YAAY;AAC7C,QAAI,WAAW,WAAW,CAAC,WAAW,OAAO;AAC3C;AAAA,IACF;AAEA,eAAW,UAAU;AAErB,QAAI;AACF,YAAM,SAAS;AAAA,IACjB,SAAS,KAAK;AACZ,YAAM,WAAW,eAAe,QAAQ,MAAM,IAAI,MAAM,eAAe;AACvE,gBAAU,QAAQ;AAAA,IACpB,UAAE;AACA,iBAAW,UAAU;AAAA,IACvB;AAAA,EACF,GAAG,CAAC,SAAS,OAAO,UAAU,OAAO,CAAC;AAGtC,YAAU,MAAM;AACd,QAAI,YAAY,gBAAgB;AAC9B,qBAAe,UAAU;AAAA,IAC3B;AAEA,WAAO,MAAM;AACX,UAAI,YAAY,gBAAgB;AAC9B,uBAAe,UAAU;AAAA,MAC3B;AAAA,IACF;AAAA,EACF,GAAG,CAAC,UAAU,gBAAgB,cAAc,CAAC;AAE7C,YAAU,MAAM;AACd,QAAI,kBAAkB,WAAW,CAAC,WAAW,CAAC,OAAO;AACnD,qBAAe;AAAA,IACjB;AAAA,EACF,GAAG,CAAC,gBAAgB,SAAS,SAAS,OAAO,cAAc,CAAC;AAC9D;","names":[]}

package/dist/chunk-QJCZ3IQP.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-QJCZ3IQP.js.map

package/dist/chunk-QJCZ3IQP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}