@koobiq/components 17.0.0-beta.2 → 17.0.0-rc.10

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 (369) hide show
  1. package/README.md +1 -2
  2. package/alert/_alert-theme.scss +48 -24
  3. package/alert/alert.component.d.ts +23 -3
  4. package/alert/alert.component.scss +91 -59
  5. package/autocomplete/_autocomplete-theme.scss +3 -3
  6. package/autocomplete/autocomplete.scss +8 -18
  7. package/badge/_badge-theme.scss +30 -45
  8. package/badge/badge.component.scss +18 -39
  9. package/button/_button-base.scss +7 -14
  10. package/button/_button-theme.scss +30 -86
  11. package/button/button.component.d.ts +3 -2
  12. package/button/button.scss +7 -17
  13. package/button-toggle/_button-toggle-theme.scss +19 -20
  14. package/button-toggle/button-toggle.scss +17 -44
  15. package/card/_card-theme.scss +18 -17
  16. package/card/card.component.scss +3 -6
  17. package/checkbox/_checkbox-theme.scss +50 -50
  18. package/checkbox/checkbox.scss +31 -35
  19. package/code-block/README.md +18 -14
  20. package/code-block/_code-block-theme.scss +53 -23
  21. package/code-block/actionbar.component.scss +11 -25
  22. package/code-block/code-block.component.d.ts +12 -4
  23. package/code-block/code-block.scss +62 -77
  24. package/core/form-field/form-field-ref.d.ts +2 -0
  25. package/core/forms/_forms-theme.scss +4 -8
  26. package/core/forms/_forms.scss +13 -43
  27. package/core/locales/formatters.d.ts +96 -0
  28. package/core/locales/locale-service.d.ts +97 -0
  29. package/core/option/_optgroup-theme.scss +4 -6
  30. package/core/option/_option-action-theme.scss +8 -11
  31. package/core/option/_option-theme.scss +15 -20
  32. package/core/option/optgroup.scss +0 -1
  33. package/core/option/option.scss +0 -1
  34. package/core/pop-up/_pop-up.scss +0 -1
  35. package/core/pop-up/pop-up-trigger.d.ts +3 -1
  36. package/core/select/common.d.ts +35 -0
  37. package/core/select/index.d.ts +1 -0
  38. package/core/selection/pseudo-checkbox/_pseudo-checkbox-theme.scss +15 -19
  39. package/core/selection/pseudo-checkbox/pseudo-checkbox.scss +9 -9
  40. package/core/services/theme.service.d.ts +3 -2
  41. package/core/styles/_core.scss +0 -1
  42. package/core/styles/_koobiq-theme.scss +5 -3
  43. package/core/styles/common/_animation.scss +9 -8
  44. package/core/styles/common/_button.scss +0 -2
  45. package/core/styles/common/_clearfix.scss +1 -1
  46. package/core/styles/common/_groups.scss +3 -9
  47. package/core/styles/common/_list.scss +28 -31
  48. package/core/styles/common/_overlay.scss +4 -3
  49. package/core/styles/common/_popup.scss +5 -5
  50. package/core/styles/common/_rtl.scss +4 -4
  51. package/core/styles/common/_select.scss +48 -42
  52. package/core/styles/common/_tokens.scss +47 -0
  53. package/core/styles/functions/_number.scss +14 -19
  54. package/core/styles/functions/_string.scss +18 -19
  55. package/core/styles/functions/_timing.scss +24 -24
  56. package/core/styles/theming/_components-theming.scss +1380 -1384
  57. package/core/styles/theming/_scrollbar-theme.scss +8 -5
  58. package/core/styles/theming/_theming.scss +26 -29
  59. package/core/styles/typography/_typography-utils.scss +1 -2
  60. package/core/styles/typography/_typography.scss +138 -85
  61. package/core/styles/visual/_body.scss +0 -2
  62. package/core/styles/visual/_layout.scss +44 -38
  63. package/core/utils/data-size/config.d.ts +20 -2
  64. package/core/utils/data-size/data-size.pipe.d.ts +10 -9
  65. package/core/utils/data-size/size.d.ts +3 -4
  66. package/datepicker/_datepicker-theme.scss +38 -40
  67. package/datepicker/calendar-body.scss +3 -11
  68. package/datepicker/calendar-header.scss +4 -10
  69. package/datepicker/calendar.scss +5 -17
  70. package/datepicker/datepicker-content.scss +5 -15
  71. package/datepicker/datepicker-input.scss +0 -5
  72. package/datepicker/datepicker-toggle.scss +3 -3
  73. package/divider/_divider-theme.scss +2 -1
  74. package/divider/divider.scss +9 -26
  75. package/dl/_dl-theme.scss +5 -8
  76. package/dl/dl.scss +5 -20
  77. package/dropdown/_dropdown-theme.scss +27 -22
  78. package/dropdown/dropdown-item.scss +5 -12
  79. package/dropdown/dropdown-trigger.directive.d.ts +2 -2
  80. package/dropdown/dropdown.scss +6 -15
  81. package/ellipsis-center/ellipsis-center.directive.d.ts +3 -2
  82. package/empty-state/README.md +0 -0
  83. package/empty-state/_empty-state-theme.scss +56 -0
  84. package/empty-state/empty-state.component.d.ts +31 -0
  85. package/empty-state/empty-state.module.d.ts +10 -0
  86. package/empty-state/empty-state.scss +81 -0
  87. package/empty-state/index.d.ts +1 -0
  88. package/empty-state/public-api.d.ts +2 -0
  89. package/esm2022/alert/alert.component.mjs +52 -5
  90. package/esm2022/badge/badge.component.mjs +2 -2
  91. package/esm2022/button/button.component.mjs +13 -6
  92. package/esm2022/button-toggle/button-toggle.component.mjs +2 -2
  93. package/esm2022/checkbox/checkbox.mjs +2 -2
  94. package/esm2022/code-block/actionbar.component.mjs +2 -2
  95. package/esm2022/code-block/code-block.component.mjs +58 -14
  96. package/esm2022/core/animation/select-animations.mjs +4 -4
  97. package/esm2022/core/form-field/form-field-ref.mjs +1 -1
  98. package/esm2022/core/locales/formatters.mjs +97 -1
  99. package/esm2022/core/locales/locale-service.mjs +5 -2
  100. package/esm2022/core/option/option.mjs +2 -2
  101. package/esm2022/core/pop-up/pop-up-trigger.mjs +18 -11
  102. package/esm2022/core/select/common.mjs +120 -0
  103. package/esm2022/core/select/index.mjs +2 -1
  104. package/esm2022/core/services/theme.service.mjs +4 -1
  105. package/esm2022/core/utils/data-size/config.mjs +5 -17
  106. package/esm2022/core/utils/data-size/data-size.pipe.mjs +36 -22
  107. package/esm2022/core/utils/data-size/size.mjs +10 -14
  108. package/esm2022/core/version.mjs +2 -2
  109. package/esm2022/datepicker/calendar-header.component.mjs +1 -1
  110. package/esm2022/datepicker/datepicker-animations.mjs +2 -2
  111. package/esm2022/dropdown/dropdown-animations.mjs +4 -4
  112. package/esm2022/dropdown/dropdown-item.component.mjs +2 -2
  113. package/esm2022/dropdown/dropdown-trigger.directive.mjs +4 -4
  114. package/esm2022/ellipsis-center/ellipsis-center.directive.mjs +7 -5
  115. package/esm2022/empty-state/empty-state.component.mjs +104 -0
  116. package/esm2022/empty-state/empty-state.module.mjs +50 -0
  117. package/esm2022/empty-state/index.mjs +2 -0
  118. package/esm2022/empty-state/koobiq-components-empty-state.mjs +5 -0
  119. package/esm2022/empty-state/public-api.mjs +3 -0
  120. package/esm2022/file-upload/file-upload.mjs +15 -1
  121. package/esm2022/file-upload/file-upload.module.mjs +15 -5
  122. package/esm2022/file-upload/multiple-file-upload.component.mjs +98 -49
  123. package/esm2022/file-upload/single-file-upload.component.mjs +110 -54
  124. package/esm2022/form-field/form-field.mjs +2 -2
  125. package/esm2022/form-field/hint.mjs +2 -2
  126. package/esm2022/form-field/password-hint.mjs +2 -2
  127. package/esm2022/form-field/password-toggle.mjs +11 -9
  128. package/esm2022/icon/icon-item.component.mjs +16 -6
  129. package/esm2022/input/input-number.mjs +2 -2
  130. package/esm2022/list/list-selection.component.mjs +2 -2
  131. package/esm2022/list/list.component.mjs +2 -2
  132. package/esm2022/loader-overlay/loader-overlay.component.mjs +2 -2
  133. package/esm2022/markdown/markdown.component.mjs +2 -2
  134. package/esm2022/modal/modal.component.mjs +8 -9
  135. package/esm2022/navbar/navbar-item.component.mjs +11 -11
  136. package/esm2022/navbar/navbar.component.mjs +2 -2
  137. package/esm2022/navbar/vertical-navbar.component.mjs +2 -2
  138. package/esm2022/popover/popover-confirm.component.mjs +3 -3
  139. package/esm2022/popover/popover.component.mjs +3 -3
  140. package/esm2022/radio/radio.component.mjs +2 -2
  141. package/esm2022/scrollbar/scrollbar.component.mjs +2 -2
  142. package/esm2022/select/select-option.directive.mjs +7 -5
  143. package/esm2022/select/select.component.mjs +71 -125
  144. package/esm2022/select/select.module.mjs +28 -28
  145. package/esm2022/splitter/splitter.component.mjs +37 -17
  146. package/esm2022/table/table.component.mjs +29 -6
  147. package/esm2022/table/table.module.mjs +14 -6
  148. package/esm2022/tabs/tab-body.component.mjs +1 -1
  149. package/esm2022/tabs/tab-group.component.mjs +55 -13
  150. package/esm2022/tabs/tab-header.component.mjs +2 -2
  151. package/esm2022/tabs/tab-nav-bar/tab-nav-bar.mjs +2 -2
  152. package/esm2022/tags/tag-default-options.mjs +1 -1
  153. package/esm2022/tags/tag-input.mjs +17 -3
  154. package/esm2022/tags/tag-list.component.mjs +2 -2
  155. package/esm2022/tags/tag.component.mjs +4 -4
  156. package/esm2022/textarea/textarea.component.mjs +12 -10
  157. package/esm2022/timepicker/timepicker.directive.mjs +11 -3
  158. package/esm2022/timezone/timezone-option.component.mjs +2 -2
  159. package/esm2022/timezone/timezone-option.directive.mjs +7 -5
  160. package/esm2022/timezone/timezone-select.component.mjs +5 -5
  161. package/esm2022/title/title.directive.mjs +3 -4
  162. package/esm2022/toast/toast-container.component.mjs +2 -2
  163. package/esm2022/toast/toast.component.mjs +4 -4
  164. package/esm2022/toast/toast.service.mjs +18 -13
  165. package/esm2022/toast/toast.type.mjs +3 -1
  166. package/esm2022/tooltip/tooltip.component.mjs +28 -14
  167. package/esm2022/tree/padding.directive.mjs +2 -2
  168. package/esm2022/tree/tree-base.mjs +2 -2
  169. package/esm2022/tree/tree-option.component.mjs +2 -2
  170. package/esm2022/tree/tree-selection.component.mjs +6 -1
  171. package/esm2022/tree-select/tree-select.component.mjs +29 -44
  172. package/esm2022/tree-select/tree-select.module.mjs +31 -11
  173. package/fesm2022/koobiq-components-alert.mjs +52 -5
  174. package/fesm2022/koobiq-components-alert.mjs.map +1 -1
  175. package/fesm2022/koobiq-components-badge.mjs +2 -2
  176. package/fesm2022/koobiq-components-badge.mjs.map +1 -1
  177. package/fesm2022/koobiq-components-button-toggle.mjs +2 -2
  178. package/fesm2022/koobiq-components-button-toggle.mjs.map +1 -1
  179. package/fesm2022/koobiq-components-button.mjs +12 -5
  180. package/fesm2022/koobiq-components-button.mjs.map +1 -1
  181. package/fesm2022/koobiq-components-checkbox.mjs +2 -2
  182. package/fesm2022/koobiq-components-checkbox.mjs.map +1 -1
  183. package/fesm2022/koobiq-components-code-block.mjs +57 -14
  184. package/fesm2022/koobiq-components-code-block.mjs.map +1 -1
  185. package/fesm2022/koobiq-components-core.mjs +285 -67
  186. package/fesm2022/koobiq-components-core.mjs.map +1 -1
  187. package/fesm2022/koobiq-components-datepicker.mjs +2 -2
  188. package/fesm2022/koobiq-components-datepicker.mjs.map +1 -1
  189. package/fesm2022/koobiq-components-dropdown.mjs +8 -8
  190. package/fesm2022/koobiq-components-dropdown.mjs.map +1 -1
  191. package/fesm2022/koobiq-components-ellipsis-center.mjs +5 -4
  192. package/fesm2022/koobiq-components-ellipsis-center.mjs.map +1 -1
  193. package/fesm2022/koobiq-components-empty-state.mjs +157 -0
  194. package/fesm2022/koobiq-components-empty-state.mjs.map +1 -0
  195. package/fesm2022/koobiq-components-file-upload.mjs +225 -97
  196. package/fesm2022/koobiq-components-file-upload.mjs.map +1 -1
  197. package/fesm2022/koobiq-components-form-field.mjs +21 -21
  198. package/fesm2022/koobiq-components-form-field.mjs.map +1 -1
  199. package/fesm2022/koobiq-components-icon.mjs +14 -4
  200. package/fesm2022/koobiq-components-icon.mjs.map +1 -1
  201. package/fesm2022/koobiq-components-input.mjs +1 -1
  202. package/fesm2022/koobiq-components-input.mjs.map +1 -1
  203. package/fesm2022/koobiq-components-list.mjs +4 -4
  204. package/fesm2022/koobiq-components-list.mjs.map +1 -1
  205. package/fesm2022/koobiq-components-loader-overlay.mjs +1 -1
  206. package/fesm2022/koobiq-components-loader-overlay.mjs.map +1 -1
  207. package/fesm2022/koobiq-components-markdown.mjs +2 -2
  208. package/fesm2022/koobiq-components-modal.mjs +7 -8
  209. package/fesm2022/koobiq-components-modal.mjs.map +1 -1
  210. package/fesm2022/koobiq-components-navbar.mjs +14 -14
  211. package/fesm2022/koobiq-components-navbar.mjs.map +1 -1
  212. package/fesm2022/koobiq-components-popover.mjs +4 -4
  213. package/fesm2022/koobiq-components-popover.mjs.map +1 -1
  214. package/fesm2022/koobiq-components-radio.mjs +2 -2
  215. package/fesm2022/koobiq-components-radio.mjs.map +1 -1
  216. package/fesm2022/koobiq-components-scrollbar.mjs +2 -2
  217. package/fesm2022/koobiq-components-scrollbar.mjs.map +1 -1
  218. package/fesm2022/koobiq-components-select.mjs +102 -155
  219. package/fesm2022/koobiq-components-select.mjs.map +1 -1
  220. package/fesm2022/koobiq-components-splitter.mjs +36 -16
  221. package/fesm2022/koobiq-components-splitter.mjs.map +1 -1
  222. package/fesm2022/koobiq-components-table.mjs +41 -10
  223. package/fesm2022/koobiq-components-table.mjs.map +1 -1
  224. package/fesm2022/koobiq-components-tabs.mjs +57 -15
  225. package/fesm2022/koobiq-components-tabs.mjs.map +1 -1
  226. package/fesm2022/koobiq-components-tags.mjs +21 -8
  227. package/fesm2022/koobiq-components-tags.mjs.map +1 -1
  228. package/fesm2022/koobiq-components-textarea.mjs +11 -9
  229. package/fesm2022/koobiq-components-textarea.mjs.map +1 -1
  230. package/fesm2022/koobiq-components-timepicker.mjs +10 -2
  231. package/fesm2022/koobiq-components-timepicker.mjs.map +1 -1
  232. package/fesm2022/koobiq-components-timezone.mjs +11 -10
  233. package/fesm2022/koobiq-components-timezone.mjs.map +1 -1
  234. package/fesm2022/koobiq-components-title.mjs +2 -3
  235. package/fesm2022/koobiq-components-title.mjs.map +1 -1
  236. package/fesm2022/koobiq-components-toast.mjs +25 -17
  237. package/fesm2022/koobiq-components-toast.mjs.map +1 -1
  238. package/fesm2022/koobiq-components-tooltip.mjs +26 -13
  239. package/fesm2022/koobiq-components-tooltip.mjs.map +1 -1
  240. package/fesm2022/koobiq-components-tree-select.mjs +57 -51
  241. package/fesm2022/koobiq-components-tree-select.mjs.map +1 -1
  242. package/fesm2022/koobiq-components-tree.mjs +9 -4
  243. package/fesm2022/koobiq-components-tree.mjs.map +1 -1
  244. package/file-upload/_file-upload-theme.scss +124 -73
  245. package/file-upload/file-upload.d.ts +1 -1
  246. package/file-upload/file-upload.module.d.ts +11 -9
  247. package/file-upload/file-upload.scss +0 -6
  248. package/file-upload/multiple-file-upload.component.d.ts +38 -10
  249. package/file-upload/multiple-file-upload.component.scss +50 -120
  250. package/file-upload/single-file-upload.component.d.ts +40 -13
  251. package/file-upload/single-file-upload.component.scss +12 -33
  252. package/form-field/_form-field-theme.scss +46 -36
  253. package/form-field/_hint-theme.scss +15 -20
  254. package/form-field/cleaner.scss +3 -9
  255. package/form-field/form-field.scss +23 -26
  256. package/form-field/hint.scss +5 -8
  257. package/form-field/password-toggle.d.ts +3 -2
  258. package/form-field/password-toggle.scss +3 -10
  259. package/form-field/stepper.scss +4 -11
  260. package/icon/_icon-button-theme.scss +47 -36
  261. package/icon/_icon-item-theme.scss +47 -26
  262. package/icon/_icon-theme.scss +12 -14
  263. package/icon/icon-button.scss +5 -20
  264. package/icon/icon-item.component.d.ts +3 -1
  265. package/icon/icon-item.scss +10 -8
  266. package/icon/icon.scss +0 -6
  267. package/input/_input-theme.scss +6 -4
  268. package/input/input.scss +11 -10
  269. package/link/_link-theme.scss +30 -49
  270. package/list/_list-theme.scss +21 -19
  271. package/list/list.scss +2 -6
  272. package/loader-overlay/_loader-overlay-theme.scss +17 -18
  273. package/loader-overlay/loader-overlay.scss +9 -33
  274. package/markdown/_markdown-theme.scss +47 -47
  275. package/markdown/markdown.scss +41 -91
  276. package/modal/README.md +5 -4
  277. package/modal/_modal-animation.scss +0 -1
  278. package/modal/_modal-confirm.scss +2 -7
  279. package/modal/_modal-theme.scss +11 -13
  280. package/modal/modal.component.d.ts +1 -1
  281. package/modal/modal.scss +15 -31
  282. package/navbar/README.md +21 -20
  283. package/navbar/_navbar-item_horizontal.scss +28 -29
  284. package/navbar/_navbar-item_vertical.scss +31 -31
  285. package/navbar/_navbar-theme.scss +20 -24
  286. package/navbar/navbar-brand.scss +24 -27
  287. package/navbar/navbar-divider.scss +4 -8
  288. package/navbar/navbar-item.component.d.ts +4 -4
  289. package/navbar/navbar-item.scss +13 -15
  290. package/navbar/navbar.scss +2 -6
  291. package/navbar/vertical-navbar.scss +4 -6
  292. package/package.json +23 -16
  293. package/popover/README.md +18 -14
  294. package/popover/_popover-theme.scss +9 -17
  295. package/popover/popover.scss +15 -29
  296. package/prebuilt-themes/dark-theme.css +1 -1
  297. package/prebuilt-themes/light-theme.css +1 -1
  298. package/progress-bar/_progress-bar-theme.scss +7 -11
  299. package/progress-bar/progress-bar.scss +6 -19
  300. package/progress-spinner/_progress-spinner-theme.scss +6 -8
  301. package/progress-spinner/progress-spinner.scss +8 -18
  302. package/radio/_radio-theme.scss +36 -37
  303. package/radio/radio.scss +25 -40
  304. package/risk-level/_risk-level-theme.scss +25 -31
  305. package/risk-level/risk-level.component.scss +4 -10
  306. package/schematics/collection.json +11 -0
  307. package/schematics/ng-add/index.js +70 -0
  308. package/schematics/ng-add/schema.json +15 -0
  309. package/scrollbar/_scrollbar-component-theme.scss +15 -19
  310. package/scrollbar/scrollbar.component.scss +68 -63
  311. package/scrollbar/scrollbar.directive.d.ts +1 -0
  312. package/scrollbar/scrollbar.types.d.ts +1 -0
  313. package/select/_select-theme.scss +14 -16
  314. package/select/select-option.directive.d.ts +3 -2
  315. package/select/select.component.d.ts +12 -33
  316. package/select/select.module.d.ts +1 -1
  317. package/select/select.scss +3 -11
  318. package/sidepanel/_sidepanel-theme.scss +8 -10
  319. package/sidepanel/sidepanel.scss +20 -37
  320. package/splitter/_splitter-theme.scss +5 -6
  321. package/splitter/splitter.component.d.ts +10 -5
  322. package/splitter/splitter.scss +0 -1
  323. package/table/_table-theme.scss +16 -15
  324. package/table/table.component.d.ts +8 -1
  325. package/table/table.module.d.ts +1 -1
  326. package/table/table.scss +41 -42
  327. package/tabs/_tabs-common.scss +13 -15
  328. package/tabs/_tabs-theme.scss +76 -44
  329. package/tabs/tab-body.component.d.ts +1 -1
  330. package/tabs/tab-group.component.d.ts +9 -3
  331. package/tabs/tab-group.scss +2 -8
  332. package/tabs/tab-header.scss +0 -10
  333. package/tabs/tab-nav-bar/tab-nav-bar.scss +2 -9
  334. package/tags/_tag-theme.scss +22 -27
  335. package/tags/tag-default-options.d.ts +1 -0
  336. package/tags/tag-input.d.ts +7 -1
  337. package/tags/tag-list.scss +15 -12
  338. package/tags/tag.component.d.ts +1 -1
  339. package/tags/tag.scss +5 -11
  340. package/textarea/_textarea-theme.scss +2 -5
  341. package/textarea/textarea.scss +5 -10
  342. package/timepicker/timepicker.directive.d.ts +1 -1
  343. package/timepicker/timepicker.scss +2 -8
  344. package/timezone/_timezone-option-theme.scss +8 -10
  345. package/timezone/timezone-option.component.scss +5 -8
  346. package/timezone/timezone-option.directive.d.ts +3 -2
  347. package/timezone/timezone-select.component.d.ts +2 -1
  348. package/timezone/timezone-select.component.scss +2 -4
  349. package/title/title.directive.d.ts +0 -1
  350. package/toast/_toast-theme.scss +20 -16
  351. package/toast/toast-container.component.scss +5 -6
  352. package/toast/toast.component.scss +28 -29
  353. package/toast/toast.service.d.ts +8 -4
  354. package/toast/toast.type.d.ts +2 -0
  355. package/toggle/_toggle-theme.scss +49 -42
  356. package/toggle/toggle.scss +9 -22
  357. package/tooltip/_tooltip-theme.scss +12 -16
  358. package/tooltip/tooltip.component.d.ts +12 -8
  359. package/tooltip/tooltip.scss +7 -13
  360. package/tree/_tree-theme.scss +20 -23
  361. package/tree/toggle.scss +3 -6
  362. package/tree/tree-base.d.ts +1 -1
  363. package/tree/tree-option.scss +17 -14
  364. package/tree/tree-selection.component.d.ts +1 -0
  365. package/tree-select/_tree-select-theme.scss +12 -15
  366. package/tree-select/tree-select.component.d.ts +8 -17
  367. package/tree-select/tree-select.module.d.ts +1 -2
  368. package/tree-select/tree-select.scss +1 -6
  369. package/core/styles/_variables.scss +0 -1
