@malva-ui/core 0.1.12 → 0.1.14

package/types/malva-ui-core-switch.d.ts

@@ -0,0 +1,146 @@
+import * as _angular_core from '@angular/core';
+import { MlvSignalCheckboxControlBase, MlvFormControl, MlvFormState, MlvFocusableGroupBase } from '@malva-ui/core/form-utils';
+import * as i1 from '@malva-ui/cdk/density';
+
+/**
+ * Visual/validation state of the switch. Mirrors {@link MlvFormState}.
+ */
+type MlvSwitchState = MlvFormState;
+declare class MlvSwitch extends MlvSignalCheckboxControlBase implements MlvFormControl {
+    /** @private Optional parent switch group used for roving-focus coordination. */
+    private readonly _group;
+    /** @private Host element reference, used to strip the moved ARIA attributes. */
+    private readonly _elementRef;
+    /** @private Renderer used to imperatively remove host ARIA attributes. */
+    private readonly _renderer;
+    /**
+     * @private The `aria-label` a consumer placed directly on the `<mlv-switch>`
+     * host, captured before host bindings run. The host is role-less, so ARIA
+     * prohibits an `aria-label` there (axe `aria-prohibited-attr`); it is moved to
+     * the inner `<input role="switch">` instead (see the constructor).
+     */
+    private readonly _hostAriaLabel;
+    /**
+     * @private The `aria-labelledby` a consumer placed directly on the
+     * `<mlv-switch>` host, captured before host bindings run. Moved to the inner
+     * input for the same reason as {@link _hostAriaLabel}.
+     */
+    private readonly _hostAriaLabelledBy;
+    /**
+     * Id reference(s) naming the inner native input (`aria-labelledby`). Use this
+     * input (not a host `[attr.aria-labelledby]` binding) when the reference is
+     * dynamic — the role-less host must not carry ARIA naming attributes
+     * (axe `aria-prohibited-attr`). A static host `aria-labelledby` attribute is
+     * also supported and forwarded automatically (see the constructor); this
+     * input takes precedence when both are present.
+     *
+     * The inherited `ariaLabel` input behaves the same way for `aria-label`.
+     */
+    readonly ariaLabelledBy: _angular_core.InputSignal<string | undefined>;
+    /**
+     * @internal The accessible name forwarded onto the native input, sourced from a
+     * host `aria-label`. `null` when the consumer supplied none, so no empty
+     * `aria-label` is emitted on the input.
+     */
+    readonly _ariaLabel: _angular_core.WritableSignal<string | null>;
+    /**
+     * @internal The `aria-labelledby` forwarded onto the native input, sourced from
+     * a host `aria-labelledby`. `null` when the consumer supplied none.
+     */
+    readonly _ariaLabelledBy: _angular_core.WritableSignal<string | null>;
+    /**
+     * @internal The final `aria-label` for the native input: the `ariaLabel` input
+     * wins over a captured static host attribute; `null` emits no attribute.
+     */
+    readonly _resolvedAriaLabel: _angular_core.Signal<string | null>;
+    /**
+     * @internal The final `aria-labelledby` for the native input, with the same
+     * precedence as {@link _resolvedAriaLabel}.
+     */
+    readonly _resolvedAriaLabelledBy: _angular_core.Signal<string | null>;
+    constructor();
+    /**
+     * The checked (on/off) state — the signal-forms `FormCheckboxControl` model.
+     * Two-way bindable (`[(checked)]`) and kept in sync with the bound field by
+     * `[formField]` / `[formControl]` / `ngModel`.
+     */
+    readonly checked: _angular_core.ModelSignal<boolean>;
+    readonly inputId: string;
+    /**
+     * Roving tabindex applied to the native `role="switch"` input — the single
+     * focus target. `0` for the tabbable switch, `-1` for the rest of a group.
+     * Managed by `MlvSwitchGroup`.
+     */
+    readonly tabIndex: _angular_core.WritableSignal<number>;
+    /**
+     * @private Reference to the visually-hidden native input, which is the
+     * component's focus target (kept in the a11y tree via the clip-path pattern).
+     */
+    private readonly _nativeInput;
+    /**
+     * Moves focus to the native switch input. Satisfies CDK `FocusableOption`
+     * so `MlvSwitchGroup`'s `FocusKeyManager` focuses the input, not the host.
+     */
+    focus(): void;
+    /** @internal Notifies the parent group when the native input gains focus. */
+    onFocus(): void;
+    /**
+     * @internal Toggles the checked state from an Enter keypress. Space is handled
+     * natively by the checkbox input (which emits `change`).
+     */
+    onEnter(event: Event): void;
+    toggle(): void;
+    /**
+     * Reflects the native `change` event (Space toggles natively): the `checked`
+     * model emits, propagating to the bound field. Touched is reported on blur
+     * (see {@link onBlur}), matching the signal-forms `touch` contract.
+     */
+    onInputChange(event: Event): void;
+    /**
+     * @internal Marks the control touched when focus leaves the native input —
+     * the signal-forms `touch` output replacing the CVA `onTouched` callback.
+     */
+    onBlur(): void;
+    /** Whether the control holds a clearable value — On state counts as the clearable value (clear switches off). */
+    readonly hasValue: _angular_core.Signal<boolean>;
+    /**
+     * @private The wrapper around the projected content, used once after the
+     * first render to tell whether the consumer supplied visible text.
+     */
+    private readonly _contentRef;
+    /**
+     * @private Dev-mode diagnostic: a switch with no projected text, no `label`
+     * and no ARIA naming has no accessible name at all. CSS decides which of the
+     * two visible sources renders, so this only reports the empty case.
+     */
+    private _warnWhenUnlabelled;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvSwitch, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MlvSwitch, "mlv-switch", never, { "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, ["*"], true, [{ directive: typeof i1.MlvDensityDirective; inputs: { "mlvDensity": "mlvDensity"; }; outputs: {}; }]>;
+}
+
+interface MlvSwitchGroupAccessor {
+    onChildFocus(sw: MlvSwitch): void;
+}
+
+/**
+ * Visual/validation state of the switch group. Mirrors {@link MlvFormState}.
+ */
+type MlvSwitchGroupState = MlvFormState;
+declare class MlvSwitchGroup extends MlvFocusableGroupBase<MlvSwitch> implements MlvSwitchGroupAccessor {
+    /** Accessible label for the group, rendered above the switches. */
+    readonly label: _angular_core.InputSignal<string>;
+    /** Visual/validation state applied to the group. */
+    readonly state: _angular_core.InputSignal<MlvFormState>;
+    /**
+     * @protected The projected switches in DOM order — drives the shared
+     * roving-tabindex arrow navigation from {@link MlvFocusableGroupBase}.
+     */
+    protected readonly _items: _angular_core.Signal<readonly MlvSwitch[]>;
+    /** @protected Skips disabled switches during arrow navigation. */
+    protected _isDisabled(sw: MlvSwitch): boolean;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvSwitchGroup, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MlvSwitchGroup, "mlv-switch-group", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; }, {}, ["_items"], ["*"], true, [{ directive: typeof i1.MlvDensityDirective; inputs: { "mlvDensity": "mlvDensity"; }; outputs: {}; }]>;
+}
+
+export { MlvSwitch, MlvSwitchGroup };
+export type { MlvSwitchGroupState, MlvSwitchState };

