@zuilib/data-grid 0.3.0

package/dist/server-adapter.d.ts

@@ -0,0 +1,65 @@
+import { e as DataGridState } from './state-9r5WYKo_.js';
+import '@tanstack/react-table';
+import '@zuilib/components/button';
+
+/**
+ * The grid state as a plain request object: what most list endpoints take.
+ * `page` is 1-based; `filters` is keyed by column id with the raw filter
+ * value (a string for a text filter, a string array for a facet filter, a
+ * `{ from, to }` for a date range). `allMatching` is the selection bar's
+ * "Select all N": the server applies the selection action to every matching row.
+ */
+interface DataGridQuery {
+    page: number;
+    pageSize: number;
+    sort: {
+        id: string;
+        desc: boolean;
+    }[];
+    filters: Record<string, unknown>;
+    search: string;
+    allMatching: boolean;
+}
+/** The keys of the state a server request depends on. */
+type DataGridServerState = Pick<DataGridState, 'pagination' | 'sorting' | 'columnFilters' | 'search' | 'allMatching'>;
+/** The keys of the state that describe a saved view of the columns. */
+type DataGridColumnState = Pick<DataGridState, 'columnVisibility' | 'columnOrder' | 'columnPinning' | 'columnSizing'>;
+/**
+ * Only the keys a request depends on. Selection, visibility, order, pinning,
+ * sizing and expansion are left out, so a UI-only change gives a state that
+ * is deep-equal to the previous one.
+ */
+declare function toServerState(state: Partial<DataGridState>): DataGridServerState;
+/**
+ * The request for the given state. Pure: depends only on `toServerState(state)`.
+ * `filters` is keyed in column id order, whatever order the filters were
+ * applied in, so `toQueryKey` is the same for the same set of filters.
+ */
+declare function toQuery(state: Partial<DataGridState>): DataGridQuery;
+/**
+ * A string that changes only when the request would: the same for two states
+ * that differ in selection, visibility, order, pinning, sizing or expansion,
+ * or in the order their column filters were applied.
+ * Use it as the dependency of the effect (or the query cache key) that fetches,
+ * so a checkbox, a hidden column or a resize never refetches.
+ */
+declare function toQueryKey(state: Partial<DataGridState>): string;
+/**
+ * The inverse: the grid state a request describes (a URL restore, a saved view).
+ * The input is untrusted, so every key is checked for shape and never throws:
+ * `page` and `pageSize` must be positive integers (else the first page / the
+ * default page size); `sort` must be an array, of which only the entries with
+ * a string `id` are kept; `filters` must be a plain object; `search` a string.
+ * Filter values and sort ids are otherwise taken as they are: the grid does
+ * not know the columns here, so unknown ids reach the state unchanged.
+ */
+declare function fromQuery(query: Partial<DataGridQuery>): DataGridServerState;
+/**
+ * The column layout for a saved view: visibility, order, pinning and sizing,
+ * without the grid's own selection / expand columns (the grid puts them back).
+ */
+declare function toColumnState(state: Partial<DataGridState>): DataGridColumnState;
+/** The inverse: the state keys a saved view restores; a missing key takes its default. */
+declare function fromColumnState(saved: Partial<DataGridColumnState>): DataGridColumnState;
+
+export { type DataGridColumnState, type DataGridQuery, type DataGridServerState, DataGridState, fromColumnState, fromQuery, toColumnState, toQuery, toQueryKey, toServerState };

package/dist/server-adapter.js

