@galaxy-io/dls 1.6.1 → 2.0.1

package/dist/table/SpreadsheetCellEditor.d.ts

@@ -1,11 +1,59 @@
-import React from "react";
-import { SpreadsheetCellType } from "./types";
+import { type MutableRefObject } from "react";
+import { type DateInputSize } from "../inputs/DateInput.js";
+import type { InputSize } from "../inputs/Input.js";
+import { type SelectInputSize, type SelectOption } from "../inputs/SelectInput.js";
+import { type SwitchInputSize } from "../inputs/SwitchInput.js";
+/** @internal Which editor to render (InfiniteSpreadsheet maps its `SpreadsheetCellType` here). */
+export declare enum SpreadsheetEditorKind {
+    /** TextInput. */
+    TEXT = "TEXT",
+    /** NumberInput. */
+    NUMBER = "NUMBER",
+    /** SwitchInput. */
+    BOOLEAN = "BOOLEAN",
+    /** SelectInput. */
+    ENUM = "ENUM",
+    /** DateInput. */
+    DATE = "DATE"
+}
+/** @internal How editing began: Enter / F2 / a click selects the text; typing starts with that character. */
+export type SpreadsheetEditEntry = {
+    kind: "select";
+} | {
+    kind: "char";
+    char: string;
+};
+/** @internal The editor sizes of one grid rung. */
+export interface SpreadsheetEditorSizes {
+    input: InputSize;
+    select: SelectInputSize;
+    date: DateInputSize;
+    switchInput: SwitchInputSize;
+}
+/** @internal Props of `SpreadsheetCellEditor`. */
 export interface SpreadsheetCellEditorProps {
-    cellType: SpreadsheetCellType;
+    /** The editor for the column's value type. */
+    kind: SpreadsheetEditorKind;
+    /** The cell's current value. */
     value: unknown;
-    enumOptions?: string[];
+    /** The column header: the editor's accessible name. */
+    header: string;
+    /** ENUM choices. */
+    options: SelectOption[] | undefined;
+    /** Editor sizes for the grid's rung. */
+    sizes: SpreadsheetEditorSizes;
+    /** How editing began. */
+    entry: SpreadsheetEditEntry;
+    /** The host reads the current draft through this (outside presses). */
+    draftRef: MutableRefObject<(() => unknown) | null>;
+    /** Commit a value (the host reports it only if it changed). */
     onCommit: (value: unknown) => void;
+    /** Leave without committing. */
     onCancel: () => void;
+    /** Commit the draft and move to the next (or previous) cell. */
+    onTab: (value: unknown, isBackward: boolean) => void;
+    /** A select or date panel opened or closed. */
+    onPanelOpenChange: (isOpen: boolean) => void;
 }
-declare function SpreadsheetCellEditor({ cellType, value, enumOptions, onCommit, onCancel, }: SpreadsheetCellEditorProps): React.JSX.Element;
-export default SpreadsheetCellEditor;
+/** The in-cell editor. */
+export declare function SpreadsheetCellEditor({ kind, value, header, options, sizes, entry, draftRef, onCommit, onCancel, onTab, onPanelOpenChange, }: SpreadsheetCellEditorProps): import("react").JSX.Element;

package/dist/table/SpreadsheetCellEditor.js

@@ -1,101 +1,180 @@
-import { SpreadsheetCellType } from "./types.js";
-import { CellEditorWrapper } from "./SpreadsheetPrimitives.js";
+import { FontFamily } from "../theme/enums.js";
+import { BareFieldContext } from "../inputs/internal/bareField.js";
+import TextInput from "../inputs/TextInput.js";
 import SelectInput from "../inputs/SelectInput.js";
 import DateInput from "../inputs/DateInput.js";
 import NumberInput from "../inputs/NumberInput.js";
