ng-primitives 0.89.0 → 0.91.0

package/ai/index.d.ts

@@ -1,16 +1,238 @@
-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';
+import * as _angular_core from '@angular/core';
+import { OnDestroy } from '@angular/core';
+import * as ng_primitives_state from 'ng-primitives/state';
+import * as ng_primitives_ai from 'ng-primitives/ai';
+import { BooleanInput, NumberInput } from '@angular/cdk/coercion';
+import { Subject } from 'rxjs';
+
+declare class NgpPromptComposerInput {
+    protected readonly thread: _angular_core.Signal<ng_primitives_state.State<ng_primitives_ai.NgpThread>>;
+    private readonly composer;
+    private readonly element;
+    /** The state of the prompt composer input. */
+    protected readonly state: 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: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpPromptComposerInput, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpPromptComposerInput, "input[ngpPromptComposerInput], textarea[ngpPromptComposerInput]", ["ngpPromptComposerInput"], {}, {}, never, never, true, never>;
+}
+
+declare class NgpPromptComposerSubmit {
+    protected readonly composer: _angular_core.Signal<ng_primitives_state.State<ng_primitives_ai.NgpPromptComposer>>;
+    /** Whether the submit button should be disabled */
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /** Whether dictation is currently active */
+    readonly isDictating: _angular_core.Signal<boolean>;
+    /** The state of the prompt composer submit. */
+    protected readonly state: ng_primitives_state.CreatedState<NgpPromptComposerSubmit>;
+    constructor();
+    protected onClick(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpPromptComposerSubmit, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpPromptComposerSubmit, "button[ngpPromptComposerSubmit]", ["ngpPromptComposerSubmit"], { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+declare class NgpPromptComposer {
+    private readonly thread;
+    /** Emits whenever the user submits the prompt. */
+    readonly submit: _angular_core.OutputEmitterRef<string>;
+    /** @internal Store the current prompt text. */
+    readonly prompt: _angular_core.WritableSignal<string>;
+    /** @internal Track whether the prompt is currently being dictated */
+    readonly isDictating: _angular_core.WritableSignal<boolean>;
+    /** @internal Determine whether the prompt input has content */
+    readonly hasPrompt: _angular_core.Signal<boolean>;
+    /** Whether dictation is supported by the browser */
+    readonly dictationSupported: boolean;
+    /** The state of the prompt composer. */
+    protected readonly state: ng_primitives_state.CreatedState<NgpPromptComposer>;
+    /**
+     * @internal
+     * Submits the current prompt if there is content, and clears the input.
+     */
+    submitPrompt(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpPromptComposer, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpPromptComposer, "[ngpPromptComposer]", ["ngpPromptComposer"], {}, { "submit": "ngpPromptComposerSubmit"; }, never, never, true, never>;
+}
+
+declare class NgpThreadMessage {
+    private readonly elementRef;
+    private readonly destroyRef;
+    private readonly thread;
+    /** The state of the thread message. */
+    protected readonly state: ng_primitives_state.CreatedState<NgpThreadMessage>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpThreadMessage, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpThreadMessage, "[ngpThreadMessage]", ["ngpThreadMessage"], {}, {}, never, never, true, never>;
+}
+
+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: 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: _angular_core.ɵɵFactoryDeclaration<NgpThread, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpThread, "[ngpThread]", ["ngpThread"], {}, {}, never, never, true, never>;
+}
+
+declare global {
+    interface Window {
+        SpeechRecognition: any;
+        webkitSpeechRecognition: any;
+    }
+}
+declare class NgpPromptComposerDictation implements OnDestroy {
+    protected readonly composer: _angular_core.Signal<ng_primitives_state.State<ng_primitives_ai.NgpPromptComposer>>;
+    private recognition;
+    private basePrompt;
+    /** Whether the submit button should be disabled. */
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /** Whether dictation is currently active */
+    readonly isDictating: _angular_core.Signal<boolean>;
+    /** The state of the prompt composer. */
+    protected readonly state: ng_primitives_state.CreatedState<NgpPromptComposerDictation>;
+    constructor();
+    ngOnDestroy(): void;
+    protected onClick(): void;
+    protected onKeydown(event: KeyboardEvent): void;
+    private initializeSpeechRecognition;
+    private startDictation;
+    private stopDictation;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpPromptComposerDictation, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpPromptComposerDictation, "button[ngpPromptComposerDictation]", ["ngpPromptComposerDictation"], { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+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: _angular_core.InputSignalWithTransform<number, NumberInput>;
+    /**
+     * Whether the thread should automatically scroll to the bottom when new content is added.
+     */
+    readonly autoScroll: _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: ng_primitives_state.CreatedState<NgpThreadViewport>;
+    constructor();
+    /**
+     * Scroll the container to the bottom.
+     * @internal
+     */
+    scrollToBottom(behavior: ScrollBehavior): void;
+    protected onScroll(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpThreadViewport, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpThreadViewport, "[ngpThreadViewport]", ["ngpThreadViewport"], { "threshold": { "alias": "ngpThreadViewportThreshold"; "required": false; "isSignal": true; }; "autoScroll": { "alias": "ngpThreadViewportAutoScroll"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+declare class NgpThreadSuggestion {
+    private readonly thread;
+    /** The suggested text to display in the input field. */
+    readonly suggestion: _angular_core.InputSignal<string>;
+    /** Whether the suggestion should populate the prompt when clicked. */
+    readonly setPromptOnClick: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    /** The state of the thread suggestion. */
+    protected readonly state: ng_primitives_state.CreatedState<NgpThreadSuggestion>;
+    submitSuggestion(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpThreadSuggestion, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpThreadSuggestion, "button[ngpThreadSuggestion]", ["ngpThreadSuggestion"], { "suggestion": { "alias": "ngpThreadSuggestion"; "required": false; "isSignal": true; }; "setPromptOnClick": { "alias": "ngpThreadSuggestionSetPromptOnClick"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Provides the PromptComposer state.
+ */
+declare const providePromptComposerState: (options?: ng_primitives_state.CreateStateProviderOptions) => _angular_core.FactoryProvider;
+/**
+ * Injects the PromptComposer state.
+ */
+declare const injectPromptComposerState: <U = NgpPromptComposer>(injectOptions?: _angular_core.InjectOptions) => _angular_core.Signal<ng_primitives_state.State<U>>;
+
+/**
+ * Provides the PromptComposerDictation state.
+ */
+declare const providePromptComposerDictationState: (options?: ng_primitives_state.CreateStateProviderOptions) => _angular_core.FactoryProvider;
+/**
+ * Injects the PromptComposerDictation state.
+ */
+declare const injectPromptComposerDictationState: <U = NgpPromptComposerDictation>(injectOptions?: _angular_core.InjectOptions) => _angular_core.Signal<ng_primitives_state.State<U>>;
+
+/**
+ * Provides the PromptComposerInput state.
+ */
+declare const providePromptComposerInputState: (options?: ng_primitives_state.CreateStateProviderOptions) => _angular_core.FactoryProvider;
+/**
+ * Injects the PromptComposerInput state.
+ */
+declare const injectPromptComposerInputState: <U = NgpPromptComposerInput>(injectOptions?: _angular_core.InjectOptions) => _angular_core.Signal<ng_primitives_state.State<U>>;
+
+/**
+ * Provides the PromptComposerSubmit state.
+ */
+declare const providePromptComposerSubmitState: (options?: ng_primitives_state.CreateStateProviderOptions) => _angular_core.FactoryProvider;
+/**
+ * Injects the PromptComposerSubmit state.
+ */
+declare const injectPromptComposerSubmitState: <U = NgpPromptComposerSubmit>(injectOptions?: _angular_core.InjectOptions) => _angular_core.Signal<ng_primitives_state.State<U>>;
+
+/**
+ * Provides the Thread state.
+ */
+declare const provideThreadState: (options?: ng_primitives_state.CreateStateProviderOptions) => _angular_core.FactoryProvider;
+/**
+ * Injects the Thread state.
+ */
+declare const injectThreadState: <U = NgpThread>(injectOptions?: _angular_core.InjectOptions) => _angular_core.Signal<ng_primitives_state.State<U>>;
+
+/**
+ * Provides the ThreadSuggestion state.
+ */
+declare const provideThreadSuggestionState: (options?: ng_primitives_state.CreateStateProviderOptions) => _angular_core.FactoryProvider;
+/**
+ * Injects the ThreadSuggestion state.
+ */
+declare const injectThreadSuggestionState: <U = NgpThreadSuggestion>(injectOptions?: _angular_core.InjectOptions) => _angular_core.Signal<ng_primitives_state.State<U>>;
+
+/**
+ * Provides the ThreadViewport state.
+ */
+declare const provideThreadViewportState: (options?: ng_primitives_state.CreateStateProviderOptions) => _angular_core.FactoryProvider;
+/**
+ * Injects the ThreadViewport state.
+ */
+declare const injectThreadViewportState: <U = NgpThreadViewport>(injectOptions?: _angular_core.InjectOptions) => _angular_core.Signal<ng_primitives_state.State<U>>;
+
+/**
+ * Provides the ThreadMessage state.
+ */
+declare const provideThreadMessageState: (options?: ng_primitives_state.CreateStateProviderOptions) => _angular_core.FactoryProvider;
+/**
+ * Injects the ThreadMessage state.
+ */
+declare const injectThreadMessageState: <U = NgpThreadMessage>(injectOptions?: _angular_core.InjectOptions) => _angular_core.Signal<ng_primitives_state.State<U>>;
+
+export { NgpPromptComposer, NgpPromptComposerDictation, NgpPromptComposerInput, NgpPromptComposerSubmit, NgpThread, NgpThreadMessage, NgpThreadSuggestion, NgpThreadViewport, injectPromptComposerDictationState, injectPromptComposerInputState, injectPromptComposerState, injectPromptComposerSubmitState, injectThreadMessageState, injectThreadState, injectThreadSuggestionState, injectThreadViewportState, providePromptComposerDictationState, providePromptComposerInputState, providePromptComposerState, providePromptComposerSubmitState, provideThreadMessageState, provideThreadState, provideThreadSuggestionState, provideThreadViewportState };

package/autofill/index.d.ts

@@ -1 +1,62 @@
-export { NgpAutofill } from './autofill/autofill';
+import * as _angular_core from '@angular/core';
+import { Signal } from '@angular/core';
+
+/**
+ * Apply the `ngpAutofill` directive to an element to detect browser autofill.
+ */
+declare class NgpAutofill {
+    /**
+     * Event emitted when the autofill state changes.
+     */
+    readonly autofillChange: _angular_core.OutputEmitterRef<boolean>;
+    /**
+     * The autofill state.
+     */
+    private readonly state;
+    /**
+     * Whether the element is autofilled.
+     */
+    readonly autofilled: _angular_core.WritableSignal<boolean>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpAutofill, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpAutofill, "[ngpAutofill]", ["ngpAutofill"], {}, { "autofillChange": "ngpAutofill"; }, never, never, true, never>;
+}
+
+interface NgpAutofillState {
+    /**
+     * Whether the element is autofilled.
+     */
+    readonly autofilled: Signal<boolean>;
+}
+interface NgpAutofillProps {
+    /**
+     * Callback fired when the autofill state changes.
+     */
+    onAutofillChange?: (value: boolean) => void;
+}
+declare const NgpAutofillStateToken: _angular_core.InjectionToken<_angular_core.WritableSignal<{
+    autofilled: _angular_core.WritableSignal<boolean>;
+}>>;
+declare const ngpAutofill: ({ onAutofillChange }: NgpAutofillProps) => {
+    autofilled: _angular_core.WritableSignal<boolean>;
+};
+declare const injectAutofillState: {
+    (): Signal<{
+        autofilled: _angular_core.WritableSignal<boolean>;
+    }>;
+    (options: {
+        hoisted: true;
+    }): Signal<{
+        autofilled: _angular_core.WritableSignal<boolean>;
+    } | null>;
+    (options?: {
+        hoisted?: boolean;
+    }): Signal<{
+        autofilled: _angular_core.WritableSignal<boolean>;
+    } | null>;
+};
+declare const provideAutofillState: (opts?: {
+    inherit?: boolean;
+}) => _angular_core.FactoryProvider;
+
+export { NgpAutofill, NgpAutofillStateToken, injectAutofillState, ngpAutofill, provideAutofillState };
+export type { NgpAutofillProps, NgpAutofillState };

package/avatar/index.d.ts

@@ -1,5 +1,155 @@
-export { NgpAvatarFallback } from './avatar-fallback/avatar-fallback';
-export { NgpAvatarImage } from './avatar-image/avatar-image';
-export { NgpAvatar, NgpAvatarStatus } from './avatar/avatar';
-export { injectAvatarState, provideAvatarState } from './avatar/avatar-state';
-export { NgpAvatarConfig, provideAvatarConfig } from './config/avatar-config';
+import * as _angular_core from '@angular/core';
+import { Signal, Provider } from '@angular/core';
+import { NumberInput } from '@angular/cdk/coercion';
+
+/**
+ * Apply the `ngpAvatarFallback` directive to an element that represents the user in the absence of an image. This is typically the user's initials.
+ */
+declare class NgpAvatarFallback {
+    /**
+     * Access the global configuration.
+     */
+    private readonly config;
+    /**
+     * Define a delay before the fallback is shown. This is useful to only show the fallback for those with slower connections.
+     * @default 0
+     */
+    readonly delay: _angular_core.InputSignalWithTransform<number, NumberInput>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpAvatarFallback, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpAvatarFallback, "[ngpAvatarFallback]", ["ngpAvatarFallback"], { "delay": { "alias": "ngpAvatarFallbackDelay"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface NgpAvatarFallbackState {
+}
+interface NgpAvatarFallbackProps {
+    /**
+     * The delay before showing the fallback.
+     */
+    delay?: Signal<number>;
+}
+declare const NgpAvatarFallbackStateToken: _angular_core.InjectionToken<_angular_core.WritableSignal<{}>>;
+declare const ngpAvatarFallback: ({}: NgpAvatarFallbackProps) => {};
+declare const injectAvatarFallbackState: {
+    (): Signal<{}>;
+    (options: {
+        hoisted: true;
+    }): Signal<{} | null>;
+    (options?: {
+        hoisted?: boolean;
+    }): Signal<{} | null>;
+};
+declare const provideAvatarFallbackState: (opts?: {
+    inherit?: boolean;
+}) => _angular_core.FactoryProvider;
+
+/**
+ * Apply the `ngpAvatarImage` directive to an element that represents the avatar image. This would typically be an `img` element or a `div` with a background image.
+ */
+declare class NgpAvatarImage {
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpAvatarImage, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpAvatarImage, "img[ngpAvatarImage]", ["ngpAvatarImage"], {}, {}, never, never, true, never>;
+}
+
+interface NgpAvatarImageState {
+}
+interface NgpAvatarImageProps {
+}
+declare const NgpAvatarImageStateToken: _angular_core.InjectionToken<_angular_core.WritableSignal<{}>>;
+declare const ngpAvatarImage: ({}: NgpAvatarImageProps) => {};
+declare const injectAvatarImageState: {
+    (): _angular_core.Signal<{}>;
+    (options: {
+        hoisted: true;
+    }): _angular_core.Signal<{} | null>;
+    (options?: {
+        hoisted?: boolean;
+    }): _angular_core.Signal<{} | null>;
+};
+declare const provideAvatarImageState: (opts?: {
+    inherit?: boolean;
+}) => _angular_core.FactoryProvider;
+
+interface NgpAvatarState {
+    /**
+     * The avatar status.
+     */
+    status: Signal<NgpAvatarStatus>;
+    /**
+     * Set the avatar status.
+     */
+    setStatus(status: NgpAvatarStatus): void;
+}
+interface NgpAvatarProps {
+}
+declare const NgpAvatarStateToken: _angular_core.InjectionToken<_angular_core.WritableSignal<{
+    status: _angular_core.WritableSignal<NgpAvatarStatus>;
+    setStatus: (newStatus: NgpAvatarStatus) => void;
+}>>;
+declare const ngpAvatar: ({}: NgpAvatarProps) => {
+    status: _angular_core.WritableSignal<NgpAvatarStatus>;
+    setStatus: (newStatus: NgpAvatarStatus) => void;
+};
+declare const injectAvatarState: {
+    (): Signal<{
+        status: _angular_core.WritableSignal<NgpAvatarStatus>;
+        setStatus: (newStatus: NgpAvatarStatus) => void;
+    }>;
+    (options: {
+        hoisted: true;
+    }): Signal<{
+        status: _angular_core.WritableSignal<NgpAvatarStatus>;
+        setStatus: (newStatus: NgpAvatarStatus) => void;
+    } | null>;
+    (options?: {
+        hoisted?: boolean;
+    }): Signal<{
+        status: _angular_core.WritableSignal<NgpAvatarStatus>;
+        setStatus: (newStatus: NgpAvatarStatus) => void;
+    } | null>;
+};
+declare const provideAvatarState: (opts?: {
+    inherit?: boolean;
+}) => _angular_core.FactoryProvider;
+declare enum NgpAvatarStatus {
+    Idle = "idle",
+    Loading = "loading",
+    Loaded = "loaded",
+    Error = "error"
+}
+
+/**
+ * Apply the `ngpAvatar` directive to an element that represents the avatar. This directive is a container for the image and/or fallback.
+ */
+declare class NgpAvatar {
+    /**
+     * The avatar state.
+     */
+    private readonly state;
+    /**
+     * Set the avatar status.
+     * @param status The status to set.
+     * @internal
+     */
+    setStatus(status: NgpAvatarStatus): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgpAvatar, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgpAvatar, "[ngpAvatar]", ["ngpAvatar"], {}, {}, never, never, true, never>;
+}
+
+interface NgpAvatarConfig {
+    /**
+     * Define a delay before the fallback is shown. This is useful to only show the fallback for those with slower connections.
+     * @default 0
+     */
+    delay: number;
+}
+/**
+ * Provide the avatar config
+ * @param config The avatar config
+ * @returns The provider
+ */
+declare function provideAvatarConfig(config: Partial<NgpAvatarConfig>): Provider[];
+
+export { NgpAvatar, NgpAvatarFallback, NgpAvatarFallbackStateToken, NgpAvatarImage, NgpAvatarImageStateToken, NgpAvatarStateToken, NgpAvatarStatus, injectAvatarFallbackState, injectAvatarImageState, injectAvatarState, ngpAvatar, ngpAvatarFallback, ngpAvatarImage, provideAvatarConfig, provideAvatarFallbackState, provideAvatarImageState, provideAvatarState };
+export type { NgpAvatarConfig, NgpAvatarFallbackProps, NgpAvatarFallbackState, NgpAvatarImageProps, NgpAvatarImageState, NgpAvatarProps, NgpAvatarState };