@raintonic/formaui 0.2.0 → 0.2.1

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

@@ -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 -->\n<div class=\"fui-stepper__header\" role=\"tablist\" [attr.aria-orientation]=\"orientation()\">\n  @for (step of steps(); track $index; let last = $last) {\n    <button\n      class=\"fui-stepper__step-header\"\n      [class.fui-stepper__step-header--active]=\"_selectedIndex() === $index\"\n      [class.fui-stepper__step-header--completed]=\"step.state() === 'completed'\"\n      [class.fui-stepper__step-header--error]=\"step.hasError()\"\n      [class.fui-stepper__step-header--disabled]=\"_isStepDisabled($index)\"\n      [attr.aria-selected]=\"_selectedIndex() === $index\"\n      [attr.aria-disabled]=\"_isStepDisabled($index)\"\n      [attr.aria-current]=\"_selectedIndex() === $index ? 'step' : null\"\n      [attr.aria-label]=\"\n        step.label() + (step.state() === 'completed' ? ' (completed)' : step.hasError() ? ' (error)' : '')\n      \"\n      [disabled]=\"_isStepDisabled($index)\"\n      role=\"tab\"\n      [attr.id]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\n      [attr.aria-controls]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\n      (click)=\"_onStepHeaderClick($index)\"\n      (keydown)=\"_onHeaderKeydown($event, $index)\"\n      type=\"button\"\n    >\n      <div class=\"fui-stepper__step-icon\">\n        @if (step.state() === 'completed' && !step.icon()) {\n          <fui-icon name=\"check\" size=\"sm\"></fui-icon>\n        } @else if (step.hasError()) {\n          <fui-icon name=\"warning\" size=\"sm\"></fui-icon>\n        } @else if (step.icon()) {\n          <fui-icon [name]=\"step.icon()\" size=\"sm\"></fui-icon>\n        } @else {\n          <span class=\"fui-stepper__step-number\">{{ $index + 1 }}</span>\n        }\n      </div>\n      <div class=\"fui-stepper__step-text\">\n        <span class=\"fui-stepper__step-label\">{{ step.label() }}</span>\n        @if (step.description()) {\n          <span class=\"fui-stepper__step-description\">{{ step.description() }}</span>\n        }\n        @if (step.hasError()) {\n          <span class=\"fui-stepper__step-error\">{{ step.errorMessage() }}</span>\n        }\n      </div>\n    </button>\n    @if (!last) {\n      <div\n        class=\"fui-stepper__connector\"\n        [class.fui-stepper__connector--completed]=\"step.state() === 'completed'\"\n      ></div>\n    }\n  }\n</div>\n\n<!-- Step Content -->\n<div class=\"fui-stepper__content\">\n  @for (step of steps(); track $index) {\n    <div\n      class=\"fui-stepper__step-body\"\n      [class.fui-stepper__step-body--active]=\"_selectedIndex() === $index\"\n      role=\"tabpanel\"\n      [attr.id]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\n      [attr.aria-labelledby]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\n      [attr.aria-expanded]=\"_selectedIndex() === $index\"\n    >\n      @if (_selectedIndex() === $index || step._interacted()) {\n        <ng-container [ngTemplateOutlet]=\"step.contentTemplate()!\"></ng-container>\n      }\n    </div>\n  }\n</div>\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)}.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 -->\n<div class=\"fui-stepper__header\" role=\"tablist\" [attr.aria-orientation]=\"orientation()\">\n  @for (step of steps(); track $index; let last = $last) {\n    <button\n      class=\"fui-stepper__step-header\"\n      [class.fui-stepper__step-header--active]=\"_selectedIndex() === $index\"\n      [class.fui-stepper__step-header--completed]=\"step.state() === 'completed'\"\n      [class.fui-stepper__step-header--error]=\"step.hasError()\"\n      [class.fui-stepper__step-header--disabled]=\"_isStepDisabled($index)\"\n      [attr.aria-selected]=\"_selectedIndex() === $index\"\n      [attr.aria-disabled]=\"_isStepDisabled($index)\"\n      [attr.aria-current]=\"_selectedIndex() === $index ? 'step' : null\"\n      [attr.aria-label]=\"\n        step.label() + (step.state() === 'completed' ? ' (completed)' : step.hasError() ? ' (error)' : '')\n      \"\n      [disabled]=\"_isStepDisabled($index)\"\n      role=\"tab\"\n      [attr.id]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\n      [attr.aria-controls]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\n      (click)=\"_onStepHeaderClick($index)\"\n      (keydown)=\"_onHeaderKeydown($event, $index)\"\n      type=\"button\"\n    >\n      <div class=\"fui-stepper__step-icon\">\n        @if (step.state() === 'completed' && !step.icon()) {\n          <fui-icon name=\"check\" size=\"sm\"></fui-icon>\n        } @else if (step.hasError()) {\n          <fui-icon name=\"warning\" size=\"sm\"></fui-icon>\n        } @else if (step.icon()) {\n          <fui-icon [name]=\"step.icon()\" size=\"sm\"></fui-icon>\n        } @else {\n          <span class=\"fui-stepper__step-number\">{{ $index + 1 }}</span>\n        }\n      </div>\n      <div class=\"fui-stepper__step-text\">\n        <span class=\"fui-stepper__step-label\">{{ step.label() }}</span>\n        @if (step.description()) {\n          <span class=\"fui-stepper__step-description\">{{ step.description() }}</span>\n        }\n        @if (step.hasError()) {\n          <span class=\"fui-stepper__step-error\">{{ step.errorMessage() }}</span>\n        }\n      </div>\n    </button>\n    @if (!last) {\n      <div\n        class=\"fui-stepper__connector\"\n        [class.fui-stepper__connector--completed]=\"step.state() === 'completed'\"\n      ></div>\n    }\n  }\n</div>\n\n<!-- Step Content -->\n<div class=\"fui-stepper__content\">\n  @for (step of steps(); track $index) {\n    <div\n      class=\"fui-stepper__step-body\"\n      [class.fui-stepper__step-body--active]=\"_selectedIndex() === $index\"\n      role=\"tabpanel\"\n      [attr.id]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\n      [attr.aria-labelledby]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\n      [attr.aria-expanded]=\"_selectedIndex() === $index\"\n    >\n      @if (_selectedIndex() === $index || step._interacted()) {\n        <ng-container [ngTemplateOutlet]=\"step.contentTemplate()!\"></ng-container>\n      }\n    </div>\n  }\n</div>\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)}.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

