@koobiq/components 20.1.0 → 20.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (249) hide show
  1. package/accordion/_accordion-theme.scss +6 -2
  2. package/accordion/accordion-tokens.scss +3 -0
  3. package/accordion/{accordion-trigger.component.scss → accordion-trigger.scss} +10 -0
  4. package/accordion/accordion.scss +71 -0
  5. package/accordion/index.d.ts +264 -121
  6. package/actions-panel/index.d.ts +25 -13
  7. package/alert/_alert-theme.scss +14 -0
  8. package/alert/alert.component.scss +24 -13
  9. package/alert/index.d.ts +63 -29
  10. package/app-switcher/app-switcher-dropdown-app.scss +7 -5
  11. package/app-switcher/app-switcher-dropdown-site.scss +6 -4
  12. package/app-switcher/index.d.ts +41 -4
  13. package/app-switcher/kbq-app-switcher-list-item.scss +6 -8
  14. package/autocomplete/autocomplete.scss +2 -1
  15. package/autocomplete/index.d.ts +58 -37
  16. package/badge/index.d.ts +2 -3
  17. package/breadcrumbs/index.d.ts +1 -1
  18. package/button/index.d.ts +2 -2
  19. package/button-toggle/button-toggle-tokens.scss +2 -0
  20. package/button-toggle/button-toggle.scss +9 -0
  21. package/button-toggle/index.d.ts +5 -0
  22. package/checkbox/index.d.ts +33 -29
  23. package/clamped-text/index.d.ts +3 -2
  24. package/code-block/index.d.ts +24 -19
  25. package/content-panel/index.d.ts +1 -1
  26. package/core/index.d.ts +1217 -186
  27. package/core/option/_action-container-mixins.scss +28 -0
  28. package/core/option/_option-theme.scss +24 -0
  29. package/core/option/action.scss +7 -0
  30. package/core/styles/_core.scss +2 -0
  31. package/core/styles/_koobiq-theme.scss +2 -0
  32. package/core/styles/_tokens.scss +1 -0
  33. package/core/styles/common/_animation.scss +31 -24
  34. package/core/styles/common/_connected-overlay.scss +39 -0
  35. package/core/styles/common/_select.scss +19 -2
  36. package/core/styles/common/_tokens.scss +0 -9
  37. package/core/styles/theming/_index.scss +0 -1
  38. package/core/styles/theming/_theming.scss +34 -5
  39. package/datepicker/index.d.ts +46 -15
  40. package/dl/dl.scss +26 -0
  41. package/dl/index.d.ts +8 -1
  42. package/dropdown/_dropdown-theme.scss +28 -2
  43. package/dropdown/dropdown-item.scss +29 -0
  44. package/dropdown/dropdown-tokens.scss +2 -1
  45. package/dropdown/dropdown.scss +16 -1
  46. package/dropdown/index.d.ts +331 -17
  47. package/dynamic-translation/index.d.ts +1 -1
  48. package/fesm2022/koobiq-components-accordion.mjs +480 -317
  49. package/fesm2022/koobiq-components-accordion.mjs.map +1 -1
  50. package/fesm2022/koobiq-components-actions-panel.mjs +57 -46
  51. package/fesm2022/koobiq-components-actions-panel.mjs.map +1 -1
  52. package/fesm2022/koobiq-components-alert.mjs +98 -58
  53. package/fesm2022/koobiq-components-alert.mjs.map +1 -1
  54. package/fesm2022/koobiq-components-app-switcher.mjs +233 -38
  55. package/fesm2022/koobiq-components-app-switcher.mjs.map +1 -1
  56. package/fesm2022/koobiq-components-autocomplete.mjs +89 -52
  57. package/fesm2022/koobiq-components-autocomplete.mjs.map +1 -1
  58. package/fesm2022/koobiq-components-badge.mjs +18 -17
  59. package/fesm2022/koobiq-components-badge.mjs.map +1 -1
  60. package/fesm2022/koobiq-components-breadcrumbs.mjs +25 -25
  61. package/fesm2022/koobiq-components-breadcrumbs.mjs.map +1 -1
  62. package/fesm2022/koobiq-components-button-toggle.mjs +17 -12
  63. package/fesm2022/koobiq-components-button-toggle.mjs.map +1 -1
  64. package/fesm2022/koobiq-components-button.mjs +25 -25
  65. package/fesm2022/koobiq-components-checkbox.mjs +69 -92
  66. package/fesm2022/koobiq-components-checkbox.mjs.map +1 -1
  67. package/fesm2022/koobiq-components-clamped-text.mjs +18 -13
  68. package/fesm2022/koobiq-components-clamped-text.mjs.map +1 -1
  69. package/fesm2022/koobiq-components-code-block.mjs +56 -69
  70. package/fesm2022/koobiq-components-code-block.mjs.map +1 -1
  71. package/fesm2022/koobiq-components-content-panel.mjs +29 -29
  72. package/fesm2022/koobiq-components-core.mjs +2485 -735
  73. package/fesm2022/koobiq-components-core.mjs.map +1 -1
  74. package/fesm2022/koobiq-components-datepicker.mjs +168 -126
  75. package/fesm2022/koobiq-components-datepicker.mjs.map +1 -1
  76. package/fesm2022/koobiq-components-divider.mjs +7 -7
  77. package/fesm2022/koobiq-components-dl.mjs +23 -15
  78. package/fesm2022/koobiq-components-dl.mjs.map +1 -1
  79. package/fesm2022/koobiq-components-dropdown.mjs +814 -136
  80. package/fesm2022/koobiq-components-dropdown.mjs.map +1 -1
  81. package/fesm2022/koobiq-components-dynamic-translation.mjs +13 -13
  82. package/fesm2022/koobiq-components-ellipsis-center.mjs +7 -7
  83. package/fesm2022/koobiq-components-empty-state.mjs +19 -19
  84. package/fesm2022/koobiq-components-file-upload.mjs +74 -42
  85. package/fesm2022/koobiq-components-file-upload.mjs.map +1 -1
  86. package/fesm2022/koobiq-components-filter-bar.mjs +783 -199
  87. package/fesm2022/koobiq-components-filter-bar.mjs.map +1 -1
  88. package/fesm2022/koobiq-components-flag.mjs +7 -7
  89. package/fesm2022/koobiq-components-form-field.mjs +350 -162
  90. package/fesm2022/koobiq-components-form-field.mjs.map +1 -1
  91. package/fesm2022/koobiq-components-icon.mjs +52 -25
  92. package/fesm2022/koobiq-components-icon.mjs.map +1 -1
  93. package/fesm2022/koobiq-components-inline-edit.mjs +175 -28
  94. package/fesm2022/koobiq-components-inline-edit.mjs.map +1 -1
  95. package/fesm2022/koobiq-components-input.mjs +41 -24
  96. package/fesm2022/koobiq-components-input.mjs.map +1 -1
  97. package/fesm2022/koobiq-components-link.mjs +8 -8
  98. package/fesm2022/koobiq-components-list.mjs +657 -143
  99. package/fesm2022/koobiq-components-list.mjs.map +1 -1
  100. package/fesm2022/koobiq-components-loader-overlay.mjs +16 -16
  101. package/fesm2022/koobiq-components-markdown.mjs +14 -11
  102. package/fesm2022/koobiq-components-markdown.mjs.map +1 -1
  103. package/fesm2022/koobiq-components-modal.mjs +59 -35
  104. package/fesm2022/koobiq-components-modal.mjs.map +1 -1
  105. package/fesm2022/koobiq-components-navbar.mjs +177 -67
  106. package/fesm2022/koobiq-components-navbar.mjs.map +1 -1
  107. package/fesm2022/koobiq-components-notification-center.mjs +40 -24
  108. package/fesm2022/koobiq-components-notification-center.mjs.map +1 -1
  109. package/fesm2022/koobiq-components-overflow-items.mjs +16 -17
  110. package/fesm2022/koobiq-components-overflow-items.mjs.map +1 -1
  111. package/fesm2022/koobiq-components-popover.mjs +31 -21
  112. package/fesm2022/koobiq-components-popover.mjs.map +1 -1
  113. package/fesm2022/koobiq-components-progress-bar.mjs +13 -13
  114. package/fesm2022/koobiq-components-progress-spinner.mjs +13 -13
  115. package/fesm2022/koobiq-components-radio.mjs +10 -10
  116. package/fesm2022/koobiq-components-resizer.mjs +33 -14
  117. package/fesm2022/koobiq-components-resizer.mjs.map +1 -1
  118. package/fesm2022/koobiq-components-scrollbar.mjs +10 -10
  119. package/fesm2022/koobiq-components-search-expandable.mjs +49 -14
  120. package/fesm2022/koobiq-components-search-expandable.mjs.map +1 -1
  121. package/fesm2022/koobiq-components-select.mjs +450 -146
  122. package/fesm2022/koobiq-components-select.mjs.map +1 -1
  123. package/fesm2022/koobiq-components-sidebar.mjs +14 -14
  124. package/fesm2022/koobiq-components-sidepanel.mjs +26 -26
  125. package/fesm2022/koobiq-components-skeleton.mjs +10 -10
  126. package/fesm2022/koobiq-components-split-button.mjs +10 -17
  127. package/fesm2022/koobiq-components-split-button.mjs.map +1 -1
  128. package/fesm2022/koobiq-components-splitter.mjs +17 -17
  129. package/fesm2022/koobiq-components-table.mjs +15 -13
  130. package/fesm2022/koobiq-components-table.mjs.map +1 -1
  131. package/fesm2022/koobiq-components-tabs.mjs +80 -68
  132. package/fesm2022/koobiq-components-tabs.mjs.map +1 -1
  133. package/fesm2022/koobiq-components-tags.mjs +283 -122
  134. package/fesm2022/koobiq-components-tags.mjs.map +1 -1
  135. package/fesm2022/koobiq-components-textarea.mjs +13 -8
  136. package/fesm2022/koobiq-components-textarea.mjs.map +1 -1
  137. package/fesm2022/koobiq-components-time-range.mjs +29 -24
  138. package/fesm2022/koobiq-components-time-range.mjs.map +1 -1
  139. package/fesm2022/koobiq-components-timepicker.mjs +61 -30
  140. package/fesm2022/koobiq-components-timepicker.mjs.map +1 -1
  141. package/fesm2022/koobiq-components-timezone.mjs +77 -42
  142. package/fesm2022/koobiq-components-timezone.mjs.map +1 -1
  143. package/fesm2022/koobiq-components-title.mjs +7 -7
  144. package/fesm2022/koobiq-components-toast.mjs +51 -26
  145. package/fesm2022/koobiq-components-toast.mjs.map +1 -1
  146. package/fesm2022/koobiq-components-toggle.mjs +72 -64
  147. package/fesm2022/koobiq-components-toggle.mjs.map +1 -1
  148. package/fesm2022/koobiq-components-tooltip.mjs +219 -28
  149. package/fesm2022/koobiq-components-tooltip.mjs.map +1 -1
  150. package/fesm2022/koobiq-components-top-bar.mjs +13 -13
  151. package/fesm2022/koobiq-components-tree-select.mjs +222 -80
  152. package/fesm2022/koobiq-components-tree-select.mjs.map +1 -1
  153. package/fesm2022/koobiq-components-tree.mjs +302 -81
  154. package/fesm2022/koobiq-components-tree.mjs.map +1 -1
  155. package/fesm2022/koobiq-components-username.mjs +27 -27
  156. package/file-upload/index.d.ts +25 -6
  157. package/file-upload/multiple-file-upload.component.scss +14 -0
  158. package/filter-bar/_filter-bar-theme.scss +0 -10
  159. package/filter-bar/filter-bar-tokens.scss +3 -0
  160. package/filter-bar/filters.scss +3 -2
  161. package/filter-bar/index.d.ts +281 -9
  162. package/filter-bar/pipes/base-pipe.scss +0 -11
  163. package/filter-bar/pipes/pipe-input.scss +10 -0
  164. package/filter-bar/pipes/pipe-multi-tree-select.scss +0 -6
  165. package/filter-bar/pipes/pipe-multiselect.scss +0 -6
  166. package/filter-bar/pipes/pipe-tree-select.scss +0 -6
  167. package/form-field/_form-field-theme.scss +76 -20
  168. package/form-field/fieldset.scss +10 -0
  169. package/form-field/form-field-tokens.scss +15 -1
  170. package/form-field/form-field.scss +15 -19
  171. package/form-field/index.d.ts +147 -65
  172. package/icon/icon-button.scss +3 -1
  173. package/icon/index.d.ts +45 -7
  174. package/inline-edit/index.d.ts +57 -4
  175. package/inline-edit/inline-edit.scss +10 -0
  176. package/input/index.d.ts +17 -2
  177. package/list/_list-theme.scss +42 -10
  178. package/list/index.d.ts +326 -79
  179. package/list/list-tokens.scss +43 -8
  180. package/list/list.scss +186 -12
  181. package/markdown/index.d.ts +1 -1
  182. package/modal/index.d.ts +21 -4
  183. package/modal/modal-tokens.scss +1 -1
  184. package/navbar/_navbar-item_vertical.scss +7 -5
  185. package/navbar/index.d.ts +54 -5
  186. package/navbar/navbar-brand.scss +23 -7
  187. package/navbar/vertical-navbar.scss +6 -0
  188. package/notification-center/index.d.ts +2 -1
  189. package/notification-center/notification-item.scss +6 -0
  190. package/package.json +3 -6
  191. package/popover/index.d.ts +2 -2
  192. package/prebuilt-themes/dark-theme.css +1 -1
  193. package/prebuilt-themes/light-theme.css +1 -1
  194. package/prebuilt-themes/theme.css +1 -1
  195. package/resizer/index.d.ts +12 -0
  196. package/schematics/collection.json +10 -0
  197. package/schematics/migrations/alert-signals/README.md +64 -0
  198. package/schematics/migrations/alert-signals/data.js +70 -0
  199. package/schematics/migrations/alert-signals/index.js +350 -0
  200. package/schematics/migrations/alert-signals/schema.json +20 -0
  201. package/schematics/migrations/autocomplete-panel-width-auto/README.md +68 -0
  202. package/schematics/migrations/autocomplete-panel-width-auto/index.js +70 -0
  203. package/schematics/migrations/autocomplete-panel-width-auto/schema.json +15 -0
  204. package/schematics/migrations/deprecated-icons/README.md +29 -4
  205. package/schematics/migrations/deprecated-icons/data.js +7 -0
  206. package/schematics/migrations/deprecated-icons/index.js +62 -35
  207. package/schematics/migrations/filter-bar-signals/README.md +1 -1
  208. package/schematics/migrations/new-icons-pack/README.md +37 -2
  209. package/schematics/migrations/new-icons-pack/data.js +8 -0
  210. package/schematics/migrations/new-icons-pack/index.js +144 -53
  211. package/schematics/migrations.json +11 -1
  212. package/schematics/ng-add/index.js +3 -3
  213. package/schematics/utils/angular-parsing.js +41 -14
  214. package/schematics/utils/ast.js +31 -0
  215. package/schematics/utils/icon-migration.js +530 -0
  216. package/schematics/utils/typescript.js +44 -0
  217. package/scrollbar/index.d.ts +1 -1
  218. package/search-expandable/index.d.ts +3 -0
  219. package/select/index.d.ts +212 -40
  220. package/select/select-tokens.scss +0 -1
  221. package/select/select.scss +0 -2
  222. package/splitter/index.d.ts +1 -1
  223. package/table/_table-theme.scss +4 -0
  224. package/table/index.d.ts +2 -1
  225. package/table/table.scss +8 -0
  226. package/tabs/_tabs-common.scss +60 -31
  227. package/tabs/_tabs-theme.scss +12 -0
  228. package/tabs/index.d.ts +2 -2
  229. package/tabs/tab-header.scss +14 -0
  230. package/tabs/tab-nav-bar.scss +4 -0
  231. package/tabs/tabs-tokens.scss +1 -0
  232. package/tags/index.d.ts +128 -29
  233. package/textarea/index.d.ts +5 -0
  234. package/time-range/index.d.ts +1 -1
  235. package/timepicker/index.d.ts +4 -0
  236. package/timezone/index.d.ts +10 -8
  237. package/toast/index.d.ts +26 -3
  238. package/toggle/index.d.ts +34 -14
  239. package/tooltip/index.d.ts +119 -7
  240. package/tree/_tree-theme.scss +25 -5
  241. package/tree/index.d.ts +71 -3
  242. package/tree/tree-option.scss +2 -8
  243. package/tree-select/_tree-select-theme.scss +22 -0
  244. package/tree-select/index.d.ts +127 -36
  245. package/accordion/accordion.component.scss +0 -50
  246. package/core/styles/_tokens.kbq.import.scss +0 -4
  247. package/core/styles/theming/_components-theming.scss +0 -1927
  248. package/filter-bar/pipes/pipe-select.scss +0 -5
  249. package/overflow-items/overflow-items.scss +0 -20
@@ -7,8 +7,8 @@ import * as i4 from '@angular/cdk/scrolling';
7
7
  import { CdkScrollable, CdkScrollableModule } from '@angular/cdk/scrolling';
8
8
  import { DOCUMENT, NgTemplateOutlet } from '@angular/common';
9
9
  import * as i0 from '@angular/core';
