@eunomia/elements 1.0.0-beta.5 → 1.0.0-beta.7

package/dist/features/table/table/table.d.ts

@@ -1,106 +1,130 @@
 import { LitElement, PropertyValues, TemplateResult } from "lit";
 import { EunomiaTableAction, EunomiaTableColumnDef, EunomiaTableRowActionDef } from "./table.types.js";
-import "../table-skeleton-row/table-skeleton-row.js";
+import "../../../components/form/checkbox/checkbox.js";
+import "../../../components/action/button/button.js";
+import "../../../components/action/dropdown-button/dropdown-button.js";
+import "../../../components/content/icon/icon.js";
 import "../../../components/loader/loader/loader.js";
+import "../../../components/loader/skeleton/skeleton.js";
 /**
  * Tag name of the table component.
  */
 export declare const EunomiaTableTagName = "eun-table";
-declare const EunomiaTable_base: import("../../../utils/constructor.type.js").Constructor<import("../../../mixins/load-more-sentinel.mixin.js").LoadMoreSentinelMixinInterface> & typeof LitElement;
+declare const EunomiaTable_base: import("../../../utils/constructor.type.js").Constructor<import("../../../mixins/localizable.mixin.js").LocalizableMixinInterface> & import("../../../utils/constructor.type.js").Constructor<import("../../../mixins/load-more-sentinel.mixin.js").LoadMoreSentinelMixinInterface> & typeof LitElement;
 /**
- * A row-and-column-based grid (`<eun-table>`), usable two ways, both
- * producing the exact same DOM, CSS, and behavior underneath, since the
- * second is just a generator for the first :
+ * A data table built on a native `<table>` (`<eun-table><table>…</table></eun-table>`).
+ * The table keeps its native semantics (`table`, `row`, `columnheader`,
+ * `rowheader`, `cell`), renders before any script runs, and holds any
+ * content: tags, icons, buttons, dropdown buttons, links.
  *
- * Every row shares one set of column tracks via CSS Subgrid : `eun-table`'s
- * own shadow root is `display: grid` with a bare `<slot>` (no wrapper), per
- * the flat-tree slotting model, a slot's assigned nodes render as if they
- * were direct children of the host, so `eun-table-header`/`eun-table-item`
- * become direct items of this grid despite living in separate shadow
- * roots. Each of those, in turn, sets `grid-template-columns: subgrid` on
- * its own `:host`, inheriting the exact same tracks the browser computed
- * once for the whole grid: this is what keeps `auto`/flexible columns
- * pixel-aligned across every row with zero JS measurement. The track list
- * itself (from `eun-table-column`'s `width`, plus a select/action track
- * when relevant) is computed in `updateColumnsTemplate` and applied as the
- * `--_columns` custom property `table.styles.ts`'s `:host` reads.
+ * `eun-table` styles the slotted table from the light DOM and layers the
+ * optional behaviors on top: row selection with a checkbox column it
+ * generates and a floating action bar, row end actions revealed on hover
+ * (cells marked `data-table-action`), clickable rows, sticky header,
+ * footer, and columns, loading placeholders, and scroll-driven pagination.
+ * Without any of those, it's a plain, read-only table.
  *
- * Selection, sticky flags, and row-to-row keyboard navigation are all
- * pushed down onto the header/items imperatively (the same "poke state onto
- * slotted children" pattern `eun-toggle-group` uses for its own
- * `eun-toggle-item`s) rather than those elements pulling state from a
- * shared config object, since they're consumer-authored tags, not
- * data-driven renders.
+ * A row click follows the link marked `data-table-row-link` in that row,
+ * which stays the keyboard way to reach it. Rows are identified by their
+ * `data-row-key` attribute. A `<tfoot>` holds
+ * summary rows, kept out of the selection. A `<caption>` stays in the
+ * table for its semantics, and shows above the table's frame.
  *
- * @slot [default] - One `eun-table-header` followed by any number of `eun-table-item`s
- * @prop {boolean} [selectable=false] - Enables row selection (checkboxes, select-all, the floating action bar)
- * @prop {boolean} [checkboxAlwaysVisible=false] - Keeps every row's own checkbox visible at all times instead of only on hover/focus/selection ; the header's own select-all checkbox is already always visible regardless of this (see `stickyHeader`)
+ * @slot [default] - A native `<table>`, with a `<thead>`, a `<tbody>`, and an optional `<caption>` and `<tfoot>`
+ * @csspart frame - The bordered scroll container around the table
+ * @prop {boolean} [selectable=false] - Enables row selection (generated checkbox column, select-all, the floating action bar)
+ * @prop {boolean} [checkboxAlwaysVisible=false] - Keeps every row's own checkbox visible at all times instead of only on hover/focus/selection
  * @attr {boolean} [checkbox-always-visible=false] - Keeps every row's own checkbox visible at all times instead of only on hover/focus/selection
- * @prop {boolean} [actionAlwaysVisible=false] - Keeps every row's own row-end action (`slot="action"`, or a `rowAction`-generated one) visible at all times instead of only on hover/focus ; still cedes to the floating action bar once a row is selected, same as the hover-only default
- * @attr {boolean} [action-always-visible=false] - Keeps every row's own row-end action visible at all times instead of only on hover/focus
- * @prop {boolean} [stickyHeader=false] - Pins the header to the top of the table's own scroll container ; once pinned, the header never renders the select-all checkbox (even while `selectable`) or any hover styling, since it stays permanently visible rather than only appearing on hover/focus
+ * @prop {boolean} [actionAlwaysVisible=false] - Keeps every row end action (a `data-table-action` cell's content) visible at all times instead of only on hover/focus ; still hidden while rows are selected
+ * @attr {boolean} [action-always-visible=false] - Keeps every row end action visible at all times instead of only on hover/focus
+ * @prop {boolean} [stickyHeader=false] - Pins the `<thead>` to the top of the table's own scroll container
  * @attr {boolean} [sticky-header=false] - Pins the header to the top
+ * @prop {boolean} [stickyFooter=false] - Pins the `<tfoot>` to the bottom of the table's own scroll container
+ * @attr {boolean} [sticky-footer=false] - Pins the footer to the bottom
  * @prop {boolean} [stickyFirstColumn=false] - Pins the first data column to the start edge
  * @attr {boolean} [sticky-first-column=false] - Pins the first data column to the start edge
- * @prop {boolean} [stickyLastColumn=false] - Pins the last data column to the end edge
+ * @prop {boolean} [stickyLastColumn=false] - Pins the last data column, and the row end action column, to the end edge
  * @attr {boolean} [sticky-last-column=false] - Pins the last data column to the end edge
- * @prop {boolean} [clearOnEscape=false] - Whether `Escape` clears the selection while the action bar is shown ; off by default so it never fights a consumer's own global `Escape` handling
+ * @prop {boolean} [clearOnEscape=false] - Whether `Escape` clears the selection while the action bar is shown
  * @attr {boolean} [clear-on-escape=false] - Whether `Escape` clears the selection while the action bar is shown
- * @prop {Array<string>} [selectedKeys=[]] - The currently selected rows' keys ; settable from outside for a "controlled" table, always reflecting the live selection either way
+ * @prop {Array<string>} [selectedKeys=[]] - The currently selected rows' keys ; settable from outside for a "controlled" table
  * @prop {Array<import('./table.types.js').EunomiaTableAction>} [actions=[]] - Custom actions rendered in the floating action bar's center region
- * @prop {string} [selectedLabel='selected'] - Text shown after the count in the action bar's badge
+ * @prop {string} [selectedLabel='selected'] - Text shown after the count in the action bar's badge ; translated from `locale` while unset
  * @attr {string} [selected-label='selected'] - Text shown after the count in the action bar's badge
- * @prop {string} [selectAllLabel='Select all'] - Label of the action bar's select-all button while not every row is selected
+ * @prop {string} [selectAllLabel='Select all'] - Label of the action bar's select-all button while not every row is selected ; translated from `locale` while unset
  * @attr {string} [select-all-label='Select all'] - Label of the action bar's select-all button
- * @prop {string} [deselectAllLabel='Deselect all'] - Label of the action bar's select-all button once every row is selected
+ * @prop {string} [deselectAllLabel='Deselect all'] - Label of the action bar's select-all button once every row is selected ; translated from `locale` while unset
  * @attr {string} [deselect-all-label='Deselect all'] - Label of the action bar's select-all button once every row is selected
- * @prop {string} [selectAllAriaLabel='Select all rows'] - Accessible label for the header's select-all checkbox while not every row is selected
+ * @prop {string} [selectAllAriaLabel='Select all rows'] - Accessible label for the header's select-all checkbox while not every row is selected ; translated from `locale` while unset
  * @attr {string} [select-all-aria-label='Select all rows'] - Accessible label for the header's select-all checkbox
- * @prop {string} [deselectAllAriaLabel='Deselect all rows'] - Accessible label for the header's select-all checkbox once every row is selected
+ * @prop {string} [deselectAllAriaLabel='Deselect all rows'] - Accessible label for the header's select-all checkbox once every row is selected ; translated from `locale` while unset
  * @attr {string} [deselect-all-aria-label='Deselect all rows'] - Accessible label for the header's select-all checkbox
- * @prop {string} [selectRowAriaLabel='Select row'] - Accessible label prefix for each row's own checkbox (its 1-based row number is appended)
+ * @prop {string} [selectRowAriaLabel='Select row'] - Accessible label prefix for each row's own checkbox, followed by the row header's text, or its 1-based row number without one ; translated from `locale` while unset
  * @attr {string} [select-row-aria-label='Select row'] - Accessible label prefix for each row's own checkbox
- * @prop {string} [toolbarAriaLabel='Selection actions'] - Accessible label for the floating action bar itself
+ * @prop {string} [toolbarAriaLabel='Selection actions'] - Accessible label for the floating action bar itself ; translated from `locale` while unset
  * @attr {string} [toolbar-aria-label='Selection actions'] - Accessible label for the floating action bar itself
- * @prop {string} [closeActionBarAriaLabel='Clear selection'] - Accessible label for the action bar's close button
+ * @prop {string} [closeActionBarAriaLabel='Clear selection'] - Accessible label for the action bar's close button ; translated from `locale` while unset
  * @attr {string} [close-action-bar-aria-label='Clear selection'] - Accessible label for the action bar's close button
- * @prop {Array<import('./table.types.js').EunomiaTableColumnDef<T>>} [columns] - Programmatic alternative to hand-authoring `eun-table-header`/`eun-table-column` : when set, `eun-table` generates that exact markup itself from `columns`/`data`. Setting this puts the table in "managed" mode: it owns its own light DOM from then on ; don't also hand-author `eun-table-header`/`eun-table-item` children
+ * @prop {Array<import('./table.types.js').EunomiaTableColumnDef<T>>} [columns] - Programmatic alternative to authoring the `<table>` : when set, `eun-table` renders the native table itself from `columns`/`data`, and owns its light DOM from then on
  * @prop {Array<T>} [data=[]] - The rows to render, in "managed" mode (see `columns`)
- * @prop {import('./table.types.js').EunomiaTableRowActionDef<T>} [rowAction] - A single row-end action (button or dropdown), in "managed" mode: the data-driven equivalent of a `slot="action"` element
- * @prop {(row: T, index: number) => string} [rowKey] - Computes each row's stable key, in "managed" mode ; defaults to a DOM-order fallback, same caveat as `eun-table-item`'s own `row-key`
- * @fires {TableSelectionChangeEvent} euntableselectionchange - Emitted whenever the selection changes, from any source
- * @fires {TableActionEvent} euntableaction - Emitted when a floating action bar action is activated
- * @prop {boolean} [loading=false] - Shows `skeletonRows` shimmering placeholder rows in place of the real ones: the header stays visible, only `eun-table-item`s are hidden ; set back to `false` once real data has arrived
+ * @prop {import('./table.types.js').EunomiaTableRowActionDef<T>} [rowAction] - A single row end action (button or dropdown), in "managed" mode
+ * @prop {(row: T, index: number) => string} [rowKey] - Computes each row's stable key, in "managed" mode ; defaults to a DOM-order fallback
+ * @prop {boolean} [loading=false] - Shows `skeletonRows` placeholder rows in place of the body rows ; the header stays visible
  * @prop {number} [skeletonRows=6] - Number of placeholder rows rendered while `loading`
  * @attr {number} [skeleton-rows=6] - Number of placeholder rows rendered while `loading`
- * @prop {boolean} [syncing=false] - Shows a shimmering overlay sweeping across every already-visible `eun-table-item`, without hiding any of them (unlike `loading`) : for a background refresh of data the user can already see, rather than an initial load with nothing to show yet. Reflects `aria-busy` on the table itself while set
- * @prop {boolean} [clickable=false] - Shows a pointer cursor on a row while it has no row-end action content of its own ; purely visual; a row click already fires `euntablerowclick` regardless of this or any row-end action (see `eun-table-item`)
- * @attr {boolean} [clickable=false] - Shows a pointer cursor on a row while it has no row-end action content of its own
- * @prop {boolean} [infinite=false] - Enables scroll-triggered pagination : dispatches `eunloadmore` once the user scrolls near the end of the table's own scroll container and `hasMore` is `true`, showing a trailing `eun-loader` while `loadingMore` is `true`. Independent of `virtualize`: combine both for `eun-infinite-list` parity, or use `infinite` alone to paginate without detaching any DOM
- * @prop {boolean} [virtualize=false] - Detaches `eun-table-item` pages far from the current scroll position once the known row count exceeds `virtualizeThreshold`, replacing each with a single full-width spacer sized to its last measured height, the same mechanism `eun-infinite-list` uses for its own items, adapted to this table's CSS Subgrid rows. Independent of `infinite`: useful on its own for a very large, already-fully-loaded dataset
- * @prop {number} [pageSize=20] - Number of rows per page: both the unit `eunloadmore` requests are made in, and the chunk size `virtualize` mounts/unmounts as a whole
+ * @prop {boolean} [syncing=false] - Sweeps a shimmer across every visible body row without hiding any, for a background refresh. Sets `aria-busy` on the table while set
+ * @prop {boolean} [clickable=false] - Shows a pointer cursor on body rows ; a row click fires `euntablerowclick` and follows the row's `data-table-row-link` link regardless, which stays the keyboard way to do the same
+ * @prop {boolean} [infinite=false] - Enables scroll-triggered pagination : dispatches `eunloadmore` once the user scrolls near the end of the table's own scroll container and `hasMore` is `true`
+ * @prop {boolean} [virtualize=false] - Detaches body row pages far from the current scroll position once the row count exceeds `virtualizeThreshold`, each replaced by a spacer row of the same height
+ * @prop {number} [pageSize=20] - Number of rows per page, for both `eunloadmore` and `virtualize`
  * @attr {number} [page-size=20] - Number of rows per page
- * @prop {number} [virtualizeThreshold=100] - Total known row count above which `virtualize` actually starts detaching pages
- * @attr {number} [virtualize-threshold=100] - Total known row count above which `virtualize` actually starts detaching pages
- * @prop {number} [bufferPages=1] - Number of extra pages kept mounted before and after the page currently in view
- * @attr {number} [buffer-pages=1] - Number of extra pages kept mounted before and after the page currently in view
- * @prop {boolean} [hasMore=false] - Whether more rows can still be obtained ; the `infinite` sentinel never fires `eunloadmore` while this is `false`
+ * @prop {number} [virtualizeThreshold=100] - Row count above which `virtualize` starts detaching pages
+ * @attr {number} [virtualize-threshold=100] - Row count above which `virtualize` starts detaching pages
+ * @prop {number} [bufferPages=1] - Number of extra pages kept mounted before and after the page in view
+ * @attr {number} [buffer-pages=1] - Number of extra pages kept mounted before and after the page in view
+ * @prop {boolean} [hasMore=false] - Whether more rows can still be obtained
  * @attr {boolean} [has-more=false] - Whether more rows can still be obtained
- * @prop {boolean} [loadingMore=false] - Whether a `eunloadmore` request is currently in flight ; set to `true` right before dispatching the event, left to the consumer to reset once new rows are appended
- * @attr {boolean} [loading-more=false] - Whether a `eunloadmore` request is currently in flight
- * @prop {string} [rootMargin='400px'] - How far before the physical end of the table `eunloadmore` triggers, as a CSS-like margin
- * @attr {string} [root-margin='400px'] - How far before the physical end of the table `eunloadmore` triggers
- * @prop {string} [loadingMoreLabel='Loading more rows…'] - Accessible label passed to the trailing `eun-loader`
+ * @prop {boolean} [loadingMore=false] - Whether a `eunloadmore` request is in flight ; set to `true` right before the event fires, reset by the consumer once rows are appended
+ * @attr {boolean} [loading-more=false] - Whether a `eunloadmore` request is in flight
+ * @prop {string} [rootMargin='400px'] - How far before the end of the table `eunloadmore` triggers, as a CSS-like margin
+ * @attr {string} [root-margin='400px'] - How far before the end of the table `eunloadmore` triggers
+ * @prop {string} [loadingMoreLabel='Loading more rows…'] - Accessible label passed to the trailing `eun-loader` ; translated from `locale` while unset
  * @attr {string} [loading-more-label='Loading more rows…'] - Accessible label passed to the trailing `eun-loader`
- * @fires {LoadMoreEvent} eunloadmore - Dispatched when `infinite` is set, more rows are needed, and `hasMore` is `true` ; `loadingMore` is already `true` by the time this fires
- * @cssprop [--table-border-color] - Set a custom border color
- * @cssprop [--table-background] - Set a custom background color
- * @cssprop [--table-max-height] - Set a custom max height (with scroll) ; `none` by default
- * @cssprop [--table-skeleton-stagger] - Delay between each skeleton row's entrance animation, as a CSS time (e.g. `60ms`)
- * @cssprop [--table-skeleton-duration] - Duration of each skeleton row's own entrance animation, as a CSS time (e.g. `320ms`)
- * @cssprop [--table-loader-color] - Set a custom color for the trailing `eun-loader` shown while `loadingMore` (an `infinite` table)
- * @cssprop [--table-sync-overlay-color] - Set a custom highlight color for the shimmer sweep shown while `syncing`
- * @cssprop [--table-sync-duration] - Set a custom duration for the `syncing` shimmer sweep, as a CSS time (default `1.6s`)
+ * @fires {TableSelectionChangeEvent} euntableselectionchange - Emitted whenever the selection changes, from any source
+ * @fires {TableActionEvent} euntableaction - Emitted when a floating action bar action is activated
+ * @fires {TableRowClickEvent} euntablerowclick - Emitted on a body row click outside its checkbox, its action cell, and any interactive content, while no row is selected ; cancelable, `preventDefault()` keeps the row's `data-table-row-link` link from being followed
+ * @fires {LoadMoreEvent} eunloadmore - Dispatched when `infinite` is set, more rows are needed, and `hasMore` is `true`
+ * @cssprop [--table-border-color] - Sets the border color of the frame and the rows
+ * @cssprop [--table-background] - Sets the background color of the frame
+ * @cssprop [--table-max-height] - Sets a max height, scrolling past it ; `none` by default
+ * @cssprop [--table-caption-color] - Sets the text color of the `<caption>`
+ * @cssprop [--table-caption-font-size] - Sets the font size of the `<caption>`
+ * @cssprop [--table-caption-font-weight] - Sets the font weight of the `<caption>`
+ * @cssprop [--table-header-background] - Sets the background color of the header cells
+ * @cssprop [--table-footer-background] - Sets the background color of the footer cells
+ * @cssprop [--table-row-background] - Sets the background color of the body cells
+ * @cssprop [--table-row-hover-background] - Sets the tint of a hovered or focused body row
+ * @cssprop [--table-row-selected-background] - Sets the tint of a selected body row
+ * @cssprop [--table-row-dragging-background] - Sets the tint of a row being reordered with `createDragReorder`
+ * @cssprop [--table-row-transition-duration] - Sets the duration of the hover and selection tint transitions
+ * @cssprop [--table-column-color] - Sets the text color of the header cells
+ * @cssprop [--table-column-font-weight] - Sets the font weight of the header cells
+ * @cssprop [--table-cell-color] - Sets the text color of the cells
+ * @cssprop [--table-column-border-color] - Sets the color of a vertical divider between columns ; transparent by default
+ * @cssprop [--table-sticky-column-background] - Sets the background color of a sticky column's cells, and of the selection column
+ * @cssprop [--table-sticky-row-background] - Sets the background color of the footer cells while `stickyFooter`
+ * @cssprop [--table-sticky-border-color] - Sets the color of the edges of a sticky header, footer, or column
+ * @cssprop [--table-checkbox-background] - Sets the background color of an unchecked selection checkbox
+ * @cssprop [--table-checkbox-border-color] - Sets the border color of an unchecked selection checkbox
+ * @cssprop [--table-checkbox-hover] - Sets the background color of an unchecked selection checkbox while hovered
+ * @cssprop [--table-action-color] - Sets the text and icon color of a row end action
+ * @cssprop [--eun-table-select-col-width] - Sets the width of the selection column ; 40px by default
+ * @cssprop [--eun-table-action-col-width] - Sets the width of the row end action column, which stays fixed so a sticky last column lines up with it ; 56px by default, enough for an icon-only button
+ * @cssprop [--table-skeleton-stagger] - Delay between each placeholder row's entrance animation, as a CSS time (e.g. `60ms`)
+ * @cssprop [--table-skeleton-duration] - Duration of each placeholder row's entrance animation, as a CSS time (e.g. `320ms`)
+ * @cssprop [--table-loader-color] - Sets the color of the trailing `eun-loader` shown while `loadingMore`
+ * @cssprop [--table-sync-overlay-color] - Sets the highlight color of the `syncing` shimmer sweep
+ * @cssprop [--table-sync-duration] - Sets the duration of the `syncing` shimmer sweep, as a CSS time (default `1.6s`)
  * @element eun-table
  * @template T Shape of a data row, in "managed" `columns`/`data` mode.
  */
