@radix-ng/primitives 0.4.0 → 0.6.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.
Files changed (181) hide show
  1. package/alert-dialog/README.md +1 -0
  2. package/alert-dialog/index.d.ts +6 -0
  3. package/alert-dialog/src/alert-dialog-cancel.directive.d.ts +7 -0
  4. package/alert-dialog/src/alert-dialog-content.directive.d.ts +8 -0
  5. package/alert-dialog/src/alert-dialog-root.directive.d.ts +9 -0
  6. package/alert-dialog/src/alert-dialog-title.directive.d.ts +5 -0
  7. package/alert-dialog/src/alert-dialog-trigger.directive.d.ts +7 -0
  8. package/alert-dialog/src/alert-dialog.service.d.ts +14 -0
  9. package/avatar/index.d.ts +3 -1
  10. package/avatar/src/avatar-fallback.directive.d.ts +10 -17
  11. package/avatar/src/avatar-image.directive.d.ts +10 -11
  12. package/avatar/src/avatar-root.directive.d.ts +21 -0
  13. package/avatar/src/avatar.config.d.ts +3 -2
  14. package/checkbox/src/checkbox.directive.d.ts +2 -1
  15. package/collapsible/README.md +1 -0
  16. package/collapsible/index.d.ts +3 -0
  17. package/collapsible/src/collapsible-content.directive.d.ts +11 -0
  18. package/collapsible/src/collapsible-root.directive.d.ts +52 -0
  19. package/collapsible/src/collapsible-trigger.directive.d.ts +26 -0
  20. package/esm2022/alert-dialog/index.mjs +7 -0
  21. package/esm2022/alert-dialog/radix-ng-primitives-alert-dialog.mjs +5 -0
  22. package/esm2022/alert-dialog/src/alert-dialog-cancel.directive.mjs +24 -0
  23. package/esm2022/alert-dialog/src/alert-dialog-content.directive.mjs +26 -0
  24. package/esm2022/alert-dialog/src/alert-dialog-root.directive.mjs +24 -0
  25. package/esm2022/alert-dialog/src/alert-dialog-title.directive.mjs +14 -0
  26. package/esm2022/alert-dialog/src/alert-dialog-trigger.directive.mjs +24 -0
  27. package/esm2022/alert-dialog/src/alert-dialog.service.mjs +45 -0
  28. package/esm2022/avatar/index.mjs +2 -2
  29. package/esm2022/avatar/src/avatar-fallback.directive.mjs +23 -30
  30. package/esm2022/avatar/src/avatar-image.directive.mjs +29 -31
  31. package/esm2022/avatar/src/avatar-root.directive.mjs +38 -0
  32. package/esm2022/avatar/src/avatar.config.mjs +2 -2
  33. package/esm2022/checkbox/src/checkbox-indicator.directive.mjs +4 -4
  34. package/esm2022/checkbox/src/checkbox.directive.mjs +4 -4
  35. package/esm2022/collapsible/index.mjs +4 -0
  36. package/esm2022/collapsible/radix-ng-primitives-collapsible.mjs +5 -0
  37. package/esm2022/collapsible/src/collapsible-content.directive.mjs +26 -0
  38. package/esm2022/collapsible/src/collapsible-root.directive.mjs +114 -0
  39. package/esm2022/collapsible/src/collapsible-trigger.directive.mjs +49 -0
  40. package/esm2022/label/index.mjs +2 -2
  41. package/esm2022/label/src/label-root.directive.mjs +48 -0
  42. package/esm2022/progress/index.mjs +2 -2
  43. package/esm2022/progress/src/progress-indicator.directive.mjs +11 -10
  44. package/esm2022/progress/src/progress-root.directive.mjs +71 -0
  45. package/esm2022/radio/index.mjs +2 -4
  46. package/esm2022/radio/src/radio-indicator.directive.mjs +8 -13
  47. package/esm2022/radio/src/radio-item.directive.mjs +27 -42
  48. package/esm2022/radio/src/radio-root.directive.mjs +106 -0
  49. package/esm2022/roving-focus/index.mjs +1 -3
  50. package/esm2022/roving-focus/src/roving-focus-group.directive.mjs +12 -18
  51. package/esm2022/roving-focus/src/roving-focus-item.directive.mjs +21 -26
  52. package/esm2022/separator/src/separator.directive.mjs +12 -17
  53. package/esm2022/switch/index.mjs +2 -3
  54. package/esm2022/switch/src/switch-root.directive.mjs +74 -0
  55. package/esm2022/switch/src/switch-thumb.directive.mjs +10 -12
  56. package/esm2022/toggle/index.mjs +2 -2
  57. package/esm2022/toggle/src/toggle-root.directive.mjs +51 -0
  58. package/esm2022/toggle-group/index.mjs +6 -0
  59. package/esm2022/toggle-group/radix-ng-primitives-toggle-group.mjs +5 -0
  60. package/esm2022/toggle-group/src/toggle-group-button.directive.mjs +79 -0
  61. package/esm2022/toggle-group/src/toggle-group-button.token.mjs +6 -0
  62. package/esm2022/toggle-group/src/toggle-group-multi.directive.mjs +159 -0
  63. package/esm2022/toggle-group/src/toggle-group.directive.mjs +157 -0
  64. package/esm2022/toggle-group/src/toggle-group.token.mjs +6 -0
  65. package/fesm2022/radix-ng-primitives-alert-dialog.mjs +150 -0
  66. package/fesm2022/radix-ng-primitives-alert-dialog.mjs.map +1 -0
  67. package/fesm2022/radix-ng-primitives-avatar.mjs +79 -90
  68. package/fesm2022/radix-ng-primitives-avatar.mjs.map +1 -1
  69. package/fesm2022/radix-ng-primitives-checkbox.mjs +6 -6
  70. package/fesm2022/radix-ng-primitives-checkbox.mjs.map +1 -1
  71. package/fesm2022/radix-ng-primitives-collapsible.mjs +190 -0
  72. package/fesm2022/radix-ng-primitives-collapsible.mjs.map +1 -0
  73. package/fesm2022/radix-ng-primitives-label.mjs +20 -18
  74. package/fesm2022/radix-ng-primitives-label.mjs.map +1 -1
  75. package/fesm2022/radix-ng-primitives-progress.mjs +55 -49
  76. package/fesm2022/radix-ng-primitives-progress.mjs.map +1 -1
  77. package/fesm2022/radix-ng-primitives-radio.mjs +70 -100
  78. package/fesm2022/radix-ng-primitives-radio.mjs.map +1 -1
  79. package/fesm2022/radix-ng-primitives-roving-focus.mjs +22 -44
  80. package/fesm2022/radix-ng-primitives-roving-focus.mjs.map +1 -1
  81. package/fesm2022/radix-ng-primitives-separator.mjs +12 -17
  82. package/fesm2022/radix-ng-primitives-separator.mjs.map +1 -1
  83. package/fesm2022/radix-ng-primitives-switch.mjs +49 -106
  84. package/fesm2022/radix-ng-primitives-switch.mjs.map +1 -1
  85. package/fesm2022/radix-ng-primitives-toggle-group.mjs +397 -0
  86. package/fesm2022/radix-ng-primitives-toggle-group.mjs.map +1 -0
  87. package/fesm2022/radix-ng-primitives-toggle.mjs +15 -29
  88. package/fesm2022/radix-ng-primitives-toggle.mjs.map +1 -1
  89. package/label/index.d.ts +1 -1
  90. package/label/src/label-root.directive.d.ts +13 -0
  91. package/package.json +18 -19
  92. package/progress/index.d.ts +2 -1
  93. package/progress/src/progress-indicator.directive.d.ts +2 -2
  94. package/progress/src/progress-root.directive.d.ts +29 -0
  95. package/radio/index.d.ts +1 -3
  96. package/radio/src/radio-indicator.directive.d.ts +3 -9
  97. package/radio/src/radio-item.directive.d.ts +9 -28
  98. package/radio/src/{radio-group.directive.d.ts → radio-root.directive.d.ts} +24 -16
  99. package/roving-focus/index.d.ts +0 -2
  100. package/roving-focus/src/roving-focus-group.directive.d.ts +5 -7
  101. package/roving-focus/src/roving-focus-item.directive.d.ts +6 -8
  102. package/separator/src/separator.directive.d.ts +14 -8
  103. package/switch/index.d.ts +2 -2
  104. package/switch/src/switch-root.directive.d.ts +35 -0
  105. package/switch/src/switch-thumb.directive.d.ts +2 -5
  106. package/toggle/index.d.ts +2 -1
  107. package/toggle/src/toggle-root.directive.d.ts +32 -0
  108. package/toggle-group/README.md +3 -0
  109. package/toggle-group/index.d.ts +5 -0
  110. package/toggle-group/src/toggle-group-button.directive.d.ts +39 -0
  111. package/toggle-group/src/toggle-group-button.token.d.ts +4 -0
  112. package/toggle-group/src/toggle-group-multi.directive.d.ts +90 -0
  113. package/toggle-group/src/toggle-group.directive.d.ts +90 -0
  114. package/toggle-group/src/toggle-group.token.d.ts +5 -0
  115. package/avatar/src/avatar.directive.d.ts +0 -22
  116. package/avatar/src/avatar.token.d.ts +0 -4
  117. package/esm2022/avatar/src/avatar.directive.mjs +0 -38
  118. package/esm2022/avatar/src/avatar.token.mjs +0 -6
  119. package/esm2022/label/src/label.directive.mjs +0 -46
  120. package/esm2022/overlay/index.mjs +0 -5
  121. package/esm2022/overlay/radix-ng-primitives-overlay.mjs +0 -5
  122. package/esm2022/overlay/src/overlay-arrow.directive.mjs +0 -59
  123. package/esm2022/overlay/src/overlay-arrow.token.mjs +0 -3
  124. package/esm2022/overlay/src/overlay-trigger.directive.mjs +0 -279
  125. package/esm2022/overlay/src/overlay-trigger.token.mjs +0 -9
  126. package/esm2022/overlay/src/overlay.directive.mjs +0 -51
  127. package/esm2022/overlay/src/overlay.token.mjs +0 -3
  128. package/esm2022/progress/src/progress.directive.mjs +0 -62
  129. package/esm2022/progress/src/progress.token.mjs +0 -6
  130. package/esm2022/radio/src/radio-group.directive.mjs +0 -108
  131. package/esm2022/radio/src/radio-group.token.mjs +0 -6
  132. package/esm2022/radio/src/radio-item.token.mjs +0 -6
  133. package/esm2022/roving-focus/src/roving-focus-group.token.mjs +0 -9
  134. package/esm2022/roving-focus/src/roving-focus-item.token.mjs +0 -6
  135. package/esm2022/switch/src/switch.directive.mjs +0 -125
  136. package/esm2022/switch/src/switch.token.mjs +0 -6
  137. package/esm2022/toggle/src/toggle.directive.mjs +0 -65
  138. package/esm2022/tooltip/index.mjs +0 -5
  139. package/esm2022/tooltip/radix-ng-primitives-tooltip.mjs +0 -5
  140. package/esm2022/tooltip/src/tooltip-arrow.directive.mjs +0 -17
  141. package/esm2022/tooltip/src/tooltip-trigger.directive.mjs +0 -148
  142. package/esm2022/tooltip/src/tooltip-trigger.token.mjs +0 -6
  143. package/esm2022/tooltip/src/tooltip.config.mjs +0 -31
  144. package/esm2022/tooltip/src/tooltip.directive.mjs +0 -46
  145. package/esm2022/visually-hidden/index.mjs +0 -2
  146. package/esm2022/visually-hidden/radix-ng-primitives-visually-hidden.mjs +0 -5
  147. package/esm2022/visually-hidden/src/visually-hidden.directive.mjs +0 -42
  148. package/fesm2022/radix-ng-primitives-overlay.mjs +0 -399
  149. package/fesm2022/radix-ng-primitives-overlay.mjs.map +0 -1
  150. package/fesm2022/radix-ng-primitives-tooltip.mjs +0 -242
  151. package/fesm2022/radix-ng-primitives-tooltip.mjs.map +0 -1
  152. package/fesm2022/radix-ng-primitives-visually-hidden.mjs +0 -49
  153. package/fesm2022/radix-ng-primitives-visually-hidden.mjs.map +0 -1
  154. package/label/src/label.directive.d.ts +0 -14
  155. package/overlay/README.md +0 -1
  156. package/overlay/index.d.ts +0 -4
  157. package/overlay/src/overlay-arrow.directive.d.ts +0 -29
  158. package/overlay/src/overlay-arrow.token.d.ts +0 -3
  159. package/overlay/src/overlay-trigger.directive.d.ts +0 -163
  160. package/overlay/src/overlay-trigger.token.d.ts +0 -7
  161. package/overlay/src/overlay.directive.d.ts +0 -29
  162. package/overlay/src/overlay.token.d.ts +0 -3
  163. package/progress/src/progress.directive.d.ts +0 -26
  164. package/progress/src/progress.token.d.ts +0 -4
  165. package/radio/src/radio-group.token.d.ts +0 -4
  166. package/radio/src/radio-item.token.d.ts +0 -4
  167. package/roving-focus/src/roving-focus-group.token.d.ts +0 -7
  168. package/roving-focus/src/roving-focus-item.token.d.ts +0 -4
  169. package/switch/src/switch.directive.d.ts +0 -73
  170. package/switch/src/switch.token.d.ts +0 -4
  171. package/toggle/src/toggle.directive.d.ts +0 -30
  172. package/tooltip/README.md +0 -1
  173. package/tooltip/index.d.ts +0 -4
  174. package/tooltip/src/tooltip-arrow.directive.d.ts +0 -6
  175. package/tooltip/src/tooltip-trigger.directive.d.ts +0 -79
  176. package/tooltip/src/tooltip-trigger.token.d.ts +0 -4
  177. package/tooltip/src/tooltip.config.d.ts +0 -46
  178. package/tooltip/src/tooltip.directive.d.ts +0 -17
  179. package/visually-hidden/README.md +0 -3
  180. package/visually-hidden/index.d.ts +0 -1
  181. package/visually-hidden/src/visually-hidden.directive.d.ts +0 -11
