@raystack/apsara 0.21.1 → 0.22.0

package/dist/table/datatable.cjs

@@ -0,0 +1,157 @@
+'use strict';
+
+var jsxRuntime = require('../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs');
+var reactIcons_esm = require('../node_modules/.pnpm/@radix-ui_react-icons@1.3.0_react@18.2.0/node_modules/@radix-ui/react-icons/dist/react-icons.esm.cjs');
+var index$1 = require('../node_modules/.pnpm/@tanstack_react-table@8.9.2_react-dom@18.3.1_react@18.2.0__react@18.2.0/node_modules/@tanstack/react-table/build/lib/index.cjs');
+var React = require('react');
+var flex = require('../flex/flex.cjs');
+var text = require('../text/text.cjs');
+var DataTableClearFilter = require('./DataTableClearFilter.cjs');
+var DataTableFilterChips = require('./DataTableFilterChips.cjs');
+var DataTableFilterOptions = require('./DataTableFilterOptions.cjs');
+var DataTableFooter = require('./DataTableFooter.cjs');
+var DataTableGloabalSearch = require('./DataTableGloabalSearch.cjs');
+var DataTableToolbar = require('./DataTableToolbar.cjs');
+var DataTableViewOptions = require('./DataTableViewOptions.cjs');
+var TableContext = require('./TableContext.cjs');
+var TableDetailContainer = require('./TableDetailContainer.cjs');
+var datatable_module = require('./datatable.module.css.cjs');
+var useTableColumn = require('./hooks/useTableColumn.cjs');
+var table = require('./table.cjs');
+var index = require('../node_modules/.pnpm/react-loading-skeleton@3.4.0_react@18.2.0/node_modules/react-loading-skeleton/dist/index.cjs');
+var index$2 = require('../node_modules/.pnpm/@tanstack_table-core@8.9.2/node_modules/@tanstack/table-core/build/lib/index.cjs');
+
+function DataTableRoot({ columns, data, emptyState, children, parentStyle, isLoading = false, ShouldShowHeader = true, initialState, loaderRow = 2, onRowClick, onStateChange = () => { }, onLoadMore, ...props }) {
+    const [tableCustomFilter, setTableCustomFilter] = React.useState({});
+    const convertedChildren = React.Children.toArray(children);
+    const header = convertedChildren.find((child) => child.type === DataTableToolbar.DataTableToolbar) || null;
+    const footer = convertedChildren.find((child) => child.type === DataTableFooter.DataTableFooter) || null;
+    const detail = convertedChildren.find((child) => child.type === TableDetailContainer.TableDetailContainer) ||
+        null;
+    const [tableState, setTableState] = React.useState({});
+    const observerRef = React.useRef(null);
+    const lastRowRef = React.useRef(null);
+    React.useEffect(() => {
+        if (!onLoadMore)
+            return;
+        const observer = new IntersectionObserver((entries) => {
+            if (entries[0].isIntersecting && !isLoading) {
+                onLoadMore();
+            }
+        }, { threshold: 0.1 });
+        observerRef.current = observer;
+        return () => observer.disconnect();
+    }, [onLoadMore, isLoading]);
+    React.useEffect(() => {
+        const observer = observerRef.current;
+        const lastRow = lastRowRef.current;
+        if (observer && lastRow) {
+            observer.disconnect();
+            observer.observe(lastRow);
+        }
+        return () => {
+            if (observer && lastRow) {
+                observer.unobserve(lastRow);
+            }
+        };
+    }, [isLoading]);
+    const getLoader = (loaderRow, columns) => ([...new Array(loaderRow)].map((_, rowIndex) => (jsxRuntime.jsxRuntimeExports.jsx(table.Table.Row, { children: columns.map((_, colIndex) => (jsxRuntime.jsxRuntimeExports.jsx(table.Table.Cell, { children: jsxRuntime.jsxRuntimeExports.jsx(index.default, { containerClassName: datatable_module.default.flex1, highlightColor: "var(--background-base)", baseColor: "var(--background-base-hover)" }) }, `col_${colIndex}`))) }, `row_${rowIndex}`))));
+    const tableData = onLoadMore ? data : (isLoading
+        ? [...new Array(loaderRow)].map((_, i) => ({ id: i }))
+        : data);
+    const { filteredColumns, addFilterColumn, removeFilterColumn, resetColumns } = useTableColumn.useTableColumn();
+    const columnWithCustomFilter = React.useMemo(() => columns.map((col) => {
+        const colId = col.id || col?.accessorKey;
+        const filterFn = colId && tableCustomFilter.hasOwnProperty(colId)
+            ? tableCustomFilter[colId]
+            : undefined;
+        const cell = onLoadMore
+            ? col.cell
+            : (isLoading
+                ? () => (jsxRuntime.jsxRuntimeExports.jsx(index.default, { containerClassName: datatable_module.default.flex1, highlightColor: "var(--background-base)", baseColor: "var(--background-base-hover)" }))
+                : col.cell);
+        return {
+            ...col,
+            cell,
+            filterFn,
+        };
+    }), [isLoading, columns, tableCustomFilter, onLoadMore]);
+    React.useEffect(() => {
+        if (onStateChange) {
+            onStateChange(tableState);
+        }
+    }, [tableState]);
+    const updateColumnCustomFilter = (id, filterFn) => {
+        setTableCustomFilter((old) => ({ ...old, [id]: filterFn }));
+    };
+    const table$1 = index$1.useReactTable({
+        data: tableData,
+        columns: columnWithCustomFilter,
+        globalFilterFn: "auto",
+        enableRowSelection: true,
+        manualPagination: true,
+        pageCount: -1,
+        onStateChange: (updater) => setTableState(updater),
+        getCoreRowModel: index$2.getCoreRowModel(),
+        getFilteredRowModel: index$2.getFilteredRowModel(),
+        getPaginationRowModel: index$2.getPaginationRowModel(),
+        getSortedRowModel: index$2.getSortedRowModel(),
+        getFacetedRowModel: index$2.getFacetedRowModel(),
+        getFacetedUniqueValues: index$2.getFacetedUniqueValues(),
+        initialState,
+        state: tableState,
+    });
+    const tableStyle = {
+        ...(table$1.getRowModel().rows?.length
+            ? { width: "100%" }
+            : { width: "100%", height: "100%" }),
+        ...{ "border-collapse": "collapse" },
+    };
+    return (jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { direction: "column", justify: "between", className: datatable_module.default.wrapper, children: jsxRuntime.jsxRuntimeExports.jsxs(TableContext.TableContext.Provider, { value: {
+                table: table$1,
+                globalFilter: tableState.globalFilter,
+                filteredColumns,
+                addFilterColumn,
+                removeFilterColumn,
+                resetColumns,
+                onGlobalFilterChange: (value) => setTableState((prev) => ({ ...prev, globalFilter: value })),
+                onChange: () => ({}),
+                tableCustomFilter,
+                updateColumnCustomFilter,
+                isLoading,
+            }, children: [jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { direction: "column", className: datatable_module.default.datatable, children: [header, jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { className: datatable_module.default.tableContainer, style: parentStyle, children: [jsxRuntime.jsxRuntimeExports.jsxs(table.Table, { ...props, style: tableStyle, children: [jsxRuntime.jsxRuntimeExports.jsx(table.Table.Header, { className: datatable_module.default.header, children: ShouldShowHeader
+                                                ? table$1.getHeaderGroups().map((headerGroup) => (jsxRuntime.jsxRuntimeExports.jsx(table.Table.Row, { children: headerGroup.headers.map((header, index) => {
+                                                        return (jsxRuntime.jsxRuntimeExports.jsx(table.Table.Head, { style: {
+                                                                cursor: "pointer",
+                                                                ...(header.column.columnDef?.meta?.style ?? {}),
+                                                            }, onClick: header.column.getToggleSortingHandler(), children: jsxRuntime.jsxRuntimeExports.jsxs(text.Text, { className: datatable_module.default.head, children: [header.isPlaceholder
+                                                                        ? null
+                                                                        : index$1.flexRender(header.column.columnDef.header, header.getContext()), header.column.getCanSort()
+                                                                        ? {
+                                                                            asc: jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.CaretUpIcon, {}),
+                                                                            desc: jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.CaretDownIcon, {}),
+                                                                        }[header.column.getIsSorted()] ?? jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.CaretSortIcon, {})
+                                                                        : null] }) }, `${header.id}_${index}`));
+                                                    }) }, headerGroup.id)))
+                                                : null }), jsxRuntime.jsxRuntimeExports.jsxs(table.Table.Body, { children: [table$1.getRowModel().rows?.length ? (table$1.getRowModel().rows.map((row, rowIndex) => (jsxRuntime.jsxRuntimeExports.jsx(table.Table.Row, { "data-state": row.getIsSelected() && "selected", onClick: () => onRowClick?.(row.original), className: isLoading
+                                                        ? ""
+                                                        : `${datatable_module.default.tRow} ${onRowClick ? datatable_module.default.tRowClick : ""}`, ref: onLoadMore && rowIndex === table$1.getRowModel().rows.length - 1
+                                                        ? lastRowRef
+                                                        : null, children: row.getVisibleCells().map((cell, index) => (jsxRuntime.jsxRuntimeExports.jsx(table.Table.Cell, { style: {
+                                                            ...(cell.column.columnDef?.meta?.style ?? {}),
+                                                        }, children: index$1.flexRender(cell.column.columnDef.cell, cell.getContext()) }, `${cell.id}_${index}`))) }, row.id)))) : (!isLoading ?
+                                                    jsxRuntime.jsxRuntimeExports.jsx(table.Table.Row, { children: jsxRuntime.jsxRuntimeExports.jsx(table.Table.Cell, { colSpan: columns.length, children: emptyState || "No results." }) }) : jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, {})), isLoading && onLoadMore && getLoader(loaderRow, columns)] })] }), detail] })] }), footer] }) }));
+}
+const DataTable = Object.assign(DataTableRoot, {
+    Toolbar: DataTableToolbar.DataTableToolbar,
+    GloabalSearch: DataTableGloabalSearch.DataTableGloabalSearch,
+    FilterOptions: DataTableFilterOptions.DataTableFilterOptions,
+    ViewOptions: DataTableViewOptions.DataTableViewOptions,
+    ClearFilter: DataTableClearFilter.DataTableClearFilter,
+    FilterChips: DataTableFilterChips.DataTableFilterChips,
+    Footer: DataTableFooter.DataTableFooter,
+    DetailContainer: TableDetailContainer.TableDetailContainer,
+});
+
+exports.DataTable = DataTable;
+//# sourceMappingURL=datatable.cjs.map

