@comitor/ui 1.11.0 → 2.1.0

package/dist/data-grid/use-data-grid-undo-redo.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/data-grid/use-data-grid-undo-redo.ts"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\nimport { msg } from \"./messages.js\";\nimport { toastInfo, toastSuccess } from \"./toast.js\";\nimport { useAsRef } from \"./use-as-ref.js\";\nimport { useLazyRef } from \"./use-lazy-ref.js\";\nimport { getIsInPopover } from \"./utils.js\";\n\nconst DEFAULT_MAX_HISTORY = 100;\nconst BATCH_TIMEOUT = 300;\n\ninterface HistoryEntry<TData> {\n  variant: \"cells_update\" | \"rows_add\" | \"rows_delete\";\n  count: number;\n  timestamp: number;\n  undo: (currentData: TData[]) => TData[];\n  redo: (currentData: TData[]) => TData[];\n}\n\ninterface UndoRedoCellUpdate {\n  rowId: string;\n  columnId: string;\n  previousValue: unknown;\n  newValue: unknown;\n}\n\ninterface StoreState<TData> {\n  undoStack: HistoryEntry<TData>[];\n  redoStack: HistoryEntry<TData>[];\n  hasPendingChanges: boolean;\n}\n\ninterface Store<TData> {\n  subscribe: (callback: () => void) => () => void;\n  getState: () => StoreState<TData>;\n  push: (entry: HistoryEntry<TData>) => void;\n  undo: () => HistoryEntry<TData> | null;\n  redo: () => HistoryEntry<TData> | null;\n  clear: () => void;\n  setPendingChanges: (value: boolean) => void;\n  notify: () => void;\n}\n\nfunction useStore<T>(store: Store<T>, selector: (state: StoreState<T>) => boolean): boolean {\n  const getSnapshot = React.useCallback(() => selector(store.getState()), [store, selector]);\n\n  return React.useSyncExternalStore(store.subscribe, getSnapshot, getSnapshot);\n}\n\nfunction buildIndexById<TData>(data: TData[], getRowId: (row: TData) => string): Map<string, number> {\n  const map = new Map<string, number>();\n  for (let i = 0; i < data.length; i++) {\n    const row = data[i];\n    if (row) {\n      map.set(getRowId(row), i);\n    }\n  }\n  return map;\n}\n\nfunction getPendingKey(rowId: string, columnId: string): string {\n  return `${rowId}\\0${columnId}`;\n}\n\n/**\n * Tuỳ chọn của {@link useDataGridUndoRedo}. Lịch sử nằm hoàn toàn ở phía trình duyệt:\n * hook tính ra mảng dữ liệu trước/sau rồi trả về qua `onDataChange` — ứng dụng tự\n * đồng bộ lên máy chủ (hoặc bỏ qua nếu chỉ làm việc với state cục bộ).\n */\ninterface UseDataGridUndoRedoProps<TData> {\n  data: TData[];\n  onDataChange: (data: TData[]) => void;\n  /** Khoá định danh bản ghi — phải khớp với `getRowId` của lưới */\n  getRowId: (row: TData) => string;\n  /** Số thao tác giữ trong lịch sử (mặc định 100) */\n  maxHistory?: number;\n  enabled?: boolean;\n}\n\ninterface UseDataGridUndoRedoReturn<TData> {\n  canUndo: boolean;\n  canRedo: boolean;\n  onUndo: () => void;\n  onRedo: () => void;\n  onClear: () => void;\n  trackCellsUpdate: (updates: UndoRedoCellUpdate[]) => void;\n  trackRowsAdd: (rows: TData[]) => void;\n  trackRowsDelete: (rows: TData[]) => void;\n}\n\nfunction useDataGridUndoRedo<TData>({\n  data,\n  onDataChange,\n  getRowId,\n  maxHistory = DEFAULT_MAX_HISTORY,\n  enabled = true\n}: UseDataGridUndoRedoProps<TData>): UseDataGridUndoRedoReturn<TData> {\n  const propsRef = useAsRef({\n    data,\n    onDataChange,\n    getRowId,\n    maxHistory,\n    enabled\n  });\n\n  const listenersRef = useLazyRef(() => new Set<() => void>());\n\n  const stateRef = useLazyRef<StoreState<TData>>(() => ({\n    undoStack: [],\n    redoStack: [],\n    hasPendingChanges: false\n  }));\n\n  const pendingBatchRef = React.useRef<{\n    byKey: Map<string, UndoRedoCellUpdate>;\n    timeoutId: ReturnType<typeof setTimeout> | null;\n  }>({\n    byKey: new Map(),\n    timeoutId: null\n  });\n\n  const pendingNotifyRef = React.useRef(false);\n\n  const store = React.useMemo<Store<TData>>(() => {\n    return {\n      subscribe: (callback) => {\n        listenersRef.current.add(callback);\n        return () => listenersRef.current.delete(callback);\n      },\n      getState: () => stateRef.current,\n      push: (entry) => {\n        const state = stateRef.current;\n        const newUndoStack = [...state.undoStack, entry];\n\n        if (newUndoStack.length > propsRef.current.maxHistory) {\n          newUndoStack.shift();\n        }\n\n        stateRef.current = {\n          undoStack: newUndoStack,\n          redoStack: [],\n          hasPendingChanges: false\n        };\n        store.notify();\n      },\n      undo: () => {\n        const state = stateRef.current;\n        if (state.undoStack.length === 0) return null;\n\n        const entry = state.undoStack[state.undoStack.length - 1];\n        if (!entry) return null;\n\n        stateRef.current = {\n          undoStack: state.undoStack.slice(0, -1),\n          redoStack: [...state.redoStack, entry],\n          hasPendingChanges: false\n        };\n        store.notify();\n        return entry;\n      },\n      redo: () => {\n        const state = stateRef.current;\n        if (state.redoStack.length === 0) return null;\n\n        const entry = state.redoStack[state.redoStack.length - 1];\n        if (!entry) return null;\n\n        stateRef.current = {\n          undoStack: [...state.undoStack, entry],\n          redoStack: state.redoStack.slice(0, -1),\n          hasPendingChanges: false\n        };\n        store.notify();\n        return entry;\n      },\n      clear: () => {\n        stateRef.current = {\n          undoStack: [],\n          redoStack: [],\n          hasPendingChanges: false\n        };\n        store.notify();\n      },\n      setPendingChanges: (value) => {\n        if (stateRef.current.hasPendingChanges === value) return;\n        stateRef.current = {\n          ...stateRef.current,\n          hasPendingChanges: value\n        };\n\n        if (!pendingNotifyRef.current) {\n          pendingNotifyRef.current = true;\n          queueMicrotask(() => {\n            pendingNotifyRef.current = false;\n            store.notify();\n          });\n        }\n      },\n      notify: () => {\n        for (const listener of listenersRef.current) {\n          listener();\n        }\n      }\n    };\n  }, [listenersRef, stateRef, propsRef]);\n\n  const canUndo = useStore(store, (state) => state.undoStack.length > 0 || state.hasPendingChanges);\n  const canRedo = useStore(store, (state) => state.redoStack.length > 0);\n\n  const onCommit = React.useCallback(() => {\n    const pending = pendingBatchRef.current;\n    if (pending.byKey.size === 0) return;\n\n    if (pending.timeoutId) {\n      clearTimeout(pending.timeoutId);\n      pending.timeoutId = null;\n    }\n\n    const updates = Array.from(pending.byKey.values());\n    pending.byKey.clear();\n\n    const { getRowId } = propsRef.current;\n\n    const entry: HistoryEntry<TData> = {\n      variant: \"cells_update\",\n      count: updates.length,\n      timestamp: Date.now(),\n      undo: (currentData) => {\n        const newData = [...currentData];\n        const indexById = buildIndexById(newData, getRowId);\n\n        for (const update of updates) {\n          const index = indexById.get(update.rowId);\n          if (index !== undefined) {\n            const row = newData[index];\n            if (row) {\n              newData[index] = {\n                ...row,\n                [update.columnId]: update.previousValue\n              };\n            }\n          }\n        }\n        return newData;\n      },\n      redo: (currentData) => {\n        const newData = [...currentData];\n        const indexById = buildIndexById(newData, getRowId);\n\n        for (const update of updates) {\n          const index = indexById.get(update.rowId);\n          if (index !== undefined) {\n            const row = newData[index];\n            if (row) {\n              newData[index] = { ...row, [update.columnId]: update.newValue };\n            }\n          }\n        }\n        return newData;\n      }\n    };\n\n    store.push(entry);\n  }, [store, propsRef]);\n\n  const onUndo = React.useCallback(() => {\n    if (!propsRef.current.enabled) return;\n\n    onCommit();\n\n    const entry = store.undo();\n    if (!entry) {\n      toastInfo(msg.toast.nothingToUndo);\n      return;\n    }\n\n    const newData = entry.undo(propsRef.current.data);\n    propsRef.current.onDataChange(newData);\n\n    toastSuccess(msg.toast.undone(entry.count));\n  }, [store, propsRef, onCommit]);\n\n  const onRedo = React.useCallback(() => {\n    if (!propsRef.current.enabled) return;\n\n    onCommit();\n\n    const entry = store.redo();\n    if (!entry) {\n      toastInfo(msg.toast.nothingToRedo);\n      return;\n    }\n\n    const newData = entry.redo(propsRef.current.data);\n    propsRef.current.onDataChange(newData);\n\n    toastSuccess(msg.toast.redone(entry.count));\n  }, [store, propsRef, onCommit]);\n\n  const onClear = React.useCallback(() => {\n    const pending = pendingBatchRef.current;\n    if (pending.timeoutId) {\n      clearTimeout(pending.timeoutId);\n      pending.timeoutId = null;\n    }\n    pending.byKey.clear();\n\n    store.clear();\n  }, [store]);\n\n  const trackCellsUpdate = React.useCallback(\n    (updates: UndoRedoCellUpdate[]) => {\n      if (!propsRef.current.enabled || updates.length === 0) return;\n\n      const filteredUpdates = updates.filter((u) => !Object.is(u.previousValue, u.newValue));\n      if (filteredUpdates.length === 0) return;\n\n      const pending = pendingBatchRef.current;\n\n      for (const update of filteredUpdates) {\n        const key = getPendingKey(update.rowId, update.columnId);\n        const existing = pending.byKey.get(key);\n\n        if (existing) {\n          pending.byKey.set(key, { ...existing, newValue: update.newValue });\n        } else {\n          pending.byKey.set(key, update);\n        }\n      }\n\n      store.setPendingChanges(true);\n\n      if (pending.timeoutId) {\n        clearTimeout(pending.timeoutId);\n      }\n      pending.timeoutId = setTimeout(onCommit, BATCH_TIMEOUT);\n    },\n    [store, propsRef, onCommit]\n  );\n\n  const trackRowsAdd = React.useCallback(\n    (rows: TData[]) => {\n      if (!propsRef.current.enabled || rows.length === 0) return;\n\n      onCommit();\n\n      const { getRowId } = propsRef.current;\n\n      const rowIds = new Set(rows.map((row) => getRowId(row)));\n      const rowsCopy = rows.map((row) => ({ ...row }));\n\n      const entry: HistoryEntry<TData> = {\n        variant: \"rows_add\",\n        count: rows.length,\n        timestamp: Date.now(),\n        undo: (currentData) => {\n          return currentData.filter((row) => !rowIds.has(getRowId(row)));\n        },\n        redo: (currentData) => {\n          return [...currentData, ...rowsCopy.map((row) => ({ ...row }))];\n        }\n      };\n\n      store.push(entry);\n    },\n    [store, propsRef, onCommit]\n  );\n\n  const trackRowsDelete = React.useCallback(\n    (rows: TData[]) => {\n      if (!propsRef.current.enabled || rows.length === 0) return;\n\n      onCommit();\n\n      const { getRowId, data: currentData } = propsRef.current;\n\n      const indexById = buildIndexById(currentData, getRowId);\n\n      const rowsWithPositions: Array<{ index: number; row: TData }> = [];\n      for (const row of rows) {\n        const rowId = getRowId(row);\n        const currentIndex = indexById.get(rowId);\n        if (currentIndex !== undefined) {\n          rowsWithPositions.push({\n            index: currentIndex,\n            row: { ...row }\n          });\n        }\n      }\n\n      rowsWithPositions.sort((a, b) => a.index - b.index);\n\n      const rowIds = new Set(rows.map((row) => getRowId(row)));\n\n      const entry: HistoryEntry<TData> = {\n        variant: \"rows_delete\",\n        count: rows.length,\n        timestamp: Date.now(),\n        undo: (currentData) => {\n          const newData = [...currentData];\n          for (const { index, row } of rowsWithPositions) {\n            const insertIndex = Math.min(index, newData.length);\n            newData.splice(insertIndex, 0, { ...row });\n          }\n          return newData;\n        },\n        redo: (currentData) => {\n          return currentData.filter((row) => !rowIds.has(getRowId(row)));\n        }\n      };\n\n      store.push(entry);\n    },\n    [store, propsRef, onCommit]\n  );\n\n  React.useEffect(() => {\n    const pending = pendingBatchRef.current;\n    return () => {\n      if (pending.timeoutId) {\n        clearTimeout(pending.timeoutId);\n      }\n    };\n  }, []);\n\n  React.useEffect(() => {\n    if (!enabled) return;\n\n    function onKeyDown(event: KeyboardEvent) {\n      const isCtrlOrCmd = event.ctrlKey || event.metaKey;\n      const key = event.key.toLowerCase();\n\n      if (!isCtrlOrCmd || (key !== \"z\" && key !== \"y\")) return;\n\n      const activeElement = document.activeElement;\n      if (activeElement) {\n        const isInput = activeElement.tagName === \"INPUT\" || activeElement.tagName === \"TEXTAREA\";\n        const isContentEditable = activeElement.getAttribute(\"contenteditable\") === \"true\";\n        const isInPopover = getIsInPopover(activeElement);\n\n        if (isInput || isContentEditable || isInPopover) return;\n      }\n\n      if (key === \"z\" && !event.shiftKey) {\n        event.preventDefault();\n        onUndo();\n        return;\n      }\n\n      if ((key === \"z\" && event.shiftKey) || key === \"y\") {\n        event.preventDefault();\n        onRedo();\n      }\n    }\n\n    document.addEventListener(\"keydown\", onKeyDown);\n    return () => document.removeEventListener(\"keydown\", onKeyDown);\n  }, [enabled, onUndo, onRedo]);\n\n  return React.useMemo(\n    () => ({\n      canUndo,\n      canRedo,\n      onUndo,\n      onRedo,\n      onClear,\n      trackCellsUpdate,\n      trackRowsAdd,\n      trackRowsDelete\n    }),\n    [canUndo, canRedo, onUndo, onRedo, onClear, trackCellsUpdate, trackRowsAdd, trackRowsDelete]\n  );\n}\n\nexport {\n  //\n  type UndoRedoCellUpdate,\n  useDataGridUndoRedo\n};\n"],"mappings":"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","names":["getRowId","currentData"]}
+{"version":3,"sources":["../../src/data-grid/use-data-grid-undo-redo.ts"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { useAsRef } from \"../lib/use-as-ref.js\";\nimport { useLazyRef } from \"../lib/use-lazy-ref.js\";\nimport { type DataGridLocale, type DataGridMessages, getDataGridMessages } from \"./messages.js\";\nimport { toastInfo, toastSuccess } from \"./toast.js\";\nimport { getIsInPopover } from \"./utils.js\";\n\nconst DEFAULT_MAX_HISTORY = 100;\nconst BATCH_TIMEOUT = 300;\n\ninterface HistoryEntry<TData> {\n  variant: \"cells_update\" | \"rows_add\" | \"rows_delete\";\n  count: number;\n  timestamp: number;\n  undo: (currentData: TData[]) => TData[];\n  redo: (currentData: TData[]) => TData[];\n}\n\ninterface UndoRedoCellUpdate {\n  rowId: string;\n  columnId: string;\n  previousValue: unknown;\n  newValue: unknown;\n}\n\ninterface StoreState<TData> {\n  undoStack: HistoryEntry<TData>[];\n  redoStack: HistoryEntry<TData>[];\n  hasPendingChanges: boolean;\n}\n\ninterface Store<TData> {\n  subscribe: (callback: () => void) => () => void;\n  getState: () => StoreState<TData>;\n  push: (entry: HistoryEntry<TData>) => void;\n  undo: () => HistoryEntry<TData> | null;\n  redo: () => HistoryEntry<TData> | null;\n  clear: () => void;\n  setPendingChanges: (value: boolean) => void;\n  notify: () => void;\n}\n\nfunction useStore<T>(store: Store<T>, selector: (state: StoreState<T>) => boolean): boolean {\n  const getSnapshot = React.useCallback(() => selector(store.getState()), [store, selector]);\n\n  return React.useSyncExternalStore(store.subscribe, getSnapshot, getSnapshot);\n}\n\nfunction buildIndexById<TData>(data: TData[], getRowId: (row: TData) => string): Map<string, number> {\n  const map = new Map<string, number>();\n  for (let i = 0; i < data.length; i++) {\n    const row = data[i];\n    if (row) {\n      map.set(getRowId(row), i);\n    }\n  }\n  return map;\n}\n\nfunction getPendingKey(rowId: string, columnId: string): string {\n  return `${rowId}\\0${columnId}`;\n}\n\n/**\n * Tuỳ chọn của {@link useDataGridUndoRedo}. Lịch sử nằm hoàn toàn ở phía trình duyệt:\n * hook tính ra mảng dữ liệu trước/sau rồi trả về qua `onDataChange` — ứng dụng tự\n * đồng bộ lên máy chủ (hoặc bỏ qua nếu chỉ làm việc với state cục bộ).\n */\ninterface UseDataGridUndoRedoProps<TData> {\n  data: TData[];\n  onDataChange: (data: TData[]) => void;\n  /** Khoá định danh bản ghi — phải khớp với `getRowId` của lưới */\n  getRowId: (row: TData) => string;\n  /** Số thao tác giữ trong lịch sử (mặc định 100) */\n  maxHistory?: number;\n  enabled?: boolean;\n  /**\n   * Ngôn ngữ của toast mà hook bắn ra (`\"en\"` mặc định · `\"vi\"`, hoặc cả bảng chuỗi tự soạn).\n   *\n   * Hook giữ bảng chuỗi của RIÊNG nó chứ không đọc `DataGridLocaleProvider`: toast render ở gốc\n   * app qua `<Toaster />`, ngoài hẳn cây DOM của lưới, nên không có context nào để đọc. Truyền\n   * cùng giá trị đã truyền cho `useDataGrid`.\n   */\n  locale?: DataGridLocale | DataGridMessages;\n}\n\ninterface UseDataGridUndoRedoReturn<TData> {\n  canUndo: boolean;\n  canRedo: boolean;\n  onUndo: () => void;\n  onRedo: () => void;\n  onClear: () => void;\n  trackCellsUpdate: (updates: UndoRedoCellUpdate[]) => void;\n  trackRowsAdd: (rows: TData[]) => void;\n  trackRowsDelete: (rows: TData[]) => void;\n}\n\nfunction useDataGridUndoRedo<TData>({\n  data,\n  onDataChange,\n  getRowId,\n  maxHistory = DEFAULT_MAX_HISTORY,\n  enabled = true,\n  locale\n}: UseDataGridUndoRedoProps<TData>): UseDataGridUndoRedoReturn<TData> {\n  const msg = React.useMemo(() => getDataGridMessages(locale), [locale]);\n  const msgRef = useAsRef(msg);\n  const propsRef = useAsRef({\n    data,\n    onDataChange,\n    getRowId,\n    maxHistory,\n    enabled\n  });\n\n  const listenersRef = useLazyRef(() => new Set<() => void>());\n\n  const stateRef = useLazyRef<StoreState<TData>>(() => ({\n    undoStack: [],\n    redoStack: [],\n    hasPendingChanges: false\n  }));\n\n  const pendingBatchRef = React.useRef<{\n    byKey: Map<string, UndoRedoCellUpdate>;\n    timeoutId: ReturnType<typeof setTimeout> | null;\n  }>({\n    byKey: new Map(),\n    timeoutId: null\n  });\n\n  const pendingNotifyRef = React.useRef(false);\n\n  const store = React.useMemo<Store<TData>>(() => {\n    return {\n      subscribe: (callback) => {\n        listenersRef.current.add(callback);\n        return () => listenersRef.current.delete(callback);\n      },\n      getState: () => stateRef.current,\n      push: (entry) => {\n        const state = stateRef.current;\n        const newUndoStack = [...state.undoStack, entry];\n\n        if (newUndoStack.length > propsRef.current.maxHistory) {\n          newUndoStack.shift();\n        }\n\n        stateRef.current = {\n          undoStack: newUndoStack,\n          redoStack: [],\n          hasPendingChanges: false\n        };\n        store.notify();\n      },\n      undo: () => {\n        const state = stateRef.current;\n        if (state.undoStack.length === 0) return null;\n\n        const entry = state.undoStack[state.undoStack.length - 1];\n        if (!entry) return null;\n\n        stateRef.current = {\n          undoStack: state.undoStack.slice(0, -1),\n          redoStack: [...state.redoStack, entry],\n          hasPendingChanges: false\n        };\n        store.notify();\n        return entry;\n      },\n      redo: () => {\n        const state = stateRef.current;\n        if (state.redoStack.length === 0) return null;\n\n        const entry = state.redoStack[state.redoStack.length - 1];\n        if (!entry) return null;\n\n        stateRef.current = {\n          undoStack: [...state.undoStack, entry],\n          redoStack: state.redoStack.slice(0, -1),\n          hasPendingChanges: false\n        };\n        store.notify();\n        return entry;\n      },\n      clear: () => {\n        stateRef.current = {\n          undoStack: [],\n          redoStack: [],\n          hasPendingChanges: false\n        };\n        store.notify();\n      },\n      setPendingChanges: (value) => {\n        if (stateRef.current.hasPendingChanges === value) return;\n        stateRef.current = {\n          ...stateRef.current,\n          hasPendingChanges: value\n        };\n\n        if (!pendingNotifyRef.current) {\n          pendingNotifyRef.current = true;\n          queueMicrotask(() => {\n            pendingNotifyRef.current = false;\n            store.notify();\n          });\n        }\n      },\n      notify: () => {\n        for (const listener of listenersRef.current) {\n          listener();\n        }\n      }\n    };\n  }, [listenersRef, stateRef, propsRef]);\n\n  const canUndo = useStore(store, (state) => state.undoStack.length > 0 || state.hasPendingChanges);\n  const canRedo = useStore(store, (state) => state.redoStack.length > 0);\n\n  const onCommit = React.useCallback(() => {\n    const pending = pendingBatchRef.current;\n    if (pending.byKey.size === 0) return;\n\n    if (pending.timeoutId) {\n      clearTimeout(pending.timeoutId);\n      pending.timeoutId = null;\n    }\n\n    const updates = Array.from(pending.byKey.values());\n    pending.byKey.clear();\n\n    const { getRowId } = propsRef.current;\n\n    const entry: HistoryEntry<TData> = {\n      variant: \"cells_update\",\n      count: updates.length,\n      timestamp: Date.now(),\n      undo: (currentData) => {\n        const newData = [...currentData];\n        const indexById = buildIndexById(newData, getRowId);\n\n        for (const update of updates) {\n          const index = indexById.get(update.rowId);\n          if (index !== undefined) {\n            const row = newData[index];\n            if (row) {\n              newData[index] = {\n                ...row,\n                [update.columnId]: update.previousValue\n              };\n            }\n          }\n        }\n        return newData;\n      },\n      redo: (currentData) => {\n        const newData = [...currentData];\n        const indexById = buildIndexById(newData, getRowId);\n\n        for (const update of updates) {\n          const index = indexById.get(update.rowId);\n          if (index !== undefined) {\n            const row = newData[index];\n            if (row) {\n              newData[index] = { ...row, [update.columnId]: update.newValue };\n            }\n          }\n        }\n        return newData;\n      }\n    };\n\n    store.push(entry);\n  }, [store, propsRef]);\n\n  const onUndo = React.useCallback(() => {\n    if (!propsRef.current.enabled) return;\n\n    onCommit();\n\n    const entry = store.undo();\n    if (!entry) {\n      toastInfo(msgRef.current.toast.nothingToUndo);\n      return;\n    }\n\n    const newData = entry.undo(propsRef.current.data);\n    propsRef.current.onDataChange(newData);\n\n    toastSuccess(msgRef.current.toast.undone(entry.count));\n  }, [store, propsRef, onCommit, msgRef]);\n\n  const onRedo = React.useCallback(() => {\n    if (!propsRef.current.enabled) return;\n\n    onCommit();\n\n    const entry = store.redo();\n    if (!entry) {\n      toastInfo(msgRef.current.toast.nothingToRedo);\n      return;\n    }\n\n    const newData = entry.redo(propsRef.current.data);\n    propsRef.current.onDataChange(newData);\n\n    toastSuccess(msgRef.current.toast.redone(entry.count));\n  }, [store, propsRef, onCommit, msgRef]);\n\n  const onClear = React.useCallback(() => {\n    const pending = pendingBatchRef.current;\n    if (pending.timeoutId) {\n      clearTimeout(pending.timeoutId);\n      pending.timeoutId = null;\n    }\n    pending.byKey.clear();\n\n    store.clear();\n  }, [store]);\n\n  const trackCellsUpdate = React.useCallback(\n    (updates: UndoRedoCellUpdate[]) => {\n      if (!propsRef.current.enabled || updates.length === 0) return;\n\n      const filteredUpdates = updates.filter((u) => !Object.is(u.previousValue, u.newValue));\n      if (filteredUpdates.length === 0) return;\n\n      const pending = pendingBatchRef.current;\n\n      for (const update of filteredUpdates) {\n        const key = getPendingKey(update.rowId, update.columnId);\n        const existing = pending.byKey.get(key);\n\n        if (existing) {\n          pending.byKey.set(key, { ...existing, newValue: update.newValue });\n        } else {\n          pending.byKey.set(key, update);\n        }\n      }\n\n      store.setPendingChanges(true);\n\n      if (pending.timeoutId) {\n        clearTimeout(pending.timeoutId);\n      }\n      pending.timeoutId = setTimeout(onCommit, BATCH_TIMEOUT);\n    },\n    [store, propsRef, onCommit]\n  );\n\n  const trackRowsAdd = React.useCallback(\n    (rows: TData[]) => {\n      if (!propsRef.current.enabled || rows.length === 0) return;\n\n      onCommit();\n\n      const { getRowId } = propsRef.current;\n\n      const rowIds = new Set(rows.map((row) => getRowId(row)));\n      const rowsCopy = rows.map((row) => ({ ...row }));\n\n      const entry: HistoryEntry<TData> = {\n        variant: \"rows_add\",\n        count: rows.length,\n        timestamp: Date.now(),\n        undo: (currentData) => {\n          return currentData.filter((row) => !rowIds.has(getRowId(row)));\n        },\n        redo: (currentData) => {\n          return [...currentData, ...rowsCopy.map((row) => ({ ...row }))];\n        }\n      };\n\n      store.push(entry);\n    },\n    [store, propsRef, onCommit]\n  );\n\n  const trackRowsDelete = React.useCallback(\n    (rows: TData[]) => {\n      if (!propsRef.current.enabled || rows.length === 0) return;\n\n      onCommit();\n\n      const { getRowId, data: currentData } = propsRef.current;\n\n      const indexById = buildIndexById(currentData, getRowId);\n\n      const rowsWithPositions: Array<{ index: number; row: TData }> = [];\n      for (const row of rows) {\n        const rowId = getRowId(row);\n        const currentIndex = indexById.get(rowId);\n        if (currentIndex !== undefined) {\n          rowsWithPositions.push({\n            index: currentIndex,\n            row: { ...row }\n          });\n        }\n      }\n\n      rowsWithPositions.sort((a, b) => a.index - b.index);\n\n      const rowIds = new Set(rows.map((row) => getRowId(row)));\n\n      const entry: HistoryEntry<TData> = {\n        variant: \"rows_delete\",\n        count: rows.length,\n        timestamp: Date.now(),\n        undo: (currentData) => {\n          const newData = [...currentData];\n          for (const { index, row } of rowsWithPositions) {\n            const insertIndex = Math.min(index, newData.length);\n            newData.splice(insertIndex, 0, { ...row });\n          }\n          return newData;\n        },\n        redo: (currentData) => {\n          return currentData.filter((row) => !rowIds.has(getRowId(row)));\n        }\n      };\n\n      store.push(entry);\n    },\n    [store, propsRef, onCommit]\n  );\n\n  React.useEffect(() => {\n    const pending = pendingBatchRef.current;\n    return () => {\n      if (pending.timeoutId) {\n        clearTimeout(pending.timeoutId);\n      }\n    };\n  }, []);\n\n  React.useEffect(() => {\n    if (!enabled) return;\n\n    function onKeyDown(event: KeyboardEvent) {\n      const isCtrlOrCmd = event.ctrlKey || event.metaKey;\n      const key = event.key.toLowerCase();\n\n      if (!isCtrlOrCmd || (key !== \"z\" && key !== \"y\")) return;\n\n      const activeElement = document.activeElement;\n      if (activeElement) {\n        const isInput = activeElement.tagName === \"INPUT\" || activeElement.tagName === \"TEXTAREA\";\n        const isContentEditable = activeElement.getAttribute(\"contenteditable\") === \"true\";\n        const isInPopover = getIsInPopover(activeElement);\n\n        if (isInput || isContentEditable || isInPopover) return;\n      }\n\n      if (key === \"z\" && !event.shiftKey) {\n        event.preventDefault();\n        onUndo();\n        return;\n      }\n\n      if ((key === \"z\" && event.shiftKey) || key === \"y\") {\n        event.preventDefault();\n        onRedo();\n      }\n    }\n\n    document.addEventListener(\"keydown\", onKeyDown);\n    return () => document.removeEventListener(\"keydown\", onKeyDown);\n  }, [enabled, onUndo, onRedo]);\n\n  return React.useMemo(\n    () => ({\n      canUndo,\n      canRedo,\n      onUndo,\n      onRedo,\n      onClear,\n      trackCellsUpdate,\n      trackRowsAdd,\n      trackRowsDelete\n    }),\n    [canUndo, canRedo, onUndo, onRedo, onClear, trackCellsUpdate, trackRowsAdd, trackRowsDelete]\n  );\n}\n\nexport {\n  //\n  type UndoRedoCellUpdate,\n  useDataGridUndoRedo\n};\n"],"mappings":"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","names":["getRowId","currentData"]}

