@educarehq/solaris-ui 0.2.0 → 0.3.0

package/esm2022/lib/components/navigation/segmented-control/component/segmented-control.component.js

@@ -0,0 +1,242 @@
+import { Component, input, output, model, contentChildren, computed, signal, inject, ChangeDetectionStrategy, effect, ElementRef, NgZone, Injector, forwardRef, } from '@angular/core';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import { SolarisSegmentedItemComponent } from '../item/segmented-item.component';
+import { SolarisTranslateService } from '../../../../services/translation';
+import { SOLARIS_SEGMENTED_CONTROL, } from '../token/segmented-control.tokens';
+import * as i0 from "@angular/core";
+let nextInstanceId = 0;
+export class SolarisSegmentedControlComponent {
+    translateService = inject(SolarisTranslateService, {
+        optional: true,
+    });
+    elementRef = inject(ElementRef);
+    injector = inject(Injector);
+    ngZone = inject(NgZone);
+    items = contentChildren(SolarisSegmentedItemComponent, ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+    invalid = input(false, ...(ngDevMode ? [{ debugName: "invalid" }] : /* istanbul ignore next */ []));
+    indicator = input(true, ...(ngDevMode ? [{ debugName: "indicator" }] : /* istanbul ignore next */ []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+    required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
+    fullWidth = input(false, ...(ngDevMode ? [{ debugName: "fullWidth" }] : /* istanbul ignore next */ []));
+    equalWidth = input(false, ...(ngDevMode ? [{ debugName: "equalWidth" }] : /* istanbul ignore next */ []));
+    value = model(undefined, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    defaultValue = input(undefined, ...(ngDevMode ? [{ debugName: "defaultValue" }] : /* istanbul ignore next */ []));
+    compareFn = computed(() => this.compareWith(), ...(ngDevMode ? [{ debugName: "compareFn" }] : /* istanbul ignore next */ []));
+    ariaLabel = input(undefined, ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    ariaLabelKey = input(undefined, ...(ngDevMode ? [{ debugName: "ariaLabelKey" }] : /* istanbul ignore next */ []));
+    ariaLabelledby = input(undefined, ...(ngDevMode ? [{ debugName: "ariaLabelledby" }] : /* istanbul ignore next */ []));
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    radius = input('md', ...(ngDevMode ? [{ debugName: "radius" }] : /* istanbul ignore next */ []));
+    compareWith = input(Object.is, ...(ngDevMode ? [{ debugName: "compareWith" }] : /* istanbul ignore next */ []));
+    density = input('comfortable', ...(ngDevMode ? [{ debugName: "density" }] : /* istanbul ignore next */ []));
+    appearance = input('surface', ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
+    orientation = input('horizontal', ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
+    valueChange = output();
+    segmentedChange = output();
+    instanceId = `solaris-segmented-control-${nextInstanceId++}`;
+    touched = signal(false, ...(ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []));
+    indicatorWidth = signal('0', ...(ngDevMode ? [{ debugName: "indicatorWidth" }] : /* istanbul ignore next */ []));
+    indicatorHeight = signal('0', ...(ngDevMode ? [{ debugName: "indicatorHeight" }] : /* istanbul ignore next */ []));
+    indicatorReady = signal(false, ...(ngDevMode ? [{ debugName: "indicatorReady" }] : /* istanbul ignore next */ []));
+    internalDisabled = signal(false, ...(ngDevMode ? [{ debugName: "internalDisabled" }] : /* istanbul ignore next */ []));
+    indicatorTransformX = signal('translateX(0)', ...(ngDevMode ? [{ debugName: "indicatorTransformX" }] : /* istanbul ignore next */ []));
+    indicatorTransformY = signal('translateY(0)', ...(ngDevMode ? [{ debugName: "indicatorTransformY" }] : /* istanbul ignore next */ []));
+    onChange = () => undefined;
+    onTouched = () => undefined;
+    resizeObserver = null;
+    contentObserver = null;
+    isEffectivelyDisabled = computed(() => {
+        return this.disabled() || this.internalDisabled();
+    }, ...(ngDevMode ? [{ debugName: "isEffectivelyDisabled" }] : /* istanbul ignore next */ []));
+    hasValue = computed(() => {
+        return this.value() !== undefined && this.value() !== null;
+    }, ...(ngDevMode ? [{ debugName: "hasValue" }] : /* istanbul ignore next */ []));
+    resolvedAriaLabel = computed(() => {
+        if (this.ariaLabel())
+            return this.ariaLabel();
+        const ariaLabelKey = this.ariaLabelKey();
+        if (ariaLabelKey && this.translateService) {
+            return this.translateService.translate(ariaLabelKey);
+        }
+        return ariaLabelKey ?? undefined;
+    }, ...(ngDevMode ? [{ debugName: "resolvedAriaLabel" }] : /* istanbul ignore next */ []));
+    constructor() {
+        effect(() => {
+            const defaultValue = this.defaultValue();
+            const currentValue = this.value();
+            if (currentValue === undefined && defaultValue !== undefined) {
+                this.value.set(defaultValue);
+            }
+        });
+    }
+    ngAfterViewInit() {
+        this.setupIndicatorMeasurement();
+        effect(() => {
+            this.value();
+            this.appearance();
+            this.orientation();
+            this.size();
+            this.density();
+            this.radius();
+            this.ngZone.runOutsideAngular(() => {
+                requestAnimationFrame(() => this.measureIndicator());
+            });
+        }, { injector: this.injector });
+    }
+    ngOnDestroy() {
+        this.disconnectObserver();
+    }
+    selectItem(item) {
+        if (this.isEffectivelyDisabled())
+            return;
+        if (this.readonly())
+            return;
+        const previousValue = this.value();
+        const newValue = item.value();
+        if (this.compareFn()(newValue, previousValue))
+            return;
+        this.value.set(newValue);
+        this.valueChange.emit(newValue);
+        this.segmentedChange.emit({ value: newValue, previousValue });
+        this.onChange(newValue);
+        this.markAsTouched();
+    }
+    focusItem(item) {
+        // SECURITY_EXCEPTION: nativeElement.querySelector required to find item DOM element for programmatic focus. Standard DOM method, SSR-safe with guard.
+        const nativeElement = this.elementRef.nativeElement;
+        const itemElements = nativeElement.querySelectorAll('solaris-segmented-item');
+        const items = this.items();
+        const index = items.indexOf(item);
+        if (index >= 0 && itemElements[index]) {
+            itemElements[index].focus();
+        }
+    }
+    // ControlValueAccessor
+    writeValue(safe) {
+        this.value.set(safe);
+        this.ngZone.runOutsideAngular(() => {
+            requestAnimationFrame(() => this.measureIndicator());
+        });
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.internalDisabled.set(isDisabled);
+    }
+    markAsTouched() {
+        if (!this.touched()) {
+            this.touched.set(true);
+            this.onTouched();
+        }
+    }
+    measureIndicator() {
+        if (!this.indicator())
+            return;
+        // SECURITY_EXCEPTION: nativeElement.querySelector required to measure indicator position for animation. Read-only measurement, SSR-safe.
+        const nativeEl = this.elementRef.nativeElement;
+        const container = nativeEl.querySelector('.solaris-segmented-control__container');
+        if (!container)
+            return;
+        const selectedItem = container.querySelector('solaris-segmented-item[data-selected="true"]');
+        if (!selectedItem)
+            return;
+        const isVertical = this.orientation() === 'vertical';
+        if (isVertical) {
+            this.indicatorTransformY.set(`translateY(${selectedItem.offsetTop}px)`);
+            this.indicatorHeight.set(`${selectedItem.offsetHeight}px`);
+        }
+        else {
+            this.indicatorTransformX.set(`translateX(${selectedItem.offsetLeft}px)`);
+            this.indicatorWidth.set(`${selectedItem.offsetWidth}px`);
+        }
+        if (!this.indicatorReady()) {
+            requestAnimationFrame(() => this.indicatorReady.set(true));
+        }
+    }
+    setupIndicatorMeasurement() {
+        if (typeof ResizeObserver !== 'undefined') {
+            this.resizeObserver = new ResizeObserver(() => {
+                this.ngZone.runOutsideAngular(() => {
+                    requestAnimationFrame(() => this.measureIndicator());
+                });
+            });
+            // SECURITY_EXCEPTION: nativeElement required for ResizeObserver target. Standard DOM API, SSR-safe with typeof guard.
+            const nativeEl = this.elementRef.nativeElement;
+            this.resizeObserver.observe(nativeEl);
+        }
+        if (typeof MutationObserver !== 'undefined') {
+            // SECURITY_EXCEPTION: nativeElement required for MutationObserver target. Standard DOM API, SSR-safe with typeof guard.
+            const nativeEl = this.elementRef.nativeElement;
+            this.contentObserver = new MutationObserver(() => {
+                this.ngZone.runOutsideAngular(() => {
+                    requestAnimationFrame(() => this.measureIndicator());
+                });
+            });
+            this.contentObserver.observe(nativeEl, {
+                childList: true,
+                subtree: true,
+                characterData: true,
+            });
+        }
+        this.ngZone.runOutsideAngular(() => {
+            requestAnimationFrame(() => this.measureIndicator());
+        });
+    }
+    disconnectObserver() {
+        this.resizeObserver?.disconnect();
+        this.resizeObserver = null;
+        this.contentObserver?.disconnect();
+        this.contentObserver = null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SolarisSegmentedControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SolarisSegmentedControlComponent, isStandalone: true, selector: "solaris-segmented-control", inputs: { invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, indicator: { classPropertyName: "indicator", publicName: "indicator", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, equalWidth: { classPropertyName: "equalWidth", publicName: "equalWidth", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, defaultValue: { classPropertyName: "defaultValue", publicName: "defaultValue", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelKey: { classPropertyName: "ariaLabelKey", publicName: "ariaLabelKey", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null }, compareWith: { classPropertyName: "compareWith", publicName: "compareWith", isSignal: true, isRequired: false, transformFunction: null }, density: { classPropertyName: "density", publicName: "density", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", valueChange: "valueChange", segmentedChange: "segmentedChange" }, host: { attributes: { "role": "radiogroup" }, properties: { "attr.data-size": "size()", "attr.data-radius": "radius()", "attr.data-density": "density()", "attr.data-appearance": "appearance()", "attr.data-orientation": "orientation()", "attr.data-invalid": "invalid() || undefined", "attr.data-readonly": "readonly() || undefined", "attr.aria-required": "required() || undefined", "attr.data-full-width": "fullWidth() || undefined", "attr.data-equal-width": "equalWidth() || undefined", "attr.aria-label": "resolvedAriaLabel() || undefined", "attr.data-show-indicator": "indicator() || undefined", "attr.aria-labelledby": "ariaLabelledby() || undefined", "attr.data-disabled": "isEffectivelyDisabled() || undefined", "attr.aria-disabled": "isEffectivelyDisabled() || undefined", "attr.aria-invalid": "invalid() || (required() && touched() && !hasValue()) ? \"true\" : undefined" }, classAttribute: "solaris-segmented-control" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => SolarisSegmentedControlComponent),
+                multi: true,
+            },
+            {
+                provide: SOLARIS_SEGMENTED_CONTROL,
+                useExisting: SolarisSegmentedControlComponent,
+            },
+        ], queries: [{ propertyName: "items", predicate: SolarisSegmentedItemComponent, isSignal: true }], ngImport: i0, template: "<div class=\"solaris-segmented-control__container\">\n  <ng-content select=\"solaris-segmented-item\" />\n\n  @if (indicator() && hasValue()) {\n    <div\n      class=\"solaris-segmented-control__indicator\"\n      [class.solaris-segmented-control__indicator--animate]=\"indicatorReady()\"\n      [class.solaris-segmented-control__indicator--vertical]=\"\n        orientation() === 'vertical'\n      \"\n      [style.transform]=\"\n        orientation() === 'vertical'\n          ? indicatorTransformY()\n          : indicatorTransformX()\n      \"\n      [style.width]=\"orientation() === 'vertical' ? '' : indicatorWidth()\"\n      [style.height]=\"orientation() === 'vertical' ? indicatorHeight() : ''\"\n    ></div>\n  }\n</div>\n", styles: [":host{--solaris-segmented-item-height: auto;--solaris-segmented-gap: var(--solaris-spacing-1);--solaris-segmented-radius: var(--solaris-radius-md);--solaris-segmented-padding: var(--solaris-spacing-1);--solaris-segmented-item-color: var(--solaris-text-default);--solaris-segmented-item-padding-y: var(--solaris-spacing-2);--solaris-segmented-item-padding-x: var(--solaris-spacing-3);--solaris-segmented-background: var(--solaris-surface-subtle);--solaris-segmented-indicator-shadow: var(--solaris-shadow-sm);--solaris-segmented-border-color: var(--solaris-border-subtle);--solaris-segmented-border-width: var(--solaris-border-width-sm);--solaris-segmented-focus-ring-color: var(--solaris-primary-base);--solaris-segmented-item-selected-color: var(--solaris-text-strong);--solaris-segmented-indicator-background: var(--solaris-surface-muted);--solaris-segmented-item-hover-background: var(--solaris-surface-muted);width:auto;display:inline-flex}:host([data-full-width]){width:100%;display:flex}.solaris-segmented-control__container{width:100%;display:flex;position:relative;align-items:stretch;box-sizing:border-box;gap:var(--solaris-segmented-gap);padding:var(--solaris-segmented-padding);border-radius:var(--solaris-segmented-radius);background:var(--solaris-segmented-background)}:host([data-orientation=horizontal]) .solaris-segmented-control__container{flex-direction:row}:host([data-orientation=vertical]) .solaris-segmented-control__container{flex-direction:column}:host([data-appearance=outline]) .solaris-segmented-control__container{background:var(--solaris-surface-base);border:var(--solaris-segmented-border-width) solid var(--solaris-segmented-border-color)}:host([data-appearance=surface]) .solaris-segmented-control__container{background:var(--solaris-segmented-background)}:host([data-radius=sm]){--solaris-segmented-radius: var(--solaris-radius-sm)}:host([data-radius=md]){--solaris-segmented-radius: var(--solaris-radius-md)}:host([data-radius=lg]){--solaris-segmented-radius: var(--solaris-radius-lg)}:host([data-radius=full]){--solaris-segmented-radius: var(--solaris-radius-full)}:host([data-size=sm]){--solaris-segmented-gap: var(--solaris-spacing-1);--solaris-segmented-padding: var(--solaris-spacing-1)}:host([data-size=md]){--solaris-segmented-gap: var(--solaris-spacing-2);--solaris-segmented-padding: var(--solaris-spacing-1)}:host([data-size=lg]){--solaris-segmented-gap: var(--solaris-spacing-3);--solaris-segmented-padding: var(--solaris-spacing-1)}:host([data-size=sm][data-density=compact]){--solaris-segmented-gap: var(--solaris-spacing-1);--solaris-segmented-padding: var(--solaris-border-width-sm)}:host([data-size=md][data-density=compact]){--solaris-segmented-gap: var(--solaris-spacing-1);--solaris-segmented-padding: var(--solaris-border-width-sm)}:host([data-size=lg][data-density=compact]){--solaris-segmented-gap: var(--solaris-spacing-2);--solaris-segmented-padding: var(--solaris-border-width-sm)}:host([data-equal-width]) .solaris-segmented-control__container>solaris-segmented-item{flex:1;justify-content:center}:host([data-disabled]){cursor:not-allowed}:host([data-disabled]) .solaris-segmented-control__indicator{opacity:.6;cursor:not-allowed}:host([data-invalid]) .solaris-segmented-control__container{outline-offset:var(--solaris-border-width-sm);outline:var(--solaris-border-width-md) solid var(--solaris-danger-base)}:host([data-invalid][data-appearance=outline]) .solaris-segmented-control__container{border-color:var(--solaris-danger-base)}.solaris-segmented-control__indicator{left:0;z-index:1;height:auto;transition:none;position:absolute;pointer-events:none;box-sizing:border-box;top:var(--solaris-segmented-padding);bottom:var(--solaris-segmented-padding);box-shadow:var(--solaris-segmented-indicator-shadow);background:var(--solaris-segmented-indicator-background);border:var(--solaris-border-width-sm) solid var(--solaris-border-subtle);border-radius:max(var(--solaris-radius-sm),var(--solaris-segmented-radius) - var(--solaris-segmented-padding),var(--solaris-segmented-padding) - var(--solaris-segmented-radius))}.solaris-segmented-control__indicator--vertical{top:0;height:0;width:auto;bottom:auto;left:var(--solaris-segmented-padding);right:var(--solaris-segmented-padding)}.solaris-segmented-control__indicator--animate{transition:transform var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),width var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),height var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}@media(prefers-reduced-motion:reduce){.solaris-segmented-control__indicator{transition:none}}:host-context([data-reduced-motion=true]) .solaris-segmented-control__indicator{transition:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SolarisSegmentedControlComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'solaris-segmented-control', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'solaris-segmented-control',
+                        role: 'radiogroup',
+                        '[attr.data-size]': 'size()',
+                        '[attr.data-radius]': 'radius()',
+                        '[attr.data-density]': 'density()',
+                        '[attr.data-appearance]': 'appearance()',
+                        '[attr.data-orientation]': 'orientation()',
+                        '[attr.data-invalid]': 'invalid() || undefined',
+                        '[attr.data-readonly]': 'readonly() || undefined',
+                        '[attr.aria-required]': 'required() || undefined',
+                        '[attr.data-full-width]': 'fullWidth() || undefined',
+                        '[attr.data-equal-width]': 'equalWidth() || undefined',
+                        '[attr.aria-label]': 'resolvedAriaLabel() || undefined',
+                        '[attr.data-show-indicator]': 'indicator() || undefined',
+                        '[attr.aria-labelledby]': 'ariaLabelledby() || undefined',
+                        '[attr.data-disabled]': 'isEffectivelyDisabled() || undefined',
+                        '[attr.aria-disabled]': 'isEffectivelyDisabled() || undefined',
+                        '[attr.aria-invalid]': 'invalid() || (required() && touched() && !hasValue()) ? "true" : undefined',
+                    }, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => SolarisSegmentedControlComponent),
+                            multi: true,
+                        },
+                        {
+                            provide: SOLARIS_SEGMENTED_CONTROL,
+                            useExisting: SolarisSegmentedControlComponent,
+                        },
+                    ], template: "<div class=\"solaris-segmented-control__container\">\n  <ng-content select=\"solaris-segmented-item\" />\n\n  @if (indicator() && hasValue()) {\n    <div\n      class=\"solaris-segmented-control__indicator\"\n      [class.solaris-segmented-control__indicator--animate]=\"indicatorReady()\"\n      [class.solaris-segmented-control__indicator--vertical]=\"\n        orientation() === 'vertical'\n      \"\n      [style.transform]=\"\n        orientation() === 'vertical'\n          ? indicatorTransformY()\n          : indicatorTransformX()\n      \"\n      [style.width]=\"orientation() === 'vertical' ? '' : indicatorWidth()\"\n      [style.height]=\"orientation() === 'vertical' ? indicatorHeight() : ''\"\n    ></div>\n  }\n</div>\n", styles: [":host{--solaris-segmented-item-height: auto;--solaris-segmented-gap: var(--solaris-spacing-1);--solaris-segmented-radius: var(--solaris-radius-md);--solaris-segmented-padding: var(--solaris-spacing-1);--solaris-segmented-item-color: var(--solaris-text-default);--solaris-segmented-item-padding-y: var(--solaris-spacing-2);--solaris-segmented-item-padding-x: var(--solaris-spacing-3);--solaris-segmented-background: var(--solaris-surface-subtle);--solaris-segmented-indicator-shadow: var(--solaris-shadow-sm);--solaris-segmented-border-color: var(--solaris-border-subtle);--solaris-segmented-border-width: var(--solaris-border-width-sm);--solaris-segmented-focus-ring-color: var(--solaris-primary-base);--solaris-segmented-item-selected-color: var(--solaris-text-strong);--solaris-segmented-indicator-background: var(--solaris-surface-muted);--solaris-segmented-item-hover-background: var(--solaris-surface-muted);width:auto;display:inline-flex}:host([data-full-width]){width:100%;display:flex}.solaris-segmented-control__container{width:100%;display:flex;position:relative;align-items:stretch;box-sizing:border-box;gap:var(--solaris-segmented-gap);padding:var(--solaris-segmented-padding);border-radius:var(--solaris-segmented-radius);background:var(--solaris-segmented-background)}:host([data-orientation=horizontal]) .solaris-segmented-control__container{flex-direction:row}:host([data-orientation=vertical]) .solaris-segmented-control__container{flex-direction:column}:host([data-appearance=outline]) .solaris-segmented-control__container{background:var(--solaris-surface-base);border:var(--solaris-segmented-border-width) solid var(--solaris-segmented-border-color)}:host([data-appearance=surface]) .solaris-segmented-control__container{background:var(--solaris-segmented-background)}:host([data-radius=sm]){--solaris-segmented-radius: var(--solaris-radius-sm)}:host([data-radius=md]){--solaris-segmented-radius: var(--solaris-radius-md)}:host([data-radius=lg]){--solaris-segmented-radius: var(--solaris-radius-lg)}:host([data-radius=full]){--solaris-segmented-radius: var(--solaris-radius-full)}:host([data-size=sm]){--solaris-segmented-gap: var(--solaris-spacing-1);--solaris-segmented-padding: var(--solaris-spacing-1)}:host([data-size=md]){--solaris-segmented-gap: var(--solaris-spacing-2);--solaris-segmented-padding: var(--solaris-spacing-1)}:host([data-size=lg]){--solaris-segmented-gap: var(--solaris-spacing-3);--solaris-segmented-padding: var(--solaris-spacing-1)}:host([data-size=sm][data-density=compact]){--solaris-segmented-gap: var(--solaris-spacing-1);--solaris-segmented-padding: var(--solaris-border-width-sm)}:host([data-size=md][data-density=compact]){--solaris-segmented-gap: var(--solaris-spacing-1);--solaris-segmented-padding: var(--solaris-border-width-sm)}:host([data-size=lg][data-density=compact]){--solaris-segmented-gap: var(--solaris-spacing-2);--solaris-segmented-padding: var(--solaris-border-width-sm)}:host([data-equal-width]) .solaris-segmented-control__container>solaris-segmented-item{flex:1;justify-content:center}:host([data-disabled]){cursor:not-allowed}:host([data-disabled]) .solaris-segmented-control__indicator{opacity:.6;cursor:not-allowed}:host([data-invalid]) .solaris-segmented-control__container{outline-offset:var(--solaris-border-width-sm);outline:var(--solaris-border-width-md) solid var(--solaris-danger-base)}:host([data-invalid][data-appearance=outline]) .solaris-segmented-control__container{border-color:var(--solaris-danger-base)}.solaris-segmented-control__indicator{left:0;z-index:1;height:auto;transition:none;position:absolute;pointer-events:none;box-sizing:border-box;top:var(--solaris-segmented-padding);bottom:var(--solaris-segmented-padding);box-shadow:var(--solaris-segmented-indicator-shadow);background:var(--solaris-segmented-indicator-background);border:var(--solaris-border-width-sm) solid var(--solaris-border-subtle);border-radius:max(var(--solaris-radius-sm),var(--solaris-segmented-radius) - var(--solaris-segmented-padding),var(--solaris-segmented-padding) - var(--solaris-segmented-radius))}.solaris-segmented-control__indicator--vertical{top:0;height:0;width:auto;bottom:auto;left:var(--solaris-segmented-padding);right:var(--solaris-segmented-padding)}.solaris-segmented-control__indicator--animate{transition:transform var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),width var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),height var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}@media(prefers-reduced-motion:reduce){.solaris-segmented-control__indicator{transition:none}}:host-context([data-reduced-motion=true]) .solaris-segmented-control__indicator{transition:none}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { items: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SolarisSegmentedItemComponent), { isSignal: true }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], indicator: [{ type: i0.Input, args: [{ isSignal: true, alias: "indicator", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], fullWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullWidth", required: false }] }], equalWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "equalWidth", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], defaultValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultValue", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaLabelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelKey", required: false }] }], ariaLabelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelledby", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], radius: [{ type: i0.Input, args: [{ isSignal: true, alias: "radius", required: false }] }], compareWith: [{ type: i0.Input, args: [{ isSignal: true, alias: "compareWith", required: false }] }], density: [{ type: i0.Input, args: [{ isSignal: true, alias: "density", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], segmentedChange: [{ type: i0.Output, args: ["segmentedChange"] }] } });
+//# sourceMappingURL=segmented-control.component.js.map

