@radix-ng/primitives 0.4.0 → 0.5.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 (65) hide show
  1. package/accordion/README.md +3 -0
  2. package/accordion/index.d.ts +7 -0
  3. package/accordion/src/accordion/accordion.directive.d.ts +64 -0
  4. package/accordion/src/accordion/accordion.token.d.ts +4 -0
  5. package/accordion/src/accordion-content/accordion-content.directive.d.ts +44 -0
  6. package/accordion/src/accordion-header/accordion-header.directive.d.ts +6 -0
  7. package/accordion/src/accordion-item/accordion-item.directive.d.ts +42 -0
  8. package/accordion/src/accordion-item/accordion-item.token.d.ts +4 -0
  9. package/accordion/src/accordion-state.directive.d.ts +28 -0
  10. package/accordion/src/accordion-trigger/accordion-trigger.directive.d.ts +23 -0
  11. package/accordion/src/accordion.config.d.ts +25 -0
  12. package/esm2022/accordion/index.mjs +8 -0
  13. package/esm2022/accordion/radix-ng-primitives-accordion.mjs +5 -0
  14. package/esm2022/accordion/src/accordion/accordion.directive.mjs +108 -0
  15. package/esm2022/accordion/src/accordion/accordion.token.mjs +6 -0
  16. package/esm2022/accordion/src/accordion-content/accordion-content.directive.mjs +75 -0
  17. package/esm2022/accordion/src/accordion-header/accordion-header.directive.mjs +17 -0
  18. package/esm2022/accordion/src/accordion-item/accordion-item.directive.mjs +81 -0
  19. package/esm2022/accordion/src/accordion-item/accordion-item.token.mjs +6 -0
  20. package/esm2022/accordion/src/accordion-state.directive.mjs +49 -0
  21. package/esm2022/accordion/src/accordion-trigger/accordion-trigger.directive.mjs +49 -0
  22. package/esm2022/accordion/src/accordion.config.mjs +27 -0
  23. package/esm2022/label/src/label.directive.mjs +17 -3
  24. package/esm2022/roving-focus/src/roving-focus-group.directive.mjs +5 -4
  25. package/esm2022/toggle-group/index.mjs +6 -0
  26. package/esm2022/toggle-group/radix-ng-primitives-toggle-group.mjs +5 -0
  27. package/esm2022/toggle-group/src/toggle-group-button.directive.mjs +79 -0
  28. package/esm2022/toggle-group/src/toggle-group-button.token.mjs +6 -0
  29. package/esm2022/toggle-group/src/toggle-group-multi.directive.mjs +159 -0
  30. package/esm2022/toggle-group/src/toggle-group.directive.mjs +157 -0
  31. package/esm2022/toggle-group/src/toggle-group.token.mjs +6 -0
  32. package/fesm2022/radix-ng-primitives-accordion.mjs +394 -0
  33. package/fesm2022/radix-ng-primitives-accordion.mjs.map +1 -0
  34. package/fesm2022/radix-ng-primitives-label.mjs +16 -2
  35. package/fesm2022/radix-ng-primitives-label.mjs.map +1 -1
  36. package/fesm2022/radix-ng-primitives-roving-focus.mjs +4 -3
  37. package/fesm2022/radix-ng-primitives-roving-focus.mjs.map +1 -1
  38. package/fesm2022/radix-ng-primitives-toggle-group.mjs +397 -0
  39. package/fesm2022/radix-ng-primitives-toggle-group.mjs.map +1 -0
  40. package/label/src/label.directive.d.ts +6 -1
  41. package/package.json +12 -6
  42. package/roving-focus/src/roving-focus-group.directive.d.ts +1 -1
  43. package/toggle-group/README.md +3 -0
  44. package/toggle-group/index.d.ts +5 -0
  45. package/toggle-group/src/toggle-group-button.directive.d.ts +39 -0
  46. package/toggle-group/src/toggle-group-button.token.d.ts +4 -0
  47. package/toggle-group/src/toggle-group-multi.directive.d.ts +90 -0
  48. package/toggle-group/src/toggle-group.directive.d.ts +90 -0
  49. package/toggle-group/src/toggle-group.token.d.ts +5 -0
  50. package/esm2022/tooltip/index.mjs +0 -5
  51. package/esm2022/tooltip/radix-ng-primitives-tooltip.mjs +0 -5
  52. package/esm2022/tooltip/src/tooltip-arrow.directive.mjs +0 -17
  53. package/esm2022/tooltip/src/tooltip-trigger.directive.mjs +0 -148
  54. package/esm2022/tooltip/src/tooltip-trigger.token.mjs +0 -6
  55. package/esm2022/tooltip/src/tooltip.config.mjs +0 -31
  56. package/esm2022/tooltip/src/tooltip.directive.mjs +0 -46
  57. package/fesm2022/radix-ng-primitives-tooltip.mjs +0 -242
  58. package/fesm2022/radix-ng-primitives-tooltip.mjs.map +0 -1
  59. package/tooltip/README.md +0 -1
  60. package/tooltip/index.d.ts +0 -4
  61. package/tooltip/src/tooltip-arrow.directive.d.ts +0 -6
  62. package/tooltip/src/tooltip-trigger.directive.d.ts +0 -79
  63. package/tooltip/src/tooltip-trigger.token.d.ts +0 -4
  64. package/tooltip/src/tooltip.config.d.ts +0 -46
  65. package/tooltip/src/tooltip.directive.d.ts +0 -17