package/dist/data-grid/use-data-grid.d.ts

@@ -2,7 +2,10 @@ import * as _tanstack_react_virtual from '@tanstack/react-virtual';
 import * as _tanstack_react_table from '@tanstack/react-table';
 import { TableOptions, TableMeta, ColumnDef } from '@tanstack/react-table';
 import * as React from 'react';
+import { DataGridLocale } from './messages.js';
 import { CellPosition, CellUpdate, FileCellData, RowHeightValue, Direction, SearchState, ContextMenuState, PasteDialogState } from './types.js';
+import { DataGridMessages } from './messages-en.js';
+import './messages-vi.js';
 
 /**
  * Tuỳ chọn của {@link useDataGrid} — mở rộng `TableOptions` của TanStack Table v8.
@@ -60,8 +63,19 @@ interface UseDataGridProps<TData> extends Omit<TableOptions<TData>, "pageCount"
     enablePaste?: boolean;
     /** Chỉ xem: khoá mọi thao tác sửa/xoá/dán */
     readOnly?: boolean;
+    /**
+     * Ngôn ngữ của lưới: `"en"` (mặc định) · `"vi"`, hoặc cả một bảng chuỗi tự soạn.
+     *
+     * Giá trị này đi ra theo kết quả của hook, nên `<DataGrid {...gridProps}>` tự nhận được và tự
+     * phát xuống cây con. Hook cũng giữ một bản cho RIÊNG nó, vì toast render ở gốc app
+     * (`<Toaster />`) chứ không nằm trong cây của lưới — không có context nào ở đó để đọc.
+     *
+     * ⚠ Thanh công cụ nằm ngoài `<DataGrid>` nên KHÔNG nhận được giá trị này: bọc cả màn bằng
+     * `DataGridLocaleProvider`, hoặc truyền `locale` cho từng menu.
+     */
+    locale?: DataGridLocale | DataGridMessages;
 }