package/esm2022/lib/components/navigation/segmented-control/component/segmented-control.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"segmented-control.component.js","sourceRoot":"","sources":["../../../../../../../../../packages/angular/src/lib/components/navigation/segmented-control/component/segmented-control.component.ts","../../../../../../../../../packages/angular/src/lib/components/navigation/segmented-control/component/segmented-control.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  input,\n  output,\n  model,\n  contentChildren,\n  computed,\n  signal,\n  inject,\n  ChangeDetectionStrategy,\n  effect,\n  ElementRef,\n  NgZone,\n  Injector,\n  forwardRef,\n  AfterViewInit,\n  OnDestroy,\n} from '@angular/core';\nimport { NG_VALUE_ACCESSOR, type ControlValueAccessor } from '@angular/forms';\n\nimport { SolarisSegmentedItemComponent } from '../item/segmented-item.component';\nimport { SolarisTranslateService } from '../../../../services/translation';\n\nimport {\n  SOLARIS_SEGMENTED_CONTROL,\n  type SolarisSegmentedControlInterface,\n} from '../token/segmented-control.tokens';\n\nimport type {\n  SolarisSegmentedControlOrientation,\n  SolarisSegmentedControlAppearance,\n  SolarisSegmentedControlSize,\n  SolarisSegmentedControlDensity,\n  SolarisSegmentedControlRadius,\n  SolarisSegmentedControlChangeEvent,\n} from '../model/segmented-control.types';\n\nlet nextInstanceId = 0;\n\n@Component({\n  selector: 'solaris-segmented-control',\n  standalone: true,\n  imports: [],\n  templateUrl: './segmented-control.component.html',\n  styleUrls: ['./segmented-control.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'solaris-segmented-control',\n    role: 'radiogroup',\n    '[attr.data-size]': 'size()',\n    '[attr.data-radius]': 'radius()',\n    '[attr.data-density]': 'density()',\n    '[attr.data-appearance]': 'appearance()',\n    '[attr.data-orientation]': 'orientation()',\n    '[attr.data-invalid]': 'invalid() || undefined',\n    '[attr.data-readonly]': 'readonly() || undefined',\n    '[attr.aria-required]': 'required() || undefined',\n    '[attr.data-full-width]': 'fullWidth() || undefined',\n    '[attr.data-equal-width]': 'equalWidth() || undefined',\n    '[attr.aria-label]': 'resolvedAriaLabel() || undefined',\n    '[attr.data-show-indicator]': 'indicator() || undefined',\n    '[attr.aria-labelledby]': 'ariaLabelledby() || undefined',\n    '[attr.data-disabled]': 'isEffectivelyDisabled() || undefined',\n    '[attr.aria-disabled]': 'isEffectivelyDisabled() || undefined',\n    '[attr.aria-invalid]':\n      'invalid() || (required() && touched() && !hasValue()) ? \"true\" : undefined',\n  },\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => SolarisSegmentedControlComponent),\n      multi: true,\n    },\n    {\n      provide: SOLARIS_SEGMENTED_CONTROL,\n      useExisting: SolarisSegmentedControlComponent,\n    },\n  ],\n})\nexport class SolarisSegmentedControlComponent\n  implements\n    SolarisSegmentedControlInterface,\n    ControlValueAccessor,\n    AfterViewInit,\n    OnDestroy\n{\n  private readonly translateService = inject(SolarisTranslateService, {\n    optional: true,\n  });\n  private readonly elementRef = inject(ElementRef);\n  private readonly injector = inject(Injector);\n  private readonly ngZone = inject(NgZone);\n\n  readonly items = contentChildren(SolarisSegmentedItemComponent);\n\n  readonly invalid = input<boolean>(false);\n  readonly indicator = input<boolean>(true);\n  readonly disabled = input<boolean>(false);\n  readonly readonly = input<boolean>(false);\n  readonly required = input<boolean>(false);\n  readonly fullWidth = input<boolean>(false);\n  readonly equalWidth = input<boolean>(false);\n  readonly value = model<unknown>(undefined);\n  readonly defaultValue = input<unknown>(undefined);\n  readonly compareFn = computed(() => this.compareWith());\n  readonly ariaLabel = input<string | undefined>(undefined);\n  readonly ariaLabelKey = input<string | undefined>(undefined);\n  readonly ariaLabelledby = input<string | undefined>(undefined);\n  readonly size = input<SolarisSegmentedControlSize>('md');\n  readonly radius = input<SolarisSegmentedControlRadius>('md');\n  readonly compareWith = input<(a: unknown, b: unknown) => boolean>(Object.is);\n  readonly density = input<SolarisSegmentedControlDensity>('comfortable');\n  readonly appearance = input<SolarisSegmentedControlAppearance>('surface');\n  readonly orientation =\n    input<SolarisSegmentedControlOrientation>('horizontal');\n\n  readonly valueChange = output<unknown>();\n  readonly segmentedChange = output<SolarisSegmentedControlChangeEvent>();\n\n  protected readonly instanceId = `solaris-segmented-control-${nextInstanceId++}`;\n  protected readonly touched = signal(false);\n  protected readonly indicatorWidth = signal('0');\n  protected readonly indicatorHeight = signal('0');\n  protected readonly indicatorReady = signal(false);\n  protected readonly internalDisabled = signal(false);\n  protected readonly indicatorTransformX = signal('translateX(0)');\n  protected readonly indicatorTransformY = signal('translateY(0)');\n\n  private onChange: (value: unknown) => void = () => undefined;\n  private onTouched: () => void = () => undefined;\n  private resizeObserver: ResizeObserver | null = null;\n  private contentObserver: MutationObserver | null = null;\n\n  protected readonly isEffectivelyDisabled = computed(() => {\n    return this.disabled() || this.internalDisabled();\n  });\n\n  protected readonly hasValue = computed(() => {\n    return this.value() !== undefined && this.value() !== null;\n  });\n\n  protected readonly resolvedAriaLabel = computed(() => {\n    if (this.ariaLabel()) return this.ariaLabel();\n    const ariaLabelKey = this.ariaLabelKey();\n    if (ariaLabelKey && this.translateService) {\n      return this.translateService.translate(ariaLabelKey);\n    }\n    return ariaLabelKey ?? undefined;\n  });\n\n  constructor() {\n    effect(() => {\n      const defaultValue = this.defaultValue();\n      const currentValue = this.value();\n      if (currentValue === undefined && defaultValue !== undefined) {\n        this.value.set(defaultValue);\n      }\n    });\n  }\n\n  ngAfterViewInit(): void {\n    this.setupIndicatorMeasurement();\n\n    effect(\n      () => {\n        this.value();\n        this.appearance();\n        this.orientation();\n        this.size();\n        this.density();\n        this.radius();\n        this.ngZone.runOutsideAngular(() => {\n          requestAnimationFrame(() => this.measureIndicator());\n        });\n      },\n      { injector: this.injector },\n    );\n  }\n\n  ngOnDestroy(): void {\n    this.disconnectObserver();\n  }\n\n  selectItem(item: SolarisSegmentedItemComponent): void {\n    if (this.isEffectivelyDisabled()) return;\n    if (this.readonly()) return;\n    const previousValue = this.value();\n    const newValue = item.value();\n    if (this.compareFn()(newValue, previousValue)) return;\n    this.value.set(newValue);\n    this.valueChange.emit(newValue);\n    this.segmentedChange.emit({ value: newValue, previousValue });\n    this.onChange(newValue);\n    this.markAsTouched();\n  }\n\n  focusItem(item: SolarisSegmentedItemComponent): void {\n    // SECURITY_EXCEPTION: nativeElement.querySelector required to find item DOM element for programmatic focus. Standard DOM method, SSR-safe with guard.\n    const nativeElement = this.elementRef.nativeElement as HTMLElement;\n    const itemElements = nativeElement.querySelectorAll(\n      'solaris-segmented-item',\n    ) as NodeListOf<HTMLElement>;\n    const items = this.items();\n    const index = items.indexOf(item);\n    if (index >= 0 && itemElements[index]) {\n      itemElements[index].focus();\n    }\n  }\n\n  // ControlValueAccessor\n  writeValue(safe: unknown): void {\n    this.value.set(safe);\n    this.ngZone.runOutsideAngular(() => {\n      requestAnimationFrame(() => this.measureIndicator());\n    });\n  }\n\n  registerOnChange(fn: (value: unknown) => void): void {\n    this.onChange = fn;\n  }\n\n  registerOnTouched(fn: () => void): void {\n    this.onTouched = fn;\n  }\n\n  setDisabledState(isDisabled: boolean): void {\n    this.internalDisabled.set(isDisabled);\n  }\n\n  private markAsTouched(): void {\n    if (!this.touched()) {\n      this.touched.set(true);\n      this.onTouched();\n    }\n  }\n\n  private measureIndicator(): void {\n    if (!this.indicator()) return;\n\n    // SECURITY_EXCEPTION: nativeElement.querySelector required to measure indicator position for animation. Read-only measurement, SSR-safe.\n    const nativeEl = this.elementRef.nativeElement as HTMLElement;\n    const container = nativeEl.querySelector(\n      '.solaris-segmented-control__container',\n    ) as HTMLElement | null;\n    if (!container) return;\n\n    const selectedItem = container.querySelector(\n      'solaris-segmented-item[data-selected=\"true\"]',\n    ) as HTMLElement | null;\n    if (!selectedItem) return;\n\n    const isVertical = this.orientation() === 'vertical';\n\n    if (isVertical) {\n      this.indicatorTransformY.set(`translateY(${selectedItem.offsetTop}px)`);\n      this.indicatorHeight.set(`${selectedItem.offsetHeight}px`);\n    } else {\n      this.indicatorTransformX.set(`translateX(${selectedItem.offsetLeft}px)`);\n      this.indicatorWidth.set(`${selectedItem.offsetWidth}px`);\n    }\n\n    if (!this.indicatorReady()) {\n      requestAnimationFrame(() => this.indicatorReady.set(true));\n    }\n  }\n\n  private setupIndicatorMeasurement(): void {\n    if (typeof ResizeObserver !== 'undefined') {\n      this.resizeObserver = new ResizeObserver(() => {\n        this.ngZone.runOutsideAngular(() => {\n          requestAnimationFrame(() => this.measureIndicator());\n        });\n      });\n      // SECURITY_EXCEPTION: nativeElement required for ResizeObserver target. Standard DOM API, SSR-safe with typeof guard.\n      const nativeEl = this.elementRef.nativeElement as HTMLElement;\n      this.resizeObserver.observe(nativeEl);\n    }\n\n    if (typeof MutationObserver !== 'undefined') {\n      // SECURITY_EXCEPTION: nativeElement required for MutationObserver target. Standard DOM API, SSR-safe with typeof guard.\n      const nativeEl = this.elementRef.nativeElement as HTMLElement;\n      this.contentObserver = new MutationObserver(() => {\n        this.ngZone.runOutsideAngular(() => {\n          requestAnimationFrame(() => this.measureIndicator());\n        });\n      });\n      this.contentObserver.observe(nativeEl, {\n        childList: true,\n        subtree: true,\n        characterData: true,\n      });\n    }\n\n    this.ngZone.runOutsideAngular(() => {\n      requestAnimationFrame(() => this.measureIndicator());\n    });\n  }\n\n  private disconnectObserver(): void {\n    this.resizeObserver?.disconnect();\n    this.resizeObserver = null;\n    this.contentObserver?.disconnect();\n    this.contentObserver = null;\n  }\n}\n","<div class=\"solaris-segmented-control__container\">\n  <ng-content select=\"solaris-segmented-item\" />\n\n  @if (indicator() && hasValue()) {\n    <div\n      class=\"solaris-segmented-control__indicator\"\n      [class.solaris-segmented-control__indicator--animate]=\"indicatorReady()\"\n      [class.solaris-segmented-control__indicator--vertical]=\"\n        orientation() === 'vertical'\n      \"\n      [style.transform]=\"\n        orientation() === 'vertical'\n          ? indicatorTransformY()\n          : indicatorTransformX()\n      \"\n      [style.width]=\"orientation() === 'vertical' ? '' : indicatorWidth()\"\n      [style.height]=\"orientation() === 'vertical' ? indicatorHeight() : ''\"\n    ></div>\n  }\n</div>\n"]}