@@ -250,7 +250,7 @@ class KbqNavbar extends KbqFocusableComponent {
250
250
  });
251
251
  }
252
252
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqNavbar, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
253
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqNavbar, selector: "kbq-navbar", host: { listeners: { "focus": "focus()", "blur": "blur()", "keydown": "onKeyDown($event)", "window:resize": "resizeStream.next($event)" }, properties: { "attr.tabindex": "tabIndex" }, classAttribute: "kbq-navbar" }, queries: [{ propertyName: "rectangleElements", predicate: i0.forwardRef(() => KbqNavbarRectangleElement), descendants: true }, { propertyName: "navbarItems", predicate: i0.forwardRef(() => KbqNavbarItem), descendants: true }], usesInheritance: true, ngImport: i0, template: `<ng-content select="[kbq-navbar-container], kbq-navbar-container"></ng-content>`, isInline: true, styles: [".kbq-navbar{display:flex;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar-container{display:flex;flex-shrink:0;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar .kbq-navbar-container+.kbq-navbar-container{margin-left:24px}\n", ".kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-navbar-item.kbq-vertical{align-items:flex-start}.kbq-navbar-item.kbq-vertical .kbq-navbar-item__container{gap:12px}.kbq-navbar-item.kbq-vertical.kbq-expanded{height:48px;padding:16px 20px;gap:12px}.kbq-navbar-item.kbq-vertical.kbq-expanded:after{inset:4px 8px}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento{position:absolute;display:flex;justify-content:center;align-items:center;top:4px;right:4px;z-index:1;padding:8px;height:48px;width:48px}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento:after{inset:8px}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-item_has-nested{align-items:center;padding:0 12px}.kbq-navbar-item.kbq-vertical.kbq-collapsed{height:48px;width:48px;padding:16px;justify-content:center}.kbq-navbar-item.kbq-vertical.kbq-collapsed:after{inset:8px}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-badge{position:absolute;z-index:1;top:6px;right:6px}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-vertical>.kbq-icon{display:flex;justify-content:center;align-items:center}.kbq-navbar-item.kbq-horizontal{position:relative;flex-direction:row;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:48px;min-width:48px;padding:8px;justify-content:center}.kbq-navbar-item.kbq-horizontal:after{inset:8px}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__title{padding-left:4px;padding-right:4px}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__arrow-icon{padding-left:4px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed){padding:16px 12px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed):after{inset:8px 0}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed)>.kbq-icon{padding-right:4px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento{min-width:44px;justify-content:center;padding-right:4px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento:after{inset:8px 4px 8px 8px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed{justify-content:center;padding:8px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-horizontal .kbq-badge{position:absolute;z-index:1;top:6px;right:6px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_has-nested{padding:0 12px}.kbq-navbar-item{box-sizing:border-box;position:relative;display:flex;align-items:center;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-item .kbq-icon{min-width:16px;min-height:16px}.kbq-navbar-item:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-title{display:inline-block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-item__title{display:flex;flex-direction:column;align-self:center;min-width:0}.kbq-navbar-item__container{display:flex;flex-direction:row;flex:1 1 auto;justify-content:space-between;min-width:0}.kbq-navbar-item__container .kbq-icon{align-self:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button{flex:1}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper{justify-content:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_left{margin-left:unset}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_right{margin-right:unset}a.kbq-navbar-item,a.kbq-navbar-title{text-decoration:none}.kbq-navbar-item [kbq-button],.kbq-navbar-brand [kbq-button],.kbq-navbar-toggle [kbq-button]{z-index:1}\n", ".kbq-navbar-logo{display:flex}.kbq-navbar-brand{position:relative;display:flex;border-radius:8px}.kbq-navbar-brand:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-brand .kbq-navbar-title{cursor:pointer}a.kbq-navbar-brand{text-decoration:none}.kbq-navbar-brand.kbq-horizontal{padding:8px 6px 8px 4px;align-items:center;gap:8px}.kbq-navbar-brand.kbq-horizontal:after{inset:4px 4px 4px 0}.kbq-navbar-brand.kbq-horizontal .kbq-navbar-title{padding-right:12px}.kbq-navbar-brand.kbq-vertical .kbq-navbar-logo{align-items:center}.kbq-navbar-brand.kbq-vertical .kbq-navbar-title{display:block;align-items:center;padding-top:4px;padding-bottom:4px;height:32px;padding-left:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-brand.kbq-vertical.kbq-expanded{position:relative;height:40px;width:40px;margin:16px 16px 40px;flex-direction:column}.kbq-navbar-brand.kbq-vertical.kbq-expanded:after{inset:0}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-logo{min-height:40px;justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-title{position:absolute;left:4px;bottom:-40px;max-width:200px}.kbq-navbar-brand.kbq-vertical.kbq-collapsed{height:48px;width:48px;justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-collapsed:after{inset:4px}.kbq-navbar-brand.kbq-vertical.kbq-collapsed .kbq-navbar-title{display:none}\n", ".kbq-navbar-divider{display:block}.kbq-navbar-divider.kbq-vertical{height:1px;margin:8px 16px}.kbq-navbar-divider.kbq-horizontal{width:1px;height:12px;margin-left:12px;margin-right:12px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
253
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqNavbar, selector: "kbq-navbar", host: { listeners: { "focus": "focus()", "blur": "blur()", "keydown": "onKeyDown($event)", "window:resize": "resizeStream.next($event)" }, properties: { "attr.tabindex": "tabIndex" }, classAttribute: "kbq-navbar" }, queries: [{ propertyName: "rectangleElements", predicate: i0.forwardRef(() => KbqNavbarRectangleElement), descendants: true }, { propertyName: "navbarItems", predicate: i0.forwardRef(() => KbqNavbarItem), descendants: true }], usesInheritance: true, ngImport: i0, template: `<ng-content select="[kbq-navbar-container], kbq-navbar-container"></ng-content>`, isInline: true, styles: [".kbq-navbar{display:flex;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar-container{display:flex;flex-shrink:0;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar .kbq-navbar-container+.kbq-navbar-container{margin-left:var(--kbq-size-xxl, 24px)}\n", ".kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-navbar-item.kbq-vertical{align-items:flex-start}.kbq-navbar-item.kbq-vertical .kbq-navbar-item__container{gap:var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-vertical.kbq-expanded{height:var(--kbq-size-5xl, 48px);align-items:center;padding-right:var(--kbq-size-xl, 20px);padding-left:var(--kbq-size-xl, 20px);gap:var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-vertical.kbq-expanded:after{top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-xxs, 4px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento{position:absolute;display:flex;justify-content:center;align-items:center;top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-xxs, 4px);z-index:1;padding:var(--kbq-size-s, 8px);height:var(--kbq-size-5xl, 48px);width:var(--kbq-size-5xl, 48px)}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-item_has-nested{align-items:center;padding:0 var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-vertical.kbq-collapsed{height:var(--kbq-size-5xl, 48px);width:var(--kbq-size-5xl, 48px);padding:var(--kbq-size-l, 16px);justify-content:center}.kbq-navbar-item.kbq-vertical.kbq-collapsed:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-badge{position:absolute;z-index:1;top:var(--kbq-size-xs, 6px);right:var(--kbq-size-xs, 6px)}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-vertical>.kbq-icon{display:flex;justify-content:center;align-items:center}.kbq-navbar-item.kbq-horizontal{position:relative;flex-direction:row;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:var(--kbq-size-5xl, 48px);min-width:var(--kbq-size-5xl, 48px);padding:var(--kbq-size-s, 8px);justify-content:center}.kbq-navbar-item.kbq-horizontal:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__title{padding-left:var(--kbq-size-xxs, 4px);padding-right:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__arrow-icon{padding-left:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed){padding-right:var(--kbq-size-m, 12px);padding-left:var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed):after{top:var(--kbq-size-s, 8px);right:0;bottom:var(--kbq-size-s, 8px);left:0}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed)>.kbq-icon{align-self:center;padding-right:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento{min-width:44px;justify-content:center;padding-right:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-xxs, 4px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed{justify-content:center;padding:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-horizontal .kbq-badge{position:absolute;z-index:1;top:var(--kbq-size-xs, 6px);right:var(--kbq-size-xs, 6px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_has-nested{padding:0 var(--kbq-size-m, 12px)}.kbq-navbar-item{box-sizing:border-box;position:relative;display:flex;align-items:center;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-item .kbq-icon{min-width:var(--kbq-size-l, 16px);min-height:var(--kbq-size-l, 16px)}.kbq-navbar-item .kbq-button-icon{position:absolute;top:50%;transform:translateY(-50%)}.kbq-navbar-item:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-title{display:inline-block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-item__title{display:flex;flex-direction:column;align-self:center;min-width:0}.kbq-navbar-item__container{display:flex;flex-direction:row;flex:1 1 auto;justify-content:space-between;min-width:0}.kbq-navbar-item__container .kbq-icon{align-self:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button{flex:1}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper{justify-content:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_left{margin-left:unset}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_right{margin-right:unset}a.kbq-navbar-item,a.kbq-navbar-title{text-decoration:none}.kbq-navbar-item [kbq-button],.kbq-navbar-brand [kbq-button],.kbq-navbar-toggle [kbq-button]{z-index:1}\n", ".kbq-navbar-logo{display:flex}.kbq-navbar-brand{position:relative;display:flex;border-radius:var(--kbq-size-s, 8px)}.kbq-navbar-brand:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-brand .kbq-navbar-title{cursor:pointer}a.kbq-navbar-brand{text-decoration:none}.kbq-navbar-brand.kbq-horizontal{padding:var(--kbq-size-s, 8px) var(--kbq-size-xs, 6px) var(--kbq-size-s, 8px) var(--kbq-size-xxs, 4px);align-items:center;gap:var(--kbq-size-s, 8px)}.kbq-navbar-brand.kbq-horizontal:after{top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-xxs, 4px);bottom:var(--kbq-size-xxs, 4px);left:0}.kbq-navbar-brand.kbq-horizontal .kbq-navbar-title{padding-right:var(--kbq-size-m, 12px)}.kbq-navbar-brand.kbq-vertical .kbq-navbar-logo{align-items:center}.kbq-navbar-brand.kbq-vertical .kbq-navbar-title{display:block;align-items:center;padding-top:var(--kbq-size-xxs, 4px);padding-bottom:var(--kbq-size-xxs, 4px);height:var(--kbq-size-3xl, 32px);padding-left:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-brand.kbq-vertical.kbq-expanded{position:relative;height:var(--kbq-size-4xl, 40px);width:var(--kbq-size-4xl, 40px);margin:var(--kbq-size-l, 16px) var(--kbq-size-l, 16px) var(--kbq-size-4xl, 40px);flex-direction:column}.kbq-navbar-brand.kbq-vertical.kbq-expanded:after{inset:0}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-logo{min-height:var(--kbq-size-4xl, 40px);justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-title{position:absolute;left:var(--kbq-size-xxs, 4px);top:var(--kbq-size-4xl, 40px);max-width:200px}.kbq-navbar-brand.kbq-vertical.kbq-collapsed{height:var(--kbq-size-5xl, 48px);width:var(--kbq-size-5xl, 48px);justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-collapsed:after{top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-xxs, 4px);bottom:var(--kbq-size-xxs, 4px);left:var(--kbq-size-xxs, 4px)}.kbq-navbar-brand.kbq-vertical.kbq-collapsed .kbq-navbar-title{display:none}\n", ".kbq-navbar-divider{display:block}.kbq-navbar-divider.kbq-vertical{height:1px;margin:var(--kbq-size-s, 8px) var(--kbq-size-l, 16px)}.kbq-navbar-divider.kbq-horizontal{width:1px;height:12px;margin-left:var(--kbq-size-m, 12px);margin-right:var(--kbq-size-m, 12px)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
254
254
  }
255
255
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqNavbar, decorators: [{
256
256
  type: Component,
@@ -261,7 +261,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
261
261
  '(blur)': 'blur()',
262
262
  '(keydown)': 'onKeyDown($event)',
263
263
  '(window:resize)': 'resizeStream.next($event)'
264
- }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".kbq-navbar{display:flex;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar-container{display:flex;flex-shrink:0;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar .kbq-navbar-container+.kbq-navbar-container{margin-left:24px}\n", ".kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-navbar-item.kbq-vertical{align-items:flex-start}.kbq-navbar-item.kbq-vertical .kbq-navbar-item__container{gap:12px}.kbq-navbar-item.kbq-vertical.kbq-expanded{height:48px;padding:16px 20px;gap:12px}.kbq-navbar-item.kbq-vertical.kbq-expanded:after{inset:4px 8px}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento{position:absolute;display:flex;justify-content:center;align-items:center;top:4px;right:4px;z-index:1;padding:8px;height:48px;width:48px}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento:after{inset:8px}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-item_has-nested{align-items:center;padding:0 12px}.kbq-navbar-item.kbq-vertical.kbq-collapsed{height:48px;width:48px;padding:16px;justify-content:center}.kbq-navbar-item.kbq-vertical.kbq-collapsed:after{inset:8px}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-badge{position:absolute;z-index:1;top:6px;right:6px}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-vertical>.kbq-icon{display:flex;justify-content:center;align-items:center}.kbq-navbar-item.kbq-horizontal{position:relative;flex-direction:row;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:48px;min-width:48px;padding:8px;justify-content:center}.kbq-navbar-item.kbq-horizontal:after{inset:8px}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__title{padding-left:4px;padding-right:4px}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__arrow-icon{padding-left:4px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed){padding:16px 12px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed):after{inset:8px 0}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed)>.kbq-icon{padding-right:4px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento{min-width:44px;justify-content:center;padding-right:4px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento:after{inset:8px 4px 8px 8px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed{justify-content:center;padding:8px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-horizontal .kbq-badge{position:absolute;z-index:1;top:6px;right:6px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_has-nested{padding:0 12px}.kbq-navbar-item{box-sizing:border-box;position:relative;display:flex;align-items:center;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-item .kbq-icon{min-width:16px;min-height:16px}.kbq-navbar-item:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-title{display:inline-block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-item__title{display:flex;flex-direction:column;align-self:center;min-width:0}.kbq-navbar-item__container{display:flex;flex-direction:row;flex:1 1 auto;justify-content:space-between;min-width:0}.kbq-navbar-item__container .kbq-icon{align-self:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button{flex:1}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper{justify-content:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_left{margin-left:unset}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_right{margin-right:unset}a.kbq-navbar-item,a.kbq-navbar-title{text-decoration:none}.kbq-navbar-item [kbq-button],.kbq-navbar-brand [kbq-button],.kbq-navbar-toggle [kbq-button]{z-index:1}\n", ".kbq-navbar-logo{display:flex}.kbq-navbar-brand{position:relative;display:flex;border-radius:8px}.kbq-navbar-brand:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-brand .kbq-navbar-title{cursor:pointer}a.kbq-navbar-brand{text-decoration:none}.kbq-navbar-brand.kbq-horizontal{padding:8px 6px 8px 4px;align-items:center;gap:8px}.kbq-navbar-brand.kbq-horizontal:after{inset:4px 4px 4px 0}.kbq-navbar-brand.kbq-horizontal .kbq-navbar-title{padding-right:12px}.kbq-navbar-brand.kbq-vertical .kbq-navbar-logo{align-items:center}.kbq-navbar-brand.kbq-vertical .kbq-navbar-title{display:block;align-items:center;padding-top:4px;padding-bottom:4px;height:32px;padding-left:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-brand.kbq-vertical.kbq-expanded{position:relative;height:40px;width:40px;margin:16px 16px 40px;flex-direction:column}.kbq-navbar-brand.kbq-vertical.kbq-expanded:after{inset:0}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-logo{min-height:40px;justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-title{position:absolute;left:4px;bottom:-40px;max-width:200px}.kbq-navbar-brand.kbq-vertical.kbq-collapsed{height:48px;width:48px;justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-collapsed:after{inset:4px}.kbq-navbar-brand.kbq-vertical.kbq-collapsed .kbq-navbar-title{display:none}\n", ".kbq-navbar-divider{display:block}.kbq-navbar-divider.kbq-vertical{height:1px;margin:8px 16px}.kbq-navbar-divider.kbq-horizontal{width:1px;height:12px;margin-left:12px;margin-right:12px}\n"] }]
264
+ }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".kbq-navbar{display:flex;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar-container{display:flex;flex-shrink:0;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar .kbq-navbar-container+.kbq-navbar-container{margin-left:var(--kbq-size-xxl, 24px)}\n", ".kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-navbar-item.kbq-vertical{align-items:flex-start}.kbq-navbar-item.kbq-vertical .kbq-navbar-item__container{gap:var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-vertical.kbq-expanded{height:var(--kbq-size-5xl, 48px);align-items:center;padding-right:var(--kbq-size-xl, 20px);padding-left:var(--kbq-size-xl, 20px);gap:var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-vertical.kbq-expanded:after{top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-xxs, 4px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento{position:absolute;display:flex;justify-content:center;align-items:center;top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-xxs, 4px);z-index:1;padding:var(--kbq-size-s, 8px);height:var(--kbq-size-5xl, 48px);width:var(--kbq-size-5xl, 48px)}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-item_has-nested{align-items:center;padding:0 var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-vertical.kbq-collapsed{height:var(--kbq-size-5xl, 48px);width:var(--kbq-size-5xl, 48px);padding:var(--kbq-size-l, 16px);justify-content:center}.kbq-navbar-item.kbq-vertical.kbq-collapsed:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-badge{position:absolute;z-index:1;top:var(--kbq-size-xs, 6px);right:var(--kbq-size-xs, 6px)}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-vertical>.kbq-icon{display:flex;justify-content:center;align-items:center}.kbq-navbar-item.kbq-horizontal{position:relative;flex-direction:row;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:var(--kbq-size-5xl, 48px);min-width:var(--kbq-size-5xl, 48px);padding:var(--kbq-size-s, 8px);justify-content:center}.kbq-navbar-item.kbq-horizontal:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__title{padding-left:var(--kbq-size-xxs, 4px);padding-right:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__arrow-icon{padding-left:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed){padding-right:var(--kbq-size-m, 12px);padding-left:var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed):after{top:var(--kbq-size-s, 8px);right:0;bottom:var(--kbq-size-s, 8px);left:0}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed)>.kbq-icon{align-self:center;padding-right:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento{min-width:44px;justify-content:center;padding-right:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-xxs, 4px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed{justify-content:center;padding:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-horizontal .kbq-badge{position:absolute;z-index:1;top:var(--kbq-size-xs, 6px);right:var(--kbq-size-xs, 6px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_has-nested{padding:0 var(--kbq-size-m, 12px)}.kbq-navbar-item{box-sizing:border-box;position:relative;display:flex;align-items:center;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-item .kbq-icon{min-width:var(--kbq-size-l, 16px);min-height:var(--kbq-size-l, 16px)}.kbq-navbar-item .kbq-button-icon{position:absolute;top:50%;transform:translateY(-50%)}.kbq-navbar-item:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-title{display:inline-block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-item__title{display:flex;flex-direction:column;align-self:center;min-width:0}.kbq-navbar-item__container{display:flex;flex-direction:row;flex:1 1 auto;justify-content:space-between;min-width:0}.kbq-navbar-item__container .kbq-icon{align-self:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button{flex:1}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper{justify-content:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_left{margin-left:unset}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_right{margin-right:unset}a.kbq-navbar-item,a.kbq-navbar-title{text-decoration:none}.kbq-navbar-item [kbq-button],.kbq-navbar-brand [kbq-button],.kbq-navbar-toggle [kbq-button]{z-index:1}\n", ".kbq-navbar-logo{display:flex}.kbq-navbar-brand{position:relative;display:flex;border-radius:var(--kbq-size-s, 8px)}.kbq-navbar-brand:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-brand .kbq-navbar-title{cursor:pointer}a.kbq-navbar-brand{text-decoration:none}.kbq-navbar-brand.kbq-horizontal{padding:var(--kbq-size-s, 8px) var(--kbq-size-xs, 6px) var(--kbq-size-s, 8px) var(--kbq-size-xxs, 4px);align-items:center;gap:var(--kbq-size-s, 8px)}.kbq-navbar-brand.kbq-horizontal:after{top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-xxs, 4px);bottom:var(--kbq-size-xxs, 4px);left:0}.kbq-navbar-brand.kbq-horizontal .kbq-navbar-title{padding-right:var(--kbq-size-m, 12px)}.kbq-navbar-brand.kbq-vertical .kbq-navbar-logo{align-items:center}.kbq-navbar-brand.kbq-vertical .kbq-navbar-title{display:block;align-items:center;padding-top:var(--kbq-size-xxs, 4px);padding-bottom:var(--kbq-size-xxs, 4px);height:var(--kbq-size-3xl, 32px);padding-left:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-brand.kbq-vertical.kbq-expanded{position:relative;height:var(--kbq-size-4xl, 40px);width:var(--kbq-size-4xl, 40px);margin:var(--kbq-size-l, 16px) var(--kbq-size-l, 16px) var(--kbq-size-4xl, 40px);flex-direction:column}.kbq-navbar-brand.kbq-vertical.kbq-expanded:after{inset:0}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-logo{min-height:var(--kbq-size-4xl, 40px);justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-title{position:absolute;left:var(--kbq-size-xxs, 4px);top:var(--kbq-size-4xl, 40px);max-width:200px}.kbq-navbar-brand.kbq-vertical.kbq-collapsed{height:var(--kbq-size-5xl, 48px);width:var(--kbq-size-5xl, 48px);justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-collapsed:after{top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-xxs, 4px);bottom:var(--kbq-size-xxs, 4px);left:var(--kbq-size-xxs, 4px)}.kbq-navbar-brand.kbq-vertical.kbq-collapsed .kbq-navbar-title{display:none}\n", ".kbq-navbar-divider{display:block}.kbq-navbar-divider.kbq-vertical{height:1px;margin:var(--kbq-size-s, 8px) var(--kbq-size-l, 16px)}.kbq-navbar-divider.kbq-horizontal{width:1px;height:12px;margin-left:var(--kbq-size-m, 12px);margin-right:var(--kbq-size-m, 12px)}\n"] }]
265
265
  }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.FocusMonitor }], propDecorators: { rectangleElements: [{
266
266
  type: ContentChildren,
267
267
  args: [forwardRef(() => KbqNavbarRectangleElement), { descendants: true }]
@@ -342,7 +342,7 @@ class KbqVerticalNavbar extends KbqFocusableComponent {
342
342
  <ng-content select="[kbq-navbar-container], kbq-navbar-container"></ng-content>
343
343
  <ng-content select="[kbq-navbar-toggle], kbq-navbar-toggle"></ng-content>
344
344
  </div>
345
- `, isInline: true, styles: [".kbq-vertical-navbar{position:relative;min-width:48px;height:100%}.kbq-vertical-navbar .kbq-navbar-container{flex-direction:column;align-items:unset}.kbq-vertical-navbar .kbq-navbar-container+.kbq-navbar-container{padding-top:24px}.kbq-vertical-navbar .kbq-vertical-navbar__container{display:flex;flex-direction:column;justify-content:space-between;position:absolute;z-index:998}.kbq-vertical-navbar .kbq-vertical-navbar__container.kbq-collapsed{width:48px}.kbq-vertical-navbar .kbq-vertical-navbar__container.kbq-expanded{width:240px}\n", ".kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-navbar-item.kbq-vertical{align-items:flex-start}.kbq-navbar-item.kbq-vertical .kbq-navbar-item__container{gap:12px}.kbq-navbar-item.kbq-vertical.kbq-expanded{height:48px;padding:16px 20px;gap:12px}.kbq-navbar-item.kbq-vertical.kbq-expanded:after{inset:4px 8px}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento{position:absolute;display:flex;justify-content:center;align-items:center;top:4px;right:4px;z-index:1;padding:8px;height:48px;width:48px}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento:after{inset:8px}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-item_has-nested{align-items:center;padding:0 12px}.kbq-navbar-item.kbq-vertical.kbq-collapsed{height:48px;width:48px;padding:16px;justify-content:center}.kbq-navbar-item.kbq-vertical.kbq-collapsed:after{inset:8px}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-badge{position:absolute;z-index:1;top:6px;right:6px}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-vertical>.kbq-icon{display:flex;justify-content:center;align-items:center}.kbq-navbar-item.kbq-horizontal{position:relative;flex-direction:row;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:48px;min-width:48px;padding:8px;justify-content:center}.kbq-navbar-item.kbq-horizontal:after{inset:8px}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__title{padding-left:4px;padding-right:4px}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__arrow-icon{padding-left:4px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed){padding:16px 12px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed):after{inset:8px 0}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed)>.kbq-icon{padding-right:4px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento{min-width:44px;justify-content:center;padding-right:4px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento:after{inset:8px 4px 8px 8px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed{justify-content:center;padding:8px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-horizontal .kbq-badge{position:absolute;z-index:1;top:6px;right:6px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_has-nested{padding:0 12px}.kbq-navbar-item{box-sizing:border-box;position:relative;display:flex;align-items:center;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-item .kbq-icon{min-width:16px;min-height:16px}.kbq-navbar-item:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-title{display:inline-block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-item__title{display:flex;flex-direction:column;align-self:center;min-width:0}.kbq-navbar-item__container{display:flex;flex-direction:row;flex:1 1 auto;justify-content:space-between;min-width:0}.kbq-navbar-item__container .kbq-icon{align-self:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button{flex:1}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper{justify-content:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_left{margin-left:unset}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_right{margin-right:unset}a.kbq-navbar-item,a.kbq-navbar-title{text-decoration:none}.kbq-navbar-item [kbq-button],.kbq-navbar-brand [kbq-button],.kbq-navbar-toggle [kbq-button]{z-index:1}\n", ".kbq-navbar-logo{display:flex}.kbq-navbar-brand{position:relative;display:flex;border-radius:8px}.kbq-navbar-brand:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-brand .kbq-navbar-title{cursor:pointer}a.kbq-navbar-brand{text-decoration:none}.kbq-navbar-brand.kbq-horizontal{padding:8px 6px 8px 4px;align-items:center;gap:8px}.kbq-navbar-brand.kbq-horizontal:after{inset:4px 4px 4px 0}.kbq-navbar-brand.kbq-horizontal .kbq-navbar-title{padding-right:12px}.kbq-navbar-brand.kbq-vertical .kbq-navbar-logo{align-items:center}.kbq-navbar-brand.kbq-vertical .kbq-navbar-title{display:block;align-items:center;padding-top:4px;padding-bottom:4px;height:32px;padding-left:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-brand.kbq-vertical.kbq-expanded{position:relative;height:40px;width:40px;margin:16px 16px 40px;flex-direction:column}.kbq-navbar-brand.kbq-vertical.kbq-expanded:after{inset:0}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-logo{min-height:40px;justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-title{position:absolute;left:4px;bottom:-40px;max-width:200px}.kbq-navbar-brand.kbq-vertical.kbq-collapsed{height:48px;width:48px;justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-collapsed:after{inset:4px}.kbq-navbar-brand.kbq-vertical.kbq-collapsed .kbq-navbar-title{display:none}\n", ".kbq-navbar-divider{display:block}.kbq-navbar-divider.kbq-vertical{height:1px;margin:8px 16px}.kbq-navbar-divider.kbq-horizontal{width:1px;height:12px;margin-left:12px;margin-right:12px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
345
+ `, isInline: true, styles: [".kbq-vertical-navbar{position:relative;min-width:48px;height:100%}.kbq-vertical-navbar .kbq-navbar-container{flex-direction:column;align-items:unset}.kbq-vertical-navbar .kbq-navbar-container+.kbq-navbar-container{padding-top:var(--kbq-size-xxl, 24px)}.kbq-vertical-navbar .kbq-vertical-navbar__container{display:flex;flex-direction:column;justify-content:space-between;position:absolute;z-index:998;height:100%}.kbq-vertical-navbar .kbq-vertical-navbar__container.kbq-collapsed{width:var(--kbq-size-5xl, 48px)}.kbq-vertical-navbar .kbq-vertical-navbar__container.kbq-expanded{width:240px}\n", ".kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-navbar-item.kbq-vertical{align-items:flex-start}.kbq-navbar-item.kbq-vertical .kbq-navbar-item__container{gap:var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-vertical.kbq-expanded{height:var(--kbq-size-5xl, 48px);align-items:center;padding-right:var(--kbq-size-xl, 20px);padding-left:var(--kbq-size-xl, 20px);gap:var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-vertical.kbq-expanded:after{top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-xxs, 4px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento{position:absolute;display:flex;justify-content:center;align-items:center;top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-xxs, 4px);z-index:1;padding:var(--kbq-size-s, 8px);height:var(--kbq-size-5xl, 48px);width:var(--kbq-size-5xl, 48px)}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-item_has-nested{align-items:center;padding:0 var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-vertical.kbq-collapsed{height:var(--kbq-size-5xl, 48px);width:var(--kbq-size-5xl, 48px);padding:var(--kbq-size-l, 16px);justify-content:center}.kbq-navbar-item.kbq-vertical.kbq-collapsed:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-badge{position:absolute;z-index:1;top:var(--kbq-size-xs, 6px);right:var(--kbq-size-xs, 6px)}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-vertical>.kbq-icon{display:flex;justify-content:center;align-items:center}.kbq-navbar-item.kbq-horizontal{position:relative;flex-direction:row;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:var(--kbq-size-5xl, 48px);min-width:var(--kbq-size-5xl, 48px);padding:var(--kbq-size-s, 8px);justify-content:center}.kbq-navbar-item.kbq-horizontal:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__title{padding-left:var(--kbq-size-xxs, 4px);padding-right:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__arrow-icon{padding-left:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed){padding-right:var(--kbq-size-m, 12px);padding-left:var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed):after{top:var(--kbq-size-s, 8px);right:0;bottom:var(--kbq-size-s, 8px);left:0}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed)>.kbq-icon{align-self:center;padding-right:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento{min-width:44px;justify-content:center;padding-right:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-xxs, 4px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed{justify-content:center;padding:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-horizontal .kbq-badge{position:absolute;z-index:1;top:var(--kbq-size-xs, 6px);right:var(--kbq-size-xs, 6px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_has-nested{padding:0 var(--kbq-size-m, 12px)}.kbq-navbar-item{box-sizing:border-box;position:relative;display:flex;align-items:center;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-item .kbq-icon{min-width:var(--kbq-size-l, 16px);min-height:var(--kbq-size-l, 16px)}.kbq-navbar-item .kbq-button-icon{position:absolute;top:50%;transform:translateY(-50%)}.kbq-navbar-item:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-title{display:inline-block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-item__title{display:flex;flex-direction:column;align-self:center;min-width:0}.kbq-navbar-item__container{display:flex;flex-direction:row;flex:1 1 auto;justify-content:space-between;min-width:0}.kbq-navbar-item__container .kbq-icon{align-self:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button{flex:1}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper{justify-content:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_left{margin-left:unset}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_right{margin-right:unset}a.kbq-navbar-item,a.kbq-navbar-title{text-decoration:none}.kbq-navbar-item [kbq-button],.kbq-navbar-brand [kbq-button],.kbq-navbar-toggle [kbq-button]{z-index:1}\n", ".kbq-navbar-logo{display:flex}.kbq-navbar-brand{position:relative;display:flex;border-radius:var(--kbq-size-s, 8px)}.kbq-navbar-brand:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-brand .kbq-navbar-title{cursor:pointer}a.kbq-navbar-brand{text-decoration:none}.kbq-navbar-brand.kbq-horizontal{padding:var(--kbq-size-s, 8px) var(--kbq-size-xs, 6px) var(--kbq-size-s, 8px) var(--kbq-size-xxs, 4px);align-items:center;gap:var(--kbq-size-s, 8px)}.kbq-navbar-brand.kbq-horizontal:after{top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-xxs, 4px);bottom:var(--kbq-size-xxs, 4px);left:0}.kbq-navbar-brand.kbq-horizontal .kbq-navbar-title{padding-right:var(--kbq-size-m, 12px)}.kbq-navbar-brand.kbq-vertical .kbq-navbar-logo{align-items:center}.kbq-navbar-brand.kbq-vertical .kbq-navbar-title{display:block;align-items:center;padding-top:var(--kbq-size-xxs, 4px);padding-bottom:var(--kbq-size-xxs, 4px);height:var(--kbq-size-3xl, 32px);padding-left:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-brand.kbq-vertical.kbq-expanded{position:relative;height:var(--kbq-size-4xl, 40px);width:var(--kbq-size-4xl, 40px);margin:var(--kbq-size-l, 16px) var(--kbq-size-l, 16px) var(--kbq-size-4xl, 40px);flex-direction:column}.kbq-navbar-brand.kbq-vertical.kbq-expanded:after{inset:0}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-logo{min-height:var(--kbq-size-4xl, 40px);justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-title{position:absolute;left:var(--kbq-size-xxs, 4px);top:var(--kbq-size-4xl, 40px);max-width:200px}.kbq-navbar-brand.kbq-vertical.kbq-collapsed{height:var(--kbq-size-5xl, 48px);width:var(--kbq-size-5xl, 48px);justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-collapsed:after{top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-xxs, 4px);bottom:var(--kbq-size-xxs, 4px);left:var(--kbq-size-xxs, 4px)}.kbq-navbar-brand.kbq-vertical.kbq-collapsed .kbq-navbar-title{display:none}\n", ".kbq-navbar-divider{display:block}.kbq-navbar-divider.kbq-vertical{height:1px;margin:var(--kbq-size-s, 8px) var(--kbq-size-l, 16px)}.kbq-navbar-divider.kbq-horizontal{width:1px;height:12px;margin-left:var(--kbq-size-m, 12px);margin-right:var(--kbq-size-m, 12px)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
346
346
  }
347
347
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqVerticalNavbar, decorators: [{
348
348
  type: Component,
@@ -360,7 +360,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
360
360
  '(focus)': 'focus()',
361
361
  '(blur)': 'blur()',
362
362
  '(keydown)': 'onKeyDown($event)'
363
- }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".kbq-vertical-navbar{position:relative;min-width:48px;height:100%}.kbq-vertical-navbar .kbq-navbar-container{flex-direction:column;align-items:unset}.kbq-vertical-navbar .kbq-navbar-container+.kbq-navbar-container{padding-top:24px}.kbq-vertical-navbar .kbq-vertical-navbar__container{display:flex;flex-direction:column;justify-content:space-between;position:absolute;z-index:998}.kbq-vertical-navbar .kbq-vertical-navbar__container.kbq-collapsed{width:48px}.kbq-vertical-navbar .kbq-vertical-navbar__container.kbq-expanded{width:240px}\n", ".kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-navbar-item.kbq-vertical{align-items:flex-start}.kbq-navbar-item.kbq-vertical .kbq-navbar-item__container{gap:12px}.kbq-navbar-item.kbq-vertical.kbq-expanded{height:48px;padding:16px 20px;gap:12px}.kbq-navbar-item.kbq-vertical.kbq-expanded:after{inset:4px 8px}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento{position:absolute;display:flex;justify-content:center;align-items:center;top:4px;right:4px;z-index:1;padding:8px;height:48px;width:48px}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento:after{inset:8px}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-item_has-nested{align-items:center;padding:0 12px}.kbq-navbar-item.kbq-vertical.kbq-collapsed{height:48px;width:48px;padding:16px;justify-content:center}.kbq-navbar-item.kbq-vertical.kbq-collapsed:after{inset:8px}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-badge{position:absolute;z-index:1;top:6px;right:6px}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-vertical>.kbq-icon{display:flex;justify-content:center;align-items:center}.kbq-navbar-item.kbq-horizontal{position:relative;flex-direction:row;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:48px;min-width:48px;padding:8px;justify-content:center}.kbq-navbar-item.kbq-horizontal:after{inset:8px}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__title{padding-left:4px;padding-right:4px}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__arrow-icon{padding-left:4px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed){padding:16px 12px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed):after{inset:8px 0}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed)>.kbq-icon{padding-right:4px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento{min-width:44px;justify-content:center;padding-right:4px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento:after{inset:8px 4px 8px 8px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed{justify-content:center;padding:8px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-horizontal .kbq-badge{position:absolute;z-index:1;top:6px;right:6px}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_has-nested{padding:0 12px}.kbq-navbar-item{box-sizing:border-box;position:relative;display:flex;align-items:center;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-item .kbq-icon{min-width:16px;min-height:16px}.kbq-navbar-item:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-title{display:inline-block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-item__title{display:flex;flex-direction:column;align-self:center;min-width:0}.kbq-navbar-item__container{display:flex;flex-direction:row;flex:1 1 auto;justify-content:space-between;min-width:0}.kbq-navbar-item__container .kbq-icon{align-self:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button{flex:1}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper{justify-content:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_left{margin-left:unset}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_right{margin-right:unset}a.kbq-navbar-item,a.kbq-navbar-title{text-decoration:none}.kbq-navbar-item [kbq-button],.kbq-navbar-brand [kbq-button],.kbq-navbar-toggle [kbq-button]{z-index:1}\n", ".kbq-navbar-logo{display:flex}.kbq-navbar-brand{position:relative;display:flex;border-radius:8px}.kbq-navbar-brand:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-brand .kbq-navbar-title{cursor:pointer}a.kbq-navbar-brand{text-decoration:none}.kbq-navbar-brand.kbq-horizontal{padding:8px 6px 8px 4px;align-items:center;gap:8px}.kbq-navbar-brand.kbq-horizontal:after{inset:4px 4px 4px 0}.kbq-navbar-brand.kbq-horizontal .kbq-navbar-title{padding-right:12px}.kbq-navbar-brand.kbq-vertical .kbq-navbar-logo{align-items:center}.kbq-navbar-brand.kbq-vertical .kbq-navbar-title{display:block;align-items:center;padding-top:4px;padding-bottom:4px;height:32px;padding-left:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-brand.kbq-vertical.kbq-expanded{position:relative;height:40px;width:40px;margin:16px 16px 40px;flex-direction:column}.kbq-navbar-brand.kbq-vertical.kbq-expanded:after{inset:0}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-logo{min-height:40px;justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-title{position:absolute;left:4px;bottom:-40px;max-width:200px}.kbq-navbar-brand.kbq-vertical.kbq-collapsed{height:48px;width:48px;justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-collapsed:after{inset:4px}.kbq-navbar-brand.kbq-vertical.kbq-collapsed .kbq-navbar-title{display:none}\n", ".kbq-navbar-divider{display:block}.kbq-navbar-divider.kbq-vertical{height:1px;margin:8px 16px}.kbq-navbar-divider.kbq-horizontal{width:1px;height:12px;margin-left:12px;margin-right:12px}\n"] }]
363
+ }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".kbq-vertical-navbar{position:relative;min-width:48px;height:100%}.kbq-vertical-navbar .kbq-navbar-container{flex-direction:column;align-items:unset}.kbq-vertical-navbar .kbq-navbar-container+.kbq-navbar-container{padding-top:var(--kbq-size-xxl, 24px)}.kbq-vertical-navbar .kbq-vertical-navbar__container{display:flex;flex-direction:column;justify-content:space-between;position:absolute;z-index:998;height:100%}.kbq-vertical-navbar .kbq-vertical-navbar__container.kbq-collapsed{width:var(--kbq-size-5xl, 48px)}.kbq-vertical-navbar .kbq-vertical-navbar__container.kbq-expanded{width:240px}\n", ".kbq-no-select{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-navbar-item.kbq-vertical{align-items:flex-start}.kbq-navbar-item.kbq-vertical .kbq-navbar-item__container{gap:var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-vertical.kbq-expanded{height:var(--kbq-size-5xl, 48px);align-items:center;padding-right:var(--kbq-size-xl, 20px);padding-left:var(--kbq-size-xl, 20px);gap:var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-vertical.kbq-expanded:after{top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-xxs, 4px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento{position:absolute;display:flex;justify-content:center;align-items:center;top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-xxs, 4px);z-index:1;padding:var(--kbq-size-s, 8px);height:var(--kbq-size-5xl, 48px);width:var(--kbq-size-5xl, 48px)}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-bento:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-vertical.kbq-expanded.kbq-navbar-item_has-nested{align-items:center;padding:0 var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-vertical.kbq-collapsed{height:var(--kbq-size-5xl, 48px);width:var(--kbq-size-5xl, 48px);padding:var(--kbq-size-l, 16px);justify-content:center}.kbq-navbar-item.kbq-vertical.kbq-collapsed:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-badge{position:absolute;z-index:1;top:var(--kbq-size-xs, 6px);right:var(--kbq-size-xs, 6px)}.kbq-navbar-item.kbq-vertical.kbq-collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-vertical>.kbq-icon{display:flex;justify-content:center;align-items:center}.kbq-navbar-item.kbq-horizontal{position:relative;flex-direction:row;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:var(--kbq-size-5xl, 48px);min-width:var(--kbq-size-5xl, 48px);padding:var(--kbq-size-s, 8px);justify-content:center}.kbq-navbar-item.kbq-horizontal:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-s, 8px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__title{padding-left:var(--kbq-size-xxs, 4px);padding-right:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal .kbq-navbar-item__arrow-icon{padding-left:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed){padding-right:var(--kbq-size-m, 12px);padding-left:var(--kbq-size-m, 12px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed):after{top:var(--kbq-size-s, 8px);right:0;bottom:var(--kbq-size-s, 8px);left:0}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_with-title:not(.kbq-navbar-item_collapsed)>.kbq-icon{align-self:center;padding-right:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento{min-width:44px;justify-content:center;padding-right:var(--kbq-size-xxs, 4px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-bento:after{top:var(--kbq-size-s, 8px);right:var(--kbq-size-xxs, 4px);bottom:var(--kbq-size-s, 8px);left:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed{justify-content:center;padding:var(--kbq-size-s, 8px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_collapsed .kbq-navbar-item__container{display:none}.kbq-navbar-item.kbq-horizontal .kbq-badge{position:absolute;z-index:1;top:var(--kbq-size-xs, 6px);right:var(--kbq-size-xs, 6px)}.kbq-navbar-item.kbq-horizontal.kbq-navbar-item_has-nested{padding:0 var(--kbq-size-m, 12px)}.kbq-navbar-item{box-sizing:border-box;position:relative;display:flex;align-items:center;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-item .kbq-icon{min-width:var(--kbq-size-l, 16px);min-height:var(--kbq-size-l, 16px)}.kbq-navbar-item .kbq-button-icon{position:absolute;top:50%;transform:translateY(-50%)}.kbq-navbar-item:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-title{display:inline-block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-item__title{display:flex;flex-direction:column;align-self:center;min-width:0}.kbq-navbar-item__container{display:flex;flex-direction:row;flex:1 1 auto;justify-content:space-between;min-width:0}.kbq-navbar-item__container .kbq-icon{align-self:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button{flex:1}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper{justify-content:center}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_left{margin-left:unset}.kbq-navbar-item.kbq-navbar-item_has-nested .kbq-button .kbq-button-wrapper .kbq-icon.kbq-icon_right{margin-right:unset}a.kbq-navbar-item,a.kbq-navbar-title{text-decoration:none}.kbq-navbar-item [kbq-button],.kbq-navbar-brand [kbq-button],.kbq-navbar-toggle [kbq-button]{z-index:1}\n", ".kbq-navbar-logo{display:flex}.kbq-navbar-brand{position:relative;display:flex;border-radius:var(--kbq-size-s, 8px)}.kbq-navbar-brand:after{position:absolute;content:\"\";display:none;border-radius:var(--kbq-navbar-item-size-content-border-radius, 8px)}.kbq-navbar-brand .kbq-navbar-title{cursor:pointer}a.kbq-navbar-brand{text-decoration:none}.kbq-navbar-brand.kbq-horizontal{padding:var(--kbq-size-s, 8px) var(--kbq-size-xs, 6px) var(--kbq-size-s, 8px) var(--kbq-size-xxs, 4px);align-items:center;gap:var(--kbq-size-s, 8px)}.kbq-navbar-brand.kbq-horizontal:after{top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-xxs, 4px);bottom:var(--kbq-size-xxs, 4px);left:0}.kbq-navbar-brand.kbq-horizontal .kbq-navbar-title{padding-right:var(--kbq-size-m, 12px)}.kbq-navbar-brand.kbq-vertical .kbq-navbar-logo{align-items:center}.kbq-navbar-brand.kbq-vertical .kbq-navbar-title{display:block;align-items:center;padding-top:var(--kbq-size-xxs, 4px);padding-bottom:var(--kbq-size-xxs, 4px);height:var(--kbq-size-3xl, 32px);padding-left:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kbq-navbar-brand.kbq-vertical.kbq-expanded{position:relative;height:var(--kbq-size-4xl, 40px);width:var(--kbq-size-4xl, 40px);margin:var(--kbq-size-l, 16px) var(--kbq-size-l, 16px) var(--kbq-size-4xl, 40px);flex-direction:column}.kbq-navbar-brand.kbq-vertical.kbq-expanded:after{inset:0}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-logo{min-height:var(--kbq-size-4xl, 40px);justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-expanded .kbq-navbar-title{position:absolute;left:var(--kbq-size-xxs, 4px);top:var(--kbq-size-4xl, 40px);max-width:200px}.kbq-navbar-brand.kbq-vertical.kbq-collapsed{height:var(--kbq-size-5xl, 48px);width:var(--kbq-size-5xl, 48px);justify-content:center}.kbq-navbar-brand.kbq-vertical.kbq-collapsed:after{top:var(--kbq-size-xxs, 4px);right:var(--kbq-size-xxs, 4px);bottom:var(--kbq-size-xxs, 4px);left:var(--kbq-size-xxs, 4px)}.kbq-navbar-brand.kbq-vertical.kbq-collapsed .kbq-navbar-title{display:none}\n", ".kbq-navbar-divider{display:block}.kbq-navbar-divider.kbq-vertical{height:1px;margin:var(--kbq-size-s, 8px) var(--kbq-size-l, 16px)}.kbq-navbar-divider.kbq-horizontal{width:1px;height:12px;margin-left:var(--kbq-size-m, 12px);margin-right:var(--kbq-size-m, 12px)}\n"] }]
364
364
  }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.FocusMonitor }], propDecorators: { rectangleElements: [{
365
365
  type: ContentChildren,
366
366
  args: [forwardRef(() => KbqNavbarRectangleElement), { descendants: true }]
@@ -721,8 +721,8 @@ class KbqNavbarItem extends KbqTooltipTrigger {
721
721
  get hasCroppedText() {
722
722
  return !!(this.title?.isOverflown);
723
723
  }
724
- constructor(rectangleElement, navbarFocusableItem, changeDetectorRef, overlay, elementRef, ngZone, scrollDispatcher, hostView, scrollStrategy, direction, dropdownTrigger, bento) {
725
- super(overlay, elementRef, ngZone, scrollDispatcher, hostView, scrollStrategy, direction);
724
+ constructor(rectangleElement, navbarFocusableItem, changeDetectorRef, overlay, elementRef, ngZone, scrollDispatcher, hostView, scrollStrategy, focusMonitor, direction, dropdownTrigger, bento) {
725
+ super(overlay, elementRef, ngZone, scrollDispatcher, hostView, scrollStrategy, direction, focusMonitor);
726
726
  this.rectangleElement = rectangleElement;
727
727
  this.navbarFocusableItem = navbarFocusableItem;
728
728
  this.changeDetectorRef = changeDetectorRef;
@@ -778,7 +778,7 @@ class KbqNavbarItem extends KbqTooltipTrigger {
778
778
  this.changeDetectorRef.markForCheck();
779
779
  });
780
780
  }
781
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqNavbarItem, deps: [{ token: KbqNavbarRectangleElement }, { token: KbqNavbarFocusableItem }, { token: i0.ChangeDetectorRef }, { token: i3.Overlay }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i3.ScrollDispatcher }, { token: i0.ViewContainerRef }, { token: KBQ_TOOLTIP_SCROLL_STRATEGY }, { token: i4.Directionality, optional: true }, { token: i5.KbqDropdownTrigger, optional: true }, { token: KbqNavbarBento, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
781
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqNavbarItem, deps: [{ token: KbqNavbarRectangleElement }, { token: KbqNavbarFocusableItem }, { token: i0.ChangeDetectorRef }, { token: i3.Overlay }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i3.ScrollDispatcher }, { token: i0.ViewContainerRef }, { token: KBQ_TOOLTIP_SCROLL_STRATEGY }, { token: i1.FocusMonitor }, { token: i4.Directionality, optional: true }, { token: i5.KbqDropdownTrigger, optional: true }, { token: KbqNavbarBento, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
782
782
  /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqNavbarItem, selector: "kbq-navbar-item, [kbq-navbar-item]", inputs: { collapsedText: "collapsedText", trigger: ["kbqTrigger", "trigger"], collapsable: "collapsable" }, host: { listeners: { "keydown": "onKeyDown($event)" }, properties: { "class.kbq-navbar-item_collapsed": "isCollapsed", "class.kbq-navbar-item_with-title": "!!title" }, classAttribute: "kbq-navbar-item" }, queries: [{ propertyName: "title", first: true, predicate: KbqNavbarTitle, descendants: true }, { propertyName: "icon", first: true, predicate: KbqIcon, descendants: true }], exportAs: ["kbqNavbarItem"], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"[kbq-icon]\"></ng-content>\n\n<div class=\"kbq-navbar-item__container\" *ngIf=\"title\">\n <div class=\"kbq-navbar-item__title\">\n <ng-content select=\"kbq-navbar-title, [kbq-navbar-title]\"></ng-content>\n </div>\n\n <i class=\"kbq-navbar-item__arrow-icon\" kbq-icon=\"mc-angle-right-M_16\" *ngIf=\"showVerticalDropDownAngle\"></i>\n <i class=\"kbq-navbar-item__arrow-icon\" kbq-icon=\"mc-angle-down-S_16\" *ngIf=\"showHorizontalDropDownAngle\"></i>\n\n</div>\n\n<ng-content></ng-content>\n", dependencies: [{ kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i7.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
783
783
  }
784
784
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqNavbarItem, decorators: [{
@@ -792,7 +792,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
792
792
  }], ctorParameters: () => [{ type: KbqNavbarRectangleElement }, { type: KbqNavbarFocusableItem }, { type: i0.ChangeDetectorRef }, { type: i3.Overlay }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: i3.ScrollDispatcher }, { type: i0.ViewContainerRef }, { type: undefined, decorators: [{
793
793
  type: Inject,
794
794
  args: [KBQ_TOOLTIP_SCROLL_STRATEGY]
795
- }] }, { type: i4.Directionality, decorators: [{
795
+ }] }, { type: i1.FocusMonitor }, { type: i4.Directionality, decorators: [{
796
796
  type: Optional
797
797
  }] }, { type: i5.KbqDropdownTrigger, decorators: [{
798
798
  type: Optional
@@ -823,8 +823,8 @@ class KbqNavbarToggle extends KbqTooltipTrigger {
823
823
  get disabled() {
824
824
  return this.navbar.expanded;
825
825
  }
826
- constructor(navbar, changeDetectorRef, overlay, elementRef, ngZone, scrollDispatcher, hostView, scrollStrategy, direction, document) {
827
- super(overlay, elementRef, ngZone, scrollDispatcher, hostView, scrollStrategy, direction);
826
+ constructor(navbar, changeDetectorRef, overlay, elementRef, ngZone, scrollDispatcher, hostView, scrollStrategy, focusMonitor, direction, document) {
827
+ super(overlay, elementRef, ngZone, scrollDispatcher, hostView, scrollStrategy, direction, focusMonitor);
828
828
  this.navbar = navbar;
829
829
  this.changeDetectorRef = changeDetectorRef;
830
830
  this.document = document;
@@ -864,7 +864,7 @@ class KbqNavbarToggle extends KbqTooltipTrigger {
864
864
  getWindow() {
865
865
  return this.document?.defaultView || window;
866
866
  }
867
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqNavbarToggle, deps: [{ token: KbqVerticalNavbar }, { token: i0.ChangeDetectorRef }, { token: i3.Overlay }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i3.ScrollDispatcher }, { token: i0.ViewContainerRef }, { token: KBQ_TOOLTIP_SCROLL_STRATEGY }, { token: i4.Directionality, optional: true }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
867
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqNavbarToggle, deps: [{ token: KbqVerticalNavbar }, { token: i0.ChangeDetectorRef }, { token: i3.Overlay }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i3.ScrollDispatcher }, { token: i0.ViewContainerRef }, { token: KBQ_TOOLTIP_SCROLL_STRATEGY }, { token: i1.FocusMonitor }, { token: i4.Directionality, optional: true }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
868
868
  /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqNavbarToggle, selector: "kbq-navbar-toggle", inputs: { content: ["kbqCollapsedTooltip", "content"] }, host: { listeners: { "keydown": "onKeydown($event)", "click": "toggle()", "touchend": "handleTouchend()" }, properties: { "class.kbq-tooltip_open": "isOpen", "class.kbq-collapsed": "!navbar.expanded", "class.kbq-expanded": "navbar.expanded" }, classAttribute: "kbq-navbar-item kbq-navbar-toggle kbq-vertical" }, queries: [{ propertyName: "customIcon", first: true, predicate: KbqIcon, descendants: true }], usesInheritance: true, ngImport: i0, template: `
869
869
  <i kbq-icon
870
870
  [class.mc-angle-left-M_16]="navbar.expanded"
@@ -877,7 +877,7 @@ class KbqNavbarToggle extends KbqTooltipTrigger {
877
877
  <div class="kbq-navbar-item__title" *ngIf="navbar.expanded">
878
878
  <ng-content select="kbq-navbar-title"></ng-content>
879
879
  </div>
880
- `, isInline: true, styles: [".kbq-navbar{display:flex;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar-container{display:flex;flex-shrink:0;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar .kbq-navbar-container+.kbq-navbar-container{margin-left:24px}\n"], dependencies: [{ kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i7.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
880
+ `, isInline: true, styles: [".kbq-navbar{display:flex;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar-container{display:flex;flex-shrink:0;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar .kbq-navbar-container+.kbq-navbar-container{margin-left:var(--kbq-size-xxl, 24px)}\n"], dependencies: [{ kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i7.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
881
881
  }
882
882
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqNavbarToggle, decorators: [{
883
883
  type: Component,
@@ -901,11 +901,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
901
901
  '(keydown)': 'onKeydown($event)',
902
902
  '(click)': 'toggle()',
903
903
  '(touchend)': 'handleTouchend()'
904
- }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".kbq-navbar{display:flex;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar-container{display:flex;flex-shrink:0;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar .kbq-navbar-container+.kbq-navbar-container{margin-left:24px}\n"] }]
904
+ }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".kbq-navbar{display:flex;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar-container{display:flex;flex-shrink:0;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.kbq-navbar .kbq-navbar-container+.kbq-navbar-container{margin-left:var(--kbq-size-xxl, 24px)}\n"] }]
905
905
  }], ctorParameters: () => [{ type: KbqVerticalNavbar }, { type: i0.ChangeDetectorRef }, { type: i3.Overlay }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: i3.ScrollDispatcher }, { type: i0.ViewContainerRef }, { type: undefined, decorators: [{
906
906
  type: Inject,
907
907
  args: [KBQ_TOOLTIP_SCROLL_STRATEGY]
908
- }] }, { type: i4.Directionality, decorators: [{
908
+ }] }, { type: i1.FocusMonitor }, { type: i4.Directionality, decorators: [{
909
909
  type: Optional
910
910
  }] }, { type: undefined, decorators: [{
911
911
  type: Optional