@rxap/layout 19.0.1-dev.13 → 19.0.1-dev.14

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 (212) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/README.md +25 -26
  3. package/compodoc/changelog.html +2 -0
  4. package/compodoc/dependencies.html +3 -3
  5. package/compodoc/index.html +26 -17
  6. package/compodoc/js/search/search_index.js +2 -2
  7. package/compodoc/properties.html +4 -1
  8. package/docs/documentation.json +326 -326
  9. package/docs/html/assets/highlight.css +19 -12
  10. package/docs/html/classes/AppsButtonComponent.html +4 -4
  11. package/docs/html/classes/BaseLayoutComponent.html +1 -1
  12. package/docs/html/classes/DefaultHeaderComponent.html +2 -2
  13. package/docs/html/classes/DefaultHeaderService.html +5 -5
  14. package/docs/html/classes/ExternalAppsService.html +2 -2
  15. package/docs/html/classes/FooterComponent.html +2 -2
  16. package/docs/html/classes/FooterDirective.html +3 -3
  17. package/docs/html/classes/FooterService.html +5 -5
  18. package/docs/html/classes/HeaderComponent.html +2 -2
  19. package/docs/html/classes/HeaderDirective.html +3 -3
  20. package/docs/html/classes/HeaderService.html +5 -5
  21. package/docs/html/classes/LayoutComponent.html +2 -2
  22. package/docs/html/classes/LayoutService.html +2 -2
  23. package/docs/html/classes/LogoService.html +2 -2
  24. package/docs/html/classes/MinimalLayoutComponent.html +1 -1
  25. package/docs/html/classes/NavigationComponent.html +3 -3
  26. package/docs/html/classes/NavigationItemComponent.html +5 -5
  27. package/docs/html/classes/NavigationProgressBarComponent.html +2 -2
  28. package/docs/html/classes/NavigationService.html +3 -3
  29. package/docs/html/classes/ReleaseInfoComponent.html +2 -2
  30. package/docs/html/classes/SettingsButtonComponent.html +2 -2
  31. package/docs/html/classes/SidenavComponent.html +2 -2
  32. package/docs/html/classes/SidenavFooterDirective.html +2 -2
  33. package/docs/html/classes/SidenavHeaderDirective.html +2 -2
  34. package/docs/html/classes/SidenavToggleButtonComponent.html +2 -2
  35. package/docs/html/classes/UserProfileIconComponent.html +2 -2
  36. package/docs/html/functions/IsNavigationDividerItem.html +1 -1
  37. package/docs/html/functions/IsNavigationInsertItem.html +1 -1
  38. package/docs/html/functions/IsNavigationItem.html +1 -1
  39. package/docs/html/functions/provideExternalApps.html +1 -1
  40. package/docs/html/functions/provideLayout.html +1 -1
  41. package/docs/html/functions/withDefaultHeaderComponent.html +1 -1
  42. package/docs/html/functions/withDefaultHeaderItems.html +1 -1
  43. package/docs/html/functions/withFooterComponents.html +1 -1
  44. package/docs/html/functions/withHeaderComponents.html +1 -1
  45. package/docs/html/functions/withNavigationConfig.html +1 -1
  46. package/docs/html/functions/withNavigationInserts.html +1 -1
  47. package/docs/html/functions/withReleaseInfoModules.html +1 -1
  48. package/docs/html/functions/withSettingsMenuItems.html +1 -1
  49. package/docs/html/functions/withUserProfileDataSource.html +1 -1
  50. package/docs/html/index.html +41 -37
  51. package/docs/html/interfaces/NavigationDividerItem.html +2 -2
  52. package/docs/html/interfaces/NavigationInsertItem.html +2 -2
  53. package/docs/html/interfaces/NavigationItem.html +2 -2
  54. package/docs/html/interfaces/NavigationStatus.html +2 -2
  55. package/docs/html/interfaces/ReleaseInfoModule.html +2 -2
  56. package/docs/html/interfaces/SettingsMenuItem.html +2 -2
  57. package/docs/html/types/DefaultHeaderItemComponent.html +1 -1
  58. package/docs/html/types/ExternalApp.html +1 -1
  59. package/docs/html/types/ExtractUsernameFromProfileFn.html +1 -1
  60. package/docs/html/types/Navigation.html +1 -1
  61. package/docs/html/types/NavigationWithInserts.html +1 -1
  62. package/docs/html/types/SettingsMenuItemComponent.html +1 -1
  63. package/docs/html/variables/EXTRACT_USERNAME_FROM_PROFILE.html +1 -1
  64. package/docs/html/variables/RXAP_DEFAULT_HEADER_ITEM_COMPONENT.html +1 -1
  65. package/docs/html/variables/RXAP_EXTERNAL_APP.html +1 -1
  66. package/docs/html/variables/RXAP_EXTERNAL_APP_FILTER.html +1 -1
  67. package/docs/html/variables/RXAP_FOOTER_COMPONENT.html +1 -1
  68. package/docs/html/variables/RXAP_HEADER_COMPONENT.html +1 -1
  69. package/docs/html/variables/RXAP_LAYOUT_APPS_GRID.html +1 -1
  70. package/docs/html/variables/RXAP_LOGO_CONFIG.html +1 -1
  71. package/docs/html/variables/RXAP_NAVIGATION_CONFIG.html +1 -1
  72. package/docs/html/variables/RXAP_NAVIGATION_CONFIG_INSERTS.html +1 -1
  73. package/docs/html/variables/RXAP_RELEASE_INFO_MODULE.html +1 -1
  74. package/docs/html/variables/RXAP_SETTINGS_MENU_ITEM.html +1 -1
  75. package/docs/html/variables/RXAP_SETTINGS_MENU_ITEM_COMPONENT.html +1 -1
  76. package/docs/html/variables/RXAP_USER_PROFILE_DATA_SOURCE.html +1 -1
  77. package/docs/markdown/README.md +25 -26
  78. package/docs/markdown/classes/AppsButtonComponent.md +6 -6
  79. package/docs/markdown/classes/BaseLayoutComponent.md +1 -1
  80. package/docs/markdown/classes/DefaultHeaderComponent.md +6 -6
  81. package/docs/markdown/classes/DefaultHeaderService.md +5 -5
  82. package/docs/markdown/classes/ExternalAppsService.md +17 -17
  83. package/docs/markdown/classes/FooterComponent.md +3 -3
  84. package/docs/markdown/classes/FooterDirective.md +3 -3
  85. package/docs/markdown/classes/FooterService.md +5 -5
  86. package/docs/markdown/classes/HeaderComponent.md +4 -4
  87. package/docs/markdown/classes/HeaderDirective.md +3 -3
  88. package/docs/markdown/classes/HeaderService.md +5 -5
  89. package/docs/markdown/classes/LayoutComponent.md +4 -4
  90. package/docs/markdown/classes/LayoutService.md +16 -16
  91. package/docs/markdown/classes/LogoService.md +5 -5
  92. package/docs/markdown/classes/MinimalLayoutComponent.md +1 -1
  93. package/docs/markdown/classes/NavigationComponent.md +10 -10
  94. package/docs/markdown/classes/NavigationItemComponent.md +13 -13
  95. package/docs/markdown/classes/NavigationProgressBarComponent.md +3 -3
  96. package/docs/markdown/classes/NavigationService.md +11 -11
  97. package/docs/markdown/classes/ReleaseInfoComponent.md +4 -4
  98. package/docs/markdown/classes/SettingsButtonComponent.md +17 -17
  99. package/docs/markdown/classes/SidenavComponent.md +14 -14
  100. package/docs/markdown/classes/SidenavFooterDirective.md +3 -3
  101. package/docs/markdown/classes/SidenavHeaderDirective.md +3 -3
  102. package/docs/markdown/classes/SidenavToggleButtonComponent.md +3 -3
  103. package/docs/markdown/classes/UserProfileIconComponent.md +4 -4
  104. package/docs/markdown/functions/IsNavigationDividerItem.md +1 -1
  105. package/docs/markdown/functions/IsNavigationInsertItem.md +1 -1
  106. package/docs/markdown/functions/IsNavigationItem.md +1 -1
  107. package/docs/markdown/functions/provideExternalApps.md +1 -1
  108. package/docs/markdown/functions/provideLayout.md +1 -1
  109. package/docs/markdown/functions/withDefaultHeaderComponent.md +1 -1
  110. package/docs/markdown/functions/withDefaultHeaderItems.md +1 -1
  111. package/docs/markdown/functions/withFooterComponents.md +1 -1
  112. package/docs/markdown/functions/withHeaderComponents.md +1 -1
  113. package/docs/markdown/functions/withNavigationConfig.md +1 -1
  114. package/docs/markdown/functions/withNavigationInserts.md +1 -1
  115. package/docs/markdown/functions/withReleaseInfoModules.md +1 -1
  116. package/docs/markdown/functions/withSettingsMenuItems.md +1 -1
  117. package/docs/markdown/functions/withUserProfileDataSource.md +1 -1
  118. package/docs/markdown/interfaces/NavigationDividerItem.md +3 -3
  119. package/docs/markdown/interfaces/NavigationInsertItem.md +2 -2
  120. package/docs/markdown/interfaces/NavigationItem.md +6 -6
  121. package/docs/markdown/interfaces/NavigationStatus.md +2 -2
  122. package/docs/markdown/interfaces/ReleaseInfoModule.md +4 -4
  123. package/docs/markdown/interfaces/SettingsMenuItem.md +4 -4
  124. package/docs/markdown/type-aliases/DefaultHeaderItemComponent.md +1 -1
  125. package/docs/markdown/type-aliases/ExternalApp.md +1 -1
  126. package/docs/markdown/type-aliases/ExtractUsernameFromProfileFn.md +1 -1
  127. package/docs/markdown/type-aliases/Navigation.md +1 -1
  128. package/docs/markdown/type-aliases/NavigationWithInserts.md +1 -1
  129. package/docs/markdown/type-aliases/SettingsMenuItemComponent.md +1 -1
  130. package/docs/markdown/variables/EXTRACT_USERNAME_FROM_PROFILE.md +1 -1
  131. package/docs/markdown/variables/RXAP_DEFAULT_HEADER_ITEM_COMPONENT.md +1 -1
  132. package/docs/markdown/variables/RXAP_EXTERNAL_APP.md +1 -1
  133. package/docs/markdown/variables/RXAP_EXTERNAL_APP_FILTER.md +1 -1
  134. package/docs/markdown/variables/RXAP_FOOTER_COMPONENT.md +1 -1
  135. package/docs/markdown/variables/RXAP_HEADER_COMPONENT.md +1 -1
  136. package/docs/markdown/variables/RXAP_LAYOUT_APPS_GRID.md +1 -1
  137. package/docs/markdown/variables/RXAP_LOGO_CONFIG.md +1 -1
  138. package/docs/markdown/variables/RXAP_NAVIGATION_CONFIG.md +1 -1
  139. package/docs/markdown/variables/RXAP_NAVIGATION_CONFIG_INSERTS.md +1 -1
  140. package/docs/markdown/variables/RXAP_RELEASE_INFO_MODULE.md +1 -1
  141. package/docs/markdown/variables/RXAP_SETTINGS_MENU_ITEM.md +1 -1
  142. package/docs/markdown/variables/RXAP_SETTINGS_MENU_ITEM_COMPONENT.md +1 -1
  143. package/docs/markdown/variables/RXAP_USER_PROFILE_DATA_SOURCE.md +1 -1
  144. package/docs/wiki/Class.AppsButtonComponent.md +6 -6
  145. package/docs/wiki/Class.BaseLayoutComponent.md +1 -1
  146. package/docs/wiki/Class.DefaultHeaderComponent.md +6 -6
  147. package/docs/wiki/Class.DefaultHeaderService.md +5 -5
  148. package/docs/wiki/Class.ExternalAppsService.md +17 -17
  149. package/docs/wiki/Class.FooterComponent.md +3 -3
  150. package/docs/wiki/Class.FooterDirective.md +3 -3
  151. package/docs/wiki/Class.FooterService.md +5 -5
  152. package/docs/wiki/Class.HeaderComponent.md +4 -4
  153. package/docs/wiki/Class.HeaderDirective.md +3 -3
  154. package/docs/wiki/Class.HeaderService.md +5 -5
  155. package/docs/wiki/Class.LayoutComponent.md +4 -4
  156. package/docs/wiki/Class.LayoutService.md +16 -16
  157. package/docs/wiki/Class.LogoService.md +5 -5
  158. package/docs/wiki/Class.MinimalLayoutComponent.md +1 -1
  159. package/docs/wiki/Class.NavigationComponent.md +10 -10
  160. package/docs/wiki/Class.NavigationItemComponent.md +13 -13
  161. package/docs/wiki/Class.NavigationProgressBarComponent.md +3 -3
  162. package/docs/wiki/Class.NavigationService.md +11 -11
  163. package/docs/wiki/Class.ReleaseInfoComponent.md +4 -4
  164. package/docs/wiki/Class.SettingsButtonComponent.md +17 -17
  165. package/docs/wiki/Class.SidenavComponent.md +14 -14
  166. package/docs/wiki/Class.SidenavFooterDirective.md +3 -3
  167. package/docs/wiki/Class.SidenavHeaderDirective.md +3 -3
  168. package/docs/wiki/Class.SidenavToggleButtonComponent.md +3 -3
  169. package/docs/wiki/Class.UserProfileIconComponent.md +4 -4
  170. package/docs/wiki/Function.IsNavigationDividerItem.md +1 -1
  171. package/docs/wiki/Function.IsNavigationInsertItem.md +1 -1
  172. package/docs/wiki/Function.IsNavigationItem.md +1 -1
  173. package/docs/wiki/Function.provideExternalApps.md +1 -1
  174. package/docs/wiki/Function.provideLayout.md +1 -1
  175. package/docs/wiki/Function.withDefaultHeaderComponent.md +1 -1
  176. package/docs/wiki/Function.withDefaultHeaderItems.md +1 -1
  177. package/docs/wiki/Function.withFooterComponents.md +1 -1
  178. package/docs/wiki/Function.withHeaderComponents.md +1 -1
  179. package/docs/wiki/Function.withNavigationConfig.md +1 -1
  180. package/docs/wiki/Function.withNavigationInserts.md +1 -1
  181. package/docs/wiki/Function.withReleaseInfoModules.md +1 -1
  182. package/docs/wiki/Function.withSettingsMenuItems.md +1 -1
  183. package/docs/wiki/Function.withUserProfileDataSource.md +1 -1
  184. package/docs/wiki/Home.md +25 -26
  185. package/docs/wiki/Interface.NavigationDividerItem.md +3 -3
  186. package/docs/wiki/Interface.NavigationInsertItem.md +2 -2
  187. package/docs/wiki/Interface.NavigationItem.md +6 -6
  188. package/docs/wiki/Interface.NavigationStatus.md +2 -2
  189. package/docs/wiki/Interface.ReleaseInfoModule.md +4 -4
  190. package/docs/wiki/Interface.SettingsMenuItem.md +4 -4
  191. package/docs/wiki/TypeAlias.DefaultHeaderItemComponent.md +1 -1
  192. package/docs/wiki/TypeAlias.ExternalApp.md +1 -1
  193. package/docs/wiki/TypeAlias.ExtractUsernameFromProfileFn.md +1 -1
  194. package/docs/wiki/TypeAlias.Navigation.md +1 -1
  195. package/docs/wiki/TypeAlias.NavigationWithInserts.md +1 -1
  196. package/docs/wiki/TypeAlias.SettingsMenuItemComponent.md +1 -1
  197. package/docs/wiki/Variable.EXTRACT_USERNAME_FROM_PROFILE.md +1 -1
  198. package/docs/wiki/Variable.RXAP_DEFAULT_HEADER_ITEM_COMPONENT.md +1 -1
  199. package/docs/wiki/Variable.RXAP_EXTERNAL_APP.md +1 -1
  200. package/docs/wiki/Variable.RXAP_EXTERNAL_APP_FILTER.md +1 -1
  201. package/docs/wiki/Variable.RXAP_FOOTER_COMPONENT.md +1 -1
  202. package/docs/wiki/Variable.RXAP_HEADER_COMPONENT.md +1 -1
  203. package/docs/wiki/Variable.RXAP_LAYOUT_APPS_GRID.md +1 -1
  204. package/docs/wiki/Variable.RXAP_LOGO_CONFIG.md +1 -1
  205. package/docs/wiki/Variable.RXAP_NAVIGATION_CONFIG.md +1 -1
  206. package/docs/wiki/Variable.RXAP_NAVIGATION_CONFIG_INSERTS.md +1 -1
  207. package/docs/wiki/Variable.RXAP_RELEASE_INFO_MODULE.md +1 -1
  208. package/docs/wiki/Variable.RXAP_SETTINGS_MENU_ITEM.md +1 -1
  209. package/docs/wiki/Variable.RXAP_SETTINGS_MENU_ITEM_COMPONENT.md +1 -1
  210. package/docs/wiki/Variable.RXAP_USER_PROFILE_DATA_SOURCE.md +1 -1
  211. package/generators.json +7 -0
  212. package/package.json +7 -5