@@ -0,0 +1,397 @@
1
+ import * as i0 from '@angular/core';
2
+ import { InjectionToken, inject, booleanAttribute, Directive, Input, HostListener, EventEmitter, ContentChildren } from '@angular/core';
3
+ import * as i1 from '@radix-ng/primitives/roving-focus';
4
+ import { injectRovingFocusItem, RdxRovingFocusItemDirective, injectRovingFocusGroup, RdxRovingFocusGroupDirective } from '@radix-ng/primitives/roving-focus';
5
+ import { NG_VALUE_ACCESSOR } from '@angular/forms';
6
+
7
+ const RdxToggleGroupButtonToken = new InjectionToken('RdxToggleGroupButtonToken');
8
+ function injectToggleGroupButton() {
9
+ return inject(RdxToggleGroupButtonToken);
10
+ }
11
+
12
+ const RdxToggleGroupToken = new InjectionToken('RdxToggleGroupToken');
13
+ function injectToggleGroup() {
14
+ return inject(RdxToggleGroupToken);
15
+ }
16
+
17
+ class RdxToggleGroupButtonDirective {
18
+ constructor() {
19
+ /**
20
+ * Access the toggle group.
21
+ */
22
+ this.toggleGroup = injectToggleGroup();
23
+ /**
24
+ * Access the roving focus item.
25
+ */
26
+ this.rovingFocusItem = injectRovingFocusItem();
27
+ /**
28
+ * Whether this toggle button is disabled.
29
+ * @default false
30
+ */
31
+ this.disabled = false;
32
+ }
33
+ /**
34
+ * Whether this toggle button is checked.
35
+ */
36
+ get checked() {
37
+ return this.toggleGroup.isSelected(this.value);
38
+ }
39
+ ngOnChanges(changes) {
40
+ if ('disabled' in changes) {
41
+ this.updateDisabled();
42
+ }
43
+ }
44
+ /**
45
+ * Toggle this toggle button.
46
+ */
47
+ toggle() {
48
+ if (this.disabled) {
49
+ return;
50
+ }
51
+ this.toggleGroup.toggle(this.value);
52
+ }
53
+ /**
54
+ * Ensure the disabled state is propagated to the roving focus item.
55
+ * @internal
56
+ */
57
+ updateDisabled() {
58
+ this.rovingFocusItem.disabled = this.disabled || this.toggleGroup.disabled;
59
+ }
60
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: RdxToggleGroupButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
61
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.3.11", type: RdxToggleGroupButtonDirective, isStandalone: true, selector: "button[rdxToggleGroupButton]", inputs: { value: ["rdxToggleGroupButtonValue", "value"], disabled: ["rdxToggleGroupButtonDisabled", "disabled", booleanAttribute] }, host: { attributes: { "role": "radio" }, listeners: { "click": "toggle()" }, properties: { "attr.aria-checked": "checked", "attr.aria-disabled": "disabled || toggleGroup.disabled", "attr.data-disabled": "disabled || toggleGroup.disabled", "attr.data-state": "checked ? \"on\" : \"off\"", "attr.data-orientation": "toggleGroup.orientation" } }, providers: [{ provide: RdxToggleGroupButtonToken, useExisting: RdxToggleGroupButtonDirective }], usesOnChanges: true, hostDirectives: [{ directive: i1.RdxRovingFocusItemDirective }], ngImport: i0 }); }
62
+ }
63
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: RdxToggleGroupButtonDirective, decorators: [{
64
+ type: Directive,
65
+ args: [{
66
+ selector: 'button[rdxToggleGroupButton]',
67
+ standalone: true,
68
+ hostDirectives: [RdxRovingFocusItemDirective],
69
+ providers: [{ provide: RdxToggleGroupButtonToken, useExisting: RdxToggleGroupButtonDirective }],
70
+ host: {
71
+ role: 'radio',
72
+ '[attr.aria-checked]': 'checked',
73
+ '[attr.aria-disabled]': 'disabled || toggleGroup.disabled',
74
+ '[attr.data-disabled]': 'disabled || toggleGroup.disabled',
75
+ '[attr.data-state]': 'checked ? "on" : "off"',
76
+ '[attr.data-orientation]': 'toggleGroup.orientation'
77
+ }
78
+ }]
79
+ }], propDecorators: { value: [{
80
+ type: Input,
81
+ args: [{ alias: 'rdxToggleGroupButtonValue', required: true }]
82
+ }], disabled: [{
83
+ type: Input,
84
+ args: [{ alias: 'rdxToggleGroupButtonDisabled', transform: booleanAttribute }]
85
+ }], toggle: [{
86
+ type: HostListener,
87
+ args: ['click']
88
+ }] } });
89
+
90
+ class RdxToggleGroupMultiDirective {
91
+ constructor() {
92
+ /**
93
+ * Access the roving focus group
94
+ */
95
+ this.rovingFocusGroup = injectRovingFocusGroup();
96
+ /**
97
+ * The selected toggle button.
98
+ */
99
+ this.value = [];
100
+ /**
101
+ * The orientation of the toggle group.
102
+ * @default 'horizontal'
103
+ */
104
+ this.orientation = 'horizontal';
105
+ /**
106
+ * Whether the toggle group is disabled.
107
+ * @default false
108
+ */
109
+ this.disabled = false;
110
+ /**
111
+ * Whether the toggle group roving focus should wrap.
112
+ * @default true
113
+ */
114
+ this.wrap = true;
115
+ /**
116
+ * Event emitted when the selected toggle button changes.
117
+ */
118
+ this.valueChange = new EventEmitter();
119
+ }
120
+ ngOnInit() {
121
+ // the toggle button group has a default orientation of horizontal
122
+ // whereas the roving focus group has a default orientation of vertical
123
+ // if the toggle button group input is not defined, the orientation will not be set
124
+ // in the roving focus group and the default vertical orientation will be used.
125
+ // we must initially set the orientation of the roving focus group to match the toggle button group orientation
126
+ this.rovingFocusGroup.setOrientation(this.orientation);
127
+ }
128
+ ngOnChanges(changes) {
129
+ if ('disabled' in changes) {
130
+ this.buttons?.forEach((button) => button.updateDisabled());
131
+ }
132
+ }
133
+ ngAfterContentInit() {
134
+ if (this.disabled) {
135
+ this.buttons?.forEach((button) => button.updateDisabled());
136
+ }
137
+ }
138
+ /**
139
+ * Determine if a value is selected.
140
+ * @param value The value to check.
141
+ * @returns Whether the value is selected.
142
+ * @internal
143
+ */
144
+ isSelected(value) {
145
+ return this.value.includes(value);
146
+ }
147
+ /**
148
+ * Toggle a value.
149
+ * @param value The value to toggle.
150
+ * @internal
151
+ */
152
+ toggle(value) {
153
+ if (this.disabled) {
154
+ return;
155
+ }
156
+ this.value = this.value.includes(value)
157
+ ? this.value.filter((v) => v !== value)
158
+ : [...this.value, value];
159
+ this.valueChange.emit(this.value);
160
+ this.onChange?.(this.value);
161
+ }
162
+ /**
163
+ * Select a value from Angular forms.
164
+ * @param value The value to select.
165
+ * @internal
166
+ */
167
+ writeValue(value) {
168
+ this.value = value;
169
+ }
170
+ /**
171
+ * Register a callback to be called when the value changes.
172
+ * @param fn The callback to register.
173
+ * @internal
174
+ */
175
+ registerOnChange(fn) {
176
+ this.onChange = fn;
177
+ }
178
+ /**
179
+ * Register a callback to be called when the toggle group is touched.
180
+ * @param fn The callback to register.
181
+ * @internal
182
+ */
183
+ registerOnTouched(fn) {
184
+ this.onTouched = fn;
185
+ }
186
+ /**
187
+ * Set the disabled state of the toggle group.
188
+ * @param isDisabled Whether the toggle group is disabled.
189
+ * @internal
190
+ */
191
+ setDisabledState(isDisabled) {
192
+ this.disabled = isDisabled;
193
+ this.buttons?.forEach((button) => button.updateDisabled());
194
+ }
195
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: RdxToggleGroupMultiDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
196
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.3.11", type: RdxToggleGroupMultiDirective, isStandalone: true, selector: "[rdxToggleGroupMulti]", inputs: { value: ["rdxToggleGroupMultiValue", "value"], orientation: ["rdxToggleGroupMultiOrientation", "orientation"], disabled: ["rdxToggleGroupMultiDisabled", "disabled", booleanAttribute], wrap: ["rdxToggleGroupMultiWrap", "wrap", booleanAttribute], valueChange: ["rdxToggleGroupMultiValueChange", "valueChange"] }, host: { attributes: { "role": "group" }, listeners: { "focusout": "onTouched?.()" }, properties: { "attr.data-orientation": "orientation" } }, providers: [
197
+ { provide: RdxToggleGroupToken, useExisting: RdxToggleGroupMultiDirective },
198
+ { provide: NG_VALUE_ACCESSOR, useExisting: RdxToggleGroupMultiDirective, multi: true }
199
+ ], queries: [{ propertyName: "buttons", predicate: RdxToggleGroupButtonToken }], usesOnChanges: true, hostDirectives: [{ directive: i1.RdxRovingFocusGroupDirective, inputs: ["rdxRovingFocusGroupWrap", "wrap", "rdxRovingFocusGroupOrientation", "orientation"] }], ngImport: i0 }); }
200
+ }
201
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: RdxToggleGroupMultiDirective, decorators: [{
202
+ type: Directive,
203
+ args: [{
204
+ selector: '[rdxToggleGroupMulti]',
205
+ standalone: true,
206
+ hostDirectives: [
207
+ {
208
+ directive: RdxRovingFocusGroupDirective,
209
+ inputs: ['rdxRovingFocusGroupWrap:wrap', 'rdxRovingFocusGroupOrientation:orientation']
210
+ }
211
+ ],
212
+ providers: [
213
+ { provide: RdxToggleGroupToken, useExisting: RdxToggleGroupMultiDirective },
214
+ { provide: NG_VALUE_ACCESSOR, useExisting: RdxToggleGroupMultiDirective, multi: true }
215
+ ],
216
+ host: {
217
+ role: 'group',
218
+ '[attr.data-orientation]': 'orientation',
219
+ '(focusout)': 'onTouched?.()'
220
+ }
221
+ }]
222
+ }], propDecorators: { value: [{
223
+ type: Input,
224
+ args: ['rdxToggleGroupMultiValue']
225
+ }], orientation: [{
226
+ type: Input,
227
+ args: ['rdxToggleGroupMultiOrientation']
228
+ }], disabled: [{
229
+ type: Input,
230
+ args: [{ alias: 'rdxToggleGroupMultiDisabled', transform: booleanAttribute }]
231
+ }], wrap: [{
232
+ type: Input,
233
+ args: [{ alias: 'rdxToggleGroupMultiWrap', transform: booleanAttribute }]
234
+ }], valueChange: [{
235
+ type: Input,
236
+ args: ['rdxToggleGroupMultiValueChange']
237
+ }], buttons: [{
238
+ type: ContentChildren,
239
+ args: [RdxToggleGroupButtonToken]
240
+ }] } });
241
+
242
+ class RdxToggleGroupDirective {
243
+ constructor() {
244
+ /**
245
+ * Access the roving focus group
246
+ */
247
+ this.rovingFocusGroup = injectRovingFocusGroup();
248
+ /**
249
+ * The selected toggle button.
250
+ */
251
+ this.value = null;
252
+ /**
253
+ * The orientation of the toggle group.
254
+ * @default 'horizontal'
255
+ */
256
+ this.orientation = 'horizontal';
257
+ /**
258
+ * Whether the toggle group is disabled.
259
+ * @default false
260
+ */
261
+ this.disabled = false;
262
+ /**
263
+ * Whether the toggle group roving focus should wrap.
264
+ * @default true
265
+ */
266
+ this.wrap = true;
267
+ /**
268
+ * Event emitted when the selected toggle button changes.
269
+ */
270
+ this.valueChange = new EventEmitter();
271
+ }
272
+ ngOnInit() {
273
+ // the toggle button group has a default orientation of horizontal
274
+ // whereas the roving focus group has a default orientation of vertical
275
+ // if the toggle button group input is not defined, the orientation will not be set
276
+ // in the roving focus group and the default vertical orientation will be used.
277
+ // we must initially set the orientation of the roving focus group to match the toggle button group orientation
278
+ this.rovingFocusGroup.setOrientation(this.orientation);
279
+ }
280
+ ngOnChanges(changes) {
281
+ if ('disabled' in changes) {
282
+ this.buttons?.forEach((button) => button.updateDisabled());
283
+ }
284
+ }
285
+ ngAfterContentInit() {
286
+ if (this.disabled) {
287
+ this.buttons?.forEach((button) => button.updateDisabled());
288
+ }
289
+ }
290
+ /**
291
+ * Determine if a value is selected.
292
+ * @param value The value to check.
293
+ * @returns Whether the value is selected.
294
+ * @internal
295
+ */
296
+ isSelected(value) {
297
+ return this.value === value;
298
+ }
299
+ /**
300
+ * Toggle a value.
301
+ * @param value The value to toggle.
302
+ * @internal
303
+ */
304
+ toggle(value) {
305
+ if (this.disabled) {
306
+ return;
307
+ }
308
+ this.value = this.value === value ? null : value;
309
+ this.valueChange.emit(this.value);
310
+ this.onChange?.(this.value);
311
+ }
312
+ /**
313
+ * Select a value from Angular forms.
314
+ * @param value The value to select.
315
+ * @internal
316
+ */
317
+ writeValue(value) {
318
+ this.value = value;
319
+ }
320
+ /**
321
+ * Register a callback to be called when the value changes.
322
+ * @param fn The callback to register.
323
+ * @internal
324
+ */
325
+ registerOnChange(fn) {
326
+ this.onChange = fn;
327
+ }
328
+ /**
329
+ * Register a callback to be called when the toggle group is touched.
330
+ * @param fn The callback to register.
331
+ * @internal
332
+ */
333
+ registerOnTouched(fn) {
334
+ this.onTouched = fn;
335
+ }
336
+ /**
337
+ * Set the disabled state of the toggle group.
338
+ * @param isDisabled Whether the toggle group is disabled.
339
+ * @internal
340
+ */
341
+ setDisabledState(isDisabled) {
342
+ this.disabled = isDisabled;
343
+ this.buttons?.forEach((button) => button.updateDisabled());
344
+ }
345
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: RdxToggleGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
346
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.3.11", type: RdxToggleGroupDirective, isStandalone: true, selector: "[rdxToggleGroup]", inputs: { value: ["rdxToggleGroupValue", "value"], orientation: ["rdxToggleGroupOrientation", "orientation"], disabled: ["rdxToggleGroupDisabled", "disabled", booleanAttribute], wrap: ["rdxToggleGroupWrap", "wrap", booleanAttribute], valueChange: ["rdxToggleGroupValueChange", "valueChange"] }, host: { attributes: { "role": "group" }, listeners: { "focusout": "onTouched?.()" }, properties: { "attr.data-orientation": "orientation" } }, providers: [
347
+ { provide: RdxToggleGroupToken, useExisting: RdxToggleGroupDirective },
348
+ { provide: NG_VALUE_ACCESSOR, useExisting: RdxToggleGroupDirective, multi: true }
349
+ ], queries: [{ propertyName: "buttons", predicate: RdxToggleGroupButtonToken }], usesOnChanges: true, hostDirectives: [{ directive: i1.RdxRovingFocusGroupDirective, inputs: ["rdxRovingFocusGroupWrap", "wrap", "rdxRovingFocusGroupOrientation", "orientation"] }], ngImport: i0 }); }
350
+ }
351
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: RdxToggleGroupDirective, decorators: [{
352
+ type: Directive,
353
+ args: [{
354
+ selector: '[rdxToggleGroup]',
355
+ standalone: true,
356
+ hostDirectives: [
357
+ {
358
+ directive: RdxRovingFocusGroupDirective,
359
+ inputs: ['rdxRovingFocusGroupWrap:wrap', 'rdxRovingFocusGroupOrientation:orientation']
360
+ }
361
+ ],
362
+ providers: [
363
+ { provide: RdxToggleGroupToken, useExisting: RdxToggleGroupDirective },
364
+ { provide: NG_VALUE_ACCESSOR, useExisting: RdxToggleGroupDirective, multi: true }
365
+ ],
366
+ host: {
367
+ role: 'group',
368
+ '[attr.data-orientation]': 'orientation',
369
+ '(focusout)': 'onTouched?.()'
370
+ }
371
+ }]
372
+ }], propDecorators: { value: [{
373
+ type: Input,
374
+ args: ['rdxToggleGroupValue']
375
+ }], orientation: [{
376
+ type: Input,
377
+ args: ['rdxToggleGroupOrientation']
378
+ }], disabled: [{
379
+ type: Input,
380
+ args: [{ alias: 'rdxToggleGroupDisabled', transform: booleanAttribute }]
381
+ }], wrap: [{
382
+ type: Input,
383
+ args: [{ alias: 'rdxToggleGroupWrap', transform: booleanAttribute }]
384
+ }], valueChange: [{
385
+ type: Input,
386
+ args: ['rdxToggleGroupValueChange']
387
+ }], buttons: [{
388
+ type: ContentChildren,
389
+ args: [RdxToggleGroupButtonToken]
390
+ }] } });
391
+
392
+ /**
393
+ * Generated bundle index. Do not edit.
394
+ */
395
+
396
+ export { RdxToggleGroupButtonDirective, RdxToggleGroupButtonToken, RdxToggleGroupDirective, RdxToggleGroupMultiDirective, RdxToggleGroupToken, injectToggleGroup, injectToggleGroupButton };
397
+ //# sourceMappingURL=radix-ng-primitives-toggle-group.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"radix-ng-primitives-toggle-group.mjs","sources":["../../../packages/primitives/toggle-group/src/toggle-group-button.token.ts","../../../packages/primitives/toggle-group/src/toggle-group.token.ts","../../../packages/primitives/toggle-group/src/toggle-group-button.directive.ts","../../../packages/primitives/toggle-group/src/toggle-group-multi.directive.ts","../../../packages/primitives/toggle-group/src/toggle-group.directive.ts","../../../packages/primitives/toggle-group/radix-ng-primitives-toggle-group.ts"],"sourcesContent":["import { inject, InjectionToken } from '@angular/core';\n\nimport type { RdxToggleGroupButtonDirective } from './toggle-group-button.directive';\n\nexport const RdxToggleGroupButtonToken = new InjectionToken<RdxToggleGroupButtonDirective>(\n 'RdxToggleGroupButtonToken'\n);\n\nexport function injectToggleGroupButton(): RdxToggleGroupButtonDirective {\n return inject(RdxToggleGroupButtonToken);\n}\n","import { inject, InjectionToken } from '@angular/core';\n\nimport type { RdxToggleGroupMultiDirective } from './toggle-group-multi.directive';\nimport type { RdxToggleGroupDirective } from './toggle-group.directive';\n\nexport const RdxToggleGroupToken = new InjectionToken<\n RdxToggleGroupDirective | RdxToggleGroupMultiDirective\n>('RdxToggleGroupToken');\n\nexport function injectToggleGroup(): RdxToggleGroupDirective | RdxToggleGroupMultiDirective {\n return inject(RdxToggleGroupToken);\n}\n","import {\n booleanAttribute,\n Directive,\n HostListener,\n Input,\n OnChanges,\n SimpleChanges\n} from '@angular/core';\n\nimport {\n injectRovingFocusItem,\n RdxRovingFocusItemDirective\n} from '@radix-ng/primitives/roving-focus';\n\nimport { RdxToggleGroupButtonToken } from './toggle-group-button.token';\nimport { injectToggleGroup } from './toggle-group.token';\n\n@Directive({\n selector: 'button[rdxToggleGroupButton]',\n standalone: true,\n hostDirectives: [RdxRovingFocusItemDirective],\n providers: [{ provide: RdxToggleGroupButtonToken, useExisting: RdxToggleGroupButtonDirective }],\n host: {\n role: 'radio',\n '[attr.aria-checked]': 'checked',\n '[attr.aria-disabled]': 'disabled || toggleGroup.disabled',\n '[attr.data-disabled]': 'disabled || toggleGroup.disabled',\n '[attr.data-state]': 'checked ? \"on\" : \"off\"',\n '[attr.data-orientation]': 'toggleGroup.orientation'\n }\n})\nexport class RdxToggleGroupButtonDirective implements OnChanges {\n /**\n * Access the toggle group.\n */\n protected readonly toggleGroup = injectToggleGroup();\n\n /**\n * Access the roving focus item.\n */\n private readonly rovingFocusItem = injectRovingFocusItem();\n\n /**\n * The value of this toggle button.\n */\n @Input({ alias: 'rdxToggleGroupButtonValue', required: true }) value!: string;\n\n /**\n * Whether this toggle button is disabled.\n * @default false\n */\n @Input({ alias: 'rdxToggleGroupButtonDisabled', transform: booleanAttribute }) disabled = false;\n\n /**\n * Whether this toggle button is checked.\n */\n protected get checked(): boolean {\n return this.toggleGroup.isSelected(this.value);\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if ('disabled' in changes) {\n this.updateDisabled();\n }\n }\n\n /**\n * Toggle this toggle button.\n */\n @HostListener('click')\n toggle(): void {\n if (this.disabled) {\n return;\n }\n\n this.toggleGroup.toggle(this.value);\n }\n\n /**\n * Ensure the disabled state is propagated to the roving focus item.\n * @internal\n */\n updateDisabled(): void {\n this.rovingFocusItem.disabled = this.disabled || this.toggleGroup.disabled;\n }\n}\n","import {\n AfterContentInit,\n booleanAttribute,\n ContentChildren,\n Directive,\n EventEmitter,\n Input,\n OnChanges,\n OnInit,\n QueryList,\n SimpleChanges\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nimport {\n injectRovingFocusGroup,\n RdxRovingFocusGroupDirective\n} from '@radix-ng/primitives/roving-focus';\n\nimport type { RdxToggleGroupButtonDirective } from './toggle-group-button.directive';\nimport { RdxToggleGroupButtonToken } from './toggle-group-button.token';\nimport { RdxToggleGroupToken } from './toggle-group.token';\n\n@Directive({\n selector: '[rdxToggleGroupMulti]',\n standalone: true,\n hostDirectives: [\n {\n directive: RdxRovingFocusGroupDirective,\n inputs: ['rdxRovingFocusGroupWrap:wrap', 'rdxRovingFocusGroupOrientation:orientation']\n }\n ],\n providers: [\n { provide: RdxToggleGroupToken, useExisting: RdxToggleGroupMultiDirective },\n { provide: NG_VALUE_ACCESSOR, useExisting: RdxToggleGroupMultiDirective, multi: true }\n ],\n host: {\n role: 'group',\n '[attr.data-orientation]': 'orientation',\n '(focusout)': 'onTouched?.()'\n }\n})\nexport class RdxToggleGroupMultiDirective\n implements OnInit, OnChanges, AfterContentInit, ControlValueAccessor\n{\n /**\n * Access the roving focus group\n */\n private readonly rovingFocusGroup = injectRovingFocusGroup();\n\n /**\n * The selected toggle button.\n */\n @Input('rdxToggleGroupMultiValue') value: ReadonlyArray<string> = [];\n\n /**\n * The orientation of the toggle group.\n * @default 'horizontal'\n */\n @Input('rdxToggleGroupMultiOrientation') orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n /**\n * Whether the toggle group is disabled.\n * @default false\n */\n @Input({ alias: 'rdxToggleGroupMultiDisabled', transform: booleanAttribute }) disabled = false;\n\n /**\n * Whether the toggle group roving focus should wrap.\n * @default true\n */\n @Input({ alias: 'rdxToggleGroupMultiWrap', transform: booleanAttribute }) wrap = true;\n\n /**\n * Event emitted when the selected toggle button changes.\n */\n @Input('rdxToggleGroupMultiValueChange') readonly valueChange = new EventEmitter<\n ReadonlyArray<string>\n >();\n\n /**\n * Access the buttons in the toggle group.\n */\n @ContentChildren(RdxToggleGroupButtonToken)\n protected buttons?: QueryList<RdxToggleGroupButtonDirective>;\n\n /**\n * The value change callback.\n */\n private onChange?: (value: ReadonlyArray<string>) => void;\n\n /**\n * onTouch function registered via registerOnTouch (ControlValueAccessor).\n */\n protected onTouched?: () => void;\n\n ngOnInit(): void {\n // the toggle button group has a default orientation of horizontal\n // whereas the roving focus group has a default orientation of vertical\n // if the toggle button group input is not defined, the orientation will not be set\n // in the roving focus group and the default vertical orientation will be used.\n // we must initially set the orientation of the roving focus group to match the toggle button group orientation\n this.rovingFocusGroup.setOrientation(this.orientation);\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if ('disabled' in changes) {\n this.buttons?.forEach((button) => button.updateDisabled());\n }\n }\n\n ngAfterContentInit(): void {\n if (this.disabled) {\n this.buttons?.forEach((button) => button.updateDisabled());\n }\n }\n\n /**\n * Determine if a value is selected.\n * @param value The value to check.\n * @returns Whether the value is selected.\n * @internal\n */\n isSelected(value: string): boolean {\n return this.value.includes(value);\n }\n\n /**\n * Toggle a value.\n * @param value The value to toggle.\n * @internal\n */\n toggle(value: string): void {\n if (this.disabled) {\n return;\n }\n\n this.value = this.value.includes(value)\n ? this.value.filter((v) => v !== value)\n : [...this.value, value];\n\n this.valueChange.emit(this.value);\n this.onChange?.(this.value);\n }\n\n /**\n * Select a value from Angular forms.\n * @param value The value to select.\n * @internal\n */\n writeValue(value: ReadonlyArray<string>): void {\n this.value = value;\n }\n\n /**\n * Register a callback to be called when the value changes.\n * @param fn The callback to register.\n * @internal\n */\n registerOnChange(fn: (value: ReadonlyArray<string>) => void): void {\n this.onChange = fn;\n }\n\n /**\n * Register a callback to be called when the toggle group is touched.\n * @param fn The callback to register.\n * @internal\n */\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n /**\n * Set the disabled state of the toggle group.\n * @param isDisabled Whether the toggle group is disabled.\n * @internal\n */\n setDisabledState(isDisabled: boolean): void {\n this.disabled = isDisabled;\n this.buttons?.forEach((button) => button.updateDisabled());\n }\n}\n","import {\n AfterContentInit,\n booleanAttribute,\n ContentChildren,\n Directive,\n EventEmitter,\n Input,\n OnChanges,\n OnInit,\n QueryList,\n SimpleChanges\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nimport {\n injectRovingFocusGroup,\n RdxRovingFocusGroupDirective\n} from '@radix-ng/primitives/roving-focus';\n\nimport type { RdxToggleGroupButtonDirective } from './toggle-group-button.directive';\nimport { RdxToggleGroupButtonToken } from './toggle-group-button.token';\nimport { RdxToggleGroupToken } from './toggle-group.token';\n\n@Directive({\n selector: '[rdxToggleGroup]',\n standalone: true,\n hostDirectives: [\n {\n directive: RdxRovingFocusGroupDirective,\n inputs: ['rdxRovingFocusGroupWrap:wrap', 'rdxRovingFocusGroupOrientation:orientation']\n }\n ],\n providers: [\n { provide: RdxToggleGroupToken, useExisting: RdxToggleGroupDirective },\n { provide: NG_VALUE_ACCESSOR, useExisting: RdxToggleGroupDirective, multi: true }\n ],\n host: {\n role: 'group',\n '[attr.data-orientation]': 'orientation',\n '(focusout)': 'onTouched?.()'\n }\n})\nexport class RdxToggleGroupDirective\n implements OnInit, OnChanges, AfterContentInit, ControlValueAccessor\n{\n /**\n * Access the roving focus group\n */\n private readonly rovingFocusGroup = injectRovingFocusGroup();\n\n /**\n * The selected toggle button.\n */\n @Input('rdxToggleGroupValue') value: string | null = null;\n\n /**\n * The orientation of the toggle group.\n * @default 'horizontal'\n */\n @Input('rdxToggleGroupOrientation') orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n /**\n * Whether the toggle group is disabled.\n * @default false\n */\n @Input({ alias: 'rdxToggleGroupDisabled', transform: booleanAttribute }) disabled = false;\n\n /**\n * Whether the toggle group roving focus should wrap.\n * @default true\n */\n @Input({ alias: 'rdxToggleGroupWrap', transform: booleanAttribute }) wrap = true;\n\n /**\n * Event emitted when the selected toggle button changes.\n */\n @Input('rdxToggleGroupValueChange') readonly valueChange = new EventEmitter<string | null>();\n\n /**\n * Access the buttons in the toggle group.\n */\n @ContentChildren(RdxToggleGroupButtonToken)\n protected buttons?: QueryList<RdxToggleGroupButtonDirective>;\n\n /**\n * The value change callback.\n */\n private onChange?: (value: string | null) => void;\n\n /**\n * onTouch function registered via registerOnTouch (ControlValueAccessor).\n */\n protected onTouched?: () => void;\n\n ngOnInit(): void {\n // the toggle button group has a default orientation of horizontal\n // whereas the roving focus group has a default orientation of vertical\n // if the toggle button group input is not defined, the orientation will not be set\n // in the roving focus group and the default vertical orientation will be used.\n // we must initially set the orientation of the roving focus group to match the toggle button group orientation\n this.rovingFocusGroup.setOrientation(this.orientation);\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if ('disabled' in changes) {\n this.buttons?.forEach((button) => button.updateDisabled());\n }\n }\n\n ngAfterContentInit(): void {\n if (this.disabled) {\n this.buttons?.forEach((button) => button.updateDisabled());\n }\n }\n\n /**\n * Determine if a value is selected.\n * @param value The value to check.\n * @returns Whether the value is selected.\n * @internal\n */\n isSelected(value: string): boolean {\n return this.value === value;\n }\n\n /**\n * Toggle a value.\n * @param value The value to toggle.\n * @internal\n */\n toggle(value: string): void {\n if (this.disabled) {\n return;\n }\n\n this.value = this.value === value ? null : value;\n this.valueChange.emit(this.value);\n this.onChange?.(this.value);\n }\n\n /**\n * Select a value from Angular forms.\n * @param value The value to select.\n * @internal\n */\n writeValue(value: string): void {\n this.value = value;\n }\n\n /**\n * Register a callback to be called when the value changes.\n * @param fn The callback to register.\n * @internal\n */\n registerOnChange(fn: (value: string | null) => void): void {\n this.onChange = fn;\n }\n\n /**\n * Register a callback to be called when the toggle group is touched.\n * @param fn The callback to register.\n * @internal\n */\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n /**\n * Set the disabled state of the toggle group.\n * @param isDisabled Whether the toggle group is disabled.\n * @internal\n */\n setDisabledState(isDisabled: boolean): void {\n this.disabled = isDisabled;\n this.buttons?.forEach((button) => button.updateDisabled());\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1,51 +1,40 @@
1
1
  import * as i0 from '@angular/core';
