@malva-ui/core 0.1.12

package/esm2022/switch/lib/switch/switch.js

@@ -0,0 +1,190 @@
+import { afterNextRender, ChangeDetectionStrategy, Component, computed, ElementRef, forwardRef, HostAttributeToken, inject, input, isDevMode, model, Renderer2, signal, viewChild, ViewEncapsulation, } from '@angular/core';
+import { MlvSignalCheckboxControlBase, MLV_FORM_CONTROL, } from '@malva-ui/core/form-utils';
+import { SWITCH_GROUP } from '../switch-group-token';
+import * as i0 from "@angular/core";
+export class MlvSwitch extends MlvSignalCheckboxControlBase {
+    /** @private Optional parent switch group used for roving-focus coordination. */
+    _group = inject(SWITCH_GROUP, {
+        optional: true,
+    });
+    /** @private Host element reference, used to strip the moved ARIA attributes. */
+    _elementRef = inject((ElementRef));
+    /** @private Renderer used to imperatively remove host ARIA attributes. */
+    _renderer = inject(Renderer2);
+    /**
+     * @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).
+     */
+    _hostAriaLabel = inject(new HostAttributeToken('aria-label'), { optional: true });
+    /**
+     * @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}.
+     */
+    _hostAriaLabelledBy = inject(new HostAttributeToken('aria-labelledby'), { optional: true });
+    /**
+     * 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`.
+     */
+    ariaLabelledBy = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabelledBy" }] : /* istanbul ignore next */ []));
+    /**
+     * @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.
+     */
+    _ariaLabel = signal(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_ariaLabel" }] : /* istanbul ignore next */ []));
+    /**
+     * @internal The `aria-labelledby` forwarded onto the native input, sourced from
+     * a host `aria-labelledby`. `null` when the consumer supplied none.
+     */
+    _ariaLabelledBy = signal(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_ariaLabelledBy" }] : /* istanbul ignore next */ []));
+    /**
+     * @internal The final `aria-label` for the native input: the `ariaLabel` input
+     * wins over a captured static host attribute; `null` emits no attribute.
+     */
+    _resolvedAriaLabel = computed(() => this.ariaLabel() ?? this._ariaLabel(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_resolvedAriaLabel" }] : /* istanbul ignore next */ []));
+    /**
+     * @internal The final `aria-labelledby` for the native input, with the same
+     * precedence as {@link _resolvedAriaLabel}.
+     */
+    _resolvedAriaLabelledBy = computed(() => this.ariaLabelledBy() ?? this._ariaLabelledBy(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_resolvedAriaLabelledBy" }] : /* istanbul ignore next */ []));
+    constructor() {
+        super();
+        // A host `aria-label`/`aria-labelledby` lands on the role-less custom
+        // element (axe `aria-prohibited-attr`). Move it onto the inner
+        // `role="switch"` input — the component's real accessible-name target — and
+        // strip it from the host.
+        const host = this._elementRef.nativeElement;
+        if (this._hostAriaLabel !== null) {
+            this._ariaLabel.set(this._hostAriaLabel);
+            this._renderer.removeAttribute(host, 'aria-label');
+        }
+        if (this._hostAriaLabelledBy !== null) {
+            this._ariaLabelledBy.set(this._hostAriaLabelledBy);
+            this._renderer.removeAttribute(host, 'aria-labelledby');
+        }
+        afterNextRender(() => this._warnWhenUnlabelled());
+    }
+    /**
+     * 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`.
+     */
+    checked = model(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
+    inputId = this.id();
+    /**
+     * 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`.
+     */
+    tabIndex = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tabIndex" }] : /* istanbul ignore next */ []));
+    /**
+     * @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).
+     */
+    _nativeInput = viewChild.required('nativeInput', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_nativeInput" }] : /* istanbul ignore next */ []));
+    /**
+     * Moves focus to the native switch input. Satisfies CDK `FocusableOption`
+     * so `MlvSwitchGroup`'s `FocusKeyManager` focuses the input, not the host.
+     */
+    focus() {
+        this._nativeInput().nativeElement.focus();
+    }
+    /** @internal Notifies the parent group when the native input gains focus. */
+    onFocus() {
+        this._group?.onChildFocus(this);
+    }
+    /**
+     * @internal Toggles the checked state from an Enter keypress. Space is handled
+     * natively by the checkbox input (which emits `change`).
+     */
+    onEnter(event) {
+        event.preventDefault();
+        this.toggle();
+    }
+    toggle() {
+        if (this.computedDisabled())
+            return;
+        this.checked.set(!this.checked());
+    }
+    /**
+     * 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) {
+        const target = event.target;
+        this.checked.set(target.checked);
+    }
+    /**
+     * @internal Marks the control touched when focus leaves the native input —
+     * the signal-forms `touch` output replacing the CVA `onTouched` callback.
+     */
+    onBlur() {
+        this._markTouched();
+    }
+    /** Whether the control holds a clearable value — On state counts as the clearable value (clear switches off). */
+    hasValue = computed(() => this.checked(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasValue" }] : /* istanbul ignore next */ []));
+    /**
+     * @private The wrapper around the projected content, used once after the
+     * first render to tell whether the consumer supplied visible text.
+     */
+    _contentRef = viewChild.required('content', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_contentRef" }] : /* istanbul ignore next */ []));
+    /**
+     * @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.
+     */
+    _warnWhenUnlabelled() {
+        if (!isDevMode())
+            return;
+        const hasProjectedText = (this._contentRef().nativeElement.textContent ?? '').trim().length > 0;
+        if (hasProjectedText ||
+            this.label() ||
+            this._resolvedAriaLabel() ||
+            this._resolvedAriaLabelledBy()) {
+            return;
+        }
+        console.warn('[mlv-switch] Rendered without an accessible name. Project text into ' +
+            '<mlv-switch>, or set [label], [ariaLabel] or [ariaLabelledBy].');
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvSwitch, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: MlvSwitch, isStandalone: true, selector: "mlv-switch", inputs: { ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange" }, host: { properties: { "class.mlv-switch--disabled": "computedDisabled()", "class.mlv-switch--checked": "checked()" }, classAttribute: "mlv-switch" }, providers: [
+            {
+                provide: MLV_FORM_CONTROL,
+                useExisting: forwardRef(() => MlvSwitch),
+            },
+        ], viewQueries: [{ propertyName: "_nativeInput", first: true, predicate: ["nativeInput"], descendants: true, isSignal: true }, { propertyName: "_contentRef", first: true, predicate: ["content"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<label class=\"mlv-switch__label\" [for]=\"inputId\">\n  <input\n    #nativeInput\n    type=\"checkbox\"\n    role=\"switch\"\n    class=\"mlv-switch__native\"\n    [id]=\"inputId\"\n    [checked]=\"checked()\"\n    [disabled]=\"computedDisabled()\"\n    [attr.tabindex]=\"tabIndex()\"\n    [attr.aria-checked]=\"checked()\"\n    [attr.aria-required]=\"required() || null\"\n    [attr.aria-label]=\"_resolvedAriaLabel()\"\n    [attr.aria-labelledby]=\"_resolvedAriaLabelledBy()\"\n    (change)=\"onInputChange($event)\"\n    (focus)=\"onFocus()\"\n    (blur)=\"onBlur()\"\n    (keydown.enter)=\"onEnter($event)\"\n  />\n  <span class=\"mlv-switch__track\" [class]=\"'mlv-switch__track--' + state()\">\n    <span class=\"mlv-switch__thumb\"></span>\n  </span>\n  <span class=\"mlv-switch__text\">\n    <!-- Projected text wins; the `label` fallback next to it is hidden by CSS\n         whenever this span is non-empty, which also keeps it out of the\n         accessible name computed from the wrapping <label>. -->\n    <span #content class=\"mlv-switch__content\"><ng-content /></span>\n    @if (label()) {\n    <span class=\"mlv-switch__label-text\">{{ label() }}</span>\n    }\n  </span>\n</label>\n", styles: [".mlv-switch{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-switch *{box-sizing:border-box}.mlv-switch{color:var(--mlv-text-primary);display:inline-block}.mlv-switch__native{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.mlv-switch__native:focus-visible+.mlv-switch__track{outline:var(--mlv-stroke-width) solid var(--mlv-border-focus);outline-offset:.125rem}.mlv-switch__label{display:inline-flex;align-items:center;gap:.5rem;cursor:pointer}.mlv-switch__track{position:relative;display:inline-flex;align-items:center;width:2.5rem;height:1.5rem;border-radius:var(--mlv-radius-xl);background-color:var(--mlv-background-neutral-1);transition:background-color var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-switch__thumb{position:absolute;left:.125rem;width:1.25rem;height:1.25rem;border-radius:50%;background-color:var(--mlv-elevation-bg-5);box-shadow:var(--mlv-shadow-1);transition:transform var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-switch--checked .mlv-switch__track{background-color:var(--mlv-background-accent-1)}.mlv-switch--checked .mlv-switch__thumb{transform:translate(1rem)}.mlv-switch--disabled{opacity:.5;pointer-events:none}.mlv-switch--disabled .mlv-switch__label{cursor:not-allowed}.mlv-switch__text{-webkit-user-select:none;user-select:none}.mlv-switch__content:not(:empty)+.mlv-switch__label-text{display:none}@media(prefers-reduced-motion:reduce){.mlv-switch,.mlv-switch *,.mlv-switch:before,.mlv-switch:after,[class^=mlv-switch__],[class*=\" mlv-switch__\"],[class^=mlv-switch--],[class*=\" mlv-switch--\"]{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:var(--mlv-duration-instant)!important}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvSwitch, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-switch', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: MLV_FORM_CONTROL,
+                            useExisting: forwardRef(() => MlvSwitch),
+                        },
+                    ], host: {
+                        class: 'mlv-switch',
+                        '[class.mlv-switch--disabled]': 'computedDisabled()',
+                        '[class.mlv-switch--checked]': 'checked()',
+                    }, template: "<label class=\"mlv-switch__label\" [for]=\"inputId\">\n  <input\n    #nativeInput\n    type=\"checkbox\"\n    role=\"switch\"\n    class=\"mlv-switch__native\"\n    [id]=\"inputId\"\n    [checked]=\"checked()\"\n    [disabled]=\"computedDisabled()\"\n    [attr.tabindex]=\"tabIndex()\"\n    [attr.aria-checked]=\"checked()\"\n    [attr.aria-required]=\"required() || null\"\n    [attr.aria-label]=\"_resolvedAriaLabel()\"\n    [attr.aria-labelledby]=\"_resolvedAriaLabelledBy()\"\n    (change)=\"onInputChange($event)\"\n    (focus)=\"onFocus()\"\n    (blur)=\"onBlur()\"\n    (keydown.enter)=\"onEnter($event)\"\n  />\n  <span class=\"mlv-switch__track\" [class]=\"'mlv-switch__track--' + state()\">\n    <span class=\"mlv-switch__thumb\"></span>\n  </span>\n  <span class=\"mlv-switch__text\">\n    <!-- Projected text wins; the `label` fallback next to it is hidden by CSS\n         whenever this span is non-empty, which also keeps it out of the\n         accessible name computed from the wrapping <label>. -->\n    <span #content class=\"mlv-switch__content\"><ng-content /></span>\n    @if (label()) {\n    <span class=\"mlv-switch__label-text\">{{ label() }}</span>\n    }\n  </span>\n</label>\n", styles: [".mlv-switch{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-switch *{box-sizing:border-box}.mlv-switch{color:var(--mlv-text-primary);display:inline-block}.mlv-switch__native{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.mlv-switch__native:focus-visible+.mlv-switch__track{outline:var(--mlv-stroke-width) solid var(--mlv-border-focus);outline-offset:.125rem}.mlv-switch__label{display:inline-flex;align-items:center;gap:.5rem;cursor:pointer}.mlv-switch__track{position:relative;display:inline-flex;align-items:center;width:2.5rem;height:1.5rem;border-radius:var(--mlv-radius-xl);background-color:var(--mlv-background-neutral-1);transition:background-color var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-switch__thumb{position:absolute;left:.125rem;width:1.25rem;height:1.25rem;border-radius:50%;background-color:var(--mlv-elevation-bg-5);box-shadow:var(--mlv-shadow-1);transition:transform var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-switch--checked .mlv-switch__track{background-color:var(--mlv-background-accent-1)}.mlv-switch--checked .mlv-switch__thumb{transform:translate(1rem)}.mlv-switch--disabled{opacity:.5;pointer-events:none}.mlv-switch--disabled .mlv-switch__label{cursor:not-allowed}.mlv-switch__text{-webkit-user-select:none;user-select:none}.mlv-switch__content:not(:empty)+.mlv-switch__label-text{display:none}@media(prefers-reduced-motion:reduce){.mlv-switch,.mlv-switch *,.mlv-switch:before,.mlv-switch:after,[class^=mlv-switch__],[class*=\" mlv-switch__\"],[class^=mlv-switch--],[class*=\" mlv-switch--\"]{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:var(--mlv-duration-instant)!important}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { ariaLabelledBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledBy", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], _nativeInput: [{ type: i0.ViewChild, args: ['nativeInput', { isSignal: true }] }], _contentRef: [{ type: i0.ViewChild, args: ['content', { isSignal: true }] }] } });
+//# sourceMappingURL=switch.js.map

package/esm2022/switch/lib/switch/switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../../../../../../libs/core/switch/src/lib/switch/switch.ts","../../../../../../../libs/core/switch/src/lib/switch/switch.html"],"names":[],"mappings":"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","sourcesContent":["import {\n  afterNextRender,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  ElementRef,\n  forwardRef,\n  HostAttributeToken,\n  inject,\n  input,\n  isDevMode,\n  model,\n  Renderer2,\n  signal,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport type { MlvFormState, MlvFormControl } from '@malva-ui/core/form-utils';\nimport {\n  MlvSignalCheckboxControlBase,\n  MLV_FORM_CONTROL,\n} from '@malva-ui/core/form-utils';\nimport type { MlvSwitchGroupAccessor } from '../switch-group-token';\nimport { SWITCH_GROUP } from '../switch-group-token';\n\n/**\n * Visual/validation state of the switch. Mirrors {@link MlvFormState}.\n */\nexport type MlvSwitchState = MlvFormState;\n\n@Component({\n  selector: 'mlv-switch',\n  templateUrl: './switch.html',\n  styleUrl: './switch.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    {\n      provide: MLV_FORM_CONTROL,\n      useExisting: forwardRef(() => MlvSwitch),\n    },\n  ],\n  host: {\n    class: 'mlv-switch',\n    '[class.mlv-switch--disabled]': 'computedDisabled()',\n    '[class.mlv-switch--checked]': 'checked()',\n  },\n})\nexport class MlvSwitch\n  extends MlvSignalCheckboxControlBase\n  implements MlvFormControl\n{\n  /** @private Optional parent switch group used for roving-focus coordination. */\n  private readonly _group = inject<MlvSwitchGroupAccessor>(SWITCH_GROUP, {\n    optional: true,\n  });\n\n  /** @private Host element reference, used to strip the moved ARIA attributes. */\n  private readonly _elementRef = inject(ElementRef<HTMLElement>);\n\n  /** @private Renderer used to imperatively remove host ARIA attributes. */\n  private readonly _renderer = inject(Renderer2);\n\n  /**\n   * @private The `aria-label` a consumer placed directly on the `<mlv-switch>`\n   * host, captured before host bindings run. The host is role-less, so ARIA\n   * prohibits an `aria-label` there (axe `aria-prohibited-attr`); it is moved to\n   * the inner `<input role=\"switch\">` instead (see the constructor).\n   */\n  private readonly _hostAriaLabel = inject(\n    new HostAttributeToken('aria-label'),\n    { optional: true },\n  );\n\n  /**\n   * @private The `aria-labelledby` a consumer placed directly on the\n   * `<mlv-switch>` host, captured before host bindings run. Moved to the inner\n   * input for the same reason as {@link _hostAriaLabel}.\n   */\n  private readonly _hostAriaLabelledBy = inject(\n    new HostAttributeToken('aria-labelledby'),\n    { optional: true },\n  );\n\n  /**\n   * Id reference(s) naming the inner native input (`aria-labelledby`). Use this\n   * input (not a host `[attr.aria-labelledby]` binding) when the reference is\n   * dynamic — the role-less host must not carry ARIA naming attributes\n   * (axe `aria-prohibited-attr`). A static host `aria-labelledby` attribute is\n   * also supported and forwarded automatically (see the constructor); this\n   * input takes precedence when both are present.\n   *\n   * The inherited `ariaLabel` input behaves the same way for `aria-label`.\n   */\n  readonly ariaLabelledBy = input<string | undefined>(undefined);\n\n  /**\n   * @internal The accessible name forwarded onto the native input, sourced from a\n   * host `aria-label`. `null` when the consumer supplied none, so no empty\n   * `aria-label` is emitted on the input.\n   */\n  readonly _ariaLabel = signal<string | null>(null);\n\n  /**\n   * @internal The `aria-labelledby` forwarded onto the native input, sourced from\n   * a host `aria-labelledby`. `null` when the consumer supplied none.\n   */\n  readonly _ariaLabelledBy = signal<string | null>(null);\n\n  /**\n   * @internal The final `aria-label` for the native input: the `ariaLabel` input\n   * wins over a captured static host attribute; `null` emits no attribute.\n   */\n  readonly _resolvedAriaLabel = computed(\n    () => this.ariaLabel() ?? this._ariaLabel(),\n  );\n\n  /**\n   * @internal The final `aria-labelledby` for the native input, with the same\n   * precedence as {@link _resolvedAriaLabel}.\n   */\n  readonly _resolvedAriaLabelledBy = computed(\n    () => this.ariaLabelledBy() ?? this._ariaLabelledBy(),\n  );\n\n  constructor() {\n    super();\n    // A host `aria-label`/`aria-labelledby` lands on the role-less custom\n    // element (axe `aria-prohibited-attr`). Move it onto the inner\n    // `role=\"switch\"` input — the component's real accessible-name target — and\n    // strip it from the host.\n    const host = this._elementRef.nativeElement;\n    if (this._hostAriaLabel !== null) {\n      this._ariaLabel.set(this._hostAriaLabel);\n      this._renderer.removeAttribute(host, 'aria-label');\n    }\n    if (this._hostAriaLabelledBy !== null) {\n      this._ariaLabelledBy.set(this._hostAriaLabelledBy);\n      this._renderer.removeAttribute(host, 'aria-labelledby');\n    }\n\n    afterNextRender(() => this._warnWhenUnlabelled());\n  }\n\n  /**\n   * The checked (on/off) state — the signal-forms `FormCheckboxControl` model.\n   * Two-way bindable (`[(checked)]`) and kept in sync with the bound field by\n   * `[formField]` / `[formControl]` / `ngModel`.\n   */\n  readonly checked = model(false);\n\n  readonly inputId = this.id();\n\n  /**\n   * Roving tabindex applied to the native `role=\"switch\"` input — the single\n   * focus target. `0` for the tabbable switch, `-1` for the rest of a group.\n   * Managed by `MlvSwitchGroup`.\n   */\n  readonly tabIndex = signal(0);\n\n  /**\n   * @private Reference to the visually-hidden native input, which is the\n   * component's focus target (kept in the a11y tree via the clip-path pattern).\n   */\n  private readonly _nativeInput =\n    viewChild.required<ElementRef<HTMLInputElement>>('nativeInput');\n\n  /**\n   * Moves focus to the native switch input. Satisfies CDK `FocusableOption`\n   * so `MlvSwitchGroup`'s `FocusKeyManager` focuses the input, not the host.\n   */\n  focus(): void {\n    this._nativeInput().nativeElement.focus();\n  }\n\n  /** @internal Notifies the parent group when the native input gains focus. */\n  onFocus(): void {\n    this._group?.onChildFocus(this);\n  }\n\n  /**\n   * @internal Toggles the checked state from an Enter keypress. Space is handled\n   * natively by the checkbox input (which emits `change`).\n   */\n  onEnter(event: Event): void {\n    event.preventDefault();\n    this.toggle();\n  }\n\n  toggle(): void {\n    if (this.computedDisabled()) return;\n    this.checked.set(!this.checked());\n  }\n\n  /**\n   * Reflects the native `change` event (Space toggles natively): the `checked`\n   * model emits, propagating to the bound field. Touched is reported on blur\n   * (see {@link onBlur}), matching the signal-forms `touch` contract.\n   */\n  onInputChange(event: Event): void {\n    const target = event.target as HTMLInputElement;\n    this.checked.set(target.checked);\n  }\n\n  /**\n   * @internal Marks the control touched when focus leaves the native input —\n   * the signal-forms `touch` output replacing the CVA `onTouched` callback.\n   */\n  onBlur(): void {\n    this._markTouched();\n  }\n\n  /** Whether the control holds a clearable value — On state counts as the clearable value (clear switches off). */\n  readonly hasValue = computed(() => this.checked());\n\n  /**\n   * @private The wrapper around the projected content, used once after the\n   * first render to tell whether the consumer supplied visible text.\n   */\n  private readonly _contentRef =\n    viewChild.required<ElementRef<HTMLElement>>('content');\n\n  /**\n   * @private Dev-mode diagnostic: a switch with no projected text, no `label`\n   * and no ARIA naming has no accessible name at all. CSS decides which of the\n   * two visible sources renders, so this only reports the empty case.\n   */\n  private _warnWhenUnlabelled(): void {\n    if (!isDevMode()) return;\n    const hasProjectedText =\n      (this._contentRef().nativeElement.textContent ?? '').trim().length > 0;\n    if (\n      hasProjectedText ||\n      this.label() ||\n      this._resolvedAriaLabel() ||\n      this._resolvedAriaLabelledBy()\n    ) {\n      return;\n    }\n    console.warn(\n      '[mlv-switch] Rendered without an accessible name. Project text into ' +\n        '<mlv-switch>, or set [label], [ariaLabel] or [ariaLabelledBy].',\n    );\n  }\n}\n","<label class=\"mlv-switch__label\" [for]=\"inputId\">\n  <input\n    #nativeInput\n    type=\"checkbox\"\n    role=\"switch\"\n    class=\"mlv-switch__native\"\n    [id]=\"inputId\"\n    [checked]=\"checked()\"\n    [disabled]=\"computedDisabled()\"\n    [attr.tabindex]=\"tabIndex()\"\n    [attr.aria-checked]=\"checked()\"\n    [attr.aria-required]=\"required() || null\"\n    [attr.aria-label]=\"_resolvedAriaLabel()\"\n    [attr.aria-labelledby]=\"_resolvedAriaLabelledBy()\"\n    (change)=\"onInputChange($event)\"\n    (focus)=\"onFocus()\"\n    (blur)=\"onBlur()\"\n    (keydown.enter)=\"onEnter($event)\"\n  />\n  <span class=\"mlv-switch__track\" [class]=\"'mlv-switch__track--' + state()\">\n    <span class=\"mlv-switch__thumb\"></span>\n  </span>\n  <span class=\"mlv-switch__text\">\n    <!-- Projected text wins; the `label` fallback next to it is hidden by CSS\n         whenever this span is non-empty, which also keeps it out of the\n         accessible name computed from the wrapping <label>. -->\n    <span #content class=\"mlv-switch__content\"><ng-content /></span>\n    @if (label()) {\n    <span class=\"mlv-switch__label-text\">{{ label() }}</span>\n    }\n  </span>\n</label>\n"]}

package/esm2022/switch/lib/switch-group/switch-group.js

@@ -0,0 +1,68 @@
+import { ChangeDetectionStrategy, Component, contentChildren, forwardRef, input, ViewEncapsulation, } from '@angular/core';
+import { MlvSwitch } from '../switch/switch';
+import { SWITCH_GROUP } from '../switch-group-token';
+import { MlvLabel, MlvFocusableGroupBase } from '@malva-ui/core/form-utils';
+import * as i0 from "@angular/core";
+export class MlvSwitchGroup extends MlvFocusableGroupBase {
+    /** Accessible label for the group, rendered above the switches. */
+    label = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Visual/validation state applied to the group. */
+    state = input('default', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
+    /**
+     * @protected The projected switches in DOM order — drives the shared
+     * roving-tabindex arrow navigation from {@link MlvFocusableGroupBase}.
+     */
+    _items = contentChildren(MlvSwitch, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_items" }] : /* istanbul ignore next */ []));
+    /** @protected Skips disabled switches during arrow navigation. */
+    _isDisabled(sw) {
+        return sw.computedDisabled();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvSwitchGroup, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: MlvSwitchGroup, isStandalone: true, selector: "mlv-switch-group", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+            {
+                provide: SWITCH_GROUP,
+                useExisting: forwardRef(() => MlvSwitchGroup),
+            },
+        ], queries: [{ propertyName: "_items", predicate: MlvSwitch, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
+    <div
+      class="mlv-switch-group"
+      role="group"
+      [attr.aria-label]="label()"
+      (keydown)="onKeydown($event)"
+    >
+      @if (label()) {
+        <mlv-label>
+          {{ label() }}
+        </mlv-label>
+      }
+      <ng-content />
+    </div>
+  `, isInline: true, styles: [".mlv-switch-group{display:flex;flex-direction:column;gap:.5rem}\n"], dependencies: [{ kind: "component", type: MlvLabel, selector: "mlv-label", inputs: ["for", "required"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvSwitchGroup, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-switch-group', template: `
+    <div
+      class="mlv-switch-group"
+      role="group"
+      [attr.aria-label]="label()"
+      (keydown)="onKeydown($event)"
+    >
+      @if (label()) {
+        <mlv-label>
+          {{ label() }}
+        </mlv-label>
+      }
+      <ng-content />
+    </div>
+  `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: SWITCH_GROUP,
+                            useExisting: forwardRef(() => MlvSwitchGroup),
+                        },
+                    ], imports: [MlvLabel], styles: [".mlv-switch-group{display:flex;flex-direction:column;gap:.5rem}\n"] }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }], _items: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => MlvSwitch), { isSignal: true }] }] } });
+//# sourceMappingURL=switch-group.js.map

package/esm2022/switch/lib/switch-group/switch-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch-group.js","sourceRoot":"","sources":["../../../../../../../libs/core/switch/src/lib/switch-group/switch-group.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,eAAe,EACf,UAAU,EACV,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAE7C,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAErD,OAAO,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;;AAmC5E,MAAM,OAAO,cACX,SAAQ,qBAAgC;IAGxC,mEAAmE;IAC1D,KAAK,GAAG,KAAK,CAAC,EAAE;8EAAC,CAAC;IAE3B,oDAAoD;IAC3C,KAAK,GAAG,KAAK,CAAsB,SAAS;8EAAC,CAAC;IAEvD;;;OAGG;IACgB,MAAM,GAAG,eAAe,CAAC,SAAS;+EAAC,CAAC;IAEvD,kEAAkE;IACxD,WAAW,CAAC,EAAa;QACjC,OAAO,EAAE,CAAC,gBAAgB,EAAE,CAAC;IAC/B,CAAC;uGAnBU,cAAc;2FAAd,cAAc,2TARd;YACT;gBACE,OAAO,EAAE,YAAY;gBACrB,WAAW,EAAE,UAAU,CAAC,GAAG,EAAE,CAAC,cAAc,CAAC;aAC9C;SACF,iDAiB2C,SAAS,oEAxC3C;;;;;;;;;;;;;;GAcT,2IAUS,QAAQ;;2FAEP,cAAc;kBA5B1B,SAAS;+BACE,kBAAkB,YAClB;;;;;;;;;;;;;;GAcT,iBAEc,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM,aACpC;wBACT;4BACE,OAAO,EAAE,YAAY;4BACrB,WAAW,EAAE,UAAU,CAAC,GAAG,EAAE,eAAe,CAAC;yBAC9C;qBACF,WACQ,CAAC,QAAQ,CAAC;kRAgByB,SAAS","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  contentChildren,\n  forwardRef,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { MlvSwitch } from '../switch/switch';\nimport type { MlvSwitchGroupAccessor } from '../switch-group-token';\nimport { SWITCH_GROUP } from '../switch-group-token';\nimport type { MlvFormState } from '@malva-ui/core/form-utils';\nimport { MlvLabel, MlvFocusableGroupBase } from '@malva-ui/core/form-utils';\n\n/**\n * Visual/validation state of the switch group. Mirrors {@link MlvFormState}.\n */\nexport type MlvSwitchGroupState = MlvFormState;\n\n@Component({\n  selector: 'mlv-switch-group',\n  template: `\n    <div\n      class=\"mlv-switch-group\"\n      role=\"group\"\n      [attr.aria-label]=\"label()\"\n      (keydown)=\"onKeydown($event)\"\n    >\n      @if (label()) {\n        <mlv-label>\n          {{ label() }}\n        </mlv-label>\n      }\n      <ng-content />\n    </div>\n  `,\n  styleUrl: './switch-group.css',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    {\n      provide: SWITCH_GROUP,\n      useExisting: forwardRef(() => MlvSwitchGroup),\n    },\n  ],\n  imports: [MlvLabel],\n})\nexport class MlvSwitchGroup\n  extends MlvFocusableGroupBase<MlvSwitch>\n  implements MlvSwitchGroupAccessor\n{\n  /** Accessible label for the group, rendered above the switches. */\n  readonly label = input('');\n\n  /** Visual/validation state applied to the group. */\n  readonly state = input<MlvSwitchGroupState>('default');\n\n  /**\n   * @protected The projected switches in DOM order — drives the shared\n   * roving-tabindex arrow navigation from {@link MlvFocusableGroupBase}.\n   */\n  protected readonly _items = contentChildren(MlvSwitch);\n\n  /** @protected Skips disabled switches during arrow navigation. */\n  protected _isDisabled(sw: MlvSwitch): boolean {\n    return sw.computedDisabled();\n  }\n}\n"]}

package/esm2022/switch/lib/switch-group-token.js

@@ -0,0 +1,3 @@
+import { InjectionToken } from '@angular/core';
+export const SWITCH_GROUP = new InjectionToken('SWITCH_GROUP');
+//# sourceMappingURL=switch-group-token.js.map

package/esm2022/switch/lib/switch-group-token.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch-group-token.js","sourceRoot":"","sources":["../../../../../../libs/core/switch/src/lib/switch-group-token.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAO/C,MAAM,CAAC,MAAM,YAAY,GAAG,IAAI,cAAc,CAC5C,cAAc,CACf,CAAC","sourcesContent":["import { InjectionToken } from '@angular/core';\nimport type { MlvSwitch } from './switch/switch';\n\nexport interface MlvSwitchGroupAccessor {\n  onChildFocus(sw: MlvSwitch): void;\n}\n\nexport const SWITCH_GROUP = new InjectionToken<MlvSwitchGroupAccessor>(\n  'SWITCH_GROUP',\n);\n"]}

package/esm2022/switch/malva-ui-core-switch.js

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=malva-ui-core-switch.js.map

package/esm2022/switch/malva-ui-core-switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-switch.js","sourceRoot":"","sources":["../../../../../libs/core/switch/src/malva-ui-core-switch.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,cAAc,SAAS,CAAC","sourcesContent":["/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"]}

package/esm2022/tabs/index.js

@@ -0,0 +1,9 @@
+export * from './lib/tabs/tabs';
+export * from './lib/tab/tab';
+export * from './lib/tab-def';
+export * from './lib/tab-content-def';
+export * from './lib/tab-item/tab-item';
+export * from './lib/tab-content/tab-content';
+export * from './lib/tab-group-token';
+export * from './lib/tabs.service';
+//# sourceMappingURL=index.js.map

package/esm2022/tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/core/tabs/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,uBAAuB,CAAC;AACtC,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './lib/tabs/tabs';\nexport * from './lib/tab/tab';\nexport * from './lib/tab-def';\nexport * from './lib/tab-content-def';\nexport * from './lib/tab-item/tab-item';\nexport * from './lib/tab-content/tab-content';\nexport * from './lib/tab-group-token';\nexport * from './lib/tabs.service';\n"]}

package/esm2022/tabs/lib/tab/tab.js

@@ -0,0 +1,72 @@
+import { ChangeDetectionStrategy, Component, contentChild, DestroyRef, inject, input, ViewEncapsulation, } from '@angular/core';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import { RouterLink } from '@angular/router';
+import { MlvTabDef } from '../tab-def';
+import { MlvTabContentDef } from '../tab-content-def';
+import { MlvTabsService } from '../tabs.service';
+import * as i0 from "@angular/core";
+export class MlvTab {
+    /** @private Scoped tabs service the tab registers/unregisters itself with. */
+    _tabsService = inject(MlvTabsService);
+    /** @private DestroyRef used to unregister the tab on destroy. */
+    _destroyRef = inject(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.
+     */
+    _routerLink = inject(RouterLink, {
+        optional: true,
+        self: true,
+    });
+    value = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** When `true`, prevents the tab from being activated. */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /**
+     * 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.
+     */
+    linkActiveOptions = input({
+        exact: false,
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "linkActiveOptions" }] : /* istanbul ignore next */ []));
+    defTemplate = contentChild(MlvTabDef, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "defTemplate" }] : /* istanbul ignore next */ []));
+    contentTemplate = contentChild(MlvTabContentDef, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "contentTemplate" }] : /* istanbul ignore next */ []));
+    /**
+     * 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() {
+        return this._routerLink?.urlTree ?? null;
+    }
+    ngOnInit() {
+        this._tabsService.register(this);
+        this._destroyRef.onDestroy(() => this._tabsService.unregister(this));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTab, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.7", type: MlvTab, isStandalone: true, selector: "mlv-tab", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, linkActiveOptions: { classPropertyName: "linkActiveOptions", publicName: "linkActiveOptions", isSignal: true, isRequired: false, transformFunction: null } }, host: { styleAttribute: "display: none" }, queries: [{ propertyName: "defTemplate", first: true, predicate: MlvTabDef, descendants: true, isSignal: true }, { propertyName: "contentTemplate", first: true, predicate: MlvTabContentDef, descendants: true, isSignal: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTab, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'mlv-tab',
+                    template: '',
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: {
+                        style: 'display: none',
+                    },
+                }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], linkActiveOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "linkActiveOptions", required: false }] }], defTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => MlvTabDef), { isSignal: true }] }], contentTemplate: [{ type: i0.ContentChild, args: [i0.forwardRef(() => MlvTabContentDef), { isSignal: true }] }] } });
+//# sourceMappingURL=tab.js.map

package/esm2022/tabs/lib/tab/tab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab.js","sourceRoot":"","sources":["../../../../../../../libs/core/tabs/src/lib/tab/tab.ts"],"names":[],"mappings":"AACA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,YAAY,EACZ,UAAU,EACV,MAAM,EACN,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;;AAWjD,MAAM,OAAO,MAAM;IACjB,8EAA8E;IAC7D,YAAY,GAAG,MAAM,CAAC,cAAc,CAAC,CAAC;IAEvD,iEAAiE;IAChD,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC;IAElD;;;;;;;;;OASG;IACc,WAAW,GAAG,MAAM,CAAC,UAAU,EAAE;QAChD,QAAQ,EAAE,IAAI;QACd,IAAI,EAAE,IAAI;KACX,CAAC,CAAC;IAEM,KAAK,GAAG,KAAK,CAAC,QAAQ;8EAAU,CAAC;IAE1C,0DAA0D;IACjD,QAAQ,GAAG,KAAK,CAAwB,KAAK,gFACpD,SAAS,EAAE,qBAAqB,GAChC,CAAC;IAEH;;;;;OAKG;IACM,iBAAiB,GAAG,KAAK,CAChC;QACE,KAAK,EAAE,KAAK;KACb;0FACF,CAAC;IAEO,WAAW,GAAG,YAAY,CAAC,SAAS;oFAAC,CAAC;IACtC,eAAe,GAAG,YAAY,CAAC,gBAAgB;wFAAC,CAAC;IAE1D;;;;OAIG;IACH,OAAO;QACL,OAAO,IAAI,CAAC,WAAW,EAAE,OAAO,IAAI,IAAI,CAAC;IAC3C,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;QACjC,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC;IACvE,CAAC;uGAxDU,MAAM;2FAAN,MAAM,ujBAyCmB,SAAS,kGACL,gBAAgB,gEAjD9C,EAAE;;2FAOD,MAAM;kBATlB,SAAS;mBAAC;oBACT,QAAQ,EAAE,SAAS;oBACnB,QAAQ,EAAE,EAAE;oBACZ,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,IAAI,EAAE;wBACJ,KAAK,EAAE,eAAe;qBACvB;iBACF;2YA0CqC,SAAS,iGACL,gBAAgB","sourcesContent":["import type { OnInit } from '@angular/core';\nimport {\n  ChangeDetectionStrategy,\n  Component,\n  contentChild,\n  DestroyRef,\n  inject,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport type { BooleanInput } from '@angular/cdk/coercion';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { RouterLink } from '@angular/router';\nimport type { IsActiveMatchOptions, UrlTree } from '@angular/router';\nimport { MlvTabDef } from '../tab-def';\nimport { MlvTabContentDef } from '../tab-content-def';\nimport { MlvTabsService } from '../tabs.service';\n\n@Component({\n  selector: 'mlv-tab',\n  template: '',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    style: 'display: none',\n  },\n})\nexport class MlvTab implements OnInit {\n  /** @private Scoped tabs service the tab registers/unregisters itself with. */\n  private readonly _tabsService = inject(MlvTabsService);\n\n  /** @private DestroyRef used to unregister the tab on destroy. */\n  private readonly _destroyRef = inject(DestroyRef);\n\n  /**\n   * @private Native `RouterLink` directive applied to this `<mlv-tab>` when the\n   * consumer sets `[routerLink]` (optional/self — `null` for non-routed tabs).\n   *\n   * The `routerLink` sits on the `display:none` `<mlv-tab>` def node purely as a\n   * URL *carrier*: the header tab is rendered separately by `mlv-tab-group`, so\n   * `routerLinkActive` cannot style it and active state is derived explicitly\n   * from `Router.isActive` (see `MlvTabGroup` routed-mode notes). This is\n   * intentional, not a workaround to be removed later.\n   */\n  private readonly _routerLink = inject(RouterLink, {\n    optional: true,\n    self: true,\n  });\n\n  readonly value = input.required<string>();\n\n  /** When `true`, prevents the tab from being activated. */\n  readonly disabled = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /**\n   * Match options controlling when this routed tab is treated as active, mirroring\n   * `RouterLinkActive.routerLinkActiveOptions`. Accepts the `{ exact: boolean }`\n   * shorthand or a full `IsActiveMatchOptions`. Defaults to `{ exact: false }`\n   * (subset match). Only consulted when a `[routerLink]` is present.\n   */\n  readonly linkActiveOptions = input<{ exact: boolean } | IsActiveMatchOptions>(\n    {\n      exact: false,\n    },\n  );\n\n  readonly defTemplate = contentChild(MlvTabDef);\n  readonly contentTemplate = contentChild(MlvTabContentDef);\n\n  /**\n   * The `UrlTree` this tab links to, or `null` when no `[routerLink]` is applied.\n   * A non-null value on any tab switches the parent `mlv-tab-group` into routed\n   * mode, where the active tab is derived from the current URL.\n   */\n  urlTree(): UrlTree | null {\n    return this._routerLink?.urlTree ?? null;\n  }\n\n  ngOnInit(): void {\n    this._tabsService.register(this);\n    this._destroyRef.onDestroy(() => this._tabsService.unregister(this));\n  }\n}\n"]}

package/esm2022/tabs/lib/tab-content/tab-content.js

@@ -0,0 +1,19 @@
+import { ChangeDetectionStrategy, Component, ViewEncapsulation, } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * 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.
+ */
+export class MlvTabContent {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTabContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.7", type: MlvTabContent, isStandalone: true, selector: "mlv-tab-content", host: { classAttribute: "mlv-tab-content" }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: ["@keyframes tab-content-enter{0%{opacity:0;transform:translateY(-.25rem)}to{opacity:1;transform:translateY(0)}}@keyframes tab-content-leave{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-.25rem)}}.mlv-tab-content{display:block}.mlv-tab-content--enter{animation:tab-content-enter var(--mlv-tab-content-enter-duration, var(--mlv-duration-normal)) var(--mlv-ease-out-strong) both}.mlv-tab-content--leave{animation:tab-content-leave var(--mlv-tab-content-leave-duration, var(--mlv-duration-fast)) var(--mlv-ease-out-strong) both}@media(prefers-reduced-motion:reduce){.mlv-tab-content--enter,.mlv-tab-content--leave{animation:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTabContent, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-tab-content', template: `<ng-content />`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'mlv-tab-content',
+                    }, styles: ["@keyframes tab-content-enter{0%{opacity:0;transform:translateY(-.25rem)}to{opacity:1;transform:translateY(0)}}@keyframes tab-content-leave{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-.25rem)}}.mlv-tab-content{display:block}.mlv-tab-content--enter{animation:tab-content-enter var(--mlv-tab-content-enter-duration, var(--mlv-duration-normal)) var(--mlv-ease-out-strong) both}.mlv-tab-content--leave{animation:tab-content-leave var(--mlv-tab-content-leave-duration, var(--mlv-duration-fast)) var(--mlv-ease-out-strong) both}@media(prefers-reduced-motion:reduce){.mlv-tab-content--enter,.mlv-tab-content--leave{animation:none}}\n"] }]
+        }] });
+//# sourceMappingURL=tab-content.js.map

package/esm2022/tabs/lib/tab-content/tab-content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-content.js","sourceRoot":"","sources":["../../../../../../../libs/core/tabs/src/lib/tab-content/tab-content.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,iBAAiB,GAClB,MAAM,eAAe,CAAC;;AAEvB;;;;;GAKG;AAWH,MAAM,OAAO,aAAa;uGAAb,aAAa;2FAAb,aAAa,wHARd,gBAAgB;;2FAQf,aAAa;kBAVzB,SAAS;+BACE,iBAAiB,YACjB,gBAAgB,iBAEX,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM,QACzC;wBACJ,KAAK,EAAE,iBAAiB;qBACzB","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  ViewEncapsulation,\n} from '@angular/core';\n\n/**\n * Wrapper for the active panel content. `role=\"tabpanel\"`, the panel `id` and\n * `aria-labelledby` (panel → tab) are supplied by the `@angular/aria`\n * `ngTabPanel` directive applied on this element by the parent\n * `mlv-tab-group`; this component only owns the panel styling/animation slot.\n */\n@Component({\n  selector: 'mlv-tab-content',\n  template: `<ng-content />`,\n  styleUrl: './tab-content.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'mlv-tab-content',\n  },\n})\nexport class MlvTabContent {}\n"]}

package/esm2022/tabs/lib/tab-content-def.js

@@ -0,0 +1,14 @@
+import { Directive } from '@angular/core';
+import { MlvStructural } from '@malva-ui/cdk/utils';
+import * as i0 from "@angular/core";
+export class MlvTabContentDef extends MlvStructural {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTabContentDef, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: MlvTabContentDef, isStandalone: true, selector: "[mlvTabContent]", usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTabContentDef, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[mlvTabContent]',
+                }]
+        }] });
+//# sourceMappingURL=tab-content-def.js.map

package/esm2022/tabs/lib/tab-content-def.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-content-def.js","sourceRoot":"","sources":["../../../../../../libs/core/tabs/src/lib/tab-content-def.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;;AAKpD,MAAM,OAAO,gBAAiB,SAAQ,aAAa;uGAAtC,gBAAgB;2FAAhB,gBAAgB;;2FAAhB,gBAAgB;kBAH5B,SAAS;mBAAC;oBACT,QAAQ,EAAE,iBAAiB;iBAC5B","sourcesContent":["import { Directive } from '@angular/core';\nimport { MlvStructural } from '@malva-ui/cdk/utils';\n\n@Directive({\n  selector: '[mlvTabContent]',\n})\nexport class MlvTabContentDef extends MlvStructural {}\n"]}

package/esm2022/tabs/lib/tab-def.js

@@ -0,0 +1,17 @@
+import { Directive, inject, TemplateRef } from '@angular/core';
+import * as i0 from "@angular/core";
+export class MlvTabDef {
+    templateRef = inject(TemplateRef);
+    static ngTemplateContextGuard(_dir, _ctx) {
+        return true;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTabDef, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: MlvTabDef, isStandalone: true, selector: "[mlvTabDef]", ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTabDef, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[mlvTabDef]',
+                }]
+        }] });
+//# sourceMappingURL=tab-def.js.map

