@agorapulse/ui-components 20.3.39 → 20.3.40

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 { 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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"}
+{"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 { UI_COMPONENTS_SYMBOLS } from '@agorapulse/ui-components/providers';\nimport { agorapulseSymbol, SymbolRegistry } from '@agorapulse/ui-symbol';\nimport { ChangeDetectionStrategy, Component, inject, 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    private readonly symbolRegistry = inject(SymbolRegistry);\n\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    constructor() {\n        this.symbolRegistry.withSymbols(...(inject(UI_COMPONENTS_SYMBOLS, { optional: true })?.flat() ?? []));\n    }\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/legacy/input/index.d.ts

@@ -15,6 +15,7 @@ declare const AP_INPUT_CONTROL_VALUE_ACCESSOR: {
 declare class InputComponent implements OnInit, AfterViewInit, ControlValueAccessor {
     readonly elementRef: ElementRef;
     readonly symbolRegistry: SymbolRegistry;
+    constructor();
     symbols: QueryList<SymbolComponent>;
     symbolWrapper: ElementRef;
     inputElement: ElementRef;

package/nav-selector/index.d.ts

@@ -385,6 +385,7 @@ declare class NavSelectorState {
 }
 
 declare class NavSelectorComponent implements OnInit {
+    private readonly symbolRegistry;
     navSelectorEntries: _angular_core.InputSignal<NavSelectorEntry[]>;
     translatedTexts: _angular_core.InputSignal<NavSelectorTranslatedTexts>;
     multipleModeEnabled: _angular_core.InputSignal<boolean>;
@@ -414,7 +415,6 @@ declare class NavSelectorComponent implements OnInit {
     private stableNavSelectorEntries;
     private expanded;
     private entries;
-    private selectableEntryUids;
     private visibleEntryUids;
     visibleAccountsChange: _angular_core.OutputRef<{
         visibleAccountUids: string[];

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@agorapulse/ui-components",
   "description": "Agorapulse UI Components Library",
-  "version": "20.3.39",
+  "version": "20.3.40",
   "author": "Benoit Hediard",
   "repository": {
     "type": "git",
@@ -76,14 +76,14 @@
       "types": "./confirm-modal/index.d.ts",
       "default": "./fesm2022/agorapulse-ui-components-confirm-modal.mjs"
     },
-    "./datepicker": {
-      "types": "./datepicker/index.d.ts",
-      "default": "./fesm2022/agorapulse-ui-components-datepicker.mjs"
-    },
     "./counter": {
       "types": "./counter/index.d.ts",
       "default": "./fesm2022/agorapulse-ui-components-counter.mjs"
     },
+    "./datepicker": {
+      "types": "./datepicker/index.d.ts",
+      "default": "./fesm2022/agorapulse-ui-components-datepicker.mjs"
+    },
     "./directives": {
       "types": "./directives/index.d.ts",
       "default": "./fesm2022/agorapulse-ui-components-directives.mjs"

package/select/index.d.ts

@@ -49,6 +49,8 @@ declare class SelectSingleDirective implements AfterViewInit {
 }
 
 declare class DropdownItemSingleOneLineComponent {
+    private readonly symbolRegistry;
+    constructor();
     text: string;
     selected: boolean;
     disabled: boolean;
@@ -68,6 +70,8 @@ declare class DropdownItemSingleOneLineComponent {
 }
 
 declare class DropdownItemSingleTwoLinesComponent {
+    private readonly symbolRegistry;
+    constructor();
     text: string;
     caption: string;
     selected: boolean;
@@ -87,6 +91,8 @@ declare class DropdownItemSingleTwoLinesComponent {
 }
 
 declare class DropdownItemMultipleOneLineComponent {
+    private readonly symbolRegistry;
+    constructor();
     text: string;
     selected: boolean;
     htmlId: string;
@@ -115,6 +121,8 @@ declare class DropdownItemMultipleOneLineComponent {
 }
 
 declare class DropdownItemMultipleTwoLinesComponent {
+    private readonly symbolRegistry;
+    constructor();
     text: string;
     caption: string;
     selected: boolean;

package/tabs/index.d.ts

@@ -2,6 +2,7 @@ import * as _angular_core from '@angular/core';
 import { ElementRef } from '@angular/core';
 
 declare class TabComponent {
+    private readonly symbolRegistry;
     label: _angular_core.InputSignal<string>;
     counter: _angular_core.InputSignal<number | undefined>;
     disabled: _angular_core.InputSignal<boolean>;
@@ -9,6 +10,7 @@ declare class TabComponent {
     symbolId: _angular_core.InputSignal<string | undefined>;
     isActive: _angular_core.WritableSignal<boolean>;
     tabIndex: _angular_core.WritableSignal<number>;
+    constructor();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<TabComponent, "ap-tab", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "counter": { "alias": "counter"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "featureLocked": { "alias": "featureLocked"; "required": false; "isSignal": true; }; "symbolId": { "alias": "symbolId"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }