@testgorilla/tgo-ui 11.3.0 → 11.5.0-beta.1

package/fesm2022/testgorilla-tgo-ui-components-validation-error.mjs

@@ -69,10 +69,10 @@ class ValidationErrorComponent {
         }
         return template;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: ValidationErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: ValidationErrorComponent, isStandalone: true, selector: "ui-validation-error", inputs: { ngControl: "ngControl", touchedOn: "touchedOn", errorMessage: "errorMessage", label: "label", applicationTheme: "applicationTheme", customErrors: "customErrors" }, host: { properties: { "attr.theme": "this.applicationTheme" } }, ngImport: i0, template: "@for (key of customErrorKeys; track $index) {\n  @if (ngControl?.hasError(key) && (touchedOn ? ngControl?.touched : true)) {\n    <div class=\"errors\">\n      <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n      <span>{{ resolveErrorMessage(key) }}</span>\n    </div>\n  }\n}\n\n@if (ngControl?.hasError('maxlength') && !customErrors['maxlength']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{\n      translationContextErrors + 'MAX_LENGTH' | uiTranslate: { maxlength: getErrorValue('maxlength') } | async\n    }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('minlength') && !customErrors['min']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{\n      translationContextErrors + 'MIN_LENGTH' | uiTranslate: { maxlength: getErrorValue('minlength') } | async\n    }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('min') && !customErrors['min']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{ translationContextErrors + 'MIN' | uiTranslate: { min: getErrorValue('min') } | async }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('max') && !customErrors['max']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{ translationContextErrors + 'MAX' | uiTranslate: { max: getErrorValue('max') } | async }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('required') && (touchedOn ? ngControl?.touched : true) && !customErrors['required']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{\n      translationContextErrors + (label ? 'REQUIRED_FIELD' : 'REQUIRED') | uiTranslate: { label } | async\n    }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('email') && !customErrors['email']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{ translationContextErrors + 'EMAIL_INCORRECT' | uiTranslate | async }}</span>\n  </div>\n}\n\n@if (errorMessage) {\n  <div class=\"custom-errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{ errorMessage }}</span>\n  </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: IconComponentModule }, { kind: "component", type: i1.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ValidationErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: ValidationErrorComponent, isStandalone: true, selector: "ui-validation-error", inputs: { ngControl: "ngControl", touchedOn: "touchedOn", errorMessage: "errorMessage", label: "label", applicationTheme: "applicationTheme", customErrors: "customErrors" }, host: { properties: { "attr.theme": "this.applicationTheme" } }, ngImport: i0, template: "@for (key of customErrorKeys; track $index) {\n  @if (ngControl?.hasError(key) && (touchedOn ? ngControl?.touched : true)) {\n    <div class=\"errors\">\n      <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n      <span>{{ resolveErrorMessage(key) }}</span>\n    </div>\n  }\n}\n\n@if (ngControl?.hasError('maxlength') && !customErrors['maxlength']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{\n      translationContextErrors + 'MAX_LENGTH' | uiTranslate: { maxlength: getErrorValue('maxlength') } | async\n    }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('minlength') && !customErrors['min']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{\n      translationContextErrors + 'MIN_LENGTH' | uiTranslate: { maxlength: getErrorValue('minlength') } | async\n    }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('min') && !customErrors['min']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{ translationContextErrors + 'MIN' | uiTranslate: { min: getErrorValue('min') } | async }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('max') && !customErrors['max']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{ translationContextErrors + 'MAX' | uiTranslate: { max: getErrorValue('max') } | async }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('required') && (touchedOn ? ngControl?.touched : true) && !customErrors['required']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{\n      translationContextErrors + (label ? 'REQUIRED_FIELD' : 'REQUIRED') | uiTranslate: { label } | async\n    }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('email') && !customErrors['email']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{ translationContextErrors + 'EMAIL_INCORRECT' | uiTranslate | async }}</span>\n  </div>\n}\n\n@if (errorMessage) {\n  <div class=\"custom-errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{ errorMessage }}</span>\n  </div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: IconComponentModule }, { kind: "component", type: i1.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: ValidationErrorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ValidationErrorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ui-validation-error', changeDetection: ChangeDetectionStrategy.OnPush, imports: [IconComponentModule, AsyncPipe, UiTranslatePipe], template: "@for (key of customErrorKeys; track $index) {\n  @if (ngControl?.hasError(key) && (touchedOn ? ngControl?.touched : true)) {\n    <div class=\"errors\">\n      <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n      <span>{{ resolveErrorMessage(key) }}</span>\n    </div>\n  }\n}\n\n@if (ngControl?.hasError('maxlength') && !customErrors['maxlength']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{\n      translationContextErrors + 'MAX_LENGTH' | uiTranslate: { maxlength: getErrorValue('maxlength') } | async\n    }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('minlength') && !customErrors['min']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{\n      translationContextErrors + 'MIN_LENGTH' | uiTranslate: { maxlength: getErrorValue('minlength') } | async\n    }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('min') && !customErrors['min']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{ translationContextErrors + 'MIN' | uiTranslate: { min: getErrorValue('min') } | async }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('max') && !customErrors['max']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{ translationContextErrors + 'MAX' | uiTranslate: { max: getErrorValue('max') } | async }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('required') && (touchedOn ? ngControl?.touched : true) && !customErrors['required']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{\n      translationContextErrors + (label ? 'REQUIRED_FIELD' : 'REQUIRED') | uiTranslate: { label } | async\n    }}</span>\n  </div>\n}\n\n@if (ngControl?.hasError('email') && !customErrors['email']) {\n  <div class=\"errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{ translationContextErrors + 'EMAIL_INCORRECT' | uiTranslate | async }}</span>\n  </div>\n}\n\n@if (errorMessage) {\n  <div class=\"custom-errors\">\n    <ui-icon [applicationTheme]=\"applicationTheme\" [name]=\"'Error'\"></ui-icon>\n    <span>{{ errorMessage }}</span>\n  </div>\n}\n" }]
         }], propDecorators: { ngControl: [{
@@ -93,11 +93,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
             }] } });
 
 class ValidationErrorModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: ValidationErrorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.19", ngImport: i0, type: ValidationErrorModule, imports: [CommonModule, IconComponentModule, UiTranslatePipe, ValidationErrorComponent], exports: [ValidationErrorComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: ValidationErrorModule, imports: [CommonModule, IconComponentModule, ValidationErrorComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ValidationErrorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.18", ngImport: i0, type: ValidationErrorModule, imports: [CommonModule, IconComponentModule, UiTranslatePipe, ValidationErrorComponent], exports: [ValidationErrorComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ValidationErrorModule, imports: [CommonModule, IconComponentModule, ValidationErrorComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: ValidationErrorModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ValidationErrorModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [ValidationErrorComponent],

package/fesm2022/testgorilla-tgo-ui-components-write-with-ai.mjs

@@ -130,10 +130,10 @@ class WriteWithAiLlmService {
         parts.push('Respond with only the requested content. Do not include explanations or preamble.');
         return parts.join('\n\n');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: WriteWithAiLlmService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: WriteWithAiLlmService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: WriteWithAiLlmService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: WriteWithAiLlmService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: WriteWithAiLlmService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: WriteWithAiLlmService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: i1.HttpClient }] });
