import type { EventEmitter } from '../../stencil-public-runtime';
import type { LocaleProp } from '../../utils/locale';
import type { TableColumn, TableHeaderStyle, TableRowClickDetail, TableRowData, TableRowStyle, TableSelectionChangeDetail, TableSortChangeDetail, TableSortDirection } from './mud-table.types';
/**
* Table — data table molecule for tabular content with optional sorting,
* selection, and responsive mobile collapse.
*
* Pattern B (molecule, internal DOM): renders a native `
` inside
* shadow DOM for full a11y semantics (`role="table"`, `role="columnheader"`,
* `aria-sort`, `aria-selected`). Composes existing primitives — `mud-checkbox`
* for the selection column, `mud-icon` for sort chevrons. Status badges and
* row actions are projected via named slots so consumers can drop in
* `mud-tag`, `mud-button`, or any custom content per cell.
*
* At a viewport width of ≤640 px the inline padding shrinks from 24 → 16 to
* match Figma's "Mobile" breakpoint specs (table-header `4930:14358`,
* table-cell `649:4296`). The table structure itself is preserved; consumers
* who need a card-stack layout on narrow screens should wrap their own
* presentation around the data.
*
* @element mud-table
*
* @slot header-cell-{key} - Custom rendering for a specific column header.
* Replaces the auto-rendered label + sort affordance.
* @slot cell-{key}-{rowId} - Custom content for one cell: the column's `key` and the
* row's `rowIdField` value (its index when the row has
* none). Useful for status tags, action buttons, or any
* non-text content. The cell follows its row when `rows`
* is sorted or filtered.
* @slot cell-{key}-{rowIndex} - Deprecated: addresses a row by its position, so the
* content stays put when `rows` is reordered. Use
* `cell-{key}-{rowId}`; when a row id equals another
* row's index, the id wins.
* @slot empty - Custom empty-state content when `rows` is empty or undefined.
*/
export declare class MudTable {
/**
* Header treatment. `default` is the subtle gray header used on light
* surfaces; `inverted` is the strong dark-on-light header for emphasis.
* @default 'default'
*/
headerStyle: TableHeaderStyle;
/**
* Row treatment.
* - `divided` (default) — horizontal divider line below every row.
* - `zebra` — alternating row backgrounds (no dividers).
* - `borderless` — flat rows, no dividers, no zebra.
* @default 'divided'
*/
rowStyle: TableRowStyle;
/**
* Enables hover highlight on rows. Independent of selection.
* @default false
*/
hoverable: boolean;
/**
* Renders a leading checkbox column for multi-row selection.
* @default false
*/
selectable: boolean;
/**
* Master switch that disables sorting for the WHOLE table, overriding every
* column's `sortable` flag at once. When `true`, headers render as plain
* labels — no sort chevron, not keyboard-focusable, no `aria-sort`, and
* `mudSort` never fires. Useful for read-only or loading states without
* having to mutate the `columns` array.
*
* Per-column control is unchanged: to make just one column non-sortable,
* omit `sortable` (or set it to `false`) on that column instead.
* @default false
*/
disableSort: boolean;
/**
* Column definitions. Each entry maps a row field (`key`) to a header
* `label`, an optional `sortable` flag, alignment, and width.
*/
columns?: TableColumn[];
/**
* Row data. Each row is keyed by the field declared in `rowIdField`
* (defaults to `id`). Missing IDs fall back to row index.
*/
rows?: TableRowData[];
/**
* Currently sorted column key (controlled). When unset no sort glyph is
* highlighted.
*/
sortColumn?: string;
/**
* Sort direction for `sortColumn`. Ignored when `sortColumn` is unset.
*/
sortDirection?: TableSortDirection;
/**
* Selected row IDs (controlled). Each entry must correspond to a row's
* `rowIdField` value (stringified). Toggling rows or the master
* checkbox emits `mudSelectionChange` — the consumer reflects the new
* array back via this prop.
*/
selectedRows?: string[];
/**
* Field used to uniquely identify a row. Used for selection state and
* stable React-like keys.
* @default 'id'
*/
rowIdField: string;
/**
* Language of the built-in copy. Unset, the component follows the closest ancestor `lang`
* (`` included), else `ro-MD`.
*/
locale?: LocaleProp;
/**
* Empty-state text shown when `rows` is empty or undefined. Overrides the `locale`'s copy
* when set to a non-empty string.
* @default 'Nu există date de afișat.' (ro-MD)
*/
emptyText?: string;
/**
* Accessible label for the header "select all rows" checkbox. Overrides the `locale`'s
* copy when set to a non-empty string.
* @default 'Selectează toate rândurile' (ro-MD)
*/
selectAllLabel?: string;
/**
* Accessible label for a row's selection checkbox. Carries a `{row}` placeholder, filled
* with the row's 1-based position. Overrides the `locale`'s copy when set to a non-empty
* string.
* @default 'Selectează rândul {row}' (ro-MD)
*/
selectRowLabel?: string;
/**
* The host's `aria-label` (attribute or native `ariaLabel` property), propagated
* to the rendered `` element.
*/
private resolvedAriaLabel?;
private headerCellSlotted;
/** Internal host reference. */
host: HTMLMudTableElement;
/** Emitted when the user activates a sortable header. */
mudSort: EventEmitter;
/** Emitted when a row body is clicked (excluding the selection checkbox). */
mudRowClick: EventEmitter;
/** Emitted when the selection set changes. */
mudSelectionChange: EventEmitter;
validateHeaderStyle(next: TableHeaderStyle): void;
validateRowStyle(next: TableRowStyle): void;
validateSortDirection(next: TableSortDirection | undefined): void;
private stopAriaLabel?;
private stopLang?;
/** Legacy cell-slot shapes already warned about, one warning per shape per instance. */
private warnedCellSlots;
connectedCallback(): void;
disconnectedCallback(): void;
componentDidRender(): void;
/**
* Built-in strings in the resolved locale, with the override props on top.
*/
private messages;
private getRowId;
private isRowSelected;
private allRowsSelected;
private someRowsSelected;
private handleSort;
handleHeaderKeyDown(event: KeyboardEvent): void;
private handleRowClick;
private handleSelectAll;
private handleRowSelect;
/**
* Builds the inline `style` object used to flow a consumer-defined column
* width into the rendered `| `. The value is exposed as a CSS custom
* property (`--col-width`) so the .th rule in mud-table.css owns the
* actual `width` declaration — keeping all visual rules in the CSS file
* while still allowing per-column overrides at runtime.
*/
private columnWidthStyle;
/**
* A column is sortable only when its own `sortable` flag is set AND the
* table-level `disableSort` master switch is off. Centralised here so every
* sort affordance (icon, focus, aria-sort, click, keyboard) stays in sync.
*/
private isColumnSortable;
private getAriaSort;
private renderSortIcon;
private onHeaderCellSlotChange;
private renderHeaderCellContent;
/**
* Warns once about each legacy cell-slot shape among the host's children: a bare
* `cell-{key}`, which only the first row can receive (the DOM assigns a slot name to
* the first slot that carries it), and the deprecated `cell-{key}-{rowIndex}`.
*/
private warnLegacyCellSlots;
private renderCellContent;
private renderEmptyState;
render(): any;
}
|