@agorapulse/ui-components 20.3.32 → 20.3.34

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":"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"}
+{"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,9 +57,11 @@ type NavSelectorBaseNode = {
  */
 type NavSelectorLeafAction = {
     /** Unique identifier of the action, used for click tracking */
-    id: string;
+    id: string | null;
     /** 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 */
@@ -167,9 +169,11 @@ type NodeAccessibility = {
 };
 type InternalNavSelectorLeafAction = {
     /** Unique identifier of the action, used for click tracking */
-    id: string;
+    id: string | null;
     /** 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.32",
+  "version": "20.3.34",
   "author": "Benoit Hediard",
   "repository": {
     "type": "git",

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;