ng-primitives 0.34.0 → 0.36.0

package/schematics/ng-generate/templates/toolbar/toolbar-button.__fileSuffix@dasherize__.ts.template

@@ -0,0 +1,58 @@
+import { Component } from '@angular/core';
+import { NgpButton } from 'ng-primitives/button';
+import { NgpRovingFocusItem } from 'ng-primitives/roving-focus';
+
+@Component({
+  selector: 'button[<%= prefix %>-toolbar-button]',
+  hostDirectives: [
+    { directive: NgpButton, inputs: ['disabled'] },
+    {
+      directive: NgpRovingFocusItem,
+      inputs: ['ngpRovingFocusItemDisabled:disabled'],
+    },
+  ],
+  host: {
+    type: 'button',
+  },
+  template: `
+    <ng-content />
+  `,
+  styles: `
+/* These styles rely on CSS variables that can be imported from ng-primitives/example-theme/index.css in your global styles */
+
+    :host {
+      display: flex;
+      width: 2rem;
+      height: 2rem;
+      align-items: center;
+      justify-content: center;
+      border-radius: 0.25rem;
+      border: 1px solid transparent;
+      background: transparent;
+      outline: none;
+      transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1);
+      box-sizing: border-box;
+      color: var(--ngp-text-primary);
+      cursor: pointer;
+    }
+
+    :host[data-hover] {
+      background-color: var(--ngp-background-hover);
+      border-color: var(--ngp-border);
+    }
+
+    :host[data-focus-visible] {
+      outline: 2px solid var(--ngp-focus-ring);
+    }
+
+    :host[data-press] {
+      background-color: var(--ngp-background-active);
+    }
+
+    :host[data-selected] {
+      background-color: var(--ngp-background-inverse);
+      color: var(--ngp-text-inverse);
+    }
+  `,
+})
+export class ToolbarButton<%= componentSuffix %> {}

package/schematics/ng-generate/templates/toolbar/toolbar.__fileSuffix@dasherize__.ts.template

@@ -0,0 +1,29 @@
+import { Component } from '@angular/core';
+import { NgpToolbar } from 'ng-primitives/toolbar';
+
+@Component({
+  selector: '<%= prefix %>-toolbar',
+  hostDirectives: [{ directive: NgpToolbar, inputs: ['ngpToolbarOrientation:orientation'] }],
+  template: `
+    <ng-content />
+  `,
+  styles: `
+/* These styles rely on CSS variables that can be imported from ng-primitives/example-theme/index.css in your global styles */
+
+    :host {
+      display: flex;
+      column-gap: 0.25rem;
+      align-items: center;
+      border-radius: 0.375rem;
+      background-color: var(--ngp-background);
+      box-shadow: var(--ngp-button-shadow);
+      padding: 0.25rem;
+    }
+
+    :host[data-orientation='vertical'] {
+      flex-direction: column;
+      row-gap: 0.25rem;
+    }
+  `,
+})
+export class Toolbar<%= componentSuffix %> {}

package/schematics/ng-generate/templates/tooltip/tooltip-trigger.__fileSuffix@dasherize__.ts.template

@@ -0,0 +1,35 @@
+import { Directive, input } from '@angular/core';
+import { injectTooltipTriggerState, NgpTooltipTrigger } from 'ng-primitives/tooltip';
+import { Tooltip } from './tooltip';
+
+@Directive({
+  selector: '[appTooltipTrigger]',
+  hostDirectives: [
+    {
+      directive: NgpTooltipTrigger,
+      inputs: [
+        'ngpTooltipTriggerPlacement:appTooltipTriggerPlacement',
+        'ngpTooltipTriggerDisabled:appTooltipTriggerDisabled',
+        'ngpTooltipTriggerOffset:appTooltipTriggerOffset',
+        'ngpTooltipTriggerShowDelay:appTooltipTriggerShowDelay',
+        'ngpTooltipTriggerHideDelay:appTooltipTriggerHideDelay',
+        'ngpTooltipTriggerFlip:appTooltipTriggerFlip',
+        'ngpTooltipTriggerContainer:appTooltipTriggerContainer',
+        'ngpTooltipTriggerContext:appTooltipTrigger',
+      ],
+    },
+  ],
+})
+export class TooltipTrigger {
+  /** Access the tooltip trigger */
+  private readonly tooltipTrigger = injectTooltipTriggerState();
+
+  /** Define the content of the tooltip */
+  readonly content = input.required<string>({
+    alias: 'appTooltipTrigger',
+  });
+
+  constructor() {
+    this.tooltipTrigger().tooltip.set(Tooltip);
+  }
+}

