@comitor/ui 2.0.0 → 3.0.0

package/dist/data-grid/data-grid-sort-menu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/data-grid/data-grid-sort-menu.tsx"],"sourcesContent":["\"use client\";\n\nimport { useDirection } from \"@radix-ui/react-direction\";\nimport type { ColumnSort, SortDirection, Table } from \"@tanstack/react-table\";\nimport { ArrowDownUp, ChevronsUpDown, GripVertical, Trash2 } from \"lucide-react\";\nimport * as React from \"react\";\nimport { badgeVariants } from \"../components/ui/badge.js\";\nimport { Button } from \"../components/ui/button.js\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList\n} from \"../components/ui/command.js\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../components/ui/popover.js\";\nimport { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from \"../components/ui/select.js\";\nimport { cn } from \"../lib/cn.js\";\nimport { DataGridLocaleProvider, useDataGridMessages, useResolvedDataGridMessages } from \"./data-grid-locale.js\";\nimport type { DataGridLocale, DataGridMessages } from \"./messages.js\";\nimport { Sortable, SortableContent, SortableItem, SortableItemHandle, SortableOverlay } from \"./sortable.js\";\n\nconst SORT_SHORTCUT_KEY = \"s\";\nconst REMOVE_SORT_SHORTCUTS = new Set([\"backspace\", \"delete\"]);\n/* Nhãn đổi theo ngôn ngữ, `value` thì không — nên đây là hàm, không phải hằng module. */\nfunction buildSortOrders(msg: DataGridMessages) {\n  return [\n    { label: msg.sort.asc, value: \"asc\" },\n    { label: msg.sort.desc, value: \"desc\" }\n  ];\n}\n\ninterface DataGridSortMenuProps<TData> extends React.ComponentProps<typeof PopoverContent> {\n  table: Table<TData>;\n  disabled?: boolean;\n  /**\n   * Ngôn ngữ của menu: `\"en\"` (mặc định) · `\"vi\"`, hoặc cả một bảng chuỗi tự soạn.\n   *\n   * ⚠ Thanh công cụ nằm NGOÀI `<DataGrid>`, nên `locale` truyền cho lưới không với tới đây. Bọc\n   * cả màn bằng `DataGridLocaleProvider` (một lần, đúng cho mọi mảnh), hoặc truyền prop này cho\n   * từng menu. Prop thắng provider.\n   */\n  locale?: DataGridLocale | DataGridMessages;\n}\n\nexport function DataGridSortMenu<TData>({\n  table,\n  disabled,\n  className,\n  locale,\n  ...props\n}: DataGridSortMenuProps<TData>) {\n  // Menu TỰ giữ bảng chuỗi rồi PHÁT xuống cho `DataTableSortItem` bên dưới — nó là bên cung\n  // cấp context nên không đọc context của chính mình được.\n  const msg = useResolvedDataGridMessages(locale);\n  const dir = useDirection();\n  const id = React.useId();\n  const labelId = React.useId();\n  const descriptionId = React.useId();\n  const [open, setOpen] = React.useState(false);\n  const addButtonRef = React.useRef<HTMLButtonElement>(null);\n\n  const sorting = table.getState().sorting;\n  const onSortingChange = table.setSorting;\n\n  const { columnLabels, columns } = React.useMemo(() => {\n    const labels = new Map<string, string>();\n    const sortingIds = new Set(sorting.map((s) => s.id));\n    const availableColumns: { id: string; label: string }[] = [];\n\n    for (const column of table.getAllColumns()) {\n      if (!column.getCanSort()) continue;\n\n      const label = column.columnDef.meta?.label ?? column.id;\n      labels.set(column.id, label);\n\n      if (!sortingIds.has(column.id)) {\n        availableColumns.push({ id: column.id, label });\n      }\n    }\n\n    return {\n      columnLabels: labels,\n      columns: availableColumns\n    };\n  }, [sorting, table]);\n\n  const onSortAdd = React.useCallback(() => {\n    const firstColumn = columns[0];\n    if (!firstColumn) return;\n\n    onSortingChange((prevSorting) => [...prevSorting, { id: firstColumn.id, desc: false }]);\n  }, [columns, onSortingChange]);\n\n  const onSortUpdate = React.useCallback(\n    (sortId: string, updates: Partial<ColumnSort>) => {\n      onSortingChange((prevSorting) => {\n        if (!prevSorting) return prevSorting;\n        return prevSorting.map((sort) => (sort.id === sortId ? { ...sort, ...updates } : sort));\n      });\n    },\n    [onSortingChange]\n  );\n\n  const onSortRemove = React.useCallback(\n    (sortId: string) => {\n      onSortingChange((prevSorting) => prevSorting.filter((item) => item.id !== sortId));\n    },\n    [onSortingChange]\n  );\n\n  const onSortingReset = React.useCallback(\n    () => onSortingChange(table.initialState.sorting),\n    [onSortingChange, table.initialState.sorting]\n  );\n\n  React.useEffect(() => {\n    function onKeyDown(event: KeyboardEvent) {\n      if (\n        event.target instanceof HTMLInputElement ||\n        event.target instanceof HTMLTextAreaElement ||\n        (event.target instanceof HTMLElement && event.target.contentEditable === \"true\")\n      ) {\n        return;\n      }\n\n      if (event.key.toLowerCase() === SORT_SHORTCUT_KEY && (event.ctrlKey || event.metaKey) && event.shiftKey) {\n        event.preventDefault();\n        setOpen((prev) => !prev);\n      }\n    }\n\n    window.addEventListener(\"keydown\", onKeyDown);\n    return () => window.removeEventListener(\"keydown\", onKeyDown);\n  }, []);\n\n  const onTriggerKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (REMOVE_SORT_SHORTCUTS.has(event.key.toLowerCase()) && sorting.length > 0) {\n        event.preventDefault();\n        onSortingReset();\n      }\n    },\n    [sorting.length, onSortingReset]\n  );\n\n  return (\n    <DataGridLocaleProvider locale={msg}>\n      <Sortable value={sorting} onValueChange={onSortingChange} getItemValue={(item) => item.id}>\n        <Popover open={open} onOpenChange={setOpen}>\n          <PopoverTrigger asChild>\n            <Button\n              dir={dir}\n              variant=\"outline\"\n              size=\"sm\"\n              className=\"font-normal\"\n              onKeyDown={onTriggerKeyDown}\n              disabled={disabled}\n            >\n              <ArrowDownUp aria-hidden=\"true\" className=\"size-3.5 text-muted-foreground\" />\n              {msg.sort.trigger}\n              {sorting.length > 0 && (\n                <span\n                  className={cn(\n                    badgeVariants({ variant: \"secondary\" }),\n                    \"h-5 rounded px-1.5 font-mono text-[11px] font-medium\"\n                  )}\n                >\n                  {sorting.length}\n                </span>\n              )}\n            </Button>\n          </PopoverTrigger>\n          <PopoverContent\n            aria-labelledby={labelId}\n            aria-describedby={descriptionId}\n            dir={dir}\n            className={cn(\n              \"flex w-full max-w-[--radix-popover-content-available-width] flex-col gap-3.5 p-4 sm:min-w-[380px]\",\n              className\n            )}\n            {...props}\n          >\n            <div className=\"flex flex-col gap-1\">\n              <h4 id={labelId} className=\"font-medium leading-none\">\n                {sorting.length > 0 ? msg.sort.title : msg.sort.emptyTitle}\n              </h4>\n              <p id={descriptionId} className={cn(\"text-muted-foreground text-sm\", sorting.length > 0 && \"sr-only\")}>\n                {sorting.length > 0 ? msg.sort.description : msg.sort.emptyDescription}\n              </p>\n            </div>\n            {sorting.length > 0 && (\n              <SortableContent asChild>\n                <div role=\"list\" className=\"flex max-h-[300px] flex-col gap-2 overflow-y-auto p-1\">\n                  {sorting.map((sort) => (\n                    <DataTableSortItem\n                      key={sort.id}\n                      sort={sort}\n                      sortItemId={`${id}-sort-${sort.id}`}\n                      dir={dir}\n                      columns={columns}\n                      columnLabels={columnLabels}\n                      onSortUpdate={onSortUpdate}\n                      onSortRemove={onSortRemove}\n                    />\n                  ))}\n                </div>\n              </SortableContent>\n            )}\n            <div className=\"flex w-full items-center gap-2\">\n              <Button\n                size=\"sm\"\n                className=\"rounded\"\n                ref={addButtonRef}\n                onClick={onSortAdd}\n                disabled={columns.length === 0}\n              >\n                {msg.sort.add}\n              </Button>\n              {sorting.length > 0 && (\n                <Button variant=\"outline\" size=\"sm\" className=\"rounded\" onClick={onSortingReset}>\n                  {msg.sort.reset}\n                </Button>\n              )}\n            </div>\n          </PopoverContent>\n        </Popover>\n        <SortableOverlay>\n          <div dir={dir} className=\"flex items-center gap-2\">\n            <div className=\"h-8 w-44 rounded-sm bg-muted\" />\n            <div className=\"h-8 w-24 rounded-sm bg-muted\" />\n            <div className=\"size-8 shrink-0 rounded-sm bg-muted\" />\n            <div className=\"size-8 shrink-0 rounded-sm bg-muted\" />\n          </div>\n        </SortableOverlay>\n      </Sortable>\n    </DataGridLocaleProvider>\n  );\n}\n\ninterface DataTableSortItemProps {\n  sort: ColumnSort;\n  sortItemId: string;\n  dir: \"ltr\" | \"rtl\";\n  columns: { id: string; label: string }[];\n  columnLabels: Map<string, string>;\n  onSortUpdate: (sortId: string, updates: Partial<ColumnSort>) => void;\n  onSortRemove: (sortId: string) => void;\n}\n\nfunction DataTableSortItem({\n  sort,\n  sortItemId,\n  dir,\n  columns,\n  columnLabels,\n  onSortUpdate,\n  onSortRemove\n}: DataTableSortItemProps) {\n  const msg = useDataGridMessages();\n  const sortOrders = React.useMemo(() => buildSortOrders(msg), [msg]);\n  const fieldListboxId = `${sortItemId}-field-listbox`;\n  const fieldTriggerId = `${sortItemId}-field-trigger`;\n  const directionListboxId = `${sortItemId}-direction-listbox`;\n\n  const [showFieldSelector, setShowFieldSelector] = React.useState(false);\n  const [showDirectionSelector, setShowDirectionSelector] = React.useState(false);\n\n  const onItemKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (event.target instanceof HTMLInputElement || event.target instanceof HTMLTextAreaElement) {\n        return;\n      }\n\n      if (showFieldSelector || showDirectionSelector) {\n        return;\n      }\n\n      if (REMOVE_SORT_SHORTCUTS.has(event.key.toLowerCase())) {\n        event.preventDefault();\n        onSortRemove(sort.id);\n      }\n    },\n    [sort.id, showFieldSelector, showDirectionSelector, onSortRemove]\n  );\n\n  return (\n    <SortableItem value={sort.id} asChild>\n      <div role=\"listitem\" id={sortItemId} tabIndex={-1} className=\"flex items-center gap-2\" onKeyDown={onItemKeyDown}>\n        <Popover open={showFieldSelector} onOpenChange={setShowFieldSelector}>\n          <PopoverTrigger asChild>\n            <Button\n              id={fieldTriggerId}\n              aria-controls={fieldListboxId}\n              variant=\"outline\"\n              className=\"h-8 w-44 justify-between rounded font-normal\"\n            >\n              <span className=\"truncate\">{columnLabels.get(sort.id)}</span>\n              <ChevronsUpDown aria-hidden=\"true\" className=\"opacity-50\" />\n            </Button>\n          </PopoverTrigger>\n          <PopoverContent id={fieldListboxId} dir={dir} className=\"w-[--radix-popover-trigger-width] p-0\">\n            <Command>\n              <CommandInput placeholder={msg.sort.fieldPlaceholder} aria-label={msg.sort.fieldPlaceholder} />\n              <CommandList>\n                <CommandEmpty>{msg.sort.fieldEmpty}</CommandEmpty>\n                <CommandGroup>\n                  {columns.map((column) => (\n                    <CommandItem\n                      key={column.id}\n                      value={column.id}\n                      onSelect={(value) => onSortUpdate(sort.id, { id: value })}\n                    >\n                      <span className=\"truncate\">{column.label}</span>\n                    </CommandItem>\n                  ))}\n                </CommandGroup>\n              </CommandList>\n            </Command>\n          </PopoverContent>\n        </Popover>\n        <Select\n          open={showDirectionSelector}\n          onOpenChange={setShowDirectionSelector}\n          value={sort.desc ? \"desc\" : \"asc\"}\n          onValueChange={(value: SortDirection) => onSortUpdate(sort.id, { desc: value === \"desc\" })}\n        >\n          <SelectTrigger aria-controls={directionListboxId} aria-label={msg.sort.title} className=\"h-8 w-28 rounded\">\n            <SelectValue />\n          </SelectTrigger>\n          <SelectContent id={directionListboxId} className=\"min-w-[--radix-select-trigger-width]\">\n            <SelectGroup>\n              {sortOrders.map((order) => (\n                <SelectItem key={order.value} value={order.value}>\n                  {order.label}\n                </SelectItem>\n              ))}\n            </SelectGroup>\n          </SelectContent>\n        </Select>\n        <Button\n          aria-controls={sortItemId}\n          aria-label={msg.sort.remove}\n          variant=\"outline\"\n          size=\"icon\"\n          className=\"size-8 shrink-0 rounded\"\n          onClick={() => onSortRemove(sort.id)}\n        >\n          <Trash2 aria-hidden=\"true\" className=\"size-3.5\" />\n        </Button>\n        <SortableItemHandle asChild>\n          <Button aria-label={msg.sort.drag} variant=\"outline\" size=\"icon\" className=\"size-8 shrink-0 rounded\">\n            <GripVertical aria-hidden=\"true\" className=\"size-3.5\" />\n          </Button>\n        </SortableItemHandle>\n      </div>\n    </SortableItem>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/data-grid/data-grid-sort-menu.tsx"],"sourcesContent":["\"use client\";\n\nimport { useDirection } from \"@radix-ui/react-direction\";\nimport type { ColumnSort, SortDirection, Table } from \"@tanstack/react-table\";\nimport { ArrowDownUp, ChevronsUpDown, GripVertical, Trash2 } from \"lucide-react\";\nimport * as React from \"react\";\nimport { badgeVariants } from \"../components/ui/badge.js\";\nimport { Button } from \"../components/ui/button.js\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList\n} from \"../components/ui/command.js\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../components/ui/popover.js\";\nimport { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from \"../components/ui/select.js\";\nimport { cn } from \"../lib/cn.js\";\nimport { DataGridLocaleProvider, useDataGridMessages, useResolvedDataGridMessages } from \"./data-grid-locale.js\";\nimport type { DataGridLocale, DataGridMessages } from \"./messages.js\";\nimport { Sortable, SortableContent, SortableItem, SortableItemHandle, SortableOverlay } from \"./sortable.js\";\n\nconst SORT_SHORTCUT_KEY = \"s\";\nconst REMOVE_SORT_SHORTCUTS = new Set([\"backspace\", \"delete\"]);\n/* Nhãn đổi theo ngôn ngữ, `value` thì không — nên đây là hàm, không phải hằng module. */\nfunction buildSortOrders(msg: DataGridMessages) {\n  return [\n    { label: msg.sort.asc, value: \"asc\" },\n    { label: msg.sort.desc, value: \"desc\" }\n  ];\n}\n\ninterface DataGridSortMenuProps<TData> extends React.ComponentProps<typeof PopoverContent> {\n  table: Table<TData>;\n  disabled?: boolean;\n  /**\n   * Ngôn ngữ của menu: `\"en\"` · `\"vi\"`, hoặc cả một bảng chuỗi tự soạn.\n   *\n   * ⚠ Thanh công cụ nằm NGOÀI `<DataGrid>`, nên `locale` truyền cho lưới không với tới đây. Bỏ\n   * trống thì menu theo `DataGridLocaleProvider`, rồi ngôn ngữ của `ComitorLocaleProvider`, rồi\n   * `\"en\"` — app đã đặt `ComitorLocaleProvider` ở root thì không cần làm gì. Prop thắng provider.\n   */\n  locale?: DataGridLocale | DataGridMessages;\n}\n\nexport function DataGridSortMenu<TData>({\n  table,\n  disabled,\n  className,\n  locale,\n  ...props\n}: DataGridSortMenuProps<TData>) {\n  // Menu TỰ giữ bảng chuỗi rồi PHÁT xuống cho `DataTableSortItem` bên dưới (và lời đọc của\n  // `Sortable`) — nó là bên cung cấp context nên không đọc context của chính mình được. Provider\n  // nhận `locale` THÔ, giải lại với cùng đầu vào nên ra đúng bảng này.\n  const msg = useResolvedDataGridMessages(locale);\n  const dir = useDirection();\n  const id = React.useId();\n  const labelId = React.useId();\n  const descriptionId = React.useId();\n  const [open, setOpen] = React.useState(false);\n  const addButtonRef = React.useRef<HTMLButtonElement>(null);\n\n  const sorting = table.getState().sorting;\n  const onSortingChange = table.setSorting;\n\n  const { columnLabels, columns } = React.useMemo(() => {\n    const labels = new Map<string, string>();\n    const sortingIds = new Set(sorting.map((s) => s.id));\n    const availableColumns: { id: string; label: string }[] = [];\n\n    for (const column of table.getAllColumns()) {\n      if (!column.getCanSort()) continue;\n\n      const label = column.columnDef.meta?.label ?? column.id;\n      labels.set(column.id, label);\n\n      if (!sortingIds.has(column.id)) {\n        availableColumns.push({ id: column.id, label });\n      }\n    }\n\n    return {\n      columnLabels: labels,\n      columns: availableColumns\n    };\n  }, [sorting, table]);\n\n  const onSortAdd = React.useCallback(() => {\n    const firstColumn = columns[0];\n    if (!firstColumn) return;\n\n    onSortingChange((prevSorting) => [...prevSorting, { id: firstColumn.id, desc: false }]);\n  }, [columns, onSortingChange]);\n\n  const onSortUpdate = React.useCallback(\n    (sortId: string, updates: Partial<ColumnSort>) => {\n      onSortingChange((prevSorting) => {\n        if (!prevSorting) return prevSorting;\n        return prevSorting.map((sort) => (sort.id === sortId ? { ...sort, ...updates } : sort));\n      });\n    },\n    [onSortingChange]\n  );\n\n  const onSortRemove = React.useCallback(\n    (sortId: string) => {\n      onSortingChange((prevSorting) => prevSorting.filter((item) => item.id !== sortId));\n    },\n    [onSortingChange]\n  );\n\n  const onSortingReset = React.useCallback(\n    () => onSortingChange(table.initialState.sorting),\n    [onSortingChange, table.initialState.sorting]\n  );\n\n  React.useEffect(() => {\n    function onKeyDown(event: KeyboardEvent) {\n      if (\n        event.target instanceof HTMLInputElement ||\n        event.target instanceof HTMLTextAreaElement ||\n        (event.target instanceof HTMLElement && event.target.contentEditable === \"true\")\n      ) {\n        return;\n      }\n\n      if (event.key.toLowerCase() === SORT_SHORTCUT_KEY && (event.ctrlKey || event.metaKey) && event.shiftKey) {\n        event.preventDefault();\n        setOpen((prev) => !prev);\n      }\n    }\n\n    window.addEventListener(\"keydown\", onKeyDown);\n    return () => window.removeEventListener(\"keydown\", onKeyDown);\n  }, []);\n\n  const onTriggerKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (REMOVE_SORT_SHORTCUTS.has(event.key.toLowerCase()) && sorting.length > 0) {\n        event.preventDefault();\n        onSortingReset();\n      }\n    },\n    [sorting.length, onSortingReset]\n  );\n\n  return (\n    <DataGridLocaleProvider locale={locale}>\n      <Sortable value={sorting} onValueChange={onSortingChange} getItemValue={(item) => item.id}>\n        <Popover open={open} onOpenChange={setOpen}>\n          <PopoverTrigger asChild>\n            <Button\n              dir={dir}\n              variant=\"outline\"\n              size=\"sm\"\n              className=\"font-normal\"\n              onKeyDown={onTriggerKeyDown}\n              disabled={disabled}\n            >\n              <ArrowDownUp aria-hidden=\"true\" className=\"size-3.5 text-muted-foreground\" />\n              {msg.sort.trigger}\n              {sorting.length > 0 && (\n                <span\n                  className={cn(\n                    badgeVariants({ variant: \"secondary\" }),\n                    \"h-5 rounded px-1.5 font-mono text-[11px] font-medium\"\n                  )}\n                >\n                  {sorting.length}\n                </span>\n              )}\n            </Button>\n          </PopoverTrigger>\n          <PopoverContent\n            aria-labelledby={labelId}\n            aria-describedby={descriptionId}\n            dir={dir}\n            className={cn(\n              \"flex w-full max-w-[--radix-popover-content-available-width] flex-col gap-3.5 p-4 sm:min-w-[380px]\",\n              className\n            )}\n            {...props}\n          >\n            <div className=\"flex flex-col gap-1\">\n              <h4 id={labelId} className=\"font-medium leading-none\">\n                {sorting.length > 0 ? msg.sort.title : msg.sort.emptyTitle}\n              </h4>\n              <p id={descriptionId} className={cn(\"text-muted-foreground text-sm\", sorting.length > 0 && \"sr-only\")}>\n                {sorting.length > 0 ? msg.sort.description : msg.sort.emptyDescription}\n              </p>\n            </div>\n            {sorting.length > 0 && (\n              <SortableContent asChild>\n                <div role=\"list\" className=\"flex max-h-[300px] flex-col gap-2 overflow-y-auto p-1\">\n                  {sorting.map((sort) => (\n                    <DataTableSortItem\n                      key={sort.id}\n                      sort={sort}\n                      sortItemId={`${id}-sort-${sort.id}`}\n                      dir={dir}\n                      columns={columns}\n                      columnLabels={columnLabels}\n                      onSortUpdate={onSortUpdate}\n                      onSortRemove={onSortRemove}\n                    />\n                  ))}\n                </div>\n              </SortableContent>\n            )}\n            <div className=\"flex w-full items-center gap-2\">\n              <Button\n                size=\"sm\"\n                className=\"rounded\"\n                ref={addButtonRef}\n                onClick={onSortAdd}\n                disabled={columns.length === 0}\n              >\n                {msg.sort.add}\n              </Button>\n              {sorting.length > 0 && (\n                <Button variant=\"outline\" size=\"sm\" className=\"rounded\" onClick={onSortingReset}>\n                  {msg.sort.reset}\n                </Button>\n              )}\n            </div>\n          </PopoverContent>\n        </Popover>\n        <SortableOverlay>\n          <div dir={dir} className=\"flex items-center gap-2\">\n            <div className=\"h-8 w-44 rounded-sm bg-muted\" />\n            <div className=\"h-8 w-24 rounded-sm bg-muted\" />\n            <div className=\"size-8 shrink-0 rounded-sm bg-muted\" />\n            <div className=\"size-8 shrink-0 rounded-sm bg-muted\" />\n          </div>\n        </SortableOverlay>\n      </Sortable>\n    </DataGridLocaleProvider>\n  );\n}\n\ninterface DataTableSortItemProps {\n  sort: ColumnSort;\n  sortItemId: string;\n  dir: \"ltr\" | \"rtl\";\n  columns: { id: string; label: string }[];\n  columnLabels: Map<string, string>;\n  onSortUpdate: (sortId: string, updates: Partial<ColumnSort>) => void;\n  onSortRemove: (sortId: string) => void;\n}\n\nfunction DataTableSortItem({\n  sort,\n  sortItemId,\n  dir,\n  columns,\n  columnLabels,\n  onSortUpdate,\n  onSortRemove\n}: DataTableSortItemProps) {\n  const msg = useDataGridMessages();\n  const sortOrders = React.useMemo(() => buildSortOrders(msg), [msg]);\n  const fieldListboxId = `${sortItemId}-field-listbox`;\n  const fieldTriggerId = `${sortItemId}-field-trigger`;\n  const directionListboxId = `${sortItemId}-direction-listbox`;\n\n  const [showFieldSelector, setShowFieldSelector] = React.useState(false);\n  const [showDirectionSelector, setShowDirectionSelector] = React.useState(false);\n\n  const onItemKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (event.target instanceof HTMLInputElement || event.target instanceof HTMLTextAreaElement) {\n        return;\n      }\n\n      if (showFieldSelector || showDirectionSelector) {\n        return;\n      }\n\n      if (REMOVE_SORT_SHORTCUTS.has(event.key.toLowerCase())) {\n        event.preventDefault();\n        onSortRemove(sort.id);\n      }\n    },\n    [sort.id, showFieldSelector, showDirectionSelector, onSortRemove]\n  );\n\n  return (\n    <SortableItem value={sort.id} asChild>\n      <div role=\"listitem\" id={sortItemId} tabIndex={-1} className=\"flex items-center gap-2\" onKeyDown={onItemKeyDown}>\n        <Popover open={showFieldSelector} onOpenChange={setShowFieldSelector}>\n          <PopoverTrigger asChild>\n            <Button\n              id={fieldTriggerId}\n              aria-controls={fieldListboxId}\n              variant=\"outline\"\n              className=\"h-8 w-44 justify-between rounded font-normal\"\n            >\n              <span className=\"truncate\">{columnLabels.get(sort.id)}</span>\n              <ChevronsUpDown aria-hidden=\"true\" className=\"opacity-50\" />\n            </Button>\n          </PopoverTrigger>\n          <PopoverContent id={fieldListboxId} dir={dir} className=\"w-[--radix-popover-trigger-width] p-0\">\n            <Command>\n              <CommandInput placeholder={msg.sort.fieldPlaceholder} aria-label={msg.sort.fieldPlaceholder} />\n              <CommandList>\n                <CommandEmpty>{msg.sort.fieldEmpty}</CommandEmpty>\n                <CommandGroup>\n                  {columns.map((column) => (\n                    <CommandItem\n                      key={column.id}\n                      value={column.id}\n                      onSelect={(value) => onSortUpdate(sort.id, { id: value })}\n                    >\n                      <span className=\"truncate\">{column.label}</span>\n                    </CommandItem>\n                  ))}\n                </CommandGroup>\n              </CommandList>\n            </Command>\n          </PopoverContent>\n        </Popover>\n        <Select\n          open={showDirectionSelector}\n          onOpenChange={setShowDirectionSelector}\n          value={sort.desc ? \"desc\" : \"asc\"}\n          onValueChange={(value: SortDirection) => onSortUpdate(sort.id, { desc: value === \"desc\" })}\n        >\n          <SelectTrigger aria-controls={directionListboxId} aria-label={msg.sort.title} className=\"h-8 w-28 rounded\">\n            <SelectValue />\n          </SelectTrigger>\n          <SelectContent id={directionListboxId} className=\"min-w-[--radix-select-trigger-width]\">\n            <SelectGroup>\n              {sortOrders.map((order) => (\n                <SelectItem key={order.value} value={order.value}>\n                  {order.label}\n                </SelectItem>\n              ))}\n            </SelectGroup>\n          </SelectContent>\n        </Select>\n        <Button\n          aria-controls={sortItemId}\n          aria-label={msg.sort.remove}\n          variant=\"outline\"\n          size=\"icon\"\n          className=\"size-8 shrink-0 rounded\"\n          onClick={() => onSortRemove(sort.id)}\n        >\n          <Trash2 aria-hidden=\"true\" className=\"size-3.5\" />\n        </Button>\n        <SortableItemHandle asChild>\n          <Button aria-label={msg.sort.drag} variant=\"outline\" size=\"icon\" className=\"size-8 shrink-0 rounded\">\n            <GripVertical aria-hidden=\"true\" className=\"size-3.5\" />\n          </Button>\n        </SortableItemHandle>\n      </div>\n    </SortableItem>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/data-grid/data-grid-view-menu.d.ts

@@ -10,11 +10,11 @@ interface DataGridViewMenuProps<TData> extends React.ComponentProps<typeof Popov
     table: Table<TData>;
     disabled?: boolean;
     /**
-     * Ngôn ngữ của menu: `"en"` (mặc định) · `"vi"`, hoặc cả một bảng chuỗi tự soạn.
+     * Ngôn ngữ của menu: `"en"` · `"vi"`, hoặc cả một bảng chuỗi tự soạn.
      *
-     * ⚠ Thanh công cụ nằm NGOÀI `<DataGrid>`, nên `locale` truyền cho lưới không với tới đây. Bọc
-     * cả màn bằng `DataGridLocaleProvider` (một lần, đúng cho mọi mảnh), hoặc truyền prop này cho
-     * từng menu. Prop thắng provider.
+     * ⚠ Thanh công cụ nằm NGOÀI `<DataGrid>`, nên `locale` truyền cho lưới không với tới đây. Bỏ
+     * trống thì menu theo `DataGridLocaleProvider`, rồi ngôn ngữ của `ComitorLocaleProvider`, rồi
+     * `"en"` — app đã đặt `ComitorLocaleProvider` ở root thì không cần làm gì. Prop thắng provider.
      */
     locale?: DataGridLocale | DataGridMessages;
 }

