@rxap/layout 18.0.2 → 18.0.3-dev.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 (182) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/README.md +14 -1
  3. package/compodoc/changelog.html +732 -0
  4. package/compodoc/components/AppsButtonComponent.html +604 -0
  5. package/compodoc/components/FooterComponent.html +487 -0
  6. package/compodoc/components/HeaderComponent.html +781 -0
  7. package/compodoc/components/LanguageSelectorComponent.html +526 -0
  8. package/compodoc/components/LayoutComponent.html +1035 -0
  9. package/compodoc/components/NavigationComponent.html +1156 -0
  10. package/compodoc/components/NavigationItemComponent.html +1328 -0
  11. package/compodoc/components/NavigationProgressBarComponent.html +550 -0
  12. package/compodoc/components/ResetButtonComponent.html +486 -0
  13. package/compodoc/components/SettingsButtonComponent.html +1416 -0
  14. package/compodoc/components/SidenavComponent.html +689 -0
  15. package/compodoc/components/SidenavToggleButtonComponent.html +517 -0
  16. package/compodoc/components/SignOutComponent.html +493 -0
  17. package/compodoc/components/ToggleWindowSidenavButtonComponent.html +549 -0
  18. package/compodoc/components/UserProfileIconComponent.html +657 -0
  19. package/compodoc/components/VersionComponent.html +524 -0
  20. package/compodoc/components/WindowContainerSidenavComponent.html +687 -0
  21. package/compodoc/dependencies.html +241 -0
  22. package/compodoc/directives/FooterDirective.html +371 -0
  23. package/compodoc/directives/SidenavFooterDirective.html +387 -0
  24. package/compodoc/directives/SidenavHeaderDirective.html +387 -0
  25. package/compodoc/fonts/ionicons.eot +0 -0
  26. package/compodoc/fonts/ionicons.svg +2090 -0
  27. package/compodoc/fonts/ionicons.ttf +0 -0
  28. package/compodoc/fonts/ionicons.woff +0 -0
  29. package/compodoc/fonts/ionicons.woff2 +0 -0
  30. package/compodoc/fonts/roboto-v15-latin-300.eot +0 -0
  31. package/compodoc/fonts/roboto-v15-latin-300.svg +314 -0
  32. package/compodoc/fonts/roboto-v15-latin-300.ttf +0 -0
  33. package/compodoc/fonts/roboto-v15-latin-300.woff +0 -0
  34. package/compodoc/fonts/roboto-v15-latin-300.woff2 +0 -0
  35. package/compodoc/fonts/roboto-v15-latin-700.eot +0 -0
  36. package/compodoc/fonts/roboto-v15-latin-700.svg +310 -0
  37. package/compodoc/fonts/roboto-v15-latin-700.ttf +0 -0
  38. package/compodoc/fonts/roboto-v15-latin-700.woff +0 -0
  39. package/compodoc/fonts/roboto-v15-latin-700.woff2 +0 -0
  40. package/compodoc/fonts/roboto-v15-latin-italic.eot +0 -0
  41. package/compodoc/fonts/roboto-v15-latin-italic.svg +323 -0
  42. package/compodoc/fonts/roboto-v15-latin-italic.ttf +0 -0
  43. package/compodoc/fonts/roboto-v15-latin-italic.woff +0 -0
  44. package/compodoc/fonts/roboto-v15-latin-italic.woff2 +0 -0
  45. package/compodoc/fonts/roboto-v15-latin-regular.eot +0 -0
  46. package/compodoc/fonts/roboto-v15-latin-regular.svg +308 -0
  47. package/compodoc/fonts/roboto-v15-latin-regular.ttf +0 -0
  48. package/compodoc/fonts/roboto-v15-latin-regular.woff +0 -0
  49. package/compodoc/fonts/roboto-v15-latin-regular.woff2 +0 -0
  50. package/compodoc/graph/dependencies.svg +24 -0
  51. package/compodoc/images/compodoc-vectorise-inverted.png +0 -0
  52. package/compodoc/images/compodoc-vectorise-inverted.svg +201 -0
  53. package/compodoc/images/compodoc-vectorise.png +0 -0
  54. package/compodoc/images/compodoc-vectorise.svg +201 -0
  55. package/compodoc/images/favicon.ico +0 -0
  56. package/compodoc/index.html +197 -0
  57. package/compodoc/injectables/AppUrlService.html +829 -0
  58. package/compodoc/injectables/AuthenticationServiceMock.html +303 -0
  59. package/compodoc/injectables/LayoutComponentService.html +848 -0
  60. package/compodoc/injectables/NavigationService.html +1081 -0
  61. package/compodoc/injectables/ReplaceRouterPathsService.html +337 -0
  62. package/compodoc/injectables/SidenavComponentService.html +408 -0
  63. package/compodoc/interfaces/ExternalApps.html +634 -0
  64. package/compodoc/interfaces/LogoConfig.html +381 -0
  65. package/compodoc/interfaces/NavigationDividerItem.html +385 -0
  66. package/compodoc/interfaces/NavigationInsertItem.html +340 -0
  67. package/compodoc/interfaces/NavigationItem.html +520 -0
  68. package/compodoc/interfaces/NavigationStatus.html +376 -0
  69. package/compodoc/js/compodoc.js +14 -0
  70. package/compodoc/js/lazy-load-graphs.js +44 -0
  71. package/compodoc/js/libs/EventDispatcher.js +5 -0
  72. package/compodoc/js/libs/bootstrap-native.js +2 -0
  73. package/compodoc/js/libs/clipboard.min.js +7 -0
  74. package/compodoc/js/libs/custom-elements-es5-adapter.js +15 -0
  75. package/compodoc/js/libs/custom-elements.min.js +38 -0
  76. package/compodoc/js/libs/d3.v3.min.js +2 -0
  77. package/compodoc/js/libs/deep-iterator.js +2 -0
  78. package/compodoc/js/libs/es6-shim.min.js +12 -0
  79. package/compodoc/js/libs/htmlparser.js +23 -0
  80. package/compodoc/js/libs/innersvg.js +9 -0
  81. package/compodoc/js/libs/lit-html.js +1 -0
  82. package/compodoc/js/libs/prism.js +46 -0
  83. package/compodoc/js/libs/promise.min.js +6 -0
  84. package/compodoc/js/libs/svg-pan-zoom.min.js +3 -0
  85. package/compodoc/js/libs/tablesort.min.js +6 -0
  86. package/compodoc/js/libs/tablesort.number.min.js +6 -0
  87. package/compodoc/js/libs/vis.min.js +47 -0
  88. package/compodoc/js/libs/zepto.min.js +2 -0
  89. package/compodoc/js/menu-wc.js +237 -0
  90. package/compodoc/js/menu-wc_es5.js +40 -0
  91. package/compodoc/js/menu.js +270 -0
  92. package/compodoc/js/routes.js +301 -0
  93. package/compodoc/js/search/lunr.min.js +6 -0
  94. package/compodoc/js/search/search-lunr.js +67 -0
  95. package/compodoc/js/search/search.js +283 -0
  96. package/compodoc/js/search/search_index.js +4 -0
  97. package/compodoc/js/sourceCode.js +58 -0
  98. package/compodoc/js/svg-pan-zoom.controls.js +53 -0
  99. package/compodoc/js/tabs.js +21 -0
  100. package/compodoc/js/tree.js +147 -0
  101. package/compodoc/license.html +731 -0
  102. package/compodoc/miscellaneous/functions.html +460 -0
  103. package/compodoc/miscellaneous/typealiases.html +256 -0
  104. package/compodoc/miscellaneous/variables.html +370 -0
  105. package/compodoc/modules.html +183 -0
  106. package/compodoc/overview.html +225 -0
  107. package/compodoc/pipes/ReplaceRouterPathsPipe.html +363 -0
  108. package/compodoc/properties.html +195 -0
  109. package/compodoc/styles/bootstrap-card.css +219 -0
  110. package/compodoc/styles/bootstrap.min.css +6 -0
  111. package/compodoc/styles/compodoc.css +1124 -0
  112. package/compodoc/styles/dark.css +121 -0
  113. package/compodoc/styles/ionicons.min.css +11 -0
  114. package/compodoc/styles/laravel.css +113 -0
  115. package/compodoc/styles/material.css +131 -0
  116. package/compodoc/styles/original.css +51 -0
  117. package/compodoc/styles/postmark.css +238 -0
  118. package/compodoc/styles/prism.css +301 -0
  119. package/compodoc/styles/readthedocs.css +117 -0
  120. package/compodoc/styles/reset.css +129 -0
  121. package/compodoc/styles/stripe.css +106 -0
  122. package/compodoc/styles/style.css +7 -0
  123. package/compodoc/styles/tablesort.css +33 -0
  124. package/compodoc/styles/vagrant.css +130 -0
  125. package/docs/.nojekyll +1 -0
  126. package/docs/assets/highlight.css +43 -0
  127. package/docs/assets/icons.js +15 -0
  128. package/docs/assets/icons.svg +1 -0
  129. package/docs/assets/main.js +59 -0
  130. package/docs/assets/navigation.js +1 -0
  131. package/docs/assets/search.js +1 -0
  132. package/docs/assets/style.css +1412 -0
  133. package/docs/classes/AppUrlService.html +13 -0
  134. package/docs/classes/AppsButtonComponent.html +9 -0
  135. package/docs/classes/AuthenticationServiceMock.html +3 -0
  136. package/docs/classes/FooterComponent.html +3 -0
  137. package/docs/classes/FooterDirective.html +8 -0
  138. package/docs/classes/HeaderComponent.html +8 -0
  139. package/docs/classes/LanguageSelectorComponent.html +3 -0
  140. package/docs/classes/LayoutComponent.html +18 -0
  141. package/docs/classes/LayoutComponentService.html +15 -0
  142. package/docs/classes/NavigationComponent.html +15 -0
  143. package/docs/classes/NavigationItemComponent.html +22 -0
  144. package/docs/classes/NavigationProgressBarComponent.html +4 -0
  145. package/docs/classes/NavigationService.html +17 -0
  146. package/docs/classes/ReplaceRouterPathsPipe.html +4 -0
  147. package/docs/classes/ReplaceRouterPathsService.html +3 -0
  148. package/docs/classes/ResetButtonComponent.html +3 -0
  149. package/docs/classes/SettingsButtonComponent.html +30 -0
  150. package/docs/classes/SidenavComponent.html +5 -0
  151. package/docs/classes/SidenavComponentService.html +5 -0
  152. package/docs/classes/SidenavFooterDirective.html +3 -0
  153. package/docs/classes/SidenavHeaderDirective.html +3 -0
  154. package/docs/classes/SidenavToggleButtonComponent.html +4 -0
  155. package/docs/classes/SignOutComponent.html +4 -0
  156. package/docs/classes/ToggleWindowSidenavButtonComponent.html +5 -0
  157. package/docs/classes/UserProfileIconComponent.html +6 -0
  158. package/docs/classes/VersionComponent.html +7 -0
  159. package/docs/classes/WindowContainerSidenavComponent.html +10 -0
  160. package/docs/documentation.json +13308 -0
  161. package/docs/functions/IsNavigationDividerItem.html +1 -0
  162. package/docs/functions/IsNavigationInsertItem.html +1 -0
  163. package/docs/functions/IsNavigationItem.html +1 -0
  164. package/docs/index.html +25 -0
  165. package/docs/interfaces/ExternalApps.html +8 -0
  166. package/docs/interfaces/LogoConfig.html +4 -0
  167. package/docs/interfaces/NavigationDividerItem.html +3 -0
  168. package/docs/interfaces/NavigationInsertItem.html +2 -0
  169. package/docs/interfaces/NavigationItem.html +6 -0
  170. package/docs/interfaces/NavigationStatus.html +2 -0
  171. package/docs/modules.html +47 -0
  172. package/docs/types/ExtractUsernameFromProfileFn.html +1 -0
  173. package/docs/types/Navigation.html +1 -0
  174. package/docs/types/NavigationWithInserts.html +1 -0
  175. package/docs/variables/EXTRACT_USERNAME_FROM_PROFILE.html +1 -0
  176. package/docs/variables/RXAP_FOOTER_COMPONENT.html +1 -0
  177. package/docs/variables/RXAP_HEADER_COMPONENT.html +1 -0
  178. package/docs/variables/RXAP_LAYOUT_APPS_GRID.html +1 -0
  179. package/docs/variables/RXAP_LOGO_CONFIG.html +1 -0
  180. package/docs/variables/RXAP_NAVIGATION_CONFIG.html +1 -0
  181. package/docs/variables/RXAP_NAVIGATION_CONFIG_INSERTS.html +1 -0
  182. package/package.json +46 -44