package/dist/table/datatable.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"datatable.cjs","sources":["../../table/datatable.tsx"],"sourcesContent":["import {\n  CaretUpIcon,\n  CaretDownIcon,\n  CaretSortIcon,\n} from \"@radix-ui/react-icons\";\nimport {\n  ColumnDef,\n  InitialTableState,\n  TableState,\n  flexRender,\n  getCoreRowModel,\n  getFacetedRowModel,\n  getFacetedUniqueValues,\n  getFilteredRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable,\n} from \"@tanstack/react-table\";\nimport {\n  CSSProperties,\n  Children,\n  ComponentProps,\n  ReactElement,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n  useRef,\n} from \"react\";\nimport { Flex } from \"~/flex\";\nimport { Text } from \"~/text\";\nimport { DataTableClearFilter } from \"./DataTableClearFilter\";\nimport { DataTableFilterChips } from \"./DataTableFilterChips\";\nimport { DataTableFilterOptions } from \"./DataTableFilterOptions\";\nimport { DataTableFooter } from \"./DataTableFooter\";\nimport { DataTableGloabalSearch } from \"./DataTableGloabalSearch\";\nimport { DataTableToolbar } from \"./DataTableToolbar\";\nimport { DataTableViewOptions } from \"./DataTableViewOptions\";\nimport { TableContext } from \"./TableContext\";\nimport { TableDetailContainer } from \"./TableDetailContainer\";\nimport styles from \"./datatable.module.css\";\nimport { useTableColumn } from \"./hooks/useTableColumn\";\nimport { Table } from \"./table\";\nimport {\n  ApsaraColumnDef,\n  tableFilterMap,\n  updateColumnFilter,\n} from \"./datatables.types\";\nimport Skeleton from \"react-loading-skeleton\";\n\ntype DataTableProps<TData, TValue> = {\n  columns: ApsaraColumnDef<TData>[];\n  data: TData[];\n  multiRowSelectionEnabled?: boolean;\n  children?: ReactNode;\n  ShouldShowHeader?: boolean;\n  emptyState?: ReactNode;\n  parentStyle?: CSSProperties;\n  isLoading?: boolean;\n  initialState?: Partial<InitialTableState>;\n  loaderRow?: number;\n  onRowClick?: (d: TData) => void;\n  onStateChange?: (d: Partial<TableState>) => void;\n  onLoadMore?: () => void;\n} & ComponentProps<typeof Table>;\n\nfunction DataTableRoot<TData, TValue>({\n  columns,\n  data,\n  emptyState,\n  children,\n  parentStyle,\n  isLoading = false,\n  ShouldShowHeader = true,\n  initialState,\n  loaderRow = 2,\n  onRowClick,\n  onStateChange = () => {},\n  onLoadMore,\n  ...props\n}: DataTableProps<TData, TValue>) {\n  const [tableCustomFilter, setTableCustomFilter] = useState<tableFilterMap>(\n    {}\n  );\n  const convertedChildren = Children.toArray(children) as ReactElement[];\n  const header =\n    convertedChildren.find((child) => child.type === DataTableToolbar) || null;\n  const footer =\n    convertedChildren.find((child) => child.type === DataTableFooter) || null;\n  const detail =\n    convertedChildren.find((child) => child.type === TableDetailContainer) ||\n    null;\n\n  const [tableState, setTableState] = useState<Partial<TableState>>({});\n  const observerRef = useRef<IntersectionObserver | null>(null);\n  const lastRowRef = useRef<HTMLTableRowElement | null>(null);\n\n  useEffect(() => {\n    if (!onLoadMore) return;\n\n    const observer = new IntersectionObserver((entries) => {\n      if (entries[0].isIntersecting && !isLoading) {\n        onLoadMore();\n      }\n    }, { threshold: 0.1 });\n\n    observerRef.current = observer;\n\n    return () => observer.disconnect();\n  }, [onLoadMore, isLoading]);\n\n  useEffect(() => {\n    const observer = observerRef.current;\n    const lastRow = lastRowRef.current;\n\n    if (observer && lastRow) {\n      observer.disconnect();\n      observer.observe(lastRow);\n    }\n\n    return () => {\n      if (observer && lastRow) {\n        observer.unobserve(lastRow);\n      }\n    };\n  }, [isLoading]);\n\n  const getLoader = (loaderRow: number, columns: ApsaraColumnDef<TData>[]) => (\n    [...new Array(loaderRow)].map((_, rowIndex) => (\n      <Table.Row key={`row_${rowIndex}`}>\n        {columns.map((_, colIndex) => (\n          <Table.Cell key={`col_${colIndex}`}>\n            <Skeleton\n              containerClassName={styles.flex1}\n              highlightColor=\"var(--background-base)\"\n              baseColor=\"var(--background-base-hover)\"\n            />\n          </Table.Cell>\n        ))}\n      </Table.Row>\n    ))\n  );\n\n  const tableData = onLoadMore ? data : (isLoading\n    ? [...new Array(loaderRow)].map((_, i) => ({ id: i } as TData))\n    : data);\n\n  const { filteredColumns, addFilterColumn, removeFilterColumn, resetColumns } =\n    useTableColumn();\n\n  const columnWithCustomFilter = useMemo(\n    () =>\n      columns.map((col) => {\n        const colId = col.id || (col?.accessorKey as string);\n        const filterFn =\n          colId && tableCustomFilter.hasOwnProperty(colId)\n            ? tableCustomFilter[colId]\n            : undefined;\n\n        const cell = onLoadMore\n          ? col.cell\n          : (isLoading\n              ? () => (\n                  <Skeleton\n                    containerClassName={styles.flex1}\n                    highlightColor=\"var(--background-base)\"\n                    baseColor=\"var(--background-base-hover)\"\n                  />\n                )\n              : col.cell);\n\n        return {\n          ...col,\n          cell,\n          filterFn,\n        };\n      }),\n    [isLoading, columns, tableCustomFilter, onLoadMore]\n  );\n\n  useEffect(() => {\n    if (onStateChange) {\n      onStateChange(tableState);\n    }\n  }, [tableState]);\n\n  const updateColumnCustomFilter: updateColumnFilter = (id, filterFn) => {\n    setTableCustomFilter((old) => ({ ...old, [id]: filterFn }));\n  };\n\n  const table = useReactTable({\n    data: tableData,\n    columns: columnWithCustomFilter as unknown as ColumnDef<TData, TValue>[],\n    globalFilterFn: \"auto\",\n    enableRowSelection: true,\n    manualPagination: true,\n    pageCount: -1,\n    onStateChange: (updater) => setTableState(updater as Partial<TableState>),\n    getCoreRowModel: getCoreRowModel(),\n    getFilteredRowModel: getFilteredRowModel(),\n    getPaginationRowModel: getPaginationRowModel(),\n    getSortedRowModel: getSortedRowModel(),\n    getFacetedRowModel: getFacetedRowModel(),\n    getFacetedUniqueValues: getFacetedUniqueValues(),\n    initialState,\n    state: tableState,\n  });\n\n  const tableStyle = {\n    ...(table.getRowModel().rows?.length\n      ? { width: \"100%\" }\n      : { width: \"100%\", height: \"100%\" }),\n    ...{ \"border-collapse\": \"collapse\" },\n  };\n\n  return (\n    <Flex direction=\"column\" justify=\"between\" className={styles.wrapper}>\n      <TableContext.Provider\n        value={{\n          table,\n          globalFilter: tableState.globalFilter,\n          filteredColumns,\n          addFilterColumn,\n          removeFilterColumn,\n          resetColumns,\n          onGlobalFilterChange: (value) =>\n            setTableState((prev) => ({ ...prev, globalFilter: value })),\n          onChange: () => ({}),\n          tableCustomFilter,\n          updateColumnCustomFilter,\n          isLoading,\n        }}\n      >\n        <Flex direction=\"column\" className={styles.datatable}>\n          {header}\n          <Flex\n            className={styles.tableContainer}\n            style={parentStyle}\n          >\n            <Table {...props} style={tableStyle}>\n              <Table.Header className={styles.header}>\n                {ShouldShowHeader\n                  ? table.getHeaderGroups().map((headerGroup) => (\n                      <Table.Row key={headerGroup.id}>\n                        {headerGroup.headers.map((header, index) => {\n                          return (\n                            <Table.Head\n                              key={`${header.id}_${index}`}\n                              style={{\n                                cursor: \"pointer\",\n                                ...(header.column.columnDef?.meta?.style ?? {}),\n                              }}\n                              onClick={header.column.getToggleSortingHandler()}\n                            >\n                              <Text className={styles.head}>\n                                {header.isPlaceholder\n                                  ? null\n                                  : flexRender(\n                                      header.column.columnDef.header,\n                                      header.getContext()\n                                    )}\n                                {header.column.getCanSort()\n                                  ? {\n                                      asc: <CaretUpIcon />,\n                                      desc: <CaretDownIcon />,\n                                    }[\n                                      header.column.getIsSorted() as string\n                                    ] ?? <CaretSortIcon />\n                                  : null}\n                              </Text>\n                            </Table.Head>\n                          );\n                        })}\n                      </Table.Row>\n                    ))\n                  : null}\n              </Table.Header>\n              <Table.Body>\n                {table.getRowModel().rows?.length ? (\n                  table.getRowModel().rows.map((row, rowIndex) => (\n                    <Table.Row\n                      key={row.id}\n                      data-state={row.getIsSelected() && \"selected\"}\n                      onClick={() => onRowClick?.(row.original)}\n                      className={\n                        isLoading\n                          ? \"\"\n                          : `${styles.tRow} ${\n                              onRowClick ? styles.tRowClick : \"\"\n                            }`\n                      }\n                      ref={\n                        onLoadMore && rowIndex === table.getRowModel().rows.length - 1\n                          ? lastRowRef\n                          : null\n                      }\n                    >\n                      {row.getVisibleCells().map((cell, index) => (\n                        <Table.Cell\n                          key={`${cell.id}_${index}`}\n                          style={{\n                            ...(cell.column.columnDef?.meta?.style ?? {}),\n                          }}\n                        >\n                          {flexRender(\n                            cell.column.columnDef.cell,\n                            cell.getContext()\n                          )}\n                        </Table.Cell>\n                      ))}\n                    </Table.Row>\n                  ))\n                ) : (\n                  !isLoading ?\n                  <Table.Row>\n                    <Table.Cell colSpan={columns.length}>\n                      {emptyState || \"No results.\"}\n                    </Table.Cell>\n                  </Table.Row> : <></>\n                )}\n                {isLoading && onLoadMore && getLoader(loaderRow, columns)}\n              </Table.Body>\n            </Table>\n            {detail}\n          </Flex>\n        </Flex>\n        {footer}\n      </TableContext.Provider>\n    </Flex>\n  );\n}\n\nexport const DataTable = Object.assign(DataTableRoot, {\n  Toolbar: DataTableToolbar,\n  GloabalSearch: DataTableGloabalSearch,\n  FilterOptions: DataTableFilterOptions,\n  ViewOptions: DataTableViewOptions,\n  ClearFilter: DataTableClearFilter,\n  FilterChips: DataTableFilterChips,\n  Footer: DataTableFooter,\n  DetailContainer: TableDetailContainer,\n});\n"],"names":["useState","Children","DataTableToolbar","DataTableFooter","TableDetailContainer","useRef","useEffect","_jsx","Table","Skeleton","styles","useTableColumn","useMemo","table","useReactTable","getCoreRowModel","getFilteredRowModel","getPaginationRowModel","getSortedRowModel","getFacetedRowModel","getFacetedUniqueValues","Flex","_jsxs","TableContext","Text","flexRender","CaretUpIcon","CaretDownIcon","CaretSortIcon","DataTableGloabalSearch","DataTableFilterOptions","DataTableViewOptions","DataTableClearFilter","DataTableFilterChips"],"mappings":"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"}

