@agorapulse/ui-components 20.3.31 → 20.3.33

package/fesm2022/agorapulse-ui-components-split-button.mjs

@@ -1,124 +1,92 @@
+import { ActionDropdownTriggerDirective } from '@agorapulse/ui-components';
 import * as i1 from '@agorapulse/ui-components/directives';
 import { BaseButtonDirective } from '@agorapulse/ui-components/directives';
-import { SymbolRegistry, apChevronDown, SymbolComponent } from '@agorapulse/ui-symbol';
+import { UI_COMPONENTS_SYMBOLS } from '@agorapulse/ui-components/providers';
+import { SymbolRegistry, SymbolComponent, apChevronDown } from '@agorapulse/ui-symbol';
 import * as i0 from '@angular/core';
-import { inject, input, EventEmitter, booleanAttribute, HostListener, Output, ContentChild, ViewChild, Input, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { inject, input, booleanAttribute, output, viewChild, contentChild, effect, HostListener, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
 import * as i2 from '@angular/material/menu';
 import { MatMenuModule } from '@angular/material/menu';
-import { UI_COMPONENTS_SYMBOLS } from '@agorapulse/ui-components/providers';
 
 let id = 1;
 class SplitButtonComponent {
     symbolRegistry = inject(SymbolRegistry);
     baseButtonDirective = inject(BaseButtonDirective, { self: true });
-    buttonElement;
-    disabled = false;
-    name = '';
-    config;
-    menuTrigger = null;
-    splitDisabled = false;
-    symbolPosition = 'right';
-    splitButtonDataTest = undefined;
+    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
+    config = input({ style: 'primary', color: 'orange' }, ...(ngDevMode ? [{ debugName: "config" }] : []));
+    actionDropdownTrigger = input(...(ngDevMode ? [undefined, { debugName: "actionDropdownTrigger" }] : []));
+    /** @deprecated use actionDropdownTrigger instead */
+    menuTrigger = input(null, ...(ngDevMode ? [{ debugName: "menuTrigger" }] : []));
+    splitDisabled = input(false, ...(ngDevMode ? [{ debugName: "splitDisabled" }] : []));
+    symbolPosition = input('right', ...(ngDevMode ? [{ debugName: "symbolPosition" }] : []));
+    splitButtonDataTest = input(undefined, ...(ngDevMode ? [{ debugName: "splitButtonDataTest" }] : []));
     symbolId = input(...(ngDevMode ? [undefined, { debugName: "symbolId" }] : []));
-    splitButtonElement;
-    symbolComponent;
-    menuOpened = new EventEmitter();
-    menuClosed = new EventEmitter();
-    mainButtonClick = new EventEmitter();
+    name = input(...(ngDevMode ? [undefined, { debugName: "name" }] : []));
+    menuOpened = output();
+    menuClosed = output();
+    mainButtonClick = output();
     // eslint-disable-next-line @angular-eslint/no-output-native
-    focus = new EventEmitter();
+    focus = output();
     // eslint-disable-next-line @angular-eslint/no-output-native
-    blur = new EventEmitter();
+    blur = output();
+    buttonElement = viewChild.required('button');
+    splitButtonElement = viewChild.required('splitButton');
+    symbolComponent = contentChild(SymbolComponent, ...(ngDevMode ? [{ debugName: "symbolComponent" }] : []));
     id;
     menuOpen = false;
     constructor() {
         this.symbolRegistry.registerSymbols([apChevronDown]);
         this.symbolRegistry.withSymbols(...(inject(UI_COMPONENTS_SYMBOLS, { optional: true })?.flat() ?? []));
+        effect(() => {
+            const symbolComp = this.symbolComponent();
+            if (symbolComp) {
+                symbolComp.size.set('sm');
+            }
+        });
     }
     ngAfterViewInit() {
         this.id = this.baseButtonDirective.hostId ?? `ap-split-button-${id++}`;
     }
-    ngAfterContentInit() {
-        if (this.symbolComponent) {
-            this.symbolComponent.size.set('sm');
-        }
-    }
     onSplitButtonClickHandle($event) {
         $event.stopImmediatePropagation();
     }
     handleMenuOpened() {
         this.menuOpened.emit();
         this.menuOpen = true;
-        this.buttonElement.nativeElement.blur();
-        this.splitButtonElement.nativeElement.blur();
+        this.buttonElement().nativeElement.blur();
+        this.splitButtonElement().nativeElement.blur();
     }
     handleMenuClosed() {
         this.menuClosed.emit();
         this.menuOpen = false;
-        this.buttonElement.nativeElement.blur();
-        this.splitButtonElement.nativeElement.blur();
+        this.buttonElement().nativeElement.blur();
+        this.splitButtonElement().nativeElement.blur();
     }
     focused = false;
     onClickHandle($event) {
-        if (this.disabled) {
+        if (this.disabled()) {
             return;
         }
         $event.stopImmediatePropagation();
         this.mainButtonClick.emit($event);
-        this.buttonElement.nativeElement.blur();
+        this.buttonElement().nativeElement.blur();
         this.blur.emit($event);
     }
     onSpaceKeyUp(event) {
         if (this.focused) {
             event.preventDefault();
-            this.buttonElement.nativeElement.click();
+            this.buttonElement().nativeElement.click();
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: SplitButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: SplitButtonComponent, isStandalone: true, selector: "ap-split-button", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: false, isRequired: true, transformFunction: null }, menuTrigger: { classPropertyName: "menuTrigger", publicName: "menuTrigger", isSignal: false, isRequired: false, transformFunction: null }, splitDisabled: { classPropertyName: "splitDisabled", publicName: "splitDisabled", isSignal: false, isRequired: false, transformFunction: null }, symbolPosition: { classPropertyName: "symbolPosition", publicName: "symbolPosition", isSignal: false, isRequired: false, transformFunction: null }, splitButtonDataTest: { classPropertyName: "splitButtonDataTest", publicName: "splitButtonDataTest", isSignal: false, isRequired: false, transformFunction: null }, symbolId: { classPropertyName: "symbolId", publicName: "symbolId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { menuOpened: "menuOpened", menuClosed: "menuClosed", mainButtonClick: "mainButtonClick", focus: "focus", blur: "blur" }, host: { listeners: { "window:keyup.space": "onSpaceKeyUp($event)" }, properties: { "attr.disabled": "(disabled && splitDisabled)  || null" } }, queries: [{ propertyName: "symbolComponent", first: true, predicate: SymbolComponent, descendants: true }], viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true }, { propertyName: "splitButtonElement", first: true, predicate: ["splitButton"], descendants: true }], hostDirectives: [{ directive: i1.BaseButtonDirective }], ngImport: i0, template: "<button\n    #button\n    type=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [id]=\"id\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"focus.emit($event)\"\n    (blur)=\"blur.emit($event)\">\n    <ng-content select=\"span\" />\n    @if (symbolId()) {\n        <ap-symbol [symbolId]=\"symbolId()\" />\n    } @else {\n        <ng-content select=\"ap-symbol\" />\n    }\n</button>\n<button\n    #splitButton\n    type=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [disabled]=\"splitDisabled\"\n    [id]=\"id + '-split'\"\n    [attr.aria-labelledby]=\"id + '-split ' + id\"\n    [attr.data-test]=\"splitButtonDataTest ?? name + '-split'\"\n    [matMenuTriggerFor]=\"menuTrigger\"\n    (click)=\"onSplitButtonClickHandle($event)\"\n    (menuClosed)=\"handleMenuClosed()\"\n    (menuOpened)=\"handleMenuOpened()\">\n    <ap-symbol\n        symbolId=\"chevron-down\"\n        size=\"sm\"\n        [class.opened]=\"menuOpen\" />\n    <span class=\"visually-hidden\">Toggle</span>\n</button>\n", styles: ["ap-split-button{--loading-bar-width: 50px;display:inline-flex;gap:1px;position:relative}ap-split-button[disabled]{pointer-events:none}ap-split-button button{border:none;position:relative;padding:var(--comp-split-button-padding-horizontal) var(--comp-split-button-padding-vertical);max-height:var(--comp-button-height);min-height:var(--comp-button-height);overflow:hidden;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:10px}ap-split-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-split-button button.inverse{flex-direction:row-reverse}ap-split-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-split-button button:disabled{pointer-events:none}@media (hover: hover){ap-split-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px;z-index:10}}ap-split-button button span{font-size:var(--comp-split-button-text-size);font-family:var(--comp-split-button-text-font-family);line-height:var(--comp-split-button-text-line-height);font-weight:var(--comp-split-button-text-weight);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}ap-split-button button.loading{pointer-events:none}ap-split-button button.primary span,ap-split-button button.primary ap-symbol{color:var(--ref-color-white)}ap-split-button button.primary.orange{background:var(--ref-color-orange-100)}ap-split-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-split-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-split-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-split-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-split-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-split-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-split-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-split-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-split-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-split-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-split-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-split-button button:first-child{border-top-left-radius:var(--comp-split-button-border-radius);border-bottom-left-radius:var(--comp-split-button-border-radius)}ap-split-button button:last-child{border-top-right-radius:var(--comp-split-button-border-radius);border-bottom-right-radius:var(--comp-split-button-border-radius);padding:var(--comp-split-button-padding-horizontal) 10px var(--comp-split-button-padding-horizontal) 10px}ap-split-button button ap-symbol{will-change:transform;transition:.2s ease-in-out}ap-split-button button ap-symbol.opened{transform:rotate(180deg)}.visually-hidden{width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;position:absolute!important}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: SplitButtonComponent, isStandalone: true, selector: "ap-split-button", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, actionDropdownTrigger: { classPropertyName: "actionDropdownTrigger", publicName: "actionDropdownTrigger", isSignal: true, isRequired: false, transformFunction: null }, menuTrigger: { classPropertyName: "menuTrigger", publicName: "menuTrigger", isSignal: true, isRequired: false, transformFunction: null }, splitDisabled: { classPropertyName: "splitDisabled", publicName: "splitDisabled", isSignal: true, isRequired: false, transformFunction: null }, symbolPosition: { classPropertyName: "symbolPosition", publicName: "symbolPosition", isSignal: true, isRequired: false, transformFunction: null }, splitButtonDataTest: { classPropertyName: "splitButtonDataTest", publicName: "splitButtonDataTest", isSignal: true, isRequired: false, transformFunction: null }, symbolId: { classPropertyName: "symbolId", publicName: "symbolId", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { menuOpened: "menuOpened", menuClosed: "menuClosed", mainButtonClick: "mainButtonClick", focus: "focus", blur: "blur" }, host: { listeners: { "window:keyup.space": "onSpaceKeyUp($event)" }, properties: { "attr.disabled": "(disabled() && splitDisabled())  || null" } }, queries: [{ propertyName: "symbolComponent", first: true, predicate: SymbolComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true, isSignal: true }, { propertyName: "splitButtonElement", first: true, predicate: ["splitButton"], descendants: true, isSignal: true }], hostDirectives: [{ directive: i1.BaseButtonDirective }], ngImport: i0, template: "<button\n    #button\n    type=\"button\"\n    [class.primary]=\"config().style === 'primary'\"\n    [class.orange]=\"config().color === 'orange'\"\n    [class.blue]=\"config().color === 'blue'\"\n    [class.inverse]=\"symbolPosition() === 'left'\"\n    [disabled]=\"disabled()\"\n    [name]=\"name()\"\n    [id]=\"id\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"focus.emit($event)\"\n    (blur)=\"blur.emit($event)\">\n    <ng-content select=\"span\" />\n    @if (symbolId()) {\n        <ap-symbol [symbolId]=\"symbolId()\" />\n    } @else {\n        <ng-content select=\"ap-symbol\" />\n    }\n</button>\n<button\n    #splitButton\n    type=\"button\"\n    [class.primary]=\"config().style === 'primary'\"\n    [class.orange]=\"config().color === 'orange'\"\n    [class.blue]=\"config().color === 'blue'\"\n    [disabled]=\"splitDisabled()\"\n    [id]=\"id + '-split'\"\n    [attr.aria-labelledby]=\"id + '-split ' + id\"\n    [attr.data-test]=\"splitButtonDataTest() ?? name() + '-split'\"\n    [apActionDropdownTrigger]=\"actionDropdownTrigger()\"\n    [matMenuTriggerFor]=\"menuTrigger()\"\n    (click)=\"onSplitButtonClickHandle($event)\"\n    (menuClosed)=\"handleMenuClosed()\"\n    (menuOpened)=\"handleMenuOpened()\">\n    <ap-symbol\n        symbolId=\"chevron-down\"\n        size=\"sm\"\n        [class.opened]=\"menuOpen\" />\n    <span class=\"visually-hidden\">Toggle</span>\n</button>\n", styles: ["ap-split-button{--loading-bar-width: 50px;display:inline-flex;gap:1px;position:relative}ap-split-button[disabled]{pointer-events:none}ap-split-button button{border:none;position:relative;padding:var(--comp-split-button-padding-horizontal) var(--comp-split-button-padding-vertical);max-height:var(--comp-button-height);min-height:var(--comp-button-height);overflow:hidden;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:10px}ap-split-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-split-button button.inverse{flex-direction:row-reverse}ap-split-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-split-button button:disabled{pointer-events:none}@media (hover: hover){ap-split-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px;z-index:10}}ap-split-button button span{font-size:var(--comp-split-button-text-size);font-family:var(--comp-split-button-text-font-family);line-height:var(--comp-split-button-text-line-height);font-weight:var(--comp-split-button-text-weight);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}ap-split-button button.loading{pointer-events:none}ap-split-button button.primary span,ap-split-button button.primary ap-symbol{color:var(--ref-color-white)}ap-split-button button.primary.orange{background:var(--ref-color-orange-100)}ap-split-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-split-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-split-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-split-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-split-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-split-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-split-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-split-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-split-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-split-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-split-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-split-button button:first-child{border-top-left-radius:var(--comp-split-button-border-radius);border-bottom-left-radius:var(--comp-split-button-border-radius)}ap-split-button button:last-child{border-top-right-radius:var(--comp-split-button-border-radius);border-bottom-right-radius:var(--comp-split-button-border-radius);padding:var(--comp-split-button-padding-horizontal) 10px var(--comp-split-button-padding-horizontal) 10px}ap-split-button button ap-symbol{will-change:transform;transition:.2s ease-in-out}ap-split-button button ap-symbol.opened{transform:rotate(180deg)}.visually-hidden{width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;position:absolute!important}\n"], dependencies: [{ kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: i2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: ActionDropdownTriggerDirective, selector: "[apActionDropdownTrigger]", inputs: ["apActionDropdownTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: SplitButtonComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-split-button', imports: [SymbolComponent, MatMenuModule], encapsulation: ViewEncapsulation.None, hostDirectives: [BaseButtonDirective], host: {
-                        '[attr.disabled]': '(disabled && splitDisabled)  || null',
-                    }, template: "<button\n    #button\n    type=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [id]=\"id\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"focus.emit($event)\"\n    (blur)=\"blur.emit($event)\">\n    <ng-content select=\"span\" />\n    @if (symbolId()) {\n        <ap-symbol [symbolId]=\"symbolId()\" />\n    } @else {\n        <ng-content select=\"ap-symbol\" />\n    }\n</button>\n<button\n    #splitButton\n    type=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [disabled]=\"splitDisabled\"\n    [id]=\"id + '-split'\"\n    [attr.aria-labelledby]=\"id + '-split ' + id\"\n    [attr.data-test]=\"splitButtonDataTest ?? name + '-split'\"\n    [matMenuTriggerFor]=\"menuTrigger\"\n    (click)=\"onSplitButtonClickHandle($event)\"\n    (menuClosed)=\"handleMenuClosed()\"\n    (menuOpened)=\"handleMenuOpened()\">\n    <ap-symbol\n        symbolId=\"chevron-down\"\n        size=\"sm\"\n        [class.opened]=\"menuOpen\" />\n    <span class=\"visually-hidden\">Toggle</span>\n</button>\n", styles: ["ap-split-button{--loading-bar-width: 50px;display:inline-flex;gap:1px;position:relative}ap-split-button[disabled]{pointer-events:none}ap-split-button button{border:none;position:relative;padding:var(--comp-split-button-padding-horizontal) var(--comp-split-button-padding-vertical);max-height:var(--comp-button-height);min-height:var(--comp-button-height);overflow:hidden;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:10px}ap-split-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-split-button button.inverse{flex-direction:row-reverse}ap-split-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-split-button button:disabled{pointer-events:none}@media (hover: hover){ap-split-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px;z-index:10}}ap-split-button button span{font-size:var(--comp-split-button-text-size);font-family:var(--comp-split-button-text-font-family);line-height:var(--comp-split-button-text-line-height);font-weight:var(--comp-split-button-text-weight);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}ap-split-button button.loading{pointer-events:none}ap-split-button button.primary span,ap-split-button button.primary ap-symbol{color:var(--ref-color-white)}ap-split-button button.primary.orange{background:var(--ref-color-orange-100)}ap-split-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-split-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-split-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-split-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-split-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-split-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-split-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-split-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-split-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-split-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-split-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-split-button button:first-child{border-top-left-radius:var(--comp-split-button-border-radius);border-bottom-left-radius:var(--comp-split-button-border-radius)}ap-split-button button:last-child{border-top-right-radius:var(--comp-split-button-border-radius);border-bottom-right-radius:var(--comp-split-button-border-radius);padding:var(--comp-split-button-padding-horizontal) 10px var(--comp-split-button-padding-horizontal) 10px}ap-split-button button ap-symbol{will-change:transform;transition:.2s ease-in-out}ap-split-button button ap-symbol.opened{transform:rotate(180deg)}.visually-hidden{width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;position:absolute!important}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { buttonElement: [{
-                type: ViewChild,
-                args: ['button']
-            }], disabled: [{
-                type: Input,
-                args: [{ transform: booleanAttribute }]
-            }], name: [{
-                type: Input,
-                args: [{ required: true }]
-            }], config: [{
-                type: Input,
-                args: [{ required: true }]
-            }], menuTrigger: [{
-                type: Input
-            }], splitDisabled: [{
-                type: Input
-            }], symbolPosition: [{
-                type: Input
-            }], splitButtonDataTest: [{
-                type: Input
-            }], splitButtonElement: [{
-                type: ViewChild,
-                args: ['splitButton']
-            }], symbolComponent: [{
-                type: ContentChild,
-                args: [SymbolComponent]
-            }], menuOpened: [{
-                type: Output
-            }], menuClosed: [{
-                type: Output
-            }], mainButtonClick: [{
-                type: Output
-            }], focus: [{
-                type: Output
-            }], blur: [{
-                type: Output
-            }], onSpaceKeyUp: [{
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-split-button', imports: [SymbolComponent, MatMenuModule, ActionDropdownTriggerDirective], encapsulation: ViewEncapsulation.None, hostDirectives: [BaseButtonDirective], host: {
+                        '[attr.disabled]': '(disabled() && splitDisabled())  || null',
+                    }, template: "<button\n    #button\n    type=\"button\"\n    [class.primary]=\"config().style === 'primary'\"\n    [class.orange]=\"config().color === 'orange'\"\n    [class.blue]=\"config().color === 'blue'\"\n    [class.inverse]=\"symbolPosition() === 'left'\"\n    [disabled]=\"disabled()\"\n    [name]=\"name()\"\n    [id]=\"id\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"focus.emit($event)\"\n    (blur)=\"blur.emit($event)\">\n    <ng-content select=\"span\" />\n    @if (symbolId()) {\n        <ap-symbol [symbolId]=\"symbolId()\" />\n    } @else {\n        <ng-content select=\"ap-symbol\" />\n    }\n</button>\n<button\n    #splitButton\n    type=\"button\"\n    [class.primary]=\"config().style === 'primary'\"\n    [class.orange]=\"config().color === 'orange'\"\n    [class.blue]=\"config().color === 'blue'\"\n    [disabled]=\"splitDisabled()\"\n    [id]=\"id + '-split'\"\n    [attr.aria-labelledby]=\"id + '-split ' + id\"\n    [attr.data-test]=\"splitButtonDataTest() ?? name() + '-split'\"\n    [apActionDropdownTrigger]=\"actionDropdownTrigger()\"\n    [matMenuTriggerFor]=\"menuTrigger()\"\n    (click)=\"onSplitButtonClickHandle($event)\"\n    (menuClosed)=\"handleMenuClosed()\"\n    (menuOpened)=\"handleMenuOpened()\">\n    <ap-symbol\n        symbolId=\"chevron-down\"\n        size=\"sm\"\n        [class.opened]=\"menuOpen\" />\n    <span class=\"visually-hidden\">Toggle</span>\n</button>\n", styles: ["ap-split-button{--loading-bar-width: 50px;display:inline-flex;gap:1px;position:relative}ap-split-button[disabled]{pointer-events:none}ap-split-button button{border:none;position:relative;padding:var(--comp-split-button-padding-horizontal) var(--comp-split-button-padding-vertical);max-height:var(--comp-button-height);min-height:var(--comp-button-height);overflow:hidden;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:10px}ap-split-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-split-button button.inverse{flex-direction:row-reverse}ap-split-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-split-button button:disabled{pointer-events:none}@media (hover: hover){ap-split-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px;z-index:10}}ap-split-button button span{font-size:var(--comp-split-button-text-size);font-family:var(--comp-split-button-text-font-family);line-height:var(--comp-split-button-text-line-height);font-weight:var(--comp-split-button-text-weight);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}ap-split-button button.loading{pointer-events:none}ap-split-button button.primary span,ap-split-button button.primary ap-symbol{color:var(--ref-color-white)}ap-split-button button.primary.orange{background:var(--ref-color-orange-100)}ap-split-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-split-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-split-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-split-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-split-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-split-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-split-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-split-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-split-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-split-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-split-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-split-button button:first-child{border-top-left-radius:var(--comp-split-button-border-radius);border-bottom-left-radius:var(--comp-split-button-border-radius)}ap-split-button button:last-child{border-top-right-radius:var(--comp-split-button-border-radius);border-bottom-right-radius:var(--comp-split-button-border-radius);padding:var(--comp-split-button-padding-horizontal) 10px var(--comp-split-button-padding-horizontal) 10px}ap-split-button button ap-symbol{will-change:transform;transition:.2s ease-in-out}ap-split-button button ap-symbol.opened{transform:rotate(180deg)}.visually-hidden{width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;position:absolute!important}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { onSpaceKeyUp: [{
                 type: HostListener,
                 args: ['window:keyup.space', ['$event']]
             }] } });

package/fesm2022/agorapulse-ui-components-split-button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"agorapulse-ui-components-split-button.mjs","sources":["../../../libs/ui-components/split-button/src/split-button.component.ts","../../../libs/ui-components/split-button/src/split-button.component.html","../../../libs/ui-components/split-button/src/agorapulse-ui-components-split-button.ts"],"sourcesContent":["import { BaseButtonDirective } from '@agorapulse/ui-components/directives';\nimport { agorapulseSymbol, apChevronDown, SymbolComponent, SymbolRegistry } from '@agorapulse/ui-symbol';\nimport {\n    AfterContentInit,\n    AfterViewInit,\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    ContentChild,\n    ElementRef,\n    EventEmitter,\n    HostListener,\n    inject,\n    input,\n    Input,\n    Output,\n    ViewChild,\n    ViewEncapsulation,\n} from '@angular/core';\nimport { MatMenu, MatMenuModule } from '@angular/material/menu';\nimport {UI_COMPONENTS_SYMBOLS} from \"@agorapulse/ui-components/providers\";\n\ntype SplitButtonConfig = { style: 'primary'; color: 'orange' | 'blue' };\n\nlet id = 1;\n\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-split-button',\n    styleUrls: ['./split-button.component.scss'],\n    imports: [SymbolComponent, MatMenuModule],\n    templateUrl: './split-button.component.html',\n    encapsulation: ViewEncapsulation.None,\n    hostDirectives: [BaseButtonDirective],\n    host: {\n        '[attr.disabled]': '(disabled && splitDisabled)  || null',\n    },\n})\nexport class SplitButtonComponent implements AfterContentInit, AfterViewInit {\n    private symbolRegistry: SymbolRegistry = inject(SymbolRegistry);\n    readonly baseButtonDirective: BaseButtonDirective = inject(BaseButtonDirective, { self: true });\n\n    @ViewChild('button') buttonElement!: ElementRef<HTMLButtonElement>;\n\n    @Input({ transform: booleanAttribute })\n    disabled: boolean = false;\n    @Input({ required: true })\n    name = '';\n    @Input({ required: true })\n    config!: SplitButtonConfig;\n    @Input() menuTrigger: MatMenu | null = null;\n    @Input() splitDisabled: boolean = false;\n    @Input() symbolPosition: 'left' | 'right' = 'right';\n    @Input() splitButtonDataTest: string | undefined = undefined;\n    symbolId = input<agorapulseSymbol>();\n\n    @ViewChild('splitButton') splitButtonElement!: ElementRef<HTMLButtonElement>;\n\n    @ContentChild(SymbolComponent) symbolComponent!: SymbolComponent;\n\n    @Output() menuOpened: EventEmitter<void> = new EventEmitter();\n    @Output() menuClosed: EventEmitter<void> = new EventEmitter();\n    @Output() mainButtonClick: EventEmitter<MouseEvent> = new EventEmitter();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() focus: EventEmitter<FocusEvent> = new EventEmitter();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    @Output() blur: EventEmitter<FocusEvent> = new EventEmitter();\n\n    id!: string;\n    menuOpen = false;\n\n    constructor() {\n        this.symbolRegistry.registerSymbols([apChevronDown]);\n        this.symbolRegistry.withSymbols(...(inject(UI_COMPONENTS_SYMBOLS, { optional: true })?.flat() ?? []));\n    }\n\n    ngAfterViewInit() {\n        this.id = this.baseButtonDirective.hostId ?? `ap-split-button-${id++}`;\n    }\n\n    ngAfterContentInit() {\n        if (this.symbolComponent) {\n            this.symbolComponent.size.set('sm');\n        }\n    }\n\n    onSplitButtonClickHandle($event: MouseEvent): void {\n        $event.stopImmediatePropagation();\n    }\n\n    handleMenuOpened(): void {\n        this.menuOpened.emit();\n        this.menuOpen = true;\n        this.buttonElement.nativeElement.blur();\n        this.splitButtonElement.nativeElement.blur();\n    }\n\n    handleMenuClosed(): void {\n        this.menuClosed.emit();\n        this.menuOpen = false;\n        this.buttonElement.nativeElement.blur();\n        this.splitButtonElement.nativeElement.blur();\n    }\n\n    focused: boolean = false;\n\n    onClickHandle($event: MouseEvent): void {\n        if (this.disabled) {\n            return;\n        }\n        $event.stopImmediatePropagation();\n        this.mainButtonClick.emit($event);\n        this.buttonElement.nativeElement.blur();\n        this.blur.emit($event);\n    }\n\n    @HostListener('window:keyup.space', ['$event'])\n    onSpaceKeyUp(event: KeyboardEvent) {\n        if (this.focused) {\n            event.preventDefault();\n            this.buttonElement.nativeElement.click();\n        }\n    }\n}\n","<button\n    #button\n    type=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [id]=\"id\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"focus.emit($event)\"\n    (blur)=\"blur.emit($event)\">\n    <ng-content select=\"span\" />\n    @if (symbolId()) {\n        <ap-symbol [symbolId]=\"symbolId()\" />\n    } @else {\n        <ng-content select=\"ap-symbol\" />\n    }\n</button>\n<button\n    #splitButton\n    type=\"button\"\n    [class.primary]=\"config.style === 'primary'\"\n    [class.orange]=\"config.color === 'orange'\"\n    [class.blue]=\"config.color === 'blue'\"\n    [disabled]=\"splitDisabled\"\n    [id]=\"id + '-split'\"\n    [attr.aria-labelledby]=\"id + '-split ' + id\"\n    [attr.data-test]=\"splitButtonDataTest ?? name + '-split'\"\n    [matMenuTriggerFor]=\"menuTrigger\"\n    (click)=\"onSplitButtonClickHandle($event)\"\n    (menuClosed)=\"handleMenuClosed()\"\n    (menuOpened)=\"handleMenuOpened()\">\n    <ap-symbol\n        symbolId=\"chevron-down\"\n        size=\"sm\"\n        [class.opened]=\"menuOpen\" />\n    <span class=\"visually-hidden\">Toggle</span>\n</button>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"agorapulse-ui-components-split-button.mjs","sources":["../../../libs/ui-components/split-button/src/split-button.component.ts","../../../libs/ui-components/split-button/src/split-button.component.html","../../../libs/ui-components/split-button/src/agorapulse-ui-components-split-button.ts"],"sourcesContent":["import { ActionDropdownComponent, ActionDropdownTriggerDirective } from '@agorapulse/ui-components';\nimport { BaseButtonDirective } from '@agorapulse/ui-components/directives';\nimport { UI_COMPONENTS_SYMBOLS } from '@agorapulse/ui-components/providers';\nimport { agorapulseSymbol, apChevronDown, SymbolComponent, SymbolRegistry } from '@agorapulse/ui-symbol';\nimport {\n    AfterViewInit,\n    booleanAttribute,\n    ChangeDetectionStrategy,\n    Component,\n    contentChild,\n    effect,\n    ElementRef,\n    HostListener,\n    inject,\n    input,\n    output,\n    viewChild,\n    ViewEncapsulation,\n} from '@angular/core';\nimport { MatMenu, MatMenuModule } from '@angular/material/menu';\n\ntype SplitButtonConfig = { style: 'primary'; color: 'orange' | 'blue' };\n\nlet id = 1;\n\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-split-button',\n    styleUrls: ['./split-button.component.scss'],\n    imports: [SymbolComponent, MatMenuModule, ActionDropdownTriggerDirective],\n    templateUrl: './split-button.component.html',\n    encapsulation: ViewEncapsulation.None,\n    hostDirectives: [BaseButtonDirective],\n    host: {\n        '[attr.disabled]': '(disabled() && splitDisabled())  || null',\n    },\n})\nexport class SplitButtonComponent implements AfterViewInit {\n    private symbolRegistry = inject(SymbolRegistry);\n    readonly baseButtonDirective = inject(BaseButtonDirective, { self: true });\n\n    disabled = input(false, { transform: booleanAttribute });\n    config = input<SplitButtonConfig>({ style: 'primary', color: 'orange' });\n    actionDropdownTrigger = input<ActionDropdownComponent>();\n    /** @deprecated use actionDropdownTrigger instead */\n    menuTrigger = input<MatMenu | null>(null);\n    splitDisabled = input(false);\n    symbolPosition = input<'left' | 'right'>('right');\n    splitButtonDataTest = input<string | undefined>(undefined);\n    symbolId = input<agorapulseSymbol>();\n    name = input<string>();\n\n    menuOpened = output<void>();\n    menuClosed = output<void>();\n    mainButtonClick = output<MouseEvent>();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    focus = output<FocusEvent>();\n    // eslint-disable-next-line @angular-eslint/no-output-native\n    blur = output<FocusEvent>();\n\n    buttonElement = viewChild.required<ElementRef<HTMLButtonElement>>('button');\n    splitButtonElement = viewChild.required<ElementRef<HTMLButtonElement>>('splitButton');\n    symbolComponent = contentChild(SymbolComponent);\n\n    id!: string;\n    menuOpen = false;\n\n    constructor() {\n        this.symbolRegistry.registerSymbols([apChevronDown]);\n        this.symbolRegistry.withSymbols(...(inject(UI_COMPONENTS_SYMBOLS, { optional: true })?.flat() ?? []));\n\n        effect(() => {\n            const symbolComp = this.symbolComponent();\n            if (symbolComp) {\n                symbolComp.size.set('sm');\n            }\n        });\n    }\n\n    ngAfterViewInit() {\n        this.id = this.baseButtonDirective.hostId ?? `ap-split-button-${id++}`;\n    }\n\n    onSplitButtonClickHandle($event: MouseEvent): void {\n        $event.stopImmediatePropagation();\n    }\n\n    handleMenuOpened(): void {\n        this.menuOpened.emit();\n        this.menuOpen = true;\n        this.buttonElement().nativeElement.blur();\n        this.splitButtonElement().nativeElement.blur();\n    }\n\n    handleMenuClosed(): void {\n        this.menuClosed.emit();\n        this.menuOpen = false;\n        this.buttonElement().nativeElement.blur();\n        this.splitButtonElement().nativeElement.blur();\n    }\n\n    focused: boolean = false;\n\n    onClickHandle($event: MouseEvent): void {\n        if (this.disabled()) {\n            return;\n        }\n        $event.stopImmediatePropagation();\n        this.mainButtonClick.emit($event);\n        this.buttonElement().nativeElement.blur();\n        this.blur.emit($event);\n    }\n\n    @HostListener('window:keyup.space', ['$event'])\n    onSpaceKeyUp(event: KeyboardEvent) {\n        if (this.focused) {\n            event.preventDefault();\n            this.buttonElement().nativeElement.click();\n        }\n    }\n}\n","<button\n    #button\n    type=\"button\"\n    [class.primary]=\"config().style === 'primary'\"\n    [class.orange]=\"config().color === 'orange'\"\n    [class.blue]=\"config().color === 'blue'\"\n    [class.inverse]=\"symbolPosition() === 'left'\"\n    [disabled]=\"disabled()\"\n    [name]=\"name()\"\n    [id]=\"id\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"focus.emit($event)\"\n    (blur)=\"blur.emit($event)\">\n    <ng-content select=\"span\" />\n    @if (symbolId()) {\n        <ap-symbol [symbolId]=\"symbolId()\" />\n    } @else {\n        <ng-content select=\"ap-symbol\" />\n    }\n</button>\n<button\n    #splitButton\n    type=\"button\"\n    [class.primary]=\"config().style === 'primary'\"\n    [class.orange]=\"config().color === 'orange'\"\n    [class.blue]=\"config().color === 'blue'\"\n    [disabled]=\"splitDisabled()\"\n    [id]=\"id + '-split'\"\n    [attr.aria-labelledby]=\"id + '-split ' + id\"\n    [attr.data-test]=\"splitButtonDataTest() ?? name() + '-split'\"\n    [apActionDropdownTrigger]=\"actionDropdownTrigger()\"\n    [matMenuTriggerFor]=\"menuTrigger()\"\n    (click)=\"onSplitButtonClickHandle($event)\"\n    (menuClosed)=\"handleMenuClosed()\"\n    (menuOpened)=\"handleMenuOpened()\">\n    <ap-symbol\n        symbolId=\"chevron-down\"\n        size=\"sm\"\n        [class.opened]=\"menuOpen\" />\n    <span class=\"visually-hidden\">Toggle</span>\n</button>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/agorapulse-ui-components-tabs.mjs

@@ -1,7 +1,8 @@
 import * as i0 from '@angular/core';
-import { input, signal, ChangeDetectionStrategy, Component, contentChildren, viewChild, output, linkedSignal, effect } from '@angular/core';
+import { input, signal, ChangeDetectionStrategy, Component, inject, contentChildren, viewChild, output, linkedSignal, effect } from '@angular/core';
 import { CounterComponent } from '@agorapulse/ui-components/counter';
-import { SymbolComponent, withSymbols } from '@agorapulse/ui-symbol';
+import { UI_COMPONENTS_SYMBOLS } from '@agorapulse/ui-components/providers';
+import { SymbolRegistry, SymbolComponent, withSymbols } from '@agorapulse/ui-symbol';
 import { apFeatureLock } from '@agorapulse/ui-symbol/icons';
 import { CommonModule } from '@angular/common';
 
@@ -22,6 +23,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
         }] });
 
 class TabsComponent {
+    symbolRegistry = inject(SymbolRegistry);
     tabs = contentChildren(TabComponent, ...(ngDevMode ? [{ debugName: "tabs" }] : []));
     indicator = viewChild('indicator', ...(ngDevMode ? [{ debugName: "indicator" }] : []));
     tabNav = viewChild('tabNav', ...(ngDevMode ? [{ debugName: "tabNav" }] : []));
@@ -41,6 +43,9 @@ class TabsComponent {
         });
         this.updateIndicatorPosition(activeIndex);
     }, ...(ngDevMode ? [{ debugName: "updateIndicatorPositionEffect" }] : []));