-import TextInput from "../inputs/TextInput.js";
-import ToggleInput from "../inputs/ToggleInput.js";
-import { match } from "ts-pattern";
-import { useCallback, useEffect, useRef, useState } from "react";
+import SwitchInput from "../inputs/SwitchInput.js";
+/* empty css                                */
+import { styled } from "@linaria/react";
+import { useEffect, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/table/SpreadsheetCellEditor.tsx
 /**
-* `Dropdown` renders through a Tippy portal on `document.body`, so an option
-* list is not a DOM descendant of the editor. Tippy marks its portal root with
-* this attribute — without the check, pressing an option counts as an outside
-* press, commits, and unmounts the editor before the click can land.
+* @internal Shared by InfiniteSpreadsheet; apps use InfiniteSpreadsheet.
+*
+* The in-cell editor: one 2.0 input per value type at the grid rung's size, `fillWidth`, focused on
+* mount, rendered bare (`BareFieldContext`): no border, fill, focus line or start padding, so the
+* value's text stays exactly where the read-only cell drew it and the cell's own selection outline
+* is the only focus cue. Every way out goes through the host's callbacks, so the commit
+* rule (report only changed values) lives in one place:
+* - Enter (TextInput / NumberInput `onEnter`), a choice in SelectInput / DateInput, any toggle of
+*   SwitchInput → `onCommit`.
+* - Tab / Shift+Tab → `onTab` with the current draft (captured before the inputs see the key).
+* - Escape → `onCancel` (captured, so NumberInput's own draft reset does not take a first press).
+*   While a select or date panel is open, Escape and Tab belong to the panel.
+* The host reads the draft through `draftRef` when a press lands outside the cell.
 */
-var TIPPY_PORTAL_SELECTOR = "[data-tippy-root]";
-function isInsidePortal(target) {
-	return target instanceof Element && target.closest(TIPPY_PORTAL_SELECTOR) !== null;
+/** @internal Which editor to render (InfiniteSpreadsheet maps its `SpreadsheetCellType` here). */
+var SpreadsheetEditorKind = /* @__PURE__ */ function(SpreadsheetEditorKind) {
+	/** TextInput. */
+	SpreadsheetEditorKind["TEXT"] = "TEXT";
+	/** NumberInput. */
+	SpreadsheetEditorKind["NUMBER"] = "NUMBER";
+	/** SwitchInput. */
+	SpreadsheetEditorKind["BOOLEAN"] = "BOOLEAN";
+	/** SelectInput. */
+	SpreadsheetEditorKind["ENUM"] = "ENUM";
+	/** DateInput. */
+	SpreadsheetEditorKind["DATE"] = "DATE";
+	return SpreadsheetEditorKind;
+}({});
+/** Fills the editing cell. */
+var Root = /*#__PURE__*/ styled("div")({
+	name: "Root",
+	class: "gx-SpreadsheetCellEditor-r1scgnu2",
+	propsAsIs: false
+});
+/** NumberInput's draft text → the value it would commit (`undefined`: unparseable, keep the value). */
+function parseNumberDraft(text) {
+	const cleaned = text.replace(/,/g, "").trim();
+	if (cleaned === "" || cleaned === "-" || cleaned === "." || cleaned === "-.") return null;
+	const parsed = Number(cleaned);
+	return Number.isNaN(parsed) ? void 0 : parsed;
 }
-function SpreadsheetCellEditor({ cellType, value, enumOptions, onCommit, onCancel }) {
-	const wrapperRef = useRef(null);
-	const [localValue, setLocalValue] = useState(value);
-	const commitRef = useRef(() => {});
-	useEffect(() => {
-		commitRef.current = () => onCommit(localValue);
-	});
+/** The in-cell editor. */
+function SpreadsheetCellEditor({ kind, value, header, options, sizes, entry, draftRef, onCommit, onCancel, onTab, onPanelOpenChange }) {
+	const rootRef = useRef(null);
+	const inputRef = useRef(null);
+	const triggerRef = useRef(null);
+	const [isPanelOpen, setIsPanelOpen] = useState(kind === "ENUM" || kind === "DATE");
+	const handlePanelOpenChange = (isOpen) => {
+		setIsPanelOpen(isOpen);
+		onPanelOpenChange(isOpen);
+	};
+	const [text, setText] = useState(entry.kind === "char" ? entry.char : typeof value === "string" ? value : value === null || value === void 0 ? "" : String(value));
+	const textRef = useRef(text);
+	textRef.current = text;
+	const initialNumber = entry.kind === "char" ? parseNumberDraft(entry.char) ?? null : typeof value === "number" ? value : null;
+	draftRef.current = () => {
+		switch (kind) {
+			case "TEXT": return textRef.current;
+			case "NUMBER": {
+				const parsed = parseNumberDraft(inputRef.current?.value ?? "");
+				return parsed === void 0 ? value : parsed;
+			}
+			default: return value;
+		}
+	};
+	useEffect(() => () => {
+		draftRef.current = null;
+	}, [draftRef]);
+	const mountRef = useRef({ isSelect: entry.kind === "select" });
 	useEffect(() => {
-		const onPointerDown = (event) => {
-			const wrapper = wrapperRef.current;
-			if (!wrapper) return;
-			const target = event.target;
-			if (target && wrapper.contains(target)) return;
-			if (isInsidePortal(event.target)) return;
-			commitRef.current();
-		};
-		document.addEventListener("pointerdown", onPointerDown);
-		return () => document.removeEventListener("pointerdown", onPointerDown);
+		const input = inputRef.current;
+		if (input !== null) {
+			input.focus();
+			if (mountRef.current.isSelect && input.type !== "checkbox") input.select();
+			else if (input.type !== "checkbox") input.setSelectionRange(input.value.length, input.value.length);
+			return;
+		}
+		if (!rootRef.current?.contains(document.activeElement)) triggerRef.current?.focus();
 	}, []);
-	const handleKeyDown = useCallback((e) => {
-		if (e.key === "Enter" && !e.shiftKey) {
-			e.preventDefault();
-			onCommit(localValue);
-		} else if (e.key === "Escape") {
-			e.preventDefault();
+	const handleKeyDownCapture = (event) => {
+		if (isPanelOpen) return;
+		if (event.key === "Escape") {
+			event.preventDefault();
+			event.stopPropagation();
 			onCancel();
-		} else if (e.key === "Tab") {
-			e.preventDefault();
-			onCommit(localValue);
+		} else if (event.key === "Tab") {
+			event.preventDefault();
+			event.stopPropagation();
+			onTab(draftRef.current?.() ?? value, event.shiftKey);
 		}
-	}, [
-		localValue,
-		onCommit,
-		onCancel
-	]);
-	return /* @__PURE__ */ jsx(CellEditorWrapper, {
-		ref: wrapperRef,
-		children: match(cellType).with(SpreadsheetCellType.TEXT, () => /* @__PURE__ */ jsx(TextInput, {
-			value: String(localValue ?? ""),
-			onChange: (v) => setLocalValue(v),
-			onKeyDown: handleKeyDown,
-			autoFocus: true,
-			fillWidth: true
-		})).with(SpreadsheetCellType.NUMBER, () => /* @__PURE__ */ jsx(NumberInput, {
-			value: Number(localValue ?? 0),
-			onChange: (v) => setLocalValue(v),
-			onKeyDown: handleKeyDown,
-			autoFocus: true,
-			fillWidth: true
-		})).with(SpreadsheetCellType.BOOLEAN, () => /* @__PURE__ */ jsx(ToggleInput, {
-			value: Boolean(localValue),
-			onChange: (v) => {
-				onCommit(v);
-			}
-		})).with(SpreadsheetCellType.ENUM, () => {
-			const options = (enumOptions ?? []).map((opt) => ({
-				id: opt,
-				label: opt,
-				value: opt
-			}));
-			return /* @__PURE__ */ jsx(SelectInput, {
-				options,
-				value: options.find((o) => o.value === localValue) ?? null,
-				onChange: (opt) => {
-					onCommit(opt.value);
-				},
+	};
+	let editor;
+	switch (kind) {
+		case "TEXT":
+			editor = /* @__PURE__ */ jsx(TextInput, {
+				ref: inputRef,
+				size: sizes.input,
+				isGhost: true,
+				value: text,
+				onChange: setText,
+				onEnter: (next) => onCommit(next),
+				ariaLabel: header,
+				fillWidth: true
+			});
+			break;
+		case "NUMBER":
+			editor = /* @__PURE__ */ jsx(NumberInput, {
+				ref: inputRef,
+				size: sizes.input,
+				isGhost: true,
+				defaultValue: initialNumber,
+				family: FontFamily.MONO,
+				onEnter: (next) => onCommit(next),
+				ariaLabel: header,
+				fillWidth: true
+			});
+			break;
+		case "BOOLEAN":
+			editor = /* @__PURE__ */ jsx(SwitchInput, {
+				ref: inputRef,
+				size: sizes.switchInput,
+				isChecked: value === true,
+				onChange: (isChecked) => onCommit(isChecked),
+				ariaLabel: header
+			});
+			break;
+		case "ENUM":
+			editor = /* @__PURE__ */ jsx(SelectInput, {
+				ref: triggerRef,
+				size: sizes.select,
+				isGhost: true,
+				options: options ?? [],
+				value: typeof value === "string" ? value : null,
+				defaultIsOpen: true,
+				isSearchable: (options?.length ?? 0) > 8,
+				onChange: (next) => onCommit(next),
+				onOpenChange: handlePanelOpenChange,
+				ariaLabel: header,
+				fillWidth: true
+			});
+			break;
+		case "DATE":
+			editor = /* @__PURE__ */ jsx(DateInput, {
+				ref: triggerRef,
+				size: sizes.date,
+				isGhost: true,
+				value: value instanceof Date ? value : null,
+				defaultIsOpen: true,
+				onChange: (next) => onCommit(next),
+				onOpenChange: handlePanelOpenChange,
+				ariaLabel: header,
 				fillWidth: true,
-				isOpen: true
+				isClearable: true
 			});
-		}).with(SpreadsheetCellType.DATE, () => /* @__PURE__ */ jsx(DateInput, {
-			value: localValue instanceof Date ? localValue : localValue ? new Date(String(localValue)) : null,
-			onChange: (v) => {
-				onCommit(v);
-			},
-			fillWidth: true
-		})).with(SpreadsheetCellType.READONLY, () => null).exhaustive()
+			break;
+	}
+	return /* @__PURE__ */ jsx(Root, {
+		ref: rootRef,
+		onKeyDownCapture: handleKeyDownCapture,
+		children: /* @__PURE__ */ jsx(BareFieldContext.Provider, {
+			value: true,
+			children: editor
+		})
 	});
 }
 //#endregion
-export { SpreadsheetCellEditor as default };
+export { SpreadsheetCellEditor, SpreadsheetEditorKind };

package/dist/table/TableCore.d.ts

@@ -0,0 +1,252 @@
+import { type AriaAttributes, type CSSProperties, type KeyboardEvent, type MouseEvent, type PointerEvent, type ReactNode, type Ref, type RefObject } from "react";
+import { ButtonSize } from "../buttons/Button.js";
+import { EmptyStateSize } from "../feedback/EmptyState.js";
+import { SkeletonSize } from "../feedback/Skeleton.js";
+import { useIsomorphicLayoutEffect } from "../hooks/useIsomorphicLayoutEffect.js";
+import { CheckboxInputSize } from "../inputs/CheckboxInput.js";
+import { MenuSize } from "../menu/Menu.js";
+import { TextSize } from "../text/Text.js";
+import type { TableColumnAlign, TableColumnPin, TableSort } from "./types.js";
+import type { TableColumnLayoutResult, TableColumnsMenuEntry, TableResolvedColumn } from "./useTableColumnLayout.js";
+/** Re-exported for the table modules that measured with it before it became a shared hook. */
+export { useIsomorphicLayoutEffect };
+/** `onEndReached` fires when the last row comes within this many pixels of view. */
+export declare const TABLE_END_REACHED_MARGIN_PX = 500;
+/** Skeleton rows shown in place of an empty body while the first page loads. */
+export declare const TABLE_LOADING_ROW_COUNT = 5;
+/** Skeleton rows shown after the last row while more rows load. */
+export declare const TABLE_LOADING_MORE_ROW_COUNT = 3;
+/** Smallest column width when a column sets none (1.x). */
+export declare const TABLE_DEFAULT_MIN_COLUMN_WIDTH = 60;
+/** Largest resize width when a column sets none (1.x). */
+export declare const TABLE_DEFAULT_MAX_COLUMN_WIDTH = 800;
+/** Width of a pinned column that sets no `width` (1.x); a dev warning asks for one. */
+export declare const TABLE_PINNED_FALLBACK_WIDTH = 150;
+/** Horizontal pointer travel before a header press becomes a column drag: `space[4]`. */
+export declare const TABLE_DRAG_THRESHOLD_PX: number;
+/** Rows rendered above and below the visible window of a virtual body. */
+export declare const VIRTUAL_OVERSCAN = 10;
+/** Local stacking inside the root's `isolation: isolate`; never competes with `t.z` layers. */
+/** @internal Stacking of pinned cells (and the spreadsheet's editing cell). */
+export declare const TABLE_Z_PINNED = 1;
+/** @internal True outside production builds (read through `process.env.NODE_ENV`). */
+export declare function isDevelopment(): boolean;
+/** @internal Every size a table rung implies, for the parts and the components they render. */
+export interface TableMetrics {
+    /** Sets `--gx-table-row-height`, `--gx-table-header-height` and `--gx-table-cell-padding-inline` on the root. */
+    css: string;
+    /** Body row height in pixels (virtual bodies, synthetic column widths). */
+    rowHeightPx: number;
+    /** Header and footer row height in pixels (virtual bodies' scroll margins). */
+    headerHeightPx: number;
+    /** Cell and header text step. */
+    textSize: TextSize;
+    /** Sort and error icon size in pixels. */
+    headerIconPx: number;
+    /** Expand caret size in pixels: 12px, 10px on the 20px and 24px expand buttons (the collapsible Widget's caret). */
+    caretPx: number;
+    /** Select-column checkbox size. */
+    checkboxSize: CheckboxInputSize;
+    /** Expand, row actions, column actions and Columns button size. */
+    buttonSize: ButtonSize;
+    /** Skeleton row line size. */
+    skeletonSize: SkeletonSize;
+    /** Row actions, column actions and Columns menu size. */
+    menuSize: MenuSize;
+    /** Empty and error state size. */
+    emptyStateSize: EmptyStateSize;
+}
+/** @internal 32px rows, 32px header, body_sm. */
+export declare const TABLE_SMALL_METRICS: TableMetrics;
+/** @internal 48px rows, 40px header, body_md. */
+export declare const TABLE_MEDIUM_METRICS: TableMetrics;
+/** @internal 52px rows, 44px header, body_lg. */
+export declare const TABLE_LARGE_METRICS: TableMetrics;
+/** @internal A body row. States are classes (`ROW_*_CSS`). */
+export declare const TableRow: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLTableRowElement> & import("react").HTMLAttributes<HTMLTableRowElement> & Record<never, unknown>>;
+/** @internal A body or footer cell. */
+export declare const TableCell: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLTableDataCellElement> & import("react").TdHTMLAttributes<HTMLTableDataCellElement> & Record<never, unknown>>;
+/** @internal Select, expand and row-actions columns: a square of the row height, content centered. */
+export declare const SYNTHETIC_CELL_CSS: import("@linaria/core").LinariaClassName;
+/** @internal Alignment of a column's header and cells. */
+export declare const COLUMN_ALIGN_TO_CSS_MAP: Record<TableColumnAlign, string>;
+/** @internal Sticky to an edge while the table scrolls sideways. */
+export declare const PIN_TO_CSS_MAP: Record<TableColumnPin, string>;
+/** @internal The edge hairline of the last left-pinned / first right-pinned data column. */
+export declare const PIN_TO_EDGE_CSS_MAP: Record<TableColumnPin, string>;
+/** @internal The last row, or a row whose panel is open: no bottom hairline. */
+export declare const ROW_NO_BORDER_CSS: import("@linaria/core").LinariaClassName;
+/** @internal A virtual body: as tall as every row, which are positioned inside it. */
+export declare const VIRTUAL_BODY_CSS: import("@linaria/core").LinariaClassName;
+/** @internal A virtual row, placed at `--gx-table-row-start`. */
+export declare const VIRTUAL_ROW_CSS: import("@linaria/core").LinariaClassName;
+/** @internal Default cells and footer strings: shrink to truncate. */
+export declare const CELL_TEXT_CSS: import("@linaria/core").LinariaClassName;
+/** @internal The default cell renderer: one truncating line of formatted text. */
+export declare function TableCellText({ value, textSize }: {
+    value: unknown;
+    textSize: TextSize;
+}): import("react").JSX.Element;
+/** @internal Props of `TableHeaderCell`. */
+export interface TableHeaderCellProps {
+    resolved: TableResolvedColumn<unknown>;
+    metrics: TableMetrics;
+    /** `aria-sort` for sortable columns. */
+    sortState: "ascending" | "descending" | "none" | undefined;
+    /** The table is customizable: the label is a button (drag, Alt+Arrow). */
+    isCustomizable: boolean;
+    /** Column width for the resize handle. */
+    width: number;
+    /** Which edge shows the drop indicator while another column is dragged. */
+    dropEdge: "start" | "end" | null;
+    isDragged: boolean;
+    colIndex: number | undefined;
+    onSortPress: (columnId: string) => void;
+    onResize: (columnId: string, width: number) => void;
+    onLabelKeyDown: (columnId: string, event: KeyboardEvent<HTMLButtonElement>) => void;
+    onLabelPointerDown: (columnId: string, event: PointerEvent<HTMLButtonElement>) => void;
+    onLabelPointerMove: (event: PointerEvent<HTMLButtonElement>) => void;
+    onLabelPointerUp: (event: PointerEvent<HTMLButtonElement>) => void;
+    onLabelPointerCancel: (event: PointerEvent<HTMLButtonElement>) => void;
+    onLabelClickCapture: (event: MouseEvent<HTMLButtonElement>) => void;
+    registerCell: (columnId: string, element: HTMLElement | null) => void;
+    registerButton: (columnId: string, element: HTMLButtonElement | null) => void;
+}
+/** @internal One column header: label (sort / drag button), sort icon, column actions, resize handle. */
+export declare function TableHeaderCell({ resolved, metrics, sortState, isCustomizable, width, dropEdge, isDragged, colIndex, onSortPress, onResize, onLabelKeyDown, onLabelPointerDown, onLabelPointerMove, onLabelPointerUp, onLabelPointerCancel, onLabelClickCapture, registerCell, registerButton, }: TableHeaderCellProps): import("react").JSX.Element;
+/** @internal The trailing corner's Columns menu: show / hide each column, reset the layout. */
+export declare function TableColumnsMenu({ entries, metrics, onToggle, onReset, }: {
+    entries: TableColumnsMenuEntry[];
+    metrics: TableMetrics;
+    onToggle: (columnId: string, isVisible: boolean) => void;
+    onReset: () => void;
+}): import("react").JSX.Element;
+/** @internal Stable callbacks every body row shares (kept in a ref by the host). */
+export interface TableRowCallbacks {
+    registerRow: (rowIndex: number, element: HTMLElement | null) => void;
+    onRowClick: ((row: unknown, event: MouseEvent<HTMLTableRowElement>) => void) | undefined;
+    onRowKeyDown: (rowIndex: number, event: KeyboardEvent<HTMLTableRowElement>) => void;
+    onRowFocus: (rowIndex: number) => void;
+    onToggleSelect: (rowId: string, isRange: boolean) => void;
+    onToggleExpand: (rowId: string) => void;
+    onActionsOpenChange: (rowId: string, isOpen: boolean) => void;
+    getRowActions: ((row: unknown, rowIndex: number) => ReactNode) | undefined;
+    getRowName: (row: unknown, rowIndex: number) => string;
+}
+/** @internal Props of `TableBodyRow`. */
+export interface TableBodyRowProps {
+    row: unknown;
+    rowIndex: number;
+    rowId: string;
+    columns: TableResolvedColumn<unknown>[];
+    metrics: TableMetrics;
+    callbacks: TableRowCallbacks;
+    cellRole: "gridcell" | "cell";
+    /** The row takes part in the keyboard model (roving `tabIndex`). */
+    isFocusable: boolean;
+    /** The row is the roving tab stop. */
+    isTabStop: boolean;
+    /** The row does something on click. */
+    isClickable: boolean;
+    /** No bottom hairline. */
+    isBorderless: boolean;
+    isActive: boolean;
+    /** `undefined`: the table has no select column. */
+    isSelected: boolean | undefined;
+    /** The table has an expand column. */
+    hasExpandColumn: boolean;
+    /** `undefined`: this row cannot expand. */
+    isExpanded: boolean | undefined;
+    panelId: string | undefined;
+    /** The table has a trailing (row actions / Columns) column. */
+    hasTrailingColumn: boolean;
+    isActionsOpen: boolean;
+    /** `aria-rowindex` (virtual bodies). */
+    ariaRowIndex: number | undefined;
+    /** Set `aria-colindex` on cells (virtual bodies). */
+    hasColIndex: boolean;
+    className: string | undefined;
+    style: CSSProperties | undefined;
+}
+/** @internal One body row with its synthetic and data cells. Memoized: every prop is stable or primitive. */
+export declare const TableBodyRow: import("react").NamedExoticComponent<TableBodyRowProps>;
+/** @internal Props of `TableSkeletonRow`. */
+export interface TableSkeletonRowProps {
+    columns: TableResolvedColumn<unknown>[];
+    metrics: TableMetrics;
+    leadingCount: number;
+    hasTrailingColumn: boolean;
+    isBorderless: boolean;
+    ariaRowIndex?: number;
+    /**
+     * A row of a virtual body that is not loaded yet: it stays in the accessibility tree
+     * (`aria-busy`, so `aria-rowindex` stays continuous) and takes part in the roving focus.
+     */
+    pending?: {
+        rowRef: (element: HTMLElement | null) => void;
+        isTabStop: boolean;
+        onKeyDown: (event: KeyboardEvent<HTMLTableRowElement>) => void;
+        onFocus: () => void;
+    };
+    className?: string;
+    style?: CSSProperties;
+}
+/** @internal A placeholder row: a text skeleton in each data cell, synthetic cells empty. */
+export declare function TableSkeletonRow({ columns, metrics, leadingCount, hasTrailingColumn, isBorderless, ariaRowIndex, pending, className, style, }: TableSkeletonRowProps): import("react").JSX.Element;
+/** @internal An expanded row's panel, under its row, as wide as the visible area. */
+export declare function TableExpandedRow({ panelId, colSpan, gutterPx, isLast, children, }: {
+    panelId: string;
+    colSpan: number;
+    gutterPx: number;
+    isLast: boolean;
+    children: ReactNode;
+}): import("react").JSX.Element;
+/** @internal Props of `TableFrame`. */
+export interface TableFrameProps {
+    metrics: TableMetrics;
+    columnLayout: TableColumnLayoutResult<unknown>;
+    /** Header content of each leading synthetic column (select-all, expand). */
+    leadingHeaders: ReactNode[];
+    /** Header content of the trailing corner column; `undefined` when there is no trailing column. */
+    trailingHeader: ReactNode | undefined;
+    hasTrailingColumn: boolean;
+    sort: TableSort | null;
+    onSortPress: (columnId: string) => void;
+    canCustomizeColumns: boolean;
+    /** Loaded rows in the body. */
+    rowCount: number;
+    isLoading: boolean;
+    error: string | undefined;
+    emptyState: ReactNode;
+    onEndReached: (() => void) | undefined;
+    role: "grid" | "table";
+    ariaLabel: string | undefined;
+    /** `aria-*` passthrough for the `<table>`. */
+    tableAria: AriaAttributes;
+    isMultiselectable: boolean;
+    /** `aria-rowcount` for virtual bodies; also turns on `aria-rowindex` / `aria-colindex`. */
+    ariaRowCount: number | undefined;
+    rootRef: Ref<HTMLDivElement>;
+    scrollRef: RefObject<HTMLDivElement | null>;
+    rootProps: Record<string, unknown>;
+    bodyClassName?: string | undefined;
+    bodyStyle?: CSSProperties | undefined;
+    /** A message for the live region (sort changes in virtual bodies). */
+    announcement?: string | undefined;
+    /** Extra class on the trailing header and footer cells (a corner wider than one synthetic column). */
+    trailingClassName?: string | undefined;
+    /** Body rows. */
+    children: ReactNode;
+    className: string | undefined;
+    style: CSSProperties | undefined;
+}
+/** Root → scroll container → table (header, body, status, footer) → sentinel → live region. */
+export declare function TableFrame({ metrics, columnLayout, leadingHeaders, trailingHeader, hasTrailingColumn, sort, onSortPress, canCustomizeColumns, rowCount, isLoading, error, emptyState, onEndReached, role, ariaLabel, tableAria, isMultiselectable, ariaRowCount, rootRef, scrollRef, rootProps, className, style, bodyClassName, bodyStyle, announcement, trailingClassName, children, }: TableFrameProps): import("react").JSX.Element;
+/** @internal Header content of the select column: the select-all checkbox. */
+export declare function TableSelectAllCheckbox({ metrics, isChecked, isIndeterminate, isDisabled, onToggle, }: {
+    metrics: TableMetrics;
+    isChecked: boolean;
+    isIndeterminate: boolean;
+    isDisabled: boolean;
+    onToggle: () => void;
+}): import("react").JSX.Element;