package/dist/table/datatable.js

@@ -0,0 +1,155 @@
+import { j as jsxRuntimeExports } from '../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js';
+import { CaretUpIcon, CaretDownIcon, CaretSortIcon } from '../node_modules/.pnpm/@radix-ui_react-icons@1.3.0_react@18.2.0/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js';
+import { useReactTable, flexRender } from '../node_modules/.pnpm/@tanstack_react-table@8.9.2_react-dom@18.3.1_react@18.2.0__react@18.2.0/node_modules/@tanstack/react-table/build/lib/index.js';
+import { useState, Children, useRef, useEffect, useMemo } from 'react';
+import { Flex } from '../flex/flex.js';
+import { Text } from '../text/text.js';
+import { DataTableClearFilter } from './DataTableClearFilter.js';
+import { DataTableFilterChips } from './DataTableFilterChips.js';
+import { DataTableFilterOptions } from './DataTableFilterOptions.js';
+import { DataTableFooter } from './DataTableFooter.js';
+import { DataTableGloabalSearch } from './DataTableGloabalSearch.js';
+import { DataTableToolbar } from './DataTableToolbar.js';
+import { DataTableViewOptions } from './DataTableViewOptions.js';
+import { TableContext } from './TableContext.js';
+import { TableDetailContainer } from './TableDetailContainer.js';
+import styles from './datatable.module.css.js';
+import { useTableColumn } from './hooks/useTableColumn.js';
+import { Table } from './table.js';
+import Skeleton from '../node_modules/.pnpm/react-loading-skeleton@3.4.0_react@18.2.0/node_modules/react-loading-skeleton/dist/index.js';
+import { getCoreRowModel, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, getFacetedRowModel, getFacetedUniqueValues } from '../node_modules/.pnpm/@tanstack_table-core@8.9.2/node_modules/@tanstack/table-core/build/lib/index.js';
+
+function DataTableRoot({ columns, data, emptyState, children, parentStyle, isLoading = false, ShouldShowHeader = true, initialState, loaderRow = 2, onRowClick, onStateChange = () => { }, onLoadMore, ...props }) {
+    const [tableCustomFilter, setTableCustomFilter] = useState({});
+    const convertedChildren = Children.toArray(children);
+    const header = convertedChildren.find((child) => child.type === DataTableToolbar) || null;
+    const footer = convertedChildren.find((child) => child.type === DataTableFooter) || null;
+    const detail = convertedChildren.find((child) => child.type === TableDetailContainer) ||
+        null;
+    const [tableState, setTableState] = useState({});
+    const observerRef = useRef(null);
+    const lastRowRef = useRef(null);
+    useEffect(() => {
+        if (!onLoadMore)
+            return;
+        const observer = new IntersectionObserver((entries) => {
+            if (entries[0].isIntersecting && !isLoading) {
+                onLoadMore();
+            }
+        }, { threshold: 0.1 });
+        observerRef.current = observer;
+        return () => observer.disconnect();
+    }, [onLoadMore, isLoading]);
+    useEffect(() => {
+        const observer = observerRef.current;
+        const lastRow = lastRowRef.current;
+        if (observer && lastRow) {
+            observer.disconnect();
+            observer.observe(lastRow);
+        }
+        return () => {
+            if (observer && lastRow) {
+                observer.unobserve(lastRow);
+            }
+        };
+    }, [isLoading]);
+    const getLoader = (loaderRow, columns) => ([...new Array(loaderRow)].map((_, rowIndex) => (jsxRuntimeExports.jsx(Table.Row, { children: columns.map((_, colIndex) => (jsxRuntimeExports.jsx(Table.Cell, { children: jsxRuntimeExports.jsx(Skeleton, { containerClassName: styles.flex1, highlightColor: "var(--background-base)", baseColor: "var(--background-base-hover)" }) }, `col_${colIndex}`))) }, `row_${rowIndex}`))));
+    const tableData = onLoadMore ? data : (isLoading
+        ? [...new Array(loaderRow)].map((_, i) => ({ id: i }))
+        : data);
+    const { filteredColumns, addFilterColumn, removeFilterColumn, resetColumns } = useTableColumn();
+    const columnWithCustomFilter = useMemo(() => columns.map((col) => {
+        const colId = col.id || col?.accessorKey;
+        const filterFn = colId && tableCustomFilter.hasOwnProperty(colId)
+            ? tableCustomFilter[colId]
+            : undefined;
+        const cell = onLoadMore
+            ? col.cell
+            : (isLoading
+                ? () => (jsxRuntimeExports.jsx(Skeleton, { containerClassName: styles.flex1, highlightColor: "var(--background-base)", baseColor: "var(--background-base-hover)" }))
+                : col.cell);
+        return {
+            ...col,
+            cell,
+            filterFn,
+        };
+    }), [isLoading, columns, tableCustomFilter, onLoadMore]);
+    useEffect(() => {
+        if (onStateChange) {
+            onStateChange(tableState);
+        }
+    }, [tableState]);
+    const updateColumnCustomFilter = (id, filterFn) => {
+        setTableCustomFilter((old) => ({ ...old, [id]: filterFn }));
+    };
+    const table = useReactTable({
+        data: tableData,
+        columns: columnWithCustomFilter,
+        globalFilterFn: "auto",
+        enableRowSelection: true,
+        manualPagination: true,
+        pageCount: -1,
+        onStateChange: (updater) => setTableState(updater),
+        getCoreRowModel: getCoreRowModel(),
+        getFilteredRowModel: getFilteredRowModel(),
+        getPaginationRowModel: getPaginationRowModel(),
+        getSortedRowModel: getSortedRowModel(),
+        getFacetedRowModel: getFacetedRowModel(),
+        getFacetedUniqueValues: getFacetedUniqueValues(),
+        initialState,
+        state: tableState,
+    });
+    const tableStyle = {
+        ...(table.getRowModel().rows?.length
+            ? { width: "100%" }
+            : { width: "100%", height: "100%" }),
+        ...{ "border-collapse": "collapse" },
+    };
+    return (jsxRuntimeExports.jsx(Flex, { direction: "column", justify: "between", className: styles.wrapper, children: jsxRuntimeExports.jsxs(TableContext.Provider, { value: {
+                table,
+                globalFilter: tableState.globalFilter,
+                filteredColumns,
+                addFilterColumn,
+                removeFilterColumn,
+                resetColumns,
+                onGlobalFilterChange: (value) => setTableState((prev) => ({ ...prev, globalFilter: value })),
+                onChange: () => ({}),
+                tableCustomFilter,
+                updateColumnCustomFilter,
+                isLoading,
+            }, children: [jsxRuntimeExports.jsxs(Flex, { direction: "column", className: styles.datatable, children: [header, jsxRuntimeExports.jsxs(Flex, { className: styles.tableContainer, style: parentStyle, children: [jsxRuntimeExports.jsxs(Table, { ...props, style: tableStyle, children: [jsxRuntimeExports.jsx(Table.Header, { className: styles.header, children: ShouldShowHeader
+                                                ? table.getHeaderGroups().map((headerGroup) => (jsxRuntimeExports.jsx(Table.Row, { children: headerGroup.headers.map((header, index) => {
+                                                        return (jsxRuntimeExports.jsx(Table.Head, { style: {
+                                                                cursor: "pointer",
+                                                                ...(header.column.columnDef?.meta?.style ?? {}),
+                                                            }, onClick: header.column.getToggleSortingHandler(), children: jsxRuntimeExports.jsxs(Text, { className: styles.head, children: [header.isPlaceholder
+                                                                        ? null
+                                                                        : flexRender(header.column.columnDef.header, header.getContext()), header.column.getCanSort()
+                                                                        ? {
+                                                                            asc: jsxRuntimeExports.jsx(CaretUpIcon, {}),
+                                                                            desc: jsxRuntimeExports.jsx(CaretDownIcon, {}),
+                                                                        }[header.column.getIsSorted()] ?? jsxRuntimeExports.jsx(CaretSortIcon, {})
+                                                                        : null] }) }, `${header.id}_${index}`));
+                                                    }) }, headerGroup.id)))
+                                                : null }), jsxRuntimeExports.jsxs(Table.Body, { children: [table.getRowModel().rows?.length ? (table.getRowModel().rows.map((row, rowIndex) => (jsxRuntimeExports.jsx(Table.Row, { "data-state": row.getIsSelected() && "selected", onClick: () => onRowClick?.(row.original), className: isLoading
+                                                        ? ""
+                                                        : `${styles.tRow} ${onRowClick ? styles.tRowClick : ""}`, ref: onLoadMore && rowIndex === table.getRowModel().rows.length - 1
+                                                        ? lastRowRef
+                                                        : null, children: row.getVisibleCells().map((cell, index) => (jsxRuntimeExports.jsx(Table.Cell, { style: {
+                                                            ...(cell.column.columnDef?.meta?.style ?? {}),
+                                                        }, children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, `${cell.id}_${index}`))) }, row.id)))) : (!isLoading ?
+                                                    jsxRuntimeExports.jsx(Table.Row, { children: jsxRuntimeExports.jsx(Table.Cell, { colSpan: columns.length, children: emptyState || "No results." }) }) : jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {})), isLoading && onLoadMore && getLoader(loaderRow, columns)] })] }), detail] })] }), footer] }) }));
+}
+const DataTable = Object.assign(DataTableRoot, {
+    Toolbar: DataTableToolbar,
+    GloabalSearch: DataTableGloabalSearch,
+    FilterOptions: DataTableFilterOptions,
+    ViewOptions: DataTableViewOptions,
+    ClearFilter: DataTableClearFilter,
+    FilterChips: DataTableFilterChips,
+    Footer: DataTableFooter,
+    DetailContainer: TableDetailContainer,
+});
+
+export { DataTable };
+//# sourceMappingURL=datatable.js.map