package/esm2022/lib/components/navigation/segmented-control/item/segmented-item.component.js

@@ -0,0 +1,197 @@
+import { input, inject, signal, computed, Component, ElementRef, ChangeDetectionStrategy, } from '@angular/core';
+import { SolarisTranslateService } from '../../../../services/translation';
+import { SolarisIconComponent } from '../../../icon';
+import { SOLARIS_SEGMENTED_CONTROL } from '../token/segmented-control.tokens';
+import * as i0 from "@angular/core";
+let nextId = 0;
+export class SolarisSegmentedItemComponent {
+    translateService = inject(SolarisTranslateService, {
+        optional: true,
+    });
+    control = inject(SOLARIS_SEGMENTED_CONTROL, {
+        optional: true,
+    });
+    elementRef = inject(ElementRef);
+    hasContent = signal(false, ...(ngDevMode ? [{ debugName: "hasContent" }] : /* istanbul ignore next */ []));
+    value = input.required(...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    label = input(undefined, ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    labelKey = input(undefined, ...(ngDevMode ? [{ debugName: "labelKey" }] : /* istanbul ignore next */ []));
+    icon = input(undefined, ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+    ariaLabel = input(undefined, ...(ngDevMode ? [{ debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
+    ariaLabelKey = input(undefined, ...(ngDevMode ? [{ debugName: "ariaLabelKey" }] : /* istanbul ignore next */ []));
+    instanceId = `solaris-segmented-item-${nextId++}`;
+    itemId = computed(() => {
+        const ctrl = this.control;
+        if (ctrl) {
+            return `solaris-segmented-item-${String(this.value())}`;
+        }
+        return this.instanceId;
+    }, ...(ngDevMode ? [{ debugName: "itemId" }] : /* istanbul ignore next */ []));
+    isSelected = computed(() => {
+        if (!this.control)
+            return false;
+        return this.control.compareFn()(this.value(), this.control.value());
+    }, ...(ngDevMode ? [{ debugName: "isSelected" }] : /* istanbul ignore next */ []));
+    isComputedDisabled = computed(() => {
+        return this.disabled() || (this.control?.disabled() ?? false);
+    }, ...(ngDevMode ? [{ debugName: "isComputedDisabled" }] : /* istanbul ignore next */ []));
+    isComputedReadonly = computed(() => {
+        return this.control?.readonly() ?? false;
+    }, ...(ngDevMode ? [{ debugName: "isComputedReadonly" }] : /* istanbul ignore next */ []));
+    isTabstop = computed(() => {
+        if (this.isComputedDisabled())
+            return false;
+        if (this.isSelected())
+            return true;
+        if (!this.control)
+            return false;
+        const items = this.control.items();
+        const firstEnabled = items.findIndex((item) => !item.isComputedDisabled());
+        return items.indexOf(this) === firstEnabled;
+    }, ...(ngDevMode ? [{ debugName: "isTabstop" }] : /* istanbul ignore next */ []));
+    isIconOnly = computed(() => {
+        return (!!this.icon() && !this.label() && !this.labelKey() && !this.hasContent());
+    }, ...(ngDevMode ? [{ debugName: "isIconOnly" }] : /* istanbul ignore next */ []));
+    ngAfterContentInit() {
+        this.updateHasContent();
+    }
+    updateHasContent() {
+        // SECURITY_EXCEPTION: nativeElement required to check projected content. SSR-safe read-only operation.
+        const nativeEl = this.elementRef.nativeElement;
+        const innerEl = nativeEl.querySelector('.solaris-segmented-item__inner');
+        if (!innerEl)
+            return;
+        for (const node of Array.from(innerEl.childNodes)) {
+            if (node.nodeType === Node.TEXT_NODE && node.textContent?.trim()) {
+                this.hasContent.set(true);
+                return;
+            }
+            if (node.nodeType === Node.ELEMENT_NODE) {
+                const el = node;
+                if (!el.classList.contains('solaris-segmented-item__icon')) {
+                    this.hasContent.set(true);
+                    return;
+                }
+            }
+        }
+    }
+    resolvedLabel = computed(() => {
+        if (this.label())
+            return this.label();
+        const labelKey = this.labelKey();
+        if (labelKey && this.translateService) {
+            return this.translateService.translate(labelKey);
+        }
+        return labelKey ?? undefined;
+    }, ...(ngDevMode ? [{ debugName: "resolvedLabel" }] : /* istanbul ignore next */ []));
+    resolvedAriaLabel = computed(() => {
+        if (this.ariaLabel())
+            return this.ariaLabel();
+        const ariaLabelKey = this.ariaLabelKey();
+        if (ariaLabelKey && this.translateService) {
+            return this.translateService.translate(ariaLabelKey);
+        }
+        return undefined;
+    }, ...(ngDevMode ? [{ debugName: "resolvedAriaLabel" }] : /* istanbul ignore next */ []));
+    index = computed(() => {
+        if (!this.control)
+            return -1;
+        return this.control.items().indexOf(this);
+    }, ...(ngDevMode ? [{ debugName: "index" }] : /* istanbul ignore next */ []));
+    onClick() {
+        if (this.isComputedDisabled())
+            return;
+        if (this.isComputedReadonly())
+            return;
+        this.control?.selectItem(this);
+    }
+    onKeydown(event) {
+        if (this.isComputedDisabled())
+            return;
+        const items = this.control?.items() ?? [];
+        const currentIndex = this.index();
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            if (!this.isComputedReadonly()) {
+                this.control?.selectItem(this);
+            }
+            return;
+        }
+        const nextIndex = this.getNextIndex(event.key, items, currentIndex);
+        if (nextIndex === null || nextIndex === currentIndex)
+            return;
+        event.preventDefault();
+        const nextItem = items[nextIndex];
+        this.control?.focusItem(nextItem);
+    }
+    getNextIndex(key, items, currentIndex) {
+        const orientation = this.control?.orientation() ?? 'horizontal';
+        switch (key) {
+            case 'ArrowRight':
+                return orientation === 'horizontal'
+                    ? this.findNextEnabled(items, currentIndex, 1)
+                    : null;
+            case 'ArrowLeft':
+                return orientation === 'horizontal'
+                    ? this.findNextEnabled(items, currentIndex, -1)
+                    : null;
+            case 'ArrowDown':
+                return orientation === 'vertical'
+                    ? this.findNextEnabled(items, currentIndex, 1)
+                    : null;
+            case 'ArrowUp':
+                return orientation === 'vertical'
+                    ? this.findNextEnabled(items, currentIndex, -1)
+                    : null;
+            case 'Home':
+                return this.findFirstEnabled(items);
+            case 'End':
+                return this.findLastEnabled(items);
+            default:
+                return null;
+        }
+    }
+    findNextEnabled(items, fromIndex, direction) {
+        let i = fromIndex + direction;
+        while (i >= 0 && i < items.length) {
+            if (!items[i].isComputedDisabled())
+                return i;
+            i += direction;
+        }
+        return null;
+    }
+    findFirstEnabled(items) {
+        for (let i = 0; i < items.length; i++) {
+            if (!items[i].isComputedDisabled())
+                return i;
+        }
+        return null;
+    }
+    findLastEnabled(items) {
+        for (let i = items.length - 1; i >= 0; i--) {
+            if (!items[i].isComputedDisabled())
+                return i;
+        }
+        return null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SolarisSegmentedItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.17", type: SolarisSegmentedItemComponent, isStandalone: true, selector: "solaris-segmented-item", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelKey: { classPropertyName: "labelKey", publicName: "labelKey", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelKey: { classPropertyName: "ariaLabelKey", publicName: "ariaLabelKey", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "radio" }, listeners: { "click": "onClick()", "keydown": "onKeydown($event)" }, properties: { "attr.id": "itemId()", "attr.data-selected": "isSelected()", "attr.data-disabled": "isComputedDisabled()", "attr.aria-checked": "isSelected()", "attr.aria-disabled": "isComputedDisabled() || undefined", "attr.aria-label": "resolvedAriaLabel() || undefined", "attr.tabindex": "isTabstop() ? \"0\" : \"-1\"", "class.solaris-segmented-item--icon-only": "isIconOnly()" } }, ngImport: i0, template: "<span class=\"solaris-segmented-item__inner\">\n  @if (icon(); as iconName) {\n    <solaris-icon\n      class=\"solaris-segmented-item__icon\"\n      [name]=\"iconName\"\n      [decorative]=\"true\"\n    />\n  }\n  @if (resolvedLabel(); as labelText) {\n    <span class=\"solaris-segmented-item__label\">{{ labelText }}</span>\n  }\n  <ng-content />\n</span>\n", styles: [":host{--solaris-segmented-item-gap: var(--solaris-spacing-2);--solaris-segmented-item-radius: var(--solaris-radius-sm);--solaris-segmented-item-color: var(--solaris-text-default);--solaris-segmented-item-padding-y: var(--solaris-spacing-2);--solaris-segmented-item-padding-x: var(--solaris-spacing-2);--solaris-segmented-item-icon-size: var(--solaris-font-size-sm);--solaris-segmented-item-font-size: var(--solaris-font-size-sm);--solaris-segmented-item-selected-color: var(--solaris-text-strong);--solaris-segmented-item-font-weight: var(--solaris-font-weight-medium);--solaris-segmented-item-hover-background: var(--solaris-surface-subtle);z-index:2;border:none;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;align-items:center;white-space:nowrap;display:inline-flex;text-decoration:none;background:transparent;gap:var(--solaris-segmented-item-gap);color:var(--solaris-segmented-item-color);padding:var(--solaris-segmented-item-padding-y) var(--solaris-segmented-item-padding-x);font:var(--solaris-segmented-item-font-weight) var(--solaris-segmented-item-font-size)/1 var(--solaris-font-family-sans);border-radius:max(var(--solaris-segmented-radius) - var(--solaris-segmented-padding),var(--solaris-segmented-padding) - var(--solaris-segmented-radius));transition:color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),background var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}:host(:hover:not([data-disabled=true]):not([data-selected=true])){background:var(--solaris-segmented-item-hover-background)}:host(.solaris-segmented-item--icon-only){--solaris-segmented-item-icon-size: calc(var(--solaris-font-size-md) * 1.2)}:host:not([data-selected=true]):not([data-disabled=true]){opacity:.5}:host(:focus-visible){outline-offset:var(--solaris-border-width-md);border-radius:var(--solaris-segmented-item-radius);outline:var(--solaris-border-width-md) solid var(--solaris-primary-base)}:host([data-selected=true]){color:var(--solaris-segmented-item-selected-color)}:host([data-disabled=true]){opacity:.15;cursor:not-allowed}:host([data-disabled=true]:focus-visible){outline:none}:host([data-selected=true][data-disabled=true]){opacity:.4}:host-context([data-orientation=vertical]){width:100%;display:flex;max-width:100%;box-sizing:border-box}.solaris-segmented-item__inner{min-width:0;align-items:center;display:inline-flex;gap:var(--solaris-segmented-item-gap)}.solaris-segmented-item__icon{flex-shrink:0;width:var(--solaris-segmented-item-icon-size);height:var(--solaris-segmented-item-icon-size)}.solaris-segmented-item__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:var(--solaris-line-height-md)}:host-context([data-size=sm]){--solaris-segmented-item-padding-y: var(--solaris-spacing-1);--solaris-segmented-item-padding-x: var(--solaris-spacing-1);--solaris-segmented-item-icon-size: var(--solaris-font-size-xs);--solaris-segmented-item-font-size: var(--solaris-font-size-xs)}:host-context([data-size=lg]){--solaris-segmented-item-padding-y: var(--solaris-spacing-3);--solaris-segmented-item-padding-x: var(--solaris-spacing-3);--solaris-segmented-item-icon-size: var(--solaris-font-size-md);--solaris-segmented-item-font-size: var(--solaris-font-size-md)}:host-context([data-size=sm][data-density=compact]){--solaris-segmented-item-gap: var(--solaris-spacing-1);--solaris-segmented-item-padding-y: var(--solaris-spacing-1);--solaris-segmented-item-padding-x: var(--solaris-spacing-1);--solaris-segmented-item-icon-size: var(--solaris-font-size-xs);--solaris-segmented-item-font-size: var(--solaris-font-size-xs)}:host-context([data-size=md][data-density=compact]){--solaris-segmented-item-gap: var(--solaris-spacing-1);--solaris-segmented-item-padding-y: var(--solaris-spacing-1);--solaris-segmented-item-padding-x: var(--solaris-spacing-1);--solaris-segmented-item-icon-size: var(--solaris-font-size-sm);--solaris-segmented-item-font-size: var(--solaris-font-size-sm)}:host-context([data-size=lg][data-density=compact]){--solaris-segmented-item-gap: var(--solaris-spacing-1);--solaris-segmented-item-padding-y: var(--solaris-spacing-2);--solaris-segmented-item-padding-x: var(--solaris-spacing-2);--solaris-segmented-item-icon-size: var(--solaris-font-size-md);--solaris-segmented-item-font-size: var(--solaris-font-size-md)}:host-context([data-appearance=surface][data-selected=true]){--solaris-segmented-item-color: var(--solaris-text-strong)}:host-context([data-appearance=outline]){--solaris-segmented-item-color: var(--solaris-text-default)}:host-context([data-full-width=true]){flex:1;justify-content:center}:host-context([data-equal-width=true]){flex:1;justify-content:center}@media(prefers-reduced-motion:reduce){:host{transition:none}}:host-context([data-reduced-motion=true]){transition:none}\n"], dependencies: [{ kind: "component", type: SolarisIconComponent, selector: "solaris-icon", inputs: ["name", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SolarisSegmentedItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'solaris-segmented-item', standalone: true, imports: [SolarisIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        role: 'radio',
+                        '[attr.id]': 'itemId()',
+                        '(click)': 'onClick()',
+                        '(keydown)': 'onKeydown($event)',
+                        '[attr.data-selected]': 'isSelected()',
+                        '[attr.data-disabled]': 'isComputedDisabled()',
+                        '[attr.aria-checked]': 'isSelected()',
+                        '[attr.aria-disabled]': 'isComputedDisabled() || undefined',
+                        '[attr.aria-label]': 'resolvedAriaLabel() || undefined',
+                        '[attr.tabindex]': 'isTabstop() ? "0" : "-1"',
+                        '[class.solaris-segmented-item--icon-only]': 'isIconOnly()',
+                    }, template: "<span class=\"solaris-segmented-item__inner\">\n  @if (icon(); as iconName) {\n    <solaris-icon\n      class=\"solaris-segmented-item__icon\"\n      [name]=\"iconName\"\n      [decorative]=\"true\"\n    />\n  }\n  @if (resolvedLabel(); as labelText) {\n    <span class=\"solaris-segmented-item__label\">{{ labelText }}</span>\n  }\n  <ng-content />\n</span>\n", styles: [":host{--solaris-segmented-item-gap: var(--solaris-spacing-2);--solaris-segmented-item-radius: var(--solaris-radius-sm);--solaris-segmented-item-color: var(--solaris-text-default);--solaris-segmented-item-padding-y: var(--solaris-spacing-2);--solaris-segmented-item-padding-x: var(--solaris-spacing-2);--solaris-segmented-item-icon-size: var(--solaris-font-size-sm);--solaris-segmented-item-font-size: var(--solaris-font-size-sm);--solaris-segmented-item-selected-color: var(--solaris-text-strong);--solaris-segmented-item-font-weight: var(--solaris-font-weight-medium);--solaris-segmented-item-hover-background: var(--solaris-surface-subtle);z-index:2;border:none;cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;align-items:center;white-space:nowrap;display:inline-flex;text-decoration:none;background:transparent;gap:var(--solaris-segmented-item-gap);color:var(--solaris-segmented-item-color);padding:var(--solaris-segmented-item-padding-y) var(--solaris-segmented-item-padding-x);font:var(--solaris-segmented-item-font-weight) var(--solaris-segmented-item-font-size)/1 var(--solaris-font-family-sans);border-radius:max(var(--solaris-segmented-radius) - var(--solaris-segmented-padding),var(--solaris-segmented-padding) - var(--solaris-segmented-radius));transition:color var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard),background var(--solaris-motion-duration-normal) var(--solaris-motion-easing-standard)}:host(:hover:not([data-disabled=true]):not([data-selected=true])){background:var(--solaris-segmented-item-hover-background)}:host(.solaris-segmented-item--icon-only){--solaris-segmented-item-icon-size: calc(var(--solaris-font-size-md) * 1.2)}:host:not([data-selected=true]):not([data-disabled=true]){opacity:.5}:host(:focus-visible){outline-offset:var(--solaris-border-width-md);border-radius:var(--solaris-segmented-item-radius);outline:var(--solaris-border-width-md) solid var(--solaris-primary-base)}:host([data-selected=true]){color:var(--solaris-segmented-item-selected-color)}:host([data-disabled=true]){opacity:.15;cursor:not-allowed}:host([data-disabled=true]:focus-visible){outline:none}:host([data-selected=true][data-disabled=true]){opacity:.4}:host-context([data-orientation=vertical]){width:100%;display:flex;max-width:100%;box-sizing:border-box}.solaris-segmented-item__inner{min-width:0;align-items:center;display:inline-flex;gap:var(--solaris-segmented-item-gap)}.solaris-segmented-item__icon{flex-shrink:0;width:var(--solaris-segmented-item-icon-size);height:var(--solaris-segmented-item-icon-size)}.solaris-segmented-item__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:var(--solaris-line-height-md)}:host-context([data-size=sm]){--solaris-segmented-item-padding-y: var(--solaris-spacing-1);--solaris-segmented-item-padding-x: var(--solaris-spacing-1);--solaris-segmented-item-icon-size: var(--solaris-font-size-xs);--solaris-segmented-item-font-size: var(--solaris-font-size-xs)}:host-context([data-size=lg]){--solaris-segmented-item-padding-y: var(--solaris-spacing-3);--solaris-segmented-item-padding-x: var(--solaris-spacing-3);--solaris-segmented-item-icon-size: var(--solaris-font-size-md);--solaris-segmented-item-font-size: var(--solaris-font-size-md)}:host-context([data-size=sm][data-density=compact]){--solaris-segmented-item-gap: var(--solaris-spacing-1);--solaris-segmented-item-padding-y: var(--solaris-spacing-1);--solaris-segmented-item-padding-x: var(--solaris-spacing-1);--solaris-segmented-item-icon-size: var(--solaris-font-size-xs);--solaris-segmented-item-font-size: var(--solaris-font-size-xs)}:host-context([data-size=md][data-density=compact]){--solaris-segmented-item-gap: var(--solaris-spacing-1);--solaris-segmented-item-padding-y: var(--solaris-spacing-1);--solaris-segmented-item-padding-x: var(--solaris-spacing-1);--solaris-segmented-item-icon-size: var(--solaris-font-size-sm);--solaris-segmented-item-font-size: var(--solaris-font-size-sm)}:host-context([data-size=lg][data-density=compact]){--solaris-segmented-item-gap: var(--solaris-spacing-1);--solaris-segmented-item-padding-y: var(--solaris-spacing-2);--solaris-segmented-item-padding-x: var(--solaris-spacing-2);--solaris-segmented-item-icon-size: var(--solaris-font-size-md);--solaris-segmented-item-font-size: var(--solaris-font-size-md)}:host-context([data-appearance=surface][data-selected=true]){--solaris-segmented-item-color: var(--solaris-text-strong)}:host-context([data-appearance=outline]){--solaris-segmented-item-color: var(--solaris-text-default)}:host-context([data-full-width=true]){flex:1;justify-content:center}:host-context([data-equal-width=true]){flex:1;justify-content:center}@media(prefers-reduced-motion:reduce){:host{transition:none}}:host-context([data-reduced-motion=true]){transition:none}\n"] }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], labelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelKey", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }], ariaLabelKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabelKey", required: false }] }] } });
+//# sourceMappingURL=segmented-item.component.js.map