@@ -0,0 +1,105 @@
+// src/state.ts
+var DEFAULT_PAGE_SIZE = 25;
+var defaultDataGridState = {
+  pagination: { pageIndex: 0, pageSize: DEFAULT_PAGE_SIZE },
+  sorting: [],
+  columnFilters: [],
+  search: "",
+  columnVisibility: {},
+  columnOrder: [],
+  columnPinning: { start: [], end: [] },
+  rowSelection: {},
+  expanded: {},
+  allMatching: false
+};
+
+// src/server-adapter.ts
+var INTERNAL_COLUMN_IDS = /* @__PURE__ */ new Set(["__select", "__expand"]);
+function toServerState(state) {
+  const s = { ...defaultDataGridState, ...state };
+  return {
+    pagination: s.pagination,
+    sorting: s.sorting,
+    columnFilters: s.columnFilters,
+    search: s.search,
+    allMatching: s.allMatching ?? false
+  };
+}
+var isEmptyFilter = (value) => value === void 0 || value === "" || Array.isArray(value) && value.length === 0;
+function toQuery(state) {
+  const s = toServerState(state);
+  const filters = {};
+  const active = s.columnFilters.filter((filter) => !isEmptyFilter(filter.value));
+  for (const filter of [...active].sort((a, b) => a.id < b.id ? -1 : a.id > b.id ? 1 : 0)) {
+    filters[filter.id] = filter.value;
+  }
+  return {
+    page: s.pagination.pageIndex + 1,
+    pageSize: s.pagination.pageSize,
+    sort: s.sorting.map(({ id, desc }) => ({ id, desc })),
+    filters,
+    search: s.search,
+    allMatching: s.allMatching ?? false
+  };
+}
+function toQueryKey(state) {
+  return JSON.stringify(toQuery(state));
+}
+var isPositiveInteger = (value) => typeof value === "number" && Number.isInteger(value) && value > 0;
+var isPlainObject = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
+function toSortEntry(entry) {
+  if (!isPlainObject(entry) || typeof entry.id !== "string" || entry.id === "") return null;
+  return { id: entry.id, desc: entry.desc === true };
+}
+function fromQuery(query) {
+  const pageSize = isPositiveInteger(query.pageSize) ? query.pageSize : defaultDataGridState.pagination.pageSize;
+  const page = isPositiveInteger(query.page) ? query.page : 1;
+  const sorting = [];
+  if (Array.isArray(query.sort)) {
+    for (const entry of query.sort) {
+      const sort = toSortEntry(entry);
+      if (sort) sorting.push(sort);
+    }
+  }
+  const filters = isPlainObject(query.filters) ? query.filters : {};
+  return {
+    pagination: { pageIndex: page - 1, pageSize },
+    sorting,
+    columnFilters: Object.entries(filters).filter(([, value]) => !isEmptyFilter(value)).map(([id, value]) => ({ id, value })),
+    search: typeof query.search === "string" ? query.search : "",
+    allMatching: query.allMatching === true
+  };
+}
+function toColumnState(state) {
+  const s = { ...defaultDataGridState, ...state };
+  const own = (id) => !INTERNAL_COLUMN_IDS.has(id);
+  const visibility = {};
+  for (const [id, visible] of Object.entries(s.columnVisibility)) if (own(id)) visibility[id] = visible;
+  const sizing = {};
+  for (const [id, size] of Object.entries(s.columnSizing ?? {})) if (own(id)) sizing[id] = size;
+  return {
+    columnVisibility: visibility,
+    columnOrder: s.columnOrder.filter(own),
+    columnPinning: { start: (s.columnPinning.start ?? []).filter(own), end: (s.columnPinning.end ?? []).filter(own) },
+    columnSizing: sizing
+  };
+}
+function fromColumnState(saved) {
+  const visibility = { ...saved.columnVisibility };
+  const order = [...saved.columnOrder ?? []];
+  const pinning = { start: [...saved.columnPinning?.start ?? []], end: [...saved.columnPinning?.end ?? []] };
+  return {
+    columnVisibility: visibility,
+    columnOrder: order,
+    columnPinning: pinning,
+    columnSizing: { ...saved.columnSizing }
+  };
+}
+export {
+  fromColumnState,
+  fromQuery,
+  toColumnState,
+  toQuery,
+  toQueryKey,
+  toServerState
+};

package/dist/state-9r5WYKo_.d.ts

