@lobehub/ui 5.64.2 → 6.0.0-beta.10

package/es/Table/Table.mjs

@@ -0,0 +1,167 @@
+"use client";
+import { useTranslation } from "../i18n/useTranslation.mjs";
+import Empty from "../Empty/Empty.mjs";
+import Spin from "../Spin/Spin.mjs";
+import { PREFIX_CLS } from "./constants.mjs";
+import table_default from "../i18n/resources/en/table.mjs";
+import Column from "./Column.mjs";
+import ColumnGroup from "./ColumnGroup.mjs";
+import { getStickyOffsets } from "./engine/fixed.mjs";
+import { SELECTION_ALL, SELECTION_COLUMN, SELECTION_INVERT, SELECTION_NONE } from "./pipeline/selectionUtils.mjs";
+import { EXPAND_COLUMN } from "./pipeline/columnUtils.mjs";
+import { HeaderContext, SelectionContext, TableViewContext } from "./render/context.mjs";
+import { styles } from "./style.mjs";
+import FixedFrost from "./render/FixedFrost.mjs";
+import TableLoadingSkeleton from "./render/LoadingSkeleton.mjs";
+import { renderPaginationBars } from "./render/PaginationBar.mjs";
+import { TableSummary } from "./render/Summary.mjs";
+import { resolveSticky, toTableRef } from "./render/tableHelpers.mjs";
+import { TableStoreProvider } from "./store/hooks.mjs";
+import TableView from "./render/TableView.mjs";
+import { useViewContexts } from "./render/useViewContexts.mjs";
+import { useStableSemantic } from "./semantic.mjs";
+import { useTableController } from "./useTableController.mjs";
+import { isValidElement, memo, useCallback, useImperativeHandle, useMemo, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import clsx$1 from "clsx";
+import * as stylex from "@stylexjs/stylex";
+import { Inbox } from "lucide-react";
+//#region src/Table/Table.tsx
+const TableInner = (props) => {
+	const { className, classNames, footer, internalRef, loading = false, onScroll, pagination, ref, rootClassName, rowHoverable = true, rowSelection, scroll, showHeader = true, size = "middle", sticky, style, styles: customStyles, tableLayout, title, variant = "borderless", virtual } = props;
+	const controller = useTableController(props);
+	const { model, rows, state } = controller;
+	const { t } = useTranslation(table_default);
+	const { classNames: semanticClassNames, styles: semanticStyles } = useStableSemantic(classNames, customStyles, props);
+	const rootRef = useRef(null);
+	const { measureRef } = controller;
+	const setRootRef = useCallback((element) => {
+		rootRef.current = element;
+		return measureRef(element);
+	}, [measureRef]);
+	useImperativeHandle(ref, () => toTableRef(rootRef.current, controller.scrollTo), [controller.scrollTo]);
+	useImperativeHandle(internalRef, () => ({
+		clearSelection: controller.selection.actions.clear,
+		store: controller.store
+	}), [controller.selection.actions.clear, controller.store]);
+	const { headerValue, selectionValue, viewValue } = useViewContexts({
+		controller,
+		props,
+		semanticClassNames,
+		semanticStyles
+	});
+	const leafColumns = model.leafColumns;
+	const { spinning: isLoading = true, tip, variant: spinVariant = "network", ...spinRest } = typeof loading === "object" ? loading : { spinning: loading };
+	const customEmpty = props.locale?.emptyText;
+	const emptyNode = isLoading ? /* @__PURE__ */ jsx(TableLoadingSkeleton, {
+		columns: controller.columns,
+		expandColumn: Boolean(controller.expandType),
+		rows: pagination === false ? 5 : Math.min(5, state.page.pageSize),
+		screens: controller.screens,
+		selectionColumn: Boolean(rowSelection),
+		size
+	}) : customEmpty === void 0 ? /* @__PURE__ */ jsx(Empty, {
+		description: t("table.emptyText"),
+		icon: Inbox,
+		imageSize: 40
+	}) : typeof customEmpty === "function" ? customEmpty() : customEmpty;
+	const stickyConfig = resolveSticky(sticky);
+	const { summaryNode } = controller;
+	const summaryFixed = isValidElement(summaryNode) && summaryNode.type === TableSummary ? summaryNode.props.fixed : void 0;
+	const fixFooter = controller.fixHeader || stickyConfig.isSticky || virtual ? virtual && summaryNode ? summaryFixed ?? "bottom" : summaryFixed ?? false : false;
+	const hasFixedColumn = leafColumns.some((leaf) => leaf.fixed);
+	const mergedTableLayout = tableLayout ?? (hasFixedColumn ? scroll?.x === "max-content" ? "auto" : "fixed" : controller.fixHeader || stickyConfig.isSticky || leafColumns.some((leaf) => leaf.column.source.column.ellipsis) ? "fixed" : "auto");
+	const offsets = useMemo(() => getStickyOffsets(controller.columnWidths, leafColumns), [controller.columnWidths, leafColumns]);
+	const pager = state.config ? renderPaginationBars({
+		classNames: semanticClassNames.pagination,
+		config: state.config,
+		onChange: state.onPaginationChange,
+		page: state.page,
+		size: props.size,
+		styles: semanticStyles.pagination,
+		total: state.total
+	}) : {
+		bottom: null,
+		top: null
+	};
+	const rootStyle = {
+		...semanticStyles.root,
+		...style
+	};
+	return /* @__PURE__ */ jsx(TableStoreProvider, {
+		value: controller.store,
+		children: /* @__PURE__ */ jsx(TableViewContext, {
+			value: viewValue,
+			children: /* @__PURE__ */ jsx(SelectionContext, {
+				value: selectionValue,
+				children: /* @__PURE__ */ jsx(HeaderContext, {
+					value: headerValue,
+					children: /* @__PURE__ */ jsxs("div", {
+						ref: setRootRef,
+						style: rootStyle,
+						className: clsx$1(stylex.props(styles.root).className, `${PREFIX_CLS}-wrapper`, rootClassName, className, semanticClassNames.root),
+						children: [
+							pager.top,
+							/* @__PURE__ */ jsxs("div", {
+								className: stylex.props(styles.spinContainer).className,
+								"data-table-wrapper": "",
+								children: [
+									/* @__PURE__ */ jsx(TableView, {
+										bodyRef: controller.bodyRef,
+										colWidths: controller.columnWidths,
+										emptyNode,
+										fixFooter,
+										fixHeader: controller.fixHeader,
+										footer: footer ? footer(rows) : void 0,
+										grouped: controller.grouped,
+										headerRows: model.headerRows,
+										hoverable: rowHoverable,
+										offsets,
+										rows: model.rows,
+										scrollX: scroll?.x,
+										scrollY: scroll?.y,
+										showHeader,
+										size,
+										sticky: stickyConfig,
+										summaryNode,
+										tableLayout: mergedTableLayout,
+										title: title ? title(rows) : void 0,
+										variant,
+										virtual: controller.virtualInput,
+										virtualScrollRef: controller.virtualScrollRef,
+										onColumnResize: controller.onColumnResize,
+										onScroll
+									}),
+									isLoading && /* @__PURE__ */ jsxs("div", {
+										...stylex.props(styles.loading),
+										"data-table-loading": "",
+										children: [/* @__PURE__ */ jsx(Spin, {
+											...spinRest,
+											variant: spinVariant
+										}), tip]
+									}),
+									/* @__PURE__ */ jsx(FixedFrost, { rootRef })
+								]
+							}),
+							pager.bottom
+						]
+					})
+				})
+			})
+		})
+	});
+};
+const Table = memo(TableInner);
+Table.displayName = "Table";
+Table.Column = Column;
+Table.ColumnGroup = ColumnGroup;
+Table.EXPAND_COLUMN = EXPAND_COLUMN;
+Table.SELECTION_COLUMN = SELECTION_COLUMN;
+Table.SELECTION_ALL = SELECTION_ALL;
+Table.SELECTION_INVERT = SELECTION_INVERT;
+Table.SELECTION_NONE = SELECTION_NONE;
+Table.Summary = TableSummary;
+//#endregion
+export { TableInner, Table as default };
+
+//# sourceMappingURL=Table.mjs.map

package/es/Table/Table.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.mjs","names":["tableMessages","clsx"],"sources":["../../src/Table/Table.tsx"],"sourcesContent":["'use client';\n\nimport * as stylex from '@stylexjs/stylex';\nimport clsx from 'clsx';\nimport { Inbox } from 'lucide-react';\nimport {\n  type CSSProperties,\n  isValidElement,\n  memo,\n  type ReactNode,\n  type Ref,\n  useCallback,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n} from 'react';\n\nimport Empty from '@/Empty';\nimport tableMessages from '@/i18n/resources/en/table';\nimport { useTranslation } from '@/i18n/useTranslation';\nimport Spin from '@/Spin';\n\nimport Column from './Column';\nimport ColumnGroup from './ColumnGroup';\nimport { PREFIX_CLS } from './constants';\nimport { getStickyOffsets } from './engine/fixed';\nimport type { TableInternalProps } from './internal';\nimport { EXPAND_COLUMN } from './pipeline/columnUtils';\nimport {\n  SELECTION_ALL,\n  SELECTION_COLUMN,\n  SELECTION_INVERT,\n  SELECTION_NONE,\n} from './pipeline/selectionUtils';\nimport { HeaderContext, SelectionContext, TableViewContext } from './render/context';\nimport FixedFrost from './render/FixedFrost';\nimport TableLoadingSkeleton from './render/LoadingSkeleton';\nimport { renderPaginationBars } from './render/PaginationBar';\nimport { TableSummary } from './render/Summary';\nimport { resolveSticky, toTableRef } from './render/tableHelpers';\nimport TableView from './render/TableView';\nimport { useViewContexts } from './render/useViewContexts';\nimport { useStableSemantic } from './semantic';\nimport { TableStoreProvider } from './store/hooks';\nimport { styles } from './style';\nimport type { TableProps, TableRef } from './type';\nimport { useTableController } from './useTableController';\n\nconst TableInner = <T,>(props: TableInternalProps<T>) => {\n  const {\n    className,\n    classNames,\n    footer,\n    internalRef,\n    loading = false,\n    onScroll,\n    pagination,\n    ref,\n    rootClassName,\n    rowHoverable = true,\n    rowSelection,\n    scroll,\n    showHeader = true,\n    size = 'middle',\n    sticky,\n    style,\n    styles: customStyles,\n    tableLayout,\n    title,\n    variant = 'borderless',\n    virtual,\n  } = props;\n\n  const controller = useTableController(props);\n  const { model, rows, state } = controller;\n  const { t } = useTranslation(tableMessages);\n  const { classNames: semanticClassNames, styles: semanticStyles } = useStableSemantic(\n    classNames,\n    customStyles,\n    props,\n  );\n\n  const rootRef = useRef<HTMLDivElement>(null);\n  const { measureRef } = controller;\n  const setRootRef = useCallback(\n    (element: HTMLDivElement | null) => {\n      rootRef.current = element;\n      return measureRef(element);\n    },\n    [measureRef],\n  );\n  useImperativeHandle(\n    ref as Ref<TableRef>,\n    () => toTableRef(rootRef.current!, controller.scrollTo),\n    [controller.scrollTo],\n  );\n  useImperativeHandle(\n    internalRef,\n    () => ({ clearSelection: controller.selection.actions.clear, store: controller.store }),\n    [controller.selection.actions.clear, controller.store],\n  );\n\n  const { headerValue, selectionValue, viewValue } = useViewContexts<T>({\n    controller,\n    props,\n    semanticClassNames,\n    semanticStyles,\n  });\n  const leafColumns = model.leafColumns;\n\n  const {\n    spinning: isLoading = true,\n    tip,\n    variant: spinVariant = 'network',\n    ...spinRest\n  } = typeof loading === 'object' ? loading : { spinning: loading };\n\n  const customEmpty = props.locale?.emptyText;\n  const emptyNode = isLoading ? (\n    <TableLoadingSkeleton\n      columns={controller.columns}\n      expandColumn={Boolean(controller.expandType)}\n      rows={pagination === false ? 5 : Math.min(5, state.page.pageSize)}\n      screens={controller.screens}\n      selectionColumn={Boolean(rowSelection)}\n      size={size}\n    />\n  ) : customEmpty === undefined ? (\n    <Empty description={t('table.emptyText')} icon={Inbox} imageSize={40} />\n  ) : typeof customEmpty === 'function' ? (\n    customEmpty()\n  ) : (\n    customEmpty\n  );\n\n  const stickyConfig = resolveSticky(sticky);\n  const { summaryNode } = controller;\n  const summaryFixed =\n    isValidElement<{ fixed?: boolean | 'top' | 'bottom' }>(summaryNode) &&\n    summaryNode.type === TableSummary\n      ? summaryNode.props.fixed\n      : undefined;\n  const fixFooter =\n    controller.fixHeader || stickyConfig.isSticky || virtual\n      ? virtual && summaryNode\n        ? (summaryFixed ?? 'bottom')\n        : (summaryFixed ?? false)\n      : false;\n\n  const hasFixedColumn = leafColumns.some((leaf) => leaf.fixed);\n  const mergedTableLayout =\n    tableLayout ??\n    (hasFixedColumn\n      ? scroll?.x === 'max-content'\n        ? 'auto'\n        : 'fixed'\n      : controller.fixHeader ||\n          stickyConfig.isSticky ||\n          leafColumns.some((leaf) => (leaf.column.source.column as { ellipsis?: unknown }).ellipsis)\n        ? 'fixed'\n        : 'auto');\n\n  const offsets = useMemo(\n    () => getStickyOffsets(controller.columnWidths, leafColumns),\n    [controller.columnWidths, leafColumns],\n  );\n\n  const pager = state.config\n    ? renderPaginationBars({\n        classNames: semanticClassNames.pagination,\n        config: state.config,\n        onChange: state.onPaginationChange,\n        page: state.page,\n        size: props.size,\n        styles: semanticStyles.pagination,\n        total: state.total,\n      })\n    : { bottom: null, top: null };\n\n  const rootStyle: CSSProperties = { ...semanticStyles.root, ...style };\n\n  return (\n    <TableStoreProvider value={controller.store}>\n      <TableViewContext value={viewValue}>\n        <SelectionContext value={selectionValue}>\n          <HeaderContext value={headerValue}>\n            <div\n              ref={setRootRef}\n              style={rootStyle}\n              className={clsx(\n                stylex.props(styles.root).className,\n                `${PREFIX_CLS}-wrapper`,\n                rootClassName,\n                className,\n                semanticClassNames.root,\n              )}\n            >\n              {pager.top}\n              <div className={stylex.props(styles.spinContainer).className} data-table-wrapper=\"\">\n                <TableView<T>\n                  bodyRef={controller.bodyRef}\n                  colWidths={controller.columnWidths}\n                  emptyNode={emptyNode}\n                  fixFooter={fixFooter}\n                  fixHeader={controller.fixHeader}\n                  footer={footer ? footer(rows) : undefined}\n                  grouped={controller.grouped}\n                  headerRows={model.headerRows}\n                  hoverable={rowHoverable}\n                  offsets={offsets}\n                  rows={model.rows}\n                  scrollX={scroll?.x}\n                  scrollY={scroll?.y}\n                  showHeader={showHeader}\n                  size={size}\n                  sticky={stickyConfig}\n                  summaryNode={summaryNode}\n                  tableLayout={mergedTableLayout}\n                  title={title ? title(rows) : undefined}\n                  variant={variant}\n                  virtual={controller.virtualInput}\n                  virtualScrollRef={controller.virtualScrollRef}\n                  onColumnResize={controller.onColumnResize}\n                  onScroll={onScroll}\n                />\n                {isLoading && (\n                  <div {...stylex.props(styles.loading)} data-table-loading=\"\">\n                    <Spin {...spinRest} variant={spinVariant} />\n                    {tip as ReactNode}\n                  </div>\n                )}\n                <FixedFrost rootRef={rootRef} />\n              </div>\n              {pager.bottom}\n            </div>\n          </HeaderContext>\n        </SelectionContext>\n      </TableViewContext>\n    </TableStoreProvider>\n  );\n};\n\ntype TableComponent = (<T>(props: TableProps<T>) => ReactNode) & {\n  Column: typeof Column;\n  ColumnGroup: typeof ColumnGroup;\n  displayName?: string;\n  EXPAND_COLUMN: typeof EXPAND_COLUMN;\n  SELECTION_ALL: typeof SELECTION_ALL;\n  SELECTION_COLUMN: typeof SELECTION_COLUMN;\n  SELECTION_INVERT: typeof SELECTION_INVERT;\n  SELECTION_NONE: typeof SELECTION_NONE;\n  Summary: typeof TableSummary;\n};\n\nconst Table = memo(TableInner) as unknown as TableComponent;\n\nTable.displayName = 'Table';\nTable.Column = Column;\nTable.ColumnGroup = ColumnGroup;\nTable.EXPAND_COLUMN = EXPAND_COLUMN;\nTable.SELECTION_COLUMN = SELECTION_COLUMN;\nTable.SELECTION_ALL = SELECTION_ALL;\nTable.SELECTION_INVERT = SELECTION_INVERT;\nTable.SELECTION_NONE = SELECTION_NONE;\nTable.Summary = TableSummary;\n\nexport { TableInner };\n\nexport default Table;\n"],"mappings":"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"}

package/es/Table/atoms/cells.d.mts

@@ -0,0 +1,42 @@
+import { TableColumnAlign, TableCustomizeComponent } from "../type.mjs";
+import { HTMLAttributes, ReactNode, Ref, TdHTMLAttributes } from "react";
+//#region src/Table/atoms/cells.d.ts
+export interface TableCellProps extends Omit<TdHTMLAttributes<HTMLTableCellElement>, 'align'> {
+  align?: TableColumnAlign;
+  appendNode?: ReactNode;
+  component?: TableCustomizeComponent;
+  ellipsis?: boolean | {
+    showTitle?: boolean;
+  };
+  fixEnd?: number;
+  fixStart?: number;
+  hovered?: boolean;
+  ref?: Ref<HTMLTableCellElement>;
+  rowType?: 'body' | 'header';
+  shadowEnd?: boolean;
+  shadowStart?: boolean;
+  sticky?: boolean;
+  zIndex?: number;
+  zIndexReverse?: number;
+}
+export declare const TableCell: ({ align, appendNode, children, className, colSpan, component, ellipsis, fixEnd, fixStart, hovered, rowSpan, rowType, shadowEnd, shadowStart, sticky, style, title, zIndex, zIndexReverse, ...rest }: TableCellProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export declare const TableHeaderCell: ({ component, ...props }: TableCellProps) => import("react").JSX.Element;
+export interface TableRowProps extends HTMLAttributes<HTMLTableRowElement> {
+  component?: TableCustomizeComponent;
+  level?: number;
+  ref?: Ref<HTMLTableRowElement>;
+  selected?: boolean;
+}
+export declare const TableRow: ({ className, component, level, selected, ...rest }: TableRowProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface TableExpandedRowProps {
+  cellComponent?: TableCustomizeComponent;
+  children?: ReactNode;
+  className?: string;
+  colSpan: number;
+  component?: TableCustomizeComponent;
+  expanded?: boolean;
+  fixed?: boolean;
+}
+export declare const TableExpandedRow: ({ cellComponent, children, className, colSpan, component, expanded, fixed }: TableExpandedRowProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+//#endregion
+//# sourceMappingURL=cells.d.mts.map

package/es/Table/atoms/cells.mjs

@@ -0,0 +1,72 @@
+"use client";
+import { PREFIX_CLS } from "../constants.mjs";
+import { createElement, isValidElement } from "react";
+import { jsx } from "react/jsx-runtime";
+import clsx$1 from "clsx";
+//#region src/Table/atoms/cells.tsx
+const CELL = `${PREFIX_CLS}-cell`;
+const getEllipsisTitle = (ellipsis, rowType, children) => {
+	const config = ellipsis === true ? { showTitle: true } : ellipsis;
+	if (!config || !(config.showTitle || rowType === "header")) return void 0;
+	if (typeof children === "string" || typeof children === "number") return String(children);
+	if (isValidElement(children)) {
+		const inner = children.props.children;
+		if (typeof inner === "string") return inner;
+	}
+};
+const TableCell = ({ align, appendNode, children, className, colSpan, component = "td", ellipsis, fixEnd, fixStart, hovered, rowSpan, rowType = "body", shadowEnd, shadowStart, sticky, style, title, zIndex, zIndexReverse, ...rest }) => {
+	const isFixStart = typeof fixStart === "number";
+	const isFixEnd = typeof fixEnd === "number";
+	const fixedStyle = {};
+	if (isFixStart) fixedStyle.insetInlineStart = fixStart;
+	if (isFixEnd) fixedStyle.insetInlineEnd = fixEnd;
+	if (isFixStart || isFixEnd) {
+		fixedStyle["--z-offset"] = zIndex;
+		fixedStyle["--z-offset-reverse"] = zIndexReverse;
+	}
+	const content = ellipsis && Boolean(isFixStart && shadowStart || isFixEnd && shadowEnd) ? /* @__PURE__ */ jsx("span", {
+		className: `${CELL}-content`,
+		children
+	}) : children;
+	return createElement(component, {
+		...rest,
+		className: clsx$1(CELL, className, (isFixStart || isFixEnd) && `${CELL}-fix`, isFixStart && `${CELL}-fix-start`, isFixEnd && `${CELL}-fix-end`, isFixStart && shadowStart && `${CELL}-fix-start-shadow`, isFixEnd && shadowEnd && `${CELL}-fix-end-shadow`, ellipsis && `${CELL}-ellipsis`, appendNode && `${CELL}-with-append`, (isFixStart || isFixEnd) && sticky && `${CELL}-fix-sticky`, hovered && `${CELL}-row-hover`),
+		colSpan: colSpan !== void 0 && colSpan !== 1 ? colSpan : void 0,
+		rowSpan: rowSpan !== void 0 && rowSpan !== 1 ? rowSpan : void 0,
+		style: {
+			...fixedStyle,
+			...align && { textAlign: align },
+			...style
+		},
+		title: title ?? getEllipsisTitle(ellipsis, rowType, children)
+	}, appendNode, content);
+};
+const TableHeaderCell = ({ component, ...props }) => /* @__PURE__ */ jsx(TableCell, {
+	rowType: "header",
+	...props,
+	component: component ?? "th"
+});
+const TableRow = ({ className, component = "tr", level, selected, ...rest }) => createElement(component, {
+	...rest,
+	className: clsx$1(level !== void 0 && `lobe-table-row`, level !== void 0 && `lobe-table-row-level-${level}`, selected && `lobe-table-row-selected`, className) || void 0
+});
+const TableExpandedRow = ({ cellComponent, children, className, colSpan, component = "tr", expanded = true, fixed }) => createElement(component, {
+	className,
+	style: { display: expanded ? void 0 : "none" }
+}, /* @__PURE__ */ jsx(TableCell, {
+	colSpan,
+	component: cellComponent,
+	children: fixed ? /* @__PURE__ */ jsx("div", {
+		className: `${PREFIX_CLS}-expanded-row-fixed`,
+		style: {
+			insetInlineStart: 0,
+			overflow: "hidden",
+			position: "sticky"
+		},
+		children
+	}) : children
+}));
+//#endregion
+export { TableCell, TableExpandedRow, TableHeaderCell, TableRow };
+
+//# sourceMappingURL=cells.mjs.map

package/es/Table/atoms/cells.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"cells.mjs","names":["clsx"],"sources":["../../../src/Table/atoms/cells.tsx"],"sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport {\n  createElement,\n  type CSSProperties,\n  type HTMLAttributes,\n  isValidElement,\n  type ReactNode,\n  type Ref,\n  type TdHTMLAttributes,\n} from 'react';\n\nimport { PREFIX_CLS } from '../constants';\nimport type { TableColumnAlign, TableCustomizeComponent } from '../type';\n\nconst CELL = `${PREFIX_CLS}-cell`;\n\nexport interface TableCellProps extends Omit<TdHTMLAttributes<HTMLTableCellElement>, 'align'> {\n  align?: TableColumnAlign;\n  appendNode?: ReactNode;\n  component?: TableCustomizeComponent;\n  ellipsis?: boolean | { showTitle?: boolean };\n  fixEnd?: number;\n  fixStart?: number;\n  hovered?: boolean;\n  ref?: Ref<HTMLTableCellElement>;\n  rowType?: 'body' | 'header';\n  shadowEnd?: boolean;\n  shadowStart?: boolean;\n  sticky?: boolean;\n  zIndex?: number;\n  zIndexReverse?: number;\n}\n\nconst getEllipsisTitle = (\n  ellipsis: TableCellProps['ellipsis'],\n  rowType: TableCellProps['rowType'],\n  children: ReactNode,\n) => {\n  const config = ellipsis === true ? { showTitle: true } : ellipsis;\n  if (!config || !(config.showTitle || rowType === 'header')) return undefined;\n  if (typeof children === 'string' || typeof children === 'number') return String(children);\n  if (isValidElement<{ children?: unknown }>(children)) {\n    const inner = children.props.children;\n    if (typeof inner === 'string') return inner;\n  }\n  return undefined;\n};\n\nexport const TableCell = ({\n  align,\n  appendNode,\n  children,\n  className,\n  colSpan,\n  component = 'td',\n  ellipsis,\n  fixEnd,\n  fixStart,\n  hovered,\n  rowSpan,\n  rowType = 'body',\n  shadowEnd,\n  shadowStart,\n  sticky,\n  style,\n  title,\n  zIndex,\n  zIndexReverse,\n  ...rest\n}: TableCellProps) => {\n  const isFixStart = typeof fixStart === 'number';\n  const isFixEnd = typeof fixEnd === 'number';\n  const fixedStyle: CSSProperties & Record<string, unknown> = {};\n  if (isFixStart) fixedStyle.insetInlineStart = fixStart;\n  if (isFixEnd) fixedStyle.insetInlineEnd = fixEnd;\n  if (isFixStart || isFixEnd) {\n    fixedStyle['--z-offset'] = zIndex;\n    fixedStyle['--z-offset-reverse'] = zIndexReverse;\n  }\n  const withShadow = Boolean((isFixStart && shadowStart) || (isFixEnd && shadowEnd));\n  const content =\n    ellipsis && withShadow ? <span className={`${CELL}-content`}>{children}</span> : children;\n\n  return createElement(\n    component,\n    {\n      ...rest,\n      className: clsx(\n        CELL,\n        className,\n        (isFixStart || isFixEnd) && `${CELL}-fix`,\n        isFixStart && `${CELL}-fix-start`,\n        isFixEnd && `${CELL}-fix-end`,\n        isFixStart && shadowStart && `${CELL}-fix-start-shadow`,\n        isFixEnd && shadowEnd && `${CELL}-fix-end-shadow`,\n        ellipsis && `${CELL}-ellipsis`,\n        appendNode && `${CELL}-with-append`,\n        (isFixStart || isFixEnd) && sticky && `${CELL}-fix-sticky`,\n        hovered && `${CELL}-row-hover`,\n      ),\n      colSpan: colSpan !== undefined && colSpan !== 1 ? colSpan : undefined,\n      rowSpan: rowSpan !== undefined && rowSpan !== 1 ? rowSpan : undefined,\n      style: { ...fixedStyle, ...(align && { textAlign: align }), ...style },\n      title: title ?? getEllipsisTitle(ellipsis, rowType, children),\n    },\n    appendNode,\n    content,\n  );\n};\n\nexport const TableHeaderCell = ({ component, ...props }: TableCellProps) => (\n  <TableCell rowType=\"header\" {...props} component={component ?? 'th'} />\n);\n\nexport interface TableRowProps extends HTMLAttributes<HTMLTableRowElement> {\n  component?: TableCustomizeComponent;\n  level?: number;\n  ref?: Ref<HTMLTableRowElement>;\n  selected?: boolean;\n}\n\nexport const TableRow = ({\n  className,\n  component = 'tr',\n  level,\n  selected,\n  ...rest\n}: TableRowProps) =>\n  createElement(component, {\n    ...rest,\n    className:\n      clsx(\n        level !== undefined && `${PREFIX_CLS}-row`,\n        level !== undefined && `${PREFIX_CLS}-row-level-${level}`,\n        selected && `${PREFIX_CLS}-row-selected`,\n        className,\n      ) || undefined,\n  });\n\nexport interface TableExpandedRowProps {\n  cellComponent?: TableCustomizeComponent;\n  children?: ReactNode;\n  className?: string;\n  colSpan: number;\n  component?: TableCustomizeComponent;\n  expanded?: boolean;\n  fixed?: boolean;\n}\n\nexport const TableExpandedRow = ({\n  cellComponent,\n  children,\n  className,\n  colSpan,\n  component = 'tr',\n  expanded = true,\n  fixed,\n}: TableExpandedRowProps) =>\n  createElement(\n    component,\n    { className, style: { display: expanded ? undefined : 'none' } },\n    <TableCell colSpan={colSpan} component={cellComponent}>\n      {fixed ? (\n        <div\n          className={`${PREFIX_CLS}-expanded-row-fixed`}\n          style={{ insetInlineStart: 0, overflow: 'hidden', position: 'sticky' }}\n        >\n          {children}\n        </div>\n      ) : (\n        children\n      )}\n    </TableCell>,\n  );\n"],"mappings":";;;;;;AAgBA,MAAM,OAAO,GAAG,WAAW;AAmB3B,MAAM,oBACJ,UACA,SACA,aACG;CACH,MAAM,SAAS,aAAa,OAAO,EAAE,WAAW,KAAK,IAAI;CACzD,IAAI,CAAC,UAAU,EAAE,OAAO,aAAa,YAAY,WAAW,OAAO,KAAA;CACnE,IAAI,OAAO,aAAa,YAAY,OAAO,aAAa,UAAU,OAAO,OAAO,QAAQ;CACxF,IAAI,eAAuC,QAAQ,GAAG;EACpD,MAAM,QAAQ,SAAS,MAAM;EAC7B,IAAI,OAAO,UAAU,UAAU,OAAO;CACxC;AAEF;AAEA,MAAa,aAAa,EACxB,OACA,YACA,UACA,WACA,SACA,YAAY,MACZ,UACA,QACA,UACA,SACA,SACA,UAAU,QACV,WACA,aACA,QACA,OACA,OACA,QACA,eACA,GAAG,WACiB;CACpB,MAAM,aAAa,OAAO,aAAa;CACvC,MAAM,WAAW,OAAO,WAAW;CACnC,MAAM,aAAsD,CAAC;CAC7D,IAAI,YAAY,WAAW,mBAAmB;CAC9C,IAAI,UAAU,WAAW,iBAAiB;CAC1C,IAAI,cAAc,UAAU;EAC1B,WAAW,gBAAgB;EAC3B,WAAW,wBAAwB;CACrC;CAEA,MAAM,UACJ,YAFiB,QAAS,cAAc,eAAiB,YAAY,SAEhD,IAAI,oBAAC,QAAD;EAAM,WAAW,GAAG,KAAK;EAAY;CAAe,CAAA,IAAI;CAEnF,OAAO,cACL,WACA;EACE,GAAG;EACH,WAAWA,OACT,MACA,YACC,cAAc,aAAa,GAAG,KAAK,OACpC,cAAc,GAAG,KAAK,aACtB,YAAY,GAAG,KAAK,WACpB,cAAc,eAAe,GAAG,KAAK,oBACrC,YAAY,aAAa,GAAG,KAAK,kBACjC,YAAY,GAAG,KAAK,YACpB,cAAc,GAAG,KAAK,gBACrB,cAAc,aAAa,UAAU,GAAG,KAAK,cAC9C,WAAW,GAAG,KAAK,WACrB;EACA,SAAS,YAAY,KAAA,KAAa,YAAY,IAAI,UAAU,KAAA;EAC5D,SAAS,YAAY,KAAA,KAAa,YAAY,IAAI,UAAU,KAAA;EAC5D,OAAO;GAAE,GAAG;GAAY,GAAI,SAAS,EAAE,WAAW,MAAM;GAAI,GAAG;EAAM;EACrE,OAAO,SAAS,iBAAiB,UAAU,SAAS,QAAQ;CAC9D,GACA,YACA,OACF;AACF;AAEA,MAAa,mBAAmB,EAAE,WAAW,GAAG,YAC9C,oBAAC,WAAD;CAAW,SAAQ;CAAS,GAAI;CAAO,WAAW,aAAa;AAAO,CAAA;AAUxE,MAAa,YAAY,EACvB,WACA,YAAY,MACZ,OACA,UACA,GAAG,WAEH,cAAc,WAAW;CACvB,GAAG;CACH,WACEA,OACE,UAAU,KAAA,KAAa,kBACvB,UAAU,KAAA,KAAa,wBAA2B,SAClD,YAAY,2BACZ,SACF,KAAK,KAAA;AACT,CAAC;AAYH,MAAa,oBAAoB,EAC/B,eACA,UACA,WACA,SACA,YAAY,MACZ,WAAW,MACX,YAEA,cACE,WACA;CAAE;CAAW,OAAO,EAAE,SAAS,WAAW,KAAA,IAAY,OAAO;AAAE,GAC/D,oBAAC,WAAD;CAAoB;CAAS,WAAW;CACrC,UAAA,QACC,oBAAC,OAAD;EACE,WAAW,GAAG,WAAW;EACzB,OAAO;GAAE,kBAAkB;GAAG,UAAU;GAAU,UAAU;EAAS;EAEpE;CACE,CAAA,IAEL;AAEO,CAAA,CACb"}

package/es/Table/atoms/index.d.mts

@@ -0,0 +1,3 @@
+import { TableCell, TableCellProps, TableExpandedRow, TableExpandedRowProps, TableHeaderCell, TableRow, TableRowProps } from "./cells.mjs";
+import { TableBody, TableColGroup, TableColGroupColumn, TableColGroupProps, TableContainer, TableElement, TableElementProps, TableFooter, TableHeader, TablePartProps, TableRoot, TableRootProps, TableScroll, TableScrollProps, TableSectionProps, TableSummaryFoot, TableTitle } from "./layout.mjs";
+export { TableBody, TableCell, type TableCellProps, TableColGroup, type TableColGroupColumn, type TableColGroupProps, TableContainer, TableElement, type TableElementProps, TableExpandedRow, type TableExpandedRowProps, TableFooter, TableHeader, TableHeaderCell, type TablePartProps, TableRoot, type TableRootProps, TableRow, type TableRowProps, TableScroll, type TableScrollProps, type TableSectionProps, TableSummaryFoot, TableTitle };

package/es/Table/atoms/layout.d.mts

@@ -0,0 +1,44 @@
+import { TableCustomizeComponent, TableSize, TableVariant } from "../type.mjs";
+import { HTMLAttributes, Ref, TableHTMLAttributes } from "react";
+//#region src/Table/atoms/layout.d.ts
+export interface TableRootProps extends HTMLAttributes<HTMLDivElement> {
+  grouped?: boolean;
+  hoverable?: boolean;
+  ref?: Ref<HTMLDivElement>;
+  size?: TableSize;
+  variant?: TableVariant;
+}
+export declare const TableRoot: ({ className, grouped, hoverable, size, variant, ...rest }: TableRootProps) => import("react").JSX.Element;
+export interface TablePartProps extends HTMLAttributes<HTMLDivElement> {
+  ref?: Ref<HTMLDivElement>;
+}
+export declare const TableContainer: ({ className, ...rest }: TablePartProps) => import("react").JSX.Element;
+export interface TableScrollProps extends TablePartProps {
+  part?: 'body' | 'content' | 'header' | 'summary';
+}
+export declare const TableScroll: ({ className, part, ...rest }: TableScrollProps) => import("react").JSX.Element;
+export declare const TableTitle: ({ className, ...rest }: TablePartProps) => import("react").JSX.Element;
+export declare const TableFooter: ({ className, ...rest }: TablePartProps) => import("react").JSX.Element;
+export interface TableElementProps extends TableHTMLAttributes<HTMLTableElement> {
+  component?: TableCustomizeComponent;
+  ref?: Ref<HTMLTableElement>;
+}
+export declare const TableElement: ({ component, ...rest }: TableElementProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface TableColGroupColumn {
+  className?: string;
+  minWidth?: number | string;
+  width?: number | string;
+}
+export interface TableColGroupProps {
+  columns: readonly TableColGroupColumn[];
+}
+export declare const TableColGroup: ({ columns }: TableColGroupProps) => import("react").JSX.Element | null;
+export interface TableSectionProps extends HTMLAttributes<HTMLTableSectionElement> {
+  component?: TableCustomizeComponent;
+  ref?: Ref<HTMLTableSectionElement>;
+}
+export declare const TableHeader: ({ className, component, ...rest }: TableSectionProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export declare const TableBody: ({ className, component, ...rest }: TableSectionProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export declare const TableSummaryFoot: ({ className, ...rest }: TableSectionProps) => import("react").JSX.Element;
+//#endregion
+//# sourceMappingURL=layout.d.mts.map

package/es/Table/atoms/layout.mjs

@@ -0,0 +1,62 @@
+"use client";
+import { PREFIX_CLS, SIZE_CLASS } from "../constants.mjs";
+import { createElement } from "react";
+import { jsx } from "react/jsx-runtime";
+import clsx$1 from "clsx";
+//#region src/Table/atoms/layout.tsx
+const TableRoot = ({ className, grouped, hoverable = true, size = "middle", variant = "borderless", ...rest }) => /* @__PURE__ */ jsx("div", {
+	...rest,
+	className: clsx$1(PREFIX_CLS, SIZE_CLASS[size], `${PREFIX_CLS}-${variant}`, grouped && `lobe-table-grouped`, hoverable && `lobe-table-hoverable`, className)
+});
+const TableContainer = ({ className, ...rest }) => /* @__PURE__ */ jsx("div", {
+	...rest,
+	className: clsx$1(`${PREFIX_CLS}-container`, className)
+});
+const TableScroll = ({ className, part = "content", ...rest }) => /* @__PURE__ */ jsx("div", {
+	...rest,
+	className: clsx$1(`${PREFIX_CLS}-${part}`, className)
+});
+const TableTitle = ({ className, ...rest }) => /* @__PURE__ */ jsx("div", {
+	...rest,
+	className: clsx$1(`${PREFIX_CLS}-title`, className)
+});
+const TableFooter = ({ className, ...rest }) => /* @__PURE__ */ jsx("div", {
+	...rest,
+	className: clsx$1(`${PREFIX_CLS}-footer`, className)
+});
+const TableElement = ({ component = "table", ...rest }) => createElement(component, rest);
+const TableColGroup = ({ columns }) => {
+	const cols = [];
+	let mustInsert = false;
+	for (let index = columns.length - 1; index >= 0; index -= 1) {
+		const { className, minWidth, width } = columns[index];
+		if (width || minWidth || className || mustInsert) {
+			const style = {
+				minWidth,
+				width
+			};
+			cols.unshift(/* @__PURE__ */ jsx("col", {
+				className,
+				style
+			}, index));
+			mustInsert = true;
+		}
+	}
+	return cols.length > 0 ? /* @__PURE__ */ jsx("colgroup", { children: cols }) : null;
+};
+const TableHeader = ({ className, component = "thead", ...rest }) => createElement(component, {
+	...rest,
+	className: clsx$1(`${PREFIX_CLS}-thead`, className)
+});
+const TableBody = ({ className, component = "tbody", ...rest }) => createElement(component, {
+	...rest,
+	className: clsx$1(`${PREFIX_CLS}-tbody`, className)
+});
+const TableSummaryFoot = ({ className, ...rest }) => /* @__PURE__ */ jsx("tfoot", {
+	...rest,
+	className: clsx$1(`${PREFIX_CLS}-summary`, className)
+});
+//#endregion
+export { TableBody, TableColGroup, TableContainer, TableElement, TableFooter, TableHeader, TableRoot, TableScroll, TableSummaryFoot, TableTitle };
+
+//# sourceMappingURL=layout.mjs.map

package/es/Table/atoms/layout.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.mjs","names":["clsx"],"sources":["../../../src/Table/atoms/layout.tsx"],"sourcesContent":["'use client';\n\nimport '../style.css';\n\nimport clsx from 'clsx';\nimport {\n  createElement,\n  type CSSProperties,\n  type HTMLAttributes,\n  type ReactNode,\n  type Ref,\n  type TableHTMLAttributes,\n} from 'react';\n\nimport { PREFIX_CLS, SIZE_CLASS } from '../constants';\nimport type { TableCustomizeComponent, TableSize, TableVariant } from '../type';\n\nexport interface TableRootProps extends HTMLAttributes<HTMLDivElement> {\n  grouped?: boolean;\n  hoverable?: boolean;\n  ref?: Ref<HTMLDivElement>;\n  size?: TableSize;\n  variant?: TableVariant;\n}\n\nexport const TableRoot = ({\n  className,\n  grouped,\n  hoverable = true,\n  size = 'middle',\n  variant = 'borderless',\n  ...rest\n}: TableRootProps) => (\n  <div\n    {...rest}\n    className={clsx(\n      PREFIX_CLS,\n      SIZE_CLASS[size],\n      `${PREFIX_CLS}-${variant}`,\n      grouped && `${PREFIX_CLS}-grouped`,\n      hoverable && `${PREFIX_CLS}-hoverable`,\n      className,\n    )}\n  />\n);\n\nexport interface TablePartProps extends HTMLAttributes<HTMLDivElement> {\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport const TableContainer = ({ className, ...rest }: TablePartProps) => (\n  <div {...rest} className={clsx(`${PREFIX_CLS}-container`, className)} />\n);\n\nexport interface TableScrollProps extends TablePartProps {\n  part?: 'body' | 'content' | 'header' | 'summary';\n}\n\nexport const TableScroll = ({ className, part = 'content', ...rest }: TableScrollProps) => (\n  <div {...rest} className={clsx(`${PREFIX_CLS}-${part}`, className)} />\n);\n\nexport const TableTitle = ({ className, ...rest }: TablePartProps) => (\n  <div {...rest} className={clsx(`${PREFIX_CLS}-title`, className)} />\n);\n\nexport const TableFooter = ({ className, ...rest }: TablePartProps) => (\n  <div {...rest} className={clsx(`${PREFIX_CLS}-footer`, className)} />\n);\n\nexport interface TableElementProps extends TableHTMLAttributes<HTMLTableElement> {\n  component?: TableCustomizeComponent;\n  ref?: Ref<HTMLTableElement>;\n}\n\nexport const TableElement = ({ component = 'table', ...rest }: TableElementProps) =>\n  createElement(component, rest);\n\nexport interface TableColGroupColumn {\n  className?: string;\n  minWidth?: number | string;\n  width?: number | string;\n}\n\nexport interface TableColGroupProps {\n  columns: readonly TableColGroupColumn[];\n}\n\nexport const TableColGroup = ({ columns }: TableColGroupProps) => {\n  const cols: ReactNode[] = [];\n  let mustInsert = false;\n  for (let index = columns.length - 1; index >= 0; index -= 1) {\n    const { className, minWidth, width } = columns[index];\n    if (width || minWidth || className || mustInsert) {\n      const style: CSSProperties = { minWidth, width };\n      cols.unshift(<col className={className} key={index} style={style} />);\n      mustInsert = true;\n    }\n  }\n  return cols.length > 0 ? <colgroup>{cols}</colgroup> : null;\n};\n\nexport interface TableSectionProps extends HTMLAttributes<HTMLTableSectionElement> {\n  component?: TableCustomizeComponent;\n  ref?: Ref<HTMLTableSectionElement>;\n}\n\nexport const TableHeader = ({ className, component = 'thead', ...rest }: TableSectionProps) =>\n  createElement(component, { ...rest, className: clsx(`${PREFIX_CLS}-thead`, className) });\n\nexport const TableBody = ({ className, component = 'tbody', ...rest }: TableSectionProps) =>\n  createElement(component, { ...rest, className: clsx(`${PREFIX_CLS}-tbody`, className) });\n\nexport const TableSummaryFoot = ({ className, ...rest }: TableSectionProps) => (\n  <tfoot {...rest} className={clsx(`${PREFIX_CLS}-summary`, className)} />\n);\n"],"mappings":";;;;;;AAyBA,MAAa,aAAa,EACxB,WACA,SACA,YAAY,MACZ,OAAO,UACP,UAAU,cACV,GAAG,WAEH,oBAAC,OAAD;CACE,GAAI;CACJ,WAAWA,OACT,YACA,WAAW,OACX,GAAG,WAAW,GAAG,WACjB,WAAW,sBACX,aAAa,wBACb,SACF;AACD,CAAA;AAOH,MAAa,kBAAkB,EAAE,WAAW,GAAG,WAC7C,oBAAC,OAAD;CAAK,GAAI;CAAM,WAAWA,OAAK,GAAG,WAAW,aAAa,SAAS;AAAI,CAAA;AAOzE,MAAa,eAAe,EAAE,WAAW,OAAO,WAAW,GAAG,WAC5D,oBAAC,OAAD;CAAK,GAAI;CAAM,WAAWA,OAAK,GAAG,WAAW,GAAG,QAAQ,SAAS;AAAI,CAAA;AAGvE,MAAa,cAAc,EAAE,WAAW,GAAG,WACzC,oBAAC,OAAD;CAAK,GAAI;CAAM,WAAWA,OAAK,GAAG,WAAW,SAAS,SAAS;AAAI,CAAA;AAGrE,MAAa,eAAe,EAAE,WAAW,GAAG,WAC1C,oBAAC,OAAD;CAAK,GAAI;CAAM,WAAWA,OAAK,GAAG,WAAW,UAAU,SAAS;AAAI,CAAA;AAQtE,MAAa,gBAAgB,EAAE,YAAY,SAAS,GAAG,WACrD,cAAc,WAAW,IAAI;AAY/B,MAAa,iBAAiB,EAAE,cAAkC;CAChE,MAAM,OAAoB,CAAC;CAC3B,IAAI,aAAa;CACjB,KAAK,IAAI,QAAQ,QAAQ,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG;EAC3D,MAAM,EAAE,WAAW,UAAU,UAAU,QAAQ;EAC/C,IAAI,SAAS,YAAY,aAAa,YAAY;GAChD,MAAM,QAAuB;IAAE;IAAU;GAAM;GAC/C,KAAK,QAAQ,oBAAC,OAAD;IAAgB;IAA8B;GAAQ,GAAtB,KAAsB,CAAC;GACpE,aAAa;EACf;CACF;CACA,OAAO,KAAK,SAAS,IAAI,oBAAC,YAAD,EAAA,UAAW,KAAe,CAAA,IAAI;AACzD;AAOA,MAAa,eAAe,EAAE,WAAW,YAAY,SAAS,GAAG,WAC/D,cAAc,WAAW;CAAE,GAAG;CAAM,WAAWA,OAAK,GAAG,WAAW,SAAS,SAAS;AAAE,CAAC;AAEzF,MAAa,aAAa,EAAE,WAAW,YAAY,SAAS,GAAG,WAC7D,cAAc,WAAW;CAAE,GAAG;CAAM,WAAWA,OAAK,GAAG,WAAW,SAAS,SAAS;AAAE,CAAC;AAEzF,MAAa,oBAAoB,EAAE,WAAW,GAAG,WAC/C,oBAAC,SAAD;CAAO,GAAI;CAAM,WAAWA,OAAK,GAAG,WAAW,WAAW,SAAS;AAAI,CAAA"}

package/es/Table/constants.mjs

@@ -0,0 +1,16 @@
+//#region src/Table/constants.ts
+const PREFIX_CLS = "lobe-table";
+const VIRTUAL_ROW_HEIGHT = {
+	large: 55,
+	middle: 47,
+	small: 39
+};
+const SIZE_CLASS = {
+	large: `${PREFIX_CLS}-large`,
+	middle: `${PREFIX_CLS}-medium`,
+	small: `${PREFIX_CLS}-small`
+};
+//#endregion
+export { PREFIX_CLS, SIZE_CLASS, VIRTUAL_ROW_HEIGHT };
+
+//# sourceMappingURL=constants.mjs.map

package/es/Table/constants.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.mjs","names":[],"sources":["../../src/Table/constants.ts"],"sourcesContent":["import type { TableSize } from './type';\n\nexport const PREFIX_CLS = 'lobe-table';\n\nexport const EXPAND_COLUMN_WIDTH = 48;\nexport const SELECTION_COLUMN_WIDTH = 32;\nexport const SELECTION_DROPDOWN_WIDTH = 24;\nexport const DEFAULT_INDENT_SIZE = 15;\n\nexport const VIRTUAL_ROW_HEIGHT: Record<TableSize, number> = {\n  large: 16 * 2 + 22 + 1,\n  middle: 12 * 2 + 22 + 1,\n  small: 8 * 2 + 22 + 1,\n};\n\nexport const SIZE_CLASS: Record<TableSize, string> = {\n  large: `${PREFIX_CLS}-large`,\n  middle: `${PREFIX_CLS}-medium`,\n  small: `${PREFIX_CLS}-small`,\n};\n"],"mappings":";AAEA,MAAa,aAAa;AAO1B,MAAa,qBAAgD;CAC3D,OAAO;CACP,QAAQ;CACR,OAAO;AACT;AAEA,MAAa,aAAwC;CACnD,OAAO,GAAG,WAAW;CACrB,QAAQ,GAAG,WAAW;CACtB,OAAO,GAAG,WAAW;AACvB"}

package/es/Table/engine/fixed.d.mts

@@ -0,0 +1 @@
+import "./types.mjs";

package/es/Table/engine/fixed.mjs

@@ -0,0 +1,53 @@
+//#region src/Table/engine/fixed.ts
+const getStickyOffsets = (widths, leaves) => {
+	const count = leaves.length;
+	const collect = (from, to, step) => {
+		const offsets = [];
+		let total = 0;
+		for (let index = from; index !== to; index += step) {
+			offsets.push(total);
+			if (leaves[index].fixed) total += widths[index] || 0;
+		}
+		return offsets;
+	};
+	return {
+		end: collect(count - 1, -1, -1).reverse(),
+		start: collect(0, count, 1),
+		widths
+	};
+};
+const isStart = (column) => column?.fixed === "start";
+const isEnd = (column) => column?.fixed === "end";
+const getFixedInfo = (colStart, colEnd, leaves, offsets) => {
+	const count = leaves.length;
+	const info = {
+		offsetFixedEndShadow: 0,
+		offsetFixedStartShadow: 0,
+		shadowEnd: false,
+		shadowStart: false,
+		zIndex: 0,
+		zIndexReverse: 0
+	};
+	if (isStart(leaves[colStart]) && isStart(leaves[colEnd])) {
+		info.fixStart = offsets.start[colStart];
+		info.shadowStart = !isStart(leaves[colEnd + 1]);
+		info.zIndex = count * 2 - colStart;
+		info.zIndexReverse = count + colStart;
+	} else if (isEnd(leaves[colEnd]) && isEnd(leaves[colStart])) {
+		info.fixEnd = offsets.end[colEnd];
+		info.shadowEnd = !isEnd(leaves[colStart - 1]);
+		info.zIndex = colEnd;
+		info.zIndexReverse = count - colEnd;
+	}
+	if (info.shadowStart) {
+		for (let index = 0; index < colStart; index += 1) if (!isStart(leaves[index])) info.offsetFixedStartShadow += offsets.widths[index] || 0;
+	}
+	if (info.shadowEnd) {
+		for (let index = count - 1; index > colEnd; index -= 1) if (!isEnd(leaves[index])) info.offsetFixedEndShadow += offsets.widths[index] || 0;
+	}
+	return info;
+};
+//#endregion
+export { getFixedInfo, getStickyOffsets };
+
+//# sourceMappingURL=fixed.mjs.map

package/es/Table/engine/fixed.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"fixed.mjs","names":[],"sources":["../../../src/Table/engine/fixed.ts"],"sourcesContent":["import type { EngineColumn, FixedInfo } from './types';\n\nexport interface StickyOffsets {\n  end: number[];\n  start: number[];\n  widths: readonly number[];\n}\n\nexport const getStickyOffsets = (\n  widths: readonly number[],\n  leaves: readonly Pick<EngineColumn, 'fixed'>[],\n): StickyOffsets => {\n  const count = leaves.length;\n  const collect = (from: number, to: number, step: number) => {\n    const offsets: number[] = [];\n    let total = 0;\n    for (let index = from; index !== to; index += step) {\n      offsets.push(total);\n      if (leaves[index].fixed) total += widths[index] || 0;\n    }\n    return offsets;\n  };\n  return { end: collect(count - 1, -1, -1).reverse(), start: collect(0, count, 1), widths };\n};\n\nconst isStart = (column?: Pick<EngineColumn, 'fixed'>) => column?.fixed === 'start';\nconst isEnd = (column?: Pick<EngineColumn, 'fixed'>) => column?.fixed === 'end';\n\nexport const getFixedInfo = (\n  colStart: number,\n  colEnd: number,\n  leaves: readonly Pick<EngineColumn, 'fixed'>[],\n  offsets: StickyOffsets,\n): FixedInfo => {\n  const count = leaves.length;\n  const info: FixedInfo = {\n    offsetFixedEndShadow: 0,\n    offsetFixedStartShadow: 0,\n    shadowEnd: false,\n    shadowStart: false,\n    zIndex: 0,\n    zIndexReverse: 0,\n  };\n\n  if (isStart(leaves[colStart]) && isStart(leaves[colEnd])) {\n    info.fixStart = offsets.start[colStart];\n    info.shadowStart = !isStart(leaves[colEnd + 1]);\n    info.zIndex = count * 2 - colStart;\n    info.zIndexReverse = count + colStart;\n  } else if (isEnd(leaves[colEnd]) && isEnd(leaves[colStart])) {\n    info.fixEnd = offsets.end[colEnd];\n    info.shadowEnd = !isEnd(leaves[colStart - 1]);\n    info.zIndex = colEnd;\n    info.zIndexReverse = count - colEnd;\n  }\n\n  if (info.shadowStart) {\n    for (let index = 0; index < colStart; index += 1) {\n      if (!isStart(leaves[index])) info.offsetFixedStartShadow += offsets.widths[index] || 0;\n    }\n  }\n  if (info.shadowEnd) {\n    for (let index = count - 1; index > colEnd; index -= 1) {\n      if (!isEnd(leaves[index])) info.offsetFixedEndShadow += offsets.widths[index] || 0;\n    }\n  }\n  return info;\n};\n"],"mappings":";AAQA,MAAa,oBACX,QACA,WACkB;CAClB,MAAM,QAAQ,OAAO;CACrB,MAAM,WAAW,MAAc,IAAY,SAAiB;EAC1D,MAAM,UAAoB,CAAC;EAC3B,IAAI,QAAQ;EACZ,KAAK,IAAI,QAAQ,MAAM,UAAU,IAAI,SAAS,MAAM;GAClD,QAAQ,KAAK,KAAK;GAClB,IAAI,OAAO,MAAM,CAAC,OAAO,SAAS,OAAO,UAAU;EACrD;EACA,OAAO;CACT;CACA,OAAO;EAAE,KAAK,QAAQ,QAAQ,GAAG,IAAI,EAAE,CAAC,CAAC,QAAQ;EAAG,OAAO,QAAQ,GAAG,OAAO,CAAC;EAAG;CAAO;AAC1F;AAEA,MAAM,WAAW,WAAyC,QAAQ,UAAU;AAC5E,MAAM,SAAS,WAAyC,QAAQ,UAAU;AAE1E,MAAa,gBACX,UACA,QACA,QACA,YACc;CACd,MAAM,QAAQ,OAAO;CACrB,MAAM,OAAkB;EACtB,sBAAsB;EACtB,wBAAwB;EACxB,WAAW;EACX,aAAa;EACb,QAAQ;EACR,eAAe;CACjB;CAEA,IAAI,QAAQ,OAAO,SAAS,KAAK,QAAQ,OAAO,OAAO,GAAG;EACxD,KAAK,WAAW,QAAQ,MAAM;EAC9B,KAAK,cAAc,CAAC,QAAQ,OAAO,SAAS,EAAE;EAC9C,KAAK,SAAS,QAAQ,IAAI;EAC1B,KAAK,gBAAgB,QAAQ;CAC/B,OAAO,IAAI,MAAM,OAAO,OAAO,KAAK,MAAM,OAAO,SAAS,GAAG;EAC3D,KAAK,SAAS,QAAQ,IAAI;EAC1B,KAAK,YAAY,CAAC,MAAM,OAAO,WAAW,EAAE;EAC5C,KAAK,SAAS;EACd,KAAK,gBAAgB,QAAQ;CAC/B;CAEA,IAAI,KAAK,aACF;OAAA,IAAI,QAAQ,GAAG,QAAQ,UAAU,SAAS,GAC7C,IAAI,CAAC,QAAQ,OAAO,MAAM,GAAG,KAAK,0BAA0B,QAAQ,OAAO,UAAU;CAAA;CAGzF,IAAI,KAAK,WACF;OAAA,IAAI,QAAQ,QAAQ,GAAG,QAAQ,QAAQ,SAAS,GACnD,IAAI,CAAC,MAAM,OAAO,MAAM,GAAG,KAAK,wBAAwB,QAAQ,OAAO,UAAU;CAAA;CAGrF,OAAO;AACT"}

package/es/Table/engine/types.d.mts

@@ -0,0 +1 @@
+import { Key } from "react";