@@ -122,6 +146,8 @@ export declare class EunomiaTable<T extends object = Record<string, unknown>> ex
     /** @default false */
     stickyHeader: boolean;
     /** @default false */
+    stickyFooter: boolean;
+    /** @default false */
     stickyFirstColumn: boolean;
     /** @default false */
     stickyLastColumn: boolean;
@@ -151,31 +177,56 @@ export declare class EunomiaTable<T extends object = Record<string, unknown>> ex
     loadingMore: boolean;
     /** @default 400px */
     rootMargin: string;
-    /** @default Loading more rows… */
-    loadingMoreLabel: string;
+    /**
+     * Translated from `locale` while unset.
+     * @default Loading more rows…
+     */
+    loadingMoreLabel?: string;
     /** @default [] */
     actions: EunomiaTableAction[];
-    /** @default selected */
-    selectedLabel: string;
-    /** @default Select all */
-    selectAllLabel: string;
-    /** @default Deselect all */
-    deselectAllLabel: string;
-    /** @default Select all rows */
-    selectAllAriaLabel: string;
-    /** @default Deselect all rows */
-    deselectAllAriaLabel: string;
-    /** @default Select row */
-    selectRowAriaLabel: string;
-    /** @default Selection actions */
-    toolbarAriaLabel: string;
-    /** @default Clear selection */
-    closeActionBarAriaLabel: string;
-    /**
-     * Programmatic alternative to hand-authoring `eun-table-header`/
-     * `eun-table-column` — see the class doc's "Programmatic `columns`/`data`"
-     * section. Setting this (even to an empty array) puts the table in
-     * "managed" mode.
+    /**
+     * Translated from `locale` while unset.
+     * @default selected
+     */
+    selectedLabel?: string;
+    /**
+     * Translated from `locale` while unset.
+     * @default Select all
+     */
+    selectAllLabel?: string;
+    /**
+     * Translated from `locale` while unset.
+     * @default Deselect all
+     */
+    deselectAllLabel?: string;
+    /**
+     * Translated from `locale` while unset.
+     * @default Select all rows
+     */
+    selectAllAriaLabel?: string;
+    /**
+     * Translated from `locale` while unset.
+     * @default Deselect all rows
+     */
+    deselectAllAriaLabel?: string;
+    /**
+     * Translated from `locale` while unset.
+     * @default Select row
+     */
+    selectRowAriaLabel?: string;
+    /**
+     * Translated from `locale` while unset.
+     * @default Selection actions
+     */
+    toolbarAriaLabel?: string;
+    /**
+     * Translated from `locale` while unset.
+     * @default Clear selection
+     */
+    closeActionBarAriaLabel?: string;
+    /**
+     * Programmatic alternative to authoring the `<table>`. Setting this
+     * (even to an empty array) puts the table in "managed" mode.
      */
     columns?: EunomiaTableColumnDef<T>[];
     /**
@@ -184,96 +235,98 @@ export declare class EunomiaTable<T extends object = Record<string, unknown>> ex
      */
     data: T[];
     /**
-     * A single row-end action (button or dropdown), in "managed" mode — the
-     * data-driven equivalent of a `slot="action"` element.
+     * A single row end action (button or dropdown), in "managed" mode.
      */
     rowAction?: EunomiaTableRowActionDef<T>;
     /**
-     * Computes each row's stable key, in "managed" mode ; defaults to a
-     * DOM-order fallback, same caveat as `eun-table-item`'s own `row-key`.
+     * Computes each row's stable key, in "managed" mode.
      */
     rowKey?: (row: T, index: number) => string;
     /**
-     * The current selection, as a `Set` internally — the source of truth
-     * `selectedKeys` reads/writes through. A `@state()`, not a `@property()` :
-     * external reads/writes go through the `selectedKeys` accessor, which
-     * handles change detection and event dispatch explicitly.
+     * The current selection, the source of truth `selectedKeys` reads and
+     * writes through.
      * @internal
      */
     private internalSelection;
     /**
-     * Whether any row currently has action content — computed by scanning
-     * every item's `slot="action"` content, not author-set.
+     * The zero-size marker observed to detect the end of the rows, rendered
+     * only while `infinite` is set.
      * @internal
+     * @readonly
      */