package/types/malva-ui-core-table.d.ts

@@ -0,0 +1,37 @@
+import * as _angular_core from '@angular/core';
+import { BooleanInput } from '@angular/cdk/coercion';
+import * as i1 from '@malva-ui/cdk/density';
+
+/** The table surface that receives pointer hover feedback. */
+type MlvTableHoverable = false | 'row' | 'cell';
+declare class MlvTable {
+    /** Shows a cell grid and an outer table boundary. */
+    readonly bordered: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /** Enables horizontal overflow behavior for narrow viewports. */
+    readonly responsive: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /** Enables the mobile paired-row Pop In presentation. */
+    readonly popIn: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /** Chooses whether rows or individual cells receive hover feedback. */
+    readonly hoverable: _angular_core.InputSignal<MlvTableHoverable>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvTable, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MlvTable, "table[mlvTable]", never, { "bordered": { "alias": "bordered"; "required": false; "isSignal": true; }; "responsive": { "alias": "responsive"; "required": false; "isSignal": true; }; "popIn": { "alias": "popIn"; "required": false; "isSignal": true; }; "hoverable": { "alias": "hoverable"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, [{ directive: typeof i1.MlvDensityDirective; inputs: { "mlvDensity": "mlvDensity"; }; outputs: {}; }]>;
+}
+
+/** Marks a native table row as the primary or supporting Pop In row. */
+declare class MlvTableRow {
+    /** Identifies the row that carries the primary, interactive information. */
+    readonly main: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /** Identifies the row that carries supporting, display-only information. */
+    readonly secondary: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvTableRow, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<MlvTableRow, "tr[mlvTableRow]", never, { "main": { "alias": "main"; "required": false; "isSignal": true; }; "secondary": { "alias": "secondary"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/** Marks a native table cell for Malva table spacing and responsive styles. */
+declare class MlvTableCell {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvTableCell, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<MlvTableCell, "[mlvTableCell]", never, {}, {}, never, never, true, never>;
+}
+
+export { MlvTable, MlvTableCell, MlvTableRow };
+export type { MlvTableHoverable };

package/types/malva-ui-core-tabs.d.ts

@@ -0,0 +1,339 @@
+import * as _angular_core from '@angular/core';
+import { ElementRef, TemplateRef, OnInit, Signal, InjectionToken, AfterViewInit } from '@angular/core';
+import * as _malva_ui_i18n from '@malva-ui/i18n';
+import { BooleanInput } from '@angular/cdk/coercion';
+import { IsActiveMatchOptions, UrlTree } from '@angular/router';
+import { MlvStructural } from '@malva-ui/cdk/utils';
+import { MlvPopup } from '@malva-ui/core/popup';
+import * as i1 from '@angular/aria/tabs';
+import * as i2 from '@malva-ui/cdk/density';
+
+declare class MlvTabItem {
+    readonly elementRef: ElementRef<any>;
+    /**
+     * Whether this tab is currently selected. Drives the active styling only —
+     * `aria-selected`, `role="tab"`, roving `tabindex` and `aria-controls` are
+     * provided by the `@angular/aria` `ngTab` directive applied on this element
+     * by the parent `mlv-tab-group`.
+     */
+    readonly active: _angular_core.InputSignal<boolean>;
+    /** Whether this tab is disabled. Drives the disabled styling only. */
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    /**
+     * Emitted on click or Enter/Space when not disabled. Enter/Space stop
+     * propagation so the aria `ngTabList` keyboard handler does not additionally
+     * activate the (roving-)focused tab; this preserves the historical behaviour
+     * where keyboard activation targets the tab receiving the event.
+     */
+    readonly activate: _angular_core.OutputEmitterRef<void>;
+    /**
+     * Programmatically focuses this tab item. Used by the parent
+     * `mlv-tab-group` when promoting an overflow tab into the visible header.
+     */
+    focus(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvTabItem, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MlvTabItem, "mlv-tab-item", never, { "active": { "alias": "active"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "activate": "activate"; }, never, ["*"], true, never>;
+}
+
+interface MlvTabDefContext {
+    $implicit: boolean;
+}
+declare class MlvTabDef {
+    readonly templateRef: TemplateRef<MlvTabDefContext>;
+    static ngTemplateContextGuard(_dir: MlvTabDef, _ctx: unknown): _ctx is MlvTabDefContext;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvTabDef, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<MlvTabDef, "[mlvTabDef]", never, {}, {}, never, never, true, never>;
+}
+
+declare class MlvTabContentDef extends MlvStructural {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvTabContentDef, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<MlvTabContentDef, "[mlvTabContent]", never, {}, {}, never, never, true, never>;
+}
+
+declare class MlvTab implements OnInit {
+    /** @private Scoped tabs service the tab registers/unregisters itself with. */
+    private readonly _tabsService;
+    /** @private DestroyRef used to unregister the tab on destroy. */
+    private readonly _destroyRef;
+    /**
+     * @private Native `RouterLink` directive applied to this `<mlv-tab>` when the
+     * consumer sets `[routerLink]` (optional/self — `null` for non-routed tabs).
+     *
+     * The `routerLink` sits on the `display:none` `<mlv-tab>` def node purely as a
+     * URL *carrier*: the header tab is rendered separately by `mlv-tab-group`, so
+     * `routerLinkActive` cannot style it and active state is derived explicitly
+     * from `Router.isActive` (see `MlvTabGroup` routed-mode notes). This is
+     * intentional, not a workaround to be removed later.
+     */
+    private readonly _routerLink;
+    readonly value: _angular_core.InputSignal<string>;
+    /** When `true`, prevents the tab from being activated. */
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Match options controlling when this routed tab is treated as active, mirroring
+     * `RouterLinkActive.routerLinkActiveOptions`. Accepts the `{ exact: boolean }`
+     * shorthand or a full `IsActiveMatchOptions`. Defaults to `{ exact: false }`
+     * (subset match). Only consulted when a `[routerLink]` is present.
+     */
+    readonly linkActiveOptions: _angular_core.InputSignal<{
+        exact: boolean;
+    } | IsActiveMatchOptions>;
+    readonly defTemplate: _angular_core.Signal<MlvTabDef | undefined>;
+    readonly contentTemplate: _angular_core.Signal<MlvTabContentDef | undefined>;
+    /**
+     * The `UrlTree` this tab links to, or `null` when no `[routerLink]` is applied.
+     * A non-null value on any tab switches the parent `mlv-tab-group` into routed
+     * mode, where the active tab is derived from the current URL.
+     */
+    urlTree(): UrlTree | null;
+    ngOnInit(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvTab, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MlvTab, "mlv-tab", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "linkActiveOptions": { "alias": "linkActiveOptions"; "required": false; "isSignal": true; }; }, {}, ["defTemplate", "contentTemplate"], never, true, never>;
+}
+
+type MlvTabOrientation = 'horizontal' | 'vertical';
+interface MlvTabGroupAccessor {
+    readonly activeTab: Signal<string>;
+    readonly orientation: Signal<MlvTabOrientation>;
+    selectTab(value: string): void;
+    isActive(value: string): boolean;
+}
+declare const TAB_GROUP: InjectionToken<MlvTabGroupAccessor>;
+
+/**
+ * Visual style of the tab header. Orthogonal to `orientation` — a boxed group can
+ * be horizontal or vertical.
+ *
+ * - `'underline'` (default): a sliding indicator bar under/beside the active tab
+ *   (non-active tabs show a faint underline on hover).
+ * - `'boxed'`: a segmented control — a grey, content-width track holds the tabs
+ *   and a white pill slides behind the active one (non-active tabs tint on hover).
+ */
+type MlvTabAppearance = 'underline' | 'boxed';
+declare class MlvTabGroup implements MlvTabGroupAccessor, AfterViewInit {
+    /** @private Scoped service tracking tab registration and visible/overflow split. */
+    private readonly _tabsService;
+    private readonly _rtlService;
+    /**
+     * @private Effective direction of this tab group, tracking both the global
+     * direction and any `[dir]` scope above the host. Drives indicator
+     * re-measurement.
+     */
+    private readonly _direction;
+    /** @private Destroy reference used to tear down the resize observer. */
+    private readonly _destroyRef;
+    /**
+     * @private Router used for routed-mode active detection and navigation.
+     * `null` when `RouterModule`/`provideRouter` is not present, keeping non-routed
+     * tab groups fully functional without a router.
+     */
+    private readonly _router;
+    /** @protected The component's i18n strings signal. */
+    protected readonly _i18n: _angular_core.Signal<_malva_ui_i18n.MlvTabsI18n>;
+    /** @private Native ResizeObserver watching the tab-list header for overflow recalculation. */
+    private _resizeObserver;
+    /**
+     * @private Trailing debounce timer for the ResizeObserver. Coalesces the burst
+     * of resize callbacks fired during a drag into a single recalculation so tabs
+     * do not flip between the row and the overflow menu on every frame.
+     */
+    private _resizeDebounceTimer;
+    /**
+     * @private Cache of each tab's natural (fully-rendered) header width, keyed by
+     * tab value. Populated the first time all tabs are rendered and reused on every
+     * subsequent recalculation so we never have to briefly expand the DOM to all
+     * tabs to re-measure — which is what caused the "dizzy" flicker feedback loop.
+     */
+    private readonly _tabWidths;
+    /** @private Measured width of the "More (N)" overflow trigger (falls back to 100). */
+    private _moreButtonWidth;
+    /** @private Trailing debounce (ms) applied to ResizeObserver-driven recalculation. */
+    private static readonly _RESIZE_DEBOUNCE_MS;
+    /**
+     * @private Extra px of clearance an overflowed tab must gain before it is
+     * allowed back into the visible row. Provides hysteresis so a tab does not
+     * oscillate in/out at boundary widths.
+     */
+    private static readonly _HYSTERESIS_PX;
+    /** @private True when popup closed because an item was selected (skip focus restoration). */
+    private _popupClosedBySelection;
+    readonly orientation: _angular_core.ModelSignal<MlvTabOrientation>;
+    readonly activeTab: _angular_core.ModelSignal<string>;
+    /**
+     * Visual style of the tab header. `'underline'` (default) shows a sliding
+     * indicator bar; `'boxed'` fills the active tab with a rounded surface and
+     * hides the indicator. Orthogonal to `orientation` — composes with both
+     * horizontal and vertical layouts.
+     */
+    readonly appearance: _angular_core.InputSignal<MlvTabAppearance>;
+    /**
+     * @internal True when at least one registered tab carries a `[routerLink]`
+     * (its `urlTree()` is non-null). In routed mode the active tab is derived from
+     * the URL via `Router.isActive` rather than from click/keyboard selection, and
+     * the auto-select-first + aria-selection paths defer to the route.
+     */
+    protected readonly _isRouted: _angular_core.Signal<boolean>;
+    /**
+     * @internal Bridges the public `activeTab` model to the aria `ngTabList`
+     * `selectedTab` model input (`string | undefined`). An empty `activeTab`
+     * maps to `undefined` (no tab selected) so aria does not try to match a tab
+     * whose value is the empty string.
+     */
+    protected readonly selectedTab: _angular_core.Signal<string | undefined>;
+    /** @internal Tracks which overflow item has tabindex=0. */
+    readonly overflowFocusedIndex: _angular_core.WritableSignal<number>;
+    readonly tabListRef: _angular_core.Signal<ElementRef<HTMLElement> | undefined>;
+    readonly indicatorRef: _angular_core.Signal<ElementRef<HTMLElement> | undefined>;
+    readonly morePopupRef: _angular_core.Signal<MlvPopup | undefined>;
+    readonly tabItems: _angular_core.Signal<readonly MlvTabItem[]>;
+    /**
+     * @private The "More (N)" overflow trigger button, present only while overflow
+     * is active. An own-template element, so a signal view query replaces the
+     * former `querySelector('.mlv-tab-group__more-trigger')` used when measuring
+     * the trigger's width during overflow layout.
+     */
+    private readonly _moreTriggerRef;
+    /**
+     * @private The overflow popup's focusable menu-item elements, in DOM order.
+     * They are declared in this component's own template (inside `mlvPopupContent`),
+     * so a signal view query resolves them even though the popup renders in a
+     * detached overlay — replacing a `querySelectorAll('[data-overflow-item-index]')`
+     * for the Arrow-key navigation inside the overflow menu.
+     */
+    private readonly _overflowItemRefs;
+    readonly visibleTabs: _angular_core.Signal<MlvTab[]>;
+    readonly overflowTabs: _angular_core.Signal<MlvTab[]>;
+    readonly activeContentTemplate: _angular_core.Signal<TemplateRef<unknown> | null>;
+    constructor();
+    ngAfterViewInit(): void;
+    selectTab(value: string): void;
+    /**
+     * @internal Bridges the aria `ngTabList` `selectedTab` output back to the
+     * public `activeTab` model. Ignores `undefined` (aria emits it transiently
+     * before the default selection settles) so the auto-select effect keeps
+     * ownership of the initial value.
+     */
+    protected _onSelectedTabChange(value: string | undefined): void;
+    selectOverflowTab(value: string): void;
+    isActive(value: string): boolean;
+    /**
+     * @private Sets `activeTab` to the first tab whose routerLink target is active
+     * for the current URL (per its `linkActiveOptions`). No-op when not routed or
+     * when no tab matches (the route stays the source of truth).
+     */
+    private _syncActiveFromRoute;
+    /**
+     * @private Whether a tab's routerLink `urlTree` is active for the current URL,
+     * honouring its `linkActiveOptions`.
+     */
+    private _isTabActiveByRoute;
+    /**
+     * @private Type guard distinguishing a full `IsActiveMatchOptions` object from
+     * the `{ exact: boolean }` shorthand (mirrors Angular's internal check).
+     */
+    private _isFullMatchOptions;
+    /** Opens the overflow popup and focuses the first overflow item after render. */
+    openOverflowPopup(): void;
+    /**
+     * Called when the overflow popup finishes opening.
+     * Focuses the first (or active) overflow item.
+     */
+    onMorePopupAfterOpened(): void;
+    /**
+     * Called when the overflow popup finishes closing.
+     * Returns focus to the active visible tab unless the popup was closed by
+     * selecting an item (focus goes to the promoted tab instead).
+     */
+    onMorePopupAfterClosed(): void;
+    /**
+     * Keydown handler on the overflow list wrapper inside the popup.
+     * Up/Down arrows navigate between items; Escape closes the popup.
+     */
+    onOverflowKeydown(event: KeyboardEvent): void;
+    /** @private Repositions the active-tab indicator bar via CSS custom properties. */
+    private _updateIndicator;
+    /** @private Attaches a ResizeObserver to the header to recalculate overflow on width changes. */
+    private _setupResizeObserver;
+    /** @private Disconnects and clears the header ResizeObserver and its debounce timer. */
+    private _teardownResizeObserver;
+    /**
+     * @private Updates the visible/overflow split for the current header width.
+     *
+     * Unlike the previous implementation it does NOT reset the rendered set to
+     * "show all" on every call. Tab widths are cached (keyed by value) the first
+     * time every tab is rendered; afterwards the split is computed purely from the
+     * cache and the container width. That removes the measure→mutate→re-measure
+     * feedback loop (moving a tab to overflow no longer changes what we measure),
+     * which — together with the ResizeObserver debounce and the hysteresis in
+     * {@link _computeFittingCount} — kills the flickering repartition.
+     */
+    private _recalculateOverflow;
+    /**
+     * @private Captures the natural widths of the currently-rendered tab items
+     * (and the "More" trigger) into the width cache, keyed by tab value. Zero
+     * widths (detached / not laid out) are ignored so a transient render never
+     * poisons the cache.
+     */
+    private _captureRenderedWidths;
+    /**
+     * @private Applies the cached-width overflow computation to the service and
+     * repositions the indicator.
+     */
+    private _applyOverflowFit;
+    /**
+     * @private Pure overflow fit calculation. Returns how many leading tabs fit in
+     * `containerWidth`, or `-1` when every tab fits with no "More" button.
+     *
+     * Hysteresis: a tab that is currently in the overflow region
+     * (`i >= currentMax`) must clear the boundary by an extra
+     * {@link _HYSTERESIS_PX} before it is allowed back into the visible row. A
+     * currently-visible tab leaves as soon as it no longer fits. This asymmetric
+     * threshold means the two states around a boundary width can never both be
+     * satisfied, so the split cannot oscillate between adjacent widths.
+     *
+     * @param widths Natural width of each tab, in DOM order.
+     * @param containerWidth Available header content width.
+     * @param moreButtonWidth Width reserved for the "More (N)" trigger.
+     * @param currentMax The current `maxVisibleCount` (`-1` = all visible).
+     */
+    private _computeFittingCount;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvTabGroup, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MlvTabGroup, "mlv-tab-group", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "activeTab": { "alias": "activeTab"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; }, { "orientation": "orientationChange"; "activeTab": "activeTabChange"; }, never, never, true, [{ directive: typeof i1.Tabs; inputs: {}; outputs: {}; }, { directive: typeof i2.MlvDensityDirective; inputs: { "mlvDensity": "mlvDensity"; }; outputs: {}; }]>;
+}
+
+/**
+ * Wrapper for the active panel content. `role="tabpanel"`, the panel `id` and
+ * `aria-labelledby` (panel → tab) are supplied by the `@angular/aria`
+ * `ngTabPanel` directive applied on this element by the parent
+ * `mlv-tab-group`; this component only owns the panel styling/animation slot.
+ */
+declare class MlvTabContent {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvTabContent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MlvTabContent, "mlv-tab-content", never, {}, {}, never, ["*"], true, never>;
+}
+
+declare class MlvTabsService {
+    readonly tabs: _angular_core.WritableSignal<MlvTab[]>;
+    /** How many tabs fit in the header. -1 means no overflow (all fit). */
+    readonly maxVisibleCount: _angular_core.WritableSignal<number>;
+    /** A tab value forced into the visible area (selected from overflow popup). */
+    readonly forcedVisibleValue: _angular_core.WritableSignal<string | null>;
+    /**
+     * Visible tabs with swap logic:
+     * - If a forced tab exists and is beyond maxVisibleCount,
+     *   it replaces the last naturally-visible tab.
+     *
+     * Example: tabs=[t1,t2,t3,t4,t5], max=3, forced=t4
+     *   visible=[t1,t2,t4], overflow=[t3,t5]
+     */
+    readonly visibleTabs: _angular_core.Signal<MlvTab[]>;
+    readonly overflowTabs: _angular_core.Signal<MlvTab[]>;
+    register(tab: MlvTab): void;
+    unregister(tab: MlvTab): void;
+    forceVisible(value: string): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvTabsService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<MlvTabsService>;
+}
+
+export { MlvTab, MlvTabContent, MlvTabContentDef, MlvTabDef, MlvTabGroup, MlvTabItem, MlvTabsService, TAB_GROUP };
+export type { MlvTabAppearance, MlvTabDefContext, MlvTabGroupAccessor, MlvTabOrientation };

package/types/malva-ui-core-textarea.d.ts

@@ -0,0 +1,79 @@
+import * as _angular_core from '@angular/core';
+import { ElementRef } from '@angular/core';
+import { MlvSignalFormControlBase, MlvFormControl } from '@malva-ui/core/form-utils';
+import { BooleanInput } from '@angular/cdk/coercion';
+
+declare class MlvTextarea extends MlvSignalFormControlBase<string> implements MlvFormControl {
+    /** Placeholder text shown inside the textarea when empty. */
+    readonly placeholder: _angular_core.InputSignal<string>;
+    /** Number of visible text rows. Determines the default height. */
+    readonly rows: _angular_core.InputSignal<number>;
+    /** Minimum number of rows when autoResize is enabled. */
+    readonly minRows: _angular_core.InputSignal<number | undefined>;
+    /** Maximum number of rows when autoResize is enabled. */
+    readonly maxRows: _angular_core.InputSignal<number | undefined>;
+    /**
+     * When true, the textarea grows vertically with content.
+     * Respects minRows and maxRows constraints.
+     */
+    readonly autoResize: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Maximum number of characters allowed.
+     * When set, a character counter is displayed below the textarea.
+     */
+    readonly maxLength: _angular_core.InputSignal<number | undefined>;
+    /** The character count ID for aria-describedby linking to the count element. */
+    readonly countId: _angular_core.Signal<string>;
+    /**
+     * @protected The textarea's `aria-describedby`: the shared description /
+     * message ids from the base plus the character counter when one is rendered.
+     * `null` when nothing describes the field, so no dangling IDREF is emitted.
+     */
+    protected readonly _textareaDescribedBy: _angular_core.Signal<string | null>;
+    /**
+     * The textarea's text value — the signal-forms `FormValueControl` model.
+     * Two-way bindable (`[(value)]`) and kept in sync with the bound field by
+     * `[formField]` / `[formControl]` / `ngModel`. Replaces the former
+     * `internalValue` signal + CVA transport.
+     */
+    readonly value: _angular_core.ModelSignal<string>;
+    /** @private Reference to the native textarea element. */
+    protected readonly _textareaRef: _angular_core.Signal<ElementRef<HTMLTextAreaElement> | undefined>;
+    /**
+     * The current character count.
+     */
+    readonly charCount: _angular_core.Signal<number>;
+    /**
+     * Whether the character count is approaching the limit (>90%).
+     */
+    readonly isCountWarning: _angular_core.Signal<boolean>;
+    /**
+     * Whether the character limit has been reached.
+     */
+    readonly isCountError: _angular_core.Signal<boolean>;
+    /**
+     * Computed minimum height style for the scrollbar wrapper.
+     * When rows = 1, matches `--mlv-height-m` (same as mlv-input).
+     * For multi-row, grows proportionally: each additional row adds 1.5em.
+     */
+    readonly minHeightStyle: _angular_core.Signal<string>;
+    /**
+     * Computed maximum height style for the scrollbar wrapper based on maxRows input.
+     */
+    readonly maxHeightStyle: _angular_core.Signal<string | undefined>;
+    constructor();
+    /** @private Adjusts textarea height to fit its content. */
+    private _runAutoResize;
+    /** Handles the native input event. */
+    onInput(event: Event): void;
+    /** Handles the native blur event. */
+    onBlur(): void;
+    /** Whether the control holds a clearable value — Non-empty text present. */
+    readonly hasValue: _angular_core.Signal<boolean>;
+    /** Clears the textarea value and marks the field touched. */
+    clearValue(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MlvTextarea, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MlvTextarea, "mlv-textarea", never, { "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "minRows": { "alias": "minRows"; "required": false; "isSignal": true; }; "maxRows": { "alias": "maxRows"; "required": false; "isSignal": true; }; "autoResize": { "alias": "autoResize"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, ["[mlvTextareaPrepend]", "[mlvTextareaAppend]"], true, never>;
+}
+
+export { MlvTextarea };