ng-primitives 0.92.0 → 0.93.0

package/a11y/index.d.ts

@@ -71,10 +71,12 @@ declare const injectVisuallyHiddenState: {
     (): Signal<NgpVisuallyHiddenState>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<NgpVisuallyHiddenState | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<NgpVisuallyHiddenState | null>;
+        optional?: boolean;
+    }): Signal<NgpVisuallyHiddenState> | Signal<NgpVisuallyHiddenState | null>;
 };
 declare const provideVisuallyHiddenState: (opts?: {
     inherit?: boolean;

package/accordion/index.d.ts

@@ -34,10 +34,12 @@ declare const injectAccordionContentState: {
     (): Signal<{}>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<{} | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<{} | null>;
+        optional?: boolean;
+    }): Signal<{}> | Signal<{} | null>;
 };
 declare const provideAccordionContentState: (opts?: {
     inherit?: boolean;
@@ -342,15 +344,20 @@ declare const injectAccordionTriggerState: {
     }>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<{
         id: Signal<string>;
         toggle: () => void;
     } | null>;
     (options?: {
         hoisted?: boolean;
+        optional?: boolean;
     }): Signal<{
         id: Signal<string>;
         toggle: () => void;
+    }> | Signal<{
+        id: Signal<string>;
+        toggle: () => void;
     } | null>;
 };
 declare const provideAccordionTriggerState: (opts?: {

package/autofill/index.d.ts

@@ -45,13 +45,17 @@ declare const injectAutofillState: {
     }>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<{
         autofilled: _angular_core.WritableSignal<boolean>;
     } | null>;
     (options?: {
         hoisted?: boolean;
+        optional?: boolean;
     }): Signal<{
         autofilled: _angular_core.WritableSignal<boolean>;
+    }> | Signal<{
+        autofilled: _angular_core.WritableSignal<boolean>;
     } | null>;
 };
 declare const provideAutofillState: (opts?: {

package/avatar/index.d.ts

@@ -34,10 +34,12 @@ declare const injectAvatarFallbackState: {
     (): Signal<{}>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<{} | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<{} | null>;
+        optional?: boolean;
+    }): Signal<{}> | Signal<{} | null>;
 };
 declare const provideAvatarFallbackState: (opts?: {
     inherit?: boolean;
@@ -62,10 +64,12 @@ declare const injectAvatarImageState: {
     (): _angular_core.Signal<{}>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): _angular_core.Signal<{} | null>;
     (options?: {
         hoisted?: boolean;
-    }): _angular_core.Signal<{} | null>;
+        optional?: boolean;
+    }): _angular_core.Signal<{}> | _angular_core.Signal<{} | null>;
 };
 declare const provideAvatarImageState: (opts?: {
     inherit?: boolean;
@@ -98,15 +102,20 @@ declare const injectAvatarState: {
     }>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<{
         status: _angular_core.WritableSignal<NgpAvatarStatus>;
         setStatus: (newStatus: NgpAvatarStatus) => void;
     } | null>;
     (options?: {
         hoisted?: boolean;
+        optional?: boolean;
     }): Signal<{
         status: _angular_core.WritableSignal<NgpAvatarStatus>;
         setStatus: (newStatus: NgpAvatarStatus) => void;
+    }> | Signal<{
+        status: _angular_core.WritableSignal<NgpAvatarStatus>;
+        setStatus: (newStatus: NgpAvatarStatus) => void;
     } | null>;
 };
 declare const provideAvatarState: (opts?: {

package/breadcrumbs/index.d.ts

@@ -73,10 +73,12 @@ declare const injectBreadcrumbsState: {
     (): _angular_core.Signal<{}>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): _angular_core.Signal<{} | null>;
     (options?: {
         hoisted?: boolean;
-    }): _angular_core.Signal<{} | null>;
+        optional?: boolean;
+    }): _angular_core.Signal<{}> | _angular_core.Signal<{} | null>;
 };
 declare const provideBreadcrumbsState: (opts?: {
     inherit?: boolean;
@@ -92,10 +94,12 @@ declare const injectBreadcrumbListState: {
     (): _angular_core.Signal<{}>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): _angular_core.Signal<{} | null>;
     (options?: {
         hoisted?: boolean;
-    }): _angular_core.Signal<{} | null>;
+        optional?: boolean;
+    }): _angular_core.Signal<{}> | _angular_core.Signal<{} | null>;
 };
 declare const provideBreadcrumbListState: (opts?: {
     inherit?: boolean;
@@ -111,10 +115,12 @@ declare const injectBreadcrumbItemState: {
     (): _angular_core.Signal<{}>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): _angular_core.Signal<{} | null>;
     (options?: {
         hoisted?: boolean;
-    }): _angular_core.Signal<{} | null>;
+        optional?: boolean;
+    }): _angular_core.Signal<{}> | _angular_core.Signal<{} | null>;
 };
 declare const provideBreadcrumbItemState: (opts?: {
     inherit?: boolean;
@@ -130,10 +136,12 @@ declare const injectBreadcrumbLinkState: {
     (): _angular_core.Signal<{}>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): _angular_core.Signal<{} | null>;
     (options?: {
         hoisted?: boolean;
-    }): _angular_core.Signal<{} | null>;
+        optional?: boolean;
+    }): _angular_core.Signal<{}> | _angular_core.Signal<{} | null>;
 };
 declare const provideBreadcrumbLinkState: (opts?: {
     inherit?: boolean;
@@ -149,10 +157,12 @@ declare const injectBreadcrumbPageState: {
     (): _angular_core.Signal<{}>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): _angular_core.Signal<{} | null>;
     (options?: {
         hoisted?: boolean;
-    }): _angular_core.Signal<{} | null>;
+        optional?: boolean;
+    }): _angular_core.Signal<{}> | _angular_core.Signal<{} | null>;
 };
 declare const provideBreadcrumbPageState: (opts?: {
     inherit?: boolean;
@@ -168,10 +178,12 @@ declare const injectBreadcrumbSeparatorState: {
     (): _angular_core.Signal<{}>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): _angular_core.Signal<{} | null>;
     (options?: {
         hoisted?: boolean;
-    }): _angular_core.Signal<{} | null>;
+        optional?: boolean;
+    }): _angular_core.Signal<{}> | _angular_core.Signal<{} | null>;
 };
 declare const provideBreadcrumbSeparatorState: (opts?: {
     inherit?: boolean;
@@ -187,10 +199,12 @@ declare const injectBreadcrumbEllipsisState: {
     (): _angular_core.Signal<{}>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): _angular_core.Signal<{} | null>;
     (options?: {
         hoisted?: boolean;
-    }): _angular_core.Signal<{} | null>;
+        optional?: boolean;
+    }): _angular_core.Signal<{}> | _angular_core.Signal<{} | null>;
 };
 declare const provideBreadcrumbEllipsisState: (opts?: {
     inherit?: boolean;

package/button/index.d.ts

@@ -13,10 +13,12 @@ declare const injectButtonState: {
     (): Signal<NgpButtonState>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<NgpButtonState | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<NgpButtonState | null>;
+        optional?: boolean;
+    }): Signal<NgpButtonState> | Signal<NgpButtonState | null>;
 };
 declare const provideButtonState: (opts?: {
     inherit?: boolean;

package/checkbox/index.d.ts

@@ -82,10 +82,12 @@ declare const injectCheckboxState: {
     (): Signal<NgpCheckboxState>;
     (options: {
         hoisted: true;
+        optional?: boolean;
     }): Signal<NgpCheckboxState | null>;
     (options?: {
         hoisted?: boolean;
-    }): Signal<NgpCheckboxState | null>;
+        optional?: boolean;
+    }): Signal<NgpCheckboxState> | Signal<NgpCheckboxState | null>;
 };
 declare const provideCheckboxState: (opts?: {
     inherit?: boolean;

package/fesm2022/ng-primitives-checkbox.mjs

@@ -4,16 +4,15 @@ import { uniqueId } from 'ng-primitives/utils';
 import { ngpFormControl } from 'ng-primitives/form-field';
 import { ngpInteractions } from 'ng-primitives/interactions';
 import { injectElementRef } from 'ng-primitives/internal';
-import { createPrimitive, controlled, attrBinding, dataBinding, listener, deprecatedSetter } from 'ng-primitives/state';
-import { Subject } from 'rxjs';
+import { createPrimitive, controlled, emitter, attrBinding, dataBinding, listener, deprecatedSetter } from 'ng-primitives/state';
 
 const [NgpCheckboxStateToken, ngpCheckbox, injectCheckboxState, provideCheckboxState] = createPrimitive('NgpCheckbox', ({ id = signal(uniqueId('ngp-checkbox')), checked: _checked = signal(false), indeterminate: _indeterminate = signal(false), disabled: _disabled = signal(false), onCheckedChange, onIndeterminateChange, }) => {
     const element = injectElementRef();
     const checked = controlled(_checked);
     const indeterminate = controlled(_indeterminate);
     const disabled = controlled(_disabled);
-    const checkedChange = new Subject();
-    const indeterminateChange = new Subject();
+    const checkedChange = emitter();
+    const indeterminateChange = emitter();
     const tabindex = computed(() => (disabled() ? -1 : 0), ...(ngDevMode ? [{ debugName: "tabindex" }] : []));
     // Setup interactions and form control hooks
     ngpInteractions({ hover: true, press: true, focusVisible: true, disabled });
@@ -53,12 +52,12 @@ const [NgpCheckboxStateToken, ngpCheckbox, injectCheckboxState, provideCheckboxS
     function setChecked(value) {
         checked.set(value);
         onCheckedChange?.(value);
-        checkedChange.next(value);
+        checkedChange.emit(value);
     }
     function setIndeterminate(value) {
         indeterminate.set(value);
         onIndeterminateChange?.(value);
-        indeterminateChange.next(value);
+        indeterminateChange.emit(value);
     }
     function setDisabled(value) {
         disabled.set(value);
@@ -68,8 +67,8 @@ const [NgpCheckboxStateToken, ngpCheckbox, injectCheckboxState, provideCheckboxS
         checked: deprecatedSetter(checked, 'setChecked'),
         indeterminate: deprecatedSetter(indeterminate, 'setIndeterminate'),
         disabled: deprecatedSetter(disabled, 'setDisabled'),
-        checkedChange,
-        indeterminateChange,
+        checkedChange: checkedChange.asObservable(),
+        indeterminateChange: indeterminateChange.asObservable(),
         toggle,
         setChecked,
         setIndeterminate,

package/fesm2022/ng-primitives-checkbox.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-primitives-checkbox.mjs","sources":["../../../../packages/ng-primitives/checkbox/src/checkbox/checkbox-state.ts","../../../../packages/ng-primitives/checkbox/src/checkbox/checkbox.ts","../../../../packages/ng-primitives/checkbox/src/ng-primitives-checkbox.ts"],"sourcesContent":["import { computed, Signal, signal, WritableSignal } from '@angular/core';\nimport { ngpFormControl } from 'ng-primitives/form-field';\nimport { ngpInteractions } from 'ng-primitives/interactions';\nimport { injectElementRef } from 'ng-primitives/internal';\nimport {\n  attrBinding,\n  controlled,\n  createPrimitive,\n  dataBinding,\n  deprecatedSetter,\n  listener,\n} from 'ng-primitives/state';\nimport { uniqueId } from 'ng-primitives/utils';\nimport { Observable, Subject } from 'rxjs';\n\n/**\n * Public state surface for the Checkbox primitive.\n */\nexport interface NgpCheckboxState {\n  /**\n   * The id of the checkbox.\n   */\n  readonly id: Signal<string>;\n  /**\n   * Whether the checkbox is checked.\n   */\n  readonly checked: WritableSignal<boolean>;\n  /**\n   * Whether the checkbox is indeterminate.\n   */\n  readonly indeterminate: WritableSignal<boolean>;\n  /**\n   * Whether the checkbox is disabled.\n   */\n  readonly disabled: WritableSignal<boolean>;\n  /**\n   * Emits when the checked state changes.\n   */\n  readonly checkedChange: Observable<boolean>;\n  /**\n   * Emits when the indeterminate state changes.\n   */\n  readonly indeterminateChange: Observable<boolean>;\n  /**\n   * Toggle the checkbox value.\n   */\n  toggle(event?: Event): void;\n  /**\n   * Update the checked value.\n   */\n  setChecked(value: boolean): void;\n  /**\n   * Update the indeterminate value.\n   */\n  setIndeterminate(value: boolean): void;\n  /**\n   * Set the disabled value.\n   */\n  setDisabled(value: boolean): void;\n}\n\n/**\n * Inputs for configuring the Checkbox primitive.\n */\nexport interface NgpCheckboxProps {\n  /**\n   * The id of the checkbox.\n   */\n  readonly id?: Signal<string>;\n  /**\n   * Whether the checkbox is checked.\n   */\n  readonly checked?: Signal<boolean>;\n  /**\n   * Whether the checkbox is indeterminate.\n   */\n  readonly indeterminate?: Signal<boolean>;\n  /**\n   * Whether the checkbox is disabled.\n   */\n  readonly disabled?: Signal<boolean>;\n  /**\n   * Callback fired when the checked state changes.\n   */\n  readonly onCheckedChange?: (checked: boolean) => void;\n  /**\n   * Callback fired when the indeterminate state changes.\n   */\n  readonly onIndeterminateChange?: (indeterminate: boolean) => void;\n}\n\nexport const [NgpCheckboxStateToken, ngpCheckbox, injectCheckboxState, provideCheckboxState] =\n  createPrimitive(\n    'NgpCheckbox',\n    ({\n      id = signal(uniqueId('ngp-checkbox')),\n      checked: _checked = signal(false),\n      indeterminate: _indeterminate = signal(false),\n      disabled: _disabled = signal(false),\n      onCheckedChange,\n      onIndeterminateChange,\n    }: NgpCheckboxProps): NgpCheckboxState => {\n      const element = injectElementRef();\n      const checked = controlled(_checked);\n      const indeterminate = controlled(_indeterminate);\n      const disabled = controlled(_disabled);\n      const checkedChange = new Subject<boolean>();\n      const indeterminateChange = new Subject<boolean>();\n      const tabindex = computed(() => (disabled() ? -1 : 0));\n\n      // Setup interactions and form control hooks\n      ngpInteractions({ hover: true, press: true, focusVisible: true, disabled });\n      ngpFormControl({ id, disabled });\n\n      // Host bindings\n      attrBinding(element, 'role', 'checkbox');\n      attrBinding(element, 'aria-checked', () => (indeterminate() ? 'mixed' : checked()));\n      dataBinding(element, 'data-checked', checked);\n      dataBinding(element, 'data-indeterminate', indeterminate);\n      attrBinding(element, 'aria-disabled', disabled);\n      attrBinding(element, 'tabindex', () => tabindex().toString());\n\n      // Event listeners\n      listener(element, 'click', event => toggle(event));\n      listener(element, 'keydown', (event: KeyboardEvent) => {\n        if (event.key === 'Enter') {\n          // According to WAI ARIA, checkboxes don't activate on enter keypress\n          event.preventDefault();\n          return;\n        }\n\n        if (event.key === ' ' || event.key === 'Spacebar') {\n          toggle(event);\n        }\n      });\n\n      function toggle(event?: Event): void {\n        if (disabled()) {\n          return;\n        }\n\n        // prevent this firing twice in cases where the label is clicked and the checkbox is clicked by the one event\n        event?.preventDefault();\n\n        const nextChecked = indeterminate() ? true : !checked();\n        setChecked(nextChecked);\n\n        // if the checkbox was indeterminate, it isn't anymore\n        if (indeterminate()) {\n          setIndeterminate(false);\n        }\n      }\n\n      function setChecked(value: boolean): void {\n        checked.set(value);\n        onCheckedChange?.(value);\n        checkedChange.next(value);\n      }\n\n      function setIndeterminate(value: boolean): void {\n        indeterminate.set(value);\n        onIndeterminateChange?.(value);\n        indeterminateChange.next(value);\n      }\n\n      function setDisabled(value: boolean): void {\n        disabled.set(value);\n      }\n\n      return {\n        id,\n        checked: deprecatedSetter(checked, 'setChecked'),\n        indeterminate: deprecatedSetter(indeterminate, 'setIndeterminate'),\n        disabled: deprecatedSetter(disabled, 'setDisabled'),\n        checkedChange,\n        indeterminateChange,\n        toggle,\n        setChecked,\n        setIndeterminate,\n        setDisabled,\n      };\n    },\n  );\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { Directive, booleanAttribute, input, output } from '@angular/core';\nimport { uniqueId } from 'ng-primitives/utils';\nimport { ngpCheckbox, provideCheckboxState } from './checkbox-state';\n\n/**\n * Apply the `ngpCheckbox` directive to an element to that represents the checkbox, such as a `button`.\n */\n@Directive({\n  selector: '[ngpCheckbox]',\n  providers: [provideCheckboxState({ inherit: false })],\n})\nexport class NgpCheckbox {\n  /**\n   * The id of the checkbox.\n   * @internal\n   */\n  readonly id = input(uniqueId('ngp-checkbox'));\n\n  /**\n   * Defines whether the checkbox is checked.\n   */\n  readonly checked = input<boolean, BooleanInput>(false, {\n    alias: 'ngpCheckboxChecked',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * The event that is emitted when the checkbox value changes.\n   */\n  readonly checkedChange = output<boolean>({\n    alias: 'ngpCheckboxCheckedChange',\n  });\n\n  /**\n   * Defines whether the checkbox is indeterminate.\n   */\n  readonly indeterminate = input<boolean, BooleanInput>(false, {\n    alias: 'ngpCheckboxIndeterminate',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * The event that is emitted when the indeterminate value changes.\n   */\n  readonly indeterminateChange = output<boolean>({\n    alias: 'ngpCheckboxIndeterminateChange',\n  });\n\n  /**\n   * Whether the checkbox is required.\n   */\n  readonly required = input<boolean, BooleanInput>(false, {\n    alias: 'ngpCheckboxRequired',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * Defines whether the checkbox is disabled.\n   */\n  readonly disabled = input<boolean, BooleanInput>(false, {\n    alias: 'ngpCheckboxDisabled',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * The state of the checkbox.\n   */\n  protected readonly state = ngpCheckbox({\n    id: this.id,\n    checked: this.checked,\n    indeterminate: this.indeterminate,\n    disabled: this.disabled,\n    onCheckedChange: value => this.checkedChange.emit(value),\n    onIndeterminateChange: value => this.indeterminateChange.emit(value),\n  });\n\n  toggle(event?: Event): void {\n    this.state.toggle(event);\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ng-primitives-checkbox.mjs","sources":["../../../../packages/ng-primitives/checkbox/src/checkbox/checkbox-state.ts","../../../../packages/ng-primitives/checkbox/src/checkbox/checkbox.ts","../../../../packages/ng-primitives/checkbox/src/ng-primitives-checkbox.ts"],"sourcesContent":["import { computed, Signal, signal, WritableSignal } from '@angular/core';\nimport { ngpFormControl } from 'ng-primitives/form-field';\nimport { ngpInteractions } from 'ng-primitives/interactions';\nimport { injectElementRef } from 'ng-primitives/internal';\nimport {\n  attrBinding,\n  controlled,\n  createPrimitive,\n  dataBinding,\n  deprecatedSetter,\n  emitter,\n  listener,\n} from 'ng-primitives/state';\nimport { uniqueId } from 'ng-primitives/utils';\nimport { Observable } from 'rxjs';\n\n/**\n * Public state surface for the Checkbox primitive.\n */\nexport interface NgpCheckboxState {\n  /**\n   * The id of the checkbox.\n   */\n  readonly id: Signal<string>;\n  /**\n   * Whether the checkbox is checked.\n   */\n  readonly checked: WritableSignal<boolean>;\n  /**\n   * Whether the checkbox is indeterminate.\n   */\n  readonly indeterminate: WritableSignal<boolean>;\n  /**\n   * Whether the checkbox is disabled.\n   */\n  readonly disabled: WritableSignal<boolean>;\n  /**\n   * Emits when the checked state changes.\n   */\n  readonly checkedChange: Observable<boolean>;\n  /**\n   * Emits when the indeterminate state changes.\n   */\n  readonly indeterminateChange: Observable<boolean>;\n  /**\n   * Toggle the checkbox value.\n   */\n  toggle(event?: Event): void;\n  /**\n   * Update the checked value.\n   */\n  setChecked(value: boolean): void;\n  /**\n   * Update the indeterminate value.\n   */\n  setIndeterminate(value: boolean): void;\n  /**\n   * Set the disabled value.\n   */\n  setDisabled(value: boolean): void;\n}\n\n/**\n * Inputs for configuring the Checkbox primitive.\n */\nexport interface NgpCheckboxProps {\n  /**\n   * The id of the checkbox.\n   */\n  readonly id?: Signal<string>;\n  /**\n   * Whether the checkbox is checked.\n   */\n  readonly checked?: Signal<boolean>;\n  /**\n   * Whether the checkbox is indeterminate.\n   */\n  readonly indeterminate?: Signal<boolean>;\n  /**\n   * Whether the checkbox is disabled.\n   */\n  readonly disabled?: Signal<boolean>;\n  /**\n   * Callback fired when the checked state changes.\n   */\n  readonly onCheckedChange?: (checked: boolean) => void;\n  /**\n   * Callback fired when the indeterminate state changes.\n   */\n  readonly onIndeterminateChange?: (indeterminate: boolean) => void;\n}\n\nexport const [NgpCheckboxStateToken, ngpCheckbox, injectCheckboxState, provideCheckboxState] =\n  createPrimitive(\n    'NgpCheckbox',\n    ({\n      id = signal(uniqueId('ngp-checkbox')),\n      checked: _checked = signal(false),\n      indeterminate: _indeterminate = signal(false),\n      disabled: _disabled = signal(false),\n      onCheckedChange,\n      onIndeterminateChange,\n    }: NgpCheckboxProps): NgpCheckboxState => {\n      const element = injectElementRef();\n      const checked = controlled(_checked);\n      const indeterminate = controlled(_indeterminate);\n      const disabled = controlled(_disabled);\n      const checkedChange = emitter<boolean>();\n      const indeterminateChange = emitter<boolean>();\n      const tabindex = computed(() => (disabled() ? -1 : 0));\n\n      // Setup interactions and form control hooks\n      ngpInteractions({ hover: true, press: true, focusVisible: true, disabled });\n      ngpFormControl({ id, disabled });\n\n      // Host bindings\n      attrBinding(element, 'role', 'checkbox');\n      attrBinding(element, 'aria-checked', () => (indeterminate() ? 'mixed' : checked()));\n      dataBinding(element, 'data-checked', checked);\n      dataBinding(element, 'data-indeterminate', indeterminate);\n      attrBinding(element, 'aria-disabled', disabled);\n      attrBinding(element, 'tabindex', () => tabindex().toString());\n\n      // Event listeners\n      listener(element, 'click', event => toggle(event));\n      listener(element, 'keydown', (event: KeyboardEvent) => {\n        if (event.key === 'Enter') {\n          // According to WAI ARIA, checkboxes don't activate on enter keypress\n          event.preventDefault();\n          return;\n        }\n\n        if (event.key === ' ' || event.key === 'Spacebar') {\n          toggle(event);\n        }\n      });\n\n      function toggle(event?: Event): void {\n        if (disabled()) {\n          return;\n        }\n\n        // prevent this firing twice in cases where the label is clicked and the checkbox is clicked by the one event\n        event?.preventDefault();\n\n        const nextChecked = indeterminate() ? true : !checked();\n        setChecked(nextChecked);\n\n        // if the checkbox was indeterminate, it isn't anymore\n        if (indeterminate()) {\n          setIndeterminate(false);\n        }\n      }\n\n      function setChecked(value: boolean): void {\n        checked.set(value);\n        onCheckedChange?.(value);\n        checkedChange.emit(value);\n      }\n\n      function setIndeterminate(value: boolean): void {\n        indeterminate.set(value);\n        onIndeterminateChange?.(value);\n        indeterminateChange.emit(value);\n      }\n\n      function setDisabled(value: boolean): void {\n        disabled.set(value);\n      }\n\n      return {\n        id,\n        checked: deprecatedSetter(checked, 'setChecked'),\n        indeterminate: deprecatedSetter(indeterminate, 'setIndeterminate'),\n        disabled: deprecatedSetter(disabled, 'setDisabled'),\n        checkedChange: checkedChange.asObservable(),\n        indeterminateChange: indeterminateChange.asObservable(),\n        toggle,\n        setChecked,\n        setIndeterminate,\n        setDisabled,\n      };\n    },\n  );\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { Directive, booleanAttribute, input, output } from '@angular/core';\nimport { uniqueId } from 'ng-primitives/utils';\nimport { ngpCheckbox, provideCheckboxState } from './checkbox-state';\n\n/**\n * Apply the `ngpCheckbox` directive to an element to that represents the checkbox, such as a `button`.\n */\n@Directive({\n  selector: '[ngpCheckbox]',\n  providers: [provideCheckboxState({ inherit: false })],\n})\nexport class NgpCheckbox {\n  /**\n   * The id of the checkbox.\n   * @internal\n   */\n  readonly id = input(uniqueId('ngp-checkbox'));\n\n  /**\n   * Defines whether the checkbox is checked.\n   */\n  readonly checked = input<boolean, BooleanInput>(false, {\n    alias: 'ngpCheckboxChecked',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * The event that is emitted when the checkbox value changes.\n   */\n  readonly checkedChange = output<boolean>({\n    alias: 'ngpCheckboxCheckedChange',\n  });\n\n  /**\n   * Defines whether the checkbox is indeterminate.\n   */\n  readonly indeterminate = input<boolean, BooleanInput>(false, {\n    alias: 'ngpCheckboxIndeterminate',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * The event that is emitted when the indeterminate value changes.\n   */\n  readonly indeterminateChange = output<boolean>({\n    alias: 'ngpCheckboxIndeterminateChange',\n  });\n\n  /**\n   * Whether the checkbox is required.\n   */\n  readonly required = input<boolean, BooleanInput>(false, {\n    alias: 'ngpCheckboxRequired',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * Defines whether the checkbox is disabled.\n   */\n  readonly disabled = input<boolean, BooleanInput>(false, {\n    alias: 'ngpCheckboxDisabled',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * The state of the checkbox.\n   */\n  protected readonly state = ngpCheckbox({\n    id: this.id,\n    checked: this.checked,\n    indeterminate: this.indeterminate,\n    disabled: this.disabled,\n    onCheckedChange: value => this.checkedChange.emit(value),\n    onIndeterminateChange: value => this.indeterminateChange.emit(value),\n  });\n\n  toggle(event?: Event): void {\n    this.state.toggle(event);\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ng-primitives-file-upload.mjs

@@ -1,10 +1,9 @@
 import { coerceStringArray } from '@angular/cdk/coercion';
 import * as i0 from '@angular/core';
 import { signal, input, booleanAttribute, output, Directive, inject, DOCUMENT } from '@angular/core';
-import { ngpHoverInteraction, ngpInteractions } from 'ng-primitives/interactions';
+import { ngpHover, ngpInteractions } from 'ng-primitives/interactions';
 import { injectElementRef } from 'ng-primitives/internal';
-import { createPrimitive, dataBinding, listener } from 'ng-primitives/state';
-import { Subject } from 'rxjs';
+import { createPrimitive, emitter, dataBinding, listener } from 'ng-primitives/state';
 
 function fileDropFilter(fileList, acceptedTypes, multiple) {
     const validFiles = Array.from(fileList).filter(file => isFileTypeAccepted(file, acceptedTypes));
@@ -39,12 +38,14 @@ const [NgpFileDropzoneStateToken, ngpFileDropzone, injectFileDropzoneState, prov
     const element = injectElementRef();
     const isDragOverState = signal(false, ...(ngDevMode ? [{ debugName: "isDragOverState" }] : []));
     // Create observables
-    const selectedSubject = new Subject();
-    const rejectedSubject = new Subject();
-    const dragOverSubject = new Subject();
+    const selected = emitter();
+    const rejected = emitter();
+    const dragOver = emitter();
     // Host bindings
     dataBinding(element, 'data-dragover', () => (isDragOverState() ? '' : null));
     dataBinding(element, 'data-disabled', () => (disabled?.() ? '' : null));
+    // Setup hover interaction
+    ngpHover({ disabled });
     function onDragEnter(event) {
         if (disabled?.()) {
             return;
@@ -52,7 +53,7 @@ const [NgpFileDropzoneStateToken, ngpFileDropzone, injectFileDropzoneState, prov
         event.preventDefault();
         event.stopPropagation();
         isDragOverState.set(true);
-        dragOverSubject.next(true);
+        dragOver.emit(true);
         onDragOver?.(true);
     }
     function onDragOverHandler(event) {
@@ -74,7 +75,7 @@ const [NgpFileDropzoneStateToken, ngpFileDropzone, injectFileDropzoneState, prov
         event.preventDefault();
         event.stopPropagation();
         isDragOverState.set(false);
-        dragOverSubject.next(false);
+        dragOver.emit(false);
         onDragOver?.(false);
     }
     function onDrop(event) {
@@ -83,17 +84,17 @@ const [NgpFileDropzoneStateToken, ngpFileDropzone, injectFileDropzoneState, prov
         }
         event.preventDefault();
         isDragOverState.set(false);
-        dragOverSubject.next(false);
+        dragOver.emit(false);
         onDragOver?.(false);
         const fileList = event.dataTransfer?.files;
         if (fileList) {
             const filteredFiles = fileDropFilter(fileList, fileTypes?.(), multiple?.() ?? false);
             if (filteredFiles) {
-                selectedSubject.next(filteredFiles);
+                selected.emit(filteredFiles);
                 onSelected?.(filteredFiles);
             }
             else {
-                rejectedSubject.next();
+                rejected.emit();
                 onRejected?.();
             }
         }
@@ -109,9 +110,9 @@ const [NgpFileDropzoneStateToken, ngpFileDropzone, injectFileDropzoneState, prov
         multiple,
         directory,
         isDragOver: isDragOverState,
-        selected: selectedSubject.asObservable(),
-        rejected: rejectedSubject.asObservable(),
-        dragOverChanged: dragOverSubject.asObservable(),
+        selected: selected.asObservable(),
+        rejected: rejected.asObservable(),
+        dragOverChanged: dragOver.asObservable(),
     };
 });
 
@@ -184,7 +185,6 @@ class NgpFileDropzone {
          * Whether the user is currently dragging a file over the file upload.
          */
         this.isDragOver = this.state.isDragOver;
-        ngpHoverInteraction({ disabled: this.disabled });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.9", ngImport: i0, type: NgpFileDropzone, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.9", type: NgpFileDropzone, isStandalone: true, selector: "[ngpFileDropzone]", inputs: { fileTypes: { classPropertyName: "fileTypes", publicName: "ngpFileDropzoneFileTypes", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "ngpFileDropzoneMultiple", isSignal: true, isRequired: false, transformFunction: null }, directory: { classPropertyName: "directory", publicName: "ngpFileDropzoneDirectory", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpFileDropzoneDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "ngpFileDropzoneSelected", rejected: "ngpFileDropzoneRejected", dragOver: "ngpFileDropzoneDragOver" }, providers: [provideFileDropzoneState()], exportAs: ["ngpFileDropzone"], ngImport: i0 }); }
@@ -196,32 +196,39 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImpor
                     exportAs: 'ngpFileDropzone',
                     providers: [provideFileDropzoneState()],
                 }]
-        }], ctorParameters: () => [], propDecorators: { fileTypes: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileDropzoneFileTypes", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileDropzoneMultiple", required: false }] }], directory: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileDropzoneDirectory", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileDropzoneDisabled", required: false }] }], selected: [{ type: i0.Output, args: ["ngpFileDropzoneSelected"] }], rejected: [{ type: i0.Output, args: ["ngpFileDropzoneRejected"] }], dragOver: [{ type: i0.Output, args: ["ngpFileDropzoneDragOver"] }] } });
+        }], propDecorators: { fileTypes: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileDropzoneFileTypes", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileDropzoneMultiple", required: false }] }], directory: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileDropzoneDirectory", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileDropzoneDisabled", required: false }] }], selected: [{ type: i0.Output, args: ["ngpFileDropzoneSelected"] }], rejected: [{ type: i0.Output, args: ["ngpFileDropzoneRejected"] }], dragOver: [{ type: i0.Output, args: ["ngpFileDropzoneDragOver"] }] } });
 
 const [NgpFileUploadStateToken, ngpFileUpload, injectFileUploadState, provideFileUploadState,] = createPrimitive('NgpFileUpload', ({ fileTypes, multiple, directory, dragAndDrop, disabled, onSelected, onCanceled, onRejected, onDragOver, }) => {
     const element = injectElementRef();
     const document = inject(DOCUMENT);
     const isDragOver = signal(false, ...(ngDevMode ? [{ debugName: "isDragOver" }] : []));
     // Create observables
-    const selectedSubject = new Subject();
-    const canceledSubject = new Subject();
-    const rejectedSubject = new Subject();
-    const dragOverSubject = new Subject();
+    const selected = emitter();
+    const canceled = emitter();
+    const rejected = emitter();
+    const dragOver = emitter();
     // Host bindings
     dataBinding(element, 'data-disabled', () => (disabled?.() ? '' : null));
     dataBinding(element, 'data-dragover', () => (isDragOver() ? '' : null));
+    // Setup interactions
+    ngpInteractions({
+        hover: true,
+        press: true,
+        focusVisible: true,
+        disabled,
+    });
     // Create file input
     const input = document.createElement('input');
     input.type = 'file';
     input.style.display = 'none';
     input.addEventListener('change', () => {
         const files = input.files;
-        selectedSubject.next(files);
+        selected.emit(files);
         onSelected?.(files);
         input.value = '';
     });
     input.addEventListener('cancel', () => {
-        canceledSubject.next();
+        canceled.emit();
         onCanceled?.();
     });
     function showFileDialog() {
@@ -243,7 +250,7 @@ const [NgpFileUploadStateToken, ngpFileUpload, injectFileUploadState, provideFil
         event.preventDefault();
         event.stopPropagation();
         isDragOver.set(true);
-        dragOverSubject.next(true);
+        dragOver.emit(true);
         onDragOver?.(true);
     }
     function onDragOverHandler(event) {
@@ -265,7 +272,7 @@ const [NgpFileUploadStateToken, ngpFileUpload, injectFileUploadState, provideFil
         event.preventDefault();
         event.stopPropagation();
         isDragOver.set(false);
-        dragOverSubject.next(false);
+        dragOver.emit(false);
         onDragOver?.(false);
     }
     function onDrop(event) {
@@ -274,17 +281,17 @@ const [NgpFileUploadStateToken, ngpFileUpload, injectFileUploadState, provideFil
         }
         event.preventDefault();
         isDragOver.set(false);
-        dragOverSubject.next(false);
+        dragOver.emit(false);
         onDragOver?.(false);
         const fileList = event.dataTransfer?.files;
         if (fileList) {
             const filteredFiles = fileDropFilter(fileList, fileTypes?.(), multiple?.() ?? false);
             if (filteredFiles) {
-                selectedSubject.next(filteredFiles);
+                selected.emit(filteredFiles);
                 onSelected?.(filteredFiles);
             }
             else {
-                rejectedSubject.next();
+                rejected.emit();
                 onRejected?.();
             }
         }
@@ -297,10 +304,10 @@ const [NgpFileUploadStateToken, ngpFileUpload, injectFileUploadState, provideFil
     listener(element, 'drop', onDrop);
     return {
         isDragOver,
-        selected: selectedSubject.asObservable(),
-        canceled: canceledSubject.asObservable(),
-        rejected: rejectedSubject.asObservable(),
-        dragOverChanged: dragOverSubject.asObservable(),
+        selected: selected.asObservable(),
+        canceled: canceled.asObservable(),
+        rejected: rejected.asObservable(),
+        dragOverChanged: dragOver.asObservable(),
         showFileDialog,
     };
 });
@@ -390,12 +397,6 @@ class NgpFileUpload {
          * Whether the user is currently dragging a file over the file upload.
          */
         this.isDragOver = this.state.isDragOver;
-        ngpInteractions({
-            hover: true,
-            press: true,
-            focusVisible: true,
-            disabled: this.disabled,
-        });
     }
     /**
      * Show the file dialog.
@@ -413,7 +414,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.9", ngImpor
                     exportAs: 'ngpFileUpload',
                     providers: [provideFileUploadState()],
                 }]
-        }], ctorParameters: () => [], propDecorators: { fileTypes: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileUploadFileTypes", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileUploadMultiple", required: false }] }], directory: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileUploadDirectory", required: false }] }], dragAndDrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileUploadDragDrop", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileUploadDisabled", required: false }] }], selected: [{ type: i0.Output, args: ["ngpFileUploadSelected"] }], canceled: [{ type: i0.Output, args: ["ngpFileUploadCanceled"] }], rejected: [{ type: i0.Output, args: ["ngpFileUploadRejected"] }], dragOver: [{ type: i0.Output, args: ["ngpFileUploadDragOver"] }] } });
+        }], propDecorators: { fileTypes: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileUploadFileTypes", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileUploadMultiple", required: false }] }], directory: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileUploadDirectory", required: false }] }], dragAndDrop: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileUploadDragDrop", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "ngpFileUploadDisabled", required: false }] }], selected: [{ type: i0.Output, args: ["ngpFileUploadSelected"] }], canceled: [{ type: i0.Output, args: ["ngpFileUploadCanceled"] }], rejected: [{ type: i0.Output, args: ["ngpFileUploadRejected"] }], dragOver: [{ type: i0.Output, args: ["ngpFileUploadDragOver"] }] } });
 
 /**
  * Generated bundle index. Do not edit.