ng-primitives 0.82.0 → 0.84.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/avatar/avatar/avatar.d.ts +1 -2
- package/fesm2022/ng-primitives-avatar.mjs +3 -6
- package/fesm2022/ng-primitives-avatar.mjs.map +1 -1
- package/fesm2022/ng-primitives-button.mjs +2 -2
- package/fesm2022/ng-primitives-button.mjs.map +1 -1
- package/fesm2022/ng-primitives-checkbox.mjs +2 -2
- package/fesm2022/ng-primitives-checkbox.mjs.map +1 -1
- package/fesm2022/ng-primitives-combobox.mjs +5 -5
- package/fesm2022/ng-primitives-combobox.mjs.map +1 -1
- package/fesm2022/ng-primitives-file-upload.mjs +3 -4
- package/fesm2022/ng-primitives-file-upload.mjs.map +1 -1
- package/fesm2022/ng-primitives-input.mjs +2 -2
- package/fesm2022/ng-primitives-input.mjs.map +1 -1
- package/fesm2022/ng-primitives-interactions.mjs +458 -44
- package/fesm2022/ng-primitives-interactions.mjs.map +1 -1
- package/fesm2022/ng-primitives-internal.mjs +87 -427
- package/fesm2022/ng-primitives-internal.mjs.map +1 -1
- package/fesm2022/ng-primitives-listbox.mjs +4 -4
- package/fesm2022/ng-primitives-listbox.mjs.map +1 -1
- package/fesm2022/ng-primitives-select.mjs +4 -4
- package/fesm2022/ng-primitives-select.mjs.map +1 -1
- package/fesm2022/ng-primitives-slider.mjs +3 -3
- package/fesm2022/ng-primitives-slider.mjs.map +1 -1
- package/fesm2022/ng-primitives-switch.mjs +3 -3
- package/fesm2022/ng-primitives-switch.mjs.map +1 -1
- package/fesm2022/ng-primitives-tabs.mjs +4 -4
- package/fesm2022/ng-primitives-tabs.mjs.map +1 -1
- package/fesm2022/ng-primitives-textarea.mjs +2 -2
- package/fesm2022/ng-primitives-textarea.mjs.map +1 -1
- package/fesm2022/ng-primitives-tooltip.mjs +3 -2
- package/fesm2022/ng-primitives-tooltip.mjs.map +1 -1
- package/interactions/config/interactions-config.d.ts +30 -0
- package/{internal/interactions/focus.d.ts → interactions/focus/focus-interaction.d.ts} +4 -1
- package/{internal/interactions/focus-visible.d.ts → interactions/focus-visible/focus-visible-interaction.d.ts} +4 -1
- package/{internal/interactions/hover.d.ts → interactions/hover/hover-interaction.d.ts} +2 -1
- package/interactions/index.d.ts +11 -1
- package/interactions/interactions/interactions.d.ts +20 -0
- package/{internal/interactions/press.d.ts → interactions/press/press-interaction.d.ts} +4 -1
- package/internal/index.d.ts +0 -1
- package/package.json +44 -44
- package/toast/toast/toast.d.ts +1 -1
- package/interactions/setup-interactions/interaction.d.ts +0 -6
- package/interactions/setup-interactions/setup-interactions.d.ts +0 -13
- package/internal/interactions/index.d.ts +0 -4
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import * as i0 from "@angular/core";
|
|
2
|
-
import * as i1 from "ng-primitives/interactions";
|
|
3
2
|
/**
|
|
4
3
|
* Apply the `ngpAvatar` directive to an element that represents the avatar. This directive is a container for the image and/or fallback.
|
|
5
4
|
*/
|
|
@@ -20,7 +19,7 @@ export declare class NgpAvatar {
|
|
|
20
19
|
*/
|
|
21
20
|
setStatus(status: NgpAvatarStatus): void;
|
|
22
21
|
static ɵfac: i0.ɵɵFactoryDeclaration<NgpAvatar, never>;
|
|
23
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<NgpAvatar, "[ngpAvatar]", ["ngpAvatar"], {}, {}, never, never, true,
|
|
22
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<NgpAvatar, "[ngpAvatar]", ["ngpAvatar"], {}, {}, never, never, true, never>;
|
|
24
23
|
}
|
|
25
24
|
export declare enum NgpAvatarStatus {
|
|
26
25
|
Idle = "idle",
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { signal, Directive, InjectionToken, inject, input, numberAttribute, computed, ElementRef, HostListener } from '@angular/core';
|
|
3
3
|
import { injectDisposables } from 'ng-primitives/utils';
|
|
4
|
-
import * as i1 from 'ng-primitives/interactions';
|
|
5
|
-
import { NgpHover, NgpFocusVisible, NgpPress } from 'ng-primitives/interactions';
|
|
6
4
|
import { createStateToken, createStateProvider, createStateInjector, createState } from 'ng-primitives/state';
|
|
7
|
-
import * as i1
|
|
5
|
+
import * as i1 from 'ng-primitives/a11y';
|
|
8
6
|
import { injectVisuallyHiddenState, NgpVisuallyHidden } from 'ng-primitives/a11y';
|
|
9
7
|
|
|
10
8
|
/**
|
|
@@ -48,7 +46,7 @@ class NgpAvatar {
|
|
|
48
46
|
this.status.set(status);
|
|
49
47
|
}
|
|
50
48
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpAvatar, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
51
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: NgpAvatar, isStandalone: true, selector: "[ngpAvatar]", host: { properties: { "attr.data-status": "status()" } }, providers: [provideAvatarState()], exportAs: ["ngpAvatar"],
|
|
49
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: NgpAvatar, isStandalone: true, selector: "[ngpAvatar]", host: { properties: { "attr.data-status": "status()" } }, providers: [provideAvatarState()], exportAs: ["ngpAvatar"], ngImport: i0 }); }
|
|
52
50
|
}
|
|
53
51
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpAvatar, decorators: [{
|
|
54
52
|
type: Directive,
|
|
@@ -59,7 +57,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
|
|
|
59
57
|
host: {
|
|
60
58
|
'[attr.data-status]': 'status()',
|
|
61
59
|
},
|
|
62
|
-
hostDirectives: [NgpHover, NgpFocusVisible, NgpPress],
|
|
63
60
|
}]
|
|
64
61
|
}] });
|
|
65
62
|
var NgpAvatarStatus;
|
|
@@ -191,7 +188,7 @@ class NgpAvatarImage {
|
|
|
191
188
|
this.visuallyHidden().setVisibility(state === NgpAvatarStatus.Loaded);
|
|
192
189
|
}
|
|
193
190
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpAvatarImage, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
194
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: NgpAvatarImage, isStandalone: true, selector: "img[ngpAvatarImage]", host: { listeners: { "load": "onLoad()", "error": "onError()" } }, exportAs: ["ngpAvatarImage"], hostDirectives: [{ directive: i1
|
|
191
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: NgpAvatarImage, isStandalone: true, selector: "img[ngpAvatarImage]", host: { listeners: { "load": "onLoad()", "error": "onError()" } }, exportAs: ["ngpAvatarImage"], hostDirectives: [{ directive: i1.NgpVisuallyHidden }], ngImport: i0 }); }
|
|
195
192
|
}
|
|
196
193
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpAvatarImage, decorators: [{
|
|
197
194
|
type: Directive,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-primitives-avatar.mjs","sources":["../../../../packages/ng-primitives/avatar/src/avatar/avatar-state.ts","../../../../packages/ng-primitives/avatar/src/avatar/avatar.ts","../../../../packages/ng-primitives/avatar/src/config/avatar-config.ts","../../../../packages/ng-primitives/avatar/src/avatar-fallback/avatar-fallback.ts","../../../../packages/ng-primitives/avatar/src/avatar-image/avatar-image.ts","../../../../packages/ng-primitives/avatar/src/ng-primitives-avatar.ts"],"sourcesContent":["import {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpAvatar } from './avatar';\n\n/**\n * The state token for the Avatar primitive.\n */\nexport const NgpAvatarStateToken = createStateToken<NgpAvatar>('Avatar');\n\n/**\n * Provides the Avatar state.\n */\nexport const provideAvatarState = createStateProvider(NgpAvatarStateToken);\n\n/**\n * Injects the Avatar state.\n */\nexport const injectAvatarState = createStateInjector<NgpAvatar>(NgpAvatarStateToken);\n\n/**\n * The Avatar state registration function.\n */\nexport const avatarState = createState(NgpAvatarStateToken);\n","import { Directive, signal } from '@angular/core';\nimport { NgpFocusVisible, NgpHover, NgpPress } from 'ng-primitives/interactions';\nimport { avatarState, provideAvatarState } from './avatar-state';\n\n/**\n * Apply the `ngpAvatar` directive to an element that represents the avatar. This directive is a container for the image and/or fallback.\n */\n@Directive({\n selector: '[ngpAvatar]',\n exportAs: 'ngpAvatar',\n providers: [provideAvatarState()],\n host: {\n '[attr.data-status]': 'status()',\n },\n hostDirectives: [NgpHover, NgpFocusVisible, NgpPress],\n})\nexport class NgpAvatar {\n /**\n * Store the current status of the avatar.\n * @internal\n */\n readonly status = signal(NgpAvatarStatus.Idle);\n\n /**\n * The avatar state.\n */\n protected readonly state = avatarState<NgpAvatar>(this);\n\n /**\n * Set the avatar status.\n * @param status The status to set.\n * @internal\n */\n setStatus(status: NgpAvatarStatus): void {\n this.status.set(status);\n }\n}\n\nexport enum NgpAvatarStatus {\n Idle = 'idle',\n Loading = 'loading',\n Loaded = 'loaded',\n Error = 'error',\n}\n","import { InjectionToken, Provider, inject } from '@angular/core';\n\nexport interface NgpAvatarConfig {\n /**\n * Define a delay before the fallback is shown. This is useful to only show the fallback for those with slower connections.\n * @default 0\n */\n delay: number;\n}\n\nexport const defaultAvatarConfig: NgpAvatarConfig = {\n delay: 0,\n};\n\nexport const NgpAvatarConfigToken = new InjectionToken<NgpAvatarConfig>('NgpAvatarConfigToken');\n\n/**\n * Provide the avatar config\n * @param config The avatar config\n * @returns The provider\n */\nexport function provideAvatarConfig(config: Partial<NgpAvatarConfig>): Provider[] {\n return [\n {\n provide: NgpAvatarConfigToken,\n useValue: { ...defaultAvatarConfig, ...config },\n },\n ];\n}\n\n/**\n * Inject the avatar config\n * @returns The global avatar config\n */\nexport function injectAvatarConfig(): NgpAvatarConfig {\n return inject(NgpAvatarConfigToken, { optional: true }) ?? defaultAvatarConfig;\n}\n","import { NumberInput } from '@angular/cdk/coercion';\nimport { computed, Directive, input, numberAttribute, OnInit, signal } from '@angular/core';\nimport { injectDisposables } from 'ng-primitives/utils';\nimport { NgpAvatarStatus } from '../avatar/avatar';\nimport { injectAvatarState } from '../avatar/avatar-state';\nimport { injectAvatarConfig } from '../config/avatar-config';\n\n/**\n * Apply the `ngpAvatarFallback` directive to an element that represents the user in the absence of an image. This is typically the user's initials.\n */\n@Directive({\n selector: '[ngpAvatarFallback]',\n exportAs: 'ngpAvatarFallback',\n host: {\n '[style.display]': 'visible() ? null : \"none\"',\n },\n})\nexport class NgpAvatarFallback implements OnInit {\n /**\n * Access the avatar\n */\n private readonly avatar = injectAvatarState();\n\n /**\n * Access the global configuration.\n */\n private readonly config = injectAvatarConfig();\n\n /**\n * Access the disposable utilities.\n */\n private readonly disposables = injectDisposables();\n\n /**\n * Define a delay before the fallback is shown. This is useful to only show the fallback for those with slower connections.\n * @default 0\n */\n readonly delay = input<number, NumberInput>(this.config.delay, {\n alias: 'ngpAvatarFallbackDelay',\n transform: numberAttribute,\n });\n\n /**\n * Determine if this element should be hidden.\n * @returns True if the element should be visible\n */\n protected readonly visible = computed(\n () =>\n // we need to check if the element can render and if the avatar is not in a loaded state\n this.delayElapsed() && this.avatar().status() !== NgpAvatarStatus.Loaded,\n );\n\n /**\n * Determine the delay has elapsed, and we can show the fallback.\n */\n private delayElapsed = signal(false);\n\n ngOnInit(): void {\n this.disposables.setTimeout(() => this.delayElapsed.set(true), this.delay());\n }\n}\n","import { Directive, ElementRef, HostListener, inject, OnInit } from '@angular/core';\nimport { injectVisuallyHiddenState, NgpVisuallyHidden } from 'ng-primitives/a11y';\nimport { NgpAvatarStatus } from '../avatar/avatar';\nimport { injectAvatarState } from '../avatar/avatar-state';\n\n/**\n * Apply the `ngpAvatarImage` directive to an element that represents the avatar image. This would typically be an `img` element or a `div` with a background image.\n */\n@Directive({\n selector: 'img[ngpAvatarImage]',\n exportAs: 'ngpAvatarImage',\n hostDirectives: [NgpVisuallyHidden],\n})\nexport class NgpAvatarImage implements OnInit {\n /**\n * Control the visibility of the image.\n */\n protected readonly visuallyHidden = injectVisuallyHiddenState();\n\n /**\n * Access the avatar\n */\n private readonly avatar = injectAvatarState();\n\n /**\n * Access the image element ref.\n */\n private readonly elementRef = inject<ElementRef<HTMLImageElement>>(ElementRef);\n\n ngOnInit(): void {\n // mark the avatar as loading\n this.setState(NgpAvatarStatus.Loading);\n\n // if there is no src, we can report this as an error\n if (!this.elementRef.nativeElement.src) {\n this.setState(NgpAvatarStatus.Error);\n }\n\n // if the image has already loaded, we can report this to the avatar\n if (this.elementRef.nativeElement.complete) {\n this.setState(NgpAvatarStatus.Loaded);\n }\n }\n\n @HostListener('load')\n protected onLoad(): void {\n this.setState(NgpAvatarStatus.Loaded);\n }\n\n @HostListener('error')\n protected onError(): void {\n this.setState(NgpAvatarStatus.Error);\n }\n\n private setState(state: NgpAvatarStatus) {\n this.avatar().setStatus(state);\n\n // if the state is loaded then we should make the image visible\n this.visuallyHidden().setVisibility(state === NgpAvatarStatus.Loaded);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":["i1"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ng-primitives-avatar.mjs","sources":["../../../../packages/ng-primitives/avatar/src/avatar/avatar-state.ts","../../../../packages/ng-primitives/avatar/src/avatar/avatar.ts","../../../../packages/ng-primitives/avatar/src/config/avatar-config.ts","../../../../packages/ng-primitives/avatar/src/avatar-fallback/avatar-fallback.ts","../../../../packages/ng-primitives/avatar/src/avatar-image/avatar-image.ts","../../../../packages/ng-primitives/avatar/src/ng-primitives-avatar.ts"],"sourcesContent":["import {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpAvatar } from './avatar';\n\n/**\n * The state token for the Avatar primitive.\n */\nexport const NgpAvatarStateToken = createStateToken<NgpAvatar>('Avatar');\n\n/**\n * Provides the Avatar state.\n */\nexport const provideAvatarState = createStateProvider(NgpAvatarStateToken);\n\n/**\n * Injects the Avatar state.\n */\nexport const injectAvatarState = createStateInjector<NgpAvatar>(NgpAvatarStateToken);\n\n/**\n * The Avatar state registration function.\n */\nexport const avatarState = createState(NgpAvatarStateToken);\n","import { Directive, signal } from '@angular/core';\nimport { avatarState, provideAvatarState } from './avatar-state';\n\n/**\n * Apply the `ngpAvatar` directive to an element that represents the avatar. This directive is a container for the image and/or fallback.\n */\n@Directive({\n selector: '[ngpAvatar]',\n exportAs: 'ngpAvatar',\n providers: [provideAvatarState()],\n host: {\n '[attr.data-status]': 'status()',\n },\n})\nexport class NgpAvatar {\n /**\n * Store the current status of the avatar.\n * @internal\n */\n readonly status = signal(NgpAvatarStatus.Idle);\n\n /**\n * The avatar state.\n */\n protected readonly state = avatarState<NgpAvatar>(this);\n\n /**\n * Set the avatar status.\n * @param status The status to set.\n * @internal\n */\n setStatus(status: NgpAvatarStatus): void {\n this.status.set(status);\n }\n}\n\nexport enum NgpAvatarStatus {\n Idle = 'idle',\n Loading = 'loading',\n Loaded = 'loaded',\n Error = 'error',\n}\n","import { InjectionToken, Provider, inject } from '@angular/core';\n\nexport interface NgpAvatarConfig {\n /**\n * Define a delay before the fallback is shown. This is useful to only show the fallback for those with slower connections.\n * @default 0\n */\n delay: number;\n}\n\nexport const defaultAvatarConfig: NgpAvatarConfig = {\n delay: 0,\n};\n\nexport const NgpAvatarConfigToken = new InjectionToken<NgpAvatarConfig>('NgpAvatarConfigToken');\n\n/**\n * Provide the avatar config\n * @param config The avatar config\n * @returns The provider\n */\nexport function provideAvatarConfig(config: Partial<NgpAvatarConfig>): Provider[] {\n return [\n {\n provide: NgpAvatarConfigToken,\n useValue: { ...defaultAvatarConfig, ...config },\n },\n ];\n}\n\n/**\n * Inject the avatar config\n * @returns The global avatar config\n */\nexport function injectAvatarConfig(): NgpAvatarConfig {\n return inject(NgpAvatarConfigToken, { optional: true }) ?? defaultAvatarConfig;\n}\n","import { NumberInput } from '@angular/cdk/coercion';\nimport { computed, Directive, input, numberAttribute, OnInit, signal } from '@angular/core';\nimport { injectDisposables } from 'ng-primitives/utils';\nimport { NgpAvatarStatus } from '../avatar/avatar';\nimport { injectAvatarState } from '../avatar/avatar-state';\nimport { injectAvatarConfig } from '../config/avatar-config';\n\n/**\n * Apply the `ngpAvatarFallback` directive to an element that represents the user in the absence of an image. This is typically the user's initials.\n */\n@Directive({\n selector: '[ngpAvatarFallback]',\n exportAs: 'ngpAvatarFallback',\n host: {\n '[style.display]': 'visible() ? null : \"none\"',\n },\n})\nexport class NgpAvatarFallback implements OnInit {\n /**\n * Access the avatar\n */\n private readonly avatar = injectAvatarState();\n\n /**\n * Access the global configuration.\n */\n private readonly config = injectAvatarConfig();\n\n /**\n * Access the disposable utilities.\n */\n private readonly disposables = injectDisposables();\n\n /**\n * Define a delay before the fallback is shown. This is useful to only show the fallback for those with slower connections.\n * @default 0\n */\n readonly delay = input<number, NumberInput>(this.config.delay, {\n alias: 'ngpAvatarFallbackDelay',\n transform: numberAttribute,\n });\n\n /**\n * Determine if this element should be hidden.\n * @returns True if the element should be visible\n */\n protected readonly visible = computed(\n () =>\n // we need to check if the element can render and if the avatar is not in a loaded state\n this.delayElapsed() && this.avatar().status() !== NgpAvatarStatus.Loaded,\n );\n\n /**\n * Determine the delay has elapsed, and we can show the fallback.\n */\n private delayElapsed = signal(false);\n\n ngOnInit(): void {\n this.disposables.setTimeout(() => this.delayElapsed.set(true), this.delay());\n }\n}\n","import { Directive, ElementRef, HostListener, inject, OnInit } from '@angular/core';\nimport { injectVisuallyHiddenState, NgpVisuallyHidden } from 'ng-primitives/a11y';\nimport { NgpAvatarStatus } from '../avatar/avatar';\nimport { injectAvatarState } from '../avatar/avatar-state';\n\n/**\n * Apply the `ngpAvatarImage` directive to an element that represents the avatar image. This would typically be an `img` element or a `div` with a background image.\n */\n@Directive({\n selector: 'img[ngpAvatarImage]',\n exportAs: 'ngpAvatarImage',\n hostDirectives: [NgpVisuallyHidden],\n})\nexport class NgpAvatarImage implements OnInit {\n /**\n * Control the visibility of the image.\n */\n protected readonly visuallyHidden = injectVisuallyHiddenState();\n\n /**\n * Access the avatar\n */\n private readonly avatar = injectAvatarState();\n\n /**\n * Access the image element ref.\n */\n private readonly elementRef = inject<ElementRef<HTMLImageElement>>(ElementRef);\n\n ngOnInit(): void {\n // mark the avatar as loading\n this.setState(NgpAvatarStatus.Loading);\n\n // if there is no src, we can report this as an error\n if (!this.elementRef.nativeElement.src) {\n this.setState(NgpAvatarStatus.Error);\n }\n\n // if the image has already loaded, we can report this to the avatar\n if (this.elementRef.nativeElement.complete) {\n this.setState(NgpAvatarStatus.Loaded);\n }\n }\n\n @HostListener('load')\n protected onLoad(): void {\n this.setState(NgpAvatarStatus.Loaded);\n }\n\n @HostListener('error')\n protected onError(): void {\n this.setState(NgpAvatarStatus.Error);\n }\n\n private setState(state: NgpAvatarStatus) {\n this.avatar().setStatus(state);\n\n // if the state is loaded then we should make the image visible\n this.visuallyHidden().setVisibility(state === NgpAvatarStatus.Loaded);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { input, booleanAttribute, Directive } from '@angular/core';
|
|
3
3
|
import { createStateToken, createStateProvider, createStateInjector, createState } from 'ng-primitives/state';
|
|
4
|
-
import {
|
|
4
|
+
import { ngpInteractions } from 'ng-primitives/interactions';
|
|
5
5
|
import { injectElementRef } from 'ng-primitives/internal';
|
|
6
6
|
import { booleanAttributeBinding } from 'ng-primitives/utils';
|
|
7
7
|
|
|
@@ -30,7 +30,7 @@ const buttonState = createState(NgpButtonStateToken);
|
|
|
30
30
|
function setupButton({ disabled }) {
|
|
31
31
|
const elementRef = injectElementRef();
|
|
32
32
|
const isButton = elementRef.nativeElement.tagName.toLowerCase() === 'button';
|
|
33
|
-
|
|
33
|
+
ngpInteractions({ hover: true, press: true, focusVisible: true, disabled });
|
|
34
34
|
// add the `data-disabled` attribute to the element
|
|
35
35
|
booleanAttributeBinding(elementRef.nativeElement, 'data-disabled', disabled);
|
|
36
36
|
// add the `disabled` attribute to the element if it is a button
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-primitives-button.mjs","sources":["../../../../packages/ng-primitives/button/src/button/button-state.ts","../../../../packages/ng-primitives/button/src/button/setup-button.ts","../../../../packages/ng-primitives/button/src/button/button.ts","../../../../packages/ng-primitives/button/src/ng-primitives-button.ts"],"sourcesContent":["import {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpButton } from './button';\n\n/**\n * The state token for the Button primitive.\n */\nexport const NgpButtonStateToken = createStateToken<NgpButton>('Button');\n\n/**\n * Provides the Button state.\n */\nexport const provideButtonState = createStateProvider(NgpButtonStateToken);\n\n/**\n * Injects the Button state.\n */\nexport const injectButtonState = createStateInjector<NgpButton>(NgpButtonStateToken);\n\n/**\n * The Button state registration function.\n */\nexport const buttonState = createState(NgpButtonStateToken);\n","import { Signal } from '@angular/core';\nimport {
|
|
1
|
+
{"version":3,"file":"ng-primitives-button.mjs","sources":["../../../../packages/ng-primitives/button/src/button/button-state.ts","../../../../packages/ng-primitives/button/src/button/setup-button.ts","../../../../packages/ng-primitives/button/src/button/button.ts","../../../../packages/ng-primitives/button/src/ng-primitives-button.ts"],"sourcesContent":["import {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpButton } from './button';\n\n/**\n * The state token for the Button primitive.\n */\nexport const NgpButtonStateToken = createStateToken<NgpButton>('Button');\n\n/**\n * Provides the Button state.\n */\nexport const provideButtonState = createStateProvider(NgpButtonStateToken);\n\n/**\n * Injects the Button state.\n */\nexport const injectButtonState = createStateInjector<NgpButton>(NgpButtonStateToken);\n\n/**\n * The Button state registration function.\n */\nexport const buttonState = createState(NgpButtonStateToken);\n","import { Signal } from '@angular/core';\nimport { ngpInteractions } from 'ng-primitives/interactions';\nimport { injectElementRef } from 'ng-primitives/internal';\nimport { booleanAttributeBinding } from 'ng-primitives/utils';\n\n/** @internal */\nexport interface NgpButtonOptions {\n /**\n * Whether the button is disabled.\n * @default false\n */\n disabled?: Signal<boolean>;\n}\n\n/**\n * @internal\n * Setup the button interactions and attributes.\n * @param options - The options for the button.\n */\nexport function setupButton({ disabled }: NgpButtonOptions): void {\n const elementRef = injectElementRef();\n const isButton = elementRef.nativeElement.tagName.toLowerCase() === 'button';\n\n ngpInteractions({ hover: true, press: true, focusVisible: true, disabled });\n\n // add the `data-disabled` attribute to the element\n booleanAttributeBinding(elementRef.nativeElement, 'data-disabled', disabled);\n\n // add the `disabled` attribute to the element if it is a button\n if (isButton) {\n booleanAttributeBinding(elementRef.nativeElement, 'disabled', disabled);\n }\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { booleanAttribute, Directive, input } from '@angular/core';\nimport { buttonState, provideButtonState } from './button-state';\nimport { setupButton } from './setup-button';\n\n@Directive({\n selector: '[ngpButton]',\n exportAs: 'ngpButton',\n providers: [provideButtonState({ inherit: false })],\n})\nexport class NgpButton {\n /**\n * Whether the button is disabled.\n */\n readonly disabled = input<boolean, BooleanInput>(false, {\n transform: booleanAttribute,\n });\n\n /**\n * The button state.\n */\n protected readonly state = buttonState<NgpButton>(this);\n\n constructor() {\n setupButton({ disabled: this.state.disabled });\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;AAQA;;AAEG;AACI,MAAM,mBAAmB,GAAG,gBAAgB,CAAY,QAAQ,CAAC;AAExE;;AAEG;MACU,kBAAkB,GAAG,mBAAmB,CAAC,mBAAmB;AAEzE;;AAEG;MACU,iBAAiB,GAAG,mBAAmB,CAAY,mBAAmB;AAEnF;;AAEG;AACI,MAAM,WAAW,GAAG,WAAW,CAAC,mBAAmB,CAAC;;ACZ3D;;;;AAIG;AACG,SAAU,WAAW,CAAC,EAAE,QAAQ,EAAoB,EAAA;AACxD,IAAA,MAAM,UAAU,GAAG,gBAAgB,EAAE;AACrC,IAAA,MAAM,QAAQ,GAAG,UAAU,CAAC,aAAa,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,QAAQ;AAE5E,IAAA,eAAe,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;;IAG3E,uBAAuB,CAAC,UAAU,CAAC,aAAa,EAAE,eAAe,EAAE,QAAQ,CAAC;;IAG5E,IAAI,QAAQ,EAAE;QACZ,uBAAuB,CAAC,UAAU,CAAC,aAAa,EAAE,UAAU,EAAE,QAAQ,CAAC;IACzE;AACF;;MCtBa,SAAS,CAAA;AAapB,IAAA,WAAA,GAAA;AAZA;;AAEG;AACM,QAAA,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAwB,KAAK,EAAE;AACtD,YAAA,SAAS,EAAE,gBAAgB;AAC5B,SAAA,CAAC;AAEF;;AAEG;AACgB,QAAA,IAAA,CAAA,KAAK,GAAG,WAAW,CAAY,IAAI,CAAC;QAGrD,WAAW,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;IAChD;+GAfW,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;mGAAT,SAAS,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,SAAA,EAFT,CAAC,kBAAkB,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC,EAAA,QAAA,EAAA,CAAA,WAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAExC,SAAS,EAAA,UAAA,EAAA,CAAA;kBALrB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,aAAa;AACvB,oBAAA,QAAQ,EAAE,WAAW;oBACrB,SAAS,EAAE,CAAC,kBAAkB,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;AACpD,iBAAA;;;ACTD;;AAEG;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { input, booleanAttribute, output, HostListener, Directive } from '@angular/core';
|
|
3
3
|
import { setupFormControl } from 'ng-primitives/form-field';
|
|
4
|
-
import {
|
|
4
|
+
import { ngpInteractions } from 'ng-primitives/interactions';
|
|
5
5
|
import { uniqueId } from 'ng-primitives/utils';
|
|
6
6
|
import { createStateToken, createStateProvider, createStateInjector, createState } from 'ng-primitives/state';
|
|
7
7
|
|
|
@@ -77,7 +77,7 @@ class NgpCheckbox {
|
|
|
77
77
|
*/
|
|
78
78
|
this.state = checkboxState(this);
|
|
79
79
|
setupFormControl({ id: this.state.id, disabled: this.state.disabled });
|
|
80
|
-
|
|
80
|
+
ngpInteractions({
|
|
81
81
|
hover: true,
|
|
82
82
|
press: true,
|
|
83
83
|
focusVisible: true,
|
|
@@ -1 +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 {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpCheckbox } from './checkbox';\n\n/**\n * The state token for the Checkbox primitive.\n */\nexport const NgpCheckboxStateToken = createStateToken<NgpCheckbox>('Checkbox');\n\n/**\n * Provides the Checkbox state.\n */\nexport const provideCheckboxState = createStateProvider(NgpCheckboxStateToken);\n\n/**\n * Injects the Checkbox state.\n */\nexport const injectCheckboxState = createStateInjector<NgpCheckbox>(NgpCheckboxStateToken);\n\n/**\n * The Checkbox state registration function.\n */\nexport const checkboxState = createState(NgpCheckboxStateToken);\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { Directive, HostListener, booleanAttribute, input, output } from '@angular/core';\nimport { setupFormControl } from 'ng-primitives/form-field';\nimport {
|
|
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 {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpCheckbox } from './checkbox';\n\n/**\n * The state token for the Checkbox primitive.\n */\nexport const NgpCheckboxStateToken = createStateToken<NgpCheckbox>('Checkbox');\n\n/**\n * Provides the Checkbox state.\n */\nexport const provideCheckboxState = createStateProvider(NgpCheckboxStateToken);\n\n/**\n * Injects the Checkbox state.\n */\nexport const injectCheckboxState = createStateInjector<NgpCheckbox>(NgpCheckboxStateToken);\n\n/**\n * The Checkbox state registration function.\n */\nexport const checkboxState = createState(NgpCheckboxStateToken);\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { Directive, HostListener, booleanAttribute, input, output } from '@angular/core';\nimport { setupFormControl } from 'ng-primitives/form-field';\nimport { ngpInteractions } from 'ng-primitives/interactions';\nimport { uniqueId } from 'ng-primitives/utils';\nimport { checkboxState, 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()],\n host: {\n role: 'checkbox',\n '[attr.aria-checked]': 'state.indeterminate() ? \"mixed\" : state.checked()',\n '[attr.data-checked]': 'state.checked() ? \"\" : null',\n '[attr.data-indeterminate]': 'state.indeterminate() ? \"\" : null',\n '[attr.aria-disabled]': 'state.disabled()',\n '[tabindex]': 'state.disabled() ? -1 : 0',\n },\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 = checkboxState<NgpCheckbox>(this);\n\n constructor() {\n setupFormControl({ id: this.state.id, disabled: this.state.disabled });\n ngpInteractions({\n hover: true,\n press: true,\n focusVisible: true,\n disabled: this.state.disabled,\n });\n }\n\n @HostListener('keydown.enter', ['$event'])\n protected onEnter(event: KeyboardEvent): void {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n event.preventDefault();\n }\n\n @HostListener('click', ['$event'])\n @HostListener('keydown.space', ['$event'])\n toggle(event?: Event): void {\n if (this.state.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 checked = this.state.indeterminate() ? true : !this.state.checked();\n this.state.checked.set(checked);\n this.checkedChange.emit(checked);\n\n // if the checkbox was indeterminate, it isn't anymore\n if (this.state.indeterminate()) {\n this.state.indeterminate.set(false);\n this.indeterminateChange.emit(false);\n }\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { input, computed, HostListener, Directive, booleanAttribute, inject, ViewContainerRef, TemplateRef, Injector, signal, InjectionToken, output, afterRenderEffect } from '@angular/core';
|
|
3
|
-
import {
|
|
3
|
+
import { ngpInteractions } from 'ng-primitives/interactions';
|
|
4
4
|
import { injectElementRef, observeResize } from 'ng-primitives/internal';
|
|
5
5
|
import { uniqueId } from 'ng-primitives/utils';
|
|
6
6
|
import { createStateToken, createStateProvider, createStateInjector, createState } from 'ng-primitives/state';
|
|
@@ -38,7 +38,7 @@ class NgpComboboxButton {
|
|
|
38
38
|
this.id = input(uniqueId('ngp-combobox-button'));
|
|
39
39
|
/** The id of the dropdown. */
|
|
40
40
|
this.dropdownId = computed(() => this.state().dropdown()?.id());
|
|
41
|
-
|
|
41
|
+
ngpInteractions({
|
|
42
42
|
hover: true,
|
|
43
43
|
press: true,
|
|
44
44
|
disabled: this.state().disabled,
|
|
@@ -137,7 +137,7 @@ class NgpComboboxInput {
|
|
|
137
137
|
* @internal
|
|
138
138
|
*/
|
|
139
139
|
this.controlStatus = setupFormControl({ id: this.id, disabled: this.state().disabled });
|
|
140
|
-
|
|
140
|
+
ngpInteractions({
|
|
141
141
|
focus: true,
|
|
142
142
|
hover: true,
|
|
143
143
|
press: true,
|
|
@@ -343,7 +343,7 @@ class NgpComboboxOption {
|
|
|
343
343
|
return this.state().compareWith()(value, stateValue);
|
|
344
344
|
});
|
|
345
345
|
this.state().registerOption(this);
|
|
346
|
-
|
|
346
|
+
ngpInteractions({
|
|
347
347
|
hover: true,
|
|
348
348
|
press: true,
|
|
349
349
|
disabled: this.disabled,
|
|
@@ -606,7 +606,7 @@ class NgpCombobox {
|
|
|
606
606
|
this.controlStatus = computed(() => this.input()?.controlStatus());
|
|
607
607
|
/** The state of the combobox. */
|
|
608
608
|
this.state = comboboxState(this);
|
|
609
|
-
|
|
609
|
+
ngpInteractions({
|
|
610
610
|
focus: true,
|
|
611
611
|
focusWithin: true,
|
|
612
612
|
hover: true,
|