package/esm2022/tabs/lib/tab-def.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-def.js","sourceRoot":"","sources":["../../../../../../libs/core/tabs/src/lib/tab-def.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;;AAS/D,MAAM,OAAO,SAAS;IACX,WAAW,GAAG,MAAM,CAAgC,WAAW,CAAC,CAAC;IAE1E,MAAM,CAAC,sBAAsB,CAC3B,IAAe,EACf,IAAa;QAEb,OAAO,IAAI,CAAC;IACd,CAAC;uGARU,SAAS;2FAAT,SAAS;;2FAAT,SAAS;kBAHrB,SAAS;mBAAC;oBACT,QAAQ,EAAE,aAAa;iBACxB","sourcesContent":["import { Directive, inject, TemplateRef } from '@angular/core';\n\nexport interface MlvTabDefContext {\n  $implicit: boolean;\n}\n\n@Directive({\n  selector: '[mlvTabDef]',\n})\nexport class MlvTabDef {\n  readonly templateRef = inject<TemplateRef<MlvTabDefContext>>(TemplateRef);\n\n  static ngTemplateContextGuard(\n    _dir: MlvTabDef,\n    _ctx: unknown,\n  ): _ctx is MlvTabDefContext {\n    return true;\n  }\n}\n"]}

package/esm2022/tabs/lib/tab-group-token.js