-    private hasAction;
+    private readonly sentinelEl?;
     /**
-     * The header assigned to the default slot, if any.
+     * The framed scroll container wrapping the slotted table. A sticky
+     * header, column, or footer sticks relative to it.
      * @internal
      * @readonly
      */
-    private readonly headerEls;
+    private readonly frameEl?;
     /**
-     * Every `eun-table-item` assigned to the default slot, in order.
+     * Watches the table's `<caption>` size, which this element reserves
+     * above the frame.
      * @internal
-     * @readonly
      */
-    private readonly itemEls;
+    private captionObserver?;
     /**
-     * Watches the header's own `eun-table-column` children — additions,
-     * removals, and `width` changes — none of which a `slotchange` on this
-     * component's own slot would catch (that only fires when the *assigned*
-     * nodes themselves change, not their descendants).
+     * The `<caption>` currently watched by {@link captionObserver}.
      * @internal
      */
-    private headerObserver?;
+    private observedCaption?;
     /**
-     * The header currently wired to {@link headerObserver}, so it's only
-     * recreated when the header itself actually changes.
+     * Watches the light DOM for structural changes (rows, cells, sections)
+     * so generated cells and row state stay in sync.
      * @internal
      */
-    private observedHeader?;
+    private mutationObserver?;
     /**
-     * The body-portaled action bar, while mounted.
+     * The resolved key of every body row known at the last sync.
      * @internal
      */