2
- import { EventEmitter, booleanAttribute, Directive, Input, Output, HostListener } from '@angular/core';
2
+ import { EventEmitter, booleanAttribute, Directive, Input, Output } from '@angular/core';
3
3
 
4
4
  let uniqueId = 0;
5
- class RdxToggleDirective {
5
+ class RdxToggleRootDirective {
6
6
  constructor() {
7
- /**
8
- * Whether the toggle is pressed.
9
- * @default false
10
- */
11
7
  this.pressed = false;
12
- /**
13
- * Whether the toggle is disabled.
14
- * @default false
15
- */
16
8
  this.disabled = false;
17
- /**
18
- * Determine element id
19
- */
20
9
  this.id = 'rdx-toggle-' + uniqueId++;
21
10
  /**
22
11
  * Event emitted when the toggle is pressed.
23
12
  */
24
- this.pressedChange = new EventEmitter();
13
+ this.onPressedChange = new EventEmitter();
25
14
  }
26
- /**
27
- * Toggle the pressed state.
28
- */
29
- toggle() {
15
+ _toggle(event) {
30
16
  if (this.disabled) {
31
17
  return;
32
18
  }
33
19
  this.pressed = !this.pressed;
34
- this.pressedChange.emit(this.pressed);
20
+ this.onPressedChange.emit(this.pressed);
21
+ event.stopPropagation();
35
22
  }
36
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: RdxToggleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
37
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.3.3", type: RdxToggleDirective, isStandalone: true, selector: "button[rdxToggle]", inputs: { pressed: ["rdxTogglePressed", "pressed", booleanAttribute], disabled: ["rdxToggleDisabled", "disabled", booleanAttribute], id: "id" }, outputs: { pressedChange: "rdxToggleOnPressedChange" }, host: { attributes: { "type": "button" }, listeners: { "click": "toggle()" }, properties: { "attr.aria-pressed": "pressed", "attr.data-state": "pressed ? \"on\" : \"off\"", "attr.data-disabled": "disabled" } }, ngImport: i0 }); }
23
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: RdxToggleRootDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
24
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.3.11", type: RdxToggleRootDirective, isStandalone: true, selector: "button[ToggleRoot]", inputs: { pressed: ["rdxTogglePressed", "pressed", booleanAttribute], disabled: ["rdxToggleDisabled", "disabled", booleanAttribute], id: "id" }, outputs: { onPressedChange: "rdxToggleOnPressedChange" }, host: { attributes: { "type": "button" }, listeners: { "click": "_toggle($event)" }, properties: { "attr.aria-pressed": "pressed", "attr.data-state": "pressed ? \"on\" : \"off\"", "attr.data-disabled": "disabled" } }, exportAs: ["ToggleRoot"], ngImport: i0 }); }
38
25
  }
