ng-primitives 0.78.0 → 0.80.0

package/ai/README.md

@@ -0,0 +1,3 @@
+# ng-primitives/ai
+
+Secondary entry point of `ng-primitives`. It can be used by importing from `ng-primitives/ai`.

package/ai/index.d.ts

@@ -0,0 +1,16 @@
+export { NgpPromptComposerInput } from './prompt-composer-input/prompt-composer-input';
+export { NgpPromptComposerSubmit } from './prompt-composer-submit/prompt-composer-submit';
+export { NgpPromptComposer } from './prompt-composer/prompt-composer';
+export { NgpThreadMessage } from './thread-message/thread-message';
+export { NgpThread } from './thread/thread';
+export { NgpPromptComposerDictation } from './prompt-composer-dictation/prompt-composer-dictation';
+export { NgpThreadViewport } from './thread-viewport/thread-viewport';
+export { NgpThreadSuggestion } from './thread-suggestion/thread-suggestion';
+export { providePromptComposerState, injectPromptComposerState, } from './prompt-composer/prompt-composer-state';
+export { providePromptComposerDictationState, injectPromptComposerDictationState, } from './prompt-composer-dictation/prompt-composer-dictation-state';
+export { providePromptComposerInputState, injectPromptComposerInputState, } from './prompt-composer-input/prompt-composer-input-state';
+export { providePromptComposerSubmitState, injectPromptComposerSubmitState, } from './prompt-composer-submit/prompt-composer-submit-state';
+export { provideThreadState, injectThreadState } from './thread/thread-state';
+export { provideThreadSuggestionState, injectThreadSuggestionState, } from './thread-suggestion/thread-suggestion-state';
+export { provideThreadViewportState, injectThreadViewportState, } from './thread-viewport/thread-viewport-state';
+export { provideThreadMessageState, injectThreadMessageState, } from './thread-message/thread-message-state';

package/ai/prompt-composer/prompt-composer-state.d.ts

@@ -0,0 +1,17 @@
+import type { NgpPromptComposer } from './prompt-composer';
+/**
+ * The state token  for the PromptComposer primitive.
+ */
+export declare const NgpPromptComposerStateToken: import("@angular/core").InjectionToken<NgpPromptComposer>;
+/**
+ * Provides the PromptComposer state.
+ */
+export declare const providePromptComposerState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
+/**
+ * Injects the PromptComposer state.
+ */
+export declare const injectPromptComposerState: <U = NgpPromptComposer>(injectOptions?: import("@angular/core").InjectOptions) => import("@angular/core").Signal<import("ng-primitives/state").State<U>>;
+/**
+ * The PromptComposer state registration function.
+ */
+export declare const promptComposerState: <U>(state: U) => import("ng-primitives/state").CreatedState<U>;

package/ai/prompt-composer/prompt-composer.d.ts