package/esm2022/lib/components/navigation/segmented-control/item/segmented-item.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"segmented-item.component.js","sourceRoot":"","sources":["../../../../../../../../../packages/angular/src/lib/components/navigation/segmented-control/item/segmented-item.component.ts","../../../../../../../../../packages/angular/src/lib/components/navigation/segmented-control/item/segmented-item.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n  input,\n  inject,\n  signal,\n  computed,\n  Component,\n  ElementRef,\n  AfterContentInit,\n  ChangeDetectionStrategy,\n} from '@angular/core';\n\nimport { SolarisTranslateService } from '../../../../services/translation';\nimport { SolarisIconComponent } from '../../../icon';\nimport { SOLARIS_SEGMENTED_CONTROL } from '../token/segmented-control.tokens';\n\nlet nextId = 0;\n\n@Component({\n  selector: 'solaris-segmented-item',\n  standalone: true,\n  imports: [SolarisIconComponent],\n  templateUrl: './segmented-item.component.html',\n  styleUrls: ['./segmented-item.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    role: 'radio',\n    '[attr.id]': 'itemId()',\n    '(click)': 'onClick()',\n    '(keydown)': 'onKeydown($event)',\n    '[attr.data-selected]': 'isSelected()',\n    '[attr.data-disabled]': 'isComputedDisabled()',\n    '[attr.aria-checked]': 'isSelected()',\n    '[attr.aria-disabled]': 'isComputedDisabled() || undefined',\n    '[attr.aria-label]': 'resolvedAriaLabel() || undefined',\n    '[attr.tabindex]': 'isTabstop() ? \"0\" : \"-1\"',\n    '[class.solaris-segmented-item--icon-only]': 'isIconOnly()',\n  },\n})\nexport class SolarisSegmentedItemComponent implements AfterContentInit {\n  private readonly translateService = inject(SolarisTranslateService, {\n    optional: true,\n  });\n  private readonly control = inject(SOLARIS_SEGMENTED_CONTROL, {\n    optional: true,\n  });\n  private readonly elementRef = inject(ElementRef);\n\n  protected readonly hasContent = signal(false);\n\n  readonly value = input.required<unknown>();\n  readonly label = input<string | undefined>(undefined);\n  readonly labelKey = input<string | undefined>(undefined);\n  readonly icon = input<string | undefined>(undefined);\n  readonly disabled = input<boolean>(false);\n  readonly ariaLabel = input<string | undefined>(undefined);\n  readonly ariaLabelKey = input<string | undefined>(undefined);\n\n  protected readonly instanceId = `solaris-segmented-item-${nextId++}`;\n\n  protected readonly itemId = computed(() => {\n    const ctrl = this.control;\n    if (ctrl) {\n      return `solaris-segmented-item-${String(this.value())}`;\n    }\n    return this.instanceId;\n  });\n\n  readonly isSelected = computed(() => {\n    if (!this.control) return false;\n    return this.control.compareFn()(this.value(), this.control.value());\n  });\n\n  readonly isComputedDisabled = computed(() => {\n    return this.disabled() || (this.control?.disabled() ?? false);\n  });\n\n  readonly isComputedReadonly = computed(() => {\n    return this.control?.readonly() ?? false;\n  });\n\n  readonly isTabstop = computed(() => {\n    if (this.isComputedDisabled()) return false;\n    if (this.isSelected()) return true;\n    if (!this.control) return false;\n    const items = this.control.items();\n    const firstEnabled = items.findIndex((item) => !item.isComputedDisabled());\n    return items.indexOf(this) === firstEnabled;\n  });\n\n  protected readonly isIconOnly = computed(() => {\n    return (\n      !!this.icon() && !this.label() && !this.labelKey() && !this.hasContent()\n    );\n  });\n\n  ngAfterContentInit(): void {\n    this.updateHasContent();\n  }\n\n  private updateHasContent(): void {\n    // SECURITY_EXCEPTION: nativeElement required to check projected content. SSR-safe read-only operation.\n    const nativeEl = this.elementRef.nativeElement as HTMLElement;\n    const innerEl = nativeEl.querySelector('.solaris-segmented-item__inner');\n    if (!innerEl) return;\n    for (const node of Array.from(innerEl.childNodes)) {\n      if (node.nodeType === Node.TEXT_NODE && node.textContent?.trim()) {\n        this.hasContent.set(true);\n        return;\n      }\n      if (node.nodeType === Node.ELEMENT_NODE) {\n        const el = node as HTMLElement;\n        if (!el.classList.contains('solaris-segmented-item__icon')) {\n          this.hasContent.set(true);\n          return;\n        }\n      }\n    }\n  }\n\n  readonly resolvedLabel = computed(() => {\n    if (this.label()) return this.label();\n    const labelKey = this.labelKey();\n    if (labelKey && this.translateService) {\n      return this.translateService.translate(labelKey);\n    }\n    return labelKey ?? undefined;\n  });\n\n  protected readonly resolvedAriaLabel = computed(() => {\n    if (this.ariaLabel()) return this.ariaLabel();\n    const ariaLabelKey = this.ariaLabelKey();\n    if (ariaLabelKey && this.translateService) {\n      return this.translateService.translate(ariaLabelKey);\n    }\n    return undefined;\n  });\n\n  protected readonly index = computed(() => {\n    if (!this.control) return -1;\n    return this.control.items().indexOf(this);\n  });\n\n  protected onClick(): void {\n    if (this.isComputedDisabled()) return;\n    if (this.isComputedReadonly()) return;\n    this.control?.selectItem(this);\n  }\n\n  protected onKeydown(event: KeyboardEvent): void {\n    if (this.isComputedDisabled()) return;\n\n    const items = this.control?.items() ?? [];\n    const currentIndex = this.index();\n\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      if (!this.isComputedReadonly()) {\n        this.control?.selectItem(this);\n      }\n      return;\n    }\n\n    const nextIndex = this.getNextIndex(event.key, items, currentIndex);\n\n    if (nextIndex === null || nextIndex === currentIndex) return;\n\n    event.preventDefault();\n\n    const nextItem = items[nextIndex];\n    this.control?.focusItem(nextItem);\n  }\n\n  private getNextIndex(\n    key: string,\n    items: ReadonlyArray<SolarisSegmentedItemComponent>,\n    currentIndex: number,\n  ): number | null {\n    const orientation = this.control?.orientation() ?? 'horizontal';\n\n    switch (key) {\n      case 'ArrowRight':\n        return orientation === 'horizontal'\n          ? this.findNextEnabled(items, currentIndex, 1)\n          : null;\n\n      case 'ArrowLeft':\n        return orientation === 'horizontal'\n          ? this.findNextEnabled(items, currentIndex, -1)\n          : null;\n\n      case 'ArrowDown':\n        return orientation === 'vertical'\n          ? this.findNextEnabled(items, currentIndex, 1)\n          : null;\n\n      case 'ArrowUp':\n        return orientation === 'vertical'\n          ? this.findNextEnabled(items, currentIndex, -1)\n          : null;\n\n      case 'Home':\n        return this.findFirstEnabled(items);\n\n      case 'End':\n        return this.findLastEnabled(items);\n\n      default:\n        return null;\n    }\n  }\n\n  private findNextEnabled(\n    items: ReadonlyArray<SolarisSegmentedItemComponent>,\n    fromIndex: number,\n    direction: 1 | -1,\n  ): number | null {\n    let i = fromIndex + direction;\n    while (i >= 0 && i < items.length) {\n      if (!items[i].isComputedDisabled()) return i;\n      i += direction;\n    }\n    return null;\n  }\n\n  private findFirstEnabled(\n    items: ReadonlyArray<SolarisSegmentedItemComponent>,\n  ): number | null {\n    for (let i = 0; i < items.length; i++) {\n      if (!items[i].isComputedDisabled()) return i;\n    }\n    return null;\n  }\n\n  private findLastEnabled(\n    items: ReadonlyArray<SolarisSegmentedItemComponent>,\n  ): number | null {\n    for (let i = items.length - 1; i >= 0; i--) {\n      if (!items[i].isComputedDisabled()) return i;\n    }\n    return null;\n  }\n}\n","<span class=\"solaris-segmented-item__inner\">\n  @if (icon(); as iconName) {\n    <solaris-icon\n      class=\"solaris-segmented-item__icon\"\n      [name]=\"iconName\"\n      [decorative]=\"true\"\n    />\n  }\n  @if (resolvedLabel(); as labelText) {\n    <span class=\"solaris-segmented-item__label\">{{ labelText }}</span>\n  }\n  <ng-content />\n</span>\n"]}