39
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: RdxToggleDirective, decorators: [{
26
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: RdxToggleRootDirective, decorators: [{
40
27
  type: Directive,
41
28
  args: [{
42
- selector: 'button[rdxToggle]',
29
+ selector: 'button[ToggleRoot]',
30
+ exportAs: 'ToggleRoot',
43
31
  standalone: true,
44
32
  host: {
45
33
  type: 'button',
46
34
  '[attr.aria-pressed]': 'pressed',
47
35
  '[attr.data-state]': 'pressed ? "on" : "off"',
48
- '[attr.data-disabled]': 'disabled'
36
+ '[attr.data-disabled]': 'disabled',
37
+ '(click)': '_toggle($event)'
49
38
  }
50
39
  }]
51
40
  }], propDecorators: { pressed: [{
@@ -56,17 +45,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImpor
56
45
  args: [{ alias: 'rdxToggleDisabled', transform: booleanAttribute }]
57
46
  }], id: [{
58
47
  type: Input
59
- }], pressedChange: [{
48
+ }], onPressedChange: [{
60
49
  type: Output,
61
50
  args: ['rdxToggleOnPressedChange']
62
- }], toggle: [{
63
- type: HostListener,
64
- args: ['click']
65
51
  }] } });
66
52
 
67
53
  /**
68
54
  * Generated bundle index. Do not edit.
69
55
  */
