@koobiq/components 17.0.0-rc.2 → 17.0.0-rc.4

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 (100) hide show
  1. package/alert/_alert-theme.scss +47 -20
  2. package/alert/alert.component.d.ts +23 -3
  3. package/alert/alert.component.scss +89 -56
  4. package/code-block/_code-block-theme.scss +23 -1
  5. package/code-block/actionbar.component.scss +2 -2
  6. package/code-block/code-block.component.d.ts +12 -4
  7. package/code-block/code-block.scss +36 -9
  8. package/core/locales/formatters.d.ts +96 -0
  9. package/core/locales/locale-service.d.ts +96 -0
  10. package/core/pop-up/pop-up-trigger.d.ts +3 -1
  11. package/core/styles/_variables.scss +1 -1
  12. package/core/styles/common/_tokens.scss +28 -0
  13. package/core/styles/theming/_components-theming.scss +67 -10
  14. package/core/styles/theming/_theming.scss +2 -2
  15. package/core/styles/typography/_typography.scss +35 -2
  16. package/core/utils/data-size/config.d.ts +20 -2
  17. package/core/utils/data-size/data-size.pipe.d.ts +10 -9
  18. package/core/utils/data-size/size.d.ts +3 -4
  19. package/ellipsis-center/ellipsis-center.directive.d.ts +3 -2
  20. package/esm2022/alert/alert.component.mjs +52 -5
  21. package/esm2022/code-block/actionbar.component.mjs +2 -2
  22. package/esm2022/code-block/code-block.component.mjs +58 -14
  23. package/esm2022/core/animation/select-animations.mjs +4 -4
  24. package/esm2022/core/locales/formatters.mjs +97 -1
  25. package/esm2022/core/pop-up/pop-up-trigger.mjs +18 -11
  26. package/esm2022/core/utils/data-size/config.mjs +5 -17
  27. package/esm2022/core/utils/data-size/data-size.pipe.mjs +36 -22
  28. package/esm2022/core/utils/data-size/size.mjs +10 -14
  29. package/esm2022/core/version.mjs +2 -2
  30. package/esm2022/dropdown/dropdown-animations.mjs +4 -4
  31. package/esm2022/ellipsis-center/ellipsis-center.directive.mjs +7 -5
  32. package/esm2022/file-upload/file-upload.module.mjs +4 -5
  33. package/esm2022/form-field/password-toggle.mjs +11 -9
  34. package/esm2022/loader-overlay/loader-overlay.component.mjs +2 -2
  35. package/esm2022/modal/modal.component.mjs +5 -6
  36. package/esm2022/navbar/navbar-item.component.mjs +9 -9
  37. package/esm2022/select/select-option.directive.mjs +7 -5
  38. package/esm2022/splitter/splitter.component.mjs +36 -16
  39. package/esm2022/textarea/textarea.component.mjs +12 -10
  40. package/esm2022/timezone/timezone-option.directive.mjs +7 -5
  41. package/esm2022/title/title.directive.mjs +2 -3
  42. package/esm2022/toast/toast-container.component.mjs +2 -2
  43. package/esm2022/toast/toast.component.mjs +4 -4
  44. package/esm2022/toast/toast.service.mjs +2 -2
  45. package/esm2022/toast/toast.type.mjs +3 -1
  46. package/esm2022/tooltip/tooltip.component.mjs +26 -12
  47. package/esm2022/tree/padding.directive.mjs +2 -2
  48. package/fesm2022/koobiq-components-alert.mjs +52 -5
  49. package/fesm2022/koobiq-components-alert.mjs.map +1 -1
  50. package/fesm2022/koobiq-components-code-block.mjs +57 -14
  51. package/fesm2022/koobiq-components-code-block.mjs.map +1 -1
  52. package/fesm2022/koobiq-components-core.mjs +160 -62
  53. package/fesm2022/koobiq-components-core.mjs.map +1 -1
  54. package/fesm2022/koobiq-components-dropdown.mjs +3 -3
  55. package/fesm2022/koobiq-components-dropdown.mjs.map +1 -1
  56. package/fesm2022/koobiq-components-ellipsis-center.mjs +5 -4
  57. package/fesm2022/koobiq-components-ellipsis-center.mjs.map +1 -1
  58. package/fesm2022/koobiq-components-file-upload.mjs +3 -4
  59. package/fesm2022/koobiq-components-file-upload.mjs.map +1 -1
  60. package/fesm2022/koobiq-components-form-field.mjs +15 -15
  61. package/fesm2022/koobiq-components-form-field.mjs.map +1 -1
  62. package/fesm2022/koobiq-components-loader-overlay.mjs +1 -1
  63. package/fesm2022/koobiq-components-loader-overlay.mjs.map +1 -1
  64. package/fesm2022/koobiq-components-modal.mjs +4 -5
  65. package/fesm2022/koobiq-components-modal.mjs.map +1 -1
  66. package/fesm2022/koobiq-components-navbar.mjs +8 -8
  67. package/fesm2022/koobiq-components-navbar.mjs.map +1 -1
  68. package/fesm2022/koobiq-components-select.mjs +5 -4
  69. package/fesm2022/koobiq-components-select.mjs.map +1 -1
  70. package/fesm2022/koobiq-components-splitter.mjs +35 -15
  71. package/fesm2022/koobiq-components-splitter.mjs.map +1 -1
  72. package/fesm2022/koobiq-components-textarea.mjs +11 -9
  73. package/fesm2022/koobiq-components-textarea.mjs.map +1 -1
  74. package/fesm2022/koobiq-components-timezone.mjs +5 -4
  75. package/fesm2022/koobiq-components-timezone.mjs.map +1 -1
  76. package/fesm2022/koobiq-components-title.mjs +1 -2
  77. package/fesm2022/koobiq-components-title.mjs.map +1 -1
  78. package/fesm2022/koobiq-components-toast.mjs +8 -6
  79. package/fesm2022/koobiq-components-toast.mjs.map +1 -1
  80. package/fesm2022/koobiq-components-tooltip.mjs +24 -11
  81. package/fesm2022/koobiq-components-tooltip.mjs.map +1 -1
  82. package/fesm2022/koobiq-components-tree.mjs +1 -1
  83. package/fesm2022/koobiq-components-tree.mjs.map +1 -1
  84. package/file-upload/file-upload.module.d.ts +1 -1
  85. package/form-field/password-toggle.d.ts +3 -2
  86. package/link/_link-theme.scss +4 -2
  87. package/navbar/navbar-item.component.d.ts +4 -4
  88. package/package.json +6 -6
  89. package/prebuilt-themes/dark-theme.css +1 -1
  90. package/prebuilt-themes/light-theme.css +1 -1
  91. package/schematics/ng-add/index.js +4 -4
  92. package/select/select-option.directive.d.ts +3 -2
  93. package/splitter/splitter.component.d.ts +10 -5
  94. package/timezone/timezone-option.directive.d.ts +3 -2
  95. package/title/title.directive.d.ts +0 -1
  96. package/toast/_toast-theme.scss +10 -5
  97. package/toast/toast-container.component.scss +4 -1
  98. package/toast/toast.component.scss +22 -17
  99. package/toast/toast.type.d.ts +2 -0
  100. package/tooltip/tooltip.component.d.ts +12 -8
@@ -1,7 +1,7 @@
1
1
  import { Directionality } from '@angular/cdk/bidi';
2
2
  import { coerceNumberProperty } from '@angular/cdk/coercion';
3
3
  import { Directive, ElementRef, Input, Optional, Renderer2 } from '@angular/core';
4
- import { TreeSizeIndentLevel } from '@koobiq/design-tokens/web';
4
+ import { TreeSizeIndentLevel } from '@koobiq/design-tokens';
5
5
  import { Subject } from 'rxjs';
6
6
  import { takeUntil } from 'rxjs/operators';
7
7
  import { KbqTreeBase, KbqTreeNode } from './tree-base';
@@ -110,4 +110,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
110
110
  type: Input,
111
111
  args: ['kbqTreeNodePaddingIndent']
112
112
  }] } });