package/dist/data-grid/data-grid-view-menu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/data-grid/data-grid-view-menu.tsx"],"sourcesContent":["\"use client\";\n\nimport { useDirection } from \"@radix-ui/react-direction\";\nimport type { Table } from \"@tanstack/react-table\";\nimport { Check, Settings2 } from \"lucide-react\";\nimport * as React from \"react\";\nimport { Button } from \"../components/ui/button.js\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList\n} from \"../components/ui/command.js\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../components/ui/popover.js\";\nimport { cn } from \"../lib/cn.js\";\nimport { useResolvedDataGridMessages } from \"./data-grid-locale.js\";\nimport type { DataGridLocale, DataGridMessages } from \"./messages.js\";\n\ninterface DataGridViewMenuProps<TData> extends React.ComponentProps<typeof PopoverContent> {\n  table: Table<TData>;\n  disabled?: boolean;\n  /**\n   * Ngôn ngữ của menu: `\"en\"` (mặc định) · `\"vi\"`, hoặc cả một bảng chuỗi tự soạn.\n   *\n   * ⚠ Thanh công cụ nằm NGOÀI `<DataGrid>`, nên `locale` truyền cho lưới không với tới đây. Bọc\n   * cả màn bằng `DataGridLocaleProvider` (một lần, đúng cho mọi mảnh), hoặc truyền prop này cho\n   * từng menu. Prop thắng provider.\n   */\n  locale?: DataGridLocale | DataGridMessages;\n}\n\n/** Ẩn/hiện cột của lưới. Cột muốn khoá luôn hiển thị thì đặt `enableHiding: false`. */\nexport function DataGridViewMenu<TData>({\n  table,\n  disabled,\n  className,\n  locale,\n  ...props\n}: DataGridViewMenuProps<TData>) {\n  const msg = useResolvedDataGridMessages(locale);\n  const dir = useDirection();\n\n  const columns = React.useMemo(\n    () => table.getAllColumns().filter((column) => typeof column.accessorFn !== \"undefined\" && column.getCanHide()),\n    [table]\n  );\n\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <Button\n          aria-label={msg.view.toggleColumns}\n          role=\"combobox\"\n          dir={dir}\n          variant=\"outline\"\n          size=\"sm\"\n          className=\"font-normal\"\n          disabled={disabled}\n        >\n          <Settings2 aria-hidden=\"true\" className=\"size-3.5 text-muted-foreground\" />\n          {msg.view.trigger}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent dir={dir} align=\"end\" className={cn(\"w-52 p-0\", className)} {...props}>\n        <Command>\n          <CommandInput placeholder={msg.view.searchPlaceholder} aria-label={msg.view.searchPlaceholder} />\n          <CommandList>\n            <CommandEmpty>{msg.view.empty}</CommandEmpty>\n            <CommandGroup>\n              {columns.map((column) => {\n                const isVisible = column.getIsVisible();\n\n                return (\n                  <CommandItem\n                    key={column.id}\n                    value={column.columnDef.meta?.label ?? column.id}\n                    onSelect={() => column.toggleVisibility(!isVisible)}\n                  >\n                    <span className=\"truncate\">{column.columnDef.meta?.label ?? column.id}</span>\n                    <Check className={cn(\"ms-auto size-4\", isVisible ? \"opacity-100\" : \"opacity-0\")} />\n                  </CommandItem>\n                );\n              })}\n            </CommandGroup>\n          </CommandList>\n        </Command>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":";AAoDQ,SASE,KATF;AAlDR,SAAS,oBAAoB;AAE7B,SAAS,OAAO,iBAAiB;AACjC,YAAY,WAAW;AACvB,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,SAAS,gBAAgB,sBAAsB;AACxD,SAAS,UAAU;AACnB,SAAS,mCAAmC;AAiBrC,SAAS,iBAAwB;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiC;AAC/B,QAAM,MAAM,4BAA4B,MAAM;AAC9C,QAAM,MAAM,aAAa;AAEzB,QAAM,UAAU,MAAM;AAAA,IACpB,MAAM,MAAM,cAAc,EAAE,OAAO,CAAC,WAAW,OAAO,OAAO,eAAe,eAAe,OAAO,WAAW,CAAC;AAAA,IAC9G,CAAC,KAAK;AAAA,EACR;AAEA,SACE,qBAAC,WACC;AAAA,wBAAC,kBAAe,SAAO,MACrB;AAAA,MAAC;AAAA;AAAA,QACC,cAAY,IAAI,KAAK;AAAA,QACrB,MAAK;AAAA,QACL;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,WAAU;AAAA,QACV;AAAA,QAEA;AAAA,8BAAC,aAAU,eAAY,QAAO,WAAU,kCAAiC;AAAA,UACxE,IAAI,KAAK;AAAA;AAAA;AAAA,IACZ,GACF;AAAA,IACA,oBAAC,kBAAe,KAAU,OAAM,OAAM,WAAW,GAAG,YAAY,SAAS,GAAI,GAAG,OAC9E,+BAAC,WACC;AAAA,0BAAC,gBAAa,aAAa,IAAI,KAAK,mBAAmB,cAAY,IAAI,KAAK,mBAAmB;AAAA,MAC/F,qBAAC,eACC;AAAA,4BAAC,gBAAc,cAAI,KAAK,OAAM;AAAA,QAC9B,oBAAC,gBACE,kBAAQ,IAAI,CAAC,WAAW;AACvB,gBAAM,YAAY,OAAO,aAAa;AAEtC,iBACE;AAAA,YAAC;AAAA;AAAA,cAEC,OAAO,OAAO,UAAU,MAAM,SAAS,OAAO;AAAA,cAC9C,UAAU,MAAM,OAAO,iBAAiB,CAAC,SAAS;AAAA,cAElD;AAAA,oCAAC,UAAK,WAAU,YAAY,iBAAO,UAAU,MAAM,SAAS,OAAO,IAAG;AAAA,gBACtE,oBAAC,SAAM,WAAW,GAAG,kBAAkB,YAAY,gBAAgB,WAAW,GAAG;AAAA;AAAA;AAAA,YAL5E,OAAO;AAAA,UAMd;AAAA,QAEJ,CAAC,GACH;AAAA,SACF;AAAA,OACF,GACF;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/data-grid/data-grid-view-menu.tsx"],"sourcesContent":["\"use client\";\n\nimport { useDirection } from \"@radix-ui/react-direction\";\nimport type { Table } from \"@tanstack/react-table\";\nimport { Check, Settings2 } from \"lucide-react\";\nimport * as React from \"react\";\nimport { Button } from \"../components/ui/button.js\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList\n} from \"../components/ui/command.js\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../components/ui/popover.js\";\nimport { cn } from \"../lib/cn.js\";\nimport { useResolvedDataGridMessages } from \"./data-grid-locale.js\";\nimport type { DataGridLocale, DataGridMessages } from \"./messages.js\";\n\ninterface DataGridViewMenuProps<TData> extends React.ComponentProps<typeof PopoverContent> {\n  table: Table<TData>;\n  disabled?: boolean;\n  /**\n   * Ngôn ngữ của menu: `\"en\"` · `\"vi\"`, hoặc cả một bảng chuỗi tự soạn.\n   *\n   * ⚠ Thanh công cụ nằm NGOÀI `<DataGrid>`, nên `locale` truyền cho lưới không với tới đây. Bỏ\n   * trống thì menu theo `DataGridLocaleProvider`, rồi ngôn ngữ của `ComitorLocaleProvider`, rồi\n   * `\"en\"` — app đã đặt `ComitorLocaleProvider` ở root thì không cần làm gì. Prop thắng provider.\n   */\n  locale?: DataGridLocale | DataGridMessages;\n}\n\n/** Ẩn/hiện cột của lưới. Cột muốn khoá luôn hiển thị thì đặt `enableHiding: false`. */\nexport function DataGridViewMenu<TData>({\n  table,\n  disabled,\n  className,\n  locale,\n  ...props\n}: DataGridViewMenuProps<TData>) {\n  const msg = useResolvedDataGridMessages(locale);\n  const dir = useDirection();\n\n  const columns = React.useMemo(\n    () => table.getAllColumns().filter((column) => typeof column.accessorFn !== \"undefined\" && column.getCanHide()),\n    [table]\n  );\n\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <Button\n          aria-label={msg.view.toggleColumns}\n          role=\"combobox\"\n          dir={dir}\n          variant=\"outline\"\n          size=\"sm\"\n          className=\"font-normal\"\n          disabled={disabled}\n        >\n          <Settings2 aria-hidden=\"true\" className=\"size-3.5 text-muted-foreground\" />\n          {msg.view.trigger}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent dir={dir} align=\"end\" className={cn(\"w-52 p-0\", className)} {...props}>\n        <Command>\n          <CommandInput placeholder={msg.view.searchPlaceholder} aria-label={msg.view.searchPlaceholder} />\n          <CommandList>\n            <CommandEmpty>{msg.view.empty}</CommandEmpty>\n            <CommandGroup>\n              {columns.map((column) => {\n                const isVisible = column.getIsVisible();\n\n                return (\n                  <CommandItem\n                    key={column.id}\n                    value={column.columnDef.meta?.label ?? column.id}\n                    onSelect={() => column.toggleVisibility(!isVisible)}\n                  >\n                    <span className=\"truncate\">{column.columnDef.meta?.label ?? column.id}</span>\n                    <Check className={cn(\"ms-auto size-4\", isVisible ? \"opacity-100\" : \"opacity-0\")} />\n                  </CommandItem>\n                );\n              })}\n            </CommandGroup>\n          </CommandList>\n        </Command>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":";AAoDQ,SASE,KATF;AAlDR,SAAS,oBAAoB;AAE7B,SAAS,OAAO,iBAAiB;AACjC,YAAY,WAAW;AACvB,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,SAAS,gBAAgB,sBAAsB;AACxD,SAAS,UAAU;AACnB,SAAS,mCAAmC;AAiBrC,SAAS,iBAAwB;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiC;AAC/B,QAAM,MAAM,4BAA4B,MAAM;AAC9C,QAAM,MAAM,aAAa;AAEzB,QAAM,UAAU,MAAM;AAAA,IACpB,MAAM,MAAM,cAAc,EAAE,OAAO,CAAC,WAAW,OAAO,OAAO,eAAe,eAAe,OAAO,WAAW,CAAC;AAAA,IAC9G,CAAC,KAAK;AAAA,EACR;AAEA,SACE,qBAAC,WACC;AAAA,wBAAC,kBAAe,SAAO,MACrB;AAAA,MAAC;AAAA;AAAA,QACC,cAAY,IAAI,KAAK;AAAA,QACrB,MAAK;AAAA,QACL;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,WAAU;AAAA,QACV;AAAA,QAEA;AAAA,8BAAC,aAAU,eAAY,QAAO,WAAU,kCAAiC;AAAA,UACxE,IAAI,KAAK;AAAA;AAAA;AAAA,IACZ,GACF;AAAA,IACA,oBAAC,kBAAe,KAAU,OAAM,OAAM,WAAW,GAAG,YAAY,SAAS,GAAI,GAAG,OAC9E,+BAAC,WACC;AAAA,0BAAC,gBAAa,aAAa,IAAI,KAAK,mBAAmB,cAAY,IAAI,KAAK,mBAAmB;AAAA,MAC/F,qBAAC,eACC;AAAA,4BAAC,gBAAc,cAAI,KAAK,OAAM;AAAA,QAC9B,oBAAC,gBACE,kBAAQ,IAAI,CAAC,WAAW;AACvB,gBAAM,YAAY,OAAO,aAAa;AAEtC,iBACE;AAAA,YAAC;AAAA;AAAA,cAEC,OAAO,OAAO,UAAU,MAAM,SAAS,OAAO;AAAA,cAC9C,UAAU,MAAM,OAAO,iBAAiB,CAAC,SAAS;AAAA,cAElD;AAAA,oCAAC,UAAK,WAAU,YAAY,iBAAO,UAAU,MAAM,SAAS,OAAO,IAAG;AAAA,gBACtE,oBAAC,SAAM,WAAW,GAAG,kBAAkB,YAAY,gBAAgB,WAAW,GAAG;AAAA;AAAA;AAAA,YAL5E,OAAO;AAAA,UAMd;AAAA,QAEJ,CAAC,GACH;AAAA,SACF;AAAA,OACF,GACF;AAAA,KACF;AAEJ;","names":[]}

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

