@lobehub/ui 5.51.1 → 5.52.0

package/es/base-ui/Steps/type.d.mts

@@ -0,0 +1,32 @@
+import { CSSProperties, ComponentProps, Key, ReactNode, Ref } from "react";
+//#region src/base-ui/Steps/type.d.ts
+type StepStatus = 'wait' | 'process' | 'finish' | 'error';
+interface StepItem {
+  description?: ReactNode;
+  icon?: ReactNode;
+  key?: Key;
+  status?: StepStatus;
+  title?: ReactNode;
+}
+interface StepsProps extends Omit<ComponentProps<'ol'>, 'children'> {
+  classNames?: {
+    description?: string;
+    indicator?: string;
+    item?: string;
+    title?: string;
+  };
+  current?: number;
+  items: StepItem[];
+  orientation?: 'horizontal' | 'vertical';
+  ref?: Ref<HTMLOListElement>;
+  styles?: {
+    description?: CSSProperties;
+    indicator?: CSSProperties;
+    item?: CSSProperties;
+    title?: CSSProperties;
+  };
+  variant?: 'default' | 'dot';
+}
+//#endregion
+export { StepItem, StepStatus, StepsProps };
+//# sourceMappingURL=type.d.mts.map

package/es/base-ui/Table/FilterMenu.mjs