@@ -0,0 +1,63 @@
+import { PaginationState, SortingState, ColumnFiltersState, VisibilityState, ColumnOrderState, RowSelectionState, ExpandedState, ColumnSizingState } from '@tanstack/react-table';
+import { ButtonVariant, ButtonTone } from '@zuilib/components/button';
+
+/**
+ * Which columns stick to each edge. Logical directions: `start` is the
+ * inline start (left in LTR, right in RTL). Mapped to TanStack's
+ * `left`/`right` internally.
+ */
+interface DataGridColumnPinning {
+    start: string[];
+    end: string[];
+}
+/**
+ * Everything the grid can change. The consumer owns it: every interaction
+ * calls `onStateChange` with the whole next state, and the grid renders
+ * whatever comes back (a server round-trip in between is the point).
+ */
+interface DataGridState {
+    pagination: PaginationState;
+    sorting: SortingState;
+    columnFilters: ColumnFiltersState;
+    /** The free-text search (the toolbar's search field). */
+    search: string;
+    columnVisibility: VisibilityState;
+    columnOrder: ColumnOrderState;
+    columnPinning: DataGridColumnPinning;
+    rowSelection: RowSelectionState;
+    /** Expanded rows, keyed by row id. UI-only: `toQuery` leaves it out. */
+    expanded: ExpandedState;
+    /**
+     * "Select all N": every row matching the current query is selected, not
+     * only the ones on this page. Set by the selection bar; cleared by any
+     * other selection change. `toQuery` passes it on, the server acts on it.
+     */
+    allMatching?: boolean;
+    /**
+     * Column widths in px, keyed by column id. Optional: left out, the grid
+     * keeps the widths itself; passed (even `{}`), resizes go out through
+     * `onStateChange` so they can be persisted. UI-only: `toQuery` leaves it out.
+     */
+    columnSizing?: ColumnSizingState;
+}
+declare const DEFAULT_PAGE_SIZE = 25;
+declare const defaultDataGridState: DataGridState;
+/** Fills the keys a consumer left out, so the grid always sees a full state. */
+declare function resolveDataGridState(state: Partial<DataGridState> | undefined): DataGridState;
+type DataGridDensity = 'compact' | 'comfortable';
+interface DataGridSelectionActionContext {
+    /** `true` when "Select all N" is on: act on every row matching the query, not only `selectedIds`. */
+    allMatching: boolean;
+    /** The rows matching the query (`rowCount`), the size of the set when `allMatching` is on. */
+    rowCount: number;
+}
+/** A button in the bar that appears while rows are selected. */
+interface DataGridSelectionAction {
+    id: string;
+    label: string;
+    variant?: ButtonVariant;
+    tone?: ButtonTone;
+    onSelect: (selectedIds: string[], context: DataGridSelectionActionContext) => void;
+}
+
+export { DEFAULT_PAGE_SIZE as D, type DataGridColumnPinning as a, type DataGridDensity as b, type DataGridSelectionAction as c, type DataGridSelectionActionContext as d, type DataGridState as e, defaultDataGridState as f, resolveDataGridState as r };

package/dist/types-B00kY3c9.d.ts