@@ -17,12 +17,13 @@ interface DataGridProps<TData> extends Omit<ReturnType<typeof useDataGrid<TData>
     /** Kéo giãn các cột cho vừa bề ngang khi tổng bề rộng cột nhỏ hơn khung */
     stretchColumns?: 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.
+     * Ngôn ngữ của lưới: `"en"` · `"vi"`, hoặc cả một bảng chuỗi tự soạn. Bỏ trống thì theo
+     * `DataGridLocaleProvider` bọc ngoài, rồi ngôn ngữ của `ComitorLocaleProvider`, rồi `"en"`.
      *
      * Thường nó đi theo kết quả của {@link useDataGrid} nên không phải truyền lại ở đây. Giá trị
      * đặt thẳng lên `<DataGrid>` THẮNG giá trị từ hook — hữu ích khi một màn có hai lưới khác ngôn
-     * ngữ. Thanh công cụ nằm ngoài lưới nê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.
+     * ngữ. Thanh công cụ nằm ngoài lưới nên nó KHÔNG nhận được giá trị này: chúng theo provider,
+     * hoặc nhận `locale` riêng từng menu.
      */
     locale?: DataGridLocale | DataGridMessages;
 }

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

@@ -4,14 +4,13 @@ import { Plus } from "lucide-react";
 import * as React from "react";
 import { TooltipProvider } from "../components/ui/tooltip.js";
 import { cn } from "../lib/cn.js";
+import { useAsRef } from "../lib/use-as-ref.js";
 import { DataGridColumnHeader } from "./data-grid-column-header.js";
 import { DataGridContextMenu } from "./data-grid-context-menu.js";
-import { DataGridLocaleProvider } from "./data-grid-locale.js";
+import { DataGridLocaleProvider, useResolvedDataGridMessages } from "./data-grid-locale.js";
 import { DataGridPasteDialog } from "./data-grid-paste-dialog.js";
 import { DataGridRow } from "./data-grid-row.js";
 import { DataGridSearch } from "./data-grid-search.js";
