npm - @seniorsistemas/angular-components - Versions diffs - 19.9.7 → 19.9.8-develop-dbc2f1b4 - Mend

@seniorsistemas/angular-components 19.9.7 → 19.9.8-develop-dbc2f1b4

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 (162) hide show

package/fesm2022/seniorsistemas-angular-components-accordion.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"seniorsistemas-angular-components-accordion.mjs","sources":["../../projects/angular-components/accordion/src/lib/accordion/components/accordion-panel/accordion-panel.component.ts","../../projects/angular-components/accordion/src/lib/accordion/components/accordion-panel/accordion-panel.component.html","../../projects/angular-components/accordion/src/lib/accordion/accordion.component.ts","../../projects/angular-components/accordion/src/lib/accordion/accordion.component.html","../../projects/angular-components/accordion/src/lib/accordion/accordion.module.ts","../../projects/angular-components/accordion/src/seniorsistemas-angular-components-accordion.ts"],"sourcesContent":["import { AfterViewInit, Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';\r\nimport { trigger, style, animate, transition, state } from '@angular/animations';\r\n\r\nimport { UntypedFormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';\r\nimport { AccordionButtonSettings, ValidationMessageIconColor } from '../../models/accordion-button-settings';\r\nimport { BadgeColors, BadgeComponent } from '@seniorsistemas/angular-components/badge';\r\nimport { TooltipDirective } from '@seniorsistemas/angular-components/tooltip';\r\nimport { NgClass, NgTemplateOutlet } from '@angular/common';\r\nimport { SwitchComponent } from '@seniorsistemas/angular-components/switch';\r\n\r\nlet nextPanelId = 0;\r\n\r\n/*\r\n @description Painel individual do {@link AccordionComponent}. Gerencia o estado de\r\n * abertura/fechamento com animação, podendo conter um switch de controle via `switchControl`,\r\n * botões de ação configuráveis e uma mensagem de validação com ícone.\r\n \r\n @example\r\n * ```html\r\n * <s-accordion-panel\r\n * header=\"Configurações\"\r\n * [disabled]=\"false\"\r\n * (panelOpened)=\"onOpen()\"\r\n * (panelClosed)=\"onClose()\">\r\n * <p>Conteúdo do painel</p>\r\n * </s-accordion-panel>\r\n * ```\r\n \r\n @category Inputs\r\n /\r\n@Component({\r\n selector: 's-accordion-panel',\r\n templateUrl: './accordion-panel.component.html',\r\n animations: [\r\n trigger('cachelessAnimation', [\r\n transition(':enter', [style({ height: '0' }), animate('200ms linear', style({ height: '' }))]),\r\n transition(':leave', [style({ height: '' }), animate('200ms linear', style({ height: '0' }))]),\r\n ]),\r\n trigger('cacheAnimation', [\r\n state('true', style({ height: '' })),\r\n state('false', style({ height: '0px' })),\r\n transition('* => ', animate('200ms')),\r\n ]),\r\n ],\r\n standalone: true,\r\n imports: [\r\n TooltipDirective,\r\n BadgeComponent,\r\n NgClass,\r\n SwitchComponent,\r\n FormsModule,\r\n ReactiveFormsModule,\r\n NgTemplateOutlet,\r\n ],\r\n})\r\nexport class AccordionPanelComponent implements OnChanges, AfterViewInit {\r\n /\r\n @description Título exibido no cabeçalho do painel. Campo obrigatório.\r\n /\r\n @Input({ required: true })\r\n public header!: string;\r\n\r\n /\r\n @description Cria um componente Badge ao lado dos botões de ação no cabeçalho do painel.\r\n * O objeto de configuração deve conter o texto e a cor do badge.\r\n /\r\n @Input()\r\n public badgeConfig?: { text: string; color: BadgeColors };\r\n\r\n /\r\n @description Lista de botões de ação exibidos no cabeçalho do painel,\r\n * à direita do título. Cada item define ícone, tooltip e callback de clique.\r\n /\r\n @Input()\r\n public buttons?: AccordionButtonSettings[];\r\n\r\n /\r\n @description Desabilita a interação do usuário com o painel, impedindo abertura e fechamento.\r\n \r\n @default false\r\n /\r\n @Input()\r\n public disabled = false;\r\n\r\n /\r\n @description `FormControl` vinculado a um switch exibido no cabeçalho do painel.\r\n * Permite habilitar/desabilitar o conteúdo do painel via toggle.\r\n /\r\n @Input()\r\n public switchControl?: UntypedFormControl;\r\n\r\n /\r\n @description Mensagem de validação exibida abaixo do cabeçalho, acompanhada de um ícone.\r\n * Útil para indicar erros ou alertas relacionados ao conteúdo do painel.\r\n /\r\n @Input()\r\n public validationMessage?: string;\r\n\r\n /\r\n @description Mantém o conteúdo do painel no DOM mesmo quando fechado (modo cache).\r\n * Útil para preservar o estado de componentes internos ao reabrir o painel.\r\n \r\n @default false\r\n /\r\n @Input()\r\n public cache = false;\r\n\r\n /\r\n @description Classe do ícone exibido ao lado da mensagem de validação.\r\n \r\n @default 'fas fa-exclamation-circle'\r\n /\r\n @Input() validationMessageIcon = 'fas fa-exclamation-circle';\r\n\r\n /\r\n @description Cor do ícone da mensagem de validação.\r\n \r\n @default 'Red'\r\n /\r\n @Input() validationMessageIconColor: ValidationMessageIconColor = 'Red';\r\n\r\n /\r\n @description Emitido quando o painel é aberto pelo usuário.\r\n /\r\n @Output()\r\n public panelOpened = new EventEmitter<void>();\r\n\r\n /\r\n @description Emitido quando o painel é fechado pelo usuário.\r\n /\r\n @Output()\r\n public panelClosed = new EventEmitter<void>();\r\n\r\n public isAnimating = false;\r\n public isContentAnimationDisabled = true;\r\n public readonly panelId = nextPanelId++;\r\n\r\n private _isOpen = false;\r\n\r\n public get isOpen() {\r\n return this._isOpen;\r\n }\r\n\r\n public set isOpen(isOpen: boolean) {\r\n this._isOpen = isOpen;\r\n }\r\n\r\n public ngOnChanges(changes: SimpleChanges): void {\r\n if ('disabled' in changes && this.switchControl) {\r\n if (changes['disabled'].currentValue) {\r\n this.switchControl.disable({ emitEvent: false });\r\n } else {\r\n this.switchControl.enable({ emitEvent: false });\r\n }\r\n }\r\n\r\n if ('switch' in changes && 'switchControl' in changes) {\r\n throw new Error(\"You can't set switch and switchControl together.\");\r\n }\r\n }\r\n\r\n public ngAfterViewInit(): void {\r\n // to executed at a safe time prior to control returning to the browser's event loop\r\n queueMicrotask(() => {\r\n this.isContentAnimationDisabled = false;\r\n });\r\n }\r\n\r\n public onIconButtonsClick(event: Event, callback: VoidFunction) {\r\n if (this.disabled) {\r\n return;\r\n }\r\n\r\n event.stopPropagation();\r\n callback();\r\n }\r\n\r\n public onTabClick() {\r\n if (this.disabled \|\| this.isAnimating) {\r\n return;\r\n }\r\n this.isOpen = !this.isOpen;\r\n this._emitPanelEvent();\r\n }\r\n\r\n public onHeaderKeydown(event: KeyboardEvent): void {\r\n if (event.key === 'Enter' \|\| event.key === ' ') {\r\n event.preventDefault();\r\n this.onTabClick();\r\n }\r\n }\r\n\r\n public onContentAnimationStart() {\r\n this.isAnimating = true;\r\n }\r\n\r\n public onContentAnimationDone() {\r\n this.isAnimating = false;\r\n\r\n this._emitPanelEvent();\r\n }\r\n\r\n private _emitPanelEvent() {\r\n if (this.isOpen) {\r\n this.panelOpened.emit();\r\n } else {\r\n this.panelClosed.emit();\r\n }\r\n }\r\n}\r\n","<div\n class=\"accordion-panel border-b border-grayscale-30\"\n [class.accordion-panel--open]=\"isOpen\"\n [class.accordion-panel--disabled]=\"disabled\"\n>\n <div\n class=\"header flex select-none items-center justify-between border-grayscale-30 bg-grayscale-0 p-4\"\n [class.bg-grayscale-10]=\"isOpen\"\n [class.border-b]=\"isOpen\"\n [class.cursor-pointer]=\"!disabled\"\n [class.cursor-auto]=\"disabled\"\n >\n <div\n class=\"header__trigger flex items-center flex-1 flex-nowrap focus-visible:outline focus-visible:outline-2 focus-visible:outline-primary focus-visible:[outline-offset:-2px]\"\n [class.cursor-pointer]=\"!disabled\"\n [class.cursor-auto]=\"disabled\"\n role=\"button\"\n [tabindex]=\"disabled ? -1 : 0\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-controls]=\"'accordion-panel-content-' + panelId\"\n [attr.aria-disabled]=\"disabled\"\n (click)=\"onTabClick()\"\n (keydown)=\"onHeaderKeydown($event)\"\n >\n <span\n class=\"icon fas text-base mr-3\"\n [class.fa-minus]=\"isOpen\"\n [class.fa-plus]=\"!isOpen\"\n [class.text-grayscale-90]=\"!disabled\"\n [class.text-grayscale-30]=\"disabled\"\n aria-hidden=\"true\"\n >\n </span>\n @if (validationMessage) {\n <span\n class=\"exclamation-icon text-base mr-3\"\n [class]=\"validationMessageIcon\"\n [sTooltip]=\"validationMessage\"\n [class.exclamation-icon-red]=\"validationMessageIconColor === 'Red'\"\n [class.text-criticality-red]=\"validationMessageIconColor === 'Red'\"\n [class.exclamation-icon-orange]=\"validationMessageIconColor === 'Orange'\"\n [class.text-criticality-orange]=\"validationMessageIconColor === 'Orange'\"\n [class.exclamation-icon-yellow]=\"validationMessageIconColor === 'Yellow'\"\n [class.text-criticality-yellow]=\"validationMessageIconColor === 'Yellow'\"\n [class.exclamation-icon-green]=\"validationMessageIconColor === 'Green'\"\n [class.text-criticality-green]=\"validationMessageIconColor === 'Green'\"\n [class.exclamation-icon-blue]=\"validationMessageIconColor === 'Blue'\"\n [class.text-primary]=\"validationMessageIconColor === 'Blue'\"\n [class.opacity-50]=\"disabled\"\n aria-hidden=\"true\"\n >\n </span>\n }\n <span\n class=\"title font-open-sans text-sm font-bold uppercase leading-normal\"\n [class.text-grayscale-30]=\"disabled\"\n [id]=\"'accordion-panel-header-' + panelId\"\n >{{ header }}</span\n >\n </div>\n <div class=\"header__controls flex items-center ml-4\">\n @if (badgeConfig) {\n <s-badge\n [color]=\"badgeConfig.color\"\n [text]=\"badgeConfig.text\"\n ></s-badge>\n }\n\n @for (button of buttons; track button.icon) {\n <button\n class=\"icon-button text-base ml-3 p-1 border-0 bg-transparent\"\n [class.text-grayscale-90]=\"!disabled\"\n [class.text-grayscale-30]=\"disabled\"\n [class.cursor-pointer]=\"!disabled\"\n [class.cursor-auto]=\"disabled\"\n [ngClass]=\"button.icon\"\n [attr.aria-label]=\"button.label\"\n (click)=\"onIconButtonsClick($event, button.onClick)\"\n ></button>\n }\n\n @if (switchControl) {\n <s-switch\n class=\"switch pl-4\"\n [formControl]=\"switchControl\"\n (click)=\"$event.stopPropagation()\"\n >\n </s-switch>\n }\n </div>\n </div>\n\n @if (cache) {\n <div\n class=\"content bg-grayscale-0 overflow-hidden\"\n role=\"region\"\n [attr.aria-labelledby]=\"'accordion-panel-header-' + panelId\"\n [id]=\"'accordion-panel-content-' + panelId\"\n [@cacheAnimation]=\"isOpen\"\n [@.disabled]=\"isContentAnimationDisabled\"\n (@cacheAnimation.start)=\"onContentAnimationStart()\"\n (@cacheAnimation.done)=\"onContentAnimationDone()\"\n >\n <div class=\"content-container m-5\">\n <ng-container [ngTemplateOutlet]=\"panelContent\"></ng-container>\n </div>\n </div>\n } @else {\n @if (isOpen) {\n <div\n class=\"content bg-grayscale-0 overflow-hidden\"\n role=\"region\"\n [attr.aria-labelledby]=\"'accordion-panel-header-' + panelId\"\n [id]=\"'accordion-panel-content-' + panelId\"\n @cachelessAnimation\n [@.disabled]=\"isContentAnimationDisabled\"\n (@cachelessAnimation.start)=\"onContentAnimationStart()\"\n (@cachelessAnimation.done)=\"onContentAnimationDone()\"\n >\n <div class=\"content-container m-5\">\n <ng-container [ngTemplateOutlet]=\"panelContent\"></ng-container>\n </div>\n </div>\n }\n }\n</div>\n\n<ng-template #panelContent>\n <ng-content></ng-content>\n</ng-template>\n","import {\r\n AfterContentInit,\r\n OnChanges,\r\n Component,\r\n ContentChildren,\r\n Input,\r\n QueryList,\r\n SimpleChanges,\r\n OnDestroy,\r\n} from '@angular/core';\r\n\r\nimport { AccordionPanelComponent } from './components/accordion-panel/accordion-panel.component';\r\nimport { Subject, Subscription } from 'rxjs';\r\nimport { takeUntil } from 'rxjs/operators';\r\n\r\n/\r\n @description Componente de acordeão que gerencia a abertura e o fechamento de painéis\r\n * {@link AccordionPanelComponent}. Suporta modo de painel único (apenas um aberto por vez)\r\n * ou modo múltiplo (vários painéis abertos simultaneamente), configurável via input `multiple`.\r\n \r\n @example\r\n * ```html\r\n * <s-accordion [multiple]=\"false\" [activeIndex]=\"0\">\r\n * <s-accordion-panel header=\"Seção 1\">Conteúdo 1</s-accordion-panel>\r\n * <s-accordion-panel header=\"Seção 2\">Conteúdo 2</s-accordion-panel>\r\n * </s-accordion>\r\n * ```\r\n \r\n @category Inputs\r\n /\r\n@Component({\r\n selector: 's-accordion',\r\n templateUrl: './accordion.component.html',\r\n standalone: true,\r\n})\r\nexport class AccordionComponent implements AfterContentInit, OnChanges, OnDestroy {\r\n /\r\n @description Índice (ou lista de índices) do(s) painel(is) que devem iniciar abertos.\r\n * Aceita um número para painel único ou um array de números para o modo múltiplo.\r\n /\r\n @Input()\r\n public activeIndex?: number \| number[];\r\n\r\n /\r\n @description Permite que múltiplos painéis estejam abertos ao mesmo tempo.\r\n * Quando `false`, abrir um painel fecha automaticamente o anterior.\r\n \r\n @default false\r\n /\r\n @Input()\r\n public multiple = false;\r\n\r\n @ContentChildren(AccordionPanelComponent)\r\n public panelsComponents?: QueryList<AccordionPanelComponent>;\r\n\r\n private readonly _unsubscribe$ = new Subject<void>();\r\n private _panels: AccordionPanelComponent[] = [];\r\n private _openSubs: Subscription[] = [];\r\n\r\n public ngAfterContentInit(): void {\r\n if (this.panelsComponents) {\r\n this._panels = this.panelsComponents?.toArray();\r\n }\r\n\r\n this._openSubs = Array.from({ length: this._panels.length });\r\n\r\n this._setBehavior(this.multiple);\r\n this._setupTabs();\r\n }\r\n\r\n public ngOnChanges(changes: SimpleChanges): void {\r\n if (changes['multiple']) {\r\n this._setBehavior(changes['multiple'].currentValue);\r\n }\r\n }\r\n\r\n public ngOnDestroy(): void {\r\n this._unsubscribe$.next();\r\n this._unsubscribe$.complete();\r\n }\r\n\r\n private _setupTabs(): void {\r\n if (this._panels?.length) {\r\n if (this.activeIndex !== undefined && this.activeIndex !== null) {\r\n const activeTabs = Array.isArray(this.activeIndex)\r\n ? this._panels.filter((_, index) => (this.activeIndex as number[]).includes(index))\r\n : [this._panels[this.activeIndex]];\r\n\r\n if (activeTabs.length === 0) {\r\n throw new Error('activeIndex does not represent any panel.');\r\n }\r\n\r\n for (const activeTab of activeTabs) {\r\n if (!activeTab.disabled) {\r\n activeTab.isOpen = true;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n private _closeOtherTabs(exception: number) {\r\n this._panels.forEach((panel, index) => {\r\n if (index !== exception) {\r\n panel.isOpen = false;\r\n }\r\n });\r\n }\r\n\r\n private _setBehavior(multiple: boolean): void {\r\n if (multiple) {\r\n this._enableMultiplePanelBehavior();\r\n } else {\r\n this._enableSinglePanelBehavior();\r\n }\r\n }\r\n\r\n private _enableSinglePanelBehavior() {\r\n this._panels.forEach((panel, index) => {\r\n this._openSubs[index] = panel.panelOpened.pipe(takeUntil(this._unsubscribe$)).subscribe(() => {\r\n this._closeOtherTabs(index);\r\n });\r\n });\r\n }\r\n\r\n private _enableMultiplePanelBehavior() {\r\n this._panels.forEach((_, index) => {\r\n if (this._openSubs[index]) {\r\n this._openSubs[index].unsubscribe();\r\n }\r\n });\r\n }\r\n}\r\n","<div class=\"accordion border border-grayscale-30 rounded-xbig overflow-hidden\">\n <ng-content></ng-content>\n</div>\n","import { NgModule } from '@angular/core';\r\n\r\nimport { AccordionComponent } from './accordion.component';\r\nimport { AccordionPanelComponent } from './components/accordion-panel/accordion-panel.component';\r\n\r\n@NgModule({\r\n imports: [AccordionComponent, AccordionPanelComponent],\r\n exports: [AccordionComponent, AccordionPanelComponent],\r\n})\r\nexport class AccordionModule {}\r\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":"seniorsistemas-angular-components-accordion.mjs","sources":["../../projects/angular-components/accordion/src/lib/accordion/components/accordion-panel/accordion-panel.component.ts","../../projects/angular-components/accordion/src/lib/accordion/components/accordion-panel/accordion-panel.component.html","../../projects/angular-components/accordion/src/lib/accordion/accordion.component.ts","../../projects/angular-components/accordion/src/lib/accordion/accordion.component.html","../../projects/angular-components/accordion/src/lib/accordion/accordion.module.ts","../../projects/angular-components/accordion/src/seniorsistemas-angular-components-accordion.ts"],"sourcesContent":["import { AfterViewInit, Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';\r\nimport { trigger, style, animate, transition, state } from '@angular/animations';\r\n\r\nimport { UntypedFormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';\r\nimport { AccordionButtonSettings, ValidationMessageIconColor } from '../../models/accordion-button-settings';\r\nimport { BadgeColors, BadgeComponent } from '@seniorsistemas/angular-components/badge';\r\nimport { TooltipDirective } from '@seniorsistemas/angular-components/tooltip';\r\nimport { NgClass, NgTemplateOutlet } from '@angular/common';\r\nimport { SwitchComponent } from '@seniorsistemas/angular-components/switch';\r\n\r\nlet nextPanelId = 0;\r\n\r\n/*\r\n @description Painel individual do {@link AccordionComponent}. Gerencia o estado de\r\n * abertura/fechamento com animação, podendo conter um switch de controle via `switchControl`,\r\n * botões de ação configuráveis e uma mensagem de validação com ícone.\r\n \r\n @example\r\n * ```html\r\n * <s-accordion-panel\r\n * header=\"Configurações\"\r\n * [disabled]=\"false\"\r\n * (panelOpened)=\"onOpen()\"\r\n * (panelClosed)=\"onClose()\">\r\n * <p>Conteúdo do painel</p>\r\n * </s-accordion-panel>\r\n * ```\r\n \r\n @category Inputs\r\n /\r\n@Component({\r\n selector: 's-accordion-panel',\r\n templateUrl: './accordion-panel.component.html',\r\n animations: [\r\n trigger('cachelessAnimation', [\r\n transition(':enter', [style({ height: '0' }), animate('200ms linear', style({ height: '' }))]),\r\n transition(':leave', [style({ height: '' }), animate('200ms linear', style({ height: '0' }))]),\r\n ]),\r\n trigger('cacheAnimation', [\r\n state('true', style({ height: '' })),\r\n state('false', style({ height: '0px' })),\r\n transition('* => ', animate('200ms')),\r\n ]),\r\n ],\r\n standalone: true,\r\n imports: [\r\n TooltipDirective,\r\n BadgeComponent,\r\n NgClass,\r\n SwitchComponent,\r\n FormsModule,\r\n ReactiveFormsModule,\r\n NgTemplateOutlet,\r\n ],\r\n})\r\nexport class AccordionPanelComponent implements OnChanges, AfterViewInit {\r\n /\r\n @description Título exibido no cabeçalho do painel. Campo obrigatório.\r\n /\r\n @Input({ required: true })\r\n public header!: string;\r\n\r\n /\r\n @description Cria um componente Badge ao lado dos botões de ação no cabeçalho do painel.\r\n * O objeto de configuração deve conter o texto e a cor do badge.\r\n /\r\n @Input()\r\n public badgeConfig?: { text: string; color: BadgeColors };\r\n\r\n /\r\n @description Lista de botões de ação exibidos no cabeçalho do painel,\r\n * à direita do título. Cada item define ícone, tooltip e callback de clique.\r\n /\r\n @Input()\r\n public buttons?: AccordionButtonSettings[];\r\n\r\n /\r\n @description Desabilita a interação do usuário com o painel, impedindo abertura e fechamento.\r\n \r\n @default false\r\n /\r\n @Input()\r\n public disabled = false;\r\n\r\n /\r\n @description `FormControl` vinculado a um switch exibido no cabeçalho do painel.\r\n * Permite habilitar/desabilitar o conteúdo do painel via toggle.\r\n /\r\n @Input()\r\n public switchControl?: UntypedFormControl;\r\n\r\n /\r\n @description Mensagem de validação exibida abaixo do cabeçalho, acompanhada de um ícone.\r\n * Útil para indicar erros ou alertas relacionados ao conteúdo do painel.\r\n /\r\n @Input()\r\n public validationMessage?: string;\r\n\r\n /\r\n @description Mantém o conteúdo do painel no DOM mesmo quando fechado (modo cache).\r\n * Útil para preservar o estado de componentes internos ao reabrir o painel.\r\n \r\n @default false\r\n /\r\n @Input()\r\n public cache = false;\r\n\r\n /\r\n @description Classe do ícone exibido ao lado da mensagem de validação.\r\n \r\n @default 'fas fa-exclamation-circle'\r\n /\r\n @Input() validationMessageIcon = 'fas fa-exclamation-circle';\r\n\r\n /\r\n @description Cor do ícone da mensagem de validação.\r\n \r\n @default 'Red'\r\n /\r\n @Input() validationMessageIconColor: ValidationMessageIconColor = 'Red';\r\n\r\n /\r\n @description Emitido quando o painel é aberto pelo usuário.\r\n /\r\n @Output()\r\n public panelOpened = new EventEmitter<void>();\r\n\r\n /\r\n @description Emitido quando o painel é fechado pelo usuário.\r\n /\r\n @Output()\r\n public panelClosed = new EventEmitter<void>();\r\n\r\n public isAnimating = false;\r\n public isContentAnimationDisabled = true;\r\n public readonly panelId = nextPanelId++;\r\n\r\n private _isOpen = false;\r\n\r\n public get isOpen() {\r\n return this._isOpen;\r\n }\r\n\r\n public set isOpen(isOpen: boolean) {\r\n this._isOpen = isOpen;\r\n }\r\n\r\n public ngOnChanges(changes: SimpleChanges): void {\r\n if ('disabled' in changes && this.switchControl) {\r\n if (changes['disabled'].currentValue) {\r\n this.switchControl.disable({ emitEvent: false });\r\n } else {\r\n this.switchControl.enable({ emitEvent: false });\r\n }\r\n }\r\n\r\n if ('switch' in changes && 'switchControl' in changes) {\r\n throw new Error(\"You can't set switch and switchControl together.\");\r\n }\r\n }\r\n\r\n public ngAfterViewInit(): void {\r\n // to executed at a safe time prior to control returning to the browser's event loop\r\n queueMicrotask(() => {\r\n this.isContentAnimationDisabled = false;\r\n });\r\n }\r\n\r\n public onIconButtonsClick(event: Event, callback: VoidFunction) {\r\n if (this.disabled) {\r\n return;\r\n }\r\n\r\n event.stopPropagation();\r\n callback();\r\n }\r\n\r\n public onTabClick() {\r\n if (this.disabled \|\| this.isAnimating) {\r\n return;\r\n }\r\n this.isOpen = !this.isOpen;\r\n this._emitPanelEvent();\r\n }\r\n\r\n public onHeaderKeydown(event: KeyboardEvent): void {\r\n if (event.key === 'Enter' \|\| event.key === ' ') {\r\n event.preventDefault();\r\n this.onTabClick();\r\n }\r\n }\r\n\r\n public onContentAnimationStart() {\r\n this.isAnimating = true;\r\n }\r\n\r\n public onContentAnimationDone() {\r\n this.isAnimating = false;\r\n\r\n this._emitPanelEvent();\r\n }\r\n\r\n private _emitPanelEvent() {\r\n if (this.isOpen) {\r\n this.panelOpened.emit();\r\n } else {\r\n this.panelClosed.emit();\r\n }\r\n }\r\n}\r\n","<div\n class=\"accordion-panel border-b border-grayscale-30\"\n [class.accordion-panel--open]=\"isOpen\"\n [class.accordion-panel--disabled]=\"disabled\"\n>\n <div\n class=\"header flex select-none items-center justify-between border-grayscale-30 bg-grayscale-0 p-4\"\n [class.bg-grayscale-10]=\"isOpen\"\n [class.border-b]=\"isOpen\"\n [class.cursor-pointer]=\"!disabled\"\n [class.cursor-auto]=\"disabled\"\n >\n <div\n class=\"header__trigger flex items-center flex-1 flex-nowrap focus-visible:outline focus-visible:outline-2 focus-visible:outline-[var(--s-focus-ring-color,#0090ff)] focus-visible:[outline-offset:-2px]\"\n [class.cursor-pointer]=\"!disabled\"\n [class.cursor-auto]=\"disabled\"\n role=\"button\"\n [tabindex]=\"disabled ? -1 : 0\"\n [attr.aria-expanded]=\"isOpen\"\n [attr.aria-controls]=\"'accordion-panel-content-' + panelId\"\n [attr.aria-disabled]=\"disabled\"\n (click)=\"onTabClick()\"\n (keydown)=\"onHeaderKeydown($event)\"\n >\n <span\n class=\"icon fas text-base mr-3\"\n [class.fa-minus]=\"isOpen\"\n [class.fa-plus]=\"!isOpen\"\n [class.text-grayscale-90]=\"!disabled\"\n [class.text-grayscale-30]=\"disabled\"\n aria-hidden=\"true\"\n >\n </span>\n @if (validationMessage) {\n <span\n class=\"exclamation-icon text-base mr-3\"\n [class]=\"validationMessageIcon\"\n [sTooltip]=\"validationMessage\"\n [class.exclamation-icon-red]=\"validationMessageIconColor === 'Red'\"\n [class.text-criticality-red]=\"validationMessageIconColor === 'Red'\"\n [class.exclamation-icon-orange]=\"validationMessageIconColor === 'Orange'\"\n [class.text-criticality-orange]=\"validationMessageIconColor === 'Orange'\"\n [class.exclamation-icon-yellow]=\"validationMessageIconColor === 'Yellow'\"\n [class.text-criticality-yellow]=\"validationMessageIconColor === 'Yellow'\"\n [class.exclamation-icon-green]=\"validationMessageIconColor === 'Green'\"\n [class.text-criticality-green]=\"validationMessageIconColor === 'Green'\"\n [class.exclamation-icon-blue]=\"validationMessageIconColor === 'Blue'\"\n [class.text-primary]=\"validationMessageIconColor === 'Blue'\"\n [class.opacity-50]=\"disabled\"\n aria-hidden=\"true\"\n >\n </span>\n }\n <span\n class=\"title font-open-sans text-sm font-bold uppercase leading-normal\"\n [class.text-grayscale-30]=\"disabled\"\n [id]=\"'accordion-panel-header-' + panelId\"\n >{{ header }}</span\n >\n </div>\n <div class=\"header__controls flex items-center ml-4\">\n @if (badgeConfig) {\n <s-badge\n [color]=\"badgeConfig.color\"\n [text]=\"badgeConfig.text\"\n ></s-badge>\n }\n\n @for (button of buttons; track button.icon) {\n <button\n class=\"icon-button text-base ml-3 p-1 border-0 bg-transparent rounded-[50%] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-[3px] focus-visible:outline-[var(--s-focus-ring-color,#0090ff)]\"\n [class.text-grayscale-90]=\"!disabled\"\n [class.text-grayscale-30]=\"disabled\"\n [class.cursor-pointer]=\"!disabled\"\n [class.cursor-auto]=\"disabled\"\n [ngClass]=\"button.icon\"\n [attr.aria-label]=\"button.label\"\n (click)=\"onIconButtonsClick($event, button.onClick)\"\n ></button>\n }\n\n @if (switchControl) {\n <s-switch\n class=\"switch pl-4\"\n [formControl]=\"switchControl\"\n (click)=\"$event.stopPropagation()\"\n >\n </s-switch>\n }\n </div>\n </div>\n\n @if (cache) {\n <div\n class=\"content bg-grayscale-0 overflow-hidden\"\n role=\"region\"\n [attr.aria-labelledby]=\"'accordion-panel-header-' + panelId\"\n [id]=\"'accordion-panel-content-' + panelId\"\n [@cacheAnimation]=\"isOpen\"\n [@.disabled]=\"isContentAnimationDisabled\"\n (@cacheAnimation.start)=\"onContentAnimationStart()\"\n (@cacheAnimation.done)=\"onContentAnimationDone()\"\n >\n <div class=\"content-container m-5\">\n <ng-container [ngTemplateOutlet]=\"panelContent\"></ng-container>\n </div>\n </div>\n } @else {\n @if (isOpen) {\n <div\n class=\"content bg-grayscale-0 overflow-hidden\"\n role=\"region\"\n [attr.aria-labelledby]=\"'accordion-panel-header-' + panelId\"\n [id]=\"'accordion-panel-content-' + panelId\"\n @cachelessAnimation\n [@.disabled]=\"isContentAnimationDisabled\"\n (@cachelessAnimation.start)=\"onContentAnimationStart()\"\n (@cachelessAnimation.done)=\"onContentAnimationDone()\"\n >\n <div class=\"content-container m-5\">\n <ng-container [ngTemplateOutlet]=\"panelContent\"></ng-container>\n </div>\n </div>\n }\n }\n</div>\n\n<ng-template #panelContent>\n <ng-content></ng-content>\n</ng-template>\n","import {\r\n AfterContentInit,\r\n OnChanges,\r\n Component,\r\n ContentChildren,\r\n Input,\r\n QueryList,\r\n SimpleChanges,\r\n OnDestroy,\r\n} from '@angular/core';\r\n\r\nimport { AccordionPanelComponent } from './components/accordion-panel/accordion-panel.component';\r\nimport { Subject, Subscription } from 'rxjs';\r\nimport { takeUntil } from 'rxjs/operators';\r\n\r\n/\r\n @description Componente de acordeão que gerencia a abertura e o fechamento de painéis\r\n * {@link AccordionPanelComponent}. Suporta modo de painel único (apenas um aberto por vez)\r\n * ou modo múltiplo (vários painéis abertos simultaneamente), configurável via input `multiple`.\r\n \r\n @example\r\n * ```html\r\n * <s-accordion [multiple]=\"false\" [activeIndex]=\"0\">\r\n * <s-accordion-panel header=\"Seção 1\">Conteúdo 1</s-accordion-panel>\r\n * <s-accordion-panel header=\"Seção 2\">Conteúdo 2</s-accordion-panel>\r\n * </s-accordion>\r\n * ```\r\n \r\n @category Inputs\r\n /\r\n@Component({\r\n selector: 's-accordion',\r\n templateUrl: './accordion.component.html',\r\n standalone: true,\r\n})\r\nexport class AccordionComponent implements AfterContentInit, OnChanges, OnDestroy {\r\n /\r\n @description Índice (ou lista de índices) do(s) painel(is) que devem iniciar abertos.\r\n * Aceita um número para painel único ou um array de números para o modo múltiplo.\r\n /\r\n @Input()\r\n public activeIndex?: number \| number[];\r\n\r\n /\r\n @description Permite que múltiplos painéis estejam abertos ao mesmo tempo.\r\n * Quando `false`, abrir um painel fecha automaticamente o anterior.\r\n \r\n @default false\r\n /\r\n @Input()\r\n public multiple = false;\r\n\r\n @ContentChildren(AccordionPanelComponent)\r\n public panelsComponents?: QueryList<AccordionPanelComponent>;\r\n\r\n private readonly _unsubscribe$ = new Subject<void>();\r\n private _panels: AccordionPanelComponent[] = [];\r\n private _openSubs: Subscription[] = [];\r\n\r\n public ngAfterContentInit(): void {\r\n if (this.panelsComponents) {\r\n this._panels = this.panelsComponents?.toArray();\r\n }\r\n\r\n this._openSubs = Array.from({ length: this._panels.length });\r\n\r\n this._setBehavior(this.multiple);\r\n this._setupTabs();\r\n }\r\n\r\n public ngOnChanges(changes: SimpleChanges): void {\r\n if (changes['multiple']) {\r\n this._setBehavior(changes['multiple'].currentValue);\r\n }\r\n }\r\n\r\n public ngOnDestroy(): void {\r\n this._unsubscribe$.next();\r\n this._unsubscribe$.complete();\r\n }\r\n\r\n private _setupTabs(): void {\r\n if (this._panels?.length) {\r\n if (this.activeIndex !== undefined && this.activeIndex !== null) {\r\n const activeTabs = Array.isArray(this.activeIndex)\r\n ? this._panels.filter((_, index) => (this.activeIndex as number[]).includes(index))\r\n : [this._panels[this.activeIndex]];\r\n\r\n if (activeTabs.length === 0) {\r\n throw new Error('activeIndex does not represent any panel.');\r\n }\r\n\r\n for (const activeTab of activeTabs) {\r\n if (!activeTab.disabled) {\r\n activeTab.isOpen = true;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n private _closeOtherTabs(exception: number) {\r\n this._panels.forEach((panel, index) => {\r\n if (index !== exception) {\r\n panel.isOpen = false;\r\n }\r\n });\r\n }\r\n\r\n private _setBehavior(multiple: boolean): void {\r\n if (multiple) {\r\n this._enableMultiplePanelBehavior();\r\n } else {\r\n this._enableSinglePanelBehavior();\r\n }\r\n }\r\n\r\n private _enableSinglePanelBehavior() {\r\n this._panels.forEach((panel, index) => {\r\n this._openSubs[index] = panel.panelOpened.pipe(takeUntil(this._unsubscribe$)).subscribe(() => {\r\n this._closeOtherTabs(index);\r\n });\r\n });\r\n }\r\n\r\n private _enableMultiplePanelBehavior() {\r\n this._panels.forEach((_, index) => {\r\n if (this._openSubs[index]) {\r\n this._openSubs[index].unsubscribe();\r\n }\r\n });\r\n }\r\n}\r\n","<div class=\"accordion border border-grayscale-30 rounded-xbig overflow-hidden\">\n <ng-content></ng-content>\n</div>\n","import { NgModule } from '@angular/core';\r\n\r\nimport { AccordionComponent } from './accordion.component';\r\nimport { AccordionPanelComponent } from './components/accordion-panel/accordion-panel.component';\r\n\r\n@NgModule({\r\n imports: [AccordionComponent, AccordionPanelComponent],\r\n exports: [AccordionComponent, AccordionPanelComponent],\r\n})\r\nexport class AccordionModule {}\r\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/seniorsistemas-angular-components-autocomplete.mjs CHANGED Viewed

@@ -10,7 +10,7 @@ import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import * as i2 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i5 from '@ngx-translate/core';
-import { TranslateModule } from '@ngx-translate/core';
+import { TranslatePipe, TranslateModule } from '@ngx-translate/core';
 import { Subject, Observable } from 'rxjs';
 import { debounceTime, distinctUntilChanged, switchMap, filter } from 'rxjs/operators';
 import { AutoComplete } from 'primeng/autocomplete';
@@ -25,11 +25,11 @@ class AutocompleteChipComponent {
         this.suggestionRemoved.emit(this.suggestion());
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AutocompleteChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: AutocompleteChipComponent, isStandalone: true, selector: "s-autocomplete-chip", inputs: { suggestion: { classPropertyName: "suggestion", publicName: "suggestion", isSignal: true, isRequired: true, transformFunction: null }, suggestionLabel: { classPropertyName: "suggestionLabel", publicName: "suggestionLabel", isSignal: true, isRequired: false, transformFunction: null }, removeIconClass: { classPropertyName: "removeIconClass", publicName: "removeIconClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { suggestionRemoved: "suggestionRemoved" }, ngImport: i0, template: "<div class=\"flex items-center gap-2 rounded-[4px] border border-grayscale-50 bg-grayscale-10 px-2\">\n    <span class=\"text-nowrap\">{{ suggestionLabel() ? suggestion()[suggestionLabel()!] : suggestion() }}</span>\n    <button (click)=\"removeSuggestion()\">\n        <i [class]=\"removeIconClass()\"></i>\n    </button>\n</div>\n" });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: AutocompleteChipComponent, isStandalone: true, selector: "s-autocomplete-chip", inputs: { suggestion: { classPropertyName: "suggestion", publicName: "suggestion", isSignal: true, isRequired: true, transformFunction: null }, suggestionLabel: { classPropertyName: "suggestionLabel", publicName: "suggestionLabel", isSignal: true, isRequired: false, transformFunction: null }, removeIconClass: { classPropertyName: "removeIconClass", publicName: "removeIconClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { suggestionRemoved: "suggestionRemoved" }, ngImport: i0, template: "<div class=\"flex items-center gap-2 rounded-[4px] border border-grayscale-50 bg-grayscale-10 px-2\">\n    <span class=\"text-nowrap\">{{ suggestionLabel() ? suggestion()[suggestionLabel()!] : suggestion() }}</span>\n    <button\n        (click)=\"removeSuggestion()\"\n        tabindex=\"-1\"\n        [attr.aria-label]=\"'platform.angular_components.remove' | translate\"\n        class=\"focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-[var(--s-focus-ring-color,#0090ff)]\"\n    >\n        <i [class]=\"removeIconClass()\"></i>\n    </button>\n</div>\n", dependencies: [{ kind: "pipe", type: TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AutocompleteChipComponent, decorators: [{
             type: Component,
-            args: [{ selector: 's-autocomplete-chip', standalone: true, template: "<div class=\"flex items-center gap-2 rounded-[4px] border border-grayscale-50 bg-grayscale-10 px-2\">\n    <span class=\"text-nowrap\">{{ suggestionLabel() ? suggestion()[suggestionLabel()!] : suggestion() }}</span>\n    <button (click)=\"removeSuggestion()\">\n        <i [class]=\"removeIconClass()\"></i>\n    </button>\n</div>\n" }]
+            args: [{ selector: 's-autocomplete-chip', standalone: true, imports: [TranslatePipe], template: "<div class=\"flex items-center gap-2 rounded-[4px] border border-grayscale-50 bg-grayscale-10 px-2\">\n    <span class=\"text-nowrap\">{{ suggestionLabel() ? suggestion()[suggestionLabel()!] : suggestion() }}</span>\n    <button\n        (click)=\"removeSuggestion()\"\n        tabindex=\"-1\"\n        [attr.aria-label]=\"'platform.angular_components.remove' | translate\"\n        class=\"focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-[var(--s-focus-ring-color,#0090ff)]\"\n    >\n        <i [class]=\"removeIconClass()\"></i>\n    </button>\n</div>\n" }]
         }] });
 /**
@@ -307,6 +307,11 @@ class AutocompleteComponent {
             }
         };
         switch (event.key) {
+            case 'Backspace':
+                if (this.multiple() && !this.inputValue() && this.values().length > 0) {
+                    this.removeSuggestion(this.values()[this.values().length - 1]);
+                }
+                break;
             case 'ArrowDown':
                 event.preventDefault();
                 this._focusNextSuggestion(suggestions);
@@ -604,7 +609,7 @@ class AutocompleteComponent {
                 useExisting: forwardRef(() => AutocompleteComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["inputEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n    #containerDiv\n    cdkOverlayOrigin\n    #trigger=\"cdkOverlayOrigin\"\n    class=\"flex h-[35px] w-full items-center overflow-hidden rounded-[4px] border focus-within:border-2 focus-within:border-primary hover:bg-grayscale-10\"\n    [class]=\"inputClass()\"\n    [ngClass]=\"{\n        'pointer-events-none border-grayscale-20 bg-grayscale-5 text-grayscale-30': disabled(),\n        'pointer-events-auto border-grayscale-30 bg-grayscale-0 text-grayscale-90': !disabled(),\n        'border-criticality-red': invalid(),\n    }\"\n>\n    <div\n        class=\"flex flex-grow gap-2 px-2\"\n        [ngClass]=\"{\n            'border-r': dropdown(),\n            'border-grayscale-20': dropdown() && disabled(),\n            'border-grayscale-30 focus-within:border-r-2 focus-within:border-r-primary': dropdown() && !disabled(),\n            'bg-grayscale-5': disabled(),\n            'bg-grayscale-0': !disabled(),\n        }\"\n    >\n        @if (multiple() && values().length > 0) {\n            <div class=\"flex flex-wrap items-center gap-2\">\n                @for (suggestion of values(); track suggestion) {\n                    <s-autocomplete-chip\n                        [suggestion]=\"suggestion\"\n                        [suggestionLabel]=\"suggestionLabel()\"\n                        [removeIconClass]=\"removeIconClass()\"\n                        (suggestionRemoved)=\"removeSuggestion($event)\"\n                    ></s-autocomplete-chip>\n                }\n            </div>\n        }\n        <input\n            #inputEl\n            class=\"min-h-[35px] grow outline-none\"\n            type=\"text\"\n            [placeholder]=\"placeholder() ?? 'platform.angular_components.type_to_search' | translate\"\n            [readOnly]=\"readonly()\"\n            [(ngModel)]=\"inputValue\"\n            [attr.aria-disabled]=\"disabled()\"\n            [attr.aria-autocomplete]=\"multiple() ? 'list' : 'both'\"\n            [attr.aria-activedescendant]=\"focusedIndex() >= 0 ? filteredSuggestions()[focusedIndex()].id : null\"\n            role=\"searchbox\"\n            (input)=\"onInput($event)\"\n            (keydown)=\"onKeyDown($event)\"\n            (keyUp)=\"onKeyUp($event)\"\n            (blur)=\"onInputBlur($event)\"\n            (focus)=\"onInputFocus($event)\"\n        />\n\n        @if (loading()) {\n            <div class=\"flex items-center justify-center\">\n                <svg\n                    width=\"20\"\n                    height=\"20\"\n                    viewBox=\"0 0 20 20\"\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    class=\"animate-spin\"\n                >\n                    <circle\n                        cx=\"10\"\n                        cy=\"10\"\n                        r=\"9\"\n                        stroke=\"#428bca\"\n                        stroke-width=\"2\"\n                        fill=\"none\"\n                        stroke-dasharray=\"56.5\"\n                        stroke-dashoffset=\"10\"\n                        stroke-linecap=\"round\"\n                    />\n                </svg>\n            </div>\n        } @else {\n            @if (value() && !this.disabled()) {\n                <button\n                    class=\"px-2\"\n                    (click)=\"clear()\"\n                    tabindex=\"-1\"\n                >\n                    <i\n                        class=\"text-grayscale-60\"\n                        [class]=\"clearIconClass()\"\n                    ></i>\n                </button>\n            }\n        }\n    </div>\n\n    @if (dropdown()) {\n        <button\n            class=\"flex h-full w-[35px] flex-shrink-0 flex-grow-0 items-center justify-center hover:bg-grayscale-10\"\n            (click)=\"toggleDropdown()\"\n        >\n            <i\n                class=\"fas text-grayscale-90\"\n                [class.fa-caret-down]=\"!isOpen()\"\n                [class.fa-caret-up]=\"isOpen()\"\n            ></i>\n        </button>\n    }\n</div>\n\n@if (showEmptyMessage() || (filteredSuggestions().length > 0 && !readonly())) {\n    <ng-template\n        #dropdownTemplate\n        cdkConnectedOverlay\n        [cdkConnectedOverlayOrigin]=\"trigger\"\n        [cdkConnectedOverlayOpen]=\"isOpen()\"\n        [cdkConnectedOverlayHasBackdrop]=\"true\"\n        (backdropClick)=\"isOpen.set(false)\"\n        cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n        (detach)=\"isOpen.set(false)\"\n    >\n        <div\n            [id]=\"'dropdown-container-' + componentId\"\n            class=\"mt-0.5 rounded-[4px] bg-grayscale-0 py-1 shadow\"\n            [style.width.px]=\"containerDiv.offsetWidth\"\n        >\n            <ul\n                class=\"max-h-52 overflow-auto\"\n                role=\"listbox\"\n            >\n                <!-- Virtual scroll -->\n                @if (virtualScroll() && filteredSuggestions().length > 10) {\n                    <cdk-virtual-scroll-viewport\n                        [itemSize]=\"virtualScrollItemSize()\"\n                        class=\"h-52 overflow-auto\"\n                    >\n                        <ng-container\n                            *cdkVirtualFor=\"\n                                let suggestion of enrichedFilteredSuggestions();\n                                let i = $index;\n                                trackBy: trackById\n                            \"\n                        >\n                            <ng-container\n                                [ngTemplateOutlet]=\"suggestionItemTemplate\"\n                                [ngTemplateOutletContext]=\"{ suggestion, i }\"\n                            ></ng-container>\n                        </ng-container>\n                    </cdk-virtual-scroll-viewport>\n                }\n\n                <!-- Normal list -->\n                @if (!virtualScroll() || filteredSuggestions().length <= 10) {\n                    @for (suggestion of enrichedFilteredSuggestions(); track suggestion.id; let i = $index) {\n                        <ng-container\n                            [ngTemplateOutlet]=\"suggestionItemTemplate\"\n                            [ngTemplateOutletContext]=\"{ suggestion, i }\"\n                        ></ng-container>\n                    }\n                }\n\n                @if (showEmptyMessage()) {\n                    <span class=\"p-3 text-grayscale-60\">{{\n                        emptyMessage() ?? 'platform.angular_components.no_records_found' | translate\n                    }}</span>\n                }\n            </ul>\n        </div>\n    </ng-template>\n}\n\n<ng-template\n    #suggestionItemTemplate\n    let-suggestion=\"suggestion\"\n    let-i=\"i\"\n>\n    <li\n        [id]=\"suggestion.id\"\n        class=\"rounded-xsmall flex cursor-pointer items-center gap-2 px-3 py-2 text-grayscale-70\"\n        [class.bg-grayscale-10]=\"i === focusedIndex()\"\n        [class.bg-grayscale-20]=\"suggestion.isSelected\"\n        [attr.aria-selected]=\"suggestion.isSelected\"\n        role=\"option\"\n        (click)=\"selectSuggestion(suggestion.data)\"\n    >\n        @if (checkmark() && multiple() && suggestion.isSelected) {\n            <i [class]=\"checkIconClass()\"></i>\n        }\n        {{ suggestionLabel() ? suggestion.data[suggestionLabel()!] : suggestion.data }}\n    </li>\n</ng-template>\n\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i3.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i3.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: i4.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i4.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i4.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "component", type: AutocompleteChipComponent, selector: "s-autocomplete-chip", inputs: ["suggestion", "suggestionLabel", "removeIconClass"], outputs: ["suggestionRemoved"] }] });
+        ], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["inputEl"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n    #containerDiv\n    cdkOverlayOrigin\n    #trigger=\"cdkOverlayOrigin\"\n    class=\"flex h-[35px] w-full items-center overflow-hidden rounded-[4px] border hover:bg-grayscale-10 focus-within:outline focus-within:outline-2 focus-within:outline-offset-[-2px] focus-within:outline-[var(--s-focus-ring-color,#0090ff)]\"\n    [class]=\"inputClass()\"\n    [ngClass]=\"{\n        'pointer-events-none border-grayscale-20 bg-grayscale-5 text-grayscale-30': disabled(),\n        'pointer-events-auto border-grayscale-30 bg-grayscale-0 text-grayscale-90': !disabled(),\n        'border-criticality-red': invalid(),\n    }\"\n>\n    <div\n        class=\"flex flex-grow gap-2 px-2\"\n        [ngClass]=\"{\n            'border-r': dropdown(),\n            'border-grayscale-20': dropdown() && disabled(),\n            'border-grayscale-30': dropdown() && !disabled(),\n            'bg-grayscale-5': disabled(),\n            'bg-grayscale-0': !disabled(),\n        }\"\n    >\n        @if (multiple() && values().length > 0) {\n            <div class=\"flex flex-wrap items-center gap-2\">\n                @for (suggestion of values(); track suggestion) {\n                    <s-autocomplete-chip\n                        [suggestion]=\"suggestion\"\n                        [suggestionLabel]=\"suggestionLabel()\"\n                        [removeIconClass]=\"removeIconClass()\"\n                        (suggestionRemoved)=\"removeSuggestion($event)\"\n                    ></s-autocomplete-chip>\n                }\n            </div>\n        }\n        <input\n            #inputEl\n            class=\"min-h-[35px] grow outline-none\"\n            type=\"text\"\n            [placeholder]=\"placeholder() ?? 'platform.angular_components.type_to_search' | translate\"\n            [readOnly]=\"readonly()\"\n            [(ngModel)]=\"inputValue\"\n            [attr.aria-disabled]=\"disabled()\"\n            [attr.aria-autocomplete]=\"multiple() ? 'list' : 'both'\"\n            [attr.aria-activedescendant]=\"focusedIndex() >= 0 ? filteredSuggestions()[focusedIndex()].id : null\"\n            role=\"searchbox\"\n            (input)=\"onInput($event)\"\n            (keydown)=\"onKeyDown($event)\"\n            (keyUp)=\"onKeyUp($event)\"\n            (blur)=\"onInputBlur($event)\"\n            (focus)=\"onInputFocus($event)\"\n        />\n\n        @if (loading()) {\n            <div class=\"flex items-center justify-center\">\n                <svg\n                    width=\"20\"\n                    height=\"20\"\n                    viewBox=\"0 0 20 20\"\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    class=\"animate-spin\"\n                >\n                    <circle\n                        cx=\"10\"\n                        cy=\"10\"\n                        r=\"9\"\n                        stroke=\"#428bca\"\n                        stroke-width=\"2\"\n                        fill=\"none\"\n                        stroke-dasharray=\"56.5\"\n                        stroke-dashoffset=\"10\"\n                        stroke-linecap=\"round\"\n                    />\n                </svg>\n            </div>\n        } @else {\n            @if (value() && !this.disabled()) {\n                <button\n                    class=\"px-2\"\n                    (click)=\"clear()\"\n                    tabindex=\"-1\"\n                >\n                    <i\n                        class=\"text-grayscale-60\"\n                        [class]=\"clearIconClass()\"\n                    ></i>\n                </button>\n            }\n        }\n    </div>\n\n    @if (dropdown()) {\n        <button\n            class=\"flex h-full w-[35px] flex-shrink-0 flex-grow-0 items-center justify-center hover:bg-grayscale-10\"\n            (click)=\"toggleDropdown()\"\n        >\n            <i\n                class=\"fas text-grayscale-90\"\n                [class.fa-caret-down]=\"!isOpen()\"\n                [class.fa-caret-up]=\"isOpen()\"\n            ></i>\n        </button>\n    }\n</div>\n\n@if (showEmptyMessage() || (filteredSuggestions().length > 0 && !readonly())) {\n    <ng-template\n        #dropdownTemplate\n        cdkConnectedOverlay\n        [cdkConnectedOverlayOrigin]=\"trigger\"\n        [cdkConnectedOverlayOpen]=\"isOpen()\"\n        [cdkConnectedOverlayHasBackdrop]=\"true\"\n        (backdropClick)=\"isOpen.set(false)\"\n        cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n        (detach)=\"isOpen.set(false)\"\n    >\n        <div\n            [id]=\"'dropdown-container-' + componentId\"\n            class=\"mt-0.5 rounded-[4px] bg-grayscale-0 py-1 shadow\"\n            [style.width.px]=\"containerDiv.offsetWidth\"\n        >\n            <ul\n                class=\"max-h-52 overflow-auto\"\n                role=\"listbox\"\n            >\n                <!-- Virtual scroll -->\n                @if (virtualScroll() && filteredSuggestions().length > 10) {\n                    <cdk-virtual-scroll-viewport\n                        [itemSize]=\"virtualScrollItemSize()\"\n                        class=\"h-52 overflow-auto\"\n                    >\n                        <ng-container\n                            *cdkVirtualFor=\"\n                                let suggestion of enrichedFilteredSuggestions();\n                                let i = $index;\n                                trackBy: trackById\n                            \"\n                        >\n                            <ng-container\n                                [ngTemplateOutlet]=\"suggestionItemTemplate\"\n                                [ngTemplateOutletContext]=\"{ suggestion, i }\"\n                            ></ng-container>\n                        </ng-container>\n                    </cdk-virtual-scroll-viewport>\n                }\n\n                <!-- Normal list -->\n                @if (!virtualScroll() || filteredSuggestions().length <= 10) {\n                    @for (suggestion of enrichedFilteredSuggestions(); track suggestion.id; let i = $index) {\n                        <ng-container\n                            [ngTemplateOutlet]=\"suggestionItemTemplate\"\n                            [ngTemplateOutletContext]=\"{ suggestion, i }\"\n                        ></ng-container>\n                    }\n                }\n\n                @if (showEmptyMessage()) {\n                    <span class=\"p-3 text-grayscale-60\">{{\n                        emptyMessage() ?? 'platform.angular_components.no_records_found' | translate\n                    }}</span>\n                }\n            </ul>\n        </div>\n    </ng-template>\n}\n\n<ng-template\n    #suggestionItemTemplate\n    let-suggestion=\"suggestion\"\n    let-i=\"i\"\n>\n    <li\n        [id]=\"suggestion.id\"\n        class=\"rounded-xsmall flex cursor-pointer items-center gap-2 px-3 py-2 text-grayscale-70\"\n        [class.bg-grayscale-10]=\"i === focusedIndex()\"\n        [class.bg-grayscale-20]=\"suggestion.isSelected\"\n        [attr.aria-selected]=\"suggestion.isSelected\"\n        role=\"option\"\n        (click)=\"selectSuggestion(suggestion.data)\"\n    >\n        @if (checkmark() && multiple() && suggestion.isSelected) {\n            <i [class]=\"checkIconClass()\"></i>\n        }\n        {{ suggestionLabel() ? suggestion.data[suggestionLabel()!] : suggestion.data }}\n    </li>\n</ng-template>\n\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i3.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i3.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: i4.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i4.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i4.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "component", type: AutocompleteChipComponent, selector: "s-autocomplete-chip", inputs: ["suggestion", "suggestionLabel", "removeIconClass"], outputs: ["suggestionRemoved"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AutocompleteComponent, decorators: [{
             type: Component,
@@ -628,7 +633,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         '[attr.aria-haspopup]': '"listbox"',
                         '[attr.aria-owns]': 'isOpen() ? "dropdown-container-" + componentId : null',
                         '(window:resize)': 'onWindowResize()',
-                    }, template: "<div\n    #containerDiv\n    cdkOverlayOrigin\n    #trigger=\"cdkOverlayOrigin\"\n    class=\"flex h-[35px] w-full items-center overflow-hidden rounded-[4px] border focus-within:border-2 focus-within:border-primary hover:bg-grayscale-10\"\n    [class]=\"inputClass()\"\n    [ngClass]=\"{\n        'pointer-events-none border-grayscale-20 bg-grayscale-5 text-grayscale-30': disabled(),\n        'pointer-events-auto border-grayscale-30 bg-grayscale-0 text-grayscale-90': !disabled(),\n        'border-criticality-red': invalid(),\n    }\"\n>\n    <div\n        class=\"flex flex-grow gap-2 px-2\"\n        [ngClass]=\"{\n            'border-r': dropdown(),\n            'border-grayscale-20': dropdown() && disabled(),\n            'border-grayscale-30 focus-within:border-r-2 focus-within:border-r-primary': dropdown() && !disabled(),\n            'bg-grayscale-5': disabled(),\n            'bg-grayscale-0': !disabled(),\n        }\"\n    >\n        @if (multiple() && values().length > 0) {\n            <div class=\"flex flex-wrap items-center gap-2\">\n                @for (suggestion of values(); track suggestion) {\n                    <s-autocomplete-chip\n                        [suggestion]=\"suggestion\"\n                        [suggestionLabel]=\"suggestionLabel()\"\n                        [removeIconClass]=\"removeIconClass()\"\n                        (suggestionRemoved)=\"removeSuggestion($event)\"\n                    ></s-autocomplete-chip>\n                }\n            </div>\n        }\n        <input\n            #inputEl\n            class=\"min-h-[35px] grow outline-none\"\n            type=\"text\"\n            [placeholder]=\"placeholder() ?? 'platform.angular_components.type_to_search' | translate\"\n            [readOnly]=\"readonly()\"\n            [(ngModel)]=\"inputValue\"\n            [attr.aria-disabled]=\"disabled()\"\n            [attr.aria-autocomplete]=\"multiple() ? 'list' : 'both'\"\n            [attr.aria-activedescendant]=\"focusedIndex() >= 0 ? filteredSuggestions()[focusedIndex()].id : null\"\n            role=\"searchbox\"\n            (input)=\"onInput($event)\"\n            (keydown)=\"onKeyDown($event)\"\n            (keyUp)=\"onKeyUp($event)\"\n            (blur)=\"onInputBlur($event)\"\n            (focus)=\"onInputFocus($event)\"\n        />\n\n        @if (loading()) {\n            <div class=\"flex items-center justify-center\">\n                <svg\n                    width=\"20\"\n                    height=\"20\"\n                    viewBox=\"0 0 20 20\"\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    class=\"animate-spin\"\n                >\n                    <circle\n                        cx=\"10\"\n                        cy=\"10\"\n                        r=\"9\"\n                        stroke=\"#428bca\"\n                        stroke-width=\"2\"\n                        fill=\"none\"\n                        stroke-dasharray=\"56.5\"\n                        stroke-dashoffset=\"10\"\n                        stroke-linecap=\"round\"\n                    />\n                </svg>\n            </div>\n        } @else {\n            @if (value() && !this.disabled()) {\n                <button\n                    class=\"px-2\"\n                    (click)=\"clear()\"\n                    tabindex=\"-1\"\n                >\n                    <i\n                        class=\"text-grayscale-60\"\n                        [class]=\"clearIconClass()\"\n                    ></i>\n                </button>\n            }\n        }\n    </div>\n\n    @if (dropdown()) {\n        <button\n            class=\"flex h-full w-[35px] flex-shrink-0 flex-grow-0 items-center justify-center hover:bg-grayscale-10\"\n            (click)=\"toggleDropdown()\"\n        >\n            <i\n                class=\"fas text-grayscale-90\"\n                [class.fa-caret-down]=\"!isOpen()\"\n                [class.fa-caret-up]=\"isOpen()\"\n            ></i>\n        </button>\n    }\n</div>\n\n@if (showEmptyMessage() || (filteredSuggestions().length > 0 && !readonly())) {\n    <ng-template\n        #dropdownTemplate\n        cdkConnectedOverlay\n        [cdkConnectedOverlayOrigin]=\"trigger\"\n        [cdkConnectedOverlayOpen]=\"isOpen()\"\n        [cdkConnectedOverlayHasBackdrop]=\"true\"\n        (backdropClick)=\"isOpen.set(false)\"\n        cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n        (detach)=\"isOpen.set(false)\"\n    >\n        <div\n            [id]=\"'dropdown-container-' + componentId\"\n            class=\"mt-0.5 rounded-[4px] bg-grayscale-0 py-1 shadow\"\n            [style.width.px]=\"containerDiv.offsetWidth\"\n        >\n            <ul\n                class=\"max-h-52 overflow-auto\"\n                role=\"listbox\"\n            >\n                <!-- Virtual scroll -->\n                @if (virtualScroll() && filteredSuggestions().length > 10) {\n                    <cdk-virtual-scroll-viewport\n                        [itemSize]=\"virtualScrollItemSize()\"\n                        class=\"h-52 overflow-auto\"\n                    >\n                        <ng-container\n                            *cdkVirtualFor=\"\n                                let suggestion of enrichedFilteredSuggestions();\n                                let i = $index;\n                                trackBy: trackById\n                            \"\n                        >\n                            <ng-container\n                                [ngTemplateOutlet]=\"suggestionItemTemplate\"\n                                [ngTemplateOutletContext]=\"{ suggestion, i }\"\n                            ></ng-container>\n                        </ng-container>\n                    </cdk-virtual-scroll-viewport>\n                }\n\n                <!-- Normal list -->\n                @if (!virtualScroll() || filteredSuggestions().length <= 10) {\n                    @for (suggestion of enrichedFilteredSuggestions(); track suggestion.id; let i = $index) {\n                        <ng-container\n                            [ngTemplateOutlet]=\"suggestionItemTemplate\"\n                            [ngTemplateOutletContext]=\"{ suggestion, i }\"\n                        ></ng-container>\n                    }\n                }\n\n                @if (showEmptyMessage()) {\n                    <span class=\"p-3 text-grayscale-60\">{{\n                        emptyMessage() ?? 'platform.angular_components.no_records_found' | translate\n                    }}</span>\n                }\n            </ul>\n        </div>\n    </ng-template>\n}\n\n<ng-template\n    #suggestionItemTemplate\n    let-suggestion=\"suggestion\"\n    let-i=\"i\"\n>\n    <li\n        [id]=\"suggestion.id\"\n        class=\"rounded-xsmall flex cursor-pointer items-center gap-2 px-3 py-2 text-grayscale-70\"\n        [class.bg-grayscale-10]=\"i === focusedIndex()\"\n        [class.bg-grayscale-20]=\"suggestion.isSelected\"\n        [attr.aria-selected]=\"suggestion.isSelected\"\n        role=\"option\"\n        (click)=\"selectSuggestion(suggestion.data)\"\n    >\n        @if (checkmark() && multiple() && suggestion.isSelected) {\n            <i [class]=\"checkIconClass()\"></i>\n        }\n        {{ suggestionLabel() ? suggestion.data[suggestionLabel()!] : suggestion.data }}\n    </li>\n</ng-template>\n\n" }]
+                    }, template: "<div\n    #containerDiv\n    cdkOverlayOrigin\n    #trigger=\"cdkOverlayOrigin\"\n    class=\"flex h-[35px] w-full items-center overflow-hidden rounded-[4px] border hover:bg-grayscale-10 focus-within:outline focus-within:outline-2 focus-within:outline-offset-[-2px] focus-within:outline-[var(--s-focus-ring-color,#0090ff)]\"\n    [class]=\"inputClass()\"\n    [ngClass]=\"{\n        'pointer-events-none border-grayscale-20 bg-grayscale-5 text-grayscale-30': disabled(),\n        'pointer-events-auto border-grayscale-30 bg-grayscale-0 text-grayscale-90': !disabled(),\n        'border-criticality-red': invalid(),\n    }\"\n>\n    <div\n        class=\"flex flex-grow gap-2 px-2\"\n        [ngClass]=\"{\n            'border-r': dropdown(),\n            'border-grayscale-20': dropdown() && disabled(),\n            'border-grayscale-30': dropdown() && !disabled(),\n            'bg-grayscale-5': disabled(),\n            'bg-grayscale-0': !disabled(),\n        }\"\n    >\n        @if (multiple() && values().length > 0) {\n            <div class=\"flex flex-wrap items-center gap-2\">\n                @for (suggestion of values(); track suggestion) {\n                    <s-autocomplete-chip\n                        [suggestion]=\"suggestion\"\n                        [suggestionLabel]=\"suggestionLabel()\"\n                        [removeIconClass]=\"removeIconClass()\"\n                        (suggestionRemoved)=\"removeSuggestion($event)\"\n                    ></s-autocomplete-chip>\n                }\n            </div>\n        }\n        <input\n            #inputEl\n            class=\"min-h-[35px] grow outline-none\"\n            type=\"text\"\n            [placeholder]=\"placeholder() ?? 'platform.angular_components.type_to_search' | translate\"\n            [readOnly]=\"readonly()\"\n            [(ngModel)]=\"inputValue\"\n            [attr.aria-disabled]=\"disabled()\"\n            [attr.aria-autocomplete]=\"multiple() ? 'list' : 'both'\"\n            [attr.aria-activedescendant]=\"focusedIndex() >= 0 ? filteredSuggestions()[focusedIndex()].id : null\"\n            role=\"searchbox\"\n            (input)=\"onInput($event)\"\n            (keydown)=\"onKeyDown($event)\"\n            (keyUp)=\"onKeyUp($event)\"\n            (blur)=\"onInputBlur($event)\"\n            (focus)=\"onInputFocus($event)\"\n        />\n\n        @if (loading()) {\n            <div class=\"flex items-center justify-center\">\n                <svg\n                    width=\"20\"\n                    height=\"20\"\n                    viewBox=\"0 0 20 20\"\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    class=\"animate-spin\"\n                >\n                    <circle\n                        cx=\"10\"\n                        cy=\"10\"\n                        r=\"9\"\n                        stroke=\"#428bca\"\n                        stroke-width=\"2\"\n                        fill=\"none\"\n                        stroke-dasharray=\"56.5\"\n                        stroke-dashoffset=\"10\"\n                        stroke-linecap=\"round\"\n                    />\n                </svg>\n            </div>\n        } @else {\n            @if (value() && !this.disabled()) {\n                <button\n                    class=\"px-2\"\n                    (click)=\"clear()\"\n                    tabindex=\"-1\"\n                >\n                    <i\n                        class=\"text-grayscale-60\"\n                        [class]=\"clearIconClass()\"\n                    ></i>\n                </button>\n            }\n        }\n    </div>\n\n    @if (dropdown()) {\n        <button\n            class=\"flex h-full w-[35px] flex-shrink-0 flex-grow-0 items-center justify-center hover:bg-grayscale-10\"\n            (click)=\"toggleDropdown()\"\n        >\n            <i\n                class=\"fas text-grayscale-90\"\n                [class.fa-caret-down]=\"!isOpen()\"\n                [class.fa-caret-up]=\"isOpen()\"\n            ></i>\n        </button>\n    }\n</div>\n\n@if (showEmptyMessage() || (filteredSuggestions().length > 0 && !readonly())) {\n    <ng-template\n        #dropdownTemplate\n        cdkConnectedOverlay\n        [cdkConnectedOverlayOrigin]=\"trigger\"\n        [cdkConnectedOverlayOpen]=\"isOpen()\"\n        [cdkConnectedOverlayHasBackdrop]=\"true\"\n        (backdropClick)=\"isOpen.set(false)\"\n        cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n        (detach)=\"isOpen.set(false)\"\n    >\n        <div\n            [id]=\"'dropdown-container-' + componentId\"\n            class=\"mt-0.5 rounded-[4px] bg-grayscale-0 py-1 shadow\"\n            [style.width.px]=\"containerDiv.offsetWidth\"\n        >\n            <ul\n                class=\"max-h-52 overflow-auto\"\n                role=\"listbox\"\n            >\n                <!-- Virtual scroll -->\n                @if (virtualScroll() && filteredSuggestions().length > 10) {\n                    <cdk-virtual-scroll-viewport\n                        [itemSize]=\"virtualScrollItemSize()\"\n                        class=\"h-52 overflow-auto\"\n                    >\n                        <ng-container\n                            *cdkVirtualFor=\"\n                                let suggestion of enrichedFilteredSuggestions();\n                                let i = $index;\n                                trackBy: trackById\n                            \"\n                        >\n                            <ng-container\n                                [ngTemplateOutlet]=\"suggestionItemTemplate\"\n                                [ngTemplateOutletContext]=\"{ suggestion, i }\"\n                            ></ng-container>\n                        </ng-container>\n                    </cdk-virtual-scroll-viewport>\n                }\n\n                <!-- Normal list -->\n                @if (!virtualScroll() || filteredSuggestions().length <= 10) {\n                    @for (suggestion of enrichedFilteredSuggestions(); track suggestion.id; let i = $index) {\n                        <ng-container\n                            [ngTemplateOutlet]=\"suggestionItemTemplate\"\n                            [ngTemplateOutletContext]=\"{ suggestion, i }\"\n                        ></ng-container>\n                    }\n                }\n\n                @if (showEmptyMessage()) {\n                    <span class=\"p-3 text-grayscale-60\">{{\n                        emptyMessage() ?? 'platform.angular_components.no_records_found' | translate\n                    }}</span>\n                }\n            </ul>\n        </div>\n    </ng-template>\n}\n\n<ng-template\n    #suggestionItemTemplate\n    let-suggestion=\"suggestion\"\n    let-i=\"i\"\n>\n    <li\n        [id]=\"suggestion.id\"\n        class=\"rounded-xsmall flex cursor-pointer items-center gap-2 px-3 py-2 text-grayscale-70\"\n        [class.bg-grayscale-10]=\"i === focusedIndex()\"\n        [class.bg-grayscale-20]=\"suggestion.isSelected\"\n        [attr.aria-selected]=\"suggestion.isSelected\"\n        role=\"option\"\n        (click)=\"selectSuggestion(suggestion.data)\"\n    >\n        @if (checkmark() && multiple() && suggestion.isSelected) {\n            <i [class]=\"checkIconClass()\"></i>\n        }\n        {{ suggestionLabel() ? suggestion.data[suggestionLabel()!] : suggestion.data }}\n    </li>\n</ng-template>\n\n" }]
         }], ctorParameters: () => [] });
 /**