@@ -0,0 +1,45 @@
+"use client";
+import Icon from "../../Icon/Icon.mjs";
+import DropdownMenu from "../DropdownMenu/DropdownMenu.mjs";
+import { styles } from "./style.mjs";
+import { memo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { ListFilter } from "lucide-react";
+//#region src/base-ui/Table/FilterMenu.tsx
+const FilterMenu = memo(({ filters, label, onChange, value }) => {
+	const items = [
+		...filters.map((filter) => ({
+			checked: value.includes(filter.value),
+			closeOnClick: false,
+			key: String(filter.value),
+			label: filter.text,
+			onCheckedChange: (checked) => onChange(checked ? [...value, filter.value] : value.filter((item) => item !== filter.value)),
+			type: "checkbox"
+		})),
+		{ type: "divider" },
+		{
+			disabled: value.length === 0,
+			key: "__reset",
+			label: "Reset",
+			onClick: () => onChange([])
+		}
+	];
+	return /* @__PURE__ */ jsx(DropdownMenu, {
+		items,
+		children: /* @__PURE__ */ jsx("button", {
+			"aria-label": `Filter ${label}`,
+			className: cx(styles.filterButton, value.length > 0 && styles.filterActive),
+			type: "button",
+			children: /* @__PURE__ */ jsx(Icon, {
+				icon: ListFilter,
+				size: 12
+			})
+		})
+	});
+});
+FilterMenu.displayName = "TableFilterMenu";
+//#endregion
+export { FilterMenu as default };
+
+//# sourceMappingURL=FilterMenu.mjs.map

package/es/base-ui/Table/FilterMenu.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterMenu.mjs","names":[],"sources":["../../../src/base-ui/Table/FilterMenu.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { ListFilter } from 'lucide-react';\nimport { memo, type ReactNode } from 'react';\n\nimport DropdownMenu from '@/base-ui/DropdownMenu';\nimport type { DropdownItem } from '@/base-ui/DropdownMenu/type';\nimport Icon from '@/Icon';\n\nimport { styles } from './style';\nimport type { FilterValue } from './type';\n\ninterface FilterMenuProps {\n  filters: { text: ReactNode; value: FilterValue }[];\n  label: string;\n  onChange: (next: FilterValue[]) => void;\n  value: FilterValue[];\n}\n\nconst FilterMenu = memo<FilterMenuProps>(({ filters, label, onChange, value }) => {\n  const items: DropdownItem[] = [\n    ...filters.map((filter) => ({\n      checked: value.includes(filter.value),\n      closeOnClick: false,\n      key: String(filter.value),\n      label: filter.text,\n      onCheckedChange: (checked: boolean) =>\n        onChange(\n          checked ? [...value, filter.value] : value.filter((item) => item !== filter.value),\n        ),\n      type: 'checkbox' as const,\n    })),\n    { type: 'divider' as const },\n    { disabled: value.length === 0, key: '__reset', label: 'Reset', onClick: () => onChange([]) },\n  ];\n\n  return (\n    <DropdownMenu items={items}>\n      <button\n        aria-label={`Filter ${label}`}\n        className={cx(styles.filterButton, value.length > 0 && styles.filterActive)}\n        type=\"button\"\n      >\n        <Icon icon={ListFilter} size={12} />\n      </button>\n    </DropdownMenu>\n  );\n});\n\nFilterMenu.displayName = 'TableFilterMenu';\n\nexport default FilterMenu;\n"],"mappings":";;;;;;;;;AAoBA,MAAM,aAAa,MAAuB,EAAE,SAAS,OAAO,UAAU,YAAY;CAChF,MAAM,QAAwB;EAC5B,GAAG,QAAQ,KAAK,YAAY;GAC1B,SAAS,MAAM,SAAS,OAAO,KAAK;GACpC,cAAc;GACd,KAAK,OAAO,OAAO,KAAK;GACxB,OAAO,OAAO;GACd,kBAAkB,YAChB,SACE,UAAU,CAAC,GAAG,OAAO,OAAO,KAAK,IAAI,MAAM,QAAQ,SAAS,SAAS,OAAO,KAAK,CACnF;GACF,MAAM;EACR,EAAE;EACF,EAAE,MAAM,UAAmB;EAC3B;GAAE,UAAU,MAAM,WAAW;GAAG,KAAK;GAAW,OAAO;GAAS,eAAe,SAAS,CAAC,CAAC;EAAE;CAC9F;CAEA,OACE,oBAAC,cAAD;EAAqB;EACnB,UAAA,oBAAC,UAAD;GACE,cAAY,UAAU;GACtB,WAAW,GAAG,OAAO,cAAc,MAAM,SAAS,KAAK,OAAO,YAAY;GAC1E,MAAK;GAEL,UAAA,oBAAC,MAAD;IAAM,MAAM;IAAY,MAAM;GAAK,CAAA;EAC7B,CAAA;CACI,CAAA;AAElB,CAAC;AAED,WAAW,cAAc"}

package/es/base-ui/Table/Table.d.mts

@@ -0,0 +1,10 @@
+import { TableProps } from "./type.mjs";
+import { ReactNode } from "react";
+import { RowData } from "@tanstack/react-table";
+//#region src/base-ui/Table/Table.d.ts
+declare const Table: (<T extends RowData>(props: TableProps<T>) => ReactNode) & {
+  displayName?: string;
+};
+//#endregion
+export { Table as default };
+//# sourceMappingURL=Table.d.mts.map

package/es/base-ui/Table/Table.mjs

@@ -0,0 +1,134 @@
+"use client";
+import { useEventCallback } from "../../hooks/useEventCallback.mjs";
+import Pagination from "../Pagination/Pagination.mjs";
+import Spin from "../Spin/Spin.mjs";
+import { tableFeatureSet } from "./features.mjs";
+import { styles } from "./style.mjs";
+import FilterMenu from "./FilterMenu.mjs";
+import { getFixedOffsets } from "./fixedOffsets.mjs";
+import { toColumnDefs } from "./toColumnDefs.mjs";
+import TableBody from "./TableBody.mjs";
+import TableHead from "./TableHead.mjs";
+import { useTableState } from "./useTableState.mjs";
+import { memo, useEffect, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { useTable } from "@tanstack/react-table";
+//#region src/base-ui/Table/Table.tsx
+const EMPTY_DATA = [];
+const TableInner = (props) => {
+	const { bordered = false, className, classNames, columns, dataSource = EMPTY_DATA, emptyText, loading = false, onChange, onRow, pagination, ref, renderFilter, rowClassName, rowKey, scroll, size = "middle", style, styles: customStyles, tableLayout } = props;
+	const state = useTableState({
+		columns,
+		onChange,
+		pagination
+	});
+	const columnDefs = useMemo(() => toColumnDefs(columns), [columns]);
+	const fixedOffsets = useMemo(() => getFixedOffsets(columns), [columns]);
+	const table = useTable({
+		columns: columnDefs,
+		data: dataSource,
+		enableMultiSort: false,
+		enableSortingRemoval: true,
+		features: tableFeatureSet,
+		getRowId: (record) => String(typeof rowKey === "function" ? rowKey(record) : record[rowKey]),
+		manualSorting: state.manualSorting,
+		onColumnFiltersChange: state.onColumnFiltersChange,
+		onSortingChange: state.onSortingChange,
+		state: {
+			columnFilters: state.columnFilters,
+			sorting: state.sorting
+		}
+	});
+	const allRows = table.getRowModel().rows;
+	const { page } = state;
+	const clientPaginated = pagination !== false && state.config?.total === void 0;
+	const total = state.config?.total ?? allRows.length;
+	const pageCount = Math.max(1, Math.ceil(total / page.pageSize));
+	const pageIndex = Math.min(page.pageIndex, pageCount - 1);
+	const rows = clientPaginated ? allRows.slice(pageIndex * page.pageSize, (pageIndex + 1) * page.pageSize) : allRows;
+	const syncClampedPage = useEventCallback(() => state.clampPage(pageIndex));
+	useEffect(() => {
+		if (clientPaginated && pageIndex !== page.pageIndex) syncClampedPage();
+	}, [
+		clientPaginated,
+		pageIndex,
+		page.pageIndex,
+		syncClampedPage
+	]);
+	const minWidth = scroll?.x === "max-content" ? "100%" : scroll?.x;
+	return /* @__PURE__ */ jsxs("div", {
+		className: cx(styles.root, className),
+		ref,
+		style,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: cx(styles.wrapper, bordered && styles.bordered, classNames?.wrapper),
+			"data-table-wrapper": "",
+			style: {
+				maxHeight: scroll?.y,
+				...customStyles?.wrapper
+			},
+			children: [/* @__PURE__ */ jsxs("table", {
+				className: cx(styles.table, size === "small" ? styles.small : styles.middle),
+				style: {
+					minWidth,
+					tableLayout,
+					width: scroll?.x === "max-content" ? "max-content" : "100%"
+				},
+				children: [/* @__PURE__ */ jsx(TableHead, {
+					classNames,
+					columnIds: state.columnIds,
+					columns,
+					fixedOffsets,
+					getColumn: (id) => table.getColumn(id),
+					styles: customStyles,
+					renderFilter: (column, id) => {
+						if (renderFilter) return renderFilter(column, id, table);
+						const tableColumn = table.getColumn(id);
+						const value = tableColumn?.getFilterValue() ?? [];
+						return /* @__PURE__ */ jsx(FilterMenu, {
+							filters: column.filters ?? [],
+							label: typeof column.title === "string" ? column.title : id,
+							value,
+							onChange: (next) => tableColumn?.setFilterValue(next.length > 0 ? next : void 0)
+						});
+					}
+				}), /* @__PURE__ */ jsx(TableBody, {
+					classNames,
+					columnIds: state.columnIds,
+					columns,
+					emptyText,
+					fixedOffsets,
+					loading,
+					rowClassName,
+					rows,
+					styles: customStyles,
+					onRow
+				})]
+			}), loading && rows.length > 0 && /* @__PURE__ */ jsx("div", {
+				className: styles.loading,
+				"data-table-loading": "",
+				children: /* @__PURE__ */ jsx(Spin, {})
+			})]
+		}), pagination !== false && total > 0 && /* @__PURE__ */ jsx("div", {
+			className: styles.pagination,
+			children: /* @__PURE__ */ jsx(Pagination, {
+				current: pageIndex + 1,
+				pageSize: page.pageSize,
+				pageSizeOptions: state.config?.pageSizeOptions,
+				showSizeChanger: state.config?.showSizeChanger,
+				total,
+				onChange: (next, pageSize) => state.onPaginationChange({
+					pageIndex: next - 1,
+					pageSize
+				})
+			})
+		})]
+	});
+};
+const Table = memo(TableInner);
+Table.displayName = "Table";
+//#endregion
+export { TableInner, Table as default };
+
+//# sourceMappingURL=Table.mjs.map