-declare function useDataGrid<TData>({ data, columns, rowHeight: rowHeightProp, overscan, dir: dirProp, initialState, ...props }: UseDataGridProps<TData>): {
+declare function useDataGrid<TData>({ data, columns, rowHeight: rowHeightProp, overscan, dir: dirProp, initialState, locale, ...props }: UseDataGridProps<TData>): {
     dataGridRef: React.RefObject<HTMLDivElement | null>;
     headerRef: React.RefObject<HTMLDivElement | null>;
     rowMapRef: React.RefObject<Map<number, HTMLDivElement>>;
@@ -87,6 +101,272 @@ declare function useDataGrid<TData>({ data, columns, rowHeight: rowHeightProp, o
     pasteDialog: PasteDialogState;
     onRowAdd: ((event?: React.MouseEvent<HTMLDivElement>) => Promise<void>) | undefined;
     adjustLayout: boolean;
+    locale: {
+        grid: {
+            label: string;
+            addRow: string;
+        };
+        search: {
+            placeholder: string;
+            label: string;
+            prevMatch: string;
+            nextMatch: string;
+            close: string;
+            matchPosition: (index: number, total: number) => string;
+            noResults: string;
+            typeToSearch: string;
+        };
+        column: {
+            sortAsc: string;
+            sortDesc: string;
+            removeSort: string;
+            pinLeft: string;
+            unpinLeft: string;
+            pinRight: string;
+            unpinRight: string;
+            hide: string;
+            resize: (label: string) => string;
+            variant: {
+                shortText: string;
+                longText: string;
+                number: string;
+                url: string;
+                checkbox: string;
+                select: string;
+                multiSelect: string;
+                date: string;
+                file: string;
+            };
+        };
+        select: {
+            all: string;
+            row: string;
+            rowNumber: (rowNumber: number) => string;
+        };
+        contextMenu: {
+            copy: string;
+            cut: string;
+            clear: string;
+            deleteRows: string;
+        };
+        pasteDialog: {
+            title: string;
+            description: (rowsNeeded: number) => string;
+            expandTitle: string;
+            expandDescription: (rowsNeeded: number) => string;
+            keepTitle: string;
+            keepDescription: string;
+            cancel: string;
+            confirm: string;
+        };
+        rowHeight: {
+            label: string;
+            short: string;
+            medium: string;
+            tall: string;
+            extraTall: string;
+        };
+        view: {
+            trigger: string;
+            toggleColumns: string;
+            searchPlaceholder: string;
+            empty: string;
+        };
+        sort: {
+            trigger: string;
+            title: string;
+            emptyTitle: string;
+            description: string;
+            emptyDescription: string;
+            add: string;
+            reset: string;
+            remove: string;
+            drag: string;
+            fieldPlaceholder: string;
+            fieldEmpty: string;
+            asc: string;
+            desc: string;
+        };
+        filter: {
+            trigger: string;
+            title: string;
+            emptyTitle: string;
+            description: string;
+            emptyDescription: string;
+            add: string;
+            reset: string;
+            remove: string;
+            drag: string;
+            where: string;
+            and: string;
+            fieldPlaceholder: string;
+            fieldEmpty: string;
+            valuePlaceholder: string;
+            rangeStart: string;
+            rangeEnd: string;
+            pickDate: string;
+            pickRange: string;
+            optionPlaceholder: string;
+            optionEmpty: string;
+            selectedCount: (count: number) => string;
+            emptyValue: (label: string) => string;
+            operators: {
+                contains: string;
+                notContains: string;
+                equals: string;
+                notEquals: string;
+                startsWith: string;
+                endsWith: string;
+                isEmpty: string;
+                isNotEmpty: string;
+                lessThan: string;
+                lessThanOrEqual: string;
+                greaterThan: string;
+                greaterThanOrEqual: string;
+                isBetween: string;
+                dateEquals: string;
+                dateNotEquals: string;
+                before: string;
+                after: string;
+                onOrBefore: string;
+                onOrAfter: string;
+                is: string;
+                isNot: string;
+                isAnyOf: string;
+                isNoneOf: string;
+                isTrue: string;
+                isFalse: string;
+            };
+        };
+        cell: {
+            longTextPlaceholder: string;
+            optionSearchPlaceholder: string;
+            optionEmpty: string;
+            clearAll: string;
+            invalidUrlTitle: string;
+            invalidUrlDescription: string;
+        };
+        file: {
+            uploadLabel: string;
+            dropHere: string;
+            dragHere: string;
+            browse: string;
+            limits: (maxSize?: string, maxFiles?: number) => string;
+            count: (count: number) => string;
+            clearAll: string;
+            remove: string;
+            uploading: string;
+            deleting: string;
+            tooMany: (maxFiles: number) => string;
+            tooLarge: (maxSize: string) => string;
+            wrongType: string;
+            rejectedOne: (name: string) => string;
+            rejectedMany: (name: string, others: number) => string;
+            uploadFailed: (count: number) => string;
+            deleteFailed: (name: string) => string;
+            deleteFailedMany: string;
+        };
+        toast: {
+            cellsCopied: (count: number) => string;
+            copyFailed: string;
+            cellsCut: (count: number) => string;
+            cutFailed: string;
+            cellsPasted: (count: number) => string;
+            cellsPastedWithSkipped: (count: number, skipped: number) => string;
+            pasteSkipped: (skipped: number) => string;
+            pasteFailed: string;
+            cellsCleared: (count: number) => string;
+            rowsDeleted: (count: number) => string;
+            nothingToUndo: string;
+            nothingToRedo: string;
+            undone: (count: number) => string;
+            redone: (count: number) => string;
+        };
+        booleanText: {
+            checked: string;
+            unchecked: string;
+        };
+        shortcuts: {
+            trigger: string;
+            title: string;
+            description: string;
+            searchPlaceholder: string;
+            emptyTitle: string;
+            emptyDescription: string;
+            close: string;
+            groups: {
+                navigation: string;
+                selection: string;
+                editing: string;
+                search: string;
+                filtering: string;
+                sorting: string;
+                general: string;
+            };
+            keys: {
+                click: string;
+                doubleClick: string;
+            };
+            navigation: {
+                move: string;
+                nextCell: string;
+                prevCell: string;
+                firstColumn: string;
+                lastColumn: string;
+                firstRowSameColumn: string;
+                lastRowSameColumn: string;
+                firstColumnSameRow: string;
+                lastColumnSameRow: string;
+                firstCell: string;
+                lastCell: string;
+                pageUp: string;
+                pageDown: string;
+                scrollUp: string;
+                scrollDown: string;
+                scrollLeft: string;
+                scrollRight: string;
+            };
+            selection: {
+                extend: string;
+                toTop: string;
+                toBottom: string;
+                toFirstColumn: string;
+                toLastColumn: string;
+                all: string;
+                toggle: string;
+                range: string;
+                clear: string;
+            };
+            editing: {
+                start: string;
+                insertRow: string;
+                copy: string;
+                cut: string;
+                paste: string;
+                clear: string;
+                deleteRows: string;
+                undo: string;
+                redo: string;
+            };
+            search: {
+                open: string;
+                next: string;
+                prev: string;
+                close: string;
+            };
+            filtering: {
+                toggle: string;
+                remove: string;
+            };
+            sorting: {
+                toggle: string;
+                remove: string;
+            };
+            general: {
+                shortcuts: string;
+            };
+        };
+    } | "en" | "vi" | undefined;
 };
 
 export { type UseDataGridProps, useDataGrid };

package/dist/data-grid/use-data-grid.js

@@ -8,11 +8,11 @@ import {
 } from "@tanstack/react-table";
 import { useVirtualizer } from "@tanstack/react-virtual";
 import * as React from "react";
-import { msg } from "./messages.js";
+import { useAsRef } from "../lib/use-as-ref.js";
+import { useIsomorphicLayoutEffect } from "../lib/use-isomorphic-layout-effect.js";
+import { useLazyRef } from "../lib/use-lazy-ref.js";
+import { getDataGridMessages } from "./messages.js";
 import { toastError, toastSuccess } from "./toast.js";
-import { useAsRef } from "./use-as-ref.js";
-import { useIsomorphicLayoutEffect } from "./use-isomorphic-layout-effect.js";
-import { useLazyRef } from "./use-lazy-ref.js";
 import {
   formatDate,
   getCellKey,
@@ -57,8 +57,11 @@ function useDataGrid({
   overscan = OVERSCAN,
   dir: dirProp,
   initialState,
+  locale,
   ...props
 }) {
+  const msg = React.useMemo(() => getDataGridMessages(locale), [locale]);
+  const msgRef = useAsRef(msg);
   const dir = useDirection(dirProp);
   const dataGridRef = React.useRef(null);
   const tableRef = React.useRef(null);
@@ -456,11 +459,11 @@ function useDataGrid({
       if (currentState.cutCells.size > 0) {
         store.setState("cutCells", /* @__PURE__ */ new Set());
       }
-      toastSuccess(msg.toast.cellsCopied(selectedCellsArray.length));
+      toastSuccess(msgRef.current.toast.cellsCopied(selectedCellsArray.length));
     } catch {
-      toastError(msg.toast.copyFailed);
+      toastError(msgRef.current.toast.copyFailed);
     }
-  }, [store, serializeCellsToTsv]);
+  }, [store, serializeCellsToTsv, msgRef]);
   const onCellsCut = React.useCallback(async () => {
     if (propsRef.current.readOnly) return;
     const result = serializeCellsToTsv();
@@ -469,11 +472,11 @@ function useDataGrid({
     try {
       await writeClipboardText(tsvData);
       store.setState("cutCells", new Set(selectedCellsArray));
-      toastSuccess(msg.toast.cellsCut(selectedCellsArray.length));
+      toastSuccess(msgRef.current.toast.cellsCut(selectedCellsArray.length));
     } catch {
-      toastError(msg.toast.cutFailed);
+      toastError(msgRef.current.toast.cutFailed);
     }
-  }, [store, propsRef, serializeCellsToTsv]);
+  }, [store, propsRef, serializeCellsToTsv, msgRef]);
   const restoreFocus = React.useCallback((element) => {
     if (element && document.activeElement !== element) {
       requestAnimationFrame(() => {
@@ -710,12 +713,12 @@ function useDataGrid({
                         processedValue = parsed.join(", ");
                       }
                     } else if (typeof parsed === "boolean") {
-                      processedValue = parsed ? msg.booleanText.checked : msg.booleanText.unchecked;
+                      processedValue = parsed ? msgRef.current.booleanText.checked : msgRef.current.booleanText.unchecked;
                     }
                   } catch {
                     const lower = pastedValue.toLowerCase();
                     if (lower === "true" || lower === "false") {
-                      processedValue = lower === "true" ? msg.booleanText.checked : msg.booleanText.unchecked;
+                      processedValue = lower === "true" ? msgRef.current.booleanText.checked : msgRef.current.booleanText.unchecked;
                     }
                   }
                 }
@@ -755,9 +758,9 @@ function useDataGrid({
           }
           onDataUpdate(allUpdates);
           if (cellsSkipped > 0) {
-            toastSuccess(msg.toast.cellsPastedWithSkipped(cellsUpdated, cellsSkipped));
+            toastSuccess(msgRef.current.toast.cellsPastedWithSkipped(cellsUpdated, cellsSkipped));
           } else {
-            toastSuccess(msg.toast.cellsPasted(cellsUpdated));
+            toastSuccess(msgRef.current.toast.cellsPasted(cellsUpdated));
           }
           const endColumnId = navigableColumnIds[endColIndex];
           if (endColumnId) {
@@ -771,7 +774,7 @@ function useDataGrid({
           }
           restoreFocus(dataGridRef.current);
         } else if (cellsSkipped > 0) {
-          toastError(msg.toast.pasteSkipped(cellsSkipped));
+          toastError(msgRef.current.toast.pasteSkipped(cellsSkipped));
         }
         if (currentState.pasteDialog.open) {
           store.setState("pasteDialog", {
@@ -781,10 +784,10 @@ function useDataGrid({
           });
         }
       } catch {
-        toastError(msg.toast.pasteFailed);
+        toastError(msgRef.current.toast.pasteFailed);
       }
     },
-    [store, navigableColumnIds, propsRef, onDataUpdate, selectRange, restoreFocus]
+    [store, navigableColumnIds, propsRef, onDataUpdate, selectRange, restoreFocus, msgRef]
   );
   const releaseFocusGuard = React.useCallback((immediate = false) => {
     if (immediate) {
@@ -2660,7 +2663,8 @@ function useDataGrid({
       contextMenu,
       pasteDialog,
       onRowAdd: hasRowAdd ? onRowAdd : void 0,
-      adjustLayout
+      adjustLayout,
+      locale
     }),
     [
       hasRowAdd,
@@ -2682,7 +2686,8 @@ function useDataGrid({
       contextMenu,
       pasteDialog,
       onRowAdd,
-      adjustLayout
+      adjustLayout,
+      locale
     ]
   );
 }