ng-primitives 0.43.1 → 0.45.0

package/a11y/active-descendant/active-descendant.d.ts

@@ -0,0 +1,38 @@
+import { Signal } from '@angular/core';
+interface ActiveDescendantManagerOptions<T extends NgpActivatable> {
+    /**
+     * The disabled state of the active descendant group.
+     * @default false
+     */
+    disabled?: Signal<boolean>;
+    /**
+     * The items in the active descendant group.
+     */
+    items: Signal<T[]>;
+    /**
+     * Whether active descendant should wrap around.
+     * @default false
+     */
+    wrap?: Signal<boolean>;
+}
+export interface NgpActivatable {
+    /**
+     * The id of the item.
+     */
+    id: Signal<string>;
+    /**
+     * Whether the item is disabled.
+     */
+    disabled?: Signal<boolean>;
+}
+export declare function activeDescendantManager<T extends NgpActivatable>(options: ActiveDescendantManagerOptions<T>): {
+    activeDescendant: Signal<string | undefined>;
+    activeItem: Signal<T | undefined>;
+    activate: (item: T | undefined) => void;
+    first: () => void;
+    last: () => void;
+    next: () => void;
+    previous: () => void;
+    reset: () => void;
+};
+export {};

package/a11y/index.d.ts

@@ -1,2 +1,3 @@
+export * from './active-descendant/active-descendant';
 export * from './visually-hidden/visually-hidden';
-export { provideVisuallyHiddenState, injectVisuallyHiddenState, } from './visually-hidden/visually-hidden-state';
+export { injectVisuallyHiddenState, provideVisuallyHiddenState, } from './visually-hidden/visually-hidden-state';

package/combobox/README.md

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

package/combobox/combobox/combobox-state.d.ts

@@ -0,0 +1,60 @@
+import type { NgpCombobox } from './combobox';
+/**
+ * The state token  for the Combobox primitive.
+ */
+export declare const NgpComboboxStateToken: import("@angular/core").InjectionToken<NgpCombobox>;
+/**
+ * Provides the Combobox state.
+ */
+export declare const provideComboboxState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
+/**
+ * Injects the Combobox state.
+ */
+export declare const injectComboboxState: <U = {
+    readonly elementRef: import("@angular/core").ElementRef<HTMLElement>;
+    readonly injector: import("@angular/core").Injector;
+    readonly value: import("@angular/core").InputSignal<any>;
+    readonly valueChange: import("@angular/core").OutputEmitterRef<any>;
+    readonly multiple: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
+    readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
+    readonly openChange: import("@angular/core").OutputEmitterRef<boolean>;
+    readonly compareWith: import("@angular/core").InputSignal<(a: any | undefined, b: any | undefined) => boolean>;
+    readonly placement: import("@angular/core").InputSignal<import("@floating-ui/dom").Placement>;
+    readonly input: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxInput | undefined>;
+    readonly button: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxButton | undefined>;
+    readonly portal: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxPortal | undefined>;
+    readonly dropdown: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxDropdown | undefined>;
+    readonly options: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxOption[]>;
+    readonly overlay: import("@angular/core").Signal<import("ng-primitives/portal").NgpOverlay<void> | null | undefined>;
+    readonly open: import("@angular/core").Signal<boolean>;
+    readonly activeDescendantManager: {
+        activeDescendant: import("@angular/core").Signal<string | undefined>;
+        activeItem: import("@angular/core").Signal<import("ng-primitives/combobox").NgpComboboxOption | undefined>;
+        activate: (item: import("ng-primitives/combobox").NgpComboboxOption | undefined) => void;
+        first: () => void;
+        last: () => void;
+        next: () => void;
+        previous: () => void;
+        reset: () => void;
+    };
+    readonly state: import("ng-primitives/state").CreatedState<NgpCombobox>;
+    openDropdown: () => Promise<void>;
+    closeDropdown: () => void;
+    toggleDropdown: () => void;
+    selectOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+    deselectOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+    toggleOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+    isOptionSelected: (option: import("ng-primitives/combobox").NgpComboboxOption) => boolean;
+    activateNextOption: () => void;
+    activatePreviousOption: () => void;
+    registerPortal: (portal: import("ng-primitives/combobox").NgpComboboxPortal) => void;
+    registerInput: (input: import("ng-primitives/combobox").NgpComboboxInput) => void;
+    registerButton: (button: import("ng-primitives/combobox").NgpComboboxButton) => void;
+    registerDropdown: (dropdown: import("ng-primitives/combobox").NgpComboboxDropdown) => void;
+    registerOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+    unregisterOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+}>(injectOptions?: import("@angular/core").InjectOptions) => import("@angular/core").Signal<import("ng-primitives/state").State<U>>;
+/**
+ * The Combobox state registration function.
+ */
+export declare const comboboxState: <U>(state: U) => import("ng-primitives/state").CreatedState<U>;

