npm - @raintonic/formaui - Versions diffs - 0.2.1 → 0.3.1 - Mend

@raintonic/formaui 0.2.1 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (171) hide show

package/fesm2022/raintonic-formaui-components-slider.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"raintonic-formaui-components-slider.mjs","sources":["../../../lib/components/slider/slider.component.ts","../../../lib/components/slider/slider.component.html","../../../lib/components/slider/raintonic-formaui-components-slider.ts"],"sourcesContent":["import {\r\n Component,\r\n ChangeDetectionStrategy,\r\n ViewEncapsulation,\r\n input,\r\n output,\r\n computed,\r\n signal,\r\n viewChild,\r\n ElementRef,\r\n Signal,\r\n WritableSignal,\r\n OnDestroy,\r\n booleanAttribute,\r\n DOCUMENT,\r\n inject,\r\n} from '@angular/core';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\nimport { SliderValue, SliderFormatLabelFn } from './slider.types';\r\n\r\n/*\r\n # FuiSliderComponent\r\n \r\n A slider (range input) component with single and dual-thumb (range) support.\r\n * Integrates with Angular Reactive Forms via ControlValueAccessor.\r\n \r\n ## Features\r\n * - Single value and range (dual-thumb) modes\r\n * - Configurable min/max/step\r\n * - Optional tick marks and tooltips\r\n * - Custom label formatting\r\n * - Keyboard navigation (Arrow keys, Home, End, PageUp/Down)\r\n * - Drag and click-to-move interaction\r\n * - Full accessibility (ARIA slider role)\r\n \r\n ## Usage\r\n \r\n ### Basic Slider\r\n * ```html\r\n * <fui-slider [formControl]=\"volumeControl\"></fui-slider>\r\n * ```\r\n \r\n ### Range Slider\r\n * ```html\r\n * <fui-slider [range]=\"true\" [formControl]=\"priceRange\"></fui-slider>\r\n * ```\r\n \r\n ### With Ticks and Custom Label\r\n * ```html\r\n * <fui-slider [showTicks]=\"true\" [formatLabel]=\"formatCurrency\" [min]=\"0\" [max]=\"1000\" [step]=\"100\"></fui-slider>\r\n * ```\r\n /\r\n@Component({\r\n selector: 'fui-slider',\r\n standalone: true,\r\n imports: [],\r\n templateUrl: './slider.component.html',\r\n styleUrls: ['./slider.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n host: {\r\n class: 'fui-slider',\r\n '[class.fui-slider--disabled]': 'disabled()',\r\n '[class.fui-slider--range]': 'range()',\r\n '[class.fui-slider--dragging]': '_dragging() !== null',\r\n },\r\n providers: [\r\n {\r\n provide: NG_VALUE_ACCESSOR,\r\n useExisting: FuiSliderComponent,\r\n multi: true,\r\n },\r\n ],\r\n})\r\nexport class FuiSliderComponent implements ControlValueAccessor, OnDestroy {\r\n private readonly _document = inject(DOCUMENT);\r\n\r\n // Inputs\r\n readonly min = input(0);\r\n readonly max = input(100);\r\n readonly step = input(1);\r\n readonly range = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n readonly showTicks = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n readonly showTooltip = input<boolean, unknown>(true, { transform: booleanAttribute });\r\n readonly formatLabel = input<SliderFormatLabelFn>((v: number) => String(v));\r\n readonly disabled = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n readonly ariaLabel = input<string \| null>(null, { alias: 'aria-label' });\r\n readonly ariaLabelLow = input<string \| null>(null);\r\n readonly ariaLabelHigh = input<string \| null>(null);\r\n\r\n // Outputs\r\n readonly valueChange = output<SliderValue>();\r\n readonly dragStart = output();\r\n readonly dragEnd = output();\r\n\r\n // Internal state\r\n readonly _value: WritableSignal<number> = signal(0);\r\n readonly _valueLow: WritableSignal<number> = signal(0);\r\n readonly _valueHigh: WritableSignal<number> = signal(100);\r\n readonly _dragging: WritableSignal<'low' \| 'high' \| null> = signal(null);\r\n readonly _hovered: WritableSignal<'low' \| 'high' \| null> = signal(null);\r\n\r\n // ViewChild\r\n readonly _sliderContainer: Signal<ElementRef<HTMLElement> \| undefined> =\r\n viewChild<ElementRef<HTMLElement>>('sliderContainer');\r\n\r\n // Computed: percentages\r\n readonly _percentage: Signal<number> = computed(() => this._valueToPercent(this._value()));\r\n\r\n readonly _percentageLow: Signal<number> = computed(() => this._valueToPercent(this._valueLow()));\r\n\r\n readonly _percentageHigh: Signal<number> = computed(() => this._valueToPercent(this._valueHigh()));\r\n\r\n // Computed: tick values\r\n readonly _tickValues: Signal<number[]> = computed(() => {\r\n const minVal = this.min();\r\n const maxVal = this.max();\r\n const stepVal = this.step();\r\n const ticks: number[] = [];\r\n for (let v = minVal; v <= maxVal; v += stepVal) {\r\n ticks.push(v);\r\n }\r\n // Ensure max is included\r\n if (ticks[ticks.length - 1] !== maxVal) {\r\n ticks.push(maxVal);\r\n }\r\n return ticks;\r\n });\r\n\r\n // CVA callbacks\r\n private _onChange: (value: SliderValue) => void = () => {\r\n // Intentionally empty: will be replaced by Angular forms\r\n };\r\n private _onTouched: () => void = () => {\r\n // Intentionally empty: will be replaced by Angular forms\r\n };\r\n\r\n // Bound event handlers for cleanup\r\n private _boundOnMouseMove = this._onMouseMove.bind(this);\r\n private _boundOnMouseUp = this._onMouseUp.bind(this);\r\n private _boundOnTouchMove = this._onTouchMove.bind(this);\r\n private _boundOnTouchEnd = this._onTouchEnd.bind(this);\r\n\r\n // ControlValueAccessor\r\n writeValue(value: SliderValue): void {\r\n if (value == null) return;\r\n\r\n if (Array.isArray(value)) {\r\n this._valueLow.set(this._clamp(value[0], this.min(), this.max()));\r\n this._valueHigh.set(this._clamp(value[1], this.min(), this.max()));\r\n } else {\r\n this._value.set(this._clamp(value, this.min(), this.max()));\r\n }\r\n }\r\n\r\n registerOnChange(fn: (value: SliderValue) => void): void {\r\n this._onChange = fn;\r\n }\r\n\r\n registerOnTouched(fn: () => void): void {\r\n this._onTouched = fn;\r\n }\r\n\r\n setDisabledState(_isDisabled: boolean): void {\r\n // disabled is handled by input signal\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this._removeDocumentListeners();\r\n }\r\n\r\n // === Public helpers (used in template) ===\r\n\r\n _valueToPercent(value: number): number {\r\n const minVal = this.min();\r\n const maxVal = this.max();\r\n if (maxVal === minVal) return 0;\r\n return ((value - minVal) / (maxVal - minVal)) 100;\r\n }\r\n\r\n _isTickActive(tick: number): boolean {\r\n if (this.range()) {\r\n return tick >= this._valueLow() && tick <= this._valueHigh();\r\n }\r\n return tick <= this._value();\r\n }\r\n\r\n _snapToStep(value: number): number {\r\n const stepVal = this.step();\r\n const minVal = this.min();\r\n const snapped = Math.round((value - minVal) / stepVal) * stepVal + minVal;\r\n // Clamp to min/max and round to avoid floating point issues\r\n return this._clamp(parseFloat(snapped.toFixed(10)), this.min(), this.max());\r\n }\r\n\r\n _clamp(value: number, min: number, max: number): number {\r\n return Math.min(Math.max(value, min), max);\r\n }\r\n\r\n // === Event handlers ===\r\n\r\n _onTrackClick(event: MouseEvent): void {\r\n if (this.disabled()) return;\r\n // Ignore clicks on thumb elements\r\n const target = event.target as HTMLElement;\r\n if (target.classList.contains('fui-slider__thumb')) return;\r\n\r\n const value = this._getValueFromEvent(event);\r\n if (value === null) return;\r\n\r\n this._setNearestThumb(value);\r\n this._emitChange();\r\n this._onTouched();\r\n }\r\n\r\n _onThumbMouseDown(event: MouseEvent, thumb: 'low' \| 'high'): void {\r\n if (this.disabled()) return;\r\n event.preventDefault();\r\n event.stopPropagation();\r\n\r\n this._dragging.set(thumb);\r\n this.dragStart.emit();\r\n\r\n this._document.addEventListener('mousemove', this._boundOnMouseMove);\r\n this._document.addEventListener('mouseup', this._boundOnMouseUp);\r\n }\r\n\r\n _onThumbTouchStart(event: TouchEvent, thumb: 'low' \| 'high'): void {\r\n if (this.disabled()) return;\r\n event.preventDefault();\r\n event.stopPropagation();\r\n\r\n this._dragging.set(thumb);\r\n this.dragStart.emit();\r\n\r\n this._document.addEventListener('touchmove', this._boundOnTouchMove, { passive: false });\r\n this._document.addEventListener('touchend', this._boundOnTouchEnd);\r\n }\r\n\r\n _onThumbKeydown(event: KeyboardEvent, thumb: 'low' \| 'high'): void {\r\n if (this.disabled()) return;\r\n\r\n const stepVal = this.step();\r\n let delta = 0;\r\n\r\n switch (event.key) {\r\n case 'ArrowRight':\r\n case 'ArrowUp':\r\n delta = stepVal;\r\n break;\r\n case 'ArrowLeft':\r\n case 'ArrowDown':\r\n delta = -stepVal;\r\n break;\r\n case 'PageUp':\r\n delta = stepVal * 10;\r\n break;\r\n case 'PageDown':\r\n delta = -stepVal * 10;\r\n break;\r\n case 'Home':\r\n this._setThumbValue(thumb, this.min());\r\n this._emitChange();\r\n event.preventDefault();\r\n return;\r\n case 'End':\r\n this._setThumbValue(thumb, this.max());\r\n this._emitChange();\r\n event.preventDefault();\r\n return;\r\n default:\r\n return;\r\n }\r\n\r\n event.preventDefault();\r\n const currentValue = this._getThumbValue(thumb);\r\n const newValue = this._snapToStep(this._clamp(currentValue + delta, this.min(), this.max()));\r\n this._setThumbValue(thumb, newValue);\r\n this._emitChange();\r\n this._onTouched();\r\n }\r\n\r\n // === Private methods ===\r\n\r\n private _onMouseMove(event: MouseEvent): void {\r\n const value = this._getValueFromEvent(event);\r\n if (value === null) return;\r\n this._updateDraggingThumb(value);\r\n }\r\n\r\n private _onMouseUp(): void {\r\n this._endDrag();\r\n this._document.removeEventListener('mousemove', this._boundOnMouseMove);\r\n this._document.removeEventListener('mouseup', this._boundOnMouseUp);\r\n }\r\n\r\n private _onTouchMove(event: TouchEvent): void {\r\n event.preventDefault();\r\n if (event.touches.length === 0) return;\r\n const touch = event.touches[0];\r\n const value = this._getValueFromClientX(touch.clientX);\r\n if (value === null) return;\r\n this._updateDraggingThumb(value);\r\n }\r\n\r\n private _onTouchEnd(): void {\r\n this._endDrag();\r\n this._document.removeEventListener('touchmove', this._boundOnTouchMove);\r\n this._document.removeEventListener('touchend', this._boundOnTouchEnd);\r\n }\r\n\r\n private _endDrag(): void {\r\n if (this._dragging() !== null) {\r\n this._dragging.set(null);\r\n this.dragEnd.emit();\r\n this._onTouched();\r\n }\r\n }\r\n\r\n private _removeDocumentListeners(): void {\r\n this._document.removeEventListener('mousemove', this._boundOnMouseMove);\r\n this._document.removeEventListener('mouseup', this._boundOnMouseUp);\r\n this._document.removeEventListener('touchmove', this._boundOnTouchMove);\r\n this._document.removeEventListener('touchend', this._boundOnTouchEnd);\r\n }\r\n\r\n private _getValueFromEvent(event: MouseEvent): number \| null {\r\n return this._getValueFromClientX(event.clientX);\r\n }\r\n\r\n private _getValueFromClientX(clientX: number): number \| null {\r\n const container = this._sliderContainer();\r\n if (!container) return null;\r\n\r\n const rect = container.nativeElement.getBoundingClientRect();\r\n const percent = this._clamp((clientX - rect.left) / rect.width, 0, 1);\r\n const rawValue = this.min() + percent * (this.max() - this.min());\r\n return this._snapToStep(rawValue);\r\n }\r\n\r\n private _updateDraggingThumb(value: number): void {\r\n const thumb = this._dragging();\r\n if (thumb === null) return;\r\n this._setThumbValue(thumb, value);\r\n this._emitChange();\r\n }\r\n\r\n private _getThumbValue(thumb: 'low' \| 'high'): number {\r\n if (this.range()) {\r\n return thumb === 'low' ? this._valueLow() : this._valueHigh();\r\n }\r\n return this._value();\r\n }\r\n\r\n private _setThumbValue(thumb: 'low' \| 'high', value: number): void {\r\n if (this.range()) {\r\n if (thumb === 'low') {\r\n // Prevent low from exceeding high\r\n this._valueLow.set(this._clamp(value, this.min(), this._valueHigh()));\r\n } else {\r\n // Prevent high from going below low\r\n this._valueHigh.set(this._clamp(value, this._valueLow(), this.max()));\r\n }\r\n } else {\r\n this._value.set(value);\r\n }\r\n }\r\n\r\n private _setNearestThumb(value: number): void {\r\n if (this.range()) {\r\n const distLow = Math.abs(value - this._valueLow());\r\n const distHigh = Math.abs(value - this._valueHigh());\r\n if (distLow <= distHigh) {\r\n this._setThumbValue('low', value);\r\n } else {\r\n this._setThumbValue('high', value);\r\n }\r\n } else {\r\n this._value.set(value);\r\n }\r\n }\r\n\r\n private _emitChange(): void {\r\n const val = this.range() ? ([this._valueLow(), this._valueHigh()] as [number, number]) : this._value();\r\n this._onChange(val);\r\n this.valueChange.emit(val);\r\n }\r\n}\r\n","<div class=\"fui-slider__container\" (click)=\"_onTrackClick($event)\" #sliderContainer>\r\n <div class=\"fui-slider__track\">\r\n <div\r\n class=\"fui-slider__track-fill\"\r\n [style.left.%]=\"range() ? _percentageLow() : 0\"\r\n [style.width.%]=\"range() ? _percentageHigh() - _percentageLow() : _percentage()\"\r\n ></div>\r\n </div>\r\n\r\n @if (showTicks()) {\r\n <div class=\"fui-slider__ticks\">\r\n @for (tick of _tickValues(); track tick) {\r\n <div\r\n class=\"fui-slider__tick\"\r\n [style.left.%]=\"_valueToPercent(tick)\"\r\n [class.fui-slider__tick--active]=\"_isTickActive(tick)\"\r\n ></div>\r\n }\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"fui-slider__thumb fui-slider__thumb--low\"\r\n [style.left.%]=\"range() ? _percentageLow() : _percentage()\"\r\n role=\"slider\"\r\n [attr.aria-valuenow]=\"range() ? _valueLow() : _value()\"\r\n [attr.aria-valuemin]=\"min()\"\r\n [attr.aria-valuemax]=\"range() ? _valueHigh() : max()\"\r\n [attr.aria-label]=\"range() ? ariaLabelLow() \|\| 'Minimum value' : ariaLabel() \|\| null\"\r\n aria-orientation=\"horizontal\"\r\n [attr.aria-disabled]=\"disabled()\"\r\n [attr.tabindex]=\"disabled() ? -1 : 0\"\r\n (mousedown)=\"_onThumbMouseDown($event, 'low')\"\r\n (touchstart)=\"_onThumbTouchStart($event, 'low')\"\r\n (keydown)=\"_onThumbKeydown($event, 'low')\"\r\n (focus)=\"_hovered.set('low')\"\r\n (blur)=\"_hovered.set(null)\"\r\n >\r\n @if (showTooltip() && (_dragging() === 'low' \|\| _hovered() === 'low')) {\r\n <div class=\"fui-slider__tooltip\">{{ formatLabel()(range() ? _valueLow() : _value()) }}</div>\r\n }\r\n </div>\r\n\r\n @if (range()) {\r\n <div\r\n class=\"fui-slider__thumb fui-slider__thumb--high\"\r\n [style.left.%]=\"_percentageHigh()\"\r\n role=\"slider\"\r\n [attr.aria-valuenow]=\"_valueHigh()\"\r\n [attr.aria-valuemin]=\"_valueLow()\"\r\n [attr.aria-valuemax]=\"max()\"\r\n [attr.aria-label]=\"ariaLabelHigh() \|\| 'Maximum value'\"\r\n aria-orientation=\"horizontal\"\r\n [attr.aria-disabled]=\"disabled()\"\r\n [attr.tabindex]=\"disabled() ? -1 : 0\"\r\n (mousedown)=\"_onThumbMouseDown($event, 'high')\"\r\n (touchstart)=\"_onThumbTouchStart($event, 'high')\"\r\n (keydown)=\"_onThumbKeydown($event, 'high')\"\r\n (focus)=\"_hovered.set('high')\"\r\n (blur)=\"_hovered.set(null)\"\r\n >\r\n @if (showTooltip() && (_dragging() === 'high' \|\| _hovered() === 'high')) {\r\n <div class=\"fui-slider__tooltip\">{{ formatLabel()(_valueHigh()) }}</div>\r\n }\r\n </div>\r\n }\r\n</div>\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;;AAoBA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BG;MAuBU,kBAAkB,CAAA;AACZ,IAAA,SAAS,GAAG,MAAM,CAAC,QAAQ,CAAC;;AAGpC,IAAA,GAAG,GAAG,KAAK,CAAC,CAAC,0EAAC;AACd,IAAA,GAAG,GAAG,KAAK,CAAC,GAAG,0EAAC;AAChB,IAAA,IAAI,GAAG,KAAK,CAAC,CAAC,2EAAC;IACf,KAAK,GAAG,KAAK,CAAmB,KAAK,6EAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;IACvE,SAAS,GAAG,KAAK,CAAmB,KAAK,iFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;IAC3E,WAAW,GAAG,KAAK,CAAmB,IAAI,mFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAC5E,IAAA,WAAW,GAAG,KAAK,CAAsB,CAAC,CAAS,KAAK,MAAM,CAAC,CAAC,CAAC,kFAAC;IAClE,QAAQ,GAAG,KAAK,CAAmB,KAAK,gFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;IAC1E,SAAS,GAAG,KAAK,CAAgB,IAAI,iFAAI,KAAK,EAAE,YAAY,EAAA,CAAG;AAC/D,IAAA,YAAY,GAAG,KAAK,CAAgB,IAAI,mFAAC;AACzC,IAAA,aAAa,GAAG,KAAK,CAAgB,IAAI,oFAAC;;IAG1C,WAAW,GAAG,MAAM,EAAe;IACnC,SAAS,GAAG,MAAM,EAAE;IACpB,OAAO,GAAG,MAAM,EAAE;;AAGlB,IAAA,MAAM,GAA2B,MAAM,CAAC,CAAC,6EAAC;AAC1C,IAAA,SAAS,GAA2B,MAAM,CAAC,CAAC,gFAAC;AAC7C,IAAA,UAAU,GAA2B,MAAM,CAAC,GAAG,iFAAC;AAChD,IAAA,SAAS,GAA0C,MAAM,CAAC,IAAI,gFAAC;AAC/D,IAAA,QAAQ,GAA0C,MAAM,CAAC,IAAI,+EAAC;;AAG9D,IAAA,gBAAgB,GACvB,SAAS,CAA0B,iBAAiB,uFAAC;;AAG9C,IAAA,WAAW,GAAmB,QAAQ,CAAC,MAAM,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,kFAAC;AAEjF,IAAA,cAAc,GAAmB,QAAQ,CAAC,MAAM,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,qFAAC;AAEvF,IAAA,eAAe,GAAmB,QAAQ,CAAC,MAAM,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,sFAAC;;AAGzF,IAAA,WAAW,GAAqB,QAAQ,CAAC,MAAK;AACrD,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,EAAE;AACzB,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,EAAE;AACzB,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,EAAE;QAC3B,MAAM,KAAK,GAAa,EAAE;AAC1B,QAAA,KAAK,IAAI,CAAC,GAAG,MAAM,EAAE,CAAC,IAAI,MAAM,EAAE,CAAC,IAAI,OAAO,EAAE;AAC9C,YAAA,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;QACf;;QAEA,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,KAAK,MAAM,EAAE;AACtC,YAAA,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC;QACpB;AACA,QAAA,OAAO,KAAK;AACd,IAAA,CAAC,kFAAC;;IAGM,SAAS,GAAiC,MAAK;;AAEvD,IAAA,CAAC;IACO,UAAU,GAAe,MAAK;;AAEtC,IAAA,CAAC;;IAGO,iBAAiB,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;IAChD,eAAe,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC;IAC5C,iBAAiB,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;IAChD,gBAAgB,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC;;AAGtD,IAAA,UAAU,CAAC,KAAkB,EAAA;QAC3B,IAAI,KAAK,IAAI,IAAI;YAAE;AAEnB,QAAA,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACxB,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;YACjE,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;QACpE;aAAO;YACL,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;QAC7D;IACF;AAEA,IAAA,gBAAgB,CAAC,EAAgC,EAAA;AAC/C,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE;IACrB;AAEA,IAAA,iBAAiB,CAAC,EAAc,EAAA;AAC9B,QAAA,IAAI,CAAC,UAAU,GAAG,EAAE;IACtB;AAEA,IAAA,gBAAgB,CAAC,WAAoB,EAAA;;IAErC;IAEA,WAAW,GAAA;QACT,IAAI,CAAC,wBAAwB,EAAE;IACjC;;AAIA,IAAA,eAAe,CAAC,KAAa,EAAA;AAC3B,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,EAAE;AACzB,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,EAAE;QACzB,IAAI,MAAM,KAAK,MAAM;AAAE,YAAA,OAAO,CAAC;AAC/B,QAAA,OAAO,CAAC,CAAC,KAAK,GAAG,MAAM,KAAK,MAAM,GAAG,MAAM,CAAC,IAAI,GAAG;IACrD;AAEA,IAAA,aAAa,CAAC,IAAY,EAAA;AACxB,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE,EAAE;AAChB,YAAA,OAAO,IAAI,IAAI,IAAI,CAAC,SAAS,EAAE,IAAI,IAAI,IAAI,IAAI,CAAC,UAAU,EAAE;QAC9D;AACA,QAAA,OAAO,IAAI,IAAI,IAAI,CAAC,MAAM,EAAE;IAC9B;AAEA,IAAA,WAAW,CAAC,KAAa,EAAA;AACvB,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,EAAE;AAC3B,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,EAAE;AACzB,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,GAAG,MAAM,IAAI,OAAO,CAAC,GAAG,OAAO,GAAG,MAAM;;QAEzE,OAAO,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC;IAC7E;AAEA,IAAA,MAAM,CAAC,KAAa,EAAE,GAAW,EAAE,GAAW,EAAA;AAC5C,QAAA,OAAO,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,GAAG,CAAC,EAAE,GAAG,CAAC;IAC5C;;AAIA,IAAA,aAAa,CAAC,KAAiB,EAAA;QAC7B,IAAI,IAAI,CAAC,QAAQ,EAAE;YAAE;;AAErB,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB;AAC1C,QAAA,IAAI,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,mBAAmB,CAAC;YAAE;QAEpD,MAAM,KAAK,GAAG,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC;QAC5C,IAAI,KAAK,KAAK,IAAI;YAAE;AAEpB,QAAA,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC;QAC5B,IAAI,CAAC,WAAW,EAAE;QAClB,IAAI,CAAC,UAAU,EAAE;IACnB;IAEA,iBAAiB,CAAC,KAAiB,EAAE,KAAqB,EAAA;QACxD,IAAI,IAAI,CAAC,QAAQ,EAAE;YAAE;QACrB,KAAK,CAAC,cAAc,EAAE;QACtB,KAAK,CAAC,eAAe,EAAE;AAEvB,QAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC;AACzB,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE;QAErB,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,iBAAiB,CAAC;QACpE,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC;IAClE;IAEA,kBAAkB,CAAC,KAAiB,EAAE,KAAqB,EAAA;QACzD,IAAI,IAAI,CAAC,QAAQ,EAAE;YAAE;QACrB,KAAK,CAAC,cAAc,EAAE;QACtB,KAAK,CAAC,eAAe,EAAE;AAEvB,QAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC;AACzB,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE;AAErB,QAAA,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,iBAAiB,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;QACxF,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC;IACpE;IAEA,eAAe,CAAC,KAAoB,EAAE,KAAqB,EAAA;QACzD,IAAI,IAAI,CAAC,QAAQ,EAAE;YAAE;AAErB,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,EAAE;QAC3B,IAAI,KAAK,GAAG,CAAC;AAEb,QAAA,QAAQ,KAAK,CAAC,GAAG;AACf,YAAA,KAAK,YAAY;AACjB,YAAA,KAAK,SAAS;gBACZ,KAAK,GAAG,OAAO;gBACf;AACF,YAAA,KAAK,WAAW;AAChB,YAAA,KAAK,WAAW;gBACd,KAAK,GAAG,CAAC,OAAO;gBAChB;AACF,YAAA,KAAK,QAAQ;AACX,gBAAA,KAAK,GAAG,OAAO,GAAG,EAAE;gBACpB;AACF,YAAA,KAAK,UAAU;AACb,gBAAA,KAAK,GAAG,CAAC,OAAO,GAAG,EAAE;gBACrB;AACF,YAAA,KAAK,MAAM;gBACT,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC;gBACtC,IAAI,CAAC,WAAW,EAAE;gBAClB,KAAK,CAAC,cAAc,EAAE;gBACtB;AACF,YAAA,KAAK,KAAK;gBACR,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC;gBACtC,IAAI,CAAC,WAAW,EAAE;gBAClB,KAAK,CAAC,cAAc,EAAE;gBACtB;AACF,YAAA;gBACE;;QAGJ,KAAK,CAAC,cAAc,EAAE;QACtB,MAAM,YAAY,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC;QAC/C,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC,YAAY,GAAG,KAAK,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;AAC5F,QAAA,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,QAAQ,CAAC;QACpC,IAAI,CAAC,WAAW,EAAE;QAClB,IAAI,CAAC,UAAU,EAAE;IACnB;;AAIQ,IAAA,YAAY,CAAC,KAAiB,EAAA;QACpC,MAAM,KAAK,GAAG,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC;QAC5C,IAAI,KAAK,KAAK,IAAI;YAAE;AACpB,QAAA,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC;IAClC;IAEQ,UAAU,GAAA;QAChB,IAAI,CAAC,QAAQ,EAAE;QACf,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,iBAAiB,CAAC;QACvE,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC;IACrE;AAEQ,IAAA,YAAY,CAAC,KAAiB,EAAA;QACpC,KAAK,CAAC,cAAc,EAAE;AACtB,QAAA,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,KAAK,CAAC;YAAE;QAChC,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC9B,MAAM,KAAK,GAAG,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,OAAO,CAAC;QACtD,IAAI,KAAK,KAAK,IAAI;YAAE;AACpB,QAAA,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC;IAClC;IAEQ,WAAW,GAAA;QACjB,IAAI,CAAC,QAAQ,EAAE;QACf,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,iBAAiB,CAAC;QACvE,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC;IACvE;IAEQ,QAAQ,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;AAC7B,YAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC;AACxB,YAAA,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE;YACnB,IAAI,CAAC,UAAU,EAAE;QACnB;IACF;IAEQ,wBAAwB,GAAA;QAC9B,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,iBAAiB,CAAC;QACvE,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC;QACnE,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,iBAAiB,CAAC;QACvE,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC;IACvE;AAEQ,IAAA,kBAAkB,CAAC,KAAiB,EAAA;QAC1C,OAAO,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,OAAO,CAAC;IACjD;AAEQ,IAAA,oBAAoB,CAAC,OAAe,EAAA;AAC1C,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,gBAAgB,EAAE;AACzC,QAAA,IAAI,CAAC,SAAS;AAAE,YAAA,OAAO,IAAI;QAE3B,MAAM,IAAI,GAAG,SAAS,CAAC,aAAa,CAAC,qBAAqB,EAAE;QAC5D,MAAM,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;QACrE,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,OAAO,IAAI,IAAI,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;AACjE,QAAA,OAAO,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC;IACnC;AAEQ,IAAA,oBAAoB,CAAC,KAAa,EAAA;AACxC,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE;QAC9B,IAAI,KAAK,KAAK,IAAI;YAAE;AACpB,QAAA,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,KAAK,CAAC;QACjC,IAAI,CAAC,WAAW,EAAE;IACpB;AAEQ,IAAA,cAAc,CAAC,KAAqB,EAAA;AAC1C,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE,EAAE;AAChB,YAAA,OAAO,KAAK,KAAK,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,GAAG,IAAI,CAAC,UAAU,EAAE;QAC/D;AACA,QAAA,OAAO,IAAI,CAAC,MAAM,EAAE;IACtB;IAEQ,cAAc,CAAC,KAAqB,EAAE,KAAa,EAAA;AACzD,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE,EAAE;AAChB,YAAA,IAAI,KAAK,KAAK,KAAK,EAAE;;gBAEnB,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC;YACvE;iBAAO;;gBAEL,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE,EAAE,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;YACvE;QACF;aAAO;AACL,YAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC;QACxB;IACF;AAEQ,IAAA,gBAAgB,CAAC,KAAa,EAAA;AACpC,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE,EAAE;AAChB,YAAA,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;AAClD,YAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;AACpD,YAAA,IAAI,OAAO,IAAI,QAAQ,EAAE;AACvB,gBAAA,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,KAAK,CAAC;YACnC;iBAAO;AACL,gBAAA,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE,KAAK,CAAC;YACpC;QACF;aAAO;AACL,YAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC;QACxB;IACF;IAEQ,WAAW,GAAA;QACjB,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,EAAE,GAAI,CAAC,IAAI,CAAC,SAAS,EAAE,EAAE,IAAI,CAAC,UAAU,EAAE,CAAsB,GAAG,IAAI,CAAC,MAAM,EAAE;AACtG,QAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC;AACnB,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC;IAC5B;uGAxTW,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAlB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,GAAA,EAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,UAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,GAAA,EAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,UAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,YAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,aAAA,EAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,UAAA,EAAA,eAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,WAAA,EAAA,aAAA,EAAA,SAAA,EAAA,WAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,4BAAA,EAAA,YAAA,EAAA,yBAAA,EAAA,SAAA,EAAA,4BAAA,EAAA,sBAAA,EAAA,EAAA,cAAA,EAAA,YAAA,EAAA,EAAA,SAAA,EARlB;AACT,YAAA;AACE,gBAAA,OAAO,EAAE,iBAAiB;AAC1B,gBAAA,WAAW,EAAE,kBAAkB;AAC/B,gBAAA,KAAK,EAAE,IAAI;AACZ,aAAA;AACF,SAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,kBAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,iBAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECxEH,kpFAmEA,EAAA,MAAA,EAAA,CAAA,y/IAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FDOa,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAtB9B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,YAAY,EAAA,UAAA,EACV,IAAI,EAAA,OAAA,EACP,EAAE,EAAA,eAAA,EAGM,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,IAAA,EAC/B;AACJ,wBAAA,KAAK,EAAE,YAAY;AACnB,wBAAA,8BAA8B,EAAE,YAAY;AAC5C,wBAAA,2BAA2B,EAAE,SAAS;AACtC,wBAAA,8BAA8B,EAAE,sBAAsB;qBACvD,EAAA,SAAA,EACU;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAA,kBAAoB;AAC/B,4BAAA,KAAK,EAAE,IAAI;AACZ,yBAAA;AACF,qBAAA,EAAA,QAAA,EAAA,kpFAAA,EAAA,MAAA,EAAA,CAAA,y/IAAA,CAAA,EAAA;oxCAgCoC,iBAAiB,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AExGxD;;AAEG;;;;"}
1	+ {"version":3,"file":"raintonic-formaui-components-slider.mjs","sources":["../../../lib/components/slider/slider.intl.ts","../../../lib/components/slider/slider.component.ts","../../../lib/components/slider/slider.component.html","../../../lib/components/slider/raintonic-formaui-components-slider.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\r\nimport { FuiIntlBase } from '@raintonic/formaui/core';\r\n\r\n@Injectable({ providedIn: 'root' })\r\nexport class FuiSliderIntl extends FuiIntlBase {\r\n minValueAriaLabel = 'Minimum value';\r\n maxValueAriaLabel = 'Maximum value';\r\n}\r\n","import {\r\n Component,\r\n ChangeDetectionStrategy,\r\n ChangeDetectorRef,\r\n ViewEncapsulation,\r\n input,\r\n output,\r\n computed,\r\n signal,\r\n viewChild,\r\n ElementRef,\r\n Signal,\r\n WritableSignal,\r\n OnDestroy,\r\n booleanAttribute,\r\n DOCUMENT,\r\n inject,\r\n} from '@angular/core';\r\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\nimport { SliderValue, SliderFormatLabelFn } from './slider.types';\r\nimport { FuiSliderIntl } from './slider.intl';\r\n\r\n/*\r\n # FuiSliderComponent\r\n \r\n A slider (range input) component with single and dual-thumb (range) support.\r\n * Integrates with Angular Reactive Forms via ControlValueAccessor.\r\n \r\n ## Features\r\n * - Single value and range (dual-thumb) modes\r\n * - Configurable min/max/step\r\n * - Optional tick marks and tooltips\r\n * - Custom label formatting\r\n * - Keyboard navigation (Arrow keys, Home, End, PageUp/Down)\r\n * - Drag and click-to-move interaction\r\n * - Full accessibility (ARIA slider role)\r\n \r\n ## Usage\r\n \r\n ### Basic Slider\r\n * ```html\r\n * <fui-slider [formControl]=\"volumeControl\"></fui-slider>\r\n * ```\r\n \r\n ### Range Slider\r\n * ```html\r\n * <fui-slider [range]=\"true\" [formControl]=\"priceRange\"></fui-slider>\r\n * ```\r\n \r\n ### With Ticks and Custom Label\r\n * ```html\r\n * <fui-slider [showTicks]=\"true\" [formatLabel]=\"formatCurrency\" [min]=\"0\" [max]=\"1000\" [step]=\"100\"></fui-slider>\r\n * ```\r\n /\r\n@Component({\r\n selector: 'fui-slider',\r\n standalone: true,\r\n imports: [],\r\n templateUrl: './slider.component.html',\r\n styleUrls: ['./slider.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n host: {\r\n class: 'fui-slider',\r\n '[class.fui-slider--disabled]': 'disabled()',\r\n '[class.fui-slider--range]': 'range()',\r\n '[class.fui-slider--dragging]': '_dragging() !== null',\r\n },\r\n providers: [\r\n {\r\n provide: NG_VALUE_ACCESSOR,\r\n useExisting: FuiSliderComponent,\r\n multi: true,\r\n },\r\n ],\r\n})\r\nexport class FuiSliderComponent implements ControlValueAccessor, OnDestroy {\r\n private readonly _document = inject(DOCUMENT);\r\n readonly intl = inject(FuiSliderIntl);\r\n private readonly _cdr = inject(ChangeDetectorRef);\r\n\r\n constructor() {\r\n this.intl.changes.pipe(takeUntilDestroyed()).subscribe(() => { this._cdr.markForCheck(); });\r\n }\r\n\r\n // Inputs\r\n readonly min = input(0);\r\n readonly max = input(100);\r\n readonly step = input(1);\r\n readonly range = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n readonly showTicks = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n readonly showTooltip = input<boolean, unknown>(true, { transform: booleanAttribute });\r\n readonly formatLabel = input<SliderFormatLabelFn>((v: number) => String(v));\r\n readonly disabled = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n readonly ariaLabel = input<string \| null>(null, { alias: 'aria-label' });\r\n readonly ariaLabelLow = input<string \| null>(null);\r\n readonly ariaLabelHigh = input<string \| null>(null);\r\n\r\n // Outputs\r\n readonly valueChange = output<SliderValue>();\r\n readonly dragStart = output();\r\n readonly dragEnd = output();\r\n\r\n // Internal state\r\n readonly _value: WritableSignal<number> = signal(0);\r\n readonly _valueLow: WritableSignal<number> = signal(0);\r\n readonly _valueHigh: WritableSignal<number> = signal(100);\r\n readonly _dragging: WritableSignal<'low' \| 'high' \| null> = signal(null);\r\n readonly _hovered: WritableSignal<'low' \| 'high' \| null> = signal(null);\r\n\r\n // ViewChild\r\n readonly _sliderContainer: Signal<ElementRef<HTMLElement> \| undefined> =\r\n viewChild<ElementRef<HTMLElement>>('sliderContainer');\r\n\r\n // Computed: percentages\r\n readonly _percentage: Signal<number> = computed(() => this._valueToPercent(this._value()));\r\n\r\n readonly _percentageLow: Signal<number> = computed(() => this._valueToPercent(this._valueLow()));\r\n\r\n readonly _percentageHigh: Signal<number> = computed(() => this._valueToPercent(this._valueHigh()));\r\n\r\n // Computed: tick values\r\n readonly _tickValues: Signal<number[]> = computed(() => {\r\n const minVal = this.min();\r\n const maxVal = this.max();\r\n const stepVal = this.step();\r\n const ticks: number[] = [];\r\n for (let v = minVal; v <= maxVal; v += stepVal) {\r\n ticks.push(v);\r\n }\r\n // Ensure max is included\r\n if (ticks[ticks.length - 1] !== maxVal) {\r\n ticks.push(maxVal);\r\n }\r\n return ticks;\r\n });\r\n\r\n // CVA callbacks\r\n private _onChange: (value: SliderValue) => void = () => {\r\n // Intentionally empty: will be replaced by Angular forms\r\n };\r\n private _onTouched: () => void = () => {\r\n // Intentionally empty: will be replaced by Angular forms\r\n };\r\n\r\n // Bound event handlers for cleanup\r\n private _boundOnMouseMove = this._onMouseMove.bind(this);\r\n private _boundOnMouseUp = this._onMouseUp.bind(this);\r\n private _boundOnTouchMove = this._onTouchMove.bind(this);\r\n private _boundOnTouchEnd = this._onTouchEnd.bind(this);\r\n\r\n // ControlValueAccessor\r\n writeValue(value: SliderValue): void {\r\n if (value == null) return;\r\n\r\n if (Array.isArray(value)) {\r\n this._valueLow.set(this._clamp(value[0], this.min(), this.max()));\r\n this._valueHigh.set(this._clamp(value[1], this.min(), this.max()));\r\n } else {\r\n this._value.set(this._clamp(value, this.min(), this.max()));\r\n }\r\n }\r\n\r\n registerOnChange(fn: (value: SliderValue) => void): void {\r\n this._onChange = fn;\r\n }\r\n\r\n registerOnTouched(fn: () => void): void {\r\n this._onTouched = fn;\r\n }\r\n\r\n setDisabledState(_isDisabled: boolean): void {\r\n // disabled is handled by input signal\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this._removeDocumentListeners();\r\n }\r\n\r\n // === Public helpers (used in template) ===\r\n\r\n _valueToPercent(value: number): number {\r\n const minVal = this.min();\r\n const maxVal = this.max();\r\n if (maxVal === minVal) return 0;\r\n return ((value - minVal) / (maxVal - minVal)) 100;\r\n }\r\n\r\n _isTickActive(tick: number): boolean {\r\n if (this.range()) {\r\n return tick >= this._valueLow() && tick <= this._valueHigh();\r\n }\r\n return tick <= this._value();\r\n }\r\n\r\n _snapToStep(value: number): number {\r\n const stepVal = this.step();\r\n const minVal = this.min();\r\n const snapped = Math.round((value - minVal) / stepVal) * stepVal + minVal;\r\n // Clamp to min/max and round to avoid floating point issues\r\n return this._clamp(parseFloat(snapped.toFixed(10)), this.min(), this.max());\r\n }\r\n\r\n _clamp(value: number, min: number, max: number): number {\r\n return Math.min(Math.max(value, min), max);\r\n }\r\n\r\n // === Event handlers ===\r\n\r\n _onTrackClick(event: MouseEvent): void {\r\n if (this.disabled()) return;\r\n // Ignore clicks on thumb elements\r\n const target = event.target as HTMLElement;\r\n if (target.classList.contains('fui-slider__thumb')) return;\r\n\r\n const value = this._getValueFromEvent(event);\r\n if (value === null) return;\r\n\r\n this._setNearestThumb(value);\r\n this._emitChange();\r\n this._onTouched();\r\n }\r\n\r\n _onThumbMouseDown(event: MouseEvent, thumb: 'low' \| 'high'): void {\r\n if (this.disabled()) return;\r\n event.preventDefault();\r\n event.stopPropagation();\r\n\r\n this._dragging.set(thumb);\r\n this.dragStart.emit();\r\n\r\n this._document.addEventListener('mousemove', this._boundOnMouseMove);\r\n this._document.addEventListener('mouseup', this._boundOnMouseUp);\r\n }\r\n\r\n _onThumbTouchStart(event: TouchEvent, thumb: 'low' \| 'high'): void {\r\n if (this.disabled()) return;\r\n event.preventDefault();\r\n event.stopPropagation();\r\n\r\n this._dragging.set(thumb);\r\n this.dragStart.emit();\r\n\r\n this._document.addEventListener('touchmove', this._boundOnTouchMove, { passive: false });\r\n this._document.addEventListener('touchend', this._boundOnTouchEnd);\r\n }\r\n\r\n _onThumbKeydown(event: KeyboardEvent, thumb: 'low' \| 'high'): void {\r\n if (this.disabled()) return;\r\n\r\n const stepVal = this.step();\r\n let delta = 0;\r\n\r\n switch (event.key) {\r\n case 'ArrowRight':\r\n case 'ArrowUp':\r\n delta = stepVal;\r\n break;\r\n case 'ArrowLeft':\r\n case 'ArrowDown':\r\n delta = -stepVal;\r\n break;\r\n case 'PageUp':\r\n delta = stepVal * 10;\r\n break;\r\n case 'PageDown':\r\n delta = -stepVal * 10;\r\n break;\r\n case 'Home':\r\n this._setThumbValue(thumb, this.min());\r\n this._emitChange();\r\n event.preventDefault();\r\n return;\r\n case 'End':\r\n this._setThumbValue(thumb, this.max());\r\n this._emitChange();\r\n event.preventDefault();\r\n return;\r\n default:\r\n return;\r\n }\r\n\r\n event.preventDefault();\r\n const currentValue = this._getThumbValue(thumb);\r\n const newValue = this._snapToStep(this._clamp(currentValue + delta, this.min(), this.max()));\r\n this._setThumbValue(thumb, newValue);\r\n this._emitChange();\r\n this._onTouched();\r\n }\r\n\r\n // === Private methods ===\r\n\r\n private _onMouseMove(event: MouseEvent): void {\r\n const value = this._getValueFromEvent(event);\r\n if (value === null) return;\r\n this._updateDraggingThumb(value);\r\n }\r\n\r\n private _onMouseUp(): void {\r\n this._endDrag();\r\n this._document.removeEventListener('mousemove', this._boundOnMouseMove);\r\n this._document.removeEventListener('mouseup', this._boundOnMouseUp);\r\n }\r\n\r\n private _onTouchMove(event: TouchEvent): void {\r\n event.preventDefault();\r\n if (event.touches.length === 0) return;\r\n const touch = event.touches[0];\r\n const value = this._getValueFromClientX(touch.clientX);\r\n if (value === null) return;\r\n this._updateDraggingThumb(value);\r\n }\r\n\r\n private _onTouchEnd(): void {\r\n this._endDrag();\r\n this._document.removeEventListener('touchmove', this._boundOnTouchMove);\r\n this._document.removeEventListener('touchend', this._boundOnTouchEnd);\r\n }\r\n\r\n private _endDrag(): void {\r\n if (this._dragging() !== null) {\r\n this._dragging.set(null);\r\n this.dragEnd.emit();\r\n this._onTouched();\r\n }\r\n }\r\n\r\n private _removeDocumentListeners(): void {\r\n this._document.removeEventListener('mousemove', this._boundOnMouseMove);\r\n this._document.removeEventListener('mouseup', this._boundOnMouseUp);\r\n this._document.removeEventListener('touchmove', this._boundOnTouchMove);\r\n this._document.removeEventListener('touchend', this._boundOnTouchEnd);\r\n }\r\n\r\n private _getValueFromEvent(event: MouseEvent): number \| null {\r\n return this._getValueFromClientX(event.clientX);\r\n }\r\n\r\n private _getValueFromClientX(clientX: number): number \| null {\r\n const container = this._sliderContainer();\r\n if (!container) return null;\r\n\r\n const rect = container.nativeElement.getBoundingClientRect();\r\n const percent = this._clamp((clientX - rect.left) / rect.width, 0, 1);\r\n const rawValue = this.min() + percent * (this.max() - this.min());\r\n return this._snapToStep(rawValue);\r\n }\r\n\r\n private _updateDraggingThumb(value: number): void {\r\n const thumb = this._dragging();\r\n if (thumb === null) return;\r\n this._setThumbValue(thumb, value);\r\n this._emitChange();\r\n }\r\n\r\n private _getThumbValue(thumb: 'low' \| 'high'): number {\r\n if (this.range()) {\r\n return thumb === 'low' ? this._valueLow() : this._valueHigh();\r\n }\r\n return this._value();\r\n }\r\n\r\n private _setThumbValue(thumb: 'low' \| 'high', value: number): void {\r\n if (this.range()) {\r\n if (thumb === 'low') {\r\n // Prevent low from exceeding high\r\n this._valueLow.set(this._clamp(value, this.min(), this._valueHigh()));\r\n } else {\r\n // Prevent high from going below low\r\n this._valueHigh.set(this._clamp(value, this._valueLow(), this.max()));\r\n }\r\n } else {\r\n this._value.set(value);\r\n }\r\n }\r\n\r\n private _setNearestThumb(value: number): void {\r\n if (this.range()) {\r\n const distLow = Math.abs(value - this._valueLow());\r\n const distHigh = Math.abs(value - this._valueHigh());\r\n if (distLow <= distHigh) {\r\n this._setThumbValue('low', value);\r\n } else {\r\n this._setThumbValue('high', value);\r\n }\r\n } else {\r\n this._value.set(value);\r\n }\r\n }\r\n\r\n private _emitChange(): void {\r\n const val = this.range() ? ([this._valueLow(), this._valueHigh()] as [number, number]) : this._value();\r\n this._onChange(val);\r\n this.valueChange.emit(val);\r\n }\r\n}\r\n","<div class=\"fui-slider__container\" (click)=\"_onTrackClick($event)\" #sliderContainer>\r\n <div class=\"fui-slider__track\">\r\n <div\r\n class=\"fui-slider__track-fill\"\r\n [style.left.%]=\"range() ? _percentageLow() : 0\"\r\n [style.width.%]=\"range() ? _percentageHigh() - _percentageLow() : _percentage()\"\r\n ></div>\r\n </div>\r\n\r\n @if (showTicks()) {\r\n <div class=\"fui-slider__ticks\">\r\n @for (tick of _tickValues(); track tick) {\r\n <div\r\n class=\"fui-slider__tick\"\r\n [style.left.%]=\"_valueToPercent(tick)\"\r\n [class.fui-slider__tick--active]=\"_isTickActive(tick)\"\r\n ></div>\r\n }\r\n </div>\r\n }\r\n\r\n <div\r\n class=\"fui-slider__thumb fui-slider__thumb--low\"\r\n [style.left.%]=\"range() ? _percentageLow() : _percentage()\"\r\n role=\"slider\"\r\n [attr.aria-valuenow]=\"range() ? _valueLow() : _value()\"\r\n [attr.aria-valuemin]=\"min()\"\r\n [attr.aria-valuemax]=\"range() ? _valueHigh() : max()\"\r\n [attr.aria-label]=\"range() ? (ariaLabelLow() \|\| intl.minValueAriaLabel) : (ariaLabel() \|\| null)\"\r\n aria-orientation=\"horizontal\"\r\n [attr.aria-disabled]=\"disabled()\"\r\n [attr.tabindex]=\"disabled() ? -1 : 0\"\r\n (mousedown)=\"_onThumbMouseDown($event, 'low')\"\r\n (touchstart)=\"_onThumbTouchStart($event, 'low')\"\r\n (keydown)=\"_onThumbKeydown($event, 'low')\"\r\n (focus)=\"_hovered.set('low')\"\r\n (blur)=\"_hovered.set(null)\"\r\n >\r\n @if (showTooltip() && (_dragging() === 'low' \|\| _hovered() === 'low')) {\r\n <div class=\"fui-slider__tooltip\">{{ formatLabel()(range() ? _valueLow() : _value()) }}</div>\r\n }\r\n </div>\r\n\r\n @if (range()) {\r\n <div\r\n class=\"fui-slider__thumb fui-slider__thumb--high\"\r\n [style.left.%]=\"_percentageHigh()\"\r\n role=\"slider\"\r\n [attr.aria-valuenow]=\"_valueHigh()\"\r\n [attr.aria-valuemin]=\"_valueLow()\"\r\n [attr.aria-valuemax]=\"max()\"\r\n [attr.aria-label]=\"ariaLabelHigh() \|\| intl.maxValueAriaLabel\"\r\n aria-orientation=\"horizontal\"\r\n [attr.aria-disabled]=\"disabled()\"\r\n [attr.tabindex]=\"disabled() ? -1 : 0\"\r\n (mousedown)=\"_onThumbMouseDown($event, 'high')\"\r\n (touchstart)=\"_onThumbTouchStart($event, 'high')\"\r\n (keydown)=\"_onThumbKeydown($event, 'high')\"\r\n (focus)=\"_hovered.set('high')\"\r\n (blur)=\"_hovered.set(null)\"\r\n >\r\n @if (showTooltip() && (_dragging() === 'high' \|\| _hovered() === 'high')) {\r\n <div class=\"fui-slider__tooltip\">{{ formatLabel()(_valueHigh()) }}</div>\r\n }\r\n </div>\r\n }\r\n</div>\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/raintonic-formaui-components-spinner.mjs CHANGED Viewed

@@ -1,5 +1,17 @@
 import * as i0 from '@angular/core';
-import { input, numberAttribute, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { Injectable, inject, ChangeDetectorRef, input, numberAttribute, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { FuiIntlBase } from '@raintonic/formaui/core';
+class FuiSpinnerIntl extends FuiIntlBase {
+    loadingAriaLabel = 'Loading';
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiSpinnerIntl, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiSpinnerIntl, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiSpinnerIntl, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
 /**
  * @component FuiSpinnerComponent
@@ -21,12 +33,17 @@ import { input, numberAttribute, computed, ViewEncapsulation, ChangeDetectionStr
  * <fui-spinner mode="determinate" [value]="progress" size="lg"></fui-spinner>
  */
 class FuiSpinnerComponent {
+    intl = inject(FuiSpinnerIntl);
+    _cdr = inject(ChangeDetectorRef);
     mode = input('indeterminate', ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
     value = input(0, { ...(ngDevMode ? { debugName: "value" } : /* istanbul ignore next */ {}), transform: numberAttribute });
     size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     color = input(null, ...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
     overlay = input(false, ...(ngDevMode ? [{ debugName: "overlay" }] : /* istanbul ignore next */ []));
-    ariaLabel = input('Loading', { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'aria-label' });
+    ariaLabel = input(undefined, { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'aria-label' });
+    constructor() {
+        this.intl.changes.pipe(takeUntilDestroyed()).subscribe(() => { this._cdr.markForCheck(); });
+    }
     RADIUS = 20;
     circumference = 2 * Math.PI * this.RADIUS;
     clampedValue = computed(() => Math.max(0, Math.min(100, this.value() || 0)), ...(ngDevMode ? [{ debugName: "clampedValue" }] : /* istanbul ignore next */ []));
@@ -34,7 +51,7 @@ class FuiSpinnerComponent {
         return this.circumference - (this.clampedValue() / 100) * this.circumference;
     }, ...(ngDevMode ? [{ debugName: "strokeDashoffset" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiSpinnerComponent, isStandalone: true, selector: "fui-spinner", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, overlay: { classPropertyName: "overlay", publicName: "overlay", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "status", "aria-live": "polite" }, properties: { "class.fui-spinner--sm": "size() === \"sm\"", "class.fui-spinner--md": "size() === \"md\"", "class.fui-spinner--lg": "size() === \"lg\"", "class.fui-spinner--overlay": "overlay()", "class.fui-spinner--determinate": "mode() === \"determinate\"", "class.fui-spinner--indeterminate": "mode() === \"indeterminate\"", "attr.aria-valuenow": "mode() === \"determinate\" ? clampedValue() : null", "attr.aria-valuemin": "mode() === \"determinate\" ? 0 : null", "attr.aria-valuemax": "mode() === \"determinate\" ? 100 : null", "attr.aria-label": "ariaLabel()" }, classAttribute: "fui-spinner" }, ngImport: i0, template: "@if (overlay()) {\r\n  <div class=\"fui-spinner__overlay\">\r\n    <svg class=\"fui-spinner__svg\" viewBox=\"0 0 48 48\" [style.--fui-spinner-color]=\"color()\">\r\n      @if (mode() === 'determinate') {\r\n        <circle class=\"fui-spinner__track\" cx=\"24\" cy=\"24\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\r\n      }\r\n      <circle\r\n        class=\"fui-spinner__circle\"\r\n        cx=\"24\"\r\n        cy=\"24\"\r\n        r=\"20\"\r\n        fill=\"none\"\r\n        stroke-width=\"4\"\r\n        [attr.stroke-dasharray]=\"mode() === 'determinate' ? circumference : null\"\r\n        [attr.stroke-dashoffset]=\"mode() === 'determinate' ? strokeDashoffset() : null\"\r\n        stroke-linecap=\"round\"\r\n      />\r\n    </svg>\r\n  </div>\r\n} @else {\r\n  <svg class=\"fui-spinner__svg\" viewBox=\"0 0 48 48\" [style.--fui-spinner-color]=\"color()\">\r\n    @if (mode() === 'determinate') {\r\n      <circle class=\"fui-spinner__track\" cx=\"24\" cy=\"24\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\r\n    }\r\n    <circle\r\n      class=\"fui-spinner__circle\"\r\n      cx=\"24\"\r\n      cy=\"24\"\r\n      r=\"20\"\r\n      fill=\"none\"\r\n      stroke-width=\"4\"\r\n      [attr.stroke-dasharray]=\"mode() === 'determinate' ? circumference : null\"\r\n      [attr.stroke-dashoffset]=\"mode() === 'determinate' ? strokeDashoffset() : null\"\r\n      stroke-linecap=\"round\"\r\n    />\r\n  </svg>\r\n}\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}.fui-spinner{display:inline-flex;align-items:center;justify-content:center;--fui-spinner-color: var(--fui-primary)}.fui-spinner--sm{width:1rem;height:1rem}.fui-spinner--md{width:2.5rem;height:2.5rem}.fui-spinner--lg{width:4rem;height:4rem}.fui-spinner__svg{width:100%;height:100%}.fui-spinner__track{stroke:var(--fui-surface-05, #e2e8f0)}.fui-spinner__circle{stroke:var(--fui-spinner-color);transform-origin:center}.fui-spinner--indeterminate .fui-spinner__svg{animation:fui-spin var(--fui-duration-slow-02, .7s) linear infinite}.fui-spinner--indeterminate .fui-spinner__circle{stroke-dasharray:80,200;stroke-dashoffset:0;animation:fui-spinner-dash 1.5s ease-in-out infinite}.fui-spinner--determinate .fui-spinner__circle{transition:stroke-dashoffset var(--fui-duration-moderate-01, .3s) var(--fui-ease-standard, cubic-bezier(.4, 0, .2, 1));transform:rotate(-90deg);transform-origin:center}.fui-spinner--overlay{position:static}.fui-spinner__overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background-color:var(--fui-white-70);z-index:var(--fui-z-index-overlay, 10);border-radius:inherit}.fui-theme-dark .fui-spinner__overlay{background-color:var(--fui-black-50)}@keyframes fui-spinner-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}@media(prefers-reduced-motion:reduce){.fui-spinner__svg,.fui-spinner__circle{animation:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiSpinnerComponent, isStandalone: true, selector: "fui-spinner", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, overlay: { classPropertyName: "overlay", publicName: "overlay", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "status", "aria-live": "polite" }, properties: { "class.fui-spinner--sm": "size() === \"sm\"", "class.fui-spinner--md": "size() === \"md\"", "class.fui-spinner--lg": "size() === \"lg\"", "class.fui-spinner--overlay": "overlay()", "class.fui-spinner--determinate": "mode() === \"determinate\"", "class.fui-spinner--indeterminate": "mode() === \"indeterminate\"", "attr.aria-valuenow": "mode() === \"determinate\" ? clampedValue() : null", "attr.aria-valuemin": "mode() === \"determinate\" ? 0 : null", "attr.aria-valuemax": "mode() === \"determinate\" ? 100 : null", "attr.aria-label": "ariaLabel() ?? intl.loadingAriaLabel" }, classAttribute: "fui-spinner" }, ngImport: i0, template: "@if (overlay()) {\r\n  <div class=\"fui-spinner__overlay\">\r\n    <svg class=\"fui-spinner__svg\" viewBox=\"0 0 48 48\" [style.--fui-spinner-color]=\"color()\">\r\n      @if (mode() === 'determinate') {\r\n        <circle class=\"fui-spinner__track\" cx=\"24\" cy=\"24\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\r\n      }\r\n      <circle\r\n        class=\"fui-spinner__circle\"\r\n        cx=\"24\"\r\n        cy=\"24\"\r\n        r=\"20\"\r\n        fill=\"none\"\r\n        stroke-width=\"4\"\r\n        [attr.stroke-dasharray]=\"mode() === 'determinate' ? circumference : null\"\r\n        [attr.stroke-dashoffset]=\"mode() === 'determinate' ? strokeDashoffset() : null\"\r\n        stroke-linecap=\"round\"\r\n      />\r\n    </svg>\r\n  </div>\r\n} @else {\r\n  <svg class=\"fui-spinner__svg\" viewBox=\"0 0 48 48\" [style.--fui-spinner-color]=\"color()\">\r\n    @if (mode() === 'determinate') {\r\n      <circle class=\"fui-spinner__track\" cx=\"24\" cy=\"24\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\r\n    }\r\n    <circle\r\n      class=\"fui-spinner__circle\"\r\n      cx=\"24\"\r\n      cy=\"24\"\r\n      r=\"20\"\r\n      fill=\"none\"\r\n      stroke-width=\"4\"\r\n      [attr.stroke-dasharray]=\"mode() === 'determinate' ? circumference : null\"\r\n      [attr.stroke-dashoffset]=\"mode() === 'determinate' ? strokeDashoffset() : null\"\r\n      stroke-linecap=\"round\"\r\n    />\r\n  </svg>\r\n}\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-spinner{display:inline-flex;align-items:center;justify-content:center;--fui-spinner-color: var(--fui-primary)}.fui-spinner--sm{width:1rem;height:1rem}.fui-spinner--md{width:2.5rem;height:2.5rem}.fui-spinner--lg{width:4rem;height:4rem}.fui-spinner__svg{width:100%;height:100%}.fui-spinner__track{stroke:var(--fui-surface-05, #e2e8f0)}.fui-spinner__circle{stroke:var(--fui-spinner-color);transform-origin:center}.fui-spinner--indeterminate .fui-spinner__svg{animation:fui-spin var(--fui-duration-slow-02, .7s) linear infinite}.fui-spinner--indeterminate .fui-spinner__circle{stroke-dasharray:80,200;stroke-dashoffset:0;animation:fui-spinner-dash 1.5s ease-in-out infinite}.fui-spinner--determinate .fui-spinner__circle{transition:stroke-dashoffset var(--fui-duration-moderate-01, .3s) var(--fui-ease-standard, cubic-bezier(.4, 0, .2, 1));transform:rotate(-90deg);transform-origin:center}.fui-spinner--overlay{position:static}.fui-spinner__overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background-color:var(--fui-white-70);z-index:var(--fui-z-index-overlay, 10);border-radius:inherit}.fui-theme-dark .fui-spinner__overlay{background-color:var(--fui-black-50)}@keyframes fui-spinner-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}@media(prefers-reduced-motion:reduce){.fui-spinner__svg,.fui-spinner__circle{animation:none}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiSpinnerComponent, decorators: [{
             type: Component,
@@ -51,13 +68,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImpor
                         '[attr.aria-valuenow]': 'mode() === "determinate" ? clampedValue() : null',
                         '[attr.aria-valuemin]': 'mode() === "determinate" ? 0 : null',
                         '[attr.aria-valuemax]': 'mode() === "determinate" ? 100 : null',
-                        '[attr.aria-label]': 'ariaLabel()',
-                    }, template: "@if (overlay()) {\r\n  <div class=\"fui-spinner__overlay\">\r\n    <svg class=\"fui-spinner__svg\" viewBox=\"0 0 48 48\" [style.--fui-spinner-color]=\"color()\">\r\n      @if (mode() === 'determinate') {\r\n        <circle class=\"fui-spinner__track\" cx=\"24\" cy=\"24\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\r\n      }\r\n      <circle\r\n        class=\"fui-spinner__circle\"\r\n        cx=\"24\"\r\n        cy=\"24\"\r\n        r=\"20\"\r\n        fill=\"none\"\r\n        stroke-width=\"4\"\r\n        [attr.stroke-dasharray]=\"mode() === 'determinate' ? circumference : null\"\r\n        [attr.stroke-dashoffset]=\"mode() === 'determinate' ? strokeDashoffset() : null\"\r\n        stroke-linecap=\"round\"\r\n      />\r\n    </svg>\r\n  </div>\r\n} @else {\r\n  <svg class=\"fui-spinner__svg\" viewBox=\"0 0 48 48\" [style.--fui-spinner-color]=\"color()\">\r\n    @if (mode() === 'determinate') {\r\n      <circle class=\"fui-spinner__track\" cx=\"24\" cy=\"24\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\r\n    }\r\n    <circle\r\n      class=\"fui-spinner__circle\"\r\n      cx=\"24\"\r\n      cy=\"24\"\r\n      r=\"20\"\r\n      fill=\"none\"\r\n      stroke-width=\"4\"\r\n      [attr.stroke-dasharray]=\"mode() === 'determinate' ? circumference : null\"\r\n      [attr.stroke-dashoffset]=\"mode() === 'determinate' ? strokeDashoffset() : null\"\r\n      stroke-linecap=\"round\"\r\n    />\r\n  </svg>\r\n}\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}.fui-spinner{display:inline-flex;align-items:center;justify-content:center;--fui-spinner-color: var(--fui-primary)}.fui-spinner--sm{width:1rem;height:1rem}.fui-spinner--md{width:2.5rem;height:2.5rem}.fui-spinner--lg{width:4rem;height:4rem}.fui-spinner__svg{width:100%;height:100%}.fui-spinner__track{stroke:var(--fui-surface-05, #e2e8f0)}.fui-spinner__circle{stroke:var(--fui-spinner-color);transform-origin:center}.fui-spinner--indeterminate .fui-spinner__svg{animation:fui-spin var(--fui-duration-slow-02, .7s) linear infinite}.fui-spinner--indeterminate .fui-spinner__circle{stroke-dasharray:80,200;stroke-dashoffset:0;animation:fui-spinner-dash 1.5s ease-in-out infinite}.fui-spinner--determinate .fui-spinner__circle{transition:stroke-dashoffset var(--fui-duration-moderate-01, .3s) var(--fui-ease-standard, cubic-bezier(.4, 0, .2, 1));transform:rotate(-90deg);transform-origin:center}.fui-spinner--overlay{position:static}.fui-spinner__overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background-color:var(--fui-white-70);z-index:var(--fui-z-index-overlay, 10);border-radius:inherit}.fui-theme-dark .fui-spinner__overlay{background-color:var(--fui-black-50)}@keyframes fui-spinner-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}@media(prefers-reduced-motion:reduce){.fui-spinner__svg,.fui-spinner__circle{animation:none}}\n"] }]
-        }], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], overlay: [{ type: i0.Input, args: [{ isSignal: true, alias: "overlay", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }] } });
+                        '[attr.aria-label]': 'ariaLabel() ?? intl.loadingAriaLabel',
+                    }, template: "@if (overlay()) {\r\n  <div class=\"fui-spinner__overlay\">\r\n    <svg class=\"fui-spinner__svg\" viewBox=\"0 0 48 48\" [style.--fui-spinner-color]=\"color()\">\r\n      @if (mode() === 'determinate') {\r\n        <circle class=\"fui-spinner__track\" cx=\"24\" cy=\"24\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\r\n      }\r\n      <circle\r\n        class=\"fui-spinner__circle\"\r\n        cx=\"24\"\r\n        cy=\"24\"\r\n        r=\"20\"\r\n        fill=\"none\"\r\n        stroke-width=\"4\"\r\n        [attr.stroke-dasharray]=\"mode() === 'determinate' ? circumference : null\"\r\n        [attr.stroke-dashoffset]=\"mode() === 'determinate' ? strokeDashoffset() : null\"\r\n        stroke-linecap=\"round\"\r\n      />\r\n    </svg>\r\n  </div>\r\n} @else {\r\n  <svg class=\"fui-spinner__svg\" viewBox=\"0 0 48 48\" [style.--fui-spinner-color]=\"color()\">\r\n    @if (mode() === 'determinate') {\r\n      <circle class=\"fui-spinner__track\" cx=\"24\" cy=\"24\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\r\n    }\r\n    <circle\r\n      class=\"fui-spinner__circle\"\r\n      cx=\"24\"\r\n      cy=\"24\"\r\n      r=\"20\"\r\n      fill=\"none\"\r\n      stroke-width=\"4\"\r\n      [attr.stroke-dasharray]=\"mode() === 'determinate' ? circumference : null\"\r\n      [attr.stroke-dashoffset]=\"mode() === 'determinate' ? strokeDashoffset() : null\"\r\n      stroke-linecap=\"round\"\r\n    />\r\n  </svg>\r\n}\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-spinner{display:inline-flex;align-items:center;justify-content:center;--fui-spinner-color: var(--fui-primary)}.fui-spinner--sm{width:1rem;height:1rem}.fui-spinner--md{width:2.5rem;height:2.5rem}.fui-spinner--lg{width:4rem;height:4rem}.fui-spinner__svg{width:100%;height:100%}.fui-spinner__track{stroke:var(--fui-surface-05, #e2e8f0)}.fui-spinner__circle{stroke:var(--fui-spinner-color);transform-origin:center}.fui-spinner--indeterminate .fui-spinner__svg{animation:fui-spin var(--fui-duration-slow-02, .7s) linear infinite}.fui-spinner--indeterminate .fui-spinner__circle{stroke-dasharray:80,200;stroke-dashoffset:0;animation:fui-spinner-dash 1.5s ease-in-out infinite}.fui-spinner--determinate .fui-spinner__circle{transition:stroke-dashoffset var(--fui-duration-moderate-01, .3s) var(--fui-ease-standard, cubic-bezier(.4, 0, .2, 1));transform:rotate(-90deg);transform-origin:center}.fui-spinner--overlay{position:static}.fui-spinner__overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background-color:var(--fui-white-70);z-index:var(--fui-z-index-overlay, 10);border-radius:inherit}.fui-theme-dark .fui-spinner__overlay{background-color:var(--fui-black-50)}@keyframes fui-spinner-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}@media(prefers-reduced-motion:reduce){.fui-spinner__svg,.fui-spinner__circle{animation:none}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], overlay: [{ type: i0.Input, args: [{ isSignal: true, alias: "overlay", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "aria-label", required: false }] }] } });
 /**
  * Generated bundle index. Do not edit.
  */