113
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFkZGluZy5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wYWNrYWdlcy9jb21wb25lbnRzL3RyZWUvcGFkZGluZy5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLG1CQUFtQixDQUFDO0FBQ25ELE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLHVCQUF1QixDQUFDO0FBQzdELE9BQU8sRUFFSCxTQUFTLEVBQ1QsVUFBVSxFQUNWLEtBQUssRUFFTCxRQUFRLEVBQ1IsU0FBUyxFQUNaLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQ2hFLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxNQUFNLENBQUM7QUFDL0IsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBRTNDLE9BQU8sRUFBRSxXQUFXLEVBQUUsV0FBVyxFQUFFLE1BQU0sYUFBYSxDQUFDO0FBQ3ZELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQzs7Ozs7QUFHeEQscURBQXFEO0FBQ3JELE1BQU0sY0FBYyxHQUFHLGVBQWUsQ0FBQztBQU92QyxNQUFNLE9BQU8sa0JBQWtCO0lBQzNCLElBQUksS0FBSztRQUNMLE9BQU8sSUFBSSxDQUFDLE1BQU0sQ0FBQztJQUN2QixDQUFDO0lBRUQsSUFBSSxLQUFLLENBQUMsS0FBYTtRQUNuQixJQUFJLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQzlCLENBQUM7SUFJRCxJQUNJLE1BQU07UUFDTixPQUFPLElBQUksQ0FBQyxPQUFPLENBQUM7SUFDeEIsQ0FBQztJQUVELElBQUksTUFBTSxDQUFDLE1BQXVCO1FBQzlCLElBQUksQ0FBQyxjQUFjLENBQUMsTUFBTSxDQUFDLENBQUM7SUFDaEMsQ0FBQztJQUlELElBQUksV0FBVztR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QUFJLENBQUMsV0FBVyxHQUFHLEtBQUssQ0FBQztRQUN6QixJQUFJLENBQUMsT0FBTyxHQUFHLG9CQUFvQixDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzNDLElBQUksQ0FBQyxVQUFVLEVBQUUsQ0FBQztJQUN0QixDQUFDO0lBRU8sVUFBVTtRQUNkLE1BQU0sT0FBTyxHQUFHLElBQUksQ0FBQyxhQUFhLEVBQUUsQ0FBQztRQUNyQyxNQUFNLFdBQVcsR0FBRyxJQUFJLENBQUMsR0FBRyxFQUFFLEtBQUssS0FBSyxLQUFLLENBQUMsQ0FBQyxDQUFDLGNBQWMsQ0FBQyxDQUFDLENBQUMsYUFBYSxDQUFDO1FBRS9FLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsYUFBYSxFQUFFLFdBQVcsRUFBRSxPQUFPLENBQUMsQ0FBQztJQUM3RSxDQUFDO2lJQTVHUSxrQkFBa0I7cUhBQWxCLGtCQUFrQjs7MkZBQWxCLGtCQUFrQjtrQkFKOUIsU0FBUzttQkFBQztvQkFDUCxRQUFRLEVBQUUsc0JBQXNCO29CQUNoQyxRQUFRLEVBQUUsb0JBQW9CO2lCQUNqQzs7MEJBMkNRLFFBQVE7eUNBOUJULE1BQU07c0JBRFQsS0FBSzt1QkFBQywwQkFBMEIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEaXJlY3Rpb25hbGl0eSB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9iaWRpJztcbmltcG9ydCB7IGNvZXJjZU51bWJlclByb3BlcnR5IH0gZnJvbSAnQGFuZ3VsYXIvY2RrL2NvZXJjaW9uJztcbmltcG9ydCB7XG4gICAgQWZ0ZXJWaWV3SW5pdCxcbiAgICBEaXJlY3RpdmUsXG4gICAgRWxlbWVudFJlZixcbiAgICBJbnB1dCxcbiAgICBPbkRlc3Ryb3ksXG4gICAgT3B0aW9uYWwsXG4gICAgUmVuZGVyZXIyXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgVHJlZVNpemVJbmRlbnRMZXZlbCB9IGZyb20gJ0Brb29iaXEvZGVzaWduLXRva2Vucy93ZWInO1xuaW1wb3J0IHsgU3ViamVjdCB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgdGFrZVVudGlsIH0gZnJvbSAncnhqcy9vcGVyYXRvcnMnO1xuXG5pbXBvcnQgeyBLYnFUcmVlQmFzZSwgS2JxVHJlZU5vZGUgfSBmcm9tICcuL3RyZWUtYmFzZSc7XG5pbXBvcnQgeyBLYnFUcmVlT3B0aW9uIH0gZnJvbSAnLi90cmVlLW9wdGlvbi5jb21wb25lbnQnO1xuXG5cbi8qKiBSZWdleCB1c2VkIHRvIHNwbGl0IGEgc3RyaW5nIG9uIGl0cyBDU1MgdW5pdHMuICovXG5jb25zdCBjc3NVbml0UGF0dGVybiA9IC8oW0EtWmEteiVdKykkLztcblxuXG5ARGlyZWN0aXZlKHtcbiAgICBzZWxlY3RvcjogJ1trYnFUcmVlTm9kZVBhZGRpbmddJyxcbiAgICBleHBvcnRBczogJ2ticVRyZWVOb2RlUGFkZGluZydcbn0pXG5leHBvcnQgY2xhc3MgS2JxVHJlZU5vZGVQYWRkaW5nPFQ+IGltcGxlbWVudHMgT25EZXN0cm95LCBBZnRlclZpZXdJbml0IHtcbiAgICBnZXQgbGV2ZWwoKTogbnVtYmVyIHtcbiAgICAgICAgcmV0dXJuIHRoaXMuX2xldmVsO1xuICAgIH1cblxuICAgIHNldCBsZXZlbCh2YWx1ZTogbnVtYmVyKSB7XG4gICAgICAgIHRoaXMuc2V0TGV2ZWxJbnB1dCh2YWx1ZSk7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBfbGV2ZWw6IG51bWJlcjtcblxuICAgIEBJbnB1dCgna2JxVHJlZU5vZGVQYWRkaW5nSW5kZW50JylcbiAgICBnZXQgaW5kZW50KCk6IG51bWJlciB8IHN0cmluZyB7XG4gICAgICAgIHJldHVybiB0aGlzLl9pbmRlbnQ7XG4gICAgfVxuXG4gICAgc2V0IGluZGVudChpbmRlbnQ6IG51bWJlciB8IHN0cmluZykge1xuICAgICAgICB0aGlzLnNldEluZGVudElucHV0KGluZGVudCk7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBfaW5kZW50OiBudW1iZXIgPSBwYXJzZUludChUcmVlU2l6ZUluZGVudExldmVsKTtcblxuICAgIGdldCBsZWZ0UGFkZGluZygpOiBudW1iZXIge1xuICAgICAgICByZXR1cm4gKHRoaXMud2l0aEljb24gPyAwIDogdGhpcy5pY29uV2lkdGgpICsgdGhpcy5iYXNlTGVmdFBhZGRpbmc7XG4gICAgfVxuXG4gICAgLyoqIENTUyB1bml0cyB1c2VkIGZvciB0aGUgaW5kZW50YXRpb24gdmFsdWUuICovXG4gICAgaW5kZW50VW5pdHMgPSAncHgnO1xuXG4gICAgYmFzZUxlZnRQYWRkaW5nOiBudW1iZXIgPSA4O1xuXG4gICAgd2l0aEljb246IGJvb2xlYW47XG4gICAgaWNvbldpZHRoOiBudW1iZXIgPSAyNDtcblxuICAgIHByaXZhdGUgZGVzdHJveWVkID0gbmV3IFN1YmplY3Q8dm9pZD4oKTtcblxuICAgIGNvbnN0cnVjdG9yKFxuICAgICAgICBwcm90ZWN0ZWQgdHJlZU5vZGU6IEticVRyZWVOb2RlPFQ+LFxuICAgICAgICBwcm90ZWN0ZWQgdHJlZTogS2JxVHJlZUJhc2U8VD4sXG4gICAgICAgIHByaXZhdGUgcmVuZGVyZXI6IFJlbmRlcmVyMixcbiAgICAgICAgcHJpdmF0ZSBlbGVtZW50OiBFbGVtZW50UmVmPEhUTUxFbGVtZW50PixcbiAgICAgICAgcHJpdmF0ZSBvcHRpb246IEticVRyZWVPcHRpb24sXG4gICAgICAgIEBPcHRpb25hbCgpIHByaXZhdGUgZGlyOiBEaXJlY3Rpb25hbGl0eVxuICAgICkge1xuICAgICAgICB0aGlzLmRpcj8uY2hhbmdlPy5waXBlKHRha2VVbnRpbCh0aGlzLmRlc3Ryb3llZCkpXG4gICAgICAgICAgICAuc3Vic2NyaWJlKCgpID0+IHRoaXMuc2V0UGFkZGluZygpKTtcbiAgICB9XG5cbiAgICBuZ0FmdGVyVmlld0luaXQoKTogdm9pZCB7XG4gICAgICAgIHRoaXMud2l0aEljb24gPSB0aGlzLm9wdGlvbi5pc1RvZ2dsZUluRGVmYXVsdFBsYWNlO1xuICAgICAgICB0aGlzLnNldFBhZGRpbmcoKTtcbiAgICB9XG5cbiAgICBuZ09uRGVzdHJveSgpIHtcbiAgICAgICAgdGhpcy5kZXN0cm95ZWQubmV4dCgpO1xuICAgICAgICB0aGlzLmRlc3Ryb3llZC5jb21wbGV0ZSgpO1xuICAgIH1cblxuICAgIHBhZGRpbmdJbmRlbnQoKTogc3RyaW5nIHwgbnVsbCB7XG4gICAgICAgIGNvbnN0IG5vZGVMZXZlbCA9ICh0aGlzLnRyZWVOb2RlLmRhdGEgJiYgdGhpcy50cmVlLnRyZWVDb250cm9sLmdldExldmVsKVxuICAgICAgICAgICAgPyB0aGlzLnRyZWUudHJlZUNvbnRyb2wuZ2V0TGV2ZWwodGhpcy50cmVlTm9kZS5kYXRhKVxuICAgICAgICAgICAgOiAwO1xuXG4gICAgICAgIGNvbnN0IGxldmVsID0gdGhpcy5sZXZlbCB8fCBub2RlTGV2ZWw7XG5cbiAgICAgICAgcmV0dXJuIGxldmVsID4gMCA/IGAkeyhsZXZlbCAqIHRoaXMuX2luZGVudCkgKyB0aGlzLmxlZnRQYWRkaW5nfXB4YCA6IGAke3RoaXMubGVmdFBhZGRpbmd9cHhgO1xuICAgIH1cblxuICAgIC8qKlxuICAgICAqIFRoaXMgaGFzIGJlZW4gZXh0cmFjdGVkIHRvIGEgdXRpbCBiZWNhdXNlIG9mIFRTIDQgYW5kIFZFLlxuICAgICAqIFZpZXcgRW5naW5lIGRvZXNuJ3Qgc3VwcG9ydCBwcm9wZXJ0eSByZW5hbWUgaW5oZXJpdGFuY2UuXG4gICAgICogVFMgNC4wIGRvZXNuJ3QgYWxsb3cgcHJvcGVydGllcyB0byBvdmVycmlkZSBhY2Nlc3NvcnMgb3IgdmljZS12ZXJzYS5cbiAgICAgKiBAZG9jcy1wcml2YXRlXG4gICAgICovXG4gICAgcHJpdmF0ZSBzZXRMZXZlbElucHV0KHZhbHVlOiBudW1iZXIpIHtcbiAgICAgICAgLy8gU2V0IHRvIG51bGwgYXMgdGhlIGZhbGxiYWNrIHZhbHVlIHNvIHRoYXQgX3NldFBhZGRpbmcgY2FuIGZhbGwgYmFjayB0byB0aGUgbm9kZSBsZXZlbCBpZiB0aGVcbiAgICAgICAgLy8gY29uc3VtZXIgc2V0IHRoZSBkaXJlY3RpdmUgYXMgYGticVRyZWVOb2RlUGFkZGluZz1cIlwiYC4gV2Ugc3RpbGwgd2FudCB0byB0YWtlIHRoaXMgdmFsdWUgaWZcbiAgICAgICAgLy8gdGhleSBzZXQgMCBleHBsaWNpdGx5LlxuICAgICAgICB0aGlzLl9sZXZlbCA9IGNvZXJjZU51bWJlclByb3BlcnR5KHZhbHVlLCBudWxsKSE7XG4gICAgICAgIHRoaXMuc2V0UGFkZGluZygpO1xuICAgIH1cblxuICAgIC8qKlxuICAgICAqIFRoaXMgaGFzIGJlZW4gZXh0cmFjdGVkIHRvIGEgdXRpbCBiZWNhdXNlIG9mIFRTIDQgYW5kIFZFLlxuICAgICAqIFZpZXcgRW5naW5lIGRvZXNuJ3Qgc3VwcG9ydCBwcm9wZXJ0eSByZW5hbWUgaW5oZXJpdGFuY2UuXG4gICAgICogVFMgNC4wIGRvZXNuJ3QgYWxsb3cgcHJvcGVydGllcyB0byBvdmVycmlkZSBhY2Nlc3NvcnMgb3IgdmljZS12ZXJzYS5cbiAgICAgKiBAZG9jcy1wcml2YXRlXG4gICAgICovXG4gICAgcHJpdmF0ZSBzZXRJbmRlbnRJbnB1dChpbmRlbnQ6IG51bWJlciB8IHN0cmluZykge1xuICAgICAgICBsZXQgdmFsdWUgPSBpbmRlbnQ7XG4gICAgICAgIGxldCB1bml0cyA9ICdweCc7XG5cbiAgICAgICAgaWYgKHR5cGVvZiBpbmRlbnQgPT09ICdzdHJpbmcnKSB7XG4gICAgICAgICAgICBjb25zdCBwYXJ0cyA9IGluZGVudC5zcGxpdChjc3NVbml0UGF0dGVybik7XG4gICAgICAgICAgICB2YWx1ZSA9IHBhcnRzWzBdO1xuICAgICAgICAgICAgdW5pdHMgPSBwYXJ0c1sxXSB8fCB1bml0cztcbiAgICAgICAgfVxuXG4gICAgICAgIHRoaXMuaW5kZW50VW5pdHMgPSB1bml0cztcbiAgICAgICAgdGhpcy5faW5kZW50ID0gY29lcmNlTnVtYmVyUHJvcGVydHkodmFsdWUpO1xuICAgICAgICB0aGlzLnNldFBhZGRpbmcoKTtcbiAgICB9XG5cbiAgICBwcml2YXRlIHNldFBhZGRpbmcoKSB7XG4gICAgICAgIGNvbnN0IHBhZGRpbmcgPSB0aGlzLnBhZGRpbmdJbmRlbnQoKTtcbiAgICAgICAgY29uc3QgcGFkZGluZ1Byb3AgPSB0aGlzLmRpcj8udmFsdWUgPT09ICdydGwnID8gJ3BhZGRpbmdSaWdodCcgOiAncGFkZGluZ0xlZnQnO1xuXG4gICAgICAgIHRoaXMucmVuZGVyZXIuc2V0U3R5bGUodGhpcy5lbGVtZW50Lm5hdGl2ZUVsZW1lbnQsIHBhZGRpbmdQcm9wLCBwYWRkaW5nKTtcbiAgICB9XG59XG4iXX0=
113
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFkZGluZy5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wYWNrYWdlcy9jb21wb25lbnRzL3RyZWUvcGFkZGluZy5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLG1CQUFtQixDQUFDO0FBQ25ELE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLHVCQUF1QixDQUFDO0FBQzdELE9BQU8sRUFFSCxTQUFTLEVBQ1QsVUFBVSxFQUNWLEtBQUssRUFFTCxRQUFRLEVBQ1IsU0FBUyxFQUNaLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLHVCQUF1QixDQUFDO0FBQzVELE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxNQUFNLENBQUM7QUFDL0IsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBRTNDLE9BQU8sRUFBRSxXQUFXLEVBQUUsV0FBVyxFQUFFLE1BQU0sYUFBYSxDQUFDO0FBQ3ZELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx5QkFBeUIsQ0FBQzs7Ozs7QUFHeEQscURBQXFEO0FBQ3JELE1BQU0sY0FBYyxHQUFHLGVBQWUsQ0FBQztBQU92QyxNQUFNLE9BQU8sa0JBQWtCO0lBQzNCLElBQUksS0FBSztRQUNMLE9BQU8sSUFBSSxDQUFDLE1BQU0sQ0FBQztJQUN2QixDQUFDO0lBRUQsSUFBSSxLQUFLLENBQUMsS0FBYTtRQUNuQixJQUFJLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQzlCLENBQUM7SUFJRCxJQUNJLE1BQU07UUFDTixPQUFPLElBQUksQ0FBQyxPQUFPLENBQUM7SUFDeEIsQ0FBQztJQUVELElBQUksTUFBTSxDQUFDLE1BQXVCO1FBQzlCLElBQUksQ0FBQyxjQUFjLENBQUMsTUFBTSxDQUFDLENBQUM7SUFDaEMsQ0FBQztJQUlELElBQUksV0FBVztR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QUFJLENBQUMsV0FBVyxHQUFHLEtBQUssQ0FBQztRQUN6QixJQUFJLENBQUMsT0FBTyxHQUFHLG9CQUFvQixDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzNDLElBQUksQ0FBQyxVQUFVLEVBQUUsQ0FBQztJQUN0QixDQUFDO0lBRU8sVUFBVTtRQUNkLE1BQU0sT0FBTyxHQUFHLElBQUksQ0FBQyxhQUFhLEVBQUUsQ0FBQztRQUNyQyxNQUFNLFdBQVcsR0FBRyxJQUFJLENBQUMsR0FBRyxFQUFFLEtBQUssS0FBSyxLQUFLLENBQUMsQ0FBQyxDQUFDLGNBQWMsQ0FBQyxDQUFDLENBQUMsYUFBYSxDQUFDO1FBRS9FLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsYUFBYSxFQUFFLFdBQVcsRUFBRSxPQUFPLENBQUMsQ0FBQztJQUM3RSxDQUFDO2lJQTVHUSxrQkFBa0I7cUhBQWxCLGtCQUFrQjs7MkZBQWxCLGtCQUFrQjtrQkFKOUIsU0FBUzttQkFBQztvQkFDUCxRQUFRLEVBQUUsc0JBQXNCO29CQUNoQyxRQUFRLEVBQUUsb0JBQW9CO2lCQUNqQzs7MEJBMkNRLFFBQVE7eUNBOUJULE1BQU07c0JBRFQsS0FBSzt1QkFBQywwQkFBMEIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEaXJlY3Rpb25hbGl0eSB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9iaWRpJztcbmltcG9ydCB7IGNvZXJjZU51bWJlclByb3BlcnR5IH0gZnJvbSAnQGFuZ3VsYXIvY2RrL2NvZXJjaW9uJztcbmltcG9ydCB7XG4gICAgQWZ0ZXJWaWV3SW5pdCxcbiAgICBEaXJlY3RpdmUsXG4gICAgRWxlbWVudFJlZixcbiAgICBJbnB1dCxcbiAgICBPbkRlc3Ryb3ksXG4gICAgT3B0aW9uYWwsXG4gICAgUmVuZGVyZXIyXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgVHJlZVNpemVJbmRlbnRMZXZlbCB9IGZyb20gJ0Brb29iaXEvZGVzaWduLXRva2Vucyc7XG5pbXBvcnQgeyBTdWJqZWN0IH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyB0YWtlVW50aWwgfSBmcm9tICdyeGpzL29wZXJhdG9ycyc7XG5cbmltcG9ydCB7IEticVRyZWVCYXNlLCBLYnFUcmVlTm9kZSB9IGZyb20gJy4vdHJlZS1iYXNlJztcbmltcG9ydCB7IEticVRyZWVPcHRpb24gfSBmcm9tICcuL3RyZWUtb3B0aW9uLmNvbXBvbmVudCc7XG5cblxuLyoqIFJlZ2V4IHVzZWQgdG8gc3BsaXQgYSBzdHJpbmcgb24gaXRzIENTUyB1bml0cy4gKi9cbmNvbnN0IGNzc1VuaXRQYXR0ZXJuID0gLyhbQS1aYS16JV0rKSQvO1xuXG5cbkBEaXJlY3RpdmUoe1xuICAgIHNlbGVjdG9yOiAnW2ticVRyZWVOb2RlUGFkZGluZ10nLFxuICAgIGV4cG9ydEFzOiAna2JxVHJlZU5vZGVQYWRkaW5nJ1xufSlcbmV4cG9ydCBjbGFzcyBLYnFUcmVlTm9kZVBhZGRpbmc8VD4gaW1wbGVtZW50cyBPbkRlc3Ryb3ksIEFmdGVyVmlld0luaXQge1xuICAgIGdldCBsZXZlbCgpOiBudW1iZXIge1xuICAgICAgICByZXR1cm4gdGhpcy5fbGV2ZWw7XG4gICAgfVxuXG4gICAgc2V0IGxldmVsKHZhbHVlOiBudW1iZXIpIHtcbiAgICAgICAgdGhpcy5zZXRMZXZlbElucHV0KHZhbHVlKTtcbiAgICB9XG5cbiAgICBwcml2YXRlIF9sZXZlbDogbnVtYmVyO1xuXG4gICAgQElucHV0KCdrYnFUcmVlTm9kZVBhZGRpbmdJbmRlbnQnKVxuICAgIGdldCBpbmRlbnQoKTogbnVtYmVyIHwgc3RyaW5nIHtcbiAgICAgICAgcmV0dXJuIHRoaXMuX2luZGVudDtcbiAgICB9XG5cbiAgICBzZXQgaW5kZW50KGluZGVudDogbnVtYmVyIHwgc3RyaW5nKSB7XG4gICAgICAgIHRoaXMuc2V0SW5kZW50SW5wdXQoaW5kZW50KTtcbiAgICB9XG5cbiAgICBwcml2YXRlIF9pbmRlbnQ6IG51bWJlciA9IHBhcnNlSW50KFRyZWVTaXplSW5kZW50TGV2ZWwpO1xuXG4gICAgZ2V0IGxlZnRQYWRkaW5nKCk6IG51bWJlciB7XG4gICAgICAgIHJldHVybiAodGhpcy53aXRoSWNvbiA/IDAgOiB0aGlzLmljb25XaWR0aCkgKyB0aGlzLmJhc2VMZWZ0UGFkZGluZztcbiAgICB9XG5cbiAgICAvKiogQ1NTIHVuaXRzIHVzZWQgZm9yIHRoZSBpbmRlbnRhdGlvbiB2YWx1ZS4gKi9cbiAgICBpbmRlbnRVbml0cyA9ICdweCc7XG5cbiAgICBiYXNlTGVmdFBhZGRpbmc6IG51bWJlciA9IDg7XG5cbiAgICB3aXRoSWNvbjogYm9vbGVhbjtcbiAgICBpY29uV2lkdGg6IG51bWJlciA9IDI0O1xuXG4gICAgcHJpdmF0ZSBkZXN0cm95ZWQgPSBuZXcgU3ViamVjdDx2b2lkPigpO1xuXG4gICAgY29uc3RydWN0b3IoXG4gICAgICAgIHByb3RlY3RlZCB0cmVlTm9kZTogS2JxVHJlZU5vZGU8VD4sXG4gICAgICAgIHByb3RlY3RlZCB0cmVlOiBLYnFUcmVlQmFzZTxUPixcbiAgICAgICAgcHJpdmF0ZSByZW5kZXJlcjogUmVuZGVyZXIyLFxuICAgICAgICBwcml2YXRlIGVsZW1lbnQ6IEVsZW1lbnRSZWY8SFRNTEVsZW1lbnQ+LFxuICAgICAgICBwcml2YXRlIG9wdGlvbjogS2JxVHJlZU9wdGlvbixcbiAgICAgICAgQE9wdGlvbmFsKCkgcHJpdmF0ZSBkaXI6IERpcmVjdGlvbmFsaXR5XG4gICAgKSB7XG4gICAgICAgIHRoaXMuZGlyPy5jaGFuZ2U/LnBpcGUodGFrZVVudGlsKHRoaXMuZGVzdHJveWVkKSlcbiAgICAgICAgICAgIC5zdWJzY3JpYmUoKCkgPT4gdGhpcy5zZXRQYWRkaW5nKCkpO1xuICAgIH1cblxuICAgIG5nQWZ0ZXJWaWV3SW5pdCgpOiB2b2lkIHtcbiAgICAgICAgdGhpcy53aXRoSWNvbiA9IHRoaXMub3B0aW9uLmlzVG9nZ2xlSW5EZWZhdWx0UGxhY2U7XG4gICAgICAgIHRoaXMuc2V0UGFkZGluZygpO1xuICAgIH1cblxuICAgIG5nT25EZXN0cm95KCkge1xuICAgICAgICB0aGlzLmRlc3Ryb3llZC5uZXh0KCk7XG4gICAgICAgIHRoaXMuZGVzdHJveWVkLmNvbXBsZXRlKCk7XG4gICAgfVxuXG4gICAgcGFkZGluZ0luZGVudCgpOiBzdHJpbmcgfCBudWxsIHtcbiAgICAgICAgY29uc3Qgbm9kZUxldmVsID0gKHRoaXMudHJlZU5vZGUuZGF0YSAmJiB0aGlzLnRyZWUudHJlZUNvbnRyb2wuZ2V0TGV2ZWwpXG4gICAgICAgICAgICA/IHRoaXMudHJlZS50cmVlQ29udHJvbC5nZXRMZXZlbCh0aGlzLnRyZWVOb2RlLmRhdGEpXG4gICAgICAgICAgICA6IDA7XG5cbiAgICAgICAgY29uc3QgbGV2ZWwgPSB0aGlzLmxldmVsIHx8IG5vZGVMZXZlbDtcblxuICAgICAgICByZXR1cm4gbGV2ZWwgPiAwID8gYCR7KGxldmVsICogdGhpcy5faW5kZW50KSArIHRoaXMubGVmdFBhZGRpbmd9cHhgIDogYCR7dGhpcy5sZWZ0UGFkZGluZ31weGA7XG4gICAgfVxuXG4gICAgLyoqXG4gICAgICogVGhpcyBoYXMgYmVlbiBleHRyYWN0ZWQgdG8gYSB1dGlsIGJlY2F1c2Ugb2YgVFMgNCBhbmQgVkUuXG4gICAgICogVmlldyBFbmdpbmUgZG9lc24ndCBzdXBwb3J0IHByb3BlcnR5IHJlbmFtZSBpbmhlcml0YW5jZS5cbiAgICAgKiBUUyA0LjAgZG9lc24ndCBhbGxvdyBwcm9wZXJ0aWVzIHRvIG92ZXJyaWRlIGFjY2Vzc29ycyBvciB2aWNlLXZlcnNhLlxuICAgICAqIEBkb2NzLXByaXZhdGVcbiAgICAgKi9cbiAgICBwcml2YXRlIHNldExldmVsSW5wdXQodmFsdWU6IG51bWJlcikge1xuICAgICAgICAvLyBTZXQgdG8gbnVsbCBhcyB0aGUgZmFsbGJhY2sgdmFsdWUgc28gdGhhdCBfc2V0UGFkZGluZyBjYW4gZmFsbCBiYWNrIHRvIHRoZSBub2RlIGxldmVsIGlmIHRoZVxuICAgICAgICAvLyBjb25zdW1lciBzZXQgdGhlIGRpcmVjdGl2ZSBhcyBga2JxVHJlZU5vZGVQYWRkaW5nPVwiXCJgLiBXZSBzdGlsbCB3YW50IHRvIHRha2UgdGhpcyB2YWx1ZSBpZlxuICAgICAgICAvLyB0aGV5IHNldCAwIGV4cGxpY2l0bHkuXG4gICAgICAgIHRoaXMuX2xldmVsID0gY29lcmNlTnVtYmVyUHJvcGVydHkodmFsdWUsIG51bGwpITtcbiAgICAgICAgdGhpcy5zZXRQYWRkaW5nKCk7XG4gICAgfVxuXG4gICAgLyoqXG4gICAgICogVGhpcyBoYXMgYmVlbiBleHRyYWN0ZWQgdG8gYSB1dGlsIGJlY2F1c2Ugb2YgVFMgNCBhbmQgVkUuXG4gICAgICogVmlldyBFbmdpbmUgZG9lc24ndCBzdXBwb3J0IHByb3BlcnR5IHJlbmFtZSBpbmhlcml0YW5jZS5cbiAgICAgKiBUUyA0LjAgZG9lc24ndCBhbGxvdyBwcm9wZXJ0aWVzIHRvIG92ZXJyaWRlIGFjY2Vzc29ycyBvciB2aWNlLXZlcnNhLlxuICAgICAqIEBkb2NzLXByaXZhdGVcbiAgICAgKi9cbiAgICBwcml2YXRlIHNldEluZGVudElucHV0KGluZGVudDogbnVtYmVyIHwgc3RyaW5nKSB7XG4gICAgICAgIGxldCB2YWx1ZSA9IGluZGVudDtcbiAgICAgICAgbGV0IHVuaXRzID0gJ3B4JztcblxuICAgICAgICBpZiAodHlwZW9mIGluZGVudCA9PT0gJ3N0cmluZycpIHtcbiAgICAgICAgICAgIGNvbnN0IHBhcnRzID0gaW5kZW50LnNwbGl0KGNzc1VuaXRQYXR0ZXJuKTtcbiAgICAgICAgICAgIHZhbHVlID0gcGFydHNbMF07XG4gICAgICAgICAgICB1bml0cyA9IHBhcnRzWzFdIHx8IHVuaXRzO1xuICAgICAgICB9XG5cbiAgICAgICAgdGhpcy5pbmRlbnRVbml0cyA9IHVuaXRzO1xuICAgICAgICB0aGlzLl9pbmRlbnQgPSBjb2VyY2VOdW1iZXJQcm9wZXJ0eSh2YWx1ZSk7XG4gICAgICAgIHRoaXMuc2V0UGFkZGluZygpO1xuICAgIH1cblxuICAgIHByaXZhdGUgc2V0UGFkZGluZygpIHtcbiAgICAgICAgY29uc3QgcGFkZGluZyA9IHRoaXMucGFkZGluZ0luZGVudCgpO1xuICAgICAgICBjb25zdCBwYWRkaW5nUHJvcCA9IHRoaXMuZGlyPy52YWx1ZSA9PT0gJ3J0bCcgPyAncGFkZGluZ1JpZ2h0JyA6ICdwYWRkaW5nTGVmdCc7XG5cbiAgICAgICAgdGhpcy5yZW5kZXJlci5zZXRTdHlsZSh0aGlzLmVsZW1lbnQubmF0aXZlRWxlbWVudCwgcGFkZGluZ1Byb3AsIHBhZGRpbmcpO1xuICAgIH1cbn1cbiJdfQ==
@@ -3,9 +3,22 @@ import { PlatformModule } from '@angular/cdk/platform';
3
3
  import * as i1 from '@angular/common';