@@ -0,0 +1,97 @@
+import { ColumnDef, PaginationState, SortingState, ColumnFiltersState, VisibilityState, ColumnOrderState, ColumnPinningState, RowSelectionState, ExpandedState, ColumnSizingState } from '@tanstack/react-table';
+
+/**
+ * Everything the grid can change. The consumer owns it: every interaction
+ * calls `onStateChange` with the whole next state, and the grid renders
+ * whatever comes back (a server round-trip in between is the point).
+ */
+interface DataGridState {
+    pagination: PaginationState;
+    sorting: SortingState;
+    columnFilters: ColumnFiltersState;
+    globalFilter: string;
+    columnVisibility: VisibilityState;
+    columnOrder: ColumnOrderState;
+    columnPinning: ColumnPinningState;
+    rowSelection: RowSelectionState;
+    /** Expanded rows, keyed by row id. UI-only: `toQuery` leaves it out. */
+    expanded: ExpandedState;
+    /**
+     * Column widths in px, keyed by column id. Optional: left out, the grid
+     * keeps the widths itself; passed (even `{}`), resizes go out through
+     * `onStateChange` so they can be persisted. UI-only: `toQuery` leaves it out.
+     */
+    columnSizing?: ColumnSizingState;
+}
+declare const DEFAULT_PAGE_SIZE = 25;
+declare const defaultDataGridState: DataGridState;
+/** Fills the keys a consumer left out, so the grid always sees a full state. */
+declare function resolveDataGridState(state: Partial<DataGridState> | undefined): DataGridState;
+type DataGridAlign = 'start' | 'center' | 'end';
+/** A text filter: one string, matched however the server matches it. */
+interface DataGridTextFilter {
+    type: 'text';
+    placeholder?: string;
+}
+/** A facet filter: a list of options, of which any number may be picked. */
+interface DataGridSelectFilter {
+    type: 'select';
+    options: readonly {
+        value: string;
+        label?: string;
+    }[];
+}
+/** A date range: ISO `YYYY-MM-DD` bounds, either side optional. */
+interface DataGridDateRangeFilter {
+    type: 'date-range';
+}
+type DataGridFilter = DataGridTextFilter | DataGridSelectFilter | DataGridDateRangeFilter;
+interface DataGridDateRange {
+    from?: string;
+    to?: string;
+}
+/** The ZUI extras on a TanStack column definition. */
+interface DataGridColumnExtras {
+    /** Double-click or Enter on a cell turns it into an input; see `onCellEdit`. */
+    enableInlineEdit?: boolean;
+    /** Horizontal alignment of the head and the cells; `end` for numbers. */
+    align?: DataGridAlign;
+    /** Initial width in px (TanStack `size`); the user can resize from there. */
+    width?: number;
+    /** Declares the column's filter popover. */
+    filter?: DataGridFilter;
+}
+type DataGridColumnDef<TData, TValue = unknown> = ColumnDef<TData, TValue> & DataGridColumnExtras;
+/** The extras may also be declared on `meta` (the TanStack way of extending a column). */
+interface DataGridColumnMeta extends DataGridColumnExtras {
+    /** The column's name in the column manager, the filter chips and the pin labels, when `header` is not a string. */
+    label?: string;
+}
+/** The grid's own strings, overridable for another language. */
+interface DataGridLabels {
+    /** @default 'Pin left' */
+    pinLeft: string;
+    /** @default 'Pin right' */
+    pinRight: string;
+    /** @default 'Unpin' */
+    unpin: string;
+    /** @default 'Expand row' */
+    expandRow: string;
+    /** @default 'Collapse row' */
+    collapseRow: string;
+}
+declare const defaultDataGridLabels: DataGridLabels;
+interface DataGridCellEdit {
+    rowId: string;
+    columnId: string;
+    value: string;
+}
+interface DataGridBulkAction {
+    id: string;
+    label: string;
+    variant?: 'primary' | 'secondary' | 'destructive' | 'outline' | 'ghost';
+    onAction: (selectedIds: string[]) => void;
+}
+type DataGridDensity = 'compact' | 'comfortable';
+
+export { type DataGridState as D, type DataGridDensity as a, type DataGridCellEdit as b, type DataGridBulkAction as c, type DataGridLabels as d, DEFAULT_PAGE_SIZE as e, type DataGridAlign as f, type DataGridColumnDef as g, type DataGridColumnExtras as h, type DataGridColumnMeta as i, type DataGridDateRange as j, type DataGridDateRangeFilter as k, type DataGridFilter as l, type DataGridSelectFilter as m, type DataGridTextFilter as n, defaultDataGridLabels as o, defaultDataGridState as p, resolveDataGridState as r };

package/dist/types-Br4lyM03.d.ts