-    private actionBarEl?;
+    private rowKeys;
+    /**
+     * Whether `aria-rowcount`/`aria-rowindex` were set for `virtualize`, so
+     * they're only ever removed by this component.
+     * @internal
+     */
+    private ariaRowsApplied;
+    /**
+     * The body row count when the last `eunloadmore` fired, to announce how
+     * many rows it added once they arrive.
+     * @internal
+     */
+    private rowCountBeforeLoad?;
     /**
-     * The zero-size marker observed to detect "user reached the end of what's
-     * currently known", rendered directly in this component's own shadow root
-     * (a sibling of the default `<slot>`) only while `infinite` is set — see
-     * `eun-infinite-list`'s own `#sentinel` for the same pattern.
+     * The polite live region announcing rows loaded by `infinite`.
      * @internal
      * @readonly
      */
-    private readonly sentinelEl?;
+    private readonly announcerEl?;
     /**
-     * Every logical `eun-table-item`, mounted or currently virtualized-out
-     * (replaced by a `TABLE_ROW_SPACER_CLASS` placeholder), in document
-     * order — only kept up to date while `virtualize` is set ; `itemEls`
-     * alone (mounted-only) is used otherwise. Reconstructed on every
-     * legitimate `slotchange` (see {@link syncLogicalItems}) by threading each
-     * spacer's cached nodes back into their position, the same reconciliation
-     * `eun-infinite-list`'s own `syncItemsFromLightDom` performs.
+     * The body-portaled action bar, while mounted.
+     * @internal
+     */
+    private actionBarEl?;
+    /**
+     * Every body row, mounted or virtualized-out, in document order ; only
+     * kept up to date while `virtualize` is set.
      * @internal
      */