@@ -0,0 +1,1416 @@
1
+ <!doctype html>
2
+ <html class="no-js" lang="">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta http-equiv="x-ua-compatible" content="ie=edge">
6
+ <title>angular-layout</title>
7
+ <meta name="description" content="">
8
+ <meta name="viewport" content="width=device-width, initial-scale=1">
9
+
10
+ <link rel="icon" type="image/x-icon" href="../images/favicon.ico">
11
+ <link rel="stylesheet" href="../styles/style.css">
12
+ <link rel="stylesheet" href="../styles/dark.css">
13
+ </head>
14
+ <body>
15
+ <script>
16
+ // Blocking script to avoid flickering dark mode
17
+ // Dark mode toggle button
18
+ var useDark = window.matchMedia('(prefers-color-scheme: dark)');
19
+ var darkModeState = useDark.matches;
20
+ var $darkModeToggleSwitchers = document.querySelectorAll('.dark-mode-switch input');
21
+ var $darkModeToggles = document.querySelectorAll('.dark-mode-switch');
22
+ var darkModeStateLocal = localStorage.getItem('compodoc_darkmode-state');
23
+
24
+ function checkToggle(check) {
25
+ for (var i = 0; i < $darkModeToggleSwitchers.length; i++) {
26
+ $darkModeToggleSwitchers[i].checked = check;
27
+ }
28
+ }
29
+
30
+ function toggleDarkMode(state) {
31
+ if (window.localStorage) {
32
+ localStorage.setItem('compodoc_darkmode-state', state);
33
+ }
34
+
35
+ checkToggle(state);
36
+
37
+ const hasClass = document.body.classList.contains('dark');
38
+
39
+ if (state) {
40
+ for (var i = 0; i < $darkModeToggles.length; i++) {
41
+ $darkModeToggles[i].classList.add('dark');
42
+ }
43
+ if (!hasClass) {
44
+ document.body.classList.add('dark');
45
+ }
46
+ } else {
47
+ for (var i = 0; i < $darkModeToggles.length; i++) {
48
+ $darkModeToggles[i].classList.remove('dark');
49
+ }
50
+ if (hasClass) {
51
+ document.body.classList.remove('dark');
52
+ }
53
+ }
54
+ }
55
+
56
+ useDark.addEventListener('change', function (evt) {
57
+ toggleDarkMode(evt.matches);
58
+ });
59
+ if (darkModeStateLocal) {
60
+ darkModeState = darkModeStateLocal === 'true';
61
+ }
62
+ toggleDarkMode(darkModeState);
63
+ </script>
64
+
65
+ <div class="navbar navbar-default navbar-fixed-top d-md-none p-0">
66
+ <div class="d-flex">
67
+ <a href="../" class="navbar-brand">angular-layout</a>
68
+ <button type="button" class="btn btn-default btn-menu ion-ios-menu" id="btn-menu"></button>
69
+ </div>
70
+ </div>
71
+
72
+ <div class="xs-menu menu" id="mobile-menu">
73
+ <div id="book-search-input" role="search"><input type="text" placeholder="Type to search"></div> <compodoc-menu></compodoc-menu>
74
+ </div>
75
+
76
+ <div class="container-fluid main">
77
+ <div class="row main">
78
+ <div class="d-none d-md-block menu">
79
+ <compodoc-menu mode="normal"></compodoc-menu>
80
+ </div>
81
+ <!-- START CONTENT -->
82
+ <div class="content component">
83
+ <div class="content-data">
84
+
85
+
86
+
87
+
88
+ <ol class="breadcrumb">
89
+ <li class="breadcrumb-item">Components</li>
90
+ <li class="breadcrumb-item"
91
+ >
92
+ SettingsButtonComponent</li>
93
+ </ol>
94
+
95
+ <ul class="nav nav-tabs" role="tablist">
96
+ <li class="nav-item">
97
+ <a href="#info" class="nav-link active"
98
+ role="tab" id="info-tab" data-bs-toggle="tab" data-link="info">Info</a>
99
+ </li>
100
+ <li class="nav-item">
101
+ <a href="#source" class="nav-link"
102
+ role="tab" id="source-tab" data-bs-toggle="tab" data-link="source">Source</a>
103
+ </li>
104
+ <li class="nav-item">
105
+ <a href="#templateData" class="nav-link"
106
+ role="tab" id="templateData-tab" data-bs-toggle="tab" data-link="template">Template</a>
107
+ </li>
108
+ <li class="nav-item">
109
+ <a href="#styleData" class="nav-link"
110
+ role="tab" id="styleData-tab" data-bs-toggle="tab" data-link="style">Styles</a>
111
+ </li>
112
+ <li class="nav-item">
113
+ <a href="#tree" class="nav-link"
114
+ role="tab" id="tree-tab" data-bs-toggle="tab" data-link="dom-tree">DOM Tree</a>
115
+ </li>
116
+ </ul>
117
+
118
+ <div class="tab-content">
119
+ <div class="tab-pane fade active in" id="info"><p class="comment">
120
+ <h3>File</h3>
121
+ </p>
122
+ <p class="comment">
123
+ <code>src/lib/header/settings-button/settings-button.component.ts</code>
124
+ </p>
125
+
126
+
127
+
128
+
129
+ <p class="comment">
130
+ <h3>Implements</h3>
131
+ </p>
132
+ <p class="comment">
133
+ <code>OnInit</code>
134
+ <code>OnDestroy</code>
135
+ </p>
136
+
137
+
138
+ <section data-compodoc="block-metadata">
139
+ <h3>Metadata</h3>
140
+ <table class="table table-sm table-hover metadata">
141
+ <tbody>
142
+
143
+
144
+
145
+
146
+
147
+
148
+
149
+
150
+
151
+
152
+
153
+
154
+ <tr>
155
+ <td class="col-md-3">selector</td>
156
+ <td class="col-md-9"><code>rxap-settings-button</code></td>
157
+ </tr>
158
+
159
+ <tr>
160
+ <td class="col-md-3">standalone</td>
161
+ <td class="col-md-9"><code>true</code></td>
162
+ </tr>
163
+
164
+ <tr>
165
+ <td class="col-md-3">imports</td>
166
+ <td class="col-md-9">
167
+ <code>CommonModule</code>
168
+ <code>MatButtonModule</code>
169
+ <code>MatIconModule</code>
170
+ <code><a href="../components/LanguageSelectorComponent.html" target="_self" >LanguageSelectorComponent</a></code>
171
+ <code>MatMenuModule</code>
172
+ <code>PortalModule</code>
173
+ </td>
174
+ </tr>
175
+
176
+ <tr>
177
+ <td class="col-md-3">styleUrls</td>
178
+ <td class="col-md-9"><code>./settings-button.component.scss</code></td>
179
+ </tr>
180
+
181
+
182
+
183
+ <tr>
184
+ <td class="col-md-3">templateUrl</td>
185
+ <td class="col-md-9"><code>./settings-button.component.html</code></td>
186
+ </tr>
187
+
188
+
189
+
190
+
191
+
192
+
193
+
194
+
195
+ </tbody>
196
+ </table>
197
+ </section>
198
+
199
+ <section data-compodoc="block-index">
200
+ <h3 id="index">Index</h3>
201
+ <table class="table table-sm table-bordered index-table">
202
+ <tbody>
203
+ <tr>
204
+ <td class="col-md-4">
205
+ <h6><b>Properties</b></h6>
206
+ </td>
207
+ </tr>
208
+ <tr>
209
+ <td class="col-md-4">
210
+ <ul class="index-list">
211
+ <li>
212
+ <span class="modifier">Public</span>
213
+ <span class="modifier">Readonly</span>
214
+ <a href="#availableThemes" >availableThemes</a>
215
+ </li>
216
+ <li>
217
+ <span class="modifier">Public</span>
218
+ <span class="modifier">Readonly</span>
219
+ <a href="#availableTypographies" >availableTypographies</a>
220
+ </li>
221
+ <li>
222
+ <span class="modifier">Public</span>
223
+ <a href="#isDevMode" >isDevMode</a>
224
+ </li>
225
+ <li>
226
+ <a href="#items" >items</a>
227
+ </li>
228
+ <li>
229
+ <span class="modifier">Public</span>
230
+ <span class="modifier">Readonly</span>
231
+ <a href="#theme" >theme</a>
232
+ </li>
233
+ </ul>
234
+ </td>
235
+ </tr>
236
+
237
+ <tr>
238
+ <td class="col-md-4">
239
+ <h6><b>Methods</b></h6>
240
+ </td>
241
+ </tr>
242
+ <tr>
243
+ <td class="col-md-4">
244
+ <ul class="index-list">
245
+ <li>
246
+ <a href="#openChangelogDialog" >openChangelogDialog</a>
247
+ </li>
248
+ <li>
249
+ <a href="#previewDensity" >previewDensity</a>
250
+ </li>
251
+ <li>
252
+ <a href="#previewTheme" >previewTheme</a>
253
+ </li>
254
+ <li>
255
+ <a href="#previewTypography" >previewTypography</a>
256
+ </li>
257
+ <li>
258
+ <a href="#restoreDensity" >restoreDensity</a>
259
+ </li>
260
+ <li>
261
+ <a href="#restoreTheme" >restoreTheme</a>
262
+ </li>
263
+ <li>
264
+ <a href="#restoreTypography" >restoreTypography</a>
265
+ </li>
266
+ <li>
267
+ <a href="#setDensity" >setDensity</a>
268
+ </li>
269
+ <li>
270
+ <a href="#setTheme" >setTheme</a>
271
+ </li>
272
+ <li>
273
+ <a href="#setTypography" >setTypography</a>
274
+ </li>
275
+ </ul>
276
+ </td>
277
+ </tr>
278
+
279
+
280
+
281
+
282
+
283
+ </tbody>
284
+ </table>
285
+ </section>
286
+
287
+ <section data-compodoc="block-constructor">
288
+ <h3 id="constructor">Constructor</h3>
289
+ <table class="table table-sm table-bordered">
290
+ <tbody>
291
+ <tr>
292
+ <td class="col-md-4">
293
+ <code>constructor(theme: ThemeService, route: ActivatedRoute, injector: Injector, changelogService: ChangelogService)</code>
294
+ </td>
295
+ </tr>
296
+ <tr>
297
+ <td class="col-md-4">
298
+ <div class="io-line">Defined in <a href="" data-line="54" class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:54</a></div>
299
+ </td>
300
+ </tr>
301
+
302
+ <tr>
303
+ <td class="col-md-4">
304
+ <div>
305
+ <b>Parameters :</b>
306
+ <table class="params">
307
+ <thead>
308
+ <tr>
309
+ <td>Name</td>
310
+ <td>Type</td>
311
+ <td>Optional</td>
312
+ </tr>
313
+ </thead>
314
+ <tbody>
315
+ <tr>
316
+ <td>theme</td>
317
+
318
+ <td>
319
+ <code>ThemeService</code>
320
+ </td>
321
+
322
+ <td>
323
+ No
324
+ </td>
325
+
326
+ </tr>
327
+ <tr>
328
+ <td>route</td>
329
+
330
+ <td>
331
+ <code>ActivatedRoute</code>
332
+ </td>
333
+
334
+ <td>
335
+ No
336
+ </td>
337
+
338
+ </tr>
339
+ <tr>
340
+ <td>injector</td>
341
+
342
+ <td>
343
+ <code>Injector</code>
344
+ </td>
345
+
346
+ <td>
347
+ No
348
+ </td>
349
+
350
+ </tr>
351
+ <tr>
352
+ <td>changelogService</td>
353
+
354
+ <td>
355
+ <code>ChangelogService</code>
356
+ </td>
357
+
358
+ <td>
359
+ No
360
+ </td>
361
+
362
+ </tr>
363
+ </tbody>
364
+ </table>
365
+ </div>
366
+ </td>
367
+ </tr>
368
+ </tbody>
369
+ </table>
370
+ </section>
371
+
372
+
373
+
374
+
375
+
376
+ <section data-compodoc="block-methods">
377
+
378
+ <h3 id="methods">
379
+ Methods
380
+ </h3>
381
+ <table class="table table-sm table-bordered">
382
+ <tbody>
383
+ <tr>
384
+ <td class="col-md-4">
385
+ <a name="openChangelogDialog"></a>
386
+ <span class="name">
387
+ <span ><b>openChangelogDialog</b></span>
388
+ <a href="#openChangelogDialog"><span class="icon ion-ios-link"></span></a>
389
+ </span>
390
+ </td>
391
+ </tr>
392
+ <tr>
393
+ <td class="col-md-4">
394
+ <code>openChangelogDialog()</code>
395
+ </td>
396
+ </tr>
397
+
398
+
399
+ <tr>
400
+ <td class="col-md-4">
401
+ <div class="io-line">Defined in <a href="" data-line="85"
402
+ class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:85</a></div>
403
+ </td>
404
+ </tr>
405
+
406
+
407
+ <tr>
408
+ <td class="col-md-4">
409
+
410
+ <div class="io-description">
411
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
412
+
413
+ </div>
414
+ </td>
415
+ </tr>
416
+ </tbody>
417
+ </table>
418
+ <table class="table table-sm table-bordered">
419
+ <tbody>
420
+ <tr>
421
+ <td class="col-md-4">
422
+ <a name="previewDensity"></a>
423
+ <span class="name">
424
+ <span ><b>previewDensity</b></span>
425
+ <a href="#previewDensity"><span class="icon ion-ios-link"></span></a>
426
+ </span>
427
+ </td>
428
+ </tr>
429
+ <tr>
430
+ <td class="col-md-4">
431
+ <code>previewDensity(density: ThemeDensity)</code>
432
+ </td>
433
+ </tr>
434
+
435
+
436
+ <tr>
437
+ <td class="col-md-4">
438
+ <div class="io-line">Defined in <a href="" data-line="89"
439
+ class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:89</a></div>
440
+ </td>
441
+ </tr>
442
+
443
+
444
+ <tr>
445
+ <td class="col-md-4">
446
+
447
+ <div class="io-description">
448
+ <b>Parameters :</b>
449
+
450
+ <table class="params">
451
+ <thead>
452
+ <tr>
453
+ <td>Name</td>
454
+ <td>Type</td>
455
+ <td>Optional</td>
456
+ </tr>
457
+ </thead>
458
+ <tbody>
459
+ <tr>
460
+ <td>density</td>
461
+ <td>
462
+ <code>ThemeDensity</code>
463
+ </td>
464
+
465
+ <td>
466
+ No
467
+ </td>
468
+
469
+
470
+ </tr>
471
+ </tbody>
472
+ </table>
473
+ </div>
474
+ <div class="io-description">
475
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
476
+
477
+ </div>
478
+ <div class="io-description">
479
+
480
+ </div>
481
+ </td>
482
+ </tr>
483
+ </tbody>
484
+ </table>
485
+ <table class="table table-sm table-bordered">
486
+ <tbody>
487
+ <tr>
488
+ <td class="col-md-4">
489
+ <a name="previewTheme"></a>
490
+ <span class="name">
491
+ <span ><b>previewTheme</b></span>
492
+ <a href="#previewTheme"><span class="icon ion-ios-link"></span></a>
493
+ </span>
494
+ </td>
495
+ </tr>
496
+ <tr>
497
+ <td class="col-md-4">
498
+ <code>previewTheme(theme: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank">string</a>)</code>
499
+ </td>
500
+ </tr>
501
+
502
+
503
+ <tr>
504
+ <td class="col-md-4">
505
+ <div class="io-line">Defined in <a href="" data-line="113"
506
+ class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:113</a></div>
507
+ </td>
508
+ </tr>
509
+
510
+
511
+ <tr>
512
+ <td class="col-md-4">
513
+
514
+ <div class="io-description">
515
+ <b>Parameters :</b>
516
+
517
+ <table class="params">
518
+ <thead>
519
+ <tr>
520
+ <td>Name</td>
521
+ <td>Type</td>
522
+ <td>Optional</td>
523
+ </tr>
524
+ </thead>
525
+ <tbody>
526
+ <tr>
527
+ <td>theme</td>
528
+ <td>
529
+ <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
530
+ </td>
531
+
532
+ <td>
533
+ No
534
+ </td>
535
+
536
+
537
+ </tr>
538
+ </tbody>
539
+ </table>
540
+ </div>
541
+ <div class="io-description">
542
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
543
+
544
+ </div>
545
+ <div class="io-description">
546
+
547
+ </div>
548
+ </td>
549
+ </tr>
550
+ </tbody>
551
+ </table>
552
+ <table class="table table-sm table-bordered">
553
+ <tbody>
554
+ <tr>
555
+ <td class="col-md-4">
556
+ <a name="previewTypography"></a>
557
+ <span class="name">
558
+ <span ><b>previewTypography</b></span>
559
+ <a href="#previewTypography"><span class="icon ion-ios-link"></span></a>
560
+ </span>
561
+ </td>
562
+ </tr>
563
+ <tr>
564
+ <td class="col-md-4">
565
+ <code>previewTypography(typography: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank">string</a>)</code>
566
+ </td>
567
+ </tr>
568
+
569
+
570
+ <tr>
571
+ <td class="col-md-4">
572
+ <div class="io-line">Defined in <a href="" data-line="101"
573
+ class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:101</a></div>
574
+ </td>
575
+ </tr>
576
+
577
+
578
+ <tr>
579
+ <td class="col-md-4">
580
+
581
+ <div class="io-description">
582
+ <b>Parameters :</b>
583
+
584
+ <table class="params">
585
+ <thead>
586
+ <tr>
587
+ <td>Name</td>
588
+ <td>Type</td>
589
+ <td>Optional</td>
590
+ </tr>
591
+ </thead>
592
+ <tbody>
593
+ <tr>
594
+ <td>typography</td>
595
+ <td>
596
+ <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
597
+ </td>
598
+
599
+ <td>
600
+ No
601
+ </td>
602
+
603
+
604
+ </tr>
605
+ </tbody>
606
+ </table>
607
+ </div>
608
+ <div class="io-description">
609
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
610
+
611
+ </div>
612
+ <div class="io-description">
613
+
614
+ </div>
615
+ </td>
616
+ </tr>
617
+ </tbody>
618
+ </table>
619
+ <table class="table table-sm table-bordered">
620
+ <tbody>
621
+ <tr>
622
+ <td class="col-md-4">
623
+ <a name="restoreDensity"></a>
624
+ <span class="name">
625
+ <span ><b>restoreDensity</b></span>
626
+ <a href="#restoreDensity"><span class="icon ion-ios-link"></span></a>
627
+ </span>
628
+ </td>
629
+ </tr>
630
+ <tr>
631
+ <td class="col-md-4">
632
+ <code>restoreDensity()</code>
633
+ </td>
634
+ </tr>
635
+
636
+
637
+ <tr>
638
+ <td class="col-md-4">
639
+ <div class="io-line">Defined in <a href="" data-line="93"
640
+ class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:93</a></div>
641
+ </td>
642
+ </tr>
643
+
644
+
645
+ <tr>
646
+ <td class="col-md-4">
647
+
648
+ <div class="io-description">
649
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
650
+
651
+ </div>
652
+ </td>
653
+ </tr>
654
+ </tbody>
655
+ </table>
656
+ <table class="table table-sm table-bordered">
657
+ <tbody>
658
+ <tr>
659
+ <td class="col-md-4">
660
+ <a name="restoreTheme"></a>
661
+ <span class="name">
662
+ <span ><b>restoreTheme</b></span>
663
+ <a href="#restoreTheme"><span class="icon ion-ios-link"></span></a>
664
+ </span>
665
+ </td>
666
+ </tr>
667
+ <tr>
668
+ <td class="col-md-4">
669
+ <code>restoreTheme()</code>
670
+ </td>
671
+ </tr>
672
+
673
+
674
+ <tr>
675
+ <td class="col-md-4">
676
+ <div class="io-line">Defined in <a href="" data-line="117"
677
+ class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:117</a></div>
678
+ </td>
679
+ </tr>
680
+
681
+
682
+ <tr>
683
+ <td class="col-md-4">
684
+
685
+ <div class="io-description">
686
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
687
+
688
+ </div>
689
+ </td>
690
+ </tr>
691
+ </tbody>
692
+ </table>
693
+ <table class="table table-sm table-bordered">
694
+ <tbody>
695
+ <tr>
696
+ <td class="col-md-4">
697
+ <a name="restoreTypography"></a>
698
+ <span class="name">
699
+ <span ><b>restoreTypography</b></span>
700
+ <a href="#restoreTypography"><span class="icon ion-ios-link"></span></a>
701
+ </span>
702
+ </td>
703
+ </tr>
704
+ <tr>
705
+ <td class="col-md-4">
706
+ <code>restoreTypography()</code>
707
+ </td>
708
+ </tr>
709
+
710
+
711
+ <tr>
712
+ <td class="col-md-4">
713
+ <div class="io-line">Defined in <a href="" data-line="105"
714
+ class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:105</a></div>
715
+ </td>
716
+ </tr>
717
+
718
+
719
+ <tr>
720
+ <td class="col-md-4">
721
+
722
+ <div class="io-description">
723
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
724
+
725
+ </div>
726
+ </td>
727
+ </tr>
728
+ </tbody>
729
+ </table>
730
+ <table class="table table-sm table-bordered">
731
+ <tbody>
732
+ <tr>
733
+ <td class="col-md-4">
734
+ <a name="setDensity"></a>
735
+ <span class="name">
736
+ <span ><b>setDensity</b></span>
737
+ <a href="#setDensity"><span class="icon ion-ios-link"></span></a>
738
+ </span>
739
+ </td>
740
+ </tr>
741
+ <tr>
742
+ <td class="col-md-4">
743
+ <code>setDensity(density: ThemeDensity)</code>
744
+ </td>
745
+ </tr>
746
+
747
+
748
+ <tr>
749
+ <td class="col-md-4">
750
+ <div class="io-line">Defined in <a href="" data-line="97"
751
+ class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:97</a></div>
752
+ </td>
753
+ </tr>
754
+
755
+
756
+ <tr>
757
+ <td class="col-md-4">
758
+
759
+ <div class="io-description">
760
+ <b>Parameters :</b>
761
+
762
+ <table class="params">
763
+ <thead>
764
+ <tr>
765
+ <td>Name</td>
766
+ <td>Type</td>
767
+ <td>Optional</td>
768
+ </tr>
769
+ </thead>
770
+ <tbody>
771
+ <tr>
772
+ <td>density</td>
773
+ <td>
774
+ <code>ThemeDensity</code>
775
+ </td>
776
+
777
+ <td>
778
+ No
779
+ </td>
780
+
781
+
782
+ </tr>
783
+ </tbody>
784
+ </table>
785
+ </div>
786
+ <div class="io-description">
787
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
788
+
789
+ </div>
790
+ <div class="io-description">
791
+
792
+ </div>
793
+ </td>
794
+ </tr>
795
+ </tbody>
796
+ </table>
797
+ <table class="table table-sm table-bordered">
798
+ <tbody>
799
+ <tr>
800
+ <td class="col-md-4">
801
+ <a name="setTheme"></a>
802
+ <span class="name">
803
+ <span ><b>setTheme</b></span>
804
+ <a href="#setTheme"><span class="icon ion-ios-link"></span></a>
805
+ </span>
806
+ </td>
807
+ </tr>
808
+ <tr>
809
+ <td class="col-md-4">
810
+ <code>setTheme(theme: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank">string</a>)</code>
811
+ </td>
812
+ </tr>
813
+
814
+
815
+ <tr>
816
+ <td class="col-md-4">
817
+ <div class="io-line">Defined in <a href="" data-line="121"
818
+ class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:121</a></div>
819
+ </td>
820
+ </tr>
821
+
822
+
823
+ <tr>
824
+ <td class="col-md-4">
825
+
826
+ <div class="io-description">
827
+ <b>Parameters :</b>
828
+
829
+ <table class="params">
830
+ <thead>
831
+ <tr>
832
+ <td>Name</td>
833
+ <td>Type</td>
834
+ <td>Optional</td>
835
+ </tr>
836
+ </thead>
837
+ <tbody>
838
+ <tr>
839
+ <td>theme</td>
840
+ <td>
841
+ <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
842
+ </td>
843
+
844
+ <td>
845
+ No
846
+ </td>
847
+
848
+
849
+ </tr>
850
+ </tbody>
851
+ </table>
852
+ </div>
853
+ <div class="io-description">
854
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
855
+
856
+ </div>
857
+ <div class="io-description">
858
+
859
+ </div>
860
+ </td>
861
+ </tr>
862
+ </tbody>
863
+ </table>
864
+ <table class="table table-sm table-bordered">
865
+ <tbody>
866
+ <tr>
867
+ <td class="col-md-4">
868
+ <a name="setTypography"></a>
869
+ <span class="name">
870
+ <span ><b>setTypography</b></span>
871
+ <a href="#setTypography"><span class="icon ion-ios-link"></span></a>
872
+ </span>
873
+ </td>
874
+ </tr>
875
+ <tr>
876
+ <td class="col-md-4">
877
+ <code>setTypography(typography: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank">string</a>)</code>
878
+ </td>
879
+ </tr>
880
+
881
+
882
+ <tr>
883
+ <td class="col-md-4">
884
+ <div class="io-line">Defined in <a href="" data-line="109"
885
+ class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:109</a></div>
886
+ </td>
887
+ </tr>
888
+
889
+
890
+ <tr>
891
+ <td class="col-md-4">
892
+
893
+ <div class="io-description">
894
+ <b>Parameters :</b>
895
+
896
+ <table class="params">
897
+ <thead>
898
+ <tr>
899
+ <td>Name</td>
900
+ <td>Type</td>
901
+ <td>Optional</td>
902
+ </tr>
903
+ </thead>
904
+ <tbody>
905
+ <tr>
906
+ <td>typography</td>
907
+ <td>
908
+ <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/string" target="_blank" >string</a></code>
909
+ </td>
910
+
911
+ <td>
912
+ No
913
+ </td>
914
+
915
+
916
+ </tr>
917
+ </tbody>
918
+ </table>
919
+ </div>
920
+ <div class="io-description">
921
+ <b>Returns : </b> <code><a href="https://www.typescriptlang.org/docs/handbook/basic-types.html" target="_blank" >void</a></code>
922
+
923
+ </div>
924
+ <div class="io-description">
925
+
926
+ </div>
927
+ </td>
928
+ </tr>
929
+ </tbody>
930
+ </table>
931
+ </section>
932
+ <section data-compodoc="block-properties">
933
+
934
+ <h3 id="inputs">
935
+ Properties
936
+ </h3>
937
+ <table class="table table-sm table-bordered">
938
+ <tbody>
939
+ <tr>
940
+ <td class="col-md-4">
941
+ <a name="availableThemes"></a>
942
+ <span class="name">
943
+ <span class="modifier">Public</span>
944
+ <span class="modifier">Readonly</span>
945
+ <span ><b>availableThemes</b></span>
946
+ <a href="#availableThemes"><span class="icon ion-ios-link"></span></a>
947
+ </span>
948
+ </td>
949
+ </tr>
950
+ <tr>
951
+ <td class="col-md-4">
952
+ <i>Type : </i> <code>string[] | null</code>
953
+
954
+ </td>
955
+ </tr>
956
+ <tr>
957
+ <td class="col-md-4">
958
+ <div class="io-line">Defined in <a href="" data-line="53" class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:53</a></div>
959
+ </td>
960
+ </tr>
961
+
962
+
963
+ </tbody>
964
+ </table>
965
+ <table class="table table-sm table-bordered">
966
+ <tbody>
967
+ <tr>
968
+ <td class="col-md-4">
969
+ <a name="availableTypographies"></a>
970
+ <span class="name">
971
+ <span class="modifier">Public</span>
972
+ <span class="modifier">Readonly</span>
973
+ <span ><b>availableTypographies</b></span>
974
+ <a href="#availableTypographies"><span class="icon ion-ios-link"></span></a>
975
+ </span>
976
+ </td>
977
+ </tr>
978
+ <tr>
979
+ <td class="col-md-4">
980
+ <i>Type : </i> <code>string[] | null</code>
981
+
982
+ </td>
983
+ </tr>
984
+ <tr>
985
+ <td class="col-md-4">
986
+ <div class="io-line">Defined in <a href="" data-line="50" class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:50</a></div>
987
+ </td>
988
+ </tr>
989
+
990
+
991
+ </tbody>
992
+ </table>
993
+ <table class="table table-sm table-bordered">
994
+ <tbody>
995
+ <tr>
996
+ <td class="col-md-4">
997
+ <a name="isDevMode"></a>
998
+ <span class="name">
999
+ <span class="modifier">Public</span>
1000
+ <span ><b>isDevMode</b></span>
1001
+ <a href="#isDevMode"><span class="icon ion-ios-link"></span></a>
1002
+ </span>
1003
+ </td>
1004
+ </tr>
1005
+ <tr>
1006
+ <td class="col-md-4">
1007
+ <i>Default value : </i><code>isDevMode()</code>
1008
+ </td>
1009
+ </tr>
1010
+ <tr>
1011
+ <td class="col-md-4">
1012
+ <div class="io-line">Defined in <a href="" data-line="40" class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:40</a></div>
1013
+ </td>
1014
+ </tr>
1015
+
1016
+
1017
+ </tbody>
1018
+ </table>
1019
+ <table class="table table-sm table-bordered">
1020
+ <tbody>
1021
+ <tr>
1022
+ <td class="col-md-4">
1023
+ <a name="items"></a>
1024
+ <span class="name">
1025
+ <span ><b>items</b></span>
1026
+ <a href="#items"><span class="icon ion-ios-link"></span></a>
1027
+ </span>
1028
+ </td>
1029
+ </tr>
1030
+ <tr>
1031
+ <td class="col-md-4">
1032
+ <i>Default value : </i><code>signal&lt;Array&lt;ComponentPortal&lt;unknown&gt;&gt;&gt;([])</code>
1033
+ </td>
1034
+ </tr>
1035
+ <tr>
1036
+ <td class="col-md-4">
1037
+ <div class="io-line">Defined in <a href="" data-line="41" class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:41</a></div>
1038
+ </td>
1039
+ </tr>
1040
+
1041
+
1042
+ </tbody>
1043
+ </table>
1044
+ <table class="table table-sm table-bordered">
1045
+ <tbody>
1046
+ <tr>
1047
+ <td class="col-md-4">
1048
+ <a name="theme"></a>
1049
+ <span class="name">
1050
+ <span class="modifier">Public</span>
1051
+ <span class="modifier">Readonly</span>
1052
+ <span ><b>theme</b></span>
1053
+ <a href="#theme"><span class="icon ion-ios-link"></span></a>
1054
+ </span>
1055
+ </td>
1056
+ </tr>
1057
+ <tr>
1058
+ <td class="col-md-4">
1059
+ <i>Type : </i> <code>ThemeService</code>
1060
+
1061
+ </td>
1062
+ </tr>
1063
+ <tr>
1064
+ <td class="col-md-4">
1065
+ <div class="io-line">Defined in <a href="" data-line="57" class="link-to-prism">src/lib/header/settings-button/settings-button.component.ts:57</a></div>
1066
+ </td>
1067
+ </tr>
1068
+
1069
+
1070
+ </tbody>
1071
+ </table>
1072
+ </section>
1073
+
1074
+ </div>
1075
+
1076
+
1077
+ <div class="tab-pane fade tab-source-code" id="source">
1078
+ <pre class="line-numbers compodoc-sourcecode"><code class="language-typescript">import {
1079
+ ComponentPortal,
1080
+ ComponentType,
1081
+ PortalModule,
1082
+ } from &#x27;@angular/cdk/portal&#x27;;
1083
+ import { CommonModule } from &#x27;@angular/common&#x27;;
1084
+ import {
1085
+ Component,
1086
+ Injector,
1087
+ isDevMode,
1088
+ OnDestroy,
1089
+ OnInit,
1090
+ signal,
1091
+ } from &#x27;@angular/core&#x27;;
1092
+ import { MatButtonModule } from &#x27;@angular/material/button&#x27;;
1093
+ import { MatIconModule } from &#x27;@angular/material/icon&#x27;;
1094
+ import { MatMenuModule } from &#x27;@angular/material/menu&#x27;;
1095
+ import { ActivatedRoute } from &#x27;@angular/router&#x27;;
1096
+ import { ChangelogService } from &#x27;@rxap/ngx-changelog&#x27;;
1097
+ import {
1098
+ ThemeDensity,
1099
+ ThemeService,
1100
+ } from &#x27;@rxap/ngx-theme&#x27;;
1101
+ import { Subscription } from &#x27;rxjs&#x27;;
1102
+ import {
1103
+ map,
1104
+ tap,
1105
+ } from &#x27;rxjs/operators&#x27;;
1106
+ import { LanguageSelectorComponent } from &#x27;../language-selector/language-selector.component&#x27;;
1107
+
1108
+ @Component({
1109
+ selector: &#x27;rxap-settings-button&#x27;,
1110
+ standalone: true,
1111
+ imports: [ CommonModule, MatButtonModule, MatIconModule, LanguageSelectorComponent, MatMenuModule, PortalModule ],
1112
+ templateUrl: &#x27;./settings-button.component.html&#x27;,
1113
+ styleUrls: [ &#x27;./settings-button.component.scss&#x27; ],
1114
+ })
1115
+ export class SettingsButtonComponent implements OnInit, OnDestroy {
1116
+
1117
+ public isDevMode &#x3D; isDevMode();
1118
+ items &#x3D; signal&lt;Array&lt;ComponentPortal&lt;unknown&gt;&gt;&gt;([]);
1119
+ private _subscription?: Subscription;
1120
+
1121
+ private savePreviewDensityValue &#x3D; false;
1122
+ private currentDensityValue: ThemeDensity | null &#x3D; null;
1123
+
1124
+ private savePreviewTypographyValue &#x3D; false;
1125
+ private currentTypographyValue: string | null &#x3D; null;
1126
+
1127
+ public readonly availableTypographies: string[] | null;
1128
+ private savePreviewThemeValue &#x3D; false;
1129
+
1130
+ public readonly availableThemes: string[] | null;
1131
+ private currentThemeValue: string | null &#x3D; null;
1132
+
1133
+ constructor(
1134
+ public readonly theme: ThemeService,
1135
+ private readonly route: ActivatedRoute,
1136
+ private readonly injector: Injector,
1137
+ private readonly changelogService: ChangelogService,
1138
+ ) {
1139
+ this.availableThemes &#x3D; this.theme.getAvailableThemes();
1140
+ this.availableTypographies &#x3D; this.theme.getAvailableTypographies();
1141
+ }
1142
+
1143
+ ngOnDestroy() {
1144
+ this._subscription?.unsubscribe();
1145
+ }
1146
+
1147
+ ngOnInit() {
1148
+ this._subscription &#x3D; this.route.data.pipe(
1149
+ map(data &#x3D;&gt; this.getCustomMenuItems(data)),
1150
+ map(items &#x3D;&gt; items.map(item &#x3D;&gt; new ComponentPortal(item, undefined, this.injector))),
1151
+ tap(items &#x3D;&gt; this.items.set(items)),
1152
+ ).subscribe();
1153
+ }
1154
+
1155
+ private getCustomMenuItems(data: any): Array&lt;ComponentType&lt;unknown&gt;&gt; {
1156
+ if (data?.layout?.header?.menu?.items?.length) {
1157
+ return data.layout.header.menu.items;
1158
+ }
1159
+ return [];
1160
+ }
1161
+
1162
+ openChangelogDialog() {
1163
+ this.changelogService.showChangelogDialog();
1164
+ }
1165
+
1166
+ previewDensity(density: ThemeDensity) {
1167
+ this.theme.applyDensity(density);
1168
+ }
1169
+
1170
+ restoreDensity() {
1171
+ this.theme.applyDensity(this.theme.density());
1172
+ }
1173
+
1174
+ setDensity(density: ThemeDensity) {
1175
+ this.theme.setDensity(density);
1176
+ }
1177
+
1178
+ previewTypography(typography: string) {
1179
+ this.theme.applyTypography(typography);
1180
+ }
1181
+
1182
+ restoreTypography() {
1183
+ this.theme.applyTypography(this.theme.typography());
1184
+ }
1185
+
1186
+ setTypography(typography: string) {
1187
+ this.theme.setTypography(typography);
1188
+ }
1189
+
1190
+ previewTheme(theme: string) {
1191
+ this.theme.applyTheme(theme);
1192
+ }
1193
+
1194
+ restoreTheme() {
1195
+ this.theme.applyTheme(this.theme.themeName());
1196
+ }
1197
+
1198
+ setTheme(theme: string) {
1199
+ this.theme.setTheme(theme);
1200
+ }
1201
+
1202
+ }
1203
+ </code></pre>
1204
+ </div>
1205
+
1206
+ <div class="tab-pane fade " id="templateData">
1207
+ <pre class="line-numbers"><code class="language-html">&lt;button [matMenuTriggerFor]&#x3D;&quot;menu&quot; mat-icon-button&gt;
1208
+ &lt;mat-icon svgIcon&#x3D;&quot;cog&quot;&gt;&lt;/mat-icon&gt;
1209
+ &lt;/button&gt;
1210
+
1211
+ &lt;mat-menu #menu&#x3D;&quot;matMenu&quot;&gt;
1212
+ &lt;button (click)&#x3D;&quot;theme.toggleDarkTheme()&quot; mat-menu-item&gt;
1213
+ &lt;mat-icon *ngIf&#x3D;&quot;theme.darkMode()&quot; svgIcon&#x3D;&quot;brightness-2&quot;&gt;&lt;/mat-icon&gt;
1214
+ &lt;mat-icon *ngIf&#x3D;&quot;!theme.darkMode()&quot; svgIcon&#x3D;&quot;brightness-5&quot;&gt;&lt;/mat-icon&gt;
1215
+ &lt;span i18n&gt;Mode&lt;/span&gt;
1216
+ &lt;/button&gt;
1217
+ &lt;button [matMenuTriggerFor]&#x3D;&quot;themeMenu&quot; mat-menu-item&gt;
1218
+ &lt;mat-icon svgIcon&#x3D;&quot;compare&quot;&gt;&lt;/mat-icon&gt;
1219
+ &lt;span i18n&gt;Theme&lt;/span&gt;
1220
+ &lt;/button&gt;
1221
+ &lt;rxap-language-selector&gt;&lt;/rxap-language-selector&gt;
1222
+ &lt;button (click)&#x3D;&quot;openChangelogDialog()&quot; mat-menu-item&gt;
1223
+ &lt;mat-icon svgIcon&#x3D;&quot;format-list-numbered&quot;&gt;&lt;/mat-icon&gt;
1224
+ &lt;span i18n&gt;What&#x27;s new&lt;/span&gt;
1225
+ &lt;/button&gt;
1226
+ &lt;ng-container *ngFor&#x3D;&quot;let item of items()&quot;&gt;
1227
+ &lt;ng-template [cdkPortalOutlet]&#x3D;&quot;item&quot;&gt;&lt;/ng-template&gt;
1228
+ &lt;/ng-container&gt;
1229
+ &lt;/mat-menu&gt;
1230
+
1231
+ &lt;mat-menu #themeMenu&#x3D;&quot;matMenu&quot; xPosition&#x3D;&quot;before&quot;&gt;
1232
+ &lt;button [matMenuTriggerFor]&#x3D;&quot;themeDensityMenu&quot; mat-menu-item&gt;
1233
+ &lt;mat-icon svgIcon&#x3D;&quot;move-resize&quot;&gt;&lt;/mat-icon&gt;
1234
+ &lt;span i18n&gt;Density&lt;/span&gt;
1235
+ &lt;/button&gt;
1236
+ &lt;button *ngIf&#x3D;&quot;availableTypographies?.length&quot; [matMenuTriggerFor]&#x3D;&quot;themeFontMenu&quot; mat-menu-item&gt;
1237
+ &lt;mat-icon svgIcon&#x3D;&quot;format-font&quot;&gt;&lt;/mat-icon&gt;
1238
+ &lt;span i18n&gt;Font&lt;/span&gt;
1239
+ &lt;/button&gt;
1240
+ &lt;button *ngIf&#x3D;&quot;availableThemes?.length&quot; [matMenuTriggerFor]&#x3D;&quot;themePresetMenu&quot; mat-menu-item&gt;
1241
+ &lt;mat-icon svgIcon&#x3D;&quot;shape-outline&quot;&gt;&lt;/mat-icon&gt;
1242
+ &lt;span i18n&gt;Preset&lt;/span&gt;
1243
+ &lt;/button&gt;
1244
+ &lt;/mat-menu&gt;
1245
+
1246
+ &lt;mat-menu #themeDensityMenu&#x3D;&quot;matMenu&quot; xPosition&#x3D;&quot;before&quot;&gt;
1247
+ &lt;button (click)&#x3D;&quot;setDensity(0)&quot; (mouseenter)&#x3D;&quot;previewDensity(0)&quot; (mouseleave)&#x3D;&quot;restoreDensity()&quot; mat-menu-item&gt;
1248
+ &lt;mat-icon svgIcon&#x3D;&quot;size-l&quot;&gt;&lt;/mat-icon&gt;
1249
+ &lt;span i18n&gt;Normal&lt;/span&gt;
1250
+ &lt;/button&gt;
1251
+ &lt;button (click)&#x3D;&quot;setDensity(-1)&quot; (mouseenter)&#x3D;&quot;previewDensity(-1)&quot; (mouseleave)&#x3D;&quot;restoreDensity()&quot; mat-menu-item&gt;
1252
+ &lt;mat-icon svgIcon&#x3D;&quot;size-m&quot;&gt;&lt;/mat-icon&gt;
1253
+ &lt;span i18n&gt;Dense&lt;/span&gt;
1254
+ &lt;/button&gt;
1255
+ &lt;button (click)&#x3D;&quot;setDensity(-2)&quot; (mouseenter)&#x3D;&quot;previewDensity(-2)&quot; (mouseleave)&#x3D;&quot;restoreDensity()&quot; mat-menu-item&gt;
1256
+ &lt;mat-icon svgIcon&#x3D;&quot;size-s&quot;&gt;&lt;/mat-icon&gt;
1257
+ &lt;span i18n&gt;Very Dense&lt;/span&gt;
1258
+ &lt;/button&gt;
1259
+ &lt;button (click)&#x3D;&quot;setDensity(-3)&quot; (mouseenter)&#x3D;&quot;previewDensity(-3)&quot; (mouseleave)&#x3D;&quot;restoreDensity()&quot; mat-menu-item&gt;
1260
+ &lt;mat-icon svgIcon&#x3D;&quot;size-xs&quot;&gt;&lt;/mat-icon&gt;
1261
+ &lt;span i18n&gt;Extreme Dense&lt;/span&gt;
1262
+ &lt;/button&gt;
1263
+ &lt;/mat-menu&gt;
1264
+ &lt;mat-menu #themeFontMenu&#x3D;&quot;matMenu&quot; xPosition&#x3D;&quot;before&quot;&gt;
1265
+ &lt;ng-template [ngIf]&#x3D;&quot;availableTypographies?.length&quot;&gt;
1266
+ &lt;button (click)&#x3D;&quot;setTypography(typographyName)&quot;
1267
+ (mouseenter)&#x3D;&quot;previewTypography(typographyName)&quot;
1268
+ (mouseleave)&#x3D;&quot;restoreTypography()&quot;
1269
+ *ngFor&#x3D;&quot;let typographyName of availableTypographies&quot;
1270
+ mat-menu-item&gt;
1271
+ {{ typographyName }}
1272
+ &lt;/button&gt;
1273
+ &lt;/ng-template&gt;
1274
+ &lt;/mat-menu&gt;
1275
+
1276
+ &lt;mat-menu #themePresetMenu&#x3D;&quot;matMenu&quot; xPosition&#x3D;&quot;before&quot;&gt;
1277
+ &lt;ng-template [ngIf]&#x3D;&quot;availableThemes?.length&quot;&gt;
1278
+ &lt;button (click)&#x3D;&quot;setTheme(themeName)&quot;
1279
+ (mouseenter)&#x3D;&quot;previewTheme(themeName)&quot;
1280
+ (mouseleave)&#x3D;&quot;restoreTheme()&quot;
1281
+ *ngFor&#x3D;&quot;let themeName of availableThemes&quot;
1282
+ mat-menu-item&gt;
1283
+ {{ themeName }}
1284
+ &lt;/button&gt;
1285
+ &lt;/ng-template&gt;
1286
+ &lt;/mat-menu&gt;
1287
+ </code></pre>
1288
+ </div>
1289
+
1290
+ <div class="tab-pane fade " id="styleData">
1291
+ <p class="comment">
1292
+ <code>./settings-button.component.scss</code>
1293
+ </p>
1294
+ <pre class="line-numbers"><code class="language-scss"></code></pre>
1295
+ </div>
1296
+
1297
+ <div class="tab-pane fade " id="tree">
1298
+ <div id="tree-container"></div>
1299
+ <div class="tree-legend">
1300
+ <div class="title">
1301
+ <b>Legend</b>
1302
+ </div>
1303
+ <div>
1304
+ <div class="color htmlelement"></div><span>Html element</span>
1305
+ </div>
1306
+ <div>
1307
+ <div class="color component"></div><span>Component</span>
1308
+ </div>
1309
+ <div>
1310
+ <div class="color directive"></div><span>Html element with directive</span>
1311
+ </div>
1312
+ </div>
1313
+ </div>
1314
+
1315
+
1316
+ </div>
1317
+
1318
+ <script src="../js/libs/vis.min.js"></script>
1319
+ <script src="../js/libs/htmlparser.js"></script>
1320
+ <script src="../js/libs/deep-iterator.js"></script>
1321
+ <script>
1322
+ var COMPONENT_TEMPLATE = '<div><button [matMenuTriggerFor]="menu" mat-icon-button> <mat-icon svgIcon="cog"></mat-icon></button><mat-menu #menu="matMenu"> <button (click)="theme.toggleDarkTheme()" mat-menu-item> <mat-icon *ngIf="theme.darkMode()" svgIcon="brightness-2"></mat-icon> <mat-icon *ngIf="!theme.darkMode()" svgIcon="brightness-5"></mat-icon> <span i18n>Mode</span> </button> <button [matMenuTriggerFor]="themeMenu" mat-menu-item> <mat-icon svgIcon="compare"></mat-icon> <span i18n>Theme</span> </button> <rxap-language-selector></rxap-language-selector> <button (click)="openChangelogDialog()" mat-menu-item> <mat-icon svgIcon="format-list-numbered"></mat-icon> <span i18n>What\'s new</span> </button> <ng-container *ngFor="let item of items()"> <ng-template [cdkPortalOutlet]="item"></ng-template> </ng-container></mat-menu><mat-menu #themeMenu="matMenu" xPosition="before"> <button [matMenuTriggerFor]="themeDensityMenu" mat-menu-item> <mat-icon svgIcon="move-resize"></mat-icon> <span i18n>Density</span> </button> <button *ngIf="availableTypographies?.length" [matMenuTriggerFor]="themeFontMenu" mat-menu-item> <mat-icon svgIcon="format-font"></mat-icon> <span i18n>Font</span> </button> <button *ngIf="availableThemes?.length" [matMenuTriggerFor]="themePresetMenu" mat-menu-item> <mat-icon svgIcon="shape-outline"></mat-icon> <span i18n>Preset</span> </button></mat-menu><mat-menu #themeDensityMenu="matMenu" xPosition="before"> <button (click)="setDensity(0)" (mouseenter)="previewDensity(0)" (mouseleave)="restoreDensity()" mat-menu-item> <mat-icon svgIcon="size-l"></mat-icon> <span i18n>Normal</span> </button> <button (click)="setDensity(-1)" (mouseenter)="previewDensity(-1)" (mouseleave)="restoreDensity()" mat-menu-item> <mat-icon svgIcon="size-m"></mat-icon> <span i18n>Dense</span> </button> <button (click)="setDensity(-2)" (mouseenter)="previewDensity(-2)" (mouseleave)="restoreDensity()" mat-menu-item> <mat-icon svgIcon="size-s"></mat-icon> <span i18n>Very Dense</span> </button> <button (click)="setDensity(-3)" (mouseenter)="previewDensity(-3)" (mouseleave)="restoreDensity()" mat-menu-item> <mat-icon svgIcon="size-xs"></mat-icon> <span i18n>Extreme Dense</span> </button></mat-menu><mat-menu #themeFontMenu="matMenu" xPosition="before"> <ng-template [ngIf]="availableTypographies?.length"> <button (click)="setTypography(typographyName)" (mouseenter)="previewTypography(typographyName)" (mouseleave)="restoreTypography()" *ngFor="let typographyName of availableTypographies" mat-menu-item> {{ typographyName }} </button> </ng-template></mat-menu><mat-menu #themePresetMenu="matMenu" xPosition="before"> <ng-template [ngIf]="availableThemes?.length"> <button (click)="setTheme(themeName)" (mouseenter)="previewTheme(themeName)" (mouseleave)="restoreTheme()" *ngFor="let themeName of availableThemes" mat-menu-item> {{ themeName }} </button> </ng-template></mat-menu></div>'
1323
+ var COMPONENTS = [{'name': 'AppsButtonComponent', 'selector': 'rxap-apps-button'},{'name': 'FooterComponent', 'selector': 'rxap-footer'},{'name': 'HeaderComponent', 'selector': 'rxap-header'},{'name': 'LanguageSelectorComponent', 'selector': 'rxap-language-selector'},{'name': 'LayoutComponent', 'selector': 'rxap-layout'},{'name': 'NavigationComponent', 'selector': 'ul[rxap-navigation]'},{'name': 'NavigationItemComponent', 'selector': 'li[rxap-navigation-item]'},{'name': 'NavigationProgressBarComponent', 'selector': 'rxap-navigation-progress-bar'},{'name': 'ResetButtonComponent', 'selector': 'rxap-reset-button'},{'name': 'SettingsButtonComponent', 'selector': 'rxap-settings-button'},{'name': 'SidenavComponent', 'selector': 'rxap-sidenav'},{'name': 'SidenavToggleButtonComponent', 'selector': 'rxap-sidenav-toggle-button'},{'name': 'SignOutComponent', 'selector': 'rxap-sign-out'},{'name': 'ToggleWindowSidenavButtonComponent', 'selector': 'rxap-toggle-window-sidenav-button'},{'name': 'UserProfileIconComponent', 'selector': 'rxap-user-profile-icon'},{'name': 'VersionComponent', 'selector': 'rxap-version'},{'name': 'WindowContainerSidenavComponent', 'selector': 'rxap-window-container-sidenav'}];
1324
+ var DIRECTIVES = [{'name': 'FooterDirective', 'selector': '[rxapFooter]'},{'name': 'SidenavFooterDirective', 'selector': '[rxapSidenavFooter]'},{'name': 'SidenavHeaderDirective', 'selector': '[rxapSidenavHeader]'}];
1325
+ var ACTUAL_COMPONENT = {'name': 'SettingsButtonComponent'};
1326
+ </script>
1327
+ <script src="../js/tree.js"></script>
1328
+
1329
+
1330
+
1331
+
1332
+
1333
+
1334
+
1335
+
1336
+
1337
+
1338
+
1339
+
1340
+
1341
+
1342
+
1343
+
1344
+
1345
+ </div><div class="search-results">
1346
+ <div class="has-results">
1347
+ <h1 class="search-results-title"><span class='search-results-count'></span> results matching "<span class='search-query'></span>"</h1>
1348
+ <ul class="search-results-list"></ul>
1349
+ </div>
1350
+ <div class="no-results">
1351
+ <h1 class="search-results-title">No results matching "<span class='search-query'></span>"</h1>
1352
+ </div>
1353
+ </div>
1354
+ </div>
1355
+ <!-- END CONTENT -->
1356
+ </div>
1357
+ </div>
1358
+
1359
+ <label class="dark-mode-switch">
1360
+ <input type="checkbox">
1361
+ <span class="slider">
1362
+ <svg class="slider-icon" viewBox="0 0 24 24" fill="none" height="20" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" width="20" xmlns="http://www.w3.org/2000/svg">
1363
+ <path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z"></path>
1364
+ </svg>
1365
+ </span>
1366
+ </label>
1367
+
1368
+ <script>
1369
+ var COMPODOC_CURRENT_PAGE_DEPTH = 1;
1370
+ var COMPODOC_CURRENT_PAGE_CONTEXT = 'component';
1371
+ var COMPODOC_CURRENT_PAGE_URL = 'SettingsButtonComponent.html';
1372
+ var MAX_SEARCH_RESULTS = 15;
1373
+ </script>
1374
+
1375
+ <script>
1376
+ $darkModeToggleSwitchers = document.querySelectorAll('.dark-mode-switch input');
1377
+ checkToggle(darkModeState);
1378
+ if ($darkModeToggleSwitchers.length > 0) {
1379
+ for (var i = 0; i < $darkModeToggleSwitchers.length; i++) {
1380
+ $darkModeToggleSwitchers[i].addEventListener('change', function (event) {
1381
+ darkModeState = !darkModeState;
1382
+ toggleDarkMode(darkModeState);
1383
+ });
1384
+ }
1385
+ }
1386
+ </script>
1387
+
1388
+ <script src="../js/libs/custom-elements.min.js"></script>
1389
+ <script src="../js/libs/lit-html.js"></script>
1390
+
1391
+ <script src="../js/menu-wc.js" defer></script>
1392
+ <script nomodule src="../js/menu-wc_es5.js" defer></script>
1393
+
1394
+ <script src="../js/libs/bootstrap-native.js"></script>
1395
+
1396
+ <script src="../js/libs/es6-shim.min.js"></script>
1397
+ <script src="../js/libs/EventDispatcher.js"></script>
1398
+ <script src="../js/libs/promise.min.js"></script>
1399
+ <script src="../js/libs/zepto.min.js"></script>
1400
+
1401
+ <script src="../js/compodoc.js"></script>
1402
+
1403
+ <script src="../js/tabs.js"></script>
1404
+ <script src="../js/menu.js"></script>
1405
+ <script src="../js/libs/clipboard.min.js"></script>
1406
+ <script src="../js/libs/prism.js"></script>
1407
+ <script src="../js/sourceCode.js"></script>
1408
+ <script src="../js/search/search.js"></script>
1409
+ <script src="../js/search/lunr.min.js"></script>
1410
+ <script src="../js/search/search-lunr.js"></script>
1411
+ <script src="../js/search/search_index.js"></script>
1412
+ <script src="../js/lazy-load-graphs.js"></script>
1413
+
1414
+
1415
+ </body>
1416
+ </html>