@mk-kit/ui 0.42.0 → 0.44.0

package/types/mk-kit-ui-icon-extended.d.ts

@@ -0,0 +1,83 @@
+import { MkIconMap } from '@mk-kit/ui/icon';
+import { EnvironmentProviders } from '@angular/core';
+
+/**
+ * GENERATED by scripts/gen-icons.mjs from scripts/icons.json — do not edit.
+ *
+ * The opt-in extended icon set: `MK_EXTENDED_ICONS` (everything) and one `MK_EXTENDED_ICONS_<GROUP>` subset per themed group. Every map is built by a call marked pure, so an app pays only for the maps it actually passes to `provideMkIcons()` / `provideMkExtendedIcons()`.
+ *
+ * Glyphs © Lucide Icons and Contributors, ISC licence (lucide-static
+ * v1.34.0); see THIRD_PARTY_NOTICES.md. Bodies only — the registry-facing
+ * maps wrap them with the same `<svg>` attributes as the hand-made defaults
+ * so both sets render identically.
+ */
+
+/** `navigation` subset of {@link MK_EXTENDED_ICONS} (34 icons). */
+declare const MK_EXTENDED_ICONS_NAVIGATION: MkIconMap;
+/** `layout` subset of {@link MK_EXTENDED_ICONS} (17 icons). */
+declare const MK_EXTENDED_ICONS_LAYOUT: MkIconMap;
+/** `data` subset of {@link MK_EXTENDED_ICONS} (15 icons). */
+declare const MK_EXTENDED_ICONS_DATA: MkIconMap;
+/** `files` subset of {@link MK_EXTENDED_ICONS} (22 icons). */
+declare const MK_EXTENDED_ICONS_FILES: MkIconMap;
+/** `communication` subset of {@link MK_EXTENDED_ICONS} (15 icons). */
+declare const MK_EXTENDED_ICONS_COMMUNICATION: MkIconMap;
+/** `people` subset of {@link MK_EXTENDED_ICONS} (11 icons). */
+declare const MK_EXTENDED_ICONS_PEOPLE: MkIconMap;
+/** `commerce` subset of {@link MK_EXTENDED_ICONS} (23 icons). */
+declare const MK_EXTENDED_ICONS_COMMERCE: MkIconMap;
+/** `status` subset of {@link MK_EXTENDED_ICONS} (20 icons). */
+declare const MK_EXTENDED_ICONS_STATUS: MkIconMap;
+/** `time` subset of {@link MK_EXTENDED_ICONS} (8 icons). */
+declare const MK_EXTENDED_ICONS_TIME: MkIconMap;
+/** `developer` subset of {@link MK_EXTENDED_ICONS} (23 icons). */
+declare const MK_EXTENDED_ICONS_DEVELOPER: MkIconMap;
+/** `devices` subset of {@link MK_EXTENDED_ICONS} (15 icons). */
+declare const MK_EXTENDED_ICONS_DEVICES: MkIconMap;
+/** `media` subset of {@link MK_EXTENDED_ICONS} (14 icons). */
+declare const MK_EXTENDED_ICONS_MEDIA: MkIconMap;
+/** `editing` subset of {@link MK_EXTENDED_ICONS} (34 icons). */
+declare const MK_EXTENDED_ICONS_EDITING: MkIconMap;
+/** `security` subset of {@link MK_EXTENDED_ICONS} (5 icons). */
+declare const MK_EXTENDED_ICONS_SECURITY: MkIconMap;
+/** `travel` subset of {@link MK_EXTENDED_ICONS} (9 icons). */
+declare const MK_EXTENDED_ICONS_TRAVEL: MkIconMap;
+/** `lifestyle` subset of {@link MK_EXTENDED_ICONS} (40 icons). */
+declare const MK_EXTENDED_ICONS_LIFESTYLE: MkIconMap;
+/**
+ * The themed subsets by group name — handy for a picker or for registering
+ * several groups at once: `provideMkIcons(MK_EXTENDED_ICON_GROUPS['files'])`.
+ */
+declare const MK_EXTENDED_ICON_GROUPS: Readonly<Record<string, MkIconMap>>;
+/**
+ * Every Lucide-derived icon (305 glyphs). Not registered by
+ * default — install it with `provideMkExtendedIcons()`, pass a themed subset
+ * to `provideMkIcons()`, or load it lazily:
+ * `provideMkIcons(() => import('@mk-kit/ui/icon/extended').then((m) => m.MK_EXTENDED_ICONS))`.
+ */
+declare const MK_EXTENDED_ICONS: MkIconMap;
+
+/**
+ * Registers the whole Lucide-derived extended set ({@link MK_EXTENDED_ICONS})
+ * so every `<mk-icon name="…">` in the catalogue resolves. Opt-in: without
+ * it only the hand-made defaults are available and an unknown name warns
+ * once in dev mode.
+ *
+ * ```ts
+ * import { provideMkExtendedIcons } from '@mk-kit/ui/icon/extended';
+ *
+ * bootstrapApplication(App, {
+ *   providers: [provideMkExtendedIcons()],
+ * });
+ * ```
+ *
+ * Size-conscious alternatives (see `provideMkIcons`): register only the
+ * themed subsets you use (`provideMkIcons(MK_EXTENDED_ICONS_FILES)`), or load
+ * the full set lazily in its own chunk:
+ * `provideMkIcons(() => import('@mk-kit/ui/icon/extended').then((m) => m.MK_EXTENDED_ICONS))`.
+ * The hand-made defaults keep their names — the generated set never
+ * overlaps them.
+ */
+declare function provideMkExtendedIcons(): EnvironmentProviders;
+
+export { MK_EXTENDED_ICONS, MK_EXTENDED_ICONS_COMMERCE, MK_EXTENDED_ICONS_COMMUNICATION, MK_EXTENDED_ICONS_DATA, MK_EXTENDED_ICONS_DEVELOPER, MK_EXTENDED_ICONS_DEVICES, MK_EXTENDED_ICONS_EDITING, MK_EXTENDED_ICONS_FILES, MK_EXTENDED_ICONS_LAYOUT, MK_EXTENDED_ICONS_LIFESTYLE, MK_EXTENDED_ICONS_MEDIA, MK_EXTENDED_ICONS_NAVIGATION, MK_EXTENDED_ICONS_PEOPLE, MK_EXTENDED_ICONS_SECURITY, MK_EXTENDED_ICONS_STATUS, MK_EXTENDED_ICONS_TIME, MK_EXTENDED_ICONS_TRAVEL, MK_EXTENDED_ICON_GROUPS, provideMkExtendedIcons };