4
4
  import { CommonModule } from '@angular/common';
5
5
  import * as i0 from '@angular/core';
6
- import { Directive, Component, ChangeDetectionStrategy, ViewEncapsulation, ContentChild, NgModule } from '@angular/core';
7
- import { KbqIconItem } from '@koobiq/components/icon';
6
+ import { Directive, Component, ChangeDetectionStrategy, ViewEncapsulation, ContentChild, Input, NgModule } from '@angular/core';
7
+ import { KbqIconItem, KbqIcon } from '@koobiq/components/icon';
8
8
 
9
+ var KbqAlertStyles;
10
+ (function (KbqAlertStyles) {
11
+ KbqAlertStyles["Default"] = "default";
12
+ KbqAlertStyles["Colored"] = "colored";
13
+ })(KbqAlertStyles || (KbqAlertStyles = {}));
14
+ var KbqAlertColors;
15
+ (function (KbqAlertColors) {
16
+ KbqAlertColors["Contrast"] = "contrast";
17
+ KbqAlertColors["Error"] = "error";
18
+ KbqAlertColors["Warning"] = "warning";
19
+ KbqAlertColors["Success"] = "success";
20
+ KbqAlertColors["Theme"] = "theme";
21
+ })(KbqAlertColors || (KbqAlertColors = {}));
9
22
  class KbqAlertTitle {
10
23
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlertTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
11
24
  /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.0", type: KbqAlertTitle, selector: "[kbq-alert-title]", host: { classAttribute: "kbq-alert__title" }, ngImport: i0 }); }
@@ -46,18 +59,46 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
46
59
  }]
47
60
  }] });