@@ -1,73 +1,74 @@
1
- <!DOCTYPE html><html class="default" lang="en" data-base="."><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>@rxap/layout</title><meta name="description" content="Documentation for @rxap/layout"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="assets/style.css"/><link rel="stylesheet" href="assets/highlight.css"/><script defer src="assets/main.js"></script><script async src="assets/icons.js" id="tsd-icons-script"></script><script async src="assets/search.js" id="tsd-search-script"></script><script async src="assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search"><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="index.html" class="title">@rxap/layout</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><h1>@rxap/layout</h1></div><div class="tsd-panel tsd-typography"><a id="rxaplayout" class="tsd-anchor"></a><h1 class="tsd-anchor-link">@rxap/layout<a href="#rxaplayout" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h1><p><a href="https://www.npmjs.com/package/@rxap/layout"><img src="https://img.shields.io/npm/v/@rxap/layout?style=flat-square" alt="npm version"></a>
2
- <a href="https://commitizen.github.io/cz-cli/"><img src="https://img.shields.io/badge/commitizen-friendly-brightgreen.svg?style=flat-square" alt="commitizen friendly"></a>
3
- <a href="https://github.com/prettier/prettier"><img src="https://img.shields.io/badge/styled_with-prettier-ff69b4.svg?style=flat-square" alt="styled with prettier"></a>
4
- <img src="https://img.shields.io/librariesio/release/npm/@rxap/layout" alt="Libraries.io dependency status for latest release, scoped npm package">
1
+ <!DOCTYPE html><html class="default" lang="en" data-base="."><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>@rxap/layout</title><meta name="description" content="Documentation for @rxap/layout"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="assets/style.css"/><link rel="stylesheet" href="assets/highlight.css"/><script defer src="assets/main.js"></script><script async src="assets/icons.js" id="tsd-icons-script"></script><script async src="assets/search.js" id="tsd-search-script"></script><script async src="assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search"><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="index.html" class="title">@rxap/layout</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><h1>@rxap/layout</h1></div><div class="tsd-panel tsd-typography"><p>This library provides a set of Angular components and services for creating consistent and configurable application layouts, including headers, footers, side navigation, and content areas. It offers features such as dynamic navigation, external application integration, and customizable themes. The library also includes directives for extending header and footer areas with custom content.</p>
2
+ <p><a href="https://www.npmjs.com/package/@rxap/layout"><img src="https://img.shields.io/npm/v/@rxap/layout?style=flat-square" alt="npm version"></a>
3
+ <a href="https://commitizen.github.io/cz-cli/"><img src="https://img.shields.io/badge/commitizen-friendly-brightgreen.svg?style=flat-square" alt="commitizen
4
+ friendly"></a>
5
+ <a href="https://github.com/prettier/prettier"><img src="https://img.shields.io/badge/styled_with-prettier-ff69b4.svg?style=flat-square" alt="styled with
6
+ prettier"></a>
7
+ <img src="https://img.shields.io/librariesio/release/npm/@rxap/layout" alt="Libraries.io dependency status for latest release, scoped npm
8
+ package">
5
9
  <img src="https://img.shields.io/npm/dm/@rxap/layout" alt="npm">
