@malva-ui/core 0.1.12

package/esm2022/progress/lib/progress/progress.js

@@ -0,0 +1,102 @@
+import { ChangeDetectionStrategy, Component, computed, inject, input, ViewEncapsulation, } from '@angular/core';
+import { toSignal } from '@angular/core/rxjs-interop';
+import { delay, of } from 'rxjs';
+import { coerceBooleanProperty, } from '@angular/cdk/coercion';
+import { MLV_PROGRESS_I18N } from '@malva-ui/i18n';
+import * as i0 from "@angular/core";
+export class MlvProgress {
+    /** Visual shape variant — `'bar'` for a horizontal track, `'circle'` for an SVG ring. */
+    shape = input('bar', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "shape" }] : /* istanbul ignore next */ []));
+    /**
+     * Current progress value between 0 and 100.
+     * Clamped to the `[0, 100]` range internally.
+     */
+    value = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Size variant controlling track height (bar) or diameter (circle). */
+    size = input('m', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Semantic tone applied to the fill element. */
+    tone = input('default', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tone" }] : /* istanbul ignore next */ []));
+    /**
+     * When `true`, displays the current value as a percentage text.
+     * Bar: appears above the track (right-aligned).
+     * Circle: appears centred inside the ring.
+     */
+    showPercentage = input(false, { ...(ngDevMode ? { debugName: "showPercentage" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    /** Custom aria-label override. Falls back to the i18n-provided label. */
+    ariaLabel = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /** @protected The component's i18n strings signal. */
+    _i18n = inject(MLV_PROGRESS_I18N);
+    /** @protected Resolved aria-label: explicit input takes precedence over i18n default. */
+    _resolvedAriaLabel = computed(() => this.ariaLabel() ?? this._i18n().progress, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_resolvedAriaLabel" }] : /* istanbul ignore next */ []));
+    /** @protected Progress clamped to [0, 100]. */
+    _clampedValue = computed(() => Math.max(0, Math.min(this.value(), 100)), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_clampedValue" }] : /* istanbul ignore next */ []));
+    /** @protected Formatted percentage text. */
+    _percentageText = computed(() => `${Math.round(this._clampedValue())}%`, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_percentageText" }] : /* istanbul ignore next */ []));
+    /**
+     * @protected Delays enabling the CSS fill transition by one tick so the browser
+     * has a defined starting state before the transition begins.
+     */
+    _progressVisible = toSignal(of(true).pipe(delay(0)));
+    /** @protected Computed circle SVG dimensions based on the size input. */
+    _circleDimensions = computed(() => {
+        const size = this.size();
+        // SVG internal coordinate space: 100×100 for all sizes
+        const svgSize = 100;
+        const strokeWidthMap = {
+            s: 10,
+            m: 8,
+            l: 7,
+        };
+        const sw = strokeWidthMap[size];
+        const center = svgSize / 2;
+        const radius = center - sw / 2;
+        const circumference = 2 * Math.PI * radius;
+        return {
+            viewBox: `0 0 ${svgSize} ${svgSize}`,
+            center,
+            radius,
+            circumference,
+            strokeWidth: sw,
+        };
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_circleDimensions" }] : /* istanbul ignore next */ []));
+    /** @protected The stroke-dashoffset for the circle fill, derived from clamped value. */
+    _strokeDashoffset = computed(() => {
+        const { circumference } = this._circleDimensions();
+        return circumference * (1 - this._clampedValue() / 100);
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_strokeDashoffset" }] : /* istanbul ignore next */ []));
+    /** @protected Host CSS class string. */
+    _hostClasses = computed(() => {
+        const classes = [
+            `mlv-progress--${this.shape()}`,
+            `mlv-progress--${this.size()}`,
+            `mlv-progress--${this.tone()}`,
+        ];
+        return classes.join(' ');
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_hostClasses" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: MlvProgress, isStandalone: true, selector: "mlv-progress", inputs: { shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, tone: { classPropertyName: "tone", publicName: "tone", isSignal: true, isRequired: false, transformFunction: null }, showPercentage: { classPropertyName: "showPercentage", publicName: "showPercentage", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "progressbar" }, properties: { "class": "_hostClasses()", "attr.aria-valuenow": "_clampedValue()", "attr.aria-valuemin": "0", "attr.aria-valuemax": "100", "attr.aria-label": "_resolvedAriaLabel()" }, classAttribute: "mlv-progress" }, ngImport: i0, template: "@if (shape() === 'bar') { @if (showPercentage()) {\n<span class=\"mlv-progress__percentage\" aria-hidden=\"true\"\n  >{{ _percentageText() }}</span\n>\n}\n<div class=\"mlv-progress__track\">\n  <div\n    class=\"mlv-progress__fill\"\n    [class.mlv-progress__fill--animated]=\"_progressVisible()\"\n    [style.width.%]=\"_clampedValue()\"\n  ></div>\n</div>\n<div class=\"mlv-progress__label\" aria-hidden=\"true\">\n  <ng-content />\n</div>\n} @else {\n<div class=\"mlv-progress__svg-wrapper\">\n  <svg\n    aria-hidden=\"true\"\n    class=\"mlv-progress__svg\"\n    [attr.viewBox]=\"_circleDimensions().viewBox\"\n    width=\"100%\"\n    height=\"100%\"\n  >\n    <circle\n      class=\"mlv-progress__circle-track\"\n      [attr.cx]=\"_circleDimensions().center\"\n      [attr.cy]=\"_circleDimensions().center\"\n      [attr.r]=\"_circleDimensions().radius\"\n      [attr.stroke-width]=\"_circleDimensions().strokeWidth\"\n    />\n    <circle\n      class=\"mlv-progress__circle-fill\"\n      [class.mlv-progress__circle-fill--animated]=\"_progressVisible()\"\n      [attr.cx]=\"_circleDimensions().center\"\n      [attr.cy]=\"_circleDimensions().center\"\n      [attr.r]=\"_circleDimensions().radius\"\n      [attr.stroke-width]=\"_circleDimensions().strokeWidth\"\n      [attr.stroke-dasharray]=\"_circleDimensions().circumference\"\n      [attr.stroke-dashoffset]=\"_strokeDashoffset()\"\n    />\n  </svg>\n  @if (showPercentage()) {\n  <span class=\"mlv-progress__percentage\" aria-hidden=\"true\"\n    >{{ _percentageText() }}</span\n  >\n  }\n</div>\n<div class=\"mlv-progress__label\" aria-hidden=\"true\">\n  <ng-content />\n</div>\n}\n", styles: [".mlv-progress{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-s)}.mlv-progress *{box-sizing:border-box}.mlv-progress{display:block;--mlv-p-color: var(--mlv-background-accent-1);--mlv-p-bar-height: .375rem;--mlv-p-diameter: 3rem;--mlv-p-font-size: var(--mlv-font-size-s)}.mlv-progress--default{--mlv-p-color: var(--mlv-background-accent-1)}.mlv-progress--success{--mlv-p-color: var(--mlv-palette-success-500)}.mlv-progress--warning{--mlv-p-color: var(--mlv-background-warning-1)}.mlv-progress--danger{--mlv-p-color: var(--mlv-background-danger-1)}.mlv-progress--info{--mlv-p-color: var(--mlv-palette-info-500)}.mlv-progress--s{--mlv-p-bar-height: .25rem;--mlv-p-diameter: 2rem;--mlv-p-font-size: var(--mlv-font-size-xs)}.mlv-progress--m{--mlv-p-bar-height: .375rem;--mlv-p-diameter: 3rem;--mlv-p-font-size: var(--mlv-font-size-s)}.mlv-progress--l{--mlv-p-bar-height: .5rem;--mlv-p-diameter: 4rem;--mlv-p-font-size: var(--mlv-font-size-m)}.mlv-progress--bar{display:flex;flex-direction:column;width:100%}.mlv-progress--bar .mlv-progress__percentage{display:block;align-self:flex-end;font-size:var(--mlv-p-font-size);font-weight:var(--mlv-font-weight-medium);color:var(--mlv-text-secondary);margin-bottom:.25rem;line-height:1}.mlv-progress--bar .mlv-progress__track{position:relative;width:100%;height:var(--mlv-p-bar-height);border-radius:var(--mlv-radius-full);background:var(--mlv-border-subtle);overflow:hidden}.mlv-progress--bar .mlv-progress__fill{position:absolute;inset-block:0;inset-inline-start:0;border-radius:inherit;background:var(--mlv-p-color)}.mlv-progress--bar .mlv-progress__fill--animated{transition:width var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-progress--bar .mlv-progress__label{display:block;margin-top:.25rem;font-size:var(--mlv-font-size-xs);color:var(--mlv-text-secondary)}.mlv-progress--bar .mlv-progress__label:empty{display:none}.mlv-progress--circle{display:inline-flex;flex-direction:column;align-items:center;gap:.5rem}.mlv-progress--circle .mlv-progress__svg-wrapper{position:relative;inline-size:var(--mlv-p-diameter);block-size:var(--mlv-p-diameter);flex-shrink:0}.mlv-progress--circle .mlv-progress__svg{display:block;overflow:visible;shape-rendering:geometricPrecision}.mlv-progress--circle .mlv-progress__circle-track{fill:transparent;stroke:var(--mlv-border-subtle);stroke-linecap:round}.mlv-progress--circle .mlv-progress__circle-fill{fill:transparent;stroke:var(--mlv-p-color);stroke-linecap:round;transform-box:fill-box;transform-origin:center;transform:rotate(-90deg)}.mlv-progress--circle .mlv-progress__circle-fill--animated{transition:stroke-dashoffset var(--mlv-duration-normal) var(--mlv-ease-default),stroke var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-progress--circle .mlv-progress__percentage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:var(--mlv-p-font-size);font-weight:var(--mlv-font-weight-medium);color:var(--mlv-text-secondary);line-height:1;pointer-events:none}.mlv-progress--circle .mlv-progress__label{font-size:var(--mlv-font-size-xs);color:var(--mlv-text-secondary);text-align:center}.mlv-progress--circle .mlv-progress__label:empty{display:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvProgress, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-progress', imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'mlv-progress',
+                        '[class]': '_hostClasses()',
+                        role: 'progressbar',
+                        '[attr.aria-valuenow]': '_clampedValue()',
+                        '[attr.aria-valuemin]': '0',
+                        '[attr.aria-valuemax]': '100',
+                        '[attr.aria-label]': '_resolvedAriaLabel()',
+                    }, template: "@if (shape() === 'bar') { @if (showPercentage()) {\n<span class=\"mlv-progress__percentage\" aria-hidden=\"true\"\n  >{{ _percentageText() }}</span\n>\n}\n<div class=\"mlv-progress__track\">\n  <div\n    class=\"mlv-progress__fill\"\n    [class.mlv-progress__fill--animated]=\"_progressVisible()\"\n    [style.width.%]=\"_clampedValue()\"\n  ></div>\n</div>\n<div class=\"mlv-progress__label\" aria-hidden=\"true\">\n  <ng-content />\n</div>\n} @else {\n<div class=\"mlv-progress__svg-wrapper\">\n  <svg\n    aria-hidden=\"true\"\n    class=\"mlv-progress__svg\"\n    [attr.viewBox]=\"_circleDimensions().viewBox\"\n    width=\"100%\"\n    height=\"100%\"\n  >\n    <circle\n      class=\"mlv-progress__circle-track\"\n      [attr.cx]=\"_circleDimensions().center\"\n      [attr.cy]=\"_circleDimensions().center\"\n      [attr.r]=\"_circleDimensions().radius\"\n      [attr.stroke-width]=\"_circleDimensions().strokeWidth\"\n    />\n    <circle\n      class=\"mlv-progress__circle-fill\"\n      [class.mlv-progress__circle-fill--animated]=\"_progressVisible()\"\n      [attr.cx]=\"_circleDimensions().center\"\n      [attr.cy]=\"_circleDimensions().center\"\n      [attr.r]=\"_circleDimensions().radius\"\n      [attr.stroke-width]=\"_circleDimensions().strokeWidth\"\n      [attr.stroke-dasharray]=\"_circleDimensions().circumference\"\n      [attr.stroke-dashoffset]=\"_strokeDashoffset()\"\n    />\n  </svg>\n  @if (showPercentage()) {\n  <span class=\"mlv-progress__percentage\" aria-hidden=\"true\"\n    >{{ _percentageText() }}</span\n  >\n  }\n</div>\n<div class=\"mlv-progress__label\" aria-hidden=\"true\">\n  <ng-content />\n</div>\n}\n", styles: [".mlv-progress{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-s)}.mlv-progress *{box-sizing:border-box}.mlv-progress{display:block;--mlv-p-color: var(--mlv-background-accent-1);--mlv-p-bar-height: .375rem;--mlv-p-diameter: 3rem;--mlv-p-font-size: var(--mlv-font-size-s)}.mlv-progress--default{--mlv-p-color: var(--mlv-background-accent-1)}.mlv-progress--success{--mlv-p-color: var(--mlv-palette-success-500)}.mlv-progress--warning{--mlv-p-color: var(--mlv-background-warning-1)}.mlv-progress--danger{--mlv-p-color: var(--mlv-background-danger-1)}.mlv-progress--info{--mlv-p-color: var(--mlv-palette-info-500)}.mlv-progress--s{--mlv-p-bar-height: .25rem;--mlv-p-diameter: 2rem;--mlv-p-font-size: var(--mlv-font-size-xs)}.mlv-progress--m{--mlv-p-bar-height: .375rem;--mlv-p-diameter: 3rem;--mlv-p-font-size: var(--mlv-font-size-s)}.mlv-progress--l{--mlv-p-bar-height: .5rem;--mlv-p-diameter: 4rem;--mlv-p-font-size: var(--mlv-font-size-m)}.mlv-progress--bar{display:flex;flex-direction:column;width:100%}.mlv-progress--bar .mlv-progress__percentage{display:block;align-self:flex-end;font-size:var(--mlv-p-font-size);font-weight:var(--mlv-font-weight-medium);color:var(--mlv-text-secondary);margin-bottom:.25rem;line-height:1}.mlv-progress--bar .mlv-progress__track{position:relative;width:100%;height:var(--mlv-p-bar-height);border-radius:var(--mlv-radius-full);background:var(--mlv-border-subtle);overflow:hidden}.mlv-progress--bar .mlv-progress__fill{position:absolute;inset-block:0;inset-inline-start:0;border-radius:inherit;background:var(--mlv-p-color)}.mlv-progress--bar .mlv-progress__fill--animated{transition:width var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-progress--bar .mlv-progress__label{display:block;margin-top:.25rem;font-size:var(--mlv-font-size-xs);color:var(--mlv-text-secondary)}.mlv-progress--bar .mlv-progress__label:empty{display:none}.mlv-progress--circle{display:inline-flex;flex-direction:column;align-items:center;gap:.5rem}.mlv-progress--circle .mlv-progress__svg-wrapper{position:relative;inline-size:var(--mlv-p-diameter);block-size:var(--mlv-p-diameter);flex-shrink:0}.mlv-progress--circle .mlv-progress__svg{display:block;overflow:visible;shape-rendering:geometricPrecision}.mlv-progress--circle .mlv-progress__circle-track{fill:transparent;stroke:var(--mlv-border-subtle);stroke-linecap:round}.mlv-progress--circle .mlv-progress__circle-fill{fill:transparent;stroke:var(--mlv-p-color);stroke-linecap:round;transform-box:fill-box;transform-origin:center;transform:rotate(-90deg)}.mlv-progress--circle .mlv-progress__circle-fill--animated{transition:stroke-dashoffset var(--mlv-duration-normal) var(--mlv-ease-default),stroke var(--mlv-duration-normal) var(--mlv-ease-default)}.mlv-progress--circle .mlv-progress__percentage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:var(--mlv-p-font-size);font-weight:var(--mlv-font-weight-medium);color:var(--mlv-text-secondary);line-height:1;pointer-events:none}.mlv-progress--circle .mlv-progress__label{font-size:var(--mlv-font-size-xs);color:var(--mlv-text-secondary);text-align:center}.mlv-progress--circle .mlv-progress__label:empty{display:none}\n"] }]
+        }], propDecorators: { shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], tone: [{ type: i0.Input, args: [{ isSignal: true, alias: "tone", required: false }] }], showPercentage: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPercentage", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
+//# sourceMappingURL=progress.js.map

package/esm2022/progress/lib/progress/progress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress.js","sourceRoot":"","sources":["../../../../../../../libs/core/progress/src/lib/progress/progress.ts","../../../../../../../libs/core/progress/src/lib/progress/progress.html"],"names":[],"mappings":"AAAA,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,QAAQ,EACR,MAAM,EACN,KAAK,EACL,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AACtD,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,MAAM,CAAC;AACjC,OAAO,EAEL,qBAAqB,GACtB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;;AA+CnD,MAAM,OAAO,WAAW;IACtB,yFAAyF;IAChF,KAAK,GAAG,KAAK,CAAmB,KAAK;8EAAC,CAAC;IAEhD;;;OAGG;IACM,KAAK,GAAG,KAAK,CAAC,QAAQ;8EAAU,CAAC;IAE1C,wEAAwE;IAC/D,IAAI,GAAG,KAAK,CAAkB,GAAG;6EAAC,CAAC;IAE5C,iDAAiD;IACxC,IAAI,GAAG,KAAK,CAAkB,SAAS;6EAAC,CAAC;IAElD;;;;OAIG;IACM,cAAc,GAAG,KAAK,CAAwB,KAAK,sFAC1D,SAAS,EAAE,qBAAqB,GAChC,CAAC;IAEH,yEAAyE;IAChE,SAAS,GAAG,KAAK,CAAqB,SAAS;kFAAC,CAAC;IAE1D,sDAAsD;IACnC,KAAK,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC;IAErD,yFAAyF;IACtE,kBAAkB,GAAG,QAAQ,CAC9C,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC,QAAQ;2FAChD,CAAC;IAEF,+CAA+C;IAC5B,aAAa,GAAG,QAAQ,CAAC,GAAG,EAAE,CAC/C,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,EAAE,GAAG,CAAC,CAAC;sFACzC,CAAC;IAEF,4CAA4C;IACzB,eAAe,GAAG,QAAQ,CAC3C,GAAG,EAAE,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,GAAG;wFAC7C,CAAC;IAEF;;;OAGG;IACgB,gBAAgB,GAAG,QAAQ,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAExE,yEAAyE;IACtD,iBAAiB,GAAG,QAAQ,CAAmB,GAAG,EAAE;QACrE,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC;QACzB,uDAAuD;QACvD,MAAM,OAAO,GAAG,GAAG,CAAC;QACpB,MAAM,cAAc,GAAoC;YACtD,CAAC,EAAE,EAAE;YACL,CAAC,EAAE,CAAC;YACJ,CAAC,EAAE,CAAC;SACL,CAAC;QACF,MAAM,EAAE,GAAG,cAAc,CAAC,IAAI,CAAC,CAAC;QAChC,MAAM,MAAM,GAAG,OAAO,GAAG,CAAC,CAAC;QAC3B,MAAM,MAAM,GAAG,MAAM,GAAG,EAAE,GAAG,CAAC,CAAC;QAC/B,MAAM,aAAa,GAAG,CAAC,GAAG,IAAI,CAAC,EAAE,GAAG,MAAM,CAAC;QAC3C,OAAO;YACL,OAAO,EAAE,OAAO,OAAO,IAAI,OAAO,EAAE;YACpC,MAAM;YACN,MAAM;YACN,aAAa;YACb,WAAW,EAAE,EAAE;SAChB,CAAC;IACJ,CAAC;0FAAC,CAAC;IAEH,wFAAwF;IACrE,iBAAiB,GAAG,QAAQ,CAAC,GAAG,EAAE;QACnD,MAAM,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACnD,OAAO,aAAa,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,aAAa,EAAE,GAAG,GAAG,CAAC,CAAC;IAC1D,CAAC;0FAAC,CAAC;IAEH,wCAAwC;IACrB,YAAY,GAAG,QAAQ,CAAC,GAAG,EAAE;QAC9C,MAAM,OAAO,GAAG;YACd,iBAAiB,IAAI,CAAC,KAAK,EAAE,EAAE;YAC/B,iBAAiB,IAAI,CAAC,IAAI,EAAE,EAAE;YAC9B,iBAAiB,IAAI,CAAC,IAAI,EAAE,EAAE;SAC/B,CAAC;QACF,OAAO,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC3B,CAAC;qFAAC,CAAC;uGAzFQ,WAAW;2FAAX,WAAW,4kCC7DxB,gnDAoDA;;2FDSa,WAAW;kBAjBvB,SAAS;+BACE,cAAc,WACf,EAAE,iBAGI,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM,QACzC;wBACJ,KAAK,EAAE,cAAc;wBACrB,SAAS,EAAE,gBAAgB;wBAC3B,IAAI,EAAE,aAAa;wBACnB,sBAAsB,EAAE,iBAAiB;wBACzC,sBAAsB,EAAE,GAAG;wBAC3B,sBAAsB,EAAE,KAAK;wBAC7B,mBAAmB,EAAE,sBAAsB;qBAC5C","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  inject,\n  input,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { toSignal } from '@angular/core/rxjs-interop';\nimport { delay, of } from 'rxjs';\nimport {\n  type BooleanInput,\n  coerceBooleanProperty,\n} from '@angular/cdk/coercion';\nimport { MLV_PROGRESS_I18N } from '@malva-ui/i18n';\nimport type { MlvTone } from '@malva-ui/cdk/utils';\n\n/**\n * Semantic tone for the progress component. Extends the shared {@link MlvTone}\n * vocabulary (`'info' | 'success' | 'warning' | 'danger'`) with a neutral\n * `'default'`.\n */\nexport type MlvProgressTone = MlvTone | 'default';\n\n/** Visual shape of the progress component. */\nexport type MlvProgressShape = 'bar' | 'circle';\n\n/** Size variant of the progress component. */\nexport type MlvProgressSize = 's' | 'm' | 'l';\n\n/** SVG dimensions used for the circle variant. */\ninterface CircleDimensions {\n  /** SVG viewBox string. */\n  viewBox: string;\n  /** Circle center X/Y coordinate. */\n  center: number;\n  /** Circle radius. */\n  radius: number;\n  /** Full stroke circumference. */\n  circumference: number;\n  /** Stroke width in viewBox units. */\n  strokeWidth: number;\n}\n\n@Component({\n  selector: 'mlv-progress',\n  imports: [],\n  templateUrl: './progress.html',\n  styleUrl: './progress.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'mlv-progress',\n    '[class]': '_hostClasses()',\n    role: 'progressbar',\n    '[attr.aria-valuenow]': '_clampedValue()',\n    '[attr.aria-valuemin]': '0',\n    '[attr.aria-valuemax]': '100',\n    '[attr.aria-label]': '_resolvedAriaLabel()',\n  },\n})\nexport class MlvProgress {\n  /** Visual shape variant — `'bar'` for a horizontal track, `'circle'` for an SVG ring. */\n  readonly shape = input<MlvProgressShape>('bar');\n\n  /**\n   * Current progress value between 0 and 100.\n   * Clamped to the `[0, 100]` range internally.\n   */\n  readonly value = input.required<number>();\n\n  /** Size variant controlling track height (bar) or diameter (circle). */\n  readonly size = input<MlvProgressSize>('m');\n\n  /** Semantic tone applied to the fill element. */\n  readonly tone = input<MlvProgressTone>('default');\n\n  /**\n   * When `true`, displays the current value as a percentage text.\n   * Bar: appears above the track (right-aligned).\n   * Circle: appears centred inside the ring.\n   */\n  readonly showPercentage = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n\n  /** Custom aria-label override. Falls back to the i18n-provided label. */\n  readonly ariaLabel = input<string | undefined>(undefined);\n\n  /** @protected The component's i18n strings signal. */\n  protected readonly _i18n = inject(MLV_PROGRESS_I18N);\n\n  /** @protected Resolved aria-label: explicit input takes precedence over i18n default. */\n  protected readonly _resolvedAriaLabel = computed(\n    () => this.ariaLabel() ?? this._i18n().progress,\n  );\n\n  /** @protected Progress clamped to [0, 100]. */\n  protected readonly _clampedValue = computed(() =>\n    Math.max(0, Math.min(this.value(), 100)),\n  );\n\n  /** @protected Formatted percentage text. */\n  protected readonly _percentageText = computed(\n    () => `${Math.round(this._clampedValue())}%`,\n  );\n\n  /**\n   * @protected Delays enabling the CSS fill transition by one tick so the browser\n   * has a defined starting state before the transition begins.\n   */\n  protected readonly _progressVisible = toSignal(of(true).pipe(delay(0)));\n\n  /** @protected Computed circle SVG dimensions based on the size input. */\n  protected readonly _circleDimensions = computed<CircleDimensions>(() => {\n    const size = this.size();\n    // SVG internal coordinate space: 100×100 for all sizes\n    const svgSize = 100;\n    const strokeWidthMap: Record<MlvProgressSize, number> = {\n      s: 10,\n      m: 8,\n      l: 7,\n    };\n    const sw = strokeWidthMap[size];\n    const center = svgSize / 2;\n    const radius = center - sw / 2;\n    const circumference = 2 * Math.PI * radius;\n    return {\n      viewBox: `0 0 ${svgSize} ${svgSize}`,\n      center,\n      radius,\n      circumference,\n      strokeWidth: sw,\n    };\n  });\n\n  /** @protected The stroke-dashoffset for the circle fill, derived from clamped value. */\n  protected readonly _strokeDashoffset = computed(() => {\n    const { circumference } = this._circleDimensions();\n    return circumference * (1 - this._clampedValue() / 100);\n  });\n\n  /** @protected Host CSS class string. */\n  protected readonly _hostClasses = computed(() => {\n    const classes = [\n      `mlv-progress--${this.shape()}`,\n      `mlv-progress--${this.size()}`,\n      `mlv-progress--${this.tone()}`,\n    ];\n    return classes.join(' ');\n  });\n}\n","@if (shape() === 'bar') { @if (showPercentage()) {\n<span class=\"mlv-progress__percentage\" aria-hidden=\"true\"\n  >{{ _percentageText() }}</span\n>\n}\n<div class=\"mlv-progress__track\">\n  <div\n    class=\"mlv-progress__fill\"\n    [class.mlv-progress__fill--animated]=\"_progressVisible()\"\n    [style.width.%]=\"_clampedValue()\"\n  ></div>\n</div>\n<div class=\"mlv-progress__label\" aria-hidden=\"true\">\n  <ng-content />\n</div>\n} @else {\n<div class=\"mlv-progress__svg-wrapper\">\n  <svg\n    aria-hidden=\"true\"\n    class=\"mlv-progress__svg\"\n    [attr.viewBox]=\"_circleDimensions().viewBox\"\n    width=\"100%\"\n    height=\"100%\"\n  >\n    <circle\n      class=\"mlv-progress__circle-track\"\n      [attr.cx]=\"_circleDimensions().center\"\n      [attr.cy]=\"_circleDimensions().center\"\n      [attr.r]=\"_circleDimensions().radius\"\n      [attr.stroke-width]=\"_circleDimensions().strokeWidth\"\n    />\n    <circle\n      class=\"mlv-progress__circle-fill\"\n      [class.mlv-progress__circle-fill--animated]=\"_progressVisible()\"\n      [attr.cx]=\"_circleDimensions().center\"\n      [attr.cy]=\"_circleDimensions().center\"\n      [attr.r]=\"_circleDimensions().radius\"\n      [attr.stroke-width]=\"_circleDimensions().strokeWidth\"\n      [attr.stroke-dasharray]=\"_circleDimensions().circumference\"\n      [attr.stroke-dashoffset]=\"_strokeDashoffset()\"\n    />\n  </svg>\n  @if (showPercentage()) {\n  <span class=\"mlv-progress__percentage\" aria-hidden=\"true\"\n    >{{ _percentageText() }}</span\n  >\n  }\n</div>\n<div class=\"mlv-progress__label\" aria-hidden=\"true\">\n  <ng-content />\n</div>\n}\n"]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-progress.js","sourceRoot":"","sources":["../../../../../libs/core/progress/src/malva-ui-core-progress.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/radio/index.js

@@ -0,0 +1,3 @@
+export * from './lib/radio/radio';
+export * from './lib/radio-group/radio-group';
+//# sourceMappingURL=index.js.map

package/esm2022/radio/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/core/radio/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,cAAc,+BAA+B,CAAC","sourcesContent":["export * from './lib/radio/radio';\nexport * from './lib/radio-group/radio-group';\n"]}

package/esm2022/radio/lib/radio/radio.js

@@ -0,0 +1,134 @@
+import { ChangeDetectionStrategy, Component, computed, ElementRef, HostAttributeToken, inject, input, Renderer2, signal, viewChild, ViewEncapsulation, } from '@angular/core';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import { RADIO_GROUP } from '../radio-group-token';
+import * as i0 from "@angular/core";
+export class MlvRadio {
+    /** @private Optional parent radio group accessor injected via `RADIO_GROUP`. */
+    _group = inject(RADIO_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-radio>`
+     * 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 type="radio">` instead (see the constructor).
+     */
+    _hostAriaLabel = inject(new HostAttributeToken('aria-label'), { optional: true });
+    /**
+     * @private The `aria-labelledby` a consumer placed directly on the
+     * `<mlv-radio>` 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 });
+    /**
+     * Accessible name applied to the inner native input (`aria-label`). Use this
+     * input (not a host `[attr.aria-label]` binding) when the label is dynamic —
+     * the role-less host must not carry ARIA naming attributes
+     * (axe `aria-prohibited-attr`). A static host `aria-label` attribute is also
+     * supported and forwarded automatically (see the constructor); this input
+     * takes precedence when both are present.
+     */
+    ariaLabel = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    /**
+     * Id reference(s) naming the inner native input (`aria-labelledby`). Same
+     * rationale and precedence as {@link ariaLabel}.
+     */
+    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 (and any group-provided naming is left
+     * untouched).
+     */
+    _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() {
+        // A host `aria-label`/`aria-labelledby` lands on the role-less custom
+        // element (axe `aria-prohibited-attr`). Move it onto the inner input — the
+        // component's real accessible-name target — and strip it from the host. The
+        // signals stay `null` when nothing was supplied, so the `[attr.*]` bindings
+        // omit the attribute and never clobber a group-provided labelling mechanism.
+        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');
+        }
+    }
+    value = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    checked = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
+    name = signal('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
+    /**
+     * Roving tabindex applied to the native `<input type="radio">` — the single
+     * focus target. `0` for the tabbable radio, `-1` for the rest. Managed by
+     * `MlvRadioGroup`.
+     */
+    tabIndex = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tabIndex" }] : /* istanbul ignore next */ []));
+    /**
+     * @private Reference to the visually-hidden native radio input, which is the
+     * focus target (kept in the a11y tree via the clip-path pattern so native
+     * radio semantics — Space selection, grouping — are preserved).
+     */
+    _nativeInput = viewChild.required('nativeInput', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_nativeInput" }] : /* istanbul ignore next */ []));
+    /**
+     * Moves focus to the native radio input. Satisfies CDK `FocusableOption` so
+     * the group's `FocusKeyManager` focuses the input rather than the host.
+     */
+    focus() {
+        this._nativeInput().nativeElement.focus();
+    }
+    /** @internal Notifies the parent group when the native input gains focus. */
+    onFocus() {
+        this._group?.onChildFocus(this);
+    }
+    /** @internal Handles native selection (click, Space, native arrow keys). */
+    onSelect() {
+        if (this.disabled())
+            return;
+        this._group?.selectRadio(this);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvRadio, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.7", type: MlvRadio, isStandalone: true, selector: "mlv-radio", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.mlv-radio--checked": "checked()", "class.mlv-radio--disabled": "disabled()" }, classAttribute: "mlv-radio" }, viewQueries: [{ propertyName: "_nativeInput", first: true, predicate: ["nativeInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<label class=\"mlv-radio__label\">\n  <input\n    #nativeInput\n    type=\"radio\"\n    class=\"mlv-radio__native\"\n    [name]=\"name()\"\n    [checked]=\"checked()\"\n    [disabled]=\"disabled()\"\n    [attr.tabindex]=\"tabIndex()\"\n    [attr.aria-checked]=\"checked()\"\n    [attr.aria-label]=\"_resolvedAriaLabel()\"\n    [attr.aria-labelledby]=\"_resolvedAriaLabelledBy()\"\n    (change)=\"onSelect()\"\n    (focus)=\"onFocus()\"\n  />\n  <span class=\"mlv-radio__visual\"></span>\n  <span class=\"mlv-radio__text\">\n    <ng-content />\n  </span>\n</label>\n", styles: [".mlv-radio{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-radio *{box-sizing:border-box}.mlv-radio{color:var(--mlv-text-primary);--mlv-radio-border: var(--mlv-border-normal);--mlv-radio-bg: var(--mlv-background-accent-1);--mlv-radio-opacity: 0;--mlv-radio-transform: scale(.5);outline:none}.mlv-radio__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-radio__native:focus-visible+.mlv-radio__visual{outline:var(--mlv-stroke-width) solid var(--mlv-border-focus);outline-offset:.125rem;--mlv-radio-border: var(--mlv-border-focus)}.mlv-radio__label{display:inline-flex;align-items:center;gap:.25rem;cursor:pointer}.mlv-radio__visual{display:block;width:1.25rem;height:1.25rem;border-radius:100%;border:.0625rem solid var(--mlv-radio-border);transition:border-color var(--mlv-duration-normal) var(--mlv-ease-default);position:relative}.mlv-radio__visual:before{content:\"\";width:.75rem;height:.75rem;top:.1875rem;left:.1875rem;position:absolute;background:var(--mlv-radio-bg);border-radius:100%;opacity:var(--mlv-radio-opacity);transform:var(--mlv-radio-transform);transition-property:background-color,border-color,transform;transition-duration:var(--mlv-duration-normal);transition-timing-function:var(--mlv-ease-default)}.mlv-radio--checked{--mlv-radio-opacity: 1;--mlv-radio-transform: scale(1)}.mlv-radio--disabled{cursor:not-allowed;pointer-events:none;opacity:var(--mlv-disabled-opacity)}.mlv-radio:not(:focus) .mlv-radio__label:hover{--mlv-radio-border: var(--mlv-border-strong);--mlv-radio-bg: var(--mlv-background-accent-1-hover)}@media(prefers-reduced-motion:reduce){.mlv-radio,.mlv-radio *,.mlv-radio:before,.mlv-radio:after,[class^=mlv-radio__],[class*=\" mlv-radio__\"],[class^=mlv-radio--],[class*=\" mlv-radio--\"]{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: MlvRadio, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-radio', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'mlv-radio',
+                        '[class.mlv-radio--checked]': 'checked()',
+                        '[class.mlv-radio--disabled]': 'disabled()',
+                    }, template: "<label class=\"mlv-radio__label\">\n  <input\n    #nativeInput\n    type=\"radio\"\n    class=\"mlv-radio__native\"\n    [name]=\"name()\"\n    [checked]=\"checked()\"\n    [disabled]=\"disabled()\"\n    [attr.tabindex]=\"tabIndex()\"\n    [attr.aria-checked]=\"checked()\"\n    [attr.aria-label]=\"_resolvedAriaLabel()\"\n    [attr.aria-labelledby]=\"_resolvedAriaLabelledBy()\"\n    (change)=\"onSelect()\"\n    (focus)=\"onFocus()\"\n  />\n  <span class=\"mlv-radio__visual\"></span>\n  <span class=\"mlv-radio__text\">\n    <ng-content />\n  </span>\n</label>\n", styles: [".mlv-radio{box-sizing:border-box;padding:0;margin:0;font-family:var(--mlv-typography-family-text);font-size:var(--mlv-font-size-m)}.mlv-radio *{box-sizing:border-box}.mlv-radio{color:var(--mlv-text-primary);--mlv-radio-border: var(--mlv-border-normal);--mlv-radio-bg: var(--mlv-background-accent-1);--mlv-radio-opacity: 0;--mlv-radio-transform: scale(.5);outline:none}.mlv-radio__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-radio__native:focus-visible+.mlv-radio__visual{outline:var(--mlv-stroke-width) solid var(--mlv-border-focus);outline-offset:.125rem;--mlv-radio-border: var(--mlv-border-focus)}.mlv-radio__label{display:inline-flex;align-items:center;gap:.25rem;cursor:pointer}.mlv-radio__visual{display:block;width:1.25rem;height:1.25rem;border-radius:100%;border:.0625rem solid var(--mlv-radio-border);transition:border-color var(--mlv-duration-normal) var(--mlv-ease-default);position:relative}.mlv-radio__visual:before{content:\"\";width:.75rem;height:.75rem;top:.1875rem;left:.1875rem;position:absolute;background:var(--mlv-radio-bg);border-radius:100%;opacity:var(--mlv-radio-opacity);transform:var(--mlv-radio-transform);transition-property:background-color,border-color,transform;transition-duration:var(--mlv-duration-normal);transition-timing-function:var(--mlv-ease-default)}.mlv-radio--checked{--mlv-radio-opacity: 1;--mlv-radio-transform: scale(1)}.mlv-radio--disabled{cursor:not-allowed;pointer-events:none;opacity:var(--mlv-disabled-opacity)}.mlv-radio:not(:focus) .mlv-radio__label:hover{--mlv-radio-border: var(--mlv-border-strong);--mlv-radio-bg: var(--mlv-background-accent-1-hover)}@media(prefers-reduced-motion:reduce){.mlv-radio,.mlv-radio *,.mlv-radio:before,.mlv-radio:after,[class^=mlv-radio__],[class*=\" mlv-radio__\"],[class^=mlv-radio--],[class*=\" mlv-radio--\"]{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:var(--mlv-duration-instant)!important}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaLabelledBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledBy", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], _nativeInput: [{ type: i0.ViewChild, args: ['nativeInput', { isSignal: true }] }] } });
+//# sourceMappingURL=radio.js.map

package/esm2022/radio/lib/radio/radio.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio.js","sourceRoot":"","sources":["../../../../../../../libs/core/radio/src/lib/radio/radio.ts","../../../../../../../libs/core/radio/src/lib/radio/radio.html"],"names":[],"mappings":"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","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  ElementRef,\n  HostAttributeToken,\n  inject,\n  input,\n  Renderer2,\n  signal,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport type { BooleanInput } from '@angular/cdk/coercion';\nimport { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport type { MlvRadioGroupAccessor } from '../radio-group-token';\nimport { RADIO_GROUP } from '../radio-group-token';\n\n@Component({\n  selector: 'mlv-radio',\n  templateUrl: './radio.html',\n  styleUrl: './radio.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'mlv-radio',\n    '[class.mlv-radio--checked]': 'checked()',\n    '[class.mlv-radio--disabled]': 'disabled()',\n  },\n})\nexport class MlvRadio {\n  /** @private Optional parent radio group accessor injected via `RADIO_GROUP`. */\n  private readonly _group = inject<MlvRadioGroupAccessor>(RADIO_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-radio>`\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 type=\"radio\">` 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-radio>` 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   * Accessible name applied to the inner native input (`aria-label`). Use this\n   * input (not a host `[attr.aria-label]` binding) when the label is dynamic —\n   * the role-less host must not carry ARIA naming attributes\n   * (axe `aria-prohibited-attr`). A static host `aria-label` attribute is also\n   * supported and forwarded automatically (see the constructor); this input\n   * takes precedence when both are present.\n   */\n  readonly ariaLabel = input<string | undefined>(undefined);\n\n  /**\n   * Id reference(s) naming the inner native input (`aria-labelledby`). Same\n   * rationale and precedence as {@link ariaLabel}.\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 (and any group-provided naming is left\n   * untouched).\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    // A host `aria-label`/`aria-labelledby` lands on the role-less custom\n    // element (axe `aria-prohibited-attr`). Move it onto the inner input — the\n    // component's real accessible-name target — and strip it from the host. The\n    // signals stay `null` when nothing was supplied, so the `[attr.*]` bindings\n    // omit the attribute and never clobber a group-provided labelling mechanism.\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\n  readonly value = input<unknown>();\n  readonly disabled = input<boolean, BooleanInput>(false, {\n    transform: coerceBooleanProperty,\n  });\n  readonly checked = signal(false);\n  readonly name = signal('');\n\n  /**\n   * Roving tabindex applied to the native `<input type=\"radio\">` — the single\n   * focus target. `0` for the tabbable radio, `-1` for the rest. Managed by\n   * `MlvRadioGroup`.\n   */\n  readonly tabIndex = signal(0);\n\n  /**\n   * @private Reference to the visually-hidden native radio input, which is the\n   * focus target (kept in the a11y tree via the clip-path pattern so native\n   * radio semantics — Space selection, grouping — are preserved).\n   */\n  private readonly _nativeInput =\n    viewChild.required<ElementRef<HTMLInputElement>>('nativeInput');\n\n  /**\n   * Moves focus to the native radio input. Satisfies CDK `FocusableOption` so\n   * the group's `FocusKeyManager` focuses the input rather than 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  /** @internal Handles native selection (click, Space, native arrow keys). */\n  onSelect(): void {\n    if (this.disabled()) return;\n    this._group?.selectRadio(this);\n  }\n}\n","<label class=\"mlv-radio__label\">\n  <input\n    #nativeInput\n    type=\"radio\"\n    class=\"mlv-radio__native\"\n    [name]=\"name()\"\n    [checked]=\"checked()\"\n    [disabled]=\"disabled()\"\n    [attr.tabindex]=\"tabIndex()\"\n    [attr.aria-checked]=\"checked()\"\n    [attr.aria-label]=\"_resolvedAriaLabel()\"\n    [attr.aria-labelledby]=\"_resolvedAriaLabelledBy()\"\n    (change)=\"onSelect()\"\n    (focus)=\"onFocus()\"\n  />\n  <span class=\"mlv-radio__visual\"></span>\n  <span class=\"mlv-radio__text\">\n    <ng-content />\n  </span>\n</label>\n"]}

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

@@ -0,0 +1,176 @@
+import { ChangeDetectionStrategy, Component, contentChildren, DestroyRef, effect, forwardRef, inject, input, model, untracked, ViewEncapsulation, computed, } from '@angular/core';
+import { FocusKeyManager } from '@angular/cdk/a11y';
+import { MlvRadio } from '../radio/radio';
+import { RADIO_GROUP } from '../radio-group-token';
+import { MlvDescription, MlvLabel, MlvMessage, MLV_FORM_CONTROL, MlvSignalFormControlBase, } from '@malva-ui/core/form-utils';
+import { mlvNextId } from '@malva-ui/cdk/utils';
+import * as i0 from "@angular/core";
+export class MlvRadioGroup extends MlvSignalFormControlBase {
+    /** Two-way bindable selected value of the group. */
+    value = model(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
+    /** Shared `name` applied to the native radio inputs in the group. */
+    name = input(mlvNextId('mlv-radio-group'), { ...(ngDevMode ? { debugName: "name" } : /* istanbul ignore next */ {}), transform: (value) => value ?? mlvNextId('mlv-radio-group') });
+    radios = contentChildren(MlvRadio, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "radios" }] : /* istanbul ignore next */ []));
+    /** @private FocusKeyManager driving roving focus + arrow-key navigation across the radios. */
+    _keyManager;
+    constructor() {
+        super();
+        inject(DestroyRef).onDestroy(() => this._keyManager?.destroy());
+        effect(() => {
+            const items = [...this.radios()];
+            const groupName = this.name();
+            if (items.length === 0)
+                return;
+            this._keyManager?.destroy();
+            this._keyManager = new FocusKeyManager(items)
+                .skipPredicate((radio) => radio.disabled())
+                .withVerticalOrientation()
+                .withWrap();
+            items.forEach((radio) => radio.name.set(groupName));
+            untracked(() => this._updateSelection());
+        });
+        effect(() => {
+            this.value();
+            untracked(() => this._updateSelection());
+        });
+    }
+    onChildFocus(radio) {
+        const index = this.radios().indexOf(radio);
+        if (index >= 0) {
+            this._keyManager.setActiveItem(index);
+        }
+    }
+    /**
+     * @protected Host keydown handler. Handles all four arrow keys for WAI-ARIA
+     * radiogroup semantics, moving focus + selection via the FocusKeyManager.
+     */
+    _onKeydown(event) {
+        const key = event.key;
+        const isPrev = key === 'ArrowUp' || key === 'ArrowLeft';
+        const isNext = key === 'ArrowDown' || key === 'ArrowRight';
+        if (!isPrev && !isNext)
+            return;
+        // Handle all four arrows for WAI-ARIA radiogroup semantics and suppress the
+        // native radio-group navigation so focus + selection stay in sync with the
+        // FocusKeyManager (which skips disabled radios and wraps).
+        event.preventDefault();
+        if (!this._keyManager.activeItem) {
+            this._keyManager.setFirstItemActive();
+        }
+        else if (isPrev) {
+            this._keyManager.setPreviousItemActive();
+        }
+        else {
+            this._keyManager.setNextItemActive();
+        }
+        const active = this._keyManager.activeItem;
+        if (active) {
+            this.selectRadio(active);
+        }
+    }
+    selectRadio(radio) {
+        if (this.computedDisabled() || this.readonly())
+            return;
+        this.value.set(radio.value());
+        radio.focus();
+        const radioValue = radio.value();
+        this.radios().forEach((r) => r.checked.set(r.value() === radioValue));
+        this._updateTabIndices();
+        this._markTouched();
+    }
+    /** Whether the control holds a clearable value — A radio value is selected. */
+    hasValue = computed(() => this.value() != null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hasValue" }] : /* istanbul ignore next */ []));
+    /** @private Syncs each radio's checked state to the current group value and refreshes tab indices. */
+    _updateSelection() {
+        this.radios().forEach((radio) => {
+            radio.checked.set(radio.value() === this.value());
+        });
+        this._updateTabIndices();
+    }
+    /** @private Applies the roving tabindex: only the checked radio (or first when none checked) is tabbable. */
+    _updateTabIndices() {
+        const radios = this.radios();
+        const hasChecked = radios.some((r) => r.checked());
+        radios.forEach((radio, i) => {
+            radio.tabIndex.set(hasChecked ? (radio.checked() ? 0 : -1) : i === 0 ? 0 : -1);
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvRadioGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: MlvRadioGroup, isStandalone: true, selector: "mlv-radio-group", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { attributes: { "role": "radiogroup" }, listeners: { "keydown": "_onKeydown($event)" }, properties: { "class": "\"mlv-radio-group--state-\" + resolvedState()", "class.mlv-radio-group--disabled": "computedDisabled()", "class.mlv-radio-group--readonly": "readonly()", "attr.id": "id()", "attr.aria-label": "ariaLabel() ?? label()", "attr.aria-required": "required() || null", "attr.aria-describedby": "_describedBy()", "attr.aria-disabled": "computedDisabled() || null" }, classAttribute: "mlv-radio-group" }, providers: [
+            {
+                provide: RADIO_GROUP,
+                useExisting: forwardRef(() => MlvRadioGroup),
+            },
+            {
+                provide: MLV_FORM_CONTROL,
+                useExisting: forwardRef(() => MlvRadioGroup),
+            },
+        ], queries: [{ propertyName: "radios", predicate: MlvRadio, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
+    @if (label()) {
+      <mlv-label [required]="required()">
+        {{ label() }}
+      </mlv-label>
+    }
+    <div class="mlv-radio-group__content">
+      <ng-content />
+    </div>
+    @if (description()) {
+      <mlv-description [id]="_descriptionId()">{{
+        description()
+      }}</mlv-description>
+    }
+    @if (message()) {
+      <mlv-message [id]="_messageId()" [state]="resolvedState()">{{
+        message()
+      }}</mlv-message>
+    }
+  `, isInline: true, styles: [".mlv-radio-group,.mlv-radio-group__content{display:flex;flex-direction:column;gap:var(--mlv-spacing-2)}.mlv-radio-group--disabled .mlv-radio-group__content{opacity:var(--mlv-disabled-opacity);cursor:not-allowed;pointer-events:none}.mlv-radio-group--readonly .mlv-radio-group__content{cursor:default}.mlv-radio-group--state-error .mlv-radio-group__content{border-inline-start:var(--mlv-stroke-width) solid var(--mlv-border-error);padding-inline-start:var(--mlv-spacing-3)}.mlv-radio-group--state-warning .mlv-radio-group__content{border-inline-start:var(--mlv-stroke-width) solid var(--mlv-border-warning);padding-inline-start:var(--mlv-spacing-3)}.mlv-radio-group--state-success .mlv-radio-group__content{border-inline-start:var(--mlv-stroke-width) solid var(--mlv-border-success);padding-inline-start:var(--mlv-spacing-3)}.mlv-radio-group--state-info .mlv-radio-group__content{border-inline-start:var(--mlv-stroke-width) solid var(--mlv-border-info);padding-inline-start:var(--mlv-spacing-3)}\n"], dependencies: [{ kind: "component", type: MlvLabel, selector: "mlv-label", inputs: ["for", "required"] }, { kind: "component", type: MlvDescription, selector: "mlv-description" }, { kind: "component", type: MlvMessage, selector: "mlv-message", inputs: ["state"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: MlvRadioGroup, decorators: [{
+            type: Component,
+            args: [{ selector: 'mlv-radio-group', template: `
+    @if (label()) {
+      <mlv-label [required]="required()">
+        {{ label() }}
+      </mlv-label>
+    }
+    <div class="mlv-radio-group__content">
+      <ng-content />
+    </div>
+    @if (description()) {
+      <mlv-description [id]="_descriptionId()">{{
+        description()
+      }}</mlv-description>
+    }
+    @if (message()) {
+      <mlv-message [id]="_messageId()" [state]="resolvedState()">{{
+        message()
+      }}</mlv-message>
+    }
+  `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: RADIO_GROUP,
+                            useExisting: forwardRef(() => MlvRadioGroup),
+                        },
+                        {
+                            provide: MLV_FORM_CONTROL,
+                            useExisting: forwardRef(() => MlvRadioGroup),
+                        },
+                    ], imports: [MlvLabel, MlvDescription, MlvMessage], host: {
+                        class: 'mlv-radio-group',
+                        '[class]': '"mlv-radio-group--state-" + resolvedState()',
+                        '[class.mlv-radio-group--disabled]': 'computedDisabled()',
+                        '[class.mlv-radio-group--readonly]': 'readonly()',
+                        '[attr.id]': 'id()',
+                        role: 'radiogroup',
+                        '[attr.aria-label]': 'ariaLabel() ?? label()',
+                        '[attr.aria-required]': 'required() || null',
+                        '[attr.aria-describedby]': '_describedBy()',
+                        '[attr.aria-disabled]': 'computedDisabled() || null',
+                        '(keydown)': '_onKeydown($event)',
+                    }, styles: [".mlv-radio-group,.mlv-radio-group__content{display:flex;flex-direction:column;gap:var(--mlv-spacing-2)}.mlv-radio-group--disabled .mlv-radio-group__content{opacity:var(--mlv-disabled-opacity);cursor:not-allowed;pointer-events:none}.mlv-radio-group--readonly .mlv-radio-group__content{cursor:default}.mlv-radio-group--state-error .mlv-radio-group__content{border-inline-start:var(--mlv-stroke-width) solid var(--mlv-border-error);padding-inline-start:var(--mlv-spacing-3)}.mlv-radio-group--state-warning .mlv-radio-group__content{border-inline-start:var(--mlv-stroke-width) solid var(--mlv-border-warning);padding-inline-start:var(--mlv-spacing-3)}.mlv-radio-group--state-success .mlv-radio-group__content{border-inline-start:var(--mlv-stroke-width) solid var(--mlv-border-success);padding-inline-start:var(--mlv-spacing-3)}.mlv-radio-group--state-info .mlv-radio-group__content{border-inline-start:var(--mlv-stroke-width) solid var(--mlv-border-info);padding-inline-start:var(--mlv-spacing-3)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], radios: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => MlvRadio), { isSignal: true }] }] } });
+//# sourceMappingURL=radio-group.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.js","sourceRoot":"","sources":["../../../../../../../libs/core/radio/src/lib/radio-group/radio-group.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  contentChildren,\n  DestroyRef,\n  effect,\n  forwardRef,\n  inject,\n  input,\n  model,\n  untracked,\n  ViewEncapsulation,\n  computed,\n} from '@angular/core';\nimport { FocusKeyManager } from '@angular/cdk/a11y';\nimport type { FocusableOption } from '@angular/cdk/a11y';\nimport { MlvRadio } from '../radio/radio';\nimport type { MlvRadioGroupAccessor } from '../radio-group-token';\nimport { RADIO_GROUP } from '../radio-group-token';\nimport type { MlvFormState } from '@malva-ui/core/form-utils';\nimport {\n  MlvDescription,\n  MlvLabel,\n  MlvMessage,\n  MLV_FORM_CONTROL,\n  MlvSignalFormControlBase,\n} from '@malva-ui/core/form-utils';\nimport { mlvNextId } from '@malva-ui/cdk/utils';\n\n/**\n * Visual/validation state of the group. Structurally identical to\n * {@link MlvFormState}; retained as a public alias for backwards compatibility.\n */\nexport type MlvRadioGroupState = MlvFormState;\n\ntype RadioFocusItem = MlvRadio & FocusableOption;\n\n@Component({\n  selector: 'mlv-radio-group',\n  template: `\n    @if (label()) {\n      <mlv-label [required]=\"required()\">\n        {{ label() }}\n      </mlv-label>\n    }\n    <div class=\"mlv-radio-group__content\">\n      <ng-content />\n    </div>\n    @if (description()) {\n      <mlv-description [id]=\"_descriptionId()\">{{\n        description()\n      }}</mlv-description>\n    }\n    @if (message()) {\n      <mlv-message [id]=\"_messageId()\" [state]=\"resolvedState()\">{{\n        message()\n      }}</mlv-message>\n    }\n  `,\n  styleUrl: './radio-group.scss',\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  providers: [\n    {\n      provide: RADIO_GROUP,\n      useExisting: forwardRef(() => MlvRadioGroup),\n    },\n    {\n      provide: MLV_FORM_CONTROL,\n      useExisting: forwardRef(() => MlvRadioGroup),\n    },\n  ],\n  imports: [MlvLabel, MlvDescription, MlvMessage],\n  host: {\n    class: 'mlv-radio-group',\n    '[class]': '\"mlv-radio-group--state-\" + resolvedState()',\n    '[class.mlv-radio-group--disabled]': 'computedDisabled()',\n    '[class.mlv-radio-group--readonly]': 'readonly()',\n    '[attr.id]': 'id()',\n    role: 'radiogroup',\n    '[attr.aria-label]': 'ariaLabel() ?? label()',\n    '[attr.aria-required]': 'required() || null',\n    '[attr.aria-describedby]': '_describedBy()',\n    '[attr.aria-disabled]': 'computedDisabled() || null',\n    '(keydown)': '_onKeydown($event)',\n  },\n})\nexport class MlvRadioGroup\n  extends MlvSignalFormControlBase<unknown>\n  implements MlvRadioGroupAccessor\n{\n  /** Two-way bindable selected value of the group. */\n  readonly value = model<unknown>();\n\n  /** Shared `name` applied to the native radio inputs in the group. */\n  readonly name = input<string, string | undefined>(\n    mlvNextId('mlv-radio-group'),\n    { transform: (value) => value ?? mlvNextId('mlv-radio-group') },\n  );\n\n  readonly radios = contentChildren(MlvRadio);\n\n  /** @private FocusKeyManager driving roving focus + arrow-key navigation across the radios. */\n  private _keyManager!: FocusKeyManager<MlvRadio>;\n\n  constructor() {\n    super();\n    inject(DestroyRef).onDestroy(() => this._keyManager?.destroy());\n\n    effect(() => {\n      const items = [...this.radios()];\n      const groupName = this.name();\n      if (items.length === 0) return;\n\n      this._keyManager?.destroy();\n      this._keyManager = new FocusKeyManager<MlvRadio>(\n        items as RadioFocusItem[],\n      )\n        .skipPredicate((radio) => radio.disabled())\n        .withVerticalOrientation()\n        .withWrap();\n\n      items.forEach((radio) => radio.name.set(groupName));\n      untracked(() => this._updateSelection());\n    });\n\n    effect(() => {\n      this.value();\n      untracked(() => this._updateSelection());\n    });\n  }\n\n  onChildFocus(radio: MlvRadio): void {\n    const index = this.radios().indexOf(radio);\n    if (index >= 0) {\n      this._keyManager.setActiveItem(index);\n    }\n  }\n\n  /**\n   * @protected Host keydown handler. Handles all four arrow keys for WAI-ARIA\n   * radiogroup semantics, moving focus + selection via the FocusKeyManager.\n   */\n  _onKeydown(event: KeyboardEvent): void {\n    const key = event.key;\n    const isPrev = key === 'ArrowUp' || key === 'ArrowLeft';\n    const isNext = key === 'ArrowDown' || key === 'ArrowRight';\n    if (!isPrev && !isNext) return;\n\n    // Handle all four arrows for WAI-ARIA radiogroup semantics and suppress the\n    // native radio-group navigation so focus + selection stay in sync with the\n    // FocusKeyManager (which skips disabled radios and wraps).\n    event.preventDefault();\n\n    if (!this._keyManager.activeItem) {\n      this._keyManager.setFirstItemActive();\n    } else if (isPrev) {\n      this._keyManager.setPreviousItemActive();\n    } else {\n      this._keyManager.setNextItemActive();\n    }\n\n    const active = this._keyManager.activeItem;\n    if (active) {\n      this.selectRadio(active);\n    }\n  }\n\n  selectRadio(radio: MlvRadio): void {\n    if (this.computedDisabled() || this.readonly()) return;\n    this.value.set(radio.value());\n    radio.focus();\n    const radioValue = radio.value();\n    this.radios().forEach((r) => r.checked.set(r.value() === radioValue));\n    this._updateTabIndices();\n    this._markTouched();\n  }\n\n  /** Whether the control holds a clearable value — A radio value is selected. */\n  readonly hasValue = computed(() => this.value() != null);\n\n  /** @private Syncs each radio's checked state to the current group value and refreshes tab indices. */\n  private _updateSelection(): void {\n    this.radios().forEach((radio) => {\n      radio.checked.set(radio.value() === this.value());\n    });\n    this._updateTabIndices();\n  }\n\n  /** @private Applies the roving tabindex: only the checked radio (or first when none checked) is tabbable. */\n  private _updateTabIndices(): void {\n    const radios = this.radios();\n    const hasChecked = radios.some((r) => r.checked());\n    radios.forEach((radio, i) => {\n      radio.tabIndex.set(\n        hasChecked ? (radio.checked() ? 0 : -1) : i === 0 ? 0 : -1,\n      );\n    });\n  }\n}\n"]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group-token.js","sourceRoot":"","sources":["../../../../../../libs/core/radio/src/lib/radio-group-token.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAQ/C,MAAM,CAAC,MAAM,WAAW,GAAG,IAAI,cAAc,CAC3C,aAAa,CACd,CAAC","sourcesContent":["import { InjectionToken } from '@angular/core';\nimport type { MlvRadio } from './radio/radio';\n\nexport interface MlvRadioGroupAccessor {\n  selectRadio(radio: MlvRadio): void;\n  onChildFocus(radio: MlvRadio): void;\n}\n\nexport const RADIO_GROUP = new InjectionToken<MlvRadioGroupAccessor>(\n  'RADIO_GROUP',\n);\n"]}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"malva-ui-core-radio.js","sourceRoot":"","sources":["../../../../../libs/core/radio/src/malva-ui-core-radio.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/rating/index.js

@@ -0,0 +1,2 @@
+export * from './lib/rating/rating';
+//# sourceMappingURL=index.js.map

package/esm2022/rating/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../libs/core/rating/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC","sourcesContent":["export * from './lib/rating/rating';\n"]}