@sqlrooms/data-table 0.27.0 → 0.28.0-rc.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,7 +3,7 @@ import { cn } from '@sqlrooms/ui';
3
3
  /**∏
4
4
  * A badge that displays the type of a database table column.
5
5
  */
6
- export const ColumnTypeBadge = ({ className, columnType, typeCategory }) => (_jsx("div", { title: String(columnType), className: cn('flex h-5 items-center justify-center', 'py-0.25 w-[55px] flex-shrink-0 overflow-hidden text-ellipsis rounded-sm px-1 text-center text-[9px]', 'cursor-default whitespace-nowrap lowercase', {
6
+ export const ColumnTypeBadge = ({ className, columnType, typeCategory }) => (_jsx("div", { title: String(columnType), className: cn('flex h-5 items-center justify-center', 'w-[55px] shrink-0 overflow-hidden rounded-sm px-1 py-0.25 text-center text-[9px] text-ellipsis', 'cursor-default whitespace-nowrap lowercase', {
7
7
  'bg-gray-200 text-gray-500 dark:bg-gray-700 dark:text-gray-400': !typeCategory,
8
8
  'bg-blue-100 text-blue-500 dark:bg-blue-900 dark:text-blue-400': typeCategory === 'string',
9
9
  'bg-green-100 text-green-500 dark:bg-green-900 dark:text-green-400': typeCategory === 'number',
@@ -1 +1 @@
1
- {"version":3,"file":"ColumnTypeBadge.js","sourceRoot":"","sources":["../src/ColumnTypeBadge.tsx"],"names":[],"mappings":";AACA,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAGhC;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAIvB,CAAC,EAAC,SAAS,EAAE,UAAU,EAAE,YAAY,EAAC,EAAE,EAAE,CAAC,CAC9C,cACE,KAAK,EAAE,MAAM,CAAC,UAAU,CAAC,EACzB,SAAS,EAAE,EAAE,CACX,sCAAsC,EACtC,qGAAqG,EACrG,4CAA4C,EAC5C;QACE,+DAA+D,EAC7D,CAAC,YAAY;QACf,+DAA+D,EAC7D,YAAY,KAAK,QAAQ;QAC3B,mEAAmE,EACjE,YAAY,KAAK,QAAQ;QAC3B,uEAAuE,EACrE,YAAY,KAAK,UAAU;QAC7B,2DAA2D,EACzD,YAAY,KAAK,SAAS;QAC5B,uEAAuE,EACrE,YAAY,KAAK,QAAQ,IAAI,YAAY,KAAK,UAAU;QAC1D,uEAAuE,EACrE,YAAY,KAAK,MAAM,IAAI,YAAY,KAAK,QAAQ;KACvD,EACD,SAAS,CACV,YAEA,MAAM,CAAC,UAAU,CAAC,GACf,CACP,CAAC","sourcesContent":["import {ColumnTypeCategory} from '@sqlrooms/duckdb';\nimport {cn} from '@sqlrooms/ui';\nimport {FC} from 'react';\n\n/**∏\n * A badge that displays the type of a database table column.\n */\nexport const ColumnTypeBadge: FC<{\n className?: string;\n columnType: unknown;\n typeCategory?: ColumnTypeCategory;\n}> = ({className, columnType, typeCategory}) => (\n <div\n title={String(columnType)}\n className={cn(\n 'flex h-5 items-center justify-center',\n 'py-0.25 w-[55px] flex-shrink-0 overflow-hidden text-ellipsis rounded-sm px-1 text-center text-[9px]',\n 'cursor-default whitespace-nowrap lowercase',\n {\n 'bg-gray-200 text-gray-500 dark:bg-gray-700 dark:text-gray-400':\n !typeCategory,\n 'bg-blue-100 text-blue-500 dark:bg-blue-900 dark:text-blue-400':\n typeCategory === 'string',\n 'bg-green-100 text-green-500 dark:bg-green-900 dark:text-green-400':\n typeCategory === 'number',\n 'bg-yellow-100 text-yellow-500 dark:bg-yellow-900 dark:text-yellow-400':\n typeCategory === 'datetime',\n 'bg-red-100 text-red-500 dark:bg-red-900 dark:text-red-400':\n typeCategory === 'boolean',\n 'bg-orange-100 text-orange-400 dark:bg-orange-900 dark:text-orange-400':\n typeCategory === 'binary' || typeCategory === 'geometry',\n 'bg-purple-100 text-purple-500 dark:bg-purple-900 dark:text-purple-400':\n typeCategory === 'json' || typeCategory === 'struct',\n },\n className,\n )}\n >\n {String(columnType)}\n </div>\n);\n"]}
1
+ {"version":3,"file":"ColumnTypeBadge.js","sourceRoot":"","sources":["../src/ColumnTypeBadge.tsx"],"names":[],"mappings":";AACA,OAAO,EAAC,EAAE,EAAC,MAAM,cAAc,CAAC;AAGhC;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAIvB,CAAC,EAAC,SAAS,EAAE,UAAU,EAAE,YAAY,EAAC,EAAE,EAAE,CAAC,CAC9C,cACE,KAAK,EAAE,MAAM,CAAC,UAAU,CAAC,EACzB,SAAS,EAAE,EAAE,CACX,sCAAsC,EACtC,gGAAgG,EAChG,4CAA4C,EAC5C;QACE,+DAA+D,EAC7D,CAAC,YAAY;QACf,+DAA+D,EAC7D,YAAY,KAAK,QAAQ;QAC3B,mEAAmE,EACjE,YAAY,KAAK,QAAQ;QAC3B,uEAAuE,EACrE,YAAY,KAAK,UAAU;QAC7B,2DAA2D,EACzD,YAAY,KAAK,SAAS;QAC5B,uEAAuE,EACrE,YAAY,KAAK,QAAQ,IAAI,YAAY,KAAK,UAAU;QAC1D,uEAAuE,EACrE,YAAY,KAAK,MAAM,IAAI,YAAY,KAAK,QAAQ;KACvD,EACD,SAAS,CACV,YAEA,MAAM,CAAC,UAAU,CAAC,GACf,CACP,CAAC","sourcesContent":["import {ColumnTypeCategory} from '@sqlrooms/duckdb';\nimport {cn} from '@sqlrooms/ui';\nimport {FC} from 'react';\n\n/**∏\n * A badge that displays the type of a database table column.\n */\nexport const ColumnTypeBadge: FC<{\n className?: string;\n columnType: unknown;\n typeCategory?: ColumnTypeCategory;\n}> = ({className, columnType, typeCategory}) => (\n <div\n title={String(columnType)}\n className={cn(\n 'flex h-5 items-center justify-center',\n 'w-[55px] shrink-0 overflow-hidden rounded-sm px-1 py-0.25 text-center text-[9px] text-ellipsis',\n 'cursor-default whitespace-nowrap lowercase',\n {\n 'bg-gray-200 text-gray-500 dark:bg-gray-700 dark:text-gray-400':\n !typeCategory,\n 'bg-blue-100 text-blue-500 dark:bg-blue-900 dark:text-blue-400':\n typeCategory === 'string',\n 'bg-green-100 text-green-500 dark:bg-green-900 dark:text-green-400':\n typeCategory === 'number',\n 'bg-yellow-100 text-yellow-500 dark:bg-yellow-900 dark:text-yellow-400':\n typeCategory === 'datetime',\n 'bg-red-100 text-red-500 dark:bg-red-900 dark:text-red-400':\n typeCategory === 'boolean',\n 'bg-orange-100 text-orange-400 dark:bg-orange-900 dark:text-orange-400':\n typeCategory === 'binary' || typeCategory === 'geometry',\n 'bg-purple-100 text-purple-500 dark:bg-purple-900 dark:text-purple-400':\n typeCategory === 'json' || typeCategory === 'struct',\n },\n className,\n )}\n >\n {String(columnType)}\n </div>\n);\n"]}
@@ -62,12 +62,12 @@ export default function DataTablePaginated({ className, fontSize = 'text-xs', da
62
62
  useEffect(() => {
63
63
  setInternalPageIndex(pagination?.pageIndex ?? 0);
64
64
  }, [pagination?.pageIndex]);
65
- return (_jsxs("div", { className: cn(`relative flex h-full w-full flex-col`, className), children: [_jsx("div", { className: "border-border flex-1 overflow-hidden border font-mono", children: _jsxs(ScrollArea, { className: "h-full overflow-auto", children: [_jsxs(Table, { disableWrapper: true, children: [_jsx(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => (_jsxs(TableRow, { children: [_jsx(TableHead, { className: `bg-background sticky left-0 top-[-1px] z-10 w-auto whitespace-nowrap border-r py-2 text-center`, children: isFetching ? (_jsx("div", { className: "border-primary h-4 w-4 animate-spin rounded-full border-2 border-t-transparent" })) : enableRowSelection ? (_jsx(Checkbox, { checked: table.getIsAllPageRowsSelected() ||
65
+ return (_jsxs("div", { className: cn(`relative flex h-full w-full flex-col`, className), children: [_jsx("div", { className: "border-border flex-1 overflow-hidden border font-mono", children: _jsxs(ScrollArea, { className: "h-full overflow-auto", children: [_jsxs(Table, { disableWrapper: true, children: [_jsx(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => (_jsxs(TableRow, { children: [_jsx(TableHead, { className: `bg-background sticky -top-px left-0 z-10 w-auto border-r py-2 text-center whitespace-nowrap`, children: isFetching ? (_jsx("div", { className: "border-primary h-4 w-4 animate-spin rounded-full border-2 border-t-transparent" })) : enableRowSelection ? (_jsx(Checkbox, { checked: table.getIsAllPageRowsSelected() ||
66
66
  (table.getIsSomePageRowsSelected() && 'indeterminate'), onCheckedChange: (value) => table.toggleAllPageRowsSelected(!!value), "aria-label": "Select all" })) : null }), headerGroup.headers.map((header) => {
67
67
  const meta = header.column.columnDef
68
68
  .meta;
69
- return (_jsx(TableHead, { colSpan: header.colSpan, className: cn('bg-background hover:bg-muted sticky top-[-1px] z-10 w-auto whitespace-nowrap border-r py-2', pagination ? 'cursor-pointer' : '', meta?.isNumeric ? 'text-right' : 'text-left', fontSizeClass), onClick: header.column.getToggleSortingHandler(), children: _jsxs("div", { className: "flex items-center gap-2", children: [header.isPlaceholder ? null : (_jsx("div", { children: flexRender(header.column.columnDef.header, header.getContext()) })), header.column.getIsSorted() ? (header.column.getIsSorted() === 'desc' ? (_jsx(ChevronDownIcon, { className: "h-4 w-4" })) : (_jsx(ChevronUpIcon, { className: "h-4 w-4" }))) : null, _jsx("div", { className: "flex-1" }), _jsx(Badge, { variant: "outline", className: `max-w-[400px] truncate text-xs opacity-30`, children: String(meta?.type) })] }) }, header.id));
70
- }), _jsx(TableHead, { className: "bg-background sticky top-[-1px] w-full whitespace-nowrap border-r border-t py-2" })] }, headerGroup.id))) }), _jsx(TableBody, { children: table.getRowModel().rows.map((row, i) => (_jsxs(TableRow, { "data-state": row.getIsSelected() ? 'selected' : undefined, className: cn('hover:bg-muted bg-background', row.getIsSelected() && 'bg-muted'), onClick: onRowClick
69
+ return (_jsx(TableHead, { colSpan: header.colSpan, className: cn('bg-background hover:bg-muted sticky -top-px z-10 w-auto border-r py-2 whitespace-nowrap', pagination ? 'cursor-pointer' : '', meta?.isNumeric ? 'text-right' : 'text-left', fontSizeClass), onClick: header.column.getToggleSortingHandler(), children: _jsxs("div", { className: "flex items-center gap-2", children: [header.isPlaceholder ? null : (_jsx("div", { children: flexRender(header.column.columnDef.header, header.getContext()) })), header.column.getIsSorted() ? (header.column.getIsSorted() === 'desc' ? (_jsx(ChevronDownIcon, { className: "h-4 w-4" })) : (_jsx(ChevronUpIcon, { className: "h-4 w-4" }))) : null, _jsx("div", { className: "flex-1" }), _jsx(Badge, { variant: "outline", className: `max-w-[400px] truncate text-xs opacity-30`, children: String(meta?.type) })] }) }, header.id));
70
+ }), _jsx(TableHead, { className: "bg-background sticky -top-px w-full border-t border-r py-2 whitespace-nowrap" })] }, headerGroup.id))) }), _jsx(TableBody, { children: table.getRowModel().rows.map((row, i) => (_jsxs(TableRow, { "data-state": row.getIsSelected() ? 'selected' : undefined, className: cn('hover:bg-muted bg-background', row.getIsSelected() && 'bg-muted'), onClick: onRowClick
71
71
  ? (event) => {
72
72
  event.preventDefault();
73
73
  onRowClick({ row: row, event });
@@ -79,7 +79,7 @@ export default function DataTablePaginated({ className, fontSize = 'text-xs', da
79
79
  }
80
80
  : undefined, children: [_jsx(TableCell, { className: `bg-background text-muted-foreground sticky left-0 border-r text-center ${fontSizeClass}`, children: enableRowSelection ? (_jsx(Checkbox, { checked: row.getIsSelected(), onCheckedChange: (value) => row.toggleSelected(!!value), onClick: (event) => event.stopPropagation(), "aria-label": "Select row" })) : pagination ? (`${pagination.pageIndex * pagination.pageSize + i + 1}`) : (`${i + 1}`) }), row.getVisibleCells().map((cell) => {
81
81
  const meta = cell.column.columnDef.meta;
82
- return (_jsx(TableCell, { className: cn('max-w-[500px] overflow-hidden truncate border-r px-7', fontSizeClass, meta?.isNumeric ? 'text-right' : 'text-left'), children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
82
+ return (_jsx(TableCell, { className: cn('max-w-[500px] truncate overflow-hidden border-r px-7', fontSizeClass, meta?.isNumeric ? 'text-right' : 'text-left'), children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
83
83
  }), _jsx(TableCell, { className: "border-r", children: "\u00A0" })] }, row.id))) })] }), _jsx(ScrollBar, { orientation: "vertical", className: "z-50" }), _jsx(ScrollBar, { orientation: "horizontal" })] }) }), pagination || footerActions ? (_jsxs("div", { className: "bg-background sticky bottom-0 left-0 flex flex-wrap items-center gap-2 border border-t-0 p-2", children: [pagination ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(Button, { variant: "outline", size: "icon", onClick: () => table.setPageIndex(0), disabled: !table.getCanPreviousPage(), children: _jsx(ChevronDoubleLeftIcon, { className: "h-4 w-4" }) }), _jsx(Button, { variant: "outline", size: "icon", onClick: () => table.previousPage(), disabled: !table.getCanPreviousPage(), children: _jsx(ChevronLeftIcon, { className: "h-4 w-4" }) }), _jsxs("div", { className: `ml-1 flex items-center gap-1 ${fontSizeClass}`, children: [_jsx("div", { children: "Page" }), _jsx(Input, { type: "number", min: 1, max: table.getPageCount(), className: "h-8 w-16", value: internalPageIndex + 1, onChange: (e) => {
84
84
  const value = e.target.value;
85
85
  if (value) {
@@ -1 +1 @@
1
- {"version":3,"file":"DataTablePaginated.js","sourceRoot":"","sources":["../src/DataTablePaginated.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Badge,\n Button,\n Checkbox,\n cn,\n Input,\n resolveFontSizeClass,\n ScrollArea,\n ScrollBar,\n Select,\n SelectContent,\n SelectItem,\n SelectTrigger,\n SelectValue,\n Table,\n TableBody,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from '@sqlrooms/ui';\nimport {formatCount} from '@sqlrooms/utils';\nimport {\n ColumnDef,\n flexRender,\n getCoreRowModel,\n getSortedRowModel,\n PaginationState,\n Row,\n RowSelectionState,\n SortingState,\n useReactTable,\n} from '@tanstack/react-table';\nimport {\n ChevronsLeftIcon as ChevronDoubleLeftIcon,\n ChevronsRightIcon as ChevronDoubleRightIcon,\n ChevronDownIcon,\n ChevronLeftIcon,\n ChevronRightIcon,\n ChevronUpIcon,\n} from 'lucide-react';\nimport {useCallback, useEffect, useMemo, useRef, useState} from 'react';\nimport {ArrowColumnMeta} from './useArrowDataTable';\n\nexport type DataTablePaginatedProps<Data extends object> = {\n className?: string;\n /** Custom font size for the table e.g. text-xs, text-sm, text-md, text-lg, text-base */\n fontSize?: string;\n data?: ArrayLike<Data> | undefined;\n columns?: ColumnDef<Data, any>[] | undefined;\n pageCount?: number | undefined;\n numRows?: number | undefined;\n isFetching?: boolean;\n pagination?: PaginationState | undefined;\n sorting?: SortingState;\n footerActions?: React.ReactNode;\n onPaginationChange?: (pagination: PaginationState) => void;\n onSortingChange?: (sorting: SortingState) => void;\n /**\n * Called when a row is clicked.\n */\n onRowClick?: (args: {\n row: Row<Data>;\n event: React.MouseEvent<HTMLTableRowElement>;\n }) => void;\n /**\n * Called when a row is double-clicked.\n */\n onRowDoubleClick?: (args: {\n row: Row<Data>;\n event: React.MouseEvent<HTMLTableRowElement>;\n }) => void;\n /**\n * Enables row selection with checkboxes. When true, a checkbox column is added.\n */\n enableRowSelection?: boolean;\n /**\n * Controlled row selection state. Keys are row indices, values are selection status.\n */\n rowSelection?: RowSelectionState;\n /**\n * Called when row selection changes.\n */\n onRowSelectionChange?: (rowSelection: RowSelectionState) => void;\n};\n\n/**\n * Data table with pagination, sorting, row selection, and custom actions.\n */\nexport default function DataTablePaginated<Data extends object>({\n className,\n fontSize = 'text-xs',\n data,\n columns,\n numRows,\n pagination,\n sorting,\n onPaginationChange,\n onSortingChange,\n footerActions,\n isFetching,\n onRowClick,\n onRowDoubleClick,\n enableRowSelection,\n rowSelection,\n onRowSelectionChange,\n}: DataTablePaginatedProps<Data>) {\n const defaultData = useMemo(() => [], []);\n const [internalRowSelection, setInternalRowSelection] =\n useState<RowSelectionState>({});\n\n // Use controlled or uncontrolled row selection\n const currentRowSelection = rowSelection ?? internalRowSelection;\n const currentRowSelectionRef = useRef(currentRowSelection);\n\n useEffect(() => {\n currentRowSelectionRef.current = currentRowSelection;\n }, [currentRowSelection]);\n\n const handleRowSelectionChange = useCallback(\n (\n updaterOrValue:\n | RowSelectionState\n | ((old: RowSelectionState) => RowSelectionState),\n ) => {\n if (onRowSelectionChange) {\n const newValue =\n typeof updaterOrValue === 'function'\n ? updaterOrValue(currentRowSelectionRef.current)\n : updaterOrValue;\n onRowSelectionChange(newValue);\n } else {\n setInternalRowSelection(updaterOrValue);\n }\n },\n [onRowSelectionChange, setInternalRowSelection],\n );\n\n const fontSizeClass = resolveFontSizeClass(fontSize);\n const pageCount =\n pagination && numRows !== undefined\n ? Math.ceil(numRows / pagination.pageSize)\n : undefined;\n\n const table = useReactTable({\n data: (data ?? defaultData) as any[],\n columns: columns ?? [],\n pageCount: pageCount ?? 0,\n getSortedRowModel: getSortedRowModel(),\n enableRowSelection: enableRowSelection ?? false,\n onRowSelectionChange: (update) => {\n handleRowSelectionChange(update);\n },\n onSortingChange: (update) => {\n if (onSortingChange && sorting && typeof update === 'function') {\n onSortingChange(update(sorting));\n }\n },\n onPaginationChange: (update) => {\n if (pagination && onPaginationChange && typeof update === 'function') {\n onPaginationChange(update(pagination));\n }\n },\n getCoreRowModel: getCoreRowModel(),\n manualPagination: true,\n state: {\n pagination,\n sorting,\n rowSelection: currentRowSelection,\n },\n });\n\n const [internalPageIndex, setInternalPageIndex] = useState(\n pagination?.pageIndex ?? 0,\n );\n useEffect(() => {\n setInternalPageIndex(pagination?.pageIndex ?? 0);\n }, [pagination?.pageIndex]);\n\n return (\n <div className={cn(`relative flex h-full w-full flex-col`, className)}>\n <div className=\"border-border flex-1 overflow-hidden border font-mono\">\n <ScrollArea className=\"h-full overflow-auto\">\n <Table disableWrapper>\n <TableHeader>\n {table.getHeaderGroups().map((headerGroup) => (\n <TableRow key={headerGroup.id}>\n <TableHead\n className={`bg-background sticky left-0 top-[-1px] z-10 w-auto whitespace-nowrap border-r py-2 text-center`}\n >\n {isFetching ? (\n <div className=\"border-primary h-4 w-4 animate-spin rounded-full border-2 border-t-transparent\" />\n ) : enableRowSelection ? (\n <Checkbox\n checked={\n table.getIsAllPageRowsSelected() ||\n (table.getIsSomePageRowsSelected() && 'indeterminate')\n }\n onCheckedChange={(value) =>\n table.toggleAllPageRowsSelected(!!value)\n }\n aria-label=\"Select all\"\n />\n ) : null}\n </TableHead>\n {headerGroup.headers.map((header) => {\n const meta = header.column.columnDef\n .meta as ArrowColumnMeta;\n return (\n <TableHead\n key={header.id}\n colSpan={header.colSpan}\n className={cn(\n 'bg-background hover:bg-muted sticky top-[-1px] z-10 w-auto whitespace-nowrap border-r py-2',\n pagination ? 'cursor-pointer' : '',\n meta?.isNumeric ? 'text-right' : 'text-left',\n fontSizeClass,\n )}\n onClick={header.column.getToggleSortingHandler()}\n >\n <div className=\"flex items-center gap-2\">\n {header.isPlaceholder ? null : (\n <div>\n {flexRender(\n header.column.columnDef.header,\n header.getContext(),\n )}\n </div>\n )}\n {header.column.getIsSorted() ? (\n header.column.getIsSorted() === 'desc' ? (\n <ChevronDownIcon className=\"h-4 w-4\" />\n ) : (\n <ChevronUpIcon className=\"h-4 w-4\" />\n )\n ) : null}\n <div className=\"flex-1\" />\n <Badge\n variant=\"outline\"\n className={`max-w-[400px] truncate text-xs opacity-30`}\n >\n {String(meta?.type)}\n </Badge>\n </div>\n </TableHead>\n );\n })}\n <TableHead className=\"bg-background sticky top-[-1px] w-full whitespace-nowrap border-r border-t py-2\" />\n </TableRow>\n ))}\n </TableHeader>\n <TableBody>\n {table.getRowModel().rows.map((row, i) => (\n <TableRow\n key={row.id}\n data-state={row.getIsSelected() ? 'selected' : undefined}\n className={cn(\n 'hover:bg-muted bg-background',\n row.getIsSelected() && 'bg-muted',\n )}\n onClick={\n onRowClick\n ? (event) => {\n event.preventDefault();\n onRowClick({row: row as Row<Data>, event});\n }\n : undefined\n }\n onDoubleClick={\n onRowDoubleClick\n ? (event) => {\n event.preventDefault();\n onRowDoubleClick({row: row as Row<Data>, event});\n }\n : undefined\n }\n >\n <TableCell\n className={`bg-background text-muted-foreground sticky left-0 border-r text-center ${fontSizeClass}`}\n >\n {enableRowSelection ? (\n <Checkbox\n checked={row.getIsSelected()}\n onCheckedChange={(value) => row.toggleSelected(!!value)}\n onClick={(event) => event.stopPropagation()}\n aria-label=\"Select row\"\n />\n ) : pagination ? (\n `${pagination.pageIndex * pagination.pageSize + i + 1}`\n ) : (\n `${i + 1}`\n )}\n </TableCell>\n {row.getVisibleCells().map((cell) => {\n const meta = cell.column.columnDef.meta as ArrowColumnMeta;\n return (\n <TableCell\n key={cell.id}\n className={cn(\n 'max-w-[500px] overflow-hidden truncate border-r px-7',\n fontSizeClass,\n meta?.isNumeric ? 'text-right' : 'text-left',\n )}\n >\n {flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n )}\n </TableCell>\n );\n })}\n <TableCell className=\"border-r\">&nbsp;</TableCell>\n </TableRow>\n ))}\n </TableBody>\n </Table>\n <ScrollBar orientation=\"vertical\" className=\"z-50\" />\n <ScrollBar orientation=\"horizontal\" />\n </ScrollArea>\n </div>\n {pagination || footerActions ? (\n <div className=\"bg-background sticky bottom-0 left-0 flex flex-wrap items-center gap-2 border border-t-0 p-2\">\n {pagination ? (\n <>\n <div className=\"flex flex-wrap items-center gap-2\">\n <Button\n variant=\"outline\"\n size=\"icon\"\n onClick={() => table.setPageIndex(0)}\n disabled={!table.getCanPreviousPage()}\n >\n <ChevronDoubleLeftIcon className=\"h-4 w-4\" />\n </Button>\n <Button\n variant=\"outline\"\n size=\"icon\"\n onClick={() => table.previousPage()}\n disabled={!table.getCanPreviousPage()}\n >\n <ChevronLeftIcon className=\"h-4 w-4\" />\n </Button>\n <div\n className={`ml-1 flex items-center gap-1 ${fontSizeClass}`}\n >\n <div>Page</div>\n <Input\n type=\"number\"\n min={1}\n max={table.getPageCount()}\n className=\"h-8 w-16\"\n value={internalPageIndex + 1}\n onChange={(e) => {\n const value = e.target.value;\n if (value) {\n const page = Math.max(\n 0,\n Math.min(table.getPageCount() - 1, Number(value) - 1),\n );\n setInternalPageIndex(page);\n }\n }}\n onBlur={() => {\n if (internalPageIndex !== pagination?.pageIndex) {\n table.setPageIndex(internalPageIndex);\n }\n }}\n />\n <div>{`of ${formatCount(table.getPageCount())}`}</div>\n </div>\n <Button\n variant=\"outline\"\n size=\"icon\"\n onClick={() => table.nextPage()}\n disabled={!table.getCanNextPage()}\n >\n <ChevronRightIcon className=\"h-4 w-4\" />\n </Button>\n <Button\n variant=\"outline\"\n size=\"icon\"\n onClick={() => table.setPageIndex(table.getPageCount() - 1)}\n disabled={!table.getCanNextPage()}\n >\n <ChevronDoubleRightIcon className=\"h-4 w-4\" />\n </Button>\n <Select\n value={String(table.getState().pagination.pageSize)}\n onValueChange={(value) => table.setPageSize(Number(value))}\n >\n <SelectTrigger className=\"h-8 w-[110px]\">\n <SelectValue />\n </SelectTrigger>\n <SelectContent>\n {[10, 50, 100, 500, 1000].map((pageSize) => (\n <SelectItem key={pageSize} value={String(pageSize)}>\n {`${pageSize} rows`}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n </div>\n <div className=\"flex-1\" />\n </>\n ) : null}\n\n <>\n {numRows !== undefined && isFinite(numRows) ? (\n <div className={`font-normal ${fontSizeClass}`}>\n {`${formatCount(numRows)} rows`}\n </div>\n ) : null}\n </>\n {footerActions}\n </div>\n ) : null}\n\n {isFetching ? (\n <div className=\"bg-background/80 absolute inset-0 animate-pulse\" />\n ) : null}\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"DataTablePaginated.js","sourceRoot":"","sources":["../src/DataTablePaginated.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Badge,\n Button,\n Checkbox,\n cn,\n Input,\n resolveFontSizeClass,\n ScrollArea,\n ScrollBar,\n Select,\n SelectContent,\n SelectItem,\n SelectTrigger,\n SelectValue,\n Table,\n TableBody,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from '@sqlrooms/ui';\nimport {formatCount} from '@sqlrooms/utils';\nimport {\n ColumnDef,\n flexRender,\n getCoreRowModel,\n getSortedRowModel,\n PaginationState,\n Row,\n RowSelectionState,\n SortingState,\n useReactTable,\n} from '@tanstack/react-table';\nimport {\n ChevronsLeftIcon as ChevronDoubleLeftIcon,\n ChevronsRightIcon as ChevronDoubleRightIcon,\n ChevronDownIcon,\n ChevronLeftIcon,\n ChevronRightIcon,\n ChevronUpIcon,\n} from 'lucide-react';\nimport {useCallback, useEffect, useMemo, useRef, useState} from 'react';\nimport {ArrowColumnMeta} from './useArrowDataTable';\n\nexport type DataTablePaginatedProps<Data extends object> = {\n className?: string;\n /** Custom font size for the table e.g. text-xs, text-sm, text-md, text-lg, text-base */\n fontSize?: string;\n data?: ArrayLike<Data> | undefined;\n columns?: ColumnDef<Data, any>[] | undefined;\n pageCount?: number | undefined;\n numRows?: number | undefined;\n isFetching?: boolean;\n pagination?: PaginationState | undefined;\n sorting?: SortingState;\n footerActions?: React.ReactNode;\n onPaginationChange?: (pagination: PaginationState) => void;\n onSortingChange?: (sorting: SortingState) => void;\n /**\n * Called when a row is clicked.\n */\n onRowClick?: (args: {\n row: Row<Data>;\n event: React.MouseEvent<HTMLTableRowElement>;\n }) => void;\n /**\n * Called when a row is double-clicked.\n */\n onRowDoubleClick?: (args: {\n row: Row<Data>;\n event: React.MouseEvent<HTMLTableRowElement>;\n }) => void;\n /**\n * Enables row selection with checkboxes. When true, a checkbox column is added.\n */\n enableRowSelection?: boolean;\n /**\n * Controlled row selection state. Keys are row indices, values are selection status.\n */\n rowSelection?: RowSelectionState;\n /**\n * Called when row selection changes.\n */\n onRowSelectionChange?: (rowSelection: RowSelectionState) => void;\n};\n\n/**\n * Data table with pagination, sorting, row selection, and custom actions.\n */\nexport default function DataTablePaginated<Data extends object>({\n className,\n fontSize = 'text-xs',\n data,\n columns,\n numRows,\n pagination,\n sorting,\n onPaginationChange,\n onSortingChange,\n footerActions,\n isFetching,\n onRowClick,\n onRowDoubleClick,\n enableRowSelection,\n rowSelection,\n onRowSelectionChange,\n}: DataTablePaginatedProps<Data>) {\n const defaultData = useMemo(() => [], []);\n const [internalRowSelection, setInternalRowSelection] =\n useState<RowSelectionState>({});\n\n // Use controlled or uncontrolled row selection\n const currentRowSelection = rowSelection ?? internalRowSelection;\n const currentRowSelectionRef = useRef(currentRowSelection);\n\n useEffect(() => {\n currentRowSelectionRef.current = currentRowSelection;\n }, [currentRowSelection]);\n\n const handleRowSelectionChange = useCallback(\n (\n updaterOrValue:\n | RowSelectionState\n | ((old: RowSelectionState) => RowSelectionState),\n ) => {\n if (onRowSelectionChange) {\n const newValue =\n typeof updaterOrValue === 'function'\n ? updaterOrValue(currentRowSelectionRef.current)\n : updaterOrValue;\n onRowSelectionChange(newValue);\n } else {\n setInternalRowSelection(updaterOrValue);\n }\n },\n [onRowSelectionChange, setInternalRowSelection],\n );\n\n const fontSizeClass = resolveFontSizeClass(fontSize);\n const pageCount =\n pagination && numRows !== undefined\n ? Math.ceil(numRows / pagination.pageSize)\n : undefined;\n\n const table = useReactTable({\n data: (data ?? defaultData) as any[],\n columns: columns ?? [],\n pageCount: pageCount ?? 0,\n getSortedRowModel: getSortedRowModel(),\n enableRowSelection: enableRowSelection ?? false,\n onRowSelectionChange: (update) => {\n handleRowSelectionChange(update);\n },\n onSortingChange: (update) => {\n if (onSortingChange && sorting && typeof update === 'function') {\n onSortingChange(update(sorting));\n }\n },\n onPaginationChange: (update) => {\n if (pagination && onPaginationChange && typeof update === 'function') {\n onPaginationChange(update(pagination));\n }\n },\n getCoreRowModel: getCoreRowModel(),\n manualPagination: true,\n state: {\n pagination,\n sorting,\n rowSelection: currentRowSelection,\n },\n });\n\n const [internalPageIndex, setInternalPageIndex] = useState(\n pagination?.pageIndex ?? 0,\n );\n useEffect(() => {\n setInternalPageIndex(pagination?.pageIndex ?? 0);\n }, [pagination?.pageIndex]);\n\n return (\n <div className={cn(`relative flex h-full w-full flex-col`, className)}>\n <div className=\"border-border flex-1 overflow-hidden border font-mono\">\n <ScrollArea className=\"h-full overflow-auto\">\n <Table disableWrapper>\n <TableHeader>\n {table.getHeaderGroups().map((headerGroup) => (\n <TableRow key={headerGroup.id}>\n <TableHead\n className={`bg-background sticky -top-px left-0 z-10 w-auto border-r py-2 text-center whitespace-nowrap`}\n >\n {isFetching ? (\n <div className=\"border-primary h-4 w-4 animate-spin rounded-full border-2 border-t-transparent\" />\n ) : enableRowSelection ? (\n <Checkbox\n checked={\n table.getIsAllPageRowsSelected() ||\n (table.getIsSomePageRowsSelected() && 'indeterminate')\n }\n onCheckedChange={(value) =>\n table.toggleAllPageRowsSelected(!!value)\n }\n aria-label=\"Select all\"\n />\n ) : null}\n </TableHead>\n {headerGroup.headers.map((header) => {\n const meta = header.column.columnDef\n .meta as ArrowColumnMeta;\n return (\n <TableHead\n key={header.id}\n colSpan={header.colSpan}\n className={cn(\n 'bg-background hover:bg-muted sticky -top-px z-10 w-auto border-r py-2 whitespace-nowrap',\n pagination ? 'cursor-pointer' : '',\n meta?.isNumeric ? 'text-right' : 'text-left',\n fontSizeClass,\n )}\n onClick={header.column.getToggleSortingHandler()}\n >\n <div className=\"flex items-center gap-2\">\n {header.isPlaceholder ? null : (\n <div>\n {flexRender(\n header.column.columnDef.header,\n header.getContext(),\n )}\n </div>\n )}\n {header.column.getIsSorted() ? (\n header.column.getIsSorted() === 'desc' ? (\n <ChevronDownIcon className=\"h-4 w-4\" />\n ) : (\n <ChevronUpIcon className=\"h-4 w-4\" />\n )\n ) : null}\n <div className=\"flex-1\" />\n <Badge\n variant=\"outline\"\n className={`max-w-[400px] truncate text-xs opacity-30`}\n >\n {String(meta?.type)}\n </Badge>\n </div>\n </TableHead>\n );\n })}\n <TableHead className=\"bg-background sticky -top-px w-full border-t border-r py-2 whitespace-nowrap\" />\n </TableRow>\n ))}\n </TableHeader>\n <TableBody>\n {table.getRowModel().rows.map((row, i) => (\n <TableRow\n key={row.id}\n data-state={row.getIsSelected() ? 'selected' : undefined}\n className={cn(\n 'hover:bg-muted bg-background',\n row.getIsSelected() && 'bg-muted',\n )}\n onClick={\n onRowClick\n ? (event) => {\n event.preventDefault();\n onRowClick({row: row as Row<Data>, event});\n }\n : undefined\n }\n onDoubleClick={\n onRowDoubleClick\n ? (event) => {\n event.preventDefault();\n onRowDoubleClick({row: row as Row<Data>, event});\n }\n : undefined\n }\n >\n <TableCell\n className={`bg-background text-muted-foreground sticky left-0 border-r text-center ${fontSizeClass}`}\n >\n {enableRowSelection ? (\n <Checkbox\n checked={row.getIsSelected()}\n onCheckedChange={(value) => row.toggleSelected(!!value)}\n onClick={(event) => event.stopPropagation()}\n aria-label=\"Select row\"\n />\n ) : pagination ? (\n `${pagination.pageIndex * pagination.pageSize + i + 1}`\n ) : (\n `${i + 1}`\n )}\n </TableCell>\n {row.getVisibleCells().map((cell) => {\n const meta = cell.column.columnDef.meta as ArrowColumnMeta;\n return (\n <TableCell\n key={cell.id}\n className={cn(\n 'max-w-[500px] truncate overflow-hidden border-r px-7',\n fontSizeClass,\n meta?.isNumeric ? 'text-right' : 'text-left',\n )}\n >\n {flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n )}\n </TableCell>\n );\n })}\n <TableCell className=\"border-r\">&nbsp;</TableCell>\n </TableRow>\n ))}\n </TableBody>\n </Table>\n <ScrollBar orientation=\"vertical\" className=\"z-50\" />\n <ScrollBar orientation=\"horizontal\" />\n </ScrollArea>\n </div>\n {pagination || footerActions ? (\n <div className=\"bg-background sticky bottom-0 left-0 flex flex-wrap items-center gap-2 border border-t-0 p-2\">\n {pagination ? (\n <>\n <div className=\"flex flex-wrap items-center gap-2\">\n <Button\n variant=\"outline\"\n size=\"icon\"\n onClick={() => table.setPageIndex(0)}\n disabled={!table.getCanPreviousPage()}\n >\n <ChevronDoubleLeftIcon className=\"h-4 w-4\" />\n </Button>\n <Button\n variant=\"outline\"\n size=\"icon\"\n onClick={() => table.previousPage()}\n disabled={!table.getCanPreviousPage()}\n >\n <ChevronLeftIcon className=\"h-4 w-4\" />\n </Button>\n <div\n className={`ml-1 flex items-center gap-1 ${fontSizeClass}`}\n >\n <div>Page</div>\n <Input\n type=\"number\"\n min={1}\n max={table.getPageCount()}\n className=\"h-8 w-16\"\n value={internalPageIndex + 1}\n onChange={(e) => {\n const value = e.target.value;\n if (value) {\n const page = Math.max(\n 0,\n Math.min(table.getPageCount() - 1, Number(value) - 1),\n );\n setInternalPageIndex(page);\n }\n }}\n onBlur={() => {\n if (internalPageIndex !== pagination?.pageIndex) {\n table.setPageIndex(internalPageIndex);\n }\n }}\n />\n <div>{`of ${formatCount(table.getPageCount())}`}</div>\n </div>\n <Button\n variant=\"outline\"\n size=\"icon\"\n onClick={() => table.nextPage()}\n disabled={!table.getCanNextPage()}\n >\n <ChevronRightIcon className=\"h-4 w-4\" />\n </Button>\n <Button\n variant=\"outline\"\n size=\"icon\"\n onClick={() => table.setPageIndex(table.getPageCount() - 1)}\n disabled={!table.getCanNextPage()}\n >\n <ChevronDoubleRightIcon className=\"h-4 w-4\" />\n </Button>\n <Select\n value={String(table.getState().pagination.pageSize)}\n onValueChange={(value) => table.setPageSize(Number(value))}\n >\n <SelectTrigger className=\"h-8 w-[110px]\">\n <SelectValue />\n </SelectTrigger>\n <SelectContent>\n {[10, 50, 100, 500, 1000].map((pageSize) => (\n <SelectItem key={pageSize} value={String(pageSize)}>\n {`${pageSize} rows`}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n </div>\n <div className=\"flex-1\" />\n </>\n ) : null}\n\n <>\n {numRows !== undefined && isFinite(numRows) ? (\n <div className={`font-normal ${fontSizeClass}`}>\n {`${formatCount(numRows)} rows`}\n </div>\n ) : null}\n </>\n {footerActions}\n </div>\n ) : null}\n\n {isFetching ? (\n <div className=\"bg-background/80 absolute inset-0 animate-pulse\" />\n ) : null}\n </div>\n );\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"useArrowDataTable.d.ts","sourceRoot":"","sources":["../src/useArrowDataTable.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAC;AAC/C,OAAO,KAAK,KAAK,MAAM,cAAc,CAAC;AAOtC,KAAK,uBAAuB,GAAG;IAC7B,IAAI,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACrB,OAAO,EAAE,SAAS,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;CACpB,CAAC;AAkFF;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,MAAM,4BAA4B,GAAG,CACzC,IAAI,EAAE,KAAK,CAAC,QAAQ,EACpB,KAAK,EAAE,OAAO,KACX,MAAM,GAAG,SAAS,CAAC;AAExB,MAAM,MAAM,wBAAwB,GAAG;IACrC,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,WAAW,CAAC,EAAE,4BAA4B,CAAC;CAC5C,CAAC;AAGF,MAAM,CAAC,OAAO,UAAU,iBAAiB,CACvC,KAAK,EAAE,KAAK,CAAC,KAAK,GAAG,SAAS,EAC9B,OAAO,GAAE,wBAA6B,GACrC,uBAAuB,GAAG,SAAS,CAkGrC"}
1
+ {"version":3,"file":"useArrowDataTable.d.ts","sourceRoot":"","sources":["../src/useArrowDataTable.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAC,SAAS,EAAC,MAAM,sBAAsB,CAAC;AAC/C,OAAO,KAAK,KAAK,MAAM,cAAc,CAAC;AAQtC,KAAK,uBAAuB,GAAG;IAC7B,IAAI,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC;IACrB,OAAO,EAAE,SAAS,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;CACpB,CAAC;AAkFF;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,MAAM,4BAA4B,GAAG,CACzC,IAAI,EAAE,KAAK,CAAC,QAAQ,EACpB,KAAK,EAAE,OAAO,KACX,MAAM,GAAG,SAAS,CAAC;AAExB,MAAM,MAAM,wBAAwB,GAAG;IACrC,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,WAAW,CAAC,EAAE,4BAA4B,CAAC;CAC5C,CAAC;AAGF,MAAM,CAAC,OAAO,UAAU,iBAAiB,CACvC,KAAK,EAAE,KAAK,CAAC,KAAK,GAAG,SAAS,EAC9B,OAAO,GAAE,wBAA6B,GACrC,uBAAuB,GAAG,SAAS,CAkGrC"}
@@ -2,9 +2,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { JsonMonacoEditor } from '@sqlrooms/monaco-editor';
3
3
  import { Button, Popover, PopoverContent, PopoverTrigger, resolveFontSizeClass, } from '@sqlrooms/ui';
4
4
  import { safeJsonParse, shorten, toDecimalString } from '@sqlrooms/utils';
5
- import { ClipboardIcon } from 'lucide-react';
6
5
  import { createColumnHelper } from '@tanstack/react-table';
7
6
  import * as arrow from 'apache-arrow';
7
+ import { ClipboardIcon } from 'lucide-react';
8
8
  import { useMemo } from 'react';
9
9
  const columnHelper = createColumnHelper();
10
10
  const MAX_VALUE_LENGTH = 64;
@@ -99,7 +99,7 @@ export default function useArrowDataTable(table, options = {}) {
99
99
  minimap: { enabled: false },
100
100
  scrollBeyondLastLine: false,
101
101
  wordWrap: 'on',
102
- } })) : (_jsx("div", { className: "whitespace-pre-wrap break-words font-mono text-xs", children: valueStr })) }), _jsx("div", { className: "mt-2 flex justify-end", children: _jsx(Button, { variant: "ghost", size: "xs", onClick: () => navigator.clipboard.writeText(valueStr), children: _jsx(ClipboardIcon, { className: "h-3 w-3" }) }) })] }) })] })) : (valueStr);
102
+ } })) : (_jsx("div", { className: "font-mono text-xs wrap-break-word whitespace-pre-wrap", children: valueStr })) }), _jsx("div", { className: "mt-2 flex justify-end", children: _jsx(Button, { variant: "ghost", size: "xs", onClick: () => navigator.clipboard.writeText(valueStr), children: _jsx(ClipboardIcon, { className: "h-3 w-3" }) }) })] }) })] })) : (valueStr);
103
103
  },
104
104
  header: shorten(field.name, MAX_VALUE_LENGTH),
105
105
  meta: {
@@ -1 +1 @@
1
- {"version":3,"file":"useArrowDataTable.js","sourceRoot":"","sources":["../src/useArrowDataTable.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,gBAAgB,EAAC,MAAM,yBAAyB,CAAC;AACzD,OAAO,EACL,MAAM,EACN,OAAO,EACP,cAAc,EACd,cAAc,EACd,oBAAoB,GACrB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAC,aAAa,EAAE,OAAO,EAAE,eAAe,EAAC,MAAM,iBAAiB,CAAC;AACxE,OAAO,EAAC,aAAa,EAAC,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAC,kBAAkB,EAAC,MAAM,uBAAuB,CAAC;AAEzD,OAAO,KAAK,KAAK,MAAM,cAAc,CAAC;AACtC,OAAO,EAAC,OAAO,EAAC,MAAM,OAAO,CAAC;AAE9B,MAAM,YAAY,GAAG,kBAAkB,EAAE,CAAC;AAc1C,MAAM,gBAAgB,GAAG,EAAE,CAAC;AAE5B;;GAEG;AACH,SAAS,aAAa,CAAC,IAAoB,EAAE,KAAc;IACzD,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,SAAS;QAAE,OAAO,MAAM,CAAC;IAEzD,kBAAkB;IAClB,IAAI,KAAK,CAAC,QAAQ,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC;QACnC,MAAM,KAAK,GAAI,IAAY,CAAC,KAAK,IAAI,CAAC,CAAC;QAEvC,IAAI,KAAK,YAAY,WAAW,EAAE,CAAC;YACjC,uEAAuE;YACvE,OAAO,eAAe,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;QACvC,CAAC;QAED,qEAAqE;QACrE,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC;IACvB,CAAC;IAED,oBAAoB;IACpB,IAAI,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC;QACrC,QAAQ,OAAO,KAAK,EAAE,CAAC;YACrB,KAAK,QAAQ,CAAC;YACd,KAAK,QAAQ;gBACX,OAAO,IAAI,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;YAC/C,KAAK,QAAQ;gBACX,OAAO,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC;QACzC,CAAC;IACH,CAAC;IAED,eAAe;IACf,IAAI,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;QAChC,QAAQ,OAAO,KAAK,EAAE,CAAC;YACrB,KAAK,QAAQ,CAAC;YACd,KAAK,QAAQ;gBACX,OAAO,IAAI,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC,WAAW,EAAE,CAAC,SAAS,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;YACxE,KAAK,QAAQ;gBACX,OAAO,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,WAAW,EAAE,CAAC,SAAS,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC;QAC3D,CAAC;IACH,CAAC;IAED,eAAe;IACf,6DAA6D;IAC7D,EAAE;IACF,0DAA0D;IAC1D,yFAAyF;IACzF,wDAAwD;IACxD,EAAE;IACF,+FAA+F;IAC/F,IAAI,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;QAChC,MAAM,QAAQ,GAAG,IAAmB,CAAC;QAErC,oBAAoB;QACpB,IAAI,KAAK,YAAY,IAAI;YAAE,OAAO,KAAK,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QAEnE,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;YAC3D,MAAM,GAAG,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;YAC1B,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC;gBAAE,OAAO,MAAM,CAAC,GAAG,CAAC,CAAC;YAE9C,MAAM,CAAC,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC;YACxB,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC;gBAAE,OAAO,CAAC,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;YAEpE,OAAO,MAAM,CAAC,GAAG,CAAC,CAAC;QACrB,CAAC;QAED,uBAAuB;QACvB,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;YAC9B,MAAM,CAAC,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC;YAC1B,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC;gBAAE,OAAO,CAAC,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QACtE,CAAC;QAED,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC;IACvB,CAAC;IAED,mBAAmB;IACnB,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC;AACvB,CAAC;AAsCD,8DAA8D;AAC9D,MAAM,CAAC,OAAO,UAAU,iBAAiB,CACvC,KAA8B,EAC9B,UAAoC,EAAE;IAEtC,MAAM,EAAC,QAAQ,GAAG,MAAM,EAAE,WAAW,EAAC,GAAG,OAAO,CAAC;IACjD,MAAM,aAAa,GAAG,oBAAoB,CAAC,QAAQ,CAAC,CAAC;IACrD,MAAM,IAAI,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAC,MAAM,EAAE,KAAK,EAAE,OAAO,IAAI,CAAC,EAAC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IACrE,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,IAAI,CAAC,KAAK;YAAE,OAAO,SAAS,CAAC;QAC7B,MAAM,OAAO,GAA0B,EAAE,CAAC;QAC1C,KAAK,MAAM,KAAK,IAAI,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC;YACxC,OAAO,CAAC,IAAI,CACV,YAAY,CAAC,QAAQ,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE;gBACrE,IAAI,EAAE,CAAC,IAAI,EAAE,EAAE;oBACb,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;oBAC9B,MAAM,QAAQ,GACZ,WAAW,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC;wBAChC,aAAa,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;oBACnC,MAAM,UAAU,GAAG,aAAa,CAAU,QAAQ,CAAC,CAAC;oBACpD,MAAM,WAAW,GAAG,UAAU,KAAK,SAAS,CAAC;oBAE7C,OAAO,QAAQ,CAAC,MAAM,GAAG,gBAAgB,CAAC,CAAC,CAAC,CAC1C,MAAC,OAAO,eACN,KAAC,cAAc,IAAC,OAAO,kBACrB,eAAM,SAAS,EAAC,gBAAgB,YAC7B,OAAO,CAAC,GAAG,QAAQ,EAAE,EAAE,gBAAgB,CAAC,GACpC,GACQ,EAGjB,KAAC,cAAc,IACb,UAAU,EAAE,CAAC,EACb,KAAK,EAAC,QAAQ,EACd,SAAS,EAAE,8BAA8B,aAAa,uBAAuB,YAE7E,eAAK,SAAS,EAAC,WAAW,aAExB,eAAK,SAAS,EAAC,iCAAiC,aAC9C,eACE,SAAS,EAAC,4BAA4B,EACtC,KAAK,EAAE,KAAK,CAAC,IAAI,YAEhB,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,gBAAgB,CAAC,GACjC,EACP,eAAM,SAAS,EAAC,gCAAgC,YAC7C,IAAI,KAAK,CAAC,IAAI,GAAG,GACb,IACH,EAGN,cAAK,SAAS,EAAC,2CAA2C,YACvD,WAAW,IAAI,UAAU,CAAC,CAAC,CAAC,CAC3B,KAAC,gBAAgB,IACf,KAAK,EAAE,UAAiB,EACxB,QAAQ,EAAE,IAAI,EACd,OAAO,EAAE;oDACP,WAAW,EAAE,KAAK;oDAClB,OAAO,EAAE,EAAC,OAAO,EAAE,KAAK,EAAC;oDACzB,oBAAoB,EAAE,KAAK;oDAC3B,QAAQ,EAAE,IAAI;iDACf,GACD,CACH,CAAC,CAAC,CAAC,CACF,cAAK,SAAS,EAAC,mDAAmD,YAC/D,QAAQ,GACL,CACP,GACG,EAGN,cAAK,SAAS,EAAC,uBAAuB,YACpC,KAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,YAEtD,KAAC,aAAa,IAAC,SAAS,EAAC,SAAS,GAAG,GAC9B,GACL,IACF,GACS,IACT,CACX,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CAAC;gBACJ,CAAC;gBACD,MAAM,EAAE,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,gBAAgB,CAAC;gBAC7C,IAAI,EAAE;oBACJ,IAAI,EAAE,KAAK,CAAC,IAAI;oBAChB,SAAS,EACP,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC;wBAClC,KAAK,CAAC,QAAQ,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC;wBACpC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC;iBACnC;aACF,CAAC,CACH,CAAC;QACJ,CAAC;QACD,OAAO,OAAO,CAAC;IACjB,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,EAAE,WAAW,CAAC,CAAC,CAAC;IAExC,OAAO,IAAI,IAAI,OAAO,CAAC,CAAC,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC,CAAC,CAAC,SAAS,CAAC;AACvD,CAAC","sourcesContent":["import {JsonMonacoEditor} from '@sqlrooms/monaco-editor';\nimport {\n Button,\n Popover,\n PopoverContent,\n PopoverTrigger,\n resolveFontSizeClass,\n} from '@sqlrooms/ui';\nimport {safeJsonParse, shorten, toDecimalString} from '@sqlrooms/utils';\nimport {ClipboardIcon} from 'lucide-react';\nimport {createColumnHelper} from '@tanstack/react-table';\nimport {ColumnDef} from '@tanstack/table-core';\nimport * as arrow from 'apache-arrow';\nimport {useMemo} from 'react';\n\nconst columnHelper = createColumnHelper();\n\n// TODO: support fetch the result chunks lazily https://github.com/duckdb/duckdb-wasm/tree/master/packages/duckdb-wasm#query-execution\n\ntype UseArrowDataTableResult = {\n data: ArrayLike<any>;\n columns: ColumnDef<any, any>[];\n};\n\nexport type ArrowColumnMeta = {\n type: arrow.DataType;\n isNumeric: boolean;\n};\n\nconst MAX_VALUE_LENGTH = 64;\n\n/**\n * Converts an Arrow value into a human-readable string.\n */\nfunction valueToString(type: arrow.DataType, value: unknown): string {\n if (value === null || value === undefined) return 'NULL';\n\n // --- DECIMAL ---\n if (arrow.DataType.isDecimal(type)) {\n const scale = (type as any).scale ?? 0;\n\n if (value instanceof Uint32Array) {\n // Use Apache Arrow–style helper to convert Decimal128 buffer to string\n return toDecimalString(value, scale);\n }\n\n // For non-Uint32Array values, fall back to default string rendering.\n return String(value);\n }\n\n // --- TIMESTAMP ---\n if (arrow.DataType.isTimestamp(type)) {\n switch (typeof value) {\n case 'number':\n case 'bigint':\n return new Date(Number(value)).toISOString();\n case 'string':\n return new Date(value).toISOString();\n }\n }\n\n // --- TIME ---\n if (arrow.DataType.isTime(type)) {\n switch (typeof value) {\n case 'number':\n case 'bigint':\n return new Date(Number(value) / 1000).toISOString().substring(11, 19);\n case 'string':\n return new Date(value).toISOString().substring(11, 19);\n }\n }\n\n // --- DATE ---\n // Handle Arrow Date32/Date64 values coming from DuckDB-WASM.\n //\n // 1. If `value` is already a JS Date, format it directly.\n // 2. If store config`castTimestampToDate` is true, DuckDB may return a number or bigint:\n // 3. If `value` is a string, try to parse it as a date.\n //\n // This ensures DATE columns are displayed as \"YYYY-MM-DD\" regardless of underlying Arrow type.\n if (arrow.DataType.isDate(type)) {\n const dateType = type as arrow.Date_;\n\n // Already a JS Date\n if (value instanceof Date) return value.toISOString().slice(0, 10);\n\n if (typeof value === 'number' || typeof value === 'bigint') {\n const num = Number(value);\n if (!Number.isFinite(num)) return String(num);\n\n const d = new Date(num);\n if (!Number.isNaN(d.getTime())) return d.toISOString().slice(0, 10);\n\n return String(num);\n }\n\n // Fallback for strings\n if (typeof value === 'string') {\n const d = new Date(value);\n if (!Number.isNaN(d.getTime())) return d.toISOString().slice(0, 10);\n }\n\n return String(value);\n }\n\n // --- fallback ---\n return String(value);\n}\n\n/**\n * Formatter for rendering Arrow cell values in data tables.\n * Return a string to override the default formatting.\n * If you don't return anything (or return undefined), the default formatter is used.\n *\n * @param type - The Arrow DataType for the column\n * @param value - The raw cell value\n * @returns A formatted string, or undefined/nothing to fall back to the default\n *\n * @example\n * ```ts\n * formatValue: (type, value) => {\n * if (arrow.DataType.isDecimal(type)) {\n * return `$${value}`;\n * }\n * if (arrow.DataType.isBinary(type) && value instanceof Uint8Array) {\n * return `${value.byteLength} bytes`;\n * }\n * }\n * ```\n */\nexport type ArrowDataTableValueFormatter = (\n type: arrow.DataType,\n value: unknown,\n) => string | undefined;\n\nexport type UseArrowDataTableOptions = {\n /** Custom font size for the table e.g. xs, sm, md, lg, base */\n fontSize?: string;\n /**\n * Custom value formatter that overrides the default valueToString.\n * Return a string to use your custom formatting, or undefined to fall back to the default.\n */\n formatValue?: ArrowDataTableValueFormatter;\n};\n\n// Only use for small tables or in combination with pagination\nexport default function useArrowDataTable(\n table: arrow.Table | undefined,\n options: UseArrowDataTableOptions = {},\n): UseArrowDataTableResult | undefined {\n const {fontSize = 'base', formatValue} = options;\n const fontSizeClass = resolveFontSizeClass(fontSize);\n const data = useMemo(() => ({length: table?.numRows ?? 0}), [table]);\n const columns = useMemo(() => {\n if (!table) return undefined;\n const columns: ColumnDef<any, any>[] = [];\n for (const field of table.schema.fields) {\n columns.push(\n columnHelper.accessor((_row, i) => table.getChild(field.name)?.get(i), {\n cell: (info) => {\n const value = info.getValue();\n const valueStr =\n formatValue?.(field.type, value) ??\n valueToString(field.type, value);\n const parsedJson = safeJsonParse<unknown>(valueStr);\n const isJsonValue = parsedJson !== undefined;\n\n return valueStr.length > MAX_VALUE_LENGTH ? (\n <Popover>\n <PopoverTrigger asChild>\n <span className=\"cursor-pointer\">\n {shorten(`${valueStr}`, MAX_VALUE_LENGTH)}\n </span>\n </PopoverTrigger>\n\n {/* Fixed PopoverContent width */}\n <PopoverContent\n sideOffset={4}\n align=\"center\"\n className={`w-[400px] max-w-[90vw] p-4 ${fontSizeClass} rounded-md shadow-md`}\n >\n <div className=\"space-y-2\">\n {/* Header row */}\n <div className=\"flex items-center gap-2 text-xs\">\n <span\n className=\"min-w-0 flex-1 font-medium\"\n title={field.name}\n >\n {shorten(field.name, MAX_VALUE_LENGTH)}\n </span>\n <span className=\"text-muted-foreground shrink-0\">\n {`(${field.type})`}\n </span>\n </div>\n\n {/* Scrollable content - JSON or raw text */}\n <div className=\"max-h-[300px] min-h-[100px] overflow-auto\">\n {isJsonValue && parsedJson ? (\n <JsonMonacoEditor\n value={parsedJson as any}\n readOnly={true}\n options={{\n lineNumbers: 'off',\n minimap: {enabled: false},\n scrollBeyondLastLine: false,\n wordWrap: 'on',\n }}\n />\n ) : (\n <div className=\"whitespace-pre-wrap break-words font-mono text-xs\">\n {valueStr}\n </div>\n )}\n </div>\n\n {/* Copy button */}\n <div className=\"mt-2 flex justify-end\">\n <Button\n variant=\"ghost\"\n size=\"xs\"\n onClick={() => navigator.clipboard.writeText(valueStr)}\n >\n <ClipboardIcon className=\"h-3 w-3\" />\n </Button>\n </div>\n </div>\n </PopoverContent>\n </Popover>\n ) : (\n valueStr\n );\n },\n header: shorten(field.name, MAX_VALUE_LENGTH),\n meta: {\n type: field.type,\n isNumeric:\n arrow.DataType.isFloat(field.type) ||\n arrow.DataType.isDecimal(field.type) ||\n arrow.DataType.isInt(field.type),\n },\n }),\n );\n }\n return columns;\n }, [table, fontSizeClass, formatValue]);\n\n return data && columns ? {data, columns} : undefined;\n}\n"]}
1
+ {"version":3,"file":"useArrowDataTable.js","sourceRoot":"","sources":["../src/useArrowDataTable.tsx"],"names":[],"mappings":"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","sourcesContent":["import {JsonMonacoEditor} from '@sqlrooms/monaco-editor';\nimport {\n Button,\n Popover,\n PopoverContent,\n PopoverTrigger,\n resolveFontSizeClass,\n} from '@sqlrooms/ui';\nimport {safeJsonParse, shorten, toDecimalString} from '@sqlrooms/utils';\nimport {createColumnHelper} from '@tanstack/react-table';\nimport {ColumnDef} from '@tanstack/table-core';\nimport * as arrow from 'apache-arrow';\nimport {ClipboardIcon} from 'lucide-react';\nimport {useMemo} from 'react';\n\nconst columnHelper = createColumnHelper();\n\n// TODO: support fetch the result chunks lazily https://github.com/duckdb/duckdb-wasm/tree/master/packages/duckdb-wasm#query-execution\n\ntype UseArrowDataTableResult = {\n data: ArrayLike<any>;\n columns: ColumnDef<any, any>[];\n};\n\nexport type ArrowColumnMeta = {\n type: arrow.DataType;\n isNumeric: boolean;\n};\n\nconst MAX_VALUE_LENGTH = 64;\n\n/**\n * Converts an Arrow value into a human-readable string.\n */\nfunction valueToString(type: arrow.DataType, value: unknown): string {\n if (value === null || value === undefined) return 'NULL';\n\n // --- DECIMAL ---\n if (arrow.DataType.isDecimal(type)) {\n const scale = (type as any).scale ?? 0;\n\n if (value instanceof Uint32Array) {\n // Use Apache Arrow–style helper to convert Decimal128 buffer to string\n return toDecimalString(value, scale);\n }\n\n // For non-Uint32Array values, fall back to default string rendering.\n return String(value);\n }\n\n // --- TIMESTAMP ---\n if (arrow.DataType.isTimestamp(type)) {\n switch (typeof value) {\n case 'number':\n case 'bigint':\n return new Date(Number(value)).toISOString();\n case 'string':\n return new Date(value).toISOString();\n }\n }\n\n // --- TIME ---\n if (arrow.DataType.isTime(type)) {\n switch (typeof value) {\n case 'number':\n case 'bigint':\n return new Date(Number(value) / 1000).toISOString().substring(11, 19);\n case 'string':\n return new Date(value).toISOString().substring(11, 19);\n }\n }\n\n // --- DATE ---\n // Handle Arrow Date32/Date64 values coming from DuckDB-WASM.\n //\n // 1. If `value` is already a JS Date, format it directly.\n // 2. If store config`castTimestampToDate` is true, DuckDB may return a number or bigint:\n // 3. If `value` is a string, try to parse it as a date.\n //\n // This ensures DATE columns are displayed as \"YYYY-MM-DD\" regardless of underlying Arrow type.\n if (arrow.DataType.isDate(type)) {\n const dateType = type as arrow.Date_;\n\n // Already a JS Date\n if (value instanceof Date) return value.toISOString().slice(0, 10);\n\n if (typeof value === 'number' || typeof value === 'bigint') {\n const num = Number(value);\n if (!Number.isFinite(num)) return String(num);\n\n const d = new Date(num);\n if (!Number.isNaN(d.getTime())) return d.toISOString().slice(0, 10);\n\n return String(num);\n }\n\n // Fallback for strings\n if (typeof value === 'string') {\n const d = new Date(value);\n if (!Number.isNaN(d.getTime())) return d.toISOString().slice(0, 10);\n }\n\n return String(value);\n }\n\n // --- fallback ---\n return String(value);\n}\n\n/**\n * Formatter for rendering Arrow cell values in data tables.\n * Return a string to override the default formatting.\n * If you don't return anything (or return undefined), the default formatter is used.\n *\n * @param type - The Arrow DataType for the column\n * @param value - The raw cell value\n * @returns A formatted string, or undefined/nothing to fall back to the default\n *\n * @example\n * ```ts\n * formatValue: (type, value) => {\n * if (arrow.DataType.isDecimal(type)) {\n * return `$${value}`;\n * }\n * if (arrow.DataType.isBinary(type) && value instanceof Uint8Array) {\n * return `${value.byteLength} bytes`;\n * }\n * }\n * ```\n */\nexport type ArrowDataTableValueFormatter = (\n type: arrow.DataType,\n value: unknown,\n) => string | undefined;\n\nexport type UseArrowDataTableOptions = {\n /** Custom font size for the table e.g. xs, sm, md, lg, base */\n fontSize?: string;\n /**\n * Custom value formatter that overrides the default valueToString.\n * Return a string to use your custom formatting, or undefined to fall back to the default.\n */\n formatValue?: ArrowDataTableValueFormatter;\n};\n\n// Only use for small tables or in combination with pagination\nexport default function useArrowDataTable(\n table: arrow.Table | undefined,\n options: UseArrowDataTableOptions = {},\n): UseArrowDataTableResult | undefined {\n const {fontSize = 'base', formatValue} = options;\n const fontSizeClass = resolveFontSizeClass(fontSize);\n const data = useMemo(() => ({length: table?.numRows ?? 0}), [table]);\n const columns = useMemo(() => {\n if (!table) return undefined;\n const columns: ColumnDef<any, any>[] = [];\n for (const field of table.schema.fields) {\n columns.push(\n columnHelper.accessor((_row, i) => table.getChild(field.name)?.get(i), {\n cell: (info) => {\n const value = info.getValue();\n const valueStr =\n formatValue?.(field.type, value) ??\n valueToString(field.type, value);\n const parsedJson = safeJsonParse<unknown>(valueStr);\n const isJsonValue = parsedJson !== undefined;\n\n return valueStr.length > MAX_VALUE_LENGTH ? (\n <Popover>\n <PopoverTrigger asChild>\n <span className=\"cursor-pointer\">\n {shorten(`${valueStr}`, MAX_VALUE_LENGTH)}\n </span>\n </PopoverTrigger>\n\n {/* Fixed PopoverContent width */}\n <PopoverContent\n sideOffset={4}\n align=\"center\"\n className={`w-[400px] max-w-[90vw] p-4 ${fontSizeClass} rounded-md shadow-md`}\n >\n <div className=\"space-y-2\">\n {/* Header row */}\n <div className=\"flex items-center gap-2 text-xs\">\n <span\n className=\"min-w-0 flex-1 font-medium\"\n title={field.name}\n >\n {shorten(field.name, MAX_VALUE_LENGTH)}\n </span>\n <span className=\"text-muted-foreground shrink-0\">\n {`(${field.type})`}\n </span>\n </div>\n\n {/* Scrollable content - JSON or raw text */}\n <div className=\"max-h-[300px] min-h-[100px] overflow-auto\">\n {isJsonValue && parsedJson ? (\n <JsonMonacoEditor\n value={parsedJson as any}\n readOnly={true}\n options={{\n lineNumbers: 'off',\n minimap: {enabled: false},\n scrollBeyondLastLine: false,\n wordWrap: 'on',\n }}\n />\n ) : (\n <div className=\"font-mono text-xs wrap-break-word whitespace-pre-wrap\">\n {valueStr}\n </div>\n )}\n </div>\n\n {/* Copy button */}\n <div className=\"mt-2 flex justify-end\">\n <Button\n variant=\"ghost\"\n size=\"xs\"\n onClick={() => navigator.clipboard.writeText(valueStr)}\n >\n <ClipboardIcon className=\"h-3 w-3\" />\n </Button>\n </div>\n </div>\n </PopoverContent>\n </Popover>\n ) : (\n valueStr\n );\n },\n header: shorten(field.name, MAX_VALUE_LENGTH),\n meta: {\n type: field.type,\n isNumeric:\n arrow.DataType.isFloat(field.type) ||\n arrow.DataType.isDecimal(field.type) ||\n arrow.DataType.isInt(field.type),\n },\n }),\n );\n }\n return columns;\n }, [table, fontSizeClass, formatValue]);\n\n return data && columns ? {data, columns} : undefined;\n}\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sqlrooms/data-table",
3
- "version": "0.27.0",
3
+ "version": "0.28.0-rc.0",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "module": "dist/index.js",
@@ -19,10 +19,10 @@
19
19
  "access": "public"
20
20
  },
21
21
  "dependencies": {
22
- "@sqlrooms/duckdb": "0.27.0",
23
- "@sqlrooms/monaco-editor": "0.27.0",
24
- "@sqlrooms/ui": "0.27.0",
25
- "@sqlrooms/utils": "0.27.0",
22
+ "@sqlrooms/duckdb": "0.28.0-rc.0",
23
+ "@sqlrooms/monaco-editor": "0.28.0-rc.0",
24
+ "@sqlrooms/ui": "0.28.0-rc.0",
25
+ "@sqlrooms/utils": "0.28.0-rc.0",
26
26
  "@tanstack/react-table": "^8.21.3",
27
27
  "@tanstack/table-core": "^8.21.3",
28
28
  "lucide-react": "^0.556.0",
@@ -40,5 +40,5 @@
40
40
  "typecheck": "tsc --noEmit",
41
41
  "typedoc": "typedoc"
42
42
  },
43
- "gitHead": "f215995ab4adeac4c58171739261a15cbba9e82b"
43
+ "gitHead": "87a478edbff690e04c38cc717db8e11e844565c8"
44
44
  }