+    constructor() {
+        this.symbolRegistry.withSymbols(...(inject(UI_COMPONENTS_SYMBOLS, { optional: true })?.flat() ?? []));
+    }
     selectTab(index) {
         if (this.disabled() || index < 0 || index >= this.tabs().length) {
             return;
@@ -98,7 +103,7 @@ class TabsComponent {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: TabsComponent, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-tabs', imports: [CommonModule, CounterComponent, SymbolComponent], providers: [withSymbols(apFeatureLock)], template: "<div class=\"ap-tabs\">\n    <!-- Tab Navigation -->\n    <div\n        #tabNav\n        class=\"ap-tabs__nav\"\n        role=\"tablist\">\n        @for (tab of tabs(); track $index) {\n            <button\n                type=\"button\"\n                role=\"tab\"\n                class=\"ap-tabs__tab\"\n                [class.ap-tabs__tab--active]=\"activeTabIndex() === $index\"\n                [class.ap-tabs__tab--disabled]=\"tab.disabled()\"\n                [class.ap-tabs__tab--feature-locked]=\"tab.featureLocked()\"\n                [attr.aria-selected]=\"activeTabIndex() === $index\"\n                [attr.aria-controls]=\"componentId() + '-panel-' + $index\"\n                [attr.id]=\"componentId() + '-tab-' + $index\"\n                [attr.data-tab-index]=\"$index\"\n                [disabled]=\"disabled() || tab.disabled()\"\n                [tabindex]=\"disabled() || tab.disabled() ? -1 : 0\"\n                (click)=\"selectTab($index)\"\n                (keydown)=\"onKeyDown($event, $index)\">\n                <div class=\"ap-tabs__tab-content\">\n                    <div class=\"ap-tabs__tab-header\">\n                        @if (tab.symbolId()) {\n                            <ap-symbol\n                                class=\"ap-tabs__tab-icon\"\n                                size=\"sm\"\n                                [symbolId]=\"tab.symbolId()\"\n                                [color]=\"activeTabIndex() === $index ? (tab.featureLocked() ? 'purple' : 'blue') : 'basic-grey'\" />\n                        }\n                        <span class=\"ap-tabs__tab-label\">{{ tab.label() }}</span>\n                        @if (tab.featureLocked()) {\n                            <ap-symbol\n                                symbolId=\"feature-lock\"\n                                class=\"ap-tabs__tab-feature-lock\" />\n                        }\n                        @if (tab.counter() && !tab.featureLocked()) {\n                            <ap-counter [color]=\"activeTabIndex() === $index ? (tab.featureLocked() ? 'blue' : 'blue') : 'grey'\">\n                                {{ tab.counter() }}\n                            </ap-counter>\n                        }\n                    </div>\n                </div>\n            </button>\n        }\n        <!-- Sliding indicator -->\n        <div\n            #indicator\n            class=\"ap-tabs__indicator\"></div>\n    </div>\n\n    <!-- Tab Panels -->\n    <div class=\"ap-tabs__content\">\n        <ng-content />\n    </div>\n</div>\n", styles: [":host{display:block;width:100%}.ap-tabs{display:flex;flex-direction:column;width:100%}.ap-tabs .ap-tabs__nav{display:flex;align-items:center;border-bottom:1px solid var(--comp-tabs-border-color);position:relative}.ap-tabs .ap-tabs__tab{display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;font-family:var(--comp-tabs-text-font-family);text-align:center;position:relative;white-space:nowrap;padding:var(--comp-tabs-tab-padding);font-size:var(--comp-tabs-tab-font-size);line-height:var(--comp-tabs-tab-line-height);min-height:var(--comp-tabs-tab-min-height);color:var(--comp-tabs-tab-text-color-default)}.ap-tabs .ap-tabs__tab .ap-tabs__tab-content{display:flex;flex-direction:column;align-items:center;gap:var(--comp-tabs-tab-content-gap)}.ap-tabs .ap-tabs__tab .ap-tabs__tab-header{display:flex;align-items:center;gap:var(--comp-tabs-tab-header-gap)}.ap-tabs .ap-tabs__tab .ap-tabs__tab-label{font-weight:inherit;font-size:inherit;line-height:inherit}.ap-tabs .ap-tabs__tab .ap-tabs__tab-feature-lock{width:16px;height:16px;color:var(--comp-tabs-tab-feature-lock-color)}.ap-tabs .ap-tabs__tab:hover:not(:disabled):not(.ap-tabs .ap-tabs__tab.ap-tabs__tab--active){background-color:var(--comp-tabs-tab-hover-background-color)}.ap-tabs .ap-tabs__tab:focus{outline:none}.ap-tabs .ap-tabs__tab:focus-visible:not(.ap-tabs .ap-tabs__tab.ap-tabs__tab--active){outline:none;box-shadow:inset 0 0 0 2px var(--comp-tabs-tab-focus-color);border-radius:var(--comp-tabs-tab-focus-border-radius);background-color:var(--comp-tabs-tab-focus-background-color)}.ap-tabs .ap-tabs__tab:active:not(:disabled):not(.ap-tabs .ap-tabs__tab.ap-tabs__tab--active){background-color:var(--comp-tabs-tab-active-background-color)}.ap-tabs .ap-tabs__tab:disabled{cursor:not-allowed;opacity:.5}.ap-tabs .ap-tabs__tab.ap-tabs__tab--active{color:var(--comp-tabs-tab-text-color-active);text-shadow:.5px 0 0 currentColor}.ap-tabs .ap-tabs__tab.ap-tabs__tab--active:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--comp-tabs-tab-focus-color);border-radius:var(--comp-tabs-tab-focus-border-radius)}.ap-tabs .ap-tabs__tab.ap-tabs__tab--disabled{color:var(--comp-tabs-tab-text-color-disabled);cursor:not-allowed}.ap-tabs .ap-tabs__tab.ap-tabs__tab--feature-locked:hover:not(:disabled):not(.ap-tabs__tab--active){background-color:var(--comp-tabs-tab-feature-locked-hover-background-color)}.ap-tabs .ap-tabs__tab.ap-tabs__tab--feature-locked:focus-visible:not(.ap-tabs__tab--active){color:var(--comp-tabs-tab-text-color-feature-locked-focus);background-color:var(--comp-tabs-tab-feature-locked-focus-background-color)}.ap-tabs .ap-tabs__tab.ap-tabs__tab--feature-locked:active:not(:disabled):not(.ap-tabs__tab--active){background-color:var(--comp-tabs-tab-feature-locked-active-background-color)}.ap-tabs .ap-tabs__tab.ap-tabs__tab--feature-locked.ap-tabs__tab--active{color:var(--comp-tabs-tab-text-color-feature-locked-active);text-shadow:.5px 0 0 currentColor}.ap-tabs .ap-tabs__tab.ap-tabs__tab--feature-locked.ap-tabs__tab--active:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--comp-tabs-tab-focus-color);border-radius:var(--comp-tabs-tab-focus-border-radius)}.ap-tabs .ap-tabs__indicator{position:absolute;bottom:-1px;height:4px;background-color:var(--comp-tabs-tab-active-indicator-color);transition:transform .3s cubic-bezier(.4,0,.2,1),width .3s cubic-bezier(.4,0,.2,1),background-color .3s cubic-bezier(.4,0,.2,1);transform-origin:left}.ap-tabs .ap-tabs__content{flex:1;width:100%}\n"] }]
-        }] });
+        }], ctorParameters: () => [] });
 
 /**
  * Generated bundle index. Do not edit.

package/fesm2022/agorapulse-ui-components-tabs.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"agorapulse-ui-components-tabs.mjs","sources":["../../../libs/ui-components/tabs/src/tab/tab.component.ts","../../../libs/ui-components/tabs/src/tab/tab.component.html","../../../libs/ui-components/tabs/src/tabs.component.ts","../../../libs/ui-components/tabs/src/tabs.component.html","../../../libs/ui-components/tabs/src/agorapulse-ui-components-tabs.ts"],"sourcesContent":["import { agorapulseSymbol } from '@agorapulse/ui-symbol';\nimport { ChangeDetectionStrategy, Component, input, signal } from '@angular/core';\n\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-tab',\n    templateUrl: './tab.component.html',\n})\nexport class TabComponent {\n    label = input.required<string>();\n    counter = input<number>();\n    disabled = input(false);\n    featureLocked = input(false);\n    symbolId = input<agorapulseSymbol>();\n\n    isActive = signal(false);\n    tabIndex = signal(0);\n}\n","@if (isActive()) {\n    <div\n        role=\"tabpanel\"\n        class=\"ap-tab__panel\"\n        [attr.id]=\"'ap-tab-panel-' + tabIndex()\"\n        [attr.aria-labelledby]=\"'ap-tab-' + tabIndex()\">\n        <ng-content />\n    </div>\n}\n","import { CounterComponent } from '@agorapulse/ui-components/counter';\nimport { SymbolComponent, withSymbols } from '@agorapulse/ui-symbol';\nimport { apFeatureLock } from '@agorapulse/ui-symbol/icons';\nimport { CommonModule } from '@angular/common';\nimport {\n    ChangeDetectionStrategy,\n    Component,\n    contentChildren,\n    effect,\n    ElementRef,\n    input,\n    linkedSignal,\n    output,\n    signal,\n    viewChild,\n} from '@angular/core';\nimport { TabComponent } from './tab/tab.component';\n\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-tabs',\n    templateUrl: './tabs.component.html',\n    styleUrls: ['./tabs.component.scss'],\n    imports: [CommonModule, CounterComponent, SymbolComponent],\n    providers: [withSymbols(apFeatureLock)],\n})\nexport class TabsComponent {\n    tabs = contentChildren(TabComponent);\n    indicator = viewChild<ElementRef<HTMLElement>>('indicator');\n    tabNav = viewChild<ElementRef<HTMLElement>>('tabNav');\n\n    selectedIndex = input(0);\n    disabled = input(false);\n\n    tabChange = output<{ index: number; tab: TabComponent }>();\n\n    // Unique ID per component instance to prevent DOM ID conflicts\n    private static nextId = 0;\n    readonly componentId = signal(`ap-tabs-${TabsComponent.nextId++}`);\n\n    readonly activeTabIndex = linkedSignal(() => this.selectedIndex());\n\n    private readonly updateIndicatorPositionEffect = effect(() => {\n        const activeIndex = this.activeTabIndex();\n        const tabs = this.tabs();\n        tabs.forEach((tab, index) => {\n            tab.isActive.set(index === activeIndex);\n            tab.tabIndex.set(index);\n        });\n        this.updateIndicatorPosition(activeIndex);\n    });\n\n    selectTab(index: number): void {\n        if (this.disabled() || index < 0 || index >= this.tabs().length) {\n            return;\n        }\n\n        const tab = this.tabs()[index];\n        if (tab?.disabled()) {\n            return;\n        }\n\n        this.activeTabIndex.set(index);\n        this.tabChange.emit({ index, tab });\n    }\n\n    onKeyDown(event: KeyboardEvent, index: number): void {\n        switch (event.key) {\n            case 'Enter':\n            case ' ':\n                event.preventDefault();\n                this.selectTab(index);\n                break;\n        }\n    }\n\n    private focusTab(index: number): void {\n        const tabButton = document.querySelector(`[data-tab-index=\"${index}\"]`) as HTMLElement;\n        tabButton?.focus();\n    }\n\n    private updateIndicatorPosition(activeIndex: number): void {\n        const indicatorEl = this.indicator()?.nativeElement;\n        const tabNavEl = this.tabNav()?.nativeElement;\n\n        if (!indicatorEl || !tabNavEl) {\n            // If elements aren't ready, try again in the next tick\n            setTimeout(() => this.updateIndicatorPosition(activeIndex), 0);\n            return;\n        }\n\n        const activeTab = tabNavEl.querySelector(`[data-tab-index=\"${activeIndex}\"]`) as HTMLElement;\n        if (!activeTab) {\n            // If tab button isn't ready, try again in the next tick\n            setTimeout(() => this.updateIndicatorPosition(activeIndex), 0);\n            return;\n        }\n\n        const tabRect = activeTab.getBoundingClientRect();\n        const navRect = tabNavEl.getBoundingClientRect();\n\n        const left = tabRect.left - navRect.left;\n        const width = tabRect.width;\n\n        // Check if active tab is feature locked to change indicator color\n        const isFeatureLocked = this.tabs()[activeIndex]?.featureLocked();\n        const color = isFeatureLocked\n            ? 'var(--comp-tabs-tab-feature-locked-indicator-color)'\n            : 'var(--comp-tabs-tab-active-indicator-color)';\n\n        indicatorEl.style.transform = `translateX(${left}px)`;\n        indicatorEl.style.width = `${width}px`;\n        indicatorEl.style.backgroundColor = color;\n    }\n}\n","<div class=\"ap-tabs\">\n    <!-- Tab Navigation -->\n    <div\n        #tabNav\n        class=\"ap-tabs__nav\"\n        role=\"tablist\">\n        @for (tab of tabs(); track $index) {\n            <button\n                type=\"button\"\n                role=\"tab\"\n                class=\"ap-tabs__tab\"\n                [class.ap-tabs__tab--active]=\"activeTabIndex() === $index\"\n                [class.ap-tabs__tab--disabled]=\"tab.disabled()\"\n                [class.ap-tabs__tab--feature-locked]=\"tab.featureLocked()\"\n                [attr.aria-selected]=\"activeTabIndex() === $index\"\n                [attr.aria-controls]=\"componentId() + '-panel-' + $index\"\n                [attr.id]=\"componentId() + '-tab-' + $index\"\n                [attr.data-tab-index]=\"$index\"\n                [disabled]=\"disabled() || tab.disabled()\"\n                [tabindex]=\"disabled() || tab.disabled() ? -1 : 0\"\n                (click)=\"selectTab($index)\"\n                (keydown)=\"onKeyDown($event, $index)\">\n                <div class=\"ap-tabs__tab-content\">\n                    <div class=\"ap-tabs__tab-header\">\n                        @if (tab.symbolId()) {\n                            <ap-symbol\n                                class=\"ap-tabs__tab-icon\"\n                                size=\"sm\"\n                                [symbolId]=\"tab.symbolId()\"\n                                [color]=\"activeTabIndex() === $index ? (tab.featureLocked() ? 'purple' : 'blue') : 'basic-grey'\" />\n                        }\n                        <span class=\"ap-tabs__tab-label\">{{ tab.label() }}</span>\n                        @if (tab.featureLocked()) {\n                            <ap-symbol\n                                symbolId=\"feature-lock\"\n                                class=\"ap-tabs__tab-feature-lock\" />\n                        }\n                        @if (tab.counter() && !tab.featureLocked()) {\n                            <ap-counter [color]=\"activeTabIndex() === $index ? (tab.featureLocked() ? 'blue' : 'blue') : 'grey'\">\n                                {{ tab.counter() }}\n                            </ap-counter>\n                        }\n                    </div>\n                </div>\n            </button>\n        }\n        <!-- Sliding indicator -->\n        <div\n            #indicator\n            class=\"ap-tabs__indicator\"></div>\n    </div>\n\n    <!-- Tab Panels -->\n    <div class=\"ap-tabs__content\">\n        <ng-content />\n    </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;MAQa,YAAY,CAAA;AACrB,IAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,gDAAU;IAChC,OAAO,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,SAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAU;AACzB,IAAA,QAAQ,GAAG,KAAK,CAAC,KAAK,oDAAC;AACvB,IAAA,aAAa,GAAG,KAAK,CAAC,KAAK,yDAAC;IAC5B,QAAQ,GAAG,KAAK,CAAA,IAAA,SAAA,GAAA,CAAA,SAAA,EAAA,EAAA,SAAA,EAAA,UAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAoB;AAEpC,IAAA,QAAQ,GAAG,MAAM,CAAC,KAAK,oDAAC;AACxB,IAAA,QAAQ,GAAG,MAAM,CAAC,CAAC,oDAAC;uGARX,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAZ,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,YAAY,qtBCRzB,mPASA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FDDa,YAAY,EAAA,UAAA,EAAA,CAAA;kBALxB,SAAS;sCACW,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,QAAQ,EAAA,QAAA,EAAA,mPAAA,EAAA;;;MEqBT,aAAa,CAAA;AACtB,IAAA,IAAI,GAAG,eAAe,CAAC,YAAY,gDAAC;AACpC,IAAA,SAAS,GAAG,SAAS,CAA0B,WAAW,qDAAC;AAC3D,IAAA,MAAM,GAAG,SAAS,CAA0B,QAAQ,kDAAC;AAErD,IAAA,aAAa,GAAG,KAAK,CAAC,CAAC,yDAAC;AACxB,IAAA,QAAQ,GAAG,KAAK,CAAC,KAAK,oDAAC;IAEvB,SAAS,GAAG,MAAM,EAAwC;;AAGlD,IAAA,OAAO,MAAM,GAAG,CAAC;IAChB,WAAW,GAAG,MAAM,CAAC,CAAA,QAAA,EAAW,aAAa,CAAC,MAAM,EAAE,CAAA,CAAE,EAAA,IAAA,SAAA,GAAA,CAAA,EAAA,SAAA,EAAA,aAAA,EAAA,CAAA,GAAA,EAAA,CAAA,CAAC;IAEzD,cAAc,GAAG,YAAY,CAAC,MAAM,IAAI,CAAC,aAAa,EAAE,CAAC;AAEjD,IAAA,6BAA6B,GAAG,MAAM,CAAC,MAAK;AACzD,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE;AACzC,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE;QACxB,IAAI,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,KAAK,KAAI;YACxB,GAAG,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,KAAK,WAAW,CAAC;AACvC,YAAA,GAAG,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC;AAC3B,QAAA,CAAC,CAAC;AACF,QAAA,IAAI,CAAC,uBAAuB,CAAC,WAAW,CAAC;AAC7C,IAAA,CAAC,yEAAC;AAEF,IAAA,SAAS,CAAC,KAAa,EAAA;AACnB,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,KAAK,GAAG,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,EAAE;YAC7D;QACJ;QAEA,MAAM,GAAG,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC;AAC9B,QAAA,IAAI,GAAG,EAAE,QAAQ,EAAE,EAAE;YACjB;QACJ;AAEA,QAAA,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,KAAK,CAAC;QAC9B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC;IACvC;IAEA,SAAS,CAAC,KAAoB,EAAE,KAAa,EAAA;AACzC,QAAA,QAAQ,KAAK,CAAC,GAAG;AACb,YAAA,KAAK,OAAO;AACZ,YAAA,KAAK,GAAG;gBACJ,KAAK,CAAC,cAAc,EAAE;AACtB,gBAAA,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC;gBACrB;;IAEZ;AAEQ,IAAA,QAAQ,CAAC,KAAa,EAAA;QAC1B,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAA,iBAAA,EAAoB,KAAK,CAAA,EAAA,CAAI,CAAgB;QACtF,SAAS,EAAE,KAAK,EAAE;IACtB;AAEQ,IAAA,uBAAuB,CAAC,WAAmB,EAAA;QAC/C,MAAM,WAAW,GAAG,IAAI,CAAC,SAAS,EAAE,EAAE,aAAa;QACnD,MAAM,QAAQ,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,aAAa;AAE7C,QAAA,IAAI,CAAC,WAAW,IAAI,CAAC,QAAQ,EAAE;;AAE3B,YAAA,UAAU,CAAC,MAAM,IAAI,CAAC,uBAAuB,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;YAC9D;QACJ;QAEA,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAA,iBAAA,EAAoB,WAAW,CAAA,EAAA,CAAI,CAAgB;QAC5F,IAAI,CAAC,SAAS,EAAE;;AAEZ,YAAA,UAAU,CAAC,MAAM,IAAI,CAAC,uBAAuB,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;YAC9D;QACJ;AAEA,QAAA,MAAM,OAAO,GAAG,SAAS,CAAC,qBAAqB,EAAE;AACjD,QAAA,MAAM,OAAO,GAAG,QAAQ,CAAC,qBAAqB,EAAE;QAEhD,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,GAAG,OAAO,CAAC,IAAI;AACxC,QAAA,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK;;AAG3B,QAAA,MAAM,eAAe,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,WAAW,CAAC,EAAE,aAAa,EAAE;QACjE,MAAM,KAAK,GAAG;AACV,cAAE;cACA,6CAA6C;QAEnD,WAAW,CAAC,KAAK,CAAC,SAAS,GAAG,CAAA,WAAA,EAAc,IAAI,KAAK;QACrD,WAAW,CAAC,KAAK,CAAC,KAAK,GAAG,CAAA,EAAG,KAAK,IAAI;AACtC,QAAA,WAAW,CAAC,KAAK,CAAC,eAAe,GAAG,KAAK;IAC7C;uGAvFS,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAb,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,aAAa,wXAFX,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,MAAA,EAAA,SAAA,EAGhB,YAAY,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,WAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,WAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,EAAA,EAAA,YAAA,EAAA,QAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,QAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC3BvC,2/EAyDA,EAAA,MAAA,EAAA,CAAA,s8GAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDlCc,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,gBAAgB,iHAAE,eAAe,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,OAAA,EAAA,MAAA,CAAA,EAAA,OAAA,EAAA,CAAA,YAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA;;2FAGhD,aAAa,EAAA,UAAA,EAAA,CAAA;kBARzB,SAAS;AACW,YAAA,IAAA,EAAA,CAAA,EAAA,eAAA,EAAA,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,SAAS,EAAA,OAAA,EAGV,CAAC,YAAY,EAAE,gBAAgB,EAAE,eAAe,CAAC,EAAA,SAAA,EAC/C,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,EAAA,QAAA,EAAA,2/EAAA,EAAA,MAAA,EAAA,CAAA,s8GAAA,CAAA,EAAA;;;AExB3C;;AAEG;;;;"}
+{"version":3,"file":"agorapulse-ui-components-tabs.mjs","sources":["../../../libs/ui-components/tabs/src/tab/tab.component.ts","../../../libs/ui-components/tabs/src/tab/tab.component.html","../../../libs/ui-components/tabs/src/tabs.component.ts","../../../libs/ui-components/tabs/src/tabs.component.html","../../../libs/ui-components/tabs/src/agorapulse-ui-components-tabs.ts"],"sourcesContent":["import { agorapulseSymbol } from '@agorapulse/ui-symbol';\nimport { ChangeDetectionStrategy, Component, input, signal } from '@angular/core';\n\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-tab',\n    templateUrl: './tab.component.html',\n})\nexport class TabComponent {\n    label = input.required<string>();\n    counter = input<number>();\n    disabled = input(false);\n    featureLocked = input(false);\n    symbolId = input<agorapulseSymbol>();\n\n    isActive = signal(false);\n    tabIndex = signal(0);\n}\n","@if (isActive()) {\n    <div\n        role=\"tabpanel\"\n        class=\"ap-tab__panel\"\n        [attr.id]=\"'ap-tab-panel-' + tabIndex()\"\n        [attr.aria-labelledby]=\"'ap-tab-' + tabIndex()\">\n        <ng-content />\n    </div>\n}\n","import { CounterComponent } from '@agorapulse/ui-components/counter';\nimport { UI_COMPONENTS_SYMBOLS } from '@agorapulse/ui-components/providers';\nimport { SymbolComponent, SymbolRegistry, withSymbols } from '@agorapulse/ui-symbol';\nimport { apFeatureLock } from '@agorapulse/ui-symbol/icons';\nimport { CommonModule } from '@angular/common';\nimport {\n    ChangeDetectionStrategy,\n    Component,\n    contentChildren,\n    effect,\n    ElementRef,\n    inject,\n    input,\n    linkedSignal,\n    output,\n    signal,\n    viewChild,\n} from '@angular/core';\nimport { TabComponent } from './tab/tab.component';\n\n@Component({\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    selector: 'ap-tabs',\n    templateUrl: './tabs.component.html',\n    styleUrls: ['./tabs.component.scss'],\n    imports: [CommonModule, CounterComponent, SymbolComponent],\n    providers: [withSymbols(apFeatureLock)],\n})\nexport class TabsComponent {\n    private readonly symbolRegistry = inject(SymbolRegistry);\n\n    tabs = contentChildren(TabComponent);\n    indicator = viewChild<ElementRef<HTMLElement>>('indicator');\n    tabNav = viewChild<ElementRef<HTMLElement>>('tabNav');\n\n    selectedIndex = input(0);\n    disabled = input(false);\n\n    tabChange = output<{ index: number; tab: TabComponent }>();\n\n    // Unique ID per component instance to prevent DOM ID conflicts\n    private static nextId = 0;\n    readonly componentId = signal(`ap-tabs-${TabsComponent.nextId++}`);\n\n    readonly activeTabIndex = linkedSignal(() => this.selectedIndex());\n\n    private readonly updateIndicatorPositionEffect = effect(() => {\n        const activeIndex = this.activeTabIndex();\n        const tabs = this.tabs();\n        tabs.forEach((tab, index) => {\n            tab.isActive.set(index === activeIndex);\n            tab.tabIndex.set(index);\n        });\n        this.updateIndicatorPosition(activeIndex);\n    });\n\n    constructor() {\n        this.symbolRegistry.withSymbols(...(inject(UI_COMPONENTS_SYMBOLS, { optional: true })?.flat() ?? []));\n    }\n\n    selectTab(index: number): void {\n        if (this.disabled() || index < 0 || index >= this.tabs().length) {\n            return;\n        }\n\n        const tab = this.tabs()[index];\n        if (tab?.disabled()) {\n            return;\n        }\n\n        this.activeTabIndex.set(index);\n        this.tabChange.emit({ index, tab });\n    }\n\n    onKeyDown(event: KeyboardEvent, index: number): void {\n        switch (event.key) {\n            case 'Enter':\n            case ' ':\n                event.preventDefault();\n                this.selectTab(index);\n                break;\n        }\n    }\n\n    private focusTab(index: number): void {\n        const tabButton = document.querySelector(`[data-tab-index=\"${index}\"]`) as HTMLElement;\n        tabButton?.focus();\n    }\n\n    private updateIndicatorPosition(activeIndex: number): void {\n        const indicatorEl = this.indicator()?.nativeElement;\n        const tabNavEl = this.tabNav()?.nativeElement;\n\n        if (!indicatorEl || !tabNavEl) {\n            // If elements aren't ready, try again in the next tick\n            setTimeout(() => this.updateIndicatorPosition(activeIndex), 0);\n            return;\n        }\n\n        const activeTab = tabNavEl.querySelector(`[data-tab-index=\"${activeIndex}\"]`) as HTMLElement;\n        if (!activeTab) {\n            // If tab button isn't ready, try again in the next tick\n            setTimeout(() => this.updateIndicatorPosition(activeIndex), 0);\n            return;\n        }\n\n        const tabRect = activeTab.getBoundingClientRect();\n        const navRect = tabNavEl.getBoundingClientRect();\n\n        const left = tabRect.left - navRect.left;\n        const width = tabRect.width;\n\n        // Check if active tab is feature locked to change indicator color\n        const isFeatureLocked = this.tabs()[activeIndex]?.featureLocked();\n        const color = isFeatureLocked\n            ? 'var(--comp-tabs-tab-feature-locked-indicator-color)'\n            : 'var(--comp-tabs-tab-active-indicator-color)';\n\n        indicatorEl.style.transform = `translateX(${left}px)`;\n        indicatorEl.style.width = `${width}px`;\n        indicatorEl.style.backgroundColor = color;\n    }\n}\n","<div class=\"ap-tabs\">\n    <!-- Tab Navigation -->\n    <div\n        #tabNav\n        class=\"ap-tabs__nav\"\n        role=\"tablist\">\n        @for (tab of tabs(); track $index) {\n            <button\n                type=\"button\"\n                role=\"tab\"\n                class=\"ap-tabs__tab\"\n                [class.ap-tabs__tab--active]=\"activeTabIndex() === $index\"\n                [class.ap-tabs__tab--disabled]=\"tab.disabled()\"\n                [class.ap-tabs__tab--feature-locked]=\"tab.featureLocked()\"\n                [attr.aria-selected]=\"activeTabIndex() === $index\"\n                [attr.aria-controls]=\"componentId() + '-panel-' + $index\"\n                [attr.id]=\"componentId() + '-tab-' + $index\"\n                [attr.data-tab-index]=\"$index\"\n                [disabled]=\"disabled() || tab.disabled()\"\n                [tabindex]=\"disabled() || tab.disabled() ? -1 : 0\"\n                (click)=\"selectTab($index)\"\n                (keydown)=\"onKeyDown($event, $index)\">\n                <div class=\"ap-tabs__tab-content\">\n                    <div class=\"ap-tabs__tab-header\">\n                        @if (tab.symbolId()) {\n                            <ap-symbol\n                                class=\"ap-tabs__tab-icon\"\n                                size=\"sm\"\n                                [symbolId]=\"tab.symbolId()\"\n                                [color]=\"activeTabIndex() === $index ? (tab.featureLocked() ? 'purple' : 'blue') : 'basic-grey'\" />\n                        }\n                        <span class=\"ap-tabs__tab-label\">{{ tab.label() }}</span>\n                        @if (tab.featureLocked()) {\n                            <ap-symbol\n                                symbolId=\"feature-lock\"\n                                class=\"ap-tabs__tab-feature-lock\" />\n                        }\n                        @if (tab.counter() && !tab.featureLocked()) {\n                            <ap-counter [color]=\"activeTabIndex() === $index ? (tab.featureLocked() ? 'blue' : 'blue') : 'grey'\">\n                                {{ tab.counter() }}\n                            </ap-counter>\n                        }\n                    </div>\n                </div>\n            </button>\n        }\n        <!-- Sliding indicator -->\n        <div\n            #indicator\n            class=\"ap-tabs__indicator\"></div>\n    </div>\n\n    <!-- Tab Panels -->\n    <div class=\"ap-tabs__content\">\n        <ng-content />\n    </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/nav-selector/index.d.ts

@@ -57,11 +57,9 @@ type NavSelectorBaseNode = {
  */
 type NavSelectorLeafAction = {
     /** Unique identifier of the action, used for click tracking */
-    id: string | null;
+    id: string;
     /** Action label to display */
     label: string;
-    /** Technical name of the action, used to identify the action */
-    name: string;
     /** Optional icon to display on the action */
     icon: string | null;
     /** Optional Status */
@@ -169,11 +167,9 @@ type NodeAccessibility = {
 };
 type InternalNavSelectorLeafAction = {
     /** Unique identifier of the action, used for click tracking */
-    id: string | null;
+    id: string;
     /** Action label to display */
     label: string;
-    /** Technical name of the action, used to identify the action */
-    name: string;
     /** Optional icon to display on the action */
     icon: string | null;
     /** Optional Status */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@agorapulse/ui-components",
   "description": "Agorapulse UI Components Library",
-  "version": "20.3.31",
+  "version": "20.3.33",
   "author": "Benoit Hediard",
   "repository": {
     "type": "git",

package/split-button/index.d.ts

@@ -1,5 +1,6 @@
-import * as i0 from '@angular/core';
-import { AfterContentInit, AfterViewInit, ElementRef, EventEmitter } from '@angular/core';
+import * as _angular_core from '@angular/core';
+import { AfterViewInit, ElementRef } from '@angular/core';
+import { ActionDropdownComponent } from '@agorapulse/ui-components';
 import * as i1 from '@agorapulse/ui-components/directives';
 import { BaseButtonDirective } from '@agorapulse/ui-components/directives';
 import { SymbolComponent } from '@agorapulse/ui-symbol';
@@ -9,39 +10,39 @@ type SplitButtonConfig = {
     style: 'primary';
     color: 'orange' | 'blue';
 };
-declare class SplitButtonComponent implements AfterContentInit, AfterViewInit {
+declare class SplitButtonComponent implements AfterViewInit {
     private symbolRegistry;
     readonly baseButtonDirective: BaseButtonDirective;
-    buttonElement: ElementRef<HTMLButtonElement>;
-    disabled: boolean;
-    name: string;
-    config: SplitButtonConfig;
-    menuTrigger: MatMenu | null;
-    splitDisabled: boolean;
-    symbolPosition: 'left' | 'right';
-    splitButtonDataTest: string | undefined;
-    symbolId: i0.InputSignal<string | undefined>;
-    splitButtonElement: ElementRef<HTMLButtonElement>;
-    symbolComponent: SymbolComponent;
-    menuOpened: EventEmitter<void>;
-    menuClosed: EventEmitter<void>;
-    mainButtonClick: EventEmitter<MouseEvent>;
-    focus: EventEmitter<FocusEvent>;
-    blur: EventEmitter<FocusEvent>;
+    disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    config: _angular_core.InputSignal<SplitButtonConfig>;
+    actionDropdownTrigger: _angular_core.InputSignal<ActionDropdownComponent | undefined>;
+    /** @deprecated use actionDropdownTrigger instead */
+    menuTrigger: _angular_core.InputSignal<MatMenu | null>;
+    splitDisabled: _angular_core.InputSignal<boolean>;
+    symbolPosition: _angular_core.InputSignal<"left" | "right">;
+    splitButtonDataTest: _angular_core.InputSignal<string | undefined>;
+    symbolId: _angular_core.InputSignal<string | undefined>;
+    name: _angular_core.InputSignal<string | undefined>;
+    menuOpened: _angular_core.OutputEmitterRef<void>;
+    menuClosed: _angular_core.OutputEmitterRef<void>;
+    mainButtonClick: _angular_core.OutputEmitterRef<MouseEvent>;
+    focus: _angular_core.OutputEmitterRef<FocusEvent>;
+    blur: _angular_core.OutputEmitterRef<FocusEvent>;
+    buttonElement: _angular_core.Signal<ElementRef<HTMLButtonElement>>;
+    splitButtonElement: _angular_core.Signal<ElementRef<HTMLButtonElement>>;
+    symbolComponent: _angular_core.Signal<SymbolComponent | undefined>;
     id: string;
     menuOpen: boolean;
     constructor();
     ngAfterViewInit(): void;
-    ngAfterContentInit(): void;
     onSplitButtonClickHandle($event: MouseEvent): void;
     handleMenuOpened(): void;
     handleMenuClosed(): void;
     focused: boolean;
     onClickHandle($event: MouseEvent): void;
     onSpaceKeyUp(event: KeyboardEvent): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SplitButtonComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SplitButtonComponent, "ap-split-button", never, { "disabled": { "alias": "disabled"; "required": false; }; "name": { "alias": "name"; "required": true; }; "config": { "alias": "config"; "required": true; }; "menuTrigger": { "alias": "menuTrigger"; "required": false; }; "splitDisabled": { "alias": "splitDisabled"; "required": false; }; "symbolPosition": { "alias": "symbolPosition"; "required": false; }; "splitButtonDataTest": { "alias": "splitButtonDataTest"; "required": false; }; "symbolId": { "alias": "symbolId"; "required": false; "isSignal": true; }; }, { "menuOpened": "menuOpened"; "menuClosed": "menuClosed"; "mainButtonClick": "mainButtonClick"; "focus": "focus"; "blur": "blur"; }, ["symbolComponent"], ["span", "ap-symbol"], true, [{ directive: typeof i1.BaseButtonDirective; inputs: {}; outputs: {}; }]>;
-    static ngAcceptInputType_disabled: unknown;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SplitButtonComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SplitButtonComponent, "ap-split-button", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "config": { "alias": "config"; "required": false; "isSignal": true; }; "actionDropdownTrigger": { "alias": "actionDropdownTrigger"; "required": false; "isSignal": true; }; "menuTrigger": { "alias": "menuTrigger"; "required": false; "isSignal": true; }; "splitDisabled": { "alias": "splitDisabled"; "required": false; "isSignal": true; }; "symbolPosition": { "alias": "symbolPosition"; "required": false; "isSignal": true; }; "splitButtonDataTest": { "alias": "splitButtonDataTest"; "required": false; "isSignal": true; }; "symbolId": { "alias": "symbolId"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, { "menuOpened": "menuOpened"; "menuClosed": "menuClosed"; "mainButtonClick": "mainButtonClick"; "focus": "focus"; "blur": "blur"; }, ["symbolComponent"], ["span", "ap-symbol"], true, [{ directive: typeof i1.BaseButtonDirective; inputs: {}; outputs: {}; }]>;
 }
 
 export { SplitButtonComponent };

package/tabs/index.d.ts

@@ -14,6 +14,7 @@ declare class TabComponent {
 }
 
 declare class TabsComponent {
+    private readonly symbolRegistry;
     tabs: _angular_core.Signal<readonly TabComponent[]>;
     indicator: _angular_core.Signal<ElementRef<HTMLElement> | undefined>;
     tabNav: _angular_core.Signal<ElementRef<HTMLElement> | undefined>;
@@ -27,6 +28,7 @@ declare class TabsComponent {
     readonly componentId: _angular_core.WritableSignal<string>;
     readonly activeTabIndex: _angular_core.WritableSignal<number>;
     private readonly updateIndicatorPositionEffect;
+    constructor();
     selectTab(index: number): void;
     onKeyDown(event: KeyboardEvent, index: number): void;
     private focusTab;