package/es/base-ui/Table/Table.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.mjs","names":[],"sources":["../../../src/base-ui/Table/Table.tsx"],"sourcesContent":["'use client';\n\nimport { type RowData, useTable } from '@tanstack/react-table';\nimport { cx } from 'antd-style';\nimport { type Key, memo, type ReactNode, useEffect, useMemo } from 'react';\n\nimport Pagination from '@/base-ui/Pagination';\nimport Spin from '@/base-ui/Spin';\nimport { useEventCallback } from '@/hooks/useEventCallback';\n\nimport { tableFeatureSet } from './features';\nimport FilterMenu from './FilterMenu';\nimport { getFixedOffsets } from './fixedOffsets';\nimport { styles } from './style';\nimport TableBody from './TableBody';\nimport TableHead from './TableHead';\nimport { toColumnDefs } from './toColumnDefs';\nimport type { FilterValue, TableColumn, TableProps } from './type';\nimport { useTableState } from './useTableState';\n\nconst EMPTY_DATA: any[] = [];\n\nexport interface TableInternalProps<T> extends TableProps<T> {\n  renderFilter?: (column: TableColumn<T>, id: string, table: any) => ReactNode;\n}\n\nconst TableInner = <T extends RowData>(props: TableInternalProps<T>) => {\n  const {\n    bordered = false,\n    className,\n    classNames,\n    columns,\n    dataSource = EMPTY_DATA as T[],\n    emptyText,\n    loading = false,\n    onChange,\n    onRow,\n    pagination,\n    ref,\n    renderFilter,\n    rowClassName,\n    rowKey,\n    scroll,\n    size = 'middle',\n    style,\n    styles: customStyles,\n    tableLayout,\n  } = props;\n\n  const state = useTableState({ columns, onChange, pagination });\n  const columnDefs = useMemo(() => toColumnDefs(columns), [columns]);\n  const fixedOffsets = useMemo(() => getFixedOffsets(columns), [columns]);\n\n  const table = useTable({\n    columns: columnDefs,\n    data: dataSource,\n    enableMultiSort: false,\n    enableSortingRemoval: true,\n    features: tableFeatureSet,\n    getRowId: (record: T) =>\n      String(typeof rowKey === 'function' ? rowKey(record) : (record[rowKey] as Key)),\n    manualSorting: state.manualSorting,\n    onColumnFiltersChange: state.onColumnFiltersChange,\n    onSortingChange: state.onSortingChange,\n    state: {\n      columnFilters: state.columnFilters,\n      sorting: state.sorting,\n    },\n  } as any);\n\n  const allRows = table.getRowModel().rows as unknown as { id: Key; original: T }[];\n  const { page } = state;\n  const clientPaginated = pagination !== false && state.config?.total === undefined;\n  const total = state.config?.total ?? allRows.length;\n  const pageCount = Math.max(1, Math.ceil(total / page.pageSize));\n  const pageIndex = Math.min(page.pageIndex, pageCount - 1);\n  const rows = clientPaginated\n    ? allRows.slice(pageIndex * page.pageSize, (pageIndex + 1) * page.pageSize)\n    : allRows;\n\n  const syncClampedPage = useEventCallback(() => state.clampPage(pageIndex));\n\n  useEffect(() => {\n    if (clientPaginated && pageIndex !== page.pageIndex) syncClampedPage();\n  }, [clientPaginated, pageIndex, page.pageIndex, syncClampedPage]);\n\n  const minWidth = scroll?.x === 'max-content' ? '100%' : scroll?.x;\n\n  return (\n    <div className={cx(styles.root, className)} ref={ref} style={style}>\n      <div\n        className={cx(styles.wrapper, bordered && styles.bordered, classNames?.wrapper)}\n        data-table-wrapper=\"\"\n        style={{ maxHeight: scroll?.y, ...customStyles?.wrapper }}\n      >\n        <table\n          className={cx(styles.table, size === 'small' ? styles.small : styles.middle)}\n          style={{\n            minWidth,\n            tableLayout,\n            width: scroll?.x === 'max-content' ? 'max-content' : '100%',\n          }}\n        >\n          <TableHead\n            classNames={classNames}\n            columnIds={state.columnIds}\n            columns={columns}\n            fixedOffsets={fixedOffsets}\n            getColumn={(id) => table.getColumn(id) as any}\n            styles={customStyles}\n            renderFilter={(column, id) => {\n              if (renderFilter) return renderFilter(column, id, table);\n              const tableColumn = table.getColumn(id) as any;\n              const value = (tableColumn?.getFilterValue() as FilterValue[] | undefined) ?? [];\n              return (\n                <FilterMenu\n                  filters={column.filters ?? []}\n                  label={typeof column.title === 'string' ? column.title : id}\n                  value={value}\n                  onChange={(next) =>\n                    tableColumn?.setFilterValue(next.length > 0 ? next : undefined)\n                  }\n                />\n              );\n            }}\n          />\n          <TableBody\n            classNames={classNames}\n            columnIds={state.columnIds}\n            columns={columns}\n            emptyText={emptyText}\n            fixedOffsets={fixedOffsets}\n            loading={loading}\n            rowClassName={rowClassName}\n            rows={rows}\n            styles={customStyles}\n            onRow={onRow}\n          />\n        </table>\n        {loading && rows.length > 0 && (\n          <div className={styles.loading} data-table-loading=\"\">\n            <Spin />\n          </div>\n        )}\n      </div>\n      {pagination !== false && total > 0 && (\n        <div className={styles.pagination}>\n          <Pagination\n            current={pageIndex + 1}\n            pageSize={page.pageSize}\n            pageSizeOptions={state.config?.pageSizeOptions}\n            showSizeChanger={state.config?.showSizeChanger}\n            total={total}\n            onChange={(next, pageSize) =>\n              state.onPaginationChange({ pageIndex: next - 1, pageSize })\n            }\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n\nconst Table = memo(TableInner) as unknown as (<T extends RowData>(\n  props: TableProps<T>,\n) => ReactNode) & {\n  displayName?: string;\n};\n\nTable.displayName = 'Table';\n\nexport { TableInner };\n\nexport default Table;\n"],"mappings":"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"}

package/es/base-ui/Table/TableBody.mjs