6
- <img src="https://img.shields.io/npm/l/@rxap/layout" alt="NPM"></p>
10
+ <img src="https://img.shields.io/npm/l/@rxap/layout" alt="NPM"> -
11
+ <a href="#installation">Installation</a></p>
7
12
  <ul>
8
- <li><a href="#installation">Installation</a></li>
9
13
  <li><a href="#get-started">Get started</a></li>
10
- <li><a href="#generators">Generators</a></li>
14
+ <li><a href="#generators">Generators</a>
15
+ <ul>
16
+ <li><a href="#init">init</a></li>
11
17
  </ul>
12
- <a id="installation" class="tsd-anchor"></a><h1 class="tsd-anchor-link">Installation<a href="#installation" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h1><p><strong>Add the package to your workspace:</strong></p>
13
- <pre><code class="bash"><span class="hl-0">yarn</span><span class="hl-1"> </span><span class="hl-2">add</span><span class="hl-1"> </span><span class="hl-2">@rxap/layout</span>
14
- </code><button type="button">Copy</button></pre>
15
-
16
- <p><strong>Install peer dependencies:</strong></p>
17
- <pre><code class="bash"><span class="hl-0">yarn</span><span class="hl-1"> </span><span class="hl-2">add</span><span class="hl-1"> </span><span class="hl-2">@angular/animations@^19.1.3</span><span class="hl-1"> </span><span class="hl-2">@angular/cdk@^19.1.1</span><span class="hl-1"> </span><span class="hl-2">@angular/common@^19.1.3</span><span class="hl-1"> </span><span class="hl-2">@angular/core@^19.1.3</span><span class="hl-1"> </span><span class="hl-2">@angular/material@^19.1.1</span><span class="hl-1"> </span><span class="hl-2">@angular/router@^19.1.3</span><span class="hl-1"> </span><span class="hl-2">@rxap/browser-utilities@^1.1.10-dev.4</span><span class="hl-1"> </span><span class="hl-2">@rxap/config@^19.0.1-dev.4</span><span class="hl-1"> </span><span class="hl-2">@rxap/data-source@^19.0.1-dev.4</span><span class="hl-1"> </span><span class="hl-2">@rxap/environment@^19.0.1-dev.4</span><span class="hl-1"> </span><span class="hl-2">@rxap/material-directives@^19.0.1-dev.4</span><span class="hl-1"> </span><span class="hl-2">@rxap/ngx-pub-sub@^19.0.1-dev.4</span><span class="hl-1"> </span><span class="hl-2">@rxap/ngx-theme@^19.0.1-dev.4</span><span class="hl-1"> </span><span class="hl-2">@rxap/pattern@^1.1.11-dev.4</span><span class="hl-1"> </span><span class="hl-2">@rxap/utilities@^16.4.2-dev.4</span><span class="hl-1"> </span><span class="hl-2">rxjs@^7.8.1</span><span class="hl-1"> </span>
18
- </code><button type="button">Copy</button></pre>
19
-
20
- <p><strong>Execute the init generator:</strong></p>
21
- <pre><code class="bash"><span class="hl-0">yarn</span><span class="hl-1"> </span><span class="hl-2">nx</span><span class="hl-1"> </span><span class="hl-2">g</span><span class="hl-1"> </span><span class="hl-2">@rxap/layout:init</span>
22
- </code><button type="button">Copy</button></pre>
18
+ </li>
19
+ </ul>
20
+ <a id="installation-add-the-package-to-your-workspace-bash-yarn-add" class="tsd-anchor"></a><h1 class="tsd-anchor-link">Installation <strong>Add the package to your workspace:</strong> ```bash yarn add<a href="#installation-add-the-package-to-your-workspace-bash-yarn-add" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h1><p>@rxap/layout</p>
21
+ <pre><code><span class="hl-0">**</span><span class="hl-1">Install</span><span class="hl-0"> </span><span class="hl-1">peer</span><span class="hl-0"> </span><span class="hl-2">dependencies</span><span class="hl-0">:** </span><span class="hl-3">```bash yarn add</span><br/><span class="hl-3"> @angular/animations@^19.1.3 @angular/cdk@^19.1.1 @angular/common@^19.1.3 @angular/core@^19.1.3 @angular/material@^19.1.1 @angular/router@^19.1.3 @rxap/browser-utilities@^1.1.10-dev.4 @rxap/config@^19.0.1-dev.4 @rxap/data-source@^19.0.1-dev.4 @rxap/environment@^19.0.1-dev.4 @rxap/material-directives@^19.0.1-dev.4 @rxap/ngx-pub-sub@^19.0.1-dev.4 @rxap/ngx-theme@^19.0.1-dev.4 @rxap/pattern@^1.1.11-dev.4 @rxap/utilities@^16.4.2-dev.4 rxjs@^7.8.1 </span>
22
+ </code><button>Copy</button></pre>
23
23
 
24
+ <p><strong>Execute the init generator:</strong> <code>bash yarn nx g @rxap/layout:init </code></p>
24
25
  <a id="get-started" class="tsd-anchor"></a><h1 class="tsd-anchor-link">Get started<a href="#get-started" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h1><a id="layout" class="tsd-anchor"></a><h2 class="tsd-anchor-link">Layout<a href="#layout" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><p>Create a new file <code>layout.routes.ts</code> in the <code>app</code> folder. This file will contain all child routes that should be loaded within the layout component.</p>
25
- <pre><code class="typescript"><span class="hl-3">import</span><span class="hl-1"> { </span><span class="hl-4">LayoutComponent</span><span class="hl-1">, </span><span class="hl-4">provideLayout</span><span class="hl-1"> } </span><span class="hl-3">from</span><span class="hl-1"> </span><span class="hl-2">&#39;@rxap/layout&#39;</span><span class="hl-1">;</span><br/><br/><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-6">ROUTES</span><span class="hl-1">: </span><span class="hl-7">Route</span><span class="hl-1">[] = [</span><br/><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-4">path:</span><span class="hl-1"> </span><span class="hl-2">&#39;&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">component:</span><span class="hl-1"> </span><span class="hl-4">LayoutComponent</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">children:</span><span class="hl-1"> [ ],</span><br/><span class="hl-1"> </span><span class="hl-4">providers:</span><span class="hl-1"> [ </span><span class="hl-0">provideLayout</span><span class="hl-1">() ],</span><br/><span class="hl-1"> },</span><br/><span class="hl-1">];</span>
26
+ <pre><code class="typescript"><span class="hl-4">import</span><span class="hl-0"> { </span><span class="hl-1">LayoutComponent</span><span class="hl-0">, </span><span class="hl-1">provideLayout</span><span class="hl-0"> } </span><span class="hl-4">from</span><span class="hl-0"> </span><span class="hl-3">&#39;@rxap/layout&#39;</span><span class="hl-0">;</span><br/><br/><span class="hl-5">const</span><span class="hl-0"> </span><span class="hl-6">ROUTES</span><span class="hl-0">: </span><span class="hl-7">Route</span><span class="hl-0">[] = [</span><br/><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-1">path:</span><span class="hl-0"> </span><span class="hl-3">&#39;&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">component:</span><span class="hl-0"> </span><span class="hl-1">LayoutComponent</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">children:</span><span class="hl-0"> [ ],</span><br/><span class="hl-0"> </span><span class="hl-1">providers:</span><span class="hl-0"> [ </span><span class="hl-8">provideLayout</span><span class="hl-0">() ],</span><br/><span class="hl-0"> },</span><br/><span class="hl-0">];</span>
26
27
  </code><button type="button">Copy</button></pre>
