@malva-ui/core 0.1.13 → 0.1.14

package/fesm2022/malva-ui-core-switch.mjs

@@ -0,0 +1,272 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, ElementRef, Renderer2, HostAttributeToken, input, signal, computed, afterNextRender, model, viewChild, isDevMode, forwardRef, ChangeDetectionStrategy, ViewEncapsulation, Component, contentChildren } from '@angular/core';
+import { MlvSignalCheckboxControlBase, MLV_FORM_CONTROL, MlvFocusableGroupBase, MlvLabel } from '@malva-ui/core/form-utils';
+import * as i1 from '@malva-ui/cdk/density';
+import { MLV_DENSITY_ELEMENT, MlvDensityDirective, provideMlvDensityContext } from '@malva-ui/cdk/density';
+
+const SWITCH_GROUP = new InjectionToken('SWITCH_GROUP');
+
+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_DENSITY_ELEMENT,
+                useValue: 'switch',
+            },
+            {
+                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, hostDirectives: [{ directive: i1.MlvDensityDirective, inputs: ["mlvDensity", "mlvDensity"] }], 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: ["@layer mlv.components{.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{--mlv-switch-track-width: 2.5rem;--mlv-switch-track-height: 1.5rem;--mlv-switch-thumb-size: 1.25rem;--mlv-switch-thumb-inset: .125rem;--mlv-switch-thumb-travel: 1rem;--mlv-switch-gap: var(--mlv-spacing-2);--mlv-switch-font-size: var(--mlv-typography-body-m-size);--mlv-switch-line-height: var(--mlv-line-height-normal);--mlv-switch-track-bg: var(--mlv-background-neutral-1);color:var(--mlv-text-primary);display:inline-block}[class*=--tight] .mlv-switch:not([class*=--compact],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-switch[class*=--tight]{--mlv-switch-track-width: 2rem;--mlv-switch-track-height: 1.125rem;--mlv-switch-thumb-size: .875rem;--mlv-switch-thumb-travel: .875rem;--mlv-switch-gap: var(--mlv-spacing-1);--mlv-switch-font-size: var(--mlv-typography-body-s-size);--mlv-switch-line-height: var(--mlv-line-height-tight)}[class*=--compact] .mlv-switch:not([class*=--tight],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-switch[class*=--compact]{--mlv-switch-track-width: 2.25rem;--mlv-switch-track-height: 1.25rem;--mlv-switch-thumb-size: 1rem;--mlv-switch-thumb-travel: 1rem;--mlv-switch-gap: var(--mlv-spacing-1-5);--mlv-switch-font-size: var(--mlv-typography-body-m-size);--mlv-switch-line-height: var(--mlv-line-height-normal)}[class*=--comfortable] .mlv-switch:not([class*=--tight],[class*=--compact],[class*=--spacious],[class*=--airy]),.mlv-switch[class*=--comfortable]{--mlv-switch-track-width: 2.5rem;--mlv-switch-track-height: 1.5rem;--mlv-switch-thumb-size: 1.25rem;--mlv-switch-thumb-travel: 1rem;--mlv-switch-gap: var(--mlv-spacing-2);--mlv-switch-font-size: var(--mlv-typography-body-m-size);--mlv-switch-line-height: var(--mlv-line-height-normal)}[class*=--spacious] .mlv-switch:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--airy]),.mlv-switch[class*=--spacious]{--mlv-switch-track-width: 3rem;--mlv-switch-track-height: 1.75rem;--mlv-switch-thumb-size: 1.5rem;--mlv-switch-thumb-travel: 1.25rem;--mlv-switch-gap: var(--mlv-spacing-2-5);--mlv-switch-font-size: var(--mlv-typography-body-l-size);--mlv-switch-line-height: var(--mlv-line-height-normal)}[class*=--airy] .mlv-switch:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--spacious]),.mlv-switch[class*=--airy]{--mlv-switch-track-width: 3.5rem;--mlv-switch-track-height: 2rem;--mlv-switch-thumb-size: 1.75rem;--mlv-switch-thumb-travel: 1.5rem;--mlv-switch-gap: var(--mlv-spacing-3);--mlv-switch-font-size: var(--mlv-font-size-xl);--mlv-switch-line-height: var(--mlv-line-height-relaxed)}.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-medium) solid var(--mlv-border-focus);outline-offset:var(--mlv-focus-ring-offset)}.mlv-switch__label{display:inline-flex;align-items:center;gap:var(--mlv-switch-gap);cursor:pointer;min-block-size:1.5rem;min-inline-size:1.5rem}.mlv-switch:not(.mlv-switch--checked) .mlv-switch__label:hover{--mlv-switch-track-bg: var(--mlv-background-neutral-1-hover)}.mlv-switch--checked .mlv-switch__label:hover{--mlv-switch-track-bg: var(--mlv-background-accent-1-hover)}.mlv-switch__track{position:relative;display:inline-flex;flex:none;align-items:center;width:var(--mlv-switch-track-width);height:var(--mlv-switch-track-height);border-radius:var(--mlv-radius-full);background-color:var(--mlv-switch-track-bg);transition:background-color var(--mlv-duration-fast) var(--mlv-ease-default)}.mlv-switch__thumb{position:absolute;inset-inline-start:var(--mlv-switch-thumb-inset);width:var(--mlv-switch-thumb-size);height:var(--mlv-switch-thumb-size);border-radius:var(--mlv-radius-full);background-color:var(--mlv-elevation-bg-5);box-shadow:var(--mlv-shadow-raised);transition:transform var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-switch--checked{--mlv-switch-track-bg: var(--mlv-background-accent-1)}.mlv-switch--checked .mlv-switch__thumb{transform:translate(calc(var(--mlv-switch-thumb-travel) * var(--mlv-inline-direction)))}.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;font-size:var(--mlv-switch-font-size);line-height:var(--mlv-switch-line-height)}.mlv-switch__content:not(:empty)+.mlv-switch__label-text{display:none}[mlvTheme=dark] .mlv-switch{--mlv-elevation-bg-5: var(--mlv-palette-neutral-50)}@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, hostDirectives: [{ directive: MlvDensityDirective, inputs: ['mlvDensity'] }], providers: [
+                        {
+                            provide: MLV_DENSITY_ELEMENT,
+                            useValue: 'switch',
+                        },
+                        {
+                            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: ["@layer mlv.components{.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{--mlv-switch-track-width: 2.5rem;--mlv-switch-track-height: 1.5rem;--mlv-switch-thumb-size: 1.25rem;--mlv-switch-thumb-inset: .125rem;--mlv-switch-thumb-travel: 1rem;--mlv-switch-gap: var(--mlv-spacing-2);--mlv-switch-font-size: var(--mlv-typography-body-m-size);--mlv-switch-line-height: var(--mlv-line-height-normal);--mlv-switch-track-bg: var(--mlv-background-neutral-1);color:var(--mlv-text-primary);display:inline-block}[class*=--tight] .mlv-switch:not([class*=--compact],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-switch[class*=--tight]{--mlv-switch-track-width: 2rem;--mlv-switch-track-height: 1.125rem;--mlv-switch-thumb-size: .875rem;--mlv-switch-thumb-travel: .875rem;--mlv-switch-gap: var(--mlv-spacing-1);--mlv-switch-font-size: var(--mlv-typography-body-s-size);--mlv-switch-line-height: var(--mlv-line-height-tight)}[class*=--compact] .mlv-switch:not([class*=--tight],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-switch[class*=--compact]{--mlv-switch-track-width: 2.25rem;--mlv-switch-track-height: 1.25rem;--mlv-switch-thumb-size: 1rem;--mlv-switch-thumb-travel: 1rem;--mlv-switch-gap: var(--mlv-spacing-1-5);--mlv-switch-font-size: var(--mlv-typography-body-m-size);--mlv-switch-line-height: var(--mlv-line-height-normal)}[class*=--comfortable] .mlv-switch:not([class*=--tight],[class*=--compact],[class*=--spacious],[class*=--airy]),.mlv-switch[class*=--comfortable]{--mlv-switch-track-width: 2.5rem;--mlv-switch-track-height: 1.5rem;--mlv-switch-thumb-size: 1.25rem;--mlv-switch-thumb-travel: 1rem;--mlv-switch-gap: var(--mlv-spacing-2);--mlv-switch-font-size: var(--mlv-typography-body-m-size);--mlv-switch-line-height: var(--mlv-line-height-normal)}[class*=--spacious] .mlv-switch:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--airy]),.mlv-switch[class*=--spacious]{--mlv-switch-track-width: 3rem;--mlv-switch-track-height: 1.75rem;--mlv-switch-thumb-size: 1.5rem;--mlv-switch-thumb-travel: 1.25rem;--mlv-switch-gap: var(--mlv-spacing-2-5);--mlv-switch-font-size: var(--mlv-typography-body-l-size);--mlv-switch-line-height: var(--mlv-line-height-normal)}[class*=--airy] .mlv-switch:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--spacious]),.mlv-switch[class*=--airy]{--mlv-switch-track-width: 3.5rem;--mlv-switch-track-height: 2rem;--mlv-switch-thumb-size: 1.75rem;--mlv-switch-thumb-travel: 1.5rem;--mlv-switch-gap: var(--mlv-spacing-3);--mlv-switch-font-size: var(--mlv-font-size-xl);--mlv-switch-line-height: var(--mlv-line-height-relaxed)}.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-medium) solid var(--mlv-border-focus);outline-offset:var(--mlv-focus-ring-offset)}.mlv-switch__label{display:inline-flex;align-items:center;gap:var(--mlv-switch-gap);cursor:pointer;min-block-size:1.5rem;min-inline-size:1.5rem}.mlv-switch:not(.mlv-switch--checked) .mlv-switch__label:hover{--mlv-switch-track-bg: var(--mlv-background-neutral-1-hover)}.mlv-switch--checked .mlv-switch__label:hover{--mlv-switch-track-bg: var(--mlv-background-accent-1-hover)}.mlv-switch__track{position:relative;display:inline-flex;flex:none;align-items:center;width:var(--mlv-switch-track-width);height:var(--mlv-switch-track-height);border-radius:var(--mlv-radius-full);background-color:var(--mlv-switch-track-bg);transition:background-color var(--mlv-duration-fast) var(--mlv-ease-default)}.mlv-switch__thumb{position:absolute;inset-inline-start:var(--mlv-switch-thumb-inset);width:var(--mlv-switch-thumb-size);height:var(--mlv-switch-thumb-size);border-radius:var(--mlv-radius-full);background-color:var(--mlv-elevation-bg-5);box-shadow:var(--mlv-shadow-raised);transition:transform var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-switch--checked{--mlv-switch-track-bg: var(--mlv-background-accent-1)}.mlv-switch--checked .mlv-switch__thumb{transform:translate(calc(var(--mlv-switch-thumb-travel) * var(--mlv-inline-direction)))}.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;font-size:var(--mlv-switch-font-size);line-height:var(--mlv-switch-line-height)}.mlv-switch__content:not(:empty)+.mlv-switch__label-text{display:none}[mlvTheme=dark] .mlv-switch{--mlv-elevation-bg-5: var(--mlv-palette-neutral-50)}@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 }] }] } });
+
+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 } }, host: { attributes: { "role": "group" }, listeners: { "keydown": "onKeydown($event)" }, properties: { "attr.aria-label": "label() || null" }, classAttribute: "mlv-switch-group" }, providers: [
+            {
+                provide: SWITCH_GROUP,
+                useExisting: forwardRef(() => MlvSwitchGroup),
+            },
+            { provide: MLV_DENSITY_ELEMENT, useValue: 'switch-group' },
+            // Projects the group's resolved density to every density-aware descendant
+            // — the projected `<mlv-switch>` children resolve `MLV_DENSITY_CONTEXT`
+            // through their declaration-site element injector, which is this host.
+            provideMlvDensityContext(MlvDensityDirective),
+        ], queries: [{ propertyName: "_items", predicate: MlvSwitch, isSignal: true }], usesInheritance: true, hostDirectives: [{ directive: i1.MlvDensityDirective, inputs: ["mlvDensity", "mlvDensity"] }], ngImport: i0, template: `
+    @if (label()) {
+      <mlv-label>
+        {{ label() }}
+      </mlv-label>
+    }
+    <ng-content />
+  `, isInline: true, styles: ["@layer mlv.components{.mlv-switch-group{--mlv-switch-group-gap: var(--mlv-spacing-2);display:flex;flex-direction:column;gap:var(--mlv-switch-group-gap)}[class*=--tight] .mlv-switch-group:not([class*=--compact],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-switch-group[class*=--tight]{--mlv-switch-group-gap: var(--mlv-spacing-1)}[class*=--compact] .mlv-switch-group:not([class*=--tight],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-switch-group[class*=--compact]{--mlv-switch-group-gap: var(--mlv-spacing-1-5)}[class*=--comfortable] .mlv-switch-group:not([class*=--tight],[class*=--compact],[class*=--spacious],[class*=--airy]),.mlv-switch-group[class*=--comfortable]{--mlv-switch-group-gap: var(--mlv-spacing-2)}[class*=--spacious] .mlv-switch-group:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--airy]),.mlv-switch-group[class*=--spacious]{--mlv-switch-group-gap: var(--mlv-spacing-3)}[class*=--airy] .mlv-switch-group:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--spacious]),.mlv-switch-group[class*=--airy]{--mlv-switch-group-gap: var(--mlv-spacing-4)}}\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: `
+    @if (label()) {
+      <mlv-label>
+        {{ label() }}
+      </mlv-label>
+    }
+    <ng-content />
+  `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [{ directive: MlvDensityDirective, inputs: ['mlvDensity'] }], providers: [
+                        {
+                            provide: SWITCH_GROUP,
+                            useExisting: forwardRef(() => MlvSwitchGroup),
+                        },
+                        { provide: MLV_DENSITY_ELEMENT, useValue: 'switch-group' },
+                        // Projects the group's resolved density to every density-aware descendant
+                        // — the projected `<mlv-switch>` children resolve `MLV_DENSITY_CONTEXT`
+                        // through their declaration-site element injector, which is this host.
+                        provideMlvDensityContext(MlvDensityDirective),
+                    ], host: {
+                        class: 'mlv-switch-group',
+                        role: 'group',
+                        '[attr.aria-label]': 'label() || null',
+                        '(keydown)': 'onKeydown($event)',
+                    }, imports: [MlvLabel], styles: ["@layer mlv.components{.mlv-switch-group{--mlv-switch-group-gap: var(--mlv-spacing-2);display:flex;flex-direction:column;gap:var(--mlv-switch-group-gap)}[class*=--tight] .mlv-switch-group:not([class*=--compact],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-switch-group[class*=--tight]{--mlv-switch-group-gap: var(--mlv-spacing-1)}[class*=--compact] .mlv-switch-group:not([class*=--tight],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-switch-group[class*=--compact]{--mlv-switch-group-gap: var(--mlv-spacing-1-5)}[class*=--comfortable] .mlv-switch-group:not([class*=--tight],[class*=--compact],[class*=--spacious],[class*=--airy]),.mlv-switch-group[class*=--comfortable]{--mlv-switch-group-gap: var(--mlv-spacing-2)}[class*=--spacious] .mlv-switch-group:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--airy]),.mlv-switch-group[class*=--spacious]{--mlv-switch-group-gap: var(--mlv-spacing-3)}[class*=--airy] .mlv-switch-group:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--spacious]),.mlv-switch-group[class*=--airy]{--mlv-switch-group-gap: var(--mlv-spacing-4)}}\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 }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { MlvSwitch, MlvSwitchGroup };
+//# sourceMappingURL=malva-ui-core-switch.mjs.map

package/fesm2022/malva-ui-core-switch.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-switch.mjs","sources":["../../../../libs/core/switch/src/lib/switch-group-token.ts","../../../../libs/core/switch/src/lib/switch/switch.ts","../../../../libs/core/switch/src/lib/switch/switch.html","../../../../libs/core/switch/src/lib/switch-group/switch-group.ts","../../../../libs/core/switch/src/malva-ui-core-switch.ts"],"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","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 {\n  MLV_DENSITY_ELEMENT,\n  MlvDensityDirective,\n} from '@malva-ui/cdk/density';\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  hostDirectives: [{ directive: MlvDensityDirective, inputs: ['mlvDensity'] }],\n  providers: [\n    {\n      provide: MLV_DENSITY_ELEMENT,\n      useValue: 'switch',\n    },\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","import {\n  ChangeDetectionStrategy,\n  Component,\n  contentChildren,\n  forwardRef,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport {\n  MLV_DENSITY_ELEMENT,\n  MlvDensityDirective,\n  provideMlvDensityContext,\n} from '@malva-ui/cdk/density';\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    @if (label()) {\n      <mlv-label>\n        {{ label() }}\n      </mlv-label>\n    }\n    <ng-content />\n  `,\n  styleUrl: './switch-group.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  hostDirectives: [{ directive: MlvDensityDirective, inputs: ['mlvDensity'] }],\n  providers: [\n    {\n      provide: SWITCH_GROUP,\n      useExisting: forwardRef(() => MlvSwitchGroup),\n    },\n    { provide: MLV_DENSITY_ELEMENT, useValue: 'switch-group' },\n    // Projects the group's resolved density to every density-aware descendant\n    // — the projected `<mlv-switch>` children resolve `MLV_DENSITY_CONTEXT`\n    // through their declaration-site element injector, which is this host.\n    provideMlvDensityContext(MlvDensityDirective),\n  ],\n  host: {\n    class: 'mlv-switch-group',\n    role: 'group',\n    '[attr.aria-label]': 'label() || null',\n    '(keydown)': 'onKeydown($event)',\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","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/malva-ui-core-table.mjs

@@ -0,0 +1,79 @@
+import * as i0 from '@angular/core';
+import { input, ChangeDetectionStrategy, ViewEncapsulation, Component, Directive } from '@angular/core';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import * as i1 from '@malva-ui/cdk/density';
+import { MLV_DENSITY_ELEMENT, MlvDensityDirective } from '@malva-ui/cdk/density';
+
+class MlvTable {
+    /** Shows a cell grid and an outer table boundary. */
+    bordered = input(false, { ...(ngDevMode ? { debugName: "bordered" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /** Enables horizontal overflow behavior for narrow viewports. */
+    responsive = input(false, { ...(ngDevMode ? { debugName: "responsive" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /** Enables the mobile paired-row Pop In presentation. */
+    popIn = input(false, { ...(ngDevMode ? { debugName: "popIn" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /** Chooses whether rows or individual cells receive hover feedback. */
+    hoverable = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hoverable" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: MlvTable, isStandalone: true, selector: "table[mlvTable]", inputs: { bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, responsive: { classPropertyName: "responsive", publicName: "responsive", isSignal: true, isRequired: false, transformFunction: null }, popIn: { classPropertyName: "popIn", publicName: "popIn", isSignal: true, isRequired: false, transformFunction: null }, hoverable: { classPropertyName: "hoverable", publicName: "hoverable", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mlv-table--bordered": "bordered()", "class.mlv-table--responsive": "responsive()", "class.mlv-table--pop-in": "popIn()", "class.mlv-table--hover-row": "hoverable() === \"row\"", "class.mlv-table--hover-cell": "hoverable() === \"cell\"" }, classAttribute: "mlv-table" }, providers: [{ provide: MLV_DENSITY_ELEMENT, useValue: 'table' }], hostDirectives: [{ directive: i1.MlvDensityDirective, inputs: ["mlvDensity", "mlvDensity"] }], ngImport: i0, template: "<ng-content />\n", styles: ["@layer mlv.components{.mlv-table{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-table *{box-sizing:border-box}.mlv-table{--mlv-table-cell-padding-block: var(--mlv-spacing-3);--mlv-table-cell-padding-inline: var(--mlv-spacing-4);--mlv-table-border-color: var(--mlv-border-subtle);--mlv-table-header-background: var(--mlv-background-subtle);--mlv-table-hover-background: var(--mlv-background-neutral-1-hover);--mlv-table-secondary-background: var(--mlv-background-base);--mlv-table-font-size: var(--mlv-font-size-m);--mlv-table-header-font-size: var(--mlv-font-size-s);width:100%;border-spacing:0;border-collapse:separate;color:var(--mlv-text-primary);background:var(--mlv-background-raised);font-size:var(--mlv-table-font-size);line-height:var(--mlv-line-height-normal);text-align:start}[class*=--tight] .mlv-table:not([class*=--compact],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-table[class*=--tight]{--mlv-table-cell-padding-block: var(--mlv-spacing-1);--mlv-table-cell-padding-inline: var(--mlv-spacing-2);--mlv-table-font-size: var(--mlv-font-size-s);--mlv-table-header-font-size: var(--mlv-font-size-s)}[class*=--compact] .mlv-table:not([class*=--tight],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-table[class*=--compact]{--mlv-table-cell-padding-block: var(--mlv-spacing-2);--mlv-table-cell-padding-inline: var(--mlv-spacing-3);--mlv-table-font-size: var(--mlv-font-size-s);--mlv-table-header-font-size: var(--mlv-font-size-s)}[class*=--spacious] .mlv-table:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--airy]),.mlv-table[class*=--spacious]{--mlv-table-cell-padding-block: var(--mlv-spacing-4);--mlv-table-cell-padding-inline: var(--mlv-spacing-5);--mlv-table-font-size: var(--mlv-font-size-l);--mlv-table-header-font-size: var(--mlv-font-size-m)}[class*=--airy] .mlv-table:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--spacious]),.mlv-table[class*=--airy]{--mlv-table-cell-padding-block: var(--mlv-spacing-5);--mlv-table-cell-padding-inline: var(--mlv-spacing-6);--mlv-table-font-size: var(--mlv-font-size-l);--mlv-table-header-font-size: var(--mlv-font-size-l)}.mlv-table caption{padding-block:var(--mlv-spacing-3);color:var(--mlv-text-secondary);font-size:var(--mlv-font-size-s);font-weight:var(--mlv-font-weight-medium);line-height:var(--mlv-line-height-tight);text-align:start;caption-side:top}.mlv-table thead{background:var(--mlv-table-header-background)}.mlv-table th,.mlv-table td{min-width:0;padding-block:var(--mlv-table-cell-padding-block);padding-inline:var(--mlv-table-cell-padding-inline);vertical-align:middle}.mlv-table th{color:var(--mlv-text-label);font-size:var(--mlv-table-header-font-size);font-weight:var(--mlv-font-weight-semibold);line-height:var(--mlv-line-height-tight);letter-spacing:.02em;white-space:nowrap}.mlv-table tbody tr>*{border-block-start:var(--mlv-stroke-width) solid var(--mlv-table-border-color)}.mlv-table tbody tr:first-child>*{border-block-start:0}.mlv-table tfoot{font-size:var(--mlv-font-size-s);font-weight:var(--mlv-font-weight-medium)}.mlv-table tfoot tr>*{border-block-start:var(--mlv-stroke-width) solid var(--mlv-border-normal)}.mlv-table--bordered{border:var(--mlv-stroke-width) solid var(--mlv-border-normal);border-radius:var(--mlv-radius-l);border-collapse:separate;overflow:hidden}.mlv-table--bordered th,.mlv-table--bordered td{border-inline-end:var(--mlv-stroke-width) solid var(--mlv-table-border-color)}.mlv-table--bordered tr>*:last-child{border-inline-end:0}.mlv-table--bordered thead th{border-block-end:var(--mlv-stroke-width) solid var(--mlv-border-normal)}.mlv-table--bordered tbody tr:first-child>*{border-block-start:0}.mlv-table--hover-row tbody tr:hover>*{background:var(--mlv-table-hover-background)}.mlv-table--hover-cell tbody td:hover{background:var(--mlv-table-hover-background)}.mlv-table--responsive{display:block;max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}.mlv-table--responsive thead,.mlv-table--responsive tbody,.mlv-table--responsive tfoot{display:table;width:100%;min-width:max-content}@media(max-width:48rem){.mlv-table--responsive.mlv-table--pop-in{display:block;overflow:visible;border:0;border-radius:0;background:transparent}.mlv-table--responsive.mlv-table--pop-in thead{position:absolute;width:.0625rem;height:.0625rem;margin:-.0625rem;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.mlv-table--responsive.mlv-table--pop-in tbody,.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main,.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--secondary{display:block;width:100%;min-width:0}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main{border:var(--mlv-stroke-width) solid var(--mlv-border-normal);border-radius:var(--mlv-radius-l) var(--mlv-radius-l) 0 0;background:var(--mlv-background-raised);box-shadow:var(--mlv-shadow-flat)}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main td{display:flex;align-items:baseline;justify-content:space-between;gap:var(--mlv-spacing-4);padding-block:var(--mlv-spacing-3);padding-inline:var(--mlv-spacing-4);border:0}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main td+td{border-block-start:var(--mlv-stroke-width) solid var(--mlv-table-border-color)}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main td:before{flex:0 1 auto;color:var(--mlv-text-secondary);content:attr(data-label);font-size:var(--mlv-font-size-s);font-weight:var(--mlv-font-weight-medium)}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--secondary{border:var(--mlv-stroke-width) solid var(--mlv-border-normal);border-block-start:0;border-radius:0 0 var(--mlv-radius-l) var(--mlv-radius-l);background:var(--mlv-table-secondary-background)}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--secondary td{display:block;width:100%;padding-block:var(--mlv-spacing-3);padding-inline:var(--mlv-spacing-4);color:var(--mlv-text-secondary);font-size:var(--mlv-font-size-s);border:0}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main+tr.mlv-table__row--main,.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--secondary+tr.mlv-table__row--main{margin-block-start:var(--mlv-spacing-4)}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main:hover>*,.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--secondary:hover>*{background:inherit}}@media(prefers-reduced-motion:no-preference){.mlv-table tbody tr>*,.mlv-table tbody td:before{transition:background-color var(--mlv-duration-fast) var(--mlv-ease-default)}}@media(prefers-reduced-motion:reduce){.mlv-table,.mlv-table *,.mlv-table:before,.mlv-table:after,[class^=mlv-table__],[class*=\" mlv-table__\"],[class^=mlv-table--],[class*=\" mlv-table--\"]{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: MlvTable, decorators: [{
+            type: Component,
+            args: [{ selector: 'table[mlvTable]', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: MLV_DENSITY_ELEMENT, useValue: 'table' }], hostDirectives: [
+                        {
+                            directive: MlvDensityDirective,
+                            inputs: ['mlvDensity'],
+                        },
+                    ], host: {
+                        class: 'mlv-table',
+                        '[class.mlv-table--bordered]': 'bordered()',
+                        '[class.mlv-table--responsive]': 'responsive()',
+                        '[class.mlv-table--pop-in]': 'popIn()',
+                        '[class.mlv-table--hover-row]': 'hoverable() === "row"',
+                        '[class.mlv-table--hover-cell]': 'hoverable() === "cell"',
+                    }, template: "<ng-content />\n", styles: ["@layer mlv.components{.mlv-table{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-table *{box-sizing:border-box}.mlv-table{--mlv-table-cell-padding-block: var(--mlv-spacing-3);--mlv-table-cell-padding-inline: var(--mlv-spacing-4);--mlv-table-border-color: var(--mlv-border-subtle);--mlv-table-header-background: var(--mlv-background-subtle);--mlv-table-hover-background: var(--mlv-background-neutral-1-hover);--mlv-table-secondary-background: var(--mlv-background-base);--mlv-table-font-size: var(--mlv-font-size-m);--mlv-table-header-font-size: var(--mlv-font-size-s);width:100%;border-spacing:0;border-collapse:separate;color:var(--mlv-text-primary);background:var(--mlv-background-raised);font-size:var(--mlv-table-font-size);line-height:var(--mlv-line-height-normal);text-align:start}[class*=--tight] .mlv-table:not([class*=--compact],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-table[class*=--tight]{--mlv-table-cell-padding-block: var(--mlv-spacing-1);--mlv-table-cell-padding-inline: var(--mlv-spacing-2);--mlv-table-font-size: var(--mlv-font-size-s);--mlv-table-header-font-size: var(--mlv-font-size-s)}[class*=--compact] .mlv-table:not([class*=--tight],[class*=--comfortable],[class*=--spacious],[class*=--airy]),.mlv-table[class*=--compact]{--mlv-table-cell-padding-block: var(--mlv-spacing-2);--mlv-table-cell-padding-inline: var(--mlv-spacing-3);--mlv-table-font-size: var(--mlv-font-size-s);--mlv-table-header-font-size: var(--mlv-font-size-s)}[class*=--spacious] .mlv-table:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--airy]),.mlv-table[class*=--spacious]{--mlv-table-cell-padding-block: var(--mlv-spacing-4);--mlv-table-cell-padding-inline: var(--mlv-spacing-5);--mlv-table-font-size: var(--mlv-font-size-l);--mlv-table-header-font-size: var(--mlv-font-size-m)}[class*=--airy] .mlv-table:not([class*=--tight],[class*=--compact],[class*=--comfortable],[class*=--spacious]),.mlv-table[class*=--airy]{--mlv-table-cell-padding-block: var(--mlv-spacing-5);--mlv-table-cell-padding-inline: var(--mlv-spacing-6);--mlv-table-font-size: var(--mlv-font-size-l);--mlv-table-header-font-size: var(--mlv-font-size-l)}.mlv-table caption{padding-block:var(--mlv-spacing-3);color:var(--mlv-text-secondary);font-size:var(--mlv-font-size-s);font-weight:var(--mlv-font-weight-medium);line-height:var(--mlv-line-height-tight);text-align:start;caption-side:top}.mlv-table thead{background:var(--mlv-table-header-background)}.mlv-table th,.mlv-table td{min-width:0;padding-block:var(--mlv-table-cell-padding-block);padding-inline:var(--mlv-table-cell-padding-inline);vertical-align:middle}.mlv-table th{color:var(--mlv-text-label);font-size:var(--mlv-table-header-font-size);font-weight:var(--mlv-font-weight-semibold);line-height:var(--mlv-line-height-tight);letter-spacing:.02em;white-space:nowrap}.mlv-table tbody tr>*{border-block-start:var(--mlv-stroke-width) solid var(--mlv-table-border-color)}.mlv-table tbody tr:first-child>*{border-block-start:0}.mlv-table tfoot{font-size:var(--mlv-font-size-s);font-weight:var(--mlv-font-weight-medium)}.mlv-table tfoot tr>*{border-block-start:var(--mlv-stroke-width) solid var(--mlv-border-normal)}.mlv-table--bordered{border:var(--mlv-stroke-width) solid var(--mlv-border-normal);border-radius:var(--mlv-radius-l);border-collapse:separate;overflow:hidden}.mlv-table--bordered th,.mlv-table--bordered td{border-inline-end:var(--mlv-stroke-width) solid var(--mlv-table-border-color)}.mlv-table--bordered tr>*:last-child{border-inline-end:0}.mlv-table--bordered thead th{border-block-end:var(--mlv-stroke-width) solid var(--mlv-border-normal)}.mlv-table--bordered tbody tr:first-child>*{border-block-start:0}.mlv-table--hover-row tbody tr:hover>*{background:var(--mlv-table-hover-background)}.mlv-table--hover-cell tbody td:hover{background:var(--mlv-table-hover-background)}.mlv-table--responsive{display:block;max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}.mlv-table--responsive thead,.mlv-table--responsive tbody,.mlv-table--responsive tfoot{display:table;width:100%;min-width:max-content}@media(max-width:48rem){.mlv-table--responsive.mlv-table--pop-in{display:block;overflow:visible;border:0;border-radius:0;background:transparent}.mlv-table--responsive.mlv-table--pop-in thead{position:absolute;width:.0625rem;height:.0625rem;margin:-.0625rem;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.mlv-table--responsive.mlv-table--pop-in tbody,.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main,.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--secondary{display:block;width:100%;min-width:0}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main{border:var(--mlv-stroke-width) solid var(--mlv-border-normal);border-radius:var(--mlv-radius-l) var(--mlv-radius-l) 0 0;background:var(--mlv-background-raised);box-shadow:var(--mlv-shadow-flat)}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main td{display:flex;align-items:baseline;justify-content:space-between;gap:var(--mlv-spacing-4);padding-block:var(--mlv-spacing-3);padding-inline:var(--mlv-spacing-4);border:0}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main td+td{border-block-start:var(--mlv-stroke-width) solid var(--mlv-table-border-color)}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main td:before{flex:0 1 auto;color:var(--mlv-text-secondary);content:attr(data-label);font-size:var(--mlv-font-size-s);font-weight:var(--mlv-font-weight-medium)}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--secondary{border:var(--mlv-stroke-width) solid var(--mlv-border-normal);border-block-start:0;border-radius:0 0 var(--mlv-radius-l) var(--mlv-radius-l);background:var(--mlv-table-secondary-background)}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--secondary td{display:block;width:100%;padding-block:var(--mlv-spacing-3);padding-inline:var(--mlv-spacing-4);color:var(--mlv-text-secondary);font-size:var(--mlv-font-size-s);border:0}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main+tr.mlv-table__row--main,.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--secondary+tr.mlv-table__row--main{margin-block-start:var(--mlv-spacing-4)}.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--main:hover>*,.mlv-table--responsive.mlv-table--pop-in tr.mlv-table__row--secondary:hover>*{background:inherit}}@media(prefers-reduced-motion:no-preference){.mlv-table tbody tr>*,.mlv-table tbody td:before{transition:background-color var(--mlv-duration-fast) var(--mlv-ease-default)}}@media(prefers-reduced-motion:reduce){.mlv-table,.mlv-table *,.mlv-table:before,.mlv-table:after,[class^=mlv-table__],[class*=\" mlv-table__\"],[class^=mlv-table--],[class*=\" mlv-table--\"]{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:var(--mlv-duration-instant)!important}}}\n"] }]
+        }], propDecorators: { bordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "bordered", required: false }] }], responsive: [{ type: i0.Input, args: [{ isSignal: true, alias: "responsive", required: false }] }], popIn: [{ type: i0.Input, args: [{ isSignal: true, alias: "popIn", required: false }] }], hoverable: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverable", required: false }] }] } });
+
+/** Marks a native table row as the primary or supporting Pop In row. */
+class MlvTableRow {
+    /** Identifies the row that carries the primary, interactive information. */
+    main = input(false, { ...(ngDevMode ? { debugName: "main" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /** Identifies the row that carries supporting, display-only information. */
+    secondary = input(false, { ...(ngDevMode ? { debugName: "secondary" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTableRow, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: MlvTableRow, isStandalone: true, selector: "tr[mlvTableRow]", inputs: { main: { classPropertyName: "main", publicName: "main", isSignal: true, isRequired: false, transformFunction: null }, secondary: { classPropertyName: "secondary", publicName: "secondary", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mlv-table__row--main": "main()", "class.mlv-table__row--secondary": "secondary()", "attr.data-mlv-table-row": "main() ? \"main\" : secondary() ? \"secondary\" : null" }, classAttribute: "mlv-table__row" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTableRow, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'tr[mlvTableRow]',
+                    host: {
+                        class: 'mlv-table__row',
+                        '[class.mlv-table__row--main]': 'main()',
+                        '[class.mlv-table__row--secondary]': 'secondary()',
+                        '[attr.data-mlv-table-row]': 'main() ? "main" : secondary() ? "secondary" : null',
+                    },
+                }]
+        }], propDecorators: { main: [{ type: i0.Input, args: [{ isSignal: true, alias: "main", required: false }] }], secondary: [{ type: i0.Input, args: [{ isSignal: true, alias: "secondary", required: false }] }] } });
+
+/** Marks a native table cell for Malva table spacing and responsive styles. */
+class MlvTableCell {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTableCell, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: MlvTableCell, isStandalone: true, selector: "[mlvTableCell]", host: { classAttribute: "mlv-table__cell" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvTableCell, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[mlvTableCell]',
+                    host: {
+                        class: 'mlv-table__cell',
+                    },
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { MlvTable, MlvTableCell, MlvTableRow };
+//# sourceMappingURL=malva-ui-core-table.mjs.map

package/fesm2022/malva-ui-core-table.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-table.mjs","sources":["../../../../libs/core/table/src/lib/table/table.ts","../../../../libs/core/table/src/lib/table/table.html","../../../../libs/core/table/src/lib/table/table-row.ts","../../../../libs/core/table/src/lib/table/table-cell.ts","../../../../libs/core/table/src/malva-ui-core-table.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  ViewEncapsulation,\n  input,\n} from '@angular/core';\nimport type { BooleanInput } from '@angular/cdk/coercion';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport {\n  MlvDensityDirective,\n  MLV_DENSITY_ELEMENT,\n} from '@malva-ui/cdk/density';\n\n/** The table surface that receives pointer hover feedback. */\nexport type MlvTableHoverable = false | 'row' | 'cell';\n\n@Component({\n  // Attribute-selector component — the host is the semantic native table.\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'table[mlvTable]',\n  templateUrl: './table.html',\n  styleUrl: './table.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [{ provide: MLV_DENSITY_ELEMENT, useValue: 'table' }],\n  hostDirectives: [\n    {\n      directive: MlvDensityDirective,\n      inputs: ['mlvDensity'],\n    },\n  ],\n  host: {\n    class: 'mlv-table',\n    '[class.mlv-table--bordered]': 'bordered()',\n    '[class.mlv-table--responsive]': 'responsive()',\n    '[class.mlv-table--pop-in]': 'popIn()',\n    '[class.mlv-table--hover-row]': 'hoverable() === \"row\"',\n    '[class.mlv-table--hover-cell]': 'hoverable() === \"cell\"',\n  },\n})\nexport class MlvTable {\n  /** Shows a cell grid and an outer table boundary. */\n  readonly bordered = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /** Enables horizontal overflow behavior for narrow viewports. */\n  readonly responsive = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /** Enables the mobile paired-row Pop In presentation. */\n  readonly popIn = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /** Chooses whether rows or individual cells receive hover feedback. */\n  readonly hoverable = input<MlvTableHoverable>(false);\n}\n","<ng-content />\n","import { Directive, input } from '@angular/core';\nimport type { BooleanInput } from '@angular/cdk/coercion';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\n\n/** Marks a native table row as the primary or supporting Pop In row. */\n@Directive({\n  selector: 'tr[mlvTableRow]',\n  host: {\n    class: 'mlv-table__row',\n    '[class.mlv-table__row--main]': 'main()',\n    '[class.mlv-table__row--secondary]': 'secondary()',\n    '[attr.data-mlv-table-row]':\n      'main() ? \"main\" : secondary() ? \"secondary\" : null',\n  },\n})\nexport class MlvTableRow {\n  /** Identifies the row that carries the primary, interactive information. */\n  readonly main = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /** Identifies the row that carries supporting, display-only information. */\n  readonly secondary = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n}\n","import { Directive } from '@angular/core';\n\n/** Marks a native table cell for Malva table spacing and responsive styles. */\n@Directive({\n  selector: '[mlvTableCell]',\n  host: {\n    class: 'mlv-table__cell',\n  },\n})\nexport class MlvTableCell {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}