package/schematics/ng-generate/templates/tooltip/tooltip.__fileSuffix@dasherize__.ts.template

@@ -0,0 +1,60 @@
+import { Component } from '@angular/core';
+import { injectTooltipContext, NgpTooltip } from 'ng-primitives/tooltip';
+
+@Component({
+  selector: '<%= prefix %>-tooltip',
+  hostDirectives: [NgpTooltip],
+  template: `
+    {{ content }}
+  `,
+  styles: `
+/* These styles rely on CSS variables that can be imported from ng-primitives/example-theme/index.css in your global styles */
+
+    :host {
+      position: absolute;
+      max-width: 16rem;
+      border-radius: 0.5rem;
+      background-color: var(--ngp-background-inverse);
+      padding: 0.5rem 0.75rem;
+      border: none;
+      font-size: 0.75rem;
+      font-weight: 500;
+      color: var(--ngp-text-inverse);
+      transform-origin: var(--ngp-tooltip-transform-origin);
+    }
+
+    :host[data-enter] {
+      animation: tooltip-show 200ms ease-in-out;
+    }
+
+    :host[data-exit] {
+      animation: tooltip-hide 200ms ease-in-out;
+    }
+
+    @keyframes tooltip-show {
+      0% {
+        opacity: 0;
+        transform: scale(0.9);
+      }
+      100% {
+        opacity: 1;
+        transform: scale(1);
+      }
+    }
+
+    @keyframes tooltip-hide {
+      0% {
+        opacity: 1;
+        transform: scale(1);
+      }
+      100% {
+        opacity: 0;
+        transform: scale(0.9);
+      }
+    }
+  `,
+})
+export class Tooltip<%= componentSuffix %> {
+  /** Access the tooltip context where the content is stored. */
+  protected readonly content = injectTooltipContext<string>();
+}

package/search/search/search-state.d.ts

@@ -6,7 +6,7 @@ export declare const NgpSearchStateToken: import("@angular/core").InjectionToken
 /**
  * Provides the Search state.
  */
-export declare const provideSearchState: () => import("@angular/core").FactoryProvider;
+export declare const provideSearchState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
 /**
  * Injects the Search state.
  */

package/select/index.d.ts

@@ -1,2 +1,2 @@
 export { NgpSelect } from './select/select';
-export { NgpSelectToken, injectSelect } from './select/select-token';
+export { injectSelectState, provideSelectState } from './select/select-state';

package/select/select/select-state.d.ts

@@ -0,0 +1,20 @@
+import type { NgpSelect } from './select';
+/**
+ * The state token  for the Select primitive.
+ */
+export declare const NgpSelectStateToken: import("@angular/core").InjectionToken<NgpSelect>;
+/**
+ * Provides the Select state.
+ */
+export declare const provideSelectState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
+/**
+ * Injects the Select state.
+ */
+export declare const injectSelectState: <U = {
+    readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
+    readonly state: import("ng-primitives/state").CreatedState<NgpSelect>;
+}>(injectOptions?: import("@angular/core").InjectOptions) => import("@angular/core").Signal<import("ng-primitives/state").State<U>>;
+/**
+ * The Select state registration function.
+ */
+export declare const selectState: <U>(state: U) => import("ng-primitives/state").CreatedState<U>;

package/select/select/select.d.ts

@@ -1,16 +1,19 @@
 import { BooleanInput } from '@angular/cdk/coercion';
-import { NgpCanDisable } from 'ng-primitives/internal';
 import * as i0 from "@angular/core";
 import * as i1 from "ng-primitives/form-field";
-import * as i2 from "ng-primitives/interactions";
 /**
  * Apply the `ngpSelect` directive to a select element that you want to enhance.
  */