package/dist/table/datatable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datatable.js","sources":["../../table/datatable.tsx"],"sourcesContent":["import {\n  CaretUpIcon,\n  CaretDownIcon,\n  CaretSortIcon,\n} from \"@radix-ui/react-icons\";\nimport {\n  ColumnDef,\n  InitialTableState,\n  TableState,\n  flexRender,\n  getCoreRowModel,\n  getFacetedRowModel,\n  getFacetedUniqueValues,\n  getFilteredRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable,\n} from \"@tanstack/react-table\";\nimport {\n  CSSProperties,\n  Children,\n  ComponentProps,\n  ReactElement,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n  useRef,\n} from \"react\";\nimport { Flex } from \"~/flex\";\nimport { Text } from \"~/text\";\nimport { DataTableClearFilter } from \"./DataTableClearFilter\";\nimport { DataTableFilterChips } from \"./DataTableFilterChips\";\nimport { DataTableFilterOptions } from \"./DataTableFilterOptions\";\nimport { DataTableFooter } from \"./DataTableFooter\";\nimport { DataTableGloabalSearch } from \"./DataTableGloabalSearch\";\nimport { DataTableToolbar } from \"./DataTableToolbar\";\nimport { DataTableViewOptions } from \"./DataTableViewOptions\";\nimport { TableContext } from \"./TableContext\";\nimport { TableDetailContainer } from \"./TableDetailContainer\";\nimport styles from \"./datatable.module.css\";\nimport { useTableColumn } from \"./hooks/useTableColumn\";\nimport { Table } from \"./table\";\nimport {\n  ApsaraColumnDef,\n  tableFilterMap,\n  updateColumnFilter,\n} from \"./datatables.types\";\nimport Skeleton from \"react-loading-skeleton\";\n\ntype DataTableProps<TData, TValue> = {\n  columns: ApsaraColumnDef<TData>[];\n  data: TData[];\n  multiRowSelectionEnabled?: boolean;\n  children?: ReactNode;\n  ShouldShowHeader?: boolean;\n  emptyState?: ReactNode;\n  parentStyle?: CSSProperties;\n  isLoading?: boolean;\n  initialState?: Partial<InitialTableState>;\n  loaderRow?: number;\n  onRowClick?: (d: TData) => void;\n  onStateChange?: (d: Partial<TableState>) => void;\n  onLoadMore?: () => void;\n} & ComponentProps<typeof Table>;\n\nfunction DataTableRoot<TData, TValue>({\n  columns,\n  data,\n  emptyState,\n  children,\n  parentStyle,\n  isLoading = false,\n  ShouldShowHeader = true,\n  initialState,\n  loaderRow = 2,\n  onRowClick,\n  onStateChange = () => {},\n  onLoadMore,\n  ...props\n}: DataTableProps<TData, TValue>) {\n  const [tableCustomFilter, setTableCustomFilter] = useState<tableFilterMap>(\n    {}\n  );\n  const convertedChildren = Children.toArray(children) as ReactElement[];\n  const header =\n    convertedChildren.find((child) => child.type === DataTableToolbar) || null;\n  const footer =\n    convertedChildren.find((child) => child.type === DataTableFooter) || null;\n  const detail =\n    convertedChildren.find((child) => child.type === TableDetailContainer) ||\n    null;\n\n  const [tableState, setTableState] = useState<Partial<TableState>>({});\n  const observerRef = useRef<IntersectionObserver | null>(null);\n  const lastRowRef = useRef<HTMLTableRowElement | null>(null);\n\n  useEffect(() => {\n    if (!onLoadMore) return;\n\n    const observer = new IntersectionObserver((entries) => {\n      if (entries[0].isIntersecting && !isLoading) {\n        onLoadMore();\n      }\n    }, { threshold: 0.1 });\n\n    observerRef.current = observer;\n\n    return () => observer.disconnect();\n  }, [onLoadMore, isLoading]);\n\n  useEffect(() => {\n    const observer = observerRef.current;\n    const lastRow = lastRowRef.current;\n\n    if (observer && lastRow) {\n      observer.disconnect();\n      observer.observe(lastRow);\n    }\n\n    return () => {\n      if (observer && lastRow) {\n        observer.unobserve(lastRow);\n      }\n    };\n  }, [isLoading]);\n\n  const getLoader = (loaderRow: number, columns: ApsaraColumnDef<TData>[]) => (\n    [...new Array(loaderRow)].map((_, rowIndex) => (\n      <Table.Row key={`row_${rowIndex}`}>\n        {columns.map((_, colIndex) => (\n          <Table.Cell key={`col_${colIndex}`}>\n            <Skeleton\n              containerClassName={styles.flex1}\n              highlightColor=\"var(--background-base)\"\n              baseColor=\"var(--background-base-hover)\"\n            />\n          </Table.Cell>\n        ))}\n      </Table.Row>\n    ))\n  );\n\n  const tableData = onLoadMore ? data : (isLoading\n    ? [...new Array(loaderRow)].map((_, i) => ({ id: i } as TData))\n    : data);\n\n  const { filteredColumns, addFilterColumn, removeFilterColumn, resetColumns } =\n    useTableColumn();\n\n  const columnWithCustomFilter = useMemo(\n    () =>\n      columns.map((col) => {\n        const colId = col.id || (col?.accessorKey as string);\n        const filterFn =\n          colId && tableCustomFilter.hasOwnProperty(colId)\n            ? tableCustomFilter[colId]\n            : undefined;\n\n        const cell = onLoadMore\n          ? col.cell\n          : (isLoading\n              ? () => (\n                  <Skeleton\n                    containerClassName={styles.flex1}\n                    highlightColor=\"var(--background-base)\"\n                    baseColor=\"var(--background-base-hover)\"\n                  />\n                )\n              : col.cell);\n\n        return {\n          ...col,\n          cell,\n          filterFn,\n        };\n      }),\n    [isLoading, columns, tableCustomFilter, onLoadMore]\n  );\n\n  useEffect(() => {\n    if (onStateChange) {\n      onStateChange(tableState);\n    }\n  }, [tableState]);\n\n  const updateColumnCustomFilter: updateColumnFilter = (id, filterFn) => {\n    setTableCustomFilter((old) => ({ ...old, [id]: filterFn }));\n  };\n\n  const table = useReactTable({\n    data: tableData,\n    columns: columnWithCustomFilter as unknown as ColumnDef<TData, TValue>[],\n    globalFilterFn: \"auto\",\n    enableRowSelection: true,\n    manualPagination: true,\n    pageCount: -1,\n    onStateChange: (updater) => setTableState(updater as Partial<TableState>),\n    getCoreRowModel: getCoreRowModel(),\n    getFilteredRowModel: getFilteredRowModel(),\n    getPaginationRowModel: getPaginationRowModel(),\n    getSortedRowModel: getSortedRowModel(),\n    getFacetedRowModel: getFacetedRowModel(),\n    getFacetedUniqueValues: getFacetedUniqueValues(),\n    initialState,\n    state: tableState,\n  });\n\n  const tableStyle = {\n    ...(table.getRowModel().rows?.length\n      ? { width: \"100%\" }\n      : { width: \"100%\", height: \"100%\" }),\n    ...{ \"border-collapse\": \"collapse\" },\n  };\n\n  return (\n    <Flex direction=\"column\" justify=\"between\" className={styles.wrapper}>\n      <TableContext.Provider\n        value={{\n          table,\n          globalFilter: tableState.globalFilter,\n          filteredColumns,\n          addFilterColumn,\n          removeFilterColumn,\n          resetColumns,\n          onGlobalFilterChange: (value) =>\n            setTableState((prev) => ({ ...prev, globalFilter: value })),\n          onChange: () => ({}),\n          tableCustomFilter,\n          updateColumnCustomFilter,\n          isLoading,\n        }}\n      >\n        <Flex direction=\"column\" className={styles.datatable}>\n          {header}\n          <Flex\n            className={styles.tableContainer}\n            style={parentStyle}\n          >\n            <Table {...props} style={tableStyle}>\n              <Table.Header className={styles.header}>\n                {ShouldShowHeader\n                  ? table.getHeaderGroups().map((headerGroup) => (\n                      <Table.Row key={headerGroup.id}>\n                        {headerGroup.headers.map((header, index) => {\n                          return (\n                            <Table.Head\n                              key={`${header.id}_${index}`}\n                              style={{\n                                cursor: \"pointer\",\n                                ...(header.column.columnDef?.meta?.style ?? {}),\n                              }}\n                              onClick={header.column.getToggleSortingHandler()}\n                            >\n                              <Text className={styles.head}>\n                                {header.isPlaceholder\n                                  ? null\n                                  : flexRender(\n                                      header.column.columnDef.header,\n                                      header.getContext()\n                                    )}\n                                {header.column.getCanSort()\n                                  ? {\n                                      asc: <CaretUpIcon />,\n                                      desc: <CaretDownIcon />,\n                                    }[\n                                      header.column.getIsSorted() as string\n                                    ] ?? <CaretSortIcon />\n                                  : null}\n                              </Text>\n                            </Table.Head>\n                          );\n                        })}\n                      </Table.Row>\n                    ))\n                  : null}\n              </Table.Header>\n              <Table.Body>\n                {table.getRowModel().rows?.length ? (\n                  table.getRowModel().rows.map((row, rowIndex) => (\n                    <Table.Row\n                      key={row.id}\n                      data-state={row.getIsSelected() && \"selected\"}\n                      onClick={() => onRowClick?.(row.original)}\n                      className={\n                        isLoading\n                          ? \"\"\n                          : `${styles.tRow} ${\n                              onRowClick ? styles.tRowClick : \"\"\n                            }`\n                      }\n                      ref={\n                        onLoadMore && rowIndex === table.getRowModel().rows.length - 1\n                          ? lastRowRef\n                          : null\n                      }\n                    >\n                      {row.getVisibleCells().map((cell, index) => (\n                        <Table.Cell\n                          key={`${cell.id}_${index}`}\n                          style={{\n                            ...(cell.column.columnDef?.meta?.style ?? {}),\n                          }}\n                        >\n                          {flexRender(\n                            cell.column.columnDef.cell,\n                            cell.getContext()\n                          )}\n                        </Table.Cell>\n                      ))}\n                    </Table.Row>\n                  ))\n                ) : (\n                  !isLoading ?\n                  <Table.Row>\n                    <Table.Cell colSpan={columns.length}>\n                      {emptyState || \"No results.\"}\n                    </Table.Cell>\n                  </Table.Row> : <></>\n                )}\n                {isLoading && onLoadMore && getLoader(loaderRow, columns)}\n              </Table.Body>\n            </Table>\n            {detail}\n          </Flex>\n        </Flex>\n        {footer}\n      </TableContext.Provider>\n    </Flex>\n  );\n}\n\nexport const DataTable = Object.assign(DataTableRoot, {\n  Toolbar: DataTableToolbar,\n  GloabalSearch: DataTableGloabalSearch,\n  FilterOptions: DataTableFilterOptions,\n  ViewOptions: DataTableViewOptions,\n  ClearFilter: DataTableClearFilter,\n  FilterChips: DataTableFilterChips,\n  Footer: DataTableFooter,\n  DetailContainer: TableDetailContainer,\n});\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/table/datatable.module.css.cjs

