ng-primitives 0.91.2 → 0.93.0

package/package.json

@@ -2,7 +2,7 @@
   "name": "ng-primitives",
   "description": "Angular Primitives is a low-level headless UI component library with a focus on accessibility, customization, and developer experience. ",
   "license": "Apache-2.0",
-  "version": "0.91.2",
+  "version": "0.93.0",
   "keywords": [
     "angular",
     "primitives",

package/roving-focus/index.d.ts

@@ -29,10 +29,12 @@ declare const injectRovingFocusItemState: {
     (): Signal<NgpRovingFocusItemState>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<NgpRovingFocusItemState | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<NgpRovingFocusItemState | null>;
+        optional?: boolean;
+    }): Signal<NgpRovingFocusItemState> | Signal<NgpRovingFocusItemState | null>;
 };
 declare const provideRovingFocusItemState: (opts?: {
     inherit?: boolean;
@@ -63,10 +65,12 @@ declare const injectRovingFocusGroupState: {
     (): Signal<NgpRovingFocusGroupState>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<NgpRovingFocusGroupState | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<NgpRovingFocusGroupState | null>;
+        optional?: boolean;
+    }): Signal<NgpRovingFocusGroupState> | Signal<NgpRovingFocusGroupState | null>;
 };
 declare const provideRovingFocusGroupState: (opts?: {
     inherit?: boolean;

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

@@ -9,12 +9,12 @@ import { Tab } from './tab';
   template: `
     <div [(ngpTabsetValue)]="value" ngpTabset>
       <div ngpTabList>
-        @for (tab of tabs(); track tab.label) {
+        @for (tab of tabs(); track tab.label()) {
           <button [ngpTabButtonValue]="tab.value()" ngpTabButton>{{ tab.label() }}</button>
         }
       </div>
 
-      @for (tab of tabs(); track tab.label) {
+      @for (tab of tabs(); track tab.label()) {
         <div [ngpTabPanelValue]="tab.value()" ngpTabPanel>
           <ng-container [ngTemplateOutlet]="tab.content()" />
         </div>

package/slider/index.d.ts

@@ -1,7 +1,7 @@
 import * as _angular_core from '@angular/core';
 import { Signal, WritableSignal, ElementRef, OnDestroy } from '@angular/core';
 import { NgpOrientation } from 'ng-primitives/common';
-import { Subject } from 'rxjs';
+import { Observable } from 'rxjs';
 import { NumberInput, BooleanInput } from '@angular/cdk/coercion';
 import * as ng_primitives_state from 'ng-primitives/state';
 import * as ng_primitives_slider from 'ng-primitives/slider';
@@ -30,10 +30,12 @@ declare const injectSliderRangeState: {
     (): _angular_core.Signal<NgpSliderRangeState>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): _angular_core.Signal<NgpSliderRangeState | null>;
     (options?: {
         hoisted?: boolean;
-    }): _angular_core.Signal<NgpSliderRangeState | null>;
+        optional?: boolean;
+    }): _angular_core.Signal<NgpSliderRangeState> | _angular_core.Signal<NgpSliderRangeState | null>;
 };
 declare const provideSliderRangeState: (opts?: {
     inherit?: boolean;
@@ -71,10 +73,12 @@ declare const injectSliderThumbState: {
     (): Signal<NgpSliderThumbState>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<NgpSliderThumbState | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<NgpSliderThumbState | null>;
+        optional?: boolean;
+    }): Signal<NgpSliderThumbState> | Signal<NgpSliderThumbState | null>;
 };
 declare const provideSliderThumbState: (opts?: {
     inherit?: boolean;
@@ -104,10 +108,12 @@ declare const injectSliderTrackState: {
     (): _angular_core.Signal<NgpSliderTrackState>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): _angular_core.Signal<NgpSliderTrackState | null>;
     (options?: {
         hoisted?: boolean;
-    }): _angular_core.Signal<NgpSliderTrackState | null>;
+        optional?: boolean;
+    }): _angular_core.Signal<NgpSliderTrackState> | _angular_core.Signal<NgpSliderTrackState | null>;
 };
 declare const provideSliderTrackState: (opts?: {
     inherit?: boolean;
@@ -156,7 +162,7 @@ interface NgpSliderState {
     /**
      * Emit when the value changes.
      */
-    readonly valueChange: Subject<number>;
+    readonly valueChange: Observable<number>;
     /**
      * Set the current value (clamped).
      */
@@ -216,10 +222,12 @@ declare const injectSliderState: {
     (): Signal<NgpSliderState>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<NgpSliderState | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<NgpSliderState | null>;
+        optional?: boolean;
+    }): Signal<NgpSliderState> | Signal<NgpSliderState | null>;
 };
 declare const provideSliderState: (opts?: {
     inherit?: boolean;

package/state/index.d.ts

@@ -1,4 +1,5 @@
 import { InputSignalWithTransform, WritableSignal, InputSignal, Signal, InjectionToken, ProviderToken, FactoryProvider, InjectOptions, Injector, ElementRef } from '@angular/core';
+import { Observable } from 'rxjs';
 
 /**
  * This converts the state object to a writable state object.
@@ -61,19 +62,23 @@ type BasePrimitiveInjectionFn<TState> = {
     (): Signal<TState>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<TState | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<TState | null>;
+        optional?: boolean;
+    }): Signal<TState | null> | Signal<TState>;
 };
 type PrimitiveInjectionFn<TFactory extends (...args: any[]) => unknown> = TFactory extends (props: unknown) => infer R ? {
     (): Signal<R>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<R | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<R | null>;
+        optional?: boolean;
+    }): Signal<R | null> | Signal<R>;
 } : BasePrimitiveInjectionFn<PrimitiveState<TFactory>>;
 declare function createPrimitive<TFactory extends (...args: any[]) => unknown>(name: string, fn: TFactory, options?: CreatePrimitiveOptions): [
     InjectionToken<WritableSignal<PrimitiveState<TFactory>>>,
@@ -87,12 +92,15 @@ declare function controlled<T>(value: Signal<T>): WritableSignal<T>;
 declare function attrBinding(element: ElementRef<HTMLElement>, attr: string, value: (() => string | number | boolean | null | undefined) | string | number | boolean | null | undefined): void;
 declare function styleBinding(element: ElementRef<HTMLElement>, style: string, value: (() => string | number | null) | string | number | null): void;
 declare function dataBinding(element: ElementRef<HTMLElement>, attr: string, value: (() => string | boolean | null) | string | boolean | null): void;
-declare function listener<K extends keyof HTMLElementEventMap>(element: HTMLElement | ElementRef<HTMLElement>, event: K, handler: (event: HTMLElementEventMap[K]) => void, options?: {
+declare function listener<K extends keyof HTMLElementEventMap>(element: HTMLElement | ElementRef<HTMLElement> | Document, event: K, handler: (event: HTMLElementEventMap[K]) => void, options?: {
     injector?: Injector;
-}): void;
-declare function listener(element: HTMLElement | ElementRef<HTMLElement>, event: string, handler: (event: Event) => void, options?: {
+    config?: AddEventListenerOptions | boolean;
+}): () => void;
+declare function listener(element: HTMLElement | ElementRef<HTMLElement> | Document, event: string, handler: (event: Event) => void, options?: {
     injector?: Injector;
-}): void;
+    config?: AddEventListenerOptions | boolean;
+}): () => void;
+declare function onMount(callback: () => void): void;
 declare function onDestroy(callback: () => void): void;
 /**
  * Previously, with our state approach, we allowed signals to be written directly using their setters.
@@ -106,6 +114,13 @@ declare function deprecatedSetter<T>(signal: WritableSignal<T>, methodName: stri
  * We could use inject with a forwardRef, but forwardRef returns an any - no thanks...
  */
 declare function injectInheritedState<T>(token: () => InjectionToken<T>, injectOptions?: InjectOptions): T | null;
+interface Emitter<T> {
+    emit(value: T): void;
+    asObservable(): Observable<T>;
+}
+declare function emitter<T>({ injector, }?: {
+    injector?: Injector;
+}): Emitter<T>;
 
-export { attrBinding, controlled, createPrimitive, createState, createStateInjector, createStateProvider, createStateToken, dataBinding, deprecatedSetter, injectInheritedState, listener, onDestroy, styleBinding };
-export type { CreatePrimitiveOptions, CreateStateProviderOptions, CreatedState, InjectedState, State };
+export { attrBinding, controlled, createPrimitive, createState, createStateInjector, createStateProvider, createStateToken, dataBinding, deprecatedSetter, emitter, injectInheritedState, listener, onDestroy, onMount, styleBinding };
+export type { CreatePrimitiveOptions, CreateStateProviderOptions, CreatedState, Emitter, InjectedState, State };

package/switch/index.d.ts

@@ -1,6 +1,6 @@
 import * as _angular_core from '@angular/core';
 import { Signal, WritableSignal } from '@angular/core';
-import { Subject } from 'rxjs/internal/Subject';
+import { Observable } from 'rxjs';
 import { BooleanInput } from '@angular/cdk/coercion';
 
 /**
@@ -35,10 +35,12 @@ declare const injectSwitchThumbState: {
     (): Signal<NgpSwitchThumbState>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<NgpSwitchThumbState | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<NgpSwitchThumbState | null>;
+        optional?: boolean;
+    }): Signal<NgpSwitchThumbState> | Signal<NgpSwitchThumbState | null>;
 };
 declare const provideSwitchThumbState: (opts?: {
     inherit?: boolean;
@@ -63,7 +65,7 @@ interface NgpSwitchState {
     /**
      * Emits when the checked state changes.
      */
-    readonly checkedChange: Subject<boolean>;
+    readonly checkedChange: Observable<boolean>;
     /**
      * Toggle the switch state.
      */
@@ -103,10 +105,12 @@ declare const injectSwitchState: {
     (): Signal<NgpSwitchState>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<NgpSwitchState | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<NgpSwitchState | null>;
+        optional?: boolean;
+    }): Signal<NgpSwitchState> | Signal<NgpSwitchState | null>;
 };
 declare const provideSwitchState: (opts?: {
     inherit?: boolean;