-    private logicalItems;
+    private logicalRows;
     /**
-     * Page indices currently mounted (their rows are real children of this
-     * host, not replaced by a spacer).
+     * Page indices currently mounted.
      * @internal
      */
     private mountedPages;
     /**
-     * Cached row nodes for each currently-virtualized-out page, keyed by page
-     * index — reattached as-is once a page remounts, so no consumer
-     * state/listeners inside them are ever lost.
+     * Cached rows of each virtualized-out page, reattached as-is once the
+     * page remounts.
      * @internal
      */
     private readonly detachedByPage;
     /**
      * Measured height (px) of each page, filled in the first time it's
-     * unmounted ; used instead of {@link avgRowHeight} once known.
+     * unmounted.
      * @internal
      */
     private pageHeights;
@@ -283,35 +336,12 @@ export declare class EunomiaTable<T extends object = Record<string, unknown>> ex
      */
     private avgRowHeight;
     /**
-     * Set while this component is itself inserting/removing light DOM
-     * children for `virtualize` (mount/unmount), so the resulting
-     * `slotchange` isn't misread as a consumer-driven content change.
-     * @internal
-     */
-    private mutatingSlot;
-    /**
-     * Count of `eunloadmore` events dispatched so far ; becomes the event's
-     * own `page` field.
+     * Count of `eunloadmore` events dispatched so far.
      * @internal
      */
     private requestedPages;
     /** @internal */
     private resizeObserver?;