@@ -0,0 +1,8 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles = {"wrapper":"datatable-module_wrapper__Sxg2d","datatable":"datatable-module_datatable__z-Th2","table":"datatable-module_table__x2IkY","head":"datatable-module_head__zCfCW","header":"datatable-module_header__7-CAd","toolbar":"datatable-module_toolbar__lO-aI","chip":"datatable-module_chip__IiwTD","chipWrapper":"datatable-module_chipWrapper__iz69x","filterOperator":"datatable-module_filterOperator__qtDsH","filterText":"datatable-module_filterText__w00L8","flex1":"datatable-module_flex1__fA-kQ","tRow":"datatable-module_tRow__GrMHh","tRowClick":"datatable-module_tRowClick__7wzkh"};
+
+exports.default = styles;
+//# sourceMappingURL=datatable.module.css.cjs.map

package/dist/table/datatable.module.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"datatable.module.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/table/datatable.module.css.js

@@ -0,0 +1,4 @@
+var styles = {"wrapper":"datatable-module_wrapper__Sxg2d","datatable":"datatable-module_datatable__z-Th2","table":"datatable-module_table__x2IkY","head":"datatable-module_head__zCfCW","header":"datatable-module_header__7-CAd","toolbar":"datatable-module_toolbar__lO-aI","chip":"datatable-module_chip__IiwTD","chipWrapper":"datatable-module_chipWrapper__iz69x","filterOperator":"datatable-module_filterOperator__qtDsH","filterText":"datatable-module_filterText__w00L8","flex1":"datatable-module_flex1__fA-kQ","tRow":"datatable-module_tRow__GrMHh","tRowClick":"datatable-module_tRowClick__7wzkh"};
+
+export { styles as default };
+//# sourceMappingURL=datatable.module.css.js.map