-export { FuiSpinnerComponent };
+export { FuiSpinnerComponent, FuiSpinnerIntl };
 //# sourceMappingURL=raintonic-formaui-components-spinner.mjs.map

package/fesm2022/raintonic-formaui-components-spinner.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"raintonic-formaui-components-spinner.mjs","sources":["../../../lib/components/spinner/spinner.component.ts","../../../lib/components/spinner/spinner.component.html","../../../lib/components/spinner/raintonic-formaui-components-spinner.ts"],"sourcesContent":["import { ~~ChangeDetectionStrategy~~, Component, ViewEncapsulation, computed, input, numberAttribute } from '@angular/core';\r\nimport { FuiSpinnerMode, FuiSpinnerSize } from './spinner.types';\r\n\r\n/*\r\n @component FuiSpinnerComponent\r\n * @selector fui-spinner\r\n * @description A circular loading spinner with determinate and indeterminate modes.\r\n * Supports an overlay mode that covers its parent container.\r\n \r\n @input mode - Spinner mode: 'determinate' \| 'indeterminate'. Default 'indeterminate'.\r\n * @input value - Progress value (0-100) for determinate mode. Default 0.\r\n * @input size - Spinner size: 'sm' \| 'md' \| 'lg'. Default 'md'.\r\n * @input color - Optional custom CSS color for the spinner stroke.\r\n * @input overlay - Whether to render as a full-area overlay. Default false.\r\n * @input ariaLabel - Accessible label. Default 'Loading'.\r\n \r\n @example\r\n * <fui-spinner></fui-spinner>\r\n \r\n @example\r\n * <fui-spinner mode=\"determinate\" [value]=\"progress\" size=\"lg\"></fui-spinner>\r\n /\r\n@Component({\r\n selector: 'fui-spinner',\r\n standalone: true,\r\n imports: [],\r\n templateUrl: './spinner.component.html',\r\n styleUrls: ['./spinner.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n host: {\r\n class: 'fui-spinner',\r\n '[class.fui-spinner--sm]': 'size() === \"sm\"',\r\n '[class.fui-spinner--md]': 'size() === \"md\"',\r\n '[class.fui-spinner--lg]': 'size() === \"lg\"',\r\n '[class.fui-spinner--overlay]': 'overlay()',\r\n '[class.fui-spinner--determinate]': 'mode() === \"determinate\"',\r\n '[class.fui-spinner--indeterminate]': 'mode() === \"indeterminate\"',\r\n role: 'status',\r\n 'aria-live': 'polite',\r\n '[attr.aria-valuenow]': 'mode() === \"determinate\" ? clampedValue() : null',\r\n '[attr.aria-valuemin]': 'mode() === \"determinate\" ? 0 : null',\r\n '[attr.aria-valuemax]': 'mode() === \"determinate\" ? 100 : null',\r\n '[attr.aria-label]': 'ariaLabel()',\r\n },\r\n})\r\nexport class FuiSpinnerComponent {\r\n readonly mode = input<FuiSpinnerMode>('indeterminate');\r\n readonly value = input<number, unknown>(0, { transform: numberAttribute });\r\n readonly size = input<FuiSpinnerSize>('md');\r\n readonly color = input<string \| null>(null);\r\n readonly overlay = input(false);\r\n readonly ariaLabel = input(~~'Loading'~~, { alias: 'aria-label' });\r\n\r\n private readonly RADIUS = 20;\r\n readonly circumference = 2 Math.PI * this.RADIUS;\r\n\r\n readonly clampedValue = computed(() => Math.max(0, Math.min(100, this.value() \|\| 0)));\r\n readonly strokeDashoffset = computed(() => {\r\n return this.circumference - (this.clampedValue() / 100) * this.circumference;\r\n });\r\n}\r\n","@if (overlay()) {\r\n <div class=\"fui-spinner__overlay\">\r\n <svg class=\"fui-spinner__svg\" viewBox=\"0 0 48 48\" [style.--fui-spinner-color]=\"color()\">\r\n @if (mode() === 'determinate') {\r\n <circle class=\"fui-spinner__track\" cx=\"24\" cy=\"24\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\r\n }\r\n <circle\r\n class=\"fui-spinner__circle\"\r\n cx=\"24\"\r\n cy=\"24\"\r\n r=\"20\"\r\n fill=\"none\"\r\n stroke-width=\"4\"\r\n [attr.stroke-dasharray]=\"mode() === 'determinate' ? circumference : null\"\r\n [attr.stroke-dashoffset]=\"mode() === 'determinate' ? strokeDashoffset() : null\"\r\n stroke-linecap=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n} @else {\r\n <svg class=\"fui-spinner__svg\" viewBox=\"0 0 48 48\" [style.--fui-spinner-color]=\"color()\">\r\n @if (mode() === 'determinate') {\r\n <circle class=\"fui-spinner__track\" cx=\"24\" cy=\"24\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\r\n }\r\n <circle\r\n class=\"fui-spinner__circle\"\r\n cx=\"24\"\r\n cy=\"24\"\r\n r=\"20\"\r\n fill=\"none\"\r\n stroke-width=\"4\"\r\n [attr.stroke-dasharray]=\"mode() === 'determinate' ? circumference : null\"\r\n [attr.stroke-dashoffset]=\"mode() === 'determinate' ? strokeDashoffset() : null\"\r\n stroke-linecap=\"round\"\r\n />\r\n </svg>\r\n}\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;~~AAGA~~;;;;;;;;;;;;;;;;;;AAkBG;MAyBU,mBAAmB,CAAA;AACrB,IAAA,IAAI,GAAG,KAAK,CAAiB,eAAe,2EAAC;IAC7C,KAAK,GAAG,KAAK,CAAkB,CAAC,6EAAI,SAAS,EAAE,eAAe,EAAA,CAAG;AACjE,IAAA,IAAI,GAAG,KAAK,CAAiB,IAAI,2EAAC;AAClC,IAAA,KAAK,GAAG,KAAK,CAAgB,IAAI,4EAAC;AAClC,IAAA,OAAO,GAAG,KAAK,CAAC,KAAK,8EAAC;IACtB,SAAS,GAAG,KAAK,~~CAAC~~,SAAS,iFAAI,KAAK,EAAE,YAAY,EAAA,CAAG;~~IAE7C~~,MAAM,GAAG,EAAE;IACnB,aAAa,GAAG,CAAC,GAAG,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,MAAM;IAEzC,YAAY,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,cAAA,EAAA,CAAA,8BAAA,EAAA,CAAA,CAAC;AAC5E,IAAA,gBAAgB,GAAG,QAAQ,CAAC,MAAK;AACxC,QAAA,OAAO,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,YAAY,EAAE,GAAG,GAAG,IAAI,IAAI,CAAC,aAAa;AAC9E,IAAA,CAAC,uFAAC;~~uGAdS~~,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAnB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,mBAAmB,~~y8CC9ChC~~,y5CAqCA,EAAA,MAAA,EAAA,CAAA,~~ggGAAA~~,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;~~2FDSa~~,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAxB/B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,EAAA,UAAA,EACX,IAAI,EAAA,OAAA,EACP,EAAE,EAAA,eAAA,EAGM,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,IAAA,EAC/B;AACJ,wBAAA,KAAK,EAAE,aAAa;AACpB,wBAAA,yBAAyB,EAAE,iBAAiB;AAC5C,wBAAA,yBAAyB,EAAE,iBAAiB;AAC5C,wBAAA,yBAAyB,EAAE,iBAAiB;AAC5C,wBAAA,8BAA8B,EAAE,WAAW;AAC3C,wBAAA,kCAAkC,EAAE,0BAA0B;AAC9D,wBAAA,oCAAoC,EAAE,4BAA4B;AAClE,wBAAA,IAAI,EAAE,QAAQ;AACd,wBAAA,WAAW,EAAE,QAAQ;AACrB,wBAAA,sBAAsB,EAAE,kDAAkD;AAC1E,wBAAA,sBAAsB,EAAE,qCAAqC;AAC7D,wBAAA,sBAAsB,EAAE,uCAAuC;AAC/D,wBAAA,mBAAmB,EAAE,~~aAAa~~;~~AACnC~~,qBAAA,EAAA,QAAA,EAAA,y5CAAA,EAAA,MAAA,EAAA,CAAA,~~ggGAAA~~,CAAA,EAAA;;;~~AE5CH~~;;AAEG;;;;"}
1	+ {"version":3,"file":"raintonic-formaui-components-spinner.mjs","sources":["../../../lib/components/spinner/spinner.intl.ts","../../../lib/components/spinner/spinner.component.ts","../../../lib/components/spinner/spinner.component.html","../../../lib/components/spinner/raintonic-formaui-components-spinner.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\r\nimport { FuiIntlBase } from '@raintonic/formaui/core';\r\n\r\n@Injectable({ providedIn: 'root' })\r\nexport class FuiSpinnerIntl extends FuiIntlBase {\r\n loadingAriaLabel = 'Loading';\r\n}\r\n","import {\r\n ChangeDetectionStrategy,\r\n ChangeDetectorRef,\r\n Component,\r\n ViewEncapsulation,\r\n computed,\r\n inject,\r\n input,\r\n numberAttribute,\r\n} from '@angular/core';\r\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\r\nimport { FuiSpinnerMode, FuiSpinnerSize } from './spinner.types';\r\nimport { FuiSpinnerIntl } from './spinner.intl';\r\n\r\n/*\r\n @component FuiSpinnerComponent\r\n * @selector fui-spinner\r\n * @description A circular loading spinner with determinate and indeterminate modes.\r\n * Supports an overlay mode that covers its parent container.\r\n \r\n @input mode - Spinner mode: 'determinate' \| 'indeterminate'. Default 'indeterminate'.\r\n * @input value - Progress value (0-100) for determinate mode. Default 0.\r\n * @input size - Spinner size: 'sm' \| 'md' \| 'lg'. Default 'md'.\r\n * @input color - Optional custom CSS color for the spinner stroke.\r\n * @input overlay - Whether to render as a full-area overlay. Default false.\r\n * @input ariaLabel - Accessible label. Default 'Loading'.\r\n \r\n @example\r\n * <fui-spinner></fui-spinner>\r\n \r\n @example\r\n * <fui-spinner mode=\"determinate\" [value]=\"progress\" size=\"lg\"></fui-spinner>\r\n /\r\n@Component({\r\n selector: 'fui-spinner',\r\n standalone: true,\r\n imports: [],\r\n templateUrl: './spinner.component.html',\r\n styleUrls: ['./spinner.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n host: {\r\n class: 'fui-spinner',\r\n '[class.fui-spinner--sm]': 'size() === \"sm\"',\r\n '[class.fui-spinner--md]': 'size() === \"md\"',\r\n '[class.fui-spinner--lg]': 'size() === \"lg\"',\r\n '[class.fui-spinner--overlay]': 'overlay()',\r\n '[class.fui-spinner--determinate]': 'mode() === \"determinate\"',\r\n '[class.fui-spinner--indeterminate]': 'mode() === \"indeterminate\"',\r\n role: 'status',\r\n 'aria-live': 'polite',\r\n '[attr.aria-valuenow]': 'mode() === \"determinate\" ? clampedValue() : null',\r\n '[attr.aria-valuemin]': 'mode() === \"determinate\" ? 0 : null',\r\n '[attr.aria-valuemax]': 'mode() === \"determinate\" ? 100 : null',\r\n '[attr.aria-label]': 'ariaLabel() ?? intl.loadingAriaLabel',\r\n },\r\n})\r\nexport class FuiSpinnerComponent {\r\n readonly intl = inject(FuiSpinnerIntl);\r\n private readonly _cdr = inject(ChangeDetectorRef);\r\n\r\n readonly mode = input<FuiSpinnerMode>('indeterminate');\r\n readonly value = input<number, unknown>(0, { transform: numberAttribute });\r\n readonly size = input<FuiSpinnerSize>('md');\r\n readonly color = input<string \| null>(null);\r\n readonly overlay = input(false);\r\n readonly ariaLabel = input<string \| undefined>(undefined, { alias: 'aria-label' });\r\n\r\n constructor() {\r\n this.intl.changes.pipe(takeUntilDestroyed()).subscribe(() => { this._cdr.markForCheck(); });\r\n }\r\n\r\n private readonly RADIUS = 20;\r\n readonly circumference = 2 Math.PI * this.RADIUS;\r\n\r\n readonly clampedValue = computed(() => Math.max(0, Math.min(100, this.value() \|\| 0)));\r\n readonly strokeDashoffset = computed(() => {\r\n return this.circumference - (this.clampedValue() / 100) * this.circumference;\r\n });\r\n}\r\n","@if (overlay()) {\r\n <div class=\"fui-spinner__overlay\">\r\n <svg class=\"fui-spinner__svg\" viewBox=\"0 0 48 48\" [style.--fui-spinner-color]=\"color()\">\r\n @if (mode() === 'determinate') {\r\n <circle class=\"fui-spinner__track\" cx=\"24\" cy=\"24\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\r\n }\r\n <circle\r\n class=\"fui-spinner__circle\"\r\n cx=\"24\"\r\n cy=\"24\"\r\n r=\"20\"\r\n fill=\"none\"\r\n stroke-width=\"4\"\r\n [attr.stroke-dasharray]=\"mode() === 'determinate' ? circumference : null\"\r\n [attr.stroke-dashoffset]=\"mode() === 'determinate' ? strokeDashoffset() : null\"\r\n stroke-linecap=\"round\"\r\n />\r\n </svg>\r\n </div>\r\n} @else {\r\n <svg class=\"fui-spinner__svg\" viewBox=\"0 0 48 48\" [style.--fui-spinner-color]=\"color()\">\r\n @if (mode() === 'determinate') {\r\n <circle class=\"fui-spinner__track\" cx=\"24\" cy=\"24\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\r\n }\r\n <circle\r\n class=\"fui-spinner__circle\"\r\n cx=\"24\"\r\n cy=\"24\"\r\n r=\"20\"\r\n fill=\"none\"\r\n stroke-width=\"4\"\r\n [attr.stroke-dasharray]=\"mode() === 'determinate' ? circumference : null\"\r\n [attr.stroke-dashoffset]=\"mode() === 'determinate' ? strokeDashoffset() : null\"\r\n stroke-linecap=\"round\"\r\n />\r\n </svg>\r\n}\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/raintonic-formaui-components-stepper.mjs CHANGED Viewed

@@ -297,7 +297,7 @@ class FuiStepperComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiStepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiStepperComponent, isStandalone: true, selector: "fui-stepper", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null }, selectedIndex: { classPropertyName: "selectedIndex", publicName: "selectedIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange", animationDone: "animationDone" }, host: { properties: { "class.fui-stepper--horizontal": "orientation() === \"horizontal\"", "class.fui-stepper--vertical": "orientation() === \"vertical\"", "class.fui-stepper--linear": "linear()" }, classAttribute: "fui-stepper" }, providers: [{ provide: FORMAUI_STEPPER, useExisting: FuiStepperComponent }], queries: [{ propertyName: "steps", predicate: FuiStepComponent, isSignal: true }], ngImport: i0, template: "<!-- Step Headers -->\r\n<div class=\"fui-stepper__header\" role=\"tablist\" [attr.aria-orientation]=\"orientation()\">\r\n  @for (step of steps(); track $index; let last = $last) {\r\n    <button\r\n      class=\"fui-stepper__step-header\"\r\n      [class.fui-stepper__step-header--active]=\"_selectedIndex() === $index\"\r\n      [class.fui-stepper__step-header--completed]=\"step.state() === 'completed'\"\r\n      [class.fui-stepper__step-header--error]=\"step.hasError()\"\r\n      [class.fui-stepper__step-header--disabled]=\"_isStepDisabled($index)\"\r\n      [attr.aria-selected]=\"_selectedIndex() === $index\"\r\n      [attr.aria-disabled]=\"_isStepDisabled($index)\"\r\n      [attr.aria-current]=\"_selectedIndex() === $index ? 'step' : null\"\r\n      [attr.aria-label]=\"\r\n        step.label() + (step.state() === 'completed' ? ' (completed)' : step.hasError() ? ' (error)' : '')\r\n      \"\r\n      [disabled]=\"_isStepDisabled($index)\"\r\n      role=\"tab\"\r\n      [attr.id]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\r\n      [attr.aria-controls]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\r\n      (click)=\"_onStepHeaderClick($index)\"\r\n      (keydown)=\"_onHeaderKeydown($event, $index)\"\r\n      type=\"button\"\r\n    >\r\n      <div class=\"fui-stepper__step-icon\">\r\n        @if (step.state() === 'completed' && !step.icon()) {\r\n          <fui-icon name=\"check\" size=\"sm\"></fui-icon>\r\n        } @else if (step.hasError()) {\r\n          <fui-icon name=\"warning\" size=\"sm\"></fui-icon>\r\n        } @else if (step.icon()) {\r\n          <fui-icon [name]=\"step.icon()\" size=\"sm\"></fui-icon>\r\n        } @else {\r\n          <span class=\"fui-stepper__step-number\">{{ $index + 1 }}</span>\r\n        }\r\n      </div>\r\n      <div class=\"fui-stepper__step-text\">\r\n        <span class=\"fui-stepper__step-label\">{{ step.label() }}</span>\r\n        @if (step.description()) {\r\n          <span class=\"fui-stepper__step-description\">{{ step.description() }}</span>\r\n        }\r\n        @if (step.hasError()) {\r\n          <span class=\"fui-stepper__step-error\">{{ step.errorMessage() }}</span>\r\n        }\r\n      </div>\r\n    </button>\r\n    @if (!last) {\r\n      <div\r\n        class=\"fui-stepper__connector\"\r\n        [class.fui-stepper__connector--completed]=\"step.state() === 'completed'\"\r\n      ></div>\r\n    }\r\n  }\r\n</div>\r\n\r\n<!-- Step Content -->\r\n<div class=\"fui-stepper__content\">\r\n  @for (step of steps(); track $index) {\r\n    <div\r\n      class=\"fui-stepper__step-body\"\r\n      [class.fui-stepper__step-body--active]=\"_selectedIndex() === $index\"\r\n      role=\"tabpanel\"\r\n      [attr.id]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\r\n      [attr.aria-labelledby]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\r\n      [attr.aria-expanded]=\"_selectedIndex() === $index\"\r\n    >\r\n      @if (_selectedIndex() === $index || step._interacted()) {\r\n        <ng-container [ngTemplateOutlet]=\"step.contentTemplate()!\"></ng-container>\r\n      }\r\n    </div>\r\n  }\r\n</div>\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}.fui-stepper{display:block;font-family:var(--fui-font-family-sans)}.fui-stepper__header{display:flex;align-items:center}.fui-stepper__step-header{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;outline:none}.fui-stepper__step-header{display:flex;align-items:center;gap:var(--fui-gap-8);padding:var(--fui-padding-8) var(--fui-padding-12);border-radius:var(--fui-border-radius-md);transition:background-color,color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms;cursor:pointer;flex-shrink:0}.fui-stepper__step-header:hover:not(:disabled){background-color:var(--fui-surface-02)}.fui-stepper__step-header:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-stepper__step-header--active .fui-stepper__step-icon{background-color:var(--fui-primary);color:var(--fui-primary-contrast);border-color:var(--fui-primary)}.fui-stepper__step-header--active .fui-stepper__step-label{color:var(--fui-text-primary);font-weight:var(--fui-font-weight-semibold)}.fui-stepper__step-header--completed .fui-stepper__step-icon{background-color:var(--fui-success);color:var(--fui-white);border-color:var(--fui-success)}.fui-stepper__step-header--completed .fui-stepper__step-label{color:var(--fui-text-primary)}.fui-stepper__step-header--error .fui-stepper__step-icon{background-color:var(--fui-danger);color:var(--fui-white);border-color:var(--fui-danger)}.fui-stepper__step-header--error .fui-stepper__step-label{color:var(--fui-danger)}.fui-stepper__step-header--disabled{cursor:not-allowed;opacity:.5}.fui-stepper__step-header--disabled .fui-stepper__step-icon{background-color:var(--fui-surface-03);color:var(--fui-text-disabled);border-color:var(--fui-border-color)}.fui-stepper__step-header--disabled .fui-stepper__step-label{color:var(--fui-text-disabled)}.fui-stepper__step-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;border:2px solid var(--fui-border-color);background-color:var(--fui-surface-01);color:var(--fui-text-secondary);flex-shrink:0;transition:background-color,color,border-color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms}.fui-stepper__step-number{font-size:var(--fui-font-size-02);font-weight:var(--fui-font-weight-semibold);line-height:1}.fui-stepper__step-text{display:flex;flex-direction:column;gap:2px;text-align:left}.fui-stepper__step-label{font-size:var(--fui-font-size-02);font-weight:var(--fui-font-weight-medium);color:var(--fui-text-secondary);transition:color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms}.fui-stepper__step-description{font-size:var(--fui-font-size-01);color:var(--fui-text-secondary)}.fui-stepper__step-error{font-size:var(--fui-font-size-01);color:var(--fui-danger)}.fui-stepper__connector{flex:1;height:2px;min-width:24px;background-color:var(--fui-border-color);transition:background-color var(--fui-duration-moderate-01) var(--fui-ease-standard) 0ms}.fui-stepper__connector--completed{background-color:var(--fui-success)}.fui-stepper__content{margin-top:var(--fui-spacing-05)}.fui-stepper__step-body{display:none}.fui-stepper__step-body--active{display:block;animation:fui-stepper-fade-in var(--fui-duration-fast-02) var(--fui-ease-entrance)}.fui-stepper--horizontal .fui-stepper__header{flex-direction:row}.fui-stepper--vertical .fui-stepper__header{flex-direction:column;align-items:stretch}.fui-stepper--vertical .fui-stepper__connector{width:2px;height:24px;min-width:unset;flex:unset;margin-left:23px}.fui-stepper--vertical .fui-stepper__step-header{width:100%}@keyframes fui-stepper-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: FuiIconComponent, selector: "fui-icon", inputs: ["name", "size", "weight", "color", "ariaLabel", "spin", "pulse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiStepperComponent, isStandalone: true, selector: "fui-stepper", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null }, selectedIndex: { classPropertyName: "selectedIndex", publicName: "selectedIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange", animationDone: "animationDone" }, host: { properties: { "class.fui-stepper--horizontal": "orientation() === \"horizontal\"", "class.fui-stepper--vertical": "orientation() === \"vertical\"", "class.fui-stepper--linear": "linear()" }, classAttribute: "fui-stepper" }, providers: [{ provide: FORMAUI_STEPPER, useExisting: FuiStepperComponent }], queries: [{ propertyName: "steps", predicate: FuiStepComponent, isSignal: true }], ngImport: i0, template: "<!-- Step Headers -->\r\n<div class=\"fui-stepper__header\" role=\"tablist\" [attr.aria-orientation]=\"orientation()\">\r\n  @for (step of steps(); track $index; let last = $last) {\r\n    <button\r\n      class=\"fui-stepper__step-header\"\r\n      [class.fui-stepper__step-header--active]=\"_selectedIndex() === $index\"\r\n      [class.fui-stepper__step-header--completed]=\"step.state() === 'completed'\"\r\n      [class.fui-stepper__step-header--error]=\"step.hasError()\"\r\n      [class.fui-stepper__step-header--disabled]=\"_isStepDisabled($index)\"\r\n      [attr.aria-selected]=\"_selectedIndex() === $index\"\r\n      [attr.aria-disabled]=\"_isStepDisabled($index)\"\r\n      [attr.aria-current]=\"_selectedIndex() === $index ? 'step' : null\"\r\n      [attr.aria-label]=\"\r\n        step.label() + (step.state() === 'completed' ? ' (completed)' : step.hasError() ? ' (error)' : '')\r\n      \"\r\n      [disabled]=\"_isStepDisabled($index)\"\r\n      role=\"tab\"\r\n      [attr.id]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\r\n      [attr.aria-controls]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\r\n      (click)=\"_onStepHeaderClick($index)\"\r\n      (keydown)=\"_onHeaderKeydown($event, $index)\"\r\n      type=\"button\"\r\n    >\r\n      <div class=\"fui-stepper__step-icon\">\r\n        @if (step.state() === 'completed' && !step.icon()) {\r\n          <fui-icon name=\"check\" size=\"sm\"></fui-icon>\r\n        } @else if (step.hasError()) {\r\n          <fui-icon name=\"warning\" size=\"sm\"></fui-icon>\r\n        } @else if (step.icon()) {\r\n          <fui-icon [name]=\"step.icon()\" size=\"sm\"></fui-icon>\r\n        } @else {\r\n          <span class=\"fui-stepper__step-number\">{{ $index + 1 }}</span>\r\n        }\r\n      </div>\r\n      <div class=\"fui-stepper__step-text\">\r\n        <span class=\"fui-stepper__step-label\">{{ step.label() }}</span>\r\n        @if (step.description()) {\r\n          <span class=\"fui-stepper__step-description\">{{ step.description() }}</span>\r\n        }\r\n        @if (step.hasError()) {\r\n          <span class=\"fui-stepper__step-error\">{{ step.errorMessage() }}</span>\r\n        }\r\n      </div>\r\n    </button>\r\n    @if (!last) {\r\n      <div\r\n        class=\"fui-stepper__connector\"\r\n        [class.fui-stepper__connector--completed]=\"step.state() === 'completed'\"\r\n      ></div>\r\n    }\r\n  }\r\n</div>\r\n\r\n<!-- Step Content -->\r\n<div class=\"fui-stepper__content\">\r\n  @for (step of steps(); track $index) {\r\n    <div\r\n      class=\"fui-stepper__step-body\"\r\n      [class.fui-stepper__step-body--active]=\"_selectedIndex() === $index\"\r\n      role=\"tabpanel\"\r\n      [attr.id]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\r\n      [attr.aria-labelledby]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\r\n      [attr.aria-expanded]=\"_selectedIndex() === $index\"\r\n    >\r\n      @if (_selectedIndex() === $index || step._interacted()) {\r\n        <ng-container [ngTemplateOutlet]=\"step.contentTemplate()!\"></ng-container>\r\n      }\r\n    </div>\r\n  }\r\n</div>\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-stepper{display:block;font-family:var(--fui-font-family-sans)}.fui-stepper__header{display:flex;align-items:center}.fui-stepper__step-header{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;outline:none}.fui-stepper__step-header{display:flex;align-items:center;gap:var(--fui-gap-8);padding:var(--fui-padding-8) var(--fui-padding-12);border-radius:var(--fui-border-radius-md);transition:background-color,color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms;cursor:pointer;flex-shrink:0}.fui-stepper__step-header:hover:not(:disabled){background-color:var(--fui-surface-02)}.fui-stepper__step-header:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-stepper__step-header--active .fui-stepper__step-icon{background-color:var(--fui-primary);color:var(--fui-primary-contrast);border-color:var(--fui-primary)}.fui-stepper__step-header--active .fui-stepper__step-label{color:var(--fui-text-primary);font-weight:var(--fui-font-weight-semibold)}.fui-stepper__step-header--completed .fui-stepper__step-icon{background-color:var(--fui-success);color:var(--fui-white);border-color:var(--fui-success)}.fui-stepper__step-header--completed .fui-stepper__step-label{color:var(--fui-text-primary)}.fui-stepper__step-header--error .fui-stepper__step-icon{background-color:var(--fui-danger);color:var(--fui-white);border-color:var(--fui-danger)}.fui-stepper__step-header--error .fui-stepper__step-label{color:var(--fui-danger)}.fui-stepper__step-header--disabled{cursor:not-allowed;opacity:.5}.fui-stepper__step-header--disabled .fui-stepper__step-icon{background-color:var(--fui-surface-03);color:var(--fui-text-disabled);border-color:var(--fui-border-color)}.fui-stepper__step-header--disabled .fui-stepper__step-label{color:var(--fui-text-disabled)}.fui-stepper__step-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;border:2px solid var(--fui-border-color);background-color:var(--fui-surface-01);color:var(--fui-text-secondary);flex-shrink:0;transition:background-color,color,border-color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms}.fui-stepper__step-number{font-size:var(--fui-font-size-02);font-weight:var(--fui-font-weight-semibold);line-height:1}.fui-stepper__step-text{display:flex;flex-direction:column;gap:2px;text-align:left}.fui-stepper__step-label{font-size:var(--fui-font-size-02);font-weight:var(--fui-font-weight-medium);color:var(--fui-text-secondary);transition:color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms}.fui-stepper__step-description{font-size:var(--fui-font-size-01);color:var(--fui-text-secondary)}.fui-stepper__step-error{font-size:var(--fui-font-size-01);color:var(--fui-danger)}.fui-stepper__connector{flex:1;height:2px;min-width:24px;background-color:var(--fui-border-color);transition:background-color var(--fui-duration-moderate-01) var(--fui-ease-standard) 0ms}.fui-stepper__connector--completed{background-color:var(--fui-success)}.fui-stepper__content{margin-top:var(--fui-spacing-05)}.fui-stepper__step-body{display:none}.fui-stepper__step-body--active{display:block;animation:fui-stepper-fade-in var(--fui-duration-fast-02) var(--fui-ease-entrance)}.fui-stepper--horizontal .fui-stepper__header{flex-direction:row}.fui-stepper--vertical .fui-stepper__header{flex-direction:column;align-items:stretch}.fui-stepper--vertical .fui-stepper__connector{width:2px;height:24px;min-width:unset;flex:unset;margin-left:23px}.fui-stepper--vertical .fui-stepper__step-header{width:100%}@keyframes fui-stepper-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: FuiIconComponent, selector: "fui-icon", inputs: ["name", "size", "weight", "color", "ariaLabel", "spin", "pulse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiStepperComponent, decorators: [{
             type: Component,
@@ -306,7 +306,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImpor
                         '[class.fui-stepper--horizontal]': 'orientation() === "horizontal"',
                         '[class.fui-stepper--vertical]': 'orientation() === "vertical"',
                         '[class.fui-stepper--linear]': 'linear()',
-                    }, providers: [{ provide: FORMAUI_STEPPER, useExisting: FuiStepperComponent }], template: "<!-- Step Headers -->\r\n<div class=\"fui-stepper__header\" role=\"tablist\" [attr.aria-orientation]=\"orientation()\">\r\n  @for (step of steps(); track $index; let last = $last) {\r\n    <button\r\n      class=\"fui-stepper__step-header\"\r\n      [class.fui-stepper__step-header--active]=\"_selectedIndex() === $index\"\r\n      [class.fui-stepper__step-header--completed]=\"step.state() === 'completed'\"\r\n      [class.fui-stepper__step-header--error]=\"step.hasError()\"\r\n      [class.fui-stepper__step-header--disabled]=\"_isStepDisabled($index)\"\r\n      [attr.aria-selected]=\"_selectedIndex() === $index\"\r\n      [attr.aria-disabled]=\"_isStepDisabled($index)\"\r\n      [attr.aria-current]=\"_selectedIndex() === $index ? 'step' : null\"\r\n      [attr.aria-label]=\"\r\n        step.label() + (step.state() === 'completed' ? ' (completed)' : step.hasError() ? ' (error)' : '')\r\n      \"\r\n      [disabled]=\"_isStepDisabled($index)\"\r\n      role=\"tab\"\r\n      [attr.id]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\r\n      [attr.aria-controls]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\r\n      (click)=\"_onStepHeaderClick($index)\"\r\n      (keydown)=\"_onHeaderKeydown($event, $index)\"\r\n      type=\"button\"\r\n    >\r\n      <div class=\"fui-stepper__step-icon\">\r\n        @if (step.state() === 'completed' && !step.icon()) {\r\n          <fui-icon name=\"check\" size=\"sm\"></fui-icon>\r\n        } @else if (step.hasError()) {\r\n          <fui-icon name=\"warning\" size=\"sm\"></fui-icon>\r\n        } @else if (step.icon()) {\r\n          <fui-icon [name]=\"step.icon()\" size=\"sm\"></fui-icon>\r\n        } @else {\r\n          <span class=\"fui-stepper__step-number\">{{ $index + 1 }}</span>\r\n        }\r\n      </div>\r\n      <div class=\"fui-stepper__step-text\">\r\n        <span class=\"fui-stepper__step-label\">{{ step.label() }}</span>\r\n        @if (step.description()) {\r\n          <span class=\"fui-stepper__step-description\">{{ step.description() }}</span>\r\n        }\r\n        @if (step.hasError()) {\r\n          <span class=\"fui-stepper__step-error\">{{ step.errorMessage() }}</span>\r\n        }\r\n      </div>\r\n    </button>\r\n    @if (!last) {\r\n      <div\r\n        class=\"fui-stepper__connector\"\r\n        [class.fui-stepper__connector--completed]=\"step.state() === 'completed'\"\r\n      ></div>\r\n    }\r\n  }\r\n</div>\r\n\r\n<!-- Step Content -->\r\n<div class=\"fui-stepper__content\">\r\n  @for (step of steps(); track $index) {\r\n    <div\r\n      class=\"fui-stepper__step-body\"\r\n      [class.fui-stepper__step-body--active]=\"_selectedIndex() === $index\"\r\n      role=\"tabpanel\"\r\n      [attr.id]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\r\n      [attr.aria-labelledby]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\r\n      [attr.aria-expanded]=\"_selectedIndex() === $index\"\r\n    >\r\n      @if (_selectedIndex() === $index || step._interacted()) {\r\n        <ng-container [ngTemplateOutlet]=\"step.contentTemplate()!\"></ng-container>\r\n      }\r\n    </div>\r\n  }\r\n</div>\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}.fui-stepper{display:block;font-family:var(--fui-font-family-sans)}.fui-stepper__header{display:flex;align-items:center}.fui-stepper__step-header{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;outline:none}.fui-stepper__step-header{display:flex;align-items:center;gap:var(--fui-gap-8);padding:var(--fui-padding-8) var(--fui-padding-12);border-radius:var(--fui-border-radius-md);transition:background-color,color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms;cursor:pointer;flex-shrink:0}.fui-stepper__step-header:hover:not(:disabled){background-color:var(--fui-surface-02)}.fui-stepper__step-header:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-stepper__step-header--active .fui-stepper__step-icon{background-color:var(--fui-primary);color:var(--fui-primary-contrast);border-color:var(--fui-primary)}.fui-stepper__step-header--active .fui-stepper__step-label{color:var(--fui-text-primary);font-weight:var(--fui-font-weight-semibold)}.fui-stepper__step-header--completed .fui-stepper__step-icon{background-color:var(--fui-success);color:var(--fui-white);border-color:var(--fui-success)}.fui-stepper__step-header--completed .fui-stepper__step-label{color:var(--fui-text-primary)}.fui-stepper__step-header--error .fui-stepper__step-icon{background-color:var(--fui-danger);color:var(--fui-white);border-color:var(--fui-danger)}.fui-stepper__step-header--error .fui-stepper__step-label{color:var(--fui-danger)}.fui-stepper__step-header--disabled{cursor:not-allowed;opacity:.5}.fui-stepper__step-header--disabled .fui-stepper__step-icon{background-color:var(--fui-surface-03);color:var(--fui-text-disabled);border-color:var(--fui-border-color)}.fui-stepper__step-header--disabled .fui-stepper__step-label{color:var(--fui-text-disabled)}.fui-stepper__step-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;border:2px solid var(--fui-border-color);background-color:var(--fui-surface-01);color:var(--fui-text-secondary);flex-shrink:0;transition:background-color,color,border-color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms}.fui-stepper__step-number{font-size:var(--fui-font-size-02);font-weight:var(--fui-font-weight-semibold);line-height:1}.fui-stepper__step-text{display:flex;flex-direction:column;gap:2px;text-align:left}.fui-stepper__step-label{font-size:var(--fui-font-size-02);font-weight:var(--fui-font-weight-medium);color:var(--fui-text-secondary);transition:color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms}.fui-stepper__step-description{font-size:var(--fui-font-size-01);color:var(--fui-text-secondary)}.fui-stepper__step-error{font-size:var(--fui-font-size-01);color:var(--fui-danger)}.fui-stepper__connector{flex:1;height:2px;min-width:24px;background-color:var(--fui-border-color);transition:background-color var(--fui-duration-moderate-01) var(--fui-ease-standard) 0ms}.fui-stepper__connector--completed{background-color:var(--fui-success)}.fui-stepper__content{margin-top:var(--fui-spacing-05)}.fui-stepper__step-body{display:none}.fui-stepper__step-body--active{display:block;animation:fui-stepper-fade-in var(--fui-duration-fast-02) var(--fui-ease-entrance)}.fui-stepper--horizontal .fui-stepper__header{flex-direction:row}.fui-stepper--vertical .fui-stepper__header{flex-direction:column;align-items:stretch}.fui-stepper--vertical .fui-stepper__connector{width:2px;height:24px;min-width:unset;flex:unset;margin-left:23px}.fui-stepper--vertical .fui-stepper__step-header{width:100%}@keyframes fui-stepper-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}\n"] }]
+                    }, providers: [{ provide: FORMAUI_STEPPER, useExisting: FuiStepperComponent }], template: "<!-- Step Headers -->\r\n<div class=\"fui-stepper__header\" role=\"tablist\" [attr.aria-orientation]=\"orientation()\">\r\n  @for (step of steps(); track $index; let last = $last) {\r\n    <button\r\n      class=\"fui-stepper__step-header\"\r\n      [class.fui-stepper__step-header--active]=\"_selectedIndex() === $index\"\r\n      [class.fui-stepper__step-header--completed]=\"step.state() === 'completed'\"\r\n      [class.fui-stepper__step-header--error]=\"step.hasError()\"\r\n      [class.fui-stepper__step-header--disabled]=\"_isStepDisabled($index)\"\r\n      [attr.aria-selected]=\"_selectedIndex() === $index\"\r\n      [attr.aria-disabled]=\"_isStepDisabled($index)\"\r\n      [attr.aria-current]=\"_selectedIndex() === $index ? 'step' : null\"\r\n      [attr.aria-label]=\"\r\n        step.label() + (step.state() === 'completed' ? ' (completed)' : step.hasError() ? ' (error)' : '')\r\n      \"\r\n      [disabled]=\"_isStepDisabled($index)\"\r\n      role=\"tab\"\r\n      [attr.id]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\r\n      [attr.aria-controls]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\r\n      (click)=\"_onStepHeaderClick($index)\"\r\n      (keydown)=\"_onHeaderKeydown($event, $index)\"\r\n      type=\"button\"\r\n    >\r\n      <div class=\"fui-stepper__step-icon\">\r\n        @if (step.state() === 'completed' && !step.icon()) {\r\n          <fui-icon name=\"check\" size=\"sm\"></fui-icon>\r\n        } @else if (step.hasError()) {\r\n          <fui-icon name=\"warning\" size=\"sm\"></fui-icon>\r\n        } @else if (step.icon()) {\r\n          <fui-icon [name]=\"step.icon()\" size=\"sm\"></fui-icon>\r\n        } @else {\r\n          <span class=\"fui-stepper__step-number\">{{ $index + 1 }}</span>\r\n        }\r\n      </div>\r\n      <div class=\"fui-stepper__step-text\">\r\n        <span class=\"fui-stepper__step-label\">{{ step.label() }}</span>\r\n        @if (step.description()) {\r\n          <span class=\"fui-stepper__step-description\">{{ step.description() }}</span>\r\n        }\r\n        @if (step.hasError()) {\r\n          <span class=\"fui-stepper__step-error\">{{ step.errorMessage() }}</span>\r\n        }\r\n      </div>\r\n    </button>\r\n    @if (!last) {\r\n      <div\r\n        class=\"fui-stepper__connector\"\r\n        [class.fui-stepper__connector--completed]=\"step.state() === 'completed'\"\r\n      ></div>\r\n    }\r\n  }\r\n</div>\r\n\r\n<!-- Step Content -->\r\n<div class=\"fui-stepper__content\">\r\n  @for (step of steps(); track $index) {\r\n    <div\r\n      class=\"fui-stepper__step-body\"\r\n      [class.fui-stepper__step-body--active]=\"_selectedIndex() === $index\"\r\n      role=\"tabpanel\"\r\n      [attr.id]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\r\n      [attr.aria-labelledby]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\r\n      [attr.aria-expanded]=\"_selectedIndex() === $index\"\r\n    >\r\n      @if (_selectedIndex() === $index || step._interacted()) {\r\n        <ng-container [ngTemplateOutlet]=\"step.contentTemplate()!\"></ng-container>\r\n      }\r\n    </div>\r\n  }\r\n</div>\r\n", styles: ["@keyframes fui-skeleton-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}@keyframes fui-spin{to{transform:rotate(360deg)}}@keyframes fui-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}.fui-motion-fade-in{transition:opacity var(--fui-duration-fast-02) var(--fui-ease-entrance) 0ms}.fui-motion-fade-out{transition:opacity var(--fui-duration-fast-01) var(--fui-ease-exit) 0ms}.fui-motion-slide-in-bottom{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-bottom.fui-motion-entering{transform:translateY(1rem)}.fui-motion-slide-in-top{transition:transform var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:translateY(0)}.fui-motion-slide-in-top.fui-motion-entering{transform:translateY(-1rem)}.fui-motion-scale-in{transition:transform,opacity var(--fui-duration-moderate-01) var(--fui-ease-entrance) 0ms;transform:scale(1);opacity:1}.fui-motion-scale-in.fui-motion-entering{transform:scale(.95);opacity:0}.fui-no-motion{transition:none!important;animation:none!important}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@keyframes fui-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}@keyframes fui-slide-in{0%{transform:translate(120%)}to{transform:translate(0)}}.fui-slide-in{animation:fui-slide-in var(--fui-duration-moderate-01) var(--fui-ease-entrance)}@keyframes fui-popover-enter{0%{opacity:0;transform:translateY(-14px)}60%{opacity:1}to{opacity:1;transform:translateY(0)}}.fui-stepper{display:block;font-family:var(--fui-font-family-sans)}.fui-stepper__header{display:flex;align-items:center}.fui-stepper__step-header{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;outline:none}.fui-stepper__step-header{display:flex;align-items:center;gap:var(--fui-gap-8);padding:var(--fui-padding-8) var(--fui-padding-12);border-radius:var(--fui-border-radius-md);transition:background-color,color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms;cursor:pointer;flex-shrink:0}.fui-stepper__step-header:hover:not(:disabled){background-color:var(--fui-surface-02)}.fui-stepper__step-header:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-stepper__step-header--active .fui-stepper__step-icon{background-color:var(--fui-primary);color:var(--fui-primary-contrast);border-color:var(--fui-primary)}.fui-stepper__step-header--active .fui-stepper__step-label{color:var(--fui-text-primary);font-weight:var(--fui-font-weight-semibold)}.fui-stepper__step-header--completed .fui-stepper__step-icon{background-color:var(--fui-success);color:var(--fui-white);border-color:var(--fui-success)}.fui-stepper__step-header--completed .fui-stepper__step-label{color:var(--fui-text-primary)}.fui-stepper__step-header--error .fui-stepper__step-icon{background-color:var(--fui-danger);color:var(--fui-white);border-color:var(--fui-danger)}.fui-stepper__step-header--error .fui-stepper__step-label{color:var(--fui-danger)}.fui-stepper__step-header--disabled{cursor:not-allowed;opacity:.5}.fui-stepper__step-header--disabled .fui-stepper__step-icon{background-color:var(--fui-surface-03);color:var(--fui-text-disabled);border-color:var(--fui-border-color)}.fui-stepper__step-header--disabled .fui-stepper__step-label{color:var(--fui-text-disabled)}.fui-stepper__step-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;border:2px solid var(--fui-border-color);background-color:var(--fui-surface-01);color:var(--fui-text-secondary);flex-shrink:0;transition:background-color,color,border-color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms}.fui-stepper__step-number{font-size:var(--fui-font-size-02);font-weight:var(--fui-font-weight-semibold);line-height:1}.fui-stepper__step-text{display:flex;flex-direction:column;gap:2px;text-align:left}.fui-stepper__step-label{font-size:var(--fui-font-size-02);font-weight:var(--fui-font-weight-medium);color:var(--fui-text-secondary);transition:color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms}.fui-stepper__step-description{font-size:var(--fui-font-size-01);color:var(--fui-text-secondary)}.fui-stepper__step-error{font-size:var(--fui-font-size-01);color:var(--fui-danger)}.fui-stepper__connector{flex:1;height:2px;min-width:24px;background-color:var(--fui-border-color);transition:background-color var(--fui-duration-moderate-01) var(--fui-ease-standard) 0ms}.fui-stepper__connector--completed{background-color:var(--fui-success)}.fui-stepper__content{margin-top:var(--fui-spacing-05)}.fui-stepper__step-body{display:none}.fui-stepper__step-body--active{display:block;animation:fui-stepper-fade-in var(--fui-duration-fast-02) var(--fui-ease-entrance)}.fui-stepper--horizontal .fui-stepper__header{flex-direction:row}.fui-stepper--vertical .fui-stepper__header{flex-direction:column;align-items:stretch}.fui-stepper--vertical .fui-stepper__connector{width:2px;height:24px;min-width:unset;flex:unset;margin-left:23px}.fui-stepper--vertical .fui-stepper__step-header{width:100%}@keyframes fui-stepper-fade-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], linear: [{ type: i0.Input, args: [{ isSignal: true, alias: "linear", required: false }] }], selectedIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedIndex", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], animationDone: [{ type: i0.Output, args: ["animationDone"] }], steps: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => FuiStepComponent), { isSignal: true }] }] } });
 /**

package/fesm2022/raintonic-formaui-components-stepper.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"raintonic-formaui-components-stepper.mjs","sources":["../../../lib/components/stepper/step.component.ts","../../../lib/components/stepper/stepper.types.ts","../../../lib/components/stepper/stepper.component.ts","../../../lib/components/stepper/stepper.component.html","../../../lib/components/stepper/raintonic-formaui-components-stepper.ts"],"sourcesContent":["import {\r\n Component,\r\n ChangeDetectionStrategy,\r\n ViewEncapsulation,\r\n input,\r\n signal,\r\n computed,\r\n viewChild,\r\n TemplateRef,\r\n booleanAttribute,\r\n WritableSignal,\r\n Signal,\r\n} from '@angular/core';\r\nimport { AbstractControl } from '@angular/forms';\r\nimport { StepState } from './stepper.types';\r\n\r\n/*\r\n # FuiStepComponent\r\n \r\n Represents a single step within an `fui-stepper`.\r\n * Each step has a label, optional description/icon, and content that is lazily rendered.\r\n \r\n ## Usage\r\n \r\n ```html\r\n * <fui-stepper>\r\n * <fui-step label=\"Account\" description=\"Create your account\">\r\n * <p>Account creation form here...</p>\r\n * </fui-step>\r\n * <fui-step label=\"Profile\" icon=\"user\">\r\n * <p>Profile setup here...</p>\r\n * </fui-step>\r\n * </fui-stepper>\r\n * ```\r\n /\r\n@Component({\r\n selector: 'fui-step',\r\n standalone: true,\r\n template: '<ng-template><ng-content></ng-content></ng-template>',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class FuiStepComponent {\r\n // Inputs\r\n readonly label = input.required<string>();\r\n readonly description = input('');\r\n readonly icon = input('');\r\n readonly completed = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n readonly editable = input<boolean, unknown>(true, { transform: booleanAttribute });\r\n readonly errorMessage = input('');\r\n readonly stepControl = input<AbstractControl \| null>(null);\r\n readonly optional = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n // Internal state\r\n readonly _interacted: WritableSignal<boolean> = signal(false);\r\n\r\n // Content template reference for lazy rendering\r\n readonly contentTemplate: Signal<TemplateRef<unknown> \| undefined> = viewChild(TemplateRef);\r\n\r\n // Computed state\r\n readonly hasError: Signal<boolean> = computed(() => {\r\n const errMsg = this.errorMessage();\r\n if (errMsg && errMsg.length > 0) {\r\n return true;\r\n }\r\n const control = this.stepControl();\r\n return !!(control && control.invalid && this._interacted());\r\n });\r\n\r\n readonly state: Signal<StepState> = computed(() => {\r\n if (this.hasError()) {\r\n return 'error';\r\n }\r\n if (this.completed()) {\r\n return 'completed';\r\n }\r\n return 'default';\r\n });\r\n\r\n /* Mark this step as interacted and select it via the parent stepper. /\r\n select(): void {\r\n this._interacted.set(true);\r\n }\r\n\r\n /* Reset the step to its initial state. /\r\n reset(): void {\r\n this._interacted.set(false);\r\n const control = this.stepControl();\r\n if (control) {\r\n control.reset();\r\n }\r\n }\r\n}\r\n","import { InjectionToken } from '@angular/core';\r\n\r\nexport type StepperOrientation = 'horizontal' \| 'vertical';\r\nexport type StepState = 'active' \| 'completed' \| 'error' \| 'disabled' \| 'default';\r\n\r\nexport interface StepSelectionChange {\r\n selectedIndex: number;\r\n previousIndex: number;\r\n selectedStep: unknown;\r\n previousStep: unknown;\r\n}\r\n\r\nexport const FORMAUI_STEPPER = new InjectionToken<unknown>('FORMAUI_STEPPER');\r\n","import {\r\n Component,\r\n ChangeDetectionStrategy,\r\n ViewEncapsulation,\r\n input,\r\n output,\r\n signal,\r\n computed,\r\n effect,\r\n contentChildren,\r\n booleanAttribute,\r\n WritableSignal,\r\n} from '@angular/core';\r\nimport { NgTemplateOutlet } from '@angular/common';\r\nimport { FuiIconComponent } from '@raintonic/formaui/components/icon';\r\nimport { FuiStepComponent } from './step.component';\r\nimport { StepperOrientation, StepSelectionChange, FORMAUI_STEPPER } from './stepper.types';\r\n\r\nlet nextStepperId = 0;\r\n\r\n/\r\n # FuiStepperComponent\r\n \r\n A stepper component that guides users through a sequence of steps.\r\n * Supports horizontal and vertical orientations, linear and non-linear navigation,\r\n * step validation, and lazy content rendering.\r\n \r\n ## Usage\r\n \r\n ### Basic horizontal stepper\r\n * ```html\r\n * <fui-stepper>\r\n * <fui-step label=\"Step 1\">Content 1</fui-step>\r\n * <fui-step label=\"Step 2\">Content 2</fui-step>\r\n * <fui-step label=\"Step 3\">Content 3</fui-step>\r\n * </fui-stepper>\r\n * ```\r\n \r\n ### Vertical stepper\r\n * ```html\r\n * <fui-stepper orientation=\"vertical\">\r\n * <fui-step label=\"Step 1\">Content 1</fui-step>\r\n * <fui-step label=\"Step 2\">Content 2</fui-step>\r\n * </fui-stepper>\r\n * ```\r\n \r\n ### Linear stepper with form validation\r\n * ```html\r\n * <fui-stepper [linear]=\"true\">\r\n * <fui-step label=\"Account\" [stepControl]=\"accountForm\">\r\n * <form [formGroup]=\"accountForm\">...</form>\r\n * </fui-step>\r\n * <fui-step label=\"Address\" [stepControl]=\"addressForm\">\r\n * <form [formGroup]=\"addressForm\">...</form>\r\n * </fui-step>\r\n * </fui-stepper>\r\n * ```\r\n /\r\n@Component({\r\n selector: 'fui-stepper',\r\n standalone: true,\r\n imports: [NgTemplateOutlet, FuiIconComponent],\r\n templateUrl: './stepper.component.html',\r\n styleUrls: ['./stepper.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n host: {\r\n class: 'fui-stepper',\r\n '[class.fui-stepper--horizontal]': 'orientation() === \"horizontal\"',\r\n '[class.fui-stepper--vertical]': 'orientation() === \"vertical\"',\r\n '[class.fui-stepper--linear]': 'linear()',\r\n },\r\n providers: [{ provide: FORMAUI_STEPPER, useExisting: FuiStepperComponent }],\r\n})\r\nexport class FuiStepperComponent {\r\n // Inputs\r\n readonly orientation = input<StepperOrientation>('horizontal');\r\n readonly linear = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n readonly selectedIndex = input(0);\r\n\r\n // Outputs\r\n readonly selectionChange = output<StepSelectionChange>();\r\n readonly animationDone = output();\r\n\r\n // Content children\r\n readonly steps = contentChildren(FuiStepComponent);\r\n\r\n // Internal state\r\n readonly _selectedIndex: WritableSignal<number> = signal(0);\r\n\r\n // Unique ID for ARIA linking\r\n readonly _uniqueId = nextStepperId++;\r\n\r\n // Computed: active step\r\n readonly _selectedStep = computed(() => {\r\n const allSteps = this.steps();\r\n const idx = this._selectedIndex();\r\n return allSteps[idx] ?? null;\r\n });\r\n\r\n constructor() {\r\n // Sync selectedIndex input with internal state\r\n effect(() => {\r\n const idx = this.selectedIndex();\r\n this._selectedIndex.set(idx);\r\n });\r\n }\r\n\r\n /* Navigate to the next step. In linear mode, validates the current step first. /\r\n next(): void {\r\n const allSteps = this.steps();\r\n const currentIdx = this._selectedIndex();\r\n\r\n if (currentIdx >= allSteps.length - 1) {\r\n return;\r\n }\r\n\r\n if (this.linear()) {\r\n const currentStep = allSteps[currentIdx];\r\n if (currentStep) {\r\n currentStep._interacted.set(true);\r\n const control = currentStep.stepControl();\r\n if (control?.invalid) {\r\n return;\r\n }\r\n }\r\n }\r\n\r\n this._setSelectedIndex(currentIdx + 1);\r\n }\r\n\r\n /* Navigate to the previous step. /\r\n previous(): void {\r\n const currentIdx = this._selectedIndex();\r\n if (currentIdx > 0) {\r\n this._setSelectedIndex(currentIdx - 1);\r\n }\r\n }\r\n\r\n /* Navigate directly to a specific step by index. /\r\n goToStep(index: number): void {\r\n const allSteps = this.steps();\r\n if (index < 0 \|\| index >= allSteps.length) {\r\n return;\r\n }\r\n\r\n if (this.linear() && index > this._selectedIndex()) {\r\n // In linear mode, can only go forward if all preceding steps are valid\r\n for (let i = this._selectedIndex(); i < index; i++) {\r\n const step = allSteps[i];\r\n if (step) {\r\n step._interacted.set(true);\r\n const control = step.stepControl();\r\n if (control?.invalid) {\r\n return;\r\n }\r\n }\r\n }\r\n }\r\n\r\n this._setSelectedIndex(index);\r\n }\r\n\r\n /* Reset all steps and return to the first step. /\r\n reset(): void {\r\n this._selectedIndex.set(0);\r\n this.steps().forEach((step) => {\r\n step.reset();\r\n });\r\n }\r\n\r\n /* @internal Handle step header click /\r\n _onStepHeaderClick(index: number): void {\r\n this.goToStep(index);\r\n }\r\n\r\n /* @internal Check if a step is disabled for navigation /\r\n _isStepDisabled(index: number): boolean {\r\n if (!this.linear()) {\r\n return false;\r\n }\r\n\r\n const allSteps = this.steps();\r\n\r\n // Can always go backward\r\n if (index < this._selectedIndex()) {\r\n // Check if the target step is editable\r\n const targetStep = allSteps[index];\r\n return targetStep ? !targetStep.editable() : false;\r\n }\r\n\r\n // For forward navigation in linear mode, check all preceding steps\r\n if (index > this._selectedIndex()) {\r\n for (let i = this._selectedIndex(); i < index; i++) {\r\n const step = allSteps[i];\r\n if (step) {\r\n const control = step.stepControl();\r\n if (control?.invalid) {\r\n return true;\r\n }\r\n }\r\n }\r\n }\r\n\r\n return false;\r\n }\r\n\r\n /* @internal Handle keyboard navigation on step headers /\r\n _onHeaderKeydown(event: KeyboardEvent, currentIndex: number): void {\r\n const isHorizontal = this.orientation() === 'horizontal';\r\n const allSteps = this.steps();\r\n let newIndex = currentIndex;\r\n\r\n switch (event.key) {\r\n case 'ArrowRight':\r\n if (isHorizontal && currentIndex < allSteps.length - 1) {\r\n newIndex = currentIndex + 1;\r\n }\r\n break;\r\n case 'ArrowLeft':\r\n if (isHorizontal && currentIndex > 0) {\r\n newIndex = currentIndex - 1;\r\n }\r\n break;\r\n case 'ArrowDown':\r\n if (!isHorizontal && currentIndex < allSteps.length - 1) {\r\n newIndex = currentIndex + 1;\r\n event.preventDefault();\r\n }\r\n break;\r\n case 'ArrowUp':\r\n if (!isHorizontal && currentIndex > 0) {\r\n newIndex = currentIndex - 1;\r\n event.preventDefault();\r\n }\r\n break;\r\n case 'Home':\r\n newIndex = 0;\r\n event.preventDefault();\r\n break;\r\n case 'End':\r\n newIndex = allSteps.length - 1;\r\n event.preventDefault();\r\n break;\r\n default:\r\n return;\r\n }\r\n\r\n if (newIndex !== currentIndex) {\r\n this._onStepHeaderClick(newIndex);\r\n }\r\n }\r\n\r\n /* @internal Set the selected index and emit selection change /\r\n private _setSelectedIndex(newIndex: number): void {\r\n const allSteps = this.steps();\r\n const previousIndex = this._selectedIndex();\r\n\r\n if (newIndex === previousIndex) {\r\n return;\r\n }\r\n\r\n const previousStep = allSteps[previousIndex] ?? null;\r\n const selectedStep = allSteps[newIndex] ?? null;\r\n\r\n // Mark the new step as interacted\r\n if (selectedStep) {\r\n selectedStep._interacted.set(true);\r\n }\r\n\r\n this._selectedIndex.set(newIndex);\r\n\r\n this.selectionChange.emit({\r\n selectedIndex: newIndex,\r\n previousIndex,\r\n selectedStep,\r\n previousStep,\r\n });\r\n }\r\n}\r\n","<!-- Step Headers -->\r\n<div class=\"fui-stepper__header\" role=\"tablist\" [attr.aria-orientation]=\"orientation()\">\r\n @for (step of steps(); track $index; let last = $last) {\r\n <button\r\n class=\"fui-stepper__step-header\"\r\n [class.fui-stepper__step-header--active]=\"_selectedIndex() === $index\"\r\n [class.fui-stepper__step-header--completed]=\"step.state() === 'completed'\"\r\n [class.fui-stepper__step-header--error]=\"step.hasError()\"\r\n [class.fui-stepper__step-header--disabled]=\"_isStepDisabled($index)\"\r\n [attr.aria-selected]=\"_selectedIndex() === $index\"\r\n [attr.aria-disabled]=\"_isStepDisabled($index)\"\r\n [attr.aria-current]=\"_selectedIndex() === $index ? 'step' : null\"\r\n [attr.aria-label]=\"\r\n step.label() + (step.state() === 'completed' ? ' (completed)' : step.hasError() ? ' (error)' : '')\r\n \"\r\n [disabled]=\"_isStepDisabled($index)\"\r\n role=\"tab\"\r\n [attr.id]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\r\n [attr.aria-controls]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\r\n (click)=\"_onStepHeaderClick($index)\"\r\n (keydown)=\"_onHeaderKeydown($event, $index)\"\r\n type=\"button\"\r\n >\r\n <div class=\"fui-stepper__step-icon\">\r\n @if (step.state() === 'completed' && !step.icon()) {\r\n <fui-icon name=\"check\" size=\"sm\"></fui-icon>\r\n } @else if (step.hasError()) {\r\n <fui-icon name=\"warning\" size=\"sm\"></fui-icon>\r\n } @else if (step.icon()) {\r\n <fui-icon [name]=\"step.icon()\" size=\"sm\"></fui-icon>\r\n } @else {\r\n <span class=\"fui-stepper__step-number\">{{ $index + 1 }}</span>\r\n }\r\n </div>\r\n <div class=\"fui-stepper__step-text\">\r\n <span class=\"fui-stepper__step-label\">{{ step.label() }}</span>\r\n @if (step.description()) {\r\n <span class=\"fui-stepper__step-description\">{{ step.description() }}</span>\r\n }\r\n @if (step.hasError()) {\r\n <span class=\"fui-stepper__step-error\">{{ step.errorMessage() }}</span>\r\n }\r\n </div>\r\n </button>\r\n @if (!last) {\r\n <div\r\n class=\"fui-stepper__connector\"\r\n [class.fui-stepper__connector--completed]=\"step.state() === 'completed'\"\r\n ></div>\r\n }\r\n }\r\n</div>\r\n\r\n<!-- Step Content -->\r\n<div class=\"fui-stepper__content\">\r\n @for (step of steps(); track $index) {\r\n <div\r\n class=\"fui-stepper__step-body\"\r\n [class.fui-stepper__step-body--active]=\"_selectedIndex() === $index\"\r\n role=\"tabpanel\"\r\n [attr.id]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\r\n [attr.aria-labelledby]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\r\n [attr.aria-expanded]=\"_selectedIndex() === $index\"\r\n >\r\n @if (_selectedIndex() === $index \|\| step._interacted()) {\r\n <ng-container [ngTemplateOutlet]=\"step.contentTemplate()!\"></ng-container>\r\n }\r\n </div>\r\n }\r\n</div>\r\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"raintonic-formaui-components-stepper.mjs","sources":["../../../lib/components/stepper/step.component.ts","../../../lib/components/stepper/stepper.types.ts","../../../lib/components/stepper/stepper.component.ts","../../../lib/components/stepper/stepper.component.html","../../../lib/components/stepper/raintonic-formaui-components-stepper.ts"],"sourcesContent":["import {\r\n Component,\r\n ChangeDetectionStrategy,\r\n ViewEncapsulation,\r\n input,\r\n signal,\r\n computed,\r\n viewChild,\r\n TemplateRef,\r\n booleanAttribute,\r\n WritableSignal,\r\n Signal,\r\n} from '@angular/core';\r\nimport { AbstractControl } from '@angular/forms';\r\nimport { StepState } from './stepper.types';\r\n\r\n/*\r\n # FuiStepComponent\r\n \r\n Represents a single step within an `fui-stepper`.\r\n * Each step has a label, optional description/icon, and content that is lazily rendered.\r\n \r\n ## Usage\r\n \r\n ```html\r\n * <fui-stepper>\r\n * <fui-step label=\"Account\" description=\"Create your account\">\r\n * <p>Account creation form here...</p>\r\n * </fui-step>\r\n * <fui-step label=\"Profile\" icon=\"user\">\r\n * <p>Profile setup here...</p>\r\n * </fui-step>\r\n * </fui-stepper>\r\n * ```\r\n /\r\n@Component({\r\n selector: 'fui-step',\r\n standalone: true,\r\n template: '<ng-template><ng-content></ng-content></ng-template>',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n})\r\nexport class FuiStepComponent {\r\n // Inputs\r\n readonly label = input.required<string>();\r\n readonly description = input('');\r\n readonly icon = input('');\r\n readonly completed = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n readonly editable = input<boolean, unknown>(true, { transform: booleanAttribute });\r\n readonly errorMessage = input('');\r\n readonly stepControl = input<AbstractControl \| null>(null);\r\n readonly optional = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n // Internal state\r\n readonly _interacted: WritableSignal<boolean> = signal(false);\r\n\r\n // Content template reference for lazy rendering\r\n readonly contentTemplate: Signal<TemplateRef<unknown> \| undefined> = viewChild(TemplateRef);\r\n\r\n // Computed state\r\n readonly hasError: Signal<boolean> = computed(() => {\r\n const errMsg = this.errorMessage();\r\n if (errMsg && errMsg.length > 0) {\r\n return true;\r\n }\r\n const control = this.stepControl();\r\n return !!(control && control.invalid && this._interacted());\r\n });\r\n\r\n readonly state: Signal<StepState> = computed(() => {\r\n if (this.hasError()) {\r\n return 'error';\r\n }\r\n if (this.completed()) {\r\n return 'completed';\r\n }\r\n return 'default';\r\n });\r\n\r\n /* Mark this step as interacted and select it via the parent stepper. /\r\n select(): void {\r\n this._interacted.set(true);\r\n }\r\n\r\n /* Reset the step to its initial state. /\r\n reset(): void {\r\n this._interacted.set(false);\r\n const control = this.stepControl();\r\n if (control) {\r\n control.reset();\r\n }\r\n }\r\n}\r\n","import { InjectionToken } from '@angular/core';\r\n\r\nexport type StepperOrientation = 'horizontal' \| 'vertical';\r\nexport type StepState = 'active' \| 'completed' \| 'error' \| 'disabled' \| 'default';\r\n\r\nexport interface StepSelectionChange {\r\n selectedIndex: number;\r\n previousIndex: number;\r\n selectedStep: unknown;\r\n previousStep: unknown;\r\n}\r\n\r\nexport const FORMAUI_STEPPER = new InjectionToken<unknown>('FORMAUI_STEPPER');\r\n","import {\r\n Component,\r\n ChangeDetectionStrategy,\r\n ViewEncapsulation,\r\n input,\r\n output,\r\n signal,\r\n computed,\r\n effect,\r\n contentChildren,\r\n booleanAttribute,\r\n WritableSignal,\r\n} from '@angular/core';\r\nimport { NgTemplateOutlet } from '@angular/common';\r\nimport { FuiIconComponent } from '@raintonic/formaui/components/icon';\r\nimport { FuiStepComponent } from './step.component';\r\nimport { StepperOrientation, StepSelectionChange, FORMAUI_STEPPER } from './stepper.types';\r\n\r\nlet nextStepperId = 0;\r\n\r\n/\r\n # FuiStepperComponent\r\n \r\n A stepper component that guides users through a sequence of steps.\r\n * Supports horizontal and vertical orientations, linear and non-linear navigation,\r\n * step validation, and lazy content rendering.\r\n \r\n ## Usage\r\n \r\n ### Basic horizontal stepper\r\n * ```html\r\n * <fui-stepper>\r\n * <fui-step label=\"Step 1\">Content 1</fui-step>\r\n * <fui-step label=\"Step 2\">Content 2</fui-step>\r\n * <fui-step label=\"Step 3\">Content 3</fui-step>\r\n * </fui-stepper>\r\n * ```\r\n \r\n ### Vertical stepper\r\n * ```html\r\n * <fui-stepper orientation=\"vertical\">\r\n * <fui-step label=\"Step 1\">Content 1</fui-step>\r\n * <fui-step label=\"Step 2\">Content 2</fui-step>\r\n * </fui-stepper>\r\n * ```\r\n \r\n ### Linear stepper with form validation\r\n * ```html\r\n * <fui-stepper [linear]=\"true\">\r\n * <fui-step label=\"Account\" [stepControl]=\"accountForm\">\r\n * <form [formGroup]=\"accountForm\">...</form>\r\n * </fui-step>\r\n * <fui-step label=\"Address\" [stepControl]=\"addressForm\">\r\n * <form [formGroup]=\"addressForm\">...</form>\r\n * </fui-step>\r\n * </fui-stepper>\r\n * ```\r\n /\r\n@Component({\r\n selector: 'fui-stepper',\r\n standalone: true,\r\n imports: [NgTemplateOutlet, FuiIconComponent],\r\n templateUrl: './stepper.component.html',\r\n styleUrls: ['./stepper.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n encapsulation: ViewEncapsulation.None,\r\n host: {\r\n class: 'fui-stepper',\r\n '[class.fui-stepper--horizontal]': 'orientation() === \"horizontal\"',\r\n '[class.fui-stepper--vertical]': 'orientation() === \"vertical\"',\r\n '[class.fui-stepper--linear]': 'linear()',\r\n },\r\n providers: [{ provide: FORMAUI_STEPPER, useExisting: FuiStepperComponent }],\r\n})\r\nexport class FuiStepperComponent {\r\n // Inputs\r\n readonly orientation = input<StepperOrientation>('horizontal');\r\n readonly linear = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n readonly selectedIndex = input(0);\r\n\r\n // Outputs\r\n readonly selectionChange = output<StepSelectionChange>();\r\n readonly animationDone = output();\r\n\r\n // Content children\r\n readonly steps = contentChildren(FuiStepComponent);\r\n\r\n // Internal state\r\n readonly _selectedIndex: WritableSignal<number> = signal(0);\r\n\r\n // Unique ID for ARIA linking\r\n readonly _uniqueId = nextStepperId++;\r\n\r\n // Computed: active step\r\n readonly _selectedStep = computed(() => {\r\n const allSteps = this.steps();\r\n const idx = this._selectedIndex();\r\n return allSteps[idx] ?? null;\r\n });\r\n\r\n constructor() {\r\n // Sync selectedIndex input with internal state\r\n effect(() => {\r\n const idx = this.selectedIndex();\r\n this._selectedIndex.set(idx);\r\n });\r\n }\r\n\r\n /* Navigate to the next step. In linear mode, validates the current step first. /\r\n next(): void {\r\n const allSteps = this.steps();\r\n const currentIdx = this._selectedIndex();\r\n\r\n if (currentIdx >= allSteps.length - 1) {\r\n return;\r\n }\r\n\r\n if (this.linear()) {\r\n const currentStep = allSteps[currentIdx];\r\n if (currentStep) {\r\n currentStep._interacted.set(true);\r\n const control = currentStep.stepControl();\r\n if (control?.invalid) {\r\n return;\r\n }\r\n }\r\n }\r\n\r\n this._setSelectedIndex(currentIdx + 1);\r\n }\r\n\r\n /* Navigate to the previous step. /\r\n previous(): void {\r\n const currentIdx = this._selectedIndex();\r\n if (currentIdx > 0) {\r\n this._setSelectedIndex(currentIdx - 1);\r\n }\r\n }\r\n\r\n /* Navigate directly to a specific step by index. /\r\n goToStep(index: number): void {\r\n const allSteps = this.steps();\r\n if (index < 0 \|\| index >= allSteps.length) {\r\n return;\r\n }\r\n\r\n if (this.linear() && index > this._selectedIndex()) {\r\n // In linear mode, can only go forward if all preceding steps are valid\r\n for (let i = this._selectedIndex(); i < index; i++) {\r\n const step = allSteps[i];\r\n if (step) {\r\n step._interacted.set(true);\r\n const control = step.stepControl();\r\n if (control?.invalid) {\r\n return;\r\n }\r\n }\r\n }\r\n }\r\n\r\n this._setSelectedIndex(index);\r\n }\r\n\r\n /* Reset all steps and return to the first step. /\r\n reset(): void {\r\n this._selectedIndex.set(0);\r\n this.steps().forEach((step) => {\r\n step.reset();\r\n });\r\n }\r\n\r\n /* @internal Handle step header click /\r\n _onStepHeaderClick(index: number): void {\r\n this.goToStep(index);\r\n }\r\n\r\n /* @internal Check if a step is disabled for navigation /\r\n _isStepDisabled(index: number): boolean {\r\n if (!this.linear()) {\r\n return false;\r\n }\r\n\r\n const allSteps = this.steps();\r\n\r\n // Can always go backward\r\n if (index < this._selectedIndex()) {\r\n // Check if the target step is editable\r\n const targetStep = allSteps[index];\r\n return targetStep ? !targetStep.editable() : false;\r\n }\r\n\r\n // For forward navigation in linear mode, check all preceding steps\r\n if (index > this._selectedIndex()) {\r\n for (let i = this._selectedIndex(); i < index; i++) {\r\n const step = allSteps[i];\r\n if (step) {\r\n const control = step.stepControl();\r\n if (control?.invalid) {\r\n return true;\r\n }\r\n }\r\n }\r\n }\r\n\r\n return false;\r\n }\r\n\r\n /* @internal Handle keyboard navigation on step headers /\r\n _onHeaderKeydown(event: KeyboardEvent, currentIndex: number): void {\r\n const isHorizontal = this.orientation() === 'horizontal';\r\n const allSteps = this.steps();\r\n let newIndex = currentIndex;\r\n\r\n switch (event.key) {\r\n case 'ArrowRight':\r\n if (isHorizontal && currentIndex < allSteps.length - 1) {\r\n newIndex = currentIndex + 1;\r\n }\r\n break;\r\n case 'ArrowLeft':\r\n if (isHorizontal && currentIndex > 0) {\r\n newIndex = currentIndex - 1;\r\n }\r\n break;\r\n case 'ArrowDown':\r\n if (!isHorizontal && currentIndex < allSteps.length - 1) {\r\n newIndex = currentIndex + 1;\r\n event.preventDefault();\r\n }\r\n break;\r\n case 'ArrowUp':\r\n if (!isHorizontal && currentIndex > 0) {\r\n newIndex = currentIndex - 1;\r\n event.preventDefault();\r\n }\r\n break;\r\n case 'Home':\r\n newIndex = 0;\r\n event.preventDefault();\r\n break;\r\n case 'End':\r\n newIndex = allSteps.length - 1;\r\n event.preventDefault();\r\n break;\r\n default:\r\n return;\r\n }\r\n\r\n if (newIndex !== currentIndex) {\r\n this._onStepHeaderClick(newIndex);\r\n }\r\n }\r\n\r\n /* @internal Set the selected index and emit selection change /\r\n private _setSelectedIndex(newIndex: number): void {\r\n const allSteps = this.steps();\r\n const previousIndex = this._selectedIndex();\r\n\r\n if (newIndex === previousIndex) {\r\n return;\r\n }\r\n\r\n const previousStep = allSteps[previousIndex] ?? null;\r\n const selectedStep = allSteps[newIndex] ?? null;\r\n\r\n // Mark the new step as interacted\r\n if (selectedStep) {\r\n selectedStep._interacted.set(true);\r\n }\r\n\r\n this._selectedIndex.set(newIndex);\r\n\r\n this.selectionChange.emit({\r\n selectedIndex: newIndex,\r\n previousIndex,\r\n selectedStep,\r\n previousStep,\r\n });\r\n }\r\n}\r\n","<!-- Step Headers -->\r\n<div class=\"fui-stepper__header\" role=\"tablist\" [attr.aria-orientation]=\"orientation()\">\r\n @for (step of steps(); track $index; let last = $last) {\r\n <button\r\n class=\"fui-stepper__step-header\"\r\n [class.fui-stepper__step-header--active]=\"_selectedIndex() === $index\"\r\n [class.fui-stepper__step-header--completed]=\"step.state() === 'completed'\"\r\n [class.fui-stepper__step-header--error]=\"step.hasError()\"\r\n [class.fui-stepper__step-header--disabled]=\"_isStepDisabled($index)\"\r\n [attr.aria-selected]=\"_selectedIndex() === $index\"\r\n [attr.aria-disabled]=\"_isStepDisabled($index)\"\r\n [attr.aria-current]=\"_selectedIndex() === $index ? 'step' : null\"\r\n [attr.aria-label]=\"\r\n step.label() + (step.state() === 'completed' ? ' (completed)' : step.hasError() ? ' (error)' : '')\r\n \"\r\n [disabled]=\"_isStepDisabled($index)\"\r\n role=\"tab\"\r\n [attr.id]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\r\n [attr.aria-controls]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\r\n (click)=\"_onStepHeaderClick($index)\"\r\n (keydown)=\"_onHeaderKeydown($event, $index)\"\r\n type=\"button\"\r\n >\r\n <div class=\"fui-stepper__step-icon\">\r\n @if (step.state() === 'completed' && !step.icon()) {\r\n <fui-icon name=\"check\" size=\"sm\"></fui-icon>\r\n } @else if (step.hasError()) {\r\n <fui-icon name=\"warning\" size=\"sm\"></fui-icon>\r\n } @else if (step.icon()) {\r\n <fui-icon [name]=\"step.icon()\" size=\"sm\"></fui-icon>\r\n } @else {\r\n <span class=\"fui-stepper__step-number\">{{ $index + 1 }}</span>\r\n }\r\n </div>\r\n <div class=\"fui-stepper__step-text\">\r\n <span class=\"fui-stepper__step-label\">{{ step.label() }}</span>\r\n @if (step.description()) {\r\n <span class=\"fui-stepper__step-description\">{{ step.description() }}</span>\r\n }\r\n @if (step.hasError()) {\r\n <span class=\"fui-stepper__step-error\">{{ step.errorMessage() }}</span>\r\n }\r\n </div>\r\n </button>\r\n @if (!last) {\r\n <div\r\n class=\"fui-stepper__connector\"\r\n [class.fui-stepper__connector--completed]=\"step.state() === 'completed'\"\r\n ></div>\r\n }\r\n }\r\n</div>\r\n\r\n<!-- Step Content -->\r\n<div class=\"fui-stepper__content\">\r\n @for (step of steps(); track $index) {\r\n <div\r\n class=\"fui-stepper__step-body\"\r\n [class.fui-stepper__step-body--active]=\"_selectedIndex() === $index\"\r\n role=\"tabpanel\"\r\n [attr.id]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\r\n [attr.aria-labelledby]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\r\n [attr.aria-expanded]=\"_selectedIndex() === $index\"\r\n >\r\n @if (_selectedIndex() === $index \|\| step._interacted()) {\r\n <ng-container [ngTemplateOutlet]=\"step.contentTemplate()!\"></ng-container>\r\n }\r\n </div>\r\n }\r\n</div>\r\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":";;;;;AAgBA;;;;;;;;;;;;;;;;;;AAkBG;MAQU,gBAAgB,CAAA;;AAElB,IAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,2EAAU;AAChC,IAAA,WAAW,GAAG,KAAK,CAAC,EAAE,kFAAC;AACvB,IAAA,IAAI,GAAG,KAAK,CAAC,EAAE,2EAAC;IAChB,SAAS,GAAG,KAAK,CAAmB,KAAK,iFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;IAC3E,QAAQ,GAAG,KAAK,CAAmB,IAAI,gFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AACzE,IAAA,YAAY,GAAG,KAAK,CAAC,EAAE,mFAAC;AACxB,IAAA,WAAW,GAAG,KAAK,CAAyB,IAAI,kFAAC;IACjD,QAAQ,GAAG,KAAK,CAAmB,KAAK,gFAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;;AAG1E,IAAA,WAAW,GAA4B,MAAM,CAAC,KAAK,kFAAC;;AAGpD,IAAA,eAAe,GAA6C,SAAS,CAAC,WAAW,sFAAC;;AAGlF,IAAA,QAAQ,GAAoB,QAAQ,CAAC,MAAK;AACjD,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,YAAY,EAAE;QAClC,IAAI,MAAM,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE;AAC/B,YAAA,OAAO,IAAI;QACb;AACA,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,EAAE;AAClC,QAAA,OAAO,CAAC,EAAE,OAAO,IAAI,OAAO,CAAC,OAAO,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;AAC7D,IAAA,CAAC,+EAAC;AAEO,IAAA,KAAK,GAAsB,QAAQ,CAAC,MAAK;AAChD,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE,EAAE;AACnB,YAAA,OAAO,OAAO;QAChB;AACA,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE,EAAE;AACpB,YAAA,OAAO,WAAW;QACpB;AACA,QAAA,OAAO,SAAS;AAClB,IAAA,CAAC,4EAAC;;IAGF,MAAM,GAAA;AACJ,QAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,CAAC;IAC5B;;IAGA,KAAK,GAAA;AACH,QAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC;AAC3B,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,EAAE;QAClC,IAAI,OAAO,EAAE;YACX,OAAO,CAAC,KAAK,EAAE;QACjB;IACF;uGAjDW,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,iBAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAeoD,WAAW,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAnBhF,sDAAsD,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FAIrD,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAP5B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,QAAQ,EAAE,sDAAsD;oBAChE,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,aAAa,EAAE,iBAAiB,CAAC,IAAI;AACtC,iBAAA;w2BAgBgF,WAAW,CAAA,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;MC7C/E,eAAe,GAAG,IAAI,cAAc,CAAU,iBAAiB;;ACM5E,IAAI,aAAa,GAAG,CAAC;AAErB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCG;MAiBU,mBAAmB,CAAA;;AAErB,IAAA,WAAW,GAAG,KAAK,CAAqB,YAAY,kFAAC;IACrD,MAAM,GAAG,KAAK,CAAmB,KAAK,8EAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AACxE,IAAA,aAAa,GAAG,KAAK,CAAC,CAAC,oFAAC;;IAGxB,eAAe,GAAG,MAAM,EAAuB;IAC/C,aAAa,GAAG,MAAM,EAAE;;AAGxB,IAAA,KAAK,GAAG,eAAe,CAAC,gBAAgB,4EAAC;;AAGzC,IAAA,cAAc,GAA2B,MAAM,CAAC,CAAC,qFAAC;;IAGlD,SAAS,GAAG,aAAa,EAAE;;AAG3B,IAAA,aAAa,GAAG,QAAQ,CAAC,MAAK;AACrC,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,EAAE;AAC7B,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,cAAc,EAAE;AACjC,QAAA,OAAO,QAAQ,CAAC,GAAG,CAAC,IAAI,IAAI;AAC9B,IAAA,CAAC,oFAAC;AAEF,IAAA,WAAA,GAAA;;QAEE,MAAM,CAAC,MAAK;AACV,YAAA,MAAM,GAAG,GAAG,IAAI,CAAC,aAAa,EAAE;AAChC,YAAA,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC;AAC9B,QAAA,CAAC,CAAC;IACJ;;IAGA,IAAI,GAAA;AACF,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,EAAE;AAC7B,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,cAAc,EAAE;QAExC,IAAI,UAAU,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;YACrC;QACF;AAEA,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE,EAAE;AACjB,YAAA,MAAM,WAAW,GAAG,QAAQ,CAAC,UAAU,CAAC;YACxC,IAAI,WAAW,EAAE;AACf,gBAAA,WAAW,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,CAAC;AACjC,gBAAA,MAAM,OAAO,GAAG,WAAW,CAAC,WAAW,EAAE;AACzC,gBAAA,IAAI,OAAO,EAAE,OAAO,EAAE;oBACpB;gBACF;YACF;QACF;AAEA,QAAA,IAAI,CAAC,iBAAiB,CAAC,UAAU,GAAG,CAAC,CAAC;IACxC;;IAGA,QAAQ,GAAA;AACN,QAAA,MAAM,UAAU,GAAG,IAAI,CAAC,cAAc,EAAE;AACxC,QAAA,IAAI,UAAU,GAAG,CAAC,EAAE;AAClB,YAAA,IAAI,CAAC,iBAAiB,CAAC,UAAU,GAAG,CAAC,CAAC;QACxC;IACF;;AAGA,IAAA,QAAQ,CAAC,KAAa,EAAA;AACpB,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,EAAE;QAC7B,IAAI,KAAK,GAAG,CAAC,IAAI,KAAK,IAAI,QAAQ,CAAC,MAAM,EAAE;YACzC;QACF;AAEA,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE,IAAI,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,EAAE;;AAElD,YAAA,KAAK,IAAI,CAAC,GAAG,IAAI,CAAC,cAAc,EAAE,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,EAAE,EAAE;AAClD,gBAAA,MAAM,IAAI,GAAG,QAAQ,CAAC,CAAC,CAAC;gBACxB,IAAI,IAAI,EAAE;AACR,oBAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,CAAC;AAC1B,oBAAA,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,EAAE;AAClC,oBAAA,IAAI,OAAO,EAAE,OAAO,EAAE;wBACpB;oBACF;gBACF;YACF;QACF;AAEA,QAAA,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC;IAC/B;;IAGA,KAAK,GAAA;AACH,QAAA,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,CAAC;QAC1B,IAAI,CAAC,KAAK,EAAE,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;YAC5B,IAAI,CAAC,KAAK,EAAE;AACd,QAAA,CAAC,CAAC;IACJ;;AAGA,IAAA,kBAAkB,CAAC,KAAa,EAAA;AAC9B,QAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;IACtB;;AAGA,IAAA,eAAe,CAAC,KAAa,EAAA;AAC3B,QAAA,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE;AAClB,YAAA,OAAO,KAAK;QACd;AAEA,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,EAAE;;AAG7B,QAAA,IAAI,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,EAAE;;AAEjC,YAAA,MAAM,UAAU,GAAG,QAAQ,CAAC,KAAK,CAAC;AAClC,YAAA,OAAO,UAAU,GAAG,CAAC,UAAU,CAAC,QAAQ,EAAE,GAAG,KAAK;QACpD;;AAGA,QAAA,IAAI,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,EAAE;AACjC,YAAA,KAAK,IAAI,CAAC,GAAG,IAAI,CAAC,cAAc,EAAE,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,EAAE,EAAE;AAClD,gBAAA,MAAM,IAAI,GAAG,QAAQ,CAAC,CAAC,CAAC;gBACxB,IAAI,IAAI,EAAE;AACR,oBAAA,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,EAAE;AAClC,oBAAA,IAAI,OAAO,EAAE,OAAO,EAAE;AACpB,wBAAA,OAAO,IAAI;oBACb;gBACF;YACF;QACF;AAEA,QAAA,OAAO,KAAK;IACd;;IAGA,gBAAgB,CAAC,KAAoB,EAAE,YAAoB,EAAA;QACzD,MAAM,YAAY,GAAG,IAAI,CAAC,WAAW,EAAE,KAAK,YAAY;AACxD,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,EAAE;QAC7B,IAAI,QAAQ,GAAG,YAAY;AAE3B,QAAA,QAAQ,KAAK,CAAC,GAAG;AACf,YAAA,KAAK,YAAY;gBACf,IAAI,YAAY,IAAI,YAAY,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;AACtD,oBAAA,QAAQ,GAAG,YAAY,GAAG,CAAC;gBAC7B;gBACA;AACF,YAAA,KAAK,WAAW;AACd,gBAAA,IAAI,YAAY,IAAI,YAAY,GAAG,CAAC,EAAE;AACpC,oBAAA,QAAQ,GAAG,YAAY,GAAG,CAAC;gBAC7B;gBACA;AACF,YAAA,KAAK,WAAW;gBACd,IAAI,CAAC,YAAY,IAAI,YAAY,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;AACvD,oBAAA,QAAQ,GAAG,YAAY,GAAG,CAAC;oBAC3B,KAAK,CAAC,cAAc,EAAE;gBACxB;gBACA;AACF,YAAA,KAAK,SAAS;AACZ,gBAAA,IAAI,CAAC,YAAY,IAAI,YAAY,GAAG,CAAC,EAAE;AACrC,oBAAA,QAAQ,GAAG,YAAY,GAAG,CAAC;oBAC3B,KAAK,CAAC,cAAc,EAAE;gBACxB;gBACA;AACF,YAAA,KAAK,MAAM;gBACT,QAAQ,GAAG,CAAC;gBACZ,KAAK,CAAC,cAAc,EAAE;gBACtB;AACF,YAAA,KAAK,KAAK;AACR,gBAAA,QAAQ,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC;gBAC9B,KAAK,CAAC,cAAc,EAAE;gBACtB;AACF,YAAA;gBACE;;AAGJ,QAAA,IAAI,QAAQ,KAAK,YAAY,EAAE;AAC7B,YAAA,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC;QACnC;IACF;;AAGQ,IAAA,iBAAiB,CAAC,QAAgB,EAAA;AACxC,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,EAAE;AAC7B,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,cAAc,EAAE;AAE3C,QAAA,IAAI,QAAQ,KAAK,aAAa,EAAE;YAC9B;QACF;QAEA,MAAM,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,IAAI;QACpD,MAAM,YAAY,GAAG,QAAQ,CAAC,QAAQ,CAAC,IAAI,IAAI;;QAG/C,IAAI,YAAY,EAAE;AAChB,YAAA,YAAY,CAAC,WAAW,CAAC,GAAG,CAAC,IAAI,CAAC;QACpC;AAEA,QAAA,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,QAAQ,CAAC;AAEjC,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC;AACxB,YAAA,aAAa,EAAE,QAAQ;YACvB,aAAa;YACb,YAAY;YACZ,YAAY;AACb,SAAA,CAAC;IACJ;uGA5MW,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAnB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,mBAAmB,oxBAFnB,CAAC,EAAE,OAAO,EAAE,eAAe,EAAE,WAAW,EAAE,mBAAmB,EAAE,CAAC,gDAa1C,gBAAgB,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECrFnD,kjGAsEA,EAAA,MAAA,EAAA,CAAA,mwKAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDTY,gBAAgB,oJAAE,gBAAgB,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,QAAA,EAAA,OAAA,EAAA,WAAA,EAAA,MAAA,EAAA,OAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA;;2FAajC,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAhB/B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,aAAa,cACX,IAAI,EAAA,OAAA,EACP,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,EAAA,eAAA,EAG5B,uBAAuB,CAAC,MAAM,EAAA,aAAA,EAChC,iBAAiB,CAAC,IAAI,EAAA,IAAA,EAC/B;AACJ,wBAAA,KAAK,EAAE,aAAa;AACpB,wBAAA,iCAAiC,EAAE,gCAAgC;AACnE,wBAAA,+BAA+B,EAAE,8BAA8B;AAC/D,wBAAA,6BAA6B,EAAE,UAAU;qBAC1C,EAAA,SAAA,EACU,CAAC,EAAE,OAAO,EAAE,eAAe,EAAE,WAAW,EAAA,mBAAqB,EAAE,CAAC,EAAA,QAAA,EAAA,kjGAAA,EAAA,MAAA,EAAA,CAAA,mwKAAA,CAAA,EAAA;qiBAa1C,gBAAgB,CAAA,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AErFnD;;AAEG;;;;"}