@rossigee/clarity-angular 18.2.1-fixed.1 → 18.2.1

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 (180) hide show
  1. package/fesm2022/clr-angular-accordion.mjs +355 -0
  2. package/fesm2022/clr-angular-accordion.mjs.map +1 -0
  3. package/fesm2022/clr-angular-button.mjs +713 -0
  4. package/fesm2022/clr-angular-button.mjs.map +1 -0
  5. package/fesm2022/clr-angular-collapsible-panel.mjs +201 -0
  6. package/fesm2022/clr-angular-collapsible-panel.mjs.map +1 -0
  7. package/fesm2022/clr-angular-data-datagrid.mjs +7635 -0
  8. package/fesm2022/clr-angular-data-datagrid.mjs.map +1 -0
  9. package/fesm2022/clr-angular-data-stack-view.mjs +442 -0
  10. package/fesm2022/clr-angular-data-stack-view.mjs.map +1 -0
  11. package/fesm2022/clr-angular-data-tree-view.mjs +1106 -0
  12. package/fesm2022/clr-angular-data-tree-view.mjs.map +1 -0
  13. package/fesm2022/clr-angular-data.mjs +40 -0
  14. package/fesm2022/clr-angular-data.mjs.map +1 -0
  15. package/fesm2022/clr-angular-emphasis-alert.mjs +624 -0
  16. package/fesm2022/clr-angular-emphasis-alert.mjs.map +1 -0
  17. package/fesm2022/clr-angular-emphasis-badge.mjs +69 -0
  18. package/fesm2022/clr-angular-emphasis-badge.mjs.map +1 -0
  19. package/fesm2022/clr-angular-emphasis-common.mjs +25 -0
  20. package/fesm2022/clr-angular-emphasis-common.mjs.map +1 -0
  21. package/fesm2022/clr-angular-emphasis-label.mjs +105 -0
  22. package/fesm2022/clr-angular-emphasis-label.mjs.map +1 -0
  23. package/fesm2022/clr-angular-emphasis.mjs +41 -0
  24. package/fesm2022/clr-angular-emphasis.mjs.map +1 -0
  25. package/fesm2022/clr-angular-forms-checkbox.mjs +270 -0
  26. package/fesm2022/clr-angular-forms-checkbox.mjs.map +1 -0
  27. package/fesm2022/clr-angular-forms-combobox.mjs +1775 -0
  28. package/fesm2022/clr-angular-forms-combobox.mjs.map +1 -0
  29. package/fesm2022/clr-angular-forms-common.mjs +1251 -0
  30. package/fesm2022/clr-angular-forms-common.mjs.map +1 -0
  31. package/fesm2022/clr-angular-forms-datalist.mjs +263 -0
  32. package/fesm2022/clr-angular-forms-datalist.mjs.map +1 -0
  33. package/fesm2022/clr-angular-forms-datepicker.mjs +3274 -0
  34. package/fesm2022/clr-angular-forms-datepicker.mjs.map +1 -0
  35. package/fesm2022/clr-angular-forms-file-input.mjs +826 -0
  36. package/fesm2022/clr-angular-forms-file-input.mjs.map +1 -0
  37. package/fesm2022/clr-angular-forms-input.mjs +153 -0
  38. package/fesm2022/clr-angular-forms-input.mjs.map +1 -0
  39. package/fesm2022/clr-angular-forms-number-input.mjs +236 -0
  40. package/fesm2022/clr-angular-forms-number-input.mjs.map +1 -0
  41. package/fesm2022/clr-angular-forms-password.mjs +233 -0
  42. package/fesm2022/clr-angular-forms-password.mjs.map +1 -0
  43. package/fesm2022/clr-angular-forms-radio.mjs +231 -0
  44. package/fesm2022/clr-angular-forms-radio.mjs.map +1 -0
  45. package/fesm2022/clr-angular-forms-range.mjs +186 -0
  46. package/fesm2022/clr-angular-forms-range.mjs.map +1 -0
  47. package/fesm2022/clr-angular-forms-select.mjs +153 -0
  48. package/fesm2022/clr-angular-forms-select.mjs.map +1 -0
  49. package/fesm2022/clr-angular-forms-textarea.mjs +136 -0
  50. package/fesm2022/clr-angular-forms-textarea.mjs.map +1 -0
  51. package/fesm2022/clr-angular-forms.mjs +100 -0
  52. package/fesm2022/clr-angular-forms.mjs.map +1 -0
  53. package/fesm2022/clr-angular-icon.mjs +7397 -0
  54. package/fesm2022/clr-angular-icon.mjs.map +1 -0
  55. package/fesm2022/clr-angular-layout-breadcrumbs.mjs +120 -0
  56. package/fesm2022/clr-angular-layout-breadcrumbs.mjs.map +1 -0
  57. package/fesm2022/clr-angular-layout-main-container.mjs +100 -0
  58. package/fesm2022/clr-angular-layout-main-container.mjs.map +1 -0
  59. package/fesm2022/clr-angular-layout-nav.mjs +582 -0
  60. package/fesm2022/clr-angular-layout-nav.mjs.map +1 -0
  61. package/fesm2022/clr-angular-layout-tabs.mjs +807 -0
  62. package/fesm2022/clr-angular-layout-tabs.mjs.map +1 -0
  63. package/fesm2022/clr-angular-layout-vertical-nav.mjs +507 -0
  64. package/fesm2022/clr-angular-layout-vertical-nav.mjs.map +1 -0
  65. package/fesm2022/clr-angular-layout.mjs +44 -0
  66. package/fesm2022/clr-angular-layout.mjs.map +1 -0
  67. package/fesm2022/clr-angular-modal.mjs +617 -0
  68. package/fesm2022/clr-angular-modal.mjs.map +1 -0
  69. package/fesm2022/clr-angular-popover-common.mjs +1082 -0
  70. package/fesm2022/clr-angular-popover-common.mjs.map +1 -0
  71. package/fesm2022/clr-angular-popover-dropdown.mjs +492 -0
  72. package/fesm2022/clr-angular-popover-dropdown.mjs.map +1 -0
  73. package/fesm2022/clr-angular-popover-signpost.mjs +494 -0
  74. package/fesm2022/clr-angular-popover-signpost.mjs.map +1 -0
  75. package/fesm2022/clr-angular-popover-tooltip.mjs +293 -0
  76. package/fesm2022/clr-angular-popover-tooltip.mjs.map +1 -0
  77. package/fesm2022/clr-angular-popover.mjs +41 -0
  78. package/fesm2022/clr-angular-popover.mjs.map +1 -0
  79. package/fesm2022/clr-angular-progress-progress-bars.mjs +217 -0
  80. package/fesm2022/clr-angular-progress-progress-bars.mjs.map +1 -0
  81. package/fesm2022/clr-angular-progress-spinner.mjs +132 -0
  82. package/fesm2022/clr-angular-progress-spinner.mjs.map +1 -0
  83. package/fesm2022/clr-angular-stepper.mjs +694 -0
  84. package/fesm2022/clr-angular-stepper.mjs.map +1 -0
  85. package/fesm2022/clr-angular-timeline.mjs +316 -0
  86. package/fesm2022/clr-angular-timeline.mjs.map +1 -0
  87. package/fesm2022/clr-angular-utils-conditional.mjs +351 -0
  88. package/fesm2022/clr-angular-utils-conditional.mjs.map +1 -0
  89. package/fesm2022/clr-angular-utils-loading.mjs +107 -0
  90. package/fesm2022/clr-angular-utils-loading.mjs.map +1 -0
  91. package/fesm2022/clr-angular-utils.mjs +2079 -0
  92. package/fesm2022/clr-angular-utils.mjs.map +1 -0
  93. package/fesm2022/clr-angular-wizard.mjs +3074 -0
  94. package/fesm2022/clr-angular-wizard.mjs.map +1 -0
  95. package/fesm2022/clr-angular.mjs +2 -2
  96. package/fesm2022/clr-angular.mjs.map +1 -1
  97. package/package.json +7 -5
  98. package/schematics/ng-update/index.d.ts +2 -0
  99. package/schematics/ng-update/index.js +69 -0
  100. package/schematics/ng-update/index.js.map +1 -0
  101. package/schematics/ng-update/migrations/css-migration.d.ts +6 -0
  102. package/schematics/ng-update/migrations/css-migration.js +177 -0
  103. package/schematics/ng-update/migrations/css-migration.js.map +1 -0
  104. package/schematics/ng-update/migrations/import-migration.d.ts +4 -0
  105. package/schematics/ng-update/migrations/import-migration.js +187 -0
  106. package/schematics/ng-update/migrations/import-migration.js.map +1 -0
  107. package/schematics/ng-update/migrations/template-migration.d.ts +6 -0
  108. package/schematics/ng-update/migrations/template-migration.js +261 -0
  109. package/schematics/ng-update/migrations/template-migration.js.map +1 -0
  110. package/schematics/ng-update/replacements/css-replacements.d.ts +17 -0
  111. package/schematics/ng-update/replacements/css-replacements.js +74 -0
  112. package/schematics/ng-update/replacements/css-replacements.js.map +1 -0
  113. package/schematics/ng-update/replacements/import-replacements.d.ts +13 -0
  114. package/schematics/ng-update/replacements/import-replacements.js +108 -0
  115. package/schematics/ng-update/replacements/import-replacements.js.map +1 -0
  116. package/schematics/ng-update/replacements/symbol-replacements.d.ts +12 -0
  117. package/schematics/ng-update/replacements/symbol-replacements.js +67 -0
  118. package/schematics/ng-update/replacements/symbol-replacements.js.map +1 -0
  119. package/schematics/ng-update/replacements/template-replacements.d.ts +19 -0
  120. package/schematics/ng-update/replacements/template-replacements.js +57 -0
  121. package/schematics/ng-update/replacements/template-replacements.js.map +1 -0
  122. package/schematics/ng-update/tests/test-helpers.d.ts +6 -0
  123. package/schematics/ng-update/tests/test-helpers.js +34 -0
  124. package/schematics/ng-update/tests/test-helpers.js.map +1 -0
  125. package/schematics/ng-update/utils/file-visitor.d.ts +8 -0
  126. package/schematics/ng-update/utils/file-visitor.js +44 -0
  127. package/schematics/ng-update/utils/file-visitor.js.map +1 -0
  128. package/schematics/ng-update/utils/regexp-utils.d.ts +16 -0
  129. package/schematics/ng-update/utils/regexp-utils.js +34 -0
  130. package/schematics/ng-update/utils/regexp-utils.js.map +1 -0
  131. package/schematics/vitest.config.d.ts +2 -0
  132. package/schematics/vitest.config.js +17 -0
  133. package/schematics/vitest.config.js.map +1 -0
  134. package/types/clr-angular-accordion.d.ts +100 -0
  135. package/types/clr-angular-button.d.ts +169 -0
  136. package/types/clr-angular-collapsible-panel.d.ts +73 -0
  137. package/types/clr-angular-data-datagrid.d.ts +1843 -0
  138. package/types/clr-angular-data-stack-view.d.ts +87 -0
  139. package/types/clr-angular-data-tree-view.d.ts +229 -0
  140. package/types/clr-angular-data.d.ts +15 -0
  141. package/types/clr-angular-emphasis-alert.d.ts +175 -0
  142. package/types/clr-angular-emphasis-badge.d.ts +25 -0
  143. package/types/clr-angular-emphasis-common.d.ts +6 -0
  144. package/types/clr-angular-emphasis-label.d.ts +29 -0
  145. package/types/clr-angular-emphasis.d.ts +15 -0
  146. package/types/clr-angular-forms-checkbox.d.ts +69 -0
  147. package/types/clr-angular-forms-combobox.d.ts +353 -0
  148. package/types/clr-angular-forms-common.d.ts +339 -0
  149. package/types/clr-angular-forms-datalist.d.ts +59 -0
  150. package/types/clr-angular-forms-datepicker.d.ts +986 -0
  151. package/types/clr-angular-forms-file-input.d.ts +193 -0
  152. package/types/clr-angular-forms-input.d.ts +29 -0
  153. package/types/clr-angular-forms-number-input.d.ts +43 -0
  154. package/types/clr-angular-forms-password.d.ts +52 -0
  155. package/types/clr-angular-forms-radio.d.ts +50 -0
  156. package/types/clr-angular-forms-range.d.ts +37 -0
  157. package/types/clr-angular-forms-select.d.ts +36 -0
  158. package/types/clr-angular-forms-textarea.d.ts +29 -0
  159. package/types/clr-angular-forms.d.ts +36 -0
  160. package/types/clr-angular-icon.d.ts +1498 -0
  161. package/types/clr-angular-layout-breadcrumbs.d.ts +45 -0
  162. package/types/clr-angular-layout-main-container.d.ts +28 -0
  163. package/types/clr-angular-layout-nav.d.ts +142 -0
  164. package/types/clr-angular-layout-tabs.d.ts +158 -0
  165. package/types/clr-angular-layout-vertical-nav.d.ts +128 -0
  166. package/types/clr-angular-layout.d.ts +19 -0
  167. package/types/clr-angular-modal.d.ts +160 -0
  168. package/types/clr-angular-popover-common.d.ts +254 -0
  169. package/types/clr-angular-popover-dropdown.d.ts +123 -0
  170. package/types/clr-angular-popover-signpost.d.ts +157 -0
  171. package/types/clr-angular-popover-tooltip.d.ts +83 -0
  172. package/types/clr-angular-popover.d.ts +16 -0
  173. package/types/clr-angular-progress-progress-bars.d.ts +57 -0
  174. package/types/clr-angular-progress-spinner.d.ts +44 -0
  175. package/types/clr-angular-stepper.d.ts +179 -0
  176. package/types/clr-angular-timeline.d.ts +86 -0
  177. package/types/clr-angular-utils-conditional.d.ts +132 -0
  178. package/types/clr-angular-utils-loading.d.ts +38 -0
  179. package/types/clr-angular-utils.d.ts +913 -0
  180. package/types/clr-angular-wizard.d.ts +1508 -0