-    /**
-     * The row that last received focus somewhere within it (its own leading
-     * stop, or any of its content) — tracked so focus can be restored nearby
-     * if that exact row later disconnects (a removal, or `managed` mode's
-     * full re-render via `replaceChildren`) while it's what still holds
-     * focus. Cleared once consumed by {@link restoreFocusIfLost}.
-     * @internal
-     */
-    private lastFocusedRow?;
-    /**
-     * {@link lastFocusedRow}'s row index at the time it was last focused,
-     * used to refocus whatever row now sits in that same slot.
-     * @internal
-     */
-    private lastFocusedRowIndex;
     connectedCallback(): void;
     disconnectedCallback(): void;
     protected firstUpdated(changed: PropertyValues): void;
@@ -323,236 +353,254 @@ export declare class EunomiaTable<T extends object = Record<string, unknown>> ex
     get selectedKeys(): string[];
     set selectedKeys(keys: string[]);
     /**
-     * Regenerates this table's own light DOM from `columns`/`data`/
-     * `rowAction`/`rowKey` — see the class doc's "Programmatic `columns`/
-     * `data`" section. A no-op unless `columns` is set (light-DOM-authored
-     * tables never call this). Previously-selected keys that still exist
-     * among the regenerated rows stay selected ; ones that don't (a row was
-     * removed from `data`) drop out of the selection.
+     * The slotted native table.
      * @private
      */
-    private regenerateManagedChildren;
+    private get tableEl();
     /**
-     * Every `eun-table-item` this table currently knows about — the full
-     * logical set (including virtualized-out pages) while `virtualize` is
-     * set, the mounted-only `itemEls` otherwise.
+     * Whether any body row is currently selected.
      * @private
      */
-    private currentItems;
+    private get selectionActive();
     /**
-     * Tracks {@link lastFocusedRow}/{@link lastFocusedRowIndex} from any
-     * `focusin` landing on a row's own leading stop or its content —
-     * `event.target` is that row itself either way, whether directly focused
-     * or retargeted through its own shadow root ; slotted content (an
-     * `action` button, ...) instead needs `closest`, since it's a light-DOM
-     * descendant rather than something the shadow boundary retargets.
+     * Every visible or accessible text the table renders: its own property
+     * when set, else the `locale` dictionary's.
      * @private
      */
-    private readonly handleFocusIn;
+    private get labels();
     /**
-     * Refocuses whatever row now sits at {@link lastFocusedRowIndex} once
-     * {@link lastFocusedRow} itself has disconnected (removed outright, or
-     * recreated wholesale by `regenerateManagedChildren`) while focus was
-     * still on it or its content — otherwise that focus would just silently
-     * fall back to the document body. Left alone if focus already landed
-     * somewhere else on its own (the consumer moved it deliberately before
-     * the removal), detected by the document's active element no longer
-     * being the body.
+     * Re-syncs on structural light DOM changes only: added or removed rows,
+     * cells, or sections, and a changed `data-row-key`. A change deeper
+     * inside a cell's own content is ignored.
      * @private
      */
-    private restoreFocusIfLost;
+    private readonly handleMutations;
     /**
-     * Re-scans the slotted header/items and pushes every derived/config value
-     * down onto them — called after structural changes (`slotchange`, the
-     * header's own `MutationObserver`, {@link regenerateManagedChildren}) and
-     * whenever a reactive property that affects children changes (see
-     * {@link updated}).
+     * Every body row this table currently knows about: the full logical set
+     * (including virtualized-out pages) while `virtualize` is set, the
+     * mounted rows otherwise.
      * @private
      */
-    private syncChildren;
-    /** @private */
-    private readonly handleSlotChange;
+    private currentRows;
     /**
-     * (Re)installs {@link headerObserver} on `header`, only when it's actually
-     * a different element than last time.
+     * The body section `virtualize` operates on.
      * @private
      */
