ng-primitives 0.35.0 → 0.36.0

package/fesm2022/ng-primitives-state.mjs

@@ -1,4 +1,4 @@
-import { InjectionToken, inject, signal, computed, isSignal, linkedSignal } from '@angular/core';
+import { InjectionToken, signal, inject, computed, isSignal, linkedSignal } from '@angular/core';
 
 /**
  * Create a new injection token for the state.
@@ -14,9 +14,16 @@ function createStateToken(description) {
  * @param token The token for the state
  */
 function createStateProvider(token) {
-    return () => ({
+    return ({ inherit } = {}) => ({
         provide: token,
-        useFactory: () => inject(token, { optional: true, skipSelf: true }) ?? signal({}),
+        useFactory: () => {
+            if (inherit === false) {
+                // if we are not checking the parent, we want to create a new state
+                return signal({});
+            }
+            // if we are checking the parent, we want to check if the state is already defined
+            return inject(token, { optional: true, skipSelf: true }) ?? signal({});
+        },
     });
 }
 function createStateInjector(token, options = {}) {

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

@@ -1 +1 @@
-{"version":3,"file":"ng-primitives-state.mjs","sources":["../../../../packages/ng-primitives/state/src/index.ts","../../../../packages/ng-primitives/state/src/ng-primitives-state.ts"],"sourcesContent":["import {\n  computed,\n  FactoryProvider,\n  inject,\n  InjectionToken,\n  InjectOptions,\n  InputSignal,\n  InputSignalWithTransform,\n  isSignal,\n  linkedSignal,\n  ProviderToken,\n  signal,\n  Signal,\n  WritableSignal,\n} from '@angular/core';\n\n/**\n * This converts the state object to a writable state object.\n * This means that inputs become signals which are writable.\n */\nexport type State<T> = {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  [K in keyof T]: T[K] extends InputSignalWithTransform<infer U, any>\n    ? WritableSignal<U>\n    : T[K] extends InputSignal<infer R>\n      ? WritableSignal<R>\n      : T[K];\n};\n\n/**\n * This is similar to the state object, but we don't expose properties that are not\n * inputs.\n */\nexport type CreatedState<T> = {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  [K in keyof T]: T[K] extends InputSignalWithTransform<infer U, any>\n    ? WritableSignal<U>\n    : T[K] extends InputSignal<infer R>\n      ? WritableSignal<R>\n      : never;\n};\n\nexport type InjectedState<T> = Signal<State<T>>;\n\n/**\n * Create a new injection token for the state.\n * @param description The description of the token\n */\nexport function createStateToken<T>(description: string): InjectionToken<T> {\n  return new InjectionToken<Signal<State<T>>>(`Ngp${description}StateToken`);\n}\n\n/**\n * Create a new provider for the state. It first tries to inject the state from the parent injector,\n * as this allows for the state to be hoisted to a higher level in the component tree. This can\n * be useful to avoid issues where the injector can't be shared in some cases when ng-content is used.\n * @param token The token for the state\n */\nexport function createStateProvider<T>(token: ProviderToken<T>): () => FactoryProvider {\n  return () => ({\n    provide: token,\n    useFactory: () => inject(token, { optional: true, skipSelf: true }) ?? signal({}),\n  });\n}\n\ntype CreateStateInjectorOptions = {\n  /**\n   * Whether the state may not be immediately available. This can happen when the child is instantiated before the parent.\n   */\n  deferred?: boolean;\n};\n\n/**\n * Create a new state injector for the state.\n * @param token The token for the state\n */\nexport function createStateInjector<T>(\n  token: ProviderToken<State<T>>,\n  options: { deferred: true },\n): <U = T>(injectOptions?: InjectOptions) => Signal<State<U> | undefined>;\nexport function createStateInjector<T>(\n  token: ProviderToken<State<T>>,\n  options?: CreateStateInjectorOptions,\n): <U = T>(injectOptions?: InjectOptions) => Signal<State<U>>;\nexport function createStateInjector<T>(\n  token: ProviderToken<State<T>>,\n  options: CreateStateInjectorOptions = {},\n): <U = T>(injectOptions?: InjectOptions) => Signal<State<U> | undefined> {\n  return <U = T>(injectOptions: InjectOptions = {}) => {\n    const value = inject(token, injectOptions) as Signal<State<U> | undefined> | null;\n\n    if (options.deferred) {\n      return computed(() =>\n        value && Object.keys(value() ?? {}).length === 0 ? undefined : value?.(),\n      ) as Signal<State<U> | undefined>;\n    }\n\n    return (value as Signal<State<U>>) ?? signal(undefined);\n  };\n}\n\n/**\n * Convert the original state object into a writable state object.\n * @param token The token for the state\n */\nexport function createState(token: ProviderToken<WritableSignal<State<unknown>>>) {\n  return <U>(state: U): CreatedState<U> => {\n    const internalState = inject(token);\n\n    internalState.update(obj => {\n      // Iterating over properties\n      for (const key in state) {\n        const value = state[key as keyof U];\n\n        // If this is a signal but doesn't have a set method, we need to wrap it in a linked signal\n        // This is because the signal is not writable\n        // and we need to create a new signal that is writable\n        // and linked to the original signal\n        if (isSignal(value) && 'set' in value === false) {\n          // @ts-ignore\n          obj[key] = linkedSignal(() => value());\n        } else {\n          // @ts-ignore\n          obj[key] = value;\n        }\n      }\n\n      // Iterating over prototype methods\n      const prototype = Object.getPrototypeOf(state);\n\n      for (const key of Object.getOwnPropertyNames(prototype)) {\n        const descriptor = Object.getOwnPropertyDescriptor(prototype, key);\n\n        // if this is a getter or setter, we need to define it on the object\n        if (descriptor?.get || descriptor?.set) {\n          Object.defineProperty(obj, key, descriptor);\n        } else if (typeof prototype[key as keyof U] === 'function') {\n          (obj as Record<string, unknown>)[key] = prototype[key as keyof U].bind(state);\n        } else {\n          // @ts-ignore\n          obj[key] = prototype[key as keyof U];\n        }\n      }\n\n      return { ...obj };\n    });\n\n    return internalState() as unknown as CreatedState<U>;\n  };\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;AA4CA;;;AAGG;AACG,SAAU,gBAAgB,CAAI,WAAmB,EAAA;AACrD,IAAA,OAAO,IAAI,cAAc,CAAmB,MAAM,WAAW,CAAA,UAAA,CAAY,CAAC;AAC5E;AAEA;;;;;AAKG;AACG,SAAU,mBAAmB,CAAI,KAAuB,EAAA;IAC5D,OAAO,OAAO;AACZ,QAAA,OAAO,EAAE,KAAK;QACd,UAAU,EAAE,MAAM,MAAM,CAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,IAAI,MAAM,CAAC,EAAE,CAAC;AAClF,KAAA,CAAC;AACJ;SAqBgB,mBAAmB,CACjC,KAA8B,EAC9B,UAAsC,EAAE,EAAA;AAExC,IAAA,OAAO,CAAQ,aAAA,GAA+B,EAAE,KAAI;QAClD,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,EAAE,aAAa,CAAwC;AAEjF,QAAA,IAAI,OAAO,CAAC,QAAQ,EAAE;AACpB,YAAA,OAAO,QAAQ,CAAC,MACd,KAAK,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,KAAK,CAAC,GAAG,SAAS,GAAG,KAAK,IAAI,CACzC;;AAGnC,QAAA,OAAQ,KAA0B,IAAI,MAAM,CAAC,SAAS,CAAC;AACzD,KAAC;AACH;AAEA;;;AAGG;AACG,SAAU,WAAW,CAAC,KAAoD,EAAA;IAC9E,OAAO,CAAI,KAAQ,KAAqB;AACtC,QAAA,MAAM,aAAa,GAAG,MAAM,CAAC,KAAK,CAAC;AAEnC,QAAA,aAAa,CAAC,MAAM,CAAC,GAAG,IAAG;;AAEzB,YAAA,KAAK,MAAM,GAAG,IAAI,KAAK,EAAE;AACvB,gBAAA,MAAM,KAAK,GAAG,KAAK,CAAC,GAAc,CAAC;;;;;gBAMnC,IAAI,QAAQ,CAAC,KAAK,CAAC,IAAI,KAAK,IAAI,KAAK,KAAK,KAAK,EAAE;;AAE/C,oBAAA,GAAG,CAAC,GAAG,CAAC,GAAG,YAAY,CAAC,MAAM,KAAK,EAAE,CAAC;;qBACjC;;AAEL,oBAAA,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK;;;;YAKpB,MAAM,SAAS,GAAG,MAAM,CAAC,cAAc,CAAC,KAAK,CAAC;YAE9C,KAAK,MAAM,GAAG,IAAI,MAAM,CAAC,mBAAmB,CAAC,SAAS,CAAC,EAAE;gBACvD,MAAM,UAAU,GAAG,MAAM,CAAC,wBAAwB,CAAC,SAAS,EAAE,GAAG,CAAC;;gBAGlE,IAAI,UAAU,EAAE,GAAG,IAAI,UAAU,EAAE,GAAG,EAAE;oBACtC,MAAM,CAAC,cAAc,CAAC,GAAG,EAAE,GAAG,EAAE,UAAU,CAAC;;qBACtC,IAAI,OAAO,SAAS,CAAC,GAAc,CAAC,KAAK,UAAU,EAAE;AACzD,oBAAA,GAA+B,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC,GAAc,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;;qBACxE;;oBAEL,GAAG,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC,GAAc,CAAC;;;AAIxC,YAAA,OAAO,EAAE,GAAG,GAAG,EAAE;AACnB,SAAC,CAAC;QAEF,OAAO,aAAa,EAAgC;AACtD,KAAC;AACH;;ACrJA;;AAEG;;;;"}
+{"version":3,"file":"ng-primitives-state.mjs","sources":["../../../../packages/ng-primitives/state/src/index.ts","../../../../packages/ng-primitives/state/src/ng-primitives-state.ts"],"sourcesContent":["import {\n  computed,\n  FactoryProvider,\n  inject,\n  InjectionToken,\n  InjectOptions,\n  InputSignal,\n  InputSignalWithTransform,\n  isSignal,\n  linkedSignal,\n  ProviderToken,\n  signal,\n  Signal,\n  WritableSignal,\n} from '@angular/core';\n\n/**\n * This converts the state object to a writable state object.\n * This means that inputs become signals which are writable.\n */\nexport type State<T> = {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  [K in keyof T]: T[K] extends InputSignalWithTransform<infer U, any>\n    ? WritableSignal<U>\n    : T[K] extends InputSignal<infer R>\n      ? WritableSignal<R>\n      : T[K];\n};\n\n/**\n * This is similar to the state object, but we don't expose properties that are not\n * inputs.\n */\nexport type CreatedState<T> = {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  [K in keyof T]: T[K] extends InputSignalWithTransform<infer U, any>\n    ? WritableSignal<U>\n    : T[K] extends InputSignal<infer R>\n      ? WritableSignal<R>\n      : never;\n};\n\nexport type InjectedState<T> = Signal<State<T>>;\n\n/**\n * Create a new injection token for the state.\n * @param description The description of the token\n */\nexport function createStateToken<T>(description: string): InjectionToken<T> {\n  return new InjectionToken<Signal<State<T>>>(`Ngp${description}StateToken`);\n}\n\nexport interface CreateStateProviderOptions {\n  /**\n   * Whether we should check for the state in the parent injector.\n   */\n  inherit?: boolean;\n}\n\n/**\n * Create a new provider for the state. It first tries to inject the state from the parent injector,\n * as this allows for the state to be hoisted to a higher level in the component tree. This can\n * be useful to avoid issues where the injector can't be shared in some cases when ng-content is used.\n * @param token The token for the state\n */\nexport function createStateProvider<T>(\n  token: ProviderToken<T>,\n): (options?: CreateStateProviderOptions) => FactoryProvider {\n  return ({ inherit }: CreateStateProviderOptions = {}) => ({\n    provide: token,\n    useFactory: () => {\n      if (inherit === false) {\n        // if we are not checking the parent, we want to create a new state\n        return signal({});\n      }\n      // if we are checking the parent, we want to check if the state is already defined\n      return inject(token, { optional: true, skipSelf: true }) ?? signal({});\n    },\n  });\n}\n\ntype CreateStateInjectorOptions = {\n  /**\n   * Whether the state may not be immediately available. This can happen when the child is instantiated before the parent.\n   */\n  deferred?: boolean;\n};\n\n/**\n * Create a new state injector for the state.\n * @param token The token for the state\n */\nexport function createStateInjector<T>(\n  token: ProviderToken<State<T>>,\n  options: { deferred: true },\n): <U = T>(injectOptions?: InjectOptions) => Signal<State<U> | undefined>;\nexport function createStateInjector<T>(\n  token: ProviderToken<State<T>>,\n  options?: CreateStateInjectorOptions,\n): <U = T>(injectOptions?: InjectOptions) => Signal<State<U>>;\nexport function createStateInjector<T>(\n  token: ProviderToken<State<T>>,\n  options: CreateStateInjectorOptions = {},\n): <U = T>(injectOptions?: InjectOptions) => Signal<State<U> | undefined> {\n  return <U = T>(injectOptions: InjectOptions = {}) => {\n    const value = inject(token, injectOptions) as Signal<State<U> | undefined> | null;\n\n    if (options.deferred) {\n      return computed(() =>\n        value && Object.keys(value() ?? {}).length === 0 ? undefined : value?.(),\n      ) as Signal<State<U> | undefined>;\n    }\n\n    return (value as Signal<State<U>>) ?? signal(undefined);\n  };\n}\n\n/**\n * Convert the original state object into a writable state object.\n * @param token The token for the state\n */\nexport function createState(token: ProviderToken<WritableSignal<State<unknown>>>) {\n  return <U>(state: U): CreatedState<U> => {\n    const internalState = inject(token);\n\n    internalState.update(obj => {\n      // Iterating over properties\n      for (const key in state) {\n        const value = state[key as keyof U];\n\n        // If this is a signal but doesn't have a set method, we need to wrap it in a linked signal\n        // This is because the signal is not writable\n        // and we need to create a new signal that is writable\n        // and linked to the original signal\n        if (isSignal(value) && 'set' in value === false) {\n          // @ts-ignore\n          obj[key] = linkedSignal(() => value());\n        } else {\n          // @ts-ignore\n          obj[key] = value;\n        }\n      }\n\n      // Iterating over prototype methods\n      const prototype = Object.getPrototypeOf(state);\n\n      for (const key of Object.getOwnPropertyNames(prototype)) {\n        const descriptor = Object.getOwnPropertyDescriptor(prototype, key);\n\n        // if this is a getter or setter, we need to define it on the object\n        if (descriptor?.get || descriptor?.set) {\n          Object.defineProperty(obj, key, descriptor);\n        } else if (typeof prototype[key as keyof U] === 'function') {\n          (obj as Record<string, unknown>)[key] = prototype[key as keyof U].bind(state);\n        } else {\n          // @ts-ignore\n          obj[key] = prototype[key as keyof U];\n        }\n      }\n\n      return { ...obj };\n    });\n\n    return internalState() as unknown as CreatedState<U>;\n  };\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;AA4CA;;;AAGG;AACG,SAAU,gBAAgB,CAAI,WAAmB,EAAA;AACrD,IAAA,OAAO,IAAI,cAAc,CAAmB,MAAM,WAAW,CAAA,UAAA,CAAY,CAAC;AAC5E;AASA;;;;;AAKG;AACG,SAAU,mBAAmB,CACjC,KAAuB,EAAA;IAEvB,OAAO,CAAC,EAAE,OAAO,EAAA,GAAiC,EAAE,MAAM;AACxD,QAAA,OAAO,EAAE,KAAK;QACd,UAAU,EAAE,MAAK;AACf,YAAA,IAAI,OAAO,KAAK,KAAK,EAAE;;AAErB,gBAAA,OAAO,MAAM,CAAC,EAAE,CAAC;;;AAGnB,YAAA,OAAO,MAAM,CAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,IAAI,MAAM,CAAC,EAAE,CAAC;SACvE;AACF,KAAA,CAAC;AACJ;SAqBgB,mBAAmB,CACjC,KAA8B,EAC9B,UAAsC,EAAE,EAAA;AAExC,IAAA,OAAO,CAAQ,aAAA,GAA+B,EAAE,KAAI;QAClD,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,EAAE,aAAa,CAAwC;AAEjF,QAAA,IAAI,OAAO,CAAC,QAAQ,EAAE;AACpB,YAAA,OAAO,QAAQ,CAAC,MACd,KAAK,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,KAAK,CAAC,GAAG,SAAS,GAAG,KAAK,IAAI,CACzC;;AAGnC,QAAA,OAAQ,KAA0B,IAAI,MAAM,CAAC,SAAS,CAAC;AACzD,KAAC;AACH;AAEA;;;AAGG;AACG,SAAU,WAAW,CAAC,KAAoD,EAAA;IAC9E,OAAO,CAAI,KAAQ,KAAqB;AACtC,QAAA,MAAM,aAAa,GAAG,MAAM,CAAC,KAAK,CAAC;AAEnC,QAAA,aAAa,CAAC,MAAM,CAAC,GAAG,IAAG;;AAEzB,YAAA,KAAK,MAAM,GAAG,IAAI,KAAK,EAAE;AACvB,gBAAA,MAAM,KAAK,GAAG,KAAK,CAAC,GAAc,CAAC;;;;;gBAMnC,IAAI,QAAQ,CAAC,KAAK,CAAC,IAAI,KAAK,IAAI,KAAK,KAAK,KAAK,EAAE;;AAE/C,oBAAA,GAAG,CAAC,GAAG,CAAC,GAAG,YAAY,CAAC,MAAM,KAAK,EAAE,CAAC;;qBACjC;;AAEL,oBAAA,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK;;;;YAKpB,MAAM,SAAS,GAAG,MAAM,CAAC,cAAc,CAAC,KAAK,CAAC;YAE9C,KAAK,MAAM,GAAG,IAAI,MAAM,CAAC,mBAAmB,CAAC,SAAS,CAAC,EAAE;gBACvD,MAAM,UAAU,GAAG,MAAM,CAAC,wBAAwB,CAAC,SAAS,EAAE,GAAG,CAAC;;gBAGlE,IAAI,UAAU,EAAE,GAAG,IAAI,UAAU,EAAE,GAAG,EAAE;oBACtC,MAAM,CAAC,cAAc,CAAC,GAAG,EAAE,GAAG,EAAE,UAAU,CAAC;;qBACtC,IAAI,OAAO,SAAS,CAAC,GAAc,CAAC,KAAK,UAAU,EAAE;AACzD,oBAAA,GAA+B,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC,GAAc,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;;qBACxE;;oBAEL,GAAG,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC,GAAc,CAAC;;;AAIxC,YAAA,OAAO,EAAE,GAAG,GAAG,EAAE;AACnB,SAAC,CAAC;QAEF,OAAO,aAAa,EAAgC;AACtD,KAAC;AACH;;ACrKA;;AAEG;;;;"}

package/fesm2022/ng-primitives-tabs.mjs

@@ -1,7 +1,6 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, inject, input, booleanAttribute, computed, Directive, HostListener, output, signal } from '@angular/core';
-import * as i2 from 'ng-primitives/interactions';
-import { NgpHover, NgpFocusVisible, NgpPress } from 'ng-primitives/interactions';
+import { setupInteractions } from 'ng-primitives/internal';
 import * as i1 from 'ng-primitives/roving-focus';
 import { NgpRovingFocusItem, injectRovingFocusGroupState, NgpRovingFocusGroup } from 'ng-primitives/roving-focus';
 import { createStateToken, createStateProvider, createStateInjector, createState } from 'ng-primitives/state';
@@ -91,6 +90,12 @@ class NgpTabButton {
          * Whether the tab is active
          */
         this.active = computed(() => this.state().selectedTab() === this.value());
+        setupInteractions({
+            hover: true,
+            press: true,
+            focusVisible: true,
+            disabled: this.disabled,
+        });
     }
     ngOnInit() {
         if (this.value() === undefined) {
@@ -112,7 +117,7 @@ class NgpTabButton {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NgpTabButton, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.7", type: NgpTabButton, isStandalone: true, selector: "[ngpTabButton]", inputs: { value: { classPropertyName: "value", publicName: "ngpTabButtonValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpTabButtonDisabled", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "tab" }, listeners: { "click": "select()", "focus": "activateOnFocus()" }, properties: { "attr.id": "id() ?? defaultId()", "attr.aria-controls": "ariaControls()", "attr.data-active": "active() ? \"\" : null", "attr.data-disabled": "disabled() ? \"\" : null", "attr.data-orientation": "state().orientation()" } }, exportAs: ["ngpTabButton"], hostDirectives: [{ directive: i1.NgpRovingFocusItem }, { directive: i2.NgpHover }, { directive: i2.NgpFocusVisible }, { directive: i2.NgpPress }], ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.7", type: NgpTabButton, isStandalone: true, selector: "[ngpTabButton]", inputs: { value: { classPropertyName: "value", publicName: "ngpTabButtonValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpTabButtonDisabled", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "tab" }, listeners: { "click": "select()", "focus": "activateOnFocus()" }, properties: { "attr.id": "id() ?? defaultId()", "attr.aria-controls": "ariaControls()", "attr.data-active": "active() ? \"\" : null", "attr.data-disabled": "disabled() ? \"\" : null", "attr.data-orientation": "state().orientation()" } }, exportAs: ["ngpTabButton"], hostDirectives: [{ directive: i1.NgpRovingFocusItem }], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NgpTabButton, decorators: [{
             type: Directive,
@@ -127,9 +132,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImpor
                         '[attr.data-disabled]': 'disabled() ? "" : null',
                         '[attr.data-orientation]': 'state().orientation()',
                     },
-                    hostDirectives: [NgpRovingFocusItem, NgpHover, NgpFocusVisible, NgpPress],
+                    hostDirectives: [NgpRovingFocusItem],
                 }]
-        }], propDecorators: { select: [{
+        }], ctorParameters: () => [], propDecorators: { select: [{
                 type: HostListener,
                 args: ['click']
             }], activateOnFocus: [{
@@ -233,20 +238,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImpor
                 }]
         }] });
 