@@ -0,0 +1,582 @@
1
+ import * as i0 from '@angular/core';
2
+ import { Directive, Injectable, Optional, Input, HostBinding, Component, DOCUMENT, createComponent, PLATFORM_ID, HostListener, Inject, NgModule } from '@angular/core';
3
+ import * as i1 from '@clr/angular/utils';
4
+ import { WillyWonka, OompaLoompa, commonStringsDefault, LARGE_BREAKPOINT, ClrStandaloneCdkTrapFocus } from '@clr/angular/utils';
5
+ import { ReplaySubject, Subject } from 'rxjs';
6
+ import { filter } from 'rxjs/operators';
7
+ import { isPlatformBrowser, CommonModule } from '@angular/common';
8
+ import { ClarityIcons, timesIcon, ClrIcon } from '@clr/angular/icon';
9
+ import * as i1$1 from '@angular/router';
10
+ import { ClrDropdownModule } from '@clr/angular/popover/dropdown';
11
+
12
+ /*
13
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
14
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
15
+ * This software is released under MIT license.
16
+ * The full license information can be found in LICENSE in the root directory of this project.
17
+ */
18
+ class MainContainerWillyWonka extends WillyWonka {
19
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MainContainerWillyWonka, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
20
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.3", type: MainContainerWillyWonka, isStandalone: false, selector: "clr-main-container", usesInheritance: true, ngImport: i0 }); }
21
+ }
22
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: MainContainerWillyWonka, decorators: [{
23
+ type: Directive,
24
+ args: [{
25
+ selector: 'clr-main-container',
26
+ standalone: false,
27
+ }]
28
+ }] });
29
+
30
+ /*
31
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
32
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
33
+ * This software is released under MIT license.
34
+ * The full license information can be found in LICENSE in the root directory of this project.
35
+ */
36
+ class ResponsiveNavCodes {
37
+ static { this.NAV_LEVEL_1 = 1; }
38
+ static { this.NAV_LEVEL_2 = 2; }
39
+ static { this.NAV_CLOSE_ALL = 'NAV_CLOSE_ALL'; }
40
+ static { this.NAV_OPEN = 'NAV_OPEN'; }
41
+ static { this.NAV_CLOSE = 'NAV_CLOSE'; }
42
+ static { this.NAV_TOGGLE = 'NAV_TOGGLE'; }
43
+ static { this.NAV_CLASS_HAMBURGER_MENU = 'open-hamburger-menu'; }
44
+ static { this.NAV_CLASS_OVERFLOW_MENU = 'open-overflow-menu'; }
45
+ static { this.NAV_CLASS_TRIGGER_1 = 'header-hamburger-trigger'; }
46
+ static { this.NAV_CLASS_TRIGGER_2 = 'header-overflow-trigger'; }
47
+ static { this.NAV_CLASS_LEVEL_1 = 'clr-nav-level-1'; }
48
+ static { this.NAV_CLASS_LEVEL_2 = 'clr-nav-level-2'; }
49
+ }
50
+
51
+ /*
52
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
53
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
54
+ * This software is released under MIT license.
55
+ * The full license information can be found in LICENSE in the root directory of this project.
56
+ */
57
+ class ResponsiveNavControlMessage {
58
+ constructor(_controlCode, _navLevel) {
59
+ this._controlCode = _controlCode;
60
+ this._navLevel = _navLevel;
61
+ }
62
+ get controlCode() {
63
+ return this._controlCode;
64
+ }
65
+ get navLevel() {
66
+ return this._navLevel;
67
+ }
68
+ }
69
+
70
+ /*
71
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
72
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
73
+ * This software is released under MIT license.
74
+ * The full license information can be found in LICENSE in the root directory of this project.
75
+ */
76
+ class ResponsiveNavigationService {
77
+ constructor() {
78
+ this.responsiveNavList = [];
79
+ this.registerNavSubject = new ReplaySubject();
80
+ this.controlNavSubject = new Subject();
81
+ this.closeAllNavs(); // We start with all navs closed
82
+ }
83
+ get registeredNavs() {
84
+ return this.registerNavSubject.asObservable();
85
+ }
86
+ get navControl() {
87
+ return this.controlNavSubject.asObservable();
88
+ }
89
+ registerNav(navLevel) {
90
+ if (!navLevel || this.isNavRegistered(navLevel)) {
91
+ return;
92
+ }
93
+ this.responsiveNavList.push(navLevel);
94
+ this.registerNavSubject.next(this.responsiveNavList);
95
+ }
96
+ isNavRegistered(navLevel) {
97
+ if (this.responsiveNavList.indexOf(navLevel) > -1) {
98
+ console.error('Multiple clr-nav-level ' + navLevel + ' attributes found. Please make sure that only one exists');
99
+ return true;
100
+ }
101
+ return false;
102
+ }
103
+ unregisterNav(navLevel) {
104
+ const index = this.responsiveNavList.indexOf(navLevel);
105
+ if (index > -1) {
106
+ this.responsiveNavList.splice(index, 1);
107
+ this.registerNavSubject.next(this.responsiveNavList);
108
+ }
109
+ }
110
+ sendControlMessage(controlCode, navLevel) {
111
+ const message = new ResponsiveNavControlMessage(controlCode, navLevel);
112
+ this.controlNavSubject.next(message);
113
+ }
114
+ closeAllNavs() {
115
+ const message = new ResponsiveNavControlMessage(ResponsiveNavCodes.NAV_CLOSE_ALL, -999);
116
+ this.controlNavSubject.next(message);
117
+ }
118
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ResponsiveNavigationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
119
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ResponsiveNavigationService, providedIn: 'root' }); }
120
+ }
121
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ResponsiveNavigationService, decorators: [{
122
+ type: Injectable,
123
+ args: [{ providedIn: 'root' }]
124
+ }], ctorParameters: () => [] });
125
+
126
+ /*
127
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
128
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
129
+ * This software is released under MIT license.
130
+ * The full license information can be found in LICENSE in the root directory of this project.
131
+ */
132
+ class NavDetectionOompaLoompa extends OompaLoompa {
133
+ constructor(cdr, willyWonka, responsiveNavService) {
134
+ if (!willyWonka) {
135
+ throw new Error('clr-header should only be used inside of a clr-main-container');
136
+ }
137
+ super(cdr, willyWonka);
138
+ this.responsiveNavService = responsiveNavService;
139
+ }
140
+ // NavDetectionOompaLoompa is the addition of the nav levels
141
+ // Since we support 2 levels, the possibilities are 0, 1 or 3 (1 + 2)
142
+ get flavor() {
143
+ return this.responsiveNavService.responsiveNavList.reduce((sum, navLevel) => sum + navLevel, 0);
144
+ }
145
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NavDetectionOompaLoompa, deps: [{ token: i0.ChangeDetectorRef }, { token: MainContainerWillyWonka, optional: true }, { token: ResponsiveNavigationService }], target: i0.ɵɵFactoryTarget.Directive }); }
146
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.3", type: NavDetectionOompaLoompa, isStandalone: false, selector: "clr-header", usesInheritance: true, ngImport: i0 }); }
147
+ }
148
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NavDetectionOompaLoompa, decorators: [{
149
+ type: Directive,
150
+ args: [{
151
+ selector: 'clr-header',
152
+ standalone: false,
153
+ }]
154
+ }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: MainContainerWillyWonka, decorators: [{
155
+ type: Optional
156
+ }] }, { type: ResponsiveNavigationService }] });
157
+
158
+ /*
159
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
160
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
161
+ * This software is released under MIT license.
162
+ * The full license information can be found in LICENSE in the root directory of this project.
163
+ */
164
+
165
+ /*
166
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
167
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
168
+ * This software is released under MIT license.
169
+ * The full license information can be found in LICENSE in the root directory of this project.
170
+ */
171
+ class ClrHeader {
172
+ constructor(responsiveNavService, commonStrings) {
173
+ this.responsiveNavService = responsiveNavService;
174
+ this.commonStrings = commonStrings;
175
+ this.role = 'banner';
176
+ this.isNavLevel1OnPage = false;
177
+ this.isNavLevel2OnPage = false;
178
+ this.openNavLevel = null;
179
+ this.responsiveNavCodes = ResponsiveNavCodes;
180
+ this._subscription = responsiveNavService.registeredNavs.subscribe({
181
+ next: (navLevelList) => {
182
+ this.initializeNavTriggers(navLevelList);
183
+ },
184
+ });
185
+ this._subscription.add(responsiveNavService.navControl
186
+ .pipe(filter(({ controlCode }) => controlCode === ResponsiveNavCodes.NAV_CLOSE || controlCode === ResponsiveNavCodes.NAV_CLOSE_ALL))
187
+ .subscribe(() => {
188
+ this.openNavLevel = null;
189
+ }));
190
+ }
191
+ get responsiveNavCommonString() {
192
+ const myCommonStrings = this.commonStrings.keys;
193
+ if (this.openNavLevel !== this.responsiveNavCodes.NAV_LEVEL_1) {
194
+ return myCommonStrings.responsiveNavToggleOpen;
195
+ }
196
+ else {
197
+ return myCommonStrings.responsiveNavToggleClose;
198
+ }
199
+ }
200
+ get responsiveOverflowCommonString() {
201
+ const myCommonStrings = this.commonStrings.keys;
202
+ if (this.openNavLevel !== this.responsiveNavCodes.NAV_LEVEL_2) {
203
+ return myCommonStrings.responsiveNavOverflowOpen;
204
+ }
205
+ else {
206
+ return myCommonStrings.responsiveNavOverflowClose;
207
+ }
208
+ }
209
+ // reset triggers. handles cases when an application has different nav levels on different pages.
210
+ resetNavTriggers() {
211
+ this.isNavLevel1OnPage = false;
212
+ this.isNavLevel2OnPage = false;
213
+ }
214
+ // decides which triggers to show on the header
215
+ initializeNavTriggers(navList) {
216
+ this.resetNavTriggers();
217
+ if (navList.length > 2) {
218
+ console.error('More than 2 Nav Levels detected.');
219
+ return;
220
+ }
221
+ navList.forEach(navLevel => {
222
+ if (navLevel === ResponsiveNavCodes.NAV_LEVEL_1) {
223
+ this.isNavLevel1OnPage = true;
224
+ }
225
+ else if (navLevel === ResponsiveNavCodes.NAV_LEVEL_2) {
226
+ this.isNavLevel2OnPage = true;
227
+ }
228
+ });
229
+ }
230
+ // closes the nav that is open
231
+ closeOpenNav() {
232
+ this.responsiveNavService.closeAllNavs();
233
+ }
234
+ /**
235
+ * @deprecated Will be removed in with @clr/angular v15.0.0
236
+ *
237
+ * Use `openNav(navLevel)` instead to open the navigation and ResponsiveNavService to close it.
238
+ */
239
+ toggleNav(navLevel) {
240
+ if (this.openNavLevel === navLevel) {
241
+ this.responsiveNavService.sendControlMessage(ResponsiveNavCodes.NAV_CLOSE, navLevel);
242
+ return;
243
+ }
244
+ this.openNav(navLevel);
245
+ }
246
+ openNav(navLevel) {
247
+ this.openNavLevel = navLevel;
248
+ this.responsiveNavService.sendControlMessage(ResponsiveNavCodes.NAV_OPEN, navLevel);
249
+ }
250
+ ngOnDestroy() {
251
+ this._subscription.unsubscribe();
252
+ }
253
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ClrHeader, deps: [{ token: ResponsiveNavigationService }, { token: i1.ClrCommonStringsService }], target: i0.ɵɵFactoryTarget.Component }); }
254
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.3", type: ClrHeader, isStandalone: false, selector: "clr-header", inputs: { role: "role" }, host: { properties: { "class.header": "true", "attr.role": "this.role" } }, ngImport: i0, template: `
255
+ @if (isNavLevel1OnPage) {
256
+ <button
257
+ type="button"
258
+ class="header-hamburger-trigger"
259
+ [attr.aria-label]="responsiveNavCommonString"
260
+ (click)="openNav(responsiveNavCodes.NAV_LEVEL_1)"
261
+ >
262
+ <span></span>
263
+ </button>
264
+ }
265
+ <ng-content></ng-content>
266
+ @if (isNavLevel2OnPage) {
267
+ <button
268
+ type="button"
269
+ class="header-overflow-trigger"
270
+ [attr.aria-label]="responsiveOverflowCommonString"
271
+ (click)="openNav(responsiveNavCodes.NAV_LEVEL_2)"
272
+ >
273
+ <span></span>
274
+ </button>
275
+ }
276
+ <div class="header-backdrop" (click)="closeOpenNav()"></div>
277
+ `, isInline: true }); }
278
+ }
279
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ClrHeader, decorators: [{
280
+ type: Component,
281
+ args: [{
282
+ selector: 'clr-header',
283
+ template: `
284
+ @if (isNavLevel1OnPage) {
285
+ <button
286
+ type="button"
287
+ class="header-hamburger-trigger"
288
+ [attr.aria-label]="responsiveNavCommonString"
289
+ (click)="openNav(responsiveNavCodes.NAV_LEVEL_1)"
290
+ >
291
+ <span></span>
292
+ </button>
293
+ }
294
+ <ng-content></ng-content>
295
+ @if (isNavLevel2OnPage) {
296
+ <button
297
+ type="button"
298
+ class="header-overflow-trigger"
299
+ [attr.aria-label]="responsiveOverflowCommonString"
300
+ (click)="openNav(responsiveNavCodes.NAV_LEVEL_2)"
301
+ >
302
+ <span></span>
303
+ </button>
304
+ }
305
+ <div class="header-backdrop" (click)="closeOpenNav()"></div>
306
+ `,
307
+ host: { '[class.header]': 'true' },
308
+ standalone: false,
309
+ }]
310
+ }], ctorParameters: () => [{ type: ResponsiveNavigationService }, { type: i1.ClrCommonStringsService }], propDecorators: { role: [{
311
+ type: Input
312
+ }, {
313
+ type: HostBinding,
314
+ args: ['attr.role']
315
+ }] } });
316
+
317
+ /*
318
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
319
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
320
+ * This software is released under MIT license.
321
+ * The full license information can be found in LICENSE in the root directory of this project.
322
+ */
323
+ class ClrNavLevel {
324
+ constructor(platformId, cdkTrapFocus, responsiveNavService, elementRef, renderer, injector, environmentInjector, appRef) {
325
+ this.cdkTrapFocus = cdkTrapFocus;
326
+ this.responsiveNavService = responsiveNavService;
327
+ this.elementRef = elementRef;
328
+ this.renderer = renderer;
329
+ this.injector = injector;
330
+ this.environmentInjector = environmentInjector;
331
+ this.appRef = appRef;
332
+ this._isOpen = false;
333
+ if (isPlatformBrowser(platformId)) {
334
+ this._document = injector.get(DOCUMENT);
335
+ }
336
+ this._subscription = responsiveNavService.navControl
337
+ .pipe(filter(x => x.navLevel === this.level), filter(({ controlCode }) => (controlCode === ResponsiveNavCodes.NAV_OPEN && !this.isOpen) ||
338
+ (controlCode === ResponsiveNavCodes.NAV_CLOSE && this.isOpen)))
339
+ .subscribe(({ controlCode }) => {
340
+ if (controlCode === ResponsiveNavCodes.NAV_OPEN) {
341
+ this.open();
342
+ return;
343
+ }
344
+ this.close();
345
+ });
346
+ this._subscription.add(responsiveNavService.navControl
347
+ .pipe(filter(({ controlCode }) => controlCode === ResponsiveNavCodes.NAV_CLOSE_ALL))
348
+ .subscribe(() => this.close()));
349
+ }
350
+ get level() {
351
+ return this._level;
352
+ }
353
+ // getter to access the responsive navigation codes from the template
354
+ get responsiveNavCodes() {
355
+ return ResponsiveNavCodes;
356
+ }
357
+ get isOpen() {
358
+ return this._isOpen;
359
+ }
360
+ ngOnInit() {
361
+ this.cdkTrapFocus.enabled = false;
362
+ if (!this.closeButtonAriaLabel) {
363
+ this.closeButtonAriaLabel =
364
+ this._level === ResponsiveNavCodes.NAV_LEVEL_1
365
+ ? commonStringsDefault.responsiveNavToggleClose
366
+ : commonStringsDefault.responsiveNavOverflowClose;
367
+ }
368
+ if (this.level !== ResponsiveNavCodes.NAV_LEVEL_1 && this.level !== ResponsiveNavCodes.NAV_LEVEL_2) {
369
+ console.error('Nav Level can only be 1 or 2');
370
+ return;
371
+ }
372
+ this.responsiveNavService.registerNav(this.level);
373
+ this.addNavClass(this.level);
374
+ }
375
+ ngAfterViewInit() {
376
+ const closeButton = this.createCloseButton();
377
+ this.renderer.listen(closeButton, 'click', this.close.bind(this));
378
+ this.renderer.insertBefore(this.elementRef.nativeElement, closeButton, this.elementRef.nativeElement.firstChild);
379
+ if (this._document.body.clientWidth < LARGE_BREAKPOINT) {
380
+ /**
381
+ * Close if the document body is smaller than the large breakpoint for example:
382
+ * - Refreshing the page
383
+ * - Browser window size is changed when opening the applicaiton
384
+ * - Browser zoom is turned on and zoomed to a size that makes the document smaller than the large breakpoint
385
+ */
386
+ this.close();
387
+ }
388
+ }
389
+ ngOnDestroy() {
390
+ this.responsiveNavService.unregisterNav(this.level);
391
+ this._subscription.unsubscribe();
392
+ }
393
+ onResize(event) {
394
+ const target = event.target;
395
+ if (target.innerWidth < LARGE_BREAKPOINT && this.isOpen) {
396
+ this.close();
397
+ return;
398
+ }
399
+ this.showNavigation();
400
+ }
401
+ // TODO: Figure out whats the best way to do this. Possible methods
402
+ // 1. HostListener (current solution)
403
+ // 2. Directives on the .nav-link class. We discussed on moving away from class selectors but I forget the reason
404
+ // why
405
+ onMouseClick(target) {
406
+ let current = target; // Get the element in the DOM on which the mouse was clicked
407
+ const navHost = this.elementRef.nativeElement; // Get the current nav native HTML element
408
+ // Start checking if current and navHost are equal.
409
+ // If not traverse to the parentNode and check again.
410
+ while (current) {
411
+ if (current === navHost) {
412
+ return;
413
+ }
414
+ else if (current.classList.contains('nav-link') && this._document.body.clientWidth < LARGE_BREAKPOINT) {
415
+ this.close();
416
+ return;
417
+ }
418
+ current = current.parentNode;
419
+ }
420
+ }
421
+ addNavClass(level) {
422
+ const navHostClassList = this.elementRef.nativeElement.classList;
423
+ if (level === ResponsiveNavCodes.NAV_LEVEL_1) {
424
+ navHostClassList.add(ResponsiveNavCodes.NAV_CLASS_LEVEL_1);
425
+ }
426
+ else if (level === ResponsiveNavCodes.NAV_LEVEL_2) {
427
+ navHostClassList.add(ResponsiveNavCodes.NAV_CLASS_LEVEL_2);
428
+ }
429
+ }
430
+ open() {
431
+ this._isOpen = true;
432
+ this.showNavigation();
433
+ this.cdkTrapFocus.enabled = true;
434
+ this.showCloseButton();
435
+ this.responsiveNavService.sendControlMessage(ResponsiveNavCodes.NAV_OPEN, this.level);
436
+ }
437
+ close() {
438
+ this._isOpen = false;
439
+ this.hideNavigation();
440
+ this.cdkTrapFocus.enabled = false;
441
+ this.hideCloseButton();
442
+ this.responsiveNavService.sendControlMessage(ResponsiveNavCodes.NAV_CLOSE, this.level);
443
+ }
444
+ hideNavigation() {
445
+ this.renderer.setAttribute(this.elementRef.nativeElement, 'aria-hidden', 'true');
446
+ this.renderer.setAttribute(this.elementRef.nativeElement, 'hidden', 'true');
447
+ }
448
+ showNavigation() {
449
+ this.renderer.setAttribute(this.elementRef.nativeElement, 'aria-hidden', 'false');
450
+ this.renderer.removeAttribute(this.elementRef.nativeElement, 'hidden');
451
+ }
452
+ hideCloseButton() {
453
+ this.renderer.setAttribute(this.elementRef.nativeElement, 'aria-hidden', 'true');
454
+ this.renderer.setAttribute(this.elementRef.nativeElement.querySelector('.clr-nav-close'), 'hidden', 'true');
455
+ }
456
+ showCloseButton() {
457
+ this.renderer.setAttribute(this.elementRef.nativeElement.querySelector('.clr-nav-close'), 'aria-hidden', 'false');
458
+ this.renderer.removeAttribute(this.elementRef.nativeElement.querySelector('.clr-nav-close'), 'hidden');
459
+ }
460
+ createCloseButton() {
461
+ ClarityIcons.addIcons(timesIcon);
462
+ const closeButton = this._document.createElement('button');
463
+ closeButton.setAttribute('aria-label', this.closeButtonAriaLabel);
464
+ closeButton.setAttribute('aria-hidden', 'true');
465
+ closeButton.setAttribute('hidden', 'true');
466
+ closeButton.className = 'clr-nav-close';
467
+ const iconRef = createComponent(ClrIcon, {
468
+ hostElement: this._document.createElement('cds-icon'),
469
+ environmentInjector: this.environmentInjector,
470
+ elementInjector: this.injector,
471
+ });
472
+ iconRef.instance.shape = 'times';
473
+ iconRef.instance.size = '32';
474
+ this.appRef.attachView(iconRef.hostView);
475
+ closeButton.appendChild(iconRef.location.nativeElement);
476
+ return closeButton;
477
+ }
478
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ClrNavLevel, deps: [{ token: PLATFORM_ID }, { token: i1.ClrStandaloneCdkTrapFocus }, { token: ResponsiveNavigationService }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.Injector }, { token: i0.EnvironmentInjector }, { token: i0.ApplicationRef }], target: i0.ɵɵFactoryTarget.Directive }); }
479
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.3", type: ClrNavLevel, isStandalone: false, selector: "[clr-nav-level]", inputs: { _level: ["clr-nav-level", "_level"], closeButtonAriaLabel: ["closeAriaLabel", "closeButtonAriaLabel"] }, host: { listeners: { "window:resize": "onResize($event)", "click": "onMouseClick($event.target)" } }, hostDirectives: [{ directive: i1.ClrStandaloneCdkTrapFocus }], ngImport: i0 }); }
480
+ }
481
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ClrNavLevel, decorators: [{
482
+ type: Directive,
483
+ args: [{
484
+ selector: '[clr-nav-level]',
485
+ hostDirectives: [ClrStandaloneCdkTrapFocus],
486
+ standalone: false,
487
+ }]
488
+ }], ctorParameters: () => [{ type: undefined, decorators: [{
489
+ type: Inject,
490
+ args: [PLATFORM_ID]
491
+ }] }, { type: i1.ClrStandaloneCdkTrapFocus }, { type: ResponsiveNavigationService }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.Injector }, { type: i0.EnvironmentInjector }, { type: i0.ApplicationRef }], propDecorators: { _level: [{
492
+ type: Input,
493
+ args: ['clr-nav-level']
494
+ }], closeButtonAriaLabel: [{
495
+ type: Input,
496
+ args: ['closeAriaLabel']
497
+ }], onResize: [{
498
+ type: HostListener,
499
+ args: ['window:resize', ['$event']]
500
+ }], onMouseClick: [{
501
+ type: HostListener,
502
+ args: ['click', ['$event.target']]
503
+ }] } });
504
+
505
+ /*
506
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
507
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
508
+ * This software is released under MIT license.
509
+ * The full license information can be found in LICENSE in the root directory of this project.
510
+ */
511
+ class ClrAriaCurrentLink {
512
+ constructor(rla) {
513
+ this.rla = rla;
514
+ }
515
+ ngOnInit() {
516
+ this.subscription = this.rla.isActiveChange.subscribe(isActive => {
517
+ this.ariaCurrent = isActive ? 'page' : undefined;
518
+ });
519
+ }
520
+ ngOnDestroy() {
521
+ this.subscription.unsubscribe();
522
+ }
523
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ClrAriaCurrentLink, deps: [{ token: i1$1.RouterLinkActive }], target: i0.ɵɵFactoryTarget.Directive }); }
524
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.3", type: ClrAriaCurrentLink, isStandalone: false, selector: "[clrAriaCurrentLink]", host: { properties: { "attr.aria-current": "ariaCurrent" } }, ngImport: i0 }); }
525
+ }
526
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ClrAriaCurrentLink, decorators: [{
527
+ type: Directive,
528
+ args: [{
529
+ selector: '[clrAriaCurrentLink]',
530
+ host: { '[attr.aria-current]': 'ariaCurrent' },
531
+ standalone: false,
532
+ }]
533
+ }], ctorParameters: () => [{ type: i1$1.RouterLinkActive }] });
534
+
535
+ /*
536
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
537
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
538
+ * This software is released under MIT license.
539
+ * The full license information can be found in LICENSE in the root directory of this project.
540
+ */
541
+ const CLR_NAVIGATION_DIRECTIVES = [
542
+ ClrHeader,
543
+ ClrNavLevel,
544
+ ClrAriaCurrentLink,
545
+ NavDetectionOompaLoompa,
546
+ MainContainerWillyWonka,
547
+ ];
548
+ class ClrNavigationModule {
549
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ClrNavigationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
550
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.3", ngImport: i0, type: ClrNavigationModule, declarations: [ClrHeader,
551
+ ClrNavLevel,
552
+ ClrAriaCurrentLink,
553
+ NavDetectionOompaLoompa,
554
+ MainContainerWillyWonka], imports: [CommonModule, ClrIcon, ClrDropdownModule], exports: [ClrHeader,
555
+ ClrNavLevel,
556
+ ClrAriaCurrentLink,
557
+ NavDetectionOompaLoompa,
558
+ MainContainerWillyWonka] }); }
559
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ClrNavigationModule, imports: [CommonModule, ClrIcon, ClrDropdownModule] }); }
560
+ }
561
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: ClrNavigationModule, decorators: [{
562
+ type: NgModule,
563
+ args: [{
564
+ imports: [CommonModule, ClrIcon, ClrDropdownModule],
565
+ declarations: [CLR_NAVIGATION_DIRECTIVES],
566
+ exports: [CLR_NAVIGATION_DIRECTIVES],
567
+ }]
568
+ }] });
569
+
570
+ /*
571
+ * Copyright (c) 2016-2026 Broadcom. All Rights Reserved.
572
+ * The term "Broadcom" refers to Broadcom Inc. and/or its subsidiaries.
573
+ * This software is released under MIT license.
574
+ * The full license information can be found in LICENSE in the root directory of this project.
575
+ */
576
+
577
+ /**
578
+ * Generated bundle index. Do not edit.
579
+ */
580
+
581
+ export { CLR_NAVIGATION_DIRECTIVES, ClrAriaCurrentLink, ClrHeader, ClrNavLevel, ClrNavigationModule, MainContainerWillyWonka, NavDetectionOompaLoompa, ResponsiveNavCodes, ResponsiveNavControlMessage, ResponsiveNavigationService };
582
+ //# sourceMappingURL=clr-angular-layout-nav.mjs.map