@@ -0,0 +1,3 @@
+import { InjectionToken } from '@angular/core';
+export const TAB_GROUP = new InjectionToken('TAB_GROUP');
+//# sourceMappingURL=tab-group-token.js.map

package/esm2022/tabs/lib/tab-group-token.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-group-token.js","sourceRoot":"","sources":["../../../../../../libs/core/tabs/src/lib/tab-group-token.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAW/C,MAAM,CAAC,MAAM,SAAS,GAAG,IAAI,cAAc,CAAsB,WAAW,CAAC,CAAC","sourcesContent":["import type { Signal } from '@angular/core';\nimport { InjectionToken } from '@angular/core';\n\nexport type MlvTabOrientation = 'horizontal' | 'vertical';\n\nexport interface MlvTabGroupAccessor {\n  readonly activeTab: Signal<string>;\n  readonly orientation: Signal<MlvTabOrientation>;\n  selectTab(value: string): void;\n  isActive(value: string): boolean;\n}\n\nexport const TAB_GROUP = new InjectionToken<MlvTabGroupAccessor>('TAB_GROUP');\n"]}

package/esm2022/tabs/lib/tab-item/tab-item.js

@@ -0,0 +1,44 @@
+import { ChangeDetectionStrategy, Component, ElementRef, inject, input, output, ViewEncapsulation, } from '@angular/core';
+import * as i0 from "@angular/core";
+export class MlvTabItem {
+    elementRef = inject((ElementRef));
+    /**
+     * 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`.
+     */
+    active = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
+    /** Whether this tab is disabled. Drives the disabled styling only. */
+    disabled = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    /**
+     * 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.
+     */
+    activate = output();
+    /**
+     * Programmatically focuses this tab item. Used by the parent
+     * `mlv-tab-group` when promoting an overflow tab into the visible header.
+     */
+    focus() {
+        this.elementRef.nativeElement.focus();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTabItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: MlvTabItem, isStandalone: true, selector: "mlv-tab-item", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activate: "activate" }, host: { listeners: { "click": "!disabled() && activate.emit()", "keydown.enter": "!disabled() && activate.emit(); $event.stopPropagation()", "keydown.space": "!disabled() && activate.emit(); $event.stopPropagation(); $event.preventDefault()" }, properties: { "class.mlv-tab-item--active": "active()", "class.mlv-tab-item--disabled": "disabled()" }, classAttribute: "mlv-tab-item" }, ngImport: i0, template: `<ng-content />`, isInline: true, styles: [".mlv-tab-item{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1rem}[class*=--tight] .mlv-tab-item:not([class*=--compact],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-tab-item[class*=--tight]{padding:.375rem .625rem;font-size:var(--mlv-font-size-s)}[class*=--compact] .mlv-tab-item:not([class*=--tight],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-tab-item[class*=--compact]{padding:.5rem .75rem;font-size:var(--mlv-font-size-s)}[class*=--spacious] .mlv-tab-item:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--airy]),.mlv-tab-item[class*=--spacious]{padding:1rem 1.25rem;font-size:var(--mlv-font-size-l)}[class*=--airy] .mlv-tab-item:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--spacious]),.mlv-tab-item[class*=--airy]{padding:1.25rem 1.5rem;font-size:var(--mlv-font-size-l)}.mlv-tab-item{cursor:pointer;border:none;background:none;color:var(--mlv-text-secondary);white-space:nowrap;position:relative;transition:color var(--mlv-duration-normal),background-color var(--mlv-duration-normal);outline:none}.mlv-tab-item:focus-visible{outline:.125rem solid var(--mlv-border-focus);outline-offset:-.125rem;border-radius:var(--mlv-radius-xs)}.mlv-tab-item--active{color:var(--mlv-text-action)}.mlv-tab-item--disabled{opacity:.5;cursor:not-allowed}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTabItem, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-tab-item', template: `<ng-content />`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'mlv-tab-item',
+                        '[class.mlv-tab-item--active]': 'active()',
+                        '[class.mlv-tab-item--disabled]': 'disabled()',
+                        '(click)': '!disabled() && activate.emit()',
+                        '(keydown.enter)': '!disabled() && activate.emit(); $event.stopPropagation()',
+                        '(keydown.space)': '!disabled() && activate.emit(); $event.stopPropagation(); $event.preventDefault()',
+                    }, styles: [".mlv-tab-item{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1rem}[class*=--tight] .mlv-tab-item:not([class*=--compact],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-tab-item[class*=--tight]{padding:.375rem .625rem;font-size:var(--mlv-font-size-s)}[class*=--compact] .mlv-tab-item:not([class*=--tight],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-tab-item[class*=--compact]{padding:.5rem .75rem;font-size:var(--mlv-font-size-s)}[class*=--spacious] .mlv-tab-item:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--airy]),.mlv-tab-item[class*=--spacious]{padding:1rem 1.25rem;font-size:var(--mlv-font-size-l)}[class*=--airy] .mlv-tab-item:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--spacious]),.mlv-tab-item[class*=--airy]{padding:1.25rem 1.5rem;font-size:var(--mlv-font-size-l)}.mlv-tab-item{cursor:pointer;border:none;background:none;color:var(--mlv-text-secondary);white-space:nowrap;position:relative;transition:color var(--mlv-duration-normal),background-color var(--mlv-duration-normal);outline:none}.mlv-tab-item:focus-visible{outline:.125rem solid var(--mlv-border-focus);outline-offset:-.125rem;border-radius:var(--mlv-radius-xs)}.mlv-tab-item--active{color:var(--mlv-text-action)}.mlv-tab-item--disabled{opacity:.5;cursor:not-allowed}\n"] }]
+        }], propDecorators: { active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], activate: [{ type: i0.Output, args: ["activate"] }] } });
+//# sourceMappingURL=tab-item.js.map