package/esm2022/lib/components/navigation/segmented-control/model/segmented-control.types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=segmented-control.types.js.map

package/esm2022/lib/components/navigation/segmented-control/model/segmented-control.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"segmented-control.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/angular/src/lib/components/navigation/segmented-control/model/segmented-control.types.ts"],"names":[],"mappings":"","sourcesContent":["export type SolarisSegmentedControlOrientation = 'horizontal' | 'vertical';\n\nexport type SolarisSegmentedControlAppearance = 'surface' | 'outline';\n\nexport type SolarisSegmentedControlSize = 'sm' | 'md' | 'lg';\n\nexport type SolarisSegmentedControlDensity = 'compact' | 'comfortable';\n\nexport type SolarisSegmentedControlRadius = 'sm' | 'md' | 'lg' | 'full';\n\nexport interface SolarisSegmentedControlValueChangeEvent {\n  value: unknown;\n}\n\nexport interface SolarisSegmentedControlChangeEvent {\n  value: unknown;\n  previousValue: unknown;\n}\n"]}

package/esm2022/lib/components/navigation/segmented-control/token/segmented-control.tokens.js

@@ -0,0 +1,3 @@
+import { InjectionToken } from '@angular/core';
+export const SOLARIS_SEGMENTED_CONTROL = new InjectionToken('SolarisSegmentedControl');
+//# sourceMappingURL=segmented-control.tokens.js.map