@@ -1,9 +1,20 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Directive, Optional, Input, HostListener } from '@angular/core';
2
+ import { signal, Directive, Optional, Input, HostListener } from '@angular/core';
3
3
 
4
+ // Increasing integer for generating unique ids.
5
+ let nextUniqueId = 0;
4
6
  class RdxLabelDirective {
7
+ /** The HTML id of the Label. */
8
+ set id(id) {
9
+ this._id.set(id || this._id());
10
+ }
11
+ get id() {
12
+ return this._id();
13
+ }
5
14
  constructor(el) {
6
15
  this.el = el;
16
+ /** The HTML id attribute applied to this element. */
17
+ this._id = signal(`rdx-label-${nextUniqueId++}`);
7
18
  /**
8
19
  * The id of the element the label is associated with.
9
20
  * @default '-'
@@ -25,7 +36,7 @@ class RdxLabelDirective {
25
36
  }
26
37
  }
27
38
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: RdxLabelDirective, deps: [{ token: i0.ElementRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
28
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.3", type: RdxLabelDirective, isStandalone: true, selector: "label[rdxLabel]", inputs: { htmlFor: "htmlFor" }, host: { listeners: { "mousedown": "onMouseDown($event)" }, properties: { "attr.for": "htmlFor ? htmlFor : null" } }, ngImport: i0 }); }
39
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.3", type: RdxLabelDirective, isStandalone: true, selector: "label[rdxLabel]", inputs: { htmlFor: "htmlFor", id: "id" }, host: { listeners: { "mousedown": "onMouseDown($event)" }, properties: { "id": "_id()", "attr.for": "htmlFor ? htmlFor : null" } }, ngImport: i0 }); }
29
40
  }
30
41
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: RdxLabelDirective, decorators: [{
31
42
  type: Directive,
@@ -33,6 +44,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImpor
33
44
  selector: 'label[rdxLabel]',
34
45
  standalone: true,
35
46
  host: {
47
+ '[id]': '_id()',
36
48
  '[attr.for]': 'htmlFor ? htmlFor : null'
37
49
  }
38
50
  }]
@@ -40,6 +52,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImpor
40
52
  type: Optional
41
53
  }] }], propDecorators: { htmlFor: [{
42
54
  type: Input
55
+ }], id: [{
56
+ type: Input
43
57
  }], onMouseDown: [{
44
58
  type: HostListener,
45
59
  args: ['mousedown', ['$event']]
@@ -1 +1 @@
1
- {"version":3,"file":"radix-ng-primitives-label.mjs","sources":["../../../packages/primitives/label/src/label.directive.ts","../../../packages/primitives/label/radix-ng-primitives-label.ts"],"sourcesContent":["import { Directive, ElementRef, HostListener, Input, Optional } from '@angular/core';\n\n@Directive({\n selector: 'label[rdxLabel]',\n standalone: true,\n host: {\n '[attr.for]': 'htmlFor ? htmlFor : null'\n }\n})\nexport class RdxLabelDirective {\n /**\n * The id of the element the label is associated with.\n * @default '-'\n */\n @Input() htmlFor = '';\n\n constructor(@Optional() private el: ElementRef) {}\n\n // prevent text selection when double-clicking label\n // The main problem with double-clicks in a web app is that\n // you will have to create special code to handle this on touch enabled devices.\n @HostListener('mousedown', ['$event'])\n onMouseDown(event: MouseEvent): void {\n const target = event.target as HTMLElement;\n\n // only prevent text selection if clicking inside the label itself\n if (['BUTTON', 'INPUT', 'SELECT', 'TEXTAREA'].includes(target.tagName)) {\n return;\n }\n\n // prevent text selection when double-clicking label\n if (this.el.nativeElement.contains(target) && !event.defaultPrevented && event.detail > 1) {\n event.preventDefault();\n }\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;MASa,iBAAiB,CAAA;AAO1B,IAAA,WAAA,CAAgC,EAAc,EAAA;QAAd,IAAE,CAAA,EAAA,GAAF,EAAE,CAAY;AAN9C;;;AAGG;QACM,IAAO,CAAA,OAAA,GAAG,EAAE,CAAC;KAE4B;;;;AAMlD,IAAA,WAAW,CAAC,KAAiB,EAAA;AACzB,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;;AAG3C,QAAA,IAAI,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE;YACpE,OAAO;SACV;;QAGD,IAAI,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YACvF,KAAK,CAAC,cAAc,EAAE,CAAC;SAC1B;KACJ;8GAzBQ,iBAAiB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAAjB,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,EAAA,UAAA,EAAA,EAAA,UAAA,EAAA,0BAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA,EAAA;;2FAAjB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAP7B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,iBAAiB;AAC3B,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACF,wBAAA,YAAY,EAAE,0BAA0B;AAC3C,qBAAA;AACJ,iBAAA,CAAA;;0BAQgB,QAAQ;yCAFZ,OAAO,EAAA,CAAA;sBAAf,KAAK;gBAQN,WAAW,EAAA,CAAA;sBADV,YAAY;uBAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,CAAA;;;ACrBzC;;AAEG;;;;"}
1
+ {"version":3,"file":"radix-ng-primitives-label.mjs","sources":["../../../packages/primitives/label/src/label.directive.ts","../../../packages/primitives/label/radix-ng-primitives-label.ts"],"sourcesContent":["import { Directive, ElementRef, HostListener, Input, Optional, signal } from '@angular/core';\n\n// Increasing integer for generating unique ids.\nlet nextUniqueId = 0;\n\n@Directive({\n selector: 'label[rdxLabel]',\n standalone: true,\n host: {\n '[id]': '_id()',\n '[attr.for]': 'htmlFor ? htmlFor : null'\n }\n})\nexport class RdxLabelDirective {\n /** The HTML id attribute applied to this element. */\n protected readonly _id = signal(`rdx-label-${nextUniqueId++}`);\n\n /**\n * The id of the element the label is associated with.\n * @default '-'\n */\n @Input() htmlFor = '';\n\n /** The HTML id of the Label. */\n @Input()\n set id(id: string) {\n this._id.set(id || this._id());\n }\n\n get id() {\n return this._id();\n }\n\n constructor(@Optional() private el: ElementRef) {}\n\n // prevent text selection when double-clicking label\n // The main problem with double-clicks in a web app is that\n // you will have to create special code to handle this on touch enabled devices.\n @HostListener('mousedown', ['$event'])\n onMouseDown(event: MouseEvent): void {\n const target = event.target as HTMLElement;\n\n // only prevent text selection if clicking inside the label itself\n if (['BUTTON', 'INPUT', 'SELECT', 'TEXTAREA'].includes(target.tagName)) {\n return;\n }\n\n // prevent text selection when double-clicking label\n if (this.el.nativeElement.contains(target) && !event.defaultPrevented && event.detail > 1) {\n event.preventDefault();\n }\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;AAEA;AACA,IAAI,YAAY,GAAG,CAAC,CAAC;MAUR,iBAAiB,CAAA;;IAW1B,IACI,EAAE,CAAC,EAAU,EAAA;AACb,QAAA,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,IAAI,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;KAClC;AAED,IAAA,IAAI,EAAE,GAAA;AACF,QAAA,OAAO,IAAI,CAAC,GAAG,EAAE,CAAC;KACrB;AAED,IAAA,WAAA,CAAgC,EAAc,EAAA;QAAd,IAAE,CAAA,EAAA,GAAF,EAAE,CAAY;;QAlB3B,IAAG,CAAA,GAAA,GAAG,MAAM,CAAC,CAAA,UAAA,EAAa,YAAY,EAAE,CAAA,CAAE,CAAC,CAAC;AAE/D;;;AAGG;QACM,IAAO,CAAA,OAAA,GAAG,EAAE,CAAC;KAY4B;;;;AAMlD,IAAA,WAAW,CAAC,KAAiB,EAAA;AACzB,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAC;;AAG3C,QAAA,IAAI,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE;YACpE,OAAO;SACV;;QAGD,IAAI,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YACvF,KAAK,CAAC,cAAc,EAAE,CAAC;SAC1B;KACJ;8GAtCQ,iBAAiB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAAjB,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,EAAA,UAAA,EAAA,EAAA,IAAA,EAAA,OAAA,EAAA,UAAA,EAAA,0BAAA,EAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA,EAAA;;2FAAjB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAR7B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,iBAAiB;AAC3B,oBAAA,UAAU,EAAE,IAAI;AAChB,oBAAA,IAAI,EAAE;AACF,wBAAA,MAAM,EAAE,OAAO;AACf,wBAAA,YAAY,EAAE,0BAA0B;AAC3C,qBAAA;AACJ,iBAAA,CAAA;;0BAqBgB,QAAQ;yCAZZ,OAAO,EAAA,CAAA;sBAAf,KAAK;gBAIF,EAAE,EAAA,CAAA;sBADL,KAAK;gBAeN,WAAW,EAAA,CAAA;sBADV,YAAY;uBAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,CAAA;;;ACtCzC;;AAEG;;;;"}
@@ -105,7 +105,7 @@ class RdxRovingFocusGroupDirective {
105
105
  }
106
106
  }
107
107
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: RdxRovingFocusGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
108
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.3.3", type: RdxRovingFocusGroupDirective, isStandalone: true, selector: "[rdxRovingFocusGroup]", inputs: { orientation: "orientation", wrap: ["wrap", "wrap", booleanAttribute] }, providers: [{ provide: RdxRovingFocusGroupToken, useExisting: RdxRovingFocusGroupDirective }], usesOnChanges: true, ngImport: i0 }); }
108
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.3.3", type: RdxRovingFocusGroupDirective, isStandalone: true, selector: "[rdxRovingFocusGroup]", inputs: { orientation: ["rdxRovingFocusGroupOrientation", "orientation"], wrap: ["rdxRovingFocusGroupWrap", "wrap", booleanAttribute] }, providers: [{ provide: RdxRovingFocusGroupToken, useExisting: RdxRovingFocusGroupDirective }], usesOnChanges: true, ngImport: i0 }); }
109
109
  }
110
110
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImport: i0, type: RdxRovingFocusGroupDirective, decorators: [{
111
111
  type: Directive,
@@ -115,10 +115,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.3", ngImpor
115
115
  providers: [{ provide: RdxRovingFocusGroupToken, useExisting: RdxRovingFocusGroupDirective }]
116
116
  }]
117
117
  }], propDecorators: { orientation: [{
118
- type: Input
118
+ type: Input,
119
+ args: [{ alias: 'rdxRovingFocusGroupOrientation' }]
119
120
  }], wrap: [{
120
121
  type: Input,
121
- args: [{ transform: booleanAttribute }]
122
+ args: [{ alias: 'rdxRovingFocusGroupWrap', transform: booleanAttribute }]
122
123
  }] } });
