@undevy-org/tablewright 0.1.0

package/dist/tokens.css

@@ -0,0 +1,150 @@
+/* @undevy-org/tablewright — design tokens. Generated by scripts/build-css.mjs; do not edit. */
+/* Design tokens: CSS custom properties for both themes.
+ * Shipped as @undevy-org/tablewright/tokens.css — load once, globally.
+ * Theme is selected by data-theme="light" | "dark" on any ancestor. */
+
+:root,
+[data-theme="light"] {
+  color-scheme: light;
+  --bg-body: #ffffff;
+  --bg-surface: #ffffff;
+  --bg-surface-muted: #fcfcfd;
+  --bg-surface-sunken: #fbfbfb;
+  --bg-hover: #f9fafb;
+  --bg-secondary: #f3f4f6;
+  --bg-tertiary: #eef2f6;
+  --bg-surface-glass: rgba(255, 255, 255, 0.95);
+  --bg-surface-glass-soft: rgba(255, 255, 255, 0.9);
+  --bg-nav-item-active: rgba(17, 24, 39, 0.06);
+  --overlay-scrim: rgba(0, 0, 0, 0.3);
+  --accent-primary: #111827;
+  --text-on-accent: #ffffff;
+  --text-primary: #111827;
+  --text-secondary: #6b7280;
+  --text-tertiary: #9ca3af;
+  --text-muted-strong: #374151;
+  --text-utility: #667085;
+  --bg-brand-subtle: #e0f2fe;
+  --border-brand: #93c5fd;
+  --text-brand: #0369a1;
+  --border-subtle: #e5e7eb;
+  --border-focus: #d1d5db;
+  --border-danger: #f87171;
+  --tag-pink-bg: #fce7f3;
+  --tag-pink-text: #be185d;
+  --tag-purple-bg: #f3e8ff;
+  --tag-purple-text: #7e22ce;
+  --tag-blue-bg: #e0f2fe;
+  --tag-blue-text: #0369a1;
+  --tag-green-bg: #dcfce7;
+  --tag-green-text: #15803d;
+  --tag-orange-bg: #ffedd5;
+  --tag-orange-text: #c2410c;
+  --tag-gray-bg: #f3f4f6;
+  --tag-gray-text: #4b5563;
+  --tag-amber-bg: #fef3c7;
+  --tag-amber-text: #92400e;
+  --tag-sky-bg: #ecfeff;
+  --tag-sky-text: #0e7490;
+  --tag-indigo-bg: #dbeafe;
+  --tag-indigo-text: #1e3a8a;
+  --font-stack: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+  --font-mono: "JetBrains Mono", "Fira Code", monospace;
+  --radius-sm: 4px;
+  --radius-md: 6px;
+  --radius-lg: 8px;
+  --radius-xl: 12px;
+  --radius-2xl: 16px;
+  --radius-display: 28px;
+  --radius-full: 9999px;
+  --space-1: 4px;
+  --space-1-5: 6px;
+  --space-2: 8px;
+  --space-2-5: 10px;
+  --space-3: 12px;
+  --space-4: 16px;
+  --space-5: 20px;
+  --space-6: 24px;
+  --space-8: 32px;
+  --space-10: 40px;
+  --size-control-sm: 32px;
+  --size-control-md: 36px;
+  --size-dialog-md: 420px;
+  --size-dialog-lg: 560px;
+  --size-drawer: 400px;
+  --size-row-control: 80px;
+  --size-select-compact: 84px;
+  --size-showcase-card-min-height: 148px;
+  --size-showcase-max-width: 1440px;
+  --size-export-mobile: 390px;
+  --size-sidebar-expanded: 240px;
+  --size-sidebar-collapsed: 56px;
+  --size-topbar-height: 52px;
+  --duration-sidebar: 200ms;
+  --opacity-disabled: 0.5;
+  --opacity-hovered: 0.9;
+  --opacity-resize-rest: 0.3;
+  --opacity-resize-hover: 0.5;
+  --shadow-card: 0 8px 24px rgba(15, 23, 42, 0.04);
+  --shadow-dialog: 0 20px 60px rgba(0, 0, 0, 0.15);
+  --shadow-drawer: -4px 0 24px rgba(0, 0, 0, 0.05);
+  --shadow-menu: 0 4px 12px rgba(15, 23, 42, 0.1);
+  --shadow-tab-active: 0 1px 2px rgba(0, 0, 0, 0.05);
+  --shadow-sidebar-overlay: 4px 0 24px rgba(0, 0, 0, 0.08);
+  --gradient-showcase-hero: linear-gradient(135deg, rgba(17, 24, 39, 0.03), rgba(255, 255, 255, 1) 45%, rgba(243, 244, 246, 0.9));
+  --gradient-dialog-canvas: radial-gradient(circle at top, rgba(243, 244, 246, 0.9), rgba(255, 255, 255, 1) 65%);
+}
+
+[data-theme="dark"] {
+  color-scheme: dark;
+  --bg-body: #0f172a;
+  --bg-surface: #111827;
+  --bg-surface-muted: #172033;
+  --bg-surface-sunken: #0b1220;
+  --bg-hover: #1b2537;
+  --bg-secondary: #1e293b;
+  --bg-tertiary: #334155;
+  --bg-surface-glass: rgba(15, 23, 42, 0.92);
+  --bg-surface-glass-soft: rgba(15, 23, 42, 0.82);
+  --bg-nav-item-active: rgba(248, 250, 252, 0.08);
+  --overlay-scrim: rgba(2, 6, 23, 0.72);
+  --accent-primary: #e2e8f0;
+  --text-on-accent: #111827;
+  --text-primary: #f8fafc;
+  --text-secondary: #cbd5e1;
+  --text-tertiary: #94a3b8;
+  --text-muted-strong: #e2e8f0;
+  --text-utility: #b0bccd;
+  --bg-brand-subtle: #112e44;
+  --border-brand: #1e40af;
+  --text-brand: #7dd3fc;
+  --border-subtle: #334155;
+  --border-focus: #475569;
+  --border-danger: #f87171;
+  --tag-pink-bg: #3f1d34;
+  --tag-pink-text: #f9a8d4;
+  --tag-purple-bg: #31224a;
+  --tag-purple-text: #d8b4fe;
+  --tag-blue-bg: #112e44;
+  --tag-blue-text: #7dd3fc;
+  --tag-green-bg: #123628;
+  --tag-green-text: #86efac;
+  --tag-orange-bg: #4b2a17;
+  --tag-orange-text: #fdba74;
+  --tag-gray-bg: #1f2937;
+  --tag-gray-text: #e5e7eb;
+  --tag-amber-bg: #493316;
+  --tag-amber-text: #fcd34d;
+  --tag-sky-bg: #103a44;
+  --tag-sky-text: #67e8f9;
+  --tag-indigo-bg: #1e3a8a;
+  --tag-indigo-text: #bfdbfe;
+  --shadow-card: 0 18px 40px rgba(2, 6, 23, 0.35);
+  --shadow-dialog: 0 24px 80px rgba(2, 6, 23, 0.55);
+  --shadow-drawer: -12px 0 40px rgba(2, 6, 23, 0.38);
+  --shadow-menu: 0 12px 32px rgba(2, 6, 23, 0.42);
+  --shadow-tab-active: 0 4px 14px rgba(2, 6, 23, 0.28);
+  --shadow-sidebar-overlay: 4px 0 24px rgba(2, 6, 23, 0.4);
+  --gradient-showcase-hero: linear-gradient(135deg, rgba(148, 163, 184, 0.14), rgba(15, 23, 42, 1) 42%, rgba(17, 24, 39, 0.94));
+  --gradient-dialog-canvas: radial-gradient(circle at top, rgba(51, 65, 85, 0.7), rgba(17, 24, 39, 1) 68%);
+}