package/esm2022/tabs/lib/tab-item/tab-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab-item.js","sourceRoot":"","sources":["../../../../../../../libs/core/tabs/src/lib/tab-item/tab-item.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,UAAU,EACV,MAAM,EACN,KAAK,EACL,MAAM,EACN,iBAAiB,GAClB,MAAM,eAAe,CAAC;;AAmBvB,MAAM,OAAO,UAAU;IACZ,UAAU,GAAG,MAAM,CAAC,CAAA,UAAuB,CAAA,CAAC,CAAC;IAEtD;;;;;OAKG;IACM,MAAM,GAAG,KAAK,CAAC,KAAK;+EAAC,CAAC;IAE/B,sEAAsE;IAC7D,QAAQ,GAAG,KAAK,CAAC,KAAK;iFAAC,CAAC;IAEjC;;;;;OAKG;IACM,QAAQ,GAAG,MAAM,EAAQ,CAAC;IAEnC;;;OAGG;IACH,KAAK;QACH,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;IACxC,CAAC;uGA5BU,UAAU;2FAAV,UAAU,kvBAfX,gBAAgB;;2FAef,UAAU;kBAjBtB,SAAS;+BACE,cAAc,YACd,gBAAgB,iBAEX,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM,QACzC;wBACJ,KAAK,EAAE,cAAc;wBACrB,8BAA8B,EAAE,UAAU;wBAC1C,gCAAgC,EAAE,YAAY;wBAC9C,SAAS,EAAE,gCAAgC;wBAC3C,iBAAiB,EACf,0DAA0D;wBAC5D,iBAAiB,EACf,mFAAmF;qBACtF","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  ElementRef,\n  inject,\n  input,\n  output,\n  ViewEncapsulation,\n} from '@angular/core';\n\n@Component({\n  selector: 'mlv-tab-item',\n  template: `<ng-content />`,\n  styleUrl: './tab-item.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'mlv-tab-item',\n    '[class.mlv-tab-item--active]': 'active()',\n    '[class.mlv-tab-item--disabled]': 'disabled()',\n    '(click)': '!disabled() && activate.emit()',\n    '(keydown.enter)':\n      '!disabled() && activate.emit(); $event.stopPropagation()',\n    '(keydown.space)':\n      '!disabled() && activate.emit(); $event.stopPropagation(); $event.preventDefault()',\n  },\n})\nexport class MlvTabItem {\n  readonly elementRef = inject(ElementRef<HTMLElement>);\n\n  /**\n   * Whether this tab is currently selected. Drives the active styling only —\n   * `aria-selected`, `role=\"tab\"`, roving `tabindex` and `aria-controls` are\n   * provided by the `@angular/aria` `ngTab` directive applied on this element\n   * by the parent `mlv-tab-group`.\n   */\n  readonly active = input(false);\n\n  /** Whether this tab is disabled. Drives the disabled styling only. */\n  readonly disabled = input(false);\n\n  /**\n   * Emitted on click or Enter/Space when not disabled. Enter/Space stop\n   * propagation so the aria `ngTabList` keyboard handler does not additionally\n   * activate the (roving-)focused tab; this preserves the historical behaviour\n   * where keyboard activation targets the tab receiving the event.\n   */\n  readonly activate = output<void>();\n\n  /**\n   * Programmatically focuses this tab item. Used by the parent\n   * `mlv-tab-group` when promoting an overflow tab into the visible header.\n   */\n  focus(): void {\n    this.elementRef.nativeElement.focus();\n  }\n}\n"]}