@@ -405,8 +405,8 @@ class WriteWithAiComponent {
         }
         this.requestRefine.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: WriteWithAiComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: WriteWithAiComponent, isStandalone: true, selector: "ui-write-with-ai", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, standalone: { classPropertyName: "standalone", publicName: "standalone", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, fieldLabel: { classPropertyName: "fieldLabel", publicName: "fieldLabel", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, promptValue: { classPropertyName: "promptValue", publicName: "promptValue", isSignal: true, isRequired: false, transformFunction: null }, tags: { classPropertyName: "tags", publicName: "tags", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, subheader: { classPropertyName: "subheader", publicName: "subheader", isSignal: true, isRequired: false, transformFunction: null }, llmConfig: { classPropertyName: "llmConfig", publicName: "llmConfig", isSignal: true, isRequired: false, transformFunction: null }, fullHeight: { classPropertyName: "fullHeight", publicName: "fullHeight", isSignal: true, isRequired: false, transformFunction: null }, borderless: { classPropertyName: "borderless", publicName: "borderless", isSignal: true, isRequired: false, transformFunction: null }, tagsOnly: { classPropertyName: "tagsOnly", publicName: "tagsOnly", isSignal: true, isRequired: false, transformFunction: null }, metadata: { classPropertyName: "metadata", publicName: "metadata", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", promptChange: "promptChange", promptSubmit: "promptSubmit", cancelPending: "cancelPending", acceptResult: "acceptResult", requestRefine: "requestRefine" }, host: { styleAttribute: "display: block" }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: WriteWithAiComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: WriteWithAiComponent, isStandalone: true, selector: "ui-write-with-ai", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, standalone: { classPropertyName: "standalone", publicName: "standalone", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, fieldLabel: { classPropertyName: "fieldLabel", publicName: "fieldLabel", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, promptValue: { classPropertyName: "promptValue", publicName: "promptValue", isSignal: true, isRequired: false, transformFunction: null }, tags: { classPropertyName: "tags", publicName: "tags", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, subheader: { classPropertyName: "subheader", publicName: "subheader", isSignal: true, isRequired: false, transformFunction: null }, llmConfig: { classPropertyName: "llmConfig", publicName: "llmConfig", isSignal: true, isRequired: false, transformFunction: null }, fullHeight: { classPropertyName: "fullHeight", publicName: "fullHeight", isSignal: true, isRequired: false, transformFunction: null }, borderless: { classPropertyName: "borderless", publicName: "borderless", isSignal: true, isRequired: false, transformFunction: null }, tagsOnly: { classPropertyName: "tagsOnly", publicName: "tagsOnly", isSignal: true, isRequired: false, transformFunction: null }, metadata: { classPropertyName: "metadata", publicName: "metadata", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", promptChange: "promptChange", promptSubmit: "promptSubmit", cancelPending: "cancelPending", acceptResult: "acceptResult", requestRefine: "requestRefine" }, host: { styleAttribute: "display: block" }, providers: [
             UiTranslatePipe,
             {
                 provide: NG_VALUE_ACCESSOR,
@@ -415,7 +415,7 @@ class WriteWithAiComponent {
             },
         ], viewQueries: [{ propertyName: "tagsScrollRef", first: true, predicate: ["tagsScrollContainer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n  class=\"write-with-ai\"\n  [class.write-with-ai--standalone]=\"standalone()\"\n  [class.write-with-ai--full-height]=\"fullHeight()\"\n>\n  @if (!standalone()) {\n    <div class=\"write-with-ai__host\">\n      <ui-field\n        [label]=\"fieldLabel() || (translationContext + 'FIELD_LABEL' | uiTranslate | async)!\"\n        type=\"textarea\"\n        [showBottomContent]=\"false\"\n        [fullHeight]=\"fullHeight()\"\n        [borderless]=\"borderless()\"\n        [disabled]=\"cvaDisabled()\"\n        [ngModel]=\"effectiveValue()\"\n        (ngModelChange)=\"handleValueInput($event)\"\n      ></ui-field>\n      <ui-button\n        class=\"write-with-ai__cta\"\n        variant=\"ghost-ai\"\n        size=\"small\"\n        [label]=\"(translationContext + 'AI_ASSIST' | uiTranslate | async)!\"\n        iconName=\"Sparkle-in-line\"\n        iconPosition=\"left\"\n        [disabled]=\"isPanelVisible() || cvaDisabled()\"\n        (buttonClickEvent)=\"togglePanel()\"\n      ></ui-button>\n    </div>\n  }\n\n  @if (isPanelVisible()) {\n    <section\n      class=\"write-with-ai__panel\"\n      [class.write-with-ai__panel--loading]=\"effectiveStatus() === 'loading'\"\n      role=\"region\"\n      [attr.aria-label]=\"(translationContext + 'AI_WRITING_ASSISTANT' | uiTranslate | async)!\"\n    >\n      <header class=\"write-with-ai__panel-header\">\n        <div class=\"write-with-ai__panel-heading\">\n          <div class=\"write-with-ai__title-row\">\n            @if (effectiveStatus() !== 'loading') {\n              <ui-icon class=\"write-with-ai__title-icon\" name=\"Sparkle-in-line\" color=\"ai\"></ui-icon>\n            }\n            <h4 class=\"write-with-ai__title\">\n              {{ header() || (translationContext + 'HEADER' | uiTranslate | async) }}\n            </h4>\n          </div>\n          @if (subheader()) {\n            <p class=\"write-with-ai__subheader\">{{ subheader() }}</p>\n          }\n        </div>\n        @if (!standalone()) {\n          <ui-button\n            variant=\"icon-button\"\n            iconName=\"Close\"\n            size=\"small\"\n            [tooltip]=\"(translationContext + 'CLOSE' | uiTranslate | async)!\"\n            [ariaLabel]=\"(translationContext + 'CLOSE_AI_ASSISTANT' | uiTranslate | async)!\"\n            (buttonClickEvent)=\"togglePanel()\"\n          ></ui-button>\n        }\n      </header>\n\n      @if (effectiveStatus() === 'idle') {\n        @if (tagsOnly()) {\n          @if (tags().length) {\n            <div class=\"write-with-ai__tags-prompt\">\n              <div\n                class=\"write-with-ai__tags-container\"\n                role=\"group\"\n                [attr.aria-label]=\"header() || (translationContext + 'HEADER' | uiTranslate | async)\"\n                #tagsScrollContainer\n                (scroll)=\"measureTagScroll(tagsScrollContainer)\"\n              >\n                @for (tag of tags(); track tag.id) {\n                  <ui-tag\n                    [label]=\"tag.label\"\n                    [ariaLabel]=\"tag.label\"\n                    [isDisabled]=\"cvaDisabled()\"\n                    (press)=\"handleTagClick(tag)\"\n                  ></ui-tag>\n                }\n              </div>\n              <div class=\"write-with-ai__tags-arrows\">\n                <ui-button\n                  variant=\"icon-button\"\n                  size=\"small\"\n                  iconName=\"Arrow-chevron-left-in-line\"\n                  [tooltip]=\"(translationContext + 'SCROLL_TAGS_LEFT' | uiTranslate | async)!\"\n                  [ariaLabel]=\"(translationContext + 'SCROLL_TAGS_LEFT' | uiTranslate | async)!\"\n                  [disabled]=\"cvaDisabled() || !canScrollTagsLeft()\"\n                  (buttonClickEvent)=\"scrollTags(tagsScrollContainer, -1)\"\n                ></ui-button>\n                <ui-button\n                  variant=\"icon-button\"\n                  size=\"small\"\n                  iconName=\"Arrow-chevron-right-in-line\"\n                  [tooltip]=\"(translationContext + 'SCROLL_TAGS_RIGHT' | uiTranslate | async)!\"\n                  [ariaLabel]=\"(translationContext + 'SCROLL_TAGS_RIGHT' | uiTranslate | async)!\"\n                  [disabled]=\"cvaDisabled() || !canScrollTagsRight()\"\n                  (buttonClickEvent)=\"scrollTags(tagsScrollContainer, 1)\"\n                ></ui-button>\n              </div>\n            </div>\n          }\n        } @else {\n          <div class=\"write-with-ai__prompt\">\n            <ui-prompt\n              [ngModel]=\"promptModelData()\"\n              (ngModelChange)=\"handlePromptModelChange($event)\"\n              [tags]=\"promptTags()\"\n              [placeholder]=\"placeholder() || (translationContext + 'PLACEHOLDER' | uiTranslate | async)!\"\n              [showSendButton]=\"true\"\n              (promptData)=\"handlePromptSubmit($event)\"\n            ></ui-prompt>\n          </div>\n        }\n      }\n\n      @if (statusConfig(); as cfg) {\n        <ui-alert-banner\n          [alertType]=\"cfg.alertType\"\n          alertVariant=\"callout\"\n          [message]=\"(cfg.messageKey | uiTranslate | async)!\"\n          [includeDismissButton]=\"false\"\n          [isLoading]=\"cfg.variant === 'loading'\"\n          [hasIcon]=\"cfg.variant !== 'loading'\"\n          [actions]=\"cfg.actions\"\n          [isFullWidth]=\"true\"\n        ></ui-alert-banner>\n      }\n\n      <div class=\"write-with-ai__caveat\">\n        <ui-ai-caveat></ui-ai-caveat>\n      </div>\n    </section>\n  }\n</div>\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}.write-with-ai{display:flex;flex-direction:column;gap:8px;padding-top:8px;max-width:100%;overflow:hidden}.write-with-ai--full-height{height:100%}.write-with-ai--full-height .write-with-ai__host{flex:1}.write-with-ai__host{position:relative;display:flex;flex-direction:column}.write-with-ai__cta{position:absolute;right:8px;bottom:8px;z-index:1;background-color:#fff;border-radius:100px}.write-with-ai__panel{border:none;border-radius:10px;padding:16px;display:flex;flex-direction:column;gap:8px;background-color:#f4f4f4}.write-with-ai__panel-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.write-with-ai__panel-heading{display:flex;flex-direction:column;gap:8px}.write-with-ai__title-row{display:flex;align-items:center;gap:8px}.write-with-ai__title{margin:0}.write-with-ai__subheader{margin:0;font-size:14px;line-height:22px;font-weight:400;color:#242424}.write-with-ai__quick-actions{display:flex;gap:8px;flex-wrap:wrap}.write-with-ai__prompt{display:flex;flex-direction:column;gap:4px}.write-with-ai__tags-prompt{display:flex;align-items:center;gap:4px;padding:8px;border:1px solid #919191;border-radius:10px;background-color:#fff}.write-with-ai__tags-container{display:flex;flex-flow:row nowrap;align-items:center;gap:4px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.write-with-ai__tags-container::-webkit-scrollbar{display:none}.write-with-ai__tags-arrows{display:flex;align-items:center;gap:4px;flex-shrink:0}.write-with-ai__status-actions{display:flex;gap:8px;justify-content:flex-end}.write-with-ai__caveat{font-size:12px}@keyframes pulse-text{0%,to{opacity:1}50%{opacity:.5}}:host ::ng-deep .write-with-ai__host textarea{padding-bottom:48px!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: FieldComponentModule }, { 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: "ngmodule", type: ButtonComponentModule }, { 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: "ngmodule", type: IconComponentModule }, { kind: "component", type: i4.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "ngmodule", type: PromptModule }, { kind: "component", type: i5.PromptComponent, selector: "ui-prompt", inputs: ["tags", "actionTag", "maxCharacters", "supportedFileTypes", "autoClear", "showSendButton", "sendButtonDisabled", "enableFileUpload", "loading", "placeholder", "errorMessage", "dropdownItems", "dropdownHeading", "showDropdownClose", "disabled"], outputs: ["promptData", "actionTagFileSelected", "dropdownItemSelected", "dropdownClosed"] }, { kind: "ngmodule", type: AiCaveatComponentModule }, { kind: "component", type: i6.AiCaveatComponent, selector: "ui-ai-caveat", inputs: ["applicationTheme"] }, { kind: "ngmodule", type: AlertBannerComponentModule }, { kind: "component", type: i7.AlertBannerComponent, selector: "ui-alert-banner", inputs: ["alertType", "alertVariant", "message", "includeDismissButton", "shadow", "linkText", "linkUrl", "linkTarget", "actions", "applicationTheme", "isFullWidth", "closeButtonTooltip", "hasIcon", "isLoading", "fixed", "ariaDescribedby", "secondaryAlerts"], outputs: ["dismiss"] }, { kind: "ngmodule", type: TagComponentModule }, { kind: "component", type: i8.TagComponent, selector: "ui-tag", inputs: ["label", "icon", "allowClose", "readOnly", "isSelected", "showIconWhenSelected", "pinnedBackground", "isDisabled", "applicationTheme", "ariaLabel", "ariaRequired", "showBadge", "notificationsAmount"], outputs: ["isSelectedChange", "close", "press"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: WriteWithAiComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: WriteWithAiComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ui-write-with-ai', changeDetection: ChangeDetectionStrategy.OnPush, host: { style: 'display: block' }, providers: [
                         UiTranslatePipe,
@@ -439,11 +439,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
         }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], standalone: [{ type: i0.Input, args: [{ isSignal: true, alias: "standalone", required: false }] }], defaultOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultOpen", required: false }] }], fieldLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldLabel", required: false }] }], header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], promptValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "promptValue", required: false }] }], tags: [{ type: i0.Input, args: [{ isSignal: true, alias: "tags", required: false }] }], status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], subheader: [{ type: i0.Input, args: [{ isSignal: true, alias: "subheader", required: false }] }], llmConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "llmConfig", required: false }] }], fullHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullHeight", required: false }] }], borderless: [{ type: i0.Input, args: [{ isSignal: true, alias: "borderless", required: false }] }], tagsOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "tagsOnly", required: false }] }], metadata: [{ type: i0.Input, args: [{ isSignal: true, alias: "metadata", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], promptChange: [{ type: i0.Output, args: ["promptChange"] }], promptSubmit: [{ type: i0.Output, args: ["promptSubmit"] }], cancelPending: [{ type: i0.Output, args: ["cancelPending"] }], acceptResult: [{ type: i0.Output, args: ["acceptResult"] }], requestRefine: [{ type: i0.Output, args: ["requestRefine"] }], tagsScrollRef: [{ type: i0.ViewChild, args: ['tagsScrollContainer', { isSignal: true }] }] } });
 
 class WriteWithAiComponentModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: WriteWithAiComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.19", ngImport: i0, type: WriteWithAiComponentModule, imports: [WriteWithAiComponent], exports: [WriteWithAiComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: WriteWithAiComponentModule, imports: [WriteWithAiComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: WriteWithAiComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.18", ngImport: i0, type: WriteWithAiComponentModule, imports: [WriteWithAiComponent], exports: [WriteWithAiComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: WriteWithAiComponentModule, imports: [WriteWithAiComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: WriteWithAiComponentModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: WriteWithAiComponentModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [WriteWithAiComponent],

package/fesm2022/testgorilla-tgo-ui.mjs

@@ -38,10 +38,10 @@ class DeprecatedPaginatorComponent {
     paginatorChanged(paginator) {
         this.paginatorChangedEvent.emit(paginator);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: DeprecatedPaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: DeprecatedPaginatorComponent, isStandalone: true, selector: "ui-paginator", inputs: { length: "length", defaultPageSize: "defaultPageSize" }, outputs: { paginatorChangedEvent: "paginatorChangedEvent" }, ngImport: i0, template: "<mat-paginator\n  [length]=\"length\"\n  [pageSize]=\"defaultPageSize\"\n  [pageSizeOptions]=\"pageSizeOptions\"\n  (page)=\"paginatorChanged($event)\"\n>\n</mat-paginator>\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}.mat-mdc-paginator{--mat-paginator-disabled-icon-color: rgba(0, 0, 0, .12);border-radius:0 0 8px 8px}.mat-mdc-paginator .mat-mdc-paginator-outer-container{border-radius:0 0 8px 8px;font-weight:400;font-size:14px;line-height:16px;color:#000}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container{padding:0}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-select-value-text{font-size:14px}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-paginator-range-actions{height:100%}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-paginator-range-actions button{height:100%;width:70px;border-radius:0}\n"], dependencies: [{ kind: "component", type: MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: DeprecatedPaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: DeprecatedPaginatorComponent, isStandalone: true, selector: "ui-paginator", inputs: { length: "length", defaultPageSize: "defaultPageSize" }, outputs: { paginatorChangedEvent: "paginatorChangedEvent" }, ngImport: i0, template: "<mat-paginator\n  [length]=\"length\"\n  [pageSize]=\"defaultPageSize\"\n  [pageSizeOptions]=\"pageSizeOptions\"\n  (page)=\"paginatorChanged($event)\"\n>\n</mat-paginator>\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}.mat-mdc-paginator{--mat-paginator-disabled-icon-color: rgba(0, 0, 0, .12);border-radius:0 0 8px 8px}.mat-mdc-paginator .mat-mdc-paginator-outer-container{border-radius:0 0 8px 8px;font-weight:400;font-size:14px;line-height:16px;color:#000}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container{padding:0}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-select-value-text{font-size:14px}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-paginator-range-actions{height:100%}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-paginator-range-actions button{height:100%;width:70px;border-radius:0}\n"], dependencies: [{ kind: "component", type: MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: DeprecatedPaginatorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: DeprecatedPaginatorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ui-paginator', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatPaginator], template: "<mat-paginator\n  [length]=\"length\"\n  [pageSize]=\"defaultPageSize\"\n  [pageSizeOptions]=\"pageSizeOptions\"\n  (page)=\"paginatorChanged($event)\"\n>\n</mat-paginator>\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}.mat-mdc-paginator{--mat-paginator-disabled-icon-color: rgba(0, 0, 0, .12);border-radius:0 0 8px 8px}.mat-mdc-paginator .mat-mdc-paginator-outer-container{border-radius:0 0 8px 8px;font-weight:400;font-size:14px;line-height:16px;color:#000}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container{padding:0}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-select-value-text{font-size:14px}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-paginator-range-actions{height:100%}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-paginator-range-actions button{height:100%;width:70px;border-radius:0}\n"] }]
         }], ctorParameters: () => [], propDecorators: { length: [{
@@ -53,11 +53,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
             }] } });
 
 class DeprecatedPaginatorComponentModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: DeprecatedPaginatorComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.19", ngImport: i0, type: DeprecatedPaginatorComponentModule, imports: [CommonModule, MatPaginatorModule, DeprecatedPaginatorComponent], exports: [DeprecatedPaginatorComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: DeprecatedPaginatorComponentModule, imports: [CommonModule, MatPaginatorModule, DeprecatedPaginatorComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: DeprecatedPaginatorComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.18", ngImport: i0, type: DeprecatedPaginatorComponentModule, imports: [CommonModule, MatPaginatorModule, DeprecatedPaginatorComponent], exports: [DeprecatedPaginatorComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: DeprecatedPaginatorComponentModule, imports: [CommonModule, MatPaginatorModule, DeprecatedPaginatorComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: DeprecatedPaginatorComponentModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: DeprecatedPaginatorComponentModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, MatPaginatorModule, DeprecatedPaginatorComponent],

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@testgorilla/tgo-ui",
-  "version": "11.3.0",
+  "version": "11.5.0-beta.1",
   "license": "proprietary-license",
   "lint-staged": {
     "{projects,components}/**/*.ts": [

package/types/testgorilla-tgo-ui-components-badge.d.ts

@@ -21,7 +21,7 @@ declare enum BadgeColorEnum {
     BLUE_20 = "blue-20",
     BLUE_40 = "blue-40"
 }
-type RebrandBadgeColor = 'success' | 'warning' | 'negative' | 'info' | 'brand' | 'neutral' | 'blue-20' | 'blue-40' | 'pink-30' | 'blue-10' | 'grey-10' | 'grey-20' | 'grey-30';
+type RebrandBadgeColor = 'success' | 'warning' | 'negative' | 'info' | 'brand' | 'neutral' | 'blue-20' | 'blue-40' | 'pink-30' | 'pink-50' | 'blue-10' | 'grey-10' | 'grey-20' | 'grey-30';
 declare enum RebrandBadgeColorEnum {
     SUCCESS = "success",
     WARNING = "warning",
@@ -32,6 +32,7 @@ declare enum RebrandBadgeColorEnum {
     BLUE_40 = "blue-40",
     BLUE_20 = "blue-20",
     PINK_30 = "pink-30",
+    PINK_50 = "pink-50",
     BLUE_10 = "blue-10",
     GREY_30 = "grey-30",
     GREY_20 = "grey-20",

package/types/testgorilla-tgo-ui-components-dialog.d.ts

@@ -106,6 +106,16 @@ declare class DialogComponent implements OnInit, OnChanges, AfterViewInit {
      * @memberof DialogComponent
      */
     disablePrimaryButton: boolean;
+    /**
+     *
+     * Tooltip shown when hovering the primary button. Bound to a wrapper around the
+     * button so it also shows while the button is disabled (a disabled button
+     * receives no pointer events), e.g. to explain why the action is unavailable.
+     *
+     * @type {string}
+     * @memberof DialogComponent
+     */
+    primaryButtonTooltip: string;
     /**
      *
      * Disable close button
@@ -166,7 +176,7 @@ declare class DialogComponent implements OnInit, OnChanges, AfterViewInit {
     onSecondaryButtonClick(event: Event): void;
     onPrimaryButtonClick(event: Event): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DialogComponent, [{ optional: true; }, null, null]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DialogComponent, "ui-dialog", never, { "title": { "alias": "title"; "required": false; }; "showCloseButton": { "alias": "showCloseButton"; "required": false; }; "canCloseFn": { "alias": "canCloseFn"; "required": false; }; "secondaryButtonLabel": { "alias": "secondaryButtonLabel"; "required": false; }; "footerMessage": { "alias": "footerMessage"; "required": false; }; "primaryButtonLabel": { "alias": "primaryButtonLabel"; "required": false; }; "primaryButtonIconName": { "alias": "primaryButtonIconName"; "required": false; }; "secondaryButtonType": { "alias": "secondaryButtonType"; "required": false; }; "primaryButtonType": { "alias": "primaryButtonType"; "required": false; }; "primaryButtonDataTestId": { "alias": "primaryButtonDataTestId"; "required": false; }; "secondaryButtonDataTestId": { "alias": "secondaryButtonDataTestId"; "required": false; }; "companyColor": { "alias": "companyColor"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "disablePrimaryButton": { "alias": "disablePrimaryButton"; "required": false; }; "disableClose": { "alias": "disableClose"; "required": false; }; "shouldDisableButtons": { "alias": "shouldDisableButtons"; "required": false; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; }; "keyboardOpen": { "alias": "keyboardOpen"; "required": false; }; "primaryButtonIconPosition": { "alias": "primaryButtonIconPosition"; "required": false; "isSignal": true; }; }, { "closeEvent": "closeEvent"; "secondaryButtonClickEvent": "secondaryButtonClickEvent"; "primaryButtonClickEvent": "primaryButtonClickEvent"; }, ["customHeader"], ["[dialogHeader]", "*", "[dialogFooter]"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DialogComponent, "ui-dialog", never, { "title": { "alias": "title"; "required": false; }; "showCloseButton": { "alias": "showCloseButton"; "required": false; }; "canCloseFn": { "alias": "canCloseFn"; "required": false; }; "secondaryButtonLabel": { "alias": "secondaryButtonLabel"; "required": false; }; "footerMessage": { "alias": "footerMessage"; "required": false; }; "primaryButtonLabel": { "alias": "primaryButtonLabel"; "required": false; }; "primaryButtonIconName": { "alias": "primaryButtonIconName"; "required": false; }; "secondaryButtonType": { "alias": "secondaryButtonType"; "required": false; }; "primaryButtonType": { "alias": "primaryButtonType"; "required": false; }; "primaryButtonDataTestId": { "alias": "primaryButtonDataTestId"; "required": false; }; "secondaryButtonDataTestId": { "alias": "secondaryButtonDataTestId"; "required": false; }; "companyColor": { "alias": "companyColor"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "disablePrimaryButton": { "alias": "disablePrimaryButton"; "required": false; }; "primaryButtonTooltip": { "alias": "primaryButtonTooltip"; "required": false; }; "disableClose": { "alias": "disableClose"; "required": false; }; "shouldDisableButtons": { "alias": "shouldDisableButtons"; "required": false; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; }; "keyboardOpen": { "alias": "keyboardOpen"; "required": false; }; "primaryButtonIconPosition": { "alias": "primaryButtonIconPosition"; "required": false; "isSignal": true; }; }, { "closeEvent": "closeEvent"; "secondaryButtonClickEvent": "secondaryButtonClickEvent"; "primaryButtonClickEvent": "primaryButtonClickEvent"; }, ["customHeader"], ["[dialogHeader]", "*", "[dialogFooter]"], true, never>;
 }
 
 declare class DialogComponentModule {

package/types/testgorilla-tgo-ui-components-inline-field.d.ts

@@ -1,4 +1,5 @@
-import * as ______dist_tgo_ui_types_testgorilla_tgo_ui_components_icon from '../../dist/tgo-ui/types/testgorilla-tgo-ui-components-icon';
+import * as _testgorilla_tgo_ui_components_icon from '@testgorilla/tgo-ui/components/icon';
+import { IconName } from '@testgorilla/tgo-ui/components/icon';
 import * as _angular_core from '@angular/core';
 import { EventEmitter, OnInit, ChangeDetectorRef, DestroyRef, ElementRef } from '@angular/core';
 import * as i2 from '@angular/forms';
@@ -7,8 +8,6 @@ import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
 export { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
 import * as i5 from '@testgorilla/tgo-ui/components/field';
 import { FieldType, FieldComponent } from '@testgorilla/tgo-ui/components/field';
-import * as i6 from '@testgorilla/tgo-ui/components/icon';
-import { IconName } from '@testgorilla/tgo-ui/components/icon';
 import * as i1 from '@angular/common';
 import * as i3 from '@angular/material/input';
 import * as i4 from '@testgorilla/tgo-ui/components/button';
@@ -219,14 +218,14 @@ declare class InlineFieldComponent implements OnInit, ControlValueAccessor {
     state: _angular_core.Signal<InlineFieldState>;
     saveButtonConfig: _angular_core.Signal<{
         label: string;
-        iconName: ______dist_tgo_ui_types_testgorilla_tgo_ui_components_icon.IconName;
+        iconName: _testgorilla_tgo_ui_components_icon.IconName;
         variant: "secondary-inverted";
         size: "small";
         disabled: boolean;
     }>;
     cancelButtonConfig: _angular_core.Signal<{
         label: string;
-        iconName: ______dist_tgo_ui_types_testgorilla_tgo_ui_components_icon.IconName;
+        iconName: _testgorilla_tgo_ui_components_icon.IconName;
         variant: "secondary-inverted";
         size: "small";
         disabled: boolean;
@@ -264,7 +263,7 @@ declare class InlineFieldComponent implements OnInit, ControlValueAccessor {
 
 declare class InlineFieldComponentModule {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<InlineFieldComponentModule, never>;
-    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<InlineFieldComponentModule, never, [typeof i1.CommonModule, typeof i2.FormsModule, typeof i2.ReactiveFormsModule, typeof i3.MatInputModule, typeof i4.ButtonComponentModule, typeof i5.FieldComponentModule, typeof i6.IconComponentModule, typeof InlineFieldComponent], [typeof InlineFieldComponent]>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<InlineFieldComponentModule, never, [typeof i1.CommonModule, typeof i2.FormsModule, typeof i2.ReactiveFormsModule, typeof i3.MatInputModule, typeof i4.ButtonComponentModule, typeof i5.FieldComponentModule, typeof _testgorilla_tgo_ui_components_icon.IconComponentModule, typeof InlineFieldComponent], [typeof InlineFieldComponent]>;
     static ɵinj: _angular_core.ɵɵInjectorDeclaration<InlineFieldComponentModule>;
 }
 

package/types/testgorilla-tgo-ui-components-popover.d.ts

@@ -1,6 +1,7 @@
 import * as _angular_core from '@angular/core';
 import { OnInit, OnDestroy, TemplateRef } from '@angular/core';
 import { HorizontalConnectionPos } from '@angular/cdk/overlay';
+import { CardSize } from '@testgorilla/tgo-ui/components/card';
 
 declare class PopoverDirective implements OnInit, OnDestroy {
     uiPopover: _angular_core.InputSignal<TemplateRef<unknown>>;
@@ -8,6 +9,7 @@ declare class PopoverDirective implements OnInit, OnDestroy {
     popoverAlign: _angular_core.InputSignal<HorizontalConnectionPos>;
     popoverOpen: _angular_core.InputSignal<boolean>;
     popoverCard: _angular_core.InputSignal<boolean>;
+    popoverCardSize: _angular_core.InputSignal<CardSize>;
     uiPopoverDisabled: _angular_core.InputSignal<boolean>;
     private readonly overlay;
     private readonly elementRef;
@@ -29,7 +31,7 @@ declare class PopoverDirective implements OnInit, OnDestroy {
     ngOnInit(): void;
     ngOnDestroy(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<PopoverDirective, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<PopoverDirective, "[uiPopover]", never, { "uiPopover": { "alias": "uiPopover"; "required": true; "isSignal": true; }; "popoverOffset": { "alias": "popoverOffset"; "required": false; "isSignal": true; }; "popoverAlign": { "alias": "popoverAlign"; "required": false; "isSignal": true; }; "popoverOpen": { "alias": "popoverOpen"; "required": false; "isSignal": true; }; "popoverCard": { "alias": "popoverCard"; "required": false; "isSignal": true; }; "uiPopoverDisabled": { "alias": "uiPopoverDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<PopoverDirective, "[uiPopover]", never, { "uiPopover": { "alias": "uiPopover"; "required": true; "isSignal": true; }; "popoverOffset": { "alias": "popoverOffset"; "required": false; "isSignal": true; }; "popoverAlign": { "alias": "popoverAlign"; "required": false; "isSignal": true; }; "popoverOpen": { "alias": "popoverOpen"; "required": false; "isSignal": true; }; "popoverCard": { "alias": "popoverCard"; "required": false; "isSignal": true; }; "popoverCardSize": { "alias": "popoverCardSize"; "required": false; "isSignal": true; }; "uiPopoverDisabled": { "alias": "uiPopoverDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 export { PopoverDirective };

package/types/testgorilla-tgo-ui-components-segmented-toggle.d.ts

@@ -1,7 +1,9 @@
 import * as _angular_core from '@angular/core';
+import { TooltipPosition } from '@angular/material/tooltip';
 import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
 export { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
 import { IconName } from '@testgorilla/tgo-ui/components/icon';
+import { TooltipPositionType } from '@testgorilla/tgo-ui/components/tooltip';
 
 interface SegmentedToggleOption<T> {
     value: T;
@@ -23,6 +25,13 @@ interface SegmentedToggleOption<T> {
      * any non-brand option shows the neutral pill.
      */
     brand?: boolean;
+    /** Optional tooltip text shown when hovering or focusing this segment. */
+    tooltip?: string;
+    /**
+     * Position of the tooltip relative to the segment. Only relevant when
+     * `tooltip` is set. Defaults to `TooltipPositionType.TOP`.
+     */
+    tooltipPosition?: TooltipPositionType;
 }
 
 declare class SegmentedToggleComponent<T> {
@@ -58,6 +67,8 @@ declare class SegmentedToggleComponent<T> {
      * the button and this returns `null` (no `aria-label` attribute).
      */
     protected fallbackAriaLabel(option: SegmentedToggleOption<T>): string | null;
+    /** Maps the option's Canopy tooltip position (default TOP) to the MatTooltip position. */
+    protected tooltipPosition(option: SegmentedToggleOption<T>): TooltipPosition;
     /** Reads the active button's box and writes it to the indicator signals. */
     private measureIndicator;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SegmentedToggleComponent<any>, never>;