@@ -0,0 +1,192 @@
+import { ColumnDef, PaginationState, SortingState, ColumnFiltersState, VisibilityState, ColumnOrderState, ColumnPinningState, RowSelectionState, ExpandedState, ColumnSizingState } from '@tanstack/react-table';
+
+/**
+ * Everything the grid can change. The consumer owns it: every interaction
+ * calls `onStateChange` with the whole next state, and the grid renders
+ * whatever comes back (a server round-trip in between is the point).
+ */
+interface DataGridState {
+    pagination: PaginationState;
+    sorting: SortingState;
+    columnFilters: ColumnFiltersState;
+    globalFilter: string;
+    columnVisibility: VisibilityState;
+    columnOrder: ColumnOrderState;
+    columnPinning: ColumnPinningState;
+    rowSelection: RowSelectionState;
+    /** Expanded rows, keyed by row id. UI-only: `toQuery` leaves it out. */
+    expanded: ExpandedState;
+    /**
+     * "Select all N": every row matching the current query is selected, not
+     * only the ones on this page. Set by the bulk bar; cleared by any other
+     * selection change. `toQuery` passes it on, the server acts on it.
+     */
+    allMatching?: boolean;
+    /**
+     * Column widths in px, keyed by column id. Optional: left out, the grid
+     * keeps the widths itself; passed (even `{}`), resizes go out through
+     * `onStateChange` so they can be persisted. UI-only: `toQuery` leaves it out.
+     */
+    columnSizing?: ColumnSizingState;
+}
+declare const DEFAULT_PAGE_SIZE = 25;
+declare const defaultDataGridState: DataGridState;
+/** Fills the keys a consumer left out, so the grid always sees a full state. */
+declare function resolveDataGridState(state: Partial<DataGridState> | undefined): DataGridState;
+type DataGridAlign = 'start' | 'center' | 'end';
+/** A text filter: one string, matched however the server matches it. */
+interface DataGridTextFilter {
+    type: 'text';
+    placeholder?: string;
+}
+/** A facet filter: a list of options, of which any number may be picked. */
+interface DataGridSelectFilter {
+    type: 'select';
+    options: readonly {
+        value: string;
+        label?: string;
+    }[];
+}
+/** A date range: ISO `YYYY-MM-DD` bounds, either side optional. */
+interface DataGridDateRangeFilter {
+    type: 'date-range';
+}
+type DataGridFilter = DataGridTextFilter | DataGridSelectFilter | DataGridDateRangeFilter;
+interface DataGridDateRange {
+    from?: string;
+    to?: string;
+}
+/** The ZUI extras on a TanStack column definition. */
+interface DataGridColumnExtras {
+    /** Double-click or Enter on a cell turns it into an input; see `onCellEdit`. */
+    enableInlineEdit?: boolean;
+    /** Horizontal alignment of the head and the cells; `end` for numbers. */
+    align?: DataGridAlign;
+    /** Initial width in px (TanStack `size`); the user can resize from there. */
+    width?: number;
+    /** Declares the column's filter popover. */
+    filter?: DataGridFilter;
+}
+type DataGridColumnDef<TData, TValue = unknown> = ColumnDef<TData, TValue> & DataGridColumnExtras;
+/** The extras may also be declared on `meta` (the TanStack way of extending a column). */
+interface DataGridColumnMeta extends DataGridColumnExtras {
+    /** The column's name in the column manager, the filter chips and the pin labels, when `header` is not a string. */
+    label?: string;
+}
+/**
+ * Every string the grid renders or announces, overridable for another
+ * language. A `{name}` placeholder is replaced with the value named.
+ */
+interface DataGridLabels {
+    /** @default 'Pin left' */
+    pinLeft: string;
+    /** @default 'Pin right' */
+    pinRight: string;
+    /** @default 'Unpin' */
+    unpin: string;
+    /** @default 'Expand row' */
+    expandRow: string;
+    /** @default 'Collapse row' */
+    collapseRow: string;
+    /** The sr-only head of the expand column. @default 'Expand' */
+    expandColumn: string;
+    /** Bulk bar: the count of selected rows. `{count}` is replaced. @default '{count} selected' */
+    selectedCount: string;
+    /** Bulk bar: the count when every matching row is selected. `{count}` is replaced. @default 'All {count} selected' */
+    allMatchingSelected: string;
+    /** Bulk bar: the button that selects every matching row. `{count}` is replaced. @default 'Select all {count}' */
+    selectAllMatching: string;
+    /** @default 'Clear selection' */
+    clearSelection: string;
+    /** The bulk bar's region name. @default 'Bulk actions' */
+    bulkActions: string;
+    /** The head checkbox. @default 'Select all rows on this page' */
+    selectAllOnPage: string;
+    /** A row checkbox. @default 'Select row' */
+    selectRow: string;
+    /** The footer's `<nav>` name. @default 'Pagination' */
+    pagination: string;
+    /** @default 'Rows per page' */
+    rowsPerPage: string;
+    /** The range text while loading. @default 'Loading…' */
+    loading: string;
+    /** The range text. `{first}`, `{last}` and `{total}` are replaced. @default '{first}–{last} of {total}' */
+    range: string;
+    /** @default 'First page' */
+    firstPage: string;
+    /** @default 'Previous page' */
+    previousPage: string;
+    /** @default 'Next page' */
+    nextPage: string;
+    /** @default 'Last page' */
+    lastPage: string;
+    /** The toolbar search field's name. @default 'Search' */
+    search: string;
+    /** The toolbar search field's placeholder. @default 'Search…' */
+    searchPlaceholder: string;
+    /** The filter chip list's name. @default 'Active filters' */
+    activeFilters: string;
+    /** A chip's remove button. `{column}` is replaced. @default 'Remove {column} filter' */
+    removeFilter: string;
+    /** The column manager button and its list. @default 'Columns' */
+    columns: string;
+    /** `{column}` is replaced. @default 'Move {column} up' */
+    moveUp: string;
+    /** `{column}` is replaced. @default 'Move {column} down' */
+    moveDown: string;
+    /** The column manager's addable-fields section. @default 'Add column' */
+    addColumnSection: string;
+    /** An addable field's button. `{column}` is replaced. @default 'Add {column}' */
+    addColumn: string;
+    /** The funnel button. `{column}` is replaced. @default 'Filter {column}' */
+    filterColumn: string;
+    /** The funnel button while a filter is set. `{column}` is replaced. @default 'Filter {column} (active)' */
+    filterColumnActive: string;
+    /** The text filter input. @default 'Filter value' */
+    filterValue: string;
+    /** The text filter placeholder when the column declares none. @default 'Contains…' */
+    filterPlaceholder: string;
+    /** The facet filter's checkbox group. @default 'Options' */
+    filterOptions: string;
+    /** @default 'From' */
+    from: string;
+    /** @default 'To' */
+    to: string;
+    /** @default 'Clear' */
+    clear: string;
+    /** @default 'Apply' */
+    apply: string;
+    /** A date-range chip with only a lower bound. `{date}` is replaced. @default 'from {date}' */
+    rangeFrom: string;
+    /** A date-range chip with only an upper bound. `{date}` is replaced. @default 'until {date}' */
+    rangeUntil: string;
+    /** The resize handle. `{column}` is replaced. @default 'Resize {column}' */
+    resizeColumn: string;
+    /** The inline edit input. `{column}` is replaced. @default 'Edit {column}' */
+    editColumn: string;
+    /** The default empty state's title. @default 'No results' */
+    noResults: string;
+    /** The default empty state's description. @default 'Try a different search or clear the filters.' */
+    noResultsDescription: string;
+}
+declare const defaultDataGridLabels: DataGridLabels;
+interface DataGridCellEdit {
+    rowId: string;
+    columnId: string;
+    value: string;
+}
+interface DataGridBulkActionContext {
+    /** `true` when "Select all N" is on: act on every row matching the query, not only `selectedIds`. */
+    allMatching: boolean;
+    /** The rows matching the query (`rowCount`), the size of the set when `allMatching` is on. */
+    rowCount: number;
+}
+interface DataGridBulkAction {
+    id: string;
+    label: string;
+    variant?: 'primary' | 'secondary' | 'destructive' | 'outline' | 'ghost';
+    onAction: (selectedIds: string[], context: DataGridBulkActionContext) => void;
+}
+type DataGridDensity = 'compact' | 'comfortable';
+
+export { DEFAULT_PAGE_SIZE as D, type DataGridAlign as a, type DataGridBulkAction as b, type DataGridBulkActionContext as c, type DataGridCellEdit as d, type DataGridColumnDef as e, type DataGridColumnExtras as f, type DataGridColumnMeta as g, type DataGridDateRange as h, type DataGridDateRangeFilter as i, type DataGridDensity as j, type DataGridFilter as k, type DataGridLabels as l, type DataGridSelectFilter as m, type DataGridState as n, type DataGridTextFilter as o, defaultDataGridLabels as p, defaultDataGridState as q, resolveDataGridState as r };