@@ -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 {\n  Component,\n  ChangeDetectionStrategy,\n  ViewEncapsulation,\n  input,\n  signal,\n  computed,\n  viewChild,\n  TemplateRef,\n  booleanAttribute,\n  WritableSignal,\n  Signal,\n} from '@angular/core';\nimport { AbstractControl } from '@angular/forms';\nimport { StepState } from './stepper.types';\n\n/**\n * # FuiStepComponent\n *\n * Represents a single step within an `fui-stepper`.\n * Each step has a label, optional description/icon, and content that is lazily rendered.\n *\n * ## Usage\n *\n * ```html\n * <fui-stepper>\n *   <fui-step label=\"Account\" description=\"Create your account\">\n *     <p>Account creation form here...</p>\n *   </fui-step>\n *   <fui-step label=\"Profile\" icon=\"user\">\n *     <p>Profile setup here...</p>\n *   </fui-step>\n * </fui-stepper>\n * ```\n */\n@Component({\n  selector: 'fui-step',\n  standalone: true,\n  template: '<ng-template><ng-content></ng-content></ng-template>',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n})\nexport class FuiStepComponent {\n  // Inputs\n  readonly label = input.required<string>();\n  readonly description = input('');\n  readonly icon = input('');\n  readonly completed = input<boolean, unknown>(false, { transform: booleanAttribute });\n  readonly editable = input<boolean, unknown>(true, { transform: booleanAttribute });\n  readonly errorMessage = input('');\n  readonly stepControl = input<AbstractControl | null>(null);\n  readonly optional = input<boolean, unknown>(false, { transform: booleanAttribute });\n\n  // Internal state\n  readonly _interacted: WritableSignal<boolean> = signal(false);\n\n  // Content template reference for lazy rendering\n  readonly contentTemplate: Signal<TemplateRef<unknown> | undefined> = viewChild(TemplateRef);\n\n  // Computed state\n  readonly hasError: Signal<boolean> = computed(() => {\n    const errMsg = this.errorMessage();\n    if (errMsg && errMsg.length > 0) {\n      return true;\n    }\n    const control = this.stepControl();\n    return !!(control && control.invalid && this._interacted());\n  });\n\n  readonly state: Signal<StepState> = computed(() => {\n    if (this.hasError()) {\n      return 'error';\n    }\n    if (this.completed()) {\n      return 'completed';\n    }\n    return 'default';\n  });\n\n  /** Mark this step as interacted and select it via the parent stepper. */\n  select(): void {\n    this._interacted.set(true);\n  }\n\n  /** Reset the step to its initial state. */\n  reset(): void {\n    this._interacted.set(false);\n    const control = this.stepControl();\n    if (control) {\n      control.reset();\n    }\n  }\n}\n","import { InjectionToken } from '@angular/core';\n\nexport type StepperOrientation = 'horizontal' | 'vertical';\nexport type StepState = 'active' | 'completed' | 'error' | 'disabled' | 'default';\n\nexport interface StepSelectionChange {\n  selectedIndex: number;\n  previousIndex: number;\n  selectedStep: unknown;\n  previousStep: unknown;\n}\n\nexport const FORMAUI_STEPPER = new InjectionToken<unknown>('FORMAUI_STEPPER');\n","import {\n  Component,\n  ChangeDetectionStrategy,\n  ViewEncapsulation,\n  input,\n  output,\n  signal,\n  computed,\n  effect,\n  contentChildren,\n  booleanAttribute,\n  WritableSignal,\n} from '@angular/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { FuiIconComponent } from '@raintonic/formaui/components/icon';\nimport { FuiStepComponent } from './step.component';\nimport { StepperOrientation, StepSelectionChange, FORMAUI_STEPPER } from './stepper.types';\n\nlet nextStepperId = 0;\n\n/**\n * # FuiStepperComponent\n *\n * A stepper component that guides users through a sequence of steps.\n * Supports horizontal and vertical orientations, linear and non-linear navigation,\n * step validation, and lazy content rendering.\n *\n * ## Usage\n *\n * ### Basic horizontal stepper\n * ```html\n * <fui-stepper>\n *   <fui-step label=\"Step 1\">Content 1</fui-step>\n *   <fui-step label=\"Step 2\">Content 2</fui-step>\n *   <fui-step label=\"Step 3\">Content 3</fui-step>\n * </fui-stepper>\n * ```\n *\n * ### Vertical stepper\n * ```html\n * <fui-stepper orientation=\"vertical\">\n *   <fui-step label=\"Step 1\">Content 1</fui-step>\n *   <fui-step label=\"Step 2\">Content 2</fui-step>\n * </fui-stepper>\n * ```\n *\n * ### Linear stepper with form validation\n * ```html\n * <fui-stepper [linear]=\"true\">\n *   <fui-step label=\"Account\" [stepControl]=\"accountForm\">\n *     <form [formGroup]=\"accountForm\">...</form>\n *   </fui-step>\n *   <fui-step label=\"Address\" [stepControl]=\"addressForm\">\n *     <form [formGroup]=\"addressForm\">...</form>\n *   </fui-step>\n * </fui-stepper>\n * ```\n */\n@Component({\n  selector: 'fui-stepper',\n  standalone: true,\n  imports: [NgTemplateOutlet, FuiIconComponent],\n  templateUrl: './stepper.component.html',\n  styleUrls: ['./stepper.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    class: 'fui-stepper',\n    '[class.fui-stepper--horizontal]': 'orientation() === \"horizontal\"',\n    '[class.fui-stepper--vertical]': 'orientation() === \"vertical\"',\n    '[class.fui-stepper--linear]': 'linear()',\n  },\n  providers: [{ provide: FORMAUI_STEPPER, useExisting: FuiStepperComponent }],\n})\nexport class FuiStepperComponent {\n  // Inputs\n  readonly orientation = input<StepperOrientation>('horizontal');\n  readonly linear = input<boolean, unknown>(false, { transform: booleanAttribute });\n  readonly selectedIndex = input(0);\n\n  // Outputs\n  readonly selectionChange = output<StepSelectionChange>();\n  readonly animationDone = output();\n\n  // Content children\n  readonly steps = contentChildren(FuiStepComponent);\n\n  // Internal state\n  readonly _selectedIndex: WritableSignal<number> = signal(0);\n\n  // Unique ID for ARIA linking\n  readonly _uniqueId = nextStepperId++;\n\n  // Computed: active step\n  readonly _selectedStep = computed(() => {\n    const allSteps = this.steps();\n    const idx = this._selectedIndex();\n    return allSteps[idx] ?? null;\n  });\n\n  constructor() {\n    // Sync selectedIndex input with internal state\n    effect(() => {\n      const idx = this.selectedIndex();\n      this._selectedIndex.set(idx);\n    });\n  }\n\n  /** Navigate to the next step. In linear mode, validates the current step first. */\n  next(): void {\n    const allSteps = this.steps();\n    const currentIdx = this._selectedIndex();\n\n    if (currentIdx >= allSteps.length - 1) {\n      return;\n    }\n\n    if (this.linear()) {\n      const currentStep = allSteps[currentIdx];\n      if (currentStep) {\n        currentStep._interacted.set(true);\n        const control = currentStep.stepControl();\n        if (control?.invalid) {\n          return;\n        }\n      }\n    }\n\n    this._setSelectedIndex(currentIdx + 1);\n  }\n\n  /** Navigate to the previous step. */\n  previous(): void {\n    const currentIdx = this._selectedIndex();\n    if (currentIdx > 0) {\n      this._setSelectedIndex(currentIdx - 1);\n    }\n  }\n\n  /** Navigate directly to a specific step by index. */\n  goToStep(index: number): void {\n    const allSteps = this.steps();\n    if (index < 0 || index >= allSteps.length) {\n      return;\n    }\n\n    if (this.linear() && index > this._selectedIndex()) {\n      // In linear mode, can only go forward if all preceding steps are valid\n      for (let i = this._selectedIndex(); i < index; i++) {\n        const step = allSteps[i];\n        if (step) {\n          step._interacted.set(true);\n          const control = step.stepControl();\n          if (control?.invalid) {\n            return;\n          }\n        }\n      }\n    }\n\n    this._setSelectedIndex(index);\n  }\n\n  /** Reset all steps and return to the first step. */\n  reset(): void {\n    this._selectedIndex.set(0);\n    this.steps().forEach((step) => {\n      step.reset();\n    });\n  }\n\n  /** @internal Handle step header click */\n  _onStepHeaderClick(index: number): void {\n    this.goToStep(index);\n  }\n\n  /** @internal Check if a step is disabled for navigation */\n  _isStepDisabled(index: number): boolean {\n    if (!this.linear()) {\n      return false;\n    }\n\n    const allSteps = this.steps();\n\n    // Can always go backward\n    if (index < this._selectedIndex()) {\n      // Check if the target step is editable\n      const targetStep = allSteps[index];\n      return targetStep ? !targetStep.editable() : false;\n    }\n\n    // For forward navigation in linear mode, check all preceding steps\n    if (index > this._selectedIndex()) {\n      for (let i = this._selectedIndex(); i < index; i++) {\n        const step = allSteps[i];\n        if (step) {\n          const control = step.stepControl();\n          if (control?.invalid) {\n            return true;\n          }\n        }\n      }\n    }\n\n    return false;\n  }\n\n  /** @internal Handle keyboard navigation on step headers */\n  _onHeaderKeydown(event: KeyboardEvent, currentIndex: number): void {\n    const isHorizontal = this.orientation() === 'horizontal';\n    const allSteps = this.steps();\n    let newIndex = currentIndex;\n\n    switch (event.key) {\n      case 'ArrowRight':\n        if (isHorizontal && currentIndex < allSteps.length - 1) {\n          newIndex = currentIndex + 1;\n        }\n        break;\n      case 'ArrowLeft':\n        if (isHorizontal && currentIndex > 0) {\n          newIndex = currentIndex - 1;\n        }\n        break;\n      case 'ArrowDown':\n        if (!isHorizontal && currentIndex < allSteps.length - 1) {\n          newIndex = currentIndex + 1;\n          event.preventDefault();\n        }\n        break;\n      case 'ArrowUp':\n        if (!isHorizontal && currentIndex > 0) {\n          newIndex = currentIndex - 1;\n          event.preventDefault();\n        }\n        break;\n      case 'Home':\n        newIndex = 0;\n        event.preventDefault();\n        break;\n      case 'End':\n        newIndex = allSteps.length - 1;\n        event.preventDefault();\n        break;\n      default:\n        return;\n    }\n\n    if (newIndex !== currentIndex) {\n      this._onStepHeaderClick(newIndex);\n    }\n  }\n\n  /** @internal Set the selected index and emit selection change */\n  private _setSelectedIndex(newIndex: number): void {\n    const allSteps = this.steps();\n    const previousIndex = this._selectedIndex();\n\n    if (newIndex === previousIndex) {\n      return;\n    }\n\n    const previousStep = allSteps[previousIndex] ?? null;\n    const selectedStep = allSteps[newIndex] ?? null;\n\n    // Mark the new step as interacted\n    if (selectedStep) {\n      selectedStep._interacted.set(true);\n    }\n\n    this._selectedIndex.set(newIndex);\n\n    this.selectionChange.emit({\n      selectedIndex: newIndex,\n      previousIndex,\n      selectedStep,\n      previousStep,\n    });\n  }\n}\n","<!-- Step Headers -->\n<div class=\"fui-stepper__header\" role=\"tablist\" [attr.aria-orientation]=\"orientation()\">\n  @for (step of steps(); track $index; let last = $last) {\n    <button\n      class=\"fui-stepper__step-header\"\n      [class.fui-stepper__step-header--active]=\"_selectedIndex() === $index\"\n      [class.fui-stepper__step-header--completed]=\"step.state() === 'completed'\"\n      [class.fui-stepper__step-header--error]=\"step.hasError()\"\n      [class.fui-stepper__step-header--disabled]=\"_isStepDisabled($index)\"\n      [attr.aria-selected]=\"_selectedIndex() === $index\"\n      [attr.aria-disabled]=\"_isStepDisabled($index)\"\n      [attr.aria-current]=\"_selectedIndex() === $index ? 'step' : null\"\n      [attr.aria-label]=\"\n        step.label() + (step.state() === 'completed' ? ' (completed)' : step.hasError() ? ' (error)' : '')\n      \"\n      [disabled]=\"_isStepDisabled($index)\"\n      role=\"tab\"\n      [attr.id]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\n      [attr.aria-controls]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\n      (click)=\"_onStepHeaderClick($index)\"\n      (keydown)=\"_onHeaderKeydown($event, $index)\"\n      type=\"button\"\n    >\n      <div class=\"fui-stepper__step-icon\">\n        @if (step.state() === 'completed' && !step.icon()) {\n          <fui-icon name=\"check\" size=\"sm\"></fui-icon>\n        } @else if (step.hasError()) {\n          <fui-icon name=\"warning\" size=\"sm\"></fui-icon>\n        } @else if (step.icon()) {\n          <fui-icon [name]=\"step.icon()\" size=\"sm\"></fui-icon>\n        } @else {\n          <span class=\"fui-stepper__step-number\">{{ $index + 1 }}</span>\n        }\n      </div>\n      <div class=\"fui-stepper__step-text\">\n        <span class=\"fui-stepper__step-label\">{{ step.label() }}</span>\n        @if (step.description()) {\n          <span class=\"fui-stepper__step-description\">{{ step.description() }}</span>\n        }\n        @if (step.hasError()) {\n          <span class=\"fui-stepper__step-error\">{{ step.errorMessage() }}</span>\n        }\n      </div>\n    </button>\n    @if (!last) {\n      <div\n        class=\"fui-stepper__connector\"\n        [class.fui-stepper__connector--completed]=\"step.state() === 'completed'\"\n      ></div>\n    }\n  }\n</div>\n\n<!-- Step Content -->\n<div class=\"fui-stepper__content\">\n  @for (step of steps(); track $index) {\n    <div\n      class=\"fui-stepper__step-body\"\n      [class.fui-stepper__step-body--active]=\"_selectedIndex() === $index\"\n      role=\"tabpanel\"\n      [attr.id]=\"'fui-step-content-' + _uniqueId + '-' + $index\"\n      [attr.aria-labelledby]=\"'fui-step-header-' + _uniqueId + '-' + $index\"\n      [attr.aria-expanded]=\"_selectedIndex() === $index\"\n    >\n      @if (_selectedIndex() === $index || step._interacted()) {\n        <ng-container [ngTemplateOutlet]=\"step.contentTemplate()!\"></ng-container>\n      }\n    </div>\n  }\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"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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"}

package/fesm2022/raintonic-formaui-components-tab.mjs

@@ -31,10 +31,10 @@ class FuiTabComponent {
      */
     content;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", type: FuiTabComponent, isStandalone: true, selector: "fui-tab", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "content", first: true, predicate: TemplateRef, descendants: true, static: true }], ngImport: i0, template: `
-    <ng-template>
-      <ng-content></ng-content>
-    </ng-template>
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.6", type: FuiTabComponent, isStandalone: true, selector: "fui-tab", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "content", first: true, predicate: TemplateRef, descendants: true, static: true }], ngImport: i0, template: `
+    <ng-template>
+      <ng-content></ng-content>
+    </ng-template>
   `, isInline: true });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiTabComponent, decorators: [{
@@ -42,10 +42,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImpor
             args: [{
                     selector: 'fui-tab',
                     standalone: true,
-                    template: `
-    <ng-template>
-      <ng-content></ng-content>
-    </ng-template>
+                    template: `
+    <ng-template>
+      <ng-content></ng-content>
+    </ng-template>
   `,
                 }]
         }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], content: [{
@@ -174,13 +174,13 @@ class FuiTabGroupComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiTabGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiTabGroupComponent, isStandalone: true, selector: "fui-tab-group", inputs: { selectedIndex: { classPropertyName: "selectedIndex", publicName: "selectedIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedIndex: "selectedIndexChange", selectedTabChange: "selectedTabChange" }, host: { classAttribute: "fui-tab-group" }, queries: [{ propertyName: "tabComponents", predicate: FuiTabComponent }], viewQueries: [{ propertyName: "tabButtons", predicate: ["tabButton"], descendants: true }], ngImport: i0, template: "<div class=\"fui-tab-group\">\n  <div class=\"fui-tab-header\" role=\"tablist\">\n    @for (tab of tabs(); track $index) {\n      <button\n        #tabButton\n        class=\"fui-tab-label\"\n        [class.fui-tab-label--active]=\"selectedIndex() === $index\"\n        [class.fui-tab-label--disabled]=\"tab.disabled()\"\n        [disabled]=\"tab.disabled()\"\n        [attr.aria-selected]=\"selectedIndex() === $index\"\n        [attr.tabindex]=\"selectedIndex() === $index ? 0 : -1\"\n        [attr.aria-controls]=\"tabGroupId + '-panel-' + $index\"\n        [id]=\"tabGroupId + '-tab-' + $index\"\n        role=\"tab\"\n        type=\"button\"\n        (click)=\"selectTab($index)\"\n        (keydown)=\"onKeydown($event, $index)\"\n      >\n        {{ tab.label() }}\n      </button>\n    }\n  </div>\n\n  <div class=\"fui-tab-content\">\n    @for (tab of tabs(); track $index) {\n      <div\n        class=\"fui-tab-panel\"\n        [class.fui-tab-panel--active]=\"selectedIndex() === $index\"\n        [attr.aria-labelledby]=\"tabGroupId + '-tab-' + $index\"\n        [id]=\"tabGroupId + '-panel-' + $index\"\n        role=\"tabpanel\"\n        [attr.tabindex]=\"selectedIndex() === $index ? 0 : null\"\n        [attr.aria-hidden]=\"selectedIndex() !== $index\"\n      >\n        @if (selectedIndex() === $index) {\n          <ng-container [ngTemplateOutlet]=\"tab.content\"></ng-container>\n        }\n      </div>\n    }\n  </div>\n</div>\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-tab-group{--fui-tab-label-font-size: var(--fui-font-size-02);--fui-tab-label-min-height: 3rem;--fui-tab-label-padding-x: 1.5rem;--fui-tab-label-padding-y: .75rem;--fui-tab-panel-padding: 1.5rem;--fui-tab-indicator-height: 2px;--fui-tab-active-color: var(--fui-primary);contain:layout style;display:flex;flex-direction:column;width:100%}.fui-tab-header{display:flex;border-bottom:1px solid var(--fui-border-color);background-color:color-mix(in srgb,var(--fui-surface-02) 80%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:sticky;top:0;left:0;z-index:var(--fui-z-sticky, 1020)}.fui-tab-header:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:1px;background-color:var(--fui-border-color)}.fui-tab-label{display:flex;align-items:center;justify-content:center;padding:var(--fui-tab-label-padding-y) var(--fui-tab-label-padding-x);border:none;background:transparent;color:var(--fui-text-secondary);font-size:var(--fui-tab-label-font-size);font-weight:400;line-height:1.25rem;cursor:pointer;position:relative;transition:color,background-color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms;white-space:nowrap;min-height:var(--fui-tab-label-min-height)}.fui-tab-label:hover:not(.fui-tab-label--disabled){color:var(--fui-text-primary);background-color:var(--fui-surface-02)}.fui-tab-label--active{color:var(--fui-tab-active-color);font-weight:600}.fui-tab-label--active:after{content:\"\";position:absolute;bottom:-1px;left:0;right:0;height:var(--fui-tab-indicator-height);background-color:var(--fui-tab-active-color);z-index:1}.fui-tab-label--disabled{color:var(--fui-text-secondary);cursor:not-allowed;opacity:var(--fui-opacity-disabled)}.fui-tab-label--disabled:hover{background-color:transparent}.fui-tab-label:focus-visible{outline:2px solid var(--fui-primary);outline-offset:-2px}.fui-tab-content{flex:1;z-index:9;position:relative;overflow:hidden}.fui-tab-panel{display:none;padding:var(--fui-tab-panel-padding);background:transparent;animation:fadeIn var(--fui-duration-fast-02, .11s) var(--fui-ease-entrance, cubic-bezier(0, 0, .38, .9))}.fui-tab-panel--active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media(max-width:576px){.fui-tab-header{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.fui-tab-header::-webkit-scrollbar{display:none}.fui-tab-label{flex-shrink:0;padding:.5rem 1rem;min-height:2.5rem;font-size:.8125rem}.fui-tab-panel{padding:1rem}}@media(prefers-reduced-motion:reduce){.fui-tab-label{transition:none}.fui-tab-panel{animation:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiTabGroupComponent, isStandalone: true, selector: "fui-tab-group", inputs: { selectedIndex: { classPropertyName: "selectedIndex", publicName: "selectedIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedIndex: "selectedIndexChange", selectedTabChange: "selectedTabChange" }, host: { classAttribute: "fui-tab-group" }, queries: [{ propertyName: "tabComponents", predicate: FuiTabComponent }], viewQueries: [{ propertyName: "tabButtons", predicate: ["tabButton"], descendants: true }], ngImport: i0, template: "<div class=\"fui-tab-group\">\r\n  <div class=\"fui-tab-header\" role=\"tablist\">\r\n    @for (tab of tabs(); track $index) {\r\n      <button\r\n        #tabButton\r\n        class=\"fui-tab-label\"\r\n        [class.fui-tab-label--active]=\"selectedIndex() === $index\"\r\n        [class.fui-tab-label--disabled]=\"tab.disabled()\"\r\n        [disabled]=\"tab.disabled()\"\r\n        [attr.aria-selected]=\"selectedIndex() === $index\"\r\n        [attr.tabindex]=\"selectedIndex() === $index ? 0 : -1\"\r\n        [attr.aria-controls]=\"tabGroupId + '-panel-' + $index\"\r\n        [id]=\"tabGroupId + '-tab-' + $index\"\r\n        role=\"tab\"\r\n        type=\"button\"\r\n        (click)=\"selectTab($index)\"\r\n        (keydown)=\"onKeydown($event, $index)\"\r\n      >\r\n        {{ tab.label() }}\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  <div class=\"fui-tab-content\">\r\n    @for (tab of tabs(); track $index) {\r\n      <div\r\n        class=\"fui-tab-panel\"\r\n        [class.fui-tab-panel--active]=\"selectedIndex() === $index\"\r\n        [attr.aria-labelledby]=\"tabGroupId + '-tab-' + $index\"\r\n        [id]=\"tabGroupId + '-panel-' + $index\"\r\n        role=\"tabpanel\"\r\n        [attr.tabindex]=\"selectedIndex() === $index ? 0 : null\"\r\n        [attr.aria-hidden]=\"selectedIndex() !== $index\"\r\n      >\r\n        @if (selectedIndex() === $index) {\r\n          <ng-container [ngTemplateOutlet]=\"tab.content\"></ng-container>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\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-tab-group{--fui-tab-label-font-size: var(--fui-font-size-02);--fui-tab-label-min-height: 3rem;--fui-tab-label-padding-x: 1.5rem;--fui-tab-label-padding-y: .75rem;--fui-tab-panel-padding: 1.5rem;--fui-tab-indicator-height: 2px;--fui-tab-active-color: var(--fui-primary);contain:layout style;display:flex;flex-direction:column;width:100%}.fui-tab-header{display:flex;border-bottom:1px solid var(--fui-border-color);background-color:color-mix(in srgb,var(--fui-surface-02) 80%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:sticky;top:0;left:0;z-index:var(--fui-z-sticky, 1020)}.fui-tab-header:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:1px;background-color:var(--fui-border-color)}.fui-tab-label{display:flex;align-items:center;justify-content:center;padding:var(--fui-tab-label-padding-y) var(--fui-tab-label-padding-x);border:none;background:transparent;color:var(--fui-text-secondary);font-size:var(--fui-tab-label-font-size);font-weight:400;line-height:1.25rem;cursor:pointer;position:relative;transition:color,background-color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms;white-space:nowrap;min-height:var(--fui-tab-label-min-height)}.fui-tab-label:hover:not(.fui-tab-label--disabled){color:var(--fui-text-primary);background-color:var(--fui-surface-02)}.fui-tab-label--active{color:var(--fui-tab-active-color);font-weight:600}.fui-tab-label--active:after{content:\"\";position:absolute;bottom:-1px;left:0;right:0;height:var(--fui-tab-indicator-height);background-color:var(--fui-tab-active-color);z-index:1}.fui-tab-label--disabled{color:var(--fui-text-secondary);cursor:not-allowed;opacity:var(--fui-opacity-disabled)}.fui-tab-label--disabled:hover{background-color:transparent}.fui-tab-label:focus-visible{outline:2px solid var(--fui-primary);outline-offset:-2px}.fui-tab-content{flex:1;z-index:9;position:relative;overflow:hidden}.fui-tab-panel{display:none;padding:var(--fui-tab-panel-padding);background:transparent;animation:fadeIn var(--fui-duration-fast-02, .11s) var(--fui-ease-entrance, cubic-bezier(0, 0, .38, .9))}.fui-tab-panel--active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media(max-width:576px){.fui-tab-header{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.fui-tab-header::-webkit-scrollbar{display:none}.fui-tab-label{flex-shrink:0;padding:.5rem 1rem;min-height:2.5rem;font-size:.8125rem}.fui-tab-panel{padding:1rem}}@media(prefers-reduced-motion:reduce){.fui-tab-label{transition:none}.fui-tab-panel{animation:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiTabGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fui-tab-group', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'fui-tab-group',
-                    }, template: "<div class=\"fui-tab-group\">\n  <div class=\"fui-tab-header\" role=\"tablist\">\n    @for (tab of tabs(); track $index) {\n      <button\n        #tabButton\n        class=\"fui-tab-label\"\n        [class.fui-tab-label--active]=\"selectedIndex() === $index\"\n        [class.fui-tab-label--disabled]=\"tab.disabled()\"\n        [disabled]=\"tab.disabled()\"\n        [attr.aria-selected]=\"selectedIndex() === $index\"\n        [attr.tabindex]=\"selectedIndex() === $index ? 0 : -1\"\n        [attr.aria-controls]=\"tabGroupId + '-panel-' + $index\"\n        [id]=\"tabGroupId + '-tab-' + $index\"\n        role=\"tab\"\n        type=\"button\"\n        (click)=\"selectTab($index)\"\n        (keydown)=\"onKeydown($event, $index)\"\n      >\n        {{ tab.label() }}\n      </button>\n    }\n  </div>\n\n  <div class=\"fui-tab-content\">\n    @for (tab of tabs(); track $index) {\n      <div\n        class=\"fui-tab-panel\"\n        [class.fui-tab-panel--active]=\"selectedIndex() === $index\"\n        [attr.aria-labelledby]=\"tabGroupId + '-tab-' + $index\"\n        [id]=\"tabGroupId + '-panel-' + $index\"\n        role=\"tabpanel\"\n        [attr.tabindex]=\"selectedIndex() === $index ? 0 : null\"\n        [attr.aria-hidden]=\"selectedIndex() !== $index\"\n      >\n        @if (selectedIndex() === $index) {\n          <ng-container [ngTemplateOutlet]=\"tab.content\"></ng-container>\n        }\n      </div>\n    }\n  </div>\n</div>\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-tab-group{--fui-tab-label-font-size: var(--fui-font-size-02);--fui-tab-label-min-height: 3rem;--fui-tab-label-padding-x: 1.5rem;--fui-tab-label-padding-y: .75rem;--fui-tab-panel-padding: 1.5rem;--fui-tab-indicator-height: 2px;--fui-tab-active-color: var(--fui-primary);contain:layout style;display:flex;flex-direction:column;width:100%}.fui-tab-header{display:flex;border-bottom:1px solid var(--fui-border-color);background-color:color-mix(in srgb,var(--fui-surface-02) 80%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:sticky;top:0;left:0;z-index:var(--fui-z-sticky, 1020)}.fui-tab-header:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:1px;background-color:var(--fui-border-color)}.fui-tab-label{display:flex;align-items:center;justify-content:center;padding:var(--fui-tab-label-padding-y) var(--fui-tab-label-padding-x);border:none;background:transparent;color:var(--fui-text-secondary);font-size:var(--fui-tab-label-font-size);font-weight:400;line-height:1.25rem;cursor:pointer;position:relative;transition:color,background-color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms;white-space:nowrap;min-height:var(--fui-tab-label-min-height)}.fui-tab-label:hover:not(.fui-tab-label--disabled){color:var(--fui-text-primary);background-color:var(--fui-surface-02)}.fui-tab-label--active{color:var(--fui-tab-active-color);font-weight:600}.fui-tab-label--active:after{content:\"\";position:absolute;bottom:-1px;left:0;right:0;height:var(--fui-tab-indicator-height);background-color:var(--fui-tab-active-color);z-index:1}.fui-tab-label--disabled{color:var(--fui-text-secondary);cursor:not-allowed;opacity:var(--fui-opacity-disabled)}.fui-tab-label--disabled:hover{background-color:transparent}.fui-tab-label:focus-visible{outline:2px solid var(--fui-primary);outline-offset:-2px}.fui-tab-content{flex:1;z-index:9;position:relative;overflow:hidden}.fui-tab-panel{display:none;padding:var(--fui-tab-panel-padding);background:transparent;animation:fadeIn var(--fui-duration-fast-02, .11s) var(--fui-ease-entrance, cubic-bezier(0, 0, .38, .9))}.fui-tab-panel--active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media(max-width:576px){.fui-tab-header{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.fui-tab-header::-webkit-scrollbar{display:none}.fui-tab-label{flex-shrink:0;padding:.5rem 1rem;min-height:2.5rem;font-size:.8125rem}.fui-tab-panel{padding:1rem}}@media(prefers-reduced-motion:reduce){.fui-tab-label{transition:none}.fui-tab-panel{animation:none}}\n"] }]
+                    }, template: "<div class=\"fui-tab-group\">\r\n  <div class=\"fui-tab-header\" role=\"tablist\">\r\n    @for (tab of tabs(); track $index) {\r\n      <button\r\n        #tabButton\r\n        class=\"fui-tab-label\"\r\n        [class.fui-tab-label--active]=\"selectedIndex() === $index\"\r\n        [class.fui-tab-label--disabled]=\"tab.disabled()\"\r\n        [disabled]=\"tab.disabled()\"\r\n        [attr.aria-selected]=\"selectedIndex() === $index\"\r\n        [attr.tabindex]=\"selectedIndex() === $index ? 0 : -1\"\r\n        [attr.aria-controls]=\"tabGroupId + '-panel-' + $index\"\r\n        [id]=\"tabGroupId + '-tab-' + $index\"\r\n        role=\"tab\"\r\n        type=\"button\"\r\n        (click)=\"selectTab($index)\"\r\n        (keydown)=\"onKeydown($event, $index)\"\r\n      >\r\n        {{ tab.label() }}\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  <div class=\"fui-tab-content\">\r\n    @for (tab of tabs(); track $index) {\r\n      <div\r\n        class=\"fui-tab-panel\"\r\n        [class.fui-tab-panel--active]=\"selectedIndex() === $index\"\r\n        [attr.aria-labelledby]=\"tabGroupId + '-tab-' + $index\"\r\n        [id]=\"tabGroupId + '-panel-' + $index\"\r\n        role=\"tabpanel\"\r\n        [attr.tabindex]=\"selectedIndex() === $index ? 0 : null\"\r\n        [attr.aria-hidden]=\"selectedIndex() !== $index\"\r\n      >\r\n        @if (selectedIndex() === $index) {\r\n          <ng-container [ngTemplateOutlet]=\"tab.content\"></ng-container>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\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-tab-group{--fui-tab-label-font-size: var(--fui-font-size-02);--fui-tab-label-min-height: 3rem;--fui-tab-label-padding-x: 1.5rem;--fui-tab-label-padding-y: .75rem;--fui-tab-panel-padding: 1.5rem;--fui-tab-indicator-height: 2px;--fui-tab-active-color: var(--fui-primary);contain:layout style;display:flex;flex-direction:column;width:100%}.fui-tab-header{display:flex;border-bottom:1px solid var(--fui-border-color);background-color:color-mix(in srgb,var(--fui-surface-02) 80%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);position:sticky;top:0;left:0;z-index:var(--fui-z-sticky, 1020)}.fui-tab-header:after{content:\"\";position:absolute;bottom:0;left:0;right:0;height:1px;background-color:var(--fui-border-color)}.fui-tab-label{display:flex;align-items:center;justify-content:center;padding:var(--fui-tab-label-padding-y) var(--fui-tab-label-padding-x);border:none;background:transparent;color:var(--fui-text-secondary);font-size:var(--fui-tab-label-font-size);font-weight:400;line-height:1.25rem;cursor:pointer;position:relative;transition:color,background-color var(--fui-duration-fast-02) var(--fui-ease-standard) 0ms;white-space:nowrap;min-height:var(--fui-tab-label-min-height)}.fui-tab-label:hover:not(.fui-tab-label--disabled){color:var(--fui-text-primary);background-color:var(--fui-surface-02)}.fui-tab-label--active{color:var(--fui-tab-active-color);font-weight:600}.fui-tab-label--active:after{content:\"\";position:absolute;bottom:-1px;left:0;right:0;height:var(--fui-tab-indicator-height);background-color:var(--fui-tab-active-color);z-index:1}.fui-tab-label--disabled{color:var(--fui-text-secondary);cursor:not-allowed;opacity:var(--fui-opacity-disabled)}.fui-tab-label--disabled:hover{background-color:transparent}.fui-tab-label:focus-visible{outline:2px solid var(--fui-primary);outline-offset:-2px}.fui-tab-content{flex:1;z-index:9;position:relative;overflow:hidden}.fui-tab-panel{display:none;padding:var(--fui-tab-panel-padding);background:transparent;animation:fadeIn var(--fui-duration-fast-02, .11s) var(--fui-ease-entrance, cubic-bezier(0, 0, .38, .9))}.fui-tab-panel--active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media(max-width:576px){.fui-tab-header{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.fui-tab-header::-webkit-scrollbar{display:none}.fui-tab-label{flex-shrink:0;padding:.5rem 1rem;min-height:2.5rem;font-size:.8125rem}.fui-tab-panel{padding:1rem}}@media(prefers-reduced-motion:reduce){.fui-tab-label{transition:none}.fui-tab-panel{animation:none}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { selectedIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedIndex", required: false }] }, { type: i0.Output, args: ["selectedIndexChange"] }], selectedTabChange: [{ type: i0.Output, args: ["selectedTabChange"] }], tabComponents: [{
                 type: ContentChildren,
                 args: [FuiTabComponent]

package/fesm2022/raintonic-formaui-components-tab.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"raintonic-formaui-components-tab.mjs","sources":["../../../lib/components/tab/tab.component.ts","../../../lib/components/tab/tab-group.component.ts","../../../lib/components/tab/tab-group.component.html","../../../lib/components/tab/raintonic-formaui-components-tab.ts"],"sourcesContent":["import { Component, input, TemplateRef, ViewChild, InputSignal } from '@angular/core';\n\n/**\n * @component FuiTabComponent\n * @selector fui-tab\n * @description Individual tab definition used inside `fui-tab-group`. Provides a label\n * for the tab header and wraps its content in an `ng-template` for lazy rendering.\n *\n * @input label - (required) Text displayed in the tab header button\n * @input disabled - Whether the tab is disabled and cannot be selected (default: false)\n *\n * @example\n * <fui-tab label=\"Settings\" [disabled]=\"!canEdit\">\n *   <p>Settings panel content here.</p>\n * </fui-tab>\n */\n@Component({\n  selector: 'fui-tab',\n  standalone: true,\n  template: `\n    <ng-template>\n      <ng-content></ng-content>\n    </ng-template>\n  `,\n})\nexport class FuiTabComponent {\n  /**\n   * The label for the tab\n   */\n  readonly label: InputSignal<string> = input.required<string>();\n\n  /**\n   * Whether the tab is disabled\n   */\n  readonly disabled: InputSignal<boolean> = input(false);\n\n  /**\n   * Template reference for the tab content\n   */\n  @ViewChild(TemplateRef, { static: true }) content!: TemplateRef<unknown>;\n}\n","import {\n  AfterContentInit,\n  ChangeDetectionStrategy,\n  Component,\n  ContentChildren,\n  effect,\n  ElementRef,\n  model,\n  ModelSignal,\n  output,\n  OutputEmitterRef,\n  QueryList,\n  signal,\n  ViewChildren,\n  ViewEncapsulation,\n  WritableSignal,\n} from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { FuiTabComponent } from './tab.component';\n\nlet nextTabGroupId = 0;\n\n/**\n * @component FuiTabGroupComponent\n * @selector fui-tab-group\n * @description Container for `fui-tab` components. Manages tab selection, keyboard navigation\n * (ArrowLeft/Right, Home, End, Enter, Space), and roving tabindex for accessibility.\n * Uses content projection to collect tab definitions and renders their content lazily.\n *\n * @input selectedIndex - Two-way model signal for the active tab index (default: 0)\n *\n * @output selectedTabChange - Emits the FuiTabComponent instance when a new tab is selected\n *\n * @cssvar --fui-tab-label-font-size - Font size of tab labels\n * @cssvar --fui-tab-label-min-height - Minimum height of tab header buttons\n * @cssvar --fui-tab-label-padding-x - Horizontal padding of tab labels\n * @cssvar --fui-tab-label-padding-y - Vertical padding of tab labels\n * @cssvar --fui-tab-panel-padding - Padding of the tab content panel\n * @cssvar --fui-tab-indicator-height - Height of the active-tab underline indicator\n * @cssvar --fui-tab-active-color - Color of the active tab label and indicator\n *\n * @example\n * <fui-tab-group [(selectedIndex)]=\"activeTab\">\n *   <fui-tab label=\"Overview\">Overview content</fui-tab>\n *   <fui-tab label=\"Details\">Details content</fui-tab>\n *   <fui-tab label=\"History\" [disabled]=\"true\">History content</fui-tab>\n * </fui-tab-group>\n */\n@Component({\n  selector: 'fui-tab-group',\n  standalone: true,\n  imports: [CommonModule],\n  templateUrl: './tab-group.component.html',\n  styleUrls: ['./tab-group.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    class: 'fui-tab-group',\n  },\n})\nexport class FuiTabGroupComponent implements AfterContentInit {\n  /** Unique ID prefix for this tab group instance to avoid collisions */\n  readonly tabGroupId = `fui-tab-group-${nextTabGroupId++}`;\n\n  /**\n   * The index of the selected tab\n   */\n  readonly selectedIndex: ModelSignal<number> = model(0);\n\n  /**\n   * Event emitted when a tab is selected\n   */\n  readonly selectedTabChange: OutputEmitterRef<FuiTabComponent> = output<FuiTabComponent>();\n\n  /**\n   * Query for all tab components\n   */\n  @ContentChildren(FuiTabComponent) tabComponents!: QueryList<FuiTabComponent>;\n\n  /**\n   * Query for tab header buttons for focus management\n   */\n  @ViewChildren('tabButton') tabButtons!: QueryList<ElementRef<HTMLButtonElement>>;\n\n  /**\n   * Signal containing all tabs\n   */\n  readonly tabs: WritableSignal<FuiTabComponent[]> = signal<FuiTabComponent[]>([]);\n\n  constructor() {\n    // React to external or internal selectedIndex changes and emit selectedTabChange accordingly\n    effect(() => {\n      const idx = this.selectedIndex();\n      const tabs = this.tabs();\n      if (!tabs?.length) return;\n      if (idx >= 0 && idx < tabs.length) {\n        const tab = tabs[idx];\n        if (!tab.disabled()) {\n          this.selectedTabChange.emit(tab);\n        }\n      }\n    });\n  }\n\n  ngAfterContentInit(): void {\n    this.tabs.set(this.tabComponents.toArray());\n\n    // Listen for changes in tab components\n    this.tabComponents.changes.subscribe(() => {\n      this.tabs.set(this.tabComponents.toArray());\n    });\n  }\n\n  /**\n   * Select a tab by index\n   */\n  selectTab(index: number): void {\n    const tabs = this.tabs();\n    if (index >= 0 && index < tabs.length && !tabs[index].disabled()) {\n      // Update the model; the effect defined in ngAfterContentInit will emit selectedTabChange\n      this.selectedIndex.set(index);\n    }\n  }\n\n  onKeydown(event: KeyboardEvent, index: number): void {\n    const tabs = this.tabs();\n    if (!tabs?.length) return;\n    const last = tabs.length - 1;\n    let next = index;\n    switch (event.key) {\n      case 'ArrowRight':\n        next = index === last ? 0 : index + 1;\n        break;\n      case 'ArrowLeft':\n        next = index === 0 ? last : index - 1;\n        break;\n      case 'Home':\n        next = 0;\n        break;\n      case 'End':\n        next = last;\n        break;\n      case 'Enter':\n      case ' ': // Space key\n        this.selectTab(index);\n        return;\n      default:\n        return;\n    }\n    event.preventDefault();\n    while (tabs[next]?.disabled()) {\n      next = (next + 1) % tabs.length;\n      if (next === index) break;\n    }\n    // Focus the target tab button (roving tabindex)\n    const buttons = this.tabButtons?.toArray();\n    if (buttons?.[next]) {\n      buttons[next].nativeElement.focus();\n    }\n  }\n}\n","<div class=\"fui-tab-group\">\n  <div class=\"fui-tab-header\" role=\"tablist\">\n    @for (tab of tabs(); track $index) {\n      <button\n        #tabButton\n        class=\"fui-tab-label\"\n        [class.fui-tab-label--active]=\"selectedIndex() === $index\"\n        [class.fui-tab-label--disabled]=\"tab.disabled()\"\n        [disabled]=\"tab.disabled()\"\n        [attr.aria-selected]=\"selectedIndex() === $index\"\n        [attr.tabindex]=\"selectedIndex() === $index ? 0 : -1\"\n        [attr.aria-controls]=\"tabGroupId + '-panel-' + $index\"\n        [id]=\"tabGroupId + '-tab-' + $index\"\n        role=\"tab\"\n        type=\"button\"\n        (click)=\"selectTab($index)\"\n        (keydown)=\"onKeydown($event, $index)\"\n      >\n        {{ tab.label() }}\n      </button>\n    }\n  </div>\n\n  <div class=\"fui-tab-content\">\n    @for (tab of tabs(); track $index) {\n      <div\n        class=\"fui-tab-panel\"\n        [class.fui-tab-panel--active]=\"selectedIndex() === $index\"\n        [attr.aria-labelledby]=\"tabGroupId + '-tab-' + $index\"\n        [id]=\"tabGroupId + '-panel-' + $index\"\n        role=\"tabpanel\"\n        [attr.tabindex]=\"selectedIndex() === $index ? 0 : null\"\n        [attr.aria-hidden]=\"selectedIndex() !== $index\"\n      >\n        @if (selectedIndex() === $index) {\n          <ng-container [ngTemplateOutlet]=\"tab.content\"></ng-container>\n        }\n      </div>\n    }\n  </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"raintonic-formaui-components-tab.mjs","sources":["../../../lib/components/tab/tab.component.ts","../../../lib/components/tab/tab-group.component.ts","../../../lib/components/tab/tab-group.component.html","../../../lib/components/tab/raintonic-formaui-components-tab.ts"],"sourcesContent":["import { Component, input, TemplateRef, ViewChild, InputSignal } from '@angular/core';\r\n\r\n/**\r\n * @component FuiTabComponent\r\n * @selector fui-tab\r\n * @description Individual tab definition used inside `fui-tab-group`. Provides a label\r\n * for the tab header and wraps its content in an `ng-template` for lazy rendering.\r\n *\r\n * @input label - (required) Text displayed in the tab header button\r\n * @input disabled - Whether the tab is disabled and cannot be selected (default: false)\r\n *\r\n * @example\r\n * <fui-tab label=\"Settings\" [disabled]=\"!canEdit\">\r\n *   <p>Settings panel content here.</p>\r\n * </fui-tab>\r\n */\r\n@Component({\r\n  selector: 'fui-tab',\r\n  standalone: true,\r\n  template: `\r\n    <ng-template>\r\n      <ng-content></ng-content>\r\n    </ng-template>\r\n  `,\r\n})\r\nexport class FuiTabComponent {\r\n  /**\r\n   * The label for the tab\r\n   */\r\n  readonly label: InputSignal<string> = input.required<string>();\r\n\r\n  /**\r\n   * Whether the tab is disabled\r\n   */\r\n  readonly disabled: InputSignal<boolean> = input(false);\r\n\r\n  /**\r\n   * Template reference for the tab content\r\n   */\r\n  @ViewChild(TemplateRef, { static: true }) content!: TemplateRef<unknown>;\r\n}\r\n","import {\r\n  AfterContentInit,\r\n  ChangeDetectionStrategy,\r\n  Component,\r\n  ContentChildren,\r\n  effect,\r\n  ElementRef,\r\n  model,\r\n  ModelSignal,\r\n  output,\r\n  OutputEmitterRef,\r\n  QueryList,\r\n  signal,\r\n  ViewChildren,\r\n  ViewEncapsulation,\r\n  WritableSignal,\r\n} from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { FuiTabComponent } from './tab.component';\r\n\r\nlet nextTabGroupId = 0;\r\n\r\n/**\r\n * @component FuiTabGroupComponent\r\n * @selector fui-tab-group\r\n * @description Container for `fui-tab` components. Manages tab selection, keyboard navigation\r\n * (ArrowLeft/Right, Home, End, Enter, Space), and roving tabindex for accessibility.\r\n * Uses content projection to collect tab definitions and renders their content lazily.\r\n *\r\n * @input selectedIndex - Two-way model signal for the active tab index (default: 0)\r\n *\r\n * @output selectedTabChange - Emits the FuiTabComponent instance when a new tab is selected\r\n *\r\n * @cssvar --fui-tab-label-font-size - Font size of tab labels\r\n * @cssvar --fui-tab-label-min-height - Minimum height of tab header buttons\r\n * @cssvar --fui-tab-label-padding-x - Horizontal padding of tab labels\r\n * @cssvar --fui-tab-label-padding-y - Vertical padding of tab labels\r\n * @cssvar --fui-tab-panel-padding - Padding of the tab content panel\r\n * @cssvar --fui-tab-indicator-height - Height of the active-tab underline indicator\r\n * @cssvar --fui-tab-active-color - Color of the active tab label and indicator\r\n *\r\n * @example\r\n * <fui-tab-group [(selectedIndex)]=\"activeTab\">\r\n *   <fui-tab label=\"Overview\">Overview content</fui-tab>\r\n *   <fui-tab label=\"Details\">Details content</fui-tab>\r\n *   <fui-tab label=\"History\" [disabled]=\"true\">History content</fui-tab>\r\n * </fui-tab-group>\r\n */\r\n@Component({\r\n  selector: 'fui-tab-group',\r\n  standalone: true,\r\n  imports: [CommonModule],\r\n  templateUrl: './tab-group.component.html',\r\n  styleUrls: ['./tab-group.component.scss'],\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  encapsulation: ViewEncapsulation.None,\r\n  host: {\r\n    class: 'fui-tab-group',\r\n  },\r\n})\r\nexport class FuiTabGroupComponent implements AfterContentInit {\r\n  /** Unique ID prefix for this tab group instance to avoid collisions */\r\n  readonly tabGroupId = `fui-tab-group-${nextTabGroupId++}`;\r\n\r\n  /**\r\n   * The index of the selected tab\r\n   */\r\n  readonly selectedIndex: ModelSignal<number> = model(0);\r\n\r\n  /**\r\n   * Event emitted when a tab is selected\r\n   */\r\n  readonly selectedTabChange: OutputEmitterRef<FuiTabComponent> = output<FuiTabComponent>();\r\n\r\n  /**\r\n   * Query for all tab components\r\n   */\r\n  @ContentChildren(FuiTabComponent) tabComponents!: QueryList<FuiTabComponent>;\r\n\r\n  /**\r\n   * Query for tab header buttons for focus management\r\n   */\r\n  @ViewChildren('tabButton') tabButtons!: QueryList<ElementRef<HTMLButtonElement>>;\r\n\r\n  /**\r\n   * Signal containing all tabs\r\n   */\r\n  readonly tabs: WritableSignal<FuiTabComponent[]> = signal<FuiTabComponent[]>([]);\r\n\r\n  constructor() {\r\n    // React to external or internal selectedIndex changes and emit selectedTabChange accordingly\r\n    effect(() => {\r\n      const idx = this.selectedIndex();\r\n      const tabs = this.tabs();\r\n      if (!tabs?.length) return;\r\n      if (idx >= 0 && idx < tabs.length) {\r\n        const tab = tabs[idx];\r\n        if (!tab.disabled()) {\r\n          this.selectedTabChange.emit(tab);\r\n        }\r\n      }\r\n    });\r\n  }\r\n\r\n  ngAfterContentInit(): void {\r\n    this.tabs.set(this.tabComponents.toArray());\r\n\r\n    // Listen for changes in tab components\r\n    this.tabComponents.changes.subscribe(() => {\r\n      this.tabs.set(this.tabComponents.toArray());\r\n    });\r\n  }\r\n\r\n  /**\r\n   * Select a tab by index\r\n   */\r\n  selectTab(index: number): void {\r\n    const tabs = this.tabs();\r\n    if (index >= 0 && index < tabs.length && !tabs[index].disabled()) {\r\n      // Update the model; the effect defined in ngAfterContentInit will emit selectedTabChange\r\n      this.selectedIndex.set(index);\r\n    }\r\n  }\r\n\r\n  onKeydown(event: KeyboardEvent, index: number): void {\r\n    const tabs = this.tabs();\r\n    if (!tabs?.length) return;\r\n    const last = tabs.length - 1;\r\n    let next = index;\r\n    switch (event.key) {\r\n      case 'ArrowRight':\r\n        next = index === last ? 0 : index + 1;\r\n        break;\r\n      case 'ArrowLeft':\r\n        next = index === 0 ? last : index - 1;\r\n        break;\r\n      case 'Home':\r\n        next = 0;\r\n        break;\r\n      case 'End':\r\n        next = last;\r\n        break;\r\n      case 'Enter':\r\n      case ' ': // Space key\r\n        this.selectTab(index);\r\n        return;\r\n      default:\r\n        return;\r\n    }\r\n    event.preventDefault();\r\n    while (tabs[next]?.disabled()) {\r\n      next = (next + 1) % tabs.length;\r\n      if (next === index) break;\r\n    }\r\n    // Focus the target tab button (roving tabindex)\r\n    const buttons = this.tabButtons?.toArray();\r\n    if (buttons?.[next]) {\r\n      buttons[next].nativeElement.focus();\r\n    }\r\n  }\r\n}\r\n","<div class=\"fui-tab-group\">\r\n  <div class=\"fui-tab-header\" role=\"tablist\">\r\n    @for (tab of tabs(); track $index) {\r\n      <button\r\n        #tabButton\r\n        class=\"fui-tab-label\"\r\n        [class.fui-tab-label--active]=\"selectedIndex() === $index\"\r\n        [class.fui-tab-label--disabled]=\"tab.disabled()\"\r\n        [disabled]=\"tab.disabled()\"\r\n        [attr.aria-selected]=\"selectedIndex() === $index\"\r\n        [attr.tabindex]=\"selectedIndex() === $index ? 0 : -1\"\r\n        [attr.aria-controls]=\"tabGroupId + '-panel-' + $index\"\r\n        [id]=\"tabGroupId + '-tab-' + $index\"\r\n        role=\"tab\"\r\n        type=\"button\"\r\n        (click)=\"selectTab($index)\"\r\n        (keydown)=\"onKeydown($event, $index)\"\r\n      >\r\n        {{ tab.label() }}\r\n      </button>\r\n    }\r\n  </div>\r\n\r\n  <div class=\"fui-tab-content\">\r\n    @for (tab of tabs(); track $index) {\r\n      <div\r\n        class=\"fui-tab-panel\"\r\n        [class.fui-tab-panel--active]=\"selectedIndex() === $index\"\r\n        [attr.aria-labelledby]=\"tabGroupId + '-tab-' + $index\"\r\n        [id]=\"tabGroupId + '-panel-' + $index\"\r\n        role=\"tabpanel\"\r\n        [attr.tabindex]=\"selectedIndex() === $index ? 0 : null\"\r\n        [attr.aria-hidden]=\"selectedIndex() !== $index\"\r\n      >\r\n        @if (selectedIndex() === $index) {\r\n          <ng-container [ngTemplateOutlet]=\"tab.content\"></ng-container>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\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-tag.mjs

@@ -51,7 +51,7 @@ class FuiTagComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FuiTagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FuiTagComponent, isStandalone: true, selector: "fui-tag", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, removable: { classPropertyName: "removable", publicName: "removable", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removed: "removed", selectedChange: "selectedChange" }, host: { listeners: { "click": "onClick()", "keydown.enter": "onClick()", "keydown.space": "onSpace($event)" }, properties: { "class": "computedClasses()", "class.fui-tag--selected": "_selected()", "class.fui-tag--disabled": "disabled()", "attr.role": "selectable() ? \"option\" : null", "attr.aria-selected": "selectable() ? _selected() : null", "attr.aria-pressed": "selectable() ? _selected() : null", "attr.tabindex": "selectable() || removable() ? 0 : null" }, classAttribute: "fui-tag" }, ngImport: i0, template: "<span class=\"fui-tag__content\">\n  @if (icon()) {\n    <fui-icon class=\"fui-tag__icon\" [name]=\"icon()!\" size=\"sm\" aria-hidden=\"true\" />\n  }\n  <span class=\"fui-tag__label\">{{ label() }}</span>\n</span>\n\n@if (removable() && !disabled()) {\n  <button\n    class=\"fui-tag__remove\"\n    type=\"button\"\n    [attr.aria-label]=\"'Remove ' + label()\"\n    (click)=\"onRemove($event)\"\n    (keydown.enter)=\"onRemove($event)\"\n  >\n    <fui-icon name=\"x\" size=\"sm\" aria-hidden=\"true\" />\n  </button>\n}\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-tag{display:inline-flex;align-items:center;gap:var(--fui-gap-4, .25rem);border-radius:var(--fui-border-radius-pill, 999px);font-family:var(--fui-font-family-sans);font-weight:var(--fui-font-weight-medium, 500);cursor:default;-webkit-user-select:none;user-select:none;transition:background-color border-color color var(--fui-duration-fast-02, .15s) var(--fui-ease-standard) 0ms}.fui-tag--sm{padding:.125rem var(--fui-gap-8, .5rem);font-size:var(--fui-font-size-01);height:1.25rem}.fui-tag--md{padding:.25rem var(--fui-gap-12, .75rem);font-size:var(--fui-font-size-02);height:1.625rem}.fui-tag--primary{background-color:var(--fui-primary-20);color:var(--fui-primary-80)}.fui-tag--secondary{background-color:var(--fui-secondary-20);color:var(--fui-secondary-80)}.fui-tag--success{background-color:var(--fui-success-20);color:var(--fui-success-80)}.fui-tag--warning{background-color:var(--fui-warning-20);color:var(--fui-warning-80)}.fui-tag--danger{background-color:var(--fui-danger-20);color:var(--fui-danger-80)}.fui-tag--info{background-color:var(--fui-info-20);color:var(--fui-info-80)}.fui-tag--selected.fui-tag--primary{background-color:var(--fui-primary);color:var(--fui-white)}.fui-tag--selected.fui-tag--secondary{background-color:var(--fui-secondary-80);color:var(--fui-white)}.fui-tag--selected.fui-tag--success{background-color:var(--fui-success);color:var(--fui-white)}.fui-tag--selected.fui-tag--warning{background-color:var(--fui-warning);color:var(--fui-white)}.fui-tag--selected.fui-tag--danger{background-color:var(--fui-danger);color:var(--fui-white)}.fui-tag--selected.fui-tag--info{background-color:var(--fui-info);color:var(--fui-white)}.fui-tag__content{display:inline-flex;align-items:center;gap:var(--fui-gap-4, .25rem)}.fui-tag__remove{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;outline:none}.fui-tag__remove:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-tag__remove{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;width:1rem;height:1rem;margin-left:var(--fui-gap-4, .25rem)}.fui-tag__remove:hover{background-color:var(--fui-black-10)}.fui-tag[tabindex=\"0\"]{cursor:pointer}.fui-tag:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-tag--disabled{opacity:var(--fui-opacity-disabled, .38);cursor:not-allowed;pointer-events:none}\n"], dependencies: [{ 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: FuiTagComponent, isStandalone: true, selector: "fui-tag", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, removable: { classPropertyName: "removable", publicName: "removable", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { removed: "removed", selectedChange: "selectedChange" }, host: { listeners: { "click": "onClick()", "keydown.enter": "onClick()", "keydown.space": "onSpace($event)" }, properties: { "class": "computedClasses()", "class.fui-tag--selected": "_selected()", "class.fui-tag--disabled": "disabled()", "attr.role": "selectable() ? \"option\" : null", "attr.aria-selected": "selectable() ? _selected() : null", "attr.aria-pressed": "selectable() ? _selected() : null", "attr.tabindex": "selectable() || removable() ? 0 : null" }, classAttribute: "fui-tag" }, ngImport: i0, template: "<span class=\"fui-tag__content\">\r\n  @if (icon()) {\r\n    <fui-icon class=\"fui-tag__icon\" [name]=\"icon()!\" size=\"sm\" aria-hidden=\"true\" />\r\n  }\r\n  <span class=\"fui-tag__label\">{{ label() }}</span>\r\n</span>\r\n\r\n@if (removable() && !disabled()) {\r\n  <button\r\n    class=\"fui-tag__remove\"\r\n    type=\"button\"\r\n    [attr.aria-label]=\"'Remove ' + label()\"\r\n    (click)=\"onRemove($event)\"\r\n    (keydown.enter)=\"onRemove($event)\"\r\n  >\r\n    <fui-icon name=\"x\" size=\"sm\" aria-hidden=\"true\" />\r\n  </button>\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-tag{display:inline-flex;align-items:center;gap:var(--fui-gap-4, .25rem);border-radius:var(--fui-border-radius-pill, 999px);font-family:var(--fui-font-family-sans);font-weight:var(--fui-font-weight-medium, 500);cursor:default;-webkit-user-select:none;user-select:none;transition:background-color border-color color var(--fui-duration-fast-02, .15s) var(--fui-ease-standard) 0ms}.fui-tag--sm{padding:.125rem var(--fui-gap-8, .5rem);font-size:var(--fui-font-size-01);height:1.25rem}.fui-tag--md{padding:.25rem var(--fui-gap-12, .75rem);font-size:var(--fui-font-size-02);height:1.625rem}.fui-tag--primary{background-color:var(--fui-primary-20);color:var(--fui-primary-80)}.fui-tag--secondary{background-color:var(--fui-secondary-20);color:var(--fui-secondary-80)}.fui-tag--success{background-color:var(--fui-success-20);color:var(--fui-success-80)}.fui-tag--warning{background-color:var(--fui-warning-20);color:var(--fui-warning-80)}.fui-tag--danger{background-color:var(--fui-danger-20);color:var(--fui-danger-80)}.fui-tag--info{background-color:var(--fui-info-20);color:var(--fui-info-80)}.fui-tag--selected.fui-tag--primary{background-color:var(--fui-primary);color:var(--fui-white)}.fui-tag--selected.fui-tag--secondary{background-color:var(--fui-secondary-80);color:var(--fui-white)}.fui-tag--selected.fui-tag--success{background-color:var(--fui-success);color:var(--fui-white)}.fui-tag--selected.fui-tag--warning{background-color:var(--fui-warning);color:var(--fui-white)}.fui-tag--selected.fui-tag--danger{background-color:var(--fui-danger);color:var(--fui-white)}.fui-tag--selected.fui-tag--info{background-color:var(--fui-info);color:var(--fui-white)}.fui-tag__content{display:inline-flex;align-items:center;gap:var(--fui-gap-4, .25rem)}.fui-tag__remove{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;outline:none}.fui-tag__remove:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-tag__remove{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;width:1rem;height:1rem;margin-left:var(--fui-gap-4, .25rem)}.fui-tag__remove:hover{background-color:var(--fui-black-10)}.fui-tag[tabindex=\"0\"]{cursor:pointer}.fui-tag:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-tag--disabled{opacity:var(--fui-opacity-disabled, .38);cursor:not-allowed;pointer-events:none}\n"], dependencies: [{ 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: FuiTagComponent, decorators: [{
             type: Component,
@@ -67,7 +67,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImpor
                         '(click)': 'onClick()',
                         '(keydown.enter)': 'onClick()',
                         '(keydown.space)': 'onSpace($event)',
-                    }, template: "<span class=\"fui-tag__content\">\n  @if (icon()) {\n    <fui-icon class=\"fui-tag__icon\" [name]=\"icon()!\" size=\"sm\" aria-hidden=\"true\" />\n  }\n  <span class=\"fui-tag__label\">{{ label() }}</span>\n</span>\n\n@if (removable() && !disabled()) {\n  <button\n    class=\"fui-tag__remove\"\n    type=\"button\"\n    [attr.aria-label]=\"'Remove ' + label()\"\n    (click)=\"onRemove($event)\"\n    (keydown.enter)=\"onRemove($event)\"\n  >\n    <fui-icon name=\"x\" size=\"sm\" aria-hidden=\"true\" />\n  </button>\n}\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-tag{display:inline-flex;align-items:center;gap:var(--fui-gap-4, .25rem);border-radius:var(--fui-border-radius-pill, 999px);font-family:var(--fui-font-family-sans);font-weight:var(--fui-font-weight-medium, 500);cursor:default;-webkit-user-select:none;user-select:none;transition:background-color border-color color var(--fui-duration-fast-02, .15s) var(--fui-ease-standard) 0ms}.fui-tag--sm{padding:.125rem var(--fui-gap-8, .5rem);font-size:var(--fui-font-size-01);height:1.25rem}.fui-tag--md{padding:.25rem var(--fui-gap-12, .75rem);font-size:var(--fui-font-size-02);height:1.625rem}.fui-tag--primary{background-color:var(--fui-primary-20);color:var(--fui-primary-80)}.fui-tag--secondary{background-color:var(--fui-secondary-20);color:var(--fui-secondary-80)}.fui-tag--success{background-color:var(--fui-success-20);color:var(--fui-success-80)}.fui-tag--warning{background-color:var(--fui-warning-20);color:var(--fui-warning-80)}.fui-tag--danger{background-color:var(--fui-danger-20);color:var(--fui-danger-80)}.fui-tag--info{background-color:var(--fui-info-20);color:var(--fui-info-80)}.fui-tag--selected.fui-tag--primary{background-color:var(--fui-primary);color:var(--fui-white)}.fui-tag--selected.fui-tag--secondary{background-color:var(--fui-secondary-80);color:var(--fui-white)}.fui-tag--selected.fui-tag--success{background-color:var(--fui-success);color:var(--fui-white)}.fui-tag--selected.fui-tag--warning{background-color:var(--fui-warning);color:var(--fui-white)}.fui-tag--selected.fui-tag--danger{background-color:var(--fui-danger);color:var(--fui-white)}.fui-tag--selected.fui-tag--info{background-color:var(--fui-info);color:var(--fui-white)}.fui-tag__content{display:inline-flex;align-items:center;gap:var(--fui-gap-4, .25rem)}.fui-tag__remove{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;outline:none}.fui-tag__remove:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-tag__remove{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;width:1rem;height:1rem;margin-left:var(--fui-gap-4, .25rem)}.fui-tag__remove:hover{background-color:var(--fui-black-10)}.fui-tag[tabindex=\"0\"]{cursor:pointer}.fui-tag:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-tag--disabled{opacity:var(--fui-opacity-disabled, .38);cursor:not-allowed;pointer-events:none}\n"] }]
+                    }, template: "<span class=\"fui-tag__content\">\r\n  @if (icon()) {\r\n    <fui-icon class=\"fui-tag__icon\" [name]=\"icon()!\" size=\"sm\" aria-hidden=\"true\" />\r\n  }\r\n  <span class=\"fui-tag__label\">{{ label() }}</span>\r\n</span>\r\n\r\n@if (removable() && !disabled()) {\r\n  <button\r\n    class=\"fui-tag__remove\"\r\n    type=\"button\"\r\n    [attr.aria-label]=\"'Remove ' + label()\"\r\n    (click)=\"onRemove($event)\"\r\n    (keydown.enter)=\"onRemove($event)\"\r\n  >\r\n    <fui-icon name=\"x\" size=\"sm\" aria-hidden=\"true\" />\r\n  </button>\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-tag{display:inline-flex;align-items:center;gap:var(--fui-gap-4, .25rem);border-radius:var(--fui-border-radius-pill, 999px);font-family:var(--fui-font-family-sans);font-weight:var(--fui-font-weight-medium, 500);cursor:default;-webkit-user-select:none;user-select:none;transition:background-color border-color color var(--fui-duration-fast-02, .15s) var(--fui-ease-standard) 0ms}.fui-tag--sm{padding:.125rem var(--fui-gap-8, .5rem);font-size:var(--fui-font-size-01);height:1.25rem}.fui-tag--md{padding:.25rem var(--fui-gap-12, .75rem);font-size:var(--fui-font-size-02);height:1.625rem}.fui-tag--primary{background-color:var(--fui-primary-20);color:var(--fui-primary-80)}.fui-tag--secondary{background-color:var(--fui-secondary-20);color:var(--fui-secondary-80)}.fui-tag--success{background-color:var(--fui-success-20);color:var(--fui-success-80)}.fui-tag--warning{background-color:var(--fui-warning-20);color:var(--fui-warning-80)}.fui-tag--danger{background-color:var(--fui-danger-20);color:var(--fui-danger-80)}.fui-tag--info{background-color:var(--fui-info-20);color:var(--fui-info-80)}.fui-tag--selected.fui-tag--primary{background-color:var(--fui-primary);color:var(--fui-white)}.fui-tag--selected.fui-tag--secondary{background-color:var(--fui-secondary-80);color:var(--fui-white)}.fui-tag--selected.fui-tag--success{background-color:var(--fui-success);color:var(--fui-white)}.fui-tag--selected.fui-tag--warning{background-color:var(--fui-warning);color:var(--fui-white)}.fui-tag--selected.fui-tag--danger{background-color:var(--fui-danger);color:var(--fui-white)}.fui-tag--selected.fui-tag--info{background-color:var(--fui-info);color:var(--fui-white)}.fui-tag__content{display:inline-flex;align-items:center;gap:var(--fui-gap-4, .25rem)}.fui-tag__remove{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;outline:none}.fui-tag__remove:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-tag__remove{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;width:1rem;height:1rem;margin-left:var(--fui-gap-4, .25rem)}.fui-tag__remove:hover{background-color:var(--fui-black-10)}.fui-tag[tabindex=\"0\"]{cursor:pointer}.fui-tag:focus-visible{outline:2px solid var(--fui-primary);outline-offset:2px}.fui-tag--disabled{opacity:var(--fui-opacity-disabled, .38);cursor:not-allowed;pointer-events:none}\n"] }]
         }], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], removable: [{ type: i0.Input, args: [{ isSignal: true, alias: "removable", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], removed: [{ type: i0.Output, args: ["removed"] }], selectedChange: [{ type: i0.Output, args: ["selectedChange"] }] } });
 
 /**

package/fesm2022/raintonic-formaui-components-tag.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"raintonic-formaui-components-tag.mjs","sources":["../../../lib/components/tag/tag.types.ts","../../../lib/components/tag/tag.component.ts","../../../lib/components/tag/tag.component.html","../../../lib/components/tag/raintonic-formaui-components-tag.ts"],"sourcesContent":["export type FuiTagVariant = 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info';\nexport type FuiTagSize = 'sm' | 'md';\n\nexport const FUI_TAG_VARIANTS: readonly FuiTagVariant[] = [\n  'primary',\n  'secondary',\n  'success',\n  'warning',\n  'danger',\n  'info',\n] as const;\nexport const FUI_TAG_SIZES: readonly FuiTagSize[] = ['sm', 'md'] as const;\n\nexport interface FuiTagRemoveEvent {\n  tag: unknown;\n}\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  ViewEncapsulation,\n  computed,\n  effect,\n  input,\n  output,\n  signal,\n  booleanAttribute,\n} from '@angular/core';\nimport { FuiIconComponent } from '@raintonic/formaui/components/icon';\nimport { FuiTagVariant, FuiTagSize, FUI_TAG_VARIANTS, FuiTagRemoveEvent } from './tag.types';\n\n@Component({\n  selector: 'fui-tag',\n  standalone: true,\n  imports: [FuiIconComponent],\n  templateUrl: './tag.component.html',\n  styleUrls: ['./tag.component.scss'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    class: 'fui-tag',\n    '[class]': 'computedClasses()',\n    '[class.fui-tag--selected]': '_selected()',\n    '[class.fui-tag--disabled]': 'disabled()',\n    '[attr.role]': 'selectable() ? \"option\" : null',\n    '[attr.aria-selected]': 'selectable() ? _selected() : null',\n    '[attr.aria-pressed]': 'selectable() ? _selected() : null',\n    '[attr.tabindex]': 'selectable() || removable() ? 0 : null',\n    '(click)': 'onClick()',\n    '(keydown.enter)': 'onClick()',\n    '(keydown.space)': 'onSpace($event)',\n  },\n})\nexport class FuiTagComponent {\n  readonly label = input.required<string>();\n  readonly variant = input<FuiTagVariant, FuiTagVariant | string>('primary', {\n    transform: (v) => ((FUI_TAG_VARIANTS as readonly string[]).includes(v) ? (v as FuiTagVariant) : 'primary'),\n  });\n  readonly size = input<FuiTagSize>('md');\n  readonly icon = input<string | null>(null);\n  readonly removable = input(false);\n  readonly selectable = input(false);\n  readonly selected = input(false);\n  readonly disabled = input<boolean, unknown>(false, { transform: booleanAttribute });\n\n  readonly removed = output<FuiTagRemoveEvent>();\n  readonly selectedChange = output<boolean>();\n\n  readonly _selected = signal(false);\n\n  readonly computedClasses = computed(() => {\n    return `fui-tag fui-tag--${this.variant()} fui-tag--${this.size()}`;\n  });\n\n  constructor() {\n    effect(() => {\n      this._selected.set(this.selected());\n    });\n  }\n\n  onClick(): void {\n    if (this.disabled()) return;\n    if (this.selectable()) {\n      this._selected.update((v) => !v);\n      this.selectedChange.emit(this._selected());\n    }\n  }\n\n  onSpace(event: Event): void {\n    event.preventDefault();\n    this.onClick();\n  }\n\n  onRemove(event: Event): void {\n    event.stopPropagation();\n    if (!this.disabled()) {\n      this.removed.emit({ tag: this });\n    }\n  }\n}\n","<span class=\"fui-tag__content\">\n  @if (icon()) {\n    <fui-icon class=\"fui-tag__icon\" [name]=\"icon()!\" size=\"sm\" aria-hidden=\"true\" />\n  }\n  <span class=\"fui-tag__label\">{{ label() }}</span>\n</span>\n\n@if (removable() && !disabled()) {\n  <button\n    class=\"fui-tag__remove\"\n    type=\"button\"\n    [attr.aria-label]=\"'Remove ' + label()\"\n    (click)=\"onRemove($event)\"\n    (keydown.enter)=\"onRemove($event)\"\n  >\n    <fui-icon name=\"x\" size=\"sm\" aria-hidden=\"true\" />\n  </button>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"raintonic-formaui-components-tag.mjs","sources":["../../../lib/components/tag/tag.types.ts","../../../lib/components/tag/tag.component.ts","../../../lib/components/tag/tag.component.html","../../../lib/components/tag/raintonic-formaui-components-tag.ts"],"sourcesContent":["export type FuiTagVariant = 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info';\r\nexport type FuiTagSize = 'sm' | 'md';\r\n\r\nexport const FUI_TAG_VARIANTS: readonly FuiTagVariant[] = [\r\n  'primary',\r\n  'secondary',\r\n  'success',\r\n  'warning',\r\n  'danger',\r\n  'info',\r\n] as const;\r\nexport const FUI_TAG_SIZES: readonly FuiTagSize[] = ['sm', 'md'] as const;\r\n\r\nexport interface FuiTagRemoveEvent {\r\n  tag: unknown;\r\n}\r\n","import {\r\n  ChangeDetectionStrategy,\r\n  Component,\r\n  ViewEncapsulation,\r\n  computed,\r\n  effect,\r\n  input,\r\n  output,\r\n  signal,\r\n  booleanAttribute,\r\n} from '@angular/core';\r\nimport { FuiIconComponent } from '@raintonic/formaui/components/icon';\r\nimport { FuiTagVariant, FuiTagSize, FUI_TAG_VARIANTS, FuiTagRemoveEvent } from './tag.types';\r\n\r\n@Component({\r\n  selector: 'fui-tag',\r\n  standalone: true,\r\n  imports: [FuiIconComponent],\r\n  templateUrl: './tag.component.html',\r\n  styleUrls: ['./tag.component.scss'],\r\n  changeDetection: ChangeDetectionStrategy.OnPush,\r\n  encapsulation: ViewEncapsulation.None,\r\n  host: {\r\n    class: 'fui-tag',\r\n    '[class]': 'computedClasses()',\r\n    '[class.fui-tag--selected]': '_selected()',\r\n    '[class.fui-tag--disabled]': 'disabled()',\r\n    '[attr.role]': 'selectable() ? \"option\" : null',\r\n    '[attr.aria-selected]': 'selectable() ? _selected() : null',\r\n    '[attr.aria-pressed]': 'selectable() ? _selected() : null',\r\n    '[attr.tabindex]': 'selectable() || removable() ? 0 : null',\r\n    '(click)': 'onClick()',\r\n    '(keydown.enter)': 'onClick()',\r\n    '(keydown.space)': 'onSpace($event)',\r\n  },\r\n})\r\nexport class FuiTagComponent {\r\n  readonly label = input.required<string>();\r\n  readonly variant = input<FuiTagVariant, FuiTagVariant | string>('primary', {\r\n    transform: (v) => ((FUI_TAG_VARIANTS as readonly string[]).includes(v) ? (v as FuiTagVariant) : 'primary'),\r\n  });\r\n  readonly size = input<FuiTagSize>('md');\r\n  readonly icon = input<string | null>(null);\r\n  readonly removable = input(false);\r\n  readonly selectable = input(false);\r\n  readonly selected = input(false);\r\n  readonly disabled = input<boolean, unknown>(false, { transform: booleanAttribute });\r\n\r\n  readonly removed = output<FuiTagRemoveEvent>();\r\n  readonly selectedChange = output<boolean>();\r\n\r\n  readonly _selected = signal(false);\r\n\r\n  readonly computedClasses = computed(() => {\r\n    return `fui-tag fui-tag--${this.variant()} fui-tag--${this.size()}`;\r\n  });\r\n\r\n  constructor() {\r\n    effect(() => {\r\n      this._selected.set(this.selected());\r\n    });\r\n  }\r\n\r\n  onClick(): void {\r\n    if (this.disabled()) return;\r\n    if (this.selectable()) {\r\n      this._selected.update((v) => !v);\r\n      this.selectedChange.emit(this._selected());\r\n    }\r\n  }\r\n\r\n  onSpace(event: Event): void {\r\n    event.preventDefault();\r\n    this.onClick();\r\n  }\r\n\r\n  onRemove(event: Event): void {\r\n    event.stopPropagation();\r\n    if (!this.disabled()) {\r\n      this.removed.emit({ tag: this });\r\n    }\r\n  }\r\n}\r\n","<span class=\"fui-tag__content\">\r\n  @if (icon()) {\r\n    <fui-icon class=\"fui-tag__icon\" [name]=\"icon()!\" size=\"sm\" aria-hidden=\"true\" />\r\n  }\r\n  <span class=\"fui-tag__label\">{{ label() }}</span>\r\n</span>\r\n\r\n@if (removable() && !disabled()) {\r\n  <button\r\n    class=\"fui-tag__remove\"\r\n    type=\"button\"\r\n    [attr.aria-label]=\"'Remove ' + label()\"\r\n    (click)=\"onRemove($event)\"\r\n    (keydown.enter)=\"onRemove($event)\"\r\n  >\r\n    <fui-icon name=\"x\" size=\"sm\" aria-hidden=\"true\" />\r\n  </button>\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}