123
124
 
124
125
  const RdxRovingFocusItemToken = new InjectionToken('RdxRovingFocusItemToken');
@@ -1 +1 @@
1
- {"version":3,"file":"radix-ng-primitives-roving-focus.mjs","sources":["../../../packages/primitives/roving-focus/src/roving-focus-group.token.ts","../../../packages/primitives/roving-focus/src/roving-focus-group.directive.ts","../../../packages/primitives/roving-focus/src/roving-focus-item.token.ts","../../../packages/primitives/roving-focus/src/roving-focus-item.directive.ts","../../../packages/primitives/roving-focus/radix-ng-primitives-roving-focus.ts"],"sourcesContent":["import { inject, InjectionToken } from '@angular/core';\n\nimport type { RdxRovingFocusGroupDirective } from './roving-focus-group.directive';\n\nexport const RdxRovingFocusGroupToken = new InjectionToken<RdxRovingFocusGroupDirective>(\n 'RdxRovingFocusToken'\n);\n\n/**\n * Inject the roving focus directive instance.\n */\nexport function injectRovingFocusGroup(): RdxRovingFocusGroupDirective {\n return inject(RdxRovingFocusGroupToken);\n}\n","import { FocusKeyManager } from '@angular/cdk/a11y';\nimport { Directionality } from '@angular/cdk/bidi';\nimport {\n booleanAttribute,\n DestroyRef,\n Directive,\n inject,\n Input,\n OnChanges,\n OnDestroy,\n OnInit,\n QueryList,\n SimpleChanges\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { filter } from 'rxjs';\n\nimport { RdxRovingFocusGroupToken } from './roving-focus-group.token';\nimport type { RdxRovingFocusItemDirective } from './roving-focus-item.directive';\n\n@Directive({\n selector: '[rdxRovingFocusGroup]',\n standalone: true,\n providers: [{ provide: RdxRovingFocusGroupToken, useExisting: RdxRovingFocusGroupDirective }]\n})\nexport class RdxRovingFocusGroupDirective implements OnInit, OnChanges, OnDestroy {\n private readonly directionality = inject(Directionality);\n\n private readonly destroyRef = inject(DestroyRef);\n\n /**\n * Create a query list of all the roving focus items.\n * We don't use ContentChildren as dynamically added items may not be in the correct order.\n */\n private readonly items = new QueryList<RdxRovingFocusItemDirective>();\n\n /**\n * Create the focus key manager instance.\n * @internal\n */\n readonly keyManager = new FocusKeyManager<RdxRovingFocusItemDirective>(this.items);\n\n /**\n * Determine the orientation of the roving focus group.\n * @default vertical\n */\n @Input() orientation: 'horizontal' | 'vertical' = 'vertical';\n\n /**\n * Determine if focus should wrap when the end or beginning is reached.\n * @default true\n */\n @Input({ transform: booleanAttribute }) wrap = true;\n\n ngOnInit(): void {\n this.keyManager.withWrap(this.wrap);\n\n this.setOrientation(this.orientation);\n\n // update the key manager orientation if the document direction changes\n this.directionality.change\n .pipe(\n filter(() => this.orientation === 'horizontal'),\n takeUntilDestroyed(this.destroyRef)\n )\n .subscribe((direction) => this.keyManager.withHorizontalOrientation(direction));\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if ('orientation' in changes) {\n this.setOrientation(this.orientation);\n }\n\n if ('wrap' in changes) {\n this.keyManager.withWrap(this.wrap);\n }\n }\n\n ngOnDestroy(): void {\n this.keyManager.destroy();\n }\n\n /**\n * Register a roving focus item.\n * @param item The roving focus item to register.\n */\n register(item: RdxRovingFocusItemDirective): void {\n // add the item to the query list by sort the items based on their order\n this.items.reset([...this.items.toArray(), item].sort((a, b) => a.order - b.order));\n\n // if this is the first item, make it the active item\n if (this.items.length === 1) {\n this.keyManager.updateActiveItem(item);\n }\n }\n\n /**\n * Unregister a roving focus item.\n * @param item The roving focus item to unregister.\n */\n unregister(item: RdxRovingFocusItemDirective): void {\n // determine if the item being removed is the active item\n const isActive = this.keyManager.activeItem === item;\n\n // remove the item from the query list\n this.items.reset(this.items.toArray().filter((i) => i !== item));\n\n // if the item being removed is the active item, make the first item the active item\n if (isActive) {\n this.keyManager.updateActiveItem(0);\n }\n }\n\n /**\n * Handle key events on the roving focus items.\n * @param event The key event.\n * @internal\n */\n onKeydown(event: KeyboardEvent): void {\n this.keyManager.onKeydown(event);\n }\n\n /**\n * Set the orientation of the roving focus group.\n * @param orientation The orientation of the roving focus group.\n */\n setOrientation(orientation: 'horizontal' | 'vertical'): void {\n this.orientation = orientation;\n\n if (orientation === 'horizontal') {\n this.keyManager.withHorizontalOrientation(this.directionality.value);\n } else {\n this.keyManager.withVerticalOrientation();\n }\n }\n}\n","import { inject, InjectionToken } from '@angular/core';\n\nimport type { RdxRovingFocusItemDirective } from './roving-focus-item.directive';\n\nexport const RdxRovingFocusItemToken = new InjectionToken<RdxRovingFocusItemDirective>(\n 'RdxRovingFocusItemToken'\n);\n\nexport function injectRovingFocusItem(): RdxRovingFocusItemDirective {\n return inject(RdxRovingFocusItemToken);\n}\n","import { FocusableOption } from '@angular/cdk/a11y';\nimport {\n booleanAttribute,\n ChangeDetectorRef,\n DestroyRef,\n Directive,\n ElementRef,\n HostBinding,\n HostListener,\n inject,\n Input,\n numberAttribute,\n OnDestroy,\n OnInit\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { injectRovingFocusGroup } from './roving-focus-group.token';\nimport { RdxRovingFocusItemToken } from './roving-focus-item.token';\n\n@Directive({\n selector: '[rdxRovingFocusItem]',\n standalone: true,\n providers: [{ provide: RdxRovingFocusItemToken, useExisting: RdxRovingFocusItemDirective }]\n})\nexport class RdxRovingFocusItemDirective implements OnInit, OnDestroy, FocusableOption {\n /**\n * Access the group the roving focus item belongs to.\n */\n private readonly group = injectRovingFocusGroup();\n\n /**\n * Access the element reference of the roving focus item.\n */\n private readonly elementRef = inject(ElementRef<HTMLElement>);\n\n /**\n * Access the destroyRef\n */\n private readonly destroyRef = inject(DestroyRef);\n\n /**\n * Access the change detector ref\n */\n private readonly changeDetectorRef = inject(ChangeDetectorRef);\n\n /**\n * Define the order of the roving focus item in the group.\n */\n @Input({ transform: numberAttribute }) order = 0;\n\n /**\n * Define if the item is disabled.\n */\n @Input({ transform: booleanAttribute }) disabled = false;\n\n /**\n * Derive the tabindex of the roving focus item.\n * @internal\n */\n @HostBinding('attr.tabindex')\n get tabindex(): number {\n return this.group.keyManager.activeItem === this ? 0 : -1;\n }\n\n ngOnInit(): void {\n // register the roving focus item with the group\n this.group.register(this);\n\n // listen for changes to the active item and run change detection\n this.group.keyManager.change\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(() => this.changeDetectorRef.markForCheck());\n }\n\n ngOnDestroy(): void {\n // unregister the roving focus item with the group\n this.group.unregister(this);\n }\n\n /**\n * Handle key events on the roving focus item.\n * @param event The key event.\n * @internal\n */\n @HostListener('keydown', ['$event'])\n onKeydown(event: KeyboardEvent): void {\n this.group.onKeydown(event);\n }\n\n /**\n * Focus the roving focus item.\n * @param origin The origin of the focus request.\n * @internal\n */\n focus(): void {\n this.elementRef?.nativeElement.focus();\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":"radix-ng-primitives-roving-focus.mjs","sources":["../../../packages/primitives/roving-focus/src/roving-focus-group.token.ts","../../../packages/primitives/roving-focus/src/roving-focus-group.directive.ts","../../../packages/primitives/roving-focus/src/roving-focus-item.token.ts","../../../packages/primitives/roving-focus/src/roving-focus-item.directive.ts","../../../packages/primitives/roving-focus/radix-ng-primitives-roving-focus.ts"],"sourcesContent":["import { inject, InjectionToken } from '@angular/core';\n\nimport type { RdxRovingFocusGroupDirective } from './roving-focus-group.directive';\n\nexport const RdxRovingFocusGroupToken = new InjectionToken<RdxRovingFocusGroupDirective>(\n 'RdxRovingFocusToken'\n);\n\n/**\n * Inject the roving focus directive instance.\n */\nexport function injectRovingFocusGroup(): RdxRovingFocusGroupDirective {\n return inject(RdxRovingFocusGroupToken);\n}\n","import { FocusKeyManager } from '@angular/cdk/a11y';\nimport { Directionality } from '@angular/cdk/bidi';\nimport {\n booleanAttribute,\n DestroyRef,\n Directive,\n inject,\n Input,\n OnChanges,\n OnDestroy,\n OnInit,\n QueryList,\n SimpleChanges\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { filter } from 'rxjs';\n\nimport { RdxRovingFocusGroupToken } from './roving-focus-group.token';\nimport type { RdxRovingFocusItemDirective } from './roving-focus-item.directive';\n\n@Directive({\n selector: '[rdxRovingFocusGroup]',\n standalone: true,\n providers: [{ provide: RdxRovingFocusGroupToken, useExisting: RdxRovingFocusGroupDirective }]\n})\nexport class RdxRovingFocusGroupDirective implements OnInit, OnChanges, OnDestroy {\n private readonly directionality = inject(Directionality);\n\n private readonly destroyRef = inject(DestroyRef);\n\n /**\n * Create a query list of all the roving focus items.\n * We don't use ContentChildren as dynamically added items may not be in the correct order.\n */\n private readonly items = new QueryList<RdxRovingFocusItemDirective>();\n\n /**\n * Create the focus key manager instance.\n * @internal\n */\n readonly keyManager = new FocusKeyManager<RdxRovingFocusItemDirective>(this.items);\n\n /**\n * Determine the orientation of the roving focus group.\n * @default vertical\n */\n @Input({ alias: 'rdxRovingFocusGroupOrientation' }) orientation: 'horizontal' | 'vertical' =\n 'vertical';\n\n /**\n * Determine if focus should wrap when the end or beginning is reached.\n * @default true\n */\n @Input({ alias: 'rdxRovingFocusGroupWrap', transform: booleanAttribute }) wrap = true;\n\n ngOnInit(): void {\n this.keyManager.withWrap(this.wrap);\n\n this.setOrientation(this.orientation);\n\n // update the key manager orientation if the document direction changes\n this.directionality.change\n .pipe(\n filter(() => this.orientation === 'horizontal'),\n takeUntilDestroyed(this.destroyRef)\n )\n .subscribe((direction) => this.keyManager.withHorizontalOrientation(direction));\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if ('orientation' in changes) {\n this.setOrientation(this.orientation);\n }\n\n if ('wrap' in changes) {\n this.keyManager.withWrap(this.wrap);\n }\n }\n\n ngOnDestroy(): void {\n this.keyManager.destroy();\n }\n\n /**\n * Register a roving focus item.\n * @param item The roving focus item to register.\n */\n register(item: RdxRovingFocusItemDirective): void {\n // add the item to the query list by sort the items based on their order\n this.items.reset([...this.items.toArray(), item].sort((a, b) => a.order - b.order));\n\n // if this is the first item, make it the active item\n if (this.items.length === 1) {\n this.keyManager.updateActiveItem(item);\n }\n }\n\n /**\n * Unregister a roving focus item.\n * @param item The roving focus item to unregister.\n */\n unregister(item: RdxRovingFocusItemDirective): void {\n // determine if the item being removed is the active item\n const isActive = this.keyManager.activeItem === item;\n\n // remove the item from the query list\n this.items.reset(this.items.toArray().filter((i) => i !== item));\n\n // if the item being removed is the active item, make the first item the active item\n if (isActive) {\n this.keyManager.updateActiveItem(0);\n }\n }\n\n /**\n * Handle key events on the roving focus items.\n * @param event The key event.\n * @internal\n */\n onKeydown(event: KeyboardEvent): void {\n this.keyManager.onKeydown(event);\n }\n\n /**\n * Set the orientation of the roving focus group.\n * @param orientation The orientation of the roving focus group.\n */\n setOrientation(orientation: 'horizontal' | 'vertical'): void {\n this.orientation = orientation;\n\n if (orientation === 'horizontal') {\n this.keyManager.withHorizontalOrientation(this.directionality.value);\n } else {\n this.keyManager.withVerticalOrientation();\n }\n }\n}\n","import { inject, InjectionToken } from '@angular/core';\n\nimport type { RdxRovingFocusItemDirective } from './roving-focus-item.directive';\n\nexport const RdxRovingFocusItemToken = new InjectionToken<RdxRovingFocusItemDirective>(\n 'RdxRovingFocusItemToken'\n);\n\nexport function injectRovingFocusItem(): RdxRovingFocusItemDirective {\n return inject(RdxRovingFocusItemToken);\n}\n","import { FocusableOption } from '@angular/cdk/a11y';\nimport {\n booleanAttribute,\n ChangeDetectorRef,\n DestroyRef,\n Directive,\n ElementRef,\n HostBinding,\n HostListener,\n inject,\n Input,\n numberAttribute,\n OnDestroy,\n OnInit\n} from '@angular/core';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\n\nimport { injectRovingFocusGroup } from './roving-focus-group.token';\nimport { RdxRovingFocusItemToken } from './roving-focus-item.token';\n\n@Directive({\n selector: '[rdxRovingFocusItem]',\n standalone: true,\n providers: [{ provide: RdxRovingFocusItemToken, useExisting: RdxRovingFocusItemDirective }]\n})\nexport class RdxRovingFocusItemDirective implements OnInit, OnDestroy, FocusableOption {\n /**\n * Access the group the roving focus item belongs to.\n */\n private readonly group = injectRovingFocusGroup();\n\n /**\n * Access the element reference of the roving focus item.\n */\n private readonly elementRef = inject(ElementRef<HTMLElement>);\n\n /**\n * Access the destroyRef\n */\n private readonly destroyRef = inject(DestroyRef);\n\n /**\n * Access the change detector ref\n */\n private readonly changeDetectorRef = inject(ChangeDetectorRef);\n\n /**\n * Define the order of the roving focus item in the group.\n */\n @Input({ transform: numberAttribute }) order = 0;\n\n /**\n * Define if the item is disabled.\n */\n @Input({ transform: booleanAttribute }) disabled = false;\n\n /**\n * Derive the tabindex of the roving focus item.\n * @internal\n */\n @HostBinding('attr.tabindex')\n get tabindex(): number {\n return this.group.keyManager.activeItem === this ? 0 : -1;\n }\n\n ngOnInit(): void {\n // register the roving focus item with the group\n this.group.register(this);\n\n // listen for changes to the active item and run change detection\n this.group.keyManager.change\n .pipe(takeUntilDestroyed(this.destroyRef))\n .subscribe(() => this.changeDetectorRef.markForCheck());\n }\n\n ngOnDestroy(): void {\n // unregister the roving focus item with the group\n this.group.unregister(this);\n }\n\n /**\n * Handle key events on the roving focus item.\n * @param event The key event.\n * @internal\n */\n @HostListener('keydown', ['$event'])\n onKeydown(event: KeyboardEvent): void {\n this.group.onKeydown(event);\n }\n\n /**\n * Focus the roving focus item.\n * @param origin The origin of the focus request.\n * @internal\n */\n focus(): void {\n this.elementRef?.nativeElement.focus();\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -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.3", ngImport: i0, type: RdxToggleGroupButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
61
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.3.3", 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.3", 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.3", ngImport: i0, type: RdxToggleGroupMultiDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
196
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.3.3", 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.3", 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.3", ngImport: i0, type: RdxToggleGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
346
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "17.3.3", 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.3", 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 * The touched callback.\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 * The touched callback.\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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"}
@@ -2,13 +2,18 @@ import { ElementRef } from '@angular/core';
2
2
  import * as i0 from "@angular/core";
3
3
  export declare class RdxLabelDirective {
4
4
  private el;
5
+ /** The HTML id attribute applied to this element. */
6
+ protected readonly _id: import("@angular/core").WritableSignal<string>;
5
7
  /**
6
8
  * The id of the element the label is associated with.
7
9
  * @default '-'
8
10
  */
9
11
  htmlFor: string;
12
+ /** The HTML id of the Label. */
13
+ set id(id: string);
14
+ get id(): string;
10
15
  constructor(el: ElementRef);
11
16
  onMouseDown(event: MouseEvent): void;
12
17
  static ɵfac: i0.ɵɵFactoryDeclaration<RdxLabelDirective, [{ optional: true; }]>;
13
- static ɵdir: i0.ɵɵDirectiveDeclaration<RdxLabelDirective, "label[rdxLabel]", never, { "htmlFor": { "alias": "htmlFor"; "required": false; }; }, {}, never, never, true, never>;
18
+ static ɵdir: i0.ɵɵDirectiveDeclaration<RdxLabelDirective, "label[rdxLabel]", never, { "htmlFor": { "alias": "htmlFor"; "required": false; }; "id": { "alias": "id"; "required": false; }; }, {}, never, never, true, never>;
14
19
  }