48
61
  class KbqAlert {
62
+ constructor() {
63
+ this.compact = false;
64
+ this.alertStyle = KbqAlertStyles.Default;
65
+ this._alertColor = KbqAlertColors.Contrast;
66
+ }
67
+ get alertColor() {
68
+ return `kbq-alert_${this._alertColor}`;
69
+ }
70
+ set alertColor(value) {
71
+ this._alertColor = value || KbqAlertColors.Contrast;
72
+ }
73
+ get isColored() {
74
+ return this.alertStyle === KbqAlertStyles.Colored;
75
+ }
76
+ ngAfterContentInit() {
77
+ const icon = this.icon || this.iconItem;
78
+ if (icon) {
79
+ icon.color = this._alertColor;
80
+ }
81
+ }
49
82
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlert, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
50
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqAlert, selector: "kbq-alert", host: { properties: { "class.kbq-alert_dismissible": "closeButton" }, classAttribute: "kbq-alert" }, queries: [{ propertyName: "iconItem", first: true, predicate: KbqIconItem, descendants: true }, { propertyName: "title", first: true, predicate: KbqAlertTitle, descendants: true }, { propertyName: "control", first: true, predicate: KbqAlertControl, descendants: true }, { propertyName: "closeButton", first: true, predicate: KbqAlertCloseButton, descendants: true }], ngImport: i0, template: "<div class=\"kbq-alert__icon\" *ngIf=\"iconItem\">\n <ng-content select=\"[kbq-icon-item]\"></ng-content>\n</div>\n\n<div class=\"kbq-alert__content\">\n <ng-content select=\"[kbq-alert-title]\"></ng-content>\n\n <div class=\"kbq-alert__text\">\n <ng-content></ng-content>\n </div>\n\n <div class=\"kbq-alert__controls\" *ngIf=\"control\">\n <ng-content select=\"[kbq-alert-control]\"></ng-content>\n </div>\n</div>\n\n<div class=\"kbq-alert__close-button\" [hidden]=\"!closeButton\">\n <ng-content select=\"[kbq-alert-close-button]\"></ng-content>\n</div>\n", styles: [".kbq-alert{display:flex;border-radius:var(--kbq-alert-size-container-border-radius, 12px);min-width:var(--kbq-alert-size-container-min-width, );min-height:calc(var(--kbq-alert-size-container-min-height, 48px) - var(--kbq-alert-size-container-padding-vertical, 16px) * 2);padding:var(--kbq-alert-size-container-padding-vertical, 16px) var(--kbq-alert-size-container-padding-horizontal, 20px)}.kbq-alert__icon{margin-right:var(--kbq-alert-size-container-content-gap-horizontal, 12px)}.kbq-alert__title{margin-bottom:var(--kbq-alert-size-container-content-gap-vertical, 4px)}.kbq-alert__controls{margin-top:var(--kbq-alert-size-container-content-gap-vertical, 4px);padding-top:var(--kbq-alert-size-button-stack-content-padding-top, 8px)}.kbq-alert__controls .kbq-button{margin-right:var(--kbq-alert-size-button-stack-content-content-gap-horizontal, 4px)}.kbq-alert__controls .kbq-link{margin-right:16px}.kbq-alert__content{display:flex;flex-direction:column;flex:1;justify-content:center}.kbq-alert__close-button{margin-left:var(--kbq-alert-size-container-content-gap-horizontal, 12px)}.kbq-alert_dismissible .kbq-alert__close-button{margin-top:var(--kbq-alert-size-close-button-margin-top, -8px);margin-right:var(--kbq-alert-size-close-button-margin-right, -12px)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
83
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqAlert, selector: "kbq-alert", inputs: { compact: "compact", alertStyle: "alertStyle", alertColor: "alertColor" }, host: { properties: { "class": "alertColor", "class.kbq-alert_normal": "!compact", "class.kbq-alert_compact": "compact", "class.kbq-alert_default": "!isColored", "class.kbq-alert_colored": "isColored", "class.kbq-alert_dismissible": "closeButton" }, classAttribute: "kbq-alert" }, queries: [{ propertyName: "iconItem", first: true, predicate: KbqIconItem, descendants: true }, { propertyName: "icon", first: true, predicate: KbqIcon, descendants: true }, { propertyName: "title", first: true, predicate: KbqAlertTitle, descendants: true }, { propertyName: "control", first: true, predicate: KbqAlertControl, descendants: true }, { propertyName: "closeButton", first: true, predicate: KbqAlertCloseButton, descendants: true }], ngImport: i0, template: "<div class=\"kbq-alert__icon\" [class.kbq-alert__icon_title]=\"title\" *ngIf=\"iconItem || icon\">\n <ng-content select=\"[kbq-icon-item],[kbq-icon]\"></ng-content>\n</div>\n\n<div class=\"kbq-alert__content\" [class.kbq-alert__content_title]=\"title\">\n <ng-content select=\"[kbq-alert-title]\"></ng-content>\n\n <div class=\"kbq-alert__text\">\n <ng-content></ng-content>\n </div>\n\n <div class=\"kbq-alert__button-stack\" *ngIf=\"control\">\n <ng-content select=\"[kbq-alert-control]\"></ng-content>\n </div>\n</div>\n\n<div class=\"kbq-alert__close-button\" [hidden]=\"!closeButton\">\n <ng-content select=\"[kbq-alert-close-button]\"></ng-content>\n</div>\n", styles: [".kbq-alert{display:flex;box-sizing:border-box}.kbq-alert .kbq-alert__content_title{margin-bottom:var(--kbq-size-xxs, 4px)}.kbq-alert__content{display:flex;flex-direction:column;flex:1;justify-content:center}.kbq-alert.kbq-alert_normal{border-radius:var(--kbq-alert-size-normal-container-border-radius, 12px);padding:var(--kbq-alert-size-normal-container-padding-top, 0) var(--kbq-alert-size-normal-container-padding-right, 8px) var(--kbq-alert-size-normal-container-padding-bottom, 0) var(--kbq-alert-size-normal-container-padding-left, 8px)}.kbq-alert.kbq-alert_normal .kbq-alert__icon{margin:var(--kbq-alert-size-normal-icon-margin-top, 16px) var(--kbq-alert-size-normal-icon-margin-right, 0) var(--kbq-alert-size-normal-icon-margin-bottom, 16px) var(--kbq-alert-size-normal-icon-margin-left, 12px)}.kbq-alert.kbq-alert_normal .kbq-alert__icon.kbq-alert__icon_title .kbq-icon{margin-top:var(--kbq-alert-size-normal-icon-margin-addon-title, 2px)}.kbq-alert.kbq-alert_normal .kbq-alert__content{padding:var(--kbq-alert-size-normal-content-padding-top, 16px) var(--kbq-alert-size-normal-content-padding-right, 8px) var(--kbq-alert-size-normal-content-padding-bottom, 16px) var(--kbq-alert-size-normal-content-padding-left, 12px)}.kbq-alert.kbq-alert_normal .kbq-alert__title{margin-bottom:var(--kbq-alert-size-normal-title-margin-bottom, 4px)}.kbq-alert.kbq-alert_normal .kbq-alert__button-stack{padding-top:var(--kbq-alert-size-normal-button-stack-padding-top, 6px);padding-bottom:var(--kbq-alert-size-normal-button-stack-padding-bottom, 2px)}.kbq-alert.kbq-alert_normal .kbq-alert__close-button{margin-top:var(--kbq-alert-size-normal-close-button-margin-top, 8px);margin-left:var(--kbq-alert-size-normal-close-button-margin-left, 2px)}.kbq-alert.kbq-alert_compact{border-radius:var(--kbq-alert-size-compact-container-border-radius, 12px);padding:var(--kbq-alert-size-compact-container-padding-top, 0) var(--kbq-alert-size-compact-container-padding-right, 8px) var(--kbq-alert-size-compact-container-padding-bottom, 0) var(--kbq-alert-size-compact-container-padding-left, 16px)}.kbq-alert.kbq-alert_compact .kbq-alert__icon{margin-top:var(--kbq-alert-size-compact-icon-margin-top, 12px);margin-right:var(--kbq-alert-size-compact-icon-margin-right, 8px)}.kbq-alert.kbq-alert_compact .kbq-alert__icon.kbq-alert__icon_title .kbq-icon{margin-top:var(--kbq-alert-size-compact-icon-margin-addon-title, 2px)}.kbq-alert.kbq-alert_compact .kbq-alert__content{padding:var(--kbq-alert-size-compact-content-padding-top, 12px) var(--kbq-alert-size-compact-content-padding-right, 0) var(--kbq-alert-size-compact-content-padding-bottom, 12px) var(--kbq-alert-size-compact-content-padding-left, 0)}.kbq-alert.kbq-alert_compact .kbq-alert__title{margin-bottom:var(--kbq-alert-size-compact-title-margin-bottom, 2px)}.kbq-alert.kbq-alert_compact .kbq-alert__button-stack{padding-top:var(--kbq-alert-size-compact-button-stack-padding-top, 8px);padding-bottom:var(--kbq-alert-size-compact-button-stack-padding-bottom, 2px)}.kbq-alert.kbq-alert_compact .kbq-alert__close-button{margin-top:var(--kbq-alert-size-compact-close-button-margin-top, 8px);margin-left:var(--kbq-alert-size-compact-close-button-margin-left, 2px)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
51
84
  }
52
85
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqAlert, decorators: [{
53
86
  type: Component,
54
87
  args: [{ selector: 'kbq-alert', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
55
88
  class: 'kbq-alert',
89
+ '[class]': 'alertColor',
90
+ '[class.kbq-alert_normal]': '!compact',
91
+ '[class.kbq-alert_compact]': 'compact',
92
+ '[class.kbq-alert_default]': '!isColored',
93
+ '[class.kbq-alert_colored]': 'isColored',
56
94
  '[class.kbq-alert_dismissible]': 'closeButton'
57
- }, template: "<div class=\"kbq-alert__icon\" *ngIf=\"iconItem\">\n <ng-content select=\"[kbq-icon-item]\"></ng-content>\n</div>\n\n<div class=\"kbq-alert__content\">\n <ng-content select=\"[kbq-alert-title]\"></ng-content>\n\n <div class=\"kbq-alert__text\">\n <ng-content></ng-content>\n </div>\n\n <div class=\"kbq-alert__controls\" *ngIf=\"control\">\n <ng-content select=\"[kbq-alert-control]\"></ng-content>\n </div>\n</div>\n\n<div class=\"kbq-alert__close-button\" [hidden]=\"!closeButton\">\n <ng-content select=\"[kbq-alert-close-button]\"></ng-content>\n</div>\n", styles: [".kbq-alert{display:flex;border-radius:var(--kbq-alert-size-container-border-radius, 12px);min-width:var(--kbq-alert-size-container-min-width, );min-height:calc(var(--kbq-alert-size-container-min-height, 48px) - var(--kbq-alert-size-container-padding-vertical, 16px) * 2);padding:var(--kbq-alert-size-container-padding-vertical, 16px) var(--kbq-alert-size-container-padding-horizontal, 20px)}.kbq-alert__icon{margin-right:var(--kbq-alert-size-container-content-gap-horizontal, 12px)}.kbq-alert__title{margin-bottom:var(--kbq-alert-size-container-content-gap-vertical, 4px)}.kbq-alert__controls{margin-top:var(--kbq-alert-size-container-content-gap-vertical, 4px);padding-top:var(--kbq-alert-size-button-stack-content-padding-top, 8px)}.kbq-alert__controls .kbq-button{margin-right:var(--kbq-alert-size-button-stack-content-content-gap-horizontal, 4px)}.kbq-alert__controls .kbq-link{margin-right:16px}.kbq-alert__content{display:flex;flex-direction:column;flex:1;justify-content:center}.kbq-alert__close-button{margin-left:var(--kbq-alert-size-container-content-gap-horizontal, 12px)}.kbq-alert_dismissible .kbq-alert__close-button{margin-top:var(--kbq-alert-size-close-button-margin-top, -8px);margin-right:var(--kbq-alert-size-close-button-margin-right, -12px)}\n"] }]
95
+ }, template: "<div class=\"kbq-alert__icon\" [class.kbq-alert__icon_title]=\"title\" *ngIf=\"iconItem || icon\">\n <ng-content select=\"[kbq-icon-item],[kbq-icon]\"></ng-content>\n</div>\n\n<div class=\"kbq-alert__content\" [class.kbq-alert__content_title]=\"title\">\n <ng-content select=\"[kbq-alert-title]\"></ng-content>\n\n <div class=\"kbq-alert__text\">\n <ng-content></ng-content>\n </div>\n\n <div class=\"kbq-alert__button-stack\" *ngIf=\"control\">\n <ng-content select=\"[kbq-alert-control]\"></ng-content>\n </div>\n</div>\n\n<div class=\"kbq-alert__close-button\" [hidden]=\"!closeButton\">\n <ng-content select=\"[kbq-alert-close-button]\"></ng-content>\n</div>\n", styles: [".kbq-alert{display:flex;box-sizing:border-box}.kbq-alert .kbq-alert__content_title{margin-bottom:var(--kbq-size-xxs, 4px)}.kbq-alert__content{display:flex;flex-direction:column;flex:1;justify-content:center}.kbq-alert.kbq-alert_normal{border-radius:var(--kbq-alert-size-normal-container-border-radius, 12px);padding:var(--kbq-alert-size-normal-container-padding-top, 0) var(--kbq-alert-size-normal-container-padding-right, 8px) var(--kbq-alert-size-normal-container-padding-bottom, 0) var(--kbq-alert-size-normal-container-padding-left, 8px)}.kbq-alert.kbq-alert_normal .kbq-alert__icon{margin:var(--kbq-alert-size-normal-icon-margin-top, 16px) var(--kbq-alert-size-normal-icon-margin-right, 0) var(--kbq-alert-size-normal-icon-margin-bottom, 16px) var(--kbq-alert-size-normal-icon-margin-left, 12px)}.kbq-alert.kbq-alert_normal .kbq-alert__icon.kbq-alert__icon_title .kbq-icon{margin-top:var(--kbq-alert-size-normal-icon-margin-addon-title, 2px)}.kbq-alert.kbq-alert_normal .kbq-alert__content{padding:var(--kbq-alert-size-normal-content-padding-top, 16px) var(--kbq-alert-size-normal-content-padding-right, 8px) var(--kbq-alert-size-normal-content-padding-bottom, 16px) var(--kbq-alert-size-normal-content-padding-left, 12px)}.kbq-alert.kbq-alert_normal .kbq-alert__title{margin-bottom:var(--kbq-alert-size-normal-title-margin-bottom, 4px)}.kbq-alert.kbq-alert_normal .kbq-alert__button-stack{padding-top:var(--kbq-alert-size-normal-button-stack-padding-top, 6px);padding-bottom:var(--kbq-alert-size-normal-button-stack-padding-bottom, 2px)}.kbq-alert.kbq-alert_normal .kbq-alert__close-button{margin-top:var(--kbq-alert-size-normal-close-button-margin-top, 8px);margin-left:var(--kbq-alert-size-normal-close-button-margin-left, 2px)}.kbq-alert.kbq-alert_compact{border-radius:var(--kbq-alert-size-compact-container-border-radius, 12px);padding:var(--kbq-alert-size-compact-container-padding-top, 0) var(--kbq-alert-size-compact-container-padding-right, 8px) var(--kbq-alert-size-compact-container-padding-bottom, 0) var(--kbq-alert-size-compact-container-padding-left, 16px)}.kbq-alert.kbq-alert_compact .kbq-alert__icon{margin-top:var(--kbq-alert-size-compact-icon-margin-top, 12px);margin-right:var(--kbq-alert-size-compact-icon-margin-right, 8px)}.kbq-alert.kbq-alert_compact .kbq-alert__icon.kbq-alert__icon_title .kbq-icon{margin-top:var(--kbq-alert-size-compact-icon-margin-addon-title, 2px)}.kbq-alert.kbq-alert_compact .kbq-alert__content{padding:var(--kbq-alert-size-compact-content-padding-top, 12px) var(--kbq-alert-size-compact-content-padding-right, 0) var(--kbq-alert-size-compact-content-padding-bottom, 12px) var(--kbq-alert-size-compact-content-padding-left, 0)}.kbq-alert.kbq-alert_compact .kbq-alert__title{margin-bottom:var(--kbq-alert-size-compact-title-margin-bottom, 2px)}.kbq-alert.kbq-alert_compact .kbq-alert__button-stack{padding-top:var(--kbq-alert-size-compact-button-stack-padding-top, 8px);padding-bottom:var(--kbq-alert-size-compact-button-stack-padding-bottom, 2px)}.kbq-alert.kbq-alert_compact .kbq-alert__close-button{margin-top:var(--kbq-alert-size-compact-close-button-margin-top, 8px);margin-left:var(--kbq-alert-size-compact-close-button-margin-left, 2px)}\n"] }]
58
96
  }], propDecorators: { iconItem: [{
59
97
  type: ContentChild,
60
98
  args: [KbqIconItem]
99
+ }], icon: [{
100
+ type: ContentChild,
101
+ args: [KbqIcon]
61
102
  }], title: [{
62
103
  type: ContentChild,
63
104
  args: [KbqAlertTitle]
@@ -67,6 +108,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
67
108
  }], closeButton: [{
68
109
  type: ContentChild,
69
110
  args: [KbqAlertCloseButton]
111
+ }], compact: [{
112
+ type: Input
113
+ }], alertStyle: [{
114
+ type: Input
115
+ }], alertColor: [{
116
+ type: Input
70
117
  }] } });