-const NgpTabsetToken = new InjectionToken('NgpTabsetToken');
-/**
- * Inject the Tabset directive instance
- */
-function injectTabset() {
-    return inject(NgpTabsetToken);
-}
-/**
- * Provide the Tabset directive instance
- */
-function provideTabset(type) {
-    return { provide: NgpTabsetToken, useExisting: type };
-}
-
 /**
  * Apply the `ngpTabset` directive to an element to manage the tabs.
  */
@@ -323,6 +314,10 @@ class NgpTabset {
      * @param value The value of the tab to select
      */
     select(value) {
+        // if the value is already selected, do nothing
+        if (this.state.value() === value) {
+            return;
+        }
         this.state.value.set(value);
         this.valueChange.emit(value);
     }
@@ -341,14 +336,14 @@ class NgpTabset {
         this.panels.update(panels => panels.filter(panel => panel !== tab));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NgpTabset, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.7", type: NgpTabset, isStandalone: true, selector: "[ngpTabset]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "ngpTabsetValue", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "ngpTabsetOrientation", isSignal: true, isRequired: false, transformFunction: null }, activateOnFocus: { classPropertyName: "activateOnFocus", publicName: "ngpTabsetActivateOnFocus", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "ngpTabsetValueChange" }, host: { properties: { "attr.id": "state.id()", "attr.data-orientation": "state.orientation()" } }, providers: [provideTabset(NgpTabset), provideTabsetState()], exportAs: ["ngpTabset"], hostDirectives: [{ directive: i1.NgpRovingFocusGroup, inputs: ["ngpRovingFocusGroupOrientation", "ngpTabsetOrientation"] }], ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.7", type: NgpTabset, isStandalone: true, selector: "[ngpTabset]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "ngpTabsetValue", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "ngpTabsetOrientation", isSignal: true, isRequired: false, transformFunction: null }, activateOnFocus: { classPropertyName: "activateOnFocus", publicName: "ngpTabsetActivateOnFocus", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "ngpTabsetValueChange" }, host: { properties: { "attr.id": "state.id()", "attr.data-orientation": "state.orientation()" } }, providers: [provideTabsetState()], exportAs: ["ngpTabset"], hostDirectives: [{ directive: i1.NgpRovingFocusGroup, inputs: ["ngpRovingFocusGroupOrientation", "ngpTabsetOrientation"] }], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NgpTabset, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpTabset]',
                     exportAs: 'ngpTabset',