package/combobox/combobox/combobox.d.ts

@@ -0,0 +1,182 @@
+import { BooleanInput } from '@angular/cdk/coercion';
+import { Injector } from '@angular/core';
+import { Placement } from '@floating-ui/dom';
+import type { NgpComboboxButton } from '../combobox-button/combobox-button';
+import type { NgpComboboxDropdown } from '../combobox-dropdown/combobox-dropdown';
+import type { NgpComboboxInput } from '../combobox-input/combobox-input';
+import { NgpComboboxOption } from '../combobox-option/combobox-option';
+import type { NgpComboboxPortal } from '../combobox-portal/combobox-portal';
+import * as i0 from "@angular/core";
+/**
+ * Ideally we would use a generic type here, unfortunately, unlike in React,
+ * we cannot infer the type based on another input. For example, if multiple
+ * is true, we cannot infer that the value is an array of T. Using a union
+ * type is not ideal either because it requires the user to handle multiple cases.
+ * Using a generic also isn't ideal because we need to use T as both an array and
+ * a single value.
+ *
+ * Any seems to be used by Angular Material, ng-select, and other libraries
+ * so we will use it here as well.
+ */
+type T = any;
+export declare class NgpCombobox {
+    /** @internal Access the combobox element. */
+    readonly elementRef: import("@angular/core").ElementRef<HTMLElement>;
+    /** Access the injector. */
+    protected readonly injector: Injector;
+    /** The value of the combobox. */
+    readonly value: import("@angular/core").InputSignal<any>;
+    /** Event emitted when the value changes. */
+    readonly valueChange: import("@angular/core").OutputEmitterRef<any>;
+    /** Whether the combobox is multiple selection. */
+    readonly multiple: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /** Whether the combobox is disabled. */
+    readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /** Emit when the dropdown open state changes. */
+    readonly openChange: import("@angular/core").OutputEmitterRef<boolean>;
+    /** The comparator function used to compare options. */
+    readonly compareWith: import("@angular/core").InputSignal<(a: T | undefined, b: T | undefined) => boolean>;
+    /** The position of the dropdown. */
+    readonly placement: import("@angular/core").InputSignal<Placement>;
+    /**
+     * Store the combobox input
+     * @internal
+     */
+    readonly input: import("@angular/core").WritableSignal<NgpComboboxInput | undefined>;
+    /**
+     * Store the combobox button.
+     * @internal
+     */
+    readonly button: import("@angular/core").WritableSignal<NgpComboboxButton | undefined>;
+    /**
+     * Store the combobox portal.
+     * @internal
+     */
+    readonly portal: import("@angular/core").WritableSignal<NgpComboboxPortal | undefined>;
+    /**
+     * Store the combobox dropdown.
+     * @internal
+     */
+    readonly dropdown: import("@angular/core").WritableSignal<NgpComboboxDropdown | undefined>;
+    /**
+     * Store the combobox options.
+     * @internal
+     */
+    readonly options: import("@angular/core").WritableSignal<NgpComboboxOption[]>;
+    /**
+     * Access the overlay
+     * @internal
+     */
+    readonly overlay: import("@angular/core").Signal<import("ng-primitives/portal").NgpOverlay<void> | null | undefined>;
+    /**
+     * The open state of the combobox.
+     * @internal
+     */
+    readonly open: import("@angular/core").Signal<boolean>;
+    /**
+     * The active key descendant manager.
+     * @internal
+     */
+    readonly activeDescendantManager: {
+        activeDescendant: import("@angular/core").Signal<string | undefined>;
+        activeItem: import("@angular/core").Signal<NgpComboboxOption | undefined>;
+        activate: (item: NgpComboboxOption | undefined) => void;
+        first: () => void;
+        last: () => void;
+        next: () => void;
+        previous: () => void;
+        reset: () => void;
+    };
+    /** The state of the combobox. */
+    protected readonly state: import("ng-primitives/state").CreatedState<NgpCombobox>;
+    constructor();
+    /**
+     * Open the dropdown.
+     * @internal
+     */
+    openDropdown(): Promise<void>;
+    /**
+     * Close the dropdown.
+     * @internal
+     */
+    closeDropdown(): void;
+    /**
+     * Toggle the dropdown.
+     * @internal
+     */
+    toggleDropdown(): void;
+    /**
+     * Select an option.
+     * @param option The option to select.
+     * @internal
+     */
+    selectOption(option: NgpComboboxOption): void;
+    /**
+     * Deselect an option.
+     * @param option The option to deselect.
+     * @internal
+     */
+    deselectOption(option: NgpComboboxOption): void;
+    /**
+     * Toggle the selection of an option.
+     * @param option The option to toggle.
+     * @internal
+     */
+    toggleOption(option: NgpComboboxOption): void;
+    /**
+     * Determine if an option is selected.
+     * @param option The option to check.
+     * @internal
+     */
+    isOptionSelected(option: NgpComboboxOption): boolean;
+    /**
+     * Activate the next option in the list if there is one.
+     * If there is no option currently active, activate the selected option or the first option.
+     * @internal
+     */
+    activateNextOption(): void;
+    /**
+     * Activate the previous option in the list if there is one.
+     * @internal
+     */
+    activatePreviousOption(): void;
+    /**
+     * Register the dropdown portal with the combobox.
+     * @param portal The dropdown portal.
+     * @internal
+     */
+    registerPortal(portal: NgpComboboxPortal): void;
+    /**
+     * Register the combobox input with the combobox.
+     * @param input The combobox input.
+     * @internal
+     */
+    registerInput(input: NgpComboboxInput): void;
+    /**
+     * Register the combobox button with the combobox.
+     * @param button The combobox button.
+     * @internal
+     */
+    registerButton(button: NgpComboboxButton): void;
+    /**
+     * Register the dropdown with the combobox.
+     * @param dropdown The dropdown to register.
+     * @internal
+     */
+    registerDropdown(dropdown: NgpComboboxDropdown): void;
+    /**
+     * Register an option with the combobox.
+     * @param option The option to register.
+     * @internal
+     */
+    registerOption(option: NgpComboboxOption): void;
+    /**
+     * Unregister an option from the combobox.
+     * @param option The option to unregister.
+     * @internal
+     */
+    unregisterOption(option: NgpComboboxOption): 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; }; "compareWith": { "alias": "ngpComboboxCompareWith"; "required": false; "isSignal": true; }; "placement": { "alias": "ngpComboboxDropdownPlacement"; "required": false; "isSignal": true; }; }, { "valueChange": "ngpComboboxValueChange"; "openChange": "ngpComboboxOpenChange"; }, never, never, true, never>;
+}
+export {};

