@testgorilla/tgo-ui 8.19.0 → 9.0.0

package/fesm2022/testgorilla-tgo-ui-components-prompt.mjs

@@ -1,32 +1,21 @@
+import { CdkOverlayOrigin, CdkConnectedOverlay } from '@angular/cdk/overlay';
+import { NgClass, AsyncPipe, CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
 import { signal, input, booleanAttribute, output, computed, inject, DestroyRef, effect, viewChild, forwardRef, Input, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
-import { fromEvent, map, debounceTime, filter, tap, firstValueFrom } from 'rxjs';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
-import * as i11 from '@testgorilla/tgo-ui/components/core';
-import { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
-import * as i1 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i2 from '@testgorilla/tgo-ui/components/field';
-import { FieldComponentModule } from '@testgorilla/tgo-ui/components/field';
-import * as i3 from '@testgorilla/tgo-ui/components/button';
-import { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';
-import * as i4 from '@testgorilla/tgo-ui/components/overflow-menu';
-import { OverflowMenuComponentModule } from '@testgorilla/tgo-ui/components/overflow-menu';
-import * as i5 from '@testgorilla/tgo-ui/components/tag';
-import { TagComponentModule } from '@testgorilla/tgo-ui/components/tag';
-import * as i6 from '@testgorilla/tgo-ui/components/badge';
-import { BadgeComponentModule } from '@testgorilla/tgo-ui/components/badge';
-import * as i7 from '@angular/cdk/overlay';
-import { CdkOverlayOrigin, CdkConnectedOverlay } from '@angular/cdk/overlay';
-import * as i8 from '@angular/material/tooltip';
 import { MatTooltip } from '@angular/material/tooltip';
-import * as i9 from '@testgorilla/tgo-ui/components/icon';
-import { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';
-import * as i10 from '@testgorilla/tgo-ui/components/skeleton';
+import { fromEvent, map, debounceTime, filter, tap, firstValueFrom } from 'rxjs';
+import { BadgeComponent, BadgeComponentModule } from '@testgorilla/tgo-ui/components/badge';
+import { ButtonComponent, ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';
+import { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';
+import { FieldComponent, FieldComponentModule } from '@testgorilla/tgo-ui/components/field';
+import { IconComponent, IconComponentModule } from '@testgorilla/tgo-ui/components/icon';
+import { OverflowMenuComponent, OverflowMenuComponentModule } from '@testgorilla/tgo-ui/components/overflow-menu';
 import { SkeletonComponent } from '@testgorilla/tgo-ui/components/skeleton';
-import { CardComponentModule } from '@testgorilla/tgo-ui/components/card';
+import { TagComponent, TagComponentModule } from '@testgorilla/tgo-ui/components/tag';
 import { CdkTextareaAutosize } from '@angular/cdk/text-field';
+import { CardComponentModule } from '@testgorilla/tgo-ui/components/card';
 import { TooltipComponentModule } from '@testgorilla/tgo-ui/components/tooltip';
 
 class PromptComponent {
@@ -101,7 +90,7 @@ class PromptComponent {
                 overlayY: 'top',
             },
         ];
-        this.onChange = (_v) => { };
+        this.onChange = (_value) => { };
         this.onTouch = () => { };
     }
     /**
@@ -125,7 +114,7 @@ class PromptComponent {
     }
     async uploadFile(event) {
         const files = event.currentTarget.files;
-        if (files && files.length) {
+        if (files?.length) {
             this.promptFilesList.update(list => {
                 list.push(files.item(0));
                 return list;
@@ -220,14 +209,14 @@ class PromptComponent {
             return;
         }
         fromEvent(this.fieldComponentRef().field.nativeElement, 'input')
-            .pipe(takeUntilDestroyed(this.destroyRef), map((event) => event.target.value), debounceTime(200), filter(value => typeof value === 'string'), tap(value => {
+            .pipe(map((event) => event.target.value), debounceTime(200), filter(value => typeof value === 'string'), tap(value => {
             this.promptTextValue.set(value);
             this.keepDropdownClosed.set(false);
             if (this.autocompleteSuggestion()) {
                 this.autocompleteSuggestion.set('');
             }
             this.emitValue();
-        }))
+        }), takeUntilDestroyed(this.destroyRef))
             .subscribe();
     }
     initTags() {
@@ -260,8 +249,8 @@ class PromptComponent {
         this.fileListMenuConfig.set([]);
     }
     writeValue(value) {
-        this.promptTextValue.set(value?.text || '');
-        this.promptFilesList.set(value?.files || []);
+        this.promptTextValue.set(value?.text ?? '');
+        this.promptFilesList.set(value?.files ?? []);
     }
     registerOnChange(fn) {
         this.onChange = fn;
@@ -284,30 +273,32 @@ class PromptComponent {
         }
     }
     onActionTagPress() {
-        if (this.isLocked() || this.actionTag()?.disabled)
+        if (this.isLocked() || this.actionTag()?.disabled) {
             return;
+        }
         this.fileDrop()?.nativeElement.click();
     }
     handleActionTagFile(event) {
-        const input = event.currentTarget;
-        const file = input.files?.item(0) ?? null;
-        if (file)
+        const inputEl = event.currentTarget;
+        const file = inputEl.files?.item(0) ?? null;
+        if (file) {
             this.actionTagFileSelected.emit(file);
-        input.value = '';
+        }
+        inputEl.value = '';
     }
     emitValue() {
         this.onChange({ text: this.promptTextValue() || '', files: this.promptFilesList() });
         this.onTouch();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PromptComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: PromptComponent, isStandalone: false, selector: "ui-prompt", inputs: { tags: { classPropertyName: "tags", publicName: "tags", isSignal: true, isRequired: false, transformFunction: null }, actionTag: { classPropertyName: "actionTag", publicName: "actionTag", isSignal: true, isRequired: false, transformFunction: null }, maxCharacters: { classPropertyName: "maxCharacters", publicName: "maxCharacters", isSignal: true, isRequired: false, transformFunction: null }, supportedFileTypes: { classPropertyName: "supportedFileTypes", publicName: "supportedFileTypes", isSignal: true, isRequired: false, transformFunction: null }, autoClear: { classPropertyName: "autoClear", publicName: "autoClear", isSignal: true, isRequired: false, transformFunction: null }, showSendButton: { classPropertyName: "showSendButton", publicName: "showSendButton", isSignal: true, isRequired: false, transformFunction: null }, sendButtonDisabled: { classPropertyName: "sendButtonDisabled", publicName: "sendButtonDisabled", isSignal: true, isRequired: false, transformFunction: null }, enableFileUpload: { classPropertyName: "enableFileUpload", publicName: "enableFileUpload", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, dropdownItems: { classPropertyName: "dropdownItems", publicName: "dropdownItems", isSignal: true, isRequired: false, transformFunction: null }, dropdownHeading: { classPropertyName: "dropdownHeading", publicName: "dropdownHeading", isSignal: true, isRequired: false, transformFunction: null }, showDropdownClose: { classPropertyName: "showDropdownClose", publicName: "showDropdownClose", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: booleanAttribute } }, outputs: { promptData: "promptData", actionTagFileSelected: "actionTagFileSelected", dropdownItemSelected: "dropdownItemSelected", dropdownClosed: "dropdownClosed" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: PromptComponent, isStandalone: true, selector: "ui-prompt", inputs: { tags: { classPropertyName: "tags", publicName: "tags", isSignal: true, isRequired: false, transformFunction: null }, actionTag: { classPropertyName: "actionTag", publicName: "actionTag", isSignal: true, isRequired: false, transformFunction: null }, maxCharacters: { classPropertyName: "maxCharacters", publicName: "maxCharacters", isSignal: true, isRequired: false, transformFunction: null }, supportedFileTypes: { classPropertyName: "supportedFileTypes", publicName: "supportedFileTypes", isSignal: true, isRequired: false, transformFunction: null }, autoClear: { classPropertyName: "autoClear", publicName: "autoClear", isSignal: true, isRequired: false, transformFunction: null }, showSendButton: { classPropertyName: "showSendButton", publicName: "showSendButton", isSignal: true, isRequired: false, transformFunction: null }, sendButtonDisabled: { classPropertyName: "sendButtonDisabled", publicName: "sendButtonDisabled", isSignal: true, isRequired: false, transformFunction: null }, enableFileUpload: { classPropertyName: "enableFileUpload", publicName: "enableFileUpload", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, dropdownItems: { classPropertyName: "dropdownItems", publicName: "dropdownItems", isSignal: true, isRequired: false, transformFunction: null }, dropdownHeading: { classPropertyName: "dropdownHeading", publicName: "dropdownHeading", isSignal: true, isRequired: false, transformFunction: null }, showDropdownClose: { classPropertyName: "showDropdownClose", publicName: "showDropdownClose", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: booleanAttribute } }, outputs: { promptData: "promptData", actionTagFileSelected: "actionTagFileSelected", dropdownItemSelected: "dropdownItemSelected", dropdownClosed: "dropdownClosed" }, providers: [
             UiTranslatePipe,
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => PromptComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "fileDrop", first: true, predicate: ["fileDropRef"], descendants: true, isSignal: true }, { propertyName: "tagDropdown", first: true, predicate: ["tagDropdown"], descendants: true, isSignal: true }, { propertyName: "fieldComponentRef", first: true, predicate: ["textarea"], descendants: true, isSignal: true }, { propertyName: "promptContainer", first: true, predicate: ["promptContainerRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-container>\n  <div\n    class=\"prompt-container\"\n    [class.has-error]=\"!!errorMessage()\"\n    [class.disabled]=\"isLocked()\"\n    [attr.aria-disabled]=\"isLocked()\"\n    [attr.aria-busy]=\"loading() ? 'true' : null\"\n    cdkOverlayOrigin\n    #promptOrigin=\"cdkOverlayOrigin\"\n    #promptContainerRef\n    [ngClass]=\"{ 'prompt-container-focused': isHighlighted() && !loading() }\"\n  >\n    @if (loading()) {\n      <div class=\"prompt-loading\" aria-hidden=\"true\">\n        <ui-skeleton [theme]=\"{ width: '100%', height: '20px', margin: '0' }\"></ui-skeleton>\n        <ui-skeleton [theme]=\"{ width: '30%', height: '20px', margin: '0' }\"></ui-skeleton>\n      </div>\n    }\n    <div class=\"prompt-autocomplete\" [hidden]=\"loading()\">\n      <textarea tabindex=\"-1\" class=\"ghost\" id=\"autocomplete\" [value]=\"autocompleteSuggestion()\" readonly></textarea>\n\n      @let showIcon = !isFieldFocused() && !textarea.value;\n      @if (showIcon) {\n        <ui-icon\n          class=\"prompt-icon\"\n          [color]=\"'inherit'\"\n          [class.hovered]=\"isFieldHovered()\"\n          [name]=\"'Sparkle-in-line'\"\n        ></ui-icon>\n      }\n      <ui-field\n        #textarea\n        class=\"prompt-text\"\n        [class.show-icon]=\"showIcon\"\n        role=\"input\"\n        [showBottomContent]=\"false\"\n        [borderless]=\"true\"\n        [type]=\"'multi-line'\"\n        [autosizableTextarea]=\"true\"\n        [maxCharacters]=\"maxCharacters()\"\n        [placeholder]=\"showIcon ? placeholder() || ('PROMPT.ASK_ANYTHING' | uiTranslate | async)! : ''\"\n        [value]=\"promptTextValue() || ''\"\n        [hasTextAreaCounter]=\"false\"\n        [disabled]=\"disabled\"\n        (mouseenter)=\"isFieldHovered.set(true)\"\n        (mouseleave)=\"isFieldHovered.set(false)\"\n        (focusin)=\"isFieldFocused.set(true)\"\n        (fieldBlur)=\"onFieldBlur()\"\n        (keydown.tab)=\"onTextareaTab($event)\"\n      ></ui-field>\n    </div>\n    <div class=\"prompt-footer flex-container\">\n      <div class=\"flex-container\">\n        @if (actionTag(); as at) {\n          <ui-tag\n            [label]=\"at.label\"\n            [icon]=\"at.icon ?? 'Plus'\"\n            [ariaLabel]=\"at.ariaLabel ?? at.label\"\n            [isDisabled]=\"isLocked() || !!at.disabled\"\n            (press)=\"onActionTagPress()\"\n          ></ui-tag>\n        } @else if (enableFileUpload()) {\n          <ui-button\n            [variant]=\"'icon-button'\"\n            [tooltip]=\"('PROMPT.ADD_FILES' | uiTranslate | async)!\"\n            [tooltipPosition]=\"'above'\"\n            [ariaLabel]=\"('PROMPT.ADD_FILES' | uiTranslate | async)!\"\n            [iconName]=\"'Plus'\"\n            [disabled]=\"isLocked()\"\n            (click)=\"fileDrop()?.nativeElement?.click()\"\n          ></ui-button>\n\n          @if (promptFilesList().length) {\n            <div class=\"menu\">\n              <ui-badge\n                [notificationsAmount]=\"promptFilesList().length\"\n                [variant]=\"'notification'\"\n                class=\"menu-badge\"\n              ></ui-badge>\n              <ui-overflow-menu\n                [matTooltip]=\"('PROMPT.FILES' | uiTranslate | async)!\"\n                [matTooltipPosition]=\"'above'\"\n                [buttonSize]=\"'medium'\"\n                [iconTrigger]=\"'Document'\"\n                [buttonVariant]=\"'ghost'\"\n                [buttons]=\"fileListMenuConfig()\"\n                [isDynamicMenu]=\"true\"\n                [withRemovableOption]=\"true\"\n                (selectItem)=\"selectedMenuOption($event)\"\n              ></ui-overflow-menu>\n            </div>\n          }\n        }\n\n        @if (actionTag() || enableFileUpload()) {\n          <input\n            [tabIndex]=\"-1\"\n            class=\"form-control\"\n            #fileDropRef\n            type=\"file\"\n            id=\"file-upload\"\n            [accept]=\"fileInputAccept()\"\n            [disabled]=\"isLocked()\"\n            (change)=\"onFileSelected($event)\"\n          />\n        }\n      </div>\n\n      @if (tags()?.length && !promptTextValue()) {\n        <div class=\"flex-container carousel\">\n          <div class=\"tag-container flex-container\" role=\"list\" #tagsScrollContainer>\n            @for (tag of tagsVisible(); track tag) {\n              <ui-tag\n                [label]=\"tag.label\"\n                role=\"listitem\"\n                [ariaLabel]=\"tag.label\"\n                [isDisabled]=\"isLocked()\"\n                (click)=\"selectTag(tag, $event)\"\n                (keyup.enter)=\"selectTag(tag, $event)\"\n                (keyup.space)=\"selectTag(tag, $event)\"\n              ></ui-tag>\n            }\n\n            @if (tagsInDropdown().length) {\n              <ui-button\n                class=\"view-more\"\n                variant=\"text-inline\"\n                [label]=\"('PROMPT.VIEW_MORE' | uiTranslate | async)!\"\n                [ariaLabel]=\"('PROMPT.VIEW_MORE' | uiTranslate | async)!\"\n                [size]=\"'medium'\"\n                [disabled]=\"isLocked()\"\n                (click)=\"toggleDropdown()\"\n                (keydown.enter)=\"focusTagDropdown()\"\n                cdkOverlayOrigin\n                #dropdownTrigger=\"cdkOverlayOrigin\"\n              ></ui-button>\n            }\n          </div>\n\n          <div class=\"flex-container\">\n            <ui-button\n              [variant]=\"'icon-button'\"\n              [size]=\"'small'\"\n              [ariaLabel]=\"'Scroll left button'\"\n              [iconName]=\"'Arrow-chevron-left-in-line'\"\n              [disabled]=\"isLocked() || tagsScrollContainer.scrollLeft === 0\"\n              (click)=\"tagsScrollContainer.scrollBy({ left: -100, behavior: 'smooth' })\"\n            ></ui-button>\n            <ui-button\n              [variant]=\"'icon-button'\"\n              [size]=\"'small'\"\n              [iconName]=\"'Arrow-chevron-right-in-line'\"\n              [ariaLabel]=\"'Scroll right button'\"\n              [disabled]=\"\n                isLocked() ||\n                tagsScrollContainer.scrollLeft + tagsScrollContainer.clientWidth >= tagsScrollContainer.scrollWidth\n              \"\n              (click)=\"tagsScrollContainer.scrollBy({ left: 100, behavior: 'smooth' })\"\n            ></ui-button>\n          </div>\n        </div>\n      }\n\n      @if (showSendButton()) {\n        <ui-button\n          class=\"send-button\"\n          [variant]=\"'secondary'\"\n          [iconName]=\"'Arrow-up-in-line'\"\n          [tooltip]=\"('COMMON.SEND' | uiTranslate | async)!\"\n          [ariaLabel]=\"('COMMON.SEND' | uiTranslate | async)!\"\n          [tooltipPosition]=\"'above'\"\n          [size]=\"'medium'\"\n          [disabled]=\"isLocked() || sendButtonDisabled() || (!promptTextValue() && !promptFilesList().length)\"\n          (click)=\"sendPromptData()\"\n        ></ui-button>\n      }\n    </div>\n  </div>\n\n  @if (errorMessage()) {\n    <div class=\"prompt-error\">\n      <ui-icon [name]=\"'Error'\" color=\"red\"></ui-icon>\n      <span>{{ errorMessage() }}</span>\n    </div>\n  }\n\n  <!--  Dropdown for hidden tags -->\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"promptOrigin\"\n    [cdkConnectedOverlayOpen]=\"isDropdownOpened() && !isLocked()\"\n    [cdkConnectedOverlayPositions]=\"dropdownPositions\"\n    [cdkConnectedOverlayWidth]=\"promptContainerRef?.offsetWidth || 0\"\n    (overlayOutsideClick)=\"dropdownOutsideClick()\"\n  >\n    <div class=\"dropdown-container\" role=\"list\" #tagDropdown tabindex=\"0\">\n      @for (tag of tagsInDropdown(); track tag) {\n        <div\n          class=\"dropdown-tag\"\n          tabindex=\"0\"\n          [attr.aria-label]=\"tag.label\"\n          role=\"listitem\"\n          (click)=\"selectTag(tag, $event)\"\n          (keyup.enter)=\"selectTag(tag, $event)\"\n          (keyup.space)=\"selectTag(tag, $event)\"\n        >\n          {{ tag.label }}\n        </div>\n      }\n    </div>\n  </ng-template>\n\n  <!-- Built-in items dropdown (UI-877) \u2014 opens on focus, typing filters by label -->\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"promptOrigin\"\n    [cdkConnectedOverlayOpen]=\"itemsDropdownVisible()\"\n    [cdkConnectedOverlayPositions]=\"dropdownPositions\"\n    [cdkConnectedOverlayWidth]=\"promptContainerRef?.offsetWidth || 0\"\n    (overlayOutsideClick)=\"itemsDropdownOutsideClick($event)\"\n  >\n    <div class=\"dropdown-container custom-dropdown-container\" (mousedown)=\"$event.preventDefault()\">\n      @if (dropdownHeading() || showDropdownClose()) {\n        <div class=\"dropdown-header\">\n          @if (dropdownHeading()) {\n            <span class=\"dropdown-heading\">{{ dropdownHeading() }}</span>\n          }\n          @if (showDropdownClose()) {\n            <ui-button\n              class=\"dropdown-close\"\n              [variant]=\"'icon-button'\"\n              [size]=\"'small'\"\n              [iconName]=\"'Close-in-line'\"\n              [tooltip]=\"('COMMON.CLOSE' | uiTranslate | async)!\"\n              [tooltipPosition]=\"'above'\"\n              [ariaLabel]=\"('COMMON.CLOSE' | uiTranslate | async)!\"\n              (click)=\"closeItemsDropdown()\"\n            ></ui-button>\n          }\n        </div>\n      }\n      <div role=\"list\">\n        @for (item of filteredDropdownItems(); track item.id) {\n          <div\n            class=\"dropdown-tag dropdown-item\"\n            tabindex=\"0\"\n            role=\"listitem\"\n            [attr.aria-label]=\"item.label\"\n            (click)=\"selectDropdownItem(item, $event)\"\n            (keydown.enter)=\"selectDropdownItem(item, $event)\"\n            (keydown.space)=\"selectDropdownItem(item, $event)\"\n          >\n            @if (item.icon) {\n              <ui-icon class=\"dropdown-item-icon\" [name]=\"item.icon\" [color]=\"'inherit'\"></ui-icon>\n            }\n            <span class=\"dropdown-item-label\">{{ item.label }}</span>\n            <ui-icon class=\"dropdown-item-chevron\" [name]=\"'Arrow-chevron-right-in-line'\" [color]=\"'inherit'\"></ui-icon>\n          </div>\n        }\n      </div>\n    </div>\n  </ng-template>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host ::ng-deep ui-field.prompt-text>mat-form-field{vertical-align:top}:host ::ng-deep ui-field.prompt-text .mat-mdc-text-field-wrapper{border-radius:10px!important}:host ::ng-deep ui-field.prompt-text .mat-mdc-form-field.keyboard-focused .mat-mdc-text-field-wrapper:after{outline:2px solid black}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{background:transparent}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix{padding-bottom:0!important}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper textarea{max-height:220px!important}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper textarea:focus{border:2px solid black}:host ::ng-deep ui-button.send-button .rounded-icon .mdc-button{width:48px!important;height:48px!important}:host ::ng-deep ui-overflow-menu button.mat-mdc-unelevated-button.ghost.light-theme.only-icon{border:none}.prompt-container{border:1px solid #919191;border-radius:10px;background-color:#fff}.prompt-container-focused{border:1px solid black;outline:1px solid black}.prompt-container.disabled{border:1px solid #d3d3d3}.prompt-container.disabled.prompt-container-focused{outline:none}.prompt-container.disabled .prompt-icon{color:#d3d3d3}ui-field.show-icon{padding-left:24px}.prompt-icon{position:absolute;top:14px;left:16px;color:#666}.prompt-icon.hovered{color:#000}.dropdown-container{width:100%}.custom-dropdown-container{overflow:hidden;background-color:#fff;border-radius:0 0 8px 8px;box-shadow:0 8px 16px #00000014}.dropdown-header{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 8px}.dropdown-heading{font-weight:700}.dropdown-close{margin-left:auto}.dropdown-item{display:flex;gap:12px;align-items:center}.dropdown-item-icon,.dropdown-item-chevron{flex-shrink:0}.dropdown-item-label{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dropdown-tag{padding:16px;background-color:#fff}.dropdown-tag:hover,.dropdown-tag:focus{background-color:#fff2fc;cursor:pointer}.carousel{flex-grow:1;min-width:0}.tag-container{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;margin:0 8px}.tag-container::-webkit-scrollbar{display:none}#file-upload{display:none}.prompt-footer,.flex-container{display:flex;flex-flow:row nowrap;align-items:center}.prompt-footer{justify-content:space-between;padding:8px 16px}@media(max-width:600px){.prompt-footer{padding:8px}}@media(max-width:320px){.prompt-footer{padding:8px}}.menu{display:flex;flex-flow:column nowrap;position:relative}.menu .menu-badge{position:absolute;right:0;z-index:1000}.view-more{margin-left:4px;white-space:nowrap}.view-more ::ng-deep button.mat-mdc-unelevated-button .label{white-space:nowrap}.prompt-container{position:relative}.prompt-container.has-error{border:1px solid #e02800;outline:1px solid #e02800}.prompt-error{margin-top:4px;align-items:center;display:flex;color:#e02800;font-size:12px;line-height:16px}.prompt-error ui-icon{margin-right:4px}.prompt-loading{display:flex;flex-direction:column;gap:4px;padding:12px 16px 0}.prompt-loading ui-skeleton{height:20px}.ghost{position:absolute;top:0;left:0;bottom:16px;color:#888;border:none;pointer-events:none;background:transparent;width:100%;padding:12px 16px;font-size:inherit;line-height:22px;letter-spacing:inherit;font-weight:inherit;font-family:ModernGothic,sans-serif;resize:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.FieldComponent, selector: "ui-field", inputs: ["fullWidth", "fullHeight", "label", "labelHtml", "labelIcon", "fieldName", "placeholder", "id", "value", "badgeVariant", "errors", "disabled", "required", "readOnly", "hintMessage", "type", "updateOnBlur", "allowOnlyDigits", "isAutocompleteOff", "allowNegative", "showBottomContent", "applicationTheme", "ariaLabel", "loading", "isValid", "maxCharacters", "trimOnBlur", "trimOnSubmit", "maxRows", "hasTextAreaCounter", "hideBuiltInErrors", "hideLabelInErrors", "max", "min", "textareaHeight", "borderless", "autosizableTextarea", "isAIVariant", "ariaLabelledby", "ariaDescribedby", "hasError"], outputs: ["validateEvent", "fieldBlur"] }, { kind: "component", type: i3.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "loadingWithLabel", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaExpanded", "ariaControls", "ariaPressed", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: i4.OverflowMenuComponent, selector: "ui-overflow-menu", inputs: ["buttons", "iconTrigger", "menuLabel", "applicationTheme", "ariaLabel", "ariaRequired", "describedby", "contentTemplateRef", "buttonVariant", "buttonSize", "menuConfig", "isDynamicMenu", "withRemovableOption"], outputs: ["selectItem", "menuOpened", "menuClosed"] }, { kind: "component", type: i5.TagComponent, selector: "ui-tag", inputs: ["label", "icon", "allowClose", "readOnly", "isSelected", "showIconWhenSelected", "isDisabled", "applicationTheme", "ariaLabel", "ariaRequired", "showBadge", "notificationsAmount"], outputs: ["isSelectedChange", "close", "press"] }, { kind: "component", type: i6.BadgeComponent, selector: "ui-badge", inputs: ["label", "staticLabel", "icon", "iconColor", "trailingIcon", "trailingIconColor", "color", "variant", "notificationsAmount", "applicationTheme", "rebrandColor", "truncateLabel", "enableAnimation"] }, { kind: "directive", type: i7.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: i7.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: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i9.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "component", type: i10.SkeletonComponent, selector: "ui-skeleton", inputs: ["count", "theme", "appearance", "isAiTheme", "applicationTheme"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i11.UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "fileDrop", first: true, predicate: ["fileDropRef"], descendants: true, isSignal: true }, { propertyName: "tagDropdown", first: true, predicate: ["tagDropdown"], descendants: true, isSignal: true }, { propertyName: "fieldComponentRef", first: true, predicate: ["textarea"], descendants: true, isSignal: true }, { propertyName: "promptContainer", first: true, predicate: ["promptContainerRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-container>\n  <div\n    class=\"prompt-container\"\n    [class.has-error]=\"!!errorMessage()\"\n    [class.disabled]=\"isLocked()\"\n    [attr.aria-disabled]=\"isLocked()\"\n    [attr.aria-busy]=\"loading() ? 'true' : null\"\n    cdkOverlayOrigin\n    #promptOrigin=\"cdkOverlayOrigin\"\n    #promptContainerRef\n    [ngClass]=\"{ 'prompt-container-focused': isHighlighted() && !loading() }\"\n  >\n    @if (loading()) {\n      <div class=\"prompt-loading\" aria-hidden=\"true\">\n        <ui-skeleton [theme]=\"{ width: '100%', height: '20px', margin: '0' }\"></ui-skeleton>\n        <ui-skeleton [theme]=\"{ width: '30%', height: '20px', margin: '0' }\"></ui-skeleton>\n      </div>\n    }\n    <div class=\"prompt-autocomplete\" [hidden]=\"loading()\">\n      <textarea tabindex=\"-1\" class=\"ghost\" id=\"autocomplete\" [value]=\"autocompleteSuggestion()\" readonly></textarea>\n\n      @let showIcon = !isFieldFocused() && !textarea.value;\n      @if (showIcon) {\n        <ui-icon\n          class=\"prompt-icon\"\n          [color]=\"'inherit'\"\n          [class.hovered]=\"isFieldHovered()\"\n          [name]=\"'Sparkle-in-line'\"\n        ></ui-icon>\n      }\n      <ui-field\n        #textarea\n        class=\"prompt-text\"\n        [class.show-icon]=\"showIcon\"\n        role=\"input\"\n        [showBottomContent]=\"false\"\n        [borderless]=\"true\"\n        [type]=\"'multi-line'\"\n        [autosizableTextarea]=\"true\"\n        [maxCharacters]=\"maxCharacters()\"\n        [placeholder]=\"showIcon ? placeholder() || ('PROMPT.ASK_ANYTHING' | uiTranslate | async)! : ''\"\n        [value]=\"promptTextValue() || ''\"\n        [hasTextAreaCounter]=\"false\"\n        [disabled]=\"disabled\"\n        (mouseenter)=\"isFieldHovered.set(true)\"\n        (mouseleave)=\"isFieldHovered.set(false)\"\n        (focusin)=\"isFieldFocused.set(true)\"\n        (fieldBlur)=\"onFieldBlur()\"\n        (keydown.tab)=\"onTextareaTab($event)\"\n      ></ui-field>\n    </div>\n    <div class=\"prompt-footer flex-container\">\n      <div class=\"flex-container\">\n        @if (actionTag(); as at) {\n          <ui-tag\n            [label]=\"at.label\"\n            [icon]=\"at.icon ?? 'Plus'\"\n            [ariaLabel]=\"at.ariaLabel ?? at.label\"\n            [isDisabled]=\"isLocked() || !!at.disabled\"\n            (press)=\"onActionTagPress()\"\n          ></ui-tag>\n        } @else if (enableFileUpload()) {\n          <ui-button\n            [variant]=\"'icon-button'\"\n            [tooltip]=\"('PROMPT.ADD_FILES' | uiTranslate | async)!\"\n            [tooltipPosition]=\"'above'\"\n            [ariaLabel]=\"('PROMPT.ADD_FILES' | uiTranslate | async)!\"\n            [iconName]=\"'Plus'\"\n            [disabled]=\"isLocked()\"\n            (click)=\"fileDrop()?.nativeElement?.click()\"\n          ></ui-button>\n\n          @if (promptFilesList().length) {\n            <div class=\"menu\">\n              <ui-badge\n                [notificationsAmount]=\"promptFilesList().length\"\n                [variant]=\"'notification'\"\n                class=\"menu-badge\"\n              ></ui-badge>\n              <ui-overflow-menu\n                [matTooltip]=\"('PROMPT.FILES' | uiTranslate | async)!\"\n                [matTooltipPosition]=\"'above'\"\n                [buttonSize]=\"'medium'\"\n                [iconTrigger]=\"'Document'\"\n                [buttonVariant]=\"'ghost'\"\n                [buttons]=\"fileListMenuConfig()\"\n                [isDynamicMenu]=\"true\"\n                [withRemovableOption]=\"true\"\n                (selectItem)=\"selectedMenuOption($event)\"\n              ></ui-overflow-menu>\n            </div>\n          }\n        }\n\n        @if (actionTag() || enableFileUpload()) {\n          <input\n            data-testid=\"prompt-file-input\"\n            [tabIndex]=\"-1\"\n            class=\"form-control\"\n            #fileDropRef\n            type=\"file\"\n            id=\"file-upload\"\n            [accept]=\"fileInputAccept()\"\n            [disabled]=\"isLocked()\"\n            (change)=\"onFileSelected($event)\"\n          />\n        }\n      </div>\n\n      @if (tags()?.length && !promptTextValue()) {\n        <div class=\"flex-container carousel\">\n          <div class=\"tag-container flex-container\" role=\"list\" #tagsScrollContainer>\n            @for (tag of tagsVisible(); track tag) {\n              <ui-tag\n                [label]=\"tag.label\"\n                role=\"listitem\"\n                [ariaLabel]=\"tag.label\"\n                [isDisabled]=\"isLocked()\"\n                (click)=\"selectTag(tag, $event)\"\n                (keyup.enter)=\"selectTag(tag, $event)\"\n                (keyup.space)=\"selectTag(tag, $event)\"\n              ></ui-tag>\n            }\n\n            @if (tagsInDropdown().length) {\n              <ui-button\n                class=\"view-more\"\n                variant=\"text-inline\"\n                [label]=\"('PROMPT.VIEW_MORE' | uiTranslate | async)!\"\n                [ariaLabel]=\"('PROMPT.VIEW_MORE' | uiTranslate | async)!\"\n                [size]=\"'medium'\"\n                [disabled]=\"isLocked()\"\n                (click)=\"toggleDropdown()\"\n                (keydown.enter)=\"focusTagDropdown()\"\n                cdkOverlayOrigin\n                #dropdownTrigger=\"cdkOverlayOrigin\"\n              ></ui-button>\n            }\n          </div>\n\n          <div class=\"flex-container\">\n            <ui-button\n              [variant]=\"'icon-button'\"\n              [size]=\"'small'\"\n              [ariaLabel]=\"'Scroll left button'\"\n              [iconName]=\"'Arrow-chevron-left-in-line'\"\n              [disabled]=\"isLocked() || tagsScrollContainer.scrollLeft === 0\"\n              (click)=\"tagsScrollContainer.scrollBy({ left: -100, behavior: 'smooth' })\"\n            ></ui-button>\n            <ui-button\n              [variant]=\"'icon-button'\"\n              [size]=\"'small'\"\n              [iconName]=\"'Arrow-chevron-right-in-line'\"\n              [ariaLabel]=\"'Scroll right button'\"\n              [disabled]=\"\n                isLocked() ||\n                tagsScrollContainer.scrollLeft + tagsScrollContainer.clientWidth >= tagsScrollContainer.scrollWidth\n              \"\n              (click)=\"tagsScrollContainer.scrollBy({ left: 100, behavior: 'smooth' })\"\n            ></ui-button>\n          </div>\n        </div>\n      }\n\n      @if (showSendButton()) {\n        <ui-button\n          class=\"send-button\"\n          [variant]=\"'secondary'\"\n          [iconName]=\"'Arrow-up-in-line'\"\n          [tooltip]=\"('COMMON.SEND' | uiTranslate | async)!\"\n          [ariaLabel]=\"('COMMON.SEND' | uiTranslate | async)!\"\n          [tooltipPosition]=\"'above'\"\n          [size]=\"'medium'\"\n          [disabled]=\"isLocked() || sendButtonDisabled() || (!promptTextValue() && !promptFilesList().length)\"\n          (click)=\"sendPromptData()\"\n        ></ui-button>\n      }\n    </div>\n  </div>\n\n  @if (errorMessage()) {\n    <div class=\"prompt-error\">\n      <ui-icon [name]=\"'Error'\" color=\"red\"></ui-icon>\n      <span>{{ errorMessage() }}</span>\n    </div>\n  }\n\n  <!--  Dropdown for hidden tags -->\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"promptOrigin\"\n    [cdkConnectedOverlayOpen]=\"isDropdownOpened() && !isLocked()\"\n    [cdkConnectedOverlayPositions]=\"dropdownPositions\"\n    [cdkConnectedOverlayWidth]=\"promptContainerRef?.offsetWidth || 0\"\n    (overlayOutsideClick)=\"dropdownOutsideClick()\"\n  >\n    <div class=\"dropdown-container\" role=\"list\" #tagDropdown tabindex=\"0\">\n      @for (tag of tagsInDropdown(); track tag) {\n        <div\n          class=\"dropdown-tag\"\n          tabindex=\"0\"\n          [attr.aria-label]=\"tag.label\"\n          role=\"listitem\"\n          (click)=\"selectTag(tag, $event)\"\n          (keyup.enter)=\"selectTag(tag, $event)\"\n          (keyup.space)=\"selectTag(tag, $event)\"\n        >\n          {{ tag.label }}\n        </div>\n      }\n    </div>\n  </ng-template>\n\n  <!-- Built-in items dropdown (UI-877) \u2014 opens on focus, typing filters by label -->\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"promptOrigin\"\n    [cdkConnectedOverlayOpen]=\"itemsDropdownVisible()\"\n    [cdkConnectedOverlayPositions]=\"dropdownPositions\"\n    [cdkConnectedOverlayWidth]=\"promptContainerRef?.offsetWidth || 0\"\n    (overlayOutsideClick)=\"itemsDropdownOutsideClick($event)\"\n  >\n    <div class=\"dropdown-container custom-dropdown-container\" (mousedown)=\"$event.preventDefault()\">\n      @if (dropdownHeading() || showDropdownClose()) {\n        <div class=\"dropdown-header\">\n          @if (dropdownHeading()) {\n            <span class=\"dropdown-heading\">{{ dropdownHeading() }}</span>\n          }\n          @if (showDropdownClose()) {\n            <ui-button\n              class=\"dropdown-close\"\n              [variant]=\"'icon-button'\"\n              [size]=\"'small'\"\n              [iconName]=\"'Close-in-line'\"\n              [tooltip]=\"('COMMON.CLOSE' | uiTranslate | async)!\"\n              [tooltipPosition]=\"'above'\"\n              [ariaLabel]=\"('COMMON.CLOSE' | uiTranslate | async)!\"\n              (click)=\"closeItemsDropdown()\"\n            ></ui-button>\n          }\n        </div>\n      }\n      <div role=\"list\">\n        @for (item of filteredDropdownItems(); track item.id) {\n          <div\n            class=\"dropdown-tag dropdown-item\"\n            tabindex=\"0\"\n            role=\"listitem\"\n            [attr.aria-label]=\"item.label\"\n            (click)=\"selectDropdownItem(item, $event)\"\n            (keydown.enter)=\"selectDropdownItem(item, $event)\"\n            (keydown.space)=\"selectDropdownItem(item, $event)\"\n          >\n            @if (item.icon) {\n              <ui-icon class=\"dropdown-item-icon\" [name]=\"item.icon\" [color]=\"'inherit'\"></ui-icon>\n            }\n            <span class=\"dropdown-item-label\">{{ item.label }}</span>\n            <ui-icon class=\"dropdown-item-chevron\" [name]=\"'Arrow-chevron-right-in-line'\" [color]=\"'inherit'\"></ui-icon>\n          </div>\n        }\n      </div>\n    </div>\n  </ng-template>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host ::ng-deep ui-field.prompt-text>mat-form-field{vertical-align:top}:host ::ng-deep ui-field.prompt-text .mat-mdc-text-field-wrapper{border-radius:10px!important}:host ::ng-deep ui-field.prompt-text .mat-mdc-form-field.keyboard-focused .mat-mdc-text-field-wrapper:after{outline:2px solid black}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{background:transparent}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix{padding-bottom:0!important}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper textarea{max-height:220px!important}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper textarea:focus{border:2px solid black}:host ::ng-deep ui-button.send-button .rounded-icon .mdc-button{width:48px!important;height:48px!important}:host ::ng-deep ui-overflow-menu button.mat-mdc-unelevated-button.ghost.light-theme.only-icon{border:none}.prompt-container{border:1px solid #919191;border-radius:10px;background-color:#fff}.prompt-container-focused{border:1px solid black;outline:1px solid black}.prompt-container.disabled{border:1px solid #d3d3d3}.prompt-container.disabled.prompt-container-focused{outline:none}.prompt-container.disabled .prompt-icon{color:#d3d3d3}ui-field.show-icon{padding-left:24px}.prompt-icon{position:absolute;top:14px;left:16px;color:#666}.prompt-icon.hovered{color:#000}.dropdown-container{width:100%}.custom-dropdown-container{overflow:hidden;background-color:#fff;border-radius:0 0 8px 8px;box-shadow:0 8px 16px #00000014}.dropdown-header{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 8px}.dropdown-heading{font-weight:700}.dropdown-close{margin-left:auto}.dropdown-item{display:flex;gap:12px;align-items:center}.dropdown-item-icon,.dropdown-item-chevron{flex-shrink:0}.dropdown-item-label{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dropdown-tag{padding:16px;background-color:#fff}.dropdown-tag:hover,.dropdown-tag:focus{background-color:#fff2fc;cursor:pointer}.carousel{flex-grow:1;min-width:0}.tag-container{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;margin:0 8px}.tag-container::-webkit-scrollbar{display:none}#file-upload{display:none}.prompt-footer,.flex-container{display:flex;flex-flow:row nowrap;align-items:center}.prompt-footer{justify-content:space-between;padding:8px 16px}@media(max-width:600px){.prompt-footer{padding:8px}}@media(max-width:320px){.prompt-footer{padding:8px}}.menu{display:flex;flex-flow:column nowrap;position:relative}.menu .menu-badge{position:absolute;right:0;z-index:1000}.view-more{margin-left:4px;white-space:nowrap}.view-more ::ng-deep button.mat-mdc-unelevated-button .label{white-space:nowrap}.prompt-container{position:relative}.prompt-container.has-error{border:1px solid #e02800;outline:1px solid #e02800}.prompt-error{margin-top:4px;align-items:center;display:flex;color:#e02800;font-size:12px;line-height:16px}.prompt-error ui-icon{margin-right:4px}.prompt-loading{display:flex;flex-direction:column;gap:4px;padding:12px 16px 0}.prompt-loading ui-skeleton{height:20px}.ghost{position:absolute;top:0;left:0;bottom:16px;color:#888;border:none;pointer-events:none;background:transparent;width:100%;padding:12px 16px;font-size:inherit;line-height:22px;letter-spacing:inherit;font-weight:inherit;font-family:ModernGothic,sans-serif;resize:none}\n"], dependencies: [{ kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SkeletonComponent, selector: "ui-skeleton", inputs: ["count", "theme", "appearance", "isAiTheme", "applicationTheme"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "component", type: FieldComponent, selector: "ui-field", inputs: ["fullWidth", "fullHeight", "label", "labelHtml", "labelIcon", "fieldName", "placeholder", "id", "value", "badgeVariant", "errors", "disabled", "required", "readOnly", "hintMessage", "type", "updateOnBlur", "allowOnlyDigits", "isAutocompleteOff", "allowNegative", "showBottomContent", "applicationTheme", "ariaLabel", "loading", "isValid", "maxCharacters", "trimOnBlur", "trimOnSubmit", "maxRows", "hasTextAreaCounter", "hideBuiltInErrors", "hideLabelInErrors", "max", "min", "textareaHeight", "borderless", "autosizableTextarea", "isAIVariant", "ariaLabelledby", "ariaDescribedby", "hasError"], outputs: ["validateEvent", "fieldBlur"] }, { kind: "component", type: TagComponent, selector: "ui-tag", inputs: ["label", "icon", "allowClose", "readOnly", "isSelected", "showIconWhenSelected", "isDisabled", "applicationTheme", "ariaLabel", "ariaRequired", "showBadge", "notificationsAmount"], outputs: ["isSelectedChange", "close", "press"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "loadingWithLabel", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaExpanded", "ariaControls", "ariaPressed", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: BadgeComponent, selector: "ui-badge", inputs: ["label", "staticLabel", "icon", "iconColor", "trailingIcon", "trailingIconColor", "color", "variant", "notificationsAmount", "applicationTheme", "rebrandColor", "truncateLabel", "enableAnimation"] }, { kind: "component", type: OverflowMenuComponent, selector: "ui-overflow-menu", inputs: ["buttons", "iconTrigger", "menuLabel", "applicationTheme", "ariaLabel", "ariaRequired", "describedby", "contentTemplateRef", "buttonVariant", "buttonSize", "menuConfig", "isDynamicMenu", "withRemovableOption"], outputs: ["selectItem", "menuOpened", "menuClosed"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: 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: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PromptComponent, decorators: [{
             type: Component,
@@ -318,7 +309,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                             useExisting: forwardRef(() => PromptComponent),
                             multi: true,
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container>\n  <div\n    class=\"prompt-container\"\n    [class.has-error]=\"!!errorMessage()\"\n    [class.disabled]=\"isLocked()\"\n    [attr.aria-disabled]=\"isLocked()\"\n    [attr.aria-busy]=\"loading() ? 'true' : null\"\n    cdkOverlayOrigin\n    #promptOrigin=\"cdkOverlayOrigin\"\n    #promptContainerRef\n    [ngClass]=\"{ 'prompt-container-focused': isHighlighted() && !loading() }\"\n  >\n    @if (loading()) {\n      <div class=\"prompt-loading\" aria-hidden=\"true\">\n        <ui-skeleton [theme]=\"{ width: '100%', height: '20px', margin: '0' }\"></ui-skeleton>\n        <ui-skeleton [theme]=\"{ width: '30%', height: '20px', margin: '0' }\"></ui-skeleton>\n      </div>\n    }\n    <div class=\"prompt-autocomplete\" [hidden]=\"loading()\">\n      <textarea tabindex=\"-1\" class=\"ghost\" id=\"autocomplete\" [value]=\"autocompleteSuggestion()\" readonly></textarea>\n\n      @let showIcon = !isFieldFocused() && !textarea.value;\n      @if (showIcon) {\n        <ui-icon\n          class=\"prompt-icon\"\n          [color]=\"'inherit'\"\n          [class.hovered]=\"isFieldHovered()\"\n          [name]=\"'Sparkle-in-line'\"\n        ></ui-icon>\n      }\n      <ui-field\n        #textarea\n        class=\"prompt-text\"\n        [class.show-icon]=\"showIcon\"\n        role=\"input\"\n        [showBottomContent]=\"false\"\n        [borderless]=\"true\"\n        [type]=\"'multi-line'\"\n        [autosizableTextarea]=\"true\"\n        [maxCharacters]=\"maxCharacters()\"\n        [placeholder]=\"showIcon ? placeholder() || ('PROMPT.ASK_ANYTHING' | uiTranslate | async)! : ''\"\n        [value]=\"promptTextValue() || ''\"\n        [hasTextAreaCounter]=\"false\"\n        [disabled]=\"disabled\"\n        (mouseenter)=\"isFieldHovered.set(true)\"\n        (mouseleave)=\"isFieldHovered.set(false)\"\n        (focusin)=\"isFieldFocused.set(true)\"\n        (fieldBlur)=\"onFieldBlur()\"\n        (keydown.tab)=\"onTextareaTab($event)\"\n      ></ui-field>\n    </div>\n    <div class=\"prompt-footer flex-container\">\n      <div class=\"flex-container\">\n        @if (actionTag(); as at) {\n          <ui-tag\n            [label]=\"at.label\"\n            [icon]=\"at.icon ?? 'Plus'\"\n            [ariaLabel]=\"at.ariaLabel ?? at.label\"\n            [isDisabled]=\"isLocked() || !!at.disabled\"\n            (press)=\"onActionTagPress()\"\n          ></ui-tag>\n        } @else if (enableFileUpload()) {\n          <ui-button\n            [variant]=\"'icon-button'\"\n            [tooltip]=\"('PROMPT.ADD_FILES' | uiTranslate | async)!\"\n            [tooltipPosition]=\"'above'\"\n            [ariaLabel]=\"('PROMPT.ADD_FILES' | uiTranslate | async)!\"\n            [iconName]=\"'Plus'\"\n            [disabled]=\"isLocked()\"\n            (click)=\"fileDrop()?.nativeElement?.click()\"\n          ></ui-button>\n\n          @if (promptFilesList().length) {\n            <div class=\"menu\">\n              <ui-badge\n                [notificationsAmount]=\"promptFilesList().length\"\n                [variant]=\"'notification'\"\n                class=\"menu-badge\"\n              ></ui-badge>\n              <ui-overflow-menu\n                [matTooltip]=\"('PROMPT.FILES' | uiTranslate | async)!\"\n                [matTooltipPosition]=\"'above'\"\n                [buttonSize]=\"'medium'\"\n                [iconTrigger]=\"'Document'\"\n                [buttonVariant]=\"'ghost'\"\n                [buttons]=\"fileListMenuConfig()\"\n                [isDynamicMenu]=\"true\"\n                [withRemovableOption]=\"true\"\n                (selectItem)=\"selectedMenuOption($event)\"\n              ></ui-overflow-menu>\n            </div>\n          }\n        }\n\n        @if (actionTag() || enableFileUpload()) {\n          <input\n            [tabIndex]=\"-1\"\n            class=\"form-control\"\n            #fileDropRef\n            type=\"file\"\n            id=\"file-upload\"\n            [accept]=\"fileInputAccept()\"\n            [disabled]=\"isLocked()\"\n            (change)=\"onFileSelected($event)\"\n          />\n        }\n      </div>\n\n      @if (tags()?.length && !promptTextValue()) {\n        <div class=\"flex-container carousel\">\n          <div class=\"tag-container flex-container\" role=\"list\" #tagsScrollContainer>\n            @for (tag of tagsVisible(); track tag) {\n              <ui-tag\n                [label]=\"tag.label\"\n                role=\"listitem\"\n                [ariaLabel]=\"tag.label\"\n                [isDisabled]=\"isLocked()\"\n                (click)=\"selectTag(tag, $event)\"\n                (keyup.enter)=\"selectTag(tag, $event)\"\n                (keyup.space)=\"selectTag(tag, $event)\"\n              ></ui-tag>\n            }\n\n            @if (tagsInDropdown().length) {\n              <ui-button\n                class=\"view-more\"\n                variant=\"text-inline\"\n                [label]=\"('PROMPT.VIEW_MORE' | uiTranslate | async)!\"\n                [ariaLabel]=\"('PROMPT.VIEW_MORE' | uiTranslate | async)!\"\n                [size]=\"'medium'\"\n                [disabled]=\"isLocked()\"\n                (click)=\"toggleDropdown()\"\n                (keydown.enter)=\"focusTagDropdown()\"\n                cdkOverlayOrigin\n                #dropdownTrigger=\"cdkOverlayOrigin\"\n              ></ui-button>\n            }\n          </div>\n\n          <div class=\"flex-container\">\n            <ui-button\n              [variant]=\"'icon-button'\"\n              [size]=\"'small'\"\n              [ariaLabel]=\"'Scroll left button'\"\n              [iconName]=\"'Arrow-chevron-left-in-line'\"\n              [disabled]=\"isLocked() || tagsScrollContainer.scrollLeft === 0\"\n              (click)=\"tagsScrollContainer.scrollBy({ left: -100, behavior: 'smooth' })\"\n            ></ui-button>\n            <ui-button\n              [variant]=\"'icon-button'\"\n              [size]=\"'small'\"\n              [iconName]=\"'Arrow-chevron-right-in-line'\"\n              [ariaLabel]=\"'Scroll right button'\"\n              [disabled]=\"\n                isLocked() ||\n                tagsScrollContainer.scrollLeft + tagsScrollContainer.clientWidth >= tagsScrollContainer.scrollWidth\n              \"\n              (click)=\"tagsScrollContainer.scrollBy({ left: 100, behavior: 'smooth' })\"\n            ></ui-button>\n          </div>\n        </div>\n      }\n\n      @if (showSendButton()) {\n        <ui-button\n          class=\"send-button\"\n          [variant]=\"'secondary'\"\n          [iconName]=\"'Arrow-up-in-line'\"\n          [tooltip]=\"('COMMON.SEND' | uiTranslate | async)!\"\n          [ariaLabel]=\"('COMMON.SEND' | uiTranslate | async)!\"\n          [tooltipPosition]=\"'above'\"\n          [size]=\"'medium'\"\n          [disabled]=\"isLocked() || sendButtonDisabled() || (!promptTextValue() && !promptFilesList().length)\"\n          (click)=\"sendPromptData()\"\n        ></ui-button>\n      }\n    </div>\n  </div>\n\n  @if (errorMessage()) {\n    <div class=\"prompt-error\">\n      <ui-icon [name]=\"'Error'\" color=\"red\"></ui-icon>\n      <span>{{ errorMessage() }}</span>\n    </div>\n  }\n\n  <!--  Dropdown for hidden tags -->\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"promptOrigin\"\n    [cdkConnectedOverlayOpen]=\"isDropdownOpened() && !isLocked()\"\n    [cdkConnectedOverlayPositions]=\"dropdownPositions\"\n    [cdkConnectedOverlayWidth]=\"promptContainerRef?.offsetWidth || 0\"\n    (overlayOutsideClick)=\"dropdownOutsideClick()\"\n  >\n    <div class=\"dropdown-container\" role=\"list\" #tagDropdown tabindex=\"0\">\n      @for (tag of tagsInDropdown(); track tag) {\n        <div\n          class=\"dropdown-tag\"\n          tabindex=\"0\"\n          [attr.aria-label]=\"tag.label\"\n          role=\"listitem\"\n          (click)=\"selectTag(tag, $event)\"\n          (keyup.enter)=\"selectTag(tag, $event)\"\n          (keyup.space)=\"selectTag(tag, $event)\"\n        >\n          {{ tag.label }}\n        </div>\n      }\n    </div>\n  </ng-template>\n\n  <!-- Built-in items dropdown (UI-877) \u2014 opens on focus, typing filters by label -->\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"promptOrigin\"\n    [cdkConnectedOverlayOpen]=\"itemsDropdownVisible()\"\n    [cdkConnectedOverlayPositions]=\"dropdownPositions\"\n    [cdkConnectedOverlayWidth]=\"promptContainerRef?.offsetWidth || 0\"\n    (overlayOutsideClick)=\"itemsDropdownOutsideClick($event)\"\n  >\n    <div class=\"dropdown-container custom-dropdown-container\" (mousedown)=\"$event.preventDefault()\">\n      @if (dropdownHeading() || showDropdownClose()) {\n        <div class=\"dropdown-header\">\n          @if (dropdownHeading()) {\n            <span class=\"dropdown-heading\">{{ dropdownHeading() }}</span>\n          }\n          @if (showDropdownClose()) {\n            <ui-button\n              class=\"dropdown-close\"\n              [variant]=\"'icon-button'\"\n              [size]=\"'small'\"\n              [iconName]=\"'Close-in-line'\"\n              [tooltip]=\"('COMMON.CLOSE' | uiTranslate | async)!\"\n              [tooltipPosition]=\"'above'\"\n              [ariaLabel]=\"('COMMON.CLOSE' | uiTranslate | async)!\"\n              (click)=\"closeItemsDropdown()\"\n            ></ui-button>\n          }\n        </div>\n      }\n      <div role=\"list\">\n        @for (item of filteredDropdownItems(); track item.id) {\n          <div\n            class=\"dropdown-tag dropdown-item\"\n            tabindex=\"0\"\n            role=\"listitem\"\n            [attr.aria-label]=\"item.label\"\n            (click)=\"selectDropdownItem(item, $event)\"\n            (keydown.enter)=\"selectDropdownItem(item, $event)\"\n            (keydown.space)=\"selectDropdownItem(item, $event)\"\n          >\n            @if (item.icon) {\n              <ui-icon class=\"dropdown-item-icon\" [name]=\"item.icon\" [color]=\"'inherit'\"></ui-icon>\n            }\n            <span class=\"dropdown-item-label\">{{ item.label }}</span>\n            <ui-icon class=\"dropdown-item-chevron\" [name]=\"'Arrow-chevron-right-in-line'\" [color]=\"'inherit'\"></ui-icon>\n          </div>\n        }\n      </div>\n    </div>\n  </ng-template>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host ::ng-deep ui-field.prompt-text>mat-form-field{vertical-align:top}:host ::ng-deep ui-field.prompt-text .mat-mdc-text-field-wrapper{border-radius:10px!important}:host ::ng-deep ui-field.prompt-text .mat-mdc-form-field.keyboard-focused .mat-mdc-text-field-wrapper:after{outline:2px solid black}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{background:transparent}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix{padding-bottom:0!important}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper textarea{max-height:220px!important}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper textarea:focus{border:2px solid black}:host ::ng-deep ui-button.send-button .rounded-icon .mdc-button{width:48px!important;height:48px!important}:host ::ng-deep ui-overflow-menu button.mat-mdc-unelevated-button.ghost.light-theme.only-icon{border:none}.prompt-container{border:1px solid #919191;border-radius:10px;background-color:#fff}.prompt-container-focused{border:1px solid black;outline:1px solid black}.prompt-container.disabled{border:1px solid #d3d3d3}.prompt-container.disabled.prompt-container-focused{outline:none}.prompt-container.disabled .prompt-icon{color:#d3d3d3}ui-field.show-icon{padding-left:24px}.prompt-icon{position:absolute;top:14px;left:16px;color:#666}.prompt-icon.hovered{color:#000}.dropdown-container{width:100%}.custom-dropdown-container{overflow:hidden;background-color:#fff;border-radius:0 0 8px 8px;box-shadow:0 8px 16px #00000014}.dropdown-header{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 8px}.dropdown-heading{font-weight:700}.dropdown-close{margin-left:auto}.dropdown-item{display:flex;gap:12px;align-items:center}.dropdown-item-icon,.dropdown-item-chevron{flex-shrink:0}.dropdown-item-label{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dropdown-tag{padding:16px;background-color:#fff}.dropdown-tag:hover,.dropdown-tag:focus{background-color:#fff2fc;cursor:pointer}.carousel{flex-grow:1;min-width:0}.tag-container{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;margin:0 8px}.tag-container::-webkit-scrollbar{display:none}#file-upload{display:none}.prompt-footer,.flex-container{display:flex;flex-flow:row nowrap;align-items:center}.prompt-footer{justify-content:space-between;padding:8px 16px}@media(max-width:600px){.prompt-footer{padding:8px}}@media(max-width:320px){.prompt-footer{padding:8px}}.menu{display:flex;flex-flow:column nowrap;position:relative}.menu .menu-badge{position:absolute;right:0;z-index:1000}.view-more{margin-left:4px;white-space:nowrap}.view-more ::ng-deep button.mat-mdc-unelevated-button .label{white-space:nowrap}.prompt-container{position:relative}.prompt-container.has-error{border:1px solid #e02800;outline:1px solid #e02800}.prompt-error{margin-top:4px;align-items:center;display:flex;color:#e02800;font-size:12px;line-height:16px}.prompt-error ui-icon{margin-right:4px}.prompt-loading{display:flex;flex-direction:column;gap:4px;padding:12px 16px 0}.prompt-loading ui-skeleton{height:20px}.ghost{position:absolute;top:0;left:0;bottom:16px;color:#888;border:none;pointer-events:none;background:transparent;width:100%;padding:12px 16px;font-size:inherit;line-height:22px;letter-spacing:inherit;font-weight:inherit;font-family:ModernGothic,sans-serif;resize:none}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        CdkOverlayOrigin,
+                        NgClass,
+                        SkeletonComponent,
+                        IconComponent,
+                        FieldComponent,
+                        TagComponent,
+                        ButtonComponent,
+                        BadgeComponent,
+                        OverflowMenuComponent,
+                        MatTooltip,
+                        CdkConnectedOverlay,
+                        AsyncPipe,
+                        UiTranslatePipe,
+                    ], template: "<ng-container>\n  <div\n    class=\"prompt-container\"\n    [class.has-error]=\"!!errorMessage()\"\n    [class.disabled]=\"isLocked()\"\n    [attr.aria-disabled]=\"isLocked()\"\n    [attr.aria-busy]=\"loading() ? 'true' : null\"\n    cdkOverlayOrigin\n    #promptOrigin=\"cdkOverlayOrigin\"\n    #promptContainerRef\n    [ngClass]=\"{ 'prompt-container-focused': isHighlighted() && !loading() }\"\n  >\n    @if (loading()) {\n      <div class=\"prompt-loading\" aria-hidden=\"true\">\n        <ui-skeleton [theme]=\"{ width: '100%', height: '20px', margin: '0' }\"></ui-skeleton>\n        <ui-skeleton [theme]=\"{ width: '30%', height: '20px', margin: '0' }\"></ui-skeleton>\n      </div>\n    }\n    <div class=\"prompt-autocomplete\" [hidden]=\"loading()\">\n      <textarea tabindex=\"-1\" class=\"ghost\" id=\"autocomplete\" [value]=\"autocompleteSuggestion()\" readonly></textarea>\n\n      @let showIcon = !isFieldFocused() && !textarea.value;\n      @if (showIcon) {\n        <ui-icon\n          class=\"prompt-icon\"\n          [color]=\"'inherit'\"\n          [class.hovered]=\"isFieldHovered()\"\n          [name]=\"'Sparkle-in-line'\"\n        ></ui-icon>\n      }\n      <ui-field\n        #textarea\n        class=\"prompt-text\"\n        [class.show-icon]=\"showIcon\"\n        role=\"input\"\n        [showBottomContent]=\"false\"\n        [borderless]=\"true\"\n        [type]=\"'multi-line'\"\n        [autosizableTextarea]=\"true\"\n        [maxCharacters]=\"maxCharacters()\"\n        [placeholder]=\"showIcon ? placeholder() || ('PROMPT.ASK_ANYTHING' | uiTranslate | async)! : ''\"\n        [value]=\"promptTextValue() || ''\"\n        [hasTextAreaCounter]=\"false\"\n        [disabled]=\"disabled\"\n        (mouseenter)=\"isFieldHovered.set(true)\"\n        (mouseleave)=\"isFieldHovered.set(false)\"\n        (focusin)=\"isFieldFocused.set(true)\"\n        (fieldBlur)=\"onFieldBlur()\"\n        (keydown.tab)=\"onTextareaTab($event)\"\n      ></ui-field>\n    </div>\n    <div class=\"prompt-footer flex-container\">\n      <div class=\"flex-container\">\n        @if (actionTag(); as at) {\n          <ui-tag\n            [label]=\"at.label\"\n            [icon]=\"at.icon ?? 'Plus'\"\n            [ariaLabel]=\"at.ariaLabel ?? at.label\"\n            [isDisabled]=\"isLocked() || !!at.disabled\"\n            (press)=\"onActionTagPress()\"\n          ></ui-tag>\n        } @else if (enableFileUpload()) {\n          <ui-button\n            [variant]=\"'icon-button'\"\n            [tooltip]=\"('PROMPT.ADD_FILES' | uiTranslate | async)!\"\n            [tooltipPosition]=\"'above'\"\n            [ariaLabel]=\"('PROMPT.ADD_FILES' | uiTranslate | async)!\"\n            [iconName]=\"'Plus'\"\n            [disabled]=\"isLocked()\"\n            (click)=\"fileDrop()?.nativeElement?.click()\"\n          ></ui-button>\n\n          @if (promptFilesList().length) {\n            <div class=\"menu\">\n              <ui-badge\n                [notificationsAmount]=\"promptFilesList().length\"\n                [variant]=\"'notification'\"\n                class=\"menu-badge\"\n              ></ui-badge>\n              <ui-overflow-menu\n                [matTooltip]=\"('PROMPT.FILES' | uiTranslate | async)!\"\n                [matTooltipPosition]=\"'above'\"\n                [buttonSize]=\"'medium'\"\n                [iconTrigger]=\"'Document'\"\n                [buttonVariant]=\"'ghost'\"\n                [buttons]=\"fileListMenuConfig()\"\n                [isDynamicMenu]=\"true\"\n                [withRemovableOption]=\"true\"\n                (selectItem)=\"selectedMenuOption($event)\"\n              ></ui-overflow-menu>\n            </div>\n          }\n        }\n\n        @if (actionTag() || enableFileUpload()) {\n          <input\n            data-testid=\"prompt-file-input\"\n            [tabIndex]=\"-1\"\n            class=\"form-control\"\n            #fileDropRef\n            type=\"file\"\n            id=\"file-upload\"\n            [accept]=\"fileInputAccept()\"\n            [disabled]=\"isLocked()\"\n            (change)=\"onFileSelected($event)\"\n          />\n        }\n      </div>\n\n      @if (tags()?.length && !promptTextValue()) {\n        <div class=\"flex-container carousel\">\n          <div class=\"tag-container flex-container\" role=\"list\" #tagsScrollContainer>\n            @for (tag of tagsVisible(); track tag) {\n              <ui-tag\n                [label]=\"tag.label\"\n                role=\"listitem\"\n                [ariaLabel]=\"tag.label\"\n                [isDisabled]=\"isLocked()\"\n                (click)=\"selectTag(tag, $event)\"\n                (keyup.enter)=\"selectTag(tag, $event)\"\n                (keyup.space)=\"selectTag(tag, $event)\"\n              ></ui-tag>\n            }\n\n            @if (tagsInDropdown().length) {\n              <ui-button\n                class=\"view-more\"\n                variant=\"text-inline\"\n                [label]=\"('PROMPT.VIEW_MORE' | uiTranslate | async)!\"\n                [ariaLabel]=\"('PROMPT.VIEW_MORE' | uiTranslate | async)!\"\n                [size]=\"'medium'\"\n                [disabled]=\"isLocked()\"\n                (click)=\"toggleDropdown()\"\n                (keydown.enter)=\"focusTagDropdown()\"\n                cdkOverlayOrigin\n                #dropdownTrigger=\"cdkOverlayOrigin\"\n              ></ui-button>\n            }\n          </div>\n\n          <div class=\"flex-container\">\n            <ui-button\n              [variant]=\"'icon-button'\"\n              [size]=\"'small'\"\n              [ariaLabel]=\"'Scroll left button'\"\n              [iconName]=\"'Arrow-chevron-left-in-line'\"\n              [disabled]=\"isLocked() || tagsScrollContainer.scrollLeft === 0\"\n              (click)=\"tagsScrollContainer.scrollBy({ left: -100, behavior: 'smooth' })\"\n            ></ui-button>\n            <ui-button\n              [variant]=\"'icon-button'\"\n              [size]=\"'small'\"\n              [iconName]=\"'Arrow-chevron-right-in-line'\"\n              [ariaLabel]=\"'Scroll right button'\"\n              [disabled]=\"\n                isLocked() ||\n                tagsScrollContainer.scrollLeft + tagsScrollContainer.clientWidth >= tagsScrollContainer.scrollWidth\n              \"\n              (click)=\"tagsScrollContainer.scrollBy({ left: 100, behavior: 'smooth' })\"\n            ></ui-button>\n          </div>\n        </div>\n      }\n\n      @if (showSendButton()) {\n        <ui-button\n          class=\"send-button\"\n          [variant]=\"'secondary'\"\n          [iconName]=\"'Arrow-up-in-line'\"\n          [tooltip]=\"('COMMON.SEND' | uiTranslate | async)!\"\n          [ariaLabel]=\"('COMMON.SEND' | uiTranslate | async)!\"\n          [tooltipPosition]=\"'above'\"\n          [size]=\"'medium'\"\n          [disabled]=\"isLocked() || sendButtonDisabled() || (!promptTextValue() && !promptFilesList().length)\"\n          (click)=\"sendPromptData()\"\n        ></ui-button>\n      }\n    </div>\n  </div>\n\n  @if (errorMessage()) {\n    <div class=\"prompt-error\">\n      <ui-icon [name]=\"'Error'\" color=\"red\"></ui-icon>\n      <span>{{ errorMessage() }}</span>\n    </div>\n  }\n\n  <!--  Dropdown for hidden tags -->\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"promptOrigin\"\n    [cdkConnectedOverlayOpen]=\"isDropdownOpened() && !isLocked()\"\n    [cdkConnectedOverlayPositions]=\"dropdownPositions\"\n    [cdkConnectedOverlayWidth]=\"promptContainerRef?.offsetWidth || 0\"\n    (overlayOutsideClick)=\"dropdownOutsideClick()\"\n  >\n    <div class=\"dropdown-container\" role=\"list\" #tagDropdown tabindex=\"0\">\n      @for (tag of tagsInDropdown(); track tag) {\n        <div\n          class=\"dropdown-tag\"\n          tabindex=\"0\"\n          [attr.aria-label]=\"tag.label\"\n          role=\"listitem\"\n          (click)=\"selectTag(tag, $event)\"\n          (keyup.enter)=\"selectTag(tag, $event)\"\n          (keyup.space)=\"selectTag(tag, $event)\"\n        >\n          {{ tag.label }}\n        </div>\n      }\n    </div>\n  </ng-template>\n\n  <!-- Built-in items dropdown (UI-877) \u2014 opens on focus, typing filters by label -->\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"promptOrigin\"\n    [cdkConnectedOverlayOpen]=\"itemsDropdownVisible()\"\n    [cdkConnectedOverlayPositions]=\"dropdownPositions\"\n    [cdkConnectedOverlayWidth]=\"promptContainerRef?.offsetWidth || 0\"\n    (overlayOutsideClick)=\"itemsDropdownOutsideClick($event)\"\n  >\n    <div class=\"dropdown-container custom-dropdown-container\" (mousedown)=\"$event.preventDefault()\">\n      @if (dropdownHeading() || showDropdownClose()) {\n        <div class=\"dropdown-header\">\n          @if (dropdownHeading()) {\n            <span class=\"dropdown-heading\">{{ dropdownHeading() }}</span>\n          }\n          @if (showDropdownClose()) {\n            <ui-button\n              class=\"dropdown-close\"\n              [variant]=\"'icon-button'\"\n              [size]=\"'small'\"\n              [iconName]=\"'Close-in-line'\"\n              [tooltip]=\"('COMMON.CLOSE' | uiTranslate | async)!\"\n              [tooltipPosition]=\"'above'\"\n              [ariaLabel]=\"('COMMON.CLOSE' | uiTranslate | async)!\"\n              (click)=\"closeItemsDropdown()\"\n            ></ui-button>\n          }\n        </div>\n      }\n      <div role=\"list\">\n        @for (item of filteredDropdownItems(); track item.id) {\n          <div\n            class=\"dropdown-tag dropdown-item\"\n            tabindex=\"0\"\n            role=\"listitem\"\n            [attr.aria-label]=\"item.label\"\n            (click)=\"selectDropdownItem(item, $event)\"\n            (keydown.enter)=\"selectDropdownItem(item, $event)\"\n            (keydown.space)=\"selectDropdownItem(item, $event)\"\n          >\n            @if (item.icon) {\n              <ui-icon class=\"dropdown-item-icon\" [name]=\"item.icon\" [color]=\"'inherit'\"></ui-icon>\n            }\n            <span class=\"dropdown-item-label\">{{ item.label }}</span>\n            <ui-icon class=\"dropdown-item-chevron\" [name]=\"'Arrow-chevron-right-in-line'\" [color]=\"'inherit'\"></ui-icon>\n          </div>\n        }\n      </div>\n    </div>\n  </ng-template>\n</ng-container>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host ::ng-deep ui-field.prompt-text>mat-form-field{vertical-align:top}:host ::ng-deep ui-field.prompt-text .mat-mdc-text-field-wrapper{border-radius:10px!important}:host ::ng-deep ui-field.prompt-text .mat-mdc-form-field.keyboard-focused .mat-mdc-text-field-wrapper:after{outline:2px solid black}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{background:transparent}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-infix{padding-bottom:0!important}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper textarea{max-height:220px!important}:host ::ng-deep .ui-field .mat-mdc-form-field.multi-line-textarea.mat-mdc-form-field-type-mat-input.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper textarea:focus{border:2px solid black}:host ::ng-deep ui-button.send-button .rounded-icon .mdc-button{width:48px!important;height:48px!important}:host ::ng-deep ui-overflow-menu button.mat-mdc-unelevated-button.ghost.light-theme.only-icon{border:none}.prompt-container{border:1px solid #919191;border-radius:10px;background-color:#fff}.prompt-container-focused{border:1px solid black;outline:1px solid black}.prompt-container.disabled{border:1px solid #d3d3d3}.prompt-container.disabled.prompt-container-focused{outline:none}.prompt-container.disabled .prompt-icon{color:#d3d3d3}ui-field.show-icon{padding-left:24px}.prompt-icon{position:absolute;top:14px;left:16px;color:#666}.prompt-icon.hovered{color:#000}.dropdown-container{width:100%}.custom-dropdown-container{overflow:hidden;background-color:#fff;border-radius:0 0 8px 8px;box-shadow:0 8px 16px #00000014}.dropdown-header{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 8px}.dropdown-heading{font-weight:700}.dropdown-close{margin-left:auto}.dropdown-item{display:flex;gap:12px;align-items:center}.dropdown-item-icon,.dropdown-item-chevron{flex-shrink:0}.dropdown-item-label{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dropdown-tag{padding:16px;background-color:#fff}.dropdown-tag:hover,.dropdown-tag:focus{background-color:#fff2fc;cursor:pointer}.carousel{flex-grow:1;min-width:0}.tag-container{overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;margin:0 8px}.tag-container::-webkit-scrollbar{display:none}#file-upload{display:none}.prompt-footer,.flex-container{display:flex;flex-flow:row nowrap;align-items:center}.prompt-footer{justify-content:space-between;padding:8px 16px}@media(max-width:600px){.prompt-footer{padding:8px}}@media(max-width:320px){.prompt-footer{padding:8px}}.menu{display:flex;flex-flow:column nowrap;position:relative}.menu .menu-badge{position:absolute;right:0;z-index:1000}.view-more{margin-left:4px;white-space:nowrap}.view-more ::ng-deep button.mat-mdc-unelevated-button .label{white-space:nowrap}.prompt-container{position:relative}.prompt-container.has-error{border:1px solid #e02800;outline:1px solid #e02800}.prompt-error{margin-top:4px;align-items:center;display:flex;color:#e02800;font-size:12px;line-height:16px}.prompt-error ui-icon{margin-right:4px}.prompt-loading{display:flex;flex-direction:column;gap:4px;padding:12px 16px 0}.prompt-loading ui-skeleton{height:20px}.ghost{position:absolute;top:0;left:0;bottom:16px;color:#888;border:none;pointer-events:none;background:transparent;width:100%;padding:12px 16px;font-size:inherit;line-height:22px;letter-spacing:inherit;font-weight:inherit;font-family:ModernGothic,sans-serif;resize:none}\n"] }]
         }], propDecorators: { tags: [{ type: i0.Input, args: [{ isSignal: true, alias: "tags", required: false }] }], actionTag: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionTag", required: false }] }], maxCharacters: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxCharacters", required: false }] }], supportedFileTypes: [{ type: i0.Input, args: [{ isSignal: true, alias: "supportedFileTypes", required: false }] }], autoClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoClear", required: false }] }], showSendButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSendButton", required: false }] }], sendButtonDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "sendButtonDisabled", required: false }] }], enableFileUpload: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableFileUpload", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], errorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessage", required: false }] }], dropdownItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownItems", required: false }] }], dropdownHeading: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownHeading", required: false }] }], showDropdownClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDropdownClose", required: false }] }], disabled: [{
                 type: Input,
                 args: [{ transform: booleanAttribute }]
@@ -326,7 +331,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
 
 class PromptModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PromptModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: PromptModule, declarations: [PromptComponent], imports: [CommonModule,
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: PromptModule, imports: [CommonModule,
             FieldComponentModule,
             ButtonComponentModule,
             OverflowMenuComponentModule,
@@ -340,7 +345,8 @@ class PromptModule {
             MatTooltip,
             UiTranslatePipe,
             IconComponentModule,
-            SkeletonComponent], exports: [PromptComponent] }); }
+            SkeletonComponent,
+            PromptComponent], exports: [PromptComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PromptModule, imports: [CommonModule,
             FieldComponentModule,
             ButtonComponentModule,
@@ -350,12 +356,12 @@ class PromptModule {
             CardComponentModule,
             TooltipComponentModule,
             IconComponentModule,
-            SkeletonComponent] }); }
+            SkeletonComponent,
+            PromptComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: PromptModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [PromptComponent],
                     imports: [
                         CommonModule,
                         FieldComponentModule,
@@ -372,6 +378,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         UiTranslatePipe,
                         IconComponentModule,
                         SkeletonComponent,
+                        PromptComponent,
                     ],
                     exports: [PromptComponent],
                 }]