-    private watchHeaderColumns;
+    private get bodyEl();
     /**
-     * Rebuilds the shared `grid-template-columns` track list from the
-     * header's own `eun-table-column` children's `width`s, and whether any
-     * item currently has action content — see the class doc's CSS Subgrid
-     * section.
+     * Pushes the selection and configuration state down onto the slotted
+     * table: generated selection cells, row state, action cells, the
+     * loading placeholder body, and the action bar. Its own mutations are
+     * dropped from the observer queue so they never trigger another sync.
      * @private
      */
-    private updateColumnsTemplate;
-    /** @private */
-    private wireHeader;
+    private sync;
+    /**
+     * Reserves the height of the table's `<caption>` above the frame, where
+     * the light DOM sheet positions it, and keeps it up to date as the
+     * caption resizes.
+     * @private
+     */
+    private watchCaption;
+    /**
+     * Adds the selection column's leading cell to `row` if missing, and
+     * returns it.
+     * @private
+     */
+    private ensureSelectCell;
     /** @private */
-    private wireItems;
+    private removeSelectCell;
+    /**
+     * Returns the checkbox inside a selection cell, creating it if missing.
+     * @private
+     */
+    private ensureCheckbox;
+    /**
+     * Adds or removes the header's selection cell, holding the select-all
+     * checkbox.
+     * @private
+     */
+    private syncHeader;
+    /**
+     * Keeps footer rows aligned with an empty selection cell.
+     * @private
+     */
+    private syncFooter;
+    /**
+     * Resolves each body row's key and pushes its selection and action cell
+     * state.
+     * @private
+     */
+    private syncRows;
     /**
-     * Every row, header first — the space `ArrowUp`/`ArrowDown`/`Ctrl+Home`/
-     * `Ctrl+End` move across. Excludes every `eun-table-item` while `loading`
-     * is set, since they're hidden (`display: none`) and shouldn't be
-     * reachable ; otherwise the full logical set (mounted or virtualized-out)
-     * while `virtualize` is on, so `Ctrl+End`/`ArrowDown` math stays correct
-     * regardless of what's currently mounted (see {@link ensureRowMounted}).
+     * The name of a body row: the text of its row header (`<th scope="row">`,
+     * or else its first `<th>`), used to label its checkbox.
      * @private
      */
-    private allRows;
+    private rowName;
+    /**
+     * Gives every row its position and the table its total row count while
+     * `virtualize` is set, so assistive technology announces the real size
+     * of the table even though only part of its rows are in the DOM. The
+     * count is `-1` (unknown) while `infinite` can still load more.
+     * @private
+     */
+    private syncAriaRows;
+    /**
+     * Announces how many rows the last `eunloadmore` added, once they're in.
+     * @private
+     */
+    private announceLoadedRows;
+    /**
+     * Adds the placeholder body while `loading`, shaped after the header's
+     * own cells so its columns line up, and removes it otherwise.
+     * @private
+     */
+    private syncSkeleton;
     /** @private */
-    private rowIndexOf;
+    private createSkeleton;
     /**
-     * Moves focus to the row before/after `rowIndex` — `ArrowUp`/`ArrowDown`
-     * delegated up from a row's own `TableRowMixin`. Every row is always its
-     * own permanent `Tab` stop (see `TableRowMixin`'s own class doc), so this
-     * only ever needs to resolve *which* row and hand it a plain `.focus()`,
-     * no column bookkeeping of any kind.
+     * The body row `target` belongs to, if any.
      * @private
      */
-    private moveFocus;
+    private bodyRowOf;
     /**
-     * Moves focus to the header (`Ctrl+Home`) or the last row (`Ctrl+End`).
+     * Whether the click went to interactive content of `row` (a link, a
+     * button, an input, a nested eunomia control) rather than to the row.
      * @private
      */
-    private moveToGridEdge;
+    private isInteractiveClick;
     /**
-     * Moves focus to `rows[rowIndex]`, clamped to the grid's own bounds,
-     * mounting its page first if it's currently virtualized-out.
+     * Toggles a row while rows are selected, otherwise fires
+     * {@link TableRowClickEvent}.
      * @private
      */
-    private focusRowAt;
+    private activateRow;
     /**
-     * Mounts `rows[rowIndex]`'s page first if it's a `eun-table-item`
-     * currently virtualized-out — the same "mount before focusing" fix
-     * `eun-infinite-list`'s own `#focusItem` applies, needed because
-     * `Ctrl+End`/a long `ArrowDown` run can target a row several pages away
-     * from what's currently mounted.
+     * Follows the row's `data-table-row-link` link, if any, keeping the
+     * modifier keys so a `Ctrl`/`Cmd` click still opens a new tab. The link
+     * stays the row's one keyboard-reachable way to do the same.
      * @private
      */
