npm - @agorapulse/ui-components - Versions diffs - 20.3.36 → 20.3.38 - Mend

@agorapulse/ui-components 20.3.36 → 20.3.38

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

Files changed (25) hide show

package/agorapulse-ui-components-20.3.38.tgz ADDED Viewed

Binary file

package/fesm2022/agorapulse-ui-components-action-dropdown.mjs CHANGED Viewed

@@ -315,7 +315,7 @@ class ActionDropdownComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ActionDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: ActionDropdownComponent, isStandalone: true, selector: "ap-action-dropdown", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, largeModeEnabled: { classPropertyName: "largeModeEnabled", publicName: "largeModeEnabled", isSignal: true, isRequired: false, transformFunction: null }, showBackdrop: { classPropertyName: "showBackdrop", publicName: "showBackdrop", isSignal: true, isRequired: false, transformFunction: null }, customWidth: { classPropertyName: "customWidth", publicName: "customWidth", isSignal: true, isRequired: false, transformFunction: null }, defaultPosition: { classPropertyName: "defaultPosition", publicName: "defaultPosition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick", opened: "opened", closed: "closed" }, providers: [withSymbols(apInfo, apFeatureLock)], queries: [{ propertyName: "trigger", first: true, predicate: ["trigger"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "actionDropdownTemplate", first: true, predicate: ["actionDropdownTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #actionDropdownTemplate>\n    <!-- Action dropdown -->\n    <div\n        class=\"ap-action-dropdown__content\"\n        role=\"menu\"\n        tabindex=\"-1\"\n        [attr.aria-label]=\"'Action dropdown'\"\n        [class.ap-action-dropdown__content--default]=\"!largeModeEnabled() && !customWidth()\"\n        [class.ap-action-dropdown__content--large]=\"largeModeEnabled()\"\n        [style.width]=\"customWidth() ? customWidth() + 'px' : undefined\"\n        (keydown)=\"onKeyDown($event)\">\n        <!-- Action dropdown items -->\n        @for (item of items(); track item.label) {\n            <!-- Divider -->\n            @if (item.dividerEnabled) {\n                <div\n                    class=\"ap-action-dropdown__divider\"\n                    role=\"separator\"></div>\n            }\n            <!-- Action dropdown item -->\n            <div [apTooltip]=\"item.itemTooltipText\">\n                <button\n                    type=\"button\"\n                    role=\"menuitem\"\n                    class=\"ap-action-dropdown__item\"\n                    [class.ap-action-dropdown__item--has-description]=\"item.description\"\n                    [class.ap-action-dropdown__item--focused]=\"focusedIndex() === $index\"\n                    [class.ap-action-dropdown__item--red-mode]=\"item.redModeEnabled\"\n                    [class.ap-action-dropdown__item--feature-lock]=\"item.featureLockEnabled\"\n                    [attr.aria-disabled]=\"item.disabled\"\n                    [attr.id]=\"item.id\"\n                    [disabled]=\"item.disabled\"\n                    (click)=\"onItemClick(item)\">\n                    <!-- Start icon -->\n                    @if (item.startSymbolId) {\n                        <ap-symbol\n                            class=\"ap-action-dropdown__item-start-icon\"\n                            size=\"sm\"\n                            [color]=\"item.startSymbolColor ? item.startSymbolColor : item.redModeEnabled ? 'red' : 'basic-grey'\"\n                            [symbolId]=\"item.startSymbolId\"\n                            [apTooltip]=\"item.startSymbolTooltipText\" />\n                    }\n                    <!-- Label -->\n                    <div class=\"ap-action-dropdown__item-text-container\">\n                        <div class=\"ap-action-dropdown__item-label-container\">\n                            <div\n                                class=\"ap-action-dropdown__item-label\"\n                                [class.ap-action-dropdown__item-label--bold]=\"item.description\">\n                                {{ item.label }}\n                            </div>\n                            <!-- Badge -->\n                            @if (item.badgeLabel) {\n                                <ap-badge [color]=\"item.badgeColor ?? 'blue'\">\n                                    {{ item.badgeLabel }}\n                                </ap-badge>\n                            }\n                        </div>\n                        <!-- Description -->\n                        <div class=\"ap-action-dropdown__item-description\">{{ item.description }}</div>\n                    </div>\n                    <!-- End icon -->\n                    @if (item.endSymbolId) {\n                        <ap-symbol\n                            class=\"ap-action-dropdown__item-end-icon\"\n                            size=\"sm\"\n                            color=\"#858FA1\"\n                            [symbolId]=\"item.endSymbolId\"\n                            [apTooltip]=\"item.endSymbolTooltipText\" />\n                    }\n                    <!-- Feature lock icon -->\n                    @if (item.featureLockEnabled) {\n                        <ap-symbol\n                            class=\"ap-action-dropdown__item-end-icon\"\n                            size=\"sm\"\n                            color=\"purple\"\n                            symbolId=\"feature-lock\" />\n                    }\n                </button>\n            </div>\n        }\n    </div>\n</ng-template>\n", styles: [":host{display:none}.ap-action-dropdown__content{background-color:var(--comp-action-dropdown-background-color);border-radius:var(--comp-action-dropdown-border-radius);box-shadow:var(--comp-action-dropdown-box-shadow);padding:var(--comp-action-dropdown-padding);outline:none;overflow:hidden;z-index:1000}.ap-action-dropdown__content.ap-action-dropdown__content--default{width:250px}.ap-action-dropdown__content.ap-action-dropdown__content--large{width:340px}.ap-action-dropdown__content:focus{outline:2px solid var(--comp-action-dropdown-item-background-color-focused);outline-offset:2px}.ap-action-dropdown__item{display:flex;align-items:center;width:100%;height:40px;padding:var(--comp-action-dropdown-item-padding);border:none;background:transparent;color:var(--comp-action-dropdown-item-text-color);cursor:pointer;font-family:Averta;font-size:var(--comp-action-dropdown-item-text-size);line-height:var(--comp-action-dropdown-item-text-line-height);text-align:left}.ap-action-dropdown__item:hover{background-color:var(--comp-action-dropdown-item-background-color-hover)}.ap-action-dropdown__item:focus{outline:none;background-color:var(--comp-action-dropdown-item-background-color-focused)}.ap-action-dropdown__item:disabled{cursor:not-allowed;opacity:.4}.ap-action-dropdown__item.ap-action-dropdown__item--has-description{height:auto;min-height:50px}.ap-action-dropdown__item.ap-action-dropdown__item--focused{background-color:var(--comp-action-dropdown-item-background-color-focused)}.ap-action-dropdown__item.ap-action-dropdown__item--red-mode{color:var(--comp-action-dropdown-item-text-color-red-mode)}.ap-action-dropdown__item.ap-action-dropdown__item--red-mode:hover{background-color:var(--comp-action-dropdown-item-background-color-red-mode-hover)}.ap-action-dropdown__item.ap-action-dropdown__item--red-mode:focus{background-color:var(--comp-action-dropdown-item-background-color-red-mode-focused)}.ap-action-dropdown__item.ap-action-dropdown__item--red-mode.ap-action-dropdown__item--focused{background-color:var(--comp-action-dropdown-item-background-color-red-mode-focused)}.ap-action-dropdown__item.ap-action-dropdown__item--feature-lock:hover{background-color:var(--comp-action-dropdown-item-background-color-feature-lock-hover)}.ap-action-dropdown__item.ap-action-dropdown__item--feature-lock:focus{background-color:var(--comp-action-dropdown-item-background-color-feature-lock-focused)}.ap-action-dropdown__item.ap-action-dropdown__item--feature-lock.ap-action-dropdown__item--focused{background-color:var(--comp-action-dropdown-item-background-color-feature-lock-focused)}.ap-action-dropdown__item.ap-action-dropdown__item--disabled:hover{background-color:transparent}.ap-action-dropdown__item .ap-action-dropdown__item-start-icon{margin-right:var(--comp-action-dropdown-item-icon-spacing)}.ap-action-dropdown__item .ap-action-dropdown__item-end-icon{margin-left:var(--comp-action-dropdown-item-icon-spacing)}.ap-action-dropdown__item .ap-action-dropdown__item-text-container{display:flex;flex-direction:column;flex:1;min-width:0}.ap-action-dropdown__item .ap-action-dropdown__item-text-container .ap-action-dropdown__item-label-container{display:flex;align-items:center;gap:var(--comp-action-dropdown-item-label-spacing);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ap-action-dropdown__item .ap-action-dropdown__item-text-container .ap-action-dropdown__item-label-container .ap-action-dropdown__item-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ap-action-dropdown__item .ap-action-dropdown__item-text-container .ap-action-dropdown__item-label-container .ap-action-dropdown__item-label.ap-action-dropdown__item-label--bold{font-weight:var(--ref-font-weight-bold)}.ap-action-dropdown__item .ap-action-dropdown__item-text-container .ap-action-dropdown__item-description{color:var(--comp-action-dropdown-item-description-color);font-size:var(--comp-action-dropdown-item-description-size);line-height:var(--comp-action-dropdown-item-description-line-height)}.ap-action-dropdown__divider{height:1px;background-color:var(--comp-action-dropdown-divider-color);margin:var(--comp-action-dropdown-divider-margin)}\n"], dependencies: [{ kind: "component", type: BadgeComponent, selector: "ap-badge", inputs: ["color"] }, { kind: "ngmodule", type: CommonModule }, { kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "directive", type: TooltipDirective, selector: "[apTooltip]", inputs: ["apTooltip", "apTooltipPosition", "apTooltipShowDelay", "apTooltipHideDelay", "apTooltipDuration", "apTooltipDisabled", "apTooltipTruncatedTextOnly", "apTooltipTemplateContext", "apTooltipVirtualScrollElement", "apTooltipTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: ActionDropdownComponent, isStandalone: true, selector: "ap-action-dropdown", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, largeModeEnabled: { classPropertyName: "largeModeEnabled", publicName: "largeModeEnabled", isSignal: true, isRequired: false, transformFunction: null }, showBackdrop: { classPropertyName: "showBackdrop", publicName: "showBackdrop", isSignal: true, isRequired: false, transformFunction: null }, customWidth: { classPropertyName: "customWidth", publicName: "customWidth", isSignal: true, isRequired: false, transformFunction: null }, defaultPosition: { classPropertyName: "defaultPosition", publicName: "defaultPosition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick", opened: "opened", closed: "closed" }, providers: [withSymbols(apInfo, apFeatureLock)], queries: [{ propertyName: "trigger", first: true, predicate: ["trigger"], descendants: true, isSignal: true }], viewQueries: [{ propertyName: "actionDropdownTemplate", first: true, predicate: ["actionDropdownTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #actionDropdownTemplate>\n    <!-- Action dropdown -->\n    <div\n        class=\"ap-action-dropdown__content\"\n        role=\"menu\"\n        tabindex=\"-1\"\n        [attr.aria-label]=\"'Action dropdown'\"\n        [class.ap-action-dropdown__content--default]=\"!largeModeEnabled() && !customWidth()\"\n        [class.ap-action-dropdown__content--large]=\"largeModeEnabled()\"\n        [style.width]=\"customWidth() ? customWidth() + 'px' : undefined\"\n        (keydown)=\"onKeyDown($event)\">\n        <!-- Action dropdown items -->\n        @for (item of items(); track item.label) {\n            <!-- Divider -->\n            @if (item.dividerEnabled) {\n                <div\n                    class=\"ap-action-dropdown__divider\"\n                    role=\"separator\"></div>\n            }\n            <!-- Action dropdown item -->\n            <div [apTooltip]=\"item.itemTooltipText\">\n                <button\n                    type=\"button\"\n                    role=\"menuitem\"\n                    class=\"ap-action-dropdown__item\"\n                    [class.ap-action-dropdown__item--has-description]=\"item.description\"\n                    [class.ap-action-dropdown__item--focused]=\"focusedIndex() === $index\"\n                    [class.ap-action-dropdown__item--red-mode]=\"item.redModeEnabled\"\n                    [class.ap-action-dropdown__item--feature-lock]=\"item.featureLockEnabled\"\n                    [attr.aria-disabled]=\"item.disabled\"\n                    [attr.id]=\"item.id\"\n                    [disabled]=\"item.disabled\"\n                    (click)=\"onItemClick(item)\">\n                    <!-- Start icon -->\n                    @if (item.startSymbolId) {\n                        <ap-symbol\n                            class=\"ap-action-dropdown__item-start-icon\"\n                            size=\"sm\"\n                            [color]=\"item.startSymbolColor ? item.startSymbolColor : item.redModeEnabled ? 'red' : 'basic-grey'\"\n                            [symbolId]=\"item.startSymbolId\"\n                            [apTooltip]=\"item.startSymbolTooltipText\" />\n                    }\n                    <!-- Label -->\n                    <div class=\"ap-action-dropdown__item-text-container\">\n                        <div class=\"ap-action-dropdown__item-label-container\">\n                            <div\n                                class=\"ap-action-dropdown__item-label\"\n                                [class.ap-action-dropdown__item-label--bold]=\"item.description\">\n                                {{ item.label }}\n                            </div>\n                            <!-- Badge -->\n                            @if (item.badgeLabel) {\n                                <ap-badge [color]=\"item.badgeColor ?? 'blue'\">\n                                    {{ item.badgeLabel }}\n                                </ap-badge>\n                            }\n                        </div>\n                        <!-- Description -->\n                        <div class=\"ap-action-dropdown__item-description\">{{ item.description }}</div>\n                    </div>\n                    <!-- End icon -->\n                    @if (item.endSymbolId) {\n                        <ap-symbol\n                            class=\"ap-action-dropdown__item-end-icon\"\n                            size=\"sm\"\n                            color=\"#858FA1\"\n                            [symbolId]=\"item.endSymbolId\"\n                            [apTooltip]=\"item.endSymbolTooltipText\" />\n                    }\n                    <!-- Feature lock icon -->\n                    @if (item.featureLockEnabled) {\n                        <ap-symbol\n                            class=\"ap-action-dropdown__item-end-icon\"\n                            size=\"sm\"\n                            color=\"purple\"\n                            symbolId=\"feature-lock\" />\n                    }\n                </button>\n            </div>\n        }\n    </div>\n</ng-template>\n", styles: [":host{display:none}.ap-action-dropdown__content{background-color:var(--comp-action-dropdown-background-color);border-radius:var(--comp-action-dropdown-border-radius);box-shadow:var(--comp-action-dropdown-box-shadow);padding:var(--comp-action-dropdown-padding);outline:none;overflow:hidden;z-index:1000}.ap-action-dropdown__content.ap-action-dropdown__content--default{width:250px}.ap-action-dropdown__content.ap-action-dropdown__content--large{width:340px}.ap-action-dropdown__content:focus{outline:2px solid var(--comp-action-dropdown-item-background-color-focused);outline-offset:2px}.ap-action-dropdown__item{display:flex;align-items:center;width:100%;height:40px;padding:var(--comp-action-dropdown-item-padding);border:none;background:transparent;color:var(--comp-action-dropdown-item-text-color);cursor:pointer;font-family:Averta;font-size:var(--comp-action-dropdown-item-text-size);line-height:var(--comp-action-dropdown-item-text-line-height);text-align:left}.ap-action-dropdown__item:hover{background-color:var(--comp-action-dropdown-item-background-color-hover)}.ap-action-dropdown__item:focus{outline:none;background-color:var(--comp-action-dropdown-item-background-color-focused)}.ap-action-dropdown__item:disabled{cursor:not-allowed;opacity:.4}.ap-action-dropdown__item.ap-action-dropdown__item--has-description{height:auto;min-height:50px}.ap-action-dropdown__item.ap-action-dropdown__item--focused{background-color:var(--comp-action-dropdown-item-background-color-focused)}.ap-action-dropdown__item.ap-action-dropdown__item--red-mode{color:var(--comp-action-dropdown-item-text-color-red-mode)}.ap-action-dropdown__item.ap-action-dropdown__item--red-mode:hover{background-color:var(--comp-action-dropdown-item-background-color-red-mode-hover)}.ap-action-dropdown__item.ap-action-dropdown__item--red-mode:focus{background-color:var(--comp-action-dropdown-item-background-color-red-mode-focused)}.ap-action-dropdown__item.ap-action-dropdown__item--red-mode.ap-action-dropdown__item--focused{background-color:var(--comp-action-dropdown-item-background-color-red-mode-focused)}.ap-action-dropdown__item.ap-action-dropdown__item--feature-lock:hover{background-color:var(--comp-action-dropdown-item-background-color-feature-lock-hover)}.ap-action-dropdown__item.ap-action-dropdown__item--feature-lock:focus{background-color:var(--comp-action-dropdown-item-background-color-feature-lock-focused)}.ap-action-dropdown__item.ap-action-dropdown__item--feature-lock.ap-action-dropdown__item--focused{background-color:var(--comp-action-dropdown-item-background-color-feature-lock-focused)}.ap-action-dropdown__item.ap-action-dropdown__item--disabled:hover{background-color:transparent}.ap-action-dropdown__item .ap-action-dropdown__item-start-icon{margin-right:var(--comp-action-dropdown-item-icon-spacing)}.ap-action-dropdown__item .ap-action-dropdown__item-end-icon{margin-left:var(--comp-action-dropdown-item-icon-spacing)}.ap-action-dropdown__item .ap-action-dropdown__item-text-container{display:flex;flex-direction:column;flex:1;min-width:0}.ap-action-dropdown__item .ap-action-dropdown__item-text-container .ap-action-dropdown__item-label-container{display:flex;align-items:center;gap:var(--comp-action-dropdown-item-label-spacing);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ap-action-dropdown__item .ap-action-dropdown__item-text-container .ap-action-dropdown__item-label-container .ap-action-dropdown__item-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ap-action-dropdown__item .ap-action-dropdown__item-text-container .ap-action-dropdown__item-label-container .ap-action-dropdown__item-label.ap-action-dropdown__item-label--bold{font-weight:var(--ref-font-weight-bold)}.ap-action-dropdown__item .ap-action-dropdown__item-text-container .ap-action-dropdown__item-description{color:var(--comp-action-dropdown-item-description-color);font-size:var(--comp-action-dropdown-item-description-size);line-height:var(--comp-action-dropdown-item-description-line-height)}.ap-action-dropdown__divider{height:1px;background-color:var(--comp-action-dropdown-divider-color);margin:var(--comp-action-dropdown-divider-margin)}\n"], dependencies: [{ kind: "component", type: BadgeComponent, selector: "ap-badge", inputs: ["color"] }, { kind: "ngmodule", type: CommonModule }, { kind: "component", type: SymbolComponent, selector: "ap-symbol", inputs: ["symbolId", "color", "size"], outputs: ["sizeChange"] }, { kind: "directive", type: TooltipDirective, selector: "[apTooltip]", inputs: ["apTooltip", "apTooltipPosition", "apTooltipShowDelay", "apTooltipHideDelay", "apTooltipDuration", "apTooltipDisabled", "apTooltipTruncatedTextOnly", "apTooltipTemplateContext", "apTooltipVirtualScrollElement", "apTooltipTrigger", "apTooltipType", "apTooltipPresentationContext", "apTooltipListItems"], exportAs: ["apTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ActionDropdownComponent, decorators: [{
             type: Component,

package/fesm2022/agorapulse-ui-components-action-dropdown.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"agorapulse-ui-components-action-dropdown.mjs","sources":["../../../libs/ui-components/action-dropdown/src/action-dropdown-trigger.directive.ts","../../../libs/ui-components/action-dropdown/src/action-dropdown.component.ts","../../../libs/ui-components/action-dropdown/src/action-dropdown.component.html","../../../libs/ui-components/action-dropdown/src/agorapulse-ui-components-action-dropdown.ts"],"sourcesContent":["import { Directive, ElementRef, HostListener, inject, input } from '@angular/core';\nimport { ActionDropdownComponent } from './action-dropdown.component';\n\n/*\n Directive that turns any element into a trigger for an ActionDropdown component.\n * Handles click and keyboard interactions to open/close the dropdown.\n /\n@Directive({\n selector: '[apActionDropdownTrigger]',\n})\nexport class ActionDropdownTriggerDirective {\n private readonly elementRef = inject(ElementRef<HTMLElement>);\n\n /* Reference to the ActionDropdown component that this trigger controls /\n apActionDropdownTrigger = input<ActionDropdownComponent>();\n\n /* Handles click events to toggle the dropdown /\n @HostListener('click', ['$event'])\n onClick(event: MouseEvent): void {\n event.preventDefault();\n event.stopPropagation();\n\n const actionDropdown = this.apActionDropdownTrigger();\n if (actionDropdown) {\n actionDropdown.toggle(this.elementRef.nativeElement);\n }\n }\n\n /* Handles keyboard events for accessibility (Enter, Space, Arrow Down, Escape) /\n @HostListener('keydown', ['$event'])\n onKeyDown(event: KeyboardEvent): void {\n const actionDropdown = this.apActionDropdownTrigger();\n if (actionDropdown) {\n switch (event.key) {\n case 'Enter':\n case ' ':\n case 'ArrowDown':\n event.preventDefault();\n actionDropdown.open(this.elementRef.nativeElement);\n break;\n\n case 'Escape':\n event.preventDefault();\n actionDropdown.close();\n break;\n }\n }\n }\n}\n","import { BadgeComponent, BadgeColor } from '@agorapulse/ui-components/badge';\nimport { UI_COMPONENTS_SYMBOLS } from '@agorapulse/ui-components/providers';\nimport { TooltipDirective } from '@agorapulse/ui-components/tooltip';\nimport { agorapulseSymbol, apFeatureLock, apInfo, SymbolColor, SymbolComponent, SymbolRegistry, withSymbols } from '@agorapulse/ui-symbol';\nimport { ConnectedPosition, FlexibleConnectedPositionStrategy, Overlay, OverlayPositionBuilder, OverlayRef } from '@angular/cdk/overlay';\nimport { TemplatePortal } from '@angular/cdk/portal';\nimport { CommonModule } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n contentChild,\n effect,\n ElementRef,\n inject,\n input,\n output,\n signal,\n TemplateRef,\n viewChild,\n ViewContainerRef,\n} from '@angular/core';\nimport { take } from 'rxjs/operators';\n\nexport interface ActionDropdownItem {\n /* Unique identifier for the item /\n name?: string;\n /* Display text for the item /\n label?: string;\n /* Secondary text displayed below the label /\n description?: string;\n /* Text displayed in a badge next to the item /\n badgeLabel?: string;\n /* Color of the badge displayed next to the item /\n badgeColor?: BadgeColor;\n /* Whether to show a feature lock icon /\n featureLockEnabled?: boolean;\n /* Whether to apply red styling for destructive actions /\n redModeEnabled?: boolean;\n /* Tooltip text displayed when hovering over the item /\n itemTooltipText?: string;\n /* Icon symbol identifier displayed at the start of the item /\n startSymbolId?: agorapulseSymbol;\n /* Color theme for the start symbol /\n startSymbolColor?: SymbolColor;\n /* Tooltip text for the start symbol /\n startSymbolTooltipText?: string;\n /* Icon symbol identifier displayed at the end of the item /\n endSymbolId?: agorapulseSymbol;\n /* Tooltip text for the end symbol /\n endSymbolTooltipText?: string;\n /* Whether the item is disabled and non-interactive /\n disabled?: boolean;\n /* Whether to add a divider before this item /\n dividerEnabled?: boolean;\n /* Optional ID for the action button item /\n id?: string;\n}\n\n/\n A dropdown component that displays a list of actionable items with support for icons,\n * badges, tooltips, and keyboard navigation.\n /\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-action-dropdown',\n templateUrl: './action-dropdown.component.html',\n styleUrls: ['./action-dropdown.component.scss'],\n imports: [BadgeComponent, CommonModule, SymbolComponent, TooltipDirective],\n providers: [withSymbols(apInfo, apFeatureLock)],\n})\nexport class ActionDropdownComponent {\n private readonly elementRef = inject(ElementRef);\n private readonly overlay = inject(Overlay);\n private readonly positionBuilder = inject(OverlayPositionBuilder);\n private readonly symbolRegistry = inject(SymbolRegistry);\n private readonly viewContainerRef = inject(ViewContainerRef);\n\n actionDropdownTemplate = viewChild<TemplateRef<unknown>>('actionDropdownTemplate');\n trigger = contentChild<TemplateRef<unknown>>('trigger');\n\n /* Array of items to display in the dropdown menu /\n items = input<ActionDropdownItem[]>([]);\n /* Whether the dropdown is disabled and cannot be opened /\n disabled = input(false);\n /* Whether to enable large mode styling for the dropdown /\n largeModeEnabled = input(false);\n /* Whether to show a backdrop that closes the dropdown when clicked /\n showBackdrop = input(true);\n /* Custom width for the dropdown menu in pixels /\n customWidth = input<number \| null>(null);\n /* Default position for the dropdown relative to the trigger element /\n defaultPosition = input<'right' \| 'left'>('right');\n\n /* Emits when a dropdown item is clicked /\n itemClick = output<ActionDropdownItem>();\n /* Emits when the dropdown menu is opened /\n opened = output<void>();\n /* Emits when the dropdown menu is closed /\n closed = output<void>();\n\n private overlayRef: OverlayRef \| null = null;\n private portal: TemplatePortal<unknown> \| null = null;\n\n protected readonly isOpen = signal(false);\n protected readonly focusedIndex = signal(-1);\n\n constructor() {\n this.symbolRegistry.withSymbols(...(inject(UI_COMPONENTS_SYMBOLS, { optional: true })?.flat() ?? []));\n\n // Set up keyboard navigation when dropdown opens\n effect(() => {\n if (this.isOpen()) {\n this.setupKeyboardNavigation();\n }\n });\n }\n\n /* Opens the dropdown menu at the specified trigger element or component's element /\n open(triggerElement?: HTMLElement): void {\n const actionDropdownTemplate = this.actionDropdownTemplate();\n\n if (this.disabled() \|\| this.isOpen() \|\| !actionDropdownTemplate) {\n return;\n }\n\n const target = triggerElement \|\| this.elementRef.nativeElement;\n\n if (this.overlayRef) {\n this.overlayRef.dispose();\n }\n\n const positionStrategy = this.createPositionStrategy(target);\n\n this.overlayRef = this.overlay.create({\n positionStrategy,\n hasBackdrop: this.showBackdrop(),\n backdropClass: '',\n panelClass: '',\n scrollStrategy: this.overlay.scrollStrategies.reposition(),\n });\n\n this.portal = new TemplatePortal(actionDropdownTemplate, this.viewContainerRef);\n this.overlayRef.attach(this.portal);\n\n this.isOpen.set(true);\n this.focusedIndex.set(-1);\n this.opened.emit();\n\n this.overlayRef\n .backdropClick()\n .pipe(take(1))\n .subscribe(() => {\n this.close();\n });\n\n this.overlayRef\n .keydownEvents()\n .pipe(take(1))\n .subscribe((event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n this.close();\n }\n });\n }\n\n /* Closes the dropdown menu and cleans up overlay resources /\n close(): void {\n if (!this.isOpen()) {\n return;\n }\n\n if (this.overlayRef) {\n this.overlayRef.dispose();\n this.overlayRef = null;\n }\n\n this.portal = null;\n this.isOpen.set(false);\n this.focusedIndex.set(-1);\n this.closed.emit();\n }\n\n /* Toggles the dropdown menu open or closed state /\n toggle(triggerElement?: HTMLElement): void {\n if (this.isOpen()) {\n this.close();\n } else {\n this.open(triggerElement);\n }\n }\n\n /* Handles item click events, emitting the selected item and closing the dropdown /\n onItemClick(item: ActionDropdownItem): void {\n if (item.disabled) {\n return;\n }\n\n this.itemClick.emit(item);\n\n this.close();\n }\n\n /* Handles keyboard navigation within the dropdown menu /\n onKeyDown(event: KeyboardEvent): void {\n const items = this.items();\n const currentIndex = this.focusedIndex();\n let nextIndex: number;\n let prevIndex: number;\n\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n nextIndex = currentIndex < items.length - 1 ? currentIndex + 1 : 0;\n this.focusedIndex.set(nextIndex);\n break;\n\n case 'ArrowUp':\n event.preventDefault();\n prevIndex = currentIndex > 0 ? currentIndex - 1 : items.length - 1;\n this.focusedIndex.set(prevIndex);\n break;\n\n case 'Enter':\n case ' ':\n event.preventDefault();\n if (currentIndex >= 0 && currentIndex < items.length) {\n this.onItemClick(items[currentIndex]);\n }\n break;\n\n case 'Escape':\n event.preventDefault();\n this.close();\n break;\n\n case 'Tab':\n event.preventDefault();\n if (event.shiftKey) {\n // Shift+Tab - move to previous item\n prevIndex = currentIndex > 0 ? currentIndex - 1 : items.length - 1;\n this.focusedIndex.set(prevIndex);\n } else {\n // Tab - move to next item\n nextIndex = currentIndex < items.length - 1 ? currentIndex + 1 : 0;\n this.focusedIndex.set(nextIndex);\n }\n break;\n }\n }\n\n /* Creates positioning strategy for the overlay based on trigger element and default position /\n private createPositionStrategy(target: HTMLElement): FlexibleConnectedPositionStrategy {\n const defaultPosition = this.defaultPosition();\n const gap = 4;\n\n const positions: ConnectedPosition[] =\n defaultPosition === 'right'\n ? [\n // Bottom-right (default) - left border aligns with left side of trigger\n {\n originX: 'start',\n originY: 'bottom',\n overlayX: 'start',\n overlayY: 'top',\n offsetX: 0,\n offsetY: gap,\n },\n // Bottom-left (if not enough space on right) - right border aligns with right side of trigger\n {\n originX: 'end',\n originY: 'bottom',\n overlayX: 'end',\n overlayY: 'top',\n offsetX: 0,\n offsetY: gap,\n },\n // Top-right (if not enough space below) - left border aligns with left side of trigger\n {\n originX: 'start',\n originY: 'top',\n overlayX: 'start',\n overlayY: 'bottom',\n offsetX: 0,\n offsetY: -gap,\n },\n // Top-left (if not enough space below and on right) - right border aligns with right side of trigger\n {\n originX: 'end',\n originY: 'top',\n overlayX: 'end',\n overlayY: 'bottom',\n offsetX: 0,\n offsetY: -gap,\n },\n ]\n : [\n // Bottom-left (default) - right border aligns with right side of trigger\n {\n originX: 'end',\n originY: 'bottom',\n overlayX: 'end',\n overlayY: 'top',\n offsetX: 0,\n offsetY: gap,\n },\n // Bottom-right (if not enough space on left) - left border aligns with left side of trigger\n {\n originX: 'start',\n originY: 'bottom',\n overlayX: 'start',\n overlayY: 'top',\n offsetX: 0,\n offsetY: gap,\n },\n // Top-left (if not enough space below) - right border aligns with right side of trigger\n {\n originX: 'end',\n originY: 'top',\n overlayX: 'end',\n overlayY: 'bottom',\n offsetX: 0,\n offsetY: -gap,\n },\n // Top-right (if not enough space below and on left) - left border aligns with left side of trigger\n {\n originX: 'start',\n originY: 'top',\n overlayX: 'start',\n overlayY: 'bottom',\n offsetX: 0,\n offsetY: -gap,\n },\n ];\n\n return this.positionBuilder\n .flexibleConnectedTo(target)\n .withPositions(positions)\n .withFlexibleDimensions(true)\n .withPush(true)\n .withGrowAfterOpen(true)\n .withViewportMargin(8);\n }\n\n /* Sets up keyboard event handling for the opened dropdown /\n private setupKeyboardNavigation(): void {\n if (!this.overlayRef) {\n return;\n }\n\n const keydownEvents = this.overlayRef.keydownEvents();\n\n keydownEvents.subscribe((event: KeyboardEvent) => {\n this.onKeyDown(event);\n });\n }\n}\n","<ng-template #actionDropdownTemplate>\n <!-- Action dropdown -->\n <div\n class=\"ap-action-dropdown__content\"\n role=\"menu\"\n tabindex=\"-1\"\n [attr.aria-label]=\"'Action dropdown'\"\n [class.ap-action-dropdown__content--default]=\"!largeModeEnabled() && !customWidth()\"\n [class.ap-action-dropdown__content--large]=\"largeModeEnabled()\"\n [style.width]=\"customWidth() ? customWidth() + 'px' : undefined\"\n (keydown)=\"onKeyDown($event)\">\n <!-- Action dropdown items -->\n @for (item of items(); track item.label) {\n <!-- Divider -->\n @if (item.dividerEnabled) {\n <div\n class=\"ap-action-dropdown__divider\"\n role=\"separator\"></div>\n }\n <!-- Action dropdown item -->\n <div [apTooltip]=\"item.itemTooltipText\">\n <button\n type=\"button\"\n role=\"menuitem\"\n class=\"ap-action-dropdown__item\"\n [class.ap-action-dropdown__item--has-description]=\"item.description\"\n [class.ap-action-dropdown__item--focused]=\"focusedIndex() === $index\"\n [class.ap-action-dropdown__item--red-mode]=\"item.redModeEnabled\"\n [class.ap-action-dropdown__item--feature-lock]=\"item.featureLockEnabled\"\n [attr.aria-disabled]=\"item.disabled\"\n [attr.id]=\"item.id\"\n [disabled]=\"item.disabled\"\n (click)=\"onItemClick(item)\">\n <!-- Start icon -->\n @if (item.startSymbolId) {\n <ap-symbol\n class=\"ap-action-dropdown__item-start-icon\"\n size=\"sm\"\n [color]=\"item.startSymbolColor ? item.startSymbolColor : item.redModeEnabled ? 'red' : 'basic-grey'\"\n [symbolId]=\"item.startSymbolId\"\n [apTooltip]=\"item.startSymbolTooltipText\" />\n }\n <!-- Label -->\n <div class=\"ap-action-dropdown__item-text-container\">\n <div class=\"ap-action-dropdown__item-label-container\">\n <div\n class=\"ap-action-dropdown__item-label\"\n [class.ap-action-dropdown__item-label--bold]=\"item.description\">\n {{ item.label }}\n </div>\n <!-- Badge -->\n @if (item.badgeLabel) {\n <ap-badge [color]=\"item.badgeColor ?? 'blue'\">\n {{ item.badgeLabel }}\n </ap-badge>\n }\n </div>\n <!-- Description -->\n <div class=\"ap-action-dropdown__item-description\">{{ item.description }}</div>\n </div>\n <!-- End icon -->\n @if (item.endSymbolId) {\n <ap-symbol\n class=\"ap-action-dropdown__item-end-icon\"\n size=\"sm\"\n color=\"#858FA1\"\n [symbolId]=\"item.endSymbolId\"\n [apTooltip]=\"item.endSymbolTooltipText\" />\n }\n <!-- Feature lock icon -->\n @if (item.featureLockEnabled) {\n <ap-symbol\n class=\"ap-action-dropdown__item-end-icon\"\n size=\"sm\"\n color=\"purple\"\n symbolId=\"feature-lock\" />\n }\n </button>\n </div>\n }\n </div>\n</ng-template>\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public_api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"agorapulse-ui-components-action-dropdown.mjs","sources":["../../../libs/ui-components/action-dropdown/src/action-dropdown-trigger.directive.ts","../../../libs/ui-components/action-dropdown/src/action-dropdown.component.ts","../../../libs/ui-components/action-dropdown/src/action-dropdown.component.html","../../../libs/ui-components/action-dropdown/src/agorapulse-ui-components-action-dropdown.ts"],"sourcesContent":["import { Directive, ElementRef, HostListener, inject, input } from '@angular/core';\nimport { ActionDropdownComponent } from './action-dropdown.component';\n\n/*\n Directive that turns any element into a trigger for an ActionDropdown component.\n * Handles click and keyboard interactions to open/close the dropdown.\n /\n@Directive({\n selector: '[apActionDropdownTrigger]',\n})\nexport class ActionDropdownTriggerDirective {\n private readonly elementRef = inject(ElementRef<HTMLElement>);\n\n /* Reference to the ActionDropdown component that this trigger controls /\n apActionDropdownTrigger = input<ActionDropdownComponent>();\n\n /* Handles click events to toggle the dropdown /\n @HostListener('click', ['$event'])\n onClick(event: MouseEvent): void {\n event.preventDefault();\n event.stopPropagation();\n\n const actionDropdown = this.apActionDropdownTrigger();\n if (actionDropdown) {\n actionDropdown.toggle(this.elementRef.nativeElement);\n }\n }\n\n /* Handles keyboard events for accessibility (Enter, Space, Arrow Down, Escape) /\n @HostListener('keydown', ['$event'])\n onKeyDown(event: KeyboardEvent): void {\n const actionDropdown = this.apActionDropdownTrigger();\n if (actionDropdown) {\n switch (event.key) {\n case 'Enter':\n case ' ':\n case 'ArrowDown':\n event.preventDefault();\n actionDropdown.open(this.elementRef.nativeElement);\n break;\n\n case 'Escape':\n event.preventDefault();\n actionDropdown.close();\n break;\n }\n }\n }\n}\n","import { BadgeComponent, BadgeColor } from '@agorapulse/ui-components/badge';\nimport { UI_COMPONENTS_SYMBOLS } from '@agorapulse/ui-components/providers';\nimport { TooltipDirective } from '@agorapulse/ui-components/tooltip';\nimport { agorapulseSymbol, apFeatureLock, apInfo, SymbolColor, SymbolComponent, SymbolRegistry, withSymbols } from '@agorapulse/ui-symbol';\nimport { ConnectedPosition, FlexibleConnectedPositionStrategy, Overlay, OverlayPositionBuilder, OverlayRef } from '@angular/cdk/overlay';\nimport { TemplatePortal } from '@angular/cdk/portal';\nimport { CommonModule } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n contentChild,\n effect,\n ElementRef,\n inject,\n input,\n output,\n signal,\n TemplateRef,\n viewChild,\n ViewContainerRef,\n} from '@angular/core';\nimport { take } from 'rxjs/operators';\n\nexport interface ActionDropdownItem {\n /* Unique identifier for the item /\n name?: string;\n /* Display text for the item /\n label?: string;\n /* Secondary text displayed below the label /\n description?: string;\n /* Text displayed in a badge next to the item /\n badgeLabel?: string;\n /* Color of the badge displayed next to the item /\n badgeColor?: BadgeColor;\n /* Whether to show a feature lock icon /\n featureLockEnabled?: boolean;\n /* Whether to apply red styling for destructive actions /\n redModeEnabled?: boolean;\n /* Tooltip text displayed when hovering over the item /\n itemTooltipText?: string;\n /* Icon symbol identifier displayed at the start of the item /\n startSymbolId?: agorapulseSymbol;\n /* Color theme for the start symbol /\n startSymbolColor?: SymbolColor;\n /* Tooltip text for the start symbol /\n startSymbolTooltipText?: string;\n /* Icon symbol identifier displayed at the end of the item /\n endSymbolId?: agorapulseSymbol;\n /* Tooltip text for the end symbol /\n endSymbolTooltipText?: string;\n /* Whether the item is disabled and non-interactive /\n disabled?: boolean;\n /* Whether to add a divider before this item /\n dividerEnabled?: boolean;\n /* Optional ID for the action button item /\n id?: string;\n}\n\n/\n A dropdown component that displays a list of actionable items with support for icons,\n * badges, tooltips, and keyboard navigation.\n /\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-action-dropdown',\n templateUrl: './action-dropdown.component.html',\n styleUrls: ['./action-dropdown.component.scss'],\n imports: [BadgeComponent, CommonModule, SymbolComponent, TooltipDirective],\n providers: [withSymbols(apInfo, apFeatureLock)],\n})\nexport class ActionDropdownComponent {\n private readonly elementRef = inject(ElementRef);\n private readonly overlay = inject(Overlay);\n private readonly positionBuilder = inject(OverlayPositionBuilder);\n private readonly symbolRegistry = inject(SymbolRegistry);\n private readonly viewContainerRef = inject(ViewContainerRef);\n\n actionDropdownTemplate = viewChild<TemplateRef<unknown>>('actionDropdownTemplate');\n trigger = contentChild<TemplateRef<unknown>>('trigger');\n\n /* Array of items to display in the dropdown menu /\n items = input<ActionDropdownItem[]>([]);\n /* Whether the dropdown is disabled and cannot be opened /\n disabled = input(false);\n /* Whether to enable large mode styling for the dropdown /\n largeModeEnabled = input(false);\n /* Whether to show a backdrop that closes the dropdown when clicked /\n showBackdrop = input(true);\n /* Custom width for the dropdown menu in pixels /\n customWidth = input<number \| null>(null);\n /* Default position for the dropdown relative to the trigger element /\n defaultPosition = input<'right' \| 'left'>('right');\n\n /* Emits when a dropdown item is clicked /\n itemClick = output<ActionDropdownItem>();\n /* Emits when the dropdown menu is opened /\n opened = output<void>();\n /* Emits when the dropdown menu is closed /\n closed = output<void>();\n\n private overlayRef: OverlayRef \| null = null;\n private portal: TemplatePortal<unknown> \| null = null;\n\n protected readonly isOpen = signal(false);\n protected readonly focusedIndex = signal(-1);\n\n constructor() {\n this.symbolRegistry.withSymbols(...(inject(UI_COMPONENTS_SYMBOLS, { optional: true })?.flat() ?? []));\n\n // Set up keyboard navigation when dropdown opens\n effect(() => {\n if (this.isOpen()) {\n this.setupKeyboardNavigation();\n }\n });\n }\n\n /* Opens the dropdown menu at the specified trigger element or component's element /\n open(triggerElement?: HTMLElement): void {\n const actionDropdownTemplate = this.actionDropdownTemplate();\n\n if (this.disabled() \|\| this.isOpen() \|\| !actionDropdownTemplate) {\n return;\n }\n\n const target = triggerElement \|\| this.elementRef.nativeElement;\n\n if (this.overlayRef) {\n this.overlayRef.dispose();\n }\n\n const positionStrategy = this.createPositionStrategy(target);\n\n this.overlayRef = this.overlay.create({\n positionStrategy,\n hasBackdrop: this.showBackdrop(),\n backdropClass: '',\n panelClass: '',\n scrollStrategy: this.overlay.scrollStrategies.reposition(),\n });\n\n this.portal = new TemplatePortal(actionDropdownTemplate, this.viewContainerRef);\n this.overlayRef.attach(this.portal);\n\n this.isOpen.set(true);\n this.focusedIndex.set(-1);\n this.opened.emit();\n\n this.overlayRef\n .backdropClick()\n .pipe(take(1))\n .subscribe(() => {\n this.close();\n });\n\n this.overlayRef\n .keydownEvents()\n .pipe(take(1))\n .subscribe((event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n this.close();\n }\n });\n }\n\n /* Closes the dropdown menu and cleans up overlay resources /\n close(): void {\n if (!this.isOpen()) {\n return;\n }\n\n if (this.overlayRef) {\n this.overlayRef.dispose();\n this.overlayRef = null;\n }\n\n this.portal = null;\n this.isOpen.set(false);\n this.focusedIndex.set(-1);\n this.closed.emit();\n }\n\n /* Toggles the dropdown menu open or closed state /\n toggle(triggerElement?: HTMLElement): void {\n if (this.isOpen()) {\n this.close();\n } else {\n this.open(triggerElement);\n }\n }\n\n /* Handles item click events, emitting the selected item and closing the dropdown /\n onItemClick(item: ActionDropdownItem): void {\n if (item.disabled) {\n return;\n }\n\n this.itemClick.emit(item);\n\n this.close();\n }\n\n /* Handles keyboard navigation within the dropdown menu /\n onKeyDown(event: KeyboardEvent): void {\n const items = this.items();\n const currentIndex = this.focusedIndex();\n let nextIndex: number;\n let prevIndex: number;\n\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n nextIndex = currentIndex < items.length - 1 ? currentIndex + 1 : 0;\n this.focusedIndex.set(nextIndex);\n break;\n\n case 'ArrowUp':\n event.preventDefault();\n prevIndex = currentIndex > 0 ? currentIndex - 1 : items.length - 1;\n this.focusedIndex.set(prevIndex);\n break;\n\n case 'Enter':\n case ' ':\n event.preventDefault();\n if (currentIndex >= 0 && currentIndex < items.length) {\n this.onItemClick(items[currentIndex]);\n }\n break;\n\n case 'Escape':\n event.preventDefault();\n this.close();\n break;\n\n case 'Tab':\n event.preventDefault();\n if (event.shiftKey) {\n // Shift+Tab - move to previous item\n prevIndex = currentIndex > 0 ? currentIndex - 1 : items.length - 1;\n this.focusedIndex.set(prevIndex);\n } else {\n // Tab - move to next item\n nextIndex = currentIndex < items.length - 1 ? currentIndex + 1 : 0;\n this.focusedIndex.set(nextIndex);\n }\n break;\n }\n }\n\n /* Creates positioning strategy for the overlay based on trigger element and default position /\n private createPositionStrategy(target: HTMLElement): FlexibleConnectedPositionStrategy {\n const defaultPosition = this.defaultPosition();\n const gap = 4;\n\n const positions: ConnectedPosition[] =\n defaultPosition === 'right'\n ? [\n // Bottom-right (default) - left border aligns with left side of trigger\n {\n originX: 'start',\n originY: 'bottom',\n overlayX: 'start',\n overlayY: 'top',\n offsetX: 0,\n offsetY: gap,\n },\n // Bottom-left (if not enough space on right) - right border aligns with right side of trigger\n {\n originX: 'end',\n originY: 'bottom',\n overlayX: 'end',\n overlayY: 'top',\n offsetX: 0,\n offsetY: gap,\n },\n // Top-right (if not enough space below) - left border aligns with left side of trigger\n {\n originX: 'start',\n originY: 'top',\n overlayX: 'start',\n overlayY: 'bottom',\n offsetX: 0,\n offsetY: -gap,\n },\n // Top-left (if not enough space below and on right) - right border aligns with right side of trigger\n {\n originX: 'end',\n originY: 'top',\n overlayX: 'end',\n overlayY: 'bottom',\n offsetX: 0,\n offsetY: -gap,\n },\n ]\n : [\n // Bottom-left (default) - right border aligns with right side of trigger\n {\n originX: 'end',\n originY: 'bottom',\n overlayX: 'end',\n overlayY: 'top',\n offsetX: 0,\n offsetY: gap,\n },\n // Bottom-right (if not enough space on left) - left border aligns with left side of trigger\n {\n originX: 'start',\n originY: 'bottom',\n overlayX: 'start',\n overlayY: 'top',\n offsetX: 0,\n offsetY: gap,\n },\n // Top-left (if not enough space below) - right border aligns with right side of trigger\n {\n originX: 'end',\n originY: 'top',\n overlayX: 'end',\n overlayY: 'bottom',\n offsetX: 0,\n offsetY: -gap,\n },\n // Top-right (if not enough space below and on left) - left border aligns with left side of trigger\n {\n originX: 'start',\n originY: 'top',\n overlayX: 'start',\n overlayY: 'bottom',\n offsetX: 0,\n offsetY: -gap,\n },\n ];\n\n return this.positionBuilder\n .flexibleConnectedTo(target)\n .withPositions(positions)\n .withFlexibleDimensions(true)\n .withPush(true)\n .withGrowAfterOpen(true)\n .withViewportMargin(8);\n }\n\n /* Sets up keyboard event handling for the opened dropdown /\n private setupKeyboardNavigation(): void {\n if (!this.overlayRef) {\n return;\n }\n\n const keydownEvents = this.overlayRef.keydownEvents();\n\n keydownEvents.subscribe((event: KeyboardEvent) => {\n this.onKeyDown(event);\n });\n }\n}\n","<ng-template #actionDropdownTemplate>\n <!-- Action dropdown -->\n <div\n class=\"ap-action-dropdown__content\"\n role=\"menu\"\n tabindex=\"-1\"\n [attr.aria-label]=\"'Action dropdown'\"\n [class.ap-action-dropdown__content--default]=\"!largeModeEnabled() && !customWidth()\"\n [class.ap-action-dropdown__content--large]=\"largeModeEnabled()\"\n [style.width]=\"customWidth() ? customWidth() + 'px' : undefined\"\n (keydown)=\"onKeyDown($event)\">\n <!-- Action dropdown items -->\n @for (item of items(); track item.label) {\n <!-- Divider -->\n @if (item.dividerEnabled) {\n <div\n class=\"ap-action-dropdown__divider\"\n role=\"separator\"></div>\n }\n <!-- Action dropdown item -->\n <div [apTooltip]=\"item.itemTooltipText\">\n <button\n type=\"button\"\n role=\"menuitem\"\n class=\"ap-action-dropdown__item\"\n [class.ap-action-dropdown__item--has-description]=\"item.description\"\n [class.ap-action-dropdown__item--focused]=\"focusedIndex() === $index\"\n [class.ap-action-dropdown__item--red-mode]=\"item.redModeEnabled\"\n [class.ap-action-dropdown__item--feature-lock]=\"item.featureLockEnabled\"\n [attr.aria-disabled]=\"item.disabled\"\n [attr.id]=\"item.id\"\n [disabled]=\"item.disabled\"\n (click)=\"onItemClick(item)\">\n <!-- Start icon -->\n @if (item.startSymbolId) {\n <ap-symbol\n class=\"ap-action-dropdown__item-start-icon\"\n size=\"sm\"\n [color]=\"item.startSymbolColor ? item.startSymbolColor : item.redModeEnabled ? 'red' : 'basic-grey'\"\n [symbolId]=\"item.startSymbolId\"\n [apTooltip]=\"item.startSymbolTooltipText\" />\n }\n <!-- Label -->\n <div class=\"ap-action-dropdown__item-text-container\">\n <div class=\"ap-action-dropdown__item-label-container\">\n <div\n class=\"ap-action-dropdown__item-label\"\n [class.ap-action-dropdown__item-label--bold]=\"item.description\">\n {{ item.label }}\n </div>\n <!-- Badge -->\n @if (item.badgeLabel) {\n <ap-badge [color]=\"item.badgeColor ?? 'blue'\">\n {{ item.badgeLabel }}\n </ap-badge>\n }\n </div>\n <!-- Description -->\n <div class=\"ap-action-dropdown__item-description\">{{ item.description }}</div>\n </div>\n <!-- End icon -->\n @if (item.endSymbolId) {\n <ap-symbol\n class=\"ap-action-dropdown__item-end-icon\"\n size=\"sm\"\n color=\"#858FA1\"\n [symbolId]=\"item.endSymbolId\"\n [apTooltip]=\"item.endSymbolTooltipText\" />\n }\n <!-- Feature lock icon -->\n @if (item.featureLockEnabled) {\n <ap-symbol\n class=\"ap-action-dropdown__item-end-icon\"\n size=\"sm\"\n color=\"purple\"\n symbolId=\"feature-lock\" />\n }\n </button>\n </div>\n }\n </div>\n</ng-template>\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-avatar-group.mjs CHANGED Viewed

@@ -25,7 +25,7 @@ class AvatarGroupComponent {
         .reverse()
         .join(', '), ...(ngDevMode ? [{ debugName: "avatarNamesTooltip" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AvatarGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: AvatarGroupComponent, isStandalone: true, selector: "ap-avatar-group", inputs: { avatars: { classPropertyName: "avatars", publicName: "avatars", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, maxAvatars: { classPropertyName: "maxAvatars", publicName: "maxAvatars", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, properties: { "attr.aria-label": "\"Avatar group\"" } }, ngImport: i0, template: "@if (hasOverflow()) {\n    <div\n        class=\"overflow-counter\"\n        [apTooltip]=\"avatarNamesTooltip()\"\n        [attr.data-size]=\"size()\">\n        <span class=\"overflow-text\">+{{ overflowCount() }}</span>\n    </div>\n}\n\n@for (avatar of visibleAvatars(); track $index) {\n    <ap-avatar\n        [apTooltip]=\"avatar.username\"\n        [profilePicture]=\"avatar.profilePicture\"\n        [alt]=\"avatar.alt ?? ''\"\n        [network]=\"avatar.network\"\n        [size]=\"size()\"\n        [username]=\"avatar.username\"\n        [showInitials]=\"avatar.showInitials\"\n        [bigNetwork]=\"avatar.bigNetwork ?? false\"\n        [anonymous]=\"avatar.anonymous ?? false\"\n        [online]=\"avatar.online ?? false\"\n        [rounded]=\"avatar.rounded ?? true\" />\n}\n", styles: [":host{display:inline-flex;flex-direction:row-reverse;align-items:center;padding-left:2px}:host ap-avatar,:host .overflow-counter{margin-inline-start:-2px;cursor:default}.overflow-counter{display:flex;align-items:center;justify-content:center;background-color:var(--ref-color-grey-10);border-radius:24px;transition:background-color var(--ref-animation-short)}.overflow-counter:active{background-color:var(--ref-color-grey-40)}.overflow-counter:focus-visible{background-color:var(--ref-color-grey-20);outline:3px solid var(--ref-color-electric-blue-100);outline-offset:1px}.overflow-text{color:var(--ref-color-grey-80);font-family:var(--ref-font-family);font-weight:700;line-height:1em;text-align:center}.overflow-counter[data-size=\"16\"]{width:16px;height:16px}.overflow-counter[data-size=\"16\"] .overflow-text{font-size:8px}.overflow-counter[data-size=\"24\"]{width:24px;height:24px}.overflow-counter[data-size=\"24\"] .overflow-text{font-size:10px}.overflow-counter[data-size=\"32\"]{width:32px;height:32px}.overflow-counter[data-size=\"32\"] .overflow-text{font-size:12px}\n"], dependencies: [{ kind: "component", type: AvatarComponent, selector: "ap-avatar", inputs: ["profilePicture", "alt", "network", "size", "username", "showInitials", "bigNetwork", "anonymous", "online", "youtubeAvatarMode", "rounded"] }, { kind: "directive", type: TooltipDirective, selector: "[apTooltip]", inputs: ["apTooltip", "apTooltipPosition", "apTooltipShowDelay", "apTooltipHideDelay", "apTooltipDuration", "apTooltipDisabled", "apTooltipTruncatedTextOnly", "apTooltipTemplateContext", "apTooltipVirtualScrollElement", "apTooltipTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: AvatarGroupComponent, isStandalone: true, selector: "ap-avatar-group", inputs: { avatars: { classPropertyName: "avatars", publicName: "avatars", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, maxAvatars: { classPropertyName: "maxAvatars", publicName: "maxAvatars", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, properties: { "attr.aria-label": "\"Avatar group\"" } }, ngImport: i0, template: "@if (hasOverflow()) {\n    <div\n        class=\"overflow-counter\"\n        [apTooltip]=\"avatarNamesTooltip()\"\n        [attr.data-size]=\"size()\">\n        <span class=\"overflow-text\">+{{ overflowCount() }}</span>\n    </div>\n}\n\n@for (avatar of visibleAvatars(); track $index) {\n    <ap-avatar\n        [apTooltip]=\"avatar.username\"\n        [profilePicture]=\"avatar.profilePicture\"\n        [alt]=\"avatar.alt ?? ''\"\n        [network]=\"avatar.network\"\n        [size]=\"size()\"\n        [username]=\"avatar.username\"\n        [showInitials]=\"avatar.showInitials\"\n        [bigNetwork]=\"avatar.bigNetwork ?? false\"\n        [anonymous]=\"avatar.anonymous ?? false\"\n        [online]=\"avatar.online ?? false\"\n        [rounded]=\"avatar.rounded ?? true\" />\n}\n", styles: [":host{display:inline-flex;flex-direction:row-reverse;align-items:center;padding-left:2px}:host ap-avatar,:host .overflow-counter{margin-inline-start:-2px;cursor:default}.overflow-counter{display:flex;align-items:center;justify-content:center;background-color:var(--ref-color-grey-10);border-radius:24px;transition:background-color var(--ref-animation-short)}.overflow-counter:active{background-color:var(--ref-color-grey-40)}.overflow-counter:focus-visible{background-color:var(--ref-color-grey-20);outline:3px solid var(--ref-color-electric-blue-100);outline-offset:1px}.overflow-text{color:var(--ref-color-grey-80);font-family:var(--ref-font-family);font-weight:700;line-height:1em;text-align:center}.overflow-counter[data-size=\"16\"]{width:16px;height:16px}.overflow-counter[data-size=\"16\"] .overflow-text{font-size:8px}.overflow-counter[data-size=\"24\"]{width:24px;height:24px}.overflow-counter[data-size=\"24\"] .overflow-text{font-size:10px}.overflow-counter[data-size=\"32\"]{width:32px;height:32px}.overflow-counter[data-size=\"32\"] .overflow-text{font-size:12px}\n"], dependencies: [{ kind: "component", type: AvatarComponent, selector: "ap-avatar", inputs: ["profilePicture", "alt", "network", "size", "username", "showInitials", "bigNetwork", "anonymous", "online", "youtubeAvatarMode", "rounded"] }, { kind: "directive", type: TooltipDirective, selector: "[apTooltip]", inputs: ["apTooltip", "apTooltipPosition", "apTooltipShowDelay", "apTooltipHideDelay", "apTooltipDuration", "apTooltipDisabled", "apTooltipTruncatedTextOnly", "apTooltipTemplateContext", "apTooltipVirtualScrollElement", "apTooltipTrigger", "apTooltipType", "apTooltipPresentationContext", "apTooltipListItems"], exportAs: ["apTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: AvatarGroupComponent, decorators: [{
             type: Component,

package/fesm2022/agorapulse-ui-components-avatar-group.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"agorapulse-ui-components-avatar-group.mjs","sources":["../../../libs/ui-components/avatar-group/src/avatar-group.component.ts","../../../libs/ui-components/avatar-group/src/avatar-group.component.html","../../../libs/ui-components/avatar-group/src/agorapulse-ui-components-avatar-group.ts"],"sourcesContent":["import { AvatarComponent, AvatarNetwork } from '@agorapulse/ui-components/avatar';\nimport { TooltipDirective } from '@agorapulse/ui-components/tooltip';\nimport { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\n\nexport interface AvatarItem {\n profilePicture?: string;\n alt?: string;\n network?: AvatarNetwork;\n username: string;\n showInitials?: boolean \| string;\n bigNetwork?: boolean;\n anonymous?: boolean;\n online?: boolean;\n rounded?: boolean;\n}\n\nexport type AvatarGroupSize = 16 \| 24 \| 32;\n\n@Component({\n selector: 'ap-avatar-group',\n changeDetection: ChangeDetectionStrategy.OnPush,\n templateUrl: './avatar-group.component.html',\n styleUrls: ['./avatar-group.component.scss'],\n imports: [AvatarComponent, TooltipDirective],\n host: {\n role: 'group',\n '[attr.aria-label]': '\"Avatar group\"',\n },\n})\nexport class AvatarGroupComponent {\n avatars = input.required<AvatarItem[], AvatarItem[]>({\n transform: (value: AvatarItem[]) => [...value].reverse(),\n });\n size = input<AvatarGroupSize>(24);\n maxAvatars = input<number>(5);\n\n visibleAvatars = computed(() => {\n const max = this.maxAvatars();\n const all = this.avatars();\n return all.slice(0, max);\n });\n\n overflowCount = computed(() => {\n const total = this.avatars().length;\n const max = this.maxAvatars();\n return total > max ? total - max : 0;\n });\n\n hasOverflow = computed(() => this.overflowCount() > 0);\n avatarNamesTooltip = computed(() =>\n this.avatars()\n .map(avatar => avatar.username)\n .reverse()\n .join(', ')\n );\n}\n","@if (hasOverflow()) {\n <div\n class=\"overflow-counter\"\n [apTooltip]=\"avatarNamesTooltip()\"\n [attr.data-size]=\"size()\">\n <span class=\"overflow-text\">+{{ overflowCount() }}</span>\n </div>\n}\n\n@for (avatar of visibleAvatars(); track $index) {\n <ap-avatar\n [apTooltip]=\"avatar.username\"\n [profilePicture]=\"avatar.profilePicture\"\n [alt]=\"avatar.alt ?? ''\"\n [network]=\"avatar.network\"\n [size]=\"size()\"\n [username]=\"avatar.username\"\n [showInitials]=\"avatar.showInitials\"\n [bigNetwork]=\"avatar.bigNetwork ?? false\"\n [anonymous]=\"avatar.anonymous ?? false\"\n [online]=\"avatar.online ?? false\"\n [rounded]=\"avatar.rounded ?? true\" />\n}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public_api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"agorapulse-ui-components-avatar-group.mjs","sources":["../../../libs/ui-components/avatar-group/src/avatar-group.component.ts","../../../libs/ui-components/avatar-group/src/avatar-group.component.html","../../../libs/ui-components/avatar-group/src/agorapulse-ui-components-avatar-group.ts"],"sourcesContent":["import { AvatarComponent, AvatarNetwork } from '@agorapulse/ui-components/avatar';\nimport { TooltipDirective } from '@agorapulse/ui-components/tooltip';\nimport { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\n\nexport interface AvatarItem {\n profilePicture?: string;\n alt?: string;\n network?: AvatarNetwork;\n username: string;\n showInitials?: boolean \| string;\n bigNetwork?: boolean;\n anonymous?: boolean;\n online?: boolean;\n rounded?: boolean;\n}\n\nexport type AvatarGroupSize = 16 \| 24 \| 32;\n\n@Component({\n selector: 'ap-avatar-group',\n changeDetection: ChangeDetectionStrategy.OnPush,\n templateUrl: './avatar-group.component.html',\n styleUrls: ['./avatar-group.component.scss'],\n imports: [AvatarComponent, TooltipDirective],\n host: {\n role: 'group',\n '[attr.aria-label]': '\"Avatar group\"',\n },\n})\nexport class AvatarGroupComponent {\n avatars = input.required<AvatarItem[], AvatarItem[]>({\n transform: (value: AvatarItem[]) => [...value].reverse(),\n });\n size = input<AvatarGroupSize>(24);\n maxAvatars = input<number>(5);\n\n visibleAvatars = computed(() => {\n const max = this.maxAvatars();\n const all = this.avatars();\n return all.slice(0, max);\n });\n\n overflowCount = computed(() => {\n const total = this.avatars().length;\n const max = this.maxAvatars();\n return total > max ? total - max : 0;\n });\n\n hasOverflow = computed(() => this.overflowCount() > 0);\n avatarNamesTooltip = computed(() =>\n this.avatars()\n .map(avatar => avatar.username)\n .reverse()\n .join(', ')\n );\n}\n","@if (hasOverflow()) {\n <div\n class=\"overflow-counter\"\n [apTooltip]=\"avatarNamesTooltip()\"\n [attr.data-size]=\"size()\">\n <span class=\"overflow-text\">+{{ overflowCount() }}</span>\n </div>\n}\n\n@for (avatar of visibleAvatars(); track $index) {\n <ap-avatar\n [apTooltip]=\"avatar.username\"\n [profilePicture]=\"avatar.profilePicture\"\n [alt]=\"avatar.alt ?? ''\"\n [network]=\"avatar.network\"\n [size]=\"size()\"\n [username]=\"avatar.username\"\n [showInitials]=\"avatar.showInitials\"\n [bigNetwork]=\"avatar.bigNetwork ?? false\"\n [anonymous]=\"avatar.anonymous ?? false\"\n [online]=\"avatar.online ?? false\"\n [rounded]=\"avatar.rounded ?? true\" />\n}\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-button.mjs CHANGED Viewed

@@ -60,13 +60,13 @@ class ButtonComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: ButtonComponent, isStandalone: true, selector: "ap-button", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: true, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: false, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: false, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: false, isRequired: false, transformFunction: null }, locked: { classPropertyName: "locked", publicName: "locked", isSignal: false, isRequired: false, transformFunction: null }, menuTrigger: { classPropertyName: "menuTrigger", publicName: "menuTrigger", isSignal: false, isRequired: false, transformFunction: null }, symbolPosition: { classPropertyName: "symbolPosition", publicName: "symbolPosition", isSignal: false, isRequired: false, transformFunction: null }, symbolId: { classPropertyName: "symbolId", publicName: "symbolId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { menuOpened: "menuOpened", menuClosed: "menuClosed", click: "click", focus: "focus", blur: "blur" }, host: { listeners: { "window:keyup.space": "onSpaceKeyUp($event)" }, properties: { "attr.disabled": "loading || disabled || null" } }, viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true }], hostDirectives: [{ directive: i1.BaseButtonDirective }], ngImport: i0, template: "<button\n    #button\n    #trigger=\"matMenuTrigger\"\n    role=\"button\"\n    [matMenuTriggerFor]=\"menuTrigger\"\n    [class.primary]=\"config.style === 'primary' && !locked\"\n    [class.secondary]=\"config.style === 'secondary' && !locked\"\n    [class.ghost]=\"config.style === 'ghost' && !locked\"\n    [class.stroked]=\"(config.style === 'stroked' || config.style === 'stroked-transparent') && !locked\"\n    [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n    [class.mermaid]=\"config.style === 'mermaid' && !locked\"\n    [class.orange]=\"config.color === 'orange' && !locked\"\n    [class.blue]=\"config.color === 'blue' && !locked\"\n    [class.red]=\"config.color === 'red' && !locked\"\n    [class.grey]=\"config.color === 'grey' && !locked\"\n    [class.green]=\"config.color === 'green' && !locked\"\n    [class.loading]=\"loading && !locked\"\n    [class.locked]=\"locked\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [disabled]=\"disabled && !locked\"\n    [name]=\"name\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    [attr.id]=\"baseButtonDirective.hostId\"\n    [attr.type]=\"baseButtonDirective.hostType\"\n    [attr.form]=\"form\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"disabled?.toString()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"onFocusHandle($event)\"\n    (blur)=\"onBlurHandle($event)\"\n    (menuOpened)=\"menuOpened.emit()\"\n    (menuClosed)=\"menuClosed.emit()\">\n    <ng-content />\n    @if (symbolId()) {\n        <ap-symbol [symbolId]=\"symbolId()\" />\n    } @else {\n        <ng-content select=\"ap-symbol\" />\n    }\n    @if (loading && !locked) {\n        <div class=\"loading-bar\"></div>\n    }\n</button>\n@if (locked) {\n    <div class=\"locked-symbol\">\n        <ap-symbol\n            symbolId=\"feature-lock\"\n            size=\"sm\" />\n    </div>\n}\n", styles: ["ap-button{--loading-bar-width: 50px;display:inline-block;position:relative}ap-button[disabled]{pointer-events:none}ap-button button{border:none;border-radius:var(--comp-button-border-radius);padding:var(--comp-button-padding-horizontal) var(--comp-button-padding-vertical);position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;gap:var(--comp-split-button-spacing);flex-direction:row;font-size:var(--comp-button-text-size);font-family:var(--comp-button-text-font-family);line-height:var(--comp-button-text-line-height);font-weight:var(--comp-button-text-weight);max-height:var(--comp-button-height);min-height:var(--comp-button-height);white-space:nowrap;text-overflow:ellipsis;width:100%}ap-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-button button.inverse{flex-direction:row-reverse}ap-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-button button:disabled{pointer-events:none}@media (hover: hover){ap-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.loading{pointer-events:none}ap-button button.primary{color:var(--ref-color-white)}ap-button button.primary ap-symbol{color:var(--ref-color-white)}ap-button button.primary.orange{background:var(--ref-color-orange-100)}ap-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.secondary.orange{background:var(--ref-color-orange-10);color:var(--ref-color-orange-100)}ap-button button.secondary.orange ap-symbol{color:var(--ref-color-orange-100)}ap-button button.secondary.orange:hover{background-color:var(--ref-color-orange-20)}ap-button button.secondary.orange:active:not(:disabled){background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange:focus:not(:disabled):not(:active){background-color:var(--ref-color-orange-10)}ap-button button.secondary.orange:disabled{background-color:var(--ref-color-orange-10);color:var(--ref-color-orange-20)}ap-button button.secondary.orange:disabled ap-symbol{color:var(--ref-color-orange-20)}ap-button button.secondary.orange.loading{background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.secondary.blue{background:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue:hover{background-color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-10)}ap-button button.secondary.blue:disabled{background-color:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue.loading{background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.mermaid{background:linear-gradient(90deg,#578fff,#df52ff);color:var(--ref-color-grey-100);border:none;border-radius:var(--ref-border-radius-sm);position:relative;z-index:1}ap-button button.mermaid:after{content:\"\";position:absolute;inset:1px;background:var(--ref-color-white);border-radius:calc(var(--ref-border-radius-sm) - 1px);z-index:-1;pointer-events:none}ap-button button.mermaid ng-content,ap-button button.mermaid ap-symbol,ap-button button.mermaid .loading-bar{position:relative;z-index:1}ap-button button.mermaid:first-line{position:relative;z-index:1}ap-button button.mermaid:hover:after{background:var(--ref-color-mermaid-10)}ap-button button.mermaid:active:not(:disabled):after{background:var(--ref-color-mermaid-20)}@media (hover: hover){ap-button button.mermaid:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.mermaid:disabled{background:linear-gradient(90deg,var(--ref-color-mermaid-gradient-from40) 0%,var(--ref-color-mermaid-gradient-to40) 100%)}ap-button button.mermaid:disabled:after{background:var(--ref-color-white)}ap-button button.mermaid:disabled ap-symbol{opacity:.4}ap-button button.mermaid:disabled{color:var(--ref-color-grey-20)}ap-button button.mermaid.loading{background:linear-gradient(90deg,var(--ref-color-mermaid-gradient-from40) 0%,var(--ref-color-mermaid-gradient-to40) 100%)}ap-button button.mermaid.loading:after{background:var(--ref-color-white)}ap-button button.mermaid.loading ap-symbol{opacity:.4}ap-button button.mermaid.loading{color:var(--ref-color-grey-40)}ap-button button.mermaid .loading-bar{background:linear-gradient(90deg,var(--ref-color-mermaid-gradient-from) 0%,var(--ref-color-mermaid-gradient-to) 100%);position:absolute;z-index:2}ap-button button.stroked{background:var(--ref-color-white);border-width:1px;border-style:solid}ap-button button.stroked.grey{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-80)}ap-button button.stroked.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.stroked.grey:hover{border-color:var(--ref-color-grey-40)}ap-button button.stroked.grey:active:not(:disabled){border-color:var(--ref-color-grey-60)}ap-button button.stroked.grey:focus:not(:disabled):not(:active){border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.stroked.grey.loading{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-40)}ap-button button.stroked.grey.loading ap-symbol{color:var(--ref-color-grey-40)}ap-button button.stroked.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.stroked.blue{border-color:var(--ref-color-electric-blue-60);color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:hover{border-color:var(--ref-color-electric-blue-80)}ap-button button.stroked.blue:active:not(:disabled){border-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:focus:not(:disabled):not(:active){border-color:var(--ref-color-electric-blue-60)}ap-button button.stroked.blue:disabled{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue.loading{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.red{border-color:var(--ref-color-red-60);color:var(--ref-color-red-100)}ap-button button.stroked.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.stroked.red:hover{border-color:var(--ref-color-red-80)}ap-button button.stroked.red:active:not(:disabled){border-color:var(--ref-color-red-100)}ap-button button.stroked.red:focus:not(:disabled):not(:active){border-color:var(--ref-color-red-60)}ap-button button.stroked.red:disabled{border-color:var(--ref-color-red-20);color:var(--ref-color-red-20)}ap-button button.stroked.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.stroked.red.loading{border-color:var(--ref-color-red-20);color:var(--ref-color-red-40)}ap-button button.stroked.red.loading ap-symbol{color:var(--ref-color-red-40)}ap-button button.stroked.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.transparent{background:transparent}ap-button button.ghost{background:transparent}ap-button button.ghost.grey{color:var(--ref-color-grey-80)}ap-button button.ghost.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.ghost.grey:hover{background-color:var(--ref-color-grey-5)}ap-button button.ghost.grey:active:not(:disabled){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:focus:not(:disabled):not(:active){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:disabled{color:var(--ref-color-grey-20)}ap-button button.ghost.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.ghost.grey.loading:not(.locked){color:var(--ref-color-grey-40)}ap-button button.ghost.grey.loading:not(.locked) ap-symbol{color:var(--ref-color-grey-40)}ap-button button.ghost.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.ghost.blue{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue:hover{background-color:var(--ref-color-electric-blue-10)}ap-button button.ghost.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue.loading:not(.locked){color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue.loading:not(.locked) ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.ghost.red{color:var(--ref-color-red-100)}ap-button button.ghost.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.ghost.red:hover{background-color:var(--ref-color-red-10)}ap-button button.ghost.red:active:not(:disabled){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:focus:not(:disabled):not(:active){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled{color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.ghost.red.loading:not(.locked){color:var(--ref-color-red-40)}ap-button button.ghost.red.loading:not(.locked) ap-symbol{color:var(--ref-color-red-40)}ap-button button.ghost.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.ghost.green{color:var(--ref-color-green-100)}ap-button button.ghost.green ap-symbol{color:var(--ref-color-green-100)}ap-button button.ghost.green:hover{background-color:var(--ref-color-green-10)}ap-button button.ghost.green:active:not(:disabled){background-color:var(--ref-color-green-20)}ap-button button.ghost.green:focus:not(:disabled):not(:active){background-color:var(--ref-color-green-20)}ap-button button.ghost.green:disabled{color:var(--ref-color-green-20)}ap-button button.ghost.green:disabled ap-symbol{color:var(--ref-color-green-20)}ap-button button.ghost.green.loading:not(.locked){color:var(--ref-color-green-40)}ap-button button.ghost.green.loading:not(.locked) ap-symbol{color:var(--ref-color-green-40)}ap-button button.ghost.green .loading-bar{background-color:var(--ref-color-green-100)}ap-button button.locked{background-color:var(--ref-color-purple-10);color:var(--ref-color-purple-80)}ap-button button.locked ap-symbol{color:var(--ref-color-purple-80)}ap-button button.locked:hover{background-color:var(--ref-color-purple-20);border-color:var(--ref-color-purple-40)}ap-button button.locked:active:not(:disabled){background-color:var(--ref-color-purple-40);border-color:var(--ref-color-purple-60)}ap-button button.locked:focus:not(:disabled):not(:active){background-color:var(--ref-color-purple-20);border-color:var(--ref-color-purple-20)}ap-button button.locked:disabled{color:var(--ref-color-purple-)}ap-button button.locked:disabled ap-symbol{color:var(--ref-color-purple-)}ap-button button.locked.loading:not(.locked){color:var(--ref-color-purple-)}ap-button button.locked.loading:not(.locked) ap-symbol{color:var(--ref-color-purple-)}ap-button button.locked .loading-bar{background-color:var(--ref-color-purple-)}ap-button button.locked{border:1px solid var(--ref-color-purple-20)}ap-button .loading-bar{position:absolute;bottom:0;left:var(--comp-button-padding-vertical);width:var(--loading-bar-width);height:5px;border-radius:8px;animation:slide 1.5s ease-in-out infinite}@keyframes slide{0%{left:calc(var(--loading-bar-width) * -1)}to{left:100%}}ap-button .locked-symbol{position:absolute;top:-6px;right:-6px;border-radius:100%;background:var(--ref-color-white)}ap-button .locked-symbol ap-symbol{color:var(--ref-color-purple-100)}\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: ButtonComponent, isStandalone: true, selector: "ap-button", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: true, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: false, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: false, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: false, isRequired: false, transformFunction: null }, locked: { classPropertyName: "locked", publicName: "locked", isSignal: false, isRequired: false, transformFunction: null }, menuTrigger: { classPropertyName: "menuTrigger", publicName: "menuTrigger", isSignal: false, isRequired: false, transformFunction: null }, symbolPosition: { classPropertyName: "symbolPosition", publicName: "symbolPosition", isSignal: false, isRequired: false, transformFunction: null }, symbolId: { classPropertyName: "symbolId", publicName: "symbolId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { menuOpened: "menuOpened", menuClosed: "menuClosed", click: "click", focus: "focus", blur: "blur" }, host: { listeners: { "window:keyup.space": "onSpaceKeyUp($event)" }, properties: { "attr.disabled": "loading || disabled || null" } }, viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["button"], descendants: true }], hostDirectives: [{ directive: i1.BaseButtonDirective }], ngImport: i0, template: "<button\n    #button\n    #trigger=\"matMenuTrigger\"\n    role=\"button\"\n    [matMenuTriggerFor]=\"menuTrigger\"\n    [class.primary]=\"config.style === 'primary' && !locked\"\n    [class.secondary]=\"config.style === 'secondary' && !locked\"\n    [class.ghost]=\"config.style === 'ghost' && !locked\"\n    [class.stroked]=\"(config.style === 'stroked' || config.style === 'stroked-transparent') && !locked\"\n    [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n    [class.mermaid]=\"config.style === 'mermaid' && !locked\"\n    [class.orange]=\"config.color === 'orange' && !locked\"\n    [class.blue]=\"config.color === 'blue' && !locked\"\n    [class.red]=\"config.color === 'red' && !locked\"\n    [class.grey]=\"config.color === 'grey' && !locked\"\n    [class.green]=\"config.color === 'green' && !locked\"\n    [class.loading]=\"loading && !locked\"\n    [class.locked]=\"locked\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [disabled]=\"disabled && !locked\"\n    [name]=\"name\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    [attr.id]=\"baseButtonDirective.hostId\"\n    [attr.type]=\"baseButtonDirective.hostType\"\n    [attr.form]=\"form\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"disabled?.toString()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"onFocusHandle($event)\"\n    (blur)=\"onBlurHandle($event)\"\n    (menuOpened)=\"menuOpened.emit()\"\n    (menuClosed)=\"menuClosed.emit()\">\n    <ng-content />\n    @if (symbolId()) {\n        <ap-symbol [symbolId]=\"symbolId()\" />\n    } @else {\n        <ng-content select=\"ap-symbol\" />\n    }\n    @if (loading && !locked) {\n        <div class=\"loading-bar\"></div>\n    }\n</button>\n@if (locked) {\n    <div class=\"locked-symbol\">\n        <ap-symbol\n            symbolId=\"feature-lock\"\n            size=\"sm\" />\n    </div>\n}\n", styles: ["ap-button{--loading-bar-width: 50px;display:inline-block;position:relative}ap-button[disabled]{pointer-events:none}ap-button button{border:none;border-radius:var(--comp-button-border-radius);padding:var(--comp-button-padding-horizontal) var(--comp-button-padding-vertical);position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;gap:var(--comp-split-button-spacing);flex-direction:row;font-size:var(--comp-button-text-size);font-family:var(--comp-button-text-font-family);line-height:var(--comp-button-text-line-height);font-weight:var(--comp-button-text-weight);max-height:var(--comp-button-height);min-height:var(--comp-button-height);white-space:nowrap;text-overflow:ellipsis;width:100%}ap-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-button button.inverse{flex-direction:row-reverse}ap-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-button button:disabled{pointer-events:none}@media (hover: hover){ap-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.loading{pointer-events:none}ap-button button.primary{color:var(--ref-color-white)}ap-button button.primary ap-symbol{color:var(--ref-color-white)}ap-button button.primary.orange{background:var(--ref-color-orange-100)}ap-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.secondary.orange{background:var(--ref-color-orange-10);color:var(--ref-color-orange-100)}ap-button button.secondary.orange ap-symbol{color:var(--ref-color-orange-100)}ap-button button.secondary.orange:hover{background-color:var(--ref-color-orange-20)}ap-button button.secondary.orange:active:not(:disabled){background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange:focus:not(:disabled):not(:active){background-color:var(--ref-color-orange-10)}ap-button button.secondary.orange:disabled{background-color:var(--ref-color-orange-10);color:var(--ref-color-orange-20)}ap-button button.secondary.orange:disabled ap-symbol{color:var(--ref-color-orange-20)}ap-button button.secondary.orange.loading{background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.secondary.blue{background:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue:hover{background-color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-10)}ap-button button.secondary.blue:disabled{background-color:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue.loading{background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.mermaid{background:linear-gradient(90deg,#578fff,#df52ff);color:var(--ref-color-grey-100);border:none;border-radius:var(--ref-border-radius-sm);position:relative;z-index:1}ap-button button.mermaid:after{content:\"\";position:absolute;inset:1px;background:var(--ref-color-white);border-radius:calc(var(--ref-border-radius-sm) - 1px);z-index:-1;pointer-events:none}ap-button button.mermaid ng-content,ap-button button.mermaid ap-symbol,ap-button button.mermaid .loading-bar{position:relative;z-index:1}ap-button button.mermaid:first-line{position:relative;z-index:1}ap-button button.mermaid:hover:after{background:var(--ref-color-mermaid-10)}ap-button button.mermaid:active:not(:disabled):after{background:var(--ref-color-mermaid-20)}@media (hover: hover){ap-button button.mermaid:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.mermaid:disabled{background:linear-gradient(90deg,var(--ref-color-mermaid-gradient-from40) 0%,var(--ref-color-mermaid-gradient-to40) 100%)}ap-button button.mermaid:disabled:after{background:var(--ref-color-white)}ap-button button.mermaid:disabled ap-symbol{opacity:.4}ap-button button.mermaid:disabled{color:var(--ref-color-grey-20)}ap-button button.mermaid.loading{background:linear-gradient(90deg,var(--ref-color-mermaid-gradient-from40) 0%,var(--ref-color-mermaid-gradient-to40) 100%)}ap-button button.mermaid.loading:after{background:var(--ref-color-white)}ap-button button.mermaid.loading ap-symbol{opacity:.4}ap-button button.mermaid.loading{color:var(--ref-color-grey-40)}ap-button button.mermaid .loading-bar{background:linear-gradient(90deg,var(--ref-color-mermaid-gradient-from) 0%,var(--ref-color-mermaid-gradient-to) 100%);position:absolute;z-index:2}ap-button button.stroked{background:var(--ref-color-white);border-width:1px;border-style:solid}ap-button button.stroked.grey{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-80)}ap-button button.stroked.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.stroked.grey:hover{border-color:var(--ref-color-grey-40)}ap-button button.stroked.grey:active:not(:disabled){border-color:var(--ref-color-grey-60)}ap-button button.stroked.grey:focus:not(:disabled):not(:active){border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.stroked.grey.loading{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-40)}ap-button button.stroked.grey.loading ap-symbol{color:var(--ref-color-grey-40)}ap-button button.stroked.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.stroked.blue{border-color:var(--ref-color-electric-blue-60);color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:hover{border-color:var(--ref-color-electric-blue-80)}ap-button button.stroked.blue:active:not(:disabled){border-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:focus:not(:disabled):not(:active){border-color:var(--ref-color-electric-blue-60)}ap-button button.stroked.blue:disabled{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue.loading{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.red{border-color:var(--ref-color-red-60);color:var(--ref-color-red-100)}ap-button button.stroked.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.stroked.red:hover{border-color:var(--ref-color-red-80)}ap-button button.stroked.red:active:not(:disabled){border-color:var(--ref-color-red-100)}ap-button button.stroked.red:focus:not(:disabled):not(:active){border-color:var(--ref-color-red-60)}ap-button button.stroked.red:disabled{border-color:var(--ref-color-red-20);color:var(--ref-color-red-20)}ap-button button.stroked.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.stroked.red.loading{border-color:var(--ref-color-red-20);color:var(--ref-color-red-40)}ap-button button.stroked.red.loading ap-symbol{color:var(--ref-color-red-40)}ap-button button.stroked.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.transparent{background:transparent}ap-button button.ghost{background:transparent}ap-button button.ghost.grey{color:var(--ref-color-grey-80)}ap-button button.ghost.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.ghost.grey:hover{background-color:var(--ref-color-grey-05)}ap-button button.ghost.grey:active:not(:disabled){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:focus:not(:disabled):not(:active){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:disabled{color:var(--ref-color-grey-20)}ap-button button.ghost.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.ghost.grey.loading:not(.locked){color:var(--ref-color-grey-40)}ap-button button.ghost.grey.loading:not(.locked) ap-symbol{color:var(--ref-color-grey-40)}ap-button button.ghost.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.ghost.blue{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue:hover{background-color:var(--ref-color-electric-blue-10)}ap-button button.ghost.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue.loading:not(.locked){color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue.loading:not(.locked) ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.ghost.red{color:var(--ref-color-red-100)}ap-button button.ghost.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.ghost.red:hover{background-color:var(--ref-color-red-10)}ap-button button.ghost.red:active:not(:disabled){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:focus:not(:disabled):not(:active){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled{color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.ghost.red.loading:not(.locked){color:var(--ref-color-red-40)}ap-button button.ghost.red.loading:not(.locked) ap-symbol{color:var(--ref-color-red-40)}ap-button button.ghost.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.ghost.green{color:var(--ref-color-green-100)}ap-button button.ghost.green ap-symbol{color:var(--ref-color-green-100)}ap-button button.ghost.green:hover{background-color:var(--ref-color-green-10)}ap-button button.ghost.green:active:not(:disabled){background-color:var(--ref-color-green-20)}ap-button button.ghost.green:focus:not(:disabled):not(:active){background-color:var(--ref-color-green-20)}ap-button button.ghost.green:disabled{color:var(--ref-color-green-20)}ap-button button.ghost.green:disabled ap-symbol{color:var(--ref-color-green-20)}ap-button button.ghost.green.loading:not(.locked){color:var(--ref-color-green-40)}ap-button button.ghost.green.loading:not(.locked) ap-symbol{color:var(--ref-color-green-40)}ap-button button.ghost.green .loading-bar{background-color:var(--ref-color-green-100)}ap-button button.locked{background-color:var(--ref-color-purple-10);color:var(--ref-color-purple-80)}ap-button button.locked ap-symbol{color:var(--ref-color-purple-80)}ap-button button.locked:hover{background-color:var(--ref-color-purple-20);border-color:var(--ref-color-purple-40)}ap-button button.locked:active:not(:disabled){background-color:var(--ref-color-purple-40);border-color:var(--ref-color-purple-60)}ap-button button.locked:focus:not(:disabled):not(:active){background-color:var(--ref-color-purple-20);border-color:var(--ref-color-purple-20)}ap-button button.locked:disabled{color:var(--ref-color-purple-)}ap-button button.locked:disabled ap-symbol{color:var(--ref-color-purple-)}ap-button button.locked.loading:not(.locked){color:var(--ref-color-purple-)}ap-button button.locked.loading:not(.locked) ap-symbol{color:var(--ref-color-purple-)}ap-button button.locked .loading-bar{background-color:var(--ref-color-purple-)}ap-button button.locked{border:1px solid var(--ref-color-purple-20)}ap-button .loading-bar{position:absolute;bottom:0;left:var(--comp-button-padding-vertical);width:var(--loading-bar-width);height:5px;border-radius:8px;animation:slide 1.5s ease-in-out infinite}@keyframes slide{0%{left:calc(var(--loading-bar-width) * -1)}to{left:100%}}ap-button .locked-symbol{position:absolute;top:-6px;right:-6px;border-radius:100%;background:var(--ref-color-white)}ap-button .locked-symbol ap-symbol{color:var(--ref-color-purple-100)}\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 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ButtonComponent, decorators: [{
             type: Component,
             args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ap-button', imports: [SymbolComponent, MatMenuModule], encapsulation: ViewEncapsulation.None, hostDirectives: [BaseButtonDirective], host: {
                         '[attr.disabled]': 'loading || disabled || null',
-                    }, template: "<button\n    #button\n    #trigger=\"matMenuTrigger\"\n    role=\"button\"\n    [matMenuTriggerFor]=\"menuTrigger\"\n    [class.primary]=\"config.style === 'primary' && !locked\"\n    [class.secondary]=\"config.style === 'secondary' && !locked\"\n    [class.ghost]=\"config.style === 'ghost' && !locked\"\n    [class.stroked]=\"(config.style === 'stroked' || config.style === 'stroked-transparent') && !locked\"\n    [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n    [class.mermaid]=\"config.style === 'mermaid' && !locked\"\n    [class.orange]=\"config.color === 'orange' && !locked\"\n    [class.blue]=\"config.color === 'blue' && !locked\"\n    [class.red]=\"config.color === 'red' && !locked\"\n    [class.grey]=\"config.color === 'grey' && !locked\"\n    [class.green]=\"config.color === 'green' && !locked\"\n    [class.loading]=\"loading && !locked\"\n    [class.locked]=\"locked\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [disabled]=\"disabled && !locked\"\n    [name]=\"name\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    [attr.id]=\"baseButtonDirective.hostId\"\n    [attr.type]=\"baseButtonDirective.hostType\"\n    [attr.form]=\"form\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"disabled?.toString()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"onFocusHandle($event)\"\n    (blur)=\"onBlurHandle($event)\"\n    (menuOpened)=\"menuOpened.emit()\"\n    (menuClosed)=\"menuClosed.emit()\">\n    <ng-content />\n    @if (symbolId()) {\n        <ap-symbol [symbolId]=\"symbolId()\" />\n    } @else {\n        <ng-content select=\"ap-symbol\" />\n    }\n    @if (loading && !locked) {\n        <div class=\"loading-bar\"></div>\n    }\n</button>\n@if (locked) {\n    <div class=\"locked-symbol\">\n        <ap-symbol\n            symbolId=\"feature-lock\"\n            size=\"sm\" />\n    </div>\n}\n", styles: ["ap-button{--loading-bar-width: 50px;display:inline-block;position:relative}ap-button[disabled]{pointer-events:none}ap-button button{border:none;border-radius:var(--comp-button-border-radius);padding:var(--comp-button-padding-horizontal) var(--comp-button-padding-vertical);position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;gap:var(--comp-split-button-spacing);flex-direction:row;font-size:var(--comp-button-text-size);font-family:var(--comp-button-text-font-family);line-height:var(--comp-button-text-line-height);font-weight:var(--comp-button-text-weight);max-height:var(--comp-button-height);min-height:var(--comp-button-height);white-space:nowrap;text-overflow:ellipsis;width:100%}ap-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-button button.inverse{flex-direction:row-reverse}ap-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-button button:disabled{pointer-events:none}@media (hover: hover){ap-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.loading{pointer-events:none}ap-button button.primary{color:var(--ref-color-white)}ap-button button.primary ap-symbol{color:var(--ref-color-white)}ap-button button.primary.orange{background:var(--ref-color-orange-100)}ap-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.secondary.orange{background:var(--ref-color-orange-10);color:var(--ref-color-orange-100)}ap-button button.secondary.orange ap-symbol{color:var(--ref-color-orange-100)}ap-button button.secondary.orange:hover{background-color:var(--ref-color-orange-20)}ap-button button.secondary.orange:active:not(:disabled){background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange:focus:not(:disabled):not(:active){background-color:var(--ref-color-orange-10)}ap-button button.secondary.orange:disabled{background-color:var(--ref-color-orange-10);color:var(--ref-color-orange-20)}ap-button button.secondary.orange:disabled ap-symbol{color:var(--ref-color-orange-20)}ap-button button.secondary.orange.loading{background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.secondary.blue{background:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue:hover{background-color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-10)}ap-button button.secondary.blue:disabled{background-color:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue.loading{background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.mermaid{background:linear-gradient(90deg,#578fff,#df52ff);color:var(--ref-color-grey-100);border:none;border-radius:var(--ref-border-radius-sm);position:relative;z-index:1}ap-button button.mermaid:after{content:\"\";position:absolute;inset:1px;background:var(--ref-color-white);border-radius:calc(var(--ref-border-radius-sm) - 1px);z-index:-1;pointer-events:none}ap-button button.mermaid ng-content,ap-button button.mermaid ap-symbol,ap-button button.mermaid .loading-bar{position:relative;z-index:1}ap-button button.mermaid:first-line{position:relative;z-index:1}ap-button button.mermaid:hover:after{background:var(--ref-color-mermaid-10)}ap-button button.mermaid:active:not(:disabled):after{background:var(--ref-color-mermaid-20)}@media (hover: hover){ap-button button.mermaid:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.mermaid:disabled{background:linear-gradient(90deg,var(--ref-color-mermaid-gradient-from40) 0%,var(--ref-color-mermaid-gradient-to40) 100%)}ap-button button.mermaid:disabled:after{background:var(--ref-color-white)}ap-button button.mermaid:disabled ap-symbol{opacity:.4}ap-button button.mermaid:disabled{color:var(--ref-color-grey-20)}ap-button button.mermaid.loading{background:linear-gradient(90deg,var(--ref-color-mermaid-gradient-from40) 0%,var(--ref-color-mermaid-gradient-to40) 100%)}ap-button button.mermaid.loading:after{background:var(--ref-color-white)}ap-button button.mermaid.loading ap-symbol{opacity:.4}ap-button button.mermaid.loading{color:var(--ref-color-grey-40)}ap-button button.mermaid .loading-bar{background:linear-gradient(90deg,var(--ref-color-mermaid-gradient-from) 0%,var(--ref-color-mermaid-gradient-to) 100%);position:absolute;z-index:2}ap-button button.stroked{background:var(--ref-color-white);border-width:1px;border-style:solid}ap-button button.stroked.grey{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-80)}ap-button button.stroked.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.stroked.grey:hover{border-color:var(--ref-color-grey-40)}ap-button button.stroked.grey:active:not(:disabled){border-color:var(--ref-color-grey-60)}ap-button button.stroked.grey:focus:not(:disabled):not(:active){border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.stroked.grey.loading{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-40)}ap-button button.stroked.grey.loading ap-symbol{color:var(--ref-color-grey-40)}ap-button button.stroked.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.stroked.blue{border-color:var(--ref-color-electric-blue-60);color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:hover{border-color:var(--ref-color-electric-blue-80)}ap-button button.stroked.blue:active:not(:disabled){border-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:focus:not(:disabled):not(:active){border-color:var(--ref-color-electric-blue-60)}ap-button button.stroked.blue:disabled{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue.loading{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.red{border-color:var(--ref-color-red-60);color:var(--ref-color-red-100)}ap-button button.stroked.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.stroked.red:hover{border-color:var(--ref-color-red-80)}ap-button button.stroked.red:active:not(:disabled){border-color:var(--ref-color-red-100)}ap-button button.stroked.red:focus:not(:disabled):not(:active){border-color:var(--ref-color-red-60)}ap-button button.stroked.red:disabled{border-color:var(--ref-color-red-20);color:var(--ref-color-red-20)}ap-button button.stroked.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.stroked.red.loading{border-color:var(--ref-color-red-20);color:var(--ref-color-red-40)}ap-button button.stroked.red.loading ap-symbol{color:var(--ref-color-red-40)}ap-button button.stroked.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.transparent{background:transparent}ap-button button.ghost{background:transparent}ap-button button.ghost.grey{color:var(--ref-color-grey-80)}ap-button button.ghost.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.ghost.grey:hover{background-color:var(--ref-color-grey-5)}ap-button button.ghost.grey:active:not(:disabled){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:focus:not(:disabled):not(:active){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:disabled{color:var(--ref-color-grey-20)}ap-button button.ghost.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.ghost.grey.loading:not(.locked){color:var(--ref-color-grey-40)}ap-button button.ghost.grey.loading:not(.locked) ap-symbol{color:var(--ref-color-grey-40)}ap-button button.ghost.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.ghost.blue{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue:hover{background-color:var(--ref-color-electric-blue-10)}ap-button button.ghost.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue.loading:not(.locked){color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue.loading:not(.locked) ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.ghost.red{color:var(--ref-color-red-100)}ap-button button.ghost.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.ghost.red:hover{background-color:var(--ref-color-red-10)}ap-button button.ghost.red:active:not(:disabled){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:focus:not(:disabled):not(:active){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled{color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.ghost.red.loading:not(.locked){color:var(--ref-color-red-40)}ap-button button.ghost.red.loading:not(.locked) ap-symbol{color:var(--ref-color-red-40)}ap-button button.ghost.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.ghost.green{color:var(--ref-color-green-100)}ap-button button.ghost.green ap-symbol{color:var(--ref-color-green-100)}ap-button button.ghost.green:hover{background-color:var(--ref-color-green-10)}ap-button button.ghost.green:active:not(:disabled){background-color:var(--ref-color-green-20)}ap-button button.ghost.green:focus:not(:disabled):not(:active){background-color:var(--ref-color-green-20)}ap-button button.ghost.green:disabled{color:var(--ref-color-green-20)}ap-button button.ghost.green:disabled ap-symbol{color:var(--ref-color-green-20)}ap-button button.ghost.green.loading:not(.locked){color:var(--ref-color-green-40)}ap-button button.ghost.green.loading:not(.locked) ap-symbol{color:var(--ref-color-green-40)}ap-button button.ghost.green .loading-bar{background-color:var(--ref-color-green-100)}ap-button button.locked{background-color:var(--ref-color-purple-10);color:var(--ref-color-purple-80)}ap-button button.locked ap-symbol{color:var(--ref-color-purple-80)}ap-button button.locked:hover{background-color:var(--ref-color-purple-20);border-color:var(--ref-color-purple-40)}ap-button button.locked:active:not(:disabled){background-color:var(--ref-color-purple-40);border-color:var(--ref-color-purple-60)}ap-button button.locked:focus:not(:disabled):not(:active){background-color:var(--ref-color-purple-20);border-color:var(--ref-color-purple-20)}ap-button button.locked:disabled{color:var(--ref-color-purple-)}ap-button button.locked:disabled ap-symbol{color:var(--ref-color-purple-)}ap-button button.locked.loading:not(.locked){color:var(--ref-color-purple-)}ap-button button.locked.loading:not(.locked) ap-symbol{color:var(--ref-color-purple-)}ap-button button.locked .loading-bar{background-color:var(--ref-color-purple-)}ap-button button.locked{border:1px solid var(--ref-color-purple-20)}ap-button .loading-bar{position:absolute;bottom:0;left:var(--comp-button-padding-vertical);width:var(--loading-bar-width);height:5px;border-radius:8px;animation:slide 1.5s ease-in-out infinite}@keyframes slide{0%{left:calc(var(--loading-bar-width) * -1)}to{left:100%}}ap-button .locked-symbol{position:absolute;top:-6px;right:-6px;border-radius:100%;background:var(--ref-color-white)}ap-button .locked-symbol ap-symbol{color:var(--ref-color-purple-100)}\n"] }]
+                    }, template: "<button\n    #button\n    #trigger=\"matMenuTrigger\"\n    role=\"button\"\n    [matMenuTriggerFor]=\"menuTrigger\"\n    [class.primary]=\"config.style === 'primary' && !locked\"\n    [class.secondary]=\"config.style === 'secondary' && !locked\"\n    [class.ghost]=\"config.style === 'ghost' && !locked\"\n    [class.stroked]=\"(config.style === 'stroked' || config.style === 'stroked-transparent') && !locked\"\n    [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n    [class.mermaid]=\"config.style === 'mermaid' && !locked\"\n    [class.orange]=\"config.color === 'orange' && !locked\"\n    [class.blue]=\"config.color === 'blue' && !locked\"\n    [class.red]=\"config.color === 'red' && !locked\"\n    [class.grey]=\"config.color === 'grey' && !locked\"\n    [class.green]=\"config.color === 'green' && !locked\"\n    [class.loading]=\"loading && !locked\"\n    [class.locked]=\"locked\"\n    [class.inverse]=\"symbolPosition === 'left'\"\n    [disabled]=\"disabled && !locked\"\n    [name]=\"name\"\n    [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n    [attr.id]=\"baseButtonDirective.hostId\"\n    [attr.type]=\"baseButtonDirective.hostType\"\n    [attr.form]=\"form\"\n    [attr.aria-label]=\"ariaLabel || null\"\n    [attr.aria-disabled]=\"disabled?.toString()\"\n    (click)=\"onClickHandle($event)\"\n    (focus)=\"onFocusHandle($event)\"\n    (blur)=\"onBlurHandle($event)\"\n    (menuOpened)=\"menuOpened.emit()\"\n    (menuClosed)=\"menuClosed.emit()\">\n    <ng-content />\n    @if (symbolId()) {\n        <ap-symbol [symbolId]=\"symbolId()\" />\n    } @else {\n        <ng-content select=\"ap-symbol\" />\n    }\n    @if (loading && !locked) {\n        <div class=\"loading-bar\"></div>\n    }\n</button>\n@if (locked) {\n    <div class=\"locked-symbol\">\n        <ap-symbol\n            symbolId=\"feature-lock\"\n            size=\"sm\" />\n    </div>\n}\n", styles: ["ap-button{--loading-bar-width: 50px;display:inline-block;position:relative}ap-button[disabled]{pointer-events:none}ap-button button{border:none;border-radius:var(--comp-button-border-radius);padding:var(--comp-button-padding-horizontal) var(--comp-button-padding-vertical);position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;gap:var(--comp-split-button-spacing);flex-direction:row;font-size:var(--comp-button-text-size);font-family:var(--comp-button-text-font-family);line-height:var(--comp-button-text-line-height);font-weight:var(--comp-button-text-weight);max-height:var(--comp-button-height);min-height:var(--comp-button-height);white-space:nowrap;text-overflow:ellipsis;width:100%}ap-button button ap-symbol{width:16px;min-width:16px;max-width:16px;height:16px;min-height:16px;max-height:16px}ap-button button.inverse{flex-direction:row-reverse}ap-button button:hover:not(:disabled):not(.loading){cursor:pointer}ap-button button:disabled{pointer-events:none}@media (hover: hover){ap-button button:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.loading{pointer-events:none}ap-button button.primary{color:var(--ref-color-white)}ap-button button.primary ap-symbol{color:var(--ref-color-white)}ap-button button.primary.orange{background:var(--ref-color-orange-100)}ap-button button.primary.orange:hover{background-color:var(--ref-color-orange-80)}ap-button button.primary.orange:active:not(:disabled){background-color:var(--ref-color-orange-60)}ap-button button.primary.orange:disabled{background-color:var(--ref-color-orange-20)}ap-button button.primary.orange.loading{background-color:var(--ref-color-orange-60)}ap-button button.primary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.primary.blue{background:var(--ref-color-electric-blue-100)}ap-button button.primary.blue:hover{background-color:var(--ref-color-electric-blue-80)}ap-button button.primary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue:disabled{background-color:var(--ref-color-electric-blue-20)}ap-button button.primary.blue.loading{background-color:var(--ref-color-electric-blue-60)}ap-button button.primary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.secondary.orange{background:var(--ref-color-orange-10);color:var(--ref-color-orange-100)}ap-button button.secondary.orange ap-symbol{color:var(--ref-color-orange-100)}ap-button button.secondary.orange:hover{background-color:var(--ref-color-orange-20)}ap-button button.secondary.orange:active:not(:disabled){background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange:focus:not(:disabled):not(:active){background-color:var(--ref-color-orange-10)}ap-button button.secondary.orange:disabled{background-color:var(--ref-color-orange-10);color:var(--ref-color-orange-20)}ap-button button.secondary.orange:disabled ap-symbol{color:var(--ref-color-orange-20)}ap-button button.secondary.orange.loading{background-color:var(--ref-color-orange-40)}ap-button button.secondary.orange .loading-bar{background-color:var(--ref-color-orange-100)}ap-button button.secondary.blue{background:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.secondary.blue:hover{background-color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-10)}ap-button button.secondary.blue:disabled{background-color:var(--ref-color-electric-blue-10);color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.secondary.blue.loading{background-color:var(--ref-color-electric-blue-40)}ap-button button.secondary.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.mermaid{background:linear-gradient(90deg,#578fff,#df52ff);color:var(--ref-color-grey-100);border:none;border-radius:var(--ref-border-radius-sm);position:relative;z-index:1}ap-button button.mermaid:after{content:\"\";position:absolute;inset:1px;background:var(--ref-color-white);border-radius:calc(var(--ref-border-radius-sm) - 1px);z-index:-1;pointer-events:none}ap-button button.mermaid ng-content,ap-button button.mermaid ap-symbol,ap-button button.mermaid .loading-bar{position:relative;z-index:1}ap-button button.mermaid:first-line{position:relative;z-index:1}ap-button button.mermaid:hover:after{background:var(--ref-color-mermaid-10)}ap-button button.mermaid:active:not(:disabled):after{background:var(--ref-color-mermaid-20)}@media (hover: hover){ap-button button.mermaid:focus:not(:disabled):not(:active):not(.loading){outline:2px solid var(--ref-color-electric-blue-100);outline-offset:1px}}ap-button button.mermaid:disabled{background:linear-gradient(90deg,var(--ref-color-mermaid-gradient-from40) 0%,var(--ref-color-mermaid-gradient-to40) 100%)}ap-button button.mermaid:disabled:after{background:var(--ref-color-white)}ap-button button.mermaid:disabled ap-symbol{opacity:.4}ap-button button.mermaid:disabled{color:var(--ref-color-grey-20)}ap-button button.mermaid.loading{background:linear-gradient(90deg,var(--ref-color-mermaid-gradient-from40) 0%,var(--ref-color-mermaid-gradient-to40) 100%)}ap-button button.mermaid.loading:after{background:var(--ref-color-white)}ap-button button.mermaid.loading ap-symbol{opacity:.4}ap-button button.mermaid.loading{color:var(--ref-color-grey-40)}ap-button button.mermaid .loading-bar{background:linear-gradient(90deg,var(--ref-color-mermaid-gradient-from) 0%,var(--ref-color-mermaid-gradient-to) 100%);position:absolute;z-index:2}ap-button button.stroked{background:var(--ref-color-white);border-width:1px;border-style:solid}ap-button button.stroked.grey{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-80)}ap-button button.stroked.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.stroked.grey:hover{border-color:var(--ref-color-grey-40)}ap-button button.stroked.grey:active:not(:disabled){border-color:var(--ref-color-grey-60)}ap-button button.stroked.grey:focus:not(:disabled):not(:active){border-color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-20)}ap-button button.stroked.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.stroked.grey.loading{border-color:var(--ref-color-grey-20);color:var(--ref-color-grey-40)}ap-button button.stroked.grey.loading ap-symbol{color:var(--ref-color-grey-40)}ap-button button.stroked.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.stroked.blue{border-color:var(--ref-color-electric-blue-60);color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:hover{border-color:var(--ref-color-electric-blue-80)}ap-button button.stroked.blue:active:not(:disabled){border-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.blue:focus:not(:disabled):not(:active){border-color:var(--ref-color-electric-blue-60)}ap-button button.stroked.blue:disabled{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.stroked.blue.loading{border-color:var(--ref-color-electric-blue-20);color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue.loading ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.stroked.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.stroked.red{border-color:var(--ref-color-red-60);color:var(--ref-color-red-100)}ap-button button.stroked.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.stroked.red:hover{border-color:var(--ref-color-red-80)}ap-button button.stroked.red:active:not(:disabled){border-color:var(--ref-color-red-100)}ap-button button.stroked.red:focus:not(:disabled):not(:active){border-color:var(--ref-color-red-60)}ap-button button.stroked.red:disabled{border-color:var(--ref-color-red-20);color:var(--ref-color-red-20)}ap-button button.stroked.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.stroked.red.loading{border-color:var(--ref-color-red-20);color:var(--ref-color-red-40)}ap-button button.stroked.red.loading ap-symbol{color:var(--ref-color-red-40)}ap-button button.stroked.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.transparent{background:transparent}ap-button button.ghost{background:transparent}ap-button button.ghost.grey{color:var(--ref-color-grey-80)}ap-button button.ghost.grey ap-symbol{color:var(--ref-color-grey-80)}ap-button button.ghost.grey:hover{background-color:var(--ref-color-grey-05)}ap-button button.ghost.grey:active:not(:disabled){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:focus:not(:disabled):not(:active){background-color:var(--ref-color-grey-10)}ap-button button.ghost.grey:disabled{color:var(--ref-color-grey-20)}ap-button button.ghost.grey:disabled ap-symbol{color:var(--ref-color-grey-20)}ap-button button.ghost.grey.loading:not(.locked){color:var(--ref-color-grey-40)}ap-button button.ghost.grey.loading:not(.locked) ap-symbol{color:var(--ref-color-grey-40)}ap-button button.ghost.grey .loading-bar{background-color:var(--ref-color-grey-80)}ap-button button.ghost.blue{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue ap-symbol{color:var(--ref-color-electric-blue-100)}ap-button button.ghost.blue:hover{background-color:var(--ref-color-electric-blue-10)}ap-button button.ghost.blue:active:not(:disabled){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:focus:not(:disabled):not(:active){background-color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue:disabled ap-symbol{color:var(--ref-color-electric-blue-20)}ap-button button.ghost.blue.loading:not(.locked){color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue.loading:not(.locked) ap-symbol{color:var(--ref-color-electric-blue-40)}ap-button button.ghost.blue .loading-bar{background-color:var(--ref-color-electric-blue-100)}ap-button button.ghost.red{color:var(--ref-color-red-100)}ap-button button.ghost.red ap-symbol{color:var(--ref-color-red-100)}ap-button button.ghost.red:hover{background-color:var(--ref-color-red-10)}ap-button button.ghost.red:active:not(:disabled){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:focus:not(:disabled):not(:active){background-color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled{color:var(--ref-color-red-20)}ap-button button.ghost.red:disabled ap-symbol{color:var(--ref-color-red-20)}ap-button button.ghost.red.loading:not(.locked){color:var(--ref-color-red-40)}ap-button button.ghost.red.loading:not(.locked) ap-symbol{color:var(--ref-color-red-40)}ap-button button.ghost.red .loading-bar{background-color:var(--ref-color-red-100)}ap-button button.ghost.green{color:var(--ref-color-green-100)}ap-button button.ghost.green ap-symbol{color:var(--ref-color-green-100)}ap-button button.ghost.green:hover{background-color:var(--ref-color-green-10)}ap-button button.ghost.green:active:not(:disabled){background-color:var(--ref-color-green-20)}ap-button button.ghost.green:focus:not(:disabled):not(:active){background-color:var(--ref-color-green-20)}ap-button button.ghost.green:disabled{color:var(--ref-color-green-20)}ap-button button.ghost.green:disabled ap-symbol{color:var(--ref-color-green-20)}ap-button button.ghost.green.loading:not(.locked){color:var(--ref-color-green-40)}ap-button button.ghost.green.loading:not(.locked) ap-symbol{color:var(--ref-color-green-40)}ap-button button.ghost.green .loading-bar{background-color:var(--ref-color-green-100)}ap-button button.locked{background-color:var(--ref-color-purple-10);color:var(--ref-color-purple-80)}ap-button button.locked ap-symbol{color:var(--ref-color-purple-80)}ap-button button.locked:hover{background-color:var(--ref-color-purple-20);border-color:var(--ref-color-purple-40)}ap-button button.locked:active:not(:disabled){background-color:var(--ref-color-purple-40);border-color:var(--ref-color-purple-60)}ap-button button.locked:focus:not(:disabled):not(:active){background-color:var(--ref-color-purple-20);border-color:var(--ref-color-purple-20)}ap-button button.locked:disabled{color:var(--ref-color-purple-)}ap-button button.locked:disabled ap-symbol{color:var(--ref-color-purple-)}ap-button button.locked.loading:not(.locked){color:var(--ref-color-purple-)}ap-button button.locked.loading:not(.locked) ap-symbol{color:var(--ref-color-purple-)}ap-button button.locked .loading-bar{background-color:var(--ref-color-purple-)}ap-button button.locked{border:1px solid var(--ref-color-purple-20)}ap-button .loading-bar{position:absolute;bottom:0;left:var(--comp-button-padding-vertical);width:var(--loading-bar-width);height:5px;border-radius:8px;animation:slide 1.5s ease-in-out infinite}@keyframes slide{0%{left:calc(var(--loading-bar-width) * -1)}to{left:100%}}ap-button .locked-symbol{position:absolute;top:-6px;right:-6px;border-radius:100%;background:var(--ref-color-white)}ap-button .locked-symbol ap-symbol{color:var(--ref-color-purple-100)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { buttonElement: [{
                 type: ViewChild,
                 args: ['button']

package/fesm2022/agorapulse-ui-components-button.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"agorapulse-ui-components-button.mjs","sources":["../../../libs/ui-components/button/src/button.component.ts","../../../libs/ui-components/button/src/button.component.html","../../../libs/ui-components/button/src/agorapulse-ui-components-button.ts"],"sourcesContent":["import { BaseButtonDirective } from '@agorapulse/ui-components/directives';\nimport { UI_COMPONENTS_SYMBOLS } from '@agorapulse/ui-components/providers';\nimport { agorapulseSymbol, SymbolComponent, SymbolRegistry } from '@agorapulse/ui-symbol';\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n EventEmitter,\n HostListener,\n inject,\n input,\n Input,\n Output,\n ViewChild,\n ViewEncapsulation,\n} from '@angular/core';\nimport { MatMenuModule, MatMenuPanel } from '@angular/material/menu';\n\ntype ButtonConfig =\n \| { style: 'primary'; color: 'orange' \| 'blue' }\n \| { style: 'secondary'; color: 'orange' \| 'blue' }\n \| { style: 'stroked'; color: 'grey' \| 'blue' \| 'red' }\n \| { style: 'stroked-transparent'; color: 'grey' \| 'blue' \| 'red' }\n \| { style: 'ghost'; color: 'grey' \| 'blue' \| 'red' \| 'green' }\n \| { style: 'mermaid'; color?: never };\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-button',\n styleUrls: ['./button.component.scss'],\n imports: [SymbolComponent, MatMenuModule],\n templateUrl: './button.component.html',\n encapsulation: ViewEncapsulation.None,\n hostDirectives: [BaseButtonDirective],\n host: {\n '[attr.disabled]': 'loading \|\| disabled \|\| null',\n },\n})\nexport class ButtonComponent {\n readonly baseButtonDirective: BaseButtonDirective = inject(BaseButtonDirective, { self: true });\n\n @ViewChild('button') buttonElement!: ElementRef<HTMLButtonElement>;\n\n @Input() ariaLabel: string = '';\n @Input({\n transform: booleanAttribute,\n })\n disabled: boolean \| undefined = false;\n @Input({\n required: true,\n })\n name: string = '';\n @Input() form: string \| undefined = undefined;\n @Input() config: ButtonConfig = {\n style: 'primary',\n color: 'orange',\n };\n @Input() loading: boolean \| undefined = false;\n @Input() locked: boolean = false;\n @Input() menuTrigger: MatMenuPanel \| null = null;\n @Input() symbolPosition: 'left' \| 'right' = 'right';\n\n symbolId = input<agorapulseSymbol>();\n\n @Output() menuOpened: EventEmitter<void> = new EventEmitter();\n @Output() menuClosed: EventEmitter<void> = new EventEmitter();\n // eslint-disable-next-line @angular-eslint/no-output-native\n @Output() click: 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 focused: boolean = false;\n\n private readonly symbolRegistry = inject(SymbolRegistry);\n\n constructor() {\n this.symbolRegistry.withSymbols(...(inject(UI_COMPONENTS_SYMBOLS, { optional: true })?.flat() ?? []));\n }\n\n onClickHandle($event: MouseEvent): void {\n if (this.disabled \|\| this.loading) {\n return;\n }\n $event.stopImmediatePropagation();\n this.click.emit($event);\n this.buttonElement.nativeElement.blur();\n this.blur.emit($event);\n }\n\n onBlurHandle($event: FocusEvent): void {\n this.focused = false;\n this.blur.emit($event);\n }\n\n onFocusHandle($event: FocusEvent): void {\n this.focused = true;\n this.focus.emit($event);\n }\n\n @HostListener('window:keyup.space', ['$event'])\n onSpaceKeyUp(event: KeyboardEvent) {\n if (this.focused && !this.disabled && !this.loading) {\n event.preventDefault();\n this.buttonElement.nativeElement.click();\n }\n }\n}\n","<button\n #button\n #trigger=\"matMenuTrigger\"\n role=\"button\"\n [matMenuTriggerFor]=\"menuTrigger\"\n [class.primary]=\"config.style === 'primary' && !locked\"\n [class.secondary]=\"config.style === 'secondary' && !locked\"\n [class.ghost]=\"config.style === 'ghost' && !locked\"\n [class.stroked]=\"(config.style === 'stroked' \|\| config.style === 'stroked-transparent') && !locked\"\n [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n [class.mermaid]=\"config.style === 'mermaid' && !locked\"\n [class.orange]=\"config.color === 'orange' && !locked\"\n [class.blue]=\"config.color === 'blue' && !locked\"\n [class.red]=\"config.color === 'red' && !locked\"\n [class.grey]=\"config.color === 'grey' && !locked\"\n [class.green]=\"config.color === 'green' && !locked\"\n [class.loading]=\"loading && !locked\"\n [class.locked]=\"locked\"\n [class.inverse]=\"symbolPosition === 'left'\"\n [disabled]=\"disabled && !locked\"\n [name]=\"name\"\n [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n [attr.id]=\"baseButtonDirective.hostId\"\n [attr.type]=\"baseButtonDirective.hostType\"\n [attr.form]=\"form\"\n [attr.aria-label]=\"ariaLabel \|\| null\"\n [attr.aria-disabled]=\"disabled?.toString()\"\n (click)=\"onClickHandle($event)\"\n (focus)=\"onFocusHandle($event)\"\n (blur)=\"onBlurHandle($event)\"\n (menuOpened)=\"menuOpened.emit()\"\n (menuClosed)=\"menuClosed.emit()\">\n <ng-content />\n @if (symbolId()) {\n <ap-symbol [symbolId]=\"symbolId()\" />\n } @else {\n <ng-content select=\"ap-symbol\" />\n }\n @if (loading && !locked) {\n <div class=\"loading-bar\"></div>\n }\n</button>\n@if (locked) {\n <div class=\"locked-symbol\">\n <ap-symbol\n symbolId=\"feature-lock\"\n size=\"sm\" />\n </div>\n}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public_api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"agorapulse-ui-components-button.mjs","sources":["../../../libs/ui-components/button/src/button.component.ts","../../../libs/ui-components/button/src/button.component.html","../../../libs/ui-components/button/src/agorapulse-ui-components-button.ts"],"sourcesContent":["import { BaseButtonDirective } from '@agorapulse/ui-components/directives';\nimport { UI_COMPONENTS_SYMBOLS } from '@agorapulse/ui-components/providers';\nimport { agorapulseSymbol, SymbolComponent, SymbolRegistry } from '@agorapulse/ui-symbol';\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n EventEmitter,\n HostListener,\n inject,\n input,\n Input,\n Output,\n ViewChild,\n ViewEncapsulation,\n} from '@angular/core';\nimport { MatMenuModule, MatMenuPanel } from '@angular/material/menu';\n\ntype ButtonConfig =\n \| { style: 'primary'; color: 'orange' \| 'blue' }\n \| { style: 'secondary'; color: 'orange' \| 'blue' }\n \| { style: 'stroked'; color: 'grey' \| 'blue' \| 'red' }\n \| { style: 'stroked-transparent'; color: 'grey' \| 'blue' \| 'red' }\n \| { style: 'ghost'; color: 'grey' \| 'blue' \| 'red' \| 'green' }\n \| { style: 'mermaid'; color?: never };\n\n@Component({\n changeDetection: ChangeDetectionStrategy.OnPush,\n selector: 'ap-button',\n styleUrls: ['./button.component.scss'],\n imports: [SymbolComponent, MatMenuModule],\n templateUrl: './button.component.html',\n encapsulation: ViewEncapsulation.None,\n hostDirectives: [BaseButtonDirective],\n host: {\n '[attr.disabled]': 'loading \|\| disabled \|\| null',\n },\n})\nexport class ButtonComponent {\n readonly baseButtonDirective: BaseButtonDirective = inject(BaseButtonDirective, { self: true });\n\n @ViewChild('button') buttonElement!: ElementRef<HTMLButtonElement>;\n\n @Input() ariaLabel: string = '';\n @Input({\n transform: booleanAttribute,\n })\n disabled: boolean \| undefined = false;\n @Input({\n required: true,\n })\n name: string = '';\n @Input() form: string \| undefined = undefined;\n @Input() config: ButtonConfig = {\n style: 'primary',\n color: 'orange',\n };\n @Input() loading: boolean \| undefined = false;\n @Input() locked: boolean = false;\n @Input() menuTrigger: MatMenuPanel \| null = null;\n @Input() symbolPosition: 'left' \| 'right' = 'right';\n\n symbolId = input<agorapulseSymbol>();\n\n @Output() menuOpened: EventEmitter<void> = new EventEmitter();\n @Output() menuClosed: EventEmitter<void> = new EventEmitter();\n // eslint-disable-next-line @angular-eslint/no-output-native\n @Output() click: 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 focused: boolean = false;\n\n private readonly symbolRegistry = inject(SymbolRegistry);\n\n constructor() {\n this.symbolRegistry.withSymbols(...(inject(UI_COMPONENTS_SYMBOLS, { optional: true })?.flat() ?? []));\n }\n\n onClickHandle($event: MouseEvent): void {\n if (this.disabled \|\| this.loading) {\n return;\n }\n $event.stopImmediatePropagation();\n this.click.emit($event);\n this.buttonElement.nativeElement.blur();\n this.blur.emit($event);\n }\n\n onBlurHandle($event: FocusEvent): void {\n this.focused = false;\n this.blur.emit($event);\n }\n\n onFocusHandle($event: FocusEvent): void {\n this.focused = true;\n this.focus.emit($event);\n }\n\n @HostListener('window:keyup.space', ['$event'])\n onSpaceKeyUp(event: KeyboardEvent) {\n if (this.focused && !this.disabled && !this.loading) {\n event.preventDefault();\n this.buttonElement.nativeElement.click();\n }\n }\n}\n","<button\n #button\n #trigger=\"matMenuTrigger\"\n role=\"button\"\n [matMenuTriggerFor]=\"menuTrigger\"\n [class.primary]=\"config.style === 'primary' && !locked\"\n [class.secondary]=\"config.style === 'secondary' && !locked\"\n [class.ghost]=\"config.style === 'ghost' && !locked\"\n [class.stroked]=\"(config.style === 'stroked' \|\| config.style === 'stroked-transparent') && !locked\"\n [class.transparent]=\"config.style === 'stroked-transparent' && !locked\"\n [class.mermaid]=\"config.style === 'mermaid' && !locked\"\n [class.orange]=\"config.color === 'orange' && !locked\"\n [class.blue]=\"config.color === 'blue' && !locked\"\n [class.red]=\"config.color === 'red' && !locked\"\n [class.grey]=\"config.color === 'grey' && !locked\"\n [class.green]=\"config.color === 'green' && !locked\"\n [class.loading]=\"loading && !locked\"\n [class.locked]=\"locked\"\n [class.inverse]=\"symbolPosition === 'left'\"\n [disabled]=\"disabled && !locked\"\n [name]=\"name\"\n [attr.data-test]=\"baseButtonDirective.hostDataTest ?? name\"\n [attr.id]=\"baseButtonDirective.hostId\"\n [attr.type]=\"baseButtonDirective.hostType\"\n [attr.form]=\"form\"\n [attr.aria-label]=\"ariaLabel \|\| null\"\n [attr.aria-disabled]=\"disabled?.toString()\"\n (click)=\"onClickHandle($event)\"\n (focus)=\"onFocusHandle($event)\"\n (blur)=\"onBlurHandle($event)\"\n (menuOpened)=\"menuOpened.emit()\"\n (menuClosed)=\"menuClosed.emit()\">\n <ng-content />\n @if (symbolId()) {\n <ap-symbol [symbolId]=\"symbolId()\" />\n } @else {\n <ng-content select=\"ap-symbol\" />\n }\n @if (loading && !locked) {\n <div class=\"loading-bar\"></div>\n }\n</button>\n@if (locked) {\n <div class=\"locked-symbol\">\n <ap-symbol\n symbolId=\"feature-lock\"\n size=\"sm\" />\n </div>\n}\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-labels.mjs CHANGED Viewed

@@ -38,7 +38,7 @@ class LabelComponent {
         this.remove.emit({ content: this.content, $event });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: LabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: LabelComponent, isStandalone: true, selector: "ap-label", inputs: { content: "content", selectorWidth: "selectorWidth", removable: ["removable", "removable", booleanAttribute] }, outputs: { remove: "remove" }, ngImport: i0, template: "<div\n    class=\"label\"\n    [class.removable]=\"removable\"\n    [apTooltip]=\"tooltipEnabled ? content : ''\">\n    <span class=\"label-content\">{{ content }}</span>\n    @if (removable) {\n        <ap-close-button (closed)=\"onClearLabel($event)\" />\n    }\n</div>\n", styles: ["ap-label{display:flex;max-width:100%;--button-size: calc(var(--comp-label-height) - 4px);--max-width: 180px}ap-label .label{color:var(--comp-label-text-color);align-self:center;background:var(--comp-label-background-color);border-radius:var(--comp-label-border-radius);text-wrap:unset;display:flex;align-items:center;border:none;padding:0 var(--comp-label-padding-right) 0 var(--comp-label-padding-left);height:var(--comp-label-height);box-sizing:border-box;text-overflow:ellipsis;width:100%}ap-label .label.removable{gap:var(--comp-label-closable-spacing);padding:0 var(--comp-label-closable-padding-right) 0 var(--ref-spacing-xxs)}ap-label .label .label-content{max-width:var(--max-width);color:var(--comp-label-text-color);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--comp-label-text-style-font-family);font-size:var(--comp-label-text-style-size);line-height:var(--comp-label-text-style-line-height);font-weight:var(--comp-label-text-style-font-weight)}\n"], dependencies: [{ kind: "directive", type: TooltipDirective, selector: "[apTooltip]", inputs: ["apTooltip", "apTooltipPosition", "apTooltipShowDelay", "apTooltipHideDelay", "apTooltipDuration", "apTooltipDisabled", "apTooltipTruncatedTextOnly", "apTooltipTemplateContext", "apTooltipVirtualScrollElement", "apTooltipTrigger"] }, { kind: "component", type: CloseButtonComponent, selector: "ap-close-button", inputs: ["disabled", "ariaLabel", "dataTest"], outputs: ["closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: LabelComponent, isStandalone: true, selector: "ap-label", inputs: { content: "content", selectorWidth: "selectorWidth", removable: ["removable", "removable", booleanAttribute] }, outputs: { remove: "remove" }, ngImport: i0, template: "<div\n    class=\"label\"\n    [class.removable]=\"removable\"\n    [apTooltip]=\"tooltipEnabled ? content : ''\">\n    <span class=\"label-content\">{{ content }}</span>\n    @if (removable) {\n        <ap-close-button (closed)=\"onClearLabel($event)\" />\n    }\n</div>\n", styles: ["ap-label{display:flex;max-width:100%;--button-size: calc(var(--comp-label-height) - 4px);--max-width: 180px}ap-label .label{color:var(--comp-label-text-color);align-self:center;background:var(--comp-label-background-color);border-radius:var(--comp-label-border-radius);text-wrap:unset;display:flex;align-items:center;border:none;padding:0 var(--comp-label-padding-right) 0 var(--comp-label-padding-left);height:var(--comp-label-height);box-sizing:border-box;text-overflow:ellipsis;width:100%}ap-label .label.removable{gap:var(--comp-label-closable-spacing);padding:0 var(--comp-label-closable-padding-right) 0 var(--ref-spacing-xxs)}ap-label .label .label-content{max-width:var(--max-width);color:var(--comp-label-text-color);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--comp-label-text-style-font-family);font-size:var(--comp-label-text-style-size);line-height:var(--comp-label-text-style-line-height);font-weight:var(--comp-label-text-style-font-weight)}\n"], dependencies: [{ kind: "directive", type: TooltipDirective, selector: "[apTooltip]", inputs: ["apTooltip", "apTooltipPosition", "apTooltipShowDelay", "apTooltipHideDelay", "apTooltipDuration", "apTooltipDisabled", "apTooltipTruncatedTextOnly", "apTooltipTemplateContext", "apTooltipVirtualScrollElement", "apTooltipTrigger", "apTooltipType", "apTooltipPresentationContext", "apTooltipListItems"], exportAs: ["apTooltip"] }, { kind: "component", type: CloseButtonComponent, selector: "ap-close-button", inputs: ["disabled", "ariaLabel", "dataTest"], outputs: ["closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: LabelComponent, decorators: [{
             type: Component,