@@ -0,0 +1,23 @@
+import * as i0 from "@angular/core";
+export declare class NgpPromptComposer {
+    private readonly thread;
+    /** Emits whenever the user submits the prompt. */
+    readonly submit: import("@angular/core").OutputEmitterRef<string>;
+    /** @internal Store the current prompt text. */
+    readonly prompt: import("@angular/core").WritableSignal<string>;
+    /** @internal Track whether the prompt is currently being dictated */
+    readonly isDictating: import("@angular/core").WritableSignal<boolean>;
+    /** @internal Determine whether the prompt input has content */
+    readonly hasPrompt: import("@angular/core").Signal<boolean>;
+    /** Whether dictation is supported by the browser */
+    readonly dictationSupported: boolean;
+    /** The state of the prompt composer. */
+    protected readonly state: import("ng-primitives/state").CreatedState<NgpPromptComposer>;
+    /**
+     * @internal
+     * Submits the current prompt if there is content, and clears the input.
+     */
+    submitPrompt(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpPromptComposer, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpPromptComposer, "[ngpPromptComposer]", ["ngpPromptComposer"], {}, { "submit": "ngpPromptComposerSubmit"; }, never, never, true, never>;
+}

package/ai/prompt-composer-dictation/prompt-composer-dictation-state.d.ts

@@ -0,0 +1,17 @@
+import type { NgpPromptComposerDictation } from './prompt-composer-dictation';
+/**
+ * The state token  for the PromptComposerDictation primitive.
+ */
+export declare const NgpPromptComposerDictationStateToken: import("@angular/core").InjectionToken<NgpPromptComposerDictation>;
+/**
+ * Provides the PromptComposerDictation state.
+ */
+export declare const providePromptComposerDictationState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
+/**
+ * Injects the PromptComposerDictation state.
+ */
+export declare const injectPromptComposerDictationState: <U = NgpPromptComposerDictation>(injectOptions?: import("@angular/core").InjectOptions) => import("@angular/core").Signal<import("ng-primitives/state").State<U>>;
+/**
+ * The PromptComposerDictation state registration function.
+ */
+export declare const promptComposerDictationState: <U>(state: U) => import("ng-primitives/state").CreatedState<U>;

package/ai/prompt-composer-dictation/prompt-composer-dictation.d.ts

@@ -0,0 +1,29 @@
+import { BooleanInput } from '@angular/cdk/coercion';
+import { OnDestroy } from '@angular/core';
+import * as i0 from "@angular/core";
+declare global {
+    interface Window {
+        SpeechRecognition: any;
+        webkitSpeechRecognition: any;
+    }
+}
+export declare class NgpPromptComposerDictation implements OnDestroy {
+    protected readonly composer: import("@angular/core").Signal<import("ng-primitives/state").State<import("ng-primitives/ai").NgpPromptComposer>>;
+    private recognition;
+    private basePrompt;
+    /** Whether the submit button should be disabled. */
+    readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /** Whether dictation is currently active */
+    readonly isDictating: import("@angular/core").Signal<boolean>;
+    /** The state of the prompt composer. */
+    protected readonly state: import("ng-primitives/state").CreatedState<NgpPromptComposerDictation>;
+    constructor();
+    ngOnDestroy(): void;
+    protected onClick(): void;
+    protected onKeydown(event: KeyboardEvent): void;
+    private initializeSpeechRecognition;
+    private startDictation;
+    private stopDictation;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpPromptComposerDictation, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpPromptComposerDictation, "button[ngpPromptComposerDictation]", ["ngpPromptComposerDictation"], { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/ai/prompt-composer-input/prompt-composer-input-state.d.ts

@@ -0,0 +1,17 @@
+import type { NgpPromptComposerInput } from './prompt-composer-input';
+/**
+ * The state token  for the PromptComposerInput primitive.
+ */
+export declare const NgpPromptComposerInputStateToken: import("@angular/core").InjectionToken<NgpPromptComposerInput>;
+/**
+ * Provides the PromptComposerInput state.
+ */
+export declare const providePromptComposerInputState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
+/**
+ * Injects the PromptComposerInput state.
+ */
+export declare const injectPromptComposerInputState: <U = NgpPromptComposerInput>(injectOptions?: import("@angular/core").InjectOptions) => import("@angular/core").Signal<import("ng-primitives/state").State<U>>;
+/**
+ * The PromptComposerInput state registration function.
+ */
+export declare const promptComposerInputState: <U>(state: U) => import("ng-primitives/state").CreatedState<U>;

package/ai/prompt-composer-input/prompt-composer-input.d.ts

@@ -0,0 +1,16 @@
+import * as i0 from "@angular/core";
+export declare class NgpPromptComposerInput {
+    protected readonly thread: import("@angular/core").Signal<import("ng-primitives/state").State<import("ng-primitives/ai").NgpThread>>;
+    private readonly composer;
+    private readonly element;
+    /** The state of the prompt composer input. */
+    protected readonly state: import("ng-primitives/state").CreatedState<NgpPromptComposerInput>;
+    constructor();
+    /**
+     * If the user presses Enter, the form will be submitted, unless they are holding Shift.
+     * This directive automatically handles that behavior.
+     */
+    protected onEnterKey(event: KeyboardEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpPromptComposerInput, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpPromptComposerInput, "input[ngpPromptComposerInput], textarea[ngpPromptComposerInput]", ["ngpPromptComposerInput"], {}, {}, never, never, true, never>;
+}

package/ai/prompt-composer-submit/prompt-composer-submit-state.d.ts

@@ -0,0 +1,17 @@
+import type { NgpPromptComposerSubmit } from './prompt-composer-submit';
+/**
+ * The state token  for the PromptComposerSubmit primitive.
+ */
+export declare const NgpPromptComposerSubmitStateToken: import("@angular/core").InjectionToken<NgpPromptComposerSubmit>;
+/**
+ * Provides the PromptComposerSubmit state.
+ */
+export declare const providePromptComposerSubmitState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
+/**
+ * Injects the PromptComposerSubmit state.
+ */
+export declare const injectPromptComposerSubmitState: <U = NgpPromptComposerSubmit>(injectOptions?: import("@angular/core").InjectOptions) => import("@angular/core").Signal<import("ng-primitives/state").State<U>>;
+/**
+ * The PromptComposerSubmit state registration function.
+ */
+export declare const promptComposerSubmitState: <U>(state: U) => import("ng-primitives/state").CreatedState<U>;

package/ai/prompt-composer-submit/prompt-composer-submit.d.ts

@@ -0,0 +1,15 @@
+import { BooleanInput } from '@angular/cdk/coercion';
+import * as i0 from "@angular/core";
+export declare class NgpPromptComposerSubmit {
+    protected readonly composer: import("@angular/core").Signal<import("ng-primitives/state").State<import("ng-primitives/ai").NgpPromptComposer>>;
+    /** Whether the submit button should be disabled */
+    readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /** Whether dictation is currently active */
+    readonly isDictating: import("@angular/core").Signal<boolean>;
+    /** The state of the prompt composer submit. */
+    protected readonly state: import("ng-primitives/state").CreatedState<NgpPromptComposerSubmit>;
+    constructor();
+    protected onClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpPromptComposerSubmit, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpPromptComposerSubmit, "button[ngpPromptComposerSubmit]", ["ngpPromptComposerSubmit"], { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/ai/thread/thread-state.d.ts

@@ -0,0 +1,17 @@
+import type { NgpThread } from './thread';
+/**
+ * The state token  for the Thread primitive.
+ */
+export declare const NgpThreadStateToken: import("@angular/core").InjectionToken<NgpThread>;
+/**
+ * Provides the Thread state.
+ */
+export declare const provideThreadState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
+/**
+ * Injects the Thread state.
+ */
+export declare const injectThreadState: <U = NgpThread>(injectOptions?: import("@angular/core").InjectOptions) => import("@angular/core").Signal<import("ng-primitives/state").State<U>>;
+/**
+ * The Thread state registration function.
+ */
+export declare const threadState: <U>(state: U) => import("ng-primitives/state").CreatedState<U>;

package/ai/thread/thread.d.ts

@@ -0,0 +1,23 @@
+import { Subject } from 'rxjs';
+import { NgpThreadMessage } from '../thread-message/thread-message';
+import * as i0 from "@angular/core";
+export declare class NgpThread {
+    private messages;
+    /** @internal emit event to trigger scrolling to bottom */
+    readonly scrollRequest: Subject<ScrollBehavior>;
+    /** @internal emit event to trigger setting the prompt */
+    readonly requestPrompt: Subject<string>;
+    /** The state of the thread. */
+    protected readonly state: import("ng-primitives/state").CreatedState<NgpThread>;
+    scrollToBottom(behavior: ScrollBehavior): void;
+    /** @internal Register a message with the thread */
+    registerMessage(message: NgpThreadMessage): void;
+    /** @internal Unregister a message from the thread */
+    unregisterMessage(message: NgpThreadMessage): void;
+    /** @internal Determine if the given message is the last message in the thread */
+    isLastMessage(message: NgpThreadMessage): boolean;
+    /** @internal Set the prompt text in the associated prompt composer */
+    setPrompt(value: string): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpThread, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpThread, "[ngpThread]", ["ngpThread"], {}, {}, never, never, true, never>;
+}

package/ai/thread-message/thread-message-state.d.ts

@@ -0,0 +1,17 @@
+import type { NgpThreadMessage } from './thread-message';
+/**
+ * The state token  for the ThreadMessage primitive.
+ */
+export declare const NgpThreadMessageStateToken: import("@angular/core").InjectionToken<NgpThreadMessage>;
+/**
+ * Provides the ThreadMessage state.
+ */
+export declare const provideThreadMessageState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
+/**
+ * Injects the ThreadMessage state.
+ */
+export declare const injectThreadMessageState: <U = NgpThreadMessage>(injectOptions?: import("@angular/core").InjectOptions) => import("@angular/core").Signal<import("ng-primitives/state").State<U>>;
+/**
+ * The ThreadMessage state registration function.
+ */
+export declare const threadMessageState: <U>(state: U) => import("ng-primitives/state").CreatedState<U>;

package/ai/thread-message/thread-message.d.ts

@@ -0,0 +1,11 @@
+import * as i0 from "@angular/core";
+export declare class NgpThreadMessage {
+    private readonly elementRef;
+    private readonly destroyRef;
+    private readonly thread;
+    /** The state of the thread message. */
+    protected readonly state: import("ng-primitives/state").CreatedState<NgpThreadMessage>;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpThreadMessage, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpThreadMessage, "[ngpThreadMessage]", ["ngpThreadMessage"], {}, {}, never, never, true, never>;
+}

package/ai/thread-suggestion/thread-suggestion-state.d.ts

@@ -0,0 +1,17 @@
+import type { NgpThreadSuggestion } from './thread-suggestion';
+/**
+ * The state token  for the ThreadSuggestion primitive.
+ */
+export declare const NgpThreadSuggestionStateToken: import("@angular/core").InjectionToken<NgpThreadSuggestion>;
+/**
+ * Provides the ThreadSuggestion state.
+ */
+export declare const provideThreadSuggestionState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
+/**
+ * Injects the ThreadSuggestion state.
+ */
+export declare const injectThreadSuggestionState: <U = NgpThreadSuggestion>(injectOptions?: import("@angular/core").InjectOptions) => import("@angular/core").Signal<import("ng-primitives/state").State<U>>;
+/**
+ * The ThreadSuggestion state registration function.
+ */
+export declare const threadSuggestionState: <U>(state: U) => import("ng-primitives/state").CreatedState<U>;

package/ai/thread-suggestion/thread-suggestion.d.ts

@@ -0,0 +1,14 @@
+import { BooleanInput } from '@angular/cdk/coercion';
+import * as i0 from "@angular/core";
+export declare class NgpThreadSuggestion {
+    private readonly thread;
+    /** The suggested text to display in the input field. */
+    readonly suggestion: import("@angular/core").InputSignal<string>;
+    /** Whether the suggestion should populate the prompt when clicked. */
+    readonly setPromptOnClick: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /** The state of the thread suggestion. */
+    protected readonly state: import("ng-primitives/state").CreatedState<NgpThreadSuggestion>;
+    submitSuggestion(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpThreadSuggestion, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpThreadSuggestion, "button[ngpThreadSuggestion]", ["ngpThreadSuggestion"], { "suggestion": { "alias": "ngpThreadSuggestion"; "required": false; "isSignal": true; }; "setPromptOnClick": { "alias": "ngpThreadSuggestionSetPromptOnClick"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/ai/thread-viewport/thread-viewport-state.d.ts

@@ -0,0 +1,17 @@
+import type { NgpThreadViewport } from './thread-viewport';
+/**
+ * The state token  for the ThreadViewport primitive.
+ */
+export declare const NgpThreadViewportStateToken: import("@angular/core").InjectionToken<NgpThreadViewport>;
+/**
+ * Provides the ThreadViewport state.
+ */
+export declare const provideThreadViewportState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
+/**
+ * Injects the ThreadViewport state.
+ */
+export declare const injectThreadViewportState: <U = NgpThreadViewport>(injectOptions?: import("@angular/core").InjectOptions) => import("@angular/core").Signal<import("ng-primitives/state").State<U>>;
+/**
+ * The ThreadViewport state registration function.
+ */
+export declare const threadViewportState: <U>(state: U) => import("ng-primitives/state").CreatedState<U>;

package/ai/thread-viewport/thread-viewport.d.ts

@@ -0,0 +1,34 @@
+import { BooleanInput, NumberInput } from '@angular/cdk/coercion';
+import * as i0 from "@angular/core";
+export declare class NgpThreadViewport {
+    private readonly thread;
+    private readonly elementRef;
+    /**
+     * The distance in pixels from the bottom of the scrollable container that is considered "at the bottom".
+     * When the user scrolls within this threshold, the thread is treated as being at the bottom.
+     * This value is used to determine whether automatic scrolling to the bottom should occur,
+     * for example when new content is added or the container is resized.
+     *
+     * @default 70
+     */
+    readonly threshold: import("@angular/core").InputSignalWithTransform<number, NumberInput>;
+    /**
+     * Whether the thread should automatically scroll to the bottom when new content is added.
+     */
+    readonly autoScroll: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /** Store the last known scroll position */
+    private lastScrollTop;
+    /** Determine if we are at the bottom of the scrollable container (within the threshold) */
+    protected isAtBottom: boolean;
+    /** The state of the thread viewport. */
+    protected readonly state: import("ng-primitives/state").CreatedState<NgpThreadViewport>;
+    constructor();
+    /**
+     * Scroll the container to the bottom.
+     * @internal
+     */
+    scrollToBottom(behavior: ScrollBehavior): void;
+    protected onScroll(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpThreadViewport, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpThreadViewport, "[ngpThreadViewport]", ["ngpThreadViewport"], { "threshold": { "alias": "ngpThreadViewportThreshold"; "required": false; "isSignal": true; }; "autoScroll": { "alias": "ngpThreadViewportAutoScroll"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/combobox/combobox/combobox.d.ts

@@ -183,6 +183,38 @@ export declare class NgpCombobox {
      * @internal
      */
     unregisterOption(option: NgpComboboxOption): void;
+    /**
+     * Focus the combobox.
+     * When an input element is present, it will be focused.
+     * Otherwise, the combobox element itself will be focused.
+     * This enables keyboard navigation for comboboxes without input elements.
+     * @internal
+     */
+    focus(): void;
+    /**
+     * Handle keydown events for keyboard navigation and accessibility.
+     * Supports:
+     * - Arrow Down: Open dropdown or navigate to next option
+     * - Arrow Up: Open dropdown or navigate to previous option
+     * - Home: Navigate to first option
+     * - End: Navigate to last option
+     * - Enter: Select the currently active option
+     * - Escape: Close the dropdown
+     * @param event - The keyboard event
+     * @internal
+     */
+    protected handleKeydown(event: KeyboardEvent): void;
+    /**
+     * Handle blur events to manage dropdown closing behavior.
+     * The dropdown will remain open if focus moves to:
+     * - The dropdown itself
+     * - The combobox button
+     * - The combobox input
+     * Otherwise, the dropdown will be closed.
+     * @param event - The focus event
+     * @internal
+     */
+    protected onBlur(event: FocusEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgpCombobox, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<NgpCombobox, "[ngpCombobox]", ["ngpCombobox"], { "value": { "alias": "ngpComboboxValue"; "required": false; "isSignal": true; }; "multiple": { "alias": "ngpComboboxMultiple"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpComboboxDisabled"; "required": false; "isSignal": true; }; "allowDeselect": { "alias": "ngpComboboxAllowDeselect"; "required": false; "isSignal": true; }; "compareWith": { "alias": "ngpComboboxCompareWith"; "required": false; "isSignal": true; }; "placement": { "alias": "ngpComboboxDropdownPlacement"; "required": false; "isSignal": true; }; "container": { "alias": "ngpComboboxDropdownContainer"; "required": false; "isSignal": true; }; }, { "valueChange": "ngpComboboxValueChange"; "openChange": "ngpComboboxOpenChange"; }, never, never, true, never>;
 }

package/combobox/utils.d.ts

@@ -0,0 +1,9 @@
+import type { NgpComboboxOption } from './combobox-option/combobox-option';
+/**
+ * Check if all regular options (excluding 'all' and undefined) are selected.
+ * @param options All available options
+ * @param selectedValues Currently selected values
+ * @param compareWith Comparison function
+ * @returns true if all regular options are selected
+ */
+export declare function areAllOptionsSelected(options: NgpComboboxOption[], selectedValues: any[], compareWith: (a: any, b: any) => boolean): boolean;