@@ -0,0 +1,59 @@
+"use client";
+import Spin from "../Spin/Spin.mjs";
+import Empty from "../../Empty/Empty.mjs";
+import { styles } from "./style.mjs";
+import { getCellValue } from "./toColumnDefs.mjs";
+import { createElement } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx } from "antd-style";
+//#region src/base-ui/Table/TableBody.tsx
+const TableBody = ({ classNames, columnIds, columns, emptyText, fixedOffsets, loading, onRow, rowClassName, rows, styles: customStyles }) => {
+	if (rows.length === 0) return /* @__PURE__ */ jsx("tbody", {
+		className: classNames?.body,
+		style: customStyles?.body,
+		children: /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsx("td", {
+			className: styles.empty,
+			colSpan: columns.length,
+			children: loading ? /* @__PURE__ */ jsx(Spin, {}) : emptyText ?? /* @__PURE__ */ jsx(Empty, { description: "No data" })
+		}) })
+	});
+	return /* @__PURE__ */ jsx("tbody", {
+		className: classNames?.body,
+		style: customStyles?.body,
+		children: rows.map((row, rowIndex) => {
+			const record = row.original;
+			const rowProps = onRow?.(record, rowIndex) ?? {};
+			const extraClassName = typeof rowClassName === "function" ? rowClassName(record, rowIndex) : rowClassName;
+			return /* @__PURE__ */ createElement("tr", {
+				...rowProps,
+				key: row.id,
+				style: {
+					...customStyles?.row,
+					...rowProps.style
+				},
+				className: cx(styles.row, rowProps.onClick && styles.clickable, extraClassName, classNames?.row, rowProps.className)
+			}, columns.map((column, columnIndex) => {
+				const value = getCellValue(record, column);
+				const cellProps = column.onCell?.(record, rowIndex) ?? {};
+				const content = column.render ? column.render(value, record, rowIndex) : value;
+				return /* @__PURE__ */ createElement("td", {
+					...cellProps,
+					key: columnIds[columnIndex],
+					title: column.ellipsis && typeof content === "string" ? content : cellProps.title,
+					className: cx(styles.cell, column.ellipsis && styles.ellipsis, column.fixed && styles.fixed, column.className, classNames?.cell, cellProps.className),
+					style: {
+						textAlign: column.align,
+						width: column.width,
+						...fixedOffsets[columnIndex],
+						...customStyles?.cell,
+						...cellProps.style
+					}
+				}, content);
+			}));
+		})
+	});
+};
+//#endregion
+export { TableBody as default };
+
+//# sourceMappingURL=TableBody.mjs.map

package/es/base-ui/Table/TableBody.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableBody.mjs","names":[],"sources":["../../../src/base-ui/Table/TableBody.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport type { CSSProperties, Key, ReactNode } from 'react';\n\nimport Spin from '@/base-ui/Spin';\nimport Empty from '@/Empty';\n\nimport { styles } from './style';\nimport { getCellValue } from './toColumnDefs';\nimport type { TableColumn, TableProps } from './type';\n\ninterface TableBodyProps<T> {\n  classNames?: TableProps<T>['classNames'];\n  columnIds: string[];\n  columns: TableColumn<T>[];\n  emptyText?: ReactNode;\n  fixedOffsets: (CSSProperties | undefined)[];\n  loading: boolean;\n  onRow?: TableProps<T>['onRow'];\n  rowClassName?: TableProps<T>['rowClassName'];\n  rows: { id: Key; original: T }[];\n  styles?: TableProps<T>['styles'];\n}\n\nconst TableBody = <T,>({\n  classNames,\n  columnIds,\n  columns,\n  emptyText,\n  fixedOffsets,\n  loading,\n  onRow,\n  rowClassName,\n  rows,\n  styles: customStyles,\n}: TableBodyProps<T>) => {\n  if (rows.length === 0) {\n    return (\n      <tbody className={classNames?.body} style={customStyles?.body}>\n        <tr>\n          <td className={styles.empty} colSpan={columns.length}>\n            {loading ? <Spin /> : (emptyText ?? <Empty description=\"No data\" />)}\n          </td>\n        </tr>\n      </tbody>\n    );\n  }\n\n  return (\n    <tbody className={classNames?.body} style={customStyles?.body}>\n      {rows.map((row, rowIndex) => {\n        const record = row.original;\n        const rowProps = onRow?.(record, rowIndex) ?? {};\n        const extraClassName =\n          typeof rowClassName === 'function' ? rowClassName(record, rowIndex) : rowClassName;\n\n        return (\n          <tr\n            {...rowProps}\n            key={row.id}\n            style={{ ...customStyles?.row, ...rowProps.style }}\n            className={cx(\n              styles.row,\n              rowProps.onClick && styles.clickable,\n              extraClassName,\n              classNames?.row,\n              rowProps.className,\n            )}\n          >\n            {columns.map((column, columnIndex) => {\n              const value = getCellValue(record, column);\n              const cellProps = column.onCell?.(record, rowIndex) ?? {};\n              const content = column.render\n                ? column.render(value, record, rowIndex)\n                : (value as ReactNode);\n\n              return (\n                <td\n                  {...cellProps}\n                  key={columnIds[columnIndex]}\n                  title={column.ellipsis && typeof content === 'string' ? content : cellProps.title}\n                  className={cx(\n                    styles.cell,\n                    column.ellipsis && styles.ellipsis,\n                    column.fixed && styles.fixed,\n                    column.className,\n                    classNames?.cell,\n                    cellProps.className,\n                  )}\n                  style={{\n                    textAlign: column.align,\n                    width: column.width,\n                    ...fixedOffsets[columnIndex],\n                    ...customStyles?.cell,\n                    ...cellProps.style,\n                  }}\n                >\n                  {content}\n                </td>\n              );\n            })}\n          </tr>\n        );\n      })}\n    </tbody>\n  );\n};\n\nexport default TableBody;\n"],"mappings":";;;;;;;;;AAyBA,MAAM,aAAiB,EACrB,YACA,WACA,SACA,WACA,cACA,SACA,OACA,cACA,MACA,QAAQ,mBACe;CACvB,IAAI,KAAK,WAAW,GAClB,OACE,oBAAC,SAAD;EAAO,WAAW,YAAY;EAAM,OAAO,cAAc;EACvD,UAAA,oBAAC,MAAD,EAAA,UACE,oBAAC,MAAD;GAAI,WAAW,OAAO;GAAO,SAAS,QAAQ;GAC3C,UAAA,UAAU,oBAAC,MAAD,CAAO,CAAA,IAAK,aAAa,oBAAC,OAAD,EAAO,aAAY,UAAW,CAAA;EAChE,CAAA,EACF,CAAA;CACC,CAAA;CAIX,OACE,oBAAC,SAAD;EAAO,WAAW,YAAY;EAAM,OAAO,cAAc;EACtD,UAAA,KAAK,KAAK,KAAK,aAAa;GAC3B,MAAM,SAAS,IAAI;GACnB,MAAM,WAAW,QAAQ,QAAQ,QAAQ,KAAK,CAAC;GAC/C,MAAM,iBACJ,OAAO,iBAAiB,aAAa,aAAa,QAAQ,QAAQ,IAAI;GAExE,OACE,8BAAC,MAAD;IACE,GAAI;IACJ,KAAK,IAAI;IACT,OAAO;KAAE,GAAG,cAAc;KAAK,GAAG,SAAS;IAAM;IACjD,WAAW,GACT,OAAO,KACP,SAAS,WAAW,OAAO,WAC3B,gBACA,YAAY,KACZ,SAAS,SACX;GAkCE,GAhCD,QAAQ,KAAK,QAAQ,gBAAgB;IACpC,MAAM,QAAQ,aAAa,QAAQ,MAAM;IACzC,MAAM,YAAY,OAAO,SAAS,QAAQ,QAAQ,KAAK,CAAC;IACxD,MAAM,UAAU,OAAO,SACnB,OAAO,OAAO,OAAO,QAAQ,QAAQ,IACpC;IAEL,OACE,8BAAC,MAAD;KACE,GAAI;KACJ,KAAK,UAAU;KACf,OAAO,OAAO,YAAY,OAAO,YAAY,WAAW,UAAU,UAAU;KAC5E,WAAW,GACT,OAAO,MACP,OAAO,YAAY,OAAO,UAC1B,OAAO,SAAS,OAAO,OACvB,OAAO,WACP,YAAY,MACZ,UAAU,SACZ;KACA,OAAO;MACL,WAAW,OAAO;MAClB,OAAO,OAAO;MACd,GAAG,aAAa;MAChB,GAAG,cAAc;MACjB,GAAG,UAAU;KACf;IAGE,GADD,OACC;GAER,CAAC,CACC;EAER,CAAC;CACI,CAAA;AAEX"}

package/es/base-ui/Table/TableHead.mjs

@@ -0,0 +1,50 @@
+"use client";
+import Icon from "../../Icon/Icon.mjs";
+import { styles } from "./style.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { ChevronDown, ChevronUp } from "lucide-react";
+//#region src/base-ui/Table/TableHead.tsx
+const ariaSortOf = (sorted) => sorted === "asc" ? "ascending" : sorted === "desc" ? "descending" : "none";
+const TableHead = ({ classNames, columnIds, columns, fixedOffsets, getColumn, renderFilter, styles: customStyles }) => /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: columns.map((column, index) => {
+	const id = columnIds[index];
+	const tableColumn = getColumn(id);
+	const sorted = column.sorter ? tableColumn?.getIsSorted() ?? false : false;
+	return /* @__PURE__ */ jsx("th", {
+		"aria-sort": column.sorter ? ariaSortOf(sorted) : void 0,
+		scope: "col",
+		className: cx(styles.header, column.fixed && styles.fixed, column.className, classNames?.header),
+		style: {
+			textAlign: column.align,
+			width: column.width,
+			...fixedOffsets[index],
+			...customStyles?.header,
+			...column.fixed ? { zIndex: 3 } : void 0
+		},
+		children: /* @__PURE__ */ jsxs("span", {
+			className: styles.headerInner,
+			children: [column.sorter ? /* @__PURE__ */ jsxs("button", {
+				className: styles.sortButton,
+				type: "button",
+				onClick: tableColumn?.getToggleSortingHandler(),
+				children: [column.title, /* @__PURE__ */ jsxs("span", {
+					"aria-hidden": "true",
+					className: styles.sortCaret,
+					children: [/* @__PURE__ */ jsx(Icon, {
+						"data-active": sorted === "asc",
+						icon: ChevronUp,
+						size: 10
+					}), /* @__PURE__ */ jsx(Icon, {
+						"data-active": sorted === "desc",
+						icon: ChevronDown,
+						size: 10
+					})]
+				})]
+			}) : column.title, column.filters?.length ? renderFilter?.(column, id) : null]
+		})
+	}, id);
+}) }) });
+//#endregion
+export { TableHead as default };
+
+//# sourceMappingURL=TableHead.mjs.map