-    private ensureRowMounted;
+    private followRowLink;
+    /** @private */
+    private readonly handleClick;
+    /** @private */
+    private readonly handleCheckboxChange;
     /** @private */
     private toggleRow;
     /** @private */
     private toggleSelectAll;
     /**
-     * Applies a new selection and fires {@link TableSelectionChangeEvent} —
-     * the single path both internal interactions (a checkbox, select-all) and
-     * an external `selectedKeys` assignment funnel through, so the event
-     * fires consistently either way (the same "always fires, whatever the
-     * source" convention `eun-scheduler`'s own `eunperiodchange` uses for its
-     * controlled `view`/`displayedDate`).
+     * Applies a new selection and fires {@link TableSelectionChangeEvent},
+     * whatever the source.
      * @private
      */
     private setSelection;
     /**
-     * Creates the body-portaled action bar the first time it's needed.
+     * Creates the action bar the first time it's needed, right after the
+     * table so it comes next in the `Tab` order, and shows it as a manual
+     * popover so it renders above the page whatever the table's ancestors
+     * clip or transform.
      * @private
      */
     private ensureActionBar;
     /**
-     * Tears down the body-portaled action bar. If focus is currently inside
-     * it (the close button, most often), removing it would otherwise drop
-     * focus to the document body the same way removing a focused row would
-     * (see {@link restoreFocusIfLost}) — except the bar lives outside this
-     * component's own DOM subtree entirely, so that row-focused mechanism
-     * can't see it ; this restores focus back onto the grid itself (its
-     * header, or its first row absent one) instead.
+     * Tears down the action bar. If focus was inside it, it
+     * moves back to the table's first selection checkbox rather than
+     * falling to the document body.
      * @private
      */
     private teardownActionBar;
     /**
-     * Re-dispatches `euntableaction` from `eun-table` itself : the action bar
-     * lives outside this component's own DOM tree entirely (portaled to
-     * `document.body`), so its own `bubbles: true, composed: false` event
-     * never reaches here on its own — the same reasoning `eun-scheduler`'s
-     * `handleEditorCreate` documents for its own embedded (non-portaled but
-     * still non-composed) editor.
+     * Re-dispatches `euntableaction` from `eun-table` itself, since the
+     * action bar is a sibling of this element, not a descendant.
      * @private
      */
     private readonly handlePortaledAction;
     /** @private */
     private readonly handleEscapeClear;
     /**
-     * Mounts/updates/unmounts the floating action bar based on the current
-     * selection.
+     * Mounts, updates, or unmounts the floating action bar based on the
+     * current selection.
      * @private
      */
     private syncActionBar;
     /**
-     * Rebuilds {@link logicalItems} from the current light DOM, reconciling it
-     * with whatever's still cached behind a spacer — the same reconciliation
-     * `eun-infinite-list`'s own `syncItemsFromLightDom` performs, scoped here
-     * to `eun-table-item` children only (the header is excluded, it's never
-     * virtualized). Also recomputes {@link mountedPages} from the rebuilt
-     * page count. A no-op unless `virtualize` is set.
+     * Renders the native table from `columns`/`data`/`rowAction`/`rowKey`
+     * into this element's light DOM. Previously selected keys that no
+     * longer match a row drop out of the selection.
      * @private
      */
-    private syncLogicalItems;
+    private renderManagedTable;
+    /** @private */
+    private columnStyle;
+    /** @private */
+    private renderManagedCell;
+    /**
+     * Renders a row's `rowAction`: a `eun-dropdown-button` for
+     * `type: "dropdown"`, a `eun-button` otherwise.
+     * @private
+     */
+    private renderRowAction;
+    /**
+     * Rebuilds {@link logicalRows} from the body, threading each spacer's
+     * cached rows back into their position, and recomputes
+     * {@link mountedPages}.
+     * @private
+     */
+    private syncLogicalRows;
+    /**
+     * Remounts every virtualized-out page, before the light DOM gets
+     * re-rendered wholesale.
+     * @private
+     */
+    private mountAllPages;
     /** @private */
     private readonly handleTableScroll;
     /**
      * Mounts the page range around the current scroll position and
-     * virtualizes everything outside it, once the known row count passes
-     * `virtualizeThreshold` ; below that, every page simply stays mounted.
+     * virtualizes everything outside it, once the row count passes
+     * `virtualizeThreshold`.
      * @private
      */
     private syncPages;
     /**
-     * Estimates which page the middle of the current viewport falls into, by
-     * walking cumulative page heights — measured ones where known, an
-     * average-based estimate otherwise. `this` is the scroll container itself
-     * (`:host` sets `overflow: auto`, see table.styles.ts), so its own
-     * `scrollTop`/`clientHeight` are read directly.
+     * Estimates which page the middle of the viewport falls into, from
+     * measured page heights where known, an average otherwise.
      * @private
      */
     private estimateCenterPage;
     /** @private */
     private estimatePageHeight;
     /**
-     * Remounts a virtualized-out page by reattaching its cached nodes in
-     * place of its spacer. Returns whether it actually did anything (a no-op
-     * if already mounted), so {@link syncPages} only re-syncs children once
-     * per batch rather than once per page.
+     * Remounts a virtualized-out page in place of its spacer. Returns
+     * whether it did anything.
      * @private
      */
     private mountPage;
     /**
-     * Virtualizes out a mounted page : measures its current rendered height
-     * (used both as its own spacer size and to refine {@link avgRowHeight}),
-     * replaces its rows with a single full-width (`grid-column: 1 / -1`)
-     * spacer of that height so the scrollbar/scroll position don't jump, and
-     * caches the actual nodes for an exact reattach later. Returns whether it
-     * actually did anything (a no-op if already virtualized-out, or if the
-     * page can't be measured — not currently rendered with real layout).
+     * Replaces a mounted page's rows with a single spacer row of the same
+     * measured height, caching the rows for an exact reattach later.
+     * Returns whether it did anything.
      * @private
      */
     private unmountPage;
     /**
-     * (Re)creates {@link resizeObserver}/the scroll listener once `virtualize`
+     * (Re)creates the resize observer and scroll listener once `virtualize`
      * is set, and tears them down once it's cleared.
      * @private
      */
     private ensureVirtualizeObservers;
     /**
      * Sets up (or re-creates, after `rootMargin` changes) the observer
-     * driving {@link maybeLoadMore} — the sentinel lives in this component's
-     * own shadow root (see {@link sentinelEl}), so `this` itself (the scroll
-     * container) is used as the observer's `root`.
+     * driving {@link maybeLoadMore}, with the frame, the scroll container,
+     * as its root.
      * @private
      */
     private setupTableLoadObserver;
     /** @private */
     private maybeLoadMore;
-    /**
-     * Renders `skeletonRows` placeholder rows, each shaped like a real
-     * `eun-table-item` (same select/data/action cell count, via CSS Subgrid)
-     * so they align under the real header's columns. `--_row-index` drives
-     * each row's own staggered entrance animation delay (see
-     * table-skeleton-row.styles.ts).
-     * @private
-     */
-    private renderSkeletonRows;
     render(): TemplateResult;
 }
 declare global {