@umodeapporg/ui 0.0.0-canary.ca10e69

package/dist/components/UI/DataTable/grid/gridStore.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gridStore.js","sources":["../../../../../src/components/UI/DataTable/grid/gridStore.ts"],"sourcesContent":["import { createStore, type StoreApi } from 'zustand/vanilla';\n\nimport {\n  buildGridCellKey,\n  GRID_CELL_ACTIVE,\n  GRID_CELL_EDITING,\n  GRID_CELL_FILL_HANDLE,\n  GRID_CELL_FILL_PREVIEW,\n  GRID_CELL_SAVE_ERROR,\n  GRID_CELL_SAVING,\n  GRID_CELL_SELECTED,\n  GRID_CELL_TABBABLE,\n  type IGridCellCoord,\n  type IGridStartEditingOptions,\n  type TGridEditingEntry,\n  type TGridSelectionMode,\n} from './gridTypes';\n\nexport interface IGridMatrix {\n  rowIds: Array<string>;\n  columnIds: Array<string>;\n  rowIndexById: Map<string, number>;\n  columnIndexById: Map<string, number>;\n}\n\nexport interface IGridSelectionRect {\n  rowStart: number;\n  rowEnd: number;\n  columnStart: number;\n  columnEnd: number;\n}\n\nexport interface IGridMoveOptions {\n  /** Keeps the selection anchor and stretches the rectangle to the new cell. */\n  extend?: boolean;\n  /** Tab-style traversal: past the last column continues on the next row. */\n  wrap?: boolean;\n}\n\nexport type TGridEditingOutcome = 'commit' | 'cancel';\n\nexport interface IGridState {\n  /**\n   * Enquanto falso a tabela é uma tabela comum: nenhuma célula é focável, o\n   * clique na linha segue sendo do host e nada do grid aparece.\n   */\n  isEditMode: boolean;\n  setEditMode: (isEditMode: boolean) => void;\n  selectionMode: TGridSelectionMode;\n  matrix: IGridMatrix;\n  activeCell: IGridCellCoord | null;\n  selectionAnchor: IGridCellCoord | null;\n  selectionRect: IGridSelectionRect | null;\n  editingCell: IGridCellCoord | null;\n  editingEntry: TGridEditingEntry | null;\n  /** Typed text that replaces the value of the cell being opened; `null` keeps the value. */\n  editingSeed: string | null;\n  /** How the last edit ended, so the cell knows whether to restore its value. */\n  editingOutcome: TGridEditingOutcome | null;\n  /** Selection snapshot taken when the fill drag started. */\n  fillSourceRect: IGridSelectionRect | null;\n  /** Cells the running fill drag would write. Null while the pointer is inside the source. */\n  fillTargetRect: IGridSelectionRect | null;\n  /** Per-cell persistence state fed by the host's commit queue. */\n  cellStatuses: ReadonlyMap<string, string>;\n  setCellStatuses: (statuses: ReadonlyMap<string, string>) => void;\n  setSelectionMode: (mode: TGridSelectionMode) => void;\n  setMatrix: (rowIds: Array<string>, columnIds: Array<string>) => void;\n  setActiveCell: (coord: IGridCellCoord, options?: { extend?: boolean }) => void;\n  /** Returns whether the active cell actually moved, so the host can let Tab leave the grid. */\n  moveActiveCell: (rowDelta: number, columnDelta: number, options?: IGridMoveOptions) => boolean;\n  moveActiveToEdge: (rowDelta: number, columnDelta: number, options?: { extend?: boolean }) => void;\n  /**\n   * Tab traversal over the cells that accept an editor, opening the one it lands on.\n   * Returns `false` past the first/last editable cell so the focus can leave the grid.\n   */\n  moveToEditableCell: (direction: 1 | -1, canEditCell: (coord: IGridCellCoord) => boolean) => boolean;\n  startEditing: (coord?: IGridCellCoord, options?: IGridStartEditingOptions) => void;\n  stopEditing: (outcome?: TGridEditingOutcome) => void;\n  /**\n   * The grid lets go of the user: the open editor closes keeping its value, as Enter would,\n   * and no cell stays active or selected. Used when a press lands outside the table.\n   */\n  releaseActiveCell: () => void;\n  clearSelection: () => void;\n  startFill: () => void;\n  updateFillTarget: (coord: IGridCellCoord) => void;\n  /** Clears the drag state and hands back what should be written, if anything. */\n  endFill: () => IGridFillResult | null;\n  cancelFill: () => void;\n}\n\nexport interface IGridFillResult {\n  sourceRect: IGridSelectionRect;\n  targetRect: IGridSelectionRect;\n  matrix: IGridMatrix;\n}\n\nconst EMPTY_MATRIX: IGridMatrix = {\n  rowIds: [],\n  columnIds: [],\n  rowIndexById: new Map(),\n  columnIndexById: new Map(),\n};\n\nconst sameIds = (current: Array<string>, next: Array<string>): boolean =>\n  current.length === next.length && current.every((id, index) => id === next[index]);\n\nconst buildIndex = (ids: Array<string>): Map<string, number> => new Map(ids.map((id, index) => [id, index]));\n\nconst buildRect = (\n  matrix: IGridMatrix,\n  anchor: IGridCellCoord | null,\n  focus: IGridCellCoord | null,\n): IGridSelectionRect | null => {\n  if (!anchor || !focus) return null;\n\n  const anchorRow = matrix.rowIndexById.get(anchor.rowId);\n  const anchorColumn = matrix.columnIndexById.get(anchor.columnId);\n  const focusRow = matrix.rowIndexById.get(focus.rowId);\n  const focusColumn = matrix.columnIndexById.get(focus.columnId);\n\n  if (anchorRow == null || anchorColumn == null || focusRow == null || focusColumn == null) return null;\n\n  return {\n    rowStart: Math.min(anchorRow, focusRow),\n    rowEnd: Math.max(anchorRow, focusRow),\n    columnStart: Math.min(anchorColumn, focusColumn),\n    columnEnd: Math.max(anchorColumn, focusColumn),\n  };\n};\n\nconst coordAt = (matrix: IGridMatrix, rowIndex: number, columnIndex: number): IGridCellCoord | null => {\n  const rowId = matrix.rowIds[rowIndex];\n  const columnId = matrix.columnIds[columnIndex];\n  if (rowId == null || columnId == null) return null;\n\n  return { rowId, columnId };\n};\n\nconst isSameCoord = (left: IGridCellCoord | null, right: IGridCellCoord | null): boolean =>\n  left?.rowId === right?.rowId && left?.columnId === right?.columnId;\n\nexport const createGridStore = (\n  selectionMode: TGridSelectionMode = 'cell',\n  initialEditMode = true,\n): StoreApi<IGridState> =>\n  createStore<IGridState>((set, get) => {\n    const focusCoord = (coord: IGridCellCoord, extend: boolean) => {\n      const { matrix, selectionAnchor, selectionMode: mode, editingCell } = get();\n      const anchor = extend && mode === 'range' ? (selectionAnchor ?? coord) : coord;\n\n      set({\n        activeCell: coord,\n        selectionAnchor: anchor,\n        selectionRect: buildRect(matrix, anchor, coord),\n        editingCell: null,\n        // Moving away from an open editor keeps what was typed: only Escape discards it.\n        editingOutcome: editingCell ? 'commit' : null,\n      });\n    };\n\n    return {\n      isEditMode: initialEditMode,\n      selectionMode,\n      matrix: EMPTY_MATRIX,\n      activeCell: null,\n      selectionAnchor: null,\n      selectionRect: null,\n      editingCell: null,\n      editingEntry: null,\n      editingSeed: null,\n      editingOutcome: null,\n      fillSourceRect: null,\n      fillTargetRect: null,\n      cellStatuses: new Map<string, string>(),\n\n      setEditMode: (isEditMode) => {\n        if (get().isEditMode === isEditMode) return;\n\n        // Sair do modo devolve a tabela ao estado neutro: nada selecionado, nada\n        // em edição, nenhum arraste pela metade.\n        set({\n          isEditMode,\n          activeCell: null,\n          selectionAnchor: null,\n          selectionRect: null,\n          editingCell: null,\n          editingOutcome: null,\n          fillSourceRect: null,\n          fillTargetRect: null,\n        });\n      },\n\n      setCellStatuses: (statuses) => {\n        if (get().cellStatuses === statuses) return;\n        set({ cellStatuses: statuses });\n      },\n\n      setSelectionMode: (mode) => {\n        if (get().selectionMode === mode) return;\n        set({ selectionMode: mode });\n      },\n\n      setMatrix: (rowIds, columnIds) => {\n        const { matrix, activeCell, selectionAnchor, editingCell } = get();\n        if (sameIds(matrix.rowIds, rowIds) && sameIds(matrix.columnIds, columnIds)) return;\n\n        const nextMatrix: IGridMatrix = {\n          rowIds,\n          columnIds,\n          rowIndexById: buildIndex(rowIds),\n          columnIndexById: buildIndex(columnIds),\n        };\n\n        // A row or column that left the viewport (pagination, filter, column\n        // hidden) takes its active/editing state with it, so the grid never\n        // points at a cell the user cannot see.\n        const stillExists = (coord: IGridCellCoord | null): coord is IGridCellCoord =>\n          !!coord && nextMatrix.rowIndexById.has(coord.rowId) && nextMatrix.columnIndexById.has(coord.columnId);\n\n        const nextActive = stillExists(activeCell) ? activeCell : null;\n        const nextAnchor = stillExists(selectionAnchor) ? selectionAnchor : nextActive;\n\n        set({\n          matrix: nextMatrix,\n          activeCell: nextActive,\n          selectionAnchor: nextAnchor,\n          selectionRect: buildRect(nextMatrix, nextAnchor, nextActive),\n          editingCell: stillExists(editingCell) ? editingCell : null,\n        });\n      },\n\n      setActiveCell: (coord, options) => {\n        const { activeCell, editingCell } = get();\n        const extend = options?.extend ?? false;\n\n        // Um clique DENTRO da célula que já está sendo editada pertence ao editor,\n        // não à navegação: reposicionar o cursor aqui fecharia o editor ainda no\n        // mousedown, e um select nunca chegaria a abrir a lista.\n        if (!extend && isSameCoord(editingCell, coord)) return;\n        if (!extend && isSameCoord(activeCell, coord) && !editingCell) return;\n\n        focusCoord(coord, extend);\n      },\n\n      moveActiveCell: (rowDelta, columnDelta, options) => {\n        const { matrix, activeCell } = get();\n        if (matrix.rowIds.length === 0 || matrix.columnIds.length === 0) return false;\n\n        if (!activeCell) {\n          const first = coordAt(matrix, 0, 0);\n          if (first) focusCoord(first, false);\n          return !!first;\n        }\n\n        const rowIndex = matrix.rowIndexById.get(activeCell.rowId);\n        const columnIndex = matrix.columnIndexById.get(activeCell.columnId);\n        if (rowIndex == null || columnIndex == null) return false;\n\n        let nextRow = rowIndex + rowDelta;\n        let nextColumn = columnIndex + columnDelta;\n\n        if (options?.wrap && columnDelta !== 0) {\n          if (nextColumn >= matrix.columnIds.length) {\n            nextColumn = 0;\n            nextRow += 1;\n          } else if (nextColumn < 0) {\n            nextColumn = matrix.columnIds.length - 1;\n            nextRow -= 1;\n          }\n        }\n\n        if (nextRow < 0 || nextRow >= matrix.rowIds.length) return false;\n        if (nextColumn < 0 || nextColumn >= matrix.columnIds.length) return false;\n\n        const next = coordAt(matrix, nextRow, nextColumn);\n        if (!next) return false;\n\n        focusCoord(next, options?.extend ?? false);\n        return true;\n      },\n\n      moveActiveToEdge: (rowDelta, columnDelta, options) => {\n        const { matrix, activeCell } = get();\n        if (matrix.rowIds.length === 0 || matrix.columnIds.length === 0) return;\n\n        const rowIndex = activeCell ? (matrix.rowIndexById.get(activeCell.rowId) ?? 0) : 0;\n        const columnIndex = activeCell ? (matrix.columnIndexById.get(activeCell.columnId) ?? 0) : 0;\n\n        const nextRow = rowDelta === 0 ? rowIndex : rowDelta > 0 ? matrix.rowIds.length - 1 : 0;\n        const nextColumn = columnDelta === 0 ? columnIndex : columnDelta > 0 ? matrix.columnIds.length - 1 : 0;\n\n        const next = coordAt(matrix, nextRow, nextColumn);\n        if (next) focusCoord(next, options?.extend ?? false);\n      },\n\n      moveToEditableCell: (direction, canEditCell) => {\n        const { matrix, activeCell } = get();\n        const columnCount = matrix.columnIds.length;\n        const cellCount = matrix.rowIds.length * columnCount;\n        if (cellCount === 0) return false;\n\n        const rowIndex = activeCell ? matrix.rowIndexById.get(activeCell.rowId) : undefined;\n        const columnIndex = activeCell ? matrix.columnIndexById.get(activeCell.columnId) : undefined;\n        const currentPosition = rowIndex != null && columnIndex != null ? rowIndex * columnCount + columnIndex : -1;\n\n        for (let position = currentPosition + direction; position >= 0 && position < cellCount; position += direction) {\n          const candidate = coordAt(matrix, Math.floor(position / columnCount), position % columnCount);\n          if (!candidate || !canEditCell(candidate)) continue;\n\n          focusCoord(candidate, false);\n          get().startEditing(candidate, { entry: 'keyboard' });\n          return true;\n        }\n\n        return false;\n      },\n\n      startEditing: (coord, options) => {\n        const { activeCell, editingCell, matrix } = get();\n        const target = coord ?? activeCell;\n        if (!target || isSameCoord(editingCell, target)) return;\n\n        set({\n          activeCell: target,\n          selectionAnchor: target,\n          selectionRect: buildRect(matrix, target, target),\n          editingCell: target,\n          editingEntry: options?.entry ?? 'keyboard',\n          editingSeed: options?.seed ?? null,\n          editingOutcome: null,\n        });\n      },\n\n      stopEditing: (outcome = 'commit') => {\n        if (!get().editingCell) return;\n        set({ editingCell: null, editingOutcome: outcome });\n      },\n\n      releaseActiveCell: () => {\n        const { activeCell, editingCell, fillSourceRect } = get();\n        if (!activeCell && !editingCell && !fillSourceRect) return;\n\n        set({\n          activeCell: null,\n          selectionAnchor: null,\n          selectionRect: null,\n          editingCell: null,\n          ...(editingCell ? { editingOutcome: 'commit' as const } : {}),\n          fillSourceRect: null,\n          fillTargetRect: null,\n        });\n      },\n\n      clearSelection: () => {\n        const { activeCell, matrix } = get();\n        set({\n          selectionAnchor: activeCell,\n          selectionRect: buildRect(matrix, activeCell, activeCell),\n        });\n      },\n\n      startFill: () => {\n        const { selectionRect } = get();\n        if (!selectionRect) return;\n        set({ fillSourceRect: selectionRect, fillTargetRect: null, editingCell: null });\n      },\n\n      updateFillTarget: (coord) => {\n        const { fillSourceRect, fillTargetRect, matrix } = get();\n        if (!fillSourceRect) return;\n\n        const rowIndex = matrix.rowIndexById.get(coord.rowId);\n        if (rowIndex == null) return;\n\n        // Vertical only for now. The rect shape is already 2D, so a horizontal\n        // drag is a second branch here and nothing else in the layer changes.\n        let nextTarget: IGridSelectionRect | null = null;\n        if (rowIndex > fillSourceRect.rowEnd) {\n          nextTarget = { ...fillSourceRect, rowStart: fillSourceRect.rowEnd + 1, rowEnd: rowIndex };\n        } else if (rowIndex < fillSourceRect.rowStart) {\n          nextTarget = { ...fillSourceRect, rowStart: rowIndex, rowEnd: fillSourceRect.rowStart - 1 };\n        }\n\n        const isSameTarget =\n          nextTarget?.rowStart === fillTargetRect?.rowStart && nextTarget?.rowEnd === fillTargetRect?.rowEnd;\n        if (isSameTarget) return;\n\n        set({ fillTargetRect: nextTarget });\n      },\n\n      endFill: () => {\n        const { fillSourceRect, fillTargetRect, matrix } = get();\n        set({ fillSourceRect: null, fillTargetRect: null });\n        if (!fillSourceRect || !fillTargetRect) return null;\n\n        return { sourceRect: fillSourceRect, targetRect: fillTargetRect, matrix };\n      },\n\n      cancelFill: () => {\n        if (!get().fillSourceRect) return;\n        set({ fillSourceRect: null, fillTargetRect: null });\n      },\n    };\n  });\n\n/**\n * Bitmask of what this cell currently is. A primitive keeps the per-cell\n * subscription cheap: `useSyncExternalStore` compares it by value, so a cell\n * only re-renders when its own state actually changes.\n */\nconst isInsideRect = (rect: IGridSelectionRect | null, rowIndex?: number, columnIndex?: number): boolean =>\n  !!rect &&\n  rowIndex != null &&\n  columnIndex != null &&\n  rowIndex >= rect.rowStart &&\n  rowIndex <= rect.rowEnd &&\n  columnIndex >= rect.columnStart &&\n  columnIndex <= rect.columnEnd;\n\nexport const selectGridCellState = (state: IGridState, rowId: string, columnId: string): number => {\n  if (!state.isEditMode) return 0;\n\n  let mask = 0;\n\n  if (isSameCoord(state.activeCell, { rowId, columnId })) mask |= GRID_CELL_ACTIVE;\n  if (isSameCoord(state.editingCell, { rowId, columnId })) mask |= GRID_CELL_EDITING;\n\n  const rowIndex = state.matrix.rowIndexById.get(rowId);\n  const columnIndex = state.matrix.columnIndexById.get(columnId);\n\n  const rect = state.selectionRect;\n  if (isInsideRect(rect, rowIndex, columnIndex)) mask |= GRID_CELL_SELECTED;\n  if (rect && rowIndex === rect.rowEnd && columnIndex === rect.columnEnd) mask |= GRID_CELL_FILL_HANDLE;\n  if (isInsideRect(state.fillTargetRect, rowIndex, columnIndex)) mask |= GRID_CELL_FILL_PREVIEW;\n\n  if (state.cellStatuses.size > 0) {\n    const status = state.cellStatuses.get(buildGridCellKey(rowId, columnId));\n    if (status === 'saving' || status === 'pending') mask |= GRID_CELL_SAVING;\n    if (status === 'error') mask |= GRID_CELL_SAVE_ERROR;\n  }\n\n  // Roving tabindex needs an entry point before the first interaction: without\n  // an active cell the top-left cell is the one Tab reaches from outside.\n  if (!state.activeCell && state.matrix.rowIds[0] === rowId && state.matrix.columnIds[0] === columnId) {\n    mask |= GRID_CELL_TABBABLE;\n  }\n\n  return mask;\n};\n"],"names":[],"mappings":"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"}

package/dist/components/UI/DataTable/grid/gridTypes.d.ts

@@ -0,0 +1,59 @@
+/**
+ * Spreadsheet layer types. The grid coordinates are always the TanStack row id
+ * (unique across nesting levels) plus the column id, so navigation never depends
+ * on DOM order and stays correct with hidden, reordered and resized columns.
+ */
+export interface IGridCellCoord {
+    rowId: string;
+    columnId: string;
+}
+export type TGridSelectionMode = 'cell' | 'range';
+/**
+ * How an editor was opened, which decides what it does once it has the focus:
+ * - `pointer`: a click. Text keeps the caret at the end; a picker (select, date) opens its popup.
+ * - `keyboard`: Tab, Enter. Text is selected, so typing replaces it like a form field.
+ * - `typing`: a printable key on the active cell. The key becomes the new value; a picker opens.
+ */
+export type TGridEditingEntry = 'pointer' | 'keyboard' | 'typing';
+export interface IGridStartEditingOptions {
+    entry?: TGridEditingEntry;
+    /** Text that replaces the cell value as the editor opens (the key the user typed). */
+    seed?: string;
+}
+/**
+ * Quando a camada de planilha fica ativa:
+ * - `always` (padrão): ativa desde a montagem. Numa tabela com `onRowClick`, o clique
+ *   numa célula editável abre o editor e o clique no resto da linha abre o registro.
+ * - `toggle`: o usuário liga pelo botão do rodapé antes de editar. Só para tabelas em
+ *   que a linha inteira precisa continuar sendo o alvo do clique.
+ */
+export type TGridEditModeBehavior = 'toggle' | 'always';
+/**
+ * The part of the spreadsheet config the grid layer itself understands. The
+ * row-typed part (fill handlers) lives in `types.ts`, which extends this.
+ */
+export interface IGridNavigationConfig {
+    /** Arrow/Tab/Enter navigation over an active cell. Defaults to `true`. */
+    navigation?: boolean;
+    /** `cell` keeps one cell selected; `range` enables Shift+Arrow / Shift+Click rectangles. */
+    selection?: TGridSelectionMode;
+    /** Invoked by Ctrl/Cmd+S while the grid has focus. */
+    onSave?: () => void;
+    /** Defaults to `always`. */
+    mode?: TGridEditModeBehavior;
+}
+export declare const GRID_CELL_ACTIVE = 1;
+export declare const GRID_CELL_SELECTED = 2;
+export declare const GRID_CELL_EDITING = 4;
+export declare const GRID_CELL_FILL_PREVIEW = 8;
+/** The cell that carries `tabIndex=0` while no cell is active yet. */
+export declare const GRID_CELL_TABBABLE = 16;
+/** Bottom-right corner of the selection: the cell that renders the fill handle. */
+export declare const GRID_CELL_FILL_HANDLE = 32;
+export declare const GRID_CELL_SAVING = 64;
+export declare const GRID_CELL_SAVE_ERROR = 128;
+export declare const buildGridCellKey: (rowId: string, columnId: string) => string;
+/** DOM hook used by the fill drag to resolve which cell is under the pointer. */
+export declare const GRID_CELL_DATA_ATTR = "data-grid-cell";
+export declare const GRID_ROW_DATA_ATTR = "data-grid-row";
+export declare const GRID_COLUMN_DATA_ATTR = "data-grid-column";

package/dist/components/UI/DataTable/grid/gridTypes.js

@@ -0,0 +1,27 @@
+const GRID_CELL_ACTIVE = 1;
+const GRID_CELL_SELECTED = 2;
+const GRID_CELL_EDITING = 4;
+const GRID_CELL_FILL_PREVIEW = 8;
+const GRID_CELL_TABBABLE = 16;
+const GRID_CELL_FILL_HANDLE = 32;
+const GRID_CELL_SAVING = 64;
+const GRID_CELL_SAVE_ERROR = 128;
+const buildGridCellKey = (rowId, columnId) => `${rowId}::${columnId}`;
+const GRID_CELL_DATA_ATTR = "data-grid-cell";
+const GRID_ROW_DATA_ATTR = "data-grid-row";
+const GRID_COLUMN_DATA_ATTR = "data-grid-column";
+export {
+  GRID_CELL_ACTIVE,
+  GRID_CELL_DATA_ATTR,
+  GRID_CELL_EDITING,
+  GRID_CELL_FILL_HANDLE,
+  GRID_CELL_FILL_PREVIEW,
+  GRID_CELL_SAVE_ERROR,
+  GRID_CELL_SAVING,
+  GRID_CELL_SELECTED,
+  GRID_CELL_TABBABLE,
+  GRID_COLUMN_DATA_ATTR,
+  GRID_ROW_DATA_ATTR,
+  buildGridCellKey
+};
+//# sourceMappingURL=gridTypes.js.map

package/dist/components/UI/DataTable/grid/gridTypes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gridTypes.js","sources":["../../../../../src/components/UI/DataTable/grid/gridTypes.ts"],"sourcesContent":["/**\n * Spreadsheet layer types. The grid coordinates are always the TanStack row id\n * (unique across nesting levels) plus the column id, so navigation never depends\n * on DOM order and stays correct with hidden, reordered and resized columns.\n */\nexport interface IGridCellCoord {\n  rowId: string;\n  columnId: string;\n}\n\nexport type TGridSelectionMode = 'cell' | 'range';\n\n/**\n * How an editor was opened, which decides what it does once it has the focus:\n * - `pointer`: a click. Text keeps the caret at the end; a picker (select, date) opens its popup.\n * - `keyboard`: Tab, Enter. Text is selected, so typing replaces it like a form field.\n * - `typing`: a printable key on the active cell. The key becomes the new value; a picker opens.\n */\nexport type TGridEditingEntry = 'pointer' | 'keyboard' | 'typing';\n\nexport interface IGridStartEditingOptions {\n  entry?: TGridEditingEntry;\n  /** Text that replaces the cell value as the editor opens (the key the user typed). */\n  seed?: string;\n}\n\n/**\n * Quando a camada de planilha fica ativa:\n * - `always` (padrão): ativa desde a montagem. Numa tabela com `onRowClick`, o clique\n *   numa célula editável abre o editor e o clique no resto da linha abre o registro.\n * - `toggle`: o usuário liga pelo botão do rodapé antes de editar. Só para tabelas em\n *   que a linha inteira precisa continuar sendo o alvo do clique.\n */\nexport type TGridEditModeBehavior = 'toggle' | 'always';\n\n/**\n * The part of the spreadsheet config the grid layer itself understands. The\n * row-typed part (fill handlers) lives in `types.ts`, which extends this.\n */\nexport interface IGridNavigationConfig {\n  /** Arrow/Tab/Enter navigation over an active cell. Defaults to `true`. */\n  navigation?: boolean;\n  /** `cell` keeps one cell selected; `range` enables Shift+Arrow / Shift+Click rectangles. */\n  selection?: TGridSelectionMode;\n  /** Invoked by Ctrl/Cmd+S while the grid has focus. */\n  onSave?: () => void;\n  /** Defaults to `always`. */\n  mode?: TGridEditModeBehavior;\n}\n\nexport const GRID_CELL_ACTIVE = 1;\nexport const GRID_CELL_SELECTED = 2;\nexport const GRID_CELL_EDITING = 4;\nexport const GRID_CELL_FILL_PREVIEW = 8;\n/** The cell that carries `tabIndex=0` while no cell is active yet. */\nexport const GRID_CELL_TABBABLE = 16;\n/** Bottom-right corner of the selection: the cell that renders the fill handle. */\nexport const GRID_CELL_FILL_HANDLE = 32;\nexport const GRID_CELL_SAVING = 64;\nexport const GRID_CELL_SAVE_ERROR = 128;\n\nexport const buildGridCellKey = (rowId: string, columnId: string): string => `${rowId}::${columnId}`;\n\n/** DOM hook used by the fill drag to resolve which cell is under the pointer. */\nexport const GRID_CELL_DATA_ATTR = 'data-grid-cell';\nexport const GRID_ROW_DATA_ATTR = 'data-grid-row';\nexport const GRID_COLUMN_DATA_ATTR = 'data-grid-column';\n"],"names":[],"mappings":"AAkDO,MAAM,mBAAmB;AACzB,MAAM,qBAAqB;AAC3B,MAAM,oBAAoB;AAC1B,MAAM,yBAAyB;AAE/B,MAAM,qBAAqB;AAE3B,MAAM,wBAAwB;AAC9B,MAAM,mBAAmB;AACzB,MAAM,uBAAuB;AAE7B,MAAM,mBAAmB,CAAC,OAAe,aAA6B,GAAG,KAAK,KAAK,QAAQ;AAG3F,MAAM,sBAAsB;AAC5B,MAAM,qBAAqB;AAC3B,MAAM,wBAAwB;"}

package/dist/components/UI/DataTable/grid/useGridFillApply.d.ts

@@ -0,0 +1,18 @@
+import { Row } from '@tanstack/react-table';
+import { IDataTableColumnConfig, IDataTableRow, IDataTableSpreadsheetConfig } from '../types';
+import { IGridFillResult } from './gridStore';
+interface IUseGridFillApplyParams<T extends IDataTableRow> {
+    visibleRows: Array<Row<T>>;
+    columnConfigById: Map<string, IDataTableColumnConfig<T>>;
+    spreadsheet?: IDataTableSpreadsheetConfig<T>;
+    onCellChange?: (row: T, columnId: string, value: unknown) => void;
+}
+/**
+ * Turns a finished fill drag into cell changes: reads the source values per
+ * column, asks the matching strategy for each target value, and hands the whole
+ * batch to the host in ONE call (`fill.onFillCells`) so a drag over 40 rows is a
+ * single state update instead of 40. Without a batch handler it falls back to the
+ * per-cell `editing.onCellChange`.
+ */
+export declare const useGridFillApply: <T extends IDataTableRow>({ visibleRows, columnConfigById, spreadsheet, onCellChange, }: IUseGridFillApplyParams<T>) => (result: IGridFillResult) => void;
+export {};

package/dist/components/UI/DataTable/grid/useGridFillApply.js

@@ -0,0 +1,74 @@
+import { useRef, useCallback } from "react";
+import { uiLogger } from "../../../../helpers/uiLogger.js";
+import { resolveFillStrategy } from "./fill/fillStrategies.js";
+const DEFAULT_MAX_FILL_CELLS = 500;
+const useGridFillApply = ({
+  visibleRows,
+  columnConfigById,
+  spreadsheet,
+  onCellChange
+}) => {
+  const visibleRowsRef = useRef(visibleRows);
+  visibleRowsRef.current = visibleRows;
+  const columnConfigByIdRef = useRef(columnConfigById);
+  columnConfigByIdRef.current = columnConfigById;
+  const spreadsheetRef = useRef(spreadsheet);
+  spreadsheetRef.current = spreadsheet;
+  const onCellChangeRef = useRef(onCellChange);
+  onCellChangeRef.current = onCellChange;
+  return useCallback((result) => {
+    const fillConfig = spreadsheetRef.current?.fill;
+    if (!fillConfig) return;
+    const { sourceRect, targetRect, matrix } = result;
+    const rowsById = new Map(visibleRowsRef.current.map((row) => [row.id, row]));
+    const maxCells = fillConfig.maxCells ?? DEFAULT_MAX_FILL_CELLS;
+    const targetRowCount = targetRect.rowEnd - targetRect.rowStart + 1;
+    const targetColumnCount = targetRect.columnEnd - targetRect.columnStart + 1;
+    if (targetRowCount * targetColumnCount > maxCells) {
+      uiLogger.warn("DataTable fill exceeded maxCells and was ignored", {
+        targetRowCount,
+        targetColumnCount,
+        maxCells
+      });
+      return;
+    }
+    const fillsDownwards = targetRect.rowStart > sourceRect.rowEnd;
+    const changes = [];
+    for (let columnIndex = targetRect.columnStart; columnIndex <= targetRect.columnEnd; columnIndex += 1) {
+      const columnId = matrix.columnIds[columnIndex];
+      const columnConfig = columnId ? columnConfigByIdRef.current.get(columnId) : void 0;
+      const editable = columnConfig?.editable;
+      if (!columnId || !editable || editable.fillable === false) continue;
+      const sourceValues = [];
+      for (let rowIndex = sourceRect.rowStart; rowIndex <= sourceRect.rowEnd; rowIndex += 1) {
+        const sourceRow = rowsById.get(matrix.rowIds[rowIndex] ?? "");
+        if (sourceRow) sourceValues.push(editable.getValue(sourceRow.original));
+      }
+      if (sourceValues.length === 0) continue;
+      const strategy = resolveFillStrategy(sourceValues, editable.fillStrategy);
+      const orderedRowIndexes = [];
+      for (let rowIndex = targetRect.rowStart; rowIndex <= targetRect.rowEnd; rowIndex += 1) {
+        orderedRowIndexes.push(rowIndex);
+      }
+      if (!fillsDownwards) orderedRowIndexes.reverse();
+      orderedRowIndexes.forEach((rowIndex, offset) => {
+        const targetRow = rowsById.get(matrix.rowIds[rowIndex] ?? "");
+        if (!targetRow) return;
+        if (editable.disabled?.(targetRow.original)) return;
+        const value = strategy.generate(sourceValues, offset + 1, fillsDownwards ? 1 : -1);
+        if (editable.validate?.(value, targetRow.original)) return;
+        changes.push({ row: targetRow.original, columnId, value });
+      });
+    }
+    if (changes.length === 0) return;
+    if (fillConfig.onFillCells) {
+      fillConfig.onFillCells(changes);
+      return;
+    }
+    changes.forEach((change) => onCellChangeRef.current?.(change.row, change.columnId, change.value));
+  }, []);
+};
+export {
+  useGridFillApply
+};
+//# sourceMappingURL=useGridFillApply.js.map

package/dist/components/UI/DataTable/grid/useGridFillApply.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGridFillApply.js","sources":["../../../../../src/components/UI/DataTable/grid/useGridFillApply.ts"],"sourcesContent":["import { useCallback, useRef } from 'react';\n\nimport { uiLogger } from '@/helpers/uiLogger';\nimport { type Row } from '@tanstack/react-table';\n\nimport type {\n  IDataTableColumnConfig,\n  IDataTableFillChange,\n  IDataTableRow,\n  IDataTableSpreadsheetConfig,\n} from '../types';\n\nimport { resolveFillStrategy } from './fill/fillStrategies';\nimport { type IGridFillResult } from './gridStore';\n\nconst DEFAULT_MAX_FILL_CELLS = 500;\n\ninterface IUseGridFillApplyParams<T extends IDataTableRow> {\n  visibleRows: Array<Row<T>>;\n  columnConfigById: Map<string, IDataTableColumnConfig<T>>;\n  spreadsheet?: IDataTableSpreadsheetConfig<T>;\n  onCellChange?: (row: T, columnId: string, value: unknown) => void;\n}\n\n/**\n * Turns a finished fill drag into cell changes: reads the source values per\n * column, asks the matching strategy for each target value, and hands the whole\n * batch to the host in ONE call (`fill.onFillCells`) so a drag over 40 rows is a\n * single state update instead of 40. Without a batch handler it falls back to the\n * per-cell `editing.onCellChange`.\n */\nexport const useGridFillApply = <T extends IDataTableRow>({\n  visibleRows,\n  columnConfigById,\n  spreadsheet,\n  onCellChange,\n}: IUseGridFillApplyParams<T>) => {\n  const visibleRowsRef = useRef(visibleRows);\n  visibleRowsRef.current = visibleRows;\n  const columnConfigByIdRef = useRef(columnConfigById);\n  columnConfigByIdRef.current = columnConfigById;\n  const spreadsheetRef = useRef(spreadsheet);\n  spreadsheetRef.current = spreadsheet;\n  const onCellChangeRef = useRef(onCellChange);\n  onCellChangeRef.current = onCellChange;\n\n  return useCallback((result: IGridFillResult) => {\n    const fillConfig = spreadsheetRef.current?.fill;\n    if (!fillConfig) return;\n\n    const { sourceRect, targetRect, matrix } = result;\n    const rowsById = new Map(visibleRowsRef.current.map((row) => [row.id, row]));\n\n    const maxCells = fillConfig.maxCells ?? DEFAULT_MAX_FILL_CELLS;\n    const targetRowCount = targetRect.rowEnd - targetRect.rowStart + 1;\n    const targetColumnCount = targetRect.columnEnd - targetRect.columnStart + 1;\n    if (targetRowCount * targetColumnCount > maxCells) {\n      uiLogger.warn('DataTable fill exceeded maxCells and was ignored', {\n        targetRowCount,\n        targetColumnCount,\n        maxCells,\n      });\n      return;\n    }\n\n    const fillsDownwards = targetRect.rowStart > sourceRect.rowEnd;\n    const changes: Array<IDataTableFillChange<T>> = [];\n\n    for (let columnIndex = targetRect.columnStart; columnIndex <= targetRect.columnEnd; columnIndex += 1) {\n      const columnId = matrix.columnIds[columnIndex];\n      const columnConfig = columnId ? columnConfigByIdRef.current.get(columnId) : undefined;\n      const editable = columnConfig?.editable;\n      if (!columnId || !editable || editable.fillable === false) continue;\n\n      const sourceValues: Array<unknown> = [];\n      for (let rowIndex = sourceRect.rowStart; rowIndex <= sourceRect.rowEnd; rowIndex += 1) {\n        const sourceRow = rowsById.get(matrix.rowIds[rowIndex] ?? '');\n        if (sourceRow) sourceValues.push(editable.getValue(sourceRow.original));\n      }\n      if (sourceValues.length === 0) continue;\n\n      const strategy = resolveFillStrategy(sourceValues, editable.fillStrategy);\n      // Upwards, the cell nearest the source is the LAST one in the target rect,\n      // so the offset counts away from the source in both directions.\n      const orderedRowIndexes = [];\n      for (let rowIndex = targetRect.rowStart; rowIndex <= targetRect.rowEnd; rowIndex += 1) {\n        orderedRowIndexes.push(rowIndex);\n      }\n      if (!fillsDownwards) orderedRowIndexes.reverse();\n\n      orderedRowIndexes.forEach((rowIndex, offset) => {\n        const targetRow = rowsById.get(matrix.rowIds[rowIndex] ?? '');\n        if (!targetRow) return;\n        if (editable.disabled?.(targetRow.original)) return;\n\n        const value = strategy.generate(sourceValues, offset + 1, fillsDownwards ? 1 : -1);\n        if (editable.validate?.(value, targetRow.original)) return;\n\n        changes.push({ row: targetRow.original, columnId, value });\n      });\n    }\n\n    if (changes.length === 0) return;\n\n    if (fillConfig.onFillCells) {\n      fillConfig.onFillCells(changes);\n      return;\n    }\n\n    changes.forEach((change) => onCellChangeRef.current?.(change.row, change.columnId, change.value));\n  }, []);\n};\n"],"names":[],"mappings":";;;AAeA,MAAM,yBAAyB;AAgBxB,MAAM,mBAAmB,CAA0B;AAAA,EACxD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAkC;AAChC,QAAM,iBAAiB,OAAO,WAAW;AACzC,iBAAe,UAAU;AACzB,QAAM,sBAAsB,OAAO,gBAAgB;AACnD,sBAAoB,UAAU;AAC9B,QAAM,iBAAiB,OAAO,WAAW;AACzC,iBAAe,UAAU;AACzB,QAAM,kBAAkB,OAAO,YAAY;AAC3C,kBAAgB,UAAU;AAE1B,SAAO,YAAY,CAAC,WAA4B;AAC9C,UAAM,aAAa,eAAe,SAAS;AAC3C,QAAI,CAAC,WAAY;AAEjB,UAAM,EAAE,YAAY,YAAY,OAAA,IAAW;AAC3C,UAAM,WAAW,IAAI,IAAI,eAAe,QAAQ,IAAI,CAAC,QAAQ,CAAC,IAAI,IAAI,GAAG,CAAC,CAAC;AAE3E,UAAM,WAAW,WAAW,YAAY;AACxC,UAAM,iBAAiB,WAAW,SAAS,WAAW,WAAW;AACjE,UAAM,oBAAoB,WAAW,YAAY,WAAW,cAAc;AAC1E,QAAI,iBAAiB,oBAAoB,UAAU;AACjD,eAAS,KAAK,oDAAoD;AAAA,QAChE;AAAA,QACA;AAAA,QACA;AAAA,MAAA,CACD;AACD;AAAA,IACF;AAEA,UAAM,iBAAiB,WAAW,WAAW,WAAW;AACxD,UAAM,UAA0C,CAAA;AAEhD,aAAS,cAAc,WAAW,aAAa,eAAe,WAAW,WAAW,eAAe,GAAG;AACpG,YAAM,WAAW,OAAO,UAAU,WAAW;AAC7C,YAAM,eAAe,WAAW,oBAAoB,QAAQ,IAAI,QAAQ,IAAI;AAC5E,YAAM,WAAW,cAAc;AAC/B,UAAI,CAAC,YAAY,CAAC,YAAY,SAAS,aAAa,MAAO;AAE3D,YAAM,eAA+B,CAAA;AACrC,eAAS,WAAW,WAAW,UAAU,YAAY,WAAW,QAAQ,YAAY,GAAG;AACrF,cAAM,YAAY,SAAS,IAAI,OAAO,OAAO,QAAQ,KAAK,EAAE;AAC5D,YAAI,UAAW,cAAa,KAAK,SAAS,SAAS,UAAU,QAAQ,CAAC;AAAA,MACxE;AACA,UAAI,aAAa,WAAW,EAAG;AAE/B,YAAM,WAAW,oBAAoB,cAAc,SAAS,YAAY;AAGxE,YAAM,oBAAoB,CAAA;AAC1B,eAAS,WAAW,WAAW,UAAU,YAAY,WAAW,QAAQ,YAAY,GAAG;AACrF,0BAAkB,KAAK,QAAQ;AAAA,MACjC;AACA,UAAI,CAAC,eAAgB,mBAAkB,QAAA;AAEvC,wBAAkB,QAAQ,CAAC,UAAU,WAAW;AAC9C,cAAM,YAAY,SAAS,IAAI,OAAO,OAAO,QAAQ,KAAK,EAAE;AAC5D,YAAI,CAAC,UAAW;AAChB,YAAI,SAAS,WAAW,UAAU,QAAQ,EAAG;AAE7C,cAAM,QAAQ,SAAS,SAAS,cAAc,SAAS,GAAG,iBAAiB,IAAI,EAAE;AACjF,YAAI,SAAS,WAAW,OAAO,UAAU,QAAQ,EAAG;AAEpD,gBAAQ,KAAK,EAAE,KAAK,UAAU,UAAU,UAAU,OAAO;AAAA,MAC3D,CAAC;AAAA,IACH;AAEA,QAAI,QAAQ,WAAW,EAAG;AAE1B,QAAI,WAAW,aAAa;AAC1B,iBAAW,YAAY,OAAO;AAC9B;AAAA,IACF;AAEA,YAAQ,QAAQ,CAAC,WAAW,gBAAgB,UAAU,OAAO,KAAK,OAAO,UAAU,OAAO,KAAK,CAAC;AAAA,EAClG,GAAG,CAAA,CAAE;AACP;"}

package/dist/components/UI/DataTable/grid/useGridInstance.d.ts

@@ -0,0 +1,27 @@
+import { StoreApi } from 'zustand/vanilla';
+import { IGridState } from './gridStore';
+import { IGridNavigationConfig } from './gridTypes';
+/**
+ * One grid store per table instance, created only when the table opts into the
+ * spreadsheet layer. Returning `null` otherwise keeps every read-only table free
+ * of the store, the provider and the per-cell subscriptions.
+ */
+interface IUseGridInstanceParams {
+    spreadsheet?: IGridNavigationConfig;
+    /** `false` mounts the store dormant, waiting for the toolbar toggle. */
+    startsInEditMode: boolean;
+    enabled: boolean;
+}
+export declare const useGridInstance: ({ spreadsheet, startsInEditMode, enabled, }: IUseGridInstanceParams) => StoreApi<IGridState> | null;
+/**
+ * Subscrição booleana ao modo de edição. Fica fora do caminho quente: só o
+ * cabeçalho da tabela e o corpo reagem, e apenas quando o modo troca.
+ */
+export declare const useGridEditMode: (store: StoreApi<IGridState> | null) => boolean;
+/**
+ * Feeds the store the visible matrix (TanStack row ids × navigable column ids).
+ * The join keys are the dependency so the effect runs when the matrix actually
+ * changes, not on every render of the table.
+ */
+export declare const useGridMatrixSync: (store: StoreApi<IGridState> | null, rowIds: Array<string>, columnIds: Array<string>) => void;
+export {};

package/dist/components/UI/DataTable/grid/useGridInstance.js

@@ -0,0 +1,41 @@
+import { useSyncExternalStore, useCallback, useRef, useEffect, useMemo } from "react";
+import { createGridStore } from "./gridStore.js";
+const useGridInstance = ({
+  spreadsheet,
+  startsInEditMode,
+  enabled
+}) => {
+  const storeRef = useRef(null);
+  const isEnabled = enabled && spreadsheet?.navigation !== false;
+  if (isEnabled && !storeRef.current) {
+    storeRef.current = createGridStore(spreadsheet?.selection ?? "cell", startsInEditMode);
+  }
+  const store = isEnabled ? storeRef.current : null;
+  const selectionMode = spreadsheet?.selection ?? "cell";
+  useEffect(() => {
+    store?.getState().setSelectionMode(selectionMode);
+  }, [store, selectionMode]);
+  return store;
+};
+const useGridEditMode = (store) => useSyncExternalStore(
+  useCallback((onStoreChange) => store ? store.subscribe(onStoreChange) : () => void 0, [store]),
+  () => store?.getState().isEditMode ?? false,
+  () => false
+);
+const useGridMatrixSync = (store, rowIds, columnIds) => {
+  const rowIdsRef = useRef(rowIds);
+  rowIdsRef.current = rowIds;
+  const columnIdsRef = useRef(columnIds);
+  columnIdsRef.current = columnIds;
+  const rowsKey = useMemo(() => rowIds.join("\0"), [rowIds]);
+  const columnsKey = useMemo(() => columnIds.join("\0"), [columnIds]);
+  useEffect(() => {
+    store?.getState().setMatrix(rowIdsRef.current, columnIdsRef.current);
+  }, [store, rowsKey, columnsKey]);
+};
+export {
+  useGridEditMode,
+  useGridInstance,
+  useGridMatrixSync
+};
+//# sourceMappingURL=useGridInstance.js.map

package/dist/components/UI/DataTable/grid/useGridInstance.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGridInstance.js","sources":["../../../../../src/components/UI/DataTable/grid/useGridInstance.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useSyncExternalStore } from 'react';\nimport { type StoreApi } from 'zustand/vanilla';\n\nimport { createGridStore, type IGridState } from './gridStore';\nimport { type IGridNavigationConfig } from './gridTypes';\n\n/**\n * One grid store per table instance, created only when the table opts into the\n * spreadsheet layer. Returning `null` otherwise keeps every read-only table free\n * of the store, the provider and the per-cell subscriptions.\n */\ninterface IUseGridInstanceParams {\n  spreadsheet?: IGridNavigationConfig;\n  /** `false` mounts the store dormant, waiting for the toolbar toggle. */\n  startsInEditMode: boolean;\n  enabled: boolean;\n}\n\nexport const useGridInstance = ({\n  spreadsheet,\n  startsInEditMode,\n  enabled,\n}: IUseGridInstanceParams): StoreApi<IGridState> | null => {\n  const storeRef = useRef<StoreApi<IGridState> | null>(null);\n  const isEnabled = enabled && spreadsheet?.navigation !== false;\n\n  if (isEnabled && !storeRef.current) {\n    storeRef.current = createGridStore(spreadsheet?.selection ?? 'cell', startsInEditMode);\n  }\n\n  const store = isEnabled ? storeRef.current : null;\n  const selectionMode = spreadsheet?.selection ?? 'cell';\n\n  useEffect(() => {\n    store?.getState().setSelectionMode(selectionMode);\n  }, [store, selectionMode]);\n\n  return store;\n};\n\n/**\n * Subscrição booleana ao modo de edição. Fica fora do caminho quente: só o\n * cabeçalho da tabela e o corpo reagem, e apenas quando o modo troca.\n */\nexport const useGridEditMode = (store: StoreApi<IGridState> | null): boolean =>\n  useSyncExternalStore(\n    useCallback((onStoreChange: () => void) => (store ? store.subscribe(onStoreChange) : () => undefined), [store]),\n    () => store?.getState().isEditMode ?? false,\n    () => false,\n  );\n\n/**\n * Feeds the store the visible matrix (TanStack row ids × navigable column ids).\n * The join keys are the dependency so the effect runs when the matrix actually\n * changes, not on every render of the table.\n */\nexport const useGridMatrixSync = (\n  store: StoreApi<IGridState> | null,\n  rowIds: Array<string>,\n  columnIds: Array<string>,\n): void => {\n  const rowIdsRef = useRef(rowIds);\n  rowIdsRef.current = rowIds;\n  const columnIdsRef = useRef(columnIds);\n  columnIdsRef.current = columnIds;\n\n  const rowsKey = useMemo(() => rowIds.join('\u0000'), [rowIds]);\n  const columnsKey = useMemo(() => columnIds.join('\u0000'), [columnIds]);\n\n  useEffect(() => {\n    store?.getState().setMatrix(rowIdsRef.current, columnIdsRef.current);\n  }, [store, rowsKey, columnsKey]);\n};\n"],"names":[],"mappings":";;AAkBO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AACF,MAA2D;AACzD,QAAM,WAAW,OAAoC,IAAI;AACzD,QAAM,YAAY,WAAW,aAAa,eAAe;AAEzD,MAAI,aAAa,CAAC,SAAS,SAAS;AAClC,aAAS,UAAU,gBAAgB,aAAa,aAAa,QAAQ,gBAAgB;AAAA,EACvF;AAEA,QAAM,QAAQ,YAAY,SAAS,UAAU;AAC7C,QAAM,gBAAgB,aAAa,aAAa;AAEhD,YAAU,MAAM;AACd,WAAO,SAAA,EAAW,iBAAiB,aAAa;AAAA,EAClD,GAAG,CAAC,OAAO,aAAa,CAAC;AAEzB,SAAO;AACT;AAMO,MAAM,kBAAkB,CAAC,UAC9B;AAAA,EACE,YAAY,CAAC,kBAA+B,QAAQ,MAAM,UAAU,aAAa,IAAI,MAAM,QAAY,CAAC,KAAK,CAAC;AAAA,EAC9G,MAAM,OAAO,WAAW,cAAc;AAAA,EACtC,MAAM;AACR;AAOK,MAAM,oBAAoB,CAC/B,OACA,QACA,cACS;AACT,QAAM,YAAY,OAAO,MAAM;AAC/B,YAAU,UAAU;AACpB,QAAM,eAAe,OAAO,SAAS;AACrC,eAAa,UAAU;AAEvB,QAAM,UAAU,QAAQ,MAAM,OAAO,KAAK,IAAG,GAAG,CAAC,MAAM,CAAC;AACxD,QAAM,aAAa,QAAQ,MAAM,UAAU,KAAK,IAAG,GAAG,CAAC,SAAS,CAAC;AAEjE,YAAU,MAAM;AACd,WAAO,WAAW,UAAU,UAAU,SAAS,aAAa,OAAO;AAAA,EACrE,GAAG,CAAC,OAAO,SAAS,UAAU,CAAC;AACjC;"}

package/dist/components/UI/DataTable/grid/useGridKeyboard.d.ts

@@ -0,0 +1,25 @@
+import { default as React } from 'react';
+import { StoreApi } from 'zustand/vanilla';
+import { IGridState } from './gridStore';
+import { IGridCellCoord } from './gridTypes';
+interface IUseGridKeyboardParams {
+    store: StoreApi<IGridState> | null;
+    /** Whether the cell can open an editor, so Enter/F2/typing know what to do and Tab knows where to stop. */
+    canEditCell?: (coord: IGridCellCoord) => boolean;
+    /** Whether the cell's editor is free text, so a typed key can become its value. */
+    acceptsTypedValue?: (coord: IGridCellCoord) => boolean;
+    onSave?: () => void;
+}
+/**
+ * A control that owns the caret (input, textarea, select, contenteditable) keeps
+ * every key the grid would otherwise claim: the horizontal arrows walk the text,
+ * not the columns.
+ */
+export declare const isTextEntryTarget: (target: EventTarget | null) => boolean;
+/**
+ * The grid's ONLY keyboard listener: one React handler on the scroll container,
+ * reached by bubbling from the focused cell. No document listeners, no per-cell
+ * handlers, so two tables on the same screen never fight over the same keys.
+ */
+export declare const useGridKeyboard: ({ store, canEditCell, acceptsTypedValue, onSave }: IUseGridKeyboardParams) => (event: React.KeyboardEvent<HTMLElement>) => void;
+export {};

package/dist/components/UI/DataTable/grid/useGridKeyboard.js

@@ -0,0 +1,135 @@
+import { useCallback } from "react";
+import { GRID_CELL_DATA_ATTR } from "./gridTypes.js";
+const CELL_CONTENT_FOCUS_SELECTOR = [
+  "a[href]",
+  "button:not([disabled])",
+  "input:not([disabled])",
+  "select:not([disabled])",
+  "textarea:not([disabled])",
+  "[tabindex]"
+].map((selector) => `${selector}:not([tabindex="-1"])`).join(", ");
+const resolveCellElement = (target) => target instanceof HTMLElement ? target.closest(`[${GRID_CELL_DATA_ATTR}]`) : null;
+const isTextEntryTarget = (target) => {
+  if (!(target instanceof HTMLElement)) return false;
+  if (target.isContentEditable) return true;
+  return target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.tagName === "SELECT";
+};
+const isPrintableKey = (event) => event.key.length === 1 && !event.ctrlKey && !event.metaKey && !event.altKey;
+const moveWithTab = (store, direction, canEditCell) => {
+  if (canEditCell) return store.getState().moveToEditableCell(direction, canEditCell);
+  return store.getState().moveActiveCell(0, direction, { wrap: true });
+};
+const useGridKeyboard = ({ store, canEditCell, acceptsTypedValue, onSave }) => useCallback(
+  (event) => {
+    if (!store) return;
+    const state = store.getState();
+    const { key } = event;
+    if ((event.metaKey || event.ctrlKey) && (key === "s" || key === "S")) {
+      if (!onSave) return;
+      event.preventDefault();
+      onSave();
+      return;
+    }
+    const isEditing = !!state.editingCell || isTextEntryTarget(event.target);
+    if (isEditing) {
+      if (key === "Escape") {
+        event.stopPropagation();
+        state.stopEditing("cancel");
+        return;
+      }
+      if (key === "Enter") {
+        event.preventDefault();
+        state.stopEditing();
+        state.moveActiveCell(event.shiftKey ? -1 : 1, 0);
+        return;
+      }
+      if (key === "Tab") {
+        state.stopEditing();
+        if (moveWithTab(store, event.shiftKey ? -1 : 1, canEditCell)) event.preventDefault();
+      }
+      return;
+    }
+    const cellElement = resolveCellElement(event.target);
+    const isInsideCellContent = !!cellElement && event.target !== cellElement;
+    if (isInsideCellContent) {
+      if (key !== "Escape") return;
+      event.preventDefault();
+      cellElement.focus();
+      return;
+    }
+    const extend = event.shiftKey;
+    switch (key) {
+      case "ArrowUp":
+        event.preventDefault();
+        state.moveActiveCell(-1, 0, { extend });
+        return;
+      case "ArrowDown":
+        event.preventDefault();
+        state.moveActiveCell(1, 0, { extend });
+        return;
+      case "ArrowLeft":
+        event.preventDefault();
+        state.moveActiveCell(0, -1, { extend });
+        return;
+      case "ArrowRight":
+        event.preventDefault();
+        state.moveActiveCell(0, 1, { extend });
+        return;
+      case "Tab":
+        if (moveWithTab(store, event.shiftKey ? -1 : 1, canEditCell)) event.preventDefault();
+        return;
+      case "Home":
+        event.preventDefault();
+        state.moveActiveToEdge(event.ctrlKey || event.metaKey ? -1 : 0, -1, { extend });
+        return;
+      case "End":
+        event.preventDefault();
+        state.moveActiveToEdge(event.ctrlKey || event.metaKey ? 1 : 0, 1, { extend });
+        return;
+      case "Enter":
+      case "F2": {
+        const active = state.activeCell;
+        if (!active) return;
+        if (canEditCell?.(active)) {
+          event.preventDefault();
+          state.startEditing(active, { entry: "keyboard" });
+          return;
+        }
+        const focusableInsideCell = cellElement?.querySelector(CELL_CONTENT_FOCUS_SELECTOR);
+        if (focusableInsideCell) {
+          event.preventDefault();
+          focusableInsideCell.focus();
+          return;
+        }
+        if (key !== "Enter") return;
+        event.preventDefault();
+        state.moveActiveCell(1, 0);
+        return;
+      }
+      case "Escape":
+        state.clearSelection();
+        return;
+      case "Backspace":
+      case "Delete": {
+        const active = state.activeCell;
+        if (!active || !canEditCell?.(active) || !acceptsTypedValue?.(active)) return;
+        event.preventDefault();
+        state.startEditing(active, { entry: "typing", seed: "" });
+        return;
+      }
+      default: {
+        const active = state.activeCell;
+        if (!active || !isPrintableKey(event) || !canEditCell?.(active)) return;
+        event.preventDefault();
+        const seed = acceptsTypedValue?.(active) ? key : void 0;
+        state.startEditing(active, { entry: "typing", seed });
+      }
+    }
+  },
+  [store, canEditCell, acceptsTypedValue, onSave]
+);
+export {
+  isTextEntryTarget,
+  useGridKeyboard
+};
+//# sourceMappingURL=useGridKeyboard.js.map

package/dist/components/UI/DataTable/grid/useGridKeyboard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGridKeyboard.js","sources":["../../../../../src/components/UI/DataTable/grid/useGridKeyboard.ts"],"sourcesContent":["import React, { useCallback } from 'react';\nimport { type StoreApi } from 'zustand/vanilla';\n\nimport { type IGridState } from './gridStore';\nimport { GRID_CELL_DATA_ATTR, type IGridCellCoord } from './gridTypes';\n\ninterface IUseGridKeyboardParams {\n  store: StoreApi<IGridState> | null;\n  /** Whether the cell can open an editor, so Enter/F2/typing know what to do and Tab knows where to stop. */\n  canEditCell?: (coord: IGridCellCoord) => boolean;\n  /** Whether the cell's editor is free text, so a typed key can become its value. */\n  acceptsTypedValue?: (coord: IGridCellCoord) => boolean;\n  onSave?: () => void;\n}\n\nconst CELL_CONTENT_FOCUS_SELECTOR = [\n  'a[href]',\n  'button:not([disabled])',\n  'input:not([disabled])',\n  'select:not([disabled])',\n  'textarea:not([disabled])',\n  '[tabindex]',\n]\n  .map((selector) => `${selector}:not([tabindex=\"-1\"])`)\n  .join(', ');\n\n/** The `<td>` the event came from, so the handler never queries the whole document. */\nconst resolveCellElement = (target: EventTarget | null): HTMLElement | null =>\n  target instanceof HTMLElement ? target.closest<HTMLElement>(`[${GRID_CELL_DATA_ATTR}]`) : null;\n\n/**\n * A control that owns the caret (input, textarea, select, contenteditable) keeps\n * every key the grid would otherwise claim: the horizontal arrows walk the text,\n * not the columns.\n */\nexport const isTextEntryTarget = (target: EventTarget | null): boolean => {\n  if (!(target instanceof HTMLElement)) return false;\n  if (target.isContentEditable) return true;\n\n  return target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.tagName === 'SELECT';\n};\n\nconst isPrintableKey = (event: React.KeyboardEvent): boolean =>\n  event.key.length === 1 && !event.ctrlKey && !event.metaKey && !event.altKey;\n\n/**\n * Tab jumps to the next cell that accepts an editor and opens it, so a row is filled by\n * typing and tabbing, never stopping on a read-only cell. A table with no editable cell\n * keeps the plain cell-by-cell walk. Returns whether the active cell moved, which is what\n * decides if the grid keeps the event: past the last cell the focus goes back to the page,\n * because trapping Tab inside a table is a keyboard trap, not a spreadsheet.\n */\nconst moveWithTab = (\n  store: StoreApi<IGridState>,\n  direction: 1 | -1,\n  canEditCell?: (coord: IGridCellCoord) => boolean,\n): boolean => {\n  if (canEditCell) return store.getState().moveToEditableCell(direction, canEditCell);\n  return store.getState().moveActiveCell(0, direction, { wrap: true });\n};\n\n/**\n * The grid's ONLY keyboard listener: one React handler on the scroll container,\n * reached by bubbling from the focused cell. No document listeners, no per-cell\n * handlers, so two tables on the same screen never fight over the same keys.\n */\nexport const useGridKeyboard = ({ store, canEditCell, acceptsTypedValue, onSave }: IUseGridKeyboardParams) =>\n  useCallback(\n    (event: React.KeyboardEvent<HTMLElement>) => {\n      if (!store) return;\n\n      const state = store.getState();\n      const { key } = event;\n\n      if ((event.metaKey || event.ctrlKey) && (key === 's' || key === 'S')) {\n        if (!onSave) return;\n        event.preventDefault();\n        onSave();\n        return;\n      }\n\n      const isEditing = !!state.editingCell || isTextEntryTarget(event.target);\n\n      if (isEditing) {\n        if (key === 'Escape') {\n          // The table may live inside a dialog or drawer: leaving the editor must\n          // not also close the surface around it.\n          event.stopPropagation();\n          state.stopEditing('cancel');\n          return;\n        }\n\n        if (key === 'Enter') {\n          event.preventDefault();\n          state.stopEditing();\n          state.moveActiveCell(event.shiftKey ? -1 : 1, 0);\n          return;\n        }\n\n        if (key === 'Tab') {\n          state.stopEditing();\n          if (moveWithTab(store, event.shiftKey ? -1 : 1, canEditCell)) event.preventDefault();\n        }\n\n        return;\n      }\n\n      const cellElement = resolveCellElement(event.target);\n      const isInsideCellContent = !!cellElement && event.target !== cellElement;\n\n      // Focus went into a control inside the cell (an action button, a link).\n      // While it is there the cell content owns the keyboard, and Escape brings\n      // the focus back to the cell.\n      if (isInsideCellContent) {\n        if (key !== 'Escape') return;\n        event.preventDefault();\n        cellElement.focus();\n        return;\n      }\n\n      const extend = event.shiftKey;\n\n      switch (key) {\n        case 'ArrowUp':\n          event.preventDefault();\n          state.moveActiveCell(-1, 0, { extend });\n          return;\n        case 'ArrowDown':\n          event.preventDefault();\n          state.moveActiveCell(1, 0, { extend });\n          return;\n        case 'ArrowLeft':\n          event.preventDefault();\n          state.moveActiveCell(0, -1, { extend });\n          return;\n        case 'ArrowRight':\n          event.preventDefault();\n          state.moveActiveCell(0, 1, { extend });\n          return;\n        case 'Tab':\n          if (moveWithTab(store, event.shiftKey ? -1 : 1, canEditCell)) event.preventDefault();\n          return;\n        case 'Home':\n          event.preventDefault();\n          state.moveActiveToEdge(event.ctrlKey || event.metaKey ? -1 : 0, -1, { extend });\n          return;\n        case 'End':\n          event.preventDefault();\n          state.moveActiveToEdge(event.ctrlKey || event.metaKey ? 1 : 0, 1, { extend });\n          return;\n        case 'Enter':\n        case 'F2': {\n          const active = state.activeCell;\n          if (!active) return;\n\n          if (canEditCell?.(active)) {\n            event.preventDefault();\n            state.startEditing(active, { entry: 'keyboard' });\n            return;\n          }\n\n          // Read-only cell: Enter steps INTO whatever control it holds, which is\n          // the only way a keyboard user reaches the per-row actions now that Tab\n          // walks the cells.\n          const focusableInsideCell = cellElement?.querySelector<HTMLElement>(CELL_CONTENT_FOCUS_SELECTOR);\n          if (focusableInsideCell) {\n            event.preventDefault();\n            focusableInsideCell.focus();\n            return;\n          }\n\n          if (key !== 'Enter') return;\n          event.preventDefault();\n          state.moveActiveCell(1, 0);\n\n          return;\n        }\n        case 'Escape':\n          state.clearSelection();\n          return;\n        case 'Backspace':\n        case 'Delete': {\n          const active = state.activeCell;\n          if (!active || !canEditCell?.(active) || !acceptsTypedValue?.(active)) return;\n          event.preventDefault();\n          state.startEditing(active, { entry: 'typing', seed: '' });\n          return;\n        }\n        default: {\n          // Typing over the active cell edits it, like a spreadsheet: free text takes the\n          // key as its new value, a picker opens so the next keys search its options.\n          const active = state.activeCell;\n          if (!active || !isPrintableKey(event) || !canEditCell?.(active)) return;\n          event.preventDefault();\n          const seed = acceptsTypedValue?.(active) ? key : undefined;\n          state.startEditing(active, { entry: 'typing', seed });\n        }\n      }\n    },\n    [store, canEditCell, acceptsTypedValue, onSave],\n  );\n"],"names":[],"mappings":"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"}

package/dist/components/UI/DataTable/index.d.ts

@@ -0,0 +1,19 @@
+export { applyDataTableFilters, buildDataTableFilterParams, countActiveDataTableFilters, } from './applyDataTableFilters';
+export { default as DataTable } from './DataTable';
+export { default as DataTableBulkEditDialog } from './DataTableBulkEditDialog';
+export type { IDataTableColumnsEntry } from './dataTableColumnsStore';
+export { readColumnsEntry } from './dataTableColumnsStore';
+export { default as DataTableDetailModal } from './DataTableDetailModal';
+export { default as DataTableDetailPanel } from './DataTableDetailPanel';
+export { default as DataTableFilters } from './DataTableFilters';
+export { default as DataTableSaveButton } from './DataTableSaveButton';
+export type { IDataTableActionItem, IDataTableColorValue, IDataTableColumnConfig, IDataTableConfig, IDataTableDetailConfig, IDataTableDetailField, IDataTableDetailTableExpansionConfig, IDataTableEditableConfig, IDataTableEditingConfig, IDataTableEditingRowsConfig, IDataTableExpandedContentContext, IDataTableFillChange, IDataTableFillConfig, IDataTableFilterBinding, IDataTableFilterOption, IDataTableFiltersConfig, IDataTableOriginValue, IDataTablePanelExpansionConfig, IDataTableRow, IDataTableSortState, IDataTableSpreadsheetConfig, IDataTableStatusValue, IDataTableSubRowsExpansionConfig, IDataTableTab, IDataTableTableExpansionConfig, IDataTableTagValue, IDataTableThumbnailValue, TDataTableCellType, TDataTableDataMode, TDataTableEditableType, TDataTableExpansionConfig, TDataTableFilterField, TDataTableFilterValues, TDataTableOriginTone, TDataTableSortDirection, TDataTableStatusTone, TDataTableViewMode, } from './types';
+export { isDataTableDetailTableExpansion, isDataTablePanelExpansion, isDataTableSubRowsExpansion, isDataTableTableExpansion, } from './types';
+export { resolveColumnOrder } from './useColumnOrder';
+export type { IDataTableCommitItem, IDataTableCommitRowResult, TDataTableCommitStatus, } from './useDataTableCommitQueue';
+export { useDataTableCommitQueue } from './useDataTableCommitQueue';
+export type { IDataTableEditBufferItem } from './useDataTableEditBuffer';
+export { useDataTableEditBuffer } from './useDataTableEditBuffer';
+export type { IDataTableClientPaginationState } from './useDataTableInstance';
+export type { IDataTableFetchParams, IDataTableFetchResult, IDataTableSource, TDataTableFetchPage, } from './useDataTableSource';
+export { useDataTableSource } from './useDataTableSource';

package/dist/components/UI/DataTable/index.js

@@ -0,0 +1,34 @@
+import { applyDataTableFilters, buildDataTableFilterParams, countActiveDataTableFilters } from "./applyDataTableFilters.js";
+import { default as default2 } from "./DataTable.js";
+import { default as default3 } from "./DataTableBulkEditDialog.js";
+import { readColumnsEntry } from "./dataTableColumnsStore.js";
+import { default as default4 } from "./DataTableDetailModal.js";
+import { default as default5 } from "./DataTableDetailPanel.js";
+import { default as default6 } from "./DataTableFilters.js";
+import { default as default7 } from "./DataTableSaveButton.js";
+import { isDataTableDetailTableExpansion, isDataTablePanelExpansion, isDataTableSubRowsExpansion, isDataTableTableExpansion } from "./types.js";
+import { resolveColumnOrder } from "./useColumnOrder.js";
+import { useDataTableCommitQueue } from "./useDataTableCommitQueue.js";
+import { useDataTableEditBuffer } from "./useDataTableEditBuffer.js";
+import { useDataTableSource } from "./useDataTableSource.js";
+export {
+  default2 as DataTable,
+  default3 as DataTableBulkEditDialog,
+  default4 as DataTableDetailModal,
+  default5 as DataTableDetailPanel,
+  default6 as DataTableFilters,
+  default7 as DataTableSaveButton,
+  applyDataTableFilters,
+  buildDataTableFilterParams,
+  countActiveDataTableFilters,
+  isDataTableDetailTableExpansion,
+  isDataTablePanelExpansion,
+  isDataTableSubRowsExpansion,
+  isDataTableTableExpansion,
+  readColumnsEntry,
+  resolveColumnOrder,
+  useDataTableCommitQueue,
+  useDataTableEditBuffer,
+  useDataTableSource
+};
+//# sourceMappingURL=index.js.map

package/dist/components/UI/DataTable/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}