-export declare class NgpSelect implements NgpCanDisable {
+export declare class NgpSelect {
     /**
      * Whether the select is disabled.
      */
     readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * The select state.
+     */
+    private readonly state;
+    constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<NgpSelect, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpSelect, "select[ngpSelect]", ["ngpSelect"], { "disabled": { "alias": "ngpSelectDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.NgpFormControl; inputs: {}; outputs: {}; }, { directive: typeof i2.NgpFocusVisible; inputs: {}; outputs: {}; }, { directive: typeof i2.NgpHover; inputs: {}; outputs: {}; }, { directive: typeof i2.NgpPress; inputs: {}; outputs: {}; }]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpSelect, "select[ngpSelect]", ["ngpSelect"], { "disabled": { "alias": "ngpSelectDisabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.NgpFormControl; inputs: {}; outputs: {}; }]>;
 }

package/separator/index.d.ts

@@ -1,3 +1,2 @@
-export { NgpSeparator } from './separator/separator';
-export { NgpSeparatorToken, injectSeparator } from './separator/separator-token';
 export { NgpSeparatorConfig, provideSeparatorConfig } from './config/separator-config';
+export { NgpSeparator } from './separator/separator';

package/slider/index.d.ts

@@ -1,9 +1,5 @@
 export { NgpSliderRange } from './slider-range/slider-range';
-export { NgpSliderRangeToken, injectSliderRange } from './slider-range/slider-range-token';
 export { NgpSliderThumb } from './slider-thumb/slider-thumb';
-export { NgpSliderThumbToken, injectSliderThumb } from './slider-thumb/slider-thumb-token';
 export { NgpSliderTrack } from './slider-track/slider-track';
-export { NgpSliderTrackToken, injectSliderTrack } from './slider-track/slider-track-token';
 export { NgpSlider } from './slider/slider';
 export { injectSliderState, provideSliderState } from './slider/slider-state';
-export { NgpSliderToken, injectSlider } from './slider/slider-token';

package/slider/slider/slider-state.d.ts

@@ -6,7 +6,7 @@ export declare const NgpSliderStateToken: import("@angular/core").InjectionToken
 /**
  * Provides the Slider state.
  */
-export declare const provideSliderState: () => import("@angular/core").FactoryProvider;
+export declare const provideSliderState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
 /**
  * Injects the Slider state.
  */

package/slider/slider/slider.d.ts

@@ -1,13 +1,12 @@
 import { BooleanInput, NumberInput } from '@angular/cdk/coercion';
 import { NgpOrientation } from 'ng-primitives/common';
-import { NgpCanDisable } from 'ng-primitives/internal';
 import type { NgpSliderTrack } from '../slider-track/slider-track';
 import * as i0 from "@angular/core";
 import * as i1 from "ng-primitives/form-field";
 /**
  * Apply the `ngpSlider` directive to an element that represents the slider and contains the track, range, and thumb.
  */
-export declare class NgpSlider implements NgpCanDisable {
+export declare class NgpSlider {
     /**
      * The value of the slider.
      */
@@ -50,6 +49,7 @@ export declare class NgpSlider implements NgpCanDisable {
      * @internal
      */
     protected readonly state: import("ng-primitives/state").CreatedState<NgpSlider>;
+    constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<NgpSlider, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<NgpSlider, "[ngpSlider]", ["ngpSlider"], { "value": { "alias": "ngpSliderValue"; "required": false; "isSignal": true; }; "min": { "alias": "ngpSliderMin"; "required": false; "isSignal": true; }; "max": { "alias": "ngpSliderMax"; "required": false; "isSignal": true; }; "step": { "alias": "ngpSliderStep"; "required": false; "isSignal": true; }; "orientation": { "alias": "ngpSliderOrientation"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpSliderDisabled"; "required": false; "isSignal": true; }; }, { "valueChange": "ngpSliderValueChange"; }, never, never, true, [{ directive: typeof i1.NgpFormControl; inputs: {}; outputs: {}; }]>;
 }

package/slider/slider-range/slider-range.d.ts

@@ -6,7 +6,7 @@ export declare class NgpSliderRange {
     /**
      * Access the slider state.
      */
-    protected readonly state: import("@angular/core").Signal<import("ng-primitives/state").State<{
+    protected readonly sliderState: import("@angular/core").Signal<import("ng-primitives/state").State<{
         readonly value: import("@angular/core").InputSignalWithTransform<number, import("@angular/cdk/coercion").NumberInput>;
         readonly valueChange: import("@angular/core").OutputEmitterRef<number>;
         readonly min: import("@angular/core").InputSignalWithTransform<number, import("@angular/cdk/coercion").NumberInput>;

package/slider/slider-thumb/slider-thumb.d.ts

@@ -1,17 +1,12 @@
 import * as i0 from "@angular/core";
-import * as i1 from "ng-primitives/interactions";
 /**
  * Apply the `ngpSliderThumb` directive to an element that represents the thumb of the slider.
  */
 export declare class NgpSliderThumb {
-    /**
-     * Access the slider.
-     */
-    protected readonly slider: import("ng-primitives/slider").NgpSlider;
     /**
      * Access the slider state.
      */
-    protected readonly state: import("@angular/core").Signal<import("ng-primitives/state").State<{
+    protected readonly sliderState: import("@angular/core").Signal<import("ng-primitives/state").State<{
         readonly value: import("@angular/core").InputSignalWithTransform<number, import("@angular/cdk/coercion").NumberInput>;
         readonly valueChange: import("@angular/core").OutputEmitterRef<number>;
         readonly min: import("@angular/core").InputSignalWithTransform<number, import("@angular/cdk/coercion").NumberInput>;
@@ -27,6 +22,7 @@ export declare class NgpSliderThumb {
      * Store the dragging state.
      */
     protected dragging: boolean;
+    constructor();
     protected handlePointerDown(event: PointerEvent): void;
     protected handlePointerUp(): void;
     protected handlePointerMove(event: PointerEvent): void;
@@ -36,5 +32,5 @@ export declare class NgpSliderThumb {
      */
     protected handleKeydown(event: KeyboardEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgpSliderThumb, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpSliderThumb, "[ngpSliderThumb]", ["ngpSliderThumb"], {}, {}, never, never, true, [{ directive: typeof i1.NgpHover; inputs: {}; outputs: {}; }, { directive: typeof i1.NgpFocusVisible; inputs: {}; outputs: {}; }, { directive: typeof i1.NgpPress; inputs: {}; outputs: {}; }]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpSliderThumb, "[ngpSliderThumb]", ["ngpSliderThumb"], {}, {}, never, never, true, never>;
 }

package/slider/slider-track/slider-track.d.ts

@@ -3,14 +3,10 @@ import * as i0 from "@angular/core";
  * Apply the `ngpSliderTrack` directive to an element that represents the track of the slider.
  */
 export declare class NgpSliderTrack {
-    /**
-     * Access the slider.
-     */
-    protected readonly slider: import("ng-primitives/slider").NgpSlider;
     /**
      * Access the slider state.
      */
-    protected readonly state: import("@angular/core").Signal<import("ng-primitives/state").State<{
+    protected readonly sliderState: import("@angular/core").Signal<import("ng-primitives/state").State<{
         readonly value: import("@angular/core").InputSignalWithTransform<number, import("@angular/cdk/coercion").NumberInput>;
         readonly valueChange: import("@angular/core").OutputEmitterRef<number>;
         readonly min: import("@angular/core").InputSignalWithTransform<number, import("@angular/cdk/coercion").NumberInput>;

package/state/index.d.ts

@@ -19,13 +19,19 @@ export type InjectedState<T> = Signal<State<T>>;
  * @param description The description of the token
  */
 export declare function createStateToken<T>(description: string): InjectionToken<T>;
+export interface CreateStateProviderOptions {
+    /**
+     * Whether we should check for the state in the parent injector.
+     */
+    inherit?: boolean;
+}
 /**
  * Create a new provider for the state. It first tries to inject the state from the parent injector,
  * as this allows for the state to be hoisted to a higher level in the component tree. This can
  * be useful to avoid issues where the injector can't be shared in some cases when ng-content is used.
  * @param token The token for the state
  */
-export declare function createStateProvider<T>(token: ProviderToken<T>): () => FactoryProvider;
+export declare function createStateProvider<T>(token: ProviderToken<T>): (options?: CreateStateProviderOptions) => FactoryProvider;
 type CreateStateInjectorOptions = {
     /**
      * Whether the state may not be immediately available. This can happen when the child is instantiated before the parent.

package/switch/index.d.ts

@@ -1,4 +1,3 @@
 export { NgpSwitchThumb } from './switch-thumb/switch-thumb';
 export { NgpSwitch } from './switch/switch';
 export { injectSwitchState, provideSwitchState } from './switch/switch-state';
-export { NgpSwitchToken, injectSwitch } from './switch/switch-token';

package/switch/switch/switch-state.d.ts

@@ -6,7 +6,7 @@ export declare const NgpSwitchStateToken: import("@angular/core").InjectionToken
 /**
  * Provides the Switch state.
  */
-export declare const provideSwitchState: () => import("@angular/core").FactoryProvider;
+export declare const provideSwitchState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
 /**
  * Injects the Switch state.
  */

package/switch/switch/switch.d.ts

@@ -1,12 +1,10 @@
 import { BooleanInput } from '@angular/cdk/coercion';
-import { NgpCanDisable } from 'ng-primitives/internal';
 import * as i0 from "@angular/core";
 import * as i1 from "ng-primitives/form-field";
-import * as i2 from "ng-primitives/interactions";
 /**
  * Apply the `ngpSwitch` directive to an element to manage the checked state.
  */
-export declare class NgpSwitch implements NgpCanDisable {
+export declare class NgpSwitch {
     /**
      * Access the element ref.
      */
@@ -34,6 +32,7 @@ export declare class NgpSwitch implements NgpCanDisable {
      * @internal
      */
     readonly state: import("ng-primitives/state").CreatedState<NgpSwitch>;
+    constructor();
     /**
      * Toggle the checked state.
      */
@@ -43,5 +42,5 @@ export declare class NgpSwitch implements NgpCanDisable {
      */
     protected onKeyDown(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgpSwitch, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpSwitch, "[ngpSwitch]", ["ngpSwitch"], { "checked": { "alias": "ngpSwitchChecked"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpSwitchDisabled"; "required": false; "isSignal": true; }; }, { "checkedChange": "ngpSwitchCheckedChange"; }, never, never, true, [{ directive: typeof i1.NgpFormControl; inputs: {}; outputs: {}; }, { directive: typeof i2.NgpHover; inputs: {}; outputs: {}; }, { directive: typeof i2.NgpPress; inputs: {}; outputs: {}; }, { directive: typeof i2.NgpFocusVisible; inputs: {}; outputs: {}; }]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpSwitch, "[ngpSwitch]", ["ngpSwitch"], { "checked": { "alias": "ngpSwitchChecked"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpSwitchDisabled"; "required": false; "isSignal": true; }; }, { "checkedChange": "ngpSwitchCheckedChange"; }, never, never, true, [{ directive: typeof i1.NgpFormControl; inputs: {}; outputs: {}; }]>;
 }

package/switch/switch-thumb/switch-thumb.d.ts

@@ -1,5 +1,4 @@
 import * as i0 from "@angular/core";
-import * as i1 from "ng-primitives/interactions";
 /**
  * Apply the `ngpSwitchThumb` directive to an element within a switch to represent the thumb.
  */
@@ -17,6 +16,7 @@ export declare class NgpSwitchThumb {
         toggle: () => void;
         onKeyDown: () => void;
     }>>;
+    constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<NgpSwitchThumb, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpSwitchThumb, "[ngpSwitchThumb]", never, {}, {}, never, never, true, [{ directive: typeof i1.NgpHover; inputs: {}; outputs: {}; }, { directive: typeof i1.NgpFocusVisible; inputs: {}; outputs: {}; }, { directive: typeof i1.NgpPress; inputs: {}; outputs: {}; }]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpSwitchThumb, "[ngpSwitchThumb]", never, {}, {}, never, never, true, never>;
 }

package/tabs/index.d.ts

@@ -2,7 +2,6 @@ export { NgpTabsConfig, provideTabsConfig } from './config/tabs-config';
 export { NgpTabButton } from './tab-button/tab-button';
 export { NgpTabList } from './tab-list/tab-list';
 export { NgpTabPanel } from './tab-panel/tab-panel';
-export { NgpTabPanelToken, injectTabPanel } from './tab-panel/tab-panel-token';
+export { injectTabPanel, NgpTabPanelToken } from './tab-panel/tab-panel-token';
 export { NgpTabset } from './tabset/tabset';
 export { injectTabsetState, provideTabsetState } from './tabset/tabset-state';
-export { NgpTabsetToken, injectTabset } from './tabset/tabset-token';

package/tabs/tab-button/tab-button.d.ts

@@ -3,7 +3,6 @@ import { OnInit } from '@angular/core';
 import { NgpRovingFocusItem } from 'ng-primitives/roving-focus';
 import * as i0 from "@angular/core";
 import * as i1 from "ng-primitives/roving-focus";
-import * as i2 from "ng-primitives/interactions";
 /**
  * Apply the `ngpTabButton` directive to an element within a tab list to represent a tab button. This directive should be applied to a button element.
  */
@@ -73,6 +72,7 @@ export declare class NgpTabButton implements OnInit {
      * Whether the tab is active
      */
     readonly active: import("@angular/core").Signal<boolean>;
+    constructor();
     ngOnInit(): void;
     /**
      * Select the tab this trigger controls
@@ -83,5 +83,5 @@ export declare class NgpTabButton implements OnInit {
      */
     protected activateOnFocus(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgpTabButton, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpTabButton, "[ngpTabButton]", ["ngpTabButton"], { "value": { "alias": "ngpTabButtonValue"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpTabButtonDisabled"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.NgpRovingFocusItem; inputs: {}; outputs: {}; }, { directive: typeof i2.NgpHover; inputs: {}; outputs: {}; }, { directive: typeof i2.NgpFocusVisible; inputs: {}; outputs: {}; }, { directive: typeof i2.NgpPress; inputs: {}; outputs: {}; }]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpTabButton, "[ngpTabButton]", ["ngpTabButton"], { "value": { "alias": "ngpTabButtonValue"; "required": false; "isSignal": true; }; "disabled": { "alias": "ngpTabButtonDisabled"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.NgpRovingFocusItem; inputs: {}; outputs: {}; }]>;
 }

package/tabs/tabset/tabset-state.d.ts

@@ -6,7 +6,7 @@ export declare const NgpTabsetStateToken: import("@angular/core").InjectionToken
 /**
  * Provides the Tabset state.
  */
-export declare const provideTabsetState: () => import("@angular/core").FactoryProvider;
+export declare const provideTabsetState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
 /**
  * Injects the Tabset state.
  */

package/textarea/index.d.ts

@@ -1,2 +1,2 @@
 export { NgpTextarea } from './textarea/textarea';
-export { NgpTextareaToken, injectTextarea } from './textarea/textarea-token';
+export { injectTextareaState, provideTextareaState } from './textarea/textarea-state';

package/textarea/textarea/textarea-state.d.ts

@@ -0,0 +1,20 @@
+import type { NgpTextarea } from './textarea';
+/**
+ * The state token  for the Textarea primitive.
+ */
+export declare const NgpTextareaStateToken: import("@angular/core").InjectionToken<NgpTextarea>;
+/**
+ * Provides the Textarea state.
+ */
+export declare const provideTextareaState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
+/**
+ * Injects the Textarea state.
+ */
+export declare const injectTextareaState: <U = {
+    readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, import("@angular/cdk/coercion").BooleanInput>;
+    readonly state: import("ng-primitives/state").CreatedState<NgpTextarea>;
+}>(injectOptions?: import("@angular/core").InjectOptions) => import("@angular/core").Signal<import("ng-primitives/state").State<U>>;
+/**
+ * The Textarea state registration function.
+ */
+export declare const textareaState: <U>(state: U) => import("ng-primitives/state").CreatedState<U>;

package/textarea/textarea/textarea.d.ts

@@ -1,13 +1,16 @@
 import { BooleanInput } from '@angular/cdk/coercion';
-import { NgpCanDisable } from 'ng-primitives/internal';
 import * as i0 from "@angular/core";
 import * as i1 from "ng-primitives/form-field";
-import * as i2 from "ng-primitives/interactions";
-export declare class NgpTextarea implements NgpCanDisable {
+export declare class NgpTextarea {
     /**
      * Whether the element is disabled.
      */
     readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * The state of the textarea.
+     */
+    protected readonly state: import("ng-primitives/state").CreatedState<NgpTextarea>;
+    constructor();
     static ɵfac: i0.ɵɵFactoryDeclaration<NgpTextarea, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpTextarea, "[ngpTextarea]", ["ngpTextarea"], { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.NgpFormControl; inputs: {}; outputs: {}; }, { directive: typeof i2.NgpHover; inputs: {}; outputs: {}; }, { directive: typeof i2.NgpFocus; inputs: {}; outputs: {}; }, { directive: typeof i2.NgpPress; inputs: {}; outputs: {}; }]>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<NgpTextarea, "[ngpTextarea]", ["ngpTextarea"], { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.NgpFormControl; inputs: {}; outputs: {}; }]>;
 }

package/toast/index.d.ts

@@ -1,4 +1,3 @@
 export { NgpToastConfig, provideToastConfig } from './config/toast-config';
 export { NgpToast } from './toast/toast';
 export { NgpToastGravity, NgpToastPosition, NgpToastRef } from './toast/toast-ref';
-export { NgpToastToken, injectToast } from './toast/toast-token';

package/toast/toast/toast.d.ts

@@ -14,13 +14,33 @@ export declare class NgpToast {
     private readonly injector;
     /** Access the document */
     private readonly document;
+    /**
+     * The duration the toast will display for before it is automatically dismissed in milliseconds.
+     * @default 3000
+     */
     readonly duration: import("@angular/core").InputSignalWithTransform<number, NumberInput>;
+    /**
+     * The direction the toast will appear from.
+     * @default 'top'
+     */
     readonly gravity: import("@angular/core").InputSignal<NgpToastGravity>;
+    /**
+     * The position the toast will on the horizontal axis.
+     * @default 'end'
+     */
     readonly position: import("@angular/core").InputSignal<NgpToastPosition>;
+    /**
+     * Whether the automatic dismissal of the toast should be paused when the user hovers over it.
+     * @default true
+     */
     readonly stopOnHover: import("@angular/core").InputSignalWithTransform<boolean, BooleanInput>;
+    /**
+     * Whether the toast should be announced to assistive technologies.
+     * @default 'polite'
+     */
     readonly ariaLive: import("@angular/core").InputSignal<string>;
     /** Store the list of toasts */
-    private toasts;
+    private static toasts;
     /** Show the toast. */
     show(): void;
     /** Build the toast */

package/toggle/index.d.ts

@@ -1,3 +1,2 @@
 export { NgpToggle } from './toggle/toggle';
 export { injectToggleState, provideToggleState } from './toggle/toggle-state';
-export { NgpToggleToken, injectToggle } from './toggle/toggle-token';

package/toggle/toggle/toggle-state.d.ts

@@ -6,7 +6,7 @@ export declare const NgpToggleStateToken: import("@angular/core").InjectionToken
 /**
  * Provides the Toggle state.
  */
-export declare const provideToggleState: () => import("@angular/core").FactoryProvider;
+export declare const provideToggleState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
 /**
  * Injects the Toggle state.
  */

package/toggle-group/index.d.ts

@@ -1,7 +1,5 @@
 export { NgpToggleGroupConfig, provideToggleGroupConfig } from './config/toggle-group-config';
 export { NgpToggleGroupItem } from './toggle-group-item/toggle-group-item';
 export { injectToggleGroupItemState, provideToggleGroupItemState, } from './toggle-group-item/toggle-group-item-state';
-export { injectToggleGroupItem, NgpToggleGroupItemToken, } from './toggle-group-item/toggle-group-item-token';
 export { NgpToggleGroup } from './toggle-group/toggle-group';
 export { injectToggleGroupState, provideToggleGroupState } from './toggle-group/toggle-group-state';
-export { injectToggleGroup, NgpToggleGroupToken } from './toggle-group/toggle-group-token';

package/toggle-group/toggle-group/toggle-group-state.d.ts

@@ -6,7 +6,7 @@ export declare const NgpToggleGroupStateToken: import("@angular/core").Injection
 /**
  * Provides the ToggleGroup state.
  */
-export declare const provideToggleGroupState: () => import("@angular/core").FactoryProvider;
+export declare const provideToggleGroupState: (options?: import("ng-primitives/state").CreateStateProviderOptions) => import("@angular/core").FactoryProvider;
 /**
  * Injects the ToggleGroup state.
  */