@testgorilla/tgo-ui 7.2.10 → 7.4.0

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

@@ -3,7 +3,8 @@ import * as i0 from "@angular/core";
 export declare enum InterviewState {
     CandidateSpeaking = "candidate-speaking",
     AiListening = "ai-listening",
-    AiSpeaking = "ai-speaking"
+    AiSpeaking = "ai-speaking",
+    Static = "static"
 }
 export declare class AiAudioCircleComponent implements OnDestroy, AfterViewInit {
     pulseCanvasRef?: ElementRef<HTMLCanvasElement>;

package/components/autocomplete-v2/autocomplete-overflow-detect.directive.d.ts

@@ -0,0 +1,21 @@
+import { AfterViewInit, OnDestroy } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class AutocompleteOverflowDetectDirective implements AfterViewInit, OnDestroy {
+    measureContainer: import("@angular/core").InputSignal<HTMLElement | undefined>;
+    itemSelector: import("@angular/core").InputSignal<string>;
+    reserveWidth: import("@angular/core").InputSignal<number>;
+    visibleCount: import("@angular/core").WritableSignal<number>;
+    overflowCount: import("@angular/core").WritableSignal<number>;
+    hasMeasured: import("@angular/core").WritableSignal<boolean>;
+    tagMaxWidth: import("@angular/core").WritableSignal<number | null>;
+    private resizeObserver;
+    private rafId;
+    private readonly el;
+    private readonly ngZone;
+    ngAfterViewInit(): void;
+    setupObserver(containerSelector: string): void;
+    measure(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteOverflowDetectDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<AutocompleteOverflowDetectDirective, "[uiAutocompleteOverflowDetect]", ["autocompleteOverflowDetect"], { "measureContainer": { "alias": "measureContainer"; "required": false; "isSignal": true; }; "itemSelector": { "alias": "itemSelector"; "required": false; "isSignal": true; }; "reserveWidth": { "alias": "reserveWidth"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/components/autocomplete-v2/autocomplete-v2-filter.service.d.ts

@@ -0,0 +1,24 @@
+import { OnDestroy } from '@angular/core';
+import { BehaviorSubject, Observable, ReplaySubject } from 'rxjs';
+import { AutocompleteGroup } from './autocomplete-v2.component';
+import * as i0 from "@angular/core";
+export declare class AutocompleteFilterService<T extends Record<string, any> = Record<string, any>> implements OnDestroy {
+    readonly textField: import("@angular/core").WritableSignal<string>;
+    readonly flatItems: import("@angular/core").WritableSignal<T[]>;
+    readonly groupsList: import("@angular/core").WritableSignal<AutocompleteGroup<T>[]>;
+    readonly suggestions: import("@angular/core").WritableSignal<T[]>;
+    readonly searchText$: BehaviorSubject<string>;
+    readonly userInput$: ReplaySubject<string>;
+    readonly isSearching$: Observable<boolean>;
+    private readonly dynamicSource$;
+    private isDynamicMode;
+    filteredItems$: Observable<T[] | null>;
+    readonly filteredGroupedItems$: Observable<any[] | null>;
+    readonly filteredSuggestions$: Observable<T[] | null>;
+    search(text: string, minChars: number): void;
+    clearSearch(): void;
+    ngOnDestroy(): void;
+    setDynamicResults(list: T[] | null, loading: boolean): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteFilterService<any>, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<AutocompleteFilterService<any>>;
+}

package/components/autocomplete-v2/autocomplete-v2-utils.d.ts

@@ -0,0 +1,18 @@
+type Item = Record<string, unknown>;
+export declare class AutocompleteV2Utils {
+    static transformDisplayValue<T extends Item>(value: T | null | undefined, textField: string): string;
+    static filterItems<T extends Item>(items: T[], inputValue: string, textField: string): T[];
+    static filterGroupedItems<T extends Item>(groups: {
+        groupName: string;
+        items: T[];
+    }[], inputValue: string, textField: string): {
+        groupName: string;
+        items: T[];
+        filteredItems: T[];
+    }[];
+    static excludeSuggestions<T extends Item>(items: T[], excludeItems: T[], valueField: string): T[];
+    static createValueItem<T extends Item>(value: T | string, textField: string, valueField: string): T;
+    static findDuplicate<T extends Item>(items: T[], selectedValue: T, lookupKey: string): T | undefined;
+    static isArray(value: unknown): value is unknown[];
+}
+export {};

package/components/autocomplete-v2/autocomplete-v2-value-manager.d.ts

@@ -0,0 +1,27 @@
+import { AutocompleteType } from './autocomplete-v2.model';
+import * as i0 from "@angular/core";
+export declare class AutocompleteValueManager<T extends Record<string, any> = Record<string, any>> {
+    readonly type: import("@angular/core").WritableSignal<AutocompleteType>;
+    readonly textField: import("@angular/core").WritableSignal<string>;
+    readonly valueField: import("@angular/core").WritableSignal<string>;
+    readonly compareWith: import("@angular/core").WritableSignal<((a: T, b: T) => boolean) | undefined>;
+    readonly value: import("@angular/core").WritableSignal<T | T[] | null>;
+    readonly isSingle: import("@angular/core").Signal<boolean>;
+    readonly displayValue: import("@angular/core").Signal<string>;
+    private onChangeFn;
+    private onTouchedFn;
+    registerOnChange(fn: (value: T | T[] | null) => void): void;
+    registerOnTouched(fn: () => void): void;
+    notifyChange(): void;
+    markAsTouched(): void;
+    writeValue(v: T | T[] | null): void;
+    addValue(newValue: T): void;
+    /**
+     * Removes `option` from the value array.
+     * Returns the found item (so the caller can deselect the mat-option), or undefined if not found.
+     */
+    removeValue(option: T): T | undefined;
+    clear(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteValueManager<any>, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<AutocompleteValueManager<any>>;
+}

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

@@ -0,0 +1,119 @@
+import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
+import { AfterViewInit, DoCheck, ElementRef, OnDestroy } from '@angular/core';
+import { ControlValueAccessor, NgControl } from '@angular/forms';
+import { MatAutocomplete, MatAutocompleteSelectedEvent, MatAutocompleteTrigger } from '@angular/material/autocomplete';
+import { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';
+import { AutocompleteFilterService } from './autocomplete-v2-filter.service';
+import { AutocompleteV2Utils } from './autocomplete-v2-utils';
+import { AutocompleteValueManager } from './autocomplete-v2-value-manager';
+import { Autocomplete, AutocompleteSize, AutocompleteType } from './autocomplete-v2.model';
+import { AutocompleteOverflowDetectDirective } from './autocomplete-overflow-detect.directive';
+import * as i0 from "@angular/core";
+export interface AutocompleteGroup<T extends Record<string, any> = Record<string, any>> {
+    groupName: string;
+    items: T[];
+}
+export declare class AutocompleteV2Component<T extends Record<string, any> = Record<string, any>> implements ControlValueAccessor, AfterViewInit, DoCheck, OnDestroy {
+    itemsList: import("@angular/core").InputSignal<T[]>;
+    suggestionsList: import("@angular/core").InputSignal<T[]>;
+    groupsList: import("@angular/core").InputSignal<AutocompleteGroup<T>[]>;
+    disabled: import("@angular/core").InputSignal<boolean>;
+    allowAdd: import("@angular/core").InputSignal<boolean>;
+    textField: import("@angular/core").InputSignal<string>;
+    valueField: import("@angular/core").InputSignal<string>;
+    label: import("@angular/core").InputSignal<string>;
+    placeholder: import("@angular/core").InputSignal<string>;
+    type: import("@angular/core").InputSignal<AutocompleteType>;
+    minCharactersSearch: import("@angular/core").InputSignal<number>;
+    variant: import("@angular/core").InputSignal<"autocomplete" | "dropdown">;
+    showBottomContent: import("@angular/core").InputSignal<boolean>;
+    required: import("@angular/core").InputSignal<boolean | undefined>;
+    virtualScroll: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    compareWith: import("@angular/core").InputSignal<((a: T, b: T) => boolean) | undefined>;
+    dropdownPanelClass: import("@angular/core").InputSignal<string>;
+    closeOnScroll: import("@angular/core").InputSignal<boolean>;
+    size: import("@angular/core").InputSignal<AutocompleteSize>;
+    allowUserInput: import("@angular/core").InputSignal<boolean>;
+    clearable: import("@angular/core").InputSignal<boolean>;
+    maxLength: import("@angular/core").InputSignal<number | undefined>;
+    dynamicFilterLoading: import("@angular/core").InputSignal<boolean>;
+    dynamicFilteredList: import("@angular/core").InputSignal<T[] | null>;
+    infiniteScroll: import("@angular/core").InputSignal<boolean>;
+    hasMoreOptionsForInfiniteScroll: import("@angular/core").InputSignal<boolean>;
+    itemValue: import("@angular/core").InputSignal<T | T[] | null>;
+    formErrorConfig: import("@angular/core").InputSignal<Record<string, string>>;
+    errors: import("@angular/core").InputSignal<string[]>;
+    selectionChange: import("@angular/core").OutputEmitterRef<T | T[]>;
+    searchTextChange: import("@angular/core").OutputEmitterRef<string>;
+    blur: import("@angular/core").OutputEmitterRef<void>;
+    focus: import("@angular/core").OutputEmitterRef<void>;
+    scrollViewportBottomReached: import("@angular/core").OutputEmitterRef<void>;
+    scrollViewportBottomReachedFiltered: import("@angular/core").OutputEmitterRef<void>;
+    formFieldElement: ElementRef<HTMLElement>;
+    tagContainer: ElementRef<HTMLElement>;
+    protected measureElRef?: ElementRef<HTMLElement>;
+    overflowDir?: AutocompleteOverflowDetectDirective;
+    autocomplete: MatAutocompleteTrigger;
+    set cdkViewport(viewport: CdkVirtualScrollViewport);
+    matAutocomplete: MatAutocomplete;
+    matInput: ElementRef<HTMLInputElement>;
+    protected readonly valueManager: AutocompleteValueManager<T>;
+    protected readonly filterService: AutocompleteFilterService<T>;
+    private readonly scrollManager;
+    private readonly cdr;
+    private readonly focusMonitor;
+    private readonly destroyRef;
+    private readonly ngZone;
+    readonly ngControl: NgControl | null;
+    protected readonly applicationTheme: ApplicationTheme;
+    protected inputValue: import("@angular/core").WritableSignal<string>;
+    protected isInputFocus: import("@angular/core").WritableSignal<boolean>;
+    protected autocompleteType: typeof Autocomplete;
+    /** Flat list for default (ungrouped) rendering and virtual scroll */
+    protected flatItemsList: import("@angular/core").Signal<T[]>;
+    /** Grouped list — only used when isGrouped is true */
+    protected groupedItemsList: import("@angular/core").Signal<{
+        groupName: string;
+        items: T[];
+    }[]>;
+    protected _isDisabled: import("@angular/core").WritableSignal<boolean>;
+    protected translationContext: string;
+    protected readonly utils: typeof AutocompleteV2Utils;
+    protected keyboardFocused: import("@angular/core").WritableSignal<boolean>;
+    protected isAlreadyAdded: import("@angular/core").Signal<boolean>;
+    protected showClearButton: import("@angular/core").Signal<any>;
+    protected safeErrors: import("@angular/core").Signal<string[]>;
+    private controlInvalid;
+    protected hasError: import("@angular/core").Signal<boolean>;
+    protected hiddenItemsTooltip: import("@angular/core").Signal<string>;
+    constructor();
+    /**
+     * 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)
+     */
+    ngDoCheck(): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    registerOnChange(fn: any): void;
+    registerOnTouched(fn: any): void;
+    setDisabledState(isDisabled: boolean): void;
+    writeValue(value: T | T[] | null): void;
+    protected get isGrouped(): boolean;
+    protected onOptionSelected(event: MatAutocompleteSelectedEvent): void;
+    protected onOptionRemoved(option: T): void;
+    protected onInputChange(event: Event): void;
+    protected onClear(): void;
+    protected onBlur(): void;
+    protected onPanelOpened(): void;
+    protected onScrollBottom(): void;
+    protected onFocus(): void;
+    private onUpdate;
+    protected get isDropdown(): boolean;
+    protected onChevronClick(autocomplete: MatAutocomplete): void;
+    protected trackByFn: (index: number, value: string) => string;
+    protected trackByItem: (_index: number, item: T) => any;
+    onKeydown($event: KeyboardEvent): void;
+    protected getVirtualScrollHeight(itemCount: number): number;
+    static ɵfac: i0.ɵɵFactoryDeclaration<AutocompleteV2Component<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<AutocompleteV2Component<any>, "ui-autocomplete-v2", never, { "itemsList": { "alias": "itemsList"; "required": false; "isSignal": true; }; "suggestionsList": { "alias": "suggestionsList"; "required": false; "isSignal": true; }; "groupsList": { "alias": "groupsList"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "allowAdd": { "alias": "allowAdd"; "required": false; "isSignal": true; }; "textField": { "alias": "textField"; "required": false; "isSignal": true; }; "valueField": { "alias": "valueField"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "minCharactersSearch": { "alias": "minCharactersSearch"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": true; "isSignal": true; }; "showBottomContent": { "alias": "showBottomContent"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "virtualScroll": { "alias": "virtualScroll"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "dropdownPanelClass": { "alias": "dropdownPanelClass"; "required": false; "isSignal": true; }; "closeOnScroll": { "alias": "closeOnScroll"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "allowUserInput": { "alias": "allowUserInput"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "dynamicFilterLoading": { "alias": "dynamicFilterLoading"; "required": false; "isSignal": true; }; "dynamicFilteredList": { "alias": "dynamicFilteredList"; "required": false; "isSignal": true; }; "infiniteScroll": { "alias": "infiniteScroll"; "required": false; "isSignal": true; }; "hasMoreOptionsForInfiniteScroll": { "alias": "hasMoreOptionsForInfiniteScroll"; "required": false; "isSignal": true; }; "itemValue": { "alias": "itemValue"; "required": false; "isSignal": true; }; "formErrorConfig": { "alias": "formErrorConfig"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; }, { "selectionChange": "selectionChange"; "searchTextChange": "searchTextChange"; "blur": "blur"; "focus": "focus"; "scrollViewportBottomReached": "scrollViewportBottomReached"; "scrollViewportBottomReachedFiltered": "scrollViewportBottomReachedFiltered"; }, never, never, true, never>;
+}

package/components/autocomplete-v2/autocomplete-v2.model.d.ts

@@ -0,0 +1,12 @@
+export type AutocompleteType = 'single' | 'multi' | 'large';
+export declare enum Autocomplete {
+    SINGLE = "single",
+    MULTI = "multi",
+    LARGE = "large"
+}
+export declare enum DropdownVariation {
+    AUTOCOMPLETE = "autocomplete",
+    DROPDOWN = "dropdown"
+}
+export type DropdownVariationType = `${DropdownVariation}`;
+export type AutocompleteSize = 'small' | 'medium';

package/components/autocomplete-v2/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@testgorilla/tgo-ui/components/autocomplete-v2" />
+export * from './public-api';

package/components/autocomplete-v2/infinite-scroll.directive.d.ts

@@ -0,0 +1,21 @@
+import { OnDestroy } from '@angular/core';
+import { MatAutocompleteTrigger } from '@angular/material/autocomplete';
+import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
+import * as i0 from "@angular/core";
+export declare class InfiniteScrollDirective implements OnDestroy {
+    private viewport;
+    private scrollSub;
+    private destroyRef;
+    private scrollListener;
+    enabled: boolean;
+    closeOnScroll: boolean;
+    panelTrigger: MatAutocompleteTrigger | null;
+    onBottomReached: (() => void) | null;
+    attachViewport(viewport: CdkVirtualScrollViewport | undefined): void;
+    detachViewport(): void;
+    scrollToTop(): void;
+    startCloseOnScroll(): void;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InfiniteScrollDirective, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<InfiniteScrollDirective>;
+}

package/components/autocomplete-v2/public-api.d.ts

@@ -0,0 +1,7 @@
+export * from './autocomplete-v2.component';
+export * from './autocomplete-v2.model';
+export { AutocompleteV2Utils } from './autocomplete-v2-utils';
+export { AutocompleteValueManager } from './autocomplete-v2-value-manager';
+export { AutocompleteFilterService } from './autocomplete-v2-filter.service';
+export { AutocompleteOverflowDetectDirective } from './autocomplete-overflow-detect.directive';
+export { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';

package/components/core/directives/index.d.ts

@@ -0,0 +1,2 @@
+export { SelectTextDirective } from './select-text.directive';
+export { PreventInputDirective } from './prevent-input.directive';

package/components/core/directives/prevent-input.directive.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class PreventInputDirective {
+    uiPreventInput: import("@angular/core").InputSignal<boolean>;
+    onKeyDown(event: KeyboardEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<PreventInputDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<PreventInputDirective, "[uiPreventInput]", never, { "uiPreventInput": { "alias": "uiPreventInput"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/components/core/directives/select-text.directive.d.ts

@@ -0,0 +1,10 @@
+import * as i0 from "@angular/core";
+export declare class SelectTextDirective {
+    selectText: import("@angular/core").InputSignal<string | null>;
+    private el;
+    private highlighted;
+    constructor();
+    private highlight;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SelectTextDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SelectTextDirective, "[selectText]", never, { "selectText": { "alias": "selectText"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/components/core/pipes/includes.pipe.d.ts

@@ -0,0 +1,7 @@
+import { PipeTransform } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class IncludesPipe implements PipeTransform {
+    transform(value: Record<string, any>, values: Record<string, any> | Record<string, any>[], valueField?: string): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<IncludesPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<IncludesPipe, "includes", true>;
+}

package/components/core/pipes/index.d.ts

@@ -0,0 +1,2 @@
+export { IncludesPipe } from './includes.pipe';
+export { TransformItemPipe } from './transform-item.pipe';

package/components/core/pipes/transform-item.pipe.d.ts

@@ -0,0 +1,8 @@
+import { PipeTransform } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class TransformItemPipe implements PipeTransform {
+    transform(value: Record<string, any> | Record<string, any>[] | null | undefined, field: string, getValueList: true): string[];
+    transform(value: Record<string, any> | Record<string, any>[] | null | undefined, field: string, getValueList?: false): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TransformItemPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<TransformItemPipe, "transformItem", true>;
+}

package/components/core/public-api.d.ts

@@ -9,7 +9,8 @@ export * from './hex-to-rgb';
 export * from './autocomplete-utils';
 export * from './digits-only.directive';
 export * from './has-validation-error.pipe';
-export * from './select-text.directive';
+export * from './directives';
+export * from './pipes';
 export * from './is-mobile';
 export * from './is-large-tablet';
 export * from './screen-breakpoints.model';

package/components/validation-error/validation-error.component.d.ts

@@ -15,8 +15,12 @@ export declare class ValidationErrorComponent {
      * @memberof ValidationErrorComponent
      */
     applicationTheme: ApplicationTheme;
+    /** Maps validator error keys to display message templates. Supports {{placeholder}} interpolation. */
+    customErrors: Record<string, string>;
     getErrorValue(type: errorType): number;
+    get customErrorKeys(): string[];
+    resolveErrorMessage(key: string): string;
     translationContextErrors: string;
     static ɵfac: i0.ɵɵFactoryDeclaration<ValidationErrorComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ValidationErrorComponent, "ui-validation-error", never, { "ngControl": { "alias": "ngControl"; "required": false; }; "touchedOn": { "alias": "touchedOn"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "label": { "alias": "label"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ValidationErrorComponent, "ui-validation-error", never, { "ngControl": { "alias": "ngControl"; "required": false; }; "touchedOn": { "alias": "touchedOn"; "required": false; }; "errorMessage": { "alias": "errorMessage"; "required": false; }; "label": { "alias": "label"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "customErrors": { "alias": "customErrors"; "required": false; }; }, {}, never, never, false, never>;
 }

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

@@ -8,6 +8,7 @@ var InterviewState;
     InterviewState["CandidateSpeaking"] = "candidate-speaking";
     InterviewState["AiListening"] = "ai-listening";
     InterviewState["AiSpeaking"] = "ai-speaking";
+    InterviewState["Static"] = "static";
 })(InterviewState || (InterviewState = {}));
 class AiAudioCircleComponent {
     constructor() {
@@ -204,7 +205,10 @@ class AiAudioCircleComponent {
     mainLoop() {
         this.simTime += 0.05;
         const currentStateValue = this.state();
-        if (currentStateValue === InterviewState.AiSpeaking) {
+        if (currentStateValue === InterviewState.Static) {
+            // Static: no amplitude updates — the render locks scale at 1.0
+        }
+        else if (currentStateValue === InterviewState.AiSpeaking) {
             if (this.analyser && this.dataArray) {
                 // Use real audio amplitude (already handled in analyzeAudio)
             }
@@ -242,8 +246,14 @@ class AiAudioCircleComponent {
         const isListening = currentStateValue === InterviewState.AiListening;
         const isCandidate = currentStateValue === InterviewState.CandidateSpeaking;
         const isAiSpeaking = currentStateValue === InterviewState.AiSpeaking;
+        const isStatic = currentStateValue === InterviewState.Static;
         // Scale logic
-        if (isCandidate) {
+        if (isStatic) {
+            // Static: fixed scale at 1.0, no breathing, no amplitude reactivity
+            this.pulseTargetScale = 1;
+            this.pulseScale = 1;
+        }
+        else if (isCandidate) {
             // Candidate speaking: Fixed enlarged scale (115%), no breathing effect
             this.pulseTargetScale = 1.15;
             const breathing = 0;
@@ -272,18 +282,20 @@ class AiAudioCircleComponent {
             this.pulseScale += (this.pulseTargetScale + breathing - this.pulseScale) * smoothing;
         }
         const currentRadius = baseRadius * this.pulseScale;
-        // Draw shadows
-        for (let i = 3; i >= 1; i--) {
-            const shadowRadius = currentRadius + i * 10;
-            const shadowOpacity = 0.35 - i * 0.06;
-            const shadowGradient = ctx.createRadialGradient(centerX, centerY, currentRadius * 0.98, centerX, centerY, shadowRadius);
-            shadowGradient.addColorStop(0, `rgba(${this.SHADOW_COLOR_RGB}, ${shadowOpacity})`);
-            shadowGradient.addColorStop(0.6, `rgba(${this.SHADOW_COLOR_RGB}, ${shadowOpacity * 0.5})`);
-            shadowGradient.addColorStop(1, `rgba(${this.SHADOW_COLOR_RGB}, 0)`);
-            ctx.beginPath();
-            ctx.arc(centerX, centerY, shadowRadius, 0, Math.PI * 2);
-            ctx.fillStyle = shadowGradient;
-            ctx.fill();
+        // Draw shadows (skipped in static state)
+        if (!isStatic) {
+            for (let i = 3; i >= 1; i--) {
+                const shadowRadius = currentRadius + i * 10;
+                const shadowOpacity = 0.35 - i * 0.06;
+                const shadowGradient = ctx.createRadialGradient(centerX, centerY, currentRadius * 0.98, centerX, centerY, shadowRadius);
+                shadowGradient.addColorStop(0, `rgba(${this.SHADOW_COLOR_RGB}, ${shadowOpacity})`);
+                shadowGradient.addColorStop(0.6, `rgba(${this.SHADOW_COLOR_RGB}, ${shadowOpacity * 0.5})`);
+                shadowGradient.addColorStop(1, `rgba(${this.SHADOW_COLOR_RGB}, 0)`);
+                ctx.beginPath();
+                ctx.arc(centerX, centerY, shadowRadius, 0, Math.PI * 2);
+                ctx.fillStyle = shadowGradient;
+                ctx.fill();
+            }
         }
         // Clip to circle
         ctx.save();
@@ -315,45 +327,47 @@ class AiAudioCircleComponent {
             chaosStrength = isAiSpeaking ? 1.8 : 1.0;
         }
         this.blobs.forEach((blob, index) => {
-            // Chaos forces
-            let chaos1 = Math.sin(this.pulseTime * 0.6 + index * 2.5 + blob.x * 0.02) * 0.15;
-            let chaos2 = Math.cos(this.pulseTime * 0.4 + index * 1.8 + blob.y * 0.015) * 0.12;
-            let chaos3 = Math.sin(this.pulseTime * 1.0 + index * 0.7) * 0.08;
-            if (isAiSpeaking) {
-                chaos1 += Math.sin(this.pulseTime * 3.2 + index * 1.3) * 0.18;
-                chaos2 += Math.cos(this.pulseTime * 2.5 + index * 2.1) * 0.14;
-                chaos3 += Math.sin(this.pulseTime * 4.0 + index * 0.5) * 0.1;
-            }
-            // Apply forces
-            const force = 0.045 * speedMultiplier * chaosStrength;
-            blob.vx += (chaos1 + chaos3 * Math.cos(this.pulseTime * 1.5 + index)) * force;
-            blob.vy += (chaos2 + chaos3 * Math.sin(this.pulseTime * 1.2 + index)) * force;
-            // Friction (slightly less when AI speaking for more sustained movement)
-            const friction = isAiSpeaking ? 0.985 : 0.98;
-            blob.vx *= friction;
-            blob.vy *= friction;
-            // Max velocity (higher when AI speaking for more erratic motion)
-            const maxVelBase = isListening ? 3.0 : isAiSpeaking ? 6.0 : 4.5;
-            const maxVel = maxVelBase * speedMultiplier;
-            const vel = Math.sqrt(blob.vx * blob.vx + blob.vy * blob.vy);
-            if (vel > maxVel) {
-                blob.vx = (blob.vx / vel) * maxVel;
-                blob.vy = (blob.vy / vel) * maxVel;
-            }
-            // Update position
-            blob.x += blob.vx;
-            blob.y += blob.vy;
-            // Keep within bounds
-            const dx = blob.x - centerX;
-            const dy = blob.y - centerY;
-            const dist = Math.sqrt(dx * dx + dy * dy);
-            const maxDist = currentRadius * 0.55;
-            if (dist > maxDist) {
-                const angle = Math.atan2(dy, dx);
-                blob.x = centerX + Math.cos(angle) * maxDist;
-                blob.y = centerY + Math.sin(angle) * maxDist;
-                blob.vx -= dx * 0.065;
-                blob.vy -= dy * 0.065;
+            if (!isStatic) {
+                // Chaos forces
+                let chaos1 = Math.sin(this.pulseTime * 0.6 + index * 2.5 + blob.x * 0.02) * 0.15;
+                let chaos2 = Math.cos(this.pulseTime * 0.4 + index * 1.8 + blob.y * 0.015) * 0.12;
+                let chaos3 = Math.sin(this.pulseTime * 1.0 + index * 0.7) * 0.08;
+                if (isAiSpeaking) {
+                    chaos1 += Math.sin(this.pulseTime * 3.2 + index * 1.3) * 0.18;
+                    chaos2 += Math.cos(this.pulseTime * 2.5 + index * 2.1) * 0.14;
+                    chaos3 += Math.sin(this.pulseTime * 4.0 + index * 0.5) * 0.1;
+                }
+                // Apply forces
+                const force = 0.045 * speedMultiplier * chaosStrength;
+                blob.vx += (chaos1 + chaos3 * Math.cos(this.pulseTime * 1.5 + index)) * force;
+                blob.vy += (chaos2 + chaos3 * Math.sin(this.pulseTime * 1.2 + index)) * force;
+                // Friction (slightly less when AI speaking for more sustained movement)
+                const friction = isAiSpeaking ? 0.985 : 0.98;
+                blob.vx *= friction;
+                blob.vy *= friction;
+                // Max velocity (higher when AI speaking for more erratic motion)
+                const maxVelBase = isListening ? 3.0 : isAiSpeaking ? 6.0 : 4.5;
+                const maxVel = maxVelBase * speedMultiplier;
+                const vel = Math.sqrt(blob.vx * blob.vx + blob.vy * blob.vy);
+                if (vel > maxVel) {
+                    blob.vx = (blob.vx / vel) * maxVel;
+                    blob.vy = (blob.vy / vel) * maxVel;
+                }
+                // Update position
+                blob.x += blob.vx;
+                blob.y += blob.vy;
+                // Keep within bounds
+                const dx = blob.x - centerX;
+                const dy = blob.y - centerY;
+                const dist = Math.sqrt(dx * dx + dy * dy);
+                const maxDist = currentRadius * 0.55;
+                if (dist > maxDist) {
+                    const angle = Math.atan2(dy, dx);
+                    blob.x = centerX + Math.cos(angle) * maxDist;
+                    blob.y = centerY + Math.sin(angle) * maxDist;
+                    blob.vx -= dx * 0.065;
+                    blob.vy -= dy * 0.065;
+                }
             }
             // Parse color to RGB
             const rgb = this.hexToRgb(blob.color);