package/dist/types-D4DDIl3w.d.ts

@@ -0,0 +1,73 @@
+import { ColumnDef, PaginationState, SortingState, ColumnFiltersState, VisibilityState, ColumnOrderState, ColumnPinningState, RowSelectionState } from '@tanstack/react-table';
+
+/**
+ * Everything the grid can change. The consumer owns it: every interaction
+ * calls `onStateChange` with the whole next state, and the grid renders
+ * whatever comes back (a server round-trip in between is the point).
+ */
+interface DataGridState {
+    pagination: PaginationState;
+    sorting: SortingState;
+    columnFilters: ColumnFiltersState;
+    globalFilter: string;
+    columnVisibility: VisibilityState;
+    columnOrder: ColumnOrderState;
+    columnPinning: ColumnPinningState;
+    rowSelection: RowSelectionState;
+}
+declare const DEFAULT_PAGE_SIZE = 25;
+declare const defaultDataGridState: DataGridState;
+/** Fills the keys a consumer left out, so the grid always sees a full state. */
+declare function resolveDataGridState(state: Partial<DataGridState> | undefined): DataGridState;
+type DataGridAlign = 'start' | 'center' | 'end';
+/** A text filter: one string, matched however the server matches it. */
+interface DataGridTextFilter {
+    type: 'text';
+    placeholder?: string;
+}
+/** A facet filter: a list of options, of which any number may be picked. */
+interface DataGridSelectFilter {
+    type: 'select';
+    options: readonly {
+        value: string;
+        label?: string;
+    }[];
+}
+/** A date range: ISO `YYYY-MM-DD` bounds, either side optional. */
+interface DataGridDateRangeFilter {
+    type: 'date-range';
+}
+type DataGridFilter = DataGridTextFilter | DataGridSelectFilter | DataGridDateRangeFilter;
+interface DataGridDateRange {
+    from?: string;
+    to?: string;
+}
+/** The ZUI extras on a TanStack column definition. */
+interface DataGridColumnExtras {
+    /** Double-click or Enter on a cell turns it into an input; see `onCellEdit`. */
+    enableInlineEdit?: boolean;
+    /** Horizontal alignment of the head and the cells; `end` for numbers. */
+    align?: DataGridAlign;
+    /** Initial width in px (TanStack `size`); the user can resize from there. */
+    width?: number;
+    /** Declares the column's filter popover. */
+    filter?: DataGridFilter;
+}
+type DataGridColumnDef<TData, TValue = unknown> = ColumnDef<TData, TValue> & DataGridColumnExtras;
+/** The extras may also be declared on `meta` (the TanStack way of extending a column). */
+interface DataGridColumnMeta extends DataGridColumnExtras {
+}
+interface DataGridCellEdit {
+    rowId: string;
+    columnId: string;
+    value: string;
+}
+interface DataGridBulkAction {
+    id: string;
+    label: string;
+    variant?: 'primary' | 'secondary' | 'destructive' | 'outline' | 'ghost';
+    onAction: (selectedIds: string[]) => void;
+}
+type DataGridDensity = 'compact' | 'comfortable';
+
+export { type DataGridState as D, type DataGridDensity as a, type DataGridCellEdit as b, type DataGridBulkAction as c, DEFAULT_PAGE_SIZE as d, type DataGridAlign as e, type DataGridColumnDef as f, type DataGridColumnExtras as g, type DataGridColumnMeta as h, type DataGridDateRange as i, type DataGridDateRangeFilter as j, type DataGridFilter as k, type DataGridSelectFilter as l, type DataGridTextFilter as m, defaultDataGridState as n, resolveDataGridState as r };