70
56
 
71
- export { RdxToggleDirective };
57
+ export { RdxToggleRootDirective };
72
58
  //# sourceMappingURL=radix-ng-primitives-toggle.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"radix-ng-primitives-toggle.mjs","sources":["../../../packages/primitives/toggle/src/toggle.directive.ts","../../../packages/primitives/toggle/radix-ng-primitives-toggle.ts"],"sourcesContent":["import {\n booleanAttribute,\n Directive,\n EventEmitter,\n HostListener,\n Input,\n Output\n} from '@angular/core';\n\nlet uniqueId = 0;\n\n@Directive({\n selector: 'button[rdxToggle]',\n standalone: true,\n host: {\n type: 'button',\n '[attr.aria-pressed]': 'pressed',\n '[attr.data-state]': 'pressed ? \"on\" : \"off\"',\n '[attr.data-disabled]': 'disabled'\n }\n})\nexport class RdxToggleDirective {\n /**\n * Whether the toggle is pressed.\n * @default false\n */\n @Input({ alias: 'rdxTogglePressed', transform: booleanAttribute }) pressed = false;\n\n /**\n * Whether the toggle is disabled.\n * @default false\n */\n @Input({ alias: 'rdxToggleDisabled', transform: booleanAttribute }) disabled = false;\n\n /**\n * Determine element id\n */\n @Input() id = 'rdx-toggle-' + uniqueId++;\n /**\n * Event emitted when the toggle is pressed.\n */\n @Output('rdxToggleOnPressedChange') readonly pressedChange = new EventEmitter<boolean>();\n\n /**\n * Toggle the pressed state.\n */\n @HostListener('click')\n toggle(): void {\n if (this.disabled) {\n return;\n }\n\n this.pressed = !this.pressed;\n this.pressedChange.emit(this.pressed);\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AASA,IAAI,QAAQ,GAAG,CAAC,CAAC;MAYJ,kBAAkB,CAAA;AAV/B,IAAA,WAAA,GAAA;AAWI;;;AAGG;QACgE,IAAO,CAAA,OAAA,GAAG,KAAK,CAAC;AAEnF;;;AAGG;QACiE,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAC;AAErF;;AAEG;AACM,QAAA,IAAA,CAAA,EAAE,GAAG,aAAa,GAAG,QAAQ,EAAE,CAAC;AACzC;;AAEG;AAC0C,QAAA,IAAA,CAAA,aAAa,GAAG,IAAI,YAAY,EAAW,CAAC;AAc5F,KAAA;AAZG;;AAEG;IAEH,MAAM,GAAA;AACF,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;YACf,OAAO;SACV;AAED,QAAA,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;QAC7B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACzC;8GAjCQ,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAAlB,kBAAkB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,CAAA,kBAAA,EAAA,SAAA,EAKoB,gBAAgB,CAAA,EAAA,QAAA,EAAA,CAAA,mBAAA,EAAA,UAAA,EAMf,gBAAgB,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,aAAA,EAAA,0BAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,MAAA,EAAA,QAAA,EAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,UAAA,EAAA,EAAA,UAAA,EAAA,EAAA,mBAAA,EAAA,SAAA,EAAA,iBAAA,EAAA,4BAAA,EAAA,oBAAA,EAAA,UAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA,EAAA;;2FAXvD,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAV9B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,mBAAmB;AAC7B,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACF,wBAAA,IAAI,EAAE,QAAQ;AACd,wBAAA,qBAAqB,EAAE,SAAS;AAChC,wBAAA,mBAAmB,EAAE,wBAAwB;AAC7C,wBAAA,sBAAsB,EAAE,UAAU;AACrC,qBAAA;AACJ,iBAAA,CAAA;8BAMsE,OAAO,EAAA,CAAA;sBAAzE,KAAK;AAAC,gBAAA,IAAA,EAAA,CAAA,EAAE,KAAK,EAAE,kBAAkB,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAA;gBAMG,QAAQ,EAAA,CAAA;sBAA3E,KAAK;AAAC,gBAAA,IAAA,EAAA,CAAA,EAAE,KAAK,EAAE,mBAAmB,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAA;gBAKzD,EAAE,EAAA,CAAA;sBAAV,KAAK;gBAIuC,aAAa,EAAA,CAAA;sBAAzD,MAAM;uBAAC,0BAA0B,CAAA;gBAMlC,MAAM,EAAA,CAAA;sBADL,YAAY;uBAAC,OAAO,CAAA;;;AC9CzB;;AAEG;;;;"}