10
- import { InjectionToken, inject, Renderer2, signal, input, numberAttribute, booleanAttribute, SecurityContext, isDevMode, Input, Directive, viewChild, output, ElementRef, Injector, ChangeDetectorRef, DestroyRef, TemplateRef, ContentChild, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
11
- import { takeUntilDestroyed, toObservable, outputToObservable } from '@angular/core/rxjs-interop';
10
+ import { InjectionToken, inject, Renderer2, signal, input, numberAttribute, booleanAttribute, SecurityContext, isDevMode, Input, Directive, viewChild, output, ElementRef, Injector, ChangeDetectorRef, DestroyRef, computed, effect, TemplateRef, ContentChild, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
11
+ import { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';
12
12
  import { DomSanitizer } from '@angular/platform-browser';
13
13
  import * as i2 from '@koobiq/components/button';
14
14
  import { KbqButtonStyles, KbqButtonModule } from '@koobiq/components/button';
@@ -19,7 +19,7 @@ import * as i1 from '@koobiq/components/tabs';
19
19
  import { KbqTabsModule } from '@koobiq/components/tabs';
20
20
  import * as i5 from '@koobiq/components/tooltip';
21
21
  import { KbqToolTipModule } from '@koobiq/components/tooltip';
22
- import { filter, take, startWith, switchMap, EMPTY, merge, fromEvent, debounceTime } from 'rxjs';
22
+ import { filter, take, merge, fromEvent, map, debounceTime } from 'rxjs';
23
23
 
24
24
  const defaultHljsLoader = () => import('highlight.js');
25
25
  /**
@@ -471,10 +471,10 @@ class KbqCodeBlockHighlight {
471
471
  return isFinite(number) ? number : fallback;
472
472
  }
473
473
  }
474
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqCodeBlockHighlight, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
475
- /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.25", type: KbqCodeBlockHighlight, isStandalone: true, selector: "code[kbqCodeBlockHighlight]", inputs: { file: { classPropertyName: "file", publicName: "file", isSignal: false, isRequired: true, transformFunction: null }, startFrom: { classPropertyName: "startFrom", publicName: "startFrom", isSignal: true, isRequired: false, transformFunction: null }, singleLine: { classPropertyName: "singleLine", publicName: "singleLine", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "hljs" }, exportAs: ["kbqCodeBlockHighlight"], ngImport: i0 }); }
474
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqCodeBlockHighlight, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
475
+ /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.30", type: KbqCodeBlockHighlight, isStandalone: true, selector: "code[kbqCodeBlockHighlight]", inputs: { file: { classPropertyName: "file", publicName: "file", isSignal: false, isRequired: true, transformFunction: null }, startFrom: { classPropertyName: "startFrom", publicName: "startFrom", isSignal: true, isRequired: false, transformFunction: null }, singleLine: { classPropertyName: "singleLine", publicName: "singleLine", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "hljs" }, exportAs: ["kbqCodeBlockHighlight"], ngImport: i0 }); }
476
476
  }
477
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqCodeBlockHighlight, decorators: [{
477
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqCodeBlockHighlight, decorators: [{
478
478
  type: Directive,
479
479
  args: [{
480
480
  selector: 'code[kbqCodeBlockHighlight]',
@@ -504,12 +504,19 @@ const kbqCodeBlockFallbackFileNameProvider = (fileName) => ({
504
504
  provide: KBQ_CODE_BLOCK_FALLBACK_FILE_NAME,
505
505
  useValue: fileName
506
506
  });
507
+ /** Injection token used to configure the default options for all `kbq-code-block` components. */
508
+ const KBQ_CODE_BLOCK_DEFAULT_OPTIONS = new InjectionToken('KBQ_CODE_BLOCK_DEFAULT_OPTIONS');
509
+ /** Utility provider for `KBQ_CODE_BLOCK_DEFAULT_OPTIONS`. */
510
+ const kbqCodeBlockDefaultOptionsProvider = (options) => ({
511
+ provide: KBQ_CODE_BLOCK_DEFAULT_OPTIONS,
512
+ useValue: options
513
+ });
507
514
  /** Marks a template as a custom tab link. */
508
515
  class KbqCodeBlockTabLinkContent {
509
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqCodeBlockTabLinkContent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
510
- /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.25", type: KbqCodeBlockTabLinkContent, isStandalone: true, selector: "ng-template[kbqCodeBlockTabLinkContent]", exportAs: ["kbqCodeBlockTabLinkContent"], ngImport: i0 }); }
516
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqCodeBlockTabLinkContent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
517
+ /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.30", type: KbqCodeBlockTabLinkContent, isStandalone: true, selector: "ng-template[kbqCodeBlockTabLinkContent]", exportAs: ["kbqCodeBlockTabLinkContent"], ngImport: i0 }); }
511
518
  }
512
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqCodeBlockTabLinkContent, decorators: [{
519
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqCodeBlockTabLinkContent, decorators: [{
513
520
  type: Directive,
514
521
  args: [{
515
522
  selector: 'ng-template[kbqCodeBlockTabLinkContent]',
@@ -571,12 +578,11 @@ class KbqCodeBlock {
571
578
  // TODO: Skipped for migration because:
572
579
  // Accessor inputs cannot be migrated as they are too complex.
573
580
  get hideTabs() {
574
- return this._hideTabs;
581
+ return this._hideTabs();
575
582
  }
576
583
  set hideTabs(value) {
577
- this._hideTabs = value;
584
+ this._hideTabs.set(value);
578
585
  this.hideTabsChange.emit(value);
579
- this.setupActionbarDisplay();
580
586
  }
581
587
  /**
582
588
  * Component locale configuration.
@@ -608,6 +614,7 @@ class KbqCodeBlock {
608
614
  }
609
615
  constructor() {
610
616
  this.copyButtonTooltip = viewChild('copyButtonTooltip', ...(ngDevMode ? [{ debugName: "copyButtonTooltip" }] : []));
617
+ this.defaultOptions = inject(KBQ_CODE_BLOCK_DEFAULT_OPTIONS, { optional: true });
611
618
  /**
612
619
  * Reference to the scrollable code content.
613
620
  *
@@ -658,6 +665,10 @@ class KbqCodeBlock {
658
665
  this.canDownload = false;
659
666
  /** Added copy code button. */
660
667
  this.canCopy = input(true, ...(ngDevMode ? [{ debugName: "canCopy", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
668
+ /** Whether the actionbar should remain visible when tabs are hidden. */
669
+ this.alwaysShowActionbar = input(this.defaultOptions?.alwaysShowActionbar ?? false, ...(ngDevMode ? [{ debugName: "alwaysShowActionbar", transform: booleanAttribute }] : [{
670
+ transform: booleanAttribute
671
+ }]));
661
672
  this._files = [];
662
673
  /** Defines which file (index) is active. */
663
674
  // TODO: Skipped for migration because:
@@ -669,7 +680,8 @@ class KbqCodeBlock {
669
680
  this.activeFileIndexChange = output();
670
681
  /** Whether to hide border. */
671
682
  this.noBorder = input(false, ...(ngDevMode ? [{ debugName: "noBorder", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
672
- this._hideTabs = false;
683
+ this._hideTabs = signal(false, ...(ngDevMode ? [{ debugName: "_hideTabs" }] : []));
684
+ this.actionbarHovered = signal(false, ...(ngDevMode ? [{ debugName: "actionbarHovered" }] : []));
673
685
  /**
674
686
  * Output to support two-way binding on `[(hideTabs)]` property.
675
687
  */
@@ -688,7 +700,6 @@ class KbqCodeBlock {
688
700
  this.changeDetectorRef = inject(ChangeDetectorRef);
689
701
  this.localeService = inject(KBQ_LOCALE_SERVICE, { optional: true });
690
702
  this.destroyRef = inject(DestroyRef);
691
- this.renderer = inject(Renderer2);
692
703
  this.platform = inject(Platform);
693
704
  this.focusMonitor = inject(FocusMonitor);
694
705
  this.clipboard = inject(Clipboard);
@@ -700,17 +711,21 @@ class KbqCodeBlock {
700
711
  */
701
712
  this.fallbackFileName = inject(KBQ_CODE_BLOCK_FALLBACK_FILE_NAME);
702
713
  this.window = inject(KBQ_WINDOW);
714
+ /** @docs-private */
715
+ this.actionbarVisible = computed(() => this.alwaysShowActionbar() ||
716
+ this.platform.IOS ||
717
+ this.platform.ANDROID ||
718
+ !this._hideTabs() ||
719
+ this.actionbarHovered(), ...(ngDevMode ? [{ debugName: "actionbarVisible" }] : []));
703
720
  this.updateLocaleParams = () => {
704
721
  this._localeConfiguration = this.localeService?.getParams('codeBlock');
705
722
  this.changeDetectorRef.markForCheck();
706
723
  };
724
+ this.trackHoverState();
707
725
  this.localeService?.changes.pipe(takeUntilDestroyed()).subscribe(this.updateLocaleParams);
708
726
  }
709
727
  ngAfterViewInit() {
710
- this.trackHoverState();
711
728
  this.setupContentOverflowDetection();
712
- // Setup initial actionbar display state
713
- this.setupActionbarDisplay();
714
729
  this.copyButtonTooltip()
715
730
  ?.visibleChange.pipe(takeUntilDestroyed(this.destroyRef))
716
731
  .subscribe((isVisible) => {
@@ -777,20 +792,21 @@ class KbqCodeBlock {
777
792
  this.scrollTo({ top: 0, behavior: 'instant' });
778
793
  }
779
794
  }
780
- /**
781
- * Tracks hover events to show/hide the actionbar when `hideTabs` is `true`.
782
- * Reacts to `hideTabs` changes dynamically.
783
- */
795
+ /** Tracks hover when tabs are hidden and `alwaysShowActionbar` is disabled. */
784
796
  trackHoverState() {
785
- outputToObservable(this.hideTabsChange)
786
- .pipe(startWith(this._hideTabs), switchMap((hideTabs) => {
787
- if (!hideTabs)
788
- return EMPTY;
789
- return merge(fromEvent(this.elementRef.nativeElement, 'mouseenter'), fromEvent(this.elementRef.nativeElement, 'mouseleave')).pipe(debounceTime(100));
790
- }), takeUntilDestroyed(this.destroyRef))
791
- .subscribe((event) => {
792
- this.setupActionbarDisplay(event?.type === 'mouseenter');
793
- });
797
+ effect((onCleanup) => {
798
+ const hideTabs = this._hideTabs();
799
+ const alwaysShowActionbar = this.alwaysShowActionbar();
800
+ this.actionbarHovered.set(false);
801
+ if (!hideTabs || alwaysShowActionbar || this.platform.IOS || this.platform.ANDROID)
802
+ return;
803
+ const subscription = merge(fromEvent(this.elementRef.nativeElement, 'mouseenter').pipe(map(() => true)), fromEvent(this.elementRef.nativeElement, 'mouseleave').pipe(map(() => false)))
804
+ .pipe(debounceTime(100))
805
+ .subscribe((isHovered) => {
806
+ this.actionbarHovered.set(isHovered);
807
+ });
808
+ onCleanup(() => subscription.unsubscribe());
809
+ }, { injector: this.injector });
794
810
  }
795
811
  setupContentOverflowDetection() {
796
812
  if (!this.platform.isBrowser)
@@ -812,36 +828,6 @@ class KbqCodeBlock {
812
828
  .pipe(takeUntilDestroyed(this.destroyRef))
813
829
  .subscribe(checkOverflow);
814
830
  }
815
- /**
816
- * Adds or removes the actionbar display class from the code block based on the specified condition.
817
- *
818
- * The actionbar is always visible on mobile devices and when the tabs are visible.
819
- * Otherwise, the actionbar is only visible when the mouse is hovered over the code block.
820
- *
821
- * @param shouldShowActionbar - A boolean indicating whether the actionbar should be visible.
822
- */
823
- setupActionbarDisplay(shouldShowActionbar) {
824
- const className = 'kbq-code-block_show-actionbar';
825
- // Should always show actionbar on Mobile devices
826
- if (this.platform.IOS || this.platform.ANDROID) {
827
- this.renderer.addClass(this.elementRef.nativeElement, className);
828
- return;
829
- }
830
- // Should always show actionbar when tabs are visible
831
- if (!this.hideTabs) {
832
- this.renderer.addClass(this.elementRef.nativeElement, className);
833
- return;
834
- }
835
- if (typeof shouldShowActionbar === 'undefined') {
836
- return;
837
- }
838
- if (shouldShowActionbar) {
839
- this.renderer.addClass(this.elementRef.nativeElement, className);
840
- }
841
- else {
842
- this.renderer.removeClass(this.elementRef.nativeElement, className);
843
- }
844
- }
845
831
  /** Whether the element has scroll. */
846
832
  hasScroll({ scrollHeight, scrollWidth, clientHeight, clientWidth }) {
847
833
  return scrollHeight > clientHeight || scrollWidth > clientWidth;
@@ -902,10 +888,10 @@ class KbqCodeBlock {
902
888
  link.setAttribute('download', file.filename || this.fallbackFileName);
903
889
  link.click();
904
890
  }
905
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqCodeBlock, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
906
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: KbqCodeBlock, isStandalone: true, selector: "kbq-code-block", inputs: { lineNumbers: { classPropertyName: "lineNumbers", publicName: "lineNumbers", isSignal: true, isRequired: false, transformFunction: null }, filled: { classPropertyName: "filled", publicName: "filled", isSignal: true, isRequired: false, transformFunction: null }, canToggleSoftWrap: { classPropertyName: "canToggleSoftWrap", publicName: "canToggleSoftWrap", isSignal: true, isRequired: false, transformFunction: null }, softWrap: { classPropertyName: "softWrap", publicName: "softWrap", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, viewAll: { classPropertyName: "viewAll", publicName: "viewAll", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, canLoad: { classPropertyName: "canLoad", publicName: "canLoad", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, canDownload: { classPropertyName: "canDownload", publicName: "canDownload", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, canCopy: { classPropertyName: "canCopy", publicName: "canCopy", isSignal: true, isRequired: false, transformFunction: null }, codeFiles: { classPropertyName: "codeFiles", publicName: "codeFiles", isSignal: false, isRequired: false, transformFunction: null }, files: { classPropertyName: "files", publicName: "files", isSignal: false, isRequired: false, transformFunction: null }, activeFileIndex: { classPropertyName: "activeFileIndex", publicName: "activeFileIndex", isSignal: false, isRequired: false, transformFunction: numberAttribute }, noBorder: { classPropertyName: "noBorder", publicName: "noBorder", isSignal: true, isRequired: false, transformFunction: null }, hideTabs: { classPropertyName: "hideTabs", publicName: "hideTabs", isSignal: false, isRequired: false, transformFunction: booleanAttribute } }, outputs: { softWrapChange: "softWrapChange", viewAllChange: "viewAllChange", activeFileIndexChange: "activeFileIndexChange", hideTabsChange: "hideTabsChange" }, host: { attributes: { "ngSkipHydration": "true" }, properties: { "class.kbq-code-block_filled": "filled()", "class.kbq-code-block_outline": "!filled()", "class.kbq-code-block_hide-line-numbers": "!lineNumbers()", "class.kbq-code-block_hide-tabs": "hideTabs", "class.kbq-code-block_no-border": "noBorder() || filled()", "class.kbq-code-block_soft-wrap": "softWrap", "class.kbq-code-block_view-all": "viewAll" }, classAttribute: "kbq-code-block" }, queries: [{ propertyName: "tabLinkTemplate", first: true, predicate: KbqCodeBlockTabLinkContent, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "copyButtonTooltip", first: true, predicate: ["copyButtonTooltip"], descendants: true, isSignal: true }, { propertyName: "scrollableCodeContent", first: true, predicate: CdkScrollable, descendants: true, isSignal: true }, { propertyName: "highlight", first: true, predicate: KbqCodeBlockHighlight, descendants: true, isSignal: true }, { propertyName: "preElementRef", first: true, predicate: ["codeBlockPre"], descendants: true, isSignal: true }], exportAs: ["kbqCodeBlock"], ngImport: i0, template: "@let file = files[activeFileIndex];\n\n<div class=\"kbq-code-block__header\" [kbqOverflowShadowTop]=\"codeBlockContent\">\n @if (!hideTabs) {\n <div class=\"kbq-code-block__header-tabs\">\n <div kbqTabNavBar transparent [tabNavPanel]=\"tabPanel\">\n @for (file of files; track file) {\n <!-- Mark tab-link as readonly if only single file present -->\n <div\n kbqTabLink\n [active]=\"$count > 1 && activeFileIndex === $index\"\n [style.pointer-events]=\"$count === 1 ? 'none' : null\"\n (click)=\"onSelectedTabChange($index)\"\n >\n @if (tabLinkTemplate) {\n <ng-container\n *ngTemplateOutlet=\"tabLinkTemplate; context: { $implicit: file, fallbackFileName }\"\n />\n } @else {\n {{ file.filename || fallbackFileName }}\n }\n </div>\n }\n </div>\n </div>\n }\n\n <div class=\"kbq-code-block__actionbar\">\n <div class=\"kbq-code-block__actionbar__button-stack\">\n @if (canToggleSoftWrap()) {\n <button\n kbq-button\n class=\"kbq-code-block__actionbar__soft-wrap-button\"\n [color]=\"componentColor.Contrast\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n [kbqTooltip]=\"\n softWrap ? localeConfiguration.softWrapOffTooltip : localeConfiguration.softWrapOnTooltip\n \"\n (click)=\"toggleSoftWrap()\"\n >\n @if (softWrap) {\n <i kbq-icon=\"kbq-text-overflow_16\"></i>\n } @else {\n <i kbq-icon=\"kbq-text-wrap_16\"></i>\n }\n </button>\n }\n\n @if (canDownload) {\n <button\n kbq-button\n class=\"kbq-code-block__actionbar__download-button\"\n [color]=\"componentColor.Contrast\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n [kbqTooltip]=\"localeConfiguration.downloadTooltip\"\n (click)=\"downloadCode()\"\n >\n <i kbq-icon=\"kbq-arrow-down-to-line_16\"></i>\n </button>\n }\n\n @if (canCopy()) {\n <div #copyButtonTooltip=\"kbqTooltip\" [kbqTooltip]=\"localeConfiguration.copyTooltip\">\n <button\n kbq-button\n class=\"kbq-code-block__actionbar__copy-button\"\n [color]=\"componentColor.Contrast\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n (click)=\"copyCode()\"\n >\n <i kbq-icon=\"kbq-file-multiple-o_16\"></i>\n </button>\n </div>\n }\n\n @if (file.link) {\n <button\n kbq-button\n class=\"kbq-code-block__actionbar__link-button\"\n [color]=\"componentColor.Contrast\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n [kbqTooltip]=\"localeConfiguration.openExternalSystemTooltip\"\n (click)=\"openLink()\"\n >\n <i kbq-icon=\"kbq-arrow-up-right-from-square_16\"></i>\n </button>\n }\n </div>\n </div>\n</div>\n\n<div\n #tabPanel=\"kbqTabNavPanel\"\n #codeBlockContent=\"kbqOverflowShadowContainer\"\n cdkMonitorElementFocus\n cdkScrollable\n kbqOverflowShadowContainer\n kbqTabNavPanel\n class=\"kbq-code-block__main kbq-scrollbar\"\n [style.max-height.px]=\"calculatedMaxHeight\"\n [tabIndex]=\"codeContentTabIndex\"\n>\n <pre\n #codeBlockPre\n class=\"kbq-code-block__pre\"\n ><code kbqCodeBlockHighlight class=\"kbq-code-block__code\" [file]=\"file\">{{ file.content }}</code></pre>\n\n @if (contentExceedsMaxHeight()) {\n <div\n class=\"kbq-code-block__view-all\"\n [class.kbq-code-block__view-all_collapsed]=\"!viewAll\"\n [class.kbq-code-block__view-all_expanded]=\"viewAll\"\n >\n <div class=\"kbq-code-block__view-all__wrapper\">\n <button\n kbq-button\n class=\"kbq-code-block__view-all__button\"\n [color]=\"componentColor.Theme\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n (click)=\"toggleViewAll()\"\n (keydown.enter)=\"onViewAllEnterKeydown($event)\"\n >\n @if (viewAll) {\n <i kbq-icon=\"kbq-chevron-up_16\"></i>\n {{ localeConfiguration.viewLessText }}\n } @else {\n <i kbq-icon=\"kbq-chevron-down_16\"></i>\n {{ localeConfiguration.viewAllText }}\n }\n </button>\n </div>\n </div>\n }\n</div>\n", styles: [".kbq-code-block{display:flex;flex-direction:column;position:relative;border-width:var(--kbq-code-block-size-container-border-width);border-style:solid;border-radius:var(--kbq-code-block-size-container-border-radius);box-sizing:border-box;hyphens:none;-ms-hyphens:none;-moz-hyphens:none;-webkit-hyphens:none}.kbq-code-block .kbq-code-block__header{display:flex;align-items:center;padding:var(--kbq-size-s) var(--kbq-size-m)}.kbq-code-block .kbq-code-block__header .kbq-code-block__header-tabs{overflow:hidden;flex-grow:1}.kbq-code-block .kbq-code-block__actionbar{display:flex;justify-content:right;align-items:center;z-index:1}.kbq-code-block .kbq-code-block__actionbar .kbq-code-block__actionbar__button-stack{display:flex;gap:var(--kbq-code-block-size-actionbar-content-gap-horizontal)}.kbq-code-block:has(.kbq-code-block__view-all) .kbq-code-block__main .kbq-code-block__code{padding-bottom:var(--kbq-size-3xl)!important}.kbq-code-block .kbq-code-block__main{flex-grow:1;flex-direction:column;border-radius:var(--kbq-code-block-size-container-border-radius)}.kbq-code-block .kbq-code-block__main.cdk-keyboard-focused{outline-style:solid;outline-width:var(--kbq-code-block-size-container-border-width-focused);outline-offset:-1px}.kbq-code-block .kbq-code-block__main .kbq-code-block__pre{margin:0;flex-grow:1}.kbq-code-block .kbq-code-block__main .kbq-code-block__code{tab-size:var(--kbq-code-block-tab-size);padding:var(--kbq-code-block-size-with-header-content-padding-top) var(--kbq-code-block-size-with-header-content-padding-horizontal) var(--kbq-code-block-size-with-header-content-padding-bottom) var(--kbq-code-block-size-with-header-content-padding-horizontal)}.kbq-code-block .kbq-code-block__main .kbq-code-block__code:focus-visible{outline:none}.kbq-code-block .kbq-code-block__main .hljs{display:block}.kbq-code-block .kbq-code-block__main .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-with-header-content-content-gap-horizontal);vertical-align:baseline;text-align:right}.kbq-code-block .kbq-code-block__main .hljs-ln{border-collapse:unset}.kbq-code-block .kbq-code-block__main .hljs-ln .hljs{padding:0}.kbq-code-block .kbq-code-block__main .hljs-ln-n:before{white-space:nowrap}.kbq-code-block.kbq-code-block_hide-line-numbers .hljs-ln-line.hljs-ln-numbers{display:none}.kbq-code-block.kbq-code-block_soft-wrap .kbq-code-block__code{white-space:pre-wrap;overflow-wrap:anywhere}.kbq-code-block.kbq-code-block_view-all .kbq-code-block__main{max-height:unset;overflow:auto}.kbq-code-block:not(.kbq-code-block_view-all) .kbq-code-block__main{overflow:hidden}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__header{padding:0}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__actionbar{display:none;position:absolute;top:0;right:0;margin:var(--kbq-size-s) var(--kbq-size-s) var(--kbq-size-s) 0}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__actionbar .kbq-code-block__actionbar__button-stack{border-width:1px;border-style:solid;border-radius:calc(var(--kbq-size-border-radius) + 1px)}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__main{position:relative}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__main .kbq-code-block__code{padding:var(--kbq-code-block-size-no-header-content-padding-vertical) var(--kbq-code-block-size-no-header-content-padding-horizontal)}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__main .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-no-header-content-content-gap-horizontal)}.kbq-code-block:not(.kbq-code-block_hide-tabs) .kbq-code-block__header{border-radius:var(--kbq-code-block-size-container-border-radius) var(--kbq-code-block-size-container-border-radius) 0 0}.kbq-code-block:not(.kbq-code-block_hide-tabs) .kbq-code-block__main{border-radius:0 0 var(--kbq-code-block-size-container-border-radius) var(--kbq-code-block-size-container-border-radius)}.kbq-code-block.kbq-code-block_show-actionbar .kbq-code-block__actionbar{display:flex}.kbq-code-block:not(:has(.kbq-code-block__view-all)) .kbq-code-block__main{overflow:auto}.kbq-code-block .kbq-code-block__view-all{display:flex;justify-content:center;width:100%;position:absolute;bottom:calc(var(--kbq-code-block-size-container-border-width) * -1);border-radius:var(--kbq-code-block-size-container-border-radius)}.kbq-code-block .kbq-code-block__view-all .kbq-code-block__view-all__wrapper{border-radius:var(--kbq-size-border-radius)}.kbq-code-block .kbq-code-block__view-all.kbq-code-block__view-all_collapsed{padding-top:var(--kbq-code-block-size-collapse-collapsed-padding-top);padding-bottom:var(--kbq-code-block-size-collapse-collapsed-padding-bottom)}.kbq-code-block .kbq-code-block__view-all.kbq-code-block__view-all_expanded{padding-top:var(--kbq-code-block-size-collapse-expanded-padding-top);margin-bottom:var(--kbq-code-block-size-collapse-expanded-padding-bottom)}.kbq-code-block.kbq-code-block_no-border{border-color:transparent!important}.kbq-code-block .hljs-addition{background-color:var(--kbq-code-block-hljs-addition-background);color:var(--kbq-code-block-hljs-addition-color)}.kbq-code-block .hljs-attr{background-color:var(--kbq-code-block-hljs-attr-background);color:var(--kbq-code-block-hljs-attr-color)}.kbq-code-block .hljs-attribute{background-color:var(--kbq-code-block-hljs-attribute-background);color:var(--kbq-code-block-hljs-attribute-color)}.kbq-code-block .hljs-built_in{background-color:var(--kbq-code-block-hljs-built-in-background);color:var(--kbq-code-block-hljs-built-in-color)}.kbq-code-block .hljs-bullet{background-color:var(--kbq-code-block-hljs-bullet-background);color:var(--kbq-code-block-hljs-bullet-color)}.kbq-code-block .hljs-char-escape{background-color:var(--kbq-code-block-hljs-char-escape-background);color:var(--kbq-code-block-hljs-char-escape-color)}.kbq-code-block .hljs-class{background-color:var(--kbq-code-block-hljs-class-background);color:var(--kbq-code-block-hljs-class-color)}.kbq-code-block .hljs-code{background-color:var(--kbq-code-block-hljs-code-background);color:var(--kbq-code-block-hljs-code-color)}.kbq-code-block .hljs-comment{background-color:var(--kbq-code-block-hljs-comment-background);color:var(--kbq-code-block-hljs-comment-color)}.kbq-code-block .hljs-deletion{background-color:var(--kbq-code-block-hljs-deletion-background);color:var(--kbq-code-block-hljs-deletion-color)}.kbq-code-block .hljs-doctag{background-color:var(--kbq-code-block-hljs-doctag-background);color:var(--kbq-code-block-hljs-doctag-color)}.kbq-code-block .hljs-emphasis{background-color:var(--kbq-code-block-hljs-emphasis-background);color:var(--kbq-code-block-hljs-emphasis-color)}.kbq-code-block .hljs-formula{background-color:var(--kbq-code-block-hljs-formula-background);color:var(--kbq-code-block-hljs-formula-color)}.kbq-code-block .hljs-function{background-color:var(--kbq-code-block-hljs-function-background);color:var(--kbq-code-block-hljs-function-color)}.kbq-code-block .hljs-keyword{background-color:var(--kbq-code-block-hljs-keyword-background);color:var(--kbq-code-block-hljs-keyword-color)}.kbq-code-block .hljs-link{background-color:var(--kbq-code-block-hljs-link-background);color:var(--kbq-code-block-hljs-link-color)}.kbq-code-block .hljs-literal{background-color:var(--kbq-code-block-hljs-literal-background);color:var(--kbq-code-block-hljs-literal-color)}.kbq-code-block .hljs-meta{background-color:var(--kbq-code-block-hljs-meta-background);color:var(--kbq-code-block-hljs-meta-color)}.kbq-code-block .hljs-meta-keyword{background-color:var(--kbq-code-block-hljs-meta-keyword-background);color:var(--kbq-code-block-hljs-meta-keyword-color)}.kbq-code-block .hljs-meta-string{background-color:var(--kbq-code-block-hljs-meta-string-background);color:var(--kbq-code-block-hljs-meta-string-color)}.kbq-code-block .hljs-meta-prompt{background-color:var(--kbq-code-block-hljs-meta-prompt-background);color:var(--kbq-code-block-hljs-meta-prompt-color)}.kbq-code-block .hljs-name{background-color:var(--kbq-code-block-hljs-name-background);color:var(--kbq-code-block-hljs-name-color)}.kbq-code-block .hljs-number{background-color:var(--kbq-code-block-hljs-number-background);color:var(--kbq-code-block-hljs-number-color)}.kbq-code-block .hljs-operator{background-color:var(--kbq-code-block-hljs-operator-background);color:var(--kbq-code-block-hljs-operator-color)}.kbq-code-block .hljs-params{background-color:var(--kbq-code-block-hljs-params-background);color:var(--kbq-code-block-hljs-params-color)}.kbq-code-block .hljs-property{background-color:var(--kbq-code-block-hljs-property-background);color:var(--kbq-code-block-hljs-property-color)}.kbq-code-block .hljs-punctuation{background-color:var(--kbq-code-block-hljs-punctuation-background);color:var(--kbq-code-block-hljs-punctuation-color)}.kbq-code-block .hljs-quote{background-color:var(--kbq-code-block-hljs-quote-background);color:var(--kbq-code-block-hljs-quote-color)}.kbq-code-block .hljs-regexp{background-color:var(--kbq-code-block-hljs-regexp-background);color:var(--kbq-code-block-hljs-regexp-color)}.kbq-code-block .hljs-section{background-color:var(--kbq-code-block-hljs-section-background);color:var(--kbq-code-block-hljs-section-color)}.kbq-code-block .hljs-selector-attr{background-color:var(--kbq-code-block-hljs-selector-attr-background);color:var(--kbq-code-block-hljs-selector-attr-color)}.kbq-code-block .hljs-selector-class{background-color:var(--kbq-code-block-hljs-selector-class-background);color:var(--kbq-code-block-hljs-selector-class-color)}.kbq-code-block .hljs-selector-id{background-color:var(--kbq-code-block-hljs-selector-id-background);color:var(--kbq-code-block-hljs-selector-id-color)}.kbq-code-block .hljs-selector-pseudo{background-color:var(--kbq-code-block-hljs-selector-pseudo-background);color:var(--kbq-code-block-hljs-selector-pseudo-color)}.kbq-code-block .hljs-selector-tag{background-color:var(--kbq-code-block-hljs-selector-tag-background);color:var(--kbq-code-block-hljs-selector-tag-color)}.kbq-code-block .hljs-string{background-color:var(--kbq-code-block-hljs-string-background);color:var(--kbq-code-block-hljs-string-color)}.kbq-code-block .hljs-strong{background-color:var(--kbq-code-block-hljs-strong-background);color:var(--kbq-code-block-hljs-strong-color)}.kbq-code-block .hljs-subst{background-color:var(--kbq-code-block-hljs-subst-background);color:var(--kbq-code-block-hljs-subst-color)}.kbq-code-block .hljs-symbol{background-color:var(--kbq-code-block-hljs-symbol-background);color:var(--kbq-code-block-hljs-symbol-color)}.kbq-code-block .hljs-tag{background-color:var(--kbq-code-block-hljs-tag-background);color:var(--kbq-code-block-hljs-tag-color)}.kbq-code-block .hljs-template-tag{background-color:var(--kbq-code-block-hljs-template-tag-background);color:var(--kbq-code-block-hljs-template-tag-color)}.kbq-code-block .hljs-template-variable{background-color:var(--kbq-code-block-hljs-template-variable-background);color:var(--kbq-code-block-hljs-template-variable-color)}.kbq-code-block .hljs-title{background-color:var(--kbq-code-block-hljs-title-background);color:var(--kbq-code-block-hljs-title-color)}.kbq-code-block .hljs-title-class{background-color:var(--kbq-code-block-hljs-title-class-background);color:var(--kbq-code-block-hljs-title-class-color)}.kbq-code-block .hljs-title-class-inherited{background-color:var(--kbq-code-block-hljs-title-class-inherited-background);color:var(--kbq-code-block-hljs-title-class-inherited-color)}.kbq-code-block .hljs-title-function{background-color:var(--kbq-code-block-hljs-title-function-background);color:var(--kbq-code-block-hljs-title-function-color)}.kbq-code-block .hljs-title-function-invoke{background-color:var(--kbq-code-block-hljs-title-function-invoke-background);color:var(--kbq-code-block-hljs-title-function-invoke-color)}.kbq-code-block .hljs-type{background-color:var(--kbq-code-block-hljs-type-background);color:var(--kbq-code-block-hljs-type-color)}.kbq-code-block .hljs-variable{background-color:var(--kbq-code-block-hljs-variable-background);color:var(--kbq-code-block-hljs-variable-color)}.kbq-code-block .hljs-variable-constant{background-color:var(--kbq-code-block-hljs-variable-constant-background);color:var(--kbq-code-block-hljs-variable-constant-color)}.kbq-code-block .hljs-variable-language{background-color:var(--kbq-code-block-hljs-variable-language-background);color:var(--kbq-code-block-hljs-variable-language-color)}.kbq-code-block .hljs-ln-n{color:var(--kbq-code-block-hljs-line-numbers-color)}.kbq-code-block.kbq-code-block_outline{background:var(--kbq-code-block-outline-container-background);border-color:var(--kbq-code-block-outline-container-border-color)}.kbq-code-block.kbq-code-block_outline .kbq-code-block__header{background:var(--kbq-code-block-outline-header-background)}.kbq-code-block.kbq-code-block_outline.kbq-code-block_hide-tabs .kbq-code-block__actionbar .kbq-code-block__actionbar__button-stack{border-color:var(--kbq-code-block-outline-actionbar-border-color);background:var(--kbq-code-block-outline-actionbar-background)}.kbq-code-block.kbq-code-block_outline .kbq-code-block__view-all .kbq-code-block__view-all__wrapper{background:var(--kbq-code-block-outline-collapse-button-expand-background);opacity:90%}.kbq-code-block.kbq-code-block_outline .kbq-code-block__view-all.kbq-code-block__view-all_expanded{background:var(--kbq-code-block-outline-collapse-expanded-background)}.kbq-code-block.kbq-code-block_outline .kbq-code-block__view-all.kbq-code-block__view-all_collapsed{background:var(--kbq-code-block-outline-collapse-collapsed-background)}.kbq-code-block.kbq-code-block_filled{background:var(--kbq-code-block-filled-container-background);border-color:var(--kbq-code-block-filled-container-border-color)}.kbq-code-block.kbq-code-block_filled .kbq-code-block__header{background:var(--kbq-code-block-filled-header-background)}.kbq-code-block.kbq-code-block_filled.kbq-code-block_hide-tabs .kbq-code-block__actionbar .kbq-code-block__actionbar__button-stack{border-color:var(--kbq-code-block-filled-actionbar-border-color);background:var(--kbq-code-block-filled-actionbar-background)}.kbq-code-block.kbq-code-block_filled .kbq-code-block__view-all .kbq-code-block__view-all__wrapper{background:var(--kbq-code-block-filled-collapse-button-expand-background);opacity:90%}.kbq-code-block.kbq-code-block_filled .kbq-code-block__view-all.kbq-code-block__view-all_expanded{background:var(--kbq-code-block-filled-collapse-expanded-background)}.kbq-code-block.kbq-code-block_filled .kbq-code-block__view-all.kbq-code-block__view-all_collapsed{background:var(--kbq-code-block-filled-collapse-collapsed-background)}.kbq-code-block .kbq-code-block__main.cdk-keyboard-focused{outline-color:var(--kbq-states-line-focus-theme)}.kbq-code-block{font-size:var(--kbq-typography-mono-codeblock-font-size);font-style:var(--kbq-typography-mono-codeblock-font-style);font-weight:var(--kbq-typography-mono-codeblock-font-weight);line-height:var(--kbq-typography-mono-codeblock-line-height);font-family:var(--kbq-typography-mono-codeblock-font-family);text-transform:var(--kbq-typography-mono-codeblock-text-transform);font-feature-settings:var(--kbq-typography-mono-codeblock-font-feature-settings);letter-spacing:var(--kbq-typography-mono-codeblock-letter-spacing)}.kbq-code-block .kbq-code-block__pre,.kbq-code-block .kbq-code-block__code{font:inherit}\n", ".kbq-code-block{--kbq-code-block-size-container-border-width: var(--kbq-size-border-width);--kbq-code-block-size-container-border-width-focused: 2px;--kbq-code-block-size-container-border-radius: var(--kbq-size-border-radius);--kbq-code-block-size-with-header-content-padding-top: var(--kbq-size-xxs);--kbq-code-block-size-with-header-content-padding-bottom: var(--kbq-size-l);--kbq-code-block-size-with-header-content-padding-horizontal: var(--kbq-size-xl);--kbq-code-block-size-with-header-content-content-gap-horizontal: var(--kbq-size-m);--kbq-code-block-size-no-header-content-padding-vertical: 14px;--kbq-code-block-size-no-header-content-padding-horizontal: var(--kbq-size-xl);--kbq-code-block-size-no-header-content-content-gap-horizontal: var(--kbq-size-m);--kbq-code-block-size-header-content-gap-horizontal: var(--kbq-size-l);--kbq-code-block-size-actionbar-content-gap-horizontal: var(--kbq-size-3xs);--kbq-code-block-size-collapse-expanded-padding-top: 0;--kbq-code-block-size-collapse-expanded-padding-bottom: var(--kbq-size-l);--kbq-code-block-size-collapse-collapsed-padding-top: var(--kbq-size-3xl);--kbq-code-block-size-collapse-collapsed-padding-bottom: var(--kbq-size-l);--kbq-code-block-font-hljs-addition-font-style: null;--kbq-code-block-font-hljs-addition-font-weight: null;--kbq-code-block-font-hljs-attr-font-style: null;--kbq-code-block-font-hljs-attr-font-weight: null;--kbq-code-block-font-hljs-attribute-font-style: null;--kbq-code-block-font-hljs-attribute-font-weight: null;--kbq-code-block-font-hljs-built-in-font-style: null;--kbq-code-block-font-hljs-built-in-font-weight: null;--kbq-code-block-font-hljs-bullet-font-style: null;--kbq-code-block-font-hljs-bullet-font-weight: null;--kbq-code-block-font-hljs-char-escape-font-style: null;--kbq-code-block-font-hljs-char-escape-font-weight: null;--kbq-code-block-font-hljs-class-font-style: null;--kbq-code-block-font-hljs-class-font-weight: null;--kbq-code-block-font-hljs-code-font-style: null;--kbq-code-block-font-hljs-code-font-weight: null;--kbq-code-block-font-hljs-comment-font-style: null;--kbq-code-block-font-hljs-comment-font-weight: null;--kbq-code-block-font-hljs-deletion-font-style: null;--kbq-code-block-font-hljs-deletion-font-weight: null;--kbq-code-block-font-hljs-doctag-font-style: null;--kbq-code-block-font-hljs-doctag-font-weight: null;--kbq-code-block-font-hljs-emphasis-font-style: null;--kbq-code-block-font-hljs-emphasis-font-weight: null;--kbq-code-block-font-hljs-formula-font-style: null;--kbq-code-block-font-hljs-formula-font-weight: null;--kbq-code-block-font-hljs-function-font-style: null;--kbq-code-block-font-hljs-function-font-weight: null;--kbq-code-block-font-hljs-keyword-font-style: null;--kbq-code-block-font-hljs-keyword-font-weight: null;--kbq-code-block-font-hljs-link-font-style: null;--kbq-code-block-font-hljs-link-font-weight: null;--kbq-code-block-font-hljs-literal-font-style: null;--kbq-code-block-font-hljs-literal-font-weight: null;--kbq-code-block-font-hljs-meta-font-style: null;--kbq-code-block-font-hljs-meta-font-weight: null;--kbq-code-block-font-hljs-meta-keyword-font-style: null;--kbq-code-block-font-hljs-meta-keyword-font-weight: null;--kbq-code-block-font-hljs-meta-string-font-style: null;--kbq-code-block-font-hljs-meta-string-font-weight: null;--kbq-code-block-font-hljs-meta-prompt-font-style: null;--kbq-code-block-font-hljs-meta-prompt-font-weight: null;--kbq-code-block-font-hljs-name-font-style: null;--kbq-code-block-font-hljs-name-font-weight: null;--kbq-code-block-font-hljs-number-font-style: null;--kbq-code-block-font-hljs-number-font-weight: null;--kbq-code-block-font-hljs-operator-font-style: null;--kbq-code-block-font-hljs-operator-font-weight: null;--kbq-code-block-font-hljs-params-font-style: null;--kbq-code-block-font-hljs-params-font-weight: null;--kbq-code-block-font-hljs-property-font-style: null;--kbq-code-block-font-hljs-property-font-weight: null;--kbq-code-block-font-hljs-punctuation-font-style: null;--kbq-code-block-font-hljs-punctuation-font-weight: null;--kbq-code-block-font-hljs-quote-font-style: null;--kbq-code-block-font-hljs-quote-font-weight: null;--kbq-code-block-font-hljs-regexp-font-style: null;--kbq-code-block-font-hljs-regexp-font-weight: null;--kbq-code-block-font-hljs-section-font-style: null;--kbq-code-block-font-hljs-section-font-weight: null;--kbq-code-block-font-hljs-selector-attr-font-style: null;--kbq-code-block-font-hljs-selector-attr-font-weight: null;--kbq-code-block-font-hljs-selector-class-font-style: null;--kbq-code-block-font-hljs-selector-class-font-weight: null;--kbq-code-block-font-hljs-selector-id-font-style: null;--kbq-code-block-font-hljs-selector-id-font-weight: null;--kbq-code-block-font-hljs-selector-pseudo-font-style: null;--kbq-code-block-font-hljs-selector-pseudo-font-weight: null;--kbq-code-block-font-hljs-selector-tag-font-style: null;--kbq-code-block-font-hljs-selector-tag-font-weight: null;--kbq-code-block-font-hljs-string-font-style: null;--kbq-code-block-font-hljs-string-font-weight: null;--kbq-code-block-font-hljs-strong-font-style: null;--kbq-code-block-font-hljs-strong-font-weight: null;--kbq-code-block-font-hljs-subst-font-style: null;--kbq-code-block-font-hljs-subst-font-weight: null;--kbq-code-block-font-hljs-symbol-font-style: null;--kbq-code-block-font-hljs-symbol-font-weight: null;--kbq-code-block-font-hljs-tag-font-style: null;--kbq-code-block-font-hljs-tag-font-weight: null;--kbq-code-block-font-hljs-template-tag-font-style: null;--kbq-code-block-font-hljs-template-tag-font-weight: null;--kbq-code-block-font-hljs-template-variable-font-style: null;--kbq-code-block-font-hljs-template-variable-font-weight: null;--kbq-code-block-font-hljs-title-font-style: null;--kbq-code-block-font-hljs-title-font-weight: null;--kbq-code-block-font-hljs-title-class-font-style: normal;--kbq-code-block-font-hljs-title-class-font-weight: 500;--kbq-code-block-font-hljs-title-class-inherited-font-style: null;--kbq-code-block-font-hljs-title-class-inherited-font-weight: null;--kbq-code-block-font-hljs-title-function-font-style: null;--kbq-code-block-font-hljs-title-function-font-weight: null;--kbq-code-block-font-hljs-title-function-invoke-font-style: null;--kbq-code-block-font-hljs-title-function-invoke-font-weight: null;--kbq-code-block-font-hljs-type-font-style: null;--kbq-code-block-font-hljs-type-font-weight: null;--kbq-code-block-font-hljs-variable-font-style: null;--kbq-code-block-font-hljs-variable-font-weight: null;--kbq-code-block-font-hljs-variable-constant-font-style: null;--kbq-code-block-font-hljs-variable-constant-font-weight: null;--kbq-code-block-font-hljs-variable-language-font-style: null;--kbq-code-block-font-hljs-variable-language-font-weight: null;--kbq-code-block-filled-container-background: var(--kbq-background-contrast-less);--kbq-code-block-filled-container-border-color: transparent;--kbq-code-block-filled-header-background: transparent;--kbq-code-block-filled-actionbar-background: var(--kbq-background-card);--kbq-code-block-filled-actionbar-border-color: var(--kbq-line-contrast-less);--kbq-code-block-filled-collapse-expanded-background: transparent;--kbq-code-block-filled-collapse-collapsed-background: linear-gradient( 180deg, transparent, var(--kbq-background-bg-secondary) 100% );--kbq-code-block-filled-collapse-button-expand-background: var(--kbq-background-bg-secondary);--kbq-code-block-outline-container-background: var(--kbq-background-card);--kbq-code-block-outline-container-border-color: var(--kbq-divider-color, var(--kbq-line-contrast-less));--kbq-code-block-outline-header-background: var(--kbq-background-card);--kbq-code-block-outline-actionbar-background: var(--kbq-background-card);--kbq-code-block-outline-actionbar-border-color: var(--kbq-line-contrast-less);--kbq-code-block-outline-collapse-expanded-background: transparent;--kbq-code-block-outline-collapse-collapsed-background: linear-gradient( 180deg, transparent, var(--kbq-background-bg) 100% );--kbq-code-block-outline-collapse-button-expand-background: var(--kbq-background-card);--kbq-code-block-hljs-addition-background: var(--kbq-plt-green-a2, var(--kbq-palette-green-95));--kbq-code-block-hljs-addition-color: var(--kbq-plt-green-a16, var(--kbq-palette-green-25));--kbq-code-block-hljs-attr-background: null;--kbq-code-block-hljs-attr-color: null;--kbq-code-block-hljs-attribute-background: null;--kbq-code-block-hljs-attribute-color: null;--kbq-code-block-hljs-built-in-background: null;--kbq-code-block-hljs-built-in-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-bullet-background: null;--kbq-code-block-hljs-bullet-color: null;--kbq-code-block-hljs-char-escape-background: null;--kbq-code-block-hljs-char-escape-color: null;--kbq-code-block-hljs-class-background: null;--kbq-code-block-hljs-class-color: null;--kbq-code-block-hljs-code-background: null;--kbq-code-block-hljs-code-color: null;--kbq-code-block-hljs-comment-background: null;--kbq-code-block-hljs-comment-color: var(--kbq-plt-slate-a16, var(--kbq-palette-grey-60));--kbq-code-block-hljs-deletion-background: var(--kbq-plt-red-a2, var(--kbq-palette-red-95));--kbq-code-block-hljs-deletion-color: var(--kbq-plt-red-a16, var(--kbq-palette-red-35));--kbq-code-block-hljs-doctag-background: null;--kbq-code-block-hljs-doctag-color: null;--kbq-code-block-hljs-emphasis-background: null;--kbq-code-block-hljs-emphasis-color: null;--kbq-code-block-hljs-formula-background: null;--kbq-code-block-hljs-formula-color: null;--kbq-code-block-hljs-function-background: null;--kbq-code-block-hljs-function-color: null;--kbq-code-block-hljs-keyword-background: null;--kbq-code-block-hljs-keyword-color: null;--kbq-code-block-hljs-line-numbers-color: var(--kbq-foreground-contrast-secondary);--kbq-code-block-hljs-link-background: null;--kbq-code-block-hljs-link-color: null;--kbq-code-block-hljs-literal-background: null;--kbq-code-block-hljs-literal-color: var(--kbq-plt-purple-a16, var(--kbq-palette-purple-30));--kbq-code-block-hljs-meta-background: null;--kbq-code-block-hljs-meta-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-meta-keyword-background: null;--kbq-code-block-hljs-meta-keyword-color: null;--kbq-code-block-hljs-meta-string-background: null;--kbq-code-block-hljs-meta-string-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-meta-prompt-background: null;--kbq-code-block-hljs-meta-prompt-color: null;--kbq-code-block-hljs-name-background: null;--kbq-code-block-hljs-name-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-number-background: null;--kbq-code-block-hljs-number-color: var(--kbq-plt-purple-a16, var(--kbq-palette-purple-30));--kbq-code-block-hljs-operator-background: null;--kbq-code-block-hljs-operator-color: null;--kbq-code-block-hljs-params-background: null;--kbq-code-block-hljs-params-color: null;--kbq-code-block-hljs-property-background: null;--kbq-code-block-hljs-property-color: null;--kbq-code-block-hljs-punctuation-background: null;--kbq-code-block-hljs-punctuation-color: null;--kbq-code-block-hljs-quote-background: null;--kbq-code-block-hljs-quote-color: null;--kbq-code-block-hljs-regexp-background: null;--kbq-code-block-hljs-regexp-color: var(--kbq-plt-green-a16, var(--kbq-palette-green-25));--kbq-code-block-hljs-section-background: null;--kbq-code-block-hljs-section-color: null;--kbq-code-block-hljs-selector-attr-background: null;--kbq-code-block-hljs-selector-attr-color: null;--kbq-code-block-hljs-selector-class-background: null;--kbq-code-block-hljs-selector-class-color: null;--kbq-code-block-hljs-selector-id-background: null;--kbq-code-block-hljs-selector-id-color: null;--kbq-code-block-hljs-selector-pseudo-background: null;--kbq-code-block-hljs-selector-pseudo-color: null;--kbq-code-block-hljs-selector-tag-background: null;--kbq-code-block-hljs-selector-tag-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-string-background: null;--kbq-code-block-hljs-string-color: var(--kbq-plt-green-a16, var(--kbq-palette-green-25));--kbq-code-block-hljs-strong-background: null;--kbq-code-block-hljs-strong-color: null;--kbq-code-block-hljs-subst-background: null;--kbq-code-block-hljs-subst-color: null;--kbq-code-block-hljs-symbol-background: null;--kbq-code-block-hljs-symbol-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-tag-background: null;--kbq-code-block-hljs-tag-color: null;--kbq-code-block-hljs-template-tag-background: null;--kbq-code-block-hljs-template-tag-color: null;--kbq-code-block-hljs-template-variable-background: null;--kbq-code-block-hljs-template-variable-color: null;--kbq-code-block-hljs-title-background: null;--kbq-code-block-hljs-title-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-title-class-background: null;--kbq-code-block-hljs-title-class-color: null;--kbq-code-block-hljs-title-class-inherited-background: null;--kbq-code-block-hljs-title-class-inherited-color: null;--kbq-code-block-hljs-title-function-background: null;--kbq-code-block-hljs-title-function-color: null;--kbq-code-block-hljs-title-function-invoke-background: null;--kbq-code-block-hljs-title-function-invoke-color: null;--kbq-code-block-hljs-type-background: null;--kbq-code-block-hljs-type-color: null;--kbq-code-block-hljs-variable-background: null;--kbq-code-block-hljs-variable-color: null;--kbq-code-block-hljs-variable-constant-background: null;--kbq-code-block-hljs-variable-constant-color: null;--kbq-code-block-hljs-variable-language-background: null;--kbq-code-block-hljs-variable-language-color: null;--kbq-code-block-tab-size: 4}.kbq-dark .kbq-code-block{--kbq-code-block-hljs-addition-background: var(--kbq-plt-dark-green-a5, var(--kbq-palette-green-95));--kbq-code-block-hljs-addition-color: var(--kbq-plt-dark-green-a14, var(--kbq-palette-green-25));--kbq-code-block-hljs-built-in-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-comment-color: var(--kbq-plt-dark-slate-a14, var(--kbq-palette-grey-60));--kbq-code-block-hljs-deletion-background: var(--kbq-plt-dark-red-a5, var(--kbq-palette-red-95));--kbq-code-block-hljs-deletion-color: var(--kbq-plt-dark-red-a14, var(--kbq-palette-red-35));--kbq-code-block-hljs-literal-color: var(--kbq-plt-dark-purple-a14, var(--kbq-palette-purple-30));--kbq-code-block-hljs-meta-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-meta-string-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-name-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-number-color: var(--kbq-plt-dark-purple-a14, var(--kbq-palette-purple-30));--kbq-code-block-hljs-regexp-color: var(--kbq-plt-dark-green-a14, var(--kbq-palette-green-25));--kbq-code-block-hljs-selector-tag-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-string-color: var(--kbq-plt-dark-green-a14, var(--kbq-palette-green-25));--kbq-code-block-hljs-symbol-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-title-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35))}\n"], dependencies: [{ kind: "ngmodule", type: KbqTabsModule }, { kind: "component", type: i1.KbqTabNavBar, selector: "[kbqTabNavBar], [kbq-tab-nav-bar]", inputs: ["transparent", "onSurface", "underlined", "tabNavPanel"], exportAs: ["kbqTabNavBar"] }, { kind: "directive", type: i1.KbqTabLink, selector: "[kbqTabLink], [kbq-tab-link]", inputs: ["id", "active", "disabled", "tabIndex"], exportAs: ["kbqTabLink"] }, { kind: "directive", type: i1.KbqTabNavPanel, selector: "[kbqTabNavPanel]", inputs: ["id"], exportAs: ["kbqTabNavPanel"] }, { kind: "ngmodule", type: KbqButtonModule }, { kind: "component", type: i2.KbqButton, selector: "[kbq-button]", inputs: ["kbqStyle", "disabled", "tabIndex"] }, { kind: "directive", type: i2.KbqButtonCssStyler, selector: "[kbq-button]" }, { kind: "directive", type: KbqCodeBlockHighlight, selector: "code[kbqCodeBlockHighlight]", inputs: ["file", "startFrom", "singleLine"], exportAs: ["kbqCodeBlockHighlight"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i3.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "ngmodule", type: CdkScrollableModule }, { kind: "directive", type: i4.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "ngmodule", type: KbqToolTipModule }, { kind: "directive", type: i5.KbqTooltipTrigger, selector: "[kbqTooltip]", inputs: ["forDisabledComponent", "ignoreTooltipPointerEvents", "hideWithTimeout", "kbqVisible", "kbqPlacement", "kbqRelativeToPointer", "kbqPlacementPriority", "kbqTooltip", "kbqTooltipDisabled", "kbqEnterDelay", "kbqLeaveDelay", "kbqTrigger", "kbqTooltipClass", "kbqTooltipContext", "kbqTooltipColor", "kbqTooltipArrow", "kbqTooltipOffset", "kbqTooltipModifier", "kbqTooltipHeader"], outputs: ["kbqPlacementChange", "kbqVisibleChange"], exportAs: ["kbqTooltip"] }, { kind: "ngmodule", type: KbqIconModule }, { kind: "component", type: i6.KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: KbqOverflowShadowContainer, selector: "[kbqOverflowShadowContainer]", inputs: ["debounce"], exportAs: ["kbqOverflowShadowContainer"] }, { kind: "directive", type: KbqOverflowShadowTop, selector: "[kbqOverflowShadowTop]", inputs: ["kbqOverflowShadowTop", "shadow"], exportAs: ["kbqOverflowShadowTop"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
891
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqCodeBlock, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
892
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.30", type: KbqCodeBlock, isStandalone: true, selector: "kbq-code-block", inputs: { lineNumbers: { classPropertyName: "lineNumbers", publicName: "lineNumbers", isSignal: true, isRequired: false, transformFunction: null }, filled: { classPropertyName: "filled", publicName: "filled", isSignal: true, isRequired: false, transformFunction: null }, canToggleSoftWrap: { classPropertyName: "canToggleSoftWrap", publicName: "canToggleSoftWrap", isSignal: true, isRequired: false, transformFunction: null }, softWrap: { classPropertyName: "softWrap", publicName: "softWrap", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, viewAll: { classPropertyName: "viewAll", publicName: "viewAll", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, canLoad: { classPropertyName: "canLoad", publicName: "canLoad", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, canDownload: { classPropertyName: "canDownload", publicName: "canDownload", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, canCopy: { classPropertyName: "canCopy", publicName: "canCopy", isSignal: true, isRequired: false, transformFunction: null }, alwaysShowActionbar: { classPropertyName: "alwaysShowActionbar", publicName: "alwaysShowActionbar", isSignal: true, isRequired: false, transformFunction: null }, codeFiles: { classPropertyName: "codeFiles", publicName: "codeFiles", isSignal: false, isRequired: false, transformFunction: null }, files: { classPropertyName: "files", publicName: "files", isSignal: false, isRequired: false, transformFunction: null }, activeFileIndex: { classPropertyName: "activeFileIndex", publicName: "activeFileIndex", isSignal: false, isRequired: false, transformFunction: numberAttribute }, noBorder: { classPropertyName: "noBorder", publicName: "noBorder", isSignal: true, isRequired: false, transformFunction: null }, hideTabs: { classPropertyName: "hideTabs", publicName: "hideTabs", isSignal: false, isRequired: false, transformFunction: booleanAttribute } }, outputs: { softWrapChange: "softWrapChange", viewAllChange: "viewAllChange", activeFileIndexChange: "activeFileIndexChange", hideTabsChange: "hideTabsChange" }, host: { attributes: { "ngSkipHydration": "true" }, properties: { "class.kbq-code-block_filled": "filled()", "class.kbq-code-block_outline": "!filled()", "class.kbq-code-block_hide-line-numbers": "!lineNumbers()", "class.kbq-code-block_hide-tabs": "hideTabs", "class.kbq-code-block_no-border": "noBorder() || filled()", "class.kbq-code-block_show-actionbar": "actionbarVisible()", "class.kbq-code-block_soft-wrap": "softWrap", "class.kbq-code-block_view-all": "viewAll" }, classAttribute: "kbq-code-block" }, queries: [{ propertyName: "tabLinkTemplate", first: true, predicate: KbqCodeBlockTabLinkContent, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "copyButtonTooltip", first: true, predicate: ["copyButtonTooltip"], descendants: true, isSignal: true }, { propertyName: "scrollableCodeContent", first: true, predicate: CdkScrollable, descendants: true, isSignal: true }, { propertyName: "highlight", first: true, predicate: KbqCodeBlockHighlight, descendants: true, isSignal: true }, { propertyName: "preElementRef", first: true, predicate: ["codeBlockPre"], descendants: true, isSignal: true }], exportAs: ["kbqCodeBlock"], ngImport: i0, template: "@let file = files[activeFileIndex];\n\n<div class=\"kbq-code-block__header\" [kbqOverflowShadowTop]=\"codeBlockContent\">\n @if (!hideTabs) {\n <div class=\"kbq-code-block__header-tabs\">\n <div kbqTabNavBar transparent [tabNavPanel]=\"tabPanel\">\n @for (file of files; track file) {\n <!-- Mark tab-link as readonly if only single file present -->\n <div\n kbqTabLink\n [active]=\"$count > 1 && activeFileIndex === $index\"\n [style.pointer-events]=\"$count === 1 ? 'none' : null\"\n (click)=\"onSelectedTabChange($index)\"\n >\n @if (tabLinkTemplate) {\n <ng-container\n *ngTemplateOutlet=\"tabLinkTemplate; context: { $implicit: file, fallbackFileName }\"\n />\n } @else {\n {{ file.filename || fallbackFileName }}\n }\n </div>\n }\n </div>\n </div>\n }\n\n <div class=\"kbq-code-block__actionbar\">\n <div class=\"kbq-code-block__actionbar__button-stack\">\n @if (canToggleSoftWrap()) {\n <button\n kbq-button\n class=\"kbq-code-block__actionbar__soft-wrap-button\"\n [color]=\"componentColor.Contrast\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n [kbqTooltip]=\"\n softWrap ? localeConfiguration.softWrapOffTooltip : localeConfiguration.softWrapOnTooltip\n \"\n (click)=\"toggleSoftWrap()\"\n >\n @if (softWrap) {\n <i kbq-icon=\"kbq-text-overflow_16\"></i>\n } @else {\n <i kbq-icon=\"kbq-text-wrap_16\"></i>\n }\n </button>\n }\n\n @if (canDownload) {\n <button\n kbq-button\n class=\"kbq-code-block__actionbar__download-button\"\n [color]=\"componentColor.Contrast\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n [kbqTooltip]=\"localeConfiguration.downloadTooltip\"\n (click)=\"downloadCode()\"\n >\n <i kbq-icon=\"kbq-arrow-down-to-line_16\"></i>\n </button>\n }\n\n @if (canCopy()) {\n <div #copyButtonTooltip=\"kbqTooltip\" [kbqTooltip]=\"localeConfiguration.copyTooltip\">\n <button\n kbq-button\n class=\"kbq-code-block__actionbar__copy-button\"\n [color]=\"componentColor.Contrast\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n (click)=\"copyCode()\"\n >\n <i kbq-icon=\"kbq-file-multiple-o_16\"></i>\n </button>\n </div>\n }\n\n @if (file.link) {\n <button\n kbq-button\n class=\"kbq-code-block__actionbar__link-button\"\n [color]=\"componentColor.Contrast\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n [kbqTooltip]=\"localeConfiguration.openExternalSystemTooltip\"\n (click)=\"openLink()\"\n >\n <i kbq-icon=\"kbq-arrow-up-right-from-square_16\"></i>\n </button>\n }\n </div>\n </div>\n</div>\n\n<div\n #tabPanel=\"kbqTabNavPanel\"\n #codeBlockContent=\"kbqOverflowShadowContainer\"\n cdkMonitorElementFocus\n cdkScrollable\n kbqOverflowShadowContainer\n kbqTabNavPanel\n class=\"kbq-code-block__main kbq-scrollbar\"\n [style.max-height.px]=\"calculatedMaxHeight\"\n [tabIndex]=\"codeContentTabIndex\"\n>\n <pre\n #codeBlockPre\n class=\"kbq-code-block__pre\"\n ><code kbqCodeBlockHighlight class=\"kbq-code-block__code\" [file]=\"file\">{{ file.content }}</code></pre>\n\n @if (contentExceedsMaxHeight()) {\n <div\n class=\"kbq-code-block__view-all\"\n [class.kbq-code-block__view-all_collapsed]=\"!viewAll\"\n [class.kbq-code-block__view-all_expanded]=\"viewAll\"\n >\n <div class=\"kbq-code-block__view-all__wrapper\">\n <button\n kbq-button\n class=\"kbq-code-block__view-all__button\"\n [color]=\"componentColor.Theme\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n (click)=\"toggleViewAll()\"\n (keydown.enter)=\"onViewAllEnterKeydown($event)\"\n >\n @if (viewAll) {\n <i kbq-icon=\"kbq-chevron-up_16\"></i>\n {{ localeConfiguration.viewLessText }}\n } @else {\n <i kbq-icon=\"kbq-chevron-down_16\"></i>\n {{ localeConfiguration.viewAllText }}\n }\n </button>\n </div>\n </div>\n }\n</div>\n", styles: [".kbq-code-block{display:flex;flex-direction:column;position:relative;border-width:var(--kbq-code-block-size-container-border-width);border-style:solid;border-radius:var(--kbq-code-block-size-container-border-radius);box-sizing:border-box;hyphens:none;-ms-hyphens:none;-moz-hyphens:none;-webkit-hyphens:none}.kbq-code-block .kbq-code-block__header{display:flex;align-items:center;padding:var(--kbq-size-s) var(--kbq-size-m)}.kbq-code-block .kbq-code-block__header .kbq-code-block__header-tabs{overflow:hidden;flex-grow:1}.kbq-code-block .kbq-code-block__actionbar{display:flex;justify-content:right;align-items:center;z-index:1}.kbq-code-block .kbq-code-block__actionbar .kbq-code-block__actionbar__button-stack{display:flex;gap:var(--kbq-code-block-size-actionbar-content-gap-horizontal)}.kbq-code-block:has(.kbq-code-block__view-all) .kbq-code-block__main .kbq-code-block__code{padding-bottom:var(--kbq-size-3xl)!important}.kbq-code-block .kbq-code-block__main{flex-grow:1;flex-direction:column;border-radius:var(--kbq-code-block-size-container-border-radius)}.kbq-code-block .kbq-code-block__main.cdk-keyboard-focused{outline-style:solid;outline-width:var(--kbq-code-block-size-container-border-width-focused);outline-offset:-1px}.kbq-code-block .kbq-code-block__main .kbq-code-block__pre{margin:0;flex-grow:1}.kbq-code-block .kbq-code-block__main .kbq-code-block__code{tab-size:var(--kbq-code-block-tab-size);padding:var(--kbq-code-block-size-with-header-content-padding-top) var(--kbq-code-block-size-with-header-content-padding-horizontal) var(--kbq-code-block-size-with-header-content-padding-bottom) var(--kbq-code-block-size-with-header-content-padding-horizontal)}.kbq-code-block .kbq-code-block__main .kbq-code-block__code:focus-visible{outline:none}.kbq-code-block .kbq-code-block__main .hljs{display:block}.kbq-code-block .kbq-code-block__main .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-with-header-content-content-gap-horizontal);vertical-align:baseline;text-align:right}.kbq-code-block .kbq-code-block__main .hljs-ln{border-collapse:unset}.kbq-code-block .kbq-code-block__main .hljs-ln .hljs{padding:0}.kbq-code-block .kbq-code-block__main .hljs-ln-n:before{white-space:nowrap}.kbq-code-block.kbq-code-block_hide-line-numbers .hljs-ln-line.hljs-ln-numbers{display:none}.kbq-code-block.kbq-code-block_soft-wrap .kbq-code-block__code{white-space:pre-wrap;overflow-wrap:anywhere}.kbq-code-block.kbq-code-block_view-all .kbq-code-block__main{max-height:unset;overflow:auto}.kbq-code-block:not(.kbq-code-block_view-all) .kbq-code-block__main{overflow:hidden}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__header{padding:0}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__actionbar{display:none;position:absolute;top:0;right:0;margin:var(--kbq-size-s) var(--kbq-size-s) var(--kbq-size-s) 0}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__actionbar .kbq-code-block__actionbar__button-stack{border-width:1px;border-style:solid;border-radius:calc(var(--kbq-size-border-radius) + 1px)}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__main{position:relative}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__main .kbq-code-block__code{padding:var(--kbq-code-block-size-no-header-content-padding-vertical) var(--kbq-code-block-size-no-header-content-padding-horizontal)}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__main .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-no-header-content-content-gap-horizontal)}.kbq-code-block:not(.kbq-code-block_hide-tabs) .kbq-code-block__header{border-radius:var(--kbq-code-block-size-container-border-radius) var(--kbq-code-block-size-container-border-radius) 0 0}.kbq-code-block:not(.kbq-code-block_hide-tabs) .kbq-code-block__main{border-radius:0 0 var(--kbq-code-block-size-container-border-radius) var(--kbq-code-block-size-container-border-radius)}.kbq-code-block.kbq-code-block_show-actionbar .kbq-code-block__actionbar{display:flex}.kbq-code-block:not(:has(.kbq-code-block__view-all)) .kbq-code-block__main{overflow:auto}.kbq-code-block .kbq-code-block__view-all{display:flex;justify-content:center;width:100%;position:absolute;bottom:calc(var(--kbq-code-block-size-container-border-width) * -1);border-radius:var(--kbq-code-block-size-container-border-radius)}.kbq-code-block .kbq-code-block__view-all .kbq-code-block__view-all__wrapper{border-radius:var(--kbq-size-border-radius)}.kbq-code-block .kbq-code-block__view-all.kbq-code-block__view-all_collapsed{padding-top:var(--kbq-code-block-size-collapse-collapsed-padding-top);padding-bottom:var(--kbq-code-block-size-collapse-collapsed-padding-bottom)}.kbq-code-block .kbq-code-block__view-all.kbq-code-block__view-all_expanded{padding-top:var(--kbq-code-block-size-collapse-expanded-padding-top);margin-bottom:var(--kbq-code-block-size-collapse-expanded-padding-bottom)}.kbq-code-block.kbq-code-block_no-border{border-color:transparent!important}.kbq-code-block .hljs-addition{background-color:var(--kbq-code-block-hljs-addition-background);color:var(--kbq-code-block-hljs-addition-color)}.kbq-code-block .hljs-attr{background-color:var(--kbq-code-block-hljs-attr-background);color:var(--kbq-code-block-hljs-attr-color)}.kbq-code-block .hljs-attribute{background-color:var(--kbq-code-block-hljs-attribute-background);color:var(--kbq-code-block-hljs-attribute-color)}.kbq-code-block .hljs-built_in{background-color:var(--kbq-code-block-hljs-built-in-background);color:var(--kbq-code-block-hljs-built-in-color)}.kbq-code-block .hljs-bullet{background-color:var(--kbq-code-block-hljs-bullet-background);color:var(--kbq-code-block-hljs-bullet-color)}.kbq-code-block .hljs-char-escape{background-color:var(--kbq-code-block-hljs-char-escape-background);color:var(--kbq-code-block-hljs-char-escape-color)}.kbq-code-block .hljs-class{background-color:var(--kbq-code-block-hljs-class-background);color:var(--kbq-code-block-hljs-class-color)}.kbq-code-block .hljs-code{background-color:var(--kbq-code-block-hljs-code-background);color:var(--kbq-code-block-hljs-code-color)}.kbq-code-block .hljs-comment{background-color:var(--kbq-code-block-hljs-comment-background);color:var(--kbq-code-block-hljs-comment-color)}.kbq-code-block .hljs-deletion{background-color:var(--kbq-code-block-hljs-deletion-background);color:var(--kbq-code-block-hljs-deletion-color)}.kbq-code-block .hljs-doctag{background-color:var(--kbq-code-block-hljs-doctag-background);color:var(--kbq-code-block-hljs-doctag-color)}.kbq-code-block .hljs-emphasis{background-color:var(--kbq-code-block-hljs-emphasis-background);color:var(--kbq-code-block-hljs-emphasis-color)}.kbq-code-block .hljs-formula{background-color:var(--kbq-code-block-hljs-formula-background);color:var(--kbq-code-block-hljs-formula-color)}.kbq-code-block .hljs-function{background-color:var(--kbq-code-block-hljs-function-background);color:var(--kbq-code-block-hljs-function-color)}.kbq-code-block .hljs-keyword{background-color:var(--kbq-code-block-hljs-keyword-background);color:var(--kbq-code-block-hljs-keyword-color)}.kbq-code-block .hljs-link{background-color:var(--kbq-code-block-hljs-link-background);color:var(--kbq-code-block-hljs-link-color)}.kbq-code-block .hljs-literal{background-color:var(--kbq-code-block-hljs-literal-background);color:var(--kbq-code-block-hljs-literal-color)}.kbq-code-block .hljs-meta{background-color:var(--kbq-code-block-hljs-meta-background);color:var(--kbq-code-block-hljs-meta-color)}.kbq-code-block .hljs-meta-keyword{background-color:var(--kbq-code-block-hljs-meta-keyword-background);color:var(--kbq-code-block-hljs-meta-keyword-color)}.kbq-code-block .hljs-meta-string{background-color:var(--kbq-code-block-hljs-meta-string-background);color:var(--kbq-code-block-hljs-meta-string-color)}.kbq-code-block .hljs-meta-prompt{background-color:var(--kbq-code-block-hljs-meta-prompt-background);color:var(--kbq-code-block-hljs-meta-prompt-color)}.kbq-code-block .hljs-name{background-color:var(--kbq-code-block-hljs-name-background);color:var(--kbq-code-block-hljs-name-color)}.kbq-code-block .hljs-number{background-color:var(--kbq-code-block-hljs-number-background);color:var(--kbq-code-block-hljs-number-color)}.kbq-code-block .hljs-operator{background-color:var(--kbq-code-block-hljs-operator-background);color:var(--kbq-code-block-hljs-operator-color)}.kbq-code-block .hljs-params{background-color:var(--kbq-code-block-hljs-params-background);color:var(--kbq-code-block-hljs-params-color)}.kbq-code-block .hljs-property{background-color:var(--kbq-code-block-hljs-property-background);color:var(--kbq-code-block-hljs-property-color)}.kbq-code-block .hljs-punctuation{background-color:var(--kbq-code-block-hljs-punctuation-background);color:var(--kbq-code-block-hljs-punctuation-color)}.kbq-code-block .hljs-quote{background-color:var(--kbq-code-block-hljs-quote-background);color:var(--kbq-code-block-hljs-quote-color)}.kbq-code-block .hljs-regexp{background-color:var(--kbq-code-block-hljs-regexp-background);color:var(--kbq-code-block-hljs-regexp-color)}.kbq-code-block .hljs-section{background-color:var(--kbq-code-block-hljs-section-background);color:var(--kbq-code-block-hljs-section-color)}.kbq-code-block .hljs-selector-attr{background-color:var(--kbq-code-block-hljs-selector-attr-background);color:var(--kbq-code-block-hljs-selector-attr-color)}.kbq-code-block .hljs-selector-class{background-color:var(--kbq-code-block-hljs-selector-class-background);color:var(--kbq-code-block-hljs-selector-class-color)}.kbq-code-block .hljs-selector-id{background-color:var(--kbq-code-block-hljs-selector-id-background);color:var(--kbq-code-block-hljs-selector-id-color)}.kbq-code-block .hljs-selector-pseudo{background-color:var(--kbq-code-block-hljs-selector-pseudo-background);color:var(--kbq-code-block-hljs-selector-pseudo-color)}.kbq-code-block .hljs-selector-tag{background-color:var(--kbq-code-block-hljs-selector-tag-background);color:var(--kbq-code-block-hljs-selector-tag-color)}.kbq-code-block .hljs-string{background-color:var(--kbq-code-block-hljs-string-background);color:var(--kbq-code-block-hljs-string-color)}.kbq-code-block .hljs-strong{background-color:var(--kbq-code-block-hljs-strong-background);color:var(--kbq-code-block-hljs-strong-color)}.kbq-code-block .hljs-subst{background-color:var(--kbq-code-block-hljs-subst-background);color:var(--kbq-code-block-hljs-subst-color)}.kbq-code-block .hljs-symbol{background-color:var(--kbq-code-block-hljs-symbol-background);color:var(--kbq-code-block-hljs-symbol-color)}.kbq-code-block .hljs-tag{background-color:var(--kbq-code-block-hljs-tag-background);color:var(--kbq-code-block-hljs-tag-color)}.kbq-code-block .hljs-template-tag{background-color:var(--kbq-code-block-hljs-template-tag-background);color:var(--kbq-code-block-hljs-template-tag-color)}.kbq-code-block .hljs-template-variable{background-color:var(--kbq-code-block-hljs-template-variable-background);color:var(--kbq-code-block-hljs-template-variable-color)}.kbq-code-block .hljs-title{background-color:var(--kbq-code-block-hljs-title-background);color:var(--kbq-code-block-hljs-title-color)}.kbq-code-block .hljs-title-class{background-color:var(--kbq-code-block-hljs-title-class-background);color:var(--kbq-code-block-hljs-title-class-color)}.kbq-code-block .hljs-title-class-inherited{background-color:var(--kbq-code-block-hljs-title-class-inherited-background);color:var(--kbq-code-block-hljs-title-class-inherited-color)}.kbq-code-block .hljs-title-function{background-color:var(--kbq-code-block-hljs-title-function-background);color:var(--kbq-code-block-hljs-title-function-color)}.kbq-code-block .hljs-title-function-invoke{background-color:var(--kbq-code-block-hljs-title-function-invoke-background);color:var(--kbq-code-block-hljs-title-function-invoke-color)}.kbq-code-block .hljs-type{background-color:var(--kbq-code-block-hljs-type-background);color:var(--kbq-code-block-hljs-type-color)}.kbq-code-block .hljs-variable{background-color:var(--kbq-code-block-hljs-variable-background);color:var(--kbq-code-block-hljs-variable-color)}.kbq-code-block .hljs-variable-constant{background-color:var(--kbq-code-block-hljs-variable-constant-background);color:var(--kbq-code-block-hljs-variable-constant-color)}.kbq-code-block .hljs-variable-language{background-color:var(--kbq-code-block-hljs-variable-language-background);color:var(--kbq-code-block-hljs-variable-language-color)}.kbq-code-block .hljs-ln-n{color:var(--kbq-code-block-hljs-line-numbers-color)}.kbq-code-block.kbq-code-block_outline{background:var(--kbq-code-block-outline-container-background);border-color:var(--kbq-code-block-outline-container-border-color)}.kbq-code-block.kbq-code-block_outline .kbq-code-block__header{background:var(--kbq-code-block-outline-header-background)}.kbq-code-block.kbq-code-block_outline.kbq-code-block_hide-tabs .kbq-code-block__actionbar .kbq-code-block__actionbar__button-stack{border-color:var(--kbq-code-block-outline-actionbar-border-color);background:var(--kbq-code-block-outline-actionbar-background)}.kbq-code-block.kbq-code-block_outline .kbq-code-block__view-all .kbq-code-block__view-all__wrapper{background:var(--kbq-code-block-outline-collapse-button-expand-background);opacity:90%}.kbq-code-block.kbq-code-block_outline .kbq-code-block__view-all.kbq-code-block__view-all_expanded{background:var(--kbq-code-block-outline-collapse-expanded-background)}.kbq-code-block.kbq-code-block_outline .kbq-code-block__view-all.kbq-code-block__view-all_collapsed{background:var(--kbq-code-block-outline-collapse-collapsed-background)}.kbq-code-block.kbq-code-block_filled{background:var(--kbq-code-block-filled-container-background);border-color:var(--kbq-code-block-filled-container-border-color)}.kbq-code-block.kbq-code-block_filled .kbq-code-block__header{background:var(--kbq-code-block-filled-header-background)}.kbq-code-block.kbq-code-block_filled.kbq-code-block_hide-tabs .kbq-code-block__actionbar .kbq-code-block__actionbar__button-stack{border-color:var(--kbq-code-block-filled-actionbar-border-color);background:var(--kbq-code-block-filled-actionbar-background)}.kbq-code-block.kbq-code-block_filled .kbq-code-block__view-all .kbq-code-block__view-all__wrapper{background:var(--kbq-code-block-filled-collapse-button-expand-background);opacity:90%}.kbq-code-block.kbq-code-block_filled .kbq-code-block__view-all.kbq-code-block__view-all_expanded{background:var(--kbq-code-block-filled-collapse-expanded-background)}.kbq-code-block.kbq-code-block_filled .kbq-code-block__view-all.kbq-code-block__view-all_collapsed{background:var(--kbq-code-block-filled-collapse-collapsed-background)}.kbq-code-block .kbq-code-block__main.cdk-keyboard-focused{outline-color:var(--kbq-states-line-focus-theme)}.kbq-code-block{font-size:var(--kbq-typography-mono-codeblock-font-size);font-style:var(--kbq-typography-mono-codeblock-font-style);font-weight:var(--kbq-typography-mono-codeblock-font-weight);line-height:var(--kbq-typography-mono-codeblock-line-height);font-family:var(--kbq-typography-mono-codeblock-font-family);text-transform:var(--kbq-typography-mono-codeblock-text-transform);font-feature-settings:var(--kbq-typography-mono-codeblock-font-feature-settings);letter-spacing:var(--kbq-typography-mono-codeblock-letter-spacing)}.kbq-code-block .kbq-code-block__pre,.kbq-code-block .kbq-code-block__code{font:inherit}\n", ".kbq-code-block{--kbq-code-block-size-container-border-width: var(--kbq-size-border-width);--kbq-code-block-size-container-border-width-focused: 2px;--kbq-code-block-size-container-border-radius: var(--kbq-size-border-radius);--kbq-code-block-size-with-header-content-padding-top: var(--kbq-size-xxs);--kbq-code-block-size-with-header-content-padding-bottom: var(--kbq-size-l);--kbq-code-block-size-with-header-content-padding-horizontal: var(--kbq-size-xl);--kbq-code-block-size-with-header-content-content-gap-horizontal: var(--kbq-size-m);--kbq-code-block-size-no-header-content-padding-vertical: 14px;--kbq-code-block-size-no-header-content-padding-horizontal: var(--kbq-size-xl);--kbq-code-block-size-no-header-content-content-gap-horizontal: var(--kbq-size-m);--kbq-code-block-size-header-content-gap-horizontal: var(--kbq-size-l);--kbq-code-block-size-actionbar-content-gap-horizontal: var(--kbq-size-3xs);--kbq-code-block-size-collapse-expanded-padding-top: 0;--kbq-code-block-size-collapse-expanded-padding-bottom: var(--kbq-size-l);--kbq-code-block-size-collapse-collapsed-padding-top: var(--kbq-size-3xl);--kbq-code-block-size-collapse-collapsed-padding-bottom: var(--kbq-size-l);--kbq-code-block-font-hljs-addition-font-style: null;--kbq-code-block-font-hljs-addition-font-weight: null;--kbq-code-block-font-hljs-attr-font-style: null;--kbq-code-block-font-hljs-attr-font-weight: null;--kbq-code-block-font-hljs-attribute-font-style: null;--kbq-code-block-font-hljs-attribute-font-weight: null;--kbq-code-block-font-hljs-built-in-font-style: null;--kbq-code-block-font-hljs-built-in-font-weight: null;--kbq-code-block-font-hljs-bullet-font-style: null;--kbq-code-block-font-hljs-bullet-font-weight: null;--kbq-code-block-font-hljs-char-escape-font-style: null;--kbq-code-block-font-hljs-char-escape-font-weight: null;--kbq-code-block-font-hljs-class-font-style: null;--kbq-code-block-font-hljs-class-font-weight: null;--kbq-code-block-font-hljs-code-font-style: null;--kbq-code-block-font-hljs-code-font-weight: null;--kbq-code-block-font-hljs-comment-font-style: null;--kbq-code-block-font-hljs-comment-font-weight: null;--kbq-code-block-font-hljs-deletion-font-style: null;--kbq-code-block-font-hljs-deletion-font-weight: null;--kbq-code-block-font-hljs-doctag-font-style: null;--kbq-code-block-font-hljs-doctag-font-weight: null;--kbq-code-block-font-hljs-emphasis-font-style: null;--kbq-code-block-font-hljs-emphasis-font-weight: null;--kbq-code-block-font-hljs-formula-font-style: null;--kbq-code-block-font-hljs-formula-font-weight: null;--kbq-code-block-font-hljs-function-font-style: null;--kbq-code-block-font-hljs-function-font-weight: null;--kbq-code-block-font-hljs-keyword-font-style: null;--kbq-code-block-font-hljs-keyword-font-weight: null;--kbq-code-block-font-hljs-link-font-style: null;--kbq-code-block-font-hljs-link-font-weight: null;--kbq-code-block-font-hljs-literal-font-style: null;--kbq-code-block-font-hljs-literal-font-weight: null;--kbq-code-block-font-hljs-meta-font-style: null;--kbq-code-block-font-hljs-meta-font-weight: null;--kbq-code-block-font-hljs-meta-keyword-font-style: null;--kbq-code-block-font-hljs-meta-keyword-font-weight: null;--kbq-code-block-font-hljs-meta-string-font-style: null;--kbq-code-block-font-hljs-meta-string-font-weight: null;--kbq-code-block-font-hljs-meta-prompt-font-style: null;--kbq-code-block-font-hljs-meta-prompt-font-weight: null;--kbq-code-block-font-hljs-name-font-style: null;--kbq-code-block-font-hljs-name-font-weight: null;--kbq-code-block-font-hljs-number-font-style: null;--kbq-code-block-font-hljs-number-font-weight: null;--kbq-code-block-font-hljs-operator-font-style: null;--kbq-code-block-font-hljs-operator-font-weight: null;--kbq-code-block-font-hljs-params-font-style: null;--kbq-code-block-font-hljs-params-font-weight: null;--kbq-code-block-font-hljs-property-font-style: null;--kbq-code-block-font-hljs-property-font-weight: null;--kbq-code-block-font-hljs-punctuation-font-style: null;--kbq-code-block-font-hljs-punctuation-font-weight: null;--kbq-code-block-font-hljs-quote-font-style: null;--kbq-code-block-font-hljs-quote-font-weight: null;--kbq-code-block-font-hljs-regexp-font-style: null;--kbq-code-block-font-hljs-regexp-font-weight: null;--kbq-code-block-font-hljs-section-font-style: null;--kbq-code-block-font-hljs-section-font-weight: null;--kbq-code-block-font-hljs-selector-attr-font-style: null;--kbq-code-block-font-hljs-selector-attr-font-weight: null;--kbq-code-block-font-hljs-selector-class-font-style: null;--kbq-code-block-font-hljs-selector-class-font-weight: null;--kbq-code-block-font-hljs-selector-id-font-style: null;--kbq-code-block-font-hljs-selector-id-font-weight: null;--kbq-code-block-font-hljs-selector-pseudo-font-style: null;--kbq-code-block-font-hljs-selector-pseudo-font-weight: null;--kbq-code-block-font-hljs-selector-tag-font-style: null;--kbq-code-block-font-hljs-selector-tag-font-weight: null;--kbq-code-block-font-hljs-string-font-style: null;--kbq-code-block-font-hljs-string-font-weight: null;--kbq-code-block-font-hljs-strong-font-style: null;--kbq-code-block-font-hljs-strong-font-weight: null;--kbq-code-block-font-hljs-subst-font-style: null;--kbq-code-block-font-hljs-subst-font-weight: null;--kbq-code-block-font-hljs-symbol-font-style: null;--kbq-code-block-font-hljs-symbol-font-weight: null;--kbq-code-block-font-hljs-tag-font-style: null;--kbq-code-block-font-hljs-tag-font-weight: null;--kbq-code-block-font-hljs-template-tag-font-style: null;--kbq-code-block-font-hljs-template-tag-font-weight: null;--kbq-code-block-font-hljs-template-variable-font-style: null;--kbq-code-block-font-hljs-template-variable-font-weight: null;--kbq-code-block-font-hljs-title-font-style: null;--kbq-code-block-font-hljs-title-font-weight: null;--kbq-code-block-font-hljs-title-class-font-style: normal;--kbq-code-block-font-hljs-title-class-font-weight: 500;--kbq-code-block-font-hljs-title-class-inherited-font-style: null;--kbq-code-block-font-hljs-title-class-inherited-font-weight: null;--kbq-code-block-font-hljs-title-function-font-style: null;--kbq-code-block-font-hljs-title-function-font-weight: null;--kbq-code-block-font-hljs-title-function-invoke-font-style: null;--kbq-code-block-font-hljs-title-function-invoke-font-weight: null;--kbq-code-block-font-hljs-type-font-style: null;--kbq-code-block-font-hljs-type-font-weight: null;--kbq-code-block-font-hljs-variable-font-style: null;--kbq-code-block-font-hljs-variable-font-weight: null;--kbq-code-block-font-hljs-variable-constant-font-style: null;--kbq-code-block-font-hljs-variable-constant-font-weight: null;--kbq-code-block-font-hljs-variable-language-font-style: null;--kbq-code-block-font-hljs-variable-language-font-weight: null;--kbq-code-block-filled-container-background: var(--kbq-background-contrast-less);--kbq-code-block-filled-container-border-color: transparent;--kbq-code-block-filled-header-background: transparent;--kbq-code-block-filled-actionbar-background: var(--kbq-background-card);--kbq-code-block-filled-actionbar-border-color: var(--kbq-line-contrast-less);--kbq-code-block-filled-collapse-expanded-background: transparent;--kbq-code-block-filled-collapse-collapsed-background: linear-gradient( 180deg, transparent, var(--kbq-background-bg-secondary) 100% );--kbq-code-block-filled-collapse-button-expand-background: var(--kbq-background-bg-secondary);--kbq-code-block-outline-container-background: var(--kbq-background-card);--kbq-code-block-outline-container-border-color: var(--kbq-divider-color, var(--kbq-line-contrast-less));--kbq-code-block-outline-header-background: var(--kbq-background-card);--kbq-code-block-outline-actionbar-background: var(--kbq-background-card);--kbq-code-block-outline-actionbar-border-color: var(--kbq-line-contrast-less);--kbq-code-block-outline-collapse-expanded-background: transparent;--kbq-code-block-outline-collapse-collapsed-background: linear-gradient( 180deg, transparent, var(--kbq-background-bg) 100% );--kbq-code-block-outline-collapse-button-expand-background: var(--kbq-background-card);--kbq-code-block-hljs-addition-background: var(--kbq-plt-green-a2, var(--kbq-palette-green-95));--kbq-code-block-hljs-addition-color: var(--kbq-plt-green-a16, var(--kbq-palette-green-25));--kbq-code-block-hljs-attr-background: null;--kbq-code-block-hljs-attr-color: null;--kbq-code-block-hljs-attribute-background: null;--kbq-code-block-hljs-attribute-color: null;--kbq-code-block-hljs-built-in-background: null;--kbq-code-block-hljs-built-in-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-bullet-background: null;--kbq-code-block-hljs-bullet-color: null;--kbq-code-block-hljs-char-escape-background: null;--kbq-code-block-hljs-char-escape-color: null;--kbq-code-block-hljs-class-background: null;--kbq-code-block-hljs-class-color: null;--kbq-code-block-hljs-code-background: null;--kbq-code-block-hljs-code-color: null;--kbq-code-block-hljs-comment-background: null;--kbq-code-block-hljs-comment-color: var(--kbq-plt-slate-a16, var(--kbq-palette-grey-60));--kbq-code-block-hljs-deletion-background: var(--kbq-plt-red-a2, var(--kbq-palette-red-95));--kbq-code-block-hljs-deletion-color: var(--kbq-plt-red-a16, var(--kbq-palette-red-35));--kbq-code-block-hljs-doctag-background: null;--kbq-code-block-hljs-doctag-color: null;--kbq-code-block-hljs-emphasis-background: null;--kbq-code-block-hljs-emphasis-color: null;--kbq-code-block-hljs-formula-background: null;--kbq-code-block-hljs-formula-color: null;--kbq-code-block-hljs-function-background: null;--kbq-code-block-hljs-function-color: null;--kbq-code-block-hljs-keyword-background: null;--kbq-code-block-hljs-keyword-color: null;--kbq-code-block-hljs-line-numbers-color: var(--kbq-foreground-contrast-secondary);--kbq-code-block-hljs-link-background: null;--kbq-code-block-hljs-link-color: null;--kbq-code-block-hljs-literal-background: null;--kbq-code-block-hljs-literal-color: var(--kbq-plt-purple-a16, var(--kbq-palette-purple-30));--kbq-code-block-hljs-meta-background: null;--kbq-code-block-hljs-meta-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-meta-keyword-background: null;--kbq-code-block-hljs-meta-keyword-color: null;--kbq-code-block-hljs-meta-string-background: null;--kbq-code-block-hljs-meta-string-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-meta-prompt-background: null;--kbq-code-block-hljs-meta-prompt-color: null;--kbq-code-block-hljs-name-background: null;--kbq-code-block-hljs-name-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-number-background: null;--kbq-code-block-hljs-number-color: var(--kbq-plt-purple-a16, var(--kbq-palette-purple-30));--kbq-code-block-hljs-operator-background: null;--kbq-code-block-hljs-operator-color: null;--kbq-code-block-hljs-params-background: null;--kbq-code-block-hljs-params-color: null;--kbq-code-block-hljs-property-background: null;--kbq-code-block-hljs-property-color: null;--kbq-code-block-hljs-punctuation-background: null;--kbq-code-block-hljs-punctuation-color: null;--kbq-code-block-hljs-quote-background: null;--kbq-code-block-hljs-quote-color: null;--kbq-code-block-hljs-regexp-background: null;--kbq-code-block-hljs-regexp-color: var(--kbq-plt-green-a16, var(--kbq-palette-green-25));--kbq-code-block-hljs-section-background: null;--kbq-code-block-hljs-section-color: null;--kbq-code-block-hljs-selector-attr-background: null;--kbq-code-block-hljs-selector-attr-color: null;--kbq-code-block-hljs-selector-class-background: null;--kbq-code-block-hljs-selector-class-color: null;--kbq-code-block-hljs-selector-id-background: null;--kbq-code-block-hljs-selector-id-color: null;--kbq-code-block-hljs-selector-pseudo-background: null;--kbq-code-block-hljs-selector-pseudo-color: null;--kbq-code-block-hljs-selector-tag-background: null;--kbq-code-block-hljs-selector-tag-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-string-background: null;--kbq-code-block-hljs-string-color: var(--kbq-plt-green-a16, var(--kbq-palette-green-25));--kbq-code-block-hljs-strong-background: null;--kbq-code-block-hljs-strong-color: null;--kbq-code-block-hljs-subst-background: null;--kbq-code-block-hljs-subst-color: null;--kbq-code-block-hljs-symbol-background: null;--kbq-code-block-hljs-symbol-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-tag-background: null;--kbq-code-block-hljs-tag-color: null;--kbq-code-block-hljs-template-tag-background: null;--kbq-code-block-hljs-template-tag-color: null;--kbq-code-block-hljs-template-variable-background: null;--kbq-code-block-hljs-template-variable-color: null;--kbq-code-block-hljs-title-background: null;--kbq-code-block-hljs-title-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-title-class-background: null;--kbq-code-block-hljs-title-class-color: null;--kbq-code-block-hljs-title-class-inherited-background: null;--kbq-code-block-hljs-title-class-inherited-color: null;--kbq-code-block-hljs-title-function-background: null;--kbq-code-block-hljs-title-function-color: null;--kbq-code-block-hljs-title-function-invoke-background: null;--kbq-code-block-hljs-title-function-invoke-color: null;--kbq-code-block-hljs-type-background: null;--kbq-code-block-hljs-type-color: null;--kbq-code-block-hljs-variable-background: null;--kbq-code-block-hljs-variable-color: null;--kbq-code-block-hljs-variable-constant-background: null;--kbq-code-block-hljs-variable-constant-color: null;--kbq-code-block-hljs-variable-language-background: null;--kbq-code-block-hljs-variable-language-color: null;--kbq-code-block-tab-size: 4}.kbq-dark .kbq-code-block{--kbq-code-block-hljs-addition-background: var(--kbq-plt-dark-green-a5, var(--kbq-palette-green-95));--kbq-code-block-hljs-addition-color: var(--kbq-plt-dark-green-a14, var(--kbq-palette-green-25));--kbq-code-block-hljs-built-in-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-comment-color: var(--kbq-plt-dark-slate-a14, var(--kbq-palette-grey-60));--kbq-code-block-hljs-deletion-background: var(--kbq-plt-dark-red-a5, var(--kbq-palette-red-95));--kbq-code-block-hljs-deletion-color: var(--kbq-plt-dark-red-a14, var(--kbq-palette-red-35));--kbq-code-block-hljs-literal-color: var(--kbq-plt-dark-purple-a14, var(--kbq-palette-purple-30));--kbq-code-block-hljs-meta-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-meta-string-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-name-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-number-color: var(--kbq-plt-dark-purple-a14, var(--kbq-palette-purple-30));--kbq-code-block-hljs-regexp-color: var(--kbq-plt-dark-green-a14, var(--kbq-palette-green-25));--kbq-code-block-hljs-selector-tag-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-string-color: var(--kbq-plt-dark-green-a14, var(--kbq-palette-green-25));--kbq-code-block-hljs-symbol-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-title-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35))}\n"], dependencies: [{ kind: "ngmodule", type: KbqTabsModule }, { kind: "component", type: i1.KbqTabNavBar, selector: "[kbqTabNavBar], [kbq-tab-nav-bar]", inputs: ["transparent", "onSurface", "underlined", "tabNavPanel"], exportAs: ["kbqTabNavBar"] }, { kind: "directive", type: i1.KbqTabLink, selector: "[kbqTabLink], [kbq-tab-link]", inputs: ["id", "active", "disabled", "tabIndex"], exportAs: ["kbqTabLink"] }, { kind: "directive", type: i1.KbqTabNavPanel, selector: "[kbqTabNavPanel]", inputs: ["id"], exportAs: ["kbqTabNavPanel"] }, { kind: "ngmodule", type: KbqButtonModule }, { kind: "component", type: i2.KbqButton, selector: "[kbq-button]", inputs: ["kbqStyle", "disabled", "tabIndex"] }, { kind: "directive", type: i2.KbqButtonCssStyler, selector: "[kbq-button]" }, { kind: "directive", type: KbqCodeBlockHighlight, selector: "code[kbqCodeBlockHighlight]", inputs: ["file", "startFrom", "singleLine"], exportAs: ["kbqCodeBlockHighlight"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i3.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "ngmodule", type: CdkScrollableModule }, { kind: "directive", type: i4.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "ngmodule", type: KbqToolTipModule }, { kind: "directive", type: i5.KbqTooltipTrigger, selector: "[kbqTooltip]", inputs: ["kbqTooltipScrollStrategy", "forDisabledComponent", "ignoreTooltipPointerEvents", "kbqTooltipSingleInstance", "hideWithTimeout", "kbqVisible", "kbqPlacement", "kbqRelativeToPointer", "kbqPlacementPriority", "kbqTooltip", "kbqTooltipDisabled", "kbqEnterDelay", "kbqLeaveDelay", "kbqTrigger", "kbqTooltipClass", "kbqTooltipContext", "kbqTooltipColor", "kbqTooltipArrow", "kbqTooltipOffset", "kbqTooltipModifier", "kbqTooltipHeader"], outputs: ["kbqPlacementChange", "kbqVisibleChange"], exportAs: ["kbqTooltip"] }, { kind: "ngmodule", type: KbqIconModule }, { kind: "component", type: i6.KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: KbqOverflowShadowContainer, selector: "[kbqOverflowShadowContainer]", inputs: ["debounce"], exportAs: ["kbqOverflowShadowContainer"] }, { kind: "directive", type: KbqOverflowShadowTop, selector: "[kbqOverflowShadowTop]", inputs: ["kbqOverflowShadowTop", "shadow"], exportAs: ["kbqOverflowShadowTop"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
907
893
  }
908
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqCodeBlock, decorators: [{
894
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqCodeBlock, decorators: [{
909
895
  type: Component,
910
896
  args: [{ selector: 'kbq-code-block', imports: [
911
897
  KbqTabsModule,
@@ -928,6 +914,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
928
914
  '[class.kbq-code-block_hide-line-numbers]': '!lineNumbers()',
929
915
  '[class.kbq-code-block_hide-tabs]': 'hideTabs',
930
916
  '[class.kbq-code-block_no-border]': 'noBorder() || filled()',
917
+ '[class.kbq-code-block_show-actionbar]': 'actionbarVisible()',
931
918
  '[class.kbq-code-block_soft-wrap]': 'softWrap',
932
919
  '[class.kbq-code-block_view-all]': 'viewAll'
933
920
  }, exportAs: 'kbqCodeBlock', template: "@let file = files[activeFileIndex];\n\n<div class=\"kbq-code-block__header\" [kbqOverflowShadowTop]=\"codeBlockContent\">\n @if (!hideTabs) {\n <div class=\"kbq-code-block__header-tabs\">\n <div kbqTabNavBar transparent [tabNavPanel]=\"tabPanel\">\n @for (file of files; track file) {\n <!-- Mark tab-link as readonly if only single file present -->\n <div\n kbqTabLink\n [active]=\"$count > 1 && activeFileIndex === $index\"\n [style.pointer-events]=\"$count === 1 ? 'none' : null\"\n (click)=\"onSelectedTabChange($index)\"\n >\n @if (tabLinkTemplate) {\n <ng-container\n *ngTemplateOutlet=\"tabLinkTemplate; context: { $implicit: file, fallbackFileName }\"\n />\n } @else {\n {{ file.filename || fallbackFileName }}\n }\n </div>\n }\n </div>\n </div>\n }\n\n <div class=\"kbq-code-block__actionbar\">\n <div class=\"kbq-code-block__actionbar__button-stack\">\n @if (canToggleSoftWrap()) {\n <button\n kbq-button\n class=\"kbq-code-block__actionbar__soft-wrap-button\"\n [color]=\"componentColor.Contrast\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n [kbqTooltip]=\"\n softWrap ? localeConfiguration.softWrapOffTooltip : localeConfiguration.softWrapOnTooltip\n \"\n (click)=\"toggleSoftWrap()\"\n >\n @if (softWrap) {\n <i kbq-icon=\"kbq-text-overflow_16\"></i>\n } @else {\n <i kbq-icon=\"kbq-text-wrap_16\"></i>\n }\n </button>\n }\n\n @if (canDownload) {\n <button\n kbq-button\n class=\"kbq-code-block__actionbar__download-button\"\n [color]=\"componentColor.Contrast\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n [kbqTooltip]=\"localeConfiguration.downloadTooltip\"\n (click)=\"downloadCode()\"\n >\n <i kbq-icon=\"kbq-arrow-down-to-line_16\"></i>\n </button>\n }\n\n @if (canCopy()) {\n <div #copyButtonTooltip=\"kbqTooltip\" [kbqTooltip]=\"localeConfiguration.copyTooltip\">\n <button\n kbq-button\n class=\"kbq-code-block__actionbar__copy-button\"\n [color]=\"componentColor.Contrast\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n (click)=\"copyCode()\"\n >\n <i kbq-icon=\"kbq-file-multiple-o_16\"></i>\n </button>\n </div>\n }\n\n @if (file.link) {\n <button\n kbq-button\n class=\"kbq-code-block__actionbar__link-button\"\n [color]=\"componentColor.Contrast\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n [kbqTooltip]=\"localeConfiguration.openExternalSystemTooltip\"\n (click)=\"openLink()\"\n >\n <i kbq-icon=\"kbq-arrow-up-right-from-square_16\"></i>\n </button>\n }\n </div>\n </div>\n</div>\n\n<div\n #tabPanel=\"kbqTabNavPanel\"\n #codeBlockContent=\"kbqOverflowShadowContainer\"\n cdkMonitorElementFocus\n cdkScrollable\n kbqOverflowShadowContainer\n kbqTabNavPanel\n class=\"kbq-code-block__main kbq-scrollbar\"\n [style.max-height.px]=\"calculatedMaxHeight\"\n [tabIndex]=\"codeContentTabIndex\"\n>\n <pre\n #codeBlockPre\n class=\"kbq-code-block__pre\"\n ><code kbqCodeBlockHighlight class=\"kbq-code-block__code\" [file]=\"file\">{{ file.content }}</code></pre>\n\n @if (contentExceedsMaxHeight()) {\n <div\n class=\"kbq-code-block__view-all\"\n [class.kbq-code-block__view-all_collapsed]=\"!viewAll\"\n [class.kbq-code-block__view-all_expanded]=\"viewAll\"\n >\n <div class=\"kbq-code-block__view-all__wrapper\">\n <button\n kbq-button\n class=\"kbq-code-block__view-all__button\"\n [color]=\"componentColor.Theme\"\n [kbqStyle]=\"buttonStyle.Transparent\"\n (click)=\"toggleViewAll()\"\n (keydown.enter)=\"onViewAllEnterKeydown($event)\"\n >\n @if (viewAll) {\n <i kbq-icon=\"kbq-chevron-up_16\"></i>\n {{ localeConfiguration.viewLessText }}\n } @else {\n <i kbq-icon=\"kbq-chevron-down_16\"></i>\n {{ localeConfiguration.viewAllText }}\n }\n </button>\n </div>\n </div>\n }\n</div>\n", styles: [".kbq-code-block{display:flex;flex-direction:column;position:relative;border-width:var(--kbq-code-block-size-container-border-width);border-style:solid;border-radius:var(--kbq-code-block-size-container-border-radius);box-sizing:border-box;hyphens:none;-ms-hyphens:none;-moz-hyphens:none;-webkit-hyphens:none}.kbq-code-block .kbq-code-block__header{display:flex;align-items:center;padding:var(--kbq-size-s) var(--kbq-size-m)}.kbq-code-block .kbq-code-block__header .kbq-code-block__header-tabs{overflow:hidden;flex-grow:1}.kbq-code-block .kbq-code-block__actionbar{display:flex;justify-content:right;align-items:center;z-index:1}.kbq-code-block .kbq-code-block__actionbar .kbq-code-block__actionbar__button-stack{display:flex;gap:var(--kbq-code-block-size-actionbar-content-gap-horizontal)}.kbq-code-block:has(.kbq-code-block__view-all) .kbq-code-block__main .kbq-code-block__code{padding-bottom:var(--kbq-size-3xl)!important}.kbq-code-block .kbq-code-block__main{flex-grow:1;flex-direction:column;border-radius:var(--kbq-code-block-size-container-border-radius)}.kbq-code-block .kbq-code-block__main.cdk-keyboard-focused{outline-style:solid;outline-width:var(--kbq-code-block-size-container-border-width-focused);outline-offset:-1px}.kbq-code-block .kbq-code-block__main .kbq-code-block__pre{margin:0;flex-grow:1}.kbq-code-block .kbq-code-block__main .kbq-code-block__code{tab-size:var(--kbq-code-block-tab-size);padding:var(--kbq-code-block-size-with-header-content-padding-top) var(--kbq-code-block-size-with-header-content-padding-horizontal) var(--kbq-code-block-size-with-header-content-padding-bottom) var(--kbq-code-block-size-with-header-content-padding-horizontal)}.kbq-code-block .kbq-code-block__main .kbq-code-block__code:focus-visible{outline:none}.kbq-code-block .kbq-code-block__main .hljs{display:block}.kbq-code-block .kbq-code-block__main .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-with-header-content-content-gap-horizontal);vertical-align:baseline;text-align:right}.kbq-code-block .kbq-code-block__main .hljs-ln{border-collapse:unset}.kbq-code-block .kbq-code-block__main .hljs-ln .hljs{padding:0}.kbq-code-block .kbq-code-block__main .hljs-ln-n:before{white-space:nowrap}.kbq-code-block.kbq-code-block_hide-line-numbers .hljs-ln-line.hljs-ln-numbers{display:none}.kbq-code-block.kbq-code-block_soft-wrap .kbq-code-block__code{white-space:pre-wrap;overflow-wrap:anywhere}.kbq-code-block.kbq-code-block_view-all .kbq-code-block__main{max-height:unset;overflow:auto}.kbq-code-block:not(.kbq-code-block_view-all) .kbq-code-block__main{overflow:hidden}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__header{padding:0}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__actionbar{display:none;position:absolute;top:0;right:0;margin:var(--kbq-size-s) var(--kbq-size-s) var(--kbq-size-s) 0}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__actionbar .kbq-code-block__actionbar__button-stack{border-width:1px;border-style:solid;border-radius:calc(var(--kbq-size-border-radius) + 1px)}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__main{position:relative}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__main .kbq-code-block__code{padding:var(--kbq-code-block-size-no-header-content-padding-vertical) var(--kbq-code-block-size-no-header-content-padding-horizontal)}.kbq-code-block.kbq-code-block_hide-tabs .kbq-code-block__main .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-no-header-content-content-gap-horizontal)}.kbq-code-block:not(.kbq-code-block_hide-tabs) .kbq-code-block__header{border-radius:var(--kbq-code-block-size-container-border-radius) var(--kbq-code-block-size-container-border-radius) 0 0}.kbq-code-block:not(.kbq-code-block_hide-tabs) .kbq-code-block__main{border-radius:0 0 var(--kbq-code-block-size-container-border-radius) var(--kbq-code-block-size-container-border-radius)}.kbq-code-block.kbq-code-block_show-actionbar .kbq-code-block__actionbar{display:flex}.kbq-code-block:not(:has(.kbq-code-block__view-all)) .kbq-code-block__main{overflow:auto}.kbq-code-block .kbq-code-block__view-all{display:flex;justify-content:center;width:100%;position:absolute;bottom:calc(var(--kbq-code-block-size-container-border-width) * -1);border-radius:var(--kbq-code-block-size-container-border-radius)}.kbq-code-block .kbq-code-block__view-all .kbq-code-block__view-all__wrapper{border-radius:var(--kbq-size-border-radius)}.kbq-code-block .kbq-code-block__view-all.kbq-code-block__view-all_collapsed{padding-top:var(--kbq-code-block-size-collapse-collapsed-padding-top);padding-bottom:var(--kbq-code-block-size-collapse-collapsed-padding-bottom)}.kbq-code-block .kbq-code-block__view-all.kbq-code-block__view-all_expanded{padding-top:var(--kbq-code-block-size-collapse-expanded-padding-top);margin-bottom:var(--kbq-code-block-size-collapse-expanded-padding-bottom)}.kbq-code-block.kbq-code-block_no-border{border-color:transparent!important}.kbq-code-block .hljs-addition{background-color:var(--kbq-code-block-hljs-addition-background);color:var(--kbq-code-block-hljs-addition-color)}.kbq-code-block .hljs-attr{background-color:var(--kbq-code-block-hljs-attr-background);color:var(--kbq-code-block-hljs-attr-color)}.kbq-code-block .hljs-attribute{background-color:var(--kbq-code-block-hljs-attribute-background);color:var(--kbq-code-block-hljs-attribute-color)}.kbq-code-block .hljs-built_in{background-color:var(--kbq-code-block-hljs-built-in-background);color:var(--kbq-code-block-hljs-built-in-color)}.kbq-code-block .hljs-bullet{background-color:var(--kbq-code-block-hljs-bullet-background);color:var(--kbq-code-block-hljs-bullet-color)}.kbq-code-block .hljs-char-escape{background-color:var(--kbq-code-block-hljs-char-escape-background);color:var(--kbq-code-block-hljs-char-escape-color)}.kbq-code-block .hljs-class{background-color:var(--kbq-code-block-hljs-class-background);color:var(--kbq-code-block-hljs-class-color)}.kbq-code-block .hljs-code{background-color:var(--kbq-code-block-hljs-code-background);color:var(--kbq-code-block-hljs-code-color)}.kbq-code-block .hljs-comment{background-color:var(--kbq-code-block-hljs-comment-background);color:var(--kbq-code-block-hljs-comment-color)}.kbq-code-block .hljs-deletion{background-color:var(--kbq-code-block-hljs-deletion-background);color:var(--kbq-code-block-hljs-deletion-color)}.kbq-code-block .hljs-doctag{background-color:var(--kbq-code-block-hljs-doctag-background);color:var(--kbq-code-block-hljs-doctag-color)}.kbq-code-block .hljs-emphasis{background-color:var(--kbq-code-block-hljs-emphasis-background);color:var(--kbq-code-block-hljs-emphasis-color)}.kbq-code-block .hljs-formula{background-color:var(--kbq-code-block-hljs-formula-background);color:var(--kbq-code-block-hljs-formula-color)}.kbq-code-block .hljs-function{background-color:var(--kbq-code-block-hljs-function-background);color:var(--kbq-code-block-hljs-function-color)}.kbq-code-block .hljs-keyword{background-color:var(--kbq-code-block-hljs-keyword-background);color:var(--kbq-code-block-hljs-keyword-color)}.kbq-code-block .hljs-link{background-color:var(--kbq-code-block-hljs-link-background);color:var(--kbq-code-block-hljs-link-color)}.kbq-code-block .hljs-literal{background-color:var(--kbq-code-block-hljs-literal-background);color:var(--kbq-code-block-hljs-literal-color)}.kbq-code-block .hljs-meta{background-color:var(--kbq-code-block-hljs-meta-background);color:var(--kbq-code-block-hljs-meta-color)}.kbq-code-block .hljs-meta-keyword{background-color:var(--kbq-code-block-hljs-meta-keyword-background);color:var(--kbq-code-block-hljs-meta-keyword-color)}.kbq-code-block .hljs-meta-string{background-color:var(--kbq-code-block-hljs-meta-string-background);color:var(--kbq-code-block-hljs-meta-string-color)}.kbq-code-block .hljs-meta-prompt{background-color:var(--kbq-code-block-hljs-meta-prompt-background);color:var(--kbq-code-block-hljs-meta-prompt-color)}.kbq-code-block .hljs-name{background-color:var(--kbq-code-block-hljs-name-background);color:var(--kbq-code-block-hljs-name-color)}.kbq-code-block .hljs-number{background-color:var(--kbq-code-block-hljs-number-background);color:var(--kbq-code-block-hljs-number-color)}.kbq-code-block .hljs-operator{background-color:var(--kbq-code-block-hljs-operator-background);color:var(--kbq-code-block-hljs-operator-color)}.kbq-code-block .hljs-params{background-color:var(--kbq-code-block-hljs-params-background);color:var(--kbq-code-block-hljs-params-color)}.kbq-code-block .hljs-property{background-color:var(--kbq-code-block-hljs-property-background);color:var(--kbq-code-block-hljs-property-color)}.kbq-code-block .hljs-punctuation{background-color:var(--kbq-code-block-hljs-punctuation-background);color:var(--kbq-code-block-hljs-punctuation-color)}.kbq-code-block .hljs-quote{background-color:var(--kbq-code-block-hljs-quote-background);color:var(--kbq-code-block-hljs-quote-color)}.kbq-code-block .hljs-regexp{background-color:var(--kbq-code-block-hljs-regexp-background);color:var(--kbq-code-block-hljs-regexp-color)}.kbq-code-block .hljs-section{background-color:var(--kbq-code-block-hljs-section-background);color:var(--kbq-code-block-hljs-section-color)}.kbq-code-block .hljs-selector-attr{background-color:var(--kbq-code-block-hljs-selector-attr-background);color:var(--kbq-code-block-hljs-selector-attr-color)}.kbq-code-block .hljs-selector-class{background-color:var(--kbq-code-block-hljs-selector-class-background);color:var(--kbq-code-block-hljs-selector-class-color)}.kbq-code-block .hljs-selector-id{background-color:var(--kbq-code-block-hljs-selector-id-background);color:var(--kbq-code-block-hljs-selector-id-color)}.kbq-code-block .hljs-selector-pseudo{background-color:var(--kbq-code-block-hljs-selector-pseudo-background);color:var(--kbq-code-block-hljs-selector-pseudo-color)}.kbq-code-block .hljs-selector-tag{background-color:var(--kbq-code-block-hljs-selector-tag-background);color:var(--kbq-code-block-hljs-selector-tag-color)}.kbq-code-block .hljs-string{background-color:var(--kbq-code-block-hljs-string-background);color:var(--kbq-code-block-hljs-string-color)}.kbq-code-block .hljs-strong{background-color:var(--kbq-code-block-hljs-strong-background);color:var(--kbq-code-block-hljs-strong-color)}.kbq-code-block .hljs-subst{background-color:var(--kbq-code-block-hljs-subst-background);color:var(--kbq-code-block-hljs-subst-color)}.kbq-code-block .hljs-symbol{background-color:var(--kbq-code-block-hljs-symbol-background);color:var(--kbq-code-block-hljs-symbol-color)}.kbq-code-block .hljs-tag{background-color:var(--kbq-code-block-hljs-tag-background);color:var(--kbq-code-block-hljs-tag-color)}.kbq-code-block .hljs-template-tag{background-color:var(--kbq-code-block-hljs-template-tag-background);color:var(--kbq-code-block-hljs-template-tag-color)}.kbq-code-block .hljs-template-variable{background-color:var(--kbq-code-block-hljs-template-variable-background);color:var(--kbq-code-block-hljs-template-variable-color)}.kbq-code-block .hljs-title{background-color:var(--kbq-code-block-hljs-title-background);color:var(--kbq-code-block-hljs-title-color)}.kbq-code-block .hljs-title-class{background-color:var(--kbq-code-block-hljs-title-class-background);color:var(--kbq-code-block-hljs-title-class-color)}.kbq-code-block .hljs-title-class-inherited{background-color:var(--kbq-code-block-hljs-title-class-inherited-background);color:var(--kbq-code-block-hljs-title-class-inherited-color)}.kbq-code-block .hljs-title-function{background-color:var(--kbq-code-block-hljs-title-function-background);color:var(--kbq-code-block-hljs-title-function-color)}.kbq-code-block .hljs-title-function-invoke{background-color:var(--kbq-code-block-hljs-title-function-invoke-background);color:var(--kbq-code-block-hljs-title-function-invoke-color)}.kbq-code-block .hljs-type{background-color:var(--kbq-code-block-hljs-type-background);color:var(--kbq-code-block-hljs-type-color)}.kbq-code-block .hljs-variable{background-color:var(--kbq-code-block-hljs-variable-background);color:var(--kbq-code-block-hljs-variable-color)}.kbq-code-block .hljs-variable-constant{background-color:var(--kbq-code-block-hljs-variable-constant-background);color:var(--kbq-code-block-hljs-variable-constant-color)}.kbq-code-block .hljs-variable-language{background-color:var(--kbq-code-block-hljs-variable-language-background);color:var(--kbq-code-block-hljs-variable-language-color)}.kbq-code-block .hljs-ln-n{color:var(--kbq-code-block-hljs-line-numbers-color)}.kbq-code-block.kbq-code-block_outline{background:var(--kbq-code-block-outline-container-background);border-color:var(--kbq-code-block-outline-container-border-color)}.kbq-code-block.kbq-code-block_outline .kbq-code-block__header{background:var(--kbq-code-block-outline-header-background)}.kbq-code-block.kbq-code-block_outline.kbq-code-block_hide-tabs .kbq-code-block__actionbar .kbq-code-block__actionbar__button-stack{border-color:var(--kbq-code-block-outline-actionbar-border-color);background:var(--kbq-code-block-outline-actionbar-background)}.kbq-code-block.kbq-code-block_outline .kbq-code-block__view-all .kbq-code-block__view-all__wrapper{background:var(--kbq-code-block-outline-collapse-button-expand-background);opacity:90%}.kbq-code-block.kbq-code-block_outline .kbq-code-block__view-all.kbq-code-block__view-all_expanded{background:var(--kbq-code-block-outline-collapse-expanded-background)}.kbq-code-block.kbq-code-block_outline .kbq-code-block__view-all.kbq-code-block__view-all_collapsed{background:var(--kbq-code-block-outline-collapse-collapsed-background)}.kbq-code-block.kbq-code-block_filled{background:var(--kbq-code-block-filled-container-background);border-color:var(--kbq-code-block-filled-container-border-color)}.kbq-code-block.kbq-code-block_filled .kbq-code-block__header{background:var(--kbq-code-block-filled-header-background)}.kbq-code-block.kbq-code-block_filled.kbq-code-block_hide-tabs .kbq-code-block__actionbar .kbq-code-block__actionbar__button-stack{border-color:var(--kbq-code-block-filled-actionbar-border-color);background:var(--kbq-code-block-filled-actionbar-background)}.kbq-code-block.kbq-code-block_filled .kbq-code-block__view-all .kbq-code-block__view-all__wrapper{background:var(--kbq-code-block-filled-collapse-button-expand-background);opacity:90%}.kbq-code-block.kbq-code-block_filled .kbq-code-block__view-all.kbq-code-block__view-all_expanded{background:var(--kbq-code-block-filled-collapse-expanded-background)}.kbq-code-block.kbq-code-block_filled .kbq-code-block__view-all.kbq-code-block__view-all_collapsed{background:var(--kbq-code-block-filled-collapse-collapsed-background)}.kbq-code-block .kbq-code-block__main.cdk-keyboard-focused{outline-color:var(--kbq-states-line-focus-theme)}.kbq-code-block{font-size:var(--kbq-typography-mono-codeblock-font-size);font-style:var(--kbq-typography-mono-codeblock-font-style);font-weight:var(--kbq-typography-mono-codeblock-font-weight);line-height:var(--kbq-typography-mono-codeblock-line-height);font-family:var(--kbq-typography-mono-codeblock-font-family);text-transform:var(--kbq-typography-mono-codeblock-text-transform);font-feature-settings:var(--kbq-typography-mono-codeblock-font-feature-settings);letter-spacing:var(--kbq-typography-mono-codeblock-letter-spacing)}.kbq-code-block .kbq-code-block__pre,.kbq-code-block .kbq-code-block__code{font:inherit}\n", ".kbq-code-block{--kbq-code-block-size-container-border-width: var(--kbq-size-border-width);--kbq-code-block-size-container-border-width-focused: 2px;--kbq-code-block-size-container-border-radius: var(--kbq-size-border-radius);--kbq-code-block-size-with-header-content-padding-top: var(--kbq-size-xxs);--kbq-code-block-size-with-header-content-padding-bottom: var(--kbq-size-l);--kbq-code-block-size-with-header-content-padding-horizontal: var(--kbq-size-xl);--kbq-code-block-size-with-header-content-content-gap-horizontal: var(--kbq-size-m);--kbq-code-block-size-no-header-content-padding-vertical: 14px;--kbq-code-block-size-no-header-content-padding-horizontal: var(--kbq-size-xl);--kbq-code-block-size-no-header-content-content-gap-horizontal: var(--kbq-size-m);--kbq-code-block-size-header-content-gap-horizontal: var(--kbq-size-l);--kbq-code-block-size-actionbar-content-gap-horizontal: var(--kbq-size-3xs);--kbq-code-block-size-collapse-expanded-padding-top: 0;--kbq-code-block-size-collapse-expanded-padding-bottom: var(--kbq-size-l);--kbq-code-block-size-collapse-collapsed-padding-top: var(--kbq-size-3xl);--kbq-code-block-size-collapse-collapsed-padding-bottom: var(--kbq-size-l);--kbq-code-block-font-hljs-addition-font-style: null;--kbq-code-block-font-hljs-addition-font-weight: null;--kbq-code-block-font-hljs-attr-font-style: null;--kbq-code-block-font-hljs-attr-font-weight: null;--kbq-code-block-font-hljs-attribute-font-style: null;--kbq-code-block-font-hljs-attribute-font-weight: null;--kbq-code-block-font-hljs-built-in-font-style: null;--kbq-code-block-font-hljs-built-in-font-weight: null;--kbq-code-block-font-hljs-bullet-font-style: null;--kbq-code-block-font-hljs-bullet-font-weight: null;--kbq-code-block-font-hljs-char-escape-font-style: null;--kbq-code-block-font-hljs-char-escape-font-weight: null;--kbq-code-block-font-hljs-class-font-style: null;--kbq-code-block-font-hljs-class-font-weight: null;--kbq-code-block-font-hljs-code-font-style: null;--kbq-code-block-font-hljs-code-font-weight: null;--kbq-code-block-font-hljs-comment-font-style: null;--kbq-code-block-font-hljs-comment-font-weight: null;--kbq-code-block-font-hljs-deletion-font-style: null;--kbq-code-block-font-hljs-deletion-font-weight: null;--kbq-code-block-font-hljs-doctag-font-style: null;--kbq-code-block-font-hljs-doctag-font-weight: null;--kbq-code-block-font-hljs-emphasis-font-style: null;--kbq-code-block-font-hljs-emphasis-font-weight: null;--kbq-code-block-font-hljs-formula-font-style: null;--kbq-code-block-font-hljs-formula-font-weight: null;--kbq-code-block-font-hljs-function-font-style: null;--kbq-code-block-font-hljs-function-font-weight: null;--kbq-code-block-font-hljs-keyword-font-style: null;--kbq-code-block-font-hljs-keyword-font-weight: null;--kbq-code-block-font-hljs-link-font-style: null;--kbq-code-block-font-hljs-link-font-weight: null;--kbq-code-block-font-hljs-literal-font-style: null;--kbq-code-block-font-hljs-literal-font-weight: null;--kbq-code-block-font-hljs-meta-font-style: null;--kbq-code-block-font-hljs-meta-font-weight: null;--kbq-code-block-font-hljs-meta-keyword-font-style: null;--kbq-code-block-font-hljs-meta-keyword-font-weight: null;--kbq-code-block-font-hljs-meta-string-font-style: null;--kbq-code-block-font-hljs-meta-string-font-weight: null;--kbq-code-block-font-hljs-meta-prompt-font-style: null;--kbq-code-block-font-hljs-meta-prompt-font-weight: null;--kbq-code-block-font-hljs-name-font-style: null;--kbq-code-block-font-hljs-name-font-weight: null;--kbq-code-block-font-hljs-number-font-style: null;--kbq-code-block-font-hljs-number-font-weight: null;--kbq-code-block-font-hljs-operator-font-style: null;--kbq-code-block-font-hljs-operator-font-weight: null;--kbq-code-block-font-hljs-params-font-style: null;--kbq-code-block-font-hljs-params-font-weight: null;--kbq-code-block-font-hljs-property-font-style: null;--kbq-code-block-font-hljs-property-font-weight: null;--kbq-code-block-font-hljs-punctuation-font-style: null;--kbq-code-block-font-hljs-punctuation-font-weight: null;--kbq-code-block-font-hljs-quote-font-style: null;--kbq-code-block-font-hljs-quote-font-weight: null;--kbq-code-block-font-hljs-regexp-font-style: null;--kbq-code-block-font-hljs-regexp-font-weight: null;--kbq-code-block-font-hljs-section-font-style: null;--kbq-code-block-font-hljs-section-font-weight: null;--kbq-code-block-font-hljs-selector-attr-font-style: null;--kbq-code-block-font-hljs-selector-attr-font-weight: null;--kbq-code-block-font-hljs-selector-class-font-style: null;--kbq-code-block-font-hljs-selector-class-font-weight: null;--kbq-code-block-font-hljs-selector-id-font-style: null;--kbq-code-block-font-hljs-selector-id-font-weight: null;--kbq-code-block-font-hljs-selector-pseudo-font-style: null;--kbq-code-block-font-hljs-selector-pseudo-font-weight: null;--kbq-code-block-font-hljs-selector-tag-font-style: null;--kbq-code-block-font-hljs-selector-tag-font-weight: null;--kbq-code-block-font-hljs-string-font-style: null;--kbq-code-block-font-hljs-string-font-weight: null;--kbq-code-block-font-hljs-strong-font-style: null;--kbq-code-block-font-hljs-strong-font-weight: null;--kbq-code-block-font-hljs-subst-font-style: null;--kbq-code-block-font-hljs-subst-font-weight: null;--kbq-code-block-font-hljs-symbol-font-style: null;--kbq-code-block-font-hljs-symbol-font-weight: null;--kbq-code-block-font-hljs-tag-font-style: null;--kbq-code-block-font-hljs-tag-font-weight: null;--kbq-code-block-font-hljs-template-tag-font-style: null;--kbq-code-block-font-hljs-template-tag-font-weight: null;--kbq-code-block-font-hljs-template-variable-font-style: null;--kbq-code-block-font-hljs-template-variable-font-weight: null;--kbq-code-block-font-hljs-title-font-style: null;--kbq-code-block-font-hljs-title-font-weight: null;--kbq-code-block-font-hljs-title-class-font-style: normal;--kbq-code-block-font-hljs-title-class-font-weight: 500;--kbq-code-block-font-hljs-title-class-inherited-font-style: null;--kbq-code-block-font-hljs-title-class-inherited-font-weight: null;--kbq-code-block-font-hljs-title-function-font-style: null;--kbq-code-block-font-hljs-title-function-font-weight: null;--kbq-code-block-font-hljs-title-function-invoke-font-style: null;--kbq-code-block-font-hljs-title-function-invoke-font-weight: null;--kbq-code-block-font-hljs-type-font-style: null;--kbq-code-block-font-hljs-type-font-weight: null;--kbq-code-block-font-hljs-variable-font-style: null;--kbq-code-block-font-hljs-variable-font-weight: null;--kbq-code-block-font-hljs-variable-constant-font-style: null;--kbq-code-block-font-hljs-variable-constant-font-weight: null;--kbq-code-block-font-hljs-variable-language-font-style: null;--kbq-code-block-font-hljs-variable-language-font-weight: null;--kbq-code-block-filled-container-background: var(--kbq-background-contrast-less);--kbq-code-block-filled-container-border-color: transparent;--kbq-code-block-filled-header-background: transparent;--kbq-code-block-filled-actionbar-background: var(--kbq-background-card);--kbq-code-block-filled-actionbar-border-color: var(--kbq-line-contrast-less);--kbq-code-block-filled-collapse-expanded-background: transparent;--kbq-code-block-filled-collapse-collapsed-background: linear-gradient( 180deg, transparent, var(--kbq-background-bg-secondary) 100% );--kbq-code-block-filled-collapse-button-expand-background: var(--kbq-background-bg-secondary);--kbq-code-block-outline-container-background: var(--kbq-background-card);--kbq-code-block-outline-container-border-color: var(--kbq-divider-color, var(--kbq-line-contrast-less));--kbq-code-block-outline-header-background: var(--kbq-background-card);--kbq-code-block-outline-actionbar-background: var(--kbq-background-card);--kbq-code-block-outline-actionbar-border-color: var(--kbq-line-contrast-less);--kbq-code-block-outline-collapse-expanded-background: transparent;--kbq-code-block-outline-collapse-collapsed-background: linear-gradient( 180deg, transparent, var(--kbq-background-bg) 100% );--kbq-code-block-outline-collapse-button-expand-background: var(--kbq-background-card);--kbq-code-block-hljs-addition-background: var(--kbq-plt-green-a2, var(--kbq-palette-green-95));--kbq-code-block-hljs-addition-color: var(--kbq-plt-green-a16, var(--kbq-palette-green-25));--kbq-code-block-hljs-attr-background: null;--kbq-code-block-hljs-attr-color: null;--kbq-code-block-hljs-attribute-background: null;--kbq-code-block-hljs-attribute-color: null;--kbq-code-block-hljs-built-in-background: null;--kbq-code-block-hljs-built-in-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-bullet-background: null;--kbq-code-block-hljs-bullet-color: null;--kbq-code-block-hljs-char-escape-background: null;--kbq-code-block-hljs-char-escape-color: null;--kbq-code-block-hljs-class-background: null;--kbq-code-block-hljs-class-color: null;--kbq-code-block-hljs-code-background: null;--kbq-code-block-hljs-code-color: null;--kbq-code-block-hljs-comment-background: null;--kbq-code-block-hljs-comment-color: var(--kbq-plt-slate-a16, var(--kbq-palette-grey-60));--kbq-code-block-hljs-deletion-background: var(--kbq-plt-red-a2, var(--kbq-palette-red-95));--kbq-code-block-hljs-deletion-color: var(--kbq-plt-red-a16, var(--kbq-palette-red-35));--kbq-code-block-hljs-doctag-background: null;--kbq-code-block-hljs-doctag-color: null;--kbq-code-block-hljs-emphasis-background: null;--kbq-code-block-hljs-emphasis-color: null;--kbq-code-block-hljs-formula-background: null;--kbq-code-block-hljs-formula-color: null;--kbq-code-block-hljs-function-background: null;--kbq-code-block-hljs-function-color: null;--kbq-code-block-hljs-keyword-background: null;--kbq-code-block-hljs-keyword-color: null;--kbq-code-block-hljs-line-numbers-color: var(--kbq-foreground-contrast-secondary);--kbq-code-block-hljs-link-background: null;--kbq-code-block-hljs-link-color: null;--kbq-code-block-hljs-literal-background: null;--kbq-code-block-hljs-literal-color: var(--kbq-plt-purple-a16, var(--kbq-palette-purple-30));--kbq-code-block-hljs-meta-background: null;--kbq-code-block-hljs-meta-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-meta-keyword-background: null;--kbq-code-block-hljs-meta-keyword-color: null;--kbq-code-block-hljs-meta-string-background: null;--kbq-code-block-hljs-meta-string-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-meta-prompt-background: null;--kbq-code-block-hljs-meta-prompt-color: null;--kbq-code-block-hljs-name-background: null;--kbq-code-block-hljs-name-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-number-background: null;--kbq-code-block-hljs-number-color: var(--kbq-plt-purple-a16, var(--kbq-palette-purple-30));--kbq-code-block-hljs-operator-background: null;--kbq-code-block-hljs-operator-color: null;--kbq-code-block-hljs-params-background: null;--kbq-code-block-hljs-params-color: null;--kbq-code-block-hljs-property-background: null;--kbq-code-block-hljs-property-color: null;--kbq-code-block-hljs-punctuation-background: null;--kbq-code-block-hljs-punctuation-color: null;--kbq-code-block-hljs-quote-background: null;--kbq-code-block-hljs-quote-color: null;--kbq-code-block-hljs-regexp-background: null;--kbq-code-block-hljs-regexp-color: var(--kbq-plt-green-a16, var(--kbq-palette-green-25));--kbq-code-block-hljs-section-background: null;--kbq-code-block-hljs-section-color: null;--kbq-code-block-hljs-selector-attr-background: null;--kbq-code-block-hljs-selector-attr-color: null;--kbq-code-block-hljs-selector-class-background: null;--kbq-code-block-hljs-selector-class-color: null;--kbq-code-block-hljs-selector-id-background: null;--kbq-code-block-hljs-selector-id-color: null;--kbq-code-block-hljs-selector-pseudo-background: null;--kbq-code-block-hljs-selector-pseudo-color: null;--kbq-code-block-hljs-selector-tag-background: null;--kbq-code-block-hljs-selector-tag-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-string-background: null;--kbq-code-block-hljs-string-color: var(--kbq-plt-green-a16, var(--kbq-palette-green-25));--kbq-code-block-hljs-strong-background: null;--kbq-code-block-hljs-strong-color: null;--kbq-code-block-hljs-subst-background: null;--kbq-code-block-hljs-subst-color: null;--kbq-code-block-hljs-symbol-background: null;--kbq-code-block-hljs-symbol-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-tag-background: null;--kbq-code-block-hljs-tag-color: null;--kbq-code-block-hljs-template-tag-background: null;--kbq-code-block-hljs-template-tag-color: null;--kbq-code-block-hljs-template-variable-background: null;--kbq-code-block-hljs-template-variable-color: null;--kbq-code-block-hljs-title-background: null;--kbq-code-block-hljs-title-color: var(--kbq-plt-blue-a16, var(--kbq-palette-blue-35));--kbq-code-block-hljs-title-class-background: null;--kbq-code-block-hljs-title-class-color: null;--kbq-code-block-hljs-title-class-inherited-background: null;--kbq-code-block-hljs-title-class-inherited-color: null;--kbq-code-block-hljs-title-function-background: null;--kbq-code-block-hljs-title-function-color: null;--kbq-code-block-hljs-title-function-invoke-background: null;--kbq-code-block-hljs-title-function-invoke-color: null;--kbq-code-block-hljs-type-background: null;--kbq-code-block-hljs-type-color: null;--kbq-code-block-hljs-variable-background: null;--kbq-code-block-hljs-variable-color: null;--kbq-code-block-hljs-variable-constant-background: null;--kbq-code-block-hljs-variable-constant-color: null;--kbq-code-block-hljs-variable-language-background: null;--kbq-code-block-hljs-variable-language-color: null;--kbq-code-block-tab-size: 4}.kbq-dark .kbq-code-block{--kbq-code-block-hljs-addition-background: var(--kbq-plt-dark-green-a5, var(--kbq-palette-green-95));--kbq-code-block-hljs-addition-color: var(--kbq-plt-dark-green-a14, var(--kbq-palette-green-25));--kbq-code-block-hljs-built-in-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-comment-color: var(--kbq-plt-dark-slate-a14, var(--kbq-palette-grey-60));--kbq-code-block-hljs-deletion-background: var(--kbq-plt-dark-red-a5, var(--kbq-palette-red-95));--kbq-code-block-hljs-deletion-color: var(--kbq-plt-dark-red-a14, var(--kbq-palette-red-35));--kbq-code-block-hljs-literal-color: var(--kbq-plt-dark-purple-a14, var(--kbq-palette-purple-30));--kbq-code-block-hljs-meta-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-meta-string-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-name-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-number-color: var(--kbq-plt-dark-purple-a14, var(--kbq-palette-purple-30));--kbq-code-block-hljs-regexp-color: var(--kbq-plt-dark-green-a14, var(--kbq-palette-green-25));--kbq-code-block-hljs-selector-tag-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-string-color: var(--kbq-plt-dark-green-a14, var(--kbq-palette-green-25));--kbq-code-block-hljs-symbol-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35));--kbq-code-block-hljs-title-color: var(--kbq-plt-dark-blue-a14, var(--kbq-palette-blue-35))}\n"] }]
@@ -946,7 +933,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
946
933
  }], canDownload: [{
947
934
  type: Input,
948
935
  args: [{ transform: booleanAttribute }]
949
- }], canCopy: [{ type: i0.Input, args: [{ isSignal: true, alias: "canCopy", required: false }] }], codeFiles: [{
936
+ }], canCopy: [{ type: i0.Input, args: [{ isSignal: true, alias: "canCopy", required: false }] }], alwaysShowActionbar: [{ type: i0.Input, args: [{ isSignal: true, alias: "alwaysShowActionbar", required: false }] }], codeFiles: [{
950
937
  type: Input
951
938
  }], files: [{
952
939
  type: Input
@@ -963,13 +950,13 @@ const COMPONENTS = [
963
950
  KbqCodeBlockTabLinkContent
964
951
  ];
965
952
  class KbqCodeBlockModule {
966
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqCodeBlockModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
967
- /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: KbqCodeBlockModule, imports: [KbqCodeBlock,
953
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqCodeBlockModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
954
+ /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.30", ngImport: i0, type: KbqCodeBlockModule, imports: [KbqCodeBlock,
968
955
  KbqCodeBlockTabLinkContent], exports: [KbqCodeBlock,
969
956
  KbqCodeBlockTabLinkContent] }); }
970
- /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqCodeBlockModule, imports: [KbqCodeBlock] }); }
957
+ /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqCodeBlockModule, imports: [KbqCodeBlock] }); }
971
958
  }
972
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqCodeBlockModule, decorators: [{
959
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqCodeBlockModule, decorators: [{
973
960
  type: NgModule,
974
961
  args: [{
975
962
  imports: COMPONENTS,
@@ -981,5 +968,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
981
968
  * Generated bundle index. Do not edit.
982
969
  */
983
970
 
984
- export { KBQ_CODE_BLOCK_FALLBACK_FILE_LANGUAGE, KBQ_CODE_BLOCK_FALLBACK_FILE_NAME, KBQ_CODE_BLOCK_HIGHLIGHT_JS_CONFIG, KBQ_CODE_BLOCK_LOCALE_CONFIGURATION, KbqCodeBlock, KbqCodeBlockHighlight, KbqCodeBlockModule, KbqCodeBlockTabLinkContent, kbqCodeBlockFallbackFileLanguageProvider, kbqCodeBlockFallbackFileNameProvider, kbqCodeBlockHighlightJsConfigProvider, kbqCodeBlockLocaleConfigurationProvider };
971
+ export { KBQ_CODE_BLOCK_DEFAULT_OPTIONS, KBQ_CODE_BLOCK_FALLBACK_FILE_LANGUAGE, KBQ_CODE_BLOCK_FALLBACK_FILE_NAME, KBQ_CODE_BLOCK_HIGHLIGHT_JS_CONFIG, KBQ_CODE_BLOCK_LOCALE_CONFIGURATION, KbqCodeBlock, KbqCodeBlockHighlight, KbqCodeBlockModule, KbqCodeBlockTabLinkContent, kbqCodeBlockDefaultOptionsProvider, kbqCodeBlockFallbackFileLanguageProvider, kbqCodeBlockFallbackFileNameProvider, kbqCodeBlockHighlightJsConfigProvider, kbqCodeBlockLocaleConfigurationProvider };
985
972
  //# sourceMappingURL=koobiq-components-code-block.mjs.map