@testgorilla/tgo-ui 5.2.4 → 6.0.0

package/components/ai-audio-circle/ai-audio-circle.component.d.ts

@@ -11,6 +11,7 @@ export declare class AiAudioCircleComponent implements OnDestroy, AfterViewInit
     candidateAudioTrack: import("@angular/core").InputSignal<MediaStreamTrack | undefined>;
     state: import("@angular/core").ModelSignal<InterviewState>;
     canvasSize: import("@angular/core").InputSignal<number>;
+    animated: import("@angular/core").InputSignal<boolean>;
     isSpeaking: WritableSignal<boolean>;
     scaleValue: WritableSignal<number>;
     audioContext?: AudioContext;
@@ -55,5 +56,5 @@ export declare class AiAudioCircleComponent implements OnDestroy, AfterViewInit
     private cleanup;
     ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<AiAudioCircleComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<AiAudioCircleComponent, "ui-ai-audio-circle", never, { "audioTrack": { "alias": "audioTrack"; "required": false; "isSignal": true; }; "candidateAudioTrack": { "alias": "candidateAudioTrack"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; "canvasSize": { "alias": "canvasSize"; "required": false; "isSignal": true; }; }, { "state": "stateChange"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AiAudioCircleComponent, "ui-ai-audio-circle", never, { "audioTrack": { "alias": "audioTrack"; "required": false; "isSignal": true; }; "candidateAudioTrack": { "alias": "candidateAudioTrack"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; "canvasSize": { "alias": "canvasSize"; "required": false; "isSignal": true; }; "animated": { "alias": "animated"; "required": false; "isSignal": true; }; }, { "state": "stateChange"; }, never, never, false, never>;
 }

package/components/alert-banner/alert-banner.component.d.ts

@@ -1,5 +1,4 @@
 import { OnChanges, OnInit, SimpleChanges } from '@angular/core';
-import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 import { IconName } from '@testgorilla/tgo-ui/components/icon';
 import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
 import { AlertBarType, AlertVariant } from '@testgorilla/tgo-ui/components/core';
@@ -7,8 +6,7 @@ import { LinkTargetType } from './alert-banner.model';
 import * as i0 from "@angular/core";
 export declare class AlertBannerComponent implements OnInit, OnChanges {
     private readonly defaultAppTheme;
-    private domSanitizer;
-    constructor(defaultAppTheme: ApplicationTheme, domSanitizer: DomSanitizer);
+    constructor(defaultAppTheme: ApplicationTheme);
     /**
      * Alert Banner type
      *
@@ -30,7 +28,7 @@ export declare class AlertBannerComponent implements OnInit, OnChanges {
      *
      * @memberof AlertBannerComponent
      */
-    set message(msg: string);
+    message: string;
     /**
      * Include dismmiss button
      *
@@ -113,20 +111,18 @@ export declare class AlertBannerComponent implements OnInit, OnChanges {
      * @memberof AlertBannerComponent
      */
     ariaDescribedby: string;
-    set secondaryAlerts(alerts: string[]);
+    secondaryAlerts: string[];
     get isDismissed(): boolean;
     iconName: IconName;
     visible: boolean;
     fullWidth: boolean;
     position: string;
     cssClass: string;
-    _message: SafeHtml;
-    _secondaryAlerts: SafeHtml[];
     dismissAlertBanner: boolean;
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     private updateBanner;
     dismissClick(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<AlertBannerComponent, [{ optional: true; }, null]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AlertBannerComponent, [{ optional: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<AlertBannerComponent, "ui-alert-banner", never, { "alertType": { "alias": "alertType"; "required": false; }; "alertVariant": { "alias": "alertVariant"; "required": false; }; "message": { "alias": "message"; "required": false; }; "includeDismissButton": { "alias": "includeDismissButton"; "required": false; }; "shadow": { "alias": "shadow"; "required": false; }; "linkText": { "alias": "linkText"; "required": false; }; "linkUrl": { "alias": "linkUrl"; "required": false; }; "linkTarget": { "alias": "linkTarget"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "isFullWidth": { "alias": "isFullWidth"; "required": false; }; "closeButtonTooltip": { "alias": "closeButtonTooltip"; "required": false; }; "hasIcon": { "alias": "hasIcon"; "required": false; }; "fixed": { "alias": "fixed"; "required": false; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; }; "secondaryAlerts": { "alias": "secondaryAlerts"; "required": false; }; }, {}, never, never, false, never>;
 }

package/components/autocomplete/autocomplete.component.d.ts

@@ -3,7 +3,6 @@ import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
 import { AfterViewInit, ChangeDetectorRef, DestroyRef, DoCheck, ElementRef, EventEmitter, NgZone, OnChanges, OnDestroy, SimpleChanges } from '@angular/core';
 import { ControlValueAccessor, NgControl } from '@angular/forms';
 import { MatAutocomplete, MatAutocompleteSelectedEvent, MatAutocompleteTrigger } from '@angular/material/autocomplete';
-import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 import { BehaviorSubject, ReplaySubject, Subscription } from 'rxjs';
 import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
 import { AutocompleteUtils } from '@testgorilla/tgo-ui/components/core';
@@ -12,7 +11,6 @@ import * as i0 from "@angular/core";
 export declare class AutocompleteComponent implements ControlValueAccessor, OnChanges, AfterViewInit, DoCheck, OnDestroy {
     private readonly defaultAppTheme;
     private readonly cdr;
-    private readonly domSanitizer;
     ngControl: NgControl;
     private readonly platformId;
     private readonly el;
@@ -253,7 +251,7 @@ export declare class AutocompleteComponent implements ControlValueAccessor, OnCh
     set cdkVirtualScrollViewport(viewport: CdkVirtualScrollViewport);
     matAutocomplete: MatAutocomplete;
     matInput: ElementRef<HTMLInputElement>;
-    protected safeErrors: SafeHtml[];
+    protected safeErrors: string[];
     protected value: any;
     protected inputValue: any;
     protected isInputFocus: boolean;
@@ -279,7 +277,7 @@ export declare class AutocompleteComponent implements ControlValueAccessor, OnCh
     private observer;
     protected keyboardFocused: import("@angular/core").WritableSignal<boolean>;
     isAlreadyAdded: boolean;
-    constructor(defaultAppTheme: ApplicationTheme, cdr: ChangeDetectorRef, domSanitizer: DomSanitizer, ngControl: NgControl, platformId: any, el: ElementRef, focusMonitor: FocusMonitor, destroyRef: DestroyRef, ngZone: NgZone);
+    constructor(defaultAppTheme: ApplicationTheme, cdr: ChangeDetectorRef, ngControl: NgControl, platformId: any, el: ElementRef, focusMonitor: FocusMonitor, destroyRef: DestroyRef, ngZone: NgZone);
     ngOnInit(): void;
     /**
      * Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched or errors
@@ -311,7 +309,7 @@ export declare class AutocompleteComponent implements ControlValueAccessor, OnCh
     protected get isDropdown(): boolean;
     protected onChevronClick(autocomplete: MatAutocomplete): void;
     protected get inputWidth(): number;
-    protected trackByFn: (index: number, value: any) => any;
+    protected trackByFn: (index: number, value: string) => string;
     /**
      * Adding company color variable to the body to style overlay container that's out of the component scope.
      */
@@ -320,7 +318,7 @@ export declare class AutocompleteComponent implements ControlValueAccessor, OnCh
     protected get hasObjectValue(): boolean;
     onKeydown($event: KeyboardEvent): void;
     protected getVirtualScrollHeight(itemCount: number): number;
-    static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteComponent, [{ optional: true; }, null, null, { optional: true; self: true; }, null, null, null, null, null]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteComponent, [{ optional: true; }, null, { optional: true; self: true; }, null, null, null, null, null]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<AutocompleteComponent, "ui-autocomplete", never, { "itemsList": { "alias": "itemsList"; "required": false; }; "suggestionsList": { "alias": "suggestionsList"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "allowAdd": { "alias": "allowAdd"; "required": false; }; "textField": { "alias": "textField"; "required": false; }; "valueField": { "alias": "valueField"; "required": false; }; "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "itemValue": { "alias": "itemValue"; "required": false; }; "type": { "alias": "type"; "required": false; }; "minCharactersSearch": { "alias": "minCharactersSearch"; "required": false; }; "variant": { "alias": "variant"; "required": true; }; "showBottomContent": { "alias": "showBottomContent"; "required": false; }; "valuePrimitive": { "alias": "valuePrimitive"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "required": { "alias": "required"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "companyColor": { "alias": "companyColor"; "required": false; }; "hideBuiltInErrors": { "alias": "hideBuiltInErrors"; "required": false; }; "hideLabelInErrors": { "alias": "hideLabelInErrors"; "required": false; }; "virtualScroll": { "alias": "virtualScroll"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; }; "dropdownPanelClass": { "alias": "dropdownPanelClass"; "required": false; }; "closeOnScroll": { "alias": "closeOnScroll"; "required": false; }; "size": { "alias": "size"; "required": false; }; "allowUserInput": { "alias": "allowUserInput"; "required": false; }; "clearable": { "alias": "clearable"; "required": false; }; "exactMatchSelect": { "alias": "exactMatchSelect"; "required": false; }; "maxItemSelected": { "alias": "maxItemSelected"; "required": false; }; "maxLength": { "alias": "maxLength"; "required": false; }; "isDynamicFilteringEnabled": { "alias": "isDynamicFilteringEnabled"; "required": false; }; "dynamicFilterLoading": { "alias": "dynamicFilterLoading"; "required": false; }; "dynamicFilteredList": { "alias": "dynamicFilteredList"; "required": false; }; "infiniteScroll": { "alias": "infiniteScroll"; "required": false; }; "hasMoreOptionsForInfiniteScroll": { "alias": "hasMoreOptionsForInfiniteScroll"; "required": false; }; }, { "selectionChange": "selectionChange"; "searchTextChange": "searchTextChange"; "blur": "blur"; "focus": "focus"; "scrollViewportBottomReached": "scrollViewportBottomReached"; "scrollViewportBottomReachedFiltered": "scrollViewportBottomReachedFiltered"; }, never, never, false, never>;
     static ngAcceptInputType_virtualScroll: unknown;
 }

package/components/card/card.component.d.ts

@@ -1,12 +1,10 @@
 import { EventEmitter, OnChanges, OnInit } from '@angular/core';
-import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
 import { IconSize } from '@testgorilla/tgo-ui/components/icon';
-import { CardSize, CardVariant } from './card.model';
+import { CardSize, CardSizeVariant, CardVariant } from './card.model';
 import * as i0 from "@angular/core";
 export declare class CardComponent implements OnChanges, OnInit {
     private readonly defaultAppTheme;
-    private domSanitizer;
     /**
      * Card size. Defaults "medium".
      *
@@ -14,6 +12,13 @@ export declare class CardComponent implements OnChanges, OnInit {
      * @memberof CardComponent
      */
     size: CardSize;
+    /**
+     * Card size variant. Defaults "default".
+     *
+     * @type {CardSizeVariant}
+     * @memberof CardComponent
+     */
+    sizeVariant: CardSizeVariant;
     /**
      * Card variants. Defaults "default".
      *
@@ -68,15 +73,15 @@ export declare class CardComponent implements OnChanges, OnInit {
      * Emits when card is being selected
      */
     cardSelected: EventEmitter<boolean>;
-    safeErrors: SafeHtml[];
+    safeErrors: string[];
     classes: string;
-    constructor(defaultAppTheme: ApplicationTheme, domSanitizer: DomSanitizer);
+    constructor(defaultAppTheme: ApplicationTheme);
     ngOnChanges(): void;
     ngOnInit(): void;
     get cardVariant(): CardVariant;
     get errorIconSize(): IconSize;
     get isSelected(): boolean;
     selectCard(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<CardComponent, [{ optional: true; }, null]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CardComponent, "ui-card", never, { "size": { "alias": "size"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "errorsSize": { "alias": "errorsSize"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "allowSelect": { "alias": "allowSelect"; "required": false; }; "allowFocus": { "alias": "allowFocus"; "required": false; }; }, { "cardSelected": "cardSelected"; }, never, ["*"], false, never>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CardComponent, [{ optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CardComponent, "ui-card", never, { "size": { "alias": "size"; "required": false; }; "sizeVariant": { "alias": "sizeVariant"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "errorsSize": { "alias": "errorsSize"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "allowSelect": { "alias": "allowSelect"; "required": false; }; "allowFocus": { "alias": "allowFocus"; "required": false; }; }, { "cardSelected": "cardSelected"; }, never, ["*"], false, never>;
 }

package/components/card/card.model.d.ts

@@ -1,2 +1,3 @@
 export type CardSize = 'small' | 'medium' | 'large';
+export type CardSizeVariant = 'regular' | 'condensed';
 export type CardVariant = 'default' | 'shadow' | 'state' | 'error' | 'educative' | 'premium' | 'ai' | 'actionDriver' | 'neutral' | 'neutral-state';

package/components/checklist/checklist.component.d.ts

@@ -4,7 +4,6 @@ import type { ChecklistItem } from './checklist.model';
 import * as i0 from "@angular/core";
 export declare class ChecklistComponent {
     private readonly defaultAppTheme;
-    private readonly domSanitizer;
     /**
      * Label for the checklist
      * @type {string}
@@ -16,7 +15,7 @@ export declare class ChecklistComponent {
      * @type {string}
      * @memberof ChecklistComponent
      */
-    description: import("@angular/core").InputSignalWithTransform<import("@angular/platform-browser").SafeHtml | null, string>;
+    description: import("@angular/core").InputSignal<string | null>;
     /**
      * Items for the checklist
      * @type {ModelSignal<ChecklistItem[]>}

package/components/datepicker/datepicker.component.d.ts

@@ -2,13 +2,11 @@ import { ChangeDetectorRef, DoCheck, EventEmitter, OnChanges, SimpleChanges, OnI
 import { ControlValueAccessor, FormControl, FormGroup, NgControl } from '@angular/forms';
 import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
 import { MatDatepicker } from '@angular/material/datepicker';
-import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 import { DatepickerService } from './datepicker.service';
 import * as i0 from "@angular/core";
 export declare class DatepickerComponent implements OnChanges, ControlValueAccessor, DoCheck, OnInit {
     private readonly defaultAppTheme;
     private cdr;
-    private sanitizer;
     ngControl: NgControl;
     private datepickerService;
     class: string;
@@ -47,7 +45,7 @@ export declare class DatepickerComponent implements OnChanges, ControlValueAcces
      * @memberof DatepickerComponent
      */
     value?: Array<Date | null> | Date;
-    _errors: SafeHtml[];
+    _errors: string[];
     /**
      * Input field errors
      *
@@ -210,7 +208,7 @@ export declare class DatepickerComponent implements OnChanges, ControlValueAcces
     }>;
     errorsLength: boolean;
     protected translationContext: string;
-    constructor(defaultAppTheme: ApplicationTheme, cdr: ChangeDetectorRef, sanitizer: DomSanitizer, ngControl: NgControl, datepickerService: DatepickerService);
+    constructor(defaultAppTheme: ApplicationTheme, cdr: ChangeDetectorRef, ngControl: NgControl, datepickerService: DatepickerService);
     get hint(): string;
     /**
      * Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched or errors
@@ -232,6 +230,6 @@ export declare class DatepickerComponent implements OnChanges, ControlValueAcces
     private setRange;
     onInput(event: Event): void;
     private setStyleVariable;
-    static ɵfac: i0.ɵɵFactoryDeclaration<DatepickerComponent, [{ optional: true; }, null, null, { optional: true; self: true; }, null]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DatepickerComponent, [{ optional: true; }, null, { optional: true; self: true; }, null]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DatepickerComponent, "ui-datepicker", never, { "label": { "alias": "label"; "required": false; }; "fieldName": { "alias": "fieldName"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "id": { "alias": "id"; "required": false; }; "value": { "alias": "value"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "isRange": { "alias": "isRange"; "required": false; }; "setSingleDateRangeOnBlur": { "alias": "setSingleDateRangeOnBlur"; "required": false; }; "showInnerErrors": { "alias": "showInnerErrors"; "required": false; }; "innerErrorsMessage": { "alias": "innerErrorsMessage"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "hintMessage": { "alias": "hintMessage"; "required": false; }; "updateOnBlur": { "alias": "updateOnBlur"; "required": false; }; "showBottomContent": { "alias": "showBottomContent"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "minDate": { "alias": "minDate"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; "monthPicker": { "alias": "monthPicker"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "hideBuiltInErrors": { "alias": "hideBuiltInErrors"; "required": false; }; "hideLabelInErrors": { "alias": "hideLabelInErrors"; "required": false; }; "preventUserInput": { "alias": "preventUserInput"; "required": false; }; "companyColor": { "alias": "companyColor"; "required": false; }; "browserTimezone": { "alias": "browserTimezone"; "required": false; }; }, { "changed": "changed"; }, never, never, false, never>;
 }

package/components/dialog/confirm-dialog/confirm-dialog.component.d.ts

@@ -1,5 +1,4 @@
 import { MatDialogRef } from '@angular/material/dialog';
-import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
 import { ButtonColor, ButtonIconPosition } from '@testgorilla/tgo-ui/components/button';
 import { IconName } from '@testgorilla/tgo-ui/components/icon';
@@ -9,13 +8,12 @@ export declare class ConfirmDialogComponent {
     private readonly defaultAppTheme;
     dialogRef: MatDialogRef<ConfirmDialogComponent>;
     private data;
-    protected domSanitizer: DomSanitizer;
     confirmMessage: string | undefined;
     confirmButtonText: string | undefined;
     cancelButtonText: string | undefined;
     title: string | undefined;
     lang: import("@testgorilla/tgo-ui/components/core").Language;
-    confirmMessageHtml: SafeHtml | undefined;
+    confirmMessageHtml: string | undefined;
     showCloseButton: boolean;
     showSecondaryButton: boolean;
     color: string | null;
@@ -33,8 +31,8 @@ export declare class ConfirmDialogComponent {
      * @memberof DialogComponent
      */
     applicationTheme: ApplicationTheme;
-    constructor(defaultAppTheme: ApplicationTheme, dialogRef: MatDialogRef<ConfirmDialogComponent>, data: ConfirmDialogData, domSanitizer: DomSanitizer);
+    constructor(defaultAppTheme: ApplicationTheme, dialogRef: MatDialogRef<ConfirmDialogComponent>, data: ConfirmDialogData);
     onConfirm(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ConfirmDialogComponent, [{ optional: true; }, null, null, null]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ConfirmDialogComponent, [{ optional: true; }, null, null]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ConfirmDialogComponent, "ui-confirm-dialog", never, { "applicationTheme": { "alias": "applicationTheme"; "required": false; }; }, {}, never, never, false, never>;
 }

package/components/empty-state/empty-state.component.d.ts

@@ -1,5 +1,4 @@
 import { EventEmitter } from '@angular/core';
-import { SafeHtml } from '@angular/platform-browser';
 import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
 import { ButtonColor, ButtonIconPosition, ButtonSize } from '@testgorilla/tgo-ui/components/button';
 import { IconName } from '@testgorilla/tgo-ui/components/icon';
@@ -7,8 +6,6 @@ import { ButtonVariant, EmptyStateVariant, IllustrationVariant } from './empty-s
 import * as i0 from "@angular/core";
 export declare class EmptyStateComponent {
     private readonly defaultAppTheme;
-    private domSanitizer;
-    safeBodyText: SafeHtml;
     /**
      * @description If the default image should be displayed.
      * @type {boolean}
@@ -44,7 +41,7 @@ export declare class EmptyStateComponent {
      * @type {string}
      * @memberof EmptyStateComponent
      */
-    set bodyText(value: string);
+    bodyText: string;
     /**
      * @description Displays primary button if passed.
      * @type {string}

package/components/field/field.component.d.ts

@@ -2,7 +2,7 @@ import { FocusMonitor } from '@angular/cdk/a11y';
 import { AfterViewInit, ChangeDetectorRef, DestroyRef, DoCheck, ElementRef, EventEmitter, NgZone, OnInit } from '@angular/core';
 import { ControlValueAccessor, NgControl } from '@angular/forms';
 import { MatIconRegistry } from '@angular/material/icon';
-import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
+import { DomSanitizer } from '@angular/platform-browser';
 import { CdkTextareaAutosize } from '@angular/cdk/text-field';
 import { FieldType } from './field.model';
 import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
@@ -54,7 +54,7 @@ export declare class FieldComponent implements OnInit, ControlValueAccessor, DoC
      *
      * @memberof FieldComponent
      */
-    labelHtml: import("@angular/core").InputSignalWithTransform<SafeHtml | null, string>;
+    labelHtml: import("@angular/core").InputSignal<string | null>;
     /**
      * Icon to display alongside the label
      *
@@ -97,7 +97,7 @@ export declare class FieldComponent implements OnInit, ControlValueAccessor, DoC
      * @memberof FieldComponent
      */
     badgeVariant?: BadgeVariant | undefined;
-    _errors: SafeHtml[];
+    _errors: string[];
     /**
      * Input field errors
      *
@@ -368,7 +368,7 @@ export declare class FieldComponent implements OnInit, ControlValueAccessor, DoC
     onSubmit(): void;
     private clearSpace;
     onBlur(): void;
-    trackByFn: (index: number, value: any) => any;
+    trackByFn: (index: number, value: string) => string;
     focus(): void;
     refocusPasswordButton(btn: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<FieldComponent, [{ optional: true; }, null, null, null, { optional: true; self: true; }, null, null, null]>;

package/components/media-dialog/media-dialog.component.d.ts

@@ -1,12 +1,10 @@
 import { TemplateRef } from '@angular/core';
 import { MatDialogRef } from '@angular/material/dialog';
-import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 import { MediaDialogData, MediaDialogStep } from './media-dialog.model';
 import * as i0 from "@angular/core";
 export declare class MediaDialogComponent {
     dialogRef: MatDialogRef<MediaDialogComponent>;
     private data;
-    protected domSanitizer: DomSanitizer;
     primaryButtonLabel: string | undefined;
     secondaryButtonLabel: string | undefined;
     backButtonLabel: string | undefined;
@@ -16,10 +14,10 @@ export declare class MediaDialogComponent {
     backButtonDataTestId: string;
     mediaContainer: TemplateRef<any>;
     subheader: string | undefined;
-    body: SafeHtml;
+    body: string;
     currentStepIndex: number;
     steps: MediaDialogStep[];
-    constructor(dialogRef: MatDialogRef<MediaDialogComponent>, data: MediaDialogData, domSanitizer: DomSanitizer);
+    constructor(dialogRef: MatDialogRef<MediaDialogComponent>, data: MediaDialogData);
     private setStep;
     onPrimaryButtonClick(): void;
     onBackButtonClick(): void;

package/components/phone-input/phone-input.component.d.ts

@@ -3,7 +3,6 @@ import { ChangeDetectorRef, DoCheck, ElementRef, OnDestroy, OnInit } from '@angu
 import { ControlValueAccessor, NgControl, UntypedFormBuilder, UntypedFormControl, UntypedFormGroup } from '@angular/forms';
 import { ErrorStateMatcher } from '@angular/material/core';
 import { BehaviorSubject, Observable, Subject } from 'rxjs';
-import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
 import { UICountry } from './phone-input.model';
 import * as i0 from "@angular/core";
@@ -13,7 +12,6 @@ export declare class PhoneInputComponent implements OnInit, OnDestroy, ControlVa
     private fb;
     private focusMonitor;
     private ref;
-    private sanitizer;
     private readonly defaultAppTheme;
     /**
      * Phone number
@@ -65,7 +63,7 @@ export declare class PhoneInputComponent implements OnInit, OnDestroy, ControlVa
      * @memberof PhoneInputComponent
      */
     fullWidth: boolean;
-    _errors: SafeHtml[];
+    _errors: string[];
     /**
      * Input field errors
      *
@@ -114,7 +112,7 @@ export declare class PhoneInputComponent implements OnInit, OnDestroy, ControlVa
     private internalPlaceholder;
     protected selectedCountry: UICountry;
     private unsubscribeAll$;
-    constructor(ngControl: NgControl, errorMatcher: ErrorStateMatcher, fb: UntypedFormBuilder, focusMonitor: FocusMonitor, ref: ChangeDetectorRef, sanitizer: DomSanitizer, defaultAppTheme: ApplicationTheme);
+    constructor(ngControl: NgControl, errorMatcher: ErrorStateMatcher, fb: UntypedFormBuilder, focusMonitor: FocusMonitor, ref: ChangeDetectorRef, defaultAppTheme: ApplicationTheme);
     /**
      * Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched or errors
      * to display validation errors that might happen (e.g. required)
@@ -141,7 +139,7 @@ export declare class PhoneInputComponent implements OnInit, OnDestroy, ControlVa
     private getCountryByCallingCode;
     private loadCountries;
     disableClick(ev: Event): void;
-    trackByFn: (index: number, value: any) => any;
-    static ɵfac: i0.ɵɵFactoryDeclaration<PhoneInputComponent, [{ optional: true; self: true; }, null, null, null, null, null, { optional: true; }]>;
+    trackByFn: (index: number, value: string) => string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PhoneInputComponent, [{ optional: true; self: true; }, null, null, null, null, { optional: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<PhoneInputComponent, "ui-phone-input", never, { "value": { "alias": "value"; "required": false; }; "countryList": { "alias": "countryList"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "errors": { "alias": "errors"; "required": false; }; "hideBuiltInErrors": { "alias": "hideBuiltInErrors"; "required": false; }; "hideLabelInErrors": { "alias": "hideLabelInErrors"; "required": false; }; }, {}, never, never, false, never>;
 }

package/components/snackbar/snackbar.component.d.ts

@@ -4,13 +4,11 @@ import { IconName } from '@testgorilla/tgo-ui/components/icon';
 import { SnackbarLink, SnackbarType, SnackbarVariant } from './snackbar.model';
 import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
 import { LinkTargetType } from '@testgorilla/tgo-ui/components/alert-banner';
-import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 import * as i0 from "@angular/core";
 export declare class SnackbarComponent implements OnInit {
     private readonly defaultAppTheme;
     private data;
     private snackbarRef;
-    private domSanitizer;
     /**
      * Background color of the button while in active state
      *
@@ -104,7 +102,7 @@ export declare class SnackbarComponent implements OnInit {
     timerStartedAt: number;
     timerPausedAt: number;
     position: string;
-    safeHtml: SafeHtml;
+    safeHtml: string;
     translationContext: string;
     protected readonly maxCharacters = 70;
     constructor(defaultAppTheme: ApplicationTheme, data: {
@@ -114,7 +112,7 @@ export declare class SnackbarComponent implements OnInit {
         applicationTheme?: ApplicationTheme;
         html?: string;
         seconds?: number;
-    }, snackbarRef: MatSnackBarRef<SnackbarComponent>, domSanitizer: DomSanitizer);
+    }, snackbarRef: MatSnackBarRef<SnackbarComponent>);
     ngOnInit(): void;
     show(): void;
     hide(): void;
@@ -123,6 +121,6 @@ export declare class SnackbarComponent implements OnInit {
     dismissClick(): void;
     onLinkClick(event: Event): void;
     private dismissSnackbar;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SnackbarComponent, [{ optional: true; }, null, null, null]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SnackbarComponent, [{ optional: true; }, null, null]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<SnackbarComponent, "ui-snackbar", never, { "snackbarType": { "alias": "snackbarType"; "required": false; }; "message": { "alias": "message"; "required": false; }; "html": { "alias": "html"; "required": false; }; "seconds": { "alias": "seconds"; "required": false; }; "includeDismissButton": { "alias": "includeDismissButton"; "required": false; }; "fixed": { "alias": "fixed"; "required": false; }; "linkText": { "alias": "linkText"; "required": false; }; "linkUrl": { "alias": "linkUrl"; "required": false; }; "linkTarget": { "alias": "linkTarget"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "closeButtonTooltip": { "alias": "closeButtonTooltip"; "required": false; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; }; }, {}, never, never, false, never>;
 }

package/fesm2022/testgorilla-tgo-ui-components-ai-audio-circle.mjs

@@ -15,6 +15,7 @@ class AiAudioCircleComponent {
         this.candidateAudioTrack = input();
         this.state = model(InterviewState.AiListening);
         this.canvasSize = input(280);
+        this.animated = input(true);
         this.isSpeaking = signal(false);
         this.scaleValue = signal(1);
         this.currentAmp = 0.02;
@@ -78,15 +79,18 @@ class AiAudioCircleComponent {
             { color: Color.BRAND_20, opacity: 0.6 },
             { color: Color.INFORMATIVE_30, opacity: 0.65 },
         ];
+        // Use deterministic seed values when not animated for stable visual tests
+        const seedVelocities = [0.12, -0.08, 0.15, -0.1, 0.06];
+        const seedRadii = [0.72, 0.65, 0.8, 0.68, 0.76];
         this.blobs = colors.map((c, i) => {
             const angle = (i / colors.length) * Math.PI * 2;
             const dist = baseRadius * 0.25;
             return {
                 x: centerX + Math.cos(angle) * dist,
                 y: centerY + Math.sin(angle) * dist,
-                vx: (Math.random() - 0.5) * 0.4,
-                vy: (Math.random() - 0.5) * 0.4,
-                radius: baseRadius * (0.6 + Math.random() * 0.4),
+                vx: this.animated() ? (Math.random() - 0.5) * 0.4 : seedVelocities[i],
+                vy: this.animated() ? (Math.random() - 0.5) * 0.4 : seedVelocities[(i + 2) % 5],
+                radius: baseRadius * (this.animated() ? 0.6 + Math.random() * 0.4 : seedRadii[i]),
                 color: c.color,
                 opacity: c.opacity,
             };
@@ -189,6 +193,11 @@ class AiAudioCircleComponent {
     startAnimations() {
         this.animatePulse = this.animatePulse.bind(this);
         this.mainLoop = this.mainLoop.bind(this);
+        if (!this.animated()) {
+            // Render a single static frame for deterministic visual tests
+            this.animatePulse();
+            return;
+        }
         this.animatePulse();
         this.mainLoop();
     }
@@ -345,7 +354,9 @@ class AiAudioCircleComponent {
         ctx.fillStyle = highlightGradient;
         ctx.fill();
         ctx.restore();
-        this.pulseAnimationId = requestAnimationFrame(this.animatePulse);
+        if (this.animated()) {
+            this.pulseAnimationId = requestAnimationFrame(this.animatePulse);
+        }
     }
     hexToRgb(hex) {
         const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
@@ -387,7 +398,7 @@ class AiAudioCircleComponent {
         this.cleanup();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: AiAudioCircleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.18", type: AiAudioCircleComponent, isStandalone: false, selector: "ui-ai-audio-circle", inputs: { audioTrack: { classPropertyName: "audioTrack", publicName: "audioTrack", isSignal: true, isRequired: false, transformFunction: null }, candidateAudioTrack: { classPropertyName: "candidateAudioTrack", publicName: "candidateAudioTrack", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, canvasSize: { classPropertyName: "canvasSize", publicName: "canvasSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { state: "stateChange" }, viewQueries: [{ propertyName: "pulseCanvasRef", first: true, predicate: ["pulseCanvas"], descendants: true }], ngImport: i0, template: "<div class=\"ai-audio-visualizer\">\n  <div class=\"canvas-container\">\n    <canvas #pulseCanvas></canvas>\n  </div>\n</div>\n", styles: [".ai-audio-visualizer{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%}.canvas-container{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center}canvas{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.18", type: AiAudioCircleComponent, isStandalone: false, selector: "ui-ai-audio-circle", inputs: { audioTrack: { classPropertyName: "audioTrack", publicName: "audioTrack", isSignal: true, isRequired: false, transformFunction: null }, candidateAudioTrack: { classPropertyName: "candidateAudioTrack", publicName: "candidateAudioTrack", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null }, canvasSize: { classPropertyName: "canvasSize", publicName: "canvasSize", isSignal: true, isRequired: false, transformFunction: null }, animated: { classPropertyName: "animated", publicName: "animated", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { state: "stateChange" }, viewQueries: [{ propertyName: "pulseCanvasRef", first: true, predicate: ["pulseCanvas"], descendants: true }], ngImport: i0, template: "<div class=\"ai-audio-visualizer\">\n  <div class=\"canvas-container\">\n    <canvas #pulseCanvas></canvas>\n  </div>\n</div>\n", styles: [".ai-audio-visualizer{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%}.canvas-container{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center}canvas{display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: AiAudioCircleComponent, decorators: [{
             type: Component,