package/dist/types/components/dashboard/ReportSummaryCard.d.ts

@@ -0,0 +1,15 @@
+export interface ReportSummaryCardProps {
+    title: string;
+    count?: number;
+    endpoint: string;
+    topActions: string[];
+    filterNames: string[];
+    columns: string[];
+    sampleRows: {
+        title: string;
+        values: string[];
+    }[];
+    emptyStateMessage?: string;
+    notes?: string[];
+}
+export declare function ReportSummaryCard({ title, count, endpoint, topActions, filterNames, columns, sampleRows, emptyStateMessage, notes, }: ReportSummaryCardProps): import("react").JSX.Element;

package/dist/types/components/data-table/AppliedStateChips.d.ts

@@ -0,0 +1,28 @@
+import type { ActiveFilter, ActiveFilterValue, ColumnFilterConfig, FilterStatsSlice } from "./filter-types.js";
+interface AppliedStateChipsProps {
+    filters: ActiveFilter[];
+    configs: Record<string, ColumnFilterConfig>;
+    newestColumnId: string | null;
+    onRemoveFilter: (columnId: string) => void;
+    onChangeFilter: (columnId: string, value: ActiveFilterValue) => void;
+    currentSort: {
+        columnId: string;
+        direction: "asc" | "desc";
+    } | null;
+    columnLabels: Record<string, string>;
+    onRemoveSort: () => void;
+    hiddenColumnsCount: number;
+    onResetColumns: () => void;
+    onOpenColumnsMenu?: () => void;
+    customFilterChip: {
+        label: string;
+        value: string;
+    } | null;
+    onRemoveCustomFilter: () => void;
+    onClearAll: () => void;
+    columnFilterStats?: Record<string, FilterStatsSlice>;
+    requestOpenFilterId?: string | null;
+    onRequestOpenHandled?: () => void;
+}
+export declare function AppliedStateChips({ filters, configs, newestColumnId, onRemoveFilter, onChangeFilter, currentSort, columnLabels, onRemoveSort, hiddenColumnsCount, onResetColumns, onOpenColumnsMenu, customFilterChip, onRemoveCustomFilter, onClearAll, columnFilterStats, requestOpenFilterId, onRequestOpenHandled, }: AppliedStateChipsProps): import("react").JSX.Element | null;
+export {};