27
28
 
28
29
  <p>Import the layout routes into the <code>app.routes.ts</code> file.</p>
29
- <pre><code class="typescript"><span class="hl-3">export</span><span class="hl-1"> </span><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-6">appRoutes</span><span class="hl-1">: </span><span class="hl-7">Route</span><span class="hl-1">[] = [</span><br/><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-4">path:</span><span class="hl-1"> </span><span class="hl-2">&#39;&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-0">loadChildren</span><span class="hl-4">:</span><span class="hl-1"> () </span><span class="hl-5">=&gt;</span><span class="hl-1"> </span><span class="hl-5">import</span><span class="hl-1">(</span><span class="hl-2">&#39;./layout.routes&#39;</span><span class="hl-1">),</span><br/><span class="hl-1"> },</span><br/><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-4">path:</span><span class="hl-1"> </span><span class="hl-2">&#39;**&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">redirectTo:</span><span class="hl-1"> </span><span class="hl-2">&#39;&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> },</span><br/><span class="hl-1">];</span>
30
+ <pre><code class="typescript"><span class="hl-4">export</span><span class="hl-0"> </span><span class="hl-5">const</span><span class="hl-0"> </span><span class="hl-6">appRoutes</span><span class="hl-0">: </span><span class="hl-7">Route</span><span class="hl-0">[] = [</span><br/><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-1">path:</span><span class="hl-0"> </span><span class="hl-3">&#39;&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-8">loadChildren</span><span class="hl-1">:</span><span class="hl-0"> () </span><span class="hl-5">=&gt;</span><span class="hl-0"> </span><span class="hl-5">import</span><span class="hl-0">(</span><span class="hl-3">&#39;./layout.routes&#39;</span><span class="hl-0">),</span><br/><span class="hl-0"> },</span><br/><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-1">path:</span><span class="hl-0"> </span><span class="hl-3">&#39;**&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">redirectTo:</span><span class="hl-0"> </span><span class="hl-3">&#39;&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> },</span><br/><span class="hl-0">];</span>
30
31
  </code><button type="button">Copy</button></pre>
31
32
 
32
33
  <a id="navigation-1" class="tsd-anchor"></a><h2 class="tsd-anchor-link">Navigation<a href="#navigation-1" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><p>Create a new file <code>app.navigation.ts</code> in the <code>app</code> folder. This file will contain the navigation items that should be displayed in the layout component.</p>
33
- <pre><code class="typescript"><span class="hl-3">export</span><span class="hl-1"> </span><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-0">APP_NAVIGATION</span><span class="hl-1">: () </span><span class="hl-5">=&gt;</span><span class="hl-1"> </span><span class="hl-7">NavigationWithInserts</span><span class="hl-1"> = () </span><span class="hl-5">=&gt;</span><span class="hl-1"> [];</span>
34
+ <pre><code class="typescript"><span class="hl-4">export</span><span class="hl-0"> </span><span class="hl-5">const</span><span class="hl-0"> </span><span class="hl-8">APP_NAVIGATION</span><span class="hl-0">: () </span><span class="hl-5">=&gt;</span><span class="hl-0"> </span><span class="hl-7">NavigationWithInserts</span><span class="hl-0"> = () </span><span class="hl-5">=&gt;</span><span class="hl-0"> [];</span>
34
35
  </code><button type="button">Copy</button></pre>
35
36
 
36
37
  <p>Provide the app navigation in the layout routes:</p>
37
- <pre><code class="typescript"><span class="hl-3">import</span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-4">LayoutComponent</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">ProvideNavigationConfig</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">withNavigationService</span><span class="hl-1">,</span><br/><span class="hl-1">} </span><span class="hl-3">from</span><span class="hl-1"> </span><span class="hl-2">&#39;@rxap/layout&#39;</span><span class="hl-1">;</span><br/><span class="hl-3">import</span><span class="hl-1"> { </span><span class="hl-4">APP_NAVIGATION</span><span class="hl-1"> } </span><span class="hl-3">from</span><span class="hl-1"> </span><span class="hl-2">&#39;./app.navigation&#39;</span><span class="hl-1">;</span><br/><br/><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-6">ROUTES</span><span class="hl-1">: </span><span class="hl-7">Route</span><span class="hl-1">[] = [</span><br/><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-4">path:</span><span class="hl-1"> </span><span class="hl-2">&#39;&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">component:</span><span class="hl-1"> </span><span class="hl-4">LayoutComponent</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">children:</span><span class="hl-1"> [ ],</span><br/><span class="hl-1"> </span><span class="hl-4">providers:</span><span class="hl-1"> [</span><br/><span class="hl-1"> </span><span class="hl-0">provideLayout</span><span class="hl-1">(</span><br/><span class="hl-1"> </span><span class="hl-0">withNavigationConfig</span><span class="hl-1">(</span><span class="hl-6">APP_NAVIGATION</span><span class="hl-1">),</span><br/><span class="hl-1"> ),</span><br/><span class="hl-1"> ],</span><br/><span class="hl-1"> },</span><br/><span class="hl-1">];</span>
38
+ <pre><code class="typescript"><span class="hl-4">import</span><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-1">LayoutComponent</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">ProvideNavigationConfig</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">withNavigationService</span><span class="hl-0">,</span><br/><span class="hl-0">} </span><span class="hl-4">from</span><span class="hl-0"> </span><span class="hl-3">&#39;@rxap/layout&#39;</span><span class="hl-0">;</span><br/><span class="hl-4">import</span><span class="hl-0"> { </span><span class="hl-1">APP_NAVIGATION</span><span class="hl-0"> } </span><span class="hl-4">from</span><span class="hl-0"> </span><span class="hl-3">&#39;./app.navigation&#39;</span><span class="hl-0">;</span><br/><br/><span class="hl-5">const</span><span class="hl-0"> </span><span class="hl-6">ROUTES</span><span class="hl-0">: </span><span class="hl-7">Route</span><span class="hl-0">[] = [</span><br/><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-1">path:</span><span class="hl-0"> </span><span class="hl-3">&#39;&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">component:</span><span class="hl-0"> </span><span class="hl-1">LayoutComponent</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">children:</span><span class="hl-0"> [ ],</span><br/><span class="hl-0"> </span><span class="hl-1">providers:</span><span class="hl-0"> [</span><br/><span class="hl-0"> </span><span class="hl-8">provideLayout</span><span class="hl-0">(</span><br/><span class="hl-0"> </span><span class="hl-8">withNavigationConfig</span><span class="hl-0">(</span><span class="hl-6">APP_NAVIGATION</span><span class="hl-0">),</span><br/><span class="hl-0"> ),</span><br/><span class="hl-0"> ],</span><br/><span class="hl-0"> },</span><br/><span class="hl-0">];</span>
38
39
  </code><button type="button">Copy</button></pre>
39
40
 
40
41
  <a id="navigation-item" class="tsd-anchor"></a><h3 class="tsd-anchor-link">Navigation Item<a href="#navigation-item" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>A navigation item represents a single item in the navigation sidebar. Each item has the required properties <code>label</code> and <code>routerLink</code>. The <code>label</code> property is the text that should be displayed in the sidebar. The <code>routerLink</code> property is the path that should be navigated to when the item is clicked.</p>
41
- <pre><code class="typescript"><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-6">item</span><span class="hl-1">: </span><span class="hl-7">NavigationItem</span><span class="hl-1"> = {</span><br/><span class="hl-1"> </span><span class="hl-4">label:</span><span class="hl-1"> </span><span class="hl-2">&#39;Home&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">routerLink:</span><span class="hl-1"> </span><span class="hl-2">&#39;/&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">};</span>
42
+ <pre><code class="typescript"><span class="hl-5">const</span><span class="hl-0"> </span><span class="hl-6">item</span><span class="hl-0">: </span><span class="hl-7">NavigationItem</span><span class="hl-0"> = {</span><br/><span class="hl-0"> </span><span class="hl-1">label:</span><span class="hl-0"> </span><span class="hl-3">&#39;Home&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">routerLink:</span><span class="hl-0"> </span><span class="hl-3">&#39;/&#39;</span><span class="hl-0">,</span><br/><span class="hl-0">};</span>
42
43
  </code><button type="button">Copy</button></pre>
43
44
 
44
45
  <p>With the <code>children</code> property, a navigation item can have child items. The child items are displayed in a dropdown menu when the parent item is clicked.</p>
45
- <pre><code class="typescript"><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-6">item</span><span class="hl-1">: </span><span class="hl-7">NavigationItem</span><span class="hl-1"> = {</span><br/><span class="hl-1"> </span><span class="hl-4">label:</span><span class="hl-1"> </span><span class="hl-2">&#39;Home&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">routerLink:</span><span class="hl-1"> </span><span class="hl-2">&#39;/&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">children:</span><span class="hl-1"> [</span><br/><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-4">label:</span><span class="hl-1"> </span><span class="hl-2">&#39;Child&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">routerLink:</span><span class="hl-1"> </span><span class="hl-2">&#39;/child&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> },</span><br/><span class="hl-1"> ],</span><br/><span class="hl-1">};</span>
46
+ <pre><code class="typescript"><span class="hl-5">const</span><span class="hl-0"> </span><span class="hl-6">item</span><span class="hl-0">: </span><span class="hl-7">NavigationItem</span><span class="hl-0"> = {</span><br/><span class="hl-0"> </span><span class="hl-1">label:</span><span class="hl-0"> </span><span class="hl-3">&#39;Home&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">routerLink:</span><span class="hl-0"> </span><span class="hl-3">&#39;/&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">children:</span><span class="hl-0"> [</span><br/><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-1">label:</span><span class="hl-0"> </span><span class="hl-3">&#39;Child&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">routerLink:</span><span class="hl-0"> </span><span class="hl-3">&#39;/child&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> },</span><br/><span class="hl-0"> ],</span><br/><span class="hl-0">};</span>
46
47
  </code><button type="button">Copy</button></pre>
47
48
 
48
49
  <a id="icon-property" class="tsd-anchor"></a><h4 class="tsd-anchor-link">Icon Property<a href="#icon-property" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h4><p>With the <code>icon</code> property, the item can be assigned an icon. The icon is displayed to the left of the label. If the navigation sidebar is collapsed, only the icon is displayed.</p>
49
- <pre><code class="typescript"><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-6">item</span><span class="hl-1">: </span><span class="hl-7">NavigationItem</span><span class="hl-1"> = {</span><br/><span class="hl-1"> </span><span class="hl-4">label:</span><span class="hl-1"> </span><span class="hl-2">&#39;Home&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">routerLink:</span><span class="hl-1"> </span><span class="hl-2">&#39;/&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">icon:</span><span class="hl-1"> { </span><span class="hl-4">icon:</span><span class="hl-1"> </span><span class="hl-2">&#39;home&#39;</span><span class="hl-1"> },</span><br/><span class="hl-1">};</span>
50
+ <pre><code class="typescript"><span class="hl-5">const</span><span class="hl-0"> </span><span class="hl-6">item</span><span class="hl-0">: </span><span class="hl-7">NavigationItem</span><span class="hl-0"> = {</span><br/><span class="hl-0"> </span><span class="hl-1">label:</span><span class="hl-0"> </span><span class="hl-3">&#39;Home&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">routerLink:</span><span class="hl-0"> </span><span class="hl-3">&#39;/&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">icon:</span><span class="hl-0"> { </span><span class="hl-1">icon:</span><span class="hl-0"> </span><span class="hl-3">&#39;home&#39;</span><span class="hl-0"> },</span><br/><span class="hl-0">};</span>
50
51
  </code><button type="button">Copy</button></pre>
51
52
 
52
53
  <a id="status-property" class="tsd-anchor"></a><h4 class="tsd-anchor-link">Status Property<a href="#status-property" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h4><p>With the <code>status</code> property, a injectable token, class or function can be assigned to the item. The object must have the method <code>isVisible</code> which returns a boolean. If the method returns <code>false</code>, the item is not displayed in the navigation sidebar.</p>
53
- <pre><code class="typescript"><span class="hl-1">@</span><span class="hl-0">Injectable</span><span class="hl-1">()</span><br/><span class="hl-5">class</span><span class="hl-1"> </span><span class="hl-7">SetNavStatus</span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-0">isVisible</span><span class="hl-1">(</span><span class="hl-4">item</span><span class="hl-1">: </span><span class="hl-7">NavigationItem</span><span class="hl-1">): </span><span class="hl-7">boolean</span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-3">return</span><span class="hl-1"> </span><span class="hl-5">false</span><span class="hl-1">;</span><br/><span class="hl-1"> }</span><br/><span class="hl-1">}</span><br/><br/><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-6">item</span><span class="hl-1">: </span><span class="hl-7">NavigationItem</span><span class="hl-1"> = {</span><br/><span class="hl-1"> </span><span class="hl-4">label:</span><span class="hl-1"> </span><span class="hl-2">&#39;Home&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">routerLink:</span><span class="hl-1"> </span><span class="hl-2">&#39;/&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">status:</span><span class="hl-1"> </span><span class="hl-4">SetNavStatus</span><span class="hl-1">,</span><br/><span class="hl-1">};</span>
54
+ <pre><code class="typescript"><span class="hl-0">@</span><span class="hl-8">Injectable</span><span class="hl-0">()</span><br/><span class="hl-5">class</span><span class="hl-0"> </span><span class="hl-7">SetNavStatus</span><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-8">isVisible</span><span class="hl-0">(</span><span class="hl-1">item</span><span class="hl-0">: </span><span class="hl-7">NavigationItem</span><span class="hl-0">): </span><span class="hl-7">boolean</span><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-4">return</span><span class="hl-0"> </span><span class="hl-5">false</span><span class="hl-0">;</span><br/><span class="hl-0"> }</span><br/><span class="hl-0">}</span><br/><br/><span class="hl-5">const</span><span class="hl-0"> </span><span class="hl-6">item</span><span class="hl-0">: </span><span class="hl-7">NavigationItem</span><span class="hl-0"> = {</span><br/><span class="hl-0"> </span><span class="hl-1">label:</span><span class="hl-0"> </span><span class="hl-3">&#39;Home&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">routerLink:</span><span class="hl-0"> </span><span class="hl-3">&#39;/&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">status:</span><span class="hl-0"> </span><span class="hl-1">SetNavStatus</span><span class="hl-0">,</span><br/><span class="hl-0">};</span>
54
55
  </code><button type="button">Copy</button></pre>
55
56
 
56
57
  <a id="navigation-divider-item" class="tsd-anchor"></a><h3 class="tsd-anchor-link">Navigation Divider Item<a href="#navigation-divider-item" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>A navigation divider item is a horizontal line that separates navigation items. It is used to group items in the navigation sidebar. It is required to set the property <code>divider</code> to <code>true</code>. With the optional property <code>title</code>, a title can be defined that is displayed below the divider.</p>
57
- <pre><code class="typescript"><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-6">item</span><span class="hl-1">: </span><span class="hl-7">NavigationDividerItem</span><span class="hl-1"> = {</span><br/><span class="hl-1"> </span><span class="hl-4">divider:</span><span class="hl-1"> </span><span class="hl-5">true</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">title:</span><span class="hl-1"> </span><span class="hl-2">&#39;Group&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">};</span>
58
+ <pre><code class="typescript"><span class="hl-5">const</span><span class="hl-0"> </span><span class="hl-6">item</span><span class="hl-0">: </span><span class="hl-7">NavigationDividerItem</span><span class="hl-0"> = {</span><br/><span class="hl-0"> </span><span class="hl-1">divider:</span><span class="hl-0"> </span><span class="hl-5">true</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">title:</span><span class="hl-0"> </span><span class="hl-3">&#39;Group&#39;</span><span class="hl-0">,</span><br/><span class="hl-0">};</span>
58
59
  </code><button type="button">Copy</button></pre>
59
60
 
60
61
  <a id="navigation-insert-item-wip" class="tsd-anchor"></a><h3 class="tsd-anchor-link">Navigation Insert Item (WIP)<a href="#navigation-insert-item-wip" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>A navigation insert item is a placeholder for a navigation item that should be inserted into the navigation sidebar.
61
62
  The item is used to define where a dynamic navigation should be inserted. The <code>insert</code> property is the key that is used
62
63
  identify the insert item. The <code>insert</code> property is required.</p>
63
- <pre><code class="typescript"><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-6">item</span><span class="hl-1">: </span><span class="hl-7">NavigationInsertItem</span><span class="hl-1"> = {</span><br/><span class="hl-1"> </span><span class="hl-4">insert:</span><span class="hl-1"> </span><span class="hl-2">&#39;insert-key&#39;</span><span class="hl-1">,</span><br/><span class="hl-1">};</span>
64
+ <pre><code class="typescript"><span class="hl-5">const</span><span class="hl-0"> </span><span class="hl-6">item</span><span class="hl-0">: </span><span class="hl-7">NavigationInsertItem</span><span class="hl-0"> = {</span><br/><span class="hl-0"> </span><span class="hl-1">insert:</span><span class="hl-0"> </span><span class="hl-3">&#39;insert-key&#39;</span><span class="hl-0">,</span><br/><span class="hl-0">};</span>
64
65
  </code><button type="button">Copy</button></pre>
65
66
 
66
67
  <a id="header" class="tsd-anchor"></a><h2 class="tsd-anchor-link">Header<a href="#header" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><p>The header is composed of the components from left to right: AppsButtonComponent, SettingsButtonComponent and UserProfileIconComponent.</p>
67
68
  <a id="apps-button" class="tsd-anchor"></a><h3 class="tsd-anchor-link">Apps Button<a href="#apps-button" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>The apps buttons allow for a navigation between different applications. To configure the apps button, the config path
68
69
  <code>navigation.apps</code> must be set with an array of object with the property <code>title</code> and ether <code>routerLink</code> or <code>href</code>. If the
69
70
  property <code>href</code> is set, the link is opened in a new tab. If the property <code>routerLink</code> the router is used to navigate.</p>
70
- <pre><code class="json"><span class="hl-1">{</span><br/><span class="hl-1"> </span><span class="hl-8">&quot;navigation&quot;</span><span class="hl-1">: {</span><br/><span class="hl-1"> </span><span class="hl-8">&quot;apps&quot;</span><span class="hl-1">: [</span><br/><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-8">&quot;title&quot;</span><span class="hl-1">: </span><span class="hl-2">&quot;App 1&quot;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-8">&quot;routerLink&quot;</span><span class="hl-1">: [</span><span class="hl-2">&quot;/&quot;</span><span class="hl-1">, </span><span class="hl-2">&quot;app1&quot;</span><span class="hl-1">]</span><br/><span class="hl-1"> },</span><br/><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-8">&quot;title&quot;</span><span class="hl-1">: </span><span class="hl-2">&quot;App 2&quot;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-8">&quot;href&quot;</span><span class="hl-1">: </span><span class="hl-2">&quot;https://app2.com&quot;</span><br/><span class="hl-1"> }</span><br/><span class="hl-1"> ]</span><br/><span class="hl-1"> }</span><br/><span class="hl-1">}</span>
71
+ <pre><code class="json"><span class="hl-0">{</span><br/><span class="hl-0"> </span><span class="hl-9">&quot;navigation&quot;</span><span class="hl-0">: {</span><br/><span class="hl-0"> </span><span class="hl-9">&quot;apps&quot;</span><span class="hl-0">: [</span><br/><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-9">&quot;title&quot;</span><span class="hl-0">: </span><span class="hl-3">&quot;App 1&quot;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-9">&quot;routerLink&quot;</span><span class="hl-0">: [</span><span class="hl-3">&quot;/&quot;</span><span class="hl-0">, </span><span class="hl-3">&quot;app1&quot;</span><span class="hl-0">]</span><br/><span class="hl-0"> },</span><br/><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-9">&quot;title&quot;</span><span class="hl-0">: </span><span class="hl-3">&quot;App 2&quot;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-9">&quot;href&quot;</span><span class="hl-0">: </span><span class="hl-3">&quot;https://app2.com&quot;</span><br/><span class="hl-0"> }</span><br/><span class="hl-0"> ]</span><br/><span class="hl-0"> }</span><br/><span class="hl-0">}</span>
71
72
  </code><button type="button">Copy</button></pre>
72
73
 
73
74
  <blockquote>
@@ -76,14 +77,14 @@ property <code>href</code> is set, the link is opened in a new tab. If the prope
76
77
  <a id="settings-button-customization-wip" class="tsd-anchor"></a><h3 class="tsd-anchor-link">Settings Button Customization (WIP)<a href="#settings-button-customization-wip" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>It is possible to add custom items to the settings menu. This custom item can be a component or a configuration object.</p>
77
78
  <blockquote></blockquote>
78
79
  <a id="configuration-object" class="tsd-anchor"></a><h4 class="tsd-anchor-link">Configuration Object<a href="#configuration-object" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h4><p>The action function is called when the item is clicked. It is possible to use the <code>inject</code> function to inject services.</p>
79
- <pre><code class="typescript"><span class="hl-3">import</span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-4">LayoutComponent</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">ProvideNavigationConfig</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">withNavigationService</span><span class="hl-1">,</span><br/><span class="hl-1">} </span><span class="hl-3">from</span><span class="hl-1"> </span><span class="hl-2">&#39;@rxap/layout&#39;</span><span class="hl-1">;</span><br/><span class="hl-3">import</span><span class="hl-1"> { </span><span class="hl-4">APP_NAVIGATION</span><span class="hl-1"> } </span><span class="hl-3">from</span><span class="hl-1"> </span><span class="hl-2">&#39;./app.navigation&#39;</span><span class="hl-1">;</span><br/><br/><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-6">ROUTES</span><span class="hl-1">: </span><span class="hl-7">Route</span><span class="hl-1">[] = [</span><br/><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-4">path:</span><span class="hl-1"> </span><span class="hl-2">&#39;&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">component:</span><span class="hl-1"> </span><span class="hl-4">LayoutComponent</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">children:</span><span class="hl-1"> [ ],</span><br/><span class="hl-1"> </span><span class="hl-4">providers:</span><span class="hl-1"> [</span><br/><span class="hl-1"> </span><span class="hl-0">provideLayout</span><span class="hl-1">(</span><br/><span class="hl-1"> </span><span class="hl-0">withNavigationConfig</span><span class="hl-1">(</span><span class="hl-6">APP_NAVIGATION</span><span class="hl-1">),</span><br/><span class="hl-1"> </span><span class="hl-0">withSettingsMenuItems</span><span class="hl-1">(</span><br/><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-4">label:</span><span class="hl-1"> </span><span class="hl-2">&#39;Custom Item&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">icon:</span><span class="hl-1"> { </span><span class="hl-4">icon:</span><span class="hl-1"> </span><span class="hl-2">&#39;home&#39;</span><span class="hl-1"> },</span><br/><span class="hl-1"> </span><span class="hl-0">action</span><span class="hl-4">:</span><span class="hl-1"> () </span><span class="hl-5">=&gt;</span><span class="hl-1"> </span><span class="hl-0">inject</span><span class="hl-1">(</span><span class="hl-4">MatDialog</span><span class="hl-1">).</span><span class="hl-0">open</span><span class="hl-1">(</span><span class="hl-4">MyCustomDialogComponent</span><span class="hl-1">),</span><br/><span class="hl-1"> }</span><br/><span class="hl-1"> )</span><br/><span class="hl-1"> ),</span><br/><span class="hl-1"> ],</span><br/><span class="hl-1"> },</span><br/><span class="hl-1">];</span>
80
+ <pre><code class="typescript"><span class="hl-4">import</span><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-1">LayoutComponent</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">ProvideNavigationConfig</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">withNavigationService</span><span class="hl-0">,</span><br/><span class="hl-0">} </span><span class="hl-4">from</span><span class="hl-0"> </span><span class="hl-3">&#39;@rxap/layout&#39;</span><span class="hl-0">;</span><br/><span class="hl-4">import</span><span class="hl-0"> { </span><span class="hl-1">APP_NAVIGATION</span><span class="hl-0"> } </span><span class="hl-4">from</span><span class="hl-0"> </span><span class="hl-3">&#39;./app.navigation&#39;</span><span class="hl-0">;</span><br/><br/><span class="hl-5">const</span><span class="hl-0"> </span><span class="hl-6">ROUTES</span><span class="hl-0">: </span><span class="hl-7">Route</span><span class="hl-0">[] = [</span><br/><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-1">path:</span><span class="hl-0"> </span><span class="hl-3">&#39;&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">component:</span><span class="hl-0"> </span><span class="hl-1">LayoutComponent</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">children:</span><span class="hl-0"> [ ],</span><br/><span class="hl-0"> </span><span class="hl-1">providers:</span><span class="hl-0"> [</span><br/><span class="hl-0"> </span><span class="hl-8">provideLayout</span><span class="hl-0">(</span><br/><span class="hl-0"> </span><span class="hl-8">withNavigationConfig</span><span class="hl-0">(</span><span class="hl-6">APP_NAVIGATION</span><span class="hl-0">),</span><br/><span class="hl-0"> </span><span class="hl-8">withSettingsMenuItems</span><span class="hl-0">(</span><br/><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-1">label:</span><span class="hl-0"> </span><span class="hl-3">&#39;Custom Item&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">icon:</span><span class="hl-0"> { </span><span class="hl-1">icon:</span><span class="hl-0"> </span><span class="hl-3">&#39;home&#39;</span><span class="hl-0"> },</span><br/><span class="hl-0"> </span><span class="hl-8">action</span><span class="hl-1">:</span><span class="hl-0"> () </span><span class="hl-5">=&gt;</span><span class="hl-0"> </span><span class="hl-8">inject</span><span class="hl-0">(</span><span class="hl-1">MatDialog</span><span class="hl-0">).</span><span class="hl-8">open</span><span class="hl-0">(</span><span class="hl-1">MyCustomDialogComponent</span><span class="hl-0">),</span><br/><span class="hl-0"> }</span><br/><span class="hl-0"> )</span><br/><span class="hl-0"> ),</span><br/><span class="hl-0"> ],</span><br/><span class="hl-0"> },</span><br/><span class="hl-0">];</span>
80
81
  </code><button type="button">Copy</button></pre>
81
82
 
82
83
  <a id="component" class="tsd-anchor"></a><h4 class="tsd-anchor-link">Component<a href="#component" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h4><p>If a component is provided ensure the component template uses the <code>mat-menu-item</code> component:</p>
83
84
  <pre><code class="angular17html"><button mat-menu-item>My Custom Item</button>
84
85
  </code><button type="button">Copy</button></pre>
85
86
 
86
- <pre><code class="typescript"><span class="hl-3">import</span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-4">LayoutComponent</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">ProvideNavigationConfig</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">withNavigationService</span><span class="hl-1">,</span><br/><span class="hl-1">} </span><span class="hl-3">from</span><span class="hl-1"> </span><span class="hl-2">&#39;@rxap/layout&#39;</span><span class="hl-1">;</span><br/><span class="hl-3">import</span><span class="hl-1"> { </span><span class="hl-4">APP_NAVIGATION</span><span class="hl-1"> } </span><span class="hl-3">from</span><span class="hl-1"> </span><span class="hl-2">&#39;./app.navigation&#39;</span><span class="hl-1">;</span><br/><br/><span class="hl-5">const</span><span class="hl-1"> </span><span class="hl-6">ROUTES</span><span class="hl-1">: </span><span class="hl-7">Route</span><span class="hl-1">[] = [</span><br/><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-4">path:</span><span class="hl-1"> </span><span class="hl-2">&#39;&#39;</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">component:</span><span class="hl-1"> </span><span class="hl-4">LayoutComponent</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-4">children:</span><span class="hl-1"> [ ],</span><br/><span class="hl-1"> </span><span class="hl-4">providers:</span><span class="hl-1"> [</span><br/><span class="hl-1"> </span><span class="hl-0">provideLayout</span><span class="hl-1">(</span><br/><span class="hl-1"> </span><span class="hl-0">withNavigationConfig</span><span class="hl-1">(</span><span class="hl-6">APP_NAVIGATION</span><span class="hl-1">),</span><br/><span class="hl-1"> </span><span class="hl-0">withSettingsMenuItems</span><span class="hl-1">(</span><br/><span class="hl-1"> </span><span class="hl-4">MyCustomMenuItemComponent</span><br/><span class="hl-1"> )</span><br/><span class="hl-1"> ),</span><br/><span class="hl-1"> ],</span><br/><span class="hl-1"> },</span><br/><span class="hl-1">];</span>
87
+ <pre><code class="typescript"><span class="hl-4">import</span><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-1">LayoutComponent</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">ProvideNavigationConfig</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">withNavigationService</span><span class="hl-0">,</span><br/><span class="hl-0">} </span><span class="hl-4">from</span><span class="hl-0"> </span><span class="hl-3">&#39;@rxap/layout&#39;</span><span class="hl-0">;</span><br/><span class="hl-4">import</span><span class="hl-0"> { </span><span class="hl-1">APP_NAVIGATION</span><span class="hl-0"> } </span><span class="hl-4">from</span><span class="hl-0"> </span><span class="hl-3">&#39;./app.navigation&#39;</span><span class="hl-0">;</span><br/><br/><span class="hl-5">const</span><span class="hl-0"> </span><span class="hl-6">ROUTES</span><span class="hl-0">: </span><span class="hl-7">Route</span><span class="hl-0">[] = [</span><br/><span class="hl-0"> {</span><br/><span class="hl-0"> </span><span class="hl-1">path:</span><span class="hl-0"> </span><span class="hl-3">&#39;&#39;</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">component:</span><span class="hl-0"> </span><span class="hl-1">LayoutComponent</span><span class="hl-0">,</span><br/><span class="hl-0"> </span><span class="hl-1">children:</span><span class="hl-0"> [ ],</span><br/><span class="hl-0"> </span><span class="hl-1">providers:</span><span class="hl-0"> [</span><br/><span class="hl-0"> </span><span class="hl-8">provideLayout</span><span class="hl-0">(</span><br/><span class="hl-0"> </span><span class="hl-8">withNavigationConfig</span><span class="hl-0">(</span><span class="hl-6">APP_NAVIGATION</span><span class="hl-0">),</span><br/><span class="hl-0"> </span><span class="hl-8">withSettingsMenuItems</span><span class="hl-0">(</span><br/><span class="hl-0"> </span><span class="hl-1">MyCustomMenuItemComponent</span><br/><span class="hl-0"> )</span><br/><span class="hl-0"> ),</span><br/><span class="hl-0"> ],</span><br/><span class="hl-0"> },</span><br/><span class="hl-0">];</span>
87
88
  </code><button type="button">Copy</button></pre>
88
89
 
89
90
  <a id="user-profile-wip" class="tsd-anchor"></a><h3 class="tsd-anchor-link">User Profile (WIP)<a href="#user-profile-wip" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h3><p>...</p>
@@ -97,10 +98,13 @@ that is rendered in the layout component, the template is rendered in the footer
97
98
  </ng-template>
98
99
  </code><button type="button">Copy</button></pre>
99
100
 
100
- <a id="generators" class="tsd-anchor"></a><h1 class="tsd-anchor-link">Generators<a href="#generators" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h1><a id="init" class="tsd-anchor"></a><h2 class="tsd-anchor-link">init<a href="#init" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><blockquote>
101
- <p>Initialize the package in the workspace</p>
102
- </blockquote>
103
- <pre><code class="bash"><span class="hl-0">yarn</span><span class="hl-1"> </span><span class="hl-2">nx</span><span class="hl-1"> </span><span class="hl-2">g</span><span class="hl-1"> </span><span class="hl-2">@rxap/layout:init</span>
104
- </code><button type="button">Copy</button></pre>
101
+ <a id="generators" class="tsd-anchor"></a><h1 class="tsd-anchor-link">Generators<a href="#generators" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h1><pre><code>##
102
+ init
103
+ &gt;
104
+ Initialize the package in the workspace
105
105
 
106
- </div></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><a href="#rxaplayout"><span>@rxap/layout</span></a><a href="#installation"><span>Installation</span></a><a href="#get-started"><span>Get started</span></a><ul><li><a href="#layout"><span>Layout</span></a></li><li><a href="#navigation-1"><span>Navigation</span></a></li><li><ul><li><a href="#navigation-item"><span>Navigation <wbr/>Item</span></a></li><li><ul><li><a href="#icon-property"><span>Icon <wbr/>Property</span></a></li><li><a href="#status-property"><span>Status <wbr/>Property</span></a></li></ul></li><li><a href="#navigation-divider-item"><span>Navigation <wbr/>Divider <wbr/>Item</span></a></li><li><a href="#navigation-insert-item-wip"><span>Navigation <wbr/>Insert <wbr/>Item (WIP)</span></a></li></ul></li><li><a href="#header"><span>Header</span></a></li><li><ul><li><a href="#apps-button"><span>Apps <wbr/>Button</span></a></li><li><a href="#settings-button-customization-wip"><span>Settings <wbr/>Button <wbr/>Customization (WIP)</span></a></li><li><ul><li><a href="#configuration-object"><span>Configuration <wbr/>Object</span></a></li><li><a href="#component"><span>Component</span></a></li></ul></li><li><a href="#user-profile-wip"><span>User <wbr/>Profile (WIP)</span></a></li></ul></li><li><a href="#dynamic-footer"><span>Dynamic <wbr/>Footer</span></a></li></ul><a href="#generators"><span>Generators</span></a><ul><li><a href="#init"><span>init</span></a></li></ul></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="modules.html">@rxap/layout</a><ul class="tsd-small-nested-navigation" id="tsd-nav-container"><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
106
+ ```bash nx g
107
+ @rxap/layout:init
108
+ ```
109
+ </code></pre>
110
+ </div></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><a href="#installation-add-the-package-to-your-workspace-bash-yarn-add"><span>Installation <wbr/>Add the package to your workspace: ```bash yarn add</span></a><a href="#get-started"><span>Get started</span></a><ul><li><a href="#layout"><span>Layout</span></a></li><li><a href="#navigation-1"><span>Navigation</span></a></li><li><ul><li><a href="#navigation-item"><span>Navigation <wbr/>Item</span></a></li><li><ul><li><a href="#icon-property"><span>Icon <wbr/>Property</span></a></li><li><a href="#status-property"><span>Status <wbr/>Property</span></a></li></ul></li><li><a href="#navigation-divider-item"><span>Navigation <wbr/>Divider <wbr/>Item</span></a></li><li><a href="#navigation-insert-item-wip"><span>Navigation <wbr/>Insert <wbr/>Item (WIP)</span></a></li></ul></li><li><a href="#header"><span>Header</span></a></li><li><ul><li><a href="#apps-button"><span>Apps <wbr/>Button</span></a></li><li><a href="#settings-button-customization-wip"><span>Settings <wbr/>Button <wbr/>Customization (WIP)</span></a></li><li><ul><li><a href="#configuration-object"><span>Configuration <wbr/>Object</span></a></li><li><a href="#component"><span>Component</span></a></li></ul></li><li><a href="#user-profile-wip"><span>User <wbr/>Profile (WIP)</span></a></li></ul></li><li><a href="#dynamic-footer"><span>Dynamic <wbr/>Footer</span></a></li></ul><a href="#generators"><span>Generators</span></a></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="modules.html">@rxap/layout</a><ul class="tsd-small-nested-navigation" id="tsd-nav-container"><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
@@ -1,3 +1,3 @@
1
- <!DOCTYPE html><html class="default" lang="en" data-base=".."><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>NavigationDividerItem | @rxap/layout</title><meta name="description" content="Documentation for @rxap/layout"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search"><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">@rxap/layout</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">@rxap/layout</a></li><li><a href="NavigationDividerItem.html">NavigationDividerItem</a></li></ul><h1>Interface NavigationDividerItem</h1></div><div class="tsd-signature"><span class="tsd-signature-keyword">interface</span> <span class="tsd-kind-interface">NavigationDividerItem</span> <span class="tsd-signature-symbol">{</span><br/>    <a class="tsd-kind-property" href="NavigationDividerItem.html#divider">divider</a><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">;</span><br/>    <a class="tsd-kind-property" href="NavigationDividerItem.html#title">title</a><span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">;</span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/rxap/packages/-/blob/5c9d13911b2e801186e53ea55b76b15441bb2700/packages/angular/layout/src/lib/navigation/navigation-item.ts#L17">navigation/navigation-item.ts:17</a></li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-accordion" open><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Index</h5></summary><div class="tsd-accordion-details"><section class="tsd-index-section"><h3 class="tsd-index-heading">Properties</h3><div class="tsd-index-list"><a href="NavigationDividerItem.html#divider" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>divider</span></a>
1
+ <!DOCTYPE html><html class="default" lang="en" data-base=".."><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>NavigationDividerItem | @rxap/layout</title><meta name="description" content="Documentation for @rxap/layout"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search"><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">@rxap/layout</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">@rxap/layout</a></li><li><a href="NavigationDividerItem.html">NavigationDividerItem</a></li></ul><h1>Interface NavigationDividerItem</h1></div><div class="tsd-signature"><span class="tsd-signature-keyword">interface</span> <span class="tsd-kind-interface">NavigationDividerItem</span> <span class="tsd-signature-symbol">{</span><br/>    <a class="tsd-kind-property" href="NavigationDividerItem.html#divider">divider</a><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">;</span><br/>    <a class="tsd-kind-property" href="NavigationDividerItem.html#title">title</a><span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">;</span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/rxap/packages/-/blob/969f0867a1da05a157f626d5bdd316bd0a67494a/packages/angular/layout/src/lib/navigation/navigation-item.ts#L17">navigation/navigation-item.ts:17</a></li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-accordion" open><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Index</h5></summary><div class="tsd-accordion-details"><section class="tsd-index-section"><h3 class="tsd-index-heading">Properties</h3><div class="tsd-index-list"><a href="NavigationDividerItem.html#divider" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>divider</span></a>
2
2
  <a href="NavigationDividerItem.html#title" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>title?</span></a>
3
- </div></section></div></details></section></section><details class="tsd-panel-group tsd-member-group tsd-accordion" open><summary class="tsd-accordion-summary" data-key="section-Properties"><h2><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg> Properties</h2></summary><section><section class="tsd-panel tsd-member"><a id="divider" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>divider</span><a href="#divider" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">divider</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/rxap/packages/-/blob/5c9d13911b2e801186e53ea55b76b15441bb2700/packages/angular/layout/src/lib/navigation/navigation-item.ts#L18">navigation/navigation-item.ts:18</a></li></ul></aside></section><section class="tsd-panel tsd-member"><a id="title" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><code class="tsd-tag">Optional</code><span>title</span><a href="#title" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">title</span><span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/rxap/packages/-/blob/5c9d13911b2e801186e53ea55b76b15441bb2700/packages/angular/layout/src/lib/navigation/navigation-item.ts#L19">navigation/navigation-item.ts:19</a></li></ul></aside></section></section></details></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><details open class="tsd-accordion tsd-page-navigation-section"><summary class="tsd-accordion-summary" data-key="section-Properties"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Properties</summary><div><a href="#divider" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>divider</span></a><a href="#title" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>title</span></a></div></details></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html">@rxap/layout</a><ul class="tsd-small-nested-navigation" id="tsd-nav-container"><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
3
+ </div></section></div></details></section></section><details class="tsd-panel-group tsd-member-group tsd-accordion" open><summary class="tsd-accordion-summary" data-key="section-Properties"><h2><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg> Properties</h2></summary><section><section class="tsd-panel tsd-member"><a id="divider" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>divider</span><a href="#divider" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">divider</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/rxap/packages/-/blob/969f0867a1da05a157f626d5bdd316bd0a67494a/packages/angular/layout/src/lib/navigation/navigation-item.ts#L18">navigation/navigation-item.ts:18</a></li></ul></aside></section><section class="tsd-panel tsd-member"><a id="title" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><code class="tsd-tag">Optional</code><span>title</span><a href="#title" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">title</span><span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/rxap/packages/-/blob/969f0867a1da05a157f626d5bdd316bd0a67494a/packages/angular/layout/src/lib/navigation/navigation-item.ts#L19">navigation/navigation-item.ts:19</a></li></ul></aside></section></section></details></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><details open class="tsd-accordion tsd-page-navigation-section"><summary class="tsd-accordion-summary" data-key="section-Properties"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Properties</summary><div><a href="#divider" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>divider</span></a><a href="#title" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>title</span></a></div></details></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html">@rxap/layout</a><ul class="tsd-small-nested-navigation" id="tsd-nav-container"><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
@@ -1,2 +1,2 @@
1
- <!DOCTYPE html><html class="default" lang="en" data-base=".."><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>NavigationInsertItem | @rxap/layout</title><meta name="description" content="Documentation for @rxap/layout"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search"><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">@rxap/layout</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">@rxap/layout</a></li><li><a href="NavigationInsertItem.html">NavigationInsertItem</a></li></ul><h1>Interface NavigationInsertItem</h1></div><div class="tsd-signature"><span class="tsd-signature-keyword">interface</span> <span class="tsd-kind-interface">NavigationInsertItem</span> <span class="tsd-signature-symbol">{</span><br/>    <a class="tsd-kind-property" href="NavigationInsertItem.html#insert">insert</a><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">;</span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/rxap/packages/-/blob/5c9d13911b2e801186e53ea55b76b15441bb2700/packages/angular/layout/src/lib/navigation/navigation-item.ts#L28">navigation/navigation-item.ts:28</a></li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-accordion" open><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Index</h5></summary><div class="tsd-accordion-details"><section class="tsd-index-section"><h3 class="tsd-index-heading">Properties</h3><div class="tsd-index-list"><a href="NavigationInsertItem.html#insert" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>insert</span></a>
2
- </div></section></div></details></section></section><details class="tsd-panel-group tsd-member-group tsd-accordion" open><summary class="tsd-accordion-summary" data-key="section-Properties"><h2><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg> Properties</h2></summary><section><section class="tsd-panel tsd-member"><a id="insert" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>insert</span><a href="#insert" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">insert</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/rxap/packages/-/blob/5c9d13911b2e801186e53ea55b76b15441bb2700/packages/angular/layout/src/lib/navigation/navigation-item.ts#L29">navigation/navigation-item.ts:29</a></li></ul></aside></section></section></details></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><details open class="tsd-accordion tsd-page-navigation-section"><summary class="tsd-accordion-summary" data-key="section-Properties"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Properties</summary><div><a href="#insert" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>insert</span></a></div></details></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html">@rxap/layout</a><ul class="tsd-small-nested-navigation" id="tsd-nav-container"><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
1
+ <!DOCTYPE html><html class="default" lang="en" data-base=".."><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>NavigationInsertItem | @rxap/layout</title><meta name="description" content="Documentation for @rxap/layout"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search"><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">@rxap/layout</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">@rxap/layout</a></li><li><a href="NavigationInsertItem.html">NavigationInsertItem</a></li></ul><h1>Interface NavigationInsertItem</h1></div><div class="tsd-signature"><span class="tsd-signature-keyword">interface</span> <span class="tsd-kind-interface">NavigationInsertItem</span> <span class="tsd-signature-symbol">{</span><br/>    <a class="tsd-kind-property" href="NavigationInsertItem.html#insert">insert</a><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">;</span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/rxap/packages/-/blob/969f0867a1da05a157f626d5bdd316bd0a67494a/packages/angular/layout/src/lib/navigation/navigation-item.ts#L28">navigation/navigation-item.ts:28</a></li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-accordion" open><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Index</h5></summary><div class="tsd-accordion-details"><section class="tsd-index-section"><h3 class="tsd-index-heading">Properties</h3><div class="tsd-index-list"><a href="NavigationInsertItem.html#insert" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>insert</span></a>
2
+ </div></section></div></details></section></section><details class="tsd-panel-group tsd-member-group tsd-accordion" open><summary class="tsd-accordion-summary" data-key="section-Properties"><h2><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg> Properties</h2></summary><section><section class="tsd-panel tsd-member"><a id="insert" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>insert</span><a href="#insert" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">insert</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/rxap/packages/-/blob/969f0867a1da05a157f626d5bdd316bd0a67494a/packages/angular/layout/src/lib/navigation/navigation-item.ts#L29">navigation/navigation-item.ts:29</a></li></ul></aside></section></section></details></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><details open class="tsd-accordion tsd-page-navigation-section"><summary class="tsd-accordion-summary" data-key="section-Properties"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Properties</summary><div><a href="#insert" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24" aria-label="Property"><use href="../assets/icons.svg#icon-1024"></use></svg><span>insert</span></a></div></details></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html">@rxap/layout</a><ul class="tsd-small-nested-navigation" id="tsd-nav-container"><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>