ng-primitives 0.49.0 → 0.51.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/fesm2022/ng-primitives-accordion.mjs +8 -6
- package/fesm2022/ng-primitives-accordion.mjs.map +1 -1
- package/fesm2022/ng-primitives-checkbox.mjs +3 -2
- package/fesm2022/ng-primitives-checkbox.mjs.map +1 -1
- package/fesm2022/ng-primitives-combobox.mjs +15 -1
- package/fesm2022/ng-primitives-combobox.mjs.map +1 -1
- package/fesm2022/ng-primitives-internal.mjs +21 -37
- package/fesm2022/ng-primitives-internal.mjs.map +1 -1
- package/fesm2022/ng-primitives-listbox.mjs +9 -6
- package/fesm2022/ng-primitives-listbox.mjs.map +1 -1
- package/fesm2022/ng-primitives-radio.mjs +10 -5
- package/fesm2022/ng-primitives-radio.mjs.map +1 -1
- package/fesm2022/ng-primitives-slider.mjs +30 -30
- package/fesm2022/ng-primitives-slider.mjs.map +1 -1
- package/fesm2022/ng-primitives-state.mjs +53 -7
- package/fesm2022/ng-primitives-state.mjs.map +1 -1
- package/fesm2022/ng-primitives-switch.mjs +3 -2
- package/fesm2022/ng-primitives-switch.mjs.map +1 -1
- package/fesm2022/ng-primitives-toggle-group.mjs +19 -7
- package/fesm2022/ng-primitives-toggle-group.mjs.map +1 -1
- package/fesm2022/ng-primitives-toggle.mjs +3 -2
- package/fesm2022/ng-primitives-toggle.mjs.map +1 -1
- package/internal/interactions/focus.d.ts +2 -1
- package/internal/interactions/interactions.d.ts +2 -1
- package/package.json +1 -1
- package/radio/radio-item/radio-item.d.ts +5 -3
- package/schematics/ng-generate/schema.d.ts +2 -1
- package/schematics/ng-generate/schema.json +1 -0
- package/schematics/ng-generate/templates/combobox/combobox.__fileSuffix@dasherize__.ts.template +5 -0
- package/schematics/ng-generate/templates/select/select.__fileSuffix@dasherize__.ts.template +47 -0
- package/slider/slider-thumb/slider-thumb.d.ts +1 -1
- package/toggle-group/config/toggle-group-config.d.ts +5 -0
- package/toggle-group/toggle-group/toggle-group.d.ts +6 -1
|
@@ -57,7 +57,7 @@ class NgpSliderThumb {
|
|
|
57
57
|
/**
|
|
58
58
|
* Access the slider state.
|
|
59
59
|
*/
|
|
60
|
-
this.
|
|
60
|
+
this.state = injectSliderState();
|
|
61
61
|
/**
|
|
62
62
|
* Store the dragging state.
|
|
63
63
|
*/
|
|
@@ -66,37 +66,37 @@ class NgpSliderThumb {
|
|
|
66
66
|
hover: true,
|
|
67
67
|
focusVisible: true,
|
|
68
68
|
press: true,
|
|
69
|
-
disabled: this.
|
|
69
|
+
disabled: this.state().disabled,
|
|
70
70
|
});
|
|
71
71
|
}
|
|
72
72
|
handlePointerDown(event) {
|
|
73
73
|
event.preventDefault();
|
|
74
|
-
if (this.
|
|
74
|
+
if (this.state().disabled()) {
|
|
75
75
|
return;
|
|
76
76
|
}
|
|
77
77
|
this.dragging = true;
|
|
78
78
|
}
|
|
79
79
|
handlePointerUp() {
|
|
80
|
-
if (this.
|
|
80
|
+
if (this.state().disabled()) {
|
|
81
81
|
return;
|
|
82
82
|
}
|
|
83
83
|
this.dragging = false;
|
|
84
84
|
}
|
|
85
85
|
handlePointerMove(event) {
|
|
86
|
-
if (this.
|
|
86
|
+
if (this.state().disabled() || !this.dragging) {
|
|
87
87
|
return;
|
|
88
88
|
}
|
|
89
|
-
const rect = this.
|
|
89
|
+
const rect = this.state().track()?.element.nativeElement.getBoundingClientRect();
|
|
90
90
|
if (!rect) {
|
|
91
91
|
return;
|
|
92
92
|
}
|
|
93
|
-
const percentage = this.
|
|
93
|
+
const percentage = this.state().orientation() === 'horizontal'
|
|
94
94
|
? (event.clientX - rect.left) / rect.width
|
|
95
95
|
: 1 - (event.clientY - rect.top) / rect.height;
|
|
96
|
-
|
|
97
|
-
(this.
|
|
98
|
-
|
|
99
|
-
this.
|
|
96
|
+
const value = this.state().min() +
|
|
97
|
+
(this.state().max() - this.state().min()) * Math.max(0, Math.min(1, percentage));
|
|
98
|
+
this.state().value.set(value);
|
|
99
|
+
this.state().valueChange.emit(value);
|
|
100
100
|
}
|
|
101
101
|
/**
|
|
102
102
|
* Handle keyboard events.
|
|
@@ -104,34 +104,34 @@ class NgpSliderThumb {
|
|
|
104
104
|
*/
|
|
105
105
|
handleKeydown(event) {
|
|
106
106
|
const multiplier = event.shiftKey ? 10 : 1;
|
|
107
|
-
const value = this.
|
|
107
|
+
const value = this.state().value();
|
|
108
108
|
switch (event.key) {
|
|
109
109
|
case 'ArrowLeft':
|
|
110
110
|
case 'ArrowDown':
|
|
111
|
-
this.
|
|
112
|
-
this.
|
|
111
|
+
this.state().value.set(Math.max(value - this.state().step() * multiplier, this.state().min()));
|
|
112
|
+
this.state().valueChange.emit(this.state().value());
|
|
113
113
|
event.preventDefault();
|
|
114
114
|
break;
|
|
115
115
|
case 'ArrowRight':
|
|
116
116
|
case 'ArrowUp':
|
|
117
|
-
this.
|
|
118
|
-
this.
|
|
117
|
+
this.state().value.set(Math.min(value + this.state().step() * multiplier, this.state().max()));
|
|
118
|
+
this.state().valueChange.emit(this.state().value());
|
|
119
119
|
event.preventDefault();
|
|
120
120
|
break;
|
|
121
121
|
case 'Home':
|
|
122
|
-
this.
|
|
123
|
-
this.
|
|
122
|
+
this.state().value.set(this.state().min());
|
|
123
|
+
this.state().valueChange.emit(this.state().value());
|
|
124
124
|
event.preventDefault();
|
|
125
125
|
break;
|
|
126
126
|
case 'End':
|
|
127
|
-
this.
|
|
128
|
-
this.
|
|
127
|
+
this.state().value.set(this.state().max());
|
|
128
|
+
this.state().valueChange.emit(this.state().value());
|
|
129
129
|
event.preventDefault();
|
|
130
130
|
break;
|
|
131
131
|
}
|
|
132
132
|
}
|
|
133
133
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpSliderThumb, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
134
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: NgpSliderThumb, isStandalone: true, selector: "[ngpSliderThumb]", host: { attributes: { "role": "slider" }, listeners: { "pointerdown": "handlePointerDown($event)", "document:pointerup": "handlePointerUp()", "document:pointermove": "handlePointerMove($event)", "keydown": "handleKeydown($event)" }, properties: { "attr.aria-valuemin": "
|
|
134
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.11", type: NgpSliderThumb, isStandalone: true, selector: "[ngpSliderThumb]", host: { attributes: { "role": "slider" }, listeners: { "pointerdown": "handlePointerDown($event)", "document:pointerup": "handlePointerUp()", "document:pointermove": "handlePointerMove($event)", "keydown": "handleKeydown($event)" }, properties: { "attr.aria-valuemin": "state().min()", "attr.aria-valuemax": "state().max()", "attr.aria-valuenow": "state().value()", "attr.aria-orientation": "state().orientation()", "tabindex": "state().disabled() ? -1 : 0", "attr.data-orientation": "state().orientation()", "attr.data-disabled": "state().disabled() ? \"\" : null", "style.inset-inline-start.%": "state().orientation() === \"horizontal\" ? state().percentage() : undefined", "style.inset-block-start.%": "state().orientation() === \"vertical\" ? state().percentage() : undefined" } }, exportAs: ["ngpSliderThumb"], ngImport: i0 }); }
|
|
135
135
|
}
|
|
136
136
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpSliderThumb, decorators: [{
|
|
137
137
|
type: Directive,
|
|
@@ -140,15 +140,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImpo
|
|
|
140
140
|
exportAs: 'ngpSliderThumb',
|
|
141
141
|
host: {
|
|
142
142
|
role: 'slider',
|
|
143
|
-
'[attr.aria-valuemin]': '
|
|
144
|
-
'[attr.aria-valuemax]': '
|
|
145
|
-
'[attr.aria-valuenow]': '
|
|
146
|
-
'[attr.aria-orientation]': '
|
|
147
|
-
'[tabindex]': '
|
|
148
|
-
'[attr.data-orientation]': '
|
|
149
|
-
'[attr.data-disabled]': '
|
|
150
|
-
'[style.inset-inline-start.%]': '
|
|
151
|
-
'[style.inset-block-start.%]': '
|
|
143
|
+
'[attr.aria-valuemin]': 'state().min()',
|
|
144
|
+
'[attr.aria-valuemax]': 'state().max()',
|
|
145
|
+
'[attr.aria-valuenow]': 'state().value()',
|
|
146
|
+
'[attr.aria-orientation]': 'state().orientation()',
|
|
147
|
+
'[tabindex]': 'state().disabled() ? -1 : 0',
|
|
148
|
+
'[attr.data-orientation]': 'state().orientation()',
|
|
149
|
+
'[attr.data-disabled]': 'state().disabled() ? "" : null',
|
|
150
|
+
'[style.inset-inline-start.%]': 'state().orientation() === "horizontal" ? state().percentage() : undefined',
|
|
151
|
+
'[style.inset-block-start.%]': 'state().orientation() === "vertical" ? state().percentage() : undefined',
|
|
152
152
|
},
|
|
153
153
|
}]
|
|
154
154
|
}], ctorParameters: () => [], propDecorators: { handlePointerDown: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-primitives-slider.mjs","sources":["../../../../packages/ng-primitives/slider/src/slider/slider-state.ts","../../../../packages/ng-primitives/slider/src/slider-range/slider-range.ts","../../../../packages/ng-primitives/slider/src/slider-thumb/slider-thumb.ts","../../../../packages/ng-primitives/slider/src/slider-track/slider-track.ts","../../../../packages/ng-primitives/slider/src/slider/slider.ts","../../../../packages/ng-primitives/slider/src/ng-primitives-slider.ts"],"sourcesContent":["import {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpSlider } from './slider';\n\n/**\n * The state token for the Slider primitive.\n */\nexport const NgpSliderStateToken = createStateToken<NgpSlider>('Slider');\n\n/**\n * Provides the Slider state.\n */\nexport const provideSliderState = createStateProvider(NgpSliderStateToken);\n\n/**\n * Injects the Slider state.\n */\nexport const injectSliderState = createStateInjector<NgpSlider>(NgpSliderStateToken);\n\n/**\n * The Slider state registration function.\n */\nexport const sliderState = createState(NgpSliderStateToken);\n","import { Directive } from '@angular/core';\nimport { injectSliderState } from '../slider/slider-state';\n\n/**\n * Apply the `ngpSliderRange` directive to an element that represents the range of the slider.\n */\n@Directive({\n selector: '[ngpSliderRange]',\n exportAs: 'ngpSliderRange',\n host: {\n '[attr.data-orientation]': 'sliderState().orientation()',\n '[attr.data-disabled]': 'sliderState().disabled() ? \"\" : null',\n '[style.width.%]':\n 'sliderState().orientation() === \"horizontal\" ? sliderState().percentage() : undefined',\n '[style.height.%]':\n 'sliderState().orientation() === \"vertical\" ? sliderState().percentage() : undefined',\n },\n})\nexport class NgpSliderRange {\n /**\n * Access the slider state.\n */\n protected readonly sliderState = injectSliderState();\n}\n","import { Directive, HostListener } from '@angular/core';\nimport { setupInteractions } from 'ng-primitives/internal';\nimport { injectSliderState } from '../slider/slider-state';\n\n/**\n * Apply the `ngpSliderThumb` directive to an element that represents the thumb of the slider.\n */\n@Directive({\n selector: '[ngpSliderThumb]',\n exportAs: 'ngpSliderThumb',\n host: {\n role: 'slider',\n '[attr.aria-valuemin]': 'sliderState().min()',\n '[attr.aria-valuemax]': 'sliderState().max()',\n '[attr.aria-valuenow]': 'sliderState().value()',\n '[attr.aria-orientation]': 'sliderState().orientation()',\n '[tabindex]': 'sliderState().disabled() ? -1 : 0',\n '[attr.data-orientation]': 'sliderState().orientation()',\n '[attr.data-disabled]': 'sliderState().disabled() ? \"\" : null',\n '[style.inset-inline-start.%]':\n 'sliderState().orientation() === \"horizontal\" ? sliderState().percentage() : undefined',\n '[style.inset-block-start.%]':\n 'sliderState().orientation() === \"vertical\" ? sliderState().percentage() : undefined',\n },\n})\nexport class NgpSliderThumb {\n /**\n * Access the slider state.\n */\n protected readonly sliderState = injectSliderState();\n\n /**\n * Store the dragging state.\n */\n protected dragging = false;\n\n constructor() {\n setupInteractions({\n hover: true,\n focusVisible: true,\n press: true,\n disabled: this.sliderState().disabled,\n });\n }\n\n @HostListener('pointerdown', ['$event'])\n protected handlePointerDown(event: PointerEvent): void {\n event.preventDefault();\n\n if (this.sliderState().disabled()) {\n return;\n }\n\n this.dragging = true;\n }\n\n @HostListener('document:pointerup')\n protected handlePointerUp(): void {\n if (this.sliderState().disabled()) {\n return;\n }\n\n this.dragging = false;\n }\n\n @HostListener('document:pointermove', ['$event'])\n protected handlePointerMove(event: PointerEvent): void {\n if (this.sliderState().disabled() || !this.dragging) {\n return;\n }\n\n const rect = this.sliderState().track()?.element.nativeElement.getBoundingClientRect();\n\n if (!rect) {\n return;\n }\n\n const percentage =\n this.sliderState().orientation() === 'horizontal'\n ? (event.clientX - rect.left) / rect.width\n : 1 - (event.clientY - rect.top) / rect.height;\n\n this.sliderState().value.set(\n this.sliderState().min() +\n (this.sliderState().max() - this.sliderState().min()) *\n Math.max(0, Math.min(1, percentage)),\n );\n this.sliderState().valueChange.emit(this.sliderState().value());\n }\n\n /**\n * Handle keyboard events.\n * @param event\n */\n @HostListener('keydown', ['$event'])\n protected handleKeydown(event: KeyboardEvent): void {\n const multiplier = event.shiftKey ? 10 : 1;\n const value = this.sliderState().value();\n\n switch (event.key) {\n case 'ArrowLeft':\n case 'ArrowDown':\n this.sliderState().value.set(\n Math.max(value - this.sliderState().step() * multiplier, this.sliderState().min()),\n );\n this.sliderState().valueChange.emit(this.sliderState().value());\n event.preventDefault();\n break;\n case 'ArrowRight':\n case 'ArrowUp':\n this.sliderState().value.set(\n Math.min(value + this.sliderState().step() * multiplier, this.sliderState().max()),\n );\n this.sliderState().valueChange.emit(this.sliderState().value());\n event.preventDefault();\n break;\n case 'Home':\n this.sliderState().value.set(this.sliderState().min());\n this.sliderState().valueChange.emit(this.sliderState().value());\n event.preventDefault();\n break;\n case 'End':\n this.sliderState().value.set(this.sliderState().max());\n this.sliderState().valueChange.emit(this.sliderState().value());\n event.preventDefault();\n break;\n }\n }\n}\n","import { Directive, HostListener } from '@angular/core';\nimport { injectElementRef } from 'ng-primitives/internal';\nimport { injectSliderState } from '../slider/slider-state';\n\n/**\n * Apply the `ngpSliderTrack` directive to an element that represents the track of the slider.\n */\n@Directive({\n selector: '[ngpSliderTrack]',\n exportAs: 'ngpSliderTrack',\n host: {\n '[attr.data-orientation]': 'sliderState().orientation()',\n '[attr.data-disabled]': 'sliderState().disabled() ? \"\" : null',\n },\n})\nexport class NgpSliderTrack {\n /**\n * Access the slider state.\n */\n protected readonly sliderState = injectSliderState();\n\n /**\n * The element that represents the slider track.\n */\n readonly element = injectElementRef<HTMLElement>();\n\n constructor() {\n this.sliderState().track.set(this);\n }\n\n /**\n * When the slider track is clicked, update the value.\n * @param event The click event.\n */\n @HostListener('pointerdown', ['$event'])\n protected handlePointerDown(event: PointerEvent): void {\n if (this.sliderState().disabled()) {\n return;\n }\n\n // get the position the click occurred within the slider track\n const position =\n this.sliderState().orientation() === 'horizontal' ? event.clientX : event.clientY;\n const rect = this.element.nativeElement.getBoundingClientRect();\n const percentage =\n (position - (this.sliderState().orientation() === 'horizontal' ? rect.left : rect.top)) /\n (this.sliderState().orientation() === 'horizontal' ? rect.width : rect.height);\n\n // update the value based on the position\n this.sliderState().value.set(\n this.sliderState().min() + (this.sliderState().max() - this.sliderState().min()) * percentage,\n );\n this.sliderState().valueChange.emit(this.sliderState().value());\n }\n}\n","import { BooleanInput, NumberInput } from '@angular/cdk/coercion';\nimport {\n Directive,\n booleanAttribute,\n computed,\n input,\n numberAttribute,\n output,\n signal,\n} from '@angular/core';\nimport { NgpOrientation } from 'ng-primitives/common';\nimport { setupFormControl } from 'ng-primitives/form-field';\nimport { uniqueId } from 'ng-primitives/utils';\nimport type { NgpSliderTrack } from '../slider-track/slider-track';\nimport { provideSliderState, sliderState } from './slider-state';\n\n/**\n * Apply the `ngpSlider` directive to an element that represents the slider and contains the track, range, and thumb.\n */\n@Directive({\n selector: '[ngpSlider]',\n exportAs: 'ngpSlider',\n providers: [provideSliderState()],\n host: {\n '[id]': 'id()',\n '[attr.data-orientation]': 'state.orientation()',\n },\n})\nexport class NgpSlider {\n /**\n * The id of the slider. If not provided, a unique id will be generated.\n */\n readonly id = input<string>(uniqueId('ngp-slider'));\n\n /**\n * The value of the slider.\n */\n readonly value = input<number, NumberInput>(0, {\n alias: 'ngpSliderValue',\n transform: numberAttribute,\n });\n\n /**\n * Emits when the value changes.\n */\n readonly valueChange = output<number>({\n alias: 'ngpSliderValueChange',\n });\n\n /**\n * The minimum value of the slider.\n */\n readonly min = input<number, NumberInput>(0, {\n alias: 'ngpSliderMin',\n transform: numberAttribute,\n });\n\n /**\n * The maximum value of the slider.\n */\n readonly max = input<number, NumberInput>(100, {\n alias: 'ngpSliderMax',\n transform: numberAttribute,\n });\n\n /**\n * The step value of the slider.\n */\n readonly step = input<number, NumberInput>(1, {\n alias: 'ngpSliderStep',\n transform: numberAttribute,\n });\n\n /**\n * The orientation of the slider.\n */\n readonly orientation = input<NgpOrientation>('horizontal', {\n alias: 'ngpSliderOrientation',\n });\n\n /**\n * The disabled state of the slider.\n */\n readonly disabled = input<boolean, BooleanInput>(false, {\n alias: 'ngpSliderDisabled',\n transform: booleanAttribute,\n });\n\n /**\n * Access the slider track.\n * @internal\n */\n readonly track = signal<NgpSliderTrack | undefined>(undefined);\n\n /**\n * The value as a percentage based on the min and max values.\n */\n protected readonly percentage = computed(\n () => ((this.state.value() - this.state.min()) / (this.state.max() - this.state.min())) * 100,\n );\n\n /**\n * The state of the slider. We use this for the slider state rather than relying on the inputs.\n * @internal\n */\n protected readonly state = sliderState<NgpSlider>(this);\n\n constructor() {\n setupFormControl({ id: this.state.id, disabled: this.state.disabled });\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ng-primitives-slider.mjs","sources":["../../../../packages/ng-primitives/slider/src/slider/slider-state.ts","../../../../packages/ng-primitives/slider/src/slider-range/slider-range.ts","../../../../packages/ng-primitives/slider/src/slider-thumb/slider-thumb.ts","../../../../packages/ng-primitives/slider/src/slider-track/slider-track.ts","../../../../packages/ng-primitives/slider/src/slider/slider.ts","../../../../packages/ng-primitives/slider/src/ng-primitives-slider.ts"],"sourcesContent":["import {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpSlider } from './slider';\n\n/**\n * The state token for the Slider primitive.\n */\nexport const NgpSliderStateToken = createStateToken<NgpSlider>('Slider');\n\n/**\n * Provides the Slider state.\n */\nexport const provideSliderState = createStateProvider(NgpSliderStateToken);\n\n/**\n * Injects the Slider state.\n */\nexport const injectSliderState = createStateInjector<NgpSlider>(NgpSliderStateToken);\n\n/**\n * The Slider state registration function.\n */\nexport const sliderState = createState(NgpSliderStateToken);\n","import { Directive } from '@angular/core';\nimport { injectSliderState } from '../slider/slider-state';\n\n/**\n * Apply the `ngpSliderRange` directive to an element that represents the range of the slider.\n */\n@Directive({\n selector: '[ngpSliderRange]',\n exportAs: 'ngpSliderRange',\n host: {\n '[attr.data-orientation]': 'sliderState().orientation()',\n '[attr.data-disabled]': 'sliderState().disabled() ? \"\" : null',\n '[style.width.%]':\n 'sliderState().orientation() === \"horizontal\" ? sliderState().percentage() : undefined',\n '[style.height.%]':\n 'sliderState().orientation() === \"vertical\" ? sliderState().percentage() : undefined',\n },\n})\nexport class NgpSliderRange {\n /**\n * Access the slider state.\n */\n protected readonly sliderState = injectSliderState();\n}\n","import { Directive, HostListener } from '@angular/core';\nimport { setupInteractions } from 'ng-primitives/internal';\nimport { injectSliderState } from '../slider/slider-state';\n\n/**\n * Apply the `ngpSliderThumb` directive to an element that represents the thumb of the slider.\n */\n@Directive({\n selector: '[ngpSliderThumb]',\n exportAs: 'ngpSliderThumb',\n host: {\n role: 'slider',\n '[attr.aria-valuemin]': 'state().min()',\n '[attr.aria-valuemax]': 'state().max()',\n '[attr.aria-valuenow]': 'state().value()',\n '[attr.aria-orientation]': 'state().orientation()',\n '[tabindex]': 'state().disabled() ? -1 : 0',\n '[attr.data-orientation]': 'state().orientation()',\n '[attr.data-disabled]': 'state().disabled() ? \"\" : null',\n '[style.inset-inline-start.%]':\n 'state().orientation() === \"horizontal\" ? state().percentage() : undefined',\n '[style.inset-block-start.%]':\n 'state().orientation() === \"vertical\" ? state().percentage() : undefined',\n },\n})\nexport class NgpSliderThumb {\n /**\n * Access the slider state.\n */\n protected readonly state = injectSliderState();\n\n /**\n * Store the dragging state.\n */\n protected dragging = false;\n\n constructor() {\n setupInteractions({\n hover: true,\n focusVisible: true,\n press: true,\n disabled: this.state().disabled,\n });\n }\n\n @HostListener('pointerdown', ['$event'])\n protected handlePointerDown(event: PointerEvent): void {\n event.preventDefault();\n\n if (this.state().disabled()) {\n return;\n }\n\n this.dragging = true;\n }\n\n @HostListener('document:pointerup')\n protected handlePointerUp(): void {\n if (this.state().disabled()) {\n return;\n }\n\n this.dragging = false;\n }\n\n @HostListener('document:pointermove', ['$event'])\n protected handlePointerMove(event: PointerEvent): void {\n if (this.state().disabled() || !this.dragging) {\n return;\n }\n\n const rect = this.state().track()?.element.nativeElement.getBoundingClientRect();\n\n if (!rect) {\n return;\n }\n\n const percentage =\n this.state().orientation() === 'horizontal'\n ? (event.clientX - rect.left) / rect.width\n : 1 - (event.clientY - rect.top) / rect.height;\n\n const value =\n this.state().min() +\n (this.state().max() - this.state().min()) * Math.max(0, Math.min(1, percentage));\n\n this.state().value.set(value);\n this.state().valueChange.emit(value);\n }\n\n /**\n * Handle keyboard events.\n * @param event\n */\n @HostListener('keydown', ['$event'])\n protected handleKeydown(event: KeyboardEvent): void {\n const multiplier = event.shiftKey ? 10 : 1;\n const value = this.state().value();\n\n switch (event.key) {\n case 'ArrowLeft':\n case 'ArrowDown':\n this.state().value.set(\n Math.max(value - this.state().step() * multiplier, this.state().min()),\n );\n this.state().valueChange.emit(this.state().value());\n event.preventDefault();\n break;\n case 'ArrowRight':\n case 'ArrowUp':\n this.state().value.set(\n Math.min(value + this.state().step() * multiplier, this.state().max()),\n );\n this.state().valueChange.emit(this.state().value());\n event.preventDefault();\n break;\n case 'Home':\n this.state().value.set(this.state().min());\n this.state().valueChange.emit(this.state().value());\n event.preventDefault();\n break;\n case 'End':\n this.state().value.set(this.state().max());\n this.state().valueChange.emit(this.state().value());\n event.preventDefault();\n break;\n }\n }\n}\n","import { Directive, HostListener } from '@angular/core';\nimport { injectElementRef } from 'ng-primitives/internal';\nimport { injectSliderState } from '../slider/slider-state';\n\n/**\n * Apply the `ngpSliderTrack` directive to an element that represents the track of the slider.\n */\n@Directive({\n selector: '[ngpSliderTrack]',\n exportAs: 'ngpSliderTrack',\n host: {\n '[attr.data-orientation]': 'sliderState().orientation()',\n '[attr.data-disabled]': 'sliderState().disabled() ? \"\" : null',\n },\n})\nexport class NgpSliderTrack {\n /**\n * Access the slider state.\n */\n protected readonly sliderState = injectSliderState();\n\n /**\n * The element that represents the slider track.\n */\n readonly element = injectElementRef<HTMLElement>();\n\n constructor() {\n this.sliderState().track.set(this);\n }\n\n /**\n * When the slider track is clicked, update the value.\n * @param event The click event.\n */\n @HostListener('pointerdown', ['$event'])\n protected handlePointerDown(event: PointerEvent): void {\n if (this.sliderState().disabled()) {\n return;\n }\n\n // get the position the click occurred within the slider track\n const position =\n this.sliderState().orientation() === 'horizontal' ? event.clientX : event.clientY;\n const rect = this.element.nativeElement.getBoundingClientRect();\n const percentage =\n (position - (this.sliderState().orientation() === 'horizontal' ? rect.left : rect.top)) /\n (this.sliderState().orientation() === 'horizontal' ? rect.width : rect.height);\n\n // update the value based on the position\n this.sliderState().value.set(\n this.sliderState().min() + (this.sliderState().max() - this.sliderState().min()) * percentage,\n );\n this.sliderState().valueChange.emit(this.sliderState().value());\n }\n}\n","import { BooleanInput, NumberInput } from '@angular/cdk/coercion';\nimport {\n Directive,\n booleanAttribute,\n computed,\n input,\n numberAttribute,\n output,\n signal,\n} from '@angular/core';\nimport { NgpOrientation } from 'ng-primitives/common';\nimport { setupFormControl } from 'ng-primitives/form-field';\nimport { uniqueId } from 'ng-primitives/utils';\nimport type { NgpSliderTrack } from '../slider-track/slider-track';\nimport { provideSliderState, sliderState } from './slider-state';\n\n/**\n * Apply the `ngpSlider` directive to an element that represents the slider and contains the track, range, and thumb.\n */\n@Directive({\n selector: '[ngpSlider]',\n exportAs: 'ngpSlider',\n providers: [provideSliderState()],\n host: {\n '[id]': 'id()',\n '[attr.data-orientation]': 'state.orientation()',\n },\n})\nexport class NgpSlider {\n /**\n * The id of the slider. If not provided, a unique id will be generated.\n */\n readonly id = input<string>(uniqueId('ngp-slider'));\n\n /**\n * The value of the slider.\n */\n readonly value = input<number, NumberInput>(0, {\n alias: 'ngpSliderValue',\n transform: numberAttribute,\n });\n\n /**\n * Emits when the value changes.\n */\n readonly valueChange = output<number>({\n alias: 'ngpSliderValueChange',\n });\n\n /**\n * The minimum value of the slider.\n */\n readonly min = input<number, NumberInput>(0, {\n alias: 'ngpSliderMin',\n transform: numberAttribute,\n });\n\n /**\n * The maximum value of the slider.\n */\n readonly max = input<number, NumberInput>(100, {\n alias: 'ngpSliderMax',\n transform: numberAttribute,\n });\n\n /**\n * The step value of the slider.\n */\n readonly step = input<number, NumberInput>(1, {\n alias: 'ngpSliderStep',\n transform: numberAttribute,\n });\n\n /**\n * The orientation of the slider.\n */\n readonly orientation = input<NgpOrientation>('horizontal', {\n alias: 'ngpSliderOrientation',\n });\n\n /**\n * The disabled state of the slider.\n */\n readonly disabled = input<boolean, BooleanInput>(false, {\n alias: 'ngpSliderDisabled',\n transform: booleanAttribute,\n });\n\n /**\n * Access the slider track.\n * @internal\n */\n readonly track = signal<NgpSliderTrack | undefined>(undefined);\n\n /**\n * The value as a percentage based on the min and max values.\n */\n protected readonly percentage = computed(\n () => ((this.state.value() - this.state.min()) / (this.state.max() - this.state.min())) * 100,\n );\n\n /**\n * The state of the slider. We use this for the slider state rather than relying on the inputs.\n * @internal\n */\n protected readonly state = sliderState<NgpSlider>(this);\n\n constructor() {\n setupFormControl({ id: this.state.id, disabled: this.state.disabled });\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { InjectionToken, signal, inject, computed,
|
|
1
|
+
import { InjectionToken, signal, inject, computed, linkedSignal, isSignal } from '@angular/core';
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
4
|
* Create a new injection token for the state.
|
|
@@ -46,13 +46,10 @@ function createState(token) {
|
|
|
46
46
|
// Iterating over properties
|
|
47
47
|
for (const key in state) {
|
|
48
48
|
const value = state[key];
|
|
49
|
-
//
|
|
50
|
-
|
|
51
|
-
// and we need to create a new signal that is writable
|
|
52
|
-
// and linked to the original signal
|
|
53
|
-
if (isSignal(value) && 'set' in value === false) {
|
|
49
|
+
// We want to make this a controlled input if it is an InputSignal or InputSignalWithTransform
|
|
50
|
+
if (isSignalInput(value)) {
|
|
54
51
|
// @ts-ignore
|
|
55
|
-
obj[key] =
|
|
52
|
+
obj[key] = createControlledInput(value);
|
|
56
53
|
}
|
|
57
54
|
else {
|
|
58
55
|
// @ts-ignore
|
|
@@ -80,6 +77,55 @@ function createState(token) {
|
|
|
80
77
|
return internalState();
|
|
81
78
|
};
|
|
82
79
|
}
|
|
80
|
+
// this is a bit hacky, but we need to do it to track whether this is controlled
|
|
81
|
+
function createControlledInput(property) {
|
|
82
|
+
const value = signal(property());
|
|
83
|
+
let isControlled = false;
|
|
84
|
+
const symbol = Object.getOwnPropertySymbols(property).find(s => s.description === 'SIGNAL');
|
|
85
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
86
|
+
const inputDefinition = symbol ? property[symbol] : undefined;
|
|
87
|
+
if (!symbol ||
|
|
88
|
+
!inputDefinition ||
|
|
89
|
+
typeof inputDefinition.applyValueToInputSignal !== 'function') {
|
|
90
|
+
console.warn('Angular has changed its internal Input implementation, report this issue to ng-primitives.');
|
|
91
|
+
// fallback to a linked signal which is partially controlled
|
|
92
|
+
return linkedSignal(() => property());
|
|
93
|
+
}
|
|
94
|
+
const originalApply = inputDefinition.applyValueToInputSignal.bind(inputDefinition);
|
|
95
|
+
const originalSet = value.set.bind(value);
|
|
96
|
+
const originalUpdate = value.update.bind(value);
|
|
97
|
+
inputDefinition.applyValueToInputSignal = (inputSignalNode, newValue) => {
|
|
98
|
+
isControlled = true;
|
|
99
|
+
originalSet(newValue);
|
|
100
|
+
originalApply(inputSignalNode, newValue);
|
|
101
|
+
};
|
|
102
|
+
value.set = (newValue) => {
|
|
103
|
+
if (!isControlled) {
|
|
104
|
+
originalSet(newValue);
|
|
105
|
+
}
|
|
106
|
+
};
|
|
107
|
+
value.update = (updateFn) => {
|
|
108
|
+
if (!isControlled) {
|
|
109
|
+
originalUpdate(updateFn);
|
|
110
|
+
}
|
|
111
|
+
};
|
|
112
|
+
return value;
|
|
113
|
+
}
|
|
114
|
+
function isSignalInput(property) {
|
|
115
|
+
if (!isSignal(property)) {
|
|
116
|
+
return false;
|
|
117
|
+
}
|
|
118
|
+
const symbol = Object.getOwnPropertySymbols(property).find(s => s.description === 'SIGNAL');
|
|
119
|
+
if (!symbol) {
|
|
120
|
+
return false;
|
|
121
|
+
}
|
|
122
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
123
|
+
const inputDefinition = symbol ? property[symbol] : undefined;
|
|
124
|
+
if (!inputDefinition) {
|
|
125
|
+
return false;
|
|
126
|
+
}
|
|
127
|
+
return 'transformFn' in inputDefinition || 'applyValueToInputSignal' in inputDefinition;
|
|
128
|
+
}
|
|
83
129
|
|
|
84
130
|
/**
|
|
85
131
|
* Generated bundle index. Do not edit.
|
|
@@ -1 +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\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;;;;"}
|
|
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\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 // We want to make this a controlled input if it is an InputSignal or InputSignalWithTransform\n if (isSignalInput(value)) {\n // @ts-ignore\n obj[key] = createControlledInput(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// this is a bit hacky, but we need to do it to track whether this is controlled\nfunction createControlledInput(\n property: InputSignal<unknown> | InputSignalWithTransform<unknown, unknown>,\n): WritableSignal<unknown> {\n const value = signal(property());\n let isControlled = false;\n\n const symbol = Object.getOwnPropertySymbols(property).find(s => s.description === 'SIGNAL');\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const inputDefinition = symbol ? (property as any)[symbol] : undefined;\n\n if (\n !symbol ||\n !inputDefinition ||\n typeof inputDefinition.applyValueToInputSignal !== 'function'\n ) {\n console.warn(\n 'Angular has changed its internal Input implementation, report this issue to ng-primitives.',\n );\n // fallback to a linked signal which is partially controlled\n return linkedSignal(() => property());\n }\n\n const originalApply = inputDefinition.applyValueToInputSignal.bind(inputDefinition);\n const originalSet = value.set.bind(value);\n const originalUpdate = value.update.bind(value);\n\n inputDefinition.applyValueToInputSignal = (inputSignalNode: unknown, newValue: unknown) => {\n isControlled = true;\n originalSet(newValue);\n originalApply(inputSignalNode, newValue);\n };\n\n value.set = (newValue: unknown) => {\n if (!isControlled) {\n originalSet(newValue);\n }\n };\n\n value.update = (updateFn: (value: unknown) => unknown) => {\n if (!isControlled) {\n originalUpdate(updateFn);\n }\n };\n\n return value;\n}\n\nfunction isSignalInput(\n property: unknown,\n): property is InputSignal<unknown> | InputSignalWithTransform<unknown, unknown> {\n if (!isSignal(property)) {\n return false;\n }\n\n const symbol = Object.getOwnPropertySymbols(property).find(s => s.description === 'SIGNAL');\n\n if (!symbol) {\n return false;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const inputDefinition = symbol ? (property as any)[symbol] : undefined;\n\n if (!inputDefinition) {\n return false;\n }\n\n return 'transformFn' in inputDefinition || 'applyValueToInputSignal' in inputDefinition;\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -111,8 +111,9 @@ class NgpSwitch {
|
|
|
111
111
|
if (this.state.disabled()) {
|
|
112
112
|
return;
|
|
113
113
|
}
|
|
114
|
-
|
|
115
|
-
this.
|
|
114
|
+
const checked = !this.state.checked();
|
|
115
|
+
this.state.checked.set(checked);
|
|
116
|
+
this.checkedChange.emit(checked);
|
|
116
117
|
}
|
|
117
118
|
/**
|
|
118
119
|
* Handle the keydown event.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-primitives-switch.mjs","sources":["../../../../packages/ng-primitives/switch/src/switch/switch-state.ts","../../../../packages/ng-primitives/switch/src/switch-thumb/switch-thumb.ts","../../../../packages/ng-primitives/switch/src/switch/switch.ts","../../../../packages/ng-primitives/switch/src/ng-primitives-switch.ts"],"sourcesContent":["import {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpSwitch } from './switch';\n\n/**\n * The state token for the Switch primitive.\n */\nexport const NgpSwitchStateToken = createStateToken<NgpSwitch>('Switch');\n\n/**\n * Provides the Switch state.\n */\nexport const provideSwitchState = createStateProvider(NgpSwitchStateToken);\n\n/**\n * Injects the Switch state.\n */\nexport const injectSwitchState = createStateInjector<NgpSwitch>(NgpSwitchStateToken);\n\n/**\n * The Switch state registration function.\n */\nexport const switchState = createState(NgpSwitchStateToken);\n","import { Directive } from '@angular/core';\nimport { setupInteractions } from 'ng-primitives/internal';\nimport { injectSwitchState } from '../switch/switch-state';\n\n/**\n * Apply the `ngpSwitchThumb` directive to an element within a switch to represent the thumb.\n */\n@Directive({\n selector: '[ngpSwitchThumb]',\n host: {\n '[attr.data-checked]': 'state().checked() ? \"\" : null',\n '[attr.data-disabled]': 'state().disabled() ? \"\" : null',\n },\n})\nexport class NgpSwitchThumb {\n /**\n * Access the switch state.\n */\n protected readonly state = injectSwitchState();\n\n constructor() {\n setupInteractions({\n hover: true,\n focusVisible: true,\n press: true,\n disabled: this.state().disabled,\n });\n }\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { booleanAttribute, Directive, HostListener, input, output } from '@angular/core';\nimport { setupFormControl } from 'ng-primitives/form-field';\nimport { injectElementRef, setupInteractions } from 'ng-primitives/internal';\nimport { uniqueId } from 'ng-primitives/utils';\nimport { provideSwitchState, switchState } from './switch-state';\n\n/**\n * Apply the `ngpSwitch` directive to an element to manage the checked state.\n */\n@Directive({\n selector: '[ngpSwitch]',\n exportAs: 'ngpSwitch',\n providers: [provideSwitchState()],\n host: {\n role: 'switch',\n '[id]': 'id()',\n '[attr.type]': 'isButton ? \"button\" : null',\n '[attr.aria-checked]': 'state.checked()',\n '[attr.data-checked]': 'state.checked() ? \"\" : null',\n '[attr.disabled]': 'isButton && state.disabled() ? \"\" : null',\n '[attr.data-disabled]': 'state.disabled() ? \"\" : null',\n '[attr.aria-disabled]': 'state.disabled()',\n '[attr.tabindex]': 'state.disabled() ? -1 : 0',\n },\n})\nexport class NgpSwitch {\n /**\n * Access the element ref.\n */\n private readonly elementRef = injectElementRef();\n\n /**\n * Determine if the switch is a button\n */\n protected isButton = this.elementRef.nativeElement.tagName === 'BUTTON';\n\n /**\n * The id of the switch. If not provided, a unique id will be generated.\n */\n readonly id = input<string>(uniqueId('ngp-switch'));\n\n /**\n * Determine if the switch is checked.\n * @default false\n */\n readonly checked = input<boolean, BooleanInput>(false, {\n alias: 'ngpSwitchChecked',\n transform: booleanAttribute,\n });\n\n /**\n * Emits when the checked state changes.\n */\n readonly checkedChange = output<boolean>({\n alias: 'ngpSwitchCheckedChange',\n });\n\n /**\n * Determine if the switch is disabled.\n * @default false\n */\n readonly disabled = input<boolean, BooleanInput>(false, {\n alias: 'ngpSwitchDisabled',\n transform: booleanAttribute,\n });\n\n /**\n * The switch state.\n * @internal\n */\n readonly state = switchState<NgpSwitch>(this);\n\n constructor() {\n setupInteractions({\n hover: true,\n press: true,\n focusVisible: true,\n disabled: this.state.disabled,\n });\n setupFormControl({ id: this.state.id, disabled: this.state.disabled });\n }\n\n /**\n * Toggle the checked state.\n */\n @HostListener('click')\n toggle(): void {\n if (this.state.disabled()) {\n return;\n }\n\n this.state.checked
|
|
1
|
+
{"version":3,"file":"ng-primitives-switch.mjs","sources":["../../../../packages/ng-primitives/switch/src/switch/switch-state.ts","../../../../packages/ng-primitives/switch/src/switch-thumb/switch-thumb.ts","../../../../packages/ng-primitives/switch/src/switch/switch.ts","../../../../packages/ng-primitives/switch/src/ng-primitives-switch.ts"],"sourcesContent":["import {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpSwitch } from './switch';\n\n/**\n * The state token for the Switch primitive.\n */\nexport const NgpSwitchStateToken = createStateToken<NgpSwitch>('Switch');\n\n/**\n * Provides the Switch state.\n */\nexport const provideSwitchState = createStateProvider(NgpSwitchStateToken);\n\n/**\n * Injects the Switch state.\n */\nexport const injectSwitchState = createStateInjector<NgpSwitch>(NgpSwitchStateToken);\n\n/**\n * The Switch state registration function.\n */\nexport const switchState = createState(NgpSwitchStateToken);\n","import { Directive } from '@angular/core';\nimport { setupInteractions } from 'ng-primitives/internal';\nimport { injectSwitchState } from '../switch/switch-state';\n\n/**\n * Apply the `ngpSwitchThumb` directive to an element within a switch to represent the thumb.\n */\n@Directive({\n selector: '[ngpSwitchThumb]',\n host: {\n '[attr.data-checked]': 'state().checked() ? \"\" : null',\n '[attr.data-disabled]': 'state().disabled() ? \"\" : null',\n },\n})\nexport class NgpSwitchThumb {\n /**\n * Access the switch state.\n */\n protected readonly state = injectSwitchState();\n\n constructor() {\n setupInteractions({\n hover: true,\n focusVisible: true,\n press: true,\n disabled: this.state().disabled,\n });\n }\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { booleanAttribute, Directive, HostListener, input, output } from '@angular/core';\nimport { setupFormControl } from 'ng-primitives/form-field';\nimport { injectElementRef, setupInteractions } from 'ng-primitives/internal';\nimport { uniqueId } from 'ng-primitives/utils';\nimport { provideSwitchState, switchState } from './switch-state';\n\n/**\n * Apply the `ngpSwitch` directive to an element to manage the checked state.\n */\n@Directive({\n selector: '[ngpSwitch]',\n exportAs: 'ngpSwitch',\n providers: [provideSwitchState()],\n host: {\n role: 'switch',\n '[id]': 'id()',\n '[attr.type]': 'isButton ? \"button\" : null',\n '[attr.aria-checked]': 'state.checked()',\n '[attr.data-checked]': 'state.checked() ? \"\" : null',\n '[attr.disabled]': 'isButton && state.disabled() ? \"\" : null',\n '[attr.data-disabled]': 'state.disabled() ? \"\" : null',\n '[attr.aria-disabled]': 'state.disabled()',\n '[attr.tabindex]': 'state.disabled() ? -1 : 0',\n },\n})\nexport class NgpSwitch {\n /**\n * Access the element ref.\n */\n private readonly elementRef = injectElementRef();\n\n /**\n * Determine if the switch is a button\n */\n protected isButton = this.elementRef.nativeElement.tagName === 'BUTTON';\n\n /**\n * The id of the switch. If not provided, a unique id will be generated.\n */\n readonly id = input<string>(uniqueId('ngp-switch'));\n\n /**\n * Determine if the switch is checked.\n * @default false\n */\n readonly checked = input<boolean, BooleanInput>(false, {\n alias: 'ngpSwitchChecked',\n transform: booleanAttribute,\n });\n\n /**\n * Emits when the checked state changes.\n */\n readonly checkedChange = output<boolean>({\n alias: 'ngpSwitchCheckedChange',\n });\n\n /**\n * Determine if the switch is disabled.\n * @default false\n */\n readonly disabled = input<boolean, BooleanInput>(false, {\n alias: 'ngpSwitchDisabled',\n transform: booleanAttribute,\n });\n\n /**\n * The switch state.\n * @internal\n */\n readonly state = switchState<NgpSwitch>(this);\n\n constructor() {\n setupInteractions({\n hover: true,\n press: true,\n focusVisible: true,\n disabled: this.state.disabled,\n });\n setupFormControl({ id: this.state.id, disabled: this.state.disabled });\n }\n\n /**\n * Toggle the checked state.\n */\n @HostListener('click')\n toggle(): void {\n if (this.state.disabled()) {\n return;\n }\n\n const checked = !this.state.checked();\n this.state.checked.set(checked);\n this.checkedChange.emit(checked);\n }\n\n /**\n * Handle the keydown event.\n */\n @HostListener('keydown.space', ['$event'])\n protected onKeyDown(event: KeyboardEvent): void {\n // Prevent the default action of the space key, which is to scroll the page.\n event.preventDefault();\n\n // If the switch is not a button then the space key will not toggle the checked state automatically,\n // so we need to do it manually.\n if (!this.isButton) {\n this.toggle();\n }\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -8,6 +8,7 @@ import { syncState } from 'ng-primitives/internal';
|
|
|
8
8
|
const defaultToggleGroupConfig = {
|
|
9
9
|
orientation: 'horizontal',
|
|
10
10
|
type: 'single',
|
|
11
|
+
allowDeselection: true,
|
|
11
12
|
};
|
|
12
13
|
const NgpToggleGroupConfigToken = new InjectionToken('NgpToggleGroupConfigToken');
|
|
13
14
|
/**
|
|
@@ -150,6 +151,14 @@ class NgpToggleGroup {
|
|
|
150
151
|
this.orientation = input(this.config.orientation, {
|
|
151
152
|
alias: 'ngpToggleGroupOrientation',
|
|
152
153
|
});
|
|
154
|
+
/**
|
|
155
|
+
* Whether toggle buttons can be deselected. If set to `false`, clicking a selected toggle button will not deselect it.
|
|
156
|
+
* @default true
|
|
157
|
+
*/
|
|
158
|
+
this.allowDeselection = input(this.config.allowDeselection, {
|
|
159
|
+
alias: 'ngpToggleGroupAllowDeselection',
|
|
160
|
+
transform: booleanAttribute,
|
|
161
|
+
});
|
|
153
162
|
/**
|
|
154
163
|
* The type of the toggle group, whether only one item can be selected or multiple.
|
|
155
164
|
*/
|
|
@@ -184,23 +193,26 @@ class NgpToggleGroup {
|
|
|
184
193
|
if (this.state.disabled()) {
|
|
185
194
|
return;
|
|
186
195
|
}
|
|
196
|
+
let newValue = [];
|
|
187
197
|
if (this.state.type() === 'single') {
|
|
188
|
-
|
|
198
|
+
newValue = [value];
|
|
189
199
|
}
|
|
190
200
|
else {
|
|
191
|
-
|
|
201
|
+
newValue = [...this.state.value(), value];
|
|
192
202
|
}
|
|
193
|
-
this.
|
|
203
|
+
this.state.value.set(newValue);
|
|
204
|
+
this.valueChange.emit(newValue);
|
|
194
205
|
}
|
|
195
206
|
/**
|
|
196
207
|
* De-select a value in the toggle group.
|
|
197
208
|
*/
|
|
198
209
|
deselect(value) {
|
|
199
|
-
if (this.state.disabled()) {
|
|
210
|
+
if (this.state.disabled() || !this.state.allowDeselection()) {
|
|
200
211
|
return;
|
|
201
212
|
}
|
|
202
|
-
this.state.value
|
|
203
|
-
this.
|
|
213
|
+
const newValue = this.state.value().filter(v => v !== value);
|
|
214
|
+
this.state.value.set(newValue);
|
|
215
|
+
this.valueChange.emit(newValue);
|
|
204
216
|
}
|
|
205
217
|
/**
|
|
206
218
|
* Check if a value is selected in the toggle group.
|
|
@@ -222,7 +234,7 @@ class NgpToggleGroup {
|
|
|
222
234
|
}
|
|
223
235
|
}
|
|
224
236
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpToggleGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
225
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.11", type: NgpToggleGroup, isStandalone: true, selector: "[ngpToggleGroup]", inputs: { orientation: { classPropertyName: "orientation", publicName: "ngpToggleGroupOrientation", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "ngpToggleGroupType", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "ngpToggleGroupValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpToggleGroupDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "ngpToggleGroupValueChange" }, host: { attributes: { "role": "group" }, properties: { "attr.data-orientation": "state.orientation()", "attr.data-type": "state.type()", "attr.data-disabled": "state.disabled() ? \"\" : null" } }, providers: [provideToggleGroupState()], exportAs: ["ngpToggleGroup"], hostDirectives: [{ directive: i1.NgpRovingFocusGroup }], ngImport: i0 }); }
|
|
237
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.11", type: NgpToggleGroup, isStandalone: true, selector: "[ngpToggleGroup]", inputs: { orientation: { classPropertyName: "orientation", publicName: "ngpToggleGroupOrientation", isSignal: true, isRequired: false, transformFunction: null }, allowDeselection: { classPropertyName: "allowDeselection", publicName: "ngpToggleGroupAllowDeselection", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "ngpToggleGroupType", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "ngpToggleGroupValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "ngpToggleGroupDisabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "ngpToggleGroupValueChange" }, host: { attributes: { "role": "group" }, properties: { "attr.data-orientation": "state.orientation()", "attr.data-type": "state.type()", "attr.data-disabled": "state.disabled() ? \"\" : null" } }, providers: [provideToggleGroupState()], exportAs: ["ngpToggleGroup"], hostDirectives: [{ directive: i1.NgpRovingFocusGroup }], ngImport: i0 }); }
|
|
226
238
|
}
|
|
227
239
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.11", ngImport: i0, type: NgpToggleGroup, decorators: [{
|
|
228
240
|
type: Directive,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-primitives-toggle-group.mjs","sources":["../../../../packages/ng-primitives/toggle-group/src/config/toggle-group-config.ts","../../../../packages/ng-primitives/toggle-group/src/toggle-group/toggle-group-state.ts","../../../../packages/ng-primitives/toggle-group/src/toggle-group-item/toggle-group-item-state.ts","../../../../packages/ng-primitives/toggle-group/src/toggle-group-item/toggle-group-item.ts","../../../../packages/ng-primitives/toggle-group/src/toggle-group/toggle-group.ts","../../../../packages/ng-primitives/toggle-group/src/ng-primitives-toggle-group.ts"],"sourcesContent":["import { InjectionToken, Provider, inject } from '@angular/core';\nimport { NgpOrientation } from 'ng-primitives/common';\n\nexport interface NgpToggleGroupConfig {\n /**\n * The orientation of the toggle group.\n * @default 'horizontal'\n */\n orientation: NgpOrientation;\n\n /**\n * The type of the toggle group, whether only one item can be selected or multiple.\n * @default 'single'\n */\n type: 'single' | 'multiple';\n}\n\nexport const defaultToggleGroupConfig: NgpToggleGroupConfig = {\n orientation: 'horizontal',\n type: 'single',\n};\n\nexport const NgpToggleGroupConfigToken = new InjectionToken<NgpToggleGroupConfig>(\n 'NgpToggleGroupConfigToken',\n);\n\n/**\n * Provide the default ToggleGroup configuration\n * @param config The ToggleGroup configuration\n * @returns The provider\n */\nexport function provideToggleGroupConfig(config: Partial<NgpToggleGroupConfig>): Provider[] {\n return [\n {\n provide: NgpToggleGroupConfigToken,\n useValue: { ...defaultToggleGroupConfig, ...config },\n },\n ];\n}\n\n/**\n * Inject the ToggleGroup configuration\n * @returns The global ToggleGroup configuration\n */\nexport function injectToggleGroupConfig(): NgpToggleGroupConfig {\n return inject(NgpToggleGroupConfigToken, { optional: true }) ?? defaultToggleGroupConfig;\n}\n","import {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpToggleGroup } from './toggle-group';\n\n/**\n * The state token for the ToggleGroup primitive.\n */\nexport const NgpToggleGroupStateToken = createStateToken<NgpToggleGroup>('ToggleGroup');\n\n/**\n * Provides the ToggleGroup state.\n */\nexport const provideToggleGroupState = createStateProvider(NgpToggleGroupStateToken);\n\n/**\n * Injects the ToggleGroup state.\n */\nexport const injectToggleGroupState = createStateInjector<NgpToggleGroup>(NgpToggleGroupStateToken);\n\n/**\n * The ToggleGroup state registration function.\n */\nexport const toggleGroupState = createState(NgpToggleGroupStateToken);\n","import {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpToggleGroupItem } from './toggle-group-item';\n\n/**\n * The state token for the ToggleGroupItem primitive.\n */\nexport const NgpToggleGroupItemStateToken = createStateToken<NgpToggleGroupItem>('ToggleGroupItem');\n\n/**\n * Provides the ToggleGroupItem state.\n */\nexport const provideToggleGroupItemState = createStateProvider(NgpToggleGroupItemStateToken);\n\n/**\n * Injects the ToggleGroupItem state.\n */\nexport const injectToggleGroupItemState = createStateInjector<NgpToggleGroupItem>(\n NgpToggleGroupItemStateToken,\n);\n\n/**\n * The ToggleGroupItem state registration function.\n */\nexport const toggleGroupItemState = createState(NgpToggleGroupItemStateToken);\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { booleanAttribute, computed, Directive, input, OnInit } from '@angular/core';\nimport { NgpRovingFocusItem } from 'ng-primitives/roving-focus';\nimport { injectToggleGroupState } from '../toggle-group/toggle-group-state';\nimport { provideToggleGroupItemState, toggleGroupItemState } from './toggle-group-item-state';\n\n@Directive({\n selector: '[ngpToggleGroupItem]',\n exportAs: 'ngpToggleGroupItem',\n providers: [provideToggleGroupItemState()],\n hostDirectives: [\n {\n directive: NgpRovingFocusItem,\n inputs: ['ngpRovingFocusItemDisabled: ngpToggleGroupItemDisabled'],\n },\n ],\n host: {\n role: 'radio',\n '[attr.aria-checked]': 'selected()',\n '[attr.data-selected]': 'selected() ? \"\" : null',\n '[attr.aria-disabled]': 'state.disabled()',\n '[attr.data-disabled]': 'state.disabled() ? \"\" : null',\n '(click)': 'toggle()',\n },\n})\nexport class NgpToggleGroupItem implements OnInit {\n /**\n * Access the group that the item belongs to.\n */\n private readonly toggleGroup = injectToggleGroupState();\n\n /**\n * The value of the item.\n */\n readonly value = input<string>(undefined, {\n alias: 'ngpToggleGroupItemValue',\n });\n\n /**\n * Whether the item is disabled.\n */\n readonly disabled = input<boolean, BooleanInput>(false, {\n alias: 'ngpToggleGroupItemDisabled',\n transform: booleanAttribute,\n });\n\n /**\n * Whether the item is selected.\n */\n protected readonly selected = computed(() => this.toggleGroup().isSelected(this.state.value()!));\n\n /**\n * The state of the item.\n */\n protected readonly state = toggleGroupItemState<NgpToggleGroupItem>(this);\n\n ngOnInit(): void {\n // we can't use a required input for value as it is used in a computed property before the input is set\n if (this.state.value() === undefined) {\n throw new Error('The value input is required for the toggle group item.');\n }\n }\n\n /**\n * Toggle the item.\n */\n protected toggle(): void {\n if (this.state.disabled()) {\n return;\n }\n\n this.toggleGroup().toggle(this.state.value()!);\n }\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { booleanAttribute, Directive, input, output } from '@angular/core';\nimport { NgpOrientation } from 'ng-primitives/common';\nimport { syncState } from 'ng-primitives/internal';\nimport { injectRovingFocusGroupState, NgpRovingFocusGroup } from 'ng-primitives/roving-focus';\nimport { injectToggleGroupConfig } from '../config/toggle-group-config';\nimport { provideToggleGroupState, toggleGroupState } from './toggle-group-state';\n\n@Directive({\n selector: '[ngpToggleGroup]',\n exportAs: 'ngpToggleGroup',\n providers: [provideToggleGroupState()],\n hostDirectives: [NgpRovingFocusGroup],\n host: {\n role: 'group',\n '[attr.data-orientation]': 'state.orientation()',\n '[attr.data-type]': 'state.type()',\n '[attr.data-disabled]': 'state.disabled() ? \"\" : null',\n },\n})\nexport class NgpToggleGroup {\n /**\n * Access the roving focus group state.\n */\n private readonly rovingFocusGroupState = injectRovingFocusGroupState();\n\n /**\n * Access the global toggle group configuration.\n */\n private readonly config = injectToggleGroupConfig();\n\n /**\n * The orientation of the toggle group.\n */\n readonly orientation = input<NgpOrientation>(this.config.orientation, {\n alias: 'ngpToggleGroupOrientation',\n });\n\n /**\n * The type of the toggle group, whether only one item can be selected or multiple.\n */\n readonly type = input<'single' | 'multiple'>(this.config.type, { alias: 'ngpToggleGroupType' });\n\n /**\n * The selected value(s) of the toggle group.\n */\n readonly value = input<string[]>([], { alias: 'ngpToggleGroupValue' });\n\n /**\n * Emits when the value of the toggle group changes.\n */\n readonly valueChange = output<string[]>({ alias: 'ngpToggleGroupValueChange' });\n\n /**\n * Whether the toggle group is disabled.\n */\n readonly disabled = input<boolean, BooleanInput>(false, {\n alias: 'ngpToggleGroupDisabled',\n transform: booleanAttribute,\n });\n\n /**\n * The state of the toggle group.\n */\n protected readonly state = toggleGroupState<NgpToggleGroup>(this);\n\n constructor() {\n // the roving focus group defaults to vertical orientation whereas\n // the default for the toggle group may be different if provided via global config\n syncState(this.state.orientation, this.rovingFocusGroupState().orientation);\n }\n\n /**\n * Select a value in the toggle group.\n */\n private select(value: string): void {\n if (this.state.disabled()) {\n return;\n }\n\n if (this.state.type() === 'single') {\n this.state.value.set([value]);\n } else {\n this.state.value.set([...this.state.value(), value]);\n }\n\n this.valueChange.emit(this.state.value());\n }\n\n /**\n * De-select a value in the toggle group.\n */\n private deselect(value: string): void {\n if (this.state.disabled()) {\n return;\n }\n\n this.state.value.set(this.state.value().filter(v => v !== value));\n this.valueChange.emit(this.state.value());\n }\n\n /**\n * Check if a value is selected in the toggle group.\n * @internal\n */\n isSelected(value: string): boolean {\n return this.state.value()?.includes(value) ?? false;\n }\n\n /**\n * Toggle a value in the toggle group.\n * @internal\n */\n toggle(value: string): void {\n if (this.isSelected(value)) {\n this.deselect(value);\n } else {\n this.select(value);\n }\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ng-primitives-toggle-group.mjs","sources":["../../../../packages/ng-primitives/toggle-group/src/config/toggle-group-config.ts","../../../../packages/ng-primitives/toggle-group/src/toggle-group/toggle-group-state.ts","../../../../packages/ng-primitives/toggle-group/src/toggle-group-item/toggle-group-item-state.ts","../../../../packages/ng-primitives/toggle-group/src/toggle-group-item/toggle-group-item.ts","../../../../packages/ng-primitives/toggle-group/src/toggle-group/toggle-group.ts","../../../../packages/ng-primitives/toggle-group/src/ng-primitives-toggle-group.ts"],"sourcesContent":["import { InjectionToken, Provider, inject } from '@angular/core';\nimport { NgpOrientation } from 'ng-primitives/common';\n\nexport interface NgpToggleGroupConfig {\n /**\n * The orientation of the toggle group.\n * @default 'horizontal'\n */\n orientation: NgpOrientation;\n\n /**\n * The type of the toggle group, whether only one item can be selected or multiple.\n * @default 'single'\n */\n type: 'single' | 'multiple';\n\n /**\n * Whether a toggle button can be deselected.\n * @default true\n */\n allowDeselection: boolean;\n}\n\nexport const defaultToggleGroupConfig: NgpToggleGroupConfig = {\n orientation: 'horizontal',\n type: 'single',\n allowDeselection: true,\n};\n\nexport const NgpToggleGroupConfigToken = new InjectionToken<NgpToggleGroupConfig>(\n 'NgpToggleGroupConfigToken',\n);\n\n/**\n * Provide the default ToggleGroup configuration\n * @param config The ToggleGroup configuration\n * @returns The provider\n */\nexport function provideToggleGroupConfig(config: Partial<NgpToggleGroupConfig>): Provider[] {\n return [\n {\n provide: NgpToggleGroupConfigToken,\n useValue: { ...defaultToggleGroupConfig, ...config },\n },\n ];\n}\n\n/**\n * Inject the ToggleGroup configuration\n * @returns The global ToggleGroup configuration\n */\nexport function injectToggleGroupConfig(): NgpToggleGroupConfig {\n return inject(NgpToggleGroupConfigToken, { optional: true }) ?? defaultToggleGroupConfig;\n}\n","import {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpToggleGroup } from './toggle-group';\n\n/**\n * The state token for the ToggleGroup primitive.\n */\nexport const NgpToggleGroupStateToken = createStateToken<NgpToggleGroup>('ToggleGroup');\n\n/**\n * Provides the ToggleGroup state.\n */\nexport const provideToggleGroupState = createStateProvider(NgpToggleGroupStateToken);\n\n/**\n * Injects the ToggleGroup state.\n */\nexport const injectToggleGroupState = createStateInjector<NgpToggleGroup>(NgpToggleGroupStateToken);\n\n/**\n * The ToggleGroup state registration function.\n */\nexport const toggleGroupState = createState(NgpToggleGroupStateToken);\n","import {\n createState,\n createStateInjector,\n createStateProvider,\n createStateToken,\n} from 'ng-primitives/state';\nimport type { NgpToggleGroupItem } from './toggle-group-item';\n\n/**\n * The state token for the ToggleGroupItem primitive.\n */\nexport const NgpToggleGroupItemStateToken = createStateToken<NgpToggleGroupItem>('ToggleGroupItem');\n\n/**\n * Provides the ToggleGroupItem state.\n */\nexport const provideToggleGroupItemState = createStateProvider(NgpToggleGroupItemStateToken);\n\n/**\n * Injects the ToggleGroupItem state.\n */\nexport const injectToggleGroupItemState = createStateInjector<NgpToggleGroupItem>(\n NgpToggleGroupItemStateToken,\n);\n\n/**\n * The ToggleGroupItem state registration function.\n */\nexport const toggleGroupItemState = createState(NgpToggleGroupItemStateToken);\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { booleanAttribute, computed, Directive, input, OnInit } from '@angular/core';\nimport { NgpRovingFocusItem } from 'ng-primitives/roving-focus';\nimport { injectToggleGroupState } from '../toggle-group/toggle-group-state';\nimport { provideToggleGroupItemState, toggleGroupItemState } from './toggle-group-item-state';\n\n@Directive({\n selector: '[ngpToggleGroupItem]',\n exportAs: 'ngpToggleGroupItem',\n providers: [provideToggleGroupItemState()],\n hostDirectives: [\n {\n directive: NgpRovingFocusItem,\n inputs: ['ngpRovingFocusItemDisabled: ngpToggleGroupItemDisabled'],\n },\n ],\n host: {\n role: 'radio',\n '[attr.aria-checked]': 'selected()',\n '[attr.data-selected]': 'selected() ? \"\" : null',\n '[attr.aria-disabled]': 'state.disabled()',\n '[attr.data-disabled]': 'state.disabled() ? \"\" : null',\n '(click)': 'toggle()',\n },\n})\nexport class NgpToggleGroupItem implements OnInit {\n /**\n * Access the group that the item belongs to.\n */\n private readonly toggleGroup = injectToggleGroupState();\n\n /**\n * The value of the item.\n */\n readonly value = input<string>(undefined, {\n alias: 'ngpToggleGroupItemValue',\n });\n\n /**\n * Whether the item is disabled.\n */\n readonly disabled = input<boolean, BooleanInput>(false, {\n alias: 'ngpToggleGroupItemDisabled',\n transform: booleanAttribute,\n });\n\n /**\n * Whether the item is selected.\n */\n protected readonly selected = computed(() => this.toggleGroup().isSelected(this.state.value()!));\n\n /**\n * The state of the item.\n */\n protected readonly state = toggleGroupItemState<NgpToggleGroupItem>(this);\n\n ngOnInit(): void {\n // we can't use a required input for value as it is used in a computed property before the input is set\n if (this.state.value() === undefined) {\n throw new Error('The value input is required for the toggle group item.');\n }\n }\n\n /**\n * Toggle the item.\n */\n protected toggle(): void {\n if (this.state.disabled()) {\n return;\n }\n\n this.toggleGroup().toggle(this.state.value()!);\n }\n}\n","import { BooleanInput } from '@angular/cdk/coercion';\nimport { booleanAttribute, Directive, input, output } from '@angular/core';\nimport { NgpOrientation } from 'ng-primitives/common';\nimport { syncState } from 'ng-primitives/internal';\nimport { injectRovingFocusGroupState, NgpRovingFocusGroup } from 'ng-primitives/roving-focus';\nimport { injectToggleGroupConfig } from '../config/toggle-group-config';\nimport { provideToggleGroupState, toggleGroupState } from './toggle-group-state';\n\n@Directive({\n selector: '[ngpToggleGroup]',\n exportAs: 'ngpToggleGroup',\n providers: [provideToggleGroupState()],\n hostDirectives: [NgpRovingFocusGroup],\n host: {\n role: 'group',\n '[attr.data-orientation]': 'state.orientation()',\n '[attr.data-type]': 'state.type()',\n '[attr.data-disabled]': 'state.disabled() ? \"\" : null',\n },\n})\nexport class NgpToggleGroup {\n /**\n * Access the roving focus group state.\n */\n private readonly rovingFocusGroupState = injectRovingFocusGroupState();\n\n /**\n * Access the global toggle group configuration.\n */\n private readonly config = injectToggleGroupConfig();\n\n /**\n * The orientation of the toggle group.\n */\n readonly orientation = input<NgpOrientation>(this.config.orientation, {\n alias: 'ngpToggleGroupOrientation',\n });\n\n /**\n * Whether toggle buttons can be deselected. If set to `false`, clicking a selected toggle button will not deselect it.\n * @default true\n */\n readonly allowDeselection = input<boolean, BooleanInput>(this.config.allowDeselection, {\n alias: 'ngpToggleGroupAllowDeselection',\n transform: booleanAttribute,\n });\n\n /**\n * The type of the toggle group, whether only one item can be selected or multiple.\n */\n readonly type = input<'single' | 'multiple'>(this.config.type, { alias: 'ngpToggleGroupType' });\n\n /**\n * The selected value(s) of the toggle group.\n */\n readonly value = input<string[]>([], { alias: 'ngpToggleGroupValue' });\n\n /**\n * Emits when the value of the toggle group changes.\n */\n readonly valueChange = output<string[]>({ alias: 'ngpToggleGroupValueChange' });\n\n /**\n * Whether the toggle group is disabled.\n */\n readonly disabled = input<boolean, BooleanInput>(false, {\n alias: 'ngpToggleGroupDisabled',\n transform: booleanAttribute,\n });\n\n /**\n * The state of the toggle group.\n */\n protected readonly state = toggleGroupState<NgpToggleGroup>(this);\n\n constructor() {\n // the roving focus group defaults to vertical orientation whereas\n // the default for the toggle group may be different if provided via global config\n syncState(this.state.orientation, this.rovingFocusGroupState().orientation);\n }\n\n /**\n * Select a value in the toggle group.\n */\n private select(value: string): void {\n if (this.state.disabled()) {\n return;\n }\n\n let newValue: string[] = [];\n\n if (this.state.type() === 'single') {\n newValue = [value];\n } else {\n newValue = [...this.state.value(), value];\n }\n\n this.state.value.set(newValue);\n this.valueChange.emit(newValue);\n }\n\n /**\n * De-select a value in the toggle group.\n */\n private deselect(value: string): void {\n if (this.state.disabled() || !this.state.allowDeselection()) {\n return;\n }\n\n const newValue = this.state.value().filter(v => v !== value);\n this.state.value.set(newValue);\n this.valueChange.emit(newValue);\n }\n\n /**\n * Check if a value is selected in the toggle group.\n * @internal\n */\n isSelected(value: string): boolean {\n return this.state.value()?.includes(value) ?? false;\n }\n\n /**\n * Toggle a value in the toggle group.\n * @internal\n */\n toggle(value: string): void {\n if (this.isSelected(value)) {\n this.deselect(value);\n } else {\n this.select(value);\n }\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -67,8 +67,9 @@ class NgpToggle {
|
|
|
67
67
|
if (this.state.disabled()) {
|
|
68
68
|
return;
|
|
69
69
|
}
|
|
70
|
-
|
|
71
|
-
this.
|
|
70
|
+
const isSelected = !this.state.selected();
|
|
71
|
+
this.state.selected.set(isSelected);
|
|
72
|
+
this.selectedChange.emit(isSelected);
|
|
72
73
|
}
|
|
73
74
|
/**
|
|
74
75
|
* If the element is not a button or a link the space key should toggle the selected state.
|