package/dist/table/datatable.module.css.js.map

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

package/dist/table/datatables.types.cjs

@@ -0,0 +1,18 @@
+'use strict';
+
+const columnTypesMap = {
+    select: "select",
+    number: "number",
+    text: "text",
+    date: "date",
+};
+const filterValueTypeMap = {
+    select: "select",
+    text: "text",
+    datePicker: "datePicker",
+    rangePicker: "rangePicker",
+};
+
+exports.columnTypesMap = columnTypesMap;
+exports.filterValueTypeMap = filterValueTypeMap;
+//# sourceMappingURL=datatables.types.cjs.map

package/dist/table/datatables.types.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"datatables.types.cjs","sources":["../../table/datatables.types.tsx"],"sourcesContent":["import {\n  AccessorFn,\n  AggregationFn,\n  ColumnDef,\n  DeepKeys,\n  FilterFn,\n} from \"@tanstack/table-core\";\nimport type { ApsaraAggregationFns } from \"./helpers/aggregationFns\";\nimport type { ApsaraFilterFns } from \"./helpers/filterFns\";\nimport { DateRange } from \"react-day-picker\";\n\ntype LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);\n\nexport type ApsaraFilterOption = LiteralUnion<\n  string & keyof typeof ApsaraFilterFns\n>;\nexport type ApsaraFilterFn<TData> = FilterFn<TData> | ApsaraFilterOption;\n\nexport type ApsaraAggregationOption = string &\n  keyof typeof ApsaraAggregationFns;\nexport type ApsaraAggregationFn<TData> =\n  | AggregationFn<TData>\n  | ApsaraAggregationOption;\n\nexport const columnTypesMap = {\n  select: \"select\",\n  number: \"number\",\n  text: \"text\",\n  date: \"date\",\n} as const;\n\nexport type columnTypes = keyof typeof columnTypesMap;\n\nexport const filterValueTypeMap = {\n  select: \"select\",\n  text: \"text\",\n  datePicker: \"datePicker\",\n  rangePicker: \"rangePicker\",\n} as const;\n\nexport type filterValueType = keyof typeof filterValueTypeMap;\n\nexport type tableFilterMap = Record<string, FilterFn<any>>;\n\nexport type updateColumnFilter = (id: string, fn: FilterFn<any>) => void;\n\nexport interface FilterValue {\n  value?: string | number;\n  values?: Array<string | number>;\n  date?: Date;\n  dateRange?: DateRange;\n}\n\nexport type ApsaraColumnDef<TData> = Omit<\n  ColumnDef<TData, any>,\n  | \"accessorKey\"\n  | \"aggregatedCell\"\n  | \"aggregationFn\"\n  | \"columns\"\n  | \"filterFn\"\n  | \"id\"\n  | \"columnDefType\"\n  | \"sortingFn\"\n  | \"filterVariant\"\n> & {\n  id?: LiteralUnion<string & keyof TData>;\n  accessorKey?: DeepKeys<TData>;\n  accessorFn?: AccessorFn<TData, any>;\n  aggregationFn?:\n    | ApsaraAggregationFn<TData>\n    | Array<ApsaraAggregationFn<TData>>;\n  filterFn?: ApsaraFilterFn<TData>;\n  filterVariant?: columnTypes;\n  columnDefType?: \"data\" | \"display\" | \"group\";\n  columns?: ApsaraColumnDef<TData>[];\n};\n"],"names":[],"mappings":";;AAwBa,MAAA,cAAc,GAAG;AAC5B,IAAA,MAAM,EAAE,QAAQ;AAChB,IAAA,MAAM,EAAE,QAAQ;AAChB,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,IAAI,EAAE,MAAM;EACH;AAIE,MAAA,kBAAkB,GAAG;AAChC,IAAA,MAAM,EAAE,QAAQ;AAChB,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,UAAU,EAAE,YAAY;AACxB,IAAA,WAAW,EAAE,aAAa;;;;;;"}