package/types/mk-kit-ui-icon.d.ts

@@ -1,7 +1,7 @@
 import * as _angular_platform_browser from '@angular/platform-browser';
 import { SafeHtml } from '@angular/platform-browser';
 import * as _angular_core from '@angular/core';
-import { EnvironmentProviders } from '@angular/core';
+import { Signal, EnvironmentProviders } from '@angular/core';
 import { MkSize } from '@mk-kit/ui/core';
 
 /**
@@ -29,18 +29,31 @@ declare class MkIcon {
     readonly label: _angular_core.InputSignal<string>;
     /** CSS length for the icon box (width = height = font-size). */
     protected readonly dimension: _angular_core.Signal<string>;
-    /** Sanitized SVG for the named icon, or `null` (falls back to projection). */
+    /**
+     * Sanitized SVG for the named icon, or `null` (falls back to projection).
+     * Tracks the registry's `changes` so a late registration (lazy-loaded set,
+     * runtime `register()`) fills the icon in without re-binding `name`.
+     */
     protected readonly svg: _angular_core.Signal<_angular_platform_browser.SafeHtml | null>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<MkIcon, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<MkIcon, "mk-icon", never, { "name": { "alias": "name"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
+/** A `{ name: '<svg …>…</svg>' }` map — what every registration API accepts. */
+type MkIconMap = Readonly<Record<string, string>>;
+/**
+ * Loads an icon map on demand — typically a dynamic import of the extended
+ * set: `() => import('@mk-kit/ui/icon/extended').then((m) => m.MK_EXTENDED_ICONS)`.
+ */
+type MkIconLoader = () => Promise<MkIconMap>;
 /**
- * IconRegistry — the name → SVG store behind `<mk-icon name="…">`. The built-in
- * sets — the hand-made {@link MK_DEFAULT_ICONS} and the Lucide-derived
- * {@link MK_EXTENDED_ICONS} — are registered on construction; add your own SVGs
- * (from a sprite, a design export, anything) with {@link register} /
- * {@link registerIcons}.
+ * IconRegistry — the name → SVG store behind `<mk-icon name="…">`. The
+ * hand-made {@link MK_DEFAULT_ICONS} are registered on construction and ship
+ * with every app. Everything else is opt-in and tree-shakeable: the
+ * Lucide-derived extended set via `provideMkExtendedIcons()` (from
+ * `@mk-kit/ui/icon/extended`), a themed subset or your own SVGs (from a
+ * sprite, a design export, anything) via `provideMkIcons()`, or at runtime
+ * with {@link register} / {@link registerIcons} / {@link load}.
  *
  * SVG markup is trusted verbatim (bypassed through `DomSanitizer`), so only
  * register icons from sources you control — never user input.
@@ -49,35 +62,72 @@ declare class MkIcon {
  * const reg = inject(MkIconRegistry);
  * reg.register('logo', '<svg viewBox="0 0 24 24">…</svg>');
  * reg.registerIcons({ save: '<svg…>', share: '<svg…>' });
+ * reg.load(() => import('@mk-kit/ui/icon/extended').then((m) => m.MK_EXTENDED_ICONS_FILES));
  * ```
  */
 declare class MkIconRegistry {
     private readonly sanitizer;
+    private readonly pendingTasks;
     private readonly icons;
     private readonly aliases;
+    private readonly version;
+    private readonly loads;
+    private readonly warned;
+    /**
+     * Bumps on every registration. `<mk-icon>` reads it, so an icon that
+     * arrives late (a lazy {@link load}, a runtime {@link register}) renders in
+     * place without any re-binding.
+     */
+    readonly changes: Signal<number>;
+    /** Whether a lazy {@link load} is still in flight. */
+    readonly pending: Signal<boolean>;
     constructor();
     /** Register (or overwrite) a single named icon from raw SVG markup. */
     register(name: string, svg: string): this;
-    /** Register many icons at once from a `{ name: svg }` map. */
-    registerIcons(icons: Readonly<Record<string, string>>): this;
+    /**
+     * Register many icons at once from a `{ name: svg }` map — a whole set, a
+     * themed subset (`MK_EXTENDED_ICONS_FILES`) or a hand-picked few. Later
+     * registrations overwrite earlier ones on a shared name.
+     */
+    registerIcons(icons: MkIconMap): this;
     /**
      * Register alternative names that resolve to existing icons — e.g. map
      * Material Symbols ligature names onto the built-in set
      * (`{ delete: 'trash', expand_more: 'chevron-down' }`). A real icon
-     * registered under an alias name always wins over the alias.
+     * registered under an alias name always wins over the alias; an alias
+     * whose target is not registered resolves to nothing (and, in dev mode,
+     * warns once naming the missing target).
      */
     registerAliases(aliases: Readonly<Record<string, string>>): this;
+    /**
+     * Load an icon map asynchronously and register it once it arrives. Icons
+     * already on screen fill in when the map lands (see {@link changes}); the
+     * missing-icon warning stays quiet while a load is pending. Server-side
+     * rendering waits for it (Angular's `PendingTasks`), so the HTML ships with
+     * the icons in place.
+     *
+     * ```ts
+     * registry.load(() => import('@mk-kit/ui/icon/extended').then((m) => m.MK_EXTENDED_ICONS));
+     * ```
+     */
+    load(loader: MkIconLoader): Promise<void>;
     /** Sanitized SVG for a name (aliases resolved), or `null` when unknown. */
     get(name: string): SafeHtml | null;
     /** Whether an icon with this name (or alias) is registered. */
     has(name: string): boolean;
     /** All registered icon names (useful for a picker / catalogue). */
     names(): string[];
+    /**
+     * Dev-mode only: warn once per unknown name with a hint about the opt-in
+     * extended set. Silent in production builds and while a {@link load} is
+     * pending (the name may be on its way). Called by `<mk-icon>`.
+     */
+    warnMissing(name: string): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<MkIconRegistry, never>;
     static ɵprov: _angular_core.ɵɵInjectableDeclaration<MkIconRegistry>;
 }
 
-/** Name → SVG markup map of the default icons. */
+/** Name → SVG markup map of the default icons (registered by {@link MkIconRegistry} on construction). */
 declare const MK_DEFAULT_ICONS: Readonly<Record<string, string>>;
 
 /**
@@ -87,9 +137,13 @@ declare const MK_DEFAULT_ICONS: Readonly<Record<string, string>>;
  * glyph once {@link provideMkMaterialIcons} is installed.
  *
  * Several Material names intentionally collapse onto one mk glyph (all the
- * calendar variants → `calendar`, the delete variants → `trash`, …). Names
- * not listed here have no sensible built-in equivalent — register your own
- * SVG under the Material name via `MkIconRegistry.register`.
+ * calendar variants → `calendar`, the delete variants → `trash`, …). Every
+ * target is a default icon, so the aliases work without the opt-in extended
+ * set. Names not listed here have no sensible built-in equivalent — register
+ * your own SVG under the Material name via `MkIconRegistry.register`, or
+ * alias it onto an extended glyph with `registerAliases` once
+ * `provideMkExtendedIcons()` is installed (an alias whose target is missing
+ * renders nothing and warns once in dev mode).
  */
 declare const MK_MATERIAL_ICON_ALIASES: Readonly<Record<string, string>>;
 /**
@@ -106,7 +160,36 @@ declare const MK_MATERIAL_ICON_ALIASES: Readonly<Record<string, string>>;
  */
 declare function provideMkMaterialIcons(): EnvironmentProviders;
 
-/** Name → SVG markup map of the Lucide-derived icons registered by default. */
-declare const MK_EXTENDED_ICONS: Readonly<Record<string, string>>;
+/**
+ * Registers extra icons at bootstrap — a themed subset of the extended set,
+ * a hand-picked few, your own SVGs, or a lazily loaded map. Call it as many
+ * times as you like; each call adds to the {@link MkIconRegistry}. The
+ * hand-made defaults are always there; this is for everything else.
+ *
+ * ```ts
+ * import { provideMkIcons } from '@mk-kit/ui/icon';
+ * import { MK_EXTENDED_ICONS_FILES, MK_EXTENDED_ICONS_DATA } from '@mk-kit/ui/icon/extended';
+ *
+ * bootstrapApplication(App, {
+ *   providers: [
+ *     // themed subsets — only these glyphs end up in the bundle
+ *     provideMkIcons(MK_EXTENDED_ICONS_FILES),
+ *     provideMkIcons(MK_EXTENDED_ICONS_DATA),
+ *     // your own
+ *     provideMkIcons({ logo: '<svg viewBox="0 0 24 24">…</svg>' }),
+ *     // or the whole extended set in its own lazy chunk, off the critical path
+ *     provideMkIcons(() => import('@mk-kit/ui/icon/extended').then((m) => m.MK_EXTENDED_ICONS)),
+ *   ],
+ * });
+ * ```
+ *
+ * A loader runs once at bootstrap without blocking it: icons already on
+ * screen fill in when the chunk lands, and server-side rendering waits for
+ * it. Picking single names out of the full map
+ * (`{ receipt: MK_EXTENDED_ICONS['receipt'] }`) works but still bundles the
+ * whole map — use a subset or copy the SVG when size matters.
+ */
+declare function provideMkIcons(icons: MkIconMap | MkIconLoader): EnvironmentProviders;
 
-export { MK_DEFAULT_ICONS, MK_EXTENDED_ICONS, MK_MATERIAL_ICON_ALIASES, MkIcon, MkIconRegistry, provideMkMaterialIcons };
+export { MK_DEFAULT_ICONS, MK_MATERIAL_ICON_ALIASES, MkIcon, MkIconRegistry, provideMkIcons, provideMkMaterialIcons };
+export type { MkIconLoader, MkIconMap };

package/types/mk-kit-ui-rich-text.d.ts

@@ -23,6 +23,8 @@ import * as _mk_kit_ui_core from '@mk-kit/ui/core';
  */
 declare class MkRichText implements ControlValueAccessor {
     private readonly field;
+    /** Signal Forms: gates `invalid` until the bound field is touched or dirty. */
+    private readonly fieldTouched;
     private readonly i18n;
     /** Two-way HTML string value (sanitised; `''` when visually empty). */
     readonly value: _angular_core.ModelSignal<string>;

package/types/mk-kit-ui-table.d.ts

@@ -92,6 +92,29 @@ type MkTableAlign = 'start' | 'center' | 'end';
 type MkSortDirection = 'asc' | 'desc' | 'none';
 /** Row vertical density. */
 type MkTableDensity = 'comfortable' | 'compact';
+/** Which control a column's header filter renders (see {@link MkTableColumn.filter}). */
+type MkTableFilterKind = 'text' | 'select' | 'number' | 'date';
+/** One option of a `select` header filter. */
+interface MkTableFilterOption {
+    /** The value compared against the cell (by `String()` equality). */
+    value: unknown;
+    /** Visible option text. */
+    label: string;
+}
+/**
+ * An inclusive range accepted as the value of a `number` or `date` filter
+ * (dates as `YYYY-MM-DD`, `Date` or a timestamp). Either bound may be omitted.
+ */
+interface MkTableFilterRange<V = number | string | Date> {
+    min?: V | null;
+    max?: V | null;
+}
+/**
+ * Active header filters keyed by column key: a string for `text`, an option
+ * value for `select`, a number / date (`>=`) or a {@link MkTableFilterRange}
+ * for `number` and `date`. Empty strings and `null` mean "no filter".
+ */
+type MkTableFilters = Record<string, unknown>;
 /** Column definition for {@link MkTable}. */
 interface MkTableColumn<T = Record<string, unknown>> {
     /** Property key on each row object supplying the cell value. */
@@ -131,6 +154,26 @@ interface MkTableColumn<T = Record<string, unknown>> {
      *   an expandable row detail already repeats.
      */
     stack?: 'title' | 'footer' | 'hide';
+    /**
+     * The header-row filter control for this column (rendered when the table is
+     * {@link MkTable.filterable}). Omitted, a filterable table gives the column a
+     * text filter; `false` leaves its filter cell empty.
+     *
+     * - `'text'` — case-insensitive *contains* on the displayed (formatted) text.
+     * - `'select'` — equality against one of {@link filterOptions}; without
+     *   options, the distinct values found in `data`.
+     * - `'number'` / `'date'` — the control keeps rows whose value is **≥** the
+     *   entry. Set `{ min, max }` through {@link MkTable.filters} for an
+     *   inclusive range. Dates compare by local calendar day.
+     */
+    filter?: MkTableFilterKind | false;
+    /**
+     * Options of a `select` filter — strings / numbers, or `{ value, label }`.
+     * Omitted: every distinct value of the column in `data`, sorted.
+     */
+    filterOptions?: readonly (string | number | MkTableFilterOption)[];
+    /** Placeholder of the filter control (text: `i18n.filter`; number / date: `i18n.filterMin`). */
+    filterPlaceholder?: string;
 }
 /** Payload emitted by {@link MkTable.sortChange}. */
 interface MkSortChange {
@@ -204,6 +247,8 @@ interface MkTableExportOptions extends MkCsvExportOptions, MkTableExportRowsOpti
     /** Start the browser download (default `true`); `false` just returns the text. */
     download?: boolean;
 }
+/** Drop the empty entries of a filter map (`null` when nothing is left). */
+declare function mkCompactFilters(filters: MkTableFilters | null | undefined): MkTableFilters | null;
 /** One rendered tbody entry: either a group header or a data row. */
 type MkTableItem<T> = {
     kind: 'group';
@@ -218,22 +263,6 @@ type MkTableItem<T> = {
     /** Whether its children are currently shown (tree mode). */
     expanded: boolean;
 };
-/**
- * Table — a themed data table built on a native `<table>` for accessibility.
- * Supply `columns` and `data`; opt into sortable columns, sticky header,
- * zebra striping, hover and density. Sorting is fully keyboard operable
- * (Enter/Space on a header) and announces changes via {@link MkLiveAnnouncer}.
- *
- * ```html
- * <mk-table
- *   [columns]="columns"
- *   [data]="rows()"
- *   stickyHeader
- *   zebra
- *   (sortChange)="onSort($event)"
- *   (rowClick)="open($event)" />
- * ```
- */
 declare class MkTable<T = Record<string, unknown>> {
     private readonly announcer;
     protected readonly i18n: _mk_kit_ui_core.MkI18nStrings;
@@ -252,8 +281,11 @@ declare class MkTable<T = Record<string, unknown>> {
      */
     protected readonly stacked: _angular_core.WritableSignal<boolean>;
     constructor();
-    /** Measures the thead and exposes it as the group rows' sticky offset. */
-    private applyGroupTop;
+    /**
+     * Measures the header row and the thead and exposes them as the sticky
+     * offsets of the filter row and of the group rows.
+     */
+    private applyStickyOffsets;
     /** Column definitions (order = display order). */
     readonly columns: _angular_core.InputSignal<MkTableColumn<T>[]>;
     /** Row objects to render. */
@@ -325,6 +357,50 @@ declare class MkTable<T = Record<string, unknown>> {
     readonly groupBy: _angular_core.InputSignal<string | ((row: T) => unknown) | null>;
     /** Formats a group header label; defaults to `String(value)`. */
     readonly groupLabel: _angular_core.InputSignal<((value: unknown, rows: T[]) => string) | null>;
+    /**
+     * Render only the rows in view (plus {@link overscan}) — for tables of
+     * thousands of rows. The `<table>` scrolls inside its own box sized by
+     * {@link height} / {@link maxHeight} (`max-height: 60vh` when neither is
+     * set) with the header pinned; spacer rows keep the scrollbar honest.
+     *
+     * Works with sorting, selection (select-all still covers every row), tree
+     * rows, grouping (group headers are rows too), expandable detail rows (their
+     * height is measured once rendered; an unmeasured detail counts as one row)
+     * and the header filter row. Falls back to the full render while stacked
+     * into cards. Export and select-all always see every row, not the window.
+     */
+    readonly virtual: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Height (px) of one row in virtual mode. Leave unset to have it measured
+     * from the first rendered row — which follows `density` and
+     * `data-mk-density` automatically — starting from 44 (comfortable).
+     */
+    readonly rowHeight: _angular_core.InputSignalWithTransform<number | null, unknown>;
+    /** Rows rendered beyond each edge of the viewport in virtual mode. */
+    readonly overscan: _angular_core.InputSignalWithTransform<number, unknown>;
+    /** Fixed height of the scroll box (CSS length, or px as a number). */
+    readonly height: _angular_core.InputSignal<string | number | null>;
+    /** Maximum height of the scroll box (CSS length, or px as a number). */
+    readonly maxHeight: _angular_core.InputSignal<string | number | null>;
+    /**
+     * Render a second header row with a filter control per column — a text
+     * box, a select, a number or a date field as the column's
+     * {@link MkTableColumn.filter} says. Values live in {@link filters}.
+     */
+    readonly filterable: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * The active filters, keyed by column key (`[(filters)]`; `filtersChange`
+     * emits the whole map on every edit). Text filters hold the typed string,
+     * select filters the chosen option value, number / date filters the lower
+     * bound or a `{ min, max }` range. Set programmatically to pre-filter.
+     */
+    readonly filters: _angular_core.ModelSignal<MkTableFilters>;
+    /**
+     * Filter rows in the browser (default). Turn off when the server applies
+     * the filters — `MkTableDataSource.setFilters($event)` on `filtersChange` —
+     * so the page it returns is shown as-is.
+     */
+    readonly clientFilter: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /** Emitted when the sort column/direction changes. */
     readonly sortChange: _angular_core.OutputEmitterRef<MkSortChange>;
     /** Emitted when a row is clicked (enable via `clickableRows`). */
@@ -448,9 +524,54 @@ declare class MkTable<T = Record<string, unknown>> {
      * re-resolves locale data on every call; one cached `Intl.Collator` makes
      * large-table sorts several-fold faster with the same default-locale order.
      */
-    private static readonly sortCollator;
     /** Data sorted by the active column, or the input order when unsorted. */
     protected readonly sortedData: _angular_core.Signal<T[]>;
+    /** The filter control a column renders, or `null` for none. */
+    protected filterKind(col: MkTableColumn<T>): MkTableFilterKind | null;
+    /** One predicate per active filter, or `null` when nothing is filtered. */
+    private readonly rowPredicate;
+    /** Build the predicate for one column's filter value. */
+    private columnTest;
+    /**
+     * Tree mode: which rows survive the filters — a row is kept when it matches
+     * or any descendant does, so a matching child keeps its parents.
+     */
+    private readonly treeKeep;
+    /** The input rows with the active filters applied (input order). */
+    private readonly filteredData;
+    /** The child rows of `row` that survive the filters (tree mode). */
+    private visibleChildrenOf;
+    /** Options of every `select` filter, keyed by column (derived when unset). */
+    private readonly selectOptions;
+    /** The options a column's select filter offers. */
+    protected filterOptionsFor(col: MkTableColumn<T>): MkTableFilterOption[];
+    /** Whether `option` is the column's current select-filter value. */
+    protected isFilterOption(col: MkTableColumn<T>, option: MkTableFilterOption): boolean;
+    /** Whether a column has an active filter. */
+    protected hasFilter(key: string): boolean;
+    /** The text a column's filter box shows (a range shows its lower bound). */
+    protected filterText(key: string): string;
+    /** Accessible name of a column's filter control. */
+    protected filterLabel(col: MkTableColumn<T>): string;
+    /** Placeholder of a column's filter control. */
+    protected filterPlaceholder(col: MkTableColumn<T>): string;
+    /**
+     * Set one column's filter (`null` / `''` clears it). Updates
+     * {@link filters} and emits `filtersChange`; a no-op when unchanged.
+     */
+    setFilter(key: string, value: unknown): void;
+    /** Clear one column's filter. */
+    clearFilter(key: string): void;
+    /** Clear every filter. */
+    clearFilters(): void;
+    /** Text / number / date filter box input. */
+    protected onFilterInput(col: MkTableColumn<T>, event: Event): void;
+    /** Select filter change: map the option string back to its original value. */
+    protected onFilterSelect(col: MkTableColumn<T>, event: Event): void;
+    /** Escape in a filter box clears that filter (and stays in the box). */
+    protected onFilterKeydown(col: MkTableColumn<T>, event: KeyboardEvent): void;
+    /** Header rows above the body (for `aria-rowindex`). */
+    protected readonly headerRows: _angular_core.Signal<number>;
     /** Sort one sibling group by the active column (input order when unsorted). */
     private sortRows;
     /** `aria-sort` value for a header cell. */
@@ -505,6 +626,75 @@ declare class MkTable<T = Record<string, unknown>> {
     private pushRows;
     /** The child rows of `row` (tree mode), or an empty list. */
     private childrenOf;
+    /** The scroll box around the table. */
+    private readonly scroller;
+    /** Virtual mode in force (cards always render in full). */
+    protected readonly isVirtual: _angular_core.Signal<boolean>;
+    /** Current scroll offset of the scroll box (virtual mode). */
+    private readonly scrollTop;
+    /** Measured height of the scroll box (0 until measured / on the server). */
+    private readonly viewportHeight;
+    /** Measured height of the thead — the sticky header hides that much of the top. */
+    private readonly headHeight;
+    /** Row height read back from the first rendered row. */
+    private readonly measuredRowHeight;
+    /** Measured heights of expanded detail rows, by row key. */
+    private readonly detailHeights;
+    /** The row height virtual mode lays rows out with. */
+    protected readonly effectiveRowHeight: _angular_core.Signal<number>;
+    private cssLength;
+    /** `height` of the scroll box. */
+    protected readonly scrollHeight: _angular_core.Signal<string | null>;
+    /** `max-height` of the scroll box (60vh in virtual mode with no size given). */
+    protected readonly scrollMaxHeight: _angular_core.Signal<string | null>;
+    /**
+     * Top offset of every display item, or `null` while every item is exactly
+     * one row tall (the common case — then offsets are plain multiplication).
+     * Only expanded detail rows make heights vary.
+     */
+    private readonly itemOffsets;
+    /** Full height of the body, spacers included. */
+    private readonly totalHeight;
+    /** Top offset (px) of display item `index`. */
+    private offsetOf;
+    /** Index of the display item covering the body offset `y`. */
+    private indexAt;
+    /** The `[start, end)` slice of display items currently rendered. */
+    protected readonly windowRange: _angular_core.Signal<{
+        start: number;
+        end: number;
+    }>;
+    /** Display index of the first rendered item. */
+    protected readonly windowStart: _angular_core.Signal<number>;
+    /** The items the tbody renders: the window in virtual mode, else all. */
+    protected readonly renderedItems: _angular_core.Signal<MkTableItem<T>[]>;
+    /** Height (px) of the spacer above the window. */
+    protected readonly topSpace: _angular_core.Signal<number>;
+    /** Height (px) of the spacer below the window. */
+    protected readonly bottomSpace: _angular_core.Signal<number>;
+    /** Scroll box scrolled: move the window. */
+    protected onScroll(event: Event): void;
+    /**
+     * Read the viewport, thead, first-row and detail-row heights back from the
+     * DOM. Heights are accepted only when they move by more than a pixel:
+     * collapsed table borders make the same row measure 44 or 44.5 depending
+     * on where it sits, and letting that flip the row height would shift a
+     * 10,000-row body by thousands of pixels on every window change. A density
+     * change (44 → 36 or 52) still gets through.
+     */
+    private measureViewport;
+    /**
+     * Scroll a row into view. A number is the row's **display index** — its
+     * position among the rendered rows, group headers included, after sorting,
+     * filtering and tree expansion; anything else is a row key (the `trackKey`
+     * value, or the row object when there is none). Pass `'key'` to look a
+     * numeric key up. Returns `false` when the row is not currently displayed
+     * (filtered out, under a collapsed parent or group).
+     *
+     * In virtual mode the row lands at the top of the viewport, just under the
+     * header; otherwise it is scrolled to the nearest edge.
+     */
+    scrollToRow(target: unknown, by?: 'index' | 'key'): boolean;
     /** Keys of parent rows whose children are shown. */
     private readonly treeExpanded;
     /** Whether a parent row's children are currently shown (tree mode). */
@@ -518,7 +708,8 @@ declare class MkTable<T = Record<string, unknown>> {
     /**
      * The rows and columns an export writes — exactly what {@link exportCsv}
      * serialises, for other formats (XLSX, PDF, the clipboard, …): rows in
-     * display order with the current sort applied and tree children
+     * display order with the current sort and header {@link filters} applied
+     * (every matching row, never just the virtual window) and tree children
      * (`childrenKey`) flattened under their parent whether or not they are
      * expanded, optionally only the selected ones; columns in the table's
      * current order, restricted to `options.columns` when given, each carrying
@@ -534,8 +725,8 @@ declare class MkTable<T = Record<string, unknown>> {
     getExportRows(options?: MkTableExportRowsOptions): MkTableExportRows<T>;
     /**
      * The table's rows as CSV: current column order, column formatters applied,
-     * sorted the way they are shown, tree children flattened under their parent
-     * whether or not they are expanded. Downloads the file (default name
+     * sorted and filtered the way they are shown, tree children flattened under
+     * their parent whether or not they are expanded. Downloads the file (default name
      * `table.csv`) and returns the text. Built on {@link getExportRows}.
      */
     exportCsv(options?: MkTableExportOptions): string;
@@ -563,7 +754,7 @@ declare class MkTable<T = Record<string, unknown>> {
     /** Toggle a row's detail panel, honouring `singleExpand`. */
     protected toggleExpand(row: T, event?: Event): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<MkTable<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MkTable<any>, "mk-table", never, { "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "stickyHeader": { "alias": "stickyHeader"; "required": false; "isSignal": true; }; "zebra": { "alias": "zebra"; "required": false; "isSignal": true; }; "hover": { "alias": "hover"; "required": false; "isSignal": true; }; "density": { "alias": "density"; "required": false; "isSignal": true; }; "stackAt": { "alias": "stackAt"; "required": false; "isSignal": true; }; "clickableRows": { "alias": "clickableRows"; "required": false; "isSignal": true; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "trackKey": { "alias": "trackKey"; "required": false; "isSignal": true; }; "rowClass": { "alias": "rowClass"; "required": false; "isSignal": true; }; "expandable": { "alias": "expandable"; "required": false; "isSignal": true; }; "singleExpand": { "alias": "singleExpand"; "required": false; "isSignal": true; }; "resizableColumns": { "alias": "resizableColumns"; "required": false; "isSignal": true; }; "reorderableColumns": { "alias": "reorderableColumns"; "required": false; "isSignal": true; }; "groupBy": { "alias": "groupBy"; "required": false; "isSignal": true; }; "groupLabel": { "alias": "groupLabel"; "required": false; "isSignal": true; }; "childrenKey": { "alias": "childrenKey"; "required": false; "isSignal": true; }; }, { "selected": "selectedChange"; "sortChange": "sortChange"; "rowClick": "rowClick"; "selectionChange": "selectionChange"; "expandedChange": "expandedChange"; "columnResize": "columnResize"; "columnReorder": "columnReorder"; "cellEdit": "cellEdit"; "groupToggle": "groupToggle"; "treeToggle": "treeToggle"; }, ["rowDetail", "cellTemplates"], ["[mkTableEmpty]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MkTable<any>, "mk-table", never, { "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "stickyHeader": { "alias": "stickyHeader"; "required": false; "isSignal": true; }; "zebra": { "alias": "zebra"; "required": false; "isSignal": true; }; "hover": { "alias": "hover"; "required": false; "isSignal": true; }; "density": { "alias": "density"; "required": false; "isSignal": true; }; "stackAt": { "alias": "stackAt"; "required": false; "isSignal": true; }; "clickableRows": { "alias": "clickableRows"; "required": false; "isSignal": true; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "trackKey": { "alias": "trackKey"; "required": false; "isSignal": true; }; "rowClass": { "alias": "rowClass"; "required": false; "isSignal": true; }; "expandable": { "alias": "expandable"; "required": false; "isSignal": true; }; "singleExpand": { "alias": "singleExpand"; "required": false; "isSignal": true; }; "resizableColumns": { "alias": "resizableColumns"; "required": false; "isSignal": true; }; "reorderableColumns": { "alias": "reorderableColumns"; "required": false; "isSignal": true; }; "groupBy": { "alias": "groupBy"; "required": false; "isSignal": true; }; "groupLabel": { "alias": "groupLabel"; "required": false; "isSignal": true; }; "virtual": { "alias": "virtual"; "required": false; "isSignal": true; }; "rowHeight": { "alias": "rowHeight"; "required": false; "isSignal": true; }; "overscan": { "alias": "overscan"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "filterable": { "alias": "filterable"; "required": false; "isSignal": true; }; "filters": { "alias": "filters"; "required": false; "isSignal": true; }; "clientFilter": { "alias": "clientFilter"; "required": false; "isSignal": true; }; "childrenKey": { "alias": "childrenKey"; "required": false; "isSignal": true; }; }, { "selected": "selectedChange"; "filters": "filtersChange"; "sortChange": "sortChange"; "rowClick": "rowClick"; "selectionChange": "selectionChange"; "expandedChange": "expandedChange"; "columnResize": "columnResize"; "columnReorder": "columnReorder"; "cellEdit": "cellEdit"; "groupToggle": "groupToggle"; "treeToggle": "treeToggle"; }, ["rowDetail", "cellTemplates"], ["[mkTableEmpty]"], true, never>;
 }
 
 /** Context handed to an `[mkTableCell]` template. */
@@ -714,6 +905,12 @@ interface MkDataRequest {
     filter: string;
     /** Structured filter from `mk-query-builder` (`null` = none). Compacted: no empty groups or unfinished rules. */
     query: MkQueryGroup | null;
+    /**
+     * Per-column filters from `mk-table`'s header filter row (`null` = none),
+     * keyed by column key with empty entries dropped — see
+     * {@link MkTableDataSource.setFilters}.
+     */
+    filters: MkTableFilters | null;
 }
 /** One page of server data returned by a {@link MkDataFetcher}. */
 interface MkDataPage<T> {
@@ -827,6 +1024,7 @@ declare class MkTableDataSource<T> {
     private readonly _sort;
     private readonly _filter;
     private readonly _query;
+    private readonly _filters;
     /** Rows of the current page (`[]` until the first load lands). */
     readonly rows: Signal<T[]>;
     /** Total row count across all pages (feed to `mk-pagination`'s `total`). */
@@ -845,6 +1043,8 @@ declare class MkTableDataSource<T> {
     readonly filter: Signal<string>;
     /** Current structured query, or `null`. */
     readonly query: Signal<MkQueryGroup | null>;
+    /** Current per-column filters, or `null`. */
+    readonly filters: Signal<MkTableFilters | null>;
     /** True when a settled load reported no rows at all. */
     readonly empty: Signal<boolean>;
     /** Monotonic request id — settles from older epochs are discarded. */
@@ -880,6 +1080,15 @@ declare class MkTableDataSource<T> {
      * with nothing left is sent as `null`. Resets to page 1 and loads at once.
      */
     setQuery(query: MkQueryGroup | null): void;
+    /**
+     * Set (or clear with `null` / `{}`) the per-column filters from `mk-table`'s
+     * header filter row — bind `(filtersChange)="ds.setFilters($event)"` and
+     * turn the table's `clientFilter` off. Empty entries are dropped before the
+     * request; nothing left is sent as `null`. Resets to page 1 and loads at
+     * once (the table already debounces nothing, so debounce the fetcher if
+     * your API needs it). A no-op when unchanged.
+     */
+    setFilters(filters: MkTableFilters | null): void;
     /**
      * Re-run the current request immediately (e.g. after a mutation). Flushes a
      * pending debounced filter, since the request reads the live filter value.
@@ -909,5 +1118,5 @@ declare class MkTableDataSource<T> {
     private clearSub;
 }
 
-export { MkSort, MkSortHeader, MkTable, MkTableCell, MkTableDataSource, MkTableRowDetail, mkDownloadText, mkExportCsv, mkToCsv };
-export type { MkCellEdit, MkColumnResize, MkCsvColumn, MkCsvExportOptions, MkCsvOptions, MkDataFetcher, MkDataPage, MkDataRequest, MkGroupToggle, MkSortChange, MkSortDirection, MkSortState, MkSortable, MkTableAlign, MkTableCellContext, MkTableColumn, MkTableDataSourceOptions, MkTableDensity, MkTableExportOptions, MkTableExportRows, MkTableExportRowsOptions, MkTableGroup, MkTreeToggle };
+export { MkSort, MkSortHeader, MkTable, MkTableCell, MkTableDataSource, MkTableRowDetail, mkCompactFilters, mkDownloadText, mkExportCsv, mkToCsv };
+export type { MkCellEdit, MkColumnResize, MkCsvColumn, MkCsvExportOptions, MkCsvOptions, MkDataFetcher, MkDataPage, MkDataRequest, MkGroupToggle, MkSortChange, MkSortDirection, MkSortState, MkSortable, MkTableAlign, MkTableCellContext, MkTableColumn, MkTableDataSourceOptions, MkTableDensity, MkTableExportOptions, MkTableExportRows, MkTableExportRowsOptions, MkTableFilterKind, MkTableFilterOption, MkTableFilterRange, MkTableFilters, MkTableGroup, MkTreeToggle };