71
118
 
72
119
  class KbqAlertModule {
@@ -111,5 +158,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
111
158
  * Generated bundle index. Do not edit.
112
159
  */
113
160
 
114
- export { KbqAlert, KbqAlertCloseButton, KbqAlertControl, KbqAlertModule, KbqAlertTitle };
161
+ export { KbqAlert, KbqAlertCloseButton, KbqAlertColors, KbqAlertControl, KbqAlertModule, KbqAlertStyles, KbqAlertTitle };
115
162
  //# sourceMappingURL=koobiq-components-alert.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"koobiq-components-alert.mjs","sources":["../../../packages/components/alert/alert.component.ts","../../../packages/components/alert/alert.component.html","../../../packages/components/alert/alert.module.ts","../../../packages/components/alert/koobiq-components-alert.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ContentChild,\n Directive,\n ViewEncapsulation\n} from '@angular/core';\nimport { KbqIconItem } from '@koobiq/components/icon';\n\n\n@Directive({\n selector: '[kbq-alert-title]',\n host: {\n class: 'kbq-alert__title'\n }\n})\nexport class KbqAlertTitle {}\n\n@Directive({\n selector: '[kbq-alert-close-button]',\n host: {\n class: 'kbq-alert-close-button'\n }\n})\nexport class KbqAlertCloseButton {}\n\n@Directive({\n selector: '[kbq-alert-control]',\n host: {\n class: 'kbq-alert-control'\n }\n})\nexport class KbqAlertControl {}\n\n@Component({\n selector: 'kbq-alert',\n templateUrl: './alert.component.html',\n styleUrls: ['alert.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'kbq-alert',\n '[class.kbq-alert_dismissible]': 'closeButton'\n }\n})\nexport class KbqAlert {\n @ContentChild(KbqIconItem) iconItem: KbqIconItem;\n @ContentChild(KbqAlertTitle) title: KbqAlertTitle;\n @ContentChild(KbqAlertControl) control: KbqAlertControl;\n @ContentChild(KbqAlertCloseButton) closeButton: KbqAlertCloseButton;\n}\n","<div class=\"kbq-alert__icon\" *ngIf=\"iconItem\">\n <ng-content select=\"[kbq-icon-item]\"></ng-content>\n</div>\n\n<div class=\"kbq-alert__content\">\n <ng-content select=\"[kbq-alert-title]\"></ng-content>\n\n <div class=\"kbq-alert__text\">\n <ng-content></ng-content>\n </div>\n\n <div class=\"kbq-alert__controls\" *ngIf=\"control\">\n <ng-content select=\"[kbq-alert-control]\"></ng-content>\n </div>\n</div>\n\n<div class=\"kbq-alert__close-button\" [hidden]=\"!closeButton\">\n <ng-content select=\"[kbq-alert-close-button]\"></ng-content>\n</div>\n","import { A11yModule } from '@angular/cdk/a11y';\nimport { PlatformModule } from '@angular/cdk/platform';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport {\n KbqAlert,\n KbqAlertCloseButton,\n KbqAlertControl,\n KbqAlertTitle\n} from './alert.component';\n\n\n@NgModule({\n imports: [\n CommonModule,\n A11yModule,\n PlatformModule\n ],\n exports: [\n KbqAlert,\n KbqAlertTitle,\n KbqAlertCloseButton,\n KbqAlertControl\n ],\n declarations: [\n KbqAlert,\n KbqAlertTitle,\n KbqAlertCloseButton,\n KbqAlertControl\n ]\n})\nexport class KbqAlertModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"koobiq-components-alert.mjs","sources":["../../../packages/components/alert/alert.component.ts","../../../packages/components/alert/alert.component.html","../../../packages/components/alert/alert.module.ts","../../../packages/components/alert/koobiq-components-alert.ts"],"sourcesContent":["import {\n AfterContentInit,\n ChangeDetectionStrategy,\n Component,\n ContentChild,\n Directive,\n Input,\n ViewEncapsulation\n} from '@angular/core';\nimport { KbqIcon, KbqIconItem } from '@koobiq/components/icon';\n\n\nexport enum KbqAlertStyles {\n Default = 'default',\n Colored = 'colored'\n}\n\nexport enum KbqAlertColors {\n Contrast = 'contrast',\n Error = 'error',\n Warning = 'warning',\n Success = 'success',\n Theme = 'theme'\n}\n\n@Directive({\n selector: '[kbq-alert-title]',\n host: {\n class: 'kbq-alert__title'\n }\n})\nexport class KbqAlertTitle {}\n\n@Directive({\n selector: '[kbq-alert-close-button]',\n host: {\n class: 'kbq-alert-close-button'\n }\n})\nexport class KbqAlertCloseButton {}\n\n@Directive({\n selector: '[kbq-alert-control]',\n host: {\n class: 'kbq-alert-control'\n }\n})\nexport class KbqAlertControl {}\n\n@Component({\n selector: 'kbq-alert',\n templateUrl: './alert.component.html',\n styleUrls: ['alert.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'kbq-alert',\n '[class]': 'alertColor',\n '[class.kbq-alert_normal]': '!compact',\n '[class.kbq-alert_compact]': 'compact',\n '[class.kbq-alert_default]': '!isColored',\n '[class.kbq-alert_colored]': 'isColored',\n '[class.kbq-alert_dismissible]': 'closeButton'\n }\n})\nexport class KbqAlert implements AfterContentInit {\n @ContentChild(KbqIconItem) iconItem: KbqIconItem;\n @ContentChild(KbqIcon) icon: KbqIcon;\n @ContentChild(KbqAlertTitle) title: KbqAlertTitle;\n @ContentChild(KbqAlertControl) control: KbqAlertControl;\n @ContentChild(KbqAlertCloseButton) closeButton: KbqAlertCloseButton;\n\n @Input() compact: boolean = false;\n @Input() alertStyle: KbqAlertStyles | string = KbqAlertStyles.Default;\n\n @Input()\n get alertColor(): string {\n return `kbq-alert_${this._alertColor}`;\n }\n\n set alertColor(value: string | KbqAlertColors) {\n this._alertColor = value || KbqAlertColors.Contrast;\n }\n\n private _alertColor: string | KbqAlertColors = KbqAlertColors.Contrast;\n\n get isColored(): boolean {\n return this.alertStyle === KbqAlertStyles.Colored\n }\n\n ngAfterContentInit(): void {\n const icon = this.icon || this.iconItem;\n\n if (icon) {\n icon.color = this._alertColor;\n }\n }\n}\n\n","<div class=\"kbq-alert__icon\" [class.kbq-alert__icon_title]=\"title\" *ngIf=\"iconItem || icon\">\n <ng-content select=\"[kbq-icon-item],[kbq-icon]\"></ng-content>\n</div>\n\n<div class=\"kbq-alert__content\" [class.kbq-alert__content_title]=\"title\">\n <ng-content select=\"[kbq-alert-title]\"></ng-content>\n\n <div class=\"kbq-alert__text\">\n <ng-content></ng-content>\n </div>\n\n <div class=\"kbq-alert__button-stack\" *ngIf=\"control\">\n <ng-content select=\"[kbq-alert-control]\"></ng-content>\n </div>\n</div>\n\n<div class=\"kbq-alert__close-button\" [hidden]=\"!closeButton\">\n <ng-content select=\"[kbq-alert-close-button]\"></ng-content>\n</div>\n","import { A11yModule } from '@angular/cdk/a11y';\nimport { PlatformModule } from '@angular/cdk/platform';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\n\nimport {\n KbqAlert,\n KbqAlertCloseButton,\n KbqAlertControl,\n KbqAlertTitle\n} from './alert.component';\n\n\n@NgModule({\n imports: [\n CommonModule,\n A11yModule,\n PlatformModule\n ],\n exports: [\n KbqAlert,\n KbqAlertTitle,\n KbqAlertCloseButton,\n KbqAlertControl\n ],\n declarations: [\n KbqAlert,\n KbqAlertTitle,\n KbqAlertCloseButton,\n KbqAlertControl\n ]\n})\nexport class KbqAlertModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1,20 +1,21 @@
1
- import * as i2 from '@angular/common';
1
+ import * as i3 from '@angular/common';
2
2
  import { CommonModule } from '@angular/common';
3
3
  import * as i0 from '@angular/core';
4
4
  import { EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, Input, Output, InjectionToken, Optional, Inject, NgModule } from '@angular/core';
5
- import * as i2$1 from '@koobiq/components/button';
5
+ import * as i2 from '@koobiq/components/button';
6
6
  import { KbqButtonModule } from '@koobiq/components/button';
7
7
  import * as i4 from '@koobiq/components/icon';
8
8
  import { KbqIconModule } from '@koobiq/components/icon';
9
- import * as i6 from '@koobiq/components/tabs';
9
+ import * as i7 from '@koobiq/components/tabs';
10
10
  import { KbqTabGroup, KbqTabsModule } from '@koobiq/components/tabs';
11
- import * as i3 from '@koobiq/components/tooltip';
11
+ import * as i3$1 from '@koobiq/components/tooltip';
12
12
  import { KbqToolTipModule } from '@koobiq/components/tooltip';
13
- import * as i5 from 'ngx-highlightjs';
13
+ import * as i6 from 'ngx-highlightjs';
14
14
  import { HighlightModule, HIGHLIGHT_OPTIONS } from 'ngx-highlightjs';
15
- import { filter, debounceTime } from 'rxjs/operators';
15
+ import { filter, debounceTime, startWith, switchMap } from 'rxjs/operators';
16
16
  import * as i1 from '@angular/cdk/clipboard';
17
- import { Subject, Subscription } from 'rxjs';
17
+ import { Subject, Subscription, pairwise } from 'rxjs';
18
+ import * as i2$1 from '@angular/cdk/a11y';
18
19
 
19
20
  class KbqActionBarComponent {
20
21
  constructor() {
@@ -42,14 +43,14 @@ class KbqActionBarComponent {
42
43
  });
43
44
  }
44
45
  /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqActionBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
45
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqActionBarComponent, selector: "kbq-actionbar-block", inputs: { config: "config", codeFiles: "codeFiles", lessContrast: "lessContrast", selectedTabIndex: "selectedTabIndex", multiLine: "multiLine", softWrap: "softWrap" }, outputs: { toggleSoftWrap: "toggleSoftWrap", downloadCode: "downloadCode", copyCode: "copyCode", openExternalSystem: "openExternalSystem" }, host: { properties: { "class.kbq-code-block-actionbar_less-contrast": "lessContrast" }, classAttribute: "kbq-code-block-actionbar" }, viewQueries: [{ propertyName: "copyTooltip", first: true, predicate: ["copyTooltip"], descendants: true }], ngImport: i0, template: "<div class=\"kbq-code-block__fade-gradient\"></div>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n *ngIf=\"multiLine\"\n [kbqTooltip]=\"softWrap ? config.softWrapOffTooltip : config.softWrapOnTooltip\"\n (click)=\"toggleSoftWrap.emit()\">\n <i *ngIf=\"!softWrap\" kbq-icon=\"mc-word-wrap_16\"></i>\n <i *ngIf=\"softWrap\" kbq-icon=\"mc-word-wrap-slash_16\"></i>\n</button>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n [kbqTooltip]=\"config.downloadTooltip\"\n (click)=\"downloadCode.emit()\">\n <i kbq-icon=\"mc-download_16\"></i>\n</button>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n #copyTooltip=\"kbqTooltip\"\n [kbqTooltip]=\"copyTooltipText\"\n (click)=\"onCopy()\">\n <i kbq-icon=\"mc-copy-o_16\"></i>\n</button>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n *ngIf=\"codeFiles[selectedTabIndex].link\"\n [kbqTooltip]=\"config.openExternalSystemTooltip\"\n (click)=\"openExternalSystem.emit()\">\n <i kbq-icon=\"mc-external-link_16\"></i>\n</button>\n", styles: [".kbq-code-block-actionbar{display:flex;justify-content:right;align-items:center;position:absolute;top:-1px;right:0;padding:var(--kbq-code-block-size-actionbar-padding-vertical, 8px) var(--kbq-code-block-size-actionbar-padding-horizontal, 12px);gap:var(--kbq-code-block-size-actionbar-content-gap-horizontal, 2px)}.kbq-code-block-actionbar .kbq-code-block__fade-gradient{display:none;width:var(--kbq-code-block-size-actionbar-fade-gradient-width, 36px);height:40px;margin-top:calc(var(--kbq-code-block-size-actionbar-padding-vertical, 8px) * -1)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.KbqButton, selector: "[kbq-button]", inputs: ["color", "tabIndex", "kbqStyle", "disabled"] }, { kind: "directive", type: i2$1.KbqButtonCssStyler, selector: "[kbq-button]" }, { kind: "directive", type: i3.KbqTooltipTrigger, selector: "[kbqTooltip]", inputs: ["kbqVisible", "kbqPlacement", "kbqPlacementPriority", "kbqTooltip", "kbqTooltipDisabled", "kbqEnterDelay", "kbqLeaveDelay", "kbqTrigger", "kbqTooltipClass", "kbqTooltipColor"], outputs: ["kbqPlacementChange", "kbqVisibleChange"], exportAs: ["kbqTooltip"] }, { kind: "component", type: i4.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
46
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqActionBarComponent, selector: "kbq-actionbar-block", inputs: { config: "config", codeFiles: "codeFiles", lessContrast: "lessContrast", selectedTabIndex: "selectedTabIndex", multiLine: "multiLine", softWrap: "softWrap" }, outputs: { toggleSoftWrap: "toggleSoftWrap", downloadCode: "downloadCode", copyCode: "copyCode", openExternalSystem: "openExternalSystem" }, host: { properties: { "class.kbq-code-block-actionbar_less-contrast": "lessContrast" }, classAttribute: "kbq-code-block-actionbar" }, viewQueries: [{ propertyName: "copyTooltip", first: true, predicate: ["copyTooltip"], descendants: true }], ngImport: i0, template: "<div class=\"kbq-code-block__fade-gradient\"></div>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n *ngIf=\"multiLine\"\n [kbqTooltip]=\"softWrap ? config.softWrapOffTooltip : config.softWrapOnTooltip\"\n (click)=\"toggleSoftWrap.emit()\">\n <i *ngIf=\"!softWrap\" kbq-icon=\"mc-word-wrap_16\"></i>\n <i *ngIf=\"softWrap\" kbq-icon=\"mc-word-wrap-slash_16\"></i>\n</button>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n [kbqTooltip]=\"config.downloadTooltip\"\n (click)=\"downloadCode.emit()\">\n <i kbq-icon=\"mc-download_16\"></i>\n</button>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n #copyTooltip=\"kbqTooltip\"\n [kbqTooltip]=\"copyTooltipText\"\n (click)=\"onCopy()\">\n <i kbq-icon=\"mc-copy-o_16\"></i>\n</button>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n *ngIf=\"codeFiles[selectedTabIndex].link\"\n [kbqTooltip]=\"config.openExternalSystemTooltip\"\n (click)=\"openExternalSystem.emit()\">\n <i kbq-icon=\"mc-external-link_16\"></i>\n</button>\n", styles: [".kbq-code-block-actionbar{display:flex;justify-content:right;align-items:center;position:absolute;top:-1px;right:0;margin:var(--kbq-code-block-size-actionbar-padding-vertical, 8px) var(--kbq-code-block-size-actionbar-padding-horizontal, 12px);gap:var(--kbq-code-block-size-actionbar-content-gap-horizontal, 2px)}.kbq-code-block-actionbar .kbq-code-block__fade-gradient{display:none;width:var(--kbq-code-block-size-actionbar-fade-gradient-width, 36px);height:32px;margin-top:calc(var(--kbq-code-block-size-actionbar-padding-vertical, 8px) * -1)}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.KbqButton, selector: "[kbq-button]", inputs: ["color", "tabIndex", "kbqStyle", "disabled"] }, { kind: "directive", type: i2.KbqButtonCssStyler, selector: "[kbq-button]" }, { kind: "directive", type: i3$1.KbqTooltipTrigger, selector: "[kbqTooltip]", inputs: ["kbqVisible", "kbqPlacement", "kbqPlacementPriority", "kbqTooltip", "kbqTooltipDisabled", "kbqEnterDelay", "kbqLeaveDelay", "kbqTrigger", "kbqTooltipClass", "kbqTooltipColor"], outputs: ["kbqPlacementChange", "kbqVisibleChange"], exportAs: ["kbqTooltip"] }, { kind: "component", type: i4.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
46
47
  }
47
48
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqActionBarComponent, decorators: [{
48
49
  type: Component,
49
50
  args: [{ selector: 'kbq-actionbar-block', host: {
50
51
  class: 'kbq-code-block-actionbar',
51
52
  '[class.kbq-code-block-actionbar_less-contrast]': 'lessContrast'
52
- }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kbq-code-block__fade-gradient\"></div>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n *ngIf=\"multiLine\"\n [kbqTooltip]=\"softWrap ? config.softWrapOffTooltip : config.softWrapOnTooltip\"\n (click)=\"toggleSoftWrap.emit()\">\n <i *ngIf=\"!softWrap\" kbq-icon=\"mc-word-wrap_16\"></i>\n <i *ngIf=\"softWrap\" kbq-icon=\"mc-word-wrap-slash_16\"></i>\n</button>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n [kbqTooltip]=\"config.downloadTooltip\"\n (click)=\"downloadCode.emit()\">\n <i kbq-icon=\"mc-download_16\"></i>\n</button>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n #copyTooltip=\"kbqTooltip\"\n [kbqTooltip]=\"copyTooltipText\"\n (click)=\"onCopy()\">\n <i kbq-icon=\"mc-copy-o_16\"></i>\n</button>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n *ngIf=\"codeFiles[selectedTabIndex].link\"\n [kbqTooltip]=\"config.openExternalSystemTooltip\"\n (click)=\"openExternalSystem.emit()\">\n <i kbq-icon=\"mc-external-link_16\"></i>\n</button>\n", styles: [".kbq-code-block-actionbar{display:flex;justify-content:right;align-items:center;position:absolute;top:-1px;right:0;padding:var(--kbq-code-block-size-actionbar-padding-vertical, 8px) var(--kbq-code-block-size-actionbar-padding-horizontal, 12px);gap:var(--kbq-code-block-size-actionbar-content-gap-horizontal, 2px)}.kbq-code-block-actionbar .kbq-code-block__fade-gradient{display:none;width:var(--kbq-code-block-size-actionbar-fade-gradient-width, 36px);height:40px;margin-top:calc(var(--kbq-code-block-size-actionbar-padding-vertical, 8px) * -1)}\n"] }]
53
+ }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"kbq-code-block__fade-gradient\"></div>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n *ngIf=\"multiLine\"\n [kbqTooltip]=\"softWrap ? config.softWrapOffTooltip : config.softWrapOnTooltip\"\n (click)=\"toggleSoftWrap.emit()\">\n <i *ngIf=\"!softWrap\" kbq-icon=\"mc-word-wrap_16\"></i>\n <i *ngIf=\"softWrap\" kbq-icon=\"mc-word-wrap-slash_16\"></i>\n</button>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n [kbqTooltip]=\"config.downloadTooltip\"\n (click)=\"downloadCode.emit()\">\n <i kbq-icon=\"mc-download_16\"></i>\n</button>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n #copyTooltip=\"kbqTooltip\"\n [kbqTooltip]=\"copyTooltipText\"\n (click)=\"onCopy()\">\n <i kbq-icon=\"mc-copy-o_16\"></i>\n</button>\n\n<button kbq-button\n [color]=\"'contrast'\"\n [kbqStyle]=\"'transparent'\"\n *ngIf=\"codeFiles[selectedTabIndex].link\"\n [kbqTooltip]=\"config.openExternalSystemTooltip\"\n (click)=\"openExternalSystem.emit()\">\n <i kbq-icon=\"mc-external-link_16\"></i>\n</button>\n", styles: [".kbq-code-block-actionbar{display:flex;justify-content:right;align-items:center;position:absolute;top:-1px;right:0;margin:var(--kbq-code-block-size-actionbar-padding-vertical, 8px) var(--kbq-code-block-size-actionbar-padding-horizontal, 12px);gap:var(--kbq-code-block-size-actionbar-content-gap-horizontal, 2px)}.kbq-code-block-actionbar .kbq-code-block__fade-gradient{display:none;width:var(--kbq-code-block-size-actionbar-fade-gradient-width, 36px);height:32px;margin-top:calc(var(--kbq-code-block-size-actionbar-padding-vertical, 8px) * -1)}\n"] }]
53
54
  }], propDecorators: { copyTooltip: [{
54
55
  type: ViewChild,
55
56
  args: ['copyTooltip']
@@ -107,6 +108,10 @@ const KBQ_CODE_BLOCK_DEFAULT_CONFIGURATION = {
107
108
  openExternalSystemTooltip: 'Открыть во внешней системе'
108
109
  };
109
110
  const actionBarBlockLeftMargin = 24;
111
+ const hasScroll = (element) => {
112
+ const { scrollHeight, scrollWidth, clientHeight, clientWidth } = element;
113
+ return scrollHeight > clientHeight || scrollWidth > clientWidth;
114
+ };
110
115
  class KbqCodeBlockComponent {
111
116
  get noHeader() {
112
117
  return this.codeFiles.length === 1 && !this.codeFiles[0].filename;
@@ -114,11 +119,12 @@ class KbqCodeBlockComponent {
114
119
  get singleFile() {
115
120
  return this.codeFiles.length === 1;
116
121
  }
117
- constructor(elementRef, changeDetectorRef, clipboard, renderer, config) {
122
+ constructor(elementRef, changeDetectorRef, clipboard, renderer, focusMonitor, config) {
118
123
  this.elementRef = elementRef;
119
124
  this.changeDetectorRef = changeDetectorRef;
120
125
  this.clipboard = clipboard;
121
126
  this.renderer = renderer;
127
+ this.focusMonitor = focusMonitor;
122
128
  this.config = config;
123
129
  this.lineNumbers = true;
124
130
  this.softWrap = false;
@@ -127,9 +133,12 @@ class KbqCodeBlockComponent {
127
133
  this.viewAll = false;
128
134
  this.multiLine = false;
129
135
  this.isTopOverflow = false;
136
+ this.hasFocus = false;
130
137
  this.resizeStream = new Subject();
138
+ this.currentCodeBlock = new Subject();
131
139
  this.resizeDebounceInterval = 100;
132
140
  this.resizeSubscription = Subscription.EMPTY;
141
+ this.codeBlockSubscription = Subscription.EMPTY;
133
142
  this.updateHeader = () => {
134
143
  const clientWidth = this.elementRef.nativeElement.querySelector('kbq-actionbar-block').clientWidth;
135
144
  this.renderer.setStyle(this.tabGroup.tabHeader.elementRef.nativeElement, 'padding-right', `${actionBarBlockLeftMargin + clientWidth}px`);
@@ -146,8 +155,23 @@ class KbqCodeBlockComponent {
146
155
  .pipe(debounceTime(this.resizeDebounceInterval))
147
156
  .subscribe(this.updateHeader);
148
157
  }
158
+ ngAfterViewInit() {
159
+ // render focus border if origin is keyboard
160
+ this.codeBlockSubscription = this.currentCodeBlock.pipe(startWith(null), pairwise(), switchMap(([prev, current]) => {
161
+ if (prev) {
162
+ this.focusMonitor.stopMonitoring(prev);
163
+ }
164
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
165
+ return this.focusMonitor.monitor(current).pipe(filter((origin) => origin === 'keyboard'));
166
+ })).subscribe(() => {
167
+ this.hasFocus = true;
168
+ this.changeDetectorRef.markForCheck();
169
+ });
170
+ this.currentCodeBlock.next(this.elementRef.nativeElement.querySelector('code'));
171
+ }
149
172
  ngOnDestroy() {
150
173
  this.resizeSubscription.unsubscribe();
174
+ this.codeBlockSubscription.unsubscribe();
151
175
  }
152
176
  toggleSoftWrap() {
153
177
  this.softWrap = !this.softWrap;
@@ -183,6 +207,7 @@ class KbqCodeBlockComponent {
183
207
  this.updateMultiline();
184
208
  this.isTopOverflow = false;
185
209
  setTimeout(this.updateHeader);
210
+ setTimeout(() => this.currentCodeBlock.next(this.elementRef.nativeElement.querySelector('code')));
186
211
  }
187
212
  checkOverflow(currentCodeContentElement) {
188
213
  if (this.noHeader) {
@@ -197,13 +222,31 @@ class KbqCodeBlockComponent {
197
222
  currentCodeContentElement?.scroll({ top: 0, behavior: 'instant' });
198
223
  }
199
224
  }
225
+ // TODO: replace with property to reduce calculations
226
+ canShowFocus(currentCodeContent) {
227
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
228
+ const currentCodeBlock = currentCodeContent.querySelector('code');
229
+ return (hasScroll(currentCodeContent) || hasScroll(currentCodeBlock))
230
+ && (!!this.maxHeight && this.viewAll || !this.maxHeight);
231
+ }
200
232
  getFullFileName(codeFile) {
201
233
  const fileName = codeFile.filename || 'code';
202
234
  const extension = LANGUAGES_EXTENSIONS[codeFile.language] || DEFAULT_EXTENSION;
203
235
  return `${fileName}.${extension}`;
204
236
  }
205
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqCodeBlockComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.Clipboard }, { token: i0.Renderer2 }, { token: KBQ_CODE_BLOCK_CONFIGURATION, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
206
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqCodeBlockComponent, selector: "kbq-code-block", inputs: { lineNumbers: "lineNumbers", codeFiles: "codeFiles", filled: "filled", maxHeight: "maxHeight", softWrap: "softWrap" }, host: { listeners: { "window:resize": "resizeStream.next($event)" }, 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_single-file": "singleFile", "class.kbq-code-block_no-header": "noHeader", "class.kbq-code-block_header-with-shadow": "isTopOverflow" }, classAttribute: "kbq-code-block" }, viewQueries: [{ propertyName: "tabGroup", first: true, predicate: KbqTabGroup, descendants: true }], exportAs: ["kbqCodeBlock"], ngImport: i0, template: "<kbq-tab-group (selectedTabChange)=\"onSelectTab($event)\">\n <kbq-tab\n *ngFor=\"let codeFile of codeFiles; let i = index\"\n [disabled]=\"singleFile\">\n\n <ng-template kbq-tab-label>{{ codeFile.filename }}</ng-template>\n\n <pre class=\"kbq-code-block__code kbq-scrollbar\"\n #codeContent\n [style.max-height]=\"getMaxHeight()\"\n [class.kbq-code-block__code_soft-wrap]=\"softWrap\"\n [class.kbq-code-block__code_view-all]=\"viewAll\"\n (scroll)=\"checkOverflow(codeContent)\"\n ><code class=\"hljs\"\n [id]=\"codeFile.filename + '_' + i\"\n [class.hljs-line-numbers]=\"lineNumbers\"\n [highlight]=\"codeFiles[i].content\"\n [lineNumbers]=\"true\"\n (highlighted)=\"onHighlighted()\">\n </code><kbq-actionbar-block\n [class.kbq-actionbar-block_floating]=\"noHeader\"\n [config]=\"config\"\n [codeFiles]=\"codeFiles\"\n [selectedTabIndex]=\"selectedTabIndex\"\n [lessContrast]=\"filled\"\n [multiLine]=\"multiLine\"\n [softWrap]=\"softWrap\"\n (toggleSoftWrap)=\"toggleSoftWrap()\"\n (downloadCode)=\"downloadCode()\"\n (copyCode)=\"copyCode()\"\n (openExternalSystem)=\"openExternalSystem()\">\n </kbq-actionbar-block></pre>\n\n <div class=\"kbq-code-block__show-more\"\n *ngIf=\"maxHeight\"\n [class.kbq-code-block__show-more_expanded]=\"viewAll\"\n [class.kbq-code-block__show-more_collapsed]=\"!viewAll\">\n <span class=\"bg-wrapper\">\n <button\n [color]=\"'theme'\"\n [kbqStyle]=\"'transparent'\"\n kbq-button\n (click)=\"onShowMoreClick(codeContent)\">\n <i kbq-icon=\"mc-angle-down-L_16\" *ngIf=\"!viewAll\"></i>\n <i kbq-icon=\"mc-angle-up-L_16\" *ngIf=\"viewAll\"></i>\n {{ viewAll ? config.viewLessText : config.viewAllText}}\n </button>\n </span>\n </div>\n </kbq-tab>\n</kbq-tab-group>\n", styles: [".kbq-code-block{display:block;position:relative;overflow:hidden;box-sizing:border-box;hyphens:none;-ms-hyphens:none;-moz-hyphens:none;-webkit-hyphens:none;border-width:var(--kbq-code-block-size-container-border-width, 1px);border-style:solid;border-radius:var(--kbq-code-block-size-container-border-radius, 12px)}.kbq-code-block .kbq-tab-header{padding:var(--kbq-code-block-size-header-padding-vertical, 8px) calc(var(--kbq-code-block-size-header-padding-right, 8px) + 152px) var(--kbq-code-block-size-header-padding-vertical, 8px) var(--kbq-code-block-size-header-padding-left, 12px)}.kbq-code-block .kbq-code-block__code>code{padding:var(--kbq-code-block-size-with-header-content-padding-top, 4px) var(--kbq-code-block-size-with-header-content-padding-horizontal, 20px) var(--kbq-code-block-size-with-header-content-padding-bottom, 16px) var(--kbq-code-block-size-with-header-content-padding-horizontal, 20px)}.kbq-code-block .kbq-code-block__code .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-with-header-content-content-gap-horizontal, 12px)}.kbq-code-block.kbq-code-block_hide-line-numbers .hljs-ln-line.hljs-ln-numbers{display:none}.kbq-code-block.kbq-code-block_single-file .kbq-tab-label:before{content:none}.kbq-code-block.kbq-code-block_single-file .kbq-tab-label:hover{background:transparent!important}.kbq-code-block.kbq-code-block_no-header .kbq-tab-header{display:none}.kbq-code-block.kbq-code-block_no-header .kbq-code-block__code{position:relative}.kbq-code-block.kbq-code-block_no-header .kbq-code-block__code>code{padding:var(--kbq-code-block-size-no-header-content-padding-vertical, 14px) var(--kbq-code-block-size-no-header-content-padding-horizontal, 20px)}.kbq-code-block.kbq-code-block_no-header .kbq-code-block__code .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-no-header-content-content-gap-horizontal, 12px)}.kbq-code-block:not(:has(.kbq-code-block__show-more)) .kbq-code-block__code{overflow-y:auto}.kbq-code-block pre{margin:0}.kbq-code-block .kbq-tab-body__wrapper{flex-direction:column;position:unset}.kbq-code-block .kbq-tab-body.kbq-tab-body__active{position:unset}.kbq-code-block__code{overflow-y:hidden}.kbq-code-block__code.kbq-code-block__code_view-all{max-height:unset;overflow-y:auto}.kbq-code-block__code.kbq-code-block__code_soft-wrap{white-space:pre-wrap}.kbq-code-block__code .hljs-ln{border-collapse:unset}.kbq-code-block__code .hljs-ln .hljs{padding:0}.kbq-code-block__code .hljs-ln-numbers{vertical-align:baseline;text-align:right}.kbq-code-block__code .hljs-ln-n:before{white-space:nowrap}.kbq-code-block__show-more{display:flex;justify-content:center;overflow:hidden;width:100%;position:absolute;bottom:0}.kbq-code-block__show-more.kbq-code-block__show-more_collapsed{padding-top:var(--kbq-code-block-size-collapse-collapsed-padding-top, 32px);padding-bottom:var(--kbq-code-block-size-collapse-collapsed-padding-bottom, 16px)}.kbq-code-block__show-more.kbq-code-block__show-more_expanded{padding-top:var(--kbq-code-block-size-collapse-expanded-padding-top, 0);margin-bottom:var(--kbq-code-block-size-collapse-expanded-padding-bottom, 16px)}.kbq-code-block__show-more .bg-wrapper{border-radius:var(--kbq-button-size-border-radius, 8px)}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.KbqButton, selector: "[kbq-button]", inputs: ["color", "tabIndex", "kbqStyle", "disabled"] }, { kind: "directive", type: i2$1.KbqButtonCssStyler, selector: "[kbq-button]" }, { kind: "component", type: i4.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }, { kind: "directive", type: i5.Highlight, selector: "[highlight]", inputs: ["highlight", "languages", "lineNumbers"], outputs: ["highlighted"] }, { kind: "component", type: i6.KbqTabGroup, selector: "kbq-tab-group", inputs: ["disabled", "transparent", "onSurface", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["kbqTabGroup"] }, { kind: "directive", type: i6.KbqTabLabel, selector: "[kbq-tab-label], [kbqTabLabel]" }, { kind: "component", type: i6.KbqTab, selector: "kbq-tab", inputs: ["disabled", "tooltipTitle", "tooltipPlacement", "label", "empty", "tabId"], exportAs: ["kbqTab"] }, { kind: "component", type: KbqActionBarComponent, selector: "kbq-actionbar-block", inputs: ["config", "codeFiles", "lessContrast", "selectedTabIndex", "multiLine", "softWrap"], outputs: ["toggleSoftWrap", "downloadCode", "copyCode", "openExternalSystem"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
237
+ onEnter(currentCodeBlock) {
238
+ // defer execution after toggle view mode
239
+ setTimeout(() => {
240
+ if (this.canShowFocus(currentCodeBlock)) {
241
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
242
+ this.focusMonitor.focusVia(
243
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
244
+ currentCodeBlock.querySelector('code'), 'keyboard');
245
+ }
246
+ }, 0);
247
+ }
248
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqCodeBlockComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.Clipboard }, { token: i0.Renderer2 }, { token: i2$1.FocusMonitor }, { token: KBQ_CODE_BLOCK_CONFIGURATION, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
249
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.0", type: KbqCodeBlockComponent, selector: "kbq-code-block", inputs: { lineNumbers: "lineNumbers", codeFiles: "codeFiles", filled: "filled", maxHeight: "maxHeight", softWrap: "softWrap" }, host: { listeners: { "window:resize": "resizeStream.next($event)" }, 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_single-file": "singleFile", "class.kbq-code-block_no-header": "noHeader", "class.kbq-code-block_header-with-shadow": "isTopOverflow" }, classAttribute: "kbq-code-block" }, viewQueries: [{ propertyName: "tabGroup", first: true, predicate: KbqTabGroup, descendants: true }], exportAs: ["kbqCodeBlock"], ngImport: i0, template: "<kbq-tab-group\n [class.kbq-focused]=\"hasFocus\"\n (selectedTabChange)=\"onSelectTab($event)\">\n <kbq-tab\n *ngFor=\"let codeFile of codeFiles; let i = index\"\n [disabled]=\"singleFile\">\n\n <ng-template kbq-tab-label>{{ codeFile.filename }}</ng-template>\n\n <pre class=\"kbq-code-block__code kbq-scrollbar\"\n #codeContent\n [style.max-height]=\"getMaxHeight()\"\n [class.kbq-code-block__code_soft-wrap]=\"softWrap\"\n [class.kbq-code-block__code_view-all]=\"viewAll\"\n (scroll)=\"checkOverflow(codeContent)\"\n ><kbq-actionbar-block\n [class.kbq-actionbar-block_floating]=\"noHeader\"\n [config]=\"config\"\n [codeFiles]=\"codeFiles\"\n [selectedTabIndex]=\"selectedTabIndex\"\n [lessContrast]=\"filled\"\n [multiLine]=\"multiLine\"\n [softWrap]=\"softWrap\"\n (toggleSoftWrap)=\"toggleSoftWrap()\"\n (downloadCode)=\"downloadCode()\"\n (copyCode)=\"copyCode()\"\n (openExternalSystem)=\"openExternalSystem()\">\n </kbq-actionbar-block><code class=\"hljs\"\n [id]=\"codeFile.filename + '_' + i\"\n [class.hljs-line-numbers]=\"lineNumbers\"\n [highlight]=\"codeFiles[i].content\"\n [lineNumbers]=\"true\"\n [tabIndex]=\"canShowFocus(codeContent) ? 0 : -1\"\n (highlighted)=\"onHighlighted()\"\n (blur)=\"hasFocus = false\">\n </code></pre>\n\n <div class=\"kbq-code-block__show-more\"\n *ngIf=\"maxHeight\"\n [class.kbq-code-block__show-more_expanded]=\"viewAll\"\n [class.kbq-code-block__show-more_collapsed]=\"!viewAll\">\n <span class=\"bg-wrapper\">\n <button\n [color]=\"'theme'\"\n [kbqStyle]=\"'transparent'\"\n kbq-button\n (keydown.enter)=\"onEnter(codeContent)\"\n (click)=\"onShowMoreClick(codeContent)\">\n <i kbq-icon=\"mc-angle-down-L_16\" *ngIf=\"!viewAll\"></i>\n <i kbq-icon=\"mc-angle-up-L_16\" *ngIf=\"viewAll\"></i>\n {{ viewAll ? config.viewLessText : config.viewAllText}}\n </button>\n </span>\n </div>\n </kbq-tab>\n</kbq-tab-group>\n", styles: [".kbq-code-block{display:block;position:relative;overflow:hidden;box-sizing:border-box;hyphens:none;-ms-hyphens:none;-moz-hyphens:none;-webkit-hyphens:none;border-radius:var(--kbq-code-block-size-container-border-radius, 12px);border-width:0}.kbq-code-block .kbq-tab-header{padding:var(--kbq-code-block-size-header-padding-vertical, 8px) calc(var(--kbq-code-block-size-header-padding-right, 8px) + 152px) var(--kbq-code-block-size-header-padding-vertical, 8px) var(--kbq-code-block-size-header-padding-left, 12px);border-width:var(--kbq-code-block-size-container-border-width, 1px) var(--kbq-code-block-size-container-border-width, 1px) 0 var(--kbq-code-block-size-container-border-width, 1px);border-style:solid;border-radius:var(--kbq-code-block-size-container-border-radius, 12px) var(--kbq-code-block-size-container-border-radius, 12px) 0 0}.kbq-code-block .kbq-code-block__code>code{padding:var(--kbq-code-block-size-with-header-content-padding-top, 4px) var(--kbq-code-block-size-with-header-content-padding-horizontal, 20px) var(--kbq-code-block-size-with-header-content-padding-bottom, 16px) var(--kbq-code-block-size-with-header-content-padding-horizontal, 20px);border-radius:var(--kbq-code-block-size-container-border-radius, 12px)}.kbq-code-block .kbq-code-block__code>code:focus-visible{outline:none}.kbq-code-block .kbq-code-block__code .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-with-header-content-content-gap-horizontal, 12px)}.kbq-code-block.kbq-code-block_hide-line-numbers .hljs-ln-line.hljs-ln-numbers{display:none}.kbq-code-block.kbq-code-block_single-file .kbq-tab-label:before{content:none}.kbq-code-block.kbq-code-block_single-file .kbq-tab-label:hover{background:transparent!important}.kbq-code-block:not(.kbq-code-block_no-header) .kbq-tab-body__wrapper{border-top-width:0}.kbq-code-block.kbq-code-block_no-header .kbq-tab-header{display:none}.kbq-code-block.kbq-code-block_no-header .kbq-tab-body__wrapper{border-width:var(--kbq-code-block-size-container-border-width, 1px);border-radius:var(--kbq-code-block-size-container-border-radius, 12px)}.kbq-code-block.kbq-code-block_no-header .kbq-code-block__code{position:relative}.kbq-code-block.kbq-code-block_no-header .kbq-code-block__code>code{padding:var(--kbq-code-block-size-no-header-content-padding-vertical, 14px) var(--kbq-code-block-size-no-header-content-padding-horizontal, 20px)}.kbq-code-block.kbq-code-block_no-header .kbq-code-block__code .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-no-header-content-content-gap-horizontal, 12px)}.kbq-code-block:not(:has(.kbq-code-block__show-more)) .kbq-code-block__code{overflow-y:auto}.kbq-code-block pre{margin:0}.kbq-code-block .kbq-tab-body__wrapper{flex-direction:column;position:unset;border-width:var(--kbq-code-block-size-container-border-width, 1px);border-style:solid;border-radius:0 0 var(--kbq-code-block-size-container-border-radius, 12px) var(--kbq-code-block-size-container-border-radius, 12px)}.kbq-code-block .kbq-tab-body.kbq-tab-body__active{position:unset}.kbq-code-block__code{overflow-y:hidden}.kbq-code-block__code.kbq-code-block__code_view-all{max-height:unset;overflow-y:auto}.kbq-code-block__code.kbq-code-block__code_soft-wrap{white-space:pre-wrap}.kbq-code-block__code .hljs-ln{border-collapse:unset}.kbq-code-block__code .hljs-ln .hljs{padding:0}.kbq-code-block__code .hljs-ln-numbers{vertical-align:baseline;text-align:right}.kbq-code-block__code .hljs-ln-n:before{white-space:nowrap}.kbq-code-block__show-more{display:flex;justify-content:center;overflow:hidden;width:calc(100% - var(--kbq-code-block-size-container-border-width, 1px) * 2);position:absolute;bottom:var(--kbq-code-block-size-container-border-width, 1px);border-radius:var(--kbq-code-block-size-container-border-radius, 12px)}.kbq-code-block__show-more.kbq-code-block__show-more_collapsed{padding-top:var(--kbq-code-block-size-collapse-collapsed-padding-top, 32px);padding-bottom:var(--kbq-code-block-size-collapse-collapsed-padding-bottom, 16px)}.kbq-code-block__show-more.kbq-code-block__show-more_expanded{padding-top:var(--kbq-code-block-size-collapse-expanded-padding-top, 0);margin-bottom:var(--kbq-code-block-size-collapse-expanded-padding-bottom, 16px)}.kbq-code-block__show-more .bg-wrapper{border-radius:var(--kbq-button-size-border-radius, 8px)}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.KbqButton, selector: "[kbq-button]", inputs: ["color", "tabIndex", "kbqStyle", "disabled"] }, { kind: "directive", type: i2.KbqButtonCssStyler, selector: "[kbq-button]" }, { kind: "component", type: i4.KbqIcon, selector: "[kbq-icon]", inputs: ["color", "small", "autoColor"] }, { kind: "directive", type: i6.Highlight, selector: "[highlight]", inputs: ["highlight", "languages", "lineNumbers"], outputs: ["highlighted"] }, { kind: "component", type: i7.KbqTabGroup, selector: "kbq-tab-group", inputs: ["disabled", "transparent", "onSurface", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["kbqTabGroup"] }, { kind: "directive", type: i7.KbqTabLabel, selector: "[kbq-tab-label], [kbqTabLabel]" }, { kind: "component", type: i7.KbqTab, selector: "kbq-tab", inputs: ["disabled", "tooltipTitle", "tooltipPlacement", "label", "empty", "tabId"], exportAs: ["kbqTab"] }, { kind: "component", type: KbqActionBarComponent, selector: "kbq-actionbar-block", inputs: ["config", "codeFiles", "lessContrast", "selectedTabIndex", "multiLine", "softWrap"], outputs: ["toggleSoftWrap", "downloadCode", "copyCode", "openExternalSystem"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
207
250
  }
208
251
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImport: i0, type: KbqCodeBlockComponent, decorators: [{
209
252
  type: Component,
@@ -216,8 +259,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.0", ngImpor
216
259
  '[class.kbq-code-block_no-header]': 'noHeader',
217
260
  '[class.kbq-code-block_header-with-shadow]': 'isTopOverflow',
218
261
  '(window:resize)': 'resizeStream.next($event)'
219
- }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<kbq-tab-group (selectedTabChange)=\"onSelectTab($event)\">\n <kbq-tab\n *ngFor=\"let codeFile of codeFiles; let i = index\"\n [disabled]=\"singleFile\">\n\n <ng-template kbq-tab-label>{{ codeFile.filename }}</ng-template>\n\n <pre class=\"kbq-code-block__code kbq-scrollbar\"\n #codeContent\n [style.max-height]=\"getMaxHeight()\"\n [class.kbq-code-block__code_soft-wrap]=\"softWrap\"\n [class.kbq-code-block__code_view-all]=\"viewAll\"\n (scroll)=\"checkOverflow(codeContent)\"\n ><code class=\"hljs\"\n [id]=\"codeFile.filename + '_' + i\"\n [class.hljs-line-numbers]=\"lineNumbers\"\n [highlight]=\"codeFiles[i].content\"\n [lineNumbers]=\"true\"\n (highlighted)=\"onHighlighted()\">\n </code><kbq-actionbar-block\n [class.kbq-actionbar-block_floating]=\"noHeader\"\n [config]=\"config\"\n [codeFiles]=\"codeFiles\"\n [selectedTabIndex]=\"selectedTabIndex\"\n [lessContrast]=\"filled\"\n [multiLine]=\"multiLine\"\n [softWrap]=\"softWrap\"\n (toggleSoftWrap)=\"toggleSoftWrap()\"\n (downloadCode)=\"downloadCode()\"\n (copyCode)=\"copyCode()\"\n (openExternalSystem)=\"openExternalSystem()\">\n </kbq-actionbar-block></pre>\n\n <div class=\"kbq-code-block__show-more\"\n *ngIf=\"maxHeight\"\n [class.kbq-code-block__show-more_expanded]=\"viewAll\"\n [class.kbq-code-block__show-more_collapsed]=\"!viewAll\">\n <span class=\"bg-wrapper\">\n <button\n [color]=\"'theme'\"\n [kbqStyle]=\"'transparent'\"\n kbq-button\n (click)=\"onShowMoreClick(codeContent)\">\n <i kbq-icon=\"mc-angle-down-L_16\" *ngIf=\"!viewAll\"></i>\n <i kbq-icon=\"mc-angle-up-L_16\" *ngIf=\"viewAll\"></i>\n {{ viewAll ? config.viewLessText : config.viewAllText}}\n </button>\n </span>\n </div>\n </kbq-tab>\n</kbq-tab-group>\n", styles: [".kbq-code-block{display:block;position:relative;overflow:hidden;box-sizing:border-box;hyphens:none;-ms-hyphens:none;-moz-hyphens:none;-webkit-hyphens:none;border-width:var(--kbq-code-block-size-container-border-width, 1px);border-style:solid;border-radius:var(--kbq-code-block-size-container-border-radius, 12px)}.kbq-code-block .kbq-tab-header{padding:var(--kbq-code-block-size-header-padding-vertical, 8px) calc(var(--kbq-code-block-size-header-padding-right, 8px) + 152px) var(--kbq-code-block-size-header-padding-vertical, 8px) var(--kbq-code-block-size-header-padding-left, 12px)}.kbq-code-block .kbq-code-block__code>code{padding:var(--kbq-code-block-size-with-header-content-padding-top, 4px) var(--kbq-code-block-size-with-header-content-padding-horizontal, 20px) var(--kbq-code-block-size-with-header-content-padding-bottom, 16px) var(--kbq-code-block-size-with-header-content-padding-horizontal, 20px)}.kbq-code-block .kbq-code-block__code .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-with-header-content-content-gap-horizontal, 12px)}.kbq-code-block.kbq-code-block_hide-line-numbers .hljs-ln-line.hljs-ln-numbers{display:none}.kbq-code-block.kbq-code-block_single-file .kbq-tab-label:before{content:none}.kbq-code-block.kbq-code-block_single-file .kbq-tab-label:hover{background:transparent!important}.kbq-code-block.kbq-code-block_no-header .kbq-tab-header{display:none}.kbq-code-block.kbq-code-block_no-header .kbq-code-block__code{position:relative}.kbq-code-block.kbq-code-block_no-header .kbq-code-block__code>code{padding:var(--kbq-code-block-size-no-header-content-padding-vertical, 14px) var(--kbq-code-block-size-no-header-content-padding-horizontal, 20px)}.kbq-code-block.kbq-code-block_no-header .kbq-code-block__code .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-no-header-content-content-gap-horizontal, 12px)}.kbq-code-block:not(:has(.kbq-code-block__show-more)) .kbq-code-block__code{overflow-y:auto}.kbq-code-block pre{margin:0}.kbq-code-block .kbq-tab-body__wrapper{flex-direction:column;position:unset}.kbq-code-block .kbq-tab-body.kbq-tab-body__active{position:unset}.kbq-code-block__code{overflow-y:hidden}.kbq-code-block__code.kbq-code-block__code_view-all{max-height:unset;overflow-y:auto}.kbq-code-block__code.kbq-code-block__code_soft-wrap{white-space:pre-wrap}.kbq-code-block__code .hljs-ln{border-collapse:unset}.kbq-code-block__code .hljs-ln .hljs{padding:0}.kbq-code-block__code .hljs-ln-numbers{vertical-align:baseline;text-align:right}.kbq-code-block__code .hljs-ln-n:before{white-space:nowrap}.kbq-code-block__show-more{display:flex;justify-content:center;overflow:hidden;width:100%;position:absolute;bottom:0}.kbq-code-block__show-more.kbq-code-block__show-more_collapsed{padding-top:var(--kbq-code-block-size-collapse-collapsed-padding-top, 32px);padding-bottom:var(--kbq-code-block-size-collapse-collapsed-padding-bottom, 16px)}.kbq-code-block__show-more.kbq-code-block__show-more_expanded{padding-top:var(--kbq-code-block-size-collapse-expanded-padding-top, 0);margin-bottom:var(--kbq-code-block-size-collapse-expanded-padding-bottom, 16px)}.kbq-code-block__show-more .bg-wrapper{border-radius:var(--kbq-button-size-border-radius, 8px)}\n"] }]
220
- }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.Clipboard }, { type: i0.Renderer2 }, { type: undefined, decorators: [{
262
+ }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<kbq-tab-group\n [class.kbq-focused]=\"hasFocus\"\n (selectedTabChange)=\"onSelectTab($event)\">\n <kbq-tab\n *ngFor=\"let codeFile of codeFiles; let i = index\"\n [disabled]=\"singleFile\">\n\n <ng-template kbq-tab-label>{{ codeFile.filename }}</ng-template>\n\n <pre class=\"kbq-code-block__code kbq-scrollbar\"\n #codeContent\n [style.max-height]=\"getMaxHeight()\"\n [class.kbq-code-block__code_soft-wrap]=\"softWrap\"\n [class.kbq-code-block__code_view-all]=\"viewAll\"\n (scroll)=\"checkOverflow(codeContent)\"\n ><kbq-actionbar-block\n [class.kbq-actionbar-block_floating]=\"noHeader\"\n [config]=\"config\"\n [codeFiles]=\"codeFiles\"\n [selectedTabIndex]=\"selectedTabIndex\"\n [lessContrast]=\"filled\"\n [multiLine]=\"multiLine\"\n [softWrap]=\"softWrap\"\n (toggleSoftWrap)=\"toggleSoftWrap()\"\n (downloadCode)=\"downloadCode()\"\n (copyCode)=\"copyCode()\"\n (openExternalSystem)=\"openExternalSystem()\">\n </kbq-actionbar-block><code class=\"hljs\"\n [id]=\"codeFile.filename + '_' + i\"\n [class.hljs-line-numbers]=\"lineNumbers\"\n [highlight]=\"codeFiles[i].content\"\n [lineNumbers]=\"true\"\n [tabIndex]=\"canShowFocus(codeContent) ? 0 : -1\"\n (highlighted)=\"onHighlighted()\"\n (blur)=\"hasFocus = false\">\n </code></pre>\n\n <div class=\"kbq-code-block__show-more\"\n *ngIf=\"maxHeight\"\n [class.kbq-code-block__show-more_expanded]=\"viewAll\"\n [class.kbq-code-block__show-more_collapsed]=\"!viewAll\">\n <span class=\"bg-wrapper\">\n <button\n [color]=\"'theme'\"\n [kbqStyle]=\"'transparent'\"\n kbq-button\n (keydown.enter)=\"onEnter(codeContent)\"\n (click)=\"onShowMoreClick(codeContent)\">\n <i kbq-icon=\"mc-angle-down-L_16\" *ngIf=\"!viewAll\"></i>\n <i kbq-icon=\"mc-angle-up-L_16\" *ngIf=\"viewAll\"></i>\n {{ viewAll ? config.viewLessText : config.viewAllText}}\n </button>\n </span>\n </div>\n </kbq-tab>\n</kbq-tab-group>\n", styles: [".kbq-code-block{display:block;position:relative;overflow:hidden;box-sizing:border-box;hyphens:none;-ms-hyphens:none;-moz-hyphens:none;-webkit-hyphens:none;border-radius:var(--kbq-code-block-size-container-border-radius, 12px);border-width:0}.kbq-code-block .kbq-tab-header{padding:var(--kbq-code-block-size-header-padding-vertical, 8px) calc(var(--kbq-code-block-size-header-padding-right, 8px) + 152px) var(--kbq-code-block-size-header-padding-vertical, 8px) var(--kbq-code-block-size-header-padding-left, 12px);border-width:var(--kbq-code-block-size-container-border-width, 1px) var(--kbq-code-block-size-container-border-width, 1px) 0 var(--kbq-code-block-size-container-border-width, 1px);border-style:solid;border-radius:var(--kbq-code-block-size-container-border-radius, 12px) var(--kbq-code-block-size-container-border-radius, 12px) 0 0}.kbq-code-block .kbq-code-block__code>code{padding:var(--kbq-code-block-size-with-header-content-padding-top, 4px) var(--kbq-code-block-size-with-header-content-padding-horizontal, 20px) var(--kbq-code-block-size-with-header-content-padding-bottom, 16px) var(--kbq-code-block-size-with-header-content-padding-horizontal, 20px);border-radius:var(--kbq-code-block-size-container-border-radius, 12px)}.kbq-code-block .kbq-code-block__code>code:focus-visible{outline:none}.kbq-code-block .kbq-code-block__code .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-with-header-content-content-gap-horizontal, 12px)}.kbq-code-block.kbq-code-block_hide-line-numbers .hljs-ln-line.hljs-ln-numbers{display:none}.kbq-code-block.kbq-code-block_single-file .kbq-tab-label:before{content:none}.kbq-code-block.kbq-code-block_single-file .kbq-tab-label:hover{background:transparent!important}.kbq-code-block:not(.kbq-code-block_no-header) .kbq-tab-body__wrapper{border-top-width:0}.kbq-code-block.kbq-code-block_no-header .kbq-tab-header{display:none}.kbq-code-block.kbq-code-block_no-header .kbq-tab-body__wrapper{border-width:var(--kbq-code-block-size-container-border-width, 1px);border-radius:var(--kbq-code-block-size-container-border-radius, 12px)}.kbq-code-block.kbq-code-block_no-header .kbq-code-block__code{position:relative}.kbq-code-block.kbq-code-block_no-header .kbq-code-block__code>code{padding:var(--kbq-code-block-size-no-header-content-padding-vertical, 14px) var(--kbq-code-block-size-no-header-content-padding-horizontal, 20px)}.kbq-code-block.kbq-code-block_no-header .kbq-code-block__code .hljs-ln-numbers{padding-right:var(--kbq-code-block-size-no-header-content-content-gap-horizontal, 12px)}.kbq-code-block:not(:has(.kbq-code-block__show-more)) .kbq-code-block__code{overflow-y:auto}.kbq-code-block pre{margin:0}.kbq-code-block .kbq-tab-body__wrapper{flex-direction:column;position:unset;border-width:var(--kbq-code-block-size-container-border-width, 1px);border-style:solid;border-radius:0 0 var(--kbq-code-block-size-container-border-radius, 12px) var(--kbq-code-block-size-container-border-radius, 12px)}.kbq-code-block .kbq-tab-body.kbq-tab-body__active{position:unset}.kbq-code-block__code{overflow-y:hidden}.kbq-code-block__code.kbq-code-block__code_view-all{max-height:unset;overflow-y:auto}.kbq-code-block__code.kbq-code-block__code_soft-wrap{white-space:pre-wrap}.kbq-code-block__code .hljs-ln{border-collapse:unset}.kbq-code-block__code .hljs-ln .hljs{padding:0}.kbq-code-block__code .hljs-ln-numbers{vertical-align:baseline;text-align:right}.kbq-code-block__code .hljs-ln-n:before{white-space:nowrap}.kbq-code-block__show-more{display:flex;justify-content:center;overflow:hidden;width:calc(100% - var(--kbq-code-block-size-container-border-width, 1px) * 2);position:absolute;bottom:var(--kbq-code-block-size-container-border-width, 1px);border-radius:var(--kbq-code-block-size-container-border-radius, 12px)}.kbq-code-block__show-more.kbq-code-block__show-more_collapsed{padding-top:var(--kbq-code-block-size-collapse-collapsed-padding-top, 32px);padding-bottom:var(--kbq-code-block-size-collapse-collapsed-padding-bottom, 16px)}.kbq-code-block__show-more.kbq-code-block__show-more_expanded{padding-top:var(--kbq-code-block-size-collapse-expanded-padding-top, 0);margin-bottom:var(--kbq-code-block-size-collapse-expanded-padding-bottom, 16px)}.kbq-code-block__show-more .bg-wrapper{border-radius:var(--kbq-button-size-border-radius, 8px)}\n"] }]
263
+ }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.Clipboard }, { type: i0.Renderer2 }, { type: i2$1.FocusMonitor }, { type: undefined, decorators: [{
221
264
  type: Optional
222
265
  }, {
223
266
  type: Inject,