package/dist/table/datatables.types.js

@@ -0,0 +1,15 @@
+const columnTypesMap = {
+    select: "select",
+    number: "number",
+    text: "text",
+    date: "date",
+};
+const filterValueTypeMap = {
+    select: "select",
+    text: "text",
+    datePicker: "datePicker",
+    rangePicker: "rangePicker",
+};
+
+export { columnTypesMap, filterValueTypeMap };
+//# sourceMappingURL=datatables.types.js.map

package/dist/table/datatables.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datatables.types.js","sources":["../../table/datatables.types.tsx"],"sourcesContent":["import {\n  AccessorFn,\n  AggregationFn,\n  ColumnDef,\n  DeepKeys,\n  FilterFn,\n} from \"@tanstack/table-core\";\nimport type { ApsaraAggregationFns } from \"./helpers/aggregationFns\";\nimport type { ApsaraFilterFns } from \"./helpers/filterFns\";\nimport { DateRange } from \"react-day-picker\";\n\ntype LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);\n\nexport type ApsaraFilterOption = LiteralUnion<\n  string & keyof typeof ApsaraFilterFns\n>;\nexport type ApsaraFilterFn<TData> = FilterFn<TData> | ApsaraFilterOption;\n\nexport type ApsaraAggregationOption = string &\n  keyof typeof ApsaraAggregationFns;\nexport type ApsaraAggregationFn<TData> =\n  | AggregationFn<TData>\n  | ApsaraAggregationOption;\n\nexport const columnTypesMap = {\n  select: \"select\",\n  number: \"number\",\n  text: \"text\",\n  date: \"date\",\n} as const;\n\nexport type columnTypes = keyof typeof columnTypesMap;\n\nexport const filterValueTypeMap = {\n  select: \"select\",\n  text: \"text\",\n  datePicker: \"datePicker\",\n  rangePicker: \"rangePicker\",\n} as const;\n\nexport type filterValueType = keyof typeof filterValueTypeMap;\n\nexport type tableFilterMap = Record<string, FilterFn<any>>;\n\nexport type updateColumnFilter = (id: string, fn: FilterFn<any>) => void;\n\nexport interface FilterValue {\n  value?: string | number;\n  values?: Array<string | number>;\n  date?: Date;\n  dateRange?: DateRange;\n}\n\nexport type ApsaraColumnDef<TData> = Omit<\n  ColumnDef<TData, any>,\n  | \"accessorKey\"\n  | \"aggregatedCell\"\n  | \"aggregationFn\"\n  | \"columns\"\n  | \"filterFn\"\n  | \"id\"\n  | \"columnDefType\"\n  | \"sortingFn\"\n  | \"filterVariant\"\n> & {\n  id?: LiteralUnion<string & keyof TData>;\n  accessorKey?: DeepKeys<TData>;\n  accessorFn?: AccessorFn<TData, any>;\n  aggregationFn?:\n    | ApsaraAggregationFn<TData>\n    | Array<ApsaraAggregationFn<TData>>;\n  filterFn?: ApsaraFilterFn<TData>;\n  filterVariant?: columnTypes;\n  columnDefType?: \"data\" | \"display\" | \"group\";\n  columns?: ApsaraColumnDef<TData>[];\n};\n"],"names":[],"mappings":"AAwBa,MAAA,cAAc,GAAG;AAC5B,IAAA,MAAM,EAAE,QAAQ;AAChB,IAAA,MAAM,EAAE,QAAQ;AAChB,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,IAAI,EAAE,MAAM;EACH;AAIE,MAAA,kBAAkB,GAAG;AAChC,IAAA,MAAM,EAAE,QAAQ;AAChB,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,UAAU,EAAE,YAAY;AACxB,IAAA,WAAW,EAAE,aAAa;;;;;"}