package/es/base-ui/Table/TableHead.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableHead.mjs","names":[],"sources":["../../../src/base-ui/Table/TableHead.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport { ChevronDown, ChevronUp } from 'lucide-react';\nimport type { CSSProperties, ReactNode } from 'react';\n\nimport Icon from '@/Icon';\n\nimport { styles } from './style';\nimport type { TableColumn, TableProps } from './type';\n\ntype SortState = false | 'asc' | 'desc';\n\ninterface HeadColumn {\n  getIsSorted: () => SortState;\n  getToggleSortingHandler: () => undefined | ((event: unknown) => void);\n}\n\ninterface TableHeadProps<T> {\n  classNames?: TableProps<T>['classNames'];\n  columnIds: string[];\n  columns: TableColumn<T>[];\n  fixedOffsets: (CSSProperties | undefined)[];\n  getColumn: (id: string) => HeadColumn | undefined;\n  renderFilter?: (column: TableColumn<T>, id: string) => ReactNode;\n  styles?: TableProps<T>['styles'];\n}\n\nconst ariaSortOf = (sorted: SortState) =>\n  sorted === 'asc' ? 'ascending' : sorted === 'desc' ? 'descending' : 'none';\n\nconst TableHead = <T,>({\n  classNames,\n  columnIds,\n  columns,\n  fixedOffsets,\n  getColumn,\n  renderFilter,\n  styles: customStyles,\n}: TableHeadProps<T>) => (\n  <thead>\n    <tr>\n      {columns.map((column, index) => {\n        const id = columnIds[index];\n        const tableColumn = getColumn(id);\n        const sorted: SortState = column.sorter ? (tableColumn?.getIsSorted() ?? false) : false;\n\n        return (\n          <th\n            aria-sort={column.sorter ? ariaSortOf(sorted) : undefined}\n            key={id}\n            scope=\"col\"\n            className={cx(\n              styles.header,\n              column.fixed && styles.fixed,\n              column.className,\n              classNames?.header,\n            )}\n            style={{\n              textAlign: column.align,\n              width: column.width,\n              ...fixedOffsets[index],\n              ...customStyles?.header,\n              ...(column.fixed ? { zIndex: 3 } : undefined),\n            }}\n          >\n            <span className={styles.headerInner}>\n              {column.sorter ? (\n                <button\n                  className={styles.sortButton}\n                  type=\"button\"\n                  onClick={tableColumn?.getToggleSortingHandler()}\n                >\n                  {column.title}\n                  <span aria-hidden=\"true\" className={styles.sortCaret}>\n                    <Icon data-active={sorted === 'asc'} icon={ChevronUp} size={10} />\n                    <Icon data-active={sorted === 'desc'} icon={ChevronDown} size={10} />\n                  </span>\n                </button>\n              ) : (\n                column.title\n              )}\n              {column.filters?.length ? renderFilter?.(column, id) : null}\n            </span>\n          </th>\n        );\n      })}\n    </tr>\n  </thead>\n);\n\nexport default TableHead;\n"],"mappings":";;;;;;;AA4BA,MAAM,cAAc,WAClB,WAAW,QAAQ,cAAc,WAAW,SAAS,eAAe;AAEtE,MAAM,aAAiB,EACrB,YACA,WACA,SACA,cACA,WACA,cACA,QAAQ,mBAER,oBAAC,SAAD,EAAA,UACE,oBAAC,MAAD,EAAA,UACG,QAAQ,KAAK,QAAQ,UAAU;CAC9B,MAAM,KAAK,UAAU;CACrB,MAAM,cAAc,UAAU,EAAE;CAChC,MAAM,SAAoB,OAAO,SAAU,aAAa,YAAY,KAAK,QAAS;CAElF,OACE,oBAAC,MAAD;EACE,aAAW,OAAO,SAAS,WAAW,MAAM,IAAI,KAAA;EAEhD,OAAM;EACN,WAAW,GACT,OAAO,QACP,OAAO,SAAS,OAAO,OACvB,OAAO,WACP,YAAY,MACd;EACA,OAAO;GACL,WAAW,OAAO;GAClB,OAAO,OAAO;GACd,GAAG,aAAa;GAChB,GAAG,cAAc;GACjB,GAAI,OAAO,QAAQ,EAAE,QAAQ,EAAE,IAAI,KAAA;EACrC;EAEA,UAAA,qBAAC,QAAD;GAAM,WAAW,OAAO;GAAxB,UAAA,CACG,OAAO,SACN,qBAAC,UAAD;IACE,WAAW,OAAO;IAClB,MAAK;IACL,SAAS,aAAa,wBAAwB;IAHhD,UAAA,CAKG,OAAO,OACR,qBAAC,QAAD;KAAM,eAAY;KAAO,WAAW,OAAO;KAA3C,UAAA,CACE,oBAAC,MAAD;MAAM,eAAa,WAAW;MAAO,MAAM;MAAW,MAAM;KAAK,CAAA,GACjE,oBAAC,MAAD;MAAM,eAAa,WAAW;MAAQ,MAAM;MAAa,MAAM;KAAK,CAAA,CAChE;IACA,CAAA,CAAA;GAER,CAAA,IAAA,OAAO,OAER,OAAO,SAAS,SAAS,eAAe,QAAQ,EAAE,IAAI,IACnD;;CACJ,GAlCG,EAkCH;AAER,CAAC,EACC,CAAA,EACC,CAAA"}

package/es/base-ui/Table/features.mjs

@@ -0,0 +1,12 @@
+import { columnFilteringFeature, createFilteredRowModel, createSortedRowModel, rowSortingFeature, tableFeatures } from "@tanstack/react-table";
+//#region src/base-ui/Table/features.ts
+const tableFeatureSet = tableFeatures({
+	columnFilteringFeature,
+	filteredRowModel: createFilteredRowModel(),
+	rowSortingFeature,
+	sortedRowModel: createSortedRowModel()
+});
+//#endregion
+export { tableFeatureSet };
+
+//# sourceMappingURL=features.mjs.map

package/es/base-ui/Table/features.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"features.mjs","names":[],"sources":["../../../src/base-ui/Table/features.ts"],"sourcesContent":["import {\n  columnFilteringFeature,\n  createFilteredRowModel,\n  createSortedRowModel,\n  rowSortingFeature,\n  tableFeatures,\n} from '@tanstack/react-table';\n\nexport const tableFeatureSet = tableFeatures({\n  columnFilteringFeature,\n  filteredRowModel: createFilteredRowModel(),\n  rowSortingFeature,\n  sortedRowModel: createSortedRowModel(),\n});\n\nexport type TableFeatureSet = typeof tableFeatureSet;\n"],"mappings":";;AAQA,MAAa,kBAAkB,cAAc;CAC3C;CACA,kBAAkB,uBAAuB;CACzC;CACA,gBAAgB,qBAAqB;AACvC,CAAC"}

package/es/base-ui/Table/fixedOffsets.mjs

@@ -0,0 +1,29 @@
+//#region src/base-ui/Table/fixedOffsets.ts
+const widthOf = (column) => typeof column.width === "number" ? column.width : 0;
+const getFixedOffsets = (columns) => {
+	const offsets = columns.map(() => void 0);
+	let left = 0;
+	columns.forEach((column, index) => {
+		if (column.fixed !== "left") return;
+		offsets[index] = {
+			left,
+			position: "sticky"
+		};
+		left += widthOf(column);
+	});
+	let right = 0;
+	for (let index = columns.length - 1; index >= 0; index--) {
+		const column = columns[index];
+		if (column.fixed !== "right") continue;
+		offsets[index] = {
+			position: "sticky",
+			right
+		};
+		right += widthOf(column);
+	}
+	return offsets;
+};
+//#endregion
+export { getFixedOffsets };
+
+//# sourceMappingURL=fixedOffsets.mjs.map

package/es/base-ui/Table/fixedOffsets.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"fixedOffsets.mjs","names":[],"sources":["../../../src/base-ui/Table/fixedOffsets.ts"],"sourcesContent":["import type { CSSProperties } from 'react';\n\nimport type { TableColumn } from './type';\n\nconst widthOf = (column: TableColumn<any>) => (typeof column.width === 'number' ? column.width : 0);\n\nexport const getFixedOffsets = (columns: TableColumn<any>[]): (CSSProperties | undefined)[] => {\n  const offsets: (CSSProperties | undefined)[] = columns.map(() => undefined);\n\n  let left = 0;\n  columns.forEach((column, index) => {\n    if (column.fixed !== 'left') return;\n    offsets[index] = { left, position: 'sticky' };\n    left += widthOf(column);\n  });\n\n  let right = 0;\n  for (let index = columns.length - 1; index >= 0; index--) {\n    const column = columns[index];\n    if (column.fixed !== 'right') continue;\n    offsets[index] = { position: 'sticky', right };\n    right += widthOf(column);\n  }\n\n  return offsets;\n};\n"],"mappings":";AAIA,MAAM,WAAW,WAA8B,OAAO,OAAO,UAAU,WAAW,OAAO,QAAQ;AAEjG,MAAa,mBAAmB,YAA+D;CAC7F,MAAM,UAAyC,QAAQ,UAAU,KAAA,CAAS;CAE1E,IAAI,OAAO;CACX,QAAQ,SAAS,QAAQ,UAAU;EACjC,IAAI,OAAO,UAAU,QAAQ;EAC7B,QAAQ,SAAS;GAAE;GAAM,UAAU;EAAS;EAC5C,QAAQ,QAAQ,MAAM;CACxB,CAAC;CAED,IAAI,QAAQ;CACZ,KAAK,IAAI,QAAQ,QAAQ,SAAS,GAAG,SAAS,GAAG,SAAS;EACxD,MAAM,SAAS,QAAQ;EACvB,IAAI,OAAO,UAAU,SAAS;EAC9B,QAAQ,SAAS;GAAE,UAAU;GAAU;EAAM;EAC7C,SAAS,QAAQ,MAAM;CACzB;CAEA,OAAO;AACT"}

package/es/base-ui/Table/index.d.mts

@@ -0,0 +1,3 @@
+import { FilterValue, SortOrder, TableColumn, TableFilters, TablePaginationConfig, TableProps, TableSemanticName, TableSorterResult } from "./type.mjs";
+import Table from "./Table.mjs";
+export { type FilterValue, type SortOrder, type TableColumn, type TableFilters, type TablePaginationConfig, type TableProps, type TableSemanticName, type TableSorterResult, Table as default };

package/es/base-ui/Table/style.mjs

@@ -0,0 +1,168 @@
+import { focusRing } from "../focusRing.mjs";
+import { createStaticStyles } from "antd-style";
+//#region src/base-ui/Table/style.ts
+const styles = createStaticStyles(({ css, cssVar }) => ({
+	bordered: css`
+    border: 1px solid ${cssVar.colorBorderSecondary};
+    border-radius: ${cssVar.borderRadiusLG};
+
+    & th,
+    & td {
+      border-inline-end: 1px solid ${cssVar.colorBorderSecondary};
+    }
+
+    & th:last-child,
+    & td:last-child {
+      border-inline-end: 0;
+    }
+  `,
+	cell: css`
+    border-block-end: 1px solid ${cssVar.colorBorderSecondary};
+    font-variant-numeric: tabular-nums;
+    background: ${cssVar.colorBgContainer};
+  `,
+	clickable: css`
+    cursor: pointer;
+  `,
+	ellipsis: css`
+    overflow: hidden;
+    max-width: 0;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  `,
+	empty: css`
+    padding-block: 32px;
+    color: ${cssVar.colorTextDescription};
+    text-align: center;
+  `,
+	filterActive: css`
+    color: ${cssVar.colorPrimary};
+  `,
+	filterButton: css`
+    ${focusRing};
+    cursor: pointer;
+
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+
+    padding: 2px;
+    border: 0;
+    border-radius: 4px;
+
+    color: ${cssVar.colorTextQuaternary};
+
+    background: none;
+
+    &:hover {
+      color: ${cssVar.colorText};
+      background: ${cssVar.colorFillTertiary};
+    }
+  `,
+	fixed: css`
+    z-index: 1;
+    background: ${cssVar.colorBgContainer};
+  `,
+	header: css`
+    position: sticky;
+    z-index: 2;
+    inset-block-start: 0;
+
+    font-size: 13px;
+    font-weight: 500;
+    color: ${cssVar.colorTextSecondary};
+    text-align: start;
+
+    background: ${cssVar.colorBgContainer};
+    box-shadow:
+      inset 0 -1px 0 ${cssVar.colorBorderSecondary},
+      inset 0 999px 0 ${cssVar.colorFillQuaternary};
+  `,
+	headerInner: css`
+    display: inline-flex;
+    gap: 6px;
+    align-items: center;
+  `,
+	loading: css`
+    position: absolute;
+    z-index: 3;
+    inset: 0;
+
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    background: color-mix(in srgb, ${cssVar.colorBgContainer} 60%, transparent);
+  `,
+	middle: css`
+    & th,
+    & td {
+      padding-block: 12px;
+      padding-inline: 16px;
+    }
+  `,
+	pagination: css`
+    display: flex;
+    justify-content: flex-end;
+    margin-block-start: 12px;
+  `,
+	root: css`
+    min-width: 0;
+  `,
+	row: css`
+    &:hover > td {
+      background: color-mix(in srgb, ${cssVar.colorBgContainer}, ${cssVar.colorText} 3%);
+    }
+
+    &:last-child > td {
+      border-block-end: 0;
+    }
+  `,
+	small: css`
+    & th,
+    & td {
+      padding-block: 8px;
+      padding-inline: 12px;
+    }
+  `,
+	sortButton: css`
+    ${focusRing};
+    cursor: pointer;
+
+    display: inline-flex;
+    gap: 6px;
+    align-items: center;
+
+    padding: 0;
+    border: 0;
+    border-radius: 4px;
+
+    font: inherit;
+    color: inherit;
+
+    background: none;
+  `,
+	sortCaret: css`
+    display: inline-flex;
+    flex-direction: column;
+    color: ${cssVar.colorTextQuaternary};
+
+    & > [data-active='true'] {
+      color: ${cssVar.colorText};
+    }
+  `,
+	table: css`
+    border-spacing: 0;
+    border-collapse: separate;
+    width: 100%;
+    font-size: 14px;
+  `,
+	wrapper: css`
+    position: relative;
+    overflow: auto;
+  `
+}));
+//#endregion
+export { styles };
+
+//# sourceMappingURL=style.mjs.map

package/es/base-ui/Table/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/base-ui/Table/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nimport { focusRing } from '@/base-ui/focusRing';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  bordered: css`\n    border: 1px solid ${cssVar.colorBorderSecondary};\n    border-radius: ${cssVar.borderRadiusLG};\n\n    & th,\n    & td {\n      border-inline-end: 1px solid ${cssVar.colorBorderSecondary};\n    }\n\n    & th:last-child,\n    & td:last-child {\n      border-inline-end: 0;\n    }\n  `,\n  cell: css`\n    border-block-end: 1px solid ${cssVar.colorBorderSecondary};\n    font-variant-numeric: tabular-nums;\n    background: ${cssVar.colorBgContainer};\n  `,\n  clickable: css`\n    cursor: pointer;\n  `,\n  ellipsis: css`\n    overflow: hidden;\n    max-width: 0;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  `,\n  empty: css`\n    padding-block: 32px;\n    color: ${cssVar.colorTextDescription};\n    text-align: center;\n  `,\n  filterActive: css`\n    color: ${cssVar.colorPrimary};\n  `,\n  filterButton: css`\n    ${focusRing};\n    cursor: pointer;\n\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    padding: 2px;\n    border: 0;\n    border-radius: 4px;\n\n    color: ${cssVar.colorTextQuaternary};\n\n    background: none;\n\n    &:hover {\n      color: ${cssVar.colorText};\n      background: ${cssVar.colorFillTertiary};\n    }\n  `,\n  fixed: css`\n    z-index: 1;\n    background: ${cssVar.colorBgContainer};\n  `,\n  header: css`\n    position: sticky;\n    z-index: 2;\n    inset-block-start: 0;\n\n    font-size: 13px;\n    font-weight: 500;\n    color: ${cssVar.colorTextSecondary};\n    text-align: start;\n\n    background: ${cssVar.colorBgContainer};\n    box-shadow:\n      inset 0 -1px 0 ${cssVar.colorBorderSecondary},\n      inset 0 999px 0 ${cssVar.colorFillQuaternary};\n  `,\n  headerInner: css`\n    display: inline-flex;\n    gap: 6px;\n    align-items: center;\n  `,\n  loading: css`\n    position: absolute;\n    z-index: 3;\n    inset: 0;\n\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    background: color-mix(in srgb, ${cssVar.colorBgContainer} 60%, transparent);\n  `,\n  middle: css`\n    & th,\n    & td {\n      padding-block: 12px;\n      padding-inline: 16px;\n    }\n  `,\n  pagination: css`\n    display: flex;\n    justify-content: flex-end;\n    margin-block-start: 12px;\n  `,\n  root: css`\n    min-width: 0;\n  `,\n  row: css`\n    &:hover > td {\n      background: color-mix(in srgb, ${cssVar.colorBgContainer}, ${cssVar.colorText} 3%);\n    }\n\n    &:last-child > td {\n      border-block-end: 0;\n    }\n  `,\n  small: css`\n    & th,\n    & td {\n      padding-block: 8px;\n      padding-inline: 12px;\n    }\n  `,\n  sortButton: css`\n    ${focusRing};\n    cursor: pointer;\n\n    display: inline-flex;\n    gap: 6px;\n    align-items: center;\n\n    padding: 0;\n    border: 0;\n    border-radius: 4px;\n\n    font: inherit;\n    color: inherit;\n\n    background: none;\n  `,\n  sortCaret: css`\n    display: inline-flex;\n    flex-direction: column;\n    color: ${cssVar.colorTextQuaternary};\n\n    & > [data-active='true'] {\n      color: ${cssVar.colorText};\n    }\n  `,\n  table: css`\n    border-spacing: 0;\n    border-collapse: separate;\n    width: 100%;\n    font-size: 14px;\n  `,\n  wrapper: css`\n    position: relative;\n    overflow: auto;\n  `,\n}));\n"],"mappings":";;;AAIA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc;CAC7D,UAAU,GAAG;wBACS,OAAO,qBAAqB;qBAC/B,OAAO,eAAe;;;;qCAIN,OAAO,qBAAqB;;;;;;;;CAQ/D,MAAM,GAAG;kCACuB,OAAO,qBAAqB;;kBAE5C,OAAO,iBAAiB;;CAExC,WAAW,GAAG;;;CAGd,UAAU,GAAG;;;;;;CAMb,OAAO,GAAG;;aAEC,OAAO,qBAAqB;;;CAGvC,cAAc,GAAG;aACN,OAAO,aAAa;;CAE/B,cAAc,GAAG;MACb,UAAU;;;;;;;;;;;aAWH,OAAO,oBAAoB;;;;;eAKzB,OAAO,UAAU;oBACZ,OAAO,kBAAkB;;;CAG3C,OAAO,GAAG;;kBAEM,OAAO,iBAAiB;;CAExC,QAAQ,GAAG;;;;;;;aAOA,OAAO,mBAAmB;;;kBAGrB,OAAO,iBAAiB;;uBAEnB,OAAO,qBAAqB;wBAC3B,OAAO,oBAAoB;;CAEjD,aAAa,GAAG;;;;;CAKhB,SAAS,GAAG;;;;;;;;;qCASuB,OAAO,iBAAiB;;CAE3D,QAAQ,GAAG;;;;;;;CAOX,YAAY,GAAG;;;;;CAKf,MAAM,GAAG;;;CAGT,KAAK,GAAG;;uCAE6B,OAAO,iBAAiB,IAAI,OAAO,UAAU;;;;;;;CAOlF,OAAO,GAAG;;;;;;;CAOV,YAAY,GAAG;MACX,UAAU;;;;;;;;;;;;;;;;CAgBd,WAAW,GAAG;;;aAGH,OAAO,oBAAoB;;;eAGzB,OAAO,UAAU;;;CAG9B,OAAO,GAAG;;;;;;CAMV,SAAS,GAAG;;;;AAId,EAAE"}