package/esm2022/lib/components/navigation/segmented-control/token/segmented-control.tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"segmented-control.tokens.js","sourceRoot":"","sources":["../../../../../../../../../packages/angular/src/lib/components/navigation/segmented-control/token/segmented-control.tokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAe,MAAM,eAAe,CAAC;AA8B5D,MAAM,CAAC,MAAM,yBAAyB,GACpC,IAAI,cAAc,CAChB,yBAAyB,CAC1B,CAAC","sourcesContent":["import { InjectionToken, type Signal } from '@angular/core';\n\nimport type {\n  SolarisSegmentedControlOrientation,\n  SolarisSegmentedControlAppearance,\n  SolarisSegmentedControlSize,\n  SolarisSegmentedControlDensity,\n  SolarisSegmentedControlRadius,\n} from '../model/segmented-control.types';\nimport type { SolarisSegmentedItemComponent } from '../item/segmented-item.component';\n\nexport interface SolarisSegmentedControlInterface {\n  value: Signal<unknown>;\n  items: Signal<ReadonlyArray<SolarisSegmentedItemComponent>>;\n  orientation: Signal<SolarisSegmentedControlOrientation>;\n  appearance: Signal<SolarisSegmentedControlAppearance>;\n  size: Signal<SolarisSegmentedControlSize>;\n  density: Signal<SolarisSegmentedControlDensity>;\n  radius: Signal<SolarisSegmentedControlRadius>;\n  disabled: Signal<boolean>;\n  readonly: Signal<boolean>;\n  invalid: Signal<boolean>;\n  fullWidth: Signal<boolean>;\n  equalWidth: Signal<boolean>;\n  indicator: Signal<boolean>;\n  compareFn: Signal<(a: unknown, b: unknown) => boolean>;\n  selectItem: (item: SolarisSegmentedItemComponent) => void;\n  focusItem: (item: SolarisSegmentedItemComponent) => void;\n}\n\nexport const SOLARIS_SEGMENTED_CONTROL =\n  new InjectionToken<SolarisSegmentedControlInterface>(\n    'SolarisSegmentedControl',\n  );\n"]}