package/combobox/combobox-button/combobox-button.d.ts

@@ -0,0 +1,61 @@
+import * as i0 from "@angular/core";
+export declare class NgpComboboxButton {
+    /** Access the combobox state. */
+    protected readonly state: import("@angular/core").Signal<import("ng-primitives/state").State<{
+        readonly elementRef: import("@angular/core").ElementRef<HTMLElement>;
+        readonly injector: import("@angular/core").Injector;
+        readonly value: import("@angular/core").InputSignal<any>;
+        readonly valueChange: import("@angular/core").OutputEmitterRef<any>;
+        readonly multiple: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
+        readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
+        readonly openChange: import("@angular/core").OutputEmitterRef<boolean>;
+        readonly compareWith: import("@angular/core").InputSignal<(a: any | undefined, b: any | undefined) => boolean>;
+        readonly placement: import("@angular/core").InputSignal<import("@floating-ui/dom").Placement>;
+        readonly input: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxInput | undefined>;
+        readonly button: import("@angular/core").WritableSignal<NgpComboboxButton | undefined>;
+        readonly portal: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxPortal | undefined>;
+        readonly dropdown: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxDropdown | undefined>;
+        readonly options: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxOption[]>;
+        readonly overlay: import("@angular/core").Signal<import("ng-primitives/portal").NgpOverlay<void> | null | undefined>;
+        readonly open: import("@angular/core").Signal<boolean>;
+        readonly activeDescendantManager: {
+            activeDescendant: import("@angular/core").Signal<string | undefined>;
+            activeItem: import("@angular/core").Signal<import("ng-primitives/combobox").NgpComboboxOption | undefined>;
+            activate: (item: import("ng-primitives/combobox").NgpComboboxOption | undefined) => void;
+            first: () => void;
+            last: () => void;
+            next: () => void;
+            previous: () => void;
+            reset: () => void;
+        };
+        readonly state: import("ng-primitives/state").CreatedState<import("ng-primitives/combobox").NgpCombobox>;
+        openDropdown: () => Promise<void>;
+        closeDropdown: () => void;
+        toggleDropdown: () => void;
+        selectOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+        deselectOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+        toggleOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+        isOptionSelected: (option: import("ng-primitives/combobox").NgpComboboxOption) => boolean;
+        activateNextOption: () => void;
+        activatePreviousOption: () => void;
+        registerPortal: (portal: import("ng-primitives/combobox").NgpComboboxPortal) => void;
+        registerInput: (input: import("ng-primitives/combobox").NgpComboboxInput) => void;
+        registerButton: (button: NgpComboboxButton) => void;
+        registerDropdown: (dropdown: import("ng-primitives/combobox").NgpComboboxDropdown) => void;
+        registerOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+        unregisterOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+    }>>;
+    /**
+     * Access the element reference.
+     * @internal
+     */
+    readonly elementRef: import("@angular/core").ElementRef<HTMLButtonElement>;
+    /** The id of the button. */
+    readonly id: import("@angular/core").InputSignal<string>;
+    /** The id of the dropdown. */
+    readonly dropdownId: import("@angular/core").Signal<string | undefined>;
+    constructor();
+    protected toggleDropdown(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpComboboxButton, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpComboboxButton, "[ngpComboboxButton]", ["ngpComboboxButton"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/combobox/combobox-dropdown/combobox-dropdown.d.ts

@@ -0,0 +1,65 @@
+import * as i0 from "@angular/core";
+import * as i1 from "ng-primitives/internal";
+export declare class NgpComboboxDropdown {
+    /** Access the combobox state. */
+    protected readonly state: import("@angular/core").Signal<import("ng-primitives/state").State<{
+        readonly elementRef: import("@angular/core").ElementRef<HTMLElement>;
+        readonly injector: import("@angular/core").Injector;
+        readonly value: import("@angular/core").InputSignal<any>;
+        readonly valueChange: import("@angular/core").OutputEmitterRef<any>;
+        readonly multiple: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
+        readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
+        readonly openChange: import("@angular/core").OutputEmitterRef<boolean>;
+        readonly compareWith: import("@angular/core").InputSignal<(a: any | undefined, b: any | undefined) => boolean>;
+        readonly placement: import("@angular/core").InputSignal<import("@floating-ui/dom").Placement>;
+        readonly input: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxInput | undefined>;
+        readonly button: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxButton | undefined>;
+        readonly portal: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxPortal | undefined>;
+        readonly dropdown: import("@angular/core").WritableSignal<NgpComboboxDropdown | undefined>;
+        readonly options: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxOption[]>;
+        readonly overlay: import("@angular/core").Signal<import("ng-primitives/portal").NgpOverlay<void> | null | undefined>;
+        readonly open: import("@angular/core").Signal<boolean>;
+        readonly activeDescendantManager: {
+            activeDescendant: import("@angular/core").Signal<string | undefined>;
+            activeItem: import("@angular/core").Signal<import("ng-primitives/combobox").NgpComboboxOption | undefined>;
+            activate: (item: import("ng-primitives/combobox").NgpComboboxOption | undefined) => void;
+            first: () => void;
+            last: () => void;
+            next: () => void;
+            previous: () => void;
+            reset: () => void;
+        };
+        readonly state: import("ng-primitives/state").CreatedState<import("ng-primitives/combobox").NgpCombobox>;
+        openDropdown: () => Promise<void>;
+        closeDropdown: () => void;
+        toggleDropdown: () => void;
+        selectOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+        deselectOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+        toggleOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+        isOptionSelected: (option: import("ng-primitives/combobox").NgpComboboxOption) => boolean;
+        activateNextOption: () => void;
+        activatePreviousOption: () => void;
+        registerPortal: (portal: import("ng-primitives/combobox").NgpComboboxPortal) => void;
+        registerInput: (input: import("ng-primitives/combobox").NgpComboboxInput) => void;
+        registerButton: (button: import("ng-primitives/combobox").NgpComboboxButton) => void;
+        registerDropdown: (dropdown: NgpComboboxDropdown) => void;
+        registerOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+        unregisterOption: (option: import("ng-primitives/combobox").NgpComboboxOption) => void;
+    }>>;
+    /** The dimensions of the combobox. */
+    protected readonly comboboxDimensions: import("@angular/core").Signal<import("ng-primitives/resize").Dimensions>;
+    /** The dimensions of the combobox. */
+    protected readonly inputDimensions: import("@angular/core").Signal<import("ng-primitives/resize").Dimensions>;
+    /** Store the combobox button dimensions. */
+    protected readonly buttonDimensions: import("@angular/core").Signal<import("ng-primitives/resize").Dimensions>;
+    /**
+     * Access the element reference.
+     * @internal
+     */
+    readonly elementRef: import("@angular/core").ElementRef<HTMLElement>;
+    /** The id of the dropdown. */
+    readonly id: import("@angular/core").InputSignal<string>;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpComboboxDropdown, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpComboboxDropdown, "[ngpComboboxDropdown]", ["ngpComboboxDropdown"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.NgpExitAnimation; inputs: {}; outputs: {}; }]>;
+}

package/combobox/combobox-input/combobox-input.d.ts

@@ -0,0 +1,79 @@
+import type { NgpComboboxOption } from '../combobox-option/combobox-option';
+import * as i0 from "@angular/core";
+export declare class NgpComboboxInput {
+    /** Access the combobox state. */
+    protected readonly state: import("@angular/core").Signal<import("ng-primitives/state").State<{
+        readonly elementRef: import("@angular/core").ElementRef<HTMLElement>;
+        readonly injector: import("@angular/core").Injector;
+        readonly value: import("@angular/core").InputSignal<any>;
+        readonly valueChange: import("@angular/core").OutputEmitterRef<any>;
+        readonly multiple: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
+        readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
+        readonly openChange: import("@angular/core").OutputEmitterRef<boolean>;
+        readonly compareWith: import("@angular/core").InputSignal<(a: any | undefined, b: any | undefined) => boolean>;
+        readonly placement: import("@angular/core").InputSignal<import("@floating-ui/dom").Placement>;
+        readonly input: import("@angular/core").WritableSignal<NgpComboboxInput | undefined>;
+        readonly button: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxButton | undefined>;
+        readonly portal: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxPortal | undefined>;
+        readonly dropdown: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxDropdown | undefined>;
+        readonly options: import("@angular/core").WritableSignal<NgpComboboxOption[]>;
+        readonly overlay: import("@angular/core").Signal<import("ng-primitives/portal").NgpOverlay<void> | null | undefined>;
+        readonly open: import("@angular/core").Signal<boolean>;
+        readonly activeDescendantManager: {
+            activeDescendant: import("@angular/core").Signal<string | undefined>;
+            activeItem: import("@angular/core").Signal<NgpComboboxOption | undefined>;
+            activate: (item: NgpComboboxOption | undefined) => void;
+            first: () => void;
+            last: () => void;
+            next: () => void;
+            previous: () => void;
+            reset: () => void;
+        };
+        readonly state: import("ng-primitives/state").CreatedState<import("ng-primitives/combobox").NgpCombobox>;
+        openDropdown: () => Promise<void>;
+        closeDropdown: () => void;
+        toggleDropdown: () => void;
+        selectOption: (option: NgpComboboxOption) => void;
+        deselectOption: (option: NgpComboboxOption) => void;
+        toggleOption: (option: NgpComboboxOption) => void;
+        isOptionSelected: (option: NgpComboboxOption) => boolean;
+        activateNextOption: () => void;
+        activatePreviousOption: () => void;
+        registerPortal: (portal: import("ng-primitives/combobox").NgpComboboxPortal) => void;
+        registerInput: (input: NgpComboboxInput) => void;
+        registerButton: (button: import("ng-primitives/combobox").NgpComboboxButton) => void;
+        registerDropdown: (dropdown: import("ng-primitives/combobox").NgpComboboxDropdown) => void;
+        registerOption: (option: NgpComboboxOption) => void;
+        unregisterOption: (option: NgpComboboxOption) => void;
+    }>>;
+    /**
+     * Access the element reference.
+     * @internal
+     */
+    readonly elementRef: import("@angular/core").ElementRef<HTMLInputElement>;
+    /** The id of the input. */
+    readonly id: import("@angular/core").InputSignal<string>;
+    /**
+     * Extract the string representation of the value.
+     */
+    readonly displayWith: import("@angular/core").InputSignal<(value: any) => string>;
+    /** The id of the dropdown. */
+    readonly dropdownId: import("@angular/core").Signal<string | undefined>;
+    /** The id of the active descendant. */
+    protected readonly activeDescendant: import("@angular/core").Signal<string | undefined>;
+    /** Determine if the pointer was used to focus the input. */
+    protected pointerFocused: boolean;
+    constructor();
+    /** Handle keydown events for accessibility. */
+    protected handleKeydown(event: KeyboardEvent): void;
+    protected closeDropdown(event: FocusEvent): void;
+    /**
+     * Focus the input field
+     * @internal
+     */
+    focus(): void;
+    protected highlightText(): void;
+    protected handlePointerDown(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpComboboxInput, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpComboboxInput, "input[ngpComboboxInput]", ["ngpComboboxInput"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "displayWith": { "alias": "displayWith"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/combobox/combobox-option/combobox-option.d.ts

@@ -0,0 +1,94 @@
+import { BooleanInput } from '@angular/cdk/coercion';
+import { OnDestroy, OnInit } from '@angular/core';
+import { NgpActivatable } from 'ng-primitives/a11y';
+import * as i0 from "@angular/core";
+export declare class NgpComboboxOption implements OnInit, OnDestroy, NgpActivatable {
+    /** Access the combobox state. */
+    protected readonly state: import("@angular/core").Signal<import("ng-primitives/state").State<{
+        readonly elementRef: import("@angular/core").ElementRef<HTMLElement>;
+        readonly injector: import("@angular/core").Injector;
+        readonly value: import("@angular/core").InputSignal<any>;
+        readonly valueChange: import("@angular/core").OutputEmitterRef<any>;
+        readonly multiple: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+        readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+        readonly openChange: import("@angular/core").OutputEmitterRef<boolean>;
+        readonly compareWith: import("@angular/core").InputSignal<(a: any | undefined, b: any | undefined) => boolean>;
+        readonly placement: import("@angular/core").InputSignal<import("@floating-ui/dom").Placement>;
+        readonly input: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxInput | undefined>;
+        readonly button: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxButton | undefined>;
+        readonly portal: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxPortal | undefined>;
+        readonly dropdown: import("@angular/core").WritableSignal<import("ng-primitives/combobox").NgpComboboxDropdown | undefined>;
+        readonly options: import("@angular/core").WritableSignal<NgpComboboxOption[]>;
+        readonly overlay: import("@angular/core").Signal<import("ng-primitives/portal").NgpOverlay<void> | null | undefined>;
+        readonly open: import("@angular/core").Signal<boolean>;
+        readonly activeDescendantManager: {
+            activeDescendant: import("@angular/core").Signal<string | undefined>;
+            activeItem: import("@angular/core").Signal<NgpComboboxOption | undefined>;
+            activate: (item: NgpComboboxOption | undefined) => void;
+            first: () => void;
+            last: () => void;
+            next: () => void;
+            previous: () => void;
+            reset: () => void;
+        };
+        readonly state: import("ng-primitives/state").CreatedState<import("ng-primitives/combobox").NgpCombobox>;
+        openDropdown: () => Promise<void>;
+        closeDropdown: () => void;
+        toggleDropdown: () => void;
+        selectOption: (option: NgpComboboxOption) => void;
+        deselectOption: (option: NgpComboboxOption) => void;
+        toggleOption: (option: NgpComboboxOption) => void;
+        isOptionSelected: (option: NgpComboboxOption) => boolean;
+        activateNextOption: () => void;
+        activatePreviousOption: () => void;
+        registerPortal: (portal: import("ng-primitives/combobox").NgpComboboxPortal) => void;
+        registerInput: (input: import("ng-primitives/combobox").NgpComboboxInput) => void;
+        registerButton: (button: import("ng-primitives/combobox").NgpComboboxButton) => void;
+        registerDropdown: (dropdown: import("ng-primitives/combobox").NgpComboboxDropdown) => void;
+        registerOption: (option: NgpComboboxOption) => void;
+        unregisterOption: (option: NgpComboboxOption) => void;
+    }>>;
+    /**
+     * The element reference of the option.
+     * @internal
+     */
+    readonly elementRef: import("@angular/core").ElementRef<HTMLElement>;
+    /** The id of the option. */
+    readonly id: import("@angular/core").InputSignal<string>;
+    /** The value of the option. */
+    readonly value: import("@angular/core").InputSignal<any>;
+    /** The disabled state of the option. */
+    readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Whether this option is the active descendant.
+     * @internal
+     */
+    protected readonly active: import("@angular/core").Signal<boolean>;
+    /** Whether this option is selected. */
+    protected readonly selected: import("@angular/core").Signal<boolean>;
+    constructor();
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    /**
+     * Select the option.
+     * @internal
+     */
+    select(): void;
+    /**
+     * Scroll the option into view.
+     * @internal
+     */
+    scrollIntoView(): void;
+    /**
+     * Whenever the pointer enters the option, activate it.
+     * @internal
+     */
+    protected onPointerEnter(): void;
+    /**
+     * Whenever the pointer leaves the option, deactivate it.
+     * @internal
+     */
+    protected onPointerLeave(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpComboboxOption, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpComboboxOption, "[ngpComboboxOption]", ["ngpComboboxOption"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; "value": { "alias": "ngpComboboxOptionValue"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpComboboxOptionDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/combobox/combobox-portal/combobox-portal.d.ts

@@ -0,0 +1,35 @@
+import { OnDestroy } from '@angular/core';
+import { NgpOverlay } from 'ng-primitives/portal';
+import * as i0 from "@angular/core";
+export declare class NgpComboboxPortal implements OnDestroy {
+    /** Access the combobox state. */
+    private readonly state;
+    /** Access the template reference. */
+    private readonly templateRef;
+    /** Access the injector. */
+    private readonly injector;
+    /**
+     * The overlay that manages the popover
+     * @internal
+     */
+    readonly overlay: import("@angular/core").WritableSignal<NgpOverlay<void> | null>;
+    constructor();
+    /** Cleanup the portal. */
+    ngOnDestroy(): void;
+    /**
+     * Attach the portal.
+     * @internal
+     */
+    show(): Promise<void>;
+    /**
+     * Detach the portal.
+     * @internal
+     */
+    detach(): Promise<void>;
+    /**
+     * Create the overlay that will contain the dropdown
+     */
+    private createOverlay;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgpComboboxPortal, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpComboboxPortal, "[ngpComboboxPortal]", ["ngpComboboxPortal"], {}, {}, never, never, true, never>;
+}

package/combobox/index.d.ts

@@ -0,0 +1,7 @@
+export { NgpComboboxDropdown } from './combobox-dropdown/combobox-dropdown';
+export { NgpComboboxInput } from './combobox-input/combobox-input';
+export { NgpComboboxOption } from './combobox-option/combobox-option';
+export { NgpComboboxPortal } from './combobox-portal/combobox-portal';
+export { NgpCombobox } from './combobox/combobox';
+export { injectComboboxState, provideComboboxState } from './combobox/combobox-state';
+export { NgpComboboxButton } from './combobox-button/combobox-button';