-import { getDataGridMessages } from "./messages.js";
-import { useAsRef } from "./use-as-ref.js";
 import { flexRender, getColumnBorderVisibility, getColumnPinningStyle } from "./utils.js";
 const EMPTY_CELL_SELECTION_SET = /* @__PURE__ */ new Set();
 function DataGrid({
@@ -71,7 +70,7 @@ function DataGrid({
     },
     [onRowAddRef]
   );
-  const msg = React.useMemo(() => getDataGridMessages(locale), [locale]);
+  const msg = useResolvedDataGridMessages(locale);
   return /* @__PURE__ */ jsx(DataGridLocaleProvider, { locale, children: /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 200, children: /* @__PURE__ */ jsxs("div", { "data-slot": "grid-wrapper", dir, ...props, className: cn("relative flex w-full flex-col", className), children: [
     searchState && /* @__PURE__ */ jsx(DataGridSearch, { ...searchState }),
     /* @__PURE__ */ jsx(DataGridContextMenu, { tableMeta, columns, contextMenu }),

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/data-grid/data-grid.tsx"],"sourcesContent":["\"use client\";\n\nimport { Plus } from \"lucide-react\";\nimport * as React from \"react\";\nimport { TooltipProvider } from \"../components/ui/tooltip.js\";\nimport { cn } from \"../lib/cn.js\";\nimport { DataGridColumnHeader } from \"./data-grid-column-header.js\";\nimport { DataGridContextMenu } from \"./data-grid-context-menu.js\";\nimport { DataGridLocaleProvider } from \"./data-grid-locale.js\";\nimport { DataGridPasteDialog } from \"./data-grid-paste-dialog.js\";\nimport { DataGridRow } from \"./data-grid-row.js\";\nimport { DataGridSearch } from \"./data-grid-search.js\";\nimport { type DataGridLocale, type DataGridMessages, getDataGridMessages } from \"./messages.js\";\nimport type { Direction } from \"./types.js\";\nimport { useAsRef } from \"./use-as-ref.js\";\nimport type { useDataGrid } from \"./use-data-grid.js\";\nimport { flexRender, getColumnBorderVisibility, getColumnPinningStyle } from \"./utils.js\";\n\nconst EMPTY_CELL_SELECTION_SET = new Set<string>();\n\ninterface DataGridProps<TData>\n  extends Omit<ReturnType<typeof useDataGrid<TData>>, \"dir\" | \"locale\">,\n    Omit<React.ComponentProps<\"div\">, \"contextMenu\"> {\n  dir?: Direction;\n  /**\n   * Chiều cao tối đa của hộp cuộn: số = px, chuỗi = giá trị CSS bất kỳ\n   * (vd `\"100%\"`, `\"calc(100dvh - 220px)\"` khi muốn lưới lấp đầy phần còn lại của trang).\n   */\n  height?: number | string;\n  /** Kéo giãn các cột cho vừa bề ngang khi tổng bề rộng cột nhỏ hơn khung */\n  stretchColumns?: boolean;\n  /**\n   * Ngôn ngữ của lưới: `\"en\"` (mặc định) · `\"vi\"`, hoặc cả một bảng chuỗi tự soạn.\n   *\n   * Thường nó đi theo kết quả của {@link useDataGrid} nên không phải truyền lại ở đây. Giá trị\n   * đặt thẳng lên `<DataGrid>` THẮNG giá trị từ hook — hữu ích khi một màn có hai lưới khác ngôn\n   * ngữ. Thanh công cụ nằm ngoài lưới nên nó KHÔNG nhận được giá trị này: bọc cả màn bằng\n   * `DataGridLocaleProvider`, hoặc truyền `locale` cho từng menu.\n   */\n  locale?: DataGridLocale | DataGridMessages;\n}\n\n/**\n * Lưới dữ liệu sửa trực tiếp (như bảng tính): ảo hoá dòng, điều hướng bằng bàn phím,\n * chọn vùng ô, sao chép/cắt/dán, ghim cột, đổi rộng cột.\n *\n * Nhận nguyên kết quả của {@link useDataGrid}:\n * ```tsx\n * const { table, ...dataGridProps } = useDataGrid({ data, columns, onDataChange });\n * <DataGrid {...dataGridProps} table={table} aria-label=\"Danh sách bệnh nhân\" />\n * ```\n *\n * `aria-label` / `aria-labelledby` / `aria-describedby` được đặt lên đúng thẻ mang\n * `role=\"grid\"` (thẻ bọc ngoài chỉ là hộp bố cục, gắn nhãn lên đó trình đọc màn hình bỏ qua).\n */\nexport function DataGrid<TData>({\n  dataGridRef,\n  headerRef,\n  rowMapRef,\n  footerRef,\n  dir = \"ltr\",\n  table,\n  tableMeta,\n  virtualTotalSize,\n  virtualItems,\n  measureElement,\n  columns,\n  columnSizeVars,\n  searchState,\n  searchMatchesByRow,\n  activeSearchMatch,\n  cellSelectionMap,\n  focusedCell,\n  editingCell,\n  rowHeight,\n  contextMenu,\n  pasteDialog,\n  onRowAdd: onRowAddProp,\n  height = 600,\n  stretchColumns = false,\n  locale,\n  adjustLayout = false,\n  className,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledby,\n  \"aria-describedby\": ariaDescribedby,\n  ...props\n}: DataGridProps<TData>) {\n  const rows = table.getRowModel().rows;\n  const readOnly = tableMeta?.readOnly ?? false;\n  const columnVisibility = table.getState().columnVisibility;\n  const columnPinning = table.getState().columnPinning;\n\n  const onRowAddRef = useAsRef(onRowAddProp);\n\n  const onRowAdd = React.useCallback(\n    (event: React.MouseEvent<HTMLDivElement>) => {\n      onRowAddRef.current?.(event);\n    },\n    [onRowAddRef]\n  );\n\n  const onDataGridContextMenu = React.useCallback((event: React.MouseEvent<HTMLDivElement>) => {\n    event.preventDefault();\n  }, []);\n\n  const onFooterCellKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (!onRowAddRef.current) return;\n\n      if (event.key === \"Enter\" || event.key === \" \") {\n        event.preventDefault();\n        onRowAddRef.current();\n      }\n    },\n    [onRowAddRef]\n  );\n\n  const msg = React.useMemo(() => getDataGridMessages(locale), [locale]);\n\n  return (\n    <DataGridLocaleProvider locale={locale}>\n      <TooltipProvider delayDuration={200}>\n        <div data-slot=\"grid-wrapper\" dir={dir} {...props} className={cn(\"relative flex w-full flex-col\", className)}>\n          {searchState && <DataGridSearch {...searchState} />}\n          <DataGridContextMenu tableMeta={tableMeta} columns={columns} contextMenu={contextMenu} />\n          <DataGridPasteDialog tableMeta={tableMeta} pasteDialog={pasteDialog} />\n          <div\n            role=\"grid\"\n            aria-label={ariaLabelledby ? undefined : (ariaLabel ?? msg.grid.label)}\n            aria-labelledby={ariaLabelledby}\n            aria-describedby={ariaDescribedby}\n            aria-rowcount={rows.length + (onRowAddProp ? 1 : 0)}\n            aria-colcount={columns.length}\n            data-slot=\"grid\"\n            tabIndex={0}\n            ref={dataGridRef}\n            className=\"relative grid select-none overflow-auto rounded-lg border bg-card focus:outline-none focus-visible:outline-none\"\n            style={{\n              ...columnSizeVars,\n              maxHeight: typeof height === \"number\" ? `${height}px` : height\n            }}\n            onContextMenu={onDataGridContextMenu}\n          >\n            <div\n              role=\"rowgroup\"\n              data-slot=\"grid-header\"\n              ref={headerRef}\n              className=\"sticky top-0 z-10 grid border-b bg-card\"\n            >\n              {table.getHeaderGroups().map((headerGroup, rowIndex) => (\n                <div\n                  key={headerGroup.id}\n                  role=\"row\"\n                  aria-rowindex={rowIndex + 1}\n                  data-slot=\"grid-header-row\"\n                  tabIndex={-1}\n                  className=\"flex w-full\"\n                >\n                  {headerGroup.headers.map((header, colIndex) => {\n                    const sorting = table.getState().sorting;\n                    const currentSort = sorting.find((sort) => sort.id === header.column.id);\n                    const isSortable = header.column.getCanSort();\n\n                    const nextHeader = headerGroup.headers[colIndex + 1];\n                    const isLastColumn = colIndex === headerGroup.headers.length - 1;\n\n                    const { showEndBorder, showStartBorder } = getColumnBorderVisibility({\n                      column: header.column,\n                      nextColumn: nextHeader?.column,\n                      isLastColumn\n                    });\n\n                    return (\n                      <div\n                        key={header.id}\n                        role=\"columnheader\"\n                        aria-colindex={colIndex + 1}\n                        aria-sort={\n                          currentSort?.desc === false\n                            ? \"ascending\"\n                            : currentSort?.desc === true\n                              ? \"descending\"\n                              : isSortable\n                                ? \"none\"\n                                : undefined\n                        }\n                        data-slot=\"grid-header-cell\"\n                        tabIndex={-1}\n                        className={cn(\"relative\", {\n                          grow: stretchColumns && header.column.id !== \"select\",\n                          \"border-e\": showEndBorder && header.column.id !== \"select\",\n                          \"border-s\": showStartBorder && header.column.id !== \"select\"\n                        })}\n                        style={{\n                          ...getColumnPinningStyle({ column: header.column, dir }),\n                          width: `calc(var(--header-${header.id}-size) * 1px)`\n                        }}\n                      >\n                        {header.isPlaceholder ? null : typeof header.column.columnDef.header === \"function\" ? (\n                          <div className=\"size-full px-3 py-1.5\">\n                            {flexRender(header.column.columnDef.header, header.getContext())}\n                          </div>\n                        ) : (\n                          <DataGridColumnHeader header={header} table={table} />\n                        )}\n                      </div>\n                    );\n                  })}\n                </div>\n              ))}\n            </div>\n            <div\n              role=\"rowgroup\"\n              data-slot=\"grid-body\"\n              className=\"relative grid\"\n              style={{\n                height: `${virtualTotalSize}px`,\n                contain: adjustLayout ? \"layout paint\" : \"strict\"\n              }}\n            >\n              {virtualItems.map((virtualItem) => {\n                const row = rows[virtualItem.index];\n                if (!row) return null;\n\n                const cellSelectionKeys = cellSelectionMap?.get(virtualItem.index) ?? EMPTY_CELL_SELECTION_SET;\n\n                const searchMatchColumns = searchMatchesByRow?.get(virtualItem.index) ?? null;\n                const isActiveSearchRow = activeSearchMatch?.rowIndex === virtualItem.index;\n\n                return (\n                  <DataGridRow\n                    key={row.id}\n                    row={row}\n                    tableMeta={tableMeta}\n                    rowMapRef={rowMapRef}\n                    virtualItem={virtualItem}\n                    measureElement={measureElement}\n                    rowHeight={rowHeight}\n                    columnVisibility={columnVisibility}\n                    columnPinning={columnPinning}\n                    focusedCell={focusedCell}\n                    editingCell={editingCell}\n                    cellSelectionKeys={cellSelectionKeys}\n                    searchMatchColumns={searchMatchColumns}\n                    activeSearchMatch={isActiveSearchRow ? activeSearchMatch : null}\n                    dir={dir}\n                    adjustLayout={adjustLayout}\n                    stretchColumns={stretchColumns}\n                    readOnly={readOnly}\n                  />\n                );\n              })}\n            </div>\n            {/* Chỉ hiện dòng \"Thêm dòng\" khi ứng dụng thật sự truyền onRowAdd\n            (biến `onRowAdd` bên dưới là callback bọc, luôn khác undefined). */}\n            {!readOnly && onRowAddProp && (\n              <div\n                role=\"rowgroup\"\n                data-slot=\"grid-footer\"\n                ref={footerRef}\n                className=\"sticky bottom-0 z-10 grid border-t bg-card\"\n              >\n                <div\n                  role=\"row\"\n                  aria-rowindex={rows.length + 2}\n                  data-slot=\"grid-add-row\"\n                  tabIndex={-1}\n                  className=\"flex w-full\"\n                >\n                  <div\n                    role=\"gridcell\"\n                    tabIndex={0}\n                    className=\"relative flex h-9 grow items-center bg-muted/30 transition-colors hover:bg-muted/50 focus:bg-muted/50 focus:outline-none focus-visible:outline-none\"\n                    style={{\n                      width: table.getTotalSize(),\n                      minWidth: table.getTotalSize()\n                    }}\n                    onClick={onRowAdd}\n                    onKeyDown={onFooterCellKeyDown}\n                  >\n                    <div className=\"sticky start-0 flex items-center gap-2 px-3 text-muted-foreground\">\n                      <Plus className=\"size-3.5\" />\n                      <span className=\"text-sm\">{msg.grid.addRow}</span>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            )}\n          </div>\n        </div>\n      </TooltipProvider>\n    </DataGridLocaleProvider>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/data-grid/data-grid.tsx"],"sourcesContent":["\"use client\";\n\nimport { Plus } from \"lucide-react\";\nimport * as React from \"react\";\nimport { TooltipProvider } from \"../components/ui/tooltip.js\";\nimport { cn } from \"../lib/cn.js\";\nimport { useAsRef } from \"../lib/use-as-ref.js\";\nimport { DataGridColumnHeader } from \"./data-grid-column-header.js\";\nimport { DataGridContextMenu } from \"./data-grid-context-menu.js\";\nimport { DataGridLocaleProvider, useResolvedDataGridMessages } from \"./data-grid-locale.js\";\nimport { DataGridPasteDialog } from \"./data-grid-paste-dialog.js\";\nimport { DataGridRow } from \"./data-grid-row.js\";\nimport { DataGridSearch } from \"./data-grid-search.js\";\nimport type { DataGridLocale, DataGridMessages } from \"./messages.js\";\nimport type { Direction } from \"./types.js\";\nimport type { useDataGrid } from \"./use-data-grid.js\";\nimport { flexRender, getColumnBorderVisibility, getColumnPinningStyle } from \"./utils.js\";\n\nconst EMPTY_CELL_SELECTION_SET = new Set<string>();\n\ninterface DataGridProps<TData>\n  extends Omit<ReturnType<typeof useDataGrid<TData>>, \"dir\" | \"locale\">,\n    Omit<React.ComponentProps<\"div\">, \"contextMenu\"> {\n  dir?: Direction;\n  /**\n   * Chiều cao tối đa của hộp cuộn: số = px, chuỗi = giá trị CSS bất kỳ\n   * (vd `\"100%\"`, `\"calc(100dvh - 220px)\"` khi muốn lưới lấp đầy phần còn lại của trang).\n   */\n  height?: number | string;\n  /** Kéo giãn các cột cho vừa bề ngang khi tổng bề rộng cột nhỏ hơn khung */\n  stretchColumns?: boolean;\n  /**\n   * Ngôn ngữ của lưới: `\"en\"` · `\"vi\"`, hoặc cả một bảng chuỗi tự soạn. Bỏ trống thì theo\n   * `DataGridLocaleProvider` bọc ngoài, rồi ngôn ngữ của `ComitorLocaleProvider`, rồi `\"en\"`.\n   *\n   * Thường nó đi theo kết quả của {@link useDataGrid} nên không phải truyền lại ở đây. Giá trị\n   * đặt thẳng lên `<DataGrid>` THẮNG giá trị từ hook — hữu ích khi một màn có hai lưới khác ngôn\n   * ngữ. Thanh công cụ nằm ngoài lưới nên nó KHÔNG nhận được giá trị này: chúng theo provider,\n   * hoặc nhận `locale` riêng từng menu.\n   */\n  locale?: DataGridLocale | DataGridMessages;\n}\n\n/**\n * Lưới dữ liệu sửa trực tiếp (như bảng tính): ảo hoá dòng, điều hướng bằng bàn phím,\n * chọn vùng ô, sao chép/cắt/dán, ghim cột, đổi rộng cột.\n *\n * Nhận nguyên kết quả của {@link useDataGrid}:\n * ```tsx\n * const { table, ...dataGridProps } = useDataGrid({ data, columns, onDataChange });\n * <DataGrid {...dataGridProps} table={table} aria-label=\"Danh sách bệnh nhân\" />\n * ```\n *\n * `aria-label` / `aria-labelledby` / `aria-describedby` được đặt lên đúng thẻ mang\n * `role=\"grid\"` (thẻ bọc ngoài chỉ là hộp bố cục, gắn nhãn lên đó trình đọc màn hình bỏ qua).\n */\nexport function DataGrid<TData>({\n  dataGridRef,\n  headerRef,\n  rowMapRef,\n  footerRef,\n  dir = \"ltr\",\n  table,\n  tableMeta,\n  virtualTotalSize,\n  virtualItems,\n  measureElement,\n  columns,\n  columnSizeVars,\n  searchState,\n  searchMatchesByRow,\n  activeSearchMatch,\n  cellSelectionMap,\n  focusedCell,\n  editingCell,\n  rowHeight,\n  contextMenu,\n  pasteDialog,\n  onRowAdd: onRowAddProp,\n  height = 600,\n  stretchColumns = false,\n  locale,\n  adjustLayout = false,\n  className,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledby,\n  \"aria-describedby\": ariaDescribedby,\n  ...props\n}: DataGridProps<TData>) {\n  const rows = table.getRowModel().rows;\n  const readOnly = tableMeta?.readOnly ?? false;\n  const columnVisibility = table.getState().columnVisibility;\n  const columnPinning = table.getState().columnPinning;\n\n  const onRowAddRef = useAsRef(onRowAddProp);\n\n  const onRowAdd = React.useCallback(\n    (event: React.MouseEvent<HTMLDivElement>) => {\n      onRowAddRef.current?.(event);\n    },\n    [onRowAddRef]\n  );\n\n  const onDataGridContextMenu = React.useCallback((event: React.MouseEvent<HTMLDivElement>) => {\n    event.preventDefault();\n  }, []);\n\n  const onFooterCellKeyDown = React.useCallback(\n    (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (!onRowAddRef.current) return;\n\n      if (event.key === \"Enter\" || event.key === \" \") {\n        event.preventDefault();\n        onRowAddRef.current();\n      }\n    },\n    [onRowAddRef]\n  );\n\n  // Prop → `DataGridLocaleProvider` bọc ngoài → `ComitorLocaleProvider` → `\"en\"`. Provider bên\n  // dưới giải lại với CÙNG đầu vào nên cây con thấy đúng bảng này (kèm locale ngày tương ứng).\n  const msg = useResolvedDataGridMessages(locale);\n\n  return (\n    <DataGridLocaleProvider locale={locale}>\n      <TooltipProvider delayDuration={200}>\n        <div data-slot=\"grid-wrapper\" dir={dir} {...props} className={cn(\"relative flex w-full flex-col\", className)}>\n          {searchState && <DataGridSearch {...searchState} />}\n          <DataGridContextMenu tableMeta={tableMeta} columns={columns} contextMenu={contextMenu} />\n          <DataGridPasteDialog tableMeta={tableMeta} pasteDialog={pasteDialog} />\n          <div\n            role=\"grid\"\n            aria-label={ariaLabelledby ? undefined : (ariaLabel ?? msg.grid.label)}\n            aria-labelledby={ariaLabelledby}\n            aria-describedby={ariaDescribedby}\n            aria-rowcount={rows.length + (onRowAddProp ? 1 : 0)}\n            aria-colcount={columns.length}\n            data-slot=\"grid\"\n            tabIndex={0}\n            ref={dataGridRef}\n            className=\"relative grid select-none overflow-auto rounded-lg border bg-card focus:outline-none focus-visible:outline-none\"\n            style={{\n              ...columnSizeVars,\n              maxHeight: typeof height === \"number\" ? `${height}px` : height\n            }}\n            onContextMenu={onDataGridContextMenu}\n          >\n            <div\n              role=\"rowgroup\"\n              data-slot=\"grid-header\"\n              ref={headerRef}\n              className=\"sticky top-0 z-10 grid border-b bg-card\"\n            >\n              {table.getHeaderGroups().map((headerGroup, rowIndex) => (\n                <div\n                  key={headerGroup.id}\n                  role=\"row\"\n                  aria-rowindex={rowIndex + 1}\n                  data-slot=\"grid-header-row\"\n                  tabIndex={-1}\n                  className=\"flex w-full\"\n                >\n                  {headerGroup.headers.map((header, colIndex) => {\n                    const sorting = table.getState().sorting;\n                    const currentSort = sorting.find((sort) => sort.id === header.column.id);\n                    const isSortable = header.column.getCanSort();\n\n                    const nextHeader = headerGroup.headers[colIndex + 1];\n                    const isLastColumn = colIndex === headerGroup.headers.length - 1;\n\n                    const { showEndBorder, showStartBorder } = getColumnBorderVisibility({\n                      column: header.column,\n                      nextColumn: nextHeader?.column,\n                      isLastColumn\n                    });\n\n                    return (\n                      <div\n                        key={header.id}\n                        role=\"columnheader\"\n                        aria-colindex={colIndex + 1}\n                        aria-sort={\n                          currentSort?.desc === false\n                            ? \"ascending\"\n                            : currentSort?.desc === true\n                              ? \"descending\"\n                              : isSortable\n                                ? \"none\"\n                                : undefined\n                        }\n                        data-slot=\"grid-header-cell\"\n                        tabIndex={-1}\n                        className={cn(\"relative\", {\n                          grow: stretchColumns && header.column.id !== \"select\",\n                          \"border-e\": showEndBorder && header.column.id !== \"select\",\n                          \"border-s\": showStartBorder && header.column.id !== \"select\"\n                        })}\n                        style={{\n                          ...getColumnPinningStyle({ column: header.column, dir }),\n                          width: `calc(var(--header-${header.id}-size) * 1px)`\n                        }}\n                      >\n                        {header.isPlaceholder ? null : typeof header.column.columnDef.header === \"function\" ? (\n                          <div className=\"size-full px-3 py-1.5\">\n                            {flexRender(header.column.columnDef.header, header.getContext())}\n                          </div>\n                        ) : (\n                          <DataGridColumnHeader header={header} table={table} />\n                        )}\n                      </div>\n                    );\n                  })}\n                </div>\n              ))}\n            </div>\n            <div\n              role=\"rowgroup\"\n              data-slot=\"grid-body\"\n              className=\"relative grid\"\n              style={{\n                height: `${virtualTotalSize}px`,\n                contain: adjustLayout ? \"layout paint\" : \"strict\"\n              }}\n            >\n              {virtualItems.map((virtualItem) => {\n                const row = rows[virtualItem.index];\n                if (!row) return null;\n\n                const cellSelectionKeys = cellSelectionMap?.get(virtualItem.index) ?? EMPTY_CELL_SELECTION_SET;\n\n                const searchMatchColumns = searchMatchesByRow?.get(virtualItem.index) ?? null;\n                const isActiveSearchRow = activeSearchMatch?.rowIndex === virtualItem.index;\n\n                return (\n                  <DataGridRow\n                    key={row.id}\n                    row={row}\n                    tableMeta={tableMeta}\n                    rowMapRef={rowMapRef}\n                    virtualItem={virtualItem}\n                    measureElement={measureElement}\n                    rowHeight={rowHeight}\n                    columnVisibility={columnVisibility}\n                    columnPinning={columnPinning}\n                    focusedCell={focusedCell}\n                    editingCell={editingCell}\n                    cellSelectionKeys={cellSelectionKeys}\n                    searchMatchColumns={searchMatchColumns}\n                    activeSearchMatch={isActiveSearchRow ? activeSearchMatch : null}\n                    dir={dir}\n                    adjustLayout={adjustLayout}\n                    stretchColumns={stretchColumns}\n                    readOnly={readOnly}\n                  />\n                );\n              })}\n            </div>\n            {/* Chỉ hiện dòng \"Thêm dòng\" khi ứng dụng thật sự truyền onRowAdd\n            (biến `onRowAdd` bên dưới là callback bọc, luôn khác undefined). */}\n            {!readOnly && onRowAddProp && (\n              <div\n                role=\"rowgroup\"\n                data-slot=\"grid-footer\"\n                ref={footerRef}\n                className=\"sticky bottom-0 z-10 grid border-t bg-card\"\n              >\n                <div\n                  role=\"row\"\n                  aria-rowindex={rows.length + 2}\n                  data-slot=\"grid-add-row\"\n                  tabIndex={-1}\n                  className=\"flex w-full\"\n                >\n                  <div\n                    role=\"gridcell\"\n                    tabIndex={0}\n                    className=\"relative flex h-9 grow items-center bg-muted/30 transition-colors hover:bg-muted/50 focus:bg-muted/50 focus:outline-none focus-visible:outline-none\"\n                    style={{\n                      width: table.getTotalSize(),\n                      minWidth: table.getTotalSize()\n                    }}\n                    onClick={onRowAdd}\n                    onKeyDown={onFooterCellKeyDown}\n                  >\n                    <div className=\"sticky start-0 flex items-center gap-2 px-3 text-muted-foreground\">\n                      <Plus className=\"size-3.5\" />\n                      <span className=\"text-sm\">{msg.grid.addRow}</span>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            )}\n          </div>\n        </div>\n      </TooltipProvider>\n    </DataGridLocaleProvider>\n  );\n}\n"],"mappings":"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","names":[]}

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

@@ -20,6 +20,7 @@ import 'react';
 import '@tanstack/react-table';
 import '../components/ui/popover.js';
 import '@radix-ui/react-popover';
+import 'date-fns';
 import '../components/ui/select.js';
 import '@radix-ui/react-select';
 import '@tanstack/react-virtual';

package/dist/data-grid/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/data-grid/index.ts"],"sourcesContent":["// @comitor/ui/data-grid — lưới dữ liệu sửa trực tiếp (như bảng tính).\n//\n// Port từ tablecn (https://tablecn.com) — MIT License, Copyright (c) 2024 Sadman Sakib —\n// và chỉnh lại để dùng primitive/token của package, chuỗi tiếng Việt, không phụ thuộc backend.\n// Xem docs/data-grid.md (§10) để biết danh sách khác biệt so với bản gốc.\n//\n// Tách khỏi barrel chính vì kéo theo @tanstack/react-table (peer), @tanstack/react-virtual và @dnd-kit,\n// đồng thời khoanh vùng phần `declare module \"@tanstack/react-table\"` (thêm `meta.cell`, `TableMeta`)\n// để ứng dụng không dùng lưới không bị ảnh hưởng.\n\n// Components\nexport { DataGrid } from \"./data-grid.js\";\nexport { DataGridFilterMenu } from \"./data-grid-filter-menu.js\";\nexport { DataGridKeyboardShortcuts } from \"./data-grid-keyboard-shortcuts.js\";\n// Ngôn ngữ\nexport {\n  DataGridLocaleProvider,\n  type DataGridLocaleProviderProps,\n  useDataGridMessages\n} from \"./data-grid-locale.js\";\nexport {\n  type DataGridCellPresence,\n  DataGridPresenceProvider,\n  useDataGridPresence\n} from \"./data-grid-presence.js\";\nexport { DataGridRowHeightMenu } from \"./data-grid-row-height-menu.js\";\nexport { getDataGridSelectColumn } from \"./data-grid-select-column.js\";\nexport { DataGridSkeleton, DataGridSkeletonGrid, DataGridSkeletonToolbar } from \"./data-grid-skeleton.js\";\nexport { DataGridSortMenu } from \"./data-grid-sort-menu.js\";\nexport { DataGridViewMenu } from \"./data-grid-view-menu.js\";\n// Bộ lọc\nexport {\n  BOOLEAN_FILTER_OPERATORS,\n  DATE_FILTER_OPERATORS,\n  getDefaultOperator,\n  getFilterFn,\n  getOperatorsForVariant,\n  NUMBER_FILTER_OPERATORS,\n  SELECT_FILTER_OPERATORS,\n  TEXT_FILTER_OPERATORS\n} from \"./filters.js\";\n/*\n * Chuỗi hiển thị. `dataGridMessages` là bảng ĐANG MẶC ĐỊNH (tiếng Anh từ `2.0.0`) — dùng khi app\n * muốn từ ngữ ở chỗ khác trên màn khớp với lưới. Muốn một ngôn ngữ cụ thể thì gọi\n * `getDataGridMessages(\"vi\")`, đừng đọc hằng rồi đoán.\n */\nexport {\n  DATA_GRID_MESSAGES,\n  type DataGridLocale,\n  type DataGridMessages,\n  DEFAULT_DATA_GRID_LOCALE,\n  getDataGridMessages,\n  messagesEn as dataGridMessages,\n  messagesEn as dataGridMessagesEn,\n  messagesVi as dataGridMessagesVi\n} from \"./messages.js\";\n// Types\nexport type * from \"./types.js\";\n// Hooks\nexport { type UseDataGridProps, useDataGrid } from \"./use-data-grid.js\";\nexport { type UndoRedoCellUpdate, useDataGridUndoRedo } from \"./use-data-grid-undo-redo.js\";\n// Tiện ích hay dùng ở phía ứng dụng\nexport {\n  formatDate,\n  formatDateForDisplay,\n  formatDateToString,\n  formatFileSize,\n  generateFileId,\n  getCellKey,\n  getColumnVariant,\n  getEmptyCellValue,\n  getLineCount,\n  getRowHeightValue,\n  parseCellKey,\n  parseLocalDate\n} from \"./utils.js\";\n"],"mappings":"AAWA,SAAS,gBAAgB;AACzB,SAAS,0BAA0B;AACnC,SAAS,iCAAiC;AAE1C;AAAA,EACE;AAAA,EAEA;AAAA,OACK;AACP;AAAA,EAEE;AAAA,EACA;AAAA,OACK;AACP,SAAS,6BAA6B;AACtC,SAAS,+BAA+B;AACxC,SAAS,kBAAkB,sBAAsB,+BAA+B;AAChF,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AAEjC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAMP;AAAA,EACE;AAAA,EAGA;AAAA,EACA;AAAA,EACc;AAAA,EACA,cAAdA;AAAA,EACc;AAAA,OACT;AAIP,SAAgC,mBAAmB;AACnD,SAAkC,2BAA2B;AAE7D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;","names":["messagesEn"]}
+{"version":3,"sources":["../../src/data-grid/index.ts"],"sourcesContent":["// @comitor/ui/data-grid — lưới dữ liệu sửa trực tiếp (như bảng tính).\n//\n// Port từ tablecn (https://tablecn.com) — MIT License, Copyright (c) 2024 Sadman Sakib —\n// và chỉnh lại để dùng primitive/token của package, hai bảng chuỗi (en/vi, theo ngôn ngữ của\n// `ComitorLocaleProvider`), không phụ thuộc backend.\n// Xem docs/data-grid.md (§10) để biết danh sách khác biệt so với bản gốc.\n//\n// Tách khỏi barrel chính vì kéo theo @tanstack/react-table (peer), @tanstack/react-virtual và @dnd-kit,\n// đồng thời khoanh vùng phần `declare module \"@tanstack/react-table\"` (thêm `meta.cell`, `TableMeta`)\n// để ứng dụng không dùng lưới không bị ảnh hưởng.\n\n// Components\nexport { DataGrid } from \"./data-grid.js\";\nexport { DataGridFilterMenu } from \"./data-grid-filter-menu.js\";\nexport { DataGridKeyboardShortcuts } from \"./data-grid-keyboard-shortcuts.js\";\n// Ngôn ngữ\nexport {\n  DataGridLocaleProvider,\n  type DataGridLocaleProviderProps,\n  useDataGridMessages\n} from \"./data-grid-locale.js\";\nexport {\n  type DataGridCellPresence,\n  DataGridPresenceProvider,\n  useDataGridPresence\n} from \"./data-grid-presence.js\";\nexport { DataGridRowHeightMenu } from \"./data-grid-row-height-menu.js\";\nexport { getDataGridSelectColumn } from \"./data-grid-select-column.js\";\nexport { DataGridSkeleton, DataGridSkeletonGrid, DataGridSkeletonToolbar } from \"./data-grid-skeleton.js\";\nexport { DataGridSortMenu } from \"./data-grid-sort-menu.js\";\nexport { DataGridViewMenu } from \"./data-grid-view-menu.js\";\n// Bộ lọc\nexport {\n  BOOLEAN_FILTER_OPERATORS,\n  DATE_FILTER_OPERATORS,\n  getDefaultOperator,\n  getFilterFn,\n  getOperatorsForVariant,\n  NUMBER_FILTER_OPERATORS,\n  SELECT_FILTER_OPERATORS,\n  TEXT_FILTER_OPERATORS\n} from \"./filters.js\";\n/*\n * Chuỗi hiển thị. `dataGridMessages` là bảng ĐANG MẶC ĐỊNH (tiếng Anh từ `2.0.0`) — dùng khi app\n * muốn từ ngữ ở chỗ khác trên màn khớp với lưới. Muốn một ngôn ngữ cụ thể thì gọi\n * `getDataGridMessages(\"vi\")`, đừng đọc hằng rồi đoán.\n */\nexport {\n  DATA_GRID_MESSAGES,\n  type DataGridLocale,\n  type DataGridMessages,\n  DEFAULT_DATA_GRID_LOCALE,\n  getDataGridMessages,\n  messagesEn as dataGridMessages,\n  messagesEn as dataGridMessagesEn,\n  messagesVi as dataGridMessagesVi\n} from \"./messages.js\";\n// Types\nexport type * from \"./types.js\";\n// Hooks\nexport { type UseDataGridProps, useDataGrid } from \"./use-data-grid.js\";\nexport { type UndoRedoCellUpdate, useDataGridUndoRedo } from \"./use-data-grid-undo-redo.js\";\n// Tiện ích hay dùng ở phía ứng dụng\nexport {\n  formatDate,\n  formatDateForDisplay,\n  formatDateToString,\n  formatFileSize,\n  generateFileId,\n  getCellKey,\n  getColumnVariant,\n  getEmptyCellValue,\n  getLineCount,\n  getRowHeightValue,\n  parseCellKey,\n  parseLocalDate\n} from \"./utils.js\";\n"],"mappings":"AAYA,SAAS,gBAAgB;AACzB,SAAS,0BAA0B;AACnC,SAAS,iCAAiC;AAE1C;AAAA,EACE;AAAA,EAEA;AAAA,OACK;AACP;AAAA,EAEE;AAAA,EACA;AAAA,OACK;AACP,SAAS,6BAA6B;AACtC,SAAS,+BAA+B;AACxC,SAAS,kBAAkB,sBAAsB,+BAA+B;AAChF,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AAEjC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAMP;AAAA,EACE;AAAA,EAGA;AAAA,EACA;AAAA,EACc;AAAA,EACA,cAAdA;AAAA,EACc;AAAA,OACT;AAIP,SAAgC,mBAAmB;AACnD,SAAkC,2BAA2B;AAE7D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;","names":["messagesEn"]}

package/dist/data-grid/messages-en.d.ts

@@ -7,10 +7,12 @@
  * (`"Add row"` chứ không phải `string`), và bảng tiếng Việt vĩnh viễn không bao giờ gán được vào
  * `DataGridMessages`. Kiểu rộng mới là thứ dùng được ở đây.
  *
- * ─ VÌ SAO TIẾNG ANH LÀ BẢN GỐC, TRONG KHI CẢ GÓI MẶC ĐỊNH TIẾNG VIỆT ─
- * Đây là NGOẠI LỆ CÓ CHỦ Ý của `DataGrid`, quyết định ở `2.0.0` (xem CHANGELOG). Phần lớn chuỗi
- * ở đây là chuỗi gốc của tablecn — repo mà lưới được port từ đó — nên giữ tiếng Anh làm bản gốc
- * thì mỗi lần đối chiếu ngược với thượng nguồn là so trực tiếp, không phải dịch hai lượt.
+ * ─ VÌ SAO TIẾNG ANH LÀ BẢN GỐC ─
+ * `DataGrid` mặc định tiếng Anh từ `2.0.0` — trước cả gói (cả gói theo từ `3.0.0`). Phần lớn
+ * chuỗi ở đây là chuỗi gốc của tablecn — repo mà lưới được port từ đó — nên giữ tiếng Anh làm bản
+ * gốc thì mỗi lần đối chiếu ngược với thượng nguồn là so trực tiếp, không phải dịch hai lượt.
+ * Lưới giữ bảng RIÊNG thay vì một namespace trong `src/i18n/`, nhưng ngôn ngữ thì đi theo
+ * `ComitorLocaleProvider` như mọi component khác (xem `data-grid-locale.tsx`).
  *
  * Quy ước: chuỗi cố định để nguyên; chuỗi có tham số viết thành HÀM (đừng nối chuỗi ở chỗ gọi —
  * trật tự từ của tiếng Việt và tiếng Anh khác nhau). KHÔNG đặt JSX ở đây.
@@ -204,6 +206,23 @@ declare const messagesEn: {
         checked: string;
         unchecked: string;
     };
+    /**
+     * Lời đọc cho trình đọc màn hình khi kéo-thả để đổi thứ tự điều kiện trong menu Lọc / Sắp xếp
+     * (`sortable.tsx`, qua `accessibility` của dnd-kit). `item` là id của mục đang kéo; `position`
+     * đếm từ 1.
+     */
+    sortable: {
+        /** Hướng dẫn gắn vào mục kéo được; `orientation` quyết định cặp phím mũi tên được nhắc tới. */
+        instructions: (orientation: "vertical" | "horizontal" | "mixed") => string;
+        dragStart: (item: string, position: number, total: number) => string;
+        dragOver: (item: string, direction: "up" | "down", position: number, total: number) => string;
+        dragMove: (item: string, direction: "up" | "down", position: number, total: number) => string;
+        /** Mục đang kéo đã ra ngoài vùng thả (dùng cho cả `onDragOver` lẫn `onDragMove`). */
+        outside: string;
+        dragEnd: (item: string, position: number, total: number) => string;
+        dragEndNoChange: (item: string) => string;
+        dragCancel: (item: string, position: number, total: number) => string;
+    };
     shortcuts: {
         trigger: string;
         title: string;

package/dist/data-grid/messages-en.js

@@ -192,6 +192,26 @@ const messagesEn = {
     checked: "Yes",
     unchecked: "No"
   },
+  /**
+   * Lời đọc cho trình đọc màn hình khi kéo-thả để đổi thứ tự điều kiện trong menu Lọc / Sắp xếp
+   * (`sortable.tsx`, qua `accessibility` của dnd-kit). `item` là id của mục đang kéo; `position`
+   * đếm từ 1.
+   */
+  sortable: {
+    /** Hướng dẫn gắn vào mục kéo được; `orientation` quyết định cặp phím mũi tên được nhắc tới. */
+    instructions: (orientation) => {
+      const keys = orientation === "vertical" ? "up and down" : orientation === "horizontal" ? "left and right" : "arrow";
+      return `To pick up a sortable item, press space or enter. While dragging, use the ${keys} keys to move the item. Press space or enter again to drop the item in its new position, or press escape to cancel.`;
+    },
+    dragStart: (item, position, total) => `Picked up sortable item "${item}". Current position is ${position} of ${total}. Use arrow keys to move, space to drop.`,
+    dragOver: (item, direction, position, total) => `Sortable item "${item}" moved ${direction} to position ${position} of ${total}.`,
+    dragMove: (item, direction, position, total) => `Sortable item "${item}" is moving ${direction} to position ${position} of ${total}.`,
+    /** Mục đang kéo đã ra ngoài vùng thả (dùng cho cả `onDragOver` lẫn `onDragMove`). */
+    outside: "Sortable item is no longer over a droppable area. Press escape to cancel.",
+    dragEnd: (item, position, total) => `Sortable item "${item}" dropped at position ${position} of ${total}.`,
+    dragEndNoChange: (item) => `Sortable item "${item}" dropped. No changes were made.`,
+    dragCancel: (item, position, total) => `Sorting cancelled. Sortable item "${item}" returned to position ${position} of ${total}.`
+  },
   shortcuts: {
     trigger: "Keyboard shortcuts",
     title: "Keyboard shortcuts",

package/dist/data-grid/messages-en.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/data-grid/messages-en.ts"],"sourcesContent":["/**\n * Chuỗi hiển thị tiếng ANH của DataGrid — và là BẢN GỐC định nghĩa hình dạng của\n * {@link DataGridMessages}. Mọi bảng ngôn ngữ khác phải khớp đúng bộ khoá này; thiếu một khoá là\n * typecheck đỏ ngay, không phải một chuỗi rỗng lặng lẽ xuất hiện trên giao diện.\n *\n * ⚠ **KHÔNG `as const`.** Có `as const` thì mỗi chuỗi thành một literal type riêng\n * (`\"Add row\"` chứ không phải `string`), và bảng tiếng Việt vĩnh viễn không bao giờ gán được vào\n * `DataGridMessages`. Kiểu rộng mới là thứ dùng được ở đây.\n *\n * ─ VÌ SAO TIẾNG ANH LÀ BẢN GỐC, TRONG KHI CẢ GÓI MẶC ĐỊNH TIẾNG VIỆT ─\n * Đây là NGOẠI LỆ CÓ CHỦ Ý của `DataGrid`, quyết định ở `2.0.0` (xem CHANGELOG). Phần lớn chuỗi\n * ở đây là chuỗi gốc của tablecn — repo mà lưới được port từ đó — nên giữ tiếng Anh làm bản gốc\n * thì mỗi lần đối chiếu ngược với thượng nguồn là so trực tiếp, không phải dịch hai lượt.\n *\n * Quy ước: chuỗi cố định để nguyên; chuỗi có tham số viết thành HÀM (đừng nối chuỗi ở chỗ gọi —\n * trật tự từ của tiếng Việt và tiếng Anh khác nhau). KHÔNG đặt JSX ở đây.\n */\nexport const messagesEn = {\n  grid: {\n    /** Nhãn mặc định của vùng `role=\"grid\"` (ghi đè bằng prop `aria-label`) */\n    label: \"Data grid\",\n    addRow: \"Add row\"\n  },\n\n  search: {\n    placeholder: \"Find in table...\",\n    label: \"Find in table\",\n    prevMatch: \"Previous match\",\n    nextMatch: \"Next match\",\n    close: \"Close search\",\n    matchPosition: (index: number, total: number) => `${index} / ${total}`,\n    noResults: \"No results\",\n    typeToSearch: \"Type to search\"\n  },\n\n  column: {\n    sortAsc: \"Sort asc\",\n    sortDesc: \"Sort desc\",\n    removeSort: \"Remove sort\",\n    pinLeft: \"Pin to left\",\n    unpinLeft: \"Unpin from left\",\n    pinRight: \"Pin to right\",\n    unpinRight: \"Unpin from right\",\n    hide: \"Hide column\",\n    resize: (label: string) => `Resize ${label} column`,\n    /** Tên kiểu dữ liệu của cột, hiện trong tooltip ở tiêu đề cột */\n    variant: {\n      shortText: \"Short text\",\n      longText: \"Long text\",\n      number: \"Number\",\n      url: \"URL\",\n      checkbox: \"Checkbox\",\n      select: \"Select\",\n      multiSelect: \"Multi-select\",\n      date: \"Date\",\n      file: \"File\"\n    }\n  },\n\n  select: {\n    all: \"Select all\",\n    row: \"Select row\",\n    rowNumber: (rowNumber: number) => `Select row ${rowNumber}`\n  },\n\n  contextMenu: {\n    copy: \"Copy\",\n    cut: \"Cut\",\n    clear: \"Clear\",\n    deleteRows: \"Delete rows\"\n  },\n\n  pasteDialog: {\n    title: \"Do you want to add more rows?\",\n    description: (rowsNeeded: number) =>\n      `We need ${rowsNeeded} additional ${rowsNeeded === 1 ? \"row\" : \"rows\"} to paste everything from your clipboard.`,\n    expandTitle: \"Create new rows\",\n    expandDescription: (rowsNeeded: number) =>\n      `Add ${rowsNeeded} new ${rowsNeeded === 1 ? \"row\" : \"rows\"} to the table and paste all data`,\n    keepTitle: \"Keep current rows\",\n    keepDescription: \"Paste only what fits in the existing rows\",\n    cancel: \"Cancel\",\n    confirm: \"Continue\"\n  },\n\n  rowHeight: {\n    label: \"Row height\",\n    short: \"Short\",\n    medium: \"Medium\",\n    tall: \"Tall\",\n    extraTall: \"Extra tall\"\n  },\n\n  view: {\n    trigger: \"View\",\n    toggleColumns: \"Toggle columns\",\n    searchPlaceholder: \"Search columns...\",\n    empty: \"No columns found.\"\n  },\n\n  sort: {\n    trigger: \"Sort\",\n    title: \"Sort by\",\n    emptyTitle: \"No sorting applied\",\n    description: \"Modify sorting to organize your rows.\",\n    emptyDescription: \"Add sorting to organize your rows.\",\n    add: \"Add sort\",\n    reset: \"Reset sorting\",\n    remove: \"Remove sort\",\n    drag: \"Drag to reorder\",\n    fieldPlaceholder: \"Search fields...\",\n    fieldEmpty: \"No fields found.\",\n    asc: \"Asc\",\n    desc: \"Desc\"\n  },\n\n  filter: {\n    trigger: \"Filter\",\n    title: \"Filter by\",\n    emptyTitle: \"No filters applied\",\n    description: \"Modify filters to narrow down your data.\",\n    emptyDescription: \"Add filters to narrow down your data.\",\n    add: \"Add filter\",\n    reset: \"Reset filters\",\n    remove: \"Remove filter\",\n    drag: \"Drag to reorder\",\n    where: \"Where\",\n    and: \"And\",\n    fieldPlaceholder: \"Search fields...\",\n    fieldEmpty: \"No fields found.\",\n    valuePlaceholder: \"Value\",\n    rangeStart: \"From\",\n    rangeEnd: \"To\",\n    pickDate: \"Pick a date\",\n    pickRange: \"Pick a range\",\n    optionPlaceholder: \"Search options...\",\n    optionEmpty: \"No options found.\",\n    selectedCount: (count: number) => `${count} selected`,\n    emptyValue: (label: string) => `${label} filter is empty`,\n    /** Nhãn toán tử lọc — xem `filters.ts` để biết toán tử nào dùng cho kiểu ô nào */\n    operators: {\n      contains: \"Contains\",\n      notContains: \"Does not contain\",\n      equals: \"Is\",\n      notEquals: \"Is not\",\n      startsWith: \"Starts with\",\n      endsWith: \"Ends with\",\n      isEmpty: \"Is empty\",\n      isNotEmpty: \"Is not empty\",\n      lessThan: \"Is less than\",\n      lessThanOrEqual: \"Is less than or equal to\",\n      greaterThan: \"Is greater than\",\n      greaterThanOrEqual: \"Is greater than or equal to\",\n      isBetween: \"Is between\",\n      dateEquals: \"Is\",\n      dateNotEquals: \"Is not\",\n      before: \"Is before\",\n      after: \"Is after\",\n      onOrBefore: \"Is on or before\",\n      onOrAfter: \"Is on or after\",\n      is: \"Is\",\n      isNot: \"Is not\",\n      isAnyOf: \"Has any of\",\n      isNoneOf: \"Has none of\",\n      isTrue: \"Is checked\",\n      isFalse: \"Is not checked\"\n    }\n  },\n\n  cell: {\n    longTextPlaceholder: \"Enter text...\",\n    optionSearchPlaceholder: \"Search...\",\n    optionEmpty: \"No options found.\",\n    clearAll: \"Clear all\",\n    invalidUrlTitle: \"Invalid URL\",\n    invalidUrlDescription: \"URL contains a dangerous protocol (javascript:, data:, vbscript:, or file:)\"\n  },\n\n  file: {\n    uploadLabel: \"Upload\",\n    dropHere: \"Drop files here\",\n    dragHere: \"Drag files here\",\n    browse: \"or click to browse\",\n    limits: (maxSize?: string, maxFiles?: number) => {\n      if (maxSize && maxFiles) return `Max size: ${maxSize} • Max ${maxFiles} files`;\n      if (maxSize) return `Max size: ${maxSize}`;\n      if (maxFiles) return `Max ${maxFiles} files`;\n      return \"Select files to upload\";\n    },\n    count: (count: number) => `${count} ${count === 1 ? \"file\" : \"files\"}`,\n    clearAll: \"Clear all\",\n    remove: \"Remove file\",\n    uploading: \"Uploading...\",\n    deleting: \"Deleting...\",\n    tooMany: (maxFiles: number) => `Only ${maxFiles} ${maxFiles === 1 ? \"file\" : \"files\"} allowed`,\n    tooLarge: (maxSize: string) => `File size exceeds ${maxSize}`,\n    wrongType: \"File type not accepted\",\n    rejectedOne: (name: string) => `\"${name}\" has been rejected`,\n    rejectedMany: (name: string, others: number) => `\"${name}\" and ${others} more rejected`,\n    uploadFailed: (count: number) => `Failed to upload ${count} ${count === 1 ? \"file\" : \"files\"}`,\n    deleteFailed: (name: string) => `Failed to delete ${name}`,\n    deleteFailedMany: \"Failed to delete files\"\n  },\n\n  toast: {\n    cellsCopied: (count: number) => `${count} ${count === 1 ? \"cell\" : \"cells\"} copied`,\n    copyFailed: \"Failed to copy to clipboard\",\n    cellsCut: (count: number) => `${count} ${count === 1 ? \"cell\" : \"cells\"} cut`,\n    cutFailed: \"Failed to cut to clipboard\",\n    cellsPasted: (count: number) => `${count} ${count === 1 ? \"cell\" : \"cells\"} pasted`,\n    cellsPastedWithSkipped: (count: number, skipped: number) =>\n      `${count} ${count === 1 ? \"cell\" : \"cells\"} pasted, ${skipped} skipped`,\n    pasteSkipped: (skipped: number) =>\n      `${skipped} ${skipped === 1 ? \"cell\" : \"cells\"} skipped pasting for invalid data`,\n    pasteFailed: \"Failed to paste. Please try again.\",\n    cellsCleared: (count: number) => `${count} ${count === 1 ? \"cell\" : \"cells\"} cleared`,\n    rowsDeleted: (count: number) => `${count} ${count === 1 ? \"row\" : \"rows\"} deleted`,\n    nothingToUndo: \"Nothing left to undo\",\n    nothingToRedo: \"Nothing left to redo\",\n    undone: (count: number) => `${count} ${count === 1 ? \"action\" : \"actions\"} undone`,\n    redone: (count: number) => `${count} ${count === 1 ? \"action\" : \"actions\"} redone`\n  },\n\n  /** Giá trị văn bản khi dán boolean vào ô văn bản */\n  booleanText: {\n    checked: \"Yes\",\n    unchecked: \"No\"\n  },\n\n  shortcuts: {\n    trigger: \"Keyboard shortcuts\",\n    title: \"Keyboard shortcuts\",\n    description: \"Every shortcut for working through the grid without the mouse.\",\n    searchPlaceholder: \"Search shortcuts...\",\n    emptyTitle: \"No shortcuts found\",\n    emptyDescription: \"Try a different search term.\",\n    close: \"Close\",\n    groups: {\n      navigation: \"Navigation\",\n      selection: \"Selection\",\n      editing: \"Editing\",\n      search: \"Search\",\n      filtering: \"Filtering\",\n      sorting: \"Sorting\",\n      general: \"General\"\n    },\n    keys: {\n      click: \"Click\",\n      doubleClick: \"Double click\"\n    },\n    navigation: {\n      move: \"Navigate between cells\",\n      nextCell: \"Move to next cell\",\n      prevCell: \"Move to previous cell\",\n      firstColumn: \"Move to first column\",\n      lastColumn: \"Move to last column\",\n      firstRowSameColumn: \"Move to first row (same column)\",\n      lastRowSameColumn: \"Move to last row (same column)\",\n      firstColumnSameRow: \"Move to first column (same row)\",\n      lastColumnSameRow: \"Move to last column (same row)\",\n      firstCell: \"Move to first cell\",\n      lastCell: \"Move to last cell\",\n      pageUp: \"Move up one page\",\n      pageDown: \"Move down one page\",\n      scrollUp: \"Scroll up one page\",\n      scrollDown: \"Scroll down one page\",\n      scrollLeft: \"Scroll left one page of columns\",\n      scrollRight: \"Scroll right one page of columns\"\n    },\n    selection: {\n      extend: \"Extend selection\",\n      toTop: \"Select to top of table\",\n      toBottom: \"Select to bottom of table\",\n      toFirstColumn: \"Select to first column\",\n      toLastColumn: \"Select to last column\",\n      all: \"Select all cells\",\n      toggle: \"Toggle cell selection\",\n      range: \"Select range\",\n      clear: \"Clear selection\"\n    },\n    editing: {\n      start: \"Start editing cell\",\n      insertRow: \"Insert row below\",\n      copy: \"Copy selected cells\",\n      cut: \"Cut selected cells\",\n      paste: \"Paste cells\",\n      clear: \"Clear selected cells\",\n      deleteRows: \"Delete selected rows\",\n      undo: \"Undo last action\",\n      redo: \"Redo last action\"\n    },\n    search: {\n      open: \"Open search\",\n      next: \"Next match\",\n      prev: \"Previous match\",\n      close: \"Close search\"\n    },\n    filtering: {\n      toggle: \"Toggle the filter menu\",\n      remove: \"Remove filter (when focused)\"\n    },\n    sorting: {\n      toggle: \"Toggle the sort menu\",\n      remove: \"Remove sort (when focused)\"\n    },\n    general: {\n      shortcuts: \"Show keyboard shortcuts\"\n    }\n  }\n};\n\n/**\n * Hình dạng của một bảng ngôn ngữ. Suy ra từ bảng tiếng Anh nên không có chỗ nào để hai thứ\n * lệch nhau: thêm một khoá vào `messagesEn` là mọi bảng khác đỏ cho tới khi dịch xong.\n */\nexport type DataGridMessages = typeof messagesEn;\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/data-grid/messages-en.ts"],"sourcesContent":["/**\n * Chuỗi hiển thị tiếng ANH của DataGrid — và là BẢN GỐC định nghĩa hình dạng của\n * {@link DataGridMessages}. Mọi bảng ngôn ngữ khác phải khớp đúng bộ khoá này; thiếu một khoá là\n * typecheck đỏ ngay, không phải một chuỗi rỗng lặng lẽ xuất hiện trên giao diện.\n *\n * ⚠ **KHÔNG `as const`.** Có `as const` thì mỗi chuỗi thành một literal type riêng\n * (`\"Add row\"` chứ không phải `string`), và bảng tiếng Việt vĩnh viễn không bao giờ gán được vào\n * `DataGridMessages`. Kiểu rộng mới là thứ dùng được ở đây.\n *\n * ─ VÌ SAO TIẾNG ANH LÀ BẢN GỐC ─\n * `DataGrid` mặc định tiếng Anh từ `2.0.0` — trước cả gói (cả gói theo từ `3.0.0`). Phần lớn\n * chuỗi ở đây là chuỗi gốc của tablecn — repo mà lưới được port từ đó — nên giữ tiếng Anh làm bản\n * gốc thì mỗi lần đối chiếu ngược với thượng nguồn là so trực tiếp, không phải dịch hai lượt.\n * Lưới giữ bảng RIÊNG thay vì một namespace trong `src/i18n/`, nhưng ngôn ngữ thì đi theo\n * `ComitorLocaleProvider` như mọi component khác (xem `data-grid-locale.tsx`).\n *\n * Quy ước: chuỗi cố định để nguyên; chuỗi có tham số viết thành HÀM (đừng nối chuỗi ở chỗ gọi —\n * trật tự từ của tiếng Việt và tiếng Anh khác nhau). KHÔNG đặt JSX ở đây.\n */\nexport const messagesEn = {\n  grid: {\n    /** Nhãn mặc định của vùng `role=\"grid\"` (ghi đè bằng prop `aria-label`) */\n    label: \"Data grid\",\n    addRow: \"Add row\"\n  },\n\n  search: {\n    placeholder: \"Find in table...\",\n    label: \"Find in table\",\n    prevMatch: \"Previous match\",\n    nextMatch: \"Next match\",\n    close: \"Close search\",\n    matchPosition: (index: number, total: number) => `${index} / ${total}`,\n    noResults: \"No results\",\n    typeToSearch: \"Type to search\"\n  },\n\n  column: {\n    sortAsc: \"Sort asc\",\n    sortDesc: \"Sort desc\",\n    removeSort: \"Remove sort\",\n    pinLeft: \"Pin to left\",\n    unpinLeft: \"Unpin from left\",\n    pinRight: \"Pin to right\",\n    unpinRight: \"Unpin from right\",\n    hide: \"Hide column\",\n    resize: (label: string) => `Resize ${label} column`,\n    /** Tên kiểu dữ liệu của cột, hiện trong tooltip ở tiêu đề cột */\n    variant: {\n      shortText: \"Short text\",\n      longText: \"Long text\",\n      number: \"Number\",\n      url: \"URL\",\n      checkbox: \"Checkbox\",\n      select: \"Select\",\n      multiSelect: \"Multi-select\",\n      date: \"Date\",\n      file: \"File\"\n    }\n  },\n\n  select: {\n    all: \"Select all\",\n    row: \"Select row\",\n    rowNumber: (rowNumber: number) => `Select row ${rowNumber}`\n  },\n\n  contextMenu: {\n    copy: \"Copy\",\n    cut: \"Cut\",\n    clear: \"Clear\",\n    deleteRows: \"Delete rows\"\n  },\n\n  pasteDialog: {\n    title: \"Do you want to add more rows?\",\n    description: (rowsNeeded: number) =>\n      `We need ${rowsNeeded} additional ${rowsNeeded === 1 ? \"row\" : \"rows\"} to paste everything from your clipboard.`,\n    expandTitle: \"Create new rows\",\n    expandDescription: (rowsNeeded: number) =>\n      `Add ${rowsNeeded} new ${rowsNeeded === 1 ? \"row\" : \"rows\"} to the table and paste all data`,\n    keepTitle: \"Keep current rows\",\n    keepDescription: \"Paste only what fits in the existing rows\",\n    cancel: \"Cancel\",\n    confirm: \"Continue\"\n  },\n\n  rowHeight: {\n    label: \"Row height\",\n    short: \"Short\",\n    medium: \"Medium\",\n    tall: \"Tall\",\n    extraTall: \"Extra tall\"\n  },\n\n  view: {\n    trigger: \"View\",\n    toggleColumns: \"Toggle columns\",\n    searchPlaceholder: \"Search columns...\",\n    empty: \"No columns found.\"\n  },\n\n  sort: {\n    trigger: \"Sort\",\n    title: \"Sort by\",\n    emptyTitle: \"No sorting applied\",\n    description: \"Modify sorting to organize your rows.\",\n    emptyDescription: \"Add sorting to organize your rows.\",\n    add: \"Add sort\",\n    reset: \"Reset sorting\",\n    remove: \"Remove sort\",\n    drag: \"Drag to reorder\",\n    fieldPlaceholder: \"Search fields...\",\n    fieldEmpty: \"No fields found.\",\n    asc: \"Asc\",\n    desc: \"Desc\"\n  },\n\n  filter: {\n    trigger: \"Filter\",\n    title: \"Filter by\",\n    emptyTitle: \"No filters applied\",\n    description: \"Modify filters to narrow down your data.\",\n    emptyDescription: \"Add filters to narrow down your data.\",\n    add: \"Add filter\",\n    reset: \"Reset filters\",\n    remove: \"Remove filter\",\n    drag: \"Drag to reorder\",\n    where: \"Where\",\n    and: \"And\",\n    fieldPlaceholder: \"Search fields...\",\n    fieldEmpty: \"No fields found.\",\n    valuePlaceholder: \"Value\",\n    rangeStart: \"From\",\n    rangeEnd: \"To\",\n    pickDate: \"Pick a date\",\n    pickRange: \"Pick a range\",\n    optionPlaceholder: \"Search options...\",\n    optionEmpty: \"No options found.\",\n    selectedCount: (count: number) => `${count} selected`,\n    emptyValue: (label: string) => `${label} filter is empty`,\n    /** Nhãn toán tử lọc — xem `filters.ts` để biết toán tử nào dùng cho kiểu ô nào */\n    operators: {\n      contains: \"Contains\",\n      notContains: \"Does not contain\",\n      equals: \"Is\",\n      notEquals: \"Is not\",\n      startsWith: \"Starts with\",\n      endsWith: \"Ends with\",\n      isEmpty: \"Is empty\",\n      isNotEmpty: \"Is not empty\",\n      lessThan: \"Is less than\",\n      lessThanOrEqual: \"Is less than or equal to\",\n      greaterThan: \"Is greater than\",\n      greaterThanOrEqual: \"Is greater than or equal to\",\n      isBetween: \"Is between\",\n      dateEquals: \"Is\",\n      dateNotEquals: \"Is not\",\n      before: \"Is before\",\n      after: \"Is after\",\n      onOrBefore: \"Is on or before\",\n      onOrAfter: \"Is on or after\",\n      is: \"Is\",\n      isNot: \"Is not\",\n      isAnyOf: \"Has any of\",\n      isNoneOf: \"Has none of\",\n      isTrue: \"Is checked\",\n      isFalse: \"Is not checked\"\n    }\n  },\n\n  cell: {\n    longTextPlaceholder: \"Enter text...\",\n    optionSearchPlaceholder: \"Search...\",\n    optionEmpty: \"No options found.\",\n    clearAll: \"Clear all\",\n    invalidUrlTitle: \"Invalid URL\",\n    invalidUrlDescription: \"URL contains a dangerous protocol (javascript:, data:, vbscript:, or file:)\"\n  },\n\n  file: {\n    uploadLabel: \"Upload\",\n    dropHere: \"Drop files here\",\n    dragHere: \"Drag files here\",\n    browse: \"or click to browse\",\n    limits: (maxSize?: string, maxFiles?: number) => {\n      if (maxSize && maxFiles) return `Max size: ${maxSize} • Max ${maxFiles} files`;\n      if (maxSize) return `Max size: ${maxSize}`;\n      if (maxFiles) return `Max ${maxFiles} files`;\n      return \"Select files to upload\";\n    },\n    count: (count: number) => `${count} ${count === 1 ? \"file\" : \"files\"}`,\n    clearAll: \"Clear all\",\n    remove: \"Remove file\",\n    uploading: \"Uploading...\",\n    deleting: \"Deleting...\",\n    tooMany: (maxFiles: number) => `Only ${maxFiles} ${maxFiles === 1 ? \"file\" : \"files\"} allowed`,\n    tooLarge: (maxSize: string) => `File size exceeds ${maxSize}`,\n    wrongType: \"File type not accepted\",\n    rejectedOne: (name: string) => `\"${name}\" has been rejected`,\n    rejectedMany: (name: string, others: number) => `\"${name}\" and ${others} more rejected`,\n    uploadFailed: (count: number) => `Failed to upload ${count} ${count === 1 ? \"file\" : \"files\"}`,\n    deleteFailed: (name: string) => `Failed to delete ${name}`,\n    deleteFailedMany: \"Failed to delete files\"\n  },\n\n  toast: {\n    cellsCopied: (count: number) => `${count} ${count === 1 ? \"cell\" : \"cells\"} copied`,\n    copyFailed: \"Failed to copy to clipboard\",\n    cellsCut: (count: number) => `${count} ${count === 1 ? \"cell\" : \"cells\"} cut`,\n    cutFailed: \"Failed to cut to clipboard\",\n    cellsPasted: (count: number) => `${count} ${count === 1 ? \"cell\" : \"cells\"} pasted`,\n    cellsPastedWithSkipped: (count: number, skipped: number) =>\n      `${count} ${count === 1 ? \"cell\" : \"cells\"} pasted, ${skipped} skipped`,\n    pasteSkipped: (skipped: number) =>\n      `${skipped} ${skipped === 1 ? \"cell\" : \"cells\"} skipped pasting for invalid data`,\n    pasteFailed: \"Failed to paste. Please try again.\",\n    cellsCleared: (count: number) => `${count} ${count === 1 ? \"cell\" : \"cells\"} cleared`,\n    rowsDeleted: (count: number) => `${count} ${count === 1 ? \"row\" : \"rows\"} deleted`,\n    nothingToUndo: \"Nothing left to undo\",\n    nothingToRedo: \"Nothing left to redo\",\n    undone: (count: number) => `${count} ${count === 1 ? \"action\" : \"actions\"} undone`,\n    redone: (count: number) => `${count} ${count === 1 ? \"action\" : \"actions\"} redone`\n  },\n\n  /** Giá trị văn bản khi dán boolean vào ô văn bản */\n  booleanText: {\n    checked: \"Yes\",\n    unchecked: \"No\"\n  },\n\n  /**\n   * Lời đọc cho trình đọc màn hình khi kéo-thả để đổi thứ tự điều kiện trong menu Lọc / Sắp xếp\n   * (`sortable.tsx`, qua `accessibility` của dnd-kit). `item` là id của mục đang kéo; `position`\n   * đếm từ 1.\n   */\n  sortable: {\n    /** Hướng dẫn gắn vào mục kéo được; `orientation` quyết định cặp phím mũi tên được nhắc tới. */\n    instructions: (orientation: \"vertical\" | \"horizontal\" | \"mixed\") => {\n      const keys =\n        orientation === \"vertical\" ? \"up and down\" : orientation === \"horizontal\" ? \"left and right\" : \"arrow\";\n      return `To pick up a sortable item, press space or enter. While dragging, use the ${keys} keys to move the item. Press space or enter again to drop the item in its new position, or press escape to cancel.`;\n    },\n    dragStart: (item: string, position: number, total: number) =>\n      `Picked up sortable item \"${item}\". Current position is ${position} of ${total}. Use arrow keys to move, space to drop.`,\n    dragOver: (item: string, direction: \"up\" | \"down\", position: number, total: number) =>\n      `Sortable item \"${item}\" moved ${direction} to position ${position} of ${total}.`,\n    dragMove: (item: string, direction: \"up\" | \"down\", position: number, total: number) =>\n      `Sortable item \"${item}\" is moving ${direction} to position ${position} of ${total}.`,\n    /** Mục đang kéo đã ra ngoài vùng thả (dùng cho cả `onDragOver` lẫn `onDragMove`). */\n    outside: \"Sortable item is no longer over a droppable area. Press escape to cancel.\",\n    dragEnd: (item: string, position: number, total: number) =>\n      `Sortable item \"${item}\" dropped at position ${position} of ${total}.`,\n    dragEndNoChange: (item: string) => `Sortable item \"${item}\" dropped. No changes were made.`,\n    dragCancel: (item: string, position: number, total: number) =>\n      `Sorting cancelled. Sortable item \"${item}\" returned to position ${position} of ${total}.`\n  },\n\n  shortcuts: {\n    trigger: \"Keyboard shortcuts\",\n    title: \"Keyboard shortcuts\",\n    description: \"Every shortcut for working through the grid without the mouse.\",\n    searchPlaceholder: \"Search shortcuts...\",\n    emptyTitle: \"No shortcuts found\",\n    emptyDescription: \"Try a different search term.\",\n    close: \"Close\",\n    groups: {\n      navigation: \"Navigation\",\n      selection: \"Selection\",\n      editing: \"Editing\",\n      search: \"Search\",\n      filtering: \"Filtering\",\n      sorting: \"Sorting\",\n      general: \"General\"\n    },\n    keys: {\n      click: \"Click\",\n      doubleClick: \"Double click\"\n    },\n    navigation: {\n      move: \"Navigate between cells\",\n      nextCell: \"Move to next cell\",\n      prevCell: \"Move to previous cell\",\n      firstColumn: \"Move to first column\",\n      lastColumn: \"Move to last column\",\n      firstRowSameColumn: \"Move to first row (same column)\",\n      lastRowSameColumn: \"Move to last row (same column)\",\n      firstColumnSameRow: \"Move to first column (same row)\",\n      lastColumnSameRow: \"Move to last column (same row)\",\n      firstCell: \"Move to first cell\",\n      lastCell: \"Move to last cell\",\n      pageUp: \"Move up one page\",\n      pageDown: \"Move down one page\",\n      scrollUp: \"Scroll up one page\",\n      scrollDown: \"Scroll down one page\",\n      scrollLeft: \"Scroll left one page of columns\",\n      scrollRight: \"Scroll right one page of columns\"\n    },\n    selection: {\n      extend: \"Extend selection\",\n      toTop: \"Select to top of table\",\n      toBottom: \"Select to bottom of table\",\n      toFirstColumn: \"Select to first column\",\n      toLastColumn: \"Select to last column\",\n      all: \"Select all cells\",\n      toggle: \"Toggle cell selection\",\n      range: \"Select range\",\n      clear: \"Clear selection\"\n    },\n    editing: {\n      start: \"Start editing cell\",\n      insertRow: \"Insert row below\",\n      copy: \"Copy selected cells\",\n      cut: \"Cut selected cells\",\n      paste: \"Paste cells\",\n      clear: \"Clear selected cells\",\n      deleteRows: \"Delete selected rows\",\n      undo: \"Undo last action\",\n      redo: \"Redo last action\"\n    },\n    search: {\n      open: \"Open search\",\n      next: \"Next match\",\n      prev: \"Previous match\",\n      close: \"Close search\"\n    },\n    filtering: {\n      toggle: \"Toggle the filter menu\",\n      remove: \"Remove filter (when focused)\"\n    },\n    sorting: {\n      toggle: \"Toggle the sort menu\",\n      remove: \"Remove sort (when focused)\"\n    },\n    general: {\n      shortcuts: \"Show keyboard shortcuts\"\n    }\n  }\n};\n\n/**\n * Hình dạng của một bảng ngôn ngữ. Suy ra từ bảng tiếng Anh nên không có chỗ nào để hai thứ\n * lệch nhau: thêm một khoá vào `messagesEn` là mọi bảng khác đỏ cho tới khi dịch xong.\n */\nexport type DataGridMessages = typeof messagesEn;\n"],"mappings":"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","names":[]}

package/dist/data-grid/messages-vi.d.ts

@@ -5,7 +5,9 @@ import { DataGridMessages } from './messages-en.js';
  * ở đây là thứ bắt lỗi: thêm khoá mới ở bản tiếng Anh mà quên dịch thì typecheck đỏ ngay, thay vì
  * một chuỗi `undefined` lọt ra giao diện lúc chạy.
  *
- * ⚠ Bản này KHÔNG còn là mặc định từ `2.0.0`. Muốn nó thì truyền `locale="vi"` (xem README §5).
+ * ⚠ Bản này KHÔNG còn là mặc định từ `2.0.0`. Từ `3.0.0` lưới tự chọn nó khi app đặt
+ * `<ComitorLocaleProvider locale="vi">` ở root; muốn riêng lưới tiếng Việt thì truyền `locale="vi"`
+ * (hoặc bọc `DataGridLocaleProvider locale="vi"`).
  */
 declare const messagesVi: DataGridMessages;
 

package/dist/data-grid/messages-vi.js

@@ -192,6 +192,20 @@ const messagesVi = {
     checked: "C\xF3",
     unchecked: "Kh\xF4ng"
   },
+  /** Lời đọc cho trình đọc màn hình khi kéo-thả đổi thứ tự trong menu Lọc / Sắp xếp */
+  sortable: {
+    instructions: (orientation) => {
+      const keys = orientation === "vertical" ? "l\xEAn/xu\u1ED1ng" : orientation === "horizontal" ? "tr\xE1i/ph\u1EA3i" : "";
+      return `Nh\u1EA5n ph\xEDm c\xE1ch ho\u1EB7c Enter \u0111\u1EC3 nh\u1EA5c m\u1EE5c l\xEAn. Khi \u0111ang gi\u1EEF, d\xF9ng ph\xEDm m\u0169i t\xEAn${keys ? ` ${keys}` : ""} \u0111\u1EC3 di chuy\u1EC3n. Nh\u1EA5n ph\xEDm c\xE1ch ho\u1EB7c Enter l\u1EA7n n\u1EEFa \u0111\u1EC3 th\u1EA3 v\xE0o v\u1ECB tr\xED m\u1EDBi, ho\u1EB7c Esc \u0111\u1EC3 hu\u1EF7.`;
+    },
+    dragStart: (item, position, total) => `\u0110\xE3 nh\u1EA5c m\u1EE5c "${item}". V\u1ECB tr\xED hi\u1EC7n t\u1EA1i ${position} / ${total}. D\xF9ng ph\xEDm m\u0169i t\xEAn \u0111\u1EC3 di chuy\u1EC3n, ph\xEDm c\xE1ch \u0111\u1EC3 th\u1EA3.`,
+    dragOver: (item, direction, position, total) => `M\u1EE5c "${item}" \u0111\xE3 chuy\u1EC3n ${direction === "down" ? "xu\u1ED1ng" : "l\xEAn"} v\u1ECB tr\xED ${position} / ${total}.`,
+    dragMove: (item, direction, position, total) => `M\u1EE5c "${item}" \u0111ang di chuy\u1EC3n ${direction === "down" ? "xu\u1ED1ng" : "l\xEAn"} v\u1ECB tr\xED ${position} / ${total}.`,
+    outside: "M\u1EE5c \u0111ang \u1EDF ngo\xE0i v\xF9ng th\u1EA3. Nh\u1EA5n Esc \u0111\u1EC3 hu\u1EF7.",
+    dragEnd: (item, position, total) => `\u0110\xE3 th\u1EA3 m\u1EE5c "${item}" \u1EDF v\u1ECB tr\xED ${position} / ${total}.`,
+    dragEndNoChange: (item) => `\u0110\xE3 th\u1EA3 m\u1EE5c "${item}". Kh\xF4ng c\xF3 thay \u0111\u1ED5i n\xE0o.`,
+    dragCancel: (item, position, total) => `\u0110\xE3 hu\u1EF7 s\u1EAFp x\u1EBFp. M\u1EE5c "${item}" tr\u1EDF v\u1EC1 v\u1ECB tr\xED ${position} / ${total}.`
+  },
   shortcuts: {
     trigger: "Ph\xEDm t\u1EAFt",
     title: "Ph\xEDm t\u1EAFt",