1
+ {"version":3,"file":"radix-ng-primitives-toggle.mjs","sources":["../../../packages/primitives/toggle/src/toggle-root.directive.ts","../../../packages/primitives/toggle/radix-ng-primitives-toggle.ts"],"sourcesContent":["import { booleanAttribute, Directive, EventEmitter, Input, Output } from '@angular/core';\n\nlet uniqueId = 0;\n\nexport interface ToggleProps {\n /**\n * The controlled state of the toggle.\n */\n pressed?: boolean;\n /**\n * The state of the toggle when initially rendered. Use `defaultPressed`\n * if you do not need to control the state of the toggle.\n * @defaultValue false\n */\n defaultPressed?: boolean;\n /**\n * The callback that fires when the state of the toggle changes.\n */\n onPressedChange?: EventEmitter<boolean>;\n}\n\n@Directive({\n selector: 'button[ToggleRoot]',\n exportAs: 'ToggleRoot',\n standalone: true,\n host: {\n type: 'button',\n '[attr.aria-pressed]': 'pressed',\n '[attr.data-state]': 'pressed ? \"on\" : \"off\"',\n '[attr.data-disabled]': 'disabled',\n\n '(click)': '_toggle($event)'\n }\n})\nexport class RdxToggleRootDirective implements ToggleProps {\n @Input({ alias: 'rdxTogglePressed', transform: booleanAttribute }) pressed = false;\n\n @Input({ alias: 'rdxToggleDisabled', transform: booleanAttribute }) disabled = false;\n\n @Input() id = 'rdx-toggle-' + uniqueId++;\n /**\n * Event emitted when the toggle is pressed.\n */\n @Output('rdxToggleOnPressedChange') readonly onPressedChange = new EventEmitter<boolean>();\n\n _toggle(event: MouseEvent): void {\n if (this.disabled) {\n return;\n }\n this.pressed = !this.pressed;\n this.onPressedChange.emit(this.pressed);\n\n event.stopPropagation();\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAEA,IAAI,QAAQ,GAAG,CAAC,CAAC;MAgCJ,sBAAsB,CAAA;AAbnC,IAAA,WAAA,GAAA;QAcuE,IAAO,CAAA,OAAA,GAAG,KAAK,CAAC;QAEf,IAAQ,CAAA,QAAA,GAAG,KAAK,CAAC;AAE5E,QAAA,IAAA,CAAA,EAAE,GAAG,aAAa,GAAG,QAAQ,EAAE,CAAC;AACzC;;AAEG;AAC0C,QAAA,IAAA,CAAA,eAAe,GAAG,IAAI,YAAY,EAAW,CAAC;AAW9F,KAAA;AATG,IAAA,OAAO,CAAC,KAAiB,EAAA;AACrB,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;YACf,OAAO;SACV;AACD,QAAA,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;QAC7B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAExC,KAAK,CAAC,eAAe,EAAE,CAAC;KAC3B;+GAnBQ,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;mGAAtB,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,CAAA,kBAAA,EAAA,SAAA,EACgB,gBAAgB,CAAA,EAAA,QAAA,EAAA,CAAA,mBAAA,EAAA,UAAA,EAEf,gBAAgB,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,eAAA,EAAA,0BAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,MAAA,EAAA,QAAA,EAAA,EAAA,SAAA,EAAA,EAAA,OAAA,EAAA,iBAAA,EAAA,EAAA,UAAA,EAAA,EAAA,mBAAA,EAAA,SAAA,EAAA,iBAAA,EAAA,4BAAA,EAAA,oBAAA,EAAA,UAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA,EAAA;;4FAHvD,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAblC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,oBAAoB;AAC9B,oBAAA,QAAQ,EAAE,YAAY;AACtB,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACF,wBAAA,IAAI,EAAE,QAAQ;AACd,wBAAA,qBAAqB,EAAE,SAAS;AAChC,wBAAA,mBAAmB,EAAE,wBAAwB;AAC7C,wBAAA,sBAAsB,EAAE,UAAU;AAElC,wBAAA,SAAS,EAAE,iBAAiB;AAC/B,qBAAA;AACJ,iBAAA,CAAA;8BAEsE,OAAO,EAAA,CAAA;sBAAzE,KAAK;AAAC,gBAAA,IAAA,EAAA,CAAA,EAAE,KAAK,EAAE,kBAAkB,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAA;gBAEG,QAAQ,EAAA,CAAA;sBAA3E,KAAK;AAAC,gBAAA,IAAA,EAAA,CAAA,EAAE,KAAK,EAAE,mBAAmB,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAA;gBAEzD,EAAE,EAAA,CAAA;sBAAV,KAAK;gBAIuC,eAAe,EAAA,CAAA;sBAA3D,MAAM;uBAAC,0BAA0B,CAAA;;;AC3CtC;;AAEG;;;;"}
package/label/index.d.ts CHANGED
@@ -1 +1 @@
1
- export * from './src/label.directive';
1
+ export * from './src/label-root.directive';
@@ -0,0 +1,13 @@
1
+ import * as i0 from "@angular/core";
2
+ export declare class RdxLabelRootDirective {
3
+ id: string;
4
+ /**
5
+ * The id of the element the label is associated with.
6
+ * @default '-'
7
+ */
8
+ readonly htmlFor: import("@angular/core").InputSignal<string>;
9
+ private readonly elementRef;
10
+ onMouseDown(event: MouseEvent): void;
11
+ static ɵfac: i0.ɵɵFactoryDeclaration<RdxLabelRootDirective, never>;
12
+ static ɵdir: i0.ɵɵDirectiveDeclaration<RdxLabelRootDirective, "label[LabelRoot]", ["LabelRoot"], { "id": { "alias": "id"; "required": false; }; "htmlFor": { "alias": "htmlFor"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
13
+ }