package/es/base-ui/Table/toColumnDefs.mjs

@@ -0,0 +1,26 @@
+//#region src/base-ui/Table/toColumnDefs.ts
+const getColumnId = (column, index) => String(column.key ?? column.dataIndex ?? `__column_${index}`);
+const getCellValue = (record, column) => column.dataIndex ? record[column.dataIndex] : void 0;
+const isEmptyFilter = (value) => !Array.isArray(value) || value.length === 0;
+const toColumnDefs = (columns) => columns.map((column, index) => {
+	if ((Boolean(column.sorter) || Boolean(column.filters?.length)) && column.key == null && column.dataIndex == null) throw new Error("[Table] sortable or filterable columns need a `key` or `dataIndex`");
+	const comparator = typeof column.sorter === "function" ? column.sorter : void 0;
+	const { onFilter } = column;
+	const filterFn = onFilter ? Object.assign((row, _columnId, filterValue) => filterValue.some((value) => onFilter(value, row.original)), { autoRemove: isEmptyFilter }) : void 0;
+	return {
+		accessorFn: (record) => getCellValue(record, column),
+		enableColumnFilter: Boolean(column.filters?.length),
+		enableSorting: Boolean(column.sorter),
+		filterFn,
+		id: getColumnId(column, index),
+		sortDescFirst: column.sortDirections?.[0] === "descend",
+		...comparator && {
+			sortFn: (rowA, rowB) => comparator(rowA.original, rowB.original),
+			sortUndefined: false
+		}
+	};
+});
+//#endregion
+export { getCellValue, getColumnId, toColumnDefs };
+
+//# sourceMappingURL=toColumnDefs.mjs.map