-                    providers: [provideTabset(NgpTabset), provideTabsetState()],
+                    providers: [provideTabsetState()],
                     hostDirectives: [
                         {
                             directive: NgpRovingFocusGroup,
@@ -366,5 +361,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { NgpTabButton, NgpTabList, NgpTabPanel, NgpTabPanelToken, NgpTabset, NgpTabsetToken, injectTabPanel, injectTabset, injectTabsetState, provideTabsConfig, provideTabsetState };
+export { NgpTabButton, NgpTabList, NgpTabPanel, NgpTabPanelToken, NgpTabset, injectTabPanel, injectTabsetState, provideTabsConfig, provideTabsetState };
 //# sourceMappingURL=ng-primitives-tabs.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"ng-primitives-tabs.mjs","sources":["../../../../packages/ng-primitives/tabs/src/config/tabs-config.ts","../../../../packages/ng-primitives/tabs/src/tabset/tabset-state.ts","../../../../packages/ng-primitives/tabs/src/tab-button/tab-button.ts","../../../../packages/ng-primitives/tabs/src/tab-list/tab-list.ts","../../../../packages/ng-primitives/tabs/src/tab-panel/tab-panel-token.ts","../../../../packages/ng-primitives/tabs/src/tab-panel/tab-panel.ts","../../../../packages/ng-primitives/tabs/src/tabset/tabset-token.ts","../../../../packages/ng-primitives/tabs/src/tabset/tabset.ts","../../../../packages/ng-primitives/tabs/src/ng-primitives-tabs.ts"],"sourcesContent":["import { InjectionToken, Provider, inject } from '@angular/core';\nimport { NgpOrientation } from 'ng-primitives/common';\n\nexport interface NgpTabsConfig {\n  /**\n   * The orientation of the tabset\n   * @default 'horizontal'\n   */\n  orientation: NgpOrientation;\n\n  /**\n   * Whether tabs should activate on focus\n   * @default true\n   */\n  activateOnFocus: boolean;\n\n  /**\n   * Whether focus should wrap within the tab list when using the keyboard.\n   * @default true\n   */\n  wrap: boolean;\n}\n\nexport const defaultTabsConfig: NgpTabsConfig = {\n  orientation: 'horizontal',\n  activateOnFocus: true,\n  wrap: true,\n};\n\nexport const NgpTabsConfigToken = new InjectionToken<NgpTabsConfig>('NgpTabsConfigToken');\n\n/**\n * Provide the default Tabs configuration\n * @param config The Tabs configuration\n * @returns The provider\n */\nexport function provideTabsConfig(config: Partial<NgpTabsConfig>): Provider[] {\n  return [\n    {\n      provide: NgpTabsConfigToken,\n      useValue: { ...defaultTabsConfig, ...config },\n    },\n  ];\n}\n\n/**\n * Inject the Tabs configuration\n * @returns The global Tabs configuration\n */\nexport function injectTabsConfig(): NgpTabsConfig {\n  return inject(NgpTabsConfigToken, { optional: true }) ?? defaultTabsConfig;\n}\n","import {\n  createState,\n  createStateInjector,\n  createStateProvider,\n  createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpTabset } from './tabset';\n\n/**\n * The state token  for the Tabset primitive.\n */\nexport const NgpTabsetStateToken = createStateToken<NgpTabset>('Tabset');\n\n/**\n * Provides the Tabset state.\n */\nexport const provideTabsetState = createStateProvider(NgpTabsetStateToken);\n\n/**\n * Injects the Tabset state.\n */\nexport const injectTabsetState = createStateInjector(NgpTabsetStateToken);\n\n/**\n * The Tabset state registration function.\n */\nexport const tabsetState = createState(NgpTabsetStateToken);\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { Directive, HostListener, OnInit, booleanAttribute, computed, input } from '@angular/core';\nimport { NgpFocusVisible, NgpHover, NgpPress } from 'ng-primitives/interactions';\nimport { NgpRovingFocusItem } from 'ng-primitives/roving-focus';\nimport { injectTabsetState } from '../tabset/tabset-state';\n\n/**\n * 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.\n */\n@Directive({\n  selector: '[ngpTabButton]',\n  exportAs: 'ngpTabButton',\n  host: {\n    role: 'tab',\n    '[attr.id]': 'id() ?? defaultId()',\n    '[attr.aria-controls]': 'ariaControls()',\n    '[attr.data-active]': 'active() ? \"\" : null',\n    '[attr.data-disabled]': 'disabled() ? \"\" : null',\n    '[attr.data-orientation]': 'state().orientation()',\n  },\n  hostDirectives: [NgpRovingFocusItem, NgpHover, NgpFocusVisible, NgpPress],\n})\nexport class NgpTabButton implements OnInit {\n  /**\n   * Access the tabset state\n   */\n  protected readonly state = injectTabsetState();\n\n  /**\n   * The value of the tab this trigger controls\n   */\n  readonly value = input<string>(undefined, { alias: 'ngpTabButtonValue' });\n\n  /**\n   * Whether the tab is disabled\n   * @default false\n   */\n  readonly disabled = input<boolean, BooleanInput>(false, {\n    alias: 'ngpTabButtonDisabled',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * Determine the id of the tab button\n   * @internal\n   */\n  readonly id = input<string>();\n\n  /**\n   * Determine a unique id for the tab button if not provided\n   * @internal\n   */\n  readonly defaultId = computed(() => `${this.state().id()}-button-${this.value()}`);\n\n  /**\n   * Determine the aria-controls of the tab button\n   * @internal\n   */\n  readonly ariaControls = computed(() => `${this.state().id()}-panel-${this.value()}`);\n\n  /**\n   * Whether the tab is active\n   */\n  readonly active = computed(() => this.state().selectedTab() === this.value());\n\n  ngOnInit(): void {\n    if (this.value() === undefined) {\n      throw new Error('ngpTabButton: value is required');\n    }\n  }\n\n  /**\n   * Select the tab this trigger controls\n   */\n  @HostListener('click')\n  select(): void {\n    this.state().select(this.value()!);\n  }\n\n  /**\n   * On focus select the tab this trigger controls if activateOnFocus is true\n   */\n  @HostListener('focus')\n  protected activateOnFocus(): void {\n    if (this.state().activateOnFocus()) {\n      this.select();\n    }\n  }\n}\n","import { Directive } from '@angular/core';\nimport { injectTabsetState } from '../tabset/tabset-state';\n\n/**\n * Apply the `ngpTabList` directive to an element that represents the list of tab buttons.\n */\n@Directive({\n  selector: '[ngpTabList]',\n  exportAs: 'ngpTabList',\n  host: {\n    role: 'tablist',\n    '[attr.aria-orientation]': 'state().orientation()',\n    '[attr.data-orientation]': 'state().orientation()',\n  },\n})\nexport class NgpTabList {\n  /**\n   * Access the tabset state\n   */\n  protected readonly state = injectTabsetState();\n}\n","import { InjectionToken, inject } from '@angular/core';\nimport type { NgpTabPanel } from './tab-panel';\n\nexport const NgpTabPanelToken = new InjectionToken<NgpTabPanel>('NgpTabPanelToken');\n\n/**\n * Inject the TabPanel directive instance\n * @returns The TabPanel directive instance\n */\nexport function injectTabPanel(): NgpTabPanel {\n  return inject(NgpTabPanelToken);\n}\n","import { Directive, OnDestroy, OnInit, computed, input } from '@angular/core';\nimport { injectTabsetState } from '../tabset/tabset-state';\nimport { NgpTabPanelToken } from './tab-panel-token';\n\n/**\n * Apply the `ngpTabPanel` directive to an element that represents the content of a tab.\n */\n@Directive({\n  selector: '[ngpTabPanel]',\n  exportAs: 'ngpTabPanel',\n  providers: [{ provide: NgpTabPanelToken, useExisting: NgpTabPanel }],\n  host: {\n    role: 'tabpanel',\n    tabIndex: '0',\n    '[attr.aria-labelledby]': 'labelledBy()',\n    '[attr.data-active]': 'active() ? \"\" : null',\n    '[attr.data-orientation]': 'state().orientation()',\n  },\n})\nexport class NgpTabPanel implements OnInit, OnDestroy {\n  /**\n   * Access the tabset\n   */\n  protected readonly state = injectTabsetState();\n\n  /**\n   * The value of the tab\n   */\n  readonly value = input<string>(undefined, { alias: 'ngpTabPanelValue' });\n\n  /**\n   * Determine the id of the tab panel\n   * @internal\n   */\n  readonly id = input<string>();\n\n  /**\n   * Determine a unique id for the tab panel if not provided\n   * @internal\n   */\n  protected readonly defaultId = computed(() => `${this.state().id()}-panel-${this.value()}`);\n\n  /**\n   * Determine the aria-labelledby of the tab panel\n   * @internal\n   */\n  protected readonly labelledBy = computed(() => `${this.state().id()}-button-${this.value()}`);\n\n  /**\n   * Whether the tab is active\n   */\n  protected readonly active = computed(() => this.state().selectedTab() === this.value());\n\n  ngOnInit(): void {\n    this.state().registerTab(this);\n\n    if (this.value() === undefined) {\n      throw new Error('ngpTabPanel: value is required');\n    }\n  }\n\n  ngOnDestroy(): void {\n    this.state().unregisterTab(this);\n  }\n}\n","import { ExistingProvider, inject, InjectionToken, Type } from '@angular/core';\nimport type { NgpTabset } from './tabset';\n\nexport const NgpTabsetToken = new InjectionToken<NgpTabset>('NgpTabsetToken');\n\n/**\n * Inject the Tabset directive instance\n */\nexport function injectTabset(): NgpTabset {\n  return inject(NgpTabsetToken);\n}\n\n/**\n * Provide the Tabset directive instance\n */\nexport function provideTabset(type: Type<NgpTabset>): ExistingProvider {\n  return { provide: NgpTabsetToken, useExisting: type };\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport {\n  booleanAttribute,\n  computed,\n  Directive,\n  input,\n  OnInit,\n  output,\n  signal,\n} from '@angular/core';\nimport { NgpOrientation } from 'ng-primitives/common';\nimport { injectRovingFocusGroupState, NgpRovingFocusGroup } from 'ng-primitives/roving-focus';\nimport { uniqueId } from 'ng-primitives/utils';\nimport { injectTabsConfig } from '../config/tabs-config';\nimport type { NgpTabPanel } from '../tab-panel/tab-panel';\nimport { provideTabsetState, tabsetState } from './tabset-state';\nimport { provideTabset } from './tabset-token';\n\n/**\n * Apply the `ngpTabset` directive to an element to manage the tabs.\n */\n@Directive({\n  selector: '[ngpTabset]',\n  exportAs: 'ngpTabset',\n  providers: [provideTabset(NgpTabset), provideTabsetState()],\n  hostDirectives: [\n    {\n      directive: NgpRovingFocusGroup,\n      inputs: ['ngpRovingFocusGroupOrientation:ngpTabsetOrientation'],\n    },\n  ],\n  host: {\n    '[attr.id]': 'state.id()',\n    '[attr.data-orientation]': 'state.orientation()',\n  },\n})\nexport class NgpTabset implements OnInit {\n  /**\n   * Access the global tabset configuration\n   */\n  private readonly config = injectTabsConfig();\n\n  /**\n   * Access the roving focus group state\n   */\n  private readonly rovingFocusGroupState = injectRovingFocusGroupState();\n\n  /**\n   * Define the id for the tabset\n   */\n  readonly id = input<string>(uniqueId('ngp-tabset'));\n\n  /**\n   * Define the active tab\n   */\n  readonly value = input<string>(undefined, {\n    alias: 'ngpTabsetValue',\n  });\n\n  /**\n   * Emit the value of the selected tab when it changes\n   */\n  readonly valueChange = output<string | undefined>({\n    alias: 'ngpTabsetValueChange',\n  });\n\n  /**\n   * The orientation of the tabset\n   * @default 'horizontal'\n   */\n  readonly orientation = input<NgpOrientation>(this.config.orientation, {\n    alias: 'ngpTabsetOrientation',\n  });\n\n  /**\n   * Whether tabs should activate on focus\n   */\n  readonly activateOnFocus = input<boolean, BooleanInput>(this.config.activateOnFocus, {\n    alias: 'ngpTabsetActivateOnFocus',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * Access the tabs within the tabset\n   * @internal\n   */\n  readonly panels = signal<NgpTabPanel[]>([]);\n\n  /**\n   * @internal\n   * Get the id of the selected tab\n   */\n  readonly selectedTab = computed(() => {\n    const panels = this.panels();\n\n    // if there is a value set and a tab with that value exists, return the value\n    if (panels.some(panel => panel.value() === this.state.value())) {\n      return this.state.value();\n    }\n\n    // otherwise return the first tab\n    return panels[0]?.value();\n  });\n\n  /**\n   * The state of the tabset\n   */\n  protected readonly state = tabsetState<NgpTabset>(this);\n\n  ngOnInit(): void {\n    // the roving focus group defaults to vertical orientation whereas\n    // the default for the tabset may be different if provided via global config\n    this.rovingFocusGroupState().orientation.set(this.state.orientation());\n  }\n\n  /**\n   * Select a tab by its value\n   * @param value The value of the tab to select\n   */\n  select(value: string): void {\n    this.state.value.set(value);\n    this.valueChange.emit(value);\n  }\n\n  /**\n   * @internal\n   * Register a tab with the tabset\n   */\n  registerTab(tab: NgpTabPanel): void {\n    this.panels.update(panels => [...panels, tab]);\n  }\n\n  /**\n   * @internal\n   * Unregister a tab with the tabset\n   */\n  unregisterTab(tab: NgpTabPanel): void {\n    this.panels.update(panels => panels.filter(panel => panel !== tab));\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-tabs.mjs","sources":["../../../../packages/ng-primitives/tabs/src/config/tabs-config.ts","../../../../packages/ng-primitives/tabs/src/tabset/tabset-state.ts","../../../../packages/ng-primitives/tabs/src/tab-button/tab-button.ts","../../../../packages/ng-primitives/tabs/src/tab-list/tab-list.ts","../../../../packages/ng-primitives/tabs/src/tab-panel/tab-panel-token.ts","../../../../packages/ng-primitives/tabs/src/tab-panel/tab-panel.ts","../../../../packages/ng-primitives/tabs/src/tabset/tabset.ts","../../../../packages/ng-primitives/tabs/src/ng-primitives-tabs.ts"],"sourcesContent":["import { InjectionToken, Provider, inject } from '@angular/core';\nimport { NgpOrientation } from 'ng-primitives/common';\n\nexport interface NgpTabsConfig {\n  /**\n   * The orientation of the tabset\n   * @default 'horizontal'\n   */\n  orientation: NgpOrientation;\n\n  /**\n   * Whether tabs should activate on focus\n   * @default true\n   */\n  activateOnFocus: boolean;\n\n  /**\n   * Whether focus should wrap within the tab list when using the keyboard.\n   * @default true\n   */\n  wrap: boolean;\n}\n\nexport const defaultTabsConfig: NgpTabsConfig = {\n  orientation: 'horizontal',\n  activateOnFocus: true,\n  wrap: true,\n};\n\nexport const NgpTabsConfigToken = new InjectionToken<NgpTabsConfig>('NgpTabsConfigToken');\n\n/**\n * Provide the default Tabs configuration\n * @param config The Tabs configuration\n * @returns The provider\n */\nexport function provideTabsConfig(config: Partial<NgpTabsConfig>): Provider[] {\n  return [\n    {\n      provide: NgpTabsConfigToken,\n      useValue: { ...defaultTabsConfig, ...config },\n    },\n  ];\n}\n\n/**\n * Inject the Tabs configuration\n * @returns The global Tabs configuration\n */\nexport function injectTabsConfig(): NgpTabsConfig {\n  return inject(NgpTabsConfigToken, { optional: true }) ?? defaultTabsConfig;\n}\n","import {\n  createState,\n  createStateInjector,\n  createStateProvider,\n  createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpTabset } from './tabset';\n\n/**\n * The state token  for the Tabset primitive.\n */\nexport const NgpTabsetStateToken = createStateToken<NgpTabset>('Tabset');\n\n/**\n * Provides the Tabset state.\n */\nexport const provideTabsetState = createStateProvider(NgpTabsetStateToken);\n\n/**\n * Injects the Tabset state.\n */\nexport const injectTabsetState = createStateInjector(NgpTabsetStateToken);\n\n/**\n * The Tabset state registration function.\n */\nexport const tabsetState = createState(NgpTabsetStateToken);\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { Directive, HostListener, OnInit, booleanAttribute, computed, input } from '@angular/core';\nimport { setupInteractions } from 'ng-primitives/internal';\nimport { NgpRovingFocusItem } from 'ng-primitives/roving-focus';\nimport { injectTabsetState } from '../tabset/tabset-state';\n\n/**\n * 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.\n */\n@Directive({\n  selector: '[ngpTabButton]',\n  exportAs: 'ngpTabButton',\n  host: {\n    role: 'tab',\n    '[attr.id]': 'id() ?? defaultId()',\n    '[attr.aria-controls]': 'ariaControls()',\n    '[attr.data-active]': 'active() ? \"\" : null',\n    '[attr.data-disabled]': 'disabled() ? \"\" : null',\n    '[attr.data-orientation]': 'state().orientation()',\n  },\n  hostDirectives: [NgpRovingFocusItem],\n})\nexport class NgpTabButton implements OnInit {\n  /**\n   * Access the tabset state\n   */\n  protected readonly state = injectTabsetState();\n\n  /**\n   * The value of the tab this trigger controls\n   */\n  readonly value = input<string>(undefined, { alias: 'ngpTabButtonValue' });\n\n  /**\n   * Whether the tab is disabled\n   * @default false\n   */\n  readonly disabled = input<boolean, BooleanInput>(false, {\n    alias: 'ngpTabButtonDisabled',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * Determine the id of the tab button\n   * @internal\n   */\n  readonly id = input<string>();\n\n  /**\n   * Determine a unique id for the tab button if not provided\n   * @internal\n   */\n  readonly defaultId = computed(() => `${this.state().id()}-button-${this.value()}`);\n\n  /**\n   * Determine the aria-controls of the tab button\n   * @internal\n   */\n  readonly ariaControls = computed(() => `${this.state().id()}-panel-${this.value()}`);\n\n  /**\n   * Whether the tab is active\n   */\n  readonly active = computed(() => this.state().selectedTab() === this.value());\n\n  constructor() {\n    setupInteractions({\n      hover: true,\n      press: true,\n      focusVisible: true,\n      disabled: this.disabled,\n    });\n  }\n\n  ngOnInit(): void {\n    if (this.value() === undefined) {\n      throw new Error('ngpTabButton: value is required');\n    }\n  }\n\n  /**\n   * Select the tab this trigger controls\n   */\n  @HostListener('click')\n  select(): void {\n    this.state().select(this.value()!);\n  }\n\n  /**\n   * On focus select the tab this trigger controls if activateOnFocus is true\n   */\n  @HostListener('focus')\n  protected activateOnFocus(): void {\n    if (this.state().activateOnFocus()) {\n      this.select();\n    }\n  }\n}\n","import { Directive } from '@angular/core';\nimport { injectTabsetState } from '../tabset/tabset-state';\n\n/**\n * Apply the `ngpTabList` directive to an element that represents the list of tab buttons.\n */\n@Directive({\n  selector: '[ngpTabList]',\n  exportAs: 'ngpTabList',\n  host: {\n    role: 'tablist',\n    '[attr.aria-orientation]': 'state().orientation()',\n    '[attr.data-orientation]': 'state().orientation()',\n  },\n})\nexport class NgpTabList {\n  /**\n   * Access the tabset state\n   */\n  protected readonly state = injectTabsetState();\n}\n","import { InjectionToken, inject } from '@angular/core';\nimport type { NgpTabPanel } from './tab-panel';\n\nexport const NgpTabPanelToken = new InjectionToken<NgpTabPanel>('NgpTabPanelToken');\n\n/**\n * Inject the TabPanel directive instance\n * @returns The TabPanel directive instance\n */\nexport function injectTabPanel(): NgpTabPanel {\n  return inject(NgpTabPanelToken);\n}\n","import { Directive, OnDestroy, OnInit, computed, input } from '@angular/core';\nimport { injectTabsetState } from '../tabset/tabset-state';\nimport { NgpTabPanelToken } from './tab-panel-token';\n\n/**\n * Apply the `ngpTabPanel` directive to an element that represents the content of a tab.\n */\n@Directive({\n  selector: '[ngpTabPanel]',\n  exportAs: 'ngpTabPanel',\n  providers: [{ provide: NgpTabPanelToken, useExisting: NgpTabPanel }],\n  host: {\n    role: 'tabpanel',\n    tabIndex: '0',\n    '[attr.aria-labelledby]': 'labelledBy()',\n    '[attr.data-active]': 'active() ? \"\" : null',\n    '[attr.data-orientation]': 'state().orientation()',\n  },\n})\nexport class NgpTabPanel implements OnInit, OnDestroy {\n  /**\n   * Access the tabset\n   */\n  protected readonly state = injectTabsetState();\n\n  /**\n   * The value of the tab\n   */\n  readonly value = input<string>(undefined, { alias: 'ngpTabPanelValue' });\n\n  /**\n   * Determine the id of the tab panel\n   * @internal\n   */\n  readonly id = input<string>();\n\n  /**\n   * Determine a unique id for the tab panel if not provided\n   * @internal\n   */\n  protected readonly defaultId = computed(() => `${this.state().id()}-panel-${this.value()}`);\n\n  /**\n   * Determine the aria-labelledby of the tab panel\n   * @internal\n   */\n  protected readonly labelledBy = computed(() => `${this.state().id()}-button-${this.value()}`);\n\n  /**\n   * Whether the tab is active\n   */\n  protected readonly active = computed(() => this.state().selectedTab() === this.value());\n\n  ngOnInit(): void {\n    this.state().registerTab(this);\n\n    if (this.value() === undefined) {\n      throw new Error('ngpTabPanel: value is required');\n    }\n  }\n\n  ngOnDestroy(): void {\n    this.state().unregisterTab(this);\n  }\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport {\n  booleanAttribute,\n  computed,\n  Directive,\n  input,\n  OnInit,\n  output,\n  signal,\n} from '@angular/core';\nimport { NgpOrientation } from 'ng-primitives/common';\nimport { injectRovingFocusGroupState, NgpRovingFocusGroup } from 'ng-primitives/roving-focus';\nimport { uniqueId } from 'ng-primitives/utils';\nimport { injectTabsConfig } from '../config/tabs-config';\nimport type { NgpTabPanel } from '../tab-panel/tab-panel';\nimport { provideTabsetState, tabsetState } from './tabset-state';\n\n/**\n * Apply the `ngpTabset` directive to an element to manage the tabs.\n */\n@Directive({\n  selector: '[ngpTabset]',\n  exportAs: 'ngpTabset',\n  providers: [provideTabsetState()],\n  hostDirectives: [\n    {\n      directive: NgpRovingFocusGroup,\n      inputs: ['ngpRovingFocusGroupOrientation:ngpTabsetOrientation'],\n    },\n  ],\n  host: {\n    '[attr.id]': 'state.id()',\n    '[attr.data-orientation]': 'state.orientation()',\n  },\n})\nexport class NgpTabset implements OnInit {\n  /**\n   * Access the global tabset configuration\n   */\n  private readonly config = injectTabsConfig();\n\n  /**\n   * Access the roving focus group state\n   */\n  private readonly rovingFocusGroupState = injectRovingFocusGroupState();\n\n  /**\n   * Define the id for the tabset\n   */\n  readonly id = input<string>(uniqueId('ngp-tabset'));\n\n  /**\n   * Define the active tab\n   */\n  readonly value = input<string>(undefined, {\n    alias: 'ngpTabsetValue',\n  });\n\n  /**\n   * Emit the value of the selected tab when it changes\n   */\n  readonly valueChange = output<string | undefined>({\n    alias: 'ngpTabsetValueChange',\n  });\n\n  /**\n   * The orientation of the tabset\n   * @default 'horizontal'\n   */\n  readonly orientation = input<NgpOrientation>(this.config.orientation, {\n    alias: 'ngpTabsetOrientation',\n  });\n\n  /**\n   * Whether tabs should activate on focus\n   */\n  readonly activateOnFocus = input<boolean, BooleanInput>(this.config.activateOnFocus, {\n    alias: 'ngpTabsetActivateOnFocus',\n    transform: booleanAttribute,\n  });\n\n  /**\n   * Access the tabs within the tabset\n   * @internal\n   */\n  readonly panels = signal<NgpTabPanel[]>([]);\n\n  /**\n   * @internal\n   * Get the id of the selected tab\n   */\n  readonly selectedTab = computed(() => {\n    const panels = this.panels();\n\n    // if there is a value set and a tab with that value exists, return the value\n    if (panels.some(panel => panel.value() === this.state.value())) {\n      return this.state.value();\n    }\n\n    // otherwise return the first tab\n    return panels[0]?.value();\n  });\n\n  /**\n   * The state of the tabset\n   */\n  protected readonly state = tabsetState<NgpTabset>(this);\n\n  ngOnInit(): void {\n    // the roving focus group defaults to vertical orientation whereas\n    // the default for the tabset may be different if provided via global config\n    this.rovingFocusGroupState().orientation.set(this.state.orientation());\n  }\n\n  /**\n   * Select a tab by its value\n   * @param value The value of the tab to select\n   */\n  select(value: string): void {\n    // if the value is already selected, do nothing\n    if (this.state.value() === value) {\n      return;\n    }\n\n    this.state.value.set(value);\n    this.valueChange.emit(value);\n  }\n\n  /**\n   * @internal\n   * Register a tab with the tabset\n   */\n  registerTab(tab: NgpTabPanel): void {\n    this.panels.update(panels => [...panels, tab]);\n  }\n\n  /**\n   * @internal\n   * Unregister a tab with the tabset\n   */\n  unregisterTab(tab: NgpTabPanel): void {\n    this.panels.update(panels => panels.filter(panel => panel !== tab));\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-tooltip.mjs

@@ -1,11 +1,13 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, ElementRef, ViewContainerRef, Injector, input, booleanAttribute, output, numberAttribute, computed, signal, Directive, PLATFORM_ID, isDevMode } from '@angular/core';
-import { TemplatePortal, DomPortalOutlet } from '@angular/cdk/portal';
+import { InjectionToken, inject, ElementRef, ViewContainerRef, Injector, input, booleanAttribute, numberAttribute, computed, signal, TemplateRef, Type, ComponentRef, Directive, PLATFORM_ID, isDevMode } from '@angular/core';
+import { TemplatePortal, ComponentPortal, DomPortalOutlet } from '@angular/cdk/portal';
 import { DOCUMENT, isPlatformBrowser } from '@angular/common';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { offset, shift, flip, autoUpdate, computePosition } from '@floating-ui/dom';
+import * as i1 from 'ng-primitives/internal';
+import { injectExitAnimationManager, provideExitAnimationManager, NgpExitAnimation } from 'ng-primitives/internal';
 import { fromResizeEvent } from 'ng-primitives/resize';
-import { injectDisposables, onBooleanChange } from 'ng-primitives/utils';
+import { injectDisposables } from 'ng-primitives/utils';
 import { createStateToken, createStateProvider, createStateInjector, createState } from 'ng-primitives/state';
 import { getTransformOrigin } from 'ng-primitives/popover';
 
@@ -39,6 +41,20 @@ function injectTooltipConfig() {
     return inject(NgpTooltipConfigToken, { optional: true }) ?? defaultTooltipConfig;
 }
 
+const NgpTooltipContextToken = new InjectionToken('NgpTooltipContextToken');
+/**
+ * Inject the Tooltip context
+ */
+function injectTooltipContext() {
+    return inject(NgpTooltipContextToken);
+}
+/**
+ * Provide the Tooltip directive instance
+ */
+function provideTooltipContext(context) {
+    return { provide: NgpTooltipContextToken, useValue: context };
+}
+
 /**
  * The state token  for the TooltipTrigger primitive.
  */
@@ -61,6 +77,10 @@ const tooltipTriggerState = createState(NgpTooltipTriggerStateToken);
  */
 class NgpTooltipTrigger {
     constructor() {
+        /**
+         * Access the exit animation manager.
+         */
+        this.exitAnimationManager = injectExitAnimationManager();
         /**
          * Access the trigger element
          */
@@ -88,23 +108,9 @@ class NgpTooltipTrigger {
         /**
          * Access the tooltip template ref.
          */
-        this.tooltip = input.required({
+        this.tooltip = input(null, {
             alias: 'ngpTooltipTrigger',
         });
-        /**
-         * The open state of the tooltip.
-         * @default false
-         */
-        this.open = input(false, {
-            alias: 'ngpTooltipTriggerOpen',
-            transform: booleanAttribute,
-        });
-        /**
-         * Emit an event when the tooltip is opened or closed.
-         */
-        this.openChange = output({
-            alias: 'ngpTooltipTriggerOpenChange',
-        });
         /**
          * Define if the trigger should be disabled.
          * @default false
@@ -159,6 +165,13 @@ class NgpTooltipTrigger {
         this.container = input(this.config.container, {
             alias: 'ngpTooltipTriggerContainer',
         });
+        /**
+         * Provide context to the tooltip.
+         * @default null
+         */
+        this.context = input(null, {
+            alias: 'ngpTooltipTriggerContext',
+        });
         /**
          * Store the tooltip view ref.
          */
@@ -191,8 +204,6 @@ class NgpTooltipTrigger {
          * @internal
          */
         this.state = tooltipTriggerState(this);
-        // any time the open state changes then show or hide the tooltip
-        onBooleanChange(this.state.open, this.show.bind(this), this.hide.bind(this));
         // update the width of the trigger when it resizes
         fromResizeEvent(this.trigger.nativeElement)
             .pipe(takeUntilDestroyed())
@@ -201,33 +212,72 @@ class NgpTooltipTrigger {
     ngOnDestroy() {
         this.destroyTooltip();
     }
+    /**
+     * Show the tooltip.
+     */
     show() {
+        // if closing is in progress then clear the timeout to stop the popover from closing
+        if (this.closeTimeout) {
+            this.closeTimeout();
+            this.closeTimeout = undefined;
+        }
         // if the trigger is disabled or the tooltip is already open then do not show the tooltip
-        if (this.state.disabled() || this.state.open()) {
+        if (this.state.disabled() || this.openTimeout) {
+            return;
+        }
+        // if the tooltip exists in the DOM then do not create it again
+        if (this.viewRef) {
             return;
         }
-        this.state.open.set(true);
-        this.openChange.emit(true);
-        this.disposables.setTimeout(() => this.createTooltip(), this.state.showDelay());
+        this.openTimeout = this.disposables.setTimeout(() => this.createTooltip(), this.state.showDelay());
     }
+    /**
+     * Hide the tooltip.
+     */
     hide() {
+        // if closing is in progress then clear the timeout to stop the popover from opening
+        if (this.openTimeout) {
+            this.openTimeout();
+            this.openTimeout = undefined;
+        }
         // if the trigger is disabled or the tooltip is already closed then do not hide the tooltip
-        if (this.state.disabled() || !this.state.open()) {
+        if (this.state.disabled() || this.closeTimeout) {
             return;
         }
-        this.state.open.set(false);
-        this.openChange.emit(false);
-        this.disposables.setTimeout(() => this.destroyTooltip(), this.state.hideDelay());
+        this.closeTimeout = this.disposables.setTimeout(() => this.destroyTooltip(), this.state.hideDelay());
     }
     createTooltip() {
-        const portal = new TemplatePortal(this.tooltip(), this.viewContainerRef, undefined, this.injector);
-        const domOutlet = new DomPortalOutlet(this.state.container() ?? this.document.body, undefined, undefined, Injector.create({
+        this.openTimeout = undefined;
+        const tooltip = this.state.tooltip();
+        let portal;
+        // Create a new inject with the tooltip context
+        const injector = Injector.create({
             parent: this.injector,
-            providers: [],
-        }));
+            providers: [provideTooltipContext(this.state.context())],
+        });
+        if (tooltip instanceof TemplateRef) {
+            portal = new TemplatePortal(tooltip, this.viewContainerRef, { $implicit: this.state.context() }, injector);
+        }
+        else if (tooltip instanceof Type) {
+            portal = new ComponentPortal(tooltip, this.viewContainerRef, injector);
+        }
+        else {
+            throw new Error('Tooltip must be either a TemplateRef or a ComponentType');
+        }
+        const domOutlet = new DomPortalOutlet(this.state.container() ?? this.document.body, undefined, undefined, injector);
         this.viewRef = domOutlet.attach(portal);
-        this.viewRef.detectChanges();
-        const outletElement = this.viewRef.rootNodes[0];
+        let outletElement = null;
+        if (this.viewRef instanceof ComponentRef) {
+            this.viewRef.changeDetectorRef.detectChanges();
+            outletElement = this.viewRef.location.nativeElement;
+        }
+        else if (this.viewRef) {
+            this.viewRef.detectChanges();
+            outletElement = this.viewRef.rootNodes[0];
+        }
+        if (!outletElement) {
+            throw new Error('Outlet element is not available.');
+        }
         // we want to determine the strategy to use. If the tooltip has position: fixed then we want to use
         // fixed positioning. Otherwise we want to use absolute positioning.
         const strategy = getComputedStyle(outletElement).position === 'fixed' ? 'fixed' : 'absolute';
@@ -240,25 +290,25 @@ class NgpTooltipTrigger {
             this.position.set({ x: position.x, y: position.y });
         });
     }
-    destroyTooltip() {
-        this.state.open.set(false);
-        this.openChange.emit(false);
+    async destroyTooltip() {
+        this.closeTimeout = undefined;
+        await this.exitAnimationManager.exit();
         this.viewRef?.destroy();
         this.viewRef = null;
         this.dispose?.();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NgpTooltipTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.7", type: NgpTooltipTrigger, isStandalone: true, selector: "[ngpTooltipTrigger]", inputs: { tooltip: { classPropertyName: "tooltip", publicName: "ngpTooltipTrigger", isSignal: true, isRequired: true, transformFunction: null }, open: { classPropertyName: "open", publicName: "ngpTooltipTriggerOpen", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpTooltipTriggerDisabled", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "ngpTooltipTriggerPlacement", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "ngpTooltipTriggerOffset", isSignal: true, isRequired: false, transformFunction: null }, showDelay: { classPropertyName: "showDelay", publicName: "ngpTooltipTriggerShowDelay", isSignal: true, isRequired: false, transformFunction: null }, hideDelay: { classPropertyName: "hideDelay", publicName: "ngpTooltipTriggerHideDelay", isSignal: true, isRequired: false, transformFunction: null }, flip: { classPropertyName: "flip", publicName: "ngpTooltipTriggerFlip", isSignal: true, isRequired: false, transformFunction: null }, container: { classPropertyName: "container", publicName: "ngpTooltipTriggerContainer", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openChange: "ngpTooltipTriggerOpenChange" }, host: { listeners: { "mouseenter": "show()", "mouseleave": "hide()", "focus": "show()", "blur": "hide()" }, properties: { "attr.data-open": "state.open() ? \"\" : null", "attr.data-disabled": "disabled() ? \"\" : null" } }, providers: [provideTooltipTriggerState()], exportAs: ["ngpTooltipTrigger"], ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.0.7", type: NgpTooltipTrigger, isStandalone: true, selector: "[ngpTooltipTrigger]", inputs: { tooltip: { classPropertyName: "tooltip", publicName: "ngpTooltipTrigger", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpTooltipTriggerDisabled", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "ngpTooltipTriggerPlacement", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "ngpTooltipTriggerOffset", isSignal: true, isRequired: false, transformFunction: null }, showDelay: { classPropertyName: "showDelay", publicName: "ngpTooltipTriggerShowDelay", isSignal: true, isRequired: false, transformFunction: null }, hideDelay: { classPropertyName: "hideDelay", publicName: "ngpTooltipTriggerHideDelay", isSignal: true, isRequired: false, transformFunction: null }, flip: { classPropertyName: "flip", publicName: "ngpTooltipTriggerFlip", isSignal: true, isRequired: false, transformFunction: null }, container: { classPropertyName: "container", publicName: "ngpTooltipTriggerContainer", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "ngpTooltipTriggerContext", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "mouseenter": "show()", "mouseleave": "hide()", "focus": "show()", "blur": "hide()" }, properties: { "attr.data-open": "viewRef !== null ? \"\" : null", "attr.data-disabled": "state.disabled() ? \"\" : null" } }, providers: [provideTooltipTriggerState(), provideExitAnimationManager()], exportAs: ["ngpTooltipTrigger"], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NgpTooltipTrigger, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpTooltipTrigger]',
                     exportAs: 'ngpTooltipTrigger',
-                    providers: [provideTooltipTriggerState()],
+                    providers: [provideTooltipTriggerState(), provideExitAnimationManager()],
                     host: {
-                        '[attr.data-open]': 'state.open() ? "" : null',
-                        '[attr.data-disabled]': 'disabled() ? "" : null',
+                        '[attr.data-open]': 'viewRef !== null ? "" : null',
+                        '[attr.data-disabled]': 'state.disabled() ? "" : null',
                         '(mouseenter)': 'show()',
                         '(mouseleave)': 'hide()',
                         '(focus)': 'show()',
@@ -307,13 +357,14 @@ class NgpTooltip {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NgpTooltip, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: NgpTooltip, isStandalone: true, selector: "[ngpTooltip]", host: { attributes: { "role": "tooltip" }, properties: { "style.left.px": "x()", "style.top.px": "y()", "style.--ngp-tooltip-trigger-width.px": "trigger().width()", "style.--ngp-tooltip-transform-origin": "transformOrigin()" } }, exportAs: ["ngpTooltip"], ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: NgpTooltip, isStandalone: true, selector: "[ngpTooltip]", host: { attributes: { "role": "tooltip" }, properties: { "style.left.px": "x()", "style.top.px": "y()", "style.--ngp-tooltip-trigger-width.px": "trigger().width()", "style.--ngp-tooltip-transform-origin": "transformOrigin()" } }, exportAs: ["ngpTooltip"], hostDirectives: [{ directive: i1.NgpExitAnimation }], ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NgpTooltip, decorators: [{
             type: Directive,
             args: [{
                     selector: '[ngpTooltip]',
                     exportAs: 'ngpTooltip',
+                    hostDirectives: [NgpExitAnimation],
                     host: {
                         role: 'tooltip',
                         '[style.left.px]': 'x()',
@@ -328,5 +379,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { NgpTooltip, NgpTooltipTrigger, injectTooltipTriggerState, provideTooltipConfig, provideTooltipTriggerState };
+export { NgpTooltip, NgpTooltipContextToken, NgpTooltipTrigger, injectTooltipContext, injectTooltipTriggerState, provideTooltipConfig, provideTooltipContext, provideTooltipTriggerState };
 //# sourceMappingURL=ng-primitives-tooltip.mjs.map