package/esm2022/lib/components/navigation/stepper/actions/stepper-actions.component.js

@@ -0,0 +1,15 @@
+import { Component, input, ChangeDetectionStrategy } from '@angular/core';
+import * as i0 from "@angular/core";
+export class SolarisStepperActionsComponent {
+    align = input('end', ...(ngDevMode ? [{ debugName: "align" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SolarisStepperActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.17", type: SolarisStepperActionsComponent, isStandalone: true, selector: "solaris-stepper-actions", inputs: { align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-align": "align()" }, classAttribute: "solaris-stepper-actions" }, ngImport: i0, template: "<ng-content />\n", styles: [":host{display:flex;gap:var(--solaris-spacing-3);padding-top:var(--solaris-spacing-6)}:host([data-align=start]){justify-content:flex-start}:host([data-align=center]){justify-content:center}:host([data-align=end]){justify-content:flex-end}:host([data-align=space-between]){justify-content:space-between}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.17", ngImport: i0, type: SolarisStepperActionsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'solaris-stepper-actions', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[attr.data-align]': 'align()',
+                        class: 'solaris-stepper-actions',
+                    }, template: "<ng-content />\n", styles: [":host{display:flex;gap:var(--solaris-spacing-3);padding-top:var(--solaris-spacing-6)}:host([data-align=start]){justify-content:flex-start}:host([data-align=center]){justify-content:center}:host([data-align=end]){justify-content:flex-end}:host([data-align=space-between]){justify-content:space-between}\n"] }]
+        }], propDecorators: { align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }] } });
+//# sourceMappingURL=stepper-actions.component.js.map