package/dist/types/components/data-table/ColumnFilterPopover.d.ts

@@ -0,0 +1,14 @@
+import type { ActiveFilter, ColumnFilterConfig, ActiveFilterValue, FilterStatsSlice } from "./filter-types.js";
+interface ColumnFilterPopoverProps {
+    config: ColumnFilterConfig;
+    filter: ActiveFilter;
+    onChange: (value: ActiveFilterValue) => void;
+    onRemove: () => void;
+    initialOpen?: boolean;
+    chipClassName?: string;
+    stats?: FilterStatsSlice;
+    requestOpen?: boolean;
+    onRequestOpenHandled?: () => void;
+}
+export declare function ColumnFilterPopover({ config, filter, onChange, onRemove, initialOpen, chipClassName, stats, requestOpen, onRequestOpenHandled, }: ColumnFilterPopoverProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/ColumnHeaderMenu.d.ts

@@ -0,0 +1,27 @@
+import type { SortDirection } from "./types.js";
+export interface ColumnHeaderMenuLabels {
+    sort: string;
+    sortByColumn: (label: string) => string;
+    ascending: string;
+    descending: string;
+    filterByColumn: string;
+    hideColumn: string;
+}
+interface ColumnHeaderMenuProps {
+    label?: string;
+    primaryLabel?: string;
+    secondaryLabel?: string;
+    sorted?: SortDirection;
+    onSort?: (direction: "asc" | "desc") => void;
+    primarySorted?: SortDirection;
+    onPrimarySort?: (direction: "asc" | "desc") => void;
+    secondarySorted?: SortDirection;
+    onSecondarySort?: (direction: "asc" | "desc") => void;
+    hasFilter?: boolean;
+    onFilterClick?: () => void;
+    onHide?: () => void;
+    labels?: Partial<ColumnHeaderMenuLabels>;
+    menuWidth?: string;
+}
+export declare function ColumnHeaderMenu({ label, primaryLabel, secondaryLabel, sorted, onSort, primarySorted, onPrimarySort, secondarySorted, onSecondarySort, hasFilter, onFilterClick, onHide, labels: labelOverrides, menuWidth, }: ColumnHeaderMenuProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/CompoundFilterPopover.d.ts

@@ -0,0 +1,14 @@
+import type { ActiveFilter, ActiveFilterValue, ColumnFilterConfig, FilterStatsSlice } from "./filter-types.js";
+interface CompoundFilterPopoverProps {
+    config: ColumnFilterConfig;
+    filter: ActiveFilter;
+    onChange: (value: ActiveFilterValue) => void;
+    onRemove: () => void;
+    initialOpen?: boolean;
+    chipClassName?: string;
+    columnFilterStats?: Record<string, FilterStatsSlice>;
+    requestOpen?: boolean;
+    onRequestOpenHandled?: () => void;
+}
+export declare function CompoundFilterPopover({ config, filter, onChange, onRemove, initialOpen, chipClassName, columnFilterStats, requestOpen, onRequestOpenHandled, }: CompoundFilterPopoverProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/CopyButton.d.ts

@@ -0,0 +1,8 @@
+interface CopyButtonProps {
+    text: string;
+    className?: string;
+    iconClassName?: string;
+    title?: string;
+}
+export declare function CopyButton({ text, className, iconClassName, title, }: CopyButtonProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/CopyableText.d.ts

@@ -0,0 +1,10 @@
+interface CopyableTextProps {
+    value: string;
+    children?: React.ReactNode;
+    className?: string;
+    textClassName?: string;
+    buttonClassName?: string;
+    title?: string;
+}
+export declare function CopyableText({ value, children, className, textClassName, buttonClassName, title, }: CopyableTextProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/DataTableShell.d.ts

@@ -0,0 +1,30 @@
+import type { PointerEvent, ReactNode } from "react";
+import { type Table } from "@tanstack/react-table";
+import { type DrawerMode } from "./DrawerShell.js";
+import type { UseRowDragResult } from "./hooks/use-row-drag.js";
+import type { ColumnMetaDef } from "./types.js";
+export interface DataTableDrawer {
+    open: boolean;
+    onClose: () => void;
+    title: ReactNode;
+    subtitle?: ReactNode;
+    headerExtra?: ReactNode;
+    content: ReactNode;
+    /** @default "side" */
+    mode?: DrawerMode;
+}
+export interface DataTableShellProps<TData> {
+    table: Table<TData>;
+    dense: boolean;
+    emptyMessage: string;
+    columnMeta: Record<string, ColumnMetaDef>;
+    columnWidths: Record<string, number>;
+    onColumnResizeStart: (columnId: string, event: PointerEvent<HTMLDivElement>) => void;
+    onRowClick?: (row: TData) => void;
+    getRowIsActive?: (row: TData) => boolean;
+    rowDrag?: UseRowDragResult;
+    footer?: ReactNode;
+    drawer?: DataTableDrawer;
+    className?: string;
+}
+export declare function DataTableShell<TData>({ table, dense, emptyMessage, columnMeta, columnWidths, onColumnResizeStart, onRowClick, getRowIsActive, rowDrag, footer, drawer, className, }: DataTableShellProps<TData>): import("react").JSX.Element;

package/dist/types/components/data-table/DrawerActionGroup.d.ts

@@ -0,0 +1,8 @@
+import type { RowActionSection } from "./types.js";
+interface DrawerActionGroupProps {
+    sections: RowActionSection[];
+    variant: "flat" | "grouped";
+    columns?: 2 | 4;
+}
+export declare function DrawerActionGroup({ sections, variant, columns }: DrawerActionGroupProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/DrawerEntityCard.d.ts

@@ -0,0 +1,13 @@
+interface DrawerEntityCardProps {
+    name: string;
+    /**
+     * Identifier shown next to the name in the card header. Omit when the
+     * identifier is already represented as one of the body fields below — the
+     * header collapses to a single column so the same value isn't surfaced
+     * twice in the same card.
+     */
+    id?: string;
+    children: React.ReactNode;
+}
+export declare function DrawerEntityCard({ name, id, children }: DrawerEntityCardProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/DrawerField.d.ts

@@ -0,0 +1,7 @@
+interface DrawerFieldProps {
+    label: string;
+    value?: React.ReactNode;
+    children?: React.ReactNode;
+}
+export declare function DrawerField({ label, value, children }: DrawerFieldProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/DrawerFlagItem.d.ts

@@ -0,0 +1,10 @@
+interface DrawerFlagGridProps {
+    children: React.ReactNode;
+}
+export declare function DrawerFlagGrid({ children }: DrawerFlagGridProps): import("react").JSX.Element;
+interface DrawerFlagItemProps {
+    label: string;
+    value: boolean;
+}
+export declare function DrawerFlagItem({ label, value }: DrawerFlagItemProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/DrawerSection.d.ts

@@ -0,0 +1,8 @@
+interface DrawerSectionProps {
+    title: string;
+    children: React.ReactNode;
+    className?: string;
+    card?: boolean;
+}
+export declare function DrawerSection({ title, children, className, card }: DrawerSectionProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/DrawerShell.d.ts

@@ -0,0 +1,33 @@
+/**
+ * Controls how the drawer opens:
+ * - `"side"` — (default) side panel only, no expand button. Matches every
+ *   consumer that predates this prop, so the default preserves their exact
+ *   rendered output.
+ * - `"side+modal"` — side panel with an expand button that opens a
+ *   full-screen modal.
+ * - `"modal"` — opens directly as a full-screen modal, skipping the side
+ *   panel entirely.
+ */
+export type DrawerMode = "side" | "modal" | "side+modal";
+interface DrawerShellProps {
+    open: boolean;
+    onClose: () => void;
+    title: React.ReactNode;
+    subtitle?: React.ReactNode;
+    headerExtra?: React.ReactNode;
+    children: React.ReactNode;
+    /** Pinned footer (e.g. row actions); stays fixed while the body scrolls. */
+    footer?: React.ReactNode;
+    /**
+     * Opt into a dismiss layer in side mode: a click-to-close scrim over the
+     * positioning container plus Escape-to-close. Off by default so existing
+     * consumers keep their current behavior (background stays interactive,
+     * close only via the X button).
+     * @default false
+     */
+    dismissible?: boolean;
+    /** @default "side" */
+    mode?: DrawerMode;
+}
+export declare function DrawerShell({ open, onClose, title, subtitle, headerExtra, children, footer, dismissible, mode, }: DrawerShellProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/DrawerSummaryCard.d.ts

@@ -0,0 +1,7 @@
+interface DrawerSummaryCardProps {
+    label: string;
+    value: React.ReactNode;
+    sub?: React.ReactNode;
+}
+export declare function DrawerSummaryCard({ label, value, sub }: DrawerSummaryCardProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/EmptyState.d.ts

@@ -0,0 +1,6 @@
+interface EmptyStateProps {
+    message: string;
+    colSpan: number;
+}
+export declare function EmptyState({ message, colSpan }: EmptyStateProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/ExpiryTimestampCell.d.ts

@@ -0,0 +1,6 @@
+interface ExpiryTimestampCellProps {
+    value: string | null;
+    timestampMs?: number;
+}
+export declare function ExpiryTimestampCell({ value, timestampMs }: ExpiryTimestampCellProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/FilterChip.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+export interface FilterChipProps extends React.HTMLAttributes<HTMLDivElement> {
+    label: string;
+    value?: string;
+    onRemove: () => void;
+    active?: boolean;
+}
+export declare const FilterChip: React.ForwardRefExoticComponent<FilterChipProps & React.RefAttributes<HTMLDivElement>>;

package/dist/types/components/data-table/FilterFormPanel.d.ts

@@ -0,0 +1,34 @@
+import type { ActiveFilter, ColumnFilterConfig } from "./filter-types.js";
+import { type ManagedFilterChange } from "./managed-filters.js";
+export interface FilterFormPanelProps {
+    /** All known filter configs (same shape used by GroupedFilterAdd). */
+    filterConfigs: Record<string, ColumnFilterConfig>;
+    /** Ordered list of column IDs to render as form fields. */
+    fields: readonly string[];
+    /**
+     * Currently active filters from the page-level orchestrator.
+     * Must be a stable reference — pass `orch.columnFilters` directly, not a derived array
+     * (touched-field tracking depends on referential stability for the reseed effect).
+     */
+    filters: ActiveFilter[];
+    /** Called on Apply with only managed-field changes. */
+    onApply: (changes: ManagedFilterChange[]) => void;
+    /** Called on Clear with the managed columnIds to clear. */
+    onClear: (managedColumnIds: string[]) => void;
+    /** Optional title above the grid. Defaults to "Filters". */
+    title?: string;
+    /** Optional className passed to the root form element. */
+    className?: string;
+    /** Optional DOM id on the root form element (used by aria-controls from FilterFormToggle). */
+    id?: string;
+    /** Optional close handler — when provided, renders a close button in the header. */
+    onClose?: () => void;
+    /**
+     * Sub-filters to omit inside compound fields, addressed as `${fieldId}:${subKey}`.
+     * Lets a compound render only a subset of its sub-filters — the rest stay
+     * available through the page's filter-visibility manager. Whole-field hiding
+     * is done by leaving the id out of `fields`; this is only for sub-fields.
+     */
+    hiddenSubFilterKeys?: readonly string[];
+}
+export declare function FilterFormPanel({ filterConfigs, fields, filters, onApply, onClear, title, className, id, onClose, hiddenSubFilterKeys, }: FilterFormPanelProps): import("react").JSX.Element;

package/dist/types/components/data-table/FilterFormToggle.d.ts

@@ -0,0 +1,18 @@
+export declare function useFilterFormOpen(persistKey: string, defaultOpen?: boolean): [boolean, (next: boolean) => void];
+export interface FilterFormToggleProps {
+    /** Controlled open state. */
+    open: boolean;
+    /** Setter — receives the next open state. */
+    onOpenChange: (next: boolean) => void;
+    /** Whether at least one managed filter is active. Drives the dot indicator when open=false. */
+    hasActiveFilters?: boolean;
+    /** ID of the form panel element controlled by this button (for aria-controls). */
+    controlsId?: string;
+    /** Visual variant: icon-only button or icon + text label. Same height in both. Default: "icon". */
+    variant?: "icon" | "button";
+    /** Text label for the "button" variant. Default: "Filter". */
+    label?: string;
+    /** Extra classes for the button. */
+    className?: string;
+}
+export declare function FilterFormToggle({ open, onOpenChange, hasActiveFilters, controlsId, variant, label, className, }: FilterFormToggleProps): import("react").JSX.Element;

package/dist/types/components/data-table/FilterPopoverFooter.d.ts

@@ -0,0 +1,9 @@
+interface FilterPopoverFooterProps {
+    onApply: () => void;
+    onClear?: () => void;
+    applyLabel?: string;
+    clearLabel?: string;
+    className?: string;
+}
+export declare function FilterPopoverFooter({ onApply, onClear, applyLabel, clearLabel, className, }: FilterPopoverFooterProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/FilterToolbar.d.ts

@@ -0,0 +1,29 @@
+import type { ComponentProps, HTMLAttributes, ReactNode } from "react";
+export interface ColumnToggleItem {
+    id: string;
+    label: string;
+    checked: boolean;
+    disabled?: boolean;
+}
+export declare function Root({ children, className, ...props }: HTMLAttributes<HTMLElement>): import("react").JSX.Element;
+export declare function SearchForm({ children, className, ...props }: ComponentProps<"form">): import("react").JSX.Element;
+export declare function Filters({ children, className, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
+export declare function Utility({ children, className, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
+export declare function Actions({ children, className, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
+export declare function ActiveFilters({ children, className, }: {
+    children: ReactNode;
+    className?: string;
+}): import("react").JSX.Element;
+interface ColumnVisibilityMenuProps {
+    columns: ColumnToggleItem[];
+    onColumnToggle: (columnId: string) => void;
+    label?: string;
+    buttonClassName?: string;
+}
+export declare function ColumnVisibilityMenu({ columns, onColumnToggle, label, buttonClassName, }: ColumnVisibilityMenuProps): import("react").JSX.Element;
+export declare function DensityControl({ density, onDensityChange, className, }: {
+    density: "normal" | "dense";
+    onDensityChange: (value: "normal" | "dense") => void;
+    className?: string;
+}): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/FlatColumnToggle.d.ts

@@ -0,0 +1,10 @@
+interface FlatColumnToggleProps {
+    toggleableColumnIds: readonly string[];
+    columnLabels: Record<string, string>;
+    columnVisibility: Record<string, boolean>;
+    onColumnToggle: (columnId: string) => void;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+export declare function FlatColumnToggle({ toggleableColumnIds, columnLabels, columnVisibility, onColumnToggle, open, onOpenChange, }: FlatColumnToggleProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/GapIndicator.d.ts

@@ -0,0 +1,11 @@
+import type { ReactNode } from "react";
+export declare const GAP_HEADER_ATTR = "data-gap-header";
+export declare const GAP_CELL_ATTR = "data-gap-cell";
+interface GapIndicatorProps {
+    onClick: () => void;
+    ariaLabel?: string;
+    children?: ReactNode;
+}
+export declare function GapIndicator({ onClick, ariaLabel, children, }: GapIndicatorProps): import("react").JSX.Element;
+export declare function GapCell(): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/GroupedColumnToggle.d.ts

@@ -0,0 +1,12 @@
+import type { ColumnGroup } from "./filter-types.js";
+interface GroupedColumnToggleProps {
+    columnGroups: ColumnGroup[];
+    columnLabels: Record<string, string>;
+    columnVisibility: Record<string, boolean>;
+    onColumnToggle: (columnId: string) => void;
+    onGroupToggleAll: (groupKey: string, show: boolean) => void;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+export declare function GroupedColumnToggle({ columnGroups, columnLabels, columnVisibility, onColumnToggle, onGroupToggleAll, open, onOpenChange, }: GroupedColumnToggleProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/RowActionsMenu.d.ts

@@ -0,0 +1,10 @@
+import type { RowActionItem, RowActionSection } from "./types.js";
+interface RowActionsMenuProps {
+    actions?: RowActionItem[];
+    sections?: RowActionSection[];
+    align?: "start" | "center" | "end";
+    triggerClassName?: string;
+    contentClassName?: string;
+}
+export declare function RowActionsMenu({ actions, sections, align, triggerClassName, contentClassName, }: RowActionsMenuProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/RowControlCell.d.ts

@@ -0,0 +1,16 @@
+export interface RowControlCellProps {
+    rowNumber: number;
+    selected: boolean;
+    onSelectToggle: () => void;
+    onExpandToggle?: (e: React.MouseEvent) => void;
+    ariaLabelSelect?: string;
+    ariaLabelExpand?: string;
+    forceControlsVisible?: boolean;
+}
+export declare function RowControlCell({ rowNumber, selected, onSelectToggle, onExpandToggle, ariaLabelSelect, ariaLabelExpand, forceControlsVisible, }: RowControlCellProps): import("react").JSX.Element;
+export interface RowControlHeaderProps {
+    checked: boolean | "indeterminate";
+    onToggle: () => void;
+    ariaLabel?: string;
+}
+export declare function RowControlHeader({ checked, onToggle, ariaLabel, }: RowControlHeaderProps): import("react").JSX.Element;

package/dist/types/components/data-table/SortableHeader.d.ts

@@ -0,0 +1,16 @@
+import type { SortDirection } from "./types.js";
+interface SortableHeaderProps {
+    label?: string;
+    primaryLabel?: string;
+    secondaryLabel?: string;
+    mode?: "single" | "stacked";
+    sorted?: SortDirection;
+    onClick?: () => void;
+    primarySorted?: SortDirection;
+    onPrimaryClick?: () => void;
+    secondarySorted?: SortDirection;
+    onSecondaryClick?: () => void;
+    className?: string;
+}
+export declare function SortableHeader({ label, primaryLabel, secondaryLabel, mode, sorted, onClick, primarySorted, onPrimaryClick, secondarySorted, onSecondaryClick, className, }: SortableHeaderProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/TableFooter.d.ts

@@ -0,0 +1,31 @@
+import type { BulkAction } from "./types.js";
+type TableFooterBaseProps = {
+    selectedCount: number;
+    totalCount: number;
+    onSelectAll: () => void;
+    onClearSelection: () => void;
+    bulkActions: BulkAction[];
+};
+type TableFooterNoPaginationProps = TableFooterBaseProps & {
+    paginationVariant?: "none";
+};
+type TableFooterPagesProps = TableFooterBaseProps & {
+    paginationVariant: "pages";
+    currentPage: number;
+    totalPages: number;
+    pageNumbers: number[];
+    onPageChange: (page: number) => void;
+};
+type TableFooterPerPageProps = TableFooterBaseProps & {
+    paginationVariant: "perPage";
+    currentPage: number;
+    totalPages: number;
+    pageNumbers: number[];
+    onPageChange: (page: number) => void;
+    rowsPerPage: number;
+    rowsPerPageOptions?: number[];
+    onRowsPerPageChange: (value: number) => void;
+};
+type TableFooterProps = TableFooterNoPaginationProps | TableFooterPagesProps | TableFooterPerPageProps;
+export declare function TableFooter(props: TableFooterProps): import("react").JSX.Element;
+export {};

package/dist/types/components/data-table/TableLayout.d.ts

@@ -0,0 +1,12 @@
+interface TableLayoutProps {
+    children: React.ReactNode;
+    className?: string;
+}
+export declare function TableLayout({ children, className }: TableLayoutProps): import("react").JSX.Element;
+export declare namespace TableLayout {
+    var ScrollArea: ({ children, className }: {
+        children: React.ReactNode;
+        